cosmic-ai-input 1.0.18 → 1.0.19
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.cjs.js +4 -4
- package/dist/index.es.js +72 -73
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
// Generated at: 2026-04-03T07:
|
|
2
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("react/jsx-runtime"),o=require("react"),me=require("classnames"),nt=require("react-dom");var E=(
|
|
3
|
-
`&&(e=""),e},ce=()=>{var n;let e=((n=
|
|
1
|
+
// Generated at: 2026-04-03T07:18:57.453Z
|
|
2
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("react/jsx-runtime"),o=require("react"),me=require("classnames"),nt=require("react-dom");var E=(i=>(i.INPUT="input",i.SELECT="select",i.MULTIPLE_SELECT="multiple-select",i.DATE_PICKER="date-picker",i.LABEL="label",i))(E||{});const Te=o.forwardRef(({value:i,position:a,id:r,onChange:h},B)=>{const[A,x]=o.useState(!0),$=o.useRef(null),k=o.useRef(null);o.useEffect(()=>{typeof B=="function"?B($.current):B&&(B.current=$.current)},[B]);const S=g=>{const y=g.target.value;h==null||h(y,E.DATE_PICKER)};o.useEffect(()=>{if(k.current)try{setTimeout(()=>{N()},100)}catch{}},[]);const N=()=>{if(k.current)try{k.current.showPicker()}catch{}},m=g=>{g.stopPropagation()};return A?p.jsx("div",{ref:$,id:r,style:{top:(a==null?void 0:a.top)||0,left:(a==null?void 0:a.left)||0},className:"cosmic-ai-input-datePicker",suppressHydrationWarning:!0,children:p.jsx("input",{ref:k,type:"date",value:i||"",onChange:S,onClick:m})}):null});Te.displayName="DatePicker";function de(i){const a=i.textContent||"",r=i.nextSibling;a.length?(r==null||r.setAttribute("style","display: none"),i.style.padding="2px 4px",i.style.borderTopLeftRadius="2px",i.style.borderBottomLeftRadius="2px",i.style.borderTopRightRadius="2px",i.style.borderBottomRightRadius="2px"):(r==null||r.setAttribute("style","display: inline"),i.style.padding="2px 0 2px 4px",i.style.borderTopLeftRadius="2px",i.style.borderBottomLeftRadius="2px",i.style.borderTopRightRadius="0",i.style.borderBottomRightRadius="0")}function O(i){if(i&&i.getAttribute("data-set-type")==="input"){const a=i.children[0];a.setAttribute("contenteditable","true"),requestAnimationFrame(()=>{a.focus()})}}function Le(i){i&&i.getAttribute("data-set-type")==="input"&&i.children[0].setAttribute("contenteditable","false")}function v(i){return i&&(i!=null&&i.getAttribute)?i.getAttribute("data-set-type")==="input":!1}const De=o.forwardRef(({options:i,value:a,position:r,id:h,height:B=37,onChange:A},x)=>{const[$,k]=o.useState(a||""),S=o.useRef(null);o.useEffect(()=>{typeof x=="function"?x(S.current):x&&(x.current=S.current)},[x]);const N=g=>{const y=$.split(",").filter(b=>b)||[];let w="";y.includes(g)?w=y.filter(b=>b!==g).join(","):y.length?w=`${y.join(",")},${g}`:w=g,k(w),A==null||A(w,E.MULTIPLE_SELECT)},m=$.split(",")||[];return p.jsx("div",{ref:S,className:"cosmic-ai-input-selectFloatElement",id:h,style:{position:"absolute",top:(r==null?void 0:r.top)||0,left:(r==null?void 0:r.left)||0,zIndex:5e3,maxHeight:`${B}px`},children:i.map((g,y)=>p.jsx("div",{className:`selectOption ${m.includes(g)?"selected":""}`,onClick:()=>N(g),children:g},y))})});De.displayName="MultipleSelect";const Ne=o.forwardRef(({options:i,value:a,position:r,id:h,height:B=120,onChange:A},x)=>{const[$,k]=o.useState(a||""),S=o.useRef(null);o.useEffect(()=>{typeof x=="function"?x(S.current):x&&(x.current=S.current)},[x]);const N=m=>{k(m),A==null||A(m,E.SELECT)};return p.jsx("div",{ref:S,className:"cosmic-ai-input-selectFloatElement",id:h,style:{position:"absolute",top:(r==null?void 0:r.top)||0,left:(r==null?void 0:r.left)||0,zIndex:5e3,maxHeight:`${B}px`},children:i.length>0&&i.map((m,g)=>p.jsx("div",{className:`selectOption ${$===m?"selected":""}`,onClick:()=>N(m),children:m},g))})});Ne.displayName="Select";function Re(i){const a=i instanceof Element?i:document.getElementById(i);return a&&a.children[0].textContent||""}function st(i,a){const r=i instanceof Element?i:document.getElementById(i);r&&(r.children[0].textContent=a)}function I(i){const a=document.createRange(),r=window.getSelection();r&&(!i||!(i instanceof Node)||(a.selectNodeContents(i),a.collapse(!0),r.removeAllRanges(),r.addRange(a)))}function K(i){const a=document.createRange(),r=window.getSelection();r&&(!i||!(i instanceof Node)||(a.selectNodeContents(i),a.collapse(!1),r.removeAllRanges(),r.addRange(a)))}function ue(i){const a=window.getSelection();if(!a||a.rangeCount===0)return 0;if(!i||!(i instanceof Node))return;const r=a.getRangeAt(0),h=r.cloneRange();return h.selectNodeContents(i),h.setEnd(r.startContainer,r.startOffset),h.toString().length}function it(){const i=window.getSelection();if(!i||i.rangeCount===0)return null;const r=i.getRangeAt(0).startContainer;return r.nodeType===Node.TEXT_NODE?r.parentElement:r.nodeType===Node.ELEMENT_NODE?r:null}function rt(){const i=window.getSelection();return!i||i.rangeCount===0?null:i.getRangeAt(0).getBoundingClientRect()}function ct(){return new Promise(i=>{requestAnimationFrame(()=>{i(rt())})})}function lt(){const i=window.getSelection();if(!i||i.rangeCount===0)return null;const a=i.getRangeAt(0),r=a.startContainer,h=a.startOffset;return r.nodeType===Node.TEXT_NODE?h>0?r:r.previousSibling:r.nodeType===Node.ELEMENT_NODE?h>0?r.childNodes[h-1]:r.previousSibling:null}function ot(){const i=window.getSelection();if(!i||i.rangeCount===0)return null;const a=i.getRangeAt(0),r=a.startContainer,h=a.startOffset;return r.nodeType===Node.TEXT_NODE?h<r.length?r:r.nextSibling:r.nodeType===Node.ELEMENT_NODE?h<r.childNodes.length?r.childNodes[h]:r.nextSibling:null}function at(i){return i&&!i.getAttribute("data-set-type")}function Se(){return`${Date.now()}-${Math.random().toString(36).slice(2,9)}`}const ke=o.forwardRef(({options:i,value:a,position:r,id:h,height:B=120,onChange:A},x)=>{const[$,k]=o.useState(a||""),[S,N]=o.useState(0),m=o.useRef(null),g=o.useRef(S),y=o.useCallback(w=>{k(w),A==null||A(w,E.LABEL)},[A]);return o.useEffect(()=>{typeof x=="function"?x(m.current):x&&(x.current=m.current)},[x]),o.useEffect(()=>{g.current=S},[S]),o.useEffect(()=>{N(0)},[i]),o.useEffect(()=>{const w=b=>{i.length!==0&&(b.key==="ArrowDown"?(b.preventDefault(),N(L=>L<i.length-1?L+1:L)):b.key==="ArrowUp"?(b.preventDefault(),N(L=>L>0?L-1:L)):b.key==="Enter"&&(b.preventDefault(),setTimeout(()=>{const L=g.current;L>=0&&i[L]&&y(i[L])},0)))};return document.addEventListener("keydown",w),()=>{document.removeEventListener("keydown",w)}},[i,y]),p.jsx("div",{ref:m,className:"cosmic-ai-input-selectFloatElement",id:h,style:{position:"absolute",top:(r==null?void 0:r.top)||0,left:(r==null?void 0:r.left)||0,zIndex:5e3,maxHeight:`${B}px`},children:i.length>0&&i.map((w,b)=>p.jsx("div",{className:`selectOption ${$===w?"selected":""} ${S===b?"highlighted":""}`,onClick:()=>y(w),onMouseEnter:()=>N(b),children:w},b))})});ke.displayName="Mention";const Pe=o.forwardRef((i,a)=>{const{value:r="",varList:h,placeholder:B="",maxLength:A,defaultRows:x=3,disabled:$=!1,defaultFocus:k=!1,textIndex:S=0,mentions:N=[],onFocus:m,onBlur:g,onChange:y,onClick:w,onSend:b,onKeyDown:L,onKeyUp:F,onMaxLengthExceeded:Y}=i,[dt,ut]=o.useState(r||""),[ee,U]=o.useState(""),[ft,te]=o.useState(""),[q,M]=o.useState(!1),[W,V]=o.useState({top:0,left:0}),[ne,se]=o.useState([]),[z,fe]=o.useState(""),[C,ie]=o.useState(null),[re,X]=o.useState(120),[pe,he]=o.useState(k),ge=240,Ee=240,ye=240,xe=276,R=o.useRef(null),T=o.useRef(null),j=o.useRef(null),G=o.useRef(!1),H=()=>{var n,t;let e=((t=(n=R.current)==null?void 0:n.innerText)==null?void 0:t.replace(/\u200B/g,""))||"";return e===`
|
|
3
|
+
`&&(e=""),e},ce=()=>{var n;let e=((n=R.current)==null?void 0:n.innerHTML)||"";return e==="<br>"&&(e=""),e},Be=e=>{const n=[];let t=0;const l=/\[([^\]]+)\]/g;let d;const c=Se();let u=0;if(e===""||!e||e===`
|
|
4
4
|
`)return[{type:"text",content:"",id:`text-${u++}-${c}`}];const P=new Set((h||[]).map(D=>D.name));for(;(d=l.exec(e))!==null;){if(d.index>t){const f=e.substring(t,d.index).split(`
|
|
5
5
|
`);f.forEach((Z,tt)=>{Z&&n.push({type:"text",content:Z,id:`text-${u++}-${c}`}),tt<f.length-1&&n.push({type:"newline",id:`newline-${u++}-${c}`})})}const D=d[1];if(P.has(D)){const s=h.find(f=>f.name===D);(s==null?void 0:s.type)==="input"?n.push({type:"input",name:s==null?void 0:s.name,content:(s==null?void 0:s.content)||"",placeholder:(s==null?void 0:s.placeholder)||D,id:`input-${u++}-${c}`}):(s==null?void 0:s.type)==="label"?n.push({type:"label",name:s==null?void 0:s.name,content:(s==null?void 0:s.content)||"",id:`label-${u++}-${c}`}):(s==null?void 0:s.type)==="select"?n.push({type:"select",name:s==null?void 0:s.name,content:(s==null?void 0:s.content)||"",placeholder:(s==null?void 0:s.placeholder)||D,options:(s==null?void 0:s.options)||[],id:`select-${u++}-${c}`}):(s==null?void 0:s.type)==="multiple-select"?n.push({type:"multiple-select",name:s==null?void 0:s.name,content:(s==null?void 0:s.content)||"",placeholder:(s==null?void 0:s.placeholder)||D,options:(s==null?void 0:s.options)||[],id:`multiple-select-${u++}-${c}`}):(s==null?void 0:s.type)==="date-picker"&&n.push({type:"date-picker",name:s==null?void 0:s.name,content:(s==null?void 0:s.content)||"",placeholder:(s==null?void 0:s.placeholder)||D,id:`date-picker-${u++}-${c}`})}else n.push({type:"text",content:`[${D}]`,id:`text-${u++}-${c}`});t=l.lastIndex}if(t<e.length){const s=e.substring(t).split(`
|
|
6
|
-
`);s.forEach((f,Z)=>{f&&n.push({type:"text",content:f,id:`text-${u++}`}),Z<s.length-1&&n.push({type:"newline",id:`newline-${u++}`})})}return n},le=()=>{var e;(e=A.current)==null||e.setAttribute("contenteditable","true"),T.current&&(v(T.current)&&T.current.children[0].setAttribute("contenteditable","false"),T.current=null),F(A.current)},$e=e=>{w==null||w(e)},je=e=>{le()},K=e=>{var n,t;if(G.current){H().length>0?(n=A.current)==null||n.classList.remove("is-empty"):(t=A.current)==null||t.classList.add("is-empty");return}U(H()),te(ce()),y==null||y(H()),Ze(e)},Me=e=>{var n;if(!G.current&&e.code==="Enter"&&!e.shiftKey){e.preventDefault();const t=H();if(t.length===0||(n=A.current)!=null&&n.innerHTML.match(/^<span>[\s\u200B]*(<br\s*\/?>[\s\u200B]*)+<\/span>$/))return;m?t.length<=m?b==null||b(t):Y==null||Y(t,m):b==null||b(t)}},He=e=>{var t,l,d;if(V&&(C==null?void 0:C.type)===E.LABEL&&(e.code==="ArrowUp"||e.code==="ArrowDown"||e.code==="Enter")){e.preventDefault();return}M(!1),R==null||R(e);const n=rt();if(n&&at(n)){if(e.code==="ArrowLeft"){const c=n==null?void 0:n.previousElementSibling,u=ue(n);c&&u===0&&v(c)&&c.children[0]&&(T.current=c,O(c),requestAnimationFrame(()=>{F(c.children[0])}))}if(e.code==="ArrowRight"){const c=n==null?void 0:n.nextElementSibling,u=ue(n);c&&u===((t=n.textContent)==null?void 0:t.length)&&v(c)&&c.children[0]&&(T.current=c,O(c),requestAnimationFrame(()=>{I(c.children[0])}))}(e.code==="Backspace"||((l=e==null?void 0:e.nativeEvent)==null?void 0:l.key)==="Backspace")&&(n.innerHTML===""&&e.preventDefault(),n.innerHTML==="<br>"&&(e.preventDefault(),n.innerHTML=""))}if((e.code==="Backspace"||((d=e==null?void 0:e.nativeEvent)==null?void 0:d.key)==="Backspace")&&e.target){const c=e.target;if(c.childElementCount===1&&c.children[0].tagName==="SPAN"){const u=c.children[0];c.childNodes.length===1&&(u.innerHTML===""&&e.preventDefault(),u.innerHTML==="<br>"&&(e.preventDefault(),u.innerHTML=""))}}if(n&&n.getAttribute("data-set-type")==="container"){if(e.code==="ArrowLeft"){const c=lt();v(c)&&c.children[0]&&(T.current=c,O(c),requestAnimationFrame(()=>{F(c.children[0])}))}if(e.code==="ArrowRight"){const c=ot();v(c)&&c.children[0]&&(T.current=c,O(c),requestAnimationFrame(()=>{I(c.children[0])}))}}Me(e)},Oe=e=>{if(V&&(C==null?void 0:C.type)===E.LABEL&&(e.code==="ArrowUp"||e.code==="ArrowDown"||e.code==="Enter")){e.preventDefault();return}q==null||q(e)},ve=e=>{const t=e.clipboardData.items;for(let l=0;l<t.length;l++)if(t[l].type.indexOf("image")!==-1){e.preventDefault();return}},Fe=e=>{e.preventDefault();const t=window.getSelection().toString();if(!t)return;const l=t.replace(/\u200B/g,"")||"",d=t.replace(/\u200B/g,"")||"";e.clipboardData.setData("text/plain",l),e.clipboardData.setData("text/html",d)},qe=e=>{L==null||L(e)},Ve=()=>{G.current=!0},_e=()=>{setTimeout(()=>{G.current=!1,U(H()),te(ce()),y==null||y(H())},0)},Ke=(e,n)=>{n.stopPropagation()},Ue=(e,n)=>{var l;n.stopPropagation(),T.current&&Le(T.current),(l=A.current)==null||l.setAttribute("contenteditable","false");const t=document.getElementById(e.id);T.current=t,requestAnimationFrame(()=>{O(t)})},We=(e,n)=>{var d,c,u,P,D,s;R==null||R(n),n.stopPropagation();const t=n.target,l=ue(t);if((n.code==="Backspace"||((d=n==null?void 0:n.nativeEvent)==null?void 0:d.key)==="Backspace")&&l===0){const f=(c=t.parentElement)==null?void 0:c.previousElementSibling;f&&(v(f)&&f.children[0]&&((u=f.children[0].textContent)!=null&&u.length)?(T.current=f,O(f),F(f.children[0]),requestAnimationFrame(()=>{de(f.children[0])})):(le(),F(f)))}if(n.code==="ArrowRight"&&l===((P=t.textContent)==null?void 0:P.length)){const f=(D=t.parentElement)==null?void 0:D.nextElementSibling;f&&(v(f)&&f.children[0]&&((s=f.children[0].textContent)!=null&&s.length)?(T.current=f,O(f),I(f.children[0]),requestAnimationFrame(()=>{de(f.children[0])})):(le(),I(f)))}n.code==="Enter"&&n.shiftKey&&n.preventDefault()},ze=(e,n)=>{q==null||q(n);const t=n.target;de(t)},Xe=(e,n)=>{var l;n.stopPropagation(),T.current&&Le(T.current),(l=A.current)==null||l.setAttribute("contenteditable","false");const t=document.getElementById(e.id);T.current=t,requestAnimationFrame(()=>{O(t)})},Ge=(e,n)=>{U(H()),te(ce()),y==null||y(H())},Je=(e,n)=>{};o.useEffect(()=>{if(!V)return;const e=l=>{j.current&&!j.current.contains(l.target)&&M(!1)},n=l=>{j.current&&!j.current.contains(l.target)&&M(!1)},t=()=>{M(!1)};return document.addEventListener("mousedown",e),document.addEventListener("scroll",n,!0),window.addEventListener("resize",t),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("scroll",n,!0),window.removeEventListener("resize",t)}},[V]);const J=(e,n)=>{if(C&&n!==E.LABEL&&st(C.id,e),n===E.SELECT&&(M(!1),K({})),n===E.LABEL&&(ae(),M(!1),requestAnimationFrame(()=>{const t=window.getSelection();t&&Q.current&&(t.removeAllRanges(),t.addRange(Q.current),setTimeout(()=>{var u;const l=document.createElement("span");l.contentEditable="false",l.setAttribute("data-set-type","label"),l.id=C.id;const d=document.createElement("span");d.contentEditable="false",d.textContent=e,l.appendChild(d);const c=(u=A.current)==null?void 0:u.children;if((c==null?void 0:c.length)===1&&c[0].tagName==="SPAN"&&c[0].innerHTML==="[")A.current.innerHTML="",A.current.appendChild(l),setTimeout(()=>{K({}),ae()},0);else{document.execCommand("delete",!1,void 0);const P=Q.current;P.insertNode(l),P.setStartAfter(l),P.setEndAfter(l),t.removeAllRanges(),t.addRange(P),setTimeout(()=>{K({})},0)}},0))})),n===E.MULTIPLE_SELECT||n===E.DATE_PICKER){const t=document.getElementById(C.id);t&&t.children[0]&&t.children[1]&&(e.length>0?(t.children[0].setAttribute("style","display: inline"),t.children[0].setAttribute("contenteditable","false"),t.children[1].setAttribute("style","display: none"),t.children[1].setAttribute("contenteditable","true")):(t.children[0].setAttribute("style","display: none"),t.children[0].setAttribute("contenteditable","true"),t.children[1].setAttribute("style","display: inline"),t.children[1].setAttribute("contenteditable","true"))),K({})}},Q=o.useRef(null),Qe=(N==null?void 0:N.map(e=>e.prefix))||[],Ze=e=>{const n=e==null?void 0:e.nativeEvent,t=n==null?void 0:n.data;Qe.includes(t)&&ct().then(l=>{var c;const d=window.getSelection();d&&d.rangeCount>0&&(Q.current=d.getRangeAt(0)),Ie({options:((c=N.find(u=>u.prefix===t))==null?void 0:c.options)||[],value:"",type:E.LABEL,id:"label-"+Se()},l)})},Ie=(e,n)=>{se(e.options),_({top:-999999,left:-999999999}),re(e),X(Ee),M(!0),requestAnimationFrame(()=>{if(j.current){const t=j.current.getBoundingClientRect();let l=n.left,d=n.top+n.height;window.innerWidth-n.right<ge&&n.width<t.width&&(l=n.right-t.width),n.top<t.height&&(d=n.top+n.height),_({top:d,left:l}),X(t.height)}})},be=(e,n)=>{const l=n.target.getBoundingClientRect();se(e.options),fe(e.value||Re(e.id)),_({top:-999999,left:-999999999}),re(e),X(Ee),M(!0),requestAnimationFrame(()=>{if(j.current){const d=j.current.getBoundingClientRect();let c=l.left,u=l.top+l.height;window.innerWidth-l.right<ge&&l.width<d.width&&(c=l.right-d.width),l.top<d.height&&(u=l.top+l.height),_({top:u,left:c}),X(d.height)}})},Ye=(e,n)=>{const l=n.target.getBoundingClientRect();let d=l.left,c=l.top-xe;window.innerWidth-l.right<ye&&(d=d-ye+l.width),l.top<xe&&(c=l.top+l.height),se(e.options),fe(e.value||Re(e.id)),_({top:c,left:d}),re(e),M(!0)},[et,we]=o.useState([]),[oe,Ce]=o.useState(!0),Ae=o.useCallback(()=>{Ce(!1);const e=Be(i),n=[];return e.forEach(t=>{var l,d,c,u,P,D;if(t.type==="text")n.push(p.jsx("span",{onKeyDown:s=>Je(),children:t.content},t.id));else if(t.type==="newline")n.push(p.jsx("br",{},t.id));else if(t.type==="label")n.push(p.jsx("span",{id:t.id,"data-set-type":"label",contentEditable:!1,children:p.jsx("span",{contentEditable:!1,children:t.name})},t.id));else if(t.type==="input")n.push(p.jsxs("span",{id:t.id,"data-set-type":"input",contentEditable:!1,suppressContentEditableWarning:!0,onInput:s=>Ge(),onClick:s=>Ke(t,s),onMouseDown:s=>Ue(t,s),"data-cosmic-ai-input-placeholder":t.placeholder,children:[p.jsx("span",{className:"cosmic-ai-input-inputContent",style:{padding:(l=t.content)!=null&&l.length?"2px 4px":"2px 0 2px 4px"},contentEditable:!1,onKeyDown:s=>We(t,s),onKeyUp:s=>ze(t,s),children:t.content}),p.jsx("span",{contentEditable:!1,style:{display:(d=t.content)!=null&&d.length?"none":"inline"},className:"cosmic-ai-input-placeholder",onMouseDown:s=>Xe(t,s),children:t.placeholder})]},t.id));else if(t.type===E.SELECT){const s=t.content||((c=t.options)==null?void 0:c[0])||t.placeholder;n.push(p.jsx("span",{id:t.id,"data-set-type":"select",contentEditable:!1,suppressContentEditableWarning:!0,onClick:f=>be(t,f),"data-cosmic-ai-input-placeholder":t.placeholder,children:p.jsx("span",{contentEditable:!1,children:s})},t.id))}else if(t.type===E.MULTIPLE_SELECT){const s=t.content||((u=t.options)==null?void 0:u[0]);n.push(p.jsxs("span",{id:t.id,"data-set-type":"multiple-select",contentEditable:!1,suppressContentEditableWarning:!0,onClick:f=>be(t,f),"data-cosmic-ai-input-placeholder":t.placeholder,children:[p.jsx("span",{style:{display:s!=null&&s.length?"inline":"none"},contentEditable:!1,children:s}),p.jsx("span",{style:{display:s!=null&&s.length?"none":"inline"},className:"cosmic-ai-input-selectPlaceholder",contentEditable:!1,children:t.placeholder})]},t.id))}else t.type===E.DATE_PICKER&&n.push(p.jsxs("span",{id:t.id,"data-set-type":"date-picker",contentEditable:!1,suppressContentEditableWarning:!0,onClick:s=>Ye(t,s),"data-cosmic-ai-input-placeholder":t.placeholder,children:[p.jsx("span",{style:{display:(P=t.content)!=null&&P.length?"inline":"none"},contentEditable:!1,children:t.content}),p.jsx("span",{style:{display:(D=t.content)!=null&&D.length?"none":"inline"},className:"cosmic-ai-input-datePickerPlaceholder",contentEditable:!1,children:t.placeholder})]},t.id))}),setTimeout(()=>{Ce(!0)},0),n},[i]);o.useEffect(()=>{oe&&setTimeout(()=>{F(A.current)},0)},[oe]),o.useEffect(()=>{i!==ee?(we(Ae()),U(i),he(!0)):(i===""||!i)&&we(Ae())},[i,ee]),o.useEffect(()=>{if(!k&&!pe)return;const e=new MutationObserver(()=>{A.current&&document.contains(A.current)&&(requestAnimationFrame(()=>{F(A.current),he(!1)}),e.disconnect())});return A.current&&e.observe(document.body,{childList:!0,subtree:!0}),()=>e.disconnect()},[k,pe]);const ae=()=>{A.current&&requestAnimationFrame(()=>{})};return o.useImperativeHandle(a,()=>({getCurrentValue:H,focus:ae})),p.jsxs("div",{className:me(`cosmic-ai-input-rows${x}`),style:{textIndent:S+"px"},children:[oe&&p.jsx("div",{"data-set-type":"container","data-cosmic-ai-input-placeholder":B,className:me("cosmic-ai-input",`cosmic-ai-input-rows${x}`,{"is-disabled":$},{"is-empty":ee.length===0}),ref:A,contentEditable:!0,suppressContentEditableWarning:!0,onClick:e=>$e(e),onFocus:e=>{qe(e)},onBlur:e=>{g==null||g(e)},onMouseDown:e=>je(),onKeyDown:e=>He(e),onKeyUp:e=>Oe(e),onInput:e=>K(e),onCopy:e=>Fe(e),onPaste:e=>ve(e),onCompositionStart:Ve,onCompositionEnd:_e,children:et}),V&&nt.createPortal((C==null?void 0:C.type)===E.MULTIPLE_SELECT?p.jsx(De,{ref:j,options:ne,value:z,position:W,height:ie,onChange:J},E.MULTIPLE_SELECT):(C==null?void 0:C.type)===E.DATE_PICKER?p.jsx(Te,{ref:j,value:z,position:W,onChange:J},E.DATE_PICKER):(C==null?void 0:C.type)===E.LABEL?p.jsx(ke,{ref:j,options:ne,value:z,position:W,height:ie,onChange:J},E.LABEL):p.jsx(Ne,{ref:j,options:ne,value:z,position:W,height:ie,onChange:J},E.SELECT),document.body)]})});Pe.displayName="AiInput";exports.default=Pe;
|
|
6
|
+
`);s.forEach((f,Z)=>{f&&n.push({type:"text",content:f,id:`text-${u++}`}),Z<s.length-1&&n.push({type:"newline",id:`newline-${u++}`})})}return n},le=()=>{var e;(e=R.current)==null||e.setAttribute("contenteditable","true"),T.current&&(v(T.current)&&T.current.children[0].setAttribute("contenteditable","false"),T.current=null),K(R.current)},$e=e=>{w==null||w(e)},je=e=>{le()},_=e=>{var n,t;if(G.current){H().length>0?(n=R.current)==null||n.classList.remove("is-empty"):(t=R.current)==null||t.classList.add("is-empty");return}U(H()),te(ce()),y==null||y(H()),Ze(e)},Me=e=>{var n;if(!G.current&&e.code==="Enter"&&!e.shiftKey){e.preventDefault();const t=H();if(t.length===0||(n=R.current)!=null&&n.innerHTML.match(/^<span>[\s\u200B]*(<br\s*\/?>[\s\u200B]*)+<\/span>$/))return;A?t.length<=A?b==null||b(t):Y==null||Y(t,A):b==null||b(t)}},He=e=>{var t,l,d;if(q&&(C==null?void 0:C.type)===E.LABEL&&(e.code==="ArrowUp"||e.code==="ArrowDown"||e.code==="Enter")){e.preventDefault();return}M(!1),L==null||L(e);const n=it();if(n&&at(n)){if(e.code==="ArrowLeft"){const c=n==null?void 0:n.previousElementSibling,u=ue(n);c&&u===0&&v(c)&&c.children[0]&&(T.current=c,O(c),requestAnimationFrame(()=>{K(c.children[0])}))}if(e.code==="ArrowRight"){const c=n==null?void 0:n.nextElementSibling,u=ue(n);c&&u===((t=n.textContent)==null?void 0:t.length)&&v(c)&&c.children[0]&&(T.current=c,O(c),requestAnimationFrame(()=>{I(c.children[0])}))}(e.code==="Backspace"||((l=e==null?void 0:e.nativeEvent)==null?void 0:l.key)==="Backspace")&&(n.innerHTML===""&&e.preventDefault(),n.innerHTML==="<br>"&&(e.preventDefault(),n.innerHTML=""))}if((e.code==="Backspace"||((d=e==null?void 0:e.nativeEvent)==null?void 0:d.key)==="Backspace")&&e.target){const c=e.target;if(c.childElementCount===1&&c.children[0].tagName==="SPAN"){const u=c.children[0];c.childNodes.length===1&&(u.innerHTML===""&&e.preventDefault(),u.innerHTML==="<br>"&&(e.preventDefault(),u.innerHTML=""))}}if(n&&n.getAttribute("data-set-type")==="container"){if(e.code==="ArrowLeft"){const c=lt();v(c)&&c.children[0]&&(T.current=c,O(c),requestAnimationFrame(()=>{K(c.children[0])}))}if(e.code==="ArrowRight"){const c=ot();v(c)&&c.children[0]&&(T.current=c,O(c),requestAnimationFrame(()=>{I(c.children[0])}))}}Me(e)},Oe=e=>{if(q&&(C==null?void 0:C.type)===E.LABEL&&(e.code==="ArrowUp"||e.code==="ArrowDown"||e.code==="Enter")){e.preventDefault();return}F==null||F(e)},ve=e=>{const t=e.clipboardData.items;for(let l=0;l<t.length;l++)if(t[l].type.indexOf("image")!==-1){e.preventDefault();return}},Fe=e=>{e.preventDefault();const t=window.getSelection().toString();if(!t)return;const l=t.replace(/\u200B/g,"")||"",d=t.replace(/\u200B/g,"")||"";e.clipboardData.setData("text/plain",l),e.clipboardData.setData("text/html",d)},qe=e=>{m==null||m(e)},Ve=()=>{G.current=!0},_e=()=>{setTimeout(()=>{G.current=!1,U(H()),te(ce()),y==null||y(H())},0)},Ke=(e,n)=>{n.stopPropagation()},Ue=(e,n)=>{var l;n.stopPropagation(),T.current&&Le(T.current),(l=R.current)==null||l.setAttribute("contenteditable","false");const t=document.getElementById(e.id);T.current=t,requestAnimationFrame(()=>{O(t)})},We=(e,n)=>{var d,c,u,P,D,s;L==null||L(n),n.stopPropagation();const t=n.target,l=ue(t);if((n.code==="Backspace"||((d=n==null?void 0:n.nativeEvent)==null?void 0:d.key)==="Backspace")&&l===0){const f=(c=t.parentElement)==null?void 0:c.previousElementSibling;f&&(v(f)&&f.children[0]&&((u=f.children[0].textContent)!=null&&u.length)?(T.current=f,O(f),K(f.children[0]),requestAnimationFrame(()=>{de(f.children[0])})):(le(),K(f)))}if(n.code==="ArrowRight"&&l===((P=t.textContent)==null?void 0:P.length)){const f=(D=t.parentElement)==null?void 0:D.nextElementSibling;f&&(v(f)&&f.children[0]&&((s=f.children[0].textContent)!=null&&s.length)?(T.current=f,O(f),I(f.children[0]),requestAnimationFrame(()=>{de(f.children[0])})):(le(),I(f)))}n.code==="Enter"&&n.shiftKey&&n.preventDefault()},ze=(e,n)=>{F==null||F(n);const t=n.target;de(t)},Xe=(e,n)=>{var l;n.stopPropagation(),T.current&&Le(T.current),(l=R.current)==null||l.setAttribute("contenteditable","false");const t=document.getElementById(e.id);T.current=t,requestAnimationFrame(()=>{O(t)})},Ge=(e,n)=>{U(H()),te(ce()),y==null||y(H())},Je=(e,n)=>{};o.useEffect(()=>{if(!q)return;const e=l=>{j.current&&!j.current.contains(l.target)&&M(!1)},n=l=>{j.current&&!j.current.contains(l.target)&&M(!1)},t=()=>{M(!1)};return document.addEventListener("mousedown",e),document.addEventListener("scroll",n,!0),window.addEventListener("resize",t),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("scroll",n,!0),window.removeEventListener("resize",t)}},[q]);const J=(e,n)=>{if(C&&n!==E.LABEL&&st(C.id,e),n===E.SELECT&&(M(!1),_({})),n===E.LABEL&&(ae(),M(!1),requestAnimationFrame(()=>{const t=window.getSelection();t&&Q.current&&(t.removeAllRanges(),t.addRange(Q.current),setTimeout(()=>{var u;const l=document.createElement("span");l.contentEditable="false",l.setAttribute("data-set-type","label"),l.id=C.id;const d=document.createElement("span");d.contentEditable="false",d.textContent=e,l.appendChild(d);const c=(u=R.current)==null?void 0:u.children;if((c==null?void 0:c.length)===1&&c[0].tagName==="SPAN"&&c[0].innerHTML==="[")R.current.innerHTML="",R.current.appendChild(l),setTimeout(()=>{_({}),ae()},0);else{document.execCommand("delete",!1,void 0);const P=Q.current;P.insertNode(l),P.setStartAfter(l),P.setEndAfter(l),t.removeAllRanges(),t.addRange(P),setTimeout(()=>{_({})},0)}},0))})),n===E.MULTIPLE_SELECT||n===E.DATE_PICKER){const t=document.getElementById(C.id);t&&t.children[0]&&t.children[1]&&(e.length>0?(t.children[0].setAttribute("style","display: inline"),t.children[0].setAttribute("contenteditable","false"),t.children[1].setAttribute("style","display: none"),t.children[1].setAttribute("contenteditable","true")):(t.children[0].setAttribute("style","display: none"),t.children[0].setAttribute("contenteditable","true"),t.children[1].setAttribute("style","display: inline"),t.children[1].setAttribute("contenteditable","true"))),_({})}},Q=o.useRef(null),Qe=(N==null?void 0:N.map(e=>e.prefix))||[],Ze=e=>{const n=e==null?void 0:e.nativeEvent,t=n==null?void 0:n.data;Qe.includes(t)&&ct().then(l=>{var c;const d=window.getSelection();d&&d.rangeCount>0&&(Q.current=d.getRangeAt(0)),Ie({options:((c=N.find(u=>u.prefix===t))==null?void 0:c.options)||[],value:"",type:E.LABEL,id:"label-"+Se()},l)})},Ie=(e,n)=>{se(e.options),V({top:-999999,left:-999999999}),ie(e),X(Ee),M(!0),requestAnimationFrame(()=>{if(j.current){const t=j.current.getBoundingClientRect();let l=n.left,d=n.top+n.height;window.innerWidth-n.right<ge&&n.width<t.width&&(l=n.right-t.width),n.top<t.height&&(d=n.top+n.height),V({top:d,left:l}),X(t.height)}})},be=(e,n)=>{const l=n.target.getBoundingClientRect();se(e.options),fe(e.value||Re(e.id)),V({top:-999999,left:-999999999}),ie(e),X(Ee),M(!0),requestAnimationFrame(()=>{if(j.current){const d=j.current.getBoundingClientRect();let c=l.left,u=l.top+l.height;window.innerWidth-l.right<ge&&l.width<d.width&&(c=l.right-d.width),l.top<d.height&&(u=l.top+l.height),V({top:u,left:c}),X(d.height)}})},Ye=(e,n)=>{const l=n.target.getBoundingClientRect();let d=l.left,c=l.top-xe;window.innerWidth-l.right<ye&&(d=d-ye+l.width),l.top<xe&&(c=l.top+l.height),se(e.options),fe(e.value||Re(e.id)),V({top:c,left:d}),ie(e),M(!0)},[et,we]=o.useState([]),[oe,Ce]=o.useState(!0),Ae=o.useCallback(()=>{Ce(!1);const e=Be(r),n=[];return e.forEach(t=>{var l,d,c,u,P,D;if(t.type==="text")n.push(p.jsx("span",{onKeyDown:s=>Je(),children:t.content},t.id));else if(t.type==="newline")n.push(p.jsx("br",{},t.id));else if(t.type==="label")n.push(p.jsx("span",{id:t.id,"data-set-type":"label",contentEditable:!1,children:p.jsx("span",{contentEditable:!1,children:t.name})},t.id));else if(t.type==="input")n.push(p.jsxs("span",{id:t.id,"data-set-type":"input",contentEditable:!1,suppressContentEditableWarning:!0,onInput:s=>Ge(),onClick:s=>Ke(t,s),onMouseDown:s=>Ue(t,s),"data-cosmic-ai-input-placeholder":t.placeholder,children:[p.jsx("span",{className:"cosmic-ai-input-inputContent",style:{padding:(l=t.content)!=null&&l.length?"2px 4px":"2px 0 2px 4px"},contentEditable:!1,onKeyDown:s=>We(t,s),onKeyUp:s=>ze(t,s),children:t.content}),p.jsx("span",{contentEditable:!1,style:{display:(d=t.content)!=null&&d.length?"none":"inline"},className:"cosmic-ai-input-placeholder",onMouseDown:s=>Xe(t,s),children:t.placeholder})]},t.id));else if(t.type===E.SELECT){const s=t.content||((c=t.options)==null?void 0:c[0])||t.placeholder;n.push(p.jsx("span",{id:t.id,"data-set-type":"select",contentEditable:!1,suppressContentEditableWarning:!0,onClick:f=>be(t,f),"data-cosmic-ai-input-placeholder":t.placeholder,children:p.jsx("span",{contentEditable:!1,children:s})},t.id))}else if(t.type===E.MULTIPLE_SELECT){const s=t.content||((u=t.options)==null?void 0:u[0]);n.push(p.jsxs("span",{id:t.id,"data-set-type":"multiple-select",contentEditable:!1,suppressContentEditableWarning:!0,onClick:f=>be(t,f),"data-cosmic-ai-input-placeholder":t.placeholder,children:[p.jsx("span",{style:{display:s!=null&&s.length?"inline":"none"},contentEditable:!1,children:s}),p.jsx("span",{style:{display:s!=null&&s.length?"none":"inline"},className:"cosmic-ai-input-selectPlaceholder",contentEditable:!1,children:t.placeholder})]},t.id))}else t.type===E.DATE_PICKER&&n.push(p.jsxs("span",{id:t.id,"data-set-type":"date-picker",contentEditable:!1,suppressContentEditableWarning:!0,onClick:s=>Ye(t,s),"data-cosmic-ai-input-placeholder":t.placeholder,children:[p.jsx("span",{style:{display:(P=t.content)!=null&&P.length?"inline":"none"},contentEditable:!1,children:t.content}),p.jsx("span",{style:{display:(D=t.content)!=null&&D.length?"none":"inline"},className:"cosmic-ai-input-datePickerPlaceholder",contentEditable:!1,children:t.placeholder})]},t.id))}),setTimeout(()=>{Ce(!0)},0),n},[r]);o.useEffect(()=>{oe&&setTimeout(()=>{},0)},[oe]),o.useEffect(()=>{r!==ee?(we(Ae()),U(r),he(!0)):(r===""||!r)&&we(Ae())},[r,ee]),o.useEffect(()=>{if(!k&&!pe)return;const e=new MutationObserver(()=>{R.current&&document.contains(R.current)&&(requestAnimationFrame(()=>{he(!1)}),e.disconnect())});return R.current&&e.observe(document.body,{childList:!0,subtree:!0}),()=>e.disconnect()},[k,pe]);const ae=()=>{R.current&&requestAnimationFrame(()=>{})};return o.useImperativeHandle(a,()=>({getCurrentValue:H,focus:ae})),p.jsxs("div",{className:me(`cosmic-ai-input-rows${x}`),style:{textIndent:S+"px"},children:[oe&&p.jsx("div",{"data-set-type":"container","data-cosmic-ai-input-placeholder":B,className:me("cosmic-ai-input",`cosmic-ai-input-rows${x}`,{"is-disabled":$},{"is-empty":ee.length===0}),ref:R,contentEditable:!0,suppressContentEditableWarning:!0,onClick:e=>$e(e),onFocus:e=>{qe(e)},onBlur:e=>{g==null||g(e)},onMouseDown:e=>je(),onKeyDown:e=>He(e),onKeyUp:e=>Oe(e),onInput:e=>_(e),onCopy:e=>Fe(e),onPaste:e=>ve(e),onCompositionStart:Ve,onCompositionEnd:_e,children:et}),q&&nt.createPortal((C==null?void 0:C.type)===E.MULTIPLE_SELECT?p.jsx(De,{ref:j,options:ne,value:z,position:W,height:re,onChange:J},E.MULTIPLE_SELECT):(C==null?void 0:C.type)===E.DATE_PICKER?p.jsx(Te,{ref:j,value:z,position:W,onChange:J},E.DATE_PICKER):(C==null?void 0:C.type)===E.LABEL?p.jsx(ke,{ref:j,options:ne,value:z,position:W,height:re,onChange:J},E.LABEL):p.jsx(Ne,{ref:j,options:ne,value:z,position:W,height:re,onChange:J},E.SELECT),document.body)]})});Pe.displayName="AiInput";exports.default=Pe;
|
package/dist/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Generated at: 2026-04-03T07:
|
|
1
|
+
// Generated at: 2026-04-03T07:18:56.876Z
|
|
2
2
|
import { jsx as f, jsxs as te } from "react/jsx-runtime";
|
|
3
3
|
import { forwardRef as j, useState as T, useRef as O, useEffect as H, useCallback as Pe, useImperativeHandle as st } from "react";
|
|
4
4
|
import De from "classnames";
|
|
@@ -6,7 +6,7 @@ import { createPortal as ct } from "react-dom";
|
|
|
6
6
|
var g = /* @__PURE__ */ ((r) => (r.INPUT = "input", r.SELECT = "select", r.MULTIPLE_SELECT = "multiple-select", r.DATE_PICKER = "date-picker", r.LABEL = "label", r))(g || {});
|
|
7
7
|
const Be = j(
|
|
8
8
|
({ value: r, position: o, id: l, onChange: p }, B) => {
|
|
9
|
-
const [
|
|
9
|
+
const [C, y] = T(!0), $ = O(null), k = O(null);
|
|
10
10
|
H(() => {
|
|
11
11
|
typeof B == "function" ? B($.current) : B && (B.current = $.current);
|
|
12
12
|
}, [B]);
|
|
@@ -29,10 +29,10 @@ const Be = j(
|
|
|
29
29
|
k.current.showPicker();
|
|
30
30
|
} catch {
|
|
31
31
|
}
|
|
32
|
-
},
|
|
32
|
+
}, A = (h) => {
|
|
33
33
|
h.stopPropagation();
|
|
34
34
|
};
|
|
35
|
-
return
|
|
35
|
+
return C ? /* @__PURE__ */ f(
|
|
36
36
|
"div",
|
|
37
37
|
{
|
|
38
38
|
ref: $,
|
|
@@ -50,7 +50,7 @@ const Be = j(
|
|
|
50
50
|
type: "date",
|
|
51
51
|
value: r || "",
|
|
52
52
|
onChange: R,
|
|
53
|
-
onClick:
|
|
53
|
+
onClick: A
|
|
54
54
|
}
|
|
55
55
|
)
|
|
56
56
|
}
|
|
@@ -82,7 +82,7 @@ const $e = j(({
|
|
|
82
82
|
position: l,
|
|
83
83
|
id: p,
|
|
84
84
|
height: B = 37,
|
|
85
|
-
onChange:
|
|
85
|
+
onChange: C
|
|
86
86
|
}, y) => {
|
|
87
87
|
const [$, k] = T(o || ""), R = O(null);
|
|
88
88
|
H(() => {
|
|
@@ -91,8 +91,8 @@ const $e = j(({
|
|
|
91
91
|
const N = (h) => {
|
|
92
92
|
const E = $.split(",").filter((b) => b) || [];
|
|
93
93
|
let m = "";
|
|
94
|
-
E.includes(h) ? m = E.filter((b) => b !== h).join(",") : E.length ? m = `${E.join(",")},${h}` : m = h, k(m),
|
|
95
|
-
},
|
|
94
|
+
E.includes(h) ? m = E.filter((b) => b !== h).join(",") : E.length ? m = `${E.join(",")},${h}` : m = h, k(m), C == null || C(m, g.MULTIPLE_SELECT);
|
|
95
|
+
}, A = $.split(",") || [];
|
|
96
96
|
return /* @__PURE__ */ f(
|
|
97
97
|
"div",
|
|
98
98
|
{
|
|
@@ -109,7 +109,7 @@ const $e = j(({
|
|
|
109
109
|
children: r.map((h, E) => /* @__PURE__ */ f(
|
|
110
110
|
"div",
|
|
111
111
|
{
|
|
112
|
-
className: `selectOption ${
|
|
112
|
+
className: `selectOption ${A.includes(h) ? "selected" : ""}`,
|
|
113
113
|
onClick: () => N(h),
|
|
114
114
|
children: h
|
|
115
115
|
},
|
|
@@ -125,14 +125,14 @@ const Me = j(({
|
|
|
125
125
|
position: l,
|
|
126
126
|
id: p,
|
|
127
127
|
height: B = 120,
|
|
128
|
-
onChange:
|
|
128
|
+
onChange: C
|
|
129
129
|
}, y) => {
|
|
130
130
|
const [$, k] = T(o || ""), R = O(null);
|
|
131
131
|
H(() => {
|
|
132
132
|
typeof y == "function" ? y(R.current) : y && (y.current = R.current);
|
|
133
133
|
}, [y]);
|
|
134
|
-
const N = (
|
|
135
|
-
k(
|
|
134
|
+
const N = (A) => {
|
|
135
|
+
k(A), C == null || C(A, g.SELECT);
|
|
136
136
|
};
|
|
137
137
|
return /* @__PURE__ */ f(
|
|
138
138
|
"div",
|
|
@@ -147,12 +147,12 @@ const Me = j(({
|
|
|
147
147
|
zIndex: 5e3,
|
|
148
148
|
maxHeight: `${B}px`
|
|
149
149
|
},
|
|
150
|
-
children: r.length > 0 && r.map((
|
|
150
|
+
children: r.length > 0 && r.map((A, h) => /* @__PURE__ */ f(
|
|
151
151
|
"div",
|
|
152
152
|
{
|
|
153
|
-
className: `selectOption ${$ ===
|
|
154
|
-
onClick: () => N(
|
|
155
|
-
children:
|
|
153
|
+
className: `selectOption ${$ === A ? "selected" : ""}`,
|
|
154
|
+
onClick: () => N(A),
|
|
155
|
+
children: A
|
|
156
156
|
},
|
|
157
157
|
h
|
|
158
158
|
))
|
|
@@ -172,7 +172,7 @@ function ne(r) {
|
|
|
172
172
|
const o = document.createRange(), l = window.getSelection();
|
|
173
173
|
l && (!r || !(r instanceof Node) || (o.selectNodeContents(r), o.collapse(!0), l.removeAllRanges(), l.addRange(o)));
|
|
174
174
|
}
|
|
175
|
-
function
|
|
175
|
+
function z(r) {
|
|
176
176
|
const o = document.createRange(), l = window.getSelection();
|
|
177
177
|
l && (!r || !(r instanceof Node) || (o.selectNodeContents(r), o.collapse(!1), l.removeAllRanges(), l.addRange(o)));
|
|
178
178
|
}
|
|
@@ -227,22 +227,22 @@ const He = j(({
|
|
|
227
227
|
position: l,
|
|
228
228
|
id: p,
|
|
229
229
|
height: B = 120,
|
|
230
|
-
onChange:
|
|
230
|
+
onChange: C
|
|
231
231
|
}, y) => {
|
|
232
|
-
const [$, k] = T(o || ""), [R, N] = T(0),
|
|
233
|
-
k(m),
|
|
234
|
-
}, [
|
|
232
|
+
const [$, k] = T(o || ""), [R, N] = T(0), A = O(null), h = O(R), E = Pe((m) => {
|
|
233
|
+
k(m), C == null || C(m, g.LABEL);
|
|
234
|
+
}, [C]);
|
|
235
235
|
return H(() => {
|
|
236
|
-
typeof y == "function" ? y(
|
|
236
|
+
typeof y == "function" ? y(A.current) : y && (y.current = A.current);
|
|
237
237
|
}, [y]), H(() => {
|
|
238
238
|
h.current = R;
|
|
239
239
|
}, [R]), H(() => {
|
|
240
240
|
N(0);
|
|
241
241
|
}, [r]), H(() => {
|
|
242
242
|
const m = (b) => {
|
|
243
|
-
r.length !== 0 && (b.key === "ArrowDown" ? (b.preventDefault(), N((
|
|
244
|
-
const
|
|
245
|
-
|
|
243
|
+
r.length !== 0 && (b.key === "ArrowDown" ? (b.preventDefault(), N((x) => x < r.length - 1 ? x + 1 : x)) : b.key === "ArrowUp" ? (b.preventDefault(), N((x) => x > 0 ? x - 1 : x)) : b.key === "Enter" && (b.preventDefault(), setTimeout(() => {
|
|
244
|
+
const x = h.current;
|
|
245
|
+
x >= 0 && r[x] && E(r[x]);
|
|
246
246
|
}, 0)));
|
|
247
247
|
};
|
|
248
248
|
return document.addEventListener("keydown", m), () => {
|
|
@@ -251,7 +251,7 @@ const He = j(({
|
|
|
251
251
|
}, [r, E]), /* @__PURE__ */ f(
|
|
252
252
|
"div",
|
|
253
253
|
{
|
|
254
|
-
ref:
|
|
254
|
+
ref: A,
|
|
255
255
|
className: "cosmic-ai-input-selectFloatElement",
|
|
256
256
|
id: p,
|
|
257
257
|
style: {
|
|
@@ -280,28 +280,28 @@ const gt = j((r, o) => {
|
|
|
280
280
|
value: l = "",
|
|
281
281
|
varList: p,
|
|
282
282
|
placeholder: B = "",
|
|
283
|
-
maxLength:
|
|
283
|
+
maxLength: C,
|
|
284
284
|
defaultRows: y = 3,
|
|
285
285
|
disabled: $ = !1,
|
|
286
286
|
defaultFocus: k = !1,
|
|
287
287
|
textIndex: R = 0,
|
|
288
288
|
mentions: N = [],
|
|
289
|
-
onFocus:
|
|
289
|
+
onFocus: A,
|
|
290
290
|
onBlur: h,
|
|
291
291
|
onChange: E,
|
|
292
292
|
onClick: m,
|
|
293
293
|
onSend: b,
|
|
294
|
-
onKeyDown:
|
|
295
|
-
onKeyUp:
|
|
294
|
+
onKeyDown: x,
|
|
295
|
+
onKeyUp: _,
|
|
296
296
|
onMaxLengthExceeded: ie
|
|
297
|
-
} = r, [Et, yt] = T(l || ""), [re, X] = T(""), [bt, le] = T(""), [
|
|
297
|
+
} = r, [Et, yt] = T(l || ""), [re, X] = T(""), [bt, le] = T(""), [K, F] = T(!1), [G, U] = T({ top: 0, left: 0 }), [se, ce] = T([]), [J, Ee] = T(""), [w, oe] = T(null), [ae, Q] = T(120), [ye, be] = T(k), me = 240, we = 240, Ce = 240, Ae = 276, L = O(null), D = O(null), M = O(null), Z = O(!1), v = () => {
|
|
298
298
|
var n, t;
|
|
299
|
-
let e = ((t = (n =
|
|
299
|
+
let e = ((t = (n = L.current) == null ? void 0 : n.innerText) == null ? void 0 : t.replace(/\u200B/g, "")) || "";
|
|
300
300
|
return e === `
|
|
301
301
|
` && (e = ""), e;
|
|
302
302
|
}, de = () => {
|
|
303
303
|
var n;
|
|
304
|
-
let e = ((n =
|
|
304
|
+
let e = ((n = L.current) == null ? void 0 : n.innerHTML) || "";
|
|
305
305
|
return e === "<br>" && (e = ""), e;
|
|
306
306
|
}, Oe = (e) => {
|
|
307
307
|
const n = [];
|
|
@@ -395,18 +395,18 @@ const gt = j((r, o) => {
|
|
|
395
395
|
return n;
|
|
396
396
|
}, ue = () => {
|
|
397
397
|
var e;
|
|
398
|
-
(e =
|
|
398
|
+
(e = L.current) == null || e.setAttribute("contenteditable", "true"), D.current && (q(D.current) && D.current.children[0].setAttribute(
|
|
399
399
|
"contenteditable",
|
|
400
400
|
"false"
|
|
401
|
-
), D.current = null),
|
|
401
|
+
), D.current = null), z(L.current);
|
|
402
402
|
}, Fe = (e) => {
|
|
403
403
|
m == null || m(e);
|
|
404
404
|
}, ve = (e) => {
|
|
405
405
|
ue();
|
|
406
|
-
},
|
|
406
|
+
}, W = (e) => {
|
|
407
407
|
var n, t;
|
|
408
408
|
if (Z.current) {
|
|
409
|
-
v().length > 0 ? (n =
|
|
409
|
+
v().length > 0 ? (n = L.current) == null || n.classList.remove("is-empty") : (t = L.current) == null || t.classList.add("is-empty");
|
|
410
410
|
return;
|
|
411
411
|
}
|
|
412
412
|
X(v()), le(de()), E == null || E(v()), tt(e);
|
|
@@ -415,25 +415,25 @@ const gt = j((r, o) => {
|
|
|
415
415
|
if (!Z.current && e.code === "Enter" && !e.shiftKey) {
|
|
416
416
|
e.preventDefault();
|
|
417
417
|
const t = v();
|
|
418
|
-
if (t.length === 0 || (n =
|
|
418
|
+
if (t.length === 0 || (n = L.current) != null && n.innerHTML.match(
|
|
419
419
|
/^<span>[\s\u200B]*(<br\s*\/?>[\s\u200B]*)+<\/span>$/
|
|
420
420
|
))
|
|
421
421
|
return;
|
|
422
|
-
|
|
422
|
+
C ? t.length <= C ? b == null || b(t) : ie == null || ie(t, C) : b == null || b(t);
|
|
423
423
|
}
|
|
424
424
|
}, qe = (e) => {
|
|
425
425
|
var t, c, a;
|
|
426
|
-
if (
|
|
426
|
+
if (K && (w == null ? void 0 : w.type) === g.LABEL && (e.code === "ArrowUp" || e.code === "ArrowDown" || e.code === "Enter")) {
|
|
427
427
|
e.preventDefault();
|
|
428
428
|
return;
|
|
429
429
|
}
|
|
430
|
-
F(!1),
|
|
430
|
+
F(!1), x == null || x(e);
|
|
431
431
|
const n = at();
|
|
432
432
|
if (n && ht(n)) {
|
|
433
433
|
if (e.code === "ArrowLeft") {
|
|
434
434
|
const s = n == null ? void 0 : n.previousElementSibling, d = ge(n);
|
|
435
435
|
s && d === 0 && q(s) && s.children[0] && (D.current = s, V(s), requestAnimationFrame(() => {
|
|
436
|
-
|
|
436
|
+
z(s.children[0]);
|
|
437
437
|
}));
|
|
438
438
|
}
|
|
439
439
|
if (e.code === "ArrowRight") {
|
|
@@ -455,7 +455,7 @@ const gt = j((r, o) => {
|
|
|
455
455
|
if (e.code === "ArrowLeft") {
|
|
456
456
|
const s = ft();
|
|
457
457
|
q(s) && s.children[0] && (D.current = s, V(s), requestAnimationFrame(() => {
|
|
458
|
-
|
|
458
|
+
z(s.children[0]);
|
|
459
459
|
}));
|
|
460
460
|
}
|
|
461
461
|
if (e.code === "ArrowRight") {
|
|
@@ -467,11 +467,11 @@ const gt = j((r, o) => {
|
|
|
467
467
|
}
|
|
468
468
|
Ve(e);
|
|
469
469
|
}, _e = (e) => {
|
|
470
|
-
if (
|
|
470
|
+
if (K && (w == null ? void 0 : w.type) === g.LABEL && (e.code === "ArrowUp" || e.code === "ArrowDown" || e.code === "Enter")) {
|
|
471
471
|
e.preventDefault();
|
|
472
472
|
return;
|
|
473
473
|
}
|
|
474
|
-
|
|
474
|
+
_ == null || _(e);
|
|
475
475
|
}, Ke = (e) => {
|
|
476
476
|
const t = e.clipboardData.items;
|
|
477
477
|
for (let c = 0; c < t.length; c++)
|
|
@@ -486,7 +486,7 @@ const gt = j((r, o) => {
|
|
|
486
486
|
const c = t.replace(/\u200B/g, "") || "", a = t.replace(/\u200B/g, "") || "";
|
|
487
487
|
e.clipboardData.setData("text/plain", c), e.clipboardData.setData("text/html", a);
|
|
488
488
|
}, We = (e) => {
|
|
489
|
-
|
|
489
|
+
A == null || A(e);
|
|
490
490
|
}, ze = () => {
|
|
491
491
|
Z.current = !0;
|
|
492
492
|
}, je = () => {
|
|
@@ -497,20 +497,20 @@ const gt = j((r, o) => {
|
|
|
497
497
|
n.stopPropagation();
|
|
498
498
|
}, Ge = (e, n) => {
|
|
499
499
|
var c;
|
|
500
|
-
n.stopPropagation(), D.current && Se(D.current), (c =
|
|
500
|
+
n.stopPropagation(), D.current && Se(D.current), (c = L.current) == null || c.setAttribute("contenteditable", "false");
|
|
501
501
|
const t = document.getElementById(e.id);
|
|
502
502
|
D.current = t, requestAnimationFrame(() => {
|
|
503
503
|
V(t);
|
|
504
504
|
});
|
|
505
505
|
}, Je = (e, n) => {
|
|
506
506
|
var a, s, d, P, S, i;
|
|
507
|
-
|
|
507
|
+
x == null || x(n), n.stopPropagation();
|
|
508
508
|
const t = n.target, c = ge(t);
|
|
509
509
|
if ((n.code === "Backspace" || ((a = n == null ? void 0 : n.nativeEvent) == null ? void 0 : a.key) === "Backspace") && c === 0) {
|
|
510
510
|
const u = (s = t.parentElement) == null ? void 0 : s.previousElementSibling;
|
|
511
|
-
u && (q(u) && u.children[0] && ((d = u.children[0].textContent) != null && d.length) ? (D.current = u, V(u),
|
|
511
|
+
u && (q(u) && u.children[0] && ((d = u.children[0].textContent) != null && d.length) ? (D.current = u, V(u), z(u.children[0]), requestAnimationFrame(() => {
|
|
512
512
|
he(u.children[0]);
|
|
513
|
-
})) : (ue(),
|
|
513
|
+
})) : (ue(), z(u)));
|
|
514
514
|
}
|
|
515
515
|
if (n.code === "ArrowRight" && c === ((P = t.textContent) == null ? void 0 : P.length)) {
|
|
516
516
|
const u = (S = t.parentElement) == null ? void 0 : S.nextElementSibling;
|
|
@@ -520,12 +520,12 @@ const gt = j((r, o) => {
|
|
|
520
520
|
}
|
|
521
521
|
n.code === "Enter" && n.shiftKey && n.preventDefault();
|
|
522
522
|
}, Qe = (e, n) => {
|
|
523
|
-
|
|
523
|
+
_ == null || _(n);
|
|
524
524
|
const t = n.target;
|
|
525
525
|
he(t);
|
|
526
526
|
}, Ze = (e, n) => {
|
|
527
527
|
var c;
|
|
528
|
-
n.stopPropagation(), D.current && Se(D.current), (c =
|
|
528
|
+
n.stopPropagation(), D.current && Se(D.current), (c = L.current) == null || c.setAttribute("contenteditable", "false");
|
|
529
529
|
const t = document.getElementById(e.id);
|
|
530
530
|
D.current = t, requestAnimationFrame(() => {
|
|
531
531
|
V(t);
|
|
@@ -535,7 +535,7 @@ const gt = j((r, o) => {
|
|
|
535
535
|
}, Ye = (e, n) => {
|
|
536
536
|
};
|
|
537
537
|
H(() => {
|
|
538
|
-
if (!
|
|
538
|
+
if (!K) return;
|
|
539
539
|
const e = (c) => {
|
|
540
540
|
M.current && !M.current.contains(c.target) && F(!1);
|
|
541
541
|
}, n = (c) => {
|
|
@@ -546,9 +546,9 @@ const gt = j((r, o) => {
|
|
|
546
546
|
return document.addEventListener("mousedown", e), document.addEventListener("scroll", n, !0), window.addEventListener("resize", t), () => {
|
|
547
547
|
document.removeEventListener("mousedown", e), document.removeEventListener("scroll", n, !0), window.removeEventListener("resize", t);
|
|
548
548
|
};
|
|
549
|
-
}, [
|
|
549
|
+
}, [K]);
|
|
550
550
|
const I = (e, n) => {
|
|
551
|
-
if (w && n !== g.LABEL && ot(w.id, e), n === g.SELECT && (F(!1),
|
|
551
|
+
if (w && n !== g.LABEL && ot(w.id, e), n === g.SELECT && (F(!1), W({})), n === g.LABEL && (pe(), F(!1), requestAnimationFrame(() => {
|
|
552
552
|
const t = window.getSelection();
|
|
553
553
|
t && Y.current && (t.removeAllRanges(), t.addRange(Y.current), setTimeout(() => {
|
|
554
554
|
var d;
|
|
@@ -556,16 +556,16 @@ const gt = j((r, o) => {
|
|
|
556
556
|
c.contentEditable = "false", c.setAttribute("data-set-type", "label"), c.id = w.id;
|
|
557
557
|
const a = document.createElement("span");
|
|
558
558
|
a.contentEditable = "false", a.textContent = e, c.appendChild(a);
|
|
559
|
-
const s = (d =
|
|
559
|
+
const s = (d = L.current) == null ? void 0 : d.children;
|
|
560
560
|
if ((s == null ? void 0 : s.length) === 1 && s[0].tagName === "SPAN" && s[0].innerHTML === "[")
|
|
561
|
-
|
|
562
|
-
|
|
561
|
+
L.current.innerHTML = "", L.current.appendChild(c), setTimeout(() => {
|
|
562
|
+
W({}), pe();
|
|
563
563
|
}, 0);
|
|
564
564
|
else {
|
|
565
565
|
document.execCommand("delete", !1, void 0);
|
|
566
566
|
const P = Y.current;
|
|
567
567
|
P.insertNode(c), P.setStartAfter(c), P.setEndAfter(c), t.removeAllRanges(), t.addRange(P), setTimeout(() => {
|
|
568
|
-
|
|
568
|
+
W({});
|
|
569
569
|
}, 0);
|
|
570
570
|
}
|
|
571
571
|
}, 0));
|
|
@@ -573,7 +573,7 @@ const gt = j((r, o) => {
|
|
|
573
573
|
const t = document.getElementById(
|
|
574
574
|
w.id
|
|
575
575
|
);
|
|
576
|
-
t && t.children[0] && t.children[1] && (e.length > 0 ? (t.children[0].setAttribute("style", "display: inline"), t.children[0].setAttribute("contenteditable", "false"), t.children[1].setAttribute("style", "display: none"), t.children[1].setAttribute("contenteditable", "true")) : (t.children[0].setAttribute("style", "display: none"), t.children[0].setAttribute("contenteditable", "true"), t.children[1].setAttribute("style", "display: inline"), t.children[1].setAttribute("contenteditable", "true"))),
|
|
576
|
+
t && t.children[0] && t.children[1] && (e.length > 0 ? (t.children[0].setAttribute("style", "display: inline"), t.children[0].setAttribute("contenteditable", "false"), t.children[1].setAttribute("style", "display: none"), t.children[1].setAttribute("contenteditable", "true")) : (t.children[0].setAttribute("style", "display: none"), t.children[0].setAttribute("contenteditable", "true"), t.children[1].setAttribute("style", "display: inline"), t.children[1].setAttribute("contenteditable", "true"))), W({});
|
|
577
577
|
}
|
|
578
578
|
}, Y = O(null), et = (N == null ? void 0 : N.map((e) => e.prefix)) || [], tt = (e) => {
|
|
579
579
|
const n = e == null ? void 0 : e.nativeEvent, t = n == null ? void 0 : n.data;
|
|
@@ -588,26 +588,26 @@ const gt = j((r, o) => {
|
|
|
588
588
|
}, c);
|
|
589
589
|
});
|
|
590
590
|
}, nt = (e, n) => {
|
|
591
|
-
ce(e.options),
|
|
591
|
+
ce(e.options), U({ top: -999999, left: -999999999 }), oe(e), Q(we), F(!0), requestAnimationFrame(() => {
|
|
592
592
|
if (M.current) {
|
|
593
593
|
const t = M.current.getBoundingClientRect();
|
|
594
594
|
let c = n.left, a = n.top + n.height;
|
|
595
|
-
window.innerWidth - n.right < me && n.width < t.width && (c = n.right - t.width), n.top < t.height && (a = n.top + n.height),
|
|
595
|
+
window.innerWidth - n.right < me && n.width < t.width && (c = n.right - t.width), n.top < t.height && (a = n.top + n.height), U({ top: a, left: c }), Q(t.height);
|
|
596
596
|
}
|
|
597
597
|
});
|
|
598
598
|
}, xe = (e, n) => {
|
|
599
599
|
const c = n.target.getBoundingClientRect();
|
|
600
|
-
ce(e.options), Ee(e.value || Ne(e.id)),
|
|
600
|
+
ce(e.options), Ee(e.value || Ne(e.id)), U({ top: -999999, left: -999999999 }), oe(e), Q(we), F(!0), requestAnimationFrame(() => {
|
|
601
601
|
if (M.current) {
|
|
602
602
|
const a = M.current.getBoundingClientRect();
|
|
603
603
|
let s = c.left, d = c.top + c.height;
|
|
604
|
-
window.innerWidth - c.right < me && c.width < a.width && (s = c.right - a.width), c.top < a.height && (d = c.top + c.height),
|
|
604
|
+
window.innerWidth - c.right < me && c.width < a.width && (s = c.right - a.width), c.top < a.height && (d = c.top + c.height), U({ top: d, left: s }), Q(a.height);
|
|
605
605
|
}
|
|
606
606
|
});
|
|
607
607
|
}, it = (e, n) => {
|
|
608
608
|
const c = n.target.getBoundingClientRect();
|
|
609
609
|
let a = c.left, s = c.top - Ae;
|
|
610
|
-
window.innerWidth - c.right < Ce && (a = a - Ce + c.width), c.top < Ae && (s = c.top + c.height), ce(e.options), Ee(e.value || Ne(e.id)),
|
|
610
|
+
window.innerWidth - c.right < Ce && (a = a - Ce + c.width), c.top < Ae && (s = c.top + c.height), ce(e.options), Ee(e.value || Ne(e.id)), U({ top: s, left: a }), oe(e), F(!0);
|
|
611
611
|
}, [rt, Le] = T([]), [fe, Te] = T(!0), Re = Pe(() => {
|
|
612
612
|
Te(!1);
|
|
613
613
|
const e = Oe(l), n = [];
|
|
@@ -771,21 +771,20 @@ const gt = j((r, o) => {
|
|
|
771
771
|
}, [l]);
|
|
772
772
|
H(() => {
|
|
773
773
|
fe && setTimeout(() => {
|
|
774
|
-
_(C.current);
|
|
775
774
|
}, 0);
|
|
776
775
|
}, [fe]), H(() => {
|
|
777
776
|
l !== re ? (Le(Re()), X(l), be(!0)) : (l === "" || !l) && Le(Re());
|
|
778
777
|
}, [l, re]), H(() => {
|
|
779
778
|
if (!k && !ye) return;
|
|
780
779
|
const e = new MutationObserver(() => {
|
|
781
|
-
|
|
782
|
-
|
|
780
|
+
L.current && document.contains(L.current) && (requestAnimationFrame(() => {
|
|
781
|
+
be(!1);
|
|
783
782
|
}), e.disconnect());
|
|
784
783
|
});
|
|
785
|
-
return
|
|
784
|
+
return L.current && e.observe(document.body, { childList: !0, subtree: !0 }), () => e.disconnect();
|
|
786
785
|
}, [k, ye]);
|
|
787
786
|
const pe = () => {
|
|
788
|
-
|
|
787
|
+
L.current && requestAnimationFrame(() => {
|
|
789
788
|
});
|
|
790
789
|
};
|
|
791
790
|
return st(o, () => ({
|
|
@@ -804,7 +803,7 @@ const gt = j((r, o) => {
|
|
|
804
803
|
{ "is-disabled": $ },
|
|
805
804
|
{ "is-empty": re.length === 0 }
|
|
806
805
|
),
|
|
807
|
-
ref:
|
|
806
|
+
ref: L,
|
|
808
807
|
contentEditable: !0,
|
|
809
808
|
suppressContentEditableWarning: !0,
|
|
810
809
|
onClick: (e) => Fe(e),
|
|
@@ -817,7 +816,7 @@ const gt = j((r, o) => {
|
|
|
817
816
|
onMouseDown: (e) => ve(),
|
|
818
817
|
onKeyDown: (e) => qe(e),
|
|
819
818
|
onKeyUp: (e) => _e(e),
|
|
820
|
-
onInput: (e) =>
|
|
819
|
+
onInput: (e) => W(e),
|
|
821
820
|
onCopy: (e) => Ue(e),
|
|
822
821
|
onPaste: (e) => Ke(e),
|
|
823
822
|
onCompositionStart: ze,
|
|
@@ -825,7 +824,7 @@ const gt = j((r, o) => {
|
|
|
825
824
|
children: rt
|
|
826
825
|
}
|
|
827
826
|
),
|
|
828
|
-
|
|
827
|
+
K && ct(
|
|
829
828
|
(w == null ? void 0 : w.type) === g.MULTIPLE_SELECT ? /* @__PURE__ */ f(
|
|
830
829
|
$e,
|
|
831
830
|
{
|
package/package.json
CHANGED