@oneplatformdev/ui 0.1.99-beta.214 → 0.1.99-beta.215
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/CHANGELOG.md +16 -0
- package/Combobox/Combobox.d.ts +1 -1
- package/Combobox/Combobox.d.ts.map +1 -1
- package/Combobox/Combobox.js +130 -228
- package/Combobox/Combobox.js.map +1 -1
- package/Combobox/Combobox.stories.js +113 -80
- package/Combobox/Combobox.stories.js.map +1 -1
- package/Combobox/Combobox.types.d.ts +35 -13
- package/Combobox/Combobox.types.d.ts.map +1 -1
- package/Combobox/Combobox.types.js +4 -1
- package/Combobox/Combobox.types.js.map +1 -1
- package/Combobox/ComboboxOptionItem.d.ts +1 -0
- package/Combobox/ComboboxOptionItem.d.ts.map +1 -1
- package/Combobox/ComboboxOptionItem.js +67 -38
- package/Combobox/ComboboxOptionItem.js.map +1 -1
- package/Combobox/ComboboxRenderContent.d.ts +13 -0
- package/Combobox/ComboboxRenderContent.d.ts.map +1 -0
- package/Combobox/ComboboxRenderContent.js +118 -0
- package/Combobox/ComboboxRenderContent.js.map +1 -0
- package/Combobox/{ComboboxOptions.d.ts → ComboboxRenderOptions.d.ts} +2 -2
- package/Combobox/ComboboxRenderOptions.d.ts.map +1 -0
- package/Combobox/ComboboxRenderOptions.js +53 -0
- package/Combobox/ComboboxRenderOptions.js.map +1 -0
- package/Combobox/ComboboxRenderTrigger.d.ts +13 -0
- package/Combobox/ComboboxRenderTrigger.d.ts.map +1 -0
- package/Combobox/ComboboxRenderTrigger.js +120 -0
- package/Combobox/ComboboxRenderTrigger.js.map +1 -0
- package/ScrollArea/ScrollArea.d.ts +5 -1
- package/ScrollArea/ScrollArea.d.ts.map +1 -1
- package/ScrollArea/ScrollArea.js +23 -17
- package/ScrollArea/ScrollArea.js.map +1 -1
- package/package.json +4 -4
- package/Combobox/ComboboxOptions.d.ts.map +0 -1
- package/Combobox/ComboboxOptions.js +0 -75
- package/Combobox/ComboboxOptions.js.map +0 -1
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
import { jsx as t, jsxs as
|
|
2
|
-
import { useState as
|
|
3
|
-
import { Combobox as
|
|
4
|
-
const
|
|
5
|
-
const
|
|
6
|
-
if (
|
|
7
|
-
for (const s of
|
|
8
|
-
|
|
1
|
+
import { jsx as t, jsxs as r } from "react/jsx-runtime";
|
|
2
|
+
import { useState as g, useMemo as v } from "react";
|
|
3
|
+
import { Combobox as m } from "./Combobox.js";
|
|
4
|
+
const f = (e) => new Promise((n) => setTimeout(n, e)), O = (e = []) => {
|
|
5
|
+
const n = [], l = (a) => {
|
|
6
|
+
if (a?.length)
|
|
7
|
+
for (const s of a)
|
|
8
|
+
n.push(s), s.items?.length && l(s.items);
|
|
9
9
|
};
|
|
10
|
-
return
|
|
11
|
-
}, d = (e,
|
|
12
|
-
await
|
|
13
|
-
const
|
|
14
|
-
if (!
|
|
15
|
-
const s =
|
|
16
|
-
s.filter((
|
|
17
|
-
),
|
|
18
|
-
const
|
|
19
|
-
return !(
|
|
10
|
+
return l(e), n;
|
|
11
|
+
}, d = (e, n = 350) => async (l) => {
|
|
12
|
+
await f(n);
|
|
13
|
+
const a = (l ?? "").trim().toLowerCase();
|
|
14
|
+
if (!a) return e;
|
|
15
|
+
const s = O(e), y = new Set(
|
|
16
|
+
s.filter((c) => String(c.label).toLowerCase().includes(a)).map((c) => String(c.value))
|
|
17
|
+
), b = (c) => c.map((u) => {
|
|
18
|
+
const h = u.items?.length ? b(u.items) : void 0;
|
|
19
|
+
return !(y.has(String(u.value)) || String(u.label).toLowerCase().includes(a)) && !h?.length ? null : { ...u, items: h };
|
|
20
20
|
}).filter(Boolean);
|
|
21
|
-
return
|
|
22
|
-
},
|
|
21
|
+
return b(e);
|
|
22
|
+
}, i = [
|
|
23
23
|
{ value: "ua", label: "Ukraine" },
|
|
24
24
|
{ value: "pl", label: "Poland" },
|
|
25
25
|
{ value: "de", label: "Germany" },
|
|
26
26
|
{ value: "fr", label: "France" },
|
|
27
27
|
{ value: "es", label: "Spain" },
|
|
28
28
|
{ value: "it", label: "Italy" }
|
|
29
|
-
],
|
|
29
|
+
], p = [
|
|
30
30
|
{
|
|
31
31
|
value: "europe",
|
|
32
32
|
label: "Europe",
|
|
@@ -77,27 +77,51 @@ const b = (e) => new Promise((l) => setTimeout(l, e)), x = (e = []) => {
|
|
|
77
77
|
items: [
|
|
78
78
|
{ value: "us", label: "United States" },
|
|
79
79
|
{ value: "ca", label: "Canada" },
|
|
80
|
-
{ value: "mx", label: "Mexico" }
|
|
80
|
+
{ value: "mx", label: "Mexico" },
|
|
81
|
+
{ value: "north-america-long", label: "To long option to test wrapping. ".repeat(3) },
|
|
82
|
+
{ value: "north-america-long-single", label: "To long option to test wrapping. ".replace(/ /g, "_").repeat(3) }
|
|
81
83
|
]
|
|
82
84
|
}
|
|
83
|
-
]
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
85
|
+
], x = (e) => e.flatMap((n) => [
|
|
86
|
+
n,
|
|
87
|
+
...n.items ? x(n.items) : []
|
|
88
|
+
]);
|
|
89
|
+
function o({ initialValue: e = "", ...n }) {
|
|
90
|
+
const [l, a] = g(e), s = v(
|
|
91
|
+
() => n.fetchOptions,
|
|
87
92
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
88
93
|
[]
|
|
89
94
|
);
|
|
90
|
-
return /* @__PURE__ */
|
|
91
|
-
/* @__PURE__ */ t(
|
|
92
|
-
/* @__PURE__ */
|
|
95
|
+
return /* @__PURE__ */ r("div", { className: "max-w-sm", children: [
|
|
96
|
+
/* @__PURE__ */ t(m, { type: "single", ...n, value: l, onChange: a, fetchOptions: s }),
|
|
97
|
+
/* @__PURE__ */ r("div", { className: "mt-3 text-xs text-muted-foreground", children: [
|
|
93
98
|
"value: ",
|
|
94
|
-
/* @__PURE__ */ t("span", { className: "font-mono", children: String(
|
|
99
|
+
/* @__PURE__ */ t("span", { className: "font-mono", children: String(l || "") })
|
|
95
100
|
] })
|
|
96
101
|
] });
|
|
97
102
|
}
|
|
98
|
-
|
|
103
|
+
function C({ initialValue: e = [], ...n }) {
|
|
104
|
+
const [l, a] = g(e), s = v(() => n.fetchOptions, []);
|
|
105
|
+
return /* @__PURE__ */ r("div", { className: "max-w-sm", children: [
|
|
106
|
+
/* @__PURE__ */ t(
|
|
107
|
+
m,
|
|
108
|
+
{
|
|
109
|
+
...n,
|
|
110
|
+
type: "multi",
|
|
111
|
+
value: l,
|
|
112
|
+
onChange: a,
|
|
113
|
+
fetchOptions: s
|
|
114
|
+
}
|
|
115
|
+
),
|
|
116
|
+
/* @__PURE__ */ r("div", { className: "mt-3 text-xs text-muted-foreground", children: [
|
|
117
|
+
"value: ",
|
|
118
|
+
/* @__PURE__ */ t("span", { className: "font-mono", children: (l || []).join(", ") })
|
|
119
|
+
] })
|
|
120
|
+
] });
|
|
121
|
+
}
|
|
122
|
+
const L = {
|
|
99
123
|
title: "Combobox",
|
|
100
|
-
component:
|
|
124
|
+
component: m,
|
|
101
125
|
parameters: {
|
|
102
126
|
layout: "centered"
|
|
103
127
|
},
|
|
@@ -106,7 +130,7 @@ const A = {
|
|
|
106
130
|
searchLabel: "Type to search...",
|
|
107
131
|
emptyLabel: "No options",
|
|
108
132
|
disabled: !1,
|
|
109
|
-
fetchOptions: d(
|
|
133
|
+
fetchOptions: d(i, 250)
|
|
110
134
|
},
|
|
111
135
|
argTypes: {
|
|
112
136
|
fetchOptions: { control: !1 },
|
|
@@ -121,49 +145,49 @@ const A = {
|
|
|
121
145
|
decorators: [
|
|
122
146
|
(e) => /* @__PURE__ */ t("div", { className: "p-6 w-[420px]", children: /* @__PURE__ */ t(e, {}) })
|
|
123
147
|
]
|
|
124
|
-
},
|
|
125
|
-
render: (e) => /* @__PURE__ */ t(
|
|
126
|
-
}, L = {
|
|
127
|
-
render: (e) => /* @__PURE__ */ t(a, { ...e, initialValue: "pl" })
|
|
148
|
+
}, M = {
|
|
149
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
128
150
|
}, P = {
|
|
151
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e, initialValue: "pl" })
|
|
152
|
+
}, T = {
|
|
129
153
|
args: { disabled: !0 },
|
|
130
|
-
render: (e) => /* @__PURE__ */ t(
|
|
131
|
-
},
|
|
154
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e, initialValue: "de" })
|
|
155
|
+
}, V = {
|
|
132
156
|
args: {
|
|
133
|
-
options:
|
|
134
|
-
fetchOptions: async () =>
|
|
157
|
+
options: i,
|
|
158
|
+
fetchOptions: async () => i
|
|
135
159
|
},
|
|
136
|
-
render: (e) => /* @__PURE__ */ t(
|
|
137
|
-
},
|
|
160
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
161
|
+
}, F = {
|
|
138
162
|
args: {
|
|
139
|
-
fetchOptions: d(
|
|
163
|
+
fetchOptions: d(i, 1200)
|
|
140
164
|
},
|
|
141
|
-
render: (e) => /* @__PURE__ */ t(
|
|
165
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
142
166
|
}, k = {
|
|
143
167
|
args: {
|
|
144
168
|
emptyLabel: "Nothing found",
|
|
145
169
|
emptyAction: (e) => {
|
|
146
|
-
const
|
|
170
|
+
const n = !!e.search?.trim();
|
|
147
171
|
return /* @__PURE__ */ t(
|
|
148
172
|
"button",
|
|
149
173
|
{
|
|
150
174
|
type: "button",
|
|
151
175
|
className: "inline-flex items-center justify-center rounded-md border px-3 py-1.5 text-sm",
|
|
152
|
-
disabled: !
|
|
176
|
+
disabled: !n,
|
|
153
177
|
onClick: () => {
|
|
154
|
-
const
|
|
155
|
-
e.setOptions([
|
|
178
|
+
const l = e.search.trim(), a = { value: l, label: `Create "${l}"` };
|
|
179
|
+
e.setOptions([a]), e.setLoading(!1);
|
|
156
180
|
},
|
|
157
181
|
children: "Create option"
|
|
158
182
|
}
|
|
159
183
|
);
|
|
160
184
|
}
|
|
161
185
|
},
|
|
162
|
-
render: (e) => /* @__PURE__ */ t(
|
|
163
|
-
},
|
|
186
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
187
|
+
}, I = {
|
|
164
188
|
args: {
|
|
165
|
-
commandInputAction: (e) => /* @__PURE__ */
|
|
166
|
-
/* @__PURE__ */
|
|
189
|
+
commandInputAction: (e) => /* @__PURE__ */ r("div", { className: "px-3 py-2 flex items-center justify-between text-xs text-muted-foreground", children: [
|
|
190
|
+
/* @__PURE__ */ r("span", { children: [
|
|
167
191
|
"results: ",
|
|
168
192
|
/* @__PURE__ */ t("span", { className: "font-mono", children: e.options.length })
|
|
169
193
|
] }),
|
|
@@ -180,8 +204,8 @@ const A = {
|
|
|
180
204
|
)
|
|
181
205
|
] })
|
|
182
206
|
},
|
|
183
|
-
render: (e) => /* @__PURE__ */ t(
|
|
184
|
-
},
|
|
207
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
208
|
+
}, B = {
|
|
185
209
|
args: {
|
|
186
210
|
listHeadAction: (e) => /* @__PURE__ */ t(
|
|
187
211
|
"button",
|
|
@@ -195,8 +219,8 @@ const A = {
|
|
|
195
219
|
}
|
|
196
220
|
)
|
|
197
221
|
},
|
|
198
|
-
render: (e) => /* @__PURE__ */ t(
|
|
199
|
-
},
|
|
222
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
223
|
+
}, E = {
|
|
200
224
|
args: {
|
|
201
225
|
listFooterAction: (e) => /* @__PURE__ */ t(
|
|
202
226
|
"button",
|
|
@@ -210,51 +234,60 @@ const A = {
|
|
|
210
234
|
}
|
|
211
235
|
)
|
|
212
236
|
},
|
|
213
|
-
render: (e) => /* @__PURE__ */ t(
|
|
214
|
-
},
|
|
237
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
238
|
+
}, W = {
|
|
215
239
|
args: {
|
|
216
|
-
fetchOptions: d(
|
|
240
|
+
fetchOptions: d(p, 250),
|
|
217
241
|
defaultNodeDisabled: !1,
|
|
218
242
|
defaultNodeMatched: !1,
|
|
219
243
|
defaultNodeMuted: !0,
|
|
220
244
|
defaultNodeInteractive: !1
|
|
221
245
|
},
|
|
222
|
-
render: (e) => /* @__PURE__ */ t(
|
|
223
|
-
},
|
|
246
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
247
|
+
}, j = {
|
|
224
248
|
args: {
|
|
225
|
-
fetchOptions: d(
|
|
249
|
+
fetchOptions: d(p, 250),
|
|
226
250
|
onMount: async (e) => {
|
|
227
|
-
await
|
|
251
|
+
await f(900), e.setOptions(x(p));
|
|
228
252
|
}
|
|
229
253
|
},
|
|
230
|
-
render: (e) => /* @__PURE__ */ t(
|
|
231
|
-
},
|
|
254
|
+
render: (e) => /* @__PURE__ */ t(C, { ...e, initialValue: ["fr", "de"] })
|
|
255
|
+
}, q = {
|
|
256
|
+
args: {
|
|
257
|
+
fetchOptions: d(i, 250),
|
|
258
|
+
onMount: async (e) => {
|
|
259
|
+
await f(900), e.setOptions(i), e.setLoading(!1);
|
|
260
|
+
}
|
|
261
|
+
},
|
|
262
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
263
|
+
}, D = {
|
|
232
264
|
args: {
|
|
233
265
|
renderTrigger: (e) => (console.log("state", e), /* @__PURE__ */ t(
|
|
234
266
|
"button",
|
|
235
267
|
{
|
|
236
268
|
type: "button",
|
|
237
269
|
className: "w-full",
|
|
238
|
-
onClick: () => e.setOpen((
|
|
270
|
+
onClick: () => e.setOpen((n) => !n),
|
|
239
271
|
children: e.selectedOption ? `Selected: ${e.selectedOption.label}` : "Select option..."
|
|
240
272
|
}
|
|
241
273
|
))
|
|
242
274
|
},
|
|
243
|
-
render: (e) => /* @__PURE__ */ t(
|
|
275
|
+
render: (e) => /* @__PURE__ */ t(o, { ...e })
|
|
244
276
|
};
|
|
245
277
|
export {
|
|
246
|
-
|
|
247
|
-
|
|
278
|
+
M as Default,
|
|
279
|
+
T as Disabled,
|
|
248
280
|
k as EmptyStateWithAction,
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
F as
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
281
|
+
W as NestedOptions,
|
|
282
|
+
j as NestedOptionsMulti,
|
|
283
|
+
q as OnMountPrefetch,
|
|
284
|
+
D as RenderCustomTrigger,
|
|
285
|
+
F as SlowFetchLoading,
|
|
286
|
+
I as WithCommandInputAction,
|
|
287
|
+
E as WithListFooterAction,
|
|
288
|
+
B as WithListHeadAction,
|
|
289
|
+
V as WithStaticOptionsProp,
|
|
290
|
+
P as WithValueSelected,
|
|
291
|
+
L as default
|
|
259
292
|
};
|
|
260
293
|
//# sourceMappingURL=Combobox.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.stories.js","sources":["../../src/Combobox/Combobox.stories.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport type { Meta, StoryObj } from '@storybook/react';\n\nimport { Combobox } from './Combobox';\nimport type {\n ComboboxCallbackStateParams,\n ComboboxOption,\n ComboboxProps,\n} from './Combobox.types';\n\nconst sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));\n\nconst flatten = (nodes: ComboboxOption[] = []): ComboboxOption[] => {\n const res: ComboboxOption[] = [];\n const walk = (list?: ComboboxOption[]) => {\n if (!list?.length) return;\n for (const n of list) {\n res.push(n);\n if (n.items?.length) walk(n.items);\n }\n };\n walk(nodes);\n return res;\n};\n\nconst createFetchOptions =\n (all: ComboboxOption[], delayMs = 350): ComboboxProps['fetchOptions'] =>\n async (search?: string) => {\n await sleep(delayMs);\n\n const q = (search ?? '').trim().toLowerCase();\n if (!q) return all;\n\n // simple \"contains\" search across flattened options; then return top-level filtered\n // (enough for Storybook demos; your real API can do better)\n const allFlat = flatten(all);\n const matchedValues = new Set(\n allFlat\n .filter((o) => String(o.label).toLowerCase().includes(q))\n .map((o) => String(o.value)),\n );\n\n const filterTree = (list: ComboboxOption[]): ComboboxOption[] => {\n return list\n .map((n) => {\n const items = n.items?.length ? filterTree(n.items) : undefined;\n const selfMatch =\n matchedValues.has(String(n.value)) ||\n String(n.label).toLowerCase().includes(q);\n\n if (!selfMatch && !items?.length) return null;\n return { ...n, items };\n })\n .filter(Boolean) as ComboboxOption[];\n };\n\n return filterTree(all);\n };\n\nconst BASE_OPTIONS: ComboboxOption[] = [\n { value: 'ua', label: 'Ukraine' },\n { value: 'pl', label: 'Poland' },\n { value: 'de', label: 'Germany' },\n { value: 'fr', label: 'France' },\n { value: 'es', label: 'Spain' },\n { value: 'it', label: 'Italy' },\n];\n\nconst NESTED_OPTIONS: ComboboxOption[] = [\n {\n value: 'europe',\n label: 'Europe',\n items: [\n {\n value: 'fr',\n label: 'France',\n items: [\n {\n value: 'paris',\n label: 'Paris (Île-de-France)',\n items: [\n { value: 'paris-1', label: 'Paris 1st arrondissement' },\n { value: 'paris-3', label: 'Paris 3rd arrondissement' },\n { value: 'paris-10', label: 'Paris 10th arrondissement' },\n ],\n },\n { value: 'marseille', label: 'Marseille (Provence-Alpes-Côte d\\'Azur)' },\n {\n value: 'lyon',\n label: 'Lyon (Auvergne-Rhône-Alpes)',\n items: [\n { value: 'lyon-presquile', label: 'Presqu\\'île (1st/2nd)' },\n { value: 'lyon-vieux', label: 'Vieux Lyon' },\n ],\n },\n { value: 'toulouse', label: 'Toulouse (Occitanie)' },\n { value: 'bordeaux', label: 'Bordeaux (Nouvelle-Aquitaine)' },\n { value: 'strasbourg', label: 'Strasbourg (Grand Est)' },\n {\n value: 'rennes',\n label: 'Rennes (Brittany)',\n items: [\n { value: 'rennes-centre', label: 'Rennes Centre' },\n { value: 'rennes-beauregard', label: 'Beauregard' },\n ],\n },\n ]\n },\n { value: 'ua', label: 'Ukraine' },\n { value: 'pl', label: 'Poland' },\n { value: 'de', label: 'Germany' },\n ],\n },\n {\n value: 'north-america',\n label: 'North America',\n items: [\n { value: 'us', label: 'United States' },\n { value: 'ca', label: 'Canada' },\n { value: 'mx', label: 'Mexico' },\n ],\n },\n];\n\ntype ControlledProps = Omit<ComboboxProps, 'value' | 'onChange'> & {\n initialValue?: ComboboxProps['value'];\n};\n\nfunction ControlledCombobox({ initialValue = '', ...args }: ControlledProps) {\n const [value, setValue] = useState<ComboboxProps['value']>(initialValue);\n\n // keep stable reference if someone passes inline fetchOptions\n const fetchOptions = useMemo(\n () => args.fetchOptions,\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [],\n );\n\n return (\n <div className=\"max-w-sm\">\n <Combobox {...args} value={value} onChange={setValue} fetchOptions={fetchOptions} />\n <div className=\"mt-3 text-xs text-muted-foreground\">\n value: <span className=\"font-mono\">{String(value || '')}</span>\n </div>\n </div>\n );\n}\n\nconst meta = {\n title: 'Combobox',\n component: Combobox,\n parameters: {\n layout: 'centered',\n },\n args: {\n placeholder: 'Select option...',\n searchLabel: 'Type to search...',\n emptyLabel: 'No options',\n disabled: false,\n fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n },\n argTypes: {\n fetchOptions: { control: false },\n onChange: { control: false },\n onMount: { control: false },\n emptyAction: { control: false },\n commandInputAction: { control: false },\n listHeadAction: { control: false },\n options: { control: false },\n value: { control: false },\n },\n decorators: [\n (Story) => (\n <div className=\"p-6 w-[420px]\">\n <Story />\n </div>\n ),\n ],\n} satisfies Meta<typeof Combobox>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\n/** 1) Default (async options) */\nexport const Default: Story = {\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 2) With initial selected value */\nexport const WithValueSelected: Story = {\n render: (args) => <ControlledCombobox {...args} initialValue=\"pl\" />,\n};\n\n/** 3) Disabled */\nexport const Disabled: Story = {\n args: { disabled: true },\n render: (args) => <ControlledCombobox {...args} initialValue=\"de\" />,\n};\n\n/** 4) Static options via `options` prop (no async needed, but fetchOptions still required) */\nexport const WithStaticOptionsProp: Story = {\n args: {\n options: BASE_OPTIONS,\n fetchOptions: async () => BASE_OPTIONS,\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 5) Slow fetch to show loading state on open/search */\nexport const SlowFetchLoading: Story = {\n args: {\n fetchOptions: createFetchOptions(BASE_OPTIONS, 1200),\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 6) Empty state with action (search something like \"zzz\") */\nexport const EmptyStateWithAction: Story = {\n args: {\n emptyLabel: 'Nothing found',\n emptyAction: (st: ComboboxCallbackStateParams) => {\n const canCreate = Boolean(st.search?.trim());\n return (\n <button\n type=\"button\"\n className=\"inline-flex items-center justify-center rounded-md border px-3 py-1.5 text-sm\"\n disabled={!canCreate}\n onClick={() => {\n const v = st.search.trim();\n const next: ComboboxOption = { value: v, label: `Create \"${v}\"` };\n st.setOptions([next]);\n st.setLoading(false);\n }}\n >\n Create option\n </button>\n );\n },\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 7) commandInputAction (helper row under input) */\nexport const WithCommandInputAction: Story = {\n args: {\n commandInputAction: (st: ComboboxCallbackStateParams) => (\n <div className=\"px-3 py-2 flex items-center justify-between text-xs text-muted-foreground\">\n <span>\n results: <span className=\"font-mono\">{st.options.length}</span>\n </span>\n <button\n type=\"button\"\n className=\"underline\"\n onClick={() => {\n st.setSearch('');\n st.setLoading(false);\n }}\n >\n Clear search\n </button>\n </div>\n ),\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 8) listHeadAction (top action inside list) */\nexport const WithListHeadAction: Story = {\n args: {\n listHeadAction: (st: ComboboxCallbackStateParams) => (\n <button\n type=\"button\"\n className=\"w-full text-left px-3 py-2 text-sm\"\n onClick={() => {\n st.setSearch('');\n st.setOpen(false);\n }}\n >\n Close list\n </button>\n ),\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 9) listHeadAction (footer action outside of list) */\nexport const WithListFooterAction: Story = {\n args: {\n listFooterAction: (st: ComboboxCallbackStateParams) => (\n <button\n type=\"button\"\n className=\"w-full text-left min-h-10 text-sm\"\n onClick={() => {\n st.setSearch('');\n st.setOpen(false);\n }}\n >\n list footer action\n </button>\n ),\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 10) Nested options tree */\nexport const NestedOptions: Story = {\n args: {\n fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n defaultNodeDisabled: false,\n defaultNodeMatched: false,\n defaultNodeMuted: true,\n defaultNodeInteractive: false,\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 11) onMount initial loading (simulate prefetch on mount) */\nexport const OnMountPrefetch: Story = {\n args: {\n fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n onMount: async (st: ComboboxCallbackStateParams) => {\n await sleep(900);\n st.setOptions(BASE_OPTIONS);\n st.setLoading(false);\n },\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 12) render custom trigger */\nexport const RenderCustomTrigger: Story = {\n args: {\n renderTrigger: (state) => {\n console.log('state', state);\n return (\n <button\n type=\"button\"\n className=\"w-full\"\n onClick={() => state.setOpen((o) => !o)}\n >\n {state.selectedOption ? `Selected: ${state.selectedOption.label}` : 'Select option...'}\n </button>\n )\n }\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n"],"names":["sleep","ms","r","flatten","nodes","res","walk","list","n","createFetchOptions","all","delayMs","search","q","allFlat","matchedValues","o","filterTree","items","BASE_OPTIONS","NESTED_OPTIONS","ControlledCombobox","initialValue","args","value","setValue","useState","fetchOptions","useMemo","jsxs","jsx","Combobox","meta","Story","Default","WithValueSelected","Disabled","WithStaticOptionsProp","SlowFetchLoading","EmptyStateWithAction","st","canCreate","v","next","WithCommandInputAction","WithListHeadAction","WithListFooterAction","NestedOptions","OnMountPrefetch","RenderCustomTrigger","state"],"mappings":";;;AAUA,MAAMA,IAAQ,CAACC,MAAe,IAAI,QAAQ,CAACC,MAAM,WAAWA,GAAGD,CAAE,CAAC,GAE5DE,IAAU,CAACC,IAA0B,OAAyB;AAClE,QAAMC,IAAwB,CAAA,GACxBC,IAAO,CAACC,MAA4B;AACxC,QAAKA,GAAM;AACX,iBAAWC,KAAKD;AACd,QAAAF,EAAI,KAAKG,CAAC,GACNA,EAAE,OAAO,UAAQF,EAAKE,EAAE,KAAK;AAAA,EAErC;AACA,SAAAF,EAAKF,CAAK,GACHC;AACT,GAEMI,IACJ,CAACC,GAAuBC,IAAU,QAChC,OAAOC,MAAoB;AACzB,QAAMZ,EAAMW,CAAO;AAEnB,QAAME,KAAKD,KAAU,IAAI,KAAA,EAAO,YAAA;AAChC,MAAI,CAACC,EAAG,QAAOH;AAIf,QAAMI,IAAUX,EAAQO,CAAG,GACrBK,IAAgB,IAAI;AAAA,IACxBD,EACG,OAAO,CAACE,MAAM,OAAOA,EAAE,KAAK,EAAE,YAAA,EAAc,SAASH,CAAC,CAAC,EACvD,IAAI,CAACG,MAAM,OAAOA,EAAE,KAAK,CAAC;AAAA,EAAA,GAGzBC,IAAa,CAACV,MACXA,EACJ,IAAI,CAACC,MAAM;AACV,UAAMU,IAAQV,EAAE,OAAO,SAASS,EAAWT,EAAE,KAAK,IAAI;AAKtD,WAAI,EAHFO,EAAc,IAAI,OAAOP,EAAE,KAAK,CAAC,KACjC,OAAOA,EAAE,KAAK,EAAE,YAAA,EAAc,SAASK,CAAC,MAExB,CAACK,GAAO,SAAe,OAClC,EAAE,GAAGV,GAAG,OAAAU,EAAA;AAAA,EACjB,CAAC,EACA,OAAO,OAAO;AAGnB,SAAOD,EAAWP,CAAG;AACvB,GAEES,IAAiC;AAAA,EACrC,EAAE,OAAO,MAAM,OAAO,UAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,UAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,QAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,QAAA;AACxB,GAEMC,IAAmC;AAAA,EACvC;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,MACL;AAAA,QACE,OAAO;AAAA,QACP,OAAO;AAAA,QACP,OAAO;AAAA,UACL;AAAA,YACE,OAAO;AAAA,YACP,OAAO;AAAA,YACP,OAAO;AAAA,cACL,EAAE,OAAO,WAAW,OAAO,2BAAA;AAAA,cAC3B,EAAE,OAAO,WAAW,OAAO,2BAAA;AAAA,cAC3B,EAAE,OAAO,YAAY,OAAO,4BAAA;AAAA,YAA4B;AAAA,UAC1D;AAAA,UAEF,EAAE,OAAO,aAAa,OAAO,yCAAA;AAAA,UAC7B;AAAA,YACE,OAAO;AAAA,YACP,OAAO;AAAA,YACP,OAAO;AAAA,cACL,EAAE,OAAO,kBAAkB,OAAO,uBAAA;AAAA,cAClC,EAAE,OAAO,cAAc,OAAO,aAAA;AAAA,YAAa;AAAA,UAC7C;AAAA,UAEF,EAAE,OAAO,YAAY,OAAO,uBAAA;AAAA,UAC5B,EAAE,OAAO,YAAY,OAAO,gCAAA;AAAA,UAC5B,EAAE,OAAO,cAAc,OAAO,yBAAA;AAAA,UAC9B;AAAA,YACE,OAAO;AAAA,YACP,OAAO;AAAA,YACP,OAAO;AAAA,cACL,EAAE,OAAO,iBAAiB,OAAO,gBAAA;AAAA,cACjC,EAAE,OAAO,qBAAqB,OAAO,aAAA;AAAA,YAAa;AAAA,UACpD;AAAA,QACF;AAAA,MACF;AAAA,MAEF,EAAE,OAAO,MAAM,OAAO,UAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,UAAA;AAAA,IAAU;AAAA,EAClC;AAAA,EAEF;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,MACL,EAAE,OAAO,MAAM,OAAO,gBAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,IAAS;AAAA,EACjC;AAEJ;AAMA,SAASC,EAAmB,EAAE,cAAAC,IAAe,IAAI,GAAGC,KAAyB;AAC3E,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAiCJ,CAAY,GAGjEK,IAAeC;AAAA,IACnB,MAAML,EAAK;AAAA;AAAA,IAEX,CAAA;AAAA,EAAC;AAGH,SACE,gBAAAM,EAAC,OAAA,EAAI,WAAU,YACb,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAU,GAAGR,GAAM,OAAAC,GAAc,UAAUC,GAAU,cAAAE,GAA4B;AAAA,IAClF,gBAAAE,EAAC,OAAA,EAAI,WAAU,sCAAqC,UAAA;AAAA,MAAA;AAAA,wBAC1C,QAAA,EAAK,WAAU,aAAa,UAAA,OAAOL,KAAS,EAAE,EAAA,CAAE;AAAA,IAAA,EAAA,CAC1D;AAAA,EAAA,GACF;AAEJ;AAEA,MAAMQ,IAAO;AAAA,EACX,OAAO;AAAA,EACP,WAAWD;AAAA,EACX,YAAY;AAAA,IACV,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,aAAa;AAAA,IACb,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,cAActB,EAAmBU,GAAc,GAAG;AAAA,EAAA;AAAA,EAEpD,UAAU;AAAA,IACR,cAAc,EAAE,SAAS,GAAA;AAAA,IACzB,UAAU,EAAE,SAAS,GAAA;AAAA,IACrB,SAAS,EAAE,SAAS,GAAA;AAAA,IACpB,aAAa,EAAE,SAAS,GAAA;AAAA,IACxB,oBAAoB,EAAE,SAAS,GAAA;AAAA,IAC/B,gBAAgB,EAAE,SAAS,GAAA;AAAA,IAC3B,SAAS,EAAE,SAAS,GAAA;AAAA,IACpB,OAAO,EAAE,SAAS,GAAA;AAAA,EAAM;AAAA,EAE1B,YAAY;AAAA,IACV,CAACc,MACC,gBAAAH,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA,gBAAAA,EAACG,KAAM,EAAA,CACT;AAAA,EAAA;AAGN,GAOaC,IAAiB;AAAA,EAC5B,QAAQ,CAACX,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGaY,IAA2B;AAAA,EACtC,QAAQ,CAACZ,MAAS,gBAAAO,EAACT,KAAoB,GAAGE,GAAM,cAAa,KAAA,CAAK;AACpE,GAGaa,IAAkB;AAAA,EAC7B,MAAM,EAAE,UAAU,GAAA;AAAA,EAClB,QAAQ,CAACb,MAAS,gBAAAO,EAACT,KAAoB,GAAGE,GAAM,cAAa,KAAA,CAAK;AACpE,GAGac,IAA+B;AAAA,EAC1C,MAAM;AAAA,IACJ,SAASlB;AAAA,IACT,cAAc,YAAYA;AAAA,EAAA;AAAA,EAE5B,QAAQ,CAACI,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGae,IAA0B;AAAA,EACrC,MAAM;AAAA,IACJ,cAAc7B,EAAmBU,GAAc,IAAI;AAAA,EAAA;AAAA,EAErD,QAAQ,CAACI,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGagB,IAA8B;AAAA,EACzC,MAAM;AAAA,IACJ,YAAY;AAAA,IACZ,aAAa,CAACC,MAAoC;AAChD,YAAMC,IAAY,EAAQD,EAAG,QAAQ;AACrC,aACE,gBAAAV;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,UAAU,CAACW;AAAA,UACX,SAAS,MAAM;AACb,kBAAMC,IAAIF,EAAG,OAAO,KAAA,GACdG,IAAuB,EAAE,OAAOD,GAAG,OAAO,WAAWA,CAAC,IAAA;AAC5D,YAAAF,EAAG,WAAW,CAACG,CAAI,CAAC,GACpBH,EAAG,WAAW,EAAK;AAAA,UACrB;AAAA,UACD,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAIL;AAAA,EAAA;AAAA,EAEF,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGaqB,IAAgC;AAAA,EAC3C,MAAM;AAAA,IACJ,oBAAoB,CAACJ,MACnB,gBAAAX,EAAC,OAAA,EAAI,WAAU,6EACb,UAAA;AAAA,MAAA,gBAAAA,EAAC,QAAA,EAAK,UAAA;AAAA,QAAA;AAAA,0BACM,QAAA,EAAK,WAAU,aAAa,UAAAW,EAAG,QAAQ,OAAA,CAAO;AAAA,MAAA,GAC1D;AAAA,MACA,gBAAAV;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS,MAAM;AACb,YAAAU,EAAG,UAAU,EAAE,GACfA,EAAG,WAAW,EAAK;AAAA,UACrB;AAAA,UACD,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAED,EAAA,CACF;AAAA,EAAA;AAAA,EAGJ,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGasB,IAA4B;AAAA,EACvC,MAAM;AAAA,IACJ,gBAAgB,CAACL,MACf,gBAAAV;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAM;AACb,UAAAU,EAAG,UAAU,EAAE,GACfA,EAAG,QAAQ,EAAK;AAAA,QAClB;AAAA,QACD,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED;AAAA,EAGJ,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGauB,IAA8B;AAAA,EACzC,MAAM;AAAA,IACJ,kBAAkB,CAACN,MACjB,gBAAAV;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAM;AACb,UAAAU,EAAG,UAAU,EAAE,GACfA,EAAG,QAAQ,EAAK;AAAA,QAClB;AAAA,QACD,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED;AAAA,EAGJ,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGawB,IAAuB;AAAA,EAClC,MAAM;AAAA,IACJ,cAActC,EAAmBW,GAAgB,GAAG;AAAA,IACpD,qBAAqB;AAAA,IACrB,oBAAoB;AAAA,IACpB,kBAAkB;AAAA,IAClB,wBAAwB;AAAA,EAAA;AAAA,EAE1B,QAAQ,CAACG,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGayB,IAAyB;AAAA,EACpC,MAAM;AAAA,IACJ,cAAcvC,EAAmBU,GAAc,GAAG;AAAA,IAClD,SAAS,OAAOqB,MAAoC;AAClD,YAAMxC,EAAM,GAAG,GACfwC,EAAG,WAAWrB,CAAY,GAC1BqB,EAAG,WAAW,EAAK;AAAA,IACrB;AAAA,EAAA;AAAA,EAEF,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGa0B,IAA6B;AAAA,EACxC,MAAM;AAAA,IACJ,eAAe,CAACC,OACd,QAAQ,IAAI,SAASA,CAAK,GAExB,gBAAApB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAMoB,EAAM,QAAQ,CAAClC,MAAM,CAACA,CAAC;AAAA,QAErC,YAAM,iBAAiB,aAAakC,EAAM,eAAe,KAAK,KAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EAG1E;AAAA,EAEF,QAAQ,CAAC3B,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD;"}
|
|
1
|
+
{"version":3,"file":"Combobox.stories.js","sources":["../../src/Combobox/Combobox.stories.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport type { Meta, StoryObj } from '@storybook/react';\n\nimport { Combobox } from './Combobox';\nimport {\n ComboboxCallbackStateParams,\n ComboboxOption,\n ComboboxProps, MultiComboboxProps, SingleComboboxProps,\n} from './Combobox.types';\n\nconst sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));\n\nconst flatten = (nodes: ComboboxOption[] = []): ComboboxOption[] => {\n const res: ComboboxOption[] = [];\n const walk = (list?: ComboboxOption[]) => {\n if (!list?.length) return;\n for (const n of list) {\n res.push(n);\n if (n.items?.length) walk(n.items);\n }\n };\n walk(nodes);\n return res;\n};\n\nconst createFetchOptions =\n (all: ComboboxOption[], delayMs = 350): ComboboxProps['fetchOptions'] =>\n async (search?: string) => {\n await sleep(delayMs);\n\n const q = (search ?? '').trim().toLowerCase();\n if (!q) return all;\n\n // simple \"contains\" search across flattened options; then return top-level filtered\n // (enough for Storybook demos; your real API can do better)\n const allFlat = flatten(all);\n const matchedValues = new Set(\n allFlat\n .filter((o) => String(o.label).toLowerCase().includes(q))\n .map((o) => String(o.value)),\n );\n\n const filterTree = (list: ComboboxOption[]): ComboboxOption[] => {\n return list\n .map((n) => {\n const items = n.items?.length ? filterTree(n.items) : undefined;\n const selfMatch =\n matchedValues.has(String(n.value)) ||\n String(n.label).toLowerCase().includes(q);\n\n if (!selfMatch && !items?.length) return null;\n return { ...n, items };\n })\n .filter(Boolean) as ComboboxOption[];\n };\n\n return filterTree(all);\n };\n\nconst BASE_OPTIONS: ComboboxOption[] = [\n { value: 'ua', label: 'Ukraine' },\n { value: 'pl', label: 'Poland' },\n { value: 'de', label: 'Germany' },\n { value: 'fr', label: 'France' },\n { value: 'es', label: 'Spain' },\n { value: 'it', label: 'Italy' },\n];\n\nconst NESTED_OPTIONS: ComboboxOption[] = [\n {\n value: 'europe',\n label: 'Europe',\n items: [\n {\n value: 'fr',\n label: 'France',\n items: [\n {\n value: 'paris',\n label: 'Paris (Île-de-France)',\n items: [\n { value: 'paris-1', label: 'Paris 1st arrondissement' },\n { value: 'paris-3', label: 'Paris 3rd arrondissement' },\n { value: 'paris-10', label: 'Paris 10th arrondissement' },\n ],\n },\n { value: 'marseille', label: 'Marseille (Provence-Alpes-Côte d\\'Azur)' },\n {\n value: 'lyon',\n label: 'Lyon (Auvergne-Rhône-Alpes)',\n items: [\n { value: 'lyon-presquile', label: 'Presqu\\'île (1st/2nd)' },\n { value: 'lyon-vieux', label: 'Vieux Lyon' },\n ],\n },\n { value: 'toulouse', label: 'Toulouse (Occitanie)' },\n { value: 'bordeaux', label: 'Bordeaux (Nouvelle-Aquitaine)' },\n { value: 'strasbourg', label: 'Strasbourg (Grand Est)' },\n {\n value: 'rennes',\n label: 'Rennes (Brittany)',\n items: [\n { value: 'rennes-centre', label: 'Rennes Centre' },\n { value: 'rennes-beauregard', label: 'Beauregard' },\n ],\n },\n ]\n },\n { value: 'ua', label: 'Ukraine' },\n { value: 'pl', label: 'Poland' },\n { value: 'de', label: 'Germany' },\n ],\n },\n {\n value: 'north-america',\n label: 'North America',\n items: [\n { value: 'us', label: 'United States' },\n { value: 'ca', label: 'Canada' },\n { value: 'mx', label: 'Mexico' },\n { value: 'north-america-long', label: 'To long option to test wrapping. '.repeat(3) },\n { value: 'north-america-long-single', label: 'To long option to test wrapping. '.replace(/ /g, '_').repeat(3) },\n ],\n },\n];\nconst getFlattenOptions = (options: ComboboxOption[]) => {\n return options.flatMap(option => [\n option,\n ...(option.items ? getFlattenOptions(option.items) : [])\n ]);\n};\n\nconst getAllValues = (options: ComboboxOption[]): string[] => {\n return getFlattenOptions(options).map(o => o.value)\n};\n\ntype ControlledProps<T extends ComboboxProps = ComboboxProps> = Omit<T, 'value' | 'onChange'> & {\n initialValue?: T['value'];\n};\n\nfunction ControlledCombobox({ initialValue = '', ...args }: ControlledProps<SingleComboboxProps>) {\n const [value, setValue] = useState<SingleComboboxProps['value']>(initialValue);\n const fetchOptions = useMemo(\n () => args.fetchOptions,\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [],\n );\n\n return (\n <div className=\"max-w-sm\">\n <Combobox type='single' {...args} value={value} onChange={setValue} fetchOptions={fetchOptions} />\n <div className=\"mt-3 text-xs text-muted-foreground\">\n value: <span className=\"font-mono\">{String(value || '')}</span>\n </div>\n </div>\n );\n}\nfunction ControlledComboboxMulti({ initialValue = [], ...args }: ControlledProps<MultiComboboxProps>) {\n const [value, setValue] = useState<MultiComboboxProps['value'] | undefined>(initialValue);\n const fetchOptions = useMemo(() => args.fetchOptions, []);\n return (\n <div className=\"max-w-sm\">\n <Combobox\n {...args}\n type='multi'\n value={value}\n onChange={setValue}\n fetchOptions={fetchOptions}\n />\n <div className=\"mt-3 text-xs text-muted-foreground\">\n value: <span className=\"font-mono\">{(value || []).join(', ')}</span>\n </div>\n </div>\n );\n}\n\nconst meta = {\n title: 'Combobox',\n component: Combobox,\n parameters: {\n layout: 'centered',\n },\n args: {\n placeholder: 'Select option...',\n searchLabel: 'Type to search...',\n emptyLabel: 'No options',\n disabled: false,\n fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n },\n argTypes: {\n fetchOptions: { control: false },\n onChange: { control: false },\n onMount: { control: false },\n emptyAction: { control: false },\n commandInputAction: { control: false },\n listHeadAction: { control: false },\n options: { control: false },\n value: { control: false },\n },\n decorators: [\n (Story) => (\n <div className=\"p-6 w-[420px]\">\n <Story />\n </div>\n ),\n ],\n} satisfies Meta<typeof Combobox>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\n/** 1) Default (async options) */\nexport const Default: Story = {\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 2) With initial selected value */\nexport const WithValueSelected: Story = {\n render: (args) => <ControlledCombobox {...args} initialValue=\"pl\" />,\n};\n\n/** 3) Disabled */\nexport const Disabled: Story = {\n args: { disabled: true },\n render: (args) => <ControlledCombobox {...args} initialValue=\"de\" />,\n};\n\n/** 4) Static options via `options` prop (no async needed, but fetchOptions still required) */\nexport const WithStaticOptionsProp: Story = {\n args: {\n options: BASE_OPTIONS,\n fetchOptions: async () => BASE_OPTIONS,\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 5) Slow fetch to show loading state on open/search */\nexport const SlowFetchLoading: Story = {\n args: {\n fetchOptions: createFetchOptions(BASE_OPTIONS, 1200),\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 6) Empty state with action (search something like \"zzz\") */\nexport const EmptyStateWithAction: Story = {\n args: {\n emptyLabel: 'Nothing found',\n emptyAction: (st: ComboboxCallbackStateParams) => {\n const canCreate = Boolean(st.search?.trim());\n return (\n <button\n type=\"button\"\n className=\"inline-flex items-center justify-center rounded-md border px-3 py-1.5 text-sm\"\n disabled={!canCreate}\n onClick={() => {\n const v = st.search.trim();\n const next: ComboboxOption = { value: v, label: `Create \"${v}\"` };\n st.setOptions([next]);\n st.setLoading(false);\n }}\n >\n Create option\n </button>\n );\n },\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 7) commandInputAction (helper row under input) */\nexport const WithCommandInputAction: Story = {\n args: {\n commandInputAction: (st: ComboboxCallbackStateParams) => (\n <div className=\"px-3 py-2 flex items-center justify-between text-xs text-muted-foreground\">\n <span>\n results: <span className=\"font-mono\">{st.options.length}</span>\n </span>\n <button\n type=\"button\"\n className=\"underline\"\n onClick={() => {\n st.setSearch('');\n st.setLoading(false);\n }}\n >\n Clear search\n </button>\n </div>\n ),\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 8) listHeadAction (top action inside list) */\nexport const WithListHeadAction: Story = {\n args: {\n listHeadAction: (st: ComboboxCallbackStateParams) => (\n <button\n type=\"button\"\n className=\"w-full text-left px-3 py-2 text-sm\"\n onClick={() => {\n st.setSearch('');\n st.setOpen(false);\n }}\n >\n Close list\n </button>\n ),\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 9) listHeadAction (footer action outside of list) */\nexport const WithListFooterAction: Story = {\n args: {\n listFooterAction: (st: ComboboxCallbackStateParams) => (\n <button\n type=\"button\"\n className=\"w-full text-left min-h-10 text-sm\"\n onClick={() => {\n st.setSearch('');\n st.setOpen(false);\n }}\n >\n list footer action\n </button>\n ),\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 10) Nested options tree */\nexport const NestedOptions: Story = {\n args: {\n fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n defaultNodeDisabled: false,\n defaultNodeMatched: false,\n defaultNodeMuted: true,\n defaultNodeInteractive: false,\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 11) Multi Nested options tree */\nexport const NestedOptionsMulti: Story = {\n args: {\n fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n onMount: async (st: ComboboxCallbackStateParams) => {\n await sleep(900);\n st.setOptions(getFlattenOptions(NESTED_OPTIONS));\n },\n },\n render: (args) => {\n const TEST_FULL = false;\n const initialValues = TEST_FULL ? getAllValues(NESTED_OPTIONS): ['fr', 'de'];\n return <ControlledComboboxMulti {...args} initialValue={initialValues} />\n },\n};\n\n\n/** 12) onMount initial loading (simulate prefetch on mount) */\nexport const OnMountPrefetch: Story = {\n args: {\n fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n onMount: async (st: ComboboxCallbackStateParams) => {\n await sleep(900);\n st.setOptions(BASE_OPTIONS);\n st.setLoading(false);\n },\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 13) render custom trigger */\nexport const RenderCustomTrigger: Story = {\n args: {\n renderTrigger: (state) => {\n console.log('state', state);\n return (\n <button\n type=\"button\"\n className=\"w-full\"\n onClick={() => state.setOpen((o) => !o)}\n >\n {state.selectedOption ? `Selected: ${state.selectedOption.label}` : 'Select option...'}\n </button>\n )\n }\n },\n render: (args) => <ControlledCombobox {...args} />,\n};\n"],"names":["sleep","ms","r","flatten","nodes","res","walk","list","n","createFetchOptions","all","delayMs","search","q","allFlat","matchedValues","o","filterTree","items","BASE_OPTIONS","NESTED_OPTIONS","getFlattenOptions","options","option","ControlledCombobox","initialValue","args","value","setValue","useState","fetchOptions","useMemo","jsxs","jsx","Combobox","ControlledComboboxMulti","meta","Story","Default","WithValueSelected","Disabled","WithStaticOptionsProp","SlowFetchLoading","EmptyStateWithAction","st","canCreate","v","next","WithCommandInputAction","WithListHeadAction","WithListFooterAction","NestedOptions","NestedOptionsMulti","OnMountPrefetch","RenderCustomTrigger","state"],"mappings":"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"}
|
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
import { Dispatch, HTMLAttributes, ReactNode, Ref, SetStateAction } from 'react';
|
|
2
|
+
export type ComboboxValueType = string | string[];
|
|
3
|
+
export type ComboboxSelectedType = 'single' | 'multi';
|
|
4
|
+
export declare const DEFAULT_COMBOBOX_TYPE: ComboboxSelectedType;
|
|
2
5
|
export interface ComboboxOption<Data extends object = object> {
|
|
3
6
|
value: string;
|
|
4
7
|
label: string;
|
|
@@ -9,11 +12,9 @@ export interface ComboboxOption<Data extends object = object> {
|
|
|
9
12
|
level?: number;
|
|
10
13
|
matched?: boolean;
|
|
11
14
|
}
|
|
12
|
-
|
|
15
|
+
interface ComboboxCallbackStateBaseParams<Data extends object = object> {
|
|
13
16
|
options: ComboboxOption<Data>[];
|
|
14
17
|
setOptions: Dispatch<SetStateAction<ComboboxOption<Data>[]>>;
|
|
15
|
-
selectedOption?: ComboboxOption<Data>;
|
|
16
|
-
setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data> | undefined>>;
|
|
17
18
|
search: string;
|
|
18
19
|
setSearch: Dispatch<SetStateAction<string>>;
|
|
19
20
|
onChangeOption: (option: ComboboxOption<Data>) => void;
|
|
@@ -25,6 +26,17 @@ export interface ComboboxCallbackStateParams<Data extends object = object> {
|
|
|
25
26
|
isSearchedEmptyList: boolean;
|
|
26
27
|
placeholder?: string;
|
|
27
28
|
}
|
|
29
|
+
export interface SingleComboboxCallbackStateParams<Data extends object = object> extends ComboboxCallbackStateBaseParams<Data> {
|
|
30
|
+
type?: 'single';
|
|
31
|
+
selectedOption?: ComboboxOption<Data> | undefined;
|
|
32
|
+
setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data> | undefined>>;
|
|
33
|
+
}
|
|
34
|
+
export interface MultiCComboboxCallbackStateParams<Data extends object = object> extends ComboboxCallbackStateBaseParams<Data> {
|
|
35
|
+
type: 'multi';
|
|
36
|
+
selectedOption?: ComboboxOption<Data>[];
|
|
37
|
+
setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data>[] | undefined>>;
|
|
38
|
+
}
|
|
39
|
+
export type ComboboxCallbackStateParams<Data extends object = object> = SingleComboboxCallbackStateParams<Data> | MultiCComboboxCallbackStateParams<Data>;
|
|
28
40
|
export interface IComboboxOptionsNodeHandlersProps<Data extends object = object> {
|
|
29
41
|
defaultNodeOpen?: boolean | ((option: ComboboxOption<Data>, deep: number) => boolean | undefined);
|
|
30
42
|
defaultNodeDisabled?: boolean | ((option: ComboboxOption<Data>, deep: number) => boolean | undefined);
|
|
@@ -33,12 +45,12 @@ export interface IComboboxOptionsNodeHandlersProps<Data extends object = object>
|
|
|
33
45
|
defaultNodeInteractive?: boolean | ((option: ComboboxOption<Data>, deep: number) => boolean | undefined);
|
|
34
46
|
}
|
|
35
47
|
export interface IComboboxOptionsNodeProps<Data extends object = object> extends IComboboxOptionsNodeHandlersProps<Data> {
|
|
36
|
-
|
|
37
|
-
|
|
48
|
+
type: ComboboxSelectedType;
|
|
49
|
+
search?: string;
|
|
50
|
+
value?: ComboboxValueType;
|
|
38
51
|
option: ComboboxOption<Data>;
|
|
39
|
-
|
|
52
|
+
onSelect?: (option: ComboboxOption<Data>) => void;
|
|
40
53
|
deep?: number;
|
|
41
|
-
setOpen: Dispatch<SetStateAction<boolean>>;
|
|
42
54
|
}
|
|
43
55
|
export interface IComboboxOptionsProps<Data extends object = object> extends Omit<IComboboxOptionsNodeProps<Data>, 'option'>, IComboboxOptionsNodeHandlersProps<Data> {
|
|
44
56
|
options?: ComboboxOption<Data>[];
|
|
@@ -46,10 +58,11 @@ export interface IComboboxOptionsProps<Data extends object = object> extends Omi
|
|
|
46
58
|
interface IListActionProps extends HTMLAttributes<HTMLDivElement> {
|
|
47
59
|
bordered?: boolean;
|
|
48
60
|
}
|
|
49
|
-
|
|
61
|
+
interface ISlotProps {
|
|
62
|
+
listFooterAction?: IListActionProps;
|
|
63
|
+
}
|
|
64
|
+
export interface ComboboxBaseProps<Data extends object = object> extends IComboboxOptionsNodeHandlersProps {
|
|
50
65
|
ref?: Ref<ComboboxCallbackStateParams<Data> | null>;
|
|
51
|
-
value: string;
|
|
52
|
-
onChange: (value: string) => void;
|
|
53
66
|
placeholder?: string;
|
|
54
67
|
searchLabel?: string;
|
|
55
68
|
disabled?: boolean;
|
|
@@ -69,9 +82,18 @@ export interface ComboboxProps<Data extends object = object> extends IComboboxOp
|
|
|
69
82
|
onMount?: (params: ComboboxCallbackStateParams<Data>) => Promise<void>;
|
|
70
83
|
renderTrigger?: (params: ComboboxCallbackStateParams<Data>) => ReactNode;
|
|
71
84
|
renderList?: (params: ComboboxCallbackStateParams<Data>) => ReactNode;
|
|
72
|
-
slotProps?:
|
|
73
|
-
|
|
74
|
-
|
|
85
|
+
slotProps?: ISlotProps;
|
|
86
|
+
}
|
|
87
|
+
export interface SingleComboboxProps<Data extends object = object> extends ComboboxBaseProps<Data> {
|
|
88
|
+
type?: 'single';
|
|
89
|
+
value?: string;
|
|
90
|
+
onChange: (value: string | undefined) => void;
|
|
91
|
+
}
|
|
92
|
+
export interface MultiComboboxProps<Data extends object = object> extends ComboboxBaseProps<Data> {
|
|
93
|
+
type: 'multi';
|
|
94
|
+
value?: string[];
|
|
95
|
+
onChange: (value: string[] | undefined) => void;
|
|
75
96
|
}
|
|
97
|
+
export type ComboboxProps<Data extends object = object> = SingleComboboxProps<Data> | MultiComboboxProps<Data>;
|
|
76
98
|
export {};
|
|
77
99
|
//# sourceMappingURL=Combobox.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEjF,MAAM,WAAW,cAAc,CAAC,IAAI,SAAS,MAAM,GAAG,MAAM;IAC1D,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,CAAC;IAEZ,KAAK,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,
|
|
1
|
+
{"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.types.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
1
|
+
{"version":3,"file":"Combobox.types.js","sources":["../../src/Combobox/Combobox.types.ts"],"sourcesContent":["import { Dispatch, HTMLAttributes, ReactNode, Ref, SetStateAction } from 'react';\n\nexport type ComboboxValueType = string | string[];\nexport type ComboboxSelectedType = 'single' | 'multi';\n\nexport const DEFAULT_COMBOBOX_TYPE: ComboboxSelectedType = 'single';\n\nexport interface ComboboxOption<Data extends object = object> {\n value: string;\n label: string;\n node?: Data;\n // tree only\n items?: ComboboxOption<Data>[];\n path?: string[];\n parent?: string;\n level?: number;\n matched?: boolean;\n}\n\ninterface ComboboxCallbackStateBaseParams<Data extends object = object> {\n options: ComboboxOption<Data>[];\n setOptions: Dispatch<SetStateAction<ComboboxOption<Data>[]>>\n search: string;\n setSearch: Dispatch<SetStateAction<string>>\n onChangeOption: (option: ComboboxOption<Data>) => void;\n open: boolean,\n setOpen: Dispatch<SetStateAction<boolean>>;\n loading: boolean;\n setLoading: Dispatch<SetStateAction<boolean>>;\n isEmptyList: boolean;\n isSearchedEmptyList: boolean;\n placeholder?: string;\n}\nexport interface SingleComboboxCallbackStateParams<Data extends object = object> extends ComboboxCallbackStateBaseParams<Data> {\n type?: 'single';\n selectedOption?: ComboboxOption<Data> | undefined;\n setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data> | undefined>>\n}\nexport interface MultiCComboboxCallbackStateParams<Data extends object = object> extends ComboboxCallbackStateBaseParams<Data> {\n type: 'multi';\n selectedOption?: ComboboxOption<Data>[];\n setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data>[] | undefined>>\n}\nexport type ComboboxCallbackStateParams<Data extends object = object> =\n | SingleComboboxCallbackStateParams<Data>\n | MultiCComboboxCallbackStateParams<Data>;\n\nexport interface IComboboxOptionsNodeHandlersProps<Data extends object = object> {\n defaultNodeOpen?: boolean | ((option: ComboboxOption<Data>, deep: number) => boolean | undefined);\n defaultNodeDisabled?: boolean | ((option: ComboboxOption<Data>, deep: number) => boolean | undefined);\n defaultNodeMatched?: boolean | ((option: ComboboxOption<Data>, deep: number) => boolean | undefined);\n defaultNodeMuted?: boolean | ((option: ComboboxOption<Data>, deep: number) => boolean | undefined);\n defaultNodeInteractive?: boolean | ((option: ComboboxOption<Data>, deep: number) => boolean | undefined);\n}\n\nexport interface IComboboxOptionsNodeProps<Data extends object = object>\n extends IComboboxOptionsNodeHandlersProps<Data> {\n type: ComboboxSelectedType,\n search?: string;\n value?: ComboboxValueType;\n option: ComboboxOption<Data>;\n onSelect?: (option: ComboboxOption<Data>) => void;\n deep?: number;\n}\n\nexport interface IComboboxOptionsProps<Data extends object = object>\n extends Omit<IComboboxOptionsNodeProps<Data>, 'option'>, IComboboxOptionsNodeHandlersProps<Data> {\n options?: ComboboxOption<Data>[];\n}\n\ninterface IListActionProps extends HTMLAttributes<HTMLDivElement> {\n bordered?: boolean;\n}\ninterface ISlotProps {\n listFooterAction?: IListActionProps\n}\n\nexport interface ComboboxBaseProps<Data extends object = object>\n extends IComboboxOptionsNodeHandlersProps {\n ref?: Ref<ComboboxCallbackStateParams<Data> | null>;\n placeholder?: string;\n searchLabel?: string;\n disabled?: boolean;\n fetchOptions: (search?: string) => Promise<ComboboxOption<Data>[]>;\n options?: ComboboxOption<Data>[];\n /** Command Empty list label*/\n emptyLabel?: string;\n /** Command Empty list action */\n emptyAction?: ((params: ComboboxCallbackStateParams<Data>) => ReactNode) | ReactNode;\n /** Command Input footer action */\n commandInputAction?: ((params: ComboboxCallbackStateParams<Data>) => ReactNode) | ReactNode;\n /** Command List first element action */\n listHeadAction?: ((params: ComboboxCallbackStateParams<Data>) => ReactNode) | ReactNode;\n /** Command List footer element action */\n listFooterAction?: ((params: ComboboxCallbackStateParams<Data>) => ReactNode) | ReactNode;\n /** Callback for load data on start component */\n onMount?: (params: ComboboxCallbackStateParams<Data>) => Promise<void>;\n\n renderTrigger?: (params: ComboboxCallbackStateParams<Data>) => ReactNode;\n renderList?: (params: ComboboxCallbackStateParams<Data>) => ReactNode;\n\n slotProps?: ISlotProps;\n}\n\nexport interface SingleComboboxProps<Data extends object = object> extends ComboboxBaseProps<Data> {\n type?: 'single';\n value?: string;\n onChange: (value: string | undefined) => void;\n}\n\nexport interface MultiComboboxProps<Data extends object = object> extends ComboboxBaseProps<Data> {\n type: 'multi';\n value?: string[];\n onChange: (value: string[] | undefined) => void;\n}\n\nexport type ComboboxProps<Data extends object = object> =\n | SingleComboboxProps<Data>\n | MultiComboboxProps<Data>;\n"],"names":["DEFAULT_COMBOBOX_TYPE"],"mappings":"AAKO,MAAMA,IAA8C;"}
|
|
@@ -2,5 +2,6 @@ import { PropsWithChildren } from 'react';
|
|
|
2
2
|
import { IComboboxOptionsNodeProps } from './Combobox.types';
|
|
3
3
|
export declare const ComboboxOptionItem: <Data extends object>(props: PropsWithChildren<IComboboxOptionsNodeProps<Data>> & {
|
|
4
4
|
onCollapseToggle?: () => void;
|
|
5
|
+
expanded?: boolean;
|
|
5
6
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
6
7
|
//# sourceMappingURL=ComboboxOptionItem.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxOptionItem.d.ts","sourceRoot":"","sources":["../../src/Combobox/ComboboxOptionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,
|
|
1
|
+
{"version":3,"file":"ComboboxOptionItem.d.ts","sourceRoot":"","sources":["../../src/Combobox/ComboboxOptionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAyB,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAcpF,eAAO,MAAM,kBAAkB,GAAI,IAAI,SAAS,MAAM,EACpD,OAAO,iBAAiB,CAAC,yBAAyB,CAAC,IAAI,CAAC,CAAC,GAAG;IAC1D,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,4CAuHF,CAAA"}
|