@magicx-eng/ai-autocomplete-react 0.9.0 → 0.10.0

package/README.md

@@ -240,6 +240,7 @@ function App() {
 | `dropdownTrigger?` | `"auto" \| "manual" \| "hidden"` | `"auto"` | When the dropdown appears. `"auto"` = when options available. `"manual"` = only on pill tap, closes after selection. `"hidden"` = never shows. |
 | `closeDropdownOnBlur?` | `boolean` | `true` | When `true`, the dropdown closes if the input loses focus. Set to `false` to keep it open whenever options are available, regardless of focus. |
 | `showNonTappableOptions?` | `boolean` | `true` | When `true`, non-tappable options are rendered alongside tappable ones in the dropdown. Set to `false` to hide non-tappable options entirely. |
+| `showSkipButton?` | `boolean` | `true` | When `true`, the dropdown's pill bar ends in a small "skip" button that dismisses the active pill — same action as pressing <kbd>→</kbd> at the end of the input. It sits top-right when the dropdown opens below the input, bottom-right when `optionsPosition` is `"above"`. Set to `false` to hide it. |
 | `autoFocus?` | `boolean` | `true` | Focus the input on mount. Set to `false` to leave focus to the consumer. |
 | `onFocus?` | `() => void` | — | Called when the input gains focus. |
 | `onBlur?` | `() => void` | — | Called when the input loses focus. |
@@ -438,6 +439,7 @@ The headless hook for Tier 2 and Tier 3. Accepts the same options as `<AIAutocom
 | Field | Type | Description |
 |---|---|---|
 | `setActivePill` | `(index: number) => void` | Move pill at `index` to front (active). |
+| `skipActivePill` | `() => void` | Skip the active pill — same action as → / the dropdown's skip button. Records it in `skippedParams`; no-ops during re-edit and the post-selection window. Already wired into `dropdownProps.onSkip`; call it directly for a custom skip affordance (e.g. with `showSkipButton: false`). Also exposed on the Tier 1 imperative handle. |
 | `removeLastParam` | `() => void` | Remove the last completed param from state. The text stays in the input as plain text. |
 | `clearNewParamId` | `() => void` | Clear shimmer animation state. |
 | `reset` | `() => void` | Clear all state, re-fetch, and start a new session (rotates `session_id`). Call this after handling submit. |
@@ -580,6 +582,8 @@ For styling beyond the CSS variables, target these stable `data-aia-*` attribute
 | `[data-aia-submit]` | Submit button |
 | `[data-aia-pill]` | Each unfilled-suggestion pill |
 | `[data-aia-pillbar]` | Pill bar container inside the dropdown |
+| `[data-aia-pill-scroll]` | Scrollable pill region inside the bar — carries the horizontal scroll and right-edge fade mask |
+| `[data-aia-skip]` | The pill bar's trailing "skip" button. Tune via `--aia-skip-font-size` / `--aia-skip-color` / `--aia-skip-color-hover` / `--aia-skip-hover-bg` |
 | `[data-aia-option]` | Each suggestion option |
 | `[data-aia-dropdown]` | The dropdown root (listbox). Carries `data-aia-has-products` while the product strip has cards. |
 | `[data-aia-products]` | Product strip section (label + row) |

package/dist/index.d.mts

@@ -9,6 +9,12 @@ interface AIAutocompleteHandle {
     blur: () => void;
     reset: () => void;
     setMode: (mode: AppearanceMode) => void;
+    /**
+     * Skip the active pill — same action as the dropdown's skip button / →.
+     * Lets a consumer who hides the built-in button (`showSkipButton={false}`)
+     * drive skipping from their own UI without dropping to Tier 2.
+     */
+    skipActivePill: () => void;
 }
 interface AIAutocompleteProps {
     onSubmit: (result: AutocompleteResult) => void;
@@ -32,6 +38,17 @@ interface AIAutocompleteProps {
     closeDropdownOnBlur?: boolean;
     /** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
     showNonTappableOptions?: boolean;
+    /**
+     * When true (default), the dropdown's pill bar ends in a small "skip" button
+     * that dismisses the active pill — same action as pressing → at the end of
+     * the input. It sits at the trailing edge of the bar: visually top-right when
+     * the dropdown opens below the input, bottom-right when `optionsPosition` is
+     * "above". Set to false to hide it. When pills render elsewhere
+     * (`pillPlacement: "inline"` / `"hidden"`) the bar renders as a skip-only
+     * row holding just the button; it hides during re-edit and on the loading
+     * skeleton either way.
+     */
+    showSkipButton?: boolean;
     /** Focus the input on mount. Default: true. */
     autoFocus?: boolean;
     /** Called when the input gains focus. */
@@ -97,6 +114,12 @@ interface UseAIAutocompleteOptions {
     closeDropdownOnBlur?: boolean;
     /** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
     showNonTappableOptions?: boolean;
+    /**
+     * When true (default), `dropdownProps` asks the dropdown to render its
+     * trailing "skip" button (see `AIAutocompleteProps.showSkipButton`). Set to
+     * false to hide it.
+     */
+    showSkipButton?: boolean;
     /** Called when the input gains focus. */
     onFocus?: () => void;
     /** Called when the input loses focus. */
@@ -151,6 +174,13 @@ interface UseAIAutocompleteReturn {
     skippedParams: SkippedParamState[];
     suggestionPills: Suggestion[];
     setActivePill: (index: number) => void;
+    /**
+     * Skip the active pill — same action as pressing → at the end of the input.
+     * The built-in dropdown's skip button calls this; hand-rolled skip
+     * affordances call it directly. The skipped suggestion joins
+     * `skippedParams`.
+     */
+    skipActivePill: () => void;
     removeLastParam: () => void;
     reset: () => void;
     segments: Segment[];
@@ -235,6 +265,28 @@ interface AIAutocompleteDropdownProps {
     onPillClick?: (index: number) => void;
     /** Whether to render pills inside the dropdown. Default: true. Tier 2 consumers who render their own pills should set this to false. */
     showPills?: boolean;
+    /**
+     * Skip the active pill — the pill bar's trailing "skip" button routes here.
+     * Provided by `dropdownProps` from the hook (wired to `skipActivePill`).
+     * The button only renders when this is set.
+     */
+    onSkip?: () => void;
+    /**
+     * Whether the pill bar ends in the "skip" trailing button. Default: true
+     * (the hook's `dropdownProps` already folds in the `showSkipButton` option
+     * and hides the button during re-edit). Requires `onSkip` and real `pills`;
+     * with `showPills` false the bar renders as a skip-only row holding just
+     * the button.
+     */
+    showSkipButton?: boolean;
+    /**
+     * Extra disabled gate for the skip button beyond `isLoading`. Provided by
+     * `dropdownProps` from the hook (wired to `inSelectionAnimation`): the
+     * UI-facing loading flag is deliberately suppressed during the ~500ms
+     * post-selection window, but `skipActivePill` no-ops in it — the button
+     * renders disabled instead of swallowing clicks silently. Default: false.
+     */
+    skipDisabled?: boolean;
     /** Whether the active pill renders selected (full opacity) vs. the `first` tier. Provided by `dropdownProps` from the hook. Default: false. */
     activeSelected?: boolean;
     /** True while a fetch for the latest query is in flight. Replaces options/pills with a skeleton. */
@@ -275,8 +327,8 @@ interface AIAutocompleteDropdownProps {
 
 declare const AIAutocomplete: react.ForwardRefExoticComponent<AIAutocompleteProps & react.RefAttributes<AIAutocompleteHandle>>;
 
-declare function AIAutocompleteDropdown({ suggestions, activeIndex, onSelect, onHighlight, isOpen, id, className, pills, onPillClick, showPills, activeSelected, isLoading, isInputEmpty, products, onProductSelect, onProductFocusChange, optionsPosition, mode, }: AIAutocompleteDropdownProps): react_jsx_runtime.JSX.Element;
+declare function AIAutocompleteDropdown({ suggestions, activeIndex, onSelect, onHighlight, isOpen, id, className, pills, onPillClick, showPills, onSkip, showSkipButton, skipDisabled, activeSelected, isLoading, isInputEmpty, products, onProductSelect, onProductFocusChange, optionsPosition, mode, }: AIAutocompleteDropdownProps): react_jsx_runtime.JSX.Element;
 
-declare function useAIAutocomplete({ onSubmit, onError, optionOverrides, maskCompletedText, apiConfig, columns, dropdownTrigger, optionsPosition, closeDropdownOnBlur, showNonTappableOptions, onFocus, onBlur, value: controlledValue, completedParams: controlledParams, onChange: onChangeProp, onParamsChange, products, onProductSelect, source, setCursor, }: UseAIAutocompleteOptions): UseAIAutocompleteReturn;
+declare function useAIAutocomplete({ onSubmit, onError, optionOverrides, maskCompletedText, apiConfig, columns, dropdownTrigger, optionsPosition, closeDropdownOnBlur, showNonTappableOptions, showSkipButton, onFocus, onBlur, value: controlledValue, completedParams: controlledParams, onChange: onChangeProp, onParamsChange, products, onProductSelect, source, setCursor, }: UseAIAutocompleteOptions): UseAIAutocompleteReturn;
 
 export { AIAutocomplete, AIAutocompleteDropdown, type AIAutocompleteDropdownProps, type AIAutocompleteHandle, type AIAutocompleteProps, type UseAIAutocompleteOptions, type UseAIAutocompleteReturn, useAIAutocomplete };

package/dist/index.d.ts

@@ -9,6 +9,12 @@ interface AIAutocompleteHandle {
     blur: () => void;
     reset: () => void;
     setMode: (mode: AppearanceMode) => void;
+    /**
+     * Skip the active pill — same action as the dropdown's skip button / →.
+     * Lets a consumer who hides the built-in button (`showSkipButton={false}`)
+     * drive skipping from their own UI without dropping to Tier 2.
+     */
+    skipActivePill: () => void;
 }
 interface AIAutocompleteProps {
     onSubmit: (result: AutocompleteResult) => void;
@@ -32,6 +38,17 @@ interface AIAutocompleteProps {
     closeDropdownOnBlur?: boolean;
     /** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
     showNonTappableOptions?: boolean;
+    /**
+     * When true (default), the dropdown's pill bar ends in a small "skip" button
+     * that dismisses the active pill — same action as pressing → at the end of
+     * the input. It sits at the trailing edge of the bar: visually top-right when
+     * the dropdown opens below the input, bottom-right when `optionsPosition` is
+     * "above". Set to false to hide it. When pills render elsewhere
+     * (`pillPlacement: "inline"` / `"hidden"`) the bar renders as a skip-only
+     * row holding just the button; it hides during re-edit and on the loading
+     * skeleton either way.
+     */
+    showSkipButton?: boolean;
     /** Focus the input on mount. Default: true. */
     autoFocus?: boolean;
     /** Called when the input gains focus. */
@@ -97,6 +114,12 @@ interface UseAIAutocompleteOptions {
     closeDropdownOnBlur?: boolean;
     /** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
     showNonTappableOptions?: boolean;
+    /**
+     * When true (default), `dropdownProps` asks the dropdown to render its
+     * trailing "skip" button (see `AIAutocompleteProps.showSkipButton`). Set to
+     * false to hide it.
+     */
+    showSkipButton?: boolean;
     /** Called when the input gains focus. */
     onFocus?: () => void;
     /** Called when the input loses focus. */
@@ -151,6 +174,13 @@ interface UseAIAutocompleteReturn {
     skippedParams: SkippedParamState[];
     suggestionPills: Suggestion[];
     setActivePill: (index: number) => void;
+    /**
+     * Skip the active pill — same action as pressing → at the end of the input.
+     * The built-in dropdown's skip button calls this; hand-rolled skip
+     * affordances call it directly. The skipped suggestion joins
+     * `skippedParams`.
+     */
+    skipActivePill: () => void;
     removeLastParam: () => void;
     reset: () => void;
     segments: Segment[];
@@ -235,6 +265,28 @@ interface AIAutocompleteDropdownProps {
     onPillClick?: (index: number) => void;
     /** Whether to render pills inside the dropdown. Default: true. Tier 2 consumers who render their own pills should set this to false. */
     showPills?: boolean;
+    /**
+     * Skip the active pill — the pill bar's trailing "skip" button routes here.
+     * Provided by `dropdownProps` from the hook (wired to `skipActivePill`).
+     * The button only renders when this is set.
+     */
+    onSkip?: () => void;
+    /**
+     * Whether the pill bar ends in the "skip" trailing button. Default: true
+     * (the hook's `dropdownProps` already folds in the `showSkipButton` option
+     * and hides the button during re-edit). Requires `onSkip` and real `pills`;
+     * with `showPills` false the bar renders as a skip-only row holding just
+     * the button.
+     */
+    showSkipButton?: boolean;
+    /**
+     * Extra disabled gate for the skip button beyond `isLoading`. Provided by
+     * `dropdownProps` from the hook (wired to `inSelectionAnimation`): the
+     * UI-facing loading flag is deliberately suppressed during the ~500ms
+     * post-selection window, but `skipActivePill` no-ops in it — the button
+     * renders disabled instead of swallowing clicks silently. Default: false.
+     */
+    skipDisabled?: boolean;
     /** Whether the active pill renders selected (full opacity) vs. the `first` tier. Provided by `dropdownProps` from the hook. Default: false. */
     activeSelected?: boolean;
     /** True while a fetch for the latest query is in flight. Replaces options/pills with a skeleton. */
@@ -275,8 +327,8 @@ interface AIAutocompleteDropdownProps {
 
 declare const AIAutocomplete: react.ForwardRefExoticComponent<AIAutocompleteProps & react.RefAttributes<AIAutocompleteHandle>>;
 
-declare function AIAutocompleteDropdown({ suggestions, activeIndex, onSelect, onHighlight, isOpen, id, className, pills, onPillClick, showPills, activeSelected, isLoading, isInputEmpty, products, onProductSelect, onProductFocusChange, optionsPosition, mode, }: AIAutocompleteDropdownProps): react_jsx_runtime.JSX.Element;
+declare function AIAutocompleteDropdown({ suggestions, activeIndex, onSelect, onHighlight, isOpen, id, className, pills, onPillClick, showPills, onSkip, showSkipButton, skipDisabled, activeSelected, isLoading, isInputEmpty, products, onProductSelect, onProductFocusChange, optionsPosition, mode, }: AIAutocompleteDropdownProps): react_jsx_runtime.JSX.Element;
 
-declare function useAIAutocomplete({ onSubmit, onError, optionOverrides, maskCompletedText, apiConfig, columns, dropdownTrigger, optionsPosition, closeDropdownOnBlur, showNonTappableOptions, onFocus, onBlur, value: controlledValue, completedParams: controlledParams, onChange: onChangeProp, onParamsChange, products, onProductSelect, source, setCursor, }: UseAIAutocompleteOptions): UseAIAutocompleteReturn;
+declare function useAIAutocomplete({ onSubmit, onError, optionOverrides, maskCompletedText, apiConfig, columns, dropdownTrigger, optionsPosition, closeDropdownOnBlur, showNonTappableOptions, showSkipButton, onFocus, onBlur, value: controlledValue, completedParams: controlledParams, onChange: onChangeProp, onParamsChange, products, onProductSelect, source, setCursor, }: UseAIAutocompleteOptions): UseAIAutocompleteReturn;
 
 export { AIAutocomplete, AIAutocompleteDropdown, type AIAutocompleteDropdownProps, type AIAutocompleteHandle, type AIAutocompleteProps, type UseAIAutocompleteOptions, type UseAIAutocompleteReturn, useAIAutocomplete };

package/dist/index.js

@@ -1,4 +1,4 @@
-"use strict";var Ge=Object.defineProperty;var _t=Object.getOwnPropertyDescriptor;var Pt=Object.getOwnPropertyNames;var It=Object.prototype.hasOwnProperty;var St=(e,o)=>{for(var a in o)Ge(e,a,{get:o[a],enumerable:!0})},At=(e,o,a,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let s of Pt(o))!It.call(e,s)&&s!==a&&Ge(e,s,{get:()=>o[s],enumerable:!(n=_t(o,s))||n.enumerable});return e};var Ct=e=>At(Ge({},"__esModule",{value:!0}),e);var Ot={};St(Ot,{AIAutocomplete:()=>gt,AIAutocompleteDropdown:()=>Te,buildSubmitResult:()=>Fe.buildSubmitResult,useAIAutocomplete:()=>ze,withSkippedParams:()=>Fe.withSkippedParams});module.exports=Ct(Ot);var Fe=require("@magicx-eng/ai-autocomplete-vanilla");var _=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-67791514")){let e=document.createElement("style");e.id="ac-style-67791514",e.textContent=`.AIAutocomplete-module_container_KKjFU {
+"use strict";var We=Object.defineProperty;var It=Object.getOwnPropertyDescriptor;var St=Object.getOwnPropertyNames;var At=Object.prototype.hasOwnProperty;var Ct=(e,o)=>{for(var a in o)We(e,a,{get:o[a],enumerable:!0})},Et=(e,o,a,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let s of St(o))!At.call(e,s)&&s!==a&&We(e,s,{get:()=>o[s],enumerable:!(n=It(o,s))||n.enumerable});return e};var Dt=e=>Et(We({},"__esModule",{value:!0}),e);var Ht={};Ct(Ht,{AIAutocomplete:()=>bt,AIAutocompleteDropdown:()=>ze,buildSubmitResult:()=>Ne.buildSubmitResult,useAIAutocomplete:()=>Fe,withSkippedParams:()=>Ne.withSkippedParams});module.exports=Dt(Ht);var Ne=require("@magicx-eng/ai-autocomplete-vanilla");var P=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-67791514")){let e=document.createElement("style");e.id="ac-style-67791514",e.textContent=`.AIAutocomplete-module_container_KKjFU {
   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
@@ -179,7 +179,7 @@
     opacity: 0;
   }
 }
-`,document.head.appendChild(e)}var pe={container:"AIAutocomplete-module_container_KKjFU",inputWrapper:"AIAutocomplete-module_inputWrapper_FLq1b",editorArea:"AIAutocomplete-module_editorArea_7rBWq",input:"AIAutocomplete-module_input_IW-P-",pillListContainer:"AIAutocomplete-module_pillListContainer_h92IA",submitSlot:"AIAutocomplete-module_submitSlot_GhuCM",aiaPillReveal:"AIAutocomplete-module_aiaPillReveal_wf05b"};var ve=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
+`,document.head.appendChild(e)}var me={container:"AIAutocomplete-module_container_KKjFU",inputWrapper:"AIAutocomplete-module_inputWrapper_FLq1b",editorArea:"AIAutocomplete-module_editorArea_7rBWq",input:"AIAutocomplete-module_input_IW-P-",pillListContainer:"AIAutocomplete-module_pillListContainer_h92IA",submitSlot:"AIAutocomplete-module_submitSlot_GhuCM",aiaPillReveal:"AIAutocomplete-module_aiaPillReveal_wf05b"};var ve=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
  * Built-in appearance defaults \u2014 zero specificity via :where().
  * Consumer CSS always wins without !important.
  *
@@ -248,11 +248,10 @@
      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);
-  /* Suggestion pills (Figma "ParamPill"): transparent fill + dashed border;
+  /* Suggestion pills (Figma "ParamPill"): transparent fill, no visible border;
      per-pill opacity via getPillOpacity. */
   --aia-pill-bg: var(--aia-primitive-neutral-750);
   --aia-pill-color: var(--aia-primitive-neutral-300);
-  --aia-pill-border: var(--aia-primitive-neutral-750-a30);
   --aia-pill-font-size: 16px;
 
   /* Completed params (Figma "RichTextPill"): compact faint-gray chip with
@@ -305,10 +304,9 @@
      \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);
-  /* Suggestion pills (Figma "ParamPill"): transparent fill + dashed border. */
+  /* 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);
-  --aia-pill-border: var(--aia-primitive-neutral-750-a30);
   --aia-pill-font-size: 16px;
 
   /* Completed params (Figma "RichTextPill") \u2014 dark theme (design source):
@@ -374,6 +372,33 @@
   --aia-footer-fade-inset: calc(-1 * var(--aia-footer-fade-lead)) 0 0;
 }
 
+/* In the dropdown, the parameter label reads as a section header for the
+   options beneath it \u2014 not an outlined chip floating over them. It drops the
+   pill's inner horizontal padding and left-aligns its text with the option
+   text below, which sits 10px in from the dropdown's content edge. The label's
+   own list wrapper carries that 10px so the text lands exactly on the option
+   text's left edge.
+
+   Selector shape differs from the vanilla/Angular copies (which target the
+   \`.aia-pill-list\` / \`.aia-pill\` class names): the module classes here are
+   hash-scoped locals, unreachable from this global stylesheet. The bar's
+   direct \`> span\` child is the masked scroll wrapper (\`.pillScroll\`, tagged
+   \`data-aia-pill-scroll\`) that holds PillList, so the 10px indent lands on
+   the wrapper and the module zeroes PillList's own base padding underneath
+   (\`.pillScroll > span\` in AIAutocompleteDropdown.module.css \u2014 remove one
+   only with the other). Pills are matched via \`[data-aia-pill]\` (unique to
+   ParamPill). Like the sibling structural \`[data-aia-dropdown]\` rules below,
+   this is deliberately NOT \`:where()\`-wrapped \u2014 it must win over ParamPill's
+   own \`.pill\` base rule. */
+[data-aia-dropdown] [data-aia-pillbar] > span {
+  padding-inline: 10px;
+}
+[data-aia-dropdown] [data-aia-pillbar] [data-aia-pill] {
+  justify-content: flex-start;
+  border-inline-width: 0;
+  padding-inline: 0;
+}
+
 /* The reserved band the footer overlaps, kept OUT of \`@layer layout\` on
    purpose. A consumer reset (\`* { margin: 0; padding: 0 }\`, Tailwind's
    preflight, \u2026) is unlayered, and an unlayered declaration beats every layered
@@ -533,8 +558,23 @@
 }
 
 /* The dropdown container owns the 10px/8px edge padding and the 8px section
-   gaps (matching Figma); the pill row adds none \u2014 just horizontal scroll + fade. */
+   gaps (matching Figma); the pill row adds none. The horizontal scroll + fade
+   live on the inner .pillScroll wrapper, NOT the bar itself: the trailing skip
+   button is the bar's other child, and a mask on the bar would fade it out
+   along with the overflowing pills it's meant to sit beside. */
 .AIAutocompleteDropdown-module_pillBar_pwTXe {
+  overflow: hidden;
+}
+
+/* Scrollable region for the pills. The appearance layer's
+   \`[data-aia-pillbar] > span\` rule lands here (10px inline padding aligning
+   the param label with the option text), so the inner PillList span must not
+   add its own base padding on top \u2014 see the child rule below. */
+.AIAutocompleteDropdown-module_pillScroll_Tpzus {
+  display: inline-flex;
+  align-items: center;
+  flex: 1 1 auto;
+  min-width: 0;
   overflow-x: auto;
   overflow-y: hidden;
   scrollbar-width: none;
@@ -542,10 +582,55 @@
   -webkit-mask-image: linear-gradient(to right, #000 0, #000 calc(100% - 48px), transparent 100%);
 }
 
-.AIAutocompleteDropdown-module_pillBar_pwTXe::-webkit-scrollbar {
+.AIAutocompleteDropdown-module_pillScroll_Tpzus > span {
+  padding-inline: 0;
+}
+
+.AIAutocompleteDropdown-module_pillScroll_Tpzus::-webkit-scrollbar {
   display: none;
 }
 
+/* Trailing "skip" button \u2014 dismisses the active pill, same action as pressing
+   \u2192 at the end of the input. Pinned at the bar's far edge (auto inline-start
+   margin), outside the masked scroller. Typography follows the footer hint
+   (quiet chrome), not the pills. Declarations mirror \`.magicx-aia-skip\` in the
+   vanilla stylesheet \u2014 change both in the same commit. */
+.AIAutocompleteDropdown-module_skip_7-olS {
+  display: inline-flex;
+  align-items: center;
+  margin-inline-start: auto;
+  flex-shrink: 0;
+  padding: 5px 8px;
+  border: none;
+  /* Matches the completed-param chip radius, so the hover fill reads as a
+     soft rectangle rather than a capsule. */
+  border-radius: 6px;
+  background: transparent;
+  font-family: inherit;
+  font-size: var(--aia-skip-font-size, 10px);
+  line-height: 18px;
+  color: var(--aia-skip-color, var(--aia-footer-hint-color, #505050));
+  cursor: pointer;
+  white-space: nowrap;
+  transition:
+    color 150ms ease-out,
+    background-color 150ms ease-out;
+}
+
+.AIAutocompleteDropdown-module_skip_7-olS:hover {
+  color: var(--aia-skip-color-hover, var(--aia-pill-color, var(--aia-color-text-muted, #c1c4cb)));
+  /* Same fill as a highlighted option row (--aia-option-bg), so the hover
+     reads with the dropdown's own hover language and stays visible on both
+     mode surfaces. */
+  background: var(--aia-skip-hover-bg, var(--aia-option-bg, transparent));
+}
+
+.AIAutocompleteDropdown-module_skip_7-olS:disabled {
+  pointer-events: none;
+  cursor: default;
+  opacity: 0.5;
+}
+
 /* --- Fallback loading skeleton (only when no pills/options are cached) --- */
 .AIAutocompleteDropdown-module_skeletonBars_HVr9C {
   display: flex;
@@ -580,7 +665,7 @@
     opacity: 0.25;
   }
 }
-`,document.head.appendChild(e)}var he={dropdown:"AIAutocompleteDropdown-module_dropdown_yz2KC",visible:"AIAutocompleteDropdown-module_visible_QCoXj",pillBar:"AIAutocompleteDropdown-module_pillBar_pwTXe",skeletonBars:"AIAutocompleteDropdown-module_skeletonBars_HVr9C",skeletonBar:"AIAutocompleteDropdown-module_skeletonBar_O3xIx",aiaSkeletonPulse:"AIAutocompleteDropdown-module_aiaSkeletonPulse_G8W7q"};var ge=require("@magicx-eng/ai-autocomplete-vanilla"),Ce=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-5259a217")){let e=document.createElement("style");e.id="ac-style-5259a217",e.textContent=`@layer layout {
+`,document.head.appendChild(e)}var se={dropdown:"AIAutocompleteDropdown-module_dropdown_yz2KC",visible:"AIAutocompleteDropdown-module_visible_QCoXj",pillBar:"AIAutocompleteDropdown-module_pillBar_pwTXe",pillScroll:"AIAutocompleteDropdown-module_pillScroll_Tpzus",skip:"AIAutocompleteDropdown-module_skip_7-olS",skeletonBars:"AIAutocompleteDropdown-module_skeletonBars_HVr9C",skeletonBar:"AIAutocompleteDropdown-module_skeletonBar_O3xIx",aiaSkeletonPulse:"AIAutocompleteDropdown-module_aiaSkeletonPulse_G8W7q"};var ge=require("@magicx-eng/ai-autocomplete-vanilla"),De=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-5259a217")){let e=document.createElement("style");e.id="ac-style-5259a217",e.textContent=`@layer layout {
   .aia-cluster {
     display: flex;
     flex-wrap: wrap;
@@ -622,7 +707,7 @@
     justify-content: space-around;
   }
 }
-`,document.head.appendChild(e)}var Ke=require("react/jsx-runtime");function ye({gap:e,align:o="center",justify:a="start",noWrap:n=!1,inline:s=!1,className:l,children:r,...u}){let g=e?{"--aia-cluster-gap":e}:void 0,w={className:l?`aia-cluster ${l}`:"aia-cluster","data-align":o,"data-justify":a,"data-nowrap":n||void 0,"data-inline":s||void 0,style:g,...u};return s?(0,Ke.jsx)("span",{...w,children:r}):(0,Ke.jsx)("div",{...w,children:r})}if(typeof document<"u"&&!document.getElementById("ac-style-56b0c577")){let e=document.createElement("style");e.id="ac-style-56b0c577",e.textContent=`/* The footer adds its own 8px horizontal inset so it stays clear of the
+`,document.head.appendChild(e)}var Ue=require("react/jsx-runtime");function ke({gap:e,align:o="center",justify:a="start",noWrap:n=!1,inline:s=!1,className:d,children:i,...m}){let b=e?{"--aia-cluster-gap":e}:void 0,w={className:d?`aia-cluster ${d}`:"aia-cluster","data-align":o,"data-justify":a,"data-nowrap":n||void 0,"data-inline":s||void 0,style:b,...m};return s?(0,Ue.jsx)("span",{...w,children:i}):(0,Ue.jsx)("div",{...w,children:i})}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. */
@@ -752,15 +837,16 @@
     justify-content: flex-end;
   }
 }
-`,document.head.appendChild(e)}var ae={footer:"DropdownFooter-module_footer_qQQ7x",hintGroup:"DropdownFooter-module_hintGroup_ZzbPf",brandLink:"DropdownFooter-module_brandLink_r4f3R",key:"DropdownFooter-module_key_Bz1H-",hint:"DropdownFooter-module_hint_GKEOH",brand:"DropdownFooter-module_brand_Al-lR",badge:"DropdownFooter-module_badge_Fk9vg",row:"DropdownFooter-module_row_BgZ6Q"};var j=require("react/jsx-runtime");function Ze({isOptionHighlighted:e=!1,isInputEmpty:o=!1}){let{key:a,hint:n}=(0,ge.getFooterHint)(e,o),[s,l]=(0,Ce.useState)(ge.ATTRIBUTION_URL);return(0,Ce.useEffect)(()=>{l((0,ge.buildAttributionUrl)())},[]),(0,j.jsx)("footer",{className:ae.footer,"data-aia-footer":"",children:(0,j.jsxs)(ye,{justify:"between",noWrap:!0,className:ae.row,children:[(0,j.jsxs)(ye,{gap:"5px",className:ae.hintGroup,children:[(0,j.jsx)("kbd",{className:ae.key,children:a}),(0,j.jsx)("span",{className:ae.hint,children:n})]}),(0,j.jsxs)("a",{className:ae.brandLink,href:s,target:"_blank",rel:"noopener noreferrer",children:[(0,j.jsx)("span",{className:ae.brand,children:"AI"}),(0,j.jsx)("span",{className:ae.badge,children:"Autocomplete"})]})]})})}if(typeof document<"u"&&!document.getElementById("ac-style-199d0432")){let e=document.createElement("style");e.id="ac-style-199d0432",e.textContent=`/* ParamPill (Figma "ParamPill") \u2014 unfilled suggestion pill: transparent fill
-   with a dashed border. ~28px via 6px padding + 14px text + the 1px border
-   (border-box). */
+`,document.head.appendChild(e)}var te={footer:"DropdownFooter-module_footer_qQQ7x",hintGroup:"DropdownFooter-module_hintGroup_ZzbPf",brandLink:"DropdownFooter-module_brandLink_r4f3R",key:"DropdownFooter-module_key_Bz1H-",hint:"DropdownFooter-module_hint_GKEOH",brand:"DropdownFooter-module_brand_Al-lR",badge:"DropdownFooter-module_badge_Fk9vg",row:"DropdownFooter-module_row_BgZ6Q"};var Q=require("react/jsx-runtime");function et({isOptionHighlighted:e=!1,isInputEmpty:o=!1}){let{key:a,hint:n}=(0,ge.getFooterHint)(e,o),[s,d]=(0,De.useState)(ge.ATTRIBUTION_URL);return(0,De.useEffect)(()=>{d((0,ge.buildAttributionUrl)())},[]),(0,Q.jsx)("footer",{className:te.footer,"data-aia-footer":"",children:(0,Q.jsxs)(ke,{justify:"between",noWrap:!0,className:te.row,children:[(0,Q.jsxs)(ke,{gap:"5px",className:te.hintGroup,children:[(0,Q.jsx)("kbd",{className:te.key,children:a}),(0,Q.jsx)("span",{className:te.hint,children:n})]}),(0,Q.jsxs)("a",{className:te.brandLink,href:s,target:"_blank",rel:"noopener noreferrer",children:[(0,Q.jsx)("span",{className:te.brand,children:"AI"}),(0,Q.jsx)("span",{className:te.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. */
 .ParamPill-module_pill_6Ga7S {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 5px 8px;
-  border: 1px dashed var(--aia-pill-border, rgba(189, 189, 189, 0.3));
+  border: 1px solid transparent;
   border-radius: 7px;
   background: transparent;
   color: var(--aia-pill-color, var(--aia-color-text-muted, #c1c4cb));
@@ -808,7 +894,7 @@
     opacity: 0;
   }
 }
-`,document.head.appendChild(e)}var le={pill:"ParamPill-module_pill_6Ga7S",fadeIn:"ParamPill-module_fadeIn_Ux4eQ",rounded:"ParamPill-module_rounded_y7xA9",skeleton:"ParamPill-module_skeleton_57P0T",skeletonPulse:"ParamPill-module_skeletonPulse_xGcUy"};var et=require("react/jsx-runtime"),We={selected:1,first:.7,next:.4,last:.2};function Ye({label:e,state:o,rounded:a,loading:n,onClick:s}){let l=[le.pill,a?le.rounded:"",n?le.skeleton:""].filter(Boolean).join(" ");return(0,et.jsx)("button",{type:"button","data-aia-pill":"","data-aia-loading":n?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:l,style:{opacity:We[o]},onMouseDown:r=>r.preventDefault(),onClick:n?void 0:s,disabled:n,children:e})}if(typeof document<"u"&&!document.getElementById("ac-style-0fcb7940")){let e=document.createElement("style");e.id="ac-style-0fcb7940",e.textContent=`.PillList-module_list_qvLqO {
+`,document.head.appendChild(e)}var le={pill:"ParamPill-module_pill_6Ga7S",fadeIn:"ParamPill-module_fadeIn_Ux4eQ",rounded:"ParamPill-module_rounded_y7xA9",skeleton:"ParamPill-module_skeleton_57P0T",skeletonPulse:"ParamPill-module_skeletonPulse_xGcUy"};var at=require("react/jsx-runtime"),Ve={selected:1,first:.7,next:.4,last:.2};function tt({label:e,state:o,rounded:a,loading:n,onClick:s}){let d=[le.pill,a?le.rounded:"",n?le.skeleton:""].filter(Boolean).join(" ");return(0,at.jsx)("button",{type:"button","data-aia-pill":"","data-aia-loading":n?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:d,style:{opacity:Ve[o]},onMouseDown:i=>i.preventDefault(),onClick:n?void 0:s,disabled:n,children:e})}if(typeof document<"u"&&!document.getElementById("ac-style-0fcb7940")){let e=document.createElement("style");e.id="ac-style-0fcb7940",e.textContent=`.PillList-module_list_qvLqO {
   position: relative;
   z-index: 1;
   pointer-events: auto;
@@ -818,7 +904,7 @@
   align-items: center;
   vertical-align: middle;
 }
-`,document.head.appendChild(e)}var Ue={list:"PillList-module_list_qvLqO"};var ke=require("react/jsx-runtime"),Et=[125,69];function tt(e){return e===0?"first":e===1?"next":"last"}function Ee({pills:e,activePillIndex:o,onSelectPill:a,activeSelected:n,rounded:s,loading:l}){return l&&e.length===0?(0,ke.jsx)("span",{className:Ue.list,"data-aia-pill-list-loading":"",children:Et.map((r,u)=>(0,ke.jsx)("span",{"data-aia-pill-skeleton":"",className:`${le.pill} ${s?le.rounded:""} ${le.skeleton}`,style:{width:r,opacity:We[tt(u)]}},`skel-${r}`))}):(0,ke.jsx)("span",{className:Ue.list,"data-aia-pill-list-loading":l?"":void 0,children:e.map((r,u)=>{let g=!!n&&u===o;return(0,ke.jsx)(Ye,{label:r.text,state:g?"selected":tt(u),selected:g,rounded:s,loading:l,onClick:()=>a(u)},`${r.type}-${r.text}`)})})}if(typeof document<"u"&&!document.getElementById("ac-style-fef1688d")){let e=document.createElement("style");e.id="ac-style-fef1688d",e.textContent=`/* Product strip \u2014 the React counterpart of the vanilla core's strip rules
+`,document.head.appendChild(e)}var qe={list:"PillList-module_list_qvLqO"};var _e=require("react/jsx-runtime"),Rt=[125,69];function ot(e){return e===0?"first":e===1?"next":"last"}function Re({pills:e,activePillIndex:o,onSelectPill:a,activeSelected:n,rounded:s,loading:d}){return d&&e.length===0?(0,_e.jsx)("span",{className:qe.list,"data-aia-pill-list-loading":"",children:Rt.map((i,m)=>(0,_e.jsx)("span",{"data-aia-pill-skeleton":"",className:`${le.pill} ${s?le.rounded:""} ${le.skeleton}`,style:{width:i,opacity:Ve[ot(m)]}},`skel-${i}`))}):(0,_e.jsx)("span",{className:qe.list,"data-aia-pill-list-loading":d?"":void 0,children:e.map((i,m)=>{let b=!!n&&m===o;return(0,_e.jsx)(tt,{label:i.text,state:b?"selected":ot(m),selected:b,rounded:s,loading:d,onClick:()=>a(m)},`${i.type}-${i.text}`)})})}if(typeof document<"u"&&!document.getElementById("ac-style-fef1688d")){let e=document.createElement("style");e.id="ac-style-fef1688d",e.textContent=`/* Product strip \u2014 the React counterpart of the vanilla core's strip rules
    (packages/vanilla/src/styles.css). Same tokens, same defaults, so a consumer
    theming one package sees the same result in the other.
 
@@ -985,7 +1071,7 @@
     var(--aia-option-color-selected, var(--aia-color-text-default, #fff))
   );
 }
-`,document.head.appendChild(e)}var G={section:"ProductStrip-module_section_Hugfg",label:"ProductStrip-module_label_nuc93",row:"ProductStrip-module_row_WDVBX",card:"ProductStrip-module_card_JBGYT",media:"ProductStrip-module_media_RrbGe",image:"ProductStrip-module_image_5pNL7",body:"ProductStrip-module_body_ly032",vendor:"ProductStrip-module_vendor_Gvu7G",title:"ProductStrip-module_title_gCNmq",price:"ProductStrip-module_price_gULcE"};var z=require("react/jsx-runtime");function at({products:e,listboxId:o,onSelect:a,onFocusChange:n,focusable:s=!0}){if(e.length===0)return null;let l=`${o}-products-label`;return(0,z.jsxs)("section",{className:G.section,"data-aia-products":"",role:"group","aria-labelledby":l,children:[(0,z.jsx)("div",{className:G.label,id:l,children:"Products"}),(0,z.jsx)("div",{className:G.row,"data-aia-products-row":"",children:e.map((r,u)=>(0,z.jsx)(Rt,{product:r,id:`${o}-product-${u}`,onSelect:a,onFocusChange:n,focusable:s},r.id))})]})}function Rt({product:e,id:o,onSelect:a,onFocusChange:n,focusable:s}){let l=r=>{r.metaKey||r.ctrlKey||r.shiftKey||r.altKey||r.button!==0||(r.preventDefault(),a(e))};return(0,z.jsxs)("a",{id:o,className:G.card,"data-aia-product":"",role:"option","aria-selected":!1,href:e.url,tabIndex:s?0:-1,onClick:l,onKeyDown:r=>{r.key!=="Enter"&&r.key!==" "||(r.preventDefault(),a(e))},onFocus:()=>n?.(!0),onBlur:r=>{r.relatedTarget?.closest("[data-aia-dropdown]")||n?.(!1)},children:[(0,z.jsx)("span",{className:G.media,"data-aia-product-placeholder":e.imageUrl?void 0:"",children:e.imageUrl?(0,z.jsx)("img",{className:G.image,src:e.imageUrl,alt:"",loading:"lazy",decoding:"async"}):null}),(0,z.jsxs)("span",{className:G.body,children:[e.vendor?(0,z.jsx)("span",{className:G.vendor,children:e.vendor}):null,(0,z.jsx)("span",{className:G.title,children:e.title}),e.price?(0,z.jsx)("span",{className:G.price,children:e.price}):null]})]})}var be=require("@magicx-eng/ai-autocomplete-vanilla"),De=require("react");var ot=require("@magicx-eng/ai-autocomplete-vanilla"),Re=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-948e58da")){let e=document.createElement("style");e.id="ac-style-948e58da",e.textContent=`@layer layout {
+`,document.head.appendChild(e)}var K={section:"ProductStrip-module_section_Hugfg",label:"ProductStrip-module_label_nuc93",row:"ProductStrip-module_row_WDVBX",card:"ProductStrip-module_card_JBGYT",media:"ProductStrip-module_media_RrbGe",image:"ProductStrip-module_image_5pNL7",body:"ProductStrip-module_body_ly032",vendor:"ProductStrip-module_vendor_Gvu7G",title:"ProductStrip-module_title_gCNmq",price:"ProductStrip-module_price_gULcE"};var L=require("react/jsx-runtime");function it({products:e,listboxId:o,onSelect:a,onFocusChange:n,focusable:s=!0}){if(e.length===0)return null;let d=`${o}-products-label`;return(0,L.jsxs)("section",{className:K.section,"data-aia-products":"",role:"group","aria-labelledby":d,children:[(0,L.jsx)("div",{className:K.label,id:d,children:"Products"}),(0,L.jsx)("div",{className:K.row,"data-aia-products-row":"",children:e.map((i,m)=>(0,L.jsx)(Tt,{product:i,id:`${o}-product-${m}`,onSelect:a,onFocusChange:n,focusable:s},i.id))})]})}function Tt({product:e,id:o,onSelect:a,onFocusChange:n,focusable:s}){let d=i=>{i.metaKey||i.ctrlKey||i.shiftKey||i.altKey||i.button!==0||(i.preventDefault(),a(e))};return(0,L.jsxs)("a",{id:o,className:K.card,"data-aia-product":"",role:"option","aria-selected":!1,href:e.url,tabIndex:s?0:-1,onClick:d,onKeyDown:i=>{i.key!=="Enter"&&i.key!==" "||(i.preventDefault(),a(e))},onFocus:()=>n?.(!0),onBlur:i=>{i.relatedTarget?.closest("[data-aia-dropdown]")||n?.(!1)},children:[(0,L.jsx)("span",{className:K.media,"data-aia-product-placeholder":e.imageUrl?void 0:"",children:e.imageUrl?(0,L.jsx)("img",{className:K.image,src:e.imageUrl,alt:"",loading:"lazy",decoding:"async"}):null}),(0,L.jsxs)("span",{className:K.body,children:[e.vendor?(0,L.jsx)("span",{className:K.vendor,children:e.vendor}):null,(0,L.jsx)("span",{className:K.title,children:e.title}),e.price?(0,L.jsx)("span",{className:K.price,children:e.price}):null]})]})}var be=require("@magicx-eng/ai-autocomplete-vanilla"),Le=require("react");var rt=require("@magicx-eng/ai-autocomplete-vanilla"),Te=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-948e58da")){let e=document.createElement("style");e.id="ac-style-948e58da",e.textContent=`@layer layout {
   .aia-grid {
     display: grid;
     grid-template-columns: repeat(
@@ -1020,7 +1106,7 @@
     border-radius: 3px;
   }
 }
-`,document.head.appendChild(e)}var rt=require("react/jsx-runtime");function it({min:e="16rem",max:o,gap:a,scroll:n=!1,maxHeight:s,scrollResetKey:l,cols:r,className:u,children:g,...w}){let I=(0,Re.useRef)(null);(0,Re.useLayoutEffect)(()=>{if(l===void 0)return;let S=I.current;S&&(S.scrollTop=0)},[l]);let v={"--aia-grid-min":e};return o&&(v["--aia-grid-max"]=o),a&&(v["--aia-grid-gap"]=a),s&&(v["--aia-grid-max-height"]=s),r&&(v.gridTemplateColumns=(0,ot.optionsGridTemplateColumns)(r)),(0,rt.jsx)("div",{ref:I,className:u?`aia-grid ${u}`:"aia-grid","data-scroll":n||void 0,style:v,...w,children:g})}var fe=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-82820da7")){let e=document.createElement("style");e.id="ac-style-82820da7",e.textContent=`.SuggestionItem-module_item_d4vpD {
+`,document.head.appendChild(e)}var st=require("react/jsx-runtime");function nt({min:e="16rem",max:o,gap:a,scroll:n=!1,maxHeight:s,scrollResetKey:d,cols:i,className:m,children:b,...w}){let S=(0,Te.useRef)(null);(0,Te.useLayoutEffect)(()=>{if(d===void 0)return;let F=S.current;F&&(F.scrollTop=0)},[d]);let y={"--aia-grid-min":e};return o&&(y["--aia-grid-max"]=o),a&&(y["--aia-grid-gap"]=a),s&&(y["--aia-grid-max-height"]=s),i&&(y.gridTemplateColumns=(0,rt.optionsGridTemplateColumns)(i)),(0,st.jsx)("div",{ref:S,className:m?`aia-grid ${m}`:"aia-grid","data-scroll":n||void 0,style:y,...w,children:b})}var fe=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-82820da7")){let e=document.createElement("style");e.id="ac-style-82820da7",e.textContent=`.SuggestionItem-module_item_d4vpD {
   position: relative;
   overflow: visible;
   display: flex;
@@ -1370,7 +1456,7 @@
     filter: brightness(0.55);
   }
 }
-`,document.head.appendChild(e)}var K={item:"SuggestionItem-module_item_d4vpD",fadeIn:"SuggestionItem-module_fadeIn_I8u35",content:"SuggestionItem-module_content_T-Qba",tappable:"SuggestionItem-module_tappable_70KcX",nonTappable:"SuggestionItem-module_nonTappable_xSZM-",highlighted:"SuggestionItem-module_highlighted_Hb0SU",tag:"SuggestionItem-module_tag_e3Fwe",pressed:"SuggestionItem-module_pressed_98o-r",glassFade:"SuggestionItem-module_glassFade_oyiSj",tapDown:"SuggestionItem-module_tapDown_G3WGz",streaks:"SuggestionItem-module_streaks_d9PEB",streaksVert:"SuggestionItem-module_streaksVert_ERlV1",streakHorizRight:"SuggestionItem-module_streakHorizRight_aboGz",streakHorizLeft:"SuggestionItem-module_streakHorizLeft_BreWJ",streakVertUp:"SuggestionItem-module_streakVertUp_to1GD",streakVertDown:"SuggestionItem-module_streakVertDown_OrcLh",skeletonPulse:"SuggestionItem-module_skeletonPulse_plvdD",text:"SuggestionItem-module_text_yqoh9"};var de=require("react/jsx-runtime");function nt({option:e,isHighlighted:o,onSelect:a,onHighlight:n,id:s,loading:l}){let[r,u]=(0,fe.useState)(!1),g=(0,fe.useRef)(void 0);(0,fe.useEffect)(()=>()=>clearTimeout(g.current),[]);let w=()=>{l||!e.is_tappable||r||(u(!0),a(e),clearTimeout(g.current),g.current=setTimeout(()=>u(!1),500))},I=[K.item,o&&!l?K.highlighted:"",e.is_tappable?K.tappable:K.nonTappable,r?K.pressed:""].filter(Boolean).join(" ");return(0,de.jsxs)("div",{id:s,role:"option","data-aia-option":"","data-aia-loading":l?"":void 0,"aria-selected":o,className:I,tabIndex:l||!e.is_tappable?-1:0,onClick:w,onKeyDown:v=>{!l&&e.is_tappable&&(v.key==="Enter"||v.key===" ")&&(v.preventDefault(),w())},onMouseEnter:!l&&e.is_tappable?n:void 0,children:[(0,de.jsx)("div",{className:K.streaks}),(0,de.jsx)("div",{className:K.streaksVert}),(0,de.jsxs)("span",{className:K.content,children:[(0,de.jsx)("span",{className:K.text,children:e.icon?`${e.icon} ${e.text}`:e.text}),e.tag&&(0,de.jsx)("span",{className:K.tag,children:e.tag})]})]})}var Ve=require("react/jsx-runtime");function Dt(){let[e,o]=(0,De.useState)(be.isOptionsGridMobileViewport);return(0,De.useEffect)(()=>{if(typeof window>"u"||!window.matchMedia)return;let a=window.matchMedia(be.OPTIONS_GRID_MOBILE_QUERY),n=()=>o(a.matches);return n(),a.addEventListener("change",n),()=>a.removeEventListener("change",n)},[]),e}function st({options:e,activeIndex:o,onSelect:a,onHighlight:n,listboxId:s,loading:l,groupKey:r}){let u=Dt(),{cols:g,maxHeight:w}=(0,be.computeOptionsGridLayout)(e.length,u);return(0,Ve.jsx)(it,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:r,cols:g,maxHeight:w,children:e.map((I,v)=>(0,Ve.jsx)(nt,{option:I,isHighlighted:v===o,onSelect:a,onHighlight:()=>n(v),id:`${s}-option-${v}`,loading:l},I.text))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`@layer layout {
+`,document.head.appendChild(e)}var W={item:"SuggestionItem-module_item_d4vpD",fadeIn:"SuggestionItem-module_fadeIn_I8u35",content:"SuggestionItem-module_content_T-Qba",tappable:"SuggestionItem-module_tappable_70KcX",nonTappable:"SuggestionItem-module_nonTappable_xSZM-",highlighted:"SuggestionItem-module_highlighted_Hb0SU",tag:"SuggestionItem-module_tag_e3Fwe",pressed:"SuggestionItem-module_pressed_98o-r",glassFade:"SuggestionItem-module_glassFade_oyiSj",tapDown:"SuggestionItem-module_tapDown_G3WGz",streaks:"SuggestionItem-module_streaks_d9PEB",streaksVert:"SuggestionItem-module_streaksVert_ERlV1",streakHorizRight:"SuggestionItem-module_streakHorizRight_aboGz",streakHorizLeft:"SuggestionItem-module_streakHorizLeft_BreWJ",streakVertUp:"SuggestionItem-module_streakVertUp_to1GD",streakVertDown:"SuggestionItem-module_streakVertDown_OrcLh",skeletonPulse:"SuggestionItem-module_skeletonPulse_plvdD",text:"SuggestionItem-module_text_yqoh9"};var de=require("react/jsx-runtime");function lt({option:e,isHighlighted:o,onSelect:a,onHighlight:n,id:s,loading:d}){let[i,m]=(0,fe.useState)(!1),b=(0,fe.useRef)(void 0);(0,fe.useEffect)(()=>()=>clearTimeout(b.current),[]);let w=()=>{d||!e.is_tappable||i||(m(!0),a(e),clearTimeout(b.current),b.current=setTimeout(()=>m(!1),500))},S=[W.item,o&&!d?W.highlighted:"",e.is_tappable?W.tappable:W.nonTappable,i?W.pressed:""].filter(Boolean).join(" ");return(0,de.jsxs)("div",{id:s,role:"option","data-aia-option":"","data-aia-loading":d?"":void 0,"aria-selected":o,className:S,tabIndex:d||!e.is_tappable?-1:0,onClick:w,onKeyDown:y=>{!d&&e.is_tappable&&(y.key==="Enter"||y.key===" ")&&(y.preventDefault(),w())},onMouseEnter:!d&&e.is_tappable?n:void 0,children:[(0,de.jsx)("div",{className:W.streaks}),(0,de.jsx)("div",{className:W.streaksVert}),(0,de.jsxs)("span",{className:W.content,children:[(0,de.jsx)("span",{className:W.text,children:e.icon?`${e.icon} ${e.text}`:e.text}),e.tag&&(0,de.jsx)("span",{className:W.tag,children:e.tag})]})]})}var $e=require("react/jsx-runtime");function Lt(){let[e,o]=(0,Le.useState)(be.isOptionsGridMobileViewport);return(0,Le.useEffect)(()=>{if(typeof window>"u"||!window.matchMedia)return;let a=window.matchMedia(be.OPTIONS_GRID_MOBILE_QUERY),n=()=>o(a.matches);return n(),a.addEventListener("change",n),()=>a.removeEventListener("change",n)},[]),e}function dt({options:e,activeIndex:o,onSelect:a,onHighlight:n,listboxId:s,loading:d,groupKey:i}){let m=Lt(),{cols:b,maxHeight:w}=(0,be.computeOptionsGridLayout)(e.length,m);return(0,$e.jsx)(nt,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:i,cols:b,maxHeight:w,children:e.map((S,y)=>(0,$e.jsx)(lt,{option:S,isHighlighted:y===o,onSelect:a,onHighlight:()=>n(y),id:`${s}-option-${y}`,loading:d},S.text))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`@layer layout {
   .aia-stack {
     display: flex;
     flex-direction: column;
@@ -1387,7 +1473,7 @@
   }
   /* data-align="stretch" is the flex default \u2014 no rule needed. */
 }
-`,document.head.appendChild(e)}var dt=require("react/jsx-runtime");function lt({space:e,align:o="stretch",className:a,children:n,...s}){let l=e?{"--aia-stack-space":e}:void 0;return(0,dt.jsx)("div",{className:a?`aia-stack ${a}`:"aia-stack","data-align":o,style:l,...s,children:n})}var W=require("react/jsx-runtime"),Tt=[159,119,164],Lt=()=>{};function zt(e){let o=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[a,n]=(0,ve.useState)(o);if((0,ve.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let s=window.matchMedia("(prefers-color-scheme: dark)"),l=()=>n(s.matches);return s.addEventListener("change",l),()=>s.removeEventListener("change",l)},[e]),e!==void 0)return e==="auto"?a?"dark":"light":e}function Te({suggestions:e,activeIndex:o,onSelect:a,onHighlight:n,isOpen:s,id:l,className:r,pills:u,onPillClick:g,showPills:w=!0,activeSelected:I=!1,isLoading:v=!1,isInputEmpty:S=!1,products:A,onProductSelect:Q,onProductFocusChange:X,optionsPosition:oe="below",mode:J}){let D=zt(J),y=D!==void 0,c=e[0]?.options??[],ie=!!(u&&u.length>0&&g),Z=!!(A&&A.length>0),F=s&&(c.length>0||w&&ie||v||Z),T={suggestions:e,activeIndex:o,pills:u,showPills:w,activeSelected:I,isLoading:v,isInputEmpty:S,products:A},R=(0,ve.useRef)(T);F&&(R.current=T);let f=F?T:R.current,M=f.suggestions[0],N=M?.options??[],L=f.activeIndex>=0&&!!N[f.activeIndex]?.is_tappable,V=!!(f.pills&&f.pills.length>0&&g),Y=f.showPills&&V,ee=f.showPills&&!V&&f.isLoading,$=Y||ee,H=N.length>0,re=f.isLoading&&!H,O=f.products??[];return(0,W.jsx)("div",{id:l,role:"listbox","data-aia-dropdown":"","data-options-position":oe,"data-mode":D,"data-aia-loading":f.isLoading?"":void 0,"data-aia-has-products":O.length>0?"":void 0,className:`${y?"magicx-aia ":""}${he.dropdown} ${F?he.visible:""} ${r??""}`,onMouseDown:t=>t.preventDefault(),children:(0,W.jsxs)(lt,{space:"8px",children:[$&&(0,W.jsx)(ye,{noWrap:!0,className:he.pillBar,"data-aia-pillbar":"",children:(0,W.jsx)(Ee,{pills:f.pills??[],activePillIndex:0,activeSelected:f.activeSelected,onSelectPill:g??(()=>{}),rounded:!0,loading:f.isLoading})}),H&&(0,W.jsx)(st,{options:N,activeIndex:f.activeIndex,onSelect:a,onHighlight:n,listboxId:l,loading:f.isLoading,groupKey:M?`${M.type} ${M.text}`:""}),re&&(0,W.jsx)("div",{className:he.skeletonBars,"data-aia-skeleton-bars":"",children:Tt.map(t=>(0,W.jsx)("span",{className:he.skeletonBar,style:{width:t}},`bar-${t}`))}),(0,W.jsx)(at,{products:O,listboxId:l,onSelect:Q??Lt,onFocusChange:X,focusable:F}),(0,W.jsx)(Ze,{isOptionHighlighted:L,isInputEmpty:f.isInputEmpty})]})})}var xe=require("@magicx-eng/ai-autocomplete-vanilla");if(typeof document<"u"&&!document.getElementById("ac-style-fdee06e6")){let e=document.createElement("style");e.id="ac-style-fdee06e6",e.textContent=`.SubmitButton-module_submitButton_otz7H {
+`,document.head.appendChild(e)}var ct=require("react/jsx-runtime");function pt({space:e,align:o="stretch",className:a,children:n,...s}){let d=e?{"--aia-stack-space":e}:void 0;return(0,ct.jsx)("div",{className:a?`aia-stack ${a}`:"aia-stack","data-align":o,style:d,...s,children:n})}var z=require("react/jsx-runtime"),zt=[159,119,164],Bt=()=>{};function Ft(e){let o=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[a,n]=(0,ve.useState)(o);if((0,ve.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let s=window.matchMedia("(prefers-color-scheme: dark)"),d=()=>n(s.matches);return s.addEventListener("change",d),()=>s.removeEventListener("change",d)},[e]),e!==void 0)return e==="auto"?a?"dark":"light":e}function ze({suggestions:e,activeIndex:o,onSelect:a,onHighlight:n,isOpen:s,id:d,className:i,pills:m,onPillClick:b,showPills:w=!0,onSkip:S,showSkipButton:y=!0,skipDisabled:F=!1,activeSelected:R=!1,isLoading:D=!1,isInputEmpty:J=!1,products:M,onProductSelect:ae,onProductFocusChange:T,optionsPosition:_="below",mode:V}){let c=Ft(V),oe=c!==void 0,X=e[0]?.options??[],Z=!!(m&&m.length>0&&b),C=!!(M&&M.length>0),N=s&&(X.length>0||w&&Z||D||C),O={suggestions:e,activeIndex:o,pills:m,showPills:w,showSkipButton:y,skipDisabled:F,activeSelected:R,isLoading:D,isInputEmpty:J,products:M},q=(0,ve.useRef)(O);N&&(q.current=O);let h=N?O:q.current,A=h.suggestions[0],H=A?.options??[],Y=h.activeIndex>=0&&!!H[h.activeIndex]?.is_tappable,G=!!(h.pills&&h.pills.length>0&&b),$=h.showPills&&G,j=h.showPills&&!G&&h.isLoading,ee=$||j,l=G&&h.showSkipButton&&!!S,t=h.pills?.[0]?.text,u=H.length>0,v=h.isLoading&&!u,g=h.products??[];return(0,z.jsx)("div",{id:d,role:"listbox","data-aia-dropdown":"","data-options-position":_,"data-mode":c,"data-aia-loading":h.isLoading?"":void 0,"data-aia-has-products":g.length>0?"":void 0,className:`${oe?"magicx-aia ":""}${se.dropdown} ${N?se.visible:""} ${i??""}`,onMouseDown:r=>r.preventDefault(),children:(0,z.jsxs)(pt,{space:"8px",children:[(ee||l)&&(0,z.jsxs)(ke,{noWrap:!0,className:se.pillBar,"data-aia-pillbar":"",children:[ee&&(0,z.jsx)("span",{className:se.pillScroll,"data-aia-pill-scroll":"",children:(0,z.jsx)(Re,{pills:h.pills??[],activePillIndex:0,activeSelected:h.activeSelected,onSelectPill:b??(()=>{}),rounded:!0,loading:h.isLoading})}),l&&(0,z.jsx)("button",{type:"button",tabIndex:-1,className:se.skip,"data-aia-skip":"",disabled:h.isLoading||h.skipDisabled,"aria-label":t?`Skip ${t}`:"Skip",onClick:S,children:"skip"})]}),u&&(0,z.jsx)(dt,{options:H,activeIndex:h.activeIndex,onSelect:a,onHighlight:n,listboxId:d,loading:h.isLoading,groupKey:A?`${A.type} ${A.text}`:""}),v&&(0,z.jsx)("div",{className:se.skeletonBars,"data-aia-skeleton-bars":"",children:zt.map(r=>(0,z.jsx)("span",{className:se.skeletonBar,style:{width:r}},`bar-${r}`))}),(0,z.jsx)(it,{products:g,listboxId:d,onSelect:ae??Bt,onFocusChange:T,focusable:N}),(0,z.jsx)(et,{isOptionHighlighted:Y,isInputEmpty:h.isInputEmpty})]})})}var xe=require("@magicx-eng/ai-autocomplete-vanilla");if(typeof document<"u"&&!document.getElementById("ac-style-fdee06e6")){let e=document.createElement("style");e.id="ac-style-fdee06e6",e.textContent=`.SubmitButton-module_submitButton_otz7H {
   flex-shrink: 0;
   width: 32px;
   height: 32px;
@@ -1422,5 +1508,5 @@
   );
   cursor: default;
 }
-`,document.head.appendChild(e)}var ct={submitButton:"SubmitButton-module_submitButton_otz7H"};var Le=require("react/jsx-runtime");function pt({disabled:e,onClick:o}){return(0,Le.jsx)("button",{type:"button","data-aia-submit":"",className:ct.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),o()},"aria-label":"Submit",children:(0,Le.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,Le.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var mt=require("@magicx-eng/ai-autocomplete-vanilla"),b=require("react");var $e=require("react");function ut(e){let o=(0,$e.useRef)(e);o.current=e;let a=(0,$e.useRef)(null);a.current===null&&(a.current={fetch:(s,l)=>{let r=o.current;return r?r.fetch(s,l):Promise.reject(new Error("products config removed"))},transform:s=>o.current?.transform(s)??[],get limit(){return o.current?.limit}});let n=e!==void 0;return{config:n?a.current:void 0,enabled:n}}var Bt={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],products:[],activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],placeholderText:"",isDropdownOpen:!1,isActivePillSelected:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1};function ze({onSubmit:e,onError:o,optionOverrides:a,maskCompletedText:n,apiConfig:s,columns:l=2,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:w,onFocus:I,onBlur:v,value:S,completedParams:A,onChange:Q,onParamsChange:X,products:oe,onProductSelect:J,source:D,setCursor:y}){let c=(0,b.useRef)(null),[ie,Z]=(0,b.useState)(null),F=(0,b.useRef)(e);F.current=e;let T=(0,b.useRef)(o);T.current=o;let R=(0,b.useRef)(Q);R.current=Q;let f=(0,b.useRef)(X);f.current=X;let M=(0,b.useRef)(I);M.current=I;let N=(0,b.useRef)(v);N.current=v;let L=(0,b.useRef)(y);L.current=y;let V=(0,b.useRef)(J);V.current=J;let Y=ut(oe);(0,b.useEffect)(()=>{if(typeof document>"u")return;let d=new mt.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:s,optionOverrides:a,maskCompletedText:n,columns:l,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:w,source:D,value:S,completedParams:A,onSubmit:(...P)=>F.current?.(...P),onError:(...P)=>T.current?.(...P),onChange:(...P)=>R.current?.(...P),onParamsChange:(...P)=>f.current?.(...P),onFocus:()=>M.current?.(),onBlur:()=>N.current?.(),onProductSelect:P=>V.current?.(P),setCursor:P=>L.current?.(P),products:Y.config});c.current=d,Z(d.getState());let E=d.subscribe(P=>Z(P));return()=>{E(),d.destroy(),c.current===d&&(c.current=null)}},[]),(0,b.useEffect)(()=>{S!==void 0&&c.current?.setValue(S)},[S]),(0,b.useEffect)(()=>{A!==void 0&&c.current?.setCompletedParams(A)},[A]);let ee=JSON.stringify(s??null),$=(0,b.useRef)(a),H=(0,b.useRef)(0);if(a!==$.current){let d=$.current,E=a,P=Object.keys(d??{}),me=Object.keys(E??{});(P.length!==me.length||me.some(ne=>!d?.[ne]||E[ne]!==d[ne]))&&H.current++,$.current=a}(0,b.useEffect)(()=>{c.current?.update({apiConfig:s,optionOverrides:a,dropdownTrigger:r,optionsPosition:u,closeDropdownOnBlur:g,showNonTappableOptions:w})},[ee,H.current,r,u,g,w]);let re=(0,b.useRef)(!1);(0,b.useEffect)(()=>{if(!re.current){re.current=!0;return}c.current?.update({products:Y.config})},[Y.enabled]);let O=(0,b.useRef)(null);O.current===null&&(O.current={handleTextChange:d=>c.current?.handleTextChange(d),handleKeyDown:d=>{let E="nativeEvent"in d?d.nativeEvent:d;c.current?.handleKeyDown(E)},setFocused:d=>c.current?.setFocused(d),startEditingParam:d=>c.current?.startEditingParam(d),exitEditMode:()=>c.current?.exitEditMode(),handleCaretAfterInput:d=>c.current?.handleCaretAfterInput(d),handleCaretMove:d=>c.current?.handleCaretMove(d),replaceEditingRange:d=>c.current?.replaceEditingRange(d)??!1,setActivePill:d=>c.current?.setActivePill(d),removeLastParam:()=>c.current?.removeLastParam(),clearNewParamId:()=>c.current?.clearNewParamId(),reset:()=>c.current?.reset(),selectOption:d=>c.current?.selectOption(d),selectProduct:d=>c.current?.selectProduct(d),setActiveDropdownIndex:d=>c.current?.setActiveDropdownIndex(d),handleFocus:()=>c.current?.setFocused(!0),handleBlur:()=>c.current?.setFocused(!1)});let t=O.current,p=(0,b.useCallback)(d=>{let E=d.target.value,me=E.length>0&&!d.nativeEvent?.isComposing&&E[0]!==E[0].toUpperCase()?E[0].toUpperCase()+E.slice(1):E;c.current?.handleTextChange(me)},[]),m=(0,b.useCallback)(d=>{c.current?.handleKeyDown(d.nativeEvent)},[]),x=c.current,i=ie??Bt,C=S!==void 0?S:i.text,te=A!==void 0?A:i.completedParams,q=i.actionableSuggestions,_e=q[0],ue=x?.listboxId??"",Me=i.activeDropdownIndex>=0&&x?`${ue}-option-${i.activeDropdownIndex}`:void 0,ce=i.editingParam,we=ce?{type:ce.suggestionType,text:ce.suggestionPlaceholder,required:!0,options:ce.options}:null,Pe=we??_e,Oe=we?[we]:q,Ie=!x||i.isLoading&&!i.editingParam&&!i.inSelectionAnimation;return{completedParams:te,skippedParams:i.skippedParams,suggestionPills:q,setActivePill:t.setActivePill,removeLastParam:t.removeLastParam,segments:i.segments,newParamId:i.newParamId,clearNewParamId:t.clearNewParamId,suggestions:i.suggestions,activeIndex:i.activeDropdownIndex,isReady:i.isReady,isLoading:Ie,isFocused:i.isFocused,isDropdownOpen:i.isDropdownOpen,isActivePillSelected:i.isActivePillSelected,placeholderText:i.placeholderText,listboxId:ue,error:i.error,products:i.products,selectProduct:t.selectProduct,handleTextChange:t.handleTextChange,handleKeyDown:t.handleKeyDown,setFocused:t.setFocused,editingParam:ce,editingAnchor:i.editingAnchor,caretOffset:i.caretOffset,startEditingParam:t.startEditingParam,exitEditMode:t.exitEditMode,handleCaretAfterInput:t.handleCaretAfterInput,handleCaretMove:t.handleCaretMove,replaceEditingRange:t.replaceEditingRange,inputProps:{value:C,placeholder:i.placeholderText||void 0,onChange:p,onKeyDown:m,onFocus:t.handleFocus,onBlur:t.handleBlur,role:"combobox","aria-expanded":i.isDropdownOpen,"aria-activedescendant":Me,"aria-autocomplete":"list","aria-controls":ue},reset:t.reset,dropdownProps:{suggestions:Pe?[{...Pe,options:i.filteredOptions}]:[],activeIndex:i.activeDropdownIndex,onSelect:t.selectOption,onHighlight:t.setActiveDropdownIndex,isOpen:i.isDropdownOpen,id:ue,pills:Oe,activeSelected:i.isActivePillSelected,onPillClick:t.setActivePill,isLoading:Ie,isInputEmpty:C.trim().length===0,products:i.products,onProductSelect:t.selectProduct,onProductFocusChange:t.setFocused,optionsPosition:u??"below"}}}var B=require("@magicx-eng/ai-autocomplete-vanilla"),h=require("react"),Be;function Ft(){if(Be!==void 0)return Be;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Be=e.contentEditable==="plaintext-only",Be}function ht(e){let{segments:o,newParamId:a,editingParam:n,editingAnchor:s,caretOffset:l,placeholderText:r,isFocused:u,isDropdownOpen:g,listboxId:w,activeDescendantId:I,autoFocus:v,handleTextChange:S,handleKeyDown:A,handleCaretAfterInput:Q,handleCaretMove:X,startEditingParam:oe,replaceEditingRange:J,setFocused:D}=e,y=(0,h.useRef)(null),c=(0,h.useRef)(!1),ie=(0,h.useRef)(""),Z=(0,h.useRef)(""),F=(0,h.useRef)(null),T=(0,h.useRef)(0);F.current=l,(0,h.useEffect)(()=>{if(!v)return;let t=y.current;if(!t)return;document.activeElement===t?D(!0):t.focus();let p=t.ownerDocument??document,m=p.getSelection(),x=m&&m.rangeCount>0&&t.contains(m.anchorNode);if(m&&!x){let i=p.createRange();i.selectNodeContents(t),i.collapse(!0),m.removeAllRanges(),m.addRange(i)}},[v,D]),(0,h.useEffect)(()=>{let t=y.current;if(!t)return;let p=t.ownerDocument??document,m=()=>{let x=p.getSelection();if(!x||x.rangeCount===0||!x.anchorNode||!t.contains(x.anchorNode))return;let i=x.anchorNode,C=i.nodeType===Node.ELEMENT_NODE?i:i.parentElement,q=(x.isCollapsed?C?.closest('strong[data-seg="completed"][data-param-id]'):null)?.dataset.paramId??null;if(q&&q!==n?.id){oe(q);return}performance.now()-T.current<50||X((0,B.getCursorOffset)(t))};return p.addEventListener("selectionchange",m),()=>p.removeEventListener("selectionchange",m)},[n,oe,X]),(0,h.useLayoutEffect)(()=>{let t=y.current;t&&(0,B.renderEditableContent)({input:t,segments:o,newParamId:a,editingParamId:n?.id??null,placeholderText:r??"",isFocused:u})},[o,a,n,r,u]),(0,h.useLayoutEffect)(()=>{let t=ie.current,p=a??"";if(ie.current=p,!p||p===t)return;let m=y.current;if(!m)return;m.focus();let x=F.current??(0,B.plainTextLength)(m);(0,B.setCursorOffset)(m,x)},[a]),(0,h.useLayoutEffect)(()=>{let t=Z.current,p=n?.id??"";if(Z.current=p,!p||p===t||s==null)return;let m=y.current;m&&(0,B.setCursorOffset)(m,s)},[n,s]);let R=(0,h.useCallback)(()=>{if(c.current)return;let t=y.current;if(!t)return;let p=(0,B.extractPlainText)(t),x=p.length>0&&p[0]!==p[0].toUpperCase()?p[0].toUpperCase()+p.slice(1):p;S(x)},[S]),f=(0,h.useCallback)(()=>{T.current=performance.now(),R();let t=y.current;t&&Q((0,B.getCursorOffset)(t))},[R,Q]);(0,h.useEffect)(()=>{let t=y.current;if(!t)return;let p=m=>{let x=m,i=x.inputType;if(i==="insertParagraph"||i==="insertLineBreak"||i==="insertFromDrop"){m.preventDefault();return}if(i.startsWith("insert")||i.startsWith("delete")){let C=i.startsWith("delete")?"":x.data??"";J(C)&&m.preventDefault()}};return t.addEventListener("beforeinput",p),()=>t.removeEventListener("beforeinput",p)},[J]);let M=(0,h.useCallback)(()=>{c.current=!0},[]),N=(0,h.useCallback)(()=>{c.current=!1,R()},[R]),L=(0,h.useCallback)(t=>{t.preventDefault();let p=y.current;if(!p)return;let m=(t.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!m)return;let x=p.ownerDocument??document,i=x.getSelection();if(!i||i.rangeCount===0)return;let C=i.getRangeAt(0);if(!p.contains(C.startContainer))return;C.deleteContents();let te=x.createTextNode(m);C.insertNode(te),C.setStartAfter(te),C.collapse(!0),i.removeAllRanges(),i.addRange(C),R()},[R]),V=(0,h.useCallback)(t=>A(t),[A]),Y=(0,h.useCallback)(()=>D(!0),[D]),ee=(0,h.useCallback)(()=>D(!1),[D]),$=(0,h.useCallback)(()=>y.current?.focus(),[]),H=(0,h.useCallback)(()=>y.current?.blur(),[]),re=(0,h.useCallback)(()=>{let t=y.current;return t?(0,B.extractPlainText)(t):""},[]),O=Ft()?"plaintext-only":"true";return{inputRef:y,editorProps:{ref:y,contentEditable:O,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":w,"aria-expanded":g,"aria-activedescendant":I,spellCheck:!0,enterKeyHint:"send",onInput:f,onKeyDown:V,onCompositionStart:M,onCompositionEnd:N,onPaste:L,onFocus:Y,onBlur:ee},getPlainText:re,focus:$,blur:H}}var U=require("react/jsx-runtime");function Mt(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var gt=(0,_.forwardRef)(function({onSubmit:o,onError:a,optionOverrides:n,maskCompletedText:s,className:l,apiConfig:r,columns:u,pillPlacement:g="dropdown",mode:w="auto",optionsPosition:I="below",animations:v=!0,dropdownTrigger:S,closeDropdownOnBlur:A,showNonTappableOptions:Q,autoFocus:X=!0,onFocus:oe,onBlur:J,value:D,completedParams:y,onChange:c,onParamsChange:ie,products:Z,onProductSelect:F,submitButton:T},R){let f=(0,_.useRef)(null),M=(0,_.useRef)(null),N=(0,_.useRef)(()=>{}),L=(0,_.useRef)(null),V=(0,_.useRef)(null);(0,_.useEffect)(()=>{let k=f.current;if(k)return L.current?L.current.setMode(w):L.current=new xe.ModeController(k,w),()=>{L.current?.destroy(),L.current=null}},[w]);let Y=(0,_.useCallback)(k=>{let se=V.current?.current;se&&(se.focus(),(0,xe.setCursorOffset)(se,k))},[]),{completedParams:ee,skippedParams:$,suggestionPills:H,setActivePill:re,segments:O,newParamId:t,clearNewParamId:p,placeholderText:m,isFocused:x,isDropdownOpen:i,isActivePillSelected:C,isLoading:te,activeIndex:q,listboxId:_e,handleTextChange:ue,handleKeyDown:Me,setFocused:ce,editingParam:we,editingAnchor:Pe,caretOffset:Oe,startEditingParam:Ie,handleCaretAfterInput:d,handleCaretMove:E,replaceEditingRange:P,dropdownProps:me,reset:ne}=ze({onSubmit:k=>N.current(k),onError:a,optionOverrides:n,maskCompletedText:s,apiConfig:r,columns:u,dropdownTrigger:S,optionsPosition:I,closeDropdownOnBlur:A,showNonTappableOptions:Q,onFocus:oe,onBlur:J,value:D,completedParams:y,onChange:c,onParamsChange:ie,products:Z,onProductSelect:F,source:"full-sdk",setCursor:Y});(0,_.useEffect)(()=>{if(!t)return;let k=window.setTimeout(()=>p(),650);return()=>window.clearTimeout(k)},[t,p]);let ft=q>=0?`${_e}-option-${q}`:void 0,{inputRef:Ne,editorProps:bt,focus:Se,blur:qe,getPlainText:je}=ht({segments:O,newParamId:t,editingParam:we,editingAnchor:Pe,caretOffset:Oe,placeholderText:m,isFocused:x,isDropdownOpen:i,listboxId:_e,activeDescendantId:ft,autoFocus:X,handleTextChange:ue,handleKeyDown:Me,handleCaretAfterInput:d,handleCaretMove:E,startEditingParam:Ie,replaceEditingRange:P,setFocused:ce});V.current=Ne,(0,_.useLayoutEffect)(()=>{let k=M.current,se=Ne.current;if(!k||!se)return;let Qe=()=>{let Je=k.firstElementChild;if(!Je)return;let yt=Je.getBoundingClientRect(),kt=se.getBoundingClientRect();yt.top>=kt.bottom-2?k.setAttribute("data-aia-pill-wrapped",""):k.removeAttribute("data-aia-pill-wrapped")};Qe();let Xe=new ResizeObserver(Qe);return Xe.observe(se),()=>Xe.disconnect()},[O,H.length,te,Ne]),(0,_.useImperativeHandle)(R,()=>({focus:Se,blur:qe,reset:ne,setMode:k=>L.current?.setMode(k)}),[Se,qe,ne]);let Ae=!!O.length||ee.length>0,He=(0,_.useCallback)(()=>{if(!Ae)return;let k=je();o((0,xe.buildSubmitResult)(k,ee,$)),ne()},[Ae,ee,$,o,ne,je]);N.current=He;let vt=(0,_.useCallback)(k=>{k.target?.closest("[data-aia-pill]")||Se()},[Se]),xt=g==="inline",wt=g==="dropdown";return(0,U.jsxs)("div",{ref:f,className:`magicx-aia ${pe.container} ${l??""}`,"data-pill-placement":g,"data-options-position":I,"data-animations":v?"on":"off","data-mode":Mt(w),children:[(0,U.jsx)(Te,{...me,showPills:wt}),(0,U.jsxs)("div",{className:pe.inputWrapper,onClick:vt,children:[(0,U.jsxs)("div",{className:pe.editorArea,"data-aia-editor":"",children:[(0,U.jsx)("div",{...bt,className:pe.input,"data-aia-input":""}),xt&&(te||H.length>0)&&(0,U.jsx)("span",{ref:M,className:pe.pillListContainer,"data-aia-pill-list-container":"",children:(0,U.jsx)(Ee,{pills:H,activePillIndex:0,activeSelected:C,onSelectPill:re,loading:te})})]}),T===null?null:T===void 0?(0,U.jsx)(pt,{disabled:!Ae,onClick:He}):(0,U.jsx)("span",{"data-aia-submit":"",className:pe.submitSlot,onClick:k=>{Ae&&(k.stopPropagation(),He())},children:T})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,buildSubmitResult,useAIAutocomplete,withSkippedParams});
+`,document.head.appendChild(e)}var ut={submitButton:"SubmitButton-module_submitButton_otz7H"};var Be=require("react/jsx-runtime");function mt({disabled:e,onClick:o}){return(0,Be.jsx)("button",{type:"button","data-aia-submit":"",className:ut.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),o()},"aria-label":"Submit",children:(0,Be.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,Be.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var gt=require("@magicx-eng/ai-autocomplete-vanilla"),x=require("react");var je=require("react");function ht(e){let o=(0,je.useRef)(e);o.current=e;let a=(0,je.useRef)(null);a.current===null&&(a.current={fetch:(s,d)=>{let i=o.current;return i?i.fetch(s,d):Promise.reject(new Error("products config removed"))},transform:s=>o.current?.transform(s)??[],get limit(){return o.current?.limit}});let n=e!==void 0;return{config:n?a.current:void 0,enabled:n}}var Mt={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],products:[],activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],placeholderText:"",isDropdownOpen:!1,isActivePillSelected:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1};function Fe({onSubmit:e,onError:o,optionOverrides:a,maskCompletedText:n,apiConfig:s,columns:d=2,dropdownTrigger:i,optionsPosition:m,closeDropdownOnBlur:b,showNonTappableOptions:w,showSkipButton:S,onFocus:y,onBlur:F,value:R,completedParams:D,onChange:J,onParamsChange:M,products:ae,onProductSelect:T,source:_,setCursor:V}){let c=(0,x.useRef)(null),[oe,X]=(0,x.useState)(null),Z=(0,x.useRef)(e);Z.current=e;let C=(0,x.useRef)(o);C.current=o;let N=(0,x.useRef)(J);N.current=J;let O=(0,x.useRef)(M);O.current=M;let q=(0,x.useRef)(y);q.current=y;let h=(0,x.useRef)(F);h.current=F;let A=(0,x.useRef)(V);A.current=V;let H=(0,x.useRef)(T);H.current=T;let Y=ht(ae);(0,x.useEffect)(()=>{if(typeof document>"u")return;let p=new gt.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:s,optionOverrides:a,maskCompletedText:n,columns:d,dropdownTrigger:i,optionsPosition:m,closeDropdownOnBlur:b,showNonTappableOptions:w,source:_,value:R,completedParams:D,onSubmit:(...I)=>Z.current?.(...I),onError:(...I)=>C.current?.(...I),onChange:(...I)=>N.current?.(...I),onParamsChange:(...I)=>O.current?.(...I),onFocus:()=>q.current?.(),onBlur:()=>h.current?.(),onProductSelect:I=>H.current?.(I),setCursor:I=>A.current?.(I),products:Y.config});c.current=p,X(p.getState());let E=p.subscribe(I=>X(I));return()=>{E(),p.destroy(),c.current===p&&(c.current=null)}},[]),(0,x.useEffect)(()=>{R!==void 0&&c.current?.setValue(R)},[R]),(0,x.useEffect)(()=>{D!==void 0&&c.current?.setCompletedParams(D)},[D]);let G=JSON.stringify(s??null),$=(0,x.useRef)(a),j=(0,x.useRef)(0);if(a!==$.current){let p=$.current,E=a,I=Object.keys(p??{}),he=Object.keys(E??{});(I.length!==he.length||he.some(ye=>!p?.[ye]||E[ye]!==p[ye]))&&j.current++,$.current=a}(0,x.useEffect)(()=>{c.current?.update({apiConfig:s,optionOverrides:a,dropdownTrigger:i,optionsPosition:m,closeDropdownOnBlur:b,showNonTappableOptions:w})},[G,j.current,i,m,b,w]);let ee=(0,x.useRef)(!1);(0,x.useEffect)(()=>{if(!ee.current){ee.current=!0;return}c.current?.update({products:Y.config})},[Y.enabled]);let l=(0,x.useRef)(null);l.current===null&&(l.current={handleTextChange:p=>c.current?.handleTextChange(p),handleKeyDown:p=>{let E="nativeEvent"in p?p.nativeEvent:p;c.current?.handleKeyDown(E)},setFocused:p=>c.current?.setFocused(p),startEditingParam:p=>c.current?.startEditingParam(p),exitEditMode:()=>c.current?.exitEditMode(),handleCaretAfterInput:p=>c.current?.handleCaretAfterInput(p),handleCaretMove:p=>c.current?.handleCaretMove(p),replaceEditingRange:p=>c.current?.replaceEditingRange(p)??!1,setActivePill:p=>c.current?.setActivePill(p),skipActivePill:()=>c.current?.skipActivePill(),removeLastParam:()=>c.current?.removeLastParam(),clearNewParamId:()=>c.current?.clearNewParamId(),reset:()=>c.current?.reset(),selectOption:p=>c.current?.selectOption(p),selectProduct:p=>c.current?.selectProduct(p),setActiveDropdownIndex:p=>c.current?.setActiveDropdownIndex(p),handleFocus:()=>c.current?.setFocused(!0),handleBlur:()=>c.current?.setFocused(!1)});let t=l.current,u=(0,x.useCallback)(p=>{let E=p.target.value,he=E.length>0&&!p.nativeEvent?.isComposing&&E[0]!==E[0].toUpperCase()?E[0].toUpperCase()+E.slice(1):E;c.current?.handleTextChange(he)},[]),v=(0,x.useCallback)(p=>{c.current?.handleKeyDown(p.nativeEvent)},[]),g=c.current,r=oe??Mt,ie=R!==void 0?R:r.text,pe=D!==void 0?D:r.completedParams,ce=r.actionableSuggestions,Pe=ce[0],ue=g?.listboxId??"",Oe=r.activeDropdownIndex>=0&&g?`${ue}-option-${r.activeDropdownIndex}`:void 0,re=r.editingParam,we=re?{type:re.suggestionType,text:re.suggestionPlaceholder,required:!0,options:re.options}:null,Ie=we??Pe,He=we?[we]:ce,Se=!g||r.isLoading&&!r.editingParam&&!r.inSelectionAnimation;return{completedParams:pe,skippedParams:r.skippedParams,suggestionPills:ce,setActivePill:t.setActivePill,skipActivePill:t.skipActivePill,removeLastParam:t.removeLastParam,segments:r.segments,newParamId:r.newParamId,clearNewParamId:t.clearNewParamId,suggestions:r.suggestions,activeIndex:r.activeDropdownIndex,isReady:r.isReady,isLoading:Se,isFocused:r.isFocused,isDropdownOpen:r.isDropdownOpen,isActivePillSelected:r.isActivePillSelected,placeholderText:r.placeholderText,listboxId:ue,error:r.error,products:r.products,selectProduct:t.selectProduct,handleTextChange:t.handleTextChange,handleKeyDown:t.handleKeyDown,setFocused:t.setFocused,editingParam:re,editingAnchor:r.editingAnchor,caretOffset:r.caretOffset,startEditingParam:t.startEditingParam,exitEditMode:t.exitEditMode,handleCaretAfterInput:t.handleCaretAfterInput,handleCaretMove:t.handleCaretMove,replaceEditingRange:t.replaceEditingRange,inputProps:{value:ie,placeholder:r.placeholderText||void 0,onChange:u,onKeyDown:v,onFocus:t.handleFocus,onBlur:t.handleBlur,role:"combobox","aria-expanded":r.isDropdownOpen,"aria-activedescendant":Oe,"aria-autocomplete":"list","aria-controls":ue},reset:t.reset,dropdownProps:{suggestions:Ie?[{...Ie,options:r.filteredOptions}]:[],activeIndex:r.activeDropdownIndex,onSelect:t.selectOption,onHighlight:t.setActiveDropdownIndex,isOpen:r.isDropdownOpen,id:ue,pills:He,activeSelected:r.isActivePillSelected,onPillClick:t.setActivePill,onSkip:t.skipActivePill,showSkipButton:(S??!0)&&!re,skipDisabled:r.inSelectionAnimation,isLoading:Se,isInputEmpty:ie.trim().length===0,products:r.products,onProductSelect:t.selectProduct,onProductFocusChange:t.setFocused,optionsPosition:m??"below"}}}var B=require("@magicx-eng/ai-autocomplete-vanilla"),f=require("react"),Me;function Nt(){if(Me!==void 0)return Me;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Me=e.contentEditable==="plaintext-only",Me}function ft(e){let{segments:o,newParamId:a,editingParam:n,editingAnchor:s,caretOffset:d,placeholderText:i,isFocused:m,isDropdownOpen:b,listboxId:w,activeDescendantId:S,autoFocus:y,handleTextChange:F,handleKeyDown:R,handleCaretAfterInput:D,handleCaretMove:J,startEditingParam:M,replaceEditingRange:ae,setFocused:T}=e,_=(0,f.useRef)(null),V=(0,f.useRef)(!1),c=(0,f.useRef)(""),oe=(0,f.useRef)(""),X=(0,f.useRef)(null),Z=(0,f.useRef)(0);X.current=d,(0,f.useEffect)(()=>{if(!y)return;let l=_.current;if(!l)return;document.activeElement===l?T(!0):l.focus();let t=l.ownerDocument??document,u=t.getSelection(),v=u&&u.rangeCount>0&&l.contains(u.anchorNode);if(u&&!v){let g=t.createRange();g.selectNodeContents(l),g.collapse(!0),u.removeAllRanges(),u.addRange(g)}},[y,T]),(0,f.useEffect)(()=>{let l=_.current;if(!l)return;let t=l.ownerDocument??document,u=()=>{let v=t.getSelection();if(!v||v.rangeCount===0||!v.anchorNode||!l.contains(v.anchorNode))return;let g=v.anchorNode,r=g.nodeType===Node.ELEMENT_NODE?g:g.parentElement,pe=(v.isCollapsed?r?.closest('strong[data-seg="completed"][data-param-id]'):null)?.dataset.paramId??null;if(pe&&pe!==n?.id){M(pe);return}performance.now()-Z.current<50||J((0,B.getCursorOffset)(l))};return t.addEventListener("selectionchange",u),()=>t.removeEventListener("selectionchange",u)},[n,M,J]),(0,f.useLayoutEffect)(()=>{let l=_.current;l&&(0,B.renderEditableContent)({input:l,segments:o,newParamId:a,editingParamId:n?.id??null,placeholderText:i??"",isFocused:m})},[o,a,n,i,m]),(0,f.useLayoutEffect)(()=>{let l=c.current,t=a??"";if(c.current=t,!t||t===l)return;let u=_.current;if(!u)return;u.focus();let v=X.current??(0,B.plainTextLength)(u);(0,B.setCursorOffset)(u,v)},[a]),(0,f.useLayoutEffect)(()=>{let l=oe.current,t=n?.id??"";if(oe.current=t,!t||t===l||s==null)return;let u=_.current;u&&(0,B.setCursorOffset)(u,s)},[n,s]);let C=(0,f.useCallback)(()=>{if(V.current)return;let l=_.current;if(!l)return;let t=(0,B.extractPlainText)(l),v=t.length>0&&t[0]!==t[0].toUpperCase()?t[0].toUpperCase()+t.slice(1):t;F(v)},[F]),N=(0,f.useCallback)(()=>{Z.current=performance.now(),C();let l=_.current;l&&D((0,B.getCursorOffset)(l))},[C,D]);(0,f.useEffect)(()=>{let l=_.current;if(!l)return;let t=u=>{let v=u,g=v.inputType;if(g==="insertParagraph"||g==="insertLineBreak"||g==="insertFromDrop"){u.preventDefault();return}if(g.startsWith("insert")||g.startsWith("delete")){let r=g.startsWith("delete")?"":v.data??"";ae(r)&&u.preventDefault()}};return l.addEventListener("beforeinput",t),()=>l.removeEventListener("beforeinput",t)},[ae]);let O=(0,f.useCallback)(()=>{V.current=!0},[]),q=(0,f.useCallback)(()=>{V.current=!1,C()},[C]),h=(0,f.useCallback)(l=>{l.preventDefault();let t=_.current;if(!t)return;let u=(l.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!u)return;let v=t.ownerDocument??document,g=v.getSelection();if(!g||g.rangeCount===0)return;let r=g.getRangeAt(0);if(!t.contains(r.startContainer))return;r.deleteContents();let ie=v.createTextNode(u);r.insertNode(ie),r.setStartAfter(ie),r.collapse(!0),g.removeAllRanges(),g.addRange(r),C()},[C]),A=(0,f.useCallback)(l=>R(l),[R]),H=(0,f.useCallback)(()=>T(!0),[T]),Y=(0,f.useCallback)(()=>T(!1),[T]),G=(0,f.useCallback)(()=>_.current?.focus(),[]),$=(0,f.useCallback)(()=>_.current?.blur(),[]),j=(0,f.useCallback)(()=>{let l=_.current;return l?(0,B.extractPlainText)(l):""},[]),ee=Nt()?"plaintext-only":"true";return{inputRef:_,editorProps:{ref:_,contentEditable:ee,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":w,"aria-expanded":b,"aria-activedescendant":S,spellCheck:!0,enterKeyHint:"send",onInput:N,onKeyDown:A,onCompositionStart:O,onCompositionEnd:q,onPaste:h,onFocus:H,onBlur:Y},getPlainText:j,focus:G,blur:$}}var U=require("react/jsx-runtime");function Ot(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var bt=(0,P.forwardRef)(function({onSubmit:o,onError:a,optionOverrides:n,maskCompletedText:s,className:d,apiConfig:i,columns:m,pillPlacement:b="dropdown",mode:w="auto",optionsPosition:S="below",animations:y=!0,dropdownTrigger:F,closeDropdownOnBlur:R,showNonTappableOptions:D,showSkipButton:J,autoFocus:M=!0,onFocus:ae,onBlur:T,value:_,completedParams:V,onChange:c,onParamsChange:oe,products:X,onProductSelect:Z,submitButton:C},N){let O=(0,P.useRef)(null),q=(0,P.useRef)(null),h=(0,P.useRef)(()=>{}),A=(0,P.useRef)(null),H=(0,P.useRef)(null);(0,P.useEffect)(()=>{let k=O.current;if(k)return A.current?A.current.setMode(w):A.current=new xe.ModeController(k,w),()=>{A.current?.destroy(),A.current=null}},[w]);let Y=(0,P.useCallback)(k=>{let ne=H.current?.current;ne&&(ne.focus(),(0,xe.setCursorOffset)(ne,k))},[]),{completedParams:G,skippedParams:$,suggestionPills:j,setActivePill:ee,skipActivePill:l,segments:t,newParamId:u,clearNewParamId:v,placeholderText:g,isFocused:r,isDropdownOpen:ie,isActivePillSelected:pe,isLoading:ce,activeIndex:Pe,listboxId:ue,handleTextChange:Oe,handleKeyDown:re,setFocused:we,editingParam:Ie,editingAnchor:He,caretOffset:Se,startEditingParam:p,handleCaretAfterInput:E,handleCaretMove:I,replaceEditingRange:he,dropdownProps:ye,reset:Ae}=Fe({onSubmit:k=>h.current(k),onError:a,optionOverrides:n,maskCompletedText:s,apiConfig:i,columns:m,dropdownTrigger:F,optionsPosition:S,closeDropdownOnBlur:R,showNonTappableOptions:D,showSkipButton:J,onFocus:ae,onBlur:T,value:_,completedParams:V,onChange:c,onParamsChange:oe,products:X,onProductSelect:Z,source:"full-sdk",setCursor:Y});(0,P.useEffect)(()=>{if(!u)return;let k=window.setTimeout(()=>v(),650);return()=>window.clearTimeout(k)},[u,v]);let vt=Pe>=0?`${ue}-option-${Pe}`:void 0,{inputRef:Ge,editorProps:xt,focus:Ce,blur:Qe,getPlainText:Je}=ft({segments:t,newParamId:u,editingParam:Ie,editingAnchor:He,caretOffset:Se,placeholderText:g,isFocused:r,isDropdownOpen:ie,listboxId:ue,activeDescendantId:vt,autoFocus:M,handleTextChange:Oe,handleKeyDown:re,handleCaretAfterInput:E,handleCaretMove:I,startEditingParam:p,replaceEditingRange:he,setFocused:we});H.current=Ge,(0,P.useLayoutEffect)(()=>{let k=q.current,ne=Ge.current;if(!k||!ne)return;let Xe=()=>{let Ye=k.firstElementChild;if(!Ye)return;let _t=Ye.getBoundingClientRect(),Pt=ne.getBoundingClientRect();_t.top>=Pt.bottom-2?k.setAttribute("data-aia-pill-wrapped",""):k.removeAttribute("data-aia-pill-wrapped")};Xe();let Ze=new ResizeObserver(Xe);return Ze.observe(ne),()=>Ze.disconnect()},[t,j.length,ce,Ge]),(0,P.useImperativeHandle)(N,()=>({focus:Ce,blur:Qe,reset:Ae,setMode:k=>A.current?.setMode(k),skipActivePill:l}),[Ce,Qe,Ae,l]);let Ee=!!t.length||G.length>0,Ke=(0,P.useCallback)(()=>{if(!Ee)return;let k=Je();o((0,xe.buildSubmitResult)(k,G,$)),Ae()},[Ee,G,$,o,Ae,Je]);h.current=Ke;let wt=(0,P.useCallback)(k=>{k.target?.closest("[data-aia-pill]")||Ce()},[Ce]),yt=b==="inline",kt=b==="dropdown";return(0,U.jsxs)("div",{ref:O,className:`magicx-aia ${me.container} ${d??""}`,"data-pill-placement":b,"data-options-position":S,"data-animations":y?"on":"off","data-mode":Ot(w),children:[(0,U.jsx)(ze,{...ye,showPills:kt}),(0,U.jsxs)("div",{className:me.inputWrapper,onClick:wt,children:[(0,U.jsxs)("div",{className:me.editorArea,"data-aia-editor":"",children:[(0,U.jsx)("div",{...xt,className:me.input,"data-aia-input":""}),yt&&(ce||j.length>0)&&(0,U.jsx)("span",{ref:q,className:me.pillListContainer,"data-aia-pill-list-container":"",children:(0,U.jsx)(Re,{pills:j,activePillIndex:0,activeSelected:pe,onSelectPill:ee,loading:ce})})]}),C===null?null:C===void 0?(0,U.jsx)(mt,{disabled:!Ee,onClick:Ke}):(0,U.jsx)("span",{"data-aia-submit":"",className:me.submitSlot,onClick:k=>{Ee&&(k.stopPropagation(),Ke())},children:C})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,buildSubmitResult,useAIAutocomplete,withSkippedParams});
 //# sourceMappingURL=index.js.map