@magicx-eng/ai-autocomplete-react 0.29.2 → 0.29.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/README.md +1 -1
- package/dist/index.js +19 -18
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +23 -22
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -288,7 +288,7 @@ Skip `<AIAutocompleteDropdown />` and render the suggestions UI yourself. `dropd
|
|
|
288
288
|
|
|
289
289
|
> **Option icons.** An option may carry an icon: `icon_svg` is inline SVG markup and `icon` its name. The built-in dropdown draws the SVG before the option's text, in the text color, and hides it while the row shows its loading skeleton. When rendering options yourself, pass `icon_svg` through the exported `sanitizeOptionIconSvg` before inserting it — it reduces the markup to plain vector drawing and returns `null` for anything else — and use `optionLabel(option)` for the text — it is the option's `text` alone; `icon` is the icon's name and is never shown as text, even when `icon_svg` is missing or fails to draw. A picked option's `icon` / `icon_svg` are copied onto its completed parameter, and the chip in the input draws the glyph before its text. Both surfaces can be switched off: `showOptionIcons: false` renders option rows as text only and `showChipIcons: false` renders chips as text only; either way the icon element is omitted rather than hidden.
|
|
290
290
|
|
|
291
|
-
> **Option pictures and counts.** An option may also carry `image_url` — a picture of the best-matching catalog item offering it — and `item_count`, how many items offer it (each is present only when the server includes it; when it includes counts, the options also arrive ordered by them, most items first; a starting state carries pictures but no counts). The built-in dropdown draws the picture as a square thumbnail before the option's text (in place of its `icon_svg`, so a row never leads with two visuals) and the count as a muted label at the row's trailing edge (`"12 items"`); a skeleton row keeps the tile's placeholder fill and hides the count. The unit word after the number is a token: set `--aia-option-count-unit: "sneakers"` to name what is being counted, `--aia-option-count-unit-one: "sneaker"` for a count of 1 (it falls back to the plural token), or `--aia-option-count-unit: ""` for the number alone. When rendering options yourself, pass `image_url` through the exported `optionImageSrc` before using it as an `<img src>` — it returns the URL only when it is `http(s)` and `null` otherwise — and `formatOptionCount(option.item_count)` gives the number the built-in rows print (`null` when there is no count); `optionCountLabel(count, unit?)` appends a unit for a dropdown that prints the word itself (`"item"` / `"items"` by default; one word, a `{ one, other }` pair, or `""` for none). Both surfaces can be switched off: `showOptionImages: false` renders rows without pictures (an option's icon then draws instead) and `showOptionCounts: false` hides the counts. A picked option's `image_url` is copied onto its completed parameter too, and the chip in the input draws it as a small rounded tile before its text, in place of the icon; `showChipImages: false` renders chips without pictures (the icon then draws instead). The tile is sized by `--aia-option-image-size` (40px), rounded by `--aia-option-image-radius` (12px), spaced by `--aia-option-image-gap` (12px) and filled by `--aia-option-image-bg` (default: `--aia-skeleton-bg`) while its picture loads; the count reads `--aia-option-count-font-size` (12px), `--aia-option-count-color` and `--aia-option-count-opacity` (0.6); the chip's tile reads `--aia-chip-image-size` (1.25em of the chip's font), `--aia-chip-image-radius` (4px) and `--aia-chip-image-bg` (default: `--aia-skeleton-bg`).
|
|
291
|
+
> **Option pictures and counts.** An option may also carry `image_url` — a picture of the best-matching catalog item offering it — and `item_count`, how many items offer it (each is present only when the server includes it; when it includes counts, the options also arrive ordered by them, most items first; a starting state carries pictures but no counts). The built-in dropdown draws the picture as a square thumbnail before the option's text (in place of its `icon_svg`, so a row never leads with two visuals) and the count as a muted label at the row's trailing edge (`"12 items"`); a skeleton row keeps the tile's placeholder fill and hides the count. The unit word after the number is a token: set `--aia-option-count-unit: "sneakers"` to name what is being counted, `--aia-option-count-unit-one: "sneaker"` for a count of 1 (it falls back to the plural token), or `--aia-option-count-unit: ""` for the number alone. When rendering options yourself, pass `image_url` through the exported `optionImageSrc` before using it as an `<img src>` — it returns the URL only when it is `http(s)` and `null` otherwise — and `formatOptionCount(option.item_count)` gives the number the built-in rows print (`null` when there is no count); `optionCountLabel(count, unit?)` appends a unit for a dropdown that prints the word itself (`"item"` / `"items"` by default; one word, a `{ one, other }` pair, or `""` for none). Both surfaces can be switched off: `showOptionImages: false` renders rows without pictures (an option's icon then draws instead) and `showOptionCounts: false` hides the counts. A picked option's `image_url` is copied onto its completed parameter too, and the chip in the input draws it as a small rounded tile before its text, in place of the icon; `showChipImages: false` renders chips without pictures (the icon then draws instead). The tile is sized by `--aia-option-image-size` (40px), rounded by `--aia-option-image-radius` (12px), spaced by `--aia-option-image-gap` (12px) and filled by `--aia-option-image-bg` (default: `--aia-skeleton-bg`) while its picture loads; in a grid with pictures, an icon row draws its glyph at `--aia-option-tile-icon-size` (1.5em) so it holds the picture column; the count reads `--aia-option-count-font-size` (12px), `--aia-option-count-color` and `--aia-option-count-opacity` (0.6); the chip's tile reads `--aia-chip-image-size` (1.25em of the chip's font), `--aia-chip-image-radius` (4px) and `--aia-chip-image-bg` (default: `--aia-skeleton-bg`).
|
|
292
292
|
|
|
293
293
|
```tsx
|
|
294
294
|
import { useAIAutocomplete } from "@magicx-eng/ai-autocomplete-react";
|
package/dist/index.js
CHANGED
|
@@ -262,7 +262,7 @@
|
|
|
262
262
|
opacity: 0;
|
|
263
263
|
}
|
|
264
264
|
}
|
|
265
|
-
`,document.head.appendChild(e)}var
|
|
265
|
+
`,document.head.appendChild(e)}var Me={container:"aia-container-KKjFU",inputWrapper:"aia-inputWrapper-FLq1b",editorArea:"aia-editorArea-7rBWq",input:"aia-input-IW-P-",pillListContainer:"aia-pillListContainer-h92IA",submitSlot:"aia-submitSlot-GhuCM",aiaPillReveal:"aia-aiaPillReveal-wf05b"};var Oe=require("@magicx-eng/ai-autocomplete-vanilla"),$=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
|
|
266
266
|
* Built-in appearance defaults \u2014 zero specificity via :where().
|
|
267
267
|
* Consumer CSS always wins without !important.
|
|
268
268
|
*
|
|
@@ -1204,7 +1204,7 @@
|
|
|
1204
1204
|
opacity: 0.8;
|
|
1205
1205
|
background: rgba(var(--aia-streak-rgb, 255, 255, 255), 0.06);
|
|
1206
1206
|
}
|
|
1207
|
-
`,document.head.appendChild(e)}var
|
|
1207
|
+
`,document.head.appendChild(e)}var M={datepicker:"aia-datepicker-6RrTs",header:"aia-header-z4LRk",month:"aia-month-urB2T",nav:"aia-nav-ap4AN",weekdays:"aia-weekdays-3EA3q",grid:"aia-grid-mQCgw",weekday:"aia-weekday-3lF4B",cell:"aia-cell-59k0y",number:"aia-number-aoT01",day:"aia-day-cB3u9",blank:"aia-blank-ivgRC",past:"aia-past-CEZsj",highlighted:"aia-highlighted-YIdtK",today:"aia-today-iI3ME",inRange:"aia-inRange-r9S2q",selected:"aia-selected-28KDn",pressed:"aia-pressed-bEyyN"};var U=require("react/jsx-runtime"),oa=["sunday","monday","tuesday","wednesday","thursday","friday","saturday"];function wt({options:e,activeIndex:a,listboxId:t,view:n,selection:i,onSelect:r,onHighlight:o,onUnhighlight:d,onPreviousMonth:x,onNextMonth:v}){let w=(0,N.isoDate)(new Date),S=(0,N.visibleDateRange)({pendingStart:i.rangeStart,highlightedIso:(0,N.cellIso)(e[a]),selected:i.selectedRange});return(0,U.jsxs)("div",{className:M.datepicker,"data-aia-datepicker":"",children:[(0,U.jsxs)("div",{className:M.header,children:[(0,U.jsx)("button",{type:"button",tabIndex:-1,className:M.nav,"data-aia-date-prev":"","aria-label":"Previous month",onMouseDown:f=>f.preventDefault(),onClick:x,children:"\u2039"}),(0,U.jsx)("span",{className:M.month,"data-aia-date-month":"","aria-live":"polite",children:(0,N.monthLabel)(n)}),(0,U.jsx)("button",{type:"button",tabIndex:-1,className:M.nav,"data-aia-date-next":"","aria-label":"Next month",onMouseDown:f=>f.preventDefault(),onClick:v,children:"\u203A"})]}),(0,U.jsx)("div",{className:M.weekdays,"aria-hidden":"true",children:N.WEEKDAY_LABELS.map((f,y)=>(0,U.jsx)("span",{className:M.weekday,children:f},oa[y]))}),(0,U.jsx)("div",{className:M.grid,"data-aia-date-grid":"",children:e.map((f,y)=>(0,U.jsx)(na,{option:f,id:`${t}-option-${y}`,index:y,isHighlighted:y===a&&f.is_tappable,isToday:(0,N.cellIso)(f)===w,isPast:(0,N.cellIso)(f)!=null&&(0,N.cellIso)(f)<w,marks:(0,N.dateCellMarks)((0,N.cellIso)(f),{selectedIso:i.selectedIso,range:S}),onSelect:r,onHighlight:o,onUnhighlight:d},(0,N.cellIso)(f)??`pad-${y}`))})]})}function na({option:e,id:a,index:t,isHighlighted:n,isToday:i,isPast:r,marks:o,onSelect:d,onHighlight:x,onUnhighlight:v}){let[w,S]=(0,vt.useState)(!1),f=(0,N.cellDay)(e);if(f==null)return(0,U.jsx)("div",{id:a,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-hidden":"true","aria-selected":!1,tabIndex:-1,className:`${M.cell} ${M.blank}`});let y=()=>{S(!0),d(e),setTimeout(()=>S(!1),170)},O=[M.cell,M.day,r?M.past:"",n?M.highlighted:"",i?M.today:"",o.inRange?M.inRange:"",o.selected?M.selected:"",w?M.pressed:""].filter(Boolean).join(" ");return(0,U.jsx)("div",{id:a,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-selected":n,"aria-label":e.text,tabIndex:0,className:O,onClick:y,onKeyDown:T=>{(T.key==="Enter"||T.key===" ")&&(T.preventDefault(),y())},onMouseEnter:()=>x(t),onMouseLeave:v?()=>v(t):void 0,children:(0,U.jsx)("span",{className:M.number,children:f})})}var Be=require("@magicx-eng/ai-autocomplete-vanilla"),Ze=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-5259a217")){let e=document.createElement("style");e.id="ac-style-5259a217",e.textContent=`.aia-cluster {
|
|
1208
1208
|
display: flex;
|
|
1209
1209
|
flex-wrap: wrap;
|
|
1210
1210
|
gap: var(--aia-cluster-gap, 0.5rem);
|
|
@@ -1286,6 +1286,7 @@
|
|
|
1286
1286
|
gap: 2px;
|
|
1287
1287
|
text-decoration: none;
|
|
1288
1288
|
cursor: pointer;
|
|
1289
|
+
transition: opacity 150ms ease-out;
|
|
1289
1290
|
}
|
|
1290
1291
|
|
|
1291
1292
|
/* The two content groups carry a solid surface fill so the keyboard hint and
|
|
@@ -1320,17 +1321,7 @@
|
|
|
1320
1321
|
gap: 4px;
|
|
1321
1322
|
}
|
|
1322
1323
|
|
|
1323
|
-
|
|
1324
|
-
link's opacity is pinned inline so a stylesheet can't fade the attribution
|
|
1325
|
-
out (vanilla guardAttribution.ts), and its pill fill is the dropdown's own
|
|
1326
|
-
surface, so dimming it never showed anyway. */
|
|
1327
|
-
.aia-brand-Al-lR,
|
|
1328
|
-
.aia-badge-Fk9vg {
|
|
1329
|
-
transition: opacity 150ms ease-out;
|
|
1330
|
-
}
|
|
1331
|
-
|
|
1332
|
-
.aia-brandLink-r4f3R:hover .aia-brand-Al-lR,
|
|
1333
|
-
.aia-brandLink-r4f3R:hover .aia-badge-Fk9vg {
|
|
1324
|
+
.aia-brandLink-r4f3R:hover {
|
|
1334
1325
|
opacity: 0.7;
|
|
1335
1326
|
}
|
|
1336
1327
|
|
|
@@ -1387,7 +1378,7 @@
|
|
|
1387
1378
|
justify-content: flex-end;
|
|
1388
1379
|
}
|
|
1389
1380
|
}
|
|
1390
|
-
`,document.head.appendChild(e)}var xe={footer:"aia-footer-qQQ7x",hintGroup:"aia-hintGroup-ZzbPf",brandLink:"aia-brandLink-r4f3R",
|
|
1381
|
+
`,document.head.appendChild(e)}var xe={footer:"aia-footer-qQQ7x",hintGroup:"aia-hintGroup-ZzbPf",brandLink:"aia-brandLink-r4f3R",key:"aia-key-Bz1H-",hint:"aia-hint-GKEOH",brand:"aia-brand-Al-lR",badge:"aia-badge-Fk9vg",row:"aia-row-BgZ6Q"};var se=require("react/jsx-runtime");function xt({isOptionHighlighted:e=!1,isInputEmpty:a=!1}){let{key:t,hint:n}=(0,Be.getFooterHint)(e,a),[i,r]=(0,Ze.useState)(Be.ATTRIBUTION_URL);return(0,Ze.useEffect)(()=>{r((0,Be.buildAttributionUrl)())},[]),(0,se.jsx)("footer",{className:xe.footer,"data-aia-footer":"",children:(0,se.jsxs)(We,{justify:"between",noWrap:!0,className:xe.row,children:[(0,se.jsxs)(We,{gap:"5px",className:xe.hintGroup,children:[(0,se.jsx)("kbd",{className:xe.key,children:t}),(0,se.jsx)("span",{className:xe.hint,children:n})]}),(0,se.jsxs)("a",{className:xe.brandLink,href:i,target:"_blank",rel:"noopener noreferrer",children:[(0,se.jsx)("span",{className:xe.brand,children:"AI"}),(0,se.jsx)("span",{className:xe.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,
|
|
1391
1382
|
no outline. ~28px via 6px padding + 14px text + the 1px border (border-box).
|
|
1392
1383
|
The border is kept as a 1px transparent line so the box stays the same size
|
|
1393
1384
|
as it was when the outline was dashed. */
|
|
@@ -1737,7 +1728,7 @@
|
|
|
1737
1728
|
.aia-grid[data-scroll]::-webkit-scrollbar {
|
|
1738
1729
|
display: none;
|
|
1739
1730
|
}
|
|
1740
|
-
`,document.head.appendChild(e)}var Et=require("react/jsx-runtime");function It({min:e="16rem",max:a,gap:t,scroll:n=!1,maxHeight:i,scrollResetKey:r,cols:o,template:d,innerRef:x,className:v,children:w,...S}){let f=(0,Xe.useRef)(null);(0,Xe.useLayoutEffect)(()=>{if(r===void 0)return;let
|
|
1731
|
+
`,document.head.appendChild(e)}var Et=require("react/jsx-runtime");function It({min:e="16rem",max:a,gap:t,scroll:n=!1,maxHeight:i,scrollResetKey:r,cols:o,template:d,innerRef:x,className:v,children:w,...S}){let f=(0,Xe.useRef)(null);(0,Xe.useLayoutEffect)(()=>{if(r===void 0)return;let O=f.current;O&&(O.scrollTop=0)},[r]);let y={"--aia-grid-min":e};return a&&(y["--aia-grid-max"]=a),t&&(y["--aia-grid-gap"]=t),i&&(y["--aia-grid-max-height"]=i),o&&(y.gridTemplateColumns=(0,St.optionsGridTemplateColumns)(o)),d&&(y.gridTemplateColumns=d),(0,Et.jsx)("div",{ref:O=>{f.current=O,x?.(O)},className:v?`aia-grid ${v}`:"aia-grid","data-scroll":n||void 0,style:y,...S,children:w})}var ce=require("@magicx-eng/ai-autocomplete-vanilla"),de=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-82820da7")){let e=document.createElement("style");e.id="ac-style-82820da7",e.textContent=`.aia-item-d4vpD {
|
|
1741
1732
|
position: relative;
|
|
1742
1733
|
/* Clip, not visible: the entrance rise below runs on the inner content,
|
|
1743
1734
|
and a transformed box extends its scroll container's scrollable area.
|
|
@@ -2082,6 +2073,16 @@
|
|
|
2082
2073
|
margin-right: 0;
|
|
2083
2074
|
}
|
|
2084
2075
|
|
|
2076
|
+
/* The glyph scales up with its box: at one text line (1em) it reads as a speck
|
|
2077
|
+
beside the picture tiles in the same column. 1.5em (24px at the default
|
|
2078
|
+
option font size) is 60% of the default tile, about where a picture's
|
|
2079
|
+
subject sits in its frame. Still em-based, so --aia-option-font-size scales
|
|
2080
|
+
it; --aia-option-tile-icon-size overrides it. */
|
|
2081
|
+
[data-aia-group]:has(.aia-image-YZAbO) .aia-content-T-Qba:not(:has(.aia-image-YZAbO)) .aia-icon-Qw938 svg {
|
|
2082
|
+
width: var(--aia-option-tile-icon-size, 1.5em);
|
|
2083
|
+
height: var(--aia-option-tile-icon-size, 1.5em);
|
|
2084
|
+
}
|
|
2085
|
+
|
|
2085
2086
|
@keyframes aia-skeletonPulse-plvdD {
|
|
2086
2087
|
0%,
|
|
2087
2088
|
100% {
|
|
@@ -2124,7 +2125,7 @@
|
|
|
2124
2125
|
opacity: 0;
|
|
2125
2126
|
}
|
|
2126
2127
|
}
|
|
2127
|
-
`,document.head.appendChild(e)}var
|
|
2128
|
+
`,document.head.appendChild(e)}var Y={item:"aia-item-d4vpD",content:"aia-content-T-Qba",riseIn:"aia-riseIn-etXZT",fadeIn:"aia-fadeIn-I8u35",tappable:"aia-tappable-70KcX",nonTappable:"aia-nonTappable-xSZM-",highlighted:"aia-highlighted-Hb0SU",tag:"aia-tag-e3Fwe",pressed:"aia-pressed-98o-r",pressCompress:"aia-pressCompress-ICV3q",scrollHint:"aia-scrollHint-xKXPt",skeletonPulse:"aia-skeletonPulse-plvdD",text:"aia-text-yqoh9",skeletonBarIn:"aia-skeletonBarIn-ZlEM0",icon:"aia-icon-Qw938",count:"aia-count-IpYbQ",image:"aia-image-YZAbO",skeletonOut:"aia-skeletonOut-x6NRd"};var le=require("react/jsx-runtime");function Tt({option:e,isHighlighted:a,onSelect:t,onHighlight:n,onUnhighlight:i,id:r,loading:o,showIcon:d=!0,showImage:x=!0,showCount:v=!0,scrollHint:w,enterDelayMs:S=0}){let[f]=(0,de.useState)(S),[y,O]=(0,de.useState)(!1),T=x?(0,ce.optionImageSrc)(e.image_url):null,[K,G]=(0,de.useState)(null),A=(0,de.useMemo)(()=>!T&&d&&e.icon_svg?(0,ce.sanitizeOptionIconSvg)(e.icon_svg):null,[T,d,e.icon_svg]),D=v?(0,ce.formatOptionCount)(e.item_count):null,L=(0,de.useRef)(void 0);(0,de.useEffect)(()=>()=>clearTimeout(L.current),[]);let R=()=>{o||!e.is_tappable||y||(O(!0),t(e),clearTimeout(L.current),L.current=setTimeout(()=>O(!1),170))},E=[Y.item,a&&!o?Y.highlighted:"",e.is_tappable?Y.tappable:Y.nonTappable,y?Y.pressed:"",w?Y.scrollHint:""].filter(Boolean).join(" ");return(0,le.jsx)("div",{id:r,role:"option","data-aia-option":"","data-aia-loading":o?"":void 0,"data-aia-icon":A&&e.icon?e.icon:void 0,"data-aia-image":T?"":void 0,"data-aia-item-count":D!==null?e.item_count:void 0,"aria-selected":a,className:E,style:{[ce.OPTION_ENTER_DELAY_VAR]:`${f}ms`},tabIndex:o||!e.is_tappable?-1:0,onClick:R,onKeyDown:_=>{!o&&e.is_tappable&&(_.key==="Enter"||_.key===" ")&&(_.preventDefault(),R())},onMouseEnter:!o&&e.is_tappable?n:void 0,onMouseLeave:i,children:(0,le.jsxs)("span",{className:Y.content,children:[T&&(0,le.jsx)("span",{className:`${Y.image} magicx-aia-option-image`,"aria-hidden":"true",children:(0,le.jsx)("img",{src:T,alt:"",loading:"lazy",decoding:"async",referrerPolicy:"no-referrer",draggable:!1,hidden:K===T,onError:()=>G(T)})}),A&&(0,le.jsx)("span",{className:`${Y.icon} magicx-aia-option-icon`,"aria-hidden":"true",dangerouslySetInnerHTML:{__html:A}}),(0,le.jsx)("span",{className:Y.text,children:(0,ce.optionLabel)(e)}),e.tag&&(0,le.jsx)("span",{className:Y.tag,children:e.tag}),D!==null&&(0,le.jsx)("span",{className:`${Y.count} magicx-aia-option-count`,children:D})]})})}var ct=require("react/jsx-runtime");function da(){let[e,a]=(0,pe.useState)(W.isOptionsGridMobileViewport);return(0,pe.useEffect)(()=>{if(typeof window>"u"||!window.matchMedia)return;let t=window.matchMedia(W.OPTIONS_GRID_MOBILE_QUERY),n=()=>a(t.matches);return n(),t.addEventListener("change",n),()=>t.removeEventListener("change",n)},[]),e}function At({options:e,activeIndex:a,onSelect:t,onHighlight:n,onUnhighlight:i,listboxId:r,loading:o,groupKey:d="",optionsPosition:x="below",showIcons:v=!0,showImages:w=!0,showCounts:S=!0}){let f=da(),y=(0,pe.useRef)(null),[O,T]=(0,pe.useState)(null),K=(0,pe.useRef)(null);(0,pe.useLayoutEffect)(()=>{if(o&&(0,W.sameOptionRows)(K.current,e))return;K.current=o?null:e;let A=y.current,L=A&&!o&&(0,W.needsOptionsGridMeasurement)(e.length,f)?(0,W.measureOptionsGrid)(A):null;T(L?(0,W.planOptionsGrid)(e.length,f,L.rowWidths,L.gridWidth):null)},[e,f,o]);let G=O??(0,W.planOptionsGrid)(e.length,f,null,null);return(0,ct.jsx)(It,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:d,template:G.template,maxHeight:G.maxHeight,innerRef:A=>{y.current=A},"data-aia-group":d,children:e.map((A,D)=>(0,ct.jsx)(Tt,{option:A,isHighlighted:D===a,onSelect:t,onHighlight:()=>n(D),onUnhighlight:i?()=>i(D):void 0,id:`${r}-option-${D}`,loading:o,showIcon:v,showImage:w,showCount:S,scrollHint:!o&&G.scrollHintIndices.includes(D),enterDelayMs:o?0:(0,W.optionEnterDelayMs)(D,G.cols,e.length,x)},`${d}\0${A.text}`))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`.aia-stack {
|
|
2128
2129
|
display: flex;
|
|
2129
2130
|
flex-direction: column;
|
|
2130
2131
|
gap: var(--aia-stack-space, 0.5rem);
|
|
@@ -2139,7 +2140,7 @@
|
|
|
2139
2140
|
align-items: end;
|
|
2140
2141
|
}
|
|
2141
2142
|
/* data-align="stretch" is the flex default \u2014 no rule needed. */
|
|
2142
|
-
`,document.head.appendChild(e)}var
|
|
2143
|
+
`,document.head.appendChild(e)}var Ot=require("react/jsx-runtime");function Rt({space:e,align:a="stretch",className:t,children:n,...i}){let r=e?{"--aia-stack-space":e}:void 0;return(0,Ot.jsx)("div",{className:t?`aia-stack ${t}`:"aia-stack","data-align":a,style:r,...i,children:n})}var F=require("react/jsx-runtime"),ca=[159,119,164],pa=()=>{},Dt=()=>{};function ha(e){let a=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[t,n]=(0,$.useState)(a);if((0,$.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let i=window.matchMedia("(prefers-color-scheme: dark)"),r=()=>n(i.matches);return i.addEventListener("change",r),()=>i.removeEventListener("change",r)},[e]),e!==void 0)return e==="auto"?t?"dark":"light":e}function ua(e,a){let t=(0,$.useRef)(null);(0,$.useEffect)(()=>{let n=e.current,i=a.current;if(!n||!i)return;let r=n.querySelector(".aia-grid[data-scroll]");if(t.current&&t.current.grid!==r&&(t.current.controller.destroy(),t.current=null),r&&!t.current){t.current={grid:r,controller:(0,Oe.attachScrollArrow)({dropdown:n,grid:r,button:i})};return}t.current?.controller.update()}),(0,$.useEffect)(()=>()=>{t.current?.controller.destroy(),t.current=null},[])}function Je({suggestions:e,activeIndex:a,onSelect:t,onHighlight:n,onUnhighlight:i,isOpen:r,id:o,className:d,pills:x,onPillClick:v,showPills:w=!0,onSkip:S,showSkipButton:f=!0,showOptionIcons:y=!0,showOptionImages:O=!0,showOptionCounts:T=!0,skipDisabled:K=!1,activeSelected:G=!1,isLoading:A=!1,skeletonExiting:D=!1,isInputEmpty:L=!1,products:R,onProductSelect:E,onProductFocusChange:_,productsLayout:ye="row",productImageFallback:he="image",formatType:ke="options",dateView:ue=null,selectedDateIso:p=null,selectedDateRange:De=null,dateRangeStart:Ce=null,onPreviousMonth:Pe,onNextMonth:Se,optionsPosition:me="below",mode:Ie}){let V=ha(Ie),ge=V!==void 0,X=(0,$.useRef)(null),ie=(0,$.useRef)(null);ua(X,ie),(0,$.useEffect)(()=>{if(X.current)return(0,Oe.containScroll)(X.current)},[]);let fe=e[0]?.options??[],c=!!(x&&x.length>0&&v),h=!!(R&&R.length>0),b=r&&(fe.length>0||w&&c||A||h),C={suggestions:e,activeIndex:a,pills:x,showPills:w,showSkipButton:f,showOptionIcons:y,showOptionImages:O,showOptionCounts:T,skipDisabled:K,activeSelected:G,isLoading:A,skeletonExiting:D,isInputEmpty:L,products:R,formatType:ke,dateView:ue,selectedDateIso:p,selectedDateRange:De,dateRangeStart:Ce},k=(0,$.useRef)(C);b&&(k.current=C);let l=b?C:k.current,g=l.suggestions[0],q=g?.options??[],Ee=l.activeIndex>=0&&!!q[l.activeIndex]?.is_tappable,J=!!(l.pills&&l.pills.length>0&&v),u=l.showPills&&J,Le=l.showPills&&!J&&l.isLoading,Te=u||Le,oe=J&&l.showSkipButton&&!l.isInputEmpty&&!!S,ze=l.pills?.[0]?.text,be=(0,Oe.isCalendarFormat)(l.formatType)&&l.dateView!=null,Ne=q.length>0&&!be,ee=q.length>0&&be&&!l.isLoading,ve=l.isLoading&&!Ne&&!ee,ne=l.products??[];return(0,F.jsxs)("div",{ref:X,id:o,role:"listbox","data-aia-dropdown":"","data-options-position":me,"data-mode":V,"data-aia-loading":l.isLoading?"":void 0,"data-aia-skeleton-exiting":l.skeletonExiting?"":void 0,"data-aia-has-products":ne.length>0?"":void 0,className:`${ge?"magicx-aia ":""}${we.dropdown} ${b?we.visible:""} ${d??""}`,onMouseDown:re=>re.preventDefault(),children:[(0,F.jsxs)(Rt,{space:"8px",children:[(Te||oe)&&(0,F.jsxs)(We,{noWrap:!0,className:we.pillBar,"data-aia-pillbar":"",children:[Te&&(0,F.jsx)("span",{className:we.pillScroll,"data-aia-pill-scroll":"",children:(0,F.jsx)($e,{pills:l.pills??[],activePillIndex:0,activeSelected:l.activeSelected,onSelectPill:v??(()=>{}),rounded:!0,loading:l.isLoading})}),oe&&(0,F.jsx)("button",{type:"button",tabIndex:-1,className:we.skip,"data-aia-skip":"",disabled:l.isLoading||l.skipDisabled,"aria-label":ze?`Skip ${ze}`:"Skip",onClick:S,children:"skip"})]}),Ne&&(0,F.jsx)(At,{options:q,activeIndex:l.activeIndex,onSelect:t,onHighlight:n,onUnhighlight:i,listboxId:o,loading:l.isLoading,groupKey:g?`${g.type} ${g.text}`:"",optionsPosition:me,showIcons:l.showOptionIcons,showImages:l.showOptionImages,showCounts:l.showOptionCounts}),ee&&l.dateView&&(0,F.jsx)(wt,{options:q,activeIndex:l.activeIndex,listboxId:o,view:l.dateView,selection:{selectedIso:l.selectedDateIso??null,selectedRange:l.selectedDateRange??null,rangeStart:l.dateRangeStart??null},onSelect:t,onHighlight:n,onUnhighlight:i,onPreviousMonth:Pe??Dt,onNextMonth:Se??Dt}),ve&&(0,F.jsx)("div",{className:we.skeletonBars,"data-aia-skeleton-bars":"",children:ca.map(re=>(0,F.jsx)("span",{className:we.skeletonBar,style:{width:re}},`bar-${re}`))}),(0,F.jsx)(Pt,{products:ne,listboxId:o,onSelect:E??pa,onFocusChange:_,focusable:b,layout:ye,imageFallback:he}),(0,F.jsx)(xt,{isOptionHighlighted:Ee,isInputEmpty:l.isInputEmpty})]}),(0,F.jsx)("button",{ref:ie,type:"button",tabIndex:-1,className:we.scrollArrow,"data-aia-scroll-arrow":"","aria-label":Oe.SCROLL_ARROW_LABEL,"aria-hidden":"true",children:(0,F.jsx)("svg",{viewBox:"0 0 16 16",width:"18",height:"18",fill:"none",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",focusable:"false",children:(0,F.jsx)("path",{d:"M4 6.5 8 10.5l4-4"})})})]})}var Ke=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=`.aia-submitButton-otz7H {
|
|
2143
2144
|
flex-shrink: 0;
|
|
2144
2145
|
width: 32px;
|
|
2145
2146
|
height: 32px;
|
|
@@ -2192,5 +2193,5 @@
|
|
|
2192
2193
|
);
|
|
2193
2194
|
cursor: default;
|
|
2194
2195
|
}
|
|
2195
|
-
`,document.head.appendChild(e)}var Lt={submitButton:"aia-submitButton-otz7H"};var et=require("react/jsx-runtime");function Mt({disabled:e,onClick:a}){return(0,et.jsx)("button",{type:"button","data-aia-submit":"",className:Lt.submitButton,disabled:e,onClick:t=>{t.stopPropagation(),a()},"aria-label":"Submit",children:(0,et.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,et.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var Fe=require("@magicx-eng/ai-autocomplete-vanilla"),I=require("react");var pt=require("react");function zt(e){let a=(0,pt.useRef)(e);a.current=e;let t=Object.keys(e??{}).sort().join("\0"),n=(0,pt.useRef)({key:"",overrides:void 0});if(n.current.key!==t){let i={};for(let r of Object.keys(e??{})){let o=(d,x,v)=>{let w=a.current?.[r];return w?w(d,x,v):[]};i[r]=o}n.current={key:t,overrides:e?i:void 0}}return{overrides:n.current.overrides,key:t}}var ht=require("react");function Nt(e){let a=(0,ht.useRef)(e);a.current=e;let t=(0,ht.useRef)(null);t.current===null&&(t.current={fetch:(i,r)=>{let o=a.current;return o?o.fetch(i,r):Promise.reject(new Error("products config removed"))},transform:i=>a.current?.transform(i)??[],get limit(){return a.current?.limit}});let n=e!==void 0;return{config:n?t.current:void 0,enabled:n}}var ma={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],products:[],customFields:null,optionSearch:null,activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],dropdownLoading:!0,dropdownOptions:[],skeletonOptions:null,skeletonSuggestion:null,dropdownSuggestion:null,skeletonRequested:!1,skeletonExiting:!1,activeFormatType:"options",dateView:null,dateRangeStart:null,placeholderText:"",optionQuery:"",isSearchingOptions:!1,isDropdownOpen:!1,isActivePillSelected:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingIdentified:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1,dateViewMonth:null,pendingRangeStart:null};function tt({onSubmit:e,onResult:a,onError:t,optionOverrides:n,maskCompletedText:i,apiConfig:r,additionalContext:o,columns:d=2,dropdownTrigger:x,optionsPosition:v,closeDropdownOnBlur:w,showNonTappableOptions:S,showOptionIcons:f,showOptionImages:y,showOptionCounts:D,showSkipButton:T,showProducts:K,productImageFallback:G="image",onFocus:A,onBlur:O,value:L,completedParams:R,onChange:E,onParamsChange:_,products:ye,onProductSelect:he,source:ke,setCursor:ue}){let p=(0,I.useRef)(null),[Oe,Ce]=(0,I.useState)(null),Pe=(0,I.useRef)(e);Pe.current=e;let Se=(0,I.useRef)(a);Se.current=a;let me=(0,I.useRef)(t);me.current=t;let Ie=(0,I.useRef)(E);Ie.current=E;let V=(0,I.useRef)(_);V.current=_;let ge=(0,I.useRef)(A);ge.current=A;let X=(0,I.useRef)(O);X.current=O;let ie=(0,I.useRef)(ue);ie.current=ue;let fe=(0,I.useRef)(he);fe.current=he;let c=Nt(ye),h=zt(n);(0,I.useEffect)(()=>{if(typeof document>"u")return;let m=new Fe.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:r,additionalContext:o,optionOverrides:h.overrides,maskCompletedText:i,columns:d,dropdownTrigger:x,optionsPosition:v,closeDropdownOnBlur:w,showNonTappableOptions:S,showProducts:K,source:ke,value:L,completedParams:R,onSubmit:(...H)=>Pe.current?.(...H),onResult:(...H)=>Se.current?.(...H),onError:(...H)=>me.current?.(...H),onChange:(...H)=>Ie.current?.(...H),onParamsChange:(...H)=>V.current?.(...H),onFocus:()=>ge.current?.(),onBlur:()=>X.current?.(),onProductSelect:H=>fe.current?.(H),setCursor:H=>ie.current?.(H),products:c.config});p.current=m,Ce(m.getState());let Z=m.subscribe(H=>Ce(H));return()=>{Z(),m.destroy(),p.current===m&&(p.current=null)}},[]),(0,I.useEffect)(()=>{L!==void 0&&p.current?.setValue(L)},[L]),(0,I.useEffect)(()=>{R!==void 0&&p.current?.setCompletedParams(R)},[R]);let b=JSON.stringify(r??null),C;try{C=JSON.stringify(o??null)}catch{C="[unstringifiable]"}(0,I.useEffect)(()=>{p.current?.update({apiConfig:r,additionalContext:o,optionOverrides:h.overrides,dropdownTrigger:x,optionsPosition:v,closeDropdownOnBlur:w,showNonTappableOptions:S,showProducts:K})},[b,C,h.key,x,v,w,S,K]);let k=(0,I.useRef)(!1);(0,I.useEffect)(()=>{if(!k.current){k.current=!0;return}p.current?.update({products:c.config})},[c.enabled]);let l=(0,I.useRef)(null);l.current===null&&(l.current={handleTextChange:m=>p.current?.handleTextChange(m),handleKeyDown:m=>{let Z="nativeEvent"in m?m.nativeEvent:m;p.current?.handleKeyDown(Z)},setFocused:m=>p.current?.setFocused(m),startEditingParam:m=>p.current?.startEditingParam(m),exitEditMode:()=>p.current?.exitEditMode(),handleCaretAfterInput:m=>p.current?.handleCaretAfterInput(m),handleCaretMove:m=>p.current?.handleCaretMove(m),replaceEditingRange:m=>p.current?.replaceEditingRange(m)??!1,setActivePill:m=>p.current?.setActivePill(m),skipActivePill:()=>p.current?.skipActivePill(),removeLastParam:()=>p.current?.removeLastParam(),clearNewParamId:()=>p.current?.clearNewParamId(),reset:()=>p.current?.reset(),selectOption:m=>p.current?.selectOption(m),selectProduct:m=>p.current?.selectProduct(m),setActiveDropdownIndex:m=>p.current?.setActiveDropdownIndex(m),clearHighlight:m=>p.current?.clearHighlight(m),showPreviousMonth:()=>p.current?.showPreviousMonth(),showNextMonth:()=>p.current?.showNextMonth(),handleFocus:()=>p.current?.setFocused(!0),handleBlur:()=>p.current?.setFocused(!1)});let g=l.current,q=(0,I.useCallback)(m=>{let Z=m.target.value,it=Z.length>0&&!m.nativeEvent?.isComposing&&Z[0]!==Z[0].toUpperCase()?Z[0].toUpperCase()+Z.slice(1):Z;p.current?.handleTextChange(it)},[]),Ee=(0,I.useCallback)(m=>{p.current?.handleKeyDown(m.nativeEvent)},[]),J=p.current,u=Oe??ma,Le=L!==void 0?L:u.text,Te=R!==void 0?R:u.completedParams,oe=u.actionableSuggestions,Me=oe[0],be=J?.listboxId??"",Ne=u.activeDropdownIndex>=0&&J?`${be}-option-${u.activeDropdownIndex}`:void 0,ee=u.editingParam,ve=u.editingIdentified,ne=ee?{type:ee.suggestionType,text:ee.suggestionPlaceholder,required:!0,options:ee.options}:ve?{type:ve.type,text:(0,Fe.identifiedParamLabel)(ve.type),required:!0,options:[]}:null,re=u.dropdownSuggestion??ne??Me,qe=ne?[ne]:oe,Ge=(0,Fe.dateSelectionFor)(u),Ue=!J||u.dropdownLoading;return{completedParams:Te,skippedParams:u.skippedParams,identifiedParams:u.identifiedParams,suggestionPills:oe,setActivePill:g.setActivePill,skipActivePill:g.skipActivePill,removeLastParam:g.removeLastParam,segments:u.segments,newParamId:u.newParamId,clearNewParamId:g.clearNewParamId,suggestions:u.suggestions,activeIndex:u.activeDropdownIndex,isReady:u.isReady,isLoading:Ue,isFocused:u.isFocused,isDropdownOpen:u.isDropdownOpen,isActivePillSelected:u.isActivePillSelected,placeholderText:u.placeholderText,listboxId:be,error:u.error,products:u.products,customFields:u.customFields,selectProduct:g.selectProduct,handleTextChange:g.handleTextChange,handleKeyDown:g.handleKeyDown,setFocused:g.setFocused,editingParam:ee,editingIdentified:ve,editingAnchor:u.editingAnchor,caretOffset:u.caretOffset,startEditingParam:g.startEditingParam,exitEditMode:g.exitEditMode,handleCaretAfterInput:g.handleCaretAfterInput,handleCaretMove:g.handleCaretMove,replaceEditingRange:g.replaceEditingRange,inputProps:{value:Le,placeholder:u.placeholderText||void 0,onChange:q,onKeyDown:Ee,onFocus:g.handleFocus,onBlur:g.handleBlur,role:"combobox","aria-expanded":u.isDropdownOpen,"aria-activedescendant":Ne,"aria-autocomplete":"list","aria-controls":be},reset:g.reset,dropdownProps:{suggestions:re?[{...re,options:u.dropdownOptions}]:[],activeIndex:u.activeDropdownIndex,onSelect:g.selectOption,onHighlight:g.setActiveDropdownIndex,onUnhighlight:g.clearHighlight,isOpen:u.isDropdownOpen,id:be,pills:qe,activeSelected:u.isActivePillSelected,onPillClick:g.setActivePill,onSkip:g.skipActivePill,showSkipButton:(T??!0)&&!ee&&!ve,showOptionIcons:f??!0,showOptionImages:y??!0,showOptionCounts:D??!0,skipDisabled:u.inSelectionAnimation,isLoading:Ue,skeletonExiting:u.skeletonExiting,isInputEmpty:Le.trim().length===0,products:u.products,productImageFallback:G,onProductSelect:g.selectProduct,onProductFocusChange:g.setFocused,formatType:u.activeFormatType,dateView:u.dateView,selectedDateIso:Ge.selectedIso,selectedDateRange:Ge.selectedRange,dateRangeStart:Ge.rangeStart,onPreviousMonth:g.showPreviousMonth,onNextMonth:g.showNextMonth,optionsPosition:v??"below"}}}var Y=require("@magicx-eng/ai-autocomplete-vanilla"),P=require("react"),at;function ga(){if(at!==void 0)return at;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),at=e.contentEditable==="plaintext-only",at}function Bt(e){let{segments:a,showChipIcons:t=!0,showChipImages:n=!0,newParamId:i,editingParam:r,editingIdentified:o,editingAnchor:d,caretOffset:x,placeholderText:v,isFocused:w,isDropdownOpen:S,listboxId:f,activeDescendantId:y,autoFocus:D,handleTextChange:T,handleKeyDown:K,handleCaretAfterInput:G,handleCaretMove:A,startEditingParam:O,replaceEditingRange:L,setFocused:R}=e,E=(0,P.useRef)(null),_=(0,P.useRef)(!1),ye=(0,P.useRef)(""),he=(0,P.useRef)(""),ke=(0,P.useRef)(null),ue=(0,P.useRef)(0);ke.current=x,(0,P.useEffect)(()=>{if(!D)return;let c=E.current;if(!c)return;document.activeElement===c?R(!0):c.focus();let h=c.ownerDocument??document,b=h.getSelection(),C=b&&b.rangeCount>0&&c.contains(b.anchorNode);if(b&&!C){let k=h.createRange();k.selectNodeContents(c),k.collapse(!0),b.removeAllRanges(),b.addRange(k)}},[D,R]),(0,P.useEffect)(()=>{let c=E.current;if(!c)return;let h=c.ownerDocument??document,b=()=>{let C=h.getSelection();if(!C||C.rangeCount===0||!C.anchorNode||!c.contains(C.anchorNode))return;let k=C.anchorNode,l=k.nodeType===Node.ELEMENT_NODE?k:k.parentElement,q=(C.isCollapsed?l?.closest("strong[data-param-id]"):null)?.dataset.paramId??null,Ee=r?.id??o?.id??null;if(q&&q!==Ee){O(q);return}performance.now()-ue.current<50||A((0,Y.getCursorOffset)(c))};return h.addEventListener("selectionchange",b),()=>h.removeEventListener("selectionchange",b)},[r,o,O,A]),(0,P.useLayoutEffect)(()=>{let c=E.current;c&&(0,Y.renderEditableContent)({input:c,segments:a,newParamId:i,editingParamId:r?.id??null,placeholderText:v??"",isFocused:w,showChipIcons:t,showChipImages:n})},[a,i,r,v,w,t,n]),(0,P.useLayoutEffect)(()=>{let c=ye.current,h=i??"";if(ye.current=h,!h||h===c)return;let b=E.current;if(!b)return;b.focus();let C=ke.current??(0,Y.plainTextLength)(b);(0,Y.setCursorOffset)(b,C)},[i]),(0,P.useLayoutEffect)(()=>{let c=he.current,h=r?.id??"";if(he.current=h,!h||h===c||d==null)return;let b=E.current;b&&(0,Y.setCursorOffset)(b,d)},[r,d]);let p=(0,P.useCallback)(()=>{if(_.current)return;let c=E.current;if(!c)return;let h=(0,Y.extractPlainText)(c),C=h.length>0&&h[0]!==h[0].toUpperCase()?h[0].toUpperCase()+h.slice(1):h;T(C)},[T]),Oe=(0,P.useCallback)(()=>{ue.current=performance.now(),p();let c=E.current;c&&G((0,Y.getCursorOffset)(c))},[p,G]);(0,P.useEffect)(()=>{let c=E.current;if(!c)return;let h=b=>{let C=b,k=C.inputType;if(k==="insertParagraph"||k==="insertLineBreak"||k==="insertFromDrop"){b.preventDefault();return}if(k.startsWith("insert")||k.startsWith("delete")){let l=k.startsWith("delete")?"":C.data??"";L(l)&&b.preventDefault()}};return c.addEventListener("beforeinput",h),()=>c.removeEventListener("beforeinput",h)},[L]);let Ce=(0,P.useCallback)(()=>{_.current=!0},[]),Pe=(0,P.useCallback)(()=>{_.current=!1,p()},[p]),Se=(0,P.useCallback)(c=>{c.preventDefault();let h=E.current;if(!h)return;let b=(c.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!b)return;let C=h.ownerDocument??document,k=C.getSelection();if(!k||k.rangeCount===0)return;let l=k.getRangeAt(0);if(!h.contains(l.startContainer))return;l.deleteContents();let g=C.createTextNode(b);l.insertNode(g),l.setStartAfter(g),l.collapse(!0),k.removeAllRanges(),k.addRange(l),p()},[p]),me=(0,P.useCallback)(c=>K(c),[K]),Ie=(0,P.useCallback)(()=>R(!0),[R]),V=(0,P.useCallback)(()=>R(!1),[R]),ge=(0,P.useCallback)(()=>E.current?.focus(),[]),X=(0,P.useCallback)(()=>E.current?.blur(),[]),ie=(0,P.useCallback)(()=>{let c=E.current;return c?(0,Y.extractPlainText)(c):""},[]),fe=ga()?"plaintext-only":"true";return{inputRef:E,editorProps:{ref:E,contentEditable:fe,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":f,"aria-expanded":S,"aria-activedescendant":y,spellCheck:!0,enterKeyHint:"send",onInput:Oe,onKeyDown:me,onCompositionStart:Ce,onCompositionEnd:Pe,onPaste:Se,onFocus:Ie,onBlur:V},getPlainText:ie,focus:ge,blur:X}}var ae=require("react/jsx-runtime");function fa(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var Ht=(0,B.forwardRef)(function({onSubmit:a,onResult:t,onError:n,optionOverrides:i,maskCompletedText:r,className:o,apiConfig:d,additionalContext:x,columns:v,pillPlacement:w="dropdown",mode:S="auto",optionsPosition:f="below",animations:y=!0,dropdownTrigger:D,closeDropdownOnBlur:T,showNonTappableOptions:K,showOptionIcons:G=!0,showChipIcons:A=!0,showChipImages:O=!0,showOptionImages:L=!0,showOptionCounts:R=!0,showSkipButton:E,showProducts:_,productsLayout:ye,productImageFallback:he,autoFocus:ke=!0,onFocus:ue,onBlur:p,value:Oe,completedParams:Ce,onChange:Pe,onParamsChange:Se,products:me,onProductSelect:Ie,submitButton:V,resetOnSubmit:ge=!0},X){let ie=(0,B.useRef)(null),fe=(0,B.useRef)(null),c=(0,B.useRef)(()=>{}),h=(0,B.useRef)(null),b=(0,B.useRef)(null);(0,B.useEffect)(()=>{let M=ie.current;if(M)return h.current?h.current.setMode(S):h.current=new Ke.ModeController(M,S),()=>{h.current?.destroy(),h.current=null}},[S]);let C=(0,B.useCallback)(M=>{let Ae=b.current?.current;Ae&&(Ae.focus(),(0,Ke.setCursorOffset)(Ae,M))},[]),{completedParams:k,skippedParams:l,identifiedParams:g,isReady:q,customFields:Ee,suggestionPills:J,setActivePill:u,skipActivePill:Le,segments:Te,newParamId:oe,clearNewParamId:Me,placeholderText:be,isFocused:Ne,isDropdownOpen:ee,isActivePillSelected:ve,isLoading:ne,activeIndex:re,listboxId:qe,handleTextChange:Ge,handleKeyDown:Ue,setFocused:m,editingParam:Z,editingIdentified:H,editingAnchor:it,caretOffset:Ft,startEditingParam:Kt,handleCaretAfterInput:Gt,handleCaretMove:Wt,replaceEditingRange:_t,dropdownProps:qt,reset:Qe}=tt({onSubmit:M=>c.current(M),onResult:t,onError:n,optionOverrides:i,maskCompletedText:r,apiConfig:d,additionalContext:x,columns:v,dropdownTrigger:D,optionsPosition:f,closeDropdownOnBlur:T,showNonTappableOptions:K,showOptionIcons:G,showOptionImages:L,showOptionCounts:R,showSkipButton:E,showProducts:_,onFocus:ue,onBlur:p,value:Oe,completedParams:Ce,onChange:Pe,onParamsChange:Se,products:me,onProductSelect:Ie,source:"full-sdk",setCursor:C});(0,B.useEffect)(()=>{if(!oe)return;let M=window.setTimeout(()=>Me(),650);return()=>window.clearTimeout(M)},[oe,Me]);let Ut=re>=0?`${qe}-option-${re}`:void 0,{inputRef:ot,editorProps:Qt,focus:je,blur:ut,getPlainText:mt}=Bt({segments:Te,newParamId:oe,editingParam:Z,editingIdentified:H,editingAnchor:it,caretOffset:Ft,placeholderText:be,isFocused:Ne,showChipIcons:A,showChipImages:O,isDropdownOpen:ee,listboxId:qe,activeDescendantId:Ut,autoFocus:ke,handleTextChange:Ge,handleKeyDown:Ue,handleCaretAfterInput:Gt,handleCaretMove:Wt,startEditingParam:Kt,replaceEditingRange:_t,setFocused:m});b.current=ot,(0,B.useLayoutEffect)(()=>{let M=fe.current,Ae=ot.current;if(!M||!Ae)return;let gt=()=>{let bt=M.firstElementChild;if(!bt)return;let $t=bt.getBoundingClientRect(),Vt=Ae.getBoundingClientRect();$t.top>=Vt.bottom-2?M.setAttribute("data-aia-pill-wrapped",""):M.removeAttribute("data-aia-pill-wrapped")};gt();let ft=new ResizeObserver(gt);return ft.observe(Ae),()=>ft.disconnect()},[Te,J.length,ne,ot]),(0,B.useImperativeHandle)(X,()=>({focus:je,blur:ut,reset:Qe,setMode:M=>h.current?.setMode(M),skipActivePill:Le}),[je,ut,Qe,Le]);let Ye=!!Te.length||k.length>0,nt=(0,B.useCallback)(()=>{if(!Ye)return;let M=mt();a((0,Ke.buildSubmitResult)(M,k,l,{identifiedParams:g,isReady:q,customFields:Ee})),ge&&Qe()},[ge,Ye,k,l,g,q,Ee,a,Qe,mt]);c.current=nt;let jt=(0,B.useCallback)(M=>{M.target?.closest("[data-aia-pill]")||je()},[je]),Yt=w==="inline",Zt=w==="dropdown";return(0,ae.jsxs)("div",{ref:ie,className:`magicx-aia ${ze.container} ${o??""}`,"data-pill-placement":w,"data-options-position":f,"data-animations":y?"on":"off","data-mode":fa(S),children:[(0,ae.jsx)(Je,{...qt,showPills:Zt,productsLayout:ye,productImageFallback:he}),(0,ae.jsxs)("div",{className:ze.inputWrapper,"data-aia-input-wrapper":"",onClick:jt,children:[(0,ae.jsxs)("div",{className:ze.editorArea,"data-aia-editor":"",children:[(0,ae.jsx)("div",{...Qt,className:ze.input,"data-aia-input":""}),Yt&&(ne||J.length>0)&&(0,ae.jsx)("span",{ref:fe,className:ze.pillListContainer,"data-aia-pill-list-container":"",children:(0,ae.jsx)($e,{pills:J,activePillIndex:0,activeSelected:ve,onSelectPill:u,loading:ne})})]}),V===null?null:V===void 0?(0,ae.jsx)(Mt,{disabled:!Ye,onClick:nt}):(0,ae.jsx)("span",{"data-aia-submit":"","data-aia-submit-slot":"",className:ze.submitSlot,onClick:M=>{Ye&&(M.stopPropagation(),nt())},children:V})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,DATE_RANGE_META_END,DATE_RANGE_META_START,DEFAULT_OPTION_COUNT_UNIT,PRODUCT_PATH_PREFIX,WEEKDAY_LABELS,buildSubmitResult,cellDay,cellIso,dateCellMarks,formatDate,formatDateRange,formatOptionCount,isoDate,monthLabel,optionCountLabel,optionHasImage,optionImageSrc,optionLabel,parseDate,parseLooseDate,parseLooseDateRange,productFromMatchedItem,productsFromCustomFields,sanitizeOptionIconSvg,selectedRangeFor,useAIAutocomplete,visibleDateRange,withSkippedParams});
|
|
2196
|
+
`,document.head.appendChild(e)}var Lt={submitButton:"aia-submitButton-otz7H"};var et=require("react/jsx-runtime");function zt({disabled:e,onClick:a}){return(0,et.jsx)("button",{type:"button","data-aia-submit":"",className:Lt.submitButton,disabled:e,onClick:t=>{t.stopPropagation(),a()},"aria-label":"Submit",children:(0,et.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,et.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var Fe=require("@magicx-eng/ai-autocomplete-vanilla"),I=require("react");var pt=require("react");function Mt(e){let a=(0,pt.useRef)(e);a.current=e;let t=Object.keys(e??{}).sort().join("\0"),n=(0,pt.useRef)({key:"",overrides:void 0});if(n.current.key!==t){let i={};for(let r of Object.keys(e??{})){let o=(d,x,v)=>{let w=a.current?.[r];return w?w(d,x,v):[]};i[r]=o}n.current={key:t,overrides:e?i:void 0}}return{overrides:n.current.overrides,key:t}}var ht=require("react");function Nt(e){let a=(0,ht.useRef)(e);a.current=e;let t=(0,ht.useRef)(null);t.current===null&&(t.current={fetch:(i,r)=>{let o=a.current;return o?o.fetch(i,r):Promise.reject(new Error("products config removed"))},transform:i=>a.current?.transform(i)??[],get limit(){return a.current?.limit}});let n=e!==void 0;return{config:n?t.current:void 0,enabled:n}}var ma={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],products:[],customFields:null,optionSearch:null,activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],dropdownLoading:!0,dropdownOptions:[],skeletonOptions:null,skeletonSuggestion:null,dropdownSuggestion:null,skeletonRequested:!1,skeletonExiting:!1,activeFormatType:"options",dateView:null,dateRangeStart:null,placeholderText:"",optionQuery:"",isSearchingOptions:!1,isDropdownOpen:!1,isActivePillSelected:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingIdentified:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1,dateViewMonth:null,pendingRangeStart:null};function tt({onSubmit:e,onResult:a,onError:t,optionOverrides:n,maskCompletedText:i,apiConfig:r,additionalContext:o,columns:d=2,dropdownTrigger:x,optionsPosition:v,closeDropdownOnBlur:w,showNonTappableOptions:S,showOptionIcons:f,showOptionImages:y,showOptionCounts:O,showSkipButton:T,showProducts:K,productImageFallback:G="image",onFocus:A,onBlur:D,value:L,completedParams:R,onChange:E,onParamsChange:_,products:ye,onProductSelect:he,source:ke,setCursor:ue}){let p=(0,I.useRef)(null),[De,Ce]=(0,I.useState)(null),Pe=(0,I.useRef)(e);Pe.current=e;let Se=(0,I.useRef)(a);Se.current=a;let me=(0,I.useRef)(t);me.current=t;let Ie=(0,I.useRef)(E);Ie.current=E;let V=(0,I.useRef)(_);V.current=_;let ge=(0,I.useRef)(A);ge.current=A;let X=(0,I.useRef)(D);X.current=D;let ie=(0,I.useRef)(ue);ie.current=ue;let fe=(0,I.useRef)(he);fe.current=he;let c=Nt(ye),h=Mt(n);(0,I.useEffect)(()=>{if(typeof document>"u")return;let m=new Fe.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:r,additionalContext:o,optionOverrides:h.overrides,maskCompletedText:i,columns:d,dropdownTrigger:x,optionsPosition:v,closeDropdownOnBlur:w,showNonTappableOptions:S,showProducts:K,source:ke,value:L,completedParams:R,onSubmit:(...H)=>Pe.current?.(...H),onResult:(...H)=>Se.current?.(...H),onError:(...H)=>me.current?.(...H),onChange:(...H)=>Ie.current?.(...H),onParamsChange:(...H)=>V.current?.(...H),onFocus:()=>ge.current?.(),onBlur:()=>X.current?.(),onProductSelect:H=>fe.current?.(H),setCursor:H=>ie.current?.(H),products:c.config});p.current=m,Ce(m.getState());let Z=m.subscribe(H=>Ce(H));return()=>{Z(),m.destroy(),p.current===m&&(p.current=null)}},[]),(0,I.useEffect)(()=>{L!==void 0&&p.current?.setValue(L)},[L]),(0,I.useEffect)(()=>{R!==void 0&&p.current?.setCompletedParams(R)},[R]);let b=JSON.stringify(r??null),C;try{C=JSON.stringify(o??null)}catch{C="[unstringifiable]"}(0,I.useEffect)(()=>{p.current?.update({apiConfig:r,additionalContext:o,optionOverrides:h.overrides,dropdownTrigger:x,optionsPosition:v,closeDropdownOnBlur:w,showNonTappableOptions:S,showProducts:K})},[b,C,h.key,x,v,w,S,K]);let k=(0,I.useRef)(!1);(0,I.useEffect)(()=>{if(!k.current){k.current=!0;return}p.current?.update({products:c.config})},[c.enabled]);let l=(0,I.useRef)(null);l.current===null&&(l.current={handleTextChange:m=>p.current?.handleTextChange(m),handleKeyDown:m=>{let Z="nativeEvent"in m?m.nativeEvent:m;p.current?.handleKeyDown(Z)},setFocused:m=>p.current?.setFocused(m),startEditingParam:m=>p.current?.startEditingParam(m),exitEditMode:()=>p.current?.exitEditMode(),handleCaretAfterInput:m=>p.current?.handleCaretAfterInput(m),handleCaretMove:m=>p.current?.handleCaretMove(m),replaceEditingRange:m=>p.current?.replaceEditingRange(m)??!1,setActivePill:m=>p.current?.setActivePill(m),skipActivePill:()=>p.current?.skipActivePill(),removeLastParam:()=>p.current?.removeLastParam(),clearNewParamId:()=>p.current?.clearNewParamId(),reset:()=>p.current?.reset(),selectOption:m=>p.current?.selectOption(m),selectProduct:m=>p.current?.selectProduct(m),setActiveDropdownIndex:m=>p.current?.setActiveDropdownIndex(m),clearHighlight:m=>p.current?.clearHighlight(m),showPreviousMonth:()=>p.current?.showPreviousMonth(),showNextMonth:()=>p.current?.showNextMonth(),handleFocus:()=>p.current?.setFocused(!0),handleBlur:()=>p.current?.setFocused(!1)});let g=l.current,q=(0,I.useCallback)(m=>{let Z=m.target.value,it=Z.length>0&&!m.nativeEvent?.isComposing&&Z[0]!==Z[0].toUpperCase()?Z[0].toUpperCase()+Z.slice(1):Z;p.current?.handleTextChange(it)},[]),Ee=(0,I.useCallback)(m=>{p.current?.handleKeyDown(m.nativeEvent)},[]),J=p.current,u=De??ma,Le=L!==void 0?L:u.text,Te=R!==void 0?R:u.completedParams,oe=u.actionableSuggestions,ze=oe[0],be=J?.listboxId??"",Ne=u.activeDropdownIndex>=0&&J?`${be}-option-${u.activeDropdownIndex}`:void 0,ee=u.editingParam,ve=u.editingIdentified,ne=ee?{type:ee.suggestionType,text:ee.suggestionPlaceholder,required:!0,options:ee.options}:ve?{type:ve.type,text:(0,Fe.identifiedParamLabel)(ve.type),required:!0,options:[]}:null,re=u.dropdownSuggestion??ne??ze,qe=ne?[ne]:oe,Ge=(0,Fe.dateSelectionFor)(u),Ue=!J||u.dropdownLoading;return{completedParams:Te,skippedParams:u.skippedParams,identifiedParams:u.identifiedParams,suggestionPills:oe,setActivePill:g.setActivePill,skipActivePill:g.skipActivePill,removeLastParam:g.removeLastParam,segments:u.segments,newParamId:u.newParamId,clearNewParamId:g.clearNewParamId,suggestions:u.suggestions,activeIndex:u.activeDropdownIndex,isReady:u.isReady,isLoading:Ue,isFocused:u.isFocused,isDropdownOpen:u.isDropdownOpen,isActivePillSelected:u.isActivePillSelected,placeholderText:u.placeholderText,listboxId:be,error:u.error,products:u.products,customFields:u.customFields,selectProduct:g.selectProduct,handleTextChange:g.handleTextChange,handleKeyDown:g.handleKeyDown,setFocused:g.setFocused,editingParam:ee,editingIdentified:ve,editingAnchor:u.editingAnchor,caretOffset:u.caretOffset,startEditingParam:g.startEditingParam,exitEditMode:g.exitEditMode,handleCaretAfterInput:g.handleCaretAfterInput,handleCaretMove:g.handleCaretMove,replaceEditingRange:g.replaceEditingRange,inputProps:{value:Le,placeholder:u.placeholderText||void 0,onChange:q,onKeyDown:Ee,onFocus:g.handleFocus,onBlur:g.handleBlur,role:"combobox","aria-expanded":u.isDropdownOpen,"aria-activedescendant":Ne,"aria-autocomplete":"list","aria-controls":be},reset:g.reset,dropdownProps:{suggestions:re?[{...re,options:u.dropdownOptions}]:[],activeIndex:u.activeDropdownIndex,onSelect:g.selectOption,onHighlight:g.setActiveDropdownIndex,onUnhighlight:g.clearHighlight,isOpen:u.isDropdownOpen,id:be,pills:qe,activeSelected:u.isActivePillSelected,onPillClick:g.setActivePill,onSkip:g.skipActivePill,showSkipButton:(T??!0)&&!ee&&!ve,showOptionIcons:f??!0,showOptionImages:y??!0,showOptionCounts:O??!0,skipDisabled:u.inSelectionAnimation,isLoading:Ue,skeletonExiting:u.skeletonExiting,isInputEmpty:Le.trim().length===0,products:u.products,productImageFallback:G,onProductSelect:g.selectProduct,onProductFocusChange:g.setFocused,formatType:u.activeFormatType,dateView:u.dateView,selectedDateIso:Ge.selectedIso,selectedDateRange:Ge.selectedRange,dateRangeStart:Ge.rangeStart,onPreviousMonth:g.showPreviousMonth,onNextMonth:g.showNextMonth,optionsPosition:v??"below"}}}var j=require("@magicx-eng/ai-autocomplete-vanilla"),P=require("react"),at;function ga(){if(at!==void 0)return at;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),at=e.contentEditable==="plaintext-only",at}function Bt(e){let{segments:a,showChipIcons:t=!0,showChipImages:n=!0,newParamId:i,editingParam:r,editingIdentified:o,editingAnchor:d,caretOffset:x,placeholderText:v,isFocused:w,isDropdownOpen:S,listboxId:f,activeDescendantId:y,autoFocus:O,handleTextChange:T,handleKeyDown:K,handleCaretAfterInput:G,handleCaretMove:A,startEditingParam:D,replaceEditingRange:L,setFocused:R}=e,E=(0,P.useRef)(null),_=(0,P.useRef)(!1),ye=(0,P.useRef)(""),he=(0,P.useRef)(""),ke=(0,P.useRef)(null),ue=(0,P.useRef)(0);ke.current=x,(0,P.useEffect)(()=>{if(!O)return;let c=E.current;if(!c)return;document.activeElement===c?R(!0):c.focus();let h=c.ownerDocument??document,b=h.getSelection(),C=b&&b.rangeCount>0&&c.contains(b.anchorNode);if(b&&!C){let k=h.createRange();k.selectNodeContents(c),k.collapse(!0),b.removeAllRanges(),b.addRange(k)}},[O,R]),(0,P.useEffect)(()=>{let c=E.current;if(!c)return;let h=c.ownerDocument??document,b=()=>{let C=h.getSelection();if(!C||C.rangeCount===0||!C.anchorNode||!c.contains(C.anchorNode))return;let k=C.anchorNode,l=k.nodeType===Node.ELEMENT_NODE?k:k.parentElement,q=(C.isCollapsed?l?.closest("strong[data-param-id]"):null)?.dataset.paramId??null,Ee=r?.id??o?.id??null;if(q&&q!==Ee){D(q);return}performance.now()-ue.current<50||A((0,j.getCursorOffset)(c))};return h.addEventListener("selectionchange",b),()=>h.removeEventListener("selectionchange",b)},[r,o,D,A]),(0,P.useLayoutEffect)(()=>{let c=E.current;c&&(0,j.renderEditableContent)({input:c,segments:a,newParamId:i,editingParamId:r?.id??null,placeholderText:v??"",isFocused:w,showChipIcons:t,showChipImages:n})},[a,i,r,v,w,t,n]),(0,P.useLayoutEffect)(()=>{let c=ye.current,h=i??"";if(ye.current=h,!h||h===c)return;let b=E.current;if(!b)return;b.focus();let C=ke.current??(0,j.plainTextLength)(b);(0,j.setCursorOffset)(b,C)},[i]),(0,P.useLayoutEffect)(()=>{let c=he.current,h=r?.id??"";if(he.current=h,!h||h===c||d==null)return;let b=E.current;b&&(0,j.setCursorOffset)(b,d)},[r,d]);let p=(0,P.useCallback)(()=>{if(_.current)return;let c=E.current;if(!c)return;let h=(0,j.extractPlainText)(c),C=h.length>0&&h[0]!==h[0].toUpperCase()?h[0].toUpperCase()+h.slice(1):h;T(C)},[T]),De=(0,P.useCallback)(()=>{ue.current=performance.now(),p();let c=E.current;c&&G((0,j.getCursorOffset)(c))},[p,G]);(0,P.useEffect)(()=>{let c=E.current;if(!c)return;let h=b=>{let C=b,k=C.inputType;if(k==="insertParagraph"||k==="insertLineBreak"||k==="insertFromDrop"){b.preventDefault();return}if(k.startsWith("insert")||k.startsWith("delete")){let l=k.startsWith("delete")?"":C.data??"";L(l)&&b.preventDefault()}};return c.addEventListener("beforeinput",h),()=>c.removeEventListener("beforeinput",h)},[L]);let Ce=(0,P.useCallback)(()=>{_.current=!0},[]),Pe=(0,P.useCallback)(()=>{_.current=!1,p()},[p]),Se=(0,P.useCallback)(c=>{c.preventDefault();let h=E.current;if(!h)return;let b=(c.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!b)return;let C=h.ownerDocument??document,k=C.getSelection();if(!k||k.rangeCount===0)return;let l=k.getRangeAt(0);if(!h.contains(l.startContainer))return;l.deleteContents();let g=C.createTextNode(b);l.insertNode(g),l.setStartAfter(g),l.collapse(!0),k.removeAllRanges(),k.addRange(l),p()},[p]),me=(0,P.useCallback)(c=>K(c),[K]),Ie=(0,P.useCallback)(()=>R(!0),[R]),V=(0,P.useCallback)(()=>R(!1),[R]),ge=(0,P.useCallback)(()=>E.current?.focus(),[]),X=(0,P.useCallback)(()=>E.current?.blur(),[]),ie=(0,P.useCallback)(()=>{let c=E.current;return c?(0,j.extractPlainText)(c):""},[]),fe=ga()?"plaintext-only":"true";return{inputRef:E,editorProps:{ref:E,contentEditable:fe,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":f,"aria-expanded":S,"aria-activedescendant":y,spellCheck:!0,enterKeyHint:"send",onInput:De,onKeyDown:me,onCompositionStart:Ce,onCompositionEnd:Pe,onPaste:Se,onFocus:Ie,onBlur:V},getPlainText:ie,focus:ge,blur:X}}var ae=require("react/jsx-runtime");function fa(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var Ht=(0,B.forwardRef)(function({onSubmit:a,onResult:t,onError:n,optionOverrides:i,maskCompletedText:r,className:o,apiConfig:d,additionalContext:x,columns:v,pillPlacement:w="dropdown",mode:S="auto",optionsPosition:f="below",animations:y=!0,dropdownTrigger:O,closeDropdownOnBlur:T,showNonTappableOptions:K,showOptionIcons:G=!0,showChipIcons:A=!0,showChipImages:D=!0,showOptionImages:L=!0,showOptionCounts:R=!0,showSkipButton:E,showProducts:_,productsLayout:ye,productImageFallback:he,autoFocus:ke=!0,onFocus:ue,onBlur:p,value:De,completedParams:Ce,onChange:Pe,onParamsChange:Se,products:me,onProductSelect:Ie,submitButton:V,resetOnSubmit:ge=!0},X){let ie=(0,B.useRef)(null),fe=(0,B.useRef)(null),c=(0,B.useRef)(()=>{}),h=(0,B.useRef)(null),b=(0,B.useRef)(null);(0,B.useEffect)(()=>{let z=ie.current;if(z)return h.current?h.current.setMode(S):h.current=new Ke.ModeController(z,S),()=>{h.current?.destroy(),h.current=null}},[S]);let C=(0,B.useCallback)(z=>{let Ae=b.current?.current;Ae&&(Ae.focus(),(0,Ke.setCursorOffset)(Ae,z))},[]),{completedParams:k,skippedParams:l,identifiedParams:g,isReady:q,customFields:Ee,suggestionPills:J,setActivePill:u,skipActivePill:Le,segments:Te,newParamId:oe,clearNewParamId:ze,placeholderText:be,isFocused:Ne,isDropdownOpen:ee,isActivePillSelected:ve,isLoading:ne,activeIndex:re,listboxId:qe,handleTextChange:Ge,handleKeyDown:Ue,setFocused:m,editingParam:Z,editingIdentified:H,editingAnchor:it,caretOffset:Ft,startEditingParam:Kt,handleCaretAfterInput:Gt,handleCaretMove:Wt,replaceEditingRange:_t,dropdownProps:qt,reset:Qe}=tt({onSubmit:z=>c.current(z),onResult:t,onError:n,optionOverrides:i,maskCompletedText:r,apiConfig:d,additionalContext:x,columns:v,dropdownTrigger:O,optionsPosition:f,closeDropdownOnBlur:T,showNonTappableOptions:K,showOptionIcons:G,showOptionImages:L,showOptionCounts:R,showSkipButton:E,showProducts:_,onFocus:ue,onBlur:p,value:De,completedParams:Ce,onChange:Pe,onParamsChange:Se,products:me,onProductSelect:Ie,source:"full-sdk",setCursor:C});(0,B.useEffect)(()=>{if(!oe)return;let z=window.setTimeout(()=>ze(),650);return()=>window.clearTimeout(z)},[oe,ze]);let Ut=re>=0?`${qe}-option-${re}`:void 0,{inputRef:ot,editorProps:Qt,focus:Ye,blur:ut,getPlainText:mt}=Bt({segments:Te,newParamId:oe,editingParam:Z,editingIdentified:H,editingAnchor:it,caretOffset:Ft,placeholderText:be,isFocused:Ne,showChipIcons:A,showChipImages:D,isDropdownOpen:ee,listboxId:qe,activeDescendantId:Ut,autoFocus:ke,handleTextChange:Ge,handleKeyDown:Ue,handleCaretAfterInput:Gt,handleCaretMove:Wt,startEditingParam:Kt,replaceEditingRange:_t,setFocused:m});b.current=ot,(0,B.useLayoutEffect)(()=>{let z=fe.current,Ae=ot.current;if(!z||!Ae)return;let gt=()=>{let bt=z.firstElementChild;if(!bt)return;let $t=bt.getBoundingClientRect(),Vt=Ae.getBoundingClientRect();$t.top>=Vt.bottom-2?z.setAttribute("data-aia-pill-wrapped",""):z.removeAttribute("data-aia-pill-wrapped")};gt();let ft=new ResizeObserver(gt);return ft.observe(Ae),()=>ft.disconnect()},[Te,J.length,ne,ot]),(0,B.useImperativeHandle)(X,()=>({focus:Ye,blur:ut,reset:Qe,setMode:z=>h.current?.setMode(z),skipActivePill:Le}),[Ye,ut,Qe,Le]);let je=!!Te.length||k.length>0,nt=(0,B.useCallback)(()=>{if(!je)return;let z=mt();a((0,Ke.buildSubmitResult)(z,k,l,{identifiedParams:g,isReady:q,customFields:Ee})),ge&&Qe()},[ge,je,k,l,g,q,Ee,a,Qe,mt]);c.current=nt;let Yt=(0,B.useCallback)(z=>{z.target?.closest("[data-aia-pill]")||Ye()},[Ye]),jt=w==="inline",Zt=w==="dropdown";return(0,ae.jsxs)("div",{ref:ie,className:`magicx-aia ${Me.container} ${o??""}`,"data-pill-placement":w,"data-options-position":f,"data-animations":y?"on":"off","data-mode":fa(S),children:[(0,ae.jsx)(Je,{...qt,showPills:Zt,productsLayout:ye,productImageFallback:he}),(0,ae.jsxs)("div",{className:Me.inputWrapper,"data-aia-input-wrapper":"",onClick:Yt,children:[(0,ae.jsxs)("div",{className:Me.editorArea,"data-aia-editor":"",children:[(0,ae.jsx)("div",{...Qt,className:Me.input,"data-aia-input":""}),jt&&(ne||J.length>0)&&(0,ae.jsx)("span",{ref:fe,className:Me.pillListContainer,"data-aia-pill-list-container":"",children:(0,ae.jsx)($e,{pills:J,activePillIndex:0,activeSelected:ve,onSelectPill:u,loading:ne})})]}),V===null?null:V===void 0?(0,ae.jsx)(zt,{disabled:!je,onClick:nt}):(0,ae.jsx)("span",{"data-aia-submit":"","data-aia-submit-slot":"",className:Me.submitSlot,onClick:z=>{je&&(z.stopPropagation(),nt())},children:V})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,DATE_RANGE_META_END,DATE_RANGE_META_START,DEFAULT_OPTION_COUNT_UNIT,PRODUCT_PATH_PREFIX,WEEKDAY_LABELS,buildSubmitResult,cellDay,cellIso,dateCellMarks,formatDate,formatDateRange,formatOptionCount,isoDate,monthLabel,optionCountLabel,optionHasImage,optionImageSrc,optionLabel,parseDate,parseLooseDate,parseLooseDateRange,productFromMatchedItem,productsFromCustomFields,sanitizeOptionIconSvg,selectedRangeFor,useAIAutocomplete,visibleDateRange,withSkippedParams});
|
|
2196
2197
|
//# sourceMappingURL=index.js.map
|