@itilite/lumina-ui 1.1.11 → 1.1.13

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 (200) hide show
  1. package/dist/Avatar-DX2JwvAs.d.mts +17 -0
  2. package/dist/Avatar-DX2JwvAs.d.ts +17 -0
  3. package/dist/Tag-l7I5oeyk.d.mts +13 -0
  4. package/dist/Tag-l7I5oeyk.d.ts +13 -0
  5. package/dist/atom/Avatar/Avatar.d.mts +1 -9
  6. package/dist/atom/Avatar/Avatar.d.ts +1 -9
  7. package/dist/atom/RangePicker/RangePicker.mjs +2 -2
  8. package/dist/atom/Tag/Tag.d.mts +3 -10
  9. package/dist/atom/Tag/Tag.d.ts +3 -10
  10. package/dist/chunk-3S4X3YO2.mjs +64 -0
  11. package/dist/chunk-DLLT6V65.mjs +141 -0
  12. package/dist/chunk-I5VHKSQR.mjs +64 -0
  13. package/dist/chunk-N2WTNCQU.mjs +66 -0
  14. package/dist/chunk-N3YFQDW7.mjs +77 -0
  15. package/dist/chunk-QWK3MYDM.mjs +64 -0
  16. package/dist/chunk-SWRFCTJW.mjs +77 -0
  17. package/dist/chunk-UUEPD2FH.mjs +141 -0
  18. package/dist/index.d.mts +2 -0
  19. package/dist/index.d.ts +2 -0
  20. package/dist/index.js +56 -2
  21. package/dist/index.mjs +23 -19
  22. package/dist/molecules/UserProfile/UserProfile.d.mts +23 -0
  23. package/dist/molecules/UserProfile/UserProfile.d.ts +23 -0
  24. package/dist/molecules/UserProfile/UserProfile.js +243 -0
  25. package/dist/molecules/UserProfile/UserProfile.mjs +11 -0
  26. package/dist/styles.css +281 -265
  27. package/dist/types-D4MD2w3_.d.mts +9 -0
  28. package/dist/types-D4MD2w3_.d.ts +9 -0
  29. package/dist/types-mhQmqhsR.d.mts +10 -0
  30. package/dist/types-mhQmqhsR.d.ts +10 -0
  31. package/package.json +1 -1
  32. package/dist/chunk-22VF7AVT.mjs +0 -618
  33. package/dist/chunk-2BNAAOBU.mjs +0 -670
  34. package/dist/chunk-2IMRLK6M.mjs +0 -44
  35. package/dist/chunk-2JIINZEK.mjs +0 -618
  36. package/dist/chunk-2LBFKQDZ.mjs +0 -660
  37. package/dist/chunk-2QQU6BYR.mjs +0 -678
  38. package/dist/chunk-2ZJBF5C4.mjs +0 -618
  39. package/dist/chunk-33JITG5Y.mjs +0 -621
  40. package/dist/chunk-3IMCN4K3.mjs +0 -670
  41. package/dist/chunk-3K2RTVMH.mjs +0 -584
  42. package/dist/chunk-3KBQQCET.mjs +0 -674
  43. package/dist/chunk-3KUHXNFH.mjs +0 -678
  44. package/dist/chunk-3PPNOIXN.mjs +0 -618
  45. package/dist/chunk-3XFY3TXJ.mjs +0 -611
  46. package/dist/chunk-3XW7HS5W.mjs +0 -618
  47. package/dist/chunk-3YDCRJYV.mjs +0 -618
  48. package/dist/chunk-447HZYZ4.mjs +0 -612
  49. package/dist/chunk-46F3B4U6.mjs +0 -618
  50. package/dist/chunk-4K5RZHL4.mjs +0 -618
  51. package/dist/chunk-4QHFP4YD.mjs +0 -666
  52. package/dist/chunk-4TFX4DHY.mjs +0 -702
  53. package/dist/chunk-4TWO6JES.mjs +0 -666
  54. package/dist/chunk-4UQVJ3ZU.mjs +0 -666
  55. package/dist/chunk-5247J65D.mjs +0 -670
  56. package/dist/chunk-5PFI6XBL.mjs +0 -618
  57. package/dist/chunk-66H5WSEJ.mjs +0 -618
  58. package/dist/chunk-6NZEDJ2M.mjs +0 -582
  59. package/dist/chunk-6OC6URNL.mjs +0 -73
  60. package/dist/chunk-6OGEXG5U.mjs +0 -618
  61. package/dist/chunk-6ROQXYVN.mjs +0 -672
  62. package/dist/chunk-6WNI6X5Q.mjs +0 -618
  63. package/dist/chunk-72PPCN6D.mjs +0 -675
  64. package/dist/chunk-74EGXFNN.mjs +0 -618
  65. package/dist/chunk-77NCDGJA.mjs +0 -707
  66. package/dist/chunk-7L3WTWF3.mjs +0 -677
  67. package/dist/chunk-7NGBIPZT.mjs +0 -618
  68. package/dist/chunk-7NM4FNMQ.mjs +0 -666
  69. package/dist/chunk-7YBBSVUA.mjs +0 -672
  70. package/dist/chunk-7Z52UP7P.mjs +0 -618
  71. package/dist/chunk-AC6WC7OO.mjs +0 -618
  72. package/dist/chunk-B3LDL3KD.mjs +0 -670
  73. package/dist/chunk-B63IXC6M.mjs +0 -618
  74. package/dist/chunk-B65LGQ47.mjs +0 -666
  75. package/dist/chunk-B6MTRO54.mjs +0 -618
  76. package/dist/chunk-BJBP5XYB.mjs +0 -618
  77. package/dist/chunk-BLLSWPCC.mjs +0 -618
  78. package/dist/chunk-BOYB7REJ.mjs +0 -670
  79. package/dist/chunk-BP2D64XI.mjs +0 -618
  80. package/dist/chunk-BP4XS2GF.mjs +0 -585
  81. package/dist/chunk-BRT5IPGQ.mjs +0 -618
  82. package/dist/chunk-BTIIO2CP.mjs +0 -582
  83. package/dist/chunk-C2J3VBFZ.mjs +0 -670
  84. package/dist/chunk-CDOR7GQP.mjs +0 -618
  85. package/dist/chunk-CI2RMA4V.mjs +0 -612
  86. package/dist/chunk-CNUIZOQJ.mjs +0 -669
  87. package/dist/chunk-CPBXPEST.mjs +0 -672
  88. package/dist/chunk-CVOLXLMU.mjs +0 -618
  89. package/dist/chunk-CWUCNC36.mjs +0 -666
  90. package/dist/chunk-CZBGN6GS.mjs +0 -612
  91. package/dist/chunk-D3APB62N.mjs +0 -618
  92. package/dist/chunk-D5B2TUSL.mjs +0 -591
  93. package/dist/chunk-D7TWXVL2.mjs +0 -674
  94. package/dist/chunk-DAZ53AD7.mjs +0 -671
  95. package/dist/chunk-DBY5U6IU.mjs +0 -618
  96. package/dist/chunk-DXTVU4M5.mjs +0 -618
  97. package/dist/chunk-DZBTD6QK.mjs +0 -666
  98. package/dist/chunk-E6UPDTDY.mjs +0 -611
  99. package/dist/chunk-EAK2IMM4.mjs +0 -37
  100. package/dist/chunk-EQT2Q2LW.mjs +0 -610
  101. package/dist/chunk-EWMCELQV.mjs +0 -670
  102. package/dist/chunk-EYKWBEHX.mjs +0 -612
  103. package/dist/chunk-FHLCFUP6.mjs +0 -666
  104. package/dist/chunk-FMPFLQZV.mjs +0 -670
  105. package/dist/chunk-G25YXZ74.mjs +0 -618
  106. package/dist/chunk-G6P5MKL3.mjs +0 -582
  107. package/dist/chunk-GSG6ZC3R.mjs +0 -37
  108. package/dist/chunk-H3MQUFTJ.mjs +0 -618
  109. package/dist/chunk-HKZRLVBX.mjs +0 -618
  110. package/dist/chunk-HQALJGVT.mjs +0 -618
  111. package/dist/chunk-I5GBZ3UX.mjs +0 -676
  112. package/dist/chunk-IQHBVGA4.mjs +0 -677
  113. package/dist/chunk-IUTUCRDD.mjs +0 -611
  114. package/dist/chunk-IV4V55OA.mjs +0 -672
  115. package/dist/chunk-J2RAFKAD.mjs +0 -618
  116. package/dist/chunk-JCMSG75Q.mjs +0 -51
  117. package/dist/chunk-JL34UFI7.mjs +0 -670
  118. package/dist/chunk-JTKSGGQM.mjs +0 -611
  119. package/dist/chunk-JZC2RRDH.mjs +0 -618
  120. package/dist/chunk-JZCHXA6R.mjs +0 -585
  121. package/dist/chunk-K3Y7VKT6.mjs +0 -670
  122. package/dist/chunk-KEVXNUFG.mjs +0 -672
  123. package/dist/chunk-KH7D4ESJ.mjs +0 -584
  124. package/dist/chunk-KQBCWIIM.mjs +0 -618
  125. package/dist/chunk-KRYAP7NG.mjs +0 -670
  126. package/dist/chunk-KU655POK.mjs +0 -657
  127. package/dist/chunk-L55SLVNX.mjs +0 -618
  128. package/dist/chunk-LCRYOZEV.mjs +0 -618
  129. package/dist/chunk-LH7PP6V2.mjs +0 -618
  130. package/dist/chunk-LJMMYKE2.mjs +0 -618
  131. package/dist/chunk-LK5TROLL.mjs +0 -666
  132. package/dist/chunk-MDR7DAKM.mjs +0 -618
  133. package/dist/chunk-MJZLCWZ5.mjs +0 -666
  134. package/dist/chunk-MKZTEJLS.mjs +0 -612
  135. package/dist/chunk-MOD7MLCD.mjs +0 -64
  136. package/dist/chunk-MQCOQHHP.mjs +0 -618
  137. package/dist/chunk-MSM4KUBM.mjs +0 -618
  138. package/dist/chunk-MTIUER63.mjs +0 -676
  139. package/dist/chunk-NBLV3UX5.mjs +0 -618
  140. package/dist/chunk-NLADSOJS.mjs +0 -618
  141. package/dist/chunk-NPMTWR3Y.mjs +0 -618
  142. package/dist/chunk-NQ6GKEO7.mjs +0 -670
  143. package/dist/chunk-NZSFYNUK.mjs +0 -618
  144. package/dist/chunk-OANBDTKG.mjs +0 -73
  145. package/dist/chunk-OCNF4O5U.mjs +0 -612
  146. package/dist/chunk-OCW5QSWA.mjs +0 -618
  147. package/dist/chunk-OQF7JZFS.mjs +0 -670
  148. package/dist/chunk-OT675HGC.mjs +0 -670
  149. package/dist/chunk-P47TCYKN.mjs +0 -618
  150. package/dist/chunk-P7TOGXPI.mjs +0 -672
  151. package/dist/chunk-PCAXXEEQ.mjs +0 -618
  152. package/dist/chunk-PDHMG7OZ.mjs +0 -672
  153. package/dist/chunk-PFGVOZGM.mjs +0 -618
  154. package/dist/chunk-PGAAFJOG.mjs +0 -576
  155. package/dist/chunk-PQSSDK3E.mjs +0 -618
  156. package/dist/chunk-PST7W3NG.mjs +0 -618
  157. package/dist/chunk-QGPBZ2YV.mjs +0 -664
  158. package/dist/chunk-QOPCJITC.mjs +0 -618
  159. package/dist/chunk-QSE52CRC.mjs +0 -618
  160. package/dist/chunk-QTP2QMPL.mjs +0 -669
  161. package/dist/chunk-QUZAACW5.mjs +0 -585
  162. package/dist/chunk-R47XX6IW.mjs +0 -611
  163. package/dist/chunk-RL6AEU6E.mjs +0 -612
  164. package/dist/chunk-RZ7V2KQZ.mjs +0 -621
  165. package/dist/chunk-S3CUYIE3.mjs +0 -585
  166. package/dist/chunk-T7T4HCHH.mjs +0 -618
  167. package/dist/chunk-TED2WCDG.mjs +0 -618
  168. package/dist/chunk-TENXL4LK.mjs +0 -107
  169. package/dist/chunk-TJLIMMMB.mjs +0 -612
  170. package/dist/chunk-TNOJDLON.mjs +0 -611
  171. package/dist/chunk-TOR67IHH.mjs +0 -672
  172. package/dist/chunk-TOV7NVKM.mjs +0 -618
  173. package/dist/chunk-TSYMIRRN.mjs +0 -618
  174. package/dist/chunk-TTSRI4V7.mjs +0 -708
  175. package/dist/chunk-UBS3DTE5.mjs +0 -672
  176. package/dist/chunk-UBW6RYVF.mjs +0 -670
  177. package/dist/chunk-UFAFA6RV.mjs +0 -585
  178. package/dist/chunk-UJNUFKR5.mjs +0 -43
  179. package/dist/chunk-VAZZJOSJ.mjs +0 -618
  180. package/dist/chunk-VCWXOX2B.mjs +0 -618
  181. package/dist/chunk-VHCLEOHZ.mjs +0 -618
  182. package/dist/chunk-VTZSCGME.mjs +0 -666
  183. package/dist/chunk-W33KZ2XR.mjs +0 -618
  184. package/dist/chunk-W7J4GMPI.mjs +0 -618
  185. package/dist/chunk-WOVMTYDV.mjs +0 -612
  186. package/dist/chunk-WR3USBWK.mjs +0 -672
  187. package/dist/chunk-WXYQARQ6.mjs +0 -618
  188. package/dist/chunk-XE4LPYOW.mjs +0 -581
  189. package/dist/chunk-XSDANHCE.mjs +0 -618
  190. package/dist/chunk-Y6XKW4NG.mjs +0 -618
  191. package/dist/chunk-YO5EDEA6.mjs +0 -618
  192. package/dist/chunk-YQSNJFZE.mjs +0 -618
  193. package/dist/chunk-Z6VG6AG7.mjs +0 -678
  194. package/dist/chunk-ZAPKQ4C3.mjs +0 -678
  195. package/dist/chunk-ZCWDQNHL.mjs +0 -618
  196. package/dist/chunk-ZF5JBNCI.mjs +0 -618
  197. package/dist/chunk-ZN7BHWOF.mjs +0 -672
  198. package/dist/chunk-ZUMHWVMV.mjs +0 -585
  199. package/dist/chunk-ZUQJKA5J.mjs +0 -666
  200. package/dist/chunk-ZWHWIGYQ.mjs +0 -618
@@ -1,670 +0,0 @@
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 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-6 tw-px-3 tw-typography-body2 !tw-rounded",
181
- padding: label ? "tw-pt-4 tw-pb-1" : "tw-py-1",
182
- labelActive: "tw-top-0.5 tw-typography-caption2",
183
- labelInactive: "tw-top-1.5 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
- const InputWrapper = ({ children }) => {
474
- return /* @__PURE__ */ jsx4(Tooltip_default, { title: disabledTooltip, children });
475
- return children;
476
- };
477
- return /* @__PURE__ */ jsx4(InputWrapper, { children: /* @__PURE__ */ jsxs(
478
- "div",
479
- {
480
- style,
481
- className: clsx("tw-relative tw-w-full", wrapperClassName, {
482
- "tw-cursor-not-allowed": disabled
483
- }),
484
- ref: dropdownRef,
485
- onMouseEnter: handleMouseEnter,
486
- onMouseLeave: handleMouseLeave,
487
- children: [
488
- /* @__PURE__ */ jsxs("div", { className: "tw-relative", children: [
489
- /* @__PURE__ */ jsx4(
490
- "input",
491
- {
492
- ref: inputRef,
493
- type: "text",
494
- id,
495
- name,
496
- tabIndex,
497
- autoComplete: "off",
498
- autoCorrect: "off",
499
- autoCapitalize: "off",
500
- spellCheck: "false",
501
- value: isFocused && enableSearch ? searchTerm : getDisplayValue(),
502
- onChange: enableSearch ? handleSearchChange : void 0,
503
- onClick: handleInputInteraction,
504
- onKeyDown: handleKeyDown,
505
- className: clsx(
506
- "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",
507
- sizeClasses.input,
508
- sizeClasses.padding,
509
- variantClasses,
510
- {
511
- "tw-bg-white": valueSelected || getDisplayValue() || isFocused,
512
- "tw-bg-color-gray-5": !valueSelected || !getDisplayValue(),
513
- "!tw-bg-[#F8F7F6] tw-cursor-not-allowed tw-pointer-events-none": disabled
514
- },
515
- // Conditional padding based on label presence
516
- !label && "tw-flex tw-items-center",
517
- {
518
- "!tw-border-color-primary": isFocused && experience === "business"
519
- },
520
- {
521
- "!tw-border-[#804D7B]": isFocused && experience === "personal"
522
- },
523
- error ? "!tw-border-color-text-critical " : "tw-border-[#EBE3DD] hover:tw-border-[#C5B7AC]",
524
- // Add focus state styling
525
- "focus:tw-shadow-sm focus:tw-ring-offset-1",
526
- className,
527
- inputClassName
528
- // Put inputClassName last so it can override default classes
529
- ),
530
- readOnly: !isFocused || !enableSearch
531
- }
532
- ),
533
- label && size === "small" && !selectedValue && /* @__PURE__ */ jsxs(
534
- "label",
535
- {
536
- htmlFor: id,
537
- className: clsx(
538
- "tw-absolute tw-left-[18px] tw-pointer-events-none tw-transition-all tw-duration-200 tw-ease-out tw-text-gray-500",
539
- isActive ? sizeClasses.labelActive : sizeClasses.labelInactive,
540
- error && "tw-text-color-text-critical",
541
- labelClassName
542
- ),
543
- children: [
544
- label,
545
- mandatory && /* @__PURE__ */ jsx4("span", { className: "tw-text-color-text-critical tw-ml-1", children: "*" })
546
- ]
547
- }
548
- ),
549
- /* @__PURE__ */ jsxs(
550
- "div",
551
- {
552
- className: clsx(
553
- "tw-absolute tw-right-3 tw-top-1/2 tw--translate-y-1/2 tw-flex tw-items-center",
554
- {
555
- "!tw-right-[5px]": doubleCharSearch && !(isHovering && selectedValue && allowClear)
556
- }
557
- ),
558
- children: [
559
- disabled && /* @__PURE__ */ jsx4("div", { className: "tw-absolute tw-right-0 -tw-top-2", children: /* @__PURE__ */ jsx4(Lock, { size: 16 }) }),
560
- isLoading ? /* @__PURE__ */ jsx4("div", { children: /* @__PURE__ */ jsx4(LoadingSpinner_default, { size: "xs" }) }) : /* @__PURE__ */ jsx4(
561
- "div",
562
- {
563
- className: clsx(
564
- "tw-transition-all tw-duration-200 tw-cursor-pointer tw-flex tw-items-center",
565
- // Only rotate chevron when open and not showing clear icon
566
- isOpen && !(isHovering && selectedValue && allowClear) && "-tw-rotate-180"
567
- ),
568
- onMouseDown: (e) => {
569
- if (isHovering && selectedValue && allowClear) {
570
- handleClear(e);
571
- } else {
572
- handleChevronClick(e);
573
- }
574
- },
575
- children: disabled ? null : isHovering && selectedValue && allowClear ? /* @__PURE__ */ jsx4(CrossV2, { color: "#111827", className: "tw-mr-1" }) : /* @__PURE__ */ jsx4(
576
- Chevron,
577
- {
578
- className: clsx("tw-text-gray-400"),
579
- color: "#6B7280"
580
- }
581
- )
582
- }
583
- )
584
- ]
585
- }
586
- )
587
- ] }),
588
- isOpen && /* @__PURE__ */ jsx4(
589
- "div",
590
- {
591
- className: clsx(
592
- "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",
593
- { "tw-max-h-60": !doubleCharSearch },
594
- { "tw-max-h-44": doubleCharSearch },
595
- dropdownClassName
596
- ),
597
- ref: optionListRef,
598
- children: filteredOptions.length > 0 ? filteredOptions.map((option, index) => /* @__PURE__ */ jsx4(
599
- "div",
600
- {
601
- ref: (el) => optionRefs.current[index] = el,
602
- onClick: () => handleOptionSelect(option),
603
- onMouseEnter: () => setHighlightedIndex(index),
604
- className: clsx(
605
- "tw-transition-all tw-duration-150 tw-typography-body2",
606
- // Selected option styling
607
- optionClassName
608
- ),
609
- children: /* @__PURE__ */ jsx4(
610
- "div",
611
- {
612
- className: clsx(
613
- "tw-px-4 tw-cursor-pointer tw-py-2 tw-mx-0.5 tw-rounded-xl",
614
- normalizeValue(selectedValue) === normalizeValue(option.value) ? experience === "personal" ? "tw-bg-[#f1e8fa]" : "tw-bg-[#fff1e1]" : (
615
- // Highlighted option styling (keyboard navigation)
616
- index === highlightedIndex ? "tw-bg-[#f3f4f6] tw-text-gray-900" : (
617
- // Default option styling
618
- "tw-text-gray-900 hover:tw-bg-[#1118270a]"
619
- )
620
- )
621
- ),
622
- children: option.label
623
- }
624
- )
625
- },
626
- doubleCharSearch ? option.label : option.value
627
- )) : /* @__PURE__ */ jsx4("div", { className: "tw-px-4 tw-py-3 tw-text-gray-500 tw-text-sm", children: "No options found" })
628
- }
629
- )
630
- ]
631
- }
632
- ) });
633
- };
634
- var arePropsEqual = (prevProps, nextProps) => {
635
- var _a, _b;
636
- const criticalProps = [
637
- "value",
638
- "valueSelected",
639
- "options",
640
- "error",
641
- "disabled",
642
- "label",
643
- "mandatory"
644
- ];
645
- for (const prop of criticalProps) {
646
- if (prevProps[prop] !== nextProps[prop]) {
647
- return false;
648
- }
649
- }
650
- if (((_a = prevProps.options) == null ? void 0 : _a.length) !== ((_b = nextProps.options) == null ? void 0 : _b.length)) {
651
- return false;
652
- }
653
- if (prevProps.options && nextProps.options) {
654
- for (let i = 0; i < prevProps.options.length; i++) {
655
- const prevOpt = prevProps.options[i];
656
- const nextOpt = nextProps.options[i];
657
- 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)) {
658
- return false;
659
- }
660
- }
661
- }
662
- return true;
663
- };
664
- Select.displayName = "Select";
665
- var Select_default = memo3(Select, arePropsEqual);
666
-
667
- export {
668
- Select,
669
- Select_default
670
- };