@semcore/accordion 17.0.0-prerelease.31 → 17.0.0-prerelease.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/lib/cjs/Accordion.js +4 -8
  3. package/lib/cjs/Accordion.js.map +1 -1
  4. package/lib/cjs/Accordion.type.js.map +1 -1
  5. package/lib/es6/Accordion.js +4 -8
  6. package/lib/es6/Accordion.js.map +1 -1
  7. package/lib/es6/Accordion.type.js.map +1 -1
  8. package/lib/esm/Accordion.mjs +5 -9
  9. package/lib/types/Accordion.d.ts +28 -5
  10. package/lib/types/Accordion.type.d.ts +8 -4
  11. package/package.json +6 -6
  12. package/lib/cjs/Accordion.internal.type.js +0 -2
  13. package/lib/cjs/Accordion.internal.type.js.map +0 -1
  14. package/lib/es6/Accordion.internal.type.js +0 -2
  15. package/lib/es6/Accordion.internal.type.js.map +0 -1
  16. package/lib/types/Accordion.internal.type.d.ts +0 -11
package/CHANGELOG.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
- ## [17.0.0] - 2026-03-27
5
+ ## [17.0.0] - 2026-04-08
6
6
 
7
7
  ### BREAK
8
8
 
package/lib/cjs/Accordion.js CHANGED
@@ -214,14 +214,10 @@ function ToggleButton(props) {
214
214
  const {
215
215
  styles
216
216
  } = props;
217
- const SToggleButton = _baseComponents.Flex;
218
- return _ref7 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(SToggleButton, _ref7.cn("SToggleButton", {
219
- ...(0, _core.assignProps)({
220
- "alignItems": 'center',
221
- "role": 'button',
222
- ...props
223
- }, _ref3)
224
- }));
217
+ return _ref7 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(_baseComponents.Flex, (0, _core.assignProps)({
218
+ "alignItems": 'center',
219
+ "role": 'button'
220
+ }, _ref3));
225
221
  }
226
222
  function Collapse(props) {
227
223
  var _ref4 = arguments[0];
package/lib/cjs/Accordion.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Accordion.js","names":["_core","require","_baseComponents","_uniqueID","_interopRequireDefault","_useCssVariable","_l","_m","_typography","_react","style","sstyled","insert","RootAccordion","Component","constructor","args","_defineProperty2","default","newValue","value","asProps","Array","isArray","indexOfNewValue","indexOf","result","push","splice","handlers","uncontrolledProps","getItemProps","selectedValue","duration","use","selected","includes","$handleInteraction","handleToggleInteraction","render","Children","createElement","defaultValue","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","RootItem","getToggleProps","uid","disabled","onClick","undefined","handleClick","id","tag","size","tabIndex","getToggleButtonProps","getCollapseProps","getChevronProps","exports","uniqueIDEnhancement","Toggle","React","createRef","event","key","toggleRef","current","target","currentTarget","click","preventDefault","_ref","_ref5","styles","SItemToggle","Text","cn","assignProps","handleKeyDown","Chevron","props","_ref2","arguments[0]","_ref6","SItemChevron","ChevronRightL","ChevronRightM","ToggleButton","_ref3","_ref7","SToggleButton","Flex","Collapse","_ref4","visible","CollapseAnimate","Item","createComponent","Accordion","wrapAccordion","wrapper","_default"],"sources":["../../src/Accordion.tsx"],"sourcesContent":["import { Collapse as CollapseAnimate, Flex } from '@semcore/base-components';\nimport type { Intergalactic, IRootComponentProps } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronRightL from '@semcore/icon/ChevronRight/l';\nimport ChevronRightM from '@semcore/icon/ChevronRight/m';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport type {\n AccordionCollapsePropsInternal,\n AccordionItemPropsInternal,\n AccordionItemTogglePropsInternal,\n} from './Accordion.internal.type';\nimport type {\n AccordionCollapseProps,\n AccordionComponent,\n AccordionHandlers,\n AccordionItemComponent,\n AccordionItemProps,\n AccordionItemToggleProps,\n AccordionProps,\n ChevronItemProps,\n IntergalacticAccordionComponent,\n} from './Accordion.type';\nimport style from './style/accordion.shadow.css';\n\nclass RootAccordion extends Component<AccordionProps, typeof RootAccordion.enhance, AccordionHandlers> {\n static displayName = 'Accordion';\n static style = style;\n static defaultProps = {\n defaultValue: [],\n use: 'secondary',\n };\n\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-accordion',\n fallback: '200',\n map: (value: string) => `${Number.parseInt(value)}`,\n prop: 'duration',\n }),\n ] as const;\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n handleToggleInteraction = (newValue: AccordionItemProps['value']) => {\n const { value } = this.asProps;\n\n if (Array.isArray(value)) {\n const indexOfNewValue = value.indexOf(newValue);\n const result = [...value];\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n indexOfNewValue === -1 ? result.push(newValue) : result.splice(indexOfNewValue, 1);\n this.handlers.value(result);\n } else {\n this.handlers.value(value === newValue ? null : newValue);\n }\n };\n\n getItemProps({ value }: AccordionItemProps) {\n const { value: selectedValue, duration, use } = this.asProps;\n const selected = Array.isArray(selectedValue)\n ? selectedValue.includes(value)\n : selectedValue === value;\n\n return {\n selected,\n duration,\n use,\n $handleInteraction: this.handleToggleInteraction,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nexport class RootItem extends Component<AccordionItemProps, typeof RootItem.enhance, {}, AccordionItemPropsInternal> {\n static displayName = 'Item';\n static style = style;\n static enhance = [uniqueIDEnhancement()] as const;\n\n handleClick = () => {\n const { value, $handleInteraction } = this.asProps;\n\n $handleInteraction(value);\n };\n\n getToggleProps() {\n const { value, uid, disabled, use } = this.asProps;\n return {\n use,\n disabled,\n onClick: disabled ? undefined : this.handleClick,\n id: `igc-${uid}-${value}-toggle`,\n tag: 'h3',\n size: 300,\n tabIndex: disabled ? -1 : 0,\n };\n }\n\n getToggleButtonProps() {\n const { value, uid, selected, disabled } = this.asProps;\n return {\n disabled,\n 'id': `igc-${uid}-${value}-toggle-button`,\n 'aria-expanded': selected ? 'true' : 'false',\n 'aria-controls': selected ? `igc-${uid}-${value}-collapse` : undefined,\n };\n }\n\n getCollapseProps() {\n const { selected, uid, duration, value } = this.asProps;\n return {\n selected,\n duration,\n 'id': `igc-${uid}-${value}-collapse`,\n 'role': 'region',\n 'aria-labelledby': `igc-${uid}-${value}-toggle-button`,\n };\n }\n\n getChevronProps() {\n const { selected, size } = this.asProps;\n return {\n selected,\n size,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nclass Toggle extends Component<AccordionItemToggleProps, never, {}, AccordionItemTogglePropsInternal> {\n toggleRef = React.createRef();\n\n handleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>) => {\n if (event.key === 'Enter') {\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n } else if (event.key === ' ') {\n event.preventDefault();\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n }\n };\n\n render() {\n const { styles, use } = this.asProps;\n const SItemToggle = Root;\n\n return sstyled(styles)(\n <SItemToggle\n use={use}\n ref={this.toggleRef}\n render={Text}\n innerOutline\n onKeyDown={this.handleKeyDown}\n />,\n );\n }\n}\n\nfunction Chevron(props: ChevronItemProps) {\n const { styles, size } = props;\n\n const SItemChevron = Root;\n return sstyled(styles)(<SItemChevron render={size === 'l' ? ChevronRightL : ChevronRightM} />);\n}\n\nfunction ToggleButton(props: IRootComponentProps) {\n const { styles } = props;\n\n const SToggleButton = Root;\n return sstyled(styles)(\n <SToggleButton alignItems='center' render={Flex} role='button' {...props} />,\n );\n}\n\nfunction Collapse(props: AccordionCollapseProps & AccordionCollapsePropsInternal) {\n const { selected } = props;\n const visible = selected;\n\n return (\n <Root\n render={CollapseAnimate}\n visible={visible}\n interactive\n inert={!visible ? '' : undefined}\n aria-hidden={!visible}\n />\n );\n}\n\nconst Item = createComponent(RootItem, {\n Toggle,\n Chevron,\n ToggleButton,\n Collapse,\n}) as AccordionItemComponent;\n\nconst Accordion = createComponent(RootAccordion, {\n Item,\n}) as unknown as AccordionComponent;\n\nexport const wrapAccordion = <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticAccordionComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => wrapper as IntergalacticAccordionComponent<PropsExtending>;\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Accordion.js","names":["_core","require","_baseComponents","_uniqueID","_interopRequireDefault","_useCssVariable","_l","_m","_typography","_react","style","sstyled","insert","RootAccordion","Component","constructor","args","_defineProperty2","default","newValue","value","asProps","Array","isArray","indexOfNewValue","indexOf","result","push","splice","handlers","uncontrolledProps","getItemProps","selectedValue","duration","use","selected","includes","$handleInteraction","handleToggleInteraction","render","Children","createElement","defaultValue","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","RootItem","getToggleProps","uid","disabled","onClick","undefined","handleClick","id","tag","size","tabIndex","getToggleButtonProps","getCollapseProps","getChevronProps","exports","uniqueIDEnhancement","Toggle","React","createRef","event","key","toggleRef","current","target","currentTarget","click","preventDefault","_ref","_ref5","styles","SItemToggle","Text","cn","assignProps","handleKeyDown","Chevron","props","_ref2","arguments[0]","_ref6","SItemChevron","ChevronRightL","ChevronRightM","ToggleButton","_ref3","_ref7","Flex","Collapse","_ref4","visible","CollapseAnimate","Item","createComponent","Accordion","wrapAccordion","wrapper","_default"],"sources":["../../src/Accordion.tsx"],"sourcesContent":["import { Collapse as CollapseAnimate, Flex } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronRightL from '@semcore/icon/ChevronRight/l';\nimport ChevronRightM from '@semcore/icon/ChevronRight/m';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport type {\n AccordionComponent,\n AccordionHandlers,\n AccordionItemChevronComponent,\n AccordionItemCollapseComponent,\n AccordionItemComponent,\n AccordionItemProps,\n AccordionItemToggleButtonComponent,\n AccordionItemToggleComponent,\n IntergalacticAccordionComponent,\n} from './Accordion.type';\nimport style from './style/accordion.shadow.css';\n\nclass RootAccordion extends Component<\n Intergalactic.InternalTypings.InferComponentProps<IntergalacticAccordionComponent>,\n typeof RootAccordion.enhance,\n AccordionHandlers\n> {\n static displayName = 'Accordion';\n static style = style;\n static defaultProps = {\n defaultValue: [],\n use: 'secondary',\n };\n\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-accordion',\n fallback: '200',\n map: (value: string) => `${Number.parseInt(value)}`,\n prop: 'duration',\n }),\n ] as const;\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n handleToggleInteraction = (newValue: AccordionItemProps['value']) => {\n const { value } = this.asProps;\n\n if (Array.isArray(value)) {\n const indexOfNewValue = value.indexOf(newValue);\n const result = [...value];\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n indexOfNewValue === -1 ? result.push(newValue) : result.splice(indexOfNewValue, 1);\n this.handlers.value(result);\n } else {\n this.handlers.value(value === newValue ? null : newValue);\n }\n };\n\n getItemProps({ value }: AccordionItemProps) {\n const { value: selectedValue, duration, use } = this.asProps;\n const selected = Array.isArray(selectedValue)\n ? selectedValue.includes(value)\n : selectedValue === value;\n\n return {\n selected,\n duration,\n use,\n $handleInteraction: this.handleToggleInteraction,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\nexport class RootItem extends Component<\n Intergalactic.InternalTypings.InferChildComponentProps<AccordionItemComponent, typeof RootAccordion, 'Item'>,\n typeof RootItem.enhance\n> {\n static displayName = 'Item';\n static style = style;\n static enhance = [uniqueIDEnhancement()] as const;\n\n handleClick = () => {\n const { value, $handleInteraction } = this.asProps;\n\n $handleInteraction(value);\n };\n\n getToggleProps() {\n const { value, uid, disabled, use } = this.asProps;\n return {\n use,\n disabled,\n onClick: disabled ? undefined : this.handleClick,\n id: `igc-${uid}-${value}-toggle`,\n tag: 'h3',\n size: 300,\n tabIndex: disabled ? -1 : 0,\n };\n }\n\n getToggleButtonProps() {\n const { value, uid, selected, disabled } = this.asProps;\n return {\n disabled,\n 'id': `igc-${uid}-${value}-toggle-button`,\n 'aria-expanded': selected ? 'true' : 'false',\n 'aria-controls': selected ? `igc-${uid}-${value}-collapse` : undefined,\n };\n }\n\n getCollapseProps() {\n const { selected, uid, duration, value } = this.asProps;\n return {\n selected,\n duration,\n 'id': `igc-${uid}-${value}-collapse`,\n 'role': 'region',\n 'aria-labelledby': `igc-${uid}-${value}-toggle-button`,\n };\n }\n\n getChevronProps() {\n const { selected, size } = this.asProps;\n return {\n selected,\n size,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nclass Toggle extends Component<\n Intergalactic.InternalTypings.InferChildComponentProps<AccordionItemToggleComponent, typeof RootItem, 'Toggle'>\n> {\n toggleRef = React.createRef();\n\n handleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>) => {\n if (event.key === 'Enter') {\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n } else if (event.key === ' ') {\n event.preventDefault();\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n }\n };\n\n render() {\n const { styles, use } = this.asProps;\n const SItemToggle = Root;\n\n return sstyled(styles)(\n <SItemToggle use={use} ref={this.toggleRef} render={Text} innerOutline onKeyDown={this.handleKeyDown} />,\n );\n }\n}\n\nfunction Chevron(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n AccordionItemChevronComponent,\n typeof RootItem,\n 'Chevron'\n >,\n) {\n const { styles, size } = props;\n\n const SItemChevron = Root;\n return sstyled(styles)(<SItemChevron render={size === 'l' ? ChevronRightL : ChevronRightM} />);\n}\n\nfunction ToggleButton(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n AccordionItemToggleButtonComponent,\n typeof RootItem,\n 'ToggleButton'\n >,\n) {\n const { styles } = props;\n\n return sstyled(styles)(\n <Root render={Flex} alignItems='center' role='button' />,\n );\n}\n\nfunction Collapse(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n AccordionItemCollapseComponent,\n typeof RootItem,\n 'Collapse'\n >,\n) {\n const { selected } = props;\n const visible = selected;\n\n return (\n <Root\n render={CollapseAnimate}\n visible={visible}\n interactive\n inert={!visible ? '' : undefined}\n aria-hidden={!visible}\n />\n );\n}\n\nconst Item = createComponent(RootItem, {\n Toggle,\n Chevron,\n ToggleButton,\n Collapse,\n}) as AccordionItemComponent;\n\nconst Accordion = createComponent(RootAccordion, {\n Item,\n}) as unknown as AccordionComponent;\n\nexport const wrapAccordion = <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticAccordionComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => wrapper as IntergalacticAccordionComponent<PropsExtending>;\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
package/lib/cjs/Accordion.type.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Accordion.type.js","names":[],"sources":["../../src/Accordion.type.ts"],"sourcesContent":["import type { BoxProps, FlexProps, Flex } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { Text } from '@semcore/typography';\nimport type { Property } from 'csstype';\n\nexport type AccordionValue = null | number | string | Array<number | string | null>;\n\nexport type AccordionProps<T extends AccordionValue = AccordionValue> = FlexProps & {\n /** Value for the active tab. Can be set as stroke, number, null or as array.\n * @type AccordionValue\n * */\n value?: T;\n /**\n * Value of the active tabs selected by default\n * @type AccordionValue\n * @default []\n */\n defaultValue?: T;\n /** Called when the selection is changed\n * @type (value: AccordionValue, event?: React.SyntheticEvent) => void\n * */\n onChange?:\n | ((value: T, event?: React.SyntheticEvent) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Animation duration of each Accordion.Item inside\n * @default 350 */\n duration?: number;\n\n /**\n * Changes the visual appearance of the component\n * @default secondary\n */\n use?: 'primary' | 'secondary';\n};\n\nexport interface IAccordionProps<T extends AccordionValue = AccordionValue>\n extends AccordionProps<T> {}\n\nexport type AccordionContext = {\n getItemProps: PropGetterFn;\n};\n\nexport type AccordionHandlers = {\n value: AccordionProps['value'];\n};\n\nexport type AccordionItemProps = {\n /** Tab value */\n value: string | number;\n /** Disabling selection changes */\n disabled?: boolean;\n /** Animation duration\n * @default 350 */\n duration?: number;\n};\n\nexport type AccordionItemContext = {\n getToggleProps?: PropGetterFn;\n getCollapseProps?: PropGetterFn;\n getChevronProps?: PropGetterFn;\n selected?: boolean;\n};\n\nexport type AccordionItemToggleProps = BoxProps & {\n tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n};\nexport type ChevronItemProps = BoxProps & {\n /**\n * Chevron size\n * @default m\n */\n size?: 'm' | 'l';\n};\n\nexport type CollapseAnimationProps = {\n /** Animation titles */\n keyframes?: [string, string];\n /** Enables animation on first rendering\n * @default false\n */\n initialAnimation?: boolean;\n /**\n * @default ease-out\n */\n timingFunction?: Property.AnimationTimingFunction;\n /**\n * @default false\n */\n animationsDisabled?: boolean;\n};\n\nexport type AccordionCollapseProps = BoxProps & CollapseAnimationProps & {\n /** Animation duration in ms\n * @default 0\n */\n duration?: number | [number, number];\n /** If it set to `true`, animated node is persisted in dom even if `visible=false` */\n preserveNode?: boolean;\n /**\n * Add overflow=clip when passing animation\n * @default true\n * */\n overflowHidden?: boolean;\n /**\n * Value for height after animation\n * @default auto\n */\n defaultHeight?: 'auto' | '100%';\n};\n\nexport type IntergalacticAccordionComponent<PropsExtending = {}> = (<\n Value extends AccordionValue,\n Tag extends Intergalactic.Tag = 'div',\n>(\n props: Intergalactic.InternalTypings.ComponentProps<\n Tag,\n 'div',\n AccordionProps<Value>,\n AccordionContext & { value: Value },\n [handlers: AccordionHandlers]\n > &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\nIntergalactic.InternalTypings.ComponentAdditive<'div', 'div', AccordionProps>;\n\nexport type AccordionItemComponent = Intergalactic.Component<\n 'div',\n AccordionItemProps,\n AccordionItemContext\n>;\n\nexport type AccordionComponent = IntergalacticAccordionComponent & {\n Item: AccordionItemComponent & {\n Toggle: Intergalactic.Component<typeof Text, AccordionItemToggleProps>;\n ToggleButton: Intergalactic.Component<typeof Flex, {}>;\n Chevron: Intergalactic.Component<'div', ChevronItemProps>;\n Collapse: Intergalactic.Component<'div', AccordionCollapseProps>;\n };\n};\n"],"mappings":"","ignoreList":[]}
1
+ {"version":3,"file":"Accordion.type.js","names":[],"sources":["../../src/Accordion.type.ts"],"sourcesContent":["import type { BoxProps, FlexProps, Flex } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { Text } from '@semcore/typography';\nimport type { Property } from 'csstype';\n\nexport type AccordionValue = null | number | string | Array<number | string | null>;\n\nexport type AccordionProps<T extends AccordionValue = AccordionValue> = FlexProps & {\n /** Value for the active tab. Can be set as stroke, number, null or as array.\n * @type AccordionValue\n * */\n value?: T;\n /**\n * Value of the active tabs selected by default\n * @type AccordionValue\n * @default []\n */\n defaultValue?: T;\n /** Called when the selection is changed\n * @type (value: AccordionValue, event?: React.SyntheticEvent) => void\n * */\n onChange?:\n | ((value: T, event?: React.SyntheticEvent) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Animation duration of each Accordion.Item inside\n * @default 350 */\n duration?: number;\n\n /**\n * Changes the visual appearance of the component\n * @default secondary\n */\n use?: 'primary' | 'secondary';\n};\n\nexport interface IAccordionProps<T extends AccordionValue = AccordionValue>\n extends AccordionProps<T> {}\n\nexport type AccordionContext = {\n getItemProps: PropGetterFn;\n};\n\nexport type AccordionHandlers = {\n value: AccordionProps['value'];\n};\n\nexport type AccordionItemProps = {\n /** Tab value */\n value: string | number;\n /** Disabling selection changes */\n disabled?: boolean;\n /** Animation duration\n * @default 350 */\n duration?: number;\n};\n\nexport type AccordionItemContext = {\n getToggleProps?: PropGetterFn;\n getCollapseProps?: PropGetterFn;\n getChevronProps?: PropGetterFn;\n selected?: boolean;\n};\n\nexport type AccordionItemToggleProps = BoxProps & {\n tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n};\nexport type ChevronItemProps = BoxProps & {\n /**\n * Chevron size\n * @default m\n */\n size?: 'm' | 'l';\n};\n\nexport type CollapseAnimationProps = {\n /** Animation titles */\n keyframes?: [string, string];\n /** Enables animation on first rendering\n * @default false\n */\n initialAnimation?: boolean;\n /**\n * @default ease-out\n */\n timingFunction?: Property.AnimationTimingFunction;\n /**\n * @default false\n */\n animationsDisabled?: boolean;\n};\n\nexport type AccordionCollapseProps = BoxProps & CollapseAnimationProps & {\n /** Animation duration in ms\n * @default 0\n */\n duration?: number | [number, number];\n /** If it set to `true`, animated node is persisted in dom even if `visible=false` */\n preserveNode?: boolean;\n /**\n * Add overflow=clip when passing animation\n * @default true\n * */\n overflowHidden?: boolean;\n /**\n * Value for height after animation\n * @default auto\n */\n defaultHeight?: 'auto' | '100%';\n};\n\nexport type IntergalacticAccordionComponent<PropsExtending = {}> = (<\n Value extends AccordionValue,\n Tag extends Intergalactic.Tag = 'div',\n>(\n props: Intergalactic.InternalTypings.ComponentProps<\n Tag,\n 'div',\n AccordionProps<Value>,\n AccordionContext & { value: Value },\n [handlers: AccordionHandlers]\n > &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\nIntergalactic.InternalTypings.ComponentAdditive<'div', 'div', AccordionProps>;\n\nexport type AccordionItemComponent = Intergalactic.Component<\n 'div',\n AccordionItemProps,\n AccordionItemContext\n>;\nexport type AccordionItemToggleComponent = Intergalactic.Component<typeof Text, AccordionItemToggleProps>;\nexport type AccordionItemToggleButtonComponent = Intergalactic.Component<typeof Flex, {}>;\nexport type AccordionItemChevronComponent = Intergalactic.Component<'div', ChevronItemProps>;\nexport type AccordionItemCollapseComponent = Intergalactic.Component<'div', AccordionCollapseProps>;\n\nexport type AccordionComponent = IntergalacticAccordionComponent & {\n Item: AccordionItemComponent & {\n Toggle: AccordionItemToggleComponent;\n ToggleButton: AccordionItemToggleButtonComponent;\n Chevron: AccordionItemChevronComponent;\n Collapse: AccordionItemCollapseComponent;\n };\n};\n"],"mappings":"","ignoreList":[]}
package/lib/es6/Accordion.js CHANGED
@@ -211,14 +211,10 @@ function ToggleButton(props) {
211
211
  const {
212
212
  styles
213
213
  } = props;
214
- const SToggleButton = Flex;
215
- return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(SToggleButton, _ref7.cn("SToggleButton", {
216
- ..._assignProps3({
217
- "alignItems": 'center',
218
- "role": 'button',
219
- ...props
220
- }, _ref3)
221
- }));
214
+ return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(Flex, _assignProps3({
215
+ "alignItems": 'center',
216
+ "role": 'button'
217
+ }, _ref3));
222
218
  }
223
219
  function Collapse(props) {
224
220
  var _ref4 = arguments[0];
package/lib/es6/Accordion.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Accordion.js","names":["Collapse","CollapseAnimate","Flex","createComponent","Component","sstyled","Root","uniqueIDEnhancement","cssVariableEnhance","ChevronRightL","ChevronRightM","Text","React","style","_sstyled","insert","RootAccordion","constructor","args","_defineProperty","newValue","value","asProps","Array","isArray","indexOfNewValue","indexOf","result","push","splice","handlers","uncontrolledProps","getItemProps","selectedValue","duration","use","selected","includes","$handleInteraction","handleToggleInteraction","render","Children","createElement","defaultValue","variable","fallback","map","Number","parseInt","prop","RootItem","getToggleProps","uid","disabled","onClick","undefined","handleClick","id","tag","size","tabIndex","getToggleButtonProps","getCollapseProps","getChevronProps","Toggle","createRef","event","key","toggleRef","current","target","currentTarget","click","preventDefault","_ref","_ref5","styles","SItemToggle","cn","_assignProps","handleKeyDown","Chevron","props","_ref2","arguments[0]","_ref6","SItemChevron","_assignProps2","ToggleButton","_ref3","_ref7","SToggleButton","_assignProps3","_ref4","visible","_assignProps4","Item","Accordion","wrapAccordion","wrapper"],"sources":["../../src/Accordion.tsx"],"sourcesContent":["import { Collapse as CollapseAnimate, Flex } from '@semcore/base-components';\nimport type { Intergalactic, IRootComponentProps } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronRightL from '@semcore/icon/ChevronRight/l';\nimport ChevronRightM from '@semcore/icon/ChevronRight/m';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport type {\n AccordionCollapsePropsInternal,\n AccordionItemPropsInternal,\n AccordionItemTogglePropsInternal,\n} from './Accordion.internal.type';\nimport type {\n AccordionCollapseProps,\n AccordionComponent,\n AccordionHandlers,\n AccordionItemComponent,\n AccordionItemProps,\n AccordionItemToggleProps,\n AccordionProps,\n ChevronItemProps,\n IntergalacticAccordionComponent,\n} from './Accordion.type';\nimport style from './style/accordion.shadow.css';\n\nclass RootAccordion extends Component<AccordionProps, typeof RootAccordion.enhance, AccordionHandlers> {\n static displayName = 'Accordion';\n static style = style;\n static defaultProps = {\n defaultValue: [],\n use: 'secondary',\n };\n\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-accordion',\n fallback: '200',\n map: (value: string) => `${Number.parseInt(value)}`,\n prop: 'duration',\n }),\n ] as const;\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n handleToggleInteraction = (newValue: AccordionItemProps['value']) => {\n const { value } = this.asProps;\n\n if (Array.isArray(value)) {\n const indexOfNewValue = value.indexOf(newValue);\n const result = [...value];\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n indexOfNewValue === -1 ? result.push(newValue) : result.splice(indexOfNewValue, 1);\n this.handlers.value(result);\n } else {\n this.handlers.value(value === newValue ? null : newValue);\n }\n };\n\n getItemProps({ value }: AccordionItemProps) {\n const { value: selectedValue, duration, use } = this.asProps;\n const selected = Array.isArray(selectedValue)\n ? selectedValue.includes(value)\n : selectedValue === value;\n\n return {\n selected,\n duration,\n use,\n $handleInteraction: this.handleToggleInteraction,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nexport class RootItem extends Component<AccordionItemProps, typeof RootItem.enhance, {}, AccordionItemPropsInternal> {\n static displayName = 'Item';\n static style = style;\n static enhance = [uniqueIDEnhancement()] as const;\n\n handleClick = () => {\n const { value, $handleInteraction } = this.asProps;\n\n $handleInteraction(value);\n };\n\n getToggleProps() {\n const { value, uid, disabled, use } = this.asProps;\n return {\n use,\n disabled,\n onClick: disabled ? undefined : this.handleClick,\n id: `igc-${uid}-${value}-toggle`,\n tag: 'h3',\n size: 300,\n tabIndex: disabled ? -1 : 0,\n };\n }\n\n getToggleButtonProps() {\n const { value, uid, selected, disabled } = this.asProps;\n return {\n disabled,\n 'id': `igc-${uid}-${value}-toggle-button`,\n 'aria-expanded': selected ? 'true' : 'false',\n 'aria-controls': selected ? `igc-${uid}-${value}-collapse` : undefined,\n };\n }\n\n getCollapseProps() {\n const { selected, uid, duration, value } = this.asProps;\n return {\n selected,\n duration,\n 'id': `igc-${uid}-${value}-collapse`,\n 'role': 'region',\n 'aria-labelledby': `igc-${uid}-${value}-toggle-button`,\n };\n }\n\n getChevronProps() {\n const { selected, size } = this.asProps;\n return {\n selected,\n size,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nclass Toggle extends Component<AccordionItemToggleProps, never, {}, AccordionItemTogglePropsInternal> {\n toggleRef = React.createRef();\n\n handleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>) => {\n if (event.key === 'Enter') {\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n } else if (event.key === ' ') {\n event.preventDefault();\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n }\n };\n\n render() {\n const { styles, use } = this.asProps;\n const SItemToggle = Root;\n\n return sstyled(styles)(\n <SItemToggle\n use={use}\n ref={this.toggleRef}\n render={Text}\n innerOutline\n onKeyDown={this.handleKeyDown}\n />,\n );\n }\n}\n\nfunction Chevron(props: ChevronItemProps) {\n const { styles, size } = props;\n\n const SItemChevron = Root;\n return sstyled(styles)(<SItemChevron render={size === 'l' ? ChevronRightL : ChevronRightM} />);\n}\n\nfunction ToggleButton(props: IRootComponentProps) {\n const { styles } = props;\n\n const SToggleButton = Root;\n return sstyled(styles)(\n <SToggleButton alignItems='center' render={Flex} role='button' {...props} />,\n );\n}\n\nfunction Collapse(props: AccordionCollapseProps & AccordionCollapsePropsInternal) {\n const { selected } = props;\n const visible = selected;\n\n return (\n <Root\n render={CollapseAnimate}\n visible={visible}\n interactive\n inert={!visible ? '' : undefined}\n aria-hidden={!visible}\n />\n );\n}\n\nconst Item = createComponent(RootItem, {\n Toggle,\n Chevron,\n ToggleButton,\n Collapse,\n}) as AccordionItemComponent;\n\nconst Accordion = createComponent(RootAccordion, {\n Item,\n}) as unknown as AccordionComponent;\n\nexport const wrapAccordion = <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticAccordionComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => wrapper as IntergalacticAccordionComponent<PropsExtending>;\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Accordion.js","names":["Collapse","CollapseAnimate","Flex","createComponent","Component","sstyled","Root","uniqueIDEnhancement","cssVariableEnhance","ChevronRightL","ChevronRightM","Text","React","style","_sstyled","insert","RootAccordion","constructor","args","_defineProperty","newValue","value","asProps","Array","isArray","indexOfNewValue","indexOf","result","push","splice","handlers","uncontrolledProps","getItemProps","selectedValue","duration","use","selected","includes","$handleInteraction","handleToggleInteraction","render","Children","createElement","defaultValue","variable","fallback","map","Number","parseInt","prop","RootItem","getToggleProps","uid","disabled","onClick","undefined","handleClick","id","tag","size","tabIndex","getToggleButtonProps","getCollapseProps","getChevronProps","Toggle","createRef","event","key","toggleRef","current","target","currentTarget","click","preventDefault","_ref","_ref5","styles","SItemToggle","cn","_assignProps","handleKeyDown","Chevron","props","_ref2","arguments[0]","_ref6","SItemChevron","_assignProps2","ToggleButton","_ref3","_ref7","_assignProps3","_ref4","visible","_assignProps4","Item","Accordion","wrapAccordion","wrapper"],"sources":["../../src/Accordion.tsx"],"sourcesContent":["import { Collapse as CollapseAnimate, Flex } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronRightL from '@semcore/icon/ChevronRight/l';\nimport ChevronRightM from '@semcore/icon/ChevronRight/m';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport type {\n AccordionComponent,\n AccordionHandlers,\n AccordionItemChevronComponent,\n AccordionItemCollapseComponent,\n AccordionItemComponent,\n AccordionItemProps,\n AccordionItemToggleButtonComponent,\n AccordionItemToggleComponent,\n IntergalacticAccordionComponent,\n} from './Accordion.type';\nimport style from './style/accordion.shadow.css';\n\nclass RootAccordion extends Component<\n Intergalactic.InternalTypings.InferComponentProps<IntergalacticAccordionComponent>,\n typeof RootAccordion.enhance,\n AccordionHandlers\n> {\n static displayName = 'Accordion';\n static style = style;\n static defaultProps = {\n defaultValue: [],\n use: 'secondary',\n };\n\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-accordion',\n fallback: '200',\n map: (value: string) => `${Number.parseInt(value)}`,\n prop: 'duration',\n }),\n ] as const;\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n handleToggleInteraction = (newValue: AccordionItemProps['value']) => {\n const { value } = this.asProps;\n\n if (Array.isArray(value)) {\n const indexOfNewValue = value.indexOf(newValue);\n const result = [...value];\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n indexOfNewValue === -1 ? result.push(newValue) : result.splice(indexOfNewValue, 1);\n this.handlers.value(result);\n } else {\n this.handlers.value(value === newValue ? null : newValue);\n }\n };\n\n getItemProps({ value }: AccordionItemProps) {\n const { value: selectedValue, duration, use } = this.asProps;\n const selected = Array.isArray(selectedValue)\n ? selectedValue.includes(value)\n : selectedValue === value;\n\n return {\n selected,\n duration,\n use,\n $handleInteraction: this.handleToggleInteraction,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\nexport class RootItem extends Component<\n Intergalactic.InternalTypings.InferChildComponentProps<AccordionItemComponent, typeof RootAccordion, 'Item'>,\n typeof RootItem.enhance\n> {\n static displayName = 'Item';\n static style = style;\n static enhance = [uniqueIDEnhancement()] as const;\n\n handleClick = () => {\n const { value, $handleInteraction } = this.asProps;\n\n $handleInteraction(value);\n };\n\n getToggleProps() {\n const { value, uid, disabled, use } = this.asProps;\n return {\n use,\n disabled,\n onClick: disabled ? undefined : this.handleClick,\n id: `igc-${uid}-${value}-toggle`,\n tag: 'h3',\n size: 300,\n tabIndex: disabled ? -1 : 0,\n };\n }\n\n getToggleButtonProps() {\n const { value, uid, selected, disabled } = this.asProps;\n return {\n disabled,\n 'id': `igc-${uid}-${value}-toggle-button`,\n 'aria-expanded': selected ? 'true' : 'false',\n 'aria-controls': selected ? `igc-${uid}-${value}-collapse` : undefined,\n };\n }\n\n getCollapseProps() {\n const { selected, uid, duration, value } = this.asProps;\n return {\n selected,\n duration,\n 'id': `igc-${uid}-${value}-collapse`,\n 'role': 'region',\n 'aria-labelledby': `igc-${uid}-${value}-toggle-button`,\n };\n }\n\n getChevronProps() {\n const { selected, size } = this.asProps;\n return {\n selected,\n size,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nclass Toggle extends Component<\n Intergalactic.InternalTypings.InferChildComponentProps<AccordionItemToggleComponent, typeof RootItem, 'Toggle'>\n> {\n toggleRef = React.createRef();\n\n handleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>) => {\n if (event.key === 'Enter') {\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n } else if (event.key === ' ') {\n event.preventDefault();\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n }\n };\n\n render() {\n const { styles, use } = this.asProps;\n const SItemToggle = Root;\n\n return sstyled(styles)(\n <SItemToggle use={use} ref={this.toggleRef} render={Text} innerOutline onKeyDown={this.handleKeyDown} />,\n );\n }\n}\n\nfunction Chevron(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n AccordionItemChevronComponent,\n typeof RootItem,\n 'Chevron'\n >,\n) {\n const { styles, size } = props;\n\n const SItemChevron = Root;\n return sstyled(styles)(<SItemChevron render={size === 'l' ? ChevronRightL : ChevronRightM} />);\n}\n\nfunction ToggleButton(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n AccordionItemToggleButtonComponent,\n typeof RootItem,\n 'ToggleButton'\n >,\n) {\n const { styles } = props;\n\n return sstyled(styles)(\n <Root render={Flex} alignItems='center' role='button' />,\n );\n}\n\nfunction Collapse(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n AccordionItemCollapseComponent,\n typeof RootItem,\n 'Collapse'\n >,\n) {\n const { selected } = props;\n const visible = selected;\n\n return (\n <Root\n render={CollapseAnimate}\n visible={visible}\n interactive\n inert={!visible ? '' : undefined}\n aria-hidden={!visible}\n />\n );\n}\n\nconst Item = createComponent(RootItem, {\n Toggle,\n Chevron,\n ToggleButton,\n Collapse,\n}) as AccordionItemComponent;\n\nconst Accordion = createComponent(RootAccordion, {\n Item,\n}) as unknown as AccordionComponent;\n\nexport const wrapAccordion = <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticAccordionComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => wrapper as IntergalacticAccordionComponent<PropsExtending>;\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
package/lib/es6/Accordion.type.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Accordion.type.js","names":[],"sources":["../../src/Accordion.type.ts"],"sourcesContent":["import type { BoxProps, FlexProps, Flex } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { Text } from '@semcore/typography';\nimport type { Property } from 'csstype';\n\nexport type AccordionValue = null | number | string | Array<number | string | null>;\n\nexport type AccordionProps<T extends AccordionValue = AccordionValue> = FlexProps & {\n /** Value for the active tab. Can be set as stroke, number, null or as array.\n * @type AccordionValue\n * */\n value?: T;\n /**\n * Value of the active tabs selected by default\n * @type AccordionValue\n * @default []\n */\n defaultValue?: T;\n /** Called when the selection is changed\n * @type (value: AccordionValue, event?: React.SyntheticEvent) => void\n * */\n onChange?:\n | ((value: T, event?: React.SyntheticEvent) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Animation duration of each Accordion.Item inside\n * @default 350 */\n duration?: number;\n\n /**\n * Changes the visual appearance of the component\n * @default secondary\n */\n use?: 'primary' | 'secondary';\n};\n\nexport interface IAccordionProps<T extends AccordionValue = AccordionValue>\n extends AccordionProps<T> {}\n\nexport type AccordionContext = {\n getItemProps: PropGetterFn;\n};\n\nexport type AccordionHandlers = {\n value: AccordionProps['value'];\n};\n\nexport type AccordionItemProps = {\n /** Tab value */\n value: string | number;\n /** Disabling selection changes */\n disabled?: boolean;\n /** Animation duration\n * @default 350 */\n duration?: number;\n};\n\nexport type AccordionItemContext = {\n getToggleProps?: PropGetterFn;\n getCollapseProps?: PropGetterFn;\n getChevronProps?: PropGetterFn;\n selected?: boolean;\n};\n\nexport type AccordionItemToggleProps = BoxProps & {\n tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n};\nexport type ChevronItemProps = BoxProps & {\n /**\n * Chevron size\n * @default m\n */\n size?: 'm' | 'l';\n};\n\nexport type CollapseAnimationProps = {\n /** Animation titles */\n keyframes?: [string, string];\n /** Enables animation on first rendering\n * @default false\n */\n initialAnimation?: boolean;\n /**\n * @default ease-out\n */\n timingFunction?: Property.AnimationTimingFunction;\n /**\n * @default false\n */\n animationsDisabled?: boolean;\n};\n\nexport type AccordionCollapseProps = BoxProps & CollapseAnimationProps & {\n /** Animation duration in ms\n * @default 0\n */\n duration?: number | [number, number];\n /** If it set to `true`, animated node is persisted in dom even if `visible=false` */\n preserveNode?: boolean;\n /**\n * Add overflow=clip when passing animation\n * @default true\n * */\n overflowHidden?: boolean;\n /**\n * Value for height after animation\n * @default auto\n */\n defaultHeight?: 'auto' | '100%';\n};\n\nexport type IntergalacticAccordionComponent<PropsExtending = {}> = (<\n Value extends AccordionValue,\n Tag extends Intergalactic.Tag = 'div',\n>(\n props: Intergalactic.InternalTypings.ComponentProps<\n Tag,\n 'div',\n AccordionProps<Value>,\n AccordionContext & { value: Value },\n [handlers: AccordionHandlers]\n > &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\nIntergalactic.InternalTypings.ComponentAdditive<'div', 'div', AccordionProps>;\n\nexport type AccordionItemComponent = Intergalactic.Component<\n 'div',\n AccordionItemProps,\n AccordionItemContext\n>;\n\nexport type AccordionComponent = IntergalacticAccordionComponent & {\n Item: AccordionItemComponent & {\n Toggle: Intergalactic.Component<typeof Text, AccordionItemToggleProps>;\n ToggleButton: Intergalactic.Component<typeof Flex, {}>;\n Chevron: Intergalactic.Component<'div', ChevronItemProps>;\n Collapse: Intergalactic.Component<'div', AccordionCollapseProps>;\n };\n};\n"],"mappings":"","ignoreList":[]}
1
+ {"version":3,"file":"Accordion.type.js","names":[],"sources":["../../src/Accordion.type.ts"],"sourcesContent":["import type { BoxProps, FlexProps, Flex } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { Text } from '@semcore/typography';\nimport type { Property } from 'csstype';\n\nexport type AccordionValue = null | number | string | Array<number | string | null>;\n\nexport type AccordionProps<T extends AccordionValue = AccordionValue> = FlexProps & {\n /** Value for the active tab. Can be set as stroke, number, null or as array.\n * @type AccordionValue\n * */\n value?: T;\n /**\n * Value of the active tabs selected by default\n * @type AccordionValue\n * @default []\n */\n defaultValue?: T;\n /** Called when the selection is changed\n * @type (value: AccordionValue, event?: React.SyntheticEvent) => void\n * */\n onChange?:\n | ((value: T, event?: React.SyntheticEvent) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Animation duration of each Accordion.Item inside\n * @default 350 */\n duration?: number;\n\n /**\n * Changes the visual appearance of the component\n * @default secondary\n */\n use?: 'primary' | 'secondary';\n};\n\nexport interface IAccordionProps<T extends AccordionValue = AccordionValue>\n extends AccordionProps<T> {}\n\nexport type AccordionContext = {\n getItemProps: PropGetterFn;\n};\n\nexport type AccordionHandlers = {\n value: AccordionProps['value'];\n};\n\nexport type AccordionItemProps = {\n /** Tab value */\n value: string | number;\n /** Disabling selection changes */\n disabled?: boolean;\n /** Animation duration\n * @default 350 */\n duration?: number;\n};\n\nexport type AccordionItemContext = {\n getToggleProps?: PropGetterFn;\n getCollapseProps?: PropGetterFn;\n getChevronProps?: PropGetterFn;\n selected?: boolean;\n};\n\nexport type AccordionItemToggleProps = BoxProps & {\n tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n};\nexport type ChevronItemProps = BoxProps & {\n /**\n * Chevron size\n * @default m\n */\n size?: 'm' | 'l';\n};\n\nexport type CollapseAnimationProps = {\n /** Animation titles */\n keyframes?: [string, string];\n /** Enables animation on first rendering\n * @default false\n */\n initialAnimation?: boolean;\n /**\n * @default ease-out\n */\n timingFunction?: Property.AnimationTimingFunction;\n /**\n * @default false\n */\n animationsDisabled?: boolean;\n};\n\nexport type AccordionCollapseProps = BoxProps & CollapseAnimationProps & {\n /** Animation duration in ms\n * @default 0\n */\n duration?: number | [number, number];\n /** If it set to `true`, animated node is persisted in dom even if `visible=false` */\n preserveNode?: boolean;\n /**\n * Add overflow=clip when passing animation\n * @default true\n * */\n overflowHidden?: boolean;\n /**\n * Value for height after animation\n * @default auto\n */\n defaultHeight?: 'auto' | '100%';\n};\n\nexport type IntergalacticAccordionComponent<PropsExtending = {}> = (<\n Value extends AccordionValue,\n Tag extends Intergalactic.Tag = 'div',\n>(\n props: Intergalactic.InternalTypings.ComponentProps<\n Tag,\n 'div',\n AccordionProps<Value>,\n AccordionContext & { value: Value },\n [handlers: AccordionHandlers]\n > &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\nIntergalactic.InternalTypings.ComponentAdditive<'div', 'div', AccordionProps>;\n\nexport type AccordionItemComponent = Intergalactic.Component<\n 'div',\n AccordionItemProps,\n AccordionItemContext\n>;\nexport type AccordionItemToggleComponent = Intergalactic.Component<typeof Text, AccordionItemToggleProps>;\nexport type AccordionItemToggleButtonComponent = Intergalactic.Component<typeof Flex, {}>;\nexport type AccordionItemChevronComponent = Intergalactic.Component<'div', ChevronItemProps>;\nexport type AccordionItemCollapseComponent = Intergalactic.Component<'div', AccordionCollapseProps>;\n\nexport type AccordionComponent = IntergalacticAccordionComponent & {\n Item: AccordionItemComponent & {\n Toggle: AccordionItemToggleComponent;\n ToggleButton: AccordionItemToggleButtonComponent;\n Chevron: AccordionItemChevronComponent;\n Collapse: AccordionItemCollapseComponent;\n };\n};\n"],"mappings":"","ignoreList":[]}
package/lib/esm/Accordion.mjs CHANGED
@@ -205,18 +205,14 @@ function Chevron(props) {
205
205
  }));
206
206
  }
207
207
  function ToggleButton(props) {
208
- var _ref3 = arguments[0], _ref7;
208
+ var _ref3 = arguments[0];
209
209
  const {
210
210
  styles
211
211
  } = props;
212
- const SToggleButton = Flex;
213
- return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SToggleButton, _ref7.cn("SToggleButton", {
214
- ...assignProps({
215
- "alignItems": "center",
216
- "role": "button",
217
- ...props
218
- }, _ref3)
219
- }));
212
+ return sstyled(styles), /* @__PURE__ */ React.createElement(Flex, assignProps({
213
+ "alignItems": "center",
214
+ "role": "button"
215
+ }, _ref3));
220
216
  }
221
217
  function Collapse(props) {
222
218
  var _ref4 = arguments[0];
package/lib/types/Accordion.d.ts CHANGED
@@ -1,9 +1,32 @@
1
1
  import type { Intergalactic } from '@semcore/core';
2
2
  import { Component } from '@semcore/core';
3
3
  import React from 'react';
4
- import type { AccordionItemPropsInternal } from './Accordion.internal.type';
5
- import type { AccordionComponent, AccordionItemProps, IntergalacticAccordionComponent } from './Accordion.type';
6
- export declare class RootItem extends Component<AccordionItemProps, typeof RootItem.enhance, {}, AccordionItemPropsInternal> {
4
+ import type { AccordionComponent, AccordionHandlers, AccordionItemComponent, AccordionItemProps, IntergalacticAccordionComponent } from './Accordion.type';
5
+ declare class RootAccordion extends Component<Intergalactic.InternalTypings.InferComponentProps<IntergalacticAccordionComponent>, typeof RootAccordion.enhance, AccordionHandlers> {
6
+ static displayName: string;
7
+ static style: {
8
+ [key: string]: string;
9
+ };
10
+ static defaultProps: {
11
+ defaultValue: never[];
12
+ use: string;
13
+ };
14
+ static enhance: readonly [<T extends {}>(props: T) => T & {
15
+ duration: string;
16
+ }];
17
+ uncontrolledProps(): {
18
+ value: null;
19
+ };
20
+ handleToggleInteraction: (newValue: AccordionItemProps["value"]) => void;
21
+ getItemProps({ value }: AccordionItemProps): {
22
+ selected: boolean;
23
+ duration: never;
24
+ use: "primary" | "secondary" | undefined;
25
+ $handleInteraction: (newValue: AccordionItemProps["value"]) => void;
26
+ };
27
+ render(): React.JSX.Element;
28
+ }
29
+ export declare class RootItem extends Component<Intergalactic.InternalTypings.InferChildComponentProps<AccordionItemComponent, typeof RootAccordion, 'Item'>, typeof RootItem.enhance> {
7
30
  static displayName: string;
8
31
  static style: {
9
32
  [key: string]: string;
@@ -28,14 +51,14 @@ export declare class RootItem extends Component<AccordionItemProps, typeof RootI
28
51
  'aria-controls': string | undefined;
29
52
  };
30
53
  getCollapseProps(): {
31
- selected: boolean | undefined;
54
+ selected: boolean;
32
55
  duration: number | undefined;
33
56
  id: string;
34
57
  role: string;
35
58
  'aria-labelledby': string;
36
59
  };
37
60
  getChevronProps(): {
38
- selected: boolean | undefined;
61
+ selected: boolean;
39
62
  size: number | undefined;
40
63
  };
41
64
  render(): React.JSX.Element;
package/lib/types/Accordion.type.d.ts CHANGED
@@ -100,11 +100,15 @@ export type IntergalacticAccordionComponent<PropsExtending = {}> = (<Value exten
100
100
  handlers: AccordionHandlers
101
101
  ]> & PropsExtending) => Intergalactic.InternalTypings.ComponentRenderingResults) & Intergalactic.InternalTypings.ComponentAdditive<'div', 'div', AccordionProps>;
102
102
  export type AccordionItemComponent = Intergalactic.Component<'div', AccordionItemProps, AccordionItemContext>;
103
+ export type AccordionItemToggleComponent = Intergalactic.Component<typeof Text, AccordionItemToggleProps>;
104
+ export type AccordionItemToggleButtonComponent = Intergalactic.Component<typeof Flex, {}>;
105
+ export type AccordionItemChevronComponent = Intergalactic.Component<'div', ChevronItemProps>;
106
+ export type AccordionItemCollapseComponent = Intergalactic.Component<'div', AccordionCollapseProps>;
103
107
  export type AccordionComponent = IntergalacticAccordionComponent & {
104
108
  Item: AccordionItemComponent & {
105
- Toggle: Intergalactic.Component<typeof Text, AccordionItemToggleProps>;
106
- ToggleButton: Intergalactic.Component<typeof Flex, {}>;
107
- Chevron: Intergalactic.Component<'div', ChevronItemProps>;
108
- Collapse: Intergalactic.Component<'div', AccordionCollapseProps>;
109
+ Toggle: AccordionItemToggleComponent;
110
+ ToggleButton: AccordionItemToggleButtonComponent;
111
+ Chevron: AccordionItemChevronComponent;
112
+ Collapse: AccordionItemCollapseComponent;
109
113
  };
110
114
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/accordion",
3
3
  "description": "Semrush Accordion Component",
4
- "version": "17.0.0-prerelease.31",
4
+ "version": "17.0.0-prerelease.34",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",
@@ -14,8 +14,8 @@
14
14
  "types": "./lib/types/index.d.ts"
15
15
  },
16
16
  "dependencies": {
17
- "@semcore/button": "^17.0.0-prerelease.31",
18
- "@semcore/typography": "^17.0.0-prerelease.31",
17
+ "@semcore/button": "^17.0.0-prerelease.34",
18
+ "@semcore/typography": "^17.0.0-prerelease.34",
19
19
  "csstype": "3.1.3"
20
20
  },
21
21
  "peerDependencies": {
@@ -28,10 +28,10 @@
28
28
  "directory": "semcore/accordion"
29
29
  },
30
30
  "devDependencies": {
31
- "@semcore/core": "17.0.0-prerelease.31",
31
+ "@semcore/base-components": "17.0.0-prerelease.34",
32
+ "@semcore/core": "17.0.0-prerelease.34",
32
33
  "@semcore/testing-utils": "1.0.0",
33
- "@semcore/base-components": "17.0.0-prerelease.31",
34
- "@semcore/icon": "16.7.2-prerelease.31"
34
+ "@semcore/icon": "16.7.2-prerelease.34"
35
35
  },
36
36
  "scripts": {
37
37
  "build": "pnpm semcore-builder && pnpm vite build"
package/lib/cjs/Accordion.internal.type.js DELETED
@@ -1,2 +0,0 @@
1
- "use strict";
2
- //# sourceMappingURL=Accordion.internal.type.js.map
package/lib/cjs/Accordion.internal.type.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"Accordion.internal.type.js","names":[],"sources":["../../src/Accordion.internal.type.ts"],"sourcesContent":["import type { AccordionItemProps, AccordionProps } from './Accordion.type';\n\nexport type AccordionItemPropsInternal = {\n use: AccordionProps['use'];\n $handleInteraction: (value: AccordionItemProps['value']) => void;\n};\n\nexport type AccordionCollapsePropsInternal = {\n selected: boolean;\n};\n\nexport type AccordionItemTogglePropsInternal = {\n use: AccordionProps['use'];\n};\n"],"mappings":"","ignoreList":[]}
package/lib/es6/Accordion.internal.type.js DELETED
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=Accordion.internal.type.js.map
package/lib/es6/Accordion.internal.type.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"Accordion.internal.type.js","names":[],"sources":["../../src/Accordion.internal.type.ts"],"sourcesContent":["import type { AccordionItemProps, AccordionProps } from './Accordion.type';\n\nexport type AccordionItemPropsInternal = {\n use: AccordionProps['use'];\n $handleInteraction: (value: AccordionItemProps['value']) => void;\n};\n\nexport type AccordionCollapsePropsInternal = {\n selected: boolean;\n};\n\nexport type AccordionItemTogglePropsInternal = {\n use: AccordionProps['use'];\n};\n"],"mappings":"","ignoreList":[]}
package/lib/types/Accordion.internal.type.d.ts DELETED
@@ -1,11 +0,0 @@
1
- import type { AccordionItemProps, AccordionProps } from './Accordion.type';
2
- export type AccordionItemPropsInternal = {
3
- use: AccordionProps['use'];
4
- $handleInteraction: (value: AccordionItemProps['value']) => void;
5
- };
6
- export type AccordionCollapsePropsInternal = {
7
- selected: boolean;
8
- };
9
- export type AccordionItemTogglePropsInternal = {
10
- use: AccordionProps['use'];
11
- };