@magicx-eng/ai-autocomplete-react 0.17.2 → 0.18.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 +4 -0
- package/dist/index.d.mts +17 -3
- package/dist/index.d.ts +17 -3
- package/dist/index.js +68 -13
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +68 -13
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -285,6 +285,8 @@ Skip `<AIAutocompleteDropdown />` and render the suggestions UI yourself. `dropd
|
|
|
285
285
|
|
|
286
286
|
> **Datepicker in a custom UI.** For a date parameter, `dropdownProps.formatType` is `"date"` and `suggestions[0].options` holds that month's day cells. Each cell's `text` is the date it commits (`"March 23"`, or `"Tuesday"` inside the next week), so rendering them as a plain list already works — `onSelect` behaves exactly as it does for an option. To draw an actual calendar, read `dateView` for the month on show, `cellDay(option)` for the number to paint, and call `onPreviousMonth` / `onNextMonth` to page. Cells that pad the start and end of the month have `is_tappable: false`. For a **range** parameter `formatType` is `"date-range"` and the same `onSelect` fires twice: the first records the start (`dropdownProps.dateRangeStart` holds it, and nothing is committed yet), the second commits the span. `dateCellMarks` and `visibleDateRange` are exported to paint the two ends and the band between them the way the built-in calendar does.
|
|
287
287
|
|
|
288
|
+
> **Option icons.** An option may carry an icon: `icon_svg` is inline SVG markup and `icon` its name. The built-in dropdown draws the SVG before the option's text, in the text color, and hides it while the row shows its loading skeleton. When rendering options yourself, pass `icon_svg` through the exported `sanitizeOptionIconSvg` before inserting it — it reduces the markup to plain vector drawing and returns `null` for anything else — and use `optionLabel(option)` for the text, which keeps an `icon` that has no `icon_svg` as a legacy text prefix. A picked option's `icon` / `icon_svg` are copied onto its completed parameter, and the chip in the input draws the glyph before its text. Both surfaces can be switched off: `showOptionIcons: false` renders option rows as text only and `showChipIcons: false` renders chips as text only; either way the icon element is omitted rather than hidden.
|
|
289
|
+
|
|
288
290
|
```tsx
|
|
289
291
|
import { useAIAutocomplete } from "@magicx-eng/ai-autocomplete-react";
|
|
290
292
|
|
|
@@ -346,6 +348,8 @@ function App() {
|
|
|
346
348
|
| `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. |
|
|
347
349
|
| `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. |
|
|
348
350
|
| `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"`, and appears once the input has text (alongside the footer's "→ to skip" hint). Set to `false` to hide it. |
|
|
351
|
+
| `showOptionIcons?` | `boolean` | `true` | When `true`, an option that carries an `icon_svg` draws its icon before its text in the dropdown. Set to `false` to render option rows as text only. |
|
|
352
|
+
| `showChipIcons?` | `boolean` | `true` | When `true`, a completed chip in the input draws the icon of the option that answered it. Set to `false` to render chips as text only. |
|
|
349
353
|
| `autoFocus?` | `boolean` | `true` | Focus the input on mount. Set to `false` to leave focus to the consumer. |
|
|
350
354
|
| `onFocus?` | `() => void` | — | Called when the input gains focus. |
|
|
351
355
|
| `onBlur?` | `() => void` | — | Called when the input loses focus. |
|
package/dist/index.d.mts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { AutocompleteResult, OptionOverrides, APIConfig, AppearanceMode, CompletedParamState, ProductsConfig, Product, Suggestion, SuggestionOption, FormatType, DateMonthView, DateRange, SkippedParamState, IdentifiedParamState, Segment } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
2
|
-
export { APIConfig, APIKeyConfig, AccessTokenConfig, AccessTokenResult, AppearanceMode, AutocompleteResult, CompletedParam, CompletedParamState, DATE_RANGE_META_END, DATE_RANGE_META_START, DateMonthView, DateRange, FormatType, IdentifiedParam, IdentifiedParamState, OptionOverrides, Product, ProductsConfig, Segment, SkippedParamState, SubmitResultExtras, Suggestion, SuggestionOption, TaskKind, WEEKDAY_LABELS, buildSubmitResult, cellDay, cellIso, dateCellMarks, formatDate, formatDateRange, isoDate, monthLabel, parseDate, parseLooseDate, parseLooseDateRange, selectedRangeFor, visibleDateRange, withSkippedParams } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
2
|
+
export { APIConfig, APIKeyConfig, AccessTokenConfig, AccessTokenResult, AppearanceMode, AutocompleteResult, CompletedParam, CompletedParamState, DATE_RANGE_META_END, DATE_RANGE_META_START, DateMonthView, DateRange, FormatType, IdentifiedParam, IdentifiedParamState, OptionOverrides, Product, ProductsConfig, Segment, SkippedParamState, SubmitResultExtras, Suggestion, SuggestionOption, TaskKind, WEEKDAY_LABELS, buildSubmitResult, cellDay, cellIso, dateCellMarks, formatDate, formatDateRange, isoDate, monthLabel, optionLabel, parseDate, parseLooseDate, parseLooseDateRange, sanitizeOptionIconSvg, selectedRangeFor, visibleDateRange, withSkippedParams } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
3
3
|
import * as react from 'react';
|
|
4
4
|
import { ReactNode, KeyboardEvent, ChangeEvent } from 'react';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
@@ -60,6 +60,10 @@ interface AIAutocompleteProps {
|
|
|
60
60
|
closeDropdownOnBlur?: boolean;
|
|
61
61
|
/** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
|
|
62
62
|
showNonTappableOptions?: boolean;
|
|
63
|
+
/** When true (default), an option that carries an `icon_svg` draws its icon before its text in the dropdown. Set to false to render option rows as text only. */
|
|
64
|
+
showOptionIcons?: boolean;
|
|
65
|
+
/** When true (default), a completed chip in the input draws the icon of the option that answered it. Set to false to render chips as text only. */
|
|
66
|
+
showChipIcons?: boolean;
|
|
63
67
|
/**
|
|
64
68
|
* When true (default), the dropdown's pill bar ends in a small "skip" button
|
|
65
69
|
* that dismisses the active pill — same action as pressing → at the end of
|
|
@@ -153,6 +157,11 @@ interface UseAIAutocompleteOptions {
|
|
|
153
157
|
closeDropdownOnBlur?: boolean;
|
|
154
158
|
/** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
|
|
155
159
|
showNonTappableOptions?: boolean;
|
|
160
|
+
/**
|
|
161
|
+
* When true (default), `dropdownProps` asks the dropdown to draw each
|
|
162
|
+
* option's `icon_svg` before its text. Set to false for text-only rows.
|
|
163
|
+
*/
|
|
164
|
+
showOptionIcons?: boolean;
|
|
156
165
|
/**
|
|
157
166
|
* When true (default), `dropdownProps` asks the dropdown to render its
|
|
158
167
|
* trailing "skip" button (see `AIAutocompleteProps.showSkipButton`). Set to
|
|
@@ -336,6 +345,11 @@ interface AIAutocompleteDropdownProps {
|
|
|
336
345
|
* the button.
|
|
337
346
|
*/
|
|
338
347
|
showSkipButton?: boolean;
|
|
348
|
+
/**
|
|
349
|
+
* Whether option rows draw their `icon_svg` before the text. Default: true
|
|
350
|
+
* (the hook's `dropdownProps` folds in the `showOptionIcons` option).
|
|
351
|
+
*/
|
|
352
|
+
showOptionIcons?: boolean;
|
|
339
353
|
/**
|
|
340
354
|
* Extra disabled gate for the skip button beyond `isLoading`. Provided by
|
|
341
355
|
* `dropdownProps` from the hook (wired to `inSelectionAnimation`): the
|
|
@@ -406,8 +420,8 @@ interface AIAutocompleteDropdownProps {
|
|
|
406
420
|
|
|
407
421
|
declare const AIAutocomplete: react.ForwardRefExoticComponent<AIAutocompleteProps & react.RefAttributes<AIAutocompleteHandle>>;
|
|
408
422
|
|
|
409
|
-
declare function AIAutocompleteDropdown({ suggestions, activeIndex, onSelect, onHighlight, isOpen, id, className, pills, onPillClick, showPills, onSkip, showSkipButton, skipDisabled, activeSelected, isLoading, isInputEmpty, products, onProductSelect, onProductFocusChange, formatType, dateView, selectedDateIso, selectedDateRange, dateRangeStart, onPreviousMonth, onNextMonth, optionsPosition, mode, }: AIAutocompleteDropdownProps): react_jsx_runtime.JSX.Element;
|
|
423
|
+
declare function AIAutocompleteDropdown({ suggestions, activeIndex, onSelect, onHighlight, isOpen, id, className, pills, onPillClick, showPills, onSkip, showSkipButton, showOptionIcons, skipDisabled, activeSelected, isLoading, isInputEmpty, products, onProductSelect, onProductFocusChange, formatType, dateView, selectedDateIso, selectedDateRange, dateRangeStart, onPreviousMonth, onNextMonth, optionsPosition, mode, }: AIAutocompleteDropdownProps): react_jsx_runtime.JSX.Element;
|
|
410
424
|
|
|
411
|
-
declare function useAIAutocomplete({ onSubmit, onResult, onError, optionOverrides, maskCompletedText, apiConfig, additionalContext, columns, dropdownTrigger, optionsPosition, closeDropdownOnBlur, showNonTappableOptions, showSkipButton, onFocus, onBlur, value: controlledValue, completedParams: controlledParams, onChange: onChangeProp, onParamsChange, products, onProductSelect, source, setCursor, }: UseAIAutocompleteOptions): UseAIAutocompleteReturn;
|
|
425
|
+
declare function useAIAutocomplete({ onSubmit, onResult, onError, optionOverrides, maskCompletedText, apiConfig, additionalContext, columns, dropdownTrigger, optionsPosition, closeDropdownOnBlur, showNonTappableOptions, showOptionIcons, showSkipButton, onFocus, onBlur, value: controlledValue, completedParams: controlledParams, onChange: onChangeProp, onParamsChange, products, onProductSelect, source, setCursor, }: UseAIAutocompleteOptions): UseAIAutocompleteReturn;
|
|
412
426
|
|
|
413
427
|
export { AIAutocomplete, AIAutocompleteDropdown, type AIAutocompleteDropdownProps, type AIAutocompleteHandle, type AIAutocompleteProps, type UseAIAutocompleteOptions, type UseAIAutocompleteReturn, useAIAutocomplete };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { AutocompleteResult, OptionOverrides, APIConfig, AppearanceMode, CompletedParamState, ProductsConfig, Product, Suggestion, SuggestionOption, FormatType, DateMonthView, DateRange, SkippedParamState, IdentifiedParamState, Segment } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
2
|
-
export { APIConfig, APIKeyConfig, AccessTokenConfig, AccessTokenResult, AppearanceMode, AutocompleteResult, CompletedParam, CompletedParamState, DATE_RANGE_META_END, DATE_RANGE_META_START, DateMonthView, DateRange, FormatType, IdentifiedParam, IdentifiedParamState, OptionOverrides, Product, ProductsConfig, Segment, SkippedParamState, SubmitResultExtras, Suggestion, SuggestionOption, TaskKind, WEEKDAY_LABELS, buildSubmitResult, cellDay, cellIso, dateCellMarks, formatDate, formatDateRange, isoDate, monthLabel, parseDate, parseLooseDate, parseLooseDateRange, selectedRangeFor, visibleDateRange, withSkippedParams } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
2
|
+
export { APIConfig, APIKeyConfig, AccessTokenConfig, AccessTokenResult, AppearanceMode, AutocompleteResult, CompletedParam, CompletedParamState, DATE_RANGE_META_END, DATE_RANGE_META_START, DateMonthView, DateRange, FormatType, IdentifiedParam, IdentifiedParamState, OptionOverrides, Product, ProductsConfig, Segment, SkippedParamState, SubmitResultExtras, Suggestion, SuggestionOption, TaskKind, WEEKDAY_LABELS, buildSubmitResult, cellDay, cellIso, dateCellMarks, formatDate, formatDateRange, isoDate, monthLabel, optionLabel, parseDate, parseLooseDate, parseLooseDateRange, sanitizeOptionIconSvg, selectedRangeFor, visibleDateRange, withSkippedParams } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
3
3
|
import * as react from 'react';
|
|
4
4
|
import { ReactNode, KeyboardEvent, ChangeEvent } from 'react';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
@@ -60,6 +60,10 @@ interface AIAutocompleteProps {
|
|
|
60
60
|
closeDropdownOnBlur?: boolean;
|
|
61
61
|
/** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
|
|
62
62
|
showNonTappableOptions?: boolean;
|
|
63
|
+
/** When true (default), an option that carries an `icon_svg` draws its icon before its text in the dropdown. Set to false to render option rows as text only. */
|
|
64
|
+
showOptionIcons?: boolean;
|
|
65
|
+
/** When true (default), a completed chip in the input draws the icon of the option that answered it. Set to false to render chips as text only. */
|
|
66
|
+
showChipIcons?: boolean;
|
|
63
67
|
/**
|
|
64
68
|
* When true (default), the dropdown's pill bar ends in a small "skip" button
|
|
65
69
|
* that dismisses the active pill — same action as pressing → at the end of
|
|
@@ -153,6 +157,11 @@ interface UseAIAutocompleteOptions {
|
|
|
153
157
|
closeDropdownOnBlur?: boolean;
|
|
154
158
|
/** When true (default), non-tappable options are rendered in the dropdown alongside tappable ones. Set to false to hide them entirely. */
|
|
155
159
|
showNonTappableOptions?: boolean;
|
|
160
|
+
/**
|
|
161
|
+
* When true (default), `dropdownProps` asks the dropdown to draw each
|
|
162
|
+
* option's `icon_svg` before its text. Set to false for text-only rows.
|
|
163
|
+
*/
|
|
164
|
+
showOptionIcons?: boolean;
|
|
156
165
|
/**
|
|
157
166
|
* When true (default), `dropdownProps` asks the dropdown to render its
|
|
158
167
|
* trailing "skip" button (see `AIAutocompleteProps.showSkipButton`). Set to
|
|
@@ -336,6 +345,11 @@ interface AIAutocompleteDropdownProps {
|
|
|
336
345
|
* the button.
|
|
337
346
|
*/
|
|
338
347
|
showSkipButton?: boolean;
|
|
348
|
+
/**
|
|
349
|
+
* Whether option rows draw their `icon_svg` before the text. Default: true
|
|
350
|
+
* (the hook's `dropdownProps` folds in the `showOptionIcons` option).
|
|
351
|
+
*/
|
|
352
|
+
showOptionIcons?: boolean;
|
|
339
353
|
/**
|
|
340
354
|
* Extra disabled gate for the skip button beyond `isLoading`. Provided by
|
|
341
355
|
* `dropdownProps` from the hook (wired to `inSelectionAnimation`): the
|
|
@@ -406,8 +420,8 @@ interface AIAutocompleteDropdownProps {
|
|
|
406
420
|
|
|
407
421
|
declare const AIAutocomplete: react.ForwardRefExoticComponent<AIAutocompleteProps & react.RefAttributes<AIAutocompleteHandle>>;
|
|
408
422
|
|
|
409
|
-
declare function AIAutocompleteDropdown({ suggestions, activeIndex, onSelect, onHighlight, isOpen, id, className, pills, onPillClick, showPills, onSkip, showSkipButton, skipDisabled, activeSelected, isLoading, isInputEmpty, products, onProductSelect, onProductFocusChange, formatType, dateView, selectedDateIso, selectedDateRange, dateRangeStart, onPreviousMonth, onNextMonth, optionsPosition, mode, }: AIAutocompleteDropdownProps): react_jsx_runtime.JSX.Element;
|
|
423
|
+
declare function AIAutocompleteDropdown({ suggestions, activeIndex, onSelect, onHighlight, isOpen, id, className, pills, onPillClick, showPills, onSkip, showSkipButton, showOptionIcons, skipDisabled, activeSelected, isLoading, isInputEmpty, products, onProductSelect, onProductFocusChange, formatType, dateView, selectedDateIso, selectedDateRange, dateRangeStart, onPreviousMonth, onNextMonth, optionsPosition, mode, }: AIAutocompleteDropdownProps): react_jsx_runtime.JSX.Element;
|
|
410
424
|
|
|
411
|
-
declare function useAIAutocomplete({ onSubmit, onResult, onError, optionOverrides, maskCompletedText, apiConfig, additionalContext, columns, dropdownTrigger, optionsPosition, closeDropdownOnBlur, showNonTappableOptions, showSkipButton, onFocus, onBlur, value: controlledValue, completedParams: controlledParams, onChange: onChangeProp, onParamsChange, products, onProductSelect, source, setCursor, }: UseAIAutocompleteOptions): UseAIAutocompleteReturn;
|
|
425
|
+
declare function useAIAutocomplete({ onSubmit, onResult, onError, optionOverrides, maskCompletedText, apiConfig, additionalContext, columns, dropdownTrigger, optionsPosition, closeDropdownOnBlur, showNonTappableOptions, showOptionIcons, showSkipButton, onFocus, onBlur, value: controlledValue, completedParams: controlledParams, onChange: onChangeProp, onParamsChange, products, onProductSelect, source, setCursor, }: UseAIAutocompleteOptions): UseAIAutocompleteReturn;
|
|
412
426
|
|
|
413
427
|
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
|
|
1
|
+
"use strict";var et=Object.defineProperty;var Kt=Object.getOwnPropertyDescriptor;var Wt=Object.getOwnPropertyNames;var qt=Object.prototype.hasOwnProperty;var Ut=(e,a)=>{for(var o in a)et(e,o,{get:a[o],enumerable:!0})},jt=(e,a,o,r)=>{if(a&&typeof a=="object"||typeof a=="function")for(let n of Wt(a))!qt.call(e,n)&&n!==o&&et(e,n,{get:()=>a[n],enumerable:!(r=Kt(a,n))||r.enumerable});return e};var $t=e=>jt(et({},"__esModule",{value:!0}),e);var ro={};Ut(ro,{AIAutocomplete:()=>Rt,AIAutocompleteDropdown:()=>je,DATE_RANGE_META_END:()=>u.DATE_RANGE_META_END,DATE_RANGE_META_START:()=>u.DATE_RANGE_META_START,WEEKDAY_LABELS:()=>u.WEEKDAY_LABELS,buildSubmitResult:()=>u.buildSubmitResult,cellDay:()=>u.cellDay,cellIso:()=>u.cellIso,dateCellMarks:()=>u.dateCellMarks,formatDate:()=>u.formatDate,formatDateRange:()=>u.formatDateRange,isoDate:()=>u.isoDate,monthLabel:()=>u.monthLabel,optionLabel:()=>u.optionLabel,parseDate:()=>u.parseDate,parseLooseDate:()=>u.parseLooseDate,parseLooseDateRange:()=>u.parseLooseDateRange,sanitizeOptionIconSvg:()=>u.sanitizeOptionIconSvg,selectedRangeFor:()=>u.selectedRangeFor,useAIAutocomplete:()=>Ve,visibleDateRange:()=>u.visibleDateRange,withSkippedParams:()=>u.withSkippedParams});module.exports=$t(ro);var u=require("@magicx-eng/ai-autocomplete-vanilla");var R=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
|
|
@@ -103,6 +103,27 @@
|
|
|
103
103
|
background: var(--aia-completed-pill-bg-active, rgba(189, 189, 189, 0.35));
|
|
104
104
|
}
|
|
105
105
|
|
|
106
|
+
/* The picked option's icon inside a completed chip (see \`icon_svg\` on
|
|
107
|
+
CompletedParamState). Inline-block, one em square and sat on the text
|
|
108
|
+
baseline, so the chip keeps \`display: inline\` and still wraps across
|
|
109
|
+
lines; contentEditable is off on it (the renderer sets that) so it adds
|
|
110
|
+
no characters to the caret's plain text. */
|
|
111
|
+
:where(.AIAutocomplete-module_input_IW-P-) span[class~="magicx-aia-segment-icon"] {
|
|
112
|
+
display: inline-block;
|
|
113
|
+
width: 1em;
|
|
114
|
+
height: 1em;
|
|
115
|
+
margin-right: 4px;
|
|
116
|
+
vertical-align: -0.125em;
|
|
117
|
+
pointer-events: none;
|
|
118
|
+
user-select: none;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
:where(.AIAutocomplete-module_input_IW-P-) span[class~="magicx-aia-segment-icon"] svg {
|
|
122
|
+
display: block;
|
|
123
|
+
width: 100%;
|
|
124
|
+
height: 100%;
|
|
125
|
+
}
|
|
126
|
+
|
|
106
127
|
/* Re-edit highlight \u2014 applied to the completed pill being re-edited (after a
|
|
107
128
|
tap). Reuses the exact hover fill so the highlight persists from tap until an
|
|
108
129
|
option is selected. Hides the native caret; cursor switches to text since the
|
|
@@ -193,7 +214,7 @@
|
|
|
193
214
|
opacity: 0;
|
|
194
215
|
}
|
|
195
216
|
}
|
|
196
|
-
`,document.head.appendChild(e)}var
|
|
217
|
+
`,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 Te=require("@magicx-eng/ai-autocomplete-vanilla"),ee=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
|
|
197
218
|
* Built-in appearance defaults \u2014 zero specificity via :where().
|
|
198
219
|
* Consumer CSS always wins without !important.
|
|
199
220
|
*
|
|
@@ -786,7 +807,7 @@
|
|
|
786
807
|
opacity: 0.25;
|
|
787
808
|
}
|
|
788
809
|
}
|
|
789
|
-
`,document.head.appendChild(e)}var me={dropdown:"AIAutocompleteDropdown-module_dropdown_yz2KC",visible:"AIAutocompleteDropdown-module_visible_QCoXj",scrollArrow:"AIAutocompleteDropdown-module_scrollArrow_uUzV0",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
|
|
810
|
+
`,document.head.appendChild(e)}var me={dropdown:"AIAutocompleteDropdown-module_dropdown_yz2KC",visible:"AIAutocompleteDropdown-module_visible_QCoXj",scrollArrow:"AIAutocompleteDropdown-module_scrollArrow_uUzV0",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 T=require("@magicx-eng/ai-autocomplete-vanilla"),ut=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-f687bd03")){let e=document.createElement("style");e.id="ac-style-f687bd03",e.textContent=`/* --- Datepicker (replaces the options grid for date suggestions) ---
|
|
790
811
|
|
|
791
812
|
One of three hand-maintained copies (vanilla styles.css, this file, Angular's
|
|
792
813
|
date-grid.component.css). Only the class-naming layer differs \u2014 the
|
|
@@ -949,7 +970,7 @@
|
|
|
949
970
|
opacity: 0.8;
|
|
950
971
|
background: rgba(var(--aia-streak-rgb, 255, 255, 255), 0.06);
|
|
951
972
|
}
|
|
952
|
-
`,document.head.appendChild(e)}var
|
|
973
|
+
`,document.head.appendChild(e)}var C={datepicker:"DateGrid-module_datepicker_6RrTs",header:"DateGrid-module_header_z4LRk",month:"DateGrid-module_month_urB2T",nav:"DateGrid-module_nav_ap4AN",weekdays:"DateGrid-module_weekdays_3EA3q",grid:"DateGrid-module_grid_mQCgw",weekday:"DateGrid-module_weekday_3lF4B",cell:"DateGrid-module_cell_59k0y",number:"DateGrid-module_number_aoT01",day:"DateGrid-module_day_cB3u9",blank:"DateGrid-module_blank_ivgRC",past:"DateGrid-module_past_CEZsj",highlighted:"DateGrid-module_highlighted_YIdtK",today:"DateGrid-module_today_iI3ME",inRange:"DateGrid-module_inRange_r9S2q",selected:"DateGrid-module_selected_28KDn",pressed:"DateGrid-module_pressed_bEyyN"};var B=require("react/jsx-runtime"),Vt=["sunday","monday","tuesday","wednesday","thursday","friday","saturday"];function ht({options:e,activeIndex:a,listboxId:o,view:r,selection:n,onSelect:i,onHighlight:s,onPreviousMonth:f,onNextMonth:w}){let b=(0,T.isoDate)(new Date),y=(0,T.visibleDateRange)({pendingStart:n.rangeStart,highlightedIso:(0,T.cellIso)(e[a]),selected:n.selectedRange});return(0,B.jsxs)("div",{className:C.datepicker,"data-aia-datepicker":"",children:[(0,B.jsxs)("div",{className:C.header,children:[(0,B.jsx)("button",{type:"button",tabIndex:-1,className:C.nav,"data-aia-date-prev":"","aria-label":"Previous month",onMouseDown:m=>m.preventDefault(),onClick:f,children:"\u2039"}),(0,B.jsx)("span",{className:C.month,"data-aia-date-month":"","aria-live":"polite",children:(0,T.monthLabel)(r)}),(0,B.jsx)("button",{type:"button",tabIndex:-1,className:C.nav,"data-aia-date-next":"","aria-label":"Next month",onMouseDown:m=>m.preventDefault(),onClick:w,children:"\u203A"})]}),(0,B.jsx)("div",{className:C.weekdays,"aria-hidden":"true",children:T.WEEKDAY_LABELS.map((m,_)=>(0,B.jsx)("span",{className:C.weekday,children:m},Vt[_]))}),(0,B.jsx)("div",{className:C.grid,"data-aia-date-grid":"",children:e.map((m,_)=>(0,B.jsx)(Qt,{option:m,id:`${o}-option-${_}`,index:_,isHighlighted:_===a&&m.is_tappable,isToday:(0,T.cellIso)(m)===b,isPast:(0,T.cellIso)(m)!=null&&(0,T.cellIso)(m)<b,marks:(0,T.dateCellMarks)((0,T.cellIso)(m),{selectedIso:n.selectedIso,range:y}),onSelect:i,onHighlight:s},(0,T.cellIso)(m)??`pad-${_}`))})]})}function Qt({option:e,id:a,index:o,isHighlighted:r,isToday:n,isPast:i,marks:s,onSelect:f,onHighlight:w}){let[b,y]=(0,ut.useState)(!1),m=(0,T.cellDay)(e);if(m==null)return(0,B.jsx)("div",{id:a,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-hidden":"true","aria-selected":!1,tabIndex:-1,className:`${C.cell} ${C.blank}`});let _=()=>{y(!0),f(e),setTimeout(()=>y(!1),170)},P=[C.cell,C.day,i?C.past:"",r?C.highlighted:"",n?C.today:"",s.inRange?C.inRange:"",s.selected?C.selected:"",b?C.pressed:""].filter(Boolean).join(" ");return(0,B.jsx)("div",{id:a,role:"option","data-aia-option":"","data-aia-date-cell":"","aria-selected":r,"aria-label":e.text,tabIndex:0,className:P,onClick:_,onKeyDown:v=>{(v.key==="Enter"||v.key===" ")&&(v.preventDefault(),_())},onMouseEnter:()=>w(o),children:(0,B.jsx)("span",{className:C.number,children:m})})}var Ce=require("@magicx-eng/ai-autocomplete-vanilla"),We=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 {
|
|
953
974
|
.aia-cluster {
|
|
954
975
|
display: flex;
|
|
955
976
|
flex-wrap: wrap;
|
|
@@ -991,7 +1012,7 @@
|
|
|
991
1012
|
justify-content: space-around;
|
|
992
1013
|
}
|
|
993
1014
|
}
|
|
994
|
-
`,document.head.appendChild(e)}var
|
|
1015
|
+
`,document.head.appendChild(e)}var tt=require("react/jsx-runtime");function Ne({gap:e,align:a="center",justify:o="start",noWrap:r=!1,inline:n=!1,className:i,children:s,...f}){let w=e?{"--aia-cluster-gap":e}:void 0,b={className:i?`aia-cluster ${i}`:"aia-cluster","data-align":a,"data-justify":o,"data-nowrap":r||void 0,"data-inline":n||void 0,style:w,...f};return n?(0,tt.jsx)("span",{...b,children:s}):(0,tt.jsx)("div",{...b,children:s})}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
|
|
995
1016
|
dropdown's rounded edges. The top inset (--aia-footer-gap) adds breathing
|
|
996
1017
|
room above the hint/branding row so the footer doesn't butt against the last
|
|
997
1018
|
option row \u2014 additive to the dropdown's 8px section gap. */
|
|
@@ -1125,7 +1146,7 @@
|
|
|
1125
1146
|
justify-content: flex-end;
|
|
1126
1147
|
}
|
|
1127
1148
|
}
|
|
1128
|
-
`,document.head.appendChild(e)}var
|
|
1149
|
+
`,document.head.appendChild(e)}var ge={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 ie=require("react/jsx-runtime");function mt({isOptionHighlighted:e=!1,isInputEmpty:a=!1}){let{key:o,hint:r}=(0,Ce.getFooterHint)(e,a),[n,i]=(0,We.useState)(Ce.ATTRIBUTION_URL);return(0,We.useEffect)(()=>{i((0,Ce.buildAttributionUrl)())},[]),(0,ie.jsx)("footer",{className:ge.footer,"data-aia-footer":"",children:(0,ie.jsxs)(Ne,{justify:"between",noWrap:!0,className:ge.row,children:[(0,ie.jsxs)(Ne,{gap:"5px",className:ge.hintGroup,children:[(0,ie.jsx)("kbd",{className:ge.key,children:o}),(0,ie.jsx)("span",{className:ge.hint,children:r})]}),(0,ie.jsxs)("a",{className:ge.brandLink,href:n,target:"_blank",rel:"noopener noreferrer",children:[(0,ie.jsx)("span",{className:ge.brand,children:"AI"}),(0,ie.jsx)("span",{className:ge.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,
|
|
1129
1150
|
no outline. ~28px via 6px padding + 14px text + the 1px border (border-box).
|
|
1130
1151
|
The border is kept as a 1px transparent line so the box stays the same size
|
|
1131
1152
|
as it was when the outline was dashed. */
|
|
@@ -1182,7 +1203,7 @@
|
|
|
1182
1203
|
opacity: 0;
|
|
1183
1204
|
}
|
|
1184
1205
|
}
|
|
1185
|
-
`,document.head.appendChild(e)}var
|
|
1206
|
+
`,document.head.appendChild(e)}var ke={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 ft=require("react/jsx-runtime"),ot={selected:1,first:.7,next:.4,last:.2};function gt({label:e,state:a,rounded:o,loading:r,onClick:n}){let i=[ke.pill,o?ke.rounded:"",r?ke.skeleton:""].filter(Boolean).join(" ");return(0,ft.jsx)("button",{type:"button","data-aia-pill":"","data-aia-loading":r?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:i,style:{opacity:ot[a]},onMouseDown:s=>s.preventDefault(),onClick:r?void 0:n,disabled:r,children:e})}if(typeof document<"u"&&!document.getElementById("ac-style-0fcb7940")){let e=document.createElement("style");e.id="ac-style-0fcb7940",e.textContent=`.PillList-module_list_qvLqO {
|
|
1186
1207
|
position: relative;
|
|
1187
1208
|
z-index: 1;
|
|
1188
1209
|
pointer-events: auto;
|
|
@@ -1192,7 +1213,7 @@
|
|
|
1192
1213
|
align-items: center;
|
|
1193
1214
|
vertical-align: middle;
|
|
1194
1215
|
}
|
|
1195
|
-
`,document.head.appendChild(e)}var
|
|
1216
|
+
`,document.head.appendChild(e)}var at={list:"PillList-module_list_qvLqO"};var ze=require("react/jsx-runtime"),Yt=[125,69];function bt(e){return e===0?"first":e===1?"next":"last"}function qe({pills:e,activePillIndex:a,onSelectPill:o,activeSelected:r,rounded:n,loading:i}){return i&&e.length===0?(0,ze.jsx)("span",{className:at.list,"data-aia-pill-list-loading":"",children:Yt.map((s,f)=>(0,ze.jsx)("span",{"data-aia-pill-skeleton":"",className:`${ke.pill} ${n?ke.rounded:""} ${ke.skeleton}`,style:{width:s,opacity:ot[bt(f)]}},`skel-${s}`))}):(0,ze.jsx)("span",{className:at.list,"data-aia-pill-list-loading":i?"":void 0,children:e.map((s,f)=>{let w=!!r&&f===a;return(0,ze.jsx)(gt,{label:s.text,state:w?"selected":bt(f),selected:w,rounded:n,loading:i,onClick:()=>o(f)},`${s.type}-${s.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
|
|
1196
1217
|
(packages/vanilla/src/styles.css). Same tokens, same defaults, so a consumer
|
|
1197
1218
|
theming one package sees the same result in the other.
|
|
1198
1219
|
|
|
@@ -1359,7 +1380,7 @@
|
|
|
1359
1380
|
var(--aia-option-color-selected, var(--aia-color-text-default, #fff))
|
|
1360
1381
|
);
|
|
1361
1382
|
}
|
|
1362
|
-
`,document.head.appendChild(e)}var
|
|
1383
|
+
`,document.head.appendChild(e)}var Z={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 K=require("react/jsx-runtime");function vt({products:e,listboxId:a,onSelect:o,onFocusChange:r,focusable:n=!0}){if(e.length===0)return null;let i=`${a}-products-label`;return(0,K.jsxs)("section",{className:Z.section,"data-aia-products":"",role:"group","aria-labelledby":i,children:[(0,K.jsx)("div",{className:Z.label,id:i,children:"Products"}),(0,K.jsx)("div",{className:Z.row,"data-aia-products-row":"",children:e.map((s,f)=>(0,K.jsx)(Xt,{product:s,id:`${a}-product-${f}`,onSelect:o,onFocusChange:r,focusable:n},s.id))})]})}function Xt({product:e,id:a,onSelect:o,onFocusChange:r,focusable:n}){let i=s=>{s.metaKey||s.ctrlKey||s.shiftKey||s.altKey||s.button!==0||(s.preventDefault(),o(e))};return(0,K.jsxs)("a",{id:a,className:Z.card,"data-aia-product":"",role:"option","aria-selected":!1,href:e.url,tabIndex:n?0:-1,onClick:i,onKeyDown:s=>{s.key!=="Enter"&&s.key!==" "||(s.preventDefault(),o(e))},onFocus:()=>r?.(!0),onBlur:s=>{s.relatedTarget?.closest("[data-aia-dropdown]")||r?.(!1)},children:[(0,K.jsx)("span",{className:Z.media,"data-aia-product-placeholder":e.imageUrl?void 0:"",children:e.imageUrl?(0,K.jsx)("img",{className:Z.image,src:e.imageUrl,alt:"",loading:"lazy",decoding:"async"}):null}),(0,K.jsxs)("span",{className:Z.body,children:[e.vendor?(0,K.jsx)("span",{className:Z.vendor,children:e.vendor}):null,(0,K.jsx)("span",{className:Z.title,children:e.title}),e.price?(0,K.jsx)("span",{className:Z.price,children:e.price}):null]})]})}var W=require("@magicx-eng/ai-autocomplete-vanilla"),be=require("react");var wt=require("@magicx-eng/ai-autocomplete-vanilla"),Ue=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 {
|
|
1363
1384
|
.aia-grid {
|
|
1364
1385
|
display: grid;
|
|
1365
1386
|
grid-template-columns: repeat(
|
|
@@ -1394,7 +1415,7 @@
|
|
|
1394
1415
|
border-radius: 3px;
|
|
1395
1416
|
}
|
|
1396
1417
|
}
|
|
1397
|
-
`,document.head.appendChild(e)}var
|
|
1418
|
+
`,document.head.appendChild(e)}var yt=require("react/jsx-runtime");function xt({min:e="16rem",max:a,gap:o,scroll:r=!1,maxHeight:n,scrollResetKey:i,cols:s,template:f,innerRef:w,className:b,children:y,...m}){let _=(0,Ue.useRef)(null);(0,Ue.useLayoutEffect)(()=>{if(i===void 0)return;let v=_.current;v&&(v.scrollTop=0)},[i]);let P={"--aia-grid-min":e};return a&&(P["--aia-grid-max"]=a),o&&(P["--aia-grid-gap"]=o),n&&(P["--aia-grid-max-height"]=n),s&&(P.gridTemplateColumns=(0,wt.optionsGridTemplateColumns)(s)),f&&(P.gridTemplateColumns=f),(0,yt.jsx)("div",{ref:v=>{_.current=v,w?.(v)},className:b?`aia-grid ${b}`:"aia-grid","data-scroll":r||void 0,style:P,...m,children:y})}var Ee=require("@magicx-eng/ai-autocomplete-vanilla"),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 {
|
|
1398
1419
|
position: relative;
|
|
1399
1420
|
overflow: visible;
|
|
1400
1421
|
display: flex;
|
|
@@ -1532,6 +1553,40 @@
|
|
|
1532
1553
|
display: none;
|
|
1533
1554
|
}
|
|
1534
1555
|
|
|
1556
|
+
/* Server-provided option icon (\`icon_svg\` on the option): a box exactly one
|
|
1557
|
+
text line tall, top-aligned, so it sits centred on the first line of a
|
|
1558
|
+
wrapped option and never grows the line box. The glyph draws in
|
|
1559
|
+
currentColor, so it follows the option's text color through hover and
|
|
1560
|
+
highlight, and is sized in em so --aia-option-font-size scales it. */
|
|
1561
|
+
.SuggestionItem-module_icon_Qw938 {
|
|
1562
|
+
display: inline-flex;
|
|
1563
|
+
align-items: center;
|
|
1564
|
+
height: 21px; /* = the option's line-height */
|
|
1565
|
+
margin-right: 8px;
|
|
1566
|
+
vertical-align: top;
|
|
1567
|
+
}
|
|
1568
|
+
|
|
1569
|
+
.SuggestionItem-module_icon_Qw938 svg {
|
|
1570
|
+
display: block;
|
|
1571
|
+
width: 1em;
|
|
1572
|
+
height: 1em;
|
|
1573
|
+
}
|
|
1574
|
+
|
|
1575
|
+
.SuggestionItem-module_item_d4vpD[data-aia-loading] .SuggestionItem-module_icon_Qw938 {
|
|
1576
|
+
display: none;
|
|
1577
|
+
}
|
|
1578
|
+
|
|
1579
|
+
/* With an icon, the content box hangs its continuation lines: a left pad the
|
|
1580
|
+
width of the icon plus its gap, and a matching negative first-line indent
|
|
1581
|
+
that pulls the icon back into that pad. Wrapped lines then start under the
|
|
1582
|
+
first line's text rather than under the icon. \`.content\` is a flex item
|
|
1583
|
+
(blockified), so text-indent applies to it directly. Skeleton rows are
|
|
1584
|
+
excluded \u2014 their icon is hidden, so the pad would indent the bars. */
|
|
1585
|
+
.SuggestionItem-module_item_d4vpD:not([data-aia-loading]) .SuggestionItem-module_content_T-Qba:has(.SuggestionItem-module_icon_Qw938) {
|
|
1586
|
+
padding-left: calc(1em + 8px);
|
|
1587
|
+
text-indent: calc(-1em - 8px);
|
|
1588
|
+
}
|
|
1589
|
+
|
|
1535
1590
|
@keyframes SuggestionItem-module_skeletonPulse_plvdD {
|
|
1536
1591
|
0%,
|
|
1537
1592
|
100% {
|
|
@@ -1541,7 +1596,7 @@
|
|
|
1541
1596
|
filter: brightness(0.55);
|
|
1542
1597
|
}
|
|
1543
1598
|
}
|
|
1544
|
-
`,document.head.appendChild(e)}var
|
|
1599
|
+
`,document.head.appendChild(e)}var J={item:"SuggestionItem-module_item_d4vpD",fadeIn:"SuggestionItem-module_fadeIn_I8u35",riseIn:"SuggestionItem-module_riseIn_etXZT",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",pressCompress:"SuggestionItem-module_pressCompress_ICV3q",scrollHint:"SuggestionItem-module_scrollHint_xKXPt",skeletonPulse:"SuggestionItem-module_skeletonPulse_plvdD",text:"SuggestionItem-module_text_yqoh9",icon:"SuggestionItem-module_icon_Qw938"};var Ie=require("react/jsx-runtime");function _t({option:e,isHighlighted:a,onSelect:o,onHighlight:r,id:n,loading:i,showIcon:s=!0,scrollHint:f,enterDelayMs:w=0}){let[b]=(0,fe.useState)(w),[y,m]=(0,fe.useState)(!1),_=(0,fe.useMemo)(()=>s&&e.icon_svg?(0,Ee.sanitizeOptionIconSvg)(e.icon_svg):null,[s,e.icon_svg]),P=(0,fe.useRef)(void 0);(0,fe.useEffect)(()=>()=>clearTimeout(P.current),[]);let v=()=>{i||!e.is_tappable||y||(m(!0),o(e),clearTimeout(P.current),P.current=setTimeout(()=>m(!1),170))},E=[J.item,a&&!i?J.highlighted:"",e.is_tappable?J.tappable:J.nonTappable,y?J.pressed:"",f?J.scrollHint:""].filter(Boolean).join(" ");return(0,Ie.jsx)("div",{id:n,role:"option","data-aia-option":"","data-aia-loading":i?"":void 0,"data-aia-icon":_&&e.icon?e.icon:void 0,"aria-selected":a,className:E,style:{[Ee.OPTION_ENTER_DELAY_VAR]:`${b}ms`},tabIndex:i||!e.is_tappable?-1:0,onClick:v,onKeyDown:S=>{!i&&e.is_tappable&&(S.key==="Enter"||S.key===" ")&&(S.preventDefault(),v())},onMouseEnter:!i&&e.is_tappable?r:void 0,children:(0,Ie.jsxs)("span",{className:J.content,children:[_&&(0,Ie.jsx)("span",{className:`${J.icon} magicx-aia-option-icon`,"aria-hidden":"true",dangerouslySetInnerHTML:{__html:_}}),(0,Ie.jsx)("span",{className:J.text,children:(0,Ee.optionLabel)(e)}),e.tag&&(0,Ie.jsx)("span",{className:J.tag,children:e.tag})]})})}var it=require("react/jsx-runtime");function Zt(){let[e,a]=(0,be.useState)(W.isOptionsGridMobileViewport);return(0,be.useEffect)(()=>{if(typeof window>"u"||!window.matchMedia)return;let o=window.matchMedia(W.OPTIONS_GRID_MOBILE_QUERY),r=()=>a(o.matches);return r(),o.addEventListener("change",r),()=>o.removeEventListener("change",r)},[]),e}function kt({options:e,activeIndex:a,onSelect:o,onHighlight:r,listboxId:n,loading:i,groupKey:s="",optionsPosition:f="below",showIcons:w=!0}){let b=Zt(),y=(0,be.useRef)(null),[m,_]=(0,be.useState)(null);(0,be.useLayoutEffect)(()=>{let v=y.current,S=v&&!i&&(0,W.needsOptionsGridMeasurement)(e.length,b)?(0,W.measureOptionsGrid)(v):null;_(S?(0,W.planOptionsGrid)(e.length,b,S.rowWidths,S.gridWidth):null)},[e,b,i]);let P=m??(0,W.planOptionsGrid)(e.length,b,null,null);return(0,it.jsx)(xt,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:s,template:P.template,maxHeight:P.maxHeight,innerRef:v=>{y.current=v},"data-aia-group":s,children:e.map((v,E)=>(0,it.jsx)(_t,{option:v,isHighlighted:E===a,onSelect:o,onHighlight:()=>r(E),id:`${n}-option-${E}`,loading:i,showIcon:w,scrollHint:!i&&P.scrollHintIndices.includes(E),enterDelayMs:i?0:(0,W.optionEnterDelayMs)(E,P.cols,e.length,f)},`${s}\0${v.text}`))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`@layer layout {
|
|
1545
1600
|
.aia-stack {
|
|
1546
1601
|
display: flex;
|
|
1547
1602
|
flex-direction: column;
|
|
@@ -1558,7 +1613,7 @@
|
|
|
1558
1613
|
}
|
|
1559
1614
|
/* data-align="stretch" is the flex default \u2014 no rule needed. */
|
|
1560
1615
|
}
|
|
1561
|
-
`,document.head.appendChild(e)}var
|
|
1616
|
+
`,document.head.appendChild(e)}var It=require("react/jsx-runtime");function Pt({space:e,align:a="stretch",className:o,children:r,...n}){let i=e?{"--aia-stack-space":e}:void 0;return(0,It.jsx)("div",{className:o?`aia-stack ${o}`:"aia-stack","data-align":a,style:i,...n,children:r})}var M=require("react/jsx-runtime"),Jt=[159,119,164],eo=()=>{},St=()=>{};function to(e){let a=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[o,r]=(0,ee.useState)(a);if((0,ee.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let n=window.matchMedia("(prefers-color-scheme: dark)"),i=()=>r(n.matches);return n.addEventListener("change",i),()=>n.removeEventListener("change",i)},[e]),e!==void 0)return e==="auto"?o?"dark":"light":e}function oo(e,a){let o=(0,ee.useRef)(null);(0,ee.useEffect)(()=>{let r=e.current,n=a.current;if(!r||!n)return;let i=r.querySelector(".aia-grid[data-scroll]");if(o.current&&o.current.grid!==i&&(o.current.controller.destroy(),o.current=null),i&&!o.current){o.current={grid:i,controller:(0,Te.attachScrollArrow)({dropdown:r,grid:i,button:n})};return}o.current?.controller.update()}),(0,ee.useEffect)(()=>()=>{o.current?.controller.destroy(),o.current=null},[])}function je({suggestions:e,activeIndex:a,onSelect:o,onHighlight:r,isOpen:n,id:i,className:s,pills:f,onPillClick:w,showPills:b=!0,onSkip:y,showSkipButton:m=!0,showOptionIcons:_=!0,skipDisabled:P=!1,activeSelected:v=!1,isLoading:E=!1,isInputEmpty:S=!1,products:N,onProductSelect:ne,onProductFocusChange:re,formatType:U="options",dateView:A=null,selectedDateIso:se=null,selectedDateRange:le=null,dateRangeStart:h=null,onPreviousMonth:ve,onNextMonth:de,optionsPosition:z="below",mode:we}){let Y=to(we),xe=Y!==void 0,oe=(0,ee.useRef)(null),ae=(0,ee.useRef)(null);oo(oe,ae);let ce=e[0]?.options??[],G=!!(f&&f.length>0&&w),pe=!!(N&&N.length>0),j=n&&(ce.length>0||b&&G||E||pe),F={suggestions:e,activeIndex:a,pills:f,showPills:b,showSkipButton:m,showOptionIcons:_,skipDisabled:P,activeSelected:v,isLoading:E,isInputEmpty:S,products:N,formatType:U,dateView:A,selectedDateIso:se,selectedDateRange:le,dateRangeStart:h},ue=(0,ee.useRef)(F);j&&(ue.current=F);let t=j?F:ue.current,c=t.suggestions[0],p=c?.options??[],l=t.activeIndex>=0&&!!p[t.activeIndex]?.is_tappable,x=!!(t.pills&&t.pills.length>0&&w),O=t.showPills&&x,H=t.showPills&&!x&&t.isLoading,d=O||H,he=x&&t.showSkipButton&&!t.isInputEmpty&&!!y,Se=t.pills?.[0]?.text,ye=(0,Te.isCalendarFormat)(t.formatType)&&t.dateView!=null,Ae=p.length>0&&!ye,X=p.length>0&&ye&&!t.isLoading,De=t.isLoading&&!Ae&&!X,$=t.products??[];return(0,M.jsxs)("div",{ref:oe,id:i,role:"listbox","data-aia-dropdown":"","data-options-position":z,"data-mode":Y,"data-aia-loading":t.isLoading?"":void 0,"data-aia-has-products":$.length>0?"":void 0,className:`${xe?"magicx-aia ":""}${me.dropdown} ${j?me.visible:""} ${s??""}`,onMouseDown:V=>V.preventDefault(),children:[(0,M.jsxs)(Pt,{space:"8px",children:[(d||he)&&(0,M.jsxs)(Ne,{noWrap:!0,className:me.pillBar,"data-aia-pillbar":"",children:[d&&(0,M.jsx)("span",{className:me.pillScroll,"data-aia-pill-scroll":"",children:(0,M.jsx)(qe,{pills:t.pills??[],activePillIndex:0,activeSelected:t.activeSelected,onSelectPill:w??(()=>{}),rounded:!0,loading:t.isLoading})}),he&&(0,M.jsx)("button",{type:"button",tabIndex:-1,className:me.skip,"data-aia-skip":"",disabled:t.isLoading||t.skipDisabled,"aria-label":Se?`Skip ${Se}`:"Skip",onClick:y,children:"skip"})]}),Ae&&(0,M.jsx)(kt,{options:p,activeIndex:t.activeIndex,onSelect:o,onHighlight:r,listboxId:i,loading:t.isLoading,groupKey:c?`${c.type} ${c.text}`:"",optionsPosition:z,showIcons:t.showOptionIcons}),X&&t.dateView&&(0,M.jsx)(ht,{options:p,activeIndex:t.activeIndex,listboxId:i,view:t.dateView,selection:{selectedIso:t.selectedDateIso??null,selectedRange:t.selectedDateRange??null,rangeStart:t.dateRangeStart??null},onSelect:o,onHighlight:r,onPreviousMonth:ve??St,onNextMonth:de??St}),De&&(0,M.jsx)("div",{className:me.skeletonBars,"data-aia-skeleton-bars":"",children:Jt.map(V=>(0,M.jsx)("span",{className:me.skeletonBar,style:{width:V}},`bar-${V}`))}),(0,M.jsx)(vt,{products:$,listboxId:i,onSelect:ne??eo,onFocusChange:re,focusable:j}),(0,M.jsx)(mt,{isOptionHighlighted:l,isInputEmpty:t.isInputEmpty})]}),(0,M.jsx)("button",{ref:ae,type:"button",tabIndex:-1,className:me.scrollArrow,"data-aia-scroll-arrow":"","aria-label":Te.SCROLL_ARROW_LABEL,"aria-hidden":"true",children:(0,M.jsx)("svg",{viewBox:"0 0 16 16",width:"14",height:"14",fill:"none",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",focusable:"false",children:(0,M.jsx)("path",{d:"M4 6.5 8 10.5l4-4"})})})]})}var Oe=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 {
|
|
1562
1617
|
flex-shrink: 0;
|
|
1563
1618
|
width: 32px;
|
|
1564
1619
|
height: 32px;
|
|
@@ -1593,5 +1648,5 @@
|
|
|
1593
1648
|
);
|
|
1594
1649
|
cursor: default;
|
|
1595
1650
|
}
|
|
1596
|
-
`,document.head.appendChild(e)}var At={submitButton:"SubmitButton-module_submitButton_otz7H"};var Ue=require("react/jsx-runtime");function St({disabled:e,onClick:o}){return(0,Ue.jsx)("button",{type:"button","data-aia-submit":"",className:At.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),o()},"aria-label":"Submit",children:(0,Ue.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,Ue.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var Ee=require("@magicx-eng/ai-autocomplete-vanilla"),I=require("react");var ot=require("react");function Dt(e){let o=(0,ot.useRef)(e);o.current=e;let a=Object.keys(e??{}).sort().join("\0"),n=(0,ot.useRef)({key:"",overrides:void 0});if(n.current.key!==a){let r={};for(let i of Object.keys(e??{})){let s=(f,b,w)=>{let k=o.current?.[i];return k?k(f,b,w):[]};r[i]=s}n.current={key:a,overrides:e?r:void 0}}return{overrides:n.current.overrides,key:a}}var it=require("react");function Ct(e){let o=(0,it.useRef)(e);o.current=e;let a=(0,it.useRef)(null);a.current===null&&(a.current={fetch:(r,i)=>{let s=o.current;return s?s.fetch(r,i):Promise.reject(new Error("products config removed"))},transform:r=>o.current?.transform(r)??[],get limit(){return o.current?.limit}});let n=e!==void 0;return{config:n?a.current:void 0,enabled:n}}var ta={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],products:[],optionSearch:null,activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],activeFormatType:"options",dateView:null,dateRangeStart:null,placeholderText:"",optionQuery:"",isSearchingOptions:!1,isDropdownOpen:!1,isActivePillSelected:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingIdentified:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1,dateViewMonth:null,pendingRangeStart:null};function je({onSubmit:e,onResult:o,onError:a,optionOverrides:n,maskCompletedText:r,apiConfig:i,additionalContext:s,columns:f=2,dropdownTrigger:b,optionsPosition:w,closeDropdownOnBlur:k,showNonTappableOptions:p,showSkipButton:x,onFocus:_,onBlur:v,value:L,completedParams:M,onChange:ie,onParamsChange:ne,products:W,onProductSelect:A,source:re,setCursor:se}){let u=(0,I.useRef)(null),[be,le]=(0,I.useState)(null),N=(0,I.useRef)(e);N.current=e;let Z=(0,I.useRef)(o);Z.current=o;let de=(0,I.useRef)(a);de.current=a;let ce=(0,I.useRef)(ie);ce.current=ie;let J=(0,I.useRef)(ne);J.current=ne;let ee=(0,I.useRef)(_);ee.current=_;let G=(0,I.useRef)(v);G.current=v;let pe=(0,I.useRef)(se);pe.current=se;let ve=(0,I.useRef)(A);ve.current=A;let z=Ct(W),q=Dt(n);(0,I.useEffect)(()=>{if(typeof document>"u")return;let m=new Ee.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:i,additionalContext:s,optionOverrides:q.overrides,maskCompletedText:r,columns:f,dropdownTrigger:b,optionsPosition:w,closeDropdownOnBlur:k,showNonTappableOptions:p,source:re,value:L,completedParams:M,onSubmit:(...R)=>N.current?.(...R),onResult:(...R)=>Z.current?.(...R),onError:(...R)=>de.current?.(...R),onChange:(...R)=>ce.current?.(...R),onParamsChange:(...R)=>J.current?.(...R),onFocus:()=>ee.current?.(),onBlur:()=>G.current?.(),onProductSelect:R=>ve.current?.(R),setCursor:R=>pe.current?.(R),products:z.config});u.current=m,le(m.getState());let $=m.subscribe(R=>le(R));return()=>{$(),m.destroy(),u.current===m&&(u.current=null)}},[]),(0,I.useEffect)(()=>{L!==void 0&&u.current?.setValue(L)},[L]),(0,I.useEffect)(()=>{M!==void 0&&u.current?.setCompletedParams(M)},[M]);let ue=JSON.stringify(i??null),t;try{t=JSON.stringify(s??null)}catch{t="[unstringifiable]"}(0,I.useEffect)(()=>{u.current?.update({apiConfig:i,additionalContext:s,optionOverrides:q.overrides,dropdownTrigger:b,optionsPosition:w,closeDropdownOnBlur:k,showNonTappableOptions:p})},[ue,t,q.key,b,w,k,p]);let c=(0,I.useRef)(!1);(0,I.useEffect)(()=>{if(!c.current){c.current=!0;return}u.current?.update({products:z.config})},[z.enabled]);let h=(0,I.useRef)(null);h.current===null&&(h.current={handleTextChange:m=>u.current?.handleTextChange(m),handleKeyDown:m=>{let $="nativeEvent"in m?m.nativeEvent:m;u.current?.handleKeyDown($)},setFocused:m=>u.current?.setFocused(m),startEditingParam:m=>u.current?.startEditingParam(m),exitEditMode:()=>u.current?.exitEditMode(),handleCaretAfterInput:m=>u.current?.handleCaretAfterInput(m),handleCaretMove:m=>u.current?.handleCaretMove(m),replaceEditingRange:m=>u.current?.replaceEditingRange(m)??!1,setActivePill:m=>u.current?.setActivePill(m),skipActivePill:()=>u.current?.skipActivePill(),removeLastParam:()=>u.current?.removeLastParam(),clearNewParamId:()=>u.current?.clearNewParamId(),reset:()=>u.current?.reset(),selectOption:m=>u.current?.selectOption(m),selectProduct:m=>u.current?.selectProduct(m),setActiveDropdownIndex:m=>u.current?.setActiveDropdownIndex(m),showPreviousMonth:()=>u.current?.showPreviousMonth(),showNextMonth:()=>u.current?.showNextMonth(),handleFocus:()=>u.current?.setFocused(!0),handleBlur:()=>u.current?.setFocused(!1)});let l=h.current,y=(0,I.useCallback)(m=>{let $=m.target.value,Qe=$.length>0&&!m.nativeEvent?.isComposing&&$[0]!==$[0].toUpperCase()?$[0].toUpperCase()+$.slice(1):$;u.current?.handleTextChange(Qe)},[]),T=(0,I.useCallback)(m=>{u.current?.handleKeyDown(m.nativeEvent)},[]),U=u.current,d=be??ta,he=L!==void 0?L:d.text,Ie=M!==void 0?M:d.completedParams,we=d.actionableSuggestions,xe=we[0],te=U?.listboxId??"",Ae=d.activeDropdownIndex>=0&&U?`${te}-option-${d.activeDropdownIndex}`:void 0,V=d.editingParam,j=d.editingIdentified,Re=V?{type:V.suggestionType,text:V.suggestionPlaceholder,required:!0,options:V.options}:j?{type:j.type,text:(0,Ee.identifiedParamLabel)(j.type),required:!0,options:[]}:null,Ne=Re??xe,Ve=Re?[Re]:we,Le=(0,Ee.dateSelectionFor)(d),ze=!U||d.isLoading&&!d.editingParam&&!d.inSelectionAnimation||d.isSearchingOptions;return{completedParams:Ie,skippedParams:d.skippedParams,identifiedParams:d.identifiedParams,suggestionPills:we,setActivePill:l.setActivePill,skipActivePill:l.skipActivePill,removeLastParam:l.removeLastParam,segments:d.segments,newParamId:d.newParamId,clearNewParamId:l.clearNewParamId,suggestions:d.suggestions,activeIndex:d.activeDropdownIndex,isReady:d.isReady,isLoading:ze,isFocused:d.isFocused,isDropdownOpen:d.isDropdownOpen,isActivePillSelected:d.isActivePillSelected,placeholderText:d.placeholderText,listboxId:te,error:d.error,products:d.products,selectProduct:l.selectProduct,handleTextChange:l.handleTextChange,handleKeyDown:l.handleKeyDown,setFocused:l.setFocused,editingParam:V,editingIdentified:j,editingAnchor:d.editingAnchor,caretOffset:d.caretOffset,startEditingParam:l.startEditingParam,exitEditMode:l.exitEditMode,handleCaretAfterInput:l.handleCaretAfterInput,handleCaretMove:l.handleCaretMove,replaceEditingRange:l.replaceEditingRange,inputProps:{value:he,placeholder:d.placeholderText||void 0,onChange:y,onKeyDown:T,onFocus:l.handleFocus,onBlur:l.handleBlur,role:"combobox","aria-expanded":d.isDropdownOpen,"aria-activedescendant":Ae,"aria-autocomplete":"list","aria-controls":te},reset:l.reset,dropdownProps:{suggestions:Ne?[{...Ne,options:d.filteredOptions}]:[],activeIndex:d.activeDropdownIndex,onSelect:l.selectOption,onHighlight:l.setActiveDropdownIndex,isOpen:d.isDropdownOpen,id:te,pills:Ve,activeSelected:d.isActivePillSelected,onPillClick:l.setActivePill,onSkip:l.skipActivePill,showSkipButton:(x??!0)&&!V&&!j,skipDisabled:d.inSelectionAnimation,isLoading:ze,isInputEmpty:he.trim().length===0,products:d.products,onProductSelect:l.selectProduct,onProductFocusChange:l.setFocused,formatType:d.activeFormatType,dateView:d.dateView,selectedDateIso:Le.selectedIso,selectedDateRange:Le.selectedRange,dateRangeStart:Le.rangeStart,onPreviousMonth:l.showPreviousMonth,onNextMonth:l.showNextMonth,optionsPosition:w??"below"}}}var K=require("@magicx-eng/ai-autocomplete-vanilla"),P=require("react"),$e;function aa(){if($e!==void 0)return $e;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),$e=e.contentEditable==="plaintext-only",$e}function Et(e){let{segments:o,newParamId:a,editingParam:n,editingIdentified:r,editingAnchor:i,caretOffset:s,placeholderText:f,isFocused:b,isDropdownOpen:w,listboxId:k,activeDescendantId:p,autoFocus:x,handleTextChange:_,handleKeyDown:v,handleCaretAfterInput:L,handleCaretMove:M,startEditingParam:ie,replaceEditingRange:ne,setFocused:W}=e,A=(0,P.useRef)(null),re=(0,P.useRef)(!1),se=(0,P.useRef)(""),u=(0,P.useRef)(""),be=(0,P.useRef)(null),le=(0,P.useRef)(0);be.current=s,(0,P.useEffect)(()=>{if(!x)return;let t=A.current;if(!t)return;document.activeElement===t?W(!0):t.focus();let c=t.ownerDocument??document,h=c.getSelection(),l=h&&h.rangeCount>0&&t.contains(h.anchorNode);if(h&&!l){let y=c.createRange();y.selectNodeContents(t),y.collapse(!0),h.removeAllRanges(),h.addRange(y)}},[x,W]),(0,P.useEffect)(()=>{let t=A.current;if(!t)return;let c=t.ownerDocument??document,h=()=>{let l=c.getSelection();if(!l||l.rangeCount===0||!l.anchorNode||!t.contains(l.anchorNode))return;let y=l.anchorNode,T=y.nodeType===Node.ELEMENT_NODE?y:y.parentElement,d=(l.isCollapsed?T?.closest("strong[data-param-id]"):null)?.dataset.paramId??null,he=n?.id??r?.id??null;if(d&&d!==he){ie(d);return}performance.now()-le.current<50||M((0,K.getCursorOffset)(t))};return c.addEventListener("selectionchange",h),()=>c.removeEventListener("selectionchange",h)},[n,r,ie,M]),(0,P.useLayoutEffect)(()=>{let t=A.current;t&&(0,K.renderEditableContent)({input:t,segments:o,newParamId:a,editingParamId:n?.id??null,placeholderText:f??"",isFocused:b})},[o,a,n,f,b]),(0,P.useLayoutEffect)(()=>{let t=se.current,c=a??"";if(se.current=c,!c||c===t)return;let h=A.current;if(!h)return;h.focus();let l=be.current??(0,K.plainTextLength)(h);(0,K.setCursorOffset)(h,l)},[a]),(0,P.useLayoutEffect)(()=>{let t=u.current,c=n?.id??"";if(u.current=c,!c||c===t||i==null)return;let h=A.current;h&&(0,K.setCursorOffset)(h,i)},[n,i]);let N=(0,P.useCallback)(()=>{if(re.current)return;let t=A.current;if(!t)return;let c=(0,K.extractPlainText)(t),l=c.length>0&&c[0]!==c[0].toUpperCase()?c[0].toUpperCase()+c.slice(1):c;_(l)},[_]),Z=(0,P.useCallback)(()=>{le.current=performance.now(),N();let t=A.current;t&&L((0,K.getCursorOffset)(t))},[N,L]);(0,P.useEffect)(()=>{let t=A.current;if(!t)return;let c=h=>{let l=h,y=l.inputType;if(y==="insertParagraph"||y==="insertLineBreak"||y==="insertFromDrop"){h.preventDefault();return}if(y.startsWith("insert")||y.startsWith("delete")){let T=y.startsWith("delete")?"":l.data??"";ne(T)&&h.preventDefault()}};return t.addEventListener("beforeinput",c),()=>t.removeEventListener("beforeinput",c)},[ne]);let de=(0,P.useCallback)(()=>{re.current=!0},[]),ce=(0,P.useCallback)(()=>{re.current=!1,N()},[N]),J=(0,P.useCallback)(t=>{t.preventDefault();let c=A.current;if(!c)return;let h=(t.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!h)return;let l=c.ownerDocument??document,y=l.getSelection();if(!y||y.rangeCount===0)return;let T=y.getRangeAt(0);if(!c.contains(T.startContainer))return;T.deleteContents();let U=l.createTextNode(h);T.insertNode(U),T.setStartAfter(U),T.collapse(!0),y.removeAllRanges(),y.addRange(T),N()},[N]),ee=(0,P.useCallback)(t=>v(t),[v]),G=(0,P.useCallback)(()=>W(!0),[W]),pe=(0,P.useCallback)(()=>W(!1),[W]),ve=(0,P.useCallback)(()=>A.current?.focus(),[]),z=(0,P.useCallback)(()=>A.current?.blur(),[]),q=(0,P.useCallback)(()=>{let t=A.current;return t?(0,K.extractPlainText)(t):""},[]),ue=aa()?"plaintext-only":"true";return{inputRef:A,editorProps:{ref:A,contentEditable:ue,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":k,"aria-expanded":w,"aria-activedescendant":p,spellCheck:!0,enterKeyHint:"send",onInput:Z,onKeyDown:ee,onCompositionStart:de,onCompositionEnd:ce,onPaste:J,onFocus:G,onBlur:pe},getPlainText:q,focus:ve,blur:z}}var X=require("react/jsx-runtime");function oa(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var Tt=(0,E.forwardRef)(function({onSubmit:o,onResult:a,onError:n,optionOverrides:r,maskCompletedText:i,className:s,apiConfig:f,additionalContext:b,columns:w,pillPlacement:k="dropdown",mode:p="auto",optionsPosition:x="below",animations:_=!0,dropdownTrigger:v,closeDropdownOnBlur:L,showNonTappableOptions:M,showSkipButton:ie,autoFocus:ne=!0,onFocus:W,onBlur:A,value:re,completedParams:se,onChange:u,onParamsChange:be,products:le,onProductSelect:N,submitButton:Z},de){let ce=(0,E.useRef)(null),J=(0,E.useRef)(null),ee=(0,E.useRef)(()=>{}),G=(0,E.useRef)(null),pe=(0,E.useRef)(null);(0,E.useEffect)(()=>{let S=ce.current;if(S)return G.current?G.current.setMode(p):G.current=new Te.ModeController(S,p),()=>{G.current?.destroy(),G.current=null}},[p]);let ve=(0,E.useCallback)(S=>{let ye=pe.current?.current;ye&&(ye.focus(),(0,Te.setCursorOffset)(ye,S))},[]),{completedParams:z,skippedParams:q,identifiedParams:ue,isReady:t,suggestionPills:c,setActivePill:h,skipActivePill:l,segments:y,newParamId:T,clearNewParamId:U,placeholderText:d,isFocused:he,isDropdownOpen:Ie,isActivePillSelected:we,isLoading:xe,activeIndex:te,listboxId:Ae,handleTextChange:V,handleKeyDown:j,setFocused:Re,editingParam:Ne,editingIdentified:Ve,editingAnchor:Le,caretOffset:ze,startEditingParam:m,handleCaretAfterInput:$,handleCaretMove:R,replaceEditingRange:Qe,dropdownProps:Rt,reset:Be}=je({onSubmit:S=>ee.current(S),onResult:a,onError:n,optionOverrides:r,maskCompletedText:i,apiConfig:f,additionalContext:b,columns:w,dropdownTrigger:v,optionsPosition:x,closeDropdownOnBlur:L,showNonTappableOptions:M,showSkipButton:ie,onFocus:W,onBlur:A,value:re,completedParams:se,onChange:u,onParamsChange:be,products:le,onProductSelect:N,source:"full-sdk",setCursor:ve});(0,E.useEffect)(()=>{if(!T)return;let S=window.setTimeout(()=>U(),650);return()=>window.clearTimeout(S)},[T,U]);let Lt=te>=0?`${Ae}-option-${te}`:void 0,{inputRef:Ye,editorProps:Ot,focus:Ge,blur:nt,getPlainText:rt}=Et({segments:y,newParamId:T,editingParam:Ne,editingIdentified:Ve,editingAnchor:Le,caretOffset:ze,placeholderText:d,isFocused:he,isDropdownOpen:Ie,listboxId:Ae,activeDescendantId:Lt,autoFocus:ne,handleTextChange:V,handleKeyDown:j,handleCaretAfterInput:$,handleCaretMove:R,startEditingParam:m,replaceEditingRange:Qe,setFocused:Re});pe.current=Ye,(0,E.useLayoutEffect)(()=>{let S=J.current,ye=Ye.current;if(!S||!ye)return;let st=()=>{let dt=S.firstElementChild;if(!dt)return;let Bt=dt.getBoundingClientRect(),Gt=ye.getBoundingClientRect();Bt.top>=Gt.bottom-2?S.setAttribute("data-aia-pill-wrapped",""):S.removeAttribute("data-aia-pill-wrapped")};st();let lt=new ResizeObserver(st);return lt.observe(ye),()=>lt.disconnect()},[y,c.length,xe,Ye]),(0,E.useImperativeHandle)(de,()=>({focus:Ge,blur:nt,reset:Be,setMode:S=>G.current?.setMode(S),skipActivePill:l}),[Ge,nt,Be,l]);let Fe=!!y.length||z.length>0,Xe=(0,E.useCallback)(()=>{if(!Fe)return;let S=rt();o((0,Te.buildSubmitResult)(S,z,q,{identifiedParams:ue,isReady:t})),Be()},[Fe,z,q,ue,t,o,Be,rt]);ee.current=Xe;let Mt=(0,E.useCallback)(S=>{S.target?.closest("[data-aia-pill]")||Ge()},[Ge]),Nt=k==="inline",zt=k==="dropdown";return(0,X.jsxs)("div",{ref:ce,className:`magicx-aia ${ke.container} ${s??""}`,"data-pill-placement":k,"data-options-position":x,"data-animations":_?"on":"off","data-mode":oa(p),children:[(0,X.jsx)(qe,{...Rt,showPills:zt}),(0,X.jsxs)("div",{className:ke.inputWrapper,onClick:Mt,children:[(0,X.jsxs)("div",{className:ke.editorArea,"data-aia-editor":"",children:[(0,X.jsx)("div",{...Ot,className:ke.input,"data-aia-input":""}),Nt&&(xe||c.length>0)&&(0,X.jsx)("span",{ref:J,className:ke.pillListContainer,"data-aia-pill-list-container":"",children:(0,X.jsx)(Ke,{pills:c,activePillIndex:0,activeSelected:we,onSelectPill:h,loading:xe})})]}),Z===null?null:Z===void 0?(0,X.jsx)(St,{disabled:!Fe,onClick:Xe}):(0,X.jsx)("span",{"data-aia-submit":"",className:ke.submitSlot,onClick:S=>{Fe&&(S.stopPropagation(),Xe())},children:Z})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,DATE_RANGE_META_END,DATE_RANGE_META_START,WEEKDAY_LABELS,buildSubmitResult,cellDay,cellIso,dateCellMarks,formatDate,formatDateRange,isoDate,monthLabel,parseDate,parseLooseDate,parseLooseDateRange,selectedRangeFor,useAIAutocomplete,visibleDateRange,withSkippedParams});
|
|
1651
|
+
`,document.head.appendChild(e)}var At={submitButton:"SubmitButton-module_submitButton_otz7H"};var $e=require("react/jsx-runtime");function Dt({disabled:e,onClick:a}){return(0,$e.jsx)("button",{type:"button","data-aia-submit":"",className:At.submitButton,disabled:e,onClick:o=>{o.stopPropagation(),a()},"aria-label":"Submit",children:(0,$e.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,$e.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var Re=require("@magicx-eng/ai-autocomplete-vanilla"),I=require("react");var nt=require("react");function Ct(e){let a=(0,nt.useRef)(e);a.current=e;let o=Object.keys(e??{}).sort().join("\0"),r=(0,nt.useRef)({key:"",overrides:void 0});if(r.current.key!==o){let n={};for(let i of Object.keys(e??{})){let s=(f,w,b)=>{let y=a.current?.[i];return y?y(f,w,b):[]};n[i]=s}r.current={key:o,overrides:e?n:void 0}}return{overrides:r.current.overrides,key:o}}var rt=require("react");function Et(e){let a=(0,rt.useRef)(e);a.current=e;let o=(0,rt.useRef)(null);o.current===null&&(o.current={fetch:(n,i)=>{let s=a.current;return s?s.fetch(n,i):Promise.reject(new Error("products config removed"))},transform:n=>a.current?.transform(n)??[],get limit(){return a.current?.limit}});let r=e!==void 0;return{config:r?o.current:void 0,enabled:r}}var ao={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],products:[],optionSearch:null,activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],activeFormatType:"options",dateView:null,dateRangeStart:null,placeholderText:"",optionQuery:"",isSearchingOptions:!1,isDropdownOpen:!1,isActivePillSelected:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingIdentified:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1,dateViewMonth:null,pendingRangeStart:null};function Ve({onSubmit:e,onResult:a,onError:o,optionOverrides:r,maskCompletedText:n,apiConfig:i,additionalContext:s,columns:f=2,dropdownTrigger:w,optionsPosition:b,closeDropdownOnBlur:y,showNonTappableOptions:m,showOptionIcons:_,showSkipButton:P,onFocus:v,onBlur:E,value:S,completedParams:N,onChange:ne,onParamsChange:re,products:U,onProductSelect:A,source:se,setCursor:le}){let h=(0,I.useRef)(null),[ve,de]=(0,I.useState)(null),z=(0,I.useRef)(e);z.current=e;let we=(0,I.useRef)(a);we.current=a;let Y=(0,I.useRef)(o);Y.current=o;let xe=(0,I.useRef)(ne);xe.current=ne;let oe=(0,I.useRef)(re);oe.current=re;let ae=(0,I.useRef)(v);ae.current=v;let ce=(0,I.useRef)(E);ce.current=E;let G=(0,I.useRef)(le);G.current=le;let pe=(0,I.useRef)(A);pe.current=A;let j=Et(U),F=Ct(r);(0,I.useEffect)(()=>{if(typeof document>"u")return;let g=new Re.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:i,additionalContext:s,optionOverrides:F.overrides,maskCompletedText:n,columns:f,dropdownTrigger:w,optionsPosition:b,closeDropdownOnBlur:y,showNonTappableOptions:m,source:se,value:S,completedParams:N,onSubmit:(...L)=>z.current?.(...L),onResult:(...L)=>we.current?.(...L),onError:(...L)=>Y.current?.(...L),onChange:(...L)=>xe.current?.(...L),onParamsChange:(...L)=>oe.current?.(...L),onFocus:()=>ae.current?.(),onBlur:()=>ce.current?.(),onProductSelect:L=>pe.current?.(L),setCursor:L=>G.current?.(L),products:j.config});h.current=g,de(g.getState());let Q=g.subscribe(L=>de(L));return()=>{Q(),g.destroy(),h.current===g&&(h.current=null)}},[]),(0,I.useEffect)(()=>{S!==void 0&&h.current?.setValue(S)},[S]),(0,I.useEffect)(()=>{N!==void 0&&h.current?.setCompletedParams(N)},[N]);let ue=JSON.stringify(i??null),t;try{t=JSON.stringify(s??null)}catch{t="[unstringifiable]"}(0,I.useEffect)(()=>{h.current?.update({apiConfig:i,additionalContext:s,optionOverrides:F.overrides,dropdownTrigger:w,optionsPosition:b,closeDropdownOnBlur:y,showNonTappableOptions:m})},[ue,t,F.key,w,b,y,m]);let c=(0,I.useRef)(!1);(0,I.useEffect)(()=>{if(!c.current){c.current=!0;return}h.current?.update({products:j.config})},[j.enabled]);let p=(0,I.useRef)(null);p.current===null&&(p.current={handleTextChange:g=>h.current?.handleTextChange(g),handleKeyDown:g=>{let Q="nativeEvent"in g?g.nativeEvent:g;h.current?.handleKeyDown(Q)},setFocused:g=>h.current?.setFocused(g),startEditingParam:g=>h.current?.startEditingParam(g),exitEditMode:()=>h.current?.exitEditMode(),handleCaretAfterInput:g=>h.current?.handleCaretAfterInput(g),handleCaretMove:g=>h.current?.handleCaretMove(g),replaceEditingRange:g=>h.current?.replaceEditingRange(g)??!1,setActivePill:g=>h.current?.setActivePill(g),skipActivePill:()=>h.current?.skipActivePill(),removeLastParam:()=>h.current?.removeLastParam(),clearNewParamId:()=>h.current?.clearNewParamId(),reset:()=>h.current?.reset(),selectOption:g=>h.current?.selectOption(g),selectProduct:g=>h.current?.selectProduct(g),setActiveDropdownIndex:g=>h.current?.setActiveDropdownIndex(g),showPreviousMonth:()=>h.current?.showPreviousMonth(),showNextMonth:()=>h.current?.showNextMonth(),handleFocus:()=>h.current?.setFocused(!0),handleBlur:()=>h.current?.setFocused(!1)});let l=p.current,x=(0,I.useCallback)(g=>{let Q=g.target.value,Xe=Q.length>0&&!g.nativeEvent?.isComposing&&Q[0]!==Q[0].toUpperCase()?Q[0].toUpperCase()+Q.slice(1):Q;h.current?.handleTextChange(Xe)},[]),O=(0,I.useCallback)(g=>{h.current?.handleKeyDown(g.nativeEvent)},[]),H=h.current,d=ve??ao,he=S!==void 0?S:d.text,Se=N!==void 0?N:d.completedParams,ye=d.actionableSuggestions,Ae=ye[0],X=H?.listboxId??"",De=d.activeDropdownIndex>=0&&H?`${X}-option-${d.activeDropdownIndex}`:void 0,$=d.editingParam,V=d.editingIdentified,Le=$?{type:$.suggestionType,text:$.suggestionPlaceholder,required:!0,options:$.options}:V?{type:V.type,text:(0,Re.identifiedParamLabel)(V.type),required:!0,options:[]}:null,Be=Le??Ae,Ye=Le?[Le]:ye,Me=(0,Re.dateSelectionFor)(d),Ge=!H||d.isLoading&&!d.editingParam&&!d.inSelectionAnimation||d.isSearchingOptions;return{completedParams:Se,skippedParams:d.skippedParams,identifiedParams:d.identifiedParams,suggestionPills:ye,setActivePill:l.setActivePill,skipActivePill:l.skipActivePill,removeLastParam:l.removeLastParam,segments:d.segments,newParamId:d.newParamId,clearNewParamId:l.clearNewParamId,suggestions:d.suggestions,activeIndex:d.activeDropdownIndex,isReady:d.isReady,isLoading:Ge,isFocused:d.isFocused,isDropdownOpen:d.isDropdownOpen,isActivePillSelected:d.isActivePillSelected,placeholderText:d.placeholderText,listboxId:X,error:d.error,products:d.products,selectProduct:l.selectProduct,handleTextChange:l.handleTextChange,handleKeyDown:l.handleKeyDown,setFocused:l.setFocused,editingParam:$,editingIdentified:V,editingAnchor:d.editingAnchor,caretOffset:d.caretOffset,startEditingParam:l.startEditingParam,exitEditMode:l.exitEditMode,handleCaretAfterInput:l.handleCaretAfterInput,handleCaretMove:l.handleCaretMove,replaceEditingRange:l.replaceEditingRange,inputProps:{value:he,placeholder:d.placeholderText||void 0,onChange:x,onKeyDown:O,onFocus:l.handleFocus,onBlur:l.handleBlur,role:"combobox","aria-expanded":d.isDropdownOpen,"aria-activedescendant":De,"aria-autocomplete":"list","aria-controls":X},reset:l.reset,dropdownProps:{suggestions:Be?[{...Be,options:d.filteredOptions}]:[],activeIndex:d.activeDropdownIndex,onSelect:l.selectOption,onHighlight:l.setActiveDropdownIndex,isOpen:d.isDropdownOpen,id:X,pills:Ye,activeSelected:d.isActivePillSelected,onPillClick:l.setActivePill,onSkip:l.skipActivePill,showSkipButton:(P??!0)&&!$&&!V,showOptionIcons:_??!0,skipDisabled:d.inSelectionAnimation,isLoading:Ge,isInputEmpty:he.trim().length===0,products:d.products,onProductSelect:l.selectProduct,onProductFocusChange:l.setFocused,formatType:d.activeFormatType,dateView:d.dateView,selectedDateIso:Me.selectedIso,selectedDateRange:Me.selectedRange,dateRangeStart:Me.rangeStart,onPreviousMonth:l.showPreviousMonth,onNextMonth:l.showNextMonth,optionsPosition:b??"below"}}}var q=require("@magicx-eng/ai-autocomplete-vanilla"),k=require("react"),Qe;function io(){if(Qe!==void 0)return Qe;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Qe=e.contentEditable==="plaintext-only",Qe}function Tt(e){let{segments:a,showChipIcons:o=!0,newParamId:r,editingParam:n,editingIdentified:i,editingAnchor:s,caretOffset:f,placeholderText:w,isFocused:b,isDropdownOpen:y,listboxId:m,activeDescendantId:_,autoFocus:P,handleTextChange:v,handleKeyDown:E,handleCaretAfterInput:S,handleCaretMove:N,startEditingParam:ne,replaceEditingRange:re,setFocused:U}=e,A=(0,k.useRef)(null),se=(0,k.useRef)(!1),le=(0,k.useRef)(""),h=(0,k.useRef)(""),ve=(0,k.useRef)(null),de=(0,k.useRef)(0);ve.current=f,(0,k.useEffect)(()=>{if(!P)return;let t=A.current;if(!t)return;document.activeElement===t?U(!0):t.focus();let c=t.ownerDocument??document,p=c.getSelection(),l=p&&p.rangeCount>0&&t.contains(p.anchorNode);if(p&&!l){let x=c.createRange();x.selectNodeContents(t),x.collapse(!0),p.removeAllRanges(),p.addRange(x)}},[P,U]),(0,k.useEffect)(()=>{let t=A.current;if(!t)return;let c=t.ownerDocument??document,p=()=>{let l=c.getSelection();if(!l||l.rangeCount===0||!l.anchorNode||!t.contains(l.anchorNode))return;let x=l.anchorNode,O=x.nodeType===Node.ELEMENT_NODE?x:x.parentElement,d=(l.isCollapsed?O?.closest("strong[data-param-id]"):null)?.dataset.paramId??null,he=n?.id??i?.id??null;if(d&&d!==he){ne(d);return}performance.now()-de.current<50||N((0,q.getCursorOffset)(t))};return c.addEventListener("selectionchange",p),()=>c.removeEventListener("selectionchange",p)},[n,i,ne,N]),(0,k.useLayoutEffect)(()=>{let t=A.current;t&&(0,q.renderEditableContent)({input:t,segments:a,newParamId:r,editingParamId:n?.id??null,placeholderText:w??"",isFocused:b,showChipIcons:o})},[a,r,n,w,b,o]),(0,k.useLayoutEffect)(()=>{let t=le.current,c=r??"";if(le.current=c,!c||c===t)return;let p=A.current;if(!p)return;p.focus();let l=ve.current??(0,q.plainTextLength)(p);(0,q.setCursorOffset)(p,l)},[r]),(0,k.useLayoutEffect)(()=>{let t=h.current,c=n?.id??"";if(h.current=c,!c||c===t||s==null)return;let p=A.current;p&&(0,q.setCursorOffset)(p,s)},[n,s]);let z=(0,k.useCallback)(()=>{if(se.current)return;let t=A.current;if(!t)return;let c=(0,q.extractPlainText)(t),l=c.length>0&&c[0]!==c[0].toUpperCase()?c[0].toUpperCase()+c.slice(1):c;v(l)},[v]),we=(0,k.useCallback)(()=>{de.current=performance.now(),z();let t=A.current;t&&S((0,q.getCursorOffset)(t))},[z,S]);(0,k.useEffect)(()=>{let t=A.current;if(!t)return;let c=p=>{let l=p,x=l.inputType;if(x==="insertParagraph"||x==="insertLineBreak"||x==="insertFromDrop"){p.preventDefault();return}if(x.startsWith("insert")||x.startsWith("delete")){let O=x.startsWith("delete")?"":l.data??"";re(O)&&p.preventDefault()}};return t.addEventListener("beforeinput",c),()=>t.removeEventListener("beforeinput",c)},[re]);let Y=(0,k.useCallback)(()=>{se.current=!0},[]),xe=(0,k.useCallback)(()=>{se.current=!1,z()},[z]),oe=(0,k.useCallback)(t=>{t.preventDefault();let c=A.current;if(!c)return;let p=(t.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!p)return;let l=c.ownerDocument??document,x=l.getSelection();if(!x||x.rangeCount===0)return;let O=x.getRangeAt(0);if(!c.contains(O.startContainer))return;O.deleteContents();let H=l.createTextNode(p);O.insertNode(H),O.setStartAfter(H),O.collapse(!0),x.removeAllRanges(),x.addRange(O),z()},[z]),ae=(0,k.useCallback)(t=>E(t),[E]),ce=(0,k.useCallback)(()=>U(!0),[U]),G=(0,k.useCallback)(()=>U(!1),[U]),pe=(0,k.useCallback)(()=>A.current?.focus(),[]),j=(0,k.useCallback)(()=>A.current?.blur(),[]),F=(0,k.useCallback)(()=>{let t=A.current;return t?(0,q.extractPlainText)(t):""},[]),ue=io()?"plaintext-only":"true";return{inputRef:A,editorProps:{ref:A,contentEditable:ue,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":m,"aria-expanded":y,"aria-activedescendant":_,spellCheck:!0,enterKeyHint:"send",onInput:we,onKeyDown:ae,onCompositionStart:Y,onCompositionEnd:xe,onPaste:oe,onFocus:ce,onBlur:G},getPlainText:F,focus:pe,blur:j}}var te=require("react/jsx-runtime");function no(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var Rt=(0,R.forwardRef)(function({onSubmit:a,onResult:o,onError:r,optionOverrides:n,maskCompletedText:i,className:s,apiConfig:f,additionalContext:w,columns:b,pillPlacement:y="dropdown",mode:m="auto",optionsPosition:_="below",animations:P=!0,dropdownTrigger:v,closeDropdownOnBlur:E,showNonTappableOptions:S,showOptionIcons:N=!0,showChipIcons:ne=!0,showSkipButton:re,autoFocus:U=!0,onFocus:A,onBlur:se,value:le,completedParams:h,onChange:ve,onParamsChange:de,products:z,onProductSelect:we,submitButton:Y},xe){let oe=(0,R.useRef)(null),ae=(0,R.useRef)(null),ce=(0,R.useRef)(()=>{}),G=(0,R.useRef)(null),pe=(0,R.useRef)(null);(0,R.useEffect)(()=>{let D=oe.current;if(D)return G.current?G.current.setMode(m):G.current=new Oe.ModeController(D,m),()=>{G.current?.destroy(),G.current=null}},[m]);let j=(0,R.useCallback)(D=>{let _e=pe.current?.current;_e&&(_e.focus(),(0,Oe.setCursorOffset)(_e,D))},[]),{completedParams:F,skippedParams:ue,identifiedParams:t,isReady:c,suggestionPills:p,setActivePill:l,skipActivePill:x,segments:O,newParamId:H,clearNewParamId:d,placeholderText:he,isFocused:Se,isDropdownOpen:ye,isActivePillSelected:Ae,isLoading:X,activeIndex:De,listboxId:$,handleTextChange:V,handleKeyDown:Le,setFocused:Be,editingParam:Ye,editingIdentified:Me,editingAnchor:Ge,caretOffset:g,startEditingParam:Q,handleCaretAfterInput:L,handleCaretMove:Xe,replaceEditingRange:Ot,dropdownProps:Lt,reset:Fe}=Ve({onSubmit:D=>ce.current(D),onResult:o,onError:r,optionOverrides:n,maskCompletedText:i,apiConfig:f,additionalContext:w,columns:b,dropdownTrigger:v,optionsPosition:_,closeDropdownOnBlur:E,showNonTappableOptions:S,showOptionIcons:N,showSkipButton:re,onFocus:A,onBlur:se,value:le,completedParams:h,onChange:ve,onParamsChange:de,products:z,onProductSelect:we,source:"full-sdk",setCursor:j});(0,R.useEffect)(()=>{if(!H)return;let D=window.setTimeout(()=>d(),650);return()=>window.clearTimeout(D)},[H,d]);let Mt=De>=0?`${$}-option-${De}`:void 0,{inputRef:Ze,editorProps:Nt,focus:He,blur:st,getPlainText:lt}=Tt({segments:O,newParamId:H,editingParam:Ye,editingIdentified:Me,editingAnchor:Ge,caretOffset:g,placeholderText:he,isFocused:Se,showChipIcons:ne,isDropdownOpen:ye,listboxId:$,activeDescendantId:Mt,autoFocus:U,handleTextChange:V,handleKeyDown:Le,handleCaretAfterInput:L,handleCaretMove:Xe,startEditingParam:Q,replaceEditingRange:Ot,setFocused:Be});pe.current=Ze,(0,R.useLayoutEffect)(()=>{let D=ae.current,_e=Ze.current;if(!D||!_e)return;let dt=()=>{let pt=D.firstElementChild;if(!pt)return;let Ft=pt.getBoundingClientRect(),Ht=_e.getBoundingClientRect();Ft.top>=Ht.bottom-2?D.setAttribute("data-aia-pill-wrapped",""):D.removeAttribute("data-aia-pill-wrapped")};dt();let ct=new ResizeObserver(dt);return ct.observe(_e),()=>ct.disconnect()},[O,p.length,X,Ze]),(0,R.useImperativeHandle)(xe,()=>({focus:He,blur:st,reset:Fe,setMode:D=>G.current?.setMode(D),skipActivePill:x}),[He,st,Fe,x]);let Ke=!!O.length||F.length>0,Je=(0,R.useCallback)(()=>{if(!Ke)return;let D=lt();a((0,Oe.buildSubmitResult)(D,F,ue,{identifiedParams:t,isReady:c})),Fe()},[Ke,F,ue,t,c,a,Fe,lt]);ce.current=Je;let zt=(0,R.useCallback)(D=>{D.target?.closest("[data-aia-pill]")||He()},[He]),Bt=y==="inline",Gt=y==="dropdown";return(0,te.jsxs)("div",{ref:oe,className:`magicx-aia ${Pe.container} ${s??""}`,"data-pill-placement":y,"data-options-position":_,"data-animations":P?"on":"off","data-mode":no(m),children:[(0,te.jsx)(je,{...Lt,showPills:Gt}),(0,te.jsxs)("div",{className:Pe.inputWrapper,onClick:zt,children:[(0,te.jsxs)("div",{className:Pe.editorArea,"data-aia-editor":"",children:[(0,te.jsx)("div",{...Nt,className:Pe.input,"data-aia-input":""}),Bt&&(X||p.length>0)&&(0,te.jsx)("span",{ref:ae,className:Pe.pillListContainer,"data-aia-pill-list-container":"",children:(0,te.jsx)(qe,{pills:p,activePillIndex:0,activeSelected:Ae,onSelectPill:l,loading:X})})]}),Y===null?null:Y===void 0?(0,te.jsx)(Dt,{disabled:!Ke,onClick:Je}):(0,te.jsx)("span",{"data-aia-submit":"",className:Pe.submitSlot,onClick:D=>{Ke&&(D.stopPropagation(),Je())},children:Y})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,DATE_RANGE_META_END,DATE_RANGE_META_START,WEEKDAY_LABELS,buildSubmitResult,cellDay,cellIso,dateCellMarks,formatDate,formatDateRange,isoDate,monthLabel,optionLabel,parseDate,parseLooseDate,parseLooseDateRange,sanitizeOptionIconSvg,selectedRangeFor,useAIAutocomplete,visibleDateRange,withSkippedParams});
|
|
1597
1652
|
//# sourceMappingURL=index.js.map
|