@magicx-eng/ai-autocomplete-react 0.1.25 → 0.1.26
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 +28 -2
- package/dist/index.d.mts +3 -3
- package/dist/index.d.ts +3 -3
- package/dist/index.js +74 -41
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +74 -41
- 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 xt,useCallback as bt,useEffect as
|
|
1
|
+
import{forwardRef as xt,useCallback as bt,useEffect as _e,useImperativeHandle as vt,useRef as se}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-cc65f4cc")){let o=document.createElement("style");o.id="ac-style-cc65f4cc",o.textContent=`.AIAutocomplete-module_container_KKjFU {
|
|
2
2
|
position: relative;
|
|
3
3
|
font-family: "IBM Plex Sans", sans-serif;
|
|
4
4
|
container-type: inline-size;
|
|
@@ -47,7 +47,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
47
47
|
|
|
48
48
|
.AIAutocomplete-module_placeholderText_K3ayy {
|
|
49
49
|
color: var(--aia-color-text-muted, #c1c4cb);
|
|
50
|
-
opacity: 0.
|
|
50
|
+
opacity: 0.4;
|
|
51
51
|
}
|
|
52
52
|
|
|
53
53
|
.AIAutocomplete-module_textarea_eyn6A {
|
|
@@ -60,7 +60,10 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
60
60
|
border: none;
|
|
61
61
|
background: transparent;
|
|
62
62
|
color: var(--aia-written-text-color, var(--aia-color-text-default, #fff));
|
|
63
|
-
caret-color: var(
|
|
63
|
+
caret-color: var(
|
|
64
|
+
--aia-caret-color,
|
|
65
|
+
var(--aia-written-text-color, var(--aia-color-text-default, #fff))
|
|
66
|
+
);
|
|
64
67
|
font-family: inherit;
|
|
65
68
|
font-size: var(--aia-written-text-font-size, 19px);
|
|
66
69
|
line-height: 38px;
|
|
@@ -81,8 +84,8 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
81
84
|
height: 36px;
|
|
82
85
|
border-radius: 50%;
|
|
83
86
|
border: none;
|
|
84
|
-
background: var(--aia-color-text-default, #fff);
|
|
85
|
-
color: var(--aia-color-bg-default, #000);
|
|
87
|
+
background: var(--aia-submit-bg, var(--aia-color-text-default, #fff));
|
|
88
|
+
color: var(--aia-submit-color, var(--aia-color-bg-default, #000));
|
|
86
89
|
cursor: pointer;
|
|
87
90
|
display: flex;
|
|
88
91
|
align-items: center;
|
|
@@ -139,7 +142,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
139
142
|
.AIAutocomplete-module_shimmerHidden_45-Pf {
|
|
140
143
|
color: transparent !important;
|
|
141
144
|
}
|
|
142
|
-
`,document.head.appendChild(o)}var
|
|
145
|
+
`,document.head.appendChild(o)}var _={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 o=document.createElement("style");o.id="ac-style-2eef895d",o.textContent=`.AIAutocompleteDropdown-module_dropdown_yz2KC {
|
|
143
146
|
position: absolute;
|
|
144
147
|
left: 0;
|
|
145
148
|
top: 100%;
|
|
@@ -175,7 +178,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
175
178
|
.AIAutocompleteDropdown-module_pillBar_pwTXe {
|
|
176
179
|
padding: 27px 27px 0px 27px;
|
|
177
180
|
}
|
|
178
|
-
`,document.head.appendChild(o)}var
|
|
181
|
+
`,document.head.appendChild(o)}var j={dropdown:"AIAutocompleteDropdown-module_dropdown_yz2KC",visible:"AIAutocompleteDropdown-module_visible_QCoXj",pillBar:"AIAutocompleteDropdown-module_pillBar_pwTXe"};if(typeof document<"u"&&!document.getElementById("ac-style-b745b4fb")){let o=document.createElement("style");o.id="ac-style-b745b4fb",o.textContent=`.PillList-module_list_qvLqO {
|
|
179
182
|
position: relative;
|
|
180
183
|
z-index: 1;
|
|
181
184
|
pointer-events: auto;
|
|
@@ -207,6 +210,18 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
207
210
|
cursor: pointer;
|
|
208
211
|
white-space: nowrap;
|
|
209
212
|
animation: PillList-module_fadeIn_Aezob 400ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
213
|
+
box-shadow:
|
|
214
|
+
hsla(0, 0%, 100%, 1) -3.2px -3.2px 3.2px -3.2px inset,
|
|
215
|
+
hsla(0, 0%, 100%, 1) 6.4px 6.4px 1.6px -8px inset,
|
|
216
|
+
var(--aia-dropdown-bg, transparent) -6.4px 6.4px 1.6px -8px inset,
|
|
217
|
+
var(--aia-dropdown-bg, transparent) 6.4px -6.4px 1.6px -8px inset,
|
|
218
|
+
hsla(0, 0%, 100%, 0.15) -1.6px 0px 0px -1.6px inset,
|
|
219
|
+
hsla(0, 0%, 100%, 0.15) 0px -1.6px 0px -1.6px inset,
|
|
220
|
+
hsla(0, 0%, 100%, 0.3) 0px 1.6px 0px 0px inset,
|
|
221
|
+
hsla(0, 0%, 100%, 0.3) 1.6px 0px 0px 0px inset,
|
|
222
|
+
inset 0 0 30px 5px hsla(0, 0%, 0%, 0.05),
|
|
223
|
+
hsla(0, 0%, 0%, 0.08) 0px 0px 30px 2px;
|
|
224
|
+
backdrop-filter: blur(30px);
|
|
210
225
|
}
|
|
211
226
|
|
|
212
227
|
.PillList-module_rounded_WvXy4 {
|
|
@@ -226,7 +241,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
226
241
|
opacity: 0;
|
|
227
242
|
}
|
|
228
243
|
}
|
|
229
|
-
`,document.head.appendChild(o)}var
|
|
244
|
+
`,document.head.appendChild(o)}var $={list:"PillList-module_list_qvLqO",pill:"PillList-module_pill_osSyz",fadeIn:"PillList-module_fadeIn_Aezob",rounded:"PillList-module_rounded_WvXy4",active:"PillList-module_active_Oll--"};import{jsx as Ce}from"react/jsx-runtime";function Ve(o){return o===0?.4:o===1?.3:.15}function G({pills:o,activePillIndex:e,onSelectPill:t,rounded:i}){return Ce("span",{className:$.list,children:o.map((s,n)=>Ce("button",{type:"button","data-aia-pill":"",className:`${$.pill} ${i?$.rounded:""} ${n===e?$.active:""}`,style:{opacity:Ve(n)},onClick:()=>t(n),children:s.text},`${s.type}-${s.text}`))})}import{useEffect as je,useLayoutEffect as Ge,useRef as Xe,useState as Je}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-d91f2b06")){let o=document.createElement("style");o.id="ac-style-d91f2b06",o.textContent=`.SuggestionGrid-module_scrollWrapper_MOqfw {
|
|
230
245
|
position: relative;
|
|
231
246
|
}
|
|
232
247
|
|
|
@@ -252,7 +267,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
252
267
|
display: grid;
|
|
253
268
|
grid-template-columns: minmax(0, 1fr);
|
|
254
269
|
max-width: 100cqi;
|
|
255
|
-
padding:
|
|
270
|
+
padding: 8px 8px;
|
|
256
271
|
max-height: 200px;
|
|
257
272
|
overflow-y: auto;
|
|
258
273
|
scrollbar-width: thin;
|
|
@@ -261,7 +276,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
261
276
|
|
|
262
277
|
@container (min-width: 650px) {
|
|
263
278
|
.SuggestionGrid-module_grid_jvaPb {
|
|
264
|
-
grid-template-columns: repeat(2, minmax(0,
|
|
279
|
+
grid-template-columns: repeat(2, minmax(0, 250px));
|
|
265
280
|
justify-content: start;
|
|
266
281
|
}
|
|
267
282
|
}
|
|
@@ -278,7 +293,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
278
293
|
background: var(--aia-scrollbar-thumb, rgba(0, 0, 0, 0.3));
|
|
279
294
|
border-radius: 3px;
|
|
280
295
|
}
|
|
281
|
-
`,document.head.appendChild(o)}var
|
|
296
|
+
`,document.head.appendChild(o)}var ge={scrollWrapper:"SuggestionGrid-module_scrollWrapper_MOqfw",grid:"SuggestionGrid-module_grid_jvaPb"};import{useEffect as Ue,useRef as Qe,useState as We}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-f6bdc634")){let o=document.createElement("style");o.id="ac-style-f6bdc634",o.textContent=`.SuggestionItem-module_item_d4vpD {
|
|
282
297
|
position: relative;
|
|
283
298
|
overflow: visible;
|
|
284
299
|
display: flex;
|
|
@@ -334,7 +349,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
334
349
|
.SuggestionItem-module_pressed_98o-r {
|
|
335
350
|
opacity: 0.8;
|
|
336
351
|
color: var(--aia-color-text-default, #fff);
|
|
337
|
-
background: rgba(255, 255, 255, 0.06);
|
|
352
|
+
background: rgba(var(--aia-streak-rgb, 255, 255, 255), 0.06);
|
|
338
353
|
animation:
|
|
339
354
|
SuggestionItem-module_glassFade_oyiSj 500ms ease forwards,
|
|
340
355
|
SuggestionItem-module_tapDown_G3WGz 500ms ease forwards;
|
|
@@ -354,7 +369,7 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
354
369
|
|
|
355
370
|
@keyframes SuggestionItem-module_glassFade_oyiSj {
|
|
356
371
|
0% {
|
|
357
|
-
background: rgba(255, 255, 255, 0.1);
|
|
372
|
+
background: var(--aia-streak-glass-bg, rgba(255, 255, 255, 0.1));
|
|
358
373
|
}
|
|
359
374
|
100% {
|
|
360
375
|
background: transparent;
|
|
@@ -383,11 +398,11 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
383
398
|
opacity: 0;
|
|
384
399
|
background: radial-gradient(
|
|
385
400
|
ellipse at center,
|
|
386
|
-
rgba(255, 255, 255, 0.5) 0%,
|
|
387
|
-
rgba(255, 255, 255, 0.2) 40%,
|
|
401
|
+
rgba(var(--aia-streak-rgb, 255, 255, 255), 0.5) 0%,
|
|
402
|
+
rgba(var(--aia-streak-rgb, 255, 255, 255), 0.2) 40%,
|
|
388
403
|
transparent 70%
|
|
389
404
|
);
|
|
390
|
-
box-shadow: 0 0 12px 4px rgba(255, 255, 255, 0.2);
|
|
405
|
+
box-shadow: 0 0 12px 4px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.2);
|
|
391
406
|
filter: blur(1px);
|
|
392
407
|
border-radius: 50%;
|
|
393
408
|
}
|
|
@@ -403,11 +418,11 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
403
418
|
opacity: 0;
|
|
404
419
|
background: radial-gradient(
|
|
405
420
|
ellipse at center,
|
|
406
|
-
rgba(255, 255, 255, 0.5) 0%,
|
|
407
|
-
rgba(255, 255, 255, 0.2) 40%,
|
|
421
|
+
rgba(var(--aia-streak-rgb, 255, 255, 255), 0.5) 0%,
|
|
422
|
+
rgba(var(--aia-streak-rgb, 255, 255, 255), 0.2) 40%,
|
|
408
423
|
transparent 70%
|
|
409
424
|
);
|
|
410
|
-
box-shadow: 0 0 12px 4px rgba(255, 255, 255, 0.2);
|
|
425
|
+
box-shadow: 0 0 12px 4px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.2);
|
|
411
426
|
filter: blur(1px);
|
|
412
427
|
border-radius: 50%;
|
|
413
428
|
}
|
|
@@ -434,11 +449,11 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
434
449
|
opacity: 0;
|
|
435
450
|
background: radial-gradient(
|
|
436
451
|
ellipse at center,
|
|
437
|
-
rgba(255, 255, 255, 0.4) 0%,
|
|
438
|
-
rgba(255, 255, 255, 0.15) 40%,
|
|
452
|
+
rgba(var(--aia-streak-rgb, 255, 255, 255), 0.4) 0%,
|
|
453
|
+
rgba(var(--aia-streak-rgb, 255, 255, 255), 0.15) 40%,
|
|
439
454
|
transparent 70%
|
|
440
455
|
);
|
|
441
|
-
box-shadow: 0 0 12px 4px rgba(255, 255, 255, 0.15);
|
|
456
|
+
box-shadow: 0 0 12px 4px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.15);
|
|
442
457
|
filter: blur(1px);
|
|
443
458
|
border-radius: 50%;
|
|
444
459
|
}
|
|
@@ -454,11 +469,11 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
454
469
|
opacity: 0;
|
|
455
470
|
background: radial-gradient(
|
|
456
471
|
ellipse at center,
|
|
457
|
-
rgba(255, 255, 255, 0.4) 0%,
|
|
458
|
-
rgba(255, 255, 255, 0.15) 40%,
|
|
472
|
+
rgba(var(--aia-streak-rgb, 255, 255, 255), 0.4) 0%,
|
|
473
|
+
rgba(var(--aia-streak-rgb, 255, 255, 255), 0.15) 40%,
|
|
459
474
|
transparent 70%
|
|
460
475
|
);
|
|
461
|
-
box-shadow: 0 0 12px 4px rgba(255, 255, 255, 0.15);
|
|
476
|
+
box-shadow: 0 0 12px 4px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.15);
|
|
462
477
|
filter: blur(1px);
|
|
463
478
|
border-radius: 50%;
|
|
464
479
|
}
|
|
@@ -486,27 +501,27 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
486
501
|
height: 4px;
|
|
487
502
|
opacity: 0;
|
|
488
503
|
filter: blur(1px);
|
|
489
|
-
box-shadow: 0 0 8px 3px rgba(255, 255, 255, 0.3);
|
|
504
|
+
box-shadow: 0 0 8px 3px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.3);
|
|
490
505
|
}
|
|
491
506
|
15% {
|
|
492
507
|
height: 4px;
|
|
493
508
|
opacity: 1;
|
|
494
509
|
filter: blur(1px);
|
|
495
|
-
box-shadow: 0 0 10px 4px rgba(255, 255, 255, 0.3);
|
|
510
|
+
box-shadow: 0 0 10px 4px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.3);
|
|
496
511
|
}
|
|
497
512
|
80% {
|
|
498
513
|
width: 50%;
|
|
499
514
|
height: 10px;
|
|
500
515
|
opacity: 0.8;
|
|
501
516
|
filter: blur(3px);
|
|
502
|
-
box-shadow: 0 0 16px 6px rgba(255, 255, 255, 0.1);
|
|
517
|
+
box-shadow: 0 0 16px 6px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.1);
|
|
503
518
|
}
|
|
504
519
|
100% {
|
|
505
520
|
width: 50%;
|
|
506
521
|
height: 12px;
|
|
507
522
|
opacity: 0;
|
|
508
523
|
filter: blur(5px);
|
|
509
|
-
box-shadow: 0 0 20px 8px rgba(255, 255, 255, 0.03);
|
|
524
|
+
box-shadow: 0 0 20px 8px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.03);
|
|
510
525
|
}
|
|
511
526
|
}
|
|
512
527
|
|
|
@@ -517,27 +532,27 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
517
532
|
height: 4px;
|
|
518
533
|
opacity: 0;
|
|
519
534
|
filter: blur(1px);
|
|
520
|
-
box-shadow: 0 0 8px 3px rgba(255, 255, 255, 0.3);
|
|
535
|
+
box-shadow: 0 0 8px 3px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.3);
|
|
521
536
|
}
|
|
522
537
|
15% {
|
|
523
538
|
height: 4px;
|
|
524
539
|
opacity: 1;
|
|
525
540
|
filter: blur(1px);
|
|
526
|
-
box-shadow: 0 0 10px 4px rgba(255, 255, 255, 0.3);
|
|
541
|
+
box-shadow: 0 0 10px 4px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.3);
|
|
527
542
|
}
|
|
528
543
|
80% {
|
|
529
544
|
width: 50%;
|
|
530
545
|
height: 10px;
|
|
531
546
|
opacity: 0.8;
|
|
532
547
|
filter: blur(3px);
|
|
533
|
-
box-shadow: 0 0 16px 6px rgba(255, 255, 255, 0.1);
|
|
548
|
+
box-shadow: 0 0 16px 6px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.1);
|
|
534
549
|
}
|
|
535
550
|
100% {
|
|
536
551
|
width: 50%;
|
|
537
552
|
height: 12px;
|
|
538
553
|
opacity: 0;
|
|
539
554
|
filter: blur(5px);
|
|
540
|
-
box-shadow: 0 0 20px 8px rgba(255, 255, 255, 0.03);
|
|
555
|
+
box-shadow: 0 0 20px 8px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.03);
|
|
541
556
|
}
|
|
542
557
|
}
|
|
543
558
|
|
|
@@ -548,21 +563,21 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
548
563
|
width: 6px;
|
|
549
564
|
opacity: 0.9;
|
|
550
565
|
filter: blur(1.8px);
|
|
551
|
-
box-shadow: 0 0 12px 5px rgba(255, 255, 255, 0.25);
|
|
566
|
+
box-shadow: 0 0 12px 5px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.25);
|
|
552
567
|
}
|
|
553
568
|
75% {
|
|
554
569
|
height: 100%;
|
|
555
570
|
width: 10px;
|
|
556
571
|
opacity: 0.4;
|
|
557
572
|
filter: blur(3px);
|
|
558
|
-
box-shadow: 0 0 18px 8px rgba(255, 255, 255, 0.06);
|
|
573
|
+
box-shadow: 0 0 18px 8px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.06);
|
|
559
574
|
}
|
|
560
575
|
100% {
|
|
561
576
|
height: 100%;
|
|
562
577
|
width: 14px;
|
|
563
578
|
opacity: 0;
|
|
564
579
|
filter: blur(5px);
|
|
565
|
-
box-shadow: 0 0 24px 10px rgba(255, 255, 255, 0.02);
|
|
580
|
+
box-shadow: 0 0 24px 10px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.02);
|
|
566
581
|
}
|
|
567
582
|
}
|
|
568
583
|
|
|
@@ -572,24 +587,24 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
572
587
|
width: 6px;
|
|
573
588
|
opacity: 0.9;
|
|
574
589
|
filter: blur(1.8px);
|
|
575
|
-
box-shadow: 0 0 12px 5px rgba(255, 255, 255, 0.25);
|
|
590
|
+
box-shadow: 0 0 12px 5px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.25);
|
|
576
591
|
}
|
|
577
592
|
75% {
|
|
578
593
|
height: 100%;
|
|
579
594
|
width: 10px;
|
|
580
595
|
opacity: 0.4;
|
|
581
596
|
filter: blur(3px);
|
|
582
|
-
box-shadow: 0 0 18px 8px rgba(255, 255, 255, 0.06);
|
|
597
|
+
box-shadow: 0 0 18px 8px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.06);
|
|
583
598
|
}
|
|
584
599
|
100% {
|
|
585
600
|
height: 100%;
|
|
586
601
|
width: 14px;
|
|
587
602
|
opacity: 0;
|
|
588
603
|
filter: blur(5px);
|
|
589
|
-
box-shadow: 0 0 24px 10px rgba(255, 255, 255, 0.02);
|
|
604
|
+
box-shadow: 0 0 24px 10px rgba(var(--aia-streak-rgb, 255, 255, 255), 0.02);
|
|
590
605
|
}
|
|
591
606
|
}
|
|
592
|
-
`,document.head.appendChild(o)}var A={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
|
|
607
|
+
`,document.head.appendChild(o)}var A={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 fe,jsxs as Pe}from"react/jsx-runtime";function Ae({option:o,isHighlighted:e,onSelect:t,onHighlight:i,id:s}){let[n,a]=We(!1),d=Qe(void 0);Ue(()=>()=>clearTimeout(d.current),[]);let r=()=>{!o.is_tappable||n||(a(!0),t(o),clearTimeout(d.current),d.current=setTimeout(()=>a(!1),400))},l=[A.item,e?A.highlighted:"",o.is_tappable?A.tappable:A.nonTappable,n?A.pressed:""].filter(Boolean).join(" ");return Pe("div",{id:s,role:"option","data-aia-option":"","aria-selected":e,className:l,tabIndex:o.is_tappable?0:-1,onClick:r,onKeyDown:p=>{o.is_tappable&&(p.key==="Enter"||p.key===" ")&&(p.preventDefault(),r())},onMouseEnter:o.is_tappable?i:void 0,children:[fe("div",{className:A.streaks}),fe("div",{className:A.streaksVert}),Pe("span",{className:A.content,children:[o.icon?`${o.icon} ${o.text}`:o.text,o.tag&&fe("span",{className:A.tag,children:o.tag})]})]})}import{jsx as he}from"react/jsx-runtime";function ke({options:o,activeIndex:e,onSelect:t,onHighlight:i,listboxId:s}){let n=Xe(null),[a,d]=Je(!1);return je(()=>{let r=n.current;if(!r)return;let l=()=>{d(r.scrollHeight-r.scrollTop-r.clientHeight>1)};r.addEventListener("scroll",l,{passive:!0});let p=new ResizeObserver(l);return p.observe(r),()=>{r.removeEventListener("scroll",l),p.disconnect()}},[]),Ge(()=>{let r=n.current;r&&d(r.scrollHeight-r.scrollTop-r.clientHeight>1)},[o]),he("div",{className:ge.scrollWrapper,"data-fade":a?"":void 0,children:he("div",{ref:n,className:ge.grid,children:o.map((r,l)=>he(Ae,{option:r,isHighlighted:l===e,onSelect:t,onHighlight:()=>i(l),id:`${s}-option-${l}`},r.text))})})}import{jsx as xe,jsxs as Ye}from"react/jsx-runtime";function be({suggestions:o,activeIndex:e,onSelect:t,onHighlight:i,isOpen:s,id:n,className:a,pills:d,onPillClick:r,showPills:l=!0}){let c=o[0]?.options??[],m=l&&d&&d.length>0&&r,g=s&&c.length>0||s&&m;return Ye("div",{id:n,role:"listbox","data-aia-dropdown":"",className:`${j.dropdown} ${g?j.visible:""} ${a??""}`,onMouseDown:S=>S.preventDefault(),children:[m&&xe("div",{className:j.pillBar,"data-aia-pillbar":"",children:xe(G,{pills:d,activePillIndex:0,onSelectPill:r,rounded:!0})}),c.length>0&&xe(ke,{options:c,activeIndex:e,onSelect:t,onHighlight:i,listboxId:n})]})}if(typeof document<"u"&&!document.getElementById("ac-style-dc8da745")){let o=document.createElement("style");o.id="ac-style-dc8da745",o.textContent=`/*
|
|
593
608
|
* Built-in appearance defaults \u2014 zero specificity via :where().
|
|
594
609
|
* Consumer CSS always wins without !important.
|
|
595
610
|
*
|
|
@@ -613,6 +628,15 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
613
628
|
|
|
614
629
|
--aia-written-text-color: #000000;
|
|
615
630
|
--aia-written-text-font-size: 19px;
|
|
631
|
+
--aia-caret-color: var(--aia-written-text-color, #000000);
|
|
632
|
+
|
|
633
|
+
--aia-submit-bg: #000000;
|
|
634
|
+
--aia-submit-color: #ffffff;
|
|
635
|
+
|
|
636
|
+
--aia-color-text-muted: #6b7280;
|
|
637
|
+
|
|
638
|
+
--aia-streak-rgb: 99, 102, 241;
|
|
639
|
+
--aia-streak-glass-bg: rgba(99, 102, 241, 0.1);
|
|
616
640
|
}
|
|
617
641
|
|
|
618
642
|
/* Dark mode defaults */
|
|
@@ -628,6 +652,15 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
628
652
|
|
|
629
653
|
--aia-written-text-color: #ffffff;
|
|
630
654
|
--aia-written-text-font-size: 19px;
|
|
655
|
+
--aia-caret-color: var(--aia-written-text-color, #ffffff);
|
|
656
|
+
|
|
657
|
+
--aia-submit-bg: #ffffff;
|
|
658
|
+
--aia-submit-color: #000000;
|
|
659
|
+
|
|
660
|
+
--aia-color-text-muted: #c1c4cb;
|
|
661
|
+
|
|
662
|
+
--aia-streak-rgb: 255, 255, 255;
|
|
663
|
+
--aia-streak-glass-bg: rgba(255, 255, 255, 0.1);
|
|
631
664
|
}
|
|
632
665
|
|
|
633
666
|
/* optionsPosition: dropdown above the input */
|
|
@@ -650,5 +683,5 @@ import{forwardRef as xt,useCallback as bt,useEffect as Ie,useImperativeHandle as
|
|
|
650
683
|
animation-duration: 0s !important;
|
|
651
684
|
transition-duration: 0s !important;
|
|
652
685
|
}
|
|
653
|
-
`,document.head.appendChild(o)}import{useCallback as T,useEffect as se,useRef as R,useState as ht}from"react";function V(o,e,t){let i=o.slice(e);if(t||e===0||o[e-1]===" ")return i;let s=i.indexOf(" ");return s===-1?"":i.slice(s+1)}function ke(o,e){let t=o.trimEnd().replace(/\s+/g," ");if(t.length===0||e.length===0)return 0;let i=t.split(" "),s=e.toLowerCase();for(let n=0;n<i.length;n++){let a=i.slice(n).join(" ");if(s.startsWith(a.toLowerCase())){let d=t.length-a.length;return o.length-d}}return 0}function J(o,e){if(!o)return[];let t=e.trimStart();if(!t)return o;let i=t.toLowerCase();return o.filter(s=>!s.is_tappable||s.text.toLowerCase().includes(i))}function be(o,e){if(!o)return null;let t=e.trim();if(!t)return null;let i=t.toLowerCase();return o.find(s=>s.is_tappable&&s.text.toLowerCase()===i)??null}var z=class{constructor(e,t="auto"){this.container=e;this.mode=t;this.mediaQuery=null;this.onSystemChange=e=>{this.container.dataset.mode=e.matches?"dark":"light"};this.apply()}setMode(e){this.detachListener(),this.mode=e,this.apply()}destroy(){this.detachListener()}apply(){this.mode==="auto"?(this.mediaQuery??(this.mediaQuery=window.matchMedia("(prefers-color-scheme: dark)")),this.mediaQuery.addEventListener("change",this.onSystemChange),this.container.dataset.mode=this.mediaQuery.matches?"dark":"light"):this.container.dataset.mode=this.mode}detachListener(){this.mediaQuery?.removeEventListener("change",this.onSystemChange)}};function Te(o,e){let t=[],i=0;for(let n of e){let a=o.indexOf(n.text,i);a!==-1&&(a>i&&t.push({type:"text",value:o.slice(i,a)}),t.push({type:"completed",value:n.text,param:n}),i=a+n.text.length)}let s=o.slice(i);return s&&t.push({type:"text",value:s}),t}function Oe(o,e){let t=[],i=[],s=0;for(let n of e){let a=o.indexOf(n.text,s);a===-1?i.push(n):(t.push(n),s=a+n.text.length)}return{valid:t,invalid:i}}var Y=class{constructor(e){this.config=e;this.current=null;this.expiresAt=null;this.inFlightRefresh=null;e.accessToken&&(this.current=e.accessToken)}async getToken(e=!1){if(!e&&this.current&&!this.isExpired())return this.current;if(!e&&this.inFlightRefresh)return this.inFlightRefresh;this.inFlightRefresh=this.refresh();try{return await this.inFlightRefresh}finally{this.inFlightRefresh=null}}async refresh(){let e=await this.config.getAccessToken();return this.current=e.accessToken,this.expiresAt=e.expiresAt??null,this.current}isExpired(){return this.expiresAt==null?!1:Date.now()>=this.expiresAt-3e4}};var Ze="0.1.25",De=!1;function et(){return crypto.randomUUID()}function tt(o,e){return{placeholder:o.placeholder,type:o.type,...e&&{text:o.text},kind:o.kind}}function Re(o){return o?.type==="accessToken"}function ot(o){if(!(!o||Re(o)))return o}var Ee=new WeakMap;function it(o){let e=Ee.get(o.getAccessToken);return e||(e=new Y(o),Ee.set(o.getAccessToken,e)),e}function nt(o,e,t){let i=e.find(n=>n.type==="contact"&&n.metadata?.contact_account_count)?.metadata?.contact_account_count,s=typeof i=="number"?i:void 0;return{data:{raw_query:o,completed_params:e.map(n=>tt(n,t)),...s!=null&&{contact_account_count:s}},meta:{request_id:et(),request_at:new Date().toISOString(),language:typeof navigator<"u"?navigator.language:"en-US",client_version:Ze}}}function rt(o){return{"Content-Type":"application/json",...o?.appIdentifier&&{"X-App-Identifier":o.appIdentifier},...o?.headers}}async function Le(o,e,t,i,s){return fetch(o,{method:"POST",headers:{...e,Authorization:`Bearer ${t}`},body:i,signal:s})}async function Me(o,e,t){let i=t?.apiConfig,s=!t?.maskCompletedText,n=nt(o,e,s),a=rt(i),d=i?.endpoint??"/ac/suggest",r=JSON.stringify(n);if(Re(i)){let u=it(i),h=await u.getToken(),m=await Le(d,a,h,r,t?.signal);if(m.status===401){let w=await u.getToken(!0);m=await Le(d,a,w,r,t?.signal)}if(!m.ok)throw new Error(`API error: ${m.status} ${m.statusText}`);return m.json()}let l=ot(i),p=l?.apiKey??"";if(!p&&!De&&(De=!0,console.warn("[AIAutocomplete] No apiKey in apiConfig. Requests will be sent without an Authorization header.")),p){let u=l?.authScheme??"Bearer";a.Authorization=u==="Basic"?`Basic ${btoa(p)}`:`Bearer ${p}`}let c=await fetch(d,{method:"POST",headers:a,body:r,signal:t?.signal});if(!c.ok)throw new Error(`API error: ${c.status} ${c.statusText}`);return c.json()}function D(o,e){let t=o,i={},s=[];for(let n of e){let a=(i[n.type]??0)+1;i[n.type]=a;let r=`{{${n.type.toUpperCase().replace(/\s+/g,"_")}_${a}}}`,l=t.indexOf(n.text);l!==-1&&(t=t.slice(0,l)+r+t.slice(l+n.text.length)),s.push({...n,placeholder:r})}return{rawQuery:t,completedParams:s}}function He(o,e){return e?o.map(t=>{let i=e[t.type];if(!i)return t;let s=i("");if(s.length===0)return t;let n=new Set(s.map(d=>d.text)),a=(t.options??[]).filter(d=>!n.has(d.text));return{...t,options:[...s,...a]}}):o}var st=100,at=300,lt=2,Z=class{constructor(e,t,i,s,n){this.store=e;this.getApiConfig=t;this.getOptionOverrides=i;this.getMaskCompletedText=s;this.getOnError=n;this.fetchVersion=0;this.abortController=null;this.debounceTimer=null;this.slowDebounceTimer=null;this.unsubscribe=null}start(){this.doFetch("",[]);let e=this.store.get().text,t=this.store.get().completedParams;this.unsubscribe=this.store.subscribe(i=>{(i.text!==e||i.completedParams!==t)&&(e=i.text,t=i.completedParams,this.scheduleFetch())})}dispose(){this.abortController?.abort(),this.clearTimers(),this.unsubscribe?.()}async doFetch(e,t){this.abortController?.abort();let i=new AbortController;this.abortController=i;let s=++this.fetchVersion,n=this.store.get(),a=n.text.length;n.suggestions.some(r=>r.type!=="placeholder")||this.store.set({isLoading:!0}),this.store.set({error:null});try{let r=await Me(e,t,{maskCompletedText:this.getMaskCompletedText(),signal:i.signal,apiConfig:this.getApiConfig()});if(s!==this.fetchVersion)return;let l=He(r.data.suggestions??[],this.getOptionOverrides()),p=r.data.input??[],c=p[p.length-1],u=this.store.get().text,h,m;if(c?.state==="in_progress"){m=!0;let I=u.toLowerCase().lastIndexOf(c.text.toLowerCase());h=I!==-1?I:a}else m=!1,h=a;let x=l.filter(I=>I.type!=="placeholder")[0],b=null;if(x){let I=V(u,h,m),g=be(x.options,I);g&&(b={id:crypto.randomUUID(),placeholder:"",type:x.type,text:g.text,kind:g.kind,suggestionType:x.type,suggestionPlaceholder:x.text,options:x.options??[],metadata:g.metadata},l=l.filter(S=>S!==x))}this.store.set(I=>({suggestions:l,isLoading:!1,isReady:r.data.is_ready??!1,lastRawQuery:e,activeDropdownIndex:-1,filterBase:h,filterInProgress:m,...b?{completedParams:[...I.completedParams,b]}:{}}))}catch(r){if(s===this.fetchVersion){let l=r instanceof Error?r:new Error(String(r));this.store.set({error:l,isLoading:!1}),this.getOnError()?.(l)}}}scheduleFetch(){if(this.clearTimers(),this.store.get().skipNextFetch){this.store.set({skipNextFetch:!1});return}let t=i=>{let s=this.store.get();if(!s.text&&s.completedParams.length===0)return this.doFetch("",[]),!0;let n=V(s.text,s.filterBase,s.filterInProgress),d=s.suggestions.filter(x=>x.type!=="placeholder")[0],l=(d?J(d.options,n):[]).filter(x=>x.is_tappable),p=d?be(d.options,n)!==null:!1,c=n.trim().length>0;if(l.length>0&&!p&&c)return!1;if(s.completedParams.length===0&&s.text.length>0){let x=s.suggestions.filter(b=>b.type==="placeholder").map(b=>b.text).join(" ");if(x.length>0&&x.toLowerCase().startsWith(s.text.toLowerCase()))return!1}let{rawQuery:u,completedParams:h}=D(s.text,s.completedParams),m=u.length<s.lastRawQuery.length,w=Math.abs(u.length-s.lastRawQuery.length);return m||w>=i?(this.doFetch(u,h),!0):!1};this.debounceTimer=setTimeout(()=>{t(lt)&&this.slowDebounceTimer&&clearTimeout(this.slowDebounceTimer)},st),this.slowDebounceTimer=setTimeout(()=>t(1),at)}clearTimers(){this.debounceTimer&&clearTimeout(this.debounceTimer),this.slowDebounceTimer&&clearTimeout(this.slowDebounceTimer),this.debounceTimer=null,this.slowDebounceTimer=null}};var ee=class{constructor(e,t){this.store=e;this.ctx=t}handleKeyDown(e){let t=this.store.get(),{columns:i,listboxId:s,getOnSubmit:n}=this.ctx,a=n(),d=this.getTappableIndices();switch(e.key){case"ArrowDown":{let r=e.target;if(!(r.selectionStart!=null&&r.selectionStart===r.value.length)&&t.activeDropdownIndex<0)break;if(e.preventDefault(),!t.isDropdownOpen&&t.actionableSuggestions.length>0){this.store.set({pillTapped:!0,activeDropdownIndex:d[0]??0});break}if(d.length===0)return;let p=d.indexOf(t.activeDropdownIndex),c=p<d.length-1?p+1:0;this.store.set({activeDropdownIndex:d[c]});break}case"ArrowUp":{if(d.length===0||t.activeDropdownIndex<0)break;if(e.preventDefault(),t.activeDropdownIndex<i){this.store.set({activeDropdownIndex:-1});break}let r=d.indexOf(t.activeDropdownIndex),l=r>0?r-1:d.length-1;this.store.set({activeDropdownIndex:d[l]});break}case"ArrowRight":{if(t.activeDropdownIndex<0){let l=e.target;l.selectionStart!=null&&l.selectionStart===l.value.length&&t.actionableSuggestions.length>1&&(e.preventDefault(),this.pillsSetActivePill(1));break}if(t.activeDropdownIndex%i<i-1){let l=t.activeDropdownIndex+1;l<t.filteredOptions.length&&t.filteredOptions[l]?.is_tappable&&(e.preventDefault(),this.store.set({activeDropdownIndex:l}))}break}case"ArrowLeft":{if(t.activeDropdownIndex<0)break;if(t.activeDropdownIndex%i>0){let r=t.activeDropdownIndex-1;r>=0&&t.filteredOptions[r]?.is_tappable&&(e.preventDefault(),this.store.set({activeDropdownIndex:r}))}break}case"Enter":{if(e.preventDefault(),t.activeDropdownIndex>=0&&t.filteredOptions[t.activeDropdownIndex]?.is_tappable)this.clickOrSelect(t.activeDropdownIndex,t.filteredOptions,s);else if(a){let{rawQuery:r,completedParams:l}=D(t.text,t.completedParams);a({query:t.text.trim(),raw_query:r,completed_params:l})}break}case"Tab":{if(t.activeDropdownIndex>=0&&t.filteredOptions[t.activeDropdownIndex]?.is_tappable)e.preventDefault(),this.clickOrSelect(t.activeDropdownIndex,t.filteredOptions,s);else if(t.isDropdownOpen){let r=t.filteredOptions.findIndex(l=>l.is_tappable);r>=0&&(e.preventDefault(),this.clickOrSelect(r,t.filteredOptions,s))}else if(!t.text&&t.placeholderText){e.preventDefault();let r=t.suggestions.find(l=>l.type==="placeholder");r?this.store.set(l=>({text:t.placeholderText,filterBase:t.placeholderText.length,completedParams:[...l.completedParams,{id:crypto.randomUUID(),placeholder:"",type:r.type,text:t.placeholderText,kind:null,suggestionType:r.type,suggestionPlaceholder:r.text,options:r.options??[]}],suggestions:l.suggestions.filter(p=>p!==r)})):this.store.set({text:t.placeholderText,filterBase:t.placeholderText.length})}break}case"Escape":this.store.set({activeDropdownIndex:-1});break}}getTappableIndices(){let e=this.store.get(),{columns:t}=this.ctx,i=e.filteredOptions.map((n,a)=>n.is_tappable?a:-1).filter(n=>n!==-1),s=Array.from({length:t},()=>[]);for(let n of i)s[n%t].push(n);return s.flat()}clickOrSelect(e,t,i){let s=document.getElementById(`${i}-option-${e}`);s?s.click():this.ctx.selectOption(t[e])}pillsSetActivePill(e){let t=this.store.get(),i=t.suggestions.filter(d=>d.type!=="placeholder");if(e<0||e>=i.length)return;let s=i[e],n=i.filter((d,r)=>r!==e),a=t.suggestions.filter(d=>d.type==="placeholder");this.store.set({suggestions:[...a,s,...n],pillTapped:!0,activeDropdownIndex:-1})}};var te=class{constructor(e){this.store=e}setActivePill(e){let t=this.store.get(),i=t.suggestions.filter(d=>d.type!=="placeholder");if(e<0||e>=i.length)return;let s=i[e],n=i.filter((d,r)=>r!==e),a=t.suggestions.filter(d=>d.type==="placeholder");this.store.set({suggestions:[...a,s,...n],pillTapped:!0,activeDropdownIndex:-1})}removeLastParam(){let e=this.store.get();if(e.completedParams.length===0)return;let t=e.completedParams[e.completedParams.length-1],i={type:t.suggestionType,text:t.suggestionPlaceholder,required:!0,options:t.options};this.store.set(s=>({completedParams:s.completedParams.slice(0,-1),suggestions:[i,...s.suggestions],activeDropdownIndex:-1}))}};function dt(o){return o===0?.4:o===1?.3:.15}function oe(o,e,t,i,s=!1){let n=o.querySelector(".magicx-aia-pill-list");n||(n=document.createElement("span"),n.className="magicx-aia-pill-list",o.appendChild(n));let a=new Map;for(let r of n.querySelectorAll(".magicx-aia-pill"))a.set(r.dataset.pillKey??"",r);let d=new Set;for(let r=0;r<e.length;r++){let l=e[r],p=`${l.type}-${l.text}`;d.add(p);let c=a.get(p);c||(c=document.createElement("button"),c.type="button",c.dataset.pillKey=p,c.textContent=l.text),c.className=`magicx-aia-pill${s?" magicx-aia-pill--rounded":""}${r===t?" magicx-aia-pill--active":""}`,c.style.opacity=String(dt(r)),c.onclick=()=>i(r),n.children[r]!==c&&n.insertBefore(c,n.children[r]??null)}for(let[r,l]of a)d.has(r)||l.remove()}function ie(o){let e=document.createElement("div");return e.id=o,e.setAttribute("role","listbox"),e.setAttribute("data-aia-dropdown",""),e.className="magicx-aia-dropdown",e.addEventListener("mousedown",t=>t.preventDefault()),e}function ne(o,e){let{filteredOptions:t,activeIndex:i,isOpen:s,pills:n,showPills:a,onSelect:d,onHighlight:r,onPillClick:l}=e,p=a&&n.length>0;s&&t.length>0||s&&p?o.classList.add("magicx-aia-dropdown--visible"):o.classList.remove("magicx-aia-dropdown--visible");let h=o.querySelector(".magicx-aia-pill-bar");p?(h||(h=document.createElement("div"),h.className="magicx-aia-pill-bar",o.insertBefore(h,o.firstChild)),oe(h,n,0,l,!0)):h&&h.remove();let m=o.querySelector(".magicx-aia-grid");t.length>0?(m||(m=document.createElement("div"),m.className="magicx-aia-grid",o.appendChild(m)),pt(m,t,i,d,r,e.listboxId)):m&&(m.innerHTML="")}function pt(o,e,t,i,s,n){let a=e.map(l=>l.text).join("\0"),d=o.dataset.optionsKey??"",r=a!==d;if(o.dataset.optionsKey=a,r){let l=document.createDocumentFragment();for(let p=0;p<e.length;p++){let c=e[p],u=ct(c,p,t,i,s,n);l.appendChild(u)}o.innerHTML="",o.appendChild(l)}else{let l=o.querySelectorAll(".magicx-aia-option");for(let p=0;p<l.length;p++){let c=l[p],u=p===t;c.setAttribute("aria-selected",String(u)),u?c.classList.add("magicx-aia-option--highlighted"):c.classList.remove("magicx-aia-option--highlighted")}}}function ct(o,e,t,i,s,n){let a=document.createElement("div");a.id=`${n}-option-${e}`,a.setAttribute("role","option"),a.setAttribute("aria-selected",String(e===t)),a.tabIndex=o.is_tappable?0:-1;let d=["magicx-aia-option"];e===t&&d.push("magicx-aia-option--highlighted"),o.is_tappable?d.push("magicx-aia-option--tappable"):d.push("magicx-aia-option--non-tappable"),a.className=d.join(" ");let r=document.createElement("div");r.className="magicx-aia-streaks",a.appendChild(r);let l=document.createElement("div");l.className="magicx-aia-streaks-vert",a.appendChild(l);let p=document.createElement("span");if(p.className="magicx-aia-option-content",p.textContent=o.icon?`${o.icon} ${o.text}`:o.text,o.tag){let c=document.createElement("span");c.className="magicx-aia-option-tag",c.textContent=o.tag,p.appendChild(c)}return a.appendChild(p),o.is_tappable&&a.addEventListener("click",()=>{a.classList.add("magicx-aia-option--pressed"),i(o),setTimeout(()=>a.classList.remove("magicx-aia-option--pressed"),400)}),a.addEventListener("mouseenter",()=>s(e)),a}function ze(o,e){let t=ie(e.listboxId);return o.appendChild(t),{dropdown:t}}function ve(o,e,t){ne(o.dropdown,{suggestions:e.actionableSuggestions.length>0?[{...e.actionableSuggestions[0],options:e.filteredOptions}]:[],filteredOptions:e.filteredOptions,activeIndex:e.activeDropdownIndex,isOpen:e.isDropdownOpen,listboxId:t.listboxId,pills:e.actionableSuggestions,showPills:!0,onSelect:t.selectOption,onHighlight:i=>t.store.set({activeDropdownIndex:i}),onPillClick:t.setActivePill})}function Be(o,e,t,i,s){let n=o.querySelector(".magicx-aia-sizer-text"),a=o.querySelector(".magicx-aia-placeholder");if(i&&s){n&&(n.style.display="none"),a||(a=document.createElement("span"),a.className="magicx-aia-placeholder",o.insertBefore(a,o.firstChild)),a.style.display="",a.textContent=`${s} `,o.dataset.segmentKey="";return}a&&(a.style.display="none"),n||(n=document.createElement("span"),n.className="magicx-aia-sizer-text",o.insertBefore(n,o.firstChild)),n.style.display="",n.className=`magicx-aia-sizer-text${t?" magicx-aia-sizer-text--visible":""}`;let d=e.map(p=>`${p.type}:${p.value}`).join("\0"),r=o.dataset.segmentKey??"",l=o.dataset.newParamId??"";if(!(d===r&&(t??"")===l)){o.dataset.segmentKey=d,o.dataset.newParamId=t??"",n.innerHTML="";for(let p of e){let c=document.createElement("span");p.type==="completed"&&(p.param.id===t?c.className="magicx-aia-shimmer-revealed magicx-aia-shimmer-sweep":c.className="magicx-aia-segment magicx-aia-segment--completed"),c.textContent=p.value,n.appendChild(c)}e.length===0&&(n.textContent="\xA0")}}var ut='<svg width="18" height="18" viewBox="0 0 18 18" fill="none" role="img" aria-label="Submit"><path d="M9 14V4M9 4L4 9M9 4L14 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>';function Ne(o,e){let{listboxId:t}=e,i=ie(t);o.appendChild(i);let s=document.createElement("div");s.className="magicx-aia-input-wrapper",o.appendChild(s);let n=document.createElement("div");n.className="magicx-aia-editor",s.appendChild(n);let a=document.createElement("div");a.className="magicx-aia-sizer",a.setAttribute("aria-hidden","true"),n.appendChild(a);let d=document.createElement("span");a.appendChild(document.createTextNode(" ")),a.appendChild(d);let r=document.createElement("textarea");r.className="magicx-aia-textarea",r.rows=1,r.setAttribute("role","combobox"),r.setAttribute("aria-autocomplete","list"),r.setAttribute("aria-controls",t),n.appendChild(r);let l=document.createElement("button");return l.type="button",l.className="magicx-aia-submit",l.setAttribute("aria-label","Submit"),l.innerHTML=ut,s.appendChild(l),s.addEventListener("click",()=>r.focus()),r.addEventListener("input",()=>{let p=r.value,u=p.length>0&&p[0]!==p[0].toUpperCase()?p[0].toUpperCase()+p.slice(1):p;e.handleChange(u)}),r.addEventListener("keydown",p=>e.handleKeyDown(p)),l.addEventListener("click",p=>{p.stopPropagation();let c=e.store.get();if(!(!!c.text||c.completedParams.length>0)||!e.onSubmit)return;let{rawQuery:h,completedParams:m}=D(c.text,c.completedParams);e.onSubmit({query:c.text.trim(),raw_query:h,completed_params:m})}),r.focus(),{textarea:r,dropdown:i,sizer:a,submitButton:l,inlinePillContainer:d}}function ye(o,e,t){let{textarea:i,dropdown:s,sizer:n,submitButton:a,inlinePillContainer:d}=o,{pillPlacement:r,setActivePill:l,selectOption:p,store:c}=t;i.value!==e.text&&(i.value=e.text),e.placeholderText?i.placeholder=e.placeholderText:i.removeAttribute("placeholder"),i.setAttribute("aria-expanded",String(e.isDropdownOpen));let u=e.activeDropdownIndex>=0?`${t.listboxId}-option-${e.activeDropdownIndex}`:"";u?i.setAttribute("aria-activedescendant",u):i.removeAttribute("aria-activedescendant"),e.newParamId?i.classList.add("magicx-aia-textarea--hidden"):i.classList.remove("magicx-aia-textarea--hidden");let h=!!e.text||e.completedParams.length>0;a.disabled=!h,Be(n,e.segments,e.newParamId,!e.text,e.placeholderText),r==="inline"?oe(d,e.actionableSuggestions,0,l):d.innerHTML="",ne(s,{suggestions:e.actionableSuggestions.length>0?[{...e.actionableSuggestions[0],options:e.filteredOptions}]:[],filteredOptions:e.filteredOptions,activeIndex:e.activeDropdownIndex,isOpen:e.isDropdownOpen,listboxId:t.listboxId,pills:e.actionableSuggestions,showPills:r==="dropdown",onSelect:p,onHighlight:m=>c.set({activeDropdownIndex:m}),onPillClick:l})}function Ke(o){let e=o,t=new Set;return{get:()=>e,set:i=>{let s=typeof i=="function"?i(e):i,n={...e,...s},a=e;e=n;for(let d of t)d(n,a)},subscribe:i=>(t.add(i),()=>{t.delete(i)})}}var we=!1;function $e(){if(we||typeof document>"u")return;if(document.querySelector("style[data-magicx-aia]")){we=!0;return}we=!0;let o=document.createElement("style");o.setAttribute("data-magicx-aia",""),o.textContent=mt,document.head.appendChild(o)}var mt="";var gt=0;function ft(){return`:ac-${++gt}:`}function Fe(){return{text:"",completedParams:[],suggestions:[],activeDropdownIndex:-1,newParamId:null,isLoading:!1,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],placeholderText:"",isDropdownOpen:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:""}}var re=class{constructor(e,t={}){this.store=Ke(Fe());this._listboxId=ft();this.modeController=null;this.unsubscribers=[];this.derivedInProgress=!1;this.domRefs=null;this.dropdownRefs=null;this.externalListeners=new Set;this.container=e,this.opts=t,this.renderMode=t.renderMode??"full",t.value!==void 0&&this.store.set({text:t.value}),t.completedParams!==void 0&&this.store.set({completedParams:t.completedParams}),this.pillsController=new te(this.store),this.fetchController=new Z(this.store,()=>this.opts.apiConfig,()=>this.opts.optionOverrides,()=>this.opts.maskCompletedText,()=>this.opts.onError),this.keyboardController=new ee(this.store,{columns:t.columns??2,listboxId:this.listboxId,getOnSubmit:()=>this.opts.onSubmit,selectOption:i=>this.selectOption(i)}),this.unsubscribers.push(this.store.subscribe((i,s)=>{this.recomputeDerived(i,s)})),this.unsubscribers.push(this.store.subscribe((i,s)=>{i.text!==s.text&&this.opts.onChange?.(i.text),i.completedParams!==s.completedParams&&this.opts.onParamsChange?.(i.completedParams),this.opts.onStateChange?.(i)})),this.renderMode!=="headless"&&($e(),this.setupContainer()),this.renderMode==="full"?this.buildAndRenderFull():this.renderMode==="dropdown"&&this.buildAndRenderDropdown(),this.fetchController.start()}focus(){this.domRefs?.textarea.focus()}reset(){this.store.set({...Fe()}),this.fetchController.doFetch("",[])}destroy(){this.fetchController.dispose(),this.modeController?.destroy(),this.newParamTimer&&clearTimeout(this.newParamTimer),this.suggestionRemovalTimer&&clearTimeout(this.suggestionRemovalTimer),this.externalListeners.clear();for(let e of this.unsubscribers)e();this.unsubscribers=[],this.domRefs=null,this.dropdownRefs=null,this.renderMode!=="headless"&&(this.container.innerHTML="")}setMode(e){this.modeController?.setMode(e)}setValue(e){this.store.set({text:e})}setCompletedParams(e){this.store.set({completedParams:e})}setActivePill(e){this.pillsController.setActivePill(e)}removeLastParam(){this.pillsController.removeLastParam()}clearNewParamId(){this.store.set({newParamId:null})}setActiveDropdownIndex(e){this.store.set({activeDropdownIndex:e})}handleTextChange(e){this.handleChange(e)}handleKeyDown(e){this.keyboardController.handleKeyDown(e)}subscribe(e){return this.externalListeners.add(e),()=>{this.externalListeners.delete(e)}}getState(){return this.store.get()}get listboxId(){return this._listboxId}get isReady(){return this.store.get().isReady}on(e,t){switch(e){case"submit":return this.opts.onSubmit=t,()=>{this.opts.onSubmit=void 0};case"error":return this.opts.onError=t,()=>{this.opts.onError=void 0};case"change":return this.opts.onChange=t,()=>{this.opts.onChange=void 0};case"paramsChange":return this.opts.onParamsChange=t,()=>{this.opts.onParamsChange=void 0};case"stateChange":return this.opts.onStateChange=t,()=>{this.opts.onStateChange=void 0};default:return()=>{}}}update(e){Object.assign(this.opts,e),e.mode!==void 0&&this.modeController?.setMode(e.mode),e.optionsPosition!==void 0&&(this.container.dataset.optionsPosition=e.optionsPosition),e.animations!==void 0&&(this.container.dataset.animations=e.animations?"on":"off"),e.pillPlacement!==void 0&&(this.container.dataset.pillPlacement=e.pillPlacement,this.store.set({})),e.dropdownTrigger!==void 0&&this.store.set({}),e.value!==void 0&&this.store.set({text:e.value}),e.completedParams!==void 0&&this.store.set({completedParams:e.completedParams})}selectOption(e){let t=this.store.get(),i=t.actionableSuggestions[0];if(!i)return;let s=t.filterBase,n=t.text.slice(0,s),a=n.length===0&&t.text.length===0,d=n.length===0&&t.text.length>0&&t.placeholderText.length>0&&t.placeholderText.toLowerCase().startsWith(t.text.toLowerCase());(a||d)&&t.placeholderText&&(n=`${t.placeholderText} `);let r=ke(n,e.text);r>0&&(n=n.slice(0,n.length-r));let l=n.length>0&&n[n.length-1]!==" ",p=`${n}${l?" ":""}${e.text} `,c=(a||d)&&p.length>0?p[0].toUpperCase()+p.slice(1):p,u=c.toLowerCase().lastIndexOf(e.text.toLowerCase()),h=u>=0?c.slice(u,u+e.text.length):e.text,m={id:crypto.randomUUID(),placeholder:"",type:i.type,text:h,kind:e.kind,suggestionType:i.type,suggestionPlaceholder:i.text,options:i.options??[],metadata:e.metadata},w=t.actionableSuggestions.length-1;this.store.set(x=>({text:c,filterBase:c.length,completedParams:[...x.completedParams,m],newParamId:m.id,pillTapped:!1,activeDropdownIndex:-1,skipNextFetch:w>0})),this.suggestionRemovalTimer=window.setTimeout(()=>{this.store.set(x=>({suggestions:x.suggestions.filter(b=>b!==i)}))},400)}recomputeDerived(e,t){if(this.derivedInProgress)return;this.derivedInProgress=!0;let i=Te(e.text,e.completedParams),s=e.suggestions.filter(b=>b.type!=="placeholder"),n=s[0],a=n?this.opts.optionOverrides?.[n.type]:void 0,d=Math.min(e.filterBase,e.text.length),l=e.lastRawQuery!==""||d>0?V(e.text,d,e.filterInProgress):"",p=n?a?a(l.trim()):n.options??[]:[],c=J(p,l),u=e.suggestions.filter(b=>b.type==="placeholder").map(b=>b.text).join(" ")||this.opts.placeholder||"",h=u.length>0,m=this.opts.dropdownTrigger??"auto",w=!1;m==="auto"?w=!e.isLoading&&c.length>0&&(!!e.text||e.pillTapped||!h):m==="manual"&&(w=!e.isLoading&&c.length>0&&e.pillTapped),this.store.set({segments:i,actionableSuggestions:s,filteredOptions:c,placeholderText:u,isDropdownOpen:w}),this.derivedInProgress=!1;let x=this.store.get();for(let b of this.externalListeners)b(x)}setupContainer(){this.container.classList.add("magicx-aia"),this.container.dataset.pillPlacement=this.renderMode==="dropdown"?"dropdown":this.opts.pillPlacement??"inline",this.container.dataset.optionsPosition=this.opts.optionsPosition??"below",this.container.dataset.animations=this.opts.animations??!0?"on":"off",this.modeController=new z(this.container,this.opts.mode??"auto")}buildAndRenderFull(){let e=this,t={store:this.store,listboxId:this.listboxId,get pillPlacement(){return e.opts.pillPlacement??"inline"},get onSubmit(){return e.opts.onSubmit},selectOption:i=>this.selectOption(i),setActivePill:i=>this.pillsController.setActivePill(i),handleKeyDown:i=>this.keyboardController.handleKeyDown(i),handleChange:i=>this.handleChange(i)};this.domRefs=Ne(this.container,t),this.subscribeBatchedRender(()=>{this.domRefs&&ye(this.domRefs,this.store.get(),t)}),ye(this.domRefs,this.store.get(),t),this.subscribeNewParamTimer()}buildAndRenderDropdown(){let e={store:this.store,listboxId:this.listboxId,selectOption:t=>this.selectOption(t),setActivePill:t=>this.pillsController.setActivePill(t)};this.dropdownRefs=ze(this.container,e),this.subscribeBatchedRender(()=>{this.dropdownRefs&&ve(this.dropdownRefs,this.store.get(),e)}),ve(this.dropdownRefs,this.store.get(),e),this.subscribeNewParamTimer()}subscribeBatchedRender(e){let t=!1;this.unsubscribers.push(this.store.subscribe(()=>{t||(t=!0,queueMicrotask(()=>{t=!1,e()}))}))}subscribeNewParamTimer(){this.unsubscribers.push(this.store.subscribe((e,t)=>{e.newParamId&&e.newParamId!==t.newParamId&&(this.newParamTimer&&clearTimeout(this.newParamTimer),this.newParamTimer=window.setTimeout(()=>{this.store.set({newParamId:null})},650))}))}handleChange(e){let t=this.store.get();this.store.set({text:e,pillTapped:!1,activeDropdownIndex:-1});let{valid:i,invalid:s}=Oe(e,t.completedParams);s.length>0&&this.store.set(n=>({completedParams:i,suggestions:[...s.map(a=>({type:a.suggestionType,text:a.suggestionPlaceholder,required:!0,options:a.options})),...n.suggestions]}))}};function Se({onSubmit:o,onError:e,optionOverrides:t,maskCompletedText:i,placeholder:s,apiConfig:n,columns:a=2,dropdownTrigger:d,value:r,completedParams:l,onChange:p,onParamsChange:c}){let u=R(null),[h,m]=ht(null),w=R(o);w.current=o;let x=R(e);x.current=e;let b=R(p);b.current=p;let I=R(c);I.current=c,se(()=>{if(typeof document>"u")return;let v=new re(document.createElement("div"),{renderMode:"headless",apiConfig:n,optionOverrides:t,maskCompletedText:i,placeholder:s,columns:a,dropdownTrigger:d,value:r,completedParams:l,onSubmit:(...f)=>w.current?.(...f),onError:(...f)=>x.current?.(...f),onChange:(...f)=>b.current?.(...f),onParamsChange:(...f)=>I.current?.(...f)});u.current=v,m(v.getState());let _=v.subscribe(f=>m(f));return()=>{_(),v.destroy(),u.current===v&&(u.current=null)}},[]);let g=u.current,S=T(()=>{},[]);se(()=>{r!==void 0&&g?.setValue(r)},[r,g]),se(()=>{l!==void 0&&g?.setCompletedParams(l)},[l,g]);let U=JSON.stringify(n??null),P=R(t),M=R(0);if(t!==P.current){let v=P.current,_=t,f=Object.keys(v??{}),k=Object.keys(_??{});(f.length!==k.length||k.some(j=>!v?.[j]||_[j]!==v[j]))&&M.current++,P.current=t}se(()=>{g?.update({apiConfig:n,optionOverrides:t,dropdownTrigger:d})},[U,M.current,d,g]);let le=T(v=>{if(!g)return;let _=v.target.value,k=_.length>0&&!v.nativeEvent?.isComposing&&_[0]!==_[0].toUpperCase()?_[0].toUpperCase()+_.slice(1):_;g.handleTextChange(k)},[g]),de=T(v=>{g?.handleKeyDown(v.nativeEvent)},[g]),N=T(v=>g?.setActivePill(v),[g]),L=T(()=>g?.removeLastParam(),[g]),Q=T(()=>g?.clearNewParamId(),[g]),O=T(()=>g?.reset(),[g]),pe=T(v=>g?.selectOption(v),[g]),H=T(v=>g?.setActiveDropdownIndex(v),[g]);if(!g)return{completedParams:l??[],suggestionPills:[],setActivePill:S,removeLastParam:S,segments:[],newParamId:null,clearNewParamId:S,suggestions:[],activeIndex:-1,isReady:!1,isLoading:!0,error:null,inputProps:{value:r??"",placeholder:s,onChange:S,onKeyDown:S,role:"combobox","aria-expanded":!1,"aria-activedescendant":void 0,"aria-autocomplete":"list","aria-controls":""},reset:S,dropdownProps:{suggestions:[],activeIndex:-1,onSelect:S,onHighlight:S,isOpen:!1,id:"",pills:[],onPillClick:S}};let y=h??g.getState(),K=r!==void 0?r:y.text,W=l!==void 0?l:y.completedParams,$=y.actionableSuggestions,F=$[0],ce=y.filteredOptions,ue=y.activeDropdownIndex>=0?`${g.listboxId}-option-${y.activeDropdownIndex}`:void 0;return{completedParams:W,suggestionPills:$,setActivePill:N,removeLastParam:L,segments:y.segments,newParamId:y.newParamId,clearNewParamId:Q,suggestions:y.suggestions,activeIndex:y.activeDropdownIndex,isReady:y.isReady,isLoading:y.isLoading,error:y.error,inputProps:{value:K,placeholder:y.placeholderText||void 0,onChange:le,onKeyDown:de,role:"combobox","aria-expanded":y.isDropdownOpen,"aria-activedescendant":ue,"aria-autocomplete":"list","aria-controls":g.listboxId},reset:O,dropdownProps:{suggestions:F?[{...F,options:ce}]:[],activeIndex:y.activeDropdownIndex,onSelect:pe,onHighlight:H,isOpen:y.isDropdownOpen,id:g.listboxId,pills:$,onPillClick:N}}}import{jsx as E,jsxs as B}from"react/jsx-runtime";function yt(o){return o!=="auto"?o:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var wt=xt(function({onSubmit:e,onError:t,optionOverrides:i,maskCompletedText:s,placeholder:n,className:a,apiConfig:d,columns:r,pillPlacement:l="inline",mode:p="auto",optionsPosition:c="below",animations:u=!0,dropdownTrigger:h,value:m,completedParams:w,onChange:x,onParamsChange:b},I){let g=ae(null),S=ae(null),U=ae(()=>{}),P=ae(null);Ie(()=>{S.current?.focus()},[]),Ie(()=>{let f=g.current;if(f)return P.current?P.current.setMode(p):P.current=new z(f,p),()=>{P.current?.destroy(),P.current=null}},[p]);let{completedParams:M,suggestionPills:le,setActivePill:de,segments:N,newParamId:L,clearNewParamId:Q,inputProps:O,dropdownProps:pe,reset:H}=Se({onSubmit:f=>U.current(f),onError:t,optionOverrides:i,maskCompletedText:s,placeholder:n,apiConfig:d,columns:r,dropdownTrigger:h,value:m,completedParams:w,onChange:x,onParamsChange:b});Ie(()=>{if(!L)return;let f=window.setTimeout(()=>Q(),650);return()=>window.clearTimeout(f)},[L,Q]),vt(I,()=>({focus:()=>S.current?.focus(),reset:H,setMode:f=>P.current?.setMode(f)}),[H]);let y=()=>{S.current?.focus()},K=!!O.value||M.length>0,W=bt(()=>{if(!K)return;let{rawQuery:f,completedParams:k}=D(O.value,M);e({query:O.value.trim(),raw_query:f,completed_params:k}),H()},[K,O.value,M,e,H]);U.current=W;let{onChange:$,placeholder:F,...ce}=O,ue=!O.value,v=l==="inline",_=l==="dropdown";return B("div",{ref:g,className:`magicx-aia ${C.container} ${a??""}`,"data-pill-placement":l,"data-options-position":c,"data-animations":u?"on":"off","data-mode":yt(p),children:[E(xe,{...pe,showPills:_}),B("div",{className:C.inputWrapper,onClick:y,children:[B("div",{className:C.editorArea,children:[B("div",{className:C.sizerContent,"aria-hidden":"true",children:[ue&&F?B("span",{className:C.placeholderText,children:[F," "]}):B("span",{className:`${C.sizerText} ${L?C.sizerTextVisible:""}`,children:[N.map((f,k)=>{if(f.type==="completed"&&f.param.id===L){let qe=`${C.shimmerRevealed} ${C.shimmerSweep}`;return E("span",{className:qe,children:f.value},`${k}-${f.type}`)}return E("span",{children:f.value},`${k}-${f.type}`)}),N.length===0&&"\xA0"]})," ",v&&E(X,{pills:le,activePillIndex:0,onSelectPill:de})]}),E("textarea",{ref:S,className:`${C.textarea} ${L?C.textareaHidden:""}`,rows:1,onChange:$,...ce})]}),E("button",{type:"button",className:C.submitButton,disabled:!K,onClick:f=>{f.stopPropagation(),W()},"aria-label":"Submit",children:E("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:E("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]})});export{wt as AIAutocomplete,xe as AIAutocompleteDropdown,Se as useAIAutocomplete};
|
|
686
|
+
`,document.head.appendChild(o)}import{useCallback as C,useEffect as re,useRef as E,useState as ht}from"react";function q(o,e,t){let i=o.slice(e);if(t||e===0||o[e-1]===" ")return i;let s=i.indexOf(" ");return s===-1?"":i.slice(s+1)}function Te(o,e){let t=o.trimEnd().replace(/\s+/g," ");if(t.length===0||e.length===0)return 0;let i=t.split(" "),s=e.toLowerCase();for(let n=0;n<i.length;n++){let a=i.slice(n).join(" ");if(s.startsWith(a.toLowerCase())){let d=t.length-a.length;return o.length-d}}return 0}function X(o,e){if(!o)return[];let t=e.trimStart();if(!t)return o;let i=t.toLowerCase();return o.filter(s=>!s.is_tappable||s.text.toLowerCase().includes(i))}function ve(o,e){if(!o)return null;let t=e.trim();if(!t)return null;let i=t.toLowerCase();return o.find(s=>s.is_tappable&&s.text.toLowerCase()===i)??null}var z=class{constructor(e,t="auto"){this.container=e;this.mode=t;this.mediaQuery=null;this.onSystemChange=e=>{this.container.dataset.mode=e.matches?"dark":"light"};this.apply()}setMode(e){this.detachListener(),this.mode=e,this.apply()}destroy(){this.detachListener()}apply(){this.mode==="auto"?(this.mediaQuery??(this.mediaQuery=window.matchMedia("(prefers-color-scheme: dark)")),this.mediaQuery.addEventListener("change",this.onSystemChange),this.container.dataset.mode=this.mediaQuery.matches?"dark":"light"):this.container.dataset.mode=this.mode}detachListener(){this.mediaQuery?.removeEventListener("change",this.onSystemChange)}};function Oe(o,e){let t=[],i=0;for(let n of e){let a=o.indexOf(n.text,i);a!==-1&&(a>i&&t.push({type:"text",value:o.slice(i,a)}),t.push({type:"completed",value:n.text,param:n}),i=a+n.text.length)}let s=o.slice(i);return s&&t.push({type:"text",value:s}),t}function De(o,e){let t=[],i=[],s=0;for(let n of e){let a=o.indexOf(n.text,s);a===-1?i.push(n):(t.push(n),s=a+n.text.length)}return{valid:t,invalid:i}}var J=class{constructor(e){this.config=e;this.current=null;this.expiresAt=null;this.inFlightRefresh=null;e.accessToken&&(this.current=e.accessToken)}async getToken(e=!1){if(!e&&this.current&&!this.isExpired())return this.current;if(!e&&this.inFlightRefresh)return this.inFlightRefresh;this.inFlightRefresh=this.refresh();try{return await this.inFlightRefresh}finally{this.inFlightRefresh=null}}async refresh(){let e=await this.config.getAccessToken();return this.current=e.accessToken,this.expiresAt=e.expiresAt??null,this.current}isExpired(){return this.expiresAt==null?!1:Date.now()>=this.expiresAt-3e4}};var Ze="0.1.26",Ee=!1;function et(){return crypto.randomUUID()}function tt(o,e){return{placeholder:o.placeholder,type:o.type,...e&&{text:o.text},kind:o.kind}}function Me(o){return o?.type==="accessToken"}function ot(o){if(!(!o||Me(o)))return o}var Le=new WeakMap;function it(o){let e=Le.get(o.getAccessToken);return e||(e=new J(o),Le.set(o.getAccessToken,e)),e}function nt(o,e,t){let i=e.find(n=>n.type==="contact"&&n.metadata?.contact_account_count)?.metadata?.contact_account_count,s=typeof i=="number"?i:void 0;return{data:{raw_query:o,completed_params:e.map(n=>tt(n,t)),...s!=null&&{contact_account_count:s}},meta:{request_id:et(),request_at:new Date().toISOString(),language:typeof navigator<"u"?navigator.language:"en-US",client_version:Ze}}}function rt(o){return{"Content-Type":"application/json",...o?.appIdentifier&&{"X-App-Identifier":o.appIdentifier},...o?.headers}}async function Re(o,e,t,i,s){return fetch(o,{method:"POST",headers:{...e,Authorization:`Bearer ${t}`},body:i,signal:s})}async function He(o,e,t){let i=t?.apiConfig,s=!t?.maskCompletedText,n=nt(o,e,s),a=rt(i),d=i?.endpoint??"/ac/suggest",r=JSON.stringify(n);if(Me(i)){let m=it(i),h=await m.getToken(),g=await Re(d,a,h,r,t?.signal);if(g.status===401){let S=await m.getToken(!0);g=await Re(d,a,S,r,t?.signal)}if(!g.ok)throw new Error(`API error: ${g.status} ${g.statusText}`);return g.json()}let l=ot(i),p=l?.apiKey??"";if(!p&&!Ee&&(Ee=!0,console.warn("[AIAutocomplete] No apiKey in apiConfig. Requests will be sent without an Authorization header.")),p){let m=l?.authScheme??"Bearer";a.Authorization=m==="Basic"?`Basic ${btoa(p)}`:`Bearer ${p}`}let c=await fetch(d,{method:"POST",headers:a,body:r,signal:t?.signal});if(!c.ok)throw new Error(`API error: ${c.status} ${c.statusText}`);return c.json()}function T(o,e){let t=o,i={},s=[];for(let n of e){let a=(i[n.type]??0)+1;i[n.type]=a;let r=`{{${n.type.toUpperCase().replace(/\s+/g,"_")}_${a}}}`,l=t.indexOf(n.text);l!==-1&&(t=t.slice(0,l)+r+t.slice(l+n.text.length)),s.push({...n,placeholder:r})}return{rawQuery:t,completedParams:s}}function ze(o,e){return e?o.map(t=>{let i=e[t.type];if(!i)return t;let s=i("");if(s.length===0)return t;let n=new Set(s.map(d=>d.text)),a=(t.options??[]).filter(d=>!n.has(d.text));return{...t,options:[...s,...a]}}):o}var st=100,at=300,lt=2,Y=class{constructor(e,t,i,s,n){this.store=e;this.getApiConfig=t;this.getOptionOverrides=i;this.getMaskCompletedText=s;this.getOnError=n;this.fetchVersion=0;this.abortController=null;this.debounceTimer=null;this.slowDebounceTimer=null;this.unsubscribe=null}start(){this.doFetch("",[]);let e=this.store.get().text,t=this.store.get().completedParams;this.unsubscribe=this.store.subscribe(i=>{(i.text!==e||i.completedParams!==t)&&(e=i.text,t=i.completedParams,this.scheduleFetch())})}dispose(){this.abortController?.abort(),this.clearTimers(),this.unsubscribe?.()}async doFetch(e,t){this.abortController?.abort();let i=new AbortController;this.abortController=i;let s=++this.fetchVersion,n=this.store.get(),a=n.text.length;n.suggestions.some(r=>r.type!=="placeholder")||this.store.set({isLoading:!0}),this.store.set({error:null});try{let r=await He(e,t,{maskCompletedText:this.getMaskCompletedText(),signal:i.signal,apiConfig:this.getApiConfig()});if(s!==this.fetchVersion)return;let l=ze(r.data.suggestions??[],this.getOptionOverrides()),p=r.data.input??[],c=p[p.length-1],m=this.store.get().text,h,g;if(c?.state==="in_progress"){g=!0;let u=m.toLowerCase().lastIndexOf(c.text.toLowerCase());h=u!==-1?u:a}else g=!1,h=a;let x=l.filter(u=>u.type!=="placeholder")[0],I=null;if(x){let u=q(m,h,g),v=ve(x.options,u);v&&(I={id:crypto.randomUUID(),placeholder:"",type:x.type,text:v.text,kind:v.kind,suggestionType:x.type,suggestionPlaceholder:x.text,options:x.options??[],metadata:v.metadata},l=l.filter(L=>L!==x))}this.store.set(u=>({suggestions:l,isLoading:!1,isReady:r.data.is_ready??!1,lastRawQuery:e,activeDropdownIndex:-1,filterBase:h,filterInProgress:g,...I?{completedParams:[...u.completedParams,I]}:{}}))}catch(r){if(s===this.fetchVersion){let l=r instanceof Error?r:new Error(String(r));this.store.set({error:l,isLoading:!1}),this.getOnError()?.(l)}}}scheduleFetch(){if(this.clearTimers(),this.store.get().skipNextFetch){this.store.set({skipNextFetch:!1});return}let t=i=>{let s=this.store.get();if(!s.text&&s.completedParams.length===0)return this.doFetch("",[]),!0;let n=q(s.text,s.filterBase,s.filterInProgress),d=s.suggestions.filter(x=>x.type!=="placeholder")[0],l=(d?X(d.options,n):[]).filter(x=>x.is_tappable),p=d?ve(d.options,n)!==null:!1,c=n.trim().length>0;if(l.length>0&&!p&&c)return!1;if(s.completedParams.length===0&&s.text.length>0){let x=s.suggestions.filter(I=>I.type==="placeholder").map(I=>I.text).join(" ");if(x.length>0&&x.toLowerCase().startsWith(s.text.toLowerCase()))return!1}let{rawQuery:m,completedParams:h}=T(s.text,s.completedParams),g=m.length<s.lastRawQuery.length,S=Math.abs(m.length-s.lastRawQuery.length);return g||S>=i?(this.doFetch(m,h),!0):!1};this.debounceTimer=setTimeout(()=>{t(lt)&&this.slowDebounceTimer&&clearTimeout(this.slowDebounceTimer)},st),this.slowDebounceTimer=setTimeout(()=>t(1),at)}clearTimers(){this.debounceTimer&&clearTimeout(this.debounceTimer),this.slowDebounceTimer&&clearTimeout(this.slowDebounceTimer),this.debounceTimer=null,this.slowDebounceTimer=null}};var Z=class{constructor(e,t){this.store=e;this.ctx=t}handleKeyDown(e){let t=this.store.get(),{listboxId:i,getOnSubmit:s}=this.ctx,n=this.getEffectiveColumns(),a=s(),d=this.getTappableIndices(n);switch(e.key){case"ArrowDown":{let r=e.target;if(!(r.selectionStart!=null&&r.selectionStart===r.value.length)&&t.activeDropdownIndex<0)break;if(e.preventDefault(),!t.isDropdownOpen&&t.actionableSuggestions.length>0){this.store.set({pillTapped:!0,activeDropdownIndex:d[0]??0});break}if(d.length===0)return;let p=d.indexOf(t.activeDropdownIndex),c=p<d.length-1?p+1:0;this.store.set({activeDropdownIndex:d[c]});break}case"ArrowUp":{if(d.length===0||t.activeDropdownIndex<0)break;if(e.preventDefault(),t.activeDropdownIndex<n){this.store.set({activeDropdownIndex:-1});break}let r=d.indexOf(t.activeDropdownIndex),l=r>0?r-1:d.length-1;this.store.set({activeDropdownIndex:d[l]});break}case"ArrowRight":{if(t.activeDropdownIndex<0){let l=e.target;l.selectionStart!=null&&l.selectionStart===l.value.length&&t.actionableSuggestions.length>1&&(e.preventDefault(),this.pillsSetActivePill(1));break}if(t.activeDropdownIndex%n<n-1){let l=t.activeDropdownIndex+1;l<t.filteredOptions.length&&t.filteredOptions[l]?.is_tappable&&(e.preventDefault(),this.store.set({activeDropdownIndex:l}))}break}case"ArrowLeft":{if(t.activeDropdownIndex<0)break;if(t.activeDropdownIndex%n>0){let r=t.activeDropdownIndex-1;r>=0&&t.filteredOptions[r]?.is_tappable&&(e.preventDefault(),this.store.set({activeDropdownIndex:r}))}break}case"Enter":{if(e.preventDefault(),t.activeDropdownIndex>=0&&t.filteredOptions[t.activeDropdownIndex]?.is_tappable)this.clickOrSelect(t.activeDropdownIndex,t.filteredOptions,i);else if(a){let{rawQuery:r,completedParams:l}=T(t.text,t.completedParams);a({query:t.text.trim(),raw_query:r,completed_params:l})}break}case"Tab":{let r=!t.text&&!!t.placeholderText,l=t.activeDropdownIndex>=0&&t.filteredOptions[t.activeDropdownIndex]?.is_tappable;if(r&&!l){e.preventDefault();let p=t.suggestions.find(c=>c.type==="placeholder");p?this.store.set(c=>({text:t.placeholderText,filterBase:t.placeholderText.length,completedParams:[...c.completedParams,{id:crypto.randomUUID(),placeholder:"",type:p.type,text:t.placeholderText,kind:null,suggestionType:p.type,suggestionPlaceholder:p.text,options:p.options??[]}],suggestions:c.suggestions.filter(m=>m!==p)})):this.store.set({text:t.placeholderText,filterBase:t.placeholderText.length})}else if(l)e.preventDefault(),this.clickOrSelect(t.activeDropdownIndex,t.filteredOptions,i);else if(t.isDropdownOpen){let p=t.filteredOptions.findIndex(c=>c.is_tappable);p>=0&&(e.preventDefault(),this.clickOrSelect(p,t.filteredOptions,i))}break}case"Escape":this.store.set({activeDropdownIndex:-1});break}}getTappableIndices(e){let i=this.store.get().filteredOptions.map((n,a)=>n.is_tappable?a:-1).filter(n=>n!==-1),s=Array.from({length:e},()=>[]);for(let n of i)s[n%e].push(n);return s.flat()}getEffectiveColumns(){let t=document.getElementById(`${this.ctx.listboxId}-option-0`)?.parentElement;if(!t)return this.ctx.columns;let i=getComputedStyle(t).gridTemplateColumns.split(" ").filter(Boolean).length;return i>0?i:this.ctx.columns}clickOrSelect(e,t,i){let s=document.getElementById(`${i}-option-${e}`);s?s.click():this.ctx.selectOption(t[e])}pillsSetActivePill(e){let t=this.store.get(),i=t.suggestions.filter(d=>d.type!=="placeholder");if(e<0||e>=i.length)return;let s=i[e],n=i.filter((d,r)=>r!==e),a=t.suggestions.filter(d=>d.type==="placeholder");this.store.set({suggestions:[...a,s,...n],pillTapped:!0,activeDropdownIndex:-1})}};var ee=class{constructor(e){this.store=e}setActivePill(e){let t=this.store.get(),i=t.suggestions.filter(d=>d.type!=="placeholder");if(e<0||e>=i.length)return;let s=i[e],n=i.filter((d,r)=>r!==e),a=t.suggestions.filter(d=>d.type==="placeholder");this.store.set({suggestions:[...a,s,...n],pillTapped:!0,activeDropdownIndex:-1})}removeLastParam(){let e=this.store.get();if(e.completedParams.length===0)return;let t=e.completedParams[e.completedParams.length-1],i={type:t.suggestionType,text:t.suggestionPlaceholder,required:!0,options:t.options};this.store.set(s=>({completedParams:s.completedParams.slice(0,-1),suggestions:[i,...s.suggestions],activeDropdownIndex:-1}))}};function dt(o){return o===0?.4:o===1?.3:.15}function te(o,e,t,i,s=!1){let n=o.querySelector(".magicx-aia-pill-list");n||(n=document.createElement("span"),n.className="magicx-aia-pill-list",o.appendChild(n));let a=new Map;for(let r of n.querySelectorAll(".magicx-aia-pill"))a.set(r.dataset.pillKey??"",r);let d=new Set;for(let r=0;r<e.length;r++){let l=e[r],p=`${l.type}-${l.text}`;d.add(p);let c=a.get(p);c||(c=document.createElement("button"),c.type="button",c.dataset.pillKey=p,c.setAttribute("data-aia-pill",""),c.textContent=l.text),c.className=`magicx-aia-pill${s?" magicx-aia-pill--rounded":""}${r===t?" magicx-aia-pill--active":""}`,c.style.opacity=String(dt(r)),c.onclick=()=>i(r),n.children[r]!==c&&n.insertBefore(c,n.children[r]??null)}for(let[r,l]of a)d.has(r)||l.remove()}function oe(o){let e=document.createElement("div");return e.id=o,e.setAttribute("role","listbox"),e.setAttribute("data-aia-dropdown",""),e.className="magicx-aia-dropdown",e.addEventListener("mousedown",t=>t.preventDefault()),e}function ie(o,e){let{filteredOptions:t,activeIndex:i,isOpen:s,pills:n,showPills:a,onSelect:d,onHighlight:r,onPillClick:l}=e,p=a&&n.length>0;s&&t.length>0||s&&p?o.classList.add("magicx-aia-dropdown--visible"):o.classList.remove("magicx-aia-dropdown--visible");let h=o.querySelector(".magicx-aia-pill-bar");p?(h||(h=document.createElement("div"),h.className="magicx-aia-pill-bar",h.setAttribute("data-aia-pillbar",""),o.insertBefore(h,o.firstChild)),te(h,n,0,l,!0)):h&&h.remove();let g=o.querySelector(".magicx-aia-grid");t.length>0?(g||(g=document.createElement("div"),g.className="magicx-aia-grid",o.appendChild(g)),pt(g,t,i,d,r,e.listboxId)):g&&(g.innerHTML="")}function pt(o,e,t,i,s,n){let a=e.map(l=>l.text).join("\0"),d=o.dataset.optionsKey??"",r=a!==d;if(o.dataset.optionsKey=a,r){let l=document.createDocumentFragment();for(let p=0;p<e.length;p++){let c=e[p],m=ct(c,p,t,i,s,n);l.appendChild(m)}o.innerHTML="",o.appendChild(l)}else{let l=o.querySelectorAll(".magicx-aia-option");for(let p=0;p<l.length;p++){let c=l[p],m=p===t;c.setAttribute("aria-selected",String(m)),m?c.classList.add("magicx-aia-option--highlighted"):c.classList.remove("magicx-aia-option--highlighted")}}}function ct(o,e,t,i,s,n){let a=document.createElement("div");a.id=`${n}-option-${e}`,a.setAttribute("role","option"),a.setAttribute("data-aia-option",""),a.setAttribute("aria-selected",String(e===t)),a.tabIndex=o.is_tappable?0:-1;let d=["magicx-aia-option"];e===t&&d.push("magicx-aia-option--highlighted"),o.is_tappable?d.push("magicx-aia-option--tappable"):d.push("magicx-aia-option--non-tappable"),a.className=d.join(" ");let r=document.createElement("div");r.className="magicx-aia-streaks",a.appendChild(r);let l=document.createElement("div");l.className="magicx-aia-streaks-vert",a.appendChild(l);let p=document.createElement("span");if(p.className="magicx-aia-option-content",p.textContent=o.icon?`${o.icon} ${o.text}`:o.text,o.tag){let c=document.createElement("span");c.className="magicx-aia-option-tag",c.textContent=o.tag,p.appendChild(c)}return a.appendChild(p),o.is_tappable&&(a.addEventListener("click",()=>{a.classList.add("magicx-aia-option--pressed"),i(o),setTimeout(()=>a.classList.remove("magicx-aia-option--pressed"),400)}),a.addEventListener("mouseenter",()=>s(e))),a}function Be(o,e){let t=oe(e.listboxId);return o.appendChild(t),{dropdown:t}}function ye(o,e,t){ie(o.dropdown,{suggestions:e.actionableSuggestions.length>0?[{...e.actionableSuggestions[0],options:e.filteredOptions}]:[],filteredOptions:e.filteredOptions,activeIndex:e.activeDropdownIndex,isOpen:e.isDropdownOpen,listboxId:t.listboxId,pills:e.actionableSuggestions,showPills:!0,onSelect:t.selectOption,onHighlight:i=>t.store.set({activeDropdownIndex:i}),onPillClick:t.setActivePill})}function Ne(o,e,t,i,s){let n=o.querySelector(".magicx-aia-sizer-text"),a=o.querySelector(".magicx-aia-placeholder");if(i&&s){n&&(n.style.display="none"),a||(a=document.createElement("span"),a.className="magicx-aia-placeholder",o.insertBefore(a,o.firstChild)),a.style.display="",a.textContent=`${s} `,o.dataset.segmentKey="";return}a&&(a.style.display="none"),n||(n=document.createElement("span"),n.className="magicx-aia-sizer-text",o.insertBefore(n,o.firstChild)),n.style.display="",n.className=`magicx-aia-sizer-text${t?" magicx-aia-sizer-text--visible":""}`;let d=e.map(p=>`${p.type}:${p.value}`).join("\0"),r=o.dataset.segmentKey??"",l=o.dataset.newParamId??"";if(!(d===r&&(t??"")===l)){o.dataset.segmentKey=d,o.dataset.newParamId=t??"",n.innerHTML="";for(let p of e){let c=document.createElement("span");p.type==="completed"&&(p.param.id===t?c.className="magicx-aia-shimmer-revealed magicx-aia-shimmer-sweep":c.className="magicx-aia-segment magicx-aia-segment--completed"),c.textContent=p.value,n.appendChild(c)}e.length===0&&(n.textContent="\xA0")}}var ut='<svg width="18" height="18" viewBox="0 0 18 18" fill="none" role="img" aria-label="Submit"><path d="M9 14V4M9 4L4 9M9 4L14 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>';function Ke(o,e){let{listboxId:t}=e,i=oe(t);o.appendChild(i);let s=document.createElement("div");s.className="magicx-aia-input-wrapper",o.appendChild(s);let n=document.createElement("div");n.className="magicx-aia-editor",n.setAttribute("data-aia-editor",""),s.appendChild(n);let a=document.createElement("div");a.className="magicx-aia-sizer",a.setAttribute("aria-hidden","true"),n.appendChild(a);let d=document.createElement("span");a.appendChild(document.createTextNode(" ")),a.appendChild(d);let r=document.createElement("textarea");r.className="magicx-aia-textarea",r.rows=1,r.setAttribute("role","combobox"),r.setAttribute("aria-autocomplete","list"),r.setAttribute("aria-controls",t),r.setAttribute("data-aia-textarea",""),n.appendChild(r);let l=document.createElement("button");return l.type="button",l.className="magicx-aia-submit",l.setAttribute("aria-label","Submit"),l.setAttribute("data-aia-submit",""),l.innerHTML=ut,s.appendChild(l),s.addEventListener("click",()=>r.focus()),r.addEventListener("input",()=>{let p=r.value,m=p.length>0&&p[0]!==p[0].toUpperCase()?p[0].toUpperCase()+p.slice(1):p;e.handleChange(m)}),r.addEventListener("keydown",p=>e.handleKeyDown(p)),r.addEventListener("focus",()=>e.store.set({isFocused:!0})),r.addEventListener("blur",()=>e.store.set({isFocused:!1})),l.addEventListener("click",p=>{p.stopPropagation();let c=e.store.get();if(!(!!c.text||c.completedParams.length>0)||!e.onSubmit)return;let{rawQuery:h,completedParams:g}=T(c.text,c.completedParams);e.onSubmit({query:c.text.trim(),raw_query:h,completed_params:g})}),r.focus(),{textarea:r,dropdown:i,sizer:a,submitButton:l,inlinePillContainer:d}}function we(o,e,t){let{textarea:i,dropdown:s,sizer:n,submitButton:a,inlinePillContainer:d}=o,{pillPlacement:r,setActivePill:l,selectOption:p,store:c}=t;i.value!==e.text&&(i.value=e.text),e.placeholderText?i.placeholder=e.placeholderText:i.removeAttribute("placeholder"),i.setAttribute("aria-expanded",String(e.isDropdownOpen));let m=e.activeDropdownIndex>=0?`${t.listboxId}-option-${e.activeDropdownIndex}`:"";m?i.setAttribute("aria-activedescendant",m):i.removeAttribute("aria-activedescendant"),e.newParamId?i.classList.add("magicx-aia-textarea--hidden"):i.classList.remove("magicx-aia-textarea--hidden");let h=!!e.text||e.completedParams.length>0;a.disabled=!h,Ne(n,e.segments,e.newParamId,!e.text,e.placeholderText),r==="inline"?te(d,e.actionableSuggestions,0,l):d.innerHTML="",ie(s,{suggestions:e.actionableSuggestions.length>0?[{...e.actionableSuggestions[0],options:e.filteredOptions}]:[],filteredOptions:e.filteredOptions,activeIndex:e.activeDropdownIndex,isOpen:e.isDropdownOpen,listboxId:t.listboxId,pills:e.actionableSuggestions,showPills:r==="dropdown",onSelect:p,onHighlight:g=>c.set({activeDropdownIndex:g}),onPillClick:l})}function Fe(o){let e=o,t=new Set;return{get:()=>e,set:i=>{let s=typeof i=="function"?i(e):i,n={...e,...s},a=e;e=n;for(let d of t)d(n,a)},subscribe:i=>(t.add(i),()=>{t.delete(i)})}}var Se=!1;function $e(){if(Se||typeof document>"u")return;if(document.querySelector("style[data-magicx-aia]")){Se=!0;return}Se=!0;let o=document.createElement("style");o.setAttribute("data-magicx-aia",""),o.textContent=mt,document.head.appendChild(o)}var mt="";var gt=0;function ft(){return`:ac-${++gt}:`}function qe(){return{text:"",completedParams:[],suggestions:[],activeDropdownIndex:-1,newParamId:null,isLoading:!1,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],placeholderText:"",isDropdownOpen:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1}}var ne=class{constructor(e,t={}){this.store=Fe(qe());this._listboxId=ft();this.modeController=null;this.unsubscribers=[];this.derivedInProgress=!1;this.domRefs=null;this.dropdownRefs=null;this.externalListeners=new Set;this.container=e,this.opts=t,this.renderMode=t.renderMode??"full",t.value!==void 0&&this.store.set({text:t.value}),t.completedParams!==void 0&&this.store.set({completedParams:t.completedParams}),this.pillsController=new ee(this.store),this.fetchController=new Y(this.store,()=>this.opts.apiConfig,()=>this.opts.optionOverrides,()=>this.opts.maskCompletedText,()=>this.opts.onError),this.keyboardController=new Z(this.store,{columns:t.columns??2,listboxId:this.listboxId,getOnSubmit:()=>this.opts.onSubmit,selectOption:i=>this.selectOption(i)}),this.unsubscribers.push(this.store.subscribe((i,s)=>{this.recomputeDerived(i,s)})),this.unsubscribers.push(this.store.subscribe((i,s)=>{i.text!==s.text&&this.opts.onChange?.(i.text),i.completedParams!==s.completedParams&&this.opts.onParamsChange?.(i.completedParams),this.opts.onStateChange?.(i)})),this.renderMode!=="headless"&&($e(),this.setupContainer()),this.renderMode==="full"?this.buildAndRenderFull():this.renderMode==="dropdown"&&this.buildAndRenderDropdown(),this.fetchController.start()}focus(){this.domRefs?.textarea.focus()}reset(){this.store.set({...qe()}),this.fetchController.doFetch("",[])}destroy(){this.fetchController.dispose(),this.modeController?.destroy(),this.newParamTimer&&clearTimeout(this.newParamTimer),this.suggestionRemovalTimer&&clearTimeout(this.suggestionRemovalTimer),this.externalListeners.clear();for(let e of this.unsubscribers)e();this.unsubscribers=[],this.domRefs=null,this.dropdownRefs=null,this.renderMode!=="headless"&&(this.container.innerHTML="")}setMode(e){this.modeController?.setMode(e)}setValue(e){this.store.set({text:e})}setCompletedParams(e){this.store.set({completedParams:e})}setActivePill(e){this.pillsController.setActivePill(e)}removeLastParam(){this.pillsController.removeLastParam()}clearNewParamId(){this.store.set({newParamId:null})}setActiveDropdownIndex(e){this.store.set({activeDropdownIndex:e})}handleTextChange(e){this.handleChange(e)}handleKeyDown(e){this.keyboardController.handleKeyDown(e)}setFocused(e){this.store.get().isFocused!==e&&this.store.set({isFocused:e})}subscribe(e){return this.externalListeners.add(e),()=>{this.externalListeners.delete(e)}}getState(){return this.store.get()}get listboxId(){return this._listboxId}get isReady(){return this.store.get().isReady}on(e,t){switch(e){case"submit":return this.opts.onSubmit=t,()=>{this.opts.onSubmit=void 0};case"error":return this.opts.onError=t,()=>{this.opts.onError=void 0};case"change":return this.opts.onChange=t,()=>{this.opts.onChange=void 0};case"paramsChange":return this.opts.onParamsChange=t,()=>{this.opts.onParamsChange=void 0};case"stateChange":return this.opts.onStateChange=t,()=>{this.opts.onStateChange=void 0};default:return()=>{}}}update(e){Object.assign(this.opts,e),e.mode!==void 0&&this.modeController?.setMode(e.mode),e.optionsPosition!==void 0&&(this.container.dataset.optionsPosition=e.optionsPosition),e.animations!==void 0&&(this.container.dataset.animations=e.animations?"on":"off"),e.pillPlacement!==void 0&&(this.container.dataset.pillPlacement=e.pillPlacement,this.store.set({})),e.dropdownTrigger!==void 0&&this.store.set({}),e.value!==void 0&&this.store.set({text:e.value}),e.completedParams!==void 0&&this.store.set({completedParams:e.completedParams})}selectOption(e){let t=this.store.get(),i=t.actionableSuggestions[0];if(!i)return;let s=t.filterBase,n=t.text.slice(0,s),a=n.length===0&&t.text.length===0,d=n.length===0&&t.text.length>0&&t.placeholderText.length>0&&t.placeholderText.toLowerCase().startsWith(t.text.toLowerCase());(a||d)&&t.placeholderText&&(n=`${t.placeholderText} `);let r=Te(n,e.text);r>0&&(n=n.slice(0,n.length-r));let l=n.length>0&&n[n.length-1]!==" ",p=`${n}${l?" ":""}${e.text} `,c=(a||d)&&p.length>0?p[0].toUpperCase()+p.slice(1):p,m=c.toLowerCase().lastIndexOf(e.text.toLowerCase()),h=m>=0?c.slice(m,m+e.text.length):e.text,g={id:crypto.randomUUID(),placeholder:"",type:i.type,text:h,kind:e.kind,suggestionType:i.type,suggestionPlaceholder:i.text,options:i.options??[],metadata:e.metadata},S=t.actionableSuggestions.length-1;this.store.set(x=>({text:c,filterBase:c.length,completedParams:[...x.completedParams,g],newParamId:g.id,pillTapped:!1,activeDropdownIndex:-1,skipNextFetch:S>0})),this.suggestionRemovalTimer=window.setTimeout(()=>{this.store.set(x=>({suggestions:x.suggestions.filter(I=>I!==i)}))},400)}recomputeDerived(e,t){if(this.derivedInProgress)return;this.derivedInProgress=!0;let i=Oe(e.text,e.completedParams),s=e.suggestions.filter(x=>x.type!=="placeholder"),n=s[0],a=n?this.opts.optionOverrides?.[n.type]:void 0,d=Math.min(e.filterBase,e.text.length),l=e.lastRawQuery!==""||d>0?q(e.text,d,e.filterInProgress):"",p=n?a?a(l.trim()):n.options??[]:[],c=X(p,l),m=e.suggestions.filter(x=>x.type==="placeholder").map(x=>x.text).join(" "),h=this.opts.dropdownTrigger??"auto",g=!1;h==="auto"?g=!e.isLoading&&c.length>0&&e.isFocused:h==="manual"&&(g=!e.isLoading&&c.length>0&&e.pillTapped),this.store.set({segments:i,actionableSuggestions:s,filteredOptions:c,placeholderText:m,isDropdownOpen:g}),this.derivedInProgress=!1;let S=this.store.get();for(let x of this.externalListeners)x(S)}setupContainer(){this.container.classList.add("magicx-aia"),this.container.dataset.pillPlacement=this.renderMode==="dropdown"?"dropdown":this.opts.pillPlacement??"inline",this.container.dataset.optionsPosition=this.opts.optionsPosition??"below",this.container.dataset.animations=this.opts.animations??!0?"on":"off",this.modeController=new z(this.container,this.opts.mode??"auto")}buildAndRenderFull(){let e=this,t={store:this.store,listboxId:this.listboxId,get pillPlacement(){return e.opts.pillPlacement??"inline"},get onSubmit(){return e.opts.onSubmit},selectOption:i=>this.selectOption(i),setActivePill:i=>this.pillsController.setActivePill(i),handleKeyDown:i=>this.keyboardController.handleKeyDown(i),handleChange:i=>this.handleChange(i)};this.domRefs=Ke(this.container,t),this.subscribeBatchedRender(()=>{this.domRefs&&we(this.domRefs,this.store.get(),t)}),we(this.domRefs,this.store.get(),t),this.subscribeNewParamTimer()}buildAndRenderDropdown(){let e={store:this.store,listboxId:this.listboxId,selectOption:t=>this.selectOption(t),setActivePill:t=>this.pillsController.setActivePill(t)};this.dropdownRefs=Be(this.container,e),this.subscribeBatchedRender(()=>{this.dropdownRefs&&ye(this.dropdownRefs,this.store.get(),e)}),ye(this.dropdownRefs,this.store.get(),e),this.subscribeNewParamTimer()}subscribeBatchedRender(e){let t=!1;this.unsubscribers.push(this.store.subscribe(()=>{t||(t=!0,queueMicrotask(()=>{t=!1,e()}))}))}subscribeNewParamTimer(){this.unsubscribers.push(this.store.subscribe((e,t)=>{e.newParamId&&e.newParamId!==t.newParamId&&(this.newParamTimer&&clearTimeout(this.newParamTimer),this.newParamTimer=window.setTimeout(()=>{this.store.set({newParamId:null})},650))}))}handleChange(e){let t=this.store.get();this.store.set({text:e,pillTapped:!1,activeDropdownIndex:-1});let{valid:i,invalid:s}=De(e,t.completedParams);s.length>0&&this.store.set(n=>({completedParams:i,suggestions:[...s.map(a=>({type:a.suggestionType,text:a.suggestionPlaceholder,required:!0,options:a.options})),...n.suggestions]}))}};function Ie({onSubmit:o,onError:e,optionOverrides:t,maskCompletedText:i,apiConfig:s,columns:n=2,dropdownTrigger:a,value:d,completedParams:r,onChange:l,onParamsChange:p}){let c=E(null),[m,h]=ht(null),g=E(o);g.current=o;let S=E(e);S.current=e;let x=E(l);x.current=l;let I=E(p);I.current=p,re(()=>{if(typeof document>"u")return;let b=new ne(document.createElement("div"),{renderMode:"headless",apiConfig:s,optionOverrides:t,maskCompletedText:i,columns:n,dropdownTrigger:a,value:d,completedParams:r,onSubmit:(...w)=>g.current?.(...w),onError:(...w)=>S.current?.(...w),onChange:(...w)=>x.current?.(...w),onParamsChange:(...w)=>I.current?.(...w)});c.current=b,h(b.getState());let f=b.subscribe(w=>h(w));return()=>{f(),b.destroy(),c.current===b&&(c.current=null)}},[]);let u=c.current,v=C(()=>{},[]);re(()=>{d!==void 0&&u?.setValue(d)},[d,u]),re(()=>{r!==void 0&&u?.setCompletedParams(r)},[r,u]);let L=JSON.stringify(s??null),P=E(t),R=E(0);if(t!==P.current){let b=P.current,f=t,w=Object.keys(b??{}),K=Object.keys(f??{});(w.length!==K.length||K.some(F=>!b?.[F]||f[F]!==b[F]))&&R.current++,P.current=t}re(()=>{u?.update({apiConfig:s,optionOverrides:t,dropdownTrigger:a})},[L,R.current,a,u]);let ae=C(b=>{if(!u)return;let f=b.target.value,K=f.length>0&&!b.nativeEvent?.isComposing&&f[0]!==f[0].toUpperCase()?f[0].toUpperCase()+f.slice(1):f;u.handleTextChange(K)},[u]),le=C(b=>{u?.handleKeyDown(b.nativeEvent)},[u]),V=C(()=>u?.setFocused(!0),[u]),D=C(()=>u?.setFocused(!1),[u]),N=C(b=>u?.setActivePill(b),[u]),k=C(()=>u?.removeLastParam(),[u]),de=C(()=>u?.clearNewParamId(),[u]),M=C(()=>u?.reset(),[u]),U=C(b=>u?.selectOption(b),[u]),pe=C(b=>u?.setActiveDropdownIndex(b),[u]);if(!u)return{completedParams:r??[],suggestionPills:[],setActivePill:v,removeLastParam:v,segments:[],newParamId:null,clearNewParamId:v,suggestions:[],activeIndex:-1,isReady:!1,isLoading:!0,error:null,inputProps:{value:d??"",placeholder:void 0,onChange:v,onKeyDown:v,onFocus:v,onBlur:v,role:"combobox","aria-expanded":!1,"aria-activedescendant":void 0,"aria-autocomplete":"list","aria-controls":""},reset:v,dropdownProps:{suggestions:[],activeIndex:-1,onSelect:v,onHighlight:v,isOpen:!1,id:"",pills:[],onPillClick:v}};let y=m??u.getState(),Q=d!==void 0?d:y.text,ce=r!==void 0?r:y.completedParams,H=y.actionableSuggestions,W=H[0],ue=y.filteredOptions,me=y.activeDropdownIndex>=0?`${u.listboxId}-option-${y.activeDropdownIndex}`:void 0;return{completedParams:ce,suggestionPills:H,setActivePill:N,removeLastParam:k,segments:y.segments,newParamId:y.newParamId,clearNewParamId:de,suggestions:y.suggestions,activeIndex:y.activeDropdownIndex,isReady:y.isReady,isLoading:y.isLoading,error:y.error,inputProps:{value:Q,placeholder:y.placeholderText||void 0,onChange:ae,onKeyDown:le,onFocus:V,onBlur:D,role:"combobox","aria-expanded":y.isDropdownOpen,"aria-activedescendant":me,"aria-autocomplete":"list","aria-controls":u.listboxId},reset:M,dropdownProps:{suggestions:W?[{...W,options:ue}]:[],activeIndex:y.activeDropdownIndex,onSelect:U,onHighlight:pe,isOpen:y.isDropdownOpen,id:u.listboxId,pills:H,onPillClick:N}}}import{jsx as O,jsxs as B}from"react/jsx-runtime";function yt(o){return o!=="auto"?o:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var wt=xt(function({onSubmit:e,onError:t,optionOverrides:i,maskCompletedText:s,className:n,apiConfig:a,columns:d,pillPlacement:r="inline",mode:l="auto",optionsPosition:p="below",animations:c=!0,dropdownTrigger:m,value:h,completedParams:g,onChange:S,onParamsChange:x},I){let u=se(null),v=se(null),L=se(()=>{}),P=se(null);_e(()=>{let f=u.current;if(f)return P.current?P.current.setMode(l):P.current=new z(f,l),()=>{P.current?.destroy(),P.current=null}},[l]);let{completedParams:R,suggestionPills:ae,setActivePill:le,segments:V,newParamId:D,clearNewParamId:N,inputProps:k,dropdownProps:de,reset:M}=Ie({onSubmit:f=>L.current(f),onError:t,optionOverrides:i,maskCompletedText:s,apiConfig:a,columns:d,dropdownTrigger:m,value:h,completedParams:g,onChange:S,onParamsChange:x}),U=k.onFocus;_e(()=>{let f=v.current;f&&(document.activeElement===f?U():f.focus())},[U]),_e(()=>{if(!D)return;let f=window.setTimeout(()=>N(),650);return()=>window.clearTimeout(f)},[D,N]),vt(I,()=>({focus:()=>v.current?.focus(),reset:M,setMode:f=>P.current?.setMode(f)}),[M]);let pe=()=>{v.current?.focus()},y=!!k.value||R.length>0,Q=bt(()=>{if(!y)return;let{rawQuery:f,completedParams:w}=T(k.value,R);e({query:k.value.trim(),raw_query:f,completed_params:w}),M()},[y,k.value,R,e,M]);L.current=Q;let{onChange:ce,placeholder:H,...W}=k,ue=!k.value,me=r==="inline",b=r==="dropdown";return B("div",{ref:u,className:`magicx-aia ${_.container} ${n??""}`,"data-pill-placement":r,"data-options-position":p,"data-animations":c?"on":"off","data-mode":yt(l),children:[O(be,{...de,showPills:b}),B("div",{className:_.inputWrapper,onClick:pe,children:[B("div",{className:_.editorArea,"data-aia-editor":"",children:[B("div",{className:_.sizerContent,"aria-hidden":"true",children:[ue&&H?B("span",{className:_.placeholderText,children:[H," "]}):B("span",{className:`${_.sizerText} ${D?_.sizerTextVisible:""}`,children:[V.map((f,w)=>{if(f.type==="completed"&&f.param.id===D){let F=`${_.shimmerRevealed} ${_.shimmerSweep}`;return O("span",{className:F,children:f.value},`${w}-${f.type}`)}return O("span",{children:f.value},`${w}-${f.type}`)}),V.length===0&&"\xA0"]})," ",me&&O(G,{pills:ae,activePillIndex:0,onSelectPill:le})]}),O("textarea",{ref:v,"data-aia-textarea":"",className:`${_.textarea} ${D?_.textareaHidden:""}`,rows:1,onChange:ce,...W})]}),O("button",{type:"button","data-aia-submit":"",className:_.submitButton,disabled:!y,onClick:f=>{f.stopPropagation(),Q()},"aria-label":"Submit",children:O("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:O("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]})});export{wt as AIAutocomplete,be as AIAutocompleteDropdown,Ie as useAIAutocomplete};
|
|
654
687
|
//# sourceMappingURL=index.mjs.map
|