@hitachivantara/uikit-react-core 5.36.2 → 5.36.4

package/dist/cjs/components/Card/Header/Header.cjs

@@ -22,6 +22,7 @@ const HvCardHeader = (props) => {
   } = Header_styles.useClasses(classesProp);
   return /* @__PURE__ */ jsxRuntime.jsx(MuiCardHeader__default.default, { title, subheader, action: icon, onClick, className: cx(classes.root, className), classes: {
     title: cx({
+      // TODO: review conditional in v6
       [classes.titleShort]: icon,
       [classes.title]: !icon
     }),

package/dist/cjs/components/Card/Header/Header.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Header.cjs","sources":["../../../../../src/components/Card/Header/Header.tsx"],"sourcesContent":["import MuiCardHeader, {\n  CardHeaderProps as MuiCardHeaderProps,\n} from \"@mui/material/CardHeader\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { staticClasses, useClasses } from \"./Header.styles\";\n\nexport { staticClasses as cardHeaderClasses };\n\nexport type HvCardHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardHeaderProps\n  extends Omit<MuiCardHeaderProps, \"classes\">,\n    HvBaseProps<HTMLDivElement, \"title\"> {\n  /** The renderable content inside the title slot of the header. */\n  title: React.ReactNode;\n  /** The renderable content inside the subheader slot of the header. */\n  subheader?: React.ReactNode;\n  /** The renderable content inside the icon slot of the header. */\n  icon?: React.ReactNode;\n  /** The function that will be executed when this section is clicked. */\n  onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardHeaderClasses;\n}\n\nexport const HvCardHeader = (props: HvCardHeaderProps) => {\n  const {\n    classes: classesProp,\n    className,\n    title,\n    subheader,\n    icon,\n    onClick,\n    ...others\n  } = useDefaultProps(\"HvCardHeader\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <MuiCardHeader\n      title={title}\n      subheader={subheader}\n      action={icon}\n      onClick={onClick}\n      className={cx(classes.root, className)}\n      classes={{\n        title: cx({\n          [classes.titleShort]: icon,\n          [classes.title]: !icon,\n        }),\n        subheader: classes.subheader,\n        action: classes.action,\n        content: classes.content,\n      }}\n      {...others}\n    />\n  );\n};\n"],"names":["HvCardHeader","props","classes","classesProp","className","title","subheader","icon","onClick","others","useDefaultProps","cx","useClasses","jsx","MuiCardHeader","root","titleShort","action","content"],"mappings":";;;;;;;;AA8BaA,MAAAA,eAAeA,CAACC,UAA6B;AAClD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,gBAAgBT,KAAK;AACnC,QAAA;AAAA,IAAEC;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,cAAAA,WAAWT,WAAW;AAE9C,SACGU,2BAAAA,IAAAC,uBAAAA,SAAA,EACC,OACA,WACA,QAAQP,MACR,SACA,WAAWI,GAAGT,QAAQa,MAAMX,SAAS,GACrC,SAAS;AAAA,IACPC,OAAOM,GAAG;AAAA,MACR,CAACT,QAAQc,UAAU,GAAGT;AAAAA,MACtB,CAACL,QAAQG,KAAK,GAAG,CAACE;AAAAA,IAAAA,CACnB;AAAA,IACDD,WAAWJ,QAAQI;AAAAA,IACnBW,QAAQf,QAAQe;AAAAA,IAChBC,SAAShB,QAAQgB;AAAAA,EAAAA,GAEfT,GAAAA,OACJ,CAAA;AAEN;;;"}
+{"version":3,"file":"Header.cjs","sources":["../../../../../src/components/Card/Header/Header.tsx"],"sourcesContent":["import MuiCardHeader, {\n  CardHeaderProps as MuiCardHeaderProps,\n} from \"@mui/material/CardHeader\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { staticClasses, useClasses } from \"./Header.styles\";\n\nexport { staticClasses as cardHeaderClasses };\n\nexport type HvCardHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardHeaderProps\n  extends Omit<MuiCardHeaderProps, \"classes\">,\n    HvBaseProps<HTMLDivElement, \"title\"> {\n  /** The renderable content inside the title slot of the header. */\n  title: React.ReactNode;\n  /** The renderable content inside the subheader slot of the header. */\n  subheader?: React.ReactNode;\n  /** The renderable content inside the icon slot of the header. */\n  icon?: React.ReactNode;\n  /** The function that will be executed when this section is clicked. */\n  onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardHeaderClasses;\n}\n\nexport const HvCardHeader = (props: HvCardHeaderProps) => {\n  const {\n    classes: classesProp,\n    className,\n    title,\n    subheader,\n    icon,\n    onClick,\n    ...others\n  } = useDefaultProps(\"HvCardHeader\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <MuiCardHeader\n      title={title}\n      subheader={subheader}\n      action={icon}\n      onClick={onClick}\n      className={cx(classes.root, className)}\n      classes={{\n        title: cx({\n          // TODO: review conditional in v6\n          [classes.titleShort]: icon,\n          [classes.title]: !icon,\n        }),\n        subheader: classes.subheader,\n        action: classes.action,\n        content: classes.content,\n      }}\n      {...others}\n    />\n  );\n};\n"],"names":["HvCardHeader","props","classes","classesProp","className","title","subheader","icon","onClick","others","useDefaultProps","cx","useClasses","jsx","MuiCardHeader","root","titleShort","action","content"],"mappings":";;;;;;;;AA8BaA,MAAAA,eAAeA,CAACC,UAA6B;AAClD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,gBAAgBT,KAAK;AACnC,QAAA;AAAA,IAAEC;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,cAAAA,WAAWT,WAAW;AAE9C,SACGU,2BAAAA,IAAAC,uBAAAA,SAAA,EACC,OACA,WACA,QAAQP,MACR,SACA,WAAWI,GAAGT,QAAQa,MAAMX,SAAS,GACrC,SAAS;AAAA,IACPC,OAAOM,GAAG;AAAA;AAAA,MAER,CAACT,QAAQc,UAAU,GAAGT;AAAAA,MACtB,CAACL,QAAQG,KAAK,GAAG,CAACE;AAAAA,IAAAA,CACnB;AAAA,IACDD,WAAWJ,QAAQI;AAAAA,IACnBW,QAAQf,QAAQe;AAAAA,IAChBC,SAAShB,QAAQgB;AAAAA,EAAAA,GAEfT,GAAAA,OACJ,CAAA;AAEN;;;"}

package/dist/cjs/components/Card/Header/Header.styles.cjs

@@ -7,12 +7,12 @@ const {
   useClasses
 } = classes.createClasses("HvCardHeader", {
   root: {
-    padding: `15px ${uikitStyles.theme.space.sm}`,
-    position: "relative"
+    position: "relative",
+    padding: uikitStyles.theme.spacing("12px", "xs", "sm", "sm")
   },
   titleShort: {
-    fontFamily: uikitStyles.theme.fontFamily.body,
-    marginRight: "30px"
+    ...uikitStyles.theme.typography.label,
+    fontFamily: uikitStyles.theme.fontFamily.body
   },
   title: {
     ...uikitStyles.theme.typography.label,
@@ -24,12 +24,8 @@ const {
   },
   content: {},
   action: {
-    position: "absolute",
-    right: 20,
-    marginTop: 0,
-    marginRight: "0px",
-    paddingLeft: uikitStyles.theme.space.xs,
-    top: "15px"
+    margin: 0,
+    paddingLeft: uikitStyles.theme.space.xs
   }
 });
 exports.staticClasses = staticClasses;

package/dist/cjs/components/Card/Header/Header.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Header.styles.cjs","sources":["../../../../../src/components/Card/Header/Header.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCardHeader\", {\n  root: { padding: `15px ${theme.space.sm}`, position: \"relative\" },\n  titleShort: {\n    fontFamily: theme.fontFamily.body,\n    marginRight: \"30px\",\n  },\n  title: {\n    ...theme.typography.label,\n    fontFamily: theme.fontFamily.body,\n  },\n  subheader: {\n    ...theme.typography.caption1,\n    fontFamily: theme.fontFamily.body,\n  },\n  content: {},\n  action: {\n    position: \"absolute\",\n    right: 20,\n    marginTop: 0,\n    marginRight: \"0px\",\n    paddingLeft: theme.space.xs,\n    top: \"15px\",\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","padding","theme","space","sm","position","titleShort","fontFamily","body","marginRight","title","typography","label","subheader","caption1","content","action","right","marginTop","paddingLeft","xs","top"],"mappings":";;;;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,gBAAgB;AAAA,EACzEC,MAAM;AAAA,IAAEC,SAAU,QAAOC,YAAMC,MAAAA,MAAMC,EAAG;AAAA,IAAGC,UAAU;AAAA,EAAW;AAAA,EAChEC,YAAY;AAAA,IACVC,YAAYL,YAAAA,MAAMK,WAAWC;AAAAA,IAC7BC,aAAa;AAAA,EACf;AAAA,EACAC,OAAO;AAAA,IACL,GAAGR,YAAAA,MAAMS,WAAWC;AAAAA,IACpBL,YAAYL,YAAAA,MAAMK,WAAWC;AAAAA,EAC/B;AAAA,EACAK,WAAW;AAAA,IACT,GAAGX,YAAAA,MAAMS,WAAWG;AAAAA,IACpBP,YAAYL,YAAAA,MAAMK,WAAWC;AAAAA,EAC/B;AAAA,EACAO,SAAS,CAAC;AAAA,EACVC,QAAQ;AAAA,IACNX,UAAU;AAAA,IACVY,OAAO;AAAA,IACPC,WAAW;AAAA,IACXT,aAAa;AAAA,IACbU,aAAajB,YAAAA,MAAMC,MAAMiB;AAAAA,IACzBC,KAAK;AAAA,EACP;AACF,CAAC;;;"}
+{"version":3,"file":"Header.styles.cjs","sources":["../../../../../src/components/Card/Header/Header.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCardHeader\", {\n  root: {\n    position: \"relative\",\n    padding: theme.spacing(\"12px\", \"xs\", \"sm\", \"sm\"),\n  },\n  titleShort: {\n    ...theme.typography.label,\n    fontFamily: theme.fontFamily.body,\n  },\n  title: {\n    ...theme.typography.label,\n    fontFamily: theme.fontFamily.body,\n  },\n  subheader: {\n    ...theme.typography.caption1,\n    fontFamily: theme.fontFamily.body,\n  },\n  content: {},\n  action: {\n    margin: 0,\n    paddingLeft: theme.space.xs,\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","position","padding","theme","spacing","titleShort","typography","label","fontFamily","body","title","subheader","caption1","content","action","margin","paddingLeft","space","xs"],"mappings":";;;;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,gBAAgB;AAAA,EACzEC,MAAM;AAAA,IACJC,UAAU;AAAA,IACVC,SAASC,YAAMC,MAAAA,QAAQ,QAAQ,MAAM,MAAM,IAAI;AAAA,EACjD;AAAA,EACAC,YAAY;AAAA,IACV,GAAGF,YAAAA,MAAMG,WAAWC;AAAAA,IACpBC,YAAYL,YAAAA,MAAMK,WAAWC;AAAAA,EAC/B;AAAA,EACAC,OAAO;AAAA,IACL,GAAGP,YAAAA,MAAMG,WAAWC;AAAAA,IACpBC,YAAYL,YAAAA,MAAMK,WAAWC;AAAAA,EAC/B;AAAA,EACAE,WAAW;AAAA,IACT,GAAGR,YAAAA,MAAMG,WAAWM;AAAAA,IACpBJ,YAAYL,YAAAA,MAAMK,WAAWC;AAAAA,EAC/B;AAAA,EACAI,SAAS,CAAC;AAAA,EACVC,QAAQ;AAAA,IACNC,QAAQ;AAAA,IACRC,aAAab,YAAAA,MAAMc,MAAMC;AAAAA,EAC3B;AACF,CAAC;;;"}

package/dist/cjs/components/Section/Section.cjs

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
+const React = require("react");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const useControlled = require("../../hooks/useControlled.cjs");
@@ -8,7 +9,7 @@ const useUniqueId = require("../../hooks/useUniqueId.cjs");
 const setId = require("../../utils/setId.cjs");
 const Section_styles = require("./Section.styles.cjs");
 const Button = require("../Button/Button.cjs");
-const HvSection = (props) => {
+const HvSection = React.forwardRef((props, ref) => {
   const {
     id,
     classes: classesProp,
@@ -31,7 +32,7 @@ const HvSection = (props) => {
   const elementId = useUniqueId.useUniqueId(id, "hvSection");
   const contentId = setId.setId(elementId, "content");
   const showContent = expandable ? !!isOpen : true;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { id: elementId, className: cx(classes.root, className), ...others, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, id: elementId, className: cx(classes.root, className), ...others, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.header, children: [
       expandable && /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, { icon: true, onClick: (event) => {
         setIsOpen((o) => !o);
@@ -44,7 +45,7 @@ const HvSection = (props) => {
       [classes.hidden]: !showContent
     }), children })
   ] });
-};
+});
 exports.sectionClasses = Section_styles.staticClasses;
 exports.HvSection = HvSection;
 //# sourceMappingURL=Section.cjs.map

package/dist/cjs/components/Section/Section.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Section.cjs","sources":["../../../../src/components/Section/Section.tsx"],"sourcesContent":["import { 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?: HvActionGeneric[];\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 = (props: HvSectionProps) => {\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(expanded, Boolean(defaultExpanded));\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 id={elementId} className={cx(classes.root, className)} {...others}>\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"],"names":["HvSection","props","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":";;;;;;;;;;AA2CaA,MAAAA,YAAYA,CAACC,UAA0B;AAC5C,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,aAAad,KAAK;AAEhC,QAAA;AAAA,IAAEE;AAAAA,IAASa;AAAAA,EAAAA,IAAOC,eAAAA,WAAWb,WAAW;AAExC,QAAA,CAACc,QAAQC,SAAS,IAAIC,cAAAA,cAAcZ,UAAUa,QAAQZ,eAAe,CAAC;AAEtEa,QAAAA,YAAYC,YAAAA,YAAYrB,IAAI,WAAW;AACvCsB,QAAAA,YAAYC,MAAAA,MAAMH,WAAW,SAAS;AAE5C,QAAMI,cAAcnB,aAAa,CAAC,CAACW,SAAS;AAG1C,SAAAS,2BAAA,KAAC,OAAI,EAAA,IAAIL,WAAW,WAAWN,GAAGb,QAAQyB,MAAMvB,SAAS,GAAOS,GAAAA,QAC9D,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;;;"}
+{"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;;;"}

package/dist/cjs/components/Table/hooks/usePagination.cjs

@@ -2,7 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const reactTable = require("react-table");
 const useInstanceHook = (instance) => {
-  reactTable.ensurePluginOrder(instance.plugins, ["usePagination"], "useHvPagination");
+  reactTable.ensurePluginOrder(instance.plugins, ["usePagination", "useHvGlobalFilter", "useHvFilters", "useGroupBy", "useHvSortBy", "useHvRowExpand"], "useHvPagination");
   const getInstance = reactTable.useGetLatest(instance);
   const getHvPaginationProps = reactTable.makePropGetter(instance.getHooks().getHvPaginationProps, {
     instance: getInstance()

package/dist/cjs/components/Table/hooks/usePagination.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"usePagination.cjs","sources":["../../../../../src/components/Table/hooks/usePagination.ts"],"sourcesContent":["import {\n  makePropGetter,\n  useGetLatest,\n  ensurePluginOrder,\n  Hooks,\n  PropGetter,\n  TableCommonProps,\n} from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport interface HvTablePaginationProps extends TableCommonProps {\n  canPrevious: boolean;\n  canNext: boolean;\n  pages: number;\n  page: number;\n  pageSize: number;\n  onPageChange?: (updater: ((pageIndex: number) => number) | number) => void;\n  onPageSizeChange?: (pageSize: number) => void;\n  labels?: Record<string, string>;\n}\n\nexport type HvPaginationPropGetter<D extends object> = PropGetter<\n  D,\n  HvTablePaginationProps\n>;\n\nexport interface UseHvPaginationHooks<D extends object> {\n  getHvPaginationProps: Array<HvPaginationPropGetter<D>>;\n}\n\nexport interface UseHvPaginationTableInstance<D extends object> {\n  getHvPaginationProps: (\n    propGetter?: HvPaginationPropGetter<D>\n  ) => HvTablePaginationProps;\n}\n\nexport type UsePaginationProps = (<D extends object = Record<string, unknown>>(\n  hooks: Hooks<D>\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useInstanceHook = (instance) => {\n  ensurePluginOrder(instance.plugins, [\"usePagination\"], \"useHvPagination\");\n\n  const getInstance = useGetLatest(instance);\n  const getHvPaginationProps = makePropGetter(\n    instance.getHooks().getHvPaginationProps,\n    {\n      instance: getInstance(),\n    }\n  );\n\n  Object.assign(instance, {\n    getHvPaginationProps,\n  });\n};\n\nexport const defaultGetHvPaginationProps = (props, { instance }) => {\n  const {\n    canPreviousPage,\n    canNextPage,\n    pageOptions,\n    gotoPage,\n    setPageSize,\n    state: { pageSize, pageIndex },\n    labels,\n  } = instance;\n\n  const nextProps: HvTablePaginationProps = {\n    canPrevious: canPreviousPage,\n    canNext: canNextPage,\n    pages: pageOptions.length,\n    page: pageIndex,\n    pageSize,\n    onPageChange: gotoPage,\n    onPageSizeChange: setPageSize,\n    labels,\n  };\n\n  return [props, nextProps];\n};\n\nconst usePagination: UsePaginationProps = (hooks) => {\n  hooks.getHvPaginationProps = [defaultGetHvPaginationProps];\n\n  hooks.useInstance.push(useInstanceHook);\n};\n\nusePagination.pluginName = \"useHvPagination\";\n\nexport default usePagination;\n"],"names":["useInstanceHook","instance","ensurePluginOrder","plugins","getInstance","useGetLatest","getHvPaginationProps","makePropGetter","getHooks","Object","assign","defaultGetHvPaginationProps","props","canPreviousPage","canNextPage","pageOptions","gotoPage","setPageSize","state","pageSize","pageIndex","labels","nextProps","canPrevious","canNext","pages","length","page","onPageChange","onPageSizeChange","usePagination","hooks","useInstance","push","pluginName"],"mappings":";;;AA2CA,MAAMA,kBAAmBC,CAAa,aAAA;AACpCC,aAAAA,kBAAkBD,SAASE,SAAS,CAAC,eAAe,GAAG,iBAAiB;AAElEC,QAAAA,cAAcC,wBAAaJ,QAAQ;AACzC,QAAMK,uBAAuBC,WAAAA,eAC3BN,SAASO,SAAAA,EAAWF,sBACpB;AAAA,IACEL,UAAUG,YAAY;AAAA,EAAA,CAE1B;AAEAK,SAAOC,OAAOT,UAAU;AAAA,IACtBK;AAAAA,EAAAA,CACD;AACH;AAEaK,MAAAA,8BAA8BA,CAACC,OAAO;AAAA,EAAEX;AAAS,MAAM;AAC5D,QAAA;AAAA,IACJY;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,OAAO;AAAA,MAAEC;AAAAA,MAAUC;AAAAA,IAAU;AAAA,IAC7BC;AAAAA,EACEpB,IAAAA;AAEJ,QAAMqB,YAAoC;AAAA,IACxCC,aAAaV;AAAAA,IACbW,SAASV;AAAAA,IACTW,OAAOV,YAAYW;AAAAA,IACnBC,MAAMP;AAAAA,IACND;AAAAA,IACAS,cAAcZ;AAAAA,IACda,kBAAkBZ;AAAAA,IAClBI;AAAAA,EAAAA;AAGK,SAAA,CAACT,OAAOU,SAAS;AAC1B;AAEA,MAAMQ,gBAAqCC,CAAU,UAAA;AAC7CzB,QAAAA,uBAAuB,CAACK,2BAA2B;AAEnDqB,QAAAA,YAAYC,KAAKjC,eAAe;AACxC;AAEA8B,cAAcI,aAAa;AAE3B,MAAA,kBAAeJ;;;"}
+{"version":3,"file":"usePagination.cjs","sources":["../../../../../src/components/Table/hooks/usePagination.ts"],"sourcesContent":["import {\n  makePropGetter,\n  useGetLatest,\n  ensurePluginOrder,\n  Hooks,\n  PropGetter,\n  TableCommonProps,\n} from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport interface HvTablePaginationProps extends TableCommonProps {\n  canPrevious: boolean;\n  canNext: boolean;\n  pages: number;\n  page: number;\n  pageSize: number;\n  onPageChange?: (updater: ((pageIndex: number) => number) | number) => void;\n  onPageSizeChange?: (pageSize: number) => void;\n  labels?: Record<string, string>;\n}\n\nexport type HvPaginationPropGetter<D extends object> = PropGetter<\n  D,\n  HvTablePaginationProps\n>;\n\nexport interface UseHvPaginationHooks<D extends object> {\n  getHvPaginationProps: Array<HvPaginationPropGetter<D>>;\n}\n\nexport interface UseHvPaginationTableInstance<D extends object> {\n  getHvPaginationProps: (\n    propGetter?: HvPaginationPropGetter<D>\n  ) => HvTablePaginationProps;\n}\n\nexport type UsePaginationProps = (<D extends object = Record<string, unknown>>(\n  hooks: Hooks<D>\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useInstanceHook = (instance) => {\n  ensurePluginOrder(\n    instance.plugins,\n    [\n      \"usePagination\",\n      \"useHvGlobalFilter\",\n      \"useHvFilters\",\n      \"useGroupBy\",\n      \"useHvSortBy\",\n      \"useHvRowExpand\",\n    ],\n    \"useHvPagination\"\n  );\n\n  const getInstance = useGetLatest(instance);\n  const getHvPaginationProps = makePropGetter(\n    instance.getHooks().getHvPaginationProps,\n    {\n      instance: getInstance(),\n    }\n  );\n\n  Object.assign(instance, {\n    getHvPaginationProps,\n  });\n};\n\nexport const defaultGetHvPaginationProps = (props, { instance }) => {\n  const {\n    canPreviousPage,\n    canNextPage,\n    pageOptions,\n    gotoPage,\n    setPageSize,\n    state: { pageSize, pageIndex },\n    labels,\n  } = instance;\n\n  const nextProps: HvTablePaginationProps = {\n    canPrevious: canPreviousPage,\n    canNext: canNextPage,\n    pages: pageOptions.length,\n    page: pageIndex,\n    pageSize,\n    onPageChange: gotoPage,\n    onPageSizeChange: setPageSize,\n    labels,\n  };\n\n  return [props, nextProps];\n};\n\nconst usePagination: UsePaginationProps = (hooks) => {\n  hooks.getHvPaginationProps = [defaultGetHvPaginationProps];\n\n  hooks.useInstance.push(useInstanceHook);\n};\n\nusePagination.pluginName = \"useHvPagination\";\n\nexport default usePagination;\n"],"names":["useInstanceHook","instance","plugins","getInstance","useGetLatest","getHvPaginationProps","makePropGetter","getHooks","Object","assign","defaultGetHvPaginationProps","props","canPreviousPage","canNextPage","pageOptions","gotoPage","setPageSize","state","pageSize","pageIndex","labels","nextProps","canPrevious","canNext","pages","length","page","onPageChange","onPageSizeChange","usePagination","hooks","useInstance","push","pluginName"],"mappings":";;;AA2CA,MAAMA,kBAAmBC,CAAa,aAAA;AAElCA,aAAAA,kBAAAA,SAASC,SACT,CACE,iBACA,qBACA,gBACA,cACA,eACA,gBAAgB,GAElB,iBACF;AAEMC,QAAAA,cAAcC,wBAAaH,QAAQ;AACzC,QAAMI,uBAAuBC,WAAAA,eAC3BL,SAASM,SAAAA,EAAWF,sBACpB;AAAA,IACEJ,UAAUE,YAAY;AAAA,EAAA,CAE1B;AAEAK,SAAOC,OAAOR,UAAU;AAAA,IACtBI;AAAAA,EAAAA,CACD;AACH;AAEaK,MAAAA,8BAA8BA,CAACC,OAAO;AAAA,EAAEV;AAAS,MAAM;AAC5D,QAAA;AAAA,IACJW;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,OAAO;AAAA,MAAEC;AAAAA,MAAUC;AAAAA,IAAU;AAAA,IAC7BC;AAAAA,EACEnB,IAAAA;AAEJ,QAAMoB,YAAoC;AAAA,IACxCC,aAAaV;AAAAA,IACbW,SAASV;AAAAA,IACTW,OAAOV,YAAYW;AAAAA,IACnBC,MAAMP;AAAAA,IACND;AAAAA,IACAS,cAAcZ;AAAAA,IACda,kBAAkBZ;AAAAA,IAClBI;AAAAA,EAAAA;AAGK,SAAA,CAACT,OAAOU,SAAS;AAC1B;AAEA,MAAMQ,gBAAqCC,CAAU,UAAA;AAC7CzB,QAAAA,uBAAuB,CAACK,2BAA2B;AAEnDqB,QAAAA,YAAYC,KAAKhC,eAAe;AACxC;AAEA6B,cAAcI,aAAa;AAE3B,MAAA,kBAAeJ;;;"}

package/dist/cjs/components/TreeView/TreeItem/DefaultContent.cjs

@@ -3,10 +3,22 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useCss = require("../../../hooks/useCss.cjs");
+const classes = require("../../../utils/classes.cjs");
 const useHvTreeItem = require("./useHvTreeItem.cjs");
+const {
+  useClasses
+} = classes.createClasses("HvTreeContent", {
+  root: {},
+  expanded: {},
+  selected: {},
+  focused: {},
+  disabled: {},
+  iconContainer: {},
+  label: {}
+});
 const DefaultContent = React.forwardRef((props, ref) => {
   const {
-    classes,
+    classes: classesProp,
     className,
     displayIcon,
     expansionIcon,
@@ -17,6 +29,9 @@ const DefaultContent = React.forwardRef((props, ref) => {
     onMouseDown,
     ...others
   } = props;
+  const {
+    classes: classes2
+  } = useClasses(classesProp);
   const {
     cx
   } = useCss.useCss();
@@ -32,11 +47,11 @@ const DefaultContent = React.forwardRef((props, ref) => {
   const icon = iconProp ?? expansionIcon ?? displayIcon;
   return (
     /* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions -- Key event is handled by the TreeView */
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { ...others, className: cx(className, classes.root, {
-      [classes.expanded]: expanded,
-      [classes.selected]: selected,
-      [classes.focused]: focused,
-      [classes.disabled]: disabled
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { ...others, className: cx(className, classes2.root, {
+      [classes2.expanded]: expanded,
+      [classes2.selected]: selected,
+      [classes2.focused]: focused,
+      [classes2.disabled]: disabled
     }), onClick: (event) => {
       handleExpansion(event);
       handleSelection(event);
@@ -45,10 +60,11 @@ const DefaultContent = React.forwardRef((props, ref) => {
       preventSelection(event);
       onMouseDown?.(event);
     }, ref, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.iconContainer, children: icon }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.label, children: label })
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes2.iconContainer, children: icon }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes2.label, children: label })
     ] })
   );
 });
 exports.DefaultContent = DefaultContent;
+exports.useClasses = useClasses;
 //# sourceMappingURL=DefaultContent.cjs.map

package/dist/cjs/components/TreeView/TreeItem/DefaultContent.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultContent.cjs","sources":["../../../../../src/components/TreeView/TreeItem/DefaultContent.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { useCss } from \"@core/hooks/useCss\";\n\nimport type { HvTreeContentProps } from \"./TreeItem\";\nimport { useHvTreeItem } from \"./useHvTreeItem\";\n\n/**\n * Internal default TreeItem `component`.\n * Use this as a basis to create a custom component.\n */\nexport const DefaultContent = forwardRef<HTMLDivElement, HvTreeContentProps>(\n  (props, ref) => {\n    const {\n      classes,\n      className,\n      displayIcon,\n      expansionIcon,\n      icon: iconProp,\n      label,\n      nodeId,\n      onClick,\n      onMouseDown,\n      ...others\n    } = props;\n\n    const { cx } = useCss();\n\n    const {\n      disabled,\n      expanded,\n      selected,\n      focused,\n      handleExpansion,\n      handleSelection,\n      preventSelection,\n    } = useHvTreeItem(nodeId);\n\n    const icon = iconProp ?? expansionIcon ?? displayIcon;\n\n    return (\n      /* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions -- Key event is handled by the TreeView */\n      <div\n        {...others}\n        className={cx(className, classes.root, {\n          [classes.expanded]: expanded,\n          [classes.selected]: selected,\n          [classes.focused]: focused,\n          [classes.disabled]: disabled,\n        })}\n        onClick={(event) => {\n          handleExpansion(event);\n          handleSelection(event);\n          onClick?.(event);\n        }}\n        onMouseDown={(event) => {\n          preventSelection(event);\n          onMouseDown?.(event);\n        }}\n        ref={ref}\n      >\n        <div className={classes.iconContainer}>{icon}</div>\n        <div className={classes.label}>{label}</div>\n      </div>\n    );\n  }\n);\n"],"names":["DefaultContent","forwardRef","props","ref","classes","className","displayIcon","expansionIcon","icon","iconProp","label","nodeId","onClick","onMouseDown","others","cx","useCss","disabled","expanded","selected","focused","handleExpansion","handleSelection","preventSelection","useHvTreeItem","jsxs","root","event","jsx","iconContainer"],"mappings":";;;;;;AAWO,MAAMA,iBAAiBC,MAAAA,WAC5B,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,MAAMC;AAAAA,IACNC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EACDZ,IAAAA;AAEE,QAAA;AAAA,IAAEa;AAAAA,MAAOC,OAAO,OAAA;AAEhB,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,IACEC,cAAAA,cAAcb,MAAM;AAElBH,QAAAA,OAAOC,YAAYF,iBAAiBD;AAE1C;AAAA;AAAA,IAEEmB,gCAAC,SACC,GAAIX,QACJ,WAAWC,GAAGV,WAAWD,QAAQsB,MAAM;AAAA,MACrC,CAACtB,QAAQc,QAAQ,GAAGA;AAAAA,MACpB,CAACd,QAAQe,QAAQ,GAAGA;AAAAA,MACpB,CAACf,QAAQgB,OAAO,GAAGA;AAAAA,MACnB,CAAChB,QAAQa,QAAQ,GAAGA;AAAAA,IAAAA,CACrB,GACD,SAAUU,CAAU,UAAA;AAClBN,sBAAgBM,KAAK;AACrBL,sBAAgBK,KAAK;AACrBf,gBAAUe,KAAK;AAAA,IAAA,GAEjB,aAAcA,CAAU,UAAA;AACtBJ,uBAAiBI,KAAK;AACtBd,oBAAcc,KAAK;AAAA,IAAA,GAErB,KAEA,UAAA;AAAA,MAAAC,2BAAA,IAAC,OAAI,EAAA,WAAWxB,QAAQyB,eAAgBrB,UAAK,MAAA;AAAA,MAC5CoB,2BAAA,IAAA,OAAA,EAAI,WAAWxB,QAAQM,OAAQA,UAAM,OAAA;AAAA,IAAA,GACxC;AAAA;AAEJ,CACF;;"}
+{"version":3,"file":"DefaultContent.cjs","sources":["../../../../../src/components/TreeView/TreeItem/DefaultContent.tsx"],"sourcesContent":["import { HTMLAttributes, ReactNode, forwardRef } from \"react\";\n\nimport { useCss } from \"@core/hooks/useCss\";\nimport { ExtractNames, createClasses } from \"@core/utils/classes\";\n\nimport { useHvTreeItem } from \"./useHvTreeItem\";\n\nexport const { useClasses } = createClasses(\"HvTreeContent\", {\n  root: {},\n  expanded: {},\n  selected: {},\n  focused: {},\n  disabled: {},\n  iconContainer: {},\n  label: {},\n});\n\nexport type HvTreeContentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTreeContentProps extends HTMLAttributes<HTMLElement> {\n  /** className applied to the root element. */\n  className?: string;\n  /** Override or extend the styles applied to the component. */\n  classes?: HvTreeContentClasses;\n  /** The tree node label. */\n  label?: ReactNode;\n  /** The id of the node. */\n  nodeId: string;\n  /** The icon to display next to the tree node's label. */\n  icon?: ReactNode;\n  /** The icon to display next to the tree node's label. Either an expansion or collapse icon. */\n  expansionIcon?: ReactNode;\n  /** The icon to display next to the tree node's label. Either a parent or end icon. */\n  displayIcon?: ReactNode;\n}\n\n/**\n * Internal default TreeItem `component`.\n * Use this as a basis to create a custom component.\n */\nexport const DefaultContent = forwardRef<HTMLDivElement, HvTreeContentProps>(\n  (props, ref) => {\n    const {\n      classes: classesProp,\n      className,\n      displayIcon,\n      expansionIcon,\n      icon: iconProp,\n      label,\n      nodeId,\n      onClick,\n      onMouseDown,\n      ...others\n    } = props;\n    const { classes } = useClasses(classesProp);\n\n    const { cx } = useCss();\n\n    const {\n      disabled,\n      expanded,\n      selected,\n      focused,\n      handleExpansion,\n      handleSelection,\n      preventSelection,\n    } = useHvTreeItem(nodeId);\n\n    const icon = iconProp ?? expansionIcon ?? displayIcon;\n\n    return (\n      /* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions -- Key event is handled by the TreeView */\n      <div\n        {...others}\n        className={cx(className, classes.root, {\n          [classes.expanded]: expanded,\n          [classes.selected]: selected,\n          [classes.focused]: focused,\n          [classes.disabled]: disabled,\n        })}\n        onClick={(event) => {\n          handleExpansion(event);\n          handleSelection(event);\n          onClick?.(event);\n        }}\n        onMouseDown={(event) => {\n          preventSelection(event);\n          onMouseDown?.(event);\n        }}\n        ref={ref}\n      >\n        <div className={classes.iconContainer}>{icon}</div>\n        <div className={classes.label}>{label}</div>\n      </div>\n    );\n  }\n);\n"],"names":["useClasses","createClasses","root","expanded","selected","focused","disabled","iconContainer","label","DefaultContent","forwardRef","props","ref","classes","classesProp","className","displayIcon","expansionIcon","icon","iconProp","nodeId","onClick","onMouseDown","others","cx","useCss","handleExpansion","handleSelection","preventSelection","useHvTreeItem","jsxs","event","jsx"],"mappings":";;;;;;;AAOa,MAAA;AAAA,EAAEA;AAAW,IAAIC,QAAAA,cAAc,iBAAiB;AAAA,EAC3DC,MAAM,CAAC;AAAA,EACPC,UAAU,CAAC;AAAA,EACXC,UAAU,CAAC;AAAA,EACXC,SAAS,CAAC;AAAA,EACVC,UAAU,CAAC;AAAA,EACXC,eAAe,CAAC;AAAA,EAChBC,OAAO,CAAC;AACV,CAAC;AAyBM,MAAMC,iBAAiBC,MAAAA,WAC5B,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,MAAMC;AAAAA,IACNX;AAAAA,IACAY;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EACDZ,IAAAA;AACE,QAAA;AAAA,IAAEE,SAAAA;AAAAA,EAAAA,IAAYb,WAAWc,WAAW;AAEpC,QAAA;AAAA,IAAEU;AAAAA,MAAOC,OAAO,OAAA;AAEhB,QAAA;AAAA,IACJnB;AAAAA,IACAH;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAqB;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,IACEC,cAAAA,cAAcT,MAAM;AAElBF,QAAAA,OAAOC,YAAYF,iBAAiBD;AAE1C;AAAA;AAAA,IAEEc,gCAAC,SACC,GAAIP,QACJ,WAAWC,GAAGT,WAAWF,SAAQX,MAAM;AAAA,MACrC,CAACW,SAAQV,QAAQ,GAAGA;AAAAA,MACpB,CAACU,SAAQT,QAAQ,GAAGA;AAAAA,MACpB,CAACS,SAAQR,OAAO,GAAGA;AAAAA,MACnB,CAACQ,SAAQP,QAAQ,GAAGA;AAAAA,IAAAA,CACrB,GACD,SAAUyB,CAAU,UAAA;AAClBL,sBAAgBK,KAAK;AACrBJ,sBAAgBI,KAAK;AACrBV,gBAAUU,KAAK;AAAA,IAAA,GAEjB,aAAcA,CAAU,UAAA;AACtBH,uBAAiBG,KAAK;AACtBT,oBAAcS,KAAK;AAAA,IAAA,GAErB,KAEA,UAAA;AAAA,MAAAC,2BAAA,IAAC,OAAI,EAAA,WAAWnB,SAAQN,eAAgBW,UAAK,MAAA;AAAA,MAC5Cc,2BAAA,IAAA,OAAA,EAAI,WAAWnB,SAAQL,OAAQA,UAAM,OAAA;AAAA,IAAA,GACxC;AAAA;AAEJ,CACF;;;"}

package/dist/cjs/components/TreeView/TreeItem/TreeItem.cjs

@@ -2,14 +2,15 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
-const material = require("@mui/material");
+const Collapse = require("@mui/material/Collapse");
 const useForkRef = require("../../../hooks/useForkRef.cjs");
 const useDefaultProps = require("../../../hooks/useDefaultProps.cjs");
-require("../internals.cjs");
+const TreeViewProvider = require("../internals/TreeViewProvider.cjs");
+const DescendantProvider = require("../internals/DescendantProvider.cjs");
 const TreeItem_styles = require("./TreeItem.styles.cjs");
 const DefaultContent = require("./DefaultContent.cjs");
-const useTreeViewContext = require("@mui/x-tree-view/internals/TreeViewProvider/useTreeViewContext");
-const DescendantProvider = require("@mui/x-tree-view/internals/TreeViewProvider/DescendantProvider");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const Collapse__default = /* @__PURE__ */ _interopDefault(Collapse);
 const HvTreeItem = React.forwardRef((props, ref) => {
   const {
     id: idProp,
@@ -38,7 +39,7 @@ const HvTreeItem = React.forwardRef((props, ref) => {
     disabledItemsFocusable,
     treeId,
     icons: contextIcons
-  } = useTreeViewContext.useTreeViewContext();
+  } = TreeViewProvider.useTreeViewContext();
   const id = idProp || treeId && nodeId && `${treeId}-${nodeId}` || void 0;
   const [treeItemElement, setTreeItemElement] = React.useState(null);
   const contentRef = React.useRef(null);
@@ -114,7 +115,7 @@ const HvTreeItem = React.forwardRef((props, ref) => {
           label: classes.label,
           iconContainer: classes.iconContainer
         }, label, icon, expansionIcon: expandable && expansionIcon, displayIcon, ...contentProps }),
-        children && /* @__PURE__ */ jsxRuntime.jsx(DescendantProvider.DescendantProvider, { id: nodeId, children: /* @__PURE__ */ jsxRuntime.jsx(material.Collapse, { component: "ul", role: "group", unmountOnExit: true, className: classes.group, in: expanded, ...transitionProps, children }) })
+        children && /* @__PURE__ */ jsxRuntime.jsx(DescendantProvider.DescendantProvider, { id: nodeId, children: /* @__PURE__ */ jsxRuntime.jsx(Collapse__default.default, { component: "ul", role: "group", unmountOnExit: true, className: classes.group, in: expanded, ...transitionProps, children }) })
       ]
     }
   );

package/dist/cjs/components/TreeView/TreeItem/TreeItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TreeItem.cjs","sources":["../../../../../src/components/TreeView/TreeItem/TreeItem.tsx"],"sourcesContent":["import {\n  FocusEvent,\n  ReactNode,\n  forwardRef,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { Collapse } from \"@mui/material\";\nimport type { TreeItemContentProps, TreeItemProps } from \"@mui/x-tree-view\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport {\n  HvTreeViewPlugins,\n  DescendantProvider,\n  TreeItemDescendant,\n  useDescendant,\n  useTreeViewContext,\n} from \"../internals\";\nimport { staticClasses, useClasses } from \"./TreeItem.styles\";\nimport { DefaultContent } from \"./DefaultContent\";\n\nexport { staticClasses as treeItemClasses };\n\nexport type HvTreeItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTreeContentProps extends TreeItemContentProps {}\n\nexport interface HvTreeItemProps extends TreeItemProps {\n  classes?: HvTreeItemClasses;\n  disabled?: boolean;\n  icon?: ReactNode;\n  ContentComponent?: React.JSXElementConstructor<HvTreeContentProps>;\n}\n\nexport const HvTreeItem = forwardRef<HTMLLIElement, HvTreeItemProps>(\n  (props, ref) => {\n    const {\n      id: idProp,\n      nodeId,\n      children,\n      classes: classesProp,\n      className,\n      label,\n      disabled: disabledProp,\n      icon,\n      endIcon,\n      expandIcon,\n      collapseIcon,\n      ContentComponent: Component = DefaultContent,\n      TransitionProps: transitionProps,\n      ContentProps: contentProps,\n      ...others\n    } = useDefaultProps(\"HvTreeItem\", props);\n    const { classes, cx } = useClasses(classesProp);\n\n    const {\n      instance,\n      multiSelect,\n      disabledItemsFocusable,\n      treeId,\n      icons: contextIcons,\n    } = useTreeViewContext<HvTreeViewPlugins>();\n\n    const id =\n      idProp || (treeId && nodeId && `${treeId}-${nodeId}`) || undefined;\n\n    const [treeItemElement, setTreeItemElement] =\n      useState<HTMLLIElement | null>(null);\n    const contentRef = useRef<HTMLDivElement>(null);\n    const handleRef = useForkRef(setTreeItemElement, ref);\n\n    const descendant = useMemo<TreeItemDescendant>(\n      () => ({ element: treeItemElement!, id: nodeId }),\n      [nodeId, treeItemElement]\n    );\n\n    const { index, parentId } = useDescendant(descendant);\n\n    const expandable = !!(Array.isArray(children) ? children.length : children);\n    const expanded = instance ? instance.isNodeExpanded(nodeId) : false;\n    const focused = instance ? instance.isNodeFocused(nodeId) : false;\n    const selected = instance ? instance.isNodeSelected(nodeId) : false;\n    const disabled = instance ? instance.isNodeDisabled(nodeId) : false;\n\n    const expansionIcon = !expanded\n      ? expandIcon || contextIcons.defaultExpandIcon\n      : collapseIcon || contextIcons.defaultCollapseIcon;\n\n    const displayIcon = expandable\n      ? contextIcons.defaultParentIcon\n      : endIcon || contextIcons.defaultEndIcon;\n\n    useEffect(() => {\n      // On the first render a node's index will be -1. We want to wait for the real index.\n      if (instance && index !== -1) {\n        instance.updateNode({\n          id: nodeId,\n          idAttribute: id,\n          index,\n          parentId,\n          expandable,\n          disabled: disabledProp,\n        });\n\n        return () => instance.removeNode(nodeId);\n      }\n\n      return undefined;\n    }, [instance, parentId, index, nodeId, expandable, disabledProp, id]);\n\n    useEffect(() => {\n      if (instance && label) {\n        return instance.mapFirstChar(\n          nodeId,\n          (contentRef.current?.textContent ?? \"\").substring(0, 1).toLowerCase()\n        );\n      }\n      return undefined;\n    }, [instance, nodeId, label]);\n\n    const handleFocus = (event: FocusEvent<HTMLLIElement, any>) => {\n      // DOM focus stays on the tree which manages focus with aria-activedescendant\n      if (event.target === event.currentTarget) {\n        const rootElement: any =\n          typeof event.target.getRootNode === \"function\"\n            ? event.target.getRootNode()\n            : event.target.ownerDocument || document;\n\n        rootElement.getElementById(treeId).focus({ preventScroll: true });\n      }\n\n      const unfocusable = !disabledItemsFocusable && disabled;\n      const canFocus =\n        instance &&\n        !focused &&\n        !disabled &&\n        !unfocusable &&\n        event.currentTarget === event.target;\n\n      if (canFocus) {\n        instance.focusNode(event, nodeId);\n      }\n    };\n\n    return (\n      <li\n        id={id}\n        ref={handleRef}\n        role=\"treeitem\"\n        aria-expanded={expandable ? expanded : undefined}\n        aria-selected={(multiSelect && selected) || selected || undefined}\n        aria-disabled={disabled || undefined}\n        className={cx(classes.root, className)}\n        // @ts-ignore\n        onFocus={handleFocus}\n        tabIndex={-1}\n        {...others}\n      >\n        <Component\n          ref={contentRef}\n          nodeId={nodeId}\n          classes={{\n            root: classes.content,\n            expanded: classes.expanded,\n            selected: classes.selected,\n            focused: classes.focused,\n            disabled: classes.disabled,\n            label: classes.label,\n            iconContainer: classes.iconContainer,\n          }}\n          label={label}\n          icon={icon}\n          expansionIcon={expandable && expansionIcon}\n          displayIcon={displayIcon}\n          {...contentProps}\n        />\n        {children && (\n          <DescendantProvider id={nodeId}>\n            <Collapse\n              component=\"ul\"\n              role=\"group\"\n              unmountOnExit\n              className={classes.group}\n              in={expanded}\n              {...transitionProps}\n            >\n              {children}\n            </Collapse>\n          </DescendantProvider>\n        )}\n      </li>\n    );\n  }\n);\n"],"names":["HvTreeItem","forwardRef","props","ref","id","idProp","nodeId","children","classes","classesProp","className","label","disabled","disabledProp","icon","endIcon","expandIcon","collapseIcon","ContentComponent","Component","DefaultContent","TransitionProps","transitionProps","ContentProps","contentProps","others","useDefaultProps","cx","useClasses","instance","multiSelect","disabledItemsFocusable","treeId","icons","contextIcons","useTreeViewContext","undefined","treeItemElement","setTreeItemElement","useState","contentRef","useRef","handleRef","useForkRef","descendant","useMemo","element","index","parentId","useDescendant","expandable","Array","isArray","length","expanded","isNodeExpanded","focused","isNodeFocused","selected","isNodeSelected","isNodeDisabled","expansionIcon","defaultExpandIcon","defaultCollapseIcon","displayIcon","defaultParentIcon","defaultEndIcon","useEffect","updateNode","idAttribute","removeNode","mapFirstChar","current","textContent","substring","toLowerCase","handleFocus","event","target","currentTarget","rootElement","getRootNode","ownerDocument","document","getElementById","focus","preventScroll","unfocusable","canFocus","focusNode","jsxs","root","jsx","content","iconContainer","DescendantProvider","Collapse","group"],"mappings":"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"}
+{"version":3,"file":"TreeItem.cjs","sources":["../../../../../src/components/TreeView/TreeItem/TreeItem.tsx"],"sourcesContent":["import {\n  FocusEvent,\n  HTMLAttributes,\n  JSXElementConstructor,\n  ReactNode,\n  forwardRef,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport Collapse from \"@mui/material/Collapse\";\nimport { TransitionProps } from \"@mui/material/transitions\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { useTreeViewContext } from \"../internals/TreeViewProvider\";\nimport { DefaultTreeViewPlugins } from \"../internals/hooks/plugins\";\nimport {\n  DescendantProvider,\n  TreeItemDescendant,\n  useDescendant,\n} from \"../internals/DescendantProvider\";\nimport { staticClasses, useClasses } from \"./TreeItem.styles\";\nimport { DefaultContent, HvTreeContentClasses } from \"./DefaultContent\";\n\nexport { staticClasses as treeItemClasses };\n\nexport type HvTreeItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTreeContentProps extends HTMLAttributes<HTMLElement> {\n  /** className applied to the root element. */\n  className?: string;\n  /** Override or extend the styles applied to the component. */\n  classes?: HvTreeContentClasses;\n  /** The tree node label. */\n  label?: ReactNode;\n  /** The id of the node. */\n  nodeId: string;\n  /** The icon to display next to the tree node's label. */\n  icon?: ReactNode;\n  /** The icon to display next to the tree node's label. Either an expansion or collapse icon. */\n  expansionIcon?: ReactNode;\n  /** The icon to display next to the tree node's label. Either a parent or end icon. */\n  displayIcon?: ReactNode;\n}\n\nexport interface HvTreeItemProps extends HTMLAttributes<HTMLElement> {\n  /** The element id */\n  id?: string;\n  /** The id of the node. */\n  nodeId: string;\n  /** The tree node label. */\n  label?: ReactNode;\n  /** Override or extend the styles applied to the component. */\n  classes?: HvTreeItemClasses;\n  /** If `true`, the node is disabled. */\n  disabled?: boolean;\n  /** The icon to display next to the tree node's label. */\n  icon?: ReactNode;\n  /** The component used for the content node. */\n  ContentComponent?: JSXElementConstructor<HvTreeContentProps>;\n  /** Props applied to the content component */\n  ContentProps?: HvTreeContentProps;\n  /** The content of the component. */\n  children?: ReactNode;\n  /** className applied to the root element. */\n  className?: string;\n  /** The icon used to collapse the node. */\n  collapseIcon?: ReactNode;\n  /** The icon displayed next to an end node. */\n  endIcon?: ReactNode;\n  /** The icon used to expand the node. */\n  expandIcon?: ReactNode;\n  /** The component used for the transition. */\n  TransitionComponent?: JSXElementConstructor<TransitionProps>;\n  /** Props applied to the transition component */\n  TransitionProps?: TransitionProps;\n}\n\nexport const HvTreeItem = forwardRef<HTMLLIElement, HvTreeItemProps>(\n  (props, ref) => {\n    const {\n      id: idProp,\n      nodeId,\n      children,\n      classes: classesProp,\n      className,\n      label,\n      disabled: disabledProp,\n      icon,\n      endIcon,\n      expandIcon,\n      collapseIcon,\n      ContentComponent: Component = DefaultContent,\n      TransitionProps: transitionProps,\n      ContentProps: contentProps,\n      ...others\n    } = useDefaultProps(\"HvTreeItem\", props);\n    const { classes, cx } = useClasses(classesProp);\n\n    const {\n      instance,\n      multiSelect,\n      disabledItemsFocusable,\n      treeId,\n      icons: contextIcons,\n    } = useTreeViewContext<DefaultTreeViewPlugins>();\n\n    const id =\n      idProp || (treeId && nodeId && `${treeId}-${nodeId}`) || undefined;\n\n    const [treeItemElement, setTreeItemElement] =\n      useState<HTMLLIElement | null>(null);\n    const contentRef = useRef<HTMLDivElement>(null);\n    const handleRef = useForkRef(setTreeItemElement, ref);\n\n    const descendant = useMemo<TreeItemDescendant>(\n      () => ({ element: treeItemElement!, id: nodeId }),\n      [nodeId, treeItemElement]\n    );\n\n    const { index, parentId } = useDescendant(descendant);\n\n    const expandable = !!(Array.isArray(children) ? children.length : children);\n    const expanded = instance ? instance.isNodeExpanded(nodeId) : false;\n    const focused = instance ? instance.isNodeFocused(nodeId) : false;\n    const selected = instance ? instance.isNodeSelected(nodeId) : false;\n    const disabled = instance ? instance.isNodeDisabled(nodeId) : false;\n\n    const expansionIcon = !expanded\n      ? expandIcon || contextIcons.defaultExpandIcon\n      : collapseIcon || contextIcons.defaultCollapseIcon;\n\n    const displayIcon = expandable\n      ? contextIcons.defaultParentIcon\n      : endIcon || contextIcons.defaultEndIcon;\n\n    useEffect(() => {\n      // On the first render a node's index will be -1. We want to wait for the real index.\n      if (instance && index !== -1) {\n        instance.updateNode({\n          id: nodeId,\n          idAttribute: id,\n          index,\n          parentId,\n          expandable,\n          disabled: disabledProp,\n        });\n\n        return () => instance.removeNode(nodeId);\n      }\n\n      return undefined;\n    }, [instance, parentId, index, nodeId, expandable, disabledProp, id]);\n\n    useEffect(() => {\n      if (instance && label) {\n        return instance.mapFirstChar(\n          nodeId,\n          (contentRef.current?.textContent ?? \"\").substring(0, 1).toLowerCase()\n        );\n      }\n      return undefined;\n    }, [instance, nodeId, label]);\n\n    const handleFocus = (event: FocusEvent<HTMLLIElement, any>) => {\n      // DOM focus stays on the tree which manages focus with aria-activedescendant\n      if (event.target === event.currentTarget) {\n        const rootElement: any =\n          typeof event.target.getRootNode === \"function\"\n            ? event.target.getRootNode()\n            : event.target.ownerDocument || document;\n\n        rootElement.getElementById(treeId).focus({ preventScroll: true });\n      }\n\n      const unfocusable = !disabledItemsFocusable && disabled;\n      const canFocus =\n        instance &&\n        !focused &&\n        !disabled &&\n        !unfocusable &&\n        event.currentTarget === event.target;\n\n      if (canFocus) {\n        instance.focusNode(event, nodeId);\n      }\n    };\n\n    return (\n      <li\n        id={id}\n        ref={handleRef}\n        role=\"treeitem\"\n        aria-expanded={expandable ? expanded : undefined}\n        aria-selected={(multiSelect && selected) || selected || undefined}\n        aria-disabled={disabled || undefined}\n        className={cx(classes.root, className)}\n        // @ts-ignore\n        onFocus={handleFocus}\n        tabIndex={-1}\n        {...others}\n      >\n        <Component\n          ref={contentRef}\n          nodeId={nodeId}\n          classes={{\n            root: classes.content,\n            expanded: classes.expanded,\n            selected: classes.selected,\n            focused: classes.focused,\n            disabled: classes.disabled,\n            label: classes.label,\n            iconContainer: classes.iconContainer,\n          }}\n          label={label}\n          icon={icon}\n          expansionIcon={expandable && expansionIcon}\n          displayIcon={displayIcon}\n          {...contentProps}\n        />\n        {children && (\n          <DescendantProvider id={nodeId}>\n            <Collapse\n              component=\"ul\"\n              role=\"group\"\n              unmountOnExit\n              className={classes.group}\n              in={expanded}\n              {...transitionProps}\n            >\n              {children}\n            </Collapse>\n          </DescendantProvider>\n        )}\n      </li>\n    );\n  }\n);\n"],"names":["HvTreeItem","forwardRef","props","ref","id","idProp","nodeId","children","classes","classesProp","className","label","disabled","disabledProp","icon","endIcon","expandIcon","collapseIcon","ContentComponent","Component","DefaultContent","TransitionProps","transitionProps","ContentProps","contentProps","others","useDefaultProps","cx","useClasses","instance","multiSelect","disabledItemsFocusable","treeId","icons","contextIcons","useTreeViewContext","undefined","treeItemElement","setTreeItemElement","useState","contentRef","useRef","handleRef","useForkRef","descendant","useMemo","element","index","parentId","useDescendant","expandable","Array","isArray","length","expanded","isNodeExpanded","focused","isNodeFocused","selected","isNodeSelected","isNodeDisabled","expansionIcon","defaultExpandIcon","defaultCollapseIcon","displayIcon","defaultParentIcon","defaultEndIcon","useEffect","updateNode","idAttribute","removeNode","mapFirstChar","current","textContent","substring","toLowerCase","handleFocus","event","target","currentTarget","rootElement","getRootNode","ownerDocument","document","getElementById","focus","preventScroll","unfocusable","canFocus","focusNode","jsxs","root","jsx","content","iconContainer","DescendantProvider","Collapse","group"],"mappings":"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"}

package/dist/cjs/components/TreeView/TreeItem/useHvTreeItem.cjs

@@ -1,12 +1,11 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-require("../internals.cjs");
-const useTreeViewContext = require("@mui/x-tree-view/internals/TreeViewProvider/useTreeViewContext");
+const TreeViewProvider = require("../internals/TreeViewProvider.cjs");
 function useHvTreeItem(nodeId) {
   const {
     instance,
     multiSelect
-  } = useTreeViewContext.useTreeViewContext();
+  } = TreeViewProvider.useTreeViewContext();
   const expandable = instance ? instance.isNodeExpandable(nodeId) : false;
   const expanded = instance ? instance.isNodeExpanded(nodeId) : false;
   const focused = instance ? instance.isNodeFocused(nodeId) : false;

package/dist/cjs/components/TreeView/TreeItem/useHvTreeItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useHvTreeItem.cjs","sources":["../../../../../src/components/TreeView/TreeItem/useHvTreeItem.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport { useTreeViewContext, HvTreeViewPlugins } from \"../internals\";\n\nexport function useHvTreeItem(nodeId: string) {\n  const { instance, multiSelect } = useTreeViewContext<HvTreeViewPlugins>();\n\n  const expandable = instance ? instance.isNodeExpandable(nodeId) : false;\n  const expanded = instance ? instance.isNodeExpanded(nodeId) : false;\n  const focused = instance ? instance.isNodeFocused(nodeId) : false;\n  const selected = instance ? instance.isNodeSelected(nodeId) : false;\n  const disabled = instance ? instance.isNodeDisabled(nodeId) : false;\n\n  const handleExpansion = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (!instance || disabled) return;\n\n    if (!focused) {\n      instance.focusNode(event, nodeId);\n    }\n\n    const multiple =\n      multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n    // If already expanded and trying to toggle selection don't close\n    if (expandable && !(multiple && instance.isNodeExpanded(nodeId))) {\n      instance.toggleNodeExpansion(event, nodeId);\n    }\n  };\n\n  const handleSelection = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (!instance || disabled) return;\n\n    if (!focused) {\n      instance.focusNode(event, nodeId);\n    }\n\n    const multiple =\n      multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n    if (multiple) {\n      if (event.shiftKey) {\n        instance.selectRange(event, { end: nodeId });\n      } else {\n        instance.selectNode(event, nodeId, true);\n      }\n    } else {\n      instance.selectNode(event, nodeId);\n    }\n  };\n\n  const preventSelection = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (event.shiftKey || event.ctrlKey || event.metaKey || disabled) {\n      // Prevent text selection\n      event.preventDefault();\n    }\n  };\n\n  return {\n    instance,\n    disabled,\n    expanded,\n    selected,\n    focused,\n    handleExpansion,\n    handleSelection,\n    preventSelection,\n  };\n}\n"],"names":["useHvTreeItem","nodeId","instance","multiSelect","useTreeViewContext","expandable","isNodeExpandable","expanded","isNodeExpanded","focused","isNodeFocused","selected","isNodeSelected","disabled","isNodeDisabled","handleExpansion","event","focusNode","multiple","shiftKey","ctrlKey","metaKey","toggleNodeExpansion","handleSelection","selectRange","end","selectNode","preventSelection","preventDefault"],"mappings":";;;;AAIO,SAASA,cAAcC,QAAgB;AACtC,QAAA;AAAA,IAAEC;AAAAA,IAAUC;AAAAA,MAAgBC,mBAAsC,mBAAA;AAExE,QAAMC,aAAaH,WAAWA,SAASI,iBAAiBL,MAAM,IAAI;AAClE,QAAMM,WAAWL,WAAWA,SAASM,eAAeP,MAAM,IAAI;AAC9D,QAAMQ,UAAUP,WAAWA,SAASQ,cAAcT,MAAM,IAAI;AAC5D,QAAMU,WAAWT,WAAWA,SAASU,eAAeX,MAAM,IAAI;AAC9D,QAAMY,WAAWX,WAAWA,SAASY,eAAeb,MAAM,IAAI;AAExDc,QAAAA,kBAAkBA,CAACC,UAA4C;AACnE,QAAI,CAACd,YAAYW;AAAU;AAE3B,QAAI,CAACJ,SAAS;AACHQ,eAAAA,UAAUD,OAAOf,MAAM;AAAA,IAClC;AAEA,UAAMiB,WACJf,gBAAgBa,MAAMG,YAAYH,MAAMI,WAAWJ,MAAMK;AAG3D,QAAIhB,cAAc,EAAEa,YAAYhB,SAASM,eAAeP,MAAM,IAAI;AACvDqB,eAAAA,oBAAoBN,OAAOf,MAAM;AAAA,IAC5C;AAAA,EAAA;AAGIsB,QAAAA,kBAAkBA,CAACP,UAA4C;AACnE,QAAI,CAACd,YAAYW;AAAU;AAE3B,QAAI,CAACJ,SAAS;AACHQ,eAAAA,UAAUD,OAAOf,MAAM;AAAA,IAClC;AAEA,UAAMiB,WACJf,gBAAgBa,MAAMG,YAAYH,MAAMI,WAAWJ,MAAMK;AAE3D,QAAIH,UAAU;AACZ,UAAIF,MAAMG,UAAU;AAClBjB,iBAASsB,YAAYR,OAAO;AAAA,UAAES,KAAKxB;AAAAA,QAAAA,CAAQ;AAAA,MAAA,OACtC;AACIyB,iBAAAA,WAAWV,OAAOf,QAAQ,IAAI;AAAA,MACzC;AAAA,IAAA,OACK;AACIyB,eAAAA,WAAWV,OAAOf,MAAM;AAAA,IACnC;AAAA,EAAA;AAGI0B,QAAAA,mBAAmBA,CAACX,UAA4C;AACpE,QAAIA,MAAMG,YAAYH,MAAMI,WAAWJ,MAAMK,WAAWR,UAAU;AAEhEG,YAAMY,eAAe;AAAA,IACvB;AAAA,EAAA;AAGK,SAAA;AAAA,IACL1B;AAAAA,IACAW;AAAAA,IACAN;AAAAA,IACAI;AAAAA,IACAF;AAAAA,IACAM;AAAAA,IACAQ;AAAAA,IACAI;AAAAA,EAAAA;AAEJ;;"}
+{"version":3,"file":"useHvTreeItem.cjs","sources":["../../../../../src/components/TreeView/TreeItem/useHvTreeItem.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport { useTreeViewContext } from \"../internals/TreeViewProvider\";\nimport { DefaultTreeViewPlugins } from \"../internals/hooks/plugins\";\n\nexport function useHvTreeItem(nodeId: string) {\n  const { instance, multiSelect } =\n    useTreeViewContext<DefaultTreeViewPlugins>();\n\n  const expandable = instance ? instance.isNodeExpandable(nodeId) : false;\n  const expanded = instance ? instance.isNodeExpanded(nodeId) : false;\n  const focused = instance ? instance.isNodeFocused(nodeId) : false;\n  const selected = instance ? instance.isNodeSelected(nodeId) : false;\n  const disabled = instance ? instance.isNodeDisabled(nodeId) : false;\n\n  const handleExpansion = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (!instance || disabled) return;\n\n    if (!focused) {\n      instance.focusNode(event, nodeId);\n    }\n\n    const multiple =\n      multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n    // If already expanded and trying to toggle selection don't close\n    if (expandable && !(multiple && instance.isNodeExpanded(nodeId))) {\n      instance.toggleNodeExpansion(event, nodeId);\n    }\n  };\n\n  const handleSelection = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (!instance || disabled) return;\n\n    if (!focused) {\n      instance.focusNode(event, nodeId);\n    }\n\n    const multiple =\n      multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);\n\n    if (multiple) {\n      if (event.shiftKey) {\n        instance.selectRange(event, { end: nodeId });\n      } else {\n        instance.selectNode(event, nodeId, true);\n      }\n    } else {\n      instance.selectNode(event, nodeId);\n    }\n  };\n\n  const preventSelection = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (event.shiftKey || event.ctrlKey || event.metaKey || disabled) {\n      // Prevent text selection\n      event.preventDefault();\n    }\n  };\n\n  return {\n    instance,\n    disabled,\n    expanded,\n    selected,\n    focused,\n    handleExpansion,\n    handleSelection,\n    preventSelection,\n  };\n}\n"],"names":["useHvTreeItem","nodeId","instance","multiSelect","useTreeViewContext","expandable","isNodeExpandable","expanded","isNodeExpanded","focused","isNodeFocused","selected","isNodeSelected","disabled","isNodeDisabled","handleExpansion","event","focusNode","multiple","shiftKey","ctrlKey","metaKey","toggleNodeExpansion","handleSelection","selectRange","end","selectNode","preventSelection","preventDefault"],"mappings":";;;AAKO,SAASA,cAAcC,QAAgB;AACtC,QAAA;AAAA,IAAEC;AAAAA,IAAUC;AAAAA,MAChBC,iBAA2C,mBAAA;AAE7C,QAAMC,aAAaH,WAAWA,SAASI,iBAAiBL,MAAM,IAAI;AAClE,QAAMM,WAAWL,WAAWA,SAASM,eAAeP,MAAM,IAAI;AAC9D,QAAMQ,UAAUP,WAAWA,SAASQ,cAAcT,MAAM,IAAI;AAC5D,QAAMU,WAAWT,WAAWA,SAASU,eAAeX,MAAM,IAAI;AAC9D,QAAMY,WAAWX,WAAWA,SAASY,eAAeb,MAAM,IAAI;AAExDc,QAAAA,kBAAkBA,CAACC,UAA4C;AACnE,QAAI,CAACd,YAAYW;AAAU;AAE3B,QAAI,CAACJ,SAAS;AACHQ,eAAAA,UAAUD,OAAOf,MAAM;AAAA,IAClC;AAEA,UAAMiB,WACJf,gBAAgBa,MAAMG,YAAYH,MAAMI,WAAWJ,MAAMK;AAG3D,QAAIhB,cAAc,EAAEa,YAAYhB,SAASM,eAAeP,MAAM,IAAI;AACvDqB,eAAAA,oBAAoBN,OAAOf,MAAM;AAAA,IAC5C;AAAA,EAAA;AAGIsB,QAAAA,kBAAkBA,CAACP,UAA4C;AACnE,QAAI,CAACd,YAAYW;AAAU;AAE3B,QAAI,CAACJ,SAAS;AACHQ,eAAAA,UAAUD,OAAOf,MAAM;AAAA,IAClC;AAEA,UAAMiB,WACJf,gBAAgBa,MAAMG,YAAYH,MAAMI,WAAWJ,MAAMK;AAE3D,QAAIH,UAAU;AACZ,UAAIF,MAAMG,UAAU;AAClBjB,iBAASsB,YAAYR,OAAO;AAAA,UAAES,KAAKxB;AAAAA,QAAAA,CAAQ;AAAA,MAAA,OACtC;AACIyB,iBAAAA,WAAWV,OAAOf,QAAQ,IAAI;AAAA,MACzC;AAAA,IAAA,OACK;AACIyB,eAAAA,WAAWV,OAAOf,MAAM;AAAA,IACnC;AAAA,EAAA;AAGI0B,QAAAA,mBAAmBA,CAACX,UAA4C;AACpE,QAAIA,MAAMG,YAAYH,MAAMI,WAAWJ,MAAMK,WAAWR,UAAU;AAEhEG,YAAMY,eAAe;AAAA,IACvB;AAAA,EAAA;AAGK,SAAA;AAAA,IACL1B;AAAAA,IACAW;AAAAA,IACAN;AAAAA,IACAI;AAAAA,IACAF;AAAAA,IACAM;AAAAA,IACAQ;AAAAA,IACAI;AAAAA,EAAAA;AAEJ;;"}

package/dist/cjs/components/TreeView/TreeView.cjs

@@ -5,10 +5,10 @@ const React = require("react");
 const utils = require("@mui/base/utils");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
-const internals = require("./internals.cjs");
+const useTreeView = require("./internals/hooks/useTreeView.cjs");
+const TreeViewProvider = require("./internals/TreeViewProvider.cjs");
 const TreeView_styles = require("./TreeView.styles.cjs");
-const useTreeView = require("@mui/x-tree-view/internals/useTreeView");
-const TreeViewProvider = require("@mui/x-tree-view/internals/TreeViewProvider");
+const defaultPlugins = require("./internals/hooks/plugins/defaultPlugins.cjs");
 const HvTreeView = React.forwardRef(function HvTreeView2(props, ref) {
   const {
     id,
@@ -54,7 +54,7 @@ const HvTreeView = React.forwardRef(function HvTreeView2(props, ref) {
     defaultEndIcon,
     defaultExpandIcon,
     defaultParentIcon,
-    plugins: internals.HV_TREE_VIEW_PLUGINS,
+    plugins: defaultPlugins.DEFAULT_TREE_VIEW_PLUGINS,
     rootRef: ref
   });
   const rootProps = utils.useSlotProps({

package/dist/cjs/components/TreeView/TreeView.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TreeView.cjs","sources":["../../../../src/components/TreeView/TreeView.tsx"],"sourcesContent":["import { ReactNode, Ref, forwardRef } from \"react\";\nimport { useSlotProps } from \"@mui/base/utils\";\nimport { DropDownXS, DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport {\n  HV_TREE_VIEW_PLUGINS,\n  HvTreeViewPluginParameters,\n  TreeViewProvider,\n  useTreeView,\n} from \"./internals\";\nimport { staticClasses, useClasses } from \"./TreeView.styles\";\n\nexport { staticClasses as treeView2Classes }; // TODO: remove old `treeViewClasses`\n\nexport type HvTreeViewClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTreeViewProps<Multiple extends boolean | undefined>\n  extends HvBaseProps<HTMLUListElement>,\n    HvTreeViewPluginParameters<Multiple> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvTreeViewClasses;\n  /** Tree View children. Usually a `HvTreeItem` instance, or a custom variation of it */\n  children?: ReactNode;\n}\n\ntype HvTreeViewComponent = <Multiple extends boolean | undefined = undefined>(\n  props: HvTreeViewProps<Multiple>\n) => React.JSX.Element;\n\n/* eslint-disable prefer-arrow-callback */\n/**\n * A Tree View displays hierarchical structures.\n * It also facilitates the exploration of categorical levels and their content.\n *\n * Tree structures are built through composing the `HvTreeItem` component,\n * or a custom variation of it.\n *\n * It is based on MUI's [TreeView](https://mui.com/x/react-tree-view) component.\n *\n * @example\n * ```tsx\n * <HvTreeView>\n *   <HvTreeItem nodeId=\"1\" label=\"File1\" />\n * </HvTreeView>\n * ```\n */\nconst HvTreeView = forwardRef(function HvTreeView<\n  Multiple extends boolean | undefined\n>(props: HvTreeViewProps<Multiple>, ref: Ref<HTMLUListElement>) {\n  const {\n    id,\n    children,\n    classes: classesProp,\n    className,\n\n    disabledItemsFocusable,\n    multiSelect,\n    expanded,\n    defaultExpanded,\n    selected,\n    defaultSelected,\n    disableSelection,\n    defaultCollapseIcon = <DropDownXS role=\"none\" />,\n    defaultExpandIcon = <DropRightXS role=\"none\" />,\n    defaultEndIcon,\n    defaultParentIcon,\n    onNodeSelect,\n    onNodeToggle,\n    onNodeFocus,\n    ...others\n  } = useDefaultProps(\"HvTreeView\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const { getRootProps, contextValue } = useTreeView({\n    disabledItemsFocusable,\n    expanded,\n    defaultExpanded,\n    onNodeToggle,\n    onNodeFocus,\n    disableSelection,\n    defaultSelected,\n    selected,\n    multiSelect,\n    onNodeSelect: onNodeSelect as HvTreeViewProps<any>[\"onNodeSelect\"],\n    id,\n    defaultCollapseIcon,\n    defaultEndIcon,\n    defaultExpandIcon,\n    defaultParentIcon,\n    plugins: HV_TREE_VIEW_PLUGINS,\n    rootRef: ref,\n  });\n\n  const rootProps = useSlotProps({\n    elementType: \"ul\",\n    externalSlotProps: {},\n    externalForwardedProps: others,\n    className: classes.root,\n    getSlotProps: getRootProps,\n    ownerState: props,\n  });\n\n  return (\n    <TreeViewProvider value={contextValue}>\n      <ul className={cx(classes.root, className)} {...rootProps} {...others}>\n        {children}\n      </ul>\n    </TreeViewProvider>\n  );\n}) as HvTreeViewComponent;\n\nexport { HvTreeView };\n"],"names":["HvTreeView","forwardRef","props","ref","id","children","classes","classesProp","className","disabledItemsFocusable","multiSelect","expanded","defaultExpanded","selected","defaultSelected","disableSelection","defaultCollapseIcon","jsx","DropDownXS","defaultExpandIcon","DropRightXS","defaultEndIcon","defaultParentIcon","onNodeSelect","onNodeToggle","onNodeFocus","others","useDefaultProps","cx","useClasses","getRootProps","contextValue","useTreeView","plugins","HV_TREE_VIEW_PLUGINS","rootRef","rootProps","useSlotProps","elementType","externalSlotProps","externalForwardedProps","root","getSlotProps","ownerState","TreeViewProvider"],"mappings":";;;;;;;;;;;AAkDA,MAAMA,aAAaC,MAAAA,WAAW,SAASD,YAErCE,OAAkCC,KAA4B;AACxD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,sBAAsBC,2BAAAA,IAACC,gBAAAA,YAAW,EAAA,MAAK,OAAS,CAAA;AAAA,IAChDC,oBAAoBF,2BAAAA,IAACG,gBAAAA,aAAY,EAAA,MAAK,OAAS,CAAA;AAAA,IAC/CC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,cAAczB,KAAK;AACjC,QAAA;AAAA,IAAEI;AAAAA,IAASsB;AAAAA,EAAAA,IAAOC,gBAAAA,WAAWtB,WAAW;AAExC,QAAA;AAAA,IAAEuB;AAAAA,IAAcC;AAAAA,MAAiBC,wBAAY;AAAA,IACjDvB;AAAAA,IACAE;AAAAA,IACAC;AAAAA,IACAY;AAAAA,IACAC;AAAAA,IACAV;AAAAA,IACAD;AAAAA,IACAD;AAAAA,IACAH;AAAAA,IACAa;AAAAA,IACAnB;AAAAA,IACAY;AAAAA,IACAK;AAAAA,IACAF;AAAAA,IACAG;AAAAA,IACAW,SAASC,UAAAA;AAAAA,IACTC,SAAShC;AAAAA,EAAAA,CACV;AAED,QAAMiC,YAAYC,MAAAA,aAAa;AAAA,IAC7BC,aAAa;AAAA,IACbC,mBAAmB,CAAC;AAAA,IACpBC,wBAAwBd;AAAAA,IACxBlB,WAAWF,QAAQmC;AAAAA,IACnBC,cAAcZ;AAAAA,IACda,YAAYzC;AAAAA,EAAAA,CACb;AAED,wCACG0C,iBAAiB,kBAAA,EAAA,OAAOb,cACvB,UAAAd,2BAAAA,IAAC,QAAG,WAAWW,GAAGtB,QAAQmC,MAAMjC,SAAS,GAAG,GAAI4B,WAAeV,GAAAA,QAC5DrB,UACH,EACF,CAAA;AAEJ,CAAC;;;"}
+{"version":3,"file":"TreeView.cjs","sources":["../../../../src/components/TreeView/TreeView.tsx"],"sourcesContent":["import { ReactNode, Ref, forwardRef } from \"react\";\nimport { useSlotProps } from \"@mui/base/utils\";\nimport { DropDownXS, DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport {\n  DEFAULT_TREE_VIEW_PLUGINS,\n  DefaultTreeViewPluginParameters,\n} from \"./internals/hooks/plugins\";\nimport { useTreeView } from \"./internals/hooks/useTreeView\";\nimport { TreeViewProvider } from \"./internals/TreeViewProvider\";\nimport { staticClasses, useClasses } from \"./TreeView.styles\";\n\nexport { staticClasses as treeView2Classes }; // TODO: remove old `treeViewClasses`\n\nexport type HvTreeViewClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTreeViewProps<Multiple extends boolean | undefined>\n  extends HvBaseProps<HTMLUListElement>,\n    DefaultTreeViewPluginParameters<Multiple> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvTreeViewClasses;\n  /** Tree View children. Usually a `HvTreeItem` instance, or a custom variation of it */\n  children?: ReactNode;\n}\n\ntype HvTreeViewComponent = <Multiple extends boolean | undefined = undefined>(\n  props: HvTreeViewProps<Multiple>\n) => React.JSX.Element;\n\n/* eslint-disable prefer-arrow-callback */\n/**\n * A Tree View displays hierarchical structures.\n * It also facilitates the exploration of categorical levels and their content.\n *\n * Tree structures are built through composing the `HvTreeItem` component,\n * or a custom variation of it.\n *\n * It is based on MUI's [TreeView](https://mui.com/x/react-tree-view) component.\n *\n * @example\n * ```tsx\n * <HvTreeView>\n *   <HvTreeItem nodeId=\"1\" label=\"File1\" />\n * </HvTreeView>\n * ```\n */\nconst HvTreeView = forwardRef(function HvTreeView<\n  Multiple extends boolean | undefined\n>(props: HvTreeViewProps<Multiple>, ref: Ref<HTMLUListElement>) {\n  const {\n    id,\n    children,\n    classes: classesProp,\n    className,\n\n    disabledItemsFocusable,\n    multiSelect,\n    expanded,\n    defaultExpanded,\n    selected,\n    defaultSelected,\n    disableSelection,\n    defaultCollapseIcon = <DropDownXS role=\"none\" />,\n    defaultExpandIcon = <DropRightXS role=\"none\" />,\n    defaultEndIcon,\n    defaultParentIcon,\n    onNodeSelect,\n    onNodeToggle,\n    onNodeFocus,\n    ...others\n  } = useDefaultProps(\"HvTreeView\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const { getRootProps, contextValue } = useTreeView({\n    disabledItemsFocusable,\n    expanded,\n    defaultExpanded,\n    onNodeToggle,\n    onNodeFocus,\n    disableSelection,\n    defaultSelected,\n    selected,\n    multiSelect,\n    onNodeSelect: onNodeSelect as HvTreeViewProps<any>[\"onNodeSelect\"],\n    id,\n    defaultCollapseIcon,\n    defaultEndIcon,\n    defaultExpandIcon,\n    defaultParentIcon,\n    plugins: DEFAULT_TREE_VIEW_PLUGINS,\n    rootRef: ref,\n  });\n\n  const rootProps = useSlotProps({\n    elementType: \"ul\",\n    externalSlotProps: {},\n    externalForwardedProps: others,\n    className: classes.root,\n    getSlotProps: getRootProps,\n    ownerState: props,\n  });\n\n  return (\n    <TreeViewProvider value={contextValue}>\n      <ul className={cx(classes.root, className)} {...rootProps} {...others}>\n        {children}\n      </ul>\n    </TreeViewProvider>\n  );\n}) as HvTreeViewComponent;\n\nexport { HvTreeView };\n"],"names":["HvTreeView","forwardRef","props","ref","id","children","classes","classesProp","className","disabledItemsFocusable","multiSelect","expanded","defaultExpanded","selected","defaultSelected","disableSelection","defaultCollapseIcon","jsx","DropDownXS","defaultExpandIcon","DropRightXS","defaultEndIcon","defaultParentIcon","onNodeSelect","onNodeToggle","onNodeFocus","others","useDefaultProps","cx","useClasses","getRootProps","contextValue","useTreeView","plugins","DEFAULT_TREE_VIEW_PLUGINS","rootRef","rootProps","useSlotProps","elementType","externalSlotProps","externalForwardedProps","root","getSlotProps","ownerState","TreeViewProvider"],"mappings":";;;;;;;;;;;AAkDA,MAAMA,aAAaC,MAAAA,WAAW,SAASD,YAErCE,OAAkCC,KAA4B;AACxD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,sBAAsBC,2BAAAA,IAACC,gBAAAA,YAAW,EAAA,MAAK,OAAS,CAAA;AAAA,IAChDC,oBAAoBF,2BAAAA,IAACG,gBAAAA,aAAY,EAAA,MAAK,OAAS,CAAA;AAAA,IAC/CC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,cAAczB,KAAK;AACjC,QAAA;AAAA,IAAEI;AAAAA,IAASsB;AAAAA,EAAAA,IAAOC,gBAAAA,WAAWtB,WAAW;AAExC,QAAA;AAAA,IAAEuB;AAAAA,IAAcC;AAAAA,MAAiBC,wBAAY;AAAA,IACjDvB;AAAAA,IACAE;AAAAA,IACAC;AAAAA,IACAY;AAAAA,IACAC;AAAAA,IACAV;AAAAA,IACAD;AAAAA,IACAD;AAAAA,IACAH;AAAAA,IACAa;AAAAA,IACAnB;AAAAA,IACAY;AAAAA,IACAK;AAAAA,IACAF;AAAAA,IACAG;AAAAA,IACAW,SAASC,eAAAA;AAAAA,IACTC,SAAShC;AAAAA,EAAAA,CACV;AAED,QAAMiC,YAAYC,MAAAA,aAAa;AAAA,IAC7BC,aAAa;AAAA,IACbC,mBAAmB,CAAC;AAAA,IACpBC,wBAAwBd;AAAAA,IACxBlB,WAAWF,QAAQmC;AAAAA,IACnBC,cAAcZ;AAAAA,IACda,YAAYzC;AAAAA,EAAAA,CACb;AAED,wCACG0C,iBAAiB,kBAAA,EAAA,OAAOb,cACvB,UAAAd,2BAAAA,IAAC,QAAG,WAAWW,GAAGtB,QAAQmC,MAAMjC,SAAS,GAAG,GAAI4B,WAAeV,GAAAA,QAC5DrB,UACH,EACF,CAAA;AAEJ,CAAC;;;"}

package/dist/cjs/components/TreeView/internals/DescendantProvider.cjs

@@ -0,0 +1,146 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const React = require("react");
+const utils = require("@mui/material/utils");
+function _interopNamespace(e) {
+  if (e && e.__esModule)
+    return e;
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespace(React);
+function findIndex(array, comp) {
+  for (let i = 0; i < array.length; i += 1) {
+    if (comp(array[i])) {
+      return i;
+    }
+  }
+  return -1;
+}
+function binaryFindElement(array, element) {
+  let start = 0;
+  let end = array.length - 1;
+  while (start <= end) {
+    const middle = Math.floor((start + end) / 2);
+    if (array[middle].element === element) {
+      return middle;
+    }
+    if (
+      // eslint-disable-next-line no-bitwise
+      array[middle].element.compareDocumentPosition(element) & Node.DOCUMENT_POSITION_PRECEDING
+    ) {
+      end = middle - 1;
+    } else {
+      start = middle + 1;
+    }
+  }
+  return start;
+}
+const DescendantContext = React__namespace.createContext({});
+if (process.env.NODE_ENV !== "production") {
+  DescendantContext.displayName = "DescendantContext";
+}
+function usePrevious(value) {
+  const ref = React__namespace.useRef(null);
+  React__namespace.useEffect(() => {
+    ref.current = value;
+  }, [value]);
+  return ref.current;
+}
+const noop = () => {
+};
+function useDescendant(descendant) {
+  const [, forceUpdate] = React__namespace.useState();
+  const {
+    registerDescendant = noop,
+    unregisterDescendant = noop,
+    descendants = [],
+    parentId = null
+  } = React__namespace.useContext(DescendantContext);
+  const index = findIndex(descendants, (item) => item.element === descendant.element);
+  const previousDescendants = usePrevious(descendants);
+  const someDescendantsHaveChanged = descendants.some((newDescendant, position) => {
+    return previousDescendants && previousDescendants[position] && previousDescendants[position].element !== newDescendant.element;
+  });
+  utils.unstable_useEnhancedEffect(() => {
+    if (descendant.element) {
+      registerDescendant({
+        ...descendant,
+        index
+      });
+      return () => {
+        unregisterDescendant(descendant.element);
+      };
+    }
+    forceUpdate({});
+    return void 0;
+  }, [registerDescendant, unregisterDescendant, index, someDescendantsHaveChanged, descendant]);
+  return {
+    parentId,
+    index
+  };
+}
+const DescendantProvider = (props) => {
+  const {
+    children,
+    id
+  } = props;
+  const [items, set] = React__namespace.useState([]);
+  const registerDescendant = React__namespace.useCallback(({
+    element,
+    ...other
+  }) => {
+    set((oldItems) => {
+      if (oldItems.length === 0) {
+        return [{
+          ...other,
+          element,
+          index: 0
+        }];
+      }
+      const index = binaryFindElement(oldItems, element);
+      let newItems;
+      if (oldItems[index] && oldItems[index].element === element) {
+        newItems = oldItems;
+      } else {
+        const newItem = {
+          ...other,
+          element,
+          index
+        };
+        newItems = oldItems.slice();
+        newItems.splice(index, 0, newItem);
+      }
+      newItems.forEach((item, position) => {
+        item.index = position;
+      });
+      return newItems;
+    });
+  }, []);
+  const unregisterDescendant = React__namespace.useCallback((element) => {
+    set((oldItems) => oldItems.filter((item) => element !== item.element));
+  }, []);
+  const value = React__namespace.useMemo(() => ({
+    descendants: items,
+    registerDescendant,
+    unregisterDescendant,
+    parentId: id
+  }), [items, registerDescendant, unregisterDescendant, id]);
+  return /* @__PURE__ */ jsxRuntime.jsx(DescendantContext.Provider, { value, children });
+};
+exports.DescendantProvider = DescendantProvider;
+exports.useDescendant = useDescendant;
+//# sourceMappingURL=DescendantProvider.cjs.map