@godxjp/ui 9.2.0 → 10.0.0

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 (137) hide show
  1. package/README.md +58 -29
  2. package/dist/app/index.d.ts +1 -1
  3. package/dist/app/index.js +4 -4
  4. package/dist/{app.prop-UTc4j4nj.d.ts → app.prop-Cy6dJnU8.d.ts} +18 -40
  5. package/dist/{checkbox-ChRsR7Nk.d.ts → checkbox-em-oFM5D.d.ts} +1 -1
  6. package/dist/{chunk-LJLGABFV.js → chunk-2HXZT2WJ.js} +17 -9
  7. package/dist/{chunk-QLMXEJSY.js → chunk-3Q4A4U2P.js} +24 -1
  8. package/dist/{chunk-26CPAKUP.js → chunk-44YRPSZ7.js} +1 -2
  9. package/dist/{chunk-HB2OHB5X.js → chunk-5NCFLCM7.js} +27 -16
  10. package/dist/{chunk-FXFJF4YA.js → chunk-6CSBMMZS.js} +262 -31
  11. package/dist/{chunk-E7HBHUJY.js → chunk-6HHSU6RG.js} +8 -6
  12. package/dist/{chunk-457KVJTX.js → chunk-7Q45MBFW.js} +7 -5
  13. package/dist/{chunk-O24Z3ULJ.js → chunk-BE6GJGKJ.js} +1 -1
  14. package/dist/{chunk-FVPCVZL3.js → chunk-BG5RNXTH.js} +1 -1
  15. package/dist/{chunk-AINW5WYN.js → chunk-COD66MFF.js} +1 -2
  16. package/dist/{chunk-IOGU3ZWF.js → chunk-DNGJHWJZ.js} +3 -3
  17. package/dist/{chunk-3TS3G4U3.js → chunk-EE5DKOHX.js} +3 -1
  18. package/dist/{chunk-G6Q32VHO.js → chunk-EQZP53KI.js} +33 -8
  19. package/dist/{chunk-BHV2FUOA.js → chunk-EZHHJQWQ.js} +1 -1
  20. package/dist/{chunk-N3JPLJ3B.js → chunk-GDDCSKCB.js} +12 -5
  21. package/dist/{chunk-RLGHEV4A.js → chunk-HTG5VHU7.js} +10 -1
  22. package/dist/{chunk-R2W2FX5Q.js → chunk-I7NQ2LIL.js} +1 -9
  23. package/dist/{chunk-XQMPK4GM.js → chunk-IHRMOJXD.js} +86 -39
  24. package/dist/{chunk-TILFZBTE.js → chunk-INIIF7F7.js} +1 -4
  25. package/dist/{chunk-UIYEAUWA.js → chunk-IY347EQA.js} +2 -2
  26. package/dist/{chunk-HCM4JAC2.js → chunk-JWGLJXQU.js} +39 -11
  27. package/dist/{chunk-TO33OY4L.js → chunk-LMKUKCTN.js} +1 -1
  28. package/dist/chunk-NXVCI6YB.js +453 -0
  29. package/dist/{chunk-S6TBIL7J.js → chunk-O6DQZYNI.js} +63 -44
  30. package/dist/{chunk-O2OUNXV4.js → chunk-P5KPCT6R.js} +3 -3
  31. package/dist/{chunk-6HQMUUQW.js → chunk-PDXFQS7M.js} +14 -30
  32. package/dist/{chunk-F7PG4OEV.js → chunk-QSGW3ZWK.js} +12 -4
  33. package/dist/{chunk-25RYBC5T.js → chunk-S2IJKT3D.js} +1 -1
  34. package/dist/{chunk-OJZ6C2HM.js → chunk-SARQRCKO.js} +54 -48
  35. package/dist/chunk-T2QO2S65.js +126 -0
  36. package/dist/{chunk-26WDEDWL.js → chunk-TGNBXS7H.js} +32 -23
  37. package/dist/{chunk-6J7GRCDA.js → chunk-UNVRNJCB.js} +71 -11
  38. package/dist/{chunk-6YBYAEXD.js → chunk-VSM44AYE.js} +94 -24
  39. package/dist/{chunk-QWLXN6CT.js → chunk-VSUYVT2Q.js} +3 -2
  40. package/dist/{chunk-4R7QL3MW.js → chunk-X2VY4MOW.js} +14 -29
  41. package/dist/{chunk-ETLAI3QU.js → chunk-Z46J47FY.js} +73 -77
  42. package/dist/components/admin/index.d.ts +22 -12
  43. package/dist/components/admin/index.js +23 -24
  44. package/dist/components/data-display/badge.js +3 -3
  45. package/dist/components/data-display/card.d.ts +3 -3
  46. package/dist/components/data-display/card.js +1 -1
  47. package/dist/components/data-display/carousel.js +3 -1
  48. package/dist/components/data-display/index.js +54 -32
  49. package/dist/components/data-entry/calendar.d.ts +1 -1
  50. package/dist/components/data-entry/calendar.js +1 -1
  51. package/dist/components/data-entry/cascader.d.ts +1 -1
  52. package/dist/components/data-entry/cascader.js +5 -5
  53. package/dist/components/data-entry/checkbox.d.ts +2 -2
  54. package/dist/components/data-entry/checkbox.js +2 -2
  55. package/dist/components/data-entry/color-picker.d.ts +1 -1
  56. package/dist/components/data-entry/color-picker.js +3 -3
  57. package/dist/components/data-entry/date-picker.d.ts +2 -2
  58. package/dist/components/data-entry/date-picker.js +4 -4
  59. package/dist/components/data-entry/date-range-picker.d.ts +2 -2
  60. package/dist/components/data-entry/date-range-picker.js +4 -4
  61. package/dist/components/data-entry/index.d.ts +9 -25
  62. package/dist/components/data-entry/index.js +22 -26
  63. package/dist/components/data-entry/radio.d.ts +1 -1
  64. package/dist/components/data-entry/radio.js +2 -2
  65. package/dist/components/data-entry/select.d.ts +2 -2
  66. package/dist/components/data-entry/select.js +3 -4
  67. package/dist/components/data-entry/slider.d.ts +1 -1
  68. package/dist/components/data-entry/switch.d.ts +2 -2
  69. package/dist/components/data-entry/switch.js +1 -1
  70. package/dist/components/data-entry/time-input.js +2 -2
  71. package/dist/components/data-entry/time-picker.d.ts +3 -1
  72. package/dist/components/data-entry/time-picker.js +3 -3
  73. package/dist/components/data-entry/transfer.d.ts +2 -2
  74. package/dist/components/data-entry/transfer.js +5 -5
  75. package/dist/components/data-entry/tree-select.d.ts +1 -1
  76. package/dist/components/data-entry/tree-select.js +5 -5
  77. package/dist/components/data-entry/upload.d.ts +2 -2
  78. package/dist/components/data-entry/upload.js +5 -5
  79. package/dist/components/feedback/alert.js +5 -5
  80. package/dist/components/feedback/dialog.js +3 -3
  81. package/dist/components/feedback/index.d.ts +1 -1
  82. package/dist/components/feedback/index.js +8 -8
  83. package/dist/components/feedback/sheet.js +1 -1
  84. package/dist/components/layout/index.d.ts +6 -9
  85. package/dist/components/layout/index.js +5 -3
  86. package/dist/components/navigation/dropdown-menu.js +1 -1
  87. package/dist/components/navigation/index.d.ts +14 -16
  88. package/dist/components/navigation/index.js +7 -8
  89. package/dist/components/navigation/pagination.d.ts +11 -8
  90. package/dist/components/navigation/pagination.js +4 -5
  91. package/dist/components/navigation/steps.d.ts +3 -3
  92. package/dist/components/navigation/steps.js +3 -1
  93. package/dist/components/query/index.d.ts +1 -5
  94. package/dist/components/query/index.js +6 -8
  95. package/dist/components/ui/index.d.ts +5 -7
  96. package/dist/components/ui/index.js +26 -29
  97. package/dist/{data-entry.prop-CDkOajPj.d.ts → data-entry.prop-BR4vNA1j.d.ts} +7 -35
  98. package/dist/filter-bar-BxjSJJnQ.d.ts +7 -0
  99. package/dist/{inline-CDSVAN54.d.ts → flex-D_EXRFSW.d.ts} +2 -8
  100. package/dist/form/index.js +1 -1
  101. package/dist/i18n/index.d.ts +82 -10
  102. package/dist/i18n/index.js +2 -2
  103. package/dist/index.d.ts +6 -6
  104. package/dist/index.js +34 -37
  105. package/dist/lib/datetime/index.js +1 -1
  106. package/dist/{navigation.prop-8DgElO0c.d.ts → navigation.prop-DMcXkR-J.d.ts} +9 -11
  107. package/dist/{password-strength-kQkloEeo.d.ts → password-strength-DVRvXEOK.d.ts} +2 -2
  108. package/dist/props/components/index.d.ts +3 -3
  109. package/dist/props/index.d.ts +3 -3
  110. package/dist/props/index.js +1 -1
  111. package/dist/props/registry.d.ts +84 -39
  112. package/dist/props/registry.js +1 -1
  113. package/dist/{search-input-cezAxpgb.d.ts → search-input-DpqDMXcn.d.ts} +2 -4
  114. package/dist/{skeleton-uWAjSacg.d.ts → skeleton-cj9kh5wo.d.ts} +1 -3
  115. package/dist/styles/control.css +176 -41
  116. package/dist/styles/data-display-layout.css +41 -15
  117. package/dist/styles/feedback-layout.css +44 -12
  118. package/dist/styles/index.css +45 -1
  119. package/dist/styles/layout.css +18 -17
  120. package/dist/styles/navigation-layout.css +3 -1
  121. package/dist/styles/shell-layout.css +3 -3
  122. package/dist/styles/table-layout.css +13 -0
  123. package/dist/tokens/foundation.css +12 -1
  124. package/dist/tokens/semantic/layout.css +2 -2
  125. package/package.json +6 -7
  126. package/scripts/ui-audit.mjs +31 -2
  127. package/dist/chunk-6MCI7W5G.js +0 -201
  128. package/dist/chunk-CAEL2ZD2.js +0 -222
  129. package/dist/chunk-GKXPALFT.js +0 -32
  130. package/dist/chunk-JKHWLPM5.js +0 -101
  131. package/dist/chunk-KDBGFJJI.js +0 -220
  132. package/dist/components/data-entry/autocomplete.d.ts +0 -24
  133. package/dist/components/data-entry/autocomplete.js +0 -10
  134. package/dist/components/data-entry/combobox.d.ts +0 -22
  135. package/dist/components/data-entry/combobox.js +0 -6
  136. package/dist/filter-bar-B5TPUqEO.d.ts +0 -14
  137. /package/dist/{chunk-LDSLS6HE.js → chunk-7CFO5FFE.js} +0 -0
@@ -1,222 +0,0 @@
1
- import { SearchSelect } from './chunk-KDBGFJJI.js';
2
- import { controlTriggerClass } from './chunk-IBK5D2Q6.js';
3
- import { cn } from './chunk-U7N2A7A3.js';
4
- import * as React from 'react';
5
- import * as SelectPrimitive from '@radix-ui/react-select';
6
- import { ChevronDown, ChevronUp } from 'lucide-react';
7
- import { jsxs, jsx } from 'react/jsx-runtime';
8
-
9
- function isDataSelect(props) {
10
- return "options" in props || "loadOptions" in props;
11
- }
12
- function Select(props) {
13
- if (isDataSelect(props)) {
14
- return /* @__PURE__ */ jsx(DataSelect, { ...props });
15
- }
16
- return /* @__PURE__ */ jsx(SelectPrimitive.Root, { "data-slot": "select", ...props });
17
- }
18
- function SelectGroup(props) {
19
- return /* @__PURE__ */ jsx(SelectPrimitive.Group, { "data-slot": "select-group", ...props });
20
- }
21
- function SelectValue(props) {
22
- return /* @__PURE__ */ jsx(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
23
- }
24
- var SelectTrigger = React.forwardRef(({ className, children, size = "default", ...props }, ref) => /* @__PURE__ */ jsxs(
25
- SelectPrimitive.Trigger,
26
- {
27
- ref,
28
- "data-slot": "select-trigger",
29
- "data-size": size,
30
- className: cn(
31
- controlTriggerClass,
32
- "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground w-fit gap-2 whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2",
33
- className
34
- ),
35
- ...props,
36
- children: [
37
- children,
38
- /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-4 shrink-0 opacity-50", "aria-hidden": "true" }) })
39
- ]
40
- }
41
- ));
42
- SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
43
- var SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
44
- SelectPrimitive.ScrollUpButton,
45
- {
46
- ref,
47
- "data-slot": "select-scroll-up-button",
48
- className: cn("flex cursor-default items-center justify-center py-1", className),
49
- ...props,
50
- children: /* @__PURE__ */ jsx(ChevronUp, { className: "size-4", "aria-hidden": "true" })
51
- }
52
- ));
53
- SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
54
- var SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
55
- SelectPrimitive.ScrollDownButton,
56
- {
57
- ref,
58
- "data-slot": "select-scroll-down-button",
59
- className: cn("flex cursor-default items-center justify-center py-1", className),
60
- ...props,
61
- children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-4", "aria-hidden": "true" })
62
- }
63
- ));
64
- SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
65
- var SelectContent = React.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
66
- SelectPrimitive.Content,
67
- {
68
- ref,
69
- "data-slot": "select-content",
70
- className: cn(
71
- "bg-popover text-popover-foreground data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-96 min-w-32 overflow-hidden rounded-md border shadow-md",
72
- position === "popper" && "translate-y-1",
73
- className
74
- ),
75
- position,
76
- ...props,
77
- children: [
78
- /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
79
- /* @__PURE__ */ jsx(
80
- SelectPrimitive.Viewport,
81
- {
82
- "data-slot": "select-viewport",
83
- className: cn(
84
- "p-1",
85
- position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
86
- ),
87
- children
88
- }
89
- ),
90
- /* @__PURE__ */ jsx(SelectScrollDownButton, {})
91
- ]
92
- }
93
- ) }));
94
- SelectContent.displayName = SelectPrimitive.Content.displayName;
95
- var SelectLabel = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
96
- SelectPrimitive.Label,
97
- {
98
- ref,
99
- "data-slot": "select-label",
100
- className: cn("px-2 py-1.5 text-sm font-medium", className),
101
- ...props
102
- }
103
- ));
104
- SelectLabel.displayName = SelectPrimitive.Label.displayName;
105
- var SelectItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
106
- SelectPrimitive.Item,
107
- {
108
- ref,
109
- "data-slot": "select-item",
110
- className: cn(
111
- "focus:bg-accent focus:text-accent-foreground data-[state=checked]:bg-accent data-[state=checked]:text-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm px-2.5 py-1.5 text-sm outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[state=checked]:font-medium [&_svg]:pointer-events-none [&_svg]:shrink-0",
112
- className
113
- ),
114
- ...props,
115
- children: /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
116
- }
117
- ));
118
- SelectItem.displayName = SelectPrimitive.Item.displayName;
119
- var SelectSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
120
- SelectPrimitive.Separator,
121
- {
122
- ref,
123
- "data-slot": "select-separator",
124
- className: cn("bg-border -mx-1 my-1 h-px", className),
125
- ...props
126
- }
127
- ));
128
- SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
129
- function groupDataOptions(options) {
130
- const order = [];
131
- const buckets = /* @__PURE__ */ new Map();
132
- for (const option of options) {
133
- const key = option.group ?? "";
134
- if (!buckets.has(key)) {
135
- buckets.set(key, []);
136
- order.push(key);
137
- }
138
- buckets.get(key).push(option);
139
- }
140
- return order.map((key) => ({ heading: key || void 0, items: buckets.get(key) ?? [] }));
141
- }
142
- function DataSelect({
143
- options = [],
144
- loadOptions,
145
- showSearch,
146
- value = "",
147
- onValueChange,
148
- renderOption,
149
- selectedLabel,
150
- placeholder,
151
- searchPlaceholder,
152
- emptyMessage,
153
- loadingMessage,
154
- clearLabel,
155
- clearable,
156
- disabled,
157
- name,
158
- id,
159
- className,
160
- "data-testid": dataTestId
161
- }) {
162
- const searchable = showSearch ?? Boolean(loadOptions);
163
- if (searchable) {
164
- return /* @__PURE__ */ jsx(
165
- SearchSelect,
166
- {
167
- value,
168
- onValueChange,
169
- options,
170
- loadOptions,
171
- renderOption,
172
- selectedLabel,
173
- placeholder,
174
- searchPlaceholder,
175
- emptyMessage,
176
- loadingMessage,
177
- clearLabel,
178
- clearable,
179
- disabled,
180
- name,
181
- id,
182
- className,
183
- "data-testid": dataTestId
184
- }
185
- );
186
- }
187
- const optionTestId = (optionValue) => dataTestId ? `${dataTestId}-option-${optionValue}` : void 0;
188
- const renderItem = (option) => /* @__PURE__ */ jsx(
189
- SelectItem,
190
- {
191
- value: option.value,
192
- disabled: option.disabled,
193
- "data-testid": optionTestId(option.value),
194
- children: renderOption ? renderOption(option) : option.label
195
- },
196
- option.value
197
- );
198
- return /* @__PURE__ */ jsxs(
199
- SelectPrimitive.Root,
200
- {
201
- "data-slot": "select",
202
- value: value || void 0,
203
- onValueChange: (next) => onValueChange?.(
204
- next,
205
- options.find((option) => option.value === next)
206
- ),
207
- disabled,
208
- name,
209
- children: [
210
- /* @__PURE__ */ jsx(SelectTrigger, { id, "data-testid": dataTestId, className, children: /* @__PURE__ */ jsx(SelectValue, { placeholder }) }),
211
- /* @__PURE__ */ jsx(SelectContent, { children: groupDataOptions(options).map(
212
- (group) => group.heading ? /* @__PURE__ */ jsxs(SelectGroup, { children: [
213
- /* @__PURE__ */ jsx(SelectLabel, { children: group.heading }),
214
- group.items.map(renderItem)
215
- ] }, group.heading) : /* @__PURE__ */ jsx(React.Fragment, { children: group.items.map(renderItem) }, "__ungrouped")
216
- ) })
217
- ]
218
- }
219
- );
220
- }
221
-
222
- export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue };
@@ -1,32 +0,0 @@
1
- import { SearchSelect } from './chunk-KDBGFJJI.js';
2
- import { jsx } from 'react/jsx-runtime';
3
-
4
- function Autocomplete({
5
- options,
6
- value,
7
- onValueChange,
8
- placeholder,
9
- searchPlaceholder,
10
- emptyMessage,
11
- disabled,
12
- className,
13
- id
14
- }) {
15
- return /* @__PURE__ */ jsx(
16
- SearchSelect,
17
- {
18
- id,
19
- value,
20
- onValueChange: (next) => onValueChange?.(next),
21
- options,
22
- clearable: false,
23
- placeholder,
24
- searchPlaceholder,
25
- emptyMessage,
26
- disabled,
27
- className
28
- }
29
- );
30
- }
31
-
32
- export { Autocomplete };
@@ -1,101 +0,0 @@
1
- import { Command, CommandInput, CommandList, CommandEmpty, CommandItem } from './chunk-HTEL5DQI.js';
2
- import { Button } from './chunk-M4PZNAMV.js';
3
- import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
4
- import * as React from 'react';
5
- import { jsxs, jsx } from 'react/jsx-runtime';
6
-
7
- var Combobox = ({
8
- options,
9
- value: controlledValue,
10
- defaultValue = "",
11
- onValueChange,
12
- placeholder,
13
- searchPlaceholder,
14
- emptyText = "No result",
15
- disabled = false,
16
- name,
17
- id,
18
- className
19
- }) => {
20
- const [open, setOpen] = React.useState(false);
21
- const [search, setSearch] = React.useState("");
22
- const [internalValue, setInternalValue] = React.useState(defaultValue);
23
- const isControlled = controlledValue !== void 0;
24
- const value = isControlled ? controlledValue : internalValue;
25
- const selectedLabel = options.find((option) => option.value === value)?.label ?? placeholder ?? "Select";
26
- const resolvedSearch = search.trim().toLowerCase();
27
- const filtered = resolvedSearch ? options.filter((option) => {
28
- const haystack = `${option.label} ${option.value}`.toLowerCase();
29
- return haystack.includes(resolvedSearch);
30
- }) : options;
31
- const setValue = (next) => {
32
- if (!isControlled) setInternalValue(next);
33
- onValueChange?.(next);
34
- setOpen(false);
35
- };
36
- return /* @__PURE__ */ jsxs(
37
- Popover,
38
- {
39
- open,
40
- onOpenChange: (next) => {
41
- setOpen(next);
42
- if (!next) setSearch("");
43
- },
44
- children: [
45
- /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
46
- Button,
47
- {
48
- id,
49
- type: "button",
50
- "data-slot": "combobox-trigger",
51
- variant: "outline",
52
- role: "combobox",
53
- "aria-expanded": open,
54
- disabled,
55
- className,
56
- children: [
57
- /* @__PURE__ */ jsx("span", { className: value ? void 0 : "text-muted-foreground", children: value ? selectedLabel : placeholder ?? "Select" }),
58
- /* @__PURE__ */ jsx("span", { className: "ui-combobox-caret", "aria-hidden": "true" })
59
- ]
60
- }
61
- ) }),
62
- name ? /* @__PURE__ */ jsx("input", { type: "hidden", name, value }) : null,
63
- /* @__PURE__ */ jsx(
64
- PopoverContent,
65
- {
66
- className: "ui-combobox-content",
67
- align: "start",
68
- sideOffset: 4,
69
- collisionPadding: 12,
70
- children: /* @__PURE__ */ jsxs(Command, { shouldFilter: false, className: "ui-combobox-command", children: [
71
- /* @__PURE__ */ jsx(
72
- CommandInput,
73
- {
74
- className: "ui-combobox-search",
75
- value: search,
76
- onValueChange: setSearch,
77
- placeholder: searchPlaceholder ?? "Search..."
78
- }
79
- ),
80
- /* @__PURE__ */ jsx(CommandList, { className: "ui-combobox-list", children: filtered.length === 0 ? /* @__PURE__ */ jsx(CommandEmpty, { children: /* @__PURE__ */ jsx("span", { className: "ui-combobox-empty", children: emptyText }) }) : filtered.map((option) => /* @__PURE__ */ jsx(
81
- CommandItem,
82
- {
83
- value: option.value,
84
- className: "ui-combobox-item",
85
- "data-selected": value === option.value || void 0,
86
- onSelect: () => {
87
- setValue(option.value);
88
- },
89
- children: option.label
90
- },
91
- option.value
92
- )) })
93
- ] })
94
- }
95
- )
96
- ]
97
- }
98
- );
99
- };
100
-
101
- export { Combobox };
@@ -1,220 +0,0 @@
1
- import { Command, CommandList, CommandItem, CommandGroup } from './chunk-HTEL5DQI.js';
2
- import { Input } from './chunk-VOHTRR5X.js';
3
- import { Button } from './chunk-M4PZNAMV.js';
4
- import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
5
- import { useTranslation } from './chunk-RLGHEV4A.js';
6
- import { cn } from './chunk-U7N2A7A3.js';
7
- import * as React from 'react';
8
- import { ChevronsUpDown, Check, Loader2 } from 'lucide-react';
9
- import { jsxs, jsx } from 'react/jsx-runtime';
10
-
11
- var DEBOUNCE_MS = 250;
12
- function SearchSelect({
13
- value = "",
14
- onValueChange,
15
- options: staticOptions,
16
- loadOptions,
17
- renderOption,
18
- selectedLabel,
19
- placeholder,
20
- searchPlaceholder,
21
- emptyMessage,
22
- loadingMessage,
23
- clearLabel,
24
- clearable = true,
25
- disabled = false,
26
- name,
27
- id,
28
- className,
29
- "data-testid": dataTestId
30
- }) {
31
- const { t } = useTranslation();
32
- const [open, setOpen] = React.useState(false);
33
- const [query, setQuery] = React.useState("");
34
- const [debouncedQuery, setDebouncedQuery] = React.useState("");
35
- const [loaded, setLoaded] = React.useState([]);
36
- const [page, setPage] = React.useState(1);
37
- const [hasMore, setHasMore] = React.useState(false);
38
- const [loading, setLoading] = React.useState(false);
39
- const [activeIndex, setActiveIndex] = React.useState(0);
40
- const [picked, setPicked] = React.useState(null);
41
- const reqId = React.useRef(0);
42
- const resolvedLoad = React.useMemo(
43
- () => loadOptions ?? (async ({ query: search }) => {
44
- const needle = search.trim().toLowerCase();
45
- const list = staticOptions ?? [];
46
- return {
47
- options: needle ? list.filter(
48
- (option) => option.label.toLowerCase().includes(needle) || option.value.toLowerCase().includes(needle)
49
- ) : list,
50
- hasMore: false
51
- };
52
- }),
53
- [loadOptions, staticOptions]
54
- );
55
- React.useEffect(() => {
56
- const handle = window.setTimeout(() => setDebouncedQuery(query.trim()), DEBOUNCE_MS);
57
- return () => window.clearTimeout(handle);
58
- }, [query]);
59
- const fetchPage = React.useCallback(
60
- async (nextPage, search, append) => {
61
- const ticket = ++reqId.current;
62
- setLoading(true);
63
- try {
64
- const result = await resolvedLoad({ query: search, page: nextPage });
65
- if (ticket !== reqId.current) return;
66
- setLoaded((prev) => append ? [...prev, ...result.options] : result.options);
67
- setHasMore(Boolean(result.hasMore));
68
- setPage(nextPage);
69
- } finally {
70
- if (ticket === reqId.current) setLoading(false);
71
- }
72
- },
73
- [resolvedLoad]
74
- );
75
- React.useEffect(() => {
76
- if (!open) return;
77
- setActiveIndex(0);
78
- void fetchPage(1, debouncedQuery, false);
79
- }, [open, debouncedQuery, fetchPage]);
80
- const grouped = React.useMemo(() => {
81
- const order = [];
82
- const buckets = /* @__PURE__ */ new Map();
83
- for (const option of loaded) {
84
- const key = option.group ?? "";
85
- if (!buckets.has(key)) {
86
- buckets.set(key, []);
87
- order.push(key);
88
- }
89
- buckets.get(key).push(option);
90
- }
91
- let flatIndex = 0;
92
- return order.map((key) => ({
93
- heading: key || void 0,
94
- items: (buckets.get(key) ?? []).map((option) => ({ option, index: flatIndex++ }))
95
- }));
96
- }, [loaded]);
97
- const flatOrdered = React.useMemo(
98
- () => grouped.flatMap((group) => group.items.map((entry) => entry.option)),
99
- [grouped]
100
- );
101
- const resolvedPlaceholder = placeholder ?? t("dataEntry.searchSelect.placeholder");
102
- const currentLabel = value ? picked?.label ?? selectedLabel ?? resolvedPlaceholder : resolvedPlaceholder;
103
- const select = (option) => {
104
- if (option.disabled) return;
105
- setPicked(option);
106
- onValueChange?.(option.value, option);
107
- setOpen(false);
108
- };
109
- const clear = () => {
110
- setPicked(null);
111
- onValueChange?.("", void 0);
112
- setOpen(false);
113
- };
114
- const onScroll = (event) => {
115
- const el = event.currentTarget;
116
- if (el.scrollHeight - el.scrollTop - el.clientHeight < 48 && hasMore && !loading) {
117
- void fetchPage(page + 1, debouncedQuery, true);
118
- }
119
- };
120
- const onKeyDown = (event) => {
121
- if (event.key === "ArrowDown") {
122
- event.preventDefault();
123
- setActiveIndex((i) => Math.min(i + 1, Math.max(flatOrdered.length - 1, 0)));
124
- } else if (event.key === "ArrowUp") {
125
- event.preventDefault();
126
- setActiveIndex((i) => Math.max(i - 1, 0));
127
- } else if (event.key === "Enter" && flatOrdered[activeIndex]) {
128
- event.preventDefault();
129
- select(flatOrdered[activeIndex]);
130
- } else if (event.key === "Escape") {
131
- event.preventDefault();
132
- setOpen(false);
133
- }
134
- };
135
- const optionTestId = (optionValue) => dataTestId ? `${dataTestId}-option-${optionValue}` : void 0;
136
- return /* @__PURE__ */ jsxs(
137
- Popover,
138
- {
139
- open,
140
- onOpenChange: (next) => {
141
- setOpen(next);
142
- if (!next) setQuery("");
143
- },
144
- children: [
145
- /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
146
- Button,
147
- {
148
- id,
149
- type: "button",
150
- variant: "outline",
151
- role: "combobox",
152
- "aria-expanded": open,
153
- disabled,
154
- "data-testid": dataTestId,
155
- className: cn("w-full justify-between font-normal", className),
156
- children: [
157
- /* @__PURE__ */ jsx("span", { className: cn("truncate text-left", !value && "text-muted-foreground"), children: currentLabel }),
158
- /* @__PURE__ */ jsx(ChevronsUpDown, { className: "ml-2 size-4 shrink-0 opacity-50", "aria-hidden": "true" })
159
- ]
160
- }
161
- ) }),
162
- name ? /* @__PURE__ */ jsx("input", { type: "hidden", name, value }) : null,
163
- /* @__PURE__ */ jsx(
164
- PopoverContent,
165
- {
166
- align: "start",
167
- sideOffset: 4,
168
- collisionPadding: 12,
169
- className: "flex max-h-[min(24rem,var(--radix-popover-content-available-height))] w-max max-w-[min(32rem,calc(100vw-1.5rem))] min-w-[var(--radix-popover-trigger-width)] flex-col p-0",
170
- children: /* @__PURE__ */ jsxs(Command, { shouldFilter: false, className: "flex min-h-0 flex-col", children: [
171
- /* @__PURE__ */ jsx("div", { className: "border-border shrink-0 border-b p-2", children: /* @__PURE__ */ jsx(
172
- Input,
173
- {
174
- autoFocus: true,
175
- value: query,
176
- onChange: (event) => setQuery(event.target.value),
177
- onKeyDown,
178
- placeholder: searchPlaceholder ?? t("dataEntry.searchSelect.search")
179
- }
180
- ) }),
181
- /* @__PURE__ */ jsxs(CommandList, { className: "min-h-0 flex-1 overflow-y-auto p-1", onScroll, children: [
182
- clearable && value ? /* @__PURE__ */ jsx(CommandItem, { value: "", "data-testid": optionTestId("none"), onSelect: clear, children: /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: clearLabel ?? t("dataEntry.searchSelect.clear") }) }) : null,
183
- grouped.map((group) => {
184
- const rows = group.items.map(({ option, index }) => /* @__PURE__ */ jsxs(
185
- CommandItem,
186
- {
187
- value: option.value,
188
- "data-testid": optionTestId(option.value),
189
- "aria-selected": activeIndex === index,
190
- disabled: option.disabled,
191
- className: activeIndex === index ? "bg-accent text-accent-foreground" : void 0,
192
- onMouseEnter: () => setActiveIndex(index),
193
- onSelect: () => select(option),
194
- children: [
195
- renderOption ? /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: renderOption(option) }) : /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
196
- /* @__PURE__ */ jsx("span", { className: "truncate text-sm", children: option.label }),
197
- option.sublabel ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground truncate text-xs", children: option.sublabel }) : null
198
- ] }),
199
- value === option.value ? /* @__PURE__ */ jsx(Check, { className: "text-primary size-4 shrink-0", "aria-hidden": "true" }) : null
200
- ]
201
- },
202
- option.value
203
- ));
204
- return group.heading ? /* @__PURE__ */ jsx(CommandGroup, { heading: group.heading, children: rows }, group.heading) : /* @__PURE__ */ jsx(React.Fragment, { children: rows }, "__ungrouped");
205
- }),
206
- loading ? /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground flex items-center gap-2 px-2 py-3 text-sm", children: [
207
- /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin", "aria-hidden": "true" }),
208
- loadingMessage ?? t("dataEntry.searchSelect.loading")
209
- ] }) : null,
210
- !loading && loaded.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-muted-foreground px-2 py-6 text-center text-sm", children: emptyMessage ?? t("dataEntry.searchSelect.empty") }) : null
211
- ] })
212
- ] })
213
- }
214
- )
215
- ]
216
- }
217
- );
218
- }
219
-
220
- export { SearchSelect };
@@ -1,24 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { a as AutocompleteProp } from '../../data-entry.prop-CDkOajPj.js';
3
- import '@radix-ui/react-checkbox';
4
- import '@radix-ui/react-radio-group';
5
- import '@radix-ui/react-slider';
6
- import '@radix-ui/react-switch';
7
- import 'react-day-picker';
8
- import 'react';
9
- import '../../shared.prop-BsNSXeqD.js';
10
- import '../../content.prop-DrV_zDy-.js';
11
- import '../../data.prop-DMYMNl6L.js';
12
- import '../../interaction.prop-DSFizzP6.js';
13
- import '../../layout.prop-CXvl2rVR.js';
14
-
15
- /**
16
- * Searchable combobox over a static list.
17
- *
18
- * @deprecated Prefer {@link SearchSelect} with a static `options` array — it is a strict superset
19
- * (optgroup grouping, sublabels, async `loadOptions`, custom `renderOption`). `Autocomplete` is
20
- * now a thin wrapper kept for backward compatibility.
21
- */
22
- declare function Autocomplete({ options, value, onValueChange, placeholder, searchPlaceholder, emptyMessage, disabled, className, id, }: AutocompleteProp): react_jsx_runtime.JSX.Element;
23
-
24
- export { Autocomplete, AutocompleteProp, AutocompleteProp as AutocompleteProps };
@@ -1,10 +0,0 @@
1
- export { Autocomplete } from '../../chunk-GKXPALFT.js';
2
- import '../../chunk-KDBGFJJI.js';
3
- import '../../chunk-HTEL5DQI.js';
4
- import '../../chunk-VOHTRR5X.js';
5
- import '../../chunk-M4PZNAMV.js';
6
- import '../../chunk-DY5C44UP.js';
7
- import '../../chunk-IBK5D2Q6.js';
8
- import '../../chunk-RLGHEV4A.js';
9
- import '../../chunk-FXFJF4YA.js';
10
- import '../../chunk-U7N2A7A3.js';
@@ -1,22 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
-
3
- type ComboboxOption = {
4
- value: string;
5
- label: string;
6
- };
7
- type ComboboxProps = {
8
- options: ComboboxOption[];
9
- value?: string;
10
- defaultValue?: string;
11
- onValueChange?: (value: string) => void;
12
- placeholder?: string;
13
- searchPlaceholder?: string;
14
- emptyText?: string;
15
- disabled?: boolean;
16
- name?: string;
17
- id?: string;
18
- className?: string;
19
- };
20
- declare const Combobox: ({ options, value: controlledValue, defaultValue, onValueChange, placeholder, searchPlaceholder, emptyText, disabled, name, id, className, }: ComboboxProps) => react_jsx_runtime.JSX.Element;
21
-
22
- export { Combobox, type ComboboxOption, type ComboboxProps };
@@ -1,6 +0,0 @@
1
- export { Combobox } from '../../chunk-JKHWLPM5.js';
2
- import '../../chunk-HTEL5DQI.js';
3
- import '../../chunk-M4PZNAMV.js';
4
- import '../../chunk-DY5C44UP.js';
5
- import '../../chunk-IBK5D2Q6.js';
6
- import '../../chunk-U7N2A7A3.js';
@@ -1,14 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { d as PageHeaderProp } from './layout.prop-JE2TcRyL.js';
3
- import { f as ToolbarProp, e as ToolbarGroupProp } from './navigation.prop-8DgElO0c.js';
4
-
5
- declare function PageHeader({ title, description, breadcrumb, actions, linkComponent: LinkComponent, className, }: PageHeaderProp): react_jsx_runtime.JSX.Element;
6
-
7
- declare function Toolbar({ onClear, hasActiveFilters, className, children }: ToolbarProp): react_jsx_runtime.JSX.Element;
8
- declare function ToolbarGroup({ label, className, children }: ToolbarGroupProp): react_jsx_runtime.JSX.Element;
9
- /** @deprecated Use Toolbar. */
10
- declare const FilterBar: typeof Toolbar;
11
- /** @deprecated Use ToolbarGroup. */
12
- declare const FilterGroup: typeof ToolbarGroup;
13
-
14
- export { FilterBar as F, PageHeader as P, Toolbar as T, FilterGroup as a, ToolbarGroup as b };
File without changes