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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -240,6 +240,7 @@ function App() {
240
240
  | `dropdownTrigger?` | `"auto" \| "manual" \| "hidden"` | `"auto"` | When the dropdown appears. `"auto"` = when options available. `"manual"` = only on pill tap, closes after selection. `"hidden"` = never shows. |
241
241
  | `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. |
242
242
  | `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. |
243
+ | `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. |
243
244
  | `autoFocus?` | `boolean` | `true` | Focus the input on mount. Set to `false` to leave focus to the consumer. |
244
245
  | `onFocus?` | `() => void` | — | Called when the input gains focus. |
245
246
  | `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
438
439
  | Field | Type | Description |
439
440
  |---|---|---|
440
441
  | `setActivePill` | `(index: number) => void` | Move pill at `index` to front (active). |
442
+ | `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. |
441
443
  | `removeLastParam` | `() => void` | Remove the last completed param from state. The text stays in the input as plain text. |
442
444
  | `clearNewParamId` | `() => void` | Clear shimmer animation state. |
443
445
  | `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
580
582
  | `[data-aia-submit]` | Submit button |
581
583
  | `[data-aia-pill]` | Each unfilled-suggestion pill |
582
584
  | `[data-aia-pillbar]` | Pill bar container inside the dropdown |
585
+ | `[data-aia-pill-scroll]` | Scrollable pill region inside the bar — carries the horizontal scroll and right-edge fade mask |
586
+ | `[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` |
583
587
  | `[data-aia-option]` | Each suggestion option |
584
588
  | `[data-aia-dropdown]` | The dropdown root (listbox). Carries `data-aia-has-products` while the product strip has cards. |
585
589
  | `[data-aia-products]` | Product strip section (label + row) |
package/dist/index.d.mts CHANGED
@@ -9,6 +9,12 @@ interface AIAutocompleteHandle {
9
9
  blur: () => void;
10
10
  reset: () => void;
11
11
  setMode: (mode: AppearanceMode) => void;
12
+ /**
13
+ * Skip the active pill — same action as the dropdown's skip button / →.
14
+ * Lets a consumer who hides the built-in button (`showSkipButton={false}`)
15
+ * drive skipping from their own UI without dropping to Tier 2.
16
+ */
17
+ skipActivePill: () => void;
12
18
  }
13
19
  interface AIAutocompleteProps {
14
20
  onSubmit: (result: AutocompleteResult) => void;
@@ -32,6 +38,17 @@ interface AIAutocompleteProps {
32
38
  closeDropdownOnBlur?: boolean;
33
39
  /** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
34
40
  showNonTappableOptions?: boolean;
41
+ /**
42
+ * When true (default), the dropdown's pill bar ends in a small "skip" button
43
+ * that dismisses the active pill — same action as pressing → at the end of
44
+ * the input. It sits at the trailing edge of the bar: visually top-right when
45
+ * the dropdown opens below the input, bottom-right when `optionsPosition` is
46
+ * "above". Set to false to hide it. When pills render elsewhere
47
+ * (`pillPlacement: "inline"` / `"hidden"`) the bar renders as a skip-only
48
+ * row holding just the button; it hides during re-edit and on the loading
49
+ * skeleton either way.
50
+ */
51
+ showSkipButton?: boolean;
35
52
  /** Focus the input on mount. Default: true. */
36
53
  autoFocus?: boolean;
37
54
  /** Called when the input gains focus. */
@@ -97,6 +114,12 @@ interface UseAIAutocompleteOptions {
97
114
  closeDropdownOnBlur?: boolean;
98
115
  /** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
99
116
  showNonTappableOptions?: boolean;
117
+ /**
118
+ * When true (default), `dropdownProps` asks the dropdown to render its
119
+ * trailing "skip" button (see `AIAutocompleteProps.showSkipButton`). Set to
120
+ * false to hide it.
121
+ */
122
+ showSkipButton?: boolean;
100
123
  /** Called when the input gains focus. */
101
124
  onFocus?: () => void;
102
125
  /** Called when the input loses focus. */
@@ -151,6 +174,13 @@ interface UseAIAutocompleteReturn {
151
174
  skippedParams: SkippedParamState[];
152
175
  suggestionPills: Suggestion[];
153
176
  setActivePill: (index: number) => void;
177
+ /**
178
+ * Skip the active pill — same action as pressing → at the end of the input.
179
+ * The built-in dropdown's skip button calls this; hand-rolled skip
180
+ * affordances call it directly. The skipped suggestion joins
181
+ * `skippedParams`.
182
+ */
183
+ skipActivePill: () => void;
154
184
  removeLastParam: () => void;
155
185
  reset: () => void;
156
186
  segments: Segment[];
@@ -235,6 +265,28 @@ interface AIAutocompleteDropdownProps {
235
265
  onPillClick?: (index: number) => void;
236
266
  /** Whether to render pills inside the dropdown. Default: true. Tier 2 consumers who render their own pills should set this to false. */
237
267
  showPills?: boolean;
268
+ /**
269
+ * Skip the active pill — the pill bar's trailing "skip" button routes here.
270
+ * Provided by `dropdownProps` from the hook (wired to `skipActivePill`).
271
+ * The button only renders when this is set.
272
+ */
273
+ onSkip?: () => void;
274
+ /**
275
+ * Whether the pill bar ends in the "skip" trailing button. Default: true
276
+ * (the hook's `dropdownProps` already folds in the `showSkipButton` option
277
+ * and hides the button during re-edit). Requires `onSkip` and real `pills`;
278
+ * with `showPills` false the bar renders as a skip-only row holding just
279
+ * the button.
280
+ */
281
+ showSkipButton?: boolean;
282
+ /**
283
+ * Extra disabled gate for the skip button beyond `isLoading`. Provided by
284
+ * `dropdownProps` from the hook (wired to `inSelectionAnimation`): the
285
+ * UI-facing loading flag is deliberately suppressed during the ~500ms
286
+ * post-selection window, but `skipActivePill` no-ops in it — the button
287
+ * renders disabled instead of swallowing clicks silently. Default: false.
288
+ */
289
+ skipDisabled?: boolean;
238
290
  /** Whether the active pill renders selected (full opacity) vs. the `first` tier. Provided by `dropdownProps` from the hook. Default: false. */
239
291
  activeSelected?: boolean;
240
292
  /** True while a fetch for the latest query is in flight. Replaces options/pills with a skeleton. */
@@ -275,8 +327,8 @@ interface AIAutocompleteDropdownProps {
275
327
 
276
328
  declare const AIAutocomplete: react.ForwardRefExoticComponent<AIAutocompleteProps & react.RefAttributes<AIAutocompleteHandle>>;
277
329
 
278
- 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;
330
+ 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;
279
331
 
280
- 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;
332
+ 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;
281
333
 
282
334
  export { AIAutocomplete, AIAutocompleteDropdown, type AIAutocompleteDropdownProps, type AIAutocompleteHandle, type AIAutocompleteProps, type UseAIAutocompleteOptions, type UseAIAutocompleteReturn, useAIAutocomplete };
package/dist/index.d.ts CHANGED
@@ -9,6 +9,12 @@ interface AIAutocompleteHandle {
9
9
  blur: () => void;
10
10
  reset: () => void;
11
11
  setMode: (mode: AppearanceMode) => void;
12
+ /**
13
+ * Skip the active pill — same action as the dropdown's skip button / →.
14
+ * Lets a consumer who hides the built-in button (`showSkipButton={false}`)
15
+ * drive skipping from their own UI without dropping to Tier 2.
16
+ */
17
+ skipActivePill: () => void;
12
18
  }
13
19
  interface AIAutocompleteProps {
14
20
  onSubmit: (result: AutocompleteResult) => void;
@@ -32,6 +38,17 @@ interface AIAutocompleteProps {
32
38
  closeDropdownOnBlur?: boolean;
33
39
  /** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
34
40
  showNonTappableOptions?: boolean;
41
+ /**
42
+ * When true (default), the dropdown's pill bar ends in a small "skip" button
43
+ * that dismisses the active pill — same action as pressing → at the end of
44
+ * the input. It sits at the trailing edge of the bar: visually top-right when
45
+ * the dropdown opens below the input, bottom-right when `optionsPosition` is
46
+ * "above". Set to false to hide it. When pills render elsewhere
47
+ * (`pillPlacement: "inline"` / `"hidden"`) the bar renders as a skip-only
48
+ * row holding just the button; it hides during re-edit and on the loading
49
+ * skeleton either way.
50
+ */
51
+ showSkipButton?: boolean;
35
52
  /** Focus the input on mount. Default: true. */
36
53
  autoFocus?: boolean;
37
54
  /** Called when the input gains focus. */
@@ -97,6 +114,12 @@ interface UseAIAutocompleteOptions {
97
114
  closeDropdownOnBlur?: boolean;
98
115
  /** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
99
116
  showNonTappableOptions?: boolean;
117
+ /**
118
+ * When true (default), `dropdownProps` asks the dropdown to render its
119
+ * trailing "skip" button (see `AIAutocompleteProps.showSkipButton`). Set to
120
+ * false to hide it.
121
+ */
122
+ showSkipButton?: boolean;
100
123
  /** Called when the input gains focus. */
101
124
  onFocus?: () => void;
102
125
  /** Called when the input loses focus. */
@@ -151,6 +174,13 @@ interface UseAIAutocompleteReturn {
151
174
  skippedParams: SkippedParamState[];
152
175
  suggestionPills: Suggestion[];
153
176
  setActivePill: (index: number) => void;
177
+ /**
178
+ * Skip the active pill — same action as pressing → at the end of the input.
179
+ * The built-in dropdown's skip button calls this; hand-rolled skip
180
+ * affordances call it directly. The skipped suggestion joins
181
+ * `skippedParams`.
182
+ */
183
+ skipActivePill: () => void;
154
184
  removeLastParam: () => void;
155
185
  reset: () => void;
156
186
  segments: Segment[];
@@ -235,6 +265,28 @@ interface AIAutocompleteDropdownProps {
235
265
  onPillClick?: (index: number) => void;
236
266
  /** Whether to render pills inside the dropdown. Default: true. Tier 2 consumers who render their own pills should set this to false. */
237
267
  showPills?: boolean;
268
+ /**
269
+ * Skip the active pill — the pill bar's trailing "skip" button routes here.
270
+ * Provided by `dropdownProps` from the hook (wired to `skipActivePill`).
271
+ * The button only renders when this is set.
272
+ */
273
+ onSkip?: () => void;
274
+ /**
275
+ * Whether the pill bar ends in the "skip" trailing button. Default: true
276
+ * (the hook's `dropdownProps` already folds in the `showSkipButton` option
277
+ * and hides the button during re-edit). Requires `onSkip` and real `pills`;
278
+ * with `showPills` false the bar renders as a skip-only row holding just
279
+ * the button.
280
+ */
281
+ showSkipButton?: boolean;
282
+ /**
283
+ * Extra disabled gate for the skip button beyond `isLoading`. Provided by
284
+ * `dropdownProps` from the hook (wired to `inSelectionAnimation`): the
285
+ * UI-facing loading flag is deliberately suppressed during the ~500ms
286
+ * post-selection window, but `skipActivePill` no-ops in it — the button
287
+ * renders disabled instead of swallowing clicks silently. Default: false.
288
+ */
289
+ skipDisabled?: boolean;
238
290
  /** Whether the active pill renders selected (full opacity) vs. the `first` tier. Provided by `dropdownProps` from the hook. Default: false. */
239
291
  activeSelected?: boolean;
240
292
  /** True while a fetch for the latest query is in flight. Replaces options/pills with a skeleton. */
@@ -275,8 +327,8 @@ interface AIAutocompleteDropdownProps {
275
327
 
276
328
  declare const AIAutocomplete: react.ForwardRefExoticComponent<AIAutocompleteProps & react.RefAttributes<AIAutocompleteHandle>>;
277
329
 
278
- 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;
330
+ 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;
279
331
 
280
- 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;
332
+ 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;
281
333
 
282
334
  export { AIAutocomplete, AIAutocompleteDropdown, type AIAutocompleteDropdownProps, type AIAutocompleteHandle, type AIAutocompleteProps, type UseAIAutocompleteOptions, type UseAIAutocompleteReturn, useAIAutocomplete };
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- "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 {
1
+ "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 {
2
2
  position: relative;
3
3
  /* Inherits the host page's font by default. Consumers can pin a specific
4
4
  font on the library via \`--aia-font-family: 'Custom Font'\` without
@@ -179,7 +179,7 @@
179
179
  opacity: 0;
180
180
  }
181
181
  }
182
- `,document.head.appendChild(e)}var ce={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=`/*
182
+ `,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=`/*
183
183
  * Built-in appearance defaults \u2014 zero specificity via :where().
184
184
  * Consumer CSS always wins without !important.
185
185
  *
@@ -380,13 +380,16 @@
380
380
  text's left edge.
381
381
 
382
382
  Selector shape differs from the vanilla/Angular copies (which target the
383
- \`.aia-pill-list\` / \`.aia-pill\` class names): PillList's \`.list\` class is a
384
- hash-scoped CSS-module local, unreachable from this global stylesheet, so
385
- the wrapper is matched as PillList's own direct child \`> span\` of the
386
- pill-bar Cluster, and the pill via \`[data-aia-pill]\` (unique to ParamPill).
387
- Like the sibling structural \`[data-aia-dropdown]\` rules below, this is
388
- deliberately NOT \`:where()\`-wrapped \u2014 it must win over ParamPill's own
389
- \`.pill\` base rule. */
383
+ \`.aia-pill-list\` / \`.aia-pill\` class names): the module classes here are
384
+ hash-scoped locals, unreachable from this global stylesheet. The bar's
385
+ direct \`> span\` child is the masked scroll wrapper (\`.pillScroll\`, tagged
386
+ \`data-aia-pill-scroll\`) that holds PillList, so the 10px indent lands on
387
+ the wrapper and the module zeroes PillList's own base padding underneath
388
+ (\`.pillScroll > span\` in AIAutocompleteDropdown.module.css \u2014 remove one
389
+ only with the other). Pills are matched via \`[data-aia-pill]\` (unique to
390
+ ParamPill). Like the sibling structural \`[data-aia-dropdown]\` rules below,
391
+ this is deliberately NOT \`:where()\`-wrapped \u2014 it must win over ParamPill's
392
+ own \`.pill\` base rule. */
390
393
  [data-aia-dropdown] [data-aia-pillbar] > span {
391
394
  padding-inline: 10px;
392
395
  }
@@ -555,8 +558,23 @@
555
558
  }
556
559
 
557
560
  /* The dropdown container owns the 10px/8px edge padding and the 8px section
558
- gaps (matching Figma); the pill row adds none \u2014 just horizontal scroll + fade. */
561
+ gaps (matching Figma); the pill row adds none. The horizontal scroll + fade
562
+ live on the inner .pillScroll wrapper, NOT the bar itself: the trailing skip
563
+ button is the bar's other child, and a mask on the bar would fade it out
564
+ along with the overflowing pills it's meant to sit beside. */
559
565
  .AIAutocompleteDropdown-module_pillBar_pwTXe {
566
+ overflow: hidden;
567
+ }
568
+
569
+ /* Scrollable region for the pills. The appearance layer's
570
+ \`[data-aia-pillbar] > span\` rule lands here (10px inline padding aligning
571
+ the param label with the option text), so the inner PillList span must not
572
+ add its own base padding on top \u2014 see the child rule below. */
573
+ .AIAutocompleteDropdown-module_pillScroll_Tpzus {
574
+ display: inline-flex;
575
+ align-items: center;
576
+ flex: 1 1 auto;
577
+ min-width: 0;
560
578
  overflow-x: auto;
561
579
  overflow-y: hidden;
562
580
  scrollbar-width: none;
@@ -564,10 +582,55 @@
564
582
  -webkit-mask-image: linear-gradient(to right, #000 0, #000 calc(100% - 48px), transparent 100%);
565
583
  }
566
584
 
567
- .AIAutocompleteDropdown-module_pillBar_pwTXe::-webkit-scrollbar {
585
+ .AIAutocompleteDropdown-module_pillScroll_Tpzus > span {
586
+ padding-inline: 0;
587
+ }
588
+
589
+ .AIAutocompleteDropdown-module_pillScroll_Tpzus::-webkit-scrollbar {
568
590
  display: none;
569
591
  }
570
592
 
593
+ /* Trailing "skip" button \u2014 dismisses the active pill, same action as pressing
594
+ \u2192 at the end of the input. Pinned at the bar's far edge (auto inline-start
595
+ margin), outside the masked scroller. Typography follows the footer hint
596
+ (quiet chrome), not the pills. Declarations mirror \`.magicx-aia-skip\` in the
597
+ vanilla stylesheet \u2014 change both in the same commit. */
598
+ .AIAutocompleteDropdown-module_skip_7-olS {
599
+ display: inline-flex;
600
+ align-items: center;
601
+ margin-inline-start: auto;
602
+ flex-shrink: 0;
603
+ padding: 5px 8px;
604
+ border: none;
605
+ /* Matches the completed-param chip radius, so the hover fill reads as a
606
+ soft rectangle rather than a capsule. */
607
+ border-radius: 6px;
608
+ background: transparent;
609
+ font-family: inherit;
610
+ font-size: var(--aia-skip-font-size, 10px);
611
+ line-height: 18px;
612
+ color: var(--aia-skip-color, var(--aia-footer-hint-color, #505050));
613
+ cursor: pointer;
614
+ white-space: nowrap;
615
+ transition:
616
+ color 150ms ease-out,
617
+ background-color 150ms ease-out;
618
+ }
619
+
620
+ .AIAutocompleteDropdown-module_skip_7-olS:hover {
621
+ color: var(--aia-skip-color-hover, var(--aia-pill-color, var(--aia-color-text-muted, #c1c4cb)));
622
+ /* Same fill as a highlighted option row (--aia-option-bg), so the hover
623
+ reads with the dropdown's own hover language and stays visible on both
624
+ mode surfaces. */
625
+ background: var(--aia-skip-hover-bg, var(--aia-option-bg, transparent));
626
+ }
627
+
628
+ .AIAutocompleteDropdown-module_skip_7-olS:disabled {
629
+ pointer-events: none;
630
+ cursor: default;
631
+ opacity: 0.5;
632
+ }
633
+
571
634
  /* --- Fallback loading skeleton (only when no pills/options are cached) --- */
572
635
  .AIAutocompleteDropdown-module_skeletonBars_HVr9C {
573
636
  display: flex;
@@ -602,7 +665,7 @@
602
665
  opacity: 0.25;
603
666
  }
604
667
  }
605
- `,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 {
668
+ `,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 {
606
669
  .aia-cluster {
607
670
  display: flex;
608
671
  flex-wrap: wrap;
@@ -644,7 +707,7 @@
644
707
  justify-content: space-around;
645
708
  }
646
709
  }
647
- `,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
710
+ `,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
648
711
  dropdown's rounded edges. The top inset (--aia-footer-gap) adds breathing
649
712
  room above the hint/branding row so the footer doesn't butt against the last
650
713
  option row \u2014 additive to the dropdown's 8px section gap. */
@@ -774,7 +837,7 @@
774
837
  justify-content: flex-end;
775
838
  }
776
839
  }
777
- `,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,
840
+ `,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,
778
841
  no outline. ~28px via 6px padding + 14px text + the 1px border (border-box).
779
842
  The border is kept as a 1px transparent line so the box stays the same size
780
843
  as it was when the outline was dashed. */
@@ -831,7 +894,7 @@
831
894
  opacity: 0;
832
895
  }
833
896
  }
834
- `,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 {
897
+ `,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 {
835
898
  position: relative;
836
899
  z-index: 1;
837
900
  pointer-events: auto;
@@ -841,7 +904,7 @@
841
904
  align-items: center;
842
905
  vertical-align: middle;
843
906
  }
844
- `,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
907
+ `,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
845
908
  (packages/vanilla/src/styles.css). Same tokens, same defaults, so a consumer
846
909
  theming one package sees the same result in the other.
847
910
 
@@ -1008,7 +1071,7 @@
1008
1071
  var(--aia-option-color-selected, var(--aia-color-text-default, #fff))
1009
1072
  );
1010
1073
  }
1011
- `,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 {
1074
+ `,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 {
1012
1075
  .aia-grid {
1013
1076
  display: grid;
1014
1077
  grid-template-columns: repeat(
@@ -1043,7 +1106,7 @@
1043
1106
  border-radius: 3px;
1044
1107
  }
1045
1108
  }
1046
- `,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 {
1109
+ `,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 {
1047
1110
  position: relative;
1048
1111
  overflow: visible;
1049
1112
  display: flex;
@@ -1393,7 +1456,7 @@
1393
1456
  filter: brightness(0.55);
1394
1457
  }
1395
1458
  }
1396
- `,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 {
1459
+ `,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 {
1397
1460
  .aia-stack {
1398
1461
  display: flex;
1399
1462
  flex-direction: column;
@@ -1410,7 +1473,7 @@
1410
1473
  }
1411
1474
  /* data-align="stretch" is the flex default \u2014 no rule needed. */
1412
1475
  }
1413
- `,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,p=e[0]?.options??[],ie=!!(u&&u.length>0&&g),Z=!!(A&&A.length>0),F=s&&(p.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,q=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:[q&&(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 {
1476
+ `,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 {
1414
1477
  flex-shrink: 0;
1415
1478
  width: 32px;
1416
1479
  height: 32px;
@@ -1445,5 +1508,5 @@
1445
1508
  );
1446
1509
  cursor: default;
1447
1510
  }
1448
- `,document.head.appendChild(e)}var pt={submitButton:"SubmitButton-module_submitButton_otz7H"};var Le=require("react/jsx-runtime");function ct({disabled:e,onClick:o}){return(0,Le.jsx)("button",{type:"button","data-aia-submit":"",className:pt.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 qe=require("react");function ut(e){let o=(0,qe.useRef)(e);o.current=e;let a=(0,qe.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 p=(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});p.current=d,Z(d.getState());let E=d.subscribe(P=>Z(P));return()=>{E(),d.destroy(),p.current===d&&(p.current=null)}},[]),(0,b.useEffect)(()=>{S!==void 0&&p.current?.setValue(S)},[S]),(0,b.useEffect)(()=>{A!==void 0&&p.current?.setCompletedParams(A)},[A]);let ee=JSON.stringify(s??null),q=(0,b.useRef)(a),H=(0,b.useRef)(0);if(a!==q.current){let d=q.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++,q.current=a}(0,b.useEffect)(()=>{p.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}p.current?.update({products:Y.config})},[Y.enabled]);let O=(0,b.useRef)(null);O.current===null&&(O.current={handleTextChange:d=>p.current?.handleTextChange(d),handleKeyDown:d=>{let E="nativeEvent"in d?d.nativeEvent:d;p.current?.handleKeyDown(E)},setFocused:d=>p.current?.setFocused(d),startEditingParam:d=>p.current?.startEditingParam(d),exitEditMode:()=>p.current?.exitEditMode(),handleCaretAfterInput:d=>p.current?.handleCaretAfterInput(d),handleCaretMove:d=>p.current?.handleCaretMove(d),replaceEditingRange:d=>p.current?.replaceEditingRange(d)??!1,setActivePill:d=>p.current?.setActivePill(d),removeLastParam:()=>p.current?.removeLastParam(),clearNewParamId:()=>p.current?.clearNewParamId(),reset:()=>p.current?.reset(),selectOption:d=>p.current?.selectOption(d),selectProduct:d=>p.current?.selectProduct(d),setActiveDropdownIndex:d=>p.current?.setActiveDropdownIndex(d),handleFocus:()=>p.current?.setFocused(!0),handleBlur:()=>p.current?.setFocused(!1)});let t=O.current,c=(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;p.current?.handleTextChange(me)},[]),m=(0,b.useCallback)(d=>{p.current?.handleKeyDown(d.nativeEvent)},[]),x=p.current,i=ie??Bt,C=S!==void 0?S:i.text,te=A!==void 0?A:i.completedParams,$=i.actionableSuggestions,_e=$[0],ue=x?.listboxId??"",Me=i.activeDropdownIndex>=0&&x?`${ue}-option-${i.activeDropdownIndex}`:void 0,pe=i.editingParam,we=pe?{type:pe.suggestionType,text:pe.suggestionPlaceholder,required:!0,options:pe.options}:null,Pe=we??_e,Oe=we?[we]:$,Ie=!x||i.isLoading&&!i.editingParam&&!i.inSelectionAnimation;return{completedParams:te,skippedParams:i.skippedParams,suggestionPills:$,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:pe,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:c,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),p=(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 c=t.ownerDocument??document,m=c.getSelection(),x=m&&m.rangeCount>0&&t.contains(m.anchorNode);if(m&&!x){let i=c.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 c=t.ownerDocument??document,m=()=>{let x=c.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,$=(x.isCollapsed?C?.closest('strong[data-seg="completed"][data-param-id]'):null)?.dataset.paramId??null;if($&&$!==n?.id){oe($);return}performance.now()-T.current<50||X((0,B.getCursorOffset)(t))};return c.addEventListener("selectionchange",m),()=>c.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,c=a??"";if(ie.current=c,!c||c===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,c=n?.id??"";if(Z.current=c,!c||c===t||s==null)return;let m=y.current;m&&(0,B.setCursorOffset)(m,s)},[n,s]);let R=(0,h.useCallback)(()=>{if(p.current)return;let t=y.current;if(!t)return;let c=(0,B.extractPlainText)(t),x=c.length>0&&c[0]!==c[0].toUpperCase()?c[0].toUpperCase()+c.slice(1):c;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 c=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",c),()=>t.removeEventListener("beforeinput",c)},[J]);let M=(0,h.useCallback)(()=>{p.current=!0},[]),N=(0,h.useCallback)(()=>{p.current=!1,R()},[R]),L=(0,h.useCallback)(t=>{t.preventDefault();let c=y.current;if(!c)return;let m=(t.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!m)return;let x=c.ownerDocument??document,i=x.getSelection();if(!i||i.rangeCount===0)return;let C=i.getRangeAt(0);if(!c.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]),q=(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:q,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:p,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:q,suggestionPills:H,setActivePill:re,segments:O,newParamId:t,clearNewParamId:c,placeholderText:m,isFocused:x,isDropdownOpen:i,isActivePillSelected:C,isLoading:te,activeIndex:$,listboxId:_e,handleTextChange:ue,handleKeyDown:Me,setFocused:pe,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:p,onParamsChange:ie,products:Z,onProductSelect:F,source:"full-sdk",setCursor:Y});(0,_.useEffect)(()=>{if(!t)return;let k=window.setTimeout(()=>c(),650);return()=>window.clearTimeout(k)},[t,c]);let ft=$>=0?`${_e}-option-${$}`:void 0,{inputRef:Ne,editorProps:bt,focus:Se,blur:$e,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:pe});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:$e,reset:ne,setMode:k=>L.current?.setMode(k)}),[Se,$e,ne]);let Ae=!!O.length||ee.length>0,He=(0,_.useCallback)(()=>{if(!Ae)return;let k=je();o((0,xe.buildSubmitResult)(k,ee,q)),ne()},[Ae,ee,q,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 ${ce.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:ce.inputWrapper,onClick:vt,children:[(0,U.jsxs)("div",{className:ce.editorArea,"data-aia-editor":"",children:[(0,U.jsx)("div",{...bt,className:ce.input,"data-aia-input":""}),xt&&(te||H.length>0)&&(0,U.jsx)("span",{ref:M,className:ce.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)(ct,{disabled:!Ae,onClick:He}):(0,U.jsx)("span",{"data-aia-submit":"",className:ce.submitSlot,onClick:k=>{Ae&&(k.stopPropagation(),He())},children:T})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,buildSubmitResult,useAIAutocomplete,withSkippedParams});
1511
+ `,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});
1449
1512
  //# sourceMappingURL=index.js.map