@launchpad-ui/filter 0.2.9 → 0.3.2

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.
package/dist/index.js CHANGED
@@ -1,78 +1,46 @@
1
+ require('./style.css');
1
2
  "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/index.ts
21
- var src_exports = {};
22
- __export(src_exports, {
23
- AppliedFilter: () => AppliedFilter,
24
- Filter: () => Filter,
25
- FilterButton: () => FilterButton
26
- });
27
- module.exports = __toCommonJS(src_exports);
28
-
29
- // src/AppliedFilter.tsx
30
- var import_dropdown = require("@launchpad-ui/dropdown");
31
- var import_classix2 = require("classix");
32
-
33
- // src/AppliedFilterButton.tsx
34
- var import_icons = require("@launchpad-ui/icons");
35
- var import_classix = require("classix");
36
- var import_react = require("react");
37
- var import_Filter = require("./styles/Filter.css");
38
- var import_jsx_runtime = require("react/jsx-runtime");
39
- var AppliedFilterButton = (0, import_react.forwardRef)((props, ref) => {
40
- const { name, className, isSelected, children, onClickFilterButton } = props;
41
- const hasDescription = import_react.Children.count(children) !== 0;
42
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
3
+ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
4
+ const dropdown = require("@launchpad-ui/dropdown");
5
+ const classix = require("classix");
6
+ const icons = require("@launchpad-ui/icons");
7
+ const react = require("react");
8
+ const jsxRuntime = require("react/jsx-runtime");
9
+ const button = require("@launchpad-ui/button");
10
+ const menu = require("@launchpad-ui/menu");
11
+ const tooltip = require("@launchpad-ui/tooltip");
12
+ const visuallyHidden = require("@react-aria/visually-hidden");
13
+ const Filter$1 = "";
14
+ const AppliedFilterButton = react.forwardRef((props, ref) => {
15
+ const {
16
+ name,
17
+ className,
18
+ isSelected,
19
+ children,
20
+ onClickFilterButton
21
+ } = props;
22
+ const hasDescription = react.Children.count(children) !== 0;
23
+ return /* @__PURE__ */ jsxRuntime.jsx("div", {
43
24
  className: "AppliedFilter-buttonContainer",
44
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
25
+ children: /* @__PURE__ */ jsxRuntime.jsxs("button", {
45
26
  "aria-haspopup": true,
46
- className: (0, import_classix.cx)("AppliedFilter-button", isSelected && "isSelected", className),
27
+ className: classix.cx("AppliedFilter-button", isSelected && "isSelected", className),
47
28
  ref,
48
29
  onClick: onClickFilterButton,
49
- children: [
50
- name && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
51
- className: "AppliedFilter-name",
52
- children: [
53
- name,
54
- hasDescription && ":"
55
- ]
56
- }),
57
- hasDescription && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
58
- className: "AppliedFilter-description",
59
- children
60
- }),
61
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ExpandMore, {
62
- size: import_icons.IconSize.SMALL
63
- })
64
- ]
30
+ children: [name && /* @__PURE__ */ jsxRuntime.jsxs("span", {
31
+ className: "AppliedFilter-name",
32
+ children: [name, hasDescription && ":"]
33
+ }), hasDescription && /* @__PURE__ */ jsxRuntime.jsx("span", {
34
+ className: "AppliedFilter-description",
35
+ children
36
+ }), /* @__PURE__ */ jsxRuntime.jsx(icons.ExpandMore, {
37
+ size: icons.IconSize.SMALL
38
+ })]
65
39
  })
66
40
  });
67
41
  });
68
42
  AppliedFilterButton.displayName = "AppliedFilterButton";
69
-
70
- // src/FilterMenu.tsx
71
- var import_button = require("@launchpad-ui/button");
72
- var import_icons2 = require("@launchpad-ui/icons");
73
- var import_menu = require("@launchpad-ui/menu");
74
- var import_jsx_runtime = require("react/jsx-runtime");
75
- var FilterMenu = ({
43
+ const FilterMenu = ({
76
44
  options,
77
45
  onClearFilter,
78
46
  enableSearch,
@@ -86,54 +54,49 @@ var FilterMenu = ({
86
54
  enableVirtualization,
87
55
  size
88
56
  }) => {
89
- const filterOptions = isLoading ? [{ name: "loading...", value: "loading...", isDisabled: true }] : options;
90
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
91
- children: [
92
- onClearFilter && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, {
93
- tabIndex: 0,
94
- className: "Menu-clear",
95
- onClick: onClearFilter,
96
- kind: import_button.ButtonKind.LINK,
97
- children: "CLEAR FILTER"
98
- }),
99
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_menu.Menu, {
100
- enableVirtualization,
101
- size,
102
- onSelect,
103
- children: [
104
- enableSearch && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.MenuSearch, {
105
- value: searchValue,
106
- placeholder: searchPlaceholder,
107
- onChange: onSearchChange,
108
- ariaLabel: searchAriaLabel
109
- }),
110
- filterOptions.map((option, index) => {
111
- if (option.isDivider) {
112
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.MenuDivider, {}, `divider-${index}`);
113
- }
114
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.MenuItem, {
115
- item: option,
116
- disabled: option.isDisabled,
117
- icon: option.isChecked ? import_icons2.Check : null,
118
- role: "menuitemradio",
119
- "aria-checked": option.isChecked ? "true" : void 0,
120
- nested: option.nested,
121
- groupHeader: option.groupHeader,
122
- tooltip: option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : void 0,
123
- tooltipPlacement: "right",
124
- children: option.name
125
- }, option.value);
126
- })
127
- ]
128
- })
129
- ]
57
+ const filterOptions = isLoading ? [{
58
+ name: "loading...",
59
+ value: "loading...",
60
+ isDisabled: true
61
+ }] : options;
62
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
63
+ children: [onClearFilter && /* @__PURE__ */ jsxRuntime.jsx(button.Button, {
64
+ tabIndex: 0,
65
+ className: "Menu-clear",
66
+ onClick: onClearFilter,
67
+ kind: button.ButtonKind.LINK,
68
+ children: "CLEAR FILTER"
69
+ }), /* @__PURE__ */ jsxRuntime.jsxs(menu.Menu, {
70
+ enableVirtualization,
71
+ size,
72
+ onSelect,
73
+ children: [enableSearch && /* @__PURE__ */ jsxRuntime.jsx(menu.MenuSearch, {
74
+ value: searchValue,
75
+ placeholder: searchPlaceholder,
76
+ onChange: onSearchChange,
77
+ ariaLabel: searchAriaLabel
78
+ }), filterOptions.map((option, index) => {
79
+ if (option.isDivider) {
80
+ return /* @__PURE__ */ jsxRuntime.jsx(menu.MenuDivider, {}, `divider-${index}`);
81
+ }
82
+ return /* @__PURE__ */ jsxRuntime.jsx(menu.MenuItem, {
83
+ item: option,
84
+ disabled: option.isDisabled,
85
+ icon: option.isChecked ? icons.Check : null,
86
+ role: "menuitemradio",
87
+ "aria-checked": option.isChecked ? "true" : void 0,
88
+ nested: option.nested,
89
+ groupHeader: option.groupHeader,
90
+ tooltip: option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : void 0,
91
+ tooltipPlacement: "right",
92
+ children: option.name
93
+ }, option.value);
94
+ })]
95
+ })]
130
96
  });
131
97
  };
132
-
133
- // src/AppliedFilter.tsx
134
- var import_jsx_runtime = require("react/jsx-runtime");
135
- var SEARCH_INPUT_THRESHOLD = 4;
136
- var AppliedFilter = ({
98
+ const SEARCH_INPUT_THRESHOLD$1 = 4;
99
+ const AppliedFilter = ({
137
100
  searchValue,
138
101
  onSearchChange,
139
102
  searchPlaceholder,
@@ -148,47 +111,30 @@ var AppliedFilter = ({
148
111
  searchAriaLabel,
149
112
  ...props
150
113
  }) => {
151
- const enableSearch = onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);
152
- const dropdownClasses = (0, import_classix2.cx)("Filter-target", className);
153
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown.Dropdown, {
114
+ const enableSearch = onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD$1 || !isEmpty);
115
+ const dropdownClasses = classix.cx("Filter-target", className);
116
+ return /* @__PURE__ */ jsxRuntime.jsxs(dropdown.Dropdown, {
154
117
  targetClassName: dropdownClasses,
155
118
  placement: "bottom-start",
156
119
  enableArrow: false,
157
120
  ...props,
158
- children: [
159
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AppliedFilterButton, {
160
- name,
161
- onClickFilterButton,
162
- children: description
163
- }),
164
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterMenu, {
165
- options,
166
- searchValue,
167
- searchPlaceholder,
168
- enableSearch,
169
- searchAriaLabel,
170
- onSearchChange,
171
- onClearFilter,
172
- isLoading
173
- })
174
- ]
121
+ children: [/* @__PURE__ */ jsxRuntime.jsx(AppliedFilterButton, {
122
+ name,
123
+ onClickFilterButton,
124
+ children: description
125
+ }), /* @__PURE__ */ jsxRuntime.jsx(FilterMenu, {
126
+ options,
127
+ searchValue,
128
+ searchPlaceholder,
129
+ enableSearch,
130
+ searchAriaLabel,
131
+ onSearchChange,
132
+ onClearFilter,
133
+ isLoading
134
+ })]
175
135
  });
176
136
  };
177
-
178
- // src/Filter.tsx
179
- var import_dropdown2 = require("@launchpad-ui/dropdown");
180
- var import_classix4 = require("classix");
181
-
182
- // src/FilterButton.tsx
183
- var import_button2 = require("@launchpad-ui/button");
184
- var import_icons3 = require("@launchpad-ui/icons");
185
- var import_tooltip = require("@launchpad-ui/tooltip");
186
- var import_visually_hidden = require("@react-aria/visually-hidden");
187
- var import_classix3 = require("classix");
188
- var import_react2 = require("react");
189
- var import_Filter2 = require("./styles/Filter.css");
190
- var import_jsx_runtime = require("react/jsx-runtime");
191
- var FilterButton = (0, import_react2.forwardRef)((props, ref) => {
137
+ const FilterButton = react.forwardRef((props, ref) => {
192
138
  const {
193
139
  children,
194
140
  name,
@@ -202,69 +148,56 @@ var FilterButton = (0, import_react2.forwardRef)((props, ref) => {
202
148
  testId,
203
149
  ...rest
204
150
  } = props;
205
- const nameId = (0, import_react2.useId)();
206
- const descriptionId = (0, import_react2.useId)();
207
- const hasDescription = import_react2.Children.count(children) !== 0;
208
- const nameElement = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
151
+ const nameId = react.useId();
152
+ const descriptionId = react.useId();
153
+ const hasDescription = react.Children.count(children) !== 0;
154
+ const nameElement = /* @__PURE__ */ jsxRuntime.jsxs("span", {
209
155
  className: "Filter-name",
210
- children: [
211
- name,
212
- hasDescription && ":"
213
- ]
156
+ children: [name, hasDescription && ":"]
214
157
  });
215
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
158
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", {
216
159
  className: "Filter-buttonContainer",
217
160
  "data-test-id": testId,
218
- children: [
219
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
220
- ...rest,
221
- "aria-labelledby": `${nameId} ${hasDescription ? descriptionId : ""}`,
222
- "aria-haspopup": true,
223
- className: (0, import_classix3.cx)("Filter-button", className, (isClearable || isSelected) && "is-clearable"),
224
- ref,
225
- onClick: onClickFilterButton,
226
- children: [
227
- hideName ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_visually_hidden.VisuallyHidden, {
228
- id: nameId,
229
- children: nameElement
230
- }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
231
- id: nameId,
232
- children: nameElement
233
- }),
234
- hasDescription && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
235
- id: descriptionId,
236
- className: "Filter-description",
237
- children
238
- }),
239
- !isClearable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons3.ExpandMore, {
240
- size: import_icons3.IconSize.SMALL
241
- })
242
- ]
243
- }),
244
- isClearable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, {
245
- targetClassName: "Filter-clearTooltip",
246
- content: clearTooltip,
247
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button2.IconButton, {
248
- "aria-label": "Clear filter",
249
- className: "Filter-clear",
250
- icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons3.Close, {
251
- size: import_icons3.IconSize.TINY
252
- }),
253
- onClick: onClear
254
- })
161
+ children: [/* @__PURE__ */ jsxRuntime.jsxs("button", {
162
+ ...rest,
163
+ "aria-labelledby": `${nameId} ${hasDescription ? descriptionId : ""}`,
164
+ "aria-haspopup": true,
165
+ className: classix.cx("Filter-button", className, (isClearable || isSelected) && "is-clearable"),
166
+ ref,
167
+ onClick: onClickFilterButton,
168
+ children: [hideName ? /* @__PURE__ */ jsxRuntime.jsx(visuallyHidden.VisuallyHidden, {
169
+ id: nameId,
170
+ children: nameElement
171
+ }) : /* @__PURE__ */ jsxRuntime.jsx("span", {
172
+ id: nameId,
173
+ children: nameElement
174
+ }), hasDescription && /* @__PURE__ */ jsxRuntime.jsx("span", {
175
+ id: descriptionId,
176
+ className: "Filter-description",
177
+ children
178
+ }), !isClearable && /* @__PURE__ */ jsxRuntime.jsx(icons.ExpandMore, {
179
+ size: icons.IconSize.SMALL
180
+ })]
181
+ }), isClearable && /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip, {
182
+ targetClassName: "Filter-clearTooltip",
183
+ content: clearTooltip,
184
+ children: /* @__PURE__ */ jsxRuntime.jsx(button.IconButton, {
185
+ "aria-label": "Clear filter",
186
+ className: "Filter-clear",
187
+ icon: /* @__PURE__ */ jsxRuntime.jsx(icons.Close, {
188
+ size: icons.IconSize.TINY
189
+ }),
190
+ onClick: onClear
255
191
  })
256
- ]
192
+ })]
257
193
  });
258
194
  });
259
195
  FilterButton.defaultProps = {
260
196
  clearTooltip: "Clear filter"
261
197
  };
262
198
  FilterButton.displayName = "FilterButton";
263
-
264
- // src/Filter.tsx
265
- var import_jsx_runtime = require("react/jsx-runtime");
266
- var SEARCH_INPUT_THRESHOLD2 = 4;
267
- var Filter = ({
199
+ const SEARCH_INPUT_THRESHOLD = 4;
200
+ const Filter = ({
268
201
  searchValue,
269
202
  onSearchChange,
270
203
  searchPlaceholder,
@@ -286,45 +219,39 @@ var Filter = ({
286
219
  enableVirtualization,
287
220
  ...props
288
221
  }) => {
289
- const enableSearch = onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD2 || !isEmpty);
290
- const dropdownClasses = (0, import_classix4.cx)("Filter", "Filter-target", className);
222
+ const enableSearch = onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);
223
+ const dropdownClasses = classix.cx("Filter", "Filter-target", className);
291
224
  const handleClear = (event) => {
292
225
  event.preventDefault();
293
- onClear?.();
226
+ onClear == null ? void 0 : onClear();
294
227
  };
295
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown2.Dropdown, {
228
+ return /* @__PURE__ */ jsxRuntime.jsxs(dropdown.Dropdown, {
296
229
  targetClassName: dropdownClasses,
297
230
  ...props,
298
- children: [
299
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterButton, {
300
- isClearable,
301
- onClear: handleClear,
302
- name,
303
- hideName,
304
- isSelected,
305
- onClickFilterButton,
306
- testId,
307
- children: description
308
- }),
309
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterMenu, {
310
- options,
311
- searchValue,
312
- searchPlaceholder,
313
- searchAriaLabel,
314
- enableSearch,
315
- onSearchChange,
316
- isLoading,
317
- disabledOptionTooltip,
318
- size,
319
- enableVirtualization
320
- })
321
- ]
231
+ children: [/* @__PURE__ */ jsxRuntime.jsx(FilterButton, {
232
+ isClearable,
233
+ onClear: handleClear,
234
+ name,
235
+ hideName,
236
+ isSelected,
237
+ onClickFilterButton,
238
+ testId,
239
+ children: description
240
+ }), /* @__PURE__ */ jsxRuntime.jsx(FilterMenu, {
241
+ options,
242
+ searchValue,
243
+ searchPlaceholder,
244
+ searchAriaLabel,
245
+ enableSearch,
246
+ onSearchChange,
247
+ isLoading,
248
+ disabledOptionTooltip,
249
+ size,
250
+ enableVirtualization
251
+ })]
322
252
  });
323
253
  };
324
- // Annotate the CommonJS export names for ESM import in node:
325
- 0 && (module.exports = {
326
- AppliedFilter,
327
- Filter,
328
- FilterButton
329
- });
254
+ exports.AppliedFilter = AppliedFilter;
255
+ exports.Filter = Filter;
256
+ exports.FilterButton = FilterButton;
330
257
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1,7 +1 @@
1
- {
2
- "version": 3,
3
- "sources": ["../src/index.ts", "../src/AppliedFilter.tsx", "../src/AppliedFilterButton.tsx", "../src/FilterMenu.tsx", "../src/Filter.tsx", "../src/FilterButton.tsx"],
4
- "sourcesContent": ["export type { AppliedFilterProps } from './AppliedFilter';\nexport type { FilterProps } from './Filter';\nexport type { FilterButtonProps } from './FilterButton';\nexport type { FilterOption } from './FilterMenu';\nexport { AppliedFilter } from './AppliedFilter';\nexport { Filter } from './Filter';\nexport { FilterButton } from './FilterButton';\n", "import type { FilterOption } from './FilterMenu';\nimport type { ReactNode } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\nimport { cx } from 'classix';\n\nimport { AppliedFilterButton } from './AppliedFilterButton';\nimport { FilterMenu } from './FilterMenu';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype AppliedFilterProps = {\n searchValue?: string;\n onSearchChange?(event: React.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 isSelected?: boolean;\n onSelect?(item: FilterOption): void;\n isEmpty?: boolean;\n isLoading?: boolean;\n onClickFilterButton?(): void;\n searchAriaLabel?: 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 ...props\n}: AppliedFilterProps) => {\n const enableSearch =\n onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n const dropdownClasses = cx('Filter-target', className);\n return (\n <Dropdown\n targetClassName={dropdownClasses}\n placement=\"bottom-start\"\n enableArrow={false}\n {...props}\n >\n <AppliedFilterButton name={name} onClickFilterButton={onClickFilterButton}>\n {description}\n </AppliedFilterButton>\n\n <FilterMenu\n options={options}\n searchValue={searchValue}\n searchPlaceholder={searchPlaceholder}\n enableSearch={enableSearch}\n searchAriaLabel={searchAriaLabel}\n onSearchChange={onSearchChange}\n onClearFilter={onClearFilter}\n isLoading={isLoading}\n />\n </Dropdown>\n );\n};\n\nexport type { AppliedFilterProps };\nexport { AppliedFilter };\n", "import type { ReactNode } from 'react';\n\nimport { ExpandMore, IconSize } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\nimport { Children, forwardRef } from 'react';\n\nimport './styles/Filter.css';\n\ntype AppliedFilterButtonProps = {\n name?: ReactNode;\n className?: string;\n isSelected?: boolean;\n children: ReactNode;\n onClickFilterButton?(): void;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst AppliedFilterButton = forwardRef<Ref, AppliedFilterButtonProps>((props, ref) => {\n const { name, className, isSelected, children, onClickFilterButton } = props;\n\n const hasDescription = Children.count(children) !== 0;\n\n return (\n <div className=\"AppliedFilter-buttonContainer\">\n <button\n aria-haspopup\n className={cx('AppliedFilter-button', isSelected && 'isSelected', className)}\n ref={ref}\n onClick={onClickFilterButton}\n >\n {name && (\n <span className=\"AppliedFilter-name\">\n {name}\n {hasDescription && ':'}\n </span>\n )}\n {hasDescription && <span className=\"AppliedFilter-description\">{children}</span>}\n <ExpandMore size={IconSize.SMALL} />\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 { ReactNode } from 'react';\n\nimport { Button, ButtonKind } from '@launchpad-ui/button';\nimport { Check } from '@launchpad-ui/icons';\nimport { Menu, MenuDivider, MenuItem, MenuSearch } from '@launchpad-ui/menu';\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'> & {\n options: FilterOption[];\n onClearFilter?(): void;\n enableSearch?: boolean;\n searchValue?: string;\n searchPlaceholder?: string;\n searchAriaLabel?: string;\n onSearchChange?(event: React.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 onSelect,\n onSearchChange,\n isLoading = false,\n disabledOptionTooltip,\n enableVirtualization,\n size,\n}: FilterMenuProps) => {\n const filterOptions = isLoading\n ? [{ name: 'loading...', value: 'loading...', isDisabled: true }]\n : options;\n\n return (\n <>\n {onClearFilter && (\n <Button tabIndex={0} className=\"Menu-clear\" onClick={onClearFilter} kind={ButtonKind.LINK}>\n CLEAR FILTER\n </Button>\n )}\n <Menu enableVirtualization={enableVirtualization} size={size} onSelect={onSelect}>\n {enableSearch && (\n <MenuSearch\n value={searchValue}\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 ? Check : null}\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 { MenuProps } from '@launchpad-ui/menu';\nimport type { ReactNode, SyntheticEvent } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\nimport { cx } from 'classix';\n\nimport { FilterButton } from './FilterButton';\nimport { FilterMenu } from './FilterMenu';\n\nconst SEARCH_INPUT_THRESHOLD = 4;\n\ntype FilterProps = Pick<MenuProps<string>, 'size' | 'enableVirtualization'> & {\n searchValue?: string;\n onSearchChange?(event: React.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 onSelect?(item: FilterOption): void;\n isEmpty?: boolean;\n isLoading?: boolean;\n onClickFilterButton?(): void;\n disabledOptionTooltip?: string;\n testId?: 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 isLoading,\n onClickFilterButton,\n disabledOptionTooltip,\n testId,\n size,\n enableVirtualization,\n ...props\n}: FilterProps) => {\n const enableSearch =\n onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n const dropdownClasses = cx('Filter', 'Filter-target', className);\n\n const handleClear = (event: SyntheticEvent) => {\n event.preventDefault();\n onClear?.();\n };\n\n return (\n <Dropdown targetClassName={dropdownClasses} {...props}>\n <FilterButton\n isClearable={isClearable}\n onClear={handleClear}\n name={name}\n hideName={hideName}\n isSelected={isSelected}\n onClickFilterButton={onClickFilterButton}\n testId={testId}\n >\n {description}\n </FilterButton>\n <FilterMenu\n options={options}\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", "import type { ReactNode, SyntheticEvent } from 'react';\n\nimport { IconButton } from '@launchpad-ui/button';\nimport { Close, ExpandMore, IconSize } 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/Filter.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 onClickFilterButton?(): void;\n testId?: 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 isSelected,\n onClickFilterButton,\n className,\n testId,\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=\"Filter-name\">\n {name}\n {hasDescription && ':'}\n </span>\n );\n\n return (\n <div className=\"Filter-buttonContainer\" data-test-id={testId}>\n <button\n {...rest}\n aria-labelledby={`${nameId} ${hasDescription ? descriptionId : ''}`}\n aria-haspopup\n className={cx('Filter-button', className, (isClearable || isSelected) && 'is-clearable')}\n ref={ref}\n onClick={onClickFilterButton}\n >\n {hideName ? (\n <VisuallyHidden id={nameId}>{nameElement}</VisuallyHidden>\n ) : (\n <span id={nameId}>{nameElement}</span>\n )}\n {hasDescription && (\n <span id={descriptionId} className=\"Filter-description\">\n {children}\n </span>\n )}\n {!isClearable && <ExpandMore size={IconSize.SMALL} />}\n </button>\n {isClearable && (\n <Tooltip targetClassName=\"Filter-clearTooltip\" content={clearTooltip}>\n <IconButton\n aria-label=\"Clear filter\"\n className=\"Filter-clear\"\n icon={<Close size={IconSize.TINY} />}\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"],
5
- "mappings": "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",
6
- "names": ["import_classix", "import_icons", "import_dropdown", "import_classix", "import_button", "import_icons", "import_classix", "import_react", "import_Filter", "SEARCH_INPUT_THRESHOLD"]
7
- }
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 { ExpandMore, IconSize } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\nimport { Children, forwardRef } from 'react';\n\nimport './styles/Filter.css';\n\ntype AppliedFilterButtonProps = {\n name?: ReactNode;\n className?: string;\n isSelected?: boolean;\n children: ReactNode;\n onClickFilterButton?(): void;\n};\n\ntype Ref = HTMLButtonElement;\n\nconst AppliedFilterButton = forwardRef<Ref, AppliedFilterButtonProps>((props, ref) => {\n const { name, className, isSelected, children, onClickFilterButton } = props;\n\n const hasDescription = Children.count(children) !== 0;\n\n return (\n <div className=\"AppliedFilter-buttonContainer\">\n <button\n aria-haspopup\n className={cx('AppliedFilter-button', isSelected && 'isSelected', className)}\n ref={ref}\n onClick={onClickFilterButton}\n >\n {name && (\n <span className=\"AppliedFilter-name\">\n {name}\n {hasDescription && ':'}\n </span>\n )}\n {hasDescription && <span className=\"AppliedFilter-description\">{children}</span>}\n <ExpandMore size={IconSize.SMALL} />\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, ButtonKind } from '@launchpad-ui/button';\nimport { Check } from '@launchpad-ui/icons';\nimport { Menu, MenuDivider, MenuItem, MenuSearch } from '@launchpad-ui/menu';\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'> & {\n options: FilterOption[];\n onClearFilter?(): void;\n enableSearch?: boolean;\n searchValue?: 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 onSelect,\n onSearchChange,\n isLoading = false,\n disabledOptionTooltip,\n enableVirtualization,\n size,\n}: FilterMenuProps) => {\n const filterOptions = isLoading\n ? [{ name: 'loading...', value: 'loading...', isDisabled: true }]\n : options;\n\n return (\n <>\n {onClearFilter && (\n <Button tabIndex={0} className=\"Menu-clear\" onClick={onClearFilter} kind={ButtonKind.LINK}>\n CLEAR FILTER\n </Button>\n )}\n <Menu enableVirtualization={enableVirtualization} size={size} onSelect={onSelect}>\n {enableSearch && (\n <MenuSearch\n value={searchValue}\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 ? Check : null}\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';\nimport { cx } from 'classix';\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 isSelected?: boolean;\n onSelect?(item: FilterOption): void;\n isEmpty?: boolean;\n isLoading?: boolean;\n onClickFilterButton?(): void;\n searchAriaLabel?: 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 ...props\n}: AppliedFilterProps) => {\n const enableSearch =\n onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n const dropdownClasses = cx('Filter-target', className);\n return (\n <Dropdown\n targetClassName={dropdownClasses}\n placement=\"bottom-start\"\n enableArrow={false}\n {...props}\n >\n <AppliedFilterButton name={name} onClickFilterButton={onClickFilterButton}>\n {description}\n </AppliedFilterButton>\n\n <FilterMenu\n options={options}\n searchValue={searchValue}\n searchPlaceholder={searchPlaceholder}\n enableSearch={enableSearch}\n searchAriaLabel={searchAriaLabel}\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 } from 'react';\n\nimport { IconButton } from '@launchpad-ui/button';\nimport { Close, ExpandMore, IconSize } 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/Filter.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 onClickFilterButton?(): void;\n testId?: 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 isSelected,\n onClickFilterButton,\n className,\n testId,\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=\"Filter-name\">\n {name}\n {hasDescription && ':'}\n </span>\n );\n\n return (\n <div className=\"Filter-buttonContainer\" data-test-id={testId}>\n <button\n {...rest}\n aria-labelledby={`${nameId} ${hasDescription ? descriptionId : ''}`}\n aria-haspopup\n className={cx('Filter-button', className, (isClearable || isSelected) && 'is-clearable')}\n ref={ref}\n onClick={onClickFilterButton}\n >\n {hideName ? (\n <VisuallyHidden id={nameId}>{nameElement}</VisuallyHidden>\n ) : (\n <span id={nameId}>{nameElement}</span>\n )}\n {hasDescription && (\n <span id={descriptionId} className=\"Filter-description\">\n {children}\n </span>\n )}\n {!isClearable && <ExpandMore size={IconSize.SMALL} />}\n </button>\n {isClearable && (\n <Tooltip targetClassName=\"Filter-clearTooltip\" content={clearTooltip}>\n <IconButton\n aria-label=\"Clear filter\"\n className=\"Filter-clear\"\n icon={<Close size={IconSize.TINY} />}\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';\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 onSelect?(item: FilterOption): void;\n isEmpty?: boolean;\n isLoading?: boolean;\n onClickFilterButton?(): void;\n disabledOptionTooltip?: string;\n testId?: 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 isLoading,\n onClickFilterButton,\n disabledOptionTooltip,\n testId,\n size,\n enableVirtualization,\n ...props\n}: FilterProps) => {\n const enableSearch =\n onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);\n\n const dropdownClasses = cx('Filter', 'Filter-target', className);\n\n const handleClear = (event: SyntheticEvent) => {\n event.preventDefault();\n onClear?.();\n };\n\n return (\n <Dropdown targetClassName={dropdownClasses} {...props}>\n <FilterButton\n isClearable={isClearable}\n onClear={handleClear}\n name={name}\n hideName={hideName}\n isSelected={isSelected}\n onClickFilterButton={onClickFilterButton}\n testId={testId}\n >\n {description}\n </FilterButton>\n <FilterMenu\n options={options}\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":["AppliedFilterButton","forwardRef","props","ref","name","className","isSelected","children","onClickFilterButton","hasDescription","Children","count","cx","_jsxs","_jsx","ExpandMore","IconSize","SMALL","displayName","FilterMenu","options","onClearFilter","enableSearch","searchValue","searchPlaceholder","searchAriaLabel","onSelect","onSearchChange","isLoading","disabledOptionTooltip","enableVirtualization","size","filterOptions","value","isDisabled","_Fragment","Button","ButtonKind","LINK","Menu","MenuSearch","map","option","index","isDivider","MenuDivider","MenuItem","isChecked","Check","undefined","nested","groupHeader","SEARCH_INPUT_THRESHOLD","AppliedFilter","description","isEmpty","length","dropdownClasses","Dropdown","FilterButton","hideName","isClearable","clearTooltip","onClear","testId","rest","nameId","useId","descriptionId","nameElement","VisuallyHidden","Tooltip","IconButton","Close","TINY","defaultProps","Filter","handleClear","event","preventDefault"],"mappings":"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"}