cosmic-ai-input 1.0.6 → 1.0.8

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 CHANGED
@@ -1,6 +1,6 @@
1
- // Generated at: 2026-01-16T02:43:07.012Z
2
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("react/jsx-runtime"),i=require("react"),xe=require("classnames"),_e=require("react-dom"),we=i.forwardRef(({value:c,position:r,id:s,onChange:a},S)=>{const[b,w]=i.useState(!0),k=i.useRef(null),R=i.useRef(null);i.useEffect(()=>{typeof S=="function"?S(k.current):S&&(S.current=k.current)},[S]);const m=u=>{console.log("DatePicker handleChange",u);const y=u.target.value;a==null||a(y,"date-picker")};i.useEffect(()=>{if(R.current)try{setTimeout(()=>{N()},100)}catch(u){console.log("无法自动打开日期选择器,浏览器安全策略限制",u)}},[]);const N=()=>{if(R.current)try{R.current.showPicker()}catch(u){console.log("点击后无法打开日期选择器",u)}},g=u=>{u.stopPropagation(),console.log("DatePicker handleClick",u)};return b?p.jsx("div",{ref:k,id:s,style:{top:(r==null?void 0:r.top)||0,left:(r==null?void 0:r.left)||0},className:"cosmic-ai-input-datePicker",suppressHydrationWarning:!0,children:p.jsx("input",{ref:R,type:"date",value:c||"",onChange:m,onClick:g})}):null});we.displayName="DatePicker";function Y(c){const r=c.textContent||"",s=c.nextSibling;r.length?(s==null||s.setAttribute("style","display: none"),c.style.padding="2px 4px",c.style.borderTopLeftRadius="2px",c.style.borderBottomLeftRadius="2px",c.style.borderTopRightRadius="2px",c.style.borderBottomRightRadius="2px"):(s==null||s.setAttribute("style","display: inline"),c.style.padding="2px 0 2px 4px",c.style.borderTopLeftRadius="2px",c.style.borderBottomLeftRadius="2px",c.style.borderTopRightRadius="0",c.style.borderBottomRightRadius="0")}function j(c){if(c&&c.getAttribute("data-set-type")==="input"){const r=c.children[0];r.setAttribute("contenteditable","true"),requestAnimationFrame(()=>{r.focus()})}}function Ee(c){c&&c.getAttribute("data-set-type")==="input"&&c.children[0].setAttribute("contenteditable","false")}function P(c){return c&&c.getAttribute("data-set-type")==="input"}const Ce=i.forwardRef(({options:c,value:r,position:s,id:a,height:S=37,onChange:b},w)=>{const[k,R]=i.useState(r||""),m=i.useRef(null);i.useEffect(()=>{typeof w=="function"?w(m.current):w&&(w.current=m.current)},[w]);const N=u=>{const y=k.split(",").filter(T=>T)||[];let F="";y.includes(u)?F=y.filter(T=>T!==u).join(","):(console.log("handleOptionClick",y),y.length?F=`${y.join(",")},${u}`:F=u),R(F),b==null||b(F,"multiple-select")},g=k.split(",")||[];return p.jsx("div",{ref:m,className:"cosmic-ai-input-selectFloatElement",id:a,style:{position:"absolute",top:(s==null?void 0:s.top)||0,left:(s==null?void 0:s.left)||0,zIndex:5e3,maxHeight:`${S}px`},children:c.map((u,y)=>p.jsx("div",{className:`selectOption ${g.includes(u)?"selected":""}`,onClick:()=>N(u),children:u},y))})});Ce.displayName="MultipleSelect";const me=i.forwardRef(({options:c,value:r,position:s,id:a,height:S=120,onChange:b},w)=>{const[k,R]=i.useState(r||""),m=i.useRef(null);i.useEffect(()=>{typeof w=="function"?w(m.current):w&&(w.current=m.current)},[w]);const N=g=>{R(g),b==null||b(g,"select")};return p.jsx("div",{ref:m,className:"cosmic-ai-input-selectFloatElement",id:a,style:{position:"absolute",top:(s==null?void 0:s.top)||0,left:(s==null?void 0:s.left)||0,zIndex:5e3,maxHeight:`${S}px`},children:c.length>0&&c.map((g,u)=>p.jsx("div",{className:`selectOption ${k===g?"selected":""}`,onClick:()=>N(g),children:g},u))})});me.displayName="Select";function be(c){const r=c instanceof Element?c:document.getElementById(c);return r&&r.children[0].textContent||""}function ze(c,r){const s=c instanceof Element?c:document.getElementById(c);s&&(s.children[0].textContent=r)}function V(c){const r=document.createRange(),s=window.getSelection();if(!s){console.error("无法获取selection对象");return}try{r.selectNodeContents(c),r.collapse(!0),s.removeAllRanges(),s.addRange(r)}catch(a){console.error("设置光标位置失败:",a)}}function M(c){const r=document.createRange(),s=window.getSelection();if(!s){console.error("无法获取selection对象");return}try{r.selectNodeContents(c),r.collapse(!1),s.removeAllRanges(),s.addRange(r)}catch(a){console.error("设置光标位置失败:",a)}}function Z(c){const r=window.getSelection();if(!r||r.rangeCount===0)return 0;const s=r.getRangeAt(0);try{const a=s.cloneRange();return a.selectNodeContents(c),a.setEnd(s.startContainer,s.startOffset),a.toString().length}catch(a){return console.error("获取光标位置失败:",a),0}}function ve(){const c=window.getSelection();if(!c||c.rangeCount===0)return null;const s=c.getRangeAt(0).startContainer;return s.nodeType===Node.TEXT_NODE?s.parentElement:s.nodeType===Node.ELEMENT_NODE?s:null}function Ue(){const c=window.getSelection();if(!c||c.rangeCount===0)return null;const r=c.getRangeAt(0),s=r.startContainer,a=r.startOffset;return s.nodeType===Node.TEXT_NODE?a>0?s:s.previousSibling:s.nodeType===Node.ELEMENT_NODE?a>0?s.childNodes[a-1]:s.previousSibling:null}function Xe(){const c=window.getSelection();if(!c||c.rangeCount===0)return null;const r=c.getRangeAt(0),s=r.startContainer,a=r.startOffset;return s.nodeType===Node.TEXT_NODE?a<s.length?s:s.nextSibling:s.nodeType===Node.ELEMENT_NODE?a<s.childNodes.length?s.childNodes[a]:s.nextSibling:null}function Ge(c){return c&&!c.getAttribute("data-set-type")}const Re=i.forwardRef((c,r)=>{const{value:s="",varList:a,placeholder:S="",maxLength:b,defaultRows:w=3,disabled:k=!1,defaultFocus:R=!1,onFocus:m,onBlur:N,onChange:g,onClick:u,onSend:y,onParse:F,onKeyDown:T,onKeyUp:O,onMaxLengthExceeded:K}=c,[Je,Qe]=i.useState(s||""),[W,_]=i.useState(""),[Ye,I]=i.useState(""),[z,H]=i.useState(!1),[v,U]=i.useState({top:0,left:0}),[ee,te]=i.useState([]),[X,ne]=i.useState(""),[L,le]=i.useState(null),[oe,se]=i.useState(120),[ce,re]=i.useState(R),Se=240,Ae=240,ie=240,ae=276,C=i.useRef(null),x=i.useRef(null),D=i.useRef(null),B=()=>{var l,n;let e=((n=(l=C.current)==null?void 0:l.innerText)==null?void 0:n.replace(/\u200B/g,""))||"";return e===`
3
- `&&(e=""),e},de=()=>{var l;let e=((l=C.current)==null?void 0:l.innerHTML)||"";return e==="<br>"&&(e=""),e},ke=e=>{const l=[];let n=0;const o=/\[([^\]]+)\]/g;let d;const f=`${Date.now()}-${Math.random().toString(36).slice(2,9)}`;let h=0;if(e===""||!e||e===`
4
- `)return[{type:"text",content:"​",id:`text-${h++}-${f}`}];const $=new Set((a||[]).map(E=>E.name));for(;(d=o.exec(e))!==null;){if(d.index>n){const A=e.substring(n,d.index).split(`
5
- `);A.forEach((q,We)=>{q&&l.push({type:"text",content:q,id:`text-${h++}-${f}`}),We<A.length-1&&l.push({type:"newline",id:`newline-${h++}-${f}`})})}const E=d[1];if($.has(E)){const t=a.find(A=>A.name===E);(t==null?void 0:t.type)==="input"?l.push({type:"input",name:t==null?void 0:t.name,content:(t==null?void 0:t.content)||"",placeholder:(t==null?void 0:t.placeholder)||E,id:`input-${h++}-${f}`}):(t==null?void 0:t.type)==="select"?l.push({type:"select",name:t==null?void 0:t.name,content:(t==null?void 0:t.content)||"",placeholder:(t==null?void 0:t.placeholder)||E,options:(t==null?void 0:t.options)||[],id:`select-${h++}-${f}`}):(t==null?void 0:t.type)==="multiple-select"?l.push({type:"multiple-select",name:t==null?void 0:t.name,content:(t==null?void 0:t.content)||"",placeholder:(t==null?void 0:t.placeholder)||E,options:(t==null?void 0:t.options)||[],id:`multiple-select-${h++}-${f}`}):(t==null?void 0:t.type)==="date-picker"&&l.push({type:"date-picker",name:t==null?void 0:t.name,content:(t==null?void 0:t.content)||"",placeholder:(t==null?void 0:t.placeholder)||E,id:`date-picker-${h++}-${f}`})}else l.push({type:"text",content:`[${E}]`,id:`text-${h++}-${f}`});n=o.lastIndex}if(n<e.length){const t=e.substring(n).split(`
6
- `);t.forEach((A,q)=>{A&&l.push({type:"text",content:A,id:`text-${h++}`}),q<t.length-1&&l.push({type:"newline",id:`newline-${h++}`})})}return l},G=()=>{var e;(e=C.current)==null||e.setAttribute("contenteditable","true"),x.current&&(P(x.current)&&x.current.children[0].setAttribute("contenteditable","false"),x.current=null),M(C.current)},Te=e=>{console.log("handleEditorClick",e),u==null||u(e)},De=e=>{console.log("handleEditorMouseDown",e),G()},ue=e=>{console.log("handleEditorInput",e),_(B()),I(de()),g==null||g(B())},Ne=e=>{var l,n;if(e.code==="Enter"&&!e.shiftKey){e.preventDefault();const o=B();if(console.log("onSend",o,"maxLength:",b,"length:",o.length),o.length===0||(console.log("containerRef.current?.innerHTML",(l=C.current)==null?void 0:l.innerHTML),(n=C.current)!=null&&n.innerHTML.match(/^<span>[\s\u200B]*(<br\s*\/?>[\s\u200B]*)+<\/span>$/)))return;b?o.length<=b?y==null||y(o):(console.log("maxLength exceeded",o,b),K==null||K(o,b)):y==null||y(o)}},Le=e=>{var n;console.log("handleEditorKeyDown",e),T==null||T(e);const l=ve();if(l&&Ge(l)){if(e.code==="ArrowLeft"){const o=l==null?void 0:l.previousElementSibling,d=Z(l);o&&d===0&&P(o)&&o.children[0]&&(x.current=o,j(o),requestAnimationFrame(()=>{M(o.children[0])}))}if(e.code==="ArrowRight"){const o=l==null?void 0:l.nextElementSibling,d=Z(l);o&&d===((n=l.textContent)==null?void 0:n.length)&&P(o)&&o.children[0]&&(x.current=o,j(o),requestAnimationFrame(()=>{V(o.children[0])}))}e.code==="Backspace"&&(l.innerHTML==="​"&&e.preventDefault(),l.innerHTML==="<br>"&&(e.preventDefault(),l.innerHTML="​"))}if(l&&l.getAttribute("data-set-type")==="container"){if(e.code==="ArrowLeft"){const o=Ue();P(o)&&o.children[0]&&(x.current=o,j(o),requestAnimationFrame(()=>{M(o.children[0])}))}if(e.code==="ArrowRight"){const o=Xe();P(o)&&o.children[0]&&(x.current=o,j(o),requestAnimationFrame(()=>{V(o.children[0])}))}}Ne(e)},$e=e=>{console.log("handleEditorKeyUp",e),O==null||O(e)},je=e=>{e.preventDefault();const n=window.getSelection().toString();if(!n)return;const o=n,d=n;e.clipboardData.setData("text/plain",o),e.clipboardData.setData("text/html",d)},Pe=e=>{m==null||m(e)},Me=(e,l)=>{l.stopPropagation(),console.log("handleInputClick",e)},Fe=(e,l)=>{var o;l.stopPropagation(),console.log("handleInputMouseDown",e,l),x.current&&Ee(x.current),(o=C.current)==null||o.setAttribute("contenteditable","false");const n=document.getElementById(e.id);x.current=n,requestAnimationFrame(()=>{j(n)})},Oe=(e,l)=>{var d,f,h,$,E;console.log("handleInputKeyDown",e,l),T==null||T(l),l.stopPropagation();const n=l.target,o=Z(n);if(l.code==="Backspace"&&o===0){const t=(d=n.parentElement)==null?void 0:d.previousElementSibling;console.log("previousElement",t),t&&(P(t)&&t.children[0]&&((f=t.children[0].textContent)!=null&&f.length)?(x.current=t,j(t),M(t.children[0]),requestAnimationFrame(()=>{Y(t.children[0])})):(G(),M(t)))}if(l.code==="ArrowRight"&&o===((h=n.textContent)==null?void 0:h.length)){const t=($=n.parentElement)==null?void 0:$.nextElementSibling;console.log("nextElement",t),t&&(P(t)&&t.children[0]&&((E=t.children[0].textContent)!=null&&E.length)?(x.current=t,j(t),V(t.children[0]),requestAnimationFrame(()=>{Y(t.children[0])})):(G(),V(t)))}},He=(e,l)=>{console.log("handleInputKeyUp",e,l),O==null||O(l);const n=l.target;Y(n)},Be=(e,l)=>{var o;l.stopPropagation(),console.log("handlePlaceholderMouseDown",e),x.current&&Ee(x.current),(o=C.current)==null||o.setAttribute("contenteditable","false");const n=document.getElementById(e.id);x.current=n,requestAnimationFrame(()=>{j(n)})},qe=(e,l)=>{console.log("handleInputChange",e,l),_(B()),I(de()),g==null||g(B())},Ve=(e,l)=>{console.log("handleTextSpanKeyDown 不生效",e,l)};i.useEffect(()=>{if(!z)return;const e=o=>{D.current&&!D.current.contains(o.target)&&H(!1)},l=o=>{D.current&&!D.current.contains(o.target)&&H(!1)},n=()=>{H(!1)};return document.addEventListener("mousedown",e),document.addEventListener("scroll",l,!0),window.addEventListener("resize",n),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("scroll",l,!0),window.removeEventListener("resize",n)}},[z]);const J=(e,l)=>{if(console.log("handleFloatChange",e,l),L&&ze(L.id,e),l==="select"&&H(!1),l==="multiple-select"||l==="date-picker"){const n=document.getElementById(L.id);n&&n.children[0]&&n.children[1]&&(e.length>0?(n.children[0].setAttribute("style","display: inline"),n.children[0].setAttribute("contenteditable","false"),n.children[1].setAttribute("style","display: none"),n.children[1].setAttribute("contenteditable","true")):(n.children[0].setAttribute("style","display: none"),n.children[0].setAttribute("contenteditable","true"),n.children[1].setAttribute("style","display: inline"),n.children[1].setAttribute("contenteditable","true")))}ue({})},pe=(e,l)=>{console.log("handleSelectClick",e,l);const o=l.target.getBoundingClientRect();te(e.options),ne(e.value||be(e.id)),U({top:-999999,left:-999999999}),le(e),se(Ae),H(!0),requestAnimationFrame(()=>{if(D.current){console.log("currentFloatElementRef.current",D.current);const d=D.current.getBoundingClientRect();let f=o.left,h=o.top+o.height;window.innerWidth-o.right<Se&&o.width<d.width&&(f=o.right-d.width),o.top<d.height&&(h=o.top+o.height),U({top:h,left:f}),se(d.height)}})},Ke=(e,l)=>{console.log("handleDatePickerClick",e,l);const o=l.target.getBoundingClientRect();let d=o.left,f=o.top-ae;window.innerWidth-o.right<ie&&(d=d-ie+o.width),o.top<ae&&(f=o.top+o.height),te(e.options),ne(e.value||be(e.id)),U({top:f,left:d}),le(e),H(!0)},[fe,he]=i.useState([]),[Q,ge]=i.useState(!0),ye=i.useCallback(()=>{ge(!1);const e=ke(s),l=[];return e.forEach(n=>{var o,d,f,h,$,E;if(n.type==="text")l.push(p.jsx("span",{onKeyDown:t=>Ve(n,t),children:n.content},n.id));else if(n.type==="newline")l.push(p.jsx("br",{},n.id));else if(n.type==="input")l.push(p.jsxs("span",{id:n.id,"data-set-type":"input",contentEditable:!1,suppressContentEditableWarning:!0,onInput:t=>qe(n,t),onClick:t=>Me(n,t),onMouseDown:t=>Fe(n,t),"data-cosmic-ai-input-placeholder":n.placeholder,children:[p.jsx("span",{className:"cosmic-ai-input-inputContent",style:{padding:(o=n.content)!=null&&o.length?"2px 4px":"2px 0 2px 4px"},contentEditable:!1,onKeyDown:t=>Oe(n,t),onKeyUp:t=>He(n,t),children:n.content}),p.jsx("span",{contentEditable:!1,style:{display:(d=n.content)!=null&&d.length?"none":"inline"},className:"cosmic-ai-input-placeholder",onMouseDown:t=>Be(n,t),children:n.placeholder})]},n.id));else if(n.type==="select"){const t=n.content||((f=n.options)==null?void 0:f[0])||n.placeholder;l.push(p.jsx("span",{id:n.id,"data-set-type":"select",contentEditable:!1,suppressContentEditableWarning:!0,onClick:A=>pe(n,A),"data-cosmic-ai-input-placeholder":n.placeholder,children:p.jsx("span",{contentEditable:!1,children:t})},n.id))}else if(n.type==="multiple-select"){const t=n.content||((h=n.options)==null?void 0:h[0]);l.push(p.jsxs("span",{id:n.id,"data-set-type":"multiple-select",contentEditable:!1,suppressContentEditableWarning:!0,onClick:A=>pe(n,A),"data-cosmic-ai-input-placeholder":n.placeholder,children:[p.jsx("span",{style:{display:t!=null&&t.length?"inline":"none"},contentEditable:!1,children:t}),p.jsx("span",{style:{display:t!=null&&t.length?"none":"inline"},className:"cosmic-ai-input-selectPlaceholder",contentEditable:!1,children:n.placeholder})]},n.id))}else n.type==="date-picker"&&l.push(p.jsxs("span",{id:n.id,"data-set-type":"date-picker",contentEditable:!1,suppressContentEditableWarning:!0,onClick:t=>Ke(n,t),"data-cosmic-ai-input-placeholder":n.placeholder,children:[p.jsx("span",{style:{display:($=n.content)!=null&&$.length?"inline":"none"},contentEditable:!1,children:n.content}),p.jsx("span",{style:{display:(E=n.content)!=null&&E.length?"none":"inline"},className:"cosmic-ai-input-datePickerPlaceholder",contentEditable:!1,children:n.placeholder})]},n.id))}),setTimeout(()=>{ge(!0)},0),console.log("重新渲染 ============================>","elements",l,"parsed",e,s),l},[s]);return i.useEffect(()=>{Q&&setTimeout(()=>{M(C.current)},0)},[Q]),i.useEffect(()=>{s!==W?(he(ye()),_(s),re(!0)):(s===""||!s)&&he(ye())},[s,W]),i.useEffect(()=>{if(!R&&!ce)return;const e=new MutationObserver(()=>{C.current&&document.contains(C.current)&&(requestAnimationFrame(()=>{M(C.current),re(!1)}),e.disconnect())});return C.current&&e.observe(document.body,{childList:!0,subtree:!0}),()=>e.disconnect()},[R,ce]),i.useImperativeHandle(r,()=>({getCurrentValue:B})),console.log("renderElements",fe),p.jsxs("div",{className:xe(`cosmic-ai-input-rows${w}`),children:[Q&&p.jsx("div",{"data-set-type":"container","data-cosmic-ai-input-placeholder":S,className:xe("cosmic-ai-input",`cosmic-ai-input-rows${w}`,{"is-disabled":k},{"is-empty":W.length===0}),ref:C,contentEditable:!0,suppressContentEditableWarning:!0,onClick:e=>Te(e),onFocus:e=>{Pe(e)},onBlur:e=>{N==null||N(e)},onMouseDown:e=>De(e),onKeyDown:e=>Le(e),onKeyUp:e=>$e(e),onInput:e=>ue(e),onCopy:e=>je(e),children:fe}),z&&_e.createPortal((L==null?void 0:L.type)==="multiple-select"?p.jsx(Ce,{ref:D,options:ee,value:X,position:v,height:oe,onChange:J},"multiple-select"):(L==null?void 0:L.type)==="date-picker"?p.jsx(we,{ref:D,value:X,position:v,onChange:J},"date-picker"):p.jsx(me,{ref:D,options:ee,value:X,position:v,height:oe,onChange:J},"select"),document.body)]})});Re.displayName="AiInput";exports.default=Re;
1
+ // Generated at: 2026-01-16T03:24:55.032Z
2
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react/jsx-runtime"),i=require("react"),xe=require("classnames"),ze=require("react-dom"),we=i.forwardRef(({value:c,position:r,id:s,onChange:p},S)=>{const[w,C]=i.useState(!0),k=i.useRef(null),R=i.useRef(null);i.useEffect(()=>{typeof S=="function"?S(k.current):S&&(S.current=k.current)},[S]);const m=d=>{console.log("DatePicker handleChange",d);const y=d.target.value;p==null||p(y,"date-picker")};i.useEffect(()=>{if(R.current)try{setTimeout(()=>{T()},100)}catch(d){console.log("无法自动打开日期选择器,浏览器安全策略限制",d)}},[]);const T=()=>{if(R.current)try{R.current.showPicker()}catch(d){console.log("点击后无法打开日期选择器",d)}},g=d=>{d.stopPropagation(),console.log("DatePicker handleClick",d)};return w?u.jsx("div",{ref:k,id:s,style:{top:(r==null?void 0:r.top)||0,left:(r==null?void 0:r.left)||0},className:"cosmic-ai-input-datePicker",suppressHydrationWarning:!0,children:u.jsx("input",{ref:R,type:"date",value:c||"",onChange:m,onClick:g})}):null});we.displayName="DatePicker";function Y(c){const r=c.textContent||"",s=c.nextSibling;r.length?(s==null||s.setAttribute("style","display: none"),c.style.padding="2px 4px",c.style.borderTopLeftRadius="2px",c.style.borderBottomLeftRadius="2px",c.style.borderTopRightRadius="2px",c.style.borderBottomRightRadius="2px"):(s==null||s.setAttribute("style","display: inline"),c.style.padding="2px 0 2px 4px",c.style.borderTopLeftRadius="2px",c.style.borderBottomLeftRadius="2px",c.style.borderTopRightRadius="0",c.style.borderBottomRightRadius="0")}function M(c){if(c&&c.getAttribute("data-set-type")==="input"){const r=c.children[0];r.setAttribute("contenteditable","true"),requestAnimationFrame(()=>{r.focus()})}}function Ee(c){c&&c.getAttribute("data-set-type")==="input"&&c.children[0].setAttribute("contenteditable","false")}function P(c){return c&&c.getAttribute("data-set-type")==="input"}const Ce=i.forwardRef(({options:c,value:r,position:s,id:p,height:S=37,onChange:w},C)=>{const[k,R]=i.useState(r||""),m=i.useRef(null);i.useEffect(()=>{typeof C=="function"?C(m.current):C&&(C.current=m.current)},[C]);const T=d=>{const y=k.split(",").filter(D=>D)||[];let F="";y.includes(d)?F=y.filter(D=>D!==d).join(","):(console.log("handleOptionClick",y),y.length?F=`${y.join(",")},${d}`:F=d),R(F),w==null||w(F,"multiple-select")},g=k.split(",")||[];return u.jsx("div",{ref:m,className:"cosmic-ai-input-selectFloatElement",id:p,style:{position:"absolute",top:(s==null?void 0:s.top)||0,left:(s==null?void 0:s.left)||0,zIndex:5e3,maxHeight:`${S}px`},children:c.map((d,y)=>u.jsx("div",{className:`selectOption ${g.includes(d)?"selected":""}`,onClick:()=>T(d),children:d},y))})});Ce.displayName="MultipleSelect";const me=i.forwardRef(({options:c,value:r,position:s,id:p,height:S=120,onChange:w},C)=>{const[k,R]=i.useState(r||""),m=i.useRef(null);i.useEffect(()=>{typeof C=="function"?C(m.current):C&&(C.current=m.current)},[C]);const T=g=>{R(g),w==null||w(g,"select")};return u.jsx("div",{ref:m,className:"cosmic-ai-input-selectFloatElement",id:p,style:{position:"absolute",top:(s==null?void 0:s.top)||0,left:(s==null?void 0:s.left)||0,zIndex:5e3,maxHeight:`${S}px`},children:c.length>0&&c.map((g,d)=>u.jsx("div",{className:`selectOption ${k===g?"selected":""}`,onClick:()=>T(g),children:g},d))})});me.displayName="Select";function be(c){const r=c instanceof Element?c:document.getElementById(c);return r&&r.children[0].textContent||""}function ve(c,r){const s=c instanceof Element?c:document.getElementById(c);s&&(s.children[0].textContent=r)}function V(c){const r=document.createRange(),s=window.getSelection();if(!s){console.error("无法获取selection对象");return}if(!c||!(c instanceof Node)){console.error("element 不是有效的 DOM 节点");return}r.selectNodeContents(c),r.collapse(!0),s.removeAllRanges(),s.addRange(r)}function j(c){const r=document.createRange(),s=window.getSelection();if(!s){console.error("无法获取selection对象");return}if(!c||!(c instanceof Node)){console.error("element 不是有效的 DOM 节点");return}r.selectNodeContents(c),r.collapse(!1),s.removeAllRanges(),s.addRange(r)}function Z(c){const r=window.getSelection();if(!r||r.rangeCount===0)return 0;if(!c||!(c instanceof Node)){console.error("element 不是有效的 DOM 节点");return}const s=r.getRangeAt(0),p=s.cloneRange();return p.selectNodeContents(c),p.setEnd(s.startContainer,s.startOffset),p.toString().length}function Ue(){const c=window.getSelection();if(!c||c.rangeCount===0)return null;const s=c.getRangeAt(0).startContainer;return s.nodeType===Node.TEXT_NODE?s.parentElement:s.nodeType===Node.ELEMENT_NODE?s:null}function Xe(){const c=window.getSelection();if(!c||c.rangeCount===0)return null;const r=c.getRangeAt(0),s=r.startContainer,p=r.startOffset;return s.nodeType===Node.TEXT_NODE?p>0?s:s.previousSibling:s.nodeType===Node.ELEMENT_NODE?p>0?s.childNodes[p-1]:s.previousSibling:null}function Ge(){const c=window.getSelection();if(!c||c.rangeCount===0)return null;const r=c.getRangeAt(0),s=r.startContainer,p=r.startOffset;return s.nodeType===Node.TEXT_NODE?p<s.length?s:s.nextSibling:s.nodeType===Node.ELEMENT_NODE?p<s.childNodes.length?s.childNodes[p]:s.nextSibling:null}function Je(c){return c&&!c.getAttribute("data-set-type")}const Re=i.forwardRef((c,r)=>{const{value:s="",varList:p,placeholder:S="",maxLength:w,defaultRows:C=3,disabled:k=!1,defaultFocus:R=!1,onFocus:m,onBlur:T,onChange:g,onClick:d,onSend:y,onParse:F,onKeyDown:D,onKeyUp:O,onMaxLengthExceeded:K}=c,[Qe,Ye]=i.useState(s||""),[W,_]=i.useState(""),[Ze,I]=i.useState(""),[z,H]=i.useState(!1),[v,U]=i.useState({top:0,left:0}),[ee,te]=i.useState([]),[X,ne]=i.useState(""),[L,oe]=i.useState(null),[le,se]=i.useState(120),[ce,re]=i.useState(R),Se=240,Ae=240,ie=240,ae=276,x=i.useRef(null),E=i.useRef(null),N=i.useRef(null),B=()=>{var o,n;let e=((n=(o=x.current)==null?void 0:o.innerText)==null?void 0:n.replace(/\u200B/g,""))||"";return e===`
3
+ `&&(e=""),e},de=()=>{var o;let e=((o=x.current)==null?void 0:o.innerHTML)||"";return e==="<br>"&&(e=""),e},ke=e=>{const o=[];let n=0;const l=/\[([^\]]+)\]/g;let a;const f=`${Date.now()}-${Math.random().toString(36).slice(2,9)}`;let h=0;if(e===""||!e||e===`
4
+ `)return[{type:"text",content:"​",id:`text-${h++}-${f}`}];const $=new Set((p||[]).map(b=>b.name));for(;(a=l.exec(e))!==null;){if(a.index>n){const A=e.substring(n,a.index).split(`
5
+ `);A.forEach((q,_e)=>{q&&o.push({type:"text",content:q,id:`text-${h++}-${f}`}),_e<A.length-1&&o.push({type:"newline",id:`newline-${h++}-${f}`})})}const b=a[1];if($.has(b)){const t=p.find(A=>A.name===b);(t==null?void 0:t.type)==="input"?o.push({type:"input",name:t==null?void 0:t.name,content:(t==null?void 0:t.content)||"",placeholder:(t==null?void 0:t.placeholder)||b,id:`input-${h++}-${f}`}):(t==null?void 0:t.type)==="select"?o.push({type:"select",name:t==null?void 0:t.name,content:(t==null?void 0:t.content)||"",placeholder:(t==null?void 0:t.placeholder)||b,options:(t==null?void 0:t.options)||[],id:`select-${h++}-${f}`}):(t==null?void 0:t.type)==="multiple-select"?o.push({type:"multiple-select",name:t==null?void 0:t.name,content:(t==null?void 0:t.content)||"",placeholder:(t==null?void 0:t.placeholder)||b,options:(t==null?void 0:t.options)||[],id:`multiple-select-${h++}-${f}`}):(t==null?void 0:t.type)==="date-picker"&&o.push({type:"date-picker",name:t==null?void 0:t.name,content:(t==null?void 0:t.content)||"",placeholder:(t==null?void 0:t.placeholder)||b,id:`date-picker-${h++}-${f}`})}else o.push({type:"text",content:`[${b}]`,id:`text-${h++}-${f}`});n=l.lastIndex}if(n<e.length){const t=e.substring(n).split(`
6
+ `);t.forEach((A,q)=>{A&&o.push({type:"text",content:A,id:`text-${h++}`}),q<t.length-1&&o.push({type:"newline",id:`newline-${h++}`})})}return o},G=()=>{var e;(e=x.current)==null||e.setAttribute("contenteditable","true"),E.current&&(P(E.current)&&E.current.children[0].setAttribute("contenteditable","false"),E.current=null),j(x.current)},De=e=>{console.log("handleEditorClick",e),d==null||d(e)},Ne=e=>{console.log("handleEditorMouseDown",e),G()},ue=e=>{console.log("handleEditorInput",e),_(B()),I(de()),g==null||g(B())},Te=e=>{var o,n;if(e.code==="Enter"&&!e.shiftKey){e.preventDefault();const l=B();if(console.log("onSend",l,"maxLength:",w,"length:",l.length),l.length===0||(console.log("containerRef.current?.innerHTML",(o=x.current)==null?void 0:o.innerHTML),(n=x.current)!=null&&n.innerHTML.match(/^<span>[\s\u200B]*(<br\s*\/?>[\s\u200B]*)+<\/span>$/)))return;w?l.length<=w?y==null||y(l):(console.log("maxLength exceeded",l,w),K==null||K(l,w)):y==null||y(l)}},Le=e=>{var n;console.log("handleEditorKeyDown",e),D==null||D(e);const o=Ue();if(o&&Je(o)){if(e.code==="ArrowLeft"){const l=o==null?void 0:o.previousElementSibling,a=Z(o);l&&a===0&&P(l)&&l.children[0]&&(E.current=l,M(l),requestAnimationFrame(()=>{j(l.children[0])}))}if(e.code==="ArrowRight"){const l=o==null?void 0:o.nextElementSibling,a=Z(o);l&&a===((n=o.textContent)==null?void 0:n.length)&&P(l)&&l.children[0]&&(E.current=l,M(l),requestAnimationFrame(()=>{V(l.children[0])}))}e.code==="Backspace"&&(o.innerHTML==="​"&&e.preventDefault(),o.innerHTML==="<br>"&&(e.preventDefault(),o.innerHTML="​"))}if(o&&o.getAttribute("data-set-type")==="container"){if(e.code==="ArrowLeft"){const l=Xe();P(l)&&l.children[0]&&(E.current=l,M(l),requestAnimationFrame(()=>{j(l.children[0])}))}if(e.code==="ArrowRight"){const l=Ge();P(l)&&l.children[0]&&(E.current=l,M(l),requestAnimationFrame(()=>{V(l.children[0])}))}}Te(e)},$e=e=>{console.log("handleEditorKeyUp",e),O==null||O(e)},Me=e=>{e.preventDefault();const n=window.getSelection().toString();if(!n)return;const l=n,a=n;e.clipboardData.setData("text/plain",l),e.clipboardData.setData("text/html",a)},je=e=>{m==null||m(e)},Pe=(e,o)=>{o.stopPropagation(),console.log("handleInputClick",e)},Fe=(e,o)=>{var l;o.stopPropagation(),console.log("handleInputMouseDown",e,o),E.current&&Ee(E.current),(l=x.current)==null||l.setAttribute("contenteditable","false");const n=document.getElementById(e.id);E.current=n,requestAnimationFrame(()=>{M(n)})},Oe=(e,o)=>{var a,f,h,$,b;console.log("handleInputKeyDown",e,o),D==null||D(o),o.stopPropagation();const n=o.target,l=Z(n);if(o.code==="Backspace"&&l===0){const t=(a=n.parentElement)==null?void 0:a.previousElementSibling;console.log("previousElement",t),t&&(P(t)&&t.children[0]&&((f=t.children[0].textContent)!=null&&f.length)?(E.current=t,M(t),j(t.children[0]),requestAnimationFrame(()=>{Y(t.children[0])})):(G(),j(t)))}if(o.code==="ArrowRight"&&l===((h=n.textContent)==null?void 0:h.length)){const t=($=n.parentElement)==null?void 0:$.nextElementSibling;console.log("nextElement",t),t&&(P(t)&&t.children[0]&&((b=t.children[0].textContent)!=null&&b.length)?(E.current=t,M(t),V(t.children[0]),requestAnimationFrame(()=>{Y(t.children[0])})):(G(),V(t)))}},He=(e,o)=>{console.log("handleInputKeyUp",e,o),O==null||O(o);const n=o.target;Y(n)},Be=(e,o)=>{var l;o.stopPropagation(),console.log("handlePlaceholderMouseDown",e),E.current&&Ee(E.current),(l=x.current)==null||l.setAttribute("contenteditable","false");const n=document.getElementById(e.id);E.current=n,requestAnimationFrame(()=>{M(n)})},qe=(e,o)=>{console.log("handleInputChange",e,o),_(B()),I(de()),g==null||g(B())},Ve=(e,o)=>{console.log("handleTextSpanKeyDown 不生效",e,o)};i.useEffect(()=>{if(!z)return;const e=l=>{N.current&&!N.current.contains(l.target)&&H(!1)},o=l=>{N.current&&!N.current.contains(l.target)&&H(!1)},n=()=>{H(!1)};return document.addEventListener("mousedown",e),document.addEventListener("scroll",o,!0),window.addEventListener("resize",n),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("scroll",o,!0),window.removeEventListener("resize",n)}},[z]);const J=(e,o)=>{if(console.log("handleFloatChange",e,o),L&&ve(L.id,e),o==="select"&&H(!1),o==="multiple-select"||o==="date-picker"){const n=document.getElementById(L.id);n&&n.children[0]&&n.children[1]&&(e.length>0?(n.children[0].setAttribute("style","display: inline"),n.children[0].setAttribute("contenteditable","false"),n.children[1].setAttribute("style","display: none"),n.children[1].setAttribute("contenteditable","true")):(n.children[0].setAttribute("style","display: none"),n.children[0].setAttribute("contenteditable","true"),n.children[1].setAttribute("style","display: inline"),n.children[1].setAttribute("contenteditable","true")))}ue({})},pe=(e,o)=>{console.log("handleSelectClick",e,o);const l=o.target.getBoundingClientRect();te(e.options),ne(e.value||be(e.id)),U({top:-999999,left:-999999999}),oe(e),se(Ae),H(!0),requestAnimationFrame(()=>{if(N.current){console.log("currentFloatElementRef.current",N.current);const a=N.current.getBoundingClientRect();let f=l.left,h=l.top+l.height;window.innerWidth-l.right<Se&&l.width<a.width&&(f=l.right-a.width),l.top<a.height&&(h=l.top+l.height),U({top:h,left:f}),se(a.height)}})},Ke=(e,o)=>{console.log("handleDatePickerClick",e,o);const l=o.target.getBoundingClientRect();let a=l.left,f=l.top-ae;window.innerWidth-l.right<ie&&(a=a-ie+l.width),l.top<ae&&(f=l.top+l.height),te(e.options),ne(e.value||be(e.id)),U({top:f,left:a}),oe(e),H(!0)},[fe,he]=i.useState([]),[Q,ge]=i.useState(!0),ye=i.useCallback(()=>{ge(!1);const e=ke(s),o=[];return e.forEach(n=>{var l,a,f,h,$,b;if(n.type==="text")o.push(u.jsx("span",{onKeyDown:t=>Ve(n,t),children:n.content},n.id));else if(n.type==="newline")o.push(u.jsx("br",{},n.id));else if(n.type==="input")o.push(u.jsxs("span",{id:n.id,"data-set-type":"input",contentEditable:!1,suppressContentEditableWarning:!0,onInput:t=>qe(n,t),onClick:t=>Pe(n,t),onMouseDown:t=>Fe(n,t),"data-cosmic-ai-input-placeholder":n.placeholder,children:[u.jsx("span",{className:"cosmic-ai-input-inputContent",style:{padding:(l=n.content)!=null&&l.length?"2px 4px":"2px 0 2px 4px"},contentEditable:!1,onKeyDown:t=>Oe(n,t),onKeyUp:t=>He(n,t),children:n.content}),u.jsx("span",{contentEditable:!1,style:{display:(a=n.content)!=null&&a.length?"none":"inline"},className:"cosmic-ai-input-placeholder",onMouseDown:t=>Be(n,t),children:n.placeholder})]},n.id));else if(n.type==="select"){const t=n.content||((f=n.options)==null?void 0:f[0])||n.placeholder;o.push(u.jsx("span",{id:n.id,"data-set-type":"select",contentEditable:!1,suppressContentEditableWarning:!0,onClick:A=>pe(n,A),"data-cosmic-ai-input-placeholder":n.placeholder,children:u.jsx("span",{contentEditable:!1,children:t})},n.id))}else if(n.type==="multiple-select"){const t=n.content||((h=n.options)==null?void 0:h[0]);o.push(u.jsxs("span",{id:n.id,"data-set-type":"multiple-select",contentEditable:!1,suppressContentEditableWarning:!0,onClick:A=>pe(n,A),"data-cosmic-ai-input-placeholder":n.placeholder,children:[u.jsx("span",{style:{display:t!=null&&t.length?"inline":"none"},contentEditable:!1,children:t}),u.jsx("span",{style:{display:t!=null&&t.length?"none":"inline"},className:"cosmic-ai-input-selectPlaceholder",contentEditable:!1,children:n.placeholder})]},n.id))}else n.type==="date-picker"&&o.push(u.jsxs("span",{id:n.id,"data-set-type":"date-picker",contentEditable:!1,suppressContentEditableWarning:!0,onClick:t=>Ke(n,t),"data-cosmic-ai-input-placeholder":n.placeholder,children:[u.jsx("span",{style:{display:($=n.content)!=null&&$.length?"inline":"none"},contentEditable:!1,children:n.content}),u.jsx("span",{style:{display:(b=n.content)!=null&&b.length?"none":"inline"},className:"cosmic-ai-input-datePickerPlaceholder",contentEditable:!1,children:n.placeholder})]},n.id))}),setTimeout(()=>{ge(!0)},0),console.log("重新渲染 ============================>","elements",o,"parsed",e,s),o},[s]);i.useEffect(()=>{Q&&setTimeout(()=>{j(x.current)},0)},[Q]),i.useEffect(()=>{s!==W?(he(ye()),_(s),re(!0)):(s===""||!s)&&he(ye())},[s,W]),i.useEffect(()=>{if(!R&&!ce)return;const e=new MutationObserver(()=>{x.current&&document.contains(x.current)&&(requestAnimationFrame(()=>{j(x.current),re(!1)}),e.disconnect())});return x.current&&e.observe(document.body,{childList:!0,subtree:!0}),()=>e.disconnect()},[R,ce]);const We=()=>{x.current&&requestAnimationFrame(()=>{j(x.current)})};return i.useImperativeHandle(r,()=>({getCurrentValue:B,focus:We})),console.log("renderElements",fe),u.jsxs("div",{className:xe(`cosmic-ai-input-rows${C}`),children:[Q&&u.jsx("div",{"data-set-type":"container","data-cosmic-ai-input-placeholder":S,className:xe("cosmic-ai-input",`cosmic-ai-input-rows${C}`,{"is-disabled":k},{"is-empty":W.length===0}),ref:x,contentEditable:!0,suppressContentEditableWarning:!0,onClick:e=>De(e),onFocus:e=>{je(e)},onBlur:e=>{T==null||T(e)},onMouseDown:e=>Ne(e),onKeyDown:e=>Le(e),onKeyUp:e=>$e(e),onInput:e=>ue(e),onCopy:e=>Me(e),children:fe}),z&&ze.createPortal((L==null?void 0:L.type)==="multiple-select"?u.jsx(Ce,{ref:N,options:ee,value:X,position:v,height:le,onChange:J},"multiple-select"):(L==null?void 0:L.type)==="date-picker"?u.jsx(we,{ref:N,value:X,position:v,onChange:J},"date-picker"):u.jsx(me,{ref:N,options:ee,value:X,position:v,height:le,onChange:J},"select"),document.body)]})});Re.displayName="AiInput";exports.default=Re;
package/dist/index.d.ts CHANGED
@@ -27,25 +27,25 @@ export declare interface AiInputRef {
27
27
  }
28
28
 
29
29
  declare interface DatePickerItem {
30
- type: 'date-picker';
30
+ type: "date-picker";
31
31
  name: string;
32
32
  content: string;
33
33
  placeholder: string;
34
34
  }
35
35
 
36
36
  declare interface InputItem {
37
- type: 'input';
37
+ type: "input";
38
38
  name: string;
39
39
  content: string;
40
40
  placeholder: string;
41
41
  }
42
42
 
43
- declare interface MultipleSelectItem extends Omit<SelectItem, 'type'> {
44
- type: 'multiple-select';
43
+ declare interface MultipleSelectItem extends Omit<SelectItem, "type"> {
44
+ type: "multiple-select";
45
45
  }
46
46
 
47
47
  declare interface SelectItem {
48
- type: 'select';
48
+ type: "select";
49
49
  name: string;
50
50
  content: string;
51
51
  placeholder: string;
package/dist/index.es.js CHANGED
@@ -1,58 +1,58 @@
1
- // Generated at: 2026-01-16T02:43:06.582Z
2
- import { jsx as h, jsxs as _ } from "react/jsx-runtime";
3
- import { forwardRef as j, useState as w, useRef as O, useEffect as F, useCallback as Xe, useImperativeHandle as ve } from "react";
1
+ // Generated at: 2026-01-16T03:24:54.633Z
2
+ import { jsx as f, jsxs as _ } from "react/jsx-runtime";
3
+ import { forwardRef as j, useState as C, useRef as H, useEffect as P, useCallback as ve, useImperativeHandle as Ge } from "react";
4
4
  import Ce from "classnames";
5
- import { createPortal as Ge } from "react-dom";
5
+ import { createPortal as Je } from "react-dom";
6
6
  const ke = j(
7
- ({ value: r, position: s, id: c, onChange: i }, k) => {
8
- const [b, x] = w(!0), T = O(null), A = O(null);
9
- F(() => {
10
- typeof k == "function" ? k(T.current) : k && (k.current = T.current);
7
+ ({ value: s, position: r, id: c, onChange: d }, k) => {
8
+ const [x, w] = C(!0), D = H(null), A = H(null);
9
+ P(() => {
10
+ typeof k == "function" ? k(D.current) : k && (k.current = D.current);
11
11
  }, [k]);
12
- const m = (d) => {
13
- console.log("DatePicker handleChange", d);
14
- const g = d.target.value;
15
- i == null || i(g, "date-picker");
12
+ const m = (a) => {
13
+ console.log("DatePicker handleChange", a);
14
+ const g = a.target.value;
15
+ d == null || d(g, "date-picker");
16
16
  };
17
- F(() => {
17
+ P(() => {
18
18
  if (A.current)
19
19
  try {
20
20
  setTimeout(() => {
21
21
  S();
22
22
  }, 100);
23
- } catch (d) {
24
- console.log("无法自动打开日期选择器,浏览器安全策略限制", d);
23
+ } catch (a) {
24
+ console.log("无法自动打开日期选择器,浏览器安全策略限制", a);
25
25
  }
26
26
  }, []);
27
27
  const S = () => {
28
28
  if (A.current)
29
29
  try {
30
30
  A.current.showPicker();
31
- } catch (d) {
32
- console.log("点击后无法打开日期选择器", d);
31
+ } catch (a) {
32
+ console.log("点击后无法打开日期选择器", a);
33
33
  }
34
- }, f = (d) => {
35
- d.stopPropagation(), console.log("DatePicker handleClick", d);
34
+ }, h = (a) => {
35
+ a.stopPropagation(), console.log("DatePicker handleClick", a);
36
36
  };
37
- return b ? /* @__PURE__ */ h(
37
+ return x ? /* @__PURE__ */ f(
38
38
  "div",
39
39
  {
40
- ref: T,
40
+ ref: D,
41
41
  id: c,
42
42
  style: {
43
- top: (s == null ? void 0 : s.top) || 0,
44
- left: (s == null ? void 0 : s.left) || 0
43
+ top: (r == null ? void 0 : r.top) || 0,
44
+ left: (r == null ? void 0 : r.left) || 0
45
45
  },
46
46
  className: "cosmic-ai-input-datePicker",
47
47
  suppressHydrationWarning: !0,
48
- children: /* @__PURE__ */ h(
48
+ children: /* @__PURE__ */ f(
49
49
  "input",
50
50
  {
51
51
  ref: A,
52
52
  type: "date",
53
- value: r || "",
53
+ value: s || "",
54
54
  onChange: m,
55
- onClick: f
55
+ onClick: h
56
56
  }
57
57
  )
58
58
  }
@@ -60,47 +60,47 @@ const ke = j(
60
60
  }
61
61
  );
62
62
  ke.displayName = "DatePicker";
63
- function te(r) {
64
- const s = r.textContent || "", c = r.nextSibling;
65
- s.length ? (c == null || c.setAttribute("style", "display: none"), r.style.padding = "2px 4px", r.style.borderTopLeftRadius = "2px", r.style.borderBottomLeftRadius = "2px", r.style.borderTopRightRadius = "2px", r.style.borderBottomRightRadius = "2px") : (c == null || c.setAttribute("style", "display: inline"), r.style.padding = "2px 0 2px 4px", r.style.borderTopLeftRadius = "2px", r.style.borderBottomLeftRadius = "2px", r.style.borderTopRightRadius = "0", r.style.borderBottomRightRadius = "0");
63
+ function te(s) {
64
+ const r = s.textContent || "", c = s.nextSibling;
65
+ r.length ? (c == null || c.setAttribute("style", "display: none"), s.style.padding = "2px 4px", s.style.borderTopLeftRadius = "2px", s.style.borderBottomLeftRadius = "2px", s.style.borderTopRightRadius = "2px", s.style.borderBottomRightRadius = "2px") : (c == null || c.setAttribute("style", "display: inline"), s.style.padding = "2px 0 2px 4px", s.style.borderTopLeftRadius = "2px", s.style.borderBottomLeftRadius = "2px", s.style.borderTopRightRadius = "0", s.style.borderBottomRightRadius = "0");
66
66
  }
67
- function P(r) {
68
- if (r && r.getAttribute("data-set-type") === "input") {
69
- const s = r.children[0];
70
- s.setAttribute("contenteditable", "true"), requestAnimationFrame(() => {
71
- s.focus();
67
+ function M(s) {
68
+ if (s && s.getAttribute("data-set-type") === "input") {
69
+ const r = s.children[0];
70
+ r.setAttribute("contenteditable", "true"), requestAnimationFrame(() => {
71
+ r.focus();
72
72
  });
73
73
  }
74
74
  }
75
- function me(r) {
76
- r && r.getAttribute("data-set-type") === "input" && r.children[0].setAttribute("contenteditable", "false");
75
+ function me(s) {
76
+ s && s.getAttribute("data-set-type") === "input" && s.children[0].setAttribute("contenteditable", "false");
77
77
  }
78
- function M(r) {
79
- return r && r.getAttribute("data-set-type") === "input";
78
+ function O(s) {
79
+ return s && s.getAttribute("data-set-type") === "input";
80
80
  }
81
81
  const Re = j(({
82
- options: r,
83
- value: s,
82
+ options: s,
83
+ value: r,
84
84
  position: c,
85
- id: i,
85
+ id: d,
86
86
  height: k = 37,
87
- onChange: b
88
- }, x) => {
89
- const [T, A] = w(s || ""), m = O(null);
90
- F(() => {
91
- typeof x == "function" ? x(m.current) : x && (x.current = m.current);
92
- }, [x]);
93
- const S = (d) => {
94
- const g = T.split(",").filter((D) => D) || [];
87
+ onChange: x
88
+ }, w) => {
89
+ const [D, A] = C(r || ""), m = H(null);
90
+ P(() => {
91
+ typeof w == "function" ? w(m.current) : w && (w.current = m.current);
92
+ }, [w]);
93
+ const S = (a) => {
94
+ const g = D.split(",").filter((N) => N) || [];
95
95
  let B = "";
96
- g.includes(d) ? B = g.filter((D) => D !== d).join(",") : (console.log("handleOptionClick", g), g.length ? B = `${g.join(",")},${d}` : B = d), A(B), b == null || b(B, "multiple-select");
97
- }, f = T.split(",") || [];
98
- return /* @__PURE__ */ h(
96
+ g.includes(a) ? B = g.filter((N) => N !== a).join(",") : (console.log("handleOptionClick", g), g.length ? B = `${g.join(",")},${a}` : B = a), A(B), x == null || x(B, "multiple-select");
97
+ }, h = D.split(",") || [];
98
+ return /* @__PURE__ */ f(
99
99
  "div",
100
100
  {
101
101
  ref: m,
102
102
  className: "cosmic-ai-input-selectFloatElement",
103
- id: i,
103
+ id: d,
104
104
  style: {
105
105
  position: "absolute",
106
106
  top: (c == null ? void 0 : c.top) || 0,
@@ -108,12 +108,12 @@ const Re = j(({
108
108
  zIndex: 5e3,
109
109
  maxHeight: `${k}px`
110
110
  },
111
- children: r.map((d, g) => /* @__PURE__ */ h(
111
+ children: s.map((a, g) => /* @__PURE__ */ f(
112
112
  "div",
113
113
  {
114
- className: `selectOption ${f.includes(d) ? "selected" : ""}`,
115
- onClick: () => S(d),
116
- children: d
114
+ className: `selectOption ${h.includes(a) ? "selected" : ""}`,
115
+ onClick: () => S(a),
116
+ children: a
117
117
  },
118
118
  g
119
119
  ))
@@ -121,27 +121,27 @@ const Re = j(({
121
121
  );
122
122
  });
123
123
  Re.displayName = "MultipleSelect";
124
- const Te = j(({
125
- options: r,
126
- value: s,
124
+ const De = j(({
125
+ options: s,
126
+ value: r,
127
127
  position: c,
128
- id: i,
128
+ id: d,
129
129
  height: k = 120,
130
- onChange: b
131
- }, x) => {
132
- const [T, A] = w(s || ""), m = O(null);
133
- F(() => {
134
- typeof x == "function" ? x(m.current) : x && (x.current = m.current);
135
- }, [x]);
136
- const S = (f) => {
137
- A(f), b == null || b(f, "select");
130
+ onChange: x
131
+ }, w) => {
132
+ const [D, A] = C(r || ""), m = H(null);
133
+ P(() => {
134
+ typeof w == "function" ? w(m.current) : w && (w.current = m.current);
135
+ }, [w]);
136
+ const S = (h) => {
137
+ A(h), x == null || x(h, "select");
138
138
  };
139
- return /* @__PURE__ */ h(
139
+ return /* @__PURE__ */ f(
140
140
  "div",
141
141
  {
142
142
  ref: m,
143
143
  className: "cosmic-ai-input-selectFloatElement",
144
- id: i,
144
+ id: d,
145
145
  style: {
146
146
  position: "absolute",
147
147
  top: (c == null ? void 0 : c.top) || 0,
@@ -149,332 +149,367 @@ const Te = j(({
149
149
  zIndex: 5e3,
150
150
  maxHeight: `${k}px`
151
151
  },
152
- children: r.length > 0 && r.map((f, d) => /* @__PURE__ */ h(
152
+ children: s.length > 0 && s.map((h, a) => /* @__PURE__ */ f(
153
153
  "div",
154
154
  {
155
- className: `selectOption ${T === f ? "selected" : ""}`,
156
- onClick: () => S(f),
157
- children: f
155
+ className: `selectOption ${D === h ? "selected" : ""}`,
156
+ onClick: () => S(h),
157
+ children: h
158
158
  },
159
- d
159
+ a
160
160
  ))
161
161
  }
162
162
  );
163
163
  });
164
- Te.displayName = "Select";
165
- function Ae(r) {
166
- const s = r instanceof Element ? r : document.getElementById(r);
167
- return s && s.children[0].textContent || "";
164
+ De.displayName = "Select";
165
+ function Ae(s) {
166
+ const r = s instanceof Element ? s : document.getElementById(s);
167
+ return r && r.children[0].textContent || "";
168
168
  }
169
- function Je(r, s) {
170
- const c = r instanceof Element ? r : document.getElementById(r);
171
- c && (c.children[0].textContent = s);
169
+ function Qe(s, r) {
170
+ const c = s instanceof Element ? s : document.getElementById(s);
171
+ c && (c.children[0].textContent = r);
172
172
  }
173
- function z(r) {
174
- const s = document.createRange(), c = window.getSelection();
173
+ function z(s) {
174
+ const r = document.createRange(), c = window.getSelection();
175
175
  if (!c) {
176
176
  console.error("无法获取selection对象");
177
177
  return;
178
178
  }
179
- try {
180
- s.selectNodeContents(r), s.collapse(!0), c.removeAllRanges(), c.addRange(s);
181
- } catch (i) {
182
- console.error("设置光标位置失败:", i);
179
+ if (!s || !(s instanceof Node)) {
180
+ console.error("element 不是有效的 DOM 节点");
181
+ return;
183
182
  }
183
+ r.selectNodeContents(s), r.collapse(!0), c.removeAllRanges(), c.addRange(r);
184
184
  }
185
- function H(r) {
186
- const s = document.createRange(), c = window.getSelection();
185
+ function F(s) {
186
+ const r = document.createRange(), c = window.getSelection();
187
187
  if (!c) {
188
188
  console.error("无法获取selection对象");
189
189
  return;
190
190
  }
191
- try {
192
- s.selectNodeContents(r), s.collapse(!1), c.removeAllRanges(), c.addRange(s);
193
- } catch (i) {
194
- console.error("设置光标位置失败:", i);
195
- }
196
- }
197
- function ne(r) {
198
- const s = window.getSelection();
199
- if (!s || s.rangeCount === 0)
200
- return 0;
201
- const c = s.getRangeAt(0);
202
- try {
203
- const i = c.cloneRange();
204
- return i.selectNodeContents(r), i.setEnd(c.startContainer, c.startOffset), i.toString().length;
205
- } catch (i) {
206
- return console.error("获取光标位置失败:", i), 0;
191
+ if (!s || !(s instanceof Node)) {
192
+ console.error("element 不是有效的 DOM 节点");
193
+ return;
207
194
  }
195
+ r.selectNodeContents(s), r.collapse(!1), c.removeAllRanges(), c.addRange(r);
208
196
  }
209
- function Qe() {
197
+ function ne(s) {
210
198
  const r = window.getSelection();
211
199
  if (!r || r.rangeCount === 0)
212
- return null;
213
- const c = r.getRangeAt(0).startContainer;
214
- return c.nodeType === Node.TEXT_NODE ? c.parentElement : c.nodeType === Node.ELEMENT_NODE ? c : null;
200
+ return 0;
201
+ if (!s || !(s instanceof Node)) {
202
+ console.error("element 不是有效的 DOM 节点");
203
+ return;
204
+ }
205
+ const c = r.getRangeAt(0), d = c.cloneRange();
206
+ return d.selectNodeContents(s), d.setEnd(c.startContainer, c.startOffset), d.toString().length;
215
207
  }
216
208
  function Ye() {
217
- const r = window.getSelection();
218
- if (!r || r.rangeCount === 0)
209
+ const s = window.getSelection();
210
+ if (!s || s.rangeCount === 0)
219
211
  return null;
220
- const s = r.getRangeAt(0), c = s.startContainer, i = s.startOffset;
221
- return c.nodeType === Node.TEXT_NODE ? i > 0 ? c : c.previousSibling : c.nodeType === Node.ELEMENT_NODE ? i > 0 ? c.childNodes[i - 1] : c.previousSibling : null;
212
+ const c = s.getRangeAt(0).startContainer;
213
+ return c.nodeType === Node.TEXT_NODE ? c.parentElement : c.nodeType === Node.ELEMENT_NODE ? c : null;
222
214
  }
223
215
  function Ze() {
224
- const r = window.getSelection();
225
- if (!r || r.rangeCount === 0)
226
- return null;
227
- const s = r.getRangeAt(0), c = s.startContainer, i = s.startOffset;
228
- return c.nodeType === Node.TEXT_NODE ? i < c.length ? c : c.nextSibling : c.nodeType === Node.ELEMENT_NODE ? i < c.childNodes.length ? c.childNodes[i] : c.nextSibling : null;
216
+ const s = window.getSelection();
217
+ if (!s || s.rangeCount === 0) return null;
218
+ const r = s.getRangeAt(0), c = r.startContainer, d = r.startOffset;
219
+ return c.nodeType === Node.TEXT_NODE ? d > 0 ? c : c.previousSibling : c.nodeType === Node.ELEMENT_NODE ? d > 0 ? c.childNodes[d - 1] : c.previousSibling : null;
220
+ }
221
+ function Ie() {
222
+ const s = window.getSelection();
223
+ if (!s || s.rangeCount === 0) return null;
224
+ const r = s.getRangeAt(0), c = r.startContainer, d = r.startOffset;
225
+ return c.nodeType === Node.TEXT_NODE ? d < c.length ? c : c.nextSibling : c.nodeType === Node.ELEMENT_NODE ? d < c.childNodes.length ? c.childNodes[d] : c.nextSibling : null;
229
226
  }
230
- function Ie(r) {
231
- return r && !r.getAttribute("data-set-type");
227
+ function et(s) {
228
+ return s && !s.getAttribute("data-set-type");
232
229
  }
233
- const et = j((r, s) => {
234
- const { value: c = "", varList: i, placeholder: k = "", maxLength: b, defaultRows: x = 3, disabled: T = !1, defaultFocus: A = !1, onFocus: m, onBlur: S, onChange: f, onClick: d, onSend: g, onParse: B, onKeyDown: D, onKeyUp: V, onMaxLengthExceeded: U } = r, [tt, nt] = w(c || ""), [X, v] = w(""), [lt, le] = w(""), [G, q] = w(!1), [J, Q] = w({ top: 0, left: 0 }), [oe, ce] = w([]), [Y, re] = w(""), [L, se] = w(null), [ie, ae] = w(120), [de, ue] = w(A), De = 240, Ne = 240, pe = 240, he = 276, C = O(null), y = O(null), N = O(null), K = () => {
235
- var l, n;
236
- let e = ((n = (l = C.current) == null ? void 0 : l.innerText) == null ? void 0 : n.replace(/\u200B/g, "")) || "";
230
+ const tt = j((s, r) => {
231
+ const {
232
+ value: c = "",
233
+ varList: d,
234
+ placeholder: k = "",
235
+ maxLength: x,
236
+ defaultRows: w = 3,
237
+ disabled: D = !1,
238
+ defaultFocus: A = !1,
239
+ onFocus: m,
240
+ onBlur: S,
241
+ onChange: h,
242
+ onClick: a,
243
+ onSend: g,
244
+ onParse: B,
245
+ onKeyDown: N,
246
+ onKeyUp: V,
247
+ onMaxLengthExceeded: U
248
+ } = s, [nt, ot] = C(c || ""), [X, v] = C(""), [lt, oe] = C(""), [G, q] = C(!1), [J, Q] = C({ top: 0, left: 0 }), [le, ce] = C([]), [Y, se] = C(""), [L, re] = C(null), [ie, ae] = C(120), [de, ue] = C(A), Ne = 240, Te = 240, pe = 240, fe = 276, y = H(null), E = H(null), T = H(null), K = () => {
249
+ var o, n;
250
+ let e = ((n = (o = y.current) == null ? void 0 : o.innerText) == null ? void 0 : n.replace(/\u200B/g, "")) || "";
237
251
  return e === `
238
252
  ` && (e = ""), e;
239
- }, fe = () => {
240
- var l;
241
- let e = ((l = C.current) == null ? void 0 : l.innerHTML) || "";
253
+ }, he = () => {
254
+ var o;
255
+ let e = ((o = y.current) == null ? void 0 : o.innerHTML) || "";
242
256
  return e === "<br>" && (e = ""), e;
243
257
  }, Se = (e) => {
244
- const l = [];
258
+ const o = [];
245
259
  let n = 0;
246
- const o = /\[([^\]]+)\]/g;
247
- let a;
260
+ const l = /\[([^\]]+)\]/g;
261
+ let i;
248
262
  const u = `${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
249
263
  let p = 0;
250
264
  if (e === "" || !e || e === `
251
265
  `)
252
- return [{
253
- type: "text",
254
- content: "",
255
- id: `text-${p++}-${u}`
256
- }];
257
- const $ = new Set((i || []).map((E) => E.name));
258
- for (; (a = o.exec(e)) !== null; ) {
259
- if (a.index > n) {
260
- const R = e.substring(n, a.index).split(`
266
+ return [
267
+ {
268
+ type: "text",
269
+ content: "​",
270
+ id: `text-${p++}-${u}`
271
+ }
272
+ ];
273
+ const $ = new Set((d || []).map((b) => b.name));
274
+ for (; (i = l.exec(e)) !== null; ) {
275
+ if (i.index > n) {
276
+ const R = e.substring(n, i.index).split(`
261
277
  `);
262
- R.forEach((W, Ue) => {
263
- W && l.push({
278
+ R.forEach((W, Xe) => {
279
+ W && o.push({
264
280
  type: "text",
265
281
  content: W,
266
282
  id: `text-${p++}-${u}`
267
- }), Ue < R.length - 1 && l.push({
283
+ }), Xe < R.length - 1 && o.push({
268
284
  type: "newline",
269
285
  id: `newline-${p++}-${u}`
270
286
  });
271
287
  });
272
288
  }
273
- const E = a[1];
274
- if ($.has(E)) {
275
- const t = i.find((R) => R.name === E);
276
- (t == null ? void 0 : t.type) === "input" ? l.push({
289
+ const b = i[1];
290
+ if ($.has(b)) {
291
+ const t = d.find((R) => R.name === b);
292
+ (t == null ? void 0 : t.type) === "input" ? o.push({
277
293
  type: "input",
278
294
  name: t == null ? void 0 : t.name,
279
295
  content: (t == null ? void 0 : t.content) || "",
280
- placeholder: (t == null ? void 0 : t.placeholder) || E,
296
+ placeholder: (t == null ? void 0 : t.placeholder) || b,
281
297
  id: `input-${p++}-${u}`
282
- }) : (t == null ? void 0 : t.type) === "select" ? l.push({
298
+ }) : (t == null ? void 0 : t.type) === "select" ? o.push({
283
299
  type: "select",
284
300
  name: t == null ? void 0 : t.name,
285
301
  content: (t == null ? void 0 : t.content) || "",
286
- placeholder: (t == null ? void 0 : t.placeholder) || E,
302
+ placeholder: (t == null ? void 0 : t.placeholder) || b,
287
303
  options: (t == null ? void 0 : t.options) || [],
288
304
  id: `select-${p++}-${u}`
289
- }) : (t == null ? void 0 : t.type) === "multiple-select" ? l.push({
305
+ }) : (t == null ? void 0 : t.type) === "multiple-select" ? o.push({
290
306
  type: "multiple-select",
291
307
  name: t == null ? void 0 : t.name,
292
308
  content: (t == null ? void 0 : t.content) || "",
293
- placeholder: (t == null ? void 0 : t.placeholder) || E,
309
+ placeholder: (t == null ? void 0 : t.placeholder) || b,
294
310
  options: (t == null ? void 0 : t.options) || [],
295
311
  id: `multiple-select-${p++}-${u}`
296
- }) : (t == null ? void 0 : t.type) === "date-picker" && l.push({
312
+ }) : (t == null ? void 0 : t.type) === "date-picker" && o.push({
297
313
  type: "date-picker",
298
314
  name: t == null ? void 0 : t.name,
299
315
  content: (t == null ? void 0 : t.content) || "",
300
- placeholder: (t == null ? void 0 : t.placeholder) || E,
316
+ placeholder: (t == null ? void 0 : t.placeholder) || b,
301
317
  id: `date-picker-${p++}-${u}`
302
318
  });
303
319
  } else
304
- l.push({
320
+ o.push({
305
321
  type: "text",
306
- content: `[${E}]`,
322
+ content: `[${b}]`,
307
323
  id: `text-${p++}-${u}`
308
324
  });
309
- n = o.lastIndex;
325
+ n = l.lastIndex;
310
326
  }
311
327
  if (n < e.length) {
312
328
  const t = e.substring(n).split(`
313
329
  `);
314
330
  t.forEach((R, W) => {
315
- R && l.push({
331
+ R && o.push({
316
332
  type: "text",
317
333
  content: R,
318
334
  id: `text-${p++}`
319
- }), W < t.length - 1 && l.push({
335
+ }), W < t.length - 1 && o.push({
320
336
  type: "newline",
321
337
  id: `newline-${p++}`
322
338
  });
323
339
  });
324
340
  }
325
- return l;
341
+ return o;
326
342
  }, Z = () => {
327
343
  var e;
328
- (e = C.current) == null || e.setAttribute("contenteditable", "true"), y.current && (M(y.current) && y.current.children[0].setAttribute("contenteditable", "false"), y.current = null), H(C.current);
344
+ (e = y.current) == null || e.setAttribute("contenteditable", "true"), E.current && (O(E.current) && E.current.children[0].setAttribute(
345
+ "contenteditable",
346
+ "false"
347
+ ), E.current = null), F(y.current);
329
348
  }, Le = (e) => {
330
- console.log("handleEditorClick", e), d == null || d(e);
349
+ console.log("handleEditorClick", e), a == null || a(e);
331
350
  }, $e = (e) => {
332
351
  console.log("handleEditorMouseDown", e), Z();
333
352
  }, ge = (e) => {
334
- console.log("handleEditorInput", e), v(K()), le(fe()), f == null || f(K());
335
- }, Pe = (e) => {
336
- var l, n;
353
+ console.log("handleEditorInput", e), v(K()), oe(he()), h == null || h(K());
354
+ }, Me = (e) => {
355
+ var o, n;
337
356
  if (e.code === "Enter" && !e.shiftKey) {
338
357
  e.preventDefault();
339
- const o = K();
340
- if (console.log("onSend", o, "maxLength:", b, "length:", o.length), o.length === 0 || (console.log("containerRef.current?.innerHTML", (l = C.current) == null ? void 0 : l.innerHTML), (n = C.current) != null && n.innerHTML.match(/^<span>[\s\u200B]*(<br\s*\/?>[\s\u200B]*)+<\/span>$/)))
358
+ const l = K();
359
+ if (console.log(
360
+ "onSend",
361
+ l,
362
+ "maxLength:",
363
+ x,
364
+ "length:",
365
+ l.length
366
+ ), l.length === 0 || (console.log(
367
+ "containerRef.current?.innerHTML",
368
+ (o = y.current) == null ? void 0 : o.innerHTML
369
+ ), (n = y.current) != null && n.innerHTML.match(
370
+ /^<span>[\s\u200B]*(<br\s*\/?>[\s\u200B]*)+<\/span>$/
371
+ )))
341
372
  return;
342
- b ? o.length <= b ? g == null || g(o) : (console.log("maxLength exceeded", o, b), U == null || U(o, b)) : g == null || g(o);
373
+ x ? l.length <= x ? g == null || g(l) : (console.log("maxLength exceeded", l, x), U == null || U(l, x)) : g == null || g(l);
343
374
  }
344
375
  }, Fe = (e) => {
345
376
  var n;
346
- console.log("handleEditorKeyDown", e), D == null || D(e);
347
- const l = Qe();
348
- if (l && Ie(l)) {
377
+ console.log("handleEditorKeyDown", e), N == null || N(e);
378
+ const o = Ye();
379
+ if (o && et(o)) {
349
380
  if (e.code === "ArrowLeft") {
350
- const o = l == null ? void 0 : l.previousElementSibling, a = ne(l);
351
- o && a === 0 && M(o) && o.children[0] && (y.current = o, P(o), requestAnimationFrame(() => {
352
- H(o.children[0]);
381
+ const l = o == null ? void 0 : o.previousElementSibling, i = ne(o);
382
+ l && i === 0 && O(l) && l.children[0] && (E.current = l, M(l), requestAnimationFrame(() => {
383
+ F(l.children[0]);
353
384
  }));
354
385
  }
355
386
  if (e.code === "ArrowRight") {
356
- const o = l == null ? void 0 : l.nextElementSibling, a = ne(l);
357
- o && a === ((n = l.textContent) == null ? void 0 : n.length) && M(o) && o.children[0] && (y.current = o, P(o), requestAnimationFrame(() => {
358
- z(o.children[0]);
387
+ const l = o == null ? void 0 : o.nextElementSibling, i = ne(o);
388
+ l && i === ((n = o.textContent) == null ? void 0 : n.length) && O(l) && l.children[0] && (E.current = l, M(l), requestAnimationFrame(() => {
389
+ z(l.children[0]);
359
390
  }));
360
391
  }
361
- e.code === "Backspace" && (l.innerHTML === "​" && e.preventDefault(), l.innerHTML === "<br>" && (e.preventDefault(), l.innerHTML = "​"));
392
+ e.code === "Backspace" && (o.innerHTML === "​" && e.preventDefault(), o.innerHTML === "<br>" && (e.preventDefault(), o.innerHTML = "​"));
362
393
  }
363
- if (l && l.getAttribute("data-set-type") === "container") {
394
+ if (o && o.getAttribute("data-set-type") === "container") {
364
395
  if (e.code === "ArrowLeft") {
365
- const o = Ye();
366
- M(o) && o.children[0] && (y.current = o, P(o), requestAnimationFrame(() => {
367
- H(o.children[0]);
396
+ const l = Ze();
397
+ O(l) && l.children[0] && (E.current = l, M(l), requestAnimationFrame(() => {
398
+ F(l.children[0]);
368
399
  }));
369
400
  }
370
401
  if (e.code === "ArrowRight") {
371
- const o = Ze();
372
- M(o) && o.children[0] && (y.current = o, P(o), requestAnimationFrame(() => {
373
- z(o.children[0]);
402
+ const l = Ie();
403
+ O(l) && l.children[0] && (E.current = l, M(l), requestAnimationFrame(() => {
404
+ z(l.children[0]);
374
405
  }));
375
406
  }
376
407
  }
377
- Pe(e);
378
- }, Me = (e) => {
408
+ Me(e);
409
+ }, Pe = (e) => {
379
410
  console.log("handleEditorKeyUp", e), V == null || V(e);
380
- }, He = (e) => {
411
+ }, Oe = (e) => {
381
412
  e.preventDefault();
382
413
  const n = window.getSelection().toString();
383
414
  if (!n) return;
384
- const o = n, a = n;
385
- e.clipboardData.setData("text/plain", o), e.clipboardData.setData("text/html", a);
386
- }, Oe = (e) => {
415
+ const l = n, i = n;
416
+ e.clipboardData.setData("text/plain", l), e.clipboardData.setData("text/html", i);
417
+ }, He = (e) => {
387
418
  m == null || m(e);
388
- }, Be = (e, l) => {
389
- l.stopPropagation(), console.log("handleInputClick", e);
390
- }, Ve = (e, l) => {
391
- var o;
392
- l.stopPropagation(), console.log("handleInputMouseDown", e, l), y.current && me(y.current), (o = C.current) == null || o.setAttribute("contenteditable", "false");
419
+ }, Be = (e, o) => {
420
+ o.stopPropagation(), console.log("handleInputClick", e);
421
+ }, Ve = (e, o) => {
422
+ var l;
423
+ o.stopPropagation(), console.log("handleInputMouseDown", e, o), E.current && me(E.current), (l = y.current) == null || l.setAttribute("contenteditable", "false");
393
424
  const n = document.getElementById(e.id);
394
- y.current = n, requestAnimationFrame(() => {
395
- P(n);
425
+ E.current = n, requestAnimationFrame(() => {
426
+ M(n);
396
427
  });
397
- }, qe = (e, l) => {
398
- var a, u, p, $, E;
399
- console.log("handleInputKeyDown", e, l), D == null || D(l), l.stopPropagation();
400
- const n = l.target, o = ne(n);
401
- if (l.code === "Backspace" && o === 0) {
402
- const t = (a = n.parentElement) == null ? void 0 : a.previousElementSibling;
403
- console.log("previousElement", t), t && (M(t) && t.children[0] && ((u = t.children[0].textContent) != null && u.length) ? (y.current = t, P(t), H(t.children[0]), requestAnimationFrame(() => {
428
+ }, qe = (e, o) => {
429
+ var i, u, p, $, b;
430
+ console.log("handleInputKeyDown", e, o), N == null || N(o), o.stopPropagation();
431
+ const n = o.target, l = ne(n);
432
+ if (o.code === "Backspace" && l === 0) {
433
+ const t = (i = n.parentElement) == null ? void 0 : i.previousElementSibling;
434
+ console.log("previousElement", t), t && (O(t) && t.children[0] && ((u = t.children[0].textContent) != null && u.length) ? (E.current = t, M(t), F(t.children[0]), requestAnimationFrame(() => {
404
435
  te(t.children[0]);
405
- })) : (Z(), H(t)));
436
+ })) : (Z(), F(t)));
406
437
  }
407
- if (l.code === "ArrowRight" && o === ((p = n.textContent) == null ? void 0 : p.length)) {
438
+ if (o.code === "ArrowRight" && l === ((p = n.textContent) == null ? void 0 : p.length)) {
408
439
  const t = ($ = n.parentElement) == null ? void 0 : $.nextElementSibling;
409
- console.log("nextElement", t), t && (M(t) && t.children[0] && ((E = t.children[0].textContent) != null && E.length) ? (y.current = t, P(t), z(t.children[0]), requestAnimationFrame(() => {
440
+ console.log("nextElement", t), t && (O(t) && t.children[0] && ((b = t.children[0].textContent) != null && b.length) ? (E.current = t, M(t), z(t.children[0]), requestAnimationFrame(() => {
410
441
  te(t.children[0]);
411
442
  })) : (Z(), z(t)));
412
443
  }
413
- }, Ke = (e, l) => {
414
- console.log("handleInputKeyUp", e, l), V == null || V(l);
415
- const n = l.target;
444
+ }, Ke = (e, o) => {
445
+ console.log("handleInputKeyUp", e, o), V == null || V(o);
446
+ const n = o.target;
416
447
  te(n);
417
- }, We = (e, l) => {
418
- var o;
419
- l.stopPropagation(), console.log("handlePlaceholderMouseDown", e), y.current && me(y.current), (o = C.current) == null || o.setAttribute("contenteditable", "false");
448
+ }, We = (e, o) => {
449
+ var l;
450
+ o.stopPropagation(), console.log("handlePlaceholderMouseDown", e), E.current && me(E.current), (l = y.current) == null || l.setAttribute("contenteditable", "false");
420
451
  const n = document.getElementById(e.id);
421
- y.current = n, requestAnimationFrame(() => {
422
- P(n);
452
+ E.current = n, requestAnimationFrame(() => {
453
+ M(n);
423
454
  });
424
- }, _e = (e, l) => {
425
- console.log("handleInputChange", e, l), v(K()), le(fe()), f == null || f(K());
426
- }, ze = (e, l) => {
427
- console.log("handleTextSpanKeyDown 不生效", e, l);
455
+ }, _e = (e, o) => {
456
+ console.log("handleInputChange", e, o), v(K()), oe(he()), h == null || h(K());
457
+ }, ze = (e, o) => {
458
+ console.log("handleTextSpanKeyDown 不生效", e, o);
428
459
  };
429
- F(() => {
430
- if (!G)
431
- return;
432
- const e = (o) => {
433
- N.current && !N.current.contains(o.target) && q(!1);
434
- }, l = (o) => {
435
- N.current && !N.current.contains(o.target) && q(!1);
460
+ P(() => {
461
+ if (!G) return;
462
+ const e = (l) => {
463
+ T.current && !T.current.contains(l.target) && q(!1);
464
+ }, o = (l) => {
465
+ T.current && !T.current.contains(l.target) && q(!1);
436
466
  }, n = () => {
437
467
  q(!1);
438
468
  };
439
- return document.addEventListener("mousedown", e), document.addEventListener("scroll", l, !0), window.addEventListener("resize", n), () => {
440
- document.removeEventListener("mousedown", e), document.removeEventListener("scroll", l, !0), window.removeEventListener("resize", n);
469
+ return document.addEventListener("mousedown", e), document.addEventListener("scroll", o, !0), window.addEventListener("resize", n), () => {
470
+ document.removeEventListener("mousedown", e), document.removeEventListener("scroll", o, !0), window.removeEventListener("resize", n);
441
471
  };
442
472
  }, [G]);
443
- const I = (e, l) => {
444
- if (console.log("handleFloatChange", e, l), L && Je(L.id, e), l === "select" && q(!1), l === "multiple-select" || l === "date-picker") {
445
- const n = document.getElementById(L.id);
473
+ const I = (e, o) => {
474
+ if (console.log("handleFloatChange", e, o), L && Qe(L.id, e), o === "select" && q(!1), o === "multiple-select" || o === "date-picker") {
475
+ const n = document.getElementById(
476
+ L.id
477
+ );
446
478
  n && n.children[0] && n.children[1] && (e.length > 0 ? (n.children[0].setAttribute("style", "display: inline"), n.children[0].setAttribute("contenteditable", "false"), n.children[1].setAttribute("style", "display: none"), n.children[1].setAttribute("contenteditable", "true")) : (n.children[0].setAttribute("style", "display: none"), n.children[0].setAttribute("contenteditable", "true"), n.children[1].setAttribute("style", "display: inline"), n.children[1].setAttribute("contenteditable", "true")));
447
479
  }
448
480
  ge({});
449
- }, ye = (e, l) => {
450
- console.log("handleSelectClick", e, l);
451
- const o = l.target.getBoundingClientRect();
452
- ce(e.options), re(e.value || Ae(e.id)), Q({ top: -999999, left: -999999999 }), se(e), ae(Ne), q(!0), requestAnimationFrame(() => {
453
- if (N.current) {
454
- console.log("currentFloatElementRef.current", N.current);
455
- const a = N.current.getBoundingClientRect();
456
- let u = o.left, p = o.top + o.height;
457
- window.innerWidth - o.right < De && o.width < a.width && (u = o.right - a.width), o.top < a.height && (p = o.top + o.height), Q({ top: p, left: u }), ae(a.height);
481
+ }, ye = (e, o) => {
482
+ console.log("handleSelectClick", e, o);
483
+ const l = o.target.getBoundingClientRect();
484
+ ce(e.options), se(e.value || Ae(e.id)), Q({ top: -999999, left: -999999999 }), re(e), ae(Te), q(!0), requestAnimationFrame(() => {
485
+ if (T.current) {
486
+ console.log(
487
+ "currentFloatElementRef.current",
488
+ T.current
489
+ );
490
+ const i = T.current.getBoundingClientRect();
491
+ let u = l.left, p = l.top + l.height;
492
+ window.innerWidth - l.right < Ne && l.width < i.width && (u = l.right - i.width), l.top < i.height && (p = l.top + l.height), Q({ top: p, left: u }), ae(i.height);
458
493
  }
459
494
  });
460
- }, je = (e, l) => {
461
- console.log("handleDatePickerClick", e, l);
462
- const o = l.target.getBoundingClientRect();
463
- let a = o.left, u = o.top - he;
464
- window.innerWidth - o.right < pe && (a = a - pe + o.width), o.top < he && (u = o.top + o.height), ce(e.options), re(e.value || Ae(e.id)), Q({ top: u, left: a }), se(e), q(!0);
465
- }, [Ee, be] = w([]), [ee, xe] = w(!0), we = Xe(() => {
495
+ }, je = (e, o) => {
496
+ console.log("handleDatePickerClick", e, o);
497
+ const l = o.target.getBoundingClientRect();
498
+ let i = l.left, u = l.top - fe;
499
+ window.innerWidth - l.right < pe && (i = i - pe + l.width), l.top < fe && (u = l.top + l.height), ce(e.options), se(e.value || Ae(e.id)), Q({ top: u, left: i }), re(e), q(!0);
500
+ }, [Ee, be] = C([]), [ee, xe] = C(!0), we = ve(() => {
466
501
  xe(!1);
467
- const e = Se(c), l = [];
502
+ const e = Se(c), o = [];
468
503
  return e.forEach((n) => {
469
- var o, a, u, p, $, E;
504
+ var l, i, u, p, $, b;
470
505
  if (n.type === "text")
471
- l.push(
472
- /* @__PURE__ */ h("span", { onKeyDown: (t) => ze(n, t), children: n.content }, n.id)
506
+ o.push(
507
+ /* @__PURE__ */ f("span", { onKeyDown: (t) => ze(n, t), children: n.content }, n.id)
473
508
  );
474
509
  else if (n.type === "newline")
475
- l.push(/* @__PURE__ */ h("br", {}, n.id));
510
+ o.push(/* @__PURE__ */ f("br", {}, n.id));
476
511
  else if (n.type === "input")
477
- l.push(
512
+ o.push(
478
513
  /* @__PURE__ */ _(
479
514
  "span",
480
515
  {
@@ -487,8 +522,29 @@ const et = j((r, s) => {
487
522
  onMouseDown: (t) => Ve(n, t),
488
523
  "data-cosmic-ai-input-placeholder": n.placeholder,
489
524
  children: [
490
- /* @__PURE__ */ h("span", { className: "cosmic-ai-input-inputContent", style: { padding: (o = n.content) != null && o.length ? "2px 4px" : "2px 0 2px 4px" }, contentEditable: !1, onKeyDown: (t) => qe(n, t), onKeyUp: (t) => Ke(n, t), children: n.content }),
491
- /* @__PURE__ */ h("span", { contentEditable: !1, style: { display: (a = n.content) != null && a.length ? "none" : "inline" }, className: "cosmic-ai-input-placeholder", onMouseDown: (t) => We(n, t), children: n.placeholder })
525
+ /* @__PURE__ */ f(
526
+ "span",
527
+ {
528
+ className: "cosmic-ai-input-inputContent",
529
+ style: {
530
+ padding: (l = n.content) != null && l.length ? "2px 4px" : "2px 0 2px 4px"
531
+ },
532
+ contentEditable: !1,
533
+ onKeyDown: (t) => qe(n, t),
534
+ onKeyUp: (t) => Ke(n, t),
535
+ children: n.content
536
+ }
537
+ ),
538
+ /* @__PURE__ */ f(
539
+ "span",
540
+ {
541
+ contentEditable: !1,
542
+ style: { display: (i = n.content) != null && i.length ? "none" : "inline" },
543
+ className: "cosmic-ai-input-placeholder",
544
+ onMouseDown: (t) => We(n, t),
545
+ children: n.placeholder
546
+ }
547
+ )
492
548
  ]
493
549
  },
494
550
  n.id
@@ -496,8 +552,8 @@ const et = j((r, s) => {
496
552
  );
497
553
  else if (n.type === "select") {
498
554
  const t = n.content || ((u = n.options) == null ? void 0 : u[0]) || n.placeholder;
499
- l.push(
500
- /* @__PURE__ */ h(
555
+ o.push(
556
+ /* @__PURE__ */ f(
501
557
  "span",
502
558
  {
503
559
  id: n.id,
@@ -506,14 +562,14 @@ const et = j((r, s) => {
506
562
  suppressContentEditableWarning: !0,
507
563
  onClick: (R) => ye(n, R),
508
564
  "data-cosmic-ai-input-placeholder": n.placeholder,
509
- children: /* @__PURE__ */ h("span", { contentEditable: !1, children: t })
565
+ children: /* @__PURE__ */ f("span", { contentEditable: !1, children: t })
510
566
  },
511
567
  n.id
512
568
  )
513
569
  );
514
570
  } else if (n.type === "multiple-select") {
515
571
  const t = n.content || ((p = n.options) == null ? void 0 : p[0]);
516
- l.push(
572
+ o.push(
517
573
  /* @__PURE__ */ _(
518
574
  "span",
519
575
  {
@@ -524,14 +580,29 @@ const et = j((r, s) => {
524
580
  onClick: (R) => ye(n, R),
525
581
  "data-cosmic-ai-input-placeholder": n.placeholder,
526
582
  children: [
527
- /* @__PURE__ */ h("span", { style: { display: t != null && t.length ? "inline" : "none" }, contentEditable: !1, children: t }),
528
- /* @__PURE__ */ h("span", { style: { display: t != null && t.length ? "none" : "inline" }, className: "cosmic-ai-input-selectPlaceholder", contentEditable: !1, children: n.placeholder })
583
+ /* @__PURE__ */ f(
584
+ "span",
585
+ {
586
+ style: { display: t != null && t.length ? "inline" : "none" },
587
+ contentEditable: !1,
588
+ children: t
589
+ }
590
+ ),
591
+ /* @__PURE__ */ f(
592
+ "span",
593
+ {
594
+ style: { display: t != null && t.length ? "none" : "inline" },
595
+ className: "cosmic-ai-input-selectPlaceholder",
596
+ contentEditable: !1,
597
+ children: n.placeholder
598
+ }
599
+ )
529
600
  ]
530
601
  },
531
602
  n.id
532
603
  )
533
604
  );
534
- } else n.type === "date-picker" && l.push(
605
+ } else n.type === "date-picker" && o.push(
535
606
  /* @__PURE__ */ _(
536
607
  "span",
537
608
  {
@@ -542,8 +613,23 @@ const et = j((r, s) => {
542
613
  onClick: (t) => je(n, t),
543
614
  "data-cosmic-ai-input-placeholder": n.placeholder,
544
615
  children: [
545
- /* @__PURE__ */ h("span", { style: { display: ($ = n.content) != null && $.length ? "inline" : "none" }, contentEditable: !1, children: n.content }),
546
- /* @__PURE__ */ h("span", { style: { display: (E = n.content) != null && E.length ? "none" : "inline" }, className: "cosmic-ai-input-datePickerPlaceholder", contentEditable: !1, children: n.placeholder })
616
+ /* @__PURE__ */ f(
617
+ "span",
618
+ {
619
+ style: { display: ($ = n.content) != null && $.length ? "inline" : "none" },
620
+ contentEditable: !1,
621
+ children: n.content
622
+ }
623
+ ),
624
+ /* @__PURE__ */ f(
625
+ "span",
626
+ {
627
+ style: { display: (b = n.content) != null && b.length ? "none" : "inline" },
628
+ className: "cosmic-ai-input-datePickerPlaceholder",
629
+ contentEditable: !1,
630
+ children: n.placeholder
631
+ }
632
+ )
547
633
  ]
548
634
  },
549
635
  n.id
@@ -551,76 +637,95 @@ const et = j((r, s) => {
551
637
  );
552
638
  }), setTimeout(() => {
553
639
  xe(!0);
554
- }, 0), console.log("重新渲染 ============================>", "elements", l, "parsed", e, c), l;
640
+ }, 0), console.log(
641
+ "重新渲染 ============================>",
642
+ "elements",
643
+ o,
644
+ "parsed",
645
+ e,
646
+ c
647
+ ), o;
555
648
  }, [c]);
556
- return F(() => {
649
+ P(() => {
557
650
  ee && setTimeout(() => {
558
- H(C.current);
651
+ F(y.current);
559
652
  }, 0);
560
- }, [ee]), F(() => {
653
+ }, [ee]), P(() => {
561
654
  c !== X ? (be(we()), v(c), ue(!0)) : (c === "" || !c) && be(we());
562
- }, [c, X]), F(() => {
655
+ }, [c, X]), P(() => {
563
656
  if (!A && !de) return;
564
657
  const e = new MutationObserver(() => {
565
- C.current && document.contains(C.current) && (requestAnimationFrame(() => {
566
- H(C.current), ue(!1);
658
+ y.current && document.contains(y.current) && (requestAnimationFrame(() => {
659
+ F(y.current), ue(!1);
567
660
  }), e.disconnect());
568
661
  });
569
- return C.current && e.observe(document.body, { childList: !0, subtree: !0 }), () => e.disconnect();
570
- }, [A, de]), ve(s, () => ({
571
- getCurrentValue: K
662
+ return y.current && e.observe(document.body, { childList: !0, subtree: !0 }), () => e.disconnect();
663
+ }, [A, de]);
664
+ const Ue = () => {
665
+ y.current && requestAnimationFrame(() => {
666
+ F(y.current);
667
+ });
668
+ };
669
+ return Ge(r, () => ({
670
+ getCurrentValue: K,
671
+ focus: Ue
572
672
  })), console.log("renderElements", Ee), // 最外层的防止renderContainer为false的时候样式坍塌
573
- /* @__PURE__ */ _("div", { className: Ce(`cosmic-ai-input-rows${x}`), children: [
574
- ee && /* @__PURE__ */ h(
673
+ /* @__PURE__ */ _("div", { className: Ce(`cosmic-ai-input-rows${w}`), children: [
674
+ ee && /* @__PURE__ */ f(
575
675
  "div",
576
676
  {
577
677
  "data-set-type": "container",
578
678
  "data-cosmic-ai-input-placeholder": k,
579
- className: Ce("cosmic-ai-input", `cosmic-ai-input-rows${x}`, { "is-disabled": T }, { "is-empty": X.length === 0 }),
580
- ref: C,
679
+ className: Ce(
680
+ "cosmic-ai-input",
681
+ `cosmic-ai-input-rows${w}`,
682
+ { "is-disabled": D },
683
+ { "is-empty": X.length === 0 }
684
+ ),
685
+ ref: y,
581
686
  contentEditable: !0,
582
687
  suppressContentEditableWarning: !0,
583
688
  onClick: (e) => Le(e),
584
689
  onFocus: (e) => {
585
- Oe(e);
690
+ He(e);
586
691
  },
587
692
  onBlur: (e) => {
588
693
  S == null || S(e);
589
694
  },
590
695
  onMouseDown: (e) => $e(e),
591
696
  onKeyDown: (e) => Fe(e),
592
- onKeyUp: (e) => Me(e),
697
+ onKeyUp: (e) => Pe(e),
593
698
  onInput: (e) => ge(e),
594
- onCopy: (e) => He(e),
699
+ onCopy: (e) => Oe(e),
595
700
  children: Ee
596
701
  }
597
702
  ),
598
- G && Ge(
599
- (L == null ? void 0 : L.type) === "multiple-select" ? /* @__PURE__ */ h(
703
+ G && Je(
704
+ (L == null ? void 0 : L.type) === "multiple-select" ? /* @__PURE__ */ f(
600
705
  Re,
601
706
  {
602
- ref: N,
603
- options: oe,
707
+ ref: T,
708
+ options: le,
604
709
  value: Y,
605
710
  position: J,
606
711
  height: ie,
607
712
  onChange: I
608
713
  },
609
714
  "multiple-select"
610
- ) : (L == null ? void 0 : L.type) === "date-picker" ? /* @__PURE__ */ h(
715
+ ) : (L == null ? void 0 : L.type) === "date-picker" ? /* @__PURE__ */ f(
611
716
  ke,
612
717
  {
613
- ref: N,
718
+ ref: T,
614
719
  value: Y,
615
720
  position: J,
616
721
  onChange: I
617
722
  },
618
723
  "date-picker"
619
- ) : /* @__PURE__ */ h(
620
- Te,
724
+ ) : /* @__PURE__ */ f(
725
+ De,
621
726
  {
622
- ref: N,
623
- options: oe,
727
+ ref: T,
728
+ options: le,
624
729
  value: Y,
625
730
  position: J,
626
731
  height: ie,
@@ -632,7 +737,7 @@ const et = j((r, s) => {
632
737
  )
633
738
  ] });
634
739
  });
635
- et.displayName = "AiInput";
740
+ tt.displayName = "AiInput";
636
741
  export {
637
- et as default
742
+ tt as default
638
743
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cosmic-ai-input",
3
- "version": "1.0.6",
3
+ "version": "1.0.8",
4
4
  "description": "A powerful AI conversation input component for React with TypeScript support",
5
5
  "main": "./dist/index.cjs.js",
6
6
  "module": "./dist/index.es.js",