@kitn.ai/ui/dist/elements/chunks/default-input-BZcwyKcP.js

Framework-agnostic, Shadow-DOM web components for building AI chat interfaces — works in React, Vue, Angular, Svelte, or plain HTML. Authored in SolidJS.

import{c as t,m as x,s as y,x as T,k as A,i as c,g as U,w as H,O as P,t as d,v as D,e as _,F as k,S as g,n as V,q as S,u as j}from"./define-CNSKFZCd.js";import{c as z}from"./cn-CU7UAWzk.js";import{C as q,s as B,n as E}from"./composer-BZyPU6gD.js";import{P as M}from"./prompt-suggestion-9lvgFcEa.js";import{B as m}from"./button-DBDZebGr.js";import{T as O}from"./tooltip-Cft_Rxiw.js";import{A as F,a as N,d as W,e as G,i as J}from"./attachments-DLJcWCDV.js";import{a as K}from"./action-icons-Dtl8Ox5D.js";import{p as Q,g as X}from"./paperclip-DDEfmkHc.js";import{m as Y}from"./icon-CAyRqVrg.js";import{I as Z}from"./Icon-C2LTALdM.js";var ee=[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",key:"afitv7"}]],te=e=>t(Z,x(e,{name:"Square",iconNode:ee})),re=te,ne=d("<div data-prompt-input>"),ae=d("<div>");const L=D();function le(){const e=H(L);if(!e)throw new Error("PromptInput subcomponents must be used within PromptInput");return e}function ie(e){const[r,l]=y(e,["isLoading","value","onValueChange","maxHeight","onSubmit","children","disabled","class","onClick"]),[u,b]=U(r.value??"");let i;const h=s=>{var v;b(s),(v=r.onValueChange)==null||v.call(r,s)},C=s=>{r.disabled||i==null||i.focus(),typeof r.onClick=="function"&&r.onClick(s)};return t(L.Provider,{get value(){return{isLoading:r.isLoading??!1,value:()=>r.value??u(),setValue:r.onValueChange??h,maxHeight:r.maxHeight??240,onSubmit:r.onSubmit,get disabled(){return r.disabled},get textareaRef(){return i},setTextareaRef:s=>{i=s}}},get children(){var s=ne();return s.$$click=C,A(s,x({get class(){return z("bg-surface cursor-text rounded-xl p-2 shadow-xs","focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-0",r.disabled&&"cursor-not-allowed opacity-60",r.class)}},l),!1,!0),c(s,()=>r.children),s}})}function se(e){const[r]=y(e,["class","placeholder","aria-label","triggers","kindIcons","onComposerChange"]),l=le(),u=T(),b=()=>z("text-foreground min-h-[44px] w-full bg-transparent shadow-none outline-none focus-visible:ring-0 focus-visible:ring-offset-0 overflow-y-auto whitespace-pre-wrap break-words",P(u.proseSize()),r.class);return t(q,{bare:!0,get value(){return l.value()},get placeholder(){return r.placeholder},get ariaLabel(){return r["aria-label"]},get disabled(){return l.disabled},get maxHeight(){return l.maxHeight},get editableClass(){return b()},editableRef:i=>l.setTextareaRef(i),get triggers(){return r.triggers},get kindIcons(){return r.kindIcons},onChange:i=>{var h;(h=r.onComposerChange)==null||h.call(r,i),l.setValue(i.text.replace(/^\s+/,""))},onSubmit:()=>{var i;l.disabled||(i=l.onSubmit)==null||i.call(l)}})}function oe(e){const[r,l]=y(e,["children","class"]);return(()=>{var u=ae();return A(u,x({get class(){return z("flex items-center gap-2",r.class)}},l),!1,!0),c(u,()=>r.children),u})()}_(["click"]);var ue=d('<div class="mb-2 flex flex-wrap gap-2">'),ce=d('<div class="px-3 pt-3">'),de=d("<slot name=input-top>"),ge=d("<input type=file multiple class=hidden>"),he=d('<div class="flex items-center gap-2"><slot name=toolbar-start style=display:contents>'),pe=d('<div class="flex items-center gap-2"><slot name=toolbar-end>'),me=d('<span class="px-1 text-xs">'),be=d('<svg width=16 height=16 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2><line x1=12 y1=19 x2=12 y2=5></line><polyline points="5 12 12 5 19 12">');function fe(e){return{id:typeof crypto<"u"&&crypto.randomUUID?crypto.randomUUID():`${e.name}-${e.size}-${e.lastModified}`,type:"file",filename:e.name,mediaType:e.type||void 0,url:e.type.startsWith("image/")?URL.createObjectURL(e):void 0}}function ve(e){let r;const l=()=>e.attachments??[],u=()=>!!e.onAttachmentsChange,b=n=>{!(n!=null&&n.length)||!e.onAttachmentsChange||e.onAttachmentsChange([...l(),...Array.from(n).map(fe)])},i=n=>{var o;return(o=e.onAttachmentsChange)==null?void 0:o.call(e,l().filter(a=>a.id!==n))},h=()=>B(E(e.value)),C=()=>e.disabled||e.loading||!h().trim()&&l().length===0,s=()=>!!e.loading&&!!e.stoppable,v=()=>!!h().trim()||l().length>0,$=()=>{const n=e.submit??"always";return n==="always"||n==="auto"&&v()};return[t(g,{get when(){var n;return(n=e.suggestions)==null?void 0:n.length},get children(){var n=ue();return c(n,t(k,{get each(){return e.suggestions},children:o=>t(M,{onClick:()=>e.onSuggestionClick(o),children:o})})),n}}),t(ie,{get value(){return e.value},get onValueChange(){return e.onValueChange},get onSubmit(){return e.onSubmit},get isLoading(){return e.loading},get disabled(){return e.disabled},class:"relative",get children(){return[t(g,{get when(){return V(()=>!!u())()&&l().length},get children(){var n=ce();return c(n,t(F,{variant:"inline",get children(){return t(k,{get each(){return l()},children:o=>t(N,{data:o,onRemove:()=>i(o.id),get children(){return[t(W,{}),t(G,{}),t(J,{})]}})})}})),n}}),(()=>{var n=de();return n._$owner=S(),n})(),t(se,{get placeholder(){return e.placeholder},get"aria-label"(){return e.placeholder||"Message"},class:"min-h-[44px] pt-3 pl-4",get triggers(){return e.triggers},get kindIcons(){return e.kindIcons},get onComposerChange(){return e.onComposerChange}}),t(oe,{class:"mt-2 flex w-full items-center justify-between gap-2 px-3 pb-0",get children(){return[(()=>{var n=he(),o=n.firstChild;return o._$owner=S(),c(n,t(g,{get when(){return V(()=>!!u())()&&e.attach!==!1},get children(){return[(()=>{var a=ge();a.addEventListener("change",w=>{b(w.currentTarget.files),w.currentTarget.value=""});var f=r;return typeof f=="function"?j(f,a):r=a,a})(),t(m,{type:"button",variant:"outline",size:"icon-sm",class:"rounded-full","aria-label":"Attach files",get disabled(){return e.disabled},onClick:()=>r?.click(),get children(){return t(Q,{class:"size-4"})}})]}}),null),c(n,t(g,{get when(){return e.search},get children(){return t(m,{type:"button",variant:"outline",size:"sm",class:"rounded-full gap-1","aria-label":"Search the web",get disabled(){return e.disabled},onClick:()=>{var a;return(a=e.onSearch)==null?void 0:a.call(e)},get children(){return[t(X,{class:"size-4"}),"Search"]}})}}),null),c(n,t(g,{get when(){return e.voice},get children(){return t(m,{type:"button",variant:"outline",size:"icon-sm",class:"rounded-full","aria-label":"Voice input",get disabled(){return e.disabled},onClick:()=>{var a;return(a=e.onVoice)==null?void 0:a.call(e)},get children(){return t(Y,{class:"size-4"})}})}}),null),c(n,t(k,{get each(){return e.toolbarActions??[]},children:a=>{const f=K(a.icon),w=a.tooltip??a.label,I=t(m,{type:"button",variant:"outline",size:"icon-sm",class:"rounded-full",get"aria-label"(){return a.label},get"data-action"(){return a.id},get disabled(){return e.disabled},onClick:()=>{var p;return(p=e.onAction)==null?void 0:p.call(e,a.id)},get children(){return t(g,{when:f,get fallback(){return(()=>{var p=me();return c(p,()=>a.label),p})()},children:p=>{const R=p();return t(R,{class:"size-4"})}})}});return f?t(O,{content:w,children:I}):I}}),null),n})(),(()=>{var n=pe(),o=n.firstChild;return o._$owner=S(),c(n,t(g,{get when(){return s()},get fallback(){return t(g,{get when(){return $()},get children(){return t(m,{size:"icon-sm",class:"rounded-full",part:"send","data-testid":"send","aria-label":"Send message",get disabled(){return C()},get onClick(){return e.onSubmit},get children(){return be()}})}})},get children(){return t(m,{size:"icon-sm",variant:"outline",class:"rounded-full","data-testid":"stop","aria-label":"Stop",get onClick(){return e.onStop},get children(){return t(re,{class:"size-3"})}})}}),null),n})()]}})]}})]}export{ve as D};