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

package/dist/cjs/components/List/useSelectableList.cjs

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const React = require("react");
+function useSelectableList(defaultList = []) {
+  const [list, setList] = React.useState(defaultList);
+  const [selection, setSelection] = React.useState([]);
+  React.useEffect(() => {
+    setSelection(list.filter((elem) => elem.selected));
+  }, [list]);
+  return [list, setList, selection];
+}
+exports.default = useSelectableList;
+//# sourceMappingURL=useSelectableList.cjs.map

package/dist/cjs/components/List/useSelectableList.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectableList.cjs","sources":["../../../../src/components/List/useSelectableList.ts"],"sourcesContent":["import { useState, useEffect } from \"react\";\nimport { HvListValue } from \"./List\";\n\nexport default function useSelectableList(defaultList: HvListValue[] = []) {\n  const [list, setList] = useState<HvListValue[]>(defaultList);\n  const [selection, setSelection] = useState<HvListValue[]>([]);\n\n  useEffect(() => {\n    setSelection(\n      (list as HvListValue[]).filter((elem: HvListValue) => elem.selected)\n    );\n  }, [list]);\n\n  return [list, setList, selection] as const;\n}\n"],"names":["useSelectableList","defaultList","list","setList","useState","selection","setSelection","useEffect","filter","elem","selected"],"mappings":";;;AAGwBA,SAAAA,kBAAkBC,cAA6B,IAAI;AACzE,QAAM,CAACC,MAAMC,OAAO,IAAIC,eAAwBH,WAAW;AAC3D,QAAM,CAACI,WAAWC,YAAY,IAAIF,MAAAA,SAAwB,CAAE,CAAA;AAE5DG,QAAAA,UAAU,MAAM;AACdD,iBACGJ,KAAuBM,OAAO,CAACC,SAAsBA,KAAKC,QAAQ,CAAC;AAAA,EAAA,GAErE,CAACR,IAAI,CAAC;AAEF,SAAA,CAACA,MAAMC,SAASE,SAAS;AAClC;;"}

package/dist/cjs/components/List/utils.cjs

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const withTooltip = require("../../hocs/withTooltip.cjs");
+const isItemSelected = (item, newItem) => {
+  const selectionKey = (item == null ? void 0 : item.id) ? "id" : "label";
+  const selectionElement = item && item[selectionKey];
+  return newItem[selectionKey] === selectionElement;
+};
+const parseList = (item, props, selectAll, list = []) => {
+  const {
+    multiSelect,
+    selectable,
+    singleSelectionToggle
+  } = props || {};
+  let anySelected = false;
+  const newList = list.map((elem) => {
+    const newItem = {
+      ...elem
+    };
+    if (!multiSelect) {
+      newItem.selected = false;
+    }
+    const selectItem = item ? isItemSelected(item, newItem) : elem == null ? void 0 : elem.selected;
+    if (selectItem && selectable) {
+      let selectionState;
+      if (multiSelect) {
+        selectionState = item ? !(elem == null ? void 0 : elem.selected) : true;
+      } else {
+        selectionState = !anySelected && (item && singleSelectionToggle ? !(elem == null ? void 0 : elem.selected) : true);
+      }
+      newItem.selected = selectionState;
+      anySelected = true;
+    }
+    if (typeof selectAll === "boolean" && !(elem == null ? void 0 : elem.disabled))
+      newItem.selected = selectAll;
+    if (!(newItem == null ? void 0 : newItem.selected))
+      newItem.selected = false;
+    return newItem;
+  });
+  return newList;
+};
+const hideTooltip = (evt) => {
+  const isOverFlow = evt.target.children.length > 1 ? Array.of(...evt.target.children).some((child) => child.scrollWidth > child.clientWidth) : evt.target.scrollWidth > evt.target.clientWidth;
+  return !isOverFlow;
+};
+const wrapperTooltip = (hasTooltips, Component, label) => {
+  const ComponentFunction = () => Component;
+  return hasTooltips ? withTooltip.default(ComponentFunction, label, "top", hideTooltip, {}, {}) : ComponentFunction;
+};
+exports.isItemSelected = isItemSelected;
+exports.parseList = parseList;
+exports.wrapperTooltip = wrapperTooltip;
+//# sourceMappingURL=utils.cjs.map

package/dist/cjs/components/List/utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.cjs","sources":["../../../../src/components/List/utils.ts"],"sourcesContent":["import { withTooltip } from \"hocs\";\nimport { HvListValue } from \"./List\";\n\nconst isItemSelected = (item: HvListValue, newItem: HvListValue) => {\n  const selectionKey = item?.id ? \"id\" : \"label\";\n  const selectionElement = item && item[selectionKey];\n  return newItem[selectionKey] === selectionElement;\n};\n\nconst checkIcons = (list) => list?.some((elem) => elem?.icon);\n\nconst parseState = (list = []) => {\n  const hasLeftIcons = checkIcons(list);\n  const selection = list.filter((elem: any) => elem?.selected);\n  const anySelected = !!selection.length;\n  const allSelected = selection.length === list.length;\n  const anySelectableSelected = list.some(\n    (elem: any) => elem?.selected || elem?.disabled\n  );\n  const allSelectableSelected = list.every(\n    (elem: any) => elem?.selected || elem?.disabled\n  );\n\n  return {\n    list,\n    hasLeftIcons,\n    anySelected,\n    allSelected,\n    anySelectableSelected,\n    allSelectableSelected,\n    selection,\n  };\n};\n\nconst parseList = (\n  item: HvListValue | undefined,\n  props: {\n    multiSelect?: boolean;\n    selectable?: boolean;\n    singleSelectionToggle?: boolean;\n  },\n  selectAll: boolean | undefined,\n  list: HvListValue[] = []\n): HvListValue[] => {\n  const { multiSelect, selectable, singleSelectionToggle } = props || {};\n\n  let anySelected = false;\n  const newList = list.map((elem: any) => {\n    const newItem = { ...elem };\n\n    // reset elem item\n    if (!multiSelect) {\n      newItem.selected = false;\n    }\n\n    const selectItem = item ? isItemSelected(item, newItem) : elem?.selected;\n\n    if (selectItem && selectable) {\n      let selectionState;\n\n      if (multiSelect) {\n        selectionState = item ? !elem?.selected : true;\n      } else {\n        selectionState =\n          !anySelected &&\n          (item && singleSelectionToggle ? !elem?.selected : true);\n      }\n\n      newItem.selected = selectionState;\n      anySelected = true;\n    }\n\n    if (typeof selectAll === \"boolean\" && !elem?.disabled)\n      newItem.selected = selectAll;\n\n    // normalize item selected prop if not provided\n    if (!newItem?.selected) newItem.selected = false;\n\n    return newItem;\n  });\n\n  return newList;\n};\n\n/**\n * Hide tooltip when content doesn't overflow\n */\nconst hideTooltip = (evt) => {\n  const isOverFlow =\n    evt.target.children.length > 1\n      ? Array.of(...evt.target.children).some(\n          (child) => child.scrollWidth > child.clientWidth\n        )\n      : evt.target.scrollWidth > evt.target.clientWidth;\n\n  return !isOverFlow;\n};\n\nconst wrapperTooltip = (hasTooltips, Component, label) => {\n  const ComponentFunction = () => Component;\n  return hasTooltips\n    ? withTooltip(ComponentFunction, label, \"top\", hideTooltip, {}, {})\n    : ComponentFunction;\n};\n\nexport { isItemSelected, parseList, parseState, wrapperTooltip };\n"],"names":["isItemSelected","item","newItem","selectionKey","id","selectionElement","parseList","props","selectAll","list","multiSelect","selectable","singleSelectionToggle","anySelected","newList","map","elem","selected","selectItem","selectionState","disabled","hideTooltip","evt","isOverFlow","target","children","length","Array","of","some","child","scrollWidth","clientWidth","wrapperTooltip","hasTooltips","Component","label","ComponentFunction","withTooltip"],"mappings":";;;AAGMA,MAAAA,iBAAiBA,CAACC,MAAmBC,YAAyB;AAC5DC,QAAAA,gBAAeF,6BAAMG,MAAK,OAAO;AACjCC,QAAAA,mBAAmBJ,QAAQA,KAAKE;AACtC,SAAOD,QAAQC,kBAAkBE;AACnC;AA2BA,MAAMC,YAAYA,CAChBL,MACAM,OAKAC,WACAC,OAAsB,CAAA,MACJ;AACZ,QAAA;AAAA,IAAEC;AAAAA,IAAaC;AAAAA,IAAYC;AAAAA,EAAAA,IAA0BL,SAAS,CAAA;AAEpE,MAAIM,cAAc;AAClB,QAAMC,UAAUL,KAAKM,IAAI,CAACC,SAAc;AACtC,UAAMd,UAAU;AAAA,MAAE,GAAGc;AAAAA,IAAAA;AAGrB,QAAI,CAACN,aAAa;AAChBR,cAAQe,WAAW;AAAA,IACrB;AAEA,UAAMC,aAAajB,OAAOD,eAAeC,MAAMC,OAAO,IAAIc,6BAAMC;AAEhE,QAAIC,cAAcP,YAAY;AACxBQ,UAAAA;AAEJ,UAAIT,aAAa;AACET,yBAAAA,OAAO,EAACe,6BAAMC,YAAW;AAAA,MAAA,OACrC;AACLE,yBACE,CAACN,gBACAZ,QAAQW,wBAAwB,EAACI,6BAAMC,YAAW;AAAA,MACvD;AAEAf,cAAQe,WAAWE;AACL,oBAAA;AAAA,IAChB;AAEA,QAAI,OAAOX,cAAc,aAAa,EAACQ,6BAAMI;AAC3ClB,cAAQe,WAAWT;AAGrB,QAAI,EAACN,mCAASe;AAAUf,cAAQe,WAAW;AAEpCf,WAAAA;AAAAA,EAAAA,CACR;AAEMY,SAAAA;AACT;AAKA,MAAMO,cAAeC,CAAQ,QAAA;AACrBC,QAAAA,aACJD,IAAIE,OAAOC,SAASC,SAAS,IACzBC,MAAMC,GAAG,GAAGN,IAAIE,OAAOC,QAAQ,EAAEI,KAC9BC,CAAAA,UAAUA,MAAMC,cAAcD,MAAME,WAAW,IAElDV,IAAIE,OAAOO,cAAcT,IAAIE,OAAOQ;AAE1C,SAAO,CAACT;AACV;AAEA,MAAMU,iBAAiBA,CAACC,aAAaC,WAAWC,UAAU;AACxD,QAAMC,oBAAoBA,MAAMF;AACzBD,SAAAA,cACHI,oBAAYD,mBAAmBD,OAAO,OAAOf,aAAa,CAAC,GAAG,EAAE,IAChEgB;AACN;;;;"}

package/dist/cjs/components/ListContainer/ListContainer.cjs

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const React = require("react");
+const clsx = require("clsx");
+const listContainerClasses = require("./listContainerClasses.cjs");
+const ListContext = require("./ListContext/ListContext.cjs");
+const useForkRef = require("../../hooks/useForkRef.cjs");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const React__default = /* @__PURE__ */ _interopDefault(React);
+const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
+const HvListContainer = React__default.default.forwardRef(({
+  id,
+  classes,
+  className,
+  interactive = false,
+  condensed,
+  disableGutters,
+  children,
+  ...others
+}, externalRef) => {
+  const containerRef = React.useRef(null);
+  const {
+    topContainerRef,
+    nesting = -1
+  } = React.useContext(ListContext.default);
+  const listContext = React.useMemo(() => ({
+    topContainerRef: topContainerRef || containerRef,
+    condensed,
+    disableGutters,
+    interactive,
+    nesting: nesting + 1
+  }), [condensed, disableGutters, interactive, nesting, topContainerRef]);
+  const renderChildren = () => {
+    if (!interactive) {
+      return children;
+    }
+    const anySelected = React__default.default.Children.toArray(children).map((child) => child.props.selected && !child.props.disabled).reduce((result, selected) => result || selected, false);
+    return React__default.default.Children.map(children, (child, i) => {
+      const tabIndex = child.props.tabIndex || !anySelected && i === 0 || child.props.selected && !child.props.disabled ? 0 : -1;
+      return React__default.default.cloneElement(child, {
+        tabIndex,
+        interactive
+      });
+    });
+  };
+  const handleRef = useForkRef.default(externalRef, containerRef);
+  return /* @__PURE__ */ jsxRuntime.jsx(ListContext.default.Provider, { value: listContext, children: /* @__PURE__ */ jsxRuntime.jsx("ul", { ref: handleRef, id, className: clsx__default.default(className, listContainerClasses.default.root, classes == null ? void 0 : classes.root), ...others, children: renderChildren() }) });
+});
+exports.HvListContainer = HvListContainer;
+//# sourceMappingURL=ListContainer.cjs.map

package/dist/cjs/components/ListContainer/ListContainer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListContainer.cjs","sources":["../../../../src/components/ListContainer/ListContainer.tsx"],"sourcesContent":["import React, { useRef, useContext, useMemo } from \"react\";\nimport clsx from \"clsx\";\nimport { HvBaseProps } from \"../../types\";\nimport HvListContext from \"./ListContext\";\nimport { useForkRef } from \"hooks\";\nimport listContainerClasses, {\n  HvListContainerClasses,\n} from \"./listContainerClasses\";\n\nexport type HvListContainerProps = HvBaseProps<HTMLUListElement> & {\n  /**\n   * If the list items should be focusable and react to mouse over events.\n   * Defaults to true if the list is selectable, false otherwise.\n   */\n  interactive?: boolean;\n  /** If `true` compact the vertical spacing between list items. */\n  condensed?: boolean;\n  /** If `true`, the list items' left and right padding is removed. */\n  disableGutters?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListContainerClasses;\n};\n\n/**\n * A <b>list</b> is any enumeration of a set of items.\n * The simple list is for continuous <b>vertical indexes of text or icons+text</b>. The content of these lists must be simple: ideally simples fields.\n * This pattern is ideal for <b>selections</b>. It should be used inside a HvPanel.\n */\nexport const HvListContainer = React.forwardRef(\n  (\n    {\n      id,\n      classes,\n      className,\n      interactive = false,\n      condensed,\n      disableGutters,\n      children,\n      ...others\n    }: HvListContainerProps,\n    externalRef\n  ) => {\n    const containerRef = useRef(null);\n\n    const { topContainerRef, nesting = -1 } = useContext<any>(HvListContext);\n\n    const listContext = useMemo(\n      () => ({\n        topContainerRef: topContainerRef || containerRef,\n        condensed,\n        disableGutters,\n        interactive,\n        nesting: nesting + 1,\n      }),\n      [condensed, disableGutters, interactive, nesting, topContainerRef]\n    );\n\n    const renderChildren = () => {\n      if (!interactive) {\n        return children;\n      }\n\n      const anySelected = React.Children.toArray(children)\n        .map((child: any) => child.props.selected && !child.props.disabled)\n        .reduce((result, selected) => result || selected, false);\n\n      return React.Children.map(children, (child: any, i) => {\n        const tabIndex =\n          child.props.tabIndex ||\n          (!anySelected && i === 0) ||\n          (child.props.selected && !child.props.disabled)\n            ? 0\n            : -1;\n\n        return React.cloneElement(child, {\n          tabIndex,\n          interactive,\n        });\n      });\n    };\n\n    const handleRef = useForkRef(externalRef, containerRef);\n\n    return (\n      <HvListContext.Provider value={listContext}>\n        <ul\n          ref={handleRef}\n          id={id}\n          className={clsx(className, listContainerClasses.root, classes?.root)}\n          {...others}\n        >\n          {renderChildren()}\n        </ul>\n      </HvListContext.Provider>\n    );\n  }\n);\n"],"names":["HvListContainer","React","forwardRef","id","classes","className","interactive","condensed","disableGutters","children","others","externalRef","containerRef","useRef","topContainerRef","nesting","useContext","HvListContext","listContext","useMemo","renderChildren","anySelected","Children","toArray","map","child","props","selected","disabled","reduce","result","i","tabIndex","cloneElement","handleRef","useForkRef","jsx","clsx","listContainerClasses","root"],"mappings":";;;;;;;;;;;AA4BaA,MAAAA,kBAAkBC,eAAAA,QAAMC,WACnC,CACE;AAAA,EACEC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,cAAc;AAAA,EACdC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,KACGC;AACiB,GACtBC,gBACG;AACGC,QAAAA,eAAeC,aAAO,IAAI;AAE1B,QAAA;AAAA,IAAEC;AAAAA,IAAiBC,UAAU;AAAA,EAAA,IAAOC,MAAAA,WAAgBC,YAAAA,OAAa;AAEjEC,QAAAA,cAAcC,MAAAA,QAClB,OAAO;AAAA,IACLL,iBAAiBA,mBAAmBF;AAAAA,IACpCL;AAAAA,IACAC;AAAAA,IACAF;AAAAA,IACAS,SAASA,UAAU;AAAA,EAAA,IAErB,CAACR,WAAWC,gBAAgBF,aAAaS,SAASD,eAAe,CAAC;AAGpE,QAAMM,iBAAiBA,MAAM;AAC3B,QAAI,CAACd,aAAa;AACTG,aAAAA;AAAAA,IACT;AAEMY,UAAAA,cAAcpB,eAAAA,QAAMqB,SAASC,QAAQd,QAAQ,EAChDe,IAAI,CAACC,UAAeA,MAAMC,MAAMC,YAAY,CAACF,MAAMC,MAAME,QAAQ,EACjEC,OAAO,CAACC,QAAQH,aAAaG,UAAUH,UAAU,KAAK;AAEzD,WAAO1B,eAAAA,QAAMqB,SAASE,IAAIf,UAAU,CAACgB,OAAYM,MAAM;AACrD,YAAMC,WACJP,MAAMC,MAAMM,YACX,CAACX,eAAeU,MAAM,KACtBN,MAAMC,MAAMC,YAAY,CAACF,MAAMC,MAAME,WAClC,IACA;AAEC3B,aAAAA,eAAAA,QAAMgC,aAAaR,OAAO;AAAA,QAC/BO;AAAAA,QACA1B;AAAAA,MAAAA,CACD;AAAA,IAAA,CACF;AAAA,EAAA;AAGG4B,QAAAA,YAAYC,WAAAA,QAAWxB,aAAaC,YAAY;AAGpD,SAAAwB,+BAACnB,YAAAA,QAAc,UAAd,EAAuB,OAAOC,aAC7B,UAAAkB,2BAAA,IAAC,MACC,EAAA,KAAKF,WACL,IACA,WAAWG,cAAAA,QAAKhC,WAAWiC,qBAAAA,QAAqBC,MAAMnC,mCAASmC,IAAI,GACnE,GAAI7B,QAEHU,UAAgB,iBACnB,CAAA,EACF,CAAA;AAEJ,CAAC;;"}

package/dist/cjs/components/ListContainer/ListContext/ListContext.cjs

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const React = require("react");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const React__default = /* @__PURE__ */ _interopDefault(React);
+const ListContext = React__default.default.createContext({});
+ListContext.displayName = "ListContext";
+const HvListContext = ListContext;
+exports.default = HvListContext;
+//# sourceMappingURL=ListContext.cjs.map

package/dist/cjs/components/ListContainer/ListContext/ListContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListContext.cjs","sources":["../../../../../src/components/ListContainer/ListContext/ListContext.ts"],"sourcesContent":["import React from \"react\";\n\nconst ListContext = React.createContext({});\nListContext.displayName = \"ListContext\";\n\nexport default ListContext;\n"],"names":["ListContext","React","createContext","displayName"],"mappings":";;;;;AAEA,MAAMA,cAAcC,eAAAA,QAAMC,cAAc,CAAA,CAAE;AAC1CF,YAAYG,cAAc;AAE1B,MAAA,gBAAeH;;"}

package/dist/cjs/components/ListContainer/ListItem/ListItem.cjs

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const React = require("react");
+const clsx = require("clsx");
+const ListItem_styles = require("./ListItem.styles.cjs");
+const listItemClasses = require("./listItemClasses.cjs");
+const ListContext = require("../ListContext/ListContext.cjs");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const React__default = /* @__PURE__ */ _interopDefault(React);
+const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
+const applyClassNameAndStateToElement = (element, selected, disabled, onClick, className, externalClassname) => {
+  var _a;
+  if (element != null) {
+    return React__default.default.cloneElement(element, {
+      className: clsx__default.default(className, externalClassname, (_a = element == null ? void 0 : element.props) == null ? void 0 : _a.className),
+      checked: !!selected,
+      disabled,
+      onChange: (evt) => onClick == null ? void 0 : onClick(evt)
+    });
+  }
+  return null;
+};
+const applyClassNameToElement = (element, className, externalClassname) => {
+  var _a;
+  if (element != null) {
+    return React__default.default.cloneElement(element, {
+      className: clsx__default.default(className, externalClassname, (_a = element == null ? void 0 : element.props) == null ? void 0 : _a.className)
+    });
+  }
+  return null;
+};
+const HvListItem = ({
+  id,
+  classes,
+  className,
+  role,
+  value,
+  selected,
+  disabled,
+  interactive: interactiveProp,
+  condensed: condensedProp,
+  disableGutters: disableGuttersProp,
+  startAdornment,
+  endAdornment,
+  onClick,
+  children,
+  tabIndex,
+  ...others
+}) => {
+  const {
+    topContainerRef,
+    condensed: condensedContext,
+    disableGutters: disableGuttersContext,
+    interactive: interactiveContext
+  } = React.useContext(ListContext.default);
+  const condensed = condensedProp != null ? condensedProp : condensedContext;
+  const disableGutters = disableGuttersProp != null ? disableGuttersProp : disableGuttersContext;
+  const interactive = interactiveProp != null ? interactiveProp : interactiveContext;
+  const handleOnClick = React.useCallback((evt) => {
+    if (!disabled) {
+      onClick == null ? void 0 : onClick(evt);
+    }
+  }, [disabled, onClick]);
+  const clonedStartAdornment = React.useMemo(() => applyClassNameAndStateToElement(startAdornment, selected, disabled, handleOnClick, clsx__default.default(listItemClasses.default.startAdornment, disabled && listItemClasses.default.disabled), clsx__default.default(classes == null ? void 0 : classes.startAdornment, disabled && (classes == null ? void 0 : classes.disabled))), [classes == null ? void 0 : classes.startAdornment, disabled, handleOnClick, selected, startAdornment]);
+  const clonedEndAdornment = React.useMemo(() => applyClassNameToElement(endAdornment, clsx__default.default(listItemClasses.default.endAdornment, disabled && listItemClasses.default.disabled), clsx__default.default(classes == null ? void 0 : classes.endAdornment, disabled && (classes == null ? void 0 : classes.disabled))), [classes == null ? void 0 : classes.endAdornment, endAdornment]);
+  const roleOptionAriaProps = role === "option" || role === "menuitem" ? {
+    "aria-disabled": disabled || void 0,
+    "aria-selected": selected
+  } : {};
+  const listItem = /* @__PURE__ */ jsxRuntime.jsxs(ListItem_styles.StyledListItem, { id, role, value, onClick: handleOnClick, onKeyDown: () => {
+  }, className: clsx__default.default(className, listItemClasses.default.root, classes == null ? void 0 : classes.root, !disableGutters && clsx__default.default(listItemClasses.default.gutters, classes == null ? void 0 : classes.gutters), condensed && clsx__default.default(listItemClasses.default.condensed, classes == null ? void 0 : classes.condensed), interactive && clsx__default.default(listItemClasses.default.interactive, classes == null ? void 0 : classes.interactive), selected && clsx__default.default(listItemClasses.default.selected, classes == null ? void 0 : classes.selected), disabled && clsx__default.default(listItemClasses.default.disabled, classes == null ? void 0 : classes.disabled), startAdornment != null && clsx__default.default(listItemClasses.default.withStartAdornment, classes == null ? void 0 : classes.withStartAdornment), endAdornment != null && clsx__default.default(listItemClasses.default.withEndAdornment, classes == null ? void 0 : classes.withEndAdornment)), $gutters: !disableGutters, $interactive: interactive, $disabled: disabled || false, $selected: selected || false, $startAdornment: startAdornment != null, $endAdornment: endAdornment != null, ...roleOptionAriaProps, ...others, children: [
+    clonedStartAdornment,
+    children,
+    clonedEndAdornment
+  ] });
+  return interactiveProp ? /* @__PURE__ */ jsxRuntime.jsx(ListItem_styles.StyledFocus, { rootRef: topContainerRef, selected, disabledClass: disabled || void 0, strategy: role === "option" ? "listbox" : "menu", classes: {
+    focus: clsx__default.default(classes == null ? void 0 : classes.focus, listItemClasses.default.focus)
+  }, configuration: {
+    tabIndex
+  }, children: listItem }) : listItem;
+};
+exports.HvListItem = HvListItem;
+//# sourceMappingURL=ListItem.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.cjs","sources":["../../../../../src/components/ListContainer/ListItem/ListItem.tsx"],"sourcesContent":["import React, { useCallback, useContext, useMemo } from \"react\";\nimport clsx from \"clsx\";\nimport { HvBaseProps } from \"../../../types\";\nimport { StyledListItem, StyledFocus } from \"./ListItem.styles\";\nimport HvListContext from \"../ListContext\";\nimport listItemClasses, { HvListItemClasses } from \"./listItemClasses\";\n\nexport type HvListItemProps = HvBaseProps<HTMLLIElement, { role }> & {\n  /**\n   * Overrides the implicit list item role.\n   * It defaults to \"option\" if unspecified and the container list role is \"listbox\".\n   */\n  role?: string;\n  /** Indicates if the list item is selected. */\n  selected?: 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,\n  selected,\n  disabled,\n  onClick,\n  className,\n  externalClassname\n) => {\n  if (element != null) {\n    return React.cloneElement(element, {\n      className: clsx(className, externalClassname, element?.props?.className),\n      checked: !!selected,\n      disabled,\n      onChange: (evt) => onClick?.(evt),\n    });\n  }\n\n  return null;\n};\n\nconst applyClassNameToElement = (element, className, externalClassname) => {\n  if (element != null) {\n    return React.cloneElement(element, {\n      className: clsx(className, externalClassname, element?.props?.className),\n    });\n  }\n\n  return null;\n};\n\n/**\n * ListItem description/documentation paragraph\n */\nexport const HvListItem = ({\n  id,\n  classes,\n  className,\n  role,\n  value,\n  selected,\n  disabled,\n  interactive: interactiveProp,\n  condensed: condensedProp,\n  disableGutters: disableGuttersProp,\n  startAdornment,\n  endAdornment,\n  onClick,\n  children,\n  tabIndex,\n  ...others\n}: HvListItemProps) => {\n  const {\n    topContainerRef,\n    condensed: condensedContext,\n    disableGutters: disableGuttersContext,\n    interactive: interactiveContext,\n  } = useContext<any>(HvListContext);\n\n  const condensed = condensedProp != null ? condensedProp : condensedContext;\n  const disableGutters =\n    disableGuttersProp != null ? disableGuttersProp : disableGuttersContext;\n  const interactive =\n    interactiveProp != null ? interactiveProp : interactiveContext;\n\n  const handleOnClick = useCallback(\n    (evt) => {\n      if (!disabled) {\n        onClick?.(evt);\n      }\n    },\n    [disabled, onClick]\n  );\n\n  const clonedStartAdornment = useMemo(\n    () =>\n      applyClassNameAndStateToElement(\n        startAdornment,\n        selected,\n        disabled,\n        handleOnClick,\n        clsx(\n          listItemClasses.startAdornment,\n          disabled && listItemClasses.disabled\n        ),\n        clsx(classes?.startAdornment, disabled && classes?.disabled)\n      ),\n    [classes?.startAdornment, disabled, handleOnClick, selected, startAdornment]\n  );\n  const clonedEndAdornment = useMemo(\n    () =>\n      applyClassNameToElement(\n        endAdornment,\n        clsx(\n          listItemClasses.endAdornment,\n          disabled && listItemClasses.disabled\n        ),\n        clsx(classes?.endAdornment, disabled && classes?.disabled)\n      ),\n    [classes?.endAdornment, 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    <StyledListItem\n      id={id}\n      role={role}\n      value={value}\n      onClick={handleOnClick}\n      onKeyDown={() => {}}\n      className={clsx(\n        className,\n        listItemClasses.root,\n        classes?.root,\n        !disableGutters && clsx(listItemClasses.gutters, classes?.gutters),\n        condensed && clsx(listItemClasses.condensed, classes?.condensed),\n        interactive && clsx(listItemClasses.interactive, classes?.interactive),\n        selected && clsx(listItemClasses.selected, classes?.selected),\n        disabled && clsx(listItemClasses.disabled, classes?.disabled),\n        startAdornment != null &&\n          clsx(listItemClasses.withStartAdornment, classes?.withStartAdornment),\n        endAdornment != null &&\n          clsx(listItemClasses.withEndAdornment, classes?.withEndAdornment)\n      )}\n      $gutters={!disableGutters}\n      $interactive={interactive}\n      $disabled={disabled || false}\n      $selected={selected || false}\n      $startAdornment={startAdornment != null}\n      $endAdornment={endAdornment != null}\n      {...roleOptionAriaProps}\n      {...others}\n    >\n      {clonedStartAdornment}\n      {children}\n      {clonedEndAdornment}\n    </StyledListItem>\n  );\n\n  return interactiveProp ? (\n    <StyledFocus\n      rootRef={topContainerRef}\n      selected={selected}\n      disabledClass={disabled || undefined}\n      strategy={role === \"option\" ? \"listbox\" : \"menu\"}\n      classes={{ focus: clsx(classes?.focus, listItemClasses.focus) }}\n      configuration={{\n        tabIndex,\n      }}\n    >\n      {listItem}\n    </StyledFocus>\n  ) : (\n    listItem\n  );\n};\n"],"names":["applyClassNameAndStateToElement","element","selected","disabled","onClick","className","externalClassname","React","cloneElement","clsx","props","checked","onChange","evt","applyClassNameToElement","HvListItem","id","classes","role","value","interactive","interactiveProp","condensed","condensedProp","disableGutters","disableGuttersProp","startAdornment","endAdornment","children","tabIndex","others","topContainerRef","condensedContext","disableGuttersContext","interactiveContext","useContext","HvListContext","handleOnClick","useCallback","clonedStartAdornment","useMemo","listItemClasses","clonedEndAdornment","roleOptionAriaProps","undefined","listItem","StyledListItem","root","gutters","withStartAdornment","withEndAdornment","jsx","StyledFocus","focus"],"mappings":";;;;;;;;;;;AAuDA,MAAMA,kCAAkCA,CACtCC,SACAC,UACAC,UACAC,SACAC,WACAC,sBACG;;AACH,MAAIL,WAAW,MAAM;AACZM,WAAAA,eAAAA,QAAMC,aAAaP,SAAS;AAAA,MACjCI,WAAWI,cAAKJ,QAAAA,WAAWC,oBAAmBL,wCAASS,UAATT,mBAAgBI,SAAS;AAAA,MACvEM,SAAS,CAAC,CAACT;AAAAA,MACXC;AAAAA,MACAS,UAAWC,CAAQT,QAAAA,mCAAUS;AAAAA,IAAG,CACjC;AAAA,EACH;AAEO,SAAA;AACT;AAEA,MAAMC,0BAA0BA,CAACb,SAASI,WAAWC,sBAAsB;;AACzE,MAAIL,WAAW,MAAM;AACZM,WAAAA,eAAAA,QAAMC,aAAaP,SAAS;AAAA,MACjCI,WAAWI,cAAKJ,QAAAA,WAAWC,oBAAmBL,wCAASS,UAATT,mBAAgBI,SAAS;AAAA,IAAA,CACxE;AAAA,EACH;AAEO,SAAA;AACT;AAKO,MAAMU,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAZ;AAAAA,EACAa;AAAAA,EACAC;AAAAA,EACAjB;AAAAA,EACAC;AAAAA,EACAiB,aAAaC;AAAAA,EACbC,WAAWC;AAAAA,EACXC,gBAAgBC;AAAAA,EAChBC;AAAAA,EACAC;AAAAA,EACAvB;AAAAA,EACAwB;AAAAA,EACAC;AAAAA,KACGC;AACY,MAAM;AACf,QAAA;AAAA,IACJC;AAAAA,IACAT,WAAWU;AAAAA,IACXR,gBAAgBS;AAAAA,IAChBb,aAAac;AAAAA,EAAAA,IACXC,MAAAA,WAAgBC,YAAAA,OAAa;AAE3Bd,QAAAA,YAAYC,iBAAiB,OAAOA,gBAAgBS;AACpDR,QAAAA,iBACJC,sBAAsB,OAAOA,qBAAqBQ;AAC9Cb,QAAAA,cACJC,mBAAmB,OAAOA,kBAAkBa;AAExCG,QAAAA,gBAAgBC,kBACnBzB,CAAQ,QAAA;AACP,QAAI,CAACV,UAAU;AACbC,yCAAUS;AAAAA,IACZ;AAAA,EAAA,GAEF,CAACV,UAAUC,OAAO,CAAC;AAGrB,QAAMmC,uBAAuBC,MAAAA,QAC3B,MACExC,gCACE0B,gBACAxB,UACAC,UACAkC,eACA5B,cACEgC,QAAAA,gBAAAA,QAAgBf,gBAChBvB,YAAYsC,wBAAgBtC,QAAQ,GAEtCM,cAAKQ,QAAAA,mCAASS,gBAAgBvB,aAAYc,mCAASd,SAAQ,CAAC,GAEhE,CAACc,mCAASS,gBAAgBvB,UAAUkC,eAAenC,UAAUwB,cAAc,CAAC;AAExEgB,QAAAA,qBAAqBF,MAAAA,QACzB,MACE1B,wBACEa,cACAlB,sBACEgC,gBAAAA,QAAgBd,cAChBxB,YAAYsC,gBAAAA,QAAgBtC,QAAQ,GAEtCM,sBAAKQ,mCAASU,cAAcxB,aAAYc,mCAASd,SAAQ,CAAC,GAE9D,CAACc,mCAASU,cAAcA,YAAY,CAAC;AAGvC,QAAMgB,sBACJzB,SAAS,YAAYA,SAAS,aAC1B;AAAA,IACE,iBAAiBf,YAAYyC;AAAAA,IAC7B,iBAAiB1C;AAAAA,MAEnB;AAEA2C,QAAAA,2CACHC,gBACC,gBAAA,EAAA,IACA,MACA,OACA,SAAST,eACT,WAAW,MAAM;AAAA,EAAA,GACjB,WAAW5B,cAAAA,QACTJ,WACAoC,gBAAAA,QAAgBM,MAChB9B,mCAAS8B,MACT,CAACvB,kBAAkBf,cAAAA,QAAKgC,gBAAgBO,QAAAA,SAAS/B,mCAAS+B,OAAO,GACjE1B,aAAab,cAAAA,QAAKgC,gBAAAA,QAAgBnB,WAAWL,mCAASK,SAAS,GAC/DF,eAAeX,cAAKgC,QAAAA,gBAAAA,QAAgBrB,aAAaH,mCAASG,WAAW,GACrElB,YAAYO,cAAAA,QAAKgC,gBAAgBvC,QAAAA,UAAUe,mCAASf,QAAQ,GAC5DC,YAAYM,cAAAA,QAAKgC,gBAAAA,QAAgBtC,UAAUc,mCAASd,QAAQ,GAC5DuB,kBAAkB,QAChBjB,cAAAA,QAAKgC,wBAAgBQ,oBAAoBhC,mCAASgC,kBAAkB,GACtEtB,gBAAgB,QACdlB,cAAAA,QAAKgC,wBAAgBS,kBAAkBjC,mCAASiC,gBAAgB,CAAC,GAErE,UAAU,CAAC1B,gBACX,cAAcJ,aACd,WAAWjB,YAAY,OACvB,WAAWD,YAAY,OACvB,iBAAiBwB,kBAAkB,MACnC,eAAeC,gBAAgB,MAC/B,GAAIgB,qBACAb,GAAAA,QAEHS,UAAAA;AAAAA,IAAAA;AAAAA,IACAX;AAAAA,IACAc;AAAAA,EACH,EAAA,CAAA;AAGF,SAAOrB,kBACL8B,2BAAAA,IAACC,gBACC,aAAA,EAAA,SAASrB,iBACT,UACA,eAAe5B,YAAYyC,QAC3B,UAAU1B,SAAS,WAAW,YAAY,QAC1C,SAAS;AAAA,IAAEmC,OAAO5C,cAAAA,QAAKQ,mCAASoC,OAAOZ,gBAAAA,QAAgBY,KAAK;AAAA,KAC5D,eAAe;AAAA,IACbxB;AAAAA,EACF,GAECgB,oBACH,IAEAA;AAEJ;;"}

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

@@ -0,0 +1,120 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const _styled = require("@emotion/styled/base");
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const transientOptions = require("../../../utils/transientOptions.cjs");
+const listItemClasses = require("./listItemClasses.cjs");
+const focusUtils = require("../../../utils/focusUtils.cjs");
+const Focus = require("../../Focus/Focus.cjs");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+const StyledListItem = /* @__PURE__ */ _styled__default.default("li", process.env.NODE_ENV === "production" ? _extends({}, {
+  target: "e1palmq41"
+}, transientOptions.transientOptions) : _extends({}, {
+  target: "e1palmq41",
+  label: "StyledListItem"
+}, transientOptions.transientOptions))(({
+  $gutters,
+  $interactive,
+  $selected,
+  $disabled,
+  $startAdornment,
+  $endAdornment
+}) => ({
+  ...uikitStyles.theme.typography.body,
+  padding: 0,
+  display: "block",
+  height: "32px",
+  lineHeight: "32px",
+  listStyleType: "none",
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  whiteSpace: "nowrap",
+  position: "relative",
+  "&:not(:last-child)": {
+    marginBottom: "8px"
+  },
+  [`&.${listItemClasses.default.condensed}`]: {
+    marginBottom: 0
+  },
+  ...$gutters && {
+    padding: `0 ${uikitStyles.theme.space.xs}`,
+    [`&.${listItemClasses.default.withStartAdornment}`]: {
+      paddingLeft: 0
+    },
+    [`&.${listItemClasses.default.withEndAdornment}`]: {
+      paddingRight: 0
+    }
+  },
+  ...$interactive && {
+    cursor: "pointer",
+    [`&:not(.${listItemClasses.default.disabled}):not(.${listItemClasses.default.selected}):hover`]: {
+      backgroundColor: uikitStyles.theme.list.hoverColor
+    },
+    [`&.${listItemClasses.default.disabled}`]: {
+      cursor: "not-allowed"
+    }
+  },
+  ...$selected && {
+    backgroundColor: uikitStyles.theme.list.hoverColor
+  },
+  ...$disabled && {
+    color: uikitStyles.theme.colors.atmo5,
+    backgroundColor: uikitStyles.theme.list.disabledBackgroundColor
+  },
+  ...$startAdornment && {
+    "& > div": {
+      float: "left"
+    },
+    "& svg": {
+      boxShadow: "none !important",
+      outline: "none !important"
+    },
+    [`.${listItemClasses.default.disabled} > svg *.color0`]: {
+      fill: uikitStyles.theme.colors.atmo5
+    }
+  },
+  ...$endAdornment && {
+    "& > div": {
+      float: "right"
+    },
+    "& svg": {
+      boxShadow: "none !important",
+      outline: "none !important"
+    },
+    [`.${listItemClasses.default.disabled} > svg *.color0`]: {
+      fill: uikitStyles.theme.colors.atmo5
+    }
+  },
+  "&.HvIsFocused": {
+    ...focusUtils.outlineStyles,
+    backgroundColor: uikitStyles.theme.colors.atmo3,
+    zIndex: 2
+  }
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvTGlzdENvbnRhaW5lci9MaXN0SXRlbS9MaXN0SXRlbS5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVE4QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0xpc3RDb250YWluZXIvTGlzdEl0ZW0vTGlzdEl0ZW0uc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJ1dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgeyBIdkZvY3VzIH0gZnJvbSBcImNvbXBvbmVudHNcIjtcbmltcG9ydCB7IG91dGxpbmVTdHlsZXMgfSBmcm9tIFwidXRpbHNcIjtcbmltcG9ydCBsaXN0SXRlbUNsYXNzZXMgZnJvbSBcIi4vbGlzdEl0ZW1DbGFzc2VzXCI7XG5pbXBvcnQgeyBDU1NQcm9wZXJ0aWVzIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRMaXN0SXRlbSA9IHN0eWxlZChcbiAgXCJsaVwiLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKFxuICAoe1xuICAgICRndXR0ZXJzLFxuICAgICRpbnRlcmFjdGl2ZSxcbiAgICAkc2VsZWN0ZWQsXG4gICAgJGRpc2FibGVkLFxuICAgICRzdGFydEFkb3JubWVudCxcbiAgICAkZW5kQWRvcm5tZW50LFxuICB9OiB7XG4gICAgJGd1dHRlcnM6IGJvb2xlYW47XG4gICAgJGludGVyYWN0aXZlOiBib29sZWFuO1xuICAgICRzZWxlY3RlZDogYm9vbGVhbjtcbiAgICAkZGlzYWJsZWQ6IGJvb2xlYW47XG4gICAgJHN0YXJ0QWRvcm5tZW50OiBib29sZWFuO1xuICAgICRlbmRBZG9ybm1lbnQ6IGJvb2xlYW47XG4gIH0pID0+ICh7XG4gICAgLi4uKHRoZW1lLnR5cG9ncmFwaHkuYm9keSBhcyBDU1NQcm9wZXJ0aWVzKSxcbiAgICBwYWRkaW5nOiAwLFxuICAgIGRpc3BsYXk6IFwiYmxvY2tcIixcbiAgICBoZWlnaHQ6IFwiMzJweFwiLFxuICAgIGxpbmVIZWlnaHQ6IFwiMzJweFwiLFxuICAgIGxpc3RTdHlsZVR5cGU6IFwibm9uZVwiLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICAgIHRleHRPdmVyZmxvdzogXCJlbGxpcHNpc1wiLFxuICAgIHdoaXRlU3BhY2U6IFwibm93cmFwXCIsXG4gICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcblxuICAgIFwiJjpub3QoOmxhc3QtY2hpbGQpXCI6IHtcbiAgICAgIG1hcmdpbkJvdHRvbTogXCI4cHhcIixcbiAgICB9LFxuICAgIFtgJi4ke2xpc3RJdGVtQ2xhc3Nlcy5jb25kZW5zZWR9YF06IHtcbiAgICAgIG1hcmdpbkJvdHRvbTogMCxcbiAgICB9LFxuXG4gICAgLi4uKCRndXR0ZXJzICYmIHtcbiAgICAgIHBhZGRpbmc6IGAwICR7dGhlbWUuc3BhY2UueHN9YCxcblxuICAgICAgW2AmLiR7bGlzdEl0ZW1DbGFzc2VzLndpdGhTdGFydEFkb3JubWVudH1gXToge1xuICAgICAgICBwYWRkaW5nTGVmdDogMCxcbiAgICAgIH0sXG4gICAgICBbYCYuJHtsaXN0SXRlbUNsYXNzZXMud2l0aEVuZEFkb3JubWVudH1gXToge1xuICAgICAgICBwYWRkaW5nUmlnaHQ6IDAsXG4gICAgICB9LFxuICAgIH0pLFxuICAgIC4uLigkaW50ZXJhY3RpdmUgJiYge1xuICAgICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAgIFtgJjpub3QoLiR7bGlzdEl0ZW1DbGFzc2VzLmRpc2FibGVkfSk6bm90KC4ke2xpc3RJdGVtQ2xhc3Nlcy5zZWxlY3RlZH0pOmhvdmVyYF06XG4gICAgICAgIHtcbiAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmxpc3QuaG92ZXJDb2xvcixcbiAgICAgICAgfSxcbiAgICAgIFtgJi4ke2xpc3RJdGVtQ2xhc3Nlcy5kaXNhYmxlZH1gXToge1xuICAgICAgICBjdXJzb3I6IFwibm90LWFsbG93ZWRcIixcbiAgICAgIH0sXG4gICAgfSksXG4gICAgLi4uKCRzZWxlY3RlZCAmJiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmxpc3QuaG92ZXJDb2xvcixcbiAgICB9KSxcbiAgICAuLi4oJGRpc2FibGVkICYmIHtcbiAgICAgIGNvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzUsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmxpc3QuZGlzYWJsZWRCYWNrZ3JvdW5kQ29sb3IsXG4gICAgfSksXG4gICAgLi4uKCRzdGFydEFkb3JubWVudCAmJiB7XG4gICAgICBcIiYgPiBkaXZcIjoge1xuICAgICAgICBmbG9hdDogXCJsZWZ0XCIsXG4gICAgICB9LFxuXG4gICAgICBcIiYgc3ZnXCI6IHtcbiAgICAgICAgYm94U2hhZG93OiBcIm5vbmUgIWltcG9ydGFudFwiLFxuICAgICAgICBvdXRsaW5lOiBcIm5vbmUgIWltcG9ydGFudFwiLFxuICAgICAgfSxcbiAgICAgIFtgLiR7bGlzdEl0ZW1DbGFzc2VzLmRpc2FibGVkfSA+IHN2ZyAqLmNvbG9yMGBdOiB7XG4gICAgICAgIGZpbGw6IHRoZW1lLmNvbG9ycy5hdG1vNSxcbiAgICAgIH0sXG4gICAgfSksXG4gICAgLi4uKCRlbmRBZG9ybm1lbnQgJiYge1xuICAgICAgXCImID4gZGl2XCI6IHsgZmxvYXQ6IFwicmlnaHRcIiB9LFxuXG4gICAgICBcIiYgc3ZnXCI6IHtcbiAgICAgICAgYm94U2hhZG93OiBcIm5vbmUgIWltcG9ydGFudFwiLFxuICAgICAgICBvdXRsaW5lOiBcIm5vbmUgIWltcG9ydGFudFwiLFxuICAgICAgfSxcbiAgICAgIFtgLiR7bGlzdEl0ZW1DbGFzc2VzLmRpc2FibGVkfSA+IHN2ZyAqLmNvbG9yMGBdOiB7XG4gICAgICAgIGZpbGw6IHRoZW1lLmNvbG9ycy5hdG1vNSxcbiAgICAgIH0sXG4gICAgfSksXG4gICAgXCImLkh2SXNGb2N1c2VkXCI6IHtcbiAgICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIHpJbmRleDogMixcbiAgICB9LFxuICB9KVxuKTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEZvY3VzID0gc3R5bGVkKEh2Rm9jdXMpKHtcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gIHpJbmRleDogMixcbn0pO1xuIl19 */");
+const StyledFocus = /* @__PURE__ */ _styled__default.default(Focus.HvFocus, process.env.NODE_ENV === "production" ? {
+  target: "e1palmq40"
+} : {
+  target: "e1palmq40",
+  label: "StyledFocus"
+})({
+  backgroundColor: uikitStyles.theme.colors.atmo3,
+  zIndex: 2
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvTGlzdENvbnRhaW5lci9MaXN0SXRlbS9MaXN0SXRlbS5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdHMkIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9MaXN0Q29udGFpbmVyL0xpc3RJdGVtL0xpc3RJdGVtLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwidXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuaW1wb3J0IHsgSHZGb2N1cyB9IGZyb20gXCJjb21wb25lbnRzXCI7XG5pbXBvcnQgeyBvdXRsaW5lU3R5bGVzIH0gZnJvbSBcInV0aWxzXCI7XG5pbXBvcnQgbGlzdEl0ZW1DbGFzc2VzIGZyb20gXCIuL2xpc3RJdGVtQ2xhc3Nlc1wiO1xuaW1wb3J0IHsgQ1NTUHJvcGVydGllcyB9IGZyb20gXCJyZWFjdFwiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkTGlzdEl0ZW0gPSBzdHlsZWQoXG4gIFwibGlcIixcbiAgdHJhbnNpZW50T3B0aW9uc1xuKShcbiAgKHtcbiAgICAkZ3V0dGVycyxcbiAgICAkaW50ZXJhY3RpdmUsXG4gICAgJHNlbGVjdGVkLFxuICAgICRkaXNhYmxlZCxcbiAgICAkc3RhcnRBZG9ybm1lbnQsXG4gICAgJGVuZEFkb3JubWVudCxcbiAgfToge1xuICAgICRndXR0ZXJzOiBib29sZWFuO1xuICAgICRpbnRlcmFjdGl2ZTogYm9vbGVhbjtcbiAgICAkc2VsZWN0ZWQ6IGJvb2xlYW47XG4gICAgJGRpc2FibGVkOiBib29sZWFuO1xuICAgICRzdGFydEFkb3JubWVudDogYm9vbGVhbjtcbiAgICAkZW5kQWRvcm5tZW50OiBib29sZWFuO1xuICB9KSA9PiAoe1xuICAgIC4uLih0aGVtZS50eXBvZ3JhcGh5LmJvZHkgYXMgQ1NTUHJvcGVydGllcyksXG4gICAgcGFkZGluZzogMCxcbiAgICBkaXNwbGF5OiBcImJsb2NrXCIsXG4gICAgaGVpZ2h0OiBcIjMycHhcIixcbiAgICBsaW5lSGVpZ2h0OiBcIjMycHhcIixcbiAgICBsaXN0U3R5bGVUeXBlOiBcIm5vbmVcIixcbiAgICBvdmVyZmxvdzogXCJoaWRkZW5cIixcbiAgICB0ZXh0T3ZlcmZsb3c6IFwiZWxsaXBzaXNcIixcbiAgICB3aGl0ZVNwYWNlOiBcIm5vd3JhcFwiLFxuICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG5cbiAgICBcIiY6bm90KDpsYXN0LWNoaWxkKVwiOiB7XG4gICAgICBtYXJnaW5Cb3R0b206IFwiOHB4XCIsXG4gICAgfSxcbiAgICBbYCYuJHtsaXN0SXRlbUNsYXNzZXMuY29uZGVuc2VkfWBdOiB7XG4gICAgICBtYXJnaW5Cb3R0b206IDAsXG4gICAgfSxcblxuICAgIC4uLigkZ3V0dGVycyAmJiB7XG4gICAgICBwYWRkaW5nOiBgMCAke3RoZW1lLnNwYWNlLnhzfWAsXG5cbiAgICAgIFtgJi4ke2xpc3RJdGVtQ2xhc3Nlcy53aXRoU3RhcnRBZG9ybm1lbnR9YF06IHtcbiAgICAgICAgcGFkZGluZ0xlZnQ6IDAsXG4gICAgICB9LFxuICAgICAgW2AmLiR7bGlzdEl0ZW1DbGFzc2VzLndpdGhFbmRBZG9ybm1lbnR9YF06IHtcbiAgICAgICAgcGFkZGluZ1JpZ2h0OiAwLFxuICAgICAgfSxcbiAgICB9KSxcbiAgICAuLi4oJGludGVyYWN0aXZlICYmIHtcbiAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgICBbYCY6bm90KC4ke2xpc3RJdGVtQ2xhc3Nlcy5kaXNhYmxlZH0pOm5vdCguJHtsaXN0SXRlbUNsYXNzZXMuc2VsZWN0ZWR9KTpob3ZlcmBdOlxuICAgICAgICB7XG4gICAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5saXN0LmhvdmVyQ29sb3IsXG4gICAgICAgIH0sXG4gICAgICBbYCYuJHtsaXN0SXRlbUNsYXNzZXMuZGlzYWJsZWR9YF06IHtcbiAgICAgICAgY3Vyc29yOiBcIm5vdC1hbGxvd2VkXCIsXG4gICAgICB9LFxuICAgIH0pLFxuICAgIC4uLigkc2VsZWN0ZWQgJiYge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5saXN0LmhvdmVyQ29sb3IsXG4gICAgfSksXG4gICAgLi4uKCRkaXNhYmxlZCAmJiB7XG4gICAgICBjb2xvcjogdGhlbWUuY29sb3JzLmF0bW81LFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5saXN0LmRpc2FibGVkQmFja2dyb3VuZENvbG9yLFxuICAgIH0pLFxuICAgIC4uLigkc3RhcnRBZG9ybm1lbnQgJiYge1xuICAgICAgXCImID4gZGl2XCI6IHtcbiAgICAgICAgZmxvYXQ6IFwibGVmdFwiLFxuICAgICAgfSxcblxuICAgICAgXCImIHN2Z1wiOiB7XG4gICAgICAgIGJveFNoYWRvdzogXCJub25lICFpbXBvcnRhbnRcIixcbiAgICAgICAgb3V0bGluZTogXCJub25lICFpbXBvcnRhbnRcIixcbiAgICAgIH0sXG4gICAgICBbYC4ke2xpc3RJdGVtQ2xhc3Nlcy5kaXNhYmxlZH0gPiBzdmcgKi5jb2xvcjBgXToge1xuICAgICAgICBmaWxsOiB0aGVtZS5jb2xvcnMuYXRtbzUsXG4gICAgICB9LFxuICAgIH0pLFxuICAgIC4uLigkZW5kQWRvcm5tZW50ICYmIHtcbiAgICAgIFwiJiA+IGRpdlwiOiB7IGZsb2F0OiBcInJpZ2h0XCIgfSxcblxuICAgICAgXCImIHN2Z1wiOiB7XG4gICAgICAgIGJveFNoYWRvdzogXCJub25lICFpbXBvcnRhbnRcIixcbiAgICAgICAgb3V0bGluZTogXCJub25lICFpbXBvcnRhbnRcIixcbiAgICAgIH0sXG4gICAgICBbYC4ke2xpc3RJdGVtQ2xhc3Nlcy5kaXNhYmxlZH0gPiBzdmcgKi5jb2xvcjBgXToge1xuICAgICAgICBmaWxsOiB0aGVtZS5jb2xvcnMuYXRtbzUsXG4gICAgICB9LFxuICAgIH0pLFxuICAgIFwiJi5IdklzRm9jdXNlZFwiOiB7XG4gICAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gICAgICB6SW5kZXg6IDIsXG4gICAgfSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRGb2N1cyA9IHN0eWxlZChIdkZvY3VzKSh7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICB6SW5kZXg6IDIsXG59KTtcbiJdfQ== */");
+exports.StyledFocus = StyledFocus;
+exports.StyledListItem = StyledListItem;
+//# sourceMappingURL=ListItem.styles.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.styles.cjs","sources":["../../../../../src/components/ListContainer/ListItem/ListItem.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"utils/transientOptions\";\nimport { HvFocus } from \"components\";\nimport { outlineStyles } from \"utils\";\nimport listItemClasses from \"./listItemClasses\";\nimport { CSSProperties } from \"react\";\n\nexport const StyledListItem = styled(\n  \"li\",\n  transientOptions\n)(\n  ({\n    $gutters,\n    $interactive,\n    $selected,\n    $disabled,\n    $startAdornment,\n    $endAdornment,\n  }: {\n    $gutters: boolean;\n    $interactive: boolean;\n    $selected: boolean;\n    $disabled: boolean;\n    $startAdornment: boolean;\n    $endAdornment: boolean;\n  }) => ({\n    ...(theme.typography.body as CSSProperties),\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    [`&.${listItemClasses.condensed}`]: {\n      marginBottom: 0,\n    },\n\n    ...($gutters && {\n      padding: `0 ${theme.space.xs}`,\n\n      [`&.${listItemClasses.withStartAdornment}`]: {\n        paddingLeft: 0,\n      },\n      [`&.${listItemClasses.withEndAdornment}`]: {\n        paddingRight: 0,\n      },\n    }),\n    ...($interactive && {\n      cursor: \"pointer\",\n      [`&:not(.${listItemClasses.disabled}):not(.${listItemClasses.selected}):hover`]:\n        {\n          backgroundColor: theme.list.hoverColor,\n        },\n      [`&.${listItemClasses.disabled}`]: {\n        cursor: \"not-allowed\",\n      },\n    }),\n    ...($selected && {\n      backgroundColor: theme.list.hoverColor,\n    }),\n    ...($disabled && {\n      color: theme.colors.atmo5,\n      backgroundColor: theme.list.disabledBackgroundColor,\n    }),\n    ...($startAdornment && {\n      \"& > div\": {\n        float: \"left\",\n      },\n\n      \"& svg\": {\n        boxShadow: \"none !important\",\n        outline: \"none !important\",\n      },\n      [`.${listItemClasses.disabled} > svg *.color0`]: {\n        fill: theme.colors.atmo5,\n      },\n    }),\n    ...($endAdornment && {\n      \"& > div\": { float: \"right\" },\n\n      \"& svg\": {\n        boxShadow: \"none !important\",\n        outline: \"none !important\",\n      },\n      [`.${listItemClasses.disabled} > svg *.color0`]: {\n        fill: theme.colors.atmo5,\n      },\n    }),\n    \"&.HvIsFocused\": {\n      ...outlineStyles,\n      backgroundColor: theme.colors.atmo3,\n      zIndex: 2,\n    },\n  })\n);\n\nexport const StyledFocus = styled(HvFocus)({\n  backgroundColor: theme.colors.atmo3,\n  zIndex: 2,\n});\n"],"names":["StyledListItem","process","env","NODE_ENV","_extends","target","transientOptions","label","$gutters","$interactive","$selected","$disabled","$startAdornment","$endAdornment","theme","typography","body","padding","display","height","lineHeight","listStyleType","overflow","textOverflow","whiteSpace","position","marginBottom","listItemClasses","condensed","space","xs","withStartAdornment","paddingLeft","withEndAdornment","paddingRight","cursor","disabled","selected","backgroundColor","list","hoverColor","color","colors","atmo5","disabledBackgroundColor","float","boxShadow","outline","fill","outlineStyles","atmo3","zIndex","StyledFocus","HvFocus"],"mappings":"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"}

package/dist/cjs/components/ListContainer/ListItem/listItemClasses.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const classes = require("../../../utils/classes.cjs");
+const classKeys = ["root", "focus", "startAdornment", "endAdornment", "gutters", "condensed", "interactive", "selected", "disabled", "withStartAdornment", "withEndAdornment"];
+const listItemClasses = classes.getClasses(classKeys, "HvListItem");
+const listItemClasses$1 = listItemClasses;
+exports.default = listItemClasses$1;
+//# sourceMappingURL=listItemClasses.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"listItemClasses.cjs","sources":["../../../../../src/components/ListContainer/ListItem/listItemClasses.ts"],"sourcesContent":["import { getClasses } from \"utils\";\n\nexport type HvListItemClasses = {\n  root?: string;\n  focus?: string;\n  startAdornment?: string;\n  endAdornment?: string;\n  gutters?: string;\n  condensed?: string;\n  interactive?: string;\n  selected?: string;\n  disabled?: string;\n  withStartAdornment?: string;\n  withEndAdornment?: string;\n};\n\nconst classKeys: string[] = [\n  \"root\",\n  \"focus\",\n  \"startAdornment\",\n  \"endAdornment\",\n  \"gutters\",\n  \"condensed\",\n  \"interactive\",\n  \"selected\",\n  \"disabled\",\n  \"withStartAdornment\",\n  \"withEndAdornment\",\n];\n\nconst listItemClasses = getClasses<HvListItemClasses>(classKeys, \"HvListItem\");\n\nexport default listItemClasses;\n"],"names":["classKeys","listItemClasses","getClasses"],"mappings":";;;AAgBA,MAAMA,YAAsB,CAC1B,QACA,SACA,kBACA,gBACA,WACA,aACA,eACA,YACA,YACA,sBACA,kBAAkB;AAGpB,MAAMC,kBAAkBC,QAA8BF,WAAAA,WAAW,YAAY;AAE7E,MAAA,oBAAeC;;"}

package/dist/cjs/components/ListContainer/listContainerClasses.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const classes = require("../../utils/classes.cjs");
+const classKeys = ["root"];
+const listContainerClasses = classes.getClasses(classKeys, "HvListContainer");
+const listContainerClasses$1 = listContainerClasses;
+exports.default = listContainerClasses$1;
+//# sourceMappingURL=listContainerClasses.cjs.map

package/dist/cjs/components/ListContainer/listContainerClasses.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"listContainerClasses.cjs","sources":["../../../../src/components/ListContainer/listContainerClasses.ts"],"sourcesContent":["import { getClasses } from \"utils\";\n\nexport type HvListContainerClasses = {\n  root?: string;\n};\n\nconst classKeys: string[] = [\"root\"];\n\nconst listContainerClasses = getClasses<HvListContainerClasses>(\n  classKeys,\n  \"HvListContainer\"\n);\n\nexport default listContainerClasses;\n"],"names":["classKeys","listContainerClasses","getClasses"],"mappings":";;;AAMA,MAAMA,YAAsB,CAAC,MAAM;AAEnC,MAAMC,uBAAuBC,QAC3BF,WAAAA,WACA,iBAAiB;AAGnB,MAAA,yBAAeC;;"}

package/dist/cjs/components/Loading/Loading.cjs

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const clsx = require("clsx");
+const range = require("lodash/range");
+const Loading_styles = require("./Loading.styles.cjs");
+const loadingClasses = require("./loadingClasses.cjs");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
+const range__default = /* @__PURE__ */ _interopDefault(range);
+const HvLoading = (props) => {
+  const {
+    color,
+    hidden,
+    small,
+    label,
+    classes,
+    className,
+    ...others
+  } = props;
+  const getColor = (colorName) => {
+    return color ? uikitStyles.theme.colors[color] || color : uikitStyles.theme.colors[colorName];
+  };
+  const size = small ? "small" : "regular";
+  const colorVariant = color ? "Color" : "";
+  const variant = `${size}${colorVariant}`;
+  const inline = {
+    backgroundColor: getColor(small ? "acce1" : "acce3")
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(Loading_styles.StyledRoot, { hidden: !!hidden, className: clsx__default.default(className, loadingClasses.default.root, classes == null ? void 0 : classes.root, hidden && clsx__default.default(classes == null ? void 0 : classes.hidden, loadingClasses.default.hidden)), ...others, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Loading_styles.StyledBarContainer, { className: clsx__default.default(loadingClasses.default.barContainer, classes == null ? void 0 : classes.barContainer), children: range__default.default(0, 3).map((e) => /* @__PURE__ */ jsxRuntime.jsx(Loading_styles.StyledBar, { style: inline, className: clsx__default.default(loadingClasses.default.loadingBar, classes == null ? void 0 : classes.loadingBar, loadingClasses.default[variant], classes == null ? void 0 : classes[variant]), $variant: variant }, e)) }),
+    label && /* @__PURE__ */ jsxRuntime.jsx(Loading_styles.StyledLabel, { variant: "caption1", className: clsx__default.default(loadingClasses.default.label, classes == null ? void 0 : classes.label), children: label })
+  ] });
+};
+exports.HvLoading = HvLoading;
+//# sourceMappingURL=Loading.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Loading.cjs","sources":["../../../../src/components/Loading/Loading.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport clsx from \"clsx\";\nimport range from \"lodash/range\";\nimport { HvBaseProps } from \"../../types\";\nimport {\n  StyledBar,\n  StyledBarContainer,\n  StyledLabel,\n  StyledRoot,\n} from \"./Loading.styles\";\nimport loadingClasses, { HvLoadingClasses } from \"./loadingClasses\";\n\nexport type HvLoadingProps = HvBaseProps<HTMLDivElement> & {\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?: string;\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 { color, hidden, small, label, classes, className, ...others } = props;\n\n  const getColor = (colorName) => {\n    return color ? theme.colors[color] || color : theme.colors[colorName];\n  };\n\n  const size = small ? \"small\" : \"regular\";\n  const colorVariant = color ? \"Color\" : \"\";\n  const variant = `${size}${colorVariant}`;\n\n  const inline = { backgroundColor: getColor(small ? \"acce1\" : \"acce3\") };\n  return (\n    <StyledRoot\n      hidden={!!hidden}\n      className={clsx(\n        className,\n        loadingClasses.root,\n        classes?.root,\n        hidden && clsx(classes?.hidden, loadingClasses.hidden)\n      )}\n      {...others}\n    >\n      <StyledBarContainer\n        className={clsx(loadingClasses.barContainer, classes?.barContainer)}\n      >\n        {range(0, 3).map((e) => (\n          <StyledBar\n            key={e}\n            style={inline}\n            className={clsx(\n              loadingClasses.loadingBar,\n              classes?.loadingBar,\n              loadingClasses[variant],\n              classes?.[variant]\n            )}\n            $variant={variant}\n          ></StyledBar>\n        ))}\n      </StyledBarContainer>\n      {label && (\n        <StyledLabel\n          variant=\"caption1\"\n          className={clsx(loadingClasses.label, classes?.label)}\n        >\n          {label}\n        </StyledLabel>\n      )}\n    </StyledRoot>\n  );\n};\n"],"names":["HvLoading","props","color","hidden","small","label","classes","className","others","getColor","colorName","theme","colors","size","colorVariant","variant","inline","backgroundColor","jsxs","StyledRoot","clsx","loadingClasses","root","jsx","StyledBarContainer","barContainer","range","map","e","StyledBar","loadingBar","StyledLabel"],"mappings":";;;;;;;;;;;AA2BaA,MAAAA,YAAYA,CAACC,UAA0B;AAC5C,QAAA;AAAA,IAAEC;AAAAA,IAAOC;AAAAA,IAAQC;AAAAA,IAAOC;AAAAA,IAAOC;AAAAA,IAASC;AAAAA,OAAcC;AAAAA,EAAWP,IAAAA;AAEvE,QAAMQ,WAAYC,CAAc,cAAA;AAC9B,WAAOR,QAAQS,kBAAMC,OAAOV,UAAUA,QAAQS,kBAAMC,OAAOF;AAAAA,EAAAA;AAGvDG,QAAAA,OAAOT,QAAQ,UAAU;AACzBU,QAAAA,eAAeZ,QAAQ,UAAU;AACjCa,QAAAA,UAAW,GAAEF,OAAOC;AAE1B,QAAME,SAAS;AAAA,IAAEC,iBAAiBR,SAASL,QAAQ,UAAU,OAAO;AAAA,EAAA;AAElE,SAAAc,gCAACC,eAAAA,cACC,QAAQ,CAAC,CAAChB,QACV,WAAWiB,cACTb,QAAAA,WACAc,eAAAA,QAAeC,MACfhB,mCAASgB,MACTnB,UAAUiB,sBAAKd,mCAASH,QAAQkB,uBAAelB,MAAM,CAAC,GAExD,GAAIK,QAEJ,UAAA;AAAA,IAAAe,2BAAA,IAACC,eACC,oBAAA,EAAA,WAAWJ,cAAKC,QAAAA,uBAAeI,cAAcnB,mCAASmB,YAAY,GAEjEC,UAAAA,eAAAA,QAAM,GAAG,CAAC,EAAEC,IAAKC,OACfL,2BAAAA,IAAAM,eAAA,WAAA,EAEC,OAAOb,QACP,WAAWI,cAAAA,QACTC,eAAeS,QAAAA,YACfxB,mCAASwB,YACTT,eAAAA,QAAeN,UACfT,mCAAUS,QAAQ,GAEpB,UAAUA,WARLa,CASN,CACF,GACH;AAAA,IACCvB,SACCkB,2BAAA,IAACQ,eACC,aAAA,EAAA,SAAQ,YACR,WAAWX,cAAAA,QAAKC,eAAAA,QAAehB,OAAOC,mCAASD,KAAK,GAEnDA,UACH,MAAA,CAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;;"}