@magicx-eng/ai-autocomplete-react 0.6.2 → 0.6.3
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/dist/index.js +98 -69
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +98 -69
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var Re=Object.defineProperty;var pt=Object.getOwnPropertyDescriptor;var ct=Object.getOwnPropertyNames;var ut=Object.prototype.hasOwnProperty;var mt=(e,t)=>{for(var a in t)Re(e,a,{get:t[a],enumerable:!0})},gt=(e,t,a,
|
|
1
|
+
"use strict";var Re=Object.defineProperty;var pt=Object.getOwnPropertyDescriptor;var ct=Object.getOwnPropertyNames;var ut=Object.prototype.hasOwnProperty;var mt=(e,t)=>{for(var a in t)Re(e,a,{get:t[a],enumerable:!0})},gt=(e,t,a,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ct(t))!ut.call(e,n)&&n!==a&&Re(e,n,{get:()=>t[n],enumerable:!(s=pt(t,n))||s.enumerable});return e};var ft=e=>gt(Re({},"__esModule",{value:!0}),e);var _t={};mt(_t,{AIAutocomplete:()=>tt,AIAutocompleteDropdown:()=>Ie,useAIAutocomplete:()=>Se});module.exports=ft(_t);var P=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-67791514")){let e=document.createElement("style");e.id="ac-style-67791514",e.textContent=`.AIAutocomplete-module_container_KKjFU {
|
|
2
2
|
position: relative;
|
|
3
3
|
/* Inherits the host page's font by default. Consumers can pin a specific
|
|
4
4
|
font on the library via \`--aia-font-family: 'Custom Font'\` without
|
|
@@ -47,24 +47,47 @@
|
|
|
47
47
|
vertical-align: middle;
|
|
48
48
|
}
|
|
49
49
|
|
|
50
|
-
/* Completed params render as inline
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
50
|
+
/* Completed params render as inline pills (Figma "RichTextPill") \u2014 a compact
|
|
51
|
+
~26px chip with regular-weight primary-color text on a faint-gray fill.
|
|
52
|
+
inline-block gives the padding/radius a box while the text stays part of the
|
|
53
|
+
editable plain text (the caret system counts characters inside this
|
|
54
|
+
<strong>). The completed class is stamped by the shared renderer as a global
|
|
55
|
+
string, so match it via [class~=] to bypass CSS Modules' hashing. */
|
|
56
|
+
:where(.AIAutocomplete-module_input_IW-P-) strong[class~="magicx-aia-segment--completed"] {
|
|
57
|
+
display: inline-block;
|
|
58
|
+
padding: 4px 6px;
|
|
59
|
+
border-radius: 999px;
|
|
60
|
+
background: var(--aia-completed-pill-bg, rgba(189, 189, 189, 0.15));
|
|
61
|
+
color: var(--aia-completed-pill-color, var(--aia-written-text-color, #fff));
|
|
62
|
+
font-size: var(--aia-pill-font-size, 14px);
|
|
63
|
+
font-weight: 400;
|
|
64
|
+
line-height: normal;
|
|
65
|
+
white-space: nowrap;
|
|
66
|
+
/* Small vertical breathing room so wrapped rows of pills don't touch. */
|
|
67
|
+
margin: 2px 0;
|
|
68
|
+
vertical-align: middle;
|
|
69
|
+
cursor: pointer;
|
|
70
|
+
/* Smooth hover fade. Neutralized by the data-animations="off" block. */
|
|
71
|
+
transition: background-color 150ms ease;
|
|
55
72
|
}
|
|
56
73
|
|
|
57
|
-
/*
|
|
58
|
-
|
|
59
|
-
|
|
74
|
+
/* Hover highlight \u2014 a slightly stronger fill so a pointed-at pill reads as
|
|
75
|
+
tappable. Declared between the base and editing rules so editing wins. */
|
|
76
|
+
:where(.AIAutocomplete-module_input_IW-P-) strong[class~="magicx-aia-segment--completed"]:hover {
|
|
77
|
+
background: var(--aia-completed-pill-bg-active, rgba(189, 189, 189, 0.35));
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
/* Re-edit highlight \u2014 applied to the completed pill being re-edited (after a
|
|
81
|
+
tap). Reuses the exact hover fill so the highlight persists from tap until an
|
|
82
|
+
option is selected. Hides the native caret; cursor switches to text since the
|
|
83
|
+
pill is in text-replacement mode. The editing class is written by the shared
|
|
84
|
+
renderer (a global string), so target it via an attribute selector to bypass
|
|
85
|
+
CSS Modules' hashing. Declared last so it wins on a strong carrying both
|
|
86
|
+
classes. */
|
|
60
87
|
:where(.AIAutocomplete-module_input_IW-P-) strong[class~="magicx-aia-segment--editing"] {
|
|
61
|
-
background
|
|
62
|
-
border-radius: 6px;
|
|
63
|
-
padding: 2px 3px;
|
|
64
|
-
/* Pull surrounding inline text back so the wider/taller fill doesn't shove
|
|
65
|
-
the rest of the line \u2014 only the visible background grows. */
|
|
66
|
-
margin: 0 -1.5px;
|
|
88
|
+
background: var(--aia-completed-pill-bg-active, rgba(189, 189, 189, 0.35));
|
|
67
89
|
caret-color: transparent;
|
|
90
|
+
cursor: text;
|
|
68
91
|
}
|
|
69
92
|
|
|
70
93
|
/* In re-edit mode the caret is parked just *before* the bold strong (see
|
|
@@ -114,39 +137,23 @@
|
|
|
114
137
|
display: contents;
|
|
115
138
|
}
|
|
116
139
|
|
|
117
|
-
/*
|
|
118
|
-
(core/render/renderEditable.ts) stamps the global
|
|
119
|
-
|
|
120
|
-
hashing
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
120deg,
|
|
125
|
-
var(--aia-written-text-color, var(--aia-color-text-default, #fff)) 0%,
|
|
126
|
-
var(--aia-written-text-color, var(--aia-color-text-default, #fff)) 44%,
|
|
127
|
-
#b0b0b0 48%,
|
|
128
|
-
#b0b0b0 52%,
|
|
129
|
-
var(--aia-written-text-color, var(--aia-color-text-default, #fff)) 56%,
|
|
130
|
-
var(--aia-written-text-color, var(--aia-color-text-default, #fff)) 100%
|
|
131
|
-
);
|
|
132
|
-
background-size: 200% 100%;
|
|
133
|
-
-webkit-background-clip: text;
|
|
134
|
-
background-clip: text;
|
|
135
|
-
}
|
|
136
|
-
|
|
140
|
+
/* Promotion reveal on a newly promoted completed param. The shared renderer
|
|
141
|
+
(core/render/renderEditable.ts) stamps the global shimmer classes onto the
|
|
142
|
+
just-added <strong>; we match them via [class~=] to bypass CSS Modules'
|
|
143
|
+
hashing. Completed params are now pills with a solid background, so the old
|
|
144
|
+
text-clip gradient shimmer can't be used (background-clip: text would wipe
|
|
145
|
+
the pill background). The reveal is a simple fade-in of the whole pill,
|
|
146
|
+
riding on shimmer-sweep so it only plays on genuine promotions. */
|
|
137
147
|
:where(.AIAutocomplete-module_input_IW-P-) strong[class~="magicx-aia-shimmer-sweep"] {
|
|
138
|
-
animation: AIAutocomplete-
|
|
148
|
+
animation: AIAutocomplete-module_aiaPillReveal_wf05b 400ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
139
149
|
}
|
|
140
150
|
|
|
141
|
-
@keyframes AIAutocomplete-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
}
|
|
145
|
-
100% {
|
|
146
|
-
background-position: -50% 0;
|
|
151
|
+
@keyframes AIAutocomplete-module_aiaPillReveal_wf05b {
|
|
152
|
+
from {
|
|
153
|
+
opacity: 0;
|
|
147
154
|
}
|
|
148
155
|
}
|
|
149
|
-
`,document.head.appendChild(e)}var le={container:"AIAutocomplete-module_container_KKjFU",inputWrapper:"AIAutocomplete-module_inputWrapper_FLq1b",editorArea:"AIAutocomplete-module_editorArea_7rBWq",input:"AIAutocomplete-module_input_IW-P-",pillListContainer:"AIAutocomplete-module_pillListContainer_h92IA",submitSlot:"AIAutocomplete-module_submitSlot_GhuCM",
|
|
156
|
+
`,document.head.appendChild(e)}var le={container:"AIAutocomplete-module_container_KKjFU",inputWrapper:"AIAutocomplete-module_inputWrapper_FLq1b",editorArea:"AIAutocomplete-module_editorArea_7rBWq",input:"AIAutocomplete-module_input_IW-P-",pillListContainer:"AIAutocomplete-module_pillListContainer_h92IA",submitSlot:"AIAutocomplete-module_submitSlot_GhuCM",aiaPillReveal:"AIAutocomplete-module_aiaPillReveal_wf05b"};var ue=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
|
|
150
157
|
* Built-in appearance defaults \u2014 zero specificity via :where().
|
|
151
158
|
* Consumer CSS always wins without !important.
|
|
152
159
|
*
|
|
@@ -185,6 +192,9 @@
|
|
|
185
192
|
--aia-primitive-neutral-1000: #ffffff;
|
|
186
193
|
--aia-primitive-blue-50: #eef2ff;
|
|
187
194
|
--aia-primitive-neutral-750-a50: rgba(189, 189, 189, 0.51);
|
|
195
|
+
--aia-primitive-neutral-750-a35: rgba(189, 189, 189, 0.35);
|
|
196
|
+
--aia-primitive-neutral-750-a30: rgba(189, 189, 189, 0.3);
|
|
197
|
+
--aia-primitive-neutral-750-a15: rgba(189, 189, 189, 0.15);
|
|
188
198
|
--aia-primitive-neutral-700-a40: rgba(176, 176, 176, 0.4);
|
|
189
199
|
}
|
|
190
200
|
|
|
@@ -201,10 +211,21 @@
|
|
|
201
211
|
--aia-primitive-neutral-900
|
|
202
212
|
); /* was #e5e7eb \u2014 snapped to palette (\u03942) */
|
|
203
213
|
--aia-dropdown-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
|
|
204
|
-
|
|
214
|
+
/* Suggestion pills (Figma "ParamPill"): transparent fill + dashed border;
|
|
215
|
+
per-pill opacity via getPillOpacity. */
|
|
216
|
+
--aia-pill-bg: var(--aia-primitive-neutral-750);
|
|
205
217
|
--aia-pill-color: var(--aia-primitive-neutral-300);
|
|
218
|
+
--aia-pill-border: var(--aia-primitive-neutral-750-a30);
|
|
206
219
|
--aia-pill-font-size: 14px;
|
|
207
220
|
|
|
221
|
+
/* Completed params (Figma "RichTextPill"): compact faint-gray chip with
|
|
222
|
+
primary-color regular-weight text. -active is the hover / tapped (re-edit)
|
|
223
|
+
highlight \u2014 an alpha over the input background, so one value works in both
|
|
224
|
+
themes. */
|
|
225
|
+
--aia-completed-pill-bg: var(--aia-primitive-neutral-750-a15);
|
|
226
|
+
--aia-completed-pill-bg-active: var(--aia-primitive-neutral-750-a35);
|
|
227
|
+
--aia-completed-pill-color: var(--aia-primitive-neutral-0);
|
|
228
|
+
|
|
208
229
|
--aia-option-bg: var(--aia-primitive-blue-50);
|
|
209
230
|
--aia-option-color: var(--aia-primitive-neutral-500);
|
|
210
231
|
--aia-option-color-selected: var(--aia-primitive-neutral-0);
|
|
@@ -242,10 +263,18 @@
|
|
|
242
263
|
--aia-primitive-neutral-400
|
|
243
264
|
); /* was #484848 \u2014 snapped to palette (\u03942) */
|
|
244
265
|
--aia-dropdown-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
|
|
266
|
+
/* Suggestion pills (Figma "ParamPill"): transparent fill + dashed border. */
|
|
245
267
|
--aia-pill-bg: var(--aia-primitive-neutral-750);
|
|
246
268
|
--aia-pill-color: var(--aia-primitive-neutral-700);
|
|
269
|
+
--aia-pill-border: var(--aia-primitive-neutral-750-a30);
|
|
247
270
|
--aia-pill-font-size: 14px;
|
|
248
271
|
|
|
272
|
+
/* Completed params (Figma "RichTextPill") \u2014 dark theme (design source):
|
|
273
|
+
white text on a faint-gray chip. -active is the hover / tapped highlight. */
|
|
274
|
+
--aia-completed-pill-bg: var(--aia-primitive-neutral-750-a15);
|
|
275
|
+
--aia-completed-pill-bg-active: var(--aia-primitive-neutral-750-a35);
|
|
276
|
+
--aia-completed-pill-color: var(--aia-primitive-neutral-1000);
|
|
277
|
+
|
|
249
278
|
--aia-option-bg: var(--aia-primitive-neutral-250);
|
|
250
279
|
--aia-option-color: var(--aia-primitive-neutral-700);
|
|
251
280
|
--aia-option-color-selected: var(--aia-primitive-neutral-1000);
|
|
@@ -396,7 +425,7 @@
|
|
|
396
425
|
opacity: 0.25;
|
|
397
426
|
}
|
|
398
427
|
}
|
|
399
|
-
`,document.head.appendChild(e)}var pe={dropdown:"AIAutocompleteDropdown-module_dropdown_yz2KC",visible:"AIAutocompleteDropdown-module_visible_QCoXj",pillBar:"AIAutocompleteDropdown-module_pillBar_pwTXe",skeletonBars:"AIAutocompleteDropdown-module_skeletonBars_HVr9C",skeletonBar:"AIAutocompleteDropdown-module_skeletonBar_O3xIx",aiaSkeletonPulse:"AIAutocompleteDropdown-module_aiaSkeletonPulse_G8W7q"};var
|
|
428
|
+
`,document.head.appendChild(e)}var pe={dropdown:"AIAutocompleteDropdown-module_dropdown_yz2KC",visible:"AIAutocompleteDropdown-module_visible_QCoXj",pillBar:"AIAutocompleteDropdown-module_pillBar_pwTXe",skeletonBars:"AIAutocompleteDropdown-module_skeletonBars_HVr9C",skeletonBar:"AIAutocompleteDropdown-module_skeletonBar_O3xIx",aiaSkeletonPulse:"AIAutocompleteDropdown-module_aiaSkeletonPulse_G8W7q"};var Ke=require("@magicx-eng/ai-autocomplete-vanilla");if(typeof document<"u"&&!document.getElementById("ac-style-5259a217")){let e=document.createElement("style");e.id="ac-style-5259a217",e.textContent=`@layer layout {
|
|
400
429
|
.aia-cluster {
|
|
401
430
|
display: flex;
|
|
402
431
|
flex-wrap: wrap;
|
|
@@ -438,7 +467,7 @@
|
|
|
438
467
|
justify-content: space-around;
|
|
439
468
|
}
|
|
440
469
|
}
|
|
441
|
-
`,document.head.appendChild(e)}var
|
|
470
|
+
`,document.head.appendChild(e)}var Te=require("react/jsx-runtime");function fe({gap:e,align:t="center",justify:a="start",noWrap:s=!1,inline:n=!1,className:i,children:d,...c}){let x=e?{"--aia-cluster-gap":e}:void 0,v={className:i?`aia-cluster ${i}`:"aia-cluster","data-align":t,"data-justify":a,"data-nowrap":s||void 0,"data-inline":n||void 0,style:x,...c};return n?(0,Te.jsx)("span",{...v,children:d}):(0,Te.jsx)("div",{...v,children:d})}if(typeof document<"u"&&!document.getElementById("ac-style-56b0c577")){let e=document.createElement("style");e.id="ac-style-56b0c577",e.textContent=`/* The footer adds its own 8px horizontal inset so it stays clear of the
|
|
442
471
|
dropdown's rounded edges. The top inset (--aia-footer-gap) adds breathing
|
|
443
472
|
room above the hint/branding row so the footer doesn't butt against the last
|
|
444
473
|
option row \u2014 additive to the dropdown's 8px section gap. */
|
|
@@ -519,19 +548,17 @@
|
|
|
519
548
|
justify-content: flex-end;
|
|
520
549
|
}
|
|
521
550
|
}
|
|
522
|
-
`,document.head.appendChild(e)}var Y={footer:"DropdownFooter-module_footer_qQQ7x",hintGroup:"DropdownFooter-module_hintGroup_ZzbPf",brandLink:"DropdownFooter-module_brandLink_r4f3R",key:"DropdownFooter-module_key_Bz1H-",hint:"DropdownFooter-module_hint_GKEOH",brand:"DropdownFooter-module_brand_Al-lR",badge:"DropdownFooter-module_badge_Fk9vg",row:"DropdownFooter-module_row_BgZ6Q"};var
|
|
551
|
+
`,document.head.appendChild(e)}var Y={footer:"DropdownFooter-module_footer_qQQ7x",hintGroup:"DropdownFooter-module_hintGroup_ZzbPf",brandLink:"DropdownFooter-module_brandLink_r4f3R",key:"DropdownFooter-module_key_Bz1H-",hint:"DropdownFooter-module_hint_GKEOH",brand:"DropdownFooter-module_brand_Al-lR",badge:"DropdownFooter-module_badge_Fk9vg",row:"DropdownFooter-module_row_BgZ6Q"};var q=require("react/jsx-runtime");function We({isOptionHighlighted:e=!1,isInputEmpty:t=!1}){let{key:a,hint:s}=(0,Ke.getFooterHint)(e,t);return(0,q.jsx)("footer",{className:Y.footer,"data-aia-footer":"",children:(0,q.jsxs)(fe,{justify:"between",noWrap:!0,className:Y.row,children:[(0,q.jsxs)(fe,{gap:"5px",className:Y.hintGroup,children:[(0,q.jsx)("kbd",{className:Y.key,children:a}),(0,q.jsx)("span",{className:Y.hint,children:s})]}),(0,q.jsxs)("a",{className:Y.brandLink,href:"https://ai-autocomplete.com",target:"_blank",rel:"noopener noreferrer",children:[(0,q.jsx)("span",{className:Y.brand,children:"AI"}),(0,q.jsx)("span",{className:Y.badge,children:"Autocomplete"})]})]})})}if(typeof document<"u"&&!document.getElementById("ac-style-199d0432")){let e=document.createElement("style");e.id="ac-style-199d0432",e.textContent=`/* ParamPill (Figma "ParamPill") \u2014 unfilled suggestion pill: transparent fill
|
|
552
|
+
with a dashed border. ~28px via 6px padding + 14px text + the 1px border
|
|
553
|
+
(border-box). */
|
|
554
|
+
.ParamPill-module_pill_6Ga7S {
|
|
523
555
|
display: inline-flex;
|
|
524
556
|
align-items: center;
|
|
525
557
|
justify-content: center;
|
|
526
|
-
padding:
|
|
527
|
-
border:
|
|
558
|
+
padding: 6px;
|
|
559
|
+
border: 1px dashed var(--aia-pill-border, rgba(189, 189, 189, 0.3));
|
|
528
560
|
border-radius: 999px;
|
|
529
|
-
background:
|
|
530
|
-
background: color-mix(
|
|
531
|
-
in srgb,
|
|
532
|
-
var(--aia-pill-bg, var(--aia-color-background-supportive, #313255)) 30%,
|
|
533
|
-
transparent
|
|
534
|
-
);
|
|
561
|
+
background: transparent;
|
|
535
562
|
color: var(--aia-pill-color, var(--aia-color-text-muted, #c1c4cb));
|
|
536
563
|
font-family: inherit;
|
|
537
564
|
font-size: var(--aia-pill-font-size, 14px);
|
|
@@ -539,24 +566,26 @@
|
|
|
539
566
|
line-height: normal;
|
|
540
567
|
cursor: pointer;
|
|
541
568
|
white-space: nowrap;
|
|
542
|
-
animation:
|
|
569
|
+
animation: ParamPill-module_fadeIn_Ux4eQ 400ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
543
570
|
}
|
|
544
571
|
|
|
545
|
-
.
|
|
572
|
+
.ParamPill-module_rounded_y7xA9 {
|
|
546
573
|
border-radius: 999px;
|
|
547
574
|
}
|
|
548
575
|
|
|
549
576
|
/* Loading skeleton \u2014 preserves the pill's exact box (same width and height)
|
|
550
|
-
and
|
|
551
|
-
|
|
552
|
-
.
|
|
577
|
+
and hides the text. The base pill is now transparent, so fill the interior
|
|
578
|
+
with the skeleton color (inside the dashed border) and pulse it so it still
|
|
579
|
+
reads as a loading chip. */
|
|
580
|
+
.ParamPill-module_skeleton_57P0T {
|
|
553
581
|
pointer-events: none;
|
|
554
582
|
cursor: default;
|
|
555
583
|
color: transparent;
|
|
556
|
-
|
|
584
|
+
background: var(--aia-skeleton-bg, var(--aia-pill-bg, rgba(189, 189, 189, 0.51)));
|
|
585
|
+
animation: ParamPill-module_skeletonPulse_xGcUy 1.4s ease-in-out infinite;
|
|
557
586
|
}
|
|
558
587
|
|
|
559
|
-
@keyframes
|
|
588
|
+
@keyframes ParamPill-module_skeletonPulse_xGcUy {
|
|
560
589
|
0%,
|
|
561
590
|
100% {
|
|
562
591
|
filter: brightness(1);
|
|
@@ -566,12 +595,12 @@
|
|
|
566
595
|
}
|
|
567
596
|
}
|
|
568
597
|
|
|
569
|
-
@keyframes
|
|
598
|
+
@keyframes ParamPill-module_fadeIn_Ux4eQ {
|
|
570
599
|
from {
|
|
571
600
|
opacity: 0;
|
|
572
601
|
}
|
|
573
602
|
}
|
|
574
|
-
`,document.head.appendChild(e)}var
|
|
603
|
+
`,document.head.appendChild(e)}var oe={pill:"ParamPill-module_pill_6Ga7S",fadeIn:"ParamPill-module_fadeIn_Ux4eQ",rounded:"ParamPill-module_rounded_y7xA9",skeleton:"ParamPill-module_skeleton_57P0T",skeletonPulse:"ParamPill-module_skeletonPulse_xGcUy"};var Ue=require("react/jsx-runtime"),Le={selected:1,first:.7,next:.4,last:.2};function Ge({label:e,state:t,rounded:a,loading:s,onClick:n}){let i=[oe.pill,a?oe.rounded:"",s?oe.skeleton:""].filter(Boolean).join(" ");return(0,Ue.jsx)("button",{type:"button","data-aia-pill":"","data-aia-loading":s?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:i,style:{opacity:Le[t]},onMouseDown:d=>d.preventDefault(),onClick:s?void 0:n,disabled:s,children:e})}if(typeof document<"u"&&!document.getElementById("ac-style-0fcb7940")){let e=document.createElement("style");e.id="ac-style-0fcb7940",e.textContent=`.PillList-module_list_qvLqO {
|
|
575
604
|
position: relative;
|
|
576
605
|
z-index: 1;
|
|
577
606
|
pointer-events: auto;
|
|
@@ -581,7 +610,7 @@
|
|
|
581
610
|
align-items: center;
|
|
582
611
|
vertical-align: middle;
|
|
583
612
|
}
|
|
584
|
-
`,document.head.appendChild(e)}var
|
|
613
|
+
`,document.head.appendChild(e)}var ze={list:"PillList-module_list_qvLqO"};var he=require("react/jsx-runtime"),ht=[125,69];function Ve(e){return e===0?"first":e===1?"next":"last"}function ke({pills:e,activePillIndex:t,onSelectPill:a,activeSelected:s,rounded:n,loading:i}){return i&&e.length===0?(0,he.jsx)("span",{className:ze.list,"data-aia-pill-list-loading":"",children:ht.map((d,c)=>(0,he.jsx)("span",{"data-aia-pill-skeleton":"",className:`${oe.pill} ${n?oe.rounded:""} ${oe.skeleton}`,style:{width:d,opacity:Le[Ve(c)]}},`skel-${d}`))}):(0,he.jsx)("span",{className:ze.list,"data-aia-pill-list-loading":i?"":void 0,children:e.map((d,c)=>{let x=!!s&&c===t;return(0,he.jsx)(Ge,{label:d.text,state:x?"selected":Ve(c),selected:x,rounded:n,loading:i,onClick:()=>a(c)},`${d.type}-${d.text}`)})})}var ie=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-948e58da")){let e=document.createElement("style");e.id="ac-style-948e58da",e.textContent=`@layer layout {
|
|
585
614
|
.aia-grid {
|
|
586
615
|
display: grid;
|
|
587
616
|
grid-template-columns: repeat(
|
|
@@ -640,7 +669,7 @@
|
|
|
640
669
|
display: none;
|
|
641
670
|
}
|
|
642
671
|
}
|
|
643
|
-
`,document.head.appendChild(e)}var
|
|
672
|
+
`,document.head.appendChild(e)}var Fe=require("react/jsx-runtime");function je({min:e="16rem",max:t,gap:a,scroll:s=!1,maxHeight:n,fade:i=!1,className:d,children:c,...x}){let v=(0,ie.useRef)(null),[z,A]=(0,ie.useState)(!1);(0,ie.useEffect)(()=>{if(!i)return;let y=v.current;if(!y)return;let R=()=>{A(y.scrollHeight-y.scrollTop-y.clientHeight>1)};y.addEventListener("scroll",R,{passive:!0});let H=new ResizeObserver(R);return H.observe(y),()=>{y.removeEventListener("scroll",R),H.disconnect()}},[i]),(0,ie.useLayoutEffect)(()=>{let y=v.current;!i||!y||A(y.scrollHeight-y.scrollTop-y.clientHeight>1)},[i,c]);let S={"--aia-grid-min":e};t&&(S["--aia-grid-max"]=t),a&&(S["--aia-grid-gap"]=a),n&&(S["--aia-grid-max-height"]=n);let C=(0,Fe.jsx)("div",{ref:v,className:!i&&d?`aia-grid ${d}`:"aia-grid","data-scroll":s||void 0,style:S,...i?{}:x,children:c});return i?(0,Fe.jsx)("div",{className:d?`aia-grid-fade ${d}`:"aia-grid-fade","data-fade":z?"":void 0,...x,children:C}):C}var ce=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-82820da7")){let e=document.createElement("style");e.id="ac-style-82820da7",e.textContent=`.SuggestionItem-module_item_d4vpD {
|
|
644
673
|
position: relative;
|
|
645
674
|
overflow: visible;
|
|
646
675
|
display: flex;
|
|
@@ -990,7 +1019,7 @@
|
|
|
990
1019
|
filter: brightness(0.55);
|
|
991
1020
|
}
|
|
992
1021
|
}
|
|
993
|
-
`,document.head.appendChild(e)}var G={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",skeletonPulse:"SuggestionItem-module_skeletonPulse_plvdD",text:"SuggestionItem-module_text_yqoh9"};var
|
|
1022
|
+
`,document.head.appendChild(e)}var G={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",skeletonPulse:"SuggestionItem-module_skeletonPulse_plvdD",text:"SuggestionItem-module_text_yqoh9"};var ne=require("react/jsx-runtime");function $e({option:e,isHighlighted:t,onSelect:a,onHighlight:s,id:n,loading:i}){let[d,c]=(0,ce.useState)(!1),x=(0,ce.useRef)(void 0);(0,ce.useEffect)(()=>()=>clearTimeout(x.current),[]);let v=()=>{i||!e.is_tappable||d||(c(!0),a(e),clearTimeout(x.current),x.current=setTimeout(()=>c(!1),500))},z=[G.item,t&&!i?G.highlighted:"",e.is_tappable?G.tappable:G.nonTappable,d?G.pressed:""].filter(Boolean).join(" ");return(0,ne.jsxs)("div",{id:n,role:"option","data-aia-option":"","data-aia-loading":i?"":void 0,"aria-selected":t,className:z,tabIndex:i||!e.is_tappable?-1:0,onClick:v,onKeyDown:A=>{!i&&e.is_tappable&&(A.key==="Enter"||A.key===" ")&&(A.preventDefault(),v())},onMouseEnter:!i&&e.is_tappable?s:void 0,children:[(0,ne.jsx)("div",{className:G.streaks}),(0,ne.jsx)("div",{className:G.streaksVert}),(0,ne.jsxs)("span",{className:G.content,children:[(0,ne.jsx)("span",{className:G.text,children:e.icon?`${e.icon} ${e.text}`:e.text}),e.tag&&(0,ne.jsx)("span",{className:G.tag,children:e.tag})]})]})}var Be=require("react/jsx-runtime");function qe({options:e,activeIndex:t,onSelect:a,onHighlight:s,listboxId:n,loading:i}){return(0,Be.jsx)(je,{min:"250px",max:"250px",gap:"0",scroll:!0,fade:!0,children:e.map((d,c)=>(0,Be.jsx)($e,{option:d,isHighlighted:c===t,onSelect:a,onHighlight:()=>s(c),id:`${n}-option-${c}`,loading:i},d.text))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`@layer layout {
|
|
994
1023
|
.aia-stack {
|
|
995
1024
|
display: flex;
|
|
996
1025
|
flex-direction: column;
|
|
@@ -1007,7 +1036,7 @@
|
|
|
1007
1036
|
}
|
|
1008
1037
|
/* data-align="stretch" is the flex default \u2014 no rule needed. */
|
|
1009
1038
|
}
|
|
1010
|
-
`,document.head.appendChild(e)}var Xe=require("react/jsx-runtime");function Qe({space:e,align:t="stretch",className:a,children:
|
|
1039
|
+
`,document.head.appendChild(e)}var Xe=require("react/jsx-runtime");function Qe({space:e,align:t="stretch",className:a,children:s,...n}){let i=e?{"--aia-stack-space":e}:void 0;return(0,Xe.jsx)("div",{className:a?`aia-stack ${a}`:"aia-stack","data-align":t,style:i,...n,children:s})}var Q=require("react/jsx-runtime"),bt=[159,119,164];function xt(e){let t=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[a,s]=(0,ue.useState)(t);if((0,ue.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let n=window.matchMedia("(prefers-color-scheme: dark)"),i=()=>s(n.matches);return n.addEventListener("change",i),()=>n.removeEventListener("change",i)},[e]),e!==void 0)return e==="auto"?a?"dark":"light":e}function Ie({suggestions:e,activeIndex:t,onSelect:a,onHighlight:s,isOpen:n,id:i,className:d,pills:c,onPillClick:x,showPills:v=!0,activeSelected:z=!1,isLoading:A=!1,isInputEmpty:S=!1,optionsPosition:C="below",mode:y}){let R=xt(y),H=R!==void 0,X=e[0]?.options??[],l=!!(c&&c.length>0&&x),_=n&&(X.length>0||v&&l||A),O={suggestions:e,activeIndex:t,pills:c,showPills:v,activeSelected:z,isLoading:A,isInputEmpty:S},V=(0,ue.useRef)(O);_&&(V.current=O);let h=_?O:V.current,M=h.suggestions[0]?.options??[],T=h.activeIndex>=0&&!!M[h.activeIndex]?.is_tappable,j=!!(h.pills&&h.pills.length>0&&x),F=h.showPills&&j,te=h.showPills&&!j&&h.isLoading,Z=F||te,N=M.length>0,K=h.isLoading&&!N;return(0,Q.jsx)("div",{id:i,role:"listbox","data-aia-dropdown":"","data-options-position":C,"data-mode":R,"data-aia-loading":h.isLoading?"":void 0,className:`${H?"magicx-aia ":""}${pe.dropdown} ${_?pe.visible:""} ${d??""}`,onMouseDown:b=>b.preventDefault(),children:(0,Q.jsxs)(Qe,{space:"8px",children:[Z&&(0,Q.jsx)(fe,{noWrap:!0,className:pe.pillBar,"data-aia-pillbar":"",children:(0,Q.jsx)(ke,{pills:h.pills??[],activePillIndex:0,activeSelected:h.activeSelected,onSelectPill:x??(()=>{}),rounded:!0,loading:h.isLoading})}),N&&(0,Q.jsx)(qe,{options:M,activeIndex:h.activeIndex,onSelect:a,onHighlight:s,listboxId:i,loading:h.isLoading}),K&&(0,Q.jsx)("div",{className:pe.skeletonBars,"data-aia-skeleton-bars":"",children:bt.map(b=>(0,Q.jsx)("span",{className:pe.skeletonBar,style:{width:b}},`bar-${b}`))}),(0,Q.jsx)(We,{isOptionHighlighted:T,isInputEmpty:h.isInputEmpty})]})})}var me=require("@magicx-eng/ai-autocomplete-vanilla");if(typeof document<"u"&&!document.getElementById("ac-style-fdee06e6")){let e=document.createElement("style");e.id="ac-style-fdee06e6",e.textContent=`.SubmitButton-module_submitButton_otz7H {
|
|
1011
1040
|
flex-shrink: 0;
|
|
1012
1041
|
width: 32px;
|
|
1013
1042
|
height: 32px;
|
|
@@ -1042,5 +1071,5 @@
|
|
|
1042
1071
|
);
|
|
1043
1072
|
cursor: default;
|
|
1044
1073
|
}
|
|
1045
|
-
`,document.head.appendChild(e)}var Ze={submitButton:"SubmitButton-module_submitButton_otz7H"};var Se=require("react/jsx-runtime");function Je({disabled:e,onClick:t}){return(0,Se.jsx)("button",{type:"button","data-aia-submit":"",className:Ze.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),t()},"aria-label":"Submit",children:(0,Se.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,Se.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var Ye=require("@magicx-eng/ai-autocomplete-vanilla"),I=require("react"),vt={text:"",completedParams:[],suggestions:[],activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],placeholderText:"",isDropdownOpen:!1,isActivePillSelected:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1};function Ae({onSubmit:e,onError:t,optionOverrides:a,maskCompletedText:l,apiConfig:o,columns:i=2,dropdownTrigger:d,optionsPosition:p,closeDropdownOnBlur:x,showNonTappableOptions:v,onFocus:B,onBlur:P,value:A,completedParams:C,onChange:y,onParamsChange:R,source:H,setCursor:X}){let s=(0,I.useRef)(null),[_,O]=(0,I.useState)(null),V=(0,I.useRef)(e);V.current=e;let h=(0,I.useRef)(t);h.current=t;let te=(0,I.useRef)(y);te.current=y;let M=(0,I.useRef)(R);M.current=R;let L=(0,I.useRef)(B);L.current=B;let q=(0,I.useRef)(P);q.current=P;let z=(0,I.useRef)(X);z.current=X,(0,I.useEffect)(()=>{if(typeof document>"u")return;let r=new Ye.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:o,optionOverrides:a,maskCompletedText:l,columns:i,dropdownTrigger:d,optionsPosition:p,closeDropdownOnBlur:x,showNonTappableOptions:v,source:H,value:A,completedParams:C,onSubmit:(...E)=>V.current?.(...E),onError:(...E)=>h.current?.(...E),onChange:(...E)=>te.current?.(...E),onParamsChange:(...E)=>M.current?.(...E),onFocus:()=>L.current?.(),onBlur:()=>q.current?.(),setCursor:E=>z.current?.(E)});s.current=r,O(r.getState());let D=r.subscribe(E=>O(E));return()=>{D(),r.destroy(),s.current===r&&(s.current=null)}},[]),(0,I.useEffect)(()=>{A!==void 0&&s.current?.setValue(A)},[A]),(0,I.useEffect)(()=>{C!==void 0&&s.current?.setCompletedParams(C)},[C]);let ae=JSON.stringify(o??null),Z=(0,I.useRef)(a),N=(0,I.useRef)(0);if(a!==Z.current){let r=Z.current,D=a,E=Object.keys(r??{}),de=Object.keys(D??{});(E.length!==de.length||de.some(ge=>!r?.[ge]||D[ge]!==r[ge]))&&N.current++,Z.current=a}(0,I.useEffect)(()=>{s.current?.update({apiConfig:o,optionOverrides:a,dropdownTrigger:d,optionsPosition:p,closeDropdownOnBlur:x,showNonTappableOptions:v})},[ae,N.current,d,p,x,v]);let W=(0,I.useRef)(null);W.current===null&&(W.current={handleTextChange:r=>s.current?.handleTextChange(r),handleKeyDown:r=>{let D="nativeEvent"in r?r.nativeEvent:r;s.current?.handleKeyDown(D)},setFocused:r=>s.current?.setFocused(r),startEditingParam:r=>s.current?.startEditingParam(r),exitEditMode:()=>s.current?.exitEditMode(),handleCaretAfterInput:r=>s.current?.handleCaretAfterInput(r),handleCaretMove:r=>s.current?.handleCaretMove(r),replaceEditingRange:r=>s.current?.replaceEditingRange(r)??!1,setActivePill:r=>s.current?.setActivePill(r),removeLastParam:()=>s.current?.removeLastParam(),clearNewParamId:()=>s.current?.clearNewParamId(),reset:()=>s.current?.reset(),selectOption:r=>s.current?.selectOption(r),setActiveDropdownIndex:r=>s.current?.setActiveDropdownIndex(r),handleFocus:()=>s.current?.setFocused(!0),handleBlur:()=>s.current?.setFocused(!1)});let b=W.current,re=(0,I.useCallback)(r=>{let D=r.target.value,de=D.length>0&&!r.nativeEvent?.isComposing&&D[0]!==D[0].toUpperCase()?D[0].toUpperCase()+D.slice(1):D;s.current?.handleTextChange(de)},[]),se=(0,I.useCallback)(r=>{s.current?.handleKeyDown(r.nativeEvent)},[]),oe=s.current,u=_??vt,n=A!==void 0?A:u.text,c=C!==void 0?C:u.completedParams,m=u.actionableSuggestions,w=m[0],g=oe?.listboxId??"",T=u.activeDropdownIndex>=0&&oe?`${g}-option-${u.activeDropdownIndex}`:void 0,K=u.editingParam,J=K?{type:K.suggestionType,text:K.suggestionPlaceholder,required:!0,options:K.options}:null,be=J??w,Ce=J?[J]:m,xe=!oe||u.isLoading&&!u.editingParam&&!u.inSelectionAnimation;return{completedParams:c,suggestionPills:m,setActivePill:b.setActivePill,removeLastParam:b.removeLastParam,segments:u.segments,newParamId:u.newParamId,clearNewParamId:b.clearNewParamId,suggestions:u.suggestions,activeIndex:u.activeDropdownIndex,isReady:u.isReady,isLoading:xe,isFocused:u.isFocused,isDropdownOpen:u.isDropdownOpen,isActivePillSelected:u.isActivePillSelected,placeholderText:u.placeholderText,listboxId:g,error:u.error,handleTextChange:b.handleTextChange,handleKeyDown:b.handleKeyDown,setFocused:b.setFocused,editingParam:K,editingAnchor:u.editingAnchor,caretOffset:u.caretOffset,startEditingParam:b.startEditingParam,exitEditMode:b.exitEditMode,handleCaretAfterInput:b.handleCaretAfterInput,handleCaretMove:b.handleCaretMove,replaceEditingRange:b.replaceEditingRange,inputProps:{value:n,placeholder:u.placeholderText||void 0,onChange:re,onKeyDown:se,onFocus:b.handleFocus,onBlur:b.handleBlur,role:"combobox","aria-expanded":u.isDropdownOpen,"aria-activedescendant":T,"aria-autocomplete":"list","aria-controls":g},reset:b.reset,dropdownProps:{suggestions:be?[{...be,options:u.filteredOptions}]:[],activeIndex:u.activeDropdownIndex,onSelect:b.selectOption,onHighlight:b.setActiveDropdownIndex,isOpen:u.isDropdownOpen,id:g,pills:Ce,activeSelected:u.isActivePillSelected,onPillClick:b.setActivePill,isLoading:xe,isInputEmpty:n.trim().length===0,optionsPosition:p??"below"}}}var F=require("@magicx-eng/ai-autocomplete-vanilla"),f=require("react"),Pe;function wt(){if(Pe!==void 0)return Pe;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Pe=e.contentEditable==="plaintext-only",Pe}function et(e){let{segments:t,newParamId:a,editingParam:l,editingAnchor:o,caretOffset:i,placeholderText:d,isFocused:p,isDropdownOpen:x,listboxId:v,activeDescendantId:B,autoFocus:P,handleTextChange:A,handleKeyDown:C,handleCaretAfterInput:y,handleCaretMove:R,startEditingParam:H,replaceEditingRange:X,setFocused:s}=e,_=(0,f.useRef)(null),O=(0,f.useRef)(!1),V=(0,f.useRef)(""),h=(0,f.useRef)(""),te=(0,f.useRef)(null),M=(0,f.useRef)(0);te.current=i,(0,f.useEffect)(()=>{if(!P)return;let n=_.current;if(!n)return;document.activeElement===n?s(!0):n.focus();let c=n.ownerDocument??document,m=c.getSelection(),w=m&&m.rangeCount>0&&n.contains(m.anchorNode);if(m&&!w){let g=c.createRange();g.selectNodeContents(n),g.collapse(!0),m.removeAllRanges(),m.addRange(g)}},[P,s]),(0,f.useEffect)(()=>{let n=_.current;if(!n)return;let c=n.ownerDocument??document,m=()=>{let w=c.getSelection();if(!w||w.rangeCount===0||!w.anchorNode||!n.contains(w.anchorNode))return;let g=w.anchorNode,J=(g.nodeType===Node.ELEMENT_NODE?g:g.parentElement)?.closest('strong[data-seg="completed"][data-param-id]')?.dataset.paramId??null;if(J&&J!==l?.id){H(J);return}performance.now()-M.current<50||R((0,F.getCursorOffset)(n))};return c.addEventListener("selectionchange",m),()=>c.removeEventListener("selectionchange",m)},[l,H,R]),(0,f.useLayoutEffect)(()=>{let n=_.current;n&&(0,F.renderEditableContent)({input:n,segments:t,newParamId:a,editingParamId:l?.id??null,placeholderText:d??"",isFocused:p})},[t,a,l,d,p]),(0,f.useLayoutEffect)(()=>{let n=V.current,c=a??"";if(V.current=c,!c||c===n)return;let m=_.current;if(!m)return;m.focus();let w=te.current??(0,F.plainTextLength)(m);(0,F.setCursorOffset)(m,w)},[a]),(0,f.useLayoutEffect)(()=>{let n=h.current,c=l?.id??"";if(h.current=c,!c||c===n||o==null)return;let m=_.current;m&&(0,F.setCursorOffset)(m,o)},[l,o]);let L=(0,f.useCallback)(()=>{if(O.current)return;let n=_.current;if(!n)return;let c=(0,F.extractPlainText)(n),w=c.length>0&&c[0]!==c[0].toUpperCase()?c[0].toUpperCase()+c.slice(1):c;A(w)},[A]),q=(0,f.useCallback)(()=>{M.current=performance.now(),L();let n=_.current;n&&y((0,F.getCursorOffset)(n))},[L,y]);(0,f.useEffect)(()=>{let n=_.current;if(!n)return;let c=m=>{let w=m,g=w.inputType;if(g==="insertParagraph"||g==="insertLineBreak"||g==="insertFromDrop"){m.preventDefault();return}if(g.startsWith("insert")||g.startsWith("delete")){let T=g.startsWith("delete")?"":w.data??"";X(T)&&m.preventDefault()}};return n.addEventListener("beforeinput",c),()=>n.removeEventListener("beforeinput",c)},[X]);let z=(0,f.useCallback)(()=>{O.current=!0},[]),ae=(0,f.useCallback)(()=>{O.current=!1,L()},[L]),Z=(0,f.useCallback)(n=>{n.preventDefault();let c=_.current;if(!c)return;let m=(n.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!m)return;let w=c.ownerDocument??document,g=w.getSelection();if(!g||g.rangeCount===0)return;let T=g.getRangeAt(0);if(!c.contains(T.startContainer))return;T.deleteContents();let K=w.createTextNode(m);T.insertNode(K),T.setStartAfter(K),T.collapse(!0),g.removeAllRanges(),g.addRange(T),L()},[L]),N=(0,f.useCallback)(n=>C(n),[C]),W=(0,f.useCallback)(()=>s(!0),[s]),b=(0,f.useCallback)(()=>s(!1),[s]),re=(0,f.useCallback)(()=>_.current?.focus(),[]),se=(0,f.useCallback)(()=>_.current?.blur(),[]),oe=(0,f.useCallback)(()=>{let n=_.current;return n?(0,F.extractPlainText)(n):""},[]),u=wt()?"plaintext-only":"true";return{inputRef:_,editorProps:{ref:_,contentEditable:u,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":v,"aria-expanded":x,"aria-activedescendant":B,spellCheck:!0,enterKeyHint:"send",onInput:q,onKeyDown:N,onCompositionStart:z,onCompositionEnd:ae,onPaste:Z,onFocus:W,onBlur:b},getPlainText:oe,focus:re,blur:se}}var j=require("react/jsx-runtime");function yt(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var tt=(0,S.forwardRef)(function({onSubmit:t,onError:a,optionOverrides:l,maskCompletedText:o,className:i,apiConfig:d,columns:p,pillPlacement:x="dropdown",mode:v="auto",optionsPosition:B="below",animations:P=!0,dropdownTrigger:A,closeDropdownOnBlur:C,showNonTappableOptions:y,autoFocus:R=!0,onFocus:H,onBlur:X,value:s,completedParams:_,onChange:O,onParamsChange:V,submitButton:h},te){let M=(0,S.useRef)(null),L=(0,S.useRef)(null),q=(0,S.useRef)(()=>{}),z=(0,S.useRef)(null),ae=(0,S.useRef)(null);(0,S.useEffect)(()=>{let k=M.current;if(k)return z.current?z.current.setMode(v):z.current=new me.ModeController(k,v),()=>{z.current?.destroy(),z.current=null}},[v]);let Z=(0,S.useCallback)(k=>{let $=ae.current?.current;$&&($.focus(),(0,me.setCursorOffset)($,k))},[]),{completedParams:N,suggestionPills:W,setActivePill:b,segments:re,newParamId:se,clearNewParamId:oe,placeholderText:u,isFocused:n,isDropdownOpen:c,isActivePillSelected:m,isLoading:w,activeIndex:g,listboxId:T,handleTextChange:K,handleKeyDown:J,setFocused:be,editingParam:Ce,editingAnchor:xe,caretOffset:r,startEditingParam:D,handleCaretAfterInput:E,handleCaretMove:de,replaceEditingRange:ge,dropdownProps:at,reset:ve}=Ae({onSubmit:k=>q.current(k),onError:a,optionOverrides:l,maskCompletedText:o,apiConfig:d,columns:p,dropdownTrigger:A,optionsPosition:B,closeDropdownOnBlur:C,showNonTappableOptions:y,onFocus:H,onBlur:X,value:s,completedParams:_,onChange:O,onParamsChange:V,source:"full-sdk",setCursor:Z});(0,S.useEffect)(()=>{if(!se)return;let k=window.setTimeout(()=>oe(),650);return()=>window.clearTimeout(k)},[se,oe]);let ot=g>=0?`${T}-option-${g}`:void 0,{inputRef:Ee,editorProps:nt,focus:we,blur:Oe,getPlainText:Me}=et({segments:re,newParamId:se,editingParam:Ce,editingAnchor:xe,caretOffset:r,placeholderText:u,isFocused:n,isDropdownOpen:c,listboxId:T,activeDescendantId:ot,autoFocus:R,handleTextChange:K,handleKeyDown:J,handleCaretAfterInput:E,handleCaretMove:de,startEditingParam:D,replaceEditingRange:ge,setFocused:be});ae.current=Ee,(0,S.useLayoutEffect)(()=>{let k=L.current,$=Ee.current;if(!k||!$)return;let _e=()=>{let Ne=k.firstElementChild;if(!Ne)return;let lt=Ne.getBoundingClientRect(),dt=$.getBoundingClientRect();lt.top>=dt.bottom-2?k.setAttribute("data-aia-pill-wrapped",""):k.removeAttribute("data-aia-pill-wrapped")};_e();let He=new ResizeObserver(_e);return He.observe($),()=>He.disconnect()},[re,W.length,w,Ee]),(0,S.useImperativeHandle)(te,()=>({focus:we,blur:Oe,reset:ve,setMode:k=>z.current?.setMode(k)}),[we,Oe,ve]);let ye=!!re.length||N.length>0,De=(0,S.useCallback)(()=>{if(!ye)return;let k=Me(),{rawQuery:$,completedParams:_e}=(0,me.buildQuery)(k,N);t({query:k.trim(),raw_query:$,completed_params:_e}),ve()},[ye,N,t,ve,Me]);q.current=De;let it=(0,S.useCallback)(k=>{k.target?.closest("[data-aia-pill]")||we()},[we]),rt=x==="inline",st=x==="dropdown";return(0,j.jsxs)("div",{ref:M,className:`magicx-aia ${le.container} ${i??""}`,"data-pill-placement":x,"data-options-position":B,"data-animations":P?"on":"off","data-mode":yt(v),children:[(0,j.jsx)(Ie,{...at,showPills:st}),(0,j.jsxs)("div",{className:le.inputWrapper,onClick:it,children:[(0,j.jsxs)("div",{className:le.editorArea,"data-aia-editor":"",children:[(0,j.jsx)("div",{...nt,className:le.input,"data-aia-input":""}),rt&&(w||W.length>0)&&(0,j.jsx)("span",{ref:L,className:le.pillListContainer,"data-aia-pill-list-container":"",children:(0,j.jsx)(ke,{pills:W,activePillIndex:0,activeSelected:m,onSelectPill:b,loading:w})})]}),h===null?null:h===void 0?(0,j.jsx)(Je,{disabled:!ye,onClick:De}):(0,j.jsx)("span",{"data-aia-submit":"",className:le.submitSlot,onClick:k=>{ye&&(k.stopPropagation(),De())},children:h})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,useAIAutocomplete});
|
|
1074
|
+
`,document.head.appendChild(e)}var Ze={submitButton:"SubmitButton-module_submitButton_otz7H"};var Pe=require("react/jsx-runtime");function Je({disabled:e,onClick:t}){return(0,Pe.jsx)("button",{type:"button","data-aia-submit":"",className:Ze.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),t()},"aria-label":"Submit",children:(0,Pe.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,Pe.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var Ye=require("@magicx-eng/ai-autocomplete-vanilla"),I=require("react"),vt={text:"",completedParams:[],suggestions:[],activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],placeholderText:"",isDropdownOpen:!1,isActivePillSelected:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1};function Se({onSubmit:e,onError:t,optionOverrides:a,maskCompletedText:s,apiConfig:n,columns:i=2,dropdownTrigger:d,optionsPosition:c,closeDropdownOnBlur:x,showNonTappableOptions:v,onFocus:z,onBlur:A,value:S,completedParams:C,onChange:y,onParamsChange:R,source:H,setCursor:X}){let l=(0,I.useRef)(null),[_,O]=(0,I.useState)(null),V=(0,I.useRef)(e);V.current=e;let h=(0,I.useRef)(t);h.current=t;let ee=(0,I.useRef)(y);ee.current=y;let M=(0,I.useRef)(R);M.current=R;let T=(0,I.useRef)(z);T.current=z;let j=(0,I.useRef)(A);j.current=A;let F=(0,I.useRef)(X);F.current=X,(0,I.useEffect)(()=>{if(typeof document>"u")return;let r=new Ye.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:n,optionOverrides:a,maskCompletedText:s,columns:i,dropdownTrigger:d,optionsPosition:c,closeDropdownOnBlur:x,showNonTappableOptions:v,source:H,value:S,completedParams:C,onSubmit:(...E)=>V.current?.(...E),onError:(...E)=>h.current?.(...E),onChange:(...E)=>ee.current?.(...E),onParamsChange:(...E)=>M.current?.(...E),onFocus:()=>T.current?.(),onBlur:()=>j.current?.(),setCursor:E=>F.current?.(E)});l.current=r,O(r.getState());let D=r.subscribe(E=>O(E));return()=>{D(),r.destroy(),l.current===r&&(l.current=null)}},[]),(0,I.useEffect)(()=>{S!==void 0&&l.current?.setValue(S)},[S]),(0,I.useEffect)(()=>{C!==void 0&&l.current?.setCompletedParams(C)},[C]);let te=JSON.stringify(n??null),Z=(0,I.useRef)(a),N=(0,I.useRef)(0);if(a!==Z.current){let r=Z.current,D=a,E=Object.keys(r??{}),de=Object.keys(D??{});(E.length!==de.length||de.some(ge=>!r?.[ge]||D[ge]!==r[ge]))&&N.current++,Z.current=a}(0,I.useEffect)(()=>{l.current?.update({apiConfig:n,optionOverrides:a,dropdownTrigger:d,optionsPosition:c,closeDropdownOnBlur:x,showNonTappableOptions:v})},[te,N.current,d,c,x,v]);let K=(0,I.useRef)(null);K.current===null&&(K.current={handleTextChange:r=>l.current?.handleTextChange(r),handleKeyDown:r=>{let D="nativeEvent"in r?r.nativeEvent:r;l.current?.handleKeyDown(D)},setFocused:r=>l.current?.setFocused(r),startEditingParam:r=>l.current?.startEditingParam(r),exitEditMode:()=>l.current?.exitEditMode(),handleCaretAfterInput:r=>l.current?.handleCaretAfterInput(r),handleCaretMove:r=>l.current?.handleCaretMove(r),replaceEditingRange:r=>l.current?.replaceEditingRange(r)??!1,setActivePill:r=>l.current?.setActivePill(r),removeLastParam:()=>l.current?.removeLastParam(),clearNewParamId:()=>l.current?.clearNewParamId(),reset:()=>l.current?.reset(),selectOption:r=>l.current?.selectOption(r),setActiveDropdownIndex:r=>l.current?.setActiveDropdownIndex(r),handleFocus:()=>l.current?.setFocused(!0),handleBlur:()=>l.current?.setFocused(!1)});let b=K.current,re=(0,I.useCallback)(r=>{let D=r.target.value,de=D.length>0&&!r.nativeEvent?.isComposing&&D[0]!==D[0].toUpperCase()?D[0].toUpperCase()+D.slice(1):D;l.current?.handleTextChange(de)},[]),se=(0,I.useCallback)(r=>{l.current?.handleKeyDown(r.nativeEvent)},[]),ae=l.current,u=_??vt,o=S!==void 0?S:u.text,p=C!==void 0?C:u.completedParams,m=u.actionableSuggestions,w=m[0],g=ae?.listboxId??"",L=u.activeDropdownIndex>=0&&ae?`${g}-option-${u.activeDropdownIndex}`:void 0,W=u.editingParam,J=W?{type:W.suggestionType,text:W.suggestionPlaceholder,required:!0,options:W.options}:null,be=J??w,Ce=J?[J]:m,xe=!ae||u.isLoading&&!u.editingParam&&!u.inSelectionAnimation;return{completedParams:p,suggestionPills:m,setActivePill:b.setActivePill,removeLastParam:b.removeLastParam,segments:u.segments,newParamId:u.newParamId,clearNewParamId:b.clearNewParamId,suggestions:u.suggestions,activeIndex:u.activeDropdownIndex,isReady:u.isReady,isLoading:xe,isFocused:u.isFocused,isDropdownOpen:u.isDropdownOpen,isActivePillSelected:u.isActivePillSelected,placeholderText:u.placeholderText,listboxId:g,error:u.error,handleTextChange:b.handleTextChange,handleKeyDown:b.handleKeyDown,setFocused:b.setFocused,editingParam:W,editingAnchor:u.editingAnchor,caretOffset:u.caretOffset,startEditingParam:b.startEditingParam,exitEditMode:b.exitEditMode,handleCaretAfterInput:b.handleCaretAfterInput,handleCaretMove:b.handleCaretMove,replaceEditingRange:b.replaceEditingRange,inputProps:{value:o,placeholder:u.placeholderText||void 0,onChange:re,onKeyDown:se,onFocus:b.handleFocus,onBlur:b.handleBlur,role:"combobox","aria-expanded":u.isDropdownOpen,"aria-activedescendant":L,"aria-autocomplete":"list","aria-controls":g},reset:b.reset,dropdownProps:{suggestions:be?[{...be,options:u.filteredOptions}]:[],activeIndex:u.activeDropdownIndex,onSelect:b.selectOption,onHighlight:b.setActiveDropdownIndex,isOpen:u.isDropdownOpen,id:g,pills:Ce,activeSelected:u.isActivePillSelected,onPillClick:b.setActivePill,isLoading:xe,isInputEmpty:o.trim().length===0,optionsPosition:c??"below"}}}var B=require("@magicx-eng/ai-autocomplete-vanilla"),f=require("react"),Ae;function wt(){if(Ae!==void 0)return Ae;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Ae=e.contentEditable==="plaintext-only",Ae}function et(e){let{segments:t,newParamId:a,editingParam:s,editingAnchor:n,caretOffset:i,placeholderText:d,isFocused:c,isDropdownOpen:x,listboxId:v,activeDescendantId:z,autoFocus:A,handleTextChange:S,handleKeyDown:C,handleCaretAfterInput:y,handleCaretMove:R,startEditingParam:H,replaceEditingRange:X,setFocused:l}=e,_=(0,f.useRef)(null),O=(0,f.useRef)(!1),V=(0,f.useRef)(""),h=(0,f.useRef)(""),ee=(0,f.useRef)(null),M=(0,f.useRef)(0);ee.current=i,(0,f.useEffect)(()=>{if(!A)return;let o=_.current;if(!o)return;document.activeElement===o?l(!0):o.focus();let p=o.ownerDocument??document,m=p.getSelection(),w=m&&m.rangeCount>0&&o.contains(m.anchorNode);if(m&&!w){let g=p.createRange();g.selectNodeContents(o),g.collapse(!0),m.removeAllRanges(),m.addRange(g)}},[A,l]),(0,f.useEffect)(()=>{let o=_.current;if(!o)return;let p=o.ownerDocument??document,m=()=>{let w=p.getSelection();if(!w||w.rangeCount===0||!w.anchorNode||!o.contains(w.anchorNode))return;let g=w.anchorNode,J=(g.nodeType===Node.ELEMENT_NODE?g:g.parentElement)?.closest('strong[data-seg="completed"][data-param-id]')?.dataset.paramId??null;if(J&&J!==s?.id){H(J);return}performance.now()-M.current<50||R((0,B.getCursorOffset)(o))};return p.addEventListener("selectionchange",m),()=>p.removeEventListener("selectionchange",m)},[s,H,R]),(0,f.useLayoutEffect)(()=>{let o=_.current;o&&(0,B.renderEditableContent)({input:o,segments:t,newParamId:a,editingParamId:s?.id??null,placeholderText:d??"",isFocused:c})},[t,a,s,d,c]),(0,f.useLayoutEffect)(()=>{let o=V.current,p=a??"";if(V.current=p,!p||p===o)return;let m=_.current;if(!m)return;m.focus();let w=ee.current??(0,B.plainTextLength)(m);(0,B.setCursorOffset)(m,w)},[a]),(0,f.useLayoutEffect)(()=>{let o=h.current,p=s?.id??"";if(h.current=p,!p||p===o||n==null)return;let m=_.current;m&&(0,B.setCursorOffset)(m,n)},[s,n]);let T=(0,f.useCallback)(()=>{if(O.current)return;let o=_.current;if(!o)return;let p=(0,B.extractPlainText)(o),w=p.length>0&&p[0]!==p[0].toUpperCase()?p[0].toUpperCase()+p.slice(1):p;S(w)},[S]),j=(0,f.useCallback)(()=>{M.current=performance.now(),T();let o=_.current;o&&y((0,B.getCursorOffset)(o))},[T,y]);(0,f.useEffect)(()=>{let o=_.current;if(!o)return;let p=m=>{let w=m,g=w.inputType;if(g==="insertParagraph"||g==="insertLineBreak"||g==="insertFromDrop"){m.preventDefault();return}if(g.startsWith("insert")||g.startsWith("delete")){let L=g.startsWith("delete")?"":w.data??"";X(L)&&m.preventDefault()}};return o.addEventListener("beforeinput",p),()=>o.removeEventListener("beforeinput",p)},[X]);let F=(0,f.useCallback)(()=>{O.current=!0},[]),te=(0,f.useCallback)(()=>{O.current=!1,T()},[T]),Z=(0,f.useCallback)(o=>{o.preventDefault();let p=_.current;if(!p)return;let m=(o.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!m)return;let w=p.ownerDocument??document,g=w.getSelection();if(!g||g.rangeCount===0)return;let L=g.getRangeAt(0);if(!p.contains(L.startContainer))return;L.deleteContents();let W=w.createTextNode(m);L.insertNode(W),L.setStartAfter(W),L.collapse(!0),g.removeAllRanges(),g.addRange(L),T()},[T]),N=(0,f.useCallback)(o=>C(o),[C]),K=(0,f.useCallback)(()=>l(!0),[l]),b=(0,f.useCallback)(()=>l(!1),[l]),re=(0,f.useCallback)(()=>_.current?.focus(),[]),se=(0,f.useCallback)(()=>_.current?.blur(),[]),ae=(0,f.useCallback)(()=>{let o=_.current;return o?(0,B.extractPlainText)(o):""},[]),u=wt()?"plaintext-only":"true";return{inputRef:_,editorProps:{ref:_,contentEditable:u,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":v,"aria-expanded":x,"aria-activedescendant":z,spellCheck:!0,enterKeyHint:"send",onInput:j,onKeyDown:N,onCompositionStart:F,onCompositionEnd:te,onPaste:Z,onFocus:K,onBlur:b},getPlainText:ae,focus:re,blur:se}}var U=require("react/jsx-runtime");function yt(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var tt=(0,P.forwardRef)(function({onSubmit:t,onError:a,optionOverrides:s,maskCompletedText:n,className:i,apiConfig:d,columns:c,pillPlacement:x="dropdown",mode:v="auto",optionsPosition:z="below",animations:A=!0,dropdownTrigger:S,closeDropdownOnBlur:C,showNonTappableOptions:y,autoFocus:R=!0,onFocus:H,onBlur:X,value:l,completedParams:_,onChange:O,onParamsChange:V,submitButton:h},ee){let M=(0,P.useRef)(null),T=(0,P.useRef)(null),j=(0,P.useRef)(()=>{}),F=(0,P.useRef)(null),te=(0,P.useRef)(null);(0,P.useEffect)(()=>{let k=M.current;if(k)return F.current?F.current.setMode(v):F.current=new me.ModeController(k,v),()=>{F.current?.destroy(),F.current=null}},[v]);let Z=(0,P.useCallback)(k=>{let $=te.current?.current;$&&($.focus(),(0,me.setCursorOffset)($,k))},[]),{completedParams:N,suggestionPills:K,setActivePill:b,segments:re,newParamId:se,clearNewParamId:ae,placeholderText:u,isFocused:o,isDropdownOpen:p,isActivePillSelected:m,isLoading:w,activeIndex:g,listboxId:L,handleTextChange:W,handleKeyDown:J,setFocused:be,editingParam:Ce,editingAnchor:xe,caretOffset:r,startEditingParam:D,handleCaretAfterInput:E,handleCaretMove:de,replaceEditingRange:ge,dropdownProps:at,reset:ve}=Se({onSubmit:k=>j.current(k),onError:a,optionOverrides:s,maskCompletedText:n,apiConfig:d,columns:c,dropdownTrigger:S,optionsPosition:z,closeDropdownOnBlur:C,showNonTappableOptions:y,onFocus:H,onBlur:X,value:l,completedParams:_,onChange:O,onParamsChange:V,source:"full-sdk",setCursor:Z});(0,P.useEffect)(()=>{if(!se)return;let k=window.setTimeout(()=>ae(),650);return()=>window.clearTimeout(k)},[se,ae]);let ot=g>=0?`${L}-option-${g}`:void 0,{inputRef:Ee,editorProps:it,focus:we,blur:Oe,getPlainText:Me}=et({segments:re,newParamId:se,editingParam:Ce,editingAnchor:xe,caretOffset:r,placeholderText:u,isFocused:o,isDropdownOpen:p,listboxId:L,activeDescendantId:ot,autoFocus:R,handleTextChange:W,handleKeyDown:J,handleCaretAfterInput:E,handleCaretMove:de,startEditingParam:D,replaceEditingRange:ge,setFocused:be});te.current=Ee,(0,P.useLayoutEffect)(()=>{let k=T.current,$=Ee.current;if(!k||!$)return;let _e=()=>{let Ne=k.firstElementChild;if(!Ne)return;let lt=Ne.getBoundingClientRect(),dt=$.getBoundingClientRect();lt.top>=dt.bottom-2?k.setAttribute("data-aia-pill-wrapped",""):k.removeAttribute("data-aia-pill-wrapped")};_e();let He=new ResizeObserver(_e);return He.observe($),()=>He.disconnect()},[re,K.length,w,Ee]),(0,P.useImperativeHandle)(ee,()=>({focus:we,blur:Oe,reset:ve,setMode:k=>F.current?.setMode(k)}),[we,Oe,ve]);let ye=!!re.length||N.length>0,De=(0,P.useCallback)(()=>{if(!ye)return;let k=Me(),{rawQuery:$,completedParams:_e}=(0,me.buildQuery)(k,N);t({query:k.trim(),raw_query:$,completed_params:_e}),ve()},[ye,N,t,ve,Me]);j.current=De;let nt=(0,P.useCallback)(k=>{k.target?.closest("[data-aia-pill]")||we()},[we]),rt=x==="inline",st=x==="dropdown";return(0,U.jsxs)("div",{ref:M,className:`magicx-aia ${le.container} ${i??""}`,"data-pill-placement":x,"data-options-position":z,"data-animations":A?"on":"off","data-mode":yt(v),children:[(0,U.jsx)(Ie,{...at,showPills:st}),(0,U.jsxs)("div",{className:le.inputWrapper,onClick:nt,children:[(0,U.jsxs)("div",{className:le.editorArea,"data-aia-editor":"",children:[(0,U.jsx)("div",{...it,className:le.input,"data-aia-input":""}),rt&&(w||K.length>0)&&(0,U.jsx)("span",{ref:T,className:le.pillListContainer,"data-aia-pill-list-container":"",children:(0,U.jsx)(ke,{pills:K,activePillIndex:0,activeSelected:m,onSelectPill:b,loading:w})})]}),h===null?null:h===void 0?(0,U.jsx)(Je,{disabled:!ye,onClick:De}):(0,U.jsx)("span",{"data-aia-submit":"",className:le.submitSlot,onClick:k=>{ye&&(k.stopPropagation(),De())},children:h})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,useAIAutocomplete});
|
|
1046
1075
|
//# sourceMappingURL=index.js.map
|