Skip to content

Commit

Permalink
fix(accordion): fixes typing issue after update of radix
Browse files Browse the repository at this point in the history
Removed custom typing as caused complie issues, types document on storybook anyway.
  • Loading branch information
stuarthendren committed Oct 26, 2021
1 parent e6eed85 commit bb6ce79
Show file tree
Hide file tree
Showing 2 changed files with 4 additions and 36 deletions.
4 changes: 3 additions & 1 deletion src/components/Accordion/Accordion.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,9 @@ export default {
},
} as Meta

export const Default: Story = ({ ...args }) => {
export const Default: Story<React.ComponentProps<typeof Accordion>> = ({
...args
}) => {
return (
<Accordion {...args}>
<AccordionItem value="item-1">
Expand Down
36 changes: 1 addition & 35 deletions src/components/Accordion/Accordion.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,45 +24,11 @@ const Chevron = styled(ChevronDown, {
},
})

const StyledRoot = styled(Root, paperStyles, {
export const Accordion = styled(Root, paperStyles, {
boxShadow: '$1',
borderTop: '1px solid $colors$grey4',
})

type AccordionRootProps = Omit<ComponentProps<typeof Root>, 'type'> & {
/**
* Allow `single` or `multiple` sections to be open, defaults to 'single'
*/
type?: ComponentProps<typeof Root>['type']
/**
* Allow all elements to be collapsed.
* This is only relevant when type single.
* */
collapsible?: boolean
}
type AccordionProps = AccordionRootProps & CSSProps

export const Accordion = forwardRef<
ElementRef<typeof StyledRoot>,
AccordionProps
>(({ collapsible = true, type = 'single', ...props }, forwardedRef) => {
let additionalProps = {}
if (type == 'single' && collapsible) {
additionalProps = { collapsible: true }
}
return (
<StyledRoot
type={type}
{...additionalProps}
ref={forwardedRef}
{...props}
/>
)
})
Accordion.toString = () => `.${StyledRoot.className}`

// Typed explicitly to get props in storybook

export const AccordionItem = styled(Item, {
borderBottom: '1px solid $colors$grey4',
})
Expand Down

0 comments on commit bb6ce79

Please sign in to comment.