@magicx-eng/ai-autocomplete-react 0.1.14 → 0.1.16
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.
- package/README.md +16 -10
- package/dist/index.d.mts +7 -7
- package/dist/index.d.ts +7 -7
- package/dist/index.js +325 -8
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +325 -8
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{forwardRef as
|
|
1
|
+
import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as wt,useRef as Oe,useState as Pt}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-cc65f4cc")){let e=document.createElement("style");e.id="ac-style-cc65f4cc",e.textContent=`.AIAutocomplete-module_container_KKjFU {
|
|
2
2
|
position: relative;
|
|
3
3
|
font-family: "IBM Plex Sans", sans-serif;
|
|
4
4
|
}
|
|
@@ -37,6 +37,14 @@ import{forwardRef as bt,useCallback as ht,useEffect as yt,useImperativeHandle as
|
|
|
37
37
|
color: transparent;
|
|
38
38
|
}
|
|
39
39
|
|
|
40
|
+
.AIAutocomplete-module_sizerTextVisible_HR-5h {
|
|
41
|
+
color: var(--ac-color-text-default, #fff);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.AIAutocomplete-module_textareaHidden_UayJt {
|
|
45
|
+
color: transparent !important;
|
|
46
|
+
}
|
|
47
|
+
|
|
40
48
|
.AIAutocomplete-module_placeholderText_K3ayy {
|
|
41
49
|
color: var(--ac-color-text-muted, #c1c4cb);
|
|
42
50
|
opacity: 0.7;
|
|
@@ -86,7 +94,52 @@ import{forwardRef as bt,useCallback as ht,useEffect as yt,useImperativeHandle as
|
|
|
86
94
|
.AIAutocomplete-module_submitButton_sl1Mi:hover {
|
|
87
95
|
opacity: 0.85;
|
|
88
96
|
}
|
|
89
|
-
|
|
97
|
+
|
|
98
|
+
/* Text shimmer on newly added completed param.
|
|
99
|
+
The sizer sits above the textarea (z-index: 1). Normally sizer text is
|
|
100
|
+
transparent and the textarea shows the real text. During the shimmer, we
|
|
101
|
+
make this span visible with a moving gradient clipped to the text shape,
|
|
102
|
+
so the shimmer renders on top of the textarea's static white text. */
|
|
103
|
+
|
|
104
|
+
.AIAutocomplete-module_shimmer_13AnY {
|
|
105
|
+
position: relative;
|
|
106
|
+
z-index: 2;
|
|
107
|
+
display: inline;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.AIAutocomplete-module_shimmerRevealed_RR8dp {
|
|
111
|
+
color: transparent;
|
|
112
|
+
background: linear-gradient(
|
|
113
|
+
120deg,
|
|
114
|
+
var(--ac-color-text-default, #fff) 0%,
|
|
115
|
+
var(--ac-color-text-default, #fff) 44%,
|
|
116
|
+
#b0b0b0 48%,
|
|
117
|
+
#b0b0b0 52%,
|
|
118
|
+
var(--ac-color-text-default, #fff) 56%,
|
|
119
|
+
var(--ac-color-text-default, #fff) 100%
|
|
120
|
+
);
|
|
121
|
+
background-size: 200% 100%;
|
|
122
|
+
-webkit-background-clip: text;
|
|
123
|
+
background-clip: text;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.AIAutocomplete-module_shimmerSweep_ARCon {
|
|
127
|
+
animation: AIAutocomplete-module_textShimmer_eCLdq 650ms ease-out forwards;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
@keyframes AIAutocomplete-module_textShimmer_eCLdq {
|
|
131
|
+
0% {
|
|
132
|
+
background-position: 100% 0;
|
|
133
|
+
}
|
|
134
|
+
100% {
|
|
135
|
+
background-position: -50% 0;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.AIAutocomplete-module_shimmerHidden_45-Pf {
|
|
140
|
+
color: transparent !important;
|
|
141
|
+
}
|
|
142
|
+
`,document.head.appendChild(e)}var L={container:"AIAutocomplete-module_container_KKjFU",inputWrapper:"AIAutocomplete-module_inputWrapper_FLq1b",editorArea:"AIAutocomplete-module_editorArea_7rBWq",sizerContent:"AIAutocomplete-module_sizerContent_DQgmV",sizerText:"AIAutocomplete-module_sizerText_iZIMK",sizerTextVisible:"AIAutocomplete-module_sizerTextVisible_HR-5h",textareaHidden:"AIAutocomplete-module_textareaHidden_UayJt",placeholderText:"AIAutocomplete-module_placeholderText_K3ayy",textarea:"AIAutocomplete-module_textarea_eyn6A",submitButton:"AIAutocomplete-module_submitButton_sl1Mi",shimmer:"AIAutocomplete-module_shimmer_13AnY",shimmerRevealed:"AIAutocomplete-module_shimmerRevealed_RR8dp",shimmerSweep:"AIAutocomplete-module_shimmerSweep_ARCon",textShimmer:"AIAutocomplete-module_textShimmer_eCLdq",shimmerHidden:"AIAutocomplete-module_shimmerHidden_45-Pf"};if(typeof document<"u"&&!document.getElementById("ac-style-2eef895d")){let e=document.createElement("style");e.id="ac-style-2eef895d",e.textContent=`.AIAutocompleteDropdown-module_dropdown_yz2KC {
|
|
90
143
|
position: absolute;
|
|
91
144
|
left: 0;
|
|
92
145
|
right: 0;
|
|
@@ -105,10 +158,10 @@ import{forwardRef as bt,useCallback as ht,useEffect as yt,useImperativeHandle as
|
|
|
105
158
|
opacity: 1;
|
|
106
159
|
pointer-events: auto;
|
|
107
160
|
}
|
|
108
|
-
`,document.head.appendChild(e)}var
|
|
161
|
+
`,document.head.appendChild(e)}var Ie={dropdown:"AIAutocompleteDropdown-module_dropdown_yz2KC",visible:"AIAutocompleteDropdown-module_visible_QCoXj"};if(typeof document<"u"&&!document.getElementById("ac-style-d91f2b06")){let e=document.createElement("style");e.id="ac-style-d91f2b06",e.textContent=`.SuggestionGrid-module_grid_jvaPb {
|
|
109
162
|
display: grid;
|
|
110
163
|
grid-template-columns: 1fr 1fr;
|
|
111
|
-
gap:
|
|
164
|
+
gap: 0 18px;
|
|
112
165
|
padding: 18px 24px;
|
|
113
166
|
max-height: 192px;
|
|
114
167
|
overflow-y: auto;
|
|
@@ -128,7 +181,9 @@ import{forwardRef as bt,useCallback as ht,useEffect as yt,useImperativeHandle as
|
|
|
128
181
|
background: rgba(255, 255, 255, 0.3);
|
|
129
182
|
border-radius: 3px;
|
|
130
183
|
}
|
|
131
|
-
`,document.head.appendChild(e)}var
|
|
184
|
+
`,document.head.appendChild(e)}var Fe={grid:"SuggestionGrid-module_grid_jvaPb"};import{useRef as pt,useState as dt}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-f6bdc634")){let e=document.createElement("style");e.id="ac-style-f6bdc634",e.textContent=`.SuggestionItem-module_item_d4vpD {
|
|
185
|
+
position: relative;
|
|
186
|
+
overflow: visible;
|
|
132
187
|
display: flex;
|
|
133
188
|
align-items: center;
|
|
134
189
|
font-family: "IBM Plex Sans", sans-serif;
|
|
@@ -138,7 +193,9 @@ import{forwardRef as bt,useCallback as ht,useEffect as yt,useImperativeHandle as
|
|
|
138
193
|
white-space: normal;
|
|
139
194
|
word-break: break-word;
|
|
140
195
|
opacity: 0.35;
|
|
141
|
-
|
|
196
|
+
border-radius: 12px;
|
|
197
|
+
padding: 12px 10px;
|
|
198
|
+
animation: SuggestionItem-module_fadeIn_I8u35 500ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
142
199
|
}
|
|
143
200
|
|
|
144
201
|
@keyframes SuggestionItem-module_fadeIn_I8u35 {
|
|
@@ -147,6 +204,11 @@ import{forwardRef as bt,useCallback as ht,useEffect as yt,useImperativeHandle as
|
|
|
147
204
|
}
|
|
148
205
|
}
|
|
149
206
|
|
|
207
|
+
.SuggestionItem-module_content_T-Qba {
|
|
208
|
+
position: relative;
|
|
209
|
+
z-index: 2;
|
|
210
|
+
}
|
|
211
|
+
|
|
150
212
|
.SuggestionItem-module_tappable_70KcX {
|
|
151
213
|
cursor: pointer;
|
|
152
214
|
}
|
|
@@ -170,7 +232,262 @@ import{forwardRef as bt,useCallback as ht,useEffect as yt,useImperativeHandle as
|
|
|
170
232
|
margin-left: 6px;
|
|
171
233
|
opacity: 0.5;
|
|
172
234
|
}
|
|
173
|
-
|
|
235
|
+
|
|
236
|
+
.SuggestionItem-module_pressed_98o-r {
|
|
237
|
+
opacity: 0.8;
|
|
238
|
+
color: var(--ac-color-text-default, #fff);
|
|
239
|
+
background: rgba(255, 255, 255, 0.06);
|
|
240
|
+
animation:
|
|
241
|
+
SuggestionItem-module_glassFade_oyiSj 500ms ease forwards,
|
|
242
|
+
SuggestionItem-module_tapDown_G3WGz 500ms ease forwards;
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
@keyframes SuggestionItem-module_tapDown_G3WGz {
|
|
246
|
+
0% {
|
|
247
|
+
transform: scale(1);
|
|
248
|
+
}
|
|
249
|
+
30% {
|
|
250
|
+
transform: scale(0.97);
|
|
251
|
+
}
|
|
252
|
+
100% {
|
|
253
|
+
transform: scale(1);
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
@keyframes SuggestionItem-module_glassFade_oyiSj {
|
|
258
|
+
0% {
|
|
259
|
+
background: rgba(255, 255, 255, 0.1);
|
|
260
|
+
}
|
|
261
|
+
100% {
|
|
262
|
+
background: transparent;
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
/* Border streaks \u2014 horizontal segments */
|
|
267
|
+
|
|
268
|
+
.SuggestionItem-module_streaks_d9PEB {
|
|
269
|
+
position: absolute;
|
|
270
|
+
inset: 0;
|
|
271
|
+
z-index: 1;
|
|
272
|
+
pointer-events: none;
|
|
273
|
+
border-radius: inherit;
|
|
274
|
+
overflow: hidden;
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
/* Bottom horizontal: 40% from right \u2192 right corner */
|
|
278
|
+
.SuggestionItem-module_streaks_d9PEB::before {
|
|
279
|
+
content: "";
|
|
280
|
+
position: absolute;
|
|
281
|
+
bottom: -3px;
|
|
282
|
+
left: 60%;
|
|
283
|
+
width: 0;
|
|
284
|
+
height: 6px;
|
|
285
|
+
background: radial-gradient(
|
|
286
|
+
ellipse at center,
|
|
287
|
+
rgba(255, 255, 255, 0.5) 0%,
|
|
288
|
+
rgba(255, 255, 255, 0.2) 40%,
|
|
289
|
+
transparent 70%
|
|
290
|
+
);
|
|
291
|
+
box-shadow: 0 0 12px 4px rgba(255, 255, 255, 0.2);
|
|
292
|
+
filter: blur(1px);
|
|
293
|
+
border-radius: 50%;
|
|
294
|
+
}
|
|
295
|
+
|
|
296
|
+
/* Top horizontal: 40% from left \u2192 left corner */
|
|
297
|
+
.SuggestionItem-module_streaks_d9PEB::after {
|
|
298
|
+
content: "";
|
|
299
|
+
position: absolute;
|
|
300
|
+
top: -3px;
|
|
301
|
+
right: 60%;
|
|
302
|
+
width: 0;
|
|
303
|
+
height: 6px;
|
|
304
|
+
background: radial-gradient(
|
|
305
|
+
ellipse at center,
|
|
306
|
+
rgba(255, 255, 255, 0.5) 0%,
|
|
307
|
+
rgba(255, 255, 255, 0.2) 40%,
|
|
308
|
+
transparent 70%
|
|
309
|
+
);
|
|
310
|
+
box-shadow: 0 0 12px 4px rgba(255, 255, 255, 0.2);
|
|
311
|
+
filter: blur(1px);
|
|
312
|
+
border-radius: 50%;
|
|
313
|
+
}
|
|
314
|
+
|
|
315
|
+
/* Border streaks \u2014 vertical segments */
|
|
316
|
+
|
|
317
|
+
.SuggestionItem-module_streaksVert_ERlV1 {
|
|
318
|
+
position: absolute;
|
|
319
|
+
inset: 0;
|
|
320
|
+
z-index: 1;
|
|
321
|
+
pointer-events: none;
|
|
322
|
+
border-radius: inherit;
|
|
323
|
+
overflow: hidden;
|
|
324
|
+
}
|
|
325
|
+
|
|
326
|
+
/* Right vertical: bottom-right corner \u2192 up */
|
|
327
|
+
.SuggestionItem-module_streaksVert_ERlV1::before {
|
|
328
|
+
content: "";
|
|
329
|
+
position: absolute;
|
|
330
|
+
bottom: 0;
|
|
331
|
+
right: -3px;
|
|
332
|
+
width: 6px;
|
|
333
|
+
height: 0;
|
|
334
|
+
background: radial-gradient(
|
|
335
|
+
ellipse at center,
|
|
336
|
+
rgba(255, 255, 255, 0.4) 0%,
|
|
337
|
+
rgba(255, 255, 255, 0.15) 40%,
|
|
338
|
+
transparent 70%
|
|
339
|
+
);
|
|
340
|
+
box-shadow: 0 0 12px 4px rgba(255, 255, 255, 0.15);
|
|
341
|
+
filter: blur(1px);
|
|
342
|
+
border-radius: 50%;
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
/* Left vertical: top-left corner \u2192 down */
|
|
346
|
+
.SuggestionItem-module_streaksVert_ERlV1::after {
|
|
347
|
+
content: "";
|
|
348
|
+
position: absolute;
|
|
349
|
+
top: 0;
|
|
350
|
+
left: -3px;
|
|
351
|
+
width: 6px;
|
|
352
|
+
height: 0;
|
|
353
|
+
background: radial-gradient(
|
|
354
|
+
ellipse at center,
|
|
355
|
+
rgba(255, 255, 255, 0.4) 0%,
|
|
356
|
+
rgba(255, 255, 255, 0.15) 40%,
|
|
357
|
+
transparent 70%
|
|
358
|
+
);
|
|
359
|
+
box-shadow: 0 0 12px 4px rgba(255, 255, 255, 0.15);
|
|
360
|
+
filter: blur(1px);
|
|
361
|
+
border-radius: 50%;
|
|
362
|
+
}
|
|
363
|
+
|
|
364
|
+
.SuggestionItem-module_pressed_98o-r .SuggestionItem-module_streaks_d9PEB::before {
|
|
365
|
+
animation: SuggestionItem-module_streakHorizRight_aboGz 500ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
366
|
+
}
|
|
367
|
+
|
|
368
|
+
.SuggestionItem-module_pressed_98o-r .SuggestionItem-module_streaks_d9PEB::after {
|
|
369
|
+
animation: SuggestionItem-module_streakHorizLeft_BreWJ 500ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
370
|
+
}
|
|
371
|
+
|
|
372
|
+
.SuggestionItem-module_pressed_98o-r .SuggestionItem-module_streaksVert_ERlV1::before {
|
|
373
|
+
animation: SuggestionItem-module_streakVertUp_to1GD 300ms cubic-bezier(0.3, 0, 0.2, 1) 200ms forwards;
|
|
374
|
+
}
|
|
375
|
+
|
|
376
|
+
.SuggestionItem-module_pressed_98o-r .SuggestionItem-module_streaksVert_ERlV1::after {
|
|
377
|
+
animation: SuggestionItem-module_streakVertDown_OrcLh 300ms cubic-bezier(0.3, 0, 0.2, 1) 200ms forwards;
|
|
378
|
+
}
|
|
379
|
+
|
|
380
|
+
/* Horizontal: bottom center-ish \u2192 right edge */
|
|
381
|
+
@keyframes SuggestionItem-module_streakHorizRight_aboGz {
|
|
382
|
+
0% {
|
|
383
|
+
width: 0;
|
|
384
|
+
height: 4px;
|
|
385
|
+
opacity: 0;
|
|
386
|
+
filter: blur(1px);
|
|
387
|
+
box-shadow: 0 0 8px 3px rgba(255, 255, 255, 0.3);
|
|
388
|
+
}
|
|
389
|
+
15% {
|
|
390
|
+
height: 4px;
|
|
391
|
+
opacity: 1;
|
|
392
|
+
filter: blur(1px);
|
|
393
|
+
box-shadow: 0 0 10px 4px rgba(255, 255, 255, 0.3);
|
|
394
|
+
}
|
|
395
|
+
80% {
|
|
396
|
+
width: 50%;
|
|
397
|
+
height: 10px;
|
|
398
|
+
opacity: 0.8;
|
|
399
|
+
filter: blur(3px);
|
|
400
|
+
box-shadow: 0 0 16px 6px rgba(255, 255, 255, 0.1);
|
|
401
|
+
}
|
|
402
|
+
100% {
|
|
403
|
+
width: 50%;
|
|
404
|
+
height: 12px;
|
|
405
|
+
opacity: 0;
|
|
406
|
+
filter: blur(5px);
|
|
407
|
+
box-shadow: 0 0 20px 8px rgba(255, 255, 255, 0.03);
|
|
408
|
+
}
|
|
409
|
+
}
|
|
410
|
+
|
|
411
|
+
/* Horizontal: top center-ish \u2192 left edge */
|
|
412
|
+
@keyframes SuggestionItem-module_streakHorizLeft_BreWJ {
|
|
413
|
+
0% {
|
|
414
|
+
width: 0;
|
|
415
|
+
height: 4px;
|
|
416
|
+
opacity: 0;
|
|
417
|
+
filter: blur(1px);
|
|
418
|
+
box-shadow: 0 0 8px 3px rgba(255, 255, 255, 0.3);
|
|
419
|
+
}
|
|
420
|
+
15% {
|
|
421
|
+
height: 4px;
|
|
422
|
+
opacity: 1;
|
|
423
|
+
filter: blur(1px);
|
|
424
|
+
box-shadow: 0 0 10px 4px rgba(255, 255, 255, 0.3);
|
|
425
|
+
}
|
|
426
|
+
80% {
|
|
427
|
+
width: 50%;
|
|
428
|
+
height: 10px;
|
|
429
|
+
opacity: 0.8;
|
|
430
|
+
filter: blur(3px);
|
|
431
|
+
box-shadow: 0 0 16px 6px rgba(255, 255, 255, 0.1);
|
|
432
|
+
}
|
|
433
|
+
100% {
|
|
434
|
+
width: 50%;
|
|
435
|
+
height: 12px;
|
|
436
|
+
opacity: 0;
|
|
437
|
+
filter: blur(5px);
|
|
438
|
+
box-shadow: 0 0 20px 8px rgba(255, 255, 255, 0.03);
|
|
439
|
+
}
|
|
440
|
+
}
|
|
441
|
+
|
|
442
|
+
/* Vertical segments start matching horizontal state at 200ms handoff */
|
|
443
|
+
@keyframes SuggestionItem-module_streakVertUp_to1GD {
|
|
444
|
+
0% {
|
|
445
|
+
height: 0;
|
|
446
|
+
width: 6px;
|
|
447
|
+
opacity: 0.9;
|
|
448
|
+
filter: blur(1.8px);
|
|
449
|
+
box-shadow: 0 0 12px 5px rgba(255, 255, 255, 0.25);
|
|
450
|
+
}
|
|
451
|
+
75% {
|
|
452
|
+
height: 100%;
|
|
453
|
+
width: 10px;
|
|
454
|
+
opacity: 0.4;
|
|
455
|
+
filter: blur(3px);
|
|
456
|
+
box-shadow: 0 0 18px 8px rgba(255, 255, 255, 0.06);
|
|
457
|
+
}
|
|
458
|
+
100% {
|
|
459
|
+
height: 100%;
|
|
460
|
+
width: 14px;
|
|
461
|
+
opacity: 0;
|
|
462
|
+
filter: blur(5px);
|
|
463
|
+
box-shadow: 0 0 24px 10px rgba(255, 255, 255, 0.02);
|
|
464
|
+
}
|
|
465
|
+
}
|
|
466
|
+
|
|
467
|
+
@keyframes SuggestionItem-module_streakVertDown_OrcLh {
|
|
468
|
+
0% {
|
|
469
|
+
height: 0;
|
|
470
|
+
width: 6px;
|
|
471
|
+
opacity: 0.9;
|
|
472
|
+
filter: blur(1.8px);
|
|
473
|
+
box-shadow: 0 0 12px 5px rgba(255, 255, 255, 0.25);
|
|
474
|
+
}
|
|
475
|
+
75% {
|
|
476
|
+
height: 100%;
|
|
477
|
+
width: 10px;
|
|
478
|
+
opacity: 0.4;
|
|
479
|
+
filter: blur(3px);
|
|
480
|
+
box-shadow: 0 0 18px 8px rgba(255, 255, 255, 0.06);
|
|
481
|
+
}
|
|
482
|
+
100% {
|
|
483
|
+
height: 100%;
|
|
484
|
+
width: 14px;
|
|
485
|
+
opacity: 0;
|
|
486
|
+
filter: blur(5px);
|
|
487
|
+
box-shadow: 0 0 24px 10px rgba(255, 255, 255, 0.02);
|
|
488
|
+
}
|
|
489
|
+
}
|
|
490
|
+
`,document.head.appendChild(e)}var q={item:"SuggestionItem-module_item_d4vpD",fadeIn:"SuggestionItem-module_fadeIn_I8u35",content:"SuggestionItem-module_content_T-Qba",tappable:"SuggestionItem-module_tappable_70KcX",nonTappable:"SuggestionItem-module_nonTappable_xSZM-",highlighted:"SuggestionItem-module_highlighted_Hb0SU",tag:"SuggestionItem-module_tag_e3Fwe",pressed:"SuggestionItem-module_pressed_98o-r",glassFade:"SuggestionItem-module_glassFade_oyiSj",tapDown:"SuggestionItem-module_tapDown_G3WGz",streaks:"SuggestionItem-module_streaks_d9PEB",streaksVert:"SuggestionItem-module_streaksVert_ERlV1",streakHorizRight:"SuggestionItem-module_streakHorizRight_aboGz",streakHorizLeft:"SuggestionItem-module_streakHorizLeft_BreWJ",streakVertUp:"SuggestionItem-module_streakVertUp_to1GD",streakVertDown:"SuggestionItem-module_streakVertDown_OrcLh"};import{jsx as we,jsxs as Ue}from"react/jsx-runtime";function $e({option:e,isHighlighted:i,onSelect:t,onHighlight:o,id:r}){let[a,l]=dt(!1),d=pt(void 0),p=()=>{!e.is_tappable||a||(l(!0),t(e),clearTimeout(d.current),d.current=setTimeout(()=>l(!1),400))},c=[q.item,i?q.highlighted:"",e.is_tappable?q.tappable:q.nonTappable,a?q.pressed:""].filter(Boolean).join(" ");return Ue("div",{id:r,role:"option","aria-selected":i,className:c,tabIndex:e.is_tappable?0:-1,onClick:p,onKeyDown:u=>{e.is_tappable&&(u.key==="Enter"||u.key===" ")&&(u.preventDefault(),p())},onMouseEnter:o,children:[we("div",{className:q.streaks}),we("div",{className:q.streaksVert}),Ue("span",{className:q.content,children:[e.icon?`${e.icon} ${e.text}`:e.text,e.tag&&we("span",{className:q.tag,children:e.tag})]})]})}import{jsx as De}from"react/jsx-runtime";function He({options:e,activeIndex:i,onSelect:t,onHighlight:o,listboxId:r}){return De("div",{className:Fe.grid,children:e.map((a,l)=>De($e,{option:a,isHighlighted:l===i,onSelect:t,onHighlight:()=>o(l),id:`${r}-option-${l}`},a.text))})}import{jsx as Ne}from"react/jsx-runtime";function Pe({suggestions:e,activeIndex:i,onSelect:t,onHighlight:o,isOpen:r,id:a,className:l}){let p=e[0]?.options??[],c=r&&p.length>0;return Ne("div",{id:a,role:"listbox",className:`${Ie.dropdown} ${c?Ie.visible:""} ${l??""}`,onMouseDown:u=>u.preventDefault(),children:p.length>0&&Ne(He,{options:p,activeIndex:i,onSelect:t,onHighlight:o,listboxId:a})})}if(typeof document<"u"&&!document.getElementById("ac-style-b745b4fb")){let e=document.createElement("style");e.id="ac-style-b745b4fb",e.textContent=`.PillList-module_list_qvLqO {
|
|
174
491
|
position: relative;
|
|
175
492
|
z-index: 1;
|
|
176
493
|
pointer-events: auto;
|
|
@@ -212,5 +529,5 @@ import{forwardRef as bt,useCallback as ht,useEffect as yt,useImperativeHandle as
|
|
|
212
529
|
opacity: 0;
|
|
213
530
|
}
|
|
214
531
|
}
|
|
215
|
-
`,document.head.appendChild(e)}var se={list:"PillList-module_list_qvLqO",pill:"PillList-module_pill_osSyz",fadeIn:"PillList-module_fadeIn_Aezob",active:"PillList-module_active_Oll--"};import{jsx as Ue}from"react/jsx-runtime";function at(e){return e===0?.4:e===1?.3:.15}function De({pills:e,activePillIndex:r,onSelectPill:t}){return Ue("span",{className:se.list,children:e.map((o,n)=>Ue("button",{type:"button",className:`${se.pill} ${n===r?se.active:""}`,style:{opacity:at(n)},onClick:()=>t(n),children:o.text},`${o.type}-${o.text}`))})}import{useCallback as ee,useMemo as ce,useRef as O,useState as ue}from"react";function Z(e,r,t){let o=e.slice(r);if(t||r===0||e[r-1]===" ")return o;let n=o.indexOf(" ");return n===-1?"":o.slice(n+1)}function le(e,r){if(!e)return[];let t=r.trimStart();if(!t)return e;let o=t.toLowerCase();return e.filter(n=>!n.is_tappable||n.text.toLowerCase().includes(o))}function ie(e,r){if(!e)return null;let t=r.trim();if(!t)return null;let o=t.toLowerCase();return e.find(n=>n.is_tappable&&n.text.toLowerCase()===o)??null}function Ke(e,r){let t=[],o=0;for(let i of r){let s=e.indexOf(i.text,o);s!==-1&&(s>o&&t.push({type:"text",value:e.slice(o,s)}),t.push({type:"completed",value:i.text,param:i}),o=s+i.text.length)}let n=e.slice(o);return n&&t.push({type:"text",value:n}),t}function je(e,r){let t=[],o=[],n=0;for(let i of r){let s=e.indexOf(i.text,n);s===-1?o.push(i):(t.push(i),n=s+i.text.length)}return{valid:t,invalid:o}}import{useCallback as ut,useEffect as Ne,useRef as Y,useState as Ae}from"react";var st="0.1.14",ze=!1;function lt(){return crypto.randomUUID()}function ct(e,r){return{placeholder:e.placeholder,type:e.type,...r&&{text:e.text},kind:e.kind}}async function Fe(e,r,t){let o=t?.apiConfig,n=o?.apiKey??"";!n&&!ze&&(ze=!0,console.warn("[AIAutocomplete] No apiKey in apiConfig. Requests will be sent without an Authorization header."));let i=o?.authScheme??"Bearer",s=!t?.maskCompletedText,b=r.find(m=>m.type==="contact"&&m.metadata?.contact_account_count)?.metadata?.contact_account_count,d=typeof b=="number"?b:void 0,c={data:{raw_query:e,completed_params:r.map(m=>ct(m,s)),...d!=null&&{contact_account_count:d}},meta:{request_id:lt(),request_at:new Date().toISOString(),language:typeof navigator<"u"?navigator.language:"en-US",client_version:st}},u={"Content-Type":"application/json",...o?.appIdentifier&&{"X-App-Identifier":o.appIdentifier},...o?.headers};n&&(u.Authorization=i==="Basic"?`Basic ${btoa(n)}`:`Bearer ${n}`);let h=await fetch(o?.endpoint??"/ac/suggest",{method:"POST",headers:u,body:JSON.stringify(c),signal:t?.signal});if(!h.ok)throw new Error(`API error: ${h.status} ${h.statusText}`);return h.json()}function J(e,r){let t=e,o={},n=[];for(let i of r){let s=(o[i.type]??0)+1;o[i.type]=s;let d=`{{${i.type.toUpperCase().replace(/\s+/g,"_")}_${s}}}`,c=t.indexOf(i.text);c!==-1&&(t=t.slice(0,c)+d+t.slice(c+i.text.length)),n.push({...i,placeholder:d})}return{rawQuery:t,completedParams:n}}function qe(e,r){return r?e.map(t=>{let o=r[t.type];if(!o)return t;let n=o("");if(n.length===0)return t;let i=new Set(n.map(b=>b.text)),s=(t.options??[]).filter(b=>!i.has(b.text));return{...t,options:[...n,...s]}}):e}var pt=100,dt=300,mt=2;function Qe({textRef:e,suggestionsRef:r,filterBaseRef:t,filterInProgressRef:o,maskCompletedTextRef:n,apiConfigRef:i,optionOverridesRef:s,onErrorRef:b,setCompletedParams:d,setSuggestions:c,setActiveDropdownIndex:u}){let[h,m]=Ae(!1),[f,A]=Ae(null),[S,_]=Ae(!1),I=Y(0),x=Y(null),C=Y(""),g=ut(async(p,a)=>{x.current?.abort();let l=new AbortController;x.current=l;let M=++I.current,R=e.current.length;r.current.some(E=>E.type!=="placeholder")||m(!0),A(null);try{let E=await Fe(p,a,{maskCompletedText:n.current,signal:l.signal,apiConfig:i.current});if(M!==I.current)return;let D=qe(E.data.suggestions??[],s.current);_(E.data.is_ready??!1),C.current=p;let T=E.data.input??[],k=T[T.length-1],L=e.current;if(k?.state==="in_progress"){o.current=!0;let z=L.toLowerCase().lastIndexOf(k.text.toLowerCase());z!==-1?t.current=z:t.current=R}else o.current=!1,t.current=R;let j=D.filter(z=>z.type!=="placeholder")[0];if(j){let z=Z(L,t.current,o.current),N=ie(j.options,z);N&&(d(B=>[...B,{id:crypto.randomUUID(),placeholder:"",type:j.type,text:N.text,kind:N.kind,suggestionType:j.type,suggestionPlaceholder:j.text,options:j.options??[],metadata:N.metadata}]),D=D.filter(B=>B!==j))}c(D),m(!1),u(-1)}catch(E){if(M===I.current){let D=E instanceof Error?E:new Error(String(E));A(D),m(!1),b.current?.(D)}}},[e,r,t,o,n,i,s,b,d,c,u]);return Ne(()=>(g("",[]),()=>{x.current?.abort()}),[g]),{doFetch:g,isLoading:h,error:f,isReady:S,lastRawQueryRef:C}}function $e({text:e,completedParams:r,doFetch:t,filterBaseRef:o,filterInProgressRef:n,skipNextFetchRef:i,suggestionsRef:s,lastRawQueryRef:b}){let d=Y(null),c=Y(null),u=Y(!0);Ne(()=>{d.current&&clearTimeout(d.current),c.current&&clearTimeout(c.current);let h=m=>{if(i.current)return i.current=!1,!1;if(!e&&r.length===0)return u.current?(t("",[]),!0):(u.current=!0,!1);let f=Z(e,o.current,n.current),_=s.current.filter(R=>R.type!=="placeholder")[0],x=(_?le(_.options,f):[]).filter(R=>R.is_tappable),C=_?ie(_.options,f)!==null:!1,g=f.trim().length>0;if(x.length>0&&!C&&g)return!1;let{rawQuery:p,completedParams:a}=J(e,r),l=p.length<b.current.length,M=Math.abs(p.length-b.current.length);return l||M>=m?(t(p,a),!0):!1};return d.current=setTimeout(()=>{h(mt)&&c.current&&clearTimeout(c.current)},pt),c.current=setTimeout(()=>h(1),dt),()=>{d.current&&clearTimeout(d.current),c.current&&clearTimeout(c.current)}},[e,r,t,o,n,i,s,b])}import{useCallback as Be}from"react";function He({activeDropdownIndex:e,setActiveDropdownIndex:r,filteredOptions:t,selectOption:o,onSubmitRef:n,text:i,completedParams:s,isDropdownOpen:b,hasPlaceholder:d,placeholderText:c,suggestions:u,actionableSuggestions:h,setActivePill:m,filterBaseRef:f,columns:A,setText:S,setCompletedParams:_,setSuggestions:I}){let x=Be(()=>{let g=t.map((a,l)=>a.is_tappable?l:-1).filter(a=>a!==-1),p=Array.from({length:A},()=>[]);for(let a of g)p[a%A].push(a);return p.flat()},[t,A]);return{handleKeyDown:Be(g=>{let p=x();switch(g.key){case"ArrowDown":{if(g.preventDefault(),p.length===0)return;let a=p.indexOf(e),l=a<p.length-1?a+1:0;r(p[l]);break}case"ArrowUp":{if(g.preventDefault(),p.length===0)return;let a=p.indexOf(e),l=a>0?a-1:p.length-1;r(p[l]);break}case"ArrowRight":{if(e<0){let l=g.target;l.selectionStart!=null&&l.selectionStart===l.value.length&&h.length>1&&(g.preventDefault(),m(1));break}if(e%A<A-1){let l=e+1;l<t.length&&t[l]?.is_tappable&&(g.preventDefault(),r(l))}break}case"ArrowLeft":{if(e<0)break;if(e%A>0){let a=e-1;a>=0&&t[a]?.is_tappable&&(g.preventDefault(),r(a))}break}case"Enter":{if(g.preventDefault(),e>=0&&t[e]?.is_tappable)o(t[e]);else if(n.current){let{rawQuery:a,completedParams:l}=J(i,s),M={query:i.trim(),raw_query:a,completed_params:l};n.current(M)}break}case"Tab":{if(e>=0&&t[e]?.is_tappable)g.preventDefault(),o(t[e]);else if(b){let a=t.find(l=>l.is_tappable);a&&(g.preventDefault(),o(a))}else if(!i&&d){g.preventDefault();let a=u.find(l=>l.type==="placeholder");a?(S(c),f.current=c.length,_(l=>[...l,{id:crypto.randomUUID(),placeholder:"",type:a.type,text:c,kind:null,suggestionType:a.type,suggestionPlaceholder:a.text,options:a.options??[]}]),I(l=>l.filter(M=>M!==a))):(S(c),f.current=c.length)}break}case"Escape":r(-1);break}},[h,e,A,s,t,f,x,d,b,n,c,o,r,m,_,I,S,u,i]),getTappableIndices:x}}import{useCallback as _e}from"react";function We({completedParams:e,suggestions:r,setCompletedParams:t,setSuggestions:o,setActiveDropdownIndex:n,filterBaseRef:i,pillTappedRef:s}){let b=_e(u=>{let h=r.filter(S=>S.type!=="placeholder");if(u<0||u>=h.length)return;let m=h[u],f=h.filter((S,_)=>_!==u),A=r.filter(S=>S.type==="placeholder");o([...A,m,...f]),s.current=!0,n(-1)},[r,o,n,s]),d=_e(()=>{if(e.length===0)return;let u=e[e.length-1],h={type:u.suggestionType,text:u.suggestionPlaceholder,required:!0,options:u.options};t(m=>m.slice(0,-1)),o(m=>[h,...m]),n(-1)},[e,t,o,n]),c=_e(u=>{let h={type:u.suggestionType,text:u.suggestionPlaceholder,required:!0,options:u.options};return{apply:m=>{m(f=>{let A=0;for(let S of e){let _=f.indexOf(S.text,A);if(_!==-1){if(S.id===u.id){let I=f.slice(0,_),x=f.slice(_+u.text.length),C=(I+x).replace(/ {2,}/g," ");return i.current=Math.min(i.current,C.length),C}A=_+S.text.length}}return f}),t(f=>f.filter(A=>A.id!==u.id)),o(f=>[h,...f]),n(-1),s.current=!0}}},[e,t,o,n,i,s]);return{setActivePill:b,removeLastParam:d,reEditParam:c}}var gt=0;function ft(){let e=O(null);return e.current===null&&(e.current=`:ac-${++gt}:`),e.current}function ve({onSubmit:e,onError:r,optionOverrides:t,maskCompletedText:o,placeholder:n,apiConfig:i,columns:s=2,eagerSuggestions:b=!0,value:d,completedParams:c,onChange:u,onParamsChange:h}){let m=d!==void 0,f=c!==void 0,[A,S]=ue(""),[_,I]=ue([]),[x,C]=ue([]),[g,p]=ue(-1),a=m?d:A,l=f?c:_,M=O(e);M.current=e;let R=O(u);R.current=u;let q=O(h);q.current=h;let E=O(d);E.current=d;let D=O(c);D.current=c;let T=ee(y=>{if(typeof y=="function")if(m){let P=y(E.current??"");R.current?.(P)}else S(P=>{let Q=y(P);return R.current?.(Q),Q});else m||S(y),R.current?.(y)},[m]),k=ee(y=>{if(typeof y=="function")if(f){let P=y(D.current??[]);q.current?.(P)}else I(P=>{let Q=y(P);return q.current?.(Q),Q});else f||I(y),q.current?.(y)},[f]),L=O(r);L.current=r;let $=O(t);$.current=t;let j=O(o);j.current=o;let z=O(i);z.current=i;let N=O(a);N.current=a;let B=O(x);B.current=x;let K=O(0),oe=O(!1),ae=O(!1),Pe=O(!1),pe=ft(),{doFetch:de,isLoading:Ce,error:Ge,isReady:Xe,lastRawQueryRef:me}=Qe({textRef:N,suggestionsRef:B,filterBaseRef:K,filterInProgressRef:oe,maskCompletedTextRef:j,apiConfigRef:z,optionOverridesRef:$,onErrorRef:L,setCompletedParams:k,setSuggestions:C,setActiveDropdownIndex:p});$e({text:a,completedParams:l,doFetch:de,filterBaseRef:K,filterInProgressRef:oe,skipNextFetchRef:Pe,suggestionsRef:B,lastRawQueryRef:me});let Ze=ce(()=>Ke(a,l),[a,l]);K.current=Math.min(K.current,a.length);let ge=Z(a,K.current,oe.current),fe=ce(()=>x.filter(P=>P.type==="placeholder").map(P=>P.text).join(" ")||n||"",[x,n]),ne=ce(()=>x.filter(y=>y.type!=="placeholder"),[x]),v=ne[0],Ie=v?t?.[v.type]:void 0,we=v?Ie?Ie(ge.trim()):v.options??[]:[],be=ce(()=>le(we,ge),[we,ge]),Oe=fe.length>0,he=!Ce&&be.length>0&&(!!a||ae.current||!Oe),Re=ee(y=>{if(!v)return;let P={id:crypto.randomUUID(),placeholder:"",type:v.type,text:y.text,kind:y.kind,suggestionType:v.type,suggestionPlaceholder:v.text,options:v.options??[],metadata:y.metadata},Q=K.current,U=N.current.slice(0,Q);if(U.length>0&&!U.endsWith(" ")){let w=U.split(/\s+/).pop()??"";w&&y.text.toLowerCase().startsWith(w.toLowerCase())&&(U=U.slice(0,U.length-w.length))}let ye=U.length>0&&U[U.length-1]!==" ",G=U+(ye?" ":"")+y.text+" ";T(G),K.current=G.length,k(w=>[...w,P]),ae.current=!1,p(-1);let H=ne.length-1;b&&H>0?(C(w=>w.filter(W=>W!==v)),Pe.current=!0):C(w=>w.filter(W=>W.type==="placeholder"))},[v,ne,b,T,k]),Je=ee(y=>{let P=y.target.value,U=P.length>0&&!y.nativeEvent?.isComposing&&P[0]!==P[0].toUpperCase()?P[0].toUpperCase()+P.slice(1):P;T(U),ae.current=!1,p(-1);let{valid:ye,invalid:G}=je(U,l);if(G.length>0){k(()=>ye);for(let H of G)C(w=>[{type:H.suggestionType,text:H.suggestionPlaceholder,required:!0,options:H.options},...w])}if(v&&G.length===0){let H=Z(U,K.current,oe.current),w=ie(v.options,H);w&&(k(W=>[...W,{id:crypto.randomUUID(),placeholder:"",type:v.type,text:w.text,kind:w.kind,suggestionType:v.type,suggestionPlaceholder:v.text,options:v.options??[],metadata:w.metadata}]),C(W=>W.filter(nt=>nt!==v)))}},[l,v,T,k]),re=We({completedParams:l,suggestions:x,setCompletedParams:k,setSuggestions:C,setActiveDropdownIndex:p,filterBaseRef:K,pillTappedRef:ae}),Ye=ee(y=>{re.reEditParam(y).apply(T)},[re,T]),{handleKeyDown:et}=He({activeDropdownIndex:g,setActiveDropdownIndex:p,filteredOptions:be,selectOption:Re,onSubmitRef:M,text:a,completedParams:l,isDropdownOpen:he,hasPlaceholder:Oe,placeholderText:fe,suggestions:x,actionableSuggestions:ne,setActivePill:re.setActivePill,filterBaseRef:K,columns:s,setText:T,setCompletedParams:k,setSuggestions:C}),tt=ee(()=>{T(""),k(()=>[]),C([]),p(-1),K.current=0,oe.current=!1,me.current="",de("",[])},[de,T,k,me]),ot=g>=0?`${pe}-option-${g}`:void 0;return{completedParams:l,suggestionPills:ne,setActivePill:re.setActivePill,removeLastParam:re.removeLastParam,reEditParam:Ye,segments:Ze,suggestions:x,activeIndex:g,isReady:Xe,isLoading:Ce,error:Ge,inputProps:{value:a,placeholder:fe||void 0,onChange:Je,onKeyDown:et,role:"combobox","aria-expanded":he,"aria-activedescendant":ot,"aria-autocomplete":"list","aria-controls":pe},reset:tt,dropdownProps:{suggestions:v?[{...v,options:be}]:[],activeIndex:g,onSelect:Re,onHighlight:p,isOpen:he,id:pe}}}import{jsx as V,jsxs as te}from"react/jsx-runtime";var xt=bt(function({onSubmit:r,onError:t,optionOverrides:o,maskCompletedText:n,placeholder:i,className:s,apiConfig:b,columns:d,eagerSuggestions:c,value:u,completedParams:h,onChange:m,onParamsChange:f},A){let S=Ve(null),_=Ve(()=>{});yt(()=>{S.current?.focus()},[]);let{completedParams:I,suggestionPills:x,setActivePill:C,segments:g,inputProps:p,dropdownProps:a,reset:l}=ve({onSubmit:L=>_.current(L),onError:t,optionOverrides:o,maskCompletedText:n,placeholder:i,apiConfig:b,columns:d,eagerSuggestions:c,value:u,completedParams:h,onChange:m,onParamsChange:f});St(A,()=>({focus:()=>S.current?.focus(),reset:l}),[l]);let M=()=>{S.current?.focus()},R=!!p.value||I.length>0,q=ht(()=>{if(!R)return;let{rawQuery:L,completedParams:$}=J(p.value,I);r({query:p.value.trim(),raw_query:L,completed_params:$}),l()},[R,p.value,I,r,l]);_.current=q;let{onChange:E,placeholder:D,...T}=p,k=!p.value;return te("div",{className:`${F.container} ${s??""}`,children:[V(xe,{...a}),te("div",{className:F.inputWrapper,onClick:M,children:[te("div",{className:F.editorArea,children:[te("div",{className:F.sizerContent,"aria-hidden":"true",children:[k&&D?te("span",{className:F.placeholderText,children:[D," "]}):te("span",{className:F.sizerText,children:[g.map((L,$)=>V("span",{children:L.value},`${$}-${L.type}`)),g.length===0&&"\xA0"]})," ",V(De,{pills:x,activePillIndex:0,onSelectPill:C})]}),V("textarea",{ref:S,className:F.textarea,rows:1,onChange:E,...T})]}),V("button",{type:"button",className:F.submitButton,disabled:!R,onClick:L=>{L.stopPropagation(),q()},"aria-label":"Submit",children:V("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:V("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]})});export{xt as AIAutocomplete,xe as AIAutocompleteDropdown,ve as useAIAutocomplete};
|
|
532
|
+
`,document.head.appendChild(e)}var be={list:"PillList-module_list_qvLqO",pill:"PillList-module_pill_osSyz",fadeIn:"PillList-module_fadeIn_Aezob",active:"PillList-module_active_Oll--"};import{jsx as Ve}from"react/jsx-runtime";function mt(e){return e===0?.4:e===1?.3:.15}function je({pills:e,activePillIndex:i,onSelectPill:t}){return Ve("span",{className:be.list,children:e.map((o,r)=>Ve("button",{type:"button",className:`${be.pill} ${r===i?be.active:""}`,style:{opacity:mt(r)},onClick:()=>t(r),children:o.text},`${o.type}-${o.text}`))})}import{useCallback as ee,useMemo as xe,useRef as M,useState as ge}from"react";function ie(e,i,t){let o=e.slice(i);if(t||i===0||e[i-1]===" ")return o;let r=o.indexOf(" ");return r===-1?"":o.slice(r+1)}function he(e,i){if(!e)return[];let t=i.trimStart();if(!t)return e;let o=t.toLowerCase();return e.filter(r=>!r.is_tappable||r.text.toLowerCase().includes(o))}function me(e,i){if(!e)return null;let t=i.trim();if(!t)return null;let o=t.toLowerCase();return e.find(r=>r.is_tappable&&r.text.toLowerCase()===o)??null}function Be(e,i){let t=[],o=0;for(let a of i){let l=e.indexOf(a.text,o);l!==-1&&(l>o&&t.push({type:"text",value:e.slice(o,l)}),t.push({type:"completed",value:a.text,param:a}),o=l+a.text.length)}let r=e.slice(o);return r&&t.push({type:"text",value:r}),t}function Ke(e,i){let t=[],o=[],r=0;for(let a of i){let l=e.indexOf(a.text,r);l===-1?o.push(a):(t.push(a),r=l+a.text.length)}return{valid:t,invalid:o}}import{useCallback as ht,useEffect as We,useRef as se,useState as ke}from"react";var gt="0.1.16",qe=!1;function ft(){return crypto.randomUUID()}function bt(e,i){return{placeholder:e.placeholder,type:e.type,...i&&{text:e.text},kind:e.kind}}async function Qe(e,i,t){let o=t?.apiConfig,r=o?.apiKey??"";!r&&!qe&&(qe=!0,console.warn("[AIAutocomplete] No apiKey in apiConfig. Requests will be sent without an Authorization header."));let a=o?.authScheme??"Bearer",l=!t?.maskCompletedText,d=i.find(g=>g.type==="contact"&&g.metadata?.contact_account_count)?.metadata?.contact_account_count,p=typeof d=="number"?d:void 0,c={data:{raw_query:e,completed_params:i.map(g=>bt(g,l)),...p!=null&&{contact_account_count:p}},meta:{request_id:ft(),request_at:new Date().toISOString(),language:typeof navigator<"u"?navigator.language:"en-US",client_version:gt}},u={"Content-Type":"application/json",...o?.appIdentifier&&{"X-App-Identifier":o.appIdentifier},...o?.headers};r&&(u.Authorization=a==="Basic"?`Basic ${btoa(r)}`:`Bearer ${r}`);let m=await fetch(o?.endpoint??"/ac/suggest",{method:"POST",headers:u,body:JSON.stringify(c),signal:t?.signal});if(!m.ok)throw new Error(`API error: ${m.status} ${m.statusText}`);return m.json()}function ae(e,i){let t=e,o={},r=[];for(let a of i){let l=(o[a.type]??0)+1;o[a.type]=l;let p=`{{${a.type.toUpperCase().replace(/\s+/g,"_")}_${l}}}`,c=t.indexOf(a.text);c!==-1&&(t=t.slice(0,c)+p+t.slice(c+a.text.length)),r.push({...a,placeholder:p})}return{rawQuery:t,completedParams:r}}function Ge(e,i){return i?e.map(t=>{let o=i[t.type];if(!o)return t;let r=o("");if(r.length===0)return t;let a=new Set(r.map(d=>d.text)),l=(t.options??[]).filter(d=>!a.has(d.text));return{...t,options:[...r,...l]}}):e}var xt=100,yt=300,_t=2;function Je({textRef:e,suggestionsRef:i,filterBaseRef:t,filterInProgressRef:o,maskCompletedTextRef:r,apiConfigRef:a,optionOverridesRef:l,onErrorRef:d,setCompletedParams:p,setSuggestions:c,setActiveDropdownIndex:u}){let[m,g]=ke(!1),[y,T]=ke(null),[I,f]=ke(!1),_=se(0),S=se(null),h=se(""),A=ht(async(N,v)=>{S.current?.abort();let w=new AbortController;S.current=w;let n=++_.current,s=e.current.length;i.current.some(E=>E.type!=="placeholder")||g(!0),T(null);try{let E=await Qe(N,v,{maskCompletedText:r.current,signal:w.signal,apiConfig:a.current});if(n!==_.current)return;let R=Ge(E.data.suggestions??[],l.current);f(E.data.is_ready??!1),h.current=N;let Z=E.data.input??[],G=Z[Z.length-1],F=e.current;if(G?.state==="in_progress"){o.current=!0;let V=F.toLowerCase().lastIndexOf(G.text.toLowerCase());V!==-1?t.current=V:t.current=s}else o.current=!1,t.current=s;let D=R.filter(V=>V.type!=="placeholder")[0];if(D){let V=ie(F,t.current,o.current),W=me(D.options,V);W&&(p(x=>[...x,{id:crypto.randomUUID(),placeholder:"",type:D.type,text:W.text,kind:W.kind,suggestionType:D.type,suggestionPlaceholder:D.text,options:D.options??[],metadata:W.metadata}]),R=R.filter(x=>x!==D))}c(R),g(!1),u(-1)}catch(E){if(n===_.current){let R=E instanceof Error?E:new Error(String(E));T(R),g(!1),d.current?.(R)}}},[e,i,t,o,r,a,l,d,p,c,u]);return We(()=>(A("",[]),()=>{S.current?.abort()}),[A]),{doFetch:A,isLoading:m,error:y,isReady:I,lastRawQueryRef:h}}function Xe({text:e,completedParams:i,doFetch:t,filterBaseRef:o,filterInProgressRef:r,skipNextFetchRef:a,suggestionsRef:l,lastRawQueryRef:d}){let p=se(null),c=se(null),u=se(!0);We(()=>{if(p.current&&clearTimeout(p.current),c.current&&clearTimeout(c.current),a.current){a.current=!1;return}let m=g=>{if(!e&&i.length===0)return u.current?(t("",[]),!0):(u.current=!0,!1);let y=ie(e,o.current,r.current),f=l.current.filter(s=>s.type!=="placeholder")[0],S=(f?he(f.options,y):[]).filter(s=>s.is_tappable),h=f?me(f.options,y)!==null:!1,A=y.trim().length>0;if(S.length>0&&!h&&A)return!1;let{rawQuery:N,completedParams:v}=ae(e,i),w=N.length<d.current.length,n=Math.abs(N.length-d.current.length);return w||n>=g?(t(N,v),!0):!1};return p.current=setTimeout(()=>{m(_t)&&c.current&&clearTimeout(c.current)},xt),c.current=setTimeout(()=>m(1),yt),()=>{p.current&&clearTimeout(p.current),c.current&&clearTimeout(c.current)}},[e,i,t,o,r,a,l,d])}import{useCallback as Ze}from"react";function Ye({activeDropdownIndex:e,setActiveDropdownIndex:i,filteredOptions:t,selectOption:o,onSubmitRef:r,text:a,completedParams:l,isDropdownOpen:d,hasPlaceholder:p,placeholderText:c,suggestions:u,actionableSuggestions:m,setActivePill:g,listboxId:y,pillTappedRef:T,filterBaseRef:I,columns:f,setText:_,setCompletedParams:S,setSuggestions:h}){let A=Ze(()=>{let v=t.map((n,s)=>n.is_tappable?s:-1).filter(n=>n!==-1),w=Array.from({length:f},()=>[]);for(let n of v)w[n%f].push(n);return w.flat()},[t,f]);return{handleKeyDown:Ze(v=>{let w=A();switch(v.key){case"ArrowDown":{let n=v.target;if(!(n.selectionStart!=null&&n.selectionStart===n.value.length)&&e<0)break;if(v.preventDefault(),!d&&m.length>0){T.current=!0;let R=w[0];i(R??0);break}if(w.length===0)return;let k=w.indexOf(e),E=k<w.length-1?k+1:0;i(w[E]);break}case"ArrowUp":{if(w.length===0||e<0)break;if(v.preventDefault(),e<f){i(-1);break}let s=w.indexOf(e),k=s>0?s-1:w.length-1;i(w[k]);break}case"ArrowRight":{if(e<0){let s=v.target;s.selectionStart!=null&&s.selectionStart===s.value.length&&m.length>1&&(v.preventDefault(),g(1));break}if(e%f<f-1){let s=e+1;s<t.length&&t[s]?.is_tappable&&(v.preventDefault(),i(s))}break}case"ArrowLeft":{if(e<0)break;if(e%f>0){let n=e-1;n>=0&&t[n]?.is_tappable&&(v.preventDefault(),i(n))}break}case"Enter":{if(v.preventDefault(),e>=0&&t[e]?.is_tappable){let n=document.getElementById(`${y}-option-${e}`);n?n.click():o(t[e])}else if(r.current){let{rawQuery:n,completedParams:s}=ae(a,l),k={query:a.trim(),raw_query:n,completed_params:s};r.current(k)}break}case"Tab":{if(e>=0&&t[e]?.is_tappable){v.preventDefault();let n=document.getElementById(`${y}-option-${e}`);n?n.click():o(t[e])}else if(d){let n=t.findIndex(s=>s.is_tappable);if(n>=0){v.preventDefault();let s=document.getElementById(`${y}-option-${n}`);s?s.click():o(t[n])}}else if(!a&&p){v.preventDefault();let n=u.find(s=>s.type==="placeholder");n?(_(c),I.current=c.length,S(s=>[...s,{id:crypto.randomUUID(),placeholder:"",type:n.type,text:c,kind:null,suggestionType:n.type,suggestionPlaceholder:n.text,options:n.options??[]}]),h(s=>s.filter(k=>k!==n))):(_(c),I.current=c.length)}break}case"Escape":i(-1);break}},[m,e,f,l,t,I,A,p,y,T,d,r,c,o,i,g,S,h,_,u,a]),getTappableIndices:A}}import{useCallback as Ce}from"react";function et({completedParams:e,suggestions:i,setCompletedParams:t,setSuggestions:o,setActiveDropdownIndex:r,filterBaseRef:a,pillTappedRef:l}){let d=Ce(u=>{let m=i.filter(I=>I.type!=="placeholder");if(u<0||u>=m.length)return;let g=m[u],y=m.filter((I,f)=>f!==u),T=i.filter(I=>I.type==="placeholder");o([...T,g,...y]),l.current=!0,r(-1)},[i,o,r,l]),p=Ce(()=>{if(e.length===0)return;let u=e[e.length-1],m={type:u.suggestionType,text:u.suggestionPlaceholder,required:!0,options:u.options};t(g=>g.slice(0,-1)),o(g=>[m,...g]),r(-1)},[e,t,o,r]),c=Ce(u=>{let m={type:u.suggestionType,text:u.suggestionPlaceholder,required:!0,options:u.options};return{apply:g=>{g(y=>{let T=0;for(let I of e){let f=y.indexOf(I.text,T);if(f!==-1){if(I.id===u.id){let _=y.slice(0,f),S=y.slice(f+u.text.length),h=(_+S).replace(/ {2,}/g," ");return a.current=Math.min(a.current,h.length),h}T=f+I.text.length}}return y}),t(y=>y.filter(T=>T.id!==u.id)),o(y=>[m,...y]),r(-1),l.current=!0}}},[e,t,o,r,a,l]);return{setActivePill:d,removeLastParam:p,reEditParam:c}}var St=0;function At(){let e=M(null);return e.current===null&&(e.current=`:ac-${++St}:`),e.current}function Re({onSubmit:e,onError:i,optionOverrides:t,maskCompletedText:o,placeholder:r,apiConfig:a,columns:l=2,value:d,completedParams:p,onChange:c,onParamsChange:u}){let m=d!==void 0,g=p!==void 0,[y,T]=ge(""),[I,f]=ge([]),[_,S]=ge([]),[h,A]=ge(-1),[N,v]=ge(null),w=ee(()=>v(null),[]),n=m?d:y,s=g?p:I,k=M(e);k.current=e;let E=M(c);E.current=c;let R=M(u);R.current=u;let Z=M(d);Z.current=d;let G=M(p);G.current=p;let F=ee(b=>{if(typeof b=="function")if(m){let C=b(Z.current??"");E.current?.(C)}else T(C=>{let O=b(C);return E.current?.(O),O});else m||T(b),E.current?.(b)},[m]),$=ee(b=>{if(typeof b=="function")if(g){let C=b(G.current??[]);R.current?.(C)}else f(C=>{let O=b(C);return R.current?.(O),O});else g||f(b),R.current?.(b)},[g]),D=M(i);D.current=i;let V=M(t);V.current=t;let W=M(o);W.current=o;let x=M(a);x.current=a;let U=M(n);U.current=n;let oe=M(_);oe.current=_;let z=M(0),j=M(!1),H=M(!1),le=M(!1),J=At(),{doFetch:ue,isLoading:Te,error:ot,isReady:rt,lastRawQueryRef:ye}=Je({textRef:U,suggestionsRef:oe,filterBaseRef:z,filterInProgressRef:j,maskCompletedTextRef:W,apiConfigRef:x,optionOverridesRef:V,onErrorRef:D,setCompletedParams:$,setSuggestions:S,setActiveDropdownIndex:A});Xe({text:n,completedParams:s,doFetch:ue,filterBaseRef:z,filterInProgressRef:j,skipNextFetchRef:le,suggestionsRef:oe,lastRawQueryRef:ye});let nt=xe(()=>Be(n,s),[n,s]);z.current=Math.min(z.current,n.length);let _e=ie(n,z.current,j.current),re=xe(()=>_.filter(C=>C.type==="placeholder").map(C=>C.text).join(" ")||r||"",[_,r]),ce=xe(()=>_.filter(b=>b.type!=="placeholder"),[_]),P=ce[0],Ee=P?t?.[P.type]:void 0,ze=P?Ee?Ee(_e.trim()):P.options??[]:[],Se=xe(()=>he(ze,_e),[ze,_e]),Le=re.length>0,Ae=!Te&&Se.length>0&&(!!n||H.current||!Le),Me=ee(b=>{if(!P)return;let C=z.current,O=U.current.slice(0,C),ne=O.length===0&&U.current.length===0;if(ne&&re&&(O=re+" "),O.length>0&&!O.endsWith(" ")){let Y=O.split(/\s+/).pop()??"";Y&&b.text.toLowerCase().startsWith(Y.toLowerCase())&&(O=O.slice(0,O.length-Y.length))}let ve=O.length>0&&O[O.length-1]!==" ",X=O+(ve?" ":"")+b.text+" ",B=ne&&X.length>0?X[0].toUpperCase()+X.slice(1):X,K=B.toLowerCase().lastIndexOf(b.text.toLowerCase()),de=K>=0?B.slice(K,K+b.text.length):b.text,fe={id:crypto.randomUUID(),placeholder:"",type:P.type,text:de,kind:b.kind,suggestionType:P.type,suggestionPlaceholder:P.text,options:P.options??[],metadata:b.metadata};F(B),z.current=B.length,$(Y=>[...Y,fe]),v(fe.id),H.current=!1,A(-1),ce.length-1>0&&(le.current=!0),setTimeout(()=>{S(Y=>Y.filter(ct=>ct!==P))},400)},[P,ce,re,F,$]),it=ee(b=>{let C=b.target.value,ne=C.length>0&&!b.nativeEvent?.isComposing&&C[0]!==C[0].toUpperCase()?C[0].toUpperCase()+C.slice(1):C;F(ne),H.current=!1,A(-1);let{valid:ve,invalid:X}=Ke(ne,s);if(X.length>0){$(()=>ve);for(let B of X)S(K=>[{type:B.suggestionType,text:B.suggestionPlaceholder,required:!0,options:B.options},...K])}if(P&&X.length===0){let B=ie(ne,z.current,j.current),K=me(P.options,B);K&&($(de=>[...de,{id:crypto.randomUUID(),placeholder:"",type:P.type,text:K.text,kind:K.kind,suggestionType:P.type,suggestionPlaceholder:P.text,options:P.options??[],metadata:K.metadata}]),S(de=>de.filter(fe=>fe!==P)))}},[s,P,F,$]),pe=et({completedParams:s,suggestions:_,setCompletedParams:$,setSuggestions:S,setActiveDropdownIndex:A,filterBaseRef:z,pillTappedRef:H}),at=ee(b=>{pe.reEditParam(b).apply(F)},[pe,F]),{handleKeyDown:st}=Ye({activeDropdownIndex:h,setActiveDropdownIndex:A,filteredOptions:Se,selectOption:Me,onSubmitRef:k,text:n,completedParams:s,isDropdownOpen:Ae,hasPlaceholder:Le,placeholderText:re,suggestions:_,actionableSuggestions:ce,setActivePill:pe.setActivePill,listboxId:J,pillTappedRef:H,filterBaseRef:z,columns:l,setText:F,setCompletedParams:$,setSuggestions:S}),lt=ee(()=>{F(""),$(()=>[]),S([]),A(-1),z.current=0,j.current=!1,ye.current="",ue("",[])},[ue,F,$,ye]),ut=h>=0?`${J}-option-${h}`:void 0;return{completedParams:s,suggestionPills:ce,setActivePill:pe.setActivePill,removeLastParam:pe.removeLastParam,reEditParam:at,segments:nt,newParamId:N,clearNewParamId:w,suggestions:_,activeIndex:h,isReady:rt,isLoading:Te,error:ot,inputProps:{value:n,placeholder:re||void 0,onChange:it,onKeyDown:st,role:"combobox","aria-expanded":Ae,"aria-activedescendant":ut,"aria-autocomplete":"list","aria-controls":J},reset:lt,dropdownProps:{suggestions:P?[{...P,options:Se}]:[],activeIndex:h,onSelect:Me,onHighlight:A,isOpen:Ae,id:J}}}import{jsx as Q,jsxs as te}from"react/jsx-runtime";var kt=vt(function({onSubmit:i,onError:t,optionOverrides:o,maskCompletedText:r,placeholder:a,className:l,apiConfig:d,columns:p,typewriterEffect:c=!0,value:u,completedParams:m,onChange:g,onParamsChange:y},T){let I=Oe(null),f=Oe(()=>{}),[_,S]=Pt(0),h=Oe(void 0);tt(()=>(I.current?.focus(),()=>{h.current&&cancelAnimationFrame(h.current)}),[]);let{completedParams:A,suggestionPills:N,setActivePill:v,segments:w,newParamId:n,clearNewParamId:s,inputProps:k,dropdownProps:E,reset:R}=Re({onSubmit:x=>f.current(x),onError:t,optionOverrides:o,maskCompletedText:r,placeholder:a,apiConfig:d,columns:p,value:u,completedParams:m,onChange:g,onParamsChange:y});tt(()=>{if(h.current&&cancelAnimationFrame(h.current),!n){S(0);return}let x=A.find(H=>H.id===n);if(!x)return;let U=x.text.length;if(!c){S(U);let H=window.setTimeout(()=>s(),650);return()=>window.clearTimeout(H)}S(0);let oe=performance.now(),z=300,j=()=>{let H=performance.now()-oe,le=Math.min(H/z,1),J=Math.ceil(le*U);S(J),J<U?h.current=requestAnimationFrame(j):h.current=requestAnimationFrame(()=>{s()})};return h.current=requestAnimationFrame(j),()=>{h.current&&cancelAnimationFrame(h.current)}},[n,A,s,c]),wt(T,()=>({focus:()=>I.current?.focus(),reset:R}),[R]);let Z=()=>{I.current?.focus()},G=!!k.value||A.length>0,F=It(()=>{if(!G)return;let{rawQuery:x,completedParams:U}=ae(k.value,A);i({query:k.value.trim(),raw_query:x,completed_params:U}),R()},[G,k.value,A,i,R]);f.current=F;let{onChange:$,placeholder:D,...V}=k,W=!k.value;return te("div",{className:`${L.container} ${l??""}`,children:[Q(Pe,{...E}),te("div",{className:L.inputWrapper,onClick:Z,children:[te("div",{className:L.editorArea,children:[te("div",{className:L.sizerContent,"aria-hidden":"true",children:[W&&D?te("span",{className:L.placeholderText,children:[D," "]}):te("span",{className:`${L.sizerText} ${n?L.sizerTextVisible:""}`,children:[w.map((x,U)=>{if(x.type==="completed"&&x.param.id===n){if(!c){let ue=`${L.shimmerRevealed} ${L.shimmerSweep}`;return Q("span",{className:ue,children:x.value},`${U}-${x.type}`)}let z=x.value.length,j=x.value.slice(0,_),H=x.value.slice(_),J=`${100-(z>0?_/z:0)*100}% 0`;return te("span",{className:L.shimmer,children:[Q("span",{className:L.shimmerRevealed,style:{backgroundPosition:J},children:j}),Q("span",{className:L.shimmerHidden,children:H})]},`${U}-${x.type}`)}return Q("span",{children:x.value},`${U}-${x.type}`)}),w.length===0&&"\xA0"]})," ",Q(je,{pills:N,activePillIndex:0,onSelectPill:v})]}),Q("textarea",{ref:I,className:`${L.textarea} ${n?L.textareaHidden:""}`,rows:1,onChange:$,...V})]}),Q("button",{type:"button",className:L.submitButton,disabled:!G,onClick:x=>{x.stopPropagation(),F()},"aria-label":"Submit",children:Q("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:Q("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]})});export{kt as AIAutocomplete,Pe as AIAutocompleteDropdown,Re as useAIAutocomplete};
|
|
216
533
|
//# sourceMappingURL=index.mjs.map
|