@magicx-eng/ai-autocomplete-react 0.2.0 → 0.2.1
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/dist/index.js +6 -8
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +6 -8
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var Pe=Object.defineProperty;var $e=Object.getOwnPropertyDescriptor;var Ue=Object.getOwnPropertyNames;var je=Object.prototype.hasOwnProperty;var Xe=(e,l)=>{for(var p in l)Pe(e,p,{get:l[p],enumerable:!0})},Qe=(e,l,p,x)=>{if(l&&typeof l=="object"||typeof l=="function")for(let r of Ue(l))!je.call(e,r)&&r!==p&&Pe(e,r,{get:()=>l[r],enumerable:!(x=$e(l,r))||x.enumerable});return e};var Je=e=>Qe(Pe({},"__esModule",{value:!0}),e);var at={};Xe(at,{AIAutocomplete:()=>He,AIAutocompleteDropdown:()=>_e,useAIAutocomplete:()=>ye});module.exports=Je(at);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
|
|
@@ -97,7 +97,6 @@
|
|
|
97
97
|
.AIAutocomplete-module_input_IW-P-[data-aia-empty="true"] {
|
|
98
98
|
display: inline-block;
|
|
99
99
|
min-width: 1px;
|
|
100
|
-
vertical-align: top;
|
|
101
100
|
}
|
|
102
101
|
|
|
103
102
|
.AIAutocomplete-module_pillListContainer_h92IA {
|
|
@@ -202,7 +201,7 @@
|
|
|
202
201
|
}
|
|
203
202
|
|
|
204
203
|
.AIAutocompleteDropdown-module_pillBar_pwTXe {
|
|
205
|
-
padding: 27px 27px
|
|
204
|
+
padding: 27px 27px 3px 27px;
|
|
206
205
|
overflow-x: auto;
|
|
207
206
|
overflow-y: hidden;
|
|
208
207
|
scrollbar-width: none;
|
|
@@ -256,7 +255,6 @@
|
|
|
256
255
|
gap: 5px;
|
|
257
256
|
align-items: center;
|
|
258
257
|
vertical-align: middle;
|
|
259
|
-
transform: translateY(-3px);
|
|
260
258
|
}
|
|
261
259
|
|
|
262
260
|
.PillList-module_pill_osSyz {
|
|
@@ -331,7 +329,7 @@
|
|
|
331
329
|
opacity: 0;
|
|
332
330
|
}
|
|
333
331
|
}
|
|
334
|
-
`,document.head.appendChild(e)}var F={list:"PillList-module_list_qvLqO",pill:"PillList-module_pill_osSyz",fadeIn:"PillList-module_fadeIn_Aezob",rounded:"PillList-module_rounded_WvXy4",skeleton:"PillList-module_skeleton_Lp8x6",skeletonPulse:"PillList-module_skeletonPulse_xZ8Yf",active:"PillList-module_active_Oll--"};var ce=require("react/jsx-runtime"),
|
|
332
|
+
`,document.head.appendChild(e)}var F={list:"PillList-module_list_qvLqO",pill:"PillList-module_pill_osSyz",fadeIn:"PillList-module_fadeIn_Aezob",rounded:"PillList-module_rounded_WvXy4",skeleton:"PillList-module_skeleton_Lp8x6",skeletonPulse:"PillList-module_skeletonPulse_xZ8Yf",active:"PillList-module_active_Oll--"};var ce=require("react/jsx-runtime"),Ze=[125,69];function Te(e){return e===0?.4:e===1?.3:.15}function me({pills:e,activePillIndex:l,onSelectPill:p,rounded:x,loading:r}){return r&&e.length===0?(0,ce.jsx)("span",{className:F.list,"data-aia-pill-list-loading":"",children:Ze.map((c,b)=>(0,ce.jsx)("span",{"data-aia-pill-skeleton":"",className:`${F.pill} ${x?F.rounded:""} ${F.skeleton}`,style:{width:c,opacity:Te(b)}},`skel-${c}`))}):(0,ce.jsx)("span",{className:F.list,"data-aia-pill-list-loading":r?"":void 0,children:e.map((c,b)=>(0,ce.jsx)("button",{type:"button","data-aia-pill":"","data-aia-loading":r?"":void 0,tabIndex:-1,contentEditable:!1,suppressContentEditableWarning:!0,className:`${F.pill} ${x?F.rounded:""} ${b===l&&!r?F.active:""} ${r?F.skeleton:""}`,style:{opacity:Te(b)},onMouseDown:h=>h.preventDefault(),onClick:r?void 0:()=>p(b),disabled:r,children:c.text},`${c.type}-${c.text}`))})}var Y=require("react");if(typeof document<"u"&&!document.getElementById("ac-style-ff33a0ab")){let e=document.createElement("style");e.id="ac-style-ff33a0ab",e.textContent=`.SuggestionGrid-module_scrollWrapper_MOqfw {
|
|
335
333
|
position: relative;
|
|
336
334
|
}
|
|
337
335
|
|
|
@@ -386,7 +384,7 @@
|
|
|
386
384
|
background: var(--aia-scrollbar-thumb, rgba(0, 0, 0, 0.3));
|
|
387
385
|
border-radius: 3px;
|
|
388
386
|
}
|
|
389
|
-
`,document.head.appendChild(e)}var
|
|
387
|
+
`,document.head.appendChild(e)}var Ee={scrollWrapper:"SuggestionGrid-module_scrollWrapper_MOqfw",grid:"SuggestionGrid-module_grid_jvaPb"};var de=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 {
|
|
390
388
|
position: relative;
|
|
391
389
|
overflow: visible;
|
|
392
390
|
display: flex;
|
|
@@ -733,7 +731,7 @@
|
|
|
733
731
|
filter: brightness(0.55);
|
|
734
732
|
}
|
|
735
733
|
}
|
|
736
|
-
`,document.head.appendChild(e)}var
|
|
734
|
+
`,document.head.appendChild(e)}var H={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 Z=require("react/jsx-runtime");function ze({option:e,isHighlighted:l,onSelect:p,onHighlight:x,id:r,loading:c}){let[b,h]=(0,de.useState)(!1),_=(0,de.useRef)(void 0);(0,de.useEffect)(()=>()=>clearTimeout(_.current),[]);let n=()=>{c||!e.is_tappable||b||(h(!0),p(e),clearTimeout(_.current),_.current=setTimeout(()=>h(!1),500))},m=[H.item,l&&!c?H.highlighted:"",e.is_tappable?H.tappable:H.nonTappable,b?H.pressed:""].filter(Boolean).join(" ");return(0,Z.jsxs)("div",{id:r,role:"option","data-aia-option":"","data-aia-loading":c?"":void 0,"aria-selected":l,className:m,tabIndex:c||!e.is_tappable?-1:0,onClick:n,onKeyDown:S=>{!c&&e.is_tappable&&(S.key==="Enter"||S.key===" ")&&(S.preventDefault(),n())},onMouseEnter:!c&&e.is_tappable?x:void 0,children:[(0,Z.jsx)("div",{className:H.streaks}),(0,Z.jsx)("div",{className:H.streaksVert}),(0,Z.jsxs)("span",{className:H.content,children:[(0,Z.jsx)("span",{className:H.text,children:e.icon?`${e.icon} ${e.text}`:e.text}),e.tag&&(0,Z.jsx)("span",{className:H.tag,children:e.tag})]})]})}var we=require("react/jsx-runtime");function Me({options:e,activeIndex:l,onSelect:p,onHighlight:x,listboxId:r,loading:c}){let b=(0,Y.useRef)(null),[h,_]=(0,Y.useState)(!1);return(0,Y.useEffect)(()=>{let n=b.current;if(!n)return;let m=()=>{_(n.scrollHeight-n.scrollTop-n.clientHeight>1)};n.addEventListener("scroll",m,{passive:!0});let S=new ResizeObserver(m);return S.observe(n),()=>{n.removeEventListener("scroll",m),S.disconnect()}},[]),(0,Y.useLayoutEffect)(()=>{let n=b.current;n&&_(n.scrollHeight-n.scrollTop-n.clientHeight>1)},[e]),(0,we.jsx)("div",{className:Ee.scrollWrapper,"data-fade":h?"":void 0,children:(0,we.jsx)("div",{ref:b,className:Ee.grid,children:e.map((n,m)=>(0,we.jsx)(ze,{option:n,isHighlighted:m===l,onSelect:p,onHighlight:()=>x(m),id:`${r}-option-${m}`,loading:c},n.text))})})}var W=require("react/jsx-runtime"),Ye=[159,119,164];function _e({suggestions:e,activeIndex:l,onSelect:p,onHighlight:x,isOpen:r,id:c,className:b,pills:h,onPillClick:_,showPills:n=!0,isLoading:m=!1}){let E=e[0]?.options??[],C=n&&h&&h.length>0&&_,M=E.length>0,N=m&&!M,$=r&&(M||C||m);return(0,W.jsxs)("div",{id:c,role:"listbox","data-aia-dropdown":"","data-aia-loading":m?"":void 0,className:`${ie.dropdown} ${$?ie.visible:""} ${b??""}`,onMouseDown:T=>T.preventDefault(),children:[n&&h&&h.length>0&&_&&(0,W.jsx)("div",{className:ie.pillBar,"data-aia-pillbar":"",children:(0,W.jsx)(me,{pills:h,activePillIndex:0,onSelectPill:_,rounded:!0,loading:m})}),n&&(!h||h.length===0)&&m&&(0,W.jsx)("div",{className:ie.pillBar,"data-aia-pillbar":"",children:(0,W.jsx)(me,{pills:[],activePillIndex:0,onSelectPill:()=>{},rounded:!0,loading:!0})}),M&&(0,W.jsx)(Me,{options:E,activeIndex:l,onSelect:p,onHighlight:x,listboxId:c,loading:m}),N&&(0,W.jsx)("div",{className:ie.skeletonBars,"data-aia-skeleton-bars":"",children:Ye.map(T=>(0,W.jsx)("span",{className:ie.skeletonBar,style:{width:T}},`bar-${T}`))})]})}if(typeof document<"u"&&!document.getElementById("ac-style-0ae03977")){let e=document.createElement("style");e.id="ac-style-0ae03977",e.textContent=`/*
|
|
737
735
|
* Built-in appearance defaults \u2014 zero specificity via :where().
|
|
738
736
|
* Consumer CSS always wins without !important.
|
|
739
737
|
*
|
|
@@ -828,5 +826,5 @@
|
|
|
828
826
|
animation-duration: 0s !important;
|
|
829
827
|
transition-duration: 0s !important;
|
|
830
828
|
}
|
|
831
|
-
`,document.head.appendChild(e)}var pe=require("@magicx-eng/ai-autocomplete-vanilla");var Oe=require("@magicx-eng/ai-autocomplete-vanilla"),v=require("react"),et={text:"",completedParams:[],suggestions:[],activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],placeholderText:"",isDropdownOpen:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1};function ye({onSubmit:e,onError:l,optionOverrides:p,maskCompletedText:x,apiConfig:r,columns:m=2,dropdownTrigger:b,optionsPosition:h,closeDropdownOnBlur:_,showNonTappableOptions:n,onFocus:g,onBlur:S,value:P,completedParams:C,onChange:M,onParamsChange:N,source:$,setCursor:T}){let a=(0,v.useRef)(null),[k,U]=(0,v.useState)(null),ee=(0,v.useRef)(e);ee.current=e;let G=(0,v.useRef)(l);G.current=l;let te=(0,v.useRef)(M);te.current=M;let j=(0,v.useRef)(N);j.current=N;let z=(0,v.useRef)(g);z.current=g;let oe=(0,v.useRef)(S);oe.current=S;let O=(0,v.useRef)(T);O.current=T,(0,v.useEffect)(()=>{if(typeof document>"u")return;let t=new Oe.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:r,optionOverrides:p,maskCompletedText:x,columns:m,dropdownTrigger:b,optionsPosition:h,closeDropdownOnBlur:_,showNonTappableOptions:n,source:$,value:P,completedParams:C,onSubmit:(...A)=>ee.current?.(...A),onError:(...A)=>G.current?.(...A),onChange:(...A)=>te.current?.(...A),onParamsChange:(...A)=>j.current?.(...A),onFocus:()=>z.current?.(),onBlur:()=>oe.current?.(),setCursor:A=>O.current?.(A)});a.current=t,U(t.getState());let E=t.subscribe(A=>U(A));return()=>{E(),t.destroy(),a.current===t&&(a.current=null)}},[]),(0,v.useEffect)(()=>{P!==void 0&&a.current?.setValue(P)},[P]),(0,v.useEffect)(()=>{C!==void 0&&a.current?.setCompletedParams(C)},[C]);let se=JSON.stringify(r??null),ae=(0,v.useRef)(p),X=(0,v.useRef)(0);if(p!==ae.current){let t=ae.current,E=p,A=Object.keys(t??{}),le=Object.keys(E??{});(A.length!==le.length||le.some(ue=>!t?.[ue]||E[ue]!==t[ue]))&&X.current++,ae.current=p}(0,v.useEffect)(()=>{a.current?.update({apiConfig:r,optionOverrides:p,dropdownTrigger:b,optionsPosition:h,closeDropdownOnBlur:_,showNonTappableOptions:n})},[se,X.current,b,h,_,n]);let V=(0,v.useRef)(null);V.current===null&&(V.current={handleTextChange:t=>a.current?.handleTextChange(t),handleKeyDown:t=>{let E="nativeEvent"in t?t.nativeEvent:t;a.current?.handleKeyDown(E)},setFocused:t=>a.current?.setFocused(t),startEditingParam:t=>a.current?.startEditingParam(t),exitEditMode:()=>a.current?.exitEditMode(),handleCaretAfterInput:t=>a.current?.handleCaretAfterInput(t),handleCaretMove:t=>a.current?.handleCaretMove(t),replaceEditingRange:t=>a.current?.replaceEditingRange(t)??!1,setActivePill:t=>a.current?.setActivePill(t),removeLastParam:()=>a.current?.removeLastParam(),clearNewParamId:()=>a.current?.clearNewParamId(),reset:()=>a.current?.reset(),selectOption:t=>a.current?.selectOption(t),setActiveDropdownIndex:t=>a.current?.setActiveDropdownIndex(t),handleFocus:()=>a.current?.setFocused(!0),handleBlur:()=>a.current?.setFocused(!1)});let w=V.current,ne=(0,v.useCallback)(t=>{let E=t.target.value,le=E.length>0&&!t.nativeEvent?.isComposing&&E[0]!==E[0].toUpperCase()?E[0].toUpperCase()+E.slice(1):E;a.current?.handleTextChange(le)},[]),re=(0,v.useCallback)(t=>{a.current?.handleKeyDown(t.nativeEvent)},[]),Q=a.current,i=k??et,o=P!==void 0?P:i.text,s=C!==void 0?C:i.completedParams,u=i.actionableSuggestions,y=u[0],f=Q?.listboxId??"",D=i.activeDropdownIndex>=0&&Q?`${f}-option-${i.activeDropdownIndex}`:void 0,B=i.editingParam,q=B?{type:B.suggestionType,text:B.suggestionPlaceholder,required:!0,options:B.options}:null,ge=q??y,ke=q?[q]:u,fe=!Q||i.isLoading&&!i.editingParam&&!i.inSelectionAnimation;return{completedParams:s,suggestionPills:u,setActivePill:w.setActivePill,removeLastParam:w.removeLastParam,segments:i.segments,newParamId:i.newParamId,clearNewParamId:w.clearNewParamId,suggestions:i.suggestions,activeIndex:i.activeDropdownIndex,isReady:i.isReady,isLoading:fe,isFocused:i.isFocused,isDropdownOpen:i.isDropdownOpen,placeholderText:i.placeholderText,listboxId:f,error:i.error,handleTextChange:w.handleTextChange,handleKeyDown:w.handleKeyDown,setFocused:w.setFocused,editingParam:B,editingAnchor:i.editingAnchor,caretOffset:i.caretOffset,startEditingParam:w.startEditingParam,exitEditMode:w.exitEditMode,handleCaretAfterInput:w.handleCaretAfterInput,handleCaretMove:w.handleCaretMove,replaceEditingRange:w.replaceEditingRange,inputProps:{value:o,placeholder:i.placeholderText||void 0,onChange:ne,onKeyDown:re,onFocus:w.handleFocus,onBlur:w.handleBlur,role:"combobox","aria-expanded":i.isDropdownOpen,"aria-activedescendant":D,"aria-autocomplete":"list","aria-controls":f},reset:w.reset,dropdownProps:{suggestions:ge?[{...ge,options:i.filteredOptions}]:[],activeIndex:i.activeDropdownIndex,onSelect:w.selectOption,onHighlight:w.setActiveDropdownIndex,isOpen:i.isDropdownOpen,id:f,pills:ke,onPillClick:w.setActivePill,isLoading:fe}}}var L=require("@magicx-eng/ai-autocomplete-vanilla"),d=require("react"),Ie;function tt(){if(Ie!==void 0)return Ie;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Ie=e.contentEditable==="plaintext-only",Ie}function Be(e){let{segments:l,newParamId:p,editingParam:x,editingAnchor:r,caretOffset:m,placeholderText:b,isFocused:h,isDropdownOpen:_,listboxId:n,activeDescendantId:g,autoFocus:S,handleTextChange:P,handleKeyDown:C,handleCaretAfterInput:M,handleCaretMove:N,startEditingParam:$,replaceEditingRange:T,setFocused:a}=e,k=(0,d.useRef)(null),U=(0,d.useRef)(!1),ee=(0,d.useRef)(""),G=(0,d.useRef)(""),te=(0,d.useRef)(null),j=(0,d.useRef)(0);te.current=m,(0,d.useEffect)(()=>{if(!S)return;let o=k.current;o&&(document.activeElement===o?a(!0):o.focus())},[S,a]),(0,d.useEffect)(()=>{let o=k.current;if(!o)return;let s=o.ownerDocument??document,u=()=>{let y=s.getSelection();if(!y||y.rangeCount===0||!y.anchorNode||!o.contains(y.anchorNode))return;let f=y.anchorNode,q=(f.nodeType===Node.ELEMENT_NODE?f:f.parentElement)?.closest('strong[data-seg="completed"][data-param-id]')?.dataset.paramId??null;if(q&&q!==x?.id){$(q);return}performance.now()-j.current<50||N((0,L.getCursorOffset)(o))};return s.addEventListener("selectionchange",u),()=>s.removeEventListener("selectionchange",u)},[x,$,N]),(0,d.useLayoutEffect)(()=>{let o=k.current;o&&(0,L.renderEditableContent)({input:o,segments:l,newParamId:p,editingParamId:x?.id??null,placeholderText:b??"",isFocused:h})},[l,p,x,b,h]),(0,d.useLayoutEffect)(()=>{let o=ee.current,s=p??"";if(ee.current=s,!s||s===o)return;let u=k.current;if(!u)return;u.focus();let y=te.current??(0,L.plainTextLength)(u);(0,L.setCursorOffset)(u,y)},[p]),(0,d.useLayoutEffect)(()=>{let o=G.current,s=x?.id??"";if(G.current=s,!s||s===o||r==null)return;let u=k.current;u&&(0,L.setCursorOffset)(u,r)},[x,r]);let z=(0,d.useCallback)(()=>{if(U.current)return;let o=k.current;if(!o)return;let s=(0,L.extractPlainText)(o),y=s.length>0&&s[0]!==s[0].toUpperCase()?s[0].toUpperCase()+s.slice(1):s;P(y)},[P]),oe=(0,d.useCallback)(()=>{j.current=performance.now(),z();let o=k.current;o&&M((0,L.getCursorOffset)(o))},[z,M]);(0,d.useEffect)(()=>{let o=k.current;if(!o)return;let s=u=>{let y=u,f=y.inputType;if(f==="insertParagraph"||f==="insertLineBreak"||f==="insertFromDrop"){u.preventDefault();return}if(f.startsWith("insert")||f.startsWith("delete")){let D=f.startsWith("delete")?"":y.data??"";T(D)&&u.preventDefault()}};return o.addEventListener("beforeinput",s),()=>o.removeEventListener("beforeinput",s)},[T]);let O=(0,d.useCallback)(()=>{U.current=!0},[]),se=(0,d.useCallback)(()=>{U.current=!1,z()},[z]),ae=(0,d.useCallback)(o=>{o.preventDefault();let s=k.current;if(!s)return;let u=(o.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!u)return;let y=s.ownerDocument??document,f=y.getSelection();if(!f||f.rangeCount===0)return;let D=f.getRangeAt(0);if(!s.contains(D.startContainer))return;D.deleteContents();let B=y.createTextNode(u);D.insertNode(B),D.setStartAfter(B),D.collapse(!0),f.removeAllRanges(),f.addRange(D),z()},[z]),X=(0,d.useCallback)(o=>C(o),[C]),V=(0,d.useCallback)(()=>a(!0),[a]),w=(0,d.useCallback)(()=>a(!1),[a]),ne=(0,d.useCallback)(()=>k.current?.focus(),[]),re=(0,d.useCallback)(()=>k.current?.blur(),[]),Q=(0,d.useCallback)(()=>{let o=k.current;return o?(0,L.extractPlainText)(o):""},[]),i=tt()?"plaintext-only":"true";return{inputRef:k,editorProps:{ref:k,contentEditable:i,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":n,"aria-expanded":_,"aria-activedescendant":g,spellCheck:!0,enterKeyHint:"send",onInput:oe,onKeyDown:X,onCompositionStart:O,onCompositionEnd:se,onPaste:ae,onFocus:V,onBlur:w},getPlainText:Q,focus:ne,blur:re}}var R=require("react/jsx-runtime");function ot(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var He=(0,I.forwardRef)(function({onSubmit:l,onError:p,optionOverrides:x,maskCompletedText:r,className:m,apiConfig:b,columns:h,pillPlacement:_="inline",mode:n="auto",optionsPosition:g="below",animations:S=!0,dropdownTrigger:P,closeDropdownOnBlur:C,showNonTappableOptions:M,autoFocus:N=!0,onFocus:$,onBlur:T,value:a,completedParams:k,onChange:U,onParamsChange:ee,submitButton:G},te){let j=(0,I.useRef)(null),z=(0,I.useRef)(null),oe=(0,I.useRef)(()=>{}),O=(0,I.useRef)(null),se=(0,I.useRef)(null);(0,I.useEffect)(()=>{let c=j.current;if(c)return O.current?O.current.setMode(n):O.current=new pe.ModeController(c,n),()=>{O.current?.destroy(),O.current=null}},[n]);let ae=(0,I.useCallback)(c=>{let H=se.current?.current;H&&(H.focus(),(0,pe.setCursorOffset)(H,c))},[]),{completedParams:X,suggestionPills:V,setActivePill:w,segments:ne,newParamId:re,clearNewParamId:Q,placeholderText:i,isFocused:o,isDropdownOpen:s,isLoading:u,activeIndex:y,listboxId:f,handleTextChange:D,handleKeyDown:B,setFocused:q,editingParam:ge,editingAnchor:ke,caretOffset:fe,startEditingParam:t,handleCaretAfterInput:E,handleCaretMove:A,replaceEditingRange:le,dropdownProps:ue,reset:be}=ye({onSubmit:c=>oe.current(c),onError:p,optionOverrides:x,maskCompletedText:r,apiConfig:b,columns:h,dropdownTrigger:P,optionsPosition:g,closeDropdownOnBlur:C,showNonTappableOptions:M,onFocus:$,onBlur:T,value:a,completedParams:k,onChange:U,onParamsChange:ee,source:"full-sdk",setCursor:ae});(0,I.useEffect)(()=>{if(!re)return;let c=window.setTimeout(()=>Q(),650);return()=>window.clearTimeout(c)},[re,Q]);let Ke=y>=0?`${f}-option-${y}`:void 0,{inputRef:Ae,editorProps:Fe,focus:he,blur:Ce,getPlainText:De}=Be({segments:ne,newParamId:re,editingParam:ge,editingAnchor:ke,caretOffset:fe,placeholderText:i,isFocused:o,isDropdownOpen:s,listboxId:f,activeDescendantId:Ke,autoFocus:N,handleTextChange:D,handleKeyDown:B,handleCaretAfterInput:E,handleCaretMove:A,startEditingParam:t,replaceEditingRange:le,setFocused:q});se.current=Ae,(0,I.useLayoutEffect)(()=>{let c=z.current,H=Ae.current;if(!c||!H)return;let ve=()=>{let Re=c.firstElementChild;if(!Re)return;if(H.dataset.aiaEmpty==="true"){c.setAttribute("data-aia-pill-wrapped","");return}let Ve=Re.getBoundingClientRect(),qe=H.getBoundingClientRect();Ve.top>=qe.bottom-2?c.setAttribute("data-aia-pill-wrapped",""):c.removeAttribute("data-aia-pill-wrapped")};ve();let Le=new ResizeObserver(ve);return Le.observe(H),()=>Le.disconnect()},[ne,V.length,u,Ae]),(0,I.useImperativeHandle)(te,()=>({focus:he,blur:Ce,reset:be,setMode:c=>O.current?.setMode(c)}),[he,Ce,be]);let xe=!!ne.length||X.length>0,Se=(0,I.useCallback)(()=>{if(!xe)return;let c=De(),{rawQuery:H,completedParams:ve}=(0,pe.buildQuery)(c,X);l({query:c.trim(),raw_query:H,completed_params:ve}),be()},[xe,X,l,be,De]);oe.current=Se;let We=(0,I.useCallback)(c=>{c.target?.closest("[data-aia-pill]")||he()},[he]),Ne=_==="inline",Ge=_==="dropdown";return(0,R.jsxs)("div",{ref:j,className:`magicx-aia ${J.container} ${m??""}`,"data-pill-placement":_,"data-options-position":g,"data-animations":S?"on":"off","data-mode":ot(n),children:[(0,R.jsx)(_e,{...ue,showPills:Ge}),(0,R.jsxs)("div",{className:J.inputWrapper,onClick:We,children:[(0,R.jsxs)("div",{className:J.editorArea,"data-aia-editor":"",children:[(0,R.jsx)("div",{...Fe,className:J.input,"data-aia-input":""}),Ne&&(u||V.length>0)&&(0,R.jsx)("span",{ref:z,className:J.pillListContainer,"data-aia-pill-list-container":"",children:(0,R.jsx)(me,{pills:V,activePillIndex:0,onSelectPill:w,loading:u})})]}),G===null?null:G===void 0?(0,R.jsx)("button",{type:"button","data-aia-submit":"",className:J.submitButton,disabled:!xe,onClick:c=>{c.stopPropagation(),Se()},"aria-label":"Submit",children:(0,R.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,R.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}):(0,R.jsx)("span",{"data-aia-submit":"",className:J.submitSlot,onClick:c=>{xe&&(c.stopPropagation(),Se())},children:G})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,useAIAutocomplete});
|
|
829
|
+
`,document.head.appendChild(e)}var pe=require("@magicx-eng/ai-autocomplete-vanilla");var Oe=require("@magicx-eng/ai-autocomplete-vanilla"),v=require("react"),et={text:"",completedParams:[],suggestions:[],activeDropdownIndex:-1,newParamId:null,isLoading:!0,isReady:!1,error:null,segments:[],actionableSuggestions:[],filteredOptions:[],placeholderText:"",isDropdownOpen:!1,filterBase:0,filterInProgress:!1,pillTapped:!1,skipNextFetch:!1,lastRawQuery:"",isFocused:!1,editingParam:null,editingAnchor:null,editingTail:null,caretOffset:null,inSelectionAnimation:!1};function ye({onSubmit:e,onError:l,optionOverrides:p,maskCompletedText:x,apiConfig:r,columns:c=2,dropdownTrigger:b,optionsPosition:h,closeDropdownOnBlur:_,showNonTappableOptions:n,onFocus:m,onBlur:S,value:E,completedParams:C,onChange:M,onParamsChange:N,source:$,setCursor:T}){let a=(0,v.useRef)(null),[k,U]=(0,v.useState)(null),ee=(0,v.useRef)(e);ee.current=e;let G=(0,v.useRef)(l);G.current=l;let te=(0,v.useRef)(M);te.current=M;let j=(0,v.useRef)(N);j.current=N;let z=(0,v.useRef)(m);z.current=m;let oe=(0,v.useRef)(S);oe.current=S;let O=(0,v.useRef)(T);O.current=T,(0,v.useEffect)(()=>{if(typeof document>"u")return;let t=new Oe.AIAutocomplete(document.createElement("div"),{renderMode:"headless",apiConfig:r,optionOverrides:p,maskCompletedText:x,columns:c,dropdownTrigger:b,optionsPosition:h,closeDropdownOnBlur:_,showNonTappableOptions:n,source:$,value:E,completedParams:C,onSubmit:(...A)=>ee.current?.(...A),onError:(...A)=>G.current?.(...A),onChange:(...A)=>te.current?.(...A),onParamsChange:(...A)=>j.current?.(...A),onFocus:()=>z.current?.(),onBlur:()=>oe.current?.(),setCursor:A=>O.current?.(A)});a.current=t,U(t.getState());let P=t.subscribe(A=>U(A));return()=>{P(),t.destroy(),a.current===t&&(a.current=null)}},[]),(0,v.useEffect)(()=>{E!==void 0&&a.current?.setValue(E)},[E]),(0,v.useEffect)(()=>{C!==void 0&&a.current?.setCompletedParams(C)},[C]);let se=JSON.stringify(r??null),ae=(0,v.useRef)(p),X=(0,v.useRef)(0);if(p!==ae.current){let t=ae.current,P=p,A=Object.keys(t??{}),le=Object.keys(P??{});(A.length!==le.length||le.some(ue=>!t?.[ue]||P[ue]!==t[ue]))&&X.current++,ae.current=p}(0,v.useEffect)(()=>{a.current?.update({apiConfig:r,optionOverrides:p,dropdownTrigger:b,optionsPosition:h,closeDropdownOnBlur:_,showNonTappableOptions:n})},[se,X.current,b,h,_,n]);let V=(0,v.useRef)(null);V.current===null&&(V.current={handleTextChange:t=>a.current?.handleTextChange(t),handleKeyDown:t=>{let P="nativeEvent"in t?t.nativeEvent:t;a.current?.handleKeyDown(P)},setFocused:t=>a.current?.setFocused(t),startEditingParam:t=>a.current?.startEditingParam(t),exitEditMode:()=>a.current?.exitEditMode(),handleCaretAfterInput:t=>a.current?.handleCaretAfterInput(t),handleCaretMove:t=>a.current?.handleCaretMove(t),replaceEditingRange:t=>a.current?.replaceEditingRange(t)??!1,setActivePill:t=>a.current?.setActivePill(t),removeLastParam:()=>a.current?.removeLastParam(),clearNewParamId:()=>a.current?.clearNewParamId(),reset:()=>a.current?.reset(),selectOption:t=>a.current?.selectOption(t),setActiveDropdownIndex:t=>a.current?.setActiveDropdownIndex(t),handleFocus:()=>a.current?.setFocused(!0),handleBlur:()=>a.current?.setFocused(!1)});let w=V.current,ne=(0,v.useCallback)(t=>{let P=t.target.value,le=P.length>0&&!t.nativeEvent?.isComposing&&P[0]!==P[0].toUpperCase()?P[0].toUpperCase()+P.slice(1):P;a.current?.handleTextChange(le)},[]),re=(0,v.useCallback)(t=>{a.current?.handleKeyDown(t.nativeEvent)},[]),Q=a.current,i=k??et,o=E!==void 0?E:i.text,s=C!==void 0?C:i.completedParams,u=i.actionableSuggestions,y=u[0],g=Q?.listboxId??"",D=i.activeDropdownIndex>=0&&Q?`${g}-option-${i.activeDropdownIndex}`:void 0,B=i.editingParam,q=B?{type:B.suggestionType,text:B.suggestionPlaceholder,required:!0,options:B.options}:null,ge=q??y,ke=q?[q]:u,fe=!Q||i.isLoading&&!i.editingParam&&!i.inSelectionAnimation;return{completedParams:s,suggestionPills:u,setActivePill:w.setActivePill,removeLastParam:w.removeLastParam,segments:i.segments,newParamId:i.newParamId,clearNewParamId:w.clearNewParamId,suggestions:i.suggestions,activeIndex:i.activeDropdownIndex,isReady:i.isReady,isLoading:fe,isFocused:i.isFocused,isDropdownOpen:i.isDropdownOpen,placeholderText:i.placeholderText,listboxId:g,error:i.error,handleTextChange:w.handleTextChange,handleKeyDown:w.handleKeyDown,setFocused:w.setFocused,editingParam:B,editingAnchor:i.editingAnchor,caretOffset:i.caretOffset,startEditingParam:w.startEditingParam,exitEditMode:w.exitEditMode,handleCaretAfterInput:w.handleCaretAfterInput,handleCaretMove:w.handleCaretMove,replaceEditingRange:w.replaceEditingRange,inputProps:{value:o,placeholder:i.placeholderText||void 0,onChange:ne,onKeyDown:re,onFocus:w.handleFocus,onBlur:w.handleBlur,role:"combobox","aria-expanded":i.isDropdownOpen,"aria-activedescendant":D,"aria-autocomplete":"list","aria-controls":g},reset:w.reset,dropdownProps:{suggestions:ge?[{...ge,options:i.filteredOptions}]:[],activeIndex:i.activeDropdownIndex,onSelect:w.selectOption,onHighlight:w.setActiveDropdownIndex,isOpen:i.isDropdownOpen,id:g,pills:ke,onPillClick:w.setActivePill,isLoading:fe}}}var L=require("@magicx-eng/ai-autocomplete-vanilla"),d=require("react"),Ie;function tt(){if(Ie!==void 0)return Ie;if(typeof document>"u")return!1;let e=document.createElement("div");return e.setAttribute("contenteditable","plaintext-only"),Ie=e.contentEditable==="plaintext-only",Ie}function Be(e){let{segments:l,newParamId:p,editingParam:x,editingAnchor:r,caretOffset:c,placeholderText:b,isFocused:h,isDropdownOpen:_,listboxId:n,activeDescendantId:m,autoFocus:S,handleTextChange:E,handleKeyDown:C,handleCaretAfterInput:M,handleCaretMove:N,startEditingParam:$,replaceEditingRange:T,setFocused:a}=e,k=(0,d.useRef)(null),U=(0,d.useRef)(!1),ee=(0,d.useRef)(""),G=(0,d.useRef)(""),te=(0,d.useRef)(null),j=(0,d.useRef)(0);te.current=c,(0,d.useEffect)(()=>{if(!S)return;let o=k.current;o&&(document.activeElement===o?a(!0):o.focus())},[S,a]),(0,d.useEffect)(()=>{let o=k.current;if(!o)return;let s=o.ownerDocument??document,u=()=>{let y=s.getSelection();if(!y||y.rangeCount===0||!y.anchorNode||!o.contains(y.anchorNode))return;let g=y.anchorNode,q=(g.nodeType===Node.ELEMENT_NODE?g:g.parentElement)?.closest('strong[data-seg="completed"][data-param-id]')?.dataset.paramId??null;if(q&&q!==x?.id){$(q);return}performance.now()-j.current<50||N((0,L.getCursorOffset)(o))};return s.addEventListener("selectionchange",u),()=>s.removeEventListener("selectionchange",u)},[x,$,N]),(0,d.useLayoutEffect)(()=>{let o=k.current;o&&(0,L.renderEditableContent)({input:o,segments:l,newParamId:p,editingParamId:x?.id??null,placeholderText:b??"",isFocused:h})},[l,p,x,b,h]),(0,d.useLayoutEffect)(()=>{let o=ee.current,s=p??"";if(ee.current=s,!s||s===o)return;let u=k.current;if(!u)return;u.focus();let y=te.current??(0,L.plainTextLength)(u);(0,L.setCursorOffset)(u,y)},[p]),(0,d.useLayoutEffect)(()=>{let o=G.current,s=x?.id??"";if(G.current=s,!s||s===o||r==null)return;let u=k.current;u&&(0,L.setCursorOffset)(u,r)},[x,r]);let z=(0,d.useCallback)(()=>{if(U.current)return;let o=k.current;if(!o)return;let s=(0,L.extractPlainText)(o),y=s.length>0&&s[0]!==s[0].toUpperCase()?s[0].toUpperCase()+s.slice(1):s;E(y)},[E]),oe=(0,d.useCallback)(()=>{j.current=performance.now(),z();let o=k.current;o&&M((0,L.getCursorOffset)(o))},[z,M]);(0,d.useEffect)(()=>{let o=k.current;if(!o)return;let s=u=>{let y=u,g=y.inputType;if(g==="insertParagraph"||g==="insertLineBreak"||g==="insertFromDrop"){u.preventDefault();return}if(g.startsWith("insert")||g.startsWith("delete")){let D=g.startsWith("delete")?"":y.data??"";T(D)&&u.preventDefault()}};return o.addEventListener("beforeinput",s),()=>o.removeEventListener("beforeinput",s)},[T]);let O=(0,d.useCallback)(()=>{U.current=!0},[]),se=(0,d.useCallback)(()=>{U.current=!1,z()},[z]),ae=(0,d.useCallback)(o=>{o.preventDefault();let s=k.current;if(!s)return;let u=(o.clipboardData.getData("text/plain")??"").replace(/\r?\n/g," ");if(!u)return;let y=s.ownerDocument??document,g=y.getSelection();if(!g||g.rangeCount===0)return;let D=g.getRangeAt(0);if(!s.contains(D.startContainer))return;D.deleteContents();let B=y.createTextNode(u);D.insertNode(B),D.setStartAfter(B),D.collapse(!0),g.removeAllRanges(),g.addRange(D),z()},[z]),X=(0,d.useCallback)(o=>C(o),[C]),V=(0,d.useCallback)(()=>a(!0),[a]),w=(0,d.useCallback)(()=>a(!1),[a]),ne=(0,d.useCallback)(()=>k.current?.focus(),[]),re=(0,d.useCallback)(()=>k.current?.blur(),[]),Q=(0,d.useCallback)(()=>{let o=k.current;return o?(0,L.extractPlainText)(o):""},[]),i=tt()?"plaintext-only":"true";return{inputRef:k,editorProps:{ref:k,contentEditable:i,suppressContentEditableWarning:!0,tabIndex:0,role:"combobox","aria-autocomplete":"list","aria-haspopup":"listbox","aria-controls":n,"aria-expanded":_,"aria-activedescendant":m,spellCheck:!0,enterKeyHint:"send",onInput:oe,onKeyDown:X,onCompositionStart:O,onCompositionEnd:se,onPaste:ae,onFocus:V,onBlur:w},getPlainText:Q,focus:ne,blur:re}}var R=require("react/jsx-runtime");function ot(e){return e!=="auto"?e:typeof window>"u"||window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}var He=(0,I.forwardRef)(function({onSubmit:l,onError:p,optionOverrides:x,maskCompletedText:r,className:c,apiConfig:b,columns:h,pillPlacement:_="inline",mode:n="auto",optionsPosition:m="below",animations:S=!0,dropdownTrigger:E,closeDropdownOnBlur:C,showNonTappableOptions:M,autoFocus:N=!0,onFocus:$,onBlur:T,value:a,completedParams:k,onChange:U,onParamsChange:ee,submitButton:G},te){let j=(0,I.useRef)(null),z=(0,I.useRef)(null),oe=(0,I.useRef)(()=>{}),O=(0,I.useRef)(null),se=(0,I.useRef)(null);(0,I.useEffect)(()=>{let f=j.current;if(f)return O.current?O.current.setMode(n):O.current=new pe.ModeController(f,n),()=>{O.current?.destroy(),O.current=null}},[n]);let ae=(0,I.useCallback)(f=>{let K=se.current?.current;K&&(K.focus(),(0,pe.setCursorOffset)(K,f))},[]),{completedParams:X,suggestionPills:V,setActivePill:w,segments:ne,newParamId:re,clearNewParamId:Q,placeholderText:i,isFocused:o,isDropdownOpen:s,isLoading:u,activeIndex:y,listboxId:g,handleTextChange:D,handleKeyDown:B,setFocused:q,editingParam:ge,editingAnchor:ke,caretOffset:fe,startEditingParam:t,handleCaretAfterInput:P,handleCaretMove:A,replaceEditingRange:le,dropdownProps:ue,reset:be}=ye({onSubmit:f=>oe.current(f),onError:p,optionOverrides:x,maskCompletedText:r,apiConfig:b,columns:h,dropdownTrigger:E,optionsPosition:m,closeDropdownOnBlur:C,showNonTappableOptions:M,onFocus:$,onBlur:T,value:a,completedParams:k,onChange:U,onParamsChange:ee,source:"full-sdk",setCursor:ae});(0,I.useEffect)(()=>{if(!re)return;let f=window.setTimeout(()=>Q(),650);return()=>window.clearTimeout(f)},[re,Q]);let Ke=y>=0?`${g}-option-${y}`:void 0,{inputRef:Ae,editorProps:Fe,focus:he,blur:Ce,getPlainText:De}=Be({segments:ne,newParamId:re,editingParam:ge,editingAnchor:ke,caretOffset:fe,placeholderText:i,isFocused:o,isDropdownOpen:s,listboxId:g,activeDescendantId:Ke,autoFocus:N,handleTextChange:D,handleKeyDown:B,handleCaretAfterInput:P,handleCaretMove:A,startEditingParam:t,replaceEditingRange:le,setFocused:q});se.current=Ae,(0,I.useLayoutEffect)(()=>{let f=z.current,K=Ae.current;if(!f||!K)return;let ve=()=>{let Re=f.firstElementChild;if(!Re)return;let Ve=Re.getBoundingClientRect(),qe=K.getBoundingClientRect();Ve.top>=qe.bottom-2?f.setAttribute("data-aia-pill-wrapped",""):f.removeAttribute("data-aia-pill-wrapped")};ve();let Le=new ResizeObserver(ve);return Le.observe(K),()=>Le.disconnect()},[ne,V.length,u,Ae]),(0,I.useImperativeHandle)(te,()=>({focus:he,blur:Ce,reset:be,setMode:f=>O.current?.setMode(f)}),[he,Ce,be]);let xe=!!ne.length||X.length>0,Se=(0,I.useCallback)(()=>{if(!xe)return;let f=De(),{rawQuery:K,completedParams:ve}=(0,pe.buildQuery)(f,X);l({query:f.trim(),raw_query:K,completed_params:ve}),be()},[xe,X,l,be,De]);oe.current=Se;let We=(0,I.useCallback)(f=>{f.target?.closest("[data-aia-pill]")||he()},[he]),Ne=_==="inline",Ge=_==="dropdown";return(0,R.jsxs)("div",{ref:j,className:`magicx-aia ${J.container} ${c??""}`,"data-pill-placement":_,"data-options-position":m,"data-animations":S?"on":"off","data-mode":ot(n),children:[(0,R.jsx)(_e,{...ue,showPills:Ge}),(0,R.jsxs)("div",{className:J.inputWrapper,onClick:We,children:[(0,R.jsxs)("div",{className:J.editorArea,"data-aia-editor":"",children:[(0,R.jsx)("div",{...Fe,className:J.input,"data-aia-input":""}),Ne&&(u||V.length>0)&&(0,R.jsx)("span",{ref:z,className:J.pillListContainer,"data-aia-pill-list-container":"",children:(0,R.jsx)(me,{pills:V,activePillIndex:0,onSelectPill:w,loading:u})})]}),G===null?null:G===void 0?(0,R.jsx)("button",{type:"button","data-aia-submit":"",className:J.submitButton,disabled:!xe,onClick:f=>{f.stopPropagation(),Se()},"aria-label":"Submit",children:(0,R.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",role:"img","aria-label":"Submit",children:(0,R.jsx)("path",{d:"M9 14V4M9 4L4 9M9 4L14 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}):(0,R.jsx)("span",{"data-aia-submit":"",className:J.submitSlot,onClick:f=>{xe&&(f.stopPropagation(),Se())},children:G})]})]})});0&&(module.exports={AIAutocomplete,AIAutocompleteDropdown,useAIAutocomplete});
|
|
832
830
|
//# sourceMappingURL=index.js.map
|