@magicx-eng/ai-autocomplete-react 0.6.8 → 0.7.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 +14 -1
- package/dist/index.d.mts +9 -2
- package/dist/index.d.ts +9 -2
- package/dist/index.js +11 -11
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +11 -11
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -318,6 +318,7 @@ The headless hook for Tier 2 and Tier 3. Accepts the same options as `<AIAutocom
|
|
|
318
318
|
| Field | Type | Description |
|
|
319
319
|
|---|---|---|
|
|
320
320
|
| `completedParams` | `CompletedParamState[]` | Filled parameters. |
|
|
321
|
+
| `skippedParams` | `SkippedParamState[]` | Suggestions the user dismissed with <kbd>→</kbd>. Nothing renders them — pass them to `buildSubmitResult` for a hand-rolled submit. |
|
|
321
322
|
| `suggestionPills` | `Suggestion[]` | Unfilled suggestions (pills). First item is the active pill. |
|
|
322
323
|
| `segments` | `Segment[]` | Input text split into typed text vs completed params — completed segments render as bold `<strong>` runs inside the editor. |
|
|
323
324
|
| `newParamId` | `string \| null` | ID of the most recently added param (for shimmer animation). |
|
|
@@ -380,7 +381,19 @@ The dropdown component for Tier 2. Spread `dropdownProps` from the hook (and add
|
|
|
380
381
|
|---|---|---|
|
|
381
382
|
| `query` | `string` | Plain text as the user sees it. |
|
|
382
383
|
| `raw_query` | `string` | Text with placeholder tokens (e.g. `"Create a {{TASK_1}}"`). |
|
|
383
|
-
| `completed_params` | `CompletedParam[]` | Filled parameter values. |
|
|
384
|
+
| `completed_params` | `CompletedParam[]` | Filled parameter values, followed by any the user skipped (see below). |
|
|
385
|
+
|
|
386
|
+
#### Skipped parameters
|
|
387
|
+
|
|
388
|
+
Pressing <kbd>→</kbd> at the end of the input dismisses the active pill. The dismissal is reported to the server — and included in `completed_params` here — as an entry with no placeholder and the sentinel text `"skipped"`:
|
|
389
|
+
|
|
390
|
+
```ts
|
|
391
|
+
{ placeholder: "", type: "goal", text: "skipped", kind: null }
|
|
392
|
+
```
|
|
393
|
+
|
|
394
|
+
Tier 2 consumers who build their own submit payload get the raw skips from the hook as `skippedParams`, and can fold them in the same way with the exported `buildSubmitResult(text, completedParams, skippedParams)`.
|
|
395
|
+
|
|
396
|
+
> **Reading `skippedParams` directly:** the array is append-only until `reset()`. The "drop a skip whose type got filled" rule is applied when the payload is built, not by pruning the array — so if the user skips `goal` and later fills one, the raw array still holds the `goal` entry. That's deliberate: the filter self-heals if they then delete that param's text, where pruning would discard the signal for good. `buildSubmitResult` applies the rule for you; to apply it elsewhere (say, a "you skipped X" badge), use the exported `withSkippedParams(completedParams, skippedParams)`.
|
|
384
397
|
|
|
385
398
|
---
|
|
386
399
|
|
package/dist/index.d.mts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
+
import { AutocompleteResult, OptionOverrides, APIConfig, AppearanceMode, CompletedParamState, Suggestion, SuggestionOption, SkippedParamState, Segment } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
2
|
+
export { APIConfig, APIKeyConfig, AccessTokenConfig, AccessTokenResult, AppearanceMode, AutocompleteResult, CompletedParam, CompletedParamState, OptionOverrides, Segment, SkippedParamState, Suggestion, SuggestionOption, TaskKind, buildSubmitResult, withSkippedParams } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
1
3
|
import * as react from 'react';
|
|
2
4
|
import { ReactNode, KeyboardEvent, ChangeEvent } from 'react';
|
|
3
|
-
import { AutocompleteResult, OptionOverrides, APIConfig, AppearanceMode, CompletedParamState, Suggestion, SuggestionOption, Segment } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
4
|
-
export { APIConfig, APIKeyConfig, AccessTokenConfig, AccessTokenResult, AppearanceMode, AutocompleteResult, CompletedParam, CompletedParamState, OptionOverrides, Segment, Suggestion, SuggestionOption, TaskKind } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
6
6
|
|
|
7
7
|
interface AIAutocompleteHandle {
|
|
@@ -90,6 +90,13 @@ interface UseAIAutocompleteOptions {
|
|
|
90
90
|
}
|
|
91
91
|
interface UseAIAutocompleteReturn {
|
|
92
92
|
completedParams: CompletedParamState[];
|
|
93
|
+
/**
|
|
94
|
+
* Suggestions the user dismissed with the skip key (→). Not rendered
|
|
95
|
+
* anywhere — pass them to `buildSubmitResult` (or read them for your own
|
|
96
|
+
* telemetry) so a hand-rolled submit carries the same `text: "skipped"`
|
|
97
|
+
* entries the SDK's own requests do.
|
|
98
|
+
*/
|
|
99
|
+
skippedParams: SkippedParamState[];
|
|
93
100
|
suggestionPills: Suggestion[];
|
|
94
101
|
setActivePill: (index: number) => void;
|
|
95
102
|
removeLastParam: () => void;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
+
import { AutocompleteResult, OptionOverrides, APIConfig, AppearanceMode, CompletedParamState, Suggestion, SuggestionOption, SkippedParamState, Segment } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
2
|
+
export { APIConfig, APIKeyConfig, AccessTokenConfig, AccessTokenResult, AppearanceMode, AutocompleteResult, CompletedParam, CompletedParamState, OptionOverrides, Segment, SkippedParamState, Suggestion, SuggestionOption, TaskKind, buildSubmitResult, withSkippedParams } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
1
3
|
import * as react from 'react';
|
|
2
4
|
import { ReactNode, KeyboardEvent, ChangeEvent } from 'react';
|
|
3
|
-
import { AutocompleteResult, OptionOverrides, APIConfig, AppearanceMode, CompletedParamState, Suggestion, SuggestionOption, Segment } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
4
|
-
export { APIConfig, APIKeyConfig, AccessTokenConfig, AccessTokenResult, AppearanceMode, AutocompleteResult, CompletedParam, CompletedParamState, OptionOverrides, Segment, Suggestion, SuggestionOption, TaskKind } from '@magicx-eng/ai-autocomplete-vanilla';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
6
6
|
|
|
7
7
|
interface AIAutocompleteHandle {
|
|
@@ -90,6 +90,13 @@ interface UseAIAutocompleteOptions {
|
|
|
90
90
|
}
|
|
91
91
|
interface UseAIAutocompleteReturn {
|
|
92
92
|
completedParams: CompletedParamState[];
|
|
93
|
+
/**
|
|
94
|
+
* Suggestions the user dismissed with the skip key (→). Not rendered
|
|
95
|
+
* anywhere — pass them to `buildSubmitResult` (or read them for your own
|
|
96
|
+
* telemetry) so a hand-rolled submit carries the same `text: "skipped"`
|
|
97
|
+
* entries the SDK's own requests do.
|
|
98
|
+
*/
|
|
99
|
+
skippedParams: SkippedParamState[];
|
|
93
100
|
suggestionPills: Suggestion[];
|
|
94
101
|
setActivePill: (index: number) => void;
|
|
95
102
|
removeLastParam: () => void;
|
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var Le=Object.defineProperty;var
|
|
1
|
+
"use strict";var Le=Object.defineProperty;var mt=Object.getOwnPropertyDescriptor;var gt=Object.getOwnPropertyNames;var ht=Object.prototype.hasOwnProperty;var ft=(e,t)=>{for(var a in t)Le(e,a,{get:t[a],enumerable:!0})},bt=(e,t,a,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of gt(t))!ht.call(e,i)&&i!==a&&Le(e,i,{get:()=>t[i],enumerable:!(r=mt(t,i))||r.enumerable});return e};var vt=e=>bt(Le({},"__esModule",{value:!0}),e);var Pt={};ft(Pt,{AIAutocomplete:()=>ot,AIAutocompleteDropdown:()=>Pe,buildSubmitResult:()=>Ee.buildSubmitResult,useAIAutocomplete:()=>Ae,withSkippedParams:()=>Ee.withSkippedParams});module.exports=vt(Pt);var Ee=require("@magicx-eng/ai-autocomplete-vanilla");var I=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
|
|
@@ -158,7 +158,7 @@
|
|
|
158
158
|
opacity: 0;
|
|
159
159
|
}
|
|
160
160
|
}
|
|
161
|
-
`,document.head.appendChild(e)}var
|
|
161
|
+
`,document.head.appendChild(e)}var re={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 ce=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
|
|
162
162
|
* Built-in appearance defaults \u2014 zero specificity via :where().
|
|
163
163
|
* Consumer CSS always wins without !important.
|
|
164
164
|
*
|
|
@@ -521,7 +521,7 @@
|
|
|
521
521
|
opacity: 0.25;
|
|
522
522
|
}
|
|
523
523
|
}
|
|
524
|
-
`,document.head.appendChild(e)}var
|
|
524
|
+
`,document.head.appendChild(e)}var le={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 de=require("@magicx-eng/ai-autocomplete-vanilla"),ke=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 {
|
|
525
525
|
.aia-cluster {
|
|
526
526
|
display: flex;
|
|
527
527
|
flex-wrap: wrap;
|
|
@@ -563,7 +563,7 @@
|
|
|
563
563
|
justify-content: space-around;
|
|
564
564
|
}
|
|
565
565
|
}
|
|
566
|
-
`,document.head.appendChild(e)}var ze=require("react/jsx-runtime");function he({gap:e,align:t="center",justify:a="start",noWrap:r=!1,inline:i=!1,className:s,children:u,...m}){let
|
|
566
|
+
`,document.head.appendChild(e)}var ze=require("react/jsx-runtime");function he({gap:e,align:t="center",justify:a="start",noWrap:r=!1,inline:i=!1,className:s,children:u,...m}){let h=e?{"--aia-cluster-gap":e}:void 0,x={className:s?`aia-cluster ${s}`:"aia-cluster","data-align":t,"data-justify":a,"data-nowrap":r||void 0,"data-inline":i||void 0,style:h,...m};return i?(0,ze.jsx)("span",{...x,children:u}):(0,ze.jsx)("div",{...x,children:u})}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
|
|
567
567
|
dropdown's rounded edges. The top inset (--aia-footer-gap) adds breathing
|
|
568
568
|
room above the hint/branding row so the footer doesn't butt against the last
|
|
569
569
|
option row \u2014 additive to the dropdown's 8px section gap. */
|
|
@@ -682,7 +682,7 @@
|
|
|
682
682
|
justify-content: flex-end;
|
|
683
683
|
}
|
|
684
684
|
}
|
|
685
|
-
`,document.head.appendChild(e)}var Y={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
|
|
685
|
+
`,document.head.appendChild(e)}var Y={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 V=require("react/jsx-runtime");function Ge({isOptionHighlighted:e=!1,isInputEmpty:t=!1}){let{key:a,hint:r}=(0,de.getFooterHint)(e,t),[i,s]=(0,ke.useState)(de.ATTRIBUTION_URL);return(0,ke.useEffect)(()=>{s((0,de.buildAttributionUrl)())},[]),(0,V.jsx)("footer",{className:Y.footer,"data-aia-footer":"",children:(0,V.jsxs)(he,{justify:"between",noWrap:!0,className:Y.row,children:[(0,V.jsxs)(he,{gap:"5px",className:Y.hintGroup,children:[(0,V.jsx)("kbd",{className:Y.key,children:a}),(0,V.jsx)("span",{className:Y.hint,children:r})]}),(0,V.jsxs)("a",{className:Y.brandLink,href:i,target:"_blank",rel:"noopener noreferrer",children:[(0,V.jsx)("span",{className:Y.brand,children:"AI"}),(0,V.jsx)("span",{className:Y.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
|
|
686
686
|
with a dashed border. ~28px via 6px padding + 14px text + the 1px border
|
|
687
687
|
(border-box). */
|
|
688
688
|
.ParamPill-module_pill_6Ga7S {
|
|
@@ -734,7 +734,7 @@
|
|
|
734
734
|
opacity: 0;
|
|
735
735
|
}
|
|
736
736
|
}
|
|
737
|
-
`,document.head.appendChild(e)}var oe={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
|
|
737
|
+
`,document.head.appendChild(e)}var oe={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 je=require("react/jsx-runtime"),Fe={selected:1,first:.7,next:.4,last:.2};function Ue({label:e,state:t,rounded:a,loading:r,onClick:i}){let s=[oe.pill,a?oe.rounded:"",r?oe.skeleton:""].filter(Boolean).join(" ");return(0,je.jsx)("button",{type:"button","data-aia-pill":"","data-aia-loading":r?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:s,style:{opacity:Fe[t]},onMouseDown:u=>u.preventDefault(),onClick:r?void 0:i,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 {
|
|
738
738
|
position: relative;
|
|
739
739
|
z-index: 1;
|
|
740
740
|
pointer-events: auto;
|
|
@@ -744,7 +744,7 @@
|
|
|
744
744
|
align-items: center;
|
|
745
745
|
vertical-align: middle;
|
|
746
746
|
}
|
|
747
|
-
`,document.head.appendChild(e)}var Be={list:"PillList-module_list_qvLqO"};var fe=require("react/jsx-runtime"),
|
|
747
|
+
`,document.head.appendChild(e)}var Be={list:"PillList-module_list_qvLqO"};var fe=require("react/jsx-runtime"),xt=[125,69];function Ve(e){return e===0?"first":e===1?"next":"last"}function _e({pills:e,activePillIndex:t,onSelectPill:a,activeSelected:r,rounded:i,loading:s}){return s&&e.length===0?(0,fe.jsx)("span",{className:Be.list,"data-aia-pill-list-loading":"",children:xt.map((u,m)=>(0,fe.jsx)("span",{"data-aia-pill-skeleton":"",className:`${oe.pill} ${i?oe.rounded:""} ${oe.skeleton}`,style:{width:u,opacity:Fe[Ve(m)]}},`skel-${u}`))}):(0,fe.jsx)("span",{className:Be.list,"data-aia-pill-list-loading":s?"":void 0,children:e.map((u,m)=>{let h=!!r&&m===t;return(0,fe.jsx)(Ue,{label:u.text,state:h?"selected":Ve(m),selected:h,rounded:i,loading:s,onClick:()=>a(m)},`${u.type}-${u.text}`)})})}var Ie=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 {
|
|
748
748
|
.aia-grid {
|
|
749
749
|
display: grid;
|
|
750
750
|
grid-template-columns: repeat(
|
|
@@ -779,7 +779,7 @@
|
|
|
779
779
|
border-radius: 3px;
|
|
780
780
|
}
|
|
781
781
|
}
|
|
782
|
-
`,document.head.appendChild(e)}var
|
|
782
|
+
`,document.head.appendChild(e)}var qe=require("react/jsx-runtime");function $e({min:e="16rem",max:t,gap:a,scroll:r=!1,maxHeight:i,scrollResetKey:s,className:u,children:m,...h}){let x=(0,Ie.useRef)(null);(0,Ie.useLayoutEffect)(()=>{if(s===void 0)return;let P=x.current;P&&(P.scrollTop=0)},[s]);let S={"--aia-grid-min":e};return t&&(S["--aia-grid-max"]=t),a&&(S["--aia-grid-gap"]=a),i&&(S["--aia-grid-max-height"]=i),(0,qe.jsx)("div",{ref:x,className:u?`aia-grid ${u}`:"aia-grid","data-scroll":r||void 0,style:S,...h,children:m})}var pe=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 {
|
|
783
783
|
position: relative;
|
|
784
784
|
overflow: visible;
|
|
785
785
|
display: flex;
|
|
@@ -1129,7 +1129,7 @@
|
|
|
1129
1129
|
filter: brightness(0.55);
|
|
1130
1130
|
}
|
|
1131
1131
|
}
|
|
1132
|
-
`,document.head.appendChild(e)}var
|
|
1132
|
+
`,document.head.appendChild(e)}var N={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 ie=require("react/jsx-runtime");function Qe({option:e,isHighlighted:t,onSelect:a,onHighlight:r,id:i,loading:s}){let[u,m]=(0,pe.useState)(!1),h=(0,pe.useRef)(void 0);(0,pe.useEffect)(()=>()=>clearTimeout(h.current),[]);let x=()=>{s||!e.is_tappable||u||(m(!0),a(e),clearTimeout(h.current),h.current=setTimeout(()=>m(!1),500))},S=[N.item,t&&!s?N.highlighted:"",e.is_tappable?N.tappable:N.nonTappable,u?N.pressed:""].filter(Boolean).join(" ");return(0,ie.jsxs)("div",{id:i,role:"option","data-aia-option":"","data-aia-loading":s?"":void 0,"aria-selected":t,className:S,tabIndex:s||!e.is_tappable?-1:0,onClick:x,onKeyDown:P=>{!s&&e.is_tappable&&(P.key==="Enter"||P.key===" ")&&(P.preventDefault(),x())},onMouseEnter:!s&&e.is_tappable?r:void 0,children:[(0,ie.jsx)("div",{className:N.streaks}),(0,ie.jsx)("div",{className:N.streaksVert}),(0,ie.jsxs)("span",{className:N.content,children:[(0,ie.jsx)("span",{className:N.text,children:e.icon?`${e.icon} ${e.text}`:e.text}),e.tag&&(0,ie.jsx)("span",{className:N.tag,children:e.tag})]})]})}var Me=require("react/jsx-runtime");function Ze({options:e,activeIndex:t,onSelect:a,onHighlight:r,listboxId:i,loading:s,groupKey:u}){return(0,Me.jsx)($e,{min:"250px",max:"1fr",gap:"0",scroll:!0,scrollResetKey:u,children:e.map((m,h)=>(0,Me.jsx)(Qe,{option:m,isHighlighted:h===t,onSelect:a,onHighlight:()=>r(h),id:`${i}-option-${h}`,loading:s},m.text))})}if(typeof document<"u"&&!document.getElementById("ac-style-8414cd5f")){let e=document.createElement("style");e.id="ac-style-8414cd5f",e.textContent=`@layer layout {
|
|
1133
1133
|
.aia-stack {
|
|
1134
1134
|
display: flex;
|
|
1135
1135
|
flex-direction: column;
|
|
@@ -1146,7 +1146,7 @@
|
|
|
1146
1146
|
}
|
|
1147
1147
|
/* data-align="stretch" is the flex default \u2014 no rule needed. */
|
|
1148
1148
|
}
|
|
1149
|
-
`,document.head.appendChild(e)}var
|
|
1149
|
+
`,document.head.appendChild(e)}var Je=require("react/jsx-runtime");function Xe({space:e,align:t="stretch",className:a,children:r,...i}){let s=e?{"--aia-stack-space":e}:void 0;return(0,Je.jsx)("div",{className:a?`aia-stack ${a}`:"aia-stack","data-align":t,style:s,...i,children:r})}var $=require("react/jsx-runtime"),wt=[159,119,164];function yt(e){let t=()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-color-scheme: dark)").matches,[a,r]=(0,ce.useState)(t);if((0,ce.useEffect)(()=>{if(e!=="auto"||typeof window>"u"||typeof window.matchMedia!="function")return;let i=window.matchMedia("(prefers-color-scheme: dark)"),s=()=>r(i.matches);return i.addEventListener("change",s),()=>i.removeEventListener("change",s)},[e]),e!==void 0)return e==="auto"?a?"dark":"light":e}function Pe({suggestions:e,activeIndex:t,onSelect:a,onHighlight:r,isOpen:i,id:s,className:u,pills:m,onPillClick:h,showPills:x=!0,activeSelected:S=!1,isLoading:P=!1,isInputEmpty:D=!1,optionsPosition:T="below",mode:q}){let W=yt(q),ee=W!==void 0,Q=e[0]?.options??[],l=!!(m&&m.length>0&&h),w=i&&(Q.length>0||x&&l||P),F={suggestions:e,activeIndex:t,pills:m,showPills:x,activeSelected:S,isLoading:P,isInputEmpty:D},G=(0,ce.useRef)(F);w&&(G.current=F);let v=w?F:G.current,B=v.suggestions[0],M=B?.options??[],E=v.activeIndex>=0&&!!M[v.activeIndex]?.is_tappable,U=!!(v.pills&&v.pills.length>0&&h),L=v.showPills&&U,te=v.showPills&&!U&&v.isLoading,Z=L||te,H=M.length>0,j=v.isLoading&&!H;return(0,$.jsx)("div",{id:s,role:"listbox","data-aia-dropdown":"","data-options-position":T,"data-mode":W,"data-aia-loading":v.isLoading?"":void 0,className:`${ee?"magicx-aia ":""}${le.dropdown} ${w?le.visible:""} ${u??""}`,onMouseDown:f=>f.preventDefault(),children:(0,$.jsxs)(Xe,{space:"8px",children:[Z&&(0,$.jsx)(he,{noWrap:!0,className:le.pillBar,"data-aia-pillbar":"",children:(0,$.jsx)(_e,{pills:v.pills??[],activePillIndex:0,activeSelected:v.activeSelected,onSelectPill:h??(()=>{}),rounded:!0,loading:v.isLoading})}),H&&(0,$.jsx)(Ze,{options:M,activeIndex:v.activeIndex,onSelect:a,onHighlight:r,listboxId:s,loading:v.isLoading,groupKey:B?`${B.type} ${B.text}`:""}),j&&(0,$.jsx)("div",{className:le.skeletonBars,"data-aia-skeleton-bars":"",children:wt.map(f=>(0,$.jsx)("span",{className:le.skeletonBar,style:{width:f}},`bar-${f}`))}),(0,$.jsx)(Ge,{isOptionHighlighted:E,isInputEmpty:v.isInputEmpty})]})})}var ue=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 {
|
|
1150
1150
|
flex-shrink: 0;
|
|
1151
1151
|
width: 32px;
|
|
1152
1152
|
height: 32px;
|
|
@@ -1181,5 +1181,5 @@
|
|
|
1181
1181
|
);
|
|
1182
1182
|
cursor: default;
|
|
1183
1183
|
}
|
|
1184
|
-
`,document.head.appendChild(e)}var Je={submitButton:"SubmitButton-module_submitButton_otz7H"};var Ae=require("react/jsx-runtime");function Ye({disabled:e,onClick:t}){return(0,Ae.jsx)("button",{type:"button","data-aia-submit":"",className:Je.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),t()},"aria-label":"Submit",children:(0,Ae.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,Ae.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var et=require("@magicx-eng/ai-autocomplete-vanilla"),k=require("react"),wt={text:"",completedParams:[],identifiedParams:[],pendingSpan:null,suggestions:[],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 Ce({onSubmit:e,onError:t,optionOverrides:a,maskCompletedText:r,apiConfig:i,columns:s=2,dropdownTrigger:u,optionsPosition:m,closeDropdownOnBlur:g,showNonTappableOptions:w,onFocus:S,onBlur:P,value:D,completedParams:T,onChange:Q,onParamsChange:G,source:ee,setCursor:Z}){let l=(0,k.useRef)(null),[y,F]=(0,k.useState)(null),U=(0,k.useRef)(e);U.current=e;let b=(0,k.useRef)(t);b.current=t;let B=(0,k.useRef)(Q);B.current=Q;let M=(0,k.useRef)(G);M.current=G;let E=(0,k.useRef)(S);E.current=S;let j=(0,k.useRef)(P);j.current=P;let L=(0,k.useRef)(Z);L.current=Z,(0,k.useEffect)(()=>{if(typeof document>"u")return;let n=new et.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:i,optionOverrides:a,maskCompletedText:r,columns:s,dropdownTrigger:u,optionsPosition:m,closeDropdownOnBlur:g,showNonTappableOptions:w,source:ee,value:D,completedParams:T,onSubmit:(...A)=>U.current?.(...A),onError:(...A)=>b.current?.(...A),onChange:(...A)=>B.current?.(...A),onParamsChange:(...A)=>M.current?.(...A),onFocus:()=>E.current?.(),onBlur:()=>j.current?.(),setCursor:A=>L.current?.(A)});l.current=n,F(n.getState());let C=n.subscribe(A=>F(A));return()=>{C(),n.destroy(),l.current===n&&(l.current=null)}},[]),(0,k.useEffect)(()=>{D!==void 0&&l.current?.setValue(D)},[D]),(0,k.useEffect)(()=>{T!==void 0&&l.current?.setCompletedParams(T)},[T]);let te=JSON.stringify(i??null),X=(0,k.useRef)(a),O=(0,k.useRef)(0);if(a!==X.current){let n=X.current,C=a,A=Object.keys(n??{}),le=Object.keys(C??{});(A.length!==le.length||le.some(ge=>!n?.[ge]||C[ge]!==n[ge]))&&O.current++,X.current=a}(0,k.useEffect)(()=>{l.current?.update({apiConfig:i,optionOverrides:a,dropdownTrigger:u,optionsPosition:m,closeDropdownOnBlur:g,showNonTappableOptions:w})},[te,O.current,u,m,g,w]);let H=(0,k.useRef)(null);H.current===null&&(H.current={handleTextChange:n=>l.current?.handleTextChange(n),handleKeyDown:n=>{let C="nativeEvent"in n?n.nativeEvent:n;l.current?.handleKeyDown(C)},setFocused:n=>l.current?.setFocused(n),startEditingParam:n=>l.current?.startEditingParam(n),exitEditMode:()=>l.current?.exitEditMode(),handleCaretAfterInput:n=>l.current?.handleCaretAfterInput(n),handleCaretMove:n=>l.current?.handleCaretMove(n),replaceEditingRange:n=>l.current?.replaceEditingRange(n)??!1,setActivePill:n=>l.current?.setActivePill(n),removeLastParam:()=>l.current?.removeLastParam(),clearNewParamId:()=>l.current?.clearNewParamId(),reset:()=>l.current?.reset(),selectOption:n=>l.current?.selectOption(n),setActiveDropdownIndex:n=>l.current?.setActiveDropdownIndex(n),handleFocus:()=>l.current?.setFocused(!0),handleBlur:()=>l.current?.setFocused(!1)});let v=H.current,ne=(0,k.useCallback)(n=>{let C=n.target.value,le=C.length>0&&!n.nativeEvent?.isComposing&&C[0]!==C[0].toUpperCase()?C[0].toUpperCase()+C.slice(1):C;l.current?.handleTextChange(le)},[]),re=(0,k.useCallback)(n=>{l.current?.handleKeyDown(n.nativeEvent)},[]),ae=l.current,p=y??wt,o=D!==void 0?D:p.text,d=T!==void 0?T:p.completedParams,c=p.actionableSuggestions,x=c[0],h=ae?.listboxId??"",R=p.activeDropdownIndex>=0&&ae?`${h}-option-${p.activeDropdownIndex}`:void 0,N=p.editingParam,J=N?{type:N.suggestionType,text:N.suggestionPlaceholder,required:!0,options:N.options}:null,be=J??x,Re=J?[J]:c,ve=!ae||p.isLoading&&!p.editingParam&&!p.inSelectionAnimation;return{completedParams:d,suggestionPills:c,setActivePill:v.setActivePill,removeLastParam:v.removeLastParam,segments:p.segments,newParamId:p.newParamId,clearNewParamId:v.clearNewParamId,suggestions:p.suggestions,activeIndex:p.activeDropdownIndex,isReady:p.isReady,isLoading:ve,isFocused:p.isFocused,isDropdownOpen:p.isDropdownOpen,isActivePillSelected:p.isActivePillSelected,placeholderText:p.placeholderText,listboxId:h,error:p.error,handleTextChange:v.handleTextChange,handleKeyDown:v.handleKeyDown,setFocused:v.setFocused,editingParam:N,editingAnchor:p.editingAnchor,caretOffset:p.caretOffset,startEditingParam:v.startEditingParam,exitEditMode:v.exitEditMode,handleCaretAfterInput:v.handleCaretAfterInput,handleCaretMove:v.handleCaretMove,replaceEditingRange:v.replaceEditingRange,inputProps:{value:o,placeholder:p.placeholderText||void 0,onChange:ne,onKeyDown:re,onFocus:v.handleFocus,onBlur:v.handleBlur,role:"combobox","aria-expanded":p.isDropdownOpen,"aria-activedescendant":R,"aria-autocomplete":"list","aria-controls":h},reset:v.reset,dropdownProps:{suggestions:be?[{...be,options:p.filteredOptions}]:[],activeIndex:p.activeDropdownIndex,onSelect:v.selectOption,onHighlight:v.setActiveDropdownIndex,isOpen:p.isDropdownOpen,id:h,pills:Re,activeSelected:p.isActivePillSelected,onPillClick:v.setActivePill,isLoading:ve,isInputEmpty:o.trim().length===0,optionsPosition:m??"below"}}}var z=require("@magicx-eng/ai-autocomplete-vanilla"),f=require("react"),Ee;function yt(){if(Ee!==void 0)return Ee;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Ee=e.contentEditable==="plaintext-only",Ee}function tt(e){let{segments:t,newParamId:a,editingParam:r,editingAnchor:i,caretOffset:s,placeholderText:u,isFocused:m,isDropdownOpen:g,listboxId:w,activeDescendantId:S,autoFocus:P,handleTextChange:D,handleKeyDown:T,handleCaretAfterInput:Q,handleCaretMove:G,startEditingParam:ee,replaceEditingRange:Z,setFocused:l}=e,y=(0,f.useRef)(null),F=(0,f.useRef)(!1),U=(0,f.useRef)(""),b=(0,f.useRef)(""),B=(0,f.useRef)(null),M=(0,f.useRef)(0);B.current=s,(0,f.useEffect)(()=>{if(!P)return;let o=y.current;if(!o)return;document.activeElement===o?l(!0):o.focus();let d=o.ownerDocument??document,c=d.getSelection(),x=c&&c.rangeCount>0&&o.contains(c.anchorNode);if(c&&!x){let h=d.createRange();h.selectNodeContents(o),h.collapse(!0),c.removeAllRanges(),c.addRange(h)}},[P,l]),(0,f.useEffect)(()=>{let o=y.current;if(!o)return;let d=o.ownerDocument??document,c=()=>{let x=d.getSelection();if(!x||x.rangeCount===0||!x.anchorNode||!o.contains(x.anchorNode))return;let h=x.anchorNode,J=(h.nodeType===Node.ELEMENT_NODE?h:h.parentElement)?.closest('strong[data-seg="completed"][data-param-id]')?.dataset.paramId??null;if(J&&J!==r?.id){ee(J);return}performance.now()-M.current<50||G((0,z.getCursorOffset)(o))};return d.addEventListener("selectionchange",c),()=>d.removeEventListener("selectionchange",c)},[r,ee,G]),(0,f.useLayoutEffect)(()=>{let o=y.current;o&&(0,z.renderEditableContent)({input:o,segments:t,newParamId:a,editingParamId:r?.id??null,placeholderText:u??"",isFocused:m})},[t,a,r,u,m]),(0,f.useLayoutEffect)(()=>{let o=U.current,d=a??"";if(U.current=d,!d||d===o)return;let c=y.current;if(!c)return;c.focus();let x=B.current??(0,z.plainTextLength)(c);(0,z.setCursorOffset)(c,x)},[a]),(0,f.useLayoutEffect)(()=>{let o=b.current,d=r?.id??"";if(b.current=d,!d||d===o||i==null)return;let c=y.current;c&&(0,z.setCursorOffset)(c,i)},[r,i]);let E=(0,f.useCallback)(()=>{if(F.current)return;let o=y.current;if(!o)return;let d=(0,z.extractPlainText)(o),x=d.length>0&&d[0]!==d[0].toUpperCase()?d[0].toUpperCase()+d.slice(1):d;D(x)},[D]),j=(0,f.useCallback)(()=>{M.current=performance.now(),E();let o=y.current;o&&Q((0,z.getCursorOffset)(o))},[E,Q]);(0,f.useEffect)(()=>{let o=y.current;if(!o)return;let d=c=>{let x=c,h=x.inputType;if(h==="insertParagraph"||h==="insertLineBreak"||h==="insertFromDrop"){c.preventDefault();return}if(h.startsWith("insert")||h.startsWith("delete")){let R=h.startsWith("delete")?"":x.data??"";Z(R)&&c.preventDefault()}};return o.addEventListener("beforeinput",d),()=>o.removeEventListener("beforeinput",d)},[Z]);let L=(0,f.useCallback)(()=>{F.current=!0},[]),te=(0,f.useCallback)(()=>{F.current=!1,E()},[E]),X=(0,f.useCallback)(o=>{o.preventDefault();let d=y.current;if(!d)return;let c=(o.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!c)return;let x=d.ownerDocument??document,h=x.getSelection();if(!h||h.rangeCount===0)return;let R=h.getRangeAt(0);if(!d.contains(R.startContainer))return;R.deleteContents();let N=x.createTextNode(c);R.insertNode(N),R.setStartAfter(N),R.collapse(!0),h.removeAllRanges(),h.addRange(R),E()},[E]),O=(0,f.useCallback)(o=>T(o),[T]),H=(0,f.useCallback)(()=>l(!0),[l]),v=(0,f.useCallback)(()=>l(!1),[l]),ne=(0,f.useCallback)(()=>y.current?.focus(),[]),re=(0,f.useCallback)(()=>y.current?.blur(),[]),ae=(0,f.useCallback)(()=>{let o=y.current;return o?(0,z.extractPlainText)(o):""},[]),p=yt()?"plaintext-only":"true";return{inputRef:y,editorProps:{ref:y,contentEditable:p,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":w,"aria-expanded":g,"aria-activedescendant":S,spellCheck:!0,enterKeyHint:"send",onInput:j,onKeyDown:O,onCompositionStart:L,onCompositionEnd:te,onPaste:X,onFocus:H,onBlur:v},getPlainText:ae,focus:ne,blur:re}}var W=require("react/jsx-runtime");function _t(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var at=(0,I.forwardRef)(function({onSubmit:t,onError:a,optionOverrides:r,maskCompletedText:i,className:s,apiConfig:u,columns:m,pillPlacement:g="dropdown",mode:w="auto",optionsPosition:S="below",animations:P=!0,dropdownTrigger:D,closeDropdownOnBlur:T,showNonTappableOptions:Q,autoFocus:G=!0,onFocus:ee,onBlur:Z,value:l,completedParams:y,onChange:F,onParamsChange:U,submitButton:b},B){let M=(0,I.useRef)(null),E=(0,I.useRef)(null),j=(0,I.useRef)(()=>{}),L=(0,I.useRef)(null),te=(0,I.useRef)(null);(0,I.useEffect)(()=>{let _=M.current;if(_)return L.current?L.current.setMode(w):L.current=new me.ModeController(_,w),()=>{L.current?.destroy(),L.current=null}},[w]);let X=(0,I.useCallback)(_=>{let V=te.current?.current;V&&(V.focus(),(0,me.setCursorOffset)(V,_))},[]),{completedParams:O,suggestionPills:H,setActivePill:v,segments:ne,newParamId:re,clearNewParamId:ae,placeholderText:p,isFocused:o,isDropdownOpen:d,isActivePillSelected:c,isLoading:x,activeIndex:h,listboxId:R,handleTextChange:N,handleKeyDown:J,setFocused:be,editingParam:Re,editingAnchor:ve,caretOffset:n,startEditingParam:C,handleCaretAfterInput:A,handleCaretMove:le,replaceEditingRange:ge,dropdownProps:ot,reset:xe}=Ce({onSubmit:_=>j.current(_),onError:a,optionOverrides:r,maskCompletedText:i,apiConfig:u,columns:m,dropdownTrigger:D,optionsPosition:S,closeDropdownOnBlur:T,showNonTappableOptions:Q,onFocus:ee,onBlur:Z,value:l,completedParams:y,onChange:F,onParamsChange:U,source:"full-sdk",setCursor:X});(0,I.useEffect)(()=>{if(!re)return;let _=window.setTimeout(()=>ae(),650);return()=>window.clearTimeout(_)},[re,ae]);let it=h>=0?`${R}-option-${h}`:void 0,{inputRef:De,editorProps:nt,focus:we,blur:Oe,getPlainText:He}=tt({segments:ne,newParamId:re,editingParam:Re,editingAnchor:ve,caretOffset:n,placeholderText:p,isFocused:o,isDropdownOpen:d,listboxId:R,activeDescendantId:it,autoFocus:G,handleTextChange:N,handleKeyDown:J,handleCaretAfterInput:A,handleCaretMove:le,startEditingParam:C,replaceEditingRange:ge,setFocused:be});te.current=De,(0,I.useLayoutEffect)(()=>{let _=E.current,V=De.current;if(!_||!V)return;let _e=()=>{let Ke=_.firstElementChild;if(!Ke)return;let dt=Ke.getBoundingClientRect(),pt=V.getBoundingClientRect();dt.top>=pt.bottom-2?_.setAttribute("data-aia-pill-wrapped",""):_.removeAttribute("data-aia-pill-wrapped")};_e();let Ne=new ResizeObserver(_e);return Ne.observe(V),()=>Ne.disconnect()},[ne,H.length,x,De]),(0,I.useImperativeHandle)(B,()=>({focus:we,blur:Oe,reset:xe,setMode:_=>L.current?.setMode(_)}),[we,Oe,xe]);let ye=!!ne.length||O.length>0,Te=(0,I.useCallback)(()=>{if(!ye)return;let _=He(),{rawQuery:V,completedParams:_e}=(0,me.buildQuery)(_,O);t({query:_.trim(),raw_query:V,completed_params:_e}),xe()},[ye,O,t,xe,He]);j.current=Te;let rt=(0,I.useCallback)(_=>{_.target?.closest("[data-aia-pill]")||we()},[we]),st=g==="inline",lt=g==="dropdown";return(0,W.jsxs)("div",{ref:M,className:`magicx-aia ${se.container} ${s??""}`,"data-pill-placement":g,"data-options-position":S,"data-animations":P?"on":"off","data-mode":_t(w),children:[(0,W.jsx)(Se,{...ot,showPills:lt}),(0,W.jsxs)("div",{className:se.inputWrapper,onClick:rt,children:[(0,W.jsxs)("div",{className:se.editorArea,"data-aia-editor":"",children:[(0,W.jsx)("div",{...nt,className:se.input,"data-aia-input":""}),st&&(x||H.length>0)&&(0,W.jsx)("span",{ref:E,className:se.pillListContainer,"data-aia-pill-list-container":"",children:(0,W.jsx)(Ie,{pills:H,activePillIndex:0,activeSelected:c,onSelectPill:v,loading:x})})]}),b===null?null:b===void 0?(0,W.jsx)(Ye,{disabled:!ye,onClick:Te}):(0,W.jsx)("span",{"data-aia-submit":"",className:se.submitSlot,onClick:_=>{ye&&(_.stopPropagation(),Te())},children:b})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,useAIAutocomplete});
|
|
1184
|
+
`,document.head.appendChild(e)}var Ye={submitButton:"SubmitButton-module_submitButton_otz7H"};var Se=require("react/jsx-runtime");function et({disabled:e,onClick:t}){return(0,Se.jsx)("button",{type:"button","data-aia-submit":"",className:Ye.submitButton,disabled:e,onClick:a=>{a.stopPropagation(),t()},"aria-label":"Submit",children:(0,Se.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,Se.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})}var tt=require("@magicx-eng/ai-autocomplete-vanilla"),y=require("react"),kt={text:"",completedParams:[],identifiedParams:[],skippedParams:[],pendingSpan:null,suggestions:[],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 Ae({onSubmit:e,onError:t,optionOverrides:a,maskCompletedText:r,apiConfig:i,columns:s=2,dropdownTrigger:u,optionsPosition:m,closeDropdownOnBlur:h,showNonTappableOptions:x,onFocus:S,onBlur:P,value:D,completedParams:T,onChange:q,onParamsChange:W,source:ee,setCursor:Q}){let l=(0,y.useRef)(null),[w,F]=(0,y.useState)(null),G=(0,y.useRef)(e);G.current=e;let v=(0,y.useRef)(t);v.current=t;let B=(0,y.useRef)(q);B.current=q;let M=(0,y.useRef)(W);M.current=W;let E=(0,y.useRef)(S);E.current=S;let U=(0,y.useRef)(P);U.current=P;let L=(0,y.useRef)(Q);L.current=Q,(0,y.useEffect)(()=>{if(typeof document>"u")return;let n=new tt.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:i,optionOverrides:a,maskCompletedText:r,columns:s,dropdownTrigger:u,optionsPosition:m,closeDropdownOnBlur:h,showNonTappableOptions:x,source:ee,value:D,completedParams:T,onSubmit:(...A)=>G.current?.(...A),onError:(...A)=>v.current?.(...A),onChange:(...A)=>B.current?.(...A),onParamsChange:(...A)=>M.current?.(...A),onFocus:()=>E.current?.(),onBlur:()=>U.current?.(),setCursor:A=>L.current?.(A)});l.current=n,F(n.getState());let C=n.subscribe(A=>F(A));return()=>{C(),n.destroy(),l.current===n&&(l.current=null)}},[]),(0,y.useEffect)(()=>{D!==void 0&&l.current?.setValue(D)},[D]),(0,y.useEffect)(()=>{T!==void 0&&l.current?.setCompletedParams(T)},[T]);let te=JSON.stringify(i??null),Z=(0,y.useRef)(a),H=(0,y.useRef)(0);if(a!==Z.current){let n=Z.current,C=a,A=Object.keys(n??{}),se=Object.keys(C??{});(A.length!==se.length||se.some(ge=>!n?.[ge]||C[ge]!==n[ge]))&&H.current++,Z.current=a}(0,y.useEffect)(()=>{l.current?.update({apiConfig:i,optionOverrides:a,dropdownTrigger:u,optionsPosition:m,closeDropdownOnBlur:h,showNonTappableOptions:x})},[te,H.current,u,m,h,x]);let j=(0,y.useRef)(null);j.current===null&&(j.current={handleTextChange:n=>l.current?.handleTextChange(n),handleKeyDown:n=>{let C="nativeEvent"in n?n.nativeEvent:n;l.current?.handleKeyDown(C)},setFocused:n=>l.current?.setFocused(n),startEditingParam:n=>l.current?.startEditingParam(n),exitEditMode:()=>l.current?.exitEditMode(),handleCaretAfterInput:n=>l.current?.handleCaretAfterInput(n),handleCaretMove:n=>l.current?.handleCaretMove(n),replaceEditingRange:n=>l.current?.replaceEditingRange(n)??!1,setActivePill:n=>l.current?.setActivePill(n),removeLastParam:()=>l.current?.removeLastParam(),clearNewParamId:()=>l.current?.clearNewParamId(),reset:()=>l.current?.reset(),selectOption:n=>l.current?.selectOption(n),setActiveDropdownIndex:n=>l.current?.setActiveDropdownIndex(n),handleFocus:()=>l.current?.setFocused(!0),handleBlur:()=>l.current?.setFocused(!1)});let f=j.current,me=(0,y.useCallback)(n=>{let C=n.target.value,se=C.length>0&&!n.nativeEvent?.isComposing&&C[0]!==C[0].toUpperCase()?C[0].toUpperCase()+C.slice(1):C;l.current?.handleTextChange(se)},[]),ne=(0,y.useCallback)(n=>{l.current?.handleKeyDown(n.nativeEvent)},[]),X=l.current,d=w??kt,o=D!==void 0?D:d.text,p=T!==void 0?T:d.completedParams,c=d.actionableSuggestions,k=c[0],g=X?.listboxId??"",R=d.activeDropdownIndex>=0&&X?`${g}-option-${d.activeDropdownIndex}`:void 0,O=d.editingParam,J=O?{type:O.suggestionType,text:O.suggestionPlaceholder,required:!0,options:O.options}:null,be=J??k,Re=J?[J]:c,ve=!X||d.isLoading&&!d.editingParam&&!d.inSelectionAnimation;return{completedParams:p,skippedParams:d.skippedParams,suggestionPills:c,setActivePill:f.setActivePill,removeLastParam:f.removeLastParam,segments:d.segments,newParamId:d.newParamId,clearNewParamId:f.clearNewParamId,suggestions:d.suggestions,activeIndex:d.activeDropdownIndex,isReady:d.isReady,isLoading:ve,isFocused:d.isFocused,isDropdownOpen:d.isDropdownOpen,isActivePillSelected:d.isActivePillSelected,placeholderText:d.placeholderText,listboxId:g,error:d.error,handleTextChange:f.handleTextChange,handleKeyDown:f.handleKeyDown,setFocused:f.setFocused,editingParam:O,editingAnchor:d.editingAnchor,caretOffset:d.caretOffset,startEditingParam:f.startEditingParam,exitEditMode:f.exitEditMode,handleCaretAfterInput:f.handleCaretAfterInput,handleCaretMove:f.handleCaretMove,replaceEditingRange:f.replaceEditingRange,inputProps:{value:o,placeholder:d.placeholderText||void 0,onChange:me,onKeyDown:ne,onFocus:f.handleFocus,onBlur:f.handleBlur,role:"combobox","aria-expanded":d.isDropdownOpen,"aria-activedescendant":R,"aria-autocomplete":"list","aria-controls":g},reset:f.reset,dropdownProps:{suggestions:be?[{...be,options:d.filteredOptions}]:[],activeIndex:d.activeDropdownIndex,onSelect:f.selectOption,onHighlight:f.setActiveDropdownIndex,isOpen:d.isDropdownOpen,id:g,pills:Re,activeSelected:d.isActivePillSelected,onPillClick:f.setActivePill,isLoading:ve,isInputEmpty:o.trim().length===0,optionsPosition:m??"below"}}}var z=require("@magicx-eng/ai-autocomplete-vanilla"),b=require("react"),Ce;function _t(){if(Ce!==void 0)return Ce;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Ce=e.contentEditable==="plaintext-only",Ce}function at(e){let{segments:t,newParamId:a,editingParam:r,editingAnchor:i,caretOffset:s,placeholderText:u,isFocused:m,isDropdownOpen:h,listboxId:x,activeDescendantId:S,autoFocus:P,handleTextChange:D,handleKeyDown:T,handleCaretAfterInput:q,handleCaretMove:W,startEditingParam:ee,replaceEditingRange:Q,setFocused:l}=e,w=(0,b.useRef)(null),F=(0,b.useRef)(!1),G=(0,b.useRef)(""),v=(0,b.useRef)(""),B=(0,b.useRef)(null),M=(0,b.useRef)(0);B.current=s,(0,b.useEffect)(()=>{if(!P)return;let o=w.current;if(!o)return;document.activeElement===o?l(!0):o.focus();let p=o.ownerDocument??document,c=p.getSelection(),k=c&&c.rangeCount>0&&o.contains(c.anchorNode);if(c&&!k){let g=p.createRange();g.selectNodeContents(o),g.collapse(!0),c.removeAllRanges(),c.addRange(g)}},[P,l]),(0,b.useEffect)(()=>{let o=w.current;if(!o)return;let p=o.ownerDocument??document,c=()=>{let k=p.getSelection();if(!k||k.rangeCount===0||!k.anchorNode||!o.contains(k.anchorNode))return;let g=k.anchorNode,J=(g.nodeType===Node.ELEMENT_NODE?g:g.parentElement)?.closest('strong[data-seg="completed"][data-param-id]')?.dataset.paramId??null;if(J&&J!==r?.id){ee(J);return}performance.now()-M.current<50||W((0,z.getCursorOffset)(o))};return p.addEventListener("selectionchange",c),()=>p.removeEventListener("selectionchange",c)},[r,ee,W]),(0,b.useLayoutEffect)(()=>{let o=w.current;o&&(0,z.renderEditableContent)({input:o,segments:t,newParamId:a,editingParamId:r?.id??null,placeholderText:u??"",isFocused:m})},[t,a,r,u,m]),(0,b.useLayoutEffect)(()=>{let o=G.current,p=a??"";if(G.current=p,!p||p===o)return;let c=w.current;if(!c)return;c.focus();let k=B.current??(0,z.plainTextLength)(c);(0,z.setCursorOffset)(c,k)},[a]),(0,b.useLayoutEffect)(()=>{let o=v.current,p=r?.id??"";if(v.current=p,!p||p===o||i==null)return;let c=w.current;c&&(0,z.setCursorOffset)(c,i)},[r,i]);let E=(0,b.useCallback)(()=>{if(F.current)return;let o=w.current;if(!o)return;let p=(0,z.extractPlainText)(o),k=p.length>0&&p[0]!==p[0].toUpperCase()?p[0].toUpperCase()+p.slice(1):p;D(k)},[D]),U=(0,b.useCallback)(()=>{M.current=performance.now(),E();let o=w.current;o&&q((0,z.getCursorOffset)(o))},[E,q]);(0,b.useEffect)(()=>{let o=w.current;if(!o)return;let p=c=>{let k=c,g=k.inputType;if(g==="insertParagraph"||g==="insertLineBreak"||g==="insertFromDrop"){c.preventDefault();return}if(g.startsWith("insert")||g.startsWith("delete")){let R=g.startsWith("delete")?"":k.data??"";Q(R)&&c.preventDefault()}};return o.addEventListener("beforeinput",p),()=>o.removeEventListener("beforeinput",p)},[Q]);let L=(0,b.useCallback)(()=>{F.current=!0},[]),te=(0,b.useCallback)(()=>{F.current=!1,E()},[E]),Z=(0,b.useCallback)(o=>{o.preventDefault();let p=w.current;if(!p)return;let c=(o.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!c)return;let k=p.ownerDocument??document,g=k.getSelection();if(!g||g.rangeCount===0)return;let R=g.getRangeAt(0);if(!p.contains(R.startContainer))return;R.deleteContents();let O=k.createTextNode(c);R.insertNode(O),R.setStartAfter(O),R.collapse(!0),g.removeAllRanges(),g.addRange(R),E()},[E]),H=(0,b.useCallback)(o=>T(o),[T]),j=(0,b.useCallback)(()=>l(!0),[l]),f=(0,b.useCallback)(()=>l(!1),[l]),me=(0,b.useCallback)(()=>w.current?.focus(),[]),ne=(0,b.useCallback)(()=>w.current?.blur(),[]),X=(0,b.useCallback)(()=>{let o=w.current;return o?(0,z.extractPlainText)(o):""},[]),d=_t()?"plaintext-only":"true";return{inputRef:w,editorProps:{ref:w,contentEditable:d,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":x,"aria-expanded":h,"aria-activedescendant":S,spellCheck:!0,enterKeyHint:"send",onInput:U,onKeyDown:H,onCompositionStart:L,onCompositionEnd:te,onPaste:Z,onFocus:j,onBlur:f},getPlainText:X,focus:me,blur:ne}}var K=require("react/jsx-runtime");function It(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var ot=(0,I.forwardRef)(function({onSubmit:t,onError:a,optionOverrides:r,maskCompletedText:i,className:s,apiConfig:u,columns:m,pillPlacement:h="dropdown",mode:x="auto",optionsPosition:S="below",animations:P=!0,dropdownTrigger:D,closeDropdownOnBlur:T,showNonTappableOptions:q,autoFocus:W=!0,onFocus:ee,onBlur:Q,value:l,completedParams:w,onChange:F,onParamsChange:G,submitButton:v},B){let M=(0,I.useRef)(null),E=(0,I.useRef)(null),U=(0,I.useRef)(()=>{}),L=(0,I.useRef)(null),te=(0,I.useRef)(null);(0,I.useEffect)(()=>{let _=M.current;if(_)return L.current?L.current.setMode(x):L.current=new ue.ModeController(_,x),()=>{L.current?.destroy(),L.current=null}},[x]);let Z=(0,I.useCallback)(_=>{let ae=te.current?.current;ae&&(ae.focus(),(0,ue.setCursorOffset)(ae,_))},[]),{completedParams:H,skippedParams:j,suggestionPills:f,setActivePill:me,segments:ne,newParamId:X,clearNewParamId:d,placeholderText:o,isFocused:p,isDropdownOpen:c,isActivePillSelected:k,isLoading:g,activeIndex:R,listboxId:O,handleTextChange:J,handleKeyDown:be,setFocused:Re,editingParam:ve,editingAnchor:n,caretOffset:C,startEditingParam:A,handleCaretAfterInput:se,handleCaretMove:ge,replaceEditingRange:it,dropdownProps:nt,reset:xe}=Ae({onSubmit:_=>U.current(_),onError:a,optionOverrides:r,maskCompletedText:i,apiConfig:u,columns:m,dropdownTrigger:D,optionsPosition:S,closeDropdownOnBlur:T,showNonTappableOptions:q,onFocus:ee,onBlur:Q,value:l,completedParams:w,onChange:F,onParamsChange:G,source:"full-sdk",setCursor:Z});(0,I.useEffect)(()=>{if(!X)return;let _=window.setTimeout(()=>d(),650);return()=>window.clearTimeout(_)},[X,d]);let rt=R>=0?`${O}-option-${R}`:void 0,{inputRef:De,editorProps:st,focus:we,blur:Oe,getPlainText:He}=at({segments:ne,newParamId:X,editingParam:ve,editingAnchor:n,caretOffset:C,placeholderText:o,isFocused:p,isDropdownOpen:c,listboxId:O,activeDescendantId:rt,autoFocus:W,handleTextChange:J,handleKeyDown:be,handleCaretAfterInput:se,handleCaretMove:ge,startEditingParam:A,replaceEditingRange:it,setFocused:Re});te.current=De,(0,I.useLayoutEffect)(()=>{let _=E.current,ae=De.current;if(!_||!ae)return;let Ne=()=>{let We=_.firstElementChild;if(!We)return;let ct=We.getBoundingClientRect(),ut=ae.getBoundingClientRect();ct.top>=ut.bottom-2?_.setAttribute("data-aia-pill-wrapped",""):_.removeAttribute("data-aia-pill-wrapped")};Ne();let Ke=new ResizeObserver(Ne);return Ke.observe(ae),()=>Ke.disconnect()},[ne,f.length,g,De]),(0,I.useImperativeHandle)(B,()=>({focus:we,blur:Oe,reset:xe,setMode:_=>L.current?.setMode(_)}),[we,Oe,xe]);let ye=!!ne.length||H.length>0,Te=(0,I.useCallback)(()=>{if(!ye)return;let _=He();t((0,ue.buildSubmitResult)(_,H,j)),xe()},[ye,H,j,t,xe,He]);U.current=Te;let lt=(0,I.useCallback)(_=>{_.target?.closest("[data-aia-pill]")||we()},[we]),dt=h==="inline",pt=h==="dropdown";return(0,K.jsxs)("div",{ref:M,className:`magicx-aia ${re.container} ${s??""}`,"data-pill-placement":h,"data-options-position":S,"data-animations":P?"on":"off","data-mode":It(x),children:[(0,K.jsx)(Pe,{...nt,showPills:pt}),(0,K.jsxs)("div",{className:re.inputWrapper,onClick:lt,children:[(0,K.jsxs)("div",{className:re.editorArea,"data-aia-editor":"",children:[(0,K.jsx)("div",{...st,className:re.input,"data-aia-input":""}),dt&&(g||f.length>0)&&(0,K.jsx)("span",{ref:E,className:re.pillListContainer,"data-aia-pill-list-container":"",children:(0,K.jsx)(_e,{pills:f,activePillIndex:0,activeSelected:k,onSelectPill:me,loading:g})})]}),v===null?null:v===void 0?(0,K.jsx)(et,{disabled:!ye,onClick:Te}):(0,K.jsx)("span",{"data-aia-submit":"",className:re.submitSlot,onClick:_=>{ye&&(_.stopPropagation(),Te())},children:v})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,buildSubmitResult,useAIAutocomplete,withSkippedParams});
|
|
1185
1185
|
//# sourceMappingURL=index.js.map
|