@magicx-eng/ai-autocomplete-react 0.30.1 → 0.31.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/README.md +17 -2
- package/dist/index.js +64 -8
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +64 -8
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -395,7 +395,10 @@ Each server item becomes a `Product` with `id` (the item's stable id), `title`,
|
|
|
395
395
|
currency is yours to add), `vendor`, `imageUrl`, and a `url`: the item's own
|
|
396
396
|
`item_url` when the uploaded catalog named one (absolute or root-relative;
|
|
397
397
|
anything else is ignored), else a **relative** `/products/{handle}` — the right
|
|
398
|
-
link for a Shopify widget running on the storefront itself
|
|
398
|
+
link for a Shopify widget running on the storefront itself — opened on the
|
|
399
|
+
variant the query chose (`?variant=…`, e.g. the blue one for "blue shoes") when
|
|
400
|
+
there is one, whose price and image the card then shows. `available` is carried
|
|
401
|
+
over when the server reports it. An item with
|
|
399
402
|
neither gets no `url`: its card is still activatable and still emits
|
|
400
403
|
`onProductSelect`, it just has nothing for cmd-click to open. `productFromMatchedItem` / `productsFromCustomFields` are
|
|
401
404
|
exported for a hand-rolled strip that wants the same mapping.
|
|
@@ -422,6 +425,17 @@ empty or whitespace-only title shows `?`. The fallback works in both row and
|
|
|
422
425
|
list layouts. Initial tiles are decorative (`aria-hidden="true"`); the card's
|
|
423
426
|
visible title supplies its text.
|
|
424
427
|
|
|
428
|
+
**Sold out.** A product with `available: false` shows a "Sold out" badge over
|
|
429
|
+
the top-left of its image (in the list layout, a smaller banner across the
|
|
430
|
+
bottom of the thumbnail) and its image is desaturated; the card stays
|
|
431
|
+
selectable and keeps its link. Absent or `true` shows no
|
|
432
|
+
badge, so leave `available` out when you don't know. The badge is part of the
|
|
433
|
+
card's text, so screen readers announce it. Theme it with
|
|
434
|
+
`--aia-product-badge-bg`, `--aia-product-badge-color`,
|
|
435
|
+
`--aia-product-badge-font-size` and `--aia-product-badge-inset`, and the list
|
|
436
|
+
banner with `--aia-product-badge-list-bg`, `--aia-product-badge-list-color` and
|
|
437
|
+
`--aia-product-badge-list-font-size`.
|
|
438
|
+
|
|
425
439
|
Pass `productImageFallback="initial"` to `<AIAutocomplete>` or
|
|
426
440
|
`<AIAutocompleteDropdown>`. The hook also accepts the option and carries it
|
|
427
441
|
through `dropdownProps`:
|
|
@@ -536,7 +550,7 @@ const products = {
|
|
|
536
550
|
/>;
|
|
537
551
|
```
|
|
538
552
|
|
|
539
|
-
`Product` is exactly
|
|
553
|
+
`Product` is exactly seven fields; only `id` and `title` are required:
|
|
540
554
|
|
|
541
555
|
```ts
|
|
542
556
|
type Product = {
|
|
@@ -546,6 +560,7 @@ type Product = {
|
|
|
546
560
|
imageUrl?: string | null;
|
|
547
561
|
price?: string;
|
|
548
562
|
vendor?: string;
|
|
563
|
+
available?: boolean; // false shows a "Sold out" badge
|
|
549
564
|
};
|
|
550
565
|
```
|
|
551
566
|
|
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 ze={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 Re=require("@magicx-eng/ai-autocomplete-vanilla"),te=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
|
*
|
|
@@ -1041,7 +1041,7 @@
|
|
|
1041
1041
|
opacity: 0.25;
|
|
1042
1042
|
}
|
|
1043
1043
|
}
|
|
1044
|
-
`,document.head.appendChild(e)}var we={dropdown:"aia-dropdown-yz2KC",visible:"aia-visible-QCoXj",scrollArrow:"aia-scrollArrow-uUzV0","magicx-aia-scroll-arrow-bob":"aia-magicx-aia-scroll-arrow-bob-z-HXC",pillBar:"aia-pillBar-pwTXe",pillScroll:"aia-pillScroll-Tpzus",skip:"aia-skip-7-olS",skeletonBars:"aia-skeletonBars-HVr9C",skeletonBarsIn:"aia-skeletonBarsIn-BdPrL",skeletonBarsOut:"aia-skeletonBarsOut-TqKeD",skeletonBar:"aia-skeletonBar-O3xIx",aiaSkeletonPulse:"aia-aiaSkeletonPulse-G8W7q"};var
|
|
1044
|
+
`,document.head.appendChild(e)}var we={dropdown:"aia-dropdown-yz2KC",visible:"aia-visible-QCoXj",scrollArrow:"aia-scrollArrow-uUzV0","magicx-aia-scroll-arrow-bob":"aia-magicx-aia-scroll-arrow-bob-z-HXC",pillBar:"aia-pillBar-pwTXe",pillScroll:"aia-pillScroll-Tpzus",skip:"aia-skip-7-olS",skeletonBars:"aia-skeletonBars-HVr9C",skeletonBarsIn:"aia-skeletonBarsIn-BdPrL",skeletonBarsOut:"aia-skeletonBarsOut-TqKeD",skeletonBar:"aia-skeletonBar-O3xIx",aiaSkeletonPulse:"aia-aiaSkeletonPulse-G8W7q"};var M=require("@magicx-eng/ai-autocomplete-vanilla"),kt=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-f687bd03")){let e=document.createElement("style");e.id="ac-style-f687bd03",e.textContent=`/* --- Datepicker (replaces the options grid for date suggestions) ---
|
|
1045
1045
|
|
|
1046
1046
|
One of three hand-maintained copies (vanilla styles.css, this file, Angular's
|
|
1047
1047
|
date-grid.component.css). Only the class-naming layer differs \u2014 the
|
|
@@ -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 z={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 Q=require("react/jsx-runtime"),ra=["sunday","monday","tuesday","wednesday","thursday","friday","saturday"];function Ct({options:e,activeIndex:a,listboxId:t,view:n,selection:i,onSelect:r,onHighlight:o,onUnhighlight:d,onPreviousMonth:k,onNextMonth:w}){let x=(0,M.isoDate)(new Date),E=(0,M.visibleDateRange)({pendingStart:i.rangeStart,highlightedIso:(0,M.cellIso)(e[a]),selected:i.selectedRange});return(0,Q.jsxs)("div",{className:z.datepicker,"data-aia-datepicker":"",children:[(0,Q.jsxs)("div",{className:z.header,children:[(0,Q.jsx)("button",{type:"button",tabIndex:-1,className:z.nav,"data-aia-date-prev":"","aria-label":"Previous month",onMouseDown:m=>m.preventDefault(),onClick:k,children:"\u2039"}),(0,Q.jsx)("span",{className:z.month,"data-aia-date-month":"","aria-live":"polite",children:(0,M.monthLabel)(n)}),(0,Q.jsx)("button",{type:"button",tabIndex:-1,className:z.nav,"data-aia-date-next":"","aria-label":"Next month",onMouseDown:m=>m.preventDefault(),onClick:w,children:"\u203A"})]}),(0,Q.jsx)("div",{className:z.weekdays,"aria-hidden":"true",children:M.WEEKDAY_LABELS.map((m,y)=>(0,Q.jsx)("span",{className:z.weekday,children:m},ra[y]))}),(0,Q.jsx)("div",{className:z.grid,"data-aia-date-grid":"",children:e.map((m,y)=>(0,Q.jsx)(sa,{option:m,id:`${t}-option-${y}`,index:y,isHighlighted:y===a&&m.is_tappable,isToday:(0,M.cellIso)(m)===x,isPast:(0,M.cellIso)(m)!=null&&(0,M.cellIso)(m)<x,marks:(0,M.dateCellMarks)((0,M.cellIso)(m),{selectedIso:i.selectedIso,range:E}),onSelect:r,onHighlight:o,onUnhighlight:d},(0,M.cellIso)(m)??`pad-${y}`))})]})}function sa({option:e,id:a,index:t,isHighlighted:n,isToday:i,isPast:r,marks:o,onSelect:d,onHighlight:k,onUnhighlight:w}){let[x,E]=(0,kt.useState)(!1),m=(0,M.cellDay)(e);if(m==null)return(0,Q.jsx)("div",{id:a,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-hidden":"true","aria-selected":!1,tabIndex:-1,className:`${z.cell} ${z.blank}`});let y=()=>{E(!0),d(e),setTimeout(()=>E(!1),170)},O=[z.cell,z.day,r?z.past:"",n?z.highlighted:"",i?z.today:"",o.inRange?z.inRange:"",o.selected?z.selected:"",x?z.pressed:""].filter(Boolean).join(" ");return(0,Q.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:A=>{(A.key==="Enter"||A.key===" ")&&(A.preventDefault(),y())},onMouseEnter:()=>k(t),onMouseLeave:w?()=>w(t):void 0,children:(0,Q.jsx)("span",{className:z.number,children:m})})}var He=require("@magicx-eng/ai-autocomplete-vanilla"),Xe=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);
|
|
@@ -1464,7 +1464,7 @@
|
|
|
1464
1464
|
align-items: center;
|
|
1465
1465
|
vertical-align: middle;
|
|
1466
1466
|
}
|
|
1467
|
-
`,document.head.appendChild(e)}var ut={list:"aia-list-qvLqO"};var
|
|
1467
|
+
`,document.head.appendChild(e)}var ut={list:"aia-list-qvLqO"};var je=require("react/jsx-runtime"),la=[125,69];function Et(e){return e===0?"first":e===1?"next":"last"}function Je({pills:e,activePillIndex:a,onSelectPill:t,activeSelected:n,rounded:i,loading:r}){return r&&e.length===0?(0,je.jsx)("span",{className:ut.list,"data-aia-pill-list-loading":"",children:la.map((o,d)=>(0,je.jsx)("span",{"data-aia-pill-skeleton":"",className:`${Ae.pill} ${i?Ae.rounded:""} ${Ae.skeleton}`,style:{width:o,opacity:ht[Et(d)]}},`skel-${o}`))}):(0,je.jsx)("span",{className:ut.list,"data-aia-pill-list-loading":r?"":void 0,children:e.map((o,d)=>{let k=!!n&&d===a;return(0,je.jsx)(St,{label:o.text,state:k?"selected":Et(d),selected:k,rounded:i,loading:r,onClick:()=>t(d)},`${o.type}-${o.text}`)})})}var et=require("@magicx-eng/ai-autocomplete-vanilla"),Fe=require("react");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
|
|
1468
1468
|
(packages/vanilla/src/styles.css). Same tokens, same defaults, so a consumer
|
|
1469
1469
|
theming one package sees the same result in the other.
|
|
1470
1470
|
|
|
@@ -1541,6 +1541,8 @@
|
|
|
1541
1541
|
text-decoration: none;
|
|
1542
1542
|
cursor: pointer;
|
|
1543
1543
|
transition: background-color 150ms ease;
|
|
1544
|
+
/* The sold-out badge is positioned against the card. */
|
|
1545
|
+
position: relative;
|
|
1544
1546
|
}
|
|
1545
1547
|
|
|
1546
1548
|
.aia-card-JBGYT:hover {
|
|
@@ -1656,6 +1658,39 @@
|
|
|
1656
1658
|
);
|
|
1657
1659
|
}
|
|
1658
1660
|
|
|
1661
|
+
/* Sold-out badge. It sits last in the text column, so the card's accessible
|
|
1662
|
+
name ends with it, and is lifted over the image's top-left corner: card
|
|
1663
|
+
padding (6px) plus the same again. A light chip with dark, tracked capitals
|
|
1664
|
+
reads on any photo, light or dark, and on either panel surface. */
|
|
1665
|
+
.aia-badge-j9Hcd {
|
|
1666
|
+
position: absolute;
|
|
1667
|
+
top: var(--aia-product-badge-inset, 12px);
|
|
1668
|
+
left: var(--aia-product-badge-inset, 12px);
|
|
1669
|
+
padding: 3px 6px;
|
|
1670
|
+
border-radius: 4px;
|
|
1671
|
+
background: var(--aia-product-badge-bg, rgba(255, 255, 255, 0.94));
|
|
1672
|
+
color: var(--aia-product-badge-color, #1f2328);
|
|
1673
|
+
/* A hairline ring keeps the chip's edge on a pale image or a light panel. */
|
|
1674
|
+
box-shadow:
|
|
1675
|
+
0 0 0 1px rgba(0, 0, 0, 0.08),
|
|
1676
|
+
0 1px 2px rgba(0, 0, 0, 0.18);
|
|
1677
|
+
font-family: inherit;
|
|
1678
|
+
font-size: var(--aia-product-badge-font-size, 9px);
|
|
1679
|
+
font-weight: 600;
|
|
1680
|
+
line-height: 1;
|
|
1681
|
+
letter-spacing: 0.08em;
|
|
1682
|
+
text-transform: uppercase;
|
|
1683
|
+
white-space: nowrap;
|
|
1684
|
+
pointer-events: none;
|
|
1685
|
+
}
|
|
1686
|
+
|
|
1687
|
+
/* A sold-out product's image steps back, so the badge is not the only cue.
|
|
1688
|
+
Desaturated rather than faded: opacity lets the panel show through, which
|
|
1689
|
+
muddies a photo on a dark surface. */
|
|
1690
|
+
.aia-card-JBGYT[data-aia-product-sold-out] .aia-image-5pNL7 {
|
|
1691
|
+
filter: grayscale(0.55);
|
|
1692
|
+
}
|
|
1693
|
+
|
|
1659
1694
|
/* --- List layout (\`productsLayout: "list"\`) ---
|
|
1660
1695
|
The same cards stacked as full-width rows \u2014 thumbnail on the left, text on
|
|
1661
1696
|
the right \u2014 for results that read as a list (courses, listings, documents)
|
|
@@ -1692,7 +1727,28 @@
|
|
|
1692
1727
|
.aia-section-Hugfg[data-aia-products-layout="list"] .aia-body-ly032 {
|
|
1693
1728
|
flex: 1 1 auto;
|
|
1694
1729
|
}
|
|
1695
|
-
|
|
1730
|
+
|
|
1731
|
+
/* In a list the badge is a banner across the bottom of the thumbnail. The
|
|
1732
|
+
thumbnail is centred in the card and the card's top and bottom padding
|
|
1733
|
+
match, so its bottom edge is half a thumbnail below the card's centre; its
|
|
1734
|
+
left edge is the card's 8px inline padding. */
|
|
1735
|
+
.aia-section-Hugfg[data-aia-products-layout="list"] .aia-badge-j9Hcd {
|
|
1736
|
+
top: calc(50% + var(--aia-product-list-media-size, 44px) / 2);
|
|
1737
|
+
left: 8px;
|
|
1738
|
+
width: var(--aia-product-list-media-size, 44px);
|
|
1739
|
+
transform: translateY(-100%);
|
|
1740
|
+
padding: 2px 0;
|
|
1741
|
+
border-radius: 0 0 8px 8px;
|
|
1742
|
+
/* A dark scrim rather than the light chip: a light banner at a tile's edge
|
|
1743
|
+
merges with a light panel and reads as a cropped photo. */
|
|
1744
|
+
background: var(--aia-product-badge-list-bg, rgba(17, 17, 17, 0.72));
|
|
1745
|
+
color: var(--aia-product-badge-list-color, #fff);
|
|
1746
|
+
box-shadow: none;
|
|
1747
|
+
font-size: var(--aia-product-badge-list-font-size, 7px);
|
|
1748
|
+
letter-spacing: 0.02em;
|
|
1749
|
+
text-align: center;
|
|
1750
|
+
}
|
|
1751
|
+
`,document.head.appendChild(e)}var ee={section:"aia-section-Hugfg",label:"aia-label-nuc93",row:"aia-row-WDVBX",card:"aia-card-JBGYT",media:"aia-media-RrbGe",image:"aia-image-5pNL7",body:"aia-body-ly032",vendor:"aia-vendor-Gvu7G",title:"aia-title-gCNmq",price:"aia-price-gULcE",badge:"aia-badge-j9Hcd"};var U=require("react/jsx-runtime");function Tt({products:e,listboxId:a,onSelect:t,onFocusChange:n,focusable:i=!0,layout:r="row",imageFallback:o="image"}){let d=e.length>0,k=(0,Fe.useRef)(null);if((0,Fe.useEffect)(()=>{let x=k.current;if(!(!d||!x))return(0,et.attachProductRowWheel)(x)},[d]),!d)return null;let w=`${a}-products-label`;return(0,U.jsxs)("section",{className:ee.section,"data-aia-products":"","data-aia-products-layout":r,role:"group","aria-labelledby":w,children:[(0,U.jsx)("div",{className:ee.label,id:w,"data-aia-products-label":"",children:"Products"}),(0,U.jsx)("div",{ref:k,className:ee.row,"data-aia-products-row":"",children:e.map((x,E)=>(0,U.jsx)(da,{product:x,id:`${a}-product-${E}`,onSelect:t,onFocusChange:n,focusable:i,imageFallback:o},x.id))})]})}function da({product:e,id:a,onSelect:t,onFocusChange:n,focusable:i,imageFallback:r}){let o=d=>{d.metaKey||d.ctrlKey||d.shiftKey||d.altKey||d.button!==0||(d.preventDefault(),t(e))};return(0,U.jsxs)("a",{id:a,className:ee.card,"data-aia-product":"","data-aia-product-sold-out":e.available===!1?"":void 0,role:"option","aria-selected":!1,href:e.url,tabIndex:i?0:-1,onClick:o,onKeyDown:d=>{d.key!=="Enter"&&d.key!==" "||(d.preventDefault(),t(e))},onFocus:()=>n?.(!0),onBlur:d=>{d.relatedTarget?.closest("[data-aia-dropdown]")||n?.(!1)},children:[(0,U.jsx)(ca,{src:e.imageUrl?.trim(),title:e.title,fallback:r},e.imageUrl?.trim()??""),(0,U.jsxs)("span",{className:ee.body,children:[e.vendor?(0,U.jsx)("span",{className:ee.vendor,children:e.vendor}):null,(0,U.jsx)("span",{className:ee.title,children:e.title}),e.price?(0,U.jsx)("span",{className:ee.price,children:e.price}):null,e.available===!1?(0,U.jsx)("span",{className:ee.badge,children:"Sold out"}):null]})]})}function ca({src:e,title:a,fallback:t}){let[n,i]=(0,Fe.useState)(!1),r=!!e&&!n,o=!r&&t==="initial";return(0,U.jsxs)("span",{className:ee.media,"aria-hidden":"true","data-aia-product-placeholder":!r&&!o?"":void 0,"data-aia-product-initial":o?"":void 0,children:[r?(0,U.jsx)("img",{className:ee.image,src:e,alt:"",loading:"lazy",decoding:"async",onError:()=>i(!0)}):null,o?(0,et.productInitial)(a):null]})}var j=require("@magicx-eng/ai-autocomplete-vanilla"),ce=require("react");var At=require("@magicx-eng/ai-autocomplete-vanilla"),tt=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-948e58da")){let e=document.createElement("style");e.id="ac-style-948e58da",e.textContent=`.aia-grid {
|
|
1696
1752
|
display: grid;
|
|
1697
1753
|
grid-template-columns: repeat(
|
|
1698
1754
|
auto-fit,
|
|
@@ -2125,7 +2181,7 @@
|
|
|
2125
2181
|
opacity: 0;
|
|
2126
2182
|
}
|
|
2127
2183
|
}
|
|
2128
|
-
`,document.head.appendChild(e)}var V={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 se=require("react/jsx-runtime");function Dt({option:e,isHighlighted:a,onSelect:t,onHighlight:n,onUnhighlight:i,id:r,loading:o,showIcon:d=!0,showImage:k=!0,showCount:w=!0,scrollHint:x,enterDelayMs:E=0}){let[m]=(0,le.useState)(E),[y,O]=(0,le.useState)(!1),A=k?(0,de.optionImageSrc)(e.image_url):null,[Z,H]=(0,le.useState)(null),D=(0,le.useMemo)(()=>!A&&d&&e.icon_svg?(0,de.sanitizeOptionIconSvg)(e.icon_svg):null,[A,d,e.icon_svg]),T=w?(0,de.formatOptionCount)(e.item_count):null,F=(0,le.useRef)(void 0);(0,le.useEffect)(()=>()=>clearTimeout(F.current),[]);let R=()=>{o||!e.is_tappable||y||(O(!0),t(e),clearTimeout(F.current),F.current=setTimeout(()=>O(!1),170))},P=[V.item,a&&!o?V.highlighted:"",e.is_tappable?V.tappable:V.nonTappable,y?V.pressed:"",x?V.scrollHint:""].filter(Boolean).join(" ");return(0,se.jsx)("div",{id:r,role:"option","data-aia-option":"","data-aia-loading":o?"":void 0,"data-aia-icon":D&&e.icon?e.icon:void 0,"data-aia-image":A?"":void 0,"data-aia-item-count":T!==null?e.item_count:void 0,"aria-selected":a,className:P,style:{[de.OPTION_ENTER_DELAY_VAR]:`${m}ms`},tabIndex:o||!e.is_tappable?-1:0,onClick:R,onKeyDown:
|
|
2184
|
+
`,document.head.appendChild(e)}var V={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 se=require("react/jsx-runtime");function Dt({option:e,isHighlighted:a,onSelect:t,onHighlight:n,onUnhighlight:i,id:r,loading:o,showIcon:d=!0,showImage:k=!0,showCount:w=!0,scrollHint:x,enterDelayMs:E=0}){let[m]=(0,le.useState)(E),[y,O]=(0,le.useState)(!1),A=k?(0,de.optionImageSrc)(e.image_url):null,[Z,H]=(0,le.useState)(null),D=(0,le.useMemo)(()=>!A&&d&&e.icon_svg?(0,de.sanitizeOptionIconSvg)(e.icon_svg):null,[A,d,e.icon_svg]),T=w?(0,de.formatOptionCount)(e.item_count):null,F=(0,le.useRef)(void 0);(0,le.useEffect)(()=>()=>clearTimeout(F.current),[]);let R=()=>{o||!e.is_tappable||y||(O(!0),t(e),clearTimeout(F.current),F.current=setTimeout(()=>O(!1),170))},P=[V.item,a&&!o?V.highlighted:"",e.is_tappable?V.tappable:V.nonTappable,y?V.pressed:"",x?V.scrollHint:""].filter(Boolean).join(" ");return(0,se.jsx)("div",{id:r,role:"option","data-aia-option":"","data-aia-loading":o?"":void 0,"data-aia-icon":D&&e.icon?e.icon:void 0,"data-aia-image":A?"":void 0,"data-aia-item-count":T!==null?e.item_count:void 0,"aria-selected":a,className:P,style:{[de.OPTION_ENTER_DELAY_VAR]:`${m}ms`},tabIndex:o||!e.is_tappable?-1:0,onClick:R,onKeyDown:Y=>{!o&&e.is_tappable&&(Y.key==="Enter"||Y.key===" ")&&(Y.preventDefault(),R())},onMouseEnter:!o&&e.is_tappable?n:void 0,onMouseLeave:i,children:(0,se.jsxs)("span",{className:V.content,children:[A&&(0,se.jsx)("span",{className:`${V.image} magicx-aia-option-image`,"aria-hidden":"true",children:(0,se.jsx)("img",{src:A,alt:"",loading:"lazy",decoding:"async",referrerPolicy:"no-referrer",draggable:!1,hidden:Z===A,onError:()=>H(A)})}),D&&(0,se.jsx)("span",{className:`${V.icon} magicx-aia-option-icon`,"aria-hidden":"true",dangerouslySetInnerHTML:{__html:D}}),(0,se.jsx)("span",{className:V.text,children:(0,de.optionLabel)(e)}),e.tag&&(0,se.jsx)("span",{className:V.tag,children:e.tag}),T!==null&&(0,se.jsx)("span",{className:`${V.count} magicx-aia-option-count`,children:T})]})})}var mt=require("react/jsx-runtime");function pa(){let[e,a]=(0,ce.useState)(j.isOptionsGridMobileViewport);return(0,ce.useEffect)(()=>{if(typeof window>"u"||!window.matchMedia)return;let t=window.matchMedia(j.OPTIONS_GRID_MOBILE_QUERY),n=()=>a(t.matches);return n(),t.addEventListener("change",n),()=>t.removeEventListener("change",n)},[]),e}function Lt({options:e,activeIndex:a,onSelect:t,onHighlight:n,onUnhighlight:i,listboxId:r,loading:o,groupKey:d="",optionsPosition:k="below",showIcons:w=!0,showImages:x=!0,showCounts:E=!0}){let m=pa(),y=(0,ce.useRef)(null),[O,A]=(0,ce.useState)(null),Z=(0,ce.useRef)(null);(0,ce.useLayoutEffect)(()=>{if(o&&(0,j.sameOptionRows)(Z.current,e))return;Z.current=o?null:e;let D=y.current,F=D&&!o&&(0,j.needsOptionsGridMeasurement)(e.length,m)?(0,j.measureOptionsGrid)(D):null;A(F?(0,j.planOptionsGrid)(e.length,m,F.rowWidths,F.gridWidth):null)},[e,m,o]);let H=O??(0,j.planOptionsGrid)(e.length,m,null,null);return(0,mt.jsx)(Rt,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:d,template:H.template,maxHeight:H.maxHeight,innerRef:D=>{y.current=D},"data-aia-group":d,children:e.map((D,T)=>(0,mt.jsx)(Dt,{option:D,isHighlighted:T===a,onSelect:t,onHighlight:()=>n(T),onUnhighlight:i?()=>i(T):void 0,id:`${r}-option-${T}`,loading:o,showIcon:w,showImage:x,showCount:E,scrollHint:!o&&H.scrollHintIndices.includes(T),enterDelayMs:o?0:(0,j.optionEnterDelayMs)(T,H.cols,e.length,k)},`${d}\0${D.text}`))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`.aia-stack {
|
|
2129
2185
|
display: flex;
|
|
2130
2186
|
flex-direction: column;
|
|
2131
2187
|
gap: var(--aia-stack-space, 0.5rem);
|
|
@@ -2140,7 +2196,7 @@
|
|
|
2140
2196
|
align-items: end;
|
|
2141
2197
|
}
|
|
2142
2198
|
/* data-align="stretch" is the flex default \u2014 no rule needed. */
|
|
2143
|
-
`,document.head.appendChild(e)}var
|
|
2199
|
+
`,document.head.appendChild(e)}var Mt=require("react/jsx-runtime");function zt({space:e,align:a="stretch",className:t,children:n,...i}){let r=e?{"--aia-stack-space":e}:void 0;return(0,Mt.jsx)("div",{className:t?`aia-stack ${t}`:"aia-stack","data-align":a,style:r,...i,children:n})}var K=require("react/jsx-runtime"),ha=[159,119,164],ua=()=>{},Nt=()=>{};function ma(e){let a=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[t,n]=(0,te.useState)(a);if((0,te.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 ga(e,a){let t=(0,te.useRef)(null);(0,te.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,Re.attachScrollArrow)({dropdown:n,grid:r,button:i})};return}t.current?.controller.update()}),(0,te.useEffect)(()=>()=>{t.current?.controller.destroy(),t.current=null},[])}function at({suggestions:e,activeIndex:a,onSelect:t,onHighlight:n,onUnhighlight:i,isOpen:r,id:o,className:d,pills:k,onPillClick:w,showPills:x=!0,onSkip:E,showSkipButton:m=!0,showOptionIcons:y=!0,showOptionImages:O=!0,showOptionCounts:A=!0,skipDisabled:Z=!1,activeSelected:H=!1,isLoading:D=!1,skeletonExiting:T=!1,isInputEmpty:F=!1,products:R,onProductSelect:P,onProductFocusChange:Y,productsLayout:pe="row",productImageFallback:ye="image",formatType:he="options",dateView:ke=null,selectedDateIso:$=null,selectedDateRange:f=null,dateRangeStart:Oe=null,onPreviousMonth:Ce,onNextMonth:Pe,optionsPosition:ue="below",mode:Se}){let me=ma(Se),ie=me!==void 0,X=(0,te.useRef)(null),ge=(0,te.useRef)(null);ga(X,ge),(0,te.useEffect)(()=>{if(X.current)return(0,Re.containScroll)(X.current)},[]);let fe=e[0]?.options??[],c=!!(k&&k.length>0&&w),g=!!(R&&R.length>0),u=r&&(fe.length>0||x&&c||D||g),b={suggestions:e,activeIndex:a,pills:k,showPills:x,showSkipButton:m,showOptionIcons:y,showOptionImages:O,showOptionCounts:A,skipDisabled:Z,activeSelected:H,isLoading:D,skeletonExiting:T,isInputEmpty:F,products:R,formatType:he,dateView:ke,selectedDateIso:$,selectedDateRange:f,dateRangeStart:Oe},C=(0,te.useRef)(b);u&&(C.current=b);let l=u?b:C.current,W=l.suggestions[0],_=W?.options??[],oe=l.activeIndex>=0&&!!_[l.activeIndex]?.is_tappable,v=!!(l.pills&&l.pills.length>0&&w),De=l.showPills&&v,We=l.showPills&&!v&&l.isLoading,be=De||We,p=v&&l.showSkipButton&&!l.isInputEmpty&&!!E,ve=l.pills?.[0]?.text,Le=(0,Re.isCalendarFormat)(l.formatType)&&l.dateView!=null,Ie=_.length>0&&!Le,Me=_.length>0&&Le&&!l.isLoading,Ee=l.isLoading&&!Ie&&!Me,Ne=l.products??[];return(0,K.jsxs)("div",{ref:X,id:o,role:"listbox","data-aia-dropdown":"","data-options-position":ue,"data-mode":me,"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:`${ie?"magicx-aia ":""}${we.dropdown} ${u?we.visible:""} ${d??""}`,onMouseDown:q=>q.preventDefault(),children:[(0,K.jsxs)(zt,{space:"8px",children:[(be||p)&&(0,K.jsxs)(Ue,{noWrap:!0,className:we.pillBar,"data-aia-pillbar":"",children:[be&&(0,K.jsx)("span",{className:we.pillScroll,"data-aia-pill-scroll":"",children:(0,K.jsx)(Je,{pills:l.pills??[],activePillIndex:0,activeSelected:l.activeSelected,onSelectPill:w??(()=>{}),rounded:!0,loading:l.isLoading})}),p&&(0,K.jsx)("button",{type:"button",tabIndex:-1,className:we.skip,"data-aia-skip":"",disabled:l.isLoading||l.skipDisabled,"aria-label":ve?`Skip ${ve}`:"Skip",onClick:E,children:"skip"})]}),Ie&&(0,K.jsx)(Lt,{options:_,activeIndex:l.activeIndex,onSelect:t,onHighlight:n,onUnhighlight:i,listboxId:o,loading:l.isLoading,groupKey:W?`${W.type} ${W.text}`:"",optionsPosition:ue,showIcons:l.showOptionIcons,showImages:l.showOptionImages,showCounts:l.showOptionCounts}),Me&&l.dateView&&(0,K.jsx)(Ct,{options:_,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:Ce??Nt,onNextMonth:Pe??Nt}),Ee&&(0,K.jsx)("div",{className:we.skeletonBars,"data-aia-skeleton-bars":"",children:ha.map(q=>(0,K.jsx)("span",{className:we.skeletonBar,style:{width:q}},`bar-${q}`))}),(0,K.jsx)(Tt,{products:Ne,listboxId:o,onSelect:P??ua,onFocusChange:Y,focusable:u,layout:pe,imageFallback:ye}),(0,K.jsx)(Pt,{isOptionHighlighted:oe,isInputEmpty:l.isInputEmpty})]}),(0,K.jsx)("button",{ref:ge,type:"button",tabIndex:-1,className:we.scrollArrow,"data-aia-scroll-arrow":"","aria-label":Re.SCROLL_ARROW_LABEL,"aria-hidden":"true",children:(0,K.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,K.jsx)("path",{d:"M4 6.5 8 10.5l4-4"})})})]})}var Ge=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 {
|
|
2144
2200
|
flex-shrink: 0;
|
|
2145
2201
|
width: 32px;
|
|
2146
2202
|
height: 32px;
|
|
@@ -2193,5 +2249,5 @@
|
|
|
2193
2249
|
);
|
|
2194
2250
|
cursor: default;
|
|
2195
2251
|
}
|
|
2196
|
-
`,document.head.appendChild(e)}var Bt={submitButton:"aia-submitButton-otz7H"};var it=require("react/jsx-runtime");function Ht({disabled:e,onClick:a}){return(0,it.jsx)("button",{type:"button","data-aia-submit":"",className:Bt.submitButton,disabled:e,onClick:t=>{t.stopPropagation(),a()},"aria-label":"Submit",children:(0,it.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,it.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var Ke=require("@magicx-eng/ai-autocomplete-vanilla"),I=require("react");var gt=require("react");function Ft(e){let a=(0,gt.useRef)(e);a.current=e;let t=Object.keys(e??{}).sort().join("\0"),n=(0,gt.useRef)({key:"",overrides:void 0});if(n.current.key!==t){let i={};for(let r of Object.keys(e??{})){let o=(d,k,w)=>{let x=a.current?.[r];return x?x(d,k,w):[]};i[r]=o}n.current={key:t,overrides:e?i:void 0}}return{overrides:n.current.overrides,key:t}}var ft=require("react");function Kt(e){let a=(0,ft.useRef)(e);a.current=e;let t=(0,ft.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 fa={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 ot({onSubmit:e,onResult:a,onError:t,optionOverrides:n,maskCompletedText:i,apiConfig:r,additionalContext:o,visitorId:d,columns:k=2,dropdownTrigger:w,optionsPosition:x,closeDropdownOnBlur:E,showNonTappableOptions:m,showOptionIcons:y,showOptionImages:O,showOptionCounts:A,showSkipButton:Z,showProducts:H,productImageFallback:D="image",onFocus:T,onBlur:F,value:R,completedParams:P,onChange:Q,onParamsChange:pe,products:ye,onProductSelect:he,source:ke,setCursor:$}){let f=(0,I.useRef)(null),[Oe,Ce]=(0,I.useState)(null),Pe=(0,I.useRef)(e);Pe.current=e;let ue=(0,I.useRef)(a);ue.current=a;let Se=(0,I.useRef)(t);Se.current=t;let me=(0,I.useRef)(Q);me.current=Q;let ie=(0,I.useRef)(pe);ie.current=pe;let X=(0,I.useRef)(T);X.current=T;let ge=(0,I.useRef)(F);ge.current=F;let fe=(0,I.useRef)($);fe.current=$;let c=(0,I.useRef)(he);c.current=he;let g=(0,I.useRef)(d);g.current=d;let u=(0,I.useRef)(()=>{let h=g.current;return typeof h=="function"?h():h}).current,b=Kt(ye),C=Ft(n);(0,I.useEffect)(()=>{if(typeof document>"u")return;let h=new Ke.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:r,additionalContext:o,visitorId:u,optionOverrides:C.overrides,maskCompletedText:i,columns:k,dropdownTrigger:w,optionsPosition:x,closeDropdownOnBlur:E,showNonTappableOptions:m,showProducts:H,source:ke,value:R,completedParams:P,onSubmit:(...B)=>Pe.current?.(...B),onResult:(...B)=>ue.current?.(...B),onError:(...B)=>Se.current?.(...B),onChange:(...B)=>me.current?.(...B),onParamsChange:(...B)=>ie.current?.(...B),onFocus:()=>X.current?.(),onBlur:()=>ge.current?.(),onProductSelect:B=>c.current?.(B),setCursor:B=>fe.current?.(B),products:b.config});f.current=h,Ce(h.getState());let J=h.subscribe(B=>Ce(B));return()=>{J(),h.destroy(),f.current===h&&(f.current=null)}},[]),(0,I.useEffect)(()=>{R!==void 0&&f.current?.setValue(R)},[R]),(0,I.useEffect)(()=>{P!==void 0&&f.current?.setCompletedParams(P)},[P]);let l=JSON.stringify(r??null),W;try{W=JSON.stringify(o??null)}catch{W="[unstringifiable]"}(0,I.useEffect)(()=>{f.current?.update({apiConfig:r,additionalContext:o,optionOverrides:C.overrides,dropdownTrigger:w,optionsPosition:x,closeDropdownOnBlur:E,showNonTappableOptions:m,showProducts:H})},[l,W,C.key,w,x,E,m,H]);let _=(0,I.useRef)(!1);(0,I.useEffect)(()=>{if(!_.current){_.current=!0;return}f.current?.update({products:b.config})},[b.enabled]);let oe=(0,I.useRef)(null);oe.current===null&&(oe.current={handleTextChange:h=>f.current?.handleTextChange(h),handleKeyDown:h=>{let J="nativeEvent"in h?h.nativeEvent:h;f.current?.handleKeyDown(J)},setFocused:h=>f.current?.setFocused(h),startEditingParam:h=>f.current?.startEditingParam(h),exitEditMode:()=>f.current?.exitEditMode(),handleCaretAfterInput:h=>f.current?.handleCaretAfterInput(h),handleCaretMove:h=>f.current?.handleCaretMove(h),replaceEditingRange:h=>f.current?.replaceEditingRange(h)??!1,setActivePill:h=>f.current?.setActivePill(h),skipActivePill:()=>f.current?.skipActivePill(),removeLastParam:()=>f.current?.removeLastParam(),clearNewParamId:()=>f.current?.clearNewParamId(),reset:()=>f.current?.reset(),recordSubmit:h=>f.current?.recordSubmit(h),selectOption:h=>f.current?.selectOption(h),selectProduct:h=>f.current?.selectProduct(h),setActiveDropdownIndex:h=>f.current?.setActiveDropdownIndex(h),clearHighlight:h=>f.current?.clearHighlight(h),showPreviousMonth:()=>f.current?.showPreviousMonth(),showNextMonth:()=>f.current?.showNextMonth(),handleFocus:()=>f.current?.setFocused(!0),handleBlur:()=>f.current?.setFocused(!1)});let v=oe.current,De=(0,I.useCallback)(h=>{let J=h.target.value,st=J.length>0&&!h.nativeEvent?.isComposing&&J[0]!==J[0].toUpperCase()?J[0].toUpperCase()+J.slice(1):J;f.current?.handleTextChange(st)},[]),We=(0,I.useCallback)(h=>{f.current?.handleKeyDown(h.nativeEvent)},[]),be=f.current,p=Oe??fa,ve=R!==void 0?R:p.text,Le=P!==void 0?P:p.completedParams,Ie=p.actionableSuggestions,ze=Ie[0],Ee=be?.listboxId??"",Ne=p.activeDropdownIndex>=0&&be?`${Ee}-option-${p.activeDropdownIndex}`:void 0,q=p.editingParam,Te=p.editingIdentified,Be=q?{type:q.suggestionType,text:q.suggestionPlaceholder,required:!0,options:q.options}:Te?{type:Te.type,text:(0,Ke.identifiedParamLabel)(Te.type),required:!0,options:[]}:null,Ye=p.dropdownSuggestion??Be??ze,rt=Be?[Be]:Ie,_e=(0,Ke.dateSelectionFor)(p),je=!be||p.dropdownLoading;return{completedParams:Le,skippedParams:p.skippedParams,identifiedParams:p.identifiedParams,suggestionPills:Ie,setActivePill:v.setActivePill,skipActivePill:v.skipActivePill,removeLastParam:v.removeLastParam,segments:p.segments,newParamId:p.newParamId,clearNewParamId:v.clearNewParamId,suggestions:p.suggestions,activeIndex:p.activeDropdownIndex,isReady:p.isReady,isLoading:je,isFocused:p.isFocused,isDropdownOpen:p.isDropdownOpen,isActivePillSelected:p.isActivePillSelected,placeholderText:p.placeholderText,listboxId:Ee,error:p.error,products:p.products,customFields:p.customFields,selectProduct:v.selectProduct,handleTextChange:v.handleTextChange,handleKeyDown:v.handleKeyDown,setFocused:v.setFocused,editingParam:q,editingIdentified:Te,editingAnchor:p.editingAnchor,caretOffset:p.caretOffset,startEditingParam:v.startEditingParam,exitEditMode:v.exitEditMode,handleCaretAfterInput:v.handleCaretAfterInput,handleCaretMove:v.handleCaretMove,replaceEditingRange:v.replaceEditingRange,inputProps:{value:ve,placeholder:p.placeholderText||void 0,onChange:De,onKeyDown:We,onFocus:v.handleFocus,onBlur:v.handleBlur,role:"combobox","aria-expanded":p.isDropdownOpen,"aria-activedescendant":Ne,"aria-autocomplete":"list","aria-controls":Ee},reset:v.reset,recordSubmit:v.recordSubmit,dropdownProps:{suggestions:Ye?[{...Ye,options:p.dropdownOptions}]:[],activeIndex:p.activeDropdownIndex,onSelect:v.selectOption,onHighlight:v.setActiveDropdownIndex,onUnhighlight:v.clearHighlight,isOpen:p.isDropdownOpen,id:Ee,pills:rt,activeSelected:p.isActivePillSelected,onPillClick:v.setActivePill,onSkip:v.skipActivePill,showSkipButton:(Z??!0)&&!q&&!Te,showOptionIcons:y??!0,showOptionImages:O??!0,showOptionCounts:A??!0,skipDisabled:p.inSelectionAnimation,isLoading:je,skeletonExiting:p.skeletonExiting,isInputEmpty:ve.trim().length===0,products:p.products,productImageFallback:D,onProductSelect:v.selectProduct,onProductFocusChange:v.setFocused,formatType:p.activeFormatType,dateView:p.dateView,selectedDateIso:_e.selectedIso,selectedDateRange:_e.selectedRange,dateRangeStart:_e.rangeStart,onPreviousMonth:v.showPreviousMonth,onNextMonth:v.showNextMonth,optionsPosition:x??"below"}}}var G=require("@magicx-eng/ai-autocomplete-vanilla"),S=require("react"),nt;function ba(){if(nt!==void 0)return nt;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),nt=e.contentEditable==="plaintext-only",nt}function Gt(e){let{segments:a,showChipIcons:t=!0,showChipImages:n=!0,newParamId:i,editingParam:r,editingIdentified:o,editingAnchor:d,caretOffset:k,placeholderText:w,isFocused:x,isDropdownOpen:E,listboxId:m,activeDescendantId:y,autoFocus:O,handleTextChange:A,handleKeyDown:Z,handleCaretAfterInput:H,handleCaretMove:D,startEditingParam:T,replaceEditingRange:F,setFocused:R}=e,P=(0,S.useRef)(null),Q=(0,S.useRef)(!1),pe=(0,S.useRef)(""),ye=(0,S.useRef)(""),he=(0,S.useRef)(null),ke=(0,S.useRef)(0);he.current=k,(0,S.useEffect)(()=>{if(!O)return;let c=P.current;if(!c)return;document.activeElement===c?R(!0):c.focus();let g=c.ownerDocument??document,u=g.getSelection(),b=u&&u.rangeCount>0&&c.contains(u.anchorNode);if(u&&!b){let C=g.createRange();C.selectNodeContents(c),C.collapse(!0),u.removeAllRanges(),u.addRange(C)}},[O,R]),(0,S.useEffect)(()=>{let c=P.current;if(!c)return;let g=c.ownerDocument??document,u=()=>{let b=g.getSelection();if(!b||b.rangeCount===0||!b.anchorNode||!c.contains(b.anchorNode))return;let C=b.anchorNode,l=C.nodeType===Node.ELEMENT_NODE?C:C.parentElement,_=(b.isCollapsed?l?.closest("strong[data-param-id]"):null)?.dataset.paramId??null,oe=r?.id??o?.id??null;if(_&&_!==oe){T(_);return}performance.now()-ke.current<50||D((0,G.getCursorOffset)(c))};return g.addEventListener("selectionchange",u),()=>g.removeEventListener("selectionchange",u)},[r,o,T,D]),(0,S.useEffect)(()=>{let c=P.current;if(!c)return;let g=u=>{let b=(0,G.chipIdFromTap)(c,u.target);b&&(T(b),(0,G.keepCaretOnChip)(c,b))};return c.addEventListener("click",g),()=>c.removeEventListener("click",g)},[T]),(0,S.useLayoutEffect)(()=>{let c=P.current;c&&(0,G.renderEditableContent)({input:c,segments:a,newParamId:i,editingParamId:r?.id??null,placeholderText:w??"",isFocused:x,showChipIcons:t,showChipImages:n})},[a,i,r,w,x,t,n]),(0,S.useLayoutEffect)(()=>{let c=pe.current,g=i??"";if(pe.current=g,!g||g===c)return;let u=P.current;if(!u)return;u.focus();let b=he.current??(0,G.plainTextLength)(u);(0,G.setCursorOffset)(u,b)},[i]),(0,S.useLayoutEffect)(()=>{let c=ye.current,g=r?.id??"";if(ye.current=g,!g||g===c||d==null)return;let u=P.current;u&&(0,G.setCursorOffset)(u,d)},[r,d]);let $=(0,S.useCallback)(()=>{if(Q.current)return;let c=P.current;if(!c)return;let g=(0,G.extractPlainText)(c),b=g.length>0&&g[0]!==g[0].toUpperCase()?g[0].toUpperCase()+g.slice(1):g;A(b)},[A]),f=(0,S.useCallback)(()=>{ke.current=performance.now(),$();let c=P.current;c&&H((0,G.getCursorOffset)(c))},[$,H]);(0,S.useEffect)(()=>{let c=P.current;if(!c)return;let g=u=>{let b=u,C=b.inputType;if(C==="insertParagraph"||C==="insertLineBreak"||C==="insertFromDrop"){u.preventDefault();return}if(C.startsWith("insert")||C.startsWith("delete")){let l=C.startsWith("delete")?"":b.data??"";F(l)&&u.preventDefault()}};return c.addEventListener("beforeinput",g),()=>c.removeEventListener("beforeinput",g)},[F]);let Oe=(0,S.useCallback)(()=>{Q.current=!0},[]),Ce=(0,S.useCallback)(()=>{Q.current=!1,$()},[$]),Pe=(0,S.useCallback)(c=>{c.preventDefault();let g=P.current;if(!g)return;let u=(c.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!u)return;let b=g.ownerDocument??document,C=b.getSelection();if(!C||C.rangeCount===0)return;let l=C.getRangeAt(0);if(!g.contains(l.startContainer))return;l.deleteContents();let W=b.createTextNode(u);l.insertNode(W),l.setStartAfter(W),l.collapse(!0),C.removeAllRanges(),C.addRange(l),$()},[$]),ue=(0,S.useCallback)(c=>Z(c),[Z]),Se=(0,S.useCallback)(()=>R(!0),[R]),me=(0,S.useCallback)(()=>R(!1),[R]),ie=(0,S.useCallback)(()=>P.current?.focus(),[]),X=(0,S.useCallback)(()=>P.current?.blur(),[]),ge=(0,S.useCallback)(()=>{let c=P.current;return c?(0,G.extractPlainText)(c):""},[]),fe=ba()?"plaintext-only":"true";return{inputRef:P,editorProps:{ref:P,contentEditable:fe,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":m,"aria-expanded":E,"aria-activedescendant":y,spellCheck:!0,enterKeyHint:"send",onInput:f,onKeyDown:ue,onCompositionStart:Oe,onCompositionEnd:Ce,onPaste:Pe,onFocus:Se,onBlur:me},getPlainText:ge,focus:ie,blur:X}}var ae=require("react/jsx-runtime");function va(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var Wt=(0,N.forwardRef)(function({onSubmit:a,onResult:t,onError:n,optionOverrides:i,maskCompletedText:r,className:o,apiConfig:d,additionalContext:k,visitorId:w,columns:x,pillPlacement:E="dropdown",mode:m="auto",optionsPosition:y="below",animations:O=!0,dropdownTrigger:A,closeDropdownOnBlur:Z,showNonTappableOptions:H,showOptionIcons:D=!0,showChipIcons:T=!0,showChipImages:F=!0,showOptionImages:R=!0,showOptionCounts:P=!0,showSkipButton:Q,showProducts:pe,productsLayout:ye,productImageFallback:he,autoFocus:ke=!0,onFocus:$,onBlur:f,value:Oe,completedParams:Ce,onChange:Pe,onParamsChange:ue,products:Se,onProductSelect:me,submitButton:ie,resetOnSubmit:X=!0},ge){let fe=(0,N.useRef)(null),c=(0,N.useRef)(null),g=(0,N.useRef)(()=>{}),u=(0,N.useRef)(null),b=(0,N.useRef)(null);(0,N.useEffect)(()=>{let L=fe.current;if(L)return u.current?u.current.setMode(m):u.current=new Ge.ModeController(L,m),()=>{u.current?.destroy(),u.current=null}},[m]);let C=(0,N.useCallback)(L=>{let ne=b.current?.current;ne&&(ne.focus(),(0,Ge.setCursorOffset)(ne,L))},[]),{completedParams:l,skippedParams:W,identifiedParams:_,isReady:oe,customFields:v,suggestionPills:De,setActivePill:We,skipActivePill:be,segments:p,newParamId:ve,clearNewParamId:Le,placeholderText:Ie,isFocused:ze,isDropdownOpen:Ee,isActivePillSelected:Ne,isLoading:q,activeIndex:Te,listboxId:Be,handleTextChange:Ye,handleKeyDown:rt,setFocused:_e,editingParam:je,editingIdentified:h,editingAnchor:J,caretOffset:B,startEditingParam:st,handleCaretAfterInput:_t,handleCaretMove:qt,replaceEditingRange:Ut,dropdownProps:Qt,reset:Ze,recordSubmit:bt}=ot({onSubmit:L=>g.current(L),onResult:t,onError:n,optionOverrides:i,maskCompletedText:r,apiConfig:d,additionalContext:k,visitorId:w,columns:x,dropdownTrigger:A,optionsPosition:y,closeDropdownOnBlur:Z,showNonTappableOptions:H,showOptionIcons:D,showOptionImages:R,showOptionCounts:P,showSkipButton:Q,showProducts:pe,onFocus:$,onBlur:f,value:Oe,completedParams:Ce,onChange:Pe,onParamsChange:ue,products:Se,onProductSelect:me,source:"full-sdk",setCursor:C});(0,N.useEffect)(()=>{if(!ve)return;let L=window.setTimeout(()=>Le(),650);return()=>window.clearTimeout(L)},[ve,Le]);let Yt=Te>=0?`${Be}-option-${Te}`:void 0,{inputRef:lt,editorProps:jt,focus:$e,blur:vt,getPlainText:wt}=Gt({segments:p,newParamId:ve,editingParam:je,editingIdentified:h,editingAnchor:J,caretOffset:B,placeholderText:Ie,isFocused:ze,showChipIcons:T,showChipImages:F,isDropdownOpen:Ee,listboxId:Be,activeDescendantId:Yt,autoFocus:ke,handleTextChange:Ye,handleKeyDown:rt,handleCaretAfterInput:_t,handleCaretMove:qt,startEditingParam:st,replaceEditingRange:Ut,setFocused:_e});b.current=lt,(0,N.useLayoutEffect)(()=>{let L=c.current,ne=lt.current;if(!L||!ne)return;let qe=()=>{let yt=L.firstElementChild;if(!yt)return;let Xt=yt.getBoundingClientRect(),Jt=ne.getBoundingClientRect();Xt.top>=Jt.bottom-2?L.setAttribute("data-aia-pill-wrapped",""):L.removeAttribute("data-aia-pill-wrapped")};qe();let xt=new ResizeObserver(qe);return xt.observe(ne),()=>xt.disconnect()},[p,De.length,q,lt]),(0,N.useImperativeHandle)(ge,()=>({focus:$e,blur:vt,reset:Ze,setMode:L=>u.current?.setMode(L),skipActivePill:be}),[$e,vt,Ze,be]);let Ve=!!p.length||l.length>0,dt=(0,N.useCallback)(L=>{if(!Ve)return;let ne=wt(),qe=(0,Ge.buildSubmitResult)(ne,l,W,{identifiedParams:_,isReady:oe,customFields:v});L&&bt(qe),a(qe),X&&Ze()},[bt,X,Ve,l,W,_,oe,v,a,Ze,wt]);g.current=()=>dt(!1);let Zt=(0,N.useCallback)(L=>{L.target?.closest("[data-aia-pill]")||$e()},[$e]),$t=E==="inline",Vt=E==="dropdown";return(0,ae.jsxs)("div",{ref:fe,className:`magicx-aia ${Me.container} ${o??""}`,"data-pill-placement":E,"data-options-position":y,"data-animations":O?"on":"off","data-mode":va(m),children:[(0,ae.jsx)(at,{...Qt,showPills:Vt,productsLayout:ye,productImageFallback:he}),(0,ae.jsxs)("div",{className:Me.inputWrapper,"data-aia-input-wrapper":"",onClick:Zt,children:[(0,ae.jsxs)("div",{className:Me.editorArea,"data-aia-editor":"",children:[(0,ae.jsx)("div",{...jt,className:Me.input,"data-aia-input":""}),$t&&(q||De.length>0)&&(0,ae.jsx)("span",{ref:c,className:Me.pillListContainer,"data-aia-pill-list-container":"",children:(0,ae.jsx)(Je,{pills:De,activePillIndex:0,activeSelected:Ne,onSelectPill:We,loading:q})})]}),ie===null?null:ie===void 0?(0,ae.jsx)(Ht,{disabled:!Ve,onClick:()=>dt(!0)}):(0,ae.jsx)("span",{"data-aia-submit":"","data-aia-submit-slot":"",className:Me.submitSlot,onClick:L=>{Ve&&(L.stopPropagation(),dt(!0))},children:ie})]})]})});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});
|
|
2252
|
+
`,document.head.appendChild(e)}var Bt={submitButton:"aia-submitButton-otz7H"};var it=require("react/jsx-runtime");function Ht({disabled:e,onClick:a}){return(0,it.jsx)("button",{type:"button","data-aia-submit":"",className:Bt.submitButton,disabled:e,onClick:t=>{t.stopPropagation(),a()},"aria-label":"Submit",children:(0,it.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,it.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var Ke=require("@magicx-eng/ai-autocomplete-vanilla"),I=require("react");var gt=require("react");function Ft(e){let a=(0,gt.useRef)(e);a.current=e;let t=Object.keys(e??{}).sort().join("\0"),n=(0,gt.useRef)({key:"",overrides:void 0});if(n.current.key!==t){let i={};for(let r of Object.keys(e??{})){let o=(d,k,w)=>{let x=a.current?.[r];return x?x(d,k,w):[]};i[r]=o}n.current={key:t,overrides:e?i:void 0}}return{overrides:n.current.overrides,key:t}}var ft=require("react");function Kt(e){let a=(0,ft.useRef)(e);a.current=e;let t=(0,ft.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 fa={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 ot({onSubmit:e,onResult:a,onError:t,optionOverrides:n,maskCompletedText:i,apiConfig:r,additionalContext:o,visitorId:d,columns:k=2,dropdownTrigger:w,optionsPosition:x,closeDropdownOnBlur:E,showNonTappableOptions:m,showOptionIcons:y,showOptionImages:O,showOptionCounts:A,showSkipButton:Z,showProducts:H,productImageFallback:D="image",onFocus:T,onBlur:F,value:R,completedParams:P,onChange:Y,onParamsChange:pe,products:ye,onProductSelect:he,source:ke,setCursor:$}){let f=(0,I.useRef)(null),[Oe,Ce]=(0,I.useState)(null),Pe=(0,I.useRef)(e);Pe.current=e;let ue=(0,I.useRef)(a);ue.current=a;let Se=(0,I.useRef)(t);Se.current=t;let me=(0,I.useRef)(Y);me.current=Y;let ie=(0,I.useRef)(pe);ie.current=pe;let X=(0,I.useRef)(T);X.current=T;let ge=(0,I.useRef)(F);ge.current=F;let fe=(0,I.useRef)($);fe.current=$;let c=(0,I.useRef)(he);c.current=he;let g=(0,I.useRef)(d);g.current=d;let u=(0,I.useRef)(()=>{let h=g.current;return typeof h=="function"?h():h}).current,b=Kt(ye),C=Ft(n);(0,I.useEffect)(()=>{if(typeof document>"u")return;let h=new Ke.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:r,additionalContext:o,visitorId:u,optionOverrides:C.overrides,maskCompletedText:i,columns:k,dropdownTrigger:w,optionsPosition:x,closeDropdownOnBlur:E,showNonTappableOptions:m,showProducts:H,source:ke,value:R,completedParams:P,onSubmit:(...B)=>Pe.current?.(...B),onResult:(...B)=>ue.current?.(...B),onError:(...B)=>Se.current?.(...B),onChange:(...B)=>me.current?.(...B),onParamsChange:(...B)=>ie.current?.(...B),onFocus:()=>X.current?.(),onBlur:()=>ge.current?.(),onProductSelect:B=>c.current?.(B),setCursor:B=>fe.current?.(B),products:b.config});f.current=h,Ce(h.getState());let J=h.subscribe(B=>Ce(B));return()=>{J(),h.destroy(),f.current===h&&(f.current=null)}},[]),(0,I.useEffect)(()=>{R!==void 0&&f.current?.setValue(R)},[R]),(0,I.useEffect)(()=>{P!==void 0&&f.current?.setCompletedParams(P)},[P]);let l=JSON.stringify(r??null),W;try{W=JSON.stringify(o??null)}catch{W="[unstringifiable]"}(0,I.useEffect)(()=>{f.current?.update({apiConfig:r,additionalContext:o,optionOverrides:C.overrides,dropdownTrigger:w,optionsPosition:x,closeDropdownOnBlur:E,showNonTappableOptions:m,showProducts:H})},[l,W,C.key,w,x,E,m,H]);let _=(0,I.useRef)(!1);(0,I.useEffect)(()=>{if(!_.current){_.current=!0;return}f.current?.update({products:b.config})},[b.enabled]);let oe=(0,I.useRef)(null);oe.current===null&&(oe.current={handleTextChange:h=>f.current?.handleTextChange(h),handleKeyDown:h=>{let J="nativeEvent"in h?h.nativeEvent:h;f.current?.handleKeyDown(J)},setFocused:h=>f.current?.setFocused(h),startEditingParam:h=>f.current?.startEditingParam(h),exitEditMode:()=>f.current?.exitEditMode(),handleCaretAfterInput:h=>f.current?.handleCaretAfterInput(h),handleCaretMove:h=>f.current?.handleCaretMove(h),replaceEditingRange:h=>f.current?.replaceEditingRange(h)??!1,setActivePill:h=>f.current?.setActivePill(h),skipActivePill:()=>f.current?.skipActivePill(),removeLastParam:()=>f.current?.removeLastParam(),clearNewParamId:()=>f.current?.clearNewParamId(),reset:()=>f.current?.reset(),recordSubmit:h=>f.current?.recordSubmit(h),selectOption:h=>f.current?.selectOption(h),selectProduct:h=>f.current?.selectProduct(h),setActiveDropdownIndex:h=>f.current?.setActiveDropdownIndex(h),clearHighlight:h=>f.current?.clearHighlight(h),showPreviousMonth:()=>f.current?.showPreviousMonth(),showNextMonth:()=>f.current?.showNextMonth(),handleFocus:()=>f.current?.setFocused(!0),handleBlur:()=>f.current?.setFocused(!1)});let v=oe.current,De=(0,I.useCallback)(h=>{let J=h.target.value,st=J.length>0&&!h.nativeEvent?.isComposing&&J[0]!==J[0].toUpperCase()?J[0].toUpperCase()+J.slice(1):J;f.current?.handleTextChange(st)},[]),We=(0,I.useCallback)(h=>{f.current?.handleKeyDown(h.nativeEvent)},[]),be=f.current,p=Oe??fa,ve=R!==void 0?R:p.text,Le=P!==void 0?P:p.completedParams,Ie=p.actionableSuggestions,Me=Ie[0],Ee=be?.listboxId??"",Ne=p.activeDropdownIndex>=0&&be?`${Ee}-option-${p.activeDropdownIndex}`:void 0,q=p.editingParam,Te=p.editingIdentified,Be=q?{type:q.suggestionType,text:q.suggestionPlaceholder,required:!0,options:q.options}:Te?{type:Te.type,text:(0,Ke.identifiedParamLabel)(Te.type),required:!0,options:[]}:null,Ye=p.dropdownSuggestion??Be??Me,rt=Be?[Be]:Ie,_e=(0,Ke.dateSelectionFor)(p),Qe=!be||p.dropdownLoading;return{completedParams:Le,skippedParams:p.skippedParams,identifiedParams:p.identifiedParams,suggestionPills:Ie,setActivePill:v.setActivePill,skipActivePill:v.skipActivePill,removeLastParam:v.removeLastParam,segments:p.segments,newParamId:p.newParamId,clearNewParamId:v.clearNewParamId,suggestions:p.suggestions,activeIndex:p.activeDropdownIndex,isReady:p.isReady,isLoading:Qe,isFocused:p.isFocused,isDropdownOpen:p.isDropdownOpen,isActivePillSelected:p.isActivePillSelected,placeholderText:p.placeholderText,listboxId:Ee,error:p.error,products:p.products,customFields:p.customFields,selectProduct:v.selectProduct,handleTextChange:v.handleTextChange,handleKeyDown:v.handleKeyDown,setFocused:v.setFocused,editingParam:q,editingIdentified:Te,editingAnchor:p.editingAnchor,caretOffset:p.caretOffset,startEditingParam:v.startEditingParam,exitEditMode:v.exitEditMode,handleCaretAfterInput:v.handleCaretAfterInput,handleCaretMove:v.handleCaretMove,replaceEditingRange:v.replaceEditingRange,inputProps:{value:ve,placeholder:p.placeholderText||void 0,onChange:De,onKeyDown:We,onFocus:v.handleFocus,onBlur:v.handleBlur,role:"combobox","aria-expanded":p.isDropdownOpen,"aria-activedescendant":Ne,"aria-autocomplete":"list","aria-controls":Ee},reset:v.reset,recordSubmit:v.recordSubmit,dropdownProps:{suggestions:Ye?[{...Ye,options:p.dropdownOptions}]:[],activeIndex:p.activeDropdownIndex,onSelect:v.selectOption,onHighlight:v.setActiveDropdownIndex,onUnhighlight:v.clearHighlight,isOpen:p.isDropdownOpen,id:Ee,pills:rt,activeSelected:p.isActivePillSelected,onPillClick:v.setActivePill,onSkip:v.skipActivePill,showSkipButton:(Z??!0)&&!q&&!Te,showOptionIcons:y??!0,showOptionImages:O??!0,showOptionCounts:A??!0,skipDisabled:p.inSelectionAnimation,isLoading:Qe,skeletonExiting:p.skeletonExiting,isInputEmpty:ve.trim().length===0,products:p.products,productImageFallback:D,onProductSelect:v.selectProduct,onProductFocusChange:v.setFocused,formatType:p.activeFormatType,dateView:p.dateView,selectedDateIso:_e.selectedIso,selectedDateRange:_e.selectedRange,dateRangeStart:_e.rangeStart,onPreviousMonth:v.showPreviousMonth,onNextMonth:v.showNextMonth,optionsPosition:x??"below"}}}var G=require("@magicx-eng/ai-autocomplete-vanilla"),S=require("react"),nt;function ba(){if(nt!==void 0)return nt;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),nt=e.contentEditable==="plaintext-only",nt}function Gt(e){let{segments:a,showChipIcons:t=!0,showChipImages:n=!0,newParamId:i,editingParam:r,editingIdentified:o,editingAnchor:d,caretOffset:k,placeholderText:w,isFocused:x,isDropdownOpen:E,listboxId:m,activeDescendantId:y,autoFocus:O,handleTextChange:A,handleKeyDown:Z,handleCaretAfterInput:H,handleCaretMove:D,startEditingParam:T,replaceEditingRange:F,setFocused:R}=e,P=(0,S.useRef)(null),Y=(0,S.useRef)(!1),pe=(0,S.useRef)(""),ye=(0,S.useRef)(""),he=(0,S.useRef)(null),ke=(0,S.useRef)(0);he.current=k,(0,S.useEffect)(()=>{if(!O)return;let c=P.current;if(!c)return;document.activeElement===c?R(!0):c.focus();let g=c.ownerDocument??document,u=g.getSelection(),b=u&&u.rangeCount>0&&c.contains(u.anchorNode);if(u&&!b){let C=g.createRange();C.selectNodeContents(c),C.collapse(!0),u.removeAllRanges(),u.addRange(C)}},[O,R]),(0,S.useEffect)(()=>{let c=P.current;if(!c)return;let g=c.ownerDocument??document,u=()=>{let b=g.getSelection();if(!b||b.rangeCount===0||!b.anchorNode||!c.contains(b.anchorNode))return;let C=b.anchorNode,l=C.nodeType===Node.ELEMENT_NODE?C:C.parentElement,_=(b.isCollapsed?l?.closest("strong[data-param-id]"):null)?.dataset.paramId??null,oe=r?.id??o?.id??null;if(_&&_!==oe){T(_);return}performance.now()-ke.current<50||D((0,G.getCursorOffset)(c))};return g.addEventListener("selectionchange",u),()=>g.removeEventListener("selectionchange",u)},[r,o,T,D]),(0,S.useEffect)(()=>{let c=P.current;if(!c)return;let g=u=>{let b=(0,G.chipIdFromTap)(c,u.target);b&&(T(b),(0,G.keepCaretOnChip)(c,b))};return c.addEventListener("click",g),()=>c.removeEventListener("click",g)},[T]),(0,S.useLayoutEffect)(()=>{let c=P.current;c&&(0,G.renderEditableContent)({input:c,segments:a,newParamId:i,editingParamId:r?.id??null,placeholderText:w??"",isFocused:x,showChipIcons:t,showChipImages:n})},[a,i,r,w,x,t,n]),(0,S.useLayoutEffect)(()=>{let c=pe.current,g=i??"";if(pe.current=g,!g||g===c)return;let u=P.current;if(!u)return;u.focus();let b=he.current??(0,G.plainTextLength)(u);(0,G.setCursorOffset)(u,b)},[i]),(0,S.useLayoutEffect)(()=>{let c=ye.current,g=r?.id??"";if(ye.current=g,!g||g===c||d==null)return;let u=P.current;u&&(0,G.setCursorOffset)(u,d)},[r,d]);let $=(0,S.useCallback)(()=>{if(Y.current)return;let c=P.current;if(!c)return;let g=(0,G.extractPlainText)(c),b=g.length>0&&g[0]!==g[0].toUpperCase()?g[0].toUpperCase()+g.slice(1):g;A(b)},[A]),f=(0,S.useCallback)(()=>{ke.current=performance.now(),$();let c=P.current;c&&H((0,G.getCursorOffset)(c))},[$,H]);(0,S.useEffect)(()=>{let c=P.current;if(!c)return;let g=u=>{let b=u,C=b.inputType;if(C==="insertParagraph"||C==="insertLineBreak"||C==="insertFromDrop"){u.preventDefault();return}if(C.startsWith("insert")||C.startsWith("delete")){let l=C.startsWith("delete")?"":b.data??"";F(l)&&u.preventDefault()}};return c.addEventListener("beforeinput",g),()=>c.removeEventListener("beforeinput",g)},[F]);let Oe=(0,S.useCallback)(()=>{Y.current=!0},[]),Ce=(0,S.useCallback)(()=>{Y.current=!1,$()},[$]),Pe=(0,S.useCallback)(c=>{c.preventDefault();let g=P.current;if(!g)return;let u=(c.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!u)return;let b=g.ownerDocument??document,C=b.getSelection();if(!C||C.rangeCount===0)return;let l=C.getRangeAt(0);if(!g.contains(l.startContainer))return;l.deleteContents();let W=b.createTextNode(u);l.insertNode(W),l.setStartAfter(W),l.collapse(!0),C.removeAllRanges(),C.addRange(l),$()},[$]),ue=(0,S.useCallback)(c=>Z(c),[Z]),Se=(0,S.useCallback)(()=>R(!0),[R]),me=(0,S.useCallback)(()=>R(!1),[R]),ie=(0,S.useCallback)(()=>P.current?.focus(),[]),X=(0,S.useCallback)(()=>P.current?.blur(),[]),ge=(0,S.useCallback)(()=>{let c=P.current;return c?(0,G.extractPlainText)(c):""},[]),fe=ba()?"plaintext-only":"true";return{inputRef:P,editorProps:{ref:P,contentEditable:fe,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":m,"aria-expanded":E,"aria-activedescendant":y,spellCheck:!0,enterKeyHint:"send",onInput:f,onKeyDown:ue,onCompositionStart:Oe,onCompositionEnd:Ce,onPaste:Pe,onFocus:Se,onBlur:me},getPlainText:ge,focus:ie,blur:X}}var ae=require("react/jsx-runtime");function va(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var Wt=(0,N.forwardRef)(function({onSubmit:a,onResult:t,onError:n,optionOverrides:i,maskCompletedText:r,className:o,apiConfig:d,additionalContext:k,visitorId:w,columns:x,pillPlacement:E="dropdown",mode:m="auto",optionsPosition:y="below",animations:O=!0,dropdownTrigger:A,closeDropdownOnBlur:Z,showNonTappableOptions:H,showOptionIcons:D=!0,showChipIcons:T=!0,showChipImages:F=!0,showOptionImages:R=!0,showOptionCounts:P=!0,showSkipButton:Y,showProducts:pe,productsLayout:ye,productImageFallback:he,autoFocus:ke=!0,onFocus:$,onBlur:f,value:Oe,completedParams:Ce,onChange:Pe,onParamsChange:ue,products:Se,onProductSelect:me,submitButton:ie,resetOnSubmit:X=!0},ge){let fe=(0,N.useRef)(null),c=(0,N.useRef)(null),g=(0,N.useRef)(()=>{}),u=(0,N.useRef)(null),b=(0,N.useRef)(null);(0,N.useEffect)(()=>{let L=fe.current;if(L)return u.current?u.current.setMode(m):u.current=new Ge.ModeController(L,m),()=>{u.current?.destroy(),u.current=null}},[m]);let C=(0,N.useCallback)(L=>{let ne=b.current?.current;ne&&(ne.focus(),(0,Ge.setCursorOffset)(ne,L))},[]),{completedParams:l,skippedParams:W,identifiedParams:_,isReady:oe,customFields:v,suggestionPills:De,setActivePill:We,skipActivePill:be,segments:p,newParamId:ve,clearNewParamId:Le,placeholderText:Ie,isFocused:Me,isDropdownOpen:Ee,isActivePillSelected:Ne,isLoading:q,activeIndex:Te,listboxId:Be,handleTextChange:Ye,handleKeyDown:rt,setFocused:_e,editingParam:Qe,editingIdentified:h,editingAnchor:J,caretOffset:B,startEditingParam:st,handleCaretAfterInput:_t,handleCaretMove:qt,replaceEditingRange:Ut,dropdownProps:jt,reset:Ze,recordSubmit:bt}=ot({onSubmit:L=>g.current(L),onResult:t,onError:n,optionOverrides:i,maskCompletedText:r,apiConfig:d,additionalContext:k,visitorId:w,columns:x,dropdownTrigger:A,optionsPosition:y,closeDropdownOnBlur:Z,showNonTappableOptions:H,showOptionIcons:D,showOptionImages:R,showOptionCounts:P,showSkipButton:Y,showProducts:pe,onFocus:$,onBlur:f,value:Oe,completedParams:Ce,onChange:Pe,onParamsChange:ue,products:Se,onProductSelect:me,source:"full-sdk",setCursor:C});(0,N.useEffect)(()=>{if(!ve)return;let L=window.setTimeout(()=>Le(),650);return()=>window.clearTimeout(L)},[ve,Le]);let Yt=Te>=0?`${Be}-option-${Te}`:void 0,{inputRef:lt,editorProps:Qt,focus:$e,blur:vt,getPlainText:wt}=Gt({segments:p,newParamId:ve,editingParam:Qe,editingIdentified:h,editingAnchor:J,caretOffset:B,placeholderText:Ie,isFocused:Me,showChipIcons:T,showChipImages:F,isDropdownOpen:Ee,listboxId:Be,activeDescendantId:Yt,autoFocus:ke,handleTextChange:Ye,handleKeyDown:rt,handleCaretAfterInput:_t,handleCaretMove:qt,startEditingParam:st,replaceEditingRange:Ut,setFocused:_e});b.current=lt,(0,N.useLayoutEffect)(()=>{let L=c.current,ne=lt.current;if(!L||!ne)return;let qe=()=>{let yt=L.firstElementChild;if(!yt)return;let Xt=yt.getBoundingClientRect(),Jt=ne.getBoundingClientRect();Xt.top>=Jt.bottom-2?L.setAttribute("data-aia-pill-wrapped",""):L.removeAttribute("data-aia-pill-wrapped")};qe();let xt=new ResizeObserver(qe);return xt.observe(ne),()=>xt.disconnect()},[p,De.length,q,lt]),(0,N.useImperativeHandle)(ge,()=>({focus:$e,blur:vt,reset:Ze,setMode:L=>u.current?.setMode(L),skipActivePill:be}),[$e,vt,Ze,be]);let Ve=!!p.length||l.length>0,dt=(0,N.useCallback)(L=>{if(!Ve)return;let ne=wt(),qe=(0,Ge.buildSubmitResult)(ne,l,W,{identifiedParams:_,isReady:oe,customFields:v});L&&bt(qe),a(qe),X&&Ze()},[bt,X,Ve,l,W,_,oe,v,a,Ze,wt]);g.current=()=>dt(!1);let Zt=(0,N.useCallback)(L=>{L.target?.closest("[data-aia-pill]")||$e()},[$e]),$t=E==="inline",Vt=E==="dropdown";return(0,ae.jsxs)("div",{ref:fe,className:`magicx-aia ${ze.container} ${o??""}`,"data-pill-placement":E,"data-options-position":y,"data-animations":O?"on":"off","data-mode":va(m),children:[(0,ae.jsx)(at,{...jt,showPills:Vt,productsLayout:ye,productImageFallback:he}),(0,ae.jsxs)("div",{className:ze.inputWrapper,"data-aia-input-wrapper":"",onClick:Zt,children:[(0,ae.jsxs)("div",{className:ze.editorArea,"data-aia-editor":"",children:[(0,ae.jsx)("div",{...Qt,className:ze.input,"data-aia-input":""}),$t&&(q||De.length>0)&&(0,ae.jsx)("span",{ref:c,className:ze.pillListContainer,"data-aia-pill-list-container":"",children:(0,ae.jsx)(Je,{pills:De,activePillIndex:0,activeSelected:Ne,onSelectPill:We,loading:q})})]}),ie===null?null:ie===void 0?(0,ae.jsx)(Ht,{disabled:!Ve,onClick:()=>dt(!0)}):(0,ae.jsx)("span",{"data-aia-submit":"","data-aia-submit-slot":"",className:ze.submitSlot,onClick:L=>{Ve&&(L.stopPropagation(),dt(!0))},children:ie})]})]})});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});
|
|
2197
2253
|
//# sourceMappingURL=index.js.map
|