@hitachivantara/uikit-react-core 4.4.3 → 5.0.0-next.10

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

@@ -0,0 +1,7 @@
+import { getClasses } from "../../utils/classes.js";
+const classKeys = ["root", "anchorOriginTopRight", "anchorOriginTopLeft", "anchorOriginTopCenter", "anchorOriginBottomCenter", "anchorOriginBottomLeft", "anchorOriginBottomRight"];
+const snackbarClasses = getClasses(classKeys, "HvSnackbar");
+export {
+  snackbarClasses
+};
+//# sourceMappingURL=snackbarClasses.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"snackbarClasses.js","sources":["../../../../src/components/Snackbar/snackbarClasses.ts"],"sourcesContent":["import { getClasses } from \"utils\";\n\nexport type HvSnackbarClasses = {\n  root?: string;\n  /** Styles applied to the component when define as top right.  */\n  anchorOriginTopRight?: string;\n  /** Styles applied to the component when define as top left.  */\n  anchorOriginTopLeft?: string;\n  /** Styles applied to the component when define as top center.  */\n  anchorOriginTopCenter?: string;\n  /** Styles applied to the component when define as bottom center.  */\n  anchorOriginBottomCenter?: string;\n  /** Styles applied to the component when define as bottom left.  */\n  anchorOriginBottomLeft?: string;\n  /** Styles applied to the component when define as bottom right.  */\n  anchorOriginBottomRight?: string;\n};\n\nconst classKeys: string[] = [\n  \"root\",\n  \"anchorOriginTopRight\",\n  \"anchorOriginTopLeft\",\n  \"anchorOriginTopCenter\",\n  \"anchorOriginBottomCenter\",\n  \"anchorOriginBottomLeft\",\n  \"anchorOriginBottomRight\",\n];\n\nexport const snackbarClasses = getClasses<HvSnackbarClasses>(\n  classKeys,\n  \"HvSnackbar\"\n);\n"],"names":["classKeys","snackbarClasses","getClasses"],"mappings":";AAkBA,MAAMA,YAAsB,CAC1B,QACA,wBACA,uBACA,yBACA,4BACA,0BACA,yBAAyB;AAGdC,MAAAA,kBAAkBC,WAC7BF,WACA,YAAY;"}

package/dist/esm/components/Stack/Stack.js

@@ -0,0 +1,56 @@
+import { jsx, jsxs, Fragment } from "@emotion/react/jsx-runtime";
+import React__default, { useRef, useMemo, useCallback } from "react";
+import { useTheme } from "@mui/material/styles";
+import MuiDivider from "@mui/material/Divider";
+import clsx from "clsx";
+import isString from "lodash/isString";
+import isBoolean from "lodash/isBoolean";
+import { StyledRoot } from "./Stack.styles.js";
+import "@hitachivantara/uikit-styles";
+import stackClasses from "./stackClasses.js";
+import { useWidth } from "../../hooks/useWidth.js";
+import { HvFocus } from "../Focus/Focus.js";
+const getDirection = (direction, width, breakpoints) => {
+  if (isString(direction))
+    return direction;
+  for (let i = breakpoints.indexOf(width); i >= 0; i -= 1) {
+    if (direction[breakpoints[i]] !== void 0) {
+      return direction[breakpoints[i]];
+    }
+  }
+  return "column";
+};
+const HvStack = ({
+  classes,
+  className,
+  children,
+  direction = "column",
+  spacing = "sm",
+  divider = false,
+  withNavigation = false,
+  dividerProps = {},
+  ...others
+}) => {
+  const width = useWidth();
+  const containerRef = useRef(null);
+  const {
+    breakpoints
+  } = useTheme();
+  const processedDirection = useMemo(() => getDirection(direction, width, breakpoints.keys), [direction, width, breakpoints]);
+  const getDividerComponent = useCallback(() => {
+    if (isBoolean(divider) && divider) {
+      return /* @__PURE__ */ jsx(MuiDivider, { orientation: processedDirection === "column" ? "horizontal" : "vertical", flexItem: processedDirection === "row", role: "separator", ...dividerProps });
+    }
+    return divider;
+  }, [divider, dividerProps, processedDirection]);
+  return /* @__PURE__ */ jsx(StyledRoot, { ref: containerRef, className: clsx(className, stackClasses.root, classes == null ? void 0 : classes.root), $direction: processedDirection, $breakpoint: spacing, ...others, children: React__default.Children.map(children, (child, i) => {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      divider && i !== 0 && getDividerComponent(),
+      withNavigation ? /* @__PURE__ */ jsx(HvFocus, { rootRef: containerRef, focusDisabled: false, strategy: "grid", navigationJump: processedDirection === "column" ? 1 : React__default.Children.count(children) || 0, filterClass: "child", children: /* @__PURE__ */ jsx("div", { className: "child", children: child }) }) : child
+    ] });
+  }) });
+};
+export {
+  HvStack
+};
+//# sourceMappingURL=Stack.js.map

package/dist/esm/components/Stack/Stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stack.js","sources":["../../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import React, { useMemo, useRef, useCallback } from \"react\";\nimport { useTheme } from \"@mui/material/styles\";\nimport MuiDivider, {\n  DividerProps as MuiDividerProps,\n} from \"@mui/material/Divider\";\nimport clsx from \"clsx\";\nimport isString from \"lodash/isString\";\nimport isBoolean from \"lodash/isBoolean\";\nimport { useWidth } from \"hooks\";\nimport { HvBaseProps } from \"../../types\";\nimport { StyledRoot } from \"./Stack.styles\";\nimport { HvFocus } from \"index\";\nimport { HvBreakpoints } from \"types/tokens\";\nimport stackClasses, { HvStackClasses } from \"./stackClasses\";\n\nexport type HvStackDirection = \"column\" | \"row\";\nexport type HvStackBreakpoints = Record<HvBreakpoints, string>;\n\nexport type HvStackProps = 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 | Partial<HvStackBreakpoints>;\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 = ({\n  classes,\n  className,\n  children,\n  direction = \"column\",\n  spacing = \"sm\",\n  divider = false,\n  withNavigation = false,\n  dividerProps = {},\n  ...others\n}: HvStackProps) => {\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    <StyledRoot\n      ref={containerRef}\n      className={clsx(className, stackClasses.root, classes?.root)}\n      $direction={processedDirection}\n      $breakpoint={spacing}\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    </StyledRoot>\n  );\n};\n"],"names":["getDirection","direction","width","breakpoints","isString","i","indexOf","undefined","HvStack","classes","className","children","spacing","divider","withNavigation","dividerProps","others","useWidth","containerRef","useRef","useTheme","processedDirection","useMemo","keys","getDividerComponent","useCallback","isBoolean","clsx","stackClasses","root","React","Children","map","child","count"],"mappings":";;;;;;;;;;;;AA2CA,MAAMA,eAAeA,CAACC,WAAWC,OAAOC,gBAAgB;AACtD,MAAIC,SAASH,SAAS;AAAUA,WAAAA;AAEvBI,WAAAA,IAAIF,YAAYG,QAAQJ,KAAK,GAAGG,KAAK,GAAGA,KAAK,GAAG;AACnDJ,QAAAA,UAAUE,YAAYE,QAAQE,QAAW;AAC3C,aAAON,UAAUE,YAAYE;AAAAA,IAC/B;AAAA,EACF;AACO,SAAA;AACT;AAOO,MAAMG,UAAUA,CAAC;AAAA,EACtBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAV,YAAY;AAAA,EACZW,UAAU;AAAA,EACVC,UAAU;AAAA,EACVC,iBAAiB;AAAA,EACjBC,eAAe,CAAC;AAAA,KACbC;AACS,MAAM;AAClB,QAAMd,QAAQe;AACRC,QAAAA,eAAeC,OAAO,IAAI;AAC1B,QAAA;AAAA,IAAEhB;AAAAA,MAAgBiB,SAAU;AAElC,QAAMC,qBAAqBC,QACzB,MAAMtB,aAAaC,WAAWC,OAAOC,YAAYoB,IAAI,GACrD,CAACtB,WAAWC,OAAOC,WAAW,CAAC;AAQ3BqB,QAAAA,sBAAsBC,YAAY,MAAM;AACxCC,QAAAA,UAAUb,OAAO,KAAKA,SAAS;AACjC,aACG,oBAAA,YAAA,EACC,aACEQ,uBAAuB,WAAW,eAAe,YAEnD,UAAUA,uBAAuB,OACjC,MAAK,aACDN,GAAAA,aACJ,CAAA;AAAA,IAEN;AACOF,WAAAA;AAAAA,EACN,GAAA,CAACA,SAASE,cAAcM,kBAAkB,CAAC;AAG5C,SAAA,oBAAC,YACC,EAAA,KAAKH,cACL,WAAWS,KAAKjB,WAAWkB,aAAaC,MAAMpB,mCAASoB,IAAI,GAC3D,YAAYR,oBACZ,aAAaT,SACb,GAAII,QAEHc,UAAAA,eAAMC,SAASC,IAAIrB,UAAU,CAACsB,OAAO5B,MAAM;AAC1C,WAEKQ,qBAAAA,UAAAA,EAAAA,UAAAA;AAAAA,MAAWR,WAAAA,MAAM,KAAKmB,oBAAqB;AAAA,MAC3CV,iBACE,oBAAA,SAAA,EACC,SAASI,cACT,eAAe,OACf,UAAS,QACT,gBACEG,uBAAuB,WACnB,IACAS,eAAMC,SAASG,MAAMvB,QAAQ,KAAK,GAExC,aAAY,SAEZ,UAAC,oBAAA,OAAA,EAAI,WAAU,SAASsB,UAAM,MAAA,CAAA,EAChC,CAAA,IAEAA;AAAAA,IAEJ,EAAA,CAAA;AAAA,EAEH,CAAA,EACH,CAAA;AAEJ;"}

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

@@ -0,0 +1,53 @@
+import _styled from "@emotion/styled/base";
+import { theme } from "@hitachivantara/uikit-styles";
+import { transientOptions } from "../../utils/transientOptions.js";
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+const StyledRoot = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? _extends({}, {
+  target: "evwozt80"
+}, transientOptions) : _extends({}, {
+  target: "evwozt80",
+  label: "StyledRoot"
+}, transientOptions))(({
+  $direction,
+  $breakpoint
+}) => ({
+  display: "flex",
+  ...$direction === "column" && {
+    flexDirection: "column"
+  },
+  ...$direction === "row" && {
+    flexDirection: "row"
+  },
+  ...$breakpoint === "xs" && {
+    gap: theme.space.xs
+  },
+  ...$breakpoint === "sm" && {
+    gap: theme.space.sm
+  },
+  ...$breakpoint === "md" && {
+    gap: theme.spacing(4)
+  },
+  ...$breakpoint === "lg" && {
+    gap: theme.spacing(6)
+  },
+  ...$breakpoint === "xl" && {
+    gap: theme.spacing(11)
+  }
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU3RhY2svU3RhY2suc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJMEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9TdGFjay9TdGFjay5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgeyB0cmFuc2llbnRPcHRpb25zIH0gZnJvbSBcInV0aWxzL3RyYW5zaWVudE9wdGlvbnNcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXG4gIFwiZGl2XCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoXG4gICh7XG4gICAgJGRpcmVjdGlvbixcbiAgICAkYnJlYWtwb2ludCxcbiAgfToge1xuICAgICRkaXJlY3Rpb246IHN0cmluZztcbiAgICAkYnJlYWtwb2ludDogc3RyaW5nO1xuICB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIC4uLigkZGlyZWN0aW9uID09PSBcImNvbHVtblwiICYmIHtcbiAgICAgIGZsZXhEaXJlY3Rpb246IFwiY29sdW1uXCIsXG4gICAgfSksXG4gICAgLi4uKCRkaXJlY3Rpb24gPT09IFwicm93XCIgJiYge1xuICAgICAgZmxleERpcmVjdGlvbjogXCJyb3dcIixcbiAgICB9KSxcbiAgICAuLi4oJGJyZWFrcG9pbnQgPT09IFwieHNcIiAmJiB7XG4gICAgICBnYXA6IHRoZW1lLnNwYWNlLnhzLFxuICAgIH0pLFxuICAgIC4uLigkYnJlYWtwb2ludCA9PT0gXCJzbVwiICYmIHtcbiAgICAgIGdhcDogdGhlbWUuc3BhY2Uuc20sXG4gICAgfSksXG4gICAgLi4uKCRicmVha3BvaW50ID09PSBcIm1kXCIgJiYge1xuICAgICAgZ2FwOiB0aGVtZS5zcGFjaW5nKDQpLFxuICAgIH0pLFxuICAgIC4uLigkYnJlYWtwb2ludCA9PT0gXCJsZ1wiICYmIHtcbiAgICAgIGdhcDogdGhlbWUuc3BhY2luZyg2KSxcbiAgICB9KSxcbiAgICAuLi4oJGJyZWFrcG9pbnQgPT09IFwieGxcIiAmJiB7XG4gICAgICBnYXA6IHRoZW1lLnNwYWNpbmcoMTEpLFxuICAgIH0pLFxuICB9KVxuKTtcbiJdfQ== */");
+export {
+  StyledRoot
+};
+//# sourceMappingURL=Stack.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Stack.styles.js","sources":["../../../../src/components/Stack/Stack.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"utils/transientOptions\";\n\nexport const StyledRoot = styled(\n  \"div\",\n  transientOptions\n)(\n  ({\n    $direction,\n    $breakpoint,\n  }: {\n    $direction: string;\n    $breakpoint: string;\n  }) => ({\n    display: \"flex\",\n    ...($direction === \"column\" && {\n      flexDirection: \"column\",\n    }),\n    ...($direction === \"row\" && {\n      flexDirection: \"row\",\n    }),\n    ...($breakpoint === \"xs\" && {\n      gap: theme.space.xs,\n    }),\n    ...($breakpoint === \"sm\" && {\n      gap: theme.space.sm,\n    }),\n    ...($breakpoint === \"md\" && {\n      gap: theme.spacing(4),\n    }),\n    ...($breakpoint === \"lg\" && {\n      gap: theme.spacing(6),\n    }),\n    ...($breakpoint === \"xl\" && {\n      gap: theme.spacing(11),\n    }),\n  })\n);\n"],"names":["StyledRoot","process","env","NODE_ENV","_extends","target","transientOptions","label","$direction","$breakpoint","display","flexDirection","gap","theme","space","xs","sm","spacing"],"mappings":";;;;;;;;;;;;;;;;;AAIaA,MAAAA,qCACX,OAAKC,QAAAC,IAAAC,4BAAAC,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,GACLC,gBAAgB,IAAAF,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,EAAAE,OAAA;AAAA,GAAhBD,gBAAgB,CACjB,EACC,CAAC;AAAA,EACCE;AAAAA,EACAC;AAIF,OAAO;AAAA,EACLC,SAAS;AAAA,EACT,GAAIF,eAAe,YAAY;AAAA,IAC7BG,eAAe;AAAA,EACjB;AAAA,EACA,GAAIH,eAAe,SAAS;AAAA,IAC1BG,eAAe;AAAA,EACjB;AAAA,EACA,GAAIF,gBAAgB,QAAQ;AAAA,IAC1BG,KAAKC,MAAMC,MAAMC;AAAAA,EACnB;AAAA,EACA,GAAIN,gBAAgB,QAAQ;AAAA,IAC1BG,KAAKC,MAAMC,MAAME;AAAAA,EACnB;AAAA,EACA,GAAIP,gBAAgB,QAAQ;AAAA,IAC1BG,KAAKC,MAAMI,QAAQ,CAAC;AAAA,EACtB;AAAA,EACA,GAAIR,gBAAgB,QAAQ;AAAA,IAC1BG,KAAKC,MAAMI,QAAQ,CAAC;AAAA,EACtB;AAAA,EACA,GAAIR,gBAAgB,QAAQ;AAAA,IAC1BG,KAAKC,MAAMI,QAAQ,EAAE;AAAA,EACvB;AACF,IAAEhB,QAAAC,IAAAC,aACH,eAAA,KAAA,6oDAAA;"}

package/dist/esm/components/Stack/stackClasses.js

@@ -0,0 +1,8 @@
+import { getClasses } from "../../utils/classes.js";
+const classKeys = ["root"];
+const stackClasses = getClasses(classKeys, "HvStack");
+const stackClasses$1 = stackClasses;
+export {
+  stackClasses$1 as default
+};
+//# sourceMappingURL=stackClasses.js.map

package/dist/esm/components/Stack/stackClasses.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stackClasses.js","sources":["../../../../src/components/Stack/stackClasses.ts"],"sourcesContent":["import { getClasses } from \"utils\";\n\nexport type HvStackClasses = {\n  root?: string;\n};\n\nconst classKeys: string[] = [\"root\"];\n\nconst stackClasses = getClasses<HvStackClasses>(classKeys, \"HvStack\");\n\nexport default stackClasses;\n"],"names":["classKeys","stackClasses","getClasses"],"mappings":";AAMA,MAAMA,YAAsB,CAAC,MAAM;AAEnC,MAAMC,eAAeC,WAA2BF,WAAW,SAAS;AAEpE,MAAA,iBAAeC;"}

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

@@ -0,0 +1,73 @@
+import { jsxs, jsx } from "@emotion/react/jsx-runtime";
+import { useCallback } from "react";
+import clsx from "clsx";
+import { isInvalid } from "../Forms/FormElement/validationStates.js";
+import { StyledFormElement, StyledLabel, StyledSwitchContainer } from "./Switch.styles.js";
+import switchClasses from "./switchClasses.js";
+import useUniqueId from "../../hooks/useUniqueId.js";
+import { HvBaseSwitch } from "../BaseSwitch/BaseSwitch.js";
+import { useControlled } from "../../hooks/useControlled.js";
+import { setId } from "../../utils/setId.js";
+import { HvWarningText } from "../Forms/WarningText/WarningText.js";
+const HvSwitch = (props) => {
+  const {
+    classes,
+    className,
+    id,
+    name,
+    value = "on",
+    required = false,
+    readOnly = false,
+    disabled = false,
+    label,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    labelProps,
+    checked,
+    defaultChecked = false,
+    onChange,
+    status,
+    statusMessage,
+    "aria-errormessage": ariaErrorMessage,
+    inputProps,
+    ...others
+  } = props;
+  const elementId = useUniqueId(id, "hvswitch");
+  const [isChecked, setIsChecked] = useControlled(checked, Boolean(defaultChecked));
+  const [validationState, setValidationState] = useControlled(status, "standBy");
+  const [validationMessage] = useControlled(statusMessage, "Required");
+  const onLocalChange = useCallback((evt, newChecked) => {
+    setIsChecked(() => {
+      if (required && !newChecked) {
+        setValidationState("invalid");
+      } else {
+        setValidationState("valid");
+      }
+      return newChecked;
+    });
+    onChange == null ? void 0 : onChange(evt, newChecked, value);
+  }, [onChange, required, setIsChecked, setValidationState, value]);
+  const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && required);
+  const isStateInvalid = isInvalid(validationState);
+  let errorMessageId;
+  if (isStateInvalid) {
+    errorMessageId = canShowError ? setId(elementId, "error") : ariaErrorMessage;
+  }
+  return /* @__PURE__ */ jsxs(StyledFormElement, { id, name, status: validationState, disabled, required, readOnly, className: clsx(className, switchClasses.root, classes == null ? void 0 : classes.root), children: [
+    label && /* @__PURE__ */ jsx(StyledLabel, { id: setId(elementId, "label"), htmlFor: setId(elementId, "input"), label, className: clsx(switchClasses.label, classes == null ? void 0 : classes.label), ...labelProps }),
+    /* @__PURE__ */ jsx(StyledSwitchContainer, { className: clsx(switchClasses.switchContainer, classes == null ? void 0 : classes.switchContainer, isStateInvalid && clsx(switchClasses.invalidSwitch, classes == null ? void 0 : classes.invalidSwitch)), $invalid: isStateInvalid, children: /* @__PURE__ */ jsx(HvBaseSwitch, { id: label ? setId(elementId, "input") : 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__ */ jsx(HvWarningText, { id: setId(elementId, "error"), className: clsx(switchClasses.error, classes == null ? void 0 : classes.error), disableBorder: true, disableAdornment: true, hideText: true, children: validationMessage })
+  ] });
+};
+export {
+  HvSwitch
+};
+//# sourceMappingURL=Switch.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport clsx from \"clsx\";\nimport { SwitchProps as MuiSwitchProps } from \"@mui/material\";\nimport { useControlled, useUniqueId } from \"hooks\";\nimport { setId } from \"utils\";\nimport {\n  HvWarningText,\n  HvBaseSwitch,\n  HvLabelProps,\n  HvFormStatus,\n} from \"components\";\nimport { isInvalid } from \"../Forms/FormElement/validationStates\";\nimport {\n  StyledFormElement,\n  StyledLabel,\n  StyledSwitchContainer,\n} from \"./Switch.styles\";\nimport { HvBaseProps } from \"../../types\";\nimport switchClasses, { HvSwitchClasses } from \"./switchClasses\";\n\nexport type HvSwitchProps = Omit<MuiSwitchProps, \"onChange\" | \"classes\"> &\n  HvBaseProps<HTMLInputElement, { onChange }> & {\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,\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  } = props;\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    <StyledFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(className, switchClasses.root, classes?.root)}\n    >\n      {label && (\n        <StyledLabel\n          id={setId(elementId, \"label\")}\n          htmlFor={setId(elementId, \"input\")}\n          label={label}\n          className={clsx(switchClasses.label, classes?.label)}\n          {...labelProps}\n        />\n      )}\n      <StyledSwitchContainer\n        className={clsx(\n          switchClasses.switchContainer,\n          classes?.switchContainer,\n          isStateInvalid &&\n            clsx(switchClasses.invalidSwitch, classes?.invalidSwitch)\n        )}\n        $invalid={isStateInvalid}\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      </StyledSwitchContainer>\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          className={clsx(switchClasses.error, classes?.error)}\n          disableBorder\n          disableAdornment\n          hideText\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </StyledFormElement>\n  );\n};\n"],"names":["HvSwitch","props","classes","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","inputProps","others","elementId","useUniqueId","isChecked","setIsChecked","useControlled","Boolean","validationState","setValidationState","validationMessage","onLocalChange","useCallback","evt","newChecked","canShowError","undefined","isStateInvalid","isInvalid","errorMessageId","setId","clsx","switchClasses","root","switchContainer","invalidSwitch","error"],"mappings":";;;;;;;;;;;AAiIaA,MAAAA,WAAWA,CAACC,UAAyB;AAC1C,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IACAC,QAAQ;AAAA,IACRC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC,WAAW;AAAA,IAEXC;AAAAA,IACA,cAAcC;AAAAA,IACd,mBAAmBC;AAAAA,IACnB,oBAAoBC;AAAAA,IACpBC;AAAAA,IAEAC;AAAAA,IACAC,iBAAiB;AAAA,IAEjBC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IACA,qBAAqBC;AAAAA,IAErBC;AAAAA,OAEGC;AAAAA,EACDrB,IAAAA;AAEEsB,QAAAA,YAAYC,YAAYpB,IAAI,UAAU;AAEtC,QAAA,CAACqB,WAAWC,YAAY,IAAIC,cAChCZ,SACAa,QAAQZ,cAAc,CAAC;AAGzB,QAAM,CAACa,iBAAiBC,kBAAkB,IAAIH,cAC5CT,QACA,SAAS;AAGX,QAAM,CAACa,iBAAiB,IAAIJ,cAAcR,eAAe,UAAU;AAEnE,QAAMa,gBAAgBC,YACpB,CAACC,KAAKC,eAAe;AACnBT,iBAAa,MAAM;AAEbnB,UAAAA,YAAY,CAAC4B,YAAY;AAC3BL,2BAAmB,SAAS;AAAA,MAAA,OACvB;AACLA,2BAAmB,OAAO;AAAA,MAC5B;AAEOK,aAAAA;AAAAA,IAAAA,CACR;AAEUD,yCAAAA,KAAKC,YAAY7B;AAAAA,EAAK,GAEnC,CAACW,UAAUV,UAAUmB,cAAcI,oBAAoBxB,KAAK,CAAC;AAOzD8B,QAAAA,eACJhB,oBAAoB,SAClBF,WAAWmB,UAAalB,kBAAkBkB,UACzCnB,WAAWmB,UAAa9B;AAEvB+B,QAAAA,iBAAiBC,UAAUV,eAAe;AAE5CW,MAAAA;AACJ,MAAIF,gBAAgB;AAClBE,qBAAiBJ,eACbK,MAAMlB,WAAW,OAAO,IACxBH;AAAAA,EACN;AAEA,8BACG,mBACC,EAAA,IACA,MACA,QAAQS,iBACR,UACA,UACA,UACA,WAAWa,KAAKvC,WAAWwC,cAAcC,MAAM1C,mCAAS0C,IAAI,GAE3DlC,UAAAA;AAAAA,IACC,SAAA,oBAAC,eACC,IAAI+B,MAAMlB,WAAW,OAAO,GAC5B,SAASkB,MAAMlB,WAAW,OAAO,GACjC,OACA,WAAWmB,KAAKC,cAAcjC,OAAOR,mCAASQ,KAAK,GACnD,GAAII,YAEP;AAAA,wBACA,uBACC,EAAA,WAAW4B,KACTC,cAAcE,iBACd3C,mCAAS2C,iBACTP,kBACEI,KAAKC,cAAcG,eAAe5C,mCAAS4C,aAAa,CAAC,GAE7D,UAAUR,gBAEV,UAAA,oBAAC,cACC,EAAA,IAAI5B,QAAQ+B,MAAMlB,WAAW,OAAO,IAAIkB,MAAMrC,IAAI,OAAO,GACzD,MACA,UACA,UACA,UACA,UAAU4B,eACV,OACA,SAASP,WACT,YAAY;AAAA,MACV,gBAAgBa,iBAAiB,OAAOD;AAAAA,MACxC,qBAAqBG;AAAAA,MACrB,cAAc7B;AAAAA,MACd,mBAAmBC;AAAAA,MACnB,oBAAoBC;AAAAA,MACpB,GAAGQ;AAAAA,IAAAA,GAEDC,GAAAA,OAAO,CAAA,GAEf;AAAA,IACCc,oCACE,eACC,EAAA,IAAIK,MAAMlB,WAAW,OAAO,GAC5B,WAAWmB,KAAKC,cAAcI,OAAO7C,mCAAS6C,KAAK,GACnD,eAAa,MACb,kBAAgB,MAChB,UAAQ,MAEPhB,UACH,kBAAA,CAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}

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

@@ -0,0 +1,68 @@
+import _styled from "@emotion/styled/base";
+import { theme } from "@hitachivantara/uikit-styles";
+import { transientOptions } from "../../utils/transientOptions.js";
+import { HvFormElement } from "../Forms/FormElement/FormElement.js";
+import { HvLabel } from "../Forms/Label/Label.js";
+function _EMOTION_STRINGIFIED_CSS_ERROR__() {
+  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
+}
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+const StyledFormElement = /* @__PURE__ */ _styled(HvFormElement, process.env.NODE_ENV === "production" ? {
+  target: "ejak3962"
+} : {
+  target: "ejak3962",
+  label: "StyledFormElement"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1bj7yge",
+  styles: "display:inline-flex;flex-direction:column;align-items:flex-start"
+} : {
+  name: "1bj7yge",
+  styles: "display:inline-flex;flex-direction:column;align-items:flex-start",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU3dpdGNoL1N3aXRjaC5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUtpQyIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL1N3aXRjaC9Td2l0Y2guc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJ1dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgeyBIdkxhYmVsLCBIdkZvcm1FbGVtZW50IH0gZnJvbSBcImNvbXBvbmVudHNcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEZvcm1FbGVtZW50ID0gc3R5bGVkKEh2Rm9ybUVsZW1lbnQpKHtcbiAgZGlzcGxheTogXCJpbmxpbmUtZmxleFwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICBhbGlnbkl0ZW1zOiBcImZsZXgtc3RhcnRcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkTGFiZWwgPSBzdHlsZWQoSHZMYWJlbCkoe1xuICBtYXJnaW5Cb3R0b206IHRoZW1lLnNwYWNlLnhzLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRTd2l0Y2hDb250YWluZXIgPSBzdHlsZWQoXG4gIFwiZGl2XCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJGludmFsaWQgfTogeyAkaW52YWxpZDogYm9vbGVhbiB9KSA9PiAoe1xuICBoZWlnaHQ6IFwiMzJweFwiLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG4gIGJvcmRlckJvdHRvbTogXCIxcHggc29saWQgdHJhbnNwYXJlbnRcIixcblxuICAuLi4oJGludmFsaWQgJiYge1xuICAgIHBhZGRpbmdCb3R0b206IHRoZW1lLnN3aXRjaC5pbnZhbGlkUGFkZGluZ0JvdHRvbSxcbiAgICBib3JkZXJCb3R0b206IGAxcHggc29saWQgJHt0aGVtZS5jb2xvcnMuc2VtYTR9YCxcbiAgfSksXG59KSk7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const StyledLabel = /* @__PURE__ */ _styled(HvLabel, process.env.NODE_ENV === "production" ? {
+  target: "ejak3961"
+} : {
+  target: "ejak3961",
+  label: "StyledLabel"
+})({
+  marginBottom: theme.space.xs
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU3dpdGNoL1N3aXRjaC5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVcyQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL1N3aXRjaC9Td2l0Y2guc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJ1dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgeyBIdkxhYmVsLCBIdkZvcm1FbGVtZW50IH0gZnJvbSBcImNvbXBvbmVudHNcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEZvcm1FbGVtZW50ID0gc3R5bGVkKEh2Rm9ybUVsZW1lbnQpKHtcbiAgZGlzcGxheTogXCJpbmxpbmUtZmxleFwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICBhbGlnbkl0ZW1zOiBcImZsZXgtc3RhcnRcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkTGFiZWwgPSBzdHlsZWQoSHZMYWJlbCkoe1xuICBtYXJnaW5Cb3R0b206IHRoZW1lLnNwYWNlLnhzLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRTd2l0Y2hDb250YWluZXIgPSBzdHlsZWQoXG4gIFwiZGl2XCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJGludmFsaWQgfTogeyAkaW52YWxpZDogYm9vbGVhbiB9KSA9PiAoe1xuICBoZWlnaHQ6IFwiMzJweFwiLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG4gIGJvcmRlckJvdHRvbTogXCIxcHggc29saWQgdHJhbnNwYXJlbnRcIixcblxuICAuLi4oJGludmFsaWQgJiYge1xuICAgIHBhZGRpbmdCb3R0b206IHRoZW1lLnN3aXRjaC5pbnZhbGlkUGFkZGluZ0JvdHRvbSxcbiAgICBib3JkZXJCb3R0b206IGAxcHggc29saWQgJHt0aGVtZS5jb2xvcnMuc2VtYTR9YCxcbiAgfSksXG59KSk7XG4iXX0= */");
+const StyledSwitchContainer = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? _extends({}, {
+  target: "ejak3960"
+}, transientOptions) : _extends({}, {
+  target: "ejak3960",
+  label: "StyledSwitchContainer"
+}, transientOptions))(({
+  $invalid
+}) => ({
+  height: "32px",
+  display: "flex",
+  flexDirection: "column",
+  justifyContent: "center",
+  borderBottom: "1px solid transparent",
+  ...$invalid && {
+    paddingBottom: theme.switch.invalidPaddingBottom,
+    borderBottom: `1px solid ${theme.colors.sema4}`
+  }
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU3dpdGNoL1N3aXRjaC5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWVxQyIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL1N3aXRjaC9Td2l0Y2guc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJ1dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgeyBIdkxhYmVsLCBIdkZvcm1FbGVtZW50IH0gZnJvbSBcImNvbXBvbmVudHNcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEZvcm1FbGVtZW50ID0gc3R5bGVkKEh2Rm9ybUVsZW1lbnQpKHtcbiAgZGlzcGxheTogXCJpbmxpbmUtZmxleFwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICBhbGlnbkl0ZW1zOiBcImZsZXgtc3RhcnRcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkTGFiZWwgPSBzdHlsZWQoSHZMYWJlbCkoe1xuICBtYXJnaW5Cb3R0b206IHRoZW1lLnNwYWNlLnhzLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRTd2l0Y2hDb250YWluZXIgPSBzdHlsZWQoXG4gIFwiZGl2XCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJGludmFsaWQgfTogeyAkaW52YWxpZDogYm9vbGVhbiB9KSA9PiAoe1xuICBoZWlnaHQ6IFwiMzJweFwiLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG4gIGJvcmRlckJvdHRvbTogXCIxcHggc29saWQgdHJhbnNwYXJlbnRcIixcblxuICAuLi4oJGludmFsaWQgJiYge1xuICAgIHBhZGRpbmdCb3R0b206IHRoZW1lLnN3aXRjaC5pbnZhbGlkUGFkZGluZ0JvdHRvbSxcbiAgICBib3JkZXJCb3R0b206IGAxcHggc29saWQgJHt0aGVtZS5jb2xvcnMuc2VtYTR9YCxcbiAgfSksXG59KSk7XG4iXX0= */");
+export {
+  StyledFormElement,
+  StyledLabel,
+  StyledSwitchContainer
+};
+//# sourceMappingURL=Switch.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.styles.js","sources":["../../../../src/components/Switch/Switch.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"utils/transientOptions\";\nimport { HvLabel, HvFormElement } from \"components\";\n\nexport const StyledFormElement = styled(HvFormElement)({\n  display: \"inline-flex\",\n  flexDirection: \"column\",\n  alignItems: \"flex-start\",\n});\n\nexport const StyledLabel = styled(HvLabel)({\n  marginBottom: theme.space.xs,\n});\n\nexport const StyledSwitchContainer = styled(\n  \"div\",\n  transientOptions\n)(({ $invalid }: { $invalid: boolean }) => ({\n  height: \"32px\",\n  display: \"flex\",\n  flexDirection: \"column\",\n  justifyContent: \"center\",\n  borderBottom: \"1px solid transparent\",\n\n  ...($invalid && {\n    paddingBottom: theme.switch.invalidPaddingBottom,\n    borderBottom: `1px solid ${theme.colors.sema4}`,\n  }),\n}));\n"],"names":["StyledFormElement","HvFormElement","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledLabel","HvLabel","marginBottom","theme","space","xs","StyledSwitchContainer","_extends","transientOptions","$invalid","height","display","flexDirection","justifyContent","borderBottom","paddingBottom","switch","invalidPaddingBottom","colors","sema4"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAKO,MAAMA,oBAA2BC,wBAAAA,eAAaC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAIpD;AAEK,MAAMC,cAAqBC,wBAAAA,SAAOX,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACzCQ,cAAcC,MAAMC,MAAMC;AAC5B,GAACf,QAAAC,IAAAC,aAAC,eAAA,KAAA,6lDAAA;AAEWc,MAAAA,gDACX,OAAKhB,QAAAC,IAAAC,4BAAAe,SAAA,IAAA;AAAA,EAAAd,QAAA;AAAA,GACLe,gBAAgB,IAAAD,SAAA,IAAA;AAAA,EAAAd,QAAA;AAAA,EAAAC,OAAA;AAAA,GAAhBc,gBAAgB,CACjB,EAAC,CAAC;AAAA,EAAEC;AAAgC,OAAO;AAAA,EAC1CC,QAAQ;AAAA,EACRC,SAAS;AAAA,EACTC,eAAe;AAAA,EACfC,gBAAgB;AAAA,EAChBC,cAAc;AAAA,EAEd,GAAIL,YAAY;AAAA,IACdM,eAAeZ,MAAMa,OAAOC;AAAAA,IAC5BH,cAAe,aAAYX,MAAMe,OAAOC;AAAAA,EAC1C;AACF,IAAE7B,QAAAC,IAAAC,aAAC,eAAA,KAAA,6lDAAA;"}

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

@@ -0,0 +1,8 @@
+import { getClasses } from "../../utils/classes.js";
+const classKeys = ["root", "label", "error", "switchContainer", "invalidSwitch"];
+const switchClasses = getClasses(classKeys, "HvSwitch");
+const switchClasses$1 = switchClasses;
+export {
+  switchClasses$1 as default
+};
+//# sourceMappingURL=switchClasses.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"switchClasses.js","sources":["../../../../src/components/Switch/switchClasses.ts"],"sourcesContent":["import { getClasses } from \"utils\";\n\nexport type HvSwitchClasses = {\n  /** Styles applied to the component. */\n  root?: string;\n  /** Styles applied to the label. */\n  label?: string;\n  /** Styles applied to the error area. */\n  error?: string;\n  /** Styles applied to the switch container. */\n  switchContainer?: string;\n  /** Styles applied to the switch container when the validations status is invalid. */\n  invalidSwitch?: string;\n};\n\nconst classKeys: string[] = [\n  \"root\",\n  \"label\",\n  \"error\",\n  \"switchContainer\",\n  \"invalidSwitch\",\n];\n\nconst switchClasses = getClasses<HvSwitchClasses>(classKeys, \"HvSwitch\");\n\nexport default switchClasses;\n"],"names":["classKeys","switchClasses","getClasses"],"mappings":";AAeA,MAAMA,YAAsB,CAC1B,QACA,SACA,SACA,mBACA,eAAe;AAGjB,MAAMC,gBAAgBC,WAA4BF,WAAW,UAAU;AAEvE,MAAA,kBAAeC;"}

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

@@ -0,0 +1,31 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import clsx from "clsx";
+import { StyledTab } from "./Tab.styles.js";
+import tabClasses from "./tabClasses.js";
+const HvTab = ({
+  classes,
+  iconPosition = "top",
+  disabled = false,
+  ...others
+}) => {
+  return /* @__PURE__ */ jsx(
+    StyledTab,
+    {
+      classes: {
+        root: clsx(tabClasses.root, classes == null ? void 0 : classes.root),
+        selected: clsx(tabClasses.selected, classes == null ? void 0 : classes.selected),
+        disabled: clsx(tabClasses.disabled, classes == null ? void 0 : classes.disabled)
+      },
+      disableRipple: true,
+      disableTouchRipple: true,
+      focusVisibleClassName: clsx("HvIsFocusVisible", clsx(tabClasses.focusVisible, classes == null ? void 0 : classes.focusVisible)),
+      disabled,
+      iconPosition,
+      ...others
+    }
+  );
+};
+export {
+  HvTab
+};
+//# sourceMappingURL=Tab.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.js","sources":["../../../../src/components/Tab/Tab.tsx"],"sourcesContent":["import { TabProps as MuiTabProps } from \"@mui/material\";\nimport clsx from \"clsx\";\nimport { HvBaseProps } from \"../../types\";\nimport { StyledTab } from \"./Tab.styles\";\nimport tabClasses, { HvTabClasses } from \"./tabClasses\";\n\n// Mui Tab props: https://mui.com/material-ui/api/tab/#props\nexport type HvTabProps = 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 = ({\n  classes,\n  iconPosition = \"top\",\n  disabled = false,\n  ...others\n}: HvTabProps) => {\n  return (\n    <StyledTab\n      classes={{\n        root: clsx(tabClasses.root, classes?.root),\n        selected: clsx(tabClasses.selected, classes?.selected),\n        disabled: clsx(tabClasses.disabled, classes?.disabled),\n      }}\n      disableRipple\n      disableTouchRipple\n      // Exposes the global class HvIsFocusVisible as a marker not to\n      // be styled directly, but only as helper in specific css queries\n      focusVisibleClassName={clsx(\n        \"HvIsFocusVisible\",\n        clsx(tabClasses.focusVisible, classes?.focusVisible)\n      )}\n      disabled={disabled}\n      iconPosition={iconPosition}\n      {...others}\n    />\n  );\n};\n"],"names":["HvTab","classes","iconPosition","disabled","others","root","clsx","tabClasses","selected","focusVisible"],"mappings":";;;;AAqBO,MAAMA,QAAQA,CAAC;AAAA,EACpBC;AAAAA,EACAC,eAAe;AAAA,EACfC,WAAW;AAAA,KACRC;AACO,MAAM;AAEd,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAAS;AAAA,QACPC,MAAMC,KAAKC,WAAWF,MAAMJ,mCAASI,IAAI;AAAA,QACzCG,UAAUF,KAAKC,WAAWC,UAAUP,mCAASO,QAAQ;AAAA,QACrDL,UAAUG,KAAKC,WAAWJ,UAAUF,mCAASE,QAAQ;AAAA,MACvD;AAAA,MACA,eAAa;AAAA,MACb,oBAAA;AAAA,MAGA,uBAAuBG,KACrB,oBACAA,KAAKC,WAAWE,cAAcR,mCAASQ,YAAY,CAAC;AAAA,MAEtD;AAAA,MACA;AAAA,MACIL,GAAAA;AAAAA,IAAAA;AAAAA,EAAAA;AAGV;"}

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

@@ -0,0 +1,64 @@
+import _styled from "@emotion/styled/base";
+import { theme } from "@hitachivantara/uikit-styles";
+import { Tab } from "@mui/material";
+import { outlineStyles } from "../../utils/focusUtils.js";
+const StyledTab = /* @__PURE__ */ _styled(Tab, process.env.NODE_ENV === "production" ? {
+  target: "evi6req0"
+} : {
+  target: "evi6req0",
+  label: "StyledTab"
+})({
+  marginTop: "3px",
+  padding: theme.tab.padding,
+  minWidth: 70,
+  minHeight: 32,
+  textTransform: "none",
+  fontFamily: theme.fontFamily.body,
+  ...theme.typography.body,
+  opacity: 1,
+  "&::after": {
+    position: "absolute",
+    left: 0,
+    top: "calc(100% - 1px)",
+    height: "1px",
+    width: "100%",
+    backgroundColor: theme.colors.atmo4,
+    content: "''"
+  },
+  "&:hover": {
+    backgroundColor: theme.tab.hoverBackgroundColor,
+    borderRadius: theme.tab.hoverBackgroundBorderRadius,
+    "&::after": {
+      height: "1px",
+      backgroundColor: theme.tab.hoverUnderlineBackgroundColor
+    }
+  },
+  "&:focus-visible": {
+    ...outlineStyles
+  },
+  "&:focus": {
+    outline: "none"
+  },
+  "&.Mui-selected": {
+    color: theme.colors.acce1,
+    letterSpacing: theme.typography.label.letterSpacing,
+    lineHeight: theme.typography.label.lineHeight,
+    fontWeight: theme.typography.label.fontWeight
+  },
+  "&.Mui-disabled": {
+    color: theme.colors.atmo5,
+    cursor: "not-allowed",
+    pointerEvents: "all",
+    opacity: 1,
+    "&:hover": {
+      background: "none"
+    }
+  },
+  "& .MuiTab-iconWrapper": {
+    margin: 0
+  }
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvVGFiL1RhYi5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU15QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL1RhYi9UYWIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgVGFiIGFzIE11aVRhYiB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBDU1NQcm9wZXJ0aWVzIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyBvdXRsaW5lU3R5bGVzIH0gZnJvbSBcInV0aWxzXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUYWIgPSBzdHlsZWQoTXVpVGFiKSh7XG4gIC8vIFJvb3RcbiAgbWFyZ2luVG9wOiBcIjNweFwiLFxuICBwYWRkaW5nOiB0aGVtZS50YWIucGFkZGluZyxcbiAgbWluV2lkdGg6IDcwLFxuICBtaW5IZWlnaHQ6IDMyLFxuICB0ZXh0VHJhbnNmb3JtOiBcIm5vbmVcIixcbiAgZm9udEZhbWlseTogdGhlbWUuZm9udEZhbWlseS5ib2R5LFxuICAuLi4odGhlbWUudHlwb2dyYXBoeS5ib2R5IGFzIENTU1Byb3BlcnRpZXMpLFxuICBvcGFjaXR5OiAxLFxuICBcIiY6OmFmdGVyXCI6IHtcbiAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgIGxlZnQ6IDAsXG4gICAgdG9wOiBcImNhbGMoMTAwJSAtIDFweClcIixcbiAgICBoZWlnaHQ6IFwiMXB4XCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW80LFxuICAgIGNvbnRlbnQ6IFwiJydcIixcbiAgfSxcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnRhYi5ob3ZlckJhY2tncm91bmRDb2xvcixcbiAgICBib3JkZXJSYWRpdXM6IHRoZW1lLnRhYi5ob3ZlckJhY2tncm91bmRCb3JkZXJSYWRpdXMsXG4gICAgXCImOjphZnRlclwiOiB7XG4gICAgICBoZWlnaHQ6IFwiMXB4XCIsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnRhYi5ob3ZlclVuZGVybGluZUJhY2tncm91bmRDb2xvcixcbiAgICB9LFxuICB9LFxuICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgLi4ub3V0bGluZVN0eWxlcyxcbiAgfSxcbiAgXCImOmZvY3VzXCI6IHtcbiAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgfSxcblxuICAvLyBPdmVycmlkZSBNdWkgc3R5bGluZzogaHR0cHM6Ly9tdWkuY29tL21hdGVyaWFsLXVpL2FwaS90YWIvI2Nzc1xuICBcIiYuTXVpLXNlbGVjdGVkXCI6IHtcbiAgICBjb2xvcjogdGhlbWUuY29sb3JzLmFjY2UxLFxuICAgIGxldHRlclNwYWNpbmc6IHRoZW1lLnR5cG9ncmFwaHkubGFiZWwubGV0dGVyU3BhY2luZyxcbiAgICBsaW5lSGVpZ2h0OiB0aGVtZS50eXBvZ3JhcGh5LmxhYmVsLmxpbmVIZWlnaHQsXG4gICAgZm9udFdlaWdodDogdGhlbWUudHlwb2dyYXBoeS5sYWJlbC5mb250V2VpZ2h0LFxuICB9LFxuICBcIiYuTXVpLWRpc2FibGVkXCI6IHtcbiAgICBjb2xvcjogdGhlbWUuY29sb3JzLmF0bW81LFxuICAgIGN1cnNvcjogXCJub3QtYWxsb3dlZFwiLFxuICAgIHBvaW50ZXJFdmVudHM6IFwiYWxsXCIsXG4gICAgb3BhY2l0eTogMSxcbiAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgYmFja2dyb3VuZDogXCJub25lXCIsXG4gICAgfSxcbiAgfSxcbiAgXCImIC5NdWlUYWItaWNvbldyYXBwZXJcIjoge1xuICAgIG1hcmdpbjogMCxcbiAgfSxcbn0pO1xuIl19 */");
+export {
+  StyledTab
+};
+//# sourceMappingURL=Tab.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.styles.js","sources":["../../../../src/components/Tab/Tab.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { Tab as MuiTab } from \"@mui/material\";\nimport { CSSProperties } from \"react\";\nimport { outlineStyles } from \"utils\";\n\nexport const StyledTab = styled(MuiTab)({\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  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  \"&:hover\": {\n    backgroundColor: theme.tab.hoverBackgroundColor,\n    borderRadius: theme.tab.hoverBackgroundBorderRadius,\n    \"&::after\": {\n      height: \"1px\",\n      backgroundColor: theme.tab.hoverUnderlineBackgroundColor,\n    },\n  },\n  \"&:focus-visible\": {\n    ...outlineStyles,\n  },\n  \"&:focus\": {\n    outline: \"none\",\n  },\n\n  // Override Mui styling: https://mui.com/material-ui/api/tab/#css\n  \"&.Mui-selected\": {\n    color: theme.colors.acce1,\n    letterSpacing: theme.typography.label.letterSpacing,\n    lineHeight: theme.typography.label.lineHeight,\n    fontWeight: theme.typography.label.fontWeight,\n  },\n  \"&.Mui-disabled\": {\n    color: theme.colors.atmo5,\n    cursor: \"not-allowed\",\n    pointerEvents: \"all\",\n    opacity: 1,\n    \"&:hover\": {\n      background: \"none\",\n    },\n  },\n  \"& .MuiTab-iconWrapper\": {\n    margin: 0,\n  },\n});\n"],"names":["StyledTab","MuiTab","process","env","NODE_ENV","target","label","marginTop","padding","theme","tab","minWidth","minHeight","textTransform","fontFamily","body","typography","opacity","position","left","top","height","width","backgroundColor","colors","atmo4","content","hoverBackgroundColor","borderRadius","hoverBackgroundBorderRadius","hoverUnderlineBackgroundColor","outlineStyles","outline","color","acce1","letterSpacing","lineHeight","fontWeight","atmo5","cursor","pointerEvents","background","margin"],"mappings":";;;;AAMO,MAAMA,YAAmBC,wBAAAA,KAAMC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EAEtCC,WAAW;AAAA,EACXC,SAASC,MAAMC,IAAIF;AAAAA,EACnBG,UAAU;AAAA,EACVC,WAAW;AAAA,EACXC,eAAe;AAAA,EACfC,YAAYL,MAAMK,WAAWC;AAAAA,EAC7B,GAAIN,MAAMO,WAAWD;AAAAA,EACrBE,SAAS;AAAA,EACT,YAAY;AAAA,IACVC,UAAU;AAAA,IACVC,MAAM;AAAA,IACNC,KAAK;AAAA,IACLC,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPC,iBAAiBd,MAAMe,OAAOC;AAAAA,IAC9BC,SAAS;AAAA,EACX;AAAA,EACA,WAAW;AAAA,IACTH,iBAAiBd,MAAMC,IAAIiB;AAAAA,IAC3BC,cAAcnB,MAAMC,IAAImB;AAAAA,IACxB,YAAY;AAAA,MACVR,QAAQ;AAAA,MACRE,iBAAiBd,MAAMC,IAAIoB;AAAAA,IAC7B;AAAA,EACF;AAAA,EACA,mBAAmB;AAAA,IACjB,GAAGC;AAAAA,EACL;AAAA,EACA,WAAW;AAAA,IACTC,SAAS;AAAA,EACX;AAAA,EAGA,kBAAkB;AAAA,IAChBC,OAAOxB,MAAMe,OAAOU;AAAAA,IACpBC,eAAe1B,MAAMO,WAAWV,MAAM6B;AAAAA,IACtCC,YAAY3B,MAAMO,WAAWV,MAAM8B;AAAAA,IACnCC,YAAY5B,MAAMO,WAAWV,MAAM+B;AAAAA,EACrC;AAAA,EACA,kBAAkB;AAAA,IAChBJ,OAAOxB,MAAMe,OAAOc;AAAAA,IACpBC,QAAQ;AAAA,IACRC,eAAe;AAAA,IACfvB,SAAS;AAAA,IACT,WAAW;AAAA,MACTwB,YAAY;AAAA,IACd;AAAA,EACF;AAAA,EACA,yBAAyB;AAAA,IACvBC,QAAQ;AAAA,EACV;AACF,GAACxC,QAAAC,IAAAC,aAAC,eAAA,KAAA,6iFAAA;"}

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

@@ -0,0 +1,8 @@
+import { getClasses } from "../../utils/classes.js";
+const classKeys = ["root", "selected", "disabled", "focusVisible"];
+const tabClasses = getClasses(classKeys, "HvTab");
+const tabClasses$1 = tabClasses;
+export {
+  tabClasses$1 as default
+};
+//# sourceMappingURL=tabClasses.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"tabClasses.js","sources":["../../../../src/components/Tab/tabClasses.ts"],"sourcesContent":["import { getClasses } from \"utils\";\n\nexport type HvTabClasses = {\n  root?: string;\n  selected?: string;\n  disabled?: string;\n  focusVisible?: string;\n};\n\nconst classKeys: string[] = [\"root\", \"selected\", \"disabled\", \"focusVisible\"];\n\nconst tabClasses = getClasses<HvTabClasses>(classKeys, \"HvTab\");\n\nexport default tabClasses;\n"],"names":["classKeys","tabClasses","getClasses"],"mappings":";AASA,MAAMA,YAAsB,CAAC,QAAQ,YAAY,YAAY,cAAc;AAE3E,MAAMC,aAAaC,WAAyBF,WAAW,OAAO;AAE9D,MAAA,eAAeC;"}

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

@@ -0,0 +1,98 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import _styled from "@emotion/styled/base";
+import clsx from "clsx";
+import { forwardRef, useRef, useMemo } from "react";
+import TableContext from "./TableContext.js";
+import { transientOptions } from "../../utils/transientOptions.js";
+import { theme } from "@hitachivantara/uikit-styles";
+import tableClasses from "./tableClasses.js";
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+const defaultComponent = "table";
+const computeTablePartComponents = (rootComponent) => {
+  if (rootComponent === "table") {
+    return {
+      Table: "table",
+      THead: "thead",
+      TBody: "tbody",
+      Tr: "tr",
+      Th: "th",
+      Td: "td"
+    };
+  }
+  return {
+    Table: rootComponent,
+    THead: rootComponent,
+    TBody: rootComponent,
+    Tr: rootComponent,
+    Th: rootComponent,
+    Td: rootComponent
+  };
+};
+const StyledTable = (c) => /* @__PURE__ */ _styled(c, process.env.NODE_ENV === "production" ? _extends({}, {
+  target: "e12hqti90"
+}, transientOptions) : _extends({}, {
+  target: "e12hqti90",
+  label: "StyledTable"
+}, transientOptions))(({
+  $stickyHeader,
+  $stickyColumns,
+  $listrow
+}) => ({
+  position: "relative",
+  width: "100%",
+  ...theme.typography.body,
+  "table&": {
+    borderSpacing: 0
+  },
+  "& caption": {
+    ...theme.typography.body,
+    padding: theme.space.xs,
+    textAlign: "left",
+    captionSide: "bottom"
+  },
+  ...$stickyHeader && {},
+  ...$stickyColumns && {
+    backgroundColor: theme.colors.atmo2
+  },
+  ...$listrow && {
+    "table&": {
+      borderSpacing: `0 ${theme.space.xs}`
+    }
+  }
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvVGFibGUvVGFibGUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFFRSIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL1RhYmxlL1RhYmxlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBjbHN4IGZyb20gXCJjbHN4XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEh2QmFzZVByb3BzIH0gZnJvbSBcIi4uLy4uL3R5cGVzXCI7XG5pbXBvcnQgeyB0YWJsZUNsYXNzZXMsIEh2VGFibGVDbGFzc2VzIH0gZnJvbSBcIi5cIjtcbmltcG9ydCB7IENTU1Byb3BlcnRpZXMsIGZvcndhcmRSZWYsIHVzZU1lbW8sIHVzZVJlZiB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IFRhYmxlQ29udGV4dCBmcm9tIFwiLi9UYWJsZUNvbnRleHRcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwidXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5leHBvcnQgdHlwZSBIdlRhYmxlVmFyaWFudCA9IFwibGlzdHJvd1wiIHwgXCJkZWZhdWx0XCI7XG5leHBvcnQgdHlwZSBIdlRhYmxlQ2VsbEFsaWduID1cbiAgfCBcImNlbnRlclwiXG4gIHwgXCJpbmhlcml0XCJcbiAgfCBcImp1c3RpZnlcIlxuICB8IFwibGVmdFwiXG4gIHwgXCJyaWdodFwiO1xuZXhwb3J0IHR5cGUgSHZUYWJsZUNlbGxUeXBlID0gXCJib2R5XCIgfCBcImZvb3RlclwiIHwgXCJoZWFkXCI7XG5leHBvcnQgdHlwZSBIdlRhYmxlQ2VsbFZhcmlhbnQgPVxuICB8IFwiY2hlY2tib3hcIlxuICB8IFwiZXhwYW5kXCJcbiAgfCBcImFjdGlvbnNcIlxuICB8IFwiZGVmYXVsdFwiXG4gIHwgXCJub25lXCI7XG5cbmV4cG9ydCB0eXBlIEh2VGFibGVQcm9wcyA9IEh2QmFzZVByb3BzICYge1xuICAvKipcbiAgICogVGhlIGNvbXBvbmVudCB1c2VkIGZvciB0aGUgcm9vdCBub2RlLiBFaXRoZXIgYSBzdHJpbmcgdG8gdXNlIGEgSFRNTCBlbGVtZW50IG9yIGEgY29tcG9uZW50LlxuICAgKiBEZWZhdWx0cyB0byBgdGFibGVgLlxuICAgKlxuICAgKiBXaGVuIHVzaW5nIG5vbi10YWJsZSBlbGVtZW50cywgbGF5b3V0IGlzIHVwIHRvIHRoZSBkZXZlbG9wZXIgdXNpbmcgdGhlIGNvbXBvbmVudC5cbiAgICovXG4gIGNvbXBvbmVudD86IFJlYWN0LkVsZW1lbnRUeXBlO1xuICAvKiogQ29udGVudCB0byBiZSByZW5kZXJlZCAqL1xuICBjaGlsZHJlbjogUmVhY3QuUmVhY3ROb2RlO1xuICAvKiogV2hldGhlciB0aGUgYEh2VGFibGVgIGhhcyBhIHN0aWNreSBoZWFkZXIgcm93LiAqL1xuICBzdGlja3lIZWFkZXI/OiBib29sZWFuO1xuICAvKiogV2hldGhlciB0aGUgYEh2VGFibGVgIGhhcyBzdGlja3kgY29sdW1ucy4gKi9cbiAgc3RpY2t5Q29sdW1ucz86IGJvb2xlYW47XG4gIC8qKiBXaGV0aGVyIHRoZSBgSHZUYWJsZWAgaGFzIHRoZSBsaXN0IHJvdyBzdHlsZXMgb3IgdGhlIGRlZmF1bHQuICovXG4gIHZhcmlhbnQ/OiBIdlRhYmxlVmFyaWFudDtcbiAgLyoqIEEgSnNzIE9iamVjdCB1c2VkIHRvIG92ZXJyaWRlIG9yIGV4dGVuZCB0aGUgc3R5bGVzIGFwcGxpZWQgdG8gdGhlIGNvbXBvbmVudC4gKi9cbiAgY2xhc3Nlcz86IEh2VGFibGVDbGFzc2VzO1xufTtcblxuY29uc3QgZGVmYXVsdENvbXBvbmVudCA9IFwidGFibGVcIjtcblxuY29uc3QgY29tcHV0ZVRhYmxlUGFydENvbXBvbmVudHMgPSAocm9vdENvbXBvbmVudCkgPT4ge1xuICBpZiAocm9vdENvbXBvbmVudCA9PT0gXCJ0YWJsZVwiKSB7XG4gICAgcmV0dXJuIHtcbiAgICAgIFRhYmxlOiBcInRhYmxlXCIsXG4gICAgICBUSGVhZDogXCJ0aGVhZFwiLFxuICAgICAgVEJvZHk6IFwidGJvZHlcIixcbiAgICAgIFRyOiBcInRyXCIsXG4gICAgICBUaDogXCJ0aFwiLFxuICAgICAgVGQ6IFwidGRcIixcbiAgICB9O1xuICB9XG5cbiAgcmV0dXJuIHtcbiAgICBUYWJsZTogcm9vdENvbXBvbmVudCxcbiAgICBUSGVhZDogcm9vdENvbXBvbmVudCxcbiAgICBUQm9keTogcm9vdENvbXBvbmVudCxcbiAgICBUcjogcm9vdENvbXBvbmVudCxcbiAgICBUaDogcm9vdENvbXBvbmVudCxcbiAgICBUZDogcm9vdENvbXBvbmVudCxcbiAgfTtcbn07XG5cbmNvbnN0IFN0eWxlZFRhYmxlID0gKGM6IGFueSkgPT5cbiAgc3R5bGVkKFxuICAgIGMsXG4gICAgdHJhbnNpZW50T3B0aW9uc1xuICApKFxuICAgICh7XG4gICAgICAkc3RpY2t5SGVhZGVyLFxuICAgICAgJHN0aWNreUNvbHVtbnMsXG4gICAgICAkbGlzdHJvdyxcbiAgICB9OiB7XG4gICAgICAkc3RpY2t5SGVhZGVyOiBib29sZWFuO1xuICAgICAgJHN0aWNreUNvbHVtbnM6IGJvb2xlYW47XG4gICAgICAkbGlzdHJvdzogYm9vbGVhbjtcbiAgICB9KSA9PiAoe1xuICAgICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbiAgICAgIHdpZHRoOiBcIjEwMCVcIixcblxuICAgICAgLi4uKHRoZW1lLnR5cG9ncmFwaHkuYm9keSBhcyBDU1NQcm9wZXJ0aWVzKSxcblxuICAgICAgXCJ0YWJsZSZcIjoge1xuICAgICAgICBib3JkZXJTcGFjaW5nOiAwLFxuICAgICAgfSxcblxuICAgICAgXCImIGNhcHRpb25cIjoge1xuICAgICAgICAuLi4odGhlbWUudHlwb2dyYXBoeS5ib2R5IGFzIENTU1Byb3BlcnRpZXMpLFxuICAgICAgICBwYWRkaW5nOiB0aGVtZS5zcGFjZS54cyxcbiAgICAgICAgdGV4dEFsaWduOiBcImxlZnRcIixcbiAgICAgICAgY2FwdGlvblNpZGU6IFwiYm90dG9tXCIsXG4gICAgICB9LFxuXG4gICAgICAuLi4oJHN0aWNreUhlYWRlciAmJiB7fSksXG4gICAgICAuLi4oJHN0aWNreUNvbHVtbnMgJiYge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMixcbiAgICAgIH0pLFxuICAgICAgLi4uKCRsaXN0cm93ICYmIHtcbiAgICAgICAgXCJ0YWJsZSZcIjoge1xuICAgICAgICAgIGJvcmRlclNwYWNpbmc6IGAwICR7dGhlbWUuc3BhY2UueHN9YCxcbiAgICAgICAgfSxcbiAgICAgIH0pLFxuICAgIH0pXG4gICk7XG5cbi8qKlxuICogQSBUYWJsZSBnYXRoZXJzIHJlbGF0aW9uYWwgZGF0YSwgaXQgZGlzcGxheXMgdmFsdWVzIGFycmFuZ2VkIHRvIGFsbG93IHF1aWNrIG51bWVyaWNhbCBhbmFseXNpc1xuICogbGlrZSBjb21wYXJpc29uIGFuZCBzb3J0aW5nLlxuICpcbiAqICoqSHZUYWJsZSoqIGNvbXBvbmVudCBvZmZlcnMgYSBzZXQgb2YgSFRNTC1lcXVpdmFsZW50IGVsZW1lbnRzLCAqKnN0eWxlZCB0byBEZXNpZ24gU3lzdGVtJ3Mgc3BlY2lmaWNhdGlvbioqLFxuICogZm9yIGJ1aWxkaW5nIHRhYmxlcy5cbiAqIFlvdSBjYW4gcmVseSBvbiB0aGVzZSAqKmVsZW1lbnRzKiogd2hlbiB5b3VyIHRhYmxlIGRvZXNu4oCZdCBoYXZlIG1hbnkgaW50ZXJhY3Rpb25zIG9yIHlvdSBuZWVkIGl0IHRvIGJlIHZlcnkgbGlnaHR3ZWlnaHQuXG4gKlxuICogRm9yIGJldHRlciBkYXRhIGhhbmRsaW5nIGFuZCAqKmFkdmFuY2VkIGZlYXR1cmVzKiogd2UgcmVjb21tZW5kIHRoZSB1c2Ugb2YgdGhlIHV0aWxpdHkgaG9va3MgY29sbGVjdGlvbiAuXG4gKiBTZWUgdGhlIDxhIGhyZWY9XCI/aWQ9bGFiLXRhYmxlLWhvb2tzLS1tYWluJnZpZXdNb2RlPWRvY3NcIiB0YXJnZXQ9XCJfc2VsZlwiPlRhYmxlIEhvb2tzIGRvY3VtZW50YXRpb248L2E+IGZvciBtb3JlIGRldGFpbHMuXG4gKlxuICogKipQTEVBU0UgTk9URSoqOiBUaGlzIFRhYmxlIGltcGxlbWVudGF0aW9uIGlzIHN0aWxsIGEgV0lQLiBUaGVyZSBtaWdodCBiZSBicmVha2luZyBjaGFuZ2VzLlxuICovXG5leHBvcnQgY29uc3QgSHZUYWJsZSA9IGZvcndhcmRSZWY8SFRNTEVsZW1lbnQsIEh2VGFibGVQcm9wcz4oXG4gIChcbiAgICB7XG4gICAgICBjbGFzc2VzLFxuICAgICAgY2xhc3NOYW1lLFxuICAgICAgY29tcG9uZW50ID0gZGVmYXVsdENvbXBvbmVudCxcbiAgICAgIHN0aWNreUhlYWRlciA9IGZhbHNlLFxuICAgICAgc3RpY2t5Q29sdW1ucyA9IGZhbHNlLFxuICAgICAgdmFyaWFudCA9IFwiZGVmYXVsdFwiLFxuICAgICAgLi4ub3RoZXJzXG4gICAgfSxcbiAgICByZWZcbiAgKSA9PiB7XG4gICAgY29uc3QgY29udGFpbmVyUmVmID0gdXNlUmVmKHJlZik7XG5cbiAgICBjb25zdCBjb21wb25lbnRzID0gdXNlTWVtbyhcbiAgICAgICgpID0+IGNvbXB1dGVUYWJsZVBhcnRDb21wb25lbnRzKGNvbXBvbmVudCksXG4gICAgICBbY29tcG9uZW50XVxuICAgICk7XG5cbiAgICBjb25zdCB0YWJsZUNvbnRleHQgPSB1c2VNZW1vKFxuICAgICAgKCkgPT4gKHsgY29tcG9uZW50cywgdmFyaWFudCwgY29udGFpbmVyUmVmIH0pLFxuICAgICAgW2NvbXBvbmVudHMsIHZhcmlhbnQsIGNvbnRhaW5lclJlZl1cbiAgICApO1xuXG4gICAgY29uc3QgVGFibGUgPSB1c2VNZW1vKCgpID0+IFN0eWxlZFRhYmxlKGNvbXBvbmVudHMuVGFibGUpLCBbY29tcG9uZW50c10pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgIDxUYWJsZUNvbnRleHQuUHJvdmlkZXIgdmFsdWU9e3RhYmxlQ29udGV4dH0+XG4gICAgICAgIDxUYWJsZVxuICAgICAgICAgIHJlZj17cmVmfVxuICAgICAgICAgIHJvbGU9e2NvbXBvbmVudCA9PT0gZGVmYXVsdENvbXBvbmVudCA/IG51bGwgOiBcInRhYmxlXCJ9XG4gICAgICAgICAgY2xhc3NOYW1lPXtjbHN4KFxuICAgICAgICAgICAgdGFibGVDbGFzc2VzLnJvb3QsXG4gICAgICAgICAgICBjbGFzc2VzPy5yb290LFxuICAgICAgICAgICAgc3RpY2t5SGVhZGVyICYmXG4gICAgICAgICAgICAgIGNsc3godGFibGVDbGFzc2VzLnN0aWNreUhlYWRlciwgY2xhc3Nlcz8uc3RpY2t5SGVhZGVyKSxcbiAgICAgICAgICAgIHN0aWNreUNvbHVtbnMgJiZcbiAgICAgICAgICAgICAgY2xzeCh0YWJsZUNsYXNzZXMuc3RpY2t5Q29sdW1ucywgY2xhc3Nlcz8uc3RpY2t5Q29sdW1ucyksXG4gICAgICAgICAgICB2YXJpYW50ID09PSBcImxpc3Ryb3dcIiAmJlxuICAgICAgICAgICAgICBjbHN4KHRhYmxlQ2xhc3Nlcy5saXN0Um93LCBjbGFzc2VzPy5saXN0Um93KSxcbiAgICAgICAgICAgIGNsYXNzTmFtZVxuICAgICAgICAgICl9XG4gICAgICAgICAgJHN0aWNreUNvbHVtbnM9e3N0aWNreUNvbHVtbnN9XG4gICAgICAgICAgJHN0aWNreUhlYWRlcj17c3RpY2t5SGVhZGVyfVxuICAgICAgICAgICRsaXN0cm93PXt2YXJpYW50ID09PSBcImxpc3Ryb3dcIn1cbiAgICAgICAgICB7Li4ub3RoZXJzfVxuICAgICAgICAvPlxuICAgICAgPC9UYWJsZUNvbnRleHQuUHJvdmlkZXI+XG4gICAgKTtcbiAgfVxuKTtcbiJdfQ== */");
+const HvTable = forwardRef(({
+  classes,
+  className,
+  component = defaultComponent,
+  stickyHeader = false,
+  stickyColumns = false,
+  variant = "default",
+  ...others
+}, ref) => {
+  const containerRef = useRef(ref);
+  const components = useMemo(() => computeTablePartComponents(component), [component]);
+  const tableContext = useMemo(() => ({
+    components,
+    variant,
+    containerRef
+  }), [components, variant, containerRef]);
+  const Table = useMemo(() => StyledTable(components.Table), [components]);
+  return /* @__PURE__ */ jsx(TableContext.Provider, { value: tableContext, children: /* @__PURE__ */ jsx(Table, { ref, role: component === defaultComponent ? null : "table", className: clsx(tableClasses.root, classes == null ? void 0 : classes.root, stickyHeader && clsx(tableClasses.stickyHeader, classes == null ? void 0 : classes.stickyHeader), stickyColumns && clsx(tableClasses.stickyColumns, classes == null ? void 0 : classes.stickyColumns), variant === "listrow" && clsx(tableClasses.listRow, classes == null ? void 0 : classes.listRow), className), $stickyColumns: stickyColumns, $stickyHeader: stickyHeader, $listrow: variant === "listrow", ...others }) });
+});
+export {
+  HvTable
+};
+//# sourceMappingURL=Table.js.map