Closed kotAPI closed 4 days ago
The recent changes focus on enhancing the Accordion component's functionality and improving the consistency of styling and context management. Key changes include adding new contexts for accordion items, refactoring the Accordion
components to use these contexts, and updating the className handling for various subcomponents. Minor formatting adjustments have also been made to the ToggleGroup component and its related files. Additionally, new styles have been imported for the accordion.
File | Change Summary |
---|---|
src/components/ui/Accordion/Accordion.stories.js |
Added w-full flex-1 to the className attribute of a div element. |
.../AccordionContext.tsx |
Introduced AccordionContext using createContext from React. |
.../AccordionItemContext.tsx |
Introduced AccordionItemContext using createContext from React. |
.../AccordionContent.tsx |
Updated to use AccordionContext and changed prop customRootClass to className . |
.../AccordionHeader.tsx |
Renamed customHeaderClass prop to className and removed custom class switching logic. |
.../AccordionItem.tsx |
Refactored to use contexts for managing active items and updated class handling. |
.../AccordionRoot.tsx |
Integrated state management for active items using contexts and wrapped children in Provider . |
.../AccordionTrigger.tsx |
Used AccordionContext , updated prop name from customRootClass to className . |
.../ToggleGroup.stories.js |
Formatting changes including adding semicolons and adjusting indentation. |
.../ToggleGroup.tsx |
Added semicolons to import statements and function definitions. |
.../ToggleGroup/contexts/toggleContext.tsx |
Updated import statement for createContext , added semicolons. |
styles/themes/default.scss |
Added an import statement for accordion.scss , affecting styles. |
sequenceDiagram
participant User
participant AccordionRoot
participant AccordionItem
participant AccordionContext
User->>AccordionRoot: Load Component
AccordionRoot->>AccordionContext: Provide activeItem, setActiveItem
AccordionRoot->>AccordionItem: Render Item
AccordionItem->>AccordionContext: Consume activeItem
User->>AccordionItem: Click Item
AccordionItem->>AccordionContext: Update activeItem
AccordionContext->>AccordionRoot: Re-render with new activeItem
sequenceDiagram
participant User
participant ToggleGroup
participant ToggleContext
User->>ToggleGroup: Load Component
ToggleGroup->>ToggleContext: Create Context
ToggleGroup->>ToggleGroup: Render Items with Context
User->>ToggleGroup: Toggle Item
ToggleGroup->>ToggleContext: Update State
ToggleContext->>ToggleGroup: Reflect New State
In the land where components align,
Accordions wrapped in context so fine,
Classes now a breeze,
ToggleGroup in peace,
With styles that truly shine.
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?
All modified and coverable lines are covered by tests :white_check_mark:
Project coverage is 94.64%. Comparing base (
8230c45
) to head (37ef389
).
:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.
Summary by CodeRabbit
New Features
Refactor
className
for consistency.Style
ToggleGroup
components for better code readability.Chores
accordion.scss
to the main stylesheet to apply new styles.