@magicx-eng/ai-autocomplete-react 0.1.16 → 0.1.18
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 +157 -129
- package/dist/index.css +2 -0
- package/dist/index.css.map +1 -0
- package/dist/index.d.mts +40 -11
- package/dist/index.d.ts +40 -11
- package/dist/index.js +87 -72
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +87 -72
- package/dist/index.mjs.map +1 -1
- package/package.json +18 -18
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{forwardRef as
|
|
1
|
+
import{forwardRef as mt,useCallback as gt,useEffect as we,useImperativeHandle as ft,useRef as ae}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
|
}
|
|
@@ -6,7 +6,7 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
6
6
|
.AIAutocomplete-module_inputWrapper_FLq1b {
|
|
7
7
|
min-height: 60px;
|
|
8
8
|
padding: 24px;
|
|
9
|
-
border: 1px solid var(--
|
|
9
|
+
border: 1px solid var(--aia-color-border-default, #9ea5b2);
|
|
10
10
|
border-radius: 23px;
|
|
11
11
|
background: transparent;
|
|
12
12
|
overflow: hidden;
|
|
@@ -29,7 +29,7 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
29
29
|
white-space: pre-wrap;
|
|
30
30
|
word-break: break-word;
|
|
31
31
|
font-family: inherit;
|
|
32
|
-
font-size: 19px;
|
|
32
|
+
font-size: var(--aia-written-text-font-size, 19px);
|
|
33
33
|
line-height: 38px;
|
|
34
34
|
}
|
|
35
35
|
|
|
@@ -38,7 +38,8 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
38
38
|
}
|
|
39
39
|
|
|
40
40
|
.AIAutocomplete-module_sizerTextVisible_HR-5h {
|
|
41
|
-
color: var(--
|
|
41
|
+
color: var(--aia-written-text-color, var(--aia-color-text-default, #fff));
|
|
42
|
+
font-size: var(--aia-written-text-font-size, inherit);
|
|
42
43
|
}
|
|
43
44
|
|
|
44
45
|
.AIAutocomplete-module_textareaHidden_UayJt {
|
|
@@ -46,7 +47,7 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
46
47
|
}
|
|
47
48
|
|
|
48
49
|
.AIAutocomplete-module_placeholderText_K3ayy {
|
|
49
|
-
color: var(--
|
|
50
|
+
color: var(--aia-color-text-muted, #c1c4cb);
|
|
50
51
|
opacity: 0.7;
|
|
51
52
|
}
|
|
52
53
|
|
|
@@ -59,10 +60,10 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
59
60
|
padding: 0;
|
|
60
61
|
border: none;
|
|
61
62
|
background: transparent;
|
|
62
|
-
color: var(--
|
|
63
|
-
caret-color: var(--
|
|
63
|
+
color: var(--aia-written-text-color, var(--aia-color-text-default, #fff));
|
|
64
|
+
caret-color: var(--aia-written-text-color, var(--aia-color-text-default, #fff));
|
|
64
65
|
font-family: inherit;
|
|
65
|
-
font-size: 19px;
|
|
66
|
+
font-size: var(--aia-written-text-font-size, 19px);
|
|
66
67
|
line-height: 38px;
|
|
67
68
|
white-space: pre-wrap;
|
|
68
69
|
word-break: break-word;
|
|
@@ -72,7 +73,7 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
72
73
|
}
|
|
73
74
|
|
|
74
75
|
.AIAutocomplete-module_textarea_eyn6A::placeholder {
|
|
75
|
-
color: var(--
|
|
76
|
+
color: var(--aia-color-text-muted, #c1c4cb);
|
|
76
77
|
}
|
|
77
78
|
|
|
78
79
|
.AIAutocomplete-module_submitButton_sl1Mi {
|
|
@@ -81,8 +82,8 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
81
82
|
height: 36px;
|
|
82
83
|
border-radius: 50%;
|
|
83
84
|
border: none;
|
|
84
|
-
background: var(--
|
|
85
|
-
color: var(--
|
|
85
|
+
background: var(--aia-color-text-default, #fff);
|
|
86
|
+
color: var(--aia-color-bg-default, #000);
|
|
86
87
|
cursor: pointer;
|
|
87
88
|
display: flex;
|
|
88
89
|
align-items: center;
|
|
@@ -111,12 +112,12 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
111
112
|
color: transparent;
|
|
112
113
|
background: linear-gradient(
|
|
113
114
|
120deg,
|
|
114
|
-
var(--
|
|
115
|
-
var(--
|
|
115
|
+
var(--aia-written-text-color, var(--aia-color-text-default, #fff)) 0%,
|
|
116
|
+
var(--aia-written-text-color, var(--aia-color-text-default, #fff)) 44%,
|
|
116
117
|
#b0b0b0 48%,
|
|
117
118
|
#b0b0b0 52%,
|
|
118
|
-
var(--
|
|
119
|
-
var(--
|
|
119
|
+
var(--aia-written-text-color, var(--aia-color-text-default, #fff)) 56%,
|
|
120
|
+
var(--aia-written-text-color, var(--aia-color-text-default, #fff)) 100%
|
|
120
121
|
);
|
|
121
122
|
background-size: 200% 100%;
|
|
122
123
|
-webkit-background-clip: text;
|
|
@@ -139,30 +140,85 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
139
140
|
.AIAutocomplete-module_shimmerHidden_45-Pf {
|
|
140
141
|
color: transparent !important;
|
|
141
142
|
}
|
|
142
|
-
`,document.head.appendChild(
|
|
143
|
+
`,document.head.appendChild(o)}var P={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
144
|
position: absolute;
|
|
144
145
|
left: 0;
|
|
145
146
|
right: 0;
|
|
146
147
|
top: 100%;
|
|
147
148
|
margin-top: 6px;
|
|
148
|
-
|
|
149
|
-
border-radius: 23px;
|
|
149
|
+
border-radius: 1rem;
|
|
150
150
|
overflow: hidden;
|
|
151
151
|
z-index: 10;
|
|
152
152
|
opacity: 0;
|
|
153
153
|
pointer-events: none;
|
|
154
154
|
transition: opacity 400ms cubic-bezier(0.4, 0, 0.2, 1);
|
|
155
|
+
background: transparent;
|
|
156
|
+
backdrop-filter: blur(12px);
|
|
155
157
|
}
|
|
156
158
|
|
|
157
159
|
.AIAutocompleteDropdown-module_visible_QCoXj {
|
|
158
160
|
opacity: 1;
|
|
159
161
|
pointer-events: auto;
|
|
160
162
|
}
|
|
161
|
-
|
|
163
|
+
|
|
164
|
+
.AIAutocompleteDropdown-module_pillBar_pwTXe {
|
|
165
|
+
padding: 27px 27px 0px 27px;
|
|
166
|
+
}
|
|
167
|
+
`,document.head.appendChild(o)}var W={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 {
|
|
168
|
+
position: relative;
|
|
169
|
+
z-index: 1;
|
|
170
|
+
pointer-events: auto;
|
|
171
|
+
display: inline-flex;
|
|
172
|
+
gap: 5px;
|
|
173
|
+
align-items: center;
|
|
174
|
+
vertical-align: middle;
|
|
175
|
+
transform: translateY(-3px);
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
.PillList-module_pill_osSyz {
|
|
179
|
+
display: inline-flex;
|
|
180
|
+
align-items: center;
|
|
181
|
+
justify-content: center;
|
|
182
|
+
height: 36px;
|
|
183
|
+
padding: 13px 13px;
|
|
184
|
+
border: none;
|
|
185
|
+
border-radius: 999px;
|
|
186
|
+
background: rgba(49, 50, 85, 0.25);
|
|
187
|
+
background: color-mix(
|
|
188
|
+
in srgb,
|
|
189
|
+
var(--aia-pill-bg, var(--aia-color-background-supportive, #313255)) 25%,
|
|
190
|
+
transparent
|
|
191
|
+
);
|
|
192
|
+
color: var(--aia-pill-color, var(--aia-color-text-muted, #c1c4cb));
|
|
193
|
+
font-family: "IBM Plex Sans", sans-serif;
|
|
194
|
+
font-size: var(--aia-pill-font-size, 19px);
|
|
195
|
+
line-height: 30px;
|
|
196
|
+
cursor: pointer;
|
|
197
|
+
white-space: nowrap;
|
|
198
|
+
animation: PillList-module_fadeIn_Aezob 400ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
.PillList-module_rounded_WvXy4 {
|
|
202
|
+
border-radius: 999px;
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
.PillList-module_pill_osSyz:hover {
|
|
206
|
+
filter: brightness(1.2);
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
.PillList-module_active_Oll-- {
|
|
210
|
+
outline: 1px solid #5a5b8a;
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
@keyframes PillList-module_fadeIn_Aezob {
|
|
214
|
+
from {
|
|
215
|
+
opacity: 0;
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
`,document.head.appendChild(o)}var V={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 Se}from"react/jsx-runtime";function qe(o){return o===0?.4:o===1?.3:.15}function X({pills:o,activePillIndex:e,onSelectPill:t,rounded:i}){return Se("span",{className:V.list,children:o.map((r,n)=>Se("button",{type:"button",className:`${V.pill} ${i?V.rounded:""} ${n===e?V.active:""}`,style:{opacity:qe(n)},onClick:()=>t(n),children:r.text},`${r.type}-${r.text}`))})}if(typeof document<"u"&&!document.getElementById("ac-style-d91f2b06")){let o=document.createElement("style");o.id="ac-style-d91f2b06",o.textContent=`.SuggestionGrid-module_grid_jvaPb {
|
|
162
219
|
display: grid;
|
|
163
220
|
grid-template-columns: 1fr 1fr;
|
|
164
|
-
|
|
165
|
-
padding: 18px 24px;
|
|
221
|
+
padding: 13px 13px;
|
|
166
222
|
max-height: 192px;
|
|
167
223
|
overflow-y: auto;
|
|
168
224
|
scrollbar-width: thin;
|
|
@@ -181,20 +237,20 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
181
237
|
background: rgba(255, 255, 255, 0.3);
|
|
182
238
|
border-radius: 3px;
|
|
183
239
|
}
|
|
184
|
-
`,document.head.appendChild(
|
|
240
|
+
`,document.head.appendChild(o)}var Ie={grid:"SuggestionGrid-module_grid_jvaPb"};import{useEffect as Ue,useRef as Qe,useState as je}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 {
|
|
185
241
|
position: relative;
|
|
186
242
|
overflow: visible;
|
|
187
243
|
display: flex;
|
|
188
244
|
align-items: center;
|
|
189
245
|
font-family: "IBM Plex Sans", sans-serif;
|
|
190
|
-
font-size: 19px;
|
|
246
|
+
font-size: var(--aia-option-font-size, 19px);
|
|
191
247
|
line-height: 30px;
|
|
192
|
-
color: var(--
|
|
248
|
+
color: var(--aia-option-color, var(--aia-color-text-muted, #c1c4cb));
|
|
193
249
|
white-space: normal;
|
|
194
250
|
word-break: break-word;
|
|
195
|
-
opacity: 0.
|
|
251
|
+
opacity: 0.4;
|
|
196
252
|
border-radius: 12px;
|
|
197
|
-
padding:
|
|
253
|
+
padding: 13px 13px;
|
|
198
254
|
animation: SuggestionItem-module_fadeIn_I8u35 500ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
199
255
|
}
|
|
200
256
|
|
|
@@ -214,7 +270,7 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
214
270
|
}
|
|
215
271
|
|
|
216
272
|
.SuggestionItem-module_tappable_70KcX:hover {
|
|
217
|
-
color: var(--
|
|
273
|
+
color: var(--aia-option-color-selected, var(--aia-color-text-default, #fff));
|
|
218
274
|
}
|
|
219
275
|
|
|
220
276
|
.SuggestionItem-module_nonTappable_xSZM- {
|
|
@@ -223,7 +279,8 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
223
279
|
}
|
|
224
280
|
|
|
225
281
|
.SuggestionItem-module_highlighted_Hb0SU {
|
|
226
|
-
color: var(--
|
|
282
|
+
color: var(--aia-option-color-selected, var(--aia-color-text-default, #fff));
|
|
283
|
+
background: var(--aia-option-bg, transparent);
|
|
227
284
|
opacity: 0.5;
|
|
228
285
|
}
|
|
229
286
|
|
|
@@ -235,7 +292,7 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
235
292
|
|
|
236
293
|
.SuggestionItem-module_pressed_98o-r {
|
|
237
294
|
opacity: 0.8;
|
|
238
|
-
color: var(--
|
|
295
|
+
color: var(--aia-color-text-default, #fff);
|
|
239
296
|
background: rgba(255, 255, 255, 0.06);
|
|
240
297
|
animation:
|
|
241
298
|
SuggestionItem-module_glassFade_oyiSj 500ms ease forwards,
|
|
@@ -487,47 +544,5 @@ import{forwardRef as vt,useCallback as It,useEffect as tt,useImperativeHandle as
|
|
|
487
544
|
box-shadow: 0 0 24px 10px rgba(255, 255, 255, 0.02);
|
|
488
545
|
}
|
|
489
546
|
}
|
|
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 {
|
|
491
|
-
position: relative;
|
|
492
|
-
z-index: 1;
|
|
493
|
-
pointer-events: auto;
|
|
494
|
-
display: inline-flex;
|
|
495
|
-
gap: 5px;
|
|
496
|
-
align-items: center;
|
|
497
|
-
vertical-align: middle;
|
|
498
|
-
transform: translateY(-3px);
|
|
499
|
-
}
|
|
500
|
-
|
|
501
|
-
.PillList-module_pill_osSyz {
|
|
502
|
-
display: inline-flex;
|
|
503
|
-
align-items: center;
|
|
504
|
-
justify-content: center;
|
|
505
|
-
height: 36px;
|
|
506
|
-
padding: 7px 9px;
|
|
507
|
-
border: none;
|
|
508
|
-
border-radius: 6px;
|
|
509
|
-
background: var(--ac-color-background-supportive, #313255);
|
|
510
|
-
color: var(--ac-color-text-muted, #c1c4cb);
|
|
511
|
-
font-family: "IBM Plex Sans", sans-serif;
|
|
512
|
-
font-size: 19px;
|
|
513
|
-
line-height: 30px;
|
|
514
|
-
cursor: pointer;
|
|
515
|
-
white-space: nowrap;
|
|
516
|
-
animation: PillList-module_fadeIn_Aezob 400ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
517
|
-
}
|
|
518
|
-
|
|
519
|
-
.PillList-module_pill_osSyz:hover {
|
|
520
|
-
filter: brightness(1.2);
|
|
521
|
-
}
|
|
522
|
-
|
|
523
|
-
.PillList-module_active_Oll-- {
|
|
524
|
-
outline: 1px solid #5a5b8a;
|
|
525
|
-
}
|
|
526
|
-
|
|
527
|
-
@keyframes PillList-module_fadeIn_Aezob {
|
|
528
|
-
from {
|
|
529
|
-
opacity: 0;
|
|
530
|
-
}
|
|
531
|
-
}
|
|
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};
|
|
547
|
+
`,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 me,jsxs as _e}from"react/jsx-runtime";function Pe({option:o,isHighlighted:e,onSelect:t,onHighlight:i,id:r}){let[n,a]=je(!1),d=Qe(void 0);Ue(()=>()=>clearTimeout(d.current),[]);let s=()=>{!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 _e("div",{id:r,role:"option","aria-selected":e,className:l,tabIndex:o.is_tappable?0:-1,onClick:s,onKeyDown:p=>{o.is_tappable&&(p.key==="Enter"||p.key===" ")&&(p.preventDefault(),s())},onMouseEnter:i,children:[me("div",{className:A.streaks}),me("div",{className:A.streaksVert}),_e("span",{className:A.content,children:[o.icon?`${o.icon} ${o.text}`:o.text,o.tag&&me("span",{className:A.tag,children:o.tag})]})]})}import{jsx as Ce}from"react/jsx-runtime";function Ae({options:o,activeIndex:e,onSelect:t,onHighlight:i,listboxId:r}){return Ce("div",{className:Ie.grid,children:o.map((n,a)=>Ce(Pe,{option:n,isHighlighted:a===e,onSelect:t,onHighlight:()=>i(a),id:`${r}-option-${a}`},n.text))})}import{jsx as ge,jsxs as Ge}from"react/jsx-runtime";function fe({suggestions:o,activeIndex:e,onSelect:t,onHighlight:i,isOpen:r,id:n,className:a,pills:d,onPillClick:s,showPills:l=!0}){let c=o[0]?.options??[],m=l&&d&&d.length>0&&s,g=r&&c.length>0||r&&m;return Ge("div",{id:n,role:"listbox","data-aia-dropdown":"",className:`${W.dropdown} ${g?W.visible:""} ${a??""}`,onMouseDown:v=>v.preventDefault(),children:[m&&ge("div",{className:W.pillBar,children:ge(X,{pills:d,activePillIndex:0,onSelectPill:s,rounded:!0})}),c.length>0&&ge(Ae,{options:c,activeIndex:e,onSelect:t,onHighlight:i,listboxId:n})]})}import{useCallback as T,useEffect as se,useRef as R,useState as ut}from"react";function q(o,e,t){let i=o.slice(e);if(t||e===0||o[e-1]===" ")return i;let r=i.indexOf(" ");return r===-1?"":i.slice(r+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(" "),r=e.toLowerCase();for(let n=0;n<i.length;n++){let a=i.slice(n).join(" ");if(r.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(r=>!r.is_tappable||r.text.toLowerCase().includes(i))}function he(o,e){if(!o)return null;let t=e.trim();if(!t)return null;let i=t.toLowerCase();return o.find(r=>r.is_tappable&&r.text.toLowerCase()===i)??null}var H=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 r=o.slice(i);return r&&t.push({type:"text",value:r}),t}function Oe(o,e){let t=[],i=[],r=0;for(let n of e){let a=o.indexOf(n.text,r);a===-1?i.push(n):(t.push(n),r=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 We="0.1.18",De=!1;function Xe(){return crypto.randomUUID()}function Je(o,e){return{placeholder:o.placeholder,type:o.type,...e&&{text:o.text},kind:o.kind}}function Re(o){return o?.type==="accessToken"}function Ye(o){if(!(!o||Re(o)))return o}var Ee=new WeakMap;function Ze(o){let e=Ee.get(o.getAccessToken);return e||(e=new Y(o),Ee.set(o.getAccessToken,e)),e}function et(o,e,t){let i=e.find(n=>n.type==="contact"&&n.metadata?.contact_account_count)?.metadata?.contact_account_count,r=typeof i=="number"?i:void 0;return{data:{raw_query:o,completed_params:e.map(n=>Je(n,t)),...r!=null&&{contact_account_count:r}},meta:{request_id:Xe(),request_at:new Date().toISOString(),language:typeof navigator<"u"?navigator.language:"en-US",client_version:We}}}function tt(o){return{"Content-Type":"application/json",...o?.appIdentifier&&{"X-App-Identifier":o.appIdentifier},...o?.headers}}async function Le(o,e,t,i,r){return fetch(o,{method:"POST",headers:{...e,Authorization:`Bearer ${t}`},body:i,signal:r})}async function Me(o,e,t){let i=t?.apiConfig,r=!t?.maskCompletedText,n=et(o,e,r),a=tt(i),d=i?.endpoint??"/ac/suggest",s=JSON.stringify(n);if(Re(i)){let m=Ze(i),f=await m.getToken(),g=await Le(d,a,f,s,t?.signal);if(g.status===401){let v=await m.getToken(!0);g=await Le(d,a,v,s,t?.signal)}if(!g.ok)throw new Error(`API error: ${g.status} ${g.statusText}`);return g.json()}let l=Ye(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 m=l?.authScheme??"Bearer";a.Authorization=m==="Basic"?`Basic ${btoa(p)}`:`Bearer ${p}`}let c=await fetch(d,{method:"POST",headers:a,body:s,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={},r=[];for(let n of e){let a=(i[n.type]??0)+1;i[n.type]=a;let s=`{{${n.type.toUpperCase().replace(/\s+/g,"_")}_${a}}}`,l=t.indexOf(n.text);l!==-1&&(t=t.slice(0,l)+s+t.slice(l+n.text.length)),r.push({...n,placeholder:s})}return{rawQuery:t,completedParams:r}}function ze(o,e){return e?o.map(t=>{let i=e[t.type];if(!i)return t;let r=i("");if(r.length===0)return t;let n=new Set(r.map(d=>d.text)),a=(t.options??[]).filter(d=>!n.has(d.text));return{...t,options:[...r,...a]}}):o}var ot=100,it=300,nt=2,Z=class{constructor(e,t,i,r,n){this.store=e;this.getApiConfig=t;this.getOptionOverrides=i;this.getMaskCompletedText=r;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 r=++this.fetchVersion,n=this.store.get(),a=n.text.length;n.suggestions.some(s=>s.type!=="placeholder")||this.store.set({isLoading:!0}),this.store.set({error:null});try{let s=await Me(e,t,{maskCompletedText:this.getMaskCompletedText(),signal:i.signal,apiConfig:this.getApiConfig()});if(r!==this.fetchVersion)return;let l=ze(s.data.suggestions??[],this.getOptionOverrides()),p=s.data.input??[],c=p[p.length-1],m=this.store.get().text,f,g;if(c?.state==="in_progress"){g=!0;let I=m.toLowerCase().lastIndexOf(c.text.toLowerCase());f=I!==-1?I:a}else g=!1,f=a;let b=l.filter(I=>I.type!=="placeholder")[0],w=null;if(b){let I=q(m,f,g),u=he(b.options,I);u&&(w={id:crypto.randomUUID(),placeholder:"",type:b.type,text:u.text,kind:u.kind,suggestionType:b.type,suggestionPlaceholder:b.text,options:b.options??[],metadata:u.metadata},l=l.filter(S=>S!==b))}this.store.set(I=>({suggestions:l,isLoading:!1,isReady:s.data.is_ready??!1,lastRawQuery:e,activeDropdownIndex:-1,filterBase:f,filterInProgress:g,...w?{completedParams:[...I.completedParams,w]}:{}}))}catch(s){if(r===this.fetchVersion){let l=s instanceof Error?s:new Error(String(s));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 r=this.store.get();if(!r.text&&r.completedParams.length===0)return this.doFetch("",[]),!0;let n=q(r.text,r.filterBase,r.filterInProgress),d=r.suggestions.filter(b=>b.type!=="placeholder")[0],l=(d?J(d.options,n):[]).filter(b=>b.is_tappable),p=d?he(d.options,n)!==null:!1,c=n.trim().length>0;if(l.length>0&&!p&&c)return!1;let{rawQuery:m,completedParams:f}=D(r.text,r.completedParams),g=m.length<r.lastRawQuery.length,v=Math.abs(m.length-r.lastRawQuery.length);return g||v>=i?(this.doFetch(m,f),!0):!1};this.debounceTimer=setTimeout(()=>{t(nt)&&this.slowDebounceTimer&&clearTimeout(this.slowDebounceTimer)},ot),this.slowDebounceTimer=setTimeout(()=>t(1),it)}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:r,getOnSubmit:n}=this.ctx,a=n(),d=this.getTappableIndices();switch(e.key){case"ArrowDown":{let s=e.target;if(!(s.selectionStart!=null&&s.selectionStart===s.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 s=d.indexOf(t.activeDropdownIndex),l=s>0?s-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 s=t.activeDropdownIndex-1;s>=0&&t.filteredOptions[s]?.is_tappable&&(e.preventDefault(),this.store.set({activeDropdownIndex:s}))}break}case"Enter":{if(e.preventDefault(),t.activeDropdownIndex>=0&&t.filteredOptions[t.activeDropdownIndex]?.is_tappable)this.clickOrSelect(t.activeDropdownIndex,t.filteredOptions,r);else if(a){let{rawQuery:s,completedParams:l}=D(t.text,t.completedParams);a({query:t.text.trim(),raw_query:s,completed_params:l})}break}case"Tab":{if(t.activeDropdownIndex>=0&&t.filteredOptions[t.activeDropdownIndex]?.is_tappable)e.preventDefault(),this.clickOrSelect(t.activeDropdownIndex,t.filteredOptions,r);else if(t.isDropdownOpen){let s=t.filteredOptions.findIndex(l=>l.is_tappable);s>=0&&(e.preventDefault(),this.clickOrSelect(s,t.filteredOptions,r))}else if(!t.text&&t.placeholderText){e.preventDefault();let s=t.suggestions.find(l=>l.type==="placeholder");s?this.store.set(l=>({text:t.placeholderText,filterBase:t.placeholderText.length,completedParams:[...l.completedParams,{id:crypto.randomUUID(),placeholder:"",type:s.type,text:t.placeholderText,kind:null,suggestionType:s.type,suggestionPlaceholder:s.text,options:s.options??[]}],suggestions:l.suggestions.filter(p=>p!==s)})):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),r=Array.from({length:t},()=>[]);for(let n of i)r[n%t].push(n);return r.flat()}clickOrSelect(e,t,i){let r=document.getElementById(`${i}-option-${e}`);r?r.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 r=i[e],n=i.filter((d,s)=>s!==e),a=t.suggestions.filter(d=>d.type==="placeholder");this.store.set({suggestions:[...a,r,...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 r=i[e],n=i.filter((d,s)=>s!==e),a=t.suggestions.filter(d=>d.type==="placeholder");this.store.set({suggestions:[...a,r,...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(r=>({completedParams:r.completedParams.slice(0,-1),suggestions:[i,...r.suggestions],activeDropdownIndex:-1}))}};function rt(o){return o===0?.4:o===1?.3:.15}function oe(o,e,t,i,r=!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 s of n.querySelectorAll(".magicx-aia-pill"))a.set(s.dataset.pillKey??"",s);let d=new Set;for(let s=0;s<e.length;s++){let l=e[s],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${r?" magicx-aia-pill--rounded":""}${s===t?" magicx-aia-pill--active":""}`,c.style.opacity=String(rt(s)),c.onclick=()=>i(s),n.children[s]!==c&&n.insertBefore(c,n.children[s]??null)}for(let[s,l]of a)d.has(s)||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:r,pills:n,showPills:a,onSelect:d,onHighlight:s,onPillClick:l}=e,p=a&&n.length>0;r&&t.length>0||r&&p?o.classList.add("magicx-aia-dropdown--visible"):o.classList.remove("magicx-aia-dropdown--visible");let f=o.querySelector(".magicx-aia-pill-bar");p?(f||(f=document.createElement("div"),f.className="magicx-aia-pill-bar",o.insertBefore(f,o.firstChild)),oe(f,n,0,l,!0)):f&&f.remove();let g=o.querySelector(".magicx-aia-grid");t.length>0?(g||(g=document.createElement("div"),g.className="magicx-aia-grid",o.appendChild(g)),st(g,t,i,d,s,e.listboxId)):g&&(g.innerHTML="")}function st(o,e,t,i,r,n){let a=e.map(l=>l.text).join("\0"),d=o.dataset.optionsKey??"",s=a!==d;if(o.dataset.optionsKey=a,s){let l=document.createDocumentFragment();for(let p=0;p<e.length;p++){let c=e[p],m=at(c,p,t,i,r,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 at(o,e,t,i,r,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 s=document.createElement("div");s.className="magicx-aia-streaks",a.appendChild(s);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",()=>r(e)),a}function He(o,e){let t=ie(e.listboxId);return o.appendChild(t),{dropdown:t}}function xe(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,r){let n=o.querySelector(".magicx-aia-sizer-text"),a=o.querySelector(".magicx-aia-placeholder");if(i&&r){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=`${r} `,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"),s=o.dataset.segmentKey??"",l=o.dataset.newParamId??"";if(!(d===s&&(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 lt='<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 r=document.createElement("div");r.className="magicx-aia-input-wrapper",o.appendChild(r);let n=document.createElement("div");n.className="magicx-aia-editor",r.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 s=document.createElement("textarea");s.className="magicx-aia-textarea",s.rows=1,s.setAttribute("role","combobox"),s.setAttribute("aria-autocomplete","list"),s.setAttribute("aria-controls",t),n.appendChild(s);let l=document.createElement("button");return l.type="button",l.className="magicx-aia-submit",l.setAttribute("aria-label","Submit"),l.innerHTML=lt,r.appendChild(l),r.addEventListener("click",()=>s.focus()),s.addEventListener("input",()=>{let p=s.value,m=p.length>0&&p[0]!==p[0].toUpperCase()?p[0].toUpperCase()+p.slice(1):p;e.handleChange(m)}),s.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:f,completedParams:g}=D(c.text,c.completedParams);e.onSubmit({query:c.text.trim(),raw_query:f,completed_params:g})}),s.focus(),{textarea:s,dropdown:i,sizer:a,submitButton:l,inlinePillContainer:d}}function be(o,e,t){let{textarea:i,dropdown:r,sizer:n,submitButton:a,inlinePillContainer:d}=o,{pillPlacement:s,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 f=!!e.text||e.completedParams.length>0;a.disabled=!f,Be(n,e.segments,e.newParamId,!e.text,e.placeholderText),s==="inline"?oe(d,e.actionableSuggestions,0,l):d.innerHTML="",ne(r,{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:s==="dropdown",onSelect:p,onHighlight:g=>c.set({activeDropdownIndex:g}),onPillClick:l})}function Ke(o){let e=o,t=new Set;return{get:()=>e,set:i=>{let r=typeof i=="function"?i(e):i,n={...e,...r},a=e;e=n;for(let d of t)d(n,a)},subscribe:i=>(t.add(i),()=>{t.delete(i)})}}var ve=!1;function $e(){if(ve||typeof document>"u")return;if(document.querySelector("style[data-magicx-aia]")){ve=!0;return}ve=!0;let o=document.createElement("style");o.setAttribute("data-magicx-aia",""),o.textContent=dt,document.head.appendChild(o)}var dt=__MAGICX_AC_STYLES__;var pt=0;function ct(){return`:ac-${++pt}:`}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=ct();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,r)=>{this.recomputeDerived(i,r)})),this.unsubscribers.push(this.store.subscribe((i,r)=>{i.text!==r.text&&this.opts.onChange?.(i.text),i.completedParams!==r.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 r=t.filterBase,n=t.text.slice(0,r),a=n.length===0&&t.text.length===0;a&&t.placeholderText&&(n=`${t.placeholderText} `);let d=ke(n,e.text);d>0&&(n=n.slice(0,n.length-d));let s=n.length>0&&n[n.length-1]!==" ",l=`${n}${s?" ":""}${e.text} `,p=a&&l.length>0?l[0].toUpperCase()+l.slice(1):l,c=p.toLowerCase().lastIndexOf(e.text.toLowerCase()),m=c>=0?p.slice(c,c+e.text.length):e.text,f={id:crypto.randomUUID(),placeholder:"",type:i.type,text:m,kind:e.kind,suggestionType:i.type,suggestionPlaceholder:i.text,options:i.options??[],metadata:e.metadata},g=t.actionableSuggestions.length-1;this.store.set(v=>({text:p,filterBase:p.length,completedParams:[...v.completedParams,f],newParamId:f.id,pillTapped:!1,activeDropdownIndex:-1,skipNextFetch:g>0})),this.suggestionRemovalTimer=window.setTimeout(()=>{this.store.set(v=>({suggestions:v.suggestions.filter(b=>b!==i)}))},400)}recomputeDerived(e,t){if(this.derivedInProgress)return;this.derivedInProgress=!0;let i=Te(e.text,e.completedParams),r=e.suggestions.filter(w=>w.type!=="placeholder"),n=r[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=J(p,l),m=e.suggestions.filter(w=>w.type==="placeholder").map(w=>w.text).join(" ")||this.opts.placeholder||"",f=m.length>0,g=this.opts.dropdownTrigger??"auto",v=!1;g==="auto"?v=!e.isLoading&&c.length>0&&(!!e.text||e.pillTapped||!f):g==="manual"&&(v=!e.isLoading&&c.length>0&&e.pillTapped),this.store.set({segments:i,actionableSuggestions:r,filteredOptions:c,placeholderText:m,isDropdownOpen:v}),this.derivedInProgress=!1;let b=this.store.get();for(let w of this.externalListeners)w(b)}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 H(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&&be(this.domRefs,this.store.get(),t)}),be(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=He(this.container,e),this.subscribeBatchedRender(()=>{this.dropdownRefs&&xe(this.dropdownRefs,this.store.get(),e)}),xe(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:r}=Oe(e,t.completedParams);r.length>0&&this.store.set(n=>({completedParams:i,suggestions:[...r.map(a=>({type:a.suggestionType,text:a.suggestionPlaceholder,required:!0,options:a.options})),...n.suggestions]}))}};function ye({onSubmit:o,onError:e,optionOverrides:t,maskCompletedText:i,placeholder:r,apiConfig:n,columns:a=2,dropdownTrigger:d,value:s,completedParams:l,onChange:p,onParamsChange:c}){let m=R(null),[f,g]=ut(null),v=R(o);v.current=o;let b=R(e);b.current=e;let w=R(p);w.current=p;let I=R(c);I.current=c,!m.current&&typeof document<"u"&&(m.current=new re(document.createElement("div"),{renderMode:"headless",apiConfig:n,optionOverrides:t,maskCompletedText:i,placeholder:r,columns:a,dropdownTrigger:d,value:s,completedParams:l,onSubmit:(...h)=>v.current?.(...h),onError:(...h)=>b.current?.(...h),onChange:(...h)=>w.current?.(...h),onParamsChange:(...h)=>I.current?.(...h)}));let u=m.current,S=T(()=>{},[]);se(()=>{if(!u)return;g(u.getState());let h=u.subscribe(_=>{g(_)});return()=>{h(),u.destroy(),m.current=null}},[u]),se(()=>{s!==void 0&&u?.setValue(s)},[s,u]),se(()=>{l!==void 0&&u?.setCompletedParams(l)},[l,u]);let U=JSON.stringify(n??null),C=R(t),M=R(0);if(t!==C.current){let h=C.current,_=t,x=Object.keys(h??{}),k=Object.keys(_??{});(x.length!==k.length||k.some(G=>!h?.[G]||_[G]!==h[G]))&&M.current++,C.current=t}se(()=>{u?.update({apiConfig:n,optionOverrides:t,dropdownTrigger:d})},[U,M.current,d,u]);let le=T(h=>{if(!u)return;let _=h.target.value,k=_.length>0&&!h.nativeEvent?.isComposing&&_[0]!==_[0].toUpperCase()?_[0].toUpperCase()+_.slice(1):_;u.handleTextChange(k)},[u]),de=T(h=>{u?.handleKeyDown(h.nativeEvent)},[u]),N=T(h=>u?.setActivePill(h),[u]),L=T(()=>u?.removeLastParam(),[u]),Q=T(()=>u?.clearNewParamId(),[u]),O=T(()=>u?.reset(),[u]),pe=T(h=>u?.selectOption(h),[u]),z=T(h=>u?.setActiveDropdownIndex(h),[u]);if(!u)return{completedParams:l??[],suggestionPills:[],setActivePill:S,removeLastParam:S,segments:[],newParamId:null,clearNewParamId:S,suggestions:[],activeIndex:-1,isReady:!1,isLoading:!0,error:null,inputProps:{value:s??"",placeholder:r,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=f??u.getState(),K=s!==void 0?s:y.text,j=l!==void 0?l:y.completedParams,$=y.actionableSuggestions,F=$[0],ce=y.filteredOptions,ue=y.activeDropdownIndex>=0?`${u.listboxId}-option-${y.activeDropdownIndex}`:void 0;return{completedParams:j,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":u.listboxId},reset:O,dropdownProps:{suggestions:F?[{...F,options:ce}]:[],activeIndex:y.activeDropdownIndex,onSelect:pe,onHighlight:z,isOpen:y.isDropdownOpen,id:u.listboxId,pills:$,onPillClick:N}}}import{jsx as E,jsxs as B}from"react/jsx-runtime";function ht(o){return o!=="auto"?o:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var xt=mt(function({onSubmit:e,onError:t,optionOverrides:i,maskCompletedText:r,placeholder:n,className:a,apiConfig:d,columns:s,pillPlacement:l="inline",mode:p="auto",optionsPosition:c="below",animations:m=!0,dropdownTrigger:f,value:g,completedParams:v,onChange:b,onParamsChange:w},I){let u=ae(null),S=ae(null),U=ae(()=>{}),C=ae(null);we(()=>{S.current?.focus()},[]),we(()=>{let x=u.current;if(x)return C.current?C.current.setMode(p):C.current=new H(x,p),()=>{C.current?.destroy(),C.current=null}},[p]);let{completedParams:M,suggestionPills:le,setActivePill:de,segments:N,newParamId:L,clearNewParamId:Q,inputProps:O,dropdownProps:pe,reset:z}=ye({onSubmit:x=>U.current(x),onError:t,optionOverrides:i,maskCompletedText:r,placeholder:n,apiConfig:d,columns:s,dropdownTrigger:f,value:g,completedParams:v,onChange:b,onParamsChange:w});we(()=>{if(!L)return;let x=window.setTimeout(()=>Q(),650);return()=>window.clearTimeout(x)},[L,Q]),ft(I,()=>({focus:()=>S.current?.focus(),reset:z,setMode:x=>C.current?.setMode(x)}),[z]);let y=()=>{S.current?.focus()},K=!!O.value||M.length>0,j=gt(()=>{if(!K)return;let{rawQuery:x,completedParams:k}=D(O.value,M);e({query:O.value.trim(),raw_query:x,completed_params:k}),z()},[K,O.value,M,e,z]);U.current=j;let{onChange:$,placeholder:F,...ce}=O,ue=!O.value,h=l==="inline",_=l==="dropdown";return B("div",{ref:u,className:`magicx-aia ${P.container} ${a??""}`,"data-pill-placement":l,"data-options-position":c,"data-animations":m?"on":"off","data-mode":ht(p),children:[E(fe,{...pe,showPills:_}),B("div",{className:P.inputWrapper,onClick:y,children:[B("div",{className:P.editorArea,children:[B("div",{className:P.sizerContent,"aria-hidden":"true",children:[ue&&F?B("span",{className:P.placeholderText,children:[F," "]}):B("span",{className:`${P.sizerText} ${L?P.sizerTextVisible:""}`,children:[N.map((x,k)=>{if(x.type==="completed"&&x.param.id===L){let Ve=`${P.shimmerRevealed} ${P.shimmerSweep}`;return E("span",{className:Ve,children:x.value},`${k}-${x.type}`)}return E("span",{children:x.value},`${k}-${x.type}`)}),N.length===0&&"\xA0"]})," ",h&&E(X,{pills:le,activePillIndex:0,onSelectPill:de})]}),E("textarea",{ref:S,className:`${P.textarea} ${L?P.textareaHidden:""}`,rows:1,onChange:$,...ce})]}),E("button",{type:"button",className:P.submitButton,disabled:!K,onClick:x=>{x.stopPropagation(),j()},"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{xt as AIAutocomplete,fe as AIAutocompleteDropdown,ye as useAIAutocomplete};
|
|
533
548
|
//# sourceMappingURL=index.mjs.map
|