@itilite/lumina-ui 1.1.5 → 1.1.6

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 (152) hide show
  1. package/dist/atom/LoadingSpinner/LoadingSpinner.d.mts +19 -0
  2. package/dist/atom/LoadingSpinner/LoadingSpinner.d.ts +19 -0
  3. package/dist/atom/LoadingSpinner/LoadingSpinner.js +90 -0
  4. package/dist/atom/LoadingSpinner/LoadingSpinner.mjs +9 -0
  5. package/dist/atom/RangePicker/RangePicker.js +265 -136
  6. package/dist/atom/RangePicker/RangePicker.mjs +4 -2
  7. package/dist/atom/Select/Select.d.mts +6 -3
  8. package/dist/atom/Select/Select.d.ts +6 -3
  9. package/dist/atom/Select/Select.js +213 -91
  10. package/dist/atom/Select/Select.mjs +3 -1
  11. package/dist/chunk-22VF7AVT.mjs +618 -0
  12. package/dist/chunk-2BNAAOBU.mjs +670 -0
  13. package/dist/chunk-2IMRLK6M.mjs +44 -0
  14. package/dist/chunk-2JIINZEK.mjs +618 -0
  15. package/dist/chunk-2LBFKQDZ.mjs +660 -0
  16. package/dist/chunk-2ZJBF5C4.mjs +618 -0
  17. package/dist/chunk-3IMCN4K3.mjs +670 -0
  18. package/dist/chunk-3KBQQCET.mjs +674 -0
  19. package/dist/chunk-3KUHXNFH.mjs +678 -0
  20. package/dist/chunk-3PPNOIXN.mjs +618 -0
  21. package/dist/chunk-3XFY3TXJ.mjs +611 -0
  22. package/dist/chunk-3XW7HS5W.mjs +618 -0
  23. package/dist/chunk-447HZYZ4.mjs +612 -0
  24. package/dist/chunk-46F3B4U6.mjs +618 -0
  25. package/dist/chunk-4K5RZHL4.mjs +618 -0
  26. package/dist/chunk-4QHFP4YD.mjs +666 -0
  27. package/dist/chunk-4TFX4DHY.mjs +702 -0
  28. package/dist/chunk-4TWO6JES.mjs +666 -0
  29. package/dist/chunk-4UQVJ3ZU.mjs +666 -0
  30. package/dist/chunk-5247J65D.mjs +670 -0
  31. package/dist/chunk-66H5WSEJ.mjs +618 -0
  32. package/dist/chunk-6OGEXG5U.mjs +618 -0
  33. package/dist/chunk-6ROQXYVN.mjs +672 -0
  34. package/dist/chunk-6WNI6X5Q.mjs +618 -0
  35. package/dist/chunk-72PPCN6D.mjs +675 -0
  36. package/dist/chunk-74EGXFNN.mjs +618 -0
  37. package/dist/chunk-77NCDGJA.mjs +707 -0
  38. package/dist/chunk-7NGBIPZT.mjs +618 -0
  39. package/dist/chunk-7NM4FNMQ.mjs +666 -0
  40. package/dist/chunk-7YBBSVUA.mjs +672 -0
  41. package/dist/chunk-7Z52UP7P.mjs +618 -0
  42. package/dist/chunk-B3LDL3KD.mjs +670 -0
  43. package/dist/chunk-B65LGQ47.mjs +666 -0
  44. package/dist/chunk-B6MTRO54.mjs +618 -0
  45. package/dist/chunk-BJBP5XYB.mjs +618 -0
  46. package/dist/chunk-BLLSWPCC.mjs +618 -0
  47. package/dist/chunk-BOYB7REJ.mjs +670 -0
  48. package/dist/chunk-BP2D64XI.mjs +618 -0
  49. package/dist/chunk-BRT5IPGQ.mjs +618 -0
  50. package/dist/chunk-C2J3VBFZ.mjs +670 -0
  51. package/dist/chunk-CDOR7GQP.mjs +618 -0
  52. package/dist/chunk-CI2RMA4V.mjs +612 -0
  53. package/dist/chunk-CNUIZOQJ.mjs +669 -0
  54. package/dist/chunk-CPBXPEST.mjs +672 -0
  55. package/dist/chunk-CVOLXLMU.mjs +618 -0
  56. package/dist/chunk-CWUCNC36.mjs +666 -0
  57. package/dist/chunk-CZBGN6GS.mjs +612 -0
  58. package/dist/chunk-D3APB62N.mjs +618 -0
  59. package/dist/chunk-D7TWXVL2.mjs +674 -0
  60. package/dist/chunk-DAZ53AD7.mjs +671 -0
  61. package/dist/chunk-DBY5U6IU.mjs +618 -0
  62. package/dist/chunk-DXTVU4M5.mjs +618 -0
  63. package/dist/chunk-DZBTD6QK.mjs +666 -0
  64. package/dist/chunk-EAK2IMM4.mjs +37 -0
  65. package/dist/chunk-EQT2Q2LW.mjs +610 -0
  66. package/dist/chunk-EWMCELQV.mjs +670 -0
  67. package/dist/chunk-EYKWBEHX.mjs +612 -0
  68. package/dist/chunk-FHLCFUP6.mjs +666 -0
  69. package/dist/chunk-FMPFLQZV.mjs +670 -0
  70. package/dist/chunk-G25YXZ74.mjs +618 -0
  71. package/dist/chunk-GSG6ZC3R.mjs +37 -0
  72. package/dist/chunk-H3MQUFTJ.mjs +618 -0
  73. package/dist/chunk-HKZRLVBX.mjs +618 -0
  74. package/dist/chunk-HQALJGVT.mjs +618 -0
  75. package/dist/chunk-I5GBZ3UX.mjs +676 -0
  76. package/dist/chunk-IV4V55OA.mjs +672 -0
  77. package/dist/chunk-J2RAFKAD.mjs +618 -0
  78. package/dist/chunk-JL34UFI7.mjs +670 -0
  79. package/dist/chunk-JTKSGGQM.mjs +611 -0
  80. package/dist/chunk-JZC2RRDH.mjs +618 -0
  81. package/dist/chunk-K3Y7VKT6.mjs +670 -0
  82. package/dist/chunk-KEVXNUFG.mjs +672 -0
  83. package/dist/chunk-KRYAP7NG.mjs +670 -0
  84. package/dist/chunk-KU655POK.mjs +657 -0
  85. package/dist/chunk-L55SLVNX.mjs +618 -0
  86. package/dist/chunk-LCRYOZEV.mjs +618 -0
  87. package/dist/chunk-LH7PP6V2.mjs +618 -0
  88. package/dist/chunk-LJMMYKE2.mjs +618 -0
  89. package/dist/chunk-LK5TROLL.mjs +666 -0
  90. package/dist/chunk-MDR7DAKM.mjs +618 -0
  91. package/dist/chunk-MJZLCWZ5.mjs +666 -0
  92. package/dist/chunk-MKZTEJLS.mjs +612 -0
  93. package/dist/chunk-MQCOQHHP.mjs +618 -0
  94. package/dist/chunk-MSM4KUBM.mjs +618 -0
  95. package/dist/chunk-MTIUER63.mjs +676 -0
  96. package/dist/chunk-NBLV3UX5.mjs +618 -0
  97. package/dist/chunk-NLADSOJS.mjs +618 -0
  98. package/dist/chunk-NPMTWR3Y.mjs +618 -0
  99. package/dist/chunk-NQ6GKEO7.mjs +670 -0
  100. package/dist/chunk-NZSFYNUK.mjs +618 -0
  101. package/dist/chunk-OCNF4O5U.mjs +612 -0
  102. package/dist/chunk-OCW5QSWA.mjs +618 -0
  103. package/dist/chunk-OQF7JZFS.mjs +670 -0
  104. package/dist/chunk-OT675HGC.mjs +670 -0
  105. package/dist/chunk-P47TCYKN.mjs +618 -0
  106. package/dist/chunk-P7TOGXPI.mjs +672 -0
  107. package/dist/chunk-PCAXXEEQ.mjs +618 -0
  108. package/dist/chunk-PDHMG7OZ.mjs +672 -0
  109. package/dist/chunk-PFGVOZGM.mjs +618 -0
  110. package/dist/chunk-PQSSDK3E.mjs +618 -0
  111. package/dist/chunk-PST7W3NG.mjs +618 -0
  112. package/dist/chunk-QGPBZ2YV.mjs +664 -0
  113. package/dist/chunk-QKTMWS4J.mjs +43 -0
  114. package/dist/chunk-QOPCJITC.mjs +618 -0
  115. package/dist/chunk-QSE52CRC.mjs +618 -0
  116. package/dist/chunk-QTP2QMPL.mjs +669 -0
  117. package/dist/chunk-R47XX6IW.mjs +611 -0
  118. package/dist/chunk-RL6AEU6E.mjs +612 -0
  119. package/dist/chunk-T7T4HCHH.mjs +618 -0
  120. package/dist/chunk-TED2WCDG.mjs +618 -0
  121. package/dist/chunk-TJLIMMMB.mjs +612 -0
  122. package/dist/chunk-TNOJDLON.mjs +611 -0
  123. package/dist/chunk-TOR67IHH.mjs +672 -0
  124. package/dist/chunk-TOV7NVKM.mjs +618 -0
  125. package/dist/chunk-TSYMIRRN.mjs +618 -0
  126. package/dist/chunk-TTSRI4V7.mjs +708 -0
  127. package/dist/chunk-UBS3DTE5.mjs +672 -0
  128. package/dist/chunk-UBW6RYVF.mjs +670 -0
  129. package/dist/chunk-UJNUFKR5.mjs +43 -0
  130. package/dist/chunk-VAZZJOSJ.mjs +618 -0
  131. package/dist/chunk-VCWXOX2B.mjs +618 -0
  132. package/dist/chunk-VHCLEOHZ.mjs +618 -0
  133. package/dist/chunk-VTZSCGME.mjs +666 -0
  134. package/dist/chunk-W33KZ2XR.mjs +618 -0
  135. package/dist/chunk-WOVMTYDV.mjs +612 -0
  136. package/dist/chunk-WR3USBWK.mjs +672 -0
  137. package/dist/chunk-WXYQARQ6.mjs +618 -0
  138. package/dist/chunk-Y6XKW4NG.mjs +618 -0
  139. package/dist/chunk-YQSNJFZE.mjs +618 -0
  140. package/dist/chunk-Z6VG6AG7.mjs +678 -0
  141. package/dist/chunk-ZAPKQ4C3.mjs +678 -0
  142. package/dist/chunk-ZCWDQNHL.mjs +618 -0
  143. package/dist/chunk-ZF5JBNCI.mjs +618 -0
  144. package/dist/chunk-ZN7BHWOF.mjs +672 -0
  145. package/dist/chunk-ZUQJKA5J.mjs +666 -0
  146. package/dist/chunk-ZWHWIGYQ.mjs +618 -0
  147. package/dist/index.d.mts +2 -0
  148. package/dist/index.d.ts +2 -0
  149. package/dist/index.js +227 -136
  150. package/dist/index.mjs +18 -14
  151. package/dist/styles.css +128 -87
  152. package/package.json +3 -2
@@ -0,0 +1,666 @@
1
+ import {
2
+ Tooltip_default
3
+ } from "./chunk-MLCMZRUC.mjs";
4
+ import {
5
+ LoadingSpinner_default
6
+ } from "./chunk-EAK2IMM4.mjs";
7
+ import {
8
+ __objRest,
9
+ __spreadProps,
10
+ __spreadValues
11
+ } from "./chunk-FWCSY2DS.mjs";
12
+
13
+ // src/atom/Select/Select.tsx
14
+ import { memo as memo3, useCallback, useEffect, useMemo, useRef, useState } from "react";
15
+ import clsx from "clsx";
16
+
17
+ // src/icons/Chevron.tsx
18
+ import * as React from "react";
19
+ import { jsx } from "react/jsx-runtime";
20
+ var Chevron = React.memo(
21
+ (_a) => {
22
+ var _b = _a, { size = 16, color = "#6b7280", className } = _b, rest = __objRest(_b, ["size", "color", "className"]);
23
+ return /* @__PURE__ */ jsx(
24
+ "svg",
25
+ __spreadProps(__spreadValues({
26
+ xmlns: "http://www.w3.org/2000/svg",
27
+ width: size,
28
+ height: size,
29
+ fill: "none",
30
+ viewBox: "0 0 16 16",
31
+ className
32
+ }, rest), {
33
+ children: /* @__PURE__ */ jsx(
34
+ "path",
35
+ {
36
+ fill: color,
37
+ d: "M11.78 6.22a.75.75 0 00-1.06 0L8 8.94 5.28 6.22a.75.75 0 00-1.06 1.06l3.25 3.25a.75.75 0 001.06 0l3.25-3.25a.75.75 0 000-1.06z"
38
+ }
39
+ )
40
+ })
41
+ );
42
+ }
43
+ );
44
+ Chevron.displayName = "Chevron";
45
+
46
+ // src/icons/CrossV2.tsx
47
+ import * as React2 from "react";
48
+ import { jsx as jsx2 } from "react/jsx-runtime";
49
+ var CrossV2 = React2.memo(
50
+ (_a) => {
51
+ var _b = _a, { size = 16, color = "#111827", className } = _b, rest = __objRest(_b, ["size", "color", "className"]);
52
+ return /* @__PURE__ */ jsx2(
53
+ "svg",
54
+ __spreadProps(__spreadValues({
55
+ xmlns: "http://www.w3.org/2000/svg",
56
+ width: size,
57
+ height: size,
58
+ fill: "none",
59
+ viewBox: "0 0 16 16",
60
+ className
61
+ }, rest), {
62
+ children: /* @__PURE__ */ jsx2(
63
+ "path",
64
+ {
65
+ fill: color,
66
+ fillRule: "evenodd",
67
+ d: "M4.293 4.293a1 1 0 011.414 0L8 6.586l2.293-2.293a1 1 0 111.414 1.414L9.414 8l2.293 2.293a1 1 0 01-1.414 1.414L8 9.414l-2.293 2.293a1 1 0 01-1.414-1.414L6.586 8 4.293 5.707a1 1 0 010-1.414z",
68
+ clipRule: "evenodd"
69
+ }
70
+ )
71
+ })
72
+ );
73
+ }
74
+ );
75
+ CrossV2.displayName = "CrossV2";
76
+
77
+ // src/icons/Lock.tsx
78
+ import React3 from "react";
79
+ import { jsx as jsx3 } from "react/jsx-runtime";
80
+ var Lock = React3.memo((_a) => {
81
+ var _b = _a, { size = 16, color = "#000" } = _b, rest = __objRest(_b, ["size", "color"]);
82
+ return /* @__PURE__ */ jsx3(
83
+ "svg",
84
+ __spreadProps(__spreadValues({
85
+ xmlns: "http://www.w3.org/2000/svg",
86
+ width: size,
87
+ height: size,
88
+ fill: "none",
89
+ viewBox: "0 0 16 16"
90
+ }, rest), {
91
+ children: /* @__PURE__ */ jsx3(
92
+ "path",
93
+ {
94
+ fill: color,
95
+ d: "M9 9a1 1 0 11-2 0 1 1 0 012 0zM5 4h-.5A2.5 2.5 0 002 6.5v5A2.5 2.5 0 004.5 14h7a2.5 2.5 0 002.5-2.5v-5A2.5 2.5 0 0011.5 4H11v-.5a3 3 0 00-6 0V4zm1-.5a2 2 0 114 0V4H6v-.5zM11.5 5A1.5 1.5 0 0113 6.5v5a1.5 1.5 0 01-1.5 1.5h-7A1.5 1.5 0 013 11.5v-5A1.5 1.5 0 014.5 5h7z"
96
+ }
97
+ )
98
+ })
99
+ );
100
+ });
101
+
102
+ // src/atom/Select/Select.tsx
103
+ import { jsx as jsx4, jsxs } from "react/jsx-runtime";
104
+ var Select = ({
105
+ label,
106
+ mandatory = false,
107
+ error = false,
108
+ options = [],
109
+ valueSelected = "",
110
+ // Keep for backward compatibility
111
+ value: _valueProp,
112
+ // Rename to avoid potential conflicts with native value attribute
113
+ onChange,
114
+ onSearch,
115
+ isLoading = false,
116
+ disabled = false,
117
+ disabledTooltip = "",
118
+ className = "",
119
+ dropdownClassName = "",
120
+ optionClassName = "",
121
+ style = {},
122
+ showDisplayValue = false,
123
+ // New prop to show displayValue instead of label
124
+ allowClear = true,
125
+ enableSearch = true,
126
+ doubleCharSearch = false,
127
+ id,
128
+ name,
129
+ tabIndex,
130
+ // Add tabIndex prop
131
+ // Additional styling props
132
+ size = "default",
133
+ // 'small', 'default', 'large'
134
+ variant = "default",
135
+ // 'default', 'filled', 'outlined'
136
+ wrapperClassName = "",
137
+ inputClassName = "",
138
+ // Custom class for input element specifically
139
+ labelClassName = "",
140
+ // Custom class for label element specifically
141
+ height = "tw-h-12",
142
+ // Custom height
143
+ experience = "business"
144
+ }) => {
145
+ const normalizeValue = useCallback(
146
+ (val) => {
147
+ if (val === null || val === void 0) return "";
148
+ return String(val);
149
+ },
150
+ []
151
+ );
152
+ const validatedOptions = useMemo(() => {
153
+ if (!Array.isArray(options)) return [];
154
+ return options.filter(
155
+ (opt) => opt && typeof opt === "object" && opt.value !== void 0 && opt.value !== null && opt.label !== void 0
156
+ );
157
+ }, [options]);
158
+ const [isOpen, setIsOpen] = useState(false);
159
+ const [isFocused, setIsFocused] = useState(false);
160
+ const [searchTerm, setSearchTerm] = useState("");
161
+ const [isHovering, setIsHovering] = useState(false);
162
+ const [highlightedIndex, setHighlightedIndex] = useState(-1);
163
+ const [selectedValue, setSelectedValue] = useState(() => {
164
+ const initialValue = valueSelected;
165
+ if (initialValue === null || initialValue === void 0) return "";
166
+ return String(initialValue);
167
+ });
168
+ const inputRef = useRef(null);
169
+ const inputValueRef = useRef("");
170
+ const dropdownRef = useRef(null);
171
+ const optionRefs = useRef([]);
172
+ const optionListRef = useRef(null);
173
+ const blurTimeoutRef = useRef(null);
174
+ const hoverTimeoutRef = useRef(null);
175
+ const isActive = isFocused || Boolean(selectedValue) || Boolean(valueSelected) || Boolean(searchTerm);
176
+ const sizeClasses = useMemo(() => {
177
+ switch (size) {
178
+ case "small":
179
+ return {
180
+ input: "tw-h-8 tw-px-3 tw-typography-body2",
181
+ padding: label ? "tw-pt-4 tw-pb-1" : "tw-py-2",
182
+ labelActive: "tw-top-0 tw-typography-caption4",
183
+ labelInactive: "tw-top-2 tw-typography-caption3"
184
+ };
185
+ case "medium":
186
+ return {
187
+ input: "tw-h-10 tw-px-4 tw-typography-body2",
188
+ padding: label ? "tw-pt-4 tw-pb-1" : "tw-py-2",
189
+ labelActive: "tw-top-1 tw-typography-caption3",
190
+ labelInactive: "tw-top-2.5 tw-typography-body2"
191
+ };
192
+ case "large":
193
+ return {
194
+ input: "tw-h-16 tw-px-5 tw-typography-bodyLarge",
195
+ padding: label ? "tw-pt-8 tw-pb-4" : "tw-py-5",
196
+ labelActive: "tw-top-1 tw-typography-caption2",
197
+ labelInactive: "tw-top-5 tw-typography-body1"
198
+ };
199
+ default:
200
+ return {
201
+ input: height + " tw-px-4 tw-typography-bodyLarge",
202
+ padding: label ? "tw-pt-6 tw-pb-3" : "tw-py-3",
203
+ labelActive: "tw-top-1 tw-typography-caption3",
204
+ labelInactive: "tw-top-3.5 tw-typography-body2"
205
+ };
206
+ }
207
+ }, [size, label, height]);
208
+ const variantClasses = useMemo(() => {
209
+ switch (variant) {
210
+ case "filled":
211
+ return "tw-bg-gray-50 tw-border-transparent";
212
+ case "outlined":
213
+ return "tw-bg-transparent tw-border-2";
214
+ default:
215
+ return " tw-border";
216
+ }
217
+ }, [variant]);
218
+ const handleBlur = useCallback(() => {
219
+ blurTimeoutRef.current = setTimeout(() => {
220
+ setIsOpen(false);
221
+ setSearchTerm("");
222
+ setHighlightedIndex(-1);
223
+ blurTimeoutRef.current = null;
224
+ setIsFocused(false);
225
+ }, 150);
226
+ }, []);
227
+ const handleSearchChange = useCallback(
228
+ (e) => {
229
+ var _a;
230
+ const searchValue = doubleCharSearch ? e.target.value.slice(0, 2) || "" : e.target.value;
231
+ if (doubleCharSearch) {
232
+ setSearchTerm(searchValue);
233
+ } else {
234
+ setSearchTerm(searchValue);
235
+ }
236
+ setIsOpen(true);
237
+ setHighlightedIndex(-1);
238
+ if (onSearch && typeof onSearch === "function") {
239
+ onSearch(searchValue);
240
+ }
241
+ (_a = optionListRef == null ? void 0 : optionListRef.current) == null ? void 0 : _a.scrollTo({
242
+ top: 0,
243
+ behavior: "smooth"
244
+ });
245
+ },
246
+ [doubleCharSearch, onSearch]
247
+ );
248
+ const handleOptionSelect = useCallback(
249
+ (option) => {
250
+ var _a;
251
+ if (blurTimeoutRef.current) {
252
+ clearTimeout(blurTimeoutRef.current);
253
+ blurTimeoutRef.current = null;
254
+ }
255
+ inputValueRef.current = option.label;
256
+ const normalizedValue = normalizeValue(option.value);
257
+ setSelectedValue(normalizedValue);
258
+ setSearchTerm("");
259
+ setIsOpen(false);
260
+ if (enableSearch) {
261
+ setIsFocused(false);
262
+ }
263
+ setIsHovering(false);
264
+ if (onChange) onChange(option.value);
265
+ if (enableSearch) (_a = inputRef.current) == null ? void 0 : _a.blur();
266
+ },
267
+ [normalizeValue, onChange, enableSearch]
268
+ );
269
+ const handleClear = useCallback(
270
+ (e) => {
271
+ var _a;
272
+ inputValueRef.current = "";
273
+ e.stopPropagation();
274
+ e.preventDefault();
275
+ setSelectedValue("");
276
+ setSearchTerm("");
277
+ if (enableSearch) {
278
+ setIsOpen(true);
279
+ setIsFocused(true);
280
+ (_a = inputRef.current) == null ? void 0 : _a.focus();
281
+ } else {
282
+ setIsOpen(false);
283
+ setIsFocused(false);
284
+ }
285
+ if (onChange) onChange(null);
286
+ },
287
+ [onChange, enableSearch]
288
+ );
289
+ useEffect(() => {
290
+ if (!validatedOptions.length) {
291
+ setSelectedValue("");
292
+ setSearchTerm("");
293
+ inputValueRef.current = "";
294
+ }
295
+ }, [validatedOptions.length]);
296
+ useEffect(() => {
297
+ const externalValue = _valueProp !== void 0 ? _valueProp : valueSelected;
298
+ const newValue = normalizeValue(externalValue);
299
+ setSelectedValue((prevValue) => {
300
+ const prevNormalized = normalizeValue(prevValue);
301
+ return prevNormalized !== newValue ? newValue : prevValue;
302
+ });
303
+ }, [valueSelected, _valueProp, normalizeValue]);
304
+ useEffect(() => {
305
+ const handleClickOutside = (event) => {
306
+ if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
307
+ if (blurTimeoutRef.current) {
308
+ clearTimeout(blurTimeoutRef.current);
309
+ blurTimeoutRef.current = null;
310
+ }
311
+ setIsOpen(false);
312
+ setIsFocused(false);
313
+ setSearchTerm("");
314
+ setHighlightedIndex(-1);
315
+ }
316
+ };
317
+ document.addEventListener("mousedown", handleClickOutside);
318
+ return () => {
319
+ document.removeEventListener("mousedown", handleClickOutside);
320
+ if (blurTimeoutRef.current) {
321
+ clearTimeout(blurTimeoutRef.current);
322
+ }
323
+ if (hoverTimeoutRef.current) {
324
+ clearTimeout(hoverTimeoutRef.current);
325
+ }
326
+ };
327
+ }, []);
328
+ const getDisplayValue = useCallback(() => {
329
+ if (selectedValue && (validatedOptions == null ? void 0 : validatedOptions.length) > 0) {
330
+ const selected = validatedOptions.find(
331
+ (opt) => normalizeValue(opt.value) === normalizeValue(selectedValue)
332
+ );
333
+ if (selected) {
334
+ return showDisplayValue && selected.displayValue ? selected.displayValue : selected.label;
335
+ }
336
+ }
337
+ if (selectedValue && (!validatedOptions || validatedOptions.length === 0)) {
338
+ return selectedValue;
339
+ }
340
+ return "";
341
+ }, [selectedValue, validatedOptions, showDisplayValue, normalizeValue]);
342
+ const filteredOptions = useMemo(() => {
343
+ var _a;
344
+ if (!enableSearch) {
345
+ return validatedOptions;
346
+ }
347
+ (_a = dropdownRef.current) == null ? void 0 : _a.scrollTo(0, 0);
348
+ const updatedFilteredOptions = validatedOptions.filter((option) => {
349
+ var _a2;
350
+ return (_a2 = option == null ? void 0 : option.label) == null ? void 0 : _a2.toLowerCase().includes(searchTerm == null ? void 0 : searchTerm.toLowerCase());
351
+ });
352
+ return updatedFilteredOptions;
353
+ }, [validatedOptions, searchTerm, enableSearch]);
354
+ const getSelectedOptionIndex = useCallback(() => {
355
+ if (!selectedValue || !filteredOptions.length) {
356
+ return 0;
357
+ }
358
+ const index = filteredOptions.findIndex(
359
+ (option) => normalizeValue(option.value) === normalizeValue(selectedValue)
360
+ );
361
+ return index >= 0 ? index : 0;
362
+ }, [selectedValue, filteredOptions, normalizeValue]);
363
+ const handleInputInteraction = useCallback(
364
+ (_e) => {
365
+ var _a;
366
+ if (blurTimeoutRef.current) {
367
+ clearTimeout(blurTimeoutRef.current);
368
+ blurTimeoutRef.current = null;
369
+ }
370
+ if (isOpen) {
371
+ setIsOpen(false);
372
+ setIsFocused(false);
373
+ setSearchTerm("");
374
+ setHighlightedIndex(-1);
375
+ (_a = inputRef.current) == null ? void 0 : _a.blur();
376
+ return;
377
+ }
378
+ setIsFocused(true);
379
+ setIsOpen(true);
380
+ setHighlightedIndex(getSelectedOptionIndex());
381
+ if (inputRef.current) {
382
+ inputRef.current.focus();
383
+ }
384
+ },
385
+ [isOpen, getSelectedOptionIndex]
386
+ );
387
+ const handleKeyDown = useCallback(
388
+ (e) => {
389
+ var _a;
390
+ if (!isOpen) return;
391
+ switch (e.key) {
392
+ case "ArrowDown":
393
+ e.preventDefault();
394
+ setHighlightedIndex((prev) => {
395
+ const nextIndex = prev < filteredOptions.length - 1 ? prev + 1 : prev;
396
+ return nextIndex;
397
+ });
398
+ break;
399
+ case "ArrowUp":
400
+ e.preventDefault();
401
+ setHighlightedIndex((prev) => {
402
+ const nextIndex = prev > 0 ? prev - 1 : prev;
403
+ return nextIndex;
404
+ });
405
+ break;
406
+ case "Enter":
407
+ e.preventDefault();
408
+ if (highlightedIndex >= 0 && filteredOptions[highlightedIndex]) {
409
+ handleOptionSelect(filteredOptions[highlightedIndex]);
410
+ }
411
+ break;
412
+ case "Escape":
413
+ e.preventDefault();
414
+ setIsOpen(false);
415
+ setIsFocused(false);
416
+ setSearchTerm("");
417
+ setHighlightedIndex(-1);
418
+ (_a = inputRef.current) == null ? void 0 : _a.blur();
419
+ break;
420
+ default:
421
+ break;
422
+ }
423
+ },
424
+ [isOpen, highlightedIndex, filteredOptions, handleOptionSelect]
425
+ );
426
+ useEffect(() => {
427
+ if (highlightedIndex >= 0 && optionRefs.current[highlightedIndex]) {
428
+ optionRefs.current[highlightedIndex].scrollIntoView({
429
+ block: "nearest",
430
+ behavior: "smooth"
431
+ });
432
+ }
433
+ }, [highlightedIndex]);
434
+ useEffect(() => {
435
+ optionRefs.current = [];
436
+ }, [filteredOptions]);
437
+ const handleMouseEnter = useCallback(() => {
438
+ if (hoverTimeoutRef.current) {
439
+ clearTimeout(hoverTimeoutRef.current);
440
+ }
441
+ if (!isHovering) {
442
+ setIsHovering(true);
443
+ }
444
+ }, [isHovering]);
445
+ const handleMouseLeave = useCallback(() => {
446
+ hoverTimeoutRef.current = setTimeout(() => {
447
+ setIsHovering(false);
448
+ }, 50);
449
+ }, []);
450
+ const handleChevronClick = useCallback(
451
+ (e) => {
452
+ var _a;
453
+ e.preventDefault();
454
+ if (blurTimeoutRef.current) {
455
+ clearTimeout(blurTimeoutRef.current);
456
+ blurTimeoutRef.current = null;
457
+ }
458
+ if (isOpen) {
459
+ setIsOpen(false);
460
+ setIsFocused(false);
461
+ setSearchTerm("");
462
+ setHighlightedIndex(-1);
463
+ (_a = inputRef.current) == null ? void 0 : _a.blur();
464
+ } else {
465
+ if (inputRef.current) {
466
+ inputRef.current.focus();
467
+ }
468
+ handleInputInteraction();
469
+ }
470
+ },
471
+ [isOpen, handleInputInteraction]
472
+ );
473
+ return /* @__PURE__ */ jsxs(
474
+ "div",
475
+ {
476
+ style,
477
+ className: clsx("tw-relative tw-w-full", wrapperClassName, {
478
+ "tw-cursor-not-allowed": disabled
479
+ }),
480
+ ref: dropdownRef,
481
+ onMouseEnter: handleMouseEnter,
482
+ onMouseLeave: handleMouseLeave,
483
+ children: [
484
+ /* @__PURE__ */ jsxs("div", { className: "tw-relative", children: [
485
+ /* @__PURE__ */ jsx4(
486
+ "input",
487
+ {
488
+ ref: inputRef,
489
+ type: "text",
490
+ id,
491
+ name,
492
+ tabIndex,
493
+ autoComplete: "off",
494
+ autoCorrect: "off",
495
+ autoCapitalize: "off",
496
+ spellCheck: "false",
497
+ value: isFocused && enableSearch ? searchTerm : getDisplayValue(),
498
+ onChange: enableSearch ? handleSearchChange : void 0,
499
+ onClick: handleInputInteraction,
500
+ onKeyDown: handleKeyDown,
501
+ className: clsx(
502
+ "tw-w-full tw-rounded-xl tw-outline-none tw-transition-all tw-duration-200 tw-cursor-pointer tw-border-solid tw-text-color-text-default",
503
+ sizeClasses.input,
504
+ sizeClasses.padding,
505
+ variantClasses,
506
+ {
507
+ "tw-bg-white": valueSelected || getDisplayValue() || isFocused,
508
+ "tw-bg-color-gray-5": !valueSelected || !getDisplayValue(),
509
+ "!tw-bg-[#F8F7F6] tw-cursor-not-allowed tw-pointer-events-none": disabled
510
+ },
511
+ // Conditional padding based on label presence
512
+ !label && "tw-flex tw-items-center",
513
+ {
514
+ "!tw-border-color-primary": isFocused && experience === "business"
515
+ },
516
+ {
517
+ "!tw-border-[#804D7B]": isFocused && experience === "personal"
518
+ },
519
+ error ? "!tw-border-color-text-critical " : "tw-border-[#EBE3DD] hover:tw-border-[#C5B7AC]",
520
+ // Add focus state styling
521
+ "focus:tw-shadow-sm focus:tw-ring-offset-1",
522
+ className,
523
+ inputClassName
524
+ // Put inputClassName last so it can override default classes
525
+ ),
526
+ readOnly: !isFocused || !enableSearch
527
+ }
528
+ ),
529
+ label && /* @__PURE__ */ jsxs(
530
+ "label",
531
+ {
532
+ htmlFor: id,
533
+ className: clsx(
534
+ "tw-absolute tw-left-[18px] tw-pointer-events-none tw-transition-all tw-duration-200 tw-ease-out tw-text-gray-500",
535
+ isActive ? sizeClasses.labelActive : sizeClasses.labelInactive,
536
+ error && "tw-text-color-text-critical",
537
+ labelClassName
538
+ ),
539
+ children: [
540
+ label,
541
+ mandatory && /* @__PURE__ */ jsx4("span", { className: "tw-text-color-text-critical tw-ml-1", children: "*" })
542
+ ]
543
+ }
544
+ ),
545
+ /* @__PURE__ */ jsxs(
546
+ "div",
547
+ {
548
+ className: clsx(
549
+ "tw-absolute tw-right-3 tw-top-1/2 tw--translate-y-1/2 tw-flex tw-items-center",
550
+ {
551
+ "!tw-right-[5px]": doubleCharSearch && !(isHovering && selectedValue && allowClear)
552
+ }
553
+ ),
554
+ children: [
555
+ disabled && /* @__PURE__ */ jsx4("div", { className: "tw-absolute tw-right-0 -tw-top-2", children: /* @__PURE__ */ jsx4(Tooltip_default, { title: disabledTooltip, children: /* @__PURE__ */ jsx4(Lock, { size: 16 }) }) }),
556
+ isLoading ? /* @__PURE__ */ jsx4("div", { children: /* @__PURE__ */ jsx4(LoadingSpinner_default, { size: "xs" }) }) : /* @__PURE__ */ jsx4(
557
+ "div",
558
+ {
559
+ className: clsx(
560
+ "tw-transition-all tw-duration-200 tw-cursor-pointer tw-flex tw-items-center",
561
+ // Only rotate chevron when open and not showing clear icon
562
+ isOpen && !(isHovering && selectedValue && allowClear) && "-tw-rotate-180"
563
+ ),
564
+ onMouseDown: (e) => {
565
+ if (isHovering && selectedValue && allowClear) {
566
+ handleClear(e);
567
+ } else {
568
+ handleChevronClick(e);
569
+ }
570
+ },
571
+ children: disabled ? null : isHovering && selectedValue && allowClear ? /* @__PURE__ */ jsx4(CrossV2, { color: "#111827", className: "tw-mr-1" }) : /* @__PURE__ */ jsx4(
572
+ Chevron,
573
+ {
574
+ className: clsx("tw-text-gray-400"),
575
+ color: "#6B7280"
576
+ }
577
+ )
578
+ }
579
+ )
580
+ ]
581
+ }
582
+ )
583
+ ] }),
584
+ isOpen && /* @__PURE__ */ jsx4(
585
+ "div",
586
+ {
587
+ className: clsx(
588
+ "tw-absolute tw-z-[100] tw-w-full tw-mt-0 tw-bg-white tw-border tw-border-[#ebe3dd] tw-border-solid tw-rounded-xl tw-shadow-lg tw-overflow-y-auto tw-py-1",
589
+ { "tw-max-h-60": !doubleCharSearch },
590
+ { "tw-max-h-44": doubleCharSearch },
591
+ dropdownClassName
592
+ ),
593
+ ref: optionListRef,
594
+ children: filteredOptions.length > 0 ? filteredOptions.map((option, index) => /* @__PURE__ */ jsx4(
595
+ "div",
596
+ {
597
+ ref: (el) => optionRefs.current[index] = el,
598
+ onClick: () => handleOptionSelect(option),
599
+ onMouseEnter: () => setHighlightedIndex(index),
600
+ className: clsx(
601
+ "tw-transition-all tw-duration-150 tw-typography-body2",
602
+ // Selected option styling
603
+ optionClassName
604
+ ),
605
+ children: /* @__PURE__ */ jsx4(
606
+ "div",
607
+ {
608
+ className: clsx(
609
+ "tw-px-4 tw-cursor-pointer tw-py-2 tw-mx-0.5 tw-rounded-xl",
610
+ normalizeValue(selectedValue) === normalizeValue(option.value) ? experience === "personal" ? "tw-bg-[#f1e8fa]" : "tw-bg-[#fff1e1]" : (
611
+ // Highlighted option styling (keyboard navigation)
612
+ index === highlightedIndex ? "tw-bg-[#f3f4f6] tw-text-gray-900" : (
613
+ // Default option styling
614
+ "tw-text-gray-900 hover:tw-bg-[#1118270a]"
615
+ )
616
+ )
617
+ ),
618
+ children: option.label
619
+ }
620
+ )
621
+ },
622
+ doubleCharSearch ? option.label : option.value
623
+ )) : /* @__PURE__ */ jsx4("div", { className: "tw-px-4 tw-py-3 tw-text-gray-500 tw-text-sm", children: "No options found" })
624
+ }
625
+ )
626
+ ]
627
+ }
628
+ );
629
+ };
630
+ var arePropsEqual = (prevProps, nextProps) => {
631
+ var _a, _b;
632
+ const criticalProps = [
633
+ "value",
634
+ "valueSelected",
635
+ "options",
636
+ "error",
637
+ "disabled",
638
+ "label",
639
+ "mandatory"
640
+ ];
641
+ for (const prop of criticalProps) {
642
+ if (prevProps[prop] !== nextProps[prop]) {
643
+ return false;
644
+ }
645
+ }
646
+ if (((_a = prevProps.options) == null ? void 0 : _a.length) !== ((_b = nextProps.options) == null ? void 0 : _b.length)) {
647
+ return false;
648
+ }
649
+ if (prevProps.options && nextProps.options) {
650
+ for (let i = 0; i < prevProps.options.length; i++) {
651
+ const prevOpt = prevProps.options[i];
652
+ const nextOpt = nextProps.options[i];
653
+ if ((prevOpt == null ? void 0 : prevOpt.value) !== (nextOpt == null ? void 0 : nextOpt.value) || (prevOpt == null ? void 0 : prevOpt.label) !== (nextOpt == null ? void 0 : nextOpt.label)) {
654
+ return false;
655
+ }
656
+ }
657
+ }
658
+ return true;
659
+ };
660
+ Select.displayName = "Select";
661
+ var Select_default = memo3(Select, arePropsEqual);
662
+
663
+ export {
664
+ Select,
665
+ Select_default
666
+ };