@hitachivantara/uikit-react-core 5.60.0 → 5.62.0

package/dist/cjs/ListContainer/ListItem/ListItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.cjs","sources":["../../../../src/ListContainer/ListItem/ListItem.tsx"],"sourcesContent":["import {\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useContext,\n  useMemo,\n} from \"react\";\n\nimport { HvBaseProps } from \"../../types/generic\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { HvFocus } from \"../../Focus\";\n\nimport HvListContext from \"../ListContext\";\nimport { staticClasses, useClasses } from \"./ListItem.styles\";\n\nexport { staticClasses as listItemClasses };\n\nexport type HvListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListItemProps extends HvBaseProps<HTMLLIElement> {\n  /** Indicates if the list item is selected. */\n  selected?: boolean;\n  /** Indicated if the list item is _visually_ selectable */\n  selectable?: boolean;\n  /** If true, the list item will be disabled. */\n  disabled?: boolean;\n  /**\n   * If the list item is focusable and reacts to mouse over events.\n   * Defaults to true if the container list is interactive, false otherwise.\n   */\n  interactive?: boolean;\n  /**\n   * If `true` compacts the vertical spacing intended to separate the list items.\n   * Defaults to the value set in container list.\n   */\n  condensed?: boolean;\n  /**\n   * If `true`, the left and right padding is removed.\n   * Defaults to the value set in container list.\n   */\n  disableGutters?: boolean;\n  /**\n   * Element placed before the children.\n   * Also removes the left padding (gutter).\n   *\n   * Some modifications are applied, assuming that it is either an icon (changing the color when the item is disabled)\n   * or a selector (preventing the double focus ring, propagating the checked and disabled states and wiring the onChange event).\n   * If unwanted, the element should be placed directly as a child.\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Element placed after the children and aligned next to the margin.\n   * Also removes the right padding (gutter).\n   *\n   * Some modifications are applied, assuming that it is an icon (changing the color when the item is disabled).\n   * If unwanted, the element should be placed directly as a child.\n   */\n  endAdornment?: React.ReactNode;\n  /** The value to be set on the 'li' element */\n  value?: any;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListItemClasses;\n}\n\nconst applyClassNameAndStateToElement = (\n  element: any,\n  selected: boolean | undefined,\n  disabled: boolean | undefined,\n  onClick: React.MouseEventHandler<HTMLLIElement>,\n  className?: string\n) => {\n  if (element == null) return null;\n\n  return cloneElement(element, {\n    className,\n    checked: !!selected,\n    disabled,\n    onChange: onClick,\n  });\n};\n\nconst applyClassNameToElement = (element, className?: string) => {\n  if (element == null) return null;\n\n  return cloneElement(element, {\n    className,\n  });\n};\n\n/**\n * ListItem description/documentation paragraph\n */\nexport const HvListItem = forwardRef<any, HvListItemProps>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    role,\n    value,\n    selected,\n    disabled,\n    selectable: selectableProp,\n    interactive: interactiveProp,\n    condensed: condensedProp,\n    disableGutters: disableGuttersProp,\n    startAdornment,\n    endAdornment,\n    onClick,\n    children,\n    tabIndex,\n    ...others\n  } = useDefaultProps(\"HvListItem\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const {\n    topContainerRef,\n    condensed: condensedContext,\n    disableGutters: disableGuttersContext,\n    interactive: interactiveContext,\n    selectable: selectableContext,\n  } = useContext(HvListContext);\n\n  const condensed = condensedProp ?? condensedContext;\n  const disableGutters = disableGuttersProp ?? disableGuttersContext;\n  const interactive = interactiveProp ?? interactiveContext;\n  const selectable = selectableProp ?? selectableContext;\n\n  const handleClick = useCallback<React.MouseEventHandler<HTMLLIElement>>(\n    (evt) => {\n      if (disabled) return;\n      onClick?.(evt);\n    },\n    [disabled, onClick]\n  );\n\n  const clonedStartAdornment = useMemo(\n    () =>\n      applyClassNameAndStateToElement(\n        startAdornment,\n        selected,\n        disabled,\n        handleClick,\n        cx(\n          classes.startAdornment,\n          { [classes.disabled]: disabled },\n          isValidElement(startAdornment)\n            ? startAdornment.props.className\n            : undefined\n        )\n      ),\n    [\n      cx,\n      classes?.startAdornment,\n      classes?.disabled,\n      disabled,\n      handleClick,\n      selected,\n      startAdornment,\n    ]\n  );\n  const clonedEndAdornment = useMemo(\n    () =>\n      applyClassNameToElement(\n        endAdornment,\n        cx(\n          classes.endAdornment,\n          { [classes.disabled]: disabled },\n          isValidElement(endAdornment)\n            ? endAdornment.props.className\n            : undefined\n        )\n      ),\n    [cx, classes?.endAdornment, classes?.disabled, disabled, endAdornment]\n  );\n\n  const roleOptionAriaProps =\n    role === \"option\" || role === \"menuitem\"\n      ? {\n          \"aria-disabled\": disabled || undefined,\n          \"aria-selected\": selected,\n        }\n      : {};\n\n  const listItem = (\n    // For later: this should only have an onClick event if interactive and has the appropriate role.\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events\n    <li\n      ref={ref}\n      role={role}\n      value={value}\n      className={cx(\n        classes.root,\n        {\n          [classes.gutters]: !disableGutters,\n          [classes.condensed]: condensed,\n          [classes.interactive]: interactive || selectable,\n          [classes.selected]: selected || props[\"aria-selected\"],\n          [classes.disabled]: disabled || props[\"aria-disabled\"],\n          [classes.withStartAdornment]: startAdornment != null,\n          [classes.withEndAdornment]: endAdornment != null,\n        },\n        className\n      )}\n      tabIndex={interactive ? undefined : tabIndex}\n      onClick={handleClick}\n      {...roleOptionAriaProps}\n      {...others}\n    >\n      {clonedStartAdornment}\n      {children}\n      {clonedEndAdornment}\n    </li>\n  );\n\n  return interactive ? (\n    <HvFocus\n      rootRef={topContainerRef}\n      selected={selected}\n      disabledClass={disabled || undefined}\n      strategy={role === \"option\" ? \"listbox\" : \"menu\"}\n      classes={{ focus: classes.focus }}\n      configuration={{\n        tabIndex,\n      }}\n    >\n      {listItem}\n    </HvFocus>\n  ) : (\n    listItem\n  );\n});\n"],"names":["cloneElement","forwardRef","useDefaultProps","useClasses","useContext","HvListContext","useCallback","useMemo","isValidElement","jsxs","jsx","HvFocus"],"mappings":"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"}
+{"version":3,"file":"ListItem.cjs","sources":["../../../../src/ListContainer/ListItem/ListItem.tsx"],"sourcesContent":["import {\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useContext,\n  useMemo,\n} from \"react\";\n\nimport { HvFocus } from \"../../Focus\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport HvListContext from \"../ListContext\";\nimport { staticClasses, useClasses } from \"./ListItem.styles\";\n\nexport { staticClasses as listItemClasses };\n\nexport type HvListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListItemProps extends HvBaseProps<HTMLLIElement> {\n  /** Indicates if the list item is selected. */\n  selected?: boolean;\n  /** Indicated if the list item is _visually_ selectable */\n  selectable?: boolean;\n  /** If true, the list item will be disabled. */\n  disabled?: boolean;\n  /**\n   * If the list item is focusable and reacts to mouse over events.\n   * Defaults to true if the container list is interactive, false otherwise.\n   */\n  interactive?: boolean;\n  /**\n   * If `true` compacts the vertical spacing intended to separate the list items.\n   * Defaults to the value set in container list.\n   */\n  condensed?: boolean;\n  /**\n   * If `true`, the left and right padding is removed.\n   * Defaults to the value set in container list.\n   */\n  disableGutters?: boolean;\n  /**\n   * Element placed before the children.\n   * Also removes the left padding (gutter).\n   *\n   * Some modifications are applied, assuming that it is either an icon (changing the color when the item is disabled)\n   * or a selector (preventing the double focus ring, propagating the checked and disabled states and wiring the onChange event).\n   * If unwanted, the element should be placed directly as a child.\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Element placed after the children and aligned next to the margin.\n   * Also removes the right padding (gutter).\n   *\n   * Some modifications are applied, assuming that it is an icon (changing the color when the item is disabled).\n   * If unwanted, the element should be placed directly as a child.\n   */\n  endAdornment?: React.ReactNode;\n  /** The value to be set on the 'li' element */\n  value?: any;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListItemClasses;\n}\n\nconst applyClassNameAndStateToElement = (\n  element: any,\n  selected: boolean | undefined,\n  disabled: boolean | undefined,\n  onClick: React.MouseEventHandler<HTMLLIElement>,\n  className?: string,\n) => {\n  if (element == null) return null;\n\n  return cloneElement(element, {\n    className,\n    checked: !!selected,\n    disabled,\n    onChange: onClick,\n  });\n};\n\nconst applyClassNameToElement = (element, className?: string) => {\n  if (element == null) return null;\n\n  return cloneElement(element, {\n    className,\n  });\n};\n\n/**\n * ListItem description/documentation paragraph\n */\nexport const HvListItem = forwardRef<any, HvListItemProps>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    role,\n    value,\n    selected,\n    disabled,\n    selectable: selectableProp,\n    interactive: interactiveProp,\n    condensed: condensedProp,\n    disableGutters: disableGuttersProp,\n    startAdornment,\n    endAdornment,\n    onClick,\n    children,\n    tabIndex,\n    ...others\n  } = useDefaultProps(\"HvListItem\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const {\n    topContainerRef,\n    condensed: condensedContext,\n    disableGutters: disableGuttersContext,\n    interactive: interactiveContext,\n    selectable: selectableContext,\n  } = useContext(HvListContext);\n\n  const condensed = condensedProp ?? condensedContext;\n  const disableGutters = disableGuttersProp ?? disableGuttersContext;\n  const interactive = interactiveProp ?? interactiveContext;\n  const selectable = selectableProp ?? selectableContext;\n\n  const handleClick = useCallback<React.MouseEventHandler<HTMLLIElement>>(\n    (evt) => {\n      if (disabled) return;\n      onClick?.(evt);\n    },\n    [disabled, onClick],\n  );\n\n  const clonedStartAdornment = useMemo(\n    () =>\n      applyClassNameAndStateToElement(\n        startAdornment,\n        selected,\n        disabled,\n        handleClick,\n        cx(\n          classes.startAdornment,\n          { [classes.disabled]: disabled },\n          isValidElement(startAdornment)\n            ? startAdornment.props.className\n            : undefined,\n        ),\n      ),\n    [\n      cx,\n      classes?.startAdornment,\n      classes?.disabled,\n      disabled,\n      handleClick,\n      selected,\n      startAdornment,\n    ],\n  );\n  const clonedEndAdornment = useMemo(\n    () =>\n      applyClassNameToElement(\n        endAdornment,\n        cx(\n          classes.endAdornment,\n          { [classes.disabled]: disabled },\n          isValidElement(endAdornment)\n            ? endAdornment.props.className\n            : undefined,\n        ),\n      ),\n    [cx, classes?.endAdornment, classes?.disabled, disabled, endAdornment],\n  );\n\n  const roleOptionAriaProps =\n    role === \"option\" || role === \"menuitem\"\n      ? {\n          \"aria-disabled\": disabled || undefined,\n          \"aria-selected\": selected,\n        }\n      : {};\n\n  const listItem = (\n    // For later: this should only have an onClick event if interactive and has the appropriate role.\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events\n    <li\n      ref={ref}\n      role={role}\n      value={value}\n      className={cx(\n        classes.root,\n        {\n          [classes.gutters]: !disableGutters,\n          [classes.condensed]: condensed,\n          [classes.interactive]: interactive || selectable,\n          [classes.selected]: selected || props[\"aria-selected\"],\n          [classes.disabled]: disabled || props[\"aria-disabled\"],\n          [classes.withStartAdornment]: startAdornment != null,\n          [classes.withEndAdornment]: endAdornment != null,\n        },\n        className,\n      )}\n      tabIndex={interactive ? undefined : tabIndex}\n      onClick={handleClick}\n      {...roleOptionAriaProps}\n      {...others}\n    >\n      {clonedStartAdornment}\n      {children}\n      {clonedEndAdornment}\n    </li>\n  );\n\n  return interactive ? (\n    <HvFocus\n      rootRef={topContainerRef}\n      selected={selected}\n      disabledClass={disabled || undefined}\n      strategy={role === \"option\" ? \"listbox\" : \"menu\"}\n      classes={{ focus: classes.focus }}\n      configuration={{\n        tabIndex,\n      }}\n    >\n      {listItem}\n    </HvFocus>\n  ) : (\n    listItem\n  );\n});\n"],"names":["cloneElement","forwardRef","useDefaultProps","useClasses","useContext","HvListContext","useCallback","useMemo","isValidElement","jsxs","jsx","HvFocus"],"mappings":";;;;;;;;AAiEA,MAAM,kCAAkC,CACtC,SACA,UACA,UACA,SACA,cACG;AACH,MAAI,WAAW;AAAa,WAAA;AAE5B,SAAOA,MAAAA,aAAa,SAAS;AAAA,IAC3B;AAAA,IACA,SAAS,CAAC,CAAC;AAAA,IACX;AAAA,IACA,UAAU;AAAA,EAAA,CACX;AACH;AAEA,MAAM,0BAA0B,CAAC,SAAS,cAAuB;AAC/D,MAAI,WAAW;AAAa,WAAA;AAE5B,SAAOA,MAAAA,aAAa,SAAS;AAAA,IAC3B;AAAA,EAAA,CACD;AACH;AAKO,MAAM,aAAaC,MAAA,WAAiC,CAAC,OAAO,QAAQ;AACnE,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,aAAa;AAAA,IACb,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDC,gBAAgB,gBAAA,cAAc,KAAK;AAEvC,QAAM,EAAE,SAAS,GAAG,IAAIC,2BAAW,WAAW;AAExC,QAAA;AAAA,IACJ;AAAA,IACA,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,aAAa;AAAA,IACb,YAAY;AAAA,EAAA,IACVC,MAAAA,WAAWC,YAAAA,OAAa;AAE5B,QAAM,YAAY,iBAAiB;AACnC,QAAM,iBAAiB,sBAAsB;AAC7C,QAAM,cAAc,mBAAmB;AACvC,QAAM,aAAa,kBAAkB;AAErC,QAAM,cAAcC,MAAA;AAAA,IAClB,CAAC,QAAQ;AACH,UAAA;AAAU;AACd,gBAAU,GAAG;AAAA,IACf;AAAA,IACA,CAAC,UAAU,OAAO;AAAA,EAAA;AAGpB,QAAM,uBAAuBC,MAAA;AAAA,IAC3B,MACE;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,QAAQ;AAAA,QACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,SAAS;AAAA,QAC/BC,MAAe,eAAA,cAAc,IACzB,eAAe,MAAM,YACrB;AAAA,MACN;AAAA,IACF;AAAA,IACF;AAAA,MACE;AAAA,MACA,SAAS;AAAA,MACT,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAEF,QAAM,qBAAqBD,MAAA;AAAA,IACzB,MACE;AAAA,MACE;AAAA,MACA;AAAA,QACE,QAAQ;AAAA,QACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,SAAS;AAAA,QAC/BC,MAAe,eAAA,YAAY,IACvB,aAAa,MAAM,YACnB;AAAA,MACN;AAAA,IACF;AAAA,IACF,CAAC,IAAI,SAAS,cAAc,SAAS,UAAU,UAAU,YAAY;AAAA,EAAA;AAGvE,QAAM,sBACJ,SAAS,YAAY,SAAS,aAC1B;AAAA,IACE,iBAAiB,YAAY;AAAA,IAC7B,iBAAiB;AAAA,MAEnB;AAEA,QAAA;AAAA;AAAA;AAAA,IAGJC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR;AAAA,YACE,CAAC,QAAQ,OAAO,GAAG,CAAC;AAAA,YACpB,CAAC,QAAQ,SAAS,GAAG;AAAA,YACrB,CAAC,QAAQ,WAAW,GAAG,eAAe;AAAA,YACtC,CAAC,QAAQ,QAAQ,GAAG,YAAY,MAAM,eAAe;AAAA,YACrD,CAAC,QAAQ,QAAQ,GAAG,YAAY,MAAM,eAAe;AAAA,YACrD,CAAC,QAAQ,kBAAkB,GAAG,kBAAkB;AAAA,YAChD,CAAC,QAAQ,gBAAgB,GAAG,gBAAgB;AAAA,UAC9C;AAAA,UACA;AAAA,QACF;AAAA,QACA,UAAU,cAAc,SAAY;AAAA,QACpC,SAAS;AAAA,QACR,GAAG;AAAA,QACH,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA;AAGF,SAAO,cACLC,2BAAA;AAAA,IAACC,MAAA;AAAA,IAAA;AAAA,MACC,SAAS;AAAA,MACT;AAAA,MACA,eAAe,YAAY;AAAA,MAC3B,UAAU,SAAS,WAAW,YAAY;AAAA,MAC1C,SAAS,EAAE,OAAO,QAAQ,MAAM;AAAA,MAChC,eAAe;AAAA,QACb;AAAA,MACF;AAAA,MAEC,UAAA;AAAA,IAAA;AAAA,EAGH,IAAA;AAEJ,CAAC;;;"}

package/dist/cjs/ListContainer/ListItem/ListItem.styles.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const focusUtils = require("../../utils/focusUtils.cjs");
 const classes = require("../../utils/classes.cjs");
+const focusUtils = require("../../utils/focusUtils.cjs");
 const { staticClasses, useClasses } = classes.createClasses("HvListItem", {
   root: {
     ...uikitStyles.theme.typography.body,

package/dist/cjs/ListContainer/ListItem/ListItem.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.styles.cjs","sources":["../../../../src/ListContainer/ListItem/ListItem.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(\"HvListItem\", {\n  root: {\n    ...theme.typography.body,\n    padding: 0,\n    display: \"block\",\n    height: \"32px\",\n    lineHeight: \"32px\",\n    listStyleType: \"none\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    position: \"relative\",\n\n    \"&:not(:last-child)\": {\n      marginBottom: \"8px\",\n    },\n\n    \"&$condensed\": {\n      marginBottom: 0,\n    },\n\n    \"&.HvIsFocused\": {\n      ...outlineStyles,\n      backgroundColor: theme.colors.atmo3,\n      zIndex: 2,\n    },\n  },\n  focus: { backgroundColor: theme.colors.atmo3, zIndex: 2 },\n  startAdornment: {},\n  endAdornment: {},\n  gutters: {\n    padding: `0 ${theme.space.xs}`,\n\n    \"&$withStartAdornment\": {\n      paddingLeft: 0,\n    },\n    \"&$withEndAdornment\": {\n      paddingRight: 0,\n    },\n  },\n  condensed: {},\n  interactive: {\n    cursor: \"pointer\",\n    \"&:not($disabled):not($selected):hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n    \"&$disabled\": {\n      cursor: \"not-allowed\",\n    },\n  },\n  selected: { backgroundColor: theme.colors.containerBackgroundHover },\n  disabled: {\n    color: theme.colors.secondary_60,\n    backgroundColor: theme.colors.atmo3,\n  },\n  withStartAdornment: {\n    \"& > div\": {\n      float: \"left\",\n    },\n\n    \"& svg\": {\n      boxShadow: \"none !important\",\n      outline: \"none !important\",\n    },\n    \"$disabled > svg *.color0\": {\n      fill: theme.colors.secondary_60,\n    },\n  },\n  withEndAdornment: {\n    \"& > div\": { float: \"right\" },\n\n    \"& svg\": {\n      boxShadow: \"none !important\",\n      outline: \"none !important\",\n    },\n    \"$disabled > svg *.color0\": {\n      fill: theme.colors.secondary_60,\n    },\n  },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,cAAc;AAAA,EACvE,MAAM;AAAA,IACJ,GAAGC,YAAAA,MAAM,WAAW;AAAA,IACpB,SAAS;AAAA,IACT,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,UAAU;AAAA,IAEV,sBAAsB;AAAA,MACpB,cAAc;AAAA,IAChB;AAAA,IAEA,eAAe;AAAA,MACb,cAAc;AAAA,IAChB;AAAA,IAEA,iBAAiB;AAAA,MACf,GAAGC,WAAA;AAAA,MACH,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,MAC9B,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,OAAO,EAAE,iBAAiBA,kBAAM,OAAO,OAAO,QAAQ,EAAE;AAAA,EACxD,gBAAgB,CAAC;AAAA,EACjB,cAAc,CAAC;AAAA,EACf,SAAS;AAAA,IACP,SAAS,KAAKA,YAAM,MAAA,MAAM,EAAE;AAAA,IAE5B,wBAAwB;AAAA,MACtB,aAAa;AAAA,IACf;AAAA,IACA,sBAAsB;AAAA,MACpB,cAAc;AAAA,IAChB;AAAA,EACF;AAAA,EACA,WAAW,CAAC;AAAA,EACZ,aAAa;AAAA,IACX,QAAQ;AAAA,IACR,yCAAyC;AAAA,MACvC,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,IACA,cAAc;AAAA,MACZ,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,UAAU,EAAE,iBAAiBA,kBAAM,OAAO,yBAAyB;AAAA,EACnE,UAAU;AAAA,IACR,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,oBAAoB;AAAA,IAClB,WAAW;AAAA,MACT,OAAO;AAAA,IACT;AAAA,IAEA,SAAS;AAAA,MACP,WAAW;AAAA,MACX,SAAS;AAAA,IACX;AAAA,IACA,4BAA4B;AAAA,MAC1B,MAAMA,YAAAA,MAAM,OAAO;AAAA,IACrB;AAAA,EACF;AAAA,EACA,kBAAkB;AAAA,IAChB,WAAW,EAAE,OAAO,QAAQ;AAAA,IAE5B,SAAS;AAAA,MACP,WAAW;AAAA,MACX,SAAS;AAAA,IACX;AAAA,IACA,4BAA4B;AAAA,MAC1B,MAAMA,YAAAA,MAAM,OAAO;AAAA,IACrB;AAAA,EACF;AACF,CAAC;;;"}
+{"version":3,"file":"ListItem.styles.cjs","sources":["../../../../src/ListContainer/ListItem/ListItem.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\nimport { outlineStyles } from \"../../utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvListItem\", {\n  root: {\n    ...theme.typography.body,\n    padding: 0,\n    display: \"block\",\n    height: \"32px\",\n    lineHeight: \"32px\",\n    listStyleType: \"none\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    position: \"relative\",\n\n    \"&:not(:last-child)\": {\n      marginBottom: \"8px\",\n    },\n\n    \"&$condensed\": {\n      marginBottom: 0,\n    },\n\n    \"&.HvIsFocused\": {\n      ...outlineStyles,\n      backgroundColor: theme.colors.atmo3,\n      zIndex: 2,\n    },\n  },\n  focus: { backgroundColor: theme.colors.atmo3, zIndex: 2 },\n  startAdornment: {},\n  endAdornment: {},\n  gutters: {\n    padding: `0 ${theme.space.xs}`,\n\n    \"&$withStartAdornment\": {\n      paddingLeft: 0,\n    },\n    \"&$withEndAdornment\": {\n      paddingRight: 0,\n    },\n  },\n  condensed: {},\n  interactive: {\n    cursor: \"pointer\",\n    \"&:not($disabled):not($selected):hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n    \"&$disabled\": {\n      cursor: \"not-allowed\",\n    },\n  },\n  selected: { backgroundColor: theme.colors.containerBackgroundHover },\n  disabled: {\n    color: theme.colors.secondary_60,\n    backgroundColor: theme.colors.atmo3,\n  },\n  withStartAdornment: {\n    \"& > div\": {\n      float: \"left\",\n    },\n\n    \"& svg\": {\n      boxShadow: \"none !important\",\n      outline: \"none !important\",\n    },\n    \"$disabled > svg *.color0\": {\n      fill: theme.colors.secondary_60,\n    },\n  },\n  withEndAdornment: {\n    \"& > div\": { float: \"right\" },\n\n    \"& svg\": {\n      boxShadow: \"none !important\",\n      outline: \"none !important\",\n    },\n    \"$disabled > svg *.color0\": {\n      fill: theme.colors.secondary_60,\n    },\n  },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,cAAc;AAAA,EACvE,MAAM;AAAA,IACJ,GAAGC,YAAAA,MAAM,WAAW;AAAA,IACpB,SAAS;AAAA,IACT,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,UAAU;AAAA,IAEV,sBAAsB;AAAA,MACpB,cAAc;AAAA,IAChB;AAAA,IAEA,eAAe;AAAA,MACb,cAAc;AAAA,IAChB;AAAA,IAEA,iBAAiB;AAAA,MACf,GAAGC,WAAA;AAAA,MACH,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,MAC9B,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,OAAO,EAAE,iBAAiBA,kBAAM,OAAO,OAAO,QAAQ,EAAE;AAAA,EACxD,gBAAgB,CAAC;AAAA,EACjB,cAAc,CAAC;AAAA,EACf,SAAS;AAAA,IACP,SAAS,KAAKA,YAAM,MAAA,MAAM,EAAE;AAAA,IAE5B,wBAAwB;AAAA,MACtB,aAAa;AAAA,IACf;AAAA,IACA,sBAAsB;AAAA,MACpB,cAAc;AAAA,IAChB;AAAA,EACF;AAAA,EACA,WAAW,CAAC;AAAA,EACZ,aAAa;AAAA,IACX,QAAQ;AAAA,IACR,yCAAyC;AAAA,MACvC,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,IACA,cAAc;AAAA,MACZ,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,UAAU,EAAE,iBAAiBA,kBAAM,OAAO,yBAAyB;AAAA,EACnE,UAAU;AAAA,IACR,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,oBAAoB;AAAA,IAClB,WAAW;AAAA,MACT,OAAO;AAAA,IACT;AAAA,IAEA,SAAS;AAAA,MACP,WAAW;AAAA,MACX,SAAS;AAAA,IACX;AAAA,IACA,4BAA4B;AAAA,MAC1B,MAAMA,YAAAA,MAAM,OAAO;AAAA,IACrB;AAAA,EACF;AAAA,EACA,kBAAkB;AAAA,IAChB,WAAW,EAAE,OAAO,QAAQ;AAAA,IAE5B,SAAS;AAAA,MACP,WAAW;AAAA,MACX,SAAS;AAAA,IACX;AAAA,IACA,4BAA4B;AAAA,MAC1B,MAAMA,YAAAA,MAAM,OAAO;AAAA,IACrB;AAAA,EACF;AACF,CAAC;;;"}

package/dist/cjs/Loading/Loading.cjs

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const helpers = require("../utils/helpers.cjs");
 const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const helpers = require("../utils/helpers.cjs");
 const Loading_styles = require("./Loading.styles.cjs");
 const Typography = require("../Typography/Typography.cjs");
 const HvLoading = (props) => {

package/dist/cjs/Loading/Loading.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Loading.cjs","sources":["../../../src/Loading/Loading.tsx"],"sourcesContent":["import { HvColorAny, getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { range } from \"../utils/helpers\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvTypography } from \"../Typography\";\n\nimport { staticClasses, useClasses } from \"./Loading.styles\";\n\nexport { staticClasses as loadingClasses };\n\nexport type HvLoadingClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingProps extends HvBaseProps {\n  /** Indicates if the component should be render in a small size. */\n  small?: boolean;\n  /** The label to be displayed.  */\n  label?: string | React.ReactNode;\n  /** Whether the loading animation is hidden. */\n  hidden?: boolean;\n  /** Color applied to the bars. */\n  color?: HvColorAny;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvLoadingClasses;\n}\n\n/**\n * Loading provides feedback about a process that is taking place in the application.\n */\nexport const HvLoading = (props: HvLoadingProps) => {\n  const {\n    color,\n    hidden,\n    small,\n    label,\n    classes: classesProp,\n    className,\n    ...others\n  } = useDefaultProps(\"HvLoading\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const size = small ? \"small\" : \"regular\";\n  const colorVariant = color ? \"Color\" : \"\";\n  const variant = `${size}${colorVariant}` as const;\n\n  const inline = {\n    backgroundColor: getColor(color, small ? \"secondary\" : \"brand\"),\n  };\n  return (\n    <div\n      hidden={!!hidden}\n      className={cx(\n        classes.root,\n        {\n          [classes.hidden]: hidden,\n        },\n        className\n      )}\n      {...others}\n    >\n      <div className={classes.barContainer}>\n        {range(3).map((e) => (\n          <div\n            key={e}\n            style={inline}\n            className={cx(classes.loadingBar, classes[variant])}\n          />\n        ))}\n      </div>\n      {label && (\n        <HvTypography variant=\"caption1\" className={classes.label}>\n          {label}\n        </HvTypography>\n      )}\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","getColor","jsxs","jsx","HvTypography"],"mappings":";;;;;;;;AA8Ba,MAAA,YAAY,CAAC,UAA0B;AAC5C,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,aAAa,KAAK;AAEtC,QAAM,EAAE,SAAS,GAAG,IAAIC,0BAAW,WAAW;AAExC,QAAA,OAAO,QAAQ,UAAU;AACzB,QAAA,eAAe,QAAQ,UAAU;AACvC,QAAM,UAAU,GAAG,IAAI,GAAG,YAAY;AAEtC,QAAM,SAAS;AAAA,IACb,iBAAiBC,YAAAA,SAAS,OAAO,QAAQ,cAAc,OAAO;AAAA,EAAA;AAG9D,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAQ,CAAC,CAAC;AAAA,MACV,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG;AAAA,QACpB;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAACC,2BAAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,cACrB,wBAAM,CAAC,EAAE,IAAI,CAAC,MACbA,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,OAAO;AAAA,YACP,WAAW,GAAG,QAAQ,YAAY,QAAQ,OAAO,CAAC;AAAA,UAAA;AAAA,UAF7C;AAAA,QAIR,CAAA,GACH;AAAA,QACC,wCACEC,yBAAa,EAAA,SAAQ,YAAW,WAAW,QAAQ,OACjD,UACH,MAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;;;"}
+{"version":3,"file":"Loading.cjs","sources":["../../../src/Loading/Loading.tsx"],"sourcesContent":["import { getColor, HvColorAny } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { range } from \"../utils/helpers\";\nimport { staticClasses, useClasses } from \"./Loading.styles\";\n\nexport { staticClasses as loadingClasses };\n\nexport type HvLoadingClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingProps extends HvBaseProps {\n  /** Indicates if the component should be render in a small size. */\n  small?: boolean;\n  /** The label to be displayed.  */\n  label?: string | React.ReactNode;\n  /** Whether the loading animation is hidden. */\n  hidden?: boolean;\n  /** Color applied to the bars. */\n  color?: HvColorAny;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvLoadingClasses;\n}\n\n/**\n * Loading provides feedback about a process that is taking place in the application.\n */\nexport const HvLoading = (props: HvLoadingProps) => {\n  const {\n    color,\n    hidden,\n    small,\n    label,\n    classes: classesProp,\n    className,\n    ...others\n  } = useDefaultProps(\"HvLoading\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const size = small ? \"small\" : \"regular\";\n  const colorVariant = color ? \"Color\" : \"\";\n  const variant = `${size}${colorVariant}` as const;\n\n  const inline = {\n    backgroundColor: getColor(color, small ? \"secondary\" : \"brand\"),\n  };\n  return (\n    <div\n      hidden={!!hidden}\n      className={cx(\n        classes.root,\n        {\n          [classes.hidden]: hidden,\n        },\n        className,\n      )}\n      {...others}\n    >\n      <div className={classes.barContainer}>\n        {range(3).map((e) => (\n          <div\n            key={e}\n            style={inline}\n            className={cx(classes.loadingBar, classes[variant])}\n          />\n        ))}\n      </div>\n      {label && (\n        <HvTypography variant=\"caption1\" className={classes.label}>\n          {label}\n        </HvTypography>\n      )}\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","getColor","jsxs","jsx","HvTypography"],"mappings":";;;;;;;;AA6Ba,MAAA,YAAY,CAAC,UAA0B;AAC5C,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,aAAa,KAAK;AAEtC,QAAM,EAAE,SAAS,GAAG,IAAIC,0BAAW,WAAW;AAExC,QAAA,OAAO,QAAQ,UAAU;AACzB,QAAA,eAAe,QAAQ,UAAU;AACvC,QAAM,UAAU,GAAG,IAAI,GAAG,YAAY;AAEtC,QAAM,SAAS;AAAA,IACb,iBAAiBC,YAAAA,SAAS,OAAO,QAAQ,cAAc,OAAO;AAAA,EAAA;AAG9D,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAQ,CAAC,CAAC;AAAA,MACV,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG;AAAA,QACpB;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAACC,2BAAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,cACrB,wBAAM,CAAC,EAAE,IAAI,CAAC,MACbA,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,OAAO;AAAA,YACP,WAAW,GAAG,QAAQ,YAAY,QAAQ,OAAO,CAAC;AAAA,UAAA;AAAA,UAF7C;AAAA,QAIR,CAAA,GACH;AAAA,QACC,wCACEC,yBAAa,EAAA,SAAQ,YAAW,WAAW,QAAQ,OACjD,UACH,MAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;;;"}

package/dist/cjs/Loading/Loading.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Loading.styles.cjs","sources":["../../../src/Loading/Loading.styles.tsx"],"sourcesContent":["import { keyframes } from \"@emotion/react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nconst interval = 0.11;\n\nconst bars = {\n  \"&:nth-of-type(1)\": {\n    animationDelay: \"0\",\n  },\n  \"&:nth-of-type(2)\": {\n    animationDelay: `${interval * 2}s`,\n  },\n  \"&:nth-of-type(3)\": {\n    animationDelay: `${interval * 4}s`,\n  },\n};\n\nconst small = {\n  width: \"2px\",\n  height: \"18px\",\n  margin: \"0px 2px\",\n  ...bars,\n};\n\nconst regular = {\n  width: \"4px\",\n  height: \"30px\",\n  margin: \"0 3px\",\n  ...bars,\n};\n\nconst regularAnimation = keyframes`\n  0% { \n    transform: scale(1);\n    background-color: ${theme.colors.brand};\n  }\n  50% { \n    transform: scale(1, 0.6); \n    background-color: ${theme.colors.secondary};\n  }\n`;\n\nconst regularColorAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.6); \n  }\n`;\n\nconst smallAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.223); \n  }\n  100%: {},\n`;\n\nconst smallColorAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.223); \n  }\n`;\n\nexport const { staticClasses, useClasses } = createClasses(\"HvLoading\", {\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n  },\n  barContainer: { display: \"flex\" },\n  loadingBar: {\n    display: \"inline-block\",\n\n    \"@keyframes loading-small\": {\n      \"0%\": {\n        transform: \"scale(1)\",\n      },\n      \"50%\": {\n        transform: \"scale(1,0.223)\",\n      },\n      \"100%\": {},\n    },\n  },\n  label: { marginTop: \"15px\" },\n  overlay: {},\n  blur: {},\n  hidden: { display: \"none\" },\n  small: { animation: `${smallAnimation} 1s ease-in-out infinite`, ...small },\n  regular: {\n    animation: `${regularAnimation} 1s ease-in-out infinite`,\n    ...regular,\n  },\n  smallColor: {\n    animation: `${smallColorAnimation} 1s ease-in-out infinite`,\n    ...small,\n  },\n  regularColor: {\n    animation: `${regularColorAnimation} 1s ease-in-out infinite`,\n    ...regular,\n  },\n});\n"],"names":["keyframes","theme","createClasses"],"mappings":";;;;;AAMA,MAAM,WAAW;AAEjB,MAAM,OAAO;AAAA,EACX,oBAAoB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,oBAAoB;AAAA,IAClB,gBAAgB,GAAG,WAAW,CAAC;AAAA,EACjC;AAAA,EACA,oBAAoB;AAAA,IAClB,gBAAgB,GAAG,WAAW,CAAC;AAAA,EACjC;AACF;AAEA,MAAM,QAAQ;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,GAAG;AACL;AAEA,MAAM,UAAU;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,GAAG;AACL;AAEA,MAAM,mBAAmBA,MAAAA;AAAAA;AAAAA;AAAAA,wBAGDC,YAAA,MAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,wBAIlBA,YAAA,MAAM,OAAO,SAAS;AAAA;AAAA;AAI9C,MAAM,wBAAwBD,MAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAS9B,MAAM,iBAAiBA,MAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAUvB,MAAM,sBAAsBA,MAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AASrB,MAAM,EAAE,eAAe,eAAeE,QAAAA,cAAc,aAAa;AAAA,EACtE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,gBAAgB;AAAA,EAClB;AAAA,EACA,cAAc,EAAE,SAAS,OAAO;AAAA,EAChC,YAAY;AAAA,IACV,SAAS;AAAA,IAET,4BAA4B;AAAA,MAC1B,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,MACA,OAAO;AAAA,QACL,WAAW;AAAA,MACb;AAAA,MACA,QAAQ,CAAC;AAAA,IACX;AAAA,EACF;AAAA,EACA,OAAO,EAAE,WAAW,OAAO;AAAA,EAC3B,SAAS,CAAC;AAAA,EACV,MAAM,CAAC;AAAA,EACP,QAAQ,EAAE,SAAS,OAAO;AAAA,EAC1B,OAAO,EAAE,WAAW,GAAG,cAAc,4BAA4B,GAAG,MAAM;AAAA,EAC1E,SAAS;AAAA,IACP,WAAW,GAAG,gBAAgB;AAAA,IAC9B,GAAG;AAAA,EACL;AAAA,EACA,YAAY;AAAA,IACV,WAAW,GAAG,mBAAmB;AAAA,IACjC,GAAG;AAAA,EACL;AAAA,EACA,cAAc;AAAA,IACZ,WAAW,GAAG,qBAAqB;AAAA,IACnC,GAAG;AAAA,EACL;AACF,CAAC;;;"}
+{"version":3,"file":"Loading.styles.cjs","sources":["../../../src/Loading/Loading.styles.tsx"],"sourcesContent":["import { keyframes } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nconst interval = 0.11;\n\nconst bars = {\n  \"&:nth-of-type(1)\": {\n    animationDelay: \"0\",\n  },\n  \"&:nth-of-type(2)\": {\n    animationDelay: `${interval * 2}s`,\n  },\n  \"&:nth-of-type(3)\": {\n    animationDelay: `${interval * 4}s`,\n  },\n};\n\nconst small = {\n  width: \"2px\",\n  height: \"18px\",\n  margin: \"0px 2px\",\n  ...bars,\n};\n\nconst regular = {\n  width: \"4px\",\n  height: \"30px\",\n  margin: \"0 3px\",\n  ...bars,\n};\n\nconst regularAnimation = keyframes`\n  0% { \n    transform: scale(1);\n    background-color: ${theme.colors.brand};\n  }\n  50% { \n    transform: scale(1, 0.6); \n    background-color: ${theme.colors.secondary};\n  }\n`;\n\nconst regularColorAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.6); \n  }\n`;\n\nconst smallAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.223); \n  }\n  100%: {},\n`;\n\nconst smallColorAnimation = keyframes`\n  0% { \n    transform: scale(1);\n  }\n  50% { \n    transform: scale(1, 0.223); \n  }\n`;\n\nexport const { staticClasses, useClasses } = createClasses(\"HvLoading\", {\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n  },\n  barContainer: { display: \"flex\" },\n  loadingBar: {\n    display: \"inline-block\",\n\n    \"@keyframes loading-small\": {\n      \"0%\": {\n        transform: \"scale(1)\",\n      },\n      \"50%\": {\n        transform: \"scale(1,0.223)\",\n      },\n      \"100%\": {},\n    },\n  },\n  label: { marginTop: \"15px\" },\n  overlay: {},\n  blur: {},\n  hidden: { display: \"none\" },\n  small: { animation: `${smallAnimation} 1s ease-in-out infinite`, ...small },\n  regular: {\n    animation: `${regularAnimation} 1s ease-in-out infinite`,\n    ...regular,\n  },\n  smallColor: {\n    animation: `${smallColorAnimation} 1s ease-in-out infinite`,\n    ...small,\n  },\n  regularColor: {\n    animation: `${regularColorAnimation} 1s ease-in-out infinite`,\n    ...regular,\n  },\n});\n"],"names":["keyframes","theme","createClasses"],"mappings":";;;;;AAKA,MAAM,WAAW;AAEjB,MAAM,OAAO;AAAA,EACX,oBAAoB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,oBAAoB;AAAA,IAClB,gBAAgB,GAAG,WAAW,CAAC;AAAA,EACjC;AAAA,EACA,oBAAoB;AAAA,IAClB,gBAAgB,GAAG,WAAW,CAAC;AAAA,EACjC;AACF;AAEA,MAAM,QAAQ;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,GAAG;AACL;AAEA,MAAM,UAAU;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,GAAG;AACL;AAEA,MAAM,mBAAmBA,MAAAA;AAAAA;AAAAA;AAAAA,wBAGDC,YAAA,MAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,wBAIlBA,YAAA,MAAM,OAAO,SAAS;AAAA;AAAA;AAI9C,MAAM,wBAAwBD,MAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAS9B,MAAM,iBAAiBA,MAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAUvB,MAAM,sBAAsBA,MAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AASrB,MAAM,EAAE,eAAe,eAAeE,QAAAA,cAAc,aAAa;AAAA,EACtE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,gBAAgB;AAAA,EAClB;AAAA,EACA,cAAc,EAAE,SAAS,OAAO;AAAA,EAChC,YAAY;AAAA,IACV,SAAS;AAAA,IAET,4BAA4B;AAAA,MAC1B,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,MACA,OAAO;AAAA,QACL,WAAW;AAAA,MACb;AAAA,MACA,QAAQ,CAAC;AAAA,IACX;AAAA,EACF;AAAA,EACA,OAAO,EAAE,WAAW,OAAO;AAAA,EAC3B,SAAS,CAAC;AAAA,EACV,MAAM,CAAC;AAAA,EACP,QAAQ,EAAE,SAAS,OAAO;AAAA,EAC1B,OAAO,EAAE,WAAW,GAAG,cAAc,4BAA4B,GAAG,MAAM;AAAA,EAC1E,SAAS;AAAA,IACP,WAAW,GAAG,gBAAgB;AAAA,IAC9B,GAAG;AAAA,EACL;AAAA,EACA,YAAY;AAAA,IACV,WAAW,GAAG,mBAAmB;AAAA,IACjC,GAAG;AAAA,EACL;AAAA,EACA,cAAc;AAAA,IACZ,WAAW,GAAG,qBAAqB;AAAA,IACnC,GAAG;AAAA,EACL;AACF,CAAC;;;"}

package/dist/cjs/LoadingContainer/LoadingContainer.cjs

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const LoadingContainer_styles = require("./LoadingContainer.styles.cjs");
+const Loading = require("../Loading/Loading.cjs");
+const HvLoadingContainer = (props) => {
+  const {
+    children,
+    className,
+    classes: classesProp,
+    hidden,
+    small,
+    label,
+    "aria-label": ariaLabel = label || "Loading",
+    opacity,
+    ...others
+  } = useDefaultProps.useDefaultProps("HvLoadingContainer", props);
+  const { classes, cx } = LoadingContainer_styles.useClasses(classesProp);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(classes.root, className), ...others, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Loading.HvLoading,
+      {
+        className: classes.loading,
+        role: "progressbar",
+        small,
+        label,
+        hidden,
+        "aria-label": ariaLabel,
+        style: opacity ? { ["--opacity"]: opacity } : void 0
+      }
+    ),
+    children
+  ] });
+};
+exports.loadingContainerClasses = LoadingContainer_styles.staticClasses;
+exports.HvLoadingContainer = HvLoadingContainer;

package/dist/cjs/LoadingContainer/LoadingContainer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingContainer.cjs","sources":["../../../src/LoadingContainer/LoadingContainer.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvLoading, HvLoadingProps } from \"../Loading\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\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":["useDefaultProps","useClasses","jsxs","jsx","HvLoading"],"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,IACDA,gBAAgB,gBAAA,sBAAsB,KAAK;AAC/C,QAAM,EAAE,SAAS,GAAG,IAAIC,mCAAW,WAAW;AAG5C,SAAAC,gCAAC,SAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAA;AAAA,IAAAC,2BAAA;AAAA,MAACC,QAAA;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;;;"}

package/dist/cjs/LoadingContainer/LoadingContainer.styles.cjs

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const classes = require("../utils/classes.cjs");
+const { staticClasses, useClasses } = classes.createClasses("HvLoadingContainer", {
+  root: {
+    position: "relative",
+    height: "inherit",
+    userSelect: "none"
+  },
+  loading: {
+    position: "absolute",
+    inset: 0,
+    zIndex: uikitStyles.theme.zIndices.overlay,
+    transition: "background-color .2s ease",
+    backgroundColor: uikitStyles.theme.alpha("atmo1", "var(--opacity, 0.8)")
+  }
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;

package/dist/cjs/LoadingContainer/LoadingContainer.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingContainer.styles.cjs","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":["createClasses","theme"],"mappings":";;;;AAIA,MAAM,EAAE,eAAe,eAAeA,QAAAA,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,QAAQC,YAAAA,MAAM,SAAS;AAAA,IACvB,YAAY;AAAA,IACZ,iBAAiBA,YAAA,MAAM,MAAM,SAAS,qBAAqB;AAAA,EAC7D;AACF,CAAC;;;"}

package/dist/cjs/Login/Login.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Login.cjs","sources":["../../../src/Login/Login.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { HvBaseProps } from \"../types/generic\";\n\nimport { staticClasses, useClasses } from \"./Login.styles\";\n\nexport { staticClasses as loginClasses };\n\nexport type HvLoginClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoginProps extends HvBaseProps {\n  /**\n   *  The path for the background image.\n   */\n  background?: string;\n  /**\n   * Class names to be applied.\n   */\n  classes?: HvLoginClasses;\n}\n\n/**\n * Container layout for the login form.\n */\nexport const HvLogin = (props: HvLoginProps) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    children,\n    background,\n    ...others\n  } = useDefaultProps(\"HvLogin\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <div\n      id={id}\n      className={cx(classes.root, className)}\n      style={{\n        backgroundImage: background && `url(${background})`,\n      }}\n      {...others}\n    >\n      <div className={classes.formContainer}>{children}</div>\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","jsx"],"mappings":";;;;;AAwBa,MAAA,UAAU,CAAC,UAAwB;AACxC,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,WAAW,KAAK;AAEpC,QAAM,EAAE,SAAS,GAAG,IAAIC,wBAAW,WAAW;AAG5C,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACrC,OAAO;AAAA,QACL,iBAAiB,cAAc,OAAO,UAAU;AAAA,MAClD;AAAA,MACC,GAAG;AAAA,MAEJ,UAACA,2BAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,eAAgB,UAAS;AAAA,IAAA;AAAA,EAAA;AAGvD;;;"}
+{"version":3,"file":"Login.cjs","sources":["../../../src/Login/Login.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./Login.styles\";\n\nexport { staticClasses as loginClasses };\n\nexport type HvLoginClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoginProps extends HvBaseProps {\n  /**\n   *  The path for the background image.\n   */\n  background?: string;\n  /**\n   * Class names to be applied.\n   */\n  classes?: HvLoginClasses;\n}\n\n/**\n * Container layout for the login form.\n */\nexport const HvLogin = (props: HvLoginProps) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    children,\n    background,\n    ...others\n  } = useDefaultProps(\"HvLogin\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <div\n      id={id}\n      className={cx(classes.root, className)}\n      style={{\n        backgroundImage: background && `url(${background})`,\n      }}\n      {...others}\n    >\n      <div className={classes.formContainer}>{children}</div>\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","jsx"],"mappings":";;;;;AAuBa,MAAA,UAAU,CAAC,UAAwB;AACxC,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,WAAW,KAAK;AAEpC,QAAM,EAAE,SAAS,GAAG,IAAIC,wBAAW,WAAW;AAG5C,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACrC,OAAO;AAAA,QACL,iBAAiB,cAAc,OAAO,UAAU;AAAA,MAClD;AAAA,MACC,GAAG;AAAA,MAEJ,UAACA,2BAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,eAAgB,UAAS;AAAA,IAAA;AAAA,EAAA;AAGvD;;;"}

package/dist/cjs/MultiButton/MultiButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MultiButton.cjs","sources":["../../../src/MultiButton/MultiButton.tsx"],"sourcesContent":["import { Children, cloneElement, isValidElement, useMemo } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvButtonSize, HvButtonVariant } from \"../Button\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport {\n  getSplitContainerColor,\n  getSplitContainerHeight,\n  staticClasses,\n  useClasses,\n} from \"./MultiButton.styles\";\n\nexport { staticClasses as multiButtonClasses };\nexport type HvMultiButtonClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvMultiButtonProps extends HvBaseProps {\n  /** If all the buttons are disabled. */\n  disabled?: boolean;\n  /** If the MultiButton is to be displayed vertically. */\n  vertical?: boolean;\n  /** Category of button to use */\n  variant?: HvButtonVariant;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvMultiButtonClasses;\n  /** Button size. */\n  size?: HvButtonSize;\n  /** Add a split between buttons */\n  split?: boolean;\n}\n\nexport const HvMultiButton = (props: HvMultiButtonProps) => {\n  const {\n    className,\n    children,\n    classes: classesProp,\n    disabled = false,\n    vertical = false,\n    variant = \"secondarySubtle\",\n    size,\n    split,\n    ...others\n  } = useDefaultProps(\"HvMultiButton\", props);\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const [color, type] = useMemo(() => {\n    const result = variant.split(/(?=[A-Z])/);\n    if (\n      result[0] === \"ghost\" ||\n      result[0] === \"semantic\" ||\n      (result[0] === \"secondary\" && !result[1])\n    )\n      return [];\n    return result.map((x) => x.toLowerCase());\n  }, [variant]);\n\n  return (\n    <div\n      className={cx(\n        classes.root,\n        {\n          [classes.multiple]: !split,\n          [classes.vertical]: vertical,\n          [classes[variant]]: variant, // TODO - remove in v6\n          [classes.splitGroup]: split,\n          [classes.splitGroupDisabled]: split && disabled,\n        },\n        className\n      )}\n      {...others}\n    >\n      {Children.map(children, (child, index) => {\n        if (isValidElement(child)) {\n          const childIsSelected = !!child.props.selected;\n\n          return (\n            <>\n              {cloneElement(child as React.ReactElement, {\n                variant,\n                disabled: disabled || child.props.disabled,\n                size,\n                className: cx(child.props.className, classes.button, {\n                  [classes.firstButton]: index === 0,\n                  [classes.lastButton]: index === Children.count(children) - 1,\n                  [classes.selected]: childIsSelected,\n                }),\n              })}\n              {split && index < Children.count(children) - 1 && (\n                <div\n                  className={cx(\n                    classes.splitContainer,\n                    color && css(getSplitContainerColor(color, type, disabled)),\n                    size && css(getSplitContainerHeight(size)),\n                    {\n                      [classes.splitDisabled]: disabled,\n                    },\n                    classes[variant] // TODO - remove in v6\n                  )}\n                >\n                  <div className={classes.split} />\n                </div>\n              )}\n            </>\n          );\n        }\n      })}\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","useMemo","jsx","Children","isValidElement","jsxs","Fragment","cloneElement","getSplitContainerColor","getSplitContainerHeight"],"mappings":";;;;;;AA+Ba,MAAA,gBAAgB,CAAC,UAA8B;AACpD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,iBAAiB,KAAK;AAC1C,QAAM,EAAE,SAAS,IAAI,IAAI,IAAIC,mBAAAA,WAAW,WAAW;AAEnD,QAAM,CAAC,OAAO,IAAI,IAAIC,cAAQ,MAAM;AAC5B,UAAA,SAAS,QAAQ,MAAM,WAAW;AACxC,QACE,OAAO,CAAC,MAAM,WACd,OAAO,CAAC,MAAM,cACb,OAAO,CAAC,MAAM,eAAe,CAAC,OAAO,CAAC;AAEvC,aAAO;AACT,WAAO,OAAO,IAAI,CAAC,MAAM,EAAE,aAAa;AAAA,EAAA,GACvC,CAAC,OAAO,CAAC;AAGV,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,QAAQ,GAAG,CAAC;AAAA,UACrB,CAAC,QAAQ,QAAQ,GAAG;AAAA,UACpB,CAAC,QAAQ,OAAO,CAAC,GAAG;AAAA;AAAA,UACpB,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,kBAAkB,GAAG,SAAS;AAAA,QACzC;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,UAASC,MAAA,SAAA,IAAI,UAAU,CAAC,OAAO,UAAU;AACpC,YAAAC,MAAAA,eAAe,KAAK,GAAG;AACzB,gBAAM,kBAAkB,CAAC,CAAC,MAAM,MAAM;AAEtC,iBAEKC,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,YAAAC,MAAAA,aAAa,OAA6B;AAAA,cACzC;AAAA,cACA,UAAU,YAAY,MAAM,MAAM;AAAA,cAClC;AAAA,cACA,WAAW,GAAG,MAAM,MAAM,WAAW,QAAQ,QAAQ;AAAA,gBACnD,CAAC,QAAQ,WAAW,GAAG,UAAU;AAAA,gBACjC,CAAC,QAAQ,UAAU,GAAG,UAAUJ,MAAS,SAAA,MAAM,QAAQ,IAAI;AAAA,gBAC3D,CAAC,QAAQ,QAAQ,GAAG;AAAA,cAAA,CACrB;AAAA,YAAA,CACF;AAAA,YACA,SAAS,QAAQA,MAAA,SAAS,MAAM,QAAQ,IAAI,KAC3CD,2BAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW;AAAA,kBACT,QAAQ;AAAA,kBACR,SAAS,IAAIM,mBAAA,uBAAuB,OAAO,MAAM,QAAQ,CAAC;AAAA,kBAC1D,QAAQ,IAAIC,2CAAwB,IAAI,CAAC;AAAA,kBACzC;AAAA,oBACE,CAAC,QAAQ,aAAa,GAAG;AAAA,kBAC3B;AAAA,kBACA,QAAQ,OAAO;AAAA;AAAA,gBACjB;AAAA,gBAEA,UAACP,2BAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,OAAO;AAAA,cAAA;AAAA,YACjC;AAAA,UAEJ,EAAA,CAAA;AAAA,QAEJ;AAAA,MAAA,CACD;AAAA,IAAA;AAAA,EAAA;AAGP;;;"}
+{"version":3,"file":"MultiButton.cjs","sources":["../../../src/MultiButton/MultiButton.tsx"],"sourcesContent":["import { Children, cloneElement, isValidElement, useMemo } from \"react\";\n\nimport { HvButtonSize, HvButtonVariant } from \"../Button\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport {\n  getSplitContainerColor,\n  getSplitContainerHeight,\n  staticClasses,\n  useClasses,\n} from \"./MultiButton.styles\";\n\nexport { staticClasses as multiButtonClasses };\nexport type HvMultiButtonClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvMultiButtonProps extends HvBaseProps {\n  /** If all the buttons are disabled. */\n  disabled?: boolean;\n  /** If the MultiButton is to be displayed vertically. */\n  vertical?: boolean;\n  /** Category of button to use */\n  variant?: HvButtonVariant;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvMultiButtonClasses;\n  /** Button size. */\n  size?: HvButtonSize;\n  /** Add a split between buttons */\n  split?: boolean;\n}\n\nexport const HvMultiButton = (props: HvMultiButtonProps) => {\n  const {\n    className,\n    children,\n    classes: classesProp,\n    disabled = false,\n    vertical = false,\n    variant = \"secondarySubtle\",\n    size,\n    split,\n    ...others\n  } = useDefaultProps(\"HvMultiButton\", props);\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const [color, type] = useMemo(() => {\n    const result = variant.split(/(?=[A-Z])/);\n    if (\n      result[0] === \"ghost\" ||\n      result[0] === \"semantic\" ||\n      (result[0] === \"secondary\" && !result[1])\n    )\n      return [];\n    return result.map((x) => x.toLowerCase());\n  }, [variant]);\n\n  return (\n    <div\n      className={cx(\n        classes.root,\n        {\n          [classes.multiple]: !split,\n          [classes.vertical]: vertical,\n          [classes[variant]]: variant, // TODO - remove in v6\n          [classes.splitGroup]: split,\n          [classes.splitGroupDisabled]: split && disabled,\n        },\n        className,\n      )}\n      {...others}\n    >\n      {Children.map(children, (child, index) => {\n        if (isValidElement(child)) {\n          const childIsSelected = !!child.props.selected;\n\n          return (\n            <>\n              {cloneElement(child as React.ReactElement, {\n                variant,\n                disabled: disabled || child.props.disabled,\n                size,\n                className: cx(child.props.className, classes.button, {\n                  [classes.firstButton]: index === 0,\n                  [classes.lastButton]: index === Children.count(children) - 1,\n                  [classes.selected]: childIsSelected,\n                }),\n              })}\n              {split && index < Children.count(children) - 1 && (\n                <div\n                  className={cx(\n                    classes.splitContainer,\n                    color && css(getSplitContainerColor(color, type, disabled)),\n                    size && css(getSplitContainerHeight(size)),\n                    {\n                      [classes.splitDisabled]: disabled,\n                    },\n                    classes[variant], // TODO - remove in v6\n                  )}\n                >\n                  <div className={classes.split} />\n                </div>\n              )}\n            </>\n          );\n        }\n      })}\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","useMemo","jsx","Children","isValidElement","jsxs","Fragment","cloneElement","getSplitContainerColor","getSplitContainerHeight"],"mappings":";;;;;;AA+Ba,MAAA,gBAAgB,CAAC,UAA8B;AACpD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,iBAAiB,KAAK;AAC1C,QAAM,EAAE,SAAS,IAAI,IAAI,IAAIC,mBAAAA,WAAW,WAAW;AAEnD,QAAM,CAAC,OAAO,IAAI,IAAIC,cAAQ,MAAM;AAC5B,UAAA,SAAS,QAAQ,MAAM,WAAW;AACxC,QACE,OAAO,CAAC,MAAM,WACd,OAAO,CAAC,MAAM,cACb,OAAO,CAAC,MAAM,eAAe,CAAC,OAAO,CAAC;AAEvC,aAAO;AACT,WAAO,OAAO,IAAI,CAAC,MAAM,EAAE,aAAa;AAAA,EAAA,GACvC,CAAC,OAAO,CAAC;AAGV,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,QAAQ,GAAG,CAAC;AAAA,UACrB,CAAC,QAAQ,QAAQ,GAAG;AAAA,UACpB,CAAC,QAAQ,OAAO,CAAC,GAAG;AAAA;AAAA,UACpB,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,kBAAkB,GAAG,SAAS;AAAA,QACzC;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,UAASC,MAAA,SAAA,IAAI,UAAU,CAAC,OAAO,UAAU;AACpC,YAAAC,MAAAA,eAAe,KAAK,GAAG;AACzB,gBAAM,kBAAkB,CAAC,CAAC,MAAM,MAAM;AAEtC,iBAEKC,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,YAAAC,MAAAA,aAAa,OAA6B;AAAA,cACzC;AAAA,cACA,UAAU,YAAY,MAAM,MAAM;AAAA,cAClC;AAAA,cACA,WAAW,GAAG,MAAM,MAAM,WAAW,QAAQ,QAAQ;AAAA,gBACnD,CAAC,QAAQ,WAAW,GAAG,UAAU;AAAA,gBACjC,CAAC,QAAQ,UAAU,GAAG,UAAUJ,MAAS,SAAA,MAAM,QAAQ,IAAI;AAAA,gBAC3D,CAAC,QAAQ,QAAQ,GAAG;AAAA,cAAA,CACrB;AAAA,YAAA,CACF;AAAA,YACA,SAAS,QAAQA,MAAA,SAAS,MAAM,QAAQ,IAAI,KAC3CD,2BAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW;AAAA,kBACT,QAAQ;AAAA,kBACR,SAAS,IAAIM,mBAAA,uBAAuB,OAAO,MAAM,QAAQ,CAAC;AAAA,kBAC1D,QAAQ,IAAIC,2CAAwB,IAAI,CAAC;AAAA,kBACzC;AAAA,oBACE,CAAC,QAAQ,aAAa,GAAG;AAAA,kBAC3B;AAAA,kBACA,QAAQ,OAAO;AAAA;AAAA,gBACjB;AAAA,gBAEA,UAACP,2BAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,OAAO;AAAA,cAAA;AAAA,YACjC;AAAA,UAEJ,EAAA,CAAA;AAAA,QAEJ;AAAA,MAAA,CACD;AAAA,IAAA;AAAA,EAAA;AAGP;;;"}

package/dist/cjs/MultiButton/MultiButton.styles.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const classes = require("../utils/classes.cjs");
 const Button_styles = require("../Button/Button.styles.cjs");
+const classes = require("../utils/classes.cjs");
 const DropDownMenu_styles = require("../DropDownMenu/DropDownMenu.styles.cjs");
 require("@emotion/react/jsx-runtime");
 require("react");

package/dist/cjs/MultiButton/MultiButton.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MultiButton.styles.cjs","sources":["../../../src/MultiButton/MultiButton.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\nimport { dropDownMenuClasses } from \"../DropDownMenu\";\nimport { getColoringStyle, getSizeStyles } from \"../Button/Button.styles\";\nimport { HvButtonSize } from \"../Button\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvMultiButton\", {\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n    transition: \"none\",\n    position: \"relative\",\n    zIndex: 0,\n  },\n  multiple: {\n    background: theme.colors.atmo2,\n\n    // prevent the focus ring to be hidden by sibling hover background\n    \"&>.HvIsFocusVisible\": {\n      zIndex: 5,\n    },\n\n    \"& button$button\": {\n      minWidth: \"unset\",\n      width: \"100%\",\n      maxWidth: 200,\n      padding: 0,\n      transition: \"none\",\n      flex: \"1 0 0px\",\n      borderTop: `solid 1px ${theme.colors.atmo4}`,\n      borderBottom: `solid 1px ${theme.colors.atmo4}`,\n      borderLeft: \"solid 1px transparent\",\n      borderRight: \"solid 1px transparent\",\n      borderRadius: 0,\n      fontWeight: theme.typography.body.fontWeight,\n      fontSize: theme.typography.body.fontSize,\n      \"&:disabled\": {\n        color: theme.colors.secondary_60,\n        borderTop: `solid 1px ${theme.colors.atmo4}`,\n        borderBottom: `solid 1px ${theme.colors.atmo4}`,\n        \"&:hover\": {\n          borderTop: `solid 1px ${theme.colors.atmo4}`,\n          borderBottom: `solid 1px ${theme.colors.atmo4}`,\n          borderLeft: \"solid 1px transparent\",\n          borderRight: \"solid 1px transparent\",\n        },\n      },\n      \"&$firstButton\": {\n        borderLeft: `solid 1px ${theme.colors.atmo4}`,\n        borderTopLeftRadius: theme.radii.base,\n        borderBottomLeftRadius: theme.radii.base,\n        \"&:disabled\": {\n          borderLeft: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n      \"&$lastButton\": {\n        borderRight: `solid 1px ${theme.colors.atmo4}`,\n        borderTopRightRadius: theme.radii.base,\n        borderBottomRightRadius: theme.radii.base,\n        \"&:disabled\": {\n          borderRight: `solid 1px ${theme.colors.atmo4}`,\n        },\n        \"&:disabled:hover\": {\n          borderRight: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n      \"&:not($firstButton)\": {\n        marginLeft: \"-1px\",\n      },\n      \"&$selected\": {\n        background: theme.colors.atmo1,\n        ...theme.typography.label,\n        borderRadius: theme.radii.base,\n        border: `solid 1px ${theme.colors.secondary}`,\n        zIndex: 2,\n        \"&:hover\": {\n          background: theme.colors.atmo3,\n          \"&:not(:disabled)\": {\n            border: `solid 1px ${theme.colors.secondary}`,\n          },\n          \"&:disabled\": {\n            border: `solid 1px ${theme.colors.atmo4}`,\n          },\n        },\n        // prevent the focus ring to be hidden by sibling hover background\n        // even when selected\n        \"&.HvIsFocusVisible\": {\n          zIndex: 5,\n        },\n        \"&:disabled\": {\n          zIndex: 1,\n          color: theme.colors.secondary_60,\n          background: theme.colors.atmo1,\n          border: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n    },\n  },\n  splitGroup: {\n    width: \"fit-content\",\n    background: theme.colors.atmo1,\n\n    // Button\n    \"& button$button\": {\n      \"&$firstButton\": {\n        borderTopRightRadius: 0,\n        borderBottomRightRadius: 0,\n        \"& + div$splitContainer\": {\n          marginLeft: -1,\n        },\n      },\n      \"&$lastButton\": {\n        borderTopLeftRadius: 0,\n        borderBottomLeftRadius: 0,\n      },\n    },\n\n    // Dropdown Menu\n    [`& .${dropDownMenuClasses.root}`]: {\n      \"&:has($firstButton)\": {\n        \"& + div$splitContainer\": {\n          marginRight: -1,\n        },\n      },\n    },\n    \"& $button$firstButton > button\": {\n      marginRight: -1.5,\n      borderTopRightRadius: 0,\n      borderBottomRightRadius: 0,\n    },\n    \"& $button$lastButton > button\": {\n      marginLeft: -1.5,\n      borderTopLeftRadius: 0,\n      borderBottomLeftRadius: 0,\n    },\n    [`& .${dropDownMenuClasses.iconSelected}`]: {\n      zIndex: 2,\n    },\n  },\n  splitGroupDisabled: { background: theme.colors.atmo3 },\n  button: {},\n  selected: {},\n  vertical: {\n    flexDirection: \"column\",\n    height: \"auto\",\n    btnSecondary: {\n      flex: \"1 1 20px\",\n    },\n    \"& button$button\": {\n      minWidth: 32,\n      width: \"100%\",\n      borderLeft: `solid 1px ${theme.colors.atmo4}`,\n      borderRight: `solid 1px ${theme.colors.atmo4}`,\n      borderTop: \"solid 1px transparent\",\n      borderBottom: \"solid 1px transparent\",\n      \"&:disabled\": {\n        color: theme.colors.secondary_60,\n        borderLeft: `solid 1px ${theme.colors.atmo4}`,\n        borderRight: `solid 1px ${theme.colors.atmo4}`,\n        borderTop: \"solid 1px transparent\",\n        borderBottom: \"solid 1px transparent\",\n        \"&:hover\": {\n          borderLeft: `solid 1px ${theme.colors.atmo4}`,\n          borderRight: `solid 1px ${theme.colors.atmo4}`,\n          borderTop: \"solid 1px transparent\",\n          borderBottom: \"solid 1px transparent\",\n        },\n      },\n      \"&$firstButton\": {\n        borderTop: `solid 1px ${theme.colors.atmo4}`,\n        borderTopLeftRadius: theme.radii.base,\n        borderTopRightRadius: theme.radii.base,\n      },\n      \"&$lastButton\": {\n        borderBottom: `solid 1px ${theme.colors.atmo4}`,\n        borderBottomLeftRadius: theme.radii.base,\n        borderBottomRightRadius: theme.radii.base,\n        \"&:disabled:hover\": {\n          borderBottom: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n      \"&:not($firstButton)\": {\n        marginLeft: 0,\n        marginTop: -1,\n      },\n      \"&$selected\": {\n        height: 32,\n        width: `calc(100% + 2px) !important`,\n        background: theme.colors.atmo1,\n        ...theme.typography.label,\n        borderRadius: theme.radii.base,\n        border: `solid 1px ${theme.colors.secondary}`,\n        zIndex: 2,\n        \"&:hover, &:focus\": {\n          background: theme.colors.atmo3,\n        },\n        \"&:disabled\": {\n          zIndex: 1,\n          color: theme.colors.secondary_60,\n          background: theme.colors.atmo1,\n          border: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n    },\n  },\n  split: {\n    width: 1,\n    height: \"100%\",\n    background: \"currentColor\",\n  },\n  splitContainer: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    zIndex: 1,\n    width: 2,\n    paddingTop: 4,\n    paddingBottom: 4,\n    height: \"calc(32px - 2px)\",\n  },\n  splitDisabled: {\n    color: theme.colors.secondary_60,\n  },\n  firstButton: {},\n  lastButton: {},\n\n  // TODO - review the need for these classes in v6\n  primary: {},\n  primarySubtle: {},\n  primaryGhost: {},\n  secondary: {},\n  secondarySubtle: {},\n  secondaryGhost: {},\n});\n\nexport const getSplitContainerColor = (\n  color: string,\n  type?: string,\n  disabled?: boolean\n) => ({\n  color: getColoringStyle(color, type).color,\n  backgroundColor: disabled\n    ? theme.colors.atmo3\n    : type === \"subtle\"\n    ? theme.colors.atmo1\n    : \"transparent\",\n});\n\nexport const getSplitContainerHeight = (size: HvButtonSize) => ({\n  height: `calc(${getSizeStyles(size).height} - 2px)`,\n});\n"],"names":["createClasses","theme","dropDownMenuClasses","getColoringStyle","getSizeStyles"],"mappings":"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"}
+{"version":3,"file":"MultiButton.styles.cjs","sources":["../../../src/MultiButton/MultiButton.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvButtonSize } from \"../Button\";\nimport { getColoringStyle, getSizeStyles } from \"../Button/Button.styles\";\nimport { dropDownMenuClasses } from \"../DropDownMenu\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvMultiButton\", {\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n    transition: \"none\",\n    position: \"relative\",\n    zIndex: 0,\n  },\n  multiple: {\n    background: theme.colors.atmo2,\n\n    // prevent the focus ring to be hidden by sibling hover background\n    \"&>.HvIsFocusVisible\": {\n      zIndex: 5,\n    },\n\n    \"& button$button\": {\n      minWidth: \"unset\",\n      width: \"100%\",\n      maxWidth: 200,\n      padding: 0,\n      transition: \"none\",\n      flex: \"1 0 0px\",\n      borderTop: `solid 1px ${theme.colors.atmo4}`,\n      borderBottom: `solid 1px ${theme.colors.atmo4}`,\n      borderLeft: \"solid 1px transparent\",\n      borderRight: \"solid 1px transparent\",\n      borderRadius: 0,\n      fontWeight: theme.typography.body.fontWeight,\n      fontSize: theme.typography.body.fontSize,\n      \"&:disabled\": {\n        color: theme.colors.secondary_60,\n        borderTop: `solid 1px ${theme.colors.atmo4}`,\n        borderBottom: `solid 1px ${theme.colors.atmo4}`,\n        \"&:hover\": {\n          borderTop: `solid 1px ${theme.colors.atmo4}`,\n          borderBottom: `solid 1px ${theme.colors.atmo4}`,\n          borderLeft: \"solid 1px transparent\",\n          borderRight: \"solid 1px transparent\",\n        },\n      },\n      \"&$firstButton\": {\n        borderLeft: `solid 1px ${theme.colors.atmo4}`,\n        borderTopLeftRadius: theme.radii.base,\n        borderBottomLeftRadius: theme.radii.base,\n        \"&:disabled\": {\n          borderLeft: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n      \"&$lastButton\": {\n        borderRight: `solid 1px ${theme.colors.atmo4}`,\n        borderTopRightRadius: theme.radii.base,\n        borderBottomRightRadius: theme.radii.base,\n        \"&:disabled\": {\n          borderRight: `solid 1px ${theme.colors.atmo4}`,\n        },\n        \"&:disabled:hover\": {\n          borderRight: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n      \"&:not($firstButton)\": {\n        marginLeft: \"-1px\",\n      },\n      \"&$selected\": {\n        background: theme.colors.atmo1,\n        ...theme.typography.label,\n        borderRadius: theme.radii.base,\n        border: `solid 1px ${theme.colors.secondary}`,\n        zIndex: 2,\n        \"&:hover\": {\n          background: theme.colors.atmo3,\n          \"&:not(:disabled)\": {\n            border: `solid 1px ${theme.colors.secondary}`,\n          },\n          \"&:disabled\": {\n            border: `solid 1px ${theme.colors.atmo4}`,\n          },\n        },\n        // prevent the focus ring to be hidden by sibling hover background\n        // even when selected\n        \"&.HvIsFocusVisible\": {\n          zIndex: 5,\n        },\n        \"&:disabled\": {\n          zIndex: 1,\n          color: theme.colors.secondary_60,\n          background: theme.colors.atmo1,\n          border: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n    },\n  },\n  splitGroup: {\n    width: \"fit-content\",\n    background: theme.colors.atmo1,\n\n    // Button\n    \"& button$button\": {\n      \"&$firstButton\": {\n        borderTopRightRadius: 0,\n        borderBottomRightRadius: 0,\n        \"& + div$splitContainer\": {\n          marginLeft: -1,\n        },\n      },\n      \"&$lastButton\": {\n        borderTopLeftRadius: 0,\n        borderBottomLeftRadius: 0,\n      },\n    },\n\n    // Dropdown Menu\n    [`& .${dropDownMenuClasses.root}`]: {\n      \"&:has($firstButton)\": {\n        \"& + div$splitContainer\": {\n          marginRight: -1,\n        },\n      },\n    },\n    \"& $button$firstButton > button\": {\n      marginRight: -1.5,\n      borderTopRightRadius: 0,\n      borderBottomRightRadius: 0,\n    },\n    \"& $button$lastButton > button\": {\n      marginLeft: -1.5,\n      borderTopLeftRadius: 0,\n      borderBottomLeftRadius: 0,\n    },\n    [`& .${dropDownMenuClasses.iconSelected}`]: {\n      zIndex: 2,\n    },\n  },\n  splitGroupDisabled: { background: theme.colors.atmo3 },\n  button: {},\n  selected: {},\n  vertical: {\n    flexDirection: \"column\",\n    height: \"auto\",\n    btnSecondary: {\n      flex: \"1 1 20px\",\n    },\n    \"& button$button\": {\n      minWidth: 32,\n      width: \"100%\",\n      borderLeft: `solid 1px ${theme.colors.atmo4}`,\n      borderRight: `solid 1px ${theme.colors.atmo4}`,\n      borderTop: \"solid 1px transparent\",\n      borderBottom: \"solid 1px transparent\",\n      \"&:disabled\": {\n        color: theme.colors.secondary_60,\n        borderLeft: `solid 1px ${theme.colors.atmo4}`,\n        borderRight: `solid 1px ${theme.colors.atmo4}`,\n        borderTop: \"solid 1px transparent\",\n        borderBottom: \"solid 1px transparent\",\n        \"&:hover\": {\n          borderLeft: `solid 1px ${theme.colors.atmo4}`,\n          borderRight: `solid 1px ${theme.colors.atmo4}`,\n          borderTop: \"solid 1px transparent\",\n          borderBottom: \"solid 1px transparent\",\n        },\n      },\n      \"&$firstButton\": {\n        borderTop: `solid 1px ${theme.colors.atmo4}`,\n        borderTopLeftRadius: theme.radii.base,\n        borderTopRightRadius: theme.radii.base,\n      },\n      \"&$lastButton\": {\n        borderBottom: `solid 1px ${theme.colors.atmo4}`,\n        borderBottomLeftRadius: theme.radii.base,\n        borderBottomRightRadius: theme.radii.base,\n        \"&:disabled:hover\": {\n          borderBottom: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n      \"&:not($firstButton)\": {\n        marginLeft: 0,\n        marginTop: -1,\n      },\n      \"&$selected\": {\n        height: 32,\n        width: `calc(100% + 2px) !important`,\n        background: theme.colors.atmo1,\n        ...theme.typography.label,\n        borderRadius: theme.radii.base,\n        border: `solid 1px ${theme.colors.secondary}`,\n        zIndex: 2,\n        \"&:hover, &:focus\": {\n          background: theme.colors.atmo3,\n        },\n        \"&:disabled\": {\n          zIndex: 1,\n          color: theme.colors.secondary_60,\n          background: theme.colors.atmo1,\n          border: `solid 1px ${theme.colors.atmo4}`,\n        },\n      },\n    },\n  },\n  split: {\n    width: 1,\n    height: \"100%\",\n    background: \"currentColor\",\n  },\n  splitContainer: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    zIndex: 1,\n    width: 2,\n    paddingTop: 4,\n    paddingBottom: 4,\n    height: \"calc(32px - 2px)\",\n  },\n  splitDisabled: {\n    color: theme.colors.secondary_60,\n  },\n  firstButton: {},\n  lastButton: {},\n\n  // TODO - review the need for these classes in v6\n  primary: {},\n  primarySubtle: {},\n  primaryGhost: {},\n  secondary: {},\n  secondarySubtle: {},\n  secondaryGhost: {},\n});\n\nexport const getSplitContainerColor = (\n  color: string,\n  type?: string,\n  disabled?: boolean,\n) => ({\n  color: getColoringStyle(color, type).color,\n  backgroundColor: disabled\n    ? theme.colors.atmo3\n    : type === \"subtle\"\n      ? theme.colors.atmo1\n      : \"transparent\",\n});\n\nexport const getSplitContainerHeight = (size: HvButtonSize) => ({\n  height: `calc(${getSizeStyles(size).height} - 2px)`,\n});\n"],"names":["createClasses","theme","dropDownMenuClasses","getColoringStyle","getSizeStyles"],"mappings":"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"}

package/dist/cjs/OverflowTooltip/OverflowTooltip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"OverflowTooltip.cjs","sources":["../../../src/OverflowTooltip/OverflowTooltip.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTooltip, HvTooltipProps } from \"../Tooltip\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./OverflowTooltip.styles\";\n\nexport { staticClasses as overflowTooltipClasses };\nexport type HvOverflowTooltipClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvOverflowTooltipProps extends HvBaseProps {\n  /** The node that will be rendered inside the tooltip. */\n  data: React.ReactNode;\n  /** If true, the tooltip is shown. */\n  open?: boolean;\n  /** If `true`, the overflow tooltip will always use the paragraph overflow style. */\n  paragraphOverflow?: boolean;\n  /** Tooltip placement. */\n  placement?:\n    | \"bottom-end\"\n    | \"bottom-start\"\n    | \"bottom\"\n    | \"left-end\"\n    | \"left-start\"\n    | \"left\"\n    | \"right-end\"\n    | \"right-start\"\n    | \"right\"\n    | \"top-end\"\n    | \"top-start\"\n    | \"top\";\n  /** Extra properties to add to the tooltip. */\n  tooltipsProps?: Partial<HvTooltipProps>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvOverflowTooltipClasses;\n}\n\nconst isParagraph = (children = \"\") => /\\s/.test(children);\n\n/**\n * This component generates a tooltip whenever the text is overflowed.\n */\nexport const HvOverflowTooltip = (props: HvOverflowTooltipProps) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    data,\n    open,\n    paragraphOverflow,\n    placement = \"top-start\",\n    tooltipsProps,\n  } = useDefaultProps(\"HvOverflowTooltip\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const {\n    height = 0,\n    width = 0,\n    ref,\n  } = useResizeDetector({\n    refreshMode: \"debounce\",\n    refreshOptions: {\n      trailing: true,\n    },\n    handleHeight: false,\n  });\n\n  const isParag = useMemo(\n    () => paragraphOverflow && isParagraph(data?.toString()),\n    [data, paragraphOverflow]\n  );\n\n  // The difference should be higher than a pixel to be considered as overflowing\n  const isOverflowing = useMemo(() => {\n    if (isParag) {\n      const scrollHeight = ref.current?.scrollHeight || 0;\n\n      return scrollHeight - height >= 1;\n    }\n\n    const scrollWidth = ref.current?.scrollWidth || 0;\n\n    return scrollWidth - width >= 1;\n  }, [height, isParag, ref, width]);\n\n  const content = useMemo(\n    () => (\n      <div\n        ref={ref}\n        className={cx(\n          {\n            [classes.tooltipAnchor]: !isParag,\n            [classes.tooltipAnchorParagraph]: isParag,\n          },\n          className\n        )}\n      >\n        {data}\n      </div>\n    ),\n    [\n      className,\n      classes.tooltipAnchor,\n      classes.tooltipAnchorParagraph,\n      cx,\n      data,\n      isParag,\n      ref,\n    ]\n  );\n\n  return (\n    <HvTooltip\n      id={id}\n      disableHoverListener={!isOverflowing}\n      open={open}\n      placement={placement}\n      title={\n        <HvTypography className={classes.tooltipData} variant=\"body\">\n          {data}\n        </HvTypography>\n      }\n      // unset since `content` *is* the label\n      aria-label={null as any}\n      aria-labelledby={null as any}\n      {...tooltipsProps}\n    >\n      {content}\n    </HvTooltip>\n  );\n};\n"],"names":["useDefaultProps","useClasses","useResizeDetector","useMemo","jsx","HvTooltip","HvTypography"],"mappings":";;;;;;;;;AAyCA,MAAM,cAAc,CAAC,WAAW,OAAO,KAAK,KAAK,QAAQ;AAK5C,MAAA,oBAAoB,CAAC,UAAkC;AAC5D,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,EAAA,IACEA,gBAAgB,gBAAA,qBAAqB,KAAK;AAE9C,QAAM,EAAE,SAAS,GAAG,IAAIC,kCAAW,WAAW;AAExC,QAAA;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR;AAAA,MACEC,sCAAkB;AAAA,IACpB,aAAa;AAAA,IACb,gBAAgB;AAAA,MACd,UAAU;AAAA,IACZ;AAAA,IACA,cAAc;AAAA,EAAA,CACf;AAED,QAAM,UAAUC,MAAA;AAAA,IACd,MAAM,qBAAqB,YAAY,MAAM,UAAU;AAAA,IACvD,CAAC,MAAM,iBAAiB;AAAA,EAAA;AAIpB,QAAA,gBAAgBA,MAAAA,QAAQ,MAAM;AAClC,QAAI,SAAS;AACL,YAAA,eAAe,IAAI,SAAS,gBAAgB;AAElD,aAAO,eAAe,UAAU;AAAA,IAClC;AAEM,UAAA,cAAc,IAAI,SAAS,eAAe;AAEhD,WAAO,cAAc,SAAS;AAAA,KAC7B,CAAC,QAAQ,SAAS,KAAK,KAAK,CAAC;AAEhC,QAAM,UAAUA,MAAA;AAAA,IACd,MACEC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,YACE,CAAC,QAAQ,aAAa,GAAG,CAAC;AAAA,YAC1B,CAAC,QAAQ,sBAAsB,GAAG;AAAA,UACpC;AAAA,UACA;AAAA,QACF;AAAA,QAEC,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAEF;AAAA,MACE;AAAA,MACA,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAIA,SAAAA,2BAAA;AAAA,IAACC,QAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA,sBAAsB,CAAC;AAAA,MACvB;AAAA,MACA;AAAA,MACA,sCACGC,yBAAa,EAAA,WAAW,QAAQ,aAAa,SAAQ,QACnD,UACH,KAAA,CAAA;AAAA,MAGF,cAAY;AAAA,MACZ,mBAAiB;AAAA,MAChB,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;;;"}
+{"version":3,"file":"OverflowTooltip.cjs","sources":["../../../src/OverflowTooltip/OverflowTooltip.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvTooltip, HvTooltipProps } from \"../Tooltip\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./OverflowTooltip.styles\";\n\nexport { staticClasses as overflowTooltipClasses };\nexport type HvOverflowTooltipClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvOverflowTooltipProps extends HvBaseProps {\n  /** The node that will be rendered inside the tooltip. */\n  data: React.ReactNode;\n  /** If true, the tooltip is shown. */\n  open?: boolean;\n  /** If `true`, the overflow tooltip will always use the paragraph overflow style. */\n  paragraphOverflow?: boolean;\n  /** Tooltip placement. */\n  placement?:\n    | \"bottom-end\"\n    | \"bottom-start\"\n    | \"bottom\"\n    | \"left-end\"\n    | \"left-start\"\n    | \"left\"\n    | \"right-end\"\n    | \"right-start\"\n    | \"right\"\n    | \"top-end\"\n    | \"top-start\"\n    | \"top\";\n  /** Extra properties to add to the tooltip. */\n  tooltipsProps?: Partial<HvTooltipProps>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvOverflowTooltipClasses;\n}\n\nconst isParagraph = (children = \"\") => /\\s/.test(children);\n\n/**\n * This component generates a tooltip whenever the text is overflowed.\n */\nexport const HvOverflowTooltip = (props: HvOverflowTooltipProps) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    data,\n    open,\n    paragraphOverflow,\n    placement = \"top-start\",\n    tooltipsProps,\n  } = useDefaultProps(\"HvOverflowTooltip\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const {\n    height = 0,\n    width = 0,\n    ref,\n  } = useResizeDetector({\n    refreshMode: \"debounce\",\n    refreshOptions: {\n      trailing: true,\n    },\n    handleHeight: false,\n  });\n\n  const isParag = useMemo(\n    () => paragraphOverflow && isParagraph(data?.toString()),\n    [data, paragraphOverflow],\n  );\n\n  // The difference should be higher than a pixel to be considered as overflowing\n  const isOverflowing = useMemo(() => {\n    if (isParag) {\n      const scrollHeight = ref.current?.scrollHeight || 0;\n\n      return scrollHeight - height >= 1;\n    }\n\n    const scrollWidth = ref.current?.scrollWidth || 0;\n\n    return scrollWidth - width >= 1;\n  }, [height, isParag, ref, width]);\n\n  const content = useMemo(\n    () => (\n      <div\n        ref={ref}\n        className={cx(\n          {\n            [classes.tooltipAnchor]: !isParag,\n            [classes.tooltipAnchorParagraph]: isParag,\n          },\n          className,\n        )}\n      >\n        {data}\n      </div>\n    ),\n    [\n      className,\n      classes.tooltipAnchor,\n      classes.tooltipAnchorParagraph,\n      cx,\n      data,\n      isParag,\n      ref,\n    ],\n  );\n\n  return (\n    <HvTooltip\n      id={id}\n      disableHoverListener={!isOverflowing}\n      open={open}\n      placement={placement}\n      title={\n        <HvTypography className={classes.tooltipData} variant=\"body\">\n          {data}\n        </HvTypography>\n      }\n      // unset since `content` *is* the label\n      aria-label={null as any}\n      aria-labelledby={null as any}\n      {...tooltipsProps}\n    >\n      {content}\n    </HvTooltip>\n  );\n};\n"],"names":["useDefaultProps","useClasses","useResizeDetector","useMemo","jsx","HvTooltip","HvTypography"],"mappings":";;;;;;;;;AAwCA,MAAM,cAAc,CAAC,WAAW,OAAO,KAAK,KAAK,QAAQ;AAK5C,MAAA,oBAAoB,CAAC,UAAkC;AAC5D,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,EAAA,IACEA,gBAAgB,gBAAA,qBAAqB,KAAK;AAE9C,QAAM,EAAE,SAAS,GAAG,IAAIC,kCAAW,WAAW;AAExC,QAAA;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR;AAAA,MACEC,sCAAkB;AAAA,IACpB,aAAa;AAAA,IACb,gBAAgB;AAAA,MACd,UAAU;AAAA,IACZ;AAAA,IACA,cAAc;AAAA,EAAA,CACf;AAED,QAAM,UAAUC,MAAA;AAAA,IACd,MAAM,qBAAqB,YAAY,MAAM,UAAU;AAAA,IACvD,CAAC,MAAM,iBAAiB;AAAA,EAAA;AAIpB,QAAA,gBAAgBA,MAAAA,QAAQ,MAAM;AAClC,QAAI,SAAS;AACL,YAAA,eAAe,IAAI,SAAS,gBAAgB;AAElD,aAAO,eAAe,UAAU;AAAA,IAClC;AAEM,UAAA,cAAc,IAAI,SAAS,eAAe;AAEhD,WAAO,cAAc,SAAS;AAAA,KAC7B,CAAC,QAAQ,SAAS,KAAK,KAAK,CAAC;AAEhC,QAAM,UAAUA,MAAA;AAAA,IACd,MACEC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,YACE,CAAC,QAAQ,aAAa,GAAG,CAAC;AAAA,YAC1B,CAAC,QAAQ,sBAAsB,GAAG;AAAA,UACpC;AAAA,UACA;AAAA,QACF;AAAA,QAEC,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAEF;AAAA,MACE;AAAA,MACA,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAIA,SAAAA,2BAAA;AAAA,IAACC,QAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA,sBAAsB,CAAC;AAAA,MACvB;AAAA,MACA;AAAA,MACA,sCACGC,yBAAa,EAAA,WAAW,QAAQ,aAAa,SAAQ,QACnD,UACH,KAAA,CAAA;AAAA,MAGF,cAAY;AAAA,MACZ,mBAAiB;AAAA,MAChB,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;;;"}

package/dist/cjs/OverflowTooltip/OverflowTooltip.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"OverflowTooltip.styles.cjs","sources":["../../../src/OverflowTooltip/OverflowTooltip.styles.tsx"],"sourcesContent":["import { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvOverflowTooltip\",\n  {\n    tooltipData: {},\n    tooltipAnchor: {\n      whiteSpace: \"nowrap\",\n      overflow: \"hidden\",\n      textOverflow: \"ellipsis\",\n      maxWidth: \"100%\",\n      width: \"fit-content\",\n    },\n    tooltipAnchorParagraph: {\n      overflow: \"hidden\",\n      display: \"-webkit-box\",\n      WebkitLineClamp: 3,\n      WebkitBoxOrient: \"vertical\",\n    },\n  }\n);\n"],"names":["createClasses"],"mappings":";;;AAEa,MAAA,EAAE,eAAe,WAAA,IAAeA,QAAA;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,aAAa,CAAC;AAAA,IACd,eAAe;AAAA,MACb,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,cAAc;AAAA,MACd,UAAU;AAAA,MACV,OAAO;AAAA,IACT;AAAA,IACA,wBAAwB;AAAA,MACtB,UAAU;AAAA,MACV,SAAS;AAAA,MACT,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,IACnB;AAAA,EACF;AACF;;;"}
+{"version":3,"file":"OverflowTooltip.styles.cjs","sources":["../../../src/OverflowTooltip/OverflowTooltip.styles.tsx"],"sourcesContent":["import { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvOverflowTooltip\",\n  {\n    tooltipData: {},\n    tooltipAnchor: {\n      whiteSpace: \"nowrap\",\n      overflow: \"hidden\",\n      textOverflow: \"ellipsis\",\n      maxWidth: \"100%\",\n      width: \"fit-content\",\n    },\n    tooltipAnchorParagraph: {\n      overflow: \"hidden\",\n      display: \"-webkit-box\",\n      WebkitLineClamp: 3,\n      WebkitBoxOrient: \"vertical\",\n    },\n  },\n);\n"],"names":["createClasses"],"mappings":";;;AAEa,MAAA,EAAE,eAAe,WAAA,IAAeA,QAAA;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,aAAa,CAAC;AAAA,IACd,eAAe;AAAA,MACb,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,cAAc;AAAA,MACd,UAAU;AAAA,MACV,OAAO;AAAA,IACT;AAAA,IACA,wBAAwB;AAAA,MACtB,UAAU;AAAA,MACV,SAAS;AAAA,MACT,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,IACnB;AAAA,EACF;AACF;;;"}

package/dist/cjs/Pagination/Pagination.cjs

@@ -5,11 +5,11 @@ const React = require("react");
 const Hidden = require("@mui/material/Hidden");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const useDefaultProps = require("../hooks/useDefaultProps.cjs");
-const setId = require("../utils/setId.cjs");
-const keyboardUtils = require("../utils/keyboardUtils.cjs");
 const useLabels = require("../hooks/useLabels.cjs");
-const Select = require("./Select.cjs");
+const keyboardUtils = require("../utils/keyboardUtils.cjs");
+const setId = require("../utils/setId.cjs");
 const Pagination_styles = require("./Pagination.styles.cjs");
+const Select = require("./Select.cjs");
 const utils = require("./utils.cjs");
 const Typography = require("../Typography/Typography.cjs");
 const IconButton = require("../IconButton/IconButton.cjs");

package/dist/cjs/Pagination/Pagination.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.cjs","sources":["../../../src/Pagination/Pagination.tsx"],"sourcesContent":["import { useCallback, useEffect } from \"react\";\nimport Hidden from \"@mui/material/Hidden\";\nimport {\n  Start,\n  End,\n  Backwards,\n  Forwards,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvInput, HvInputProps } from \"../Input\";\nimport { HvTypography } from \"../Typography\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { setId } from \"../utils/setId\";\nimport { isKey } from \"../utils/keyboardUtils\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { useLabels } from \"../hooks/useLabels\";\nimport HvSelect, { Option } from \"./Select\";\nimport { staticClasses, useClasses } from \"./Pagination.styles\";\nimport { usePageInput, getSafePage, setColor } from \"./utils\";\nimport { HvIconButton } from \"../IconButton\";\n\nexport { staticClasses as paginationClasses };\n\nexport type HvPaginationClasses = ExtractNames<typeof useClasses>;\n\nconst defaultPageSizeOptions = [5, 10, 20, 25, 50, 100];\n\nconst DEFAULT_LABELS = {\n  /** The show label. */\n  pageSizePrev: \"Show\",\n  /** Indicate the units of the page size selection. */\n  pageSizeEntryName: \"rows\",\n  /** Used for the aria-label of the selection of number of unit.s */\n  pageSizeSelectorDescription: \"Select how many to display\",\n  /** Separator of current page and total pages. */\n  pagesSeparator: \"/\",\n  /** Title of button `firstPage`. @deprecated Use `firstPage` instead. */\n  paginationFirstPageTitle: \"First page\",\n  /** Title of button `previousPage`. @deprecated Use `previousPage` instead. */\n  paginationPreviousPageTitle: \"Previous page\",\n  /** Title of button `nextPage`. @deprecated Use `nextPage` instead. */\n  paginationNextPageTitle: \"Next page\",\n  /** Title of button `lastPage`. @deprecated Use `lastPage` instead. */\n  paginationLastPageTitle: \"Last page\",\n  /** Aria-label passed to the page input. */\n  paginationInputLabel: \"Current page\",\n  /** Label of the first page button */\n  firstPage: \"First Page\",\n  /** Label of the previous page button */\n  previousPage: \"Previous Page\",\n  /** Label of the next page button */\n  nextPage: \"Next Page\",\n  /** Label of the last page button */\n  lastPage: \"Last Page\",\n};\n\nexport type HvPaginationLabels = Partial<typeof DEFAULT_LABELS>;\n\nexport interface HvPaginationProps extends HvBaseProps {\n  /** The number of pages the component has. */\n  pages?: number;\n  /** The currently selected page (0-indexed). */\n  page?: number;\n  /** Controls whether the left page size mechanism should be visible. */\n  showPageSizeOptions?: boolean;\n  /** The array of possible page sizes for the dropdown. */\n  pageSizeOptions?: number[];\n  /** The currently selected page size. */\n  pageSize?: number;\n  /** Controls whether the central page changing mechanism should be visible. */\n  showPageJump?: boolean;\n  /** Controls whether the previous/first page buttons are enabled. */\n  canPrevious?: boolean;\n  /** Controls whether the next/last page buttons are enabled. */\n  canNext?: boolean;\n  /** Function called when the page changes. */\n  onPageChange?: (page: number) => void;\n  /** Function called when the page size changes. */\n  onPageSizeChange?: (pageSize: number) => void;\n  /** An object containing all the labels for the component. */\n  labels?: HvPaginationLabels;\n  /** Other props to show page component. */\n  showPageProps?: React.HTMLAttributes<HTMLDivElement>;\n  /** Other props to pagination component. */\n  navigationProps?: React.HTMLAttributes<HTMLDivElement>;\n  /** Extra properties passed to the input component representing the current pages. */\n  currentPageInputProps?: HvInputProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvPaginationClasses;\n}\n\n/**\n * Pagination is the process of dividing a document into discrete pages. It relates to how users interact\n * with structured content on a website or application.\n */\nexport const HvPagination = (props: HvPaginationProps) => {\n  const {\n    classes: classesProp,\n    className,\n    id,\n    pages = 1,\n    page = 0,\n    showPageSizeOptions = true,\n    pageSizeOptions = defaultPageSizeOptions,\n    pageSize = defaultPageSizeOptions[1],\n    showPageJump = true,\n    canPrevious = false,\n    canNext = false,\n    onPageChange,\n    onPageSizeChange,\n    labels: labelsProp,\n    showPageProps,\n    navigationProps,\n    currentPageInputProps,\n    ...others\n  } = useDefaultProps(\"HvPagination\", props);\n\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n  const [pageInput, handleInputChange] = usePageInput(page);\n  const { classes, cx } = useClasses(classesProp);\n\n  const changePage = useCallback(\n    (newPage: number) => {\n      const safePage: number = getSafePage(newPage, page, pages);\n\n      onPageChange?.(safePage);\n      handleInputChange(null, safePage + 1);\n    },\n    [page, pages, onPageChange, handleInputChange]\n  );\n\n  useEffect(() => {\n    if (page >= pages && pages > 0) {\n      changePage(page);\n    }\n  }, [changePage, page, pages]);\n\n  useEffect(() => {\n    if (pageInput !== page + 1) {\n      handleInputChange(null, page + 1);\n    }\n\n    // we only want to \"fix\" the input's display value when `page` property changed\n    // (either externally or when internally committed - onBlur or Enter),\n    // not while editing the input.\n    // breaking a rule of hooks isn't ideal and it's just a hack for fixing\n    // a bug preventing properly controlling of the `page` property.\n    // fixing it some other way would potentially introduce a breaking change.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [handleInputChange, page]);\n\n  const renderPageJump = () => (\n    <div className={classes.pageJump}>\n      <HvInput\n        id={setId(id, \"currentPage\")}\n        labels={labels}\n        inputProps={{\n          \"aria-label\": labels?.paginationInputLabel,\n          // We really want the native number input\n          type: \"number\",\n        }}\n        classes={{\n          root: classes?.pageSizeInputContainer,\n          input: classes?.pageSizeInput,\n          inputRoot: classes?.pageSizeInputRoot,\n        }}\n        onChange={(event, value) => handleInputChange(event, Number(value))}\n        value={String(pageInput)}\n        onBlur={(evt, value) => changePage(Number(value) - 1)}\n        onKeyDown={(evt, value) =>\n          isKey(evt, \"Enter\") && changePage(Number(value) - 1)\n        }\n        disabled={pageSize === 0}\n        disableClear\n        {...currentPageInputProps}\n      />\n    </div>\n  );\n\n  return (\n    <div id={id} className={cx(classes.root, className)} {...others}>\n      <div className={classes.pageSizeOptions} {...showPageProps}>\n        {showPageSizeOptions && (\n          <>\n            <Hidden xsDown>\n              <HvTypography\n                component=\"span\"\n                className={classes?.pageSizeTextContainer}\n              >\n                {labels?.pageSizePrev}\n              </HvTypography>\n            </Hidden>\n            <HvSelect\n              id={setId(id, \"pageSize\")}\n              disabled={pageSize === 0}\n              className={classes.pageSizeOptionsSelect}\n              aria-label={labels?.pageSizeSelectorDescription}\n              onChange={(_: any, val: number) => onPageSizeChange?.(val)}\n              value={pageSize}\n              classes={{\n                header: classes.pageSizeHeader,\n                root: classes.pageSizeRoot,\n              }}\n            >\n              {pageSizeOptions.map((option) => (\n                <Option key={option} value={option}>\n                  {option}\n                </Option>\n              ))}\n            </HvSelect>\n            <Hidden xsDown>\n              <HvTypography\n                component=\"span\"\n                className={classes.pageSizeTextContainer}\n              >\n                {labels?.pageSizeEntryName}\n              </HvTypography>\n            </Hidden>\n          </>\n        )}\n      </div>\n      <div className={classes.pageNavigator} {...navigationProps}>\n        <HvIconButton\n          id={setId(id, \"firstPage-button\")}\n          className={classes.iconContainer}\n          disabled={!canPrevious}\n          onClick={() => changePage(0)}\n          title={labels?.firstPage || labels?.paginationFirstPageTitle}\n        >\n          <Start\n            role=\"none\"\n            className={classes.icon}\n            color={setColor(!canPrevious)}\n            iconSize=\"XS\"\n          />\n        </HvIconButton>\n        <HvIconButton\n          id={setId(id, \"previousPage-button\")}\n          className={classes.iconContainer}\n          disabled={!canPrevious}\n          onClick={() => changePage(page - 1)}\n          title={labels?.previousPage || labels?.paginationPreviousPageTitle}\n        >\n          <Backwards\n            role=\"none\"\n            className={classes.icon}\n            color={setColor(!canPrevious)}\n            iconSize=\"XS\"\n          />\n        </HvIconButton>\n        <div className={classes.pageInfo}>\n          {showPageJump ? (\n            renderPageJump()\n          ) : (\n            <HvTypography variant=\"caption2\" component=\"span\">{`${\n              page + 1\n            }`}</HvTypography>\n          )}\n          <HvTypography component=\"span\">{`${labels?.pagesSeparator} `}</HvTypography>\n          <HvTypography\n            component=\"span\"\n            id={setId(id, \"totalPages\")}\n            className={classes.totalPagesTextContainer}\n          >\n            {pages}\n          </HvTypography>\n        </div>\n        <HvIconButton\n          id={setId(id, \"nextPage-button\")}\n          className={classes.iconContainer}\n          disabled={!canNext}\n          onClick={() => changePage(page + 1)}\n          title={labels?.nextPage || labels?.paginationNextPageTitle}\n        >\n          <Forwards\n            role=\"none\"\n            className={classes.icon}\n            color={setColor(!canNext)}\n            iconSize=\"XS\"\n          />\n        </HvIconButton>\n        <HvIconButton\n          id={setId(id, \"lastPage-button\")}\n          className={classes.iconContainer}\n          disabled={!canNext}\n          onClick={() => changePage(pages - 1)}\n          title={labels?.lastPage || labels?.paginationLastPageTitle}\n        >\n          <End\n            className={classes.icon}\n            color={setColor(!canNext)}\n            iconSize=\"XS\"\n          />\n        </HvIconButton>\n      </div>\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useLabels","usePageInput","useClasses","useCallback","getSafePage","useEffect","jsx","HvInput","setId","isKey","jsxs","Fragment","Hidden","HvTypography","HvSelect","Option","HvIconButton","Start","setColor","Backwards","Forwards","End"],"mappings":"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"}
+{"version":3,"file":"Pagination.cjs","sources":["../../../src/Pagination/Pagination.tsx"],"sourcesContent":["import { useCallback, useEffect } from \"react\";\nimport Hidden from \"@mui/material/Hidden\";\nimport {\n  Backwards,\n  End,\n  Forwards,\n  Start,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useLabels } from \"../hooks/useLabels\";\nimport { HvIconButton } from \"../IconButton\";\nimport { HvInput, HvInputProps } from \"../Input\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { isKey } from \"../utils/keyboardUtils\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Pagination.styles\";\nimport HvSelect, { Option } from \"./Select\";\nimport { getSafePage, setColor, usePageInput } from \"./utils\";\n\nexport { staticClasses as paginationClasses };\n\nexport type HvPaginationClasses = ExtractNames<typeof useClasses>;\n\nconst defaultPageSizeOptions = [5, 10, 20, 25, 50, 100];\n\nconst DEFAULT_LABELS = {\n  /** The show label. */\n  pageSizePrev: \"Show\",\n  /** Indicate the units of the page size selection. */\n  pageSizeEntryName: \"rows\",\n  /** Used for the aria-label of the selection of number of unit.s */\n  pageSizeSelectorDescription: \"Select how many to display\",\n  /** Separator of current page and total pages. */\n  pagesSeparator: \"/\",\n  /** Title of button `firstPage`. @deprecated Use `firstPage` instead. */\n  paginationFirstPageTitle: \"First page\",\n  /** Title of button `previousPage`. @deprecated Use `previousPage` instead. */\n  paginationPreviousPageTitle: \"Previous page\",\n  /** Title of button `nextPage`. @deprecated Use `nextPage` instead. */\n  paginationNextPageTitle: \"Next page\",\n  /** Title of button `lastPage`. @deprecated Use `lastPage` instead. */\n  paginationLastPageTitle: \"Last page\",\n  /** Aria-label passed to the page input. */\n  paginationInputLabel: \"Current page\",\n  /** Label of the first page button */\n  firstPage: \"First Page\",\n  /** Label of the previous page button */\n  previousPage: \"Previous Page\",\n  /** Label of the next page button */\n  nextPage: \"Next Page\",\n  /** Label of the last page button */\n  lastPage: \"Last Page\",\n};\n\nexport type HvPaginationLabels = Partial<typeof DEFAULT_LABELS>;\n\nexport interface HvPaginationProps extends HvBaseProps {\n  /** The number of pages the component has. */\n  pages?: number;\n  /** The currently selected page (0-indexed). */\n  page?: number;\n  /** Controls whether the left page size mechanism should be visible. */\n  showPageSizeOptions?: boolean;\n  /** The array of possible page sizes for the dropdown. */\n  pageSizeOptions?: number[];\n  /** The currently selected page size. */\n  pageSize?: number;\n  /** Controls whether the central page changing mechanism should be visible. */\n  showPageJump?: boolean;\n  /** Controls whether the previous/first page buttons are enabled. */\n  canPrevious?: boolean;\n  /** Controls whether the next/last page buttons are enabled. */\n  canNext?: boolean;\n  /** Function called when the page changes. */\n  onPageChange?: (page: number) => void;\n  /** Function called when the page size changes. */\n  onPageSizeChange?: (pageSize: number) => void;\n  /** An object containing all the labels for the component. */\n  labels?: HvPaginationLabels;\n  /** Other props to show page component. */\n  showPageProps?: React.HTMLAttributes<HTMLDivElement>;\n  /** Other props to pagination component. */\n  navigationProps?: React.HTMLAttributes<HTMLDivElement>;\n  /** Extra properties passed to the input component representing the current pages. */\n  currentPageInputProps?: HvInputProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvPaginationClasses;\n}\n\n/**\n * Pagination is the process of dividing a document into discrete pages. It relates to how users interact\n * with structured content on a website or application.\n */\nexport const HvPagination = (props: HvPaginationProps) => {\n  const {\n    classes: classesProp,\n    className,\n    id,\n    pages = 1,\n    page = 0,\n    showPageSizeOptions = true,\n    pageSizeOptions = defaultPageSizeOptions,\n    pageSize = defaultPageSizeOptions[1],\n    showPageJump = true,\n    canPrevious = false,\n    canNext = false,\n    onPageChange,\n    onPageSizeChange,\n    labels: labelsProp,\n    showPageProps,\n    navigationProps,\n    currentPageInputProps,\n    ...others\n  } = useDefaultProps(\"HvPagination\", props);\n\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n  const [pageInput, handleInputChange] = usePageInput(page);\n  const { classes, cx } = useClasses(classesProp);\n\n  const changePage = useCallback(\n    (newPage: number) => {\n      const safePage: number = getSafePage(newPage, page, pages);\n\n      onPageChange?.(safePage);\n      handleInputChange(null, safePage + 1);\n    },\n    [page, pages, onPageChange, handleInputChange],\n  );\n\n  useEffect(() => {\n    if (page >= pages && pages > 0) {\n      changePage(page);\n    }\n  }, [changePage, page, pages]);\n\n  useEffect(() => {\n    if (pageInput !== page + 1) {\n      handleInputChange(null, page + 1);\n    }\n\n    // we only want to \"fix\" the input's display value when `page` property changed\n    // (either externally or when internally committed - onBlur or Enter),\n    // not while editing the input.\n    // breaking a rule of hooks isn't ideal and it's just a hack for fixing\n    // a bug preventing properly controlling of the `page` property.\n    // fixing it some other way would potentially introduce a breaking change.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [handleInputChange, page]);\n\n  const renderPageJump = () => (\n    <div className={classes.pageJump}>\n      <HvInput\n        id={setId(id, \"currentPage\")}\n        labels={labels}\n        inputProps={{\n          \"aria-label\": labels?.paginationInputLabel,\n          // We really want the native number input\n          type: \"number\",\n        }}\n        classes={{\n          root: classes?.pageSizeInputContainer,\n          input: classes?.pageSizeInput,\n          inputRoot: classes?.pageSizeInputRoot,\n        }}\n        onChange={(event, value) => handleInputChange(event, Number(value))}\n        value={String(pageInput)}\n        onBlur={(evt, value) => changePage(Number(value) - 1)}\n        onKeyDown={(evt, value) =>\n          isKey(evt, \"Enter\") && changePage(Number(value) - 1)\n        }\n        disabled={pageSize === 0}\n        disableClear\n        {...currentPageInputProps}\n      />\n    </div>\n  );\n\n  return (\n    <div id={id} className={cx(classes.root, className)} {...others}>\n      <div className={classes.pageSizeOptions} {...showPageProps}>\n        {showPageSizeOptions && (\n          <>\n            <Hidden xsDown>\n              <HvTypography\n                component=\"span\"\n                className={classes?.pageSizeTextContainer}\n              >\n                {labels?.pageSizePrev}\n              </HvTypography>\n            </Hidden>\n            <HvSelect\n              id={setId(id, \"pageSize\")}\n              disabled={pageSize === 0}\n              className={classes.pageSizeOptionsSelect}\n              aria-label={labels?.pageSizeSelectorDescription}\n              onChange={(_: any, val: number) => onPageSizeChange?.(val)}\n              value={pageSize}\n              classes={{\n                header: classes.pageSizeHeader,\n                root: classes.pageSizeRoot,\n              }}\n            >\n              {pageSizeOptions.map((option) => (\n                <Option key={option} value={option}>\n                  {option}\n                </Option>\n              ))}\n            </HvSelect>\n            <Hidden xsDown>\n              <HvTypography\n                component=\"span\"\n                className={classes.pageSizeTextContainer}\n              >\n                {labels?.pageSizeEntryName}\n              </HvTypography>\n            </Hidden>\n          </>\n        )}\n      </div>\n      <div className={classes.pageNavigator} {...navigationProps}>\n        <HvIconButton\n          id={setId(id, \"firstPage-button\")}\n          className={classes.iconContainer}\n          disabled={!canPrevious}\n          onClick={() => changePage(0)}\n          title={labels?.firstPage || labels?.paginationFirstPageTitle}\n        >\n          <Start\n            role=\"none\"\n            className={classes.icon}\n            color={setColor(!canPrevious)}\n            iconSize=\"XS\"\n          />\n        </HvIconButton>\n        <HvIconButton\n          id={setId(id, \"previousPage-button\")}\n          className={classes.iconContainer}\n          disabled={!canPrevious}\n          onClick={() => changePage(page - 1)}\n          title={labels?.previousPage || labels?.paginationPreviousPageTitle}\n        >\n          <Backwards\n            role=\"none\"\n            className={classes.icon}\n            color={setColor(!canPrevious)}\n            iconSize=\"XS\"\n          />\n        </HvIconButton>\n        <div className={classes.pageInfo}>\n          {showPageJump ? (\n            renderPageJump()\n          ) : (\n            <HvTypography variant=\"caption2\" component=\"span\">{`${\n              page + 1\n            }`}</HvTypography>\n          )}\n          <HvTypography component=\"span\">{`${labels?.pagesSeparator} `}</HvTypography>\n          <HvTypography\n            component=\"span\"\n            id={setId(id, \"totalPages\")}\n            className={classes.totalPagesTextContainer}\n          >\n            {pages}\n          </HvTypography>\n        </div>\n        <HvIconButton\n          id={setId(id, \"nextPage-button\")}\n          className={classes.iconContainer}\n          disabled={!canNext}\n          onClick={() => changePage(page + 1)}\n          title={labels?.nextPage || labels?.paginationNextPageTitle}\n        >\n          <Forwards\n            role=\"none\"\n            className={classes.icon}\n            color={setColor(!canNext)}\n            iconSize=\"XS\"\n          />\n        </HvIconButton>\n        <HvIconButton\n          id={setId(id, \"lastPage-button\")}\n          className={classes.iconContainer}\n          disabled={!canNext}\n          onClick={() => changePage(pages - 1)}\n          title={labels?.lastPage || labels?.paginationLastPageTitle}\n        >\n          <End\n            className={classes.icon}\n            color={setColor(!canNext)}\n            iconSize=\"XS\"\n          />\n        </HvIconButton>\n      </div>\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useLabels","usePageInput","useClasses","useCallback","getSafePage","useEffect","jsx","HvInput","setId","isKey","jsxs","Fragment","Hidden","HvTypography","HvSelect","Option","HvIconButton","Start","setColor","Backwards","Forwards","End"],"mappings":"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"}

package/dist/cjs/Pagination/Pagination.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.styles.cjs","sources":["../../../src/Pagination/Pagination.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { inputClasses } from \"../Input\";\nimport { createClasses } from \"../utils/classes\";\nimport { baseDropdownClasses } from \"../BaseDropdown\";\n\nconst hoverColor = theme.colors.atmo3;\n\nexport const { staticClasses, useClasses } = createClasses(\"HvPagination\", {\n  /** Styles applied to the component root class. */\n  root: {\n    position: \"relative\",\n    zIndex: 1,\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"stretch\",\n    flexWrap: \"wrap\",\n    marginTop: theme.space.sm,\n    [`& $pageSizeInput`]: {\n      ...(theme.typography.caption2 as React.CSSProperties),\n      \"&:focus\": {\n        padding: 0,\n      },\n    },\n    [`& $pageSizeInputContainer`]: {\n      width: 24,\n      minWidth: 24,\n      maxWidth: theme.spacing(8),\n    },\n    [`&& $pageSizeInputRoot`]: {\n      backgroundColor: \"transparent\",\n      height: \"24px\",\n      \"&:focus, &:focus-within, &:hover\": {\n        backgroundColor: hoverColor,\n      },\n    },\n  },\n  /** Styles applied to the page size selector container. */\n  pageSizeOptions: {\n    display: \"flex\",\n    position: \"absolute\",\n    height: 24,\n    top: \"50%\",\n    transform: \"translateY(-50%)\",\n    left: \"0\",\n  },\n  pageSizeHeader: {\n    height: 24,\n    display: \"flex\",\n    alignItems: \"center\",\n    [`& .${baseDropdownClasses.arrowContainer}`]: {\n      marginTop: -2,\n    },\n  },\n  pageSizeRoot: {\n    width: \"auto\",\n  },\n  /** Styles applied to the element that holds the labels for the page size selector */\n  pageSizeTextContainer: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    height: \"24px\",\n    padding: \"8px 0\",\n    ...(theme.typography.caption2 as React.CSSProperties),\n  },\n  totalPagesTextContainer: {\n    ...(theme.typography.caption2 as React.CSSProperties),\n  },\n  /** Styles applied to the page size selector dropdown element. */\n  pageSizeOptionsSelect: {\n    display: \"inline-block\",\n    margin: `0px ${theme.space.xs}`,\n    width: \"auto\",\n\n    ...(theme.typography.caption2 as React.CSSProperties),\n  },\n  /** Styles applied to the page navigation container. */\n  pageNavigator: {\n    display: \"flex\",\n    alignItems: \"center\",\n    height: \"32px\",\n    gap: 8,\n  },\n  /** Styles applied to each navigation `HvButton` icon container. */\n  iconContainer: {\n    padding: 0,\n  },\n  /** Styles applied to each navigation icon. */\n  icon: {},\n  /** Styles applied to the central page information container. */\n  pageInfo: {\n    display: \"inline-block\",\n    whiteSpace: \"nowrap\",\n    height: \"32px\",\n    lineHeight: \"32px\",\n  },\n  /** Styles applied to the page selector input container. */\n  pageJump: {\n    display: \"inline-block\",\n    marginRight: `4px`,\n    [`& .${inputClasses.inputRoot}`]: {\n      [`& $pageSizeInput`]: {\n        paddingLeft: `4px`,\n        paddingRight: `4px`,\n        margin: 0,\n        textAlign: \"center\",\n        borderRadius: theme.radii.base,\n        MozAppearance: \"textfield\",\n        \"&:focus\": {\n          backgroundColor: hoverColor,\n        },\n        \"&:hover\": {\n          cursor: \"pointer\",\n        },\n      },\n    },\n  },\n  /** Styles passed down to the page selector Input component as `input`. */\n  pageSizeInput: {},\n  /** Styles passed down to the page selector Input root. */\n  pageSizeInputRoot: {},\n  /** Styles passed down to the page selector Input component as `container`. */\n  pageSizeInputContainer: {},\n});\n"],"names":["theme","createClasses","baseDropdownClasses","inputClasses"],"mappings":";;;;;;;AAMA,MAAM,aAAaA,YAAAA,MAAM,OAAO;AAEzB,MAAM,EAAE,eAAe,eAAeC,QAAAA,cAAc,gBAAgB;AAAA;AAAA,EAEzE,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,WAAWD,YAAAA,MAAM,MAAM;AAAA,IACvB,CAAC,kBAAkB,GAAG;AAAA,MACpB,GAAIA,YAAAA,MAAM,WAAW;AAAA,MACrB,WAAW;AAAA,QACT,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,CAAC,2BAA2B,GAAG;AAAA,MAC7B,OAAO;AAAA,MACP,UAAU;AAAA,MACV,UAAUA,YAAAA,MAAM,QAAQ,CAAC;AAAA,IAC3B;AAAA,IACA,CAAC,uBAAuB,GAAG;AAAA,MACzB,iBAAiB;AAAA,MACjB,QAAQ;AAAA,MACR,oCAAoC;AAAA,QAClC,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,EACF;AAAA;AAAA,EAEA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,WAAW;AAAA,IACX,MAAM;AAAA,EACR;AAAA,EACA,gBAAgB;AAAA,IACd,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,CAAC,MAAME,kCAAoB,cAAc,EAAE,GAAG;AAAA,MAC5C,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,OAAO;AAAA,EACT;AAAA;AAAA,EAEA,uBAAuB;AAAA,IACrB,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,GAAIF,YAAAA,MAAM,WAAW;AAAA,EACvB;AAAA,EACA,yBAAyB;AAAA,IACvB,GAAIA,YAAAA,MAAM,WAAW;AAAA,EACvB;AAAA;AAAA,EAEA,uBAAuB;AAAA,IACrB,SAAS;AAAA,IACT,QAAQ,OAAOA,YAAM,MAAA,MAAM,EAAE;AAAA,IAC7B,OAAO;AAAA,IAEP,GAAIA,YAAAA,MAAM,WAAW;AAAA,EACvB;AAAA;AAAA,EAEA,eAAe;AAAA,IACb,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,KAAK;AAAA,EACP;AAAA;AAAA,EAEA,eAAe;AAAA,IACb,SAAS;AAAA,EACX;AAAA;AAAA,EAEA,MAAM,CAAC;AAAA;AAAA,EAEP,UAAU;AAAA,IACR,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,YAAY;AAAA,EACd;AAAA;AAAA,EAEA,UAAU;AAAA,IACR,SAAS;AAAA,IACT,aAAa;AAAA,IACb,CAAC,MAAMG,2BAAa,SAAS,EAAE,GAAG;AAAA,MAChC,CAAC,kBAAkB,GAAG;AAAA,QACpB,aAAa;AAAA,QACb,cAAc;AAAA,QACd,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,cAAcH,YAAAA,MAAM,MAAM;AAAA,QAC1B,eAAe;AAAA,QACf,WAAW;AAAA,UACT,iBAAiB;AAAA,QACnB;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,QACV;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA;AAAA,EAEA,eAAe,CAAC;AAAA;AAAA,EAEhB,mBAAmB,CAAC;AAAA;AAAA,EAEpB,wBAAwB,CAAC;AAC3B,CAAC;;;"}
+{"version":3,"file":"Pagination.styles.cjs","sources":["../../../src/Pagination/Pagination.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { baseDropdownClasses } from \"../BaseDropdown\";\nimport { inputClasses } from \"../Input\";\nimport { createClasses } from \"../utils/classes\";\n\nconst hoverColor = theme.colors.atmo3;\n\nexport const { staticClasses, useClasses } = createClasses(\"HvPagination\", {\n  /** Styles applied to the component root class. */\n  root: {\n    position: \"relative\",\n    zIndex: 1,\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"stretch\",\n    flexWrap: \"wrap\",\n    marginTop: theme.space.sm,\n    [`& $pageSizeInput`]: {\n      ...(theme.typography.caption2 as React.CSSProperties),\n      \"&:focus\": {\n        padding: 0,\n      },\n    },\n    [`& $pageSizeInputContainer`]: {\n      width: 24,\n      minWidth: 24,\n      maxWidth: theme.spacing(8),\n    },\n    [`&& $pageSizeInputRoot`]: {\n      backgroundColor: \"transparent\",\n      height: \"24px\",\n      \"&:focus, &:focus-within, &:hover\": {\n        backgroundColor: hoverColor,\n      },\n    },\n  },\n  /** Styles applied to the page size selector container. */\n  pageSizeOptions: {\n    display: \"flex\",\n    position: \"absolute\",\n    height: 24,\n    top: \"50%\",\n    transform: \"translateY(-50%)\",\n    left: \"0\",\n  },\n  pageSizeHeader: {\n    height: 24,\n    display: \"flex\",\n    alignItems: \"center\",\n    [`& .${baseDropdownClasses.arrowContainer}`]: {\n      marginTop: -2,\n    },\n  },\n  pageSizeRoot: {\n    width: \"auto\",\n  },\n  /** Styles applied to the element that holds the labels for the page size selector */\n  pageSizeTextContainer: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    height: \"24px\",\n    padding: \"8px 0\",\n    ...(theme.typography.caption2 as React.CSSProperties),\n  },\n  totalPagesTextContainer: {\n    ...(theme.typography.caption2 as React.CSSProperties),\n  },\n  /** Styles applied to the page size selector dropdown element. */\n  pageSizeOptionsSelect: {\n    display: \"inline-block\",\n    margin: `0px ${theme.space.xs}`,\n    width: \"auto\",\n\n    ...(theme.typography.caption2 as React.CSSProperties),\n  },\n  /** Styles applied to the page navigation container. */\n  pageNavigator: {\n    display: \"flex\",\n    alignItems: \"center\",\n    height: \"32px\",\n    gap: 8,\n  },\n  /** Styles applied to each navigation `HvButton` icon container. */\n  iconContainer: {\n    padding: 0,\n  },\n  /** Styles applied to each navigation icon. */\n  icon: {},\n  /** Styles applied to the central page information container. */\n  pageInfo: {\n    display: \"inline-block\",\n    whiteSpace: \"nowrap\",\n    height: \"32px\",\n    lineHeight: \"32px\",\n  },\n  /** Styles applied to the page selector input container. */\n  pageJump: {\n    display: \"inline-block\",\n    marginRight: `4px`,\n    [`& .${inputClasses.inputRoot}`]: {\n      [`& $pageSizeInput`]: {\n        paddingLeft: `4px`,\n        paddingRight: `4px`,\n        margin: 0,\n        textAlign: \"center\",\n        borderRadius: theme.radii.base,\n        MozAppearance: \"textfield\",\n        \"&:focus\": {\n          backgroundColor: hoverColor,\n        },\n        \"&:hover\": {\n          cursor: \"pointer\",\n        },\n      },\n    },\n  },\n  /** Styles passed down to the page selector Input component as `input`. */\n  pageSizeInput: {},\n  /** Styles passed down to the page selector Input root. */\n  pageSizeInputRoot: {},\n  /** Styles passed down to the page selector Input component as `container`. */\n  pageSizeInputContainer: {},\n});\n"],"names":["theme","createClasses","baseDropdownClasses","inputClasses"],"mappings":";;;;;;;AAMA,MAAM,aAAaA,YAAAA,MAAM,OAAO;AAEzB,MAAM,EAAE,eAAe,eAAeC,QAAAA,cAAc,gBAAgB;AAAA;AAAA,EAEzE,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,WAAWD,YAAAA,MAAM,MAAM;AAAA,IACvB,CAAC,kBAAkB,GAAG;AAAA,MACpB,GAAIA,YAAAA,MAAM,WAAW;AAAA,MACrB,WAAW;AAAA,QACT,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,CAAC,2BAA2B,GAAG;AAAA,MAC7B,OAAO;AAAA,MACP,UAAU;AAAA,MACV,UAAUA,YAAAA,MAAM,QAAQ,CAAC;AAAA,IAC3B;AAAA,IACA,CAAC,uBAAuB,GAAG;AAAA,MACzB,iBAAiB;AAAA,MACjB,QAAQ;AAAA,MACR,oCAAoC;AAAA,QAClC,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,EACF;AAAA;AAAA,EAEA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,WAAW;AAAA,IACX,MAAM;AAAA,EACR;AAAA,EACA,gBAAgB;AAAA,IACd,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,CAAC,MAAME,kCAAoB,cAAc,EAAE,GAAG;AAAA,MAC5C,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,OAAO;AAAA,EACT;AAAA;AAAA,EAEA,uBAAuB;AAAA,IACrB,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,GAAIF,YAAAA,MAAM,WAAW;AAAA,EACvB;AAAA,EACA,yBAAyB;AAAA,IACvB,GAAIA,YAAAA,MAAM,WAAW;AAAA,EACvB;AAAA;AAAA,EAEA,uBAAuB;AAAA,IACrB,SAAS;AAAA,IACT,QAAQ,OAAOA,YAAM,MAAA,MAAM,EAAE;AAAA,IAC7B,OAAO;AAAA,IAEP,GAAIA,YAAAA,MAAM,WAAW;AAAA,EACvB;AAAA;AAAA,EAEA,eAAe;AAAA,IACb,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,KAAK;AAAA,EACP;AAAA;AAAA,EAEA,eAAe;AAAA,IACb,SAAS;AAAA,EACX;AAAA;AAAA,EAEA,MAAM,CAAC;AAAA;AAAA,EAEP,UAAU;AAAA,IACR,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,YAAY;AAAA,EACd;AAAA;AAAA,EAEA,UAAU;AAAA,IACR,SAAS;AAAA,IACT,aAAa;AAAA,IACb,CAAC,MAAMG,2BAAa,SAAS,EAAE,GAAG;AAAA,MAChC,CAAC,kBAAkB,GAAG;AAAA,QACpB,aAAa;AAAA,QACb,cAAc;AAAA,QACd,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,cAAcH,YAAAA,MAAM,MAAM;AAAA,QAC1B,eAAe;AAAA,QACf,WAAW;AAAA,UACT,iBAAiB;AAAA,QACnB;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,QACV;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA;AAAA,EAEA,eAAe,CAAC;AAAA;AAAA,EAEhB,mBAAmB,CAAC;AAAA;AAAA,EAEpB,wBAAwB,CAAC;AAC3B,CAAC;;;"}

package/dist/cjs/Pagination/Select.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Select.cjs","sources":["../../../src/Pagination/Select.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { HvBaseDropdown, HvBaseDropdownProps } from \"../BaseDropdown\";\nimport { HvSelectionList, HvSelectionListProps } from \"../SelectionList\";\nimport { HvPanel } from \"../Panel\";\nimport { HvListItem, HvListItemProps } from \"../ListContainer\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { useClasses } from \"./Select.styles\";\n\nexport const Option = ({ ...props }: Partial<HvListItemProps>) => (\n  <HvListItem {...props} />\n);\n\nexport interface HvPaginationSelectProps\n  extends Omit<HvBaseDropdownProps, \"onChange\"> {\n  onChange: (event: React.SyntheticEvent, val: number) => void;\n  value: number;\n}\n\nconst HvSelect = (props: HvPaginationSelectProps) => {\n  const {\n    className,\n    classes: classesProp,\n    onChange,\n    disabled,\n    value,\n    children,\n    ...others\n  } = useDefaultProps(\"HvPaginationSelect\", props);\n  const { classes } = useClasses(classesProp);\n  const [open, setOpen] = useState(false);\n\n  const handleSelect: HvSelectionListProps[\"onChange\"] = (evt, val) => {\n    onChange?.(evt, val);\n    setOpen(false);\n  };\n\n  const handleToggle: HvBaseDropdownProps[\"onToggle\"] = (_evt, s) => {\n    setOpen(s);\n  };\n\n  const setFocusToContent: HvBaseDropdownProps[\"onContainerCreation\"] = (\n    containerRef\n  ) => {\n    const listItems =\n      containerRef != null ? [...containerRef.getElementsByTagName(\"li\")] : [];\n    listItems.every((listItem) => {\n      if (listItem.tabIndex >= 0) {\n        listItem.focus();\n        return false;\n      }\n      return true;\n    });\n  };\n\n  return (\n    <HvBaseDropdown\n      className={className}\n      classes={{\n        selection: classes.selection,\n        header: classes.header,\n        headerOpen: classes.headerOpen,\n        root: classes.root,\n      }}\n      expanded={open}\n      onToggle={handleToggle}\n      onContainerCreation={setFocusToContent}\n      placeholder={value}\n      disabled={disabled}\n      variableWidth\n      {...others}\n    >\n      <HvPanel>\n        <HvSelectionList value={value} onChange={handleSelect}>\n          {children}\n        </HvSelectionList>\n      </HvPanel>\n    </HvBaseDropdown>\n  );\n};\n\nexport default HvSelect;\n"],"names":["jsx","HvListItem","useDefaultProps","useClasses","useState","HvBaseDropdown","HvPanel","HvSelectionList"],"mappings":";;;;;;;;;;AAWa,MAAA,SAAS,CAAC,EAAE,GAAG,MAC1B,MAAAA,2BAAA,IAACC,qBAAY,EAAA,GAAG,OAAO;AASzB,MAAM,WAAW,CAAC,UAAmC;AAC7C,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDC,gBAAgB,gBAAA,sBAAsB,KAAK;AAC/C,QAAM,EAAE,QAAA,IAAYC,cAAA,WAAW,WAAW;AAC1C,QAAM,CAAC,MAAM,OAAO,IAAIC,eAAS,KAAK;AAEhC,QAAA,eAAiD,CAAC,KAAK,QAAQ;AACnE,eAAW,KAAK,GAAG;AACnB,YAAQ,KAAK;AAAA,EAAA;AAGT,QAAA,eAAgD,CAAC,MAAM,MAAM;AACjE,YAAQ,CAAC;AAAA,EAAA;AAGL,QAAA,oBAAgE,CACpE,iBACG;AACG,UAAA,YACJ,gBAAgB,OAAO,CAAC,GAAG,aAAa,qBAAqB,IAAI,CAAC,IAAI;AAC9D,cAAA,MAAM,CAAC,aAAa;AACxB,UAAA,SAAS,YAAY,GAAG;AAC1B,iBAAS,MAAM;AACR,eAAA;AAAA,MACT;AACO,aAAA;AAAA,IAAA,CACR;AAAA,EAAA;AAID,SAAAJ,2BAAA;AAAA,IAACK,aAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA,SAAS;AAAA,QACP,WAAW,QAAQ;AAAA,QACnB,QAAQ,QAAQ;AAAA,QAChB,YAAY,QAAQ;AAAA,QACpB,MAAM,QAAQ;AAAA,MAChB;AAAA,MACA,UAAU;AAAA,MACV,UAAU;AAAA,MACV,qBAAqB;AAAA,MACrB,aAAa;AAAA,MACb;AAAA,MACA,eAAa;AAAA,MACZ,GAAG;AAAA,MAEJ,UAAAL,2BAAAA,IAACM,MAAAA,WACC,UAACN,2BAAAA,IAAAO,cAAAA,iBAAA,EAAgB,OAAc,UAAU,cACtC,UACH,EACF,CAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,MAAA,aAAe;;;"}
+{"version":3,"file":"Select.cjs","sources":["../../../src/Pagination/Select.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { HvBaseDropdown, HvBaseDropdownProps } from \"../BaseDropdown\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvListItem, HvListItemProps } from \"../ListContainer\";\nimport { HvPanel } from \"../Panel\";\nimport { HvSelectionList, HvSelectionListProps } from \"../SelectionList\";\nimport { useClasses } from \"./Select.styles\";\n\nexport const Option = ({ ...props }: Partial<HvListItemProps>) => (\n  <HvListItem {...props} />\n);\n\nexport interface HvPaginationSelectProps\n  extends Omit<HvBaseDropdownProps, \"onChange\"> {\n  onChange: (event: React.SyntheticEvent, val: number) => void;\n  value: number;\n}\n\nconst HvSelect = (props: HvPaginationSelectProps) => {\n  const {\n    className,\n    classes: classesProp,\n    onChange,\n    disabled,\n    value,\n    children,\n    ...others\n  } = useDefaultProps(\"HvPaginationSelect\", props);\n  const { classes } = useClasses(classesProp);\n  const [open, setOpen] = useState(false);\n\n  const handleSelect: HvSelectionListProps[\"onChange\"] = (evt, val) => {\n    onChange?.(evt, val);\n    setOpen(false);\n  };\n\n  const handleToggle: HvBaseDropdownProps[\"onToggle\"] = (_evt, s) => {\n    setOpen(s);\n  };\n\n  const setFocusToContent: HvBaseDropdownProps[\"onContainerCreation\"] = (\n    containerRef,\n  ) => {\n    const listItems =\n      containerRef != null ? [...containerRef.getElementsByTagName(\"li\")] : [];\n    listItems.every((listItem) => {\n      if (listItem.tabIndex >= 0) {\n        listItem.focus();\n        return false;\n      }\n      return true;\n    });\n  };\n\n  return (\n    <HvBaseDropdown\n      className={className}\n      classes={{\n        selection: classes.selection,\n        header: classes.header,\n        headerOpen: classes.headerOpen,\n        root: classes.root,\n      }}\n      expanded={open}\n      onToggle={handleToggle}\n      onContainerCreation={setFocusToContent}\n      placeholder={value}\n      disabled={disabled}\n      variableWidth\n      {...others}\n    >\n      <HvPanel>\n        <HvSelectionList value={value} onChange={handleSelect}>\n          {children}\n        </HvSelectionList>\n      </HvPanel>\n    </HvBaseDropdown>\n  );\n};\n\nexport default HvSelect;\n"],"names":["jsx","HvListItem","useDefaultProps","useClasses","useState","HvBaseDropdown","HvPanel","HvSelectionList"],"mappings":";;;;;;;;;;AASa,MAAA,SAAS,CAAC,EAAE,GAAG,MAC1B,MAAAA,2BAAA,IAACC,qBAAY,EAAA,GAAG,OAAO;AASzB,MAAM,WAAW,CAAC,UAAmC;AAC7C,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDC,gBAAgB,gBAAA,sBAAsB,KAAK;AAC/C,QAAM,EAAE,QAAA,IAAYC,cAAA,WAAW,WAAW;AAC1C,QAAM,CAAC,MAAM,OAAO,IAAIC,eAAS,KAAK;AAEhC,QAAA,eAAiD,CAAC,KAAK,QAAQ;AACnE,eAAW,KAAK,GAAG;AACnB,YAAQ,KAAK;AAAA,EAAA;AAGT,QAAA,eAAgD,CAAC,MAAM,MAAM;AACjE,YAAQ,CAAC;AAAA,EAAA;AAGL,QAAA,oBAAgE,CACpE,iBACG;AACG,UAAA,YACJ,gBAAgB,OAAO,CAAC,GAAG,aAAa,qBAAqB,IAAI,CAAC,IAAI;AAC9D,cAAA,MAAM,CAAC,aAAa;AACxB,UAAA,SAAS,YAAY,GAAG;AAC1B,iBAAS,MAAM;AACR,eAAA;AAAA,MACT;AACO,aAAA;AAAA,IAAA,CACR;AAAA,EAAA;AAID,SAAAJ,2BAAA;AAAA,IAACK,aAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA,SAAS;AAAA,QACP,WAAW,QAAQ;AAAA,QACnB,QAAQ,QAAQ;AAAA,QAChB,YAAY,QAAQ;AAAA,QACpB,MAAM,QAAQ;AAAA,MAChB;AAAA,MACA,UAAU;AAAA,MACV,UAAU;AAAA,MACV,qBAAqB;AAAA,MACrB,aAAa;AAAA,MACb;AAAA,MACA,eAAa;AAAA,MACZ,GAAG;AAAA,MAEJ,UAAAL,2BAAAA,IAACM,MAAAA,WACC,UAACN,2BAAAA,IAAAO,cAAAA,iBAAA,EAAgB,OAAc,UAAU,cACtC,UACH,EACF,CAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,MAAA,aAAe;;;"}

package/dist/cjs/Pagination/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.cjs","sources":["../../../src/Pagination/utils.ts"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\nexport const setColor = (condition: boolean): string | undefined =>\n  condition ? \"secondary_60\" : undefined;\n\nexport const getSafePage = (\n  inPage: number,\n  page: number,\n  pages: number\n): number =>\n  Number.isNaN(inPage) ? page : Math.min(Math.max(inPage, 0), pages - 1);\n\nexport const usePageInput = (initialPage: number) => {\n  const [page, setPage] = useState<number>(initialPage + 1);\n\n  const handleChange = useCallback(\n    (evt: any, newPage: number) => setPage(newPage),\n    []\n  );\n\n  return [page, handleChange] as const;\n};\n"],"names":["useState","useCallback"],"mappings":";;;AAEO,MAAM,WAAW,CAAC,cACvB,YAAY,iBAAiB;AAExB,MAAM,cAAc,CACzB,QACA,MACA,UAEA,OAAO,MAAM,MAAM,IAAI,OAAO,KAAK,IAAI,KAAK,IAAI,QAAQ,CAAC,GAAG,QAAQ,CAAC;AAE1D,MAAA,eAAe,CAAC,gBAAwB;AACnD,QAAM,CAAC,MAAM,OAAO,IAAIA,MAAAA,SAAiB,cAAc,CAAC;AAExD,QAAM,eAAeC,MAAA;AAAA,IACnB,CAAC,KAAU,YAAoB,QAAQ,OAAO;AAAA,IAC9C,CAAC;AAAA,EAAA;AAGI,SAAA,CAAC,MAAM,YAAY;AAC5B;;;;"}
+{"version":3,"file":"utils.cjs","sources":["../../../src/Pagination/utils.ts"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\nexport const setColor = (condition: boolean): string | undefined =>\n  condition ? \"secondary_60\" : undefined;\n\nexport const getSafePage = (\n  inPage: number,\n  page: number,\n  pages: number,\n): number =>\n  Number.isNaN(inPage) ? page : Math.min(Math.max(inPage, 0), pages - 1);\n\nexport const usePageInput = (initialPage: number) => {\n  const [page, setPage] = useState<number>(initialPage + 1);\n\n  const handleChange = useCallback(\n    (evt: any, newPage: number) => setPage(newPage),\n    [],\n  );\n\n  return [page, handleChange] as const;\n};\n"],"names":["useState","useCallback"],"mappings":";;;AAEO,MAAM,WAAW,CAAC,cACvB,YAAY,iBAAiB;AAExB,MAAM,cAAc,CACzB,QACA,MACA,UAEA,OAAO,MAAM,MAAM,IAAI,OAAO,KAAK,IAAI,KAAK,IAAI,QAAQ,CAAC,GAAG,QAAQ,CAAC;AAE1D,MAAA,eAAe,CAAC,gBAAwB;AACnD,QAAM,CAAC,MAAM,OAAO,IAAIA,MAAAA,SAAiB,cAAc,CAAC;AAExD,QAAM,eAAeC,MAAA;AAAA,IACnB,CAAC,KAAU,YAAoB,QAAQ,OAAO;AAAA,IAC9C,CAAC;AAAA,EAAA;AAGI,SAAA,CAAC,MAAM,YAAY;AAC5B;;;;"}

package/dist/cjs/Panel/Panel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.cjs","sources":["../../../src/Panel/Panel.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"../types/generic\";\n\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Panel.styles\";\n\nexport { staticClasses as panelClasses };\n\nexport type HvPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvPanelProps extends HvBaseProps {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvPanelClasses;\n}\n\n/**\n * A panel is a container used in a variety of patterns (e.g. dropdown, filter group, details section).\n * It can be horizontal or vertical and its size is defined by its content and how it relates to surrounding patterns.\n * Regardless of its content, a panel look and feel should be consistent.\n */\nexport const HvPanel = forwardRef<HTMLDivElement, HvPanelProps>(\n  (props, ref) => {\n    const {\n      className,\n      classes: classesProp,\n      children,\n      ...others\n    } = useDefaultProps(\"HvPanel\", props);\n    const { classes, cx } = useClasses(classesProp);\n\n    return (\n      <div ref={ref} className={cx(classes.root, className)} {...others}>\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","jsx"],"mappings":";;;;;;AAwBO,MAAM,UAAUA,MAAA;AAAA,EACrB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,WAAW,KAAK;AACpC,UAAM,EAAE,SAAS,GAAG,IAAIC,wBAAW,WAAW;AAG5C,WAAAC,2BAAA,IAAC,OAAI,EAAA,KAAU,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QACxD,SACH,CAAA;AAAA,EAEJ;AACF;;;"}
+{"version":3,"file":"Panel.cjs","sources":["../../../src/Panel/Panel.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./Panel.styles\";\n\nexport { staticClasses as panelClasses };\n\nexport type HvPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvPanelProps extends HvBaseProps {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvPanelClasses;\n}\n\n/**\n * A panel is a container used in a variety of patterns (e.g. dropdown, filter group, details section).\n * It can be horizontal or vertical and its size is defined by its content and how it relates to surrounding patterns.\n * Regardless of its content, a panel look and feel should be consistent.\n */\nexport const HvPanel = forwardRef<HTMLDivElement, HvPanelProps>(\n  (props, ref) => {\n    const {\n      className,\n      classes: classesProp,\n      children,\n      ...others\n    } = useDefaultProps(\"HvPanel\", props);\n    const { classes, cx } = useClasses(classesProp);\n\n    return (\n      <div ref={ref} className={cx(classes.root, className)} {...others}>\n        {children}\n      </div>\n    );\n  },\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","jsx"],"mappings":";;;;;;AAqBO,MAAM,UAAUA,MAAA;AAAA,EACrB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,WAAW,KAAK;AACpC,UAAM,EAAE,SAAS,GAAG,IAAIC,wBAAW,WAAW;AAG5C,WAAAC,2BAAA,IAAC,OAAI,EAAA,KAAU,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QACxD,SACH,CAAA;AAAA,EAEJ;AACF;;;"}

package/dist/cjs/ProgressBar/ProgressBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.cjs","sources":["../../../src/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography, HvTypographyProps } from \"../Typography\";\n\nimport { clamp } from \"../utils/helpers\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./ProgressBar.styles\";\n\nexport { staticClasses as progressBarClasses };\n\nexport type HvProgressBarClasses = ExtractNames<typeof useClasses>;\n\nexport type HvProgressBarStatus = \"inProgress\" | \"completed\" | \"error\";\n\n/**\n * ProgressBar provides feedback about a process that is taking place in the application.\n */\nexport interface HvProgressBarProps extends HvBaseProps {\n  /** The value of the progress bar. */\n  value: number;\n  /**\n   * The status of the progress bar.\n   *\n   * inProgress is black, error is red and completed is green.\n   *\n   * When uncontrolled and unspecified it will default to \"inProgress\".\n   */\n  status?: HvProgressBarStatus;\n  /** Aria Properties passed on to the progress bar. */\n  labelProps?: HvTypographyProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvProgressBarClasses;\n  /**\n   * True if the text label should not be displayed.\n   */\n  hideLabel?: boolean;\n}\n\nexport const HvProgressBar = (props: HvProgressBarProps) => {\n  const {\n    className,\n    classes: classesProp,\n    value = 0,\n    status = \"inProgress\",\n    labelProps,\n    hideLabel,\n    ...others\n  } = useDefaultProps(\"HvProgressBar\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const clampedValue = clamp(value, 100);\n\n  return (\n    <div\n      className={cx(classes.root, classes.progress, className)}\n      role=\"progressbar\"\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-valuenow={clampedValue}\n      {...others}\n    >\n      <div className={classes.progressContainer}>\n        {!hideLabel && (\n          <HvTypography\n            className={classes.progressBarLabel}\n            variant=\"caption2\"\n            style={{ width: `${clampedValue}%` }}\n            {...labelProps}\n          >\n            {`${clampedValue}%`}\n          </HvTypography>\n        )}\n        <div className={classes.progressBarContainer}>\n          <div\n            style={{ width: `${clampedValue}%` }}\n            className={cx(classes.progressBar, {\n              [classes.progressDone]: status === \"completed\",\n              [classes.progressError]: status === \"error\",\n            })}\n          />\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","clamp","jsx","jsxs","HvTypography"],"mappings":";;;;;;;AAwCa,MAAA,gBAAgB,CAAC,UAA8B;AACpD,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,iBAAiB,KAAK;AAE1C,QAAM,EAAE,SAAS,GAAG,IAAIC,8BAAW,WAAW;AAExC,QAAA,eAAeC,QAAAA,MAAM,OAAO,GAAG;AAGnC,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,MAAM,QAAQ,UAAU,SAAS;AAAA,MACvD,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,iBAAe;AAAA,MACd,GAAG;AAAA,MAEJ,UAACC,2BAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,mBACrB,UAAA;AAAA,QAAA,CAAC,aACAD,2BAAA;AAAA,UAACE,WAAA;AAAA,UAAA;AAAA,YACC,WAAW,QAAQ;AAAA,YACnB,SAAQ;AAAA,YACR,OAAO,EAAE,OAAO,GAAG,YAAY,IAAI;AAAA,YAClC,GAAG;AAAA,YAEH,aAAG,YAAY;AAAA,UAAA;AAAA,QAClB;AAAA,QAEDF,2BAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,sBACtB,UAAAA,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO,EAAE,OAAO,GAAG,YAAY,IAAI;AAAA,YACnC,WAAW,GAAG,QAAQ,aAAa;AAAA,cACjC,CAAC,QAAQ,YAAY,GAAG,WAAW;AAAA,cACnC,CAAC,QAAQ,aAAa,GAAG,WAAW;AAAA,YAAA,CACrC;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AAGN;;;"}
+{"version":3,"file":"ProgressBar.cjs","sources":["../../../src/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography, HvTypographyProps } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { clamp } from \"../utils/helpers\";\nimport { staticClasses, useClasses } from \"./ProgressBar.styles\";\n\nexport { staticClasses as progressBarClasses };\n\nexport type HvProgressBarClasses = ExtractNames<typeof useClasses>;\n\nexport type HvProgressBarStatus = \"inProgress\" | \"completed\" | \"error\";\n\n/**\n * ProgressBar provides feedback about a process that is taking place in the application.\n */\nexport interface HvProgressBarProps extends HvBaseProps {\n  /** The value of the progress bar. */\n  value: number;\n  /**\n   * The status of the progress bar.\n   *\n   * inProgress is black, error is red and completed is green.\n   *\n   * When uncontrolled and unspecified it will default to \"inProgress\".\n   */\n  status?: HvProgressBarStatus;\n  /** Aria Properties passed on to the progress bar. */\n  labelProps?: HvTypographyProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvProgressBarClasses;\n  /**\n   * True if the text label should not be displayed.\n   */\n  hideLabel?: boolean;\n}\n\nexport const HvProgressBar = (props: HvProgressBarProps) => {\n  const {\n    className,\n    classes: classesProp,\n    value = 0,\n    status = \"inProgress\",\n    labelProps,\n    hideLabel,\n    ...others\n  } = useDefaultProps(\"HvProgressBar\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const clampedValue = clamp(value, 100);\n\n  return (\n    <div\n      className={cx(classes.root, classes.progress, className)}\n      role=\"progressbar\"\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-valuenow={clampedValue}\n      {...others}\n    >\n      <div className={classes.progressContainer}>\n        {!hideLabel && (\n          <HvTypography\n            className={classes.progressBarLabel}\n            variant=\"caption2\"\n            style={{ width: `${clampedValue}%` }}\n            {...labelProps}\n          >\n            {`${clampedValue}%`}\n          </HvTypography>\n        )}\n        <div className={classes.progressBarContainer}>\n          <div\n            style={{ width: `${clampedValue}%` }}\n            className={cx(classes.progressBar, {\n              [classes.progressDone]: status === \"completed\",\n              [classes.progressError]: status === \"error\",\n            })}\n          />\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","clamp","jsx","jsxs","HvTypography"],"mappings":";;;;;;;AAqCa,MAAA,gBAAgB,CAAC,UAA8B;AACpD,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,iBAAiB,KAAK;AAE1C,QAAM,EAAE,SAAS,GAAG,IAAIC,8BAAW,WAAW;AAExC,QAAA,eAAeC,QAAAA,MAAM,OAAO,GAAG;AAGnC,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,MAAM,QAAQ,UAAU,SAAS;AAAA,MACvD,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,iBAAe;AAAA,MACd,GAAG;AAAA,MAEJ,UAACC,2BAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,mBACrB,UAAA;AAAA,QAAA,CAAC,aACAD,2BAAA;AAAA,UAACE,WAAA;AAAA,UAAA;AAAA,YACC,WAAW,QAAQ;AAAA,YACnB,SAAQ;AAAA,YACR,OAAO,EAAE,OAAO,GAAG,YAAY,IAAI;AAAA,YAClC,GAAG;AAAA,YAEH,aAAG,YAAY;AAAA,UAAA;AAAA,QAClB;AAAA,QAEDF,2BAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,sBACtB,UAAAA,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO,EAAE,OAAO,GAAG,YAAY,IAAI;AAAA,YACnC,WAAW,GAAG,QAAQ,aAAa;AAAA,cACjC,CAAC,QAAQ,YAAY,GAAG,WAAW;AAAA,cACnC,CAAC,QAAQ,aAAa,GAAG,WAAW;AAAA,YAAA,CACrC;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AAGN;;;"}