@launchpad-ui/filter 0.1.1 → 0.2.1
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.es.js +176 -121
- package/dist/index.es.js.map +2 -2
- package/dist/index.js +180 -122
- package/dist/index.js.map +2 -2
- package/package.json +8 -8
package/dist/index.es.js
CHANGED
@@ -10,25 +10,41 @@ import { ExpandMore, IconSize } from "@launchpad-ui/icons";
|
|
10
10
|
import cx from "clsx";
|
11
11
|
import { Children, forwardRef } from "react";
|
12
12
|
import "./styles/Filter.css";
|
13
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
13
14
|
var AppliedFilterButton = forwardRef((props, ref) => {
|
14
15
|
const { name, className, isSelected, children, onClickFilterButton } = props;
|
15
16
|
const hasDescription = Children.count(children) !== 0;
|
16
|
-
return /* @__PURE__ */
|
17
|
-
className: "AppliedFilter-buttonContainer"
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
17
|
+
return /* @__PURE__ */ jsx("div", {
|
18
|
+
className: "AppliedFilter-buttonContainer",
|
19
|
+
children: /* @__PURE__ */ jsxs("button", {
|
20
|
+
"aria-haspopup": true,
|
21
|
+
className: cx(
|
22
|
+
"AppliedFilter-button",
|
23
|
+
{
|
24
|
+
isSelected
|
25
|
+
},
|
26
|
+
className
|
27
|
+
),
|
28
|
+
ref,
|
29
|
+
onClick: onClickFilterButton,
|
30
|
+
children: [
|
31
|
+
name && /* @__PURE__ */ jsxs("span", {
|
32
|
+
className: "AppliedFilter-name",
|
33
|
+
children: [
|
34
|
+
name,
|
35
|
+
hasDescription && ":"
|
36
|
+
]
|
37
|
+
}),
|
38
|
+
hasDescription && /* @__PURE__ */ jsx("span", {
|
39
|
+
className: "AppliedFilter-description",
|
40
|
+
children
|
41
|
+
}),
|
42
|
+
/* @__PURE__ */ jsx(ExpandMore, {
|
43
|
+
size: IconSize.SMALL
|
44
|
+
})
|
45
|
+
]
|
46
|
+
})
|
47
|
+
});
|
32
48
|
});
|
33
49
|
AppliedFilterButton.displayName = "AppliedFilterButton";
|
34
50
|
|
@@ -36,6 +52,7 @@ AppliedFilterButton.displayName = "AppliedFilterButton";
|
|
36
52
|
import { Button, ButtonKind } from "@launchpad-ui/button";
|
37
53
|
import { Check } from "@launchpad-ui/icons";
|
38
54
|
import { Menu, MenuDivider, MenuItem, MenuSearch } from "@launchpad-ui/menu";
|
55
|
+
import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
39
56
|
var FilterMenu = ({
|
40
57
|
options,
|
41
58
|
onClearFilter,
|
@@ -51,42 +68,51 @@ var FilterMenu = ({
|
|
51
68
|
size
|
52
69
|
}) => {
|
53
70
|
const filterOptions = isLoading ? [{ name: "loading...", value: "loading...", isDisabled: true }] : options;
|
54
|
-
return /* @__PURE__ */
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
71
|
+
return /* @__PURE__ */ jsxs2(Fragment, {
|
72
|
+
children: [
|
73
|
+
onClearFilter && /* @__PURE__ */ jsx2(Button, {
|
74
|
+
tabIndex: 0,
|
75
|
+
className: "Menu-clear",
|
76
|
+
onClick: onClearFilter,
|
77
|
+
kind: ButtonKind.LINK,
|
78
|
+
children: "CLEAR FILTER"
|
79
|
+
}),
|
80
|
+
/* @__PURE__ */ jsxs2(Menu, {
|
81
|
+
enableVirtualization,
|
82
|
+
size,
|
83
|
+
onSelect,
|
84
|
+
children: [
|
85
|
+
enableSearch && /* @__PURE__ */ jsx2(MenuSearch, {
|
86
|
+
value: searchValue,
|
87
|
+
placeholder: searchPlaceholder,
|
88
|
+
onChange: onSearchChange,
|
89
|
+
ariaLabel: searchAriaLabel
|
90
|
+
}),
|
91
|
+
filterOptions.map((option, index) => {
|
92
|
+
if (option.isDivider) {
|
93
|
+
return /* @__PURE__ */ jsx2(MenuDivider, {}, `divider-${index}`);
|
94
|
+
}
|
95
|
+
return /* @__PURE__ */ jsx2(MenuItem, {
|
96
|
+
item: option,
|
97
|
+
disabled: option.isDisabled,
|
98
|
+
icon: option.isChecked ? Check : null,
|
99
|
+
role: "menuitemradio",
|
100
|
+
"aria-checked": option.isChecked ? "true" : void 0,
|
101
|
+
nested: option.nested,
|
102
|
+
groupHeader: option.groupHeader,
|
103
|
+
tooltip: option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : void 0,
|
104
|
+
tooltipPlacement: "right",
|
105
|
+
children: option.name
|
106
|
+
}, option.value);
|
107
|
+
})
|
108
|
+
]
|
109
|
+
})
|
110
|
+
]
|
111
|
+
});
|
87
112
|
};
|
88
113
|
|
89
114
|
// src/AppliedFilter.tsx
|
115
|
+
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
90
116
|
var SEARCH_INPUT_THRESHOLD = 4;
|
91
117
|
var AppliedFilter = ({
|
92
118
|
searchValue,
|
@@ -105,24 +131,29 @@ var AppliedFilter = ({
|
|
105
131
|
}) => {
|
106
132
|
const enableSearch = onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);
|
107
133
|
const dropdownClasses = cx2("Filter-target", className);
|
108
|
-
return /* @__PURE__ */
|
134
|
+
return /* @__PURE__ */ jsxs3(Dropdown, {
|
109
135
|
targetClassName: dropdownClasses,
|
110
136
|
placement: "bottom-start",
|
111
137
|
enableArrow: false,
|
112
|
-
...props
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
138
|
+
...props,
|
139
|
+
children: [
|
140
|
+
/* @__PURE__ */ jsx3(AppliedFilterButton, {
|
141
|
+
name,
|
142
|
+
onClickFilterButton,
|
143
|
+
children: description
|
144
|
+
}),
|
145
|
+
/* @__PURE__ */ jsx3(FilterMenu, {
|
146
|
+
options,
|
147
|
+
searchValue,
|
148
|
+
searchPlaceholder,
|
149
|
+
enableSearch,
|
150
|
+
searchAriaLabel,
|
151
|
+
onSearchChange,
|
152
|
+
onClearFilter,
|
153
|
+
isLoading
|
154
|
+
})
|
155
|
+
]
|
156
|
+
});
|
126
157
|
};
|
127
158
|
|
128
159
|
// src/Filter.tsx
|
@@ -138,6 +169,7 @@ import { VisuallyHidden } from "@react-aria/visually-hidden";
|
|
138
169
|
import cx3 from "clsx";
|
139
170
|
import { Children as Children2, forwardRef as forwardRef2 } from "react";
|
140
171
|
import "./styles/Filter.css";
|
172
|
+
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
141
173
|
var FilterButton = forwardRef2((props, ref) => {
|
142
174
|
const {
|
143
175
|
children,
|
@@ -155,42 +187,59 @@ var FilterButton = forwardRef2((props, ref) => {
|
|
155
187
|
const nameId = useId();
|
156
188
|
const descriptionId = useId();
|
157
189
|
const hasDescription = Children2.count(children) !== 0;
|
158
|
-
const nameElement = /* @__PURE__ */
|
159
|
-
className: "Filter-name"
|
160
|
-
|
161
|
-
|
190
|
+
const nameElement = /* @__PURE__ */ jsxs4("span", {
|
191
|
+
className: "Filter-name",
|
192
|
+
children: [
|
193
|
+
name,
|
194
|
+
hasDescription && ":"
|
195
|
+
]
|
196
|
+
});
|
197
|
+
return /* @__PURE__ */ jsxs4("div", {
|
162
198
|
className: "Filter-buttonContainer",
|
163
|
-
"data-test-id": testId
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
199
|
+
"data-test-id": testId,
|
200
|
+
children: [
|
201
|
+
/* @__PURE__ */ jsxs4("button", {
|
202
|
+
...rest,
|
203
|
+
"aria-labelledby": `${nameId} ${hasDescription ? descriptionId : ""}`,
|
204
|
+
"aria-haspopup": true,
|
205
|
+
className: cx3("Filter-button", className, {
|
206
|
+
"is-clearable": isClearable || isSelected
|
207
|
+
}),
|
208
|
+
ref,
|
209
|
+
onClick: onClickFilterButton,
|
210
|
+
children: [
|
211
|
+
hideName ? /* @__PURE__ */ jsx4(VisuallyHidden, {
|
212
|
+
id: nameId,
|
213
|
+
children: nameElement
|
214
|
+
}) : /* @__PURE__ */ jsx4("span", {
|
215
|
+
id: nameId,
|
216
|
+
children: nameElement
|
217
|
+
}),
|
218
|
+
hasDescription && /* @__PURE__ */ jsx4("span", {
|
219
|
+
id: descriptionId,
|
220
|
+
className: "Filter-description",
|
221
|
+
children
|
222
|
+
}),
|
223
|
+
!isClearable && /* @__PURE__ */ jsx4(ExpandMore2, {
|
224
|
+
size: IconSize2.SMALL
|
225
|
+
})
|
226
|
+
]
|
227
|
+
}),
|
228
|
+
isClearable && /* @__PURE__ */ jsx4(Tooltip, {
|
229
|
+
targetClassName: "Filter-clearTooltip",
|
230
|
+
content: clearTooltip,
|
231
|
+
children: /* @__PURE__ */ jsx4(Button2, {
|
232
|
+
className: "Filter-clear",
|
233
|
+
size: ButtonSize.SMALL,
|
234
|
+
type: ButtonType.ICON,
|
235
|
+
icon: /* @__PURE__ */ jsx4(Close, {
|
236
|
+
size: IconSize2.TINY
|
237
|
+
}),
|
238
|
+
onClick: onClear
|
239
|
+
})
|
240
|
+
})
|
241
|
+
]
|
242
|
+
});
|
194
243
|
});
|
195
244
|
FilterButton.defaultProps = {
|
196
245
|
clearTooltip: "Clear filter"
|
@@ -198,6 +247,7 @@ FilterButton.defaultProps = {
|
|
198
247
|
FilterButton.displayName = "FilterButton";
|
199
248
|
|
200
249
|
// src/Filter.tsx
|
250
|
+
import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
201
251
|
var SEARCH_INPUT_THRESHOLD2 = 4;
|
202
252
|
var Filter = ({
|
203
253
|
searchValue,
|
@@ -227,29 +277,34 @@ var Filter = ({
|
|
227
277
|
event.preventDefault();
|
228
278
|
onClear?.();
|
229
279
|
};
|
230
|
-
return /* @__PURE__ */
|
280
|
+
return /* @__PURE__ */ jsxs5(Dropdown2, {
|
231
281
|
targetClassName: dropdownClasses,
|
232
|
-
...props
|
233
|
-
|
234
|
-
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
242
|
-
|
243
|
-
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
|
252
|
-
|
282
|
+
...props,
|
283
|
+
children: [
|
284
|
+
/* @__PURE__ */ jsx5(FilterButton, {
|
285
|
+
isClearable,
|
286
|
+
onClear: handleClear,
|
287
|
+
name,
|
288
|
+
hideName,
|
289
|
+
isSelected,
|
290
|
+
onClickFilterButton,
|
291
|
+
testId,
|
292
|
+
children: description
|
293
|
+
}),
|
294
|
+
/* @__PURE__ */ jsx5(FilterMenu, {
|
295
|
+
options,
|
296
|
+
searchValue,
|
297
|
+
searchPlaceholder,
|
298
|
+
searchAriaLabel,
|
299
|
+
enableSearch,
|
300
|
+
onSearchChange,
|
301
|
+
isLoading,
|
302
|
+
disabledOptionTooltip,
|
303
|
+
size,
|
304
|
+
enableVirtualization
|
305
|
+
})
|
306
|
+
]
|
307
|
+
});
|
253
308
|
};
|
254
309
|
export {
|
255
310
|
AppliedFilter,
|
package/dist/index.es.js.map
CHANGED
@@ -2,6 +2,6 @@
|
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["../../../scripts/react-shim.js", "../src/AppliedFilter.tsx", "../src/AppliedFilterButton.tsx", "../src/FilterMenu.tsx", "../src/Filter.tsx", "../src/FilterButton.tsx"],
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { FilterOption } from './FilterMenu';\nimport type { ReactNode } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\nimport cx from 'clsx';\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 'clsx';\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(\n 'AppliedFilter-button',\n {\n isSelected,\n },\n className\n )}\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 'clsx';\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 { Button, ButtonSize, ButtonType } from '@launchpad-ui/button';\nimport { Close, ExpandMore, IconSize } from '@launchpad-ui/icons';\nimport { Tooltip } from '@launchpad-ui/tooltip';\nimport { useId } from '@react-aria/utils';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport cx from 'clsx';\nimport { Children, forwardRef } 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, {\n 'is-clearable': isClearable || isSelected,\n })}\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 <Button\n className=\"Filter-clear\"\n size={ButtonSize.SMALL}\n type={ButtonType.ICON}\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": ";AAAA;;;
|
6
|
-
"names": []
|
5
|
+
"mappings": "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",
|
6
|
+
"names": ["cx", "jsx", "jsxs", "jsx", "jsxs", "cx", "Dropdown", "cx", "Button", "ExpandMore", "IconSize", "cx", "Children", "forwardRef", "jsx", "jsxs", "jsx", "jsxs", "SEARCH_INPUT_THRESHOLD", "cx", "Dropdown"]
|
7
7
|
}
|
package/dist/index.js
CHANGED
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
17
17
|
}
|
18
18
|
return to;
|
19
19
|
};
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
22
|
+
mod
|
23
|
+
));
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
22
25
|
|
23
26
|
// src/index.ts
|
@@ -41,25 +44,41 @@ var import_icons = require("@launchpad-ui/icons");
|
|
41
44
|
var import_clsx = __toESM(require("clsx"));
|
42
45
|
var import_react = require("react");
|
43
46
|
var import_Filter = require("./styles/Filter.css");
|
47
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
44
48
|
var AppliedFilterButton = (0, import_react.forwardRef)((props, ref) => {
|
45
49
|
const { name, className, isSelected, children, onClickFilterButton } = props;
|
46
50
|
const hasDescription = import_react.Children.count(children) !== 0;
|
47
|
-
return /* @__PURE__ */
|
48
|
-
className: "AppliedFilter-buttonContainer"
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
51
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
52
|
+
className: "AppliedFilter-buttonContainer",
|
53
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
|
54
|
+
"aria-haspopup": true,
|
55
|
+
className: (0, import_clsx.default)(
|
56
|
+
"AppliedFilter-button",
|
57
|
+
{
|
58
|
+
isSelected
|
59
|
+
},
|
60
|
+
className
|
61
|
+
),
|
62
|
+
ref,
|
63
|
+
onClick: onClickFilterButton,
|
64
|
+
children: [
|
65
|
+
name && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
|
66
|
+
className: "AppliedFilter-name",
|
67
|
+
children: [
|
68
|
+
name,
|
69
|
+
hasDescription && ":"
|
70
|
+
]
|
71
|
+
}),
|
72
|
+
hasDescription && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
|
73
|
+
className: "AppliedFilter-description",
|
74
|
+
children
|
75
|
+
}),
|
76
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ExpandMore, {
|
77
|
+
size: import_icons.IconSize.SMALL
|
78
|
+
})
|
79
|
+
]
|
80
|
+
})
|
81
|
+
});
|
63
82
|
});
|
64
83
|
AppliedFilterButton.displayName = "AppliedFilterButton";
|
65
84
|
|
@@ -67,6 +86,7 @@ AppliedFilterButton.displayName = "AppliedFilterButton";
|
|
67
86
|
var import_button = require("@launchpad-ui/button");
|
68
87
|
var import_icons2 = require("@launchpad-ui/icons");
|
69
88
|
var import_menu = require("@launchpad-ui/menu");
|
89
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
70
90
|
var FilterMenu = ({
|
71
91
|
options,
|
72
92
|
onClearFilter,
|
@@ -82,42 +102,51 @@ var FilterMenu = ({
|
|
82
102
|
size
|
83
103
|
}) => {
|
84
104
|
const filterOptions = isLoading ? [{ name: "loading...", value: "loading...", isDisabled: true }] : options;
|
85
|
-
return /* @__PURE__ */
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
105
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
|
106
|
+
children: [
|
107
|
+
onClearFilter && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, {
|
108
|
+
tabIndex: 0,
|
109
|
+
className: "Menu-clear",
|
110
|
+
onClick: onClearFilter,
|
111
|
+
kind: import_button.ButtonKind.LINK,
|
112
|
+
children: "CLEAR FILTER"
|
113
|
+
}),
|
114
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_menu.Menu, {
|
115
|
+
enableVirtualization,
|
116
|
+
size,
|
117
|
+
onSelect,
|
118
|
+
children: [
|
119
|
+
enableSearch && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.MenuSearch, {
|
120
|
+
value: searchValue,
|
121
|
+
placeholder: searchPlaceholder,
|
122
|
+
onChange: onSearchChange,
|
123
|
+
ariaLabel: searchAriaLabel
|
124
|
+
}),
|
125
|
+
filterOptions.map((option, index) => {
|
126
|
+
if (option.isDivider) {
|
127
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.MenuDivider, {}, `divider-${index}`);
|
128
|
+
}
|
129
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.MenuItem, {
|
130
|
+
item: option,
|
131
|
+
disabled: option.isDisabled,
|
132
|
+
icon: option.isChecked ? import_icons2.Check : null,
|
133
|
+
role: "menuitemradio",
|
134
|
+
"aria-checked": option.isChecked ? "true" : void 0,
|
135
|
+
nested: option.nested,
|
136
|
+
groupHeader: option.groupHeader,
|
137
|
+
tooltip: option.isDisabled && disabledOptionTooltip ? disabledOptionTooltip : void 0,
|
138
|
+
tooltipPlacement: "right",
|
139
|
+
children: option.name
|
140
|
+
}, option.value);
|
141
|
+
})
|
142
|
+
]
|
143
|
+
})
|
144
|
+
]
|
145
|
+
});
|
118
146
|
};
|
119
147
|
|
120
148
|
// src/AppliedFilter.tsx
|
149
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
121
150
|
var SEARCH_INPUT_THRESHOLD = 4;
|
122
151
|
var AppliedFilter = ({
|
123
152
|
searchValue,
|
@@ -136,24 +165,29 @@ var AppliedFilter = ({
|
|
136
165
|
}) => {
|
137
166
|
const enableSearch = onSearchChange && (!!searchValue || options.length > SEARCH_INPUT_THRESHOLD || !isEmpty);
|
138
167
|
const dropdownClasses = (0, import_clsx2.default)("Filter-target", className);
|
139
|
-
return /* @__PURE__ */
|
168
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown.Dropdown, {
|
140
169
|
targetClassName: dropdownClasses,
|
141
170
|
placement: "bottom-start",
|
142
171
|
enableArrow: false,
|
143
|
-
...props
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
172
|
+
...props,
|
173
|
+
children: [
|
174
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AppliedFilterButton, {
|
175
|
+
name,
|
176
|
+
onClickFilterButton,
|
177
|
+
children: description
|
178
|
+
}),
|
179
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterMenu, {
|
180
|
+
options,
|
181
|
+
searchValue,
|
182
|
+
searchPlaceholder,
|
183
|
+
enableSearch,
|
184
|
+
searchAriaLabel,
|
185
|
+
onSearchChange,
|
186
|
+
onClearFilter,
|
187
|
+
isLoading
|
188
|
+
})
|
189
|
+
]
|
190
|
+
});
|
157
191
|
};
|
158
192
|
|
159
193
|
// src/Filter.tsx
|
@@ -169,6 +203,7 @@ var import_visually_hidden = require("@react-aria/visually-hidden");
|
|
169
203
|
var import_clsx3 = __toESM(require("clsx"));
|
170
204
|
var import_react2 = require("react");
|
171
205
|
var import_Filter2 = require("./styles/Filter.css");
|
206
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
172
207
|
var FilterButton = (0, import_react2.forwardRef)((props, ref) => {
|
173
208
|
const {
|
174
209
|
children,
|
@@ -186,42 +221,59 @@ var FilterButton = (0, import_react2.forwardRef)((props, ref) => {
|
|
186
221
|
const nameId = (0, import_utils.useId)();
|
187
222
|
const descriptionId = (0, import_utils.useId)();
|
188
223
|
const hasDescription = import_react2.Children.count(children) !== 0;
|
189
|
-
const nameElement = /* @__PURE__ */
|
190
|
-
className: "Filter-name"
|
191
|
-
|
192
|
-
|
224
|
+
const nameElement = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
|
225
|
+
className: "Filter-name",
|
226
|
+
children: [
|
227
|
+
name,
|
228
|
+
hasDescription && ":"
|
229
|
+
]
|
230
|
+
});
|
231
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
193
232
|
className: "Filter-buttonContainer",
|
194
|
-
"data-test-id": testId
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
233
|
+
"data-test-id": testId,
|
234
|
+
children: [
|
235
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
|
236
|
+
...rest,
|
237
|
+
"aria-labelledby": `${nameId} ${hasDescription ? descriptionId : ""}`,
|
238
|
+
"aria-haspopup": true,
|
239
|
+
className: (0, import_clsx3.default)("Filter-button", className, {
|
240
|
+
"is-clearable": isClearable || isSelected
|
241
|
+
}),
|
242
|
+
ref,
|
243
|
+
onClick: onClickFilterButton,
|
244
|
+
children: [
|
245
|
+
hideName ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_visually_hidden.VisuallyHidden, {
|
246
|
+
id: nameId,
|
247
|
+
children: nameElement
|
248
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
|
249
|
+
id: nameId,
|
250
|
+
children: nameElement
|
251
|
+
}),
|
252
|
+
hasDescription && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
|
253
|
+
id: descriptionId,
|
254
|
+
className: "Filter-description",
|
255
|
+
children
|
256
|
+
}),
|
257
|
+
!isClearable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons3.ExpandMore, {
|
258
|
+
size: import_icons3.IconSize.SMALL
|
259
|
+
})
|
260
|
+
]
|
261
|
+
}),
|
262
|
+
isClearable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, {
|
263
|
+
targetClassName: "Filter-clearTooltip",
|
264
|
+
content: clearTooltip,
|
265
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button2.Button, {
|
266
|
+
className: "Filter-clear",
|
267
|
+
size: import_button2.ButtonSize.SMALL,
|
268
|
+
type: import_button2.ButtonType.ICON,
|
269
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons3.Close, {
|
270
|
+
size: import_icons3.IconSize.TINY
|
271
|
+
}),
|
272
|
+
onClick: onClear
|
273
|
+
})
|
274
|
+
})
|
275
|
+
]
|
276
|
+
});
|
225
277
|
});
|
226
278
|
FilterButton.defaultProps = {
|
227
279
|
clearTooltip: "Clear filter"
|
@@ -229,6 +281,7 @@ FilterButton.defaultProps = {
|
|
229
281
|
FilterButton.displayName = "FilterButton";
|
230
282
|
|
231
283
|
// src/Filter.tsx
|
284
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
232
285
|
var SEARCH_INPUT_THRESHOLD2 = 4;
|
233
286
|
var Filter = ({
|
234
287
|
searchValue,
|
@@ -258,29 +311,34 @@ var Filter = ({
|
|
258
311
|
event.preventDefault();
|
259
312
|
onClear?.();
|
260
313
|
};
|
261
|
-
return /* @__PURE__ */
|
314
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown2.Dropdown, {
|
262
315
|
targetClassName: dropdownClasses,
|
263
|
-
...props
|
264
|
-
|
265
|
-
|
266
|
-
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
272
|
-
|
273
|
-
|
274
|
-
|
275
|
-
|
276
|
-
|
277
|
-
|
278
|
-
|
279
|
-
|
280
|
-
|
281
|
-
|
282
|
-
|
283
|
-
|
316
|
+
...props,
|
317
|
+
children: [
|
318
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterButton, {
|
319
|
+
isClearable,
|
320
|
+
onClear: handleClear,
|
321
|
+
name,
|
322
|
+
hideName,
|
323
|
+
isSelected,
|
324
|
+
onClickFilterButton,
|
325
|
+
testId,
|
326
|
+
children: description
|
327
|
+
}),
|
328
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterMenu, {
|
329
|
+
options,
|
330
|
+
searchValue,
|
331
|
+
searchPlaceholder,
|
332
|
+
searchAriaLabel,
|
333
|
+
enableSearch,
|
334
|
+
onSearchChange,
|
335
|
+
isLoading,
|
336
|
+
disabledOptionTooltip,
|
337
|
+
size,
|
338
|
+
enableVirtualization
|
339
|
+
})
|
340
|
+
]
|
341
|
+
});
|
284
342
|
};
|
285
343
|
// Annotate the CommonJS export names for ESM import in node:
|
286
344
|
0 && (module.exports = {
|
package/dist/index.js.map
CHANGED
@@ -2,6 +2,6 @@
|
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["../src/index.ts", "../../../scripts/react-shim.js", "../src/AppliedFilter.tsx", "../src/AppliedFilterButton.tsx", "../src/FilterMenu.tsx", "../src/Filter.tsx", "../src/FilterButton.tsx"],
|
4
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 * as React from 'react';\nexport { React };\n", "import type { FilterOption } from './FilterMenu';\nimport type { ReactNode } from 'react';\n\nimport { Dropdown } from '@launchpad-ui/dropdown';\nimport cx from 'clsx';\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 'clsx';\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(\n 'AppliedFilter-button',\n {\n isSelected,\n },\n className\n )}\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 'clsx';\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 { Button, ButtonSize, ButtonType } from '@launchpad-ui/button';\nimport { Close, ExpandMore, IconSize } from '@launchpad-ui/icons';\nimport { Tooltip } from '@launchpad-ui/tooltip';\nimport { useId } from '@react-aria/utils';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport cx from 'clsx';\nimport { Children, forwardRef } 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, {\n 'is-clearable': isClearable || isSelected,\n })}\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 <Button\n className=\"Filter-clear\"\n size={ButtonSize.SMALL}\n type={ButtonType.ICON}\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": "
|
6
|
-
"names": []
|
5
|
+
"mappings": "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",
|
6
|
+
"names": ["import_clsx", "cx", "import_icons", "cx", "import_dropdown", "import_clsx", "import_button", "import_icons", "import_clsx", "import_react", "import_Filter", "cx", "SEARCH_INPUT_THRESHOLD", "cx"]
|
7
7
|
}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@launchpad-ui/filter",
|
3
|
-
"version": "0.
|
3
|
+
"version": "0.2.1",
|
4
4
|
"status": "beta",
|
5
5
|
"publishConfig": {
|
6
6
|
"access": "public"
|
@@ -26,19 +26,19 @@
|
|
26
26
|
},
|
27
27
|
"source": "src/index.ts",
|
28
28
|
"dependencies": {
|
29
|
-
"@launchpad-ui/button": "~0.
|
30
|
-
"@launchpad-ui/dropdown": "~0.
|
31
|
-
"@launchpad-ui/icons": "~0.
|
32
|
-
"@launchpad-ui/menu": "~0.
|
29
|
+
"@launchpad-ui/button": "~0.4.0",
|
30
|
+
"@launchpad-ui/dropdown": "~0.3.1",
|
31
|
+
"@launchpad-ui/icons": "~0.3.1",
|
32
|
+
"@launchpad-ui/menu": "~0.4.1",
|
33
33
|
"@launchpad-ui/tokens": "~0.1.5",
|
34
|
-
"@launchpad-ui/tooltip": "~0.
|
34
|
+
"@launchpad-ui/tooltip": "~0.4.1",
|
35
35
|
"@react-aria/utils": "^3.13.1",
|
36
36
|
"@react-aria/visually-hidden": "^3.4.0",
|
37
37
|
"clsx": "^1.2.0"
|
38
38
|
},
|
39
39
|
"peerDependencies": {
|
40
|
-
"react": "^
|
41
|
-
"react-dom": "^
|
40
|
+
"react": "^18.0.0",
|
41
|
+
"react-dom": "^18.0.0"
|
42
42
|
},
|
43
43
|
"devDependencies": {
|
44
44
|
"react": "^18.2.0",
|