@hitachivantara/uikit-react-core 5.38.2 → 5.38.3

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.
@@ -1 +1 @@
1
- {"version":3,"file":"Box.cjs","sources":["../../../../src/components/Box/Box.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { HvTheme, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\ntype SxProps = React.CSSProperties | ((theme: HvTheme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n C,\n { style?: React.CSSProperties; sx?: SxProps }\n>;\n\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const {\n style,\n component: Component = \"div\",\n sx,\n children,\n classes,\n ...restProps\n } = useDefaultProps(\"HvBox\", props);\n\n return (\n <Component style={sx ? sxFn(sx) : style} ref={ref} {...restProps}>\n {children}\n </Component>\n );\n }\n);\n"],"names":["sxFn","sx","theme","HvBox","forwardRef","props","ref","style","component","Component","children","classes","restProps","useDefaultProps","jsx"],"mappings":";;;;;;AAiBA,MAAMA,OAAOA,CAACC,OAAgB;AAC5B,SAAO,OAAOA,OAAO,aAAaA,GAAGC,YAAK,KAAA,IAAID;AAChD;AAOO,MAAME,QAAoBC,MAAAA,WAC/B,CACEC,OACAC,QACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC,WAAWC,YAAY;AAAA,IACvBR;AAAAA,IACAS;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,SAASR,KAAK;AAGhC,SAAAS,2BAAA,IAAC,WAAU,EAAA,OAAOb,KAAKD,KAAKC,EAAE,IAAIM,OAAO,KAAcK,GAAAA,WACpDF,SACH,CAAA;AAEJ,CACF;;"}
1
+ {"version":3,"file":"Box.cjs","sources":["../../../../src/components/Box/Box.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { HvTheme, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\ntype SxProps = React.CSSProperties | ((theme: HvTheme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n C,\n { style?: React.CSSProperties; sx?: SxProps }\n>;\n\n// v6 - This shouldn't be named HvBoxProps\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const {\n style,\n component: Component = \"div\",\n sx,\n children,\n classes,\n ...restProps\n } = useDefaultProps(\"HvBox\", props);\n\n return (\n <Component style={sx ? sxFn(sx) : style} ref={ref} {...restProps}>\n {children}\n </Component>\n );\n }\n);\n"],"names":["sxFn","sx","theme","HvBox","forwardRef","props","ref","style","component","Component","children","classes","restProps","useDefaultProps","jsx"],"mappings":";;;;;;AAkBA,MAAMA,OAAOA,CAACC,OAAgB;AAC5B,SAAO,OAAOA,OAAO,aAAaA,GAAGC,YAAK,KAAA,IAAID;AAChD;AAOO,MAAME,QAAoBC,MAAAA,WAC/B,CACEC,OACAC,QACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC,WAAWC,YAAY;AAAA,IACvBR;AAAAA,IACAS;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,SAASR,KAAK;AAGhC,SAAAS,2BAAA,IAAC,WAAU,EAAA,OAAOb,KAAKD,KAAKC,EAAE,IAAIM,OAAO,KAAcK,GAAAA,WACpDF,SACH,CAAA;AAEJ,CACF;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Section.cjs","sources":["../../../../src/components/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n extends Omit<HvBaseProps<HTMLDivElement>, \"title\"> {\n /** The title of the section */\n title?: React.ReactNode;\n /** Whether or not the section is expandable. */\n expandable?: boolean;\n /** Whether the section is open or not, if this property is defined the accordion must be fully controlled. */\n expanded?: boolean;\n /** When uncontrolled, defines the initial expanded state. */\n defaultExpanded?: boolean;\n /** Section actions */\n actions?: React.ReactNode;\n /** Section onExpand callback */\n onToggle?: (\n event: React.MouseEventHandler<HTMLButtonElement>,\n open: boolean\n ) => void;\n /** Props to be passed to the expand button */\n expandButtonProps?: HvButtonProps;\n /** A Jss Object used to override or extend the styles applied to the empty state component. */\n classes?: HvSectionClasses;\n}\n\n/**\n * Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n title,\n expandable,\n expanded,\n defaultExpanded = true,\n actions,\n onToggle,\n expandButtonProps,\n children,\n ...others\n } = useDefaultProps(\"HvSection\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [isOpen, setIsOpen] = useControlled(\n expanded,\n Boolean(defaultExpanded)\n );\n\n const elementId = useUniqueId(id, \"hvSection\");\n const contentId = setId(elementId, \"content\");\n\n const showContent = expandable ? !!isOpen : true;\n\n return (\n <div\n ref={ref}\n id={elementId}\n className={cx(classes.root, className)}\n {...others}\n >\n <div className={classes.header}>\n {expandable && (\n <HvButton\n icon\n onClick={(event) => {\n setIsOpen((o) => !o);\n onToggle?.(event, !isOpen);\n }}\n aria-expanded={isOpen}\n aria-controls={contentId}\n aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n {...expandButtonProps}\n >\n {isOpen ? <Up /> : <Down />}\n </HvButton>\n )}\n {title}\n <div className={classes.actions}>{actions}</div>\n </div>\n <div\n id={contentId}\n hidden={!isOpen}\n className={cx(classes.content, { [classes.hidden]: !showContent })}\n >\n {children}\n </div>\n </div>\n );\n }\n);\n"],"names":["HvSection","forwardRef","props","ref","id","classes","classesProp","className","title","expandable","expanded","defaultExpanded","actions","onToggle","expandButtonProps","children","others","useDefaultProps","cx","useClasses","isOpen","setIsOpen","useControlled","Boolean","elementId","useUniqueId","contentId","setId","showContent","jsxs","root","header","jsx","HvButton","event","o","Up","Down","content","hidden"],"mappings":";;;;;;;;;;;AA2CO,MAAMA,YAAYC,MAAAA,WACvB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,kBAAkB;AAAA,IAClBC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,aAAaf,KAAK;AAEhC,QAAA;AAAA,IAAEG;AAAAA,IAASa;AAAAA,EAAAA,IAAOC,eAAAA,WAAWb,WAAW;AAExC,QAAA,CAACc,QAAQC,SAAS,IAAIC,cAAAA,cAC1BZ,UACAa,QAAQZ,eAAe,CACzB;AAEMa,QAAAA,YAAYC,YAAAA,YAAYrB,IAAI,WAAW;AACvCsB,QAAAA,YAAYC,MAAAA,MAAMH,WAAW,SAAS;AAE5C,QAAMI,cAAcnB,aAAa,CAAC,CAACW,SAAS;AAE5C,SACGS,2BAAA,KAAA,OAAA,EACC,KACA,IAAIL,WACJ,WAAWN,GAAGb,QAAQyB,MAAMvB,SAAS,GACrC,GAAIS,QAEJ,UAAA;AAAA,IAACa,2BAAA,KAAA,OAAA,EAAI,WAAWxB,QAAQ0B,QACrBtB,UAAAA;AAAAA,MAAAA,cACEuB,2BAAA,IAAAC,iBAAA,EACC,MAAI,MACJ,SAAUC,CAAU,UAAA;AACPC,kBAAAA,CAAAA,MAAM,CAACA,CAAC;AACRD,mBAAAA,OAAO,CAACd,MAAM;AAAA,MAAA,GAE3B,iBAAeA,QACf,iBAAeM,WACf,cAAYN,SAAS,aAAa,UAC9BN,GAAAA,mBAEHM,UAAS,SAAAY,2BAAA,IAACI,sBAAK,IAAGJ,+BAACK,gBAAAA,OAAO,CAAA,GAC7B;AAAA,MAED7B;AAAAA,MACAwB,2BAAA,IAAA,OAAA,EAAI,WAAW3B,QAAQO,SAAUA,UAAQ,SAAA;AAAA,IAAA,GAC5C;AAAA,IACAoB,2BAAAA,IAAC,OACC,EAAA,IAAIN,WACJ,QAAQ,CAACN,QACT,WAAWF,GAAGb,QAAQiC,SAAS;AAAA,MAAE,CAACjC,QAAQkC,MAAM,GAAG,CAACX;AAAAA,IAAAA,CAAa,GAEhEb,SACH,CAAA;AAAA,EACF,EAAA,CAAA;AAEJ,CACF;;;"}
1
+ {"version":3,"file":"Section.cjs","sources":["../../../../src/components/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n extends Omit<HvBaseProps<HTMLDivElement>, \"title\"> {\n /** The title of the section */\n title?: React.ReactNode;\n /** Whether or not the section is expandable. */\n expandable?: boolean;\n /** Whether the section is open or not, if this property is defined the accordion must be fully controlled. */\n expanded?: boolean;\n /** When uncontrolled, defines the initial expanded state. */\n defaultExpanded?: boolean;\n /** Section actions */\n actions?: React.ReactNode;\n /** Section onExpand callback */\n onToggle?: (\n event: React.MouseEvent<HTMLButtonElement>,\n open: boolean\n ) => void;\n /** Props to be passed to the expand button */\n expandButtonProps?: HvButtonProps;\n /** A Jss Object used to override or extend the styles applied to the empty state component. */\n classes?: HvSectionClasses;\n}\n\n/**\n * Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n title,\n expandable,\n expanded,\n defaultExpanded = true,\n actions,\n onToggle,\n expandButtonProps,\n children,\n ...others\n } = useDefaultProps(\"HvSection\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [isOpen, setIsOpen] = useControlled(\n expanded,\n Boolean(defaultExpanded)\n );\n\n const elementId = useUniqueId(id, \"hvSection\");\n const contentId = setId(elementId, \"content\");\n\n const showContent = expandable ? !!isOpen : true;\n\n return (\n <div\n ref={ref}\n id={elementId}\n className={cx(classes.root, className)}\n {...others}\n >\n <div className={classes.header}>\n {expandable && (\n <HvButton\n icon\n onClick={(event) => {\n setIsOpen((o) => !o);\n onToggle?.(event, !isOpen);\n }}\n aria-expanded={isOpen}\n aria-controls={contentId}\n aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n {...expandButtonProps}\n >\n {isOpen ? <Up /> : <Down />}\n </HvButton>\n )}\n {title}\n <div className={classes.actions}>{actions}</div>\n </div>\n <div\n id={contentId}\n hidden={!isOpen}\n className={cx(classes.content, { [classes.hidden]: !showContent })}\n >\n {children}\n </div>\n </div>\n );\n }\n);\n"],"names":["HvSection","forwardRef","props","ref","id","classes","classesProp","className","title","expandable","expanded","defaultExpanded","actions","onToggle","expandButtonProps","children","others","useDefaultProps","cx","useClasses","isOpen","setIsOpen","useControlled","Boolean","elementId","useUniqueId","contentId","setId","showContent","jsxs","root","header","jsx","HvButton","event","o","Up","Down","content","hidden"],"mappings":";;;;;;;;;;;AA2CO,MAAMA,YAAYC,MAAAA,WACvB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,kBAAkB;AAAA,IAClBC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,aAAaf,KAAK;AAEhC,QAAA;AAAA,IAAEG;AAAAA,IAASa;AAAAA,EAAAA,IAAOC,eAAAA,WAAWb,WAAW;AAExC,QAAA,CAACc,QAAQC,SAAS,IAAIC,cAAAA,cAC1BZ,UACAa,QAAQZ,eAAe,CACzB;AAEMa,QAAAA,YAAYC,YAAAA,YAAYrB,IAAI,WAAW;AACvCsB,QAAAA,YAAYC,MAAAA,MAAMH,WAAW,SAAS;AAE5C,QAAMI,cAAcnB,aAAa,CAAC,CAACW,SAAS;AAE5C,SACGS,2BAAA,KAAA,OAAA,EACC,KACA,IAAIL,WACJ,WAAWN,GAAGb,QAAQyB,MAAMvB,SAAS,GACrC,GAAIS,QAEJ,UAAA;AAAA,IAACa,2BAAA,KAAA,OAAA,EAAI,WAAWxB,QAAQ0B,QACrBtB,UAAAA;AAAAA,MAAAA,cACEuB,2BAAA,IAAAC,iBAAA,EACC,MAAI,MACJ,SAAUC,CAAU,UAAA;AACPC,kBAAAA,CAAAA,MAAM,CAACA,CAAC;AACRD,mBAAAA,OAAO,CAACd,MAAM;AAAA,MAAA,GAE3B,iBAAeA,QACf,iBAAeM,WACf,cAAYN,SAAS,aAAa,UAC9BN,GAAAA,mBAEHM,UAAS,SAAAY,2BAAA,IAACI,sBAAK,IAAGJ,+BAACK,gBAAAA,OAAO,CAAA,GAC7B;AAAA,MAED7B;AAAAA,MACAwB,2BAAA,IAAA,OAAA,EAAI,WAAW3B,QAAQO,SAAUA,UAAQ,SAAA;AAAA,IAAA,GAC5C;AAAA,IACAoB,2BAAAA,IAAC,OACC,EAAA,IAAIN,WACJ,QAAQ,CAACN,QACT,WAAWF,GAAGb,QAAQiC,SAAS;AAAA,MAAE,CAACjC,QAAQkC,MAAM,GAAG,CAACX;AAAAA,IAAAA,CAAa,GAEhEb,SACH,CAAA;AAAA,EACF,EAAA,CAAA;AAEJ,CACF;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Box.js","sources":["../../../../src/components/Box/Box.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { HvTheme, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\ntype SxProps = React.CSSProperties | ((theme: HvTheme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n C,\n { style?: React.CSSProperties; sx?: SxProps }\n>;\n\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const {\n style,\n component: Component = \"div\",\n sx,\n children,\n classes,\n ...restProps\n } = useDefaultProps(\"HvBox\", props);\n\n return (\n <Component style={sx ? sxFn(sx) : style} ref={ref} {...restProps}>\n {children}\n </Component>\n );\n }\n);\n"],"names":["sxFn","sx","theme","HvBox","forwardRef","props","ref","style","component","Component","children","classes","restProps","useDefaultProps"],"mappings":";;;;AAiBA,MAAMA,OAAOA,CAACC,OAAgB;AAC5B,SAAO,OAAOA,OAAO,aAAaA,GAAGC,KAAK,IAAID;AAChD;AAOO,MAAME,QAAoBC,WAC/B,CACEC,OACAC,QACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC,WAAWC,YAAY;AAAA,IACvBR;AAAAA,IACAS;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,SAASR,KAAK;AAGhC,SAAA,oBAAC,WAAU,EAAA,OAAOJ,KAAKD,KAAKC,EAAE,IAAIM,OAAO,KAAcK,GAAAA,WACpDF,SACH,CAAA;AAEJ,CACF;"}
1
+ {"version":3,"file":"Box.js","sources":["../../../../src/components/Box/Box.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { HvTheme, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\ntype SxProps = React.CSSProperties | ((theme: HvTheme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n C,\n { style?: React.CSSProperties; sx?: SxProps }\n>;\n\n// v6 - This shouldn't be named HvBoxProps\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const {\n style,\n component: Component = \"div\",\n sx,\n children,\n classes,\n ...restProps\n } = useDefaultProps(\"HvBox\", props);\n\n return (\n <Component style={sx ? sxFn(sx) : style} ref={ref} {...restProps}>\n {children}\n </Component>\n );\n }\n);\n"],"names":["sxFn","sx","theme","HvBox","forwardRef","props","ref","style","component","Component","children","classes","restProps","useDefaultProps"],"mappings":";;;;AAkBA,MAAMA,OAAOA,CAACC,OAAgB;AAC5B,SAAO,OAAOA,OAAO,aAAaA,GAAGC,KAAK,IAAID;AAChD;AAOO,MAAME,QAAoBC,WAC/B,CACEC,OACAC,QACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC,WAAWC,YAAY;AAAA,IACvBR;AAAAA,IACAS;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,SAASR,KAAK;AAGhC,SAAA,oBAAC,WAAU,EAAA,OAAOJ,KAAKD,KAAKC,EAAE,IAAIM,OAAO,KAAcK,GAAAA,WACpDF,SACH,CAAA;AAEJ,CACF;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Section.js","sources":["../../../../src/components/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n extends Omit<HvBaseProps<HTMLDivElement>, \"title\"> {\n /** The title of the section */\n title?: React.ReactNode;\n /** Whether or not the section is expandable. */\n expandable?: boolean;\n /** Whether the section is open or not, if this property is defined the accordion must be fully controlled. */\n expanded?: boolean;\n /** When uncontrolled, defines the initial expanded state. */\n defaultExpanded?: boolean;\n /** Section actions */\n actions?: React.ReactNode;\n /** Section onExpand callback */\n onToggle?: (\n event: React.MouseEventHandler<HTMLButtonElement>,\n open: boolean\n ) => void;\n /** Props to be passed to the expand button */\n expandButtonProps?: HvButtonProps;\n /** A Jss Object used to override or extend the styles applied to the empty state component. */\n classes?: HvSectionClasses;\n}\n\n/**\n * Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n title,\n expandable,\n expanded,\n defaultExpanded = true,\n actions,\n onToggle,\n expandButtonProps,\n children,\n ...others\n } = useDefaultProps(\"HvSection\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [isOpen, setIsOpen] = useControlled(\n expanded,\n Boolean(defaultExpanded)\n );\n\n const elementId = useUniqueId(id, \"hvSection\");\n const contentId = setId(elementId, \"content\");\n\n const showContent = expandable ? !!isOpen : true;\n\n return (\n <div\n ref={ref}\n id={elementId}\n className={cx(classes.root, className)}\n {...others}\n >\n <div className={classes.header}>\n {expandable && (\n <HvButton\n icon\n onClick={(event) => {\n setIsOpen((o) => !o);\n onToggle?.(event, !isOpen);\n }}\n aria-expanded={isOpen}\n aria-controls={contentId}\n aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n {...expandButtonProps}\n >\n {isOpen ? <Up /> : <Down />}\n </HvButton>\n )}\n {title}\n <div className={classes.actions}>{actions}</div>\n </div>\n <div\n id={contentId}\n hidden={!isOpen}\n className={cx(classes.content, { [classes.hidden]: !showContent })}\n >\n {children}\n </div>\n </div>\n );\n }\n);\n"],"names":["HvSection","forwardRef","props","ref","id","classes","classesProp","className","title","expandable","expanded","defaultExpanded","actions","onToggle","expandButtonProps","children","others","useDefaultProps","cx","useClasses","isOpen","setIsOpen","useControlled","Boolean","elementId","useUniqueId","contentId","setId","showContent","root","header","event","o","content","hidden"],"mappings":";;;;;;;;;;AA2CO,MAAMA,YAAYC,WACvB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,kBAAkB;AAAA,IAClBC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,aAAaf,KAAK;AAEhC,QAAA;AAAA,IAAEG;AAAAA,IAASa;AAAAA,EAAAA,IAAOC,WAAWb,WAAW;AAExC,QAAA,CAACc,QAAQC,SAAS,IAAIC,cAC1BZ,UACAa,QAAQZ,eAAe,CACzB;AAEMa,QAAAA,YAAYC,YAAYrB,IAAI,WAAW;AACvCsB,QAAAA,YAAYC,MAAMH,WAAW,SAAS;AAE5C,QAAMI,cAAcnB,aAAa,CAAC,CAACW,SAAS;AAE5C,SACG,qBAAA,OAAA,EACC,KACA,IAAII,WACJ,WAAWN,GAAGb,QAAQwB,MAAMtB,SAAS,GACrC,GAAIS,QAEJ,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,WAAWX,QAAQyB,QACrBrB,UAAAA;AAAAA,MAAAA,cACE,oBAAA,UAAA,EACC,MAAI,MACJ,SAAUsB,CAAU,UAAA;AACPC,kBAAAA,CAAAA,MAAM,CAACA,CAAC;AACRD,mBAAAA,OAAO,CAACX,MAAM;AAAA,MAAA,GAE3B,iBAAeA,QACf,iBAAeM,WACf,cAAYN,SAAS,aAAa,UAC9BN,GAAAA,mBAEHM,UAAS,SAAA,oBAAC,MAAK,IAAG,oBAAC,OAAO,CAAA,GAC7B;AAAA,MAEDZ;AAAAA,MACA,oBAAA,OAAA,EAAI,WAAWH,QAAQO,SAAUA,UAAQ,SAAA;AAAA,IAAA,GAC5C;AAAA,IACA,oBAAC,OACC,EAAA,IAAIc,WACJ,QAAQ,CAACN,QACT,WAAWF,GAAGb,QAAQ4B,SAAS;AAAA,MAAE,CAAC5B,QAAQ6B,MAAM,GAAG,CAACN;AAAAA,IAAAA,CAAa,GAEhEb,SACH,CAAA;AAAA,EACF,EAAA,CAAA;AAEJ,CACF;"}
1
+ {"version":3,"file":"Section.js","sources":["../../../../src/components/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n extends Omit<HvBaseProps<HTMLDivElement>, \"title\"> {\n /** The title of the section */\n title?: React.ReactNode;\n /** Whether or not the section is expandable. */\n expandable?: boolean;\n /** Whether the section is open or not, if this property is defined the accordion must be fully controlled. */\n expanded?: boolean;\n /** When uncontrolled, defines the initial expanded state. */\n defaultExpanded?: boolean;\n /** Section actions */\n actions?: React.ReactNode;\n /** Section onExpand callback */\n onToggle?: (\n event: React.MouseEvent<HTMLButtonElement>,\n open: boolean\n ) => void;\n /** Props to be passed to the expand button */\n expandButtonProps?: HvButtonProps;\n /** A Jss Object used to override or extend the styles applied to the empty state component. */\n classes?: HvSectionClasses;\n}\n\n/**\n * Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n title,\n expandable,\n expanded,\n defaultExpanded = true,\n actions,\n onToggle,\n expandButtonProps,\n children,\n ...others\n } = useDefaultProps(\"HvSection\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [isOpen, setIsOpen] = useControlled(\n expanded,\n Boolean(defaultExpanded)\n );\n\n const elementId = useUniqueId(id, \"hvSection\");\n const contentId = setId(elementId, \"content\");\n\n const showContent = expandable ? !!isOpen : true;\n\n return (\n <div\n ref={ref}\n id={elementId}\n className={cx(classes.root, className)}\n {...others}\n >\n <div className={classes.header}>\n {expandable && (\n <HvButton\n icon\n onClick={(event) => {\n setIsOpen((o) => !o);\n onToggle?.(event, !isOpen);\n }}\n aria-expanded={isOpen}\n aria-controls={contentId}\n aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n {...expandButtonProps}\n >\n {isOpen ? <Up /> : <Down />}\n </HvButton>\n )}\n {title}\n <div className={classes.actions}>{actions}</div>\n </div>\n <div\n id={contentId}\n hidden={!isOpen}\n className={cx(classes.content, { [classes.hidden]: !showContent })}\n >\n {children}\n </div>\n </div>\n );\n }\n);\n"],"names":["HvSection","forwardRef","props","ref","id","classes","classesProp","className","title","expandable","expanded","defaultExpanded","actions","onToggle","expandButtonProps","children","others","useDefaultProps","cx","useClasses","isOpen","setIsOpen","useControlled","Boolean","elementId","useUniqueId","contentId","setId","showContent","root","header","event","o","content","hidden"],"mappings":";;;;;;;;;;AA2CO,MAAMA,YAAYC,WACvB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,kBAAkB;AAAA,IAClBC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,aAAaf,KAAK;AAEhC,QAAA;AAAA,IAAEG;AAAAA,IAASa;AAAAA,EAAAA,IAAOC,WAAWb,WAAW;AAExC,QAAA,CAACc,QAAQC,SAAS,IAAIC,cAC1BZ,UACAa,QAAQZ,eAAe,CACzB;AAEMa,QAAAA,YAAYC,YAAYrB,IAAI,WAAW;AACvCsB,QAAAA,YAAYC,MAAMH,WAAW,SAAS;AAE5C,QAAMI,cAAcnB,aAAa,CAAC,CAACW,SAAS;AAE5C,SACG,qBAAA,OAAA,EACC,KACA,IAAII,WACJ,WAAWN,GAAGb,QAAQwB,MAAMtB,SAAS,GACrC,GAAIS,QAEJ,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,WAAWX,QAAQyB,QACrBrB,UAAAA;AAAAA,MAAAA,cACE,oBAAA,UAAA,EACC,MAAI,MACJ,SAAUsB,CAAU,UAAA;AACPC,kBAAAA,CAAAA,MAAM,CAACA,CAAC;AACRD,mBAAAA,OAAO,CAACX,MAAM;AAAA,MAAA,GAE3B,iBAAeA,QACf,iBAAeM,WACf,cAAYN,SAAS,aAAa,UAC9BN,GAAAA,mBAEHM,UAAS,SAAA,oBAAC,MAAK,IAAG,oBAAC,OAAO,CAAA,GAC7B;AAAA,MAEDZ;AAAAA,MACA,oBAAA,OAAA,EAAI,WAAWH,QAAQO,SAAUA,UAAQ,SAAA;AAAA,IAAA,GAC5C;AAAA,IACA,oBAAC,OACC,EAAA,IAAIc,WACJ,QAAQ,CAACN,QACT,WAAWF,GAAGb,QAAQ4B,SAAS;AAAA,MAAE,CAAC5B,QAAQ6B,MAAM,GAAG,CAACN;AAAAA,IAAAA,CAAa,GAEhEb,SACH,CAAA;AAAA,EACF,EAAA,CAAA;AAEJ,CACF;"}
@@ -836,6 +836,8 @@ export declare const findDescriptors: (children: any, descriptors?: {
836
836
  HvCalendarHeader?: Descriptor[] | undefined;
837
837
  };
838
838
 
839
+ declare type FixComponentProps<T> = T extends any ? T : never;
840
+
839
841
  export declare const focusClasses: {
840
842
  root: "HvFocus-root";
841
843
  disabled: "HvFocus-disabled";
@@ -5465,7 +5467,7 @@ export declare interface HvSectionProps extends Omit<HvBaseProps<HTMLDivElement>
5465
5467
  /** Section actions */
5466
5468
  actions?: React.ReactNode;
5467
5469
  /** Section onExpand callback */
5468
- onToggle?: (event: React.MouseEventHandler<HTMLButtonElement>, open: boolean) => void;
5470
+ onToggle?: (event: React.MouseEvent<HTMLButtonElement>, open: boolean) => void;
5469
5471
  /** Props to be passed to the expand button */
5470
5472
  expandButtonProps?: HvButtonProps;
5471
5473
  /** A Jss Object used to override or extend the styles applied to the empty state component. */
@@ -7613,7 +7615,7 @@ export declare const panelClasses: {
7613
7615
  root: "HvPanel-root";
7614
7616
  };
7615
7617
 
7616
- declare type PolymorphicComponent<C extends React.ElementType, Props = {}> = React.PropsWithChildren<Props & AsProp<C>> & Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>;
7618
+ declare type PolymorphicComponent<C extends React.ElementType, Props = {}> = React.PropsWithChildren<Props & AsProp<C>> & FixComponentProps<Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>>;
7617
7619
 
7618
7620
  export declare type PolymorphicComponentRef<C extends React.ElementType, Props = {}> = PolymorphicComponent<C, Props> & {
7619
7621
  ref?: PolymorphicRef<C>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hitachivantara/uikit-react-core",
3
- "version": "5.38.2",
3
+ "version": "5.38.3",
4
4
  "private": false,
5
5
  "author": "Hitachi Vantara UI Kit Team",
6
6
  "description": "Core React components for the NEXT Design System.",
@@ -64,7 +64,7 @@
64
64
  "access": "public",
65
65
  "directory": "package"
66
66
  },
67
- "gitHead": "eb7992ae506e68e72520b06ee8c2348cec8403c3",
67
+ "gitHead": "2cc1a282b228d97c1c4540b65132062f5c951eeb",
68
68
  "main": "dist/cjs/index.cjs",
69
69
  "exports": {
70
70
  ".": {