@hitachivantara/uikit-react-core 5.60.0 → 5.61.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/dist/cjs/BaseCheckBox/BaseCheckBox.cjs +16 -13
  2. package/dist/cjs/BaseCheckBox/BaseCheckBox.cjs.map +1 -1
  3. package/dist/cjs/BaseCheckBox/BaseCheckBox.styles.cjs +54 -6
  4. package/dist/cjs/BaseCheckBox/BaseCheckBox.styles.cjs.map +1 -1
  5. package/dist/cjs/BaseCheckBox/icons.cjs +21 -0
  6. package/dist/cjs/BaseCheckBox/icons.cjs.map +1 -0
  7. package/dist/cjs/CheckBox/CheckBox.cjs +4 -1
  8. package/dist/cjs/CheckBox/CheckBox.cjs.map +1 -1
  9. package/dist/cjs/CheckBox/CheckBox.styles.cjs +4 -1
  10. package/dist/cjs/CheckBox/CheckBox.styles.cjs.map +1 -1
  11. package/dist/cjs/List/List.styles.cjs +1 -1
  12. package/dist/cjs/List/List.styles.cjs.map +1 -1
  13. package/dist/cjs/LoadingContainer/LoadingContainer.cjs +37 -0
  14. package/dist/cjs/LoadingContainer/LoadingContainer.cjs.map +1 -0
  15. package/dist/cjs/LoadingContainer/LoadingContainer.styles.cjs +20 -0
  16. package/dist/cjs/LoadingContainer/LoadingContainer.styles.cjs.map +1 -0
  17. package/dist/cjs/index.cjs +4 -0
  18. package/dist/cjs/index.cjs.map +1 -1
  19. package/dist/esm/BaseCheckBox/BaseCheckBox.js +13 -10
  20. package/dist/esm/BaseCheckBox/BaseCheckBox.js.map +1 -1
  21. package/dist/esm/BaseCheckBox/BaseCheckBox.styles.js +54 -6
  22. package/dist/esm/BaseCheckBox/BaseCheckBox.styles.js.map +1 -1
  23. package/dist/esm/BaseCheckBox/icons.js +21 -0
  24. package/dist/esm/BaseCheckBox/icons.js.map +1 -0
  25. package/dist/esm/CheckBox/CheckBox.js +4 -1
  26. package/dist/esm/CheckBox/CheckBox.js.map +1 -1
  27. package/dist/esm/CheckBox/CheckBox.styles.js +4 -1
  28. package/dist/esm/CheckBox/CheckBox.styles.js.map +1 -1
  29. package/dist/esm/List/List.styles.js +1 -1
  30. package/dist/esm/List/List.styles.js.map +1 -1
  31. package/dist/esm/LoadingContainer/LoadingContainer.js +38 -0
  32. package/dist/esm/LoadingContainer/LoadingContainer.js.map +1 -0
  33. package/dist/esm/LoadingContainer/LoadingContainer.styles.js +20 -0
  34. package/dist/esm/LoadingContainer/LoadingContainer.styles.js.map +1 -0
  35. package/dist/esm/index.js +100 -96
  36. package/dist/esm/index.js.map +1 -1
  37. package/dist/types/index.d.ts +184 -137
  38. package/package.json +5 -5
@@ -1 +1 @@
1
- {"version":3,"file":"BaseCheckBox.styles.js","sources":["../../../src/BaseCheckBox/BaseCheckBox.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseCheckBox\", {\n root: {\n padding: 0,\n borderRadius: theme.radii.base,\n cursor: \"pointer\",\n \"&:hover\": {\n backgroundColor: theme.colors.containerBackgroundHover,\n },\n },\n disabled: {\n \"&$root\": {\n cursor: \"not-allowed\",\n pointerEvents: \"initial\",\n },\n\n \"& svg\": {\n \"& path:nth-of-type(2)\": {\n fill: theme.colors.secondary_60,\n },\n },\n },\n focusVisible: {\n \"& svg\": {\n ...outlineStyles,\n },\n },\n icon: {},\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,kBAAkB;AAAA,EAC3E,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,cAAc,MAAM,MAAM;AAAA,IAC1B,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,UAAU;AAAA,MACR,QAAQ;AAAA,MACR,eAAe;AAAA,IACjB;AAAA,IAEA,SAAS;AAAA,MACP,yBAAyB;AAAA,QACvB,MAAM,MAAM,OAAO;AAAA,MACrB;AAAA,IACF;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,MACP,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA,MAAM,CAAC;AACT,CAAC;"}
1
+ {"version":3,"file":"BaseCheckBox.styles.js","sources":["../../../src/BaseCheckBox/BaseCheckBox.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseCheckBox\", {\n root: {\n padding: 0,\n width: 32,\n minWidth: 32,\n height: 32,\n borderRadius: theme.radii.base,\n cursor: \"pointer\",\n \"&:hover\": {\n backgroundColor: theme.colors.containerBackgroundHover,\n },\n\n \"& svg\": {\n width: 16,\n height: 16,\n color: theme.colors.atmo1,\n borderRadius: theme.radii.none,\n border: `1px solid ${theme.colors.secondary}`,\n },\n },\n disabled: {\n \"&$root\": {\n cursor: \"not-allowed\",\n pointerEvents: \"initial\",\n \"& svg\": {\n color: theme.colors.atmo3,\n borderColor: theme.colors.secondary_60,\n },\n },\n },\n focusVisible: {\n \"& svg\": {\n ...outlineStyles,\n },\n },\n icon: {},\n checked: {\n \"& svg\": {\n border: `1px solid ${theme.colors.secondary}`,\n backgroundColor: theme.colors.secondary,\n color: theme.colors.atmo1,\n },\n \"&$disabled\": {\n \"& svg\": {\n backgroundColor: theme.colors.atmo3,\n borderColor: theme.colors.atmo3,\n color: theme.colors.secondary_60,\n },\n },\n },\n indeterminate: {\n \"& svg\": {\n color: theme.colors.secondary,\n },\n \"&$disabled\": {\n \"& svg\": {\n backgroundColor: theme.colors.atmo3,\n borderColor: theme.colors.secondary_60,\n color: theme.colors.secondary_60,\n },\n },\n },\n semantic: {\n \"& svg\": {\n border: `1px solid ${theme.colors.base_dark}`,\n color: theme.colors.base_light,\n backgroundColor: theme.colors.base_dark,\n },\n \"&$indeterminate\": {\n \"& svg\": {\n color: theme.colors.base_dark,\n backgroundColor: theme.colors.base_light,\n },\n },\n },\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,kBAAkB;AAAA,EAC3E,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,cAAc,MAAM,MAAM;AAAA,IAC1B,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,IAEA,SAAS;AAAA,MACP,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO,MAAM,OAAO;AAAA,MACpB,cAAc,MAAM,MAAM;AAAA,MAC1B,QAAQ,aAAa,MAAM,OAAO,SAAS;AAAA,IAC7C;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,UAAU;AAAA,MACR,QAAQ;AAAA,MACR,eAAe;AAAA,MACf,SAAS;AAAA,QACP,OAAO,MAAM,OAAO;AAAA,QACpB,aAAa,MAAM,OAAO;AAAA,MAC5B;AAAA,IACF;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,MACP,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA,MAAM,CAAC;AAAA,EACP,SAAS;AAAA,IACP,SAAS;AAAA,MACP,QAAQ,aAAa,MAAM,OAAO,SAAS;AAAA,MAC3C,iBAAiB,MAAM,OAAO;AAAA,MAC9B,OAAO,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,cAAc;AAAA,MACZ,SAAS;AAAA,QACP,iBAAiB,MAAM,OAAO;AAAA,QAC9B,aAAa,MAAM,OAAO;AAAA,QAC1B,OAAO,MAAM,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAAA,EACA,eAAe;AAAA,IACb,SAAS;AAAA,MACP,OAAO,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,cAAc;AAAA,MACZ,SAAS;AAAA,QACP,iBAAiB,MAAM,OAAO;AAAA,QAC9B,aAAa,MAAM,OAAO;AAAA,QAC1B,OAAO,MAAM,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,QAAQ,aAAa,MAAM,OAAO,SAAS;AAAA,MAC3C,OAAO,MAAM,OAAO;AAAA,MACpB,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,IACA,mBAAmB;AAAA,MACjB,SAAS;AAAA,QACP,OAAO,MAAM,OAAO;AAAA,QACpB,iBAAiB,MAAM,OAAO;AAAA,MAChC;AAAA,IACF;AAAA,EACF;AACF,CAAC;"}
@@ -0,0 +1,21 @@
1
+ import { jsx } from "@emotion/react/jsx-runtime";
2
+ const Box = () => {
3
+ return /* @__PURE__ */ jsx("svg", { width: "14", height: "14", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { fill: "currentcolor", d: "m0,0l16,0l0,16l-16,0l0,-16z" }) });
4
+ };
5
+ const Check = () => {
6
+ return /* @__PURE__ */ jsx("svg", { width: "14", height: "14", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx(
7
+ "path",
8
+ {
9
+ d: "m5.03,12.06l-3.76,-3.75l1.42,-1.42l2.24,2.25l6.3,-7.2l1.5,1.31l-7.7,8.81z",
10
+ fill: "currentcolor"
11
+ }
12
+ ) });
13
+ };
14
+ const Partial = () => {
15
+ return /* @__PURE__ */ jsx("svg", { width: "14", height: "14", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { id: "svg_2", d: "m3,8l8,0l0,-2l-8,0l0,2z", fill: "currentcolor" }) });
16
+ };
17
+ export {
18
+ Box,
19
+ Check,
20
+ Partial
21
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icons.js","sources":["../../../src/BaseCheckBox/icons.tsx"],"sourcesContent":["export const Box = () => {\n return (\n <svg width=\"14\" height=\"14\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill=\"currentcolor\" d=\"m0,0l16,0l0,16l-16,0l0,-16z\" />\n </svg>\n );\n};\n\nexport const Check = () => {\n return (\n <svg width=\"14\" height=\"14\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"m5.03,12.06l-3.76,-3.75l1.42,-1.42l2.24,2.25l6.3,-7.2l1.5,1.31l-7.7,8.81z\"\n fill=\"currentcolor\"\n />\n </svg>\n );\n};\n\nexport const Partial = () => {\n return (\n <svg width=\"14\" height=\"14\" xmlns=\"http://www.w3.org/2000/svg\">\n <path id=\"svg_2\" d=\"m3,8l8,0l0,-2l-8,0l0,2z\" fill=\"currentcolor\" />\n </svg>\n );\n};\n"],"names":[],"mappings":";AAAO,MAAM,MAAM,MAAM;AACvB,SACG,oBAAA,OAAA,EAAI,OAAM,MAAK,QAAO,MAAK,OAAM,8BAChC,UAAA,oBAAC,QAAK,EAAA,MAAK,gBAAe,GAAE,+BAA8B,EAC5D,CAAA;AAEJ;AAEO,MAAM,QAAQ,MAAM;AACzB,6BACG,OAAI,EAAA,OAAM,MAAK,QAAO,MAAK,OAAM,8BAChC,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA,IAAA;AAAA,EAET,EAAA,CAAA;AAEJ;AAEO,MAAM,UAAU,MAAM;AAC3B,6BACG,OAAI,EAAA,OAAM,MAAK,QAAO,MAAK,OAAM,8BAChC,UAAC,oBAAA,QAAA,EAAK,IAAG,SAAQ,GAAE,2BAA0B,MAAK,gBAAe,EACnE,CAAA;AAEJ;"}
@@ -100,7 +100,10 @@ const HvCheckBox = forwardRef(
100
100
  id: hasLabel ? setId(elementId, "input") : setId(id, "input"),
101
101
  name,
102
102
  className: cx(classes.checkbox, {
103
- [classes.invalidCheckbox]: isStateInvalid
103
+ [classes.invalidCheckbox]: isStateInvalid,
104
+ [classes.checked]: isChecked,
105
+ [classes.indeterminate]: isIndeterminate,
106
+ [classes.semantic]: semantic
104
107
  }),
105
108
  disabled,
106
109
  readOnly,
@@ -1 +1 @@
1
- {"version":3,"file":"CheckBox.js","sources":["../../../src/CheckBox/CheckBox.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { setId } from \"../utils/setId\";\nimport { HvBaseCheckBox, HvBaseCheckBoxProps } from \"../BaseCheckBox\";\nimport {\n HvLabelProps,\n HvFormStatus,\n HvWarningText,\n isInvalid,\n HvFormElement,\n HvLabel,\n} from \"../Forms\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./CheckBox.styles\";\n\nexport { staticClasses as checkBoxClasses };\n\nexport type HvCheckBoxClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCheckBoxProps extends Omit<HvBaseCheckBoxProps, \"classes\"> {\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n */\n label?: React.ReactNode;\n /**\n * Properties passed on to the label element.\n */\n labelProps?: HvLabelProps;\n /**\n * 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 the state.\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?: React.ReactNode;\n /**\n * A Jss Object used to override or extend the styles applied to the checkbox.\n */\n classes?: HvCheckBoxClasses;\n}\n\n/**\n * A Checkbox is a mechanism that allows the user to select one or more options.\n *\n * Usually used in a Checkbox Group to present the user with a range of options from\n * which the user <b>may select any number of options</b> to complete their task.\n *\n * It can also be used individually to represent the toggle of a single option, when\n * the Toggle Switch and Toggle Button aren't more appropriate.\n */\nexport const HvCheckBox = forwardRef<HTMLButtonElement, HvCheckBoxProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n name,\n checked,\n status,\n indeterminate,\n statusMessage,\n label,\n labelProps,\n inputProps,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n semantic = false,\n defaultChecked = false,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-errormessage\": ariaErrorMessage,\n onChange,\n onFocusVisible,\n onBlur,\n ...others\n } = useDefaultProps(\"HvCheckBox\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id);\n\n const [focusVisible, setFocusVisible] = useState<boolean>(false);\n\n const [validationState, setValidationState] = useControlled(\n status,\n \"standBy\"\n );\n\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const [isChecked, setIsChecked] = useControlled(\n checked,\n Boolean(defaultChecked)\n );\n\n const [isIndeterminate, setIsIndeterminate] = useControlled(\n checked !== undefined ? indeterminate : undefined,\n Boolean(indeterminate)\n );\n\n const isStateInvalid = isInvalid(validationState);\n\n const onChangeCallback = useCallback<\n NonNullable<HvBaseCheckBoxProps[\"onChange\"]>\n >(\n (event, newChecked) => {\n setIsChecked(() => {\n // This will only run if uncontrolled\n setIsIndeterminate(false);\n\n if (required && !newChecked) {\n setValidationState(\"invalid\");\n } else {\n setValidationState(\"valid\");\n }\n\n return newChecked;\n });\n\n onChange?.(event, newChecked, value);\n },\n [\n onChange,\n required,\n setIsChecked,\n setIsIndeterminate,\n setValidationState,\n value,\n ]\n );\n\n const onFocusVisibleCallback: HvBaseCheckBoxProps[\"onBlur\"] = (event) => {\n setFocusVisible(true);\n onFocusVisible?.(event);\n };\n\n const onBlurCallback: HvBaseCheckBoxProps[\"onBlur\"] = (event) => {\n setFocusVisible(false);\n onBlur?.(event);\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 hasLabel = label != null;\n\n let errorMessageId;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n const checkbox = (\n <HvBaseCheckBox\n ref={ref}\n id={hasLabel ? setId(elementId, \"input\") : setId(id, \"input\")}\n name={name}\n className={cx(classes.checkbox, {\n [classes.invalidCheckbox]: isStateInvalid,\n })}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n onChange={onChangeCallback}\n value={value}\n checked={isChecked}\n indeterminate={isIndeterminate}\n semantic={semantic}\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 onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n {...others}\n />\n );\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n className={cx(\n classes.root,\n { [classes.focusVisible]: !!(focusVisible && label) },\n className\n )}\n >\n {hasLabel ? (\n <div\n className={cx(classes.container, {\n [classes.disabled]: disabled,\n [classes.invalidContainer]: isStateInvalid,\n })}\n >\n {checkbox}\n <HvLabel\n id={setId(elementId, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n className={classes.label}\n {...labelProps}\n />\n </div>\n ) : (\n checkbox\n )}\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableAdornment={!hasLabel}\n hideText={!hasLabel}\n disableBorder\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n }\n);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"CheckBox.js","sources":["../../../src/CheckBox/CheckBox.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { setId } from \"../utils/setId\";\nimport { HvBaseCheckBox, HvBaseCheckBoxProps } from \"../BaseCheckBox\";\nimport {\n HvLabelProps,\n HvFormStatus,\n HvWarningText,\n isInvalid,\n HvFormElement,\n HvLabel,\n} from \"../Forms\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./CheckBox.styles\";\n\nexport { staticClasses as checkBoxClasses };\n\nexport type HvCheckBoxClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCheckBoxProps extends Omit<HvBaseCheckBoxProps, \"classes\"> {\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n */\n label?: React.ReactNode;\n /**\n * Properties passed on to the label element.\n */\n labelProps?: HvLabelProps;\n /**\n * 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 the state.\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?: React.ReactNode;\n /**\n * A Jss Object used to override or extend the styles applied to the checkbox.\n */\n classes?: HvCheckBoxClasses;\n}\n\n/**\n * A Checkbox is a mechanism that allows the user to select one or more options.\n *\n * Usually used in a Checkbox Group to present the user with a range of options from\n * which the user <b>may select any number of options</b> to complete their task.\n *\n * It can also be used individually to represent the toggle of a single option, when\n * the Toggle Switch and Toggle Button aren't more appropriate.\n */\nexport const HvCheckBox = forwardRef<HTMLButtonElement, HvCheckBoxProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n name,\n checked,\n status,\n indeterminate,\n statusMessage,\n label,\n labelProps,\n inputProps,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n semantic = false,\n defaultChecked = false,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-errormessage\": ariaErrorMessage,\n onChange,\n onFocusVisible,\n onBlur,\n ...others\n } = useDefaultProps(\"HvCheckBox\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id);\n\n const [focusVisible, setFocusVisible] = useState<boolean>(false);\n\n const [validationState, setValidationState] = useControlled(\n status,\n \"standBy\"\n );\n\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const [isChecked, setIsChecked] = useControlled(\n checked,\n Boolean(defaultChecked)\n );\n\n const [isIndeterminate, setIsIndeterminate] = useControlled(\n checked !== undefined ? indeterminate : undefined,\n Boolean(indeterminate)\n );\n\n const isStateInvalid = isInvalid(validationState);\n\n const onChangeCallback = useCallback<\n NonNullable<HvBaseCheckBoxProps[\"onChange\"]>\n >(\n (event, newChecked) => {\n setIsChecked(() => {\n // This will only run if uncontrolled\n setIsIndeterminate(false);\n\n if (required && !newChecked) {\n setValidationState(\"invalid\");\n } else {\n setValidationState(\"valid\");\n }\n\n return newChecked;\n });\n\n onChange?.(event, newChecked, value);\n },\n [\n onChange,\n required,\n setIsChecked,\n setIsIndeterminate,\n setValidationState,\n value,\n ]\n );\n\n const onFocusVisibleCallback: HvBaseCheckBoxProps[\"onBlur\"] = (event) => {\n setFocusVisible(true);\n onFocusVisible?.(event);\n };\n\n const onBlurCallback: HvBaseCheckBoxProps[\"onBlur\"] = (event) => {\n setFocusVisible(false);\n onBlur?.(event);\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 hasLabel = label != null;\n\n let errorMessageId;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n const checkbox = (\n <HvBaseCheckBox\n ref={ref}\n id={hasLabel ? setId(elementId, \"input\") : setId(id, \"input\")}\n name={name}\n className={cx(classes.checkbox, {\n [classes.invalidCheckbox]: isStateInvalid,\n [classes.checked]: isChecked,\n [classes.indeterminate]: isIndeterminate,\n [classes.semantic]: semantic,\n })}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n onChange={onChangeCallback}\n value={value}\n checked={isChecked}\n indeterminate={isIndeterminate}\n semantic={semantic}\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 onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n {...others}\n />\n );\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n className={cx(\n classes.root,\n { [classes.focusVisible]: !!(focusVisible && label) },\n className\n )}\n >\n {hasLabel ? (\n <div\n className={cx(classes.container, {\n [classes.disabled]: disabled,\n [classes.invalidContainer]: isStateInvalid,\n })}\n >\n {checkbox}\n <HvLabel\n id={setId(elementId, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n className={classes.label}\n {...labelProps}\n />\n </div>\n ) : (\n checkbox\n )}\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableAdornment={!hasLabel}\n hideText={!hasLabel}\n disableBorder\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n }\n);\n"],"names":[],"mappings":"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"}
@@ -51,7 +51,10 @@ const { staticClasses, useClasses } = createClasses("HvCheckBox", {
51
51
  height: "32px",
52
52
  lineHeight: "32px",
53
53
  width: "100%"
54
- }
54
+ },
55
+ checked: {},
56
+ indeterminate: {},
57
+ semantic: {}
55
58
  });
56
59
  export {
57
60
  staticClasses,
@@ -1 +1 @@
1
- {"version":3,"file":"CheckBox.styles.js","sources":["../../../src/CheckBox/CheckBox.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCheckBox\", {\n root: { display: \"inline-block\" },\n container: {\n cursor: \"pointer\",\n display: \"flex\",\n height: \"32px\",\n transition: \"background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms\",\n\n \"&:hover\": {\n backgroundColor: theme.colors.containerBackgroundHover,\n borderRadius: theme.radii.base,\n },\n },\n disabled: {\n cursor: \"not-allowed\",\n \"& $label\": { color: theme.colors.secondary_60, cursor: \"not-allowed\" },\n },\n focusVisible: {\n ...outlineStyles,\n\n \"& div\": {\n backgroundColor: theme.colors.atmo3,\n },\n\n [`& $checkbox div > svg`]: {\n outline: \"none\",\n boxShadow: \"none\",\n },\n },\n invalidContainer: {\n borderBottom: `1px solid ${theme.colors.negative}`,\n\n \"&:hover\": {\n borderBottomLeftRadius: \"0px\",\n borderBottomRightRadius: \"0px\",\n },\n },\n checkbox: { height: \"32px\" },\n invalidCheckbox: {\n borderBottom: `1px solid ${theme.colors.negative}`,\n borderBottomLeftRadius: \"0px\",\n borderBottomRightRadius: \"0px\",\n },\n label: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n verticalAlign: \"middle\",\n paddingRight: theme.space.xs,\n whiteSpace: \"nowrap\",\n ...theme.typography.body,\n cursor: \"pointer\",\n height: \"32px\",\n lineHeight: \"32px\",\n width: \"100%\",\n },\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,cAAc;AAAA,EACvE,MAAM,EAAE,SAAS,eAAe;AAAA,EAChC,WAAW;AAAA,IACT,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,YAAY;AAAA,IAEZ,WAAW;AAAA,MACT,iBAAiB,MAAM,OAAO;AAAA,MAC9B,cAAc,MAAM,MAAM;AAAA,IAC5B;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,YAAY,EAAE,OAAO,MAAM,OAAO,cAAc,QAAQ,cAAc;AAAA,EACxE;AAAA,EACA,cAAc;AAAA,IACZ,GAAG;AAAA,IAEH,SAAS;AAAA,MACP,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,IAEA,CAAC,uBAAuB,GAAG;AAAA,MACzB,SAAS;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,kBAAkB;AAAA,IAChB,cAAc,aAAa,MAAM,OAAO,QAAQ;AAAA,IAEhD,WAAW;AAAA,MACT,wBAAwB;AAAA,MACxB,yBAAyB;AAAA,IAC3B;AAAA,EACF;AAAA,EACA,UAAU,EAAE,QAAQ,OAAO;AAAA,EAC3B,iBAAiB;AAAA,IACf,cAAc,aAAa,MAAM,OAAO,QAAQ;AAAA,IAChD,wBAAwB;AAAA,IACxB,yBAAyB;AAAA,EAC3B;AAAA,EACA,OAAO;AAAA,IACL,UAAU;AAAA,IACV,cAAc;AAAA,IACd,eAAe;AAAA,IACf,cAAc,MAAM,MAAM;AAAA,IAC1B,YAAY;AAAA,IACZ,GAAG,MAAM,WAAW;AAAA,IACpB,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AACF,CAAC;"}
1
+ {"version":3,"file":"CheckBox.styles.js","sources":["../../../src/CheckBox/CheckBox.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCheckBox\", {\n root: { display: \"inline-block\" },\n container: {\n cursor: \"pointer\",\n display: \"flex\",\n height: \"32px\",\n transition: \"background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms\",\n\n \"&:hover\": {\n backgroundColor: theme.colors.containerBackgroundHover,\n borderRadius: theme.radii.base,\n },\n },\n disabled: {\n cursor: \"not-allowed\",\n \"& $label\": { color: theme.colors.secondary_60, cursor: \"not-allowed\" },\n },\n focusVisible: {\n ...outlineStyles,\n\n \"& div\": {\n backgroundColor: theme.colors.atmo3,\n },\n\n [`& $checkbox div > svg`]: {\n outline: \"none\",\n boxShadow: \"none\",\n },\n },\n invalidContainer: {\n borderBottom: `1px solid ${theme.colors.negative}`,\n\n \"&:hover\": {\n borderBottomLeftRadius: \"0px\",\n borderBottomRightRadius: \"0px\",\n },\n },\n checkbox: { height: \"32px\" },\n invalidCheckbox: {\n borderBottom: `1px solid ${theme.colors.negative}`,\n borderBottomLeftRadius: \"0px\",\n borderBottomRightRadius: \"0px\",\n },\n label: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n verticalAlign: \"middle\",\n paddingRight: theme.space.xs,\n whiteSpace: \"nowrap\",\n ...theme.typography.body,\n cursor: \"pointer\",\n height: \"32px\",\n lineHeight: \"32px\",\n width: \"100%\",\n },\n checked: {},\n indeterminate: {},\n semantic: {},\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,cAAc;AAAA,EACvE,MAAM,EAAE,SAAS,eAAe;AAAA,EAChC,WAAW;AAAA,IACT,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,YAAY;AAAA,IAEZ,WAAW;AAAA,MACT,iBAAiB,MAAM,OAAO;AAAA,MAC9B,cAAc,MAAM,MAAM;AAAA,IAC5B;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,YAAY,EAAE,OAAO,MAAM,OAAO,cAAc,QAAQ,cAAc;AAAA,EACxE;AAAA,EACA,cAAc;AAAA,IACZ,GAAG;AAAA,IAEH,SAAS;AAAA,MACP,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,IAEA,CAAC,uBAAuB,GAAG;AAAA,MACzB,SAAS;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,kBAAkB;AAAA,IAChB,cAAc,aAAa,MAAM,OAAO,QAAQ;AAAA,IAEhD,WAAW;AAAA,MACT,wBAAwB;AAAA,MACxB,yBAAyB;AAAA,IAC3B;AAAA,EACF;AAAA,EACA,UAAU,EAAE,QAAQ,OAAO;AAAA,EAC3B,iBAAiB;AAAA,IACf,cAAc,aAAa,MAAM,OAAO,QAAQ;AAAA,IAChD,wBAAwB;AAAA,IACxB,yBAAyB;AAAA,EAC3B;AAAA,EACA,OAAO;AAAA,IACL,UAAU;AAAA,IACV,cAAc;AAAA,IACd,eAAe;AAAA,IACf,cAAc,MAAM,MAAM;AAAA,IAC1B,YAAY;AAAA,IACZ,GAAG,MAAM,WAAW;AAAA,IACpB,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,OAAO;AAAA,EACT;AAAA,EACA,SAAS,CAAC;AAAA,EACV,eAAe,CAAC;AAAA,EAChB,UAAU,CAAC;AACb,CAAC;"}
@@ -24,7 +24,7 @@ const { staticClasses, useClasses } = createClasses("HvList", {
24
24
  item: {},
25
25
  itemSelector: {
26
26
  "&:not(:hover):not(.HvIsFocused):not(:focus-within)": {
27
- backgroundColor: theme.colors.primary_20
27
+ backgroundColor: theme.colors.containerBackgroundHover
28
28
  }
29
29
  },
30
30
  link: {
@@ -1 +1 @@
1
- {"version":3,"file":"List.styles.js","sources":["../../../src/List/List.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvList\", {\n root: {},\n virtualizedRoot: { marginBottom: 5 },\n selectorRoot: { width: \"100%\", zIndex: 0 },\n selectorContainer: {\n \"&:hover\": {\n backgroundColor: \"transparent\",\n },\n\n \"&:focus-within\": {\n backgroundColor: \"transparent\",\n outline: \"none\",\n boxShadow: \"none\",\n },\n },\n box: { width: \"32px\", height: \"32px\", marginLeft: \"auto\" },\n truncate: {\n display: \"inline-block\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n },\n item: {},\n itemSelector: {\n \"&:not(:hover):not(.HvIsFocused):not(:focus-within)\": {\n backgroundColor: theme.colors.primary_20,\n },\n },\n link: {\n ...theme.typography.body,\n textDecoration: \"none\",\n\n \"&:focus\": {\n boxShadow: \"unset !important\",\n },\n },\n selectAllSelector: {\n width: \"100%\",\n margin: \"0 0 2px 0\",\n\n position: \"relative\",\n zIndex: 0,\n\n // prevent the focus ring to be hidden by sibling hover background\n \"&:focus-within\": {\n zIndex: 1,\n },\n },\n});\n"],"names":[],"mappings":";;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,UAAU;AAAA,EACnE,MAAM,CAAC;AAAA,EACP,iBAAiB,EAAE,cAAc,EAAE;AAAA,EACnC,cAAc,EAAE,OAAO,QAAQ,QAAQ,EAAE;AAAA,EACzC,mBAAmB;AAAA,IACjB,WAAW;AAAA,MACT,iBAAiB;AAAA,IACnB;AAAA,IAEA,kBAAkB;AAAA,MAChB,iBAAiB;AAAA,MACjB,SAAS;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,KAAK,EAAE,OAAO,QAAQ,QAAQ,QAAQ,YAAY,OAAO;AAAA,EACzD,UAAU;AAAA,IACR,SAAS;AAAA,IACT,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,MAAM,CAAC;AAAA,EACP,cAAc;AAAA,IACZ,sDAAsD;AAAA,MACpD,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,MAAM;AAAA,IACJ,GAAG,MAAM,WAAW;AAAA,IACpB,gBAAgB;AAAA,IAEhB,WAAW;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,mBAAmB;AAAA,IACjB,OAAO;AAAA,IACP,QAAQ;AAAA,IAER,UAAU;AAAA,IACV,QAAQ;AAAA;AAAA,IAGR,kBAAkB;AAAA,MAChB,QAAQ;AAAA,IACV;AAAA,EACF;AACF,CAAC;"}
1
+ {"version":3,"file":"List.styles.js","sources":["../../../src/List/List.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvList\", {\n root: {},\n virtualizedRoot: { marginBottom: 5 },\n selectorRoot: { width: \"100%\", zIndex: 0 },\n selectorContainer: {\n \"&:hover\": {\n backgroundColor: \"transparent\",\n },\n\n \"&:focus-within\": {\n backgroundColor: \"transparent\",\n outline: \"none\",\n boxShadow: \"none\",\n },\n },\n box: { width: \"32px\", height: \"32px\", marginLeft: \"auto\" },\n truncate: {\n display: \"inline-block\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n },\n item: {},\n itemSelector: {\n \"&:not(:hover):not(.HvIsFocused):not(:focus-within)\": {\n backgroundColor: theme.colors.containerBackgroundHover,\n },\n },\n link: {\n ...theme.typography.body,\n textDecoration: \"none\",\n\n \"&:focus\": {\n boxShadow: \"unset !important\",\n },\n },\n selectAllSelector: {\n width: \"100%\",\n margin: \"0 0 2px 0\",\n\n position: \"relative\",\n zIndex: 0,\n\n // prevent the focus ring to be hidden by sibling hover background\n \"&:focus-within\": {\n zIndex: 1,\n },\n },\n});\n"],"names":[],"mappings":";;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,UAAU;AAAA,EACnE,MAAM,CAAC;AAAA,EACP,iBAAiB,EAAE,cAAc,EAAE;AAAA,EACnC,cAAc,EAAE,OAAO,QAAQ,QAAQ,EAAE;AAAA,EACzC,mBAAmB;AAAA,IACjB,WAAW;AAAA,MACT,iBAAiB;AAAA,IACnB;AAAA,IAEA,kBAAkB;AAAA,MAChB,iBAAiB;AAAA,MACjB,SAAS;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,KAAK,EAAE,OAAO,QAAQ,QAAQ,QAAQ,YAAY,OAAO;AAAA,EACzD,UAAU;AAAA,IACR,SAAS;AAAA,IACT,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,MAAM,CAAC;AAAA,EACP,cAAc;AAAA,IACZ,sDAAsD;AAAA,MACpD,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,MAAM;AAAA,IACJ,GAAG,MAAM,WAAW;AAAA,IACpB,gBAAgB;AAAA,IAEhB,WAAW;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,mBAAmB;AAAA,IACjB,OAAO;AAAA,IACP,QAAQ;AAAA,IAER,UAAU;AAAA,IACV,QAAQ;AAAA;AAAA,IAGR,kBAAkB;AAAA,MAChB,QAAQ;AAAA,IACV;AAAA,EACF;AACF,CAAC;"}
@@ -0,0 +1,38 @@
1
+ import { jsxs, jsx } from "@emotion/react/jsx-runtime";
2
+ import { useDefaultProps } from "../hooks/useDefaultProps.js";
3
+ import { useClasses } from "./LoadingContainer.styles.js";
4
+ import { staticClasses } from "./LoadingContainer.styles.js";
5
+ import { HvLoading } from "../Loading/Loading.js";
6
+ const HvLoadingContainer = (props) => {
7
+ const {
8
+ children,
9
+ className,
10
+ classes: classesProp,
11
+ hidden,
12
+ small,
13
+ label,
14
+ "aria-label": ariaLabel = label || "Loading",
15
+ opacity,
16
+ ...others
17
+ } = useDefaultProps("HvLoadingContainer", props);
18
+ const { classes, cx } = useClasses(classesProp);
19
+ return /* @__PURE__ */ jsxs("div", { className: cx(classes.root, className), ...others, children: [
20
+ /* @__PURE__ */ jsx(
21
+ HvLoading,
22
+ {
23
+ className: classes.loading,
24
+ role: "progressbar",
25
+ small,
26
+ label,
27
+ hidden,
28
+ "aria-label": ariaLabel,
29
+ style: opacity ? { ["--opacity"]: opacity } : void 0
30
+ }
31
+ ),
32
+ children
33
+ ] });
34
+ };
35
+ export {
36
+ HvLoadingContainer,
37
+ staticClasses as loadingContainerClasses
38
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LoadingContainer.js","sources":["../../../src/LoadingContainer/LoadingContainer.tsx"],"sourcesContent":["import { ExtractNames } from \"../utils/classes\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvLoading, HvLoadingProps } from \"../Loading\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { staticClasses, useClasses } from \"./LoadingContainer.styles\";\n\nexport { staticClasses as loadingContainerClasses };\n\nexport type HvLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingContainerProps\n extends HvBaseProps<HTMLDivElement>,\n Pick<HvLoadingProps, \"label\" | \"small\" | \"hidden\"> {\n opacity?: number;\n classes?: HvLoadingContainerClasses;\n}\n\n/**\n * A component that wraps `children` with an `HvLoading` component and\n * and an overlay background with opacity.\n *\n * @example\n * <HvLoadingContainer label=\"Loading...\" hidden={!isLoading}>\n * <MyComponent>\n * </HvLoadingContainer>\n * */\nexport const HvLoadingContainer = (props: HvLoadingContainerProps) => {\n const {\n children,\n className,\n classes: classesProp,\n hidden,\n small,\n label,\n \"aria-label\": ariaLabel = label || \"Loading\",\n opacity,\n ...others\n } = useDefaultProps(\"HvLoadingContainer\", props);\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <div className={cx(classes.root, className)} {...others}>\n <HvLoading\n className={classes.loading}\n role=\"progressbar\"\n small={small}\n label={label}\n hidden={hidden}\n aria-label={ariaLabel}\n style={opacity ? { [\"--opacity\" as string]: opacity } : undefined}\n />\n {children}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;AA0Ba,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc,YAAY,SAAS;AAAA,IACnC;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,sBAAsB,KAAK;AAC/C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA,qBAAC,SAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,MAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,OAAO,UAAU,EAAE,CAAC,WAAqB,GAAG,YAAY;AAAA,MAAA;AAAA,IAC1D;AAAA,IACC;AAAA,EACH,EAAA,CAAA;AAEJ;"}
@@ -0,0 +1,20 @@
1
+ import { theme } from "@hitachivantara/uikit-styles";
2
+ import { createClasses } from "../utils/classes.js";
3
+ const { staticClasses, useClasses } = createClasses("HvLoadingContainer", {
4
+ root: {
5
+ position: "relative",
6
+ height: "inherit",
7
+ userSelect: "none"
8
+ },
9
+ loading: {
10
+ position: "absolute",
11
+ inset: 0,
12
+ zIndex: theme.zIndices.overlay,
13
+ transition: "background-color .2s ease",
14
+ backgroundColor: theme.alpha("atmo1", "var(--opacity, 0.8)")
15
+ }
16
+ });
17
+ export {
18
+ staticClasses,
19
+ useClasses
20
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LoadingContainer.styles.js","sources":["../../../src/LoadingContainer/LoadingContainer.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nconst { staticClasses, useClasses } = createClasses(\"HvLoadingContainer\", {\n root: {\n position: \"relative\",\n height: \"inherit\",\n userSelect: \"none\",\n },\n loading: {\n position: \"absolute\",\n inset: 0,\n zIndex: theme.zIndices.overlay,\n transition: \"background-color .2s ease\",\n backgroundColor: theme.alpha(\"atmo1\", \"var(--opacity, 0.8)\"),\n },\n});\n\nexport { staticClasses, useClasses };\n"],"names":[],"mappings":";;AAIA,MAAM,EAAE,eAAe,eAAe,cAAc,sBAAsB;AAAA,EACxE,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,YAAY;AAAA,EACd;AAAA,EACA,SAAS;AAAA,IACP,UAAU;AAAA,IACV,OAAO;AAAA,IACP,QAAQ,MAAM,SAAS;AAAA,IACvB,YAAY;AAAA,IACZ,iBAAiB,MAAM,MAAM,SAAS,qBAAqB;AAAA,EAC7D;AACF,CAAC;"}
package/dist/esm/index.js CHANGED
@@ -192,62 +192,64 @@ import { staticClasses as staticClasses70 } from "./List/List.styles.js";
192
192
  import { HvList } from "./List/List.js";
193
193
  import { staticClasses as staticClasses71 } from "./Loading/Loading.styles.js";
194
194
  import { HvLoading } from "./Loading/Loading.js";
195
- import { staticClasses as staticClasses72 } from "./Login/Login.styles.js";
195
+ import { staticClasses as staticClasses72 } from "./LoadingContainer/LoadingContainer.styles.js";
196
+ import { HvLoadingContainer } from "./LoadingContainer/LoadingContainer.js";
197
+ import { staticClasses as staticClasses73 } from "./Login/Login.styles.js";
196
198
  import { HvLogin } from "./Login/Login.js";
197
- import { staticClasses as staticClasses73 } from "./MultiButton/MultiButton.styles.js";
199
+ import { staticClasses as staticClasses74 } from "./MultiButton/MultiButton.styles.js";
198
200
  import { HvMultiButton } from "./MultiButton/MultiButton.js";
199
- import { staticClasses as staticClasses74 } from "./OverflowTooltip/OverflowTooltip.styles.js";
201
+ import { staticClasses as staticClasses75 } from "./OverflowTooltip/OverflowTooltip.styles.js";
200
202
  import { HvOverflowTooltip } from "./OverflowTooltip/OverflowTooltip.js";
201
- import { staticClasses as staticClasses75 } from "./Pagination/Pagination.styles.js";
203
+ import { staticClasses as staticClasses76 } from "./Pagination/Pagination.styles.js";
202
204
  import { HvPagination } from "./Pagination/Pagination.js";
203
- import { staticClasses as staticClasses76 } from "./Panel/Panel.styles.js";
205
+ import { staticClasses as staticClasses77 } from "./Panel/Panel.styles.js";
204
206
  import { HvPanel } from "./Panel/Panel.js";
205
- import { staticClasses as staticClasses77 } from "./ProgressBar/ProgressBar.styles.js";
207
+ import { staticClasses as staticClasses78 } from "./ProgressBar/ProgressBar.styles.js";
206
208
  import { HvProgressBar } from "./ProgressBar/ProgressBar.js";
207
209
  import { defaultCombinators, defaultLabels, defaultOperators, useQueryBuilderContext } from "./QueryBuilder/Context.js";
208
- import { staticClasses as staticClasses78 } from "./QueryBuilder/QueryBuilder.styles.js";
210
+ import { staticClasses as staticClasses79 } from "./QueryBuilder/QueryBuilder.styles.js";
209
211
  import { HvQueryBuilder } from "./QueryBuilder/QueryBuilder.js";
210
- import { staticClasses as staticClasses79 } from "./Radio/Radio.styles.js";
212
+ import { staticClasses as staticClasses80 } from "./Radio/Radio.styles.js";
211
213
  import { HvRadio } from "./Radio/Radio.js";
212
- import { staticClasses as staticClasses80 } from "./RadioGroup/RadioGroup.styles.js";
214
+ import { staticClasses as staticClasses81 } from "./RadioGroup/RadioGroup.styles.js";
213
215
  import { HvRadioGroup } from "./RadioGroup/RadioGroup.js";
214
- import { staticClasses as staticClasses81 } from "./ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.js";
215
- import { staticClasses as staticClasses82 } from "./ScrollTo/Vertical/ScrollToVertical.styles.js";
216
+ import { staticClasses as staticClasses82 } from "./ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.js";
217
+ import { staticClasses as staticClasses83 } from "./ScrollTo/Vertical/ScrollToVertical.styles.js";
216
218
  import { HvScrollToVertical } from "./ScrollTo/Vertical/ScrollToVertical.js";
217
- import { staticClasses as staticClasses83 } from "./ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.styles.js";
218
- import { staticClasses as staticClasses84 } from "./ScrollTo/Horizontal/ScrollToHorizontal.styles.js";
219
+ import { staticClasses as staticClasses84 } from "./ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.styles.js";
220
+ import { staticClasses as staticClasses85 } from "./ScrollTo/Horizontal/ScrollToHorizontal.styles.js";
219
221
  import { HvScrollToHorizontal } from "./ScrollTo/Horizontal/ScrollToHorizontal.js";
220
- import { staticClasses as staticClasses85 } from "./Section/Section.styles.js";
222
+ import { staticClasses as staticClasses86 } from "./Section/Section.styles.js";
221
223
  import { HvSection } from "./Section/Section.js";
222
- import { staticClasses as staticClasses86 } from "./SimpleGrid/SimpleGrid.styles.js";
224
+ import { staticClasses as staticClasses87 } from "./SimpleGrid/SimpleGrid.styles.js";
223
225
  import { HvSimpleGrid } from "./SimpleGrid/SimpleGrid.js";
224
- import { staticClasses as staticClasses87 } from "./Slider/Slider.styles.js";
226
+ import { staticClasses as staticClasses88 } from "./Slider/Slider.styles.js";
225
227
  import { HvSlider } from "./Slider/Slider.js";
226
- import { staticClasses as staticClasses88 } from "./Snackbar/Snackbar.styles.js";
228
+ import { staticClasses as staticClasses89 } from "./Snackbar/Snackbar.styles.js";
227
229
  import { HvSnackbar } from "./Snackbar/Snackbar.js";
228
- import { staticClasses as staticClasses89 } from "./Snackbar/SnackbarContent/SnackbarContent.styles.js";
230
+ import { staticClasses as staticClasses90 } from "./Snackbar/SnackbarContent/SnackbarContent.styles.js";
229
231
  import { HvSnackbarContent } from "./Snackbar/SnackbarContent/SnackbarContent.js";
230
- import { staticClasses as staticClasses90 } from "./SnackbarProvider/SnackbarProvider.styles.js";
232
+ import { staticClasses as staticClasses91 } from "./SnackbarProvider/SnackbarProvider.styles.js";
231
233
  import { HvSnackbarProvider, useHvSnackbar } from "./SnackbarProvider/SnackbarProvider.js";
232
- import { staticClasses as staticClasses91 } from "./Stack/Stack.styles.js";
234
+ import { staticClasses as staticClasses92 } from "./Stack/Stack.styles.js";
233
235
  import { HvStack } from "./Stack/Stack.js";
234
- import { staticClasses as staticClasses92 } from "./Switch/Switch.styles.js";
236
+ import { staticClasses as staticClasses93 } from "./Switch/Switch.styles.js";
235
237
  import { HvSwitch } from "./Switch/Switch.js";
236
- import { staticClasses as staticClasses93 } from "./Tab/Tab.styles.js";
238
+ import { staticClasses as staticClasses94 } from "./Tab/Tab.styles.js";
237
239
  import { HvTab } from "./Tab/Tab.js";
238
- import { staticClasses as staticClasses94 } from "./Table/Table.styles.js";
240
+ import { staticClasses as staticClasses95 } from "./Table/Table.styles.js";
239
241
  import { HvTable } from "./Table/Table.js";
240
- import { staticClasses as staticClasses95 } from "./Table/TableContainer/TableContainer.styles.js";
242
+ import { staticClasses as staticClasses96 } from "./Table/TableContainer/TableContainer.styles.js";
241
243
  import { HvTableContainer } from "./Table/TableContainer/TableContainer.js";
242
- import { staticClasses as staticClasses96 } from "./Table/TableBody/TableBody.styles.js";
244
+ import { staticClasses as staticClasses97 } from "./Table/TableBody/TableBody.styles.js";
243
245
  import { HvTableBody } from "./Table/TableBody/TableBody.js";
244
- import { staticClasses as staticClasses97 } from "./Table/TableHead/TableHead.styles.js";
246
+ import { staticClasses as staticClasses98 } from "./Table/TableHead/TableHead.styles.js";
245
247
  import { HvTableHead } from "./Table/TableHead/TableHead.js";
246
- import { staticClasses as staticClasses98 } from "./Table/TableHeader/TableHeader.styles.js";
248
+ import { staticClasses as staticClasses99 } from "./Table/TableHeader/TableHeader.styles.js";
247
249
  import { HvTableHeader } from "./Table/TableHeader/TableHeader.js";
248
- import { staticClasses as staticClasses99 } from "./Table/TableRow/TableRow.styles.js";
250
+ import { staticClasses as staticClasses100 } from "./Table/TableRow/TableRow.styles.js";
249
251
  import { HvTableRow } from "./Table/TableRow/TableRow.js";
250
- import { staticClasses as staticClasses100 } from "./Table/TableCell/TableCell.styles.js";
252
+ import { staticClasses as staticClasses101 } from "./Table/TableCell/TableCell.styles.js";
251
253
  import { HvTableCell } from "./Table/TableCell/TableCell.js";
252
254
  import { getHeaderFooterPropsHook, default as default4 } from "./Table/hooks/useTableStyles.js";
253
255
  import { default as default5 } from "./Table/hooks/useSortBy.js";
@@ -268,47 +270,47 @@ import { HvProgressColumnCell, normalizeProgressBar } from "./Table/renderers/Pr
268
270
  import { HvSwitchColumnCell } from "./Table/renderers/SwitchColumnCell/SwitchColumnCell.js";
269
271
  import { hvNodeFallback, hvNumberFallback, hvStringFallback } from "./Table/utils/fallbacks.js";
270
272
  import { getBorderStyles } from "./Table/utils/utils.js";
271
- import { staticClasses as staticClasses101 } from "./Tabs/Tabs.styles.js";
273
+ import { staticClasses as staticClasses102 } from "./Tabs/Tabs.styles.js";
272
274
  import { HvTabs } from "./Tabs/Tabs.js";
273
- import { staticClasses as staticClasses102 } from "./Tag/Tag.styles.js";
275
+ import { staticClasses as staticClasses103 } from "./Tag/Tag.styles.js";
274
276
  import { HvTag } from "./Tag/Tag.js";
275
- import { staticClasses as staticClasses103 } from "./TagsInput/TagsInput.styles.js";
277
+ import { staticClasses as staticClasses104 } from "./TagsInput/TagsInput.styles.js";
276
278
  import { HvTagsInput } from "./TagsInput/TagsInput.js";
277
- import { staticClasses as staticClasses104 } from "./TextArea/TextArea.styles.js";
279
+ import { staticClasses as staticClasses105 } from "./TextArea/TextArea.styles.js";
278
280
  import { HvTextArea } from "./TextArea/TextArea.js";
279
- import { staticClasses as staticClasses105 } from "./TimeAgo/TimeAgo.styles.js";
281
+ import { staticClasses as staticClasses106 } from "./TimeAgo/TimeAgo.styles.js";
280
282
  import { HvTimeAgo } from "./TimeAgo/TimeAgo.js";
281
- import { staticClasses as staticClasses106 } from "./TimePicker/TimePicker.styles.js";
283
+ import { staticClasses as staticClasses107 } from "./TimePicker/TimePicker.styles.js";
282
284
  import { HvTimePicker } from "./TimePicker/TimePicker.js";
283
285
  import { HvToggleButton } from "./ToggleButton/ToggleButton.js";
284
- import { staticClasses as staticClasses107 } from "./Tooltip/Tooltip.styles.js";
286
+ import { staticClasses as staticClasses108 } from "./Tooltip/Tooltip.styles.js";
285
287
  import { HvTooltip } from "./Tooltip/Tooltip.js";
286
- import { staticClasses as staticClasses108 } from "./TreeView/TreeView.styles.js";
288
+ import { staticClasses as staticClasses109 } from "./TreeView/TreeView.styles.js";
287
289
  import { HvTreeView } from "./TreeView/TreeView.js";
288
- import { staticClasses as staticClasses109 } from "./TreeView/TreeItem/TreeItem.styles.js";
290
+ import { staticClasses as staticClasses110 } from "./TreeView/TreeItem/TreeItem.styles.js";
289
291
  import { HvTreeItem } from "./TreeView/TreeItem/TreeItem.js";
290
292
  import { useHvTreeItem } from "./TreeView/TreeItem/useHvTreeItem.js";
291
- import { staticClasses as staticClasses110 } from "./VerticalNavigation/VerticalNavigation.styles.js";
293
+ import { staticClasses as staticClasses111 } from "./VerticalNavigation/VerticalNavigation.styles.js";
292
294
  import { HvVerticalNavigation } from "./VerticalNavigation/VerticalNavigation.js";
293
- import { staticClasses as staticClasses111 } from "./VerticalNavigation/Header/Header.styles.js";
295
+ import { staticClasses as staticClasses112 } from "./VerticalNavigation/Header/Header.styles.js";
294
296
  import { HvVerticalNavigationHeader } from "./VerticalNavigation/Header/Header.js";
295
- import { staticClasses as staticClasses112 } from "./VerticalNavigation/Actions/Actions.styles.js";
297
+ import { staticClasses as staticClasses113 } from "./VerticalNavigation/Actions/Actions.styles.js";
296
298
  import { HvVerticalNavigationActions } from "./VerticalNavigation/Actions/Actions.js";
297
- import { staticClasses as staticClasses113 } from "./VerticalNavigation/Actions/Action.styles.js";
299
+ import { staticClasses as staticClasses114 } from "./VerticalNavigation/Actions/Action.styles.js";
298
300
  import { HvVerticalNavigationAction } from "./VerticalNavigation/Actions/Action.js";
299
- import { staticClasses as staticClasses114 } from "./VerticalNavigation/Navigation/Navigation.styles.js";
301
+ import { staticClasses as staticClasses115 } from "./VerticalNavigation/Navigation/Navigation.styles.js";
300
302
  import { HvVerticalNavigationTree } from "./VerticalNavigation/Navigation/Navigation.js";
301
- import { staticClasses as staticClasses115 } from "./VerticalNavigation/NavigationSlider/NavigationSlider.styles.js";
303
+ import { staticClasses as staticClasses116 } from "./VerticalNavigation/NavigationSlider/NavigationSlider.styles.js";
302
304
  import { HvVerticalNavigationSlider } from "./VerticalNavigation/NavigationSlider/NavigationSlider.js";
303
- import { staticClasses as staticClasses116 } from "./VerticalNavigation/TreeView/TreeView.styles.js";
305
+ import { staticClasses as staticClasses117 } from "./VerticalNavigation/TreeView/TreeView.styles.js";
304
306
  import { HvVerticalNavigationTreeView } from "./VerticalNavigation/TreeView/TreeView.js";
305
- import { staticClasses as staticClasses117 } from "./VerticalNavigation/TreeView/TreeViewItem.styles.js";
307
+ import { staticClasses as staticClasses118 } from "./VerticalNavigation/TreeView/TreeViewItem.styles.js";
306
308
  import { HvVerticalNavigationTreeViewItem } from "./VerticalNavigation/TreeView/TreeViewItem.js";
307
309
  import { VerticalNavigationContext } from "./VerticalNavigation/VerticalNavigationContext.js";
308
- import { staticClasses as staticClasses118 } from "./TableSection/TableSection.styles.js";
310
+ import { staticClasses as staticClasses119 } from "./TableSection/TableSection.styles.js";
309
311
  import { HvTableSection } from "./TableSection/TableSection.js";
310
312
  import { HvIconButton } from "./IconButton/IconButton.js";
311
- import { staticClasses as staticClasses119 } from "./Skeleton/Skeleton.styles.js";
313
+ import { staticClasses as staticClasses120 } from "./Skeleton/Skeleton.styles.js";
312
314
  import { HvSkeleton } from "./Skeleton/Skeleton.js";
313
315
  import { EmotionContext, HvThemeContext, defaultCacheKey, defaultEmotionCache } from "@hitachivantara/uikit-react-shared";
314
316
  export {
@@ -399,6 +401,7 @@ export {
399
401
  HvListContainer,
400
402
  HvListItem,
401
403
  HvLoading,
404
+ HvLoadingContainer,
402
405
  HvLogin,
403
406
  HvMultiButton,
404
407
  HvOption,
@@ -463,8 +466,8 @@ export {
463
466
  VerticalNavigationContext,
464
467
  staticClasses16 as accordionClasses,
465
468
  staticClasses17 as actionBarClasses,
466
- staticClasses113 as actionClasses,
467
- staticClasses112 as actionsClasses,
469
+ staticClasses114 as actionClasses,
470
+ staticClasses113 as actionsClasses,
468
471
  staticClasses18 as actionsGenericClasses,
469
472
  staticClasses6 as adornmentClasses,
470
473
  staticClasses20 as appSwitcherActionClasses,
@@ -552,7 +555,7 @@ export {
552
555
  staticClasses62 as headerClasses,
553
556
  staticClasses65 as headerNavigationClasses,
554
557
  hexToRgbA,
555
- staticClasses83 as horizontalScrollListItemClasses,
558
+ staticClasses84 as horizontalScrollListItemClasses,
556
559
  hvDateColumn,
557
560
  hvDropdownColumn,
558
561
  hvExpandColumn,
@@ -585,65 +588,66 @@ export {
585
588
  staticClasses3 as listContainerClasses,
586
589
  staticClasses4 as listItemClasses,
587
590
  staticClasses71 as loadingClasses,
588
- staticClasses72 as loginClasses,
589
- staticClasses73 as multiButtonClasses,
591
+ staticClasses72 as loadingContainerClasses,
592
+ staticClasses73 as loginClasses,
593
+ staticClasses74 as multiButtonClasses,
590
594
  multiSelectionEventHandler,
591
595
  normalizeProgressBar,
592
596
  optionClasses,
593
597
  optionGroupClasses,
594
598
  outlineStyles,
595
- staticClasses74 as overflowTooltipClasses,
596
- staticClasses75 as paginationClasses,
597
- staticClasses76 as panelClasses,
599
+ staticClasses75 as overflowTooltipClasses,
600
+ staticClasses76 as paginationClasses,
601
+ staticClasses77 as panelClasses,
598
602
  pentahoPlus,
599
603
  prepareRow,
600
604
  processThemes,
601
- staticClasses77 as progressBarClasses,
602
- staticClasses78 as queryBuilderClasses,
603
- staticClasses79 as radioClasses,
604
- staticClasses80 as radioGroupClasses,
605
+ staticClasses78 as progressBarClasses,
606
+ staticClasses79 as queryBuilderClasses,
607
+ staticClasses80 as radioClasses,
608
+ staticClasses81 as radioGroupClasses,
605
609
  reducer,
606
610
  replace$,
607
611
  staticClasses45 as rightControlClasses,
608
- staticClasses84 as scrollToHorizontalClasses,
609
- staticClasses82 as scrollToVerticalClasses,
610
- staticClasses85 as sectionClasses,
612
+ staticClasses85 as scrollToHorizontalClasses,
613
+ staticClasses83 as scrollToVerticalClasses,
614
+ staticClasses86 as sectionClasses,
611
615
  staticClasses11 as selectClasses,
612
616
  staticClasses12 as selectionListClasses,
613
617
  setElementAttrs,
614
618
  setId,
615
619
  setUid,
616
- staticClasses86 as simpleGridClasses,
617
- staticClasses119 as skeletonClasses,
618
- staticClasses87 as sliderClasses,
619
- staticClasses88 as snackbarClasses,
620
- staticClasses89 as snackbarContentClasses,
621
- staticClasses90 as snackbarProviderClasses,
622
- staticClasses91 as stackClasses,
620
+ staticClasses87 as simpleGridClasses,
621
+ staticClasses120 as skeletonClasses,
622
+ staticClasses88 as sliderClasses,
623
+ staticClasses89 as snackbarClasses,
624
+ staticClasses90 as snackbarContentClasses,
625
+ staticClasses91 as snackbarProviderClasses,
626
+ staticClasses92 as stackClasses,
623
627
  staticClasses13 as suggestionsClasses,
624
- staticClasses92 as switchClasses,
625
- staticClasses93 as tabClasses,
626
- staticClasses96 as tableBodyClasses,
627
- staticClasses100 as tableCellClasses,
628
- staticClasses94 as tableClasses,
629
- staticClasses95 as tableContainerClasses,
630
- staticClasses97 as tableHeadClasses,
631
- staticClasses98 as tableHeaderClasses,
632
- staticClasses99 as tableRowClasses,
633
- staticClasses118 as tableSectionClasses,
634
- staticClasses101 as tabsClasses,
635
- staticClasses102 as tagClasses,
636
- staticClasses103 as tagsInputClasses,
637
- staticClasses104 as textAreaClasses,
628
+ staticClasses93 as switchClasses,
629
+ staticClasses94 as tabClasses,
630
+ staticClasses97 as tableBodyClasses,
631
+ staticClasses101 as tableCellClasses,
632
+ staticClasses95 as tableClasses,
633
+ staticClasses96 as tableContainerClasses,
634
+ staticClasses98 as tableHeadClasses,
635
+ staticClasses99 as tableHeaderClasses,
636
+ staticClasses100 as tableRowClasses,
637
+ staticClasses119 as tableSectionClasses,
638
+ staticClasses102 as tabsClasses,
639
+ staticClasses103 as tagClasses,
640
+ staticClasses104 as tagsInputClasses,
641
+ staticClasses105 as textAreaClasses,
638
642
  theme,
639
643
  themes,
640
- staticClasses105 as timeAgoClasses,
641
- staticClasses106 as timePickerClasses,
642
- staticClasses107 as tooltipClasses,
643
- staticClasses109 as treeItemClasses,
644
- staticClasses108 as treeView2Classes,
645
- staticClasses116 as treeViewClasses,
646
- staticClasses117 as treeViewItemClasses,
644
+ staticClasses106 as timeAgoClasses,
645
+ staticClasses107 as timePickerClasses,
646
+ staticClasses108 as tooltipClasses,
647
+ staticClasses110 as treeItemClasses,
648
+ staticClasses109 as treeView2Classes,
649
+ staticClasses117 as treeViewClasses,
650
+ staticClasses118 as treeViewItemClasses,
647
651
  staticClasses as typographyClasses,
648
652
  typographyVariants,
649
653
  useClickOutside,
@@ -679,11 +683,11 @@ export {
679
683
  useTheme,
680
684
  useUniqueId,
681
685
  useWidth,
682
- staticClasses110 as verticalNavigationClasses,
683
- staticClasses111 as verticalNavigationHeaderClasses,
684
- staticClasses115 as verticalNavigationSliderClasses,
685
- staticClasses114 as verticalNavigationTreeClasses,
686
- staticClasses81 as verticalScrollListItemClasses,
686
+ staticClasses111 as verticalNavigationClasses,
687
+ staticClasses112 as verticalNavigationHeaderClasses,
688
+ staticClasses116 as verticalNavigationSliderClasses,
689
+ staticClasses115 as verticalNavigationTreeClasses,
690
+ staticClasses82 as verticalScrollListItemClasses,
687
691
  staticClasses10 as warningTextClasses,
688
692
  withTooltip,
689
693
  wrapperTooltip
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}