@magicx-eng/ai-autocomplete-react 0.17.1 → 0.17.3

package/dist/index.js

@@ -623,15 +623,17 @@
    it tracks the grid's bottom edge in every layout). It never moves: the
    controller toggles data-aia-visible and the only thing that transitions is
    opacity \u2014 a slow, even second in and the same second out. Any travel read as
-   the disc sliding with the scroll (2026-09-04). z-index 2 puts it over the
-   option rows and under the footer (z-index 3). Declarations mirror vanilla's
-   .magicx-aia-scroll-arrow and Angular's copy \u2014 change all three in the same
-   commit. */
+   the disc sliding with the scroll (2026-09-04). z-index 4 puts it over the
+   option rows and the footer (z-index 3), whose opaque fade plate would
+   otherwise bury it. Declarations mirror vanilla's .magicx-aia-scroll-arrow
+   and Angular's copy \u2014 change all three in the same commit. */
 .AIAutocompleteDropdown-module_scrollArrow_uUzV0 {
   position: absolute;
   left: 50%;
   bottom: var(--aia-scroll-arrow-bottom, 8px);
-  z-index: 2;
+  /* Above the footer (z-index 3): its fade plate is opaque on desktop and
+     would otherwise bury the disc, which sits half over it by design. */
+  z-index: 4;
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -1556,7 +1558,7 @@
   }
   /* data-align="stretch" is the flex default \u2014 no rule needed. */
 }
-`,document.head.appendChild(e)}var Pt=require("react/jsx-runtime");function kt({space:e,align:o="stretch",className:a,children:n,...r}){let i=e?{"--aia-stack-space":e}:void 0;return(0,Pt.jsx)("div",{className:a?`aia-stack ${a}`:"aia-stack","data-align":o,style:i,...r,children:n})}var O=require("react/jsx-runtime"),Xt=[159,119,164],Zt=()=>{},It=()=>{};function Jt(e){let o=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[a,n]=(0,Y.useState)(o);if((0,Y.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let r=window.matchMedia("(prefers-color-scheme: dark)"),i=()=>n(r.matches);return r.addEventListener("change",i),()=>r.removeEventListener("change",i)},[e]),e!==void 0)return e==="auto"?a?"dark":"light":e}function ea(e,o){let a=(0,Y.useRef)(null);(0,Y.useEffect)(()=>{let n=e.current,r=o.current;if(!n||!r)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:(0,Ce.attachScrollArrow)({dropdown:n,grid:i,button:r})};return}a.current?.controller.update()}),(0,Y.useEffect)(()=>()=>{a.current?.controller.destroy(),a.current=null},[])}function qe({suggestions:e,activeIndex:o,onSelect:a,onHighlight:n,isOpen:r,id:i,className:s,pills:f,onPillClick:b,showPills:w=!0,onSkip:k,showSkipButton:p=!0,skipDisabled:x=!1,activeSelected:_=!1,isLoading:v=!1,isInputEmpty:L=!1,products:M,onProductSelect:ie,onProductFocusChange:ne,formatType:W="options",dateView:A=null,selectedDateIso:re=null,selectedDateRange:se=null,dateRangeStart:u=null,onPreviousMonth:be,onNextMonth:le,optionsPosition:N="below",mode:Z}){let de=Jt(Z),ce=de!==void 0,J=(0,Y.useRef)(null),ee=(0,Y.useRef)(null);ea(J,ee);let G=e[0]?.options??[],pe=!!(f&&f.length>0&&b),ve=!!(M&&M.length>0),z=r&&(G.length>0||w&&pe||v||ve),q={suggestions:e,activeIndex:o,pills:f,showPills:w,showSkipButton:p,skipDisabled:x,activeSelected:_,isLoading:v,isInputEmpty:L,products:M,formatType:W,dateView:A,selectedDateIso:re,selectedDateRange:se,dateRangeStart:u},ue=(0,Y.useRef)(q);z&&(ue.current=q);let t=z?q:ue.current,c=t.suggestions[0],h=c?.options??[],l=t.activeIndex>=0&&!!h[t.activeIndex]?.is_tappable,y=!!(t.pills&&t.pills.length>0&&b),T=t.showPills&&y,U=t.showPills&&!y&&t.isLoading,d=T||U,he=y&&t.showSkipButton&&!t.isInputEmpty&&!!k,Ie=t.pills?.[0]?.text,we=(0,Ce.isCalendarFormat)(t.formatType)&&t.dateView!=null,xe=h.length>0&&!we,te=h.length>0&&we,Ae=t.isLoading&&!xe&&!te,V=t.products??[];return(0,O.jsxs)("div",{ref:J,id:i,role:"listbox","data-aia-dropdown":"","data-options-position":N,"data-mode":de,"data-aia-loading":t.isLoading?"":void 0,"data-aia-has-products":V.length>0?"":void 0,className:`${ce?"magicx-aia ":""}${me.dropdown} ${z?me.visible:""} ${s??""}`,onMouseDown:j=>j.preventDefault(),children:[(0,O.jsxs)(kt,{space:"8px",children:[(d||he)&&(0,O.jsxs)(Oe,{noWrap:!0,className:me.pillBar,"data-aia-pillbar":"",children:[d&&(0,O.jsx)("span",{className:me.pillScroll,"data-aia-pill-scroll":"",children:(0,O.jsx)(Ke,{pills:t.pills??[],activePillIndex:0,activeSelected:t.activeSelected,onSelectPill:b??(()=>{}),rounded:!0,loading:t.isLoading})}),he&&(0,O.jsx)("button",{type:"button",tabIndex:-1,className:me.skip,"data-aia-skip":"",disabled:t.isLoading||t.skipDisabled,"aria-label":Ie?`Skip ${Ie}`:"Skip",onClick:k,children:"skip"})]}),xe&&(0,O.jsx)(_t,{options:h,activeIndex:t.activeIndex,onSelect:a,onHighlight:n,listboxId:i,loading:t.isLoading,groupKey:c?`${c.type} ${c.text}`:"",optionsPosition:N}),te&&t.dateView&&(0,O.jsx)(pt,{options:h,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:be??It,onNextMonth:le??It}),Ae&&(0,O.jsx)("div",{className:me.skeletonBars,"data-aia-skeleton-bars":"",children:Xt.map(j=>(0,O.jsx)("span",{className:me.skeletonBar,style:{width:j}},`bar-${j}`))}),(0,O.jsx)(gt,{products:V,listboxId:i,onSelect:ie??Zt,onFocusChange:ne,focusable:z}),(0,O.jsx)(ut,{isOptionHighlighted:l,isInputEmpty:t.isInputEmpty})]}),(0,O.jsx)("button",{ref:ee,type:"button",tabIndex:-1,className:me.scrollArrow,"data-aia-scroll-arrow":"","aria-label":Ce.SCROLL_ARROW_LABEL,"aria-hidden":"true",children:(0,O.jsx)("svg",{viewBox:"0 0 16 16",width:"14",height:"14",fill:"none",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",focusable:"false",children:(0,O.jsx)("path",{d:"M4 6.5 8 10.5l4-4"})})})]})}var Te=require("@magicx-eng/ai-autocomplete-vanilla");if(typeof document<"u"&&!document.getElementById("ac-style-fdee06e6")){let e=document.createElement("style");e.id="ac-style-fdee06e6",e.textContent=`.SubmitButton-module_submitButton_otz7H {
+`,document.head.appendChild(e)}var Pt=require("react/jsx-runtime");function kt({space:e,align:o="stretch",className:a,children:n,...r}){let i=e?{"--aia-stack-space":e}:void 0;return(0,Pt.jsx)("div",{className:a?`aia-stack ${a}`:"aia-stack","data-align":o,style:i,...r,children:n})}var O=require("react/jsx-runtime"),Xt=[159,119,164],Zt=()=>{},It=()=>{};function Jt(e){let o=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[a,n]=(0,Y.useState)(o);if((0,Y.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let r=window.matchMedia("(prefers-color-scheme: dark)"),i=()=>n(r.matches);return r.addEventListener("change",i),()=>r.removeEventListener("change",i)},[e]),e!==void 0)return e==="auto"?a?"dark":"light":e}function ea(e,o){let a=(0,Y.useRef)(null);(0,Y.useEffect)(()=>{let n=e.current,r=o.current;if(!n||!r)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:(0,Ce.attachScrollArrow)({dropdown:n,grid:i,button:r})};return}a.current?.controller.update()}),(0,Y.useEffect)(()=>()=>{a.current?.controller.destroy(),a.current=null},[])}function qe({suggestions:e,activeIndex:o,onSelect:a,onHighlight:n,isOpen:r,id:i,className:s,pills:f,onPillClick:b,showPills:w=!0,onSkip:k,showSkipButton:p=!0,skipDisabled:x=!1,activeSelected:_=!1,isLoading:v=!1,isInputEmpty:L=!1,products:M,onProductSelect:ie,onProductFocusChange:ne,formatType:W="options",dateView:A=null,selectedDateIso:re=null,selectedDateRange:se=null,dateRangeStart:u=null,onPreviousMonth:be,onNextMonth:le,optionsPosition:N="below",mode:Z}){let de=Jt(Z),ce=de!==void 0,J=(0,Y.useRef)(null),ee=(0,Y.useRef)(null);ea(J,ee);let G=e[0]?.options??[],pe=!!(f&&f.length>0&&b),ve=!!(M&&M.length>0),z=r&&(G.length>0||w&&pe||v||ve),q={suggestions:e,activeIndex:o,pills:f,showPills:w,showSkipButton:p,skipDisabled:x,activeSelected:_,isLoading:v,isInputEmpty:L,products:M,formatType:W,dateView:A,selectedDateIso:re,selectedDateRange:se,dateRangeStart:u},ue=(0,Y.useRef)(q);z&&(ue.current=q);let t=z?q:ue.current,c=t.suggestions[0],h=c?.options??[],l=t.activeIndex>=0&&!!h[t.activeIndex]?.is_tappable,y=!!(t.pills&&t.pills.length>0&&b),T=t.showPills&&y,U=t.showPills&&!y&&t.isLoading,d=T||U,he=y&&t.showSkipButton&&!t.isInputEmpty&&!!k,Ie=t.pills?.[0]?.text,we=(0,Ce.isCalendarFormat)(t.formatType)&&t.dateView!=null,xe=h.length>0&&!we,te=h.length>0&&we&&!t.isLoading,Ae=t.isLoading&&!xe&&!te,V=t.products??[];return(0,O.jsxs)("div",{ref:J,id:i,role:"listbox","data-aia-dropdown":"","data-options-position":N,"data-mode":de,"data-aia-loading":t.isLoading?"":void 0,"data-aia-has-products":V.length>0?"":void 0,className:`${ce?"magicx-aia ":""}${me.dropdown} ${z?me.visible:""} ${s??""}`,onMouseDown:j=>j.preventDefault(),children:[(0,O.jsxs)(kt,{space:"8px",children:[(d||he)&&(0,O.jsxs)(Oe,{noWrap:!0,className:me.pillBar,"data-aia-pillbar":"",children:[d&&(0,O.jsx)("span",{className:me.pillScroll,"data-aia-pill-scroll":"",children:(0,O.jsx)(Ke,{pills:t.pills??[],activePillIndex:0,activeSelected:t.activeSelected,onSelectPill:b??(()=>{}),rounded:!0,loading:t.isLoading})}),he&&(0,O.jsx)("button",{type:"button",tabIndex:-1,className:me.skip,"data-aia-skip":"",disabled:t.isLoading||t.skipDisabled,"aria-label":Ie?`Skip ${Ie}`:"Skip",onClick:k,children:"skip"})]}),xe&&(0,O.jsx)(_t,{options:h,activeIndex:t.activeIndex,onSelect:a,onHighlight:n,listboxId:i,loading:t.isLoading,groupKey:c?`${c.type} ${c.text}`:"",optionsPosition:N}),te&&t.dateView&&(0,O.jsx)(pt,{options:h,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:be??It,onNextMonth:le??It}),Ae&&(0,O.jsx)("div",{className:me.skeletonBars,"data-aia-skeleton-bars":"",children:Xt.map(j=>(0,O.jsx)("span",{className:me.skeletonBar,style:{width:j}},`bar-${j}`))}),(0,O.jsx)(gt,{products:V,listboxId:i,onSelect:ie??Zt,onFocusChange:ne,focusable:z}),(0,O.jsx)(ut,{isOptionHighlighted:l,isInputEmpty:t.isInputEmpty})]}),(0,O.jsx)("button",{ref:ee,type:"button",tabIndex:-1,className:me.scrollArrow,"data-aia-scroll-arrow":"","aria-label":Ce.SCROLL_ARROW_LABEL,"aria-hidden":"true",children:(0,O.jsx)("svg",{viewBox:"0 0 16 16",width:"14",height:"14",fill:"none",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",focusable:"false",children:(0,O.jsx)("path",{d:"M4 6.5 8 10.5l4-4"})})})]})}var Te=require("@magicx-eng/ai-autocomplete-vanilla");if(typeof document<"u"&&!document.getElementById("ac-style-fdee06e6")){let e=document.createElement("style");e.id="ac-style-fdee06e6",e.textContent=`.SubmitButton-module_submitButton_otz7H {
   flex-shrink: 0;
   width: 32px;
   height: 32px;