- Simplified Selector component usage in SettingsTab by removing deprecated props and updating to the new API.
- Added size and label props to enhance accessibility and user experience.
- Ensured consistent handling of selected keys and selection change events across multiple instances of Selector.
* refactor(eslint): reorganize eslint config for better maintainability
Move ignores section and oxlint configs to be grouped with other configurations
* fix(eslint): update antd import restriction to include Switch
Add Switch to restricted imports from antd to enforce using custom components
* feat(ui): add Switch component wrapper and update imports
Add a wrapper for the Switch component from @heroui/react and export it through @cherrystudio/ui. Update eslint rules to prevent direct imports from @heroui/react and update imports in TranslateSettings to use the new wrapper
* refactor(ui): replace antd Switch with custom Switch component
Migrate all instances of antd Switch component to the custom Switch component from @cherrystudio/ui. This includes updating props from `checked` to `isSelected` and `onChange` to `onValueChange` to match the new component's API. Also updates size prop from `small` to `sm` where applicable.
The change ensures consistency across the UI and reduces dependency on antd components. All affected files have been updated to use the new Switch component with proper prop mappings.
* feat(ui): enhance Switch component with loading state
Add loading state support to Switch component by showing a spinner when isLoading is true and disabling interaction during loading. Update all Switch component usages to use the new isLoading prop instead of loading.
* fix(Switch): prevent thumbIcon override when isLoading is true
Implement type constraints to disallow thumbIcon when isLoading is true
Add ref forwarding support and export enhanced props type
* fix(settings): update Switch component props to use consistent naming
Change deprecated 'defaultChecked' and 'disabled' props to 'defaultSelected' and 'isDisabled' respectively to match component library updates
* refactor(Switch): simplify type definition by removing redundant ref prop
* refactor(Switch): simplify props type definition for loading state
Remove complex union type in favor of simpler interface extending SwitchProps
* docs(ui): add jsdoc for CustomizedSwitch component
Add documentation for the CustomizedSwitch component to clarify its purpose and the isLoading prop usage
* fix(eslint): comment out heroui import restriction rule
Temporarily disable the heroui import restriction to allow direct imports while wrapped components are being updated
* style: fix formatting and spacing in settings components
- Replaced the existing Selector component with a new implementation using HeroUI's Select and SelectItem.
- Updated the props structure to support items and selection change handling.
- Added a new story file for the Selector component, showcasing various use cases including single and multiple selection modes, size variations, and disabled states.
- Improved type definitions for better clarity and usability.
* refactor(components): rename HStack and VStack to RowFlex and ColFlex for clarity
rename HStack to RowFlex and VStack to ColFlex across all components to better reflect their purpose as flex containers with row and column directions. This improves code readability and maintainability while keeping the same functionality. All references to these components have been updated accordingly.
* refactor(layout): migrate layout components from .ts to .tsx
The layout components have been moved from TypeScript (.ts) to TypeScript with JSX (.tsx) to better support JSX syntax and improve type safety. The functionality remains unchanged.
* refactor(Layout): convert styled Box component to functional component
Improve maintainability by converting styled-component to a functional component with explicit style props. This provides better type safety through CSSProperties interface and makes the component easier to debug.
* refactor(Layout): restructure Box component and convert styled components to functional
- Replace styled-components with functional components for Stack and Center
- Rename style variable to _style in Box component to avoid naming conflict
- Add style prop to Box component to allow external style overrides
* refactor(components): rename HSpaceBetweenStack to SpaceBetweenRowFlex for clarity
* refactor(Layout): pass through props in Stack components
Allow additional props to be passed to Stack and its variants for better flexibility. Convert RowFlex from styled component to regular component for consistency.
* refactor(Layout): convert SpaceBetweenRowFlex from styled to component
Improve maintainability by converting styled component to a regular component that explicitly passes justifyContent prop
* refactor(Layout): convert ColFlex to component and type RowFlex props
Improve type safety by explicitly omitting flexDirection from StackProps and convert ColFlex from styled component to regular component for consistency
* refactor(Layout): convert BaseTypography from styled to component
Improve type safety and maintainability by converting styled component to regular React component with TypeScript interface
* refactor(Layout): remove unused BaseTypography component
* refactor(Layout): remove unused Container component and interface
* refactor(layout): rename Stack to Flex and use CSSProperties types
The Stack component was renamed to Flex to better reflect its purpose and align with common naming conventions. The interface properties were also updated to use CSSProperties types for better type safety and consistency with CSS standards.
* refactor(Layout): move FlexProps interface and comment out unused ButtonProps
Clean up component interfaces by moving FlexProps closer to its usage and commenting out unused ButtonProps interface to reduce clutter
* refactor(layout): standardize flex props from alignItems/justifyContent to align/justify
The changes standardize the flex-related props in the Layout component and across multiple files from using alignItems/justifyContent to the shorter align/justify. This improves consistency and reduces verbosity in the codebase while maintaining the same functionality.
All instances of alignItems have been replaced with align and justifyContent with justify in Flex, RowFlex, ColFlex and related components. The changes are purely syntactic and do not affect the actual layout behavior.
This refactoring makes the code more maintainable by using a consistent naming convention for flex properties throughout the application.
* refactor(Layout): extend BoxProps with React div props
* feat(Layout): add flexWrap prop to Flex component interface
Add flexWrap property to FlexProps interface to support CSS flex-wrap functionality. Also replace antd Flex with custom Flex component in TagFilterSection.
* refactor(components): replace antd Flex with custom Layout components
Consolidate Flex component usage across multiple files by replacing antd's Flex with custom Layout components (Flex, ColFlex, RowFlex) for better maintainability and consistency
* refactor(components): migrate antd Flex tu custom Flex
* refactor(components): update layout component usage for consistency
replace RowFlex with ColFlex where appropriate and align prop names
* refactor(tests): rename HStack to RowFlex in test components
Update test snapshots and mock components to reflect the component name change from HStack to RowFlex
Remove unused data-vertical attribute from preview container
* refactor(Layout): pass through props and merge styles in Box and Flex components
Improve component flexibility by allowing additional props to pass through and properly merging style objects in both Box and Flex components
* refactor(Layout): make Flex component props optional with undefined defaults
* test: update TagFilterSection snapshot to include wrap style
* perf(Layout): optimize Box component style calculation with useMemo
* docs: fix typo in Layout component comment
* refactor(Layout): update BoxProps to use CSSProperties types
Standardize prop types by using CSSProperties for style-related props to improve type safety and consistency with React's style system
* feat(Layout): add wrap prop to Flex component
* style(TagFilterSection): update snapshot styling to use flex-wrap property
* refactor(Layout): simplify layout components by using Tailwind CSS classes
Remove custom style calculations and props in favor of Tailwind utility classes
* refactor: replace inline styles with Tailwind CSS classes for consistent styling
style: update spacing and alignment utilities across components
* refactor(tests): update test snapshots to use tailwind classes
Replace inline styles with tailwind classes in test snapshots and update test assertions to match. This improves consistency with the codebase's styling approach.
* style: adjust spacing and gaps in UI components for consistency
* style: replace inline styles with tailwind classes for consistency
Refactor various components to use tailwind classes instead of inline styles to maintain consistency and improve readability. Changes include:
- Replacing style attributes with tailwind classes for spacing, margins, and padding
- Standardizing gap sizes across components
- Using tailwind for width, height, and other layout properties
- Updating test files to match new class names
* style(settings): replace inline styles with tailwind classes for consistency
Refactor settings components to use tailwind gap utility instead of inline styles for better maintainability and consistency across the codebase
* refactor(styles): replace inline styles with tailwind classes for consistency
* feat(eslint): add rule to restrict antd Flex imports
Enforce using custom Layout components instead of antd's Flex by adding a restricted import rule
* refactor: migrate flex layout from antd props to tailwind classes
- Replace antd Flex component props with tailwind classes for consistency
- Update gap and alignment values to use tailwind's spacing scale
- Remove unused antd Flex imports to clean up dependencies
* style(settings): adjust spacing and layout in various settings components
- Add gap spacing between elements in multiple settings components
- Remove redundant flex class in some components
- Standardize gap sizes across related components
* refactor(ui): replace inline styles with tailwind classes for consistency
Replace various inline style attributes with equivalent tailwind classes across multiple components to maintain consistent styling approach. Changes include margin, padding, width, and flex properties.
- Convert style attributes to tailwind classes
- Standardize spacing values using tailwind's spacing scale
- Improve maintainability by using utility classes
* style(ui): adjust spacing in model list group header
* style(css): wrap base styles in @layer for better organization
* style(css): fix indentation and nesting in global styles
* style(settings): adjust spacing in model list and convert subtitle to cn
Refactor SettingSubtitle to use cn utility for better className handling
Add gap spacing between model list items for improved layout
* style(css): move some styles from base layer to outer in index.css
* refactor(components): replace HStack with RowFlex for consistency
Update layout components to use RowFlex instead of HStack to maintain consistent naming
* style: reorder imports in useAppInit and BaseApiClient files
* fix(MinAppTabsPool): wrong import path
* refactor: update style file extensions from scss to css
Update file extensions and comments to reflect the change from SCSS to CSS stylesheets
* feat(layout): add Flex component and its variants
Introduce new Flex component with Box, RowFlex, SpaceBetweenRowFlex, ColFlex and Center variants to provide reusable layout components
* refactor: migrate layout components to @cherrystudio/ui package
This commit updates all imports of layout components (Box, Flex, RowFlex, ColFlex, etc.) from '@renderer/components/Layout' to '@cherrystudio/ui' across the codebase. The change also includes updating related test files and eslint configuration to reflect this migration. This refactoring aims to centralize layout components in a shared package for better maintainability and consistency.
* docs(eslint): update comment and restricted imports rule
Update comment to clarify the purpose of the rule and add a TODO note for future migration
* docs(ui): update migration status for layout components
Mark Layout/* components as migrated and refactored in both Chinese and English documentation
* docs: update migration status for Layout components
- Refactored CustomCollapse to utilize Accordion and AccordionItem from HeroUI, simplifying props and improving functionality.
- Updated ToolsCallingIcon to accept TooltipProps for better customization.
- Revised stories for CustomCollapse to reflect new prop structure and added examples for various use cases.
- Cleaned up unnecessary props and improved documentation in story files.
- Added @storybook/addon-themes to package.json and yarn.lock for theme support in Storybook.
- Updated CustomCollapse component to utilize HeroUI's Accordion and AccordionItem for improved functionality and styling.
- Removed the ReasoningIcon component as it was deemed unnecessary.
- Enhanced ProviderAvatar component to ensure consistent className handling.
- Added new stories for FileIcons, SvgSpinners180Ring, and ToolsCallingIcon to showcase their usage and variations.
* style(linter): enable consistent-type-imports rule in typescript
* chore: add biome to lint script for improved code formatting
* chore: add oxlint-specific lint script for faster linting
* refactor: use type-only imports for better type safety and clarity
- Increased the refactored component count to 18 and reduced pending migrations to 184 in the migration status files.
- Improved the Ellipsis, ListItem, MaxContextCount, and ThinkingEffect components by simplifying their structure and enhancing styling.
- Updated the tsconfig.json to adjust the root directory for better project organization.
- Removed unnecessary alias configurations in tsdown.config.ts for cleaner setup.
- Added new stories for Ellipsis and ListItem components to improve documentation and showcase their usage.
- Refactored EmojiIcon, ExpandableText, and ProviderAvatar components for better readability and consistency.
- Simplified JSX structure and improved styling in ExpandableText and EmojiAvatar stories.
- Enhanced code formatting in various files for improved maintainability.
- Updated migration status to reflect the migration of additional components, reducing the total migrated count to 34 and increasing the refactored count to 14.
- Enhanced component files by refactoring several components to improve structure and styling, including CopyButton, CustomTag, and IndicatorLight.
- Added new stories for components such as CopyButton, CustomCollapse, and DividerWithText to improve documentation and showcase usage.
- Adjusted TypeScript configuration to include story files for better type checking.
- Reformatted keywords and files array in package.json for better readability.
- Updated migration status to reflect the migration of additional components, increasing the total migrated count to 46 and reducing pending migrations to 190.
- Added new components to the migration status table, including ErrorBoundary and ProviderAvatar, while removing deprecated components like ErrorTag, SuccessTag, and WarnTag.
- Added "@typescript-eslint/visitor-keys@npm:8.43.0" to yarn.lock.
- Refactored getVirtualIndexes in DraggableVirtualList to use item.index.
- Replaced useSettings with usePreference for codeFancyBlock in SettingsTab.
- Updated Switch component to use setCodeFancyBlock directly.
- Added "packages/ui/scripts/**" to .oxlintrc.json for linting.
- Excluded ".claude/**" from biome.jsonc.
- Refactored API path types in apiPaths.ts for better clarity.
- Updated error handling in errorCodes.ts to ensure stack trace is always available.
- Modified preferenceSchemas.ts to include new features and updated generated timestamp.
- Cleaned up tsconfig.json for better organization.
- Adjusted CustomTag component to improve rendering logic.
- Enhanced CodeEditor utility functions for better type safety.
- Improved Scrollbar story for better readability.
- Refactored CacheService to streamline comments and improve documentation.
- Updated useCache and useSharedCache hooks for better clarity and functionality.
- Cleaned up selectionStore and settings.ts by commenting out deprecated actions.
- Updated DataApiHookTests for better optimistic update handling.
* refactor(CodeEditor): decouple CodeEditor and global settings
* refactor: improve language extension fallbacks
* refactor: make a copy of CodeEditor in the ui package
* refactor: update ui CodeEditor and language list
* refactor: use CodeEditor from the ui package
* feat: add a story for CodeEditor
- Updated migration status documentation to reflect the migration of 43 components, with 193 pending.
- Enhanced the component status table with new entries for MaxContextCount, CollapsibleSearchBar, ImageToolButton, and InfoPopover.
- Added implementations for the new components, improving the UI library's functionality.
- Updated index.ts to export the newly added components for better accessibility.
- Updated migration status documentation to reflect the migration of 38 components, with 198 pending.
- Enhanced the component status table with new entries for ListItem and EditableNumber.
- Added ListItem and EditableNumber components with their respective implementations and styles.
- Updated index.ts to export the newly added components for improved accessibility.
- Updated migration status documentation to reflect the migration of 36 components, with 200 pending.
- Enhanced the component status table with new entries for CustomCollapse, EmojiAvatar, ResetIcon, OcrIcon, ToolIcon, WrapIcon, UnWrapIcon, HelpTooltip, Selector, and WarnTooltip.
- Updated index.ts to export the newly added components for improved accessibility.
- Updated migration status documentation to reflect the migration of 26 components, with 210 pending.
- Enhanced the component status table with detailed descriptions and categorized components.
- Introduced new components: CustomTag, ErrorTag, SuccessTag, WarnTag, CopyIcon, DeleteIcon, EditIcon, and RefreshIcon.
- Updated index.ts to export the newly added components for improved accessibility.
- Introduced migration status documentation in both English and Chinese to track the progress of the UI component library migration.
- Added new UI components including CopyButton, DividerWithText, EmojiIcon, IndicatorLight, Spinner, TextBadge, and various display and icon components.
- Updated the index.ts file to export the newly added components for easier access.
- Enhanced the directory structure and component classification guidelines for better organization and clarity.
- Introduced a new UI component library for Cherry Studio, including various components such as buttons, inputs, and layout elements.
- Updated configuration files to include the new library and its dependencies.
- Enhanced the project structure to support modular imports and TypeScript definitions for better development experience.
