cosmic-ai-input 1.0.16 → 1.0.17

package/dist/index.cjs.js

@@ -1,4 +1,4 @@
-// Generated at: 2026-04-03T03:34:22.896Z
+// Generated at: 2026-04-03T06:58:28.721Z
 "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=(r=>(r.INPUT="input",r.SELECT="select",r.MULTIPLE_SELECT="multiple-select",r.DATE_PICKER="date-picker",r.LABEL="label",r))(E||{});const Te=o.forwardRef(({value:r,position:a,id:i,onChange:h},B)=>{const[m,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{}},L=g=>{g.stopPropagation()};return m?p.jsx("div",{ref:$,id:i,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:r||"",onChange:S,onClick:L})}):null});Te.displayName="DatePicker";function de(r){const a=r.textContent||"",i=r.nextSibling;a.length?(i==null||i.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"):(i==null||i.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")}function O(r){if(r&&r.getAttribute("data-set-type")==="input"){const a=r.children[0];a.setAttribute("contenteditable","true"),requestAnimationFrame(()=>{a.focus()})}}function Le(r){r&&r.getAttribute("data-set-type")==="input"&&r.children[0].setAttribute("contenteditable","false")}function F(r){return r&&(r!=null&&r.getAttribute)?r.getAttribute("data-set-type")==="input":!1}const De=o.forwardRef(({options:r,value:a,position:i,id:h,height:B=37,onChange:m},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 C="";y.includes(g)?C=y.filter(b=>b!==g).join(","):y.length?C=`${y.join(",")},${g}`:C=g,k(C),m==null||m(C,E.MULTIPLE_SELECT)},L=$.split(",")||[];return p.jsx("div",{ref:S,className:"cosmic-ai-input-selectFloatElement",id:h,style:{position:"absolute",top:(i==null?void 0:i.top)||0,left:(i==null?void 0:i.left)||0,zIndex:5e3,maxHeight:`${B}px`},children:r.map((g,y)=>p.jsx("div",{className:`selectOption ${L.includes(g)?"selected":""}`,onClick:()=>N(g),children:g},y))})});De.displayName="MultipleSelect";const Ne=o.forwardRef(({options:r,value:a,position:i,id:h,height:B=120,onChange:m},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=L=>{k(L),m==null||m(L,E.SELECT)};return p.jsx("div",{ref:S,className:"cosmic-ai-input-selectFloatElement",id:h,style:{position:"absolute",top:(i==null?void 0:i.top)||0,left:(i==null?void 0:i.left)||0,zIndex:5e3,maxHeight:`${B}px`},children:r.length>0&&r.map((L,g)=>p.jsx("div",{className:`selectOption ${$===L?"selected":""}`,onClick:()=>N(L),children:L},g))})});Ne.displayName="Select";function Re(r){const a=r instanceof Element?r:document.getElementById(r);return a&&a.children[0].textContent||""}function st(r,a){const i=r instanceof Element?r:document.getElementById(r);i&&(i.children[0].textContent=a)}function I(r){const a=document.createRange(),i=window.getSelection();i&&(!r||!(r instanceof Node)||(a.selectNodeContents(r),a.collapse(!0),i.removeAllRanges(),i.addRange(a)))}function v(r){const a=document.createRange(),i=window.getSelection();i&&(!r||!(r instanceof Node)||(a.selectNodeContents(r),a.collapse(!1),i.removeAllRanges(),i.addRange(a)))}function ue(r){const a=window.getSelection();if(!a||a.rangeCount===0)return 0;if(!r||!(r instanceof Node))return;const i=a.getRangeAt(0),h=i.cloneRange();return h.selectNodeContents(r),h.setEnd(i.startContainer,i.startOffset),h.toString().length}function rt(){const r=window.getSelection();if(!r||r.rangeCount===0)return null;const i=r.getRangeAt(0).startContainer;return i.nodeType===Node.TEXT_NODE?i.parentElement:i.nodeType===Node.ELEMENT_NODE?i:null}function it(){const r=window.getSelection();return!r||r.rangeCount===0?null:r.getRangeAt(0).getBoundingClientRect()}function ct(){return new Promise(r=>{requestAnimationFrame(()=>{r(it())})})}function lt(){const r=window.getSelection();if(!r||r.rangeCount===0)return null;const a=r.getRangeAt(0),i=a.startContainer,h=a.startOffset;return i.nodeType===Node.TEXT_NODE?h>0?i:i.previousSibling:i.nodeType===Node.ELEMENT_NODE?h>0?i.childNodes[h-1]:i.previousSibling:null}function ot(){const r=window.getSelection();if(!r||r.rangeCount===0)return null;const a=r.getRangeAt(0),i=a.startContainer,h=a.startOffset;return i.nodeType===Node.TEXT_NODE?h<i.length?i:i.nextSibling:i.nodeType===Node.ELEMENT_NODE?h<i.childNodes.length?i.childNodes[h]:i.nextSibling:null}function at(r){return r&&!r.getAttribute("data-set-type")}function Se(){return`${Date.now()}-${Math.random().toString(36).slice(2,9)}`}const ke=o.forwardRef(({options:r,value:a,position:i,id:h,height:B=120,onChange:m},x)=>{const[$,k]=o.useState(a||""),[S,N]=o.useState(0),L=o.useRef(null),g=o.useRef(S),y=o.useCallback(C=>{k(C),m==null||m(C,E.LABEL)},[m]);return o.useEffect(()=>{typeof x=="function"?x(L.current):x&&(x.current=L.current)},[x]),o.useEffect(()=>{g.current=S},[S]),o.useEffect(()=>{N(0)},[r]),o.useEffect(()=>{const C=b=>{r.length!==0&&(b.key==="ArrowDown"?(b.preventDefault(),N(R=>R<r.length-1?R+1:R)):b.key==="ArrowUp"?(b.preventDefault(),N(R=>R>0?R-1:R)):b.key==="Enter"&&(b.preventDefault(),setTimeout(()=>{const R=g.current;R>=0&&r[R]&&y(r[R])},0)))};return document.addEventListener("keydown",C),()=>{document.removeEventListener("keydown",C)}},[r,y]),p.jsx("div",{ref:L,className:"cosmic-ai-input-selectFloatElement",id:h,style:{position:"absolute",top:(i==null?void 0:i.top)||0,left:(i==null?void 0:i.left)||0,zIndex:5e3,maxHeight:`${B}px`},children:r.length>0&&r.map((C,b)=>p.jsx("div",{className:`selectOption ${$===C?"selected":""} ${S===b?"highlighted":""}`,onClick:()=>y(C),onMouseEnter:()=>N(b),children:C},b))})});ke.displayName="Mention";const Pe=o.forwardRef((r,a)=>{const{value:i="",varList:h,placeholder:B="",maxLength:m,defaultRows:x=3,disabled:$=!1,defaultFocus:k=!1,textIndex:S=0,mentions:N=[],onFocus:L,onBlur:g,onChange:y,onClick:C,onSend:b,onKeyDown:R,onKeyUp:q,onMaxLengthExceeded:Y}=r,[dt,ut]=o.useState(i||""),[ee,U]=o.useState(""),[ft,te]=o.useState(""),[V,M]=o.useState(!1),[W,_]=o.useState({top:0,left:0}),[ne,se]=o.useState([]),[z,fe]=o.useState(""),[A,re]=o.useState(null),[ie,X]=o.useState(120),[pe,he]=o.useState(k),ge=240,Ee=240,ye=240,xe=276,w=o.useRef(null),T=o.useRef(null),j=o.useRef(null),G=o.useRef(!1),H=()=>{var n,t;let e=((t=(n=w.current)==null?void 0:n.innerText)==null?void 0:t.replace(/\u200B/g,""))||"";return e===`
 `&&(e=""),e},ce=()=>{var n;let e=((n=w.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===`
 `)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(`

package/dist/index.es.js

@@ -1,4 +1,4 @@
-// Generated at: 2026-04-03T03:34:22.449Z
+// Generated at: 2026-04-03T06:58:28.222Z
 import { jsx as f, jsxs as te } from "react/jsx-runtime";
 import { forwardRef as j, useState as T, useRef as O, useEffect as H, useCallback as Pe, useImperativeHandle as st } from "react";
 import De from "classnames";

package/dist/style.css

@@ -1 +1 @@
-.cosmic-ai-input{font-size:14px;outline:none;line-height:26px}.cosmic-ai-input p{margin:0}.cosmic-ai-input span{word-break:break-all}.cosmic-ai-input [data-set-type=input]{color:#b4c5fc;padding:0 2px;caret-color:#000}.cosmic-ai-input [data-set-type=label]{padding:0 2px;outline:none;cursor:pointer;position:relative;display:inline-block;cursor:text}.cosmic-ai-input [data-set-type=label] span{color:#2356f6;outline:none;background-color:#f2f5fe;border-radius:2px;white-space:nowrap;padding:0 4px;display:inline-block}.cosmic-ai-input [data-set-type=select]{padding:0 2px;outline:none;color:#2356f6;cursor:pointer;position:relative;display:inline-block}.cosmic-ai-input [data-set-type=select] span{outline:none;background-color:#f2f5fe;border-radius:2px;white-space:nowrap;padding:0 16px 0 4px;display:inline-block}.cosmic-ai-input [data-set-type=select]:after{content:"";position:absolute;right:6px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #2356f6;pointer-events:none}.cosmic-ai-input [data-set-type=multiple-select]{padding:0 2px;outline:none;color:#2356f6;cursor:pointer;position:relative;display:inline-block}.cosmic-ai-input [data-set-type=multiple-select] span{outline:none;background-color:#f2f5fe;border-radius:2px;white-space:nowrap;padding:2px 16px 2px 4px;display:inline-block}.cosmic-ai-input [data-set-type=multiple-select]:after{content:"";position:absolute;right:6px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #2356f6;pointer-events:none}.cosmic-ai-input [data-set-type=date-picker]{padding:0 2px;outline:none;color:#2356f6;cursor:pointer;position:relative;display:inline-block}.cosmic-ai-input [data-set-type=date-picker] span{outline:none;background-color:#f2f5fe;border-radius:2px;white-space:nowrap;padding:2px 16px 2px 4px;display:inline-block}.cosmic-ai-input [data-set-type=date-picker]:after{content:"";position:absolute;right:6px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #2356f6;pointer-events:none}.cosmic-ai-input.is-empty:after{content:attr(data-cosmic-ai-input-placeholder);color:#999;pointer-events:none;text-indent:0;white-space:pre-wrap;word-break:break-all;overflow-wrap:break-word}.cosmic-ai-input.is-disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.cosmic-ai-input-displayNone{display:none}.cosmic-ai-input-inputContent{outline:none;color:#2356f6;background-color:#f2f5fe;border-radius:2px}.cosmic-ai-input-placeholder{background-color:#f2f5fe;padding:2px 4px 2px 0;border-top-right-radius:2px;border-bottom-right-radius:2px}.cosmic-ai-input-selectPlaceholder,.cosmic-ai-input-datePickerPlaceholder{color:#b4c5fc}.cosmic-ai-input-rows1{min-height:auto}.cosmic-ai-input-rows2{min-height:46px}.cosmic-ai-input-rows3{min-height:69px}.cosmic-ai-input-rows4{min-height:92px}.cosmic-ai-input-selectFloatElement{background-color:#fff;border:1px solid #e0e0e0;border-radius:4px;box-shadow:0 2px 8px #00000026;overflow-y:auto;z-index:5000;max-width:240px}.cosmic-ai-input-selectFloatElement .selectOption{padding:8px 12px;cursor:pointer;transition:background-color .2s ease;border-bottom:1px solid #f0f0f0;font-size:14px;color:#333;box-sizing:border-box;word-wrap:break-word;word-break:break-all;display:flex;align-items:center;justify-content:space-between}.cosmic-ai-input-selectFloatElement .selectOption:last-child{border-bottom:none}.cosmic-ai-input-selectFloatElement .selectOption:hover{background-color:#f5f5f5}.cosmic-ai-input-selectFloatElement .selectOption.selected{background-color:#e6f0ff;color:#2356f6;font-weight:500}.cosmic-ai-input-selectFloatElement .selectOption.selected:after{content:"✓";color:#2356f6;padding-left:6px}.cosmic-ai-input-selectFloatElement .selectOption.highlighted{background-color:#f0f0f0;font-weight:500}.cosmic-ai-input-datePicker{position:absolute;z-index:5000}.cosmic-ai-input-datePicker input[type=date]{visibility:hidden;height:0!important;box-sizing:border-box;border:none!important;position:relative;top:-10px}.cosmic-ai-input-commonSlot{padding:2px 0}
+.cosmic-ai-input{font-size:14px;outline:none;line-height:26px;touch-action:manipulation;-webkit-overflow-scrolling:auto}.cosmic-ai-input p{margin:0}.cosmic-ai-input span{word-break:break-all}.cosmic-ai-input [data-set-type=input]{color:#b4c5fc;padding:0 2px;caret-color:#000}.cosmic-ai-input [data-set-type=label]{padding:0 2px;outline:none;cursor:pointer;position:relative;display:inline-block;cursor:text}.cosmic-ai-input [data-set-type=label] span{color:#2356f6;outline:none;background-color:#f2f5fe;border-radius:2px;white-space:nowrap;padding:0 4px;display:inline-block}.cosmic-ai-input [data-set-type=select]{padding:0 2px;outline:none;color:#2356f6;cursor:pointer;position:relative;display:inline-block}.cosmic-ai-input [data-set-type=select] span{outline:none;background-color:#f2f5fe;border-radius:2px;white-space:nowrap;padding:0 16px 0 4px;display:inline-block}.cosmic-ai-input [data-set-type=select]:after{content:"";position:absolute;right:6px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #2356f6;pointer-events:none}.cosmic-ai-input [data-set-type=multiple-select]{padding:0 2px;outline:none;color:#2356f6;cursor:pointer;position:relative;display:inline-block}.cosmic-ai-input [data-set-type=multiple-select] span{outline:none;background-color:#f2f5fe;border-radius:2px;white-space:nowrap;padding:2px 16px 2px 4px;display:inline-block}.cosmic-ai-input [data-set-type=multiple-select]:after{content:"";position:absolute;right:6px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #2356f6;pointer-events:none}.cosmic-ai-input [data-set-type=date-picker]{padding:0 2px;outline:none;color:#2356f6;cursor:pointer;position:relative;display:inline-block}.cosmic-ai-input [data-set-type=date-picker] span{outline:none;background-color:#f2f5fe;border-radius:2px;white-space:nowrap;padding:2px 16px 2px 4px;display:inline-block}.cosmic-ai-input [data-set-type=date-picker]:after{content:"";position:absolute;right:6px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #2356f6;pointer-events:none}.cosmic-ai-input.is-empty:after{content:attr(data-cosmic-ai-input-placeholder);color:#999;pointer-events:none;text-indent:0;white-space:pre-wrap;word-break:break-all;overflow-wrap:break-word}.cosmic-ai-input.is-disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.cosmic-ai-input-displayNone{display:none}.cosmic-ai-input-inputContent{outline:none;color:#2356f6;background-color:#f2f5fe;border-radius:2px}.cosmic-ai-input-placeholder{background-color:#f2f5fe;padding:2px 4px 2px 0;border-top-right-radius:2px;border-bottom-right-radius:2px}.cosmic-ai-input-selectPlaceholder,.cosmic-ai-input-datePickerPlaceholder{color:#b4c5fc}.cosmic-ai-input-rows1{min-height:auto}.cosmic-ai-input-rows2{min-height:46px}.cosmic-ai-input-rows3{min-height:69px}.cosmic-ai-input-rows4{min-height:92px}.cosmic-ai-input-selectFloatElement{background-color:#fff;border:1px solid #e0e0e0;border-radius:4px;box-shadow:0 2px 8px #00000026;overflow-y:auto;z-index:5000;max-width:240px;touch-action:manipulation;-webkit-overflow-scrolling:auto}.cosmic-ai-input-selectFloatElement .selectOption{padding:8px 12px;cursor:pointer;transition:background-color .2s ease;border-bottom:1px solid #f0f0f0;font-size:14px;color:#333;box-sizing:border-box;word-wrap:break-word;word-break:break-all;display:flex;align-items:center;justify-content:space-between}.cosmic-ai-input-selectFloatElement .selectOption:last-child{border-bottom:none}.cosmic-ai-input-selectFloatElement .selectOption:hover{background-color:#f5f5f5}.cosmic-ai-input-selectFloatElement .selectOption.selected{background-color:#e6f0ff;color:#2356f6;font-weight:500}.cosmic-ai-input-selectFloatElement .selectOption.selected:after{content:"✓";color:#2356f6;padding-left:6px}.cosmic-ai-input-selectFloatElement .selectOption.highlighted{background-color:#f0f0f0;font-weight:500}.cosmic-ai-input-datePicker{position:absolute;z-index:5000;touch-action:manipulation;-webkit-overflow-scrolling:auto}.cosmic-ai-input-datePicker input[type=date]{visibility:hidden;height:0!important;box-sizing:border-box;border:none!important;position:relative;top:-10px}.cosmic-ai-input-commonSlot{padding:2px 0}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cosmic-ai-input",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "description": "A powerful AI conversation input component for React with TypeScript support",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.es.js",