@magicx-eng/ai-autocomplete-react 0.8.1 → 0.9.0
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 +84 -44
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +83 -43
- 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
|
|
1
|
+
"use strict";var Ge=Object.defineProperty;var _t=Object.getOwnPropertyDescriptor;var Pt=Object.getOwnPropertyNames;var It=Object.prototype.hasOwnProperty;var St=(e,o)=>{for(var a in o)Ge(e,a,{get:o[a],enumerable:!0})},At=(e,o,a,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let s of Pt(o))!It.call(e,s)&&s!==a&&Ge(e,s,{get:()=>o[s],enumerable:!(n=_t(o,s))||n.enumerable});return e};var Ct=e=>At(Ge({},"__esModule",{value:!0}),e);var Ot={};St(Ot,{AIAutocomplete:()=>gt,AIAutocompleteDropdown:()=>Te,buildSubmitResult:()=>Fe.buildSubmitResult,useAIAutocomplete:()=>ze,withSkippedParams:()=>Fe.withSkippedParams});module.exports=Ct(Ot);var Fe=require("@magicx-eng/ai-autocomplete-vanilla");var _=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
|
|
@@ -15,7 +15,9 @@
|
|
|
15
15
|
box-shadow: var(--aia-shadow, none);
|
|
16
16
|
overflow: hidden;
|
|
17
17
|
display: flex;
|
|
18
|
-
align
|
|
18
|
+
/* Top-align so the submit button stays by the first line while the editor
|
|
19
|
+
grows downward and then scrolls internally. */
|
|
20
|
+
align-items: flex-start;
|
|
19
21
|
gap: 12px;
|
|
20
22
|
}
|
|
21
23
|
|
|
@@ -23,13 +25,28 @@
|
|
|
23
25
|
position: relative;
|
|
24
26
|
flex: 1;
|
|
25
27
|
min-width: 0;
|
|
26
|
-
min-height:
|
|
27
|
-
line
|
|
28
|
+
min-height: 22px;
|
|
29
|
+
/* Airy line box so wrapped rows of chips (and plain text) don't touch. */
|
|
30
|
+
line-height: var(--aia-editor-line-height, 1.9);
|
|
28
31
|
font-family: inherit;
|
|
29
32
|
font-size: var(--aia-written-text-font-size, 14px);
|
|
30
33
|
white-space: pre-wrap;
|
|
31
34
|
word-break: break-word;
|
|
32
35
|
overflow-wrap: anywhere;
|
|
36
|
+
/* Grow with content up to a cap of five rows, then hold height and scroll
|
|
37
|
+
internally \u2014 the caret stays in view as the text is pushed up. The
|
|
38
|
+
scrollbar is hidden so the box reads as a clean growing field. The cap is
|
|
39
|
+
five line boxes rather than a fixed pixel height so it still lands on a
|
|
40
|
+
whole row when a consumer resizes the text via
|
|
41
|
+
--aia-written-text-font-size (\`em\` here resolves against this element's
|
|
42
|
+
own font-size, which is that token). */
|
|
43
|
+
max-height: var(--aia-editor-max-height, calc(var(--aia-editor-line-height, 1.9) * 5em));
|
|
44
|
+
overflow-y: auto;
|
|
45
|
+
scrollbar-width: none;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.AIAutocomplete-module_editorArea_7rBWq::-webkit-scrollbar {
|
|
49
|
+
display: none;
|
|
33
50
|
}
|
|
34
51
|
|
|
35
52
|
.AIAutocomplete-module_input_IW-P- {
|
|
@@ -54,23 +71,27 @@
|
|
|
54
71
|
<strong>). The completed class is stamped by the shared renderer as a global
|
|
55
72
|
string, so match it via [class~=] to bypass CSS Modules' hashing. */
|
|
56
73
|
:where(.AIAutocomplete-module_input_IW-P-) strong[class~="magicx-aia-segment--completed"] {
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
74
|
+
/* inline (not inline-block) so a chip too wide for the line breaks across two
|
|
75
|
+
lines; box-decoration-break: clone gives each fragment its own padding /
|
|
76
|
+
radius / fill, so an over-long recognized phrase renders as two little
|
|
77
|
+
rounded blocks instead of overflowing the field. */
|
|
78
|
+
display: inline;
|
|
79
|
+
padding: 3px 6px;
|
|
80
|
+
/* Rounded rectangle, not a full capsule. */
|
|
81
|
+
border-radius: 6px;
|
|
82
|
+
-webkit-box-decoration-break: clone;
|
|
83
|
+
box-decoration-break: clone;
|
|
60
84
|
background: var(--aia-completed-pill-bg, rgba(189, 189, 189, 0.105));
|
|
61
85
|
color: var(--aia-completed-pill-color, var(--aia-written-text-color, #fff));
|
|
62
86
|
font-size: var(--aia-pill-font-size, 14px);
|
|
63
87
|
font-weight: 400;
|
|
64
88
|
line-height: normal;
|
|
65
|
-
white-space:
|
|
66
|
-
/*
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
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;
|
|
89
|
+
white-space: normal;
|
|
90
|
+
/* Tighten the tracking so the chip's horizontal padding doesn't make the
|
|
91
|
+
recognized phrase read wider than the same words as plain text. The exact
|
|
92
|
+
per-chip amount is set inline by the renderer (renderEditable); this is a
|
|
93
|
+
fallback for any chip the renderer didn't stamp. */
|
|
94
|
+
letter-spacing: var(--aia-completed-pill-tracking, -0.02em);
|
|
74
95
|
cursor: pointer;
|
|
75
96
|
/* Smooth hover fade. Neutralized by the data-animations="off" block. */
|
|
76
97
|
transition: background-color 150ms ease;
|
|
@@ -158,7 +179,7 @@
|
|
|
158
179
|
opacity: 0;
|
|
159
180
|
}
|
|
160
181
|
}
|
|
161
|
-
`,document.head.appendChild(e)}var
|
|
182
|
+
`,document.head.appendChild(e)}var pe={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 ve=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
|
|
162
183
|
* Built-in appearance defaults \u2014 zero specificity via :where().
|
|
163
184
|
* Consumer CSS always wins without !important.
|
|
164
185
|
*
|
|
@@ -232,7 +253,7 @@
|
|
|
232
253
|
--aia-pill-bg: var(--aia-primitive-neutral-750);
|
|
233
254
|
--aia-pill-color: var(--aia-primitive-neutral-300);
|
|
234
255
|
--aia-pill-border: var(--aia-primitive-neutral-750-a30);
|
|
235
|
-
--aia-pill-font-size:
|
|
256
|
+
--aia-pill-font-size: 16px;
|
|
236
257
|
|
|
237
258
|
/* Completed params (Figma "RichTextPill"): compact faint-gray chip with
|
|
238
259
|
primary-color regular-weight text. -active is the hover / tapped (re-edit)
|
|
@@ -243,12 +264,15 @@
|
|
|
243
264
|
--aia-completed-pill-color: var(--aia-primitive-neutral-0);
|
|
244
265
|
|
|
245
266
|
--aia-option-bg: var(--aia-primitive-blue-50);
|
|
246
|
-
|
|
267
|
+
/* Options read bigger + darker than the small-caps param labels above them. */
|
|
268
|
+
--aia-option-color: var(--aia-primitive-neutral-150);
|
|
247
269
|
--aia-option-color-selected: var(--aia-primitive-neutral-0);
|
|
248
|
-
--aia-option-font-size:
|
|
270
|
+
--aia-option-font-size: 16px;
|
|
249
271
|
|
|
250
272
|
--aia-written-text-color: var(--aia-primitive-neutral-0);
|
|
251
|
-
|
|
273
|
+
/* Match the option size so the typed query never reads smaller than the
|
|
274
|
+
choices below it. */
|
|
275
|
+
--aia-written-text-font-size: 16px;
|
|
252
276
|
--aia-caret-color: var(--aia-written-text-color, #000000);
|
|
253
277
|
|
|
254
278
|
--aia-submit-bg: var(--aia-primitive-neutral-0);
|
|
@@ -285,7 +309,7 @@
|
|
|
285
309
|
--aia-pill-bg: var(--aia-primitive-neutral-750);
|
|
286
310
|
--aia-pill-color: var(--aia-primitive-neutral-700);
|
|
287
311
|
--aia-pill-border: var(--aia-primitive-neutral-750-a30);
|
|
288
|
-
--aia-pill-font-size:
|
|
312
|
+
--aia-pill-font-size: 16px;
|
|
289
313
|
|
|
290
314
|
/* Completed params (Figma "RichTextPill") \u2014 dark theme (design source):
|
|
291
315
|
white text on a faint-gray chip. -active is the hover / tapped highlight.
|
|
@@ -298,12 +322,13 @@
|
|
|
298
322
|
--aia-completed-pill-color: var(--aia-primitive-neutral-1000);
|
|
299
323
|
|
|
300
324
|
--aia-option-bg: var(--aia-primitive-neutral-250);
|
|
301
|
-
|
|
325
|
+
/* Options read bigger + darker/brighter than the small-caps param labels. */
|
|
326
|
+
--aia-option-color: var(--aia-primitive-neutral-900);
|
|
302
327
|
--aia-option-color-selected: var(--aia-primitive-neutral-1000);
|
|
303
|
-
--aia-option-font-size:
|
|
328
|
+
--aia-option-font-size: 16px;
|
|
304
329
|
|
|
305
330
|
--aia-written-text-color: var(--aia-primitive-neutral-1000);
|
|
306
|
-
--aia-written-text-font-size:
|
|
331
|
+
--aia-written-text-font-size: 16px;
|
|
307
332
|
--aia-caret-color: var(--aia-written-text-color, #ffffff);
|
|
308
333
|
|
|
309
334
|
--aia-submit-bg: var(--aia-primitive-neutral-1000);
|
|
@@ -555,7 +580,7 @@
|
|
|
555
580
|
opacity: 0.25;
|
|
556
581
|
}
|
|
557
582
|
}
|
|
558
|
-
`,document.head.appendChild(e)}var
|
|
583
|
+
`,document.head.appendChild(e)}var he={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 ge=require("@magicx-eng/ai-autocomplete-vanilla"),Ce=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-5259a217")){let e=document.createElement("style");e.id="ac-style-5259a217",e.textContent=`@layer layout {
|
|
559
584
|
.aia-cluster {
|
|
560
585
|
display: flex;
|
|
561
586
|
flex-wrap: wrap;
|
|
@@ -597,7 +622,7 @@
|
|
|
597
622
|
justify-content: space-around;
|
|
598
623
|
}
|
|
599
624
|
}
|
|
600
|
-
`,document.head.appendChild(e)}var
|
|
625
|
+
`,document.head.appendChild(e)}var Ke=require("react/jsx-runtime");function ye({gap:e,align:o="center",justify:a="start",noWrap:n=!1,inline:s=!1,className:l,children:r,...u}){let g=e?{"--aia-cluster-gap":e}:void 0,w={className:l?`aia-cluster ${l}`:"aia-cluster","data-align":o,"data-justify":a,"data-nowrap":n||void 0,"data-inline":s||void 0,style:g,...u};return s?(0,Ke.jsx)("span",{...w,children:r}):(0,Ke.jsx)("div",{...w,children:r})}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
|
|
601
626
|
dropdown's rounded edges. The top inset (--aia-footer-gap) adds breathing
|
|
602
627
|
room above the hint/branding row so the footer doesn't butt against the last
|
|
603
628
|
option row \u2014 additive to the dropdown's 8px section gap. */
|
|
@@ -659,6 +684,17 @@
|
|
|
659
684
|
border-radius: 6px;
|
|
660
685
|
}
|
|
661
686
|
|
|
687
|
+
/* The brand sits at the right edge where option rows scroll under the fade, so
|
|
688
|
+
"AI" was getting clipped / washed out. Give the whole brand its own opaque,
|
|
689
|
+
fully-rounded surface pill so it always reads clearly over the fade. Declared
|
|
690
|
+
after the shared .hintGroup/.brandLink chip rule so it wins. */
|
|
691
|
+
.DropdownFooter-module_brandLink_r4f3R {
|
|
692
|
+
background: var(--aia-footer-brand-pill-bg, var(--aia-surface, #ffffff));
|
|
693
|
+
border-radius: 999px;
|
|
694
|
+
padding: 2px 7px;
|
|
695
|
+
gap: 4px;
|
|
696
|
+
}
|
|
697
|
+
|
|
662
698
|
.DropdownFooter-module_brandLink_r4f3R:hover {
|
|
663
699
|
opacity: 0.7;
|
|
664
700
|
}
|
|
@@ -716,22 +752,26 @@
|
|
|
716
752
|
justify-content: flex-end;
|
|
717
753
|
}
|
|
718
754
|
}
|
|
719
|
-
`,document.head.appendChild(e)}var ae={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
|
|
755
|
+
`,document.head.appendChild(e)}var ae={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 j=require("react/jsx-runtime");function Ze({isOptionHighlighted:e=!1,isInputEmpty:o=!1}){let{key:a,hint:n}=(0,ge.getFooterHint)(e,o),[s,l]=(0,Ce.useState)(ge.ATTRIBUTION_URL);return(0,Ce.useEffect)(()=>{l((0,ge.buildAttributionUrl)())},[]),(0,j.jsx)("footer",{className:ae.footer,"data-aia-footer":"",children:(0,j.jsxs)(ye,{justify:"between",noWrap:!0,className:ae.row,children:[(0,j.jsxs)(ye,{gap:"5px",className:ae.hintGroup,children:[(0,j.jsx)("kbd",{className:ae.key,children:a}),(0,j.jsx)("span",{className:ae.hint,children:n})]}),(0,j.jsxs)("a",{className:ae.brandLink,href:s,target:"_blank",rel:"noopener noreferrer",children:[(0,j.jsx)("span",{className:ae.brand,children:"AI"}),(0,j.jsx)("span",{className:ae.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
|
|
720
756
|
with a dashed border. ~28px via 6px padding + 14px text + the 1px border
|
|
721
757
|
(border-box). */
|
|
722
758
|
.ParamPill-module_pill_6Ga7S {
|
|
723
759
|
display: inline-flex;
|
|
724
760
|
align-items: center;
|
|
725
761
|
justify-content: center;
|
|
726
|
-
padding:
|
|
762
|
+
padding: 5px 8px;
|
|
727
763
|
border: 1px dashed var(--aia-pill-border, rgba(189, 189, 189, 0.3));
|
|
728
|
-
border-radius:
|
|
764
|
+
border-radius: 7px;
|
|
729
765
|
background: transparent;
|
|
730
766
|
color: var(--aia-pill-color, var(--aia-color-text-muted, #c1c4cb));
|
|
731
767
|
font-family: inherit;
|
|
732
|
-
|
|
733
|
-
|
|
768
|
+
/* Param labels read as small-caps section headers: distinctly smaller than
|
|
769
|
+
the options they head (0.8\xD7 the pill knob), uppercased, and letter-spaced. */
|
|
770
|
+
font-size: calc(var(--aia-pill-font-size, 14px) * 0.8);
|
|
771
|
+
font-weight: 600;
|
|
734
772
|
line-height: normal;
|
|
773
|
+
text-transform: uppercase;
|
|
774
|
+
letter-spacing: 0.06em;
|
|
735
775
|
cursor: pointer;
|
|
736
776
|
white-space: nowrap;
|
|
737
777
|
animation: ParamPill-module_fadeIn_Ux4eQ 400ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
@@ -768,7 +808,7 @@
|
|
|
768
808
|
opacity: 0;
|
|
769
809
|
}
|
|
770
810
|
}
|
|
771
|
-
`,document.head.appendChild(e)}var le={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
|
|
811
|
+
`,document.head.appendChild(e)}var le={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 et=require("react/jsx-runtime"),We={selected:1,first:.7,next:.4,last:.2};function Ye({label:e,state:o,rounded:a,loading:n,onClick:s}){let l=[le.pill,a?le.rounded:"",n?le.skeleton:""].filter(Boolean).join(" ");return(0,et.jsx)("button",{type:"button","data-aia-pill":"","data-aia-loading":n?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:l,style:{opacity:We[o]},onMouseDown:r=>r.preventDefault(),onClick:n?void 0:s,disabled:n,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 {
|
|
772
812
|
position: relative;
|
|
773
813
|
z-index: 1;
|
|
774
814
|
pointer-events: auto;
|
|
@@ -778,7 +818,7 @@
|
|
|
778
818
|
align-items: center;
|
|
779
819
|
vertical-align: middle;
|
|
780
820
|
}
|
|
781
|
-
`,document.head.appendChild(e)}var
|
|
821
|
+
`,document.head.appendChild(e)}var Ue={list:"PillList-module_list_qvLqO"};var ke=require("react/jsx-runtime"),Et=[125,69];function tt(e){return e===0?"first":e===1?"next":"last"}function Ee({pills:e,activePillIndex:o,onSelectPill:a,activeSelected:n,rounded:s,loading:l}){return l&&e.length===0?(0,ke.jsx)("span",{className:Ue.list,"data-aia-pill-list-loading":"",children:Et.map((r,u)=>(0,ke.jsx)("span",{"data-aia-pill-skeleton":"",className:`${le.pill} ${s?le.rounded:""} ${le.skeleton}`,style:{width:r,opacity:We[tt(u)]}},`skel-${r}`))}):(0,ke.jsx)("span",{className:Ue.list,"data-aia-pill-list-loading":l?"":void 0,children:e.map((r,u)=>{let g=!!n&&u===o;return(0,ke.jsx)(Ye,{label:r.text,state:g?"selected":tt(u),selected:g,rounded:s,loading:l,onClick:()=>a(u)},`${r.type}-${r.text}`)})})}if(typeof document<"u"&&!document.getElementById("ac-style-fef1688d")){let e=document.createElement("style");e.id="ac-style-fef1688d",e.textContent=`/* Product strip \u2014 the React counterpart of the vanilla core's strip rules
|
|
782
822
|
(packages/vanilla/src/styles.css). Same tokens, same defaults, so a consumer
|
|
783
823
|
theming one package sees the same result in the other.
|
|
784
824
|
|
|
@@ -945,7 +985,7 @@
|
|
|
945
985
|
var(--aia-option-color-selected, var(--aia-color-text-default, #fff))
|
|
946
986
|
);
|
|
947
987
|
}
|
|
948
|
-
`,document.head.appendChild(e)}var
|
|
988
|
+
`,document.head.appendChild(e)}var G={section:"ProductStrip-module_section_Hugfg",label:"ProductStrip-module_label_nuc93",row:"ProductStrip-module_row_WDVBX",card:"ProductStrip-module_card_JBGYT",media:"ProductStrip-module_media_RrbGe",image:"ProductStrip-module_image_5pNL7",body:"ProductStrip-module_body_ly032",vendor:"ProductStrip-module_vendor_Gvu7G",title:"ProductStrip-module_title_gCNmq",price:"ProductStrip-module_price_gULcE"};var z=require("react/jsx-runtime");function at({products:e,listboxId:o,onSelect:a,onFocusChange:n,focusable:s=!0}){if(e.length===0)return null;let l=`${o}-products-label`;return(0,z.jsxs)("section",{className:G.section,"data-aia-products":"",role:"group","aria-labelledby":l,children:[(0,z.jsx)("div",{className:G.label,id:l,children:"Products"}),(0,z.jsx)("div",{className:G.row,"data-aia-products-row":"",children:e.map((r,u)=>(0,z.jsx)(Rt,{product:r,id:`${o}-product-${u}`,onSelect:a,onFocusChange:n,focusable:s},r.id))})]})}function Rt({product:e,id:o,onSelect:a,onFocusChange:n,focusable:s}){let l=r=>{r.metaKey||r.ctrlKey||r.shiftKey||r.altKey||r.button!==0||(r.preventDefault(),a(e))};return(0,z.jsxs)("a",{id:o,className:G.card,"data-aia-product":"",role:"option","aria-selected":!1,href:e.url,tabIndex:s?0:-1,onClick:l,onKeyDown:r=>{r.key!=="Enter"&&r.key!==" "||(r.preventDefault(),a(e))},onFocus:()=>n?.(!0),onBlur:r=>{r.relatedTarget?.closest("[data-aia-dropdown]")||n?.(!1)},children:[(0,z.jsx)("span",{className:G.media,"data-aia-product-placeholder":e.imageUrl?void 0:"",children:e.imageUrl?(0,z.jsx)("img",{className:G.image,src:e.imageUrl,alt:"",loading:"lazy",decoding:"async"}):null}),(0,z.jsxs)("span",{className:G.body,children:[e.vendor?(0,z.jsx)("span",{className:G.vendor,children:e.vendor}):null,(0,z.jsx)("span",{className:G.title,children:e.title}),e.price?(0,z.jsx)("span",{className:G.price,children:e.price}):null]})]})}var be=require("@magicx-eng/ai-autocomplete-vanilla"),De=require("react");var ot=require("@magicx-eng/ai-autocomplete-vanilla"),Re=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 {
|
|
949
989
|
.aia-grid {
|
|
950
990
|
display: grid;
|
|
951
991
|
grid-template-columns: repeat(
|
|
@@ -980,7 +1020,7 @@
|
|
|
980
1020
|
border-radius: 3px;
|
|
981
1021
|
}
|
|
982
1022
|
}
|
|
983
|
-
`,document.head.appendChild(e)}var
|
|
1023
|
+
`,document.head.appendChild(e)}var rt=require("react/jsx-runtime");function it({min:e="16rem",max:o,gap:a,scroll:n=!1,maxHeight:s,scrollResetKey:l,cols:r,className:u,children:g,...w}){let I=(0,Re.useRef)(null);(0,Re.useLayoutEffect)(()=>{if(l===void 0)return;let S=I.current;S&&(S.scrollTop=0)},[l]);let v={"--aia-grid-min":e};return o&&(v["--aia-grid-max"]=o),a&&(v["--aia-grid-gap"]=a),s&&(v["--aia-grid-max-height"]=s),r&&(v.gridTemplateColumns=(0,ot.optionsGridTemplateColumns)(r)),(0,rt.jsx)("div",{ref:I,className:u?`aia-grid ${u}`:"aia-grid","data-scroll":n||void 0,style:v,...w,children:g})}var fe=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 {
|
|
984
1024
|
position: relative;
|
|
985
1025
|
overflow: visible;
|
|
986
1026
|
display: flex;
|
|
@@ -988,16 +1028,16 @@
|
|
|
988
1028
|
the same baseline at the top edge of the cell. */
|
|
989
1029
|
align-items: flex-start;
|
|
990
1030
|
font-family: inherit;
|
|
991
|
-
font-size: var(--aia-option-font-size,
|
|
992
|
-
font-weight:
|
|
993
|
-
line-height:
|
|
1031
|
+
font-size: var(--aia-option-font-size, 16px);
|
|
1032
|
+
font-weight: 450;
|
|
1033
|
+
line-height: 21px;
|
|
994
1034
|
color: var(--aia-option-color, var(--aia-color-text-muted, #c1c4cb));
|
|
995
1035
|
white-space: normal;
|
|
996
1036
|
word-break: break-word;
|
|
997
1037
|
/* 8px radius on the highlighted fill (--aia-option-bg), matching the Figma
|
|
998
|
-
SuggestionItem selection. The
|
|
1038
|
+
SuggestionItem selection. The 9px/10px inset is the item's own padding. */
|
|
999
1039
|
border-radius: 8px;
|
|
1000
|
-
padding:
|
|
1040
|
+
padding: 8px 10px;
|
|
1001
1041
|
animation: SuggestionItem-module_fadeIn_I8u35 500ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
|
|
1002
1042
|
}
|
|
1003
1043
|
|
|
@@ -1330,7 +1370,7 @@
|
|
|
1330
1370
|
filter: brightness(0.55);
|
|
1331
1371
|
}
|
|
1332
1372
|
}
|
|
1333
|
-
`,document.head.appendChild(e)}var
|
|
1373
|
+
`,document.head.appendChild(e)}var K={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 de=require("react/jsx-runtime");function nt({option:e,isHighlighted:o,onSelect:a,onHighlight:n,id:s,loading:l}){let[r,u]=(0,fe.useState)(!1),g=(0,fe.useRef)(void 0);(0,fe.useEffect)(()=>()=>clearTimeout(g.current),[]);let w=()=>{l||!e.is_tappable||r||(u(!0),a(e),clearTimeout(g.current),g.current=setTimeout(()=>u(!1),500))},I=[K.item,o&&!l?K.highlighted:"",e.is_tappable?K.tappable:K.nonTappable,r?K.pressed:""].filter(Boolean).join(" ");return(0,de.jsxs)("div",{id:s,role:"option","data-aia-option":"","data-aia-loading":l?"":void 0,"aria-selected":o,className:I,tabIndex:l||!e.is_tappable?-1:0,onClick:w,onKeyDown:v=>{!l&&e.is_tappable&&(v.key==="Enter"||v.key===" ")&&(v.preventDefault(),w())},onMouseEnter:!l&&e.is_tappable?n:void 0,children:[(0,de.jsx)("div",{className:K.streaks}),(0,de.jsx)("div",{className:K.streaksVert}),(0,de.jsxs)("span",{className:K.content,children:[(0,de.jsx)("span",{className:K.text,children:e.icon?`${e.icon} ${e.text}`:e.text}),e.tag&&(0,de.jsx)("span",{className:K.tag,children:e.tag})]})]})}var Ve=require("react/jsx-runtime");function Dt(){let[e,o]=(0,De.useState)(be.isOptionsGridMobileViewport);return(0,De.useEffect)(()=>{if(typeof window>"u"||!window.matchMedia)return;let a=window.matchMedia(be.OPTIONS_GRID_MOBILE_QUERY),n=()=>o(a.matches);return n(),a.addEventListener("change",n),()=>a.removeEventListener("change",n)},[]),e}function st({options:e,activeIndex:o,onSelect:a,onHighlight:n,listboxId:s,loading:l,groupKey:r}){let u=Dt(),{cols:g,maxHeight:w}=(0,be.computeOptionsGridLayout)(e.length,u);return(0,Ve.jsx)(it,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:r,cols:g,maxHeight:w,children:e.map((I,v)=>(0,Ve.jsx)(nt,{option:I,isHighlighted:v===o,onSelect:a,onHighlight:()=>n(v),id:`${s}-option-${v}`,loading:l},I.text))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`@layer layout {
|
|
1334
1374
|
.aia-stack {
|
|
1335
1375
|
display: flex;
|
|
1336
1376
|
flex-direction: column;
|
|
@@ -1347,7 +1387,7 @@
|
|
|
1347
1387
|
}
|
|
1348
1388
|
/* data-align="stretch" is the flex default \u2014 no rule needed. */
|
|
1349
1389
|
}
|
|
1350
|
-
`,document.head.appendChild(e)}var
|
|
1390
|
+
`,document.head.appendChild(e)}var dt=require("react/jsx-runtime");function lt({space:e,align:o="stretch",className:a,children:n,...s}){let l=e?{"--aia-stack-space":e}:void 0;return(0,dt.jsx)("div",{className:a?`aia-stack ${a}`:"aia-stack","data-align":o,style:l,...s,children:n})}var W=require("react/jsx-runtime"),Tt=[159,119,164],Lt=()=>{};function zt(e){let o=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[a,n]=(0,ve.useState)(o);if((0,ve.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let s=window.matchMedia("(prefers-color-scheme: dark)"),l=()=>n(s.matches);return s.addEventListener("change",l),()=>s.removeEventListener("change",l)},[e]),e!==void 0)return e==="auto"?a?"dark":"light":e}function Te({suggestions:e,activeIndex:o,onSelect:a,onHighlight:n,isOpen:s,id:l,className:r,pills:u,onPillClick:g,showPills:w=!0,activeSelected:I=!1,isLoading:v=!1,isInputEmpty:S=!1,products:A,onProductSelect:Q,onProductFocusChange:X,optionsPosition:oe="below",mode:J}){let D=zt(J),y=D!==void 0,c=e[0]?.options??[],ie=!!(u&&u.length>0&&g),Z=!!(A&&A.length>0),F=s&&(c.length>0||w&&ie||v||Z),T={suggestions:e,activeIndex:o,pills:u,showPills:w,activeSelected:I,isLoading:v,isInputEmpty:S,products:A},R=(0,ve.useRef)(T);F&&(R.current=T);let f=F?T:R.current,M=f.suggestions[0],N=M?.options??[],L=f.activeIndex>=0&&!!N[f.activeIndex]?.is_tappable,V=!!(f.pills&&f.pills.length>0&&g),Y=f.showPills&&V,ee=f.showPills&&!V&&f.isLoading,$=Y||ee,H=N.length>0,re=f.isLoading&&!H,O=f.products??[];return(0,W.jsx)("div",{id:l,role:"listbox","data-aia-dropdown":"","data-options-position":oe,"data-mode":D,"data-aia-loading":f.isLoading?"":void 0,"data-aia-has-products":O.length>0?"":void 0,className:`${y?"magicx-aia ":""}${he.dropdown} ${F?he.visible:""} ${r??""}`,onMouseDown:t=>t.preventDefault(),children:(0,W.jsxs)(lt,{space:"8px",children:[$&&(0,W.jsx)(ye,{noWrap:!0,className:he.pillBar,"data-aia-pillbar":"",children:(0,W.jsx)(Ee,{pills:f.pills??[],activePillIndex:0,activeSelected:f.activeSelected,onSelectPill:g??(()=>{}),rounded:!0,loading:f.isLoading})}),H&&(0,W.jsx)(st,{options:N,activeIndex:f.activeIndex,onSelect:a,onHighlight:n,listboxId:l,loading:f.isLoading,groupKey:M?`${M.type} ${M.text}`:""}),re&&(0,W.jsx)("div",{className:he.skeletonBars,"data-aia-skeleton-bars":"",children:Tt.map(t=>(0,W.jsx)("span",{className:he.skeletonBar,style:{width:t}},`bar-${t}`))}),(0,W.jsx)(at,{products:O,listboxId:l,onSelect:Q??Lt,onFocusChange:X,focusable:F}),(0,W.jsx)(Ze,{isOptionHighlighted:L,isInputEmpty:f.isInputEmpty})]})})}var xe=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 {
|
|
1351
1391
|
flex-shrink: 0;
|
|
1352
1392
|
width: 32px;
|
|
1353
1393
|
height: 32px;
|
|
@@ -1382,5 +1422,5 @@
|
|
|
1382
1422
|
);
|
|
1383
1423
|
cursor: default;
|
|
1384
1424
|
}
|
|
1385
|
-
`,document.head.appendChild(e)}var st={submitButton:"SubmitButton-module_submitButton_otz7H"};var De=require("react/jsx-runtime");function lt({disabled:e,onClick:o}){return(0,De.jsx)("button",{type:"button","data-aia-submit":"",className:st.submitButton,disabled:e,onClick:i=>{i.stopPropagation(),o()},"aria-label":"Submit",children:(0,De.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,De.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var pt=require("@magicx-eng/ai-autocomplete-vanilla"),b=require("react");var Ue=require("react");function dt(e){let o=(0,Ue.useRef)(e);o.current=e;let i=(0,Ue.useRef)(null);i.current===null&&(i.current={fetch:(n,l)=>{let r=o.current;return r?r.fetch(n,l):Promise.reject(new Error("products config removed"))},transform:n=>o.current?.transform(n)??[],get limit(){return o.current?.limit}});let s=e!==void 0;return{config:s?i.current:void 0,enabled:s}}var Dt={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],products:[],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 Te({onSubmit:e,onError:o,optionOverrides:i,maskCompletedText:s,apiConfig:n,columns:l=2,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:x,onFocus:I,onBlur:P,value:R,completedParams:S,onChange:Q,onParamsChange:X,products:oe,onProductSelect:J,source:D,setCursor:w}){let p=(0,b.useRef)(null),[ie,Z]=(0,b.useState)(null),B=(0,b.useRef)(e);B.current=e;let T=(0,b.useRef)(o);T.current=o;let C=(0,b.useRef)(Q);C.current=Q;let f=(0,b.useRef)(X);f.current=X;let N=(0,b.useRef)(I);N.current=I;let H=(0,b.useRef)(P);H.current=P;let L=(0,b.useRef)(w);L.current=w;let V=(0,b.useRef)(J);V.current=J;let Y=dt(oe);(0,b.useEffect)(()=>{if(typeof document>"u")return;let d=new pt.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:n,optionOverrides:i,maskCompletedText:s,columns:l,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:x,source:D,value:R,completedParams:S,onSubmit:(..._)=>B.current?.(..._),onError:(..._)=>T.current?.(..._),onChange:(..._)=>C.current?.(..._),onParamsChange:(..._)=>f.current?.(..._),onFocus:()=>N.current?.(),onBlur:()=>H.current?.(),onProductSelect:_=>V.current?.(_),setCursor:_=>L.current?.(_),products:Y.config});p.current=d,Z(d.getState());let A=d.subscribe(_=>Z(_));return()=>{A(),d.destroy(),p.current===d&&(p.current=null)}},[]),(0,b.useEffect)(()=>{R!==void 0&&p.current?.setValue(R)},[R]),(0,b.useEffect)(()=>{S!==void 0&&p.current?.setCompletedParams(S)},[S]);let ee=JSON.stringify(n??null),$=(0,b.useRef)(i),O=(0,b.useRef)(0);if(i!==$.current){let d=$.current,A=i,_=Object.keys(d??{}),me=Object.keys(A??{});(_.length!==me.length||me.some(ne=>!d?.[ne]||A[ne]!==d[ne]))&&O.current++,$.current=i}(0,b.useEffect)(()=>{p.current?.update({apiConfig:n,optionOverrides:i,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:x})},[ee,O.current,r,u,g,x]);let re=(0,b.useRef)(!1);(0,b.useEffect)(()=>{if(!re.current){re.current=!0;return}p.current?.update({products:Y.config})},[Y.enabled]);let M=(0,b.useRef)(null);M.current===null&&(M.current={handleTextChange:d=>p.current?.handleTextChange(d),handleKeyDown:d=>{let A="nativeEvent"in d?d.nativeEvent:d;p.current?.handleKeyDown(A)},setFocused:d=>p.current?.setFocused(d),startEditingParam:d=>p.current?.startEditingParam(d),exitEditMode:()=>p.current?.exitEditMode(),handleCaretAfterInput:d=>p.current?.handleCaretAfterInput(d),handleCaretMove:d=>p.current?.handleCaretMove(d),replaceEditingRange:d=>p.current?.replaceEditingRange(d)??!1,setActivePill:d=>p.current?.setActivePill(d),removeLastParam:()=>p.current?.removeLastParam(),clearNewParamId:()=>p.current?.clearNewParamId(),reset:()=>p.current?.reset(),selectOption:d=>p.current?.selectOption(d),selectProduct:d=>p.current?.selectProduct(d),setActiveDropdownIndex:d=>p.current?.setActiveDropdownIndex(d),handleFocus:()=>p.current?.setFocused(!0),handleBlur:()=>p.current?.setFocused(!1)});let t=M.current,c=(0,b.useCallback)(d=>{let A=d.target.value,me=A.length>0&&!d.nativeEvent?.isComposing&&A[0]!==A[0].toUpperCase()?A[0].toUpperCase()+A.slice(1):A;p.current?.handleTextChange(me)},[]),m=(0,b.useCallback)(d=>{p.current?.handleKeyDown(d.nativeEvent)},[]),v=p.current,a=ie??Dt,E=R!==void 0?R:a.text,te=S!==void 0?S:a.completedParams,j=a.actionableSuggestions,ke=j[0],ue=v?.listboxId??"",Fe=a.activeDropdownIndex>=0&&v?`${ue}-option-${a.activeDropdownIndex}`:void 0,pe=a.editingParam,xe=pe?{type:pe.suggestionType,text:pe.suggestionPlaceholder,required:!0,options:pe.options}:null,_e=xe??ke,Be=xe?[xe]:j,Pe=!v||a.isLoading&&!a.editingParam&&!a.inSelectionAnimation;return{completedParams:te,skippedParams:a.skippedParams,suggestionPills:j,setActivePill:t.setActivePill,removeLastParam:t.removeLastParam,segments:a.segments,newParamId:a.newParamId,clearNewParamId:t.clearNewParamId,suggestions:a.suggestions,activeIndex:a.activeDropdownIndex,isReady:a.isReady,isLoading:Pe,isFocused:a.isFocused,isDropdownOpen:a.isDropdownOpen,isActivePillSelected:a.isActivePillSelected,placeholderText:a.placeholderText,listboxId:ue,error:a.error,products:a.products,selectProduct:t.selectProduct,handleTextChange:t.handleTextChange,handleKeyDown:t.handleKeyDown,setFocused:t.setFocused,editingParam:pe,editingAnchor:a.editingAnchor,caretOffset:a.caretOffset,startEditingParam:t.startEditingParam,exitEditMode:t.exitEditMode,handleCaretAfterInput:t.handleCaretAfterInput,handleCaretMove:t.handleCaretMove,replaceEditingRange:t.replaceEditingRange,inputProps:{value:E,placeholder:a.placeholderText||void 0,onChange:c,onKeyDown:m,onFocus:t.handleFocus,onBlur:t.handleBlur,role:"combobox","aria-expanded":a.isDropdownOpen,"aria-activedescendant":Fe,"aria-autocomplete":"list","aria-controls":ue},reset:t.reset,dropdownProps:{suggestions:_e?[{..._e,options:a.filteredOptions}]:[],activeIndex:a.activeDropdownIndex,onSelect:t.selectOption,onHighlight:t.setActiveDropdownIndex,isOpen:a.isDropdownOpen,id:ue,pills:Be,activeSelected:a.isActivePillSelected,onPillClick:t.setActivePill,isLoading:Pe,isInputEmpty:E.trim().length===0,products:a.products,onProductSelect:t.selectProduct,onProductFocusChange:t.setFocused,optionsPosition:u??"below"}}}var F=require("@magicx-eng/ai-autocomplete-vanilla"),h=require("react"),Le;function Tt(){if(Le!==void 0)return Le;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Le=e.contentEditable==="plaintext-only",Le}function ct(e){let{segments:o,newParamId:i,editingParam:s,editingAnchor:n,caretOffset:l,placeholderText:r,isFocused:u,isDropdownOpen:g,listboxId:x,activeDescendantId:I,autoFocus:P,handleTextChange:R,handleKeyDown:S,handleCaretAfterInput:Q,handleCaretMove:X,startEditingParam:oe,replaceEditingRange:J,setFocused:D}=e,w=(0,h.useRef)(null),p=(0,h.useRef)(!1),ie=(0,h.useRef)(""),Z=(0,h.useRef)(""),B=(0,h.useRef)(null),T=(0,h.useRef)(0);B.current=l,(0,h.useEffect)(()=>{if(!P)return;let t=w.current;if(!t)return;document.activeElement===t?D(!0):t.focus();let c=t.ownerDocument??document,m=c.getSelection(),v=m&&m.rangeCount>0&&t.contains(m.anchorNode);if(m&&!v){let a=c.createRange();a.selectNodeContents(t),a.collapse(!0),m.removeAllRanges(),m.addRange(a)}},[P,D]),(0,h.useEffect)(()=>{let t=w.current;if(!t)return;let c=t.ownerDocument??document,m=()=>{let v=c.getSelection();if(!v||v.rangeCount===0||!v.anchorNode||!t.contains(v.anchorNode))return;let a=v.anchorNode,j=(a.nodeType===Node.ELEMENT_NODE?a:a.parentElement)?.closest('strong[data-seg="completed"][data-param-id]')?.dataset.paramId??null;if(j&&j!==s?.id){oe(j);return}performance.now()-T.current<50||X((0,F.getCursorOffset)(t))};return c.addEventListener("selectionchange",m),()=>c.removeEventListener("selectionchange",m)},[s,oe,X]),(0,h.useLayoutEffect)(()=>{let t=w.current;t&&(0,F.renderEditableContent)({input:t,segments:o,newParamId:i,editingParamId:s?.id??null,placeholderText:r??"",isFocused:u})},[o,i,s,r,u]),(0,h.useLayoutEffect)(()=>{let t=ie.current,c=i??"";if(ie.current=c,!c||c===t)return;let m=w.current;if(!m)return;m.focus();let v=B.current??(0,F.plainTextLength)(m);(0,F.setCursorOffset)(m,v)},[i]),(0,h.useLayoutEffect)(()=>{let t=Z.current,c=s?.id??"";if(Z.current=c,!c||c===t||n==null)return;let m=w.current;m&&(0,F.setCursorOffset)(m,n)},[s,n]);let C=(0,h.useCallback)(()=>{if(p.current)return;let t=w.current;if(!t)return;let c=(0,F.extractPlainText)(t),v=c.length>0&&c[0]!==c[0].toUpperCase()?c[0].toUpperCase()+c.slice(1):c;R(v)},[R]),f=(0,h.useCallback)(()=>{T.current=performance.now(),C();let t=w.current;t&&Q((0,F.getCursorOffset)(t))},[C,Q]);(0,h.useEffect)(()=>{let t=w.current;if(!t)return;let c=m=>{let v=m,a=v.inputType;if(a==="insertParagraph"||a==="insertLineBreak"||a==="insertFromDrop"){m.preventDefault();return}if(a.startsWith("insert")||a.startsWith("delete")){let E=a.startsWith("delete")?"":v.data??"";J(E)&&m.preventDefault()}};return t.addEventListener("beforeinput",c),()=>t.removeEventListener("beforeinput",c)},[J]);let N=(0,h.useCallback)(()=>{p.current=!0},[]),H=(0,h.useCallback)(()=>{p.current=!1,C()},[C]),L=(0,h.useCallback)(t=>{t.preventDefault();let c=w.current;if(!c)return;let m=(t.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!m)return;let v=c.ownerDocument??document,a=v.getSelection();if(!a||a.rangeCount===0)return;let E=a.getRangeAt(0);if(!c.contains(E.startContainer))return;E.deleteContents();let te=v.createTextNode(m);E.insertNode(te),E.setStartAfter(te),E.collapse(!0),a.removeAllRanges(),a.addRange(E),C()},[C]),V=(0,h.useCallback)(t=>S(t),[S]),Y=(0,h.useCallback)(()=>D(!0),[D]),ee=(0,h.useCallback)(()=>D(!1),[D]),$=(0,h.useCallback)(()=>w.current?.focus(),[]),O=(0,h.useCallback)(()=>w.current?.blur(),[]),re=(0,h.useCallback)(()=>{let t=w.current;return t?(0,F.extractPlainText)(t):""},[]),M=Tt()?"plaintext-only":"true";return{inputRef:w,editorProps:{ref:w,contentEditable:M,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":x,"aria-expanded":g,"aria-activedescendant":I,spellCheck:!0,enterKeyHint:"send",onInput:f,onKeyDown:V,onCompositionStart:N,onCompositionEnd:H,onPaste:L,onFocus:Y,onBlur:ee},getPlainText:re,focus:$,blur:O}}var U=require("react/jsx-runtime");function Lt(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var ut=(0,k.forwardRef)(function({onSubmit:o,onError:i,optionOverrides:s,maskCompletedText:n,className:l,apiConfig:r,columns:u,pillPlacement:g="dropdown",mode:x="auto",optionsPosition:I="below",animations:P=!0,dropdownTrigger:R,closeDropdownOnBlur:S,showNonTappableOptions:Q,autoFocus:X=!0,onFocus:oe,onBlur:J,value:D,completedParams:w,onChange:p,onParamsChange:ie,products:Z,onProductSelect:B,submitButton:T},C){let f=(0,k.useRef)(null),N=(0,k.useRef)(null),H=(0,k.useRef)(()=>{}),L=(0,k.useRef)(null),V=(0,k.useRef)(null);(0,k.useEffect)(()=>{let y=f.current;if(y)return L.current?L.current.setMode(x):L.current=new ve.ModeController(y,x),()=>{L.current?.destroy(),L.current=null}},[x]);let Y=(0,k.useCallback)(y=>{let se=V.current?.current;se&&(se.focus(),(0,ve.setCursorOffset)(se,y))},[]),{completedParams:ee,skippedParams:$,suggestionPills:O,setActivePill:re,segments:M,newParamId:t,clearNewParamId:c,placeholderText:m,isFocused:v,isDropdownOpen:a,isActivePillSelected:E,isLoading:te,activeIndex:j,listboxId:ke,handleTextChange:ue,handleKeyDown:Fe,setFocused:pe,editingParam:xe,editingAnchor:_e,caretOffset:Be,startEditingParam:Pe,handleCaretAfterInput:d,handleCaretMove:A,replaceEditingRange:_,dropdownProps:me,reset:ne}=Te({onSubmit:y=>H.current(y),onError:i,optionOverrides:s,maskCompletedText:n,apiConfig:r,columns:u,dropdownTrigger:R,optionsPosition:I,closeDropdownOnBlur:S,showNonTappableOptions:Q,onFocus:oe,onBlur:J,value:D,completedParams:w,onChange:p,onParamsChange:ie,products:Z,onProductSelect:B,source:"full-sdk",setCursor:Y});(0,k.useEffect)(()=>{if(!t)return;let y=window.setTimeout(()=>c(),650);return()=>window.clearTimeout(y)},[t,c]);let mt=j>=0?`${ke}-option-${j}`:void 0,{inputRef:Ne,editorProps:gt,focus:Ie,blur:Ve,getPlainText:$e}=ct({segments:M,newParamId:t,editingParam:xe,editingAnchor:_e,caretOffset:Be,placeholderText:m,isFocused:v,isDropdownOpen:a,listboxId:ke,activeDescendantId:mt,autoFocus:X,handleTextChange:ue,handleKeyDown:Fe,handleCaretAfterInput:d,handleCaretMove:A,startEditingParam:Pe,replaceEditingRange:_,setFocused:pe});V.current=Ne,(0,k.useLayoutEffect)(()=>{let y=N.current,se=Ne.current;if(!y||!se)return;let je=()=>{let Qe=y.firstElementChild;if(!Qe)return;let vt=Qe.getBoundingClientRect(),xt=se.getBoundingClientRect();vt.top>=xt.bottom-2?y.setAttribute("data-aia-pill-wrapped",""):y.removeAttribute("data-aia-pill-wrapped")};je();let qe=new ResizeObserver(je);return qe.observe(se),()=>qe.disconnect()},[M,O.length,te,Ne]),(0,k.useImperativeHandle)(C,()=>({focus:Ie,blur:Ve,reset:ne,setMode:y=>L.current?.setMode(y)}),[Ie,Ve,ne]);let Se=!!M.length||ee.length>0,Me=(0,k.useCallback)(()=>{if(!Se)return;let y=$e();o((0,ve.buildSubmitResult)(y,ee,$)),ne()},[Se,ee,$,o,ne,$e]);H.current=Me;let ht=(0,k.useCallback)(y=>{y.target?.closest("[data-aia-pill]")||Ie()},[Ie]),ft=g==="inline",bt=g==="dropdown";return(0,U.jsxs)("div",{ref:f,className:`magicx-aia ${ce.container} ${l??""}`,"data-pill-placement":g,"data-options-position":I,"data-animations":P?"on":"off","data-mode":Lt(x),children:[(0,U.jsx)(Re,{...me,showPills:bt}),(0,U.jsxs)("div",{className:ce.inputWrapper,onClick:ht,children:[(0,U.jsxs)("div",{className:ce.editorArea,"data-aia-editor":"",children:[(0,U.jsx)("div",{...gt,className:ce.input,"data-aia-input":""}),ft&&(te||O.length>0)&&(0,U.jsx)("span",{ref:N,className:ce.pillListContainer,"data-aia-pill-list-container":"",children:(0,U.jsx)(Ce,{pills:O,activePillIndex:0,activeSelected:E,onSelectPill:re,loading:te})})]}),T===null?null:T===void 0?(0,U.jsx)(lt,{disabled:!Se,onClick:Me}):(0,U.jsx)("span",{"data-aia-submit":"",className:ce.submitSlot,onClick:y=>{Se&&(y.stopPropagation(),Me())},children:T})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,buildSubmitResult,useAIAutocomplete,withSkippedParams});
|
|
1425
|
+
`,document.head.appendChild(e)}var ct={submitButton:"SubmitButton-module_submitButton_otz7H"};var Le=require("react/jsx-runtime");function pt({disabled:e,onClick:o}){return(0,Le.jsx)("button",{type:"button","data-aia-submit":"",className:ct.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),o()},"aria-label":"Submit",children:(0,Le.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,Le.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var mt=require("@magicx-eng/ai-autocomplete-vanilla"),b=require("react");var $e=require("react");function ut(e){let o=(0,$e.useRef)(e);o.current=e;let a=(0,$e.useRef)(null);a.current===null&&(a.current={fetch:(s,l)=>{let r=o.current;return r?r.fetch(s,l):Promise.reject(new Error("products config removed"))},transform:s=>o.current?.transform(s)??[],get limit(){return o.current?.limit}});let n=e!==void 0;return{config:n?a.current:void 0,enabled:n}}var Bt={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],products:[],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 ze({onSubmit:e,onError:o,optionOverrides:a,maskCompletedText:n,apiConfig:s,columns:l=2,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:w,onFocus:I,onBlur:v,value:S,completedParams:A,onChange:Q,onParamsChange:X,products:oe,onProductSelect:J,source:D,setCursor:y}){let c=(0,b.useRef)(null),[ie,Z]=(0,b.useState)(null),F=(0,b.useRef)(e);F.current=e;let T=(0,b.useRef)(o);T.current=o;let R=(0,b.useRef)(Q);R.current=Q;let f=(0,b.useRef)(X);f.current=X;let M=(0,b.useRef)(I);M.current=I;let N=(0,b.useRef)(v);N.current=v;let L=(0,b.useRef)(y);L.current=y;let V=(0,b.useRef)(J);V.current=J;let Y=ut(oe);(0,b.useEffect)(()=>{if(typeof document>"u")return;let d=new mt.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:s,optionOverrides:a,maskCompletedText:n,columns:l,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:w,source:D,value:S,completedParams:A,onSubmit:(...P)=>F.current?.(...P),onError:(...P)=>T.current?.(...P),onChange:(...P)=>R.current?.(...P),onParamsChange:(...P)=>f.current?.(...P),onFocus:()=>M.current?.(),onBlur:()=>N.current?.(),onProductSelect:P=>V.current?.(P),setCursor:P=>L.current?.(P),products:Y.config});c.current=d,Z(d.getState());let E=d.subscribe(P=>Z(P));return()=>{E(),d.destroy(),c.current===d&&(c.current=null)}},[]),(0,b.useEffect)(()=>{S!==void 0&&c.current?.setValue(S)},[S]),(0,b.useEffect)(()=>{A!==void 0&&c.current?.setCompletedParams(A)},[A]);let ee=JSON.stringify(s??null),$=(0,b.useRef)(a),H=(0,b.useRef)(0);if(a!==$.current){let d=$.current,E=a,P=Object.keys(d??{}),me=Object.keys(E??{});(P.length!==me.length||me.some(ne=>!d?.[ne]||E[ne]!==d[ne]))&&H.current++,$.current=a}(0,b.useEffect)(()=>{c.current?.update({apiConfig:s,optionOverrides:a,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:w})},[ee,H.current,r,u,g,w]);let re=(0,b.useRef)(!1);(0,b.useEffect)(()=>{if(!re.current){re.current=!0;return}c.current?.update({products:Y.config})},[Y.enabled]);let O=(0,b.useRef)(null);O.current===null&&(O.current={handleTextChange:d=>c.current?.handleTextChange(d),handleKeyDown:d=>{let E="nativeEvent"in d?d.nativeEvent:d;c.current?.handleKeyDown(E)},setFocused:d=>c.current?.setFocused(d),startEditingParam:d=>c.current?.startEditingParam(d),exitEditMode:()=>c.current?.exitEditMode(),handleCaretAfterInput:d=>c.current?.handleCaretAfterInput(d),handleCaretMove:d=>c.current?.handleCaretMove(d),replaceEditingRange:d=>c.current?.replaceEditingRange(d)??!1,setActivePill:d=>c.current?.setActivePill(d),removeLastParam:()=>c.current?.removeLastParam(),clearNewParamId:()=>c.current?.clearNewParamId(),reset:()=>c.current?.reset(),selectOption:d=>c.current?.selectOption(d),selectProduct:d=>c.current?.selectProduct(d),setActiveDropdownIndex:d=>c.current?.setActiveDropdownIndex(d),handleFocus:()=>c.current?.setFocused(!0),handleBlur:()=>c.current?.setFocused(!1)});let t=O.current,p=(0,b.useCallback)(d=>{let E=d.target.value,me=E.length>0&&!d.nativeEvent?.isComposing&&E[0]!==E[0].toUpperCase()?E[0].toUpperCase()+E.slice(1):E;c.current?.handleTextChange(me)},[]),m=(0,b.useCallback)(d=>{c.current?.handleKeyDown(d.nativeEvent)},[]),x=c.current,i=ie??Bt,C=S!==void 0?S:i.text,te=A!==void 0?A:i.completedParams,q=i.actionableSuggestions,_e=q[0],ue=x?.listboxId??"",Me=i.activeDropdownIndex>=0&&x?`${ue}-option-${i.activeDropdownIndex}`:void 0,ce=i.editingParam,we=ce?{type:ce.suggestionType,text:ce.suggestionPlaceholder,required:!0,options:ce.options}:null,Pe=we??_e,Oe=we?[we]:q,Ie=!x||i.isLoading&&!i.editingParam&&!i.inSelectionAnimation;return{completedParams:te,skippedParams:i.skippedParams,suggestionPills:q,setActivePill:t.setActivePill,removeLastParam:t.removeLastParam,segments:i.segments,newParamId:i.newParamId,clearNewParamId:t.clearNewParamId,suggestions:i.suggestions,activeIndex:i.activeDropdownIndex,isReady:i.isReady,isLoading:Ie,isFocused:i.isFocused,isDropdownOpen:i.isDropdownOpen,isActivePillSelected:i.isActivePillSelected,placeholderText:i.placeholderText,listboxId:ue,error:i.error,products:i.products,selectProduct:t.selectProduct,handleTextChange:t.handleTextChange,handleKeyDown:t.handleKeyDown,setFocused:t.setFocused,editingParam:ce,editingAnchor:i.editingAnchor,caretOffset:i.caretOffset,startEditingParam:t.startEditingParam,exitEditMode:t.exitEditMode,handleCaretAfterInput:t.handleCaretAfterInput,handleCaretMove:t.handleCaretMove,replaceEditingRange:t.replaceEditingRange,inputProps:{value:C,placeholder:i.placeholderText||void 0,onChange:p,onKeyDown:m,onFocus:t.handleFocus,onBlur:t.handleBlur,role:"combobox","aria-expanded":i.isDropdownOpen,"aria-activedescendant":Me,"aria-autocomplete":"list","aria-controls":ue},reset:t.reset,dropdownProps:{suggestions:Pe?[{...Pe,options:i.filteredOptions}]:[],activeIndex:i.activeDropdownIndex,onSelect:t.selectOption,onHighlight:t.setActiveDropdownIndex,isOpen:i.isDropdownOpen,id:ue,pills:Oe,activeSelected:i.isActivePillSelected,onPillClick:t.setActivePill,isLoading:Ie,isInputEmpty:C.trim().length===0,products:i.products,onProductSelect:t.selectProduct,onProductFocusChange:t.setFocused,optionsPosition:u??"below"}}}var B=require("@magicx-eng/ai-autocomplete-vanilla"),h=require("react"),Be;function Ft(){if(Be!==void 0)return Be;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Be=e.contentEditable==="plaintext-only",Be}function ht(e){let{segments:o,newParamId:a,editingParam:n,editingAnchor:s,caretOffset:l,placeholderText:r,isFocused:u,isDropdownOpen:g,listboxId:w,activeDescendantId:I,autoFocus:v,handleTextChange:S,handleKeyDown:A,handleCaretAfterInput:Q,handleCaretMove:X,startEditingParam:oe,replaceEditingRange:J,setFocused:D}=e,y=(0,h.useRef)(null),c=(0,h.useRef)(!1),ie=(0,h.useRef)(""),Z=(0,h.useRef)(""),F=(0,h.useRef)(null),T=(0,h.useRef)(0);F.current=l,(0,h.useEffect)(()=>{if(!v)return;let t=y.current;if(!t)return;document.activeElement===t?D(!0):t.focus();let p=t.ownerDocument??document,m=p.getSelection(),x=m&&m.rangeCount>0&&t.contains(m.anchorNode);if(m&&!x){let i=p.createRange();i.selectNodeContents(t),i.collapse(!0),m.removeAllRanges(),m.addRange(i)}},[v,D]),(0,h.useEffect)(()=>{let t=y.current;if(!t)return;let p=t.ownerDocument??document,m=()=>{let x=p.getSelection();if(!x||x.rangeCount===0||!x.anchorNode||!t.contains(x.anchorNode))return;let i=x.anchorNode,C=i.nodeType===Node.ELEMENT_NODE?i:i.parentElement,q=(x.isCollapsed?C?.closest('strong[data-seg="completed"][data-param-id]'):null)?.dataset.paramId??null;if(q&&q!==n?.id){oe(q);return}performance.now()-T.current<50||X((0,B.getCursorOffset)(t))};return p.addEventListener("selectionchange",m),()=>p.removeEventListener("selectionchange",m)},[n,oe,X]),(0,h.useLayoutEffect)(()=>{let t=y.current;t&&(0,B.renderEditableContent)({input:t,segments:o,newParamId:a,editingParamId:n?.id??null,placeholderText:r??"",isFocused:u})},[o,a,n,r,u]),(0,h.useLayoutEffect)(()=>{let t=ie.current,p=a??"";if(ie.current=p,!p||p===t)return;let m=y.current;if(!m)return;m.focus();let x=F.current??(0,B.plainTextLength)(m);(0,B.setCursorOffset)(m,x)},[a]),(0,h.useLayoutEffect)(()=>{let t=Z.current,p=n?.id??"";if(Z.current=p,!p||p===t||s==null)return;let m=y.current;m&&(0,B.setCursorOffset)(m,s)},[n,s]);let R=(0,h.useCallback)(()=>{if(c.current)return;let t=y.current;if(!t)return;let p=(0,B.extractPlainText)(t),x=p.length>0&&p[0]!==p[0].toUpperCase()?p[0].toUpperCase()+p.slice(1):p;S(x)},[S]),f=(0,h.useCallback)(()=>{T.current=performance.now(),R();let t=y.current;t&&Q((0,B.getCursorOffset)(t))},[R,Q]);(0,h.useEffect)(()=>{let t=y.current;if(!t)return;let p=m=>{let x=m,i=x.inputType;if(i==="insertParagraph"||i==="insertLineBreak"||i==="insertFromDrop"){m.preventDefault();return}if(i.startsWith("insert")||i.startsWith("delete")){let C=i.startsWith("delete")?"":x.data??"";J(C)&&m.preventDefault()}};return t.addEventListener("beforeinput",p),()=>t.removeEventListener("beforeinput",p)},[J]);let M=(0,h.useCallback)(()=>{c.current=!0},[]),N=(0,h.useCallback)(()=>{c.current=!1,R()},[R]),L=(0,h.useCallback)(t=>{t.preventDefault();let p=y.current;if(!p)return;let m=(t.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!m)return;let x=p.ownerDocument??document,i=x.getSelection();if(!i||i.rangeCount===0)return;let C=i.getRangeAt(0);if(!p.contains(C.startContainer))return;C.deleteContents();let te=x.createTextNode(m);C.insertNode(te),C.setStartAfter(te),C.collapse(!0),i.removeAllRanges(),i.addRange(C),R()},[R]),V=(0,h.useCallback)(t=>A(t),[A]),Y=(0,h.useCallback)(()=>D(!0),[D]),ee=(0,h.useCallback)(()=>D(!1),[D]),$=(0,h.useCallback)(()=>y.current?.focus(),[]),H=(0,h.useCallback)(()=>y.current?.blur(),[]),re=(0,h.useCallback)(()=>{let t=y.current;return t?(0,B.extractPlainText)(t):""},[]),O=Ft()?"plaintext-only":"true";return{inputRef:y,editorProps:{ref:y,contentEditable:O,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":w,"aria-expanded":g,"aria-activedescendant":I,spellCheck:!0,enterKeyHint:"send",onInput:f,onKeyDown:V,onCompositionStart:M,onCompositionEnd:N,onPaste:L,onFocus:Y,onBlur:ee},getPlainText:re,focus:$,blur:H}}var U=require("react/jsx-runtime");function Mt(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var gt=(0,_.forwardRef)(function({onSubmit:o,onError:a,optionOverrides:n,maskCompletedText:s,className:l,apiConfig:r,columns:u,pillPlacement:g="dropdown",mode:w="auto",optionsPosition:I="below",animations:v=!0,dropdownTrigger:S,closeDropdownOnBlur:A,showNonTappableOptions:Q,autoFocus:X=!0,onFocus:oe,onBlur:J,value:D,completedParams:y,onChange:c,onParamsChange:ie,products:Z,onProductSelect:F,submitButton:T},R){let f=(0,_.useRef)(null),M=(0,_.useRef)(null),N=(0,_.useRef)(()=>{}),L=(0,_.useRef)(null),V=(0,_.useRef)(null);(0,_.useEffect)(()=>{let k=f.current;if(k)return L.current?L.current.setMode(w):L.current=new xe.ModeController(k,w),()=>{L.current?.destroy(),L.current=null}},[w]);let Y=(0,_.useCallback)(k=>{let se=V.current?.current;se&&(se.focus(),(0,xe.setCursorOffset)(se,k))},[]),{completedParams:ee,skippedParams:$,suggestionPills:H,setActivePill:re,segments:O,newParamId:t,clearNewParamId:p,placeholderText:m,isFocused:x,isDropdownOpen:i,isActivePillSelected:C,isLoading:te,activeIndex:q,listboxId:_e,handleTextChange:ue,handleKeyDown:Me,setFocused:ce,editingParam:we,editingAnchor:Pe,caretOffset:Oe,startEditingParam:Ie,handleCaretAfterInput:d,handleCaretMove:E,replaceEditingRange:P,dropdownProps:me,reset:ne}=ze({onSubmit:k=>N.current(k),onError:a,optionOverrides:n,maskCompletedText:s,apiConfig:r,columns:u,dropdownTrigger:S,optionsPosition:I,closeDropdownOnBlur:A,showNonTappableOptions:Q,onFocus:oe,onBlur:J,value:D,completedParams:y,onChange:c,onParamsChange:ie,products:Z,onProductSelect:F,source:"full-sdk",setCursor:Y});(0,_.useEffect)(()=>{if(!t)return;let k=window.setTimeout(()=>p(),650);return()=>window.clearTimeout(k)},[t,p]);let ft=q>=0?`${_e}-option-${q}`:void 0,{inputRef:Ne,editorProps:bt,focus:Se,blur:qe,getPlainText:je}=ht({segments:O,newParamId:t,editingParam:we,editingAnchor:Pe,caretOffset:Oe,placeholderText:m,isFocused:x,isDropdownOpen:i,listboxId:_e,activeDescendantId:ft,autoFocus:X,handleTextChange:ue,handleKeyDown:Me,handleCaretAfterInput:d,handleCaretMove:E,startEditingParam:Ie,replaceEditingRange:P,setFocused:ce});V.current=Ne,(0,_.useLayoutEffect)(()=>{let k=M.current,se=Ne.current;if(!k||!se)return;let Qe=()=>{let Je=k.firstElementChild;if(!Je)return;let yt=Je.getBoundingClientRect(),kt=se.getBoundingClientRect();yt.top>=kt.bottom-2?k.setAttribute("data-aia-pill-wrapped",""):k.removeAttribute("data-aia-pill-wrapped")};Qe();let Xe=new ResizeObserver(Qe);return Xe.observe(se),()=>Xe.disconnect()},[O,H.length,te,Ne]),(0,_.useImperativeHandle)(R,()=>({focus:Se,blur:qe,reset:ne,setMode:k=>L.current?.setMode(k)}),[Se,qe,ne]);let Ae=!!O.length||ee.length>0,He=(0,_.useCallback)(()=>{if(!Ae)return;let k=je();o((0,xe.buildSubmitResult)(k,ee,$)),ne()},[Ae,ee,$,o,ne,je]);N.current=He;let vt=(0,_.useCallback)(k=>{k.target?.closest("[data-aia-pill]")||Se()},[Se]),xt=g==="inline",wt=g==="dropdown";return(0,U.jsxs)("div",{ref:f,className:`magicx-aia ${pe.container} ${l??""}`,"data-pill-placement":g,"data-options-position":I,"data-animations":v?"on":"off","data-mode":Mt(w),children:[(0,U.jsx)(Te,{...me,showPills:wt}),(0,U.jsxs)("div",{className:pe.inputWrapper,onClick:vt,children:[(0,U.jsxs)("div",{className:pe.editorArea,"data-aia-editor":"",children:[(0,U.jsx)("div",{...bt,className:pe.input,"data-aia-input":""}),xt&&(te||H.length>0)&&(0,U.jsx)("span",{ref:M,className:pe.pillListContainer,"data-aia-pill-list-container":"",children:(0,U.jsx)(Ee,{pills:H,activePillIndex:0,activeSelected:C,onSelectPill:re,loading:te})})]}),T===null?null:T===void 0?(0,U.jsx)(pt,{disabled:!Ae,onClick:He}):(0,U.jsx)("span",{"data-aia-submit":"",className:pe.submitSlot,onClick:k=>{Ae&&(k.stopPropagation(),He())},children:T})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,buildSubmitResult,useAIAutocomplete,withSkippedParams});
|
|
1386
1426
|
//# sourceMappingURL=index.js.map
|