@hitachivantara/uikit-react-core 5.50.1 → 5.52.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/dist/cjs/DropDownMenu/DropDownMenu.cjs +1 -1
  2. package/dist/cjs/FilterGroup/Counter/Counter.cjs.map +1 -1
  3. package/dist/cjs/FilterGroup/FilterContent/FilterContent.cjs.map +1 -1
  4. package/dist/cjs/FilterGroup/FilterGroup.cjs.map +1 -1
  5. package/dist/cjs/FilterGroup/FilterGroupContext.cjs.map +1 -1
  6. package/dist/cjs/FilterGroup/LeftPanel/LeftPanel.cjs.map +1 -1
  7. package/dist/cjs/FilterGroup/RightPanel/RightPanel.cjs +22 -15
  8. package/dist/cjs/FilterGroup/RightPanel/RightPanel.cjs.map +1 -1
  9. package/dist/cjs/Select/Option.cjs +53 -0
  10. package/dist/cjs/Select/Option.cjs.map +1 -0
  11. package/dist/cjs/Select/OptionGroup.cjs +34 -0
  12. package/dist/cjs/Select/OptionGroup.cjs.map +1 -0
  13. package/dist/cjs/Select/Select.cjs +214 -0
  14. package/dist/cjs/Select/Select.cjs.map +1 -0
  15. package/dist/cjs/Select/Select.styles.cjs +44 -0
  16. package/dist/cjs/Select/Select.styles.cjs.map +1 -0
  17. package/dist/cjs/Select/SelectButton.cjs +92 -0
  18. package/dist/cjs/Select/SelectButton.cjs.map +1 -0
  19. package/dist/cjs/index.cjs +10 -0
  20. package/dist/cjs/index.cjs.map +1 -1
  21. package/dist/esm/DropDownMenu/DropDownMenu.js +1 -1
  22. package/dist/esm/FilterGroup/Counter/Counter.js.map +1 -1
  23. package/dist/esm/FilterGroup/FilterContent/FilterContent.js.map +1 -1
  24. package/dist/esm/FilterGroup/FilterGroup.js.map +1 -1
  25. package/dist/esm/FilterGroup/FilterGroupContext.js.map +1 -1
  26. package/dist/esm/FilterGroup/LeftPanel/LeftPanel.js.map +1 -1
  27. package/dist/esm/FilterGroup/RightPanel/RightPanel.js +22 -15
  28. package/dist/esm/FilterGroup/RightPanel/RightPanel.js.map +1 -1
  29. package/dist/esm/Select/Option.js +53 -0
  30. package/dist/esm/Select/Option.js.map +1 -0
  31. package/dist/esm/Select/OptionGroup.js +34 -0
  32. package/dist/esm/Select/OptionGroup.js.map +1 -0
  33. package/dist/esm/Select/Select.js +213 -0
  34. package/dist/esm/Select/Select.js.map +1 -0
  35. package/dist/esm/Select/Select.styles.js +44 -0
  36. package/dist/esm/Select/Select.styles.js.map +1 -0
  37. package/dist/esm/Select/SelectButton.js +92 -0
  38. package/dist/esm/Select/SelectButton.js.map +1 -0
  39. package/dist/esm/index.js +224 -214
  40. package/dist/esm/index.js.map +1 -1
  41. package/dist/types/index.d.ts +564 -450
  42. package/package.json +6 -6
@@ -12,8 +12,8 @@ const focusableElementFinder = require("../utils/focusableElementFinder.cjs");
12
12
  const DropDownMenu_styles = require("./DropDownMenu.styles.cjs");
13
13
  const BaseDropdown = require("../BaseDropdown/BaseDropdown.cjs");
14
14
  const Button = require("../Button/Button.cjs");
15
- const Panel = require("../Panel/Panel.cjs");
16
15
  const List = require("../List/List.cjs");
16
+ const Panel = require("../Panel/Panel.cjs");
17
17
  const HvDropDownMenu = (props) => {
18
18
  const {
19
19
  id: idProp,
@@ -1 +1 @@
1
- {"version":3,"file":"Counter.cjs","sources":["../../../../src/FilterGroup/Counter/Counter.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { ExtractNames } from \"../../utils/classes\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { staticClasses, useClasses } from \"./Counter.styles\";\nimport { HvFilterGroupFilters, HvFilterGroupValue } from \"../types\";\n\nexport { staticClasses as filterGroupCounterClasses };\n\nexport type HvFilterGroupCounterClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupCounterProps {\n className?: string;\n id?: string;\n classes?: HvFilterGroupCounterClasses;\n}\n\nconst getExistingFiltersById = (\n idx: number,\n filterValues: HvFilterGroupValue,\n filterOptions: HvFilterGroupFilters\n) => {\n let total = 0;\n filterValues[idx]?.forEach((fv) => {\n if (filterOptions[idx]?.data.find((f) => f.id === fv)) {\n total += 1;\n }\n });\n return total;\n};\n\nexport const HvFilterGroupCounter = (props: HvFilterGroupCounterProps) => {\n const {\n className,\n id,\n classes: classesProp,\n } = useDefaultProps(\"HvFilterGroupCounter\", props);\n const { classes, cx } = useClasses(classesProp);\n const {\n filterOptions,\n filterValues = [],\n appliedFilters = [],\n } = useContext(HvFilterGroupContext);\n\n const options =\n id && filterOptions.find((option) => option.id === id)\n ? ([\n filterOptions.find((option) => option.id === id),\n ] as HvFilterGroupFilters)\n : filterOptions;\n const optionIdx = filterOptions.findIndex((option) => option.id === id);\n\n let groupsCounter = 0;\n appliedFilters.forEach((fg, i) => {\n groupsCounter += getExistingFiltersById(i, filterValues, filterOptions);\n });\n\n const partialCounter = id\n ? getExistingFiltersById(optionIdx, filterValues, filterOptions) || 0\n : groupsCounter;\n\n const totalCounter = options.reduce(\n (acc, option) => acc + option.data.length,\n 0\n );\n\n return (\n <div className={cx(classes.root, className)}>\n {partialCounter > 0 ? (\n <p className={classes.partialCounter}>{partialCounter}</p>\n ) : (\n partialCounter\n )}\n {` / ${totalCounter}`}\n </div>\n );\n};\n"],"names":["useDefaultProps","useClasses","useContext","HvFilterGroupContext","jsx"],"mappings":";;;;;;;AAoBA,MAAM,yBAAyB,CAC7B,KACA,cACA,kBACG;AACH,MAAI,QAAQ;AACZ,eAAa,GAAG,GAAG,QAAQ,CAAC,OAAO;AAC7B,QAAA,cAAc,GAAG,GAAG,KAAK,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,GAAG;AAC5C,eAAA;AAAA,IACX;AAAA,EAAA,CACD;AACM,SAAA;AACT;AAEa,MAAA,uBAAuB,CAAC,UAAqC;AAClE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EAAA,IACPA,gBAAgB,gBAAA,wBAAwB,KAAK;AACjD,QAAM,EAAE,SAAS,GAAG,IAAIC,0BAAW,WAAW;AACxC,QAAA;AAAA,IACJ;AAAA,IACA,eAAe,CAAC;AAAA,IAChB,iBAAiB,CAAC;AAAA,EAAA,IAChBC,MAAAA,WAAWC,mBAAAA,oBAAoB;AAE7B,QAAA,UACJ,MAAM,cAAc,KAAK,CAAC,WAAW,OAAO,OAAO,EAAE,IAChD;AAAA,IACC,cAAc,KAAK,CAAC,WAAW,OAAO,OAAO,EAAE;AAAA,EAEjD,IAAA;AACN,QAAM,YAAY,cAAc,UAAU,CAAC,WAAW,OAAO,OAAO,EAAE;AAEtE,MAAI,gBAAgB;AACL,iBAAA,QAAQ,CAAC,IAAI,MAAM;AACf,qBAAA,uBAAuB,GAAG,cAAc,aAAa;AAAA,EAAA,CACvE;AAED,QAAM,iBAAiB,KACnB,uBAAuB,WAAW,cAAc,aAAa,KAAK,IAClE;AAEJ,QAAM,eAAe,QAAQ;AAAA,IAC3B,CAAC,KAAK,WAAW,MAAM,OAAO,KAAK;AAAA,IACnC;AAAA,EAAA;AAGF,yCACG,OAAI,EAAA,WAAW,GAAG,QAAQ,MAAM,SAAS,GACvC,UAAA;AAAA,IAAA,iBAAiB,IACfC,+BAAA,KAAA,EAAE,WAAW,QAAQ,gBAAiB,0BAAe,IAEtD;AAAA,IAED,MAAM,YAAY;AAAA,EACrB,EAAA,CAAA;AAEJ;;;"}
1
+ {"version":3,"file":"Counter.cjs","sources":["../../../../src/FilterGroup/Counter/Counter.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { ExtractNames } from \"../../utils/classes\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { staticClasses, useClasses } from \"./Counter.styles\";\nimport { HvFilterGroupFilters, HvFilterGroupValue } from \"../types\";\n\nexport { staticClasses as filterGroupCounterClasses };\n\nexport type HvFilterGroupCounterClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupCounterProps {\n className?: string;\n id?: string;\n classes?: HvFilterGroupCounterClasses;\n}\n\nconst getExistingFiltersById = (\n idx: number,\n filterValues: HvFilterGroupValue,\n filterOptions: HvFilterGroupFilters\n) => {\n let total = 0;\n filterValues[idx]?.forEach((fv) => {\n if (filterOptions[idx]?.data.find((f) => f.id === fv)) {\n total += 1;\n }\n });\n return total;\n};\n\nexport const HvFilterGroupCounter = (props: HvFilterGroupCounterProps) => {\n const {\n className,\n id,\n classes: classesProp,\n } = useDefaultProps(\"HvFilterGroupCounter\", props);\n const { classes, cx } = useClasses(classesProp);\n const {\n filterOptions,\n filterValues = [],\n appliedFilters = [],\n } = useContext(HvFilterGroupContext);\n\n const options =\n id && filterOptions.find((option) => option.id === id)\n ? ([\n filterOptions.find((option) => option.id === id),\n ] as HvFilterGroupFilters)\n : filterOptions;\n const optionIdx = filterOptions.findIndex((option) => option.id === id);\n\n let groupsCounter = 0;\n appliedFilters.forEach((fg, i) => {\n groupsCounter += getExistingFiltersById(i, filterValues, filterOptions);\n });\n\n const partialCounter = id\n ? getExistingFiltersById(optionIdx, filterValues, filterOptions) || 0\n : groupsCounter;\n\n const totalCounter = options.reduce(\n (acc, option) => acc + option.data.length,\n 0\n );\n\n return (\n <div className={cx(classes.root, className)}>\n {partialCounter > 0 ? (\n <p className={classes.partialCounter}>{partialCounter}</p>\n ) : (\n partialCounter\n )}\n {` / ${totalCounter}`}\n </div>\n );\n};\n"],"names":["useDefaultProps","useClasses","useContext","HvFilterGroupContext","jsx"],"mappings":";;;;;;;AAkBA,MAAM,yBAAyB,CAC7B,KACA,cACA,kBACG;AACH,MAAI,QAAQ;AACZ,eAAa,GAAG,GAAG,QAAQ,CAAC,OAAO;AAC7B,QAAA,cAAc,GAAG,GAAG,KAAK,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,GAAG;AAC5C,eAAA;AAAA,IACX;AAAA,EAAA,CACD;AACM,SAAA;AACT;AAEa,MAAA,uBAAuB,CAAC,UAAqC;AAClE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EAAA,IACPA,gBAAgB,gBAAA,wBAAwB,KAAK;AACjD,QAAM,EAAE,SAAS,GAAG,IAAIC,0BAAW,WAAW;AACxC,QAAA;AAAA,IACJ;AAAA,IACA,eAAe,CAAC;AAAA,IAChB,iBAAiB,CAAC;AAAA,EAAA,IAChBC,MAAAA,WAAWC,mBAAAA,oBAAoB;AAE7B,QAAA,UACJ,MAAM,cAAc,KAAK,CAAC,WAAW,OAAO,OAAO,EAAE,IAChD;AAAA,IACC,cAAc,KAAK,CAAC,WAAW,OAAO,OAAO,EAAE;AAAA,EAEjD,IAAA;AACN,QAAM,YAAY,cAAc,UAAU,CAAC,WAAW,OAAO,OAAO,EAAE;AAEtE,MAAI,gBAAgB;AACL,iBAAA,QAAQ,CAAC,IAAI,MAAM;AACf,qBAAA,uBAAuB,GAAG,cAAc,aAAa;AAAA,EAAA,CACvE;AAED,QAAM,iBAAiB,KACnB,uBAAuB,WAAW,cAAc,aAAa,KAAK,IAClE;AAEJ,QAAM,eAAe,QAAQ;AAAA,IAC3B,CAAC,KAAK,WAAW,MAAM,OAAO,KAAK;AAAA,IACnC;AAAA,EAAA;AAGF,yCACG,OAAI,EAAA,WAAW,GAAG,QAAQ,MAAM,SAAS,GACvC,UAAA;AAAA,IAAA,iBAAiB,IACfC,+BAAA,KAAA,EAAE,WAAW,QAAQ,gBAAiB,0BAAe,IAEtD;AAAA,IAED,MAAM,YAAY;AAAA,EACrB,EAAA,CAAA;AAEJ;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"FilterContent.cjs","sources":["../../../../src/FilterGroup/FilterContent/FilterContent.tsx"],"sourcesContent":["import { forwardRef, useContext, useMemo, useRef, useState } from \"react\";\n\nimport { Filters } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useTheme } from \"../../hooks/useTheme\";\nimport { HvActionBar } from \"../../ActionBar\";\nimport { HvBaseDropdown, HvBaseDropdownProps } from \"../../BaseDropdown\";\nimport { HvButton, HvButtonVariant } from \"../../Button\";\nimport { HvFormStatus } from \"../../Forms\";\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { setId } from \"../../utils/setId\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { HvFilterGroupValue, HvFilterGroupHorizontalPlacement } from \"../types\";\nimport { staticClasses, useClasses } from \"./FilterContent.styles\";\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { HvFilterGroupCounter } from \"../Counter\";\nimport { HvFilterGroupLeftPanel } from \"../LeftPanel\";\nimport { HvFilterGroupRightPanel } from \"../RightPanel\";\nimport type { HvFilterGroupLabels } from \"../FilterGroup\";\n\nexport { staticClasses as filterGroupContentClasses };\n\nexport type HvFilterGroupContentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupContentProps\n extends Omit<HvBaseDropdownProps, \"onChange\"> {\n description?: React.ReactNode;\n status?: HvFormStatus;\n onChange?: (\n event: React.MouseEvent<HTMLButtonElement>,\n value?: HvFilterGroupValue\n ) => void;\n onCancel?: (event: React.MouseEvent<HTMLButtonElement> | Event) => void;\n onClear?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n labels?: HvFilterGroupLabels;\n horizontalPlacement?: HvFilterGroupHorizontalPlacement;\n disablePortal?: boolean;\n escapeWithReference?: boolean;\n height?: string | number;\n leftEmptyElement?: React.ReactNode;\n rightEmptyElement?: React.ReactNode;\n disabled?: boolean;\n classes?: HvFilterGroupContentClasses;\n}\n\nexport const HvFilterGroupContent = forwardRef<\n HTMLDivElement,\n HvFilterGroupContentProps\n>((props, ref) => {\n const {\n id,\n status,\n disabled = false,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n onChange,\n onCancel,\n onClear,\n labels,\n horizontalPlacement = \"right\",\n disablePortal = true,\n escapeWithReference = true,\n height,\n leftEmptyElement,\n rightEmptyElement,\n classes: classesProp,\n ...others\n } = useDefaultProps(\"HvFilterGroupContent\", props);\n\n const { classes } = useClasses(classesProp);\n const { activeTheme } = useTheme();\n\n const [filterGroupOpen, setFilterGroupOpen] = useState<boolean>(false);\n\n const {\n defaultValue,\n filterValues,\n rollbackFilters,\n clearFilters,\n applyFilters,\n applyDisabled,\n } = useContext(HvFilterGroupContext);\n\n const focusTarget = useRef<HTMLDivElement>(null);\n\n const focusOnContainer = () => {\n focusTarget.current?.focus();\n };\n\n const onApplyHandler = (event: React.MouseEvent<HTMLButtonElement>) => {\n applyFilters();\n onChange?.(event, filterValues);\n setFilterGroupOpen(false);\n };\n\n const onCancelHandler = (\n event: React.MouseEvent<HTMLButtonElement> | Event\n ) => {\n rollbackFilters();\n onCancel?.(event);\n setFilterGroupOpen(false);\n };\n\n const onClearHandler = (event: React.MouseEvent<HTMLButtonElement>) => {\n clearFilters();\n onClear?.(event);\n };\n\n const handleToggle = (event: Event, open: boolean) => {\n /* \n If evt is null this toggle wasn't triggered by the user.\n instead it was triggered by the baseDropdown useEffect after\n the datepicker changed the expanded value this baseDropdown behavior needs a review\n */\n if (event === null) return;\n setFilterGroupOpen(open);\n if (!open) onCancelHandler?.(event);\n };\n\n const Header = useMemo(\n () => (\n <>\n <Filters />\n <HvTypography variant=\"label\">{labels?.placeholder}</HvTypography>\n </>\n ),\n [labels?.placeholder]\n );\n\n return (\n <HvBaseDropdown\n ref={ref}\n id={setId(id, \"dropdown\")}\n role=\"combobox\"\n classes={{\n root: classes.dropdown,\n panel: classes.panel,\n selection: classes.baseDropdownSelection,\n header: classes.header,\n }}\n disabled={disabled}\n disablePortal={disablePortal}\n variableWidth\n placement={horizontalPlacement}\n expanded={filterGroupOpen}\n onToggle={handleToggle}\n onClickOutside={onCancelHandler}\n onContainerCreation={focusOnContainer}\n placeholder={Header}\n adornment={<HvFilterGroupCounter />}\n popperProps={{\n modifiers: [{ name: \"preventOverflow\", enabled: escapeWithReference }],\n }}\n aria-haspopup=\"dialog\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-invalid={status === \"invalid\" ? true : undefined}\n aria-errormessage={status === \"invalid\" ? setId(id, \"error\") : undefined}\n aria-describedby={\n [description && setId(id, \"description\"), ariaDescribedBy]\n .join(\" \")\n .trim() || undefined\n }\n {...others}\n >\n <div ref={focusTarget} tabIndex={-1} />\n <div className={classes.root} style={{ height }}>\n <HvFilterGroupLeftPanel\n id={id}\n className={classes.leftSidePanel}\n emptyElement={leftEmptyElement}\n />\n <HvFilterGroupRightPanel\n id={id}\n className={classes.rightSidePanel}\n emptyElement={rightEmptyElement}\n labels={labels}\n />\n </div>\n <HvActionBar className={classes.actionBar}>\n <HvButton\n id={setId(id, \"clearFilters-button\")}\n disabled={\n defaultValue\n ? defaultValue?.flat().length === filterValues?.flat().length\n : filterValues?.flat().length === 0\n }\n variant=\"secondaryGhost\"\n onClick={onClearHandler}\n >\n {labels?.clearLabel}\n </HvButton>\n <div aria-hidden=\"true\" className={classes.space}>\n &nbsp;\n </div>\n <HvButton\n id={setId(id, \"apply-button\")}\n disabled={applyDisabled}\n variant={\n activeTheme?.filterGroup.applyButtonVariant as HvButtonVariant\n }\n onClick={onApplyHandler}\n className={classes.applyButton}\n >\n {labels?.applyLabel}\n </HvButton>\n <HvButton\n id={setId(id, \"cancel-button\")}\n variant={\n activeTheme?.filterGroup.cancelButtonVariant as HvButtonVariant\n }\n onClick={onCancelHandler}\n >\n {labels?.cancelLabel}\n </HvButton>\n </HvActionBar>\n </HvBaseDropdown>\n );\n});\n"],"names":["forwardRef","useDefaultProps","useClasses","useTheme","useState","useContext","HvFilterGroupContext","useRef","useMemo","jsxs","Fragment","jsx","Filters","HvTypography","HvBaseDropdown","setId","HvFilterGroupCounter","HvFilterGroupLeftPanel","HvFilterGroupRightPanel","HvActionBar","HvButton"],"mappings":"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"}
1
+ {"version":3,"file":"FilterContent.cjs","sources":["../../../../src/FilterGroup/FilterContent/FilterContent.tsx"],"sourcesContent":["import { forwardRef, useContext, useMemo, useRef, useState } from \"react\";\nimport { Filters } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useTheme } from \"../../hooks/useTheme\";\nimport { HvActionBar } from \"../../ActionBar\";\nimport { HvBaseDropdown, HvBaseDropdownProps } from \"../../BaseDropdown\";\nimport { HvButton, HvButtonVariant } from \"../../Button\";\nimport { HvFormStatus } from \"../../Forms\";\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { setId } from \"../../utils/setId\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvFilterGroupValue, HvFilterGroupHorizontalPlacement } from \"../types\";\nimport { staticClasses, useClasses } from \"./FilterContent.styles\";\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { HvFilterGroupCounter } from \"../Counter\";\nimport { HvFilterGroupLeftPanel } from \"../LeftPanel\";\nimport { HvFilterGroupRightPanel } from \"../RightPanel\";\nimport type { HvFilterGroupLabels } from \"../FilterGroup\";\n\nexport { staticClasses as filterGroupContentClasses };\n\nexport type HvFilterGroupContentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupContentProps\n extends Omit<HvBaseDropdownProps, \"onChange\"> {\n description?: React.ReactNode;\n status?: HvFormStatus;\n onChange?: (\n event: React.MouseEvent<HTMLButtonElement>,\n value?: HvFilterGroupValue\n ) => void;\n onCancel?: (event: React.MouseEvent<HTMLButtonElement> | Event) => void;\n onClear?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n labels?: HvFilterGroupLabels;\n horizontalPlacement?: HvFilterGroupHorizontalPlacement;\n disablePortal?: boolean;\n escapeWithReference?: boolean;\n height?: string | number;\n leftEmptyElement?: React.ReactNode;\n rightEmptyElement?: React.ReactNode;\n disabled?: boolean;\n classes?: HvFilterGroupContentClasses;\n}\n\nexport const HvFilterGroupContent = forwardRef<\n HTMLDivElement,\n HvFilterGroupContentProps\n>((props, ref) => {\n const {\n id,\n status,\n disabled = false,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n onChange,\n onCancel,\n onClear,\n labels,\n horizontalPlacement = \"right\",\n disablePortal = true,\n escapeWithReference = true,\n height,\n leftEmptyElement,\n rightEmptyElement,\n classes: classesProp,\n ...others\n } = useDefaultProps(\"HvFilterGroupContent\", props);\n\n const { classes } = useClasses(classesProp);\n const { activeTheme } = useTheme();\n\n const [filterGroupOpen, setFilterGroupOpen] = useState<boolean>(false);\n\n const {\n defaultValue,\n filterValues,\n rollbackFilters,\n clearFilters,\n applyFilters,\n applyDisabled,\n } = useContext(HvFilterGroupContext);\n\n const focusTarget = useRef<HTMLDivElement>(null);\n\n const focusOnContainer = () => {\n focusTarget.current?.focus();\n };\n\n const onApplyHandler = (event: React.MouseEvent<HTMLButtonElement>) => {\n applyFilters();\n onChange?.(event, filterValues);\n setFilterGroupOpen(false);\n };\n\n const onCancelHandler = (\n event: React.MouseEvent<HTMLButtonElement> | Event\n ) => {\n rollbackFilters();\n onCancel?.(event);\n setFilterGroupOpen(false);\n };\n\n const onClearHandler = (event: React.MouseEvent<HTMLButtonElement>) => {\n clearFilters();\n onClear?.(event);\n };\n\n const handleToggle = (event: Event, open: boolean) => {\n /* \n If evt is null this toggle wasn't triggered by the user.\n instead it was triggered by the baseDropdown useEffect after\n the datepicker changed the expanded value this baseDropdown behavior needs a review\n */\n if (event === null) return;\n setFilterGroupOpen(open);\n if (!open) onCancelHandler?.(event);\n };\n\n const Header = useMemo(\n () => (\n <>\n <Filters />\n <HvTypography variant=\"label\">{labels?.placeholder}</HvTypography>\n </>\n ),\n [labels?.placeholder]\n );\n\n return (\n <HvBaseDropdown\n ref={ref}\n id={setId(id, \"dropdown\")}\n role=\"combobox\"\n classes={{\n root: classes.dropdown,\n panel: classes.panel,\n selection: classes.baseDropdownSelection,\n header: classes.header,\n }}\n disabled={disabled}\n disablePortal={disablePortal}\n variableWidth\n placement={horizontalPlacement}\n expanded={filterGroupOpen}\n onToggle={handleToggle}\n onClickOutside={onCancelHandler}\n onContainerCreation={focusOnContainer}\n placeholder={Header}\n adornment={<HvFilterGroupCounter />}\n popperProps={{\n modifiers: [{ name: \"preventOverflow\", enabled: escapeWithReference }],\n }}\n aria-haspopup=\"dialog\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-invalid={status === \"invalid\" ? true : undefined}\n aria-errormessage={status === \"invalid\" ? setId(id, \"error\") : undefined}\n aria-describedby={\n [description && setId(id, \"description\"), ariaDescribedBy]\n .join(\" \")\n .trim() || undefined\n }\n {...others}\n >\n <div ref={focusTarget} tabIndex={-1} />\n <div className={classes.root} style={{ height }}>\n <HvFilterGroupLeftPanel\n id={id}\n className={classes.leftSidePanel}\n emptyElement={leftEmptyElement}\n />\n <HvFilterGroupRightPanel\n id={id}\n className={classes.rightSidePanel}\n emptyElement={rightEmptyElement}\n labels={labels}\n />\n </div>\n <HvActionBar className={classes.actionBar}>\n <HvButton\n id={setId(id, \"clearFilters-button\")}\n disabled={\n defaultValue\n ? defaultValue?.flat().length === filterValues?.flat().length\n : filterValues?.flat().length === 0\n }\n variant=\"secondaryGhost\"\n onClick={onClearHandler}\n >\n {labels?.clearLabel}\n </HvButton>\n <div aria-hidden=\"true\" className={classes.space}>\n &nbsp;\n </div>\n <HvButton\n id={setId(id, \"apply-button\")}\n disabled={applyDisabled}\n variant={\n activeTheme?.filterGroup.applyButtonVariant as HvButtonVariant\n }\n onClick={onApplyHandler}\n className={classes.applyButton}\n >\n {labels?.applyLabel}\n </HvButton>\n <HvButton\n id={setId(id, \"cancel-button\")}\n variant={\n activeTheme?.filterGroup.cancelButtonVariant as HvButtonVariant\n }\n onClick={onCancelHandler}\n >\n {labels?.cancelLabel}\n </HvButton>\n </HvActionBar>\n </HvBaseDropdown>\n );\n});\n"],"names":["forwardRef","useDefaultProps","useClasses","useTheme","useState","useContext","HvFilterGroupContext","useRef","useMemo","jsxs","Fragment","jsx","Filters","HvTypography","HvBaseDropdown","setId","HvFilterGroupCounter","HvFilterGroupLeftPanel","HvFilterGroupRightPanel","HvActionBar","HvButton"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"FilterGroup.cjs","sources":["../../../src/FilterGroup/FilterGroup.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport {\n HvFormElement,\n HvFormElementProps,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvWarningText,\n} from \"../Forms\";\nimport { useLabels } from \"../hooks/useLabels\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport {\n HvFilterGroupContent,\n HvFilterGroupContentProps,\n} from \"./FilterContent\";\nimport { staticClasses, useClasses } from \"./FilterGroup.styles\";\nimport { HvFilterGroupProvider } from \"./FilterGroupContext\";\nimport {\n HvFilterGroupFilters,\n HvFilterGroupHorizontalPlacement,\n HvFilterGroupValue,\n} from \"./types\";\n\nexport { staticClasses as filterGroupClasses };\n\nexport type HvFilterGroupClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupProps\n extends Omit<\n HvFormElementProps,\n \"classes\" | \"onChange\" | \"defaultValue\" | \"statusMessage\"\n > {\n /** The initial value of the input when in single calendar mode. */\n filters: HvFilterGroupFilters;\n /** The form element name. */\n name?: string;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be provided instead.\n */\n label?: React.ReactNode;\n /** Provide additional descriptive text for the form element. */\n description?: React.ReactNode;\n /** Indicates that the form element is disabled. */\n disabled?: boolean;\n /** Indicates that user input is required on the form element. */\n required?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to the state.\n */\n status?: HvFormStatus;\n /** The error message to show when `status` is \"invalid\". Defaults to \"Required\". */\n statusMessage?: React.ReactNode;\n /** The callback fired when the cancel button is clicked. */\n onCancel?: (event: React.MouseEvent<HTMLButtonElement> | Event) => void;\n /** The callback fired when the clear filters button is clicked. */\n onClear?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /** The callback fired when the value changes. */\n onChange?: (\n event: React.MouseEvent<HTMLButtonElement>,\n value?: HvFilterGroupValue\n ) => void;\n /** An Object containing the various text associated with the input. */\n labels?: HvFilterGroupLabels;\n /** The placeholder value when nothing is selected. */\n placeholder?: string;\n /** The default value of the filter group. If defined the clear action will reset to it. */\n defaultValue?: HvFilterGroupValue;\n /** The value of the filter group. */\n value?: HvFilterGroupValue;\n /** The placement where the filter group should be placed according to the input. Options are `left` or `right`. */\n horizontalPlacement?: HvFilterGroupHorizontalPlacement;\n /** Disable the portal behavior. The children stay within it's parent DOM hierarchy. */\n disablePortal?: boolean;\n /** Sets if the filter container should be out of the screen or stay visible. */\n escapeWithReference?: boolean;\n /** The height of the filter panel, between 295 and 425. Defaults to 350 */\n height?: number | string;\n /** The filter content props */\n filterContentProps?: Partial<HvFilterGroupContentProps>;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFilterGroupClasses;\n}\n\nconst DEFAULT_LABELS = {\n /** Apply button label. */\n applyLabel: \"Apply\",\n /** Cancel button label. */\n cancelLabel: \"Cancel\",\n /** Clear button label. */\n clearLabel: \"Clear Filters\",\n /** Placeholder label. */\n placeholder: \"Filters\",\n /** SearchBox placeholder label. */\n searchBoxPlaceholder: \"Search\",\n /** Select All placeholder label. */\n selectAll: \"All\",\n /** Multi selection conjunction placeholder label. */\n multiSelectionConjunction: \"/\",\n};\n\nexport type HvFilterGroupLabels = Partial<typeof DEFAULT_LABELS>;\n\n/**\n * This component implements one potential use-case of the Filter Group pattern Design System Specifies.\n * Due to the enormous variety of capabilities required for this, we strongly recommend checking the code of the component and extend it yourself,\n * while we do not provide a better approach for building this component with smaller and more composable parts.\n */\nexport const HvFilterGroup = forwardRef<HTMLDivElement, HvFilterGroupProps>(\n (props, ref) => {\n const {\n className,\n id,\n name,\n required = false,\n disabled = false,\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n onChange,\n onCancel,\n onClear,\n status,\n statusMessage,\n labels: labelsProp,\n defaultValue,\n value,\n filters,\n horizontalPlacement = \"right\",\n disablePortal = true,\n escapeWithReference = true,\n height = 350,\n filterContentProps,\n classes: classesProp,\n ...others\n } = useDefaultProps(\"HvFilterGroup\", props);\n\n const { classes, cx } = useClasses(classesProp);\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const elementId = useUniqueId(id, \"hvfiltergroup\");\n\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const hasLabel = label != null;\n\n const hasDescription = description != null;\n\n // Error message area will only be needed if the status is being controlled\n // or if required is true\n const canShowError = status !== undefined || required;\n\n return (\n <HvFormElement\n id={id}\n name={name}\n value={value}\n status={status}\n disabled={disabled}\n required={required}\n className={cx(classes.root, className)}\n {...others}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n className={classes.label}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n id={setId(elementId, \"description\")}\n className={classes.description}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvFilterGroupProvider\n defaultValue={defaultValue}\n value={value}\n filters={filters}\n >\n <HvFilterGroupContent\n ref={ref}\n id={elementId}\n disabled={disabled}\n disablePortal={disablePortal}\n variableWidth\n placement={horizontalPlacement}\n escapeWithReference={escapeWithReference}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n status={status}\n onChange={onChange}\n onCancel={onCancel}\n onClear={onClear}\n labels={labels}\n height={height}\n {...filterContentProps}\n />\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFilterGroupProvider>\n </HvFormElement>\n );\n }\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","useControlled","useUniqueId","useLabels","jsxs","HvFormElement","jsx","HvLabel","setId","HvInfoMessage","HvFilterGroupProvider","HvFilterGroupContent","HvWarningText"],"mappings":"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"}
1
+ {"version":3,"file":"FilterGroup.cjs","sources":["../../../src/FilterGroup/FilterGroup.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport {\n HvFormElement,\n HvFormElementProps,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvWarningText,\n} from \"../Forms\";\nimport { useLabels } from \"../hooks/useLabels\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport {\n HvFilterGroupContent,\n HvFilterGroupContentProps,\n} from \"./FilterContent\";\nimport { staticClasses, useClasses } from \"./FilterGroup.styles\";\nimport { HvFilterGroupProvider } from \"./FilterGroupContext\";\nimport {\n HvFilterGroupFilters,\n HvFilterGroupHorizontalPlacement,\n HvFilterGroupValue,\n} from \"./types\";\n\nexport { staticClasses as filterGroupClasses };\n\nexport type HvFilterGroupClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupProps\n extends Omit<\n HvFormElementProps,\n \"classes\" | \"onChange\" | \"defaultValue\" | \"statusMessage\"\n > {\n /** The initial value of the input when in single calendar mode. */\n filters: HvFilterGroupFilters;\n /** The form element name. */\n name?: string;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be provided instead.\n */\n label?: React.ReactNode;\n /** Provide additional descriptive text for the form element. */\n description?: React.ReactNode;\n /** Indicates that the form element is disabled. */\n disabled?: boolean;\n /** Indicates that user input is required on the form element. */\n required?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to the state.\n */\n status?: HvFormStatus;\n /** The error message to show when `status` is \"invalid\". Defaults to \"Required\". */\n statusMessage?: React.ReactNode;\n /** The callback fired when the cancel button is clicked. */\n onCancel?: (event: React.MouseEvent<HTMLButtonElement> | Event) => void;\n /** The callback fired when the clear filters button is clicked. */\n onClear?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /** The callback fired when the value changes. */\n onChange?: (\n event: React.MouseEvent<HTMLButtonElement>,\n value?: HvFilterGroupValue\n ) => void;\n /** An Object containing the various text associated with the input. */\n labels?: HvFilterGroupLabels;\n /** The placeholder value when nothing is selected. */\n placeholder?: string;\n /** The default value of the filter group. If defined the clear action will reset to it. */\n defaultValue?: HvFilterGroupValue;\n /** The value of the filter group. */\n value?: HvFilterGroupValue;\n /** The placement where the filter group should be placed according to the input. Options are `left` or `right`. */\n horizontalPlacement?: HvFilterGroupHorizontalPlacement;\n /** Disable the portal behavior. The children stay within it's parent DOM hierarchy. */\n disablePortal?: boolean;\n /** Sets if the filter container should be out of the screen or stay visible. */\n escapeWithReference?: boolean;\n /** The height of the filter panel, between 295 and 425. Defaults to 350 */\n height?: number | string;\n /** The filter content props */\n filterContentProps?: Partial<HvFilterGroupContentProps>;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFilterGroupClasses;\n}\n\nconst DEFAULT_LABELS = {\n /** Apply button label. */\n applyLabel: \"Apply\",\n /** Cancel button label. */\n cancelLabel: \"Cancel\",\n /** Clear button label. */\n clearLabel: \"Clear Filters\",\n /** Placeholder label. */\n placeholder: \"Filters\",\n /** SearchBox placeholder label. */\n searchBoxPlaceholder: \"Search\",\n /** Select All placeholder label. */\n selectAll: \"All\",\n /** Multi selection conjunction placeholder label. */\n multiSelectionConjunction: \"/\",\n};\n\nexport type HvFilterGroupLabels = Partial<typeof DEFAULT_LABELS>;\n\n/**\n * This component implements one potential use-case of the Filter Group pattern Design System Specifies.\n * Due to the enormous variety of capabilities required for this, we strongly recommend checking the code of the component and extend it yourself,\n * while we do not provide a better approach for building this component with smaller and more composable parts.\n */\nexport const HvFilterGroup = forwardRef<HTMLDivElement, HvFilterGroupProps>(\n (props, ref) => {\n const {\n className,\n id,\n name,\n required = false,\n disabled = false,\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n onChange,\n onCancel,\n onClear,\n status,\n statusMessage,\n labels: labelsProp,\n defaultValue,\n value,\n filters,\n horizontalPlacement = \"right\",\n disablePortal = true,\n escapeWithReference = true,\n height = 350,\n filterContentProps,\n classes: classesProp,\n ...others\n } = useDefaultProps(\"HvFilterGroup\", props);\n\n const { classes, cx } = useClasses(classesProp);\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const elementId = useUniqueId(id, \"hvfiltergroup\");\n\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const hasLabel = label != null;\n\n const hasDescription = description != null;\n\n // Error message area will only be needed if the status is being controlled\n // or if required is true\n const canShowError = status !== undefined || required;\n\n return (\n <HvFormElement\n id={id}\n name={name}\n value={value}\n status={status}\n disabled={disabled}\n required={required}\n className={cx(classes.root, className)}\n {...others}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n className={classes.label}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n id={setId(elementId, \"description\")}\n className={classes.description}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvFilterGroupProvider\n defaultValue={defaultValue}\n value={value}\n filters={filters}\n >\n <HvFilterGroupContent\n ref={ref}\n id={elementId}\n disabled={disabled}\n disablePortal={disablePortal}\n variableWidth\n placement={horizontalPlacement}\n escapeWithReference={escapeWithReference}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n status={status}\n onChange={onChange}\n onCancel={onCancel}\n onClear={onClear}\n labels={labels}\n height={height}\n {...filterContentProps}\n />\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFilterGroupProvider>\n </HvFormElement>\n );\n }\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","useControlled","useUniqueId","useLabels","jsxs","HvFormElement","jsx","HvLabel","setId","HvInfoMessage","HvFilterGroupProvider","HvFilterGroupContent","HvWarningText"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"FilterGroupContext.cjs","sources":["../../../src/FilterGroup/FilterGroupContext.tsx"],"sourcesContent":["import {\n Dispatch,\n SetStateAction,\n createContext,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from \"react\";\n\nimport isEqual from \"lodash/isEqual\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { useSavedState } from \"../utils/useSavedState\";\n\nimport { HvFilterGroupFilters, HvFilterGroupValue } from \"./types\";\n\ninterface HvFilterGroupContextValue {\n activeGroup: number;\n setActiveGroup: Dispatch<SetStateAction<number>>;\n filterOptions: HvFilterGroupFilters;\n setFilterValues: (value?: HvFilterGroupValue, save?: boolean) => void;\n rollbackFilters: () => void;\n clearFilters: () => void;\n applyFilters: () => void;\n applyDisabled: boolean;\n appliedFilters?: HvFilterGroupValue;\n defaultValue?: HvFilterGroupValue;\n filterValues?: HvFilterGroupValue;\n}\n\nexport const HvFilterGroupContext = createContext<HvFilterGroupContextValue>({\n activeGroup: 0,\n setActiveGroup: () => {},\n filterOptions: [],\n setFilterValues: () => {},\n rollbackFilters: () => {},\n clearFilters: () => {},\n applyFilters: () => {},\n applyDisabled: false,\n filterValues: [],\n appliedFilters: undefined,\n defaultValue: undefined,\n});\n\nconst groups = (filters: HvFilterGroupFilters) => filters.map(() => []);\n\ninterface HvFilterGroupProviderProps {\n children: React.ReactNode;\n filters: HvFilterGroupFilters;\n defaultValue?: HvFilterGroupValue;\n value?: HvFilterGroupValue;\n}\n\nexport const HvFilterGroupProvider = (props: HvFilterGroupProviderProps) => {\n const { defaultValue, value, filters, children } = useDefaultProps(\n \"HvFilterGroupProvider\",\n props\n );\n\n const [group, setActiveGroup] = useState<number>(0);\n const [filterValues, setFilterValues, rollbackFilters, appliedFilters] =\n useSavedState<HvFilterGroupValue>(value || groups(filters));\n const [applyDisabled, setApplyDisabled] = useState<boolean>(false);\n\n useEffect(() => {\n setFilterValues(value, true);\n }, [value, setFilterValues]);\n\n useEffect(() => {\n setApplyDisabled(isEqual(filterValues, appliedFilters));\n }, [filterValues, appliedFilters]);\n\n const clearFilters = useCallback(() => {\n setFilterValues(defaultValue || groups(filters));\n }, [filters, setFilterValues, defaultValue]);\n\n const applyFilters = useCallback(() => {\n setFilterValues(filterValues, true);\n }, [filterValues, setFilterValues]);\n\n const contextValue: HvFilterGroupContextValue = useMemo(\n () => ({\n activeGroup: group,\n setActiveGroup,\n filterOptions: filters,\n filterValues,\n setFilterValues,\n appliedFilters,\n rollbackFilters,\n clearFilters,\n applyFilters,\n applyDisabled,\n defaultValue,\n }),\n [\n appliedFilters,\n applyDisabled,\n applyFilters,\n clearFilters,\n filterValues,\n filters,\n group,\n rollbackFilters,\n setFilterValues,\n defaultValue,\n ]\n );\n\n return (\n <HvFilterGroupContext.Provider value={contextValue}>\n {children}\n </HvFilterGroupContext.Provider>\n );\n};\n"],"names":["createContext","useDefaultProps","useState","useSavedState","useEffect","isEqual","useCallback","useMemo"],"mappings":";;;;;;;;;AAgCO,MAAM,uBAAuBA,MAAAA,cAAyC;AAAA,EAC3E,aAAa;AAAA,EACb,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,eAAe,CAAC;AAAA,EAChB,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,cAAc,MAAM;AAAA,EAAC;AAAA,EACrB,cAAc,MAAM;AAAA,EAAC;AAAA,EACrB,eAAe;AAAA,EACf,cAAc,CAAC;AAAA,EACf,gBAAgB;AAAA,EAChB,cAAc;AAChB,CAAC;AAED,MAAM,SAAS,CAAC,YAAkC,QAAQ,IAAI,MAAM,CAAE,CAAA;AASzD,MAAA,wBAAwB,CAAC,UAAsC;AAC1E,QAAM,EAAE,cAAc,OAAO,SAAS,SAAa,IAAAC,gBAAA;AAAA,IACjD;AAAA,IACA;AAAA,EAAA;AAGF,QAAM,CAAC,OAAO,cAAc,IAAIC,eAAiB,CAAC;AAC5C,QAAA,CAAC,cAAc,iBAAiB,iBAAiB,cAAc,IACnEC,cAAkC,cAAA,SAAS,OAAO,OAAO,CAAC;AAC5D,QAAM,CAAC,eAAe,gBAAgB,IAAID,eAAkB,KAAK;AAEjEE,QAAAA,UAAU,MAAM;AACd,oBAAgB,OAAO,IAAI;AAAA,EAAA,GAC1B,CAAC,OAAO,eAAe,CAAC;AAE3BA,QAAAA,UAAU,MAAM;AACG,qBAAAC,iBAAA,QAAQ,cAAc,cAAc,CAAC;AAAA,EAAA,GACrD,CAAC,cAAc,cAAc,CAAC;AAE3B,QAAA,eAAeC,MAAAA,YAAY,MAAM;AACrB,oBAAA,gBAAgB,OAAO,OAAO,CAAC;AAAA,EAC9C,GAAA,CAAC,SAAS,iBAAiB,YAAY,CAAC;AAErC,QAAA,eAAeA,MAAAA,YAAY,MAAM;AACrC,oBAAgB,cAAc,IAAI;AAAA,EAAA,GACjC,CAAC,cAAc,eAAe,CAAC;AAElC,QAAM,eAA0CC,MAAA;AAAA,IAC9C,OAAO;AAAA,MACL,aAAa;AAAA,MACb;AAAA,MACA,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAGF,wCACG,qBAAqB,UAArB,EAA8B,OAAO,cACnC,SACH,CAAA;AAEJ;;;"}
1
+ {"version":3,"file":"FilterGroupContext.cjs","sources":["../../../src/FilterGroup/FilterGroupContext.tsx"],"sourcesContent":["import {\n Dispatch,\n SetStateAction,\n createContext,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from \"react\";\nimport isEqual from \"lodash/isEqual\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useSavedState } from \"../utils/useSavedState\";\nimport { HvFilterGroupFilters, HvFilterGroupValue } from \"./types\";\n\ninterface HvFilterGroupContextValue {\n activeGroup: number;\n setActiveGroup: Dispatch<SetStateAction<number>>;\n filterOptions: HvFilterGroupFilters;\n setFilterValues: (value?: HvFilterGroupValue, save?: boolean) => void;\n rollbackFilters: () => void;\n clearFilters: () => void;\n applyFilters: () => void;\n applyDisabled: boolean;\n appliedFilters?: HvFilterGroupValue;\n defaultValue?: HvFilterGroupValue;\n filterValues?: HvFilterGroupValue;\n}\n\nexport const HvFilterGroupContext = createContext<HvFilterGroupContextValue>({\n activeGroup: 0,\n setActiveGroup: () => {},\n filterOptions: [],\n setFilterValues: () => {},\n rollbackFilters: () => {},\n clearFilters: () => {},\n applyFilters: () => {},\n applyDisabled: false,\n filterValues: [],\n appliedFilters: undefined,\n defaultValue: undefined,\n});\n\nconst groups = (filters: HvFilterGroupFilters) => filters.map(() => []);\n\ninterface HvFilterGroupProviderProps {\n children: React.ReactNode;\n filters: HvFilterGroupFilters;\n defaultValue?: HvFilterGroupValue;\n value?: HvFilterGroupValue;\n}\n\nexport const HvFilterGroupProvider = (props: HvFilterGroupProviderProps) => {\n const { defaultValue, value, filters, children } = useDefaultProps(\n \"HvFilterGroupProvider\",\n props\n );\n\n const [group, setActiveGroup] = useState<number>(0);\n const [filterValues, setFilterValues, rollbackFilters, appliedFilters] =\n useSavedState<HvFilterGroupValue>(value || groups(filters));\n const [applyDisabled, setApplyDisabled] = useState<boolean>(false);\n\n useEffect(() => {\n setFilterValues(value, true);\n }, [value, setFilterValues]);\n\n useEffect(() => {\n setApplyDisabled(isEqual(filterValues, appliedFilters));\n }, [filterValues, appliedFilters]);\n\n const clearFilters = useCallback(() => {\n setFilterValues(defaultValue || groups(filters));\n }, [filters, setFilterValues, defaultValue]);\n\n const applyFilters = useCallback(() => {\n setFilterValues(filterValues, true);\n }, [filterValues, setFilterValues]);\n\n const contextValue: HvFilterGroupContextValue = useMemo(\n () => ({\n activeGroup: group,\n setActiveGroup,\n filterOptions: filters,\n filterValues,\n setFilterValues,\n appliedFilters,\n rollbackFilters,\n clearFilters,\n applyFilters,\n applyDisabled,\n defaultValue,\n }),\n [\n appliedFilters,\n applyDisabled,\n applyFilters,\n clearFilters,\n filterValues,\n filters,\n group,\n rollbackFilters,\n setFilterValues,\n defaultValue,\n ]\n );\n\n return (\n <HvFilterGroupContext.Provider value={contextValue}>\n {children}\n </HvFilterGroupContext.Provider>\n );\n};\n"],"names":["createContext","useDefaultProps","useState","useSavedState","useEffect","isEqual","useCallback","useMemo"],"mappings":";;;;;;;;;AA6BO,MAAM,uBAAuBA,MAAAA,cAAyC;AAAA,EAC3E,aAAa;AAAA,EACb,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,eAAe,CAAC;AAAA,EAChB,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,cAAc,MAAM;AAAA,EAAC;AAAA,EACrB,cAAc,MAAM;AAAA,EAAC;AAAA,EACrB,eAAe;AAAA,EACf,cAAc,CAAC;AAAA,EACf,gBAAgB;AAAA,EAChB,cAAc;AAChB,CAAC;AAED,MAAM,SAAS,CAAC,YAAkC,QAAQ,IAAI,MAAM,CAAE,CAAA;AASzD,MAAA,wBAAwB,CAAC,UAAsC;AAC1E,QAAM,EAAE,cAAc,OAAO,SAAS,SAAa,IAAAC,gBAAA;AAAA,IACjD;AAAA,IACA;AAAA,EAAA;AAGF,QAAM,CAAC,OAAO,cAAc,IAAIC,eAAiB,CAAC;AAC5C,QAAA,CAAC,cAAc,iBAAiB,iBAAiB,cAAc,IACnEC,cAAkC,cAAA,SAAS,OAAO,OAAO,CAAC;AAC5D,QAAM,CAAC,eAAe,gBAAgB,IAAID,eAAkB,KAAK;AAEjEE,QAAAA,UAAU,MAAM;AACd,oBAAgB,OAAO,IAAI;AAAA,EAAA,GAC1B,CAAC,OAAO,eAAe,CAAC;AAE3BA,QAAAA,UAAU,MAAM;AACG,qBAAAC,iBAAA,QAAQ,cAAc,cAAc,CAAC;AAAA,EAAA,GACrD,CAAC,cAAc,cAAc,CAAC;AAE3B,QAAA,eAAeC,MAAAA,YAAY,MAAM;AACrB,oBAAA,gBAAgB,OAAO,OAAO,CAAC;AAAA,EAC9C,GAAA,CAAC,SAAS,iBAAiB,YAAY,CAAC;AAErC,QAAA,eAAeA,MAAAA,YAAY,MAAM;AACrC,oBAAgB,cAAc,IAAI;AAAA,EAAA,GACjC,CAAC,cAAc,eAAe,CAAC;AAElC,QAAM,eAA0CC,MAAA;AAAA,IAC9C,OAAO;AAAA,MACL,aAAa;AAAA,MACb;AAAA,MACA,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAGF,wCACG,qBAAqB,UAArB,EAA8B,OAAO,cACnC,SACH,CAAA;AAEJ;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"LeftPanel.cjs","sources":["../../../../src/FilterGroup/LeftPanel/LeftPanel.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvListContainer, HvListItem } from \"../../ListContainer\";\nimport { HvPanel } from \"../../Panel\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { setId } from \"../../utils/setId\";\nimport { wrapperTooltip } from \"../../utils/wrapperTooltip\";\n\nimport { HvFilterGroupCounter } from \"../Counter\";\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { staticClasses, useClasses } from \"./LeftPanel.styles\";\n\nexport { staticClasses as filterGroupLeftPanelClasses };\n\nexport type HvFilterGroupLeftPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupLeftPanelProps {\n id?: string;\n className?: string;\n emptyElement?: React.ReactNode;\n classes?: HvFilterGroupLeftPanelClasses;\n}\n\nexport const HvFilterGroupLeftPanel = ({\n id,\n className,\n emptyElement,\n classes: classesProp,\n}: HvFilterGroupLeftPanelProps) => {\n const { classes, cx } = useClasses(classesProp);\n const { filterOptions, activeGroup, setActiveGroup } =\n useContext(HvFilterGroupContext);\n\n return (\n <HvPanel id={setId(id, \"leftPanel\")} className={className}>\n {filterOptions.length > 0 ? (\n <HvListContainer id={setId(id, \"leftPanel-list\")} condensed interactive>\n {filterOptions.map((group, index) => {\n const ItemText = wrapperTooltip(true, group.name, group.name);\n\n return (\n <HvListItem\n id={group.id}\n key={group.name}\n className={cx(classes.listItem)}\n onClick={() => setActiveGroup(index)}\n selected={filterOptions[activeGroup].id === group.id}\n endAdornment={<HvFilterGroupCounter id={group.id} />}\n >\n <ItemText />\n </HvListItem>\n );\n })}\n </HvListContainer>\n ) : (\n emptyElement\n )}\n </HvPanel>\n );\n};\n"],"names":["useClasses","useContext","HvFilterGroupContext","jsx","HvPanel","setId","HvListContainer","wrapperTooltip","HvListItem","HvFilterGroupCounter"],"mappings":";;;;;;;;;;;;AAuBO,MAAM,yBAAyB,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AACX,MAAmC;AACjC,QAAM,EAAE,SAAS,GAAG,IAAIA,4BAAW,WAAW;AAC9C,QAAM,EAAE,eAAe,aAAa,eAAe,IACjDC,MAAAA,WAAWC,mBAAAA,oBAAoB;AAG/B,SAAAC,2BAAA,IAACC,MAAQ,SAAA,EAAA,IAAIC,MAAAA,MAAM,IAAI,WAAW,GAAG,WAClC,UAAA,cAAc,SAAS,IACrBF,2BAAAA,IAAAG,cAAAA,iBAAA,EAAgB,IAAID,MAAAA,MAAM,IAAI,gBAAgB,GAAG,WAAS,MAAC,aAAW,MACpE,UAAc,cAAA,IAAI,CAAC,OAAO,UAAU;AACnC,UAAM,WAAWE,eAAAA,eAAe,MAAM,MAAM,MAAM,MAAM,IAAI;AAG1D,WAAAJ,2BAAA;AAAA,MAACK,SAAA;AAAA,MAAA;AAAA,QACC,IAAI,MAAM;AAAA,QAEV,WAAW,GAAG,QAAQ,QAAQ;AAAA,QAC9B,SAAS,MAAM,eAAe,KAAK;AAAA,QACnC,UAAU,cAAc,WAAW,EAAE,OAAO,MAAM;AAAA,QAClD,cAAcL,2BAAA,IAACM,QAAqB,sBAAA,EAAA,IAAI,MAAM,IAAI;AAAA,QAElD,yCAAC,UAAS,EAAA;AAAA,MAAA;AAAA,MANL,MAAM;AAAA,IAAA;AAAA,EAOb,CAEH,EACH,CAAA,IAEA,aAEJ,CAAA;AAEJ;;;"}
1
+ {"version":3,"file":"LeftPanel.cjs","sources":["../../../../src/FilterGroup/LeftPanel/LeftPanel.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvListContainer, HvListItem } from \"../../ListContainer\";\nimport { HvPanel } from \"../../Panel\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { setId } from \"../../utils/setId\";\nimport { wrapperTooltip } from \"../../utils/wrapperTooltip\";\nimport { HvFilterGroupCounter } from \"../Counter\";\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { staticClasses, useClasses } from \"./LeftPanel.styles\";\n\nexport { staticClasses as filterGroupLeftPanelClasses };\n\nexport type HvFilterGroupLeftPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupLeftPanelProps {\n id?: string;\n className?: string;\n emptyElement?: React.ReactNode;\n classes?: HvFilterGroupLeftPanelClasses;\n}\n\nexport const HvFilterGroupLeftPanel = ({\n id,\n className,\n emptyElement,\n classes: classesProp,\n}: HvFilterGroupLeftPanelProps) => {\n const { classes, cx } = useClasses(classesProp);\n const { filterOptions, activeGroup, setActiveGroup } =\n useContext(HvFilterGroupContext);\n\n return (\n <HvPanel id={setId(id, \"leftPanel\")} className={className}>\n {filterOptions.length > 0 ? (\n <HvListContainer id={setId(id, \"leftPanel-list\")} condensed interactive>\n {filterOptions.map((group, index) => {\n const ItemText = wrapperTooltip(true, group.name, group.name);\n\n return (\n <HvListItem\n id={group.id}\n key={group.name}\n className={cx(classes.listItem)}\n onClick={() => setActiveGroup(index)}\n selected={filterOptions[activeGroup].id === group.id}\n endAdornment={<HvFilterGroupCounter id={group.id} />}\n >\n <ItemText />\n </HvListItem>\n );\n })}\n </HvListContainer>\n ) : (\n emptyElement\n )}\n </HvPanel>\n );\n};\n"],"names":["useClasses","useContext","HvFilterGroupContext","jsx","HvPanel","setId","HvListContainer","wrapperTooltip","HvListItem","HvFilterGroupCounter"],"mappings":";;;;;;;;;;;;AAsBO,MAAM,yBAAyB,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AACX,MAAmC;AACjC,QAAM,EAAE,SAAS,GAAG,IAAIA,4BAAW,WAAW;AAC9C,QAAM,EAAE,eAAe,aAAa,eAAe,IACjDC,MAAAA,WAAWC,mBAAAA,oBAAoB;AAG/B,SAAAC,2BAAA,IAACC,MAAQ,SAAA,EAAA,IAAIC,MAAAA,MAAM,IAAI,WAAW,GAAG,WAClC,UAAA,cAAc,SAAS,IACrBF,2BAAAA,IAAAG,cAAAA,iBAAA,EAAgB,IAAID,MAAAA,MAAM,IAAI,gBAAgB,GAAG,WAAS,MAAC,aAAW,MACpE,UAAc,cAAA,IAAI,CAAC,OAAO,UAAU;AACnC,UAAM,WAAWE,eAAAA,eAAe,MAAM,MAAM,MAAM,MAAM,IAAI;AAG1D,WAAAJ,2BAAA;AAAA,MAACK,SAAA;AAAA,MAAA;AAAA,QACC,IAAI,MAAM;AAAA,QAEV,WAAW,GAAG,QAAQ,QAAQ;AAAA,QAC9B,SAAS,MAAM,eAAe,KAAK;AAAA,QACnC,UAAU,cAAc,WAAW,EAAE,OAAO,MAAM;AAAA,QAClD,cAAcL,2BAAA,IAACM,QAAqB,sBAAA,EAAA,IAAI,MAAM,IAAI;AAAA,QAElD,yCAAC,UAAS,EAAA;AAAA,MAAA;AAAA,MANL,MAAM;AAAA,IAAA;AAAA,EAOb,CAEH,EACH,CAAA,IAEA,aAEJ,CAAA;AAEJ;;;"}
@@ -30,17 +30,20 @@ const HvFilterGroupRightPanel = ({
30
30
  setFilterValues,
31
31
  activeGroup
32
32
  } = React.useContext(FilterGroupContext.HvFilterGroupContext);
33
- const activeGroupOptions = React.useMemo(
34
- () => filterOptions[activeGroup]?.data.filter(
33
+ const { all: allActiveGroupOptions, enabled: enabledActiveGroupOptions } = React.useMemo(() => {
34
+ const filteredOptions = filterOptions[activeGroup]?.data.filter(
35
35
  (option) => option.name.toLowerCase().includes(searchStr.toLowerCase())
36
- ).map((option) => option.id) || [],
37
- [filterOptions, activeGroup, searchStr]
38
- );
36
+ );
37
+ return {
38
+ all: filteredOptions.map((option) => option.id) || [],
39
+ enabled: filteredOptions.filter((option) => !option.disabled).map((option) => option.id) || []
40
+ };
41
+ }, [filterOptions, activeGroup, searchStr]);
39
42
  const activeFilterValues = React.useMemo(
40
43
  () => filterValues[activeGroup]?.filter(
41
- (value) => activeGroupOptions.includes(value)
44
+ (value) => allActiveGroupOptions.includes(value)
42
45
  ) || [],
43
- [filterValues, activeGroupOptions, activeGroup]
46
+ [filterValues, allActiveGroupOptions, activeGroup]
44
47
  );
45
48
  const listValues = React.useMemo(
46
49
  () => filterOptions[activeGroup]?.data.map((option) => ({
@@ -54,10 +57,10 @@ const HvFilterGroupRightPanel = ({
54
57
  const updateSelectAll = React.useCallback(() => {
55
58
  const nbrSelected = activeFilterValues?.length;
56
59
  const hasSelection = nbrSelected > 0;
57
- const allSelect = nbrSelected === activeGroupOptions.length;
60
+ const allSelect = nbrSelected === allActiveGroupOptions.length;
58
61
  setAnySelected(hasSelection);
59
62
  setAllSelected(hasSelection && allSelect);
60
- }, [activeFilterValues, activeGroupOptions]);
63
+ }, [activeFilterValues, allActiveGroupOptions]);
61
64
  React.useEffect(() => {
62
65
  updateSelectAll();
63
66
  }, [activeFilterValues, updateSelectAll]);
@@ -73,18 +76,22 @@ const HvFilterGroupRightPanel = ({
73
76
  if (anySelected) {
74
77
  if (searchStr !== "") {
75
78
  newFilterValues[activeGroup] = filterValues[activeGroup]?.filter(
76
- (value) => !activeGroupOptions.includes(value)
79
+ (value) => !enabledActiveGroupOptions.includes(value)
77
80
  );
78
81
  } else {
79
82
  newFilterValues[activeGroup] = [];
80
83
  }
81
84
  } else {
82
- newFilterValues[activeGroup] = [...activeGroupOptions];
85
+ const currentOptions = newFilterValues[activeGroup] || [];
86
+ newFilterValues[activeGroup] = [
87
+ ...currentOptions,
88
+ ...enabledActiveGroupOptions
89
+ ];
83
90
  }
84
91
  setFilterValues(newFilterValues);
85
92
  }, [
86
93
  activeGroup,
87
- activeGroupOptions,
94
+ enabledActiveGroupOptions,
88
95
  anySelected,
89
96
  filterValues,
90
97
  setFilterValues,
@@ -94,10 +101,10 @@ const HvFilterGroupRightPanel = ({
94
101
  const nbrSelected = activeFilterValues?.length;
95
102
  const defaultLabel = /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: "span", children: nbrSelected > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
96
103
  /* @__PURE__ */ jsxRuntime.jsx("b", { children: nbrSelected }),
97
- ` ${labels?.multiSelectionConjunction} ${activeGroupOptions.length}`
104
+ ` ${labels?.multiSelectionConjunction} ${allActiveGroupOptions.length}`
98
105
  ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
99
106
  /* @__PURE__ */ jsxRuntime.jsx("b", { children: labels?.selectAll }),
100
- ` (${activeGroupOptions.length})`
107
+ ` (${allActiveGroupOptions.length})`
101
108
  ] }) });
102
109
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.selectAllContainer, children: /* @__PURE__ */ jsxRuntime.jsx(
103
110
  CheckBox.HvCheckBox,
@@ -112,7 +119,7 @@ const HvFilterGroupRightPanel = ({
112
119
  ) });
113
120
  }, [
114
121
  activeFilterValues?.length,
115
- activeGroupOptions.length,
122
+ allActiveGroupOptions.length,
116
123
  allSelected,
117
124
  anySelected,
118
125
  handleSelectAll,
@@ -1 +1 @@
1
- {"version":3,"file":"RightPanel.cjs","sources":["../../../../src/FilterGroup/RightPanel/RightPanel.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useState } from \"react\";\n\nimport cloneDeep from \"lodash/cloneDeep\";\n\nimport { HvCheckBox } from \"../../CheckBox\";\nimport { HvInput } from \"../../Input\";\nimport { HvList, HvListProps } from \"../../List\";\nimport { HvPanel } from \"../../Panel\";\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { setId } from \"../../utils/setId\";\n\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { staticClasses, useClasses } from \"./RightPanel.styles\";\n\nexport { staticClasses as filterGroupRightPanelClasses };\n\nexport type HvFilterGroupRightPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupRightPanelProps {\n id?: string;\n className?: string;\n labels?: {\n searchBoxPlaceholder?: string;\n selectAll?: string;\n multiSelectionConjunction?: string;\n };\n emptyElement?: React.ReactNode;\n classes?: HvFilterGroupRightPanelClasses;\n}\n\nexport const HvFilterGroupRightPanel = ({\n id,\n className,\n labels,\n emptyElement,\n classes: classesProp,\n}: HvFilterGroupRightPanelProps) => {\n const { classes } = useClasses(classesProp);\n const [searchStr, setSearchStr] = useState<string>(\"\");\n const [allSelected, setAllSelected] = useState<boolean>(false);\n const [anySelected, setAnySelected] = useState<boolean>(false);\n\n const {\n filterOptions,\n filterValues = [],\n setFilterValues,\n activeGroup,\n } = useContext(HvFilterGroupContext);\n\n const activeGroupOptions = useMemo(\n () =>\n filterOptions[activeGroup]?.data\n .filter((option) =>\n option.name.toLowerCase().includes(searchStr.toLowerCase())\n )\n .map((option) => option.id) || [],\n [filterOptions, activeGroup, searchStr]\n );\n\n const activeFilterValues = useMemo(\n () =>\n filterValues[activeGroup]?.filter((value) =>\n activeGroupOptions.includes(value)\n ) || [],\n [filterValues, activeGroupOptions, activeGroup]\n );\n\n const listValues = useMemo(\n () =>\n filterOptions[activeGroup]?.data.map((option) => ({\n ...option,\n label: option.name,\n selected: filterValues[activeGroup]?.includes(option.id),\n isHidden:\n option.name.toLowerCase().indexOf(searchStr.toLowerCase()) < 0,\n })) || [],\n [filterOptions, filterValues, activeGroup, searchStr]\n );\n\n const updateSelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n const hasSelection = nbrSelected > 0;\n const allSelect = nbrSelected === activeGroupOptions.length;\n\n setAnySelected(hasSelection);\n setAllSelected(hasSelection && allSelect);\n }, [activeFilterValues, activeGroupOptions]);\n\n useEffect(() => {\n updateSelectAll();\n }, [activeFilterValues, updateSelectAll]);\n\n useEffect(() => setSearchStr(\"\"), [activeGroup]);\n\n const onChangeHandler: HvListProps[\"onChange\"] = (values) => {\n const newFilterValues = filterOptions.map((_, i) =>\n activeGroup === i\n ? values.filter((v) => v.selected).map((v) => v.id)\n : [...(filterValues[i] || [])]\n );\n setFilterValues(newFilterValues as any);\n };\n\n const handleSelectAll = useCallback(() => {\n const newFilterValues = cloneDeep(filterValues);\n\n if (anySelected) {\n if (searchStr !== \"\") {\n newFilterValues[activeGroup] = filterValues[activeGroup]?.filter(\n (value) => !activeGroupOptions.includes(value)\n );\n } else {\n newFilterValues[activeGroup] = [];\n }\n } else {\n newFilterValues[activeGroup] = [...activeGroupOptions];\n }\n\n setFilterValues(newFilterValues);\n }, [\n activeGroup,\n activeGroupOptions,\n anySelected,\n filterValues,\n setFilterValues,\n searchStr,\n ]);\n\n /**\n * Create selectAll component.\n *\n * @returns {*}\n */\n const SelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n\n const defaultLabel = (\n <HvTypography component=\"span\">\n {nbrSelected > 0 ? (\n <>\n <b>{nbrSelected}</b>\n {` ${labels?.multiSelectionConjunction} ${activeGroupOptions.length}`}\n </>\n ) : (\n <>\n <b>{labels?.selectAll}</b>\n {` (${activeGroupOptions.length})`}\n </>\n )}\n </HvTypography>\n );\n\n return (\n <div className={classes.selectAllContainer}>\n <HvCheckBox\n id={setId(id, \"select-all\")}\n label={defaultLabel}\n onChange={() => handleSelectAll()}\n className={classes.selectAll}\n indeterminate={anySelected && !allSelected}\n checked={allSelected}\n />\n </div>\n );\n }, [\n activeFilterValues?.length,\n activeGroupOptions.length,\n allSelected,\n anySelected,\n handleSelectAll,\n id,\n labels,\n classes?.selectAllContainer,\n classes?.selectAll,\n ]);\n\n return (\n <HvPanel id={setId(id, \"rightPanel\")} className={className}>\n {listValues.length > 0 ? (\n <>\n <HvInput\n id={setId(id, \"search\")}\n classes={{\n root: classes.search,\n }}\n type=\"search\"\n placeholder={labels?.searchBoxPlaceholder}\n value={searchStr}\n onChange={(_, str) => setSearchStr(str)}\n />\n <SelectAll />\n <HvList\n key={activeGroup}\n id={setId(id, \"list\")}\n values={listValues}\n className={classes.list}\n multiSelect\n useSelector\n showSelectAll={false}\n onChange={onChangeHandler}\n selectable\n condensed\n hasTooltips\n />\n </>\n ) : (\n emptyElement\n )}\n </HvPanel>\n );\n};\n"],"names":["useClasses","useState","useContext","HvFilterGroupContext","useMemo","useCallback","useEffect","cloneDeep","jsx","HvTypography","jsxs","Fragment","HvCheckBox","setId","HvPanel","HvInput","HvList"],"mappings":"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"}
1
+ {"version":3,"file":"RightPanel.cjs","sources":["../../../../src/FilterGroup/RightPanel/RightPanel.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useState } from \"react\";\nimport cloneDeep from \"lodash/cloneDeep\";\n\nimport { HvCheckBox } from \"../../CheckBox\";\nimport { HvInput } from \"../../Input\";\nimport { HvList, HvListProps } from \"../../List\";\nimport { HvPanel } from \"../../Panel\";\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { setId } from \"../../utils/setId\";\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { staticClasses, useClasses } from \"./RightPanel.styles\";\n\nexport { staticClasses as filterGroupRightPanelClasses };\n\nexport type HvFilterGroupRightPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupRightPanelProps {\n id?: string;\n className?: string;\n labels?: {\n searchBoxPlaceholder?: string;\n selectAll?: string;\n multiSelectionConjunction?: string;\n };\n emptyElement?: React.ReactNode;\n classes?: HvFilterGroupRightPanelClasses;\n}\n\nexport const HvFilterGroupRightPanel = ({\n id,\n className,\n labels,\n emptyElement,\n classes: classesProp,\n}: HvFilterGroupRightPanelProps) => {\n const { classes } = useClasses(classesProp);\n const [searchStr, setSearchStr] = useState<string>(\"\");\n const [allSelected, setAllSelected] = useState<boolean>(false);\n const [anySelected, setAnySelected] = useState<boolean>(false);\n\n const {\n filterOptions,\n filterValues = [],\n setFilterValues,\n activeGroup,\n } = useContext(HvFilterGroupContext);\n\n const { all: allActiveGroupOptions, enabled: enabledActiveGroupOptions } =\n useMemo(() => {\n const filteredOptions = filterOptions[activeGroup]?.data.filter(\n (option) => option.name.toLowerCase().includes(searchStr.toLowerCase())\n );\n\n return {\n all: filteredOptions.map((option) => option.id) || [],\n enabled:\n filteredOptions\n .filter((option) => !option.disabled)\n .map((option) => option.id) || [],\n };\n }, [filterOptions, activeGroup, searchStr]);\n\n const activeFilterValues = useMemo(\n () =>\n filterValues[activeGroup]?.filter((value) =>\n allActiveGroupOptions.includes(value)\n ) || [],\n [filterValues, allActiveGroupOptions, activeGroup]\n );\n\n const listValues = useMemo(\n () =>\n filterOptions[activeGroup]?.data.map((option) => ({\n ...option,\n label: option.name,\n selected: filterValues[activeGroup]?.includes(option.id),\n isHidden:\n option.name.toLowerCase().indexOf(searchStr.toLowerCase()) < 0,\n })) || [],\n [filterOptions, filterValues, activeGroup, searchStr]\n );\n\n const updateSelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n const hasSelection = nbrSelected > 0;\n const allSelect = nbrSelected === allActiveGroupOptions.length;\n\n setAnySelected(hasSelection);\n setAllSelected(hasSelection && allSelect);\n }, [activeFilterValues, allActiveGroupOptions]);\n\n useEffect(() => {\n updateSelectAll();\n }, [activeFilterValues, updateSelectAll]);\n\n useEffect(() => setSearchStr(\"\"), [activeGroup]);\n\n const onChangeHandler: HvListProps[\"onChange\"] = (values) => {\n const newFilterValues = filterOptions.map((_, i) =>\n activeGroup === i\n ? values.filter((v) => v.selected).map((v) => v.id)\n : [...(filterValues[i] || [])]\n );\n setFilterValues(newFilterValues as any);\n };\n\n const handleSelectAll = useCallback(() => {\n const newFilterValues = cloneDeep(filterValues);\n\n if (anySelected) {\n if (searchStr !== \"\") {\n newFilterValues[activeGroup] = filterValues[activeGroup]?.filter(\n (value) => !enabledActiveGroupOptions.includes(value)\n );\n } else {\n newFilterValues[activeGroup] = [];\n }\n } else {\n const currentOptions = newFilterValues[activeGroup] || [];\n newFilterValues[activeGroup] = [\n ...currentOptions,\n ...enabledActiveGroupOptions,\n ];\n }\n\n setFilterValues(newFilterValues);\n }, [\n activeGroup,\n enabledActiveGroupOptions,\n anySelected,\n filterValues,\n setFilterValues,\n searchStr,\n ]);\n\n const SelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n\n const defaultLabel = (\n <HvTypography component=\"span\">\n {nbrSelected > 0 ? (\n <>\n <b>{nbrSelected}</b>\n {` ${labels?.multiSelectionConjunction} ${allActiveGroupOptions.length}`}\n </>\n ) : (\n <>\n <b>{labels?.selectAll}</b>\n {` (${allActiveGroupOptions.length})`}\n </>\n )}\n </HvTypography>\n );\n\n return (\n <div className={classes.selectAllContainer}>\n <HvCheckBox\n id={setId(id, \"select-all\")}\n label={defaultLabel}\n onChange={() => handleSelectAll()}\n className={classes.selectAll}\n indeterminate={anySelected && !allSelected}\n checked={allSelected}\n />\n </div>\n );\n }, [\n activeFilterValues?.length,\n allActiveGroupOptions.length,\n allSelected,\n anySelected,\n handleSelectAll,\n id,\n labels,\n classes?.selectAllContainer,\n classes?.selectAll,\n ]);\n\n return (\n <HvPanel id={setId(id, \"rightPanel\")} className={className}>\n {listValues.length > 0 ? (\n <>\n <HvInput\n id={setId(id, \"search\")}\n classes={{\n root: classes.search,\n }}\n type=\"search\"\n placeholder={labels?.searchBoxPlaceholder}\n value={searchStr}\n onChange={(_, str) => setSearchStr(str)}\n />\n <SelectAll />\n <HvList\n key={activeGroup}\n id={setId(id, \"list\")}\n values={listValues}\n className={classes.list}\n multiSelect\n useSelector\n showSelectAll={false}\n onChange={onChangeHandler}\n selectable\n condensed\n hasTooltips\n />\n </>\n ) : (\n emptyElement\n )}\n </HvPanel>\n );\n};\n"],"names":["useClasses","useState","useContext","HvFilterGroupContext","useMemo","useCallback","useEffect","cloneDeep","jsx","HvTypography","jsxs","Fragment","HvCheckBox","setId","HvPanel","HvInput","HvList"],"mappings":"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"}
@@ -0,0 +1,53 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const jsxRuntime = require("@emotion/react/jsx-runtime");
4
+ const React = require("react");
5
+ const useOption = require("@mui/base/useOption");
6
+ const utils = require("@mui/material/utils");
7
+ const useDefaultProps = require("../hooks/useDefaultProps.cjs");
8
+ const generic = require("../types/generic.cjs");
9
+ const classes = require("../utils/classes.cjs");
10
+ const focusUtils = require("../utils/focusUtils.cjs");
11
+ const ListItem = require("../ListContainer/ListItem/ListItem.cjs");
12
+ const { staticClasses, useClasses } = classes.createClasses("HvOption", {
13
+ root: {},
14
+ highlighted: {
15
+ ...focusUtils.outlineStyles
16
+ }
17
+ });
18
+ const HvOption = generic.fixedForwardRef(function HvOption2(props, ref) {
19
+ const {
20
+ classes: classesProp,
21
+ className,
22
+ disabled = false,
23
+ label,
24
+ value,
25
+ children,
26
+ ...others
27
+ } = useDefaultProps.useDefaultProps("HvOption", props);
28
+ const { classes: classes2, cx } = useClasses(classesProp);
29
+ const optionRef = React.useRef(null);
30
+ const rootRef = utils.useForkRef(optionRef, ref);
31
+ const computedLabel = label ?? (typeof children === "string" ? children : optionRef.current?.textContent?.trim());
32
+ const { getRootProps, selected, highlighted } = useOption.useOption({
33
+ disabled,
34
+ label: computedLabel,
35
+ rootRef,
36
+ value
37
+ });
38
+ return /* @__PURE__ */ jsxRuntime.jsx(
39
+ ListItem.HvListItem,
40
+ {
41
+ ref,
42
+ selected,
43
+ className: cx(classes2.root, className, {
44
+ [classes2.highlighted]: highlighted
45
+ }),
46
+ ...getRootProps(),
47
+ ...others,
48
+ children
49
+ }
50
+ );
51
+ });
52
+ exports.HvOption = HvOption;
53
+ exports.optionClasses = staticClasses;
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Option.cjs","sources":["../../../src/Select/Option.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { useOption } from \"@mui/base/useOption\";\nimport { OptionOwnProps } from \"@mui/base/Option\";\nimport { useForkRef } from \"@mui/material/utils\";\n\nimport { HvListItem, HvListItemProps } from \"../ListContainer\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { fixedForwardRef } from \"../types/generic\";\nimport { ExtractNames, createClasses } from \"../utils/classes\";\nimport { outlineStyles } from \"../utils/focusUtils\";\n\nconst { staticClasses, useClasses } = createClasses(\"HvOption\", {\n root: {},\n highlighted: {\n ...outlineStyles,\n },\n});\n\nexport { staticClasses as optionClasses };\n\nexport type HvOptionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvOptionProps<OptionValue extends {}>\n extends Omit<HvListItemProps, \"value\" | \"disabled\">,\n Pick<OptionOwnProps<OptionValue>, \"disabled\" | \"label\" | \"value\"> {\n classes?: HvOptionClasses;\n}\n\nexport const HvOption = fixedForwardRef(function HvOption<\n OptionValue extends {}\n>(props: HvOptionProps<OptionValue>, ref: React.Ref<HTMLLIElement>) {\n const {\n classes: classesProp,\n className,\n disabled = false,\n label,\n value,\n children,\n ...others\n } = useDefaultProps(\"HvOption\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const optionRef = useRef<HTMLElement>(null);\n const rootRef = useForkRef(optionRef, ref);\n\n const computedLabel =\n label ??\n (typeof children === \"string\"\n ? children\n : optionRef.current?.textContent?.trim());\n\n const { getRootProps, selected, highlighted } = useOption({\n disabled,\n label: computedLabel,\n rootRef,\n value,\n });\n\n return (\n <HvListItem\n ref={ref}\n selected={selected}\n className={cx(classes.root, className, {\n [classes.highlighted]: highlighted,\n })}\n {...getRootProps()}\n {...others}\n >\n {children}\n </HvListItem>\n );\n});\n"],"names":["createClasses","outlineStyles","fixedForwardRef","HvOption","useDefaultProps","classes","useRef","useForkRef","useOption","jsx","HvListItem"],"mappings":";;;;;;;;;;;AAWA,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,YAAY;AAAA,EAC9D,MAAM,CAAC;AAAA,EACP,aAAa;AAAA,IACX,GAAGC,WAAA;AAAA,EACL;AACF,CAAC;AAYM,MAAM,WAAWC,QAAAA,gBAAgB,SAASC,UAE/C,OAAmC,KAA+B;AAC5D,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDC,gBAAgB,gBAAA,YAAY,KAAK;AACrC,QAAM,EAAE,SAAAC,UAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,YAAYC,aAAoB,IAAI;AACpC,QAAA,UAAUC,MAAAA,WAAW,WAAW,GAAG;AAEnC,QAAA,gBACJ,UACC,OAAO,aAAa,WACjB,WACA,UAAU,SAAS,aAAa,KAAK;AAE3C,QAAM,EAAE,cAAc,UAAU,YAAA,IAAgBC,UAAAA,UAAU;AAAA,IACxD;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EAAA,CACD;AAGC,SAAAC,2BAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,WAAW,GAAGL,SAAQ,MAAM,WAAW;AAAA,QACrC,CAACA,SAAQ,WAAW,GAAG;AAAA,MAAA,CACxB;AAAA,MACA,GAAG,aAAa;AAAA,MAChB,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;;;"}
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const jsxRuntime = require("@emotion/react/jsx-runtime");
4
+ const React = require("react");
5
+ const OptionGroup = require("@mui/base/OptionGroup");
6
+ const uikitStyles = require("@hitachivantara/uikit-styles");
7
+ const classes = require("../utils/classes.cjs");
8
+ const useDefaultProps = require("../hooks/useDefaultProps.cjs");
9
+ const { staticClasses, useClasses } = classes.createClasses("HvOptionGroup", {
10
+ root: {
11
+ listStyle: "none",
12
+ ...uikitStyles.theme.typography.label
13
+ }
14
+ });
15
+ const HvOptionGroup = React.forwardRef(
16
+ (props, ref) => {
17
+ const {
18
+ className,
19
+ classes: classesProp,
20
+ ...others
21
+ } = useDefaultProps.useDefaultProps("HvOptionGroup", props);
22
+ const { classes: classes2, cx } = useClasses(classesProp);
23
+ return /* @__PURE__ */ jsxRuntime.jsx(
24
+ OptionGroup.OptionGroup,
25
+ {
26
+ ref,
27
+ className: cx(classes2.root, className),
28
+ ...others
29
+ }
30
+ );
31
+ }
32
+ );
33
+ exports.HvOptionGroup = HvOptionGroup;
34
+ exports.optionGroupClasses = staticClasses;
@@ -0,0 +1 @@
1
+ {"version":3,"file":"OptionGroup.cjs","sources":["../../../src/Select/OptionGroup.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { OptionGroup, OptionGroupProps } from \"@mui/base/OptionGroup\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { ExtractNames, createClasses } from \"../utils/classes\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nconst { staticClasses, useClasses } = createClasses(\"HvOptionGroup\", {\n root: {\n listStyle: \"none\",\n ...theme.typography.label,\n },\n});\n\nexport { staticClasses as optionGroupClasses };\n\nexport type HvOptionGroupClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvOptionGroupProps extends OptionGroupProps {\n classes?: HvOptionGroupClasses;\n}\n\nexport const HvOptionGroup = forwardRef<HTMLLIElement, HvOptionGroupProps>(\n (props, ref) => {\n const {\n className,\n classes: classesProp,\n ...others\n } = useDefaultProps(\"HvOptionGroup\", props);\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <OptionGroup\n ref={ref}\n className={cx(classes.root, className)}\n {...others}\n />\n );\n }\n);\n"],"names":["createClasses","theme","forwardRef","useDefaultProps","classes","jsx","OptionGroup"],"mappings":";;;;;;;;AAOA,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,iBAAiB;AAAA,EACnE,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,GAAGC,YAAAA,MAAM,WAAW;AAAA,EACtB;AACF,CAAC;AAUM,MAAM,gBAAgBC,MAAA;AAAA,EAC3B,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA,SAAS;AAAA,MACT,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,iBAAiB,KAAK;AAC1C,UAAM,EAAE,SAAAC,UAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,WAAAC,2BAAA;AAAA,MAACC,YAAA;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAGF,SAAQ,MAAM,SAAS;AAAA,QACpC,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;;;"}