@hitachivantara/uikit-react-core 5.28.1 → 5.30.0

package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.js

@@ -10,7 +10,7 @@ const {
     padding: "0 30px",
     listStyleType: "none",
     flexWrap: "wrap",
-    backdropFilter: `blur(${theme.scrollTo.backgroundColorBlur})`
+    backdropFilter: `blur(4px)`
   },
   positionSticky: {
     position: "sticky",
@@ -25,24 +25,24 @@ const {
     left: 0
   },
   notSelectedRoot: {
-    display: theme.scrollTo.horizontal.dotDisplay,
+    display: "flex",
     justifyContent: "center",
     alignItems: "center",
-    height: theme.scrollTo.dotRootSize,
-    width: theme.scrollTo.dotRootSize,
-    borderRadius: theme.scrollTo.dotRootRadius
+    height: "16px",
+    width: "16px",
+    borderRadius: "50%"
   },
   notSelected: {
-    height: theme.scrollTo.dotNotSelectedSize,
-    width: theme.scrollTo.dotNotSelectedSize,
+    height: "4px",
+    width: "4px",
     borderRadius: "50%",
     display: "inline-block",
-    backgroundColor: theme.scrollTo.dotNotSelectedColor
+    backgroundColor: theme.colors.secondary_60
   },
   selected: {
-    display: theme.scrollTo.horizontal.dotDisplay,
-    height: theme.scrollTo.dotRootSize,
-    width: theme.scrollTo.dotRootSize
+    display: "flex",
+    height: "16px",
+    width: "16px"
   }
 });
 export {

package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollToHorizontal.styles.js","sources":["../../../../../src/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst name = \"HvScrollToHorizontal\";\n\nexport const { staticClasses, useClasses } = createClasses(name, {\n  root: {\n    display: \"flex\",\n    padding: \"0 30px\",\n    listStyleType: \"none\",\n    flexWrap: \"wrap\",\n    backdropFilter: `blur(${theme.scrollTo.backgroundColorBlur})`,\n  },\n  positionSticky: {\n    position: \"sticky\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    top: 0,\n    left: 0,\n  },\n  positionFixed: {\n    position: \"fixed\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    top: 0,\n    left: 0,\n  },\n  notSelectedRoot: {\n    display: theme.scrollTo.horizontal.dotDisplay,\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: theme.scrollTo.dotRootSize,\n    width: theme.scrollTo.dotRootSize,\n    borderRadius: theme.scrollTo.dotRootRadius,\n  },\n  notSelected: {\n    height: theme.scrollTo.dotNotSelectedSize,\n    width: theme.scrollTo.dotNotSelectedSize,\n    borderRadius: \"50%\",\n    display: \"inline-block\",\n    backgroundColor: theme.scrollTo.dotNotSelectedColor,\n  },\n  selected: {\n    display: theme.scrollTo.horizontal.dotDisplay,\n    height: theme.scrollTo.dotRootSize,\n    width: theme.scrollTo.dotRootSize,\n  },\n});\n"],"names":["name","staticClasses","useClasses","createClasses","root","display","padding","listStyleType","flexWrap","backdropFilter","theme","scrollTo","backgroundColorBlur","positionSticky","position","zIndex","zIndices","banner","top","left","positionFixed","notSelectedRoot","horizontal","dotDisplay","justifyContent","alignItems","height","dotRootSize","width","borderRadius","dotRootRadius","notSelected","dotNotSelectedSize","backgroundColor","dotNotSelectedColor","selected"],"mappings":";;AAIA,MAAMA,OAAO;AAEA,MAAA;AAAA,EAAEC;AAAAA,EAAeC;AAAW,IAAIC,cAAcH,MAAM;AAAA,EAC/DI,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,UAAU;AAAA,IACVC,gBAAiB,QAAOC,MAAMC,SAASC,mBAAoB;AAAA,EAC7D;AAAA,EACAC,gBAAgB;AAAA,IACdC,UAAU;AAAA,IACVC,QAAS,QAAOL,MAAMM,SAASC,MAAO;AAAA,IACtCC,KAAK;AAAA,IACLC,MAAM;AAAA,EACR;AAAA,EACAC,eAAe;AAAA,IACbN,UAAU;AAAA,IACVC,QAAS,QAAOL,MAAMM,SAASC,MAAO;AAAA,IACtCC,KAAK;AAAA,IACLC,MAAM;AAAA,EACR;AAAA,EACAE,iBAAiB;AAAA,IACfhB,SAASK,MAAMC,SAASW,WAAWC;AAAAA,IACnCC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZC,QAAQhB,MAAMC,SAASgB;AAAAA,IACvBC,OAAOlB,MAAMC,SAASgB;AAAAA,IACtBE,cAAcnB,MAAMC,SAASmB;AAAAA,EAC/B;AAAA,EACAC,aAAa;AAAA,IACXL,QAAQhB,MAAMC,SAASqB;AAAAA,IACvBJ,OAAOlB,MAAMC,SAASqB;AAAAA,IACtBH,cAAc;AAAA,IACdxB,SAAS;AAAA,IACT4B,iBAAiBvB,MAAMC,SAASuB;AAAAA,EAClC;AAAA,EACAC,UAAU;AAAA,IACR9B,SAASK,MAAMC,SAASW,WAAWC;AAAAA,IACnCG,QAAQhB,MAAMC,SAASgB;AAAAA,IACvBC,OAAOlB,MAAMC,SAASgB;AAAAA,EACxB;AACF,CAAC;"}
+{"version":3,"file":"ScrollToHorizontal.styles.js","sources":["../../../../../src/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst name = \"HvScrollToHorizontal\";\n\nexport const { staticClasses, useClasses } = createClasses(name, {\n  root: {\n    display: \"flex\",\n    padding: \"0 30px\",\n    listStyleType: \"none\",\n    flexWrap: \"wrap\",\n    backdropFilter: `blur(4px)`,\n  },\n  positionSticky: {\n    position: \"sticky\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    top: 0,\n    left: 0,\n  },\n  positionFixed: {\n    position: \"fixed\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    top: 0,\n    left: 0,\n  },\n  notSelectedRoot: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: \"16px\",\n    width: \"16px\",\n    borderRadius: \"50%\",\n  },\n  notSelected: {\n    height: \"4px\",\n    width: \"4px\",\n    borderRadius: \"50%\",\n    display: \"inline-block\",\n    backgroundColor: theme.colors.secondary_60,\n  },\n  selected: {\n    display: \"flex\",\n    height: \"16px\",\n    width: \"16px\",\n  },\n});\n"],"names":["name","staticClasses","useClasses","createClasses","root","display","padding","listStyleType","flexWrap","backdropFilter","positionSticky","position","zIndex","theme","zIndices","banner","top","left","positionFixed","notSelectedRoot","justifyContent","alignItems","height","width","borderRadius","notSelected","backgroundColor","colors","secondary_60","selected"],"mappings":";;AAIA,MAAMA,OAAO;AAEA,MAAA;AAAA,EAAEC;AAAAA,EAAeC;AAAW,IAAIC,cAAcH,MAAM;AAAA,EAC/DI,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,UAAU;AAAA,IACVC,gBAAiB;AAAA,EACnB;AAAA,EACAC,gBAAgB;AAAA,IACdC,UAAU;AAAA,IACVC,QAAS,QAAOC,MAAMC,SAASC,MAAO;AAAA,IACtCC,KAAK;AAAA,IACLC,MAAM;AAAA,EACR;AAAA,EACAC,eAAe;AAAA,IACbP,UAAU;AAAA,IACVC,QAAS,QAAOC,MAAMC,SAASC,MAAO;AAAA,IACtCC,KAAK;AAAA,IACLC,MAAM;AAAA,EACR;AAAA,EACAE,iBAAiB;AAAA,IACfd,SAAS;AAAA,IACTe,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZC,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPC,cAAc;AAAA,EAChB;AAAA,EACAC,aAAa;AAAA,IACXH,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPC,cAAc;AAAA,IACdnB,SAAS;AAAA,IACTqB,iBAAiBb,MAAMc,OAAOC;AAAAA,EAChC;AAAA,EACAC,UAAU;AAAA,IACRxB,SAAS;AAAA,IACTiB,QAAQ;AAAA,IACRC,OAAO;AAAA,EACT;AACF,CAAC;"}

package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.styles.js

@@ -13,7 +13,7 @@ const {
     listStyleType: "none",
     flexWrap: "wrap",
     flexDirection: "column",
-    backdropFilter: `blur(${theme.scrollTo.backgroundColorBlur})`
+    backdropFilter: `blur(4px)`
   },
   positionAbsolute: {
     width: "32px",

package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollToVertical.styles.js","sources":["../../../../../src/components/ScrollTo/Vertical/ScrollToVertical.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst name = \"HvScrollToVertical\";\n\nexport const { staticClasses, useClasses } = createClasses(name, {\n  root: {\n    display: \"flex\",\n    width: \"32px\",\n    padding: \"0\",\n    margin: 0,\n    listStyleType: \"none\",\n    flexWrap: \"wrap\",\n    flexDirection: \"column\",\n    backdropFilter: `blur(${theme.scrollTo.backgroundColorBlur})`,\n  },\n  positionAbsolute: {\n    width: \"32px\",\n    position: \"absolute\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    right: \"0\",\n  },\n  positionFixed: {\n    width: \"32px\",\n    position: \"fixed\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    right: \"0\",\n  },\n});\n\nexport const calculateOffset = (quantityOfOptions: number) => {\n  const itemSize = 32;\n  const halfOptions = Math.round(quantityOfOptions * 0.5);\n\n  return halfOptions * itemSize;\n};\n"],"names":["name","staticClasses","useClasses","createClasses","root","display","width","padding","margin","listStyleType","flexWrap","flexDirection","backdropFilter","theme","scrollTo","backgroundColorBlur","positionAbsolute","position","zIndex","zIndices","banner","right","positionFixed","calculateOffset","quantityOfOptions","itemSize","halfOptions","Math","round"],"mappings":";;AAIA,MAAMA,OAAO;AAEA,MAAA;AAAA,EAAEC;AAAAA,EAAeC;AAAW,IAAIC,cAAcH,MAAM;AAAA,EAC/DI,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,eAAe;AAAA,IACfC,UAAU;AAAA,IACVC,eAAe;AAAA,IACfC,gBAAiB,QAAOC,MAAMC,SAASC,mBAAoB;AAAA,EAC7D;AAAA,EACAC,kBAAkB;AAAA,IAChBV,OAAO;AAAA,IACPW,UAAU;AAAA,IACVC,QAAS,QAAOL,MAAMM,SAASC,MAAO;AAAA,IACtCC,OAAO;AAAA,EACT;AAAA,EACAC,eAAe;AAAA,IACbhB,OAAO;AAAA,IACPW,UAAU;AAAA,IACVC,QAAS,QAAOL,MAAMM,SAASC,MAAO;AAAA,IACtCC,OAAO;AAAA,EACT;AACF,CAAC;AAEYE,MAAAA,kBAAkBA,CAACC,sBAA8B;AAC5D,QAAMC,WAAW;AACjB,QAAMC,cAAcC,KAAKC,MAAMJ,oBAAoB,GAAG;AAEtD,SAAOE,cAAcD;AACvB;"}
+{"version":3,"file":"ScrollToVertical.styles.js","sources":["../../../../../src/components/ScrollTo/Vertical/ScrollToVertical.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst name = \"HvScrollToVertical\";\n\nexport const { staticClasses, useClasses } = createClasses(name, {\n  root: {\n    display: \"flex\",\n    width: \"32px\",\n    padding: \"0\",\n    margin: 0,\n    listStyleType: \"none\",\n    flexWrap: \"wrap\",\n    flexDirection: \"column\",\n    backdropFilter: `blur(4px)`,\n  },\n  positionAbsolute: {\n    width: \"32px\",\n    position: \"absolute\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    right: \"0\",\n  },\n  positionFixed: {\n    width: \"32px\",\n    position: \"fixed\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    right: \"0\",\n  },\n});\n\nexport const calculateOffset = (quantityOfOptions: number) => {\n  const itemSize = 32;\n  const halfOptions = Math.round(quantityOfOptions * 0.5);\n\n  return halfOptions * itemSize;\n};\n"],"names":["name","staticClasses","useClasses","createClasses","root","display","width","padding","margin","listStyleType","flexWrap","flexDirection","backdropFilter","positionAbsolute","position","zIndex","theme","zIndices","banner","right","positionFixed","calculateOffset","quantityOfOptions","itemSize","halfOptions","Math","round"],"mappings":";;AAIA,MAAMA,OAAO;AAEA,MAAA;AAAA,EAAEC;AAAAA,EAAeC;AAAW,IAAIC,cAAcH,MAAM;AAAA,EAC/DI,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,eAAe;AAAA,IACfC,UAAU;AAAA,IACVC,eAAe;AAAA,IACfC,gBAAiB;AAAA,EACnB;AAAA,EACAC,kBAAkB;AAAA,IAChBP,OAAO;AAAA,IACPQ,UAAU;AAAA,IACVC,QAAS,QAAOC,MAAMC,SAASC,MAAO;AAAA,IACtCC,OAAO;AAAA,EACT;AAAA,EACAC,eAAe;AAAA,IACbd,OAAO;AAAA,IACPQ,UAAU;AAAA,IACVC,QAAS,QAAOC,MAAMC,SAASC,MAAO;AAAA,IACtCC,OAAO;AAAA,EACT;AACF,CAAC;AAEYE,MAAAA,kBAAkBA,CAACC,sBAA8B;AAC5D,QAAMC,WAAW;AACjB,QAAMC,cAAcC,KAAKC,MAAMJ,oBAAoB,GAAG;AAEtD,SAAOE,cAAcD;AACvB;"}

package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.js

@@ -4,17 +4,19 @@ import { setId } from "../../../../utils/setId.js";
 import { useTheme } from "../../../../hooks/useTheme.js";
 import { useClasses } from "./VerticalScrollListItem.styles.js";
 import { staticClasses } from "./VerticalScrollListItem.styles.js";
-const HvVerticalScrollListItem = ({
-  id,
-  className,
-  classes: classesProp,
-  selected,
-  "aria-label": ariaLabel,
-  onClick,
-  onKeyDown,
-  tooltipWrapper,
-  ...others
-}) => {
+import { useDefaultProps } from "../../../../hooks/useDefaultProps.js";
+const HvVerticalScrollListItem = (props) => {
+  const {
+    id,
+    className,
+    classes: classesProp,
+    selected,
+    "aria-label": ariaLabel,
+    onClick,
+    onKeyDown,
+    tooltipWrapper,
+    ...others
+  } = useDefaultProps("HvVerticalScrollListItem", props);
   const {
     classes,
     cx

package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalScrollListItem.js","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.tsx"],"sourcesContent":["import { CurrentStep } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypographyProps } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\n\nimport { staticClasses, useClasses } from \"./VerticalScrollListItem.styles\";\n\nexport { staticClasses as verticalScrollListItemClasses };\n\nexport type HvVerticalScrollListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalScrollListItemProps extends HvBaseProps {\n  /** A function component that renders a typography wrapped with a tooltip. */\n  tooltipWrapper: React.FunctionComponent<{\n    id?: string;\n    className?: string;\n    variant?: HvTypographyProps[\"variant\"];\n    children?: React.ReactNode;\n  }>;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalScrollListItemClasses;\n  /** Whether the element is selected. */\n  selected?: boolean;\n  /** The function to be executed when the element is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /** The function to be executed when the element is clicked. */\n  onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n}\n\n/**\n * HvVerticalScrollListItem a focusable item to be used as part of the vertical scroll\n */\nexport const HvVerticalScrollListItem = ({\n  id,\n  className,\n  classes: classesProp,\n  selected,\n  \"aria-label\": ariaLabel,\n  onClick,\n  onKeyDown,\n  tooltipWrapper,\n  ...others\n}: HvVerticalScrollListItemProps) => {\n  const { classes, cx } = useClasses(classesProp);\n  const { activeTheme } = useTheme();\n\n  const variant: HvTypographyProps[\"variant\"] = selected ? \"label\" : \"body\";\n\n  const labelId = setId(id, \"label\");\n\n  const buttonId = setId(id, \"button\");\n\n  const Tooltip = tooltipWrapper;\n\n  const icon = selected ? (\n    <CurrentStep\n      height={activeTheme?.scrollTo.dotSelectedSize}\n      width={activeTheme?.scrollTo.dotSelectedSize}\n    />\n  ) : (\n    <div className={cx(classes.notSelected)} />\n  );\n\n  return (\n    <li id={id} className={cx(classes.root, className)} aria-current={selected}>\n      <div\n        id={buttonId}\n        role=\"button\"\n        tabIndex={0}\n        onClick={onClick}\n        onKeyDown={onKeyDown}\n        className={classes.button}\n        aria-label={ariaLabel}\n        aria-labelledby={labelId}\n        {...others}\n      >\n        <Tooltip id={labelId} className={classes.text} variant={variant}>\n          {icon}\n        </Tooltip>\n      </div>\n    </li>\n  );\n};\n"],"names":["HvVerticalScrollListItem","id","className","classes","classesProp","selected","ariaLabel","onClick","onKeyDown","tooltipWrapper","others","cx","useClasses","activeTheme","useTheme","variant","labelId","setId","buttonId","Tooltip","icon","scrollTo","dotSelectedSize","notSelected","root","button","text"],"mappings":";;;;;;AAmCO,MAAMA,2BAA2BA,CAAC;AAAA,EACvCC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACA,cAAcC;AAAAA,EACdC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEP;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,WAAWR,WAAW;AACxC,QAAA;AAAA,IAAES;AAAAA,MAAgBC,SAAS;AAE3BC,QAAAA,UAAwCV,WAAW,UAAU;AAE7DW,QAAAA,UAAUC,MAAMhB,IAAI,OAAO;AAE3BiB,QAAAA,WAAWD,MAAMhB,IAAI,QAAQ;AAEnC,QAAMkB,UAAUV;AAEhB,QAAMW,OAAOf,WACX,oBAAC,eACC,QAAQQ,2CAAaQ,SAASC,iBAC9B,OAAOT,2CAAaQ,SAASC,gBAC7B,CAAA,IAED,oBAAA,OAAA,EAAI,WAAWX,GAAGR,QAAQoB,WAAW,EACvC,CAAA;AAED,6BACG,MAAG,EAAA,IAAQ,WAAWZ,GAAGR,QAAQqB,MAAMtB,SAAS,GAAG,gBAAcG,UAChE,8BAAC,OACC,EAAA,IAAIa,UACJ,MAAK,UACL,UAAU,GACV,SACA,WACA,WAAWf,QAAQsB,QACnB,cAAYnB,WACZ,mBAAiBU,SACbN,GAAAA,QAEJ,UAAA,oBAAC,SAAQ,EAAA,IAAIM,SAAS,WAAWb,QAAQuB,MAAM,SAC5CN,UAAAA,KACH,CAAA,GACF,EACF,CAAA;AAEJ;"}
+{"version":3,"file":"VerticalScrollListItem.js","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.tsx"],"sourcesContent":["import { CurrentStep } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypographyProps } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\n\nimport { useDefaultProps } from \"@core/hooks\";\nimport { staticClasses, useClasses } from \"./VerticalScrollListItem.styles\";\n\nexport { staticClasses as verticalScrollListItemClasses };\n\nexport type HvVerticalScrollListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalScrollListItemProps extends HvBaseProps {\n  /** A function component that renders a typography wrapped with a tooltip. */\n  tooltipWrapper: React.FunctionComponent<{\n    id?: string;\n    className?: string;\n    variant?: HvTypographyProps[\"variant\"];\n    children?: React.ReactNode;\n  }>;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalScrollListItemClasses;\n  /** Whether the element is selected. */\n  selected?: boolean;\n  /** The function to be executed when the element is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /** The function to be executed when the element is clicked. */\n  onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n}\n\n/**\n * HvVerticalScrollListItem a focusable item to be used as part of the vertical scroll\n */\nexport const HvVerticalScrollListItem = (\n  props: HvVerticalScrollListItemProps\n) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    selected,\n    \"aria-label\": ariaLabel,\n    onClick,\n    onKeyDown,\n    tooltipWrapper,\n    ...others\n  } = useDefaultProps(\"HvVerticalScrollListItem\", props);\n  const { classes, cx } = useClasses(classesProp);\n  const { activeTheme } = useTheme();\n\n  const variant: HvTypographyProps[\"variant\"] = selected ? \"label\" : \"body\";\n\n  const labelId = setId(id, \"label\");\n\n  const buttonId = setId(id, \"button\");\n\n  const Tooltip = tooltipWrapper;\n\n  const icon = selected ? (\n    <CurrentStep\n      height={activeTheme?.scrollTo.dotSelectedSize}\n      width={activeTheme?.scrollTo.dotSelectedSize}\n    />\n  ) : (\n    <div className={cx(classes.notSelected)} />\n  );\n\n  return (\n    <li id={id} className={cx(classes.root, className)} aria-current={selected}>\n      <div\n        id={buttonId}\n        role=\"button\"\n        tabIndex={0}\n        onClick={onClick}\n        onKeyDown={onKeyDown}\n        className={classes.button}\n        aria-label={ariaLabel}\n        aria-labelledby={labelId}\n        {...others}\n      >\n        <Tooltip id={labelId} className={classes.text} variant={variant}>\n          {icon}\n        </Tooltip>\n      </div>\n    </li>\n  );\n};\n"],"names":["HvVerticalScrollListItem","props","id","className","classes","classesProp","selected","ariaLabel","onClick","onKeyDown","tooltipWrapper","others","useDefaultProps","cx","useClasses","activeTheme","useTheme","variant","labelId","setId","buttonId","Tooltip","icon","scrollTo","dotSelectedSize","notSelected","root","button","text"],"mappings":";;;;;;;AAoCaA,MAAAA,2BAA2BA,CACtCC,UACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACA,cAAcC;AAAAA,IACdC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,4BAA4BX,KAAK;AAC/C,QAAA;AAAA,IAAEG;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,WAAWT,WAAW;AACxC,QAAA;AAAA,IAAEU;AAAAA,MAAgBC,SAAS;AAE3BC,QAAAA,UAAwCX,WAAW,UAAU;AAE7DY,QAAAA,UAAUC,MAAMjB,IAAI,OAAO;AAE3BkB,QAAAA,WAAWD,MAAMjB,IAAI,QAAQ;AAEnC,QAAMmB,UAAUX;AAEhB,QAAMY,OAAOhB,WACX,oBAAC,eACC,QAAQS,2CAAaQ,SAASC,iBAC9B,OAAOT,2CAAaQ,SAASC,gBAC7B,CAAA,IAED,oBAAA,OAAA,EAAI,WAAWX,GAAGT,QAAQqB,WAAW,EACvC,CAAA;AAED,6BACG,MAAG,EAAA,IAAQ,WAAWZ,GAAGT,QAAQsB,MAAMvB,SAAS,GAAG,gBAAcG,UAChE,8BAAC,OACC,EAAA,IAAIc,UACJ,MAAK,UACL,UAAU,GACV,SACA,WACA,WAAWhB,QAAQuB,QACnB,cAAYpB,WACZ,mBAAiBW,SACbP,GAAAA,QAEJ,UAAA,oBAAC,SAAQ,EAAA,IAAIO,SAAS,WAAWd,QAAQwB,MAAM,SAC5CN,UAAAA,KACH,CAAA,GACF,EACF,CAAA;AAEJ;"}

package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.js

@@ -15,15 +15,15 @@ const {
     alignItems: "center"
   },
   notSelected: {
-    height: theme.scrollTo.dotNotSelectedSize,
-    width: theme.scrollTo.dotNotSelectedSize,
+    height: "4px",
+    width: "4px",
     borderRadius: "50%",
     display: "inline-block",
-    backgroundColor: theme.scrollTo.dotNotSelectedColor
+    backgroundColor: theme.colors.secondary_60
   },
   text: {
-    height: theme.scrollTo.dotRootSize,
-    width: theme.scrollTo.dotRootSize,
+    height: "16px",
+    width: "16px",
     display: "flex",
     justifyContent: "center",
     alignItems: "center"
@@ -32,16 +32,16 @@ const {
     display: "flex",
     justifyContent: "center",
     alignItems: "center",
-    height: theme.scrollTo.dotRootSize,
-    width: theme.scrollTo.dotRootSize,
-    borderRadius: theme.scrollTo.dotRootRadius,
+    height: "16px",
+    width: "16px",
+    borderRadius: "50%",
     cursor: "pointer",
     "&:hover": {
-      backgroundColor: theme.scrollTo.dotHoverBackgroundColor,
+      backgroundColor: theme.colors.containerBackgroundHover,
       "& $notSelected": {
-        height: theme.scrollTo.dotHoverSize,
-        width: theme.scrollTo.dotHoverSize,
-        backgroundColor: theme.scrollTo.dotHoverColor
+        height: "6px",
+        width: "6px",
+        backgroundColor: theme.colors.secondary
       }
     },
     "&:focus": {

package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalScrollListItem.styles.js","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.ts"],"sourcesContent":["import { outlineStyles } from \"@core/utils/focusUtils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst name = \"HvVerticalScrollListItem\";\n\nexport const { staticClasses, useClasses } = createClasses(name, {\n  root: {\n    padding: \"0\",\n    height: \"32px\",\n    width: \"32px\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n  },\n  notSelected: {\n    height: theme.scrollTo.dotNotSelectedSize,\n    width: theme.scrollTo.dotNotSelectedSize,\n    borderRadius: \"50%\",\n    display: \"inline-block\",\n    backgroundColor: theme.scrollTo.dotNotSelectedColor,\n  },\n  text: {\n    height: theme.scrollTo.dotRootSize,\n    width: theme.scrollTo.dotRootSize,\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n  },\n  button: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: theme.scrollTo.dotRootSize,\n    width: theme.scrollTo.dotRootSize,\n    borderRadius: theme.scrollTo.dotRootRadius,\n    cursor: \"pointer\",\n    \"&:hover\": {\n      backgroundColor: theme.scrollTo.dotHoverBackgroundColor,\n\n      \"& $notSelected\": {\n        height: theme.scrollTo.dotHoverSize,\n        width: theme.scrollTo.dotHoverSize,\n        backgroundColor: theme.scrollTo.dotHoverColor,\n      },\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&:focus-visible\": {\n      ...outlineStyles,\n    },\n  },\n});\n"],"names":["name","staticClasses","useClasses","createClasses","root","padding","height","width","display","justifyContent","alignItems","notSelected","theme","scrollTo","dotNotSelectedSize","borderRadius","backgroundColor","dotNotSelectedColor","text","dotRootSize","button","dotRootRadius","cursor","dotHoverBackgroundColor","dotHoverSize","dotHoverColor","outline","outlineStyles"],"mappings":";;;AAKA,MAAMA,OAAO;AAEA,MAAA;AAAA,EAAEC;AAAAA,EAAeC;AAAW,IAAIC,cAAcH,MAAM;AAAA,EAC/DI,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,aAAa;AAAA,IACXL,QAAQM,MAAMC,SAASC;AAAAA,IACvBP,OAAOK,MAAMC,SAASC;AAAAA,IACtBC,cAAc;AAAA,IACdP,SAAS;AAAA,IACTQ,iBAAiBJ,MAAMC,SAASI;AAAAA,EAClC;AAAA,EACAC,MAAM;AAAA,IACJZ,QAAQM,MAAMC,SAASM;AAAAA,IACvBZ,OAAOK,MAAMC,SAASM;AAAAA,IACtBX,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAU,QAAQ;AAAA,IACNZ,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZJ,QAAQM,MAAMC,SAASM;AAAAA,IACvBZ,OAAOK,MAAMC,SAASM;AAAAA,IACtBJ,cAAcH,MAAMC,SAASQ;AAAAA,IAC7BC,QAAQ;AAAA,IACR,WAAW;AAAA,MACTN,iBAAiBJ,MAAMC,SAASU;AAAAA,MAEhC,kBAAkB;AAAA,QAChBjB,QAAQM,MAAMC,SAASW;AAAAA,QACvBjB,OAAOK,MAAMC,SAASW;AAAAA,QACtBR,iBAAiBJ,MAAMC,SAASY;AAAAA,MAClC;AAAA,IACF;AAAA,IACA,WAAW;AAAA,MACTC,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAGC;AAAAA,IACL;AAAA,EACF;AACF,CAAC;"}
+{"version":3,"file":"VerticalScrollListItem.styles.js","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.ts"],"sourcesContent":["import { outlineStyles } from \"@core/utils/focusUtils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst name = \"HvVerticalScrollListItem\";\n\nexport const { staticClasses, useClasses } = createClasses(name, {\n  root: {\n    padding: \"0\",\n    height: \"32px\",\n    width: \"32px\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n  },\n  notSelected: {\n    height: \"4px\",\n    width: \"4px\",\n    borderRadius: \"50%\",\n    display: \"inline-block\",\n    backgroundColor: theme.colors.secondary_60,\n  },\n  text: {\n    height: \"16px\",\n    width: \"16px\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n  },\n  button: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: \"16px\",\n    width: \"16px\",\n    borderRadius: \"50%\",\n    cursor: \"pointer\",\n    \"&:hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n\n      \"& $notSelected\": {\n        height: \"6px\",\n        width: \"6px\",\n        backgroundColor: theme.colors.secondary,\n      },\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&:focus-visible\": {\n      ...outlineStyles,\n    },\n  },\n});\n"],"names":["name","staticClasses","useClasses","createClasses","root","padding","height","width","display","justifyContent","alignItems","notSelected","borderRadius","backgroundColor","theme","colors","secondary_60","text","button","cursor","containerBackgroundHover","secondary","outline","outlineStyles"],"mappings":";;;AAKA,MAAMA,OAAO;AAEA,MAAA;AAAA,EAAEC;AAAAA,EAAeC;AAAW,IAAIC,cAAcH,MAAM;AAAA,EAC/DI,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,aAAa;AAAA,IACXL,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPK,cAAc;AAAA,IACdJ,SAAS;AAAA,IACTK,iBAAiBC,MAAMC,OAAOC;AAAAA,EAChC;AAAA,EACAC,MAAM;AAAA,IACJX,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAQ,QAAQ;AAAA,IACNV,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZJ,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPK,cAAc;AAAA,IACdO,QAAQ;AAAA,IACR,WAAW;AAAA,MACTN,iBAAiBC,MAAMC,OAAOK;AAAAA,MAE9B,kBAAkB;AAAA,QAChBd,QAAQ;AAAA,QACRC,OAAO;AAAA,QACPM,iBAAiBC,MAAMC,OAAOM;AAAAA,MAChC;AAAA,IACF;AAAA,IACA,WAAW;AAAA,MACTC,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAGC;AAAAA,IACL;AAAA,EACF;AACF,CAAC;"}

package/dist/esm/components/Slider/Slider.styles.js

@@ -24,16 +24,16 @@ const dragSquare = {
   top: "-12px",
   content: "''",
   background: "transparent",
-  borderTop: `12px solid ${theme.slider.dragBarColor}`,
-  borderBottom: `12px solid ${theme.slider.dragBarColor}`,
+  borderTop: `12px solid ${theme.colors.primary_20}`,
+  borderBottom: `12px solid ${theme.colors.primary_20}`,
   zIndex: "-2"
 };
 const ring = {
   width: "32px",
   height: "32px",
   borderRadius: "50%",
-  border: `9px solid ${theme.slider.ringColor}`,
-  opacity: theme.slider.ringOpacity,
+  border: `9px solid ${theme.colors.primary_20}`,
+  opacity: "100%",
   content: "''",
   position: "absolute",
   top: "-10px",

package/dist/esm/components/Slider/Slider.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.styles.js","sources":["../../../../src/components/Slider/Slider.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { CSSProperties } from \"react\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\nimport { createClasses } from \"@core/utils/classes\";\n\nimport base from \"./base\";\n\nconst dot: CSSProperties = {\n  position: \"absolute\",\n  bottom: \"-1px\",\n  marginLeft: \"0px\",\n  width: \"1px\",\n  height: \"4px\",\n  border: \"none\",\n  borderRadius: \"0%\",\n  backgroundColor: theme.colors.atmo4,\n  cursor: \"pointer\",\n  verticalAlign: \"middle\",\n  zIndex: \"-3\",\n};\n\nconst dragSquare: CSSProperties = {\n  cursor: \"grab\",\n  width: \"calc(100% - 40px)\",\n  left: \"20px\",\n  height: \"27px\",\n  position: \"absolute\",\n  top: \"-12px\",\n  content: \"''\",\n  background: \"transparent\",\n  borderTop: `12px solid ${theme.slider.dragBarColor}`,\n  borderBottom: `12px solid ${theme.slider.dragBarColor}`,\n  zIndex: \"-2\",\n};\n\nconst ring: CSSProperties = {\n  width: \"32px\",\n  height: \"32px\",\n  borderRadius: \"50%\",\n  border: `9px solid ${theme.slider.ringColor}`,\n  opacity: theme.slider.ringOpacity,\n  content: \"''\",\n  position: \"absolute\",\n  top: \"-10px\",\n  left: \"-10px\",\n};\n\nconst border: CSSProperties = {\n  width: \"20px\",\n  height: \"20px\",\n  borderRadius: \"50%\",\n  border: `2px solid ${theme.colors.atmo1}`,\n  content: \"''\",\n  position: \"absolute\",\n  top: \"-4px\",\n  left: \"-4px\",\n};\n\nexport const sliderStyles = {\n  mark: {\n    ...theme.typography.caption1,\n    fontFamily: theme.fontFamily.body,\n    top: \"-2px\",\n    zIndex: -1,\n  },\n  disabledMark: {\n    ...theme.typography.caption1,\n    fontFamily: theme.fontFamily.body,\n    color: `${theme.colors.secondary_60}`,\n    cursor: \"not-allowed\",\n    top: \"-2px\",\n  },\n  dot: {\n    ...dot,\n  },\n  dotDisabled: {\n    ...dot,\n    cursor: \"not-allowed\",\n  },\n  knobHidden: { display: \"none\" },\n  knobHiddenLast: {\n    borderColor: \"transparent\",\n    height: \"3px\",\n    width: \"2px\",\n    marginLeft: \"-1px\",\n    border: \"none\",\n    borderRadius: \"0\",\n    marginTop: \"0px\",\n    left: \"100%\",\n    touchAction: \"none\",\n    cursor: \"default\",\n  },\n  knobInner: {\n    borderColor: \"transparent\",\n    boxShadow: \"none\",\n    backgroundColor: theme.colors.secondary,\n    width: \"16px\",\n    height: \"16px\",\n  },\n  knobOuter: {\n    position: \"relative\",\n    borderColor: \"transparent\",\n    borderRadius: \"50%\",\n    boxShadow: \"none\",\n    backgroundColor: theme.colors.atmo4,\n    width: \"32px\",\n    height: \"32px\",\n    top: \"-80%\",\n    left: \"-80%\",\n    zIndex: \"-1\",\n  },\n  track: {\n    backgroundColor: theme.colors.secondary,\n    height: \"3px\",\n    zIndex: \"-1\",\n    marginTop: \"-1px\",\n  },\n  rail: { backgroundColor: theme.colors.atmo4, height: \"1px\", zIndex: \"-3\" },\n} satisfies Record<string, CSSProperties>;\n\nexport const { staticClasses, useClasses } = createClasses(\"HvSlider\", {\n  sliderBase: { ...base },\n  rootDisabled: {\n    cursor: \"not-allowed\",\n    \"&& .rc-slider-disabled\": {\n      background: \"transparent\",\n    },\n  },\n  sliderContainer: { marginBottom: \"18px\", padding: \"0 23px\" },\n  error: { padding: \"0 8px\" },\n  trackDragging: {\n    cursor: \"grabbing\",\n\n    \"&& .rc-slider-track\": {\n      \"&::before\": {\n        ...dragSquare,\n        cursor: \"grabbing\",\n      },\n    },\n  },\n  trackStandBy: {\n    \"&& .rc-slider-track\": {\n      \"&:hover\": {\n        \"&::before\": {\n          ...dragSquare,\n        },\n      },\n    },\n  },\n  sliderRoot: { zIndex: 0 },\n  rootRange: {},\n  handleContainer: {\n    \"&& .rc-slider-handle\": {\n      cursor: \"pointer\",\n      marginTop: \"-8px\",\n      opacity: 1,\n      \"&:active\": {\n        cursor: \"grab\",\n        \"&::before\": {\n          ...ring,\n        },\n        \"&::after\": {\n          ...border,\n        },\n      },\n      \"&:hover\": {\n        \"&::before\": {\n          ...ring,\n        },\n        \"&::after\": {\n          ...border,\n        },\n      },\n\n      // Note about the usage of `!important below`: the way the rc-slider allows us to\n      // style the knobs is through inline styles. This means that the `box-shadow`, which\n      // is an inline style and is set to `none` to prevent the default rc-slider style to\n      // show, can't be overridden for the focus scenario unless we use the `!important` flag.\n      \"&:focus-visible\": {\n        ...outlineStyles,\n        boxShadow: \"0 0 0 3px #52A8EC, 0 0 0 7px rgba(29,155,209,.3)!important\",\n        \"&::after\": {\n          ...border,\n        },\n      },\n    },\n  },\n  handle: {},\n  handleContainerDisabled: {\n    \"&& .rc-slider-handle\": {\n      cursor: \"not-allowed\",\n      marginTop: \"-8px\",\n      opacity: 1,\n      \"&:active\": {\n        cursor: \"not-allowed\",\n      },\n      \"&:hover\": {\n        cursor: \"not-allowed\",\n      },\n    },\n  },\n  handleHiddenContainer: { display: \"none\" },\n  labelContainer: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    marginBottom: \"12px\",\n    marginLeft: \"20px\",\n    marginRight: \"20px\",\n  },\n  labelIncluded: { justifyContent: \"space-between\" },\n  onlyInput: { justifyContent: \"flex-end\" },\n  label: {},\n  root: {},\n  sliderTooltip: {\n    \"&& .rc-slider-tooltip-inner\": {\n      background: theme.colors.atmo1,\n      borderRadius: 0,\n      maxWidth: \"532px\",\n      height: \"100%\",\n      padding: theme.space.sm,\n      ...theme.typography.body,\n      fontFamily: theme.fontFamily.body,\n      boxShadow: \"none\",\n    },\n\n    \"&& .rc-slider-tooltip-arrow\": {\n      visibility: \"hidden\",\n    },\n  },\n});\n"],"names":["dot","position","bottom","marginLeft","width","height","border","borderRadius","backgroundColor","theme","colors","atmo4","cursor","verticalAlign","zIndex","dragSquare","left","top","content","background","borderTop","slider","dragBarColor","borderBottom","ring","ringColor","opacity","ringOpacity","atmo1","sliderStyles","mark","typography","caption1","fontFamily","body","disabledMark","color","secondary_60","dotDisabled","knobHidden","display","knobHiddenLast","borderColor","marginTop","touchAction","knobInner","boxShadow","secondary","knobOuter","track","rail","staticClasses","useClasses","createClasses","sliderBase","base","rootDisabled","sliderContainer","marginBottom","padding","error","trackDragging","trackStandBy","sliderRoot","rootRange","handleContainer","outlineStyles","handle","handleContainerDisabled","handleHiddenContainer","labelContainer","alignItems","justifyContent","marginRight","labelIncluded","onlyInput","label","root","sliderTooltip","maxWidth","space","sm","visibility"],"mappings":"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"}
+{"version":3,"file":"Slider.styles.js","sources":["../../../../src/components/Slider/Slider.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { CSSProperties } from \"react\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\nimport { createClasses } from \"@core/utils/classes\";\n\nimport base from \"./base\";\n\nconst dot: CSSProperties = {\n  position: \"absolute\",\n  bottom: \"-1px\",\n  marginLeft: \"0px\",\n  width: \"1px\",\n  height: \"4px\",\n  border: \"none\",\n  borderRadius: \"0%\",\n  backgroundColor: theme.colors.atmo4,\n  cursor: \"pointer\",\n  verticalAlign: \"middle\",\n  zIndex: \"-3\",\n};\n\nconst dragSquare: CSSProperties = {\n  cursor: \"grab\",\n  width: \"calc(100% - 40px)\",\n  left: \"20px\",\n  height: \"27px\",\n  position: \"absolute\",\n  top: \"-12px\",\n  content: \"''\",\n  background: \"transparent\",\n  borderTop: `12px solid ${theme.colors.primary_20}`,\n  borderBottom: `12px solid ${theme.colors.primary_20}`,\n  zIndex: \"-2\",\n};\n\nconst ring: CSSProperties = {\n  width: \"32px\",\n  height: \"32px\",\n  borderRadius: \"50%\",\n  border: `9px solid ${theme.colors.primary_20}`,\n  opacity: \"100%\",\n  content: \"''\",\n  position: \"absolute\",\n  top: \"-10px\",\n  left: \"-10px\",\n};\n\nconst border: CSSProperties = {\n  width: \"20px\",\n  height: \"20px\",\n  borderRadius: \"50%\",\n  border: `2px solid ${theme.colors.atmo1}`,\n  content: \"''\",\n  position: \"absolute\",\n  top: \"-4px\",\n  left: \"-4px\",\n};\n\nexport const sliderStyles = {\n  mark: {\n    ...theme.typography.caption1,\n    fontFamily: theme.fontFamily.body,\n    top: \"-2px\",\n    zIndex: -1,\n  },\n  disabledMark: {\n    ...theme.typography.caption1,\n    fontFamily: theme.fontFamily.body,\n    color: `${theme.colors.secondary_60}`,\n    cursor: \"not-allowed\",\n    top: \"-2px\",\n  },\n  dot: {\n    ...dot,\n  },\n  dotDisabled: {\n    ...dot,\n    cursor: \"not-allowed\",\n  },\n  knobHidden: { display: \"none\" },\n  knobHiddenLast: {\n    borderColor: \"transparent\",\n    height: \"3px\",\n    width: \"2px\",\n    marginLeft: \"-1px\",\n    border: \"none\",\n    borderRadius: \"0\",\n    marginTop: \"0px\",\n    left: \"100%\",\n    touchAction: \"none\",\n    cursor: \"default\",\n  },\n  knobInner: {\n    borderColor: \"transparent\",\n    boxShadow: \"none\",\n    backgroundColor: theme.colors.secondary,\n    width: \"16px\",\n    height: \"16px\",\n  },\n  knobOuter: {\n    position: \"relative\",\n    borderColor: \"transparent\",\n    borderRadius: \"50%\",\n    boxShadow: \"none\",\n    backgroundColor: theme.colors.atmo4,\n    width: \"32px\",\n    height: \"32px\",\n    top: \"-80%\",\n    left: \"-80%\",\n    zIndex: \"-1\",\n  },\n  track: {\n    backgroundColor: theme.colors.secondary,\n    height: \"3px\",\n    zIndex: \"-1\",\n    marginTop: \"-1px\",\n  },\n  rail: { backgroundColor: theme.colors.atmo4, height: \"1px\", zIndex: \"-3\" },\n} satisfies Record<string, CSSProperties>;\n\nexport const { staticClasses, useClasses } = createClasses(\"HvSlider\", {\n  sliderBase: { ...base },\n  rootDisabled: {\n    cursor: \"not-allowed\",\n    \"&& .rc-slider-disabled\": {\n      background: \"transparent\",\n    },\n  },\n  sliderContainer: { marginBottom: \"18px\", padding: \"0 23px\" },\n  error: { padding: \"0 8px\" },\n  trackDragging: {\n    cursor: \"grabbing\",\n\n    \"&& .rc-slider-track\": {\n      \"&::before\": {\n        ...dragSquare,\n        cursor: \"grabbing\",\n      },\n    },\n  },\n  trackStandBy: {\n    \"&& .rc-slider-track\": {\n      \"&:hover\": {\n        \"&::before\": {\n          ...dragSquare,\n        },\n      },\n    },\n  },\n  sliderRoot: { zIndex: 0 },\n  rootRange: {},\n  handleContainer: {\n    \"&& .rc-slider-handle\": {\n      cursor: \"pointer\",\n      marginTop: \"-8px\",\n      opacity: 1,\n      \"&:active\": {\n        cursor: \"grab\",\n        \"&::before\": {\n          ...ring,\n        },\n        \"&::after\": {\n          ...border,\n        },\n      },\n      \"&:hover\": {\n        \"&::before\": {\n          ...ring,\n        },\n        \"&::after\": {\n          ...border,\n        },\n      },\n\n      // Note about the usage of `!important below`: the way the rc-slider allows us to\n      // style the knobs is through inline styles. This means that the `box-shadow`, which\n      // is an inline style and is set to `none` to prevent the default rc-slider style to\n      // show, can't be overridden for the focus scenario unless we use the `!important` flag.\n      \"&:focus-visible\": {\n        ...outlineStyles,\n        boxShadow: \"0 0 0 3px #52A8EC, 0 0 0 7px rgba(29,155,209,.3)!important\",\n        \"&::after\": {\n          ...border,\n        },\n      },\n    },\n  },\n  handle: {},\n  handleContainerDisabled: {\n    \"&& .rc-slider-handle\": {\n      cursor: \"not-allowed\",\n      marginTop: \"-8px\",\n      opacity: 1,\n      \"&:active\": {\n        cursor: \"not-allowed\",\n      },\n      \"&:hover\": {\n        cursor: \"not-allowed\",\n      },\n    },\n  },\n  handleHiddenContainer: { display: \"none\" },\n  labelContainer: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    marginBottom: \"12px\",\n    marginLeft: \"20px\",\n    marginRight: \"20px\",\n  },\n  labelIncluded: { justifyContent: \"space-between\" },\n  onlyInput: { justifyContent: \"flex-end\" },\n  label: {},\n  root: {},\n  sliderTooltip: {\n    \"&& .rc-slider-tooltip-inner\": {\n      background: theme.colors.atmo1,\n      borderRadius: 0,\n      maxWidth: \"532px\",\n      height: \"100%\",\n      padding: theme.space.sm,\n      ...theme.typography.body,\n      fontFamily: theme.fontFamily.body,\n      boxShadow: \"none\",\n    },\n\n    \"&& .rc-slider-tooltip-arrow\": {\n      visibility: \"hidden\",\n    },\n  },\n});\n"],"names":["dot","position","bottom","marginLeft","width","height","border","borderRadius","backgroundColor","theme","colors","atmo4","cursor","verticalAlign","zIndex","dragSquare","left","top","content","background","borderTop","primary_20","borderBottom","ring","opacity","atmo1","sliderStyles","mark","typography","caption1","fontFamily","body","disabledMark","color","secondary_60","dotDisabled","knobHidden","display","knobHiddenLast","borderColor","marginTop","touchAction","knobInner","boxShadow","secondary","knobOuter","track","rail","staticClasses","useClasses","createClasses","sliderBase","base","rootDisabled","sliderContainer","marginBottom","padding","error","trackDragging","trackStandBy","sliderRoot","rootRange","handleContainer","outlineStyles","handle","handleContainerDisabled","handleHiddenContainer","labelContainer","alignItems","justifyContent","marginRight","labelIncluded","onlyInput","label","root","sliderTooltip","maxWidth","space","sm","visibility"],"mappings":"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"}

package/dist/esm/components/Snackbar/SnackbarContent/SnackbarContent.js

@@ -6,19 +6,21 @@ import { iconVariant } from "../../../utils/iconVariant.js";
 import { useTheme } from "../../../hooks/useTheme.js";
 import { useClasses } from "./SnackbarContent.styles.js";
 import { staticClasses } from "./SnackbarContent.styles.js";
+import { useDefaultProps } from "../../../hooks/useDefaultProps.js";
 import { HvActionsGeneric } from "../../ActionsGeneric/ActionsGeneric.js";
-const HvSnackbarContent = forwardRef(({
-  className,
-  id,
-  classes: classesProp,
-  label,
-  variant = "default",
-  showIcon,
-  customIcon,
-  action,
-  actionCallback,
-  ...others
-}, ref) => {
+const HvSnackbarContent = forwardRef((props, ref) => {
+  const {
+    className,
+    id,
+    classes: classesProp,
+    label,
+    variant = "default",
+    showIcon,
+    customIcon,
+    action,
+    actionCallback,
+    ...others
+  } = useDefaultProps("HvSnackbarContent", props);
   const icon = customIcon || showIcon && iconVariant(variant, "base_dark");
   const innerAction = isValidElement(action) ? action : [action];
   const {

package/dist/esm/components/Snackbar/SnackbarContent/SnackbarContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"SnackbarContent.js","sources":["../../../../../src/components/Snackbar/SnackbarContent/SnackbarContent.tsx"],"sourcesContent":["import { forwardRef, isValidElement } from \"react\";\n\nimport SnackbarContent, {\n  SnackbarContentProps as MuiSnackbarContentProps,\n} from \"@mui/material/SnackbarContent\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { iconVariant } from \"@core/utils/iconVariant\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport {\n  HvActionsGeneric,\n  HvActionGeneric,\n} from \"@core/components/ActionsGeneric\";\nimport { HvButtonVariant } from \"@core/components/Button\";\nimport { useTheme } from \"@core/hooks/useTheme\";\n\nimport { staticClasses, useClasses } from \"./SnackbarContent.styles\";\nimport { HvSnackbarVariant } from \"../types\";\n\nexport { staticClasses as snackbarContentClasses };\n\nexport type HvSnackbarContentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSnackbarContentProps\n  extends Omit<MuiSnackbarContentProps, \"variant\" | \"action\" | \"classes\">,\n    HvBaseProps {\n  /** The message to display. */\n  label?: React.ReactNode;\n  /** Variant of the snackbar. */\n  variant?: HvSnackbarVariant;\n  /** Controls if the associated icon to the variant should be shown. */\n  showIcon?: boolean;\n  /** Custom icon to replace the variant default. */\n  customIcon?: React.ReactNode;\n  /** Action to display. */\n  action?: React.ReactNode | HvActionGeneric;\n  /** The callback function ran when an action is triggered, receiving `action` as param */\n  actionCallback?: (\n    event: React.SyntheticEvent,\n    id: string,\n    action: HvActionGeneric\n  ) => void;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvSnackbarContentClasses;\n}\n\nexport const HvSnackbarContent = forwardRef<\n  HTMLDivElement,\n  HvSnackbarContentProps\n>(\n  (\n    {\n      className,\n      id,\n      classes: classesProp,\n      label,\n      variant = \"default\",\n      showIcon,\n      customIcon,\n      action,\n      actionCallback,\n      ...others\n    },\n    ref\n  ) => {\n    const icon = customIcon || (showIcon && iconVariant(variant, \"base_dark\"));\n    const innerAction: any = isValidElement(action) ? action : [action];\n\n    const { classes, cx } = useClasses(classesProp);\n    const { activeTheme } = useTheme();\n\n    return (\n      <SnackbarContent\n        ref={ref}\n        id={id}\n        classes={{\n          root: classes.root,\n          message: classes.message,\n        }}\n        className={cx(classes?.[variant], className)}\n        message={\n          <div id={setId(id, \"message\")} className={classes.messageSpan}>\n            {icon && <div className={classes.iconVariant}>{icon}</div>}\n            <div className={classes.messageText}>{label}</div>\n            {action && (\n              <div id={setId(id, \"action\")} className={classes.action}>\n                <HvActionsGeneric\n                  id={id}\n                  category={\n                    activeTheme?.snackbar.actionButtonVariant as HvButtonVariant\n                  }\n                  actions={innerAction}\n                  actionsCallback={actionCallback}\n                />\n              </div>\n            )}\n          </div>\n        }\n        {...others}\n      />\n    );\n  }\n);\n"],"names":["HvSnackbarContent","forwardRef","className","id","classes","classesProp","label","variant","showIcon","customIcon","action","actionCallback","others","ref","icon","iconVariant","innerAction","isValidElement","cx","useClasses","activeTheme","useTheme","root","message","setId","messageSpan","messageText","snackbar","actionButtonVariant"],"mappings":";;;;;;;;;AA+CaA,MAAAA,oBAAoBC,WAI/B,CACE;AAAA,EACEC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC,UAAU;AAAA,EACVC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACL,GACAC,QACG;AACH,QAAMC,OAAOL,cAAeD,YAAYO,YAAYR,SAAS,WAAW;AACxE,QAAMS,cAAmBC,eAAeP,MAAM,IAAIA,SAAS,CAACA,MAAM;AAE5D,QAAA;AAAA,IAAEN;AAAAA,IAASc;AAAAA,EAAAA,IAAOC,WAAWd,WAAW;AACxC,QAAA;AAAA,IAAEe;AAAAA,MAAgBC,SAAS;AAEjC,SACG,oBAAA,iBAAA,EACC,KACA,IACA,SAAS;AAAA,IACPC,MAAMlB,QAAQkB;AAAAA,IACdC,SAASnB,QAAQmB;AAAAA,EAAAA,GAEnB,WAAWL,GAAGd,mCAAUG,UAAUL,SAAS,GAC3C,SACG,qBAAA,OAAA,EAAI,IAAIsB,MAAMrB,IAAI,SAAS,GAAG,WAAWC,QAAQqB,aAC/CX,UAAAA;AAAAA,IAAAA,QAAS,oBAAA,OAAA,EAAI,WAAWV,QAAQW,aAAcD,UAAK,MAAA;AAAA,IACnD,oBAAA,OAAA,EAAI,WAAWV,QAAQsB,aAAcpB,UAAM,OAAA;AAAA,IAC3CI,8BACE,OAAI,EAAA,IAAIc,MAAMrB,IAAI,QAAQ,GAAG,WAAWC,QAAQM,QAC/C,8BAAC,kBACC,EAAA,IACA,UACEU,2CAAaO,SAASC,qBAExB,SAASZ,aACT,iBAAiBL,eAAAA,CAAe,EAEpC,CAAA;AAAA,EAAA,GAEJ,GAEEC,GAAAA,OACJ,CAAA;AAEN,CACF;"}
+{"version":3,"file":"SnackbarContent.js","sources":["../../../../../src/components/Snackbar/SnackbarContent/SnackbarContent.tsx"],"sourcesContent":["import { forwardRef, isValidElement } from \"react\";\n\nimport SnackbarContent, {\n  SnackbarContentProps as MuiSnackbarContentProps,\n} from \"@mui/material/SnackbarContent\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { iconVariant } from \"@core/utils/iconVariant\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport {\n  HvActionsGeneric,\n  HvActionGeneric,\n} from \"@core/components/ActionsGeneric\";\nimport { HvButtonVariant } from \"@core/components/Button\";\nimport { useTheme } from \"@core/hooks/useTheme\";\n\nimport { useDefaultProps } from \"@core/hooks\";\nimport { staticClasses, useClasses } from \"./SnackbarContent.styles\";\nimport { HvSnackbarVariant } from \"../types\";\n\nexport { staticClasses as snackbarContentClasses };\n\nexport type HvSnackbarContentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSnackbarContentProps\n  extends Omit<MuiSnackbarContentProps, \"variant\" | \"action\" | \"classes\">,\n    HvBaseProps {\n  /** The message to display. */\n  label?: React.ReactNode;\n  /** Variant of the snackbar. */\n  variant?: HvSnackbarVariant;\n  /** Controls if the associated icon to the variant should be shown. */\n  showIcon?: boolean;\n  /** Custom icon to replace the variant default. */\n  customIcon?: React.ReactNode;\n  /** Action to display. */\n  action?: React.ReactNode | HvActionGeneric;\n  /** The callback function ran when an action is triggered, receiving `action` as param */\n  actionCallback?: (\n    event: React.SyntheticEvent,\n    id: string,\n    action: HvActionGeneric\n  ) => void;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvSnackbarContentClasses;\n}\n\nexport const HvSnackbarContent = forwardRef<\n  HTMLDivElement,\n  HvSnackbarContentProps\n>((props: HvSnackbarContentProps, ref) => {\n  const {\n    className,\n    id,\n    classes: classesProp,\n    label,\n    variant = \"default\",\n    showIcon,\n    customIcon,\n    action,\n    actionCallback,\n    ...others\n  } = useDefaultProps(\"HvSnackbarContent\", props);\n\n  const icon = customIcon || (showIcon && iconVariant(variant, \"base_dark\"));\n  const innerAction: any = isValidElement(action) ? action : [action];\n\n  const { classes, cx } = useClasses(classesProp);\n  const { activeTheme } = useTheme();\n\n  return (\n    <SnackbarContent\n      ref={ref}\n      id={id}\n      classes={{\n        root: classes.root,\n        message: classes.message,\n      }}\n      className={cx(classes?.[variant], className)}\n      message={\n        <div id={setId(id, \"message\")} className={classes.messageSpan}>\n          {icon && <div className={classes.iconVariant}>{icon}</div>}\n          <div className={classes.messageText}>{label}</div>\n          {action && (\n            <div id={setId(id, \"action\")} className={classes.action}>\n              <HvActionsGeneric\n                id={id}\n                category={\n                  activeTheme?.snackbar.actionButtonVariant as HvButtonVariant\n                }\n                actions={innerAction}\n                actionsCallback={actionCallback}\n              />\n            </div>\n          )}\n        </div>\n      }\n      {...others}\n    />\n  );\n});\n"],"names":["HvSnackbarContent","forwardRef","props","ref","className","id","classes","classesProp","label","variant","showIcon","customIcon","action","actionCallback","others","useDefaultProps","icon","iconVariant","innerAction","isValidElement","cx","useClasses","activeTheme","useTheme","root","message","setId","messageSpan","messageText","snackbar","actionButtonVariant"],"mappings":";;;;;;;;;;AAgDO,MAAMA,oBAAoBC,WAG/B,CAACC,OAA+BC,QAAQ;AAClC,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC,UAAU;AAAA,IACVC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,qBAAqBb,KAAK;AAE9C,QAAMc,OAAOL,cAAeD,YAAYO,YAAYR,SAAS,WAAW;AACxE,QAAMS,cAAmBC,eAAeP,MAAM,IAAIA,SAAS,CAACA,MAAM;AAE5D,QAAA;AAAA,IAAEN;AAAAA,IAASc;AAAAA,EAAAA,IAAOC,WAAWd,WAAW;AACxC,QAAA;AAAA,IAAEe;AAAAA,MAAgBC,SAAS;AAEjC,SACG,oBAAA,iBAAA,EACC,KACA,IACA,SAAS;AAAA,IACPC,MAAMlB,QAAQkB;AAAAA,IACdC,SAASnB,QAAQmB;AAAAA,EAAAA,GAEnB,WAAWL,GAAGd,mCAAUG,UAAUL,SAAS,GAC3C,SACG,qBAAA,OAAA,EAAI,IAAIsB,MAAMrB,IAAI,SAAS,GAAG,WAAWC,QAAQqB,aAC/CX,UAAAA;AAAAA,IAAAA,QAAS,oBAAA,OAAA,EAAI,WAAWV,QAAQW,aAAcD,UAAK,MAAA;AAAA,IACnD,oBAAA,OAAA,EAAI,WAAWV,QAAQsB,aAAcpB,UAAM,OAAA;AAAA,IAC3CI,8BACE,OAAI,EAAA,IAAIc,MAAMrB,IAAI,QAAQ,GAAG,WAAWC,QAAQM,QAC/C,8BAAC,kBACC,EAAA,IACA,UACEU,2CAAaO,SAASC,qBAExB,SAASZ,aACT,iBAAiBL,eAAAA,CAAe,EAEpC,CAAA;AAAA,EAAA,GAEJ,GAEEC,GAAAA,OACJ,CAAA;AAEN,CAAC;"}

package/dist/esm/components/Snackbar/SnackbarContent/SnackbarContent.styles.js

@@ -48,7 +48,7 @@ const {
   action: {
     textAlign: "right",
     paddingLeft: theme.space.xs,
-    marginLeft: theme.snackbar.actionMarginLeft,
+    marginLeft: "auto",
     [`& .${staticClasses$1.button}`]: {
       borderColor: theme.colors.base_dark,
       color: theme.colors.base_dark,

package/dist/esm/components/Snackbar/SnackbarContent/SnackbarContent.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"SnackbarContent.styles.js","sources":["../../../../../src/components/Snackbar/SnackbarContent/SnackbarContent.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\nimport { actionsGenericClasses } from \"@core/components/ActionsGeneric\";\n\nexport const { useClasses, staticClasses } = createClasses(\n  \"HvSnackbar-Content\",\n  {\n    root: {\n      width: \"310px\",\n      minHeight: \"52px\",\n      maxHeight: \"92px\",\n      padding: theme.space.xs,\n      boxShadow: \"none\",\n    },\n    success: {\n      backgroundColor: theme.colors.positive_20,\n    },\n    error: {\n      backgroundColor: theme.colors.negative_20,\n    },\n    default: {\n      backgroundColor: theme.colors.neutral_20,\n    },\n    warning: {\n      backgroundColor: theme.colors.warning_20,\n    },\n    message: {\n      padding: 0,\n      width: \"100%\",\n    },\n    messageSpan: {\n      display: \"flex\",\n      alignItems: \"center\",\n      minHeight: \"32px\",\n    },\n    messageText: {\n      paddingLeft: theme.space.xs,\n      color: theme.colors.base_dark,\n      fontFamily: theme.fontFamily.body,\n      maxHeight: \"72px\",\n      wordBreak: \"break-word\",\n      textWrap: \"balance\",\n      overflow: \"hidden\",\n    },\n    action: {\n      textAlign: \"right\",\n      paddingLeft: theme.space.xs,\n      marginLeft: theme.snackbar.actionMarginLeft,\n      [`& .${actionsGenericClasses.button}`]: {\n        borderColor: theme.colors.base_dark,\n        color: theme.colors.base_dark,\n        \"&:hover\": {\n          borderColor: theme.colors.base_dark,\n        },\n      },\n    },\n    iconVariant: {},\n  }\n);\n"],"names":["useClasses","staticClasses","createClasses","root","width","minHeight","maxHeight","padding","theme","space","xs","boxShadow","success","backgroundColor","colors","positive_20","error","negative_20","default","neutral_20","warning","warning_20","message","messageSpan","display","alignItems","messageText","paddingLeft","color","base_dark","fontFamily","body","wordBreak","textWrap","overflow","action","textAlign","marginLeft","snackbar","actionMarginLeft","actionsGenericClasses","button","borderColor","iconVariant"],"mappings":";;;;;;AAKa,MAAA;AAAA,EAAEA;AAAAA,EAAYC;AAAc,IAAIC,cAC3C,sBACA;AAAA,EACEC,MAAM;AAAA,IACJC,OAAO;AAAA,IACPC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC,SAASC,MAAMC,MAAMC;AAAAA,IACrBC,WAAW;AAAA,EACb;AAAA,EACAC,SAAS;AAAA,IACPC,iBAAiBL,MAAMM,OAAOC;AAAAA,EAChC;AAAA,EACAC,OAAO;AAAA,IACLH,iBAAiBL,MAAMM,OAAOG;AAAAA,EAChC;AAAA,EACAC,SAAS;AAAA,IACPL,iBAAiBL,MAAMM,OAAOK;AAAAA,EAChC;AAAA,EACAC,SAAS;AAAA,IACPP,iBAAiBL,MAAMM,OAAOO;AAAAA,EAChC;AAAA,EACAC,SAAS;AAAA,IACPf,SAAS;AAAA,IACTH,OAAO;AAAA,EACT;AAAA,EACAmB,aAAa;AAAA,IACXC,SAAS;AAAA,IACTC,YAAY;AAAA,IACZpB,WAAW;AAAA,EACb;AAAA,EACAqB,aAAa;AAAA,IACXC,aAAanB,MAAMC,MAAMC;AAAAA,IACzBkB,OAAOpB,MAAMM,OAAOe;AAAAA,IACpBC,YAAYtB,MAAMsB,WAAWC;AAAAA,IAC7BzB,WAAW;AAAA,IACX0B,WAAW;AAAA,IACXC,UAAU;AAAA,IACVC,UAAU;AAAA,EACZ;AAAA,EACAC,QAAQ;AAAA,IACNC,WAAW;AAAA,IACXT,aAAanB,MAAMC,MAAMC;AAAAA,IACzB2B,YAAY7B,MAAM8B,SAASC;AAAAA,IAC3B,CAAE,MAAKC,gBAAsBC,MAAO,EAAC,GAAG;AAAA,MACtCC,aAAalC,MAAMM,OAAOe;AAAAA,MAC1BD,OAAOpB,MAAMM,OAAOe;AAAAA,MACpB,WAAW;AAAA,QACTa,aAAalC,MAAMM,OAAOe;AAAAA,MAC5B;AAAA,IACF;AAAA,EACF;AAAA,EACAc,aAAa,CAAC;AAChB,CACF;"}
+{"version":3,"file":"SnackbarContent.styles.js","sources":["../../../../../src/components/Snackbar/SnackbarContent/SnackbarContent.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\nimport { actionsGenericClasses } from \"@core/components/ActionsGeneric\";\n\nexport const { useClasses, staticClasses } = createClasses(\n  \"HvSnackbar-Content\",\n  {\n    root: {\n      width: \"310px\",\n      minHeight: \"52px\",\n      maxHeight: \"92px\",\n      padding: theme.space.xs,\n      boxShadow: \"none\",\n    },\n    success: {\n      backgroundColor: theme.colors.positive_20,\n    },\n    error: {\n      backgroundColor: theme.colors.negative_20,\n    },\n    default: {\n      backgroundColor: theme.colors.neutral_20,\n    },\n    warning: {\n      backgroundColor: theme.colors.warning_20,\n    },\n    message: {\n      padding: 0,\n      width: \"100%\",\n    },\n    messageSpan: {\n      display: \"flex\",\n      alignItems: \"center\",\n      minHeight: \"32px\",\n    },\n    messageText: {\n      paddingLeft: theme.space.xs,\n      color: theme.colors.base_dark,\n      fontFamily: theme.fontFamily.body,\n      maxHeight: \"72px\",\n      wordBreak: \"break-word\",\n      textWrap: \"balance\",\n      overflow: \"hidden\",\n    },\n    action: {\n      textAlign: \"right\",\n      paddingLeft: theme.space.xs,\n      marginLeft: \"auto\",\n      [`& .${actionsGenericClasses.button}`]: {\n        borderColor: theme.colors.base_dark,\n        color: theme.colors.base_dark,\n        \"&:hover\": {\n          borderColor: theme.colors.base_dark,\n        },\n      },\n    },\n    iconVariant: {},\n  }\n);\n"],"names":["useClasses","staticClasses","createClasses","root","width","minHeight","maxHeight","padding","theme","space","xs","boxShadow","success","backgroundColor","colors","positive_20","error","negative_20","default","neutral_20","warning","warning_20","message","messageSpan","display","alignItems","messageText","paddingLeft","color","base_dark","fontFamily","body","wordBreak","textWrap","overflow","action","textAlign","marginLeft","actionsGenericClasses","button","borderColor","iconVariant"],"mappings":";;;;;;AAKa,MAAA;AAAA,EAAEA;AAAAA,EAAYC;AAAc,IAAIC,cAC3C,sBACA;AAAA,EACEC,MAAM;AAAA,IACJC,OAAO;AAAA,IACPC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC,SAASC,MAAMC,MAAMC;AAAAA,IACrBC,WAAW;AAAA,EACb;AAAA,EACAC,SAAS;AAAA,IACPC,iBAAiBL,MAAMM,OAAOC;AAAAA,EAChC;AAAA,EACAC,OAAO;AAAA,IACLH,iBAAiBL,MAAMM,OAAOG;AAAAA,EAChC;AAAA,EACAC,SAAS;AAAA,IACPL,iBAAiBL,MAAMM,OAAOK;AAAAA,EAChC;AAAA,EACAC,SAAS;AAAA,IACPP,iBAAiBL,MAAMM,OAAOO;AAAAA,EAChC;AAAA,EACAC,SAAS;AAAA,IACPf,SAAS;AAAA,IACTH,OAAO;AAAA,EACT;AAAA,EACAmB,aAAa;AAAA,IACXC,SAAS;AAAA,IACTC,YAAY;AAAA,IACZpB,WAAW;AAAA,EACb;AAAA,EACAqB,aAAa;AAAA,IACXC,aAAanB,MAAMC,MAAMC;AAAAA,IACzBkB,OAAOpB,MAAMM,OAAOe;AAAAA,IACpBC,YAAYtB,MAAMsB,WAAWC;AAAAA,IAC7BzB,WAAW;AAAA,IACX0B,WAAW;AAAA,IACXC,UAAU;AAAA,IACVC,UAAU;AAAA,EACZ;AAAA,EACAC,QAAQ;AAAA,IACNC,WAAW;AAAA,IACXT,aAAanB,MAAMC,MAAMC;AAAAA,IACzB2B,YAAY;AAAA,IACZ,CAAE,MAAKC,gBAAsBC,MAAO,EAAC,GAAG;AAAA,MACtCC,aAAahC,MAAMM,OAAOe;AAAAA,MAC1BD,OAAOpB,MAAMM,OAAOe;AAAAA,MACpB,WAAW;AAAA,QACTW,aAAahC,MAAMM,OAAOe;AAAAA,MAC5B;AAAA,IACF;AAAA,EACF;AAAA,EACAY,aAAa,CAAC;AAChB,CACF;"}

package/dist/esm/components/Switch/Switch.styles.js

@@ -21,7 +21,7 @@ const {
     borderBottom: "1px solid transparent"
   },
   invalidSwitch: {
-    paddingBottom: theme.switch.invalidPaddingBottom,
+    paddingBottom: "1px",
     borderBottom: `1px solid ${theme.colors.negative}`
   }
 });

package/dist/esm/components/Switch/Switch.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.styles.js","sources":["../../../../src/components/Switch/Switch.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvSwitch\", {\n  root: {\n    display: \"inline-flex\",\n    flexDirection: \"column\",\n    alignItems: \"flex-start\",\n  },\n  label: { marginBottom: theme.space.xs },\n  error: {},\n  switchContainer: {\n    height: \"32px\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    justifyContent: \"center\",\n    borderBottom: \"1px solid transparent\",\n  },\n  invalidSwitch: {\n    paddingBottom: theme.switch.invalidPaddingBottom,\n    borderBottom: `1px solid ${theme.colors.negative}`,\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","flexDirection","alignItems","label","marginBottom","theme","space","xs","error","switchContainer","height","justifyContent","borderBottom","invalidSwitch","paddingBottom","switch","invalidPaddingBottom","colors","negative"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,YAAY;AAAA,EACrEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,YAAY;AAAA,EACd;AAAA,EACAC,OAAO;AAAA,IAAEC,cAAcC,MAAMC,MAAMC;AAAAA,EAAG;AAAA,EACtCC,OAAO,CAAC;AAAA,EACRC,iBAAiB;AAAA,IACfC,QAAQ;AAAA,IACRV,SAAS;AAAA,IACTC,eAAe;AAAA,IACfU,gBAAgB;AAAA,IAChBC,cAAc;AAAA,EAChB;AAAA,EACAC,eAAe;AAAA,IACbC,eAAeT,MAAMU,OAAOC;AAAAA,IAC5BJ,cAAe,aAAYP,MAAMY,OAAOC,QAAS;AAAA,EACnD;AACF,CAAC;"}
+{"version":3,"file":"Switch.styles.js","sources":["../../../../src/components/Switch/Switch.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvSwitch\", {\n  root: {\n    display: \"inline-flex\",\n    flexDirection: \"column\",\n    alignItems: \"flex-start\",\n  },\n  label: { marginBottom: theme.space.xs },\n  error: {},\n  switchContainer: {\n    height: \"32px\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    justifyContent: \"center\",\n    borderBottom: \"1px solid transparent\",\n  },\n  invalidSwitch: {\n    paddingBottom: \"1px\",\n    borderBottom: `1px solid ${theme.colors.negative}`,\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","flexDirection","alignItems","label","marginBottom","theme","space","xs","error","switchContainer","height","justifyContent","borderBottom","invalidSwitch","paddingBottom","colors","negative"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,YAAY;AAAA,EACrEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,YAAY;AAAA,EACd;AAAA,EACAC,OAAO;AAAA,IAAEC,cAAcC,MAAMC,MAAMC;AAAAA,EAAG;AAAA,EACtCC,OAAO,CAAC;AAAA,EACRC,iBAAiB;AAAA,IACfC,QAAQ;AAAA,IACRV,SAAS;AAAA,IACTC,eAAe;AAAA,IACfU,gBAAgB;AAAA,IAChBC,cAAc;AAAA,EAChB;AAAA,EACAC,eAAe;AAAA,IACbC,eAAe;AAAA,IACfF,cAAe,aAAYP,MAAMU,OAAOC,QAAS;AAAA,EACnD;AACF,CAAC;"}

package/dist/esm/components/Tab/Tab.styles.js

@@ -7,18 +7,18 @@ const {
 } = createClasses("HvTab", {
   root: {
     marginTop: "3px",
-    padding: theme.tab.padding,
+    padding: "0 16px",
     minWidth: 70,
     minHeight: 32,
     textTransform: "none",
     fontFamily: theme.fontFamily.body,
     ...theme.typography.body,
     "&:hover": {
-      backgroundColor: theme.tab.hoverBackgroundColor,
-      borderRadius: theme.tab.hoverBackgroundBorderRadius,
+      backgroundColor: theme.colors.containerBackgroundHover,
+      borderRadius: theme.radii.base,
       "&::after": {
         height: "1px",
-        backgroundColor: theme.tab.hoverUnderlineBackgroundColor
+        backgroundColor: theme.colors.atmo4
       }
     },
     "&$selected": {

package/dist/esm/components/Tab/Tab.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.styles.js","sources":["../../../../src/components/Tab/Tab.styles.tsx"],"sourcesContent":["import { CSSProperties } from \"react\";\nimport { createClasses } from \"@core/utils/classes\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { outlineStyles } from \"@core/utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTab\", {\n  root: {\n    marginTop: \"3px\",\n    padding: theme.tab.padding,\n    minWidth: 70,\n    minHeight: 32,\n    textTransform: \"none\",\n    fontFamily: theme.fontFamily.body,\n    ...(theme.typography.body as CSSProperties),\n    \"&:hover\": {\n      backgroundColor: theme.tab.hoverBackgroundColor,\n      borderRadius: theme.tab.hoverBackgroundBorderRadius,\n      \"&::after\": {\n        height: \"1px\",\n        backgroundColor: theme.tab.hoverUnderlineBackgroundColor,\n      },\n    },\n    \"&$selected\": {\n      color: theme.typography.label.color,\n      fontWeight: theme.typography.label.fontWeight,\n      lineHeight: theme.typography.label.lineHeight,\n      letterSpacing: theme.typography.label.letterSpacing,\n    },\n    \"&$disabled\": {\n      color: theme.colors.secondary_60,\n      cursor: \"not-allowed\",\n      pointerEvents: \"all\",\n      opacity: 1,\n      \"&:hover\": {\n        background: \"none\",\n      },\n    },\n    opacity: 1,\n    \"&::after\": {\n      position: \"absolute\",\n      left: 0,\n      top: \"calc(100% - 1px)\",\n      height: \"1px\",\n      width: \"100%\",\n      backgroundColor: theme.colors.atmo4,\n      content: \"''\",\n    },\n    // Override Mui styling: https://mui.com/material-ui/api/tab/#css\n    \"& .MuiTab-iconWrapper\": {\n      margin: 0,\n    },\n  },\n  focusVisible: {\n    ...outlineStyles,\n  },\n  selected: {},\n  disabled: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","root","marginTop","padding","theme","tab","minWidth","minHeight","textTransform","fontFamily","body","typography","backgroundColor","hoverBackgroundColor","borderRadius","hoverBackgroundBorderRadius","height","hoverUnderlineBackgroundColor","color","label","fontWeight","lineHeight","letterSpacing","colors","secondary_60","cursor","pointerEvents","opacity","background","position","left","top","width","atmo4","content","margin","focusVisible","outlineStyles","selected","disabled"],"mappings":";;;AAKa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,SAAS;AAAA,EAClEC,MAAM;AAAA,IACJC,WAAW;AAAA,IACXC,SAASC,MAAMC,IAAIF;AAAAA,IACnBG,UAAU;AAAA,IACVC,WAAW;AAAA,IACXC,eAAe;AAAA,IACfC,YAAYL,MAAMK,WAAWC;AAAAA,IAC7B,GAAIN,MAAMO,WAAWD;AAAAA,IACrB,WAAW;AAAA,MACTE,iBAAiBR,MAAMC,IAAIQ;AAAAA,MAC3BC,cAAcV,MAAMC,IAAIU;AAAAA,MACxB,YAAY;AAAA,QACVC,QAAQ;AAAA,QACRJ,iBAAiBR,MAAMC,IAAIY;AAAAA,MAC7B;AAAA,IACF;AAAA,IACA,cAAc;AAAA,MACZC,OAAOd,MAAMO,WAAWQ,MAAMD;AAAAA,MAC9BE,YAAYhB,MAAMO,WAAWQ,MAAMC;AAAAA,MACnCC,YAAYjB,MAAMO,WAAWQ,MAAME;AAAAA,MACnCC,eAAelB,MAAMO,WAAWQ,MAAMG;AAAAA,IACxC;AAAA,IACA,cAAc;AAAA,MACZJ,OAAOd,MAAMmB,OAAOC;AAAAA,MACpBC,QAAQ;AAAA,MACRC,eAAe;AAAA,MACfC,SAAS;AAAA,MACT,WAAW;AAAA,QACTC,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IACAD,SAAS;AAAA,IACT,YAAY;AAAA,MACVE,UAAU;AAAA,MACVC,MAAM;AAAA,MACNC,KAAK;AAAA,MACLf,QAAQ;AAAA,MACRgB,OAAO;AAAA,MACPpB,iBAAiBR,MAAMmB,OAAOU;AAAAA,MAC9BC,SAAS;AAAA,IACX;AAAA;AAAA,IAEA,yBAAyB;AAAA,MACvBC,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACAC,cAAc;AAAA,IACZ,GAAGC;AAAAA,EACL;AAAA,EACAC,UAAU,CAAC;AAAA,EACXC,UAAU,CAAC;AACb,CAAC;"}
+{"version":3,"file":"Tab.styles.js","sources":["../../../../src/components/Tab/Tab.styles.tsx"],"sourcesContent":["import { CSSProperties } from \"react\";\nimport { createClasses } from \"@core/utils/classes\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { outlineStyles } from \"@core/utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTab\", {\n  root: {\n    marginTop: \"3px\",\n    padding: \"0 16px\",\n    minWidth: 70,\n    minHeight: 32,\n    textTransform: \"none\",\n    fontFamily: theme.fontFamily.body,\n    ...(theme.typography.body as CSSProperties),\n    \"&:hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n      borderRadius: theme.radii.base,\n      \"&::after\": {\n        height: \"1px\",\n        backgroundColor: theme.colors.atmo4,\n      },\n    },\n    \"&$selected\": {\n      color: theme.typography.label.color,\n      fontWeight: theme.typography.label.fontWeight,\n      lineHeight: theme.typography.label.lineHeight,\n      letterSpacing: theme.typography.label.letterSpacing,\n    },\n    \"&$disabled\": {\n      color: theme.colors.secondary_60,\n      cursor: \"not-allowed\",\n      pointerEvents: \"all\",\n      opacity: 1,\n      \"&:hover\": {\n        background: \"none\",\n      },\n    },\n    opacity: 1,\n    \"&::after\": {\n      position: \"absolute\",\n      left: 0,\n      top: \"calc(100% - 1px)\",\n      height: \"1px\",\n      width: \"100%\",\n      backgroundColor: theme.colors.atmo4,\n      content: \"''\",\n    },\n    // Override Mui styling: https://mui.com/material-ui/api/tab/#css\n    \"& .MuiTab-iconWrapper\": {\n      margin: 0,\n    },\n  },\n  focusVisible: {\n    ...outlineStyles,\n  },\n  selected: {},\n  disabled: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","root","marginTop","padding","minWidth","minHeight","textTransform","fontFamily","theme","body","typography","backgroundColor","colors","containerBackgroundHover","borderRadius","radii","base","height","atmo4","color","label","fontWeight","lineHeight","letterSpacing","secondary_60","cursor","pointerEvents","opacity","background","position","left","top","width","content","margin","focusVisible","outlineStyles","selected","disabled"],"mappings":";;;AAKa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,SAAS;AAAA,EAClEC,MAAM;AAAA,IACJC,WAAW;AAAA,IACXC,SAAS;AAAA,IACTC,UAAU;AAAA,IACVC,WAAW;AAAA,IACXC,eAAe;AAAA,IACfC,YAAYC,MAAMD,WAAWE;AAAAA,IAC7B,GAAID,MAAME,WAAWD;AAAAA,IACrB,WAAW;AAAA,MACTE,iBAAiBH,MAAMI,OAAOC;AAAAA,MAC9BC,cAAcN,MAAMO,MAAMC;AAAAA,MAC1B,YAAY;AAAA,QACVC,QAAQ;AAAA,QACRN,iBAAiBH,MAAMI,OAAOM;AAAAA,MAChC;AAAA,IACF;AAAA,IACA,cAAc;AAAA,MACZC,OAAOX,MAAME,WAAWU,MAAMD;AAAAA,MAC9BE,YAAYb,MAAME,WAAWU,MAAMC;AAAAA,MACnCC,YAAYd,MAAME,WAAWU,MAAME;AAAAA,MACnCC,eAAef,MAAME,WAAWU,MAAMG;AAAAA,IACxC;AAAA,IACA,cAAc;AAAA,MACZJ,OAAOX,MAAMI,OAAOY;AAAAA,MACpBC,QAAQ;AAAA,MACRC,eAAe;AAAA,MACfC,SAAS;AAAA,MACT,WAAW;AAAA,QACTC,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IACAD,SAAS;AAAA,IACT,YAAY;AAAA,MACVE,UAAU;AAAA,MACVC,MAAM;AAAA,MACNC,KAAK;AAAA,MACLd,QAAQ;AAAA,MACRe,OAAO;AAAA,MACPrB,iBAAiBH,MAAMI,OAAOM;AAAAA,MAC9Be,SAAS;AAAA,IACX;AAAA;AAAA,IAEA,yBAAyB;AAAA,MACvBC,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACAC,cAAc;AAAA,IACZ,GAAGC;AAAAA,EACL;AAAA,EACAC,UAAU,CAAC;AAAA,EACXC,UAAU,CAAC;AACb,CAAC;"}

package/dist/esm/components/Table/TableCell/TableCell.js

@@ -9,6 +9,7 @@ import { useTheme } from "../../../hooks/useTheme.js";
 import TableContext from "../TableContext.js";
 import TableSectionContext from "../TableSectionContext.js";
 import { useClasses, staticClasses } from "./TableCell.styles.js";
+import { useDefaultProps } from "../../../hooks/useDefaultProps.js";
 const defaultComponent = "td";
 const getSortedColor = (color, alpha) => {
   return checkValidHexColorValue(color) && alpha ? hexToRgbA(color, parseFloat(alpha)) : color;
@@ -33,7 +34,7 @@ const HvTableCell = forwardRef((props, externalRef) => {
     resizable = false,
     resizing = false,
     ...others
-  } = props;
+  } = useDefaultProps("HvTableCell", props);
   const {
     classes,
     cx,

package/dist/esm/components/Table/TableCell/TableCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.js","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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"}
+{"version":3,"file":"TableCell.js","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 { useDefaultProps } from \"@core/hooks\";\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    } = useDefaultProps(\"HvTableCell\", 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","useDefaultProps","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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"}