- Updated DialogContent styling to use a rounded border and improved shadow effects for better visual appeal.
- Introduced a new Storybook file for the Dialog component, featuring multiple stories that demonstrate various use cases, including default, alert, form, and customizable dialogs.
- Enhanced accessibility and usability by providing examples for different dialog configurations and actions.
* feat(input): add new input component and update eslint config
Add new custom input component to replace antd and heroui inputs
Update eslint config to enforce using the new input component
* feat(input): refactor input component to support compound pattern
Add new Input component with support for Password and Button variants through compound pattern. Move input implementation to new directory structure and enhance with label and caption support. Remove old input implementation.
* refactor(input): consolidate input components and update exports
Move input component files to lowercase directory and simplify structure
Remove unused button and password input components
Update exports in components index file
* refactor: replace antd Input with @cherrystudio/ui Input across components
* feat(primitives): add textarea component to ui primitives
* feat(primitives): add input-group component with variants and controls
build: update @radix-ui/react-slot dependency to v1.2.4
* refactor(ui): simplify input component and update usage
Remove complex Input component implementation and replace with simpler version
Update components to use new Input and Textarea components from ui package
* feat(ui): add composite input component and utility functions
- Introduce new CompositeInput component with variants and password toggle
- Add utility functions for null/undefined conversion
- Export new components and types from index
- Update input props interface and usage in input-group
* feat(Input): refactor CompositeInput component and add stories
- Refactor CompositeInput component with improved variants and styling
- Add comprehensive Storybook stories for Input, InputGroup and CompositeInput components
- Implement password toggle functionality and button variants
- Include accessibility features and interactive examples
* feat(input): improve disabled state styling and behavior
- Add disabled state variants for input components
- Ensure password toggle button respects disabled state
- Update disabled styling for better visual consistency
- Add storybook examples for disabled password inputs
* feat(input): add validation states and form examples
- Implement validation states for input components
- Add real-time validation examples
- Create form validation demos for different input types
- Update styling for disabled and invalid states
* feat(input): add prefix support for email variant input
Add prefix variants styling and prefix prop to CompositeInput component to support email inputs with fixed prefixes. Update stories to demonstrate various prefix use cases and interactive examples.
* refactor(Input): simplify content rendering logic by removing useMemo hooks
The startContent and endContent memoized values were removed and their logic was inlined directly in the JSX. This makes the code more straightforward and removes unnecessary memoization overhead since the calculations are simple.
* feat(Input): add select variant to CompositeInput component
Add new 'select' variant to CompositeInput component with support for select dropdown groups and items. Includes styling variants, type exports, and comprehensive storybook examples demonstrating various use cases like currency input, URL with protocol, phone with country code, and temperature with unit selectors.
* Revert "refactor: replace antd Input with @cherrystudio/ui Input across components"
This reverts commit f7f689b326.
* fix(CompositeInput): handle missing props gracefully by returning null
Add null checks for email and select variants to prevent rendering issues when required props are missing
* fix(Input): adjust select prefix and trigger styling
Update select prefix variants to remove redundant padding and simplify size variants. Add new selectTriggerVariants for consistent styling across sizes.
* feat(storybook): add playground story for InputGroup component
Add interactive playground story with controls for all InputGroup props including addons, button variants and input types
* style(primitives): remove redundant border radius from input group variants
* style(input): adjust button and label variant styling
Refactor variant classes to use string literals instead of arrays for better readability
* refactor(Input): simplify variant class strings in input component
---------
Co-authored-by: MyPrototypeWhat <daoquqiexing@gmail.com>
Co-authored-by: fullex <106392080+0xfullex@users.noreply.github.com>
* refactor(ui): migrate switch component from heroui to radix-ui
replace heroui switch implementation with radix-ui for better maintainability
update package.json and yarn.lock to include new dependency
* fix(eslint): enable heroui import restriction for deprecated Switch component
* refactor(ui): update Switch component props from isSelected/onValueChange to checked/onCheckedChange
Standardize Switch component props across the codebase to use checked/onCheckedChange instead of isSelected/onValueChange for better consistency with common React patterns. Also updates loading state prop from isLoading to loading and removes size prop where unnecessary.
The changes include:
- Replacing isSelected with checked
- Replacing onValueChange with onCheckedChange
- Updating isLoading to loading
- Removing redundant size props
- Adjusting styling to accommodate new loading state
* refactor(switch): improve switch component styling and structure
- Add default values for loading and disabled props
- Update styling classes and add group cursor pointer
- Restructure loading indicator and thumb positioning
- Wrap DescriptionSwitch children in flex container
* refactor(ui): improve switch component structure and usage
- Restructure DescriptionSwitch to use explicit props instead of children
- Add label, description, and position props for better customization
- Update all switch usages in SettingsTab to use new props format
* refactor(primitives): simplify switch props by omitting children
Remove redundant children prop from CustomSwitchProps since it's already omitted from the parent type
* fix(switch): add useId for label accessibility in DescriptionSwitch
Ensure proper label association with switch input by generating unique ID using React's useId hook
* refactor(settings): remove commented out SettingRowTitleSmall components
* refactor(SettingsTab): add todo comment for memoization optimization
* feat(switch): add size prop to customize switch dimensions
Add sm, md, and lg size options to the Switch component with corresponding styles. This allows for better visual consistency across different UI contexts.
* style(ui): adjust switch component styling and theme colors
update switch component layout and spacing to improve consistency
modify secondary-foreground color variable to use correct semantic token
* feat(switch): add new switch component styles and animations
- Add new switch.css file with gradient and transition styles
- Update switch.tsx component with new styling classes and animations
- Remove loader icon in favor of animated gradient effect
* fix(i18n): Auto update translations for PR #11061
* style(primitives): remove redundant border style from switch component
* refactor(switch): remove switch.css and update switch component styles
Remove deprecated switch.css file and migrate styles to inline tailwind classes. Update disabled state styling to use opacity instead of linear gradient for better consistency.
* refactor(switch): simplify switch thumb implementation
Replace complex div structure with svg for loading state
Adjust disabled opacity and loading state styling
* style(switch): adjust thumb size and positioning for better consistency
* feat(switch): add storybook documentation for switch component
Add comprehensive Storybook documentation for the Switch component, including:
- Basic usage examples
- Different states (checked, disabled, loading)
- Size variations
- DescriptionSwitch variant
- Real-world usage scenarios
- Accessibility examples
- Form integration examples
Also remove redundant box-content class from switch styles
* fix(switch): adjust thumb positioning for md and lg sizes
* style(primitives): improve switch component styling and spacing
- Add padding to the container
- Simplify label height logic
- Update typography classes for better consistency
- Adjust switch container alignment
* feat(switch): add size prop to DescriptionSwitch component
Add support for sm, md, and lg sizes to DescriptionSwitch component with responsive text sizing. Also includes comprehensive Storybook documentation with examples of all sizes and states.
* style(switch): align label text to right when isLeftSide is true
* refactor(stories): clean up DescriptionSwitch stories by removing unused imports and simplifying JSX
* refactor(ui): rename CustomizedSwitch to Switch for consistency
Simplify component naming by removing redundant 'Customized' prefix and aligning with common naming conventions
* refactor(switch): extract switch root styles into cva variants
Improve maintainability by using class-variance-authority to manage switch root styles and variants
* refactor(switch): extract thumb variants into separate cva function
Improve maintainability by moving switch thumb styling logic into a dedicated variants configuration. This makes the component more readable and easier to modify.
* feat(switch): add classNames prop for custom styling
Allow custom class names to be applied to switch root, thumb, and thumbSvg elements for more flexible styling options.
* feat(switch): add loading animation variants for switch thumb
Extract loading animation logic into separate cva variants for better maintainability and reusability
---------
Co-authored-by: GitHub Action <action@github.com>
- Introduced a new Tabs component along with TabsList, TabsTrigger, and TabsContent for improved content organization.
- Updated package.json and yarn.lock to include @radix-ui/react-tabs dependency.
- Enhanced index.ts to export the new Tabs components for easier access in the UI library.
- Created stories for the Tabs component in Storybook to demonstrate various usage scenarios.
- Introduced a new Breadcrumb component along with BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, and BreadcrumbEllipsis.
- Updated index.ts to export the new Breadcrumb components for easier access in the UI library.
- Added 'migration_completed' stage to the migration process for better tracking of completion.
- Updated relevant components and hooks to handle the new stage, including UI changes to confirm migration completion.
- Adjusted messages and progress indicators to reflect the new stage in the migration workflow.
- Exported the new Pagination component from the index file to make it available for use.
- Updated the PaginationLink styles to improve hover effects and active state visibility, enhancing user experience.
- Updated the @radix-ui/react-slot dependency in package.json and yarn.lock to version 1.2.4.
- Introduced a new Pagination component with associated subcomponents (PaginationContent, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PaginationEllipsis).
- Added stories for the Pagination component to demonstrate various use cases and configurations.
- Introduced a new Tooltip component along with TooltipProvider, TooltipTrigger, and TooltipContent for improved user interface interactions.
- Implemented NormalTooltip for easier usage with customizable content and positioning options.
- Integrated Radix UI's tooltip primitives for better accessibility and performance.
- Introduced a new Kbd component to display keyboard shortcuts, supporting both single keys and key combinations.
- Added KbdGroup for grouping multiple Kbd components together.
- Updated package.json to include @radix-ui/react-tooltip version 1.2.8.
- Created stories for Kbd component showcasing various use cases, including integration with Tooltip for enhanced user guidance.
- Exported CheckedState type from the checkbox component for better type management.
- Added checkbox and combobox components to the main component index for easier access.
- Updated Storybook examples to utilize the CheckedState type for controlled checkbox states.
- Introduced a new checkbox component utilizing Radix UI, allowing for customizable sizes and states.
- Implemented styles using class-variance-authority for consistent design across different sizes (sm, md, lg).
- Added comprehensive Storybook stories demonstrating various use cases, including default, checked, disabled, and controlled states.
- Updated package.json and yarn.lock to include the new Radix UI checkbox dependency.
- Introduced size variants for RadioGroupItem using class-variance-authority for better customization.
- Updated RadioGroupItem to accept size prop and adjusted styles accordingly.
- Added comprehensive Storybook stories for various use cases, including default, disabled, and size variations, to demonstrate component functionality and usage.
- Refactored the combobox and select components to utilize Tailwind CSS utility classes for consistent styling.
- Added 'text-foreground' class to enhance text visibility in both components.
- Streamlined the default styles for better maintainability and adherence to the new design system.
- Updated SettingsTab to utilize the new Select component instead of the deprecated Selector.
- Enhanced Select integration with SelectTrigger, SelectContent, SelectItem, and SelectValue for improved functionality.
- Removed Selector imports and related code to streamline the component structure.
- Adjusted styles and layout for better user experience in the settings interface.
- Adjusted border radius for SelectContent to 'rounded-2xs' for a more modern look.
- Enhanced SelectItem styles to include a background color for checked state.
- Updated CheckIcon color to 'text-primary' for better visibility in the SelectItem.
- Added a new Select component based on Radix UI, including SelectTrigger, SelectContent, SelectItem, and SelectValue.
- Implemented support for groups and separators within the Select component.
- Updated package.json to include @radix-ui/react-select as a dependency.
- Removed deprecated Selector and SearchableSelector components to streamline the codebase.
- Added stories for the Select component to showcase various use cases and configurations.
- Updated button variants for improved hover effects and accessibility, including aria-loading support.
- Refined combobox trigger styles for better visibility and consistency, including adjustments to error state styling and input placeholder appearance.
- Improved overall class management and organization for both components.
- Modified default combobox trigger styles for improved visibility and consistency.
- Updated background and text colors in the combobox options for better accessibility.
- Cleaned up unused CSS variables in tailwind.css, retaining only those necessary for theme usage.
- Enhanced comments for clarity in the CSS files.
- Adjusted button outline variant for consistency in dark mode styling.
- Removed unnecessary background color from combobox trigger for cleaner appearance.
- Updated comments in the theme CSS file for clarity and consistency.
- Removed unnecessary background color from default combobox trigger variant for cleaner styling.
- Added a white background to the combobox trigger for improved visibility.
- Updated comments in the CSS file to enhance clarity and consistency in English.
- Changed button size properties to use min-height for better layout consistency.
- Simplified combobox size properties by removing height specifications.
- Enhanced combobox option rendering with improved class management for better styling.
- Updated comments in ComboboxProps to English for clarity.
- Introduced a new Combobox component that supports single and multiple selections, search functionality, and customizable rendering of options.
- Implemented variants for different states (default, error, disabled) and sizes (small, default, large).
- Added a demo and Storybook stories to showcase various use cases and states of the Combobox.
- Deleted the todocss.css file as it was no longer needed.
- Updated Storybook main.ts to include path aliasing for better module resolution.
- Removed deprecated stories and components, streamlining the codebase.
- Added new stories for CodeEditor, Ellipsis, ExpandableText, and other components to enhance documentation and showcase functionality.
- Added loading state support to the Button component, allowing for a spinner to be displayed when the button is in a loading state.
- Introduced props for custom loading icons and adjusted button behavior to disable when loading.
- Updated various components to utilize the new loading feature for better user experience during asynchronous actions.
- Added deprecation comments to several components and icons due to low usage (≤2 times), indicating plans for removal in future versions.
- Components affected include EditableNumber, MaxContextCount, Sortable, ThinkingEffect, FileIcons, ToolIcon, and others.
- Suggested alternatives or direct usage of other components where applicable.
- Added new components including CodeEditor, CollapsibleSearchBar, and DraggableList.
- Removed obsolete components such as Button, CustomCollapse, and StatusTag.
- Updated migration status documentation and adjusted component exports.
- Enhanced package.json dependencies for better compatibility.