UNPKG

@wix/design-system

Version:

@wix/design-system

69 lines (66 loc) 2.23 kB
### dataHook - type: string - description: Applied as data-hook HTML attribute that can be used to create driver in testing. ### hideShadow - type: boolean - description: Hide Accordion shadow effect - default: false ### contentPadding - type: "none" - description: Targets Accordion Item content padding. When not provided, uses default paddings. ### horizontalPadding - type: "small" | "none" | "xxTiny" | "xTiny" | "tiny" | "medium" | "large" - description: Change horizontal padding ### items - type: AccordionItemType[] - description: Provide items - Available items props: ```javascript { render?: func; title?: React.ReactNode; subtitle?: React.ReactNode; icon?: React.ReactNode; children?: React.ReactNode; expandLabel?: React.ReactNode; collapseLabel?: React.ReactNode; showLabel?: 'hover' | 'always'; buttonType?: 'textButton' | 'button' | 'node'; disabled?: boolean; onToggle?: React.MouseEventHandler<HTMLElement>; onMouseEnter?: React.MouseEventHandler<HTMLElement>; onMouseLeave?: React.MouseEventHandler<HTMLElement>; open?: boolean; initiallyOpen?: boolean; } ``` ### multiple - type: boolean - description: allow multiple rows to be opened simultaneously - default: false ### onAnimationEnter - type: () => void - description: Callback fired immediately after the animation is started ### onAnimationExit - type: () => void - description: Callback fired immediately after the animation is ended ### size - type: "small" | "xxTiny" | "xTiny" | "tiny" | "medium" | "large" - description: Change items size - default: 'small' ### skin - type: "standard" | "light" | "neutral" - description: Accordion skin color ### transitionSpeed - type: "medium" | "slow" | "fast" - description: Change expand and collapse animation speed - default: 'medium' ### titleSize - type: "small" | "medium" - description: Accordion title and subtitle size - default: 'medium' ### ref - type: null | string | (instance: Accordion | null) => void | RefObject<Accordion> - description: Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref).