@kitn.ai/ui
Version:
Framework-agnostic, Shadow-DOM web components for building AI chat interfaces — works in React, Vue, Angular, Svelte, or plain HTML. Authored in SolidJS.
2 lines (1 loc) • 2.72 kB
JavaScript
import{f as w,g as h,h as k,o as q,c as I,p as M}from"./chunks/define-CNSKFZCd.js";import{D as V}from"./chunks/default-input-BZcwyKcP.js";import{n as g,e as R,s as f}from"./chunks/composer-BZyPU6gD.js";w("kai-prompt-input",{value:void 0,placeholder:"Send a message...",disabled:!1,loading:!1,suggestions:void 0,suggestionMode:"submit",search:!1,voice:!1,stoppable:!1,submit:"always",attach:!0,attachments:void 0,triggers:void 0,kindIcons:void 0},(o,{dispatch:a,flag:s,element:c,expose:A})=>{const[S,m]=h(o.value??""),[l,r]=h(o.attachments??[]);k(()=>{o.attachments&&r(o.attachments)});const[x,y]=h([]);q(()=>{const t=()=>{const u=[...c.querySelectorAll("kai-action")];y(u.map(n=>{var p;return{id:n.id||n.getAttribute("action")||"",label:((p=n.textContent)==null?void 0:p.trim())||n.getAttribute("label")||n.id||"",icon:n.getAttribute("icon")??void 0,tooltip:n.getAttribute("tooltip")??void 0}}))};t();const e=new MutationObserver(t);e.observe(c,{childList:!0,attributes:!0,subtree:!0}),M(()=>e.disconnect())});const v=()=>typeof o.value=="string"?o.value:S();let i={doc:[],text:"",entities:[]};k(()=>{const t=o.value;if(t!=null&&typeof t!="string"){const e=g(t);m(e),i={doc:e,text:f(e),entities:R(e)}}});const d=t=>{m(t),t!==i.text&&(i={doc:g(t),text:t,entities:[]}),a("kai-value-change",{value:t,doc:i.doc,entities:i.entities})},b=()=>{a("kai-submit",{value:f(g(v())),doc:i.doc,entities:i.entities,attachments:l()}),r([])},C=t=>{(o.suggestionMode??"submit")==="fill"?(d(t),a("kai-suggestion-click",{value:t})):(a("kai-submit",{value:t,doc:g(t),entities:[],attachments:l()}),r([]))};return A({focus:t=>{const e=c.shadowRoot,u=e?.querySelector('[contenteditable]:not([contenteditable="false"]), textarea')??e?.querySelector('input:not([type="file"])');u?.focus(t)},blur:()=>{var t,e;return(e=(t=c.shadowRoot)==null?void 0:t.activeElement)==null?void 0:e.blur()},clear:()=>{d(""),l().length&&(r([]),a("kai-attachments-change",{attachments:[]}))},send:()=>b()}),I(V,{get value(){return v()},get placeholder(){return o.placeholder},get disabled(){return s("disabled")},get loading(){return s("loading")},get stoppable(){return s("stoppable")},get submit(){return o.submit},get attach(){return s("attach")},get suggestions(){return o.suggestions},get attachments(){return l()},get search(){return s("search")},get voice(){return s("voice")},get toolbarActions(){return x()},get triggers(){return o.triggers},get kindIcons(){return o.kindIcons},onComposerChange:t=>{i=t},onValueChange:d,onSubmit:b,onSuggestionClick:C,onAttachmentsChange:t=>{r(t),a("kai-attachments-change",{attachments:t})},onSearch:()=>a("kai-search"),onVoice:()=>a("kai-voice"),onStop:()=>a("kai-stop"),onAction:t=>a("kai-toolbar-action",{action:t})})});