@oneplatformdev/ui 0.1.99-beta.202 → 0.1.99-beta.203

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/Combobox/Combobox.d.ts.map +1 -1
  3. package/Combobox/Combobox.js +141 -129
  4. package/Combobox/Combobox.js.map +1 -1
  5. package/Combobox/Combobox.stories.js +6 -6
  6. package/Combobox/Combobox.stories.js.map +1 -1
  7. package/Combobox/Combobox.types.d.ts +7 -1
  8. package/Combobox/Combobox.types.d.ts.map +1 -1
  9. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,3 +1,11 @@
1
+ ## 0.1.99-beta.203 (2026-02-18)
2
+
3
+ ### 🧱 Updated Dependencies
4
+
5
+ - Updated @oneplatformdev/utils to 0.1.99-beta.203
6
+ - Updated @oneplatformdev/hooks to 0.1.99-beta.203
7
+ - Updated @oneplatformdev/tokens to 0.1.99-beta.203
8
+
1
9
  ## 0.1.99-beta.202 (2026-02-18)
2
10
 
3
11
  ### 🚀 Features
package/Combobox/Combobox.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.tsx"],"names":[],"mappings":"AAuBA,OAAO,EAGL,aAAa,EACd,MAAM,kBAAkB,CAAC;AAqB1B,eAAO,MAAM,QAAQ,GAAI,IAAI,SAAS,MAAM,EAAI,OAAO,aAAa,CAAC,IAAI,CAAC,4CA4RzE,CAAA"}
1
+ {"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.tsx"],"names":[],"mappings":"AAuBA,OAAO,EAGL,aAAa,EACd,MAAM,kBAAkB,CAAC;AAqB1B,eAAO,MAAM,QAAQ,GAAI,IAAI,SAAS,MAAM,EAAI,OAAO,aAAa,CAAC,IAAI,CAAC,4CAwSzE,CAAA"}
package/Combobox/Combobox.js CHANGED
@@ -1,227 +1,239 @@
1
- import { jsx as e, jsxs as c, Fragment as R } from "react/jsx-runtime";
2
- import { useState as d, useCallback as f, useEffect as le, useMemo as G, useLayoutEffect as ce } from "react";
1
+ import { jsx as t, jsxs as d, Fragment as G } from "react/jsx-runtime";
2
+ import { useState as p, useCallback as m, useEffect as ce, useMemo as W, useLayoutEffect as de } from "react";
3
3
  import { LoadingMask as _ } from "../LoadingMask/LoadingMask.js";
4
4
  import "../LoadingMask/RenderLoadingMask.js";
5
- import { Popover as de, PopoverTrigger as pe, PopoverContent as fe } from "../Popover/Popover.js";
6
- import { Button as me } from "../Button/Button.js";
5
+ import { Popover as pe, PopoverTrigger as fe, PopoverContent as me } from "../Popover/Popover.js";
6
+ import { Button as ue } from "../Button/Button.js";
7
7
  import "../Button/buttonVariants.js";
8
- import { Command as ue, CommandInput as he, CommandList as ge, CommandGroup as be, CommandEmpty as J, CommandItem as ye } from "../Command/Command.js";
9
- import { cn as I } from "@oneplatformdev/utils";
10
- import { useDebounceCallback as ve } from "@oneplatformdev/hooks";
11
- import { X as Ce, ChevronDown as xe } from "lucide-react";
12
- import { ComboboxOptions as we } from "./ComboboxOptions.js";
13
- const Ne = (k) => {
14
- const { value: n, flattenOptions: D = [], selectedOption: M } = k;
8
+ import { Command as he, CommandInput as ge, CommandList as be, CommandGroup as ye, CommandEmpty as K, CommandItem as ve } from "../Command/Command.js";
9
+ import { cn as x } from "@oneplatformdev/utils";
10
+ import { useDebounceCallback as xe } from "@oneplatformdev/hooks";
11
+ import { X as Ce, ChevronDown as we } from "lucide-react";
12
+ import { ComboboxOptions as Ne } from "./ComboboxOptions.js";
13
+ const Oe = (P) => {
14
+ const { value: n, flattenOptions: k = [], selectedOption: D } = P;
15
15
  if (!n) return "No value for render label";
16
- const C = [D.find((m) => String(m.value).toLowerCase() === String(n).toLowerCase()), M].filter(Boolean).map((m) => m.label).find(Boolean);
16
+ const C = [k.find((u) => String(u.value).toLowerCase() === String(n).toLowerCase()), D].filter(Boolean).map((u) => u.label).find(Boolean);
17
17
  return C || n;
18
- }, Be = (k) => {
18
+ }, Be = (P) => {
19
19
  const {
20
20
  value: n,
21
- onChange: D,
22
- placeholder: M,
23
- disabled: W,
21
+ onChange: k,
22
+ placeholder: D,
23
+ disabled: q,
24
24
  searchLabel: C = "Type to search...",
25
- fetchOptions: m,
26
- options: P,
27
- emptyLabel: q = "No options",
28
- emptyAction: x,
29
- commandInputAction: E,
30
- listHeadAction: w,
31
- listFooterAction: N,
32
- onMount: T,
33
- defaultNodeDisabled: K,
34
- defaultNodeMatched: Q,
35
- defaultNodeMuted: Y,
36
- defaultNodeInteractive: Z,
37
- renderTrigger: u
38
- } = k, [O, z] = d(!1), [a, j] = d(!1), [i, A] = d(""), [h, B] = d(), [o, p] = d(!1), [r, $] = d([]), [ee, te] = d([]), g = f((t) => {
39
- const y = (F) => {
40
- const l = [], X = (S) => {
41
- if (S)
42
- for (const v of S)
43
- l.push(v), v.items && v.items.length && X(v.items);
25
+ fetchOptions: u,
26
+ options: M,
27
+ emptyLabel: z = "No options",
28
+ emptyAction: w,
29
+ commandInputAction: A,
30
+ listHeadAction: N,
31
+ listFooterAction: O,
32
+ listFooterActionProps: E,
33
+ onMount: F,
34
+ defaultNodeDisabled: Q,
35
+ defaultNodeMatched: Y,
36
+ defaultNodeMuted: Z,
37
+ defaultNodeInteractive: $,
38
+ renderTrigger: h
39
+ } = P, [S, H] = p(!1), [a, T] = p(!1), [i, j] = p(""), [g, B] = p(), [o, f] = p(!1), [r, ee] = p([]), [te, ne] = p([]), b = m((e) => {
40
+ const l = (R) => {
41
+ const c = [], X = (L) => {
42
+ if (L)
43
+ for (const v of L)
44
+ c.push(v), v.items && v.items.length && X(v.items);
44
45
  };
45
- X(F), te((S) => {
46
- if (!l.find((L) => !!n && String(L.value) === String(n))) {
47
- const L = h || S.find((se) => !!n && String(se.value) === String(n));
48
- if (L) return [L, ...l];
46
+ X(R), ne((L) => {
47
+ if (!c.find((I) => !!n && String(I.value) === String(n))) {
48
+ const I = g || L.find((le) => !!n && String(le.value) === String(n));
49
+ if (I) return [I, ...c];
49
50
  }
50
- return l;
51
+ return c;
51
52
  });
52
53
  };
53
- $((F) => {
54
- const l = typeof t == "function" ? t(F) : t;
55
- return y(l), l;
54
+ ee((R) => {
55
+ const c = typeof e == "function" ? e(R) : e;
56
+ return l(c), c;
56
57
  });
57
- }, [h, n]);
58
- le(() => {
59
- P?.length && g(P);
60
- }, [P]);
61
- const ne = async () => {
62
- a || (H(), A(""));
63
- }, H = f(async (t) => {
64
- p(!0);
58
+ }, [g, n]);
59
+ ce(() => {
60
+ M?.length && b(M);
61
+ }, [M]);
62
+ const oe = async () => {
63
+ a || (J(), j(""));
64
+ }, J = m(async (e) => {
65
+ f(!0);
65
66
  try {
66
- const y = await m(t);
67
- g(y);
68
- } catch (y) {
69
- console.error("Unexpected error while get option:", y);
67
+ const l = await u(e);
68
+ b(l);
69
+ } catch (l) {
70
+ console.error("Unexpected error while get option:", l);
70
71
  } finally {
71
- p(!1);
72
+ f(!1);
72
73
  }
73
- }, [g]), oe = ve(H, 1e3, {
74
+ }, [b]), re = xe(J, 1e3, {
74
75
  leading: !1,
75
76
  trailing: !0
76
- }), re = f((t) => {
77
- p(!0), A(t), oe(t);
78
- }, []), U = f((t) => {
79
- D(t.value), B(t), p(!1);
80
- }, []), ae = f(() => {
81
- U({ value: "", label: "" }), B(void 0), p(!1);
82
- }, []), V = G(() => !!i && !r.length && !o, [o, r.length, i]), b = G(() => !r.length && !o, [o, r.length, i]), s = G(() => ({
77
+ }), ae = m((e) => {
78
+ f(!0), j(e), re(e);
79
+ }, []), U = m((e) => {
80
+ k(e.value), B(e), f(!1);
81
+ }, []), ie = m(() => {
82
+ U({ value: "", label: "" }), B(void 0), f(!1);
83
+ }, []), V = W(() => !!i && !r.length && !o, [o, r.length, i]), y = W(() => !r.length && !o, [o, r.length, i]), s = W(() => ({
83
84
  options: r,
84
- setOptions: g,
85
- selectedOption: h,
85
+ setOptions: b,
86
+ selectedOption: g,
86
87
  setSelectedOption: B,
87
88
  search: i || "",
88
- setSearch: A,
89
+ setSearch: j,
89
90
  open: a,
90
- setOpen: j,
91
+ setOpen: T,
91
92
  loading: o,
92
- setLoading: p,
93
- isEmptyList: b,
93
+ setLoading: f,
94
+ isEmptyList: y,
94
95
  isSearchedEmptyList: V
95
- }), [o, a, r, i, h, b, V, g]), ie = f(async () => {
96
- if (T) {
97
- z(!0);
96
+ }), [o, a, r, i, g, y, V, b]), se = m(async () => {
97
+ if (F) {
98
+ H(!0);
98
99
  try {
99
- await T(s);
100
+ await F(s);
100
101
  } finally {
101
- z(!1);
102
+ H(!1);
102
103
  }
103
104
  }
104
- }, [T, s]);
105
- return ce(() => {
106
- ie();
107
- }, []), /* @__PURE__ */ e("div", { className: "w-full", children: /* @__PURE__ */ c(
108
- de,
105
+ }, [F, s]);
106
+ return de(() => {
107
+ se();
108
+ }, []), /* @__PURE__ */ t("div", { className: "w-full", children: /* @__PURE__ */ d(
109
+ pe,
109
110
  {
110
111
  open: a,
111
- onOpenChange: (t) => {
112
- j(t), t && ne();
112
+ onOpenChange: (e) => {
113
+ T(e), e && oe();
113
114
  },
114
115
  children: [
115
- /* @__PURE__ */ e(pe, { asChild: !0, className: "border-input", children: /* @__PURE__ */ c(
116
- me,
116
+ /* @__PURE__ */ t(fe, { asChild: !0, className: "border-input", children: /* @__PURE__ */ d(
117
+ ue,
117
118
  {
118
119
  color: "secondary",
119
120
  role: "combobox",
120
121
  "aria-expanded": a,
121
- className: I(
122
+ className: x(
122
123
  "relative w-full justify-between font-normal text-sm bg-transparent",
123
124
  "border border-border",
124
125
  a && "border-2 outline-hidden ring-1 ring-ring",
125
126
  "focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring",
126
- u && "p-0",
127
- u && a && "p-0 border-1 ring-0 ring-transparent"
127
+ h && "p-0",
128
+ h && a && "p-0 border-1 ring-0 ring-transparent"
128
129
  ),
129
- disabled: W || O,
130
+ disabled: q || S,
130
131
  children: [
131
- O && /* @__PURE__ */ e(_, { fullWidth: !0 }),
132
- !O && u && u(s),
133
- !O && !u && /* @__PURE__ */ c(R, { children: [
134
- /* @__PURE__ */ e(
132
+ S && /* @__PURE__ */ t(_, { fullWidth: !0 }),
133
+ !S && h && h(s),
134
+ !S && !h && /* @__PURE__ */ d(G, { children: [
135
+ /* @__PURE__ */ t(
135
136
  "span",
136
137
  {
137
138
  className: "truncate max-w-[calc(100%-1.5rem)] overflow-hidden whitespace-nowrap",
138
- children: n ? Ne({ value: n, flattenOptions: ee, selectedOption: h }) : /* @__PURE__ */ e("span", { className: "text-gray-400", children: M })
139
+ children: n ? Oe({ value: n, flattenOptions: te, selectedOption: g }) : /* @__PURE__ */ t("span", { className: "text-gray-400", children: D })
139
140
  }
140
141
  ),
141
- n ? /* @__PURE__ */ e(
142
+ n ? /* @__PURE__ */ t(
142
143
  "div",
143
144
  {
144
- className: I(
145
+ className: x(
145
146
  "absolute top-0 right-1",
146
147
  "flex items-center justify-center",
147
148
  "w-9 aspect-square [&_svg]:size-5",
148
149
  "opacity-50 cursor-pointer hover:opacity-100"
149
150
  ),
150
- onClick: (t) => {
151
- t.stopPropagation(), ae();
151
+ onClick: (e) => {
152
+ e.stopPropagation(), ie();
152
153
  },
153
- children: /* @__PURE__ */ e(Ce, {})
154
+ children: /* @__PURE__ */ t(Ce, {})
154
155
  }
155
- ) : /* @__PURE__ */ e(xe, { className: "opacity-50 w-4 h-4" })
156
+ ) : /* @__PURE__ */ t(we, { className: "opacity-50 w-4 h-4" })
156
157
  ] })
157
158
  ]
158
159
  }
159
160
  ) }),
160
- /* @__PURE__ */ e(
161
- fe,
161
+ /* @__PURE__ */ t(
162
+ me,
162
163
  {
163
- className: I(
164
+ className: x(
164
165
  "w-(--radix-popper-anchor-width) max-w-none p-2",
165
166
  "-translate-y-3"
166
167
  ),
167
168
  align: "start",
168
- children: /* @__PURE__ */ c(ue, { shouldFilter: !1, children: [
169
- /* @__PURE__ */ e(
170
- he,
169
+ children: /* @__PURE__ */ d(he, { shouldFilter: !1, children: [
170
+ /* @__PURE__ */ t(
171
+ ge,
171
172
  {
172
173
  placeholder: C,
173
174
  value: i,
174
- onValueChange: re
175
+ onValueChange: ae
175
176
  }
176
177
  ),
177
- typeof E == "function" ? E(s) : E,
178
- /* @__PURE__ */ e(ge, { children: /* @__PURE__ */ c(
179
- be,
178
+ typeof A == "function" ? A(s) : A,
179
+ /* @__PURE__ */ t(be, { children: /* @__PURE__ */ d(
180
+ ye,
180
181
  {
181
- className: I(
182
+ className: x(
182
183
  !r.length && "p-0 shadow-none",
183
184
  "px-0 py-2"
184
185
  ),
185
186
  children: [
186
- o && /* @__PURE__ */ e(_, { fullWidth: !0 }),
187
- !o && b && /* @__PURE__ */ e(R, { children: x ? /* @__PURE__ */ c(J, { className: "flex flex-col gap-3 py-5 px-3 items-center", children: [
188
- /* @__PURE__ */ e("span", { children: q }),
189
- typeof x == "function" ? x(s) : x
190
- ] }) : /* @__PURE__ */ e(J, { children: q }) }),
191
- !o && !b && /* @__PURE__ */ c(R, { children: [
192
- w && /* @__PURE__ */ e(
193
- ye,
187
+ o && /* @__PURE__ */ t(_, { fullWidth: !0 }),
188
+ !o && y && /* @__PURE__ */ t(G, { children: w ? /* @__PURE__ */ d(K, { className: "flex flex-col gap-3 py-5 px-3 items-center", children: [
189
+ /* @__PURE__ */ t("span", { children: z }),
190
+ typeof w == "function" ? w(s) : w
191
+ ] }) : /* @__PURE__ */ t(K, { children: z }) }),
192
+ !o && !y && /* @__PURE__ */ d(G, { children: [
193
+ N && /* @__PURE__ */ t(
194
+ ve,
194
195
  {
195
196
  asChild: !0,
196
197
  className: "w-full",
197
- children: typeof w == "function" ? w(s) : w
198
+ children: typeof N == "function" ? N(s) : N
198
199
  },
199
200
  "combobox-list-head-action"
200
201
  ),
201
- /* @__PURE__ */ e(
202
- we,
202
+ /* @__PURE__ */ t(
203
+ Ne,
203
204
  {
204
205
  searchTerm: i,
205
206
  value: n,
206
207
  options: r,
207
208
  onChangeOption: U,
208
- setOpen: j,
209
- defaultNodeDisabled: K,
210
- defaultNodeMatched: Q,
211
- defaultNodeMuted: Y,
212
- defaultNodeInteractive: Z
209
+ setOpen: T,
210
+ defaultNodeDisabled: Q,
211
+ defaultNodeMatched: Y,
212
+ defaultNodeMuted: Z,
213
+ defaultNodeInteractive: $
213
214
  }
214
215
  )
215
216
  ] })
216
217
  ]
217
218
  }
218
219
  ) }),
219
- !o && N && !b && /* @__PURE__ */ e(
220
+ !o && O && !y && /* @__PURE__ */ t(
220
221
  "div",
221
222
  {
222
223
  "data-slot": "command-footer-wrapper",
223
- className: "flex w-full min-h-9 items-center gap-2 border-t px-3",
224
- children: typeof N == "function" ? N(s) : N
224
+ ...(() => {
225
+ const { bordered: e = !0, ...l } = E || {};
226
+ return {
227
+ ...l,
228
+ "data-slot-bordered": JSON.stringify(e)
229
+ };
230
+ })(),
231
+ className: x(
232
+ "flex w-full min-h-10 items-center gap-2 px-0",
233
+ (E?.bordered ?? !0) && "border-t px-0 pt-2 min-h-12",
234
+ E?.className
235
+ ),
236
+ children: typeof O == "function" ? O(s) : O
225
237
  }
226
238
  )
227
239
  ] })
package/Combobox/Combobox.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Combobox.js","sources":["../../src/Combobox/Combobox.tsx"],"sourcesContent":["import {\n Dispatch,\n SetStateAction,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react';\nimport { LoadingMask } from '../LoadingMask';\nimport { Popover, PopoverContent, PopoverTrigger } from '../Popover';\nimport { Button } from '../Button';\nimport {\n Command,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n} from '../Command';\nimport { cn } from '@oneplatformdev/utils';\nimport { useDebounceCallback } from '@oneplatformdev/hooks';\nimport { ChevronDown, X } from 'lucide-react';\nimport {\n ComboboxCallbackStateParams,\n ComboboxOption,\n ComboboxProps,\n} from './Combobox.types';\nimport { ComboboxOptions } from './ComboboxOptions';\n\n// TODO: refactor next component | nlt code\nconst getSelectRenderLabel = <Data extends object>(params: {\n value: ComboboxProps<Data>['value'];\n flattenOptions: ComboboxOption<Data>[];\n selectedOption?: ComboboxOption<Data>;\n}): string => {\n const { value, flattenOptions = [], selectedOption } = params;\n if (!value) return 'No value for render label';\n const flattenedOption = flattenOptions.find(o => String(o.value).toLowerCase() === String(value).toLowerCase());\n const label = [ flattenedOption, selectedOption ]\n .filter(Boolean)\n .map(o => o!.label)\n .find(Boolean);\n if (!label) return value;\n return label;\n}\n\n// TODO: refactor next component | nlt code\nexport const Combobox = <Data extends object, >(props: ComboboxProps<Data>) => {\n const {\n value,\n onChange,\n placeholder,\n disabled,\n searchLabel = 'Type to search...',\n fetchOptions,\n options: itemOptions,\n emptyLabel = 'No options',\n emptyAction,\n commandInputAction,\n listHeadAction,\n listFooterAction,\n onMount,\n defaultNodeDisabled,\n defaultNodeMatched,\n defaultNodeMuted,\n defaultNodeInteractive,\n renderTrigger,\n } = props;\n const [ initialLoading, setInitialLoading ] = useState(false);\n const [ open, setOpen ] = useState(false);\n const [ searchTerm, setSearchTerm ] = useState('');\n const [ selectedOption, setSelectedOption ] = useState<ComboboxOption<Data>>();\n const [ loading, setLoading ] = useState(false);\n\n const [ options, setOptionsDispatch ] = useState<ComboboxOption<Data>[]>([]);\n const [ flattenOptions, setFlattenOptions ] = useState<ComboboxOption<Data>[]>([]);\n const setOptions: Dispatch<SetStateAction<ComboboxOption<Data>[]>> = useCallback((stater) => {\n const flatten = (next: ComboboxOption<Data>[]) => {\n const res: ComboboxOption<Data>[] = [];\n const walk = (nodes?: ComboboxOption<Data>[]) => {\n if (!nodes) return;\n for (const node of nodes) {\n res.push(node);\n if (node.items && node.items.length) walk(node.items);\n }\n };\n walk(next);\n setFlattenOptions((prev) => {\n const isIncludedInRes = res.find(o => !!value && String(o.value) === String(value));\n\n if (!isIncludedInRes) {\n const current = selectedOption || prev.find(o => !!value && String(o.value) === String(value))\n if (current) return [ current, ...res ];\n }\n\n return res;\n });\n }\n setOptionsDispatch((prev) => {\n const next: ComboboxOption<Data>[] = typeof stater === 'function' ? stater(prev) : stater;\n flatten(next);\n return next;\n });\n }, [ selectedOption, value ])\n\n useEffect(() => {\n itemOptions?.length && setOptions(itemOptions);\n }, [ itemOptions ]);\n\n const handlePopoverOpen = async () => {\n if (!open) {\n void getData();\n setSearchTerm('');\n }\n };\n\n const getData = useCallback(async (search?: string) => {\n setLoading(true);\n try {\n const fetchedOptions = await fetchOptions(search);\n setOptions(fetchedOptions);\n } catch (error) {\n console.error('Unexpected error while get option:', error);\n } finally {\n setLoading(false);\n }\n }, [ setOptions ]);\n\n const debouncedGetData = useDebounceCallback(getData, 1000, {\n leading: false,\n trailing: true,\n });\n\n const handleSearchChange = useCallback((value: string) => {\n setLoading(true);\n setSearchTerm(value);\n debouncedGetData(value);\n }, []);\n\n const onChangeOption = useCallback((option: ComboboxOption<Data>) => {\n onChange(option.value);\n setSelectedOption(option);\n setLoading(false);\n }, []);\n\n const handleClearSelection = useCallback(() => {\n onChangeOption({ value: '', label: '' });\n setSelectedOption(undefined);\n setLoading(false);\n }, []);\n\n const isSearchedEmptyList = useMemo(() => {\n return Boolean(searchTerm) && !options.length && !loading;\n }, [ loading, options.length, searchTerm ])\n\n const isEmptyList = useMemo(() => {\n return !options.length && !loading;\n }, [ loading, options.length, searchTerm ])\n\n const comboboxCallbackStateParams =\n useMemo((): ComboboxCallbackStateParams<Data> => {\n return {\n options,\n setOptions,\n selectedOption,\n setSelectedOption,\n search: searchTerm || '',\n setSearch: setSearchTerm,\n open,\n setOpen,\n loading,\n setLoading,\n isEmptyList,\n isSearchedEmptyList,\n };\n }, [ loading, open, options, searchTerm, selectedOption, isEmptyList, isSearchedEmptyList, setOptions ]);\n\n const runOnMount = useCallback(async () => {\n if (!onMount) return;\n setInitialLoading(true);\n try {\n await onMount(comboboxCallbackStateParams);\n } finally {\n setInitialLoading(false);\n }\n }, [ onMount, comboboxCallbackStateParams ]);\n\n useLayoutEffect(() => {\n runOnMount();\n }, []);\n\n return (\n <div className=\"w-full\">\n <Popover\n open={open}\n onOpenChange={(newOpen) => {\n setOpen(newOpen);\n if (newOpen) handlePopoverOpen();\n }}\n >\n <PopoverTrigger asChild className=\"border-input\">\n <Button\n color='secondary'\n role=\"combobox\"\n aria-expanded={open}\n className={cn(\n 'relative w-full justify-between font-normal text-sm bg-transparent',\n 'border border-border',\n open && 'border-2 outline-hidden ring-1 ring-ring',\n 'focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring',\n renderTrigger && 'p-0',\n renderTrigger && open && 'p-0 border-1 ring-0 ring-transparent',\n )}\n disabled={disabled || initialLoading}\n >\n {initialLoading && <LoadingMask fullWidth/>}\n {!initialLoading && renderTrigger && renderTrigger(comboboxCallbackStateParams)}\n {!initialLoading && !renderTrigger && (\n <>\n <span\n className=\"truncate max-w-[calc(100%-1.5rem)] overflow-hidden whitespace-nowrap\">\n {value\n ? getSelectRenderLabel({ value, flattenOptions, selectedOption })\n : <span className=\"text-gray-400\">{placeholder}</span>\n }\n </span>\n {value ? (\n <div\n className={cn(\n 'absolute top-0 right-1',\n 'flex items-center justify-center',\n 'w-9 aspect-square [&_svg]:size-5',\n 'opacity-50 cursor-pointer hover:opacity-100'\n )}\n onClick={(e) => {\n e.stopPropagation();\n handleClearSelection();\n }}\n >\n <X/>\n </div>\n ) : (\n <ChevronDown className=\"opacity-50 w-4 h-4\"/>\n )}\n </>\n )}\n </Button>\n </PopoverTrigger>\n <PopoverContent\n className={cn(\n \"w-(--radix-popper-anchor-width) max-w-none p-2\",\n '-translate-y-3',\n )}\n align=\"start\"\n >\n <Command shouldFilter={false}>\n <CommandInput\n placeholder={searchLabel}\n value={searchTerm}\n onValueChange={handleSearchChange}\n />\n {typeof commandInputAction === 'function'\n ? commandInputAction(comboboxCallbackStateParams)\n : commandInputAction}\n <CommandList>\n <CommandGroup\n className={cn(\n !options.length && 'p-0 shadow-none',\n 'px-0 py-2',\n )}\n >\n {loading && <LoadingMask fullWidth/>}\n {!loading && isEmptyList && (\n <>\n {emptyAction ? (\n <CommandEmpty className=\"flex flex-col gap-3 py-5 px-3 items-center\">\n <span>{emptyLabel}</span>\n {typeof emptyAction === 'function'\n ? emptyAction(comboboxCallbackStateParams)\n : emptyAction}\n </CommandEmpty>\n ) : (\n <CommandEmpty>{emptyLabel}</CommandEmpty>\n )}\n </>\n )}\n {!loading && !isEmptyList && (\n <>\n {listHeadAction && (\n <CommandItem\n key='combobox-list-head-action'\n asChild\n className='w-full'\n >\n {typeof listHeadAction === 'function'\n ? listHeadAction(comboboxCallbackStateParams)\n : listHeadAction}\n </CommandItem>\n )}\n <ComboboxOptions\n searchTerm={searchTerm}\n value={value}\n options={options}\n onChangeOption={onChangeOption}\n setOpen={setOpen}\n defaultNodeDisabled={defaultNodeDisabled}\n defaultNodeMatched={defaultNodeMatched}\n defaultNodeMuted={defaultNodeMuted}\n defaultNodeInteractive={defaultNodeInteractive}\n />\n </>\n )}\n </CommandGroup>\n </CommandList>\n\n {/*LIST FOOTER ACTION*/}\n {!loading && listFooterAction && !isEmptyList && (\n <div\n data-slot=\"command-footer-wrapper\"\n className=\"flex w-full min-h-9 items-center gap-2 border-t px-3\"\n >\n {typeof listFooterAction === 'function'\n ? listFooterAction(comboboxCallbackStateParams)\n : listFooterAction}\n </div>\n )}\n </Command>\n </PopoverContent>\n </Popover>\n </div>\n );\n}\n"],"names":["getSelectRenderLabel","params","value","flattenOptions","selectedOption","label","o","Combobox","props","onChange","placeholder","disabled","searchLabel","fetchOptions","itemOptions","emptyLabel","emptyAction","commandInputAction","listHeadAction","listFooterAction","onMount","defaultNodeDisabled","defaultNodeMatched","defaultNodeMuted","defaultNodeInteractive","renderTrigger","initialLoading","setInitialLoading","useState","open","setOpen","searchTerm","setSearchTerm","setSelectedOption","loading","setLoading","options","setOptionsDispatch","setFlattenOptions","setOptions","useCallback","stater","flatten","next","res","walk","nodes","node","prev","current","useEffect","handlePopoverOpen","getData","search","fetchedOptions","error","debouncedGetData","useDebounceCallback","handleSearchChange","onChangeOption","option","handleClearSelection","isSearchedEmptyList","useMemo","isEmptyList","comboboxCallbackStateParams","runOnMount","useLayoutEffect","jsx","jsxs","Popover","newOpen","PopoverTrigger","Button","cn","LoadingMask","Fragment","e","X","ChevronDown","PopoverContent","Command","CommandInput","CommandList","CommandGroup","CommandEmpty","CommandItem","ComboboxOptions"],"mappings":";;;;;;;;;;;;AA+BA,MAAMA,KAAuB,CAAsBC,MAIrC;AACZ,QAAM,EAAE,OAAAC,GAAO,gBAAAC,IAAiB,CAAA,GAAI,gBAAAC,MAAmBH;AACvD,MAAI,CAACC,EAAO,QAAO;AAEnB,QAAMG,IAAQ,CADUF,EAAe,KAAK,CAAAG,MAAK,OAAOA,EAAE,KAAK,EAAE,YAAA,MAAkB,OAAOJ,CAAK,EAAE,aAAa,GAC7EE,CAAe,EAC7C,OAAO,OAAO,EACd,IAAI,CAAAE,MAAKA,EAAG,KAAK,EACjB,KAAK,OAAO;AACf,SAAKD,KAAcH;AAErB,GAGaK,KAAW,CAAwBC,MAA+B;AAC7E,QAAM;AAAA,IACJ,OAAAN;AAAA,IACA,UAAAO;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC,IAAc;AAAA,IACd,cAAAC;AAAA,IACA,SAASC;AAAA,IACT,YAAAC,IAAa;AAAA,IACb,aAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,SAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,eAAAC;AAAA,EAAA,IACEjB,GACE,CAAEkB,GAAgBC,CAAkB,IAAIC,EAAS,EAAK,GACtD,CAAEC,GAAMC,CAAQ,IAAIF,EAAS,EAAK,GAClC,CAAEG,GAAYC,CAAc,IAAIJ,EAAS,EAAE,GAC3C,CAAExB,GAAgB6B,CAAkB,IAAIL,EAAA,GACxC,CAAEM,GAASC,CAAW,IAAIP,EAAS,EAAK,GAExC,CAAEQ,GAASC,CAAmB,IAAIT,EAAiC,CAAA,CAAE,GACrE,CAAEzB,IAAgBmC,EAAkB,IAAIV,EAAiC,CAAA,CAAE,GAC3EW,IAA+DC,EAAY,CAACC,MAAW;AAC3F,UAAMC,IAAU,CAACC,MAAiC;AAChD,YAAMC,IAA8B,CAAA,GAC9BC,IAAO,CAACC,MAAmC;AAC/C,YAAKA;AACL,qBAAWC,KAAQD;AACjB,YAAAF,EAAI,KAAKG,CAAI,GACTA,EAAK,SAASA,EAAK,MAAM,UAAQF,EAAKE,EAAK,KAAK;AAAA,MAExD;AACA,MAAAF,EAAKF,CAAI,GACTL,GAAkB,CAACU,MAAS;AAG1B,YAAI,CAFoBJ,EAAI,KAAK,CAAAtC,MAAK,CAAC,CAACJ,KAAS,OAAOI,EAAE,KAAK,MAAM,OAAOJ,CAAK,CAAC,GAE5D;AACpB,gBAAM+C,IAAU7C,KAAkB4C,EAAK,KAAK,QAAK,CAAC,CAAC9C,KAAS,OAAOI,GAAE,KAAK,MAAM,OAAOJ,CAAK,CAAC;AAC7F,cAAI+C,EAAS,QAAO,CAAEA,GAAS,GAAGL,CAAI;AAAA,QACxC;AAEA,eAAOA;AAAA,MACT,CAAC;AAAA,IACH;AACA,IAAAP,EAAmB,CAACW,MAAS;AAC3B,YAAML,IAA+B,OAAOF,KAAW,aAAaA,EAAOO,CAAI,IAAIP;AACnF,aAAAC,EAAQC,CAAI,GACLA;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAEvC,GAAgBF,CAAM,CAAC;AAE5B,EAAAgD,GAAU,MAAM;AACd,IAAApC,GAAa,UAAUyB,EAAWzB,CAAW;AAAA,EAC/C,GAAG,CAAEA,CAAY,CAAC;AAElB,QAAMqC,KAAoB,YAAY;AACpC,IAAKtB,MACEuB,EAAA,GACLpB,EAAc,EAAE;AAAA,EAEpB,GAEMoB,IAAUZ,EAAY,OAAOa,MAAoB;AACrD,IAAAlB,EAAW,EAAI;AACf,QAAI;AACF,YAAMmB,IAAiB,MAAMzC,EAAawC,CAAM;AAChD,MAAAd,EAAWe,CAAc;AAAA,IAC3B,SAASC,GAAO;AACd,cAAQ,MAAM,sCAAsCA,CAAK;AAAA,IAC3D,UAAA;AACE,MAAApB,EAAW,EAAK;AAAA,IAClB;AAAA,EACF,GAAG,CAAEI,CAAW,CAAC,GAEXiB,KAAmBC,GAAoBL,GAAS,KAAM;AAAA,IAC1D,SAAS;AAAA,IACT,UAAU;AAAA,EAAA,CACX,GAEKM,KAAqBlB,EAAY,CAACtC,MAAkB;AACxD,IAAAiC,EAAW,EAAI,GACfH,EAAc9B,CAAK,GACnBsD,GAAiBtD,CAAK;AAAA,EACxB,GAAG,CAAA,CAAE,GAECyD,IAAiBnB,EAAY,CAACoB,MAAiC;AACnE,IAAAnD,EAASmD,EAAO,KAAK,GACrB3B,EAAkB2B,CAAM,GACxBzB,EAAW,EAAK;AAAA,EAClB,GAAG,CAAA,CAAE,GAEC0B,KAAuBrB,EAAY,MAAM;AAC7C,IAAAmB,EAAe,EAAE,OAAO,IAAI,OAAO,IAAI,GACvC1B,EAAkB,MAAS,GAC3BE,EAAW,EAAK;AAAA,EAClB,GAAG,CAAA,CAAE,GAEC2B,IAAsBC,EAAQ,MAC3B,EAAQhC,KAAe,CAACK,EAAQ,UAAU,CAACF,GACjD,CAAEA,GAASE,EAAQ,QAAQL,CAAW,CAAC,GAEpCiC,IAAcD,EAAQ,MACnB,CAAC3B,EAAQ,UAAU,CAACF,GAC1B,CAAEA,GAASE,EAAQ,QAAQL,CAAW,CAAC,GAEpCkC,IACJF,EAAQ,OACC;AAAA,IACL,SAAA3B;AAAA,IACA,YAAAG;AAAA,IACA,gBAAAnC;AAAA,IACA,mBAAA6B;AAAA,IACA,QAAQF,KAAc;AAAA,IACtB,WAAWC;AAAA,IACX,MAAAH;AAAA,IACA,SAAAC;AAAA,IACA,SAAAI;AAAA,IACA,YAAAC;AAAA,IACA,aAAA6B;AAAA,IACA,qBAAAF;AAAA,EAAA,IAED,CAAE5B,GAASL,GAAMO,GAASL,GAAY3B,GAAgB4D,GAAaF,GAAqBvB,CAAW,CAAC,GAEnG2B,KAAa1B,EAAY,YAAY;AACzC,QAAKpB,GACL;AAAA,MAAAO,EAAkB,EAAI;AACtB,UAAI;AACF,cAAMP,EAAQ6C,CAA2B;AAAA,MAC3C,UAAA;AACE,QAAAtC,EAAkB,EAAK;AAAA,MACzB;AAAA;AAAA,EACF,GAAG,CAAEP,GAAS6C,CAA4B,CAAC;AAE3C,SAAAE,GAAgB,MAAM;AACpB,IAAAD,GAAA;AAAA,EACF,GAAG,CAAA,CAAE,GAGH,gBAAAE,EAAC,OAAA,EAAI,WAAU,UACb,UAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAzC;AAAA,MACA,cAAc,CAAC0C,MAAY;AACzB,QAAAzC,EAAQyC,CAAO,GACXA,KAASpB,GAAA;AAAA,MACf;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAiB,EAACI,IAAA,EAAe,SAAO,IAAC,WAAU,gBAChC,UAAA,gBAAAH;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,MAAK;AAAA,YACL,iBAAe5C;AAAA,YACf,WAAW6C;AAAA,cACT;AAAA,cACA;AAAA,cACA7C,KAAQ;AAAA,cACR;AAAA,cACAJ,KAAiB;AAAA,cACjBA,KAAiBI,KAAQ;AAAA,YAAA;AAAA,YAE3B,UAAUlB,KAAYe;AAAA,YAErB,UAAA;AAAA,cAAAA,KAAkB,gBAAA0C,EAACO,KAAY,WAAS,GAAA,CAAA;AAAA,cACxC,CAACjD,KAAkBD,KAAiBA,EAAcwC,CAA2B;AAAA,cAC7E,CAACvC,KAAkB,CAACD,KACnB,gBAAA4C,EAAAO,GAAA,EACI,UAAA;AAAA,gBAAA,gBAAAR;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAU;AAAA,oBACT,UAAAlE,IACGF,GAAqB,EAAE,OAAAE,GAAO,gBAAAC,IAAgB,gBAAAC,EAAA,CAAgB,IAC9D,gBAAAgE,EAAC,QAAA,EAAK,WAAU,iBAAiB,UAAA1D,EAAA,CAAY;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGpDR,IACC,gBAAAkE;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAWM;AAAA,sBACT;AAAA,sBACA;AAAA,sBACA;AAAA,sBACA;AAAA,oBAAA;AAAA,oBAEF,SAAS,CAACG,MAAM;AACd,sBAAAA,EAAE,gBAAA,GACFhB,GAAA;AAAA,oBACF;AAAA,oBAEA,4BAACiB,IAAA,CAAA,CAAC;AAAA,kBAAA;AAAA,gBAAA,IAGJ,gBAAAV,EAACW,IAAA,EAAY,WAAU,qBAAA,CAAoB;AAAA,cAAA,EAAA,CAE/C;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA,GAGN;AAAA,QACA,gBAAAX;AAAA,UAACY;AAAA,UAAA;AAAA,YACC,WAAWN;AAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,YAEF,OAAM;AAAA,YAEN,UAAA,gBAAAL,EAACY,IAAA,EAAQ,cAAc,IACrB,UAAA;AAAA,cAAA,gBAAAb;AAAA,gBAACc;AAAA,gBAAA;AAAA,kBACC,aAAatE;AAAA,kBACb,OAAOmB;AAAA,kBACP,eAAe2B;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEhB,OAAOzC,KAAuB,aAC3BA,EAAmBgD,CAA2B,IAC9ChD;AAAA,gCACHkE,IAAA,EACC,UAAA,gBAAAd;AAAA,gBAACe;AAAA,gBAAA;AAAA,kBACC,WAAWV;AAAA,oBACT,CAACtC,EAAQ,UAAU;AAAA,oBACnB;AAAA,kBAAA;AAAA,kBAGD,UAAA;AAAA,oBAAAF,KAAW,gBAAAkC,EAACO,KAAY,WAAS,GAAA,CAAA;AAAA,oBACjC,CAACzC,KAAW8B,KACX,gBAAAI,EAAAQ,GAAA,EACG,cACC,gBAAAP,EAACgB,GAAA,EAAa,WAAU,8CACtB,UAAA;AAAA,sBAAA,gBAAAjB,EAAC,UAAM,UAAArD,EAAA,CAAW;AAAA,sBACjB,OAAOC,KAAgB,aACpBA,EAAYiD,CAA2B,IACvCjD;AAAA,oBAAA,EAAA,CACN,IAEA,gBAAAoD,EAACiB,GAAA,EAAc,UAAAtE,EAAA,CAAW,GAE9B;AAAA,oBAED,CAACmB,KAAW,CAAC8B,KACZ,gBAAAK,EAAAO,GAAA,EACG,UAAA;AAAA,sBAAA1D,KACC,gBAAAkD;AAAA,wBAACkB;AAAA,wBAAA;AAAA,0BAEC,SAAO;AAAA,0BACP,WAAU;AAAA,0BAET,UAAA,OAAOpE,KAAmB,aACvBA,EAAe+C,CAA2B,IAC1C/C;AAAA,wBAAA;AAAA,wBANA;AAAA,sBAAA;AAAA,sBASR,gBAAAkD;AAAA,wBAACmB;AAAA,wBAAA;AAAA,0BACC,YAAAxD;AAAA,0BACA,OAAA7B;AAAA,0BACA,SAAAkC;AAAA,0BACA,gBAAAuB;AAAA,0BACA,SAAA7B;AAAA,0BACA,qBAAAT;AAAA,0BACA,oBAAAC;AAAA,0BACA,kBAAAC;AAAA,0BACA,wBAAAC;AAAA,wBAAA;AAAA,sBAAA;AAAA,oBACF,EAAA,CACF;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAAA,GAGN;AAAA,cAGC,CAACU,KAAWf,KAAoB,CAAC6C,KAChC,gBAAAI;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,aAAU;AAAA,kBACV,WAAU;AAAA,kBAET,UAAA,OAAOjD,KAAqB,aACzBA,EAAiB8C,CAA2B,IAC5C9C;AAAA,gBAAA;AAAA,cAAA;AAAA,YACN,EAAA,CAEJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}
1
+ {"version":3,"file":"Combobox.js","sources":["../../src/Combobox/Combobox.tsx"],"sourcesContent":["import {\n Dispatch,\n SetStateAction,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react';\nimport { LoadingMask } from '../LoadingMask';\nimport { Popover, PopoverContent, PopoverTrigger } from '../Popover';\nimport { Button } from '../Button';\nimport {\n Command,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n} from '../Command';\nimport { cn } from '@oneplatformdev/utils';\nimport { useDebounceCallback } from '@oneplatformdev/hooks';\nimport { ChevronDown, X } from 'lucide-react';\nimport {\n ComboboxCallbackStateParams,\n ComboboxOption,\n ComboboxProps,\n} from './Combobox.types';\nimport { ComboboxOptions } from './ComboboxOptions';\n\n// TODO: refactor next component | nlt code\nconst getSelectRenderLabel = <Data extends object>(params: {\n value: ComboboxProps<Data>['value'];\n flattenOptions: ComboboxOption<Data>[];\n selectedOption?: ComboboxOption<Data>;\n}): string => {\n const { value, flattenOptions = [], selectedOption } = params;\n if (!value) return 'No value for render label';\n const flattenedOption = flattenOptions.find(o => String(o.value).toLowerCase() === String(value).toLowerCase());\n const label = [ flattenedOption, selectedOption ]\n .filter(Boolean)\n .map(o => o!.label)\n .find(Boolean);\n if (!label) return value;\n return label;\n}\n\n// TODO: refactor next component | nlt code\nexport const Combobox = <Data extends object, >(props: ComboboxProps<Data>) => {\n const {\n value,\n onChange,\n placeholder,\n disabled,\n searchLabel = 'Type to search...',\n fetchOptions,\n options: itemOptions,\n emptyLabel = 'No options',\n emptyAction,\n commandInputAction,\n listHeadAction,\n listFooterAction,\n listFooterActionProps,\n onMount,\n defaultNodeDisabled,\n defaultNodeMatched,\n defaultNodeMuted,\n defaultNodeInteractive,\n renderTrigger,\n } = props;\n const [ initialLoading, setInitialLoading ] = useState(false);\n const [ open, setOpen ] = useState(false);\n const [ searchTerm, setSearchTerm ] = useState('');\n const [ selectedOption, setSelectedOption ] = useState<ComboboxOption<Data>>();\n const [ loading, setLoading ] = useState(false);\n\n const [ options, setOptionsDispatch ] = useState<ComboboxOption<Data>[]>([]);\n const [ flattenOptions, setFlattenOptions ] = useState<ComboboxOption<Data>[]>([]);\n const setOptions: Dispatch<SetStateAction<ComboboxOption<Data>[]>> = useCallback((stater) => {\n const flatten = (next: ComboboxOption<Data>[]) => {\n const res: ComboboxOption<Data>[] = [];\n const walk = (nodes?: ComboboxOption<Data>[]) => {\n if (!nodes) return;\n for (const node of nodes) {\n res.push(node);\n if (node.items && node.items.length) walk(node.items);\n }\n };\n walk(next);\n setFlattenOptions((prev) => {\n const isIncludedInRes = res.find(o => !!value && String(o.value) === String(value));\n\n if (!isIncludedInRes) {\n const current = selectedOption || prev.find(o => !!value && String(o.value) === String(value))\n if (current) return [ current, ...res ];\n }\n\n return res;\n });\n }\n setOptionsDispatch((prev) => {\n const next: ComboboxOption<Data>[] = typeof stater === 'function' ? stater(prev) : stater;\n flatten(next);\n return next;\n });\n }, [ selectedOption, value ])\n\n useEffect(() => {\n itemOptions?.length && setOptions(itemOptions);\n }, [ itemOptions ]);\n\n const handlePopoverOpen = async () => {\n if (!open) {\n void getData();\n setSearchTerm('');\n }\n };\n\n const getData = useCallback(async (search?: string) => {\n setLoading(true);\n try {\n const fetchedOptions = await fetchOptions(search);\n setOptions(fetchedOptions);\n } catch (error) {\n console.error('Unexpected error while get option:', error);\n } finally {\n setLoading(false);\n }\n }, [ setOptions ]);\n\n const debouncedGetData = useDebounceCallback(getData, 1000, {\n leading: false,\n trailing: true,\n });\n\n const handleSearchChange = useCallback((value: string) => {\n setLoading(true);\n setSearchTerm(value);\n debouncedGetData(value);\n }, []);\n\n const onChangeOption = useCallback((option: ComboboxOption<Data>) => {\n onChange(option.value);\n setSelectedOption(option);\n setLoading(false);\n }, []);\n\n const handleClearSelection = useCallback(() => {\n onChangeOption({ value: '', label: '' });\n setSelectedOption(undefined);\n setLoading(false);\n }, []);\n\n const isSearchedEmptyList = useMemo(() => {\n return Boolean(searchTerm) && !options.length && !loading;\n }, [ loading, options.length, searchTerm ])\n\n const isEmptyList = useMemo(() => {\n return !options.length && !loading;\n }, [ loading, options.length, searchTerm ])\n\n const comboboxCallbackStateParams =\n useMemo((): ComboboxCallbackStateParams<Data> => {\n return {\n options,\n setOptions,\n selectedOption,\n setSelectedOption,\n search: searchTerm || '',\n setSearch: setSearchTerm,\n open,\n setOpen,\n loading,\n setLoading,\n isEmptyList,\n isSearchedEmptyList,\n };\n }, [ loading, open, options, searchTerm, selectedOption, isEmptyList, isSearchedEmptyList, setOptions ]);\n\n const runOnMount = useCallback(async () => {\n if (!onMount) return;\n setInitialLoading(true);\n try {\n await onMount(comboboxCallbackStateParams);\n } finally {\n setInitialLoading(false);\n }\n }, [ onMount, comboboxCallbackStateParams ]);\n\n useLayoutEffect(() => {\n runOnMount();\n }, []);\n\n return (\n <div className=\"w-full\">\n <Popover\n open={open}\n onOpenChange={(newOpen) => {\n setOpen(newOpen);\n if (newOpen) handlePopoverOpen();\n }}\n >\n <PopoverTrigger asChild className=\"border-input\">\n <Button\n color='secondary'\n role=\"combobox\"\n aria-expanded={open}\n className={cn(\n 'relative w-full justify-between font-normal text-sm bg-transparent',\n 'border border-border',\n open && 'border-2 outline-hidden ring-1 ring-ring',\n 'focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring',\n renderTrigger && 'p-0',\n renderTrigger && open && 'p-0 border-1 ring-0 ring-transparent',\n )}\n disabled={disabled || initialLoading}\n >\n {initialLoading && <LoadingMask fullWidth/>}\n {!initialLoading && renderTrigger && renderTrigger(comboboxCallbackStateParams)}\n {!initialLoading && !renderTrigger && (\n <>\n <span\n className=\"truncate max-w-[calc(100%-1.5rem)] overflow-hidden whitespace-nowrap\">\n {value\n ? getSelectRenderLabel({ value, flattenOptions, selectedOption })\n : <span className=\"text-gray-400\">{placeholder}</span>\n }\n </span>\n {value ? (\n <div\n className={cn(\n 'absolute top-0 right-1',\n 'flex items-center justify-center',\n 'w-9 aspect-square [&_svg]:size-5',\n 'opacity-50 cursor-pointer hover:opacity-100'\n )}\n onClick={(e) => {\n e.stopPropagation();\n handleClearSelection();\n }}\n >\n <X/>\n </div>\n ) : (\n <ChevronDown className=\"opacity-50 w-4 h-4\"/>\n )}\n </>\n )}\n </Button>\n </PopoverTrigger>\n <PopoverContent\n className={cn(\n \"w-(--radix-popper-anchor-width) max-w-none p-2\",\n '-translate-y-3',\n )}\n align=\"start\"\n >\n <Command shouldFilter={false}>\n <CommandInput\n placeholder={searchLabel}\n value={searchTerm}\n onValueChange={handleSearchChange}\n />\n {typeof commandInputAction === 'function'\n ? commandInputAction(comboboxCallbackStateParams)\n : commandInputAction}\n <CommandList>\n <CommandGroup\n className={cn(\n !options.length && 'p-0 shadow-none',\n 'px-0 py-2',\n )}\n >\n {loading && <LoadingMask fullWidth/>}\n {!loading && isEmptyList && (\n <>\n {emptyAction ? (\n <CommandEmpty className=\"flex flex-col gap-3 py-5 px-3 items-center\">\n <span>{emptyLabel}</span>\n {typeof emptyAction === 'function'\n ? emptyAction(comboboxCallbackStateParams)\n : emptyAction}\n </CommandEmpty>\n ) : (\n <CommandEmpty>{emptyLabel}</CommandEmpty>\n )}\n </>\n )}\n {!loading && !isEmptyList && (\n <>\n {listHeadAction && (\n <CommandItem\n key='combobox-list-head-action'\n asChild\n className='w-full'\n >\n {typeof listHeadAction === 'function'\n ? listHeadAction(comboboxCallbackStateParams)\n : listHeadAction}\n </CommandItem>\n )}\n <ComboboxOptions\n searchTerm={searchTerm}\n value={value}\n options={options}\n onChangeOption={onChangeOption}\n setOpen={setOpen}\n defaultNodeDisabled={defaultNodeDisabled}\n defaultNodeMatched={defaultNodeMatched}\n defaultNodeMuted={defaultNodeMuted}\n defaultNodeInteractive={defaultNodeInteractive}\n />\n </>\n )}\n </CommandGroup>\n </CommandList>\n\n {/*LIST FOOTER ACTION*/}\n {!loading && listFooterAction && !isEmptyList && (\n <div\n data-slot=\"command-footer-wrapper\"\n {...((() => {\n const { bordered = true, ...rest } = listFooterActionProps || {};\n return {\n ...rest,\n 'data-slot-bordered': JSON.stringify(bordered)\n }\n })())}\n className={cn(\n \"flex w-full min-h-10 items-center gap-2 px-0\",\n (listFooterActionProps?.bordered ?? true) && 'border-t px-0 pt-2 min-h-12',\n listFooterActionProps?.className,\n )}\n >\n {typeof listFooterAction === 'function'\n ? listFooterAction(comboboxCallbackStateParams)\n : listFooterAction}\n </div>\n )}\n </Command>\n </PopoverContent>\n </Popover>\n </div>\n );\n}\n"],"names":["getSelectRenderLabel","params","value","flattenOptions","selectedOption","label","o","Combobox","props","onChange","placeholder","disabled","searchLabel","fetchOptions","itemOptions","emptyLabel","emptyAction","commandInputAction","listHeadAction","listFooterAction","listFooterActionProps","onMount","defaultNodeDisabled","defaultNodeMatched","defaultNodeMuted","defaultNodeInteractive","renderTrigger","initialLoading","setInitialLoading","useState","open","setOpen","searchTerm","setSearchTerm","setSelectedOption","loading","setLoading","options","setOptionsDispatch","setFlattenOptions","setOptions","useCallback","stater","flatten","next","res","walk","nodes","node","prev","current","useEffect","handlePopoverOpen","getData","search","fetchedOptions","error","debouncedGetData","useDebounceCallback","handleSearchChange","onChangeOption","option","handleClearSelection","isSearchedEmptyList","useMemo","isEmptyList","comboboxCallbackStateParams","runOnMount","useLayoutEffect","jsx","jsxs","Popover","newOpen","PopoverTrigger","Button","cn","LoadingMask","Fragment","X","ChevronDown","PopoverContent","Command","CommandInput","CommandList","CommandGroup","CommandEmpty","CommandItem","ComboboxOptions","bordered","rest"],"mappings":"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"}
package/Combobox/Combobox.stories.js CHANGED
@@ -14,11 +14,11 @@ const h = (e) => new Promise((n) => setTimeout(n, e)), x = (e = []) => {
14
14
  if (!l) return e;
15
15
  const s = x(e), b = new Set(
16
16
  s.filter((i) => String(i.label).toLowerCase().includes(l)).map((i) => String(i.value))
17
- ), p = (i) => i.map((c) => {
18
- const m = c.items?.length ? p(c.items) : void 0;
19
- return !(b.has(String(c.value)) || String(c.label).toLowerCase().includes(l)) && !m?.length ? null : { ...c, items: m };
17
+ ), m = (i) => i.map((c) => {
18
+ const p = c.items?.length ? m(c.items) : void 0;
19
+ return !(b.has(String(c.value)) || String(c.label).toLowerCase().includes(l)) && !p?.length ? null : { ...c, items: p };
20
20
  }).filter(Boolean);
21
- return p(e);
21
+ return m(e);
22
22
  }, r = [
23
23
  { value: "ua", label: "Ukraine" },
24
24
  { value: "pl", label: "Poland" },
@@ -168,11 +168,11 @@ const w = {
168
168
  "button",
169
169
  {
170
170
  type: "button",
171
- className: "w-full text-left px-3 py-2 text-sm",
171
+ className: "w-full text-left min-h-10 text-sm",
172
172
  onClick: () => {
173
173
  e.setSearch(""), e.setOpen(!1);
174
174
  },
175
- children: "Add new option"
175
+ children: "list footer action"
176
176
  }
177
177
  )
178
178
  },
package/Combobox/Combobox.stories.js.map CHANGED
@@ -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 { value: 'ua', label: 'Ukraine' },\n { value: 'pl', label: 'Poland' },\n { value: 'de', label: 'Germany' },\n { value: 'fr', label: 'France' },\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 px-3 py-2 text-sm\"\n onClick={() => {\n st.setSearch('');\n st.setOpen(false);\n }}\n >\n Add new option\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":"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"}
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 { value: 'ua', label: 'Ukraine' },\n { value: 'pl', label: 'Poland' },\n { value: 'de', label: 'Germany' },\n { value: 'fr', label: 'France' },\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":"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"}
package/Combobox/Combobox.types.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { Dispatch, ReactNode, SetStateAction } from 'react';
1
+ import { Dispatch, HTMLAttributes, ReactNode, SetStateAction } from 'react';
2
2
  export interface ComboboxOption<Data extends object = object> {
3
3
  value: string;
4
4
  label: string;
@@ -41,6 +41,9 @@ export interface IComboboxOptionsNodeProps<Data extends object = object> extends
41
41
  export interface IComboboxOptionsProps<Data extends object = object> extends Omit<IComboboxOptionsNodeProps<Data>, 'option'>, IComboboxOptionsNodeHandlersProps<Data> {
42
42
  options?: ComboboxOption<Data>[];
43
43
  }
44
+ interface IListActionProps extends HTMLAttributes<HTMLDivElement> {
45
+ bordered?: boolean;
46
+ }
44
47
  export interface ComboboxProps<Data extends object = object> extends IComboboxOptionsNodeHandlersProps {
45
48
  value: string;
46
49
  onChange: (value: string) => void;
@@ -59,8 +62,11 @@ export interface ComboboxProps<Data extends object = object> extends IComboboxOp
59
62
  listHeadAction?: ((params: ComboboxCallbackStateParams<Data>) => ReactNode) | ReactNode;
60
63
  /** Command List footer element action */
61
64
  listFooterAction?: ((params: ComboboxCallbackStateParams<Data>) => ReactNode) | ReactNode;
65
+ /** Command List footer element action props */
66
+ listFooterActionProps?: IListActionProps;
62
67
  /** Callback for load data on start component */
63
68
  onMount?: (params: ComboboxCallbackStateParams<Data>) => Promise<void>;
64
69
  renderTrigger?: (params: ComboboxCallbackStateParams<Data>) => ReactNode;
65
70
  }
71
+ export {};
66
72
  //# sourceMappingURL=Combobox.types.d.ts.map
package/Combobox/Combobox.types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.types.ts"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oneplatformdev/ui",
3
- "version": "0.1.99-beta.202",
3
+ "version": "0.1.99-beta.203",
4
4
  "description": "UI component library for OnePlatform",
5
5
  "author": "One Platform Development Team",
6
6
  "keywords": [
@@ -106,9 +106,9 @@
106
106
  "recharts": "^3.2.0",
107
107
  "sonner": "^2.0.7",
108
108
  "vaul": "^1.1.2",
109
- "@oneplatformdev/tokens": "^0.1.99-beta.202",
110
- "@oneplatformdev/utils": "^0.1.99-beta.202",
111
- "@oneplatformdev/hooks": "^0.1.99-beta.202"
109
+ "@oneplatformdev/hooks": "^0.1.99-beta.203",
110
+ "@oneplatformdev/tokens": "^0.1.99-beta.203",
111
+ "@oneplatformdev/utils": "^0.1.99-beta.203"
112
112
  },
113
113
  "scripts": {
114
114
  "chromatic": "chromatic"