tembro 4.0.0 → 4.1.0
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/CHANGELOG.md +24 -0
- package/dist/components/charts/charts.d.ts +16 -5
- package/dist/components/display/chat.cjs +1 -0
- package/dist/components/display/chat.d.ts +94 -0
- package/dist/components/display/chat.js +1 -0
- package/dist/components/display/index.d.ts +1 -0
- package/dist/components/display/kanban.d.ts +33 -1
- package/dist/components/layout/sidebar.d.ts +24 -2
- package/dist/components/modern/rich-text-editor.d.ts +13 -1
- package/dist/components/theme-provider.d.ts +19 -6
- package/dist/components/ui/badge/index.d.ts +8 -2
- package/dist/src/components/charts/charts.cjs +1 -1
- package/dist/src/components/charts/charts.js +343 -252
- package/dist/src/components/display/activity-feed.cjs +1 -1
- package/dist/src/components/display/activity-feed.js +4 -1
- package/dist/src/components/display/chat.cjs +1 -0
- package/dist/src/components/display/chat.js +372 -0
- package/dist/src/components/display/index.cjs +1 -1
- package/dist/src/components/display/index.js +17 -16
- package/dist/src/components/display/kanban.cjs +1 -1
- package/dist/src/components/display/kanban.js +321 -176
- package/dist/src/components/display/timeline.cjs +1 -1
- package/dist/src/components/display/timeline.js +5 -5
- package/dist/src/components/inputs/tag-input.cjs +1 -1
- package/dist/src/components/inputs/tag-input.js +6 -2
- package/dist/src/components/layout/index.cjs +1 -1
- package/dist/src/components/layout/index.js +4 -4
- package/dist/src/components/layout/public.cjs +1 -1
- package/dist/src/components/layout/public.js +4 -4
- package/dist/src/components/layout/sidebar.cjs +1 -1
- package/dist/src/components/layout/sidebar.js +326 -228
- package/dist/src/components/layout/workspace-layout.cjs +1 -1
- package/dist/src/components/layout/workspace-layout.js +3 -3
- package/dist/src/components/modern/rich-text-editor.cjs +1 -1
- package/dist/src/components/modern/rich-text-editor.js +216 -89
- package/dist/src/components/theme-provider.cjs +1 -1
- package/dist/src/components/theme-provider.js +58 -36
- package/dist/src/components/ui/badge/index.cjs +1 -1
- package/dist/src/components/ui/badge/index.js +59 -47
- package/dist/src/components/ui/input/clearable.cjs +1 -1
- package/dist/src/components/ui/input/clearable.js +5 -2
- package/dist/src/components/ui/input/primitive.cjs +1 -1
- package/dist/src/components/ui/input/primitive.js +1 -1
- package/dist/src/index.cjs +1 -1
- package/dist/src/index.js +87 -86
- package/dist/src/public-component-surface.cjs +1 -1
- package/dist/src/public-component-surface.js +5 -0
- package/package.json +1 -1
- package/packages/cli/dist/index.cjs +3 -3
- package/packages/cli/vendor/src/components/charts/charts.tsx +55 -15
- package/packages/cli/vendor/src/components/display/activity-feed.tsx +1 -1
- package/packages/cli/vendor/src/components/display/chat.tsx +237 -0
- package/packages/cli/vendor/src/components/display/index.ts +1 -0
- package/packages/cli/vendor/src/components/display/kanban.tsx +219 -72
- package/packages/cli/vendor/src/components/display/timeline.tsx +10 -10
- package/packages/cli/vendor/src/components/inputs/tag-input.tsx +3 -2
- package/packages/cli/vendor/src/components/layout/sidebar.tsx +212 -51
- package/packages/cli/vendor/src/components/layout/workspace-layout.tsx +3 -3
- package/packages/cli/vendor/src/components/modern/rich-text-editor.tsx +115 -32
- package/packages/cli/vendor/src/components/theme-provider.tsx +82 -36
- package/packages/cli/vendor/src/components/ui/badge/index.tsx +29 -8
- package/packages/cli/vendor/src/components/ui/input/clearable.tsx +2 -2
- package/packages/cli/vendor/src/components/ui/input/primitive.tsx +1 -1
- package/packages/cli/vendor/src/public-component-surface.ts +1 -0
- package/packages/cli/vendor/templates/showcase/src/showcase/layout/HeroSection.tsx +2 -2
- package/packages/cli/vendor/templates/showcase/src/showcase/layout/WorkbenchSidebar.tsx +1 -1
- package/packages/cli/vendor/templates/styles/globals.css +136 -33
- package/registry.json +3 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/card/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a={default:`bg-primary`,success:`bg-emerald-500`,warning:`bg-amber-500`,danger:`bg-destructive`,info:`bg-blue-500`,muted:`bg-muted-foreground`};function o({className:e,title:r,description:o,actions:s,items:c,empty:l=`No activity yet.`,compact:u=!1,density:d,showConnector:f=!0,connectorClassName:p,contentClassName:m,itemClassName:h,...g}){let _=c.filter(e=>!e.hidden),v=!!(r||o||s),y=d?d===`compact`:u;return(0,i.jsxs)(n.Card,{"data-slot":`activity-feed`,className:t.cn(`min-w-0`,e),...g,children:[v&&(0,i.jsx)(n.CardHeader,{children:(0,i.jsxs)(`div`,{className:`flex min-w-0 items-start justify-between gap-3`,children:[(0,i.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[r&&(0,i.jsx)(n.CardTitle,{children:r}),o&&(0,i.jsx)(n.CardDescription,{children:o})]}),s&&(0,i.jsx)(`div`,{className:`shrink-0`,children:s})]})}),(0,i.jsx)(n.CardContent,{className:t.cn(`grid gap-0`,m),children:_.length===0?(0,i.jsx)(`div`,{className:`rounded-lg border border-dashed p-4 text-center text-sm text-muted-foreground`,children:l}):_.map((e,n)=>{let r=e.interactive??!!(e.href||e.onSelect),o=(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(`div`,{className:t.cn(`relative z-10 mt-0.5 flex size-6 shrink-0 items-center justify-center rounded-full border bg-background`,e.unread&&`border-primary/45 bg-primary/8 shadow-[0_0_0_3px_color-mix(in_oklch,var(--primary),transparent_88%)]`),children:e.icon??(0,i.jsx)(`span`,{className:t.cn(`size-2 rounded-full`,a[e.tone??`default`])})}),(0,i.jsxs)(`div`,{className:`min-w-0 flex-1 space-y-1`,children:[(0,i.jsxs)(`div`,{className:`flex min-w-0 items-start justify-between gap-2`,children:[(0,i.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[(0,i.jsx)(`div`,{className:`min-w-0 text-sm font-medium leading-5 text-foreground`,children:e.title}),e.meta&&(0,i.jsx)(`div`,{className:`text-xs text-muted-foreground`,children:e.meta})]}),(0,i.jsxs)(`div`,{className:`flex shrink-0 items-center gap-2`,children:[e.badge,e.time&&(0,i.jsx)(`div`,{className:`text-xs text-muted-foreground`,children:e.time})]})]}),e.description&&(0,i.jsx)(`div`,{className:`text-sm leading-5 text-muted-foreground`,children:e.description}),e.actions&&(0,i.jsx)(`div`,{className:`pt-1`,children:e.actions})]})]});return(0,i.jsxs)(`div`,{"data-slot":`activity-feed-item`,className:t.cn(`relative flex gap-3 pb-4 last:pb-0`,y&&`gap-2 pb-3`,h,e.className),children:[f&&n<_.length-1&&(0,i.jsx)(`div`,{className:t.cn(`absolute left-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/card/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a={default:`bg-primary`,success:`bg-emerald-500`,warning:`bg-amber-500`,danger:`bg-destructive`,info:`bg-blue-500`,muted:`bg-muted-foreground`};function o({className:e,title:r,description:o,actions:s,items:c,empty:l=`No activity yet.`,compact:u=!1,density:d,showConnector:f=!0,connectorClassName:p,contentClassName:m,itemClassName:h,...g}){let _=c.filter(e=>!e.hidden),v=!!(r||o||s),y=d?d===`compact`:u;return(0,i.jsxs)(n.Card,{"data-slot":`activity-feed`,className:t.cn(`min-w-0`,e),...g,children:[v&&(0,i.jsx)(n.CardHeader,{children:(0,i.jsxs)(`div`,{className:`flex min-w-0 items-start justify-between gap-3`,children:[(0,i.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[r&&(0,i.jsx)(n.CardTitle,{children:r}),o&&(0,i.jsx)(n.CardDescription,{children:o})]}),s&&(0,i.jsx)(`div`,{className:`shrink-0`,children:s})]})}),(0,i.jsx)(n.CardContent,{className:t.cn(`grid gap-0`,m),children:_.length===0?(0,i.jsx)(`div`,{className:`rounded-lg border border-dashed p-4 text-center text-sm text-muted-foreground`,children:l}):_.map((e,n)=>{let r=e.interactive??!!(e.href||e.onSelect),o=(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(`div`,{className:t.cn(`relative z-10 mt-0.5 flex size-6 shrink-0 items-center justify-center rounded-full border bg-background`,e.unread&&`border-primary/45 bg-primary/8 shadow-[0_0_0_3px_color-mix(in_oklch,var(--primary),transparent_88%)]`),children:e.icon??(0,i.jsx)(`span`,{className:t.cn(`size-2 rounded-full`,a[e.tone??`default`])})}),(0,i.jsxs)(`div`,{className:`min-w-0 flex-1 space-y-1`,children:[(0,i.jsxs)(`div`,{className:`flex min-w-0 items-start justify-between gap-2`,children:[(0,i.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[(0,i.jsx)(`div`,{className:`min-w-0 text-sm font-medium leading-5 text-foreground`,children:e.title}),e.meta&&(0,i.jsx)(`div`,{className:`text-xs text-muted-foreground`,children:e.meta})]}),(0,i.jsxs)(`div`,{className:`flex shrink-0 items-center gap-2`,children:[e.badge,e.time&&(0,i.jsx)(`div`,{className:`text-xs text-muted-foreground`,children:e.time})]})]}),e.description&&(0,i.jsx)(`div`,{className:`text-sm leading-5 text-muted-foreground`,children:e.description}),e.actions&&(0,i.jsx)(`div`,{className:`pt-1`,children:e.actions})]})]});return(0,i.jsxs)(`div`,{"data-slot":`activity-feed-item`,className:t.cn(`relative flex gap-3 pb-4 last:pb-0`,y&&`gap-2 pb-3`,h,e.className),children:[f&&n<_.length-1&&(0,i.jsx)(`div`,{"data-slot":`activity-feed-connector`,className:t.cn(`absolute left-5 top-8 h-[calc(100%-2rem)] w-px bg-border`,p)}),e.href?(0,i.jsx)(`a`,{href:e.href,target:e.target,rel:e.rel,className:t.cn(`flex min-w-0 flex-1 gap-3 rounded-[var(--radius-lg)] px-2 py-1.5 transition-[background-color,border-color,box-shadow]`,r&&`hover:bg-muted/35 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40`),children:o}):r?(0,i.jsx)(`button`,{type:`button`,className:`flex min-w-0 flex-1 gap-3 rounded-[var(--radius-lg)] px-2 py-1.5 text-left transition-[background-color,border-color,box-shadow] hover:bg-muted/35 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40`,onClick:e.onSelect,children:o}):(0,i.jsx)(`div`,{className:`flex min-w-0 flex-1 gap-3 px-2 py-1.5`,children:o})]},e.id)})})]})}exports.ActivityFeed=o;
|
|
@@ -70,7 +70,10 @@ function u({ className: u, title: d, description: f, actions: p, items: m, empty
|
|
|
70
70
|
return /* @__PURE__ */ c("div", {
|
|
71
71
|
"data-slot": "activity-feed-item",
|
|
72
72
|
className: e("relative flex gap-3 pb-4 last:pb-0", T && "gap-2 pb-3", x, t.className),
|
|
73
|
-
children: [v && n < C.length - 1 && /* @__PURE__ */ s("div", {
|
|
73
|
+
children: [v && n < C.length - 1 && /* @__PURE__ */ s("div", {
|
|
74
|
+
"data-slot": "activity-feed-connector",
|
|
75
|
+
className: e("absolute left-5 top-8 h-[calc(100%-2rem)] w-px bg-border", y)
|
|
76
|
+
}), t.href ? /* @__PURE__ */ s("a", {
|
|
74
77
|
href: t.href,
|
|
75
78
|
target: t.target,
|
|
76
79
|
rel: t.rel,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("../ui/badge/index.cjs"),i=require("../ui/textarea/index.cjs"),a=require("../ui/input/index.cjs"),o=require("./avatar.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("lucide-react"),l=require("react/jsx-runtime");function u({sidebar:e,details:n,children:r,className:i,...a}){return(0,l.jsxs)(`section`,{"data-slot":`chat-shell`,className:t.cn(`grid min-h-[34rem] overflow-hidden rounded-lg border bg-background shadow-sm lg:grid-cols-[18rem_minmax(0,1fr)]`,n&&`xl:grid-cols-[18rem_minmax(0,1fr)_17rem]`,i),...a,children:[e?(0,l.jsx)(`aside`,{"data-slot":`chat-sidebar`,className:`min-h-0 border-b lg:border-b-0 lg:border-r`,children:e}):null,(0,l.jsx)(`div`,{"data-slot":`chat-main`,className:`grid min-h-0 min-w-0 grid-rows-[auto_minmax(0,1fr)_auto]`,children:r}),n?(0,l.jsx)(`aside`,{"data-slot":`chat-details`,className:`hidden min-h-0 border-l xl:block`,children:n}):null]})}function d({participant:e,description:n,actions:r,className:i,...a}){return(0,l.jsxs)(`header`,{"data-slot":`chat-header`,className:t.cn(`flex min-h-16 items-center gap-3 border-b px-4 py-2.5`,i),...a,children:[(0,l.jsx)(o.Avatar,{size:`sm`,name:e.name,src:e.avatar,fallback:e.fallback,status:e.status}),(0,l.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[(0,l.jsx)(`div`,{className:`truncate text-sm font-semibold`,children:e.name}),(0,l.jsx)(`div`,{className:`truncate text-xs text-muted-foreground`,children:n??(e.status===`online`?`Online`:e.status)})]}),(0,l.jsx)(`div`,{className:`flex shrink-0 items-center gap-1`,children:r})]})}function f({items:e,selectedKey:n,defaultSelectedKey:i,onSelect:u,searchable:d=!0,searchPlaceholder:f=`Search conversations...`,empty:p=`No conversations found.`,className:m,...h}){let[g,_]=s.useState(i),[v,y]=s.useState(``),b=n??g,x=e.filter(e=>`${e.participant.name} ${String(e.preview??``)}`.toLowerCase().includes(v.trim().toLowerCase()));return(0,l.jsxs)(`div`,{"data-slot":`conversation-list`,className:t.cn(`grid h-full min-h-0 grid-rows-[auto_minmax(0,1fr)]`,m),...h,children:[d?(0,l.jsx)(`div`,{className:`border-b p-3`,children:(0,l.jsx)(a.Input,{type:`search`,value:v,onValueChange:y,placeholder:f,leading:(0,l.jsx)(c.SearchIcon,{}),clearable:!0,"aria-label":f})}):(0,l.jsx)(`span`,{}),(0,l.jsx)(`div`,{role:`listbox`,"aria-label":`Conversations`,className:`min-h-0 overflow-y-auto p-2`,children:x.length?x.map(e=>{let t=e.key===b;return(0,l.jsxs)(`button`,{type:`button`,role:`option`,"aria-selected":t,"data-selected":t||void 0,className:`flex w-full items-start gap-3 rounded-md px-2.5 py-2.5 text-left outline-none transition-colors hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring data-[selected=true]:bg-accent`,onClick:()=>{n===void 0&&_(e.key),u?.(e)},children:[(0,l.jsx)(o.Avatar,{size:`sm`,name:e.participant.name,src:e.participant.avatar,fallback:e.participant.fallback,status:e.participant.status}),(0,l.jsxs)(`span`,{className:`min-w-0 flex-1`,children:[(0,l.jsxs)(`span`,{className:`flex items-center gap-2`,children:[(0,l.jsx)(`strong`,{className:`min-w-0 flex-1 truncate text-sm font-medium`,children:e.participant.name}),(0,l.jsx)(`span`,{className:`shrink-0 text-[11px] text-muted-foreground`,children:e.time})]}),(0,l.jsxs)(`span`,{className:`mt-0.5 flex items-center gap-2`,children:[(0,l.jsx)(`span`,{className:`min-w-0 flex-1 truncate text-xs text-muted-foreground`,children:e.preview}),e.unread?(0,l.jsx)(r.Badge,{size:`sm`,label:e.unread}):null]})]})]},e.key)}):(0,l.jsx)(`div`,{className:`grid min-h-32 place-items-center px-4 text-center text-sm text-muted-foreground`,children:p})})]})}function p({autoScroll:e=!0,empty:n=`No messages yet.`,children:r,className:i,...a}){let o=s.useRef(null);return s.useEffect(()=>{let t=o.current;!e||!t||(typeof t.scrollTo==`function`?t.scrollTo({top:t.scrollHeight,behavior:`smooth`}):t.scrollTop=t.scrollHeight)},[e,r]),(0,l.jsx)(`div`,{ref:o,"data-slot":`chat-message-list`,role:`log`,"aria-live":`polite`,className:t.cn(`min-h-0 overflow-y-auto bg-muted/15 px-4 py-5`,i),...a,children:s.Children.count(r)?(0,l.jsx)(`div`,{className:`mx-auto grid w-full max-w-3xl gap-4`,children:r}):(0,l.jsx)(`div`,{className:`grid h-full place-items-center text-sm text-muted-foreground`,children:n})})}function m({name:e,size:r,type:i,href:a,preview:o,onRemove:s,attachmentKey:u,className:d,...f}){let p=(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(`span`,{className:`grid size-9 shrink-0 place-items-center overflow-hidden rounded-md bg-muted`,children:o?(0,l.jsx)(`img`,{src:o,alt:``,className:`size-full object-cover`}):(0,l.jsx)(c.FileIcon,{className:`size-4`})}),(0,l.jsxs)(`span`,{className:`min-w-0 flex-1`,children:[(0,l.jsx)(`span`,{className:`block truncate text-xs font-medium text-foreground`,children:e}),(0,l.jsx)(`span`,{className:`block truncate text-[11px] text-muted-foreground`,children:[i,r].filter(Boolean).join(` · `)})]})]});return(0,l.jsxs)(`div`,{"data-slot":`chat-attachment`,className:t.cn(`flex min-w-0 items-center gap-2 rounded-md border bg-background p-2`,d),...f,children:[a?(0,l.jsx)(`a`,{href:a,className:`flex min-w-0 flex-1 items-center gap-2 outline-none focus-visible:ring-2 focus-visible:ring-ring`,children:p}):p,s?(0,l.jsx)(n.Button,{type:`button`,size:`icon-xs`,variant:`ghost`,iconOnly:!0,"aria-label":`Remove ${e}`,onClick:s,children:(0,l.jsx)(c.XIcon,{})}):null]})}function h({participant:e,outgoing:n=!1,time:r,status:i,replyTo:a,attachments:s,reactions:u,onReaction:d,actions:f,children:p,className:h,...g}){let _=i===`delivered`||i===`read`?c.CheckCheckIcon:c.CheckIcon;return(0,l.jsxs)(`article`,{"data-slot":`chat-message`,"data-outgoing":n||void 0,className:t.cn(`group flex max-w-[88%] items-end gap-2 justify-self-start data-[outgoing=true]:justify-self-end data-[outgoing=true]:flex-row-reverse sm:max-w-[75%]`,h),...g,children:[e?(0,l.jsx)(o.Avatar,{size:`xs`,name:e.name,src:e.avatar,fallback:e.fallback}):null,(0,l.jsxs)(`div`,{className:`min-w-0`,children:[e&&!n?(0,l.jsx)(`div`,{className:`mb-1 px-1 text-[11px] font-medium text-muted-foreground`,children:e.name}):null,(0,l.jsxs)(`div`,{className:t.cn(`rounded-lg rounded-bl-sm border bg-background px-3 py-2 text-sm leading-5 shadow-sm`,n&&`rounded-bl-lg rounded-br-sm border-primary bg-primary text-primary-foreground`),children:[a?(0,l.jsx)(`div`,{className:t.cn(`mb-2 border-l-2 pl-2 text-xs opacity-75`,n?`border-primary-foreground/60`:`border-primary`),children:a}):null,(0,l.jsx)(`div`,{className:`whitespace-pre-wrap break-words`,children:p}),s?.length?(0,l.jsx)(`div`,{className:`mt-2 grid gap-1.5`,children:s.map(({key:e,...t})=>(0,l.jsx)(m,{attachmentKey:e,...t,className:n?`border-primary-foreground/20 bg-primary-foreground/10 text-primary-foreground`:void 0},e))}):null,(0,l.jsxs)(`div`,{className:t.cn(`mt-1 flex items-center justify-end gap-1 text-[10px] text-muted-foreground`,n&&`text-primary-foreground/75`),children:[(0,l.jsx)(`span`,{children:r}),i&&i!==`failed`&&i!==`sending`?(0,l.jsx)(_,{className:t.cn(`size-3`,i===`read`&&`text-sky-300`)}):null,i===`sending`?(0,l.jsx)(`span`,{children:`Sending...`}):null,i===`failed`?(0,l.jsx)(`span`,{className:`font-medium text-destructive`,children:`Failed`}):null]})]}),u?.length?(0,l.jsx)(`div`,{className:t.cn(`mt-1 flex flex-wrap gap-1`,n&&`justify-end`),children:u.map(e=>(0,l.jsxs)(`button`,{type:`button`,"aria-pressed":e.active,className:`rounded-full border bg-background px-2 py-0.5 text-[11px] shadow-sm outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring aria-pressed:border-primary aria-pressed:bg-primary/10`,onClick:()=>d?.(e.key),children:[e.label,e.count?` ${e.count}`:``]},e.key))}):null]}),f?(0,l.jsx)(`div`,{className:`self-center opacity-0 transition-opacity group-hover:opacity-100 group-focus-within:opacity-100`,children:f}):null]})}function g({participant:e,className:n,...r}){return(0,l.jsxs)(`div`,{"data-slot":`chat-typing`,className:t.cn(`flex items-center gap-2 text-xs text-muted-foreground`,n),...r,children:[e?(0,l.jsx)(o.Avatar,{size:`xs`,name:e.name,src:e.avatar,fallback:e.fallback}):null,(0,l.jsxs)(`span`,{className:`flex items-center gap-1 rounded-full border bg-background px-3 py-2`,children:[(0,l.jsx)(`span`,{className:`size-1.5 animate-bounce rounded-full bg-current [animation-delay:-0.2s]`}),(0,l.jsx)(`span`,{className:`size-1.5 animate-bounce rounded-full bg-current [animation-delay:-0.1s]`}),(0,l.jsx)(`span`,{className:`size-1.5 animate-bounce rounded-full bg-current`})]})]})}function _({value:e,defaultValue:r=``,onValueChange:a,onSend:o,placeholder:u=`Write a message...`,disabled:d=!1,sending:f=!1,attachments:p,onRemoveAttachment:h,onAttachmentClick:g,onEmojiClick:_,maxLength:v,submitLabel:y=`Send message`,className:b,...x}){let[S,C]=s.useState(r),w=e??S,T=t=>{e===void 0&&C(t),a?.(t)},E=async()=>{let e=w.trim();!e||d||f||(await o(e),T(``))};return(0,l.jsxs)(`form`,{"data-slot":`chat-composer`,className:t.cn(`border-t bg-background p-3`,b),onSubmit:e=>{e.preventDefault(),E()},...x,children:[p?.length?(0,l.jsx)(`div`,{className:`mb-2 grid gap-2 sm:grid-cols-2`,children:p.map(({key:e,...t})=>(0,l.jsx)(m,{attachmentKey:e,...t,onRemove:h?()=>h(e):void 0},e))}):null,(0,l.jsxs)(`div`,{className:`flex items-end gap-2 rounded-lg border bg-background p-1.5 shadow-sm transition-[border-color,box-shadow] focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/20`,children:[g?(0,l.jsx)(n.Button,{type:`button`,size:`icon-sm`,variant:`ghost`,iconOnly:!0,"aria-label":`Attach file`,onClick:g,children:(0,l.jsx)(c.PaperclipIcon,{})}):null,(0,l.jsx)(i.Textarea,{value:w,onValueChange:T,rows:1,maxLength:v,disabled:d,placeholder:u,"aria-label":u,className:`max-h-36 min-h-9 resize-none border-0 bg-transparent px-2 py-2 font-normal shadow-none focus-visible:shadow-none`,onKeyDown:e=>{e.key===`Enter`&&!e.shiftKey&&(e.preventDefault(),E())}}),_?(0,l.jsx)(n.Button,{type:`button`,size:`icon-sm`,variant:`ghost`,iconOnly:!0,"aria-label":`Choose emoji`,onClick:_,children:(0,l.jsx)(c.SmileIcon,{})}):null,(0,l.jsx)(n.Button,{type:`submit`,size:`icon-sm`,iconOnly:!0,"aria-label":y,loading:f,disabled:d||!w.trim(),children:(0,l.jsx)(c.SendIcon,{})})]})]})}function v(){return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(n.Button,{size:`icon-sm`,variant:`ghost`,iconOnly:!0,"aria-label":`Search conversation`,children:(0,l.jsx)(c.SearchIcon,{})}),(0,l.jsx)(n.Button,{size:`icon-sm`,variant:`ghost`,iconOnly:!0,"aria-label":`More conversation actions`,children:(0,l.jsx)(c.MoreHorizontalIcon,{})})]})}exports.ChatAttachment=m,exports.ChatComposer=_,exports.ChatHeader=d,exports.ChatHeaderActions=v,exports.ChatMessage=h,exports.ChatMessageList=p,exports.ChatShell=u,exports.ChatTypingIndicator=g,exports.ConversationList=f;
|
|
@@ -0,0 +1,372 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn as e } from "../../lib/utils.js";
|
|
3
|
+
import { Button as t } from "../ui/button/index.js";
|
|
4
|
+
import { Badge as n } from "../ui/badge/index.js";
|
|
5
|
+
import { Textarea as r } from "../ui/textarea/index.js";
|
|
6
|
+
import { Input as i } from "../ui/input/index.js";
|
|
7
|
+
import { Avatar as a } from "./avatar.js";
|
|
8
|
+
import * as o from "react";
|
|
9
|
+
import { CheckCheckIcon as s, CheckIcon as c, FileIcon as l, MoreHorizontalIcon as u, PaperclipIcon as d, SearchIcon as f, SendIcon as p, SmileIcon as m, XIcon as h } from "lucide-react";
|
|
10
|
+
import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
|
|
11
|
+
//#region src/components/display/chat.tsx
|
|
12
|
+
function y({ sidebar: t, details: n, children: r, className: i, ...a }) {
|
|
13
|
+
return /* @__PURE__ */ v("section", {
|
|
14
|
+
"data-slot": "chat-shell",
|
|
15
|
+
className: e("grid min-h-[34rem] overflow-hidden rounded-lg border bg-background shadow-sm lg:grid-cols-[18rem_minmax(0,1fr)]", n && "xl:grid-cols-[18rem_minmax(0,1fr)_17rem]", i),
|
|
16
|
+
...a,
|
|
17
|
+
children: [
|
|
18
|
+
t ? /* @__PURE__ */ _("aside", {
|
|
19
|
+
"data-slot": "chat-sidebar",
|
|
20
|
+
className: "min-h-0 border-b lg:border-b-0 lg:border-r",
|
|
21
|
+
children: t
|
|
22
|
+
}) : null,
|
|
23
|
+
/* @__PURE__ */ _("div", {
|
|
24
|
+
"data-slot": "chat-main",
|
|
25
|
+
className: "grid min-h-0 min-w-0 grid-rows-[auto_minmax(0,1fr)_auto]",
|
|
26
|
+
children: r
|
|
27
|
+
}),
|
|
28
|
+
n ? /* @__PURE__ */ _("aside", {
|
|
29
|
+
"data-slot": "chat-details",
|
|
30
|
+
className: "hidden min-h-0 border-l xl:block",
|
|
31
|
+
children: n
|
|
32
|
+
}) : null
|
|
33
|
+
]
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
function b({ participant: t, description: n, actions: r, className: i, ...o }) {
|
|
37
|
+
return /* @__PURE__ */ v("header", {
|
|
38
|
+
"data-slot": "chat-header",
|
|
39
|
+
className: e("flex min-h-16 items-center gap-3 border-b px-4 py-2.5", i),
|
|
40
|
+
...o,
|
|
41
|
+
children: [
|
|
42
|
+
/* @__PURE__ */ _(a, {
|
|
43
|
+
size: "sm",
|
|
44
|
+
name: t.name,
|
|
45
|
+
src: t.avatar,
|
|
46
|
+
fallback: t.fallback,
|
|
47
|
+
status: t.status
|
|
48
|
+
}),
|
|
49
|
+
/* @__PURE__ */ v("div", {
|
|
50
|
+
className: "min-w-0 flex-1",
|
|
51
|
+
children: [/* @__PURE__ */ _("div", {
|
|
52
|
+
className: "truncate text-sm font-semibold",
|
|
53
|
+
children: t.name
|
|
54
|
+
}), /* @__PURE__ */ _("div", {
|
|
55
|
+
className: "truncate text-xs text-muted-foreground",
|
|
56
|
+
children: n ?? (t.status === "online" ? "Online" : t.status)
|
|
57
|
+
})]
|
|
58
|
+
}),
|
|
59
|
+
/* @__PURE__ */ _("div", {
|
|
60
|
+
className: "flex shrink-0 items-center gap-1",
|
|
61
|
+
children: r
|
|
62
|
+
})
|
|
63
|
+
]
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
function x({ items: t, selectedKey: r, defaultSelectedKey: s, onSelect: c, searchable: l = !0, searchPlaceholder: u = "Search conversations...", empty: d = "No conversations found.", className: p, ...m }) {
|
|
67
|
+
let [h, g] = o.useState(s), [y, b] = o.useState(""), x = r ?? h, S = t.filter((e) => `${e.participant.name} ${String(e.preview ?? "")}`.toLowerCase().includes(y.trim().toLowerCase()));
|
|
68
|
+
return /* @__PURE__ */ v("div", {
|
|
69
|
+
"data-slot": "conversation-list",
|
|
70
|
+
className: e("grid h-full min-h-0 grid-rows-[auto_minmax(0,1fr)]", p),
|
|
71
|
+
...m,
|
|
72
|
+
children: [l ? /* @__PURE__ */ _("div", {
|
|
73
|
+
className: "border-b p-3",
|
|
74
|
+
children: /* @__PURE__ */ _(i, {
|
|
75
|
+
type: "search",
|
|
76
|
+
value: y,
|
|
77
|
+
onValueChange: b,
|
|
78
|
+
placeholder: u,
|
|
79
|
+
leading: /* @__PURE__ */ _(f, {}),
|
|
80
|
+
clearable: !0,
|
|
81
|
+
"aria-label": u
|
|
82
|
+
})
|
|
83
|
+
}) : /* @__PURE__ */ _("span", {}), /* @__PURE__ */ _("div", {
|
|
84
|
+
role: "listbox",
|
|
85
|
+
"aria-label": "Conversations",
|
|
86
|
+
className: "min-h-0 overflow-y-auto p-2",
|
|
87
|
+
children: S.length ? S.map((e) => {
|
|
88
|
+
let t = e.key === x;
|
|
89
|
+
return /* @__PURE__ */ v("button", {
|
|
90
|
+
type: "button",
|
|
91
|
+
role: "option",
|
|
92
|
+
"aria-selected": t,
|
|
93
|
+
"data-selected": t || void 0,
|
|
94
|
+
className: "flex w-full items-start gap-3 rounded-md px-2.5 py-2.5 text-left outline-none transition-colors hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring data-[selected=true]:bg-accent",
|
|
95
|
+
onClick: () => {
|
|
96
|
+
r === void 0 && g(e.key), c?.(e);
|
|
97
|
+
},
|
|
98
|
+
children: [/* @__PURE__ */ _(a, {
|
|
99
|
+
size: "sm",
|
|
100
|
+
name: e.participant.name,
|
|
101
|
+
src: e.participant.avatar,
|
|
102
|
+
fallback: e.participant.fallback,
|
|
103
|
+
status: e.participant.status
|
|
104
|
+
}), /* @__PURE__ */ v("span", {
|
|
105
|
+
className: "min-w-0 flex-1",
|
|
106
|
+
children: [/* @__PURE__ */ v("span", {
|
|
107
|
+
className: "flex items-center gap-2",
|
|
108
|
+
children: [/* @__PURE__ */ _("strong", {
|
|
109
|
+
className: "min-w-0 flex-1 truncate text-sm font-medium",
|
|
110
|
+
children: e.participant.name
|
|
111
|
+
}), /* @__PURE__ */ _("span", {
|
|
112
|
+
className: "shrink-0 text-[11px] text-muted-foreground",
|
|
113
|
+
children: e.time
|
|
114
|
+
})]
|
|
115
|
+
}), /* @__PURE__ */ v("span", {
|
|
116
|
+
className: "mt-0.5 flex items-center gap-2",
|
|
117
|
+
children: [/* @__PURE__ */ _("span", {
|
|
118
|
+
className: "min-w-0 flex-1 truncate text-xs text-muted-foreground",
|
|
119
|
+
children: e.preview
|
|
120
|
+
}), e.unread ? /* @__PURE__ */ _(n, {
|
|
121
|
+
size: "sm",
|
|
122
|
+
label: e.unread
|
|
123
|
+
}) : null]
|
|
124
|
+
})]
|
|
125
|
+
})]
|
|
126
|
+
}, e.key);
|
|
127
|
+
}) : /* @__PURE__ */ _("div", {
|
|
128
|
+
className: "grid min-h-32 place-items-center px-4 text-center text-sm text-muted-foreground",
|
|
129
|
+
children: d
|
|
130
|
+
})
|
|
131
|
+
})]
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
function S({ autoScroll: t = !0, empty: n = "No messages yet.", children: r, className: i, ...a }) {
|
|
135
|
+
let s = o.useRef(null);
|
|
136
|
+
return o.useEffect(() => {
|
|
137
|
+
let e = s.current;
|
|
138
|
+
!t || !e || (typeof e.scrollTo == "function" ? e.scrollTo({
|
|
139
|
+
top: e.scrollHeight,
|
|
140
|
+
behavior: "smooth"
|
|
141
|
+
}) : e.scrollTop = e.scrollHeight);
|
|
142
|
+
}, [t, r]), /* @__PURE__ */ _("div", {
|
|
143
|
+
ref: s,
|
|
144
|
+
"data-slot": "chat-message-list",
|
|
145
|
+
role: "log",
|
|
146
|
+
"aria-live": "polite",
|
|
147
|
+
className: e("min-h-0 overflow-y-auto bg-muted/15 px-4 py-5", i),
|
|
148
|
+
...a,
|
|
149
|
+
children: o.Children.count(r) ? /* @__PURE__ */ _("div", {
|
|
150
|
+
className: "mx-auto grid w-full max-w-3xl gap-4",
|
|
151
|
+
children: r
|
|
152
|
+
}) : /* @__PURE__ */ _("div", {
|
|
153
|
+
className: "grid h-full place-items-center text-sm text-muted-foreground",
|
|
154
|
+
children: n
|
|
155
|
+
})
|
|
156
|
+
});
|
|
157
|
+
}
|
|
158
|
+
function C({ name: n, size: r, type: i, href: a, preview: o, onRemove: s, attachmentKey: c, className: u, ...d }) {
|
|
159
|
+
let f = /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _("span", {
|
|
160
|
+
className: "grid size-9 shrink-0 place-items-center overflow-hidden rounded-md bg-muted",
|
|
161
|
+
children: o ? /* @__PURE__ */ _("img", {
|
|
162
|
+
src: o,
|
|
163
|
+
alt: "",
|
|
164
|
+
className: "size-full object-cover"
|
|
165
|
+
}) : /* @__PURE__ */ _(l, { className: "size-4" })
|
|
166
|
+
}), /* @__PURE__ */ v("span", {
|
|
167
|
+
className: "min-w-0 flex-1",
|
|
168
|
+
children: [/* @__PURE__ */ _("span", {
|
|
169
|
+
className: "block truncate text-xs font-medium text-foreground",
|
|
170
|
+
children: n
|
|
171
|
+
}), /* @__PURE__ */ _("span", {
|
|
172
|
+
className: "block truncate text-[11px] text-muted-foreground",
|
|
173
|
+
children: [i, r].filter(Boolean).join(" · ")
|
|
174
|
+
})]
|
|
175
|
+
})] });
|
|
176
|
+
return /* @__PURE__ */ v("div", {
|
|
177
|
+
"data-slot": "chat-attachment",
|
|
178
|
+
className: e("flex min-w-0 items-center gap-2 rounded-md border bg-background p-2", u),
|
|
179
|
+
...d,
|
|
180
|
+
children: [a ? /* @__PURE__ */ _("a", {
|
|
181
|
+
href: a,
|
|
182
|
+
className: "flex min-w-0 flex-1 items-center gap-2 outline-none focus-visible:ring-2 focus-visible:ring-ring",
|
|
183
|
+
children: f
|
|
184
|
+
}) : f, s ? /* @__PURE__ */ _(t, {
|
|
185
|
+
type: "button",
|
|
186
|
+
size: "icon-xs",
|
|
187
|
+
variant: "ghost",
|
|
188
|
+
iconOnly: !0,
|
|
189
|
+
"aria-label": `Remove ${n}`,
|
|
190
|
+
onClick: s,
|
|
191
|
+
children: /* @__PURE__ */ _(h, {})
|
|
192
|
+
}) : null]
|
|
193
|
+
});
|
|
194
|
+
}
|
|
195
|
+
function w({ participant: t, outgoing: n = !1, time: r, status: i, replyTo: o, attachments: l, reactions: u, onReaction: d, actions: f, children: p, className: m, ...h }) {
|
|
196
|
+
let g = i === "delivered" || i === "read" ? s : c;
|
|
197
|
+
return /* @__PURE__ */ v("article", {
|
|
198
|
+
"data-slot": "chat-message",
|
|
199
|
+
"data-outgoing": n || void 0,
|
|
200
|
+
className: e("group flex max-w-[88%] items-end gap-2 justify-self-start data-[outgoing=true]:justify-self-end data-[outgoing=true]:flex-row-reverse sm:max-w-[75%]", m),
|
|
201
|
+
...h,
|
|
202
|
+
children: [
|
|
203
|
+
t ? /* @__PURE__ */ _(a, {
|
|
204
|
+
size: "xs",
|
|
205
|
+
name: t.name,
|
|
206
|
+
src: t.avatar,
|
|
207
|
+
fallback: t.fallback
|
|
208
|
+
}) : null,
|
|
209
|
+
/* @__PURE__ */ v("div", {
|
|
210
|
+
className: "min-w-0",
|
|
211
|
+
children: [
|
|
212
|
+
t && !n ? /* @__PURE__ */ _("div", {
|
|
213
|
+
className: "mb-1 px-1 text-[11px] font-medium text-muted-foreground",
|
|
214
|
+
children: t.name
|
|
215
|
+
}) : null,
|
|
216
|
+
/* @__PURE__ */ v("div", {
|
|
217
|
+
className: e("rounded-lg rounded-bl-sm border bg-background px-3 py-2 text-sm leading-5 shadow-sm", n && "rounded-bl-lg rounded-br-sm border-primary bg-primary text-primary-foreground"),
|
|
218
|
+
children: [
|
|
219
|
+
o ? /* @__PURE__ */ _("div", {
|
|
220
|
+
className: e("mb-2 border-l-2 pl-2 text-xs opacity-75", n ? "border-primary-foreground/60" : "border-primary"),
|
|
221
|
+
children: o
|
|
222
|
+
}) : null,
|
|
223
|
+
/* @__PURE__ */ _("div", {
|
|
224
|
+
className: "whitespace-pre-wrap break-words",
|
|
225
|
+
children: p
|
|
226
|
+
}),
|
|
227
|
+
l?.length ? /* @__PURE__ */ _("div", {
|
|
228
|
+
className: "mt-2 grid gap-1.5",
|
|
229
|
+
children: l.map(({ key: e, ...t }) => /* @__PURE__ */ _(C, {
|
|
230
|
+
attachmentKey: e,
|
|
231
|
+
...t,
|
|
232
|
+
className: n ? "border-primary-foreground/20 bg-primary-foreground/10 text-primary-foreground" : void 0
|
|
233
|
+
}, e))
|
|
234
|
+
}) : null,
|
|
235
|
+
/* @__PURE__ */ v("div", {
|
|
236
|
+
className: e("mt-1 flex items-center justify-end gap-1 text-[10px] text-muted-foreground", n && "text-primary-foreground/75"),
|
|
237
|
+
children: [
|
|
238
|
+
/* @__PURE__ */ _("span", { children: r }),
|
|
239
|
+
i && i !== "failed" && i !== "sending" ? /* @__PURE__ */ _(g, { className: e("size-3", i === "read" && "text-sky-300") }) : null,
|
|
240
|
+
i === "sending" ? /* @__PURE__ */ _("span", { children: "Sending..." }) : null,
|
|
241
|
+
i === "failed" ? /* @__PURE__ */ _("span", {
|
|
242
|
+
className: "font-medium text-destructive",
|
|
243
|
+
children: "Failed"
|
|
244
|
+
}) : null
|
|
245
|
+
]
|
|
246
|
+
})
|
|
247
|
+
]
|
|
248
|
+
}),
|
|
249
|
+
u?.length ? /* @__PURE__ */ _("div", {
|
|
250
|
+
className: e("mt-1 flex flex-wrap gap-1", n && "justify-end"),
|
|
251
|
+
children: u.map((e) => /* @__PURE__ */ v("button", {
|
|
252
|
+
type: "button",
|
|
253
|
+
"aria-pressed": e.active,
|
|
254
|
+
className: "rounded-full border bg-background px-2 py-0.5 text-[11px] shadow-sm outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring aria-pressed:border-primary aria-pressed:bg-primary/10",
|
|
255
|
+
onClick: () => d?.(e.key),
|
|
256
|
+
children: [e.label, e.count ? ` ${e.count}` : ""]
|
|
257
|
+
}, e.key))
|
|
258
|
+
}) : null
|
|
259
|
+
]
|
|
260
|
+
}),
|
|
261
|
+
f ? /* @__PURE__ */ _("div", {
|
|
262
|
+
className: "self-center opacity-0 transition-opacity group-hover:opacity-100 group-focus-within:opacity-100",
|
|
263
|
+
children: f
|
|
264
|
+
}) : null
|
|
265
|
+
]
|
|
266
|
+
});
|
|
267
|
+
}
|
|
268
|
+
function T({ participant: t, className: n, ...r }) {
|
|
269
|
+
return /* @__PURE__ */ v("div", {
|
|
270
|
+
"data-slot": "chat-typing",
|
|
271
|
+
className: e("flex items-center gap-2 text-xs text-muted-foreground", n),
|
|
272
|
+
...r,
|
|
273
|
+
children: [t ? /* @__PURE__ */ _(a, {
|
|
274
|
+
size: "xs",
|
|
275
|
+
name: t.name,
|
|
276
|
+
src: t.avatar,
|
|
277
|
+
fallback: t.fallback
|
|
278
|
+
}) : null, /* @__PURE__ */ v("span", {
|
|
279
|
+
className: "flex items-center gap-1 rounded-full border bg-background px-3 py-2",
|
|
280
|
+
children: [
|
|
281
|
+
/* @__PURE__ */ _("span", { className: "size-1.5 animate-bounce rounded-full bg-current [animation-delay:-0.2s]" }),
|
|
282
|
+
/* @__PURE__ */ _("span", { className: "size-1.5 animate-bounce rounded-full bg-current [animation-delay:-0.1s]" }),
|
|
283
|
+
/* @__PURE__ */ _("span", { className: "size-1.5 animate-bounce rounded-full bg-current" })
|
|
284
|
+
]
|
|
285
|
+
})]
|
|
286
|
+
});
|
|
287
|
+
}
|
|
288
|
+
function E({ value: n, defaultValue: i = "", onValueChange: a, onSend: s, placeholder: c = "Write a message...", disabled: l = !1, sending: u = !1, attachments: f, onRemoveAttachment: h, onAttachmentClick: g, onEmojiClick: y, maxLength: b, submitLabel: x = "Send message", className: S, ...w }) {
|
|
289
|
+
let [T, E] = o.useState(i), D = n ?? T, O = (e) => {
|
|
290
|
+
n === void 0 && E(e), a?.(e);
|
|
291
|
+
}, k = async () => {
|
|
292
|
+
let e = D.trim();
|
|
293
|
+
!e || l || u || (await s(e), O(""));
|
|
294
|
+
};
|
|
295
|
+
return /* @__PURE__ */ v("form", {
|
|
296
|
+
"data-slot": "chat-composer",
|
|
297
|
+
className: e("border-t bg-background p-3", S),
|
|
298
|
+
onSubmit: (e) => {
|
|
299
|
+
e.preventDefault(), k();
|
|
300
|
+
},
|
|
301
|
+
...w,
|
|
302
|
+
children: [f?.length ? /* @__PURE__ */ _("div", {
|
|
303
|
+
className: "mb-2 grid gap-2 sm:grid-cols-2",
|
|
304
|
+
children: f.map(({ key: e, ...t }) => /* @__PURE__ */ _(C, {
|
|
305
|
+
attachmentKey: e,
|
|
306
|
+
...t,
|
|
307
|
+
onRemove: h ? () => h(e) : void 0
|
|
308
|
+
}, e))
|
|
309
|
+
}) : null, /* @__PURE__ */ v("div", {
|
|
310
|
+
className: "flex items-end gap-2 rounded-lg border bg-background p-1.5 shadow-sm transition-[border-color,box-shadow] focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/20",
|
|
311
|
+
children: [
|
|
312
|
+
g ? /* @__PURE__ */ _(t, {
|
|
313
|
+
type: "button",
|
|
314
|
+
size: "icon-sm",
|
|
315
|
+
variant: "ghost",
|
|
316
|
+
iconOnly: !0,
|
|
317
|
+
"aria-label": "Attach file",
|
|
318
|
+
onClick: g,
|
|
319
|
+
children: /* @__PURE__ */ _(d, {})
|
|
320
|
+
}) : null,
|
|
321
|
+
/* @__PURE__ */ _(r, {
|
|
322
|
+
value: D,
|
|
323
|
+
onValueChange: O,
|
|
324
|
+
rows: 1,
|
|
325
|
+
maxLength: b,
|
|
326
|
+
disabled: l,
|
|
327
|
+
placeholder: c,
|
|
328
|
+
"aria-label": c,
|
|
329
|
+
className: "max-h-36 min-h-9 resize-none border-0 bg-transparent px-2 py-2 font-normal shadow-none focus-visible:shadow-none",
|
|
330
|
+
onKeyDown: (e) => {
|
|
331
|
+
e.key === "Enter" && !e.shiftKey && (e.preventDefault(), k());
|
|
332
|
+
}
|
|
333
|
+
}),
|
|
334
|
+
y ? /* @__PURE__ */ _(t, {
|
|
335
|
+
type: "button",
|
|
336
|
+
size: "icon-sm",
|
|
337
|
+
variant: "ghost",
|
|
338
|
+
iconOnly: !0,
|
|
339
|
+
"aria-label": "Choose emoji",
|
|
340
|
+
onClick: y,
|
|
341
|
+
children: /* @__PURE__ */ _(m, {})
|
|
342
|
+
}) : null,
|
|
343
|
+
/* @__PURE__ */ _(t, {
|
|
344
|
+
type: "submit",
|
|
345
|
+
size: "icon-sm",
|
|
346
|
+
iconOnly: !0,
|
|
347
|
+
"aria-label": x,
|
|
348
|
+
loading: u,
|
|
349
|
+
disabled: l || !D.trim(),
|
|
350
|
+
children: /* @__PURE__ */ _(p, {})
|
|
351
|
+
})
|
|
352
|
+
]
|
|
353
|
+
})]
|
|
354
|
+
});
|
|
355
|
+
}
|
|
356
|
+
function D() {
|
|
357
|
+
return /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(t, {
|
|
358
|
+
size: "icon-sm",
|
|
359
|
+
variant: "ghost",
|
|
360
|
+
iconOnly: !0,
|
|
361
|
+
"aria-label": "Search conversation",
|
|
362
|
+
children: /* @__PURE__ */ _(f, {})
|
|
363
|
+
}), /* @__PURE__ */ _(t, {
|
|
364
|
+
size: "icon-sm",
|
|
365
|
+
variant: "ghost",
|
|
366
|
+
iconOnly: !0,
|
|
367
|
+
"aria-label": "More conversation actions",
|
|
368
|
+
children: /* @__PURE__ */ _(u, {})
|
|
369
|
+
})] });
|
|
370
|
+
}
|
|
371
|
+
//#endregion
|
|
372
|
+
export { C as ChatAttachment, E as ChatComposer, b as ChatHeader, D as ChatHeaderActions, w as ChatMessage, S as ChatMessageList, y as ChatShell, T as ChatTypingIndicator, x as ConversationList };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./data-state.cjs"),t=require("./activity-feed.cjs"),n=require("./avatar.cjs"),r=require("./carousel.cjs"),i=require("./code-block.cjs"),
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./data-state.cjs"),t=require("./activity-feed.cjs"),n=require("./avatar.cjs"),r=require("./carousel.cjs"),i=require("./chat.cjs"),a=require("./code-block.cjs"),o=require("./description-list.cjs"),s=require("./kanban.cjs"),c=require("./list.cjs"),l=require("./progress.cjs"),u=require("./statistic.cjs"),d=require("./status-dot.cjs"),f=require("./status-legend.cjs"),p=require("./timeline.cjs"),m=require("./tree-view.cjs"),h=require("./info-card.cjs"),g=require("./virtual-list.cjs"),_=require("./qr-code.cjs"),v=require("./tag.cjs"),y=require("./typography.cjs");exports.ActivityFeed=t.ActivityFeed,exports.Avatar=n.Avatar,exports.AvatarGroup=n.AvatarGroup,exports.Blockquote=y.Blockquote,exports.Carousel=r.Carousel,exports.CarouselItem=r.CarouselItem,exports.ChatAttachment=i.ChatAttachment,exports.ChatComposer=i.ChatComposer,exports.ChatHeader=i.ChatHeader,exports.ChatHeaderActions=i.ChatHeaderActions,exports.ChatMessage=i.ChatMessage,exports.ChatMessageList=i.ChatMessageList,exports.ChatShell=i.ChatShell,exports.ChatTypingIndicator=i.ChatTypingIndicator,exports.Chip=v.Chip,exports.CodeBlock=a.CodeBlock,exports.ConversationList=i.ConversationList,exports.DataState=e.DataState,exports.DescriptionList=o.DescriptionList,exports.Heading=y.Heading,exports.InfoCard=h.InfoCard,exports.KanbanBoard=s.KanbanBoard,exports.List=c.List,exports.ListRow=c.ListRow,exports.Mark=y.Mark,exports.Progress=l.Progress,exports.ProgressCard=l.ProgressCard,exports.QRCode=_.QRCode,exports.QRCodeSvg=_.QRCodeSvg,exports.Spoiler=y.Spoiler,exports.SpoilerSummary=y.SpoilerSummary,exports.Statistic=u.Statistic,exports.StatisticCard=u.StatisticCard,exports.StatisticGrid=u.StatisticGrid,exports.StatusDot=d.StatusDot,exports.StatusLegend=f.StatusLegend,exports.Tag=v.Tag,exports.TagGroup=v.TagGroup,exports.Text=y.Text,exports.Timeline=p.Timeline,exports.TreeView=m.TreeView,exports.VirtualList=g.VirtualList,exports.getProgressPercent=l.getProgressPercent;
|
|
@@ -2,19 +2,20 @@ import { DataState as e } from "./data-state.js";
|
|
|
2
2
|
import { ActivityFeed as t } from "./activity-feed.js";
|
|
3
3
|
import { Avatar as n, AvatarGroup as r } from "./avatar.js";
|
|
4
4
|
import { Carousel as i, CarouselItem as a } from "./carousel.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
import {
|
|
16
|
-
import {
|
|
17
|
-
import {
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
|
|
5
|
+
import { ChatAttachment as o, ChatComposer as s, ChatHeader as c, ChatHeaderActions as l, ChatMessage as u, ChatMessageList as d, ChatShell as f, ChatTypingIndicator as p, ConversationList as m } from "./chat.js";
|
|
6
|
+
import { CodeBlock as h } from "./code-block.js";
|
|
7
|
+
import { DescriptionList as g } from "./description-list.js";
|
|
8
|
+
import { KanbanBoard as _ } from "./kanban.js";
|
|
9
|
+
import { List as v, ListRow as y } from "./list.js";
|
|
10
|
+
import { Progress as b, ProgressCard as x, getProgressPercent as S } from "./progress.js";
|
|
11
|
+
import { Statistic as C, StatisticCard as w, StatisticGrid as T } from "./statistic.js";
|
|
12
|
+
import { StatusDot as E } from "./status-dot.js";
|
|
13
|
+
import { StatusLegend as D } from "./status-legend.js";
|
|
14
|
+
import { Timeline as O } from "./timeline.js";
|
|
15
|
+
import { TreeView as k } from "./tree-view.js";
|
|
16
|
+
import { InfoCard as A } from "./info-card.js";
|
|
17
|
+
import { VirtualList as j } from "./virtual-list.js";
|
|
18
|
+
import { QRCode as M, QRCodeSvg as N } from "./qr-code.js";
|
|
19
|
+
import { Chip as P, Tag as F, TagGroup as I } from "./tag.js";
|
|
20
|
+
import { Blockquote as L, Heading as R, Mark as z, Spoiler as B, SpoilerSummary as V, Text as H } from "./typography.js";
|
|
21
|
+
export { t as ActivityFeed, n as Avatar, r as AvatarGroup, L as Blockquote, i as Carousel, a as CarouselItem, o as ChatAttachment, s as ChatComposer, c as ChatHeader, l as ChatHeaderActions, u as ChatMessage, d as ChatMessageList, f as ChatShell, p as ChatTypingIndicator, P as Chip, h as CodeBlock, m as ConversationList, e as DataState, g as DescriptionList, R as Heading, A as InfoCard, _ as KanbanBoard, v as List, y as ListRow, z as Mark, b as Progress, x as ProgressCard, M as QRCode, N as QRCodeSvg, B as Spoiler, V as SpoilerSummary, C as Statistic, w as StatisticCard, T as StatisticGrid, E as StatusDot, D as StatusLegend, F as Tag, I as TagGroup, H as Text, O as Timeline, k as TreeView, j as VirtualList, S as getProgressPercent };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/card/index.cjs"),r=require("../../../node_modules/@dnd-kit/helpers/dist/index.cjs"),i=require("../../../node_modules/@dnd-kit/react/index.cjs"),a=require("../../../node_modules/@dnd-kit/dom/sortable.cjs"),o=require("../../../node_modules/@dnd-kit/react/sortable.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("lucide-react"),l=require("react/jsx-runtime");var u=`tembro-kanban-card:`,d=`tembro-kanban-column:`;function f(e){return`${u}${e}`}function p(e){return`${d}${e}`}function m(e){return e.startsWith(u)?e.slice(19):e}function h(e){let t=e===void 0?``:String(e);return t.startsWith(d)?t.slice(21):t}function g(e){return new Map(e.flatMap(e=>e.cards.map(e=>[f(e.key),e])))}function _(e,t){let n=g(e),i=r.move(Object.fromEntries(e.map(e=>[p(e.key),e.cards.map(e=>f(e.key))])),t);return e.map(e=>({...e,cards:(i[p(e.key)]??[]).map(e=>n.get(String(e))).filter(e=>!!e)}))}function v(e,t,n){let r=e.find(e=>e.key===t.columnKey),i=e.find(e=>e.key===n.columnKey);if(!r||!i)return null;let a=r.cards.find(e=>e.key===t.cardKey);if(!a)return null;let o=r.cards.findIndex(e=>e.key===t.cardKey);if(o<0)return null;let s=i.cards,c=n.index??s.length;if(r.key===i.key&&c>o&&--c,c=Math.max(0,Math.min(c,s.length)),r.key===i.key&&o===c)return null;let l=e.map(e=>e.key===r.key?{...e,cards:e.cards.filter(e=>e.key!==t.cardKey)}:e).map(e=>{if(e.key!==i.key)return e;let t=[...e.cards];return t.splice(c,0,a),{...e,cards:t}});return{columns:l,change:{card:a,fromColumn:r,toColumn:l.find(e=>e.key===i.key)??i,fromIndex:o,toIndex:c}}}var y=s.forwardRef(function({label:e,disabled:t},n){return(0,l.jsx)(`button`,{ref:n,type:`button`,className:`inline-flex size-8 shrink-0 touch-none items-center justify-center rounded-md text-muted-foreground outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-45`,"aria-label":e,disabled:t,onClick:e=>e.stopPropagation(),children:(0,l.jsx)(c.GripVerticalIcon,{className:`size-4`,"aria-hidden":`true`})})});function b({card:e,handle:t}){return(0,l.jsxs)(n.Card,{className:`transition-colors hover:bg-muted/40`,children:[(0,l.jsx)(n.CardHeader,{className:`p-3 pb-1`,children:(0,l.jsxs)(`div`,{className:`flex items-start justify-between gap-2`,children:[(0,l.jsx)(n.CardTitle,{className:`text-sm`,children:e.title}),(0,l.jsxs)(`div`,{className:`flex items-center gap-1`,children:[e.extra,t]})]})}),e.description||e.meta?(0,l.jsxs)(n.CardContent,{className:`grid gap-2 p-3 pt-0 text-xs text-muted-foreground`,children:[e.description,e.meta?(0,l.jsx)(`div`,{children:e.meta}):null]}):null]})}function x({card:e,column:n,index:r,boardDisabled:i,renderCard:a,onCardClick:s,dragHandleLabel:c,cardClassName:u,onNativeDragStart:d,onNativeDragEnd:m,onNativeDrop:h}){let g=i||n.disabled===!0||e.disabled===!0,{ref:_,handleRef:v,isDragging:x,isDropTarget:S}=o.useSortable({id:f(e.key),index:r,group:p(n.key),type:`tembro-kanban-card`,accept:`tembro-kanban-card`,disabled:g,data:{cardKey:e.key,columnKey:n.key},transition:{duration:180,easing:`cubic-bezier(0.2, 0, 0, 1)`,idle:!0}}),C=(0,l.jsx)(y,{ref:v,label:c?.(e,n)??`Move ${String(e.title)}`,disabled:g}),w={index:r,isDragging:x,isDropTarget:S,handle:C};return(0,l.jsx)(`article`,{ref:_,"data-slot":`kanban-card`,"data-dragging":x||void 0,"data-drop-target":S||void 0,"data-disabled":g||void 0,role:s&&!g?`button`:void 0,tabIndex:s&&!g?0:void 0,"aria-label":typeof e.title==`string`?e.title:void 0,draggable:!g,className:t.cn(`rounded-lg outline-none transition-[opacity,box-shadow]`,s&&!g&&`cursor-pointer focus-visible:ring-2 focus-visible:ring-ring`,S&&`ring-2 ring-primary/30`,x&&`opacity-30`,g&&`opacity-55`,u),onClick:()=>{g||s?.(e,n)},onDragStart:t=>{if(g)return;let i={cardKey:e.key,columnKey:n.key,index:r};t.dataTransfer.effectAllowed=`move`,t.dataTransfer.setData(`text/plain`,JSON.stringify(i)),d?.(i)},onDragEnd:m,onDragOver:e=>{g||e.preventDefault()},onDrop:e=>{g||(e.preventDefault(),e.stopPropagation(),h?.({columnKey:n.key,index:r}))},onKeyDown:t=>{t.target!==t.currentTarget||g||!s||(t.key===`Enter`||t.key===` `)&&(t.preventDefault(),s(e,n))},children:a?.(e,n,w)??(0,l.jsx)(b,{card:e,handle:C})})}function S({column:e,boardDisabled:n,renderCard:r,onCardClick:a,dragHandleLabel:o,emptyColumn:s,columnClassName:c,cardClassName:u,onNativeDragStart:d,onNativeDragEnd:f,onNativeDrop:m}){let{ref:h,isDropTarget:g}=i.useDroppable({id:p(e.key),type:`tembro-kanban-column`,accept:`tembro-kanban-card`,disabled:n||e.disabled===!0,collisionPriority:1,data:{columnKey:e.key}});return(0,l.jsxs)(`section`,{ref:h,"data-slot":`kanban-column`,"data-drop-target":g||void 0,"data-disabled":e.disabled||void 0,"aria-label":typeof e.title==`string`?e.title:void 0,className:t.cn(`grid min-h-40 content-start gap-3 rounded-lg border bg-muted/35 p-3 transition-[border-color,background-color,box-shadow]`,g&&`border-primary/60 bg-primary/5 ring-2 ring-primary/15`,e.disabled&&`opacity-60`,c),onDragOver:t=>{n||e.disabled===!0||t.preventDefault()},onDrop:t=>{n||e.disabled===!0||(t.preventDefault(),m?.({columnKey:e.key,index:e.cards.length}))},children:[(0,l.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[(0,l.jsxs)(`div`,{className:`grid gap-0.5`,children:[(0,l.jsx)(`h3`,{className:`text-sm font-semibold text-foreground`,children:e.title}),e.description?(0,l.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:e.description}):null]}),(0,l.jsx)(`div`,{className:`rounded-full bg-background px-2 py-0.5 text-xs text-muted-foreground`,children:e.count??e.cards.length})]}),(0,l.jsx)(`div`,{className:`grid min-h-16 content-start gap-2`,children:e.cards.length===0?(0,l.jsxs)(`div`,{className:`grid min-h-20 place-items-center rounded-lg border border-dashed p-3 text-center text-xs text-muted-foreground`,children:[(0,l.jsx)(`span`,{children:s}),(0,l.jsx)(`span`,{className:`sr-only`,children:`No cards yet.`})]}):e.cards.map((t,i)=>(0,l.jsx)(x,{card:t,column:e,index:i,boardDisabled:n,renderCard:r,onCardClick:a,dragHandleLabel:o,cardClassName:u,onNativeDragStart:d,onNativeDragEnd:f,onNativeDrop:m},t.key))})]})}function C({columns:e,defaultColumns:n=[],onColumnsChange:r,onCardMove:o,renderCard:c,onCardClick:u,disabled:d=!1,emptyColumn:p=`Drop cards here.`,dragHandleLabel:g,columnClassName:y,cardClassName:x,overlayClassName:C,className:w,"aria-label":T=`Kanban board`,...E}){let[D,O]=s.useState(()=>n),[k,A]=s.useState(null),[j,M]=s.useState(null),N=s.useRef(null),P=s.useRef(null),F=e??D,I=k??F,L=e!==void 0;function R(e){let t=e.operation.source;if(!t)return;let n=String(t.id);N.current=F,A(F),M(n)}function z(e){let t=e.operation.source;if(!t||!a.isSortable(t))return;let n=_(N.current??F,e);N.current=n,A(n)}function B(e){let t=e.operation.source;if(M(null),e.canceled||!t||!a.isSortable(t)){N.current=null,A(null);return}let n=N.current??_(F,e),i=m(String(t.id)),s=h(t.initialGroup),c=h(t.group),l=F.find(e=>e.key===s),u=n.find(e=>e.key===c),d=l?.cards.find(e=>e.key===i);if(N.current=null,A(null),!d||!l||!u)return;let f={card:d,fromColumn:l,toColumn:u,fromIndex:t.initialIndex,toIndex:t.index};L||O(n),r?.(n,f),o?.(f)}function V(e){let t=P.current;if(P.current=null,!t)return;let n=v(F,t,e);n&&(L||O(n.columns),r?.(n.columns,n.change),o?.(n.change))}let H=j?I.flatMap(e=>e.cards.map(t=>({card:t,column:e}))).find(({card:e})=>f(e.key)===j):void 0;return(0,l.jsxs)(i.DragDropProvider,{onDragStart:R,onDragOver:z,onDragEnd:B,children:[(0,l.jsx)(`div`,{...E,role:`group`,"aria-label":T,"data-slot":`kanban-board`,className:t.cn(`grid gap-4 sm:auto-cols-[minmax(280px,1fr)] sm:grid-flow-col sm:overflow-x-auto sm:pb-2`,w),children:I.map(e=>(0,l.jsx)(S,{column:e,boardDisabled:d,renderCard:c,onCardClick:u,dragHandleLabel:g,emptyColumn:p,columnClassName:y,cardClassName:x,onNativeDragStart:e=>{P.current=e},onNativeDragEnd:()=>{P.current=null},onNativeDrop:V},e.key))}),(0,l.jsx)(i.DragOverlay,{children:H?(0,l.jsx)(`div`,{className:t.cn(`min-w-64 rotate-1 opacity-95 shadow-2xl`,C),children:c?.(H.card,H.column,{index:H.column.cards.findIndex(e=>e.key===H.card.key),isDragging:!0,isDropTarget:!1,handle:null})??(0,l.jsx)(b,{card:H.card,handle:null})}):null})]})}exports.KanbanBoard=C;
|
|
1
|
+
"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("../ui/badge/index.cjs"),i=require("../ui/card/index.cjs"),a=require("./avatar.cjs"),o=require("../../../node_modules/@dnd-kit/helpers/dist/index.cjs"),s=require("../../../node_modules/@dnd-kit/react/index.cjs"),c=require("../../../node_modules/@dnd-kit/dom/sortable.cjs"),l=require("../../../node_modules/@dnd-kit/react/sortable.cjs");let u=require("react");u=e.__toESM(u,1);let d=require("lucide-react"),f=require("react/jsx-runtime");var p=`tembro-kanban-card:`,m=`tembro-kanban-column:`;function h(e){return`${p}${e}`}function g(e){return`${m}${e}`}function _(e){return e.startsWith(p)?e.slice(19):e}function v(e){let t=e===void 0?``:String(e);return t.startsWith(m)?t.slice(21):t}function y(e){return new Map(e.flatMap(e=>e.cards.map(e=>[h(e.key),e])))}function b(e,t){let n=y(e),r=o.move(Object.fromEntries(e.map(e=>[g(e.key),e.cards.map(e=>h(e.key))])),t);return e.map(e=>({...e,cards:(r[g(e.key)]??[]).map(e=>n.get(String(e))).filter(e=>!!e)}))}function x(e,t,n){let r=e.find(e=>e.key===t.columnKey),i=e.find(e=>e.key===n.columnKey);if(!r||!i)return null;let a=r.cards.find(e=>e.key===t.cardKey);if(!a)return null;let o=r.cards.findIndex(e=>e.key===t.cardKey);if(o<0)return null;let s=i.cards,c=n.index??s.length;if(r.key===i.key&&c>o&&--c,c=Math.max(0,Math.min(c,s.length)),r.key===i.key&&o===c)return null;let l=e.map(e=>e.key===r.key?{...e,cards:e.cards.filter(e=>e.key!==t.cardKey)}:e).map(e=>{if(e.key!==i.key)return e;let t=[...e.cards];return t.splice(c,0,a),{...e,cards:t}});return{columns:l,change:{card:a,fromColumn:r,toColumn:l.find(e=>e.key===i.key)??i,fromIndex:o,toIndex:c}}}function S(e,t,n){let r=e.find(e=>e.cards.some(e=>e.key===n)),i=t.find(e=>e.cards.some(e=>e.key===n)),a=r?.cards.find(e=>e.key===n);return!r||!i||!a?null:{card:a,fromColumn:r,toColumn:i,fromIndex:r.cards.findIndex(e=>e.key===n),toIndex:i.cards.findIndex(e=>e.key===n)}}function C(e,t,n,r,i,a){let o=S(e,t,n);if(!o)return!1;let s=o.fromColumn.key!==o.toColumn.key;return s&&!r||!s&&!i||s&&o.toColumn.limit!==void 0&&o.toColumn.cards.length>o.toColumn.limit?!1:a?.(o)??!0}var w=u.forwardRef(function({label:e,disabled:t},n){return(0,f.jsx)(`button`,{ref:n,type:`button`,className:`inline-flex size-8 shrink-0 touch-none items-center justify-center rounded-md text-muted-foreground outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-45`,"aria-label":e,disabled:t,onClick:e=>e.stopPropagation(),children:(0,f.jsx)(d.GripVerticalIcon,{className:`size-4`,"aria-hidden":`true`})})});function T({card:e,handle:t,selectControl:n}){let o=e.priority===`urgent`?`danger`:e.priority===`high`?`warning`:e.priority===`medium`?`info`:`muted`;return(0,f.jsxs)(i.Card,{className:`border-border/80 shadow-sm transition-[border-color,box-shadow,transform] hover:-translate-y-0.5 hover:border-foreground/20 hover:shadow-md`,children:[(0,f.jsx)(i.CardHeader,{className:`p-3.5 pb-2`,children:(0,f.jsxs)(`div`,{className:`flex items-start justify-between gap-2`,children:[(0,f.jsxs)(`div`,{className:`flex min-w-0 items-start gap-2`,children:[n,(0,f.jsx)(i.CardTitle,{className:`min-w-0 text-sm leading-5`,children:e.title})]}),(0,f.jsxs)(`div`,{className:`flex items-center gap-1`,children:[e.extra,t]})]})}),e.description||e.meta||e.labels?.length||e.priority||e.assignee||e.dueDate||e.actions?(0,f.jsxs)(i.CardContent,{className:`grid gap-3 p-3.5 pt-0 text-xs text-muted-foreground`,children:[e.description?(0,f.jsx)(`div`,{className:`line-clamp-3 leading-5`,children:e.description}):null,e.labels?.length||e.priority?(0,f.jsxs)(`div`,{className:`flex flex-wrap gap-1.5`,children:[e.priority?(0,f.jsx)(r.Badge,{size:`sm`,tone:o,variant:`soft`,label:e.priority,showDot:!0}):null,e.labels?.map((e,t)=>u.isValidElement(e)?u.cloneElement(e,{key:e.key??t}):typeof e==`object`&&e&&`key`in e?(0,f.jsx)(r.Badge,{size:`sm`,variant:`outline`,tone:e.tone,label:e.label},e.key):(0,f.jsx)(r.Badge,{size:`sm`,variant:`outline`,label:e},t))]}):null,e.meta?(0,f.jsx)(`div`,{children:e.meta}):null,e.assignee||e.dueDate?(0,f.jsxs)(`div`,{className:`flex items-center justify-between gap-3 border-t pt-2.5`,children:[e.assignee?(0,f.jsxs)(`div`,{className:`flex min-w-0 items-center gap-2`,children:[(0,f.jsx)(a.Avatar,{size:`xs`,name:e.assignee.name,src:e.assignee.src,fallback:e.assignee.fallback}),(0,f.jsx)(`span`,{className:`truncate`,children:e.assignee.name})]}):(0,f.jsx)(`span`,{}),e.dueDate?(0,f.jsxs)(`span`,{className:`inline-flex shrink-0 items-center gap-1`,children:[(0,f.jsx)(d.CalendarDaysIcon,{className:`size-3.5`}),e.dueDate]}):null]}):null,e.actions?(0,f.jsx)(`div`,{className:`flex flex-wrap items-center gap-2`,children:e.actions}):null]}):null]})}function E({card:e,column:n,index:r,boardDisabled:i,renderCard:a,onCardClick:o,selected:s,selectionMode:c,onSelect:u,dragHandleLabel:p,cardClassName:m,onNativeDragStart:_,onNativeDragEnd:v,onNativeDrop:y}){let b=i||n.disabled===!0||e.disabled===!0,{ref:x,handleRef:S,isDragging:C,isDropTarget:E}=l.useSortable({id:h(e.key),index:r,group:g(n.key),type:`tembro-kanban-card`,accept:`tembro-kanban-card`,disabled:b,data:{cardKey:e.key,columnKey:n.key},transition:{duration:180,easing:`cubic-bezier(0.2, 0, 0, 1)`,idle:!0}}),D=(0,f.jsx)(w,{ref:S,label:p?.(e,n)??`Move ${String(e.title)}`,disabled:b}),O=c===`none`?null:(0,f.jsx)(`button`,{type:`button`,"aria-label":`${s?`Deselect`:`Select`} ${String(e.title)}`,"aria-pressed":s,className:t.cn(`mt-0.5 grid size-4 shrink-0 place-items-center rounded border bg-background text-primary outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring`,s&&`border-primary bg-primary text-primary-foreground`),onClick:t=>{t.stopPropagation(),u(e)},children:s?(0,f.jsx)(d.CheckIcon,{className:`size-3`,strokeWidth:3}):null}),k={index:r,isDragging:C,isDropTarget:E,selected:s,selectControl:O,handle:D};return(0,f.jsx)(`article`,{ref:x,"data-slot":`kanban-card`,"data-dragging":C||void 0,"data-drop-target":E||void 0,"data-disabled":b||void 0,role:`group`,"aria-label":typeof e.title==`string`?e.title:void 0,draggable:!b,className:t.cn(`rounded-lg outline-none transition-[opacity,box-shadow]`,o&&!b&&`cursor-pointer focus-visible:ring-2 focus-visible:ring-ring`,E&&`ring-2 ring-primary/30`,C&&`opacity-30`,s&&`ring-2 ring-primary/35`,b&&`opacity-55`,m),onClick:()=>{b||o?.(e,n)},onDragStart:t=>{if(b)return;let i={cardKey:e.key,columnKey:n.key,index:r};t.dataTransfer.effectAllowed=`move`,t.dataTransfer.setData(`text/plain`,JSON.stringify(i)),_?.(i)},onDragEnd:v,onDragOver:e=>{b||e.preventDefault()},onDrop:e=>{b||(e.preventDefault(),e.stopPropagation(),y?.({columnKey:n.key,index:r}))},children:a?.(e,n,k)??(0,f.jsx)(T,{card:e,handle:D,selectControl:O})})}function D({column:e,boardDisabled:i,renderCard:a,onCardClick:o,selectedKeys:c,selectionMode:l,onSelect:u,onAddCard:p,renderColumnHeader:m,renderColumnFooter:h,dragHandleLabel:_,emptyColumn:v,columnClassName:y,cardClassName:b,onNativeDragStart:x,onNativeDragEnd:S,onNativeDrop:C,density:w}){let{ref:T,isDropTarget:D}=s.useDroppable({id:g(e.key),type:`tembro-kanban-column`,accept:`tembro-kanban-card`,disabled:i||e.disabled===!0,collisionPriority:1,data:{columnKey:e.key}});return(0,f.jsxs)(`section`,{ref:T,"data-slot":`kanban-column`,"data-drop-target":D||void 0,"data-disabled":e.disabled||void 0,"data-density":w,"aria-label":typeof e.title==`string`?e.title:void 0,className:t.cn(`grid min-h-40 content-start gap-3 rounded-lg border bg-muted/25 p-3 transition-[border-color,background-color,box-shadow] data-[density=compact]:gap-2 data-[density=compact]:p-2.5`,D&&`border-primary/60 bg-primary/5 ring-2 ring-primary/15`,e.disabled&&`opacity-60`,y),onDragOver:t=>{i||e.disabled===!0||t.preventDefault()},onDrop:t=>{i||e.disabled===!0||(t.preventDefault(),C?.({columnKey:e.key,index:e.cards.length}))},children:[m?.(e)??(0,f.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[e.color?(0,f.jsx)(`span`,{className:`mt-1.5 size-2 shrink-0 rounded-full`,style:{backgroundColor:e.color}}):null,(0,f.jsxs)(`div`,{className:`grid gap-0.5`,children:[(0,f.jsx)(`h3`,{className:`text-sm font-semibold text-foreground`,children:e.title}),e.description?(0,f.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:e.description}):null]}),(0,f.jsxs)(`div`,{className:`ml-auto flex items-center gap-1`,children:[e.actions,p&&!e.disabled?(0,f.jsx)(n.Button,{size:`icon-xs`,variant:`ghost`,iconOnly:!0,"aria-label":`Add card to ${String(e.title)}`,onClick:()=>p(e),children:(0,f.jsx)(d.PlusIcon,{})}):null,(0,f.jsx)(r.Badge,{size:`sm`,variant:e.limit!==void 0&&e.cards.length>=e.limit?`soft`:`outline`,tone:e.limit!==void 0&&e.cards.length>=e.limit?`warning`:`muted`,label:e.count??(e.limit===void 0?e.cards.length:`${e.cards.length}/${e.limit}`)})]})]}),(0,f.jsx)(`div`,{className:`grid min-h-16 content-start gap-2`,children:e.cards.length===0?(0,f.jsxs)(`div`,{className:`grid min-h-20 place-items-center rounded-lg border border-dashed p-3 text-center text-xs text-muted-foreground`,children:[(0,f.jsx)(`span`,{children:v}),(0,f.jsx)(`span`,{className:`sr-only`,children:`No cards yet.`})]}):e.cards.map((t,n)=>(0,f.jsx)(E,{card:t,column:e,index:n,boardDisabled:i,renderCard:a,onCardClick:o,selected:c.has(t.key)||t.selected===!0,selectionMode:l,onSelect:u,dragHandleLabel:_,cardClassName:b,onNativeDragStart:x,onNativeDragEnd:S,onNativeDrop:C},t.key))}),h?.(e)??e.footer??(p&&!e.disabled?(0,f.jsx)(n.Button,{size:`sm`,variant:`ghost`,className:`w-full justify-start`,leftIcon:(0,f.jsx)(d.PlusIcon,{}),onClick:()=>p(e),children:`Add task`}):null)]})}function O({columns:e,defaultColumns:n=[],onColumnsChange:r,onCardMove:i,canMoveCard:a,renderCard:o,onCardClick:l,onAddCard:p,onAddColumn:m,renderColumnHeader:g,renderColumnFooter:y,selectionMode:S=`none`,selectedCardKeys:w,defaultSelectedCardKeys:E=[],onSelectionChange:O,allowCrossColumn:k=!0,allowReorder:A=!0,density:j=`comfortable`,columnWidth:M=320,disabled:N=!1,emptyColumn:P=`Drop cards here.`,dragHandleLabel:F,columnClassName:ee,cardClassName:te,overlayClassName:ne,className:re,"aria-label":I=`Kanban board`,...L}){let[R,z]=u.useState(()=>n),[B,V]=u.useState(null),[H,U]=u.useState(null),W=u.useRef(null),G=u.useRef(null),[K,q]=u.useState(E),J=e??R,Y=B??J,X=e!==void 0,Z=w??K,Q=u.useMemo(()=>new Set(Z),[Z]);function ie(e){if(S===`none`||e.disabled)return;let t=S===`single`?Q.has(e.key)?[]:[e.key]:Q.has(e.key)?Z.filter(t=>t!==e.key):[...Z,e.key];w===void 0&&q(t);let n=J.flatMap(e=>e.cards);O?.(t,n.filter(e=>t.includes(e.key)))}function ae(e){let t=e.operation.source;if(!t)return;let n=String(t.id);W.current=J,V(J),U(n)}function oe(e){let t=e.operation.source;if(!t||!c.isSortable(t))return;let n=b(W.current??J,e);C(J,n,_(String(t.id)),k,A,a)&&(W.current=n,V(n))}function se(e){let t=e.operation.source;if(U(null),e.canceled||!t||!c.isSortable(t)){W.current=null,V(null);return}let n=W.current??b(J,e),o=_(String(t.id)),s=v(t.initialGroup),l=v(t.group),u=J.find(e=>e.key===s),d=n.find(e=>e.key===l),f=u?.cards.find(e=>e.key===o);if(W.current=null,V(null),!f||!u||!d)return;let p={card:f,fromColumn:u,toColumn:d,fromIndex:t.initialIndex,toIndex:t.index};C(J,n,f.key,k,A,a)&&(X||z(n),r?.(n,p),i?.(p))}function ce(e){let t=G.current;if(G.current=null,!t)return;let n=x(J,t,e);n&&C(J,n.columns,n.change.card.key,k,A,a)&&(X||z(n.columns),r?.(n.columns,n.change),i?.(n.change))}let $=H?Y.flatMap(e=>e.cards.map(t=>({card:t,column:e}))).find(({card:e})=>h(e.key)===H):void 0;return(0,f.jsxs)(s.DragDropProvider,{onDragStart:ae,onDragOver:oe,onDragEnd:se,children:[(0,f.jsxs)(`div`,{...L,role:`group`,"aria-label":I,"data-slot":`kanban-board`,"data-density":j,style:{"--kanban-column-width":typeof M==`number`?`${M}px`:M,...L.style},className:t.cn(`grid gap-4 sm:auto-cols-[var(--kanban-column-width)] sm:grid-flow-col sm:overflow-x-auto sm:pb-2`,re),children:[Y.map(e=>(0,f.jsx)(D,{column:e,boardDisabled:N,renderCard:o,onCardClick:l,selectedKeys:Q,selectionMode:S,onSelect:ie,onAddCard:p,renderColumnHeader:g,renderColumnFooter:y,dragHandleLabel:F,emptyColumn:P,columnClassName:ee,cardClassName:te,onNativeDragStart:e=>{G.current=e},onNativeDragEnd:()=>{G.current=null},onNativeDrop:ce,density:j},e.key)),m?(0,f.jsxs)(`button`,{type:`button`,className:`flex min-h-32 items-center justify-center gap-2 rounded-lg border border-dashed bg-muted/15 text-sm font-medium text-muted-foreground outline-none transition-colors hover:border-foreground/25 hover:bg-muted/35 hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring`,onClick:m,children:[(0,f.jsx)(d.PlusIcon,{className:`size-4`}),`Add column`]}):null]}),(0,f.jsx)(s.DragOverlay,{children:$?(0,f.jsx)(`div`,{className:t.cn(`min-w-64 rotate-1 opacity-95 shadow-2xl`,ne),children:o?.($.card,$.column,{index:$.column.cards.findIndex(e=>e.key===$.card.key),isDragging:!0,isDropTarget:!1,handle:null,selected:Q.has($.card.key),selectControl:null})??(0,f.jsx)(T,{card:$.card,handle:null})}):null})]})}exports.KanbanBoard=O;
|