@kitn.ai/ui/dist/elements/chunks/attachments-DLJcWCDV.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 n,m,s as h,k as p,i as u,S as w,n as j,t as g,v as C,w as I,a as k,d as y}from"./define-CNSKFZCd.js";import{c as d}from"./cn-CU7UAWzk.js";import{B as D}from"./button-DBDZebGr.js";import{a as M,b as P,c as N}from"./hover-card-BQGdGAQ3.js";import{x as S}from"./x-Ckwicf6g.js";import{f as B}from"./file-text-DOYfYvrh.js";import{p as E,g as V,i as q}from"./paperclip-DDEfmkHc.js";import{I as F}from"./Icon-C2LTALdM.js";import{v as G}from"./video-MKp3LmNT.js";var H=[["circle",{cx:"8",cy:"18",r:"4",key:"1fc0mg"}],["path",{d:"M12 18V2l7 4",key:"g04rme"}]],J=r=>n(F,m(r,{name:"Music2",iconNode:H})),K=J,b=g("<div>"),L=g('<img class="size-full object-cover"height=96 width=96>'),O=g('<img class="size-full rounded object-cover"height=20 width=20>'),Q=g('<video class="size-full object-cover"muted>'),U=g('<span class="text-muted-foreground text-caption block truncate">'),X=g('<div><span class="block truncate">'),Y=g("<span class=sr-only>");const _={audio:K,document:B,image:q,source:V,unknown:E,video:G},z=r=>{if(r.type==="source-document")return"source";const t=r.mediaType??"";return t.startsWith("image/")?"image":t.startsWith("video/")?"video":t.startsWith("audio/")?"audio":t.startsWith("application/")||t.startsWith("text/")?"document":"unknown"},T=r=>{if(r.type==="source-document")return r.title||r.filename||"Source";const t=z(r);return r.filename||(t==="image"?"Image":"Attachment")},W=C(),A=C(),$=()=>I(W)??{variant:"grid"},R=()=>{const r=I(A);if(!r)throw new Error("Attachment components must be used within <Attachment>");return r};function Z(r){const[t,s]=h(r,["variant","class","children"]),e=()=>t.variant??"grid";return n(W.Provider,{value:{get variant(){return e()}},get children(){var a=b();return p(a,m({get class(){return d("flex items-start",e()==="list"?"flex-col gap-2":"flex-wrap gap-2",e()==="grid"&&"w-fit",t.class)}},s),!1,!0),u(a,()=>t.children),a}})}function ee(r){const[t,s]=h(r,["data","onRemove","class","children"]),e=$(),a=()=>z(t.data);return n(A.Provider,{value:{get data(){return t.data},get mediaCategory(){return a()},get onRemove(){return t.onRemove},get variant(){return e.variant}},get children(){var o=b();return p(o,m({get class(){return d("group relative",e.variant==="grid"&&"size-24 overflow-hidden rounded-lg",e.variant==="inline"&&["flex h-8 cursor-pointer select-none items-center gap-1.5","rounded-md bg-surface-strong px-1.5 text-foreground","font-medium text-sm transition-all","hover:bg-muted"],e.variant==="list"&&["flex w-full items-center gap-3 rounded-lg bg-surface p-3 text-foreground","hover:bg-muted/50"],t.class)}},s),!1,!0),u(o,()=>t.children),o}})}function re(r){const[t,s]=h(r,["fallbackIcon","class"]),e=R(),a=()=>e.variant==="inline"?"size-3":"size-4",o=c=>n(c,{get class(){return d(a(),"text-muted-foreground")}}),x=()=>{if(e.mediaCategory==="image"&&e.data.type==="file"&&e.data.url)return e.variant==="grid"?(()=>{var l=L();return k(i=>{var v=e.data.filename||"Image",f=e.data.url;return v!==i.e&&y(l,"alt",i.e=v),f!==i.t&&y(l,"src",i.t=f),i},{e:void 0,t:void 0}),l})():(()=>{var l=O();return k(i=>{var v=e.data.filename||"Image",f=e.data.url;return v!==i.e&&y(l,"alt",i.e=v),f!==i.t&&y(l,"src",i.t=f),i},{e:void 0,t:void 0}),l})();if(e.mediaCategory==="video"&&e.data.type==="file"&&e.data.url)return(()=>{var l=Q();return k(()=>y(l,"src",e.data.url)),l})();const c=_[e.mediaCategory];return t.fallbackIcon??o(c)};return(()=>{var c=b();return p(c,m({get class(){return d("flex shrink-0 items-center justify-center overflow-hidden",e.variant==="grid"&&"size-full bg-muted",e.variant==="inline"&&"size-5 rounded bg-background",e.variant==="list"&&"size-12 rounded bg-muted",t.class)}},s),!1,!0),u(c,x),c})()}function te(r){const[t,s]=h(r,["showMediaType","class"]),e=R(),a=()=>T(e.data);return n(w,{get when(){return e.variant!=="grid"},get children(){var o=X(),x=o.firstChild;return p(o,m({get class(){return d("min-w-0 flex-1",t.class)}},s),!1,!0),u(x,a),u(o,n(w,{get when(){return j(()=>!!(t.showMediaType&&e.variant==="list"))()&&e.data.mediaType},get children(){var c=U();return u(c,()=>e.data.mediaType),c}}),null),o}})}function ae(r){const t=R(),s=e=>{var a;e.stopPropagation(),(a=t.onRemove)==null||a.call(t)};return n(w,{get when(){return t.onRemove},get children(){return n(D,{get"aria-label"(){return r.label??"Remove"},get class(){return d(t.variant==="grid"&&["absolute top-2 right-2 size-6 rounded-full p-0","bg-background/80 backdrop-blur-sm","opacity-0 transition-opacity group-hover:opacity-100","hover:bg-background","[&>svg]:size-3"],t.variant==="inline"&&["size-5 rounded p-0","opacity-0 transition-opacity group-hover:opacity-100","[&>svg]:size-2.5"],t.variant==="list"&&["size-8 shrink-0 rounded p-0","[&>svg]:size-4"],r.class)},onClick:s,type:"button",variant:"ghost",get children(){return[j(()=>r.children??n(S,{})),(()=>{var e=Y();return u(e,()=>r.label??"Remove"),e})()]}})}})}function ne(r){return n(M,{get openDelay(){return r.openDelay??0},get closeDelay(){return r.closeDelay??0},get children(){return r.children}})}function se(r){return n(P,{get class(){return r.class},get children(){return r.children}})}function ie(r){return n(N,{get class(){return d("w-auto p-2",r.class)},get children(){return r.children}})}function oe(r){const[t,s]=h(r,["class","children"]);return(()=>{var e=b();return p(e,m({get class(){return d("flex items-center justify-center p-4 text-muted-foreground text-sm",t.class)}},s),!1,!0),u(e,()=>t.children??"No attachments"),e})()}export{Z as A,ee as a,ne as b,se as c,re as d,te as e,ie as f,T as g,z as h,ae as i,oe as j};