@hitachivantara/uikit-react-core 5.26.2 → 5.26.4

package/dist/esm/components/Dropdown/List/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../../../src/components/Dropdown/List/List.tsx"],"sourcesContent":["import { MouseEvent, useContext, useEffect, useState } from \"react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport isNil from \"lodash/isNil\";\n\nimport { setId } from \"@core/utils/setId\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvButton } from \"@core/components/Button\";\nimport { HvCheckBox } from \"@core/components/CheckBox\";\nimport { HvInput } from \"@core/components/Input\";\nimport { HvList, HvListProps, HvListValue } from \"@core/components/List\";\nimport { HvActionBar } from \"@core/components/ActionBar\";\nimport BaseDropdownContext from \"@core/components/BaseDropdown/BaseDropdownContext\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./List.styles\";\nimport { getSelected } from \"../utils\";\nimport { HvDropdownLabelsProps } from \"../types\";\n\nexport { staticClasses as dropdownListClasses };\n\nexport type HvDropdownListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropdownListProps {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvDropdownListClasses;\n  /**\n   * The list to be rendered.\n   */\n  values?: HvListValue[];\n  /**\n   * If true renders a multi select list.\n   */\n  multiSelect?: boolean;\n  /**\n   * If true renders the search component.\n   */\n  showSearch?: boolean;\n  /**\n   * A function to be executed whenever a item is selected in the list\n   * or the Apply button is activated (when `multiSelect` is `true`).\n   */\n  onChange: (\n    /** An array containing the selected values */\n    listValues: HvListValue[],\n    /** If `true` the selection if finally committed the dropdown header text should reflect the new selection */\n    commitChanges: boolean,\n    /** If `true` the dropdown should toggle it's current state */\n    toggle: boolean,\n    /** If `true` the dropdown will call onChange */\n    notifyChanges: boolean\n  ) => void;\n  /**\n   * A function to be executed whenever the Cancel button is activated.\n   */\n  onCancel: (event: MouseEvent) => void;\n  /**\n   * An object containing all the labels for the dropdown.\n   */\n  labels?: HvDropdownLabelsProps;\n  /**\n   * If 'true' the dropdown will notify on the first render.\n   */\n  notifyChangesOnFirstRender?: boolean;\n  /**\n   * If `true` the dropdown will show tooltips when user mouseenter text in list\n   */\n  hasTooltips?: boolean;\n  /**\n   * If `true`, selection can be toggled when single selection.\n   */\n  singleSelectionToggle?: boolean;\n  /**\n   * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n   */\n  height?: number;\n  /**\n   * Experimental. Max height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class.\n   */\n  maxHeight?: number;\n  /**\n   * Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options.\n   */\n  virtualized?: boolean;\n}\n\n/**\n * The values property was being deeply cloned. That created a significant performance\n * hit when the values contained complex properties' values, like React Nodes.\n *\n * For minimizing the impact of removing the clone, a shallow clone of the array and its\n * objects is performed instead. That should have the same effect in the majority of the\n * cases, where the properties' values are primitive.\n */\nconst clone = (values: HvListValue[]) => values.map((value) => ({ ...value }));\n\n/**\n * Set all hidden's to false.\n */\nconst cleanHidden = (lst: HvListValue[]) =>\n  lst.map((item) => ({ ...item, isHidden: false }));\n\nconst valuesExist = (values: HvListValue[]) =>\n  !isNil(values) && values?.length > 0;\n\nexport const HvDropdownList = ({\n  id,\n  classes: classesProp,\n  values = [],\n  multiSelect = false,\n  showSearch = false,\n  onChange,\n  onCancel,\n  labels,\n  notifyChangesOnFirstRender = false,\n  hasTooltips = false,\n  singleSelectionToggle,\n  height: dropdownHeight,\n  maxHeight,\n  virtualized = false,\n  ...others\n}: HvDropdownListProps) => {\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const [searchStr, setSearchStr] = useState<string>(\"\");\n  const [list, setList] = useState<HvListValue[]>(clone(values));\n  const [allSelected, setAllSelected] = useState<boolean>(false);\n  const [anySelected, setAnySelected] = useState<boolean>(false);\n  const { width, height } = useContext(BaseDropdownContext);\n\n  const newLabels = {\n    selectAll: labels?.selectAll,\n    selectionConjunction: labels?.multiSelectionConjunction,\n  };\n\n  /**\n   * Update states associated with select all.\n   */\n  const updateSelectAll = (listValues: HvListValue[]) => {\n    if (!listValues) return;\n    const nbrSelected = getSelected(listValues).length;\n    const hasSelection = nbrSelected > 0;\n    const allSelect = nbrSelected === listValues.length;\n\n    setAnySelected(hasSelection);\n    setAllSelected(hasSelection && allSelect);\n  };\n\n  /**\n   * After the first render, call onChange if notifyChangesOnFirstRender.\n   */\n  useEffect(() => {\n    if (!valuesExist(values)) return;\n    setList(clone(values));\n    updateSelectAll(values);\n    if (notifyChangesOnFirstRender) {\n      onChange?.(values, false, false, true);\n    }\n  }, [values, notifyChangesOnFirstRender, onChange]);\n\n  /**\n   * Sets the filtered values to the state.\n   *\n   * @param {String} str - The value that is being looked.\n   */\n  const handleSearch = (str: string) => {\n    const results = list\n      ? list.filter(\n          ({\n            searchValue,\n            label,\n            value,\n          }: {\n            searchValue?: any;\n            label?: any;\n            value?: any;\n          }) => {\n            let stringValue = \"\";\n            if (\n              typeof searchValue === \"string\" ||\n              searchValue instanceof String\n            ) {\n              stringValue = searchValue.toLowerCase();\n            } else if (typeof label === \"string\" || label instanceof String) {\n              stringValue = label.toLowerCase();\n            } else if (typeof value === \"string\" || value instanceof String) {\n              stringValue = value.toLowerCase();\n            }\n\n            return stringValue.indexOf(str.toLowerCase()) >= 0;\n          }\n        )\n      : null;\n\n    if (!isNil(results)) {\n      const newList = list.map((elem) => {\n        const isResult = results.find((result) => result.label === elem.label);\n        return { ...elem, isHidden: !isResult };\n      });\n\n      setList(newList);\n      setSearchStr(str);\n    }\n    return str;\n  };\n\n  /**\n   * Create search element.\n   *\n   * @returns {*}\n   */\n  const renderSearch = () => (\n    <div className={classes.searchContainer}>\n      <HvInput\n        id={setId(id, \"search\")}\n        type=\"search\"\n        value={searchStr}\n        placeholder={labels?.searchPlaceholder}\n        onChange={(event, str) => handleSearch(str)}\n      />\n    </div>\n  );\n\n  /**\n   * Select all the values inside the dropdown.\n   *\n   */\n  const handleSelectAll = () => {\n    const newList = list.map((elem) => ({ ...elem, selected: !anySelected }));\n    setList(newList);\n    updateSelectAll(newList);\n  };\n\n  /**\n   * Create selecteAll component.\n   *\n   * @returns {*}\n   */\n  const renderSelectAll = () => {\n    const selectAll = labels?.selectAll;\n    const multiSelectionConjunction = labels?.multiSelectionConjunction;\n    const nbrSelected = getSelected(list).length;\n\n    const defaultLabel = (\n      <HvTypography component=\"span\">\n        {nbrSelected > 0 ? (\n          <>\n            <b>{nbrSelected}</b>\n            {` ${multiSelectionConjunction} ${list.length}`}\n          </>\n        ) : (\n          <>\n            <b>{selectAll}</b>\n            {` (${list.length})`}\n          </>\n        )}\n      </HvTypography>\n    );\n\n    return (\n      <div className={classes.selectAllContainer}>\n        <HvCheckBox\n          id={setId(id, \"select-all\")}\n          label={defaultLabel}\n          onChange={() => handleSelectAll()}\n          classes={{\n            container: classes.selection,\n          }}\n          className={classes.selectAll}\n          indeterminate={anySelected && !allSelected}\n          checked={allSelected}\n        />\n      </div>\n    );\n  };\n\n  /**\n   * When selecting the state list is updated with the corresponding selection.\n   *\n   * @param listValues - elements selected.\n   */\n  const onSelection: HvListProps[\"onChange\"] = (listValues) => {\n    if (!multiSelect) {\n      onChange(cleanHidden(listValues), true, true, true);\n    } else {\n      updateSelectAll(listValues);\n      setList(clone(listValues));\n    }\n  };\n\n  /**\n   * Render action buttons.\n   */\n  const renderActions = () => {\n    const applyLabel = labels?.applyLabel;\n    const cancelLabel = labels?.cancelLabel;\n    return (\n      <HvActionBar id={setId(id, \"actions\")}>\n        <HvButton\n          id={setId(id, \"actions-apply\")}\n          onClick={() => onChange(cleanHidden(list), true, true, true)}\n          variant=\"primaryGhost\"\n        >\n          {applyLabel}\n        </HvButton>\n        <HvButton\n          id={setId(id, \"actions-cancel\")}\n          onClick={onCancel}\n          variant=\"primaryGhost\"\n        >\n          {cancelLabel}\n        </HvButton>\n      </HvActionBar>\n    );\n  };\n\n  const showList = valuesExist(values);\n\n  return (\n    <div className={classes.rootList}>\n      <div className={classes.listBorderDown} />\n      <div className={classes.listContainer}>\n        {showSearch && renderSearch()}\n        {showList && multiSelect && renderSelectAll()}\n        {showList && (\n          <HvList\n            id={setId(id, \"list\")}\n            classes={{\n              root: cx(\n                classes.dropdownListContainer,\n                css({\n                  maxWidth: width,\n                  maxHeight:\n                    maxHeight ??\n                    `calc(${height}px - 32px - ${theme.space.xs} - ${theme.space.sm})`,\n                  overflow: \"auto\",\n                  padding: 5,\n                }),\n                dropdownHeight &&\n                  css({\n                    height: dropdownHeight,\n                  }),\n                virtualized &&\n                  css({\n                    maxWidth: \"inherit\",\n                    maxHeight: \"inherit\",\n                    overflow: \"inherit\",\n                    padding: 0,\n                  })\n              ),\n            }}\n            values={list}\n            multiSelect={multiSelect}\n            useSelector={multiSelect}\n            showSelectAll={false}\n            onChange={onSelection}\n            labels={newLabels}\n            hasTooltips={hasTooltips}\n            selectable\n            condensed\n            singleSelectionToggle={singleSelectionToggle}\n            height={dropdownHeight}\n            virtualized={virtualized}\n            {...others}\n          />\n        )}\n      </div>\n      {showList && multiSelect ? renderActions() : null}\n    </div>\n  );\n};\n"],"names":["clone","values","map","value","cleanHidden","lst","item","isHidden","valuesExist","isNil","length","HvDropdownList","id","classes","classesProp","multiSelect","showSearch","onChange","onCancel","labels","notifyChangesOnFirstRender","hasTooltips","singleSelectionToggle","height","dropdownHeight","maxHeight","virtualized","others","cx","css","useClasses","searchStr","setSearchStr","useState","list","setList","allSelected","setAllSelected","anySelected","setAnySelected","width","useContext","BaseDropdownContext","newLabels","selectAll","selectionConjunction","multiSelectionConjunction","updateSelectAll","listValues","nbrSelected","getSelected","hasSelection","allSelect","useEffect","handleSearch","str","results","filter","searchValue","label","stringValue","String","toLowerCase","indexOf","newList","elem","isResult","find","result","renderSearch","_jsx","className","searchContainer","children","HvInput","setId","type","placeholder","searchPlaceholder","event","handleSelectAll","selected","renderSelectAll","defaultLabel","HvTypography","component","_jsxs","_Fragment","selectAllContainer","HvCheckBox","container","selection","indeterminate","checked","onSelection","renderActions","applyLabel","cancelLabel","HvActionBar","HvButton","onClick","variant","showList","rootList","listBorderDown","listContainer","HvList","root","dropdownListContainer","maxWidth","theme","space","xs","sm","overflow","padding","useSelector","showSelectAll","selectable","condensed"],"mappings":"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"}
+{"version":3,"file":"List.js","sources":["../../../../../src/components/Dropdown/List/List.tsx"],"sourcesContent":["import { MouseEvent, useContext, useEffect, useState } from \"react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport isNil from \"lodash/isNil\";\n\nimport { setId } from \"@core/utils/setId\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvButton } from \"@core/components/Button\";\nimport { HvCheckBox } from \"@core/components/CheckBox\";\nimport { HvInput } from \"@core/components/Input\";\nimport { HvList, HvListProps, HvListValue } from \"@core/components/List\";\nimport { HvActionBar } from \"@core/components/ActionBar\";\nimport BaseDropdownContext from \"@core/components/BaseDropdown/BaseDropdownContext\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./List.styles\";\nimport { getSelected } from \"../utils\";\nimport { HvDropdownLabelsProps } from \"../types\";\n\nexport { staticClasses as dropdownListClasses };\n\nexport type HvDropdownListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropdownListProps {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvDropdownListClasses;\n  /**\n   * The list to be rendered.\n   */\n  values?: HvListValue[];\n  /**\n   * If true renders a multi select list.\n   */\n  multiSelect?: boolean;\n  /**\n   * If true renders the search component.\n   */\n  showSearch?: boolean;\n  /**\n   * A function to be executed whenever a item is selected in the list\n   * or the Apply button is activated (when `multiSelect` is `true`).\n   */\n  onChange: (\n    /** An array containing the selected values */\n    listValues: HvListValue[],\n    /** If `true` the selection if finally committed the dropdown header text should reflect the new selection */\n    commitChanges: boolean,\n    /** If `true` the dropdown should toggle it's current state */\n    toggle: boolean,\n    /** If `true` the dropdown will call onChange */\n    notifyChanges: boolean\n  ) => void;\n  /**\n   * A function to be executed whenever the Cancel button is activated.\n   */\n  onCancel: (event: MouseEvent) => void;\n  /**\n   * An object containing all the labels for the dropdown.\n   */\n  labels?: HvDropdownLabelsProps;\n  /**\n   * If 'true' the dropdown will notify on the first render.\n   */\n  notifyChangesOnFirstRender?: boolean;\n  /**\n   * If `true` the dropdown will show tooltips when user mouseenter text in list\n   */\n  hasTooltips?: boolean;\n  /**\n   * If `true`, selection can be toggled when single selection.\n   */\n  singleSelectionToggle?: boolean;\n  /**\n   * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n   */\n  height?: number;\n  /**\n   * Experimental. Max height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class.\n   */\n  maxHeight?: number;\n  /**\n   * Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options.\n   */\n  virtualized?: boolean;\n}\n\n/**\n * The values property was being deeply cloned. That created a significant performance\n * hit when the values contained complex properties' values, like React Nodes.\n *\n * For minimizing the impact of removing the clone, a shallow clone of the array and its\n * objects is performed instead. That should have the same effect in the majority of the\n * cases, where the properties' values are primitive.\n */\nconst clone = (values: HvListValue[]) => values.map((value) => ({ ...value }));\n\n/**\n * Set all hidden's to false.\n */\nconst cleanHidden = (lst: HvListValue[]) =>\n  lst.map((item) => ({ ...item, isHidden: false }));\n\nconst valuesExist = (values: HvListValue[]) =>\n  !isNil(values) && values?.length > 0;\n\nexport const HvDropdownList = ({\n  id,\n  classes: classesProp,\n  values = [],\n  multiSelect = false,\n  showSearch = false,\n  onChange,\n  onCancel,\n  labels,\n  notifyChangesOnFirstRender = false,\n  hasTooltips = false,\n  singleSelectionToggle,\n  height: dropdownHeight,\n  maxHeight,\n  virtualized = false,\n  ...others\n}: HvDropdownListProps) => {\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const [searchStr, setSearchStr] = useState<string>(\"\");\n  const [list, setList] = useState<HvListValue[]>(clone(values));\n  const [allSelected, setAllSelected] = useState<boolean>(false);\n  const [anySelected, setAnySelected] = useState<boolean>(false);\n  const { width, height } = useContext(BaseDropdownContext);\n\n  const newLabels = {\n    selectAll: labels?.selectAll,\n    selectionConjunction: labels?.multiSelectionConjunction,\n  };\n\n  /**\n   * Update states associated with select all.\n   */\n  const updateSelectAll = (listValues: HvListValue[]) => {\n    if (!listValues) return;\n    const nbrSelected = getSelected(listValues).length;\n    const hasSelection = nbrSelected > 0;\n    const allSelect = nbrSelected === listValues.length;\n\n    setAnySelected(hasSelection);\n    setAllSelected(hasSelection && allSelect);\n  };\n\n  /**\n   * After the first render, call onChange if notifyChangesOnFirstRender.\n   */\n  useEffect(() => {\n    if (!valuesExist(values)) return;\n    setList(clone(values));\n    updateSelectAll(values);\n    if (notifyChangesOnFirstRender) {\n      onChange?.(values, false, false, true);\n    }\n  }, [values, notifyChangesOnFirstRender, onChange]);\n\n  /**\n   * Sets the filtered values to the state.\n   *\n   * @param {String} str - The value that is being looked.\n   */\n  const handleSearch = (str: string) => {\n    const results = list\n      ? list.filter(\n          ({\n            searchValue,\n            label,\n            value,\n          }: {\n            searchValue?: any;\n            label?: any;\n            value?: any;\n          }) => {\n            let stringValue = \"\";\n            if (\n              typeof searchValue === \"string\" ||\n              searchValue instanceof String\n            ) {\n              stringValue = searchValue.toLowerCase();\n            } else if (typeof label === \"string\" || label instanceof String) {\n              stringValue = label.toLowerCase();\n            } else if (typeof value === \"string\" || value instanceof String) {\n              stringValue = value.toLowerCase();\n            }\n\n            return stringValue.indexOf(str.toLowerCase()) >= 0;\n          }\n        )\n      : null;\n\n    if (!isNil(results)) {\n      const newList = list.map((elem) => {\n        const isResult = results.find((result) => result.label === elem.label);\n        return { ...elem, isHidden: !isResult };\n      });\n\n      setList(newList);\n      setSearchStr(str);\n    }\n    return str;\n  };\n\n  /**\n   * Create search element.\n   *\n   * @returns {*}\n   */\n  const renderSearch = () => (\n    <div className={classes.searchContainer}>\n      <HvInput\n        id={setId(id, \"search\")}\n        type=\"search\"\n        value={searchStr}\n        placeholder={labels?.searchPlaceholder}\n        aria-label={labels?.searchPlaceholder}\n        onChange={(event, str) => handleSearch(str)}\n      />\n    </div>\n  );\n\n  /**\n   * Select all the values inside the dropdown.\n   *\n   */\n  const handleSelectAll = () => {\n    const newList = list.map((elem) => ({ ...elem, selected: !anySelected }));\n    setList(newList);\n    updateSelectAll(newList);\n  };\n\n  /**\n   * Create selecteAll component.\n   *\n   * @returns {*}\n   */\n  const renderSelectAll = () => {\n    const selectAll = labels?.selectAll;\n    const multiSelectionConjunction = labels?.multiSelectionConjunction;\n    const nbrSelected = getSelected(list).length;\n\n    const defaultLabel = (\n      <HvTypography component=\"span\">\n        {nbrSelected > 0 ? (\n          <>\n            <b>{nbrSelected}</b>\n            {` ${multiSelectionConjunction} ${list.length}`}\n          </>\n        ) : (\n          <>\n            <b>{selectAll}</b>\n            {` (${list.length})`}\n          </>\n        )}\n      </HvTypography>\n    );\n\n    return (\n      <div className={classes.selectAllContainer}>\n        <HvCheckBox\n          id={setId(id, \"select-all\")}\n          label={defaultLabel}\n          onChange={() => handleSelectAll()}\n          classes={{\n            container: classes.selection,\n          }}\n          className={classes.selectAll}\n          indeterminate={anySelected && !allSelected}\n          checked={allSelected}\n        />\n      </div>\n    );\n  };\n\n  /**\n   * When selecting the state list is updated with the corresponding selection.\n   *\n   * @param listValues - elements selected.\n   */\n  const onSelection: HvListProps[\"onChange\"] = (listValues) => {\n    if (!multiSelect) {\n      onChange(cleanHidden(listValues), true, true, true);\n    } else {\n      updateSelectAll(listValues);\n      setList(clone(listValues));\n    }\n  };\n\n  /**\n   * Render action buttons.\n   */\n  const renderActions = () => {\n    const applyLabel = labels?.applyLabel;\n    const cancelLabel = labels?.cancelLabel;\n    return (\n      <HvActionBar id={setId(id, \"actions\")}>\n        <HvButton\n          id={setId(id, \"actions-apply\")}\n          onClick={() => onChange(cleanHidden(list), true, true, true)}\n          variant=\"primaryGhost\"\n        >\n          {applyLabel}\n        </HvButton>\n        <HvButton\n          id={setId(id, \"actions-cancel\")}\n          onClick={onCancel}\n          variant=\"primaryGhost\"\n        >\n          {cancelLabel}\n        </HvButton>\n      </HvActionBar>\n    );\n  };\n\n  const showList = valuesExist(values);\n\n  return (\n    <div className={classes.rootList}>\n      <div className={classes.listBorderDown} />\n      <div className={classes.listContainer}>\n        {showSearch && renderSearch()}\n        {showList && multiSelect && renderSelectAll()}\n        {showList && (\n          <HvList\n            id={setId(id, \"list\")}\n            classes={{\n              root: cx(\n                classes.dropdownListContainer,\n                css({\n                  maxWidth: width,\n                  maxHeight:\n                    maxHeight ??\n                    `calc(${height}px - 32px - ${theme.space.xs} - ${theme.space.sm})`,\n                  overflow: \"auto\",\n                  padding: 5,\n                }),\n                dropdownHeight &&\n                  css({\n                    height: dropdownHeight,\n                  }),\n                virtualized &&\n                  css({\n                    maxWidth: \"inherit\",\n                    maxHeight: \"inherit\",\n                    overflow: \"inherit\",\n                    padding: 0,\n                  })\n              ),\n            }}\n            values={list}\n            multiSelect={multiSelect}\n            useSelector={multiSelect}\n            showSelectAll={false}\n            onChange={onSelection}\n            labels={newLabels}\n            hasTooltips={hasTooltips}\n            selectable\n            condensed\n            singleSelectionToggle={singleSelectionToggle}\n            height={dropdownHeight}\n            virtualized={virtualized}\n            {...others}\n          />\n        )}\n      </div>\n      {showList && multiSelect ? renderActions() : null}\n    </div>\n  );\n};\n"],"names":["clone","values","map","value","cleanHidden","lst","item","isHidden","valuesExist","isNil","length","HvDropdownList","id","classes","classesProp","multiSelect","showSearch","onChange","onCancel","labels","notifyChangesOnFirstRender","hasTooltips","singleSelectionToggle","height","dropdownHeight","maxHeight","virtualized","others","cx","css","useClasses","searchStr","setSearchStr","useState","list","setList","allSelected","setAllSelected","anySelected","setAnySelected","width","useContext","BaseDropdownContext","newLabels","selectAll","selectionConjunction","multiSelectionConjunction","updateSelectAll","listValues","nbrSelected","getSelected","hasSelection","allSelect","useEffect","handleSearch","str","results","filter","searchValue","label","stringValue","String","toLowerCase","indexOf","newList","elem","isResult","find","result","renderSearch","_jsx","className","searchContainer","children","HvInput","setId","type","placeholder","searchPlaceholder","event","handleSelectAll","selected","renderSelectAll","defaultLabel","HvTypography","component","_jsxs","_Fragment","selectAllContainer","HvCheckBox","container","selection","indeterminate","checked","onSelection","renderActions","applyLabel","cancelLabel","HvActionBar","HvButton","onClick","variant","showList","rootList","listBorderDown","listContainer","HvList","root","dropdownListContainer","maxWidth","theme","space","xs","sm","overflow","padding","useSelector","showSelectAll","selectable","condensed"],"mappings":"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"}

package/dist/esm/components/OverflowTooltip/OverflowTooltip.js

@@ -44,7 +44,7 @@ const HvOverflowTooltip = (props) => {
     }, className),
     children: data
   }), [className, classes.tooltipAnchor, classes.tooltipAnchorParagraph, cx, data, isParag, ref]);
-  return open || isOverflowing ? /* @__PURE__ */ jsx(HvTooltip, {
+  return /* @__PURE__ */ jsx(HvTooltip, {
     id,
     disableHoverListener: !isOverflowing,
     open,
@@ -54,9 +54,11 @@ const HvOverflowTooltip = (props) => {
       variant: "body",
       children: data
     }),
+    "aria-label": null,
+    "aria-labelledby": null,
     ...tooltipsProps,
     children: content
-  }) : content;
+  });
 };
 export {
   HvOverflowTooltip,

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

@@ -1 +1 @@
-{"version":3,"file":"OverflowTooltip.js","sources":["../../../../src/components/OverflowTooltip/OverflowTooltip.tsx"],"sourcesContent":["import { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useMemo } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTooltip, HvTooltipProps } from \"@core/components/Tooltip\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/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  const { classes, cx } = useClasses(classesProp);\n\n  const { width = 0, ref } = useResizeDetector({\n    refreshMode: \"debounce\",\n    refreshOptions: {\n      trailing: true,\n    },\n    handleHeight: false,\n  });\n  const scrollWidth = ref.current?.scrollWidth || 0;\n  // The difference should be higher than a pixel to be considered as overflowing\n  const isOverflowing = scrollWidth - width >= 1;\n\n  const isParag = useMemo(\n    () => paragraphOverflow && isParagraph(data?.toString()),\n    [data, paragraphOverflow]\n  );\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 open || isOverflowing ? (\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      {...tooltipsProps}\n    >\n      {content}\n    </HvTooltip>\n  ) : (\n    content\n  );\n};\n"],"names":["isParagraph","children","test","HvOverflowTooltip","props","id","classes","classesProp","className","data","open","paragraphOverflow","placement","tooltipsProps","useDefaultProps","cx","useClasses","width","ref","useResizeDetector","refreshMode","refreshOptions","trailing","handleHeight","scrollWidth","current","isOverflowing","isParag","useMemo","toString","content","_jsx","tooltipAnchor","tooltipAnchorParagraph","HvTooltip","disableHoverListener","title","HvTypography","tooltipData","variant"],"mappings":";;;;;;;;AAuCA,MAAMA,cAAcA,CAACC,WAAW,OAAO,KAAKC,KAAKD,QAAQ;AAK5CE,MAAAA,oBAAoBA,CAACC,UAAkC;;AAC5D,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,YAAY;AAAA,IACZC;AAAAA,EAAAA,IACEC,gBAAgB,qBAAqBV,KAAK;AACxC,QAAA;AAAA,IAAEE;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,WAAWT,WAAW;AAExC,QAAA;AAAA,IAAEU,QAAQ;AAAA,IAAGC;AAAAA,MAAQC,kBAAkB;AAAA,IAC3CC,aAAa;AAAA,IACbC,gBAAgB;AAAA,MACdC,UAAU;AAAA,IACZ;AAAA,IACAC,cAAc;AAAA,EAAA,CACf;AACKC,QAAAA,gBAAcN,SAAIO,YAAJP,mBAAaM,gBAAe;AAE1CE,QAAAA,gBAAgBF,cAAcP,SAAS;AAE7C,QAAMU,UAAUC,QACd,MAAMjB,qBAAqBX,YAAYS,6BAAMoB,UAAU,GACvD,CAACpB,MAAME,iBAAiB,CAC1B;AAEA,QAAMmB,UAAUF,QACd,MACEG,oBAAA,OAAA;AAAA,IACEb;AAAAA,IACAV,WAAWO,GACT;AAAA,MACE,CAACT,QAAQ0B,aAAa,GAAG,CAACL;AAAAA,MAC1B,CAACrB,QAAQ2B,sBAAsB,GAAGN;AAAAA,OAEpCnB,SACF;AAAA,IAAEP,UAEDQ;AAAAA,EACE,CAAA,GAEP,CACED,WACAF,QAAQ0B,eACR1B,QAAQ2B,wBACRlB,IACAN,MACAkB,SACAT,GAAG,CAEP;AAEOR,SAAAA,QAAQgB,gBACbK,oBAACG,WAAS;AAAA,IACR7B;AAAAA,IACA8B,sBAAsB,CAACT;AAAAA,IACvBhB;AAAAA,IACAE;AAAAA,IACAwB,2BACGC,cAAY;AAAA,MAAC7B,WAAWF,QAAQgC;AAAAA,MAAaC,SAAQ;AAAA,MAAMtC,UACzDQ;AAAAA,IAAAA,CACW;AAAA,IACf,GACGI;AAAAA,IAAaZ,UAEhB6B;AAAAA,EACQ,CAAA,IAEXA;AAEJ;"}
+{"version":3,"file":"OverflowTooltip.js","sources":["../../../../src/components/OverflowTooltip/OverflowTooltip.tsx"],"sourcesContent":["import { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useMemo } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTooltip, HvTooltipProps } from \"@core/components/Tooltip\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/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  const { classes, cx } = useClasses(classesProp);\n\n  const { width = 0, ref } = useResizeDetector({\n    refreshMode: \"debounce\",\n    refreshOptions: {\n      trailing: true,\n    },\n    handleHeight: false,\n  });\n  const scrollWidth = ref.current?.scrollWidth || 0;\n  // The difference should be higher than a pixel to be considered as overflowing\n  const isOverflowing = scrollWidth - width >= 1;\n\n  const isParag = useMemo(\n    () => paragraphOverflow && isParagraph(data?.toString()),\n    [data, paragraphOverflow]\n  );\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":["isParagraph","children","test","HvOverflowTooltip","props","id","classes","classesProp","className","data","open","paragraphOverflow","placement","tooltipsProps","useDefaultProps","cx","useClasses","width","ref","useResizeDetector","refreshMode","refreshOptions","trailing","handleHeight","scrollWidth","current","isOverflowing","isParag","useMemo","toString","content","_jsx","tooltipAnchor","tooltipAnchorParagraph","HvTooltip","disableHoverListener","title","HvTypography","tooltipData","variant"],"mappings":";;;;;;;;AAuCA,MAAMA,cAAcA,CAACC,WAAW,OAAO,KAAKC,KAAKD,QAAQ;AAK5CE,MAAAA,oBAAoBA,CAACC,UAAkC;;AAC5D,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,YAAY;AAAA,IACZC;AAAAA,EAAAA,IACEC,gBAAgB,qBAAqBV,KAAK;AACxC,QAAA;AAAA,IAAEE;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,WAAWT,WAAW;AAExC,QAAA;AAAA,IAAEU,QAAQ;AAAA,IAAGC;AAAAA,MAAQC,kBAAkB;AAAA,IAC3CC,aAAa;AAAA,IACbC,gBAAgB;AAAA,MACdC,UAAU;AAAA,IACZ;AAAA,IACAC,cAAc;AAAA,EAAA,CACf;AACKC,QAAAA,gBAAcN,SAAIO,YAAJP,mBAAaM,gBAAe;AAE1CE,QAAAA,gBAAgBF,cAAcP,SAAS;AAE7C,QAAMU,UAAUC,QACd,MAAMjB,qBAAqBX,YAAYS,6BAAMoB,UAAU,GACvD,CAACpB,MAAME,iBAAiB,CAC1B;AAEA,QAAMmB,UAAUF,QACd,MACEG,oBAAA,OAAA;AAAA,IACEb;AAAAA,IACAV,WAAWO,GACT;AAAA,MACE,CAACT,QAAQ0B,aAAa,GAAG,CAACL;AAAAA,MAC1B,CAACrB,QAAQ2B,sBAAsB,GAAGN;AAAAA,OAEpCnB,SACF;AAAA,IAAEP,UAEDQ;AAAAA,EACE,CAAA,GAEP,CACED,WACAF,QAAQ0B,eACR1B,QAAQ2B,wBACRlB,IACAN,MACAkB,SACAT,GAAG,CAEP;AAEA,6BACGgB,WAAS;AAAA,IACR7B;AAAAA,IACA8B,sBAAsB,CAACT;AAAAA,IACvBhB;AAAAA,IACAE;AAAAA,IACAwB,2BACGC,cAAY;AAAA,MAAC7B,WAAWF,QAAQgC;AAAAA,MAAaC,SAAQ;AAAA,MAAMtC,UACzDQ;AAAAA,IAAAA,CACW;AAAA,IAGhB,cAAY;AAAA,IACZ,mBAAiB;AAAA,IAAY,GACzBI;AAAAA,IAAaZ,UAEhB6B;AAAAA,EAAAA,CACQ;AAEf;"}

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

@@ -23,6 +23,7 @@ const popperSx = (useSingle) => {
       opacity: 1
     },
     [`& .${tooltipClasses.tooltip}`]: {
+      fontFamily: theme.fontFamily.body,
       ...theme.typography.body,
       display: "flex",
       width: "fit-content",

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.styles.js","sources":["../../../../src/components/Tooltip/Tooltip.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { tooltipClasses as MuitooltipClasses } from \"@mui/material\";\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTooltip\", {\n  root: {},\n  tooltip: {},\n  tooltipMulti: {},\n  popper: {},\n  title: {},\n  valuesContainer: {},\n  values: {},\n  color: {},\n  separatorColor: {},\n  separator: {},\n  valueWrapper: {},\n});\n\nexport const popperSx = (useSingle: boolean) => {\n  return {\n    [`& .${MuitooltipClasses.popper}`]: {\n      opacity: 1,\n    },\n    [`& .${MuitooltipClasses.tooltip}`]: {\n      ...theme.typography.body,\n      display: \"flex\",\n      width: \"fit-content\",\n      maxWidth: 532,\n      backgroundColor: theme.colors.atmo1,\n      boxShadow: theme.colors.shadow,\n      padding: 0,\n      ...(useSingle && {\n        padding: \"15px 20px\",\n        borderRadius: theme.tooltip.borderRadius,\n      }),\n\n      \"& p\": {\n        display: \"-webkit-box\",\n        width: \"fit-content\",\n        boxOrient: \"vertical\",\n        textOverflow: \"ellipsis\",\n        overflow: \"hidden\",\n        ...(useSingle && { wordBreak: \"break-word\" }),\n      },\n    },\n    [`& .${staticClasses.title}`]: {\n      padding: \"15px 20px\",\n      borderBottom: `3px solid ${theme.colors.atmo2}`,\n    },\n    [`& .${staticClasses.valuesContainer}`]: {\n      padding: theme.space.sm,\n    },\n    [`& .${staticClasses.values}`]: {\n      display: \"flex\",\n      justifyContent: \"space-between\",\n      paddingBottom: \"10px\",\n      \"&:last-child\": {\n        paddingBottom: 0,\n      },\n    },\n    [`& .${staticClasses.color}`]: {\n      width: theme.space.xs,\n    },\n    [`& .${staticClasses.separator}`]: {\n      width: theme.space.xs,\n    },\n    [`& .${staticClasses.separatorColor}`]: {\n      width: \"5px\",\n    },\n    [`& .${staticClasses.valueWrapper}`]: {\n      padding: theme.space.sm,\n    },\n  };\n};\n"],"names":["staticClasses","useClasses","createClasses","root","tooltip","tooltipMulti","popper","title","valuesContainer","values","color","separatorColor","separator","valueWrapper","popperSx","useSingle","MuitooltipClasses","opacity","theme","typography","body","display","width","maxWidth","backgroundColor","colors","atmo1","boxShadow","shadow","padding","borderRadius","boxOrient","textOverflow","overflow","wordBreak","borderBottom","atmo2","space","sm","justifyContent","paddingBottom","xs"],"mappings":";;;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,aAAa;AAAA,EACtEC,MAAM,CAAC;AAAA,EACPC,SAAS,CAAC;AAAA,EACVC,cAAc,CAAC;AAAA,EACfC,QAAQ,CAAC;AAAA,EACTC,OAAO,CAAC;AAAA,EACRC,iBAAiB,CAAC;AAAA,EAClBC,QAAQ,CAAC;AAAA,EACTC,OAAO,CAAC;AAAA,EACRC,gBAAgB,CAAC;AAAA,EACjBC,WAAW,CAAC;AAAA,EACZC,cAAc,CAAC;AACjB,CAAC;AAEYC,MAAAA,WAAWA,CAACC,cAAuB;AACvC,SAAA;AAAA,IACL,CAAE,MAAKC,eAAkBV,QAAQ,GAAG;AAAA,MAClCW,SAAS;AAAA,IACX;AAAA,IACA,CAAE,MAAKD,eAAkBZ,SAAS,GAAG;AAAA,MACnC,GAAGc,MAAMC,WAAWC;AAAAA,MACpBC,SAAS;AAAA,MACTC,OAAO;AAAA,MACPC,UAAU;AAAA,MACVC,iBAAiBN,MAAMO,OAAOC;AAAAA,MAC9BC,WAAWT,MAAMO,OAAOG;AAAAA,MACxBC,SAAS;AAAA,MACT,GAAId,aAAa;AAAA,QACfc,SAAS;AAAA,QACTC,cAAcZ,MAAMd,QAAQ0B;AAAAA,MAC9B;AAAA,MAEA,OAAO;AAAA,QACLT,SAAS;AAAA,QACTC,OAAO;AAAA,QACPS,WAAW;AAAA,QACXC,cAAc;AAAA,QACdC,UAAU;AAAA,QACV,GAAIlB,aAAa;AAAA,UAAEmB,WAAW;AAAA,QAAa;AAAA,MAC7C;AAAA,IACF;AAAA,IACA,CAAE,MAAKlC,cAAcO,OAAO,GAAG;AAAA,MAC7BsB,SAAS;AAAA,MACTM,cAAe,aAAYjB,MAAMO,OAAOW;AAAAA,IAC1C;AAAA,IACA,CAAE,MAAKpC,cAAcQ,iBAAiB,GAAG;AAAA,MACvCqB,SAASX,MAAMmB,MAAMC;AAAAA,IACvB;AAAA,IACA,CAAE,MAAKtC,cAAcS,QAAQ,GAAG;AAAA,MAC9BY,SAAS;AAAA,MACTkB,gBAAgB;AAAA,MAChBC,eAAe;AAAA,MACf,gBAAgB;AAAA,QACdA,eAAe;AAAA,MACjB;AAAA,IACF;AAAA,IACA,CAAE,MAAKxC,cAAcU,OAAO,GAAG;AAAA,MAC7BY,OAAOJ,MAAMmB,MAAMI;AAAAA,IACrB;AAAA,IACA,CAAE,MAAKzC,cAAcY,WAAW,GAAG;AAAA,MACjCU,OAAOJ,MAAMmB,MAAMI;AAAAA,IACrB;AAAA,IACA,CAAE,MAAKzC,cAAcW,gBAAgB,GAAG;AAAA,MACtCW,OAAO;AAAA,IACT;AAAA,IACA,CAAE,MAAKtB,cAAca,cAAc,GAAG;AAAA,MACpCgB,SAASX,MAAMmB,MAAMC;AAAAA,IACvB;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"Tooltip.styles.js","sources":["../../../../src/components/Tooltip/Tooltip.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { tooltipClasses as MuitooltipClasses } from \"@mui/material\";\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTooltip\", {\n  root: {},\n  tooltip: {},\n  tooltipMulti: {},\n  popper: {},\n  title: {},\n  valuesContainer: {},\n  values: {},\n  color: {},\n  separatorColor: {},\n  separator: {},\n  valueWrapper: {},\n});\n\nexport const popperSx = (useSingle: boolean) => {\n  return {\n    [`& .${MuitooltipClasses.popper}`]: {\n      opacity: 1,\n    },\n    [`& .${MuitooltipClasses.tooltip}`]: {\n      fontFamily: theme.fontFamily.body,\n      ...theme.typography.body,\n      display: \"flex\",\n      width: \"fit-content\",\n      maxWidth: 532,\n      backgroundColor: theme.colors.atmo1,\n      boxShadow: theme.colors.shadow,\n      padding: 0,\n      ...(useSingle && {\n        padding: \"15px 20px\",\n        borderRadius: theme.tooltip.borderRadius,\n      }),\n\n      \"& p\": {\n        display: \"-webkit-box\",\n        width: \"fit-content\",\n        boxOrient: \"vertical\",\n        textOverflow: \"ellipsis\",\n        overflow: \"hidden\",\n        ...(useSingle && { wordBreak: \"break-word\" }),\n      },\n    },\n    [`& .${staticClasses.title}`]: {\n      padding: \"15px 20px\",\n      borderBottom: `3px solid ${theme.colors.atmo2}`,\n    },\n    [`& .${staticClasses.valuesContainer}`]: {\n      padding: theme.space.sm,\n    },\n    [`& .${staticClasses.values}`]: {\n      display: \"flex\",\n      justifyContent: \"space-between\",\n      paddingBottom: \"10px\",\n      \"&:last-child\": {\n        paddingBottom: 0,\n      },\n    },\n    [`& .${staticClasses.color}`]: {\n      width: theme.space.xs,\n    },\n    [`& .${staticClasses.separator}`]: {\n      width: theme.space.xs,\n    },\n    [`& .${staticClasses.separatorColor}`]: {\n      width: \"5px\",\n    },\n    [`& .${staticClasses.valueWrapper}`]: {\n      padding: theme.space.sm,\n    },\n  };\n};\n"],"names":["staticClasses","useClasses","createClasses","root","tooltip","tooltipMulti","popper","title","valuesContainer","values","color","separatorColor","separator","valueWrapper","popperSx","useSingle","MuitooltipClasses","opacity","fontFamily","theme","body","typography","display","width","maxWidth","backgroundColor","colors","atmo1","boxShadow","shadow","padding","borderRadius","boxOrient","textOverflow","overflow","wordBreak","borderBottom","atmo2","space","sm","justifyContent","paddingBottom","xs"],"mappings":";;;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,aAAa;AAAA,EACtEC,MAAM,CAAC;AAAA,EACPC,SAAS,CAAC;AAAA,EACVC,cAAc,CAAC;AAAA,EACfC,QAAQ,CAAC;AAAA,EACTC,OAAO,CAAC;AAAA,EACRC,iBAAiB,CAAC;AAAA,EAClBC,QAAQ,CAAC;AAAA,EACTC,OAAO,CAAC;AAAA,EACRC,gBAAgB,CAAC;AAAA,EACjBC,WAAW,CAAC;AAAA,EACZC,cAAc,CAAC;AACjB,CAAC;AAEYC,MAAAA,WAAWA,CAACC,cAAuB;AACvC,SAAA;AAAA,IACL,CAAE,MAAKC,eAAkBV,QAAQ,GAAG;AAAA,MAClCW,SAAS;AAAA,IACX;AAAA,IACA,CAAE,MAAKD,eAAkBZ,SAAS,GAAG;AAAA,MACnCc,YAAYC,MAAMD,WAAWE;AAAAA,MAC7B,GAAGD,MAAME,WAAWD;AAAAA,MACpBE,SAAS;AAAA,MACTC,OAAO;AAAA,MACPC,UAAU;AAAA,MACVC,iBAAiBN,MAAMO,OAAOC;AAAAA,MAC9BC,WAAWT,MAAMO,OAAOG;AAAAA,MACxBC,SAAS;AAAA,MACT,GAAIf,aAAa;AAAA,QACfe,SAAS;AAAA,QACTC,cAAcZ,MAAMf,QAAQ2B;AAAAA,MAC9B;AAAA,MAEA,OAAO;AAAA,QACLT,SAAS;AAAA,QACTC,OAAO;AAAA,QACPS,WAAW;AAAA,QACXC,cAAc;AAAA,QACdC,UAAU;AAAA,QACV,GAAInB,aAAa;AAAA,UAAEoB,WAAW;AAAA,QAAa;AAAA,MAC7C;AAAA,IACF;AAAA,IACA,CAAE,MAAKnC,cAAcO,OAAO,GAAG;AAAA,MAC7BuB,SAAS;AAAA,MACTM,cAAe,aAAYjB,MAAMO,OAAOW;AAAAA,IAC1C;AAAA,IACA,CAAE,MAAKrC,cAAcQ,iBAAiB,GAAG;AAAA,MACvCsB,SAASX,MAAMmB,MAAMC;AAAAA,IACvB;AAAA,IACA,CAAE,MAAKvC,cAAcS,QAAQ,GAAG;AAAA,MAC9Ba,SAAS;AAAA,MACTkB,gBAAgB;AAAA,MAChBC,eAAe;AAAA,MACf,gBAAgB;AAAA,QACdA,eAAe;AAAA,MACjB;AAAA,IACF;AAAA,IACA,CAAE,MAAKzC,cAAcU,OAAO,GAAG;AAAA,MAC7Ba,OAAOJ,MAAMmB,MAAMI;AAAAA,IACrB;AAAA,IACA,CAAE,MAAK1C,cAAcY,WAAW,GAAG;AAAA,MACjCW,OAAOJ,MAAMmB,MAAMI;AAAAA,IACrB;AAAA,IACA,CAAE,MAAK1C,cAAcW,gBAAgB,GAAG;AAAA,MACtCY,OAAO;AAAA,IACT;AAAA,IACA,CAAE,MAAKvB,cAAca,cAAc,GAAG;AAAA,MACpCiB,SAASX,MAAMmB,MAAMC;AAAAA,IACvB;AAAA,EAAA;AAEJ;"}

package/dist/esm/components/VerticalNavigation/Actions/Action.js

@@ -37,6 +37,9 @@ const HvVerticalNavigationAction = ({
       [classes.minimized]: !isOpen
     }, className),
     tabIndex: 0,
+    ...!isOpen && {
+      "aria-label": label
+    },
     onKeyDown: handleKeyDown,
     onClick,
     ...others,

package/dist/esm/components/VerticalNavigation/Actions/Action.js.map

@@ -1 +1 @@
-{"version":3,"file":"Action.js","sources":["../../../../../src/components/VerticalNavigation/Actions/Action.tsx"],"sourcesContent":["import { MouseEventHandler, useCallback, useContext } from \"react\";\n\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Action.styles\";\n\nexport { staticClasses as actionClasses };\n\nexport type HvVerticalNavigationActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationActionProps {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvVerticalNavigationActionClasses;\n  /**\n   * Id to be applied to the action.\n   */\n  id?: string;\n  /**\n   * Visual label.\n   */\n  label?: string;\n  /**\n   * Icon.\n   */\n  icon?: React.ReactNode;\n  /**\n   * Callback called when clicked.\n   */\n  onClick?: MouseEventHandler<HTMLElement>;\n}\n\nexport const HvVerticalNavigationAction = ({\n  className,\n  classes: classesProp,\n  id,\n  label = \"\",\n  icon,\n  onClick,\n  ...others\n}: HvVerticalNavigationActionProps) => {\n  const { isOpen } = useContext(VerticalNavigationContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleKeyDown = useCallback(\n    (event) => {\n      if (\n        onClick == null ||\n        (!isKey(event, \"Enter\") && !isKey(event, \"Space\"))\n      ) {\n        return;\n      }\n\n      onClick(event);\n    },\n    [onClick]\n  );\n\n  return (\n    <HvTypography\n      id={setId(id, \"button\")}\n      component=\"div\"\n      role=\"button\"\n      className={cx(\n        classes.action,\n        {\n          [classes.noIcon]: !icon,\n          [classes.minimized]: !isOpen,\n        },\n        className\n      )}\n      tabIndex={0}\n      onKeyDown={handleKeyDown}\n      onClick={onClick}\n      {...others}\n    >\n      {icon}\n      {isOpen && label}\n    </HvTypography>\n  );\n};\n"],"names":["HvVerticalNavigationAction","className","classes","classesProp","id","label","icon","onClick","others","isOpen","useContext","VerticalNavigationContext","cx","useClasses","handleKeyDown","useCallback","event","isKey","HvTypography","setId","component","role","action","noIcon","minimized","tabIndex","onKeyDown","children"],"mappings":";;;;;;;;AAyCO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC,QAAQ;AAAA,EACRC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC4B,MAAM;AAC/B,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAWC,WAAWC,yBAAyB;AAEjD,QAAA;AAAA,IAAET;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,WAAWV,WAAW;AAExCW,QAAAA,gBAAgBC,YACnBC,CAAU,UAAA;AAEPT,QAAAA,WAAW,QACV,CAACU,MAAMD,OAAO,OAAO,KAAK,CAACC,MAAMD,OAAO,OAAO,GAChD;AACA;AAAA,IACF;AAEAT,YAAQS,KAAK;AAAA,EAAA,GAEf,CAACT,OAAO,CACV;AAEA,8BACGW,cAAY;AAAA,IACXd,IAAIe,MAAMf,IAAI,QAAQ;AAAA,IACtBgB,WAAU;AAAA,IACVC,MAAK;AAAA,IACLpB,WAAWW,GACTV,QAAQoB,QACR;AAAA,MACE,CAACpB,QAAQqB,MAAM,GAAG,CAACjB;AAAAA,MACnB,CAACJ,QAAQsB,SAAS,GAAG,CAACf;AAAAA,OAExBR,SACF;AAAA,IACAwB,UAAU;AAAA,IACVC,WAAWZ;AAAAA,IACXP;AAAAA,IAAiB,GACbC;AAAAA,IAAMmB,UAETrB,CAAAA,MACAG,UAAUJ,KAAK;AAAA,EAAA,CACJ;AAElB;"}
+{"version":3,"file":"Action.js","sources":["../../../../../src/components/VerticalNavigation/Actions/Action.tsx"],"sourcesContent":["import { MouseEventHandler, useCallback, useContext } from \"react\";\n\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { VerticalNavigationContext } from \"../VerticalNavigationContext\";\nimport { staticClasses, useClasses } from \"./Action.styles\";\n\nexport { staticClasses as actionClasses };\n\nexport type HvVerticalNavigationActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalNavigationActionProps {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvVerticalNavigationActionClasses;\n  /**\n   * Id to be applied to the action.\n   */\n  id?: string;\n  /**\n   * Visual label.\n   */\n  label?: string;\n  /**\n   * Icon.\n   */\n  icon?: React.ReactNode;\n  /**\n   * Callback called when clicked.\n   */\n  onClick?: MouseEventHandler<HTMLElement>;\n}\n\nexport const HvVerticalNavigationAction = ({\n  className,\n  classes: classesProp,\n  id,\n  label = \"\",\n  icon,\n  onClick,\n  ...others\n}: HvVerticalNavigationActionProps) => {\n  const { isOpen } = useContext(VerticalNavigationContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleKeyDown = useCallback(\n    (event) => {\n      if (\n        onClick == null ||\n        (!isKey(event, \"Enter\") && !isKey(event, \"Space\"))\n      ) {\n        return;\n      }\n\n      onClick(event);\n    },\n    [onClick]\n  );\n\n  return (\n    <HvTypography\n      id={setId(id, \"button\")}\n      component=\"div\"\n      role=\"button\"\n      className={cx(\n        classes.action,\n        {\n          [classes.noIcon]: !icon,\n          [classes.minimized]: !isOpen,\n        },\n        className\n      )}\n      tabIndex={0}\n      {...(!isOpen && { \"aria-label\": label })}\n      onKeyDown={handleKeyDown}\n      onClick={onClick}\n      {...others}\n    >\n      {icon}\n      {isOpen && label}\n    </HvTypography>\n  );\n};\n"],"names":["HvVerticalNavigationAction","className","classes","classesProp","id","label","icon","onClick","others","isOpen","useContext","VerticalNavigationContext","cx","useClasses","handleKeyDown","useCallback","event","isKey","HvTypography","setId","component","role","action","noIcon","minimized","tabIndex","onKeyDown","children"],"mappings":";;;;;;;;AAyCO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC,QAAQ;AAAA,EACRC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC4B,MAAM;AAC/B,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAWC,WAAWC,yBAAyB;AAEjD,QAAA;AAAA,IAAET;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,WAAWV,WAAW;AAExCW,QAAAA,gBAAgBC,YACnBC,CAAU,UAAA;AAEPT,QAAAA,WAAW,QACV,CAACU,MAAMD,OAAO,OAAO,KAAK,CAACC,MAAMD,OAAO,OAAO,GAChD;AACA;AAAA,IACF;AAEAT,YAAQS,KAAK;AAAA,EAAA,GAEf,CAACT,OAAO,CACV;AAEA,8BACGW,cAAY;AAAA,IACXd,IAAIe,MAAMf,IAAI,QAAQ;AAAA,IACtBgB,WAAU;AAAA,IACVC,MAAK;AAAA,IACLpB,WAAWW,GACTV,QAAQoB,QACR;AAAA,MACE,CAACpB,QAAQqB,MAAM,GAAG,CAACjB;AAAAA,MACnB,CAACJ,QAAQsB,SAAS,GAAG,CAACf;AAAAA,OAExBR,SACF;AAAA,IACAwB,UAAU;AAAA,IAAE,GACP,CAAChB,UAAU;AAAA,MAAE,cAAcJ;AAAAA,IAAM;AAAA,IACtCqB,WAAWZ;AAAAA,IACXP;AAAAA,IAAiB,GACbC;AAAAA,IAAMmB,UAETrB,CAAAA,MACAG,UAAUJ,KAAK;AAAA,EAAA,CACJ;AAElB;"}

package/dist/types/index.d.ts

@@ -1191,7 +1191,7 @@ export declare type HvAtmosphereColors = Record<HvAtmosphereColorKeys, string>;
  * Avatars can be used to represent a user or a brand.
  * They can show an image, an icon or the initial letters of a name, for example.
  */
-export declare const HvAvatar: (props: HvAvatarProps) => JSX_2.Element;
+export declare const HvAvatar: ForwardRefExoticComponent<HvAvatarProps & RefAttributes<any>>;
 
 export declare type HvAvatarClasses = ExtractNames<typeof useClasses_17>;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-core",
-  "version": "5.26.2",
+  "version": "5.26.4",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Core React components for the NEXT Design System.",
@@ -64,7 +64,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "e3f4274547dc42cf6ace2a22267b63eba283e34a",
+  "gitHead": "078d35e13686f4088af478967ec91e684cc4c918",
   "main": "dist/cjs/index.cjs",
   "exports": {
     ".": {