@hitachivantara/uikit-react-core 5.66.12 → 5.66.14

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

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../src/List/List.tsx"],"sourcesContent":["import {\n  AriaRole,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { FixedSizeList } from \"react-window\";\nimport { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvCheckBox } from \"../CheckBox\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvLink } from \"../Link\";\nimport {\n  HvListContainer,\n  HvListContainerProps,\n  HvListItem,\n} from \"../ListContainer\";\nimport { HvOverflowTooltip } from \"../OverflowTooltip\";\nimport { HvRadio } from \"../Radio\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./List.styles\";\nimport { HvListLabels, HvListValue } from \"./types\";\nimport { useSelectableList } from \"./useSelectableList\";\nimport { parseList } from \"./utils\";\n\nexport { staticClasses as listClasses };\n\nexport type HvListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListProps\n  extends HvBaseProps<HTMLUListElement, \"onChange\" | \"onClick\"> {\n  /**\n   * A list containing the elements to be rendered.\n   *\n   * - id: The id of the item.\n   * - label: The label of the element to be rendered.\n   * - selected: The selection state of the element.\n   * - disabled: The disabled state of the element.\n   * - isHidden: Is item visible.\n   * - icon: The icon.\n   * - showNavIcon: If true renders the navigation icon on the right.\n   * - path: The path to navigate to.\n   */\n  values: HvListValue[];\n  /** If true renders a multi select list. */\n  multiSelect?: boolean;\n  /**\n   * If true renders select all option for multi selection lists with selectors.\n   * note: It will only be rendered if multiSelect and useSelector props are set to true.\n   */\n  showSelectAll?: boolean;\n  /** An object containing all the labels for the dropdown. */\n  labels?: HvListLabels;\n  /** If true renders list items with radio or checkbox selectors. */\n  useSelector?: boolean;\n  /** Call back fired when list item is selected. Returns selection state. */\n  onChange?: (value: HvListValue[]) => void;\n  /** Call back fired when list item is selected. Returns selected item. */\n  onClick?: (\n    event: React.ChangeEvent<HTMLLIElement>,\n    value: HvListValue,\n  ) => void;\n  /** If `true` the list items will show the selection state. */\n  selectable?: boolean;\n  /** If `true`, selection can be toggled when single selection. */\n  singleSelectionToggle?: boolean;\n  /** If `true` the list will be rendered without vertical spacing. */\n  condensed?: boolean;\n  /** If `true` the dropdown will show tooltips when user mouseenter text in list. @deprecated this is always enabled */\n  hasTooltips?: boolean;\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  height?: number;\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  virtualized?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListClasses;\n}\n\nconst DEFAULT_LABELS = {\n  selectAll: \"Select All\",\n  selectionConjunction: \"/\",\n};\n\n/**\n * Component used to show a set of related data to the user.\n */\nexport const HvList = (props: HvListProps) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    multiSelect = false,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    hasTooltips = false,\n    showSelectAll = false,\n    labels = DEFAULT_LABELS,\n    useSelector = false,\n    selectable = true,\n    singleSelectionToggle = true,\n    condensed = false,\n    onChange,\n    onClick,\n    values: valuesProp = [],\n    height,\n    virtualized = false,\n    ...others\n  } = useDefaultProps(\"HvList\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [list, setList, selection] = useSelectableList(valuesProp);\n  const listRef = useRef<any>(null);\n\n  useEffect(() => {\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const parsedList: HvListValue[] = parseList(\n      undefined,\n      passedProps,\n      undefined,\n      valuesProp,\n    );\n\n    setList(parsedList);\n  }, [valuesProp, multiSelect, selectable, singleSelectionToggle, setList]);\n\n  const [role, itemRole] = useMemo<[AriaRole, AriaRole]>(() => {\n    // selectors are responsible for the role & selection state\n    if (selectable && useSelector) return [\"list\", \"listitem\"];\n\n    if (selectable) return [\"listbox\", \"option\"];\n    return [\"menu\", \"menuitem\"];\n  }, [selectable, useSelector]);\n\n  const handleSelect = (evt, item) => {\n    if (!item.path) evt.preventDefault();\n    if (item.disabled) return;\n\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const parsedList = parseList(item, passedProps, undefined, list);\n    setList(parsedList);\n\n    onClick?.(evt, item);\n    onChange?.(parsedList);\n  };\n\n  const handleSelectAll = () => {\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const anySelectableSelected = list.some(\n      (elem) => elem.selected || elem.disabled,\n    );\n    const parsedList = parseList(\n      undefined,\n      passedProps,\n      !anySelectableSelected,\n      list,\n    );\n    setList(parsedList);\n\n    onChange?.(parsedList);\n  };\n\n  const renderLeftIcon = (item) => {\n    return isValidElement(item.icon)\n      ? item.icon\n      : item.icon?.({\n          isSelected: item.selected,\n          isDisabled: item.disabled,\n        });\n  };\n\n  const renderSelectAll = () => {\n    const { selectAll, selectionConjunction } = labels;\n\n    const anySelected = !!selection?.length;\n    const allSelected = selection.length === list.length;\n\n    const selectionLabel = (\n      <HvTypography component=\"span\">\n        {!anySelected ? (\n          <>\n            <b>{selectAll}</b>\n            {` (${list.length})`}\n          </>\n        ) : (\n          <>\n            <b>{selection.length}</b>\n            {`\\xa0${selectionConjunction}\\xa0`}\n            {list.length}\n          </>\n        )}\n      </HvTypography>\n    );\n\n    return (\n      <HvCheckBox\n        id={setId(id, \"select-all\")}\n        label={selectionLabel}\n        onChange={handleSelectAll}\n        className={classes.selectAllSelector}\n        indeterminate={anySelected && !allSelected}\n        checked={allSelected}\n      />\n    );\n  };\n\n  const renderItemText = (item: HvListValue) => {\n    return !multiSelect && item.path ? (\n      <HvLink route={item.path} classes={{ a: classes.link }}>\n        <HvOverflowTooltip data={item.label} />\n      </HvLink>\n    ) : (\n      <HvOverflowTooltip data={item.label} />\n    );\n  };\n\n  const renderSelectItem = (item: HvListValue, itemId?: string) => {\n    if (!useSelector) return renderItemText(item);\n\n    const Component = multiSelect ? HvCheckBox : HvRadio;\n\n    return (\n      <Component\n        id={setId(itemId, \"selector\")}\n        label={<HvOverflowTooltip data={item.label} />}\n        checked={item.selected || false}\n        disabled={item.disabled}\n        onChange={multiSelect ? (evt) => handleSelect(evt, item) : undefined}\n        classes={{\n          root: classes.selectorRoot,\n          container: classes.selectorContainer,\n          label: classes.truncate,\n        }}\n      />\n    );\n  };\n\n  const renderListItem = (item: HvListValue, i: number, otherProps = {}) => {\n    const itemId = setId(id, \"item\", i);\n    const selected = item.selected || false;\n\n    const startAdornment =\n      !useSelector && item.icon ? renderLeftIcon(item) : null;\n\n    return (\n      <HvListItem\n        key={i}\n        id={itemId}\n        role={itemRole}\n        disabled={item.disabled || undefined}\n        className={classes.item}\n        classes={{\n          selected: cx({\n            [classes.itemSelector]: useSelector || multiSelect,\n          }),\n        }}\n        selected={multiSelect || selected ? selected : undefined}\n        onClick={(evt) => handleSelect(evt, item)}\n        startAdornment={startAdornment}\n        endAdornment={\n          item.showNavIcon && (\n            <DropRightXS className={classes.box} iconSize=\"XS\" />\n          )\n        }\n        {...otherProps}\n      >\n        {renderSelectItem(item, itemId)}\n      </HvListItem>\n    );\n  };\n\n  const filteredList = list.filter((it) => !it.isHidden);\n  const anySelected = list\n    .map((item) => item.selected && !item.disabled)\n    .reduce((result, selected) => result || selected, false);\n\n  const selectedItemIndex = list.findIndex((item) => item.selected);\n  useEffect(() => {\n    if (selectedItemIndex >= 0 && listRef.current !== null) {\n      listRef.current.scrollToItem(selectedItemIndex);\n    }\n  }, [listRef, selectedItemIndex]);\n\n  const renderVirtualizedListItem = ({ index, style }) => {\n    const item = filteredList[index];\n    const tabIndex =\n      item.tabIndex ||\n      (!anySelected && index === 0) ||\n      (item.selected && !item.disabled)\n        ? 0\n        : -1;\n\n    return renderListItem(item, index, {\n      style: {\n        ...style,\n        top: `${parseFloat(style.top) + 5}px`,\n        left: `${parseFloat(style.left) + 5}px`,\n        width: `calc(${parseFloat(style.width)}% - 10px)`,\n      },\n      tabIndex,\n      interactive: true,\n      condensed,\n      disableGutters: useSelector,\n    });\n  };\n\n  const ariaMultiSelectable = (role === \"listbox\" && multiSelect) || undefined;\n\n  const ListContainer = useMemo(() => {\n    return forwardRef<HTMLUListElement, HvListContainerProps>(\n      ({ ...rest }, ref) => (\n        <HvListContainer\n          id={id}\n          className={cx(classes.root, className)}\n          role={role}\n          interactive\n          condensed={condensed}\n          disableGutters={useSelector}\n          aria-multiselectable={ariaMultiSelectable}\n          ref={ref}\n          {...rest}\n        />\n      ),\n    );\n  }, [\n    cx,\n    id,\n    useSelector,\n    className,\n    classes.root,\n    role,\n    condensed,\n    ariaMultiSelectable,\n  ]);\n\n  // Render nothing if there are no items\n  if (filteredList.length === 0) return null;\n\n  return (\n    <>\n      {multiSelect && useSelector && showSelectAll && renderSelectAll()}\n\n      {!virtualized ? (\n        <HvListContainer\n          id={id}\n          className={cx(classes.root, className)}\n          role={role}\n          interactive\n          condensed={condensed}\n          disableGutters={useSelector}\n          aria-multiselectable={ariaMultiSelectable}\n          {...others}\n        >\n          {filteredList.map((item, i) => renderListItem(item, i))}\n        </HvListContainer>\n      ) : (\n        <FixedSizeList\n          ref={listRef}\n          className={classes.virtualizedRoot}\n          height={(height || 0) + 5}\n          width=\"100%\"\n          itemCount={filteredList.length}\n          itemSize={condensed ? 32 : 40}\n          innerElementType={ListContainer}\n          {...others}\n        >\n          {renderVirtualizedListItem}\n        </FixedSizeList>\n      )}\n    </>\n  );\n};\n"],"names":["anySelected"],"mappings":"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"}
+{"version":3,"file":"List.js","sources":["../../../src/List/List.tsx"],"sourcesContent":["import {\n  AriaRole,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { FixedSizeList } from \"react-window\";\nimport { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvCheckBox } from \"../CheckBox\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvLink } from \"../Link\";\nimport {\n  HvListContainer,\n  HvListContainerProps,\n  HvListItem,\n} from \"../ListContainer\";\nimport { HvOverflowTooltip } from \"../OverflowTooltip\";\nimport { HvRadio } from \"../Radio\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./List.styles\";\nimport { HvListLabels, HvListValue } from \"./types\";\nimport { useSelectableList } from \"./useSelectableList\";\nimport { parseList } from \"./utils\";\n\nexport { staticClasses as listClasses };\n\nexport type HvListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListProps\n  extends HvBaseProps<HTMLUListElement, \"onChange\" | \"onClick\"> {\n  /**\n   * A list containing the elements to be rendered.\n   *\n   * - id: The id of the item.\n   * - label: The label of the element to be rendered.\n   * - selected: The selection state of the element.\n   * - disabled: The disabled state of the element.\n   * - isHidden: Is item visible.\n   * - icon: The icon.\n   * - showNavIcon: If true renders the navigation icon on the right.\n   * - path: The path to navigate to.\n   */\n  values: HvListValue[];\n  /** If true renders a multi select list. */\n  multiSelect?: boolean;\n  /**\n   * If true renders select all option for multi selection lists with selectors.\n   * note: It will only be rendered if multiSelect and useSelector props are set to true.\n   */\n  showSelectAll?: boolean;\n  /** An object containing all the labels for the dropdown. */\n  labels?: HvListLabels;\n  /** If true renders list items with radio or checkbox selectors. */\n  useSelector?: boolean;\n  /** Call back fired when list item is selected. Returns selection state. */\n  onChange?: (value: HvListValue[]) => void;\n  /** Call back fired when list item is selected. Returns selected item. */\n  onClick?: (\n    event:\n      | React.ChangeEvent<HTMLInputElement>\n      | React.MouseEvent<HTMLLIElement>,\n    value: HvListValue,\n  ) => void;\n  /** If `true` the list items will show the selection state. */\n  selectable?: boolean;\n  /** If `true`, selection can be toggled when single selection. */\n  singleSelectionToggle?: boolean;\n  /** If `true` the list will be rendered without vertical spacing. */\n  condensed?: boolean;\n  /** If `true` the dropdown will show tooltips when user mouseenter text in list. @deprecated this is always enabled */\n  hasTooltips?: boolean;\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  height?: number;\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  virtualized?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListClasses;\n}\n\nconst DEFAULT_LABELS = {\n  selectAll: \"Select All\",\n  selectionConjunction: \"/\",\n};\n\n/**\n * Component used to show a set of related data to the user.\n */\nexport const HvList = (props: HvListProps) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    multiSelect = false,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    hasTooltips = false,\n    showSelectAll = false,\n    labels = DEFAULT_LABELS,\n    useSelector = false,\n    selectable = true,\n    singleSelectionToggle = true,\n    condensed = false,\n    onChange,\n    onClick,\n    values: valuesProp = [],\n    height,\n    virtualized = false,\n    ...others\n  } = useDefaultProps(\"HvList\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [list, setList, selection] = useSelectableList(valuesProp);\n  const listRef = useRef<any>(null);\n\n  useEffect(() => {\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const parsedList: HvListValue[] = parseList(\n      undefined,\n      passedProps,\n      undefined,\n      valuesProp,\n    );\n\n    setList(parsedList);\n  }, [valuesProp, multiSelect, selectable, singleSelectionToggle, setList]);\n\n  const [role, itemRole] = useMemo<[AriaRole, AriaRole]>(() => {\n    // selectors are responsible for the role & selection state\n    if (selectable && useSelector) return [\"list\", \"listitem\"];\n\n    if (selectable) return [\"listbox\", \"option\"];\n    return [\"menu\", \"menuitem\"];\n  }, [selectable, useSelector]);\n\n  const handleSelect = (\n    evt: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLLIElement>,\n    item: HvListValue,\n  ) => {\n    if (!item.path) evt.preventDefault();\n    if (item.disabled) return;\n\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const parsedList = parseList(item, passedProps, undefined, list);\n    setList(parsedList);\n\n    onClick?.(evt, item);\n    onChange?.(parsedList);\n  };\n\n  const handleSelectAll = () => {\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const anySelectableSelected = list.some(\n      (elem) => elem.selected || elem.disabled,\n    );\n    const parsedList = parseList(\n      undefined,\n      passedProps,\n      !anySelectableSelected,\n      list,\n    );\n    setList(parsedList);\n\n    onChange?.(parsedList);\n  };\n\n  const renderLeftIcon = (item: HvListValue) => {\n    return isValidElement(item.icon)\n      ? item.icon\n      : typeof item.icon === \"function\"\n        ? item.icon?.({\n            isSelected: item.selected,\n            isDisabled: item.disabled,\n          })\n        : null;\n  };\n\n  const renderSelectAll = () => {\n    const { selectAll, selectionConjunction } = labels;\n\n    const anySelected = !!selection?.length;\n    const allSelected = selection.length === list.length;\n\n    const selectionLabel = (\n      <HvTypography component=\"span\">\n        {!anySelected ? (\n          <>\n            <b>{selectAll}</b>\n            {` (${list.length})`}\n          </>\n        ) : (\n          <>\n            <b>{selection.length}</b>\n            {`\\xa0${selectionConjunction}\\xa0`}\n            {list.length}\n          </>\n        )}\n      </HvTypography>\n    );\n\n    return (\n      <HvCheckBox\n        id={setId(id, \"select-all\")}\n        label={selectionLabel}\n        onChange={handleSelectAll}\n        className={classes.selectAllSelector}\n        indeterminate={anySelected && !allSelected}\n        checked={allSelected}\n      />\n    );\n  };\n\n  const renderItemText = (item: HvListValue) => {\n    return !multiSelect && item.path ? (\n      <HvLink route={item.path} classes={{ a: classes.link }}>\n        <HvOverflowTooltip data={item.label} />\n      </HvLink>\n    ) : (\n      <HvOverflowTooltip data={item.label} />\n    );\n  };\n\n  const renderSelectItem = (item: HvListValue, itemId?: string) => {\n    if (!useSelector) return renderItemText(item);\n\n    const Component = multiSelect ? HvCheckBox : HvRadio;\n\n    return (\n      <Component\n        id={setId(itemId, \"selector\")}\n        label={<HvOverflowTooltip data={item.label} />}\n        checked={item.selected || false}\n        disabled={item.disabled}\n        onChange={multiSelect ? (evt) => handleSelect(evt, item) : undefined}\n        classes={{\n          root: classes.selectorRoot,\n          container: classes.selectorContainer,\n          label: classes.truncate,\n        }}\n      />\n    );\n  };\n\n  const renderListItem = (item: HvListValue, i: number, otherProps = {}) => {\n    const itemId = setId(id, \"item\", i);\n    const selected = item.selected || false;\n\n    const startAdornment =\n      !useSelector && item.icon ? renderLeftIcon(item) : null;\n\n    return (\n      <HvListItem\n        key={i}\n        id={itemId}\n        role={itemRole}\n        disabled={item.disabled || undefined}\n        className={classes.item}\n        classes={{\n          selected: cx({\n            [classes.itemSelector]: useSelector || multiSelect,\n          }),\n        }}\n        selected={multiSelect || selected ? selected : undefined}\n        onClick={(evt) => handleSelect(evt, item)}\n        startAdornment={startAdornment}\n        endAdornment={\n          item.showNavIcon && (\n            <DropRightXS className={classes.box} iconSize=\"XS\" />\n          )\n        }\n        {...otherProps}\n      >\n        {renderSelectItem(item, itemId)}\n      </HvListItem>\n    );\n  };\n\n  const filteredList = list.filter((it) => !it.isHidden);\n  const anySelected = list\n    .map((item) => item.selected && !item.disabled)\n    .reduce((result, selected) => result || selected, false);\n\n  const selectedItemIndex = list.findIndex((item) => item.selected);\n  useEffect(() => {\n    if (selectedItemIndex >= 0 && listRef.current !== null) {\n      listRef.current.scrollToItem(selectedItemIndex);\n    }\n  }, [listRef, selectedItemIndex]);\n\n  const renderVirtualizedListItem = ({\n    index,\n    style,\n  }: {\n    index: number;\n    style: Record<string, any>;\n  }) => {\n    const item = filteredList[index];\n    const tabIndex =\n      item.tabIndex ||\n      (!anySelected && index === 0) ||\n      (item.selected && !item.disabled)\n        ? 0\n        : -1;\n\n    return renderListItem(item, index, {\n      style: {\n        ...style,\n        top: `${parseFloat(style.top) + 5}px`,\n        left: `${parseFloat(style.left) + 5}px`,\n        width: `calc(${parseFloat(style.width)}% - 10px)`,\n      },\n      tabIndex,\n      interactive: true,\n      condensed,\n      disableGutters: useSelector,\n    });\n  };\n\n  const ariaMultiSelectable = (role === \"listbox\" && multiSelect) || undefined;\n\n  const ListContainer = useMemo(() => {\n    return forwardRef<HTMLUListElement, HvListContainerProps>(\n      ({ ...rest }, ref) => (\n        <HvListContainer\n          id={id}\n          className={cx(classes.root, className)}\n          role={role}\n          interactive\n          condensed={condensed}\n          disableGutters={useSelector}\n          aria-multiselectable={ariaMultiSelectable}\n          ref={ref}\n          {...rest}\n        />\n      ),\n    );\n  }, [\n    cx,\n    id,\n    useSelector,\n    className,\n    classes.root,\n    role,\n    condensed,\n    ariaMultiSelectable,\n  ]);\n\n  // Render nothing if there are no items\n  if (filteredList.length === 0) return null;\n\n  return (\n    <>\n      {multiSelect && useSelector && showSelectAll && renderSelectAll()}\n\n      {!virtualized ? (\n        <HvListContainer\n          id={id}\n          className={cx(classes.root, className)}\n          role={role}\n          interactive\n          condensed={condensed}\n          disableGutters={useSelector}\n          aria-multiselectable={ariaMultiSelectable}\n          {...others}\n        >\n          {filteredList.map((item, i) => renderListItem(item, i))}\n        </HvListContainer>\n      ) : (\n        <FixedSizeList\n          ref={listRef}\n          className={classes.virtualizedRoot}\n          height={(height || 0) + 5}\n          width=\"100%\"\n          itemCount={filteredList.length}\n          itemSize={condensed ? 32 : 40}\n          innerElementType={ListContainer}\n          {...(others as any)}\n        >\n          {renderVirtualizedListItem}\n        </FixedSizeList>\n      )}\n    </>\n  );\n};\n"],"names":["anySelected"],"mappings":"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"}

package/dist/esm/List/utils.js

@@ -24,8 +24,7 @@ const parseList = (item, props, selectAll, list = []) => {
     }
     if (typeof selectAll === "boolean" && !elem?.disabled)
       newItem.selected = selectAll;
-    if (!newItem?.selected)
-      newItem.selected = false;
+    if (!newItem?.selected) newItem.selected = false;
     return newItem;
   });
   return newList;

package/dist/esm/List/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../src/List/utils.ts"],"sourcesContent":["import { HvListValue } from \"./types\";\n\nconst isItemSelected = (item: HvListValue, newItem: HvListValue) => {\n  const selectionKey = item?.id ? \"id\" : \"label\";\n  const selectionElement = item?.[selectionKey];\n  return newItem[selectionKey] === selectionElement;\n};\n\nconst checkIcons = (list: any[]) => 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\nexport { isItemSelected, parseList, parseState };\n"],"names":[],"mappings":"AAEM,MAAA,iBAAiB,CAAC,MAAmB,YAAyB;AAC5D,QAAA,eAAe,MAAM,KAAK,OAAO;AACjC,QAAA,mBAAmB,OAAO,YAAY;AACrC,SAAA,QAAQ,YAAY,MAAM;AACnC;AA2BA,MAAM,YAAY,CAChB,MACA,OAKA,WACA,OAAsB,CAAA,MACJ;AAClB,QAAM,EAAE,aAAa,YAAY,sBAAsB,IAAI,SAAS,CAAA;AAEpE,MAAI,cAAc;AAClB,QAAM,UAAU,KAAK,IAAI,CAAC,SAAc;AAChC,UAAA,UAAU,EAAE,GAAG;AAGrB,QAAI,CAAC,aAAa;AAChB,cAAQ,WAAW;AAAA,IACrB;AAEA,UAAM,aAAa,OAAO,eAAe,MAAM,OAAO,IAAI,MAAM;AAEhE,QAAI,cAAc,YAAY;AACxB,UAAA;AAEJ,UAAI,aAAa;AACE,yBAAA,OAAO,CAAC,MAAM,WAAW;AAAA,MAAA,OACrC;AACL,yBACE,CAAC,gBACA,QAAQ,wBAAwB,CAAC,MAAM,WAAW;AAAA,MACvD;AAEA,cAAQ,WAAW;AACL,oBAAA;AAAA,IAChB;AAEA,QAAI,OAAO,cAAc,aAAa,CAAC,MAAM;AAC3C,cAAQ,WAAW;AAGrB,QAAI,CAAC,SAAS;AAAU,cAAQ,WAAW;AAEpC,WAAA;AAAA,EAAA,CACR;AAEM,SAAA;AACT;"}
+{"version":3,"file":"utils.js","sources":["../../../src/List/utils.ts"],"sourcesContent":["import { HvListValue } from \"./types\";\n\nconst isItemSelected = (item: HvListValue, newItem: HvListValue) => {\n  const selectionKey = item?.id ? \"id\" : \"label\";\n  const selectionElement = item?.[selectionKey];\n  return newItem[selectionKey] === selectionElement;\n};\n\nconst checkIcons = (list: any[]) => 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\nexport { isItemSelected, parseList, parseState };\n"],"names":[],"mappings":"AAEM,MAAA,iBAAiB,CAAC,MAAmB,YAAyB;AAC5D,QAAA,eAAe,MAAM,KAAK,OAAO;AACjC,QAAA,mBAAmB,OAAO,YAAY;AACrC,SAAA,QAAQ,YAAY,MAAM;AACnC;AA2BA,MAAM,YAAY,CAChB,MACA,OAKA,WACA,OAAsB,CAAA,MACJ;AAClB,QAAM,EAAE,aAAa,YAAY,sBAAsB,IAAI,SAAS,CAAA;AAEpE,MAAI,cAAc;AAClB,QAAM,UAAU,KAAK,IAAI,CAAC,SAAc;AAChC,UAAA,UAAU,EAAE,GAAG;AAGrB,QAAI,CAAC,aAAa;AAChB,cAAQ,WAAW;AAAA,IACrB;AAEA,UAAM,aAAa,OAAO,eAAe,MAAM,OAAO,IAAI,MAAM;AAEhE,QAAI,cAAc,YAAY;AACxB,UAAA;AAEJ,UAAI,aAAa;AACE,yBAAA,OAAO,CAAC,MAAM,WAAW;AAAA,MAAA,OACrC;AACL,yBACE,CAAC,gBACA,QAAQ,wBAAwB,CAAC,MAAM,WAAW;AAAA,MACvD;AAEA,cAAQ,WAAW;AACL,oBAAA;AAAA,IAChB;AAEA,QAAI,OAAO,cAAc,aAAa,CAAC,MAAM;AAC3C,cAAQ,WAAW;AAGrB,QAAI,CAAC,SAAS,SAAU,SAAQ,WAAW;AAEpC,WAAA;AAAA,EAAA,CACR;AAEM,SAAA;AACT;"}

package/dist/esm/ListContainer/ListContainer.js

@@ -4,7 +4,7 @@ import { useDefaultProps } from "../hooks/useDefaultProps.js";
 import { useForkRef } from "../hooks/useForkRef.js";
 import { useClasses } from "./ListContainer.styles.js";
 import { staticClasses } from "./ListContainer.styles.js";
-import HvListContext from "./ListContext/ListContext.js";
+import ListContext from "./ListContext/ListContext.js";
 const HvListContainer = forwardRef((props, ref) => {
   const {
     id,
@@ -19,7 +19,7 @@ const HvListContainer = forwardRef((props, ref) => {
   } = useDefaultProps("HvListContainer", props);
   const { classes, cx } = useClasses(classesProp);
   const containerRef = useRef(null);
-  const { topContainerRef, nesting = -1 } = useContext(HvListContext);
+  const { topContainerRef, nesting = -1 } = useContext(ListContext);
   const listContext = useMemo(
     () => ({
       topContainerRef: topContainerRef || containerRef,
@@ -39,8 +39,7 @@ const HvListContainer = forwardRef((props, ref) => {
     ]
   );
   const children = useMemo(() => {
-    if (!interactive)
-      return childrenProp;
+    if (!interactive) return childrenProp;
     const anySelected = Children.toArray(childrenProp).some(
       (child) => isValidElement(child) && child.props.selected && !child.props.disabled
     );
@@ -53,7 +52,7 @@ const HvListContainer = forwardRef((props, ref) => {
     });
   }, [childrenProp, interactive]);
   const handleRef = useForkRef(ref, containerRef);
-  return /* @__PURE__ */ jsx(HvListContext.Provider, { value: listContext, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(ListContext.Provider, { value: listContext, children: /* @__PURE__ */ jsx(
     "ul",
     {
       ref: handleRef,

package/dist/esm/ListContainer/ListContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListContainer.js","sources":["../../../src/ListContainer/ListContainer.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useContext,\n  useMemo,\n  useRef,\n} from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useForkRef } from \"../hooks/useForkRef\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./ListContainer.styles\";\nimport HvListContext from \"./ListContext\";\n\nexport { staticClasses as listContainerClasses };\n\nexport type HvListContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListContainerProps extends 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 are _visually_ selectable. To enable selection, use `HvSelectionList` */\n  selectable?: 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 = forwardRef<\n  HTMLUListElement,\n  HvListContainerProps\n>((props, ref) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    interactive = false,\n    selectable,\n    condensed,\n    disableGutters,\n    children: childrenProp,\n    ...others\n  } = useDefaultProps(\"HvListContainer\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const containerRef = useRef(null);\n\n  const { topContainerRef, nesting = -1 } = useContext(HvListContext);\n\n  const listContext = useMemo(\n    () => ({\n      topContainerRef: topContainerRef || containerRef,\n      condensed,\n      selectable,\n      disableGutters,\n      interactive,\n      nesting: nesting + 1,\n    }),\n    [\n      condensed,\n      selectable,\n      disableGutters,\n      interactive,\n      nesting,\n      topContainerRef,\n    ],\n  );\n\n  const children = useMemo(() => {\n    if (!interactive) return childrenProp;\n\n    const anySelected = Children.toArray(childrenProp).some(\n      (child) =>\n        isValidElement(child) && child.props.selected && !child.props.disabled,\n    );\n\n    return Children.map(childrenProp, (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 cloneElement(child, {\n        tabIndex,\n        interactive,\n      });\n    });\n  }, [childrenProp, interactive]);\n\n  const handleRef = useForkRef(ref, containerRef);\n\n  return (\n    <HvListContext.Provider value={listContext}>\n      <ul\n        ref={handleRef}\n        id={id}\n        className={cx(classes.root, className)}\n        {...others}\n      >\n        {children}\n      </ul>\n    </HvListContext.Provider>\n  );\n});\n"],"names":[],"mappings":";;;;;;;AA0CO,MAAM,kBAAkB,WAG7B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,GAAG;AAAA,EAAA,IACD,gBAAgB,mBAAmB,KAAK;AAE5C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,eAAe,OAAO,IAAI;AAEhC,QAAM,EAAE,iBAAiB,UAAU,GAAG,IAAI,WAAW,aAAa;AAElE,QAAM,cAAc;AAAA,IAClB,OAAO;AAAA,MACL,iBAAiB,mBAAmB;AAAA,MACpC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,UAAU;AAAA,IAAA;AAAA,IAErB;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAGI,QAAA,WAAW,QAAQ,MAAM;AAC7B,QAAI,CAAC;AAAoB,aAAA;AAEzB,UAAM,cAAc,SAAS,QAAQ,YAAY,EAAE;AAAA,MACjD,CAAC,UACC,eAAe,KAAK,KAAK,MAAM,MAAM,YAAY,CAAC,MAAM,MAAM;AAAA,IAAA;AAGlE,WAAO,SAAS,IAAI,cAAc,CAAC,OAAY,MAAM;AACnD,YAAM,WACJ,MAAM,MAAM,YACX,CAAC,eAAe,MAAM,KACtB,MAAM,MAAM,YAAY,CAAC,MAAM,MAAM,WAClC,IACA;AAEN,aAAO,aAAa,OAAO;AAAA,QACzB;AAAA,QACA;AAAA,MAAA,CACD;AAAA,IAAA,CACF;AAAA,EAAA,GACA,CAAC,cAAc,WAAW,CAAC;AAExB,QAAA,YAAY,WAAW,KAAK,YAAY;AAE9C,SACG,oBAAA,cAAc,UAAd,EAAuB,OAAO,aAC7B,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACpC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAEL,EAAA,CAAA;AAEJ,CAAC;"}
+{"version":3,"file":"ListContainer.js","sources":["../../../src/ListContainer/ListContainer.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useContext,\n  useMemo,\n  useRef,\n} from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useForkRef } from \"../hooks/useForkRef\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./ListContainer.styles\";\nimport HvListContext from \"./ListContext\";\n\nexport { staticClasses as listContainerClasses };\n\nexport type HvListContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListContainerProps extends 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 are _visually_ selectable. To enable selection, use `HvSelectionList` */\n  selectable?: 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 = forwardRef<\n  HTMLUListElement,\n  HvListContainerProps\n>((props, ref) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    interactive = false,\n    selectable,\n    condensed,\n    disableGutters,\n    children: childrenProp,\n    ...others\n  } = useDefaultProps(\"HvListContainer\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const containerRef = useRef(null);\n\n  const { topContainerRef, nesting = -1 } = useContext(HvListContext);\n\n  const listContext = useMemo(\n    () => ({\n      topContainerRef: topContainerRef || containerRef,\n      condensed,\n      selectable,\n      disableGutters,\n      interactive,\n      nesting: nesting + 1,\n    }),\n    [\n      condensed,\n      selectable,\n      disableGutters,\n      interactive,\n      nesting,\n      topContainerRef,\n    ],\n  );\n\n  const children = useMemo(() => {\n    if (!interactive) return childrenProp;\n\n    const anySelected = Children.toArray(childrenProp).some(\n      (child) =>\n        isValidElement(child) && child.props.selected && !child.props.disabled,\n    );\n\n    return Children.map(childrenProp, (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 cloneElement(child, {\n        tabIndex,\n        interactive,\n      });\n    });\n  }, [childrenProp, interactive]);\n\n  const handleRef = useForkRef(ref, containerRef);\n\n  return (\n    <HvListContext.Provider value={listContext}>\n      <ul\n        ref={handleRef}\n        id={id}\n        className={cx(classes.root, className)}\n        {...others}\n      >\n        {children}\n      </ul>\n    </HvListContext.Provider>\n  );\n});\n"],"names":["HvListContext"],"mappings":";;;;;;;AA0CO,MAAM,kBAAkB,WAG7B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,GAAG;AAAA,EAAA,IACD,gBAAgB,mBAAmB,KAAK;AAE5C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,eAAe,OAAO,IAAI;AAEhC,QAAM,EAAE,iBAAiB,UAAU,GAAG,IAAI,WAAWA,WAAa;AAElE,QAAM,cAAc;AAAA,IAClB,OAAO;AAAA,MACL,iBAAiB,mBAAmB;AAAA,MACpC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,UAAU;AAAA,IAAA;AAAA,IAErB;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAGI,QAAA,WAAW,QAAQ,MAAM;AACzB,QAAA,CAAC,YAAoB,QAAA;AAEzB,UAAM,cAAc,SAAS,QAAQ,YAAY,EAAE;AAAA,MACjD,CAAC,UACC,eAAe,KAAK,KAAK,MAAM,MAAM,YAAY,CAAC,MAAM,MAAM;AAAA,IAAA;AAGlE,WAAO,SAAS,IAAI,cAAc,CAAC,OAAY,MAAM;AACnD,YAAM,WACJ,MAAM,MAAM,YACX,CAAC,eAAe,MAAM,KACtB,MAAM,MAAM,YAAY,CAAC,MAAM,MAAM,WAClC,IACA;AAEN,aAAO,aAAa,OAAO;AAAA,QACzB;AAAA,QACA;AAAA,MAAA,CACD;AAAA,IAAA,CACF;AAAA,EAAA,GACA,CAAC,cAAc,WAAW,CAAC;AAExB,QAAA,YAAY,WAAW,KAAK,YAAY;AAE9C,SACG,oBAAAA,YAAc,UAAd,EAAuB,OAAO,aAC7B,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACpC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAEL,EAAA,CAAA;AAEJ,CAAC;"}

package/dist/esm/ListContainer/ListContext/ListContext.js

@@ -1,7 +1,6 @@
 import React__default from "react";
 const ListContext = React__default.createContext({});
 ListContext.displayName = "ListContext";
-const HvListContext = ListContext;
 export {
-  HvListContext as default
+  ListContext as default
 };

package/dist/esm/ListContainer/ListContext/ListContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListContext.js","sources":["../../../../src/ListContainer/ListContext/ListContext.ts"],"sourcesContent":["import React from \"react\";\n\nconst ListContext = React.createContext<{\n  interactive?: boolean;\n  nesting?: number;\n  condensed?: boolean;\n  selectable?: boolean;\n  disableGutters?: boolean;\n  topContainerRef?: React.MutableRefObject<HTMLUListElement | null>;\n}>({});\n\nListContext.displayName = \"ListContext\";\n\nexport default ListContext;\n"],"names":["React"],"mappings":";AAEA,MAAM,cAAcA,eAAM,cAOvB,CAAA,CAAE;AAEL,YAAY,cAAc;AAE1B,MAAA,gBAAe;"}
+{"version":3,"file":"ListContext.js","sources":["../../../../src/ListContainer/ListContext/ListContext.ts"],"sourcesContent":["import React from \"react\";\n\nconst ListContext = React.createContext<{\n  interactive?: boolean;\n  nesting?: number;\n  condensed?: boolean;\n  selectable?: boolean;\n  disableGutters?: boolean;\n  topContainerRef?: React.MutableRefObject<HTMLUListElement | null>;\n}>({});\n\nListContext.displayName = \"ListContext\";\n\nexport default ListContext;\n"],"names":["React"],"mappings":";AAEA,MAAM,cAAcA,eAAM,cAOvB,EAAE;AAEL,YAAY,cAAc;"}

package/dist/esm/ListContainer/ListItem/ListItem.js

@@ -3,11 +3,10 @@ import { forwardRef, useContext, useCallback, useMemo, isValidElement, cloneElem
 import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { useClasses } from "./ListItem.styles.js";
 import { staticClasses } from "./ListItem.styles.js";
-import HvListContext from "../ListContext/ListContext.js";
+import ListContext from "../ListContext/ListContext.js";
 import { HvFocus } from "../../Focus/Focus.js";
 const applyClassNameAndStateToElement = (element, selected, disabled, onClick, className) => {
-  if (element == null)
-    return null;
+  if (element == null) return null;
   return cloneElement(element, {
     className,
     checked: !!selected,
@@ -16,8 +15,7 @@ const applyClassNameAndStateToElement = (element, selected, disabled, onClick, c
   });
 };
 const applyClassNameToElement = (element, className) => {
-  if (element == null)
-    return null;
+  if (element == null) return null;
   return cloneElement(element, {
     className
   });
@@ -48,15 +46,14 @@ const HvListItem = forwardRef((props, ref) => {
     disableGutters: disableGuttersContext,
     interactive: interactiveContext,
     selectable: selectableContext
-  } = useContext(HvListContext);
+  } = useContext(ListContext);
   const condensed = condensedProp ?? condensedContext;
   const disableGutters = disableGuttersProp ?? disableGuttersContext;
   const interactive = interactiveProp ?? interactiveContext;
   const selectable = selectableProp ?? selectableContext;
   const handleClick = useCallback(
     (evt) => {
-      if (disabled)
-        return;
+      if (disabled) return;
       onClick?.(evt);
     },
     [disabled, onClick]

package/dist/esm/ListContainer/ListItem/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sources":["../../../../src/ListContainer/ListItem/ListItem.tsx"],"sourcesContent":["import {\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useContext,\n  useMemo,\n} from \"react\";\n\nimport { HvFocus } from \"../../Focus\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport HvListContext from \"../ListContext\";\nimport { staticClasses, useClasses } from \"./ListItem.styles\";\n\nexport { staticClasses as listItemClasses };\n\nexport type HvListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListItemProps extends HvBaseProps<HTMLLIElement> {\n  /** Indicates if the list item is selected. */\n  selected?: boolean;\n  /** Indicated if the list item is _visually_ selectable */\n  selectable?: boolean;\n  /** If true, the list item will be disabled. */\n  disabled?: boolean;\n  /**\n   * If the list item is focusable and reacts to mouse over events.\n   * Defaults to true if the container list is interactive, false otherwise.\n   */\n  interactive?: boolean;\n  /**\n   * If `true` compacts the vertical spacing intended to separate the list items.\n   * Defaults to the value set in container list.\n   */\n  condensed?: boolean;\n  /**\n   * If `true`, the left and right padding is removed.\n   * Defaults to the value set in container list.\n   */\n  disableGutters?: boolean;\n  /**\n   * Element placed before the children.\n   * Also removes the left padding (gutter).\n   *\n   * Some modifications are applied, assuming that it is either an icon (changing the color when the item is disabled)\n   * or a selector (preventing the double focus ring, propagating the checked and disabled states and wiring the onChange event).\n   * If unwanted, the element should be placed directly as a child.\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Element placed after the children and aligned next to the margin.\n   * Also removes the right padding (gutter).\n   *\n   * Some modifications are applied, assuming that it is an icon (changing the color when the item is disabled).\n   * If unwanted, the element should be placed directly as a child.\n   */\n  endAdornment?: React.ReactNode;\n  /** The value to be set on the 'li' element */\n  value?: any;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListItemClasses;\n}\n\nconst applyClassNameAndStateToElement = (\n  element: any,\n  selected: boolean | undefined,\n  disabled: boolean | undefined,\n  onClick: React.MouseEventHandler<HTMLLIElement>,\n  className?: string,\n) => {\n  if (element == null) return null;\n\n  return cloneElement(element, {\n    className,\n    checked: !!selected,\n    disabled,\n    onChange: onClick,\n  });\n};\n\nconst applyClassNameToElement = (element, className?: string) => {\n  if (element == null) return null;\n\n  return cloneElement(element, {\n    className,\n  });\n};\n\n/**\n * ListItem description/documentation paragraph\n */\nexport const HvListItem = forwardRef<any, HvListItemProps>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    role,\n    value,\n    selected,\n    disabled,\n    selectable: selectableProp,\n    interactive: interactiveProp,\n    condensed: condensedProp,\n    disableGutters: disableGuttersProp,\n    startAdornment,\n    endAdornment,\n    onClick,\n    children,\n    tabIndex,\n    ...others\n  } = useDefaultProps(\"HvListItem\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const {\n    topContainerRef,\n    condensed: condensedContext,\n    disableGutters: disableGuttersContext,\n    interactive: interactiveContext,\n    selectable: selectableContext,\n  } = useContext(HvListContext);\n\n  const condensed = condensedProp ?? condensedContext;\n  const disableGutters = disableGuttersProp ?? disableGuttersContext;\n  const interactive = interactiveProp ?? interactiveContext;\n  const selectable = selectableProp ?? selectableContext;\n\n  const handleClick = useCallback<React.MouseEventHandler<HTMLLIElement>>(\n    (evt) => {\n      if (disabled) return;\n      onClick?.(evt);\n    },\n    [disabled, onClick],\n  );\n\n  const clonedStartAdornment = useMemo(\n    () =>\n      applyClassNameAndStateToElement(\n        startAdornment,\n        selected,\n        disabled,\n        handleClick,\n        cx(\n          classes.startAdornment,\n          { [classes.disabled]: disabled },\n          isValidElement(startAdornment)\n            ? startAdornment.props.className\n            : undefined,\n        ),\n      ),\n    [\n      cx,\n      classes?.startAdornment,\n      classes?.disabled,\n      disabled,\n      handleClick,\n      selected,\n      startAdornment,\n    ],\n  );\n  const clonedEndAdornment = useMemo(\n    () =>\n      applyClassNameToElement(\n        endAdornment,\n        cx(\n          classes.endAdornment,\n          { [classes.disabled]: disabled },\n          isValidElement(endAdornment)\n            ? endAdornment.props.className\n            : undefined,\n        ),\n      ),\n    [cx, classes?.endAdornment, classes?.disabled, disabled, endAdornment],\n  );\n\n  const roleOptionAriaProps =\n    role === \"option\" || role === \"menuitem\"\n      ? {\n          \"aria-disabled\": disabled || undefined,\n          \"aria-selected\": selected,\n        }\n      : {};\n\n  const listItem = (\n    // For later: this should only have an onClick event if interactive and has the appropriate role.\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events\n    <li\n      ref={ref}\n      role={role}\n      value={value}\n      className={cx(\n        classes.root,\n        {\n          [classes.gutters]: !disableGutters,\n          [classes.condensed]: condensed,\n          [classes.interactive]: interactive || selectable,\n          [classes.selected]: selected || props[\"aria-selected\"],\n          [classes.disabled]: disabled || props[\"aria-disabled\"],\n          [classes.withStartAdornment]: startAdornment != null,\n          [classes.withEndAdornment]: endAdornment != null,\n        },\n        className,\n      )}\n      tabIndex={interactive ? undefined : tabIndex}\n      onClick={handleClick}\n      {...roleOptionAriaProps}\n      {...others}\n    >\n      {clonedStartAdornment}\n      {children}\n      {clonedEndAdornment}\n    </li>\n  );\n\n  return interactive ? (\n    <HvFocus\n      rootRef={topContainerRef}\n      selected={selected}\n      disabledClass={disabled || undefined}\n      strategy={role === \"option\" ? \"listbox\" : \"menu\"}\n      classes={{ focus: classes.focus }}\n      configuration={{\n        tabIndex,\n      }}\n    >\n      {listItem}\n    </HvFocus>\n  ) : (\n    listItem\n  );\n});\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ListItem.js","sources":["../../../../src/ListContainer/ListItem/ListItem.tsx"],"sourcesContent":["import {\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  ReactElement,\n  useCallback,\n  useContext,\n  useMemo,\n} from \"react\";\n\nimport { HvFocus } from \"../../Focus\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport HvListContext from \"../ListContext\";\nimport { staticClasses, useClasses } from \"./ListItem.styles\";\n\nexport { staticClasses as listItemClasses };\n\nexport type HvListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListItemProps extends HvBaseProps<HTMLLIElement> {\n  /** Indicates if the list item is selected. */\n  selected?: boolean;\n  /** Indicated if the list item is _visually_ selectable */\n  selectable?: boolean;\n  /** If true, the list item will be disabled. */\n  disabled?: boolean;\n  /**\n   * If the list item is focusable and reacts to mouse over events.\n   * Defaults to true if the container list is interactive, false otherwise.\n   */\n  interactive?: boolean;\n  /**\n   * If `true` compacts the vertical spacing intended to separate the list items.\n   * Defaults to the value set in container list.\n   */\n  condensed?: boolean;\n  /**\n   * If `true`, the left and right padding is removed.\n   * Defaults to the value set in container list.\n   */\n  disableGutters?: boolean;\n  /**\n   * Element placed before the children.\n   * Also removes the left padding (gutter).\n   *\n   * Some modifications are applied, assuming that it is either an icon (changing the color when the item is disabled)\n   * or a selector (preventing the double focus ring, propagating the checked and disabled states and wiring the onChange event).\n   * If unwanted, the element should be placed directly as a child.\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Element placed after the children and aligned next to the margin.\n   * Also removes the right padding (gutter).\n   *\n   * Some modifications are applied, assuming that it is an icon (changing the color when the item is disabled).\n   * If unwanted, the element should be placed directly as a child.\n   */\n  endAdornment?: React.ReactNode;\n  /** The value to be set on the 'li' element */\n  value?: any;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListItemClasses;\n}\n\nconst applyClassNameAndStateToElement = (\n  element: React.ReactNode,\n  selected: boolean | undefined,\n  disabled: boolean | undefined,\n  onClick: React.MouseEventHandler<HTMLLIElement>,\n  className?: string,\n) => {\n  if (element == null) return null;\n\n  return cloneElement(element as ReactElement, {\n    className,\n    checked: !!selected,\n    disabled,\n    onChange: onClick,\n  });\n};\n\nconst applyClassNameToElement = (\n  element: React.ReactNode,\n  className?: string,\n) => {\n  if (element == null) return null;\n\n  return cloneElement(element as ReactElement, {\n    className,\n  });\n};\n\n/**\n * ListItem description/documentation paragraph\n */\nexport const HvListItem = forwardRef<any, HvListItemProps>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    role,\n    value,\n    selected,\n    disabled,\n    selectable: selectableProp,\n    interactive: interactiveProp,\n    condensed: condensedProp,\n    disableGutters: disableGuttersProp,\n    startAdornment,\n    endAdornment,\n    onClick,\n    children,\n    tabIndex,\n    ...others\n  } = useDefaultProps(\"HvListItem\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const {\n    topContainerRef,\n    condensed: condensedContext,\n    disableGutters: disableGuttersContext,\n    interactive: interactiveContext,\n    selectable: selectableContext,\n  } = useContext(HvListContext);\n\n  const condensed = condensedProp ?? condensedContext;\n  const disableGutters = disableGuttersProp ?? disableGuttersContext;\n  const interactive = interactiveProp ?? interactiveContext;\n  const selectable = selectableProp ?? selectableContext;\n\n  const handleClick = useCallback<React.MouseEventHandler<HTMLLIElement>>(\n    (evt) => {\n      if (disabled) return;\n      onClick?.(evt);\n    },\n    [disabled, onClick],\n  );\n\n  const clonedStartAdornment = useMemo(\n    () =>\n      applyClassNameAndStateToElement(\n        startAdornment,\n        selected,\n        disabled,\n        handleClick,\n        cx(\n          classes.startAdornment,\n          { [classes.disabled]: disabled },\n          isValidElement(startAdornment)\n            ? startAdornment.props.className\n            : undefined,\n        ),\n      ),\n    [\n      cx,\n      classes?.startAdornment,\n      classes?.disabled,\n      disabled,\n      handleClick,\n      selected,\n      startAdornment,\n    ],\n  );\n  const clonedEndAdornment = useMemo(\n    () =>\n      applyClassNameToElement(\n        endAdornment,\n        cx(\n          classes.endAdornment,\n          { [classes.disabled]: disabled },\n          isValidElement(endAdornment)\n            ? endAdornment.props.className\n            : undefined,\n        ),\n      ),\n    [cx, classes?.endAdornment, classes?.disabled, disabled, endAdornment],\n  );\n\n  const roleOptionAriaProps =\n    role === \"option\" || role === \"menuitem\"\n      ? {\n          \"aria-disabled\": disabled || undefined,\n          \"aria-selected\": selected,\n        }\n      : {};\n\n  const listItem = (\n    // For later: this should only have an onClick event if interactive and has the appropriate role.\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events\n    <li\n      ref={ref}\n      role={role}\n      value={value}\n      className={cx(\n        classes.root,\n        {\n          [classes.gutters]: !disableGutters,\n          [classes.condensed]: condensed,\n          [classes.interactive]: interactive || selectable,\n          [classes.selected]: selected || props[\"aria-selected\"],\n          [classes.disabled]: disabled || props[\"aria-disabled\"],\n          [classes.withStartAdornment]: startAdornment != null,\n          [classes.withEndAdornment]: endAdornment != null,\n        },\n        className,\n      )}\n      tabIndex={interactive ? undefined : tabIndex}\n      onClick={handleClick}\n      {...roleOptionAriaProps}\n      {...others}\n    >\n      {clonedStartAdornment}\n      {children}\n      {clonedEndAdornment}\n    </li>\n  );\n\n  return interactive ? (\n    <HvFocus\n      rootRef={topContainerRef}\n      selected={selected}\n      disabledClass={disabled || undefined}\n      strategy={role === \"option\" ? \"listbox\" : \"menu\"}\n      classes={{ focus: classes.focus }}\n      configuration={{\n        tabIndex,\n      }}\n    >\n      {listItem}\n    </HvFocus>\n  ) : (\n    listItem\n  );\n});\n"],"names":["HvListContext"],"mappings":"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"}

package/dist/esm/Loading/Loading.js.map

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

package/dist/esm/LoadingContainer/LoadingContainer.js

@@ -11,11 +11,12 @@ const HvLoadingContainer = (props) => {
     hidden,
     small,
     label,
-    "aria-label": ariaLabel = label || "Loading",
+    "aria-label": ariaLabelProp,
     opacity,
     ...others
   } = useDefaultProps("HvLoadingContainer", props);
   const { classes, cx } = useClasses(classesProp);
+  const ariaLabel = ariaLabelProp || typeof label === "string" && label ? label : "Loading";
   return /* @__PURE__ */ jsxs("div", { className: cx(classes.root, className), ...others, children: [
     /* @__PURE__ */ jsx(
       HvLoading,

package/dist/esm/LoadingContainer/LoadingContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingContainer.js","sources":["../../../src/LoadingContainer/LoadingContainer.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvLoading, HvLoadingProps } from \"../Loading\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./LoadingContainer.styles\";\n\nexport { staticClasses as loadingContainerClasses };\n\nexport type HvLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingContainerProps\n  extends HvBaseProps<HTMLDivElement>,\n    Pick<HvLoadingProps, \"label\" | \"small\" | \"hidden\"> {\n  opacity?: number;\n  classes?: HvLoadingContainerClasses;\n}\n\n/**\n * A component that wraps `children` with an `HvLoading` component and\n * and an overlay background with opacity.\n *\n * @example\n * <HvLoadingContainer label=\"Loading...\" hidden={!isLoading}>\n *  <MyComponent>\n * </HvLoadingContainer>\n * */\nexport const HvLoadingContainer = (props: HvLoadingContainerProps) => {\n  const {\n    children,\n    className,\n    classes: classesProp,\n    hidden,\n    small,\n    label,\n    \"aria-label\": ariaLabel = label || \"Loading\",\n    opacity,\n    ...others\n  } = useDefaultProps(\"HvLoadingContainer\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      <HvLoading\n        className={classes.loading}\n        role=\"progressbar\"\n        small={small}\n        label={label}\n        hidden={hidden}\n        aria-label={ariaLabel}\n        style={opacity ? { [\"--opacity\" as string]: opacity } : undefined}\n      />\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;AA0Ba,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc,YAAY,SAAS;AAAA,IACnC;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,sBAAsB,KAAK;AAC/C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA,qBAAC,SAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,MAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,OAAO,UAAU,EAAE,CAAC,WAAqB,GAAG,YAAY;AAAA,MAAA;AAAA,IAC1D;AAAA,IACC;AAAA,EACH,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"LoadingContainer.js","sources":["../../../src/LoadingContainer/LoadingContainer.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvLoading, HvLoadingProps } from \"../Loading\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./LoadingContainer.styles\";\n\nexport { staticClasses as loadingContainerClasses };\n\nexport type HvLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingContainerProps\n  extends HvBaseProps<HTMLDivElement>,\n    Pick<HvLoadingProps, \"label\" | \"small\" | \"hidden\"> {\n  opacity?: number;\n  classes?: HvLoadingContainerClasses;\n}\n\n/**\n * A component that wraps `children` with an `HvLoading` component and\n * and an overlay background with opacity.\n *\n * @example\n * <HvLoadingContainer label=\"Loading...\" hidden={!isLoading}>\n *  <MyComponent>\n * </HvLoadingContainer>\n * */\nexport const HvLoadingContainer = (props: HvLoadingContainerProps) => {\n  const {\n    children,\n    className,\n    classes: classesProp,\n    hidden,\n    small,\n    label,\n    \"aria-label\": ariaLabelProp,\n    opacity,\n    ...others\n  } = useDefaultProps(\"HvLoadingContainer\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  const ariaLabel =\n    ariaLabelProp || (typeof label === \"string\" && label)\n      ? (label as string)\n      : \"Loading\";\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      <HvLoading\n        className={classes.loading}\n        role=\"progressbar\"\n        small={small}\n        label={label}\n        hidden={hidden}\n        aria-label={ariaLabel}\n        style={opacity ? { [\"--opacity\" as string]: opacity } : undefined}\n      />\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;AA0Ba,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,sBAAsB,KAAK;AAC/C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,YACJ,iBAAkB,OAAO,UAAU,YAAY,QAC1C,QACD;AAGJ,SAAA,qBAAC,SAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,MAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,OAAO,UAAU,EAAE,CAAC,WAAqB,GAAG,YAAY;AAAA,MAAA;AAAA,IAC1D;AAAA,IACC;AAAA,EACH,EAAA,CAAA;AAEJ;"}

package/dist/esm/MultiButton/MultiButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiButton.js","sources":["../../../src/MultiButton/MultiButton.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  Fragment,\n  isValidElement,\n  ReactElement,\n  useMemo,\n} from \"react\";\n\nimport { HvButtonSize, HvButtonVariant } from \"../Button\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport {\n  getSplitContainerColor,\n  getSplitContainerHeight,\n  staticClasses,\n  useClasses,\n} from \"./MultiButton.styles\";\n\nexport { staticClasses as multiButtonClasses };\nexport type HvMultiButtonClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvMultiButtonProps extends HvBaseProps {\n  /** If all the buttons are disabled. */\n  disabled?: boolean;\n  /** If the MultiButton is to be displayed vertically. */\n  vertical?: boolean;\n  /** Category of button to use */\n  variant?: HvButtonVariant;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvMultiButtonClasses;\n  /** Button size. */\n  size?: HvButtonSize;\n  /** Add a split between buttons */\n  split?: boolean;\n}\n\nexport const HvMultiButton = (props: HvMultiButtonProps) => {\n  const {\n    id,\n    className,\n    children,\n    classes: classesProp,\n    disabled = false,\n    vertical = false,\n    variant = \"secondarySubtle\",\n    size,\n    split,\n    ...others\n  } = useDefaultProps(\"HvMultiButton\", props);\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const [color, type] = useMemo(() => {\n    const result = variant.split(/(?=[A-Z])/);\n    if (\n      result[0] === \"ghost\" ||\n      result[0] === \"semantic\" ||\n      (result[0] === \"secondary\" && !result[1])\n    )\n      return [];\n    return result.map((x) => x.toLowerCase());\n  }, [variant]);\n\n  // Filter children: remove invalid and undefined/null\n  const buttons = useMemo(() => {\n    const btns: ReactElement[] = [];\n    Children.forEach(children, (child) => {\n      if (child && isValidElement(child)) {\n        btns.push(child);\n      }\n    });\n    return btns;\n  }, [children]);\n\n  return (\n    <div\n      id={id}\n      className={cx(\n        classes.root,\n        {\n          [classes.multiple]: !split,\n          [classes.vertical]: vertical,\n          [classes[variant]]: variant, // TODO - remove in v6\n          [classes.splitGroup]: split,\n          [classes.splitGroupDisabled]: split && disabled,\n        },\n        className,\n      )}\n      {...others}\n    >\n      {buttons.map((child, index) => {\n        const childIsSelected = !!child.props.selected;\n        const btnKey = setId([id, index]);\n        return (\n          <Fragment key={btnKey}>\n            {cloneElement(child, {\n              variant,\n              disabled: disabled || child.props.disabled,\n              size,\n              className: cx(child.props.className, classes.button, {\n                [classes.firstButton]: index === 0,\n                [classes.lastButton]: index === buttons.length - 1,\n                [classes.selected]: childIsSelected,\n              }),\n            })}\n            {split && index < buttons.length - 1 && (\n              <div\n                className={cx(\n                  classes.splitContainer,\n                  color && css(getSplitContainerColor(color, type, disabled)),\n                  size && css(getSplitContainerHeight(size)),\n                  {\n                    [classes.splitDisabled]: disabled,\n                  },\n                  classes[variant], // TODO - remove in v6\n                )}\n              >\n                <div className={classes.split} />\n              </div>\n            )}\n          </Fragment>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAuCa,MAAA,gBAAgB,CAAC,UAA8B;AACpD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,iBAAiB,KAAK;AAC1C,QAAM,EAAE,SAAS,IAAI,IAAI,IAAI,WAAW,WAAW;AAEnD,QAAM,CAAC,OAAO,IAAI,IAAI,QAAQ,MAAM;AAC5B,UAAA,SAAS,QAAQ,MAAM,WAAW;AACxC,QACE,OAAO,CAAC,MAAM,WACd,OAAO,CAAC,MAAM,cACb,OAAO,CAAC,MAAM,eAAe,CAAC,OAAO,CAAC;AAEvC,aAAO;AACT,WAAO,OAAO,IAAI,CAAC,MAAM,EAAE,aAAa;AAAA,EAAA,GACvC,CAAC,OAAO,CAAC;AAGN,QAAA,UAAU,QAAQ,MAAM;AAC5B,UAAM,OAAuB,CAAA;AACpB,aAAA,QAAQ,UAAU,CAAC,UAAU;AAChC,UAAA,SAAS,eAAe,KAAK,GAAG;AAClC,aAAK,KAAK,KAAK;AAAA,MACjB;AAAA,IAAA,CACD;AACM,WAAA;AAAA,EAAA,GACN,CAAC,QAAQ,CAAC;AAGX,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,QAAQ,GAAG,CAAC;AAAA,UACrB,CAAC,QAAQ,QAAQ,GAAG;AAAA,UACpB,CAAC,QAAQ,OAAO,CAAC,GAAG;AAAA;AAAA,UACpB,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,kBAAkB,GAAG,SAAS;AAAA,QACzC;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,UAAQ,QAAA,IAAI,CAAC,OAAO,UAAU;AAC7B,cAAM,kBAAkB,CAAC,CAAC,MAAM,MAAM;AACtC,cAAM,SAAS,MAAM,CAAC,IAAI,KAAK,CAAC;AAChC,oCACG,UACE,EAAA,UAAA;AAAA,UAAA,aAAa,OAAO;AAAA,YACnB;AAAA,YACA,UAAU,YAAY,MAAM,MAAM;AAAA,YAClC;AAAA,YACA,WAAW,GAAG,MAAM,MAAM,WAAW,QAAQ,QAAQ;AAAA,cACnD,CAAC,QAAQ,WAAW,GAAG,UAAU;AAAA,cACjC,CAAC,QAAQ,UAAU,GAAG,UAAU,QAAQ,SAAS;AAAA,cACjD,CAAC,QAAQ,QAAQ,GAAG;AAAA,YAAA,CACrB;AAAA,UAAA,CACF;AAAA,UACA,SAAS,QAAQ,QAAQ,SAAS,KACjC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW;AAAA,gBACT,QAAQ;AAAA,gBACR,SAAS,IAAI,uBAAuB,OAAO,MAAM,QAAQ,CAAC;AAAA,gBAC1D,QAAQ,IAAI,wBAAwB,IAAI,CAAC;AAAA,gBACzC;AAAA,kBACE,CAAC,QAAQ,aAAa,GAAG;AAAA,gBAC3B;AAAA,gBACA,QAAQ,OAAO;AAAA;AAAA,cACjB;AAAA,cAEA,UAAC,oBAAA,OAAA,EAAI,WAAW,QAAQ,OAAO;AAAA,YAAA;AAAA,UACjC;AAAA,QAAA,EAAA,GAxBW,MA0Bf;AAAA,MAAA,CAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"MultiButton.js","sources":["../../../src/MultiButton/MultiButton.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  Fragment,\n  isValidElement,\n  ReactElement,\n  useMemo,\n} from \"react\";\n\nimport { HvButtonSize, HvButtonVariant } from \"../Button\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport {\n  getSplitContainerColor,\n  getSplitContainerHeight,\n  staticClasses,\n  useClasses,\n} from \"./MultiButton.styles\";\n\nexport { staticClasses as multiButtonClasses };\nexport type HvMultiButtonClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvMultiButtonProps extends HvBaseProps {\n  /** If all the buttons are disabled. */\n  disabled?: boolean;\n  /** If the MultiButton is to be displayed vertically. */\n  vertical?: boolean;\n  /** Category of button to use */\n  variant?: HvButtonVariant;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvMultiButtonClasses;\n  /** Button size. */\n  size?: HvButtonSize;\n  /** Add a split between buttons */\n  split?: boolean;\n}\n\nexport const HvMultiButton = (props: HvMultiButtonProps) => {\n  const {\n    id,\n    className,\n    children,\n    classes: classesProp,\n    disabled = false,\n    vertical = false,\n    variant = \"secondarySubtle\",\n    size,\n    split,\n    ...others\n  } = useDefaultProps(\"HvMultiButton\", props);\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const [color, type] = useMemo(() => {\n    const result = variant.split(/(?=[A-Z])/);\n    if (\n      result[0] === \"ghost\" ||\n      result[0] === \"semantic\" ||\n      (result[0] === \"secondary\" && !result[1])\n    )\n      return [];\n    return result.map((x) => x.toLowerCase());\n  }, [variant]);\n\n  // Filter children: remove invalid and undefined/null\n  const buttons = useMemo(() => {\n    const btns: ReactElement[] = [];\n    Children.forEach(children, (child) => {\n      if (child && isValidElement(child)) {\n        btns.push(child);\n      }\n    });\n    return btns;\n  }, [children]);\n\n  return (\n    <div\n      id={id}\n      className={cx(\n        classes.root,\n        {\n          [classes.multiple]: !split,\n          [classes.vertical]: vertical,\n          [classes[variant as keyof HvMultiButtonClasses]]: variant, // TODO - remove in v6\n          [classes.splitGroup]: split,\n          [classes.splitGroupDisabled]: split && disabled,\n        },\n        className,\n      )}\n      {...others}\n    >\n      {buttons.map((child, index) => {\n        const childIsSelected = !!child.props.selected;\n        const btnKey = setId([id, index]);\n        return (\n          <Fragment key={btnKey}>\n            {cloneElement(child, {\n              variant,\n              disabled: disabled || child.props.disabled,\n              size,\n              className: cx(child.props.className, classes.button, {\n                [classes.firstButton]: index === 0,\n                [classes.lastButton]: index === buttons.length - 1,\n                [classes.selected]: childIsSelected,\n              }),\n            })}\n            {split && index < buttons.length - 1 && (\n              <div\n                className={cx(\n                  classes.splitContainer,\n                  color && css(getSplitContainerColor(color, type, disabled)),\n                  size && css(getSplitContainerHeight(size)),\n                  {\n                    [classes.splitDisabled]: disabled,\n                  },\n                  classes[variant as keyof HvMultiButtonClasses], // TODO - remove in v6\n                )}\n              >\n                <div className={classes.split} />\n              </div>\n            )}\n          </Fragment>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAuCa,MAAA,gBAAgB,CAAC,UAA8B;AACpD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,WAAW;AAAA,IACX,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,iBAAiB,KAAK;AAC1C,QAAM,EAAE,SAAS,IAAI,IAAI,IAAI,WAAW,WAAW;AAEnD,QAAM,CAAC,OAAO,IAAI,IAAI,QAAQ,MAAM;AAC5B,UAAA,SAAS,QAAQ,MAAM,WAAW;AACxC,QACE,OAAO,CAAC,MAAM,WACd,OAAO,CAAC,MAAM,cACb,OAAO,CAAC,MAAM,eAAe,CAAC,OAAO,CAAC;AAEvC,aAAO;AACT,WAAO,OAAO,IAAI,CAAC,MAAM,EAAE,aAAa;AAAA,EAAA,GACvC,CAAC,OAAO,CAAC;AAGN,QAAA,UAAU,QAAQ,MAAM;AAC5B,UAAM,OAAuB,CAAA;AACpB,aAAA,QAAQ,UAAU,CAAC,UAAU;AAChC,UAAA,SAAS,eAAe,KAAK,GAAG;AAClC,aAAK,KAAK,KAAK;AAAA,MACjB;AAAA,IAAA,CACD;AACM,WAAA;AAAA,EAAA,GACN,CAAC,QAAQ,CAAC;AAGX,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,QAAQ,GAAG,CAAC;AAAA,UACrB,CAAC,QAAQ,QAAQ,GAAG;AAAA,UACpB,CAAC,QAAQ,OAAqC,CAAC,GAAG;AAAA;AAAA,UAClD,CAAC,QAAQ,UAAU,GAAG;AAAA,UACtB,CAAC,QAAQ,kBAAkB,GAAG,SAAS;AAAA,QACzC;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,UAAQ,QAAA,IAAI,CAAC,OAAO,UAAU;AAC7B,cAAM,kBAAkB,CAAC,CAAC,MAAM,MAAM;AACtC,cAAM,SAAS,MAAM,CAAC,IAAI,KAAK,CAAC;AAChC,oCACG,UACE,EAAA,UAAA;AAAA,UAAA,aAAa,OAAO;AAAA,YACnB;AAAA,YACA,UAAU,YAAY,MAAM,MAAM;AAAA,YAClC;AAAA,YACA,WAAW,GAAG,MAAM,MAAM,WAAW,QAAQ,QAAQ;AAAA,cACnD,CAAC,QAAQ,WAAW,GAAG,UAAU;AAAA,cACjC,CAAC,QAAQ,UAAU,GAAG,UAAU,QAAQ,SAAS;AAAA,cACjD,CAAC,QAAQ,QAAQ,GAAG;AAAA,YAAA,CACrB;AAAA,UAAA,CACF;AAAA,UACA,SAAS,QAAQ,QAAQ,SAAS,KACjC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW;AAAA,gBACT,QAAQ;AAAA,gBACR,SAAS,IAAI,uBAAuB,OAAO,MAAM,QAAQ,CAAC;AAAA,gBAC1D,QAAQ,IAAI,wBAAwB,IAAI,CAAC;AAAA,gBACzC;AAAA,kBACE,CAAC,QAAQ,aAAa,GAAG;AAAA,gBAC3B;AAAA,gBACA,QAAQ,OAAqC;AAAA;AAAA,cAC/C;AAAA,cAEA,UAAC,oBAAA,OAAA,EAAI,WAAW,QAAQ,OAAO;AAAA,YAAA;AAAA,UACjC;AAAA,QAAA,EAAA,GAxBW,MA0Bf;AAAA,MAAA,CAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/esm/Pagination/Select.js

@@ -57,8 +57,7 @@ const HvSelect = (props) => {
     }
   );
 };
-const HvSelect$1 = HvSelect;
 export {
   Option,
-  HvSelect$1 as default
+  HvSelect as default
 };

package/dist/esm/Pagination/Select.js.map

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

package/dist/esm/QueryBuilder/Rule/Attribute/Attribute.js

@@ -11,8 +11,7 @@ const Attribute = ({
 }) => {
   const { dispatchAction, attributes, operators, labels, readOnly } = useQueryBuilderContext();
   const values = useMemo(() => {
-    if (!attributes)
-      return [];
+    if (!attributes) return [];
     return Object.keys(attributes).map((key) => ({
       id: key,
       label: attributes[key].label,

package/dist/esm/QueryBuilder/Rule/Attribute/Attribute.js.map

@@ -1 +1 @@
-{"version":3,"file":"Attribute.js","sources":["../../../../../src/QueryBuilder/Rule/Attribute/Attribute.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\n\nimport { HvDropdown } from \"../../../Dropdown\";\nimport { useQueryBuilderContext } from \"../../Context\";\nimport { isBigList } from \"../../utils\";\n\nexport interface AttributeProps {\n  id: React.Key;\n  attribute?: string;\n  disabled?: boolean;\n  isInvalid?: boolean;\n}\n\nexport const Attribute = ({\n  id,\n  attribute,\n  disabled,\n  isInvalid,\n}: AttributeProps) => {\n  const { dispatchAction, attributes, operators, labels, readOnly } =\n    useQueryBuilderContext();\n\n  const values = useMemo(() => {\n    if (!attributes) return [];\n\n    return Object.keys(attributes).map((key) => ({\n      id: key,\n      label: attributes[key].label,\n      selected: key === attribute,\n    }));\n  }, [attributes, attribute]);\n\n  const currentType =\n    attribute != null && attributes ? attributes[attribute]?.type : null;\n\n  return (\n    <HvDropdown\n      singleSelectionToggle={false}\n      label={labels.rule.attribute.label}\n      placeholder={labels.rule.attribute.placeholder}\n      values={values}\n      disabled={disabled}\n      readOnly={readOnly}\n      status={isInvalid ? \"invalid\" : \"valid\"}\n      statusMessage={labels.rule.attribute.exists}\n      onChange={(selected) => {\n        if (selected && !Array.isArray(selected)) {\n          const attributeId = selected.id;\n\n          const type =\n            attributes && attributeId && attributes[attributeId]?.type;\n          const typeOperators = type ? operators[type] : undefined;\n\n          let operator;\n          if (currentType === type) {\n            operator = undefined;\n          } else if (typeOperators?.length === 1) {\n            operator = typeOperators[0].operator;\n          } else {\n            operator = null;\n          }\n\n          // default boolean attributes to true\n          const value = type === \"boolean\" ? true : undefined;\n\n          dispatchAction({\n            type: \"set-attribute\",\n            id,\n            attribute: attributeId?.toString(),\n            operator,\n            value,\n          });\n        } else {\n          dispatchAction({ type: \"set-attribute\", id, attribute: null });\n        }\n      }}\n      showSearch={isBigList(values)}\n      {...(isBigList(values) && { virtualized: true, height: 300 })}\n    />\n  );\n};\n\nexport default memo(Attribute);\n"],"names":[],"mappings":";;;;;AAaO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACpB,QAAM,EAAE,gBAAgB,YAAY,WAAW,QAAQ,SAAA,IACrD;AAEI,QAAA,SAAS,QAAQ,MAAM;AAC3B,QAAI,CAAC;AAAY,aAAO;AAExB,WAAO,OAAO,KAAK,UAAU,EAAE,IAAI,CAAC,SAAS;AAAA,MAC3C,IAAI;AAAA,MACJ,OAAO,WAAW,GAAG,EAAE;AAAA,MACvB,UAAU,QAAQ;AAAA,IAClB,EAAA;AAAA,EAAA,GACD,CAAC,YAAY,SAAS,CAAC;AAE1B,QAAM,cACJ,aAAa,QAAQ,aAAa,WAAW,SAAS,GAAG,OAAO;AAGhE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,uBAAuB;AAAA,MACvB,OAAO,OAAO,KAAK,UAAU;AAAA,MAC7B,aAAa,OAAO,KAAK,UAAU;AAAA,MACnC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,YAAY,YAAY;AAAA,MAChC,eAAe,OAAO,KAAK,UAAU;AAAA,MACrC,UAAU,CAAC,aAAa;AACtB,YAAI,YAAY,CAAC,MAAM,QAAQ,QAAQ,GAAG;AACxC,gBAAM,cAAc,SAAS;AAE7B,gBAAM,OACJ,cAAc,eAAe,WAAW,WAAW,GAAG;AACxD,gBAAM,gBAAgB,OAAO,UAAU,IAAI,IAAI;AAE3C,cAAA;AACJ,cAAI,gBAAgB,MAAM;AACb,uBAAA;AAAA,UAAA,WACF,eAAe,WAAW,GAAG;AAC3B,uBAAA,cAAc,CAAC,EAAE;AAAA,UAAA,OACvB;AACM,uBAAA;AAAA,UACb;AAGM,gBAAA,QAAQ,SAAS,YAAY,OAAO;AAE3B,yBAAA;AAAA,YACb,MAAM;AAAA,YACN;AAAA,YACA,WAAW,aAAa,SAAS;AAAA,YACjC;AAAA,YACA;AAAA,UAAA,CACD;AAAA,QAAA,OACI;AACL,yBAAe,EAAE,MAAM,iBAAiB,IAAI,WAAW,MAAM;AAAA,QAC/D;AAAA,MACF;AAAA,MACA,YAAY,UAAU,MAAM;AAAA,MAC3B,GAAI,UAAU,MAAM,KAAK,EAAE,aAAa,MAAM,QAAQ,IAAI;AAAA,IAAA;AAAA,EAAA;AAGjE;AAEe,KAAK,SAAS;"}
+{"version":3,"file":"Attribute.js","sources":["../../../../../src/QueryBuilder/Rule/Attribute/Attribute.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\n\nimport { HvDropdown } from \"../../../Dropdown\";\nimport { useQueryBuilderContext } from \"../../Context\";\nimport { isBigList } from \"../../utils\";\n\nexport interface AttributeProps {\n  id: React.Key;\n  attribute?: string;\n  disabled?: boolean;\n  isInvalid?: boolean;\n}\n\nexport const Attribute = ({\n  id,\n  attribute,\n  disabled,\n  isInvalid,\n}: AttributeProps) => {\n  const { dispatchAction, attributes, operators, labels, readOnly } =\n    useQueryBuilderContext();\n\n  const values = useMemo(() => {\n    if (!attributes) return [];\n\n    return Object.keys(attributes).map((key) => ({\n      id: key,\n      label: attributes[key].label,\n      selected: key === attribute,\n    }));\n  }, [attributes, attribute]);\n\n  const currentType =\n    attribute != null && attributes ? attributes[attribute]?.type : null;\n\n  return (\n    <HvDropdown\n      singleSelectionToggle={false}\n      label={labels.rule.attribute.label}\n      placeholder={labels.rule.attribute.placeholder}\n      values={values}\n      disabled={disabled}\n      readOnly={readOnly}\n      status={isInvalid ? \"invalid\" : \"valid\"}\n      statusMessage={labels.rule.attribute.exists}\n      onChange={(selected) => {\n        if (selected && !Array.isArray(selected)) {\n          const attributeId = selected.id;\n\n          const type =\n            attributes && attributeId && attributes[attributeId]?.type;\n          const typeOperators = type ? operators[type] : undefined;\n\n          let operator;\n          if (currentType === type) {\n            operator = undefined;\n          } else if (typeOperators?.length === 1) {\n            operator = typeOperators[0].operator;\n          } else {\n            operator = null;\n          }\n\n          // default boolean attributes to true\n          const value = type === \"boolean\" ? true : undefined;\n\n          dispatchAction({\n            type: \"set-attribute\",\n            id,\n            attribute: attributeId?.toString(),\n            operator,\n            value,\n          });\n        } else {\n          dispatchAction({ type: \"set-attribute\", id, attribute: null });\n        }\n      }}\n      showSearch={isBigList(values)}\n      {...(isBigList(values) && { virtualized: true, height: 300 })}\n    />\n  );\n};\n\nexport default memo(Attribute);\n"],"names":[],"mappings":";;;;;AAaO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACpB,QAAM,EAAE,gBAAgB,YAAY,WAAW,QAAQ,SAAA,IACrD;AAEI,QAAA,SAAS,QAAQ,MAAM;AACvB,QAAA,CAAC,WAAY,QAAO;AAExB,WAAO,OAAO,KAAK,UAAU,EAAE,IAAI,CAAC,SAAS;AAAA,MAC3C,IAAI;AAAA,MACJ,OAAO,WAAW,GAAG,EAAE;AAAA,MACvB,UAAU,QAAQ;AAAA,IAClB,EAAA;AAAA,EAAA,GACD,CAAC,YAAY,SAAS,CAAC;AAE1B,QAAM,cACJ,aAAa,QAAQ,aAAa,WAAW,SAAS,GAAG,OAAO;AAGhE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,uBAAuB;AAAA,MACvB,OAAO,OAAO,KAAK,UAAU;AAAA,MAC7B,aAAa,OAAO,KAAK,UAAU;AAAA,MACnC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,YAAY,YAAY;AAAA,MAChC,eAAe,OAAO,KAAK,UAAU;AAAA,MACrC,UAAU,CAAC,aAAa;AACtB,YAAI,YAAY,CAAC,MAAM,QAAQ,QAAQ,GAAG;AACxC,gBAAM,cAAc,SAAS;AAE7B,gBAAM,OACJ,cAAc,eAAe,WAAW,WAAW,GAAG;AACxD,gBAAM,gBAAgB,OAAO,UAAU,IAAI,IAAI;AAE3C,cAAA;AACJ,cAAI,gBAAgB,MAAM;AACb,uBAAA;AAAA,UAAA,WACF,eAAe,WAAW,GAAG;AAC3B,uBAAA,cAAc,CAAC,EAAE;AAAA,UAAA,OACvB;AACM,uBAAA;AAAA,UACb;AAGM,gBAAA,QAAQ,SAAS,YAAY,OAAO;AAE3B,yBAAA;AAAA,YACb,MAAM;AAAA,YACN;AAAA,YACA,WAAW,aAAa,SAAS;AAAA,YACjC;AAAA,YACA;AAAA,UAAA,CACD;AAAA,QAAA,OACI;AACL,yBAAe,EAAE,MAAM,iBAAiB,IAAI,WAAW,MAAM;AAAA,QAC/D;AAAA,MACF;AAAA,MACA,YAAY,UAAU,MAAM;AAAA,MAC3B,GAAI,UAAU,MAAM,KAAK,EAAE,aAAa,MAAM,QAAQ,IAAI;AAAA,IAAA;AAAA,EAAA;AAGjE;AAEe,KAAK,SAAS;"}

package/dist/esm/QueryBuilder/Rule/Operator/Operator.js.map

@@ -1 +1 @@
-{"version":3,"file":"Operator.js","sources":["../../../../../src/QueryBuilder/Rule/Operator/Operator.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\n\nimport { HvDropdown } from \"../../../Dropdown\";\nimport { useQueryBuilderContext } from \"../../Context\";\nimport { isBigList } from \"../../utils\";\n\nexport interface OperatorProps {\n  id: React.Key;\n  combinator: string;\n  attribute: string;\n  operator?: string;\n}\n\nexport const Operator = ({\n  id,\n  combinator,\n  attribute,\n  operator,\n}: OperatorProps) => {\n  const { dispatchAction, attributes, operators, labels, readOnly } =\n    useQueryBuilderContext();\n\n  const value = operator ?? null;\n\n  const values = useMemo(() => {\n    const attributeSpec =\n      attribute && attributes ? attributes[attribute] : null;\n    const options = attributeSpec\n      ? operators[attributeSpec.type].filter((o) =>\n          o.combinators.includes(combinator),\n        ) ?? []\n      : [];\n    return options.map((key) => ({\n      id: key.operator,\n      label: key.label,\n      selected: key.operator === value,\n    }));\n  }, [attribute, attributes, operators, combinator, value]);\n\n  return (\n    <HvDropdown\n      required\n      status=\"valid\"\n      singleSelectionToggle={false}\n      label={labels.rule.operator.label}\n      placeholder={labels.rule.operator.placeholder}\n      values={values}\n      disabled={values.length === 0}\n      readOnly={readOnly}\n      onChange={(selected) => {\n        if (selected && !Array.isArray(selected) && selected.id) {\n          dispatchAction({\n            type: \"set-operator\",\n            id,\n            operator: selected.id.toString(),\n            value:\n              value === \"range\" || selected.id === \"range\" ? null : undefined,\n          });\n        } else {\n          dispatchAction({\n            type: \"set-operator\",\n            id,\n            operator: null,\n            value: null,\n          });\n        }\n      }}\n      showSearch={isBigList(values)}\n      {...(isBigList(values) && { virtualized: true, height: 300 })}\n    />\n  );\n};\n\nexport default memo(Operator);\n"],"names":[],"mappings":";;;;;AAaO,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAqB;AACnB,QAAM,EAAE,gBAAgB,YAAY,WAAW,QAAQ,SAAA,IACrD;AAEF,QAAM,QAAQ,YAAY;AAEpB,QAAA,SAAS,QAAQ,MAAM;AAC3B,UAAM,gBACJ,aAAa,aAAa,WAAW,SAAS,IAAI;AACpD,UAAM,UAAU,gBACZ,UAAU,cAAc,IAAI,EAAE;AAAA,MAAO,CAAC,MACpC,EAAE,YAAY,SAAS,UAAU;AAAA,IAAA,KAC9B,CAAA,IACL,CAAA;AACG,WAAA,QAAQ,IAAI,CAAC,SAAS;AAAA,MAC3B,IAAI,IAAI;AAAA,MACR,OAAO,IAAI;AAAA,MACX,UAAU,IAAI,aAAa;AAAA,IAC3B,EAAA;AAAA,EAAA,GACD,CAAC,WAAW,YAAY,WAAW,YAAY,KAAK,CAAC;AAGtD,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAQ;AAAA,MACR,QAAO;AAAA,MACP,uBAAuB;AAAA,MACvB,OAAO,OAAO,KAAK,SAAS;AAAA,MAC5B,aAAa,OAAO,KAAK,SAAS;AAAA,MAClC;AAAA,MACA,UAAU,OAAO,WAAW;AAAA,MAC5B;AAAA,MACA,UAAU,CAAC,aAAa;AACtB,YAAI,YAAY,CAAC,MAAM,QAAQ,QAAQ,KAAK,SAAS,IAAI;AACxC,yBAAA;AAAA,YACb,MAAM;AAAA,YACN;AAAA,YACA,UAAU,SAAS,GAAG,SAAS;AAAA,YAC/B,OACE,UAAU,WAAW,SAAS,OAAO,UAAU,OAAO;AAAA,UAAA,CACzD;AAAA,QAAA,OACI;AACU,yBAAA;AAAA,YACb,MAAM;AAAA,YACN;AAAA,YACA,UAAU;AAAA,YACV,OAAO;AAAA,UAAA,CACR;AAAA,QACH;AAAA,MACF;AAAA,MACA,YAAY,UAAU,MAAM;AAAA,MAC3B,GAAI,UAAU,MAAM,KAAK,EAAE,aAAa,MAAM,QAAQ,IAAI;AAAA,IAAA;AAAA,EAAA;AAGjE;AAEe,KAAK,QAAQ;"}
+{"version":3,"file":"Operator.js","sources":["../../../../../src/QueryBuilder/Rule/Operator/Operator.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\n\nimport { HvDropdown } from \"../../../Dropdown\";\nimport { useQueryBuilderContext } from \"../../Context\";\nimport { isBigList } from \"../../utils\";\n\nexport interface OperatorProps {\n  id: React.Key;\n  combinator: string;\n  attribute: string;\n  operator?: string;\n}\n\nexport const Operator = ({\n  id,\n  combinator,\n  attribute,\n  operator,\n}: OperatorProps) => {\n  const { dispatchAction, attributes, operators, labels, readOnly } =\n    useQueryBuilderContext();\n\n  const value = operator ?? null;\n\n  const values = useMemo(() => {\n    const attributeSpec =\n      attribute && attributes ? attributes[attribute] : null;\n    const options = attributeSpec\n      ? (operators[attributeSpec.type].filter((o) =>\n          o.combinators.includes(combinator),\n        ) ?? [])\n      : [];\n    return options.map((key) => ({\n      id: key.operator,\n      label: key.label,\n      selected: key.operator === value,\n    }));\n  }, [attribute, attributes, operators, combinator, value]);\n\n  return (\n    <HvDropdown\n      required\n      status=\"valid\"\n      singleSelectionToggle={false}\n      label={labels.rule.operator.label}\n      placeholder={labels.rule.operator.placeholder}\n      values={values}\n      disabled={values.length === 0}\n      readOnly={readOnly}\n      onChange={(selected) => {\n        if (selected && !Array.isArray(selected) && selected.id) {\n          dispatchAction({\n            type: \"set-operator\",\n            id,\n            operator: selected.id.toString(),\n            value:\n              value === \"range\" || selected.id === \"range\" ? null : undefined,\n          });\n        } else {\n          dispatchAction({\n            type: \"set-operator\",\n            id,\n            operator: null,\n            value: null,\n          });\n        }\n      }}\n      showSearch={isBigList(values)}\n      {...(isBigList(values) && { virtualized: true, height: 300 })}\n    />\n  );\n};\n\nexport default memo(Operator);\n"],"names":[],"mappings":";;;;;AAaO,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAqB;AACnB,QAAM,EAAE,gBAAgB,YAAY,WAAW,QAAQ,SAAA,IACrD;AAEF,QAAM,QAAQ,YAAY;AAEpB,QAAA,SAAS,QAAQ,MAAM;AAC3B,UAAM,gBACJ,aAAa,aAAa,WAAW,SAAS,IAAI;AACpD,UAAM,UAAU,gBACX,UAAU,cAAc,IAAI,EAAE;AAAA,MAAO,CAAC,MACrC,EAAE,YAAY,SAAS,UAAU;AAAA,IAAA,KAC9B,CAAA,IACL,CAAA;AACG,WAAA,QAAQ,IAAI,CAAC,SAAS;AAAA,MAC3B,IAAI,IAAI;AAAA,MACR,OAAO,IAAI;AAAA,MACX,UAAU,IAAI,aAAa;AAAA,IAC3B,EAAA;AAAA,EAAA,GACD,CAAC,WAAW,YAAY,WAAW,YAAY,KAAK,CAAC;AAGtD,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAQ;AAAA,MACR,QAAO;AAAA,MACP,uBAAuB;AAAA,MACvB,OAAO,OAAO,KAAK,SAAS;AAAA,MAC5B,aAAa,OAAO,KAAK,SAAS;AAAA,MAClC;AAAA,MACA,UAAU,OAAO,WAAW;AAAA,MAC5B;AAAA,MACA,UAAU,CAAC,aAAa;AACtB,YAAI,YAAY,CAAC,MAAM,QAAQ,QAAQ,KAAK,SAAS,IAAI;AACxC,yBAAA;AAAA,YACb,MAAM;AAAA,YACN;AAAA,YACA,UAAU,SAAS,GAAG,SAAS;AAAA,YAC/B,OACE,UAAU,WAAW,SAAS,OAAO,UAAU,OAAO;AAAA,UAAA,CACzD;AAAA,QAAA,OACI;AACU,yBAAA;AAAA,YACb,MAAM;AAAA,YACN;AAAA,YACA,UAAU;AAAA,YACV,OAAO;AAAA,UAAA,CACR;AAAA,QACH;AAAA,MACF;AAAA,MACA,YAAY,UAAU,MAAM;AAAA,MAC3B,GAAI,UAAU,MAAM,KAAK,EAAE,aAAa,MAAM,QAAQ,IAAI;AAAA,IAAA;AAAA,EAAA;AAGjE;AAEe,KAAK,QAAQ;"}

package/dist/esm/QueryBuilder/Rule/Value/NumericValue/NumericValue.js

@@ -18,7 +18,7 @@ const NumericValue = ({
   const theme = useTheme();
   const isMdDown = useMediaQuery(theme.breakpoints.down("md"));
   const onSingleValueChange = useCallback(
-    (_, data) => {
+    (event, data) => {
       const numericData = !data ? null : Number(data);
       dispatchAction({
         type: "set-value",
@@ -29,7 +29,7 @@ const NumericValue = ({
     [dispatchAction, id]
   );
   const onRangeValueChange = useCallback(
-    (_, data, from = true) => {
+    (event, data, from = true) => {
       const numericData = !data ? null : Number(data);
       const currentValue = value;
       const numericRange = {

package/dist/esm/QueryBuilder/Rule/Value/NumericValue/NumericValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumericValue.js","sources":["../../../../../../src/QueryBuilder/Rule/Value/NumericValue/NumericValue.tsx"],"sourcesContent":["import { memo, useCallback, useState } from \"react\";\nimport { useTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\n\nimport { HvInput } from \"../../../../Input\";\nimport { uniqueId } from \"../../../../utils/helpers\";\nimport { useQueryBuilderContext } from \"../../../Context\";\nimport { HvQueryBuilderNumericRange } from \"../../../types\";\nimport { useClasses } from \"./Numeric.styles\";\n\nexport interface NumericValueProps {\n  id: React.Key;\n  value?: any;\n  operator?: string;\n  initialTouched?: boolean;\n}\n\nexport const NumericValue = ({\n  id,\n  value,\n  operator,\n  initialTouched = false,\n}: NumericValueProps) => {\n  const { classes, cx } = useClasses();\n\n  const isRange = operator === \"range\";\n  const { labels, dispatchAction, readOnly } = useQueryBuilderContext();\n\n  const theme = useTheme();\n\n  const isMdDown = useMediaQuery(theme.breakpoints.down(\"md\"));\n\n  const onSingleValueChange = useCallback(\n    (_, data: string) => {\n      const numericData = !data ? null : Number(data);\n      dispatchAction({\n        type: \"set-value\",\n        id,\n        value: Number.isNaN(numericData) ? data : numericData,\n      });\n    },\n    [dispatchAction, id],\n  );\n\n  const onRangeValueChange = useCallback(\n    (_, data: string, from = true) => {\n      const numericData = !data ? null : Number(data);\n      const currentValue = value;\n      const numericRange = {\n        from: currentValue?.from,\n        to: currentValue?.to,\n      };\n      if (from) {\n        numericRange.from = Number.isNaN(numericData) ? data : numericData;\n      } else {\n        numericRange.to = Number.isNaN(numericData) ? data : numericData;\n      }\n      dispatchAction({\n        type: \"set-value\",\n        id,\n        value: numericRange,\n      });\n    },\n    [dispatchAction, id, value],\n  );\n\n  const [touchedNumeric, setTouchedNumeric] = useState(initialTouched);\n  const [touchedNumericTo, setTouchedNumericTo] = useState(initialTouched);\n\n  const elementId = uniqueId(\"numeric\");\n\n  let numericValidation: \"required\" | \"invalid\" | null = null;\n  let rightValidation: \"required\" | \"invalid\" | \"greaterThan\" | \"equal\" | null =\n    null;\n\n  if (touchedNumeric || touchedNumericTo) {\n    if (value === undefined || value?.toString() === \"\") {\n      if (touchedNumeric) {\n        numericValidation = \"required\";\n      }\n      if (touchedNumericTo) {\n        rightValidation = \"required\";\n      }\n    } else if (!isRange) {\n      if (Number.isNaN(Number(value))) {\n        numericValidation = \"invalid\";\n      }\n    } else if (isRange) {\n      const rangeValue = value;\n      if (\n        rangeValue?.from === undefined ||\n        rangeValue?.from?.toString() === \"\"\n      ) {\n        numericValidation = \"required\";\n      } else if (Number.isNaN(Number(rangeValue?.from))) {\n        numericValidation = \"invalid\";\n      }\n\n      if (rangeValue?.to === undefined || rangeValue?.to?.toString() === \"\") {\n        rightValidation = \"required\";\n      } else if (Number.isNaN(Number(rangeValue?.to))) {\n        rightValidation = \"invalid\";\n      } else if (Number(rangeValue?.from) > Number(rangeValue?.to)) {\n        rightValidation = \"greaterThan\";\n      } else if (Number(rangeValue?.from) === Number(rangeValue?.to)) {\n        rightValidation = \"equal\";\n      }\n    }\n  }\n\n  const numericStatus = numericValidation != null ? \"invalid\" : \"valid\";\n  const rightStatus = rightValidation != null ? \"invalid\" : \"valid\";\n\n  const renderRangeInputs = (rangeValue: HvQueryBuilderNumericRange) => (\n    <div\n      className={cx(classes.rangeContainer, { [classes.isMdDown]: isMdDown })}\n    >\n      <div className={classes.inputContainer}>\n        <HvInput\n          label={labels.rule.value.numeric.range.leftLabel}\n          className={classes.input}\n          id={`${elementId}-numeric-from`}\n          name={`${elementId}-numeric-from`}\n          value={rangeValue?.from?.toString() || \"\"}\n          onChange={(event, data) => onRangeValueChange(event, data)}\n          onBlur={() => {\n            setTouchedNumeric(true);\n          }}\n          onKeyDown={(e: any) => {\n            if (e.key === \"Enter\") {\n              e.preventDefault();\n            }\n          }}\n          status={!touchedNumeric ? \"standBy\" : numericStatus}\n          statusMessage={\n            numericValidation\n              ? labels.rule.value.numeric.validation[numericValidation]\n              : \"\"\n          }\n          required\n          inputProps={{\n            autoComplete: \"off\",\n          }}\n          placeholder={labels.rule.value.numeric.placeholder}\n          readOnly={readOnly}\n        />\n      </div>\n      <div className={classes.inputContainer}>\n        <HvInput\n          label={labels.rule.value.numeric.range.rightLabel}\n          className={classes.input}\n          id={`${elementId}-numeric-to`}\n          name={`${elementId}-numeric-to`}\n          value={rangeValue?.to?.toString() || \"\"}\n          onChange={(event, data) => onRangeValueChange(event, data, false)}\n          onBlur={() => {\n            setTouchedNumericTo(true);\n          }}\n          onKeyDown={(e: any) => {\n            if (e.key === \"Enter\") {\n              e.preventDefault();\n            }\n          }}\n          status={!touchedNumericTo ? \"standBy\" : rightStatus}\n          statusMessage={\n            rightValidation\n              ? labels.rule.value.numeric.validation[rightValidation]\n              : \"\"\n          }\n          required\n          inputProps={{\n            autoComplete: \"off\",\n          }}\n          placeholder={labels.rule.value.numeric.placeholder}\n          readOnly={readOnly}\n        />\n      </div>\n    </div>\n  );\n\n  return (\n    <div className={classes.root}>\n      {isRange && renderRangeInputs(value || {})}\n      {!isRange && (\n        <div className={classes.inputContainer}>\n          <HvInput\n            label={labels.rule.value.numeric.label}\n            className={classes.input}\n            id={`${elementId}-numeric`}\n            name={`${elementId}-numeric`}\n            value={value?.toString() || \"\"}\n            onChange={onSingleValueChange}\n            onBlur={() => {\n              setTouchedNumeric(true);\n            }}\n            onKeyDown={(e: any) => {\n              if (e.key === \"Enter\") {\n                e.preventDefault();\n              }\n            }}\n            status={!touchedNumeric ? \"standBy\" : numericStatus}\n            required\n            inputProps={{\n              autoComplete: \"off\",\n            }}\n            placeholder={labels.rule.value.numeric.placeholder}\n            statusMessage={\n              numericValidation\n                ? labels.rule.value.numeric.validation[numericValidation]\n                : \"\"\n            }\n            readOnly={readOnly}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default memo(NumericValue);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"NumericValue.js","sources":["../../../../../../src/QueryBuilder/Rule/Value/NumericValue/NumericValue.tsx"],"sourcesContent":["import { memo, useCallback, useState } from \"react\";\nimport { useTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\n\nimport { HvInput } from \"../../../../Input\";\nimport { uniqueId } from \"../../../../utils/helpers\";\nimport { useQueryBuilderContext } from \"../../../Context\";\nimport { HvQueryBuilderNumericRange } from \"../../../types\";\nimport { useClasses } from \"./Numeric.styles\";\n\nexport interface NumericValueProps {\n  id: React.Key;\n  value?: any;\n  operator?: string;\n  initialTouched?: boolean;\n}\n\nexport const NumericValue = ({\n  id,\n  value,\n  operator,\n  initialTouched = false,\n}: NumericValueProps) => {\n  const { classes, cx } = useClasses();\n\n  const isRange = operator === \"range\";\n  const { labels, dispatchAction, readOnly } = useQueryBuilderContext();\n\n  const theme = useTheme();\n\n  const isMdDown = useMediaQuery(theme.breakpoints.down(\"md\"));\n\n  const onSingleValueChange = useCallback(\n    (\n      event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,\n      data: string,\n    ) => {\n      const numericData = !data ? null : Number(data);\n      dispatchAction({\n        type: \"set-value\",\n        id,\n        value: Number.isNaN(numericData) ? data : numericData,\n      });\n    },\n    [dispatchAction, id],\n  );\n\n  const onRangeValueChange = useCallback(\n    (\n      event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,\n      data: string,\n      from = true,\n    ) => {\n      const numericData = !data ? null : Number(data);\n      const currentValue = value;\n      const numericRange = {\n        from: currentValue?.from,\n        to: currentValue?.to,\n      };\n      if (from) {\n        numericRange.from = Number.isNaN(numericData) ? data : numericData;\n      } else {\n        numericRange.to = Number.isNaN(numericData) ? data : numericData;\n      }\n      dispatchAction({\n        type: \"set-value\",\n        id,\n        value: numericRange,\n      });\n    },\n    [dispatchAction, id, value],\n  );\n\n  const [touchedNumeric, setTouchedNumeric] = useState(initialTouched);\n  const [touchedNumericTo, setTouchedNumericTo] = useState(initialTouched);\n\n  const elementId = uniqueId(\"numeric\");\n\n  let numericValidation: \"required\" | \"invalid\" | null = null;\n  let rightValidation: \"required\" | \"invalid\" | \"greaterThan\" | \"equal\" | null =\n    null;\n\n  if (touchedNumeric || touchedNumericTo) {\n    if (value === undefined || value?.toString() === \"\") {\n      if (touchedNumeric) {\n        numericValidation = \"required\";\n      }\n      if (touchedNumericTo) {\n        rightValidation = \"required\";\n      }\n    } else if (!isRange) {\n      if (Number.isNaN(Number(value))) {\n        numericValidation = \"invalid\";\n      }\n    } else if (isRange) {\n      const rangeValue = value;\n      if (\n        rangeValue?.from === undefined ||\n        rangeValue?.from?.toString() === \"\"\n      ) {\n        numericValidation = \"required\";\n      } else if (Number.isNaN(Number(rangeValue?.from))) {\n        numericValidation = \"invalid\";\n      }\n\n      if (rangeValue?.to === undefined || rangeValue?.to?.toString() === \"\") {\n        rightValidation = \"required\";\n      } else if (Number.isNaN(Number(rangeValue?.to))) {\n        rightValidation = \"invalid\";\n      } else if (Number(rangeValue?.from) > Number(rangeValue?.to)) {\n        rightValidation = \"greaterThan\";\n      } else if (Number(rangeValue?.from) === Number(rangeValue?.to)) {\n        rightValidation = \"equal\";\n      }\n    }\n  }\n\n  const numericStatus = numericValidation != null ? \"invalid\" : \"valid\";\n  const rightStatus = rightValidation != null ? \"invalid\" : \"valid\";\n\n  const renderRangeInputs = (rangeValue: HvQueryBuilderNumericRange) => (\n    <div\n      className={cx(classes.rangeContainer, { [classes.isMdDown]: isMdDown })}\n    >\n      <div className={classes.inputContainer}>\n        <HvInput\n          label={labels.rule.value.numeric.range.leftLabel}\n          className={classes.input}\n          id={`${elementId}-numeric-from`}\n          name={`${elementId}-numeric-from`}\n          value={rangeValue?.from?.toString() || \"\"}\n          onChange={(event, data) => onRangeValueChange(event, data)}\n          onBlur={() => {\n            setTouchedNumeric(true);\n          }}\n          onKeyDown={(e: any) => {\n            if (e.key === \"Enter\") {\n              e.preventDefault();\n            }\n          }}\n          status={!touchedNumeric ? \"standBy\" : numericStatus}\n          statusMessage={\n            numericValidation\n              ? labels.rule.value.numeric.validation[numericValidation]\n              : \"\"\n          }\n          required\n          inputProps={{\n            autoComplete: \"off\",\n          }}\n          placeholder={labels.rule.value.numeric.placeholder}\n          readOnly={readOnly}\n        />\n      </div>\n      <div className={classes.inputContainer}>\n        <HvInput\n          label={labels.rule.value.numeric.range.rightLabel}\n          className={classes.input}\n          id={`${elementId}-numeric-to`}\n          name={`${elementId}-numeric-to`}\n          value={rangeValue?.to?.toString() || \"\"}\n          onChange={(event, data) => onRangeValueChange(event, data, false)}\n          onBlur={() => {\n            setTouchedNumericTo(true);\n          }}\n          onKeyDown={(e: any) => {\n            if (e.key === \"Enter\") {\n              e.preventDefault();\n            }\n          }}\n          status={!touchedNumericTo ? \"standBy\" : rightStatus}\n          statusMessage={\n            rightValidation\n              ? labels.rule.value.numeric.validation[rightValidation]\n              : \"\"\n          }\n          required\n          inputProps={{\n            autoComplete: \"off\",\n          }}\n          placeholder={labels.rule.value.numeric.placeholder}\n          readOnly={readOnly}\n        />\n      </div>\n    </div>\n  );\n\n  return (\n    <div className={classes.root}>\n      {isRange && renderRangeInputs(value || {})}\n      {!isRange && (\n        <div className={classes.inputContainer}>\n          <HvInput\n            label={labels.rule.value.numeric.label}\n            className={classes.input}\n            id={`${elementId}-numeric`}\n            name={`${elementId}-numeric`}\n            value={value?.toString() || \"\"}\n            onChange={onSingleValueChange}\n            onBlur={() => {\n              setTouchedNumeric(true);\n            }}\n            onKeyDown={(e: any) => {\n              if (e.key === \"Enter\") {\n                e.preventDefault();\n              }\n            }}\n            status={!touchedNumeric ? \"standBy\" : numericStatus}\n            required\n            inputProps={{\n              autoComplete: \"off\",\n            }}\n            placeholder={labels.rule.value.numeric.placeholder}\n            statusMessage={\n              numericValidation\n                ? labels.rule.value.numeric.validation[numericValidation]\n                : \"\"\n            }\n            readOnly={readOnly}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default memo(NumericValue);\n"],"names":[],"mappings":"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"}

package/dist/esm/QueryBuilder/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/QueryBuilder/utils/index.tsx"],"sourcesContent":["import { isEqual, uniqueId } from \"../../utils/helpers\";\nimport {\n  HvQueryBuilderQueryGroup,\n  HvQueryBuilderQueryRule,\n  Query,\n} from \"../types\";\n\nexport const isBigList = (values: unknown[]) =>\n  values != null && values?.length > 10;\n\nconst ID_PREFIX = \"@hv_\";\nconst createId = () => uniqueId(ID_PREFIX);\n\nexport const emptyRule = () => ({\n  id: createId(),\n});\n\nexport const emptyGroup = (createEmptyRule = false) => ({\n  id: createId(),\n  combinator: \"and\",\n  rules: createEmptyRule ? [emptyRule()] : [],\n});\n\nexport const clearNodeIds = (\n  original: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n  full = false,\n) => {\n  const rule = { ...original };\n\n  if ((!full && rule.id?.toString().startsWith(ID_PREFIX)) || full) {\n    delete rule.id;\n  }\n\n  if (\"rules\" in rule) {\n    rule.rules = rule.rules.map((r) => clearNodeIds(r, full));\n  }\n\n  return rule;\n};\n\nconst isQueryGroup = (\n  value: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): value is HvQueryBuilderQueryGroup => \"rules\" in value;\n\nexport const setNodeIds = (\n  query: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n  prevQuery?: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): Query => {\n  // Use already existing autogenerated id when possible\n  if (!query.id) {\n    query.id =\n      prevQuery?.id &&\n      isEqual(\n        clearNodeIds(structuredClone(query)),\n        clearNodeIds(structuredClone(prevQuery)),\n      )\n        ? prevQuery.id\n        : createId();\n  }\n\n  if (isQueryGroup(query)) {\n    query.rules = query.rules.map((item, idx) =>\n      setNodeIds(\n        item,\n        prevQuery && isQueryGroup(prevQuery) ? prevQuery.rules[idx] : undefined,\n      ),\n    );\n  }\n\n  return query as Query;\n};\n\nexport const findNodeById = (\n  id: React.Key,\n  node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n) => {\n  if (node.id === id) {\n    return node;\n  }\n  if (\"rules\" in node) {\n    for (let i = 0; i < node.rules.length; ++i) {\n      const rule = node.rules[i];\n\n      const found = findNodeById(id, rule);\n      if (found) {\n        return found;\n      }\n    }\n  }\n\n  return null;\n};\n\nexport const findParentById = (\n  id: React.Key,\n  node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n  parent?: HvQueryBuilderQueryGroup,\n) => {\n  if (node.id === id) {\n    return parent ?? null;\n  }\n\n  if (\"rules\" in node) {\n    const group = node;\n\n    for (let i = 0; i < group.rules.length; ++i) {\n      const rule = group.rules[i];\n\n      const found = findParentById(id, rule, group);\n      if (found) {\n        return found;\n      }\n    }\n  }\n\n  return null;\n};\n"],"names":[],"mappings":";AAOO,MAAM,YAAY,CAAC,WACxB,UAAU,QAAQ,QAAQ,SAAS;AAErC,MAAM,YAAY;AAClB,MAAM,WAAW,MAAM,SAAS,SAAS;AAElC,MAAM,YAAY,OAAO;AAAA,EAC9B,IAAI,SAAS;AACf;AAEa,MAAA,aAAa,CAAC,kBAAkB,WAAW;AAAA,EACtD,IAAI,SAAS;AAAA,EACb,YAAY;AAAA,EACZ,OAAO,kBAAkB,CAAC,UAAU,CAAC,IAAI,CAAC;AAC5C;AAEO,MAAM,eAAe,CAC1B,UACA,OAAO,UACJ;AACG,QAAA,OAAO,EAAE,GAAG;AAEb,MAAA,CAAC,QAAQ,KAAK,IAAI,WAAW,WAAW,SAAS,KAAM,MAAM;AAChE,WAAO,KAAK;AAAA,EACd;AAEA,MAAI,WAAW,MAAM;AACd,SAAA,QAAQ,KAAK,MAAM,IAAI,CAAC,MAAM,aAAa,GAAG,IAAI,CAAC;AAAA,EAC1D;AAEO,SAAA;AACT;AAEA,MAAM,eAAe,CACnB,UACsC,WAAW;AAEtC,MAAA,aAAa,CACxB,OACA,cACU;AAEN,MAAA,CAAC,MAAM,IAAI;AACP,UAAA,KACJ,WAAW,MACX;AAAA,MACE,aAAa,gBAAgB,KAAK,CAAC;AAAA,MACnC,aAAa,gBAAgB,SAAS,CAAC;AAAA,IAAA,IAErC,UAAU,KACV;EACR;AAEI,MAAA,aAAa,KAAK,GAAG;AACjB,UAAA,QAAQ,MAAM,MAAM;AAAA,MAAI,CAAC,MAAM,QACnC;AAAA,QACE;AAAA,QACA,aAAa,aAAa,SAAS,IAAI,UAAU,MAAM,GAAG,IAAI;AAAA,MAChE;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AACT;AAEa,MAAA,eAAe,CAC1B,IACA,SACG;AACC,MAAA,KAAK,OAAO,IAAI;AACX,WAAA;AAAA,EACT;AACA,MAAI,WAAW,MAAM;AACnB,aAAS,IAAI,GAAG,IAAI,KAAK,MAAM,QAAQ,EAAE,GAAG;AACpC,YAAA,OAAO,KAAK,MAAM,CAAC;AAEnB,YAAA,QAAQ,aAAa,IAAI,IAAI;AACnC,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;AAEO,MAAM,iBAAiB,CAC5B,IACA,MACA,WACG;AACC,MAAA,KAAK,OAAO,IAAI;AAClB,WAAO,UAAU;AAAA,EACnB;AAEA,MAAI,WAAW,MAAM;AACnB,UAAM,QAAQ;AAEd,aAAS,IAAI,GAAG,IAAI,MAAM,MAAM,QAAQ,EAAE,GAAG;AACrC,YAAA,OAAO,MAAM,MAAM,CAAC;AAE1B,YAAM,QAAQ,eAAe,IAAI,MAAM,KAAK;AAC5C,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;"}
+{"version":3,"file":"index.js","sources":["../../../../src/QueryBuilder/utils/index.tsx"],"sourcesContent":["import { isEqual, uniqueId } from \"../../utils/helpers\";\nimport {\n  HvQueryBuilderQueryGroup,\n  HvQueryBuilderQueryRule,\n  Query,\n} from \"../types\";\n\nexport const isBigList = (values: unknown[]) =>\n  values != null && values?.length > 10;\n\nconst ID_PREFIX = \"@hv_\";\nconst createId = () => uniqueId(ID_PREFIX);\n\nexport const emptyRule = () => ({\n  id: createId(),\n});\n\nexport const emptyGroup = (createEmptyRule = false) => ({\n  id: createId(),\n  combinator: \"and\",\n  rules: createEmptyRule ? [emptyRule()] : [],\n});\n\nexport const clearNodeIds = (\n  original: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n  full = false,\n) => {\n  const rule = { ...original };\n\n  if ((!full && rule.id?.toString().startsWith(ID_PREFIX)) || full) {\n    delete rule.id;\n  }\n\n  if (\"rules\" in rule) {\n    rule.rules = rule.rules.map((r) => clearNodeIds(r, full));\n  }\n\n  return rule;\n};\n\nconst isQueryGroup = (\n  value: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): value is HvQueryBuilderQueryGroup => \"rules\" in value;\n\nexport const setNodeIds = (\n  query: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n  prevQuery?: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): Query => {\n  // Use already existing autogenerated id when possible\n  if (!query.id) {\n    query.id =\n      prevQuery?.id &&\n      isEqual(\n        clearNodeIds(structuredClone(query)),\n        clearNodeIds(structuredClone(prevQuery)),\n      )\n        ? prevQuery.id\n        : createId();\n  }\n\n  if (isQueryGroup(query)) {\n    query.rules = query.rules.map((item, idx) =>\n      setNodeIds(\n        item,\n        prevQuery && isQueryGroup(prevQuery) ? prevQuery.rules[idx] : undefined,\n      ),\n    );\n  }\n\n  return query as Query;\n};\n\nexport const findNodeById = (\n  id: React.Key,\n  node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule | null => {\n  if (node.id === id) {\n    return node;\n  }\n  if (\"rules\" in node) {\n    for (let i = 0; i < node.rules.length; ++i) {\n      const rule = node.rules[i];\n\n      const found = findNodeById(id, rule);\n      if (found) {\n        return found;\n      }\n    }\n  }\n\n  return null;\n};\n\nexport const findParentById = (\n  id: React.Key,\n  node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n  parent?: HvQueryBuilderQueryGroup,\n): HvQueryBuilderQueryGroup | null => {\n  if (node.id === id) {\n    return parent ?? null;\n  }\n\n  if (\"rules\" in node) {\n    const group = node;\n\n    for (let i = 0; i < group.rules.length; ++i) {\n      const rule = group.rules[i];\n\n      const found = findParentById(id, rule, group);\n      if (found) {\n        return found;\n      }\n    }\n  }\n\n  return null;\n};\n"],"names":[],"mappings":";AAOO,MAAM,YAAY,CAAC,WACxB,UAAU,QAAQ,QAAQ,SAAS;AAErC,MAAM,YAAY;AAClB,MAAM,WAAW,MAAM,SAAS,SAAS;AAElC,MAAM,YAAY,OAAO;AAAA,EAC9B,IAAI,SAAS;AACf;AAEa,MAAA,aAAa,CAAC,kBAAkB,WAAW;AAAA,EACtD,IAAI,SAAS;AAAA,EACb,YAAY;AAAA,EACZ,OAAO,kBAAkB,CAAC,UAAU,CAAC,IAAI,CAAC;AAC5C;AAEO,MAAM,eAAe,CAC1B,UACA,OAAO,UACJ;AACG,QAAA,OAAO,EAAE,GAAG;AAEb,MAAA,CAAC,QAAQ,KAAK,IAAI,WAAW,WAAW,SAAS,KAAM,MAAM;AAChE,WAAO,KAAK;AAAA,EACd;AAEA,MAAI,WAAW,MAAM;AACd,SAAA,QAAQ,KAAK,MAAM,IAAI,CAAC,MAAM,aAAa,GAAG,IAAI,CAAC;AAAA,EAC1D;AAEO,SAAA;AACT;AAEA,MAAM,eAAe,CACnB,UACsC,WAAW;AAEtC,MAAA,aAAa,CACxB,OACA,cACU;AAEN,MAAA,CAAC,MAAM,IAAI;AACP,UAAA,KACJ,WAAW,MACX;AAAA,MACE,aAAa,gBAAgB,KAAK,CAAC;AAAA,MACnC,aAAa,gBAAgB,SAAS,CAAC;AAAA,IAAA,IAErC,UAAU,KACV;EACR;AAEI,MAAA,aAAa,KAAK,GAAG;AACjB,UAAA,QAAQ,MAAM,MAAM;AAAA,MAAI,CAAC,MAAM,QACnC;AAAA,QACE;AAAA,QACA,aAAa,aAAa,SAAS,IAAI,UAAU,MAAM,GAAG,IAAI;AAAA,MAChE;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AACT;AAEa,MAAA,eAAe,CAC1B,IACA,SAC8D;AAC1D,MAAA,KAAK,OAAO,IAAI;AACX,WAAA;AAAA,EACT;AACA,MAAI,WAAW,MAAM;AACnB,aAAS,IAAI,GAAG,IAAI,KAAK,MAAM,QAAQ,EAAE,GAAG;AACpC,YAAA,OAAO,KAAK,MAAM,CAAC;AAEnB,YAAA,QAAQ,aAAa,IAAI,IAAI;AACnC,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;AAEO,MAAM,iBAAiB,CAC5B,IACA,MACA,WACoC;AAChC,MAAA,KAAK,OAAO,IAAI;AAClB,WAAO,UAAU;AAAA,EACnB;AAEA,MAAI,WAAW,MAAM;AACnB,UAAM,QAAQ;AAEd,aAAS,IAAI,GAAG,IAAI,MAAM,MAAM,QAAQ,EAAE,GAAG;AACrC,YAAA,OAAO,MAAM,MAAM,CAAC;AAE1B,YAAM,QAAQ,eAAe,IAAI,MAAM,KAAK;AAC5C,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;"}

package/dist/esm/QueryBuilder/utils/reducer.js

@@ -88,7 +88,6 @@ const reducer = (state, action) => {
   }
   return query;
 };
-const reducer$1 = reducer;
 export {
-  reducer$1 as default
+  reducer as default
 };