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