@launchpad-ui/filter 0.6.10 → 0.6.12

package/dist/index.es.js

@@ -43,28 +43,23 @@ const AppliedFilterButton = /* @__PURE__ */ forwardRef((props, ref) => {
     "data-test-id": testId = "applied-filter-button"
   } = props;
   const hasDescription = Children.count(children) !== 0;
-  return /* @__PURE__ */ jsx("div", {
-    "data-test-id": testId,
-    children: /* @__PURE__ */ jsxs("button", {
+  return /* @__PURE__ */ jsx("div", { "data-test-id": testId, children: /* @__PURE__ */ jsxs(
+    "button",
+    {
       "aria-haspopup": true,
       className: cx(styles.appliedButton, className),
       ref,
       onClick: onClickFilterButton,
-      children: [name2 && /* @__PURE__ */ jsxs("span", {
-        className: styles.appliedName,
-        "data-test-id": `${testId}-name`,
-        children: [name2, hasDescription && ":"]
-      }), hasDescription && /* @__PURE__ */ jsx("span", {
-        className: styles.appliedDescription,
-        "data-test-id": `${testId}-description`,
-        children
-      }), /* @__PURE__ */ jsx(Icon, {
-        name: "chevron-down",
-        size: "small",
-        "data-test-id": `${testId}-expand`
-      })]
-    })
-  });
+      children: [
+        name2 && /* @__PURE__ */ jsxs("span", { className: styles.appliedName, "data-test-id": `${testId}-name`, children: [
+          name2,
+          hasDescription && ":"
+        ] }),
+        hasDescription && /* @__PURE__ */ jsx("span", { className: styles.appliedDescription, "data-test-id": `${testId}-description`, children }),
+        /* @__PURE__ */ jsx(Icon, { name: "chevron-down", size: "small", "data-test-id": `${testId}-expand` })
+      ]
+    }
+  ) });
 });
 AppliedFilterButton.displayName = "AppliedFilterButton";
 const FilterMenu = ({
@@ -83,51 +78,62 @@ const FilterMenu = ({
   size,
   "data-test-id": testId = "filter-menu"
 }) => {
-  const filterOptions = isLoading ? [{
-    name: "loading...",
-    value: "loading...",
-    isDisabled: true
-  }] : options;
-  return /* @__PURE__ */ jsxs(Fragment, {
-    children: [onClearFilter && /* @__PURE__ */ jsx(Button, {
-      tabIndex: 0,
-      className: styles.filterClearButton,
-      onClick: onClearFilter,
-      kind: "link",
-      "data-test-id": "clear-filter-button",
-      children: "CLEAR FILTER"
-    }), /* @__PURE__ */ jsxs(Menu, {
-      enableVirtualization,
-      size,
-      "data-test-id": testId,
-      onSelect,
-      children: [enableSearch && /* @__PURE__ */ jsx(MenuSearch, {
-        value: searchValue,
-        id: searchId,
-        placeholder: searchPlaceholder,
-        onChange: onSearchChange,
-        ariaLabel: searchAriaLabel
-      }), filterOptions.map((option, index) => {
-        if (option.isDivider) {
-          return /* @__PURE__ */ jsx(MenuDivider, {}, `divider-${index}`);
-        }
-        return /* @__PURE__ */ jsx(MenuItem, {
-          item: option,
-          disabled: option.isDisabled,
-          icon: option.isChecked ? /* @__PURE__ */ jsx(Icon, {
-            name: "check"
-          }) : void 0,
-          role: "menuitemradio",
-          "aria-checked": option.isChecked ? "true" : void 0,
-          nested: option.nested,
-          groupHeader: option.groupHeader,
-          tooltip: option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : void 0,
-          tooltipPlacement: "right",
-          children: option.name
-        }, option.value);
-      })]
-    })]
-  });
+  const filterOptions = isLoading ? [{ name: "loading...", value: "loading...", isDisabled: true }] : options;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    onClearFilter && /* @__PURE__ */ jsx(
+      Button,
+      {
+        tabIndex: 0,
+        className: styles.filterClearButton,
+        onClick: onClearFilter,
+        kind: "link",
+        "data-test-id": "clear-filter-button",
+        children: "CLEAR FILTER"
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      Menu,
+      {
+        enableVirtualization,
+        size,
+        "data-test-id": testId,
+        onSelect,
+        children: [
+          enableSearch && /* @__PURE__ */ jsx(
+            MenuSearch,
+            {
+              value: searchValue,
+              id: searchId,
+              placeholder: searchPlaceholder,
+              onChange: onSearchChange,
+              ariaLabel: searchAriaLabel
+            }
+          ),
+          filterOptions.map((option, index) => {
+            if (option.isDivider) {
+              return /* @__PURE__ */ jsx(MenuDivider, {}, `divider-${index}`);
+            }
+            return /* @__PURE__ */ jsx(
+              MenuItem,
+              {
+                item: option,
+                disabled: option.isDisabled,
+                icon: option.isChecked ? /* @__PURE__ */ jsx(Icon, { name: "check" }) : void 0,
+                role: "menuitemradio",
+                "aria-checked": option.isChecked ? "true" : void 0,
+                nested: option.nested,
+                groupHeader: option.groupHeader,
+                tooltip: option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : void 0,
+                tooltipPlacement: "right",
+                children: option.name
+              },
+              option.value
+            );
+          })
+        ]
+      }
+    )
+  ] });
 };
 const SEARCH_INPUT_THRESHOLD$1 = 4;
 const AppliedFilter = ({
@@ -148,28 +154,31 @@ const AppliedFilter = ({
   ...props
 }) => {
   const enableSearch = onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD$1 || !isEmpty);
-  return /* @__PURE__ */ jsxs(Dropdown, {
-    targetClassName: className,
-    placement: "bottom-start",
-    enableArrow: false,
-    ...props,
-    children: [/* @__PURE__ */ jsx(AppliedFilterButton, {
-      "data-test-id": testId,
-      name: name2,
-      onClickFilterButton,
-      children: description2
-    }), /* @__PURE__ */ jsx(FilterMenu, {
-      options,
-      searchValue,
-      searchPlaceholder,
-      enableSearch,
-      searchAriaLabel,
-      searchId,
-      onSearchChange,
-      onClearFilter,
-      isLoading
-    })]
-  });
+  return /* @__PURE__ */ jsxs(Dropdown, { targetClassName: className, placement: "bottom-start", enableArrow: false, ...props, children: [
+    /* @__PURE__ */ jsx(
+      AppliedFilterButton,
+      {
+        "data-test-id": testId,
+        name: name2,
+        onClickFilterButton,
+        children: description2
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      FilterMenu,
+      {
+        options,
+        searchValue,
+        searchPlaceholder,
+        enableSearch,
+        searchAriaLabel,
+        searchId,
+        onSearchChange,
+        onClearFilter,
+        isLoading
+      }
+    )
+  ] });
 };
 const FilterButton = /* @__PURE__ */ forwardRef((props, ref) => {
   const {
@@ -190,58 +199,47 @@ const FilterButton = /* @__PURE__ */ forwardRef((props, ref) => {
   const nameId = useId();
   const descriptionId = useId();
   const hasDescription = Children.count(children) !== 0;
-  const nameElement = /* @__PURE__ */ jsxs("span", {
-    className: styles.name,
-    children: [name2, hasDescription && ":"]
-  });
+  const nameElement = /* @__PURE__ */ jsxs("span", { className: styles.name, children: [
+    name2,
+    hasDescription && ":"
+  ] });
   const isDisabled = disabled;
   const handleClick = (event) => {
     if (isDisabled)
       return event.preventDefault();
     onClickFilterButton == null ? void 0 : onClickFilterButton();
   };
-  return /* @__PURE__ */ jsxs("div", {
-    className: styles.buttonContainer,
-    "data-test-id": testId,
-    children: [/* @__PURE__ */ jsxs("button", {
-      ...rest,
-      "aria-labelledby": `${nameId} ${hasDescription ? descriptionId : ""}`,
-      "aria-haspopup": true,
-      disabled: isDisabled,
-      "aria-disabled": isDisabled,
-      className: cx(styles.button, className, (isClearable2 || isSelected) && styles.isClearable),
-      ref,
-      onClick: handleClick,
-      children: [hideName ? /* @__PURE__ */ jsx(VisuallyHidden, {
-        id: nameId,
-        children: nameElement
-      }) : /* @__PURE__ */ jsx("span", {
-        id: nameId,
-        children: nameElement
-      }), hasDescription && /* @__PURE__ */ jsx("span", {
-        id: descriptionId,
-        className: styles.description,
-        children
-      }), !isClearable2 && /* @__PURE__ */ jsx(Icon, {
-        name: "chevron-down",
-        size: "small"
-      })]
-    }), isClearable2 && /* @__PURE__ */ jsx(Tooltip, {
-      targetClassName: styles.clearTooltip,
-      content: clearTooltip2,
-      children: /* @__PURE__ */ jsx(IconButton, {
+  return /* @__PURE__ */ jsxs("div", { className: styles.buttonContainer, "data-test-id": testId, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ...rest,
+        "aria-labelledby": `${nameId} ${hasDescription ? descriptionId : ""}`,
+        "aria-haspopup": true,
+        disabled: isDisabled,
+        "aria-disabled": isDisabled,
+        className: cx(styles.button, className, (isClearable2 || isSelected) && styles.isClearable),
+        ref,
+        onClick: handleClick,
+        children: [
+          hideName ? /* @__PURE__ */ jsx(VisuallyHidden, { id: nameId, children: nameElement }) : /* @__PURE__ */ jsx("span", { id: nameId, children: nameElement }),
+          hasDescription && /* @__PURE__ */ jsx("span", { id: descriptionId, className: styles.description, children }),
+          !isClearable2 && /* @__PURE__ */ jsx(Icon, { name: "chevron-down", size: "small" })
+        ]
+      }
+    ),
+    isClearable2 && /* @__PURE__ */ jsx(Tooltip, { targetClassName: styles.clearTooltip, content: clearTooltip2, children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
         "aria-label": ariaLabel,
         className: styles.clear,
         "data-test-id": "clear-filter-button",
-        icon: /* @__PURE__ */ jsx(Icon, {
-          name: "cancel",
-          size: "tiny"
-        }),
+        icon: /* @__PURE__ */ jsx(Icon, { name: "cancel", size: "tiny" }),
         size: "small",
         onClick: onClear
-      })
-    })]
-  });
+      }
+    ) })
+  ] });
 });
 FilterButton.defaultProps = {
   clearTooltip: "Clear filter"
@@ -279,35 +277,47 @@ const Filter = ({
     event.preventDefault();
     onClear == null ? void 0 : onClear();
   };
-  return /* @__PURE__ */ jsxs(Dropdown, {
-    targetTestId: testId,
-    disabled,
-    targetClassName: dropdownClasses,
-    ...props,
-    children: [/* @__PURE__ */ jsx(FilterButton, {
-      isClearable: isClearable2,
-      onClear: handleClear,
-      name: name2,
-      hideName,
+  return /* @__PURE__ */ jsxs(
+    Dropdown,
+    {
+      targetTestId: testId,
       disabled,
-      isSelected,
-      onClickFilterButton,
-      ariaLabel: clearAriaLabel,
-      children: description2
-    }), /* @__PURE__ */ jsx(FilterMenu, {
-      options,
-      searchId,
-      searchValue,
-      searchPlaceholder,
-      searchAriaLabel,
-      enableSearch,
-      onSearchChange,
-      isLoading,
-      disabledOptionTooltip,
-      size,
-      enableVirtualization
-    })]
-  });
+      targetClassName: dropdownClasses,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          FilterButton,
+          {
+            isClearable: isClearable2,
+            onClear: handleClear,
+            name: name2,
+            hideName,
+            disabled,
+            isSelected,
+            onClickFilterButton,
+            ariaLabel: clearAriaLabel,
+            children: description2
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FilterMenu,
+          {
+            options,
+            searchId,
+            searchValue,
+            searchPlaceholder,
+            searchAriaLabel,
+            enableSearch,
+            onSearchChange,
+            isLoading,
+            disabledOptionTooltip,
+            size,
+            enableVirtualization
+          }
+        )
+      ]
+    }
+  );
 };
 export {
   AppliedFilter,

package/dist/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../src/AppliedFilterButton.tsx","../src/FilterMenu.tsx","../src/AppliedFilter.tsx","../src/FilterButton.tsx","../src/Filter.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Icon } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\nimport { Children, forwardRef } from 'react';\n\nimport styles from './styles/Filter.module.css';\n\ntype AppliedFilterButtonProps = {\n  name?: ReactNode;\n  className?: string;\n  children: ReactNode;\n  onClickFilterButton?(): void;\n  'data-test-id'?: string;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst AppliedFilterButton = forwardRef<Ref, AppliedFilterButtonProps>((props, ref) => {\n  const {\n    name,\n    className,\n    children,\n    onClickFilterButton,\n    'data-test-id': testId = 'applied-filter-button',\n  } = props;\n\n  const hasDescription = Children.count(children) !== 0;\n\n  return (\n    <div data-test-id={testId}>\n      <button\n        aria-haspopup\n        className={cx(styles.appliedButton, className)}\n        ref={ref}\n        onClick={onClickFilterButton}\n      >\n        {name && (\n          <span className={styles.appliedName} data-test-id={`${testId}-name`}>\n            {name}\n            {hasDescription && ':'}\n          </span>\n        )}\n        {hasDescription && (\n          <span className={styles.appliedDescription} data-test-id={`${testId}-description`}>\n            {children}\n          </span>\n        )}\n        <Icon name=\"chevron-down\" size=\"small\" data-test-id={`${testId}-expand`} />\n      </button>\n    </div>\n  );\n});\n\nAppliedFilterButton.displayName = 'AppliedFilterButton';\n\nexport type { AppliedFilterButtonProps };\nexport { AppliedFilterButton };\n","import type { MenuProps } from '@launchpad-ui/menu';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { Button } from '@launchpad-ui/button';\nimport { Icon } from '@launchpad-ui/icons';\nimport { Menu, MenuDivider, MenuItem, MenuSearch } from '@launchpad-ui/menu';\n\nimport styles from './styles/Filter.module.css';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype FilterOption<T = any> = {\n  name?: ReactNode;\n  isDisabled?: boolean;\n  isDivider?: boolean;\n  isChecked?: boolean;\n  value: T | null;\n  projKey?: string;\n  nested?: boolean;\n  groupHeader?: boolean;\n};\n\ntype FilterMenuProps = Pick<MenuProps<string>, 'enableVirtualization' | 'size' | 'data-test-id'> & {\n  options: FilterOption[];\n  onClearFilter?(): void;\n  enableSearch?: boolean;\n  searchValue?: string;\n  searchId?: string;\n  searchPlaceholder?: string;\n  searchAriaLabel?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  onSelect?(): void;\n  isLoading?: boolean;\n  disabledOptionTooltip?: string;\n};\n\nconst FilterMenu = ({\n  options,\n  onClearFilter,\n  enableSearch,\n  searchValue,\n  searchPlaceholder,\n  searchAriaLabel,\n  searchId,\n  onSelect,\n  onSearchChange,\n  isLoading = false,\n  disabledOptionTooltip,\n  enableVirtualization,\n  size,\n  'data-test-id': testId = 'filter-menu',\n}: FilterMenuProps) => {\n  const filterOptions = isLoading\n    ? [{ name: 'loading...', value: 'loading...', isDisabled: true }]\n    : options;\n\n  return (\n    <>\n      {onClearFilter && (\n        <Button\n          tabIndex={0}\n          className={styles.filterClearButton}\n          onClick={onClearFilter}\n          kind=\"link\"\n          data-test-id=\"clear-filter-button\"\n        >\n          CLEAR FILTER\n        </Button>\n      )}\n      <Menu\n        enableVirtualization={enableVirtualization}\n        size={size}\n        data-test-id={testId}\n        onSelect={onSelect}\n      >\n        {enableSearch && (\n          <MenuSearch\n            value={searchValue}\n            id={searchId}\n            placeholder={searchPlaceholder}\n            onChange={onSearchChange}\n            ariaLabel={searchAriaLabel}\n          />\n        )}\n        {filterOptions.map((option, index) => {\n          if (option.isDivider) {\n            return <MenuDivider key={`divider-${index}`} />;\n          }\n          return (\n            <MenuItem\n              item={option}\n              disabled={option.isDisabled}\n              icon={option.isChecked ? <Icon name=\"check\" /> : undefined}\n              key={option.value}\n              role=\"menuitemradio\"\n              aria-checked={option.isChecked ? 'true' : undefined}\n              nested={option.nested}\n              groupHeader={option.groupHeader}\n              tooltip={\n                option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : undefined\n              }\n              tooltipPlacement=\"right\"\n            >\n              {option.name}\n            </MenuItem>\n          );\n        })}\n      </Menu>\n    </>\n  );\n};\n\nexport { FilterMenu };\nexport type { FilterOption, FilterMenuProps };\n","import type { FilterOption } from './FilterMenu';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\n\nimport { AppliedFilterButton } from './AppliedFilterButton';\nimport { FilterMenu } from './FilterMenu';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype AppliedFilterProps = {\n  searchValue?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  onClearFilter?(): void;\n  searchPlaceholder?: string;\n  name?: ReactNode;\n  description: ReactNode;\n  options: FilterOption[];\n  className?: string;\n  onStateChange?({ isOpen }: { isOpen?: boolean }): void;\n  onSelect?(item: FilterOption): void;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  onClickFilterButton?(): void;\n  searchAriaLabel?: string;\n  searchId?: string;\n  'data-test-id'?: string;\n};\n\nconst AppliedFilter = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  name,\n  description,\n  options,\n  className,\n  isEmpty,\n  isLoading,\n  onClickFilterButton,\n  onClearFilter,\n  searchAriaLabel,\n  searchId,\n  'data-test-id': testId = 'applied-filter',\n  ...props\n}: AppliedFilterProps) => {\n  const enableSearch =\n    onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n  return (\n    <Dropdown targetClassName={className} placement=\"bottom-start\" enableArrow={false} {...props}>\n      <AppliedFilterButton\n        data-test-id={testId}\n        name={name}\n        onClickFilterButton={onClickFilterButton}\n      >\n        {description}\n      </AppliedFilterButton>\n      <FilterMenu\n        options={options}\n        searchValue={searchValue}\n        searchPlaceholder={searchPlaceholder}\n        enableSearch={enableSearch}\n        searchAriaLabel={searchAriaLabel}\n        searchId={searchId}\n        onSearchChange={onSearchChange}\n        onClearFilter={onClearFilter}\n        isLoading={isLoading}\n      />\n    </Dropdown>\n  );\n};\n\nexport type { AppliedFilterProps };\nexport { AppliedFilter };\n","import type { ReactNode, SyntheticEvent, MouseEvent } from 'react';\n\nimport { IconButton } from '@launchpad-ui/button';\nimport { Icon } from '@launchpad-ui/icons';\nimport { Tooltip } from '@launchpad-ui/tooltip';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { cx } from 'classix';\nimport { Children, forwardRef, useId } from 'react';\n\nimport styles from './styles/Filter.module.css';\n\ntype FilterButtonProps = {\n  name: ReactNode;\n  hideName?: boolean;\n  isClearable?: boolean;\n  onClear?(event: SyntheticEvent): void;\n  className?: string;\n  isSelected?: boolean;\n  clearTooltip?: string | JSX.Element;\n  children?: ReactNode;\n  disabled?: boolean;\n  onClickFilterButton?(): void;\n  'data-test-id'?: string;\n  ariaLabel?: string;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst FilterButton = forwardRef<Ref, FilterButtonProps>((props, ref) => {\n  const {\n    children,\n    name,\n    hideName,\n    isClearable,\n    clearTooltip,\n    onClear,\n    disabled,\n    isSelected,\n    onClickFilterButton,\n    className,\n    'data-test-id': testId = 'filter-button',\n    ariaLabel = 'Clear filter',\n    ...rest\n  } = props;\n  const nameId = useId();\n  const descriptionId = useId();\n\n  const hasDescription = Children.count(children) !== 0;\n\n  const nameElement = (\n    <span className={styles.name}>\n      {name}\n      {hasDescription && ':'}\n    </span>\n  );\n\n  const isDisabled = disabled;\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    if (isDisabled) return event.preventDefault();\n    onClickFilterButton?.();\n  };\n\n  return (\n    <div className={styles.buttonContainer} data-test-id={testId}>\n      <button\n        {...rest}\n        aria-labelledby={`${nameId} ${hasDescription ? descriptionId : ''}`}\n        aria-haspopup\n        disabled={isDisabled}\n        aria-disabled={isDisabled}\n        className={cx(styles.button, className, (isClearable || isSelected) && styles.isClearable)}\n        ref={ref}\n        onClick={handleClick}\n      >\n        {hideName ? (\n          <VisuallyHidden id={nameId}>{nameElement}</VisuallyHidden>\n        ) : (\n          <span id={nameId}>{nameElement}</span>\n        )}\n        {hasDescription && (\n          <span id={descriptionId} className={styles.description}>\n            {children}\n          </span>\n        )}\n        {!isClearable && <Icon name=\"chevron-down\" size=\"small\" />}\n      </button>\n      {isClearable && (\n        <Tooltip targetClassName={styles.clearTooltip} content={clearTooltip}>\n          <IconButton\n            aria-label={ariaLabel}\n            className={styles.clear}\n            data-test-id=\"clear-filter-button\"\n            icon={<Icon name=\"cancel\" size=\"tiny\" />}\n            size=\"small\"\n            onClick={onClear}\n          />\n        </Tooltip>\n      )}\n    </div>\n  );\n});\n\nFilterButton.defaultProps = {\n  clearTooltip: 'Clear filter',\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport { FilterButton };\nexport type { FilterButtonProps };\n","import type { FilterOption } from './FilterMenu';\nimport type { MenuProps } from '@launchpad-ui/menu';\nimport type { ChangeEvent, ReactNode, SyntheticEvent } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\nimport { cx } from 'classix';\n\nimport { FilterButton } from './FilterButton';\nimport { FilterMenu } from './FilterMenu';\nimport styles from './styles/Filter.module.css';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype FilterProps = Pick<MenuProps<string>, 'size' | 'enableVirtualization'> & {\n  searchValue?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  searchPlaceholder?: string;\n  searchAriaLabel?: string;\n  name: ReactNode;\n  hideName?: boolean;\n  description: ReactNode;\n  options: FilterOption[];\n  isClearable?: boolean;\n  onClear?(): void;\n  className?: string;\n  onStateChange?({ isOpen }: { isOpen?: boolean }): void;\n  isSelected?: boolean;\n  searchId?: string;\n  onSelect?(item: FilterOption): void;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  disabled?: boolean;\n  onClickFilterButton?(): void;\n  disabledOptionTooltip?: string;\n  'data-test-id'?: string;\n  triggerTestId?: string;\n  clearAriaLabel?: string;\n};\n\nconst Filter = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  searchAriaLabel,\n  name,\n  hideName,\n  description,\n  options,\n  isClearable,\n  onClear,\n  isSelected,\n  className,\n  isEmpty,\n  searchId,\n  isLoading,\n  onClickFilterButton,\n  disabledOptionTooltip,\n  'data-test-id': testId = 'filter',\n  size,\n  disabled,\n  enableVirtualization,\n  clearAriaLabel,\n  ...props\n}: FilterProps) => {\n  const enableSearch =\n    onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n  const dropdownClasses = cx(styles.filter, className);\n\n  const handleClear = (event: SyntheticEvent) => {\n    event.preventDefault();\n    onClear?.();\n  };\n\n  return (\n    <Dropdown\n      targetTestId={testId}\n      disabled={disabled}\n      targetClassName={dropdownClasses}\n      {...props}\n    >\n      <FilterButton\n        isClearable={isClearable}\n        onClear={handleClear}\n        name={name}\n        hideName={hideName}\n        disabled={disabled}\n        isSelected={isSelected}\n        onClickFilterButton={onClickFilterButton}\n        ariaLabel={clearAriaLabel}\n      >\n        {description}\n      </FilterButton>\n      <FilterMenu\n        options={options}\n        searchId={searchId}\n        searchValue={searchValue}\n        searchPlaceholder={searchPlaceholder}\n        searchAriaLabel={searchAriaLabel}\n        enableSearch={enableSearch}\n        onSearchChange={onSearchChange}\n        isLoading={isLoading}\n        disabledOptionTooltip={disabledOptionTooltip}\n        size={size}\n        enableVirtualization={enableVirtualization}\n      />\n    </Dropdown>\n  );\n};\n\nexport { Filter };\nexport type { FilterProps };\n"],"names":["name","SEARCH_INPUT_THRESHOLD","description","isClearable","clearTooltip"],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../src/AppliedFilterButton.tsx","../src/FilterMenu.tsx","../src/AppliedFilter.tsx","../src/FilterButton.tsx","../src/Filter.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Icon } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\nimport { Children, forwardRef } from 'react';\n\nimport styles from './styles/Filter.module.css';\n\ntype AppliedFilterButtonProps = {\n  name?: ReactNode;\n  className?: string;\n  children: ReactNode;\n  onClickFilterButton?(): void;\n  'data-test-id'?: string;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst AppliedFilterButton = forwardRef<Ref, AppliedFilterButtonProps>((props, ref) => {\n  const {\n    name,\n    className,\n    children,\n    onClickFilterButton,\n    'data-test-id': testId = 'applied-filter-button',\n  } = props;\n\n  const hasDescription = Children.count(children) !== 0;\n\n  return (\n    <div data-test-id={testId}>\n      <button\n        aria-haspopup\n        className={cx(styles.appliedButton, className)}\n        ref={ref}\n        onClick={onClickFilterButton}\n      >\n        {name && (\n          <span className={styles.appliedName} data-test-id={`${testId}-name`}>\n            {name}\n            {hasDescription && ':'}\n          </span>\n        )}\n        {hasDescription && (\n          <span className={styles.appliedDescription} data-test-id={`${testId}-description`}>\n            {children}\n          </span>\n        )}\n        <Icon name=\"chevron-down\" size=\"small\" data-test-id={`${testId}-expand`} />\n      </button>\n    </div>\n  );\n});\n\nAppliedFilterButton.displayName = 'AppliedFilterButton';\n\nexport type { AppliedFilterButtonProps };\nexport { AppliedFilterButton };\n","import type { MenuProps } from '@launchpad-ui/menu';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { Button } from '@launchpad-ui/button';\nimport { Icon } from '@launchpad-ui/icons';\nimport { Menu, MenuDivider, MenuItem, MenuSearch } from '@launchpad-ui/menu';\n\nimport styles from './styles/Filter.module.css';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype FilterOption<T = any> = {\n  name?: ReactNode;\n  isDisabled?: boolean;\n  isDivider?: boolean;\n  isChecked?: boolean;\n  value: T | null;\n  projKey?: string;\n  nested?: boolean;\n  groupHeader?: boolean;\n};\n\ntype FilterMenuProps = Pick<MenuProps<string>, 'enableVirtualization' | 'size' | 'data-test-id'> & {\n  options: FilterOption[];\n  onClearFilter?(): void;\n  enableSearch?: boolean;\n  searchValue?: string;\n  searchId?: string;\n  searchPlaceholder?: string;\n  searchAriaLabel?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  onSelect?(): void;\n  isLoading?: boolean;\n  disabledOptionTooltip?: string;\n};\n\nconst FilterMenu = ({\n  options,\n  onClearFilter,\n  enableSearch,\n  searchValue,\n  searchPlaceholder,\n  searchAriaLabel,\n  searchId,\n  onSelect,\n  onSearchChange,\n  isLoading = false,\n  disabledOptionTooltip,\n  enableVirtualization,\n  size,\n  'data-test-id': testId = 'filter-menu',\n}: FilterMenuProps) => {\n  const filterOptions = isLoading\n    ? [{ name: 'loading...', value: 'loading...', isDisabled: true }]\n    : options;\n\n  return (\n    <>\n      {onClearFilter && (\n        <Button\n          tabIndex={0}\n          className={styles.filterClearButton}\n          onClick={onClearFilter}\n          kind=\"link\"\n          data-test-id=\"clear-filter-button\"\n        >\n          CLEAR FILTER\n        </Button>\n      )}\n      <Menu\n        enableVirtualization={enableVirtualization}\n        size={size}\n        data-test-id={testId}\n        onSelect={onSelect}\n      >\n        {enableSearch && (\n          <MenuSearch\n            value={searchValue}\n            id={searchId}\n            placeholder={searchPlaceholder}\n            onChange={onSearchChange}\n            ariaLabel={searchAriaLabel}\n          />\n        )}\n        {filterOptions.map((option, index) => {\n          if (option.isDivider) {\n            return <MenuDivider key={`divider-${index}`} />;\n          }\n          return (\n            <MenuItem\n              item={option}\n              disabled={option.isDisabled}\n              icon={option.isChecked ? <Icon name=\"check\" /> : undefined}\n              key={option.value}\n              role=\"menuitemradio\"\n              aria-checked={option.isChecked ? 'true' : undefined}\n              nested={option.nested}\n              groupHeader={option.groupHeader}\n              tooltip={\n                option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : undefined\n              }\n              tooltipPlacement=\"right\"\n            >\n              {option.name}\n            </MenuItem>\n          );\n        })}\n      </Menu>\n    </>\n  );\n};\n\nexport { FilterMenu };\nexport type { FilterOption, FilterMenuProps };\n","import type { FilterOption } from './FilterMenu';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\n\nimport { AppliedFilterButton } from './AppliedFilterButton';\nimport { FilterMenu } from './FilterMenu';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype AppliedFilterProps = {\n  searchValue?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  onClearFilter?(): void;\n  searchPlaceholder?: string;\n  name?: ReactNode;\n  description: ReactNode;\n  options: FilterOption[];\n  className?: string;\n  onStateChange?({ isOpen }: { isOpen?: boolean }): void;\n  onSelect?(item: FilterOption): void;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  onClickFilterButton?(): void;\n  searchAriaLabel?: string;\n  searchId?: string;\n  'data-test-id'?: string;\n};\n\nconst AppliedFilter = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  name,\n  description,\n  options,\n  className,\n  isEmpty,\n  isLoading,\n  onClickFilterButton,\n  onClearFilter,\n  searchAriaLabel,\n  searchId,\n  'data-test-id': testId = 'applied-filter',\n  ...props\n}: AppliedFilterProps) => {\n  const enableSearch =\n    onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n  return (\n    <Dropdown targetClassName={className} placement=\"bottom-start\" enableArrow={false} {...props}>\n      <AppliedFilterButton\n        data-test-id={testId}\n        name={name}\n        onClickFilterButton={onClickFilterButton}\n      >\n        {description}\n      </AppliedFilterButton>\n      <FilterMenu\n        options={options}\n        searchValue={searchValue}\n        searchPlaceholder={searchPlaceholder}\n        enableSearch={enableSearch}\n        searchAriaLabel={searchAriaLabel}\n        searchId={searchId}\n        onSearchChange={onSearchChange}\n        onClearFilter={onClearFilter}\n        isLoading={isLoading}\n      />\n    </Dropdown>\n  );\n};\n\nexport type { AppliedFilterProps };\nexport { AppliedFilter };\n","import type { ReactNode, SyntheticEvent, MouseEvent } from 'react';\n\nimport { IconButton } from '@launchpad-ui/button';\nimport { Icon } from '@launchpad-ui/icons';\nimport { Tooltip } from '@launchpad-ui/tooltip';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { cx } from 'classix';\nimport { Children, forwardRef, useId } from 'react';\n\nimport styles from './styles/Filter.module.css';\n\ntype FilterButtonProps = {\n  name: ReactNode;\n  hideName?: boolean;\n  isClearable?: boolean;\n  onClear?(event: SyntheticEvent): void;\n  className?: string;\n  isSelected?: boolean;\n  clearTooltip?: string | JSX.Element;\n  children?: ReactNode;\n  disabled?: boolean;\n  onClickFilterButton?(): void;\n  'data-test-id'?: string;\n  ariaLabel?: string;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst FilterButton = forwardRef<Ref, FilterButtonProps>((props, ref) => {\n  const {\n    children,\n    name,\n    hideName,\n    isClearable,\n    clearTooltip,\n    onClear,\n    disabled,\n    isSelected,\n    onClickFilterButton,\n    className,\n    'data-test-id': testId = 'filter-button',\n    ariaLabel = 'Clear filter',\n    ...rest\n  } = props;\n  const nameId = useId();\n  const descriptionId = useId();\n\n  const hasDescription = Children.count(children) !== 0;\n\n  const nameElement = (\n    <span className={styles.name}>\n      {name}\n      {hasDescription && ':'}\n    </span>\n  );\n\n  const isDisabled = disabled;\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    if (isDisabled) return event.preventDefault();\n    onClickFilterButton?.();\n  };\n\n  return (\n    <div className={styles.buttonContainer} data-test-id={testId}>\n      <button\n        {...rest}\n        aria-labelledby={`${nameId} ${hasDescription ? descriptionId : ''}`}\n        aria-haspopup\n        disabled={isDisabled}\n        aria-disabled={isDisabled}\n        className={cx(styles.button, className, (isClearable || isSelected) && styles.isClearable)}\n        ref={ref}\n        onClick={handleClick}\n      >\n        {hideName ? (\n          <VisuallyHidden id={nameId}>{nameElement}</VisuallyHidden>\n        ) : (\n          <span id={nameId}>{nameElement}</span>\n        )}\n        {hasDescription && (\n          <span id={descriptionId} className={styles.description}>\n            {children}\n          </span>\n        )}\n        {!isClearable && <Icon name=\"chevron-down\" size=\"small\" />}\n      </button>\n      {isClearable && (\n        <Tooltip targetClassName={styles.clearTooltip} content={clearTooltip}>\n          <IconButton\n            aria-label={ariaLabel}\n            className={styles.clear}\n            data-test-id=\"clear-filter-button\"\n            icon={<Icon name=\"cancel\" size=\"tiny\" />}\n            size=\"small\"\n            onClick={onClear}\n          />\n        </Tooltip>\n      )}\n    </div>\n  );\n});\n\nFilterButton.defaultProps = {\n  clearTooltip: 'Clear filter',\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport { FilterButton };\nexport type { FilterButtonProps };\n","import type { FilterOption } from './FilterMenu';\nimport type { MenuProps } from '@launchpad-ui/menu';\nimport type { ChangeEvent, ReactNode, SyntheticEvent } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\nimport { cx } from 'classix';\n\nimport { FilterButton } from './FilterButton';\nimport { FilterMenu } from './FilterMenu';\nimport styles from './styles/Filter.module.css';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype FilterProps = Pick<MenuProps<string>, 'size' | 'enableVirtualization'> & {\n  searchValue?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  searchPlaceholder?: string;\n  searchAriaLabel?: string;\n  name: ReactNode;\n  hideName?: boolean;\n  description: ReactNode;\n  options: FilterOption[];\n  isClearable?: boolean;\n  onClear?(): void;\n  className?: string;\n  onStateChange?({ isOpen }: { isOpen?: boolean }): void;\n  isSelected?: boolean;\n  searchId?: string;\n  onSelect?(item: FilterOption): void;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  disabled?: boolean;\n  onClickFilterButton?(): void;\n  disabledOptionTooltip?: string;\n  'data-test-id'?: string;\n  triggerTestId?: string;\n  clearAriaLabel?: string;\n};\n\nconst Filter = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  searchAriaLabel,\n  name,\n  hideName,\n  description,\n  options,\n  isClearable,\n  onClear,\n  isSelected,\n  className,\n  isEmpty,\n  searchId,\n  isLoading,\n  onClickFilterButton,\n  disabledOptionTooltip,\n  'data-test-id': testId = 'filter',\n  size,\n  disabled,\n  enableVirtualization,\n  clearAriaLabel,\n  ...props\n}: FilterProps) => {\n  const enableSearch =\n    onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n  const dropdownClasses = cx(styles.filter, className);\n\n  const handleClear = (event: SyntheticEvent) => {\n    event.preventDefault();\n    onClear?.();\n  };\n\n  return (\n    <Dropdown\n      targetTestId={testId}\n      disabled={disabled}\n      targetClassName={dropdownClasses}\n      {...props}\n    >\n      <FilterButton\n        isClearable={isClearable}\n        onClear={handleClear}\n        name={name}\n        hideName={hideName}\n        disabled={disabled}\n        isSelected={isSelected}\n        onClickFilterButton={onClickFilterButton}\n        ariaLabel={clearAriaLabel}\n      >\n        {description}\n      </FilterButton>\n      <FilterMenu\n        options={options}\n        searchId={searchId}\n        searchValue={searchValue}\n        searchPlaceholder={searchPlaceholder}\n        searchAriaLabel={searchAriaLabel}\n        enableSearch={enableSearch}\n        onSearchChange={onSearchChange}\n        isLoading={isLoading}\n        disabledOptionTooltip={disabledOptionTooltip}\n        size={size}\n        enableVirtualization={enableVirtualization}\n      />\n    </Dropdown>\n  );\n};\n\nexport { Filter };\nexport type { FilterProps };\n"],"names":["name","SEARCH_INPUT_THRESHOLD","description","isClearable","clearTooltip"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAM,sBAAsB,2BAA0C,CAAC,OAAO,QAAQ;AAC9E,QAAA;AAAA,IACJ,MAAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,SAAS;AAAA,EACvB,IAAA;AAEJ,QAAM,iBAAiB,SAAS,MAAM,QAAQ,MAAM;AAGlD,SAAA,oBAAC,OAAI,EAAA,gBAAc,QACjB,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,iBAAa;AAAA,MACb,WAAW,GAAG,OAAO,eAAe,SAAS;AAAA,MAC7C;AAAA,MACA,SAAS;AAAA,MAER,UAAA;AAAA,QACCA,SAAA,qBAAC,UAAK,WAAW,OAAO,aAAa,gBAAc,GAAG,MAAM,SACzD,UAAA;AAAA,UAAAA;AAAA,UACA,kBAAkB;AAAA,QAAA,GACrB;AAAA,QAED,kBACE,oBAAA,QAAA,EAAK,WAAW,OAAO,oBAAoB,gBAAc,GAAG,MAAM,gBAChE,SACH,CAAA;AAAA,QAEF,oBAAC,QAAK,MAAK,gBAAe,MAAK,SAAQ,gBAAc,GAAG,MAAM,UAAW,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAE7E,EAAA,CAAA;AAEJ,CAAC;AAED,oBAAoB,cAAc;ACnBlC,MAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAC3B,MAAuB;AACf,QAAA,gBAAgB,YAClB,CAAC,EAAE,MAAM,cAAc,OAAO,cAAc,YAAY,KAAM,CAAA,IAC9D;AAEJ,SAEK,qBAAA,UAAA,EAAA,UAAA;AAAA,IACC,iBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,UAAU;AAAA,QACV,WAAW,OAAO;AAAA,QAClB,SAAS;AAAA,QACT,MAAK;AAAA,QACL,gBAAa;AAAA,QACd,UAAA;AAAA,MAAA;AAAA,IAED;AAAA,IAEF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,gBAAc;AAAA,QACd;AAAA,QAEC,UAAA;AAAA,UACC,gBAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,OAAO;AAAA,cACP,IAAI;AAAA,cACJ,aAAa;AAAA,cACb,UAAU;AAAA,cACV,WAAW;AAAA,YAAA;AAAA,UACb;AAAA,UAED,cAAc,IAAI,CAAC,QAAQ,UAAU;AACpC,gBAAI,OAAO,WAAW;AACpB,qBAAQ,oBAAA,aAAA,CAAA,GAAiB,WAAW,KAAK,EAAI;AAAA,YAC/C;AAEE,mBAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,MAAM;AAAA,gBACN,UAAU,OAAO;AAAA,gBACjB,MAAM,OAAO,gCAAa,MAAK,EAAA,MAAK,SAAQ,IAAK;AAAA,gBAEjD,MAAK;AAAA,gBACL,gBAAc,OAAO,YAAY,SAAS;AAAA,gBAC1C,QAAQ,OAAO;AAAA,gBACf,aAAa,OAAO;AAAA,gBACpB,SACE,OAAO,cAAc,wBAAwB,wBAAwB;AAAA,gBAEvE,kBAAiB;AAAA,gBAEhB,UAAO,OAAA;AAAA,cAAA;AAAA,cAVH,OAAO;AAAA,YAAA;AAAA,UAWd,CAEH;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EACF,EAAA,CAAA;AAEJ;ACrGA,MAAMC,2BAAyB;AAqB/B,MAAM,gBAAgB,CAAC;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAAD;AAAA,EACA,aAAAE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB,GAAG;AACL,MAA0B;AAClB,QAAA,eACJ,mBAAmB,CAAC,CAAC,eAAe,QAAQ,SAASD,4BAA0B,CAAC;AAGhF,SAAA,qBAAC,YAAS,iBAAiB,WAAW,WAAU,gBAAe,aAAa,OAAQ,GAAG,OACrF,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,gBAAc;AAAA,QACd,MAAAD;AAAA,QACA;AAAA,QAEC,UAAAE;AAAA,MAAA;AAAA,IACH;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;AC3CA,MAAM,0CAAkD,CAAC,OAAO,QAAQ;AAChE,QAAA;AAAA,IACJ;AAAA,IACA,MAAAF;AAAA,IACA;AAAA,IACA,aAAAG;AAAA,IACA,cAAAC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,SAAS;AAAA,IACzB,YAAY;AAAA,IACZ,GAAG;AAAA,EACD,IAAA;AACJ,QAAM,SAAS;AACf,QAAM,gBAAgB;AAEtB,QAAM,iBAAiB,SAAS,MAAM,QAAQ,MAAM;AAEpD,QAAM,cACJ,qBAAC,QAAK,EAAA,WAAW,OAAO,MACrB,UAAA;AAAA,IAAAJ;AAAA,IACA,kBAAkB;AAAA,EACrB,EAAA,CAAA;AAGF,QAAM,aAAa;AAEb,QAAA,cAAc,CAAC,UAAyC;AACxD,QAAA;AAAY,aAAO,MAAM;AACP;AAAA,EAAA;AAGxB,8BACG,OAAI,EAAA,WAAW,OAAO,iBAAiB,gBAAc,QACpD,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ,mBAAiB,GAAG,MAAM,IAAI,iBAAiB,gBAAgB,EAAE;AAAA,QACjE,iBAAa;AAAA,QACb,UAAU;AAAA,QACV,iBAAe;AAAA,QACf,WAAW,GAAG,OAAO,QAAQ,YAAYG,gBAAe,eAAe,OAAO,WAAW;AAAA,QACzF;AAAA,QACA,SAAS;AAAA,QAER,UAAA;AAAA,UACC,WAAA,oBAAC,gBAAe,EAAA,IAAI,QAAS,UAAA,YAAA,CAAY,IAExC,oBAAA,QAAA,EAAK,IAAI,QAAS,UAAY,aAAA;AAAA,UAEhC,sCACE,QAAK,EAAA,IAAI,eAAe,WAAW,OAAO,aACxC,UACH;AAAA,UAED,CAACA,gBAAe,oBAAC,QAAK,MAAK,gBAAe,MAAK,SAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IAC1D;AAAA,IACCA,gBACE,oBAAA,SAAA,EAAQ,iBAAiB,OAAO,cAAc,SAASC,eACtD,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,cAAY;AAAA,QACZ,WAAW,OAAO;AAAA,QAClB,gBAAa;AAAA,QACb,MAAO,oBAAA,MAAA,EAAK,MAAK,UAAS,MAAK,QAAO;AAAA,QACtC,MAAK;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IAAA,GAEb;AAAA,EAEJ,EAAA,CAAA;AAEJ,CAAC;AAED,aAAa,eAAe;AAAA,EAC1B,cAAc;AAChB;AAEA,aAAa,cAAc;AChG3B,MAAM,yBAAyB;AA4B/B,MAAM,SAAS,CAAC;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAAJ;AAAA,EACA;AAAA,EACA,aAAAE;AAAA,EACA;AAAA,EACA,aAAAC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAmB;AACX,QAAA,eACJ,mBAAmB,CAAC,CAAC,eAAe,QAAQ,SAAS,0BAA0B,CAAC;AAElF,QAAM,kBAAkB,GAAG,OAAO,QAAQ,SAAS;AAE7C,QAAA,cAAc,CAAC,UAA0B;AAC7C,UAAM,eAAe;AACX;AAAA,EAAA;AAIV,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAc;AAAA,MACd;AAAA,MACA,iBAAiB;AAAA,MAChB,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,aAAAA;AAAA,YACA,SAAS;AAAA,YACT,MAAAH;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW;AAAA,YAEV,UAAAE;AAAA,UAAA;AAAA,QACH;AAAA,QACA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/index.js

@@ -45,28 +45,23 @@ const AppliedFilterButton = /* @__PURE__ */ react.forwardRef((props, ref) => {
     "data-test-id": testId = "applied-filter-button"
   } = props;
   const hasDescription = react.Children.count(children) !== 0;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    "data-test-id": testId,
-    children: /* @__PURE__ */ jsxRuntime.jsxs("button", {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-test-id": testId, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
       "aria-haspopup": true,
       className: classix.cx(styles.appliedButton, className),
       ref,
       onClick: onClickFilterButton,
-      children: [name2 && /* @__PURE__ */ jsxRuntime.jsxs("span", {
-        className: styles.appliedName,
-        "data-test-id": `${testId}-name`,
-        children: [name2, hasDescription && ":"]
-      }), hasDescription && /* @__PURE__ */ jsxRuntime.jsx("span", {
-        className: styles.appliedDescription,
-        "data-test-id": `${testId}-description`,
-        children
-      }), /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, {
-        name: "chevron-down",
-        size: "small",
-        "data-test-id": `${testId}-expand`
-      })]
-    })
-  });
+      children: [
+        name2 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: styles.appliedName, "data-test-id": `${testId}-name`, children: [
+          name2,
+          hasDescription && ":"
+        ] }),
+        hasDescription && /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.appliedDescription, "data-test-id": `${testId}-description`, children }),
+        /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, { name: "chevron-down", size: "small", "data-test-id": `${testId}-expand` })
+      ]
+    }
+  ) });
 });
 AppliedFilterButton.displayName = "AppliedFilterButton";
 const FilterMenu = ({
@@ -85,51 +80,62 @@ const FilterMenu = ({
   size,
   "data-test-id": testId = "filter-menu"
 }) => {
-  const filterOptions = isLoading ? [{
-    name: "loading...",
-    value: "loading...",
-    isDisabled: true
-  }] : options;
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [onClearFilter && /* @__PURE__ */ jsxRuntime.jsx(button$1.Button, {
-      tabIndex: 0,
-      className: styles.filterClearButton,
-      onClick: onClearFilter,
-      kind: "link",
-      "data-test-id": "clear-filter-button",
-      children: "CLEAR FILTER"
-    }), /* @__PURE__ */ jsxRuntime.jsxs(menu.Menu, {
-      enableVirtualization,
-      size,
-      "data-test-id": testId,
-      onSelect,
-      children: [enableSearch && /* @__PURE__ */ jsxRuntime.jsx(menu.MenuSearch, {
-        value: searchValue,
-        id: searchId,
-        placeholder: searchPlaceholder,
-        onChange: onSearchChange,
-        ariaLabel: searchAriaLabel
-      }), filterOptions.map((option, index) => {
-        if (option.isDivider) {
-          return /* @__PURE__ */ jsxRuntime.jsx(menu.MenuDivider, {}, `divider-${index}`);
-        }
-        return /* @__PURE__ */ jsxRuntime.jsx(menu.MenuItem, {
-          item: option,
-          disabled: option.isDisabled,
-          icon: option.isChecked ? /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, {
-            name: "check"
-          }) : void 0,
-          role: "menuitemradio",
-          "aria-checked": option.isChecked ? "true" : void 0,
-          nested: option.nested,
-          groupHeader: option.groupHeader,
-          tooltip: option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : void 0,
-          tooltipPlacement: "right",
-          children: option.name
-        }, option.value);
-      })]
-    })]
-  });
+  const filterOptions = isLoading ? [{ name: "loading...", value: "loading...", isDisabled: true }] : options;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    onClearFilter && /* @__PURE__ */ jsxRuntime.jsx(
+      button$1.Button,
+      {
+        tabIndex: 0,
+        className: styles.filterClearButton,
+        onClick: onClearFilter,
+        kind: "link",
+        "data-test-id": "clear-filter-button",
+        children: "CLEAR FILTER"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      menu.Menu,
+      {
+        enableVirtualization,
+        size,
+        "data-test-id": testId,
+        onSelect,
+        children: [
+          enableSearch && /* @__PURE__ */ jsxRuntime.jsx(
+            menu.MenuSearch,
+            {
+              value: searchValue,
+              id: searchId,
+              placeholder: searchPlaceholder,
+              onChange: onSearchChange,
+              ariaLabel: searchAriaLabel
+            }
+          ),
+          filterOptions.map((option, index) => {
+            if (option.isDivider) {
+              return /* @__PURE__ */ jsxRuntime.jsx(menu.MenuDivider, {}, `divider-${index}`);
+            }
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              menu.MenuItem,
+              {
+                item: option,
+                disabled: option.isDisabled,
+                icon: option.isChecked ? /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, { name: "check" }) : void 0,
+                role: "menuitemradio",
+                "aria-checked": option.isChecked ? "true" : void 0,
+                nested: option.nested,
+                groupHeader: option.groupHeader,
+                tooltip: option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : void 0,
+                tooltipPlacement: "right",
+                children: option.name
+              },
+              option.value
+            );
+          })
+        ]
+      }
+    )
+  ] });
 };
 const SEARCH_INPUT_THRESHOLD$1 = 4;
 const AppliedFilter = ({
@@ -150,28 +156,31 @@ const AppliedFilter = ({
   ...props
 }) => {
   const enableSearch = onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD$1 || !isEmpty);
-  return /* @__PURE__ */ jsxRuntime.jsxs(dropdown.Dropdown, {
-    targetClassName: className,
-    placement: "bottom-start",
-    enableArrow: false,
-    ...props,
-    children: [/* @__PURE__ */ jsxRuntime.jsx(AppliedFilterButton, {
-      "data-test-id": testId,
-      name: name2,
-      onClickFilterButton,
-      children: description2
-    }), /* @__PURE__ */ jsxRuntime.jsx(FilterMenu, {
-      options,
-      searchValue,
-      searchPlaceholder,
-      enableSearch,
-      searchAriaLabel,
-      searchId,
-      onSearchChange,
-      onClearFilter,
-      isLoading
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(dropdown.Dropdown, { targetClassName: className, placement: "bottom-start", enableArrow: false, ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      AppliedFilterButton,
+      {
+        "data-test-id": testId,
+        name: name2,
+        onClickFilterButton,
+        children: description2
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      FilterMenu,
+      {
+        options,
+        searchValue,
+        searchPlaceholder,
+        enableSearch,
+        searchAriaLabel,
+        searchId,
+        onSearchChange,
+        onClearFilter,
+        isLoading
+      }
+    )
+  ] });
 };
 const FilterButton = /* @__PURE__ */ react.forwardRef((props, ref) => {
   const {
@@ -192,58 +201,47 @@ const FilterButton = /* @__PURE__ */ react.forwardRef((props, ref) => {
   const nameId = react.useId();
   const descriptionId = react.useId();
   const hasDescription = react.Children.count(children) !== 0;
-  const nameElement = /* @__PURE__ */ jsxRuntime.jsxs("span", {
-    className: styles.name,
-    children: [name2, hasDescription && ":"]
-  });
+  const nameElement = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: styles.name, children: [
+    name2,
+    hasDescription && ":"
+  ] });
   const isDisabled = disabled;
   const handleClick = (event) => {
     if (isDisabled)
       return event.preventDefault();
     onClickFilterButton == null ? void 0 : onClickFilterButton();
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    className: styles.buttonContainer,
-    "data-test-id": testId,
-    children: [/* @__PURE__ */ jsxRuntime.jsxs("button", {
-      ...rest,
-      "aria-labelledby": `${nameId} ${hasDescription ? descriptionId : ""}`,
-      "aria-haspopup": true,
-      disabled: isDisabled,
-      "aria-disabled": isDisabled,
-      className: classix.cx(styles.button, className, (isClearable2 || isSelected) && styles.isClearable),
-      ref,
-      onClick: handleClick,
-      children: [hideName ? /* @__PURE__ */ jsxRuntime.jsx(visuallyHidden.VisuallyHidden, {
-        id: nameId,
-        children: nameElement
-      }) : /* @__PURE__ */ jsxRuntime.jsx("span", {
-        id: nameId,
-        children: nameElement
-      }), hasDescription && /* @__PURE__ */ jsxRuntime.jsx("span", {
-        id: descriptionId,
-        className: styles.description,
-        children
-      }), !isClearable2 && /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, {
-        name: "chevron-down",
-        size: "small"
-      })]
-    }), isClearable2 && /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip, {
-      targetClassName: styles.clearTooltip,
-      content: clearTooltip2,
-      children: /* @__PURE__ */ jsxRuntime.jsx(button$1.IconButton, {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.buttonContainer, "data-test-id": testId, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        ...rest,
+        "aria-labelledby": `${nameId} ${hasDescription ? descriptionId : ""}`,
+        "aria-haspopup": true,
+        disabled: isDisabled,
+        "aria-disabled": isDisabled,
+        className: classix.cx(styles.button, className, (isClearable2 || isSelected) && styles.isClearable),
+        ref,
+        onClick: handleClick,
+        children: [
+          hideName ? /* @__PURE__ */ jsxRuntime.jsx(visuallyHidden.VisuallyHidden, { id: nameId, children: nameElement }) : /* @__PURE__ */ jsxRuntime.jsx("span", { id: nameId, children: nameElement }),
+          hasDescription && /* @__PURE__ */ jsxRuntime.jsx("span", { id: descriptionId, className: styles.description, children }),
+          !isClearable2 && /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, { name: "chevron-down", size: "small" })
+        ]
+      }
+    ),
+    isClearable2 && /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip, { targetClassName: styles.clearTooltip, content: clearTooltip2, children: /* @__PURE__ */ jsxRuntime.jsx(
+      button$1.IconButton,
+      {
         "aria-label": ariaLabel,
         className: styles.clear,
         "data-test-id": "clear-filter-button",
-        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, {
-          name: "cancel",
-          size: "tiny"
-        }),
+        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, { name: "cancel", size: "tiny" }),
         size: "small",
         onClick: onClear
-      })
-    })]
-  });
+      }
+    ) })
+  ] });
 });
 FilterButton.defaultProps = {
   clearTooltip: "Clear filter"
@@ -281,35 +279,47 @@ const Filter = ({
     event.preventDefault();
     onClear == null ? void 0 : onClear();
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs(dropdown.Dropdown, {
-    targetTestId: testId,
-    disabled,
-    targetClassName: dropdownClasses,
-    ...props,
-    children: [/* @__PURE__ */ jsxRuntime.jsx(FilterButton, {
-      isClearable: isClearable2,
-      onClear: handleClear,
-      name: name2,
-      hideName,
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    dropdown.Dropdown,
+    {
+      targetTestId: testId,
       disabled,
-      isSelected,
-      onClickFilterButton,
-      ariaLabel: clearAriaLabel,
-      children: description2
-    }), /* @__PURE__ */ jsxRuntime.jsx(FilterMenu, {
-      options,
-      searchId,
-      searchValue,
-      searchPlaceholder,
-      searchAriaLabel,
-      enableSearch,
-      onSearchChange,
-      isLoading,
-      disabledOptionTooltip,
-      size,
-      enableVirtualization
-    })]
-  });
+      targetClassName: dropdownClasses,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          FilterButton,
+          {
+            isClearable: isClearable2,
+            onClear: handleClear,
+            name: name2,
+            hideName,
+            disabled,
+            isSelected,
+            onClickFilterButton,
+            ariaLabel: clearAriaLabel,
+            children: description2
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          FilterMenu,
+          {
+            options,
+            searchId,
+            searchValue,
+            searchPlaceholder,
+            searchAriaLabel,
+            enableSearch,
+            onSearchChange,
+            isLoading,
+            disabledOptionTooltip,
+            size,
+            enableVirtualization
+          }
+        )
+      ]
+    }
+  );
 };
 exports.AppliedFilter = AppliedFilter;
 exports.Filter = Filter;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/AppliedFilterButton.tsx","../src/FilterMenu.tsx","../src/AppliedFilter.tsx","../src/FilterButton.tsx","../src/Filter.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Icon } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\nimport { Children, forwardRef } from 'react';\n\nimport styles from './styles/Filter.module.css';\n\ntype AppliedFilterButtonProps = {\n  name?: ReactNode;\n  className?: string;\n  children: ReactNode;\n  onClickFilterButton?(): void;\n  'data-test-id'?: string;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst AppliedFilterButton = forwardRef<Ref, AppliedFilterButtonProps>((props, ref) => {\n  const {\n    name,\n    className,\n    children,\n    onClickFilterButton,\n    'data-test-id': testId = 'applied-filter-button',\n  } = props;\n\n  const hasDescription = Children.count(children) !== 0;\n\n  return (\n    <div data-test-id={testId}>\n      <button\n        aria-haspopup\n        className={cx(styles.appliedButton, className)}\n        ref={ref}\n        onClick={onClickFilterButton}\n      >\n        {name && (\n          <span className={styles.appliedName} data-test-id={`${testId}-name`}>\n            {name}\n            {hasDescription && ':'}\n          </span>\n        )}\n        {hasDescription && (\n          <span className={styles.appliedDescription} data-test-id={`${testId}-description`}>\n            {children}\n          </span>\n        )}\n        <Icon name=\"chevron-down\" size=\"small\" data-test-id={`${testId}-expand`} />\n      </button>\n    </div>\n  );\n});\n\nAppliedFilterButton.displayName = 'AppliedFilterButton';\n\nexport type { AppliedFilterButtonProps };\nexport { AppliedFilterButton };\n","import type { MenuProps } from '@launchpad-ui/menu';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { Button } from '@launchpad-ui/button';\nimport { Icon } from '@launchpad-ui/icons';\nimport { Menu, MenuDivider, MenuItem, MenuSearch } from '@launchpad-ui/menu';\n\nimport styles from './styles/Filter.module.css';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype FilterOption<T = any> = {\n  name?: ReactNode;\n  isDisabled?: boolean;\n  isDivider?: boolean;\n  isChecked?: boolean;\n  value: T | null;\n  projKey?: string;\n  nested?: boolean;\n  groupHeader?: boolean;\n};\n\ntype FilterMenuProps = Pick<MenuProps<string>, 'enableVirtualization' | 'size' | 'data-test-id'> & {\n  options: FilterOption[];\n  onClearFilter?(): void;\n  enableSearch?: boolean;\n  searchValue?: string;\n  searchId?: string;\n  searchPlaceholder?: string;\n  searchAriaLabel?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  onSelect?(): void;\n  isLoading?: boolean;\n  disabledOptionTooltip?: string;\n};\n\nconst FilterMenu = ({\n  options,\n  onClearFilter,\n  enableSearch,\n  searchValue,\n  searchPlaceholder,\n  searchAriaLabel,\n  searchId,\n  onSelect,\n  onSearchChange,\n  isLoading = false,\n  disabledOptionTooltip,\n  enableVirtualization,\n  size,\n  'data-test-id': testId = 'filter-menu',\n}: FilterMenuProps) => {\n  const filterOptions = isLoading\n    ? [{ name: 'loading...', value: 'loading...', isDisabled: true }]\n    : options;\n\n  return (\n    <>\n      {onClearFilter && (\n        <Button\n          tabIndex={0}\n          className={styles.filterClearButton}\n          onClick={onClearFilter}\n          kind=\"link\"\n          data-test-id=\"clear-filter-button\"\n        >\n          CLEAR FILTER\n        </Button>\n      )}\n      <Menu\n        enableVirtualization={enableVirtualization}\n        size={size}\n        data-test-id={testId}\n        onSelect={onSelect}\n      >\n        {enableSearch && (\n          <MenuSearch\n            value={searchValue}\n            id={searchId}\n            placeholder={searchPlaceholder}\n            onChange={onSearchChange}\n            ariaLabel={searchAriaLabel}\n          />\n        )}\n        {filterOptions.map((option, index) => {\n          if (option.isDivider) {\n            return <MenuDivider key={`divider-${index}`} />;\n          }\n          return (\n            <MenuItem\n              item={option}\n              disabled={option.isDisabled}\n              icon={option.isChecked ? <Icon name=\"check\" /> : undefined}\n              key={option.value}\n              role=\"menuitemradio\"\n              aria-checked={option.isChecked ? 'true' : undefined}\n              nested={option.nested}\n              groupHeader={option.groupHeader}\n              tooltip={\n                option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : undefined\n              }\n              tooltipPlacement=\"right\"\n            >\n              {option.name}\n            </MenuItem>\n          );\n        })}\n      </Menu>\n    </>\n  );\n};\n\nexport { FilterMenu };\nexport type { FilterOption, FilterMenuProps };\n","import type { FilterOption } from './FilterMenu';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\n\nimport { AppliedFilterButton } from './AppliedFilterButton';\nimport { FilterMenu } from './FilterMenu';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype AppliedFilterProps = {\n  searchValue?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  onClearFilter?(): void;\n  searchPlaceholder?: string;\n  name?: ReactNode;\n  description: ReactNode;\n  options: FilterOption[];\n  className?: string;\n  onStateChange?({ isOpen }: { isOpen?: boolean }): void;\n  onSelect?(item: FilterOption): void;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  onClickFilterButton?(): void;\n  searchAriaLabel?: string;\n  searchId?: string;\n  'data-test-id'?: string;\n};\n\nconst AppliedFilter = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  name,\n  description,\n  options,\n  className,\n  isEmpty,\n  isLoading,\n  onClickFilterButton,\n  onClearFilter,\n  searchAriaLabel,\n  searchId,\n  'data-test-id': testId = 'applied-filter',\n  ...props\n}: AppliedFilterProps) => {\n  const enableSearch =\n    onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n  return (\n    <Dropdown targetClassName={className} placement=\"bottom-start\" enableArrow={false} {...props}>\n      <AppliedFilterButton\n        data-test-id={testId}\n        name={name}\n        onClickFilterButton={onClickFilterButton}\n      >\n        {description}\n      </AppliedFilterButton>\n      <FilterMenu\n        options={options}\n        searchValue={searchValue}\n        searchPlaceholder={searchPlaceholder}\n        enableSearch={enableSearch}\n        searchAriaLabel={searchAriaLabel}\n        searchId={searchId}\n        onSearchChange={onSearchChange}\n        onClearFilter={onClearFilter}\n        isLoading={isLoading}\n      />\n    </Dropdown>\n  );\n};\n\nexport type { AppliedFilterProps };\nexport { AppliedFilter };\n","import type { ReactNode, SyntheticEvent, MouseEvent } from 'react';\n\nimport { IconButton } from '@launchpad-ui/button';\nimport { Icon } from '@launchpad-ui/icons';\nimport { Tooltip } from '@launchpad-ui/tooltip';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { cx } from 'classix';\nimport { Children, forwardRef, useId } from 'react';\n\nimport styles from './styles/Filter.module.css';\n\ntype FilterButtonProps = {\n  name: ReactNode;\n  hideName?: boolean;\n  isClearable?: boolean;\n  onClear?(event: SyntheticEvent): void;\n  className?: string;\n  isSelected?: boolean;\n  clearTooltip?: string | JSX.Element;\n  children?: ReactNode;\n  disabled?: boolean;\n  onClickFilterButton?(): void;\n  'data-test-id'?: string;\n  ariaLabel?: string;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst FilterButton = forwardRef<Ref, FilterButtonProps>((props, ref) => {\n  const {\n    children,\n    name,\n    hideName,\n    isClearable,\n    clearTooltip,\n    onClear,\n    disabled,\n    isSelected,\n    onClickFilterButton,\n    className,\n    'data-test-id': testId = 'filter-button',\n    ariaLabel = 'Clear filter',\n    ...rest\n  } = props;\n  const nameId = useId();\n  const descriptionId = useId();\n\n  const hasDescription = Children.count(children) !== 0;\n\n  const nameElement = (\n    <span className={styles.name}>\n      {name}\n      {hasDescription && ':'}\n    </span>\n  );\n\n  const isDisabled = disabled;\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    if (isDisabled) return event.preventDefault();\n    onClickFilterButton?.();\n  };\n\n  return (\n    <div className={styles.buttonContainer} data-test-id={testId}>\n      <button\n        {...rest}\n        aria-labelledby={`${nameId} ${hasDescription ? descriptionId : ''}`}\n        aria-haspopup\n        disabled={isDisabled}\n        aria-disabled={isDisabled}\n        className={cx(styles.button, className, (isClearable || isSelected) && styles.isClearable)}\n        ref={ref}\n        onClick={handleClick}\n      >\n        {hideName ? (\n          <VisuallyHidden id={nameId}>{nameElement}</VisuallyHidden>\n        ) : (\n          <span id={nameId}>{nameElement}</span>\n        )}\n        {hasDescription && (\n          <span id={descriptionId} className={styles.description}>\n            {children}\n          </span>\n        )}\n        {!isClearable && <Icon name=\"chevron-down\" size=\"small\" />}\n      </button>\n      {isClearable && (\n        <Tooltip targetClassName={styles.clearTooltip} content={clearTooltip}>\n          <IconButton\n            aria-label={ariaLabel}\n            className={styles.clear}\n            data-test-id=\"clear-filter-button\"\n            icon={<Icon name=\"cancel\" size=\"tiny\" />}\n            size=\"small\"\n            onClick={onClear}\n          />\n        </Tooltip>\n      )}\n    </div>\n  );\n});\n\nFilterButton.defaultProps = {\n  clearTooltip: 'Clear filter',\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport { FilterButton };\nexport type { FilterButtonProps };\n","import type { FilterOption } from './FilterMenu';\nimport type { MenuProps } from '@launchpad-ui/menu';\nimport type { ChangeEvent, ReactNode, SyntheticEvent } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\nimport { cx } from 'classix';\n\nimport { FilterButton } from './FilterButton';\nimport { FilterMenu } from './FilterMenu';\nimport styles from './styles/Filter.module.css';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype FilterProps = Pick<MenuProps<string>, 'size' | 'enableVirtualization'> & {\n  searchValue?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  searchPlaceholder?: string;\n  searchAriaLabel?: string;\n  name: ReactNode;\n  hideName?: boolean;\n  description: ReactNode;\n  options: FilterOption[];\n  isClearable?: boolean;\n  onClear?(): void;\n  className?: string;\n  onStateChange?({ isOpen }: { isOpen?: boolean }): void;\n  isSelected?: boolean;\n  searchId?: string;\n  onSelect?(item: FilterOption): void;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  disabled?: boolean;\n  onClickFilterButton?(): void;\n  disabledOptionTooltip?: string;\n  'data-test-id'?: string;\n  triggerTestId?: string;\n  clearAriaLabel?: string;\n};\n\nconst Filter = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  searchAriaLabel,\n  name,\n  hideName,\n  description,\n  options,\n  isClearable,\n  onClear,\n  isSelected,\n  className,\n  isEmpty,\n  searchId,\n  isLoading,\n  onClickFilterButton,\n  disabledOptionTooltip,\n  'data-test-id': testId = 'filter',\n  size,\n  disabled,\n  enableVirtualization,\n  clearAriaLabel,\n  ...props\n}: FilterProps) => {\n  const enableSearch =\n    onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n  const dropdownClasses = cx(styles.filter, className);\n\n  const handleClear = (event: SyntheticEvent) => {\n    event.preventDefault();\n    onClear?.();\n  };\n\n  return (\n    <Dropdown\n      targetTestId={testId}\n      disabled={disabled}\n      targetClassName={dropdownClasses}\n      {...props}\n    >\n      <FilterButton\n        isClearable={isClearable}\n        onClear={handleClear}\n        name={name}\n        hideName={hideName}\n        disabled={disabled}\n        isSelected={isSelected}\n        onClickFilterButton={onClickFilterButton}\n        ariaLabel={clearAriaLabel}\n      >\n        {description}\n      </FilterButton>\n      <FilterMenu\n        options={options}\n        searchId={searchId}\n        searchValue={searchValue}\n        searchPlaceholder={searchPlaceholder}\n        searchAriaLabel={searchAriaLabel}\n        enableSearch={enableSearch}\n        onSearchChange={onSearchChange}\n        isLoading={isLoading}\n        disabledOptionTooltip={disabledOptionTooltip}\n        size={size}\n        enableVirtualization={enableVirtualization}\n      />\n    </Dropdown>\n  );\n};\n\nexport { Filter };\nexport type { FilterProps };\n"],"names":["forwardRef","name","Children","jsx","jsxs","cx","Icon","Fragment","Button","Menu","MenuSearch","MenuDivider","MenuItem","SEARCH_INPUT_THRESHOLD","description","Dropdown","isClearable","clearTooltip","useId","VisuallyHidden","Tooltip","IconButton"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/AppliedFilterButton.tsx","../src/FilterMenu.tsx","../src/AppliedFilter.tsx","../src/FilterButton.tsx","../src/Filter.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Icon } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\nimport { Children, forwardRef } from 'react';\n\nimport styles from './styles/Filter.module.css';\n\ntype AppliedFilterButtonProps = {\n  name?: ReactNode;\n  className?: string;\n  children: ReactNode;\n  onClickFilterButton?(): void;\n  'data-test-id'?: string;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst AppliedFilterButton = forwardRef<Ref, AppliedFilterButtonProps>((props, ref) => {\n  const {\n    name,\n    className,\n    children,\n    onClickFilterButton,\n    'data-test-id': testId = 'applied-filter-button',\n  } = props;\n\n  const hasDescription = Children.count(children) !== 0;\n\n  return (\n    <div data-test-id={testId}>\n      <button\n        aria-haspopup\n        className={cx(styles.appliedButton, className)}\n        ref={ref}\n        onClick={onClickFilterButton}\n      >\n        {name && (\n          <span className={styles.appliedName} data-test-id={`${testId}-name`}>\n            {name}\n            {hasDescription && ':'}\n          </span>\n        )}\n        {hasDescription && (\n          <span className={styles.appliedDescription} data-test-id={`${testId}-description`}>\n            {children}\n          </span>\n        )}\n        <Icon name=\"chevron-down\" size=\"small\" data-test-id={`${testId}-expand`} />\n      </button>\n    </div>\n  );\n});\n\nAppliedFilterButton.displayName = 'AppliedFilterButton';\n\nexport type { AppliedFilterButtonProps };\nexport { AppliedFilterButton };\n","import type { MenuProps } from '@launchpad-ui/menu';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { Button } from '@launchpad-ui/button';\nimport { Icon } from '@launchpad-ui/icons';\nimport { Menu, MenuDivider, MenuItem, MenuSearch } from '@launchpad-ui/menu';\n\nimport styles from './styles/Filter.module.css';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype FilterOption<T = any> = {\n  name?: ReactNode;\n  isDisabled?: boolean;\n  isDivider?: boolean;\n  isChecked?: boolean;\n  value: T | null;\n  projKey?: string;\n  nested?: boolean;\n  groupHeader?: boolean;\n};\n\ntype FilterMenuProps = Pick<MenuProps<string>, 'enableVirtualization' | 'size' | 'data-test-id'> & {\n  options: FilterOption[];\n  onClearFilter?(): void;\n  enableSearch?: boolean;\n  searchValue?: string;\n  searchId?: string;\n  searchPlaceholder?: string;\n  searchAriaLabel?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  onSelect?(): void;\n  isLoading?: boolean;\n  disabledOptionTooltip?: string;\n};\n\nconst FilterMenu = ({\n  options,\n  onClearFilter,\n  enableSearch,\n  searchValue,\n  searchPlaceholder,\n  searchAriaLabel,\n  searchId,\n  onSelect,\n  onSearchChange,\n  isLoading = false,\n  disabledOptionTooltip,\n  enableVirtualization,\n  size,\n  'data-test-id': testId = 'filter-menu',\n}: FilterMenuProps) => {\n  const filterOptions = isLoading\n    ? [{ name: 'loading...', value: 'loading...', isDisabled: true }]\n    : options;\n\n  return (\n    <>\n      {onClearFilter && (\n        <Button\n          tabIndex={0}\n          className={styles.filterClearButton}\n          onClick={onClearFilter}\n          kind=\"link\"\n          data-test-id=\"clear-filter-button\"\n        >\n          CLEAR FILTER\n        </Button>\n      )}\n      <Menu\n        enableVirtualization={enableVirtualization}\n        size={size}\n        data-test-id={testId}\n        onSelect={onSelect}\n      >\n        {enableSearch && (\n          <MenuSearch\n            value={searchValue}\n            id={searchId}\n            placeholder={searchPlaceholder}\n            onChange={onSearchChange}\n            ariaLabel={searchAriaLabel}\n          />\n        )}\n        {filterOptions.map((option, index) => {\n          if (option.isDivider) {\n            return <MenuDivider key={`divider-${index}`} />;\n          }\n          return (\n            <MenuItem\n              item={option}\n              disabled={option.isDisabled}\n              icon={option.isChecked ? <Icon name=\"check\" /> : undefined}\n              key={option.value}\n              role=\"menuitemradio\"\n              aria-checked={option.isChecked ? 'true' : undefined}\n              nested={option.nested}\n              groupHeader={option.groupHeader}\n              tooltip={\n                option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : undefined\n              }\n              tooltipPlacement=\"right\"\n            >\n              {option.name}\n            </MenuItem>\n          );\n        })}\n      </Menu>\n    </>\n  );\n};\n\nexport { FilterMenu };\nexport type { FilterOption, FilterMenuProps };\n","import type { FilterOption } from './FilterMenu';\nimport type { ChangeEvent, ReactNode } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\n\nimport { AppliedFilterButton } from './AppliedFilterButton';\nimport { FilterMenu } from './FilterMenu';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype AppliedFilterProps = {\n  searchValue?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  onClearFilter?(): void;\n  searchPlaceholder?: string;\n  name?: ReactNode;\n  description: ReactNode;\n  options: FilterOption[];\n  className?: string;\n  onStateChange?({ isOpen }: { isOpen?: boolean }): void;\n  onSelect?(item: FilterOption): void;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  onClickFilterButton?(): void;\n  searchAriaLabel?: string;\n  searchId?: string;\n  'data-test-id'?: string;\n};\n\nconst AppliedFilter = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  name,\n  description,\n  options,\n  className,\n  isEmpty,\n  isLoading,\n  onClickFilterButton,\n  onClearFilter,\n  searchAriaLabel,\n  searchId,\n  'data-test-id': testId = 'applied-filter',\n  ...props\n}: AppliedFilterProps) => {\n  const enableSearch =\n    onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n  return (\n    <Dropdown targetClassName={className} placement=\"bottom-start\" enableArrow={false} {...props}>\n      <AppliedFilterButton\n        data-test-id={testId}\n        name={name}\n        onClickFilterButton={onClickFilterButton}\n      >\n        {description}\n      </AppliedFilterButton>\n      <FilterMenu\n        options={options}\n        searchValue={searchValue}\n        searchPlaceholder={searchPlaceholder}\n        enableSearch={enableSearch}\n        searchAriaLabel={searchAriaLabel}\n        searchId={searchId}\n        onSearchChange={onSearchChange}\n        onClearFilter={onClearFilter}\n        isLoading={isLoading}\n      />\n    </Dropdown>\n  );\n};\n\nexport type { AppliedFilterProps };\nexport { AppliedFilter };\n","import type { ReactNode, SyntheticEvent, MouseEvent } from 'react';\n\nimport { IconButton } from '@launchpad-ui/button';\nimport { Icon } from '@launchpad-ui/icons';\nimport { Tooltip } from '@launchpad-ui/tooltip';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { cx } from 'classix';\nimport { Children, forwardRef, useId } from 'react';\n\nimport styles from './styles/Filter.module.css';\n\ntype FilterButtonProps = {\n  name: ReactNode;\n  hideName?: boolean;\n  isClearable?: boolean;\n  onClear?(event: SyntheticEvent): void;\n  className?: string;\n  isSelected?: boolean;\n  clearTooltip?: string | JSX.Element;\n  children?: ReactNode;\n  disabled?: boolean;\n  onClickFilterButton?(): void;\n  'data-test-id'?: string;\n  ariaLabel?: string;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst FilterButton = forwardRef<Ref, FilterButtonProps>((props, ref) => {\n  const {\n    children,\n    name,\n    hideName,\n    isClearable,\n    clearTooltip,\n    onClear,\n    disabled,\n    isSelected,\n    onClickFilterButton,\n    className,\n    'data-test-id': testId = 'filter-button',\n    ariaLabel = 'Clear filter',\n    ...rest\n  } = props;\n  const nameId = useId();\n  const descriptionId = useId();\n\n  const hasDescription = Children.count(children) !== 0;\n\n  const nameElement = (\n    <span className={styles.name}>\n      {name}\n      {hasDescription && ':'}\n    </span>\n  );\n\n  const isDisabled = disabled;\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    if (isDisabled) return event.preventDefault();\n    onClickFilterButton?.();\n  };\n\n  return (\n    <div className={styles.buttonContainer} data-test-id={testId}>\n      <button\n        {...rest}\n        aria-labelledby={`${nameId} ${hasDescription ? descriptionId : ''}`}\n        aria-haspopup\n        disabled={isDisabled}\n        aria-disabled={isDisabled}\n        className={cx(styles.button, className, (isClearable || isSelected) && styles.isClearable)}\n        ref={ref}\n        onClick={handleClick}\n      >\n        {hideName ? (\n          <VisuallyHidden id={nameId}>{nameElement}</VisuallyHidden>\n        ) : (\n          <span id={nameId}>{nameElement}</span>\n        )}\n        {hasDescription && (\n          <span id={descriptionId} className={styles.description}>\n            {children}\n          </span>\n        )}\n        {!isClearable && <Icon name=\"chevron-down\" size=\"small\" />}\n      </button>\n      {isClearable && (\n        <Tooltip targetClassName={styles.clearTooltip} content={clearTooltip}>\n          <IconButton\n            aria-label={ariaLabel}\n            className={styles.clear}\n            data-test-id=\"clear-filter-button\"\n            icon={<Icon name=\"cancel\" size=\"tiny\" />}\n            size=\"small\"\n            onClick={onClear}\n          />\n        </Tooltip>\n      )}\n    </div>\n  );\n});\n\nFilterButton.defaultProps = {\n  clearTooltip: 'Clear filter',\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport { FilterButton };\nexport type { FilterButtonProps };\n","import type { FilterOption } from './FilterMenu';\nimport type { MenuProps } from '@launchpad-ui/menu';\nimport type { ChangeEvent, ReactNode, SyntheticEvent } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\nimport { cx } from 'classix';\n\nimport { FilterButton } from './FilterButton';\nimport { FilterMenu } from './FilterMenu';\nimport styles from './styles/Filter.module.css';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype FilterProps = Pick<MenuProps<string>, 'size' | 'enableVirtualization'> & {\n  searchValue?: string;\n  onSearchChange?(event: ChangeEvent<HTMLInputElement>): void;\n  searchPlaceholder?: string;\n  searchAriaLabel?: string;\n  name: ReactNode;\n  hideName?: boolean;\n  description: ReactNode;\n  options: FilterOption[];\n  isClearable?: boolean;\n  onClear?(): void;\n  className?: string;\n  onStateChange?({ isOpen }: { isOpen?: boolean }): void;\n  isSelected?: boolean;\n  searchId?: string;\n  onSelect?(item: FilterOption): void;\n  isEmpty?: boolean;\n  isLoading?: boolean;\n  disabled?: boolean;\n  onClickFilterButton?(): void;\n  disabledOptionTooltip?: string;\n  'data-test-id'?: string;\n  triggerTestId?: string;\n  clearAriaLabel?: string;\n};\n\nconst Filter = ({\n  searchValue,\n  onSearchChange,\n  searchPlaceholder,\n  searchAriaLabel,\n  name,\n  hideName,\n  description,\n  options,\n  isClearable,\n  onClear,\n  isSelected,\n  className,\n  isEmpty,\n  searchId,\n  isLoading,\n  onClickFilterButton,\n  disabledOptionTooltip,\n  'data-test-id': testId = 'filter',\n  size,\n  disabled,\n  enableVirtualization,\n  clearAriaLabel,\n  ...props\n}: FilterProps) => {\n  const enableSearch =\n    onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n  const dropdownClasses = cx(styles.filter, className);\n\n  const handleClear = (event: SyntheticEvent) => {\n    event.preventDefault();\n    onClear?.();\n  };\n\n  return (\n    <Dropdown\n      targetTestId={testId}\n      disabled={disabled}\n      targetClassName={dropdownClasses}\n      {...props}\n    >\n      <FilterButton\n        isClearable={isClearable}\n        onClear={handleClear}\n        name={name}\n        hideName={hideName}\n        disabled={disabled}\n        isSelected={isSelected}\n        onClickFilterButton={onClickFilterButton}\n        ariaLabel={clearAriaLabel}\n      >\n        {description}\n      </FilterButton>\n      <FilterMenu\n        options={options}\n        searchId={searchId}\n        searchValue={searchValue}\n        searchPlaceholder={searchPlaceholder}\n        searchAriaLabel={searchAriaLabel}\n        enableSearch={enableSearch}\n        onSearchChange={onSearchChange}\n        isLoading={isLoading}\n        disabledOptionTooltip={disabledOptionTooltip}\n        size={size}\n        enableVirtualization={enableVirtualization}\n      />\n    </Dropdown>\n  );\n};\n\nexport { Filter };\nexport type { FilterProps };\n"],"names":["forwardRef","name","Children","jsx","jsxs","cx","Icon","Fragment","Button","Menu","MenuSearch","MenuDivider","MenuItem","SEARCH_INPUT_THRESHOLD","description","Dropdown","isClearable","clearTooltip","useId","VisuallyHidden","Tooltip","IconButton"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@launchpad-ui/filter",
-  "version": "0.6.10",
+  "version": "0.6.12",
   "status": "beta",
   "publishConfig": {
     "access": "public"
@@ -26,14 +26,14 @@
   },
   "source": "src/index.ts",
   "dependencies": {
-    "@react-aria/visually-hidden": "3.8.7",
+    "@react-aria/visually-hidden": "3.8.8",
     "classix": "2.1.17",
-    "@launchpad-ui/button": "~0.11.9",
-    "@launchpad-ui/dropdown": "~0.6.84",
-    "@launchpad-ui/icons": "~0.14.9",
-    "@launchpad-ui/menu": "~0.12.10",
-    "@launchpad-ui/tokens": "~0.9.2",
-    "@launchpad-ui/tooltip": "~0.8.7"
+    "@launchpad-ui/button": "~0.11.10",
+    "@launchpad-ui/dropdown": "~0.6.86",
+    "@launchpad-ui/icons": "~0.14.10",
+    "@launchpad-ui/menu": "~0.12.12",
+    "@launchpad-ui/tokens": "~0.9.3",
+    "@launchpad-ui/tooltip": "~0.8.9"
   },
   "peerDependencies": {
     "react": "18.2.0",
@@ -44,7 +44,7 @@
     "react-dom": "18.2.0"
   },
   "scripts": {
-    "build": "vite build -c ../../vite.config.ts && tsc --project tsconfig.build.json",
+    "build": "vite build -c ../../vite.config.mts && tsc --project tsconfig.build.json",
     "clean": "rm -rf dist",
     "lint": "eslint '**/*.{ts,tsx,js}' && stylelint '**/*.css' --ignore-path ../../.stylelintignore",
     "test": "vitest run --coverage"