@magicx-eng/ai-autocomplete-react 0.24.2 → 0.26.0

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END as Qo,DATE_RANGE_META_START as Zo,dateCellMarks as Yo,formatDate as Xo,formatDateRange as Jo,isoDate as en,monthLabel as tn,optionLabel as an,PRODUCT_PATH_PREFIX as on,parseDate as nn,parseLooseDate as rn,parseLooseDateRange as sn,productFromMatchedItem as ln,productsFromCustomFields as dn,sanitizeOptionIconSvg as cn,selectedRangeFor as pn,visibleDateRange as hn,WEEKDAY_LABELS as un,withSkippedParams as fn}from"@magicx-eng/ai-autocomplete-vanilla";import{forwardRef as Va,useCallback as Je,useEffect as Mt,useImperativeHandle as Qa,useLayoutEffect as Za,useRef as Ie}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-67791514")){let e=document.createElement("style");e.id="ac-style-67791514",e.textContent=`.aia-container-KKjFU {
+import{buildSubmitResult as Zo,cellDay as Xo,cellIso as Jo,DATE_RANGE_META_END as en,DATE_RANGE_META_START as tn,DEFAULT_OPTION_COUNT_UNIT as an,dateCellMarks as on,formatDate as nn,formatDateRange as rn,formatOptionCount as sn,isoDate as ln,monthLabel as dn,optionCountLabel as cn,optionHasImage as pn,optionImageSrc as hn,optionLabel as un,PRODUCT_PATH_PREFIX as mn,parseDate as fn,parseLooseDate as gn,parseLooseDateRange as bn,productFromMatchedItem as vn,productsFromCustomFields as wn,sanitizeOptionIconSvg as xn,selectedRangeFor as yn,visibleDateRange as kn,WEEKDAY_LABELS as Cn,withSkippedParams as Pn}from"@magicx-eng/ai-autocomplete-vanilla";import{forwardRef as Ja,useCallback as at,useEffect as zt,useImperativeHandle as ei,useLayoutEffect as ti,useRef as De}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-67791514")){let e=document.createElement("style");e.id="ac-style-67791514",e.textContent=`.aia-container-KKjFU {
   position: relative;
   /* Inherits the host page's font by default. Consumers can pin a specific
      font on the library via \`--aia-font-family: 'Custom Font'\` without
@@ -17,8 +17,9 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
      10px the two sides would diverge; flooring both keeps them together. */
   padding: 12px 16px 12px max(10px, var(--aia-content-inset-left, 16px));
   border: 1px solid var(--aia-border, #b0b0b0);
-  border-radius: 20px;
+  border-radius: 10px;
   background: var(--aia-surface, #ffffff);
+  /* Flat by default; consumers can set --aia-shadow for elevation. */
   box-shadow: var(--aia-shadow, none);
   overflow: hidden;
   display: flex;
@@ -150,6 +151,27 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
   height: 100%;
 }
 
+/* The picked option's picture: a small rounded tile inline before the chip
+   text, in place of the icon. It is an empty inline span whose left padding
+   is the tile's width and whose background is the picture (set inline as
+   --aia-chip-image by the renderer) over a placeholder fill \u2014 not an <img>,
+   which as an atomic inline would let the line break between it and the
+   chip's text. The tile's height is the chip's own content height, so it
+   never grows the input's line. The fill shows until the picture paints and
+   stays if it never does; contentEditable is off on it (the renderer sets
+   that) so it adds no characters to the caret's plain text. */
+:where(.aia-input-IW-P-) span[class~="magicx-aia-segment-image"] {
+  display: inline;
+  padding-left: var(--aia-chip-image-size, 1.25em);
+  margin-right: 5px;
+  border-radius: var(--aia-chip-image-radius, 4px);
+  background:
+    var(--aia-chip-image, none) center / cover no-repeat,
+    var(--aia-chip-image-bg, var(--aia-pill-bg, rgba(189, 189, 189, 0.25)));
+  pointer-events: none;
+  user-select: none;
+}
+
 /* Re-edit highlight \u2014 applied to the completed pill being re-edited (after a
    tap). Reuses the exact hover fill so the highlight persists from tap until an
    option is selected. Hides the native caret; cursor switches to text since the
@@ -240,7 +262,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
     opacity: 0;
   }
 }
-`,document.head.appendChild(e)}var ge={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"};import{attachScrollArrow as La,isCalendarFormat as Ma,SCROLL_ARROW_LABEL as Oa}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as $e,useRef as Ne,useState as za}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
+`,document.head.appendChild(e)}var ve={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"};import{attachScrollArrow as Ha,isCalendarFormat as Ba,SCROLL_ARROW_LABEL as Fa}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as Ve,useRef as Be,useState as Ka}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
  * Built-in appearance defaults \u2014 zero specificity via :where().
  * Consumer CSS always wins without !important.
  *
@@ -424,15 +446,14 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
 :where(.magicx-aia[data-mode="light"]) {
   --aia-surface: var(--aia-primitive-neutral-1000);
   --aia-border: rgba(17, 24, 39, 0.14); /* subtle slate hairline (off-palette) */
-  /* Elevation for the input container (.inputWrapper). */
-  --aia-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(16, 24, 40, 0.05),
-    0 8px 24px rgba(16, 24, 40, 0.08);
+  /* Flat by default \u2014 no elevation on the input container. Consumers set
+     --aia-shadow to add one. */
+  --aia-shadow: none;
   /* Half-strength stroke: neutral-900 (was #e5e7eb \u2014 snapped to palette,
      \u03942) at 50% alpha over the surface, so the hairline lands exactly
      halfway between its old value and the white behind it. */
   --aia-dropdown-border: var(--aia-primitive-neutral-900-a50);
-  --aia-dropdown-shadow: 0 8px 12px rgba(0, 0, 0, 0.05);
+  --aia-dropdown-shadow: none; /* flat by default */
   /* Suggestion pills (Figma "ParamPill"): transparent fill, no visible border;
      per-pill opacity via getPillOpacity. */
   --aia-pill-bg: var(--aia-primitive-neutral-750);
@@ -479,15 +500,13 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
 :where(.magicx-aia[data-mode="dark"]) {
   --aia-surface: var(--aia-primitive-neutral-0);
   --aia-border: var(--aia-primitive-neutral-500);
-  /* Elevation for the input container (.inputWrapper) \u2014 tuned for dark surfaces:
-     a faint top highlight + deeper ambient shadows. */
-  --aia-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 1px 2px rgba(0, 0, 0, 0.2),
-    0 8px 24px rgba(0, 0, 0, 0.25);
+  /* Flat by default \u2014 no elevation on the input container. Consumers set
+     --aia-shadow to add one. */
+  --aia-shadow: none;
   /* Half-strength stroke \u2014 neutral-400 (was #484848 \u2014 snapped to palette,
      \u03942) at 50% alpha; see the light-mode note above. */
   --aia-dropdown-border: var(--aia-primitive-neutral-400-a50);
-  --aia-dropdown-shadow: 0 8px 12px rgba(0, 0, 0, 0.05);
+  --aia-dropdown-shadow: none; /* flat by default */
   /* Suggestion pills (Figma "ParamPill"): transparent fill, no visible border. */
   --aia-pill-bg: var(--aia-primitive-neutral-750);
   --aia-pill-color: var(--aia-primitive-neutral-700);
@@ -547,7 +566,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
      (the kbd is shorter and centers against it). The band derives from it, so
      restyling the badge's height keeps the overlap in step. */
   --aia-footer-row-height: 23px;
-  --aia-footer-band: calc(var(--aia-footer-gap, 8px) + var(--aia-footer-row-height, 23px));
+  --aia-footer-band: calc(var(--aia-footer-gap, 12px) + var(--aia-footer-row-height, 23px));
   --aia-grid-scroll-bottom: var(--aia-footer-band);
   --aia-grid-overlap-bottom: calc(-1 * (var(--aia-footer-band) + 8px));
   /* How far above the band the fade starts. */
@@ -679,7 +698,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
    bottom edge \u2014 the side the option rows scroll under. */
 :where(.magicx-aia[data-options-position="above"]) [data-aia-dropdown] [data-aia-footer],
 [data-aia-dropdown][data-options-position="above"] [data-aia-footer] {
-  padding: 0 0 var(--aia-footer-gap, 8px) 8px;
+  padding: 0 0 var(--aia-footer-gap, 12px) 8px;
 }
 
 /* ...and the fade runs the other way, out of the footer and down into the list. */
@@ -750,8 +769,9 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
      frosted-glass look with data-aia-surface="glass". */
   background: var(--aia-surface, #ffffff);
   border: 1px solid var(--aia-dropdown-border, rgba(231, 231, 231, 0.5));
-  border-radius: 18px;
-  box-shadow: var(--aia-dropdown-shadow, 0 8px 12px rgba(0, 0, 0, 0.05));
+  border-radius: 9px;
+  /* Flat by default; consumers can set --aia-dropdown-shadow for elevation. */
+  box-shadow: var(--aia-dropdown-shadow, none);
 }
 
 /* A calendar has nothing wide to read, so the whole panel narrows with it \u2014
@@ -774,8 +794,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
     hsla(0, 0%, 100%, 0.15) 0px -1.6px 0px -1.6px inset,
     hsla(0, 0%, 100%, 0.3) 0px 1.6px 0px 0px inset,
     hsla(0, 0%, 100%, 0.3) 1.6px 0px 0px 0px inset,
-    inset 0 0 30px 5px hsla(0, 0%, 0%, 0.05),
-    hsla(0, 0%, 0%, 0.08) 0px 0px 30px 2px;
+    inset 0 0 30px 5px hsla(0, 0%, 0%, 0.05);
   backdrop-filter: blur(30px);
 }
 
@@ -995,7 +1014,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
     opacity: 0.25;
   }
 }
-`,document.head.appendChild(e)}var re={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",skeletonBar:"aia-skeletonBar-O3xIx",aiaSkeletonPulse:"aia-aiaSkeletonPulse-G8W7q"};import{cellDay as Ut,cellIso as we,dateCellMarks as jt,isoDate as $t,monthLabel as Vt,visibleDateRange as Qt,WEEKDAY_LABELS as Zt}from"@magicx-eng/ai-autocomplete-vanilla";import{useState as Yt}from"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) ---
+`,document.head.appendChild(e)}var le={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",skeletonBar:"aia-skeletonBar-O3xIx",aiaSkeletonPulse:"aia-aiaSkeletonPulse-G8W7q"};import{cellDay as Yt,cellIso as ke,dateCellMarks as $t,isoDate as Vt,monthLabel as Zt,visibleDateRange as Xt,WEEKDAY_LABELS as Jt}from"@magicx-eng/ai-autocomplete-vanilla";import{useState as ea}from"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) ---
 
    One of three hand-maintained copies (vanilla styles.css, this file, Angular's
    date-grid.component.css). Only the class-naming layer differs \u2014 the
@@ -1158,7 +1177,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
   opacity: 0.8;
   background: rgba(var(--aia-streak-rgb, 255, 255, 255), 0.06);
 }
-`,document.head.appendChild(e)}var E={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"};import{jsx as Q,jsxs as rt}from"react/jsx-runtime";var Xt=["sunday","monday","tuesday","wednesday","thursday","friday","saturday"];function st({options:e,activeIndex:r,listboxId:a,view:n,selection:s,onSelect:i,onHighlight:o,onPreviousMonth:g,onNextMonth:b}){let p=$t(new Date),x=Qt({pendingStart:s.rangeStart,highlightedIso:we(e[r]),selected:s.selectedRange});return rt("div",{className:E.datepicker,"data-aia-datepicker":"",children:[rt("div",{className:E.header,children:[Q("button",{type:"button",tabIndex:-1,className:E.nav,"data-aia-date-prev":"","aria-label":"Previous month",onMouseDown:u=>u.preventDefault(),onClick:g,children:"\u2039"}),Q("span",{className:E.month,"data-aia-date-month":"","aria-live":"polite",children:Vt(n)}),Q("button",{type:"button",tabIndex:-1,className:E.nav,"data-aia-date-next":"","aria-label":"Next month",onMouseDown:u=>u.preventDefault(),onClick:b,children:"\u203A"})]}),Q("div",{className:E.weekdays,"aria-hidden":"true",children:Zt.map((u,y)=>Q("span",{className:E.weekday,children:u},Xt[y]))}),Q("div",{className:E.grid,"data-aia-date-grid":"",children:e.map((u,y)=>Q(Jt,{option:u,id:`${a}-option-${y}`,index:y,isHighlighted:y===r&&u.is_tappable,isToday:we(u)===p,isPast:we(u)!=null&&we(u)<p,marks:jt(we(u),{selectedIso:s.selectedIso,range:x}),onSelect:i,onHighlight:o},we(u)??`pad-${y}`))})]})}function Jt({option:e,id:r,index:a,isHighlighted:n,isToday:s,isPast:i,marks:o,onSelect:g,onHighlight:b}){let[p,x]=Yt(!1),u=Ut(e);if(u==null)return Q("div",{id:r,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-hidden":"true","aria-selected":!1,tabIndex:-1,className:`${E.cell} ${E.blank}`});let y=()=>{x(!0),g(e),setTimeout(()=>x(!1),170)},k=[E.cell,E.day,i?E.past:"",n?E.highlighted:"",s?E.today:"",o.inRange?E.inRange:"",o.selected?E.selected:"",p?E.pressed:""].filter(Boolean).join(" ");return Q("div",{id:r,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-selected":n,"aria-label":e.text,tabIndex:0,className:k,onClick:y,onKeyDown:v=>{(v.key==="Enter"||v.key===" ")&&(v.preventDefault(),y())},onMouseEnter:()=>b(a),children:Q("span",{className:E.number,children:u})})}import{ATTRIBUTION_URL as ea,buildAttributionUrl as ta,getFooterHint as aa}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as ia,useState as oa}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-5259a217")){let e=document.createElement("style");e.id="ac-style-5259a217",e.textContent=`.aia-cluster {
+`,document.head.appendChild(e)}var T={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"};import{jsx as Y,jsxs as dt}from"react/jsx-runtime";var ta=["sunday","monday","tuesday","wednesday","thursday","friday","saturday"];function ct({options:e,activeIndex:n,listboxId:i,view:r,selection:s,onSelect:a,onHighlight:o,onPreviousMonth:u,onNextMonth:v}){let f=Vt(new Date),w=Xt({pendingStart:s.rangeStart,highlightedIso:ke(e[n]),selected:s.selectedRange});return dt("div",{className:T.datepicker,"data-aia-datepicker":"",children:[dt("div",{className:T.header,children:[Y("button",{type:"button",tabIndex:-1,className:T.nav,"data-aia-date-prev":"","aria-label":"Previous month",onMouseDown:p=>p.preventDefault(),onClick:u,children:"\u2039"}),Y("span",{className:T.month,"data-aia-date-month":"","aria-live":"polite",children:Zt(r)}),Y("button",{type:"button",tabIndex:-1,className:T.nav,"data-aia-date-next":"","aria-label":"Next month",onMouseDown:p=>p.preventDefault(),onClick:v,children:"\u203A"})]}),Y("div",{className:T.weekdays,"aria-hidden":"true",children:Jt.map((p,k)=>Y("span",{className:T.weekday,children:p},ta[k]))}),Y("div",{className:T.grid,"data-aia-date-grid":"",children:e.map((p,k)=>Y(aa,{option:p,id:`${i}-option-${k}`,index:k,isHighlighted:k===n&&p.is_tappable,isToday:ke(p)===f,isPast:ke(p)!=null&&ke(p)<f,marks:$t(ke(p),{selectedIso:s.selectedIso,range:w}),onSelect:a,onHighlight:o},ke(p)??`pad-${k}`))})]})}function aa({option:e,id:n,index:i,isHighlighted:r,isToday:s,isPast:a,marks:o,onSelect:u,onHighlight:v}){let[f,w]=ea(!1),p=Yt(e);if(p==null)return Y("div",{id:n,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-hidden":"true","aria-selected":!1,tabIndex:-1,className:`${T.cell} ${T.blank}`});let k=()=>{w(!0),u(e),setTimeout(()=>w(!1),170)},P=[T.cell,T.day,a?T.past:"",r?T.highlighted:"",s?T.today:"",o.inRange?T.inRange:"",o.selected?T.selected:"",f?T.pressed:""].filter(Boolean).join(" ");return Y("div",{id:n,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-selected":r,"aria-label":e.text,tabIndex:0,className:P,onClick:k,onKeyDown:y=>{(y.key==="Enter"||y.key===" ")&&(y.preventDefault(),k())},onMouseEnter:()=>v(i),children:Y("span",{className:T.number,children:p})})}import{ATTRIBUTION_URL as ia,buildAttributionUrl as oa,getFooterHint as na}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as ra,useState as sa}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-5259a217")){let e=document.createElement("style");e.id="ac-style-5259a217",e.textContent=`.aia-cluster {
   display: flex;
   flex-wrap: wrap;
   gap: var(--aia-cluster-gap, 0.5rem);
@@ -1198,7 +1217,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
 .aia-cluster[data-justify="around"] {
   justify-content: space-around;
 }
-`,document.head.appendChild(e)}import{jsx as lt}from"react/jsx-runtime";function Pe({gap:e,align:r="center",justify:a="start",noWrap:n=!1,inline:s=!1,className:i,children:o,...g}){let b=e?{"--aia-cluster-gap":e}:void 0,p={className:i?`aia-cluster ${i}`:"aia-cluster","data-align":r,"data-justify":a,"data-nowrap":n||void 0,"data-inline":s||void 0,style:b,...g};return s?lt("span",{...p,children:o}):lt("div",{...p,children:o})}if(typeof document<"u"&&!document.getElementById("ac-style-56b0c577")){let e=document.createElement("style");e.id="ac-style-56b0c577",e.textContent=`/* The footer adds its own 8px horizontal inset so it stays clear of the
+`,document.head.appendChild(e)}import{jsx as pt}from"react/jsx-runtime";function Te({gap:e,align:n="center",justify:i="start",noWrap:r=!1,inline:s=!1,className:a,children:o,...u}){let v=e?{"--aia-cluster-gap":e}:void 0,f={className:a?`aia-cluster ${a}`:"aia-cluster","data-align":n,"data-justify":i,"data-nowrap":r||void 0,"data-inline":s||void 0,style:v,...u};return s?pt("span",{...f,children:o}):pt("div",{...f,children:o})}if(typeof document<"u"&&!document.getElementById("ac-style-56b0c577")){let e=document.createElement("style");e.id="ac-style-56b0c577",e.textContent=`/* The footer adds its own 8px horizontal inset so it stays clear of the
    dropdown's rounded edges. The top inset (--aia-footer-gap) adds breathing
    room above the hint/branding row so the footer doesn't butt against the last
    option row \u2014 additive to the dropdown's 8px section gap. */
@@ -1210,7 +1229,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
      badge sits as far from the right edge as it does from the bottom \u2014 12px
      both ways (dropdown padding 10 + pill 2 down, dropdown padding 8 + pill 4
      across). */
-  padding: var(--aia-footer-gap, 8px) 0 0 8px;
+  padding: var(--aia-footer-gap, 12px) 0 0 8px;
   /* The fade itself lives in appearance.css, on the footer's background.
      Paints above the rows it covers: option content sits at z-index 2 (see
      SuggestionItem.module.css) in this same stacking context, so anything
@@ -1332,7 +1351,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
     justify-content: flex-end;
   }
 }
-`,document.head.appendChild(e)}var se={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"};import{jsx as Se,jsxs as Ge}from"react/jsx-runtime";function dt({isOptionHighlighted:e=!1,isInputEmpty:r=!1}){let{key:a,hint:n}=aa(e,r),[s,i]=oa(ea);return ia(()=>{i(ta())},[]),Se("footer",{className:se.footer,"data-aia-footer":"",children:Ge(Pe,{justify:"between",noWrap:!0,className:se.row,children:[Ge(Pe,{gap:"5px",className:se.hintGroup,children:[Se("kbd",{className:se.key,children:a}),Se("span",{className:se.hint,children:n})]}),Ge("a",{className:se.brandLink,href:s,target:"_blank",rel:"noopener noreferrer",children:[Se("span",{className:se.brand,children:"AI"}),Se("span",{className:se.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,
+`,document.head.appendChild(e)}var de={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"};import{jsx as Ae,jsxs as qe}from"react/jsx-runtime";function ht({isOptionHighlighted:e=!1,isInputEmpty:n=!1}){let{key:i,hint:r}=na(e,n),[s,a]=sa(ia);return ra(()=>{a(oa())},[]),Ae("footer",{className:de.footer,"data-aia-footer":"",children:qe(Te,{justify:"between",noWrap:!0,className:de.row,children:[qe(Te,{gap:"5px",className:de.hintGroup,children:[Ae("kbd",{className:de.key,children:i}),Ae("span",{className:de.hint,children:r})]}),qe("a",{className:de.brandLink,href:s,target:"_blank",rel:"noopener noreferrer",children:[Ae("span",{className:de.brand,children:"AI"}),Ae("span",{className:de.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,
    no outline. ~28px via 6px padding + 14px text + the 1px border (border-box).
    The border is kept as a 1px transparent line so the box stays the same size
    as it was when the outline was dashed. */
@@ -1389,7 +1408,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
     opacity: 0;
   }
 }
-`,document.head.appendChild(e)}var ue={pill:"aia-pill-6Ga7S",fadeIn:"aia-fadeIn-Ux4eQ",rounded:"aia-rounded-y7xA9",skeleton:"aia-skeleton-57P0T",skeletonPulse:"aia-skeletonPulse-xGcUy"};import{jsx as na}from"react/jsx-runtime";var _e={selected:1,first:.7,next:.4,last:.2};function ct({label:e,state:r,rounded:a,loading:n,onClick:s}){let i=[ue.pill,a?ue.rounded:"",n?ue.skeleton:""].filter(Boolean).join(" ");return na("button",{type:"button","data-aia-pill":"","data-aia-loading":n?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:i,style:{opacity:_e[r]},onMouseDown:o=>o.preventDefault(),onClick:n?void 0:s,disabled:n,children:e})}if(typeof document<"u"&&!document.getElementById("ac-style-0fcb7940")){let e=document.createElement("style");e.id="ac-style-0fcb7940",e.textContent=`.aia-list-qvLqO {
+`,document.head.appendChild(e)}var ge={pill:"aia-pill-6Ga7S",fadeIn:"aia-fadeIn-Ux4eQ",rounded:"aia-rounded-y7xA9",skeleton:"aia-skeleton-57P0T",skeletonPulse:"aia-skeletonPulse-xGcUy"};import{jsx as la}from"react/jsx-runtime";var Ue={selected:1,first:.7,next:.4,last:.2};function ut({label:e,state:n,rounded:i,loading:r,onClick:s}){let a=[ge.pill,i?ge.rounded:"",r?ge.skeleton:""].filter(Boolean).join(" ");return la("button",{type:"button","data-aia-pill":"","data-aia-loading":r?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:a,style:{opacity:Ue[n]},onMouseDown:o=>o.preventDefault(),onClick:r?void 0:s,disabled:r,children:e})}if(typeof document<"u"&&!document.getElementById("ac-style-0fcb7940")){let e=document.createElement("style");e.id="ac-style-0fcb7940",e.textContent=`.aia-list-qvLqO {
   position: relative;
   z-index: 1;
   pointer-events: auto;
@@ -1399,7 +1418,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
   align-items: center;
   vertical-align: middle;
 }
-`,document.head.appendChild(e)}var qe={list:"aia-list-qvLqO"};import{jsx as Me}from"react/jsx-runtime";var ra=[125,69];function pt(e){return e===0?"first":e===1?"next":"last"}function Oe({pills:e,activePillIndex:r,onSelectPill:a,activeSelected:n,rounded:s,loading:i}){return i&&e.length===0?Me("span",{className:qe.list,"data-aia-pill-list-loading":"",children:ra.map((o,g)=>Me("span",{"data-aia-pill-skeleton":"",className:`${ue.pill} ${s?ue.rounded:""} ${ue.skeleton}`,style:{width:o,opacity:_e[pt(g)]}},`skel-${o}`))}):Me("span",{className:qe.list,"data-aia-pill-list-loading":i?"":void 0,children:e.map((o,g)=>{let b=!!n&&g===r;return Me(ct,{label:o.text,state:b?"selected":pt(g),selected:b,rounded:s,loading:i,onClick:()=>a(g)},`${o.type}-${o.text}`)})})}import{attachProductRowWheel as sa}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as la,useRef as da}from"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
+`,document.head.appendChild(e)}var je={list:"aia-list-qvLqO"};import{jsx as Ne}from"react/jsx-runtime";var da=[125,69];function mt(e){return e===0?"first":e===1?"next":"last"}function He({pills:e,activePillIndex:n,onSelectPill:i,activeSelected:r,rounded:s,loading:a}){return a&&e.length===0?Ne("span",{className:je.list,"data-aia-pill-list-loading":"",children:da.map((o,u)=>Ne("span",{"data-aia-pill-skeleton":"",className:`${ge.pill} ${s?ge.rounded:""} ${ge.skeleton}`,style:{width:o,opacity:Ue[mt(u)]}},`skel-${o}`))}):Ne("span",{className:je.list,"data-aia-pill-list-loading":a?"":void 0,children:e.map((o,u)=>{let v=!!r&&u===n;return Ne(ut,{label:o.text,state:v?"selected":mt(u),selected:v,rounded:s,loading:a,onClick:()=>i(u)},`${o.type}-${o.text}`)})})}import{attachProductRowWheel as ca}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as pa,useRef as ha}from"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
    (packages/vanilla/src/styles.css). Same tokens, same defaults, so a consumer
    theming one package sees the same result in the other.
 
@@ -1617,7 +1636,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
 .aia-section-Hugfg[data-aia-products-layout="list"] .aia-body-ly032 {
   flex: 1 1 auto;
 }
-`,document.head.appendChild(e)}var _={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"};import{jsx as fe,jsxs as Ue}from"react/jsx-runtime";function ht({products:e,listboxId:r,onSelect:a,onFocusChange:n,focusable:s=!0,layout:i="row"}){let o=e.length>0,g=da(null);if(la(()=>{let p=g.current;if(!(!o||!p))return sa(p)},[o]),!o)return null;let b=`${r}-products-label`;return Ue("section",{className:_.section,"data-aia-products":"","data-aia-products-layout":i,role:"group","aria-labelledby":b,children:[fe("div",{className:_.label,id:b,"data-aia-products-label":"",children:"Products"}),fe("div",{ref:g,className:_.row,"data-aia-products-row":"",children:e.map((p,x)=>fe(ca,{product:p,id:`${r}-product-${x}`,onSelect:a,onFocusChange:n,focusable:s},p.id))})]})}function ca({product:e,id:r,onSelect:a,onFocusChange:n,focusable:s}){let i=o=>{o.metaKey||o.ctrlKey||o.shiftKey||o.altKey||o.button!==0||(o.preventDefault(),a(e))};return Ue("a",{id:r,className:_.card,"data-aia-product":"",role:"option","aria-selected":!1,href:e.url,tabIndex:s?0:-1,onClick:i,onKeyDown:o=>{o.key!=="Enter"&&o.key!==" "||(o.preventDefault(),a(e))},onFocus:()=>n?.(!0),onBlur:o=>{o.relatedTarget?.closest("[data-aia-dropdown]")||n?.(!1)},children:[fe("span",{className:_.media,"data-aia-product-placeholder":e.imageUrl?void 0:"",children:e.imageUrl?fe("img",{className:_.image,src:e.imageUrl,alt:"",loading:"lazy",decoding:"async"}):null}),Ue("span",{className:_.body,children:[e.vendor?fe("span",{className:_.vendor,children:e.vendor}):null,fe("span",{className:_.title,children:e.title}),e.price?fe("span",{className:_.price,children:e.price}):null]})]})}import{isOptionsGridMobileViewport as ka,measureOptionsGrid as Ca,needsOptionsGridMeasurement as Pa,OPTIONS_GRID_MOBILE_QUERY as Sa,optionEnterDelayMs as Ea,planOptionsGrid as gt}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as Ia,useLayoutEffect as Ta,useRef as Aa,useState as vt}from"react";import{optionsGridTemplateColumns as pa}from"@magicx-eng/ai-autocomplete-vanilla";import{useLayoutEffect as ha,useRef as ua}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-948e58da")){let e=document.createElement("style");e.id="ac-style-948e58da",e.textContent=`.aia-grid {
+`,document.head.appendChild(e)}var j={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"};import{jsx as be,jsxs as Qe}from"react/jsx-runtime";function ft({products:e,listboxId:n,onSelect:i,onFocusChange:r,focusable:s=!0,layout:a="row"}){let o=e.length>0,u=ha(null);if(pa(()=>{let f=u.current;if(!(!o||!f))return ca(f)},[o]),!o)return null;let v=`${n}-products-label`;return Qe("section",{className:j.section,"data-aia-products":"","data-aia-products-layout":a,role:"group","aria-labelledby":v,children:[be("div",{className:j.label,id:v,"data-aia-products-label":"",children:"Products"}),be("div",{ref:u,className:j.row,"data-aia-products-row":"",children:e.map((f,w)=>be(ua,{product:f,id:`${n}-product-${w}`,onSelect:i,onFocusChange:r,focusable:s},f.id))})]})}function ua({product:e,id:n,onSelect:i,onFocusChange:r,focusable:s}){let a=o=>{o.metaKey||o.ctrlKey||o.shiftKey||o.altKey||o.button!==0||(o.preventDefault(),i(e))};return Qe("a",{id:n,className:j.card,"data-aia-product":"",role:"option","aria-selected":!1,href:e.url,tabIndex:s?0:-1,onClick:a,onKeyDown:o=>{o.key!=="Enter"&&o.key!==" "||(o.preventDefault(),i(e))},onFocus:()=>r?.(!0),onBlur:o=>{o.relatedTarget?.closest("[data-aia-dropdown]")||r?.(!1)},children:[be("span",{className:j.media,"data-aia-product-placeholder":e.imageUrl?void 0:"",children:e.imageUrl?be("img",{className:j.image,src:e.imageUrl,alt:"",loading:"lazy",decoding:"async"}):null}),Qe("span",{className:j.body,children:[e.vendor?be("span",{className:j.vendor,children:e.vendor}):null,be("span",{className:j.title,children:e.title}),e.price?be("span",{className:j.price,children:e.price}):null]})]})}import{isOptionsGridMobileViewport as Ea,measureOptionsGrid as Ta,needsOptionsGridMeasurement as Aa,OPTIONS_GRID_MOBILE_QUERY as Ra,optionEnterDelayMs as Da,planOptionsGrid as vt}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as La,useLayoutEffect as Oa,useRef as Ma,useState as xt}from"react";import{optionsGridTemplateColumns as ma}from"@magicx-eng/ai-autocomplete-vanilla";import{useLayoutEffect as fa,useRef as ga}from"react";if(typeof document<"u"&&!document.getElementById("ac-style-948e58da")){let e=document.createElement("style");e.id="ac-style-948e58da",e.textContent=`.aia-grid {
   display: grid;
   grid-template-columns: repeat(
       auto-fit,
@@ -1650,7 +1669,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
   background: var(--aia-scrollbar-thumb, rgba(0, 0, 0, 0.3));
   border-radius: 3px;
 }
-`,document.head.appendChild(e)}import{jsx as fa}from"react/jsx-runtime";function ut({min:e="16rem",max:r,gap:a,scroll:n=!1,maxHeight:s,scrollResetKey:i,cols:o,template:g,innerRef:b,className:p,children:x,...u}){let y=ua(null);ha(()=>{if(i===void 0)return;let v=y.current;v&&(v.scrollTop=0)},[i]);let k={"--aia-grid-min":e};return r&&(k["--aia-grid-max"]=r),a&&(k["--aia-grid-gap"]=a),s&&(k["--aia-grid-max-height"]=s),o&&(k.gridTemplateColumns=pa(o)),g&&(k.gridTemplateColumns=g),fa("div",{ref:v=>{y.current=v,b?.(v)},className:p?`aia-grid ${p}`:"aia-grid","data-scroll":n||void 0,style:k,...u,children:x})}import{OPTION_ENTER_DELAY_VAR as ma,optionLabel as ga,sanitizeOptionIconSvg as ba}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as va,useMemo as wa,useRef as xa,useState as ft}from"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 {
+`,document.head.appendChild(e)}import{jsx as ba}from"react/jsx-runtime";function gt({min:e="16rem",max:n,gap:i,scroll:r=!1,maxHeight:s,scrollResetKey:a,cols:o,template:u,innerRef:v,className:f,children:w,...p}){let k=ga(null);fa(()=>{if(a===void 0)return;let y=k.current;y&&(y.scrollTop=0)},[a]);let P={"--aia-grid-min":e};return n&&(P["--aia-grid-max"]=n),i&&(P["--aia-grid-gap"]=i),s&&(P["--aia-grid-max-height"]=s),o&&(P.gridTemplateColumns=ma(o)),u&&(P.gridTemplateColumns=u),ba("div",{ref:y=>{k.current=y,v?.(y)},className:f?`aia-grid ${f}`:"aia-grid","data-scroll":r||void 0,style:P,...p,children:w})}import{formatOptionCount as va,OPTION_ENTER_DELAY_VAR as wa,optionImageSrc as xa,optionLabel as ya,sanitizeOptionIconSvg as ka}from"@magicx-eng/ai-autocomplete-vanilla";import{useEffect as Ca,useMemo as Pa,useRef as Sa,useState as Ye}from"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 {
   position: relative;
   /* Clip, not visible: the entrance rise below runs on the inner content,
      and a transformed box extends its scroll container's scrollable area.
@@ -1678,13 +1697,13 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
      SuggestionItem selection. The 9px/10px inset is the item's own padding. */
   border-radius: 8px;
   padding: 8px 10px;
-  /* Entrance: fade in while rising into place, each row a beat after the one
-     before it (--aia-option-enter-delay is set inline per row from the core's
-     optionEnterDelayMs). The fade is here; the rise is on the inner content
-     (see the overflow note above). The durations and distance mirror
-     OPTION_ENTER_* in the core's derive/optionsEntrance.ts \u2014 change both together. */
-  animation: aia-fadeIn-I8u35 150ms ease-out both;
-  animation-delay: var(--aia-option-enter-delay, 0ms);
+  /* No entrance animation on the row itself \u2014 deliberately. The row is the
+     tappable element, and iOS Safari drops a tap on a scripted-clickable
+     element (a div with a click handler; a native button is exempt) whose
+     own opacity is mid-animation \u2014 its tap-or-hover pass counts the change
+     as content moving under the finger, fires only the hover events (the
+     row highlights) and never the click. Both halves of the entrance run
+     on the inner content instead (next rule). */
 }
 
 @keyframes aia-fadeIn-I8u35 {
@@ -1710,9 +1729,17 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
 .aia-content-T-Qba {
   position: relative;
   z-index: 2;
-  /* The entrance rise (the cell above keeps the fade). Inherits the cell's
-     per-row delay through the custom property. */
-  animation: aia-riseIn-etXZT 280ms cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
+  /* The entrance: fade in while rising into place, each row a beat after the
+     one before it (--aia-option-enter-delay is set inline per row from the
+     core's optionEnterDelayMs). Both run here, on the inner content, never on
+     the row: the rise because a transformed cell extends the grid's
+     scrollable area (see the overflow note on the row), the fade because iOS
+     Safari drops a tap on a tappable element whose own opacity is animating
+     (see the row's own comment). The durations and distance mirror
+     OPTION_ENTER_* in the core's derive/optionsEntrance.ts \u2014 change both together. */
+  animation:
+    aia-riseIn-etXZT 280ms cubic-bezier(0.25, 0.46, 0.45, 0.94) both,
+    aia-fadeIn-I8u35 150ms ease-out both;
   animation-delay: var(--aia-option-enter-delay, 0ms);
 }
 
@@ -1841,11 +1868,115 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
    first line's text rather than under the icon. \`.content\` is a flex item
    (blockified), so text-indent applies to it directly. Skeleton rows keep
    it too: their icon is hidden but still occupies its column. */
-.aia-content-T-Qba:has(.aia-icon-Qw938) {
+.aia-content-T-Qba:not(:has(.aia-count-IpYbQ)):has(.aia-icon-Qw938) {
   padding-left: calc(1em + 8px);
   text-indent: calc(-1em - 8px);
 }
 
+/* --- Option pictures and counts ---
+   A row that carries a thumbnail (\`image_url\`) or a count (\`item_count\`) lays
+   its content out as a flex row instead of inline flow: the text becomes its
+   own box, so wrapped lines start under the first line without the hanging
+   indent, and the count can sit at the trailing edge. It also fills the row \u2014
+   the content is a flex item of the row that would otherwise shrink to its
+   text, leaving the count's auto margin nothing to push against. The inline
+   flow is kept for every other row, so nothing existing moves. */
+.aia-content-T-Qba:has(.aia-image-YZAbO),
+.aia-content-T-Qba:has(.aia-count-IpYbQ) {
+  display: flex;
+  flex: 1 1 auto;
+  align-items: flex-start;
+  min-width: 0;
+}
+
+.aia-content-T-Qba:has(.aia-image-YZAbO) .aia-text-yqoh9,
+.aia-content-T-Qba:has(.aia-count-IpYbQ) .aia-text-yqoh9 {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+/* The picture: a square tile, centred on the text beside it (a one-line
+   option reads as the reference row; a wrapped one keeps the tile on its
+   vertical middle). Sized and rounded by token so a consumer can shrink it
+   or square it off; the placeholder fill shows through until the picture
+   paints and stays if it never does. */
+.aia-content-T-Qba:has(.aia-image-YZAbO) {
+  align-items: center;
+  gap: var(--aia-option-image-gap, 12px);
+}
+
+.aia-image-YZAbO {
+  flex: 0 0 auto;
+  display: block;
+  width: var(--aia-option-image-size, 40px);
+  height: var(--aia-option-image-size, 40px);
+  border-radius: var(--aia-option-image-radius, 12px);
+  overflow: hidden;
+  background: var(--aia-option-image-bg, var(--aia-pill-bg, rgba(189, 189, 189, 0.25)));
+}
+
+.aia-image-YZAbO img {
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+/* A picture that failed to load hides itself with the \`hidden\` attribute.
+   The tile's \`display: block\` above would win over the browser's own
+   \`[hidden] { display: none }\` (an author rule beats a user-agent rule at
+   any specificity), so the attribute is honoured here explicitly. */
+.aia-image-YZAbO img[hidden] {
+  display: none;
+}
+
+/* The count: a muted, tabular label at the trailing edge, on the first
+   line's baseline. Never wraps \u2014 a long option wraps its text instead. */
+.aia-count-IpYbQ {
+  flex: 0 0 auto;
+  margin-left: auto;
+  padding-left: 12px;
+  font-size: var(--aia-option-count-font-size, 12px);
+  font-weight: 400;
+  line-height: 21px; /* = the option's line-height */
+  font-variant-numeric: tabular-nums;
+  white-space: nowrap;
+  color: var(--aia-option-count-color, inherit);
+  opacity: var(--aia-option-count-opacity, 0.6);
+}
+
+/* The unit word after the number is a token, so a consumer names what is
+   being counted ("sneakers", "towels") or blanks it (an empty string) without
+   a render option. A count of one reads the singular token, which falls back
+   to the plural one, so a consumer who sets only \`--aia-option-count-unit\`
+   gets that word for every count. Generated content joins the row's
+   accessible name after the number, the way the word did as text. */
+.aia-count-IpYbQ::after {
+  content: " " var(--aia-option-count-unit, "items");
+}
+
+.aia-item-d4vpD[data-aia-item-count="1"] .aia-count-IpYbQ::after {
+  content: " " var(--aia-option-count-unit-one, var(--aia-option-count-unit, "item"));
+}
+
+/* Skeleton rows keep the tile (its placeholder fill pulses with the row)
+   but not the picture, and drop the count like the tag. */
+.aia-item-d4vpD[data-aia-loading] .aia-image-YZAbO img {
+  visibility: hidden;
+}
+
+.aia-item-d4vpD[data-aia-loading] .aia-count-IpYbQ {
+  display: none;
+}
+
+/* A grid of picture rows is taller per row: the visible-rows cap
+   (\`--aia-grid-max-height\`, computed from \`--aia-option-row-height\` by
+   planOptionsGrid) follows the tile's height plus the row's padding, so the
+   same number of rows shows before the list scrolls. */
+[data-aia-group]:has(.aia-image-YZAbO) {
+  --aia-option-row-height: calc(var(--aia-option-image-size, 40px) + 16px);
+}
+
 @keyframes aia-skeletonPulse-plvdD {
   0%,
   100% {
@@ -1855,7 +1986,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
     filter: brightness(0.55);
   }
 }
-`,document.head.appendChild(e)}var q={item:"aia-item-d4vpD",fadeIn:"aia-fadeIn-I8u35",content:"aia-content-T-Qba",riseIn:"aia-riseIn-etXZT",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",icon:"aia-icon-Qw938"};import{jsx as ze,jsxs as ya}from"react/jsx-runtime";function mt({option:e,isHighlighted:r,onSelect:a,onHighlight:n,id:s,loading:i,showIcon:o=!0,scrollHint:g,enterDelayMs:b=0}){let[p]=ft(b),[x,u]=ft(!1),y=wa(()=>o&&e.icon_svg?ba(e.icon_svg):null,[o,e.icon_svg]),k=xa(void 0);va(()=>()=>clearTimeout(k.current),[]);let v=()=>{i||!e.is_tappable||x||(u(!0),a(e),clearTimeout(k.current),k.current=setTimeout(()=>u(!1),170))},I=[q.item,r&&!i?q.highlighted:"",e.is_tappable?q.tappable:q.nonTappable,x?q.pressed:"",g?q.scrollHint:""].filter(Boolean).join(" ");return ze("div",{id:s,role:"option","data-aia-option":"","data-aia-loading":i?"":void 0,"data-aia-icon":y&&e.icon?e.icon:void 0,"aria-selected":r,className:I,style:{[ma]:`${p}ms`},tabIndex:i||!e.is_tappable?-1:0,onClick:v,onKeyDown:A=>{!i&&e.is_tappable&&(A.key==="Enter"||A.key===" ")&&(A.preventDefault(),v())},onMouseEnter:!i&&e.is_tappable?n:void 0,children:ya("span",{className:q.content,children:[y&&ze("span",{className:`${q.icon} magicx-aia-option-icon`,"aria-hidden":"true",dangerouslySetInnerHTML:{__html:y}}),ze("span",{className:q.text,children:ga(e)}),e.tag&&ze("span",{className:q.tag,children:e.tag})]})})}import{jsx as bt}from"react/jsx-runtime";function Ra(){let[e,r]=vt(ka);return Ia(()=>{if(typeof window>"u"||!window.matchMedia)return;let a=window.matchMedia(Sa),n=()=>r(a.matches);return n(),a.addEventListener("change",n),()=>a.removeEventListener("change",n)},[]),e}function wt({options:e,activeIndex:r,onSelect:a,onHighlight:n,listboxId:s,loading:i,groupKey:o="",optionsPosition:g="below",showIcons:b=!0}){let p=Ra(),x=Aa(null),[u,y]=vt(null);Ta(()=>{let v=x.current,A=v&&!i&&Pa(e.length,p)?Ca(v):null;y(A?gt(e.length,p,A.rowWidths,A.gridWidth):null)},[e,p,i]);let k=u??gt(e.length,p,null,null);return bt(ut,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:o,template:k.template,maxHeight:k.maxHeight,innerRef:v=>{x.current=v},"data-aia-group":o,children:e.map((v,I)=>bt(mt,{option:v,isHighlighted:I===r,onSelect:a,onHighlight:()=>n(I),id:`${s}-option-${I}`,loading:i,showIcon:b,scrollHint:!i&&k.scrollHintIndices.includes(I),enterDelayMs:i?0:Ea(I,k.cols,e.length,g)},`${o}\0${v.text}`))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`.aia-stack {
+`,document.head.appendChild(e)}var H={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",icon:"aia-icon-Qw938",count:"aia-count-IpYbQ",image:"aia-image-YZAbO"};import{jsx as we,jsxs as Ia}from"react/jsx-runtime";function bt({option:e,isHighlighted:n,onSelect:i,onHighlight:r,id:s,loading:a,showIcon:o=!0,showImage:u=!0,showCount:v=!0,scrollHint:f,enterDelayMs:w=0}){let[p]=Ye(w),[k,P]=Ye(!1),y=u?xa(e.image_url):null,[M,E]=Ye(null),S=Pa(()=>!y&&o&&e.icon_svg?ka(e.icon_svg):null,[y,o,e.icon_svg]),D=v?va(e.item_count):null,A=Sa(void 0);Ca(()=>()=>clearTimeout(A.current),[]);let O=()=>{a||!e.is_tappable||k||(P(!0),i(e),clearTimeout(A.current),A.current=setTimeout(()=>P(!1),170))},z=[H.item,n&&!a?H.highlighted:"",e.is_tappable?H.tappable:H.nonTappable,k?H.pressed:"",f?H.scrollHint:""].filter(Boolean).join(" ");return we("div",{id:s,role:"option","data-aia-option":"","data-aia-loading":a?"":void 0,"data-aia-icon":S&&e.icon?e.icon:void 0,"data-aia-image":y?"":void 0,"data-aia-item-count":D!==null?e.item_count:void 0,"aria-selected":n,className:z,style:{[wa]:`${p}ms`},tabIndex:a||!e.is_tappable?-1:0,onClick:O,onKeyDown:C=>{!a&&e.is_tappable&&(C.key==="Enter"||C.key===" ")&&(C.preventDefault(),O())},onMouseEnter:!a&&e.is_tappable?r:void 0,children:Ia("span",{className:H.content,children:[y&&we("span",{className:`${H.image} magicx-aia-option-image`,"aria-hidden":"true",children:we("img",{src:y,alt:"",loading:"lazy",decoding:"async",referrerPolicy:"no-referrer",draggable:!1,hidden:M===y,onError:()=>E(y)})}),S&&we("span",{className:`${H.icon} magicx-aia-option-icon`,"aria-hidden":"true",dangerouslySetInnerHTML:{__html:S}}),we("span",{className:H.text,children:ya(e)}),e.tag&&we("span",{className:H.tag,children:e.tag}),D!==null&&we("span",{className:`${H.count} magicx-aia-option-count`,children:D})]})})}import{jsx as wt}from"react/jsx-runtime";function za(){let[e,n]=xt(Ea);return La(()=>{if(typeof window>"u"||!window.matchMedia)return;let i=window.matchMedia(Ra),r=()=>n(i.matches);return r(),i.addEventListener("change",r),()=>i.removeEventListener("change",r)},[]),e}function yt({options:e,activeIndex:n,onSelect:i,onHighlight:r,listboxId:s,loading:a,groupKey:o="",optionsPosition:u="below",showIcons:v=!0,showImages:f=!0,showCounts:w=!0}){let p=za(),k=Ma(null),[P,y]=xt(null);Oa(()=>{let E=k.current,D=E&&!a&&Aa(e.length,p)?Ta(E):null;y(D?vt(e.length,p,D.rowWidths,D.gridWidth):null)},[e,p,a]);let M=P??vt(e.length,p,null,null);return wt(gt,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:o,template:M.template,maxHeight:M.maxHeight,innerRef:E=>{k.current=E},"data-aia-group":o,children:e.map((E,S)=>wt(bt,{option:E,isHighlighted:S===n,onSelect:i,onHighlight:()=>r(S),id:`${s}-option-${S}`,loading:a,showIcon:v,showImage:f,showCount:w,scrollHint:!a&&M.scrollHintIndices.includes(S),enterDelayMs:a?0:Da(S,M.cols,e.length,u)},`${o}\0${E.text}`))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`.aia-stack {
   display: flex;
   flex-direction: column;
   gap: var(--aia-stack-space, 0.5rem);
@@ -1870,7 +2001,7 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
   align-items: end;
 }
 /* data-align="stretch" is the flex default \u2014 no rule needed. */
-`,document.head.appendChild(e)}import{jsx as Da}from"react/jsx-runtime";function xt({space:e,align:r="stretch",className:a,children:n,...s}){let i=e?{"--aia-stack-space":e}:void 0;return Da("div",{className:a?`aia-stack ${a}`:"aia-stack","data-align":r,style:i,...s,children:n})}import{jsx as K,jsxs as je}from"react/jsx-runtime";var Na=[159,119,164],Ha=()=>{},yt=()=>{};function Ba(e){let r=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[a,n]=za(r);if($e(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let s=window.matchMedia("(prefers-color-scheme: dark)"),i=()=>n(s.matches);return s.addEventListener("change",i),()=>s.removeEventListener("change",i)},[e]),e!==void 0)return e==="auto"?a?"dark":"light":e}function Fa(e,r){let a=Ne(null);$e(()=>{let n=e.current,s=r.current;if(!n||!s)return;let i=n.querySelector(".aia-grid[data-scroll]");if(a.current&&a.current.grid!==i&&(a.current.controller.destroy(),a.current=null),i&&!a.current){a.current={grid:i,controller:La({dropdown:n,grid:i,button:s})};return}a.current?.controller.update()}),$e(()=>()=>{a.current?.controller.destroy(),a.current=null},[])}function Ve({suggestions:e,activeIndex:r,onSelect:a,onHighlight:n,isOpen:s,id:i,className:o,pills:g,onPillClick:b,showPills:p=!0,onSkip:x,showSkipButton:u=!0,showOptionIcons:y=!0,skipDisabled:k=!1,activeSelected:v=!1,isLoading:I=!1,isInputEmpty:A=!1,products:R,onProductSelect:D,onProductFocusChange:Z,productsLayout:L="row",formatType:P="options",dateView:j=null,selectedDateIso:le=null,selectedDateRange:Y=null,dateRangeStart:h=null,onPreviousMonth:de,onNextMonth:M,optionsPosition:X="below",mode:ce}){let J=Ba(ce),$=J!==void 0,ee=Ne(null),V=Ne(null);Fa(ee,V);let te=e[0]?.options??[],ae=!!(g&&g.length>0&&b),O=!!(R&&R.length>0),z=s&&(te.length>0||p&&ae||I||O),G={suggestions:e,activeIndex:r,pills:g,showPills:p,showSkipButton:u,showOptionIcons:y,skipDisabled:k,activeSelected:v,isLoading:I,isInputEmpty:A,products:R,formatType:P,dateView:j,selectedDateIso:le,selectedDateRange:Y,dateRangeStart:h},c=Ne(G);z&&(c.current=G);let t=z?G:c.current,f=t.suggestions[0],w=f?.options??[],l=t.activeIndex>=0&&!!w[t.activeIndex]?.is_tappable,S=!!(t.pills&&t.pills.length>0&&b),ie=t.showPills&&S,B=t.showPills&&!S&&t.isLoading,d=ie||B,oe=S&&t.showSkipButton&&!t.isInputEmpty&&!!x,me=t.pills?.[0]?.text,pe=Ma(t.formatType)&&t.dateView!=null,be=w.length>0&&!pe,ne=w.length>0&&pe&&!t.isLoading,ke=t.isLoading&&!be&&!ne,N=t.products??[];return je("div",{ref:ee,id:i,role:"listbox","data-aia-dropdown":"","data-options-position":X,"data-mode":J,"data-aia-loading":t.isLoading?"":void 0,"data-aia-has-products":N.length>0?"":void 0,className:`${$?"magicx-aia ":""}${re.dropdown} ${z?re.visible:""} ${o??""}`,onMouseDown:H=>H.preventDefault(),children:[je(xt,{space:"8px",children:[(d||oe)&&je(Pe,{noWrap:!0,className:re.pillBar,"data-aia-pillbar":"",children:[d&&K("span",{className:re.pillScroll,"data-aia-pill-scroll":"",children:K(Oe,{pills:t.pills??[],activePillIndex:0,activeSelected:t.activeSelected,onSelectPill:b??(()=>{}),rounded:!0,loading:t.isLoading})}),oe&&K("button",{type:"button",tabIndex:-1,className:re.skip,"data-aia-skip":"",disabled:t.isLoading||t.skipDisabled,"aria-label":me?`Skip ${me}`:"Skip",onClick:x,children:"skip"})]}),be&&K(wt,{options:w,activeIndex:t.activeIndex,onSelect:a,onHighlight:n,listboxId:i,loading:t.isLoading,groupKey:f?`${f.type} ${f.text}`:"",optionsPosition:X,showIcons:t.showOptionIcons}),ne&&t.dateView&&K(st,{options:w,activeIndex:t.activeIndex,listboxId:i,view:t.dateView,selection:{selectedIso:t.selectedDateIso??null,selectedRange:t.selectedDateRange??null,rangeStart:t.dateRangeStart??null},onSelect:a,onHighlight:n,onPreviousMonth:de??yt,onNextMonth:M??yt}),ke&&K("div",{className:re.skeletonBars,"data-aia-skeleton-bars":"",children:Na.map(H=>K("span",{className:re.skeletonBar,style:{width:H}},`bar-${H}`))}),K(ht,{products:N,listboxId:i,onSelect:D??Ha,onFocusChange:Z,focusable:z,layout:L}),K(dt,{isOptionHighlighted:l,isInputEmpty:t.isInputEmpty})]}),K("button",{ref:V,type:"button",tabIndex:-1,className:re.scrollArrow,"data-aia-scroll-arrow":"","aria-label":Oa,"aria-hidden":"true",children:K("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:K("path",{d:"M4 6.5 8 10.5l4-4"})})})]})}import{buildSubmitResult as Ya,ModeController as Xa,setCursorOffset as Ja}from"@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 {
+`,document.head.appendChild(e)}import{jsx as Na}from"react/jsx-runtime";function kt({space:e,align:n="stretch",className:i,children:r,...s}){let a=e?{"--aia-stack-space":e}:void 0;return Na("div",{className:i?`aia-stack ${i}`:"aia-stack","data-align":n,style:a,...s,children:r})}import{jsx as G,jsxs as $e}from"react/jsx-runtime";var Ga=[159,119,164],Wa=()=>{},Ct=()=>{};function _a(e){let n=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[i,r]=Ka(n);if(Ve(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let s=window.matchMedia("(prefers-color-scheme: dark)"),a=()=>r(s.matches);return s.addEventListener("change",a),()=>s.removeEventListener("change",a)},[e]),e!==void 0)return e==="auto"?i?"dark":"light":e}function qa(e,n){let i=Be(null);Ve(()=>{let r=e.current,s=n.current;if(!r||!s)return;let a=r.querySelector(".aia-grid[data-scroll]");if(i.current&&i.current.grid!==a&&(i.current.controller.destroy(),i.current=null),a&&!i.current){i.current={grid:a,controller:Ha({dropdown:r,grid:a,button:s})};return}i.current?.controller.update()}),Ve(()=>()=>{i.current?.controller.destroy(),i.current=null},[])}function Ze({suggestions:e,activeIndex:n,onSelect:i,onHighlight:r,isOpen:s,id:a,className:o,pills:u,onPillClick:v,showPills:f=!0,onSkip:w,showSkipButton:p=!0,showOptionIcons:k=!0,showOptionImages:P=!0,showOptionCounts:y=!0,skipDisabled:M=!1,activeSelected:E=!1,isLoading:S=!1,isInputEmpty:D=!1,products:A,onProductSelect:O,onProductFocusChange:z,productsLayout:C="row",formatType:$="options",dateView:V=null,selectedDateIso:ce=null,selectedDateRange:Z=null,dateRangeStart:h=null,onPreviousMonth:B,onNextMonth:pe,optionsPosition:X="below",mode:he}){let J=_a(he),ue=J!==void 0,_=Be(null),ee=Be(null);qa(_,ee);let te=e[0]?.options??[],ae=!!(u&&u.length>0&&v),ie=!!(A&&A.length>0),L=s&&(te.length>0||f&&ae||S||ie),l={suggestions:e,activeIndex:n,pills:u,showPills:f,showSkipButton:p,showOptionIcons:k,showOptionImages:P,showOptionCounts:y,skipDisabled:M,activeSelected:E,isLoading:S,isInputEmpty:D,products:A,formatType:$,dateView:V,selectedDateIso:ce,selectedDateRange:Z,dateRangeStart:h},g=Be(l);L&&(g.current=l);let t=L?l:g.current,x=t.suggestions[0],b=x?.options??[],c=t.activeIndex>=0&&!!b[t.activeIndex]?.is_tappable,F=!!(t.pills&&t.pills.length>0&&v),q=t.showPills&&F,oe=t.showPills&&!F&&t.isLoading,d=q||oe,ne=F&&t.showSkipButton&&!t.isInputEmpty&&!!w,me=t.pills?.[0]?.text,re=Ba(t.formatType)&&t.dateView!=null,xe=b.length>0&&!re,se=b.length>0&&re&&!t.isLoading,Se=t.isLoading&&!xe&&!se,U=t.products??[];return $e("div",{ref:_,id:a,role:"listbox","data-aia-dropdown":"","data-options-position":X,"data-mode":J,"data-aia-loading":t.isLoading?"":void 0,"data-aia-has-products":U.length>0?"":void 0,className:`${ue?"magicx-aia ":""}${le.dropdown} ${L?le.visible:""} ${o??""}`,onMouseDown:N=>N.preventDefault(),children:[$e(kt,{space:"8px",children:[(d||ne)&&$e(Te,{noWrap:!0,className:le.pillBar,"data-aia-pillbar":"",children:[d&&G("span",{className:le.pillScroll,"data-aia-pill-scroll":"",children:G(He,{pills:t.pills??[],activePillIndex:0,activeSelected:t.activeSelected,onSelectPill:v??(()=>{}),rounded:!0,loading:t.isLoading})}),ne&&G("button",{type:"button",tabIndex:-1,className:le.skip,"data-aia-skip":"",disabled:t.isLoading||t.skipDisabled,"aria-label":me?`Skip ${me}`:"Skip",onClick:w,children:"skip"})]}),xe&&G(yt,{options:b,activeIndex:t.activeIndex,onSelect:i,onHighlight:r,listboxId:a,loading:t.isLoading,groupKey:x?`${x.type} ${x.text}`:"",optionsPosition:X,showIcons:t.showOptionIcons,showImages:t.showOptionImages,showCounts:t.showOptionCounts}),se&&t.dateView&&G(ct,{options:b,activeIndex:t.activeIndex,listboxId:a,view:t.dateView,selection:{selectedIso:t.selectedDateIso??null,selectedRange:t.selectedDateRange??null,rangeStart:t.dateRangeStart??null},onSelect:i,onHighlight:r,onPreviousMonth:B??Ct,onNextMonth:pe??Ct}),Se&&G("div",{className:le.skeletonBars,"data-aia-skeleton-bars":"",children:Ga.map(N=>G("span",{className:le.skeletonBar,style:{width:N}},`bar-${N}`))}),G(ft,{products:U,listboxId:a,onSelect:O??Wa,onFocusChange:z,focusable:L,layout:C}),G(ht,{isOptionHighlighted:c,isInputEmpty:t.isInputEmpty})]}),G("button",{ref:ee,type:"button",tabIndex:-1,className:le.scrollArrow,"data-aia-scroll-arrow":"","aria-label":Fa,"aria-hidden":"true",children:G("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:G("path",{d:"M4 6.5 8 10.5l4-4"})})})]})}import{buildSubmitResult as ai,ModeController as ii,setCursorOffset as oi}from"@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 {
   flex-shrink: 0;
   width: 32px;
   height: 32px;
@@ -1923,5 +2054,5 @@ import{buildSubmitResult as jo,cellDay as $o,cellIso as Vo,DATE_RANGE_META_END a
   );
   cursor: default;
 }
-`,document.head.appendChild(e)}var kt={submitButton:"aia-submitButton-otz7H"};import{jsx as Qe}from"react/jsx-runtime";function Ct({disabled:e,onClick:r}){return Qe("button",{type:"button","data-aia-submit":"",className:kt.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),r()},"aria-label":"Submit",children:Qe("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:Qe("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}import{AIAutocomplete as Ka,dateSelectionFor as Wa,identifiedParamLabel as Ga}from"@magicx-eng/ai-autocomplete-vanilla";import{useCallback as Tt,useEffect as Ee,useRef as W,useState as _a}from"react";import{useRef as Pt}from"react";function St(e){let r=Pt(e);r.current=e;let a=Object.keys(e??{}).sort().join("\0"),n=Pt({key:"
",overrides:void 0});if(n.current.key!==a){let s={};for(let i of Object.keys(e??{})){let o=(g,b,p)=>{let x=r.current?.[i];return x?x(g,b,p):[]};s[i]=o}n.current={key:a,overrides:e?s:void 0}}return{overrides:n.current.overrides,key:a}}import{useRef as Et}from"react";function It(e){let r=Et(e);r.current=e;let a=Et(null);a.current===null&&(a.current={fetch:(s,i)=>{let o=r.current;return o?o.fetch(s,i):Promise.reject(new Error("products config removed"))},transform:s=>r.current?.transform(s)??[],get limit(){return r.current?.limit}});let n=e!==void 0;return{config:n?a.current:void 0,enabled:n}}var qa={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:[],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 Ze({onSubmit:e,onResult:r,onError:a,optionOverrides:n,maskCompletedText:s,apiConfig:i,additionalContext:o,columns:g=2,dropdownTrigger:b,optionsPosition:p,closeDropdownOnBlur:x,showNonTappableOptions:u,showOptionIcons:y,showSkipButton:k,showProducts:v,onFocus:I,onBlur:A,value:R,completedParams:D,onChange:Z,onParamsChange:L,products:P,onProductSelect:j,source:le,setCursor:Y}){let h=W(null),[de,M]=_a(null),X=W(e);X.current=e;let ce=W(r);ce.current=r;let J=W(a);J.current=a;let $=W(Z);$.current=Z;let ee=W(L);ee.current=L;let V=W(I);V.current=I;let te=W(A);te.current=A;let ae=W(Y);ae.current=Y;let O=W(j);O.current=j;let z=It(P),G=St(n);Ee(()=>{if(typeof document>"u")return;let m=new Ka(document.createElement("div"),{renderMode:"headless",apiConfig:i,additionalContext:o,optionOverrides:G.overrides,maskCompletedText:s,columns:g,dropdownTrigger:b,optionsPosition:p,closeDropdownOnBlur:x,showNonTappableOptions:u,showProducts:v,source:le,value:R,completedParams:D,onSubmit:(...T)=>X.current?.(...T),onResult:(...T)=>ce.current?.(...T),onError:(...T)=>J.current?.(...T),onChange:(...T)=>$.current?.(...T),onParamsChange:(...T)=>ee.current?.(...T),onFocus:()=>V.current?.(),onBlur:()=>te.current?.(),onProductSelect:T=>O.current?.(T),setCursor:T=>ae.current?.(T),products:z.config});h.current=m,M(m.getState());let F=m.subscribe(T=>M(T));return()=>{F(),m.destroy(),h.current===m&&(h.current=null)}},[]),Ee(()=>{R!==void 0&&h.current?.setValue(R)},[R]),Ee(()=>{D!==void 0&&h.current?.setCompletedParams(D)},[D]);let c=JSON.stringify(i??null),t;try{t=JSON.stringify(o??null)}catch{t="[unstringifiable]"}Ee(()=>{h.current?.update({apiConfig:i,additionalContext:o,optionOverrides:G.overrides,dropdownTrigger:b,optionsPosition:p,closeDropdownOnBlur:x,showNonTappableOptions:u,showProducts:v})},[c,t,G.key,b,p,x,u,v]);let f=W(!1);Ee(()=>{if(!f.current){f.current=!0;return}h.current?.update({products:z.config})},[z.enabled]);let w=W(null);w.current===null&&(w.current={handleTextChange:m=>h.current?.handleTextChange(m),handleKeyDown:m=>{let F="nativeEvent"in m?m.nativeEvent:m;h.current?.handleKeyDown(F)},setFocused:m=>h.current?.setFocused(m),startEditingParam:m=>h.current?.startEditingParam(m),exitEditMode:()=>h.current?.exitEditMode(),handleCaretAfterInput:m=>h.current?.handleCaretAfterInput(m),handleCaretMove:m=>h.current?.handleCaretMove(m),replaceEditingRange:m=>h.current?.replaceEditingRange(m)??!1,setActivePill:m=>h.current?.setActivePill(m),skipActivePill:()=>h.current?.skipActivePill(),removeLastParam:()=>h.current?.removeLastParam(),clearNewParamId:()=>h.current?.clearNewParamId(),reset:()=>h.current?.reset(),selectOption:m=>h.current?.selectOption(m),selectProduct:m=>h.current?.selectProduct(m),setActiveDropdownIndex:m=>h.current?.setActiveDropdownIndex(m),showPreviousMonth:()=>h.current?.showPreviousMonth(),showNextMonth:()=>h.current?.showNextMonth(),handleFocus:()=>h.current?.setFocused(!0),handleBlur:()=>h.current?.setFocused(!1)});let l=w.current,S=Tt(m=>{let F=m.target.value,Fe=F.length>0&&!m.nativeEvent?.isComposing&&F[0]!==F[0].toUpperCase()?F[0].toUpperCase()+F.slice(1):F;h.current?.handleTextChange(Fe)},[]),ie=Tt(m=>{h.current?.handleKeyDown(m.nativeEvent)},[]),B=h.current,d=de??qa,oe=R!==void 0?R:d.text,me=D!==void 0?D:d.completedParams,pe=d.actionableSuggestions,be=pe[0],ne=B?.listboxId??"",ke=d.activeDropdownIndex>=0&&B?`${ne}-option-${d.activeDropdownIndex}`:void 0,N=d.editingParam,H=d.editingIdentified,ve=N?{type:N.suggestionType,text:N.suggestionPlaceholder,required:!0,options:N.options}:H?{type:H.type,text:Ga(H.type),required:!0,options:[]}:null,Te=ve??be,Be=ve?[ve]:pe,Ce=Wa(d),Ae=!B||d.isLoading&&!d.editingParam&&!d.inSelectionAnimation||d.isSearchingOptions;return{completedParams:me,skippedParams:d.skippedParams,identifiedParams:d.identifiedParams,suggestionPills:pe,setActivePill:l.setActivePill,skipActivePill:l.skipActivePill,removeLastParam:l.removeLastParam,segments:d.segments,newParamId:d.newParamId,clearNewParamId:l.clearNewParamId,suggestions:d.suggestions,activeIndex:d.activeDropdownIndex,isReady:d.isReady,isLoading:Ae,isFocused:d.isFocused,isDropdownOpen:d.isDropdownOpen,isActivePillSelected:d.isActivePillSelected,placeholderText:d.placeholderText,listboxId:ne,error:d.error,products:d.products,customFields:d.customFields,selectProduct:l.selectProduct,handleTextChange:l.handleTextChange,handleKeyDown:l.handleKeyDown,setFocused:l.setFocused,editingParam:N,editingIdentified:H,editingAnchor:d.editingAnchor,caretOffset:d.caretOffset,startEditingParam:l.startEditingParam,exitEditMode:l.exitEditMode,handleCaretAfterInput:l.handleCaretAfterInput,handleCaretMove:l.handleCaretMove,replaceEditingRange:l.replaceEditingRange,inputProps:{value:oe,placeholder:d.placeholderText||void 0,onChange:S,onKeyDown:ie,onFocus:l.handleFocus,onBlur:l.handleBlur,role:"combobox","aria-expanded":d.isDropdownOpen,"aria-activedescendant":ke,"aria-autocomplete":"list","aria-controls":ne},reset:l.reset,dropdownProps:{suggestions:Te?[{...Te,options:d.filteredOptions}]:[],activeIndex:d.activeDropdownIndex,onSelect:l.selectOption,onHighlight:l.setActiveDropdownIndex,isOpen:d.isDropdownOpen,id:ne,pills:Be,activeSelected:d.isActivePillSelected,onPillClick:l.setActivePill,onSkip:l.skipActivePill,showSkipButton:(k??!0)&&!N&&!H,showOptionIcons:y??!0,skipDisabled:d.inSelectionAnimation,isLoading:Ae,isInputEmpty:oe.trim().length===0,products:d.products,onProductSelect:l.selectProduct,onProductFocusChange:l.setFocused,formatType:d.activeFormatType,dateView:d.dateView,selectedDateIso:Ce.selectedIso,selectedDateRange:Ce.selectedRange,dateRangeStart:Ce.rangeStart,onPreviousMonth:l.showPreviousMonth,onNextMonth:l.showNextMonth,optionsPosition:p??"below"}}}import{extractPlainText as At,getCursorOffset as Rt,plainTextLength as Ua,renderEditableContent as ja,setCursorOffset as Dt}from"@magicx-eng/ai-autocomplete-vanilla";import{useCallback as U,useEffect as Ye,useLayoutEffect as Xe,useRef as xe}from"react";var He;function $a(){if(He!==void 0)return He;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),He=e.contentEditable==="plaintext-only",He}function Lt(e){let{segments:r,showChipIcons:a=!0,newParamId:n,editingParam:s,editingIdentified:i,editingAnchor:o,caretOffset:g,placeholderText:b,isFocused:p,isDropdownOpen:x,listboxId:u,activeDescendantId:y,autoFocus:k,handleTextChange:v,handleKeyDown:I,handleCaretAfterInput:A,handleCaretMove:R,startEditingParam:D,replaceEditingRange:Z,setFocused:L}=e,P=xe(null),j=xe(!1),le=xe(""),Y=xe(""),h=xe(null),de=xe(0);h.current=g,Ye(()=>{if(!k)return;let c=P.current;if(!c)return;document.activeElement===c?L(!0):c.focus();let t=c.ownerDocument??document,f=t.getSelection(),w=f&&f.rangeCount>0&&c.contains(f.anchorNode);if(f&&!w){let l=t.createRange();l.selectNodeContents(c),l.collapse(!0),f.removeAllRanges(),f.addRange(l)}},[k,L]),Ye(()=>{let c=P.current;if(!c)return;let t=c.ownerDocument??document,f=()=>{let w=t.getSelection();if(!w||w.rangeCount===0||!w.anchorNode||!c.contains(w.anchorNode))return;let l=w.anchorNode,S=l.nodeType===Node.ELEMENT_NODE?l:l.parentElement,B=(w.isCollapsed?S?.closest("strong[data-param-id]"):null)?.dataset.paramId??null,d=s?.id??i?.id??null;if(B&&B!==d){D(B);return}performance.now()-de.current<50||R(Rt(c))};return t.addEventListener("selectionchange",f),()=>t.removeEventListener("selectionchange",f)},[s,i,D,R]),Xe(()=>{let c=P.current;c&&ja({input:c,segments:r,newParamId:n,editingParamId:s?.id??null,placeholderText:b??"",isFocused:p,showChipIcons:a})},[r,n,s,b,p,a]),Xe(()=>{let c=le.current,t=n??"";if(le.current=t,!t||t===c)return;let f=P.current;if(!f)return;f.focus();let w=h.current??Ua(f);Dt(f,w)},[n]),Xe(()=>{let c=Y.current,t=s?.id??"";if(Y.current=t,!t||t===c||o==null)return;let f=P.current;f&&Dt(f,o)},[s,o]);let M=U(()=>{if(j.current)return;let c=P.current;if(!c)return;let t=At(c),w=t.length>0&&t[0]!==t[0].toUpperCase()?t[0].toUpperCase()+t.slice(1):t;v(w)},[v]),X=U(()=>{de.current=performance.now(),M();let c=P.current;c&&A(Rt(c))},[M,A]);Ye(()=>{let c=P.current;if(!c)return;let t=f=>{let w=f,l=w.inputType;if(l==="insertParagraph"||l==="insertLineBreak"||l==="insertFromDrop"){f.preventDefault();return}if(l.startsWith("insert")||l.startsWith("delete")){let S=l.startsWith("delete")?"":w.data??"";Z(S)&&f.preventDefault()}};return c.addEventListener("beforeinput",t),()=>c.removeEventListener("beforeinput",t)},[Z]);let ce=U(()=>{j.current=!0},[]),J=U(()=>{j.current=!1,M()},[M]),$=U(c=>{c.preventDefault();let t=P.current;if(!t)return;let f=(c.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!f)return;let w=t.ownerDocument??document,l=w.getSelection();if(!l||l.rangeCount===0)return;let S=l.getRangeAt(0);if(!t.contains(S.startContainer))return;S.deleteContents();let ie=w.createTextNode(f);S.insertNode(ie),S.setStartAfter(ie),S.collapse(!0),l.removeAllRanges(),l.addRange(S),M()},[M]),ee=U(c=>I(c),[I]),V=U(()=>L(!0),[L]),te=U(()=>L(!1),[L]),ae=U(()=>P.current?.focus(),[]),O=U(()=>P.current?.blur(),[]),z=U(()=>{let c=P.current;return c?At(c):""},[]),G=$a()?"plaintext-only":"true";return{inputRef:P,editorProps:{ref:P,contentEditable:G,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":u,"aria-expanded":x,"aria-activedescendant":y,spellCheck:!0,enterKeyHint:"send",onInput:X,onKeyDown:ee,onCompositionStart:ce,onCompositionEnd:J,onPaste:$,onFocus:V,onBlur:te},getPlainText:z,focus:ae,blur:O}}import{jsx as ye,jsxs as et}from"react/jsx-runtime";function ei(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var ti=Va(function({onSubmit:r,onResult:a,onError:n,optionOverrides:s,maskCompletedText:i,className:o,apiConfig:g,additionalContext:b,columns:p,pillPlacement:x="dropdown",mode:u="auto",optionsPosition:y="below",animations:k=!0,dropdownTrigger:v,closeDropdownOnBlur:I,showNonTappableOptions:A,showOptionIcons:R=!0,showChipIcons:D=!0,showSkipButton:Z,showProducts:L,productsLayout:P,autoFocus:j=!0,onFocus:le,onBlur:Y,value:h,completedParams:de,onChange:M,onParamsChange:X,products:ce,onProductSelect:J,submitButton:$},ee){let V=Ie(null),te=Ie(null),ae=Ie(()=>{}),O=Ie(null),z=Ie(null);Mt(()=>{let C=V.current;if(C)return O.current?O.current.setMode(u):O.current=new Xa(C,u),()=>{O.current?.destroy(),O.current=null}},[u]);let G=Je(C=>{let he=z.current?.current;he&&(he.focus(),Ja(he,C))},[]),{completedParams:c,skippedParams:t,identifiedParams:f,isReady:w,customFields:l,suggestionPills:S,setActivePill:ie,skipActivePill:B,segments:d,newParamId:oe,clearNewParamId:me,placeholderText:pe,isFocused:be,isDropdownOpen:ne,isActivePillSelected:ke,isLoading:N,activeIndex:H,listboxId:ve,handleTextChange:Te,handleKeyDown:Be,setFocused:Ce,editingParam:Ae,editingIdentified:m,editingAnchor:F,caretOffset:T,startEditingParam:Fe,handleCaretAfterInput:Ot,handleCaretMove:zt,replaceEditingRange:Nt,dropdownProps:Ht,reset:Re}=Ze({onSubmit:C=>ae.current(C),onResult:a,onError:n,optionOverrides:s,maskCompletedText:i,apiConfig:g,additionalContext:b,columns:p,dropdownTrigger:v,optionsPosition:y,closeDropdownOnBlur:I,showNonTappableOptions:A,showOptionIcons:R,showSkipButton:Z,showProducts:L,onFocus:le,onBlur:Y,value:h,completedParams:de,onChange:M,onParamsChange:X,products:ce,onProductSelect:J,source:"full-sdk",setCursor:G});Mt(()=>{if(!oe)return;let C=window.setTimeout(()=>me(),650);return()=>window.clearTimeout(C)},[oe,me]);let Bt=H>=0?`${ve}-option-${H}`:void 0,{inputRef:Ke,editorProps:Ft,focus:De,blur:tt,getPlainText:at}=Lt({segments:d,newParamId:oe,editingParam:Ae,editingIdentified:m,editingAnchor:F,caretOffset:T,placeholderText:pe,isFocused:be,showChipIcons:D,isDropdownOpen:ne,listboxId:ve,activeDescendantId:Bt,autoFocus:j,handleTextChange:Te,handleKeyDown:Be,handleCaretAfterInput:Ot,handleCaretMove:zt,startEditingParam:Fe,replaceEditingRange:Nt,setFocused:Ce});z.current=Ke,Za(()=>{let C=te.current,he=Ke.current;if(!C||!he)return;let it=()=>{let nt=C.firstElementChild;if(!nt)return;let _t=nt.getBoundingClientRect(),qt=he.getBoundingClientRect();_t.top>=qt.bottom-2?C.setAttribute("data-aia-pill-wrapped",""):C.removeAttribute("data-aia-pill-wrapped")};it();let ot=new ResizeObserver(it);return ot.observe(he),()=>ot.disconnect()},[d,S.length,N,Ke]),Qa(ee,()=>({focus:De,blur:tt,reset:Re,setMode:C=>O.current?.setMode(C),skipActivePill:B}),[De,tt,Re,B]);let Le=!!d.length||c.length>0,We=Je(()=>{if(!Le)return;let C=at();r(Ya(C,c,t,{identifiedParams:f,isReady:w,customFields:l})),Re()},[Le,c,t,f,w,l,r,Re,at]);ae.current=We;let Kt=Je(C=>{C.target?.closest("[data-aia-pill]")||De()},[De]),Wt=x==="inline",Gt=x==="dropdown";return et("div",{ref:V,className:`magicx-aia ${ge.container} ${o??""}`,"data-pill-placement":x,"data-options-position":y,"data-animations":k?"on":"off","data-mode":ei(u),children:[ye(Ve,{...Ht,showPills:Gt,productsLayout:P}),et("div",{className:ge.inputWrapper,"data-aia-input-wrapper":"",onClick:Kt,children:[et("div",{className:ge.editorArea,"data-aia-editor":"",children:[ye("div",{...Ft,className:ge.input,"data-aia-input":""}),Wt&&(N||S.length>0)&&ye("span",{ref:te,className:ge.pillListContainer,"data-aia-pill-list-container":"",children:ye(Oe,{pills:S,activePillIndex:0,activeSelected:ke,onSelectPill:ie,loading:N})})]}),$===null?null:$===void 0?ye(Ct,{disabled:!Le,onClick:We}):ye("span",{"data-aia-submit":"","data-aia-submit-slot":"",className:ge.submitSlot,onClick:C=>{Le&&(C.stopPropagation(),We())},children:$})]})]})});export{ti as AIAutocomplete,Ve as AIAutocompleteDropdown,Qo as DATE_RANGE_META_END,Zo as DATE_RANGE_META_START,on as PRODUCT_PATH_PREFIX,un as WEEKDAY_LABELS,jo as buildSubmitResult,$o as cellDay,Vo as cellIso,Yo as dateCellMarks,Xo as formatDate,Jo as formatDateRange,en as isoDate,tn as monthLabel,an as optionLabel,nn as parseDate,rn as parseLooseDate,sn as parseLooseDateRange,ln as productFromMatchedItem,dn as productsFromCustomFields,cn as sanitizeOptionIconSvg,pn as selectedRangeFor,Ze as useAIAutocomplete,hn as visibleDateRange,fn as withSkippedParams};
+`,document.head.appendChild(e)}var Pt={submitButton:"aia-submitButton-otz7H"};import{jsx as Xe}from"react/jsx-runtime";function St({disabled:e,onClick:n}){return Xe("button",{type:"button","data-aia-submit":"",className:Pt.submitButton,disabled:e,onClick:i=>{i.stopPropagation(),n()},"aria-label":"Submit",children:Xe("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:Xe("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}import{AIAutocomplete as Ua,dateSelectionFor as ja,identifiedParamLabel as Qa}from"@magicx-eng/ai-autocomplete-vanilla";import{useCallback as Rt,useEffect as Re,useRef as W,useState as Ya}from"react";import{useRef as It}from"react";function Et(e){let n=It(e);n.current=e;let i=Object.keys(e??{}).sort().join("\0"),r=It({key:"
",overrides:void 0});if(r.current.key!==i){let s={};for(let a of Object.keys(e??{})){let o=(u,v,f)=>{let w=n.current?.[a];return w?w(u,v,f):[]};s[a]=o}r.current={key:i,overrides:e?s:void 0}}return{overrides:r.current.overrides,key:i}}import{useRef as Tt}from"react";function At(e){let n=Tt(e);n.current=e;let i=Tt(null);i.current===null&&(i.current={fetch:(s,a)=>{let o=n.current;return o?o.fetch(s,a):Promise.reject(new Error("products config removed"))},transform:s=>n.current?.transform(s)??[],get limit(){return n.current?.limit}});let r=e!==void 0;return{config:r?i.current:void 0,enabled:r}}var $a={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:[],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 Je({onSubmit:e,onResult:n,onError:i,optionOverrides:r,maskCompletedText:s,apiConfig:a,additionalContext:o,columns:u=2,dropdownTrigger:v,optionsPosition:f,closeDropdownOnBlur:w,showNonTappableOptions:p,showOptionIcons:k,showOptionImages:P,showOptionCounts:y,showSkipButton:M,showProducts:E,onFocus:S,onBlur:D,value:A,completedParams:O,onChange:z,onParamsChange:C,products:$,onProductSelect:V,source:ce,setCursor:Z}){let h=W(null),[B,pe]=Ya(null),X=W(e);X.current=e;let he=W(n);he.current=n;let J=W(i);J.current=i;let ue=W(z);ue.current=z;let _=W(C);_.current=C;let ee=W(S);ee.current=S;let te=W(D);te.current=D;let ae=W(Z);ae.current=Z;let ie=W(V);ie.current=V;let L=At($),l=Et(r);Re(()=>{if(typeof document>"u")return;let m=new Ua(document.createElement("div"),{renderMode:"headless",apiConfig:a,additionalContext:o,optionOverrides:l.overrides,maskCompletedText:s,columns:u,dropdownTrigger:v,optionsPosition:f,closeDropdownOnBlur:w,showNonTappableOptions:p,showProducts:E,source:ce,value:A,completedParams:O,onSubmit:(...R)=>X.current?.(...R),onResult:(...R)=>he.current?.(...R),onError:(...R)=>J.current?.(...R),onChange:(...R)=>ue.current?.(...R),onParamsChange:(...R)=>_.current?.(...R),onFocus:()=>ee.current?.(),onBlur:()=>te.current?.(),onProductSelect:R=>ie.current?.(R),setCursor:R=>ae.current?.(R),products:L.config});h.current=m,pe(m.getState());let K=m.subscribe(R=>pe(R));return()=>{K(),m.destroy(),h.current===m&&(h.current=null)}},[]),Re(()=>{A!==void 0&&h.current?.setValue(A)},[A]),Re(()=>{O!==void 0&&h.current?.setCompletedParams(O)},[O]);let g=JSON.stringify(a??null),t;try{t=JSON.stringify(o??null)}catch{t="[unstringifiable]"}Re(()=>{h.current?.update({apiConfig:a,additionalContext:o,optionOverrides:l.overrides,dropdownTrigger:v,optionsPosition:f,closeDropdownOnBlur:w,showNonTappableOptions:p,showProducts:E})},[g,t,l.key,v,f,w,p,E]);let x=W(!1);Re(()=>{if(!x.current){x.current=!0;return}h.current?.update({products:L.config})},[L.enabled]);let b=W(null);b.current===null&&(b.current={handleTextChange:m=>h.current?.handleTextChange(m),handleKeyDown:m=>{let K="nativeEvent"in m?m.nativeEvent:m;h.current?.handleKeyDown(K)},setFocused:m=>h.current?.setFocused(m),startEditingParam:m=>h.current?.startEditingParam(m),exitEditMode:()=>h.current?.exitEditMode(),handleCaretAfterInput:m=>h.current?.handleCaretAfterInput(m),handleCaretMove:m=>h.current?.handleCaretMove(m),replaceEditingRange:m=>h.current?.replaceEditingRange(m)??!1,setActivePill:m=>h.current?.setActivePill(m),skipActivePill:()=>h.current?.skipActivePill(),removeLastParam:()=>h.current?.removeLastParam(),clearNewParamId:()=>h.current?.clearNewParamId(),reset:()=>h.current?.reset(),selectOption:m=>h.current?.selectOption(m),selectProduct:m=>h.current?.selectProduct(m),setActiveDropdownIndex:m=>h.current?.setActiveDropdownIndex(m),showPreviousMonth:()=>h.current?.showPreviousMonth(),showNextMonth:()=>h.current?.showNextMonth(),handleFocus:()=>h.current?.setFocused(!0),handleBlur:()=>h.current?.setFocused(!1)});let c=b.current,F=Rt(m=>{let K=m.target.value,Ge=K.length>0&&!m.nativeEvent?.isComposing&&K[0]!==K[0].toUpperCase()?K[0].toUpperCase()+K.slice(1):K;h.current?.handleTextChange(Ge)},[]),q=Rt(m=>{h.current?.handleKeyDown(m.nativeEvent)},[]),oe=h.current,d=B??$a,ne=A!==void 0?A:d.text,me=O!==void 0?O:d.completedParams,re=d.actionableSuggestions,xe=re[0],se=oe?.listboxId??"",Se=d.activeDropdownIndex>=0&&oe?`${se}-option-${d.activeDropdownIndex}`:void 0,U=d.editingParam,N=d.editingIdentified,ye=U?{type:U.suggestionType,text:U.suggestionPlaceholder,required:!0,options:U.options}:N?{type:N.type,text:Qa(N.type),required:!0,options:[]}:null,Ie=ye??xe,Ke=ye?[ye]:re,Ee=ja(d),Le=!oe||d.isLoading&&!d.editingParam&&!d.inSelectionAnimation||d.isSearchingOptions;return{completedParams:me,skippedParams:d.skippedParams,identifiedParams:d.identifiedParams,suggestionPills:re,setActivePill:c.setActivePill,skipActivePill:c.skipActivePill,removeLastParam:c.removeLastParam,segments:d.segments,newParamId:d.newParamId,clearNewParamId:c.clearNewParamId,suggestions:d.suggestions,activeIndex:d.activeDropdownIndex,isReady:d.isReady,isLoading:Le,isFocused:d.isFocused,isDropdownOpen:d.isDropdownOpen,isActivePillSelected:d.isActivePillSelected,placeholderText:d.placeholderText,listboxId:se,error:d.error,products:d.products,customFields:d.customFields,selectProduct:c.selectProduct,handleTextChange:c.handleTextChange,handleKeyDown:c.handleKeyDown,setFocused:c.setFocused,editingParam:U,editingIdentified:N,editingAnchor:d.editingAnchor,caretOffset:d.caretOffset,startEditingParam:c.startEditingParam,exitEditMode:c.exitEditMode,handleCaretAfterInput:c.handleCaretAfterInput,handleCaretMove:c.handleCaretMove,replaceEditingRange:c.replaceEditingRange,inputProps:{value:ne,placeholder:d.placeholderText||void 0,onChange:F,onKeyDown:q,onFocus:c.handleFocus,onBlur:c.handleBlur,role:"combobox","aria-expanded":d.isDropdownOpen,"aria-activedescendant":Se,"aria-autocomplete":"list","aria-controls":se},reset:c.reset,dropdownProps:{suggestions:Ie?[{...Ie,options:d.filteredOptions}]:[],activeIndex:d.activeDropdownIndex,onSelect:c.selectOption,onHighlight:c.setActiveDropdownIndex,isOpen:d.isDropdownOpen,id:se,pills:Ke,activeSelected:d.isActivePillSelected,onPillClick:c.setActivePill,onSkip:c.skipActivePill,showSkipButton:(M??!0)&&!U&&!N,showOptionIcons:k??!0,showOptionImages:P??!0,showOptionCounts:y??!0,skipDisabled:d.inSelectionAnimation,isLoading:Le,isInputEmpty:ne.trim().length===0,products:d.products,onProductSelect:c.selectProduct,onProductFocusChange:c.setFocused,formatType:d.activeFormatType,dateView:d.dateView,selectedDateIso:Ee.selectedIso,selectedDateRange:Ee.selectedRange,dateRangeStart:Ee.rangeStart,onPreviousMonth:c.showPreviousMonth,onNextMonth:c.showNextMonth,optionsPosition:f??"below"}}}import{extractPlainText as Dt,getCursorOffset as Lt,plainTextLength as Va,renderEditableContent as Za,setCursorOffset as Ot}from"@magicx-eng/ai-autocomplete-vanilla";import{useCallback as Q,useEffect as et,useLayoutEffect as tt,useRef as Ce}from"react";var Fe;function Xa(){if(Fe!==void 0)return Fe;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Fe=e.contentEditable==="plaintext-only",Fe}function Mt(e){let{segments:n,showChipIcons:i=!0,showChipImages:r=!0,newParamId:s,editingParam:a,editingIdentified:o,editingAnchor:u,caretOffset:v,placeholderText:f,isFocused:w,isDropdownOpen:p,listboxId:k,activeDescendantId:P,autoFocus:y,handleTextChange:M,handleKeyDown:E,handleCaretAfterInput:S,handleCaretMove:D,startEditingParam:A,replaceEditingRange:O,setFocused:z}=e,C=Ce(null),$=Ce(!1),V=Ce(""),ce=Ce(""),Z=Ce(null),h=Ce(0);Z.current=v,et(()=>{if(!y)return;let l=C.current;if(!l)return;document.activeElement===l?z(!0):l.focus();let g=l.ownerDocument??document,t=g.getSelection(),x=t&&t.rangeCount>0&&l.contains(t.anchorNode);if(t&&!x){let b=g.createRange();b.selectNodeContents(l),b.collapse(!0),t.removeAllRanges(),t.addRange(b)}},[y,z]),et(()=>{let l=C.current;if(!l)return;let g=l.ownerDocument??document,t=()=>{let x=g.getSelection();if(!x||x.rangeCount===0||!x.anchorNode||!l.contains(x.anchorNode))return;let b=x.anchorNode,c=b.nodeType===Node.ELEMENT_NODE?b:b.parentElement,q=(x.isCollapsed?c?.closest("strong[data-param-id]"):null)?.dataset.paramId??null,oe=a?.id??o?.id??null;if(q&&q!==oe){A(q);return}performance.now()-h.current<50||D(Lt(l))};return g.addEventListener("selectionchange",t),()=>g.removeEventListener("selectionchange",t)},[a,o,A,D]),tt(()=>{let l=C.current;l&&Za({input:l,segments:n,newParamId:s,editingParamId:a?.id??null,placeholderText:f??"",isFocused:w,showChipIcons:i,showChipImages:r})},[n,s,a,f,w,i,r]),tt(()=>{let l=V.current,g=s??"";if(V.current=g,!g||g===l)return;let t=C.current;if(!t)return;t.focus();let x=Z.current??Va(t);Ot(t,x)},[s]),tt(()=>{let l=ce.current,g=a?.id??"";if(ce.current=g,!g||g===l||u==null)return;let t=C.current;t&&Ot(t,u)},[a,u]);let B=Q(()=>{if($.current)return;let l=C.current;if(!l)return;let g=Dt(l),x=g.length>0&&g[0]!==g[0].toUpperCase()?g[0].toUpperCase()+g.slice(1):g;M(x)},[M]),pe=Q(()=>{h.current=performance.now(),B();let l=C.current;l&&S(Lt(l))},[B,S]);et(()=>{let l=C.current;if(!l)return;let g=t=>{let x=t,b=x.inputType;if(b==="insertParagraph"||b==="insertLineBreak"||b==="insertFromDrop"){t.preventDefault();return}if(b.startsWith("insert")||b.startsWith("delete")){let c=b.startsWith("delete")?"":x.data??"";O(c)&&t.preventDefault()}};return l.addEventListener("beforeinput",g),()=>l.removeEventListener("beforeinput",g)},[O]);let X=Q(()=>{$.current=!0},[]),he=Q(()=>{$.current=!1,B()},[B]),J=Q(l=>{l.preventDefault();let g=C.current;if(!g)return;let t=(l.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!t)return;let x=g.ownerDocument??document,b=x.getSelection();if(!b||b.rangeCount===0)return;let c=b.getRangeAt(0);if(!g.contains(c.startContainer))return;c.deleteContents();let F=x.createTextNode(t);c.insertNode(F),c.setStartAfter(F),c.collapse(!0),b.removeAllRanges(),b.addRange(c),B()},[B]),ue=Q(l=>E(l),[E]),_=Q(()=>z(!0),[z]),ee=Q(()=>z(!1),[z]),te=Q(()=>C.current?.focus(),[]),ae=Q(()=>C.current?.blur(),[]),ie=Q(()=>{let l=C.current;return l?Dt(l):""},[]),L=Xa()?"plaintext-only":"true";return{inputRef:C,editorProps:{ref:C,contentEditable:L,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":k,"aria-expanded":p,"aria-activedescendant":P,spellCheck:!0,enterKeyHint:"send",onInput:pe,onKeyDown:ue,onCompositionStart:X,onCompositionEnd:he,onPaste:J,onFocus:_,onBlur:ee},getPlainText:ie,focus:te,blur:ae}}import{jsx as Pe,jsxs as it}from"react/jsx-runtime";function ni(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var ri=Ja(function({onSubmit:n,onResult:i,onError:r,optionOverrides:s,maskCompletedText:a,className:o,apiConfig:u,additionalContext:v,columns:f,pillPlacement:w="dropdown",mode:p="auto",optionsPosition:k="below",animations:P=!0,dropdownTrigger:y,closeDropdownOnBlur:M,showNonTappableOptions:E,showOptionIcons:S=!0,showChipIcons:D=!0,showChipImages:A=!0,showOptionImages:O=!0,showOptionCounts:z=!0,showSkipButton:C,showProducts:$,productsLayout:V,autoFocus:ce=!0,onFocus:Z,onBlur:h,value:B,completedParams:pe,onChange:X,onParamsChange:he,products:J,onProductSelect:ue,submitButton:_},ee){let te=De(null),ae=De(null),ie=De(()=>{}),L=De(null),l=De(null);zt(()=>{let I=te.current;if(I)return L.current?L.current.setMode(p):L.current=new ii(I,p),()=>{L.current?.destroy(),L.current=null}},[p]);let g=at(I=>{let fe=l.current?.current;fe&&(fe.focus(),oi(fe,I))},[]),{completedParams:t,skippedParams:x,identifiedParams:b,isReady:c,customFields:F,suggestionPills:q,setActivePill:oe,skipActivePill:d,segments:ne,newParamId:me,clearNewParamId:re,placeholderText:xe,isFocused:se,isDropdownOpen:Se,isActivePillSelected:U,isLoading:N,activeIndex:ye,listboxId:Ie,handleTextChange:Ke,handleKeyDown:Ee,setFocused:Le,editingParam:m,editingIdentified:K,editingAnchor:R,caretOffset:Ge,startEditingParam:Nt,handleCaretAfterInput:Ht,handleCaretMove:Bt,replaceEditingRange:Ft,dropdownProps:Kt,reset:Oe}=Je({onSubmit:I=>ie.current(I),onResult:i,onError:r,optionOverrides:s,maskCompletedText:a,apiConfig:u,additionalContext:v,columns:f,dropdownTrigger:y,optionsPosition:k,closeDropdownOnBlur:M,showNonTappableOptions:E,showOptionIcons:S,showOptionImages:O,showOptionCounts:z,showSkipButton:C,showProducts:$,onFocus:Z,onBlur:h,value:B,completedParams:pe,onChange:X,onParamsChange:he,products:J,onProductSelect:ue,source:"full-sdk",setCursor:g});zt(()=>{if(!me)return;let I=window.setTimeout(()=>re(),650);return()=>window.clearTimeout(I)},[me,re]);let Gt=ye>=0?`${Ie}-option-${ye}`:void 0,{inputRef:We,editorProps:Wt,focus:Me,blur:ot,getPlainText:nt}=Mt({segments:ne,newParamId:me,editingParam:m,editingIdentified:K,editingAnchor:R,caretOffset:Ge,placeholderText:xe,isFocused:se,showChipIcons:D,showChipImages:A,isDropdownOpen:Se,listboxId:Ie,activeDescendantId:Gt,autoFocus:ce,handleTextChange:Ke,handleKeyDown:Ee,handleCaretAfterInput:Ht,handleCaretMove:Bt,startEditingParam:Nt,replaceEditingRange:Ft,setFocused:Le});l.current=We,ti(()=>{let I=ae.current,fe=We.current;if(!I||!fe)return;let rt=()=>{let lt=I.firstElementChild;if(!lt)return;let jt=lt.getBoundingClientRect(),Qt=fe.getBoundingClientRect();jt.top>=Qt.bottom-2?I.setAttribute("data-aia-pill-wrapped",""):I.removeAttribute("data-aia-pill-wrapped")};rt();let st=new ResizeObserver(rt);return st.observe(fe),()=>st.disconnect()},[ne,q.length,N,We]),ei(ee,()=>({focus:Me,blur:ot,reset:Oe,setMode:I=>L.current?.setMode(I),skipActivePill:d}),[Me,ot,Oe,d]);let ze=!!ne.length||t.length>0,_e=at(()=>{if(!ze)return;let I=nt();n(ai(I,t,x,{identifiedParams:b,isReady:c,customFields:F})),Oe()},[ze,t,x,b,c,F,n,Oe,nt]);ie.current=_e;let _t=at(I=>{I.target?.closest("[data-aia-pill]")||Me()},[Me]),qt=w==="inline",Ut=w==="dropdown";return it("div",{ref:te,className:`magicx-aia ${ve.container} ${o??""}`,"data-pill-placement":w,"data-options-position":k,"data-animations":P?"on":"off","data-mode":ni(p),children:[Pe(Ze,{...Kt,showPills:Ut,productsLayout:V}),it("div",{className:ve.inputWrapper,"data-aia-input-wrapper":"",onClick:_t,children:[it("div",{className:ve.editorArea,"data-aia-editor":"",children:[Pe("div",{...Wt,className:ve.input,"data-aia-input":""}),qt&&(N||q.length>0)&&Pe("span",{ref:ae,className:ve.pillListContainer,"data-aia-pill-list-container":"",children:Pe(He,{pills:q,activePillIndex:0,activeSelected:U,onSelectPill:oe,loading:N})})]}),_===null?null:_===void 0?Pe(St,{disabled:!ze,onClick:_e}):Pe("span",{"data-aia-submit":"","data-aia-submit-slot":"",className:ve.submitSlot,onClick:I=>{ze&&(I.stopPropagation(),_e())},children:_})]})]})});export{ri as AIAutocomplete,Ze as AIAutocompleteDropdown,en as DATE_RANGE_META_END,tn as DATE_RANGE_META_START,an as DEFAULT_OPTION_COUNT_UNIT,mn as PRODUCT_PATH_PREFIX,Cn as WEEKDAY_LABELS,Zo as buildSubmitResult,Xo as cellDay,Jo as cellIso,on as dateCellMarks,nn as formatDate,rn as formatDateRange,sn as formatOptionCount,ln as isoDate,dn as monthLabel,cn as optionCountLabel,pn as optionHasImage,hn as optionImageSrc,un as optionLabel,fn as parseDate,gn as parseLooseDate,bn as parseLooseDateRange,vn as productFromMatchedItem,wn as productsFromCustomFields,xn as sanitizeOptionIconSvg,yn as selectedRangeFor,Je as useAIAutocomplete,kn as visibleDateRange,Pn as withSkippedParams};
 //# sourceMappingURL=index.mjs.map