@magicx-eng/ai-autocomplete-react 0.6.2 → 0.6.4
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 +103 -69
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +103 -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,52 @@
|
|
|
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
|
+
/* baseline (not middle) so the pill's text shares the surrounding text's
|
|
69
|
+
baseline exactly. middle aligns the chip box to the parent's x-height
|
|
70
|
+
midpoint, which font ascent/descent asymmetry turns into the pill text
|
|
71
|
+
sitting ~1-2px below the adjacent text. The symmetric 4px padding keeps
|
|
72
|
+
the capsule optically centered around the text on its own. */
|
|
73
|
+
vertical-align: baseline;
|
|
74
|
+
cursor: pointer;
|
|
75
|
+
/* Smooth hover fade. Neutralized by the data-animations="off" block. */
|
|
76
|
+
transition: background-color 150ms ease;
|
|
55
77
|
}
|
|
56
78
|
|
|
57
|
-
/*
|
|
58
|
-
|
|
59
|
-
|
|
79
|
+
/* Hover highlight \u2014 a slightly stronger fill so a pointed-at pill reads as
|
|
80
|
+
tappable. Declared between the base and editing rules so editing wins. */
|
|
81
|
+
:where(.AIAutocomplete-module_input_IW-P-) strong[class~="magicx-aia-segment--completed"]:hover {
|
|
82
|
+
background: var(--aia-completed-pill-bg-active, rgba(189, 189, 189, 0.35));
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
/* Re-edit highlight \u2014 applied to the completed pill being re-edited (after a
|
|
86
|
+
tap). Reuses the exact hover fill so the highlight persists from tap until an
|
|
87
|
+
option is selected. Hides the native caret; cursor switches to text since the
|
|
88
|
+
pill is in text-replacement mode. The editing class is written by the shared
|
|
89
|
+
renderer (a global string), so target it via an attribute selector to bypass
|
|
90
|
+
CSS Modules' hashing. Declared last so it wins on a strong carrying both
|
|
91
|
+
classes. */
|
|
60
92
|
: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;
|
|
93
|
+
background: var(--aia-completed-pill-bg-active, rgba(189, 189, 189, 0.35));
|
|
67
94
|
caret-color: transparent;
|
|
95
|
+
cursor: text;
|
|
68
96
|
}
|
|
69
97
|
|
|
70
98
|
/* In re-edit mode the caret is parked just *before* the bold strong (see
|
|
@@ -114,39 +142,23 @@
|
|
|
114
142
|
display: contents;
|
|
115
143
|
}
|
|
116
144
|
|
|
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
|
-
|
|
145
|
+
/* Promotion reveal on a newly promoted completed param. The shared renderer
|
|
146
|
+
(core/render/renderEditable.ts) stamps the global shimmer classes onto the
|
|
147
|
+
just-added <strong>; we match them via [class~=] to bypass CSS Modules'
|
|
148
|
+
hashing. Completed params are now pills with a solid background, so the old
|
|
149
|
+
text-clip gradient shimmer can't be used (background-clip: text would wipe
|
|
150
|
+
the pill background). The reveal is a simple fade-in of the whole pill,
|
|
151
|
+
riding on shimmer-sweep so it only plays on genuine promotions. */
|
|
137
152
|
:where(.AIAutocomplete-module_input_IW-P-) strong[class~="magicx-aia-shimmer-sweep"] {
|
|
138
|
-
animation: AIAutocomplete-
|
|
153
|
+
animation: AIAutocomplete-module_aiaPillReveal_wf05b 400ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
139
154
|
}
|
|
140
155
|
|
|
141
|
-
@keyframes AIAutocomplete-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
}
|
|
145
|
-
100% {
|
|
146
|
-
background-position: -50% 0;
|
|
156
|
+
@keyframes AIAutocomplete-module_aiaPillReveal_wf05b {
|
|
157
|
+
from {
|
|
158
|
+
opacity: 0;
|
|
147
159
|
}
|
|
148
160
|
}
|
|
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",
|
|
161
|
+
`,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
162
|
* Built-in appearance defaults \u2014 zero specificity via :where().
|
|
151
163
|
* Consumer CSS always wins without !important.
|
|
152
164
|
*
|
|
@@ -185,6 +197,9 @@
|
|
|
185
197
|
--aia-primitive-neutral-1000: #ffffff;
|
|
186
198
|
--aia-primitive-blue-50: #eef2ff;
|
|
187
199
|
--aia-primitive-neutral-750-a50: rgba(189, 189, 189, 0.51);
|
|
200
|
+
--aia-primitive-neutral-750-a35: rgba(189, 189, 189, 0.35);
|
|
201
|
+
--aia-primitive-neutral-750-a30: rgba(189, 189, 189, 0.3);
|
|
202
|
+
--aia-primitive-neutral-750-a15: rgba(189, 189, 189, 0.15);
|
|
188
203
|
--aia-primitive-neutral-700-a40: rgba(176, 176, 176, 0.4);
|
|
189
204
|
}
|
|
190
205
|
|
|
@@ -201,10 +216,21 @@
|
|
|
201
216
|
--aia-primitive-neutral-900
|
|
202
217
|
); /* was #e5e7eb \u2014 snapped to palette (\u03942) */
|
|
203
218
|
--aia-dropdown-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
|
|
204
|
-
|
|
219
|
+
/* Suggestion pills (Figma "ParamPill"): transparent fill + dashed border;
|
|
220
|
+
per-pill opacity via getPillOpacity. */
|
|
221
|
+
--aia-pill-bg: var(--aia-primitive-neutral-750);
|
|
205
222
|
--aia-pill-color: var(--aia-primitive-neutral-300);
|
|
223
|
+
--aia-pill-border: var(--aia-primitive-neutral-750-a30);
|
|
206
224
|
--aia-pill-font-size: 14px;
|
|
207
225
|
|
|
226
|
+
/* Completed params (Figma "RichTextPill"): compact faint-gray chip with
|
|
227
|
+
primary-color regular-weight text. -active is the hover / tapped (re-edit)
|
|
228
|
+
highlight \u2014 an alpha over the input background, so one value works in both
|
|
229
|
+
themes. */
|
|
230
|
+
--aia-completed-pill-bg: var(--aia-primitive-neutral-750-a15);
|
|
231
|
+
--aia-completed-pill-bg-active: var(--aia-primitive-neutral-750-a35);
|
|
232
|
+
--aia-completed-pill-color: var(--aia-primitive-neutral-0);
|
|
233
|
+
|
|
208
234
|
--aia-option-bg: var(--aia-primitive-blue-50);
|
|
209
235
|
--aia-option-color: var(--aia-primitive-neutral-500);
|
|
210
236
|
--aia-option-color-selected: var(--aia-primitive-neutral-0);
|
|
@@ -242,10 +268,18 @@
|
|
|
242
268
|
--aia-primitive-neutral-400
|
|
243
269
|
); /* was #484848 \u2014 snapped to palette (\u03942) */
|
|
244
270
|
--aia-dropdown-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
|
|
271
|
+
/* Suggestion pills (Figma "ParamPill"): transparent fill + dashed border. */
|
|
245
272
|
--aia-pill-bg: var(--aia-primitive-neutral-750);
|
|
246
273
|
--aia-pill-color: var(--aia-primitive-neutral-700);
|
|
274
|
+
--aia-pill-border: var(--aia-primitive-neutral-750-a30);
|
|
247
275
|
--aia-pill-font-size: 14px;
|
|
248
276
|
|
|
277
|
+
/* Completed params (Figma "RichTextPill") \u2014 dark theme (design source):
|
|
278
|
+
white text on a faint-gray chip. -active is the hover / tapped highlight. */
|
|
279
|
+
--aia-completed-pill-bg: var(--aia-primitive-neutral-750-a15);
|
|
280
|
+
--aia-completed-pill-bg-active: var(--aia-primitive-neutral-750-a35);
|
|
281
|
+
--aia-completed-pill-color: var(--aia-primitive-neutral-1000);
|
|
282
|
+
|
|
249
283
|
--aia-option-bg: var(--aia-primitive-neutral-250);
|
|
250
284
|
--aia-option-color: var(--aia-primitive-neutral-700);
|
|
251
285
|
--aia-option-color-selected: var(--aia-primitive-neutral-1000);
|
|
@@ -396,7 +430,7 @@
|
|
|
396
430
|
opacity: 0.25;
|
|
397
431
|
}
|
|
398
432
|
}
|
|
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
|
|
433
|
+
`,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
434
|
.aia-cluster {
|
|
401
435
|
display: flex;
|
|
402
436
|
flex-wrap: wrap;
|
|
@@ -438,7 +472,7 @@
|
|
|
438
472
|
justify-content: space-around;
|
|
439
473
|
}
|
|
440
474
|
}
|
|
441
|
-
`,document.head.appendChild(e)}var
|
|
475
|
+
`,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
476
|
dropdown's rounded edges. The top inset (--aia-footer-gap) adds breathing
|
|
443
477
|
room above the hint/branding row so the footer doesn't butt against the last
|
|
444
478
|
option row \u2014 additive to the dropdown's 8px section gap. */
|
|
@@ -519,19 +553,17 @@
|
|
|
519
553
|
justify-content: flex-end;
|
|
520
554
|
}
|
|
521
555
|
}
|
|
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
|
|
556
|
+
`,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
|
|
557
|
+
with a dashed border. ~28px via 6px padding + 14px text + the 1px border
|
|
558
|
+
(border-box). */
|
|
559
|
+
.ParamPill-module_pill_6Ga7S {
|
|
523
560
|
display: inline-flex;
|
|
524
561
|
align-items: center;
|
|
525
562
|
justify-content: center;
|
|
526
|
-
padding:
|
|
527
|
-
border:
|
|
563
|
+
padding: 6px;
|
|
564
|
+
border: 1px dashed var(--aia-pill-border, rgba(189, 189, 189, 0.3));
|
|
528
565
|
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
|
-
);
|
|
566
|
+
background: transparent;
|
|
535
567
|
color: var(--aia-pill-color, var(--aia-color-text-muted, #c1c4cb));
|
|
536
568
|
font-family: inherit;
|
|
537
569
|
font-size: var(--aia-pill-font-size, 14px);
|
|
@@ -539,24 +571,26 @@
|
|
|
539
571
|
line-height: normal;
|
|
540
572
|
cursor: pointer;
|
|
541
573
|
white-space: nowrap;
|
|
542
|
-
animation:
|
|
574
|
+
animation: ParamPill-module_fadeIn_Ux4eQ 400ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
543
575
|
}
|
|
544
576
|
|
|
545
|
-
.
|
|
577
|
+
.ParamPill-module_rounded_y7xA9 {
|
|
546
578
|
border-radius: 999px;
|
|
547
579
|
}
|
|
548
580
|
|
|
549
581
|
/* Loading skeleton \u2014 preserves the pill's exact box (same width and height)
|
|
550
|
-
and
|
|
551
|
-
|
|
552
|
-
.
|
|
582
|
+
and hides the text. The base pill is now transparent, so fill the interior
|
|
583
|
+
with the skeleton color (inside the dashed border) and pulse it so it still
|
|
584
|
+
reads as a loading chip. */
|
|
585
|
+
.ParamPill-module_skeleton_57P0T {
|
|
553
586
|
pointer-events: none;
|
|
554
587
|
cursor: default;
|
|
555
588
|
color: transparent;
|
|
556
|
-
|
|
589
|
+
background: var(--aia-skeleton-bg, var(--aia-pill-bg, rgba(189, 189, 189, 0.51)));
|
|
590
|
+
animation: ParamPill-module_skeletonPulse_xGcUy 1.4s ease-in-out infinite;
|
|
557
591
|
}
|
|
558
592
|
|
|
559
|
-
@keyframes
|
|
593
|
+
@keyframes ParamPill-module_skeletonPulse_xGcUy {
|
|
560
594
|
0%,
|
|
561
595
|
100% {
|
|
562
596
|
filter: brightness(1);
|
|
@@ -566,12 +600,12 @@
|
|
|
566
600
|
}
|
|
567
601
|
}
|
|
568
602
|
|
|
569
|
-
@keyframes
|
|
603
|
+
@keyframes ParamPill-module_fadeIn_Ux4eQ {
|
|
570
604
|
from {
|
|
571
605
|
opacity: 0;
|
|
572
606
|
}
|
|
573
607
|
}
|
|
574
|
-
`,document.head.appendChild(e)}var
|
|
608
|
+
`,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
609
|
position: relative;
|
|
576
610
|
z-index: 1;
|
|
577
611
|
pointer-events: auto;
|
|
@@ -581,7 +615,7 @@
|
|
|
581
615
|
align-items: center;
|
|
582
616
|
vertical-align: middle;
|
|
583
617
|
}
|
|
584
|
-
`,document.head.appendChild(e)}var
|
|
618
|
+
`,document.head.appendChild(e)}var ze={list:"PillList-module_list_qvLqO"};var he=require("react/jsx-runtime"),ht=[125,69];function je(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[je(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":je(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
619
|
.aia-grid {
|
|
586
620
|
display: grid;
|
|
587
621
|
grid-template-columns: repeat(
|
|
@@ -640,7 +674,7 @@
|
|
|
640
674
|
display: none;
|
|
641
675
|
}
|
|
642
676
|
}
|
|
643
|
-
`,document.head.appendChild(e)}var
|
|
677
|
+
`,document.head.appendChild(e)}var Fe=require("react/jsx-runtime");function Ve({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
678
|
position: relative;
|
|
645
679
|
overflow: visible;
|
|
646
680
|
display: flex;
|
|
@@ -990,7 +1024,7 @@
|
|
|
990
1024
|
filter: brightness(0.55);
|
|
991
1025
|
}
|
|
992
1026
|
}
|
|
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
|
|
1027
|
+
`,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)(Ve,{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
1028
|
.aia-stack {
|
|
995
1029
|
display: flex;
|
|
996
1030
|
flex-direction: column;
|
|
@@ -1007,7 +1041,7 @@
|
|
|
1007
1041
|
}
|
|
1008
1042
|
/* data-align="stretch" is the flex default \u2014 no rule needed. */
|
|
1009
1043
|
}
|
|
1010
|
-
`,document.head.appendChild(e)}var Xe=require("react/jsx-runtime");function Qe({space:e,align:t="stretch",className:a,children:
|
|
1044
|
+
`,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},j=(0,ue.useRef)(O);_&&(j.current=O);let h=_?O:j.current,M=h.suggestions[0]?.options??[],T=h.activeIndex>=0&&!!M[h.activeIndex]?.is_tappable,V=!!(h.pills&&h.pills.length>0&&x),F=h.showPills&&V,te=h.showPills&&!V&&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
1045
|
flex-shrink: 0;
|
|
1012
1046
|
width: 32px;
|
|
1013
1047
|
height: 32px;
|
|
@@ -1042,5 +1076,5 @@
|
|
|
1042
1076
|
);
|
|
1043
1077
|
cursor: default;
|
|
1044
1078
|
}
|
|
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});
|
|
1079
|
+
`,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),j=(0,I.useRef)(e);j.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 V=(0,I.useRef)(A);V.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)=>j.current?.(...E),onError:(...E)=>h.current?.(...E),onChange:(...E)=>ee.current?.(...E),onParamsChange:(...E)=>M.current?.(...E),onFocus:()=>T.current?.(),onBlur:()=>V.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),j=(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=j.current,p=a??"";if(j.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]),V=(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:V,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:j,submitButton:h},ee){let M=(0,P.useRef)(null),T=(0,P.useRef)(null),V=(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=>V.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:j,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]);V.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
1080
|
//# sourceMappingURL=index.js.map
|