@hitachivantara/uikit-react-core 5.27.5 → 5.27.7

package/dist/cjs/components/Stack/Stack.cjs

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const styles = require("@mui/material/styles");
 const MuiDivider = require("@mui/material/Divider");
@@ -8,7 +9,6 @@ const isBoolean = require("lodash/isBoolean");
 const useWidth = require("../../hooks/useWidth.cjs");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const Stack_styles = require("./Stack.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Focus = require("../Focus/Focus.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const React__default = /* @__PURE__ */ _interopDefault(React);
@@ -49,35 +49,16 @@ const HvStack = (props) => {
   const processedDirection = React.useMemo(() => getDirection(direction, width, breakpoints.keys), [direction, width, breakpoints]);
   const getDividerComponent = React.useCallback(() => {
     if (isBoolean__default.default(divider) && divider) {
-      return /* @__PURE__ */ jsxRuntime.jsx(MuiDivider__default.default, {
-        orientation: processedDirection === "column" ? "horizontal" : "vertical",
-        flexItem: processedDirection === "row",
-        role: "separator",
-        ...dividerProps
-      });
+      return /* @__PURE__ */ jsxRuntime.jsx(MuiDivider__default.default, { orientation: processedDirection === "column" ? "horizontal" : "vertical", flexItem: processedDirection === "row", role: "separator", ...dividerProps });
     }
     return divider;
   }, [divider, dividerProps, processedDirection]);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ref: containerRef,
-    className: cx(classes.root, classes[processedDirection], classes[spacing], className),
-    ...others,
-    children: React__default.default.Children.map(children, (child, i) => {
-      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-        children: [divider && i !== 0 && getDividerComponent(), withNavigation ? /* @__PURE__ */ jsxRuntime.jsx(Focus.HvFocus, {
-          rootRef: containerRef,
-          focusDisabled: false,
-          strategy: "grid",
-          navigationJump: processedDirection === "column" ? 1 : React__default.default.Children.count(children) || 0,
-          filterClass: "child",
-          children: /* @__PURE__ */ jsxRuntime.jsx("div", {
-            className: "child",
-            children: child
-          })
-        }) : child]
-      });
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: containerRef, className: cx(classes.root, classes[processedDirection], classes[spacing], className), ...others, children: React__default.default.Children.map(children, (child, i) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      divider && i !== 0 && getDividerComponent(),
+      withNavigation ? /* @__PURE__ */ jsxRuntime.jsx(Focus.HvFocus, { rootRef: containerRef, focusDisabled: false, strategy: "grid", navigationJump: processedDirection === "column" ? 1 : React__default.default.Children.count(children) || 0, filterClass: "child", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "child", children: child }) }) : child
+    ] });
+  }) });
 };
 exports.stackClasses = Stack_styles.staticClasses;
 exports.HvStack = HvStack;

package/dist/cjs/components/Stack/Stack.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Stack.cjs","sources":["../../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import React, { useMemo, useRef, useCallback } from \"react\";\n\nimport { useTheme } from \"@mui/material/styles\";\nimport MuiDivider, {\n  DividerProps as MuiDividerProps,\n} from \"@mui/material/Divider\";\n\nimport isString from \"lodash/isString\";\nimport isBoolean from \"lodash/isBoolean\";\n\nimport { HvBreakpoints } from \"@hitachivantara/uikit-styles\";\nimport { useWidth } from \"@core/hooks/useWidth\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvFocus } from \"@core/components/Focus\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useClasses, staticClasses } from \"./Stack.styles\";\n\nexport { staticClasses as stackClasses };\n\nexport type HvStackClasses = ExtractNames<typeof useClasses>;\n\nexport type HvStackDirection = \"column\" | \"row\" | Partial<HvStackBreakpoints>;\nexport interface HvStackBreakpoints extends Record<HvBreakpoints, string> {}\n\nexport interface HvStackProps extends HvBaseProps {\n  /** The direction of the stack. Can be either a string or an object that states the direction for each breakpoint. */\n  direction?: HvStackDirection;\n  /** The spacing between elements of the stack. */\n  spacing?: HvBreakpoints;\n  /** The divider component to be used between the stack elements.\n   * - If `true` the Material-UI Divider component will be used.\n   * - If a React node is passed then the custom divider will be used.\n   */\n  divider?: boolean | React.ReactNode;\n  /** The properties to pass on to the Material-UI component. */\n  dividerProps?: MuiDividerProps;\n  /** Sets whether or not there should be arrow navigation between the stack elements. */\n  withNavigation?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvStackClasses;\n}\n\n/**\n * @returns {string} - Returns a direction for the stack: column or row. If the\n *                     `direction` property is a string and a valid direction then we\n *                     use it. If it's an object with multiple directions by breakpoint\n *                     we use the appropriate one or search for the nearest breakpoint\n *                     smaller than the current one to use.\n */\nconst getDirection = (direction, width, breakpoints) => {\n  if (isString(direction)) return direction;\n\n  for (let i = breakpoints.indexOf(width); i >= 0; i -= 1) {\n    if (direction[breakpoints[i]] !== undefined) {\n      return direction[breakpoints[i]];\n    }\n  }\n  return \"column\";\n};\n\n/**\n * A Stack component allows the organization of its children in a vertical or horizontal layout.\n *\n * It also allows the specification of the spacing between the stack elements and the addition of a divider between the elements.\n */\nexport const HvStack = (props: HvStackProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    direction = \"column\",\n    spacing = \"sm\",\n    divider = false,\n    withNavigation = false,\n    dividerProps = {},\n    ...others\n  } = useDefaultProps(\"HvStack\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const width = useWidth();\n  const containerRef = useRef(null);\n  const { breakpoints } = useTheme();\n\n  const processedDirection = useMemo(\n    () => getDirection(direction, width, breakpoints.keys),\n    [direction, width, breakpoints]\n  );\n\n  /**\n   * @returns {node} - The divider component to use. If the property `divider` is\n   *                   set to `true` then the Material-UI divider is used, otherwise\n   *                   we use the custom divider the user passed.\n   */\n  const getDividerComponent = useCallback(() => {\n    if (isBoolean(divider) && divider) {\n      return (\n        <MuiDivider\n          orientation={\n            processedDirection === \"column\" ? \"horizontal\" : \"vertical\"\n          }\n          flexItem={processedDirection === \"row\"}\n          role=\"separator\"\n          {...dividerProps}\n        />\n      );\n    }\n    return divider;\n  }, [divider, dividerProps, processedDirection]);\n\n  return (\n    <div\n      ref={containerRef}\n      className={cx(\n        classes.root,\n        classes[processedDirection],\n        classes[spacing],\n        className\n      )}\n      {...others}\n    >\n      {React.Children.map(children, (child, i) => {\n        return (\n          <>\n            {divider && i !== 0 && getDividerComponent()}\n            {withNavigation ? (\n              <HvFocus\n                rootRef={containerRef}\n                focusDisabled={false}\n                strategy=\"grid\"\n                navigationJump={\n                  processedDirection === \"column\"\n                    ? 1\n                    : React.Children.count(children) || 0\n                }\n                filterClass=\"child\"\n              >\n                <div className=\"child\">{child}</div>\n              </HvFocus>\n            ) : (\n              child\n            )}\n          </>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["getDirection","direction","width","breakpoints","isString","i","indexOf","undefined","HvStack","props","classes","classesProp","className","children","spacing","divider","withNavigation","dividerProps","others","useDefaultProps","cx","useClasses","useWidth","containerRef","useRef","useTheme","processedDirection","useMemo","keys","getDividerComponent","useCallback","isBoolean","MuiDivider","orientation","flexItem","role","ref","root","React","Children","map","child","_Fragment","_jsx","HvFocus","rootRef","focusDisabled","strategy","navigationJump","count","filterClass"],"mappings":";;;;;;;;;;;;;;;;;AAmDA,MAAMA,eAAeA,CAACC,WAAWC,OAAOC,gBAAgB;AACtD,MAAIC,kBAAAA,QAASH,SAAS;AAAUA,WAAAA;AAEvBI,WAAAA,IAAIF,YAAYG,QAAQJ,KAAK,GAAGG,KAAK,GAAGA,KAAK,GAAG;AACvD,QAAIJ,UAAUE,YAAYE,CAAC,CAAC,MAAME,QAAW;AACpCN,aAAAA,UAAUE,YAAYE,CAAC,CAAC;AAAA,IACjC;AAAA,EACF;AACO,SAAA;AACT;AAOaG,MAAAA,UAAUA,CAACC,UAAwB;AACxC,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAZ,YAAY;AAAA,IACZa,UAAU;AAAA,IACVC,UAAU;AAAA,IACVC,iBAAiB;AAAA,IACjBC,eAAe,CAAC;AAAA,IAChB,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,WAAWV,KAAK;AAC9B,QAAA;AAAA,IAAEC;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,aAAAA,WAAWV,WAAW;AAE9C,QAAMT,QAAQoB,SAAAA;AACRC,QAAAA,eAAeC,aAAO,IAAI;AAC1B,QAAA;AAAA,IAAErB;AAAAA,MAAgBsB,OAAS,SAAA;AAEjC,QAAMC,qBAAqBC,MAAAA,QACzB,MAAM3B,aAAaC,WAAWC,OAAOC,YAAYyB,IAAI,GACrD,CAAC3B,WAAWC,OAAOC,WAAW,CAChC;AAOM0B,QAAAA,sBAAsBC,MAAAA,YAAY,MAAM;AACxCC,QAAAA,mBAAAA,QAAUhB,OAAO,KAAKA,SAAS;AACjC,4CACGiB,oBAAAA,SAAU;AAAA,QACTC,aACEP,uBAAuB,WAAW,eAAe;AAAA,QAEnDQ,UAAUR,uBAAuB;AAAA,QACjCS,MAAK;AAAA,QAAW,GACZlB;AAAAA,MAAAA,CACL;AAAA,IAEL;AACOF,WAAAA;AAAAA,EACN,GAAA,CAACA,SAASE,cAAcS,kBAAkB,CAAC;AAE9C,wCACE,OAAA;AAAA,IACEU,KAAKb;AAAAA,IACLX,WAAWQ,GACTV,QAAQ2B,MACR3B,QAAQgB,kBAAkB,GAC1BhB,QAAQI,OAAO,GACfF,SACF;AAAA,IAAE,GACEM;AAAAA,IAAML,UAETyB,eAAMC,QAAAA,SAASC,IAAI3B,UAAU,CAAC4B,OAAOpC,MAAM;AAC1C,6CACEqC,WAAAA,UAAA;AAAA,QAAA7B,UACGE,CAAAA,WAAWV,MAAM,KAAKwB,uBACtBb,iBACC2B,2BAAAA,IAACC,eAAO;AAAA,UACNC,SAAStB;AAAAA,UACTuB,eAAe;AAAA,UACfC,UAAS;AAAA,UACTC,gBACEtB,uBAAuB,WACnB,IACAY,uBAAMC,SAASU,MAAMpC,QAAQ,KAAK;AAAA,UAExCqC,aAAY;AAAA,UAAOrC,yCAEnB,OAAA;AAAA,YAAKD,WAAU;AAAA,YAAOC,UAAE4B;AAAAA,UAAAA,CAAW;AAAA,QAC5B,CAAA,IAETA,KACD;AAAA,MAAA,CACD;AAAA,IAAA,CAEL;AAAA,EAAA,CACE;AAET;;;"}
+{"version":3,"file":"Stack.cjs","sources":["../../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import React, { useMemo, useRef, useCallback } from \"react\";\n\nimport { useTheme } from \"@mui/material/styles\";\nimport MuiDivider, {\n  DividerProps as MuiDividerProps,\n} from \"@mui/material/Divider\";\n\nimport isString from \"lodash/isString\";\nimport isBoolean from \"lodash/isBoolean\";\n\nimport { HvBreakpoints } from \"@hitachivantara/uikit-styles\";\nimport { useWidth } from \"@core/hooks/useWidth\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvFocus } from \"@core/components/Focus\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useClasses, staticClasses } from \"./Stack.styles\";\n\nexport { staticClasses as stackClasses };\n\nexport type HvStackClasses = ExtractNames<typeof useClasses>;\n\nexport type HvStackDirection = \"column\" | \"row\" | Partial<HvStackBreakpoints>;\nexport interface HvStackBreakpoints extends Record<HvBreakpoints, string> {}\n\nexport interface HvStackProps extends HvBaseProps {\n  /** The direction of the stack. Can be either a string or an object that states the direction for each breakpoint. */\n  direction?: HvStackDirection;\n  /** The spacing between elements of the stack. */\n  spacing?: HvBreakpoints;\n  /** The divider component to be used between the stack elements.\n   * - If `true` the Material-UI Divider component will be used.\n   * - If a React node is passed then the custom divider will be used.\n   */\n  divider?: boolean | React.ReactNode;\n  /** The properties to pass on to the Material-UI component. */\n  dividerProps?: MuiDividerProps;\n  /** Sets whether or not there should be arrow navigation between the stack elements. */\n  withNavigation?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvStackClasses;\n}\n\n/**\n * @returns {string} - Returns a direction for the stack: column or row. If the\n *                     `direction` property is a string and a valid direction then we\n *                     use it. If it's an object with multiple directions by breakpoint\n *                     we use the appropriate one or search for the nearest breakpoint\n *                     smaller than the current one to use.\n */\nconst getDirection = (direction, width, breakpoints) => {\n  if (isString(direction)) return direction;\n\n  for (let i = breakpoints.indexOf(width); i >= 0; i -= 1) {\n    if (direction[breakpoints[i]] !== undefined) {\n      return direction[breakpoints[i]];\n    }\n  }\n  return \"column\";\n};\n\n/**\n * A Stack component allows the organization of its children in a vertical or horizontal layout.\n *\n * It also allows the specification of the spacing between the stack elements and the addition of a divider between the elements.\n */\nexport const HvStack = (props: HvStackProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    direction = \"column\",\n    spacing = \"sm\",\n    divider = false,\n    withNavigation = false,\n    dividerProps = {},\n    ...others\n  } = useDefaultProps(\"HvStack\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const width = useWidth();\n  const containerRef = useRef(null);\n  const { breakpoints } = useTheme();\n\n  const processedDirection = useMemo(\n    () => getDirection(direction, width, breakpoints.keys),\n    [direction, width, breakpoints]\n  );\n\n  /**\n   * @returns {node} - The divider component to use. If the property `divider` is\n   *                   set to `true` then the Material-UI divider is used, otherwise\n   *                   we use the custom divider the user passed.\n   */\n  const getDividerComponent = useCallback(() => {\n    if (isBoolean(divider) && divider) {\n      return (\n        <MuiDivider\n          orientation={\n            processedDirection === \"column\" ? \"horizontal\" : \"vertical\"\n          }\n          flexItem={processedDirection === \"row\"}\n          role=\"separator\"\n          {...dividerProps}\n        />\n      );\n    }\n    return divider;\n  }, [divider, dividerProps, processedDirection]);\n\n  return (\n    <div\n      ref={containerRef}\n      className={cx(\n        classes.root,\n        classes[processedDirection],\n        classes[spacing],\n        className\n      )}\n      {...others}\n    >\n      {React.Children.map(children, (child, i) => {\n        return (\n          <>\n            {divider && i !== 0 && getDividerComponent()}\n            {withNavigation ? (\n              <HvFocus\n                rootRef={containerRef}\n                focusDisabled={false}\n                strategy=\"grid\"\n                navigationJump={\n                  processedDirection === \"column\"\n                    ? 1\n                    : React.Children.count(children) || 0\n                }\n                filterClass=\"child\"\n              >\n                <div className=\"child\">{child}</div>\n              </HvFocus>\n            ) : (\n              child\n            )}\n          </>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["getDirection","direction","width","breakpoints","isString","i","indexOf","undefined","HvStack","props","classes","classesProp","className","children","spacing","divider","withNavigation","dividerProps","others","useDefaultProps","cx","useClasses","useWidth","containerRef","useRef","useTheme","processedDirection","useMemo","keys","getDividerComponent","useCallback","isBoolean","jsx","MuiDivider","root","React","Children","map","child","HvFocus","count"],"mappings":";;;;;;;;;;;;;;;;;AAmDA,MAAMA,eAAeA,CAACC,WAAWC,OAAOC,gBAAgB;AACtD,MAAIC,kBAAAA,QAASH,SAAS;AAAUA,WAAAA;AAEvBI,WAAAA,IAAIF,YAAYG,QAAQJ,KAAK,GAAGG,KAAK,GAAGA,KAAK,GAAG;AACvD,QAAIJ,UAAUE,YAAYE,CAAC,CAAC,MAAME,QAAW;AACpCN,aAAAA,UAAUE,YAAYE,CAAC,CAAC;AAAA,IACjC;AAAA,EACF;AACO,SAAA;AACT;AAOaG,MAAAA,UAAUA,CAACC,UAAwB;AACxC,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAZ,YAAY;AAAA,IACZa,UAAU;AAAA,IACVC,UAAU;AAAA,IACVC,iBAAiB;AAAA,IACjBC,eAAe,CAAC;AAAA,IAChB,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,WAAWV,KAAK;AAC9B,QAAA;AAAA,IAAEC;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,aAAAA,WAAWV,WAAW;AAE9C,QAAMT,QAAQoB,SAAAA;AACRC,QAAAA,eAAeC,aAAO,IAAI;AAC1B,QAAA;AAAA,IAAErB;AAAAA,MAAgBsB,OAAS,SAAA;AAEjC,QAAMC,qBAAqBC,MAAAA,QACzB,MAAM3B,aAAaC,WAAWC,OAAOC,YAAYyB,IAAI,GACrD,CAAC3B,WAAWC,OAAOC,WAAW,CAChC;AAOM0B,QAAAA,sBAAsBC,MAAAA,YAAY,MAAM;AACxCC,QAAAA,mBAAAA,QAAUhB,OAAO,KAAKA,SAAS;AACjC,aACGiB,2BAAAA,IAAAC,oBAAAA,SAAA,EACC,aACEP,uBAAuB,WAAW,eAAe,YAEnD,UAAUA,uBAAuB,OACjC,MAAK,aACDT,GAAAA,aACJ,CAAA;AAAA,IAEN;AACOF,WAAAA;AAAAA,EACN,GAAA,CAACA,SAASE,cAAcS,kBAAkB,CAAC;AAG5C,SAAAM,+BAAC,OACC,EAAA,KAAKT,cACL,WAAWH,GACTV,QAAQwB,MACRxB,QAAQgB,kBAAkB,GAC1BhB,QAAQI,OAAO,GACfF,SACF,GACA,GAAIM,QAEHiB,UAAAA,eAAAA,QAAMC,SAASC,IAAIxB,UAAU,CAACyB,OAAOjC,MAAM;AAC1C,WAEKU,2BAAAA,KAAAA,qBAAAA,EAAAA,UAAAA;AAAAA,MAAWV,WAAAA,MAAM,KAAKwB,oBAAoB;AAAA,MAC1Cb,iBACEgB,2BAAA,IAAAO,MAAA,SAAA,EACC,SAAShB,cACT,eAAe,OACf,UAAS,QACT,gBACEG,uBAAuB,WACnB,IACAS,eAAAA,QAAMC,SAASI,MAAM3B,QAAQ,KAAK,GAExC,aAAY,SAEZ,UAACmB,2BAAA,IAAA,OAAA,EAAI,WAAU,SAASM,UAAM,MAAA,CAAA,EAChC,CAAA,IAEAA;AAAAA,IAEJ,EAAA,CAAA;AAAA,EAEH,CAAA,EACH,CAAA;AAEJ;;;"}

package/dist/cjs/components/Switch/Switch.cjs

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
@@ -7,7 +8,6 @@ const useControlled = require("../../hooks/useControlled.cjs");
 const setId = require("../../utils/setId.cjs");
 const validationStates = require("../Forms/FormElement/validationStates.cjs");
 const Switch_styles = require("./Switch.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const BaseSwitch = require("../BaseSwitch/BaseSwitch.cjs");
 const FormElement = require("../Forms/FormElement/FormElement.cjs");
 const Label = require("../Forms/Label/Label.cjs");
@@ -61,52 +61,20 @@ const HvSwitch = (props) => {
   if (isStateInvalid) {
     errorMessageId = canShowError ? setId.setId(elementId, "error") : ariaErrorMessage;
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs(FormElement.HvFormElement, {
-    id,
-    name,
-    status: validationState,
-    disabled,
-    required,
-    readOnly,
-    className: cx(classes.root, className),
-    children: [label && /* @__PURE__ */ jsxRuntime.jsx(Label.HvLabel, {
-      id: setId.setId(elementId, "label"),
-      htmlFor: setId.setId(elementId, "input"),
-      label,
-      className: classes.label,
-      ...labelProps
-    }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-      className: cx(classes.switchContainer, {
-        [classes.invalidSwitch]: isStateInvalid
-      }),
-      children: /* @__PURE__ */ jsxRuntime.jsx(BaseSwitch.HvBaseSwitch, {
-        id: label ? setId.setId(elementId, "input") : setId.setId(id, "input"),
-        name,
-        disabled,
-        readOnly,
-        required,
-        onChange: onLocalChange,
-        value,
-        checked: isChecked,
-        inputProps: {
-          "aria-invalid": isStateInvalid ? true : void 0,
-          "aria-errormessage": errorMessageId,
-          "aria-label": ariaLabel,
-          "aria-labelledby": ariaLabelledBy,
-          "aria-describedby": ariaDescribedBy,
-          ...inputProps
-        },
-        ...others
-      })
-    }), canShowError && /* @__PURE__ */ jsxRuntime.jsx(WarningText.HvWarningText, {
-      id: setId.setId(elementId, "error"),
-      className: classes.error,
-      disableBorder: true,
-      disableAdornment: true,
-      hideText: true,
-      children: validationMessage
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(FormElement.HvFormElement, { id, name, status: validationState, disabled, required, readOnly, className: cx(classes.root, className), children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(Label.HvLabel, { id: setId.setId(elementId, "label"), htmlFor: setId.setId(elementId, "input"), label, className: classes.label, ...labelProps }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(classes.switchContainer, {
+      [classes.invalidSwitch]: isStateInvalid
+    }), children: /* @__PURE__ */ jsxRuntime.jsx(BaseSwitch.HvBaseSwitch, { id: label ? setId.setId(elementId, "input") : setId.setId(id, "input"), name, disabled, readOnly, required, onChange: onLocalChange, value, checked: isChecked, inputProps: {
+      "aria-invalid": isStateInvalid ? true : void 0,
+      "aria-errormessage": errorMessageId,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
+      ...inputProps
+    }, ...others }) }),
+    canShowError && /* @__PURE__ */ jsxRuntime.jsx(WarningText.HvWarningText, { id: setId.setId(elementId, "error"), className: classes.error, disableBorder: true, disableAdornment: true, hideText: true, children: validationMessage })
+  ] });
 };
 exports.switchClasses = Switch_styles.staticClasses;
 exports.HvSwitch = HvSwitch;

package/dist/cjs/components/Switch/Switch.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.cjs","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\n\nimport { SwitchProps as MuiSwitchProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvWarningText,\n  HvLabelProps,\n  HvFormStatus,\n  HvFormElement,\n  HvLabel,\n} from \"@core/components/Forms\";\nimport { HvBaseSwitch } from \"@core/components/BaseSwitch\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { isInvalid } from \"@core/components/Forms/FormElement/validationStates\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Switch.styles\";\n\nexport { staticClasses as switchClasses };\n\nexport type HvSwitchClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSwitchProps\n  extends Omit<MuiSwitchProps, \"onChange\" | \"classes\">,\n    HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the switch.\n   */\n  classes?: HvSwitchClasses;\n  /**\n   * Id to be applied to the form element root node.\n   */\n  id?: string;\n  /**\n   * The form element name.\n   */\n  name?: string;\n  /**\n   * The value of the form element.\n   *\n   * Is up to the application's logic when to consider the submission of this value.\n   * Generally it should be used only when the switch is neither unchecked nor indeterminate.\n   *\n   * The default value is \"on\".\n   */\n  value?: any;\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n   */\n  label?: React.ReactNode;\n  /**\n   * @ignore\n   */\n  \"aria-label\"?: string;\n  /**\n   * @ignore\n   */\n  \"aria-labelledby\"?: string;\n  /**\n   * @ignore\n   */\n  \"aria-describedby\"?: string;\n  /**\n   * Properties passed on to the label element.\n   */\n  labelProps?: HvLabelProps;\n  /**\n   * Indicates that the form element is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Indicates that the form element is not editable.\n   */\n  readOnly?: boolean;\n  /**\n   * Indicates that user input is required on the form element.\n   */\n  required?: boolean;\n  /**\n   * If `true` the switch is selected, if set to `false` the switch is not selected.\n   *\n   * When defined the switch state becomes controlled.\n   */\n  checked?: boolean;\n  /**\n   * When uncontrolled, defines the initial checked state.\n   */\n  defaultChecked?: boolean;\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to `checked`, depending of the values of both `required` and `checked`.\n   */\n  status?: HvFormStatus;\n  /**\n   * The error message to show when the validation status is \"invalid\".\n   *\n   * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n   */\n  statusMessage?: string;\n  /**\n   * Identifies the element that provides an error message for the switch.\n   *\n   * Will only be used when the validation status is invalid.\n   */\n  \"aria-errormessage\"?: string;\n  /**\n   * The callback fired when the switch is pressed.\n   */\n  onChange?: (event: React.ChangeEvent, checked: boolean, value: any) => void;\n  /**\n   * Properties passed on to the input element.\n   */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n}\n\n/**\n * A Switch is <b>binary</b> and work as a digital on/off button.\n *\n * Use when two states are <b>opposite</b> and to trigger immediate\n * changes in the system.\n */\nexport const HvSwitch = (props: HvSwitchProps) => {\n  const {\n    classes: classesProp,\n    className,\n\n    id,\n    name,\n    value = \"on\",\n    required = false,\n    readOnly = false,\n    disabled = false,\n\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    labelProps,\n\n    checked,\n    defaultChecked = false,\n\n    onChange,\n\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n\n    inputProps,\n\n    ...others\n  } = useDefaultProps(\"HvSwitch\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const elementId = useUniqueId(id, \"hvswitch\");\n\n  const [isChecked, setIsChecked] = useControlled(\n    checked,\n    Boolean(defaultChecked)\n  );\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    \"standBy\"\n  );\n\n  const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n  const onLocalChange = useCallback(\n    (evt, newChecked) => {\n      setIsChecked(() => {\n        // this will only run if uncontrolled\n        if (required && !newChecked) {\n          setValidationState(\"invalid\");\n        } else {\n          setValidationState(\"valid\");\n        }\n\n        return newChecked;\n      });\n\n      onChange?.(evt, newChecked, value);\n    },\n    [onChange, required, setIsChecked, setValidationState, value]\n  );\n\n  // the error message area will only be created if:\n  // - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and required is true\n  const canShowError =\n    ariaErrorMessage == null &&\n    ((status !== undefined && statusMessage !== undefined) ||\n      (status === undefined && required));\n\n  const isStateInvalid = isInvalid(validationState);\n\n  let errorMessageId: string | undefined;\n  if (isStateInvalid) {\n    errorMessageId = canShowError\n      ? setId(elementId, \"error\")\n      : ariaErrorMessage;\n  }\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={cx(classes.root, className)}\n    >\n      {label && (\n        <HvLabel\n          id={setId(elementId, \"label\")}\n          htmlFor={setId(elementId, \"input\")}\n          label={label}\n          className={classes.label}\n          {...labelProps}\n        />\n      )}\n      <div\n        className={cx(classes.switchContainer, {\n          [classes.invalidSwitch]: isStateInvalid,\n        })}\n      >\n        <HvBaseSwitch\n          id={label ? setId(elementId, \"input\") : setId(id, \"input\")}\n          name={name}\n          disabled={disabled}\n          readOnly={readOnly}\n          required={required}\n          onChange={onLocalChange}\n          value={value}\n          checked={isChecked}\n          inputProps={{\n            \"aria-invalid\": isStateInvalid ? true : undefined,\n            \"aria-errormessage\": errorMessageId,\n            \"aria-label\": ariaLabel,\n            \"aria-labelledby\": ariaLabelledBy,\n            \"aria-describedby\": ariaDescribedBy,\n            ...inputProps,\n          }}\n          {...others}\n        />\n      </div>\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          className={classes.error}\n          disableBorder\n          disableAdornment\n          hideText\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n};\n"],"names":["HvSwitch","props","classes","classesProp","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","inputProps","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","isChecked","setIsChecked","useControlled","Boolean","validationState","setValidationState","validationMessage","onLocalChange","useCallback","evt","newChecked","canShowError","undefined","isStateInvalid","isInvalid","errorMessageId","setId","HvFormElement","root","children","_jsx","HvLabel","htmlFor","switchContainer","invalidSwitch","HvBaseSwitch","HvWarningText","error","disableBorder","disableAdornment","hideText"],"mappings":"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"}
+{"version":3,"file":"Switch.cjs","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\n\nimport { SwitchProps as MuiSwitchProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvWarningText,\n  HvLabelProps,\n  HvFormStatus,\n  HvFormElement,\n  HvLabel,\n} from \"@core/components/Forms\";\nimport { HvBaseSwitch } from \"@core/components/BaseSwitch\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { isInvalid } from \"@core/components/Forms/FormElement/validationStates\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Switch.styles\";\n\nexport { staticClasses as switchClasses };\n\nexport type HvSwitchClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSwitchProps\n  extends Omit<MuiSwitchProps, \"onChange\" | \"classes\">,\n    HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n  /**\n   * A Jss Object used to override or extend the styles applied to the switch.\n   */\n  classes?: HvSwitchClasses;\n  /**\n   * The form element name.\n   */\n  name?: string;\n  /**\n   * The value of the form element.\n   *\n   * Is up to the application's logic when to consider the submission of this value.\n   * Generally it should be used only when the switch is neither unchecked nor indeterminate.\n   *\n   * The default value is \"on\".\n   */\n  value?: any;\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n   */\n  label?: React.ReactNode;\n  /**\n   * Properties passed on to the label element.\n   */\n  labelProps?: HvLabelProps;\n  /**\n   * Indicates that the form element is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Indicates that the form element is not editable.\n   */\n  readOnly?: boolean;\n  /**\n   * Indicates that user input is required on the form element.\n   */\n  required?: boolean;\n  /**\n   * If `true` the switch is selected, if set to `false` the switch is not selected.\n   *\n   * When defined the switch state becomes controlled.\n   */\n  checked?: boolean;\n  /**\n   * When uncontrolled, defines the initial checked state.\n   */\n  defaultChecked?: boolean;\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to `checked`, depending of the values of both `required` and `checked`.\n   */\n  status?: HvFormStatus;\n  /**\n   * The error message to show when the validation status is \"invalid\".\n   *\n   * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n   */\n  statusMessage?: string;\n  /**\n   * Identifies the element that provides an error message for the switch.\n   *\n   * Will only be used when the validation status is invalid.\n   */\n  \"aria-errormessage\"?: string;\n  /**\n   * The callback fired when the switch is pressed.\n   */\n  onChange?: (event: React.ChangeEvent, checked: boolean, value: any) => void;\n  /**\n   * Properties passed on to the input element.\n   */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n  /** @ignore */\n  ref?: MuiSwitchProps[\"ref\"];\n  /** @ignore */\n  component?: MuiSwitchProps[\"component\"];\n}\n\n/**\n * A Switch is <b>binary</b> and work as a digital on/off button.\n *\n * Use when two states are <b>opposite</b> and to trigger immediate\n * changes in the system.\n */\nexport const HvSwitch = (props: HvSwitchProps) => {\n  const {\n    classes: classesProp,\n    className,\n\n    id,\n    name,\n    value = \"on\",\n    required = false,\n    readOnly = false,\n    disabled = false,\n\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    labelProps,\n\n    checked,\n    defaultChecked = false,\n\n    onChange,\n\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n\n    inputProps,\n\n    ...others\n  } = useDefaultProps(\"HvSwitch\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const elementId = useUniqueId(id, \"hvswitch\");\n\n  const [isChecked, setIsChecked] = useControlled(\n    checked,\n    Boolean(defaultChecked)\n  );\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    \"standBy\"\n  );\n\n  const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n  const onLocalChange = useCallback(\n    (evt, newChecked) => {\n      setIsChecked(() => {\n        // this will only run if uncontrolled\n        if (required && !newChecked) {\n          setValidationState(\"invalid\");\n        } else {\n          setValidationState(\"valid\");\n        }\n\n        return newChecked;\n      });\n\n      onChange?.(evt, newChecked, value);\n    },\n    [onChange, required, setIsChecked, setValidationState, value]\n  );\n\n  // the error message area will only be created if:\n  // - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and required is true\n  const canShowError =\n    ariaErrorMessage == null &&\n    ((status !== undefined && statusMessage !== undefined) ||\n      (status === undefined && required));\n\n  const isStateInvalid = isInvalid(validationState);\n\n  let errorMessageId: string | undefined;\n  if (isStateInvalid) {\n    errorMessageId = canShowError\n      ? setId(elementId, \"error\")\n      : ariaErrorMessage;\n  }\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={cx(classes.root, className)}\n    >\n      {label && (\n        <HvLabel\n          id={setId(elementId, \"label\")}\n          htmlFor={setId(elementId, \"input\")}\n          label={label}\n          className={classes.label}\n          {...labelProps}\n        />\n      )}\n      <div\n        className={cx(classes.switchContainer, {\n          [classes.invalidSwitch]: isStateInvalid,\n        })}\n      >\n        <HvBaseSwitch\n          id={label ? setId(elementId, \"input\") : setId(id, \"input\")}\n          name={name}\n          disabled={disabled}\n          readOnly={readOnly}\n          required={required}\n          onChange={onLocalChange}\n          value={value}\n          checked={isChecked}\n          inputProps={{\n            \"aria-invalid\": isStateInvalid ? true : undefined,\n            \"aria-errormessage\": errorMessageId,\n            \"aria-label\": ariaLabel,\n            \"aria-labelledby\": ariaLabelledBy,\n            \"aria-describedby\": ariaDescribedBy,\n            ...inputProps,\n          }}\n          {...others}\n        />\n      </div>\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          className={classes.error}\n          disableBorder\n          disableAdornment\n          hideText\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n};\n"],"names":["HvSwitch","props","classes","classesProp","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","inputProps","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","isChecked","setIsChecked","useControlled","Boolean","validationState","setValidationState","validationMessage","onLocalChange","useCallback","evt","newChecked","canShowError","undefined","isStateInvalid","isInvalid","errorMessageId","setId","jsxs","HvFormElement","root","HvLabel","jsx","switchContainer","invalidSwitch","HvBaseSwitch","HvWarningText","error"],"mappings":"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"}

package/dist/cjs/components/Tab/Tab.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const material = require("@mui/material");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const Tab_styles = require("./Tab.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const HvTab = (props) => {
   const {
     classes: classesProp,
@@ -15,19 +15,22 @@ const HvTab = (props) => {
     classes,
     cx
   } = Tab_styles.useClasses(classesProp);
-  return /* @__PURE__ */ jsxRuntime.jsx(material.Tab, {
-    classes: {
-      root: classes.root,
-      selected: classes.selected,
-      disabled: classes.disabled
-    },
-    disableRipple: true,
-    disableTouchRipple: true,
-    focusVisibleClassName: cx("HvIsFocusVisible", classes.focusVisible),
-    disabled,
-    iconPosition,
-    ...others
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    material.Tab,
+    {
+      classes: {
+        root: classes.root,
+        selected: classes.selected,
+        disabled: classes.disabled
+      },
+      disableRipple: true,
+      disableTouchRipple: true,
+      focusVisibleClassName: cx("HvIsFocusVisible", classes.focusVisible),
+      disabled,
+      iconPosition,
+      ...others
+    }
+  );
 };
 exports.tabClasses = Tab_styles.staticClasses;
 exports.HvTab = HvTab;

package/dist/cjs/components/Tab/Tab.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.cjs","sources":["../../../../src/components/Tab/Tab.tsx"],"sourcesContent":["import { Tab, TabProps as MuiTabProps } from \"@mui/material\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { staticClasses, useClasses } from \"./Tab.styles\";\n\nexport { staticClasses as tabClasses };\n\nexport type HvTabClasses = ExtractNames<typeof useClasses>;\n\n// Mui Tab props: https://mui.com/material-ui/api/tab/#props\nexport interface HvTabProps\n  extends Omit<MuiTabProps, \"children\">,\n    HvBaseProps<HTMLDivElement, \"children\"> {\n  /** If `true`, the tab will be disabled. */\n  disabled?: boolean;\n  /** The icon element. */\n  icon?: React.ReactElement | string;\n  /** The label element. */\n  label?: React.ReactNode;\n  /** The position of the icon relative to the label. */\n  iconPosition?: \"bottom\" | \"end\" | \"start\" | \"top\";\n  /** A Jss Object used to override or extend the component styles. */\n  classes?: HvTabClasses;\n}\n\nexport const HvTab = (props: HvTabProps) => {\n  const {\n    classes: classesProp,\n    iconPosition = \"top\",\n    disabled = false,\n    ...others\n  } = useDefaultProps(\"HvTab\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <Tab\n      classes={{\n        root: classes.root,\n        selected: classes.selected,\n        disabled: classes.disabled,\n      }}\n      disableRipple\n      disableTouchRipple\n      // expose the global class HvIsFocusVisible as a marker\n      // not to be styled directly, only as helper in specific css queries\n      focusVisibleClassName={cx(\"HvIsFocusVisible\", classes.focusVisible)}\n      disabled={disabled}\n      iconPosition={iconPosition}\n      {...others}\n    />\n  );\n};\n"],"names":["HvTab","props","classes","classesProp","iconPosition","disabled","others","useDefaultProps","cx","useClasses","Tab","root","selected","disableRipple","disableTouchRipple","focusVisibleClassName","focusVisible"],"mappings":";;;;;;AA0BaA,MAAAA,QAAQA,CAACC,UAAsB;AACpC,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC,eAAe;AAAA,IACfC,WAAW;AAAA,IACX,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,SAASN,KAAK;AAC5B,QAAA;AAAA,IAAEC;AAAAA,IAASM;AAAAA,EAAAA,IAAOC,WAAAA,WAAWN,WAAW;AAE9C,wCACGO,SAAAA,KAAG;AAAA,IACFR,SAAS;AAAA,MACPS,MAAMT,QAAQS;AAAAA,MACdC,UAAUV,QAAQU;AAAAA,MAClBP,UAAUH,QAAQG;AAAAA,IACpB;AAAA,IACAQ,eAAa;AAAA,IACbC,oBAAkB;AAAA,IAGlBC,uBAAuBP,GAAG,oBAAoBN,QAAQc,YAAY;AAAA,IAClEX;AAAAA,IACAD;AAAAA,IAA2B,GACvBE;AAAAA,EAAAA,CACL;AAEL;;;"}
+{"version":3,"file":"Tab.cjs","sources":["../../../../src/components/Tab/Tab.tsx"],"sourcesContent":["import { Tab, TabProps as MuiTabProps } from \"@mui/material\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { staticClasses, useClasses } from \"./Tab.styles\";\n\nexport { staticClasses as tabClasses };\n\nexport type HvTabClasses = ExtractNames<typeof useClasses>;\n\n// Mui Tab props: https://mui.com/material-ui/api/tab/#props\nexport interface HvTabProps\n  extends Omit<MuiTabProps, \"children\">,\n    HvBaseProps<HTMLDivElement, \"children\"> {\n  /** If `true`, the tab will be disabled. */\n  disabled?: boolean;\n  /** The icon element. */\n  icon?: React.ReactElement | string;\n  /** The label element. */\n  label?: React.ReactNode;\n  /** The position of the icon relative to the label. */\n  iconPosition?: \"bottom\" | \"end\" | \"start\" | \"top\";\n  /** A Jss Object used to override or extend the component styles. */\n  classes?: HvTabClasses;\n}\n\nexport const HvTab = (props: HvTabProps) => {\n  const {\n    classes: classesProp,\n    iconPosition = \"top\",\n    disabled = false,\n    ...others\n  } = useDefaultProps(\"HvTab\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <Tab\n      classes={{\n        root: classes.root,\n        selected: classes.selected,\n        disabled: classes.disabled,\n      }}\n      disableRipple\n      disableTouchRipple\n      // expose the global class HvIsFocusVisible as a marker\n      // not to be styled directly, only as helper in specific css queries\n      focusVisibleClassName={cx(\"HvIsFocusVisible\", classes.focusVisible)}\n      disabled={disabled}\n      iconPosition={iconPosition}\n      {...others}\n    />\n  );\n};\n"],"names":["HvTab","props","classes","classesProp","iconPosition","disabled","others","useDefaultProps","cx","useClasses","jsx","Tab","root","selected","focusVisible"],"mappings":";;;;;;AA0BaA,MAAAA,QAAQA,CAACC,UAAsB;AACpC,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC,eAAe;AAAA,IACfC,WAAW;AAAA,IACX,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,SAASN,KAAK;AAC5B,QAAA;AAAA,IAAEC;AAAAA,IAASM;AAAAA,EAAAA,IAAOC,WAAAA,WAAWN,WAAW;AAG5C,SAAAO,2BAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,SAAS;AAAA,QACPC,MAAMV,QAAQU;AAAAA,QACdC,UAAUX,QAAQW;AAAAA,QAClBR,UAAUH,QAAQG;AAAAA,MACpB;AAAA,MACA,eAAa;AAAA,MACb,oBAAA;AAAA,MAGA,uBAAuBG,GAAG,oBAAoBN,QAAQY,YAAY;AAAA,MAClE;AAAA,MACA;AAAA,MACA,GAAIR;AAAAA,IAAAA;AAAAA,EAAAA;AAGV;;;"}

package/dist/cjs/components/Table/Table.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const TableContext = require("./TableContext.cjs");
 const Table_styles = require("./Table.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const defaultComponent = "table";
 const computeTablePartComponents = (rootComponent) => {
   if (rootComponent === "table") {
@@ -48,19 +48,11 @@ const HvTable = React.forwardRef((props, ref) => {
     containerRef
   }), [components, variant, containerRef]);
   const Table = React.useMemo(() => components.Table, [components]);
-  return /* @__PURE__ */ jsxRuntime.jsx(TableContext.default.Provider, {
-    value: tableContext,
-    children: /* @__PURE__ */ jsxRuntime.jsx(Table, {
-      ref,
-      role: component === defaultComponent ? null : "table",
-      className: cx(classes.root, {
-        [classes.stickyHeader]: stickyHeader,
-        [classes.stickyColumns]: stickyColumns,
-        [classes.listRow]: variant === "listrow"
-      }, className),
-      ...others
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(TableContext.default.Provider, { value: tableContext, children: /* @__PURE__ */ jsxRuntime.jsx(Table, { ref, role: component === defaultComponent ? null : "table", className: cx(classes.root, {
+    [classes.stickyHeader]: stickyHeader,
+    [classes.stickyColumns]: stickyColumns,
+    [classes.listRow]: variant === "listrow"
+  }, className), ...others }) });
 });
 exports.tableClasses = Table_styles.staticClasses;
 exports.HvTable = HvTable;

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

@@ -1 +1 @@
-{"version":3,"file":"Table.cjs","sources":["../../../../src/components/Table/Table.tsx"],"sourcesContent":["import { forwardRef, TableHTMLAttributes, useMemo, useRef } from \"react\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport TableContext from \"./TableContext\";\nimport { staticClasses, useClasses } from \"./Table.styles\";\n\nexport { staticClasses as tableClasses };\n\nexport type HvTableClasses = ExtractNames<typeof useClasses>;\n\nexport type HvTableVariant = \"listrow\" | \"default\";\nexport type HvTableCellAlign =\n  | \"center\"\n  | \"inherit\"\n  | \"justify\"\n  | \"left\"\n  | \"right\";\nexport type HvTableCellType = \"body\" | \"footer\" | \"head\";\nexport type HvTableCellVariant =\n  | \"checkbox\"\n  | \"expand\"\n  | \"actions\"\n  | \"default\"\n  | \"none\";\n\nexport interface HvTableProps extends TableHTMLAttributes<HTMLTableElement> {\n  /**\n   * The component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to `table`.\n   *\n   * When using non-table elements, layout is up to the developer using the component.\n   */\n  component?: React.ElementType;\n  /** Content to be rendered */\n  children: React.ReactNode;\n  /** Whether the `HvTable` has a sticky header row. */\n  stickyHeader?: boolean;\n  /** Whether the `HvTable` has sticky columns. */\n  stickyColumns?: boolean;\n  /** Whether the `HvTable` has the list row styles or the default. */\n  variant?: HvTableVariant;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableClasses;\n}\n\nconst defaultComponent = \"table\";\n\nconst computeTablePartComponents = (rootComponent) => {\n  if (rootComponent === \"table\") {\n    return {\n      Table: \"table\",\n      THead: \"thead\",\n      TBody: \"tbody\",\n      Tr: \"tr\",\n      Th: \"th\",\n      Td: \"td\",\n    };\n  }\n\n  return {\n    Table: rootComponent,\n    THead: rootComponent,\n    TBody: rootComponent,\n    Tr: rootComponent,\n    Th: rootComponent,\n    Td: rootComponent,\n  };\n};\n\n/**\n * A table gathers relational data. It displays values arranged to allow quick numerical analysis like comparison and sorting.\n *\n * The **HvTable** component offers a set of HTML-equivalent elements, **styled to Design System's specification**,\n * for building tables.\n * You can rely on these **elements** when your table doesn’t have many interactions or you need it to be very lightweight.\n *\n * For better data handling and **advanced features** we recommend the use of the utility hooks collection.\n * See the <a href=\"?id=guides-table-table-hooks--use-hv-hooks&viewMode=docs\" target=\"_self\">Table Hooks documentation</a> for more details.\n */\nexport const HvTable = forwardRef<HTMLElement, HvTableProps>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    component = defaultComponent,\n    stickyHeader = false,\n    stickyColumns = false,\n    variant = \"default\",\n    ...others\n  } = useDefaultProps(\"HvTable\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const containerRef = useRef(ref);\n\n  const components = useMemo(\n    () => computeTablePartComponents(component),\n    [component]\n  );\n\n  const tableContext = useMemo(\n    () => ({ components, variant, containerRef }),\n    [components, variant, containerRef]\n  );\n\n  const Table = useMemo(() => components.Table, [components]);\n\n  return (\n    <TableContext.Provider value={tableContext}>\n      <Table\n        ref={ref}\n        role={component === defaultComponent ? null : \"table\"}\n        className={cx(\n          classes.root,\n          {\n            [classes.stickyHeader]: stickyHeader,\n            [classes.stickyColumns]: stickyColumns,\n            [classes.listRow]: variant === \"listrow\",\n          },\n          className\n        )}\n        {...others}\n      />\n    </TableContext.Provider>\n  );\n});\n"],"names":["defaultComponent","computeTablePartComponents","rootComponent","Table","THead","TBody","Tr","Th","Td","HvTable","forwardRef","props","ref","classes","classesProp","className","component","stickyHeader","stickyColumns","variant","others","useDefaultProps","cx","useClasses","containerRef","useRef","components","useMemo","tableContext","_jsx","TableContext","Provider","value","children","role","root","listRow"],"mappings":";;;;;;;AA+CA,MAAMA,mBAAmB;AAEzB,MAAMC,6BAA8BC,CAAkB,kBAAA;AACpD,MAAIA,kBAAkB,SAAS;AACtB,WAAA;AAAA,MACLC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPC,IAAI;AAAA,MACJC,IAAI;AAAA,MACJC,IAAI;AAAA,IAAA;AAAA,EAER;AAEO,SAAA;AAAA,IACLL,OAAOD;AAAAA,IACPE,OAAOF;AAAAA,IACPG,OAAOH;AAAAA,IACPI,IAAIJ;AAAAA,IACJK,IAAIL;AAAAA,IACJM,IAAIN;AAAAA,EAAAA;AAER;AAYO,MAAMO,UAAUC,MAAAA,WAAsC,CAACC,OAAOC,QAAQ;AACrE,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC,YAAYhB;AAAAA,IACZiB,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,UAAU;AAAA,IACV,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,WAAWV,KAAK;AAC9B,QAAA;AAAA,IAAEE;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,aAAAA,WAAWT,WAAW;AAExCU,QAAAA,eAAeC,aAAOb,GAAG;AAEzBc,QAAAA,aAAaC,MAAAA,QACjB,MAAM1B,2BAA2Be,SAAS,GAC1C,CAACA,SAAS,CACZ;AAEMY,QAAAA,eAAeD,MAAAA,QACnB,OAAO;AAAA,IAAED;AAAAA,IAAYP;AAAAA,IAASK;AAAAA,EAC9B,IAAA,CAACE,YAAYP,SAASK,YAAY,CACpC;AAEA,QAAMrB,QAAQwB,MAAAA,QAAQ,MAAMD,WAAWvB,OAAO,CAACuB,UAAU,CAAC;AAGxDG,SAAAA,2BAAAA,IAACC,qBAAaC,UAAQ;AAAA,IAACC,OAAOJ;AAAAA,IAAaK,yCACxC9B,OAAK;AAAA,MACJS;AAAAA,MACAsB,MAAMlB,cAAchB,mBAAmB,OAAO;AAAA,MAC9Ce,WAAWO,GACTT,QAAQsB,MACR;AAAA,QACE,CAACtB,QAAQI,YAAY,GAAGA;AAAAA,QACxB,CAACJ,QAAQK,aAAa,GAAGA;AAAAA,QACzB,CAACL,QAAQuB,OAAO,GAAGjB,YAAY;AAAA,SAEjCJ,SACF;AAAA,MAAE,GACEK;AAAAA,IAAAA,CACL;AAAA,EAAA,CACoB;AAE3B,CAAC;;;"}
+{"version":3,"file":"Table.cjs","sources":["../../../../src/components/Table/Table.tsx"],"sourcesContent":["import { forwardRef, TableHTMLAttributes, useMemo, useRef } from \"react\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport TableContext from \"./TableContext\";\nimport { staticClasses, useClasses } from \"./Table.styles\";\n\nexport { staticClasses as tableClasses };\n\nexport type HvTableClasses = ExtractNames<typeof useClasses>;\n\nexport type HvTableVariant = \"listrow\" | \"default\";\nexport type HvTableCellAlign =\n  | \"center\"\n  | \"inherit\"\n  | \"justify\"\n  | \"left\"\n  | \"right\";\nexport type HvTableCellType = \"body\" | \"footer\" | \"head\";\nexport type HvTableCellVariant =\n  | \"checkbox\"\n  | \"expand\"\n  | \"actions\"\n  | \"default\"\n  | \"none\";\n\nexport interface HvTableProps extends TableHTMLAttributes<HTMLTableElement> {\n  /**\n   * The component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to `table`.\n   *\n   * When using non-table elements, layout is up to the developer using the component.\n   */\n  component?: React.ElementType;\n  /** Content to be rendered */\n  children: React.ReactNode;\n  /** Whether the `HvTable` has a sticky header row. */\n  stickyHeader?: boolean;\n  /** Whether the `HvTable` has sticky columns. */\n  stickyColumns?: boolean;\n  /** Whether the `HvTable` has the list row styles or the default. */\n  variant?: HvTableVariant;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableClasses;\n}\n\nconst defaultComponent = \"table\";\n\nconst computeTablePartComponents = (rootComponent) => {\n  if (rootComponent === \"table\") {\n    return {\n      Table: \"table\",\n      THead: \"thead\",\n      TBody: \"tbody\",\n      Tr: \"tr\",\n      Th: \"th\",\n      Td: \"td\",\n    };\n  }\n\n  return {\n    Table: rootComponent,\n    THead: rootComponent,\n    TBody: rootComponent,\n    Tr: rootComponent,\n    Th: rootComponent,\n    Td: rootComponent,\n  };\n};\n\n/**\n * A table gathers relational data. It displays values arranged to allow quick numerical analysis like comparison and sorting.\n *\n * The **HvTable** component offers a set of HTML-equivalent elements, **styled to Design System's specification**,\n * for building tables.\n * You can rely on these **elements** when your table doesn’t have many interactions or you need it to be very lightweight.\n *\n * For better data handling and **advanced features** we recommend the use of the utility hooks collection.\n * See the <a href=\"?id=guides-table-table-hooks--use-hv-hooks&viewMode=docs\" target=\"_self\">Table Hooks documentation</a> for more details.\n */\nexport const HvTable = forwardRef<HTMLElement, HvTableProps>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    component = defaultComponent,\n    stickyHeader = false,\n    stickyColumns = false,\n    variant = \"default\",\n    ...others\n  } = useDefaultProps(\"HvTable\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const containerRef = useRef(ref);\n\n  const components = useMemo(\n    () => computeTablePartComponents(component),\n    [component]\n  );\n\n  const tableContext = useMemo(\n    () => ({ components, variant, containerRef }),\n    [components, variant, containerRef]\n  );\n\n  const Table = useMemo(() => components.Table, [components]);\n\n  return (\n    <TableContext.Provider value={tableContext}>\n      <Table\n        ref={ref}\n        role={component === defaultComponent ? null : \"table\"}\n        className={cx(\n          classes.root,\n          {\n            [classes.stickyHeader]: stickyHeader,\n            [classes.stickyColumns]: stickyColumns,\n            [classes.listRow]: variant === \"listrow\",\n          },\n          className\n        )}\n        {...others}\n      />\n    </TableContext.Provider>\n  );\n});\n"],"names":["defaultComponent","computeTablePartComponents","rootComponent","Table","THead","TBody","Tr","Th","Td","HvTable","forwardRef","props","ref","classes","classesProp","className","component","stickyHeader","stickyColumns","variant","others","useDefaultProps","cx","useClasses","containerRef","useRef","components","useMemo","tableContext","TableContext","jsx","root","listRow"],"mappings":";;;;;;;AA+CA,MAAMA,mBAAmB;AAEzB,MAAMC,6BAA8BC,CAAkB,kBAAA;AACpD,MAAIA,kBAAkB,SAAS;AACtB,WAAA;AAAA,MACLC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPC,IAAI;AAAA,MACJC,IAAI;AAAA,MACJC,IAAI;AAAA,IAAA;AAAA,EAER;AAEO,SAAA;AAAA,IACLL,OAAOD;AAAAA,IACPE,OAAOF;AAAAA,IACPG,OAAOH;AAAAA,IACPI,IAAIJ;AAAAA,IACJK,IAAIL;AAAAA,IACJM,IAAIN;AAAAA,EAAAA;AAER;AAYO,MAAMO,UAAUC,MAAAA,WAAsC,CAACC,OAAOC,QAAQ;AACrE,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC,YAAYhB;AAAAA,IACZiB,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,UAAU;AAAA,IACV,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,WAAWV,KAAK;AAC9B,QAAA;AAAA,IAAEE;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,aAAAA,WAAWT,WAAW;AAExCU,QAAAA,eAAeC,aAAOb,GAAG;AAEzBc,QAAAA,aAAaC,MAAAA,QACjB,MAAM1B,2BAA2Be,SAAS,GAC1C,CAACA,SAAS,CACZ;AAEMY,QAAAA,eAAeD,MAAAA,QACnB,OAAO;AAAA,IAAED;AAAAA,IAAYP;AAAAA,IAASK;AAAAA,EAC9B,IAAA,CAACE,YAAYP,SAASK,YAAY,CACpC;AAEA,QAAMrB,QAAQwB,MAAAA,QAAQ,MAAMD,WAAWvB,OAAO,CAACuB,UAAU,CAAC;AAE1D,wCACGG,aAAa,QAAA,UAAb,EAAsB,OAAOD,cAC5B,UAACE,2BAAA,IAAA,OAAA,EACC,KACA,MAAMd,cAAchB,mBAAmB,OAAO,SAC9C,WAAWsB,GACTT,QAAQkB,MACR;AAAA,IACE,CAAClB,QAAQI,YAAY,GAAGA;AAAAA,IACxB,CAACJ,QAAQK,aAAa,GAAGA;AAAAA,IACzB,CAACL,QAAQmB,OAAO,GAAGb,YAAY;AAAA,EAEjCJ,GAAAA,SACF,GACA,GAAIK,OAAO,CAAA,EAEf,CAAA;AAEJ,CAAC;;;"}

package/dist/cjs/components/Table/TableBody/TableBody.cjs

@@ -1,11 +1,11 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useForkRef = require("../../../hooks/useForkRef.cjs");
 const TableContext = require("../TableContext.cjs");
 const TableSectionContext = require("../TableSectionContext.cjs");
 const TableBody_styles = require("./TableBody.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Focus = require("../../Focus/Focus.cjs");
 const tableSectionContext = {
   type: "body",
@@ -29,29 +29,11 @@ const HvTableBody = React.forwardRef(({
   const bodyRef = React.useRef(null);
   const handleRef = useForkRef.useForkRef(externalRef, bodyRef);
   const Component = component || ((_a = tableContext == null ? void 0 : tableContext.components) == null ? void 0 : _a.TBody) || defaultComponent;
-  return /* @__PURE__ */ jsxRuntime.jsx(TableSectionContext.default.Provider, {
-    value: tableSectionContext,
-    children: /* @__PURE__ */ jsxRuntime.jsx(Component, {
-      className: cx(classes.root, className),
-      ref: handleRef,
-      role: Component === defaultComponent ? null : "rowgroup",
-      ...others,
-      children: withNavigation ? React.Children.map(children, (element) => {
-        if (React.isValidElement(element)) {
-          return /* @__PURE__ */ jsxRuntime.jsx(Focus.HvFocus, {
-            id: `my-id-${element.key}`,
-            rootRef: bodyRef,
-            strategy: "grid",
-            filterClass: tableSectionContext.filterClassName,
-            navigationJump: 1,
-            focusDisabled: false,
-            selected: element.props.selected,
-            children: element
-          }, `row-${element.key}`);
-        }
-      }) : children
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(TableSectionContext.default.Provider, { value: tableSectionContext, children: /* @__PURE__ */ jsxRuntime.jsx(Component, { className: cx(classes.root, className), ref: handleRef, role: Component === defaultComponent ? null : "rowgroup", ...others, children: withNavigation ? React.Children.map(children, (element) => {
+    if (React.isValidElement(element)) {
+      return /* @__PURE__ */ jsxRuntime.jsx(Focus.HvFocus, { id: `my-id-${element.key}`, rootRef: bodyRef, strategy: "grid", filterClass: tableSectionContext.filterClassName, navigationJump: 1, focusDisabled: false, selected: element.props.selected, children: element }, `row-${element.key}`);
+    }
+  }) : children }) });
 });
 exports.tableBodyClasses = TableBody_styles.staticClasses;
 exports.HvTableBody = HvTableBody;

package/dist/cjs/components/Table/TableBody/TableBody.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.cjs","sources":["../../../../../src/components/Table/TableBody/TableBody.tsx"],"sourcesContent":["import React, {\n  Children,\n  forwardRef,\n  isValidElement,\n  useContext,\n  useRef,\n} from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { HvFocus } from \"@core/components/Focus\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport TableContext from \"../TableContext\";\nimport TableSectionContext from \"../TableSectionContext\";\nimport { staticClasses, useClasses } from \"./TableBody.styles\";\n\nexport { staticClasses as tableBodyClasses };\n\nexport type HvTableBodyClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTableBodyProps\n  extends HvBaseProps<HTMLTableSectionElement, \"children\"> {\n  /**\n   * Content to be rendered\n   */\n  children: React.ReactNode;\n  /**\n   * The component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to tbody.\n   */\n  component?: React.ElementType;\n  /** Sets whether or not there should be arrow navigation between the table rows */\n  withNavigation?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableBodyClasses;\n}\n\nconst tableSectionContext = {\n  type: \"body\",\n  filterClassName: \"grid\",\n};\n\nconst defaultComponent = \"tbody\";\n\n/**\n * HvTableBody acts as a `tbody` element.\n * `HvTableCell` and `HvTableRow` elements in it inherit body-specific styles\n */\nexport const HvTableBody = forwardRef<HTMLElement, HvTableBodyProps>(\n  (\n    {\n      classes: classesProp,\n      className,\n      component,\n      children,\n      withNavigation = false,\n      ...others\n    },\n    externalRef\n  ) => {\n    const { classes, cx } = useClasses(classesProp);\n\n    const tableContext = useContext(TableContext);\n\n    const bodyRef = useRef(null);\n\n    const handleRef = useForkRef(externalRef, bodyRef);\n\n    const Component =\n      component || tableContext?.components?.TBody || defaultComponent;\n\n    return (\n      <TableSectionContext.Provider value={tableSectionContext}>\n        <Component\n          className={cx(classes.root, className)}\n          ref={handleRef}\n          role={Component === defaultComponent ? null : \"rowgroup\"}\n          {...others}\n        >\n          {withNavigation\n            ? Children.map(children, (element) => {\n                if (isValidElement(element)) {\n                  return (\n                    <HvFocus\n                      id={`my-id-${element.key}`}\n                      rootRef={bodyRef}\n                      key={`row-${element.key}`}\n                      strategy=\"grid\"\n                      filterClass={tableSectionContext.filterClassName}\n                      navigationJump={1}\n                      focusDisabled={false}\n                      selected={element.props.selected}\n                    >\n                      {element}\n                    </HvFocus>\n                  );\n                }\n              })\n            : children}\n        </Component>\n      </TableSectionContext.Provider>\n    );\n  }\n);\n"],"names":["tableSectionContext","type","filterClassName","defaultComponent","HvTableBody","forwardRef","classes","classesProp","className","component","children","withNavigation","others","externalRef","cx","useClasses","tableContext","useContext","TableContext","bodyRef","useRef","handleRef","useForkRef","Component","components","TBody","_jsx","TableSectionContext","Provider","value","root","ref","role","Children","map","element","isValidElement","HvFocus","id","key","rootRef","strategy","filterClass","navigationJump","focusDisabled","selected","props"],"mappings":";;;;;;;;;AAsCA,MAAMA,sBAAsB;AAAA,EAC1BC,MAAM;AAAA,EACNC,iBAAiB;AACnB;AAEA,MAAMC,mBAAmB;AAMZC,MAAAA,cAAcC,iBACzB,CACE;AAAA,EACEC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,iBAAiB;AAAA,EACjB,GAAGC;AACL,GACAC,gBACG;;AACG,QAAA;AAAA,IAAEP;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,iBAAAA,WAAWR,WAAW;AAExCS,QAAAA,eAAeC,iBAAWC,aAAAA,OAAY;AAEtCC,QAAAA,UAAUC,aAAO,IAAI;AAErBC,QAAAA,YAAYC,WAAAA,WAAWT,aAAaM,OAAO;AAEjD,QAAMI,YACJd,eAAaO,kDAAcQ,eAAdR,mBAA0BS,UAAStB;AAGhDuB,SAAAA,2BAAAA,IAACC,4BAAoBC,UAAQ;AAAA,IAACC,OAAO7B;AAAAA,IAAoBU,yCACtDa,WAAS;AAAA,MACRf,WAAWM,GAAGR,QAAQwB,MAAMtB,SAAS;AAAA,MACrCuB,KAAKV;AAAAA,MACLW,MAAMT,cAAcpB,mBAAmB,OAAO;AAAA,MAAW,GACrDS;AAAAA,MAAMF,UAETC,iBACGsB,MAASC,SAAAA,IAAIxB,UAAWyB,CAAY,YAAA;AAC9BC,YAAAA,MAAAA,eAAeD,OAAO,GAAG;AAC3B,gDACGE,MAAAA,SAAO;AAAA,YACNC,IAAK,SAAQH,QAAQI,GAAI;AAAA,YACzBC,SAASrB;AAAAA,YAETsB,UAAS;AAAA,YACTC,aAAa1C,oBAAoBE;AAAAA,YACjCyC,gBAAgB;AAAA,YAChBC,eAAe;AAAA,YACfC,UAAUV,QAAQW,MAAMD;AAAAA,YAASnC,UAEhCyB;AAAAA,UAPK,GAAA,OAAMA,QAAQI,GAAI,EAQjB;AAAA,QAEb;AAAA,MACD,CAAA,IACD7B;AAAAA,IAAAA,CACK;AAAA,EAAA,CACiB;AAElC,CACF;;;"}
+{"version":3,"file":"TableBody.cjs","sources":["../../../../../src/components/Table/TableBody/TableBody.tsx"],"sourcesContent":["import React, {\n  Children,\n  forwardRef,\n  isValidElement,\n  useContext,\n  useRef,\n} from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { HvFocus } from \"@core/components/Focus\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport TableContext from \"../TableContext\";\nimport TableSectionContext from \"../TableSectionContext\";\nimport { staticClasses, useClasses } from \"./TableBody.styles\";\n\nexport { staticClasses as tableBodyClasses };\n\nexport type HvTableBodyClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTableBodyProps\n  extends HvBaseProps<HTMLTableSectionElement, \"children\"> {\n  /**\n   * Content to be rendered\n   */\n  children: React.ReactNode;\n  /**\n   * The component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to tbody.\n   */\n  component?: React.ElementType;\n  /** Sets whether or not there should be arrow navigation between the table rows */\n  withNavigation?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableBodyClasses;\n}\n\nconst tableSectionContext = {\n  type: \"body\",\n  filterClassName: \"grid\",\n};\n\nconst defaultComponent = \"tbody\";\n\n/**\n * HvTableBody acts as a `tbody` element.\n * `HvTableCell` and `HvTableRow` elements in it inherit body-specific styles\n */\nexport const HvTableBody = forwardRef<HTMLElement, HvTableBodyProps>(\n  (\n    {\n      classes: classesProp,\n      className,\n      component,\n      children,\n      withNavigation = false,\n      ...others\n    },\n    externalRef\n  ) => {\n    const { classes, cx } = useClasses(classesProp);\n\n    const tableContext = useContext(TableContext);\n\n    const bodyRef = useRef(null);\n\n    const handleRef = useForkRef(externalRef, bodyRef);\n\n    const Component =\n      component || tableContext?.components?.TBody || defaultComponent;\n\n    return (\n      <TableSectionContext.Provider value={tableSectionContext}>\n        <Component\n          className={cx(classes.root, className)}\n          ref={handleRef}\n          role={Component === defaultComponent ? null : \"rowgroup\"}\n          {...others}\n        >\n          {withNavigation\n            ? Children.map(children, (element) => {\n                if (isValidElement(element)) {\n                  return (\n                    <HvFocus\n                      id={`my-id-${element.key}`}\n                      rootRef={bodyRef}\n                      key={`row-${element.key}`}\n                      strategy=\"grid\"\n                      filterClass={tableSectionContext.filterClassName}\n                      navigationJump={1}\n                      focusDisabled={false}\n                      selected={element.props.selected}\n                    >\n                      {element}\n                    </HvFocus>\n                  );\n                }\n              })\n            : children}\n        </Component>\n      </TableSectionContext.Provider>\n    );\n  }\n);\n"],"names":["tableSectionContext","type","filterClassName","defaultComponent","HvTableBody","forwardRef","classes","classesProp","className","component","children","withNavigation","others","externalRef","cx","useClasses","tableContext","useContext","TableContext","bodyRef","useRef","handleRef","useForkRef","Component","components","TBody","jsx","TableSectionContext","root","Children","map","element","isValidElement","HvFocus","key","props","selected"],"mappings":";;;;;;;;;AAsCA,MAAMA,sBAAsB;AAAA,EAC1BC,MAAM;AAAA,EACNC,iBAAiB;AACnB;AAEA,MAAMC,mBAAmB;AAMZC,MAAAA,cAAcC,iBACzB,CACE;AAAA,EACEC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,iBAAiB;AAAA,EACjB,GAAGC;AACL,GACAC,gBACG;;AACG,QAAA;AAAA,IAAEP;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,iBAAAA,WAAWR,WAAW;AAExCS,QAAAA,eAAeC,iBAAWC,aAAAA,OAAY;AAEtCC,QAAAA,UAAUC,aAAO,IAAI;AAErBC,QAAAA,YAAYC,WAAAA,WAAWT,aAAaM,OAAO;AAEjD,QAAMI,YACJd,eAAaO,kDAAcQ,eAAdR,mBAA0BS,UAAStB;AAGhD,SAAAuB,2BAAA,IAACC,oBAAoB,QAAA,UAApB,EAA6B,OAAO3B,qBACnC,UAAA0B,2BAAAA,IAAC,WACC,EAAA,WAAWZ,GAAGR,QAAQsB,MAAMpB,SAAS,GACrC,KAAKa,WACL,MAAME,cAAcpB,mBAAmB,OAAO,YAC9C,GAAIS,QAEHD,UACGkB,iBAAAA,MAAAA,SAASC,IAAIpB,UAAWqB,CAAY,YAAA;AAC9BC,QAAAA,MAAAA,eAAeD,OAAO,GAAG;AAEzB,aAAAL,2BAAAA,IAACO,MAAAA,SACC,EAAA,IAAK,SAAQF,QAAQG,GAAI,IACzB,SAASf,SAET,UAAS,QACT,aAAanB,oBAAoBE,iBACjC,gBAAgB,GAChB,eAAe,OACf,UAAU6B,QAAQI,MAAMC,UAEvBL,UAPK,QAAA,GAAA,OAAMA,QAAQG,GAAI,EAQ1B;AAAA,IAEJ;AAAA,EAAA,CACD,IACDxB,UACN,EACF,CAAA;AAEJ,CACF;;;"}

package/dist/cjs/components/Table/TableCell/TableCell.cjs

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const capitalize = require("lodash/capitalize");
 const React = require("react");
 const uikitStyles = require("@hitachivantara/uikit-styles");
@@ -10,7 +11,6 @@ const useTheme = require("../../../hooks/useTheme.cjs");
 const TableContext = require("../TableContext.cjs");
 const TableSectionContext = require("../TableSectionContext.cjs");
 const TableCell_styles = require("./TableCell.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const capitalize__default = /* @__PURE__ */ _interopDefault(capitalize);
 const defaultComponent = "td";
@@ -59,35 +59,28 @@ const HvTableCell = React.forwardRef((props, externalRef) => {
     setSortedColorAlpha(theme.getVarValue(uikitStyles.theme.table.rowSortedColorAlpha, rootId));
     setSortedColor(getSortedColor(sortedColorValue, sortedColorAlpha));
   }, [colors, sortedColorValue, sortedColorAlpha, rootId]);
-  return /* @__PURE__ */ jsxRuntime.jsx(Component, {
-    ref: externalRef,
-    role: Component === defaultComponent ? null : "cell",
-    style,
-    className: cx(classes.root, classes[type], type === "body" && css({
-      [`&.${TableCell_styles.staticClasses.sorted}`]: {
-        backgroundColor: sortedColor
-      }
-    }), stickyColumn && css({
-      [`&.${TableCell_styles.staticClasses.sorted}`]: {
-        backgroundImage: `linear-gradient(to right, ${sortedColor}, ${sortedColor})`
-      }
-    }), {
-      [classes[`align${capitalize__default.default(align)}`]]: align !== "inherit",
-      [classes.variantList]: tableContext.variant === "listrow",
-      [classes.variantListHead]: tableContext.variant === "listrow" && type !== "body",
-      [classes[`variant${capitalize__default.default(variant)}`]]: variant !== "default",
-      [classes.sorted]: sorted,
-      [classes.stickyColumn]: stickyColumn,
-      [classes.stickyColumnMostLeft]: stickyColumnMostLeft,
-      [classes.stickyColumnLeastRight]: stickyColumnLeastRight,
-      [classes.groupColumnMostLeft]: groupColumnMostLeft,
-      [classes.groupColumnMostRight]: groupColumnMostRight,
-      [classes.resizable]: resizable,
-      [classes.resizing]: resizing
-    }, className),
-    ...others,
-    children
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref: externalRef, role: Component === defaultComponent ? null : "cell", style, className: cx(classes.root, classes[type], type === "body" && css({
+    [`&.${TableCell_styles.staticClasses.sorted}`]: {
+      backgroundColor: sortedColor
+    }
+  }), stickyColumn && css({
+    [`&.${TableCell_styles.staticClasses.sorted}`]: {
+      backgroundImage: `linear-gradient(to right, ${sortedColor}, ${sortedColor})`
+    }
+  }), {
+    [classes[`align${capitalize__default.default(align)}`]]: align !== "inherit",
+    [classes.variantList]: tableContext.variant === "listrow",
+    [classes.variantListHead]: tableContext.variant === "listrow" && type !== "body",
+    [classes[`variant${capitalize__default.default(variant)}`]]: variant !== "default",
+    [classes.sorted]: sorted,
+    [classes.stickyColumn]: stickyColumn,
+    [classes.stickyColumnMostLeft]: stickyColumnMostLeft,
+    [classes.stickyColumnLeastRight]: stickyColumnLeastRight,
+    [classes.groupColumnMostLeft]: groupColumnMostLeft,
+    [classes.groupColumnMostRight]: groupColumnMostRight,
+    [classes.resizable]: resizable,
+    [classes.resizing]: resizing
+  }, className), ...others, children });
 });
 exports.tableCellClasses = TableCell_styles.staticClasses;
 exports.HvTableCell = HvTableCell;

package/dist/cjs/components/Table/TableCell/TableCell.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.cjs","sources":["../../../../../src/components/Table/TableCell/TableCell.tsx"],"sourcesContent":["import capitalize from \"lodash/capitalize\";\n\nimport {\n  CSSProperties,\n  forwardRef,\n  TdHTMLAttributes,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { checkValidHexColorValue } from \"@core/utils/checkValidHexColorValue\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { getVarValue } from \"@core/utils/theme\";\nimport { hexToRgbA } from \"@core/utils/hexToRgbA\";\nimport { useTheme } from \"@core/hooks/useTheme\";\n\nimport {\n  HvTableCellAlign,\n  HvTableCellType,\n  HvTableCellVariant,\n} from \"../Table\";\nimport TableContext from \"../TableContext\";\nimport TableSectionContext from \"../TableSectionContext\";\nimport { staticClasses, useClasses } from \"./TableCell.styles\";\n\nexport { staticClasses as tableCellClasses };\n\nexport type HvTableCellClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTableCellProps\n  extends Omit<TdHTMLAttributes<HTMLTableCellElement>, \"align\"> {\n  /** The component used for the root node. Either a string to use a HTML element or a component. Defaults to td. */\n  component?: React.ElementType;\n  /** Content to be rendered */\n  children?: React.ReactNode;\n  /** Inline styles to be applied to the root element. */\n  style?: CSSProperties;\n  /** Set the text-align on the table cell content. */\n  align?: HvTableCellAlign;\n  /** Sets the cell's variant. */\n  variant?: HvTableCellVariant | \"listcheckbox\" | \"listactions\";\n  /** Specify the cell's type. The prop defaults to the value inherited from the parent TableHead, TableBody, or TableFooter components. */\n  type?: HvTableCellType;\n  /** Whether or not the cell is part of a sorted column. */\n  sorted?: boolean;\n  /** The cell is part of a sticky column. */\n  stickyColumn?: boolean;\n  /** The cell is part of the last sticky to the left column. */\n  stickyColumnMostLeft?: boolean;\n  /** The cell is part of the first sticky to the right column. */\n  stickyColumnLeastRight?: boolean;\n  /** The cell is part of the first column in the group. */\n  groupColumnMostLeft?: boolean;\n  /** The cell is part of the last column in the group. */\n  groupColumnMostRight?: boolean;\n  /** Whether or not the cell is resizable */\n  resizable?: boolean;\n  /** Whether or not the cell is being resized */\n  resizing?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableCellClasses;\n}\n\nconst defaultComponent = \"td\";\n\nconst getSortedColor = (color?: string, alpha?: string) => {\n  return checkValidHexColorValue(color) && alpha\n    ? hexToRgbA(color, parseFloat(alpha))\n    : color;\n};\n\n/**\n * `HvTableCell` acts as a `td` element and inherits styles from its context\n */\nexport const HvTableCell = forwardRef<HTMLElement, HvTableCellProps>(\n  (props, externalRef) => {\n    const {\n      children,\n      component,\n      className,\n      style,\n      classes: classesProp,\n      align = \"inherit\",\n      variant = \"default\",\n      type: typeProp,\n      stickyColumn = false,\n      stickyColumnMostLeft = false,\n      stickyColumnLeastRight = false,\n      groupColumnMostLeft = false,\n      groupColumnMostRight = false,\n      sorted = false,\n      resizable = false,\n      resizing = false,\n      ...others\n    } = props;\n    const { classes, cx, css } = useClasses(classesProp);\n    const { colors, rootId } = useTheme();\n    const tableContext = useContext(TableContext);\n    const tableSectionContext = useContext(TableSectionContext);\n\n    const [sortedColorValue, setSortedColorValue] = useState<string>();\n    const [sortedColorAlpha, setSortedColorAlpha] = useState<string>();\n\n    const type = typeProp || tableSectionContext?.type || \"body\";\n\n    const Component =\n      component || tableContext?.components?.Td || defaultComponent;\n\n    const [sortedColor, setSortedColor] = useState(\n      getSortedColor(sortedColorValue, sortedColorAlpha)\n    );\n\n    useEffect(() => {\n      setSortedColorValue(getVarValue(theme.table.rowSortedColor, rootId));\n      setSortedColorAlpha(getVarValue(theme.table.rowSortedColorAlpha, rootId));\n\n      setSortedColor(getSortedColor(sortedColorValue, sortedColorAlpha));\n    }, [colors, sortedColorValue, sortedColorAlpha, rootId]);\n\n    return (\n      <Component\n        ref={externalRef}\n        role={Component === defaultComponent ? null : \"cell\"}\n        style={style}\n        className={cx(\n          classes.root,\n          classes[type],\n          type === \"body\" &&\n            css({\n              [`&.${staticClasses.sorted}`]: {\n                backgroundColor: sortedColor,\n              },\n            }),\n          stickyColumn &&\n            css({\n              [`&.${staticClasses.sorted}`]: {\n                backgroundImage: `linear-gradient(to right, ${sortedColor}, ${sortedColor})`,\n              },\n            }),\n          {\n            [classes[`align${capitalize(align)}`]]: align !== \"inherit\",\n            [classes.variantList]: tableContext.variant === \"listrow\",\n            [classes.variantListHead]:\n              tableContext.variant === \"listrow\" && type !== \"body\",\n            [classes[`variant${capitalize(variant)}`]]: variant !== \"default\",\n            [classes.sorted]: sorted,\n            [classes.stickyColumn]: stickyColumn,\n            [classes.stickyColumnMostLeft]: stickyColumnMostLeft,\n            [classes.stickyColumnLeastRight]: stickyColumnLeastRight,\n            [classes.groupColumnMostLeft]: groupColumnMostLeft,\n            [classes.groupColumnMostRight]: groupColumnMostRight,\n            [classes.resizable]: resizable,\n            [classes.resizing]: resizing,\n          },\n          className\n        )}\n        {...others}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["defaultComponent","getSortedColor","color","alpha","checkValidHexColorValue","hexToRgbA","parseFloat","HvTableCell","forwardRef","props","externalRef","children","component","className","style","classes","classesProp","align","variant","type","typeProp","stickyColumn","stickyColumnMostLeft","stickyColumnLeastRight","groupColumnMostLeft","groupColumnMostRight","sorted","resizable","resizing","others","cx","css","useClasses","colors","rootId","useTheme","tableContext","useContext","TableContext","tableSectionContext","TableSectionContext","sortedColorValue","setSortedColorValue","useState","sortedColorAlpha","setSortedColorAlpha","Component","components","Td","sortedColor","setSortedColor","useEffect","getVarValue","theme","table","rowSortedColor","rowSortedColorAlpha","ref","role","root","staticClasses","backgroundColor","backgroundImage","capitalize","variantList","variantListHead"],"mappings":"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"}
+{"version":3,"file":"TableCell.cjs","sources":["../../../../../src/components/Table/TableCell/TableCell.tsx"],"sourcesContent":["import capitalize from \"lodash/capitalize\";\n\nimport {\n  CSSProperties,\n  forwardRef,\n  TdHTMLAttributes,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { checkValidHexColorValue } from \"@core/utils/checkValidHexColorValue\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { getVarValue } from \"@core/utils/theme\";\nimport { hexToRgbA } from \"@core/utils/hexToRgbA\";\nimport { useTheme } from \"@core/hooks/useTheme\";\n\nimport {\n  HvTableCellAlign,\n  HvTableCellType,\n  HvTableCellVariant,\n} from \"../Table\";\nimport TableContext from \"../TableContext\";\nimport TableSectionContext from \"../TableSectionContext\";\nimport { staticClasses, useClasses } from \"./TableCell.styles\";\n\nexport { staticClasses as tableCellClasses };\n\nexport type HvTableCellClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTableCellProps\n  extends Omit<TdHTMLAttributes<HTMLTableCellElement>, \"align\"> {\n  /** The component used for the root node. Either a string to use a HTML element or a component. Defaults to td. */\n  component?: React.ElementType;\n  /** Content to be rendered */\n  children?: React.ReactNode;\n  /** Inline styles to be applied to the root element. */\n  style?: CSSProperties;\n  /** Set the text-align on the table cell content. */\n  align?: HvTableCellAlign;\n  /** Sets the cell's variant. */\n  variant?: HvTableCellVariant | \"listcheckbox\" | \"listactions\";\n  /** Specify the cell's type. The prop defaults to the value inherited from the parent TableHead, TableBody, or TableFooter components. */\n  type?: HvTableCellType;\n  /** Whether or not the cell is part of a sorted column. */\n  sorted?: boolean;\n  /** The cell is part of a sticky column. */\n  stickyColumn?: boolean;\n  /** The cell is part of the last sticky to the left column. */\n  stickyColumnMostLeft?: boolean;\n  /** The cell is part of the first sticky to the right column. */\n  stickyColumnLeastRight?: boolean;\n  /** The cell is part of the first column in the group. */\n  groupColumnMostLeft?: boolean;\n  /** The cell is part of the last column in the group. */\n  groupColumnMostRight?: boolean;\n  /** Whether or not the cell is resizable */\n  resizable?: boolean;\n  /** Whether or not the cell is being resized */\n  resizing?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTableCellClasses;\n}\n\nconst defaultComponent = \"td\";\n\nconst getSortedColor = (color?: string, alpha?: string) => {\n  return checkValidHexColorValue(color) && alpha\n    ? hexToRgbA(color, parseFloat(alpha))\n    : color;\n};\n\n/**\n * `HvTableCell` acts as a `td` element and inherits styles from its context\n */\nexport const HvTableCell = forwardRef<HTMLElement, HvTableCellProps>(\n  (props, externalRef) => {\n    const {\n      children,\n      component,\n      className,\n      style,\n      classes: classesProp,\n      align = \"inherit\",\n      variant = \"default\",\n      type: typeProp,\n      stickyColumn = false,\n      stickyColumnMostLeft = false,\n      stickyColumnLeastRight = false,\n      groupColumnMostLeft = false,\n      groupColumnMostRight = false,\n      sorted = false,\n      resizable = false,\n      resizing = false,\n      ...others\n    } = props;\n    const { classes, cx, css } = useClasses(classesProp);\n    const { colors, rootId } = useTheme();\n    const tableContext = useContext(TableContext);\n    const tableSectionContext = useContext(TableSectionContext);\n\n    const [sortedColorValue, setSortedColorValue] = useState<string>();\n    const [sortedColorAlpha, setSortedColorAlpha] = useState<string>();\n\n    const type = typeProp || tableSectionContext?.type || \"body\";\n\n    const Component =\n      component || tableContext?.components?.Td || defaultComponent;\n\n    const [sortedColor, setSortedColor] = useState(\n      getSortedColor(sortedColorValue, sortedColorAlpha)\n    );\n\n    useEffect(() => {\n      setSortedColorValue(getVarValue(theme.table.rowSortedColor, rootId));\n      setSortedColorAlpha(getVarValue(theme.table.rowSortedColorAlpha, rootId));\n\n      setSortedColor(getSortedColor(sortedColorValue, sortedColorAlpha));\n    }, [colors, sortedColorValue, sortedColorAlpha, rootId]);\n\n    return (\n      <Component\n        ref={externalRef}\n        role={Component === defaultComponent ? null : \"cell\"}\n        style={style}\n        className={cx(\n          classes.root,\n          classes[type],\n          type === \"body\" &&\n            css({\n              [`&.${staticClasses.sorted}`]: {\n                backgroundColor: sortedColor,\n              },\n            }),\n          stickyColumn &&\n            css({\n              [`&.${staticClasses.sorted}`]: {\n                backgroundImage: `linear-gradient(to right, ${sortedColor}, ${sortedColor})`,\n              },\n            }),\n          {\n            [classes[`align${capitalize(align)}`]]: align !== \"inherit\",\n            [classes.variantList]: tableContext.variant === \"listrow\",\n            [classes.variantListHead]:\n              tableContext.variant === \"listrow\" && type !== \"body\",\n            [classes[`variant${capitalize(variant)}`]]: variant !== \"default\",\n            [classes.sorted]: sorted,\n            [classes.stickyColumn]: stickyColumn,\n            [classes.stickyColumnMostLeft]: stickyColumnMostLeft,\n            [classes.stickyColumnLeastRight]: stickyColumnLeastRight,\n            [classes.groupColumnMostLeft]: groupColumnMostLeft,\n            [classes.groupColumnMostRight]: groupColumnMostRight,\n            [classes.resizable]: resizable,\n            [classes.resizing]: resizing,\n          },\n          className\n        )}\n        {...others}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["defaultComponent","getSortedColor","color","alpha","checkValidHexColorValue","hexToRgbA","parseFloat","HvTableCell","forwardRef","props","externalRef","children","component","className","style","classes","classesProp","align","variant","type","typeProp","stickyColumn","stickyColumnMostLeft","stickyColumnLeastRight","groupColumnMostLeft","groupColumnMostRight","sorted","resizable","resizing","others","cx","css","useClasses","colors","rootId","useTheme","tableContext","useContext","TableContext","tableSectionContext","TableSectionContext","sortedColorValue","setSortedColorValue","useState","sortedColorAlpha","setSortedColorAlpha","Component","components","Td","sortedColor","setSortedColor","useEffect","getVarValue","theme","table","rowSortedColor","rowSortedColorAlpha","root","staticClasses","backgroundColor","backgroundImage","capitalize","variantList","variantListHead"],"mappings":"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"}