@wakastellar/ui 4.0.0 → 4.0.1

package/dist/components/waka-approval-chain/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs.js`),t=require(`../../utils/cn.cjs.js`);let n=require(`react`);n=e.__toESM(n);let r=require(`lucide-react`),i=require(`react/jsx-runtime`);var a={pending:{icon:r.Clock,color:`text-amber-600`,bgColor:`bg-amber-100 dark:bg-amber-900/30`,borderColor:`border-amber-300 dark:border-amber-700`,label:`Pending`},approved:{icon:r.Check,color:`text-green-600`,bgColor:`bg-green-100 dark:bg-green-900/30`,borderColor:`border-green-300 dark:border-green-700`,label:`Approved`},rejected:{icon:r.X,color:`text-red-600`,bgColor:`bg-red-100 dark:bg-red-900/30`,borderColor:`border-red-300 dark:border-red-700`,label:`Rejected`},skipped:{icon:r.SkipForward,color:`text-gray-500`,bgColor:`bg-gray-100 dark:bg-gray-800`,borderColor:`border-gray-300 dark:border-gray-600`,label:`Skipped`}},o={sm:{avatar:`h-8 w-8`,avatarText:`text-xs`,icon:`h-3 w-3`,statusIcon:`h-4 w-4`,name:`text-xs`,role:`text-[10px]`,time:`text-[10px]`,comment:`text-xs`,button:`px-2 py-1 text-xs`,connector:`w-6`,connectorVertical:`h-6`,hoverCard:`w-48`},md:{avatar:`h-10 w-10`,avatarText:`text-sm`,icon:`h-4 w-4`,statusIcon:`h-5 w-5`,name:`text-sm`,role:`text-xs`,time:`text-xs`,comment:`text-sm`,button:`px-3 py-1.5 text-sm`,connector:`w-8`,connectorVertical:`h-8`,hoverCard:`w-56`},lg:{avatar:`h-12 w-12`,avatarText:`text-base`,icon:`h-5 w-5`,statusIcon:`h-6 w-6`,name:`text-base`,role:`text-sm`,time:`text-sm`,comment:`text-base`,button:`px-4 py-2 text-base`,connector:`w-10`,connectorVertical:`h-10`,hoverCard:`w-64`}};function s(e){let t=Math.floor((new Date().getTime()-e.getTime())/1e3);if(t<60)return`just now`;let n=Math.floor(t/60);if(n<60)return`${n}m ago`;let r=Math.floor(n/60);if(r<24)return`${r}h ago`;let i=Math.floor(r/24);if(i<7)return`${i}d ago`;let a=Math.floor(i/7);if(a<4)return`${a}w ago`;let o=Math.floor(i/30);return o<12?`${o}mo ago`:`${Math.floor(i/365)}y ago`}function c(e){return e.split(` `).map(e=>e[0]).join(``).toUpperCase().slice(0,2)}function l({approver:e,status:n,size:r,isCurrent:s}){let l=o[r],u=a[n],d=u.icon;return(0,i.jsxs)(`div`,{className:`relative`,children:[(0,i.jsx)(`div`,{className:t.cn(`relative rounded-full overflow-hidden border-2 transition-all duration-200`,l.avatar,s&&`ring-2 ring-primary ring-offset-2`,u.borderColor),children:e.avatar?(0,i.jsx)(`img`,{src:e.avatar,alt:e.name,className:`h-full w-full object-cover`}):(0,i.jsx)(`div`,{className:t.cn(`h-full w-full flex items-center justify-center bg-muted`,l.avatarText,`font-medium text-muted-foreground`),children:c(e.name)})}),(0,i.jsx)(`div`,{className:t.cn(`absolute -bottom-1 -right-1 rounded-full p-0.5`,u.bgColor,`border border-background`),children:(0,i.jsx)(d,{className:t.cn(l.icon,u.color)})})]})}function u({status:e,previousStatus:n,orientation:r,size:a}){let s=o[a],c=n===`approved`,l=n===`rejected`,u=c?`bg-green-400`:l?`bg-red-400`:`bg-gray-300 dark:bg-gray-600`;return r===`horizontal`?(0,i.jsxs)(`div`,{className:t.cn(`flex items-center`,s.connector),children:[(0,i.jsx)(`div`,{className:t.cn(`flex-1 h-0.5`,u)}),(0,i.jsx)(`div`,{className:t.cn(`h-0 w-0 border-t-4 border-b-4 border-l-4 border-transparent`,c?`border-l-green-400`:l?`border-l-red-400`:`border-l-gray-300 dark:border-l-gray-600`)})]}):(0,i.jsxs)(`div`,{className:t.cn(`flex flex-col items-center`,s.connectorVertical),children:[(0,i.jsx)(`div`,{className:t.cn(`flex-1 w-0.5`,u)}),(0,i.jsx)(`div`,{className:t.cn(`w-0 h-0 border-l-4 border-r-4 border-t-4 border-transparent`,c?`border-t-green-400`:l?`border-t-red-400`:`border-t-gray-300 dark:border-t-gray-600`)})]})}function d({step:e,size:l,showComments:u,isCurrentUser:d,onApprove:f,onReject:p,children:m}){let[h,g]=n.useState(!1),[_,v]=n.useState(``),[y,b]=n.useState(!1),x=o[l],S=a[e.status];return(0,i.jsxs)(`div`,{className:`relative`,onMouseEnter:()=>g(!0),onMouseLeave:()=>{y||g(!1)},children:[m,h&&(0,i.jsxs)(`div`,{className:t.cn(`absolute z-50 rounded-lg border bg-popover p-3 shadow-lg`,`animate-in fade-in-0 zoom-in-95`,x.hoverCard,`top-full left-1/2 -translate-x-1/2 mt-2`),onMouseEnter:()=>g(!0),onMouseLeave:()=>{y||g(!1)},children:[(0,i.jsx)(`div`,{className:`absolute -top-2 left-1/2 -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-transparent border-b-popover`}),(0,i.jsxs)(`div`,{className:`flex items-start gap-3`,children:[(0,i.jsx)(`div`,{className:t.cn(`rounded-full overflow-hidden flex-shrink-0`,x.avatar),children:e.approver.avatar?(0,i.jsx)(`img`,{src:e.approver.avatar,alt:e.approver.name,className:`h-full w-full object-cover`}):(0,i.jsx)(`div`,{className:t.cn(`h-full w-full flex items-center justify-center bg-muted`,x.avatarText,`font-medium text-muted-foreground`),children:c(e.approver.name)})}),(0,i.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,i.jsx)(`p`,{className:t.cn(`font-medium truncate`,x.name),children:e.approver.name}),e.approver.role&&(0,i.jsx)(`p`,{className:t.cn(`text-muted-foreground truncate`,x.role),children:e.approver.role})]})]}),(0,i.jsxs)(`div`,{className:`mt-2 flex items-center justify-between`,children:[(0,i.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[(0,i.jsx)(S.icon,{className:t.cn(x.icon,S.color)}),(0,i.jsx)(`span`,{className:t.cn(x.role,S.color,`font-medium`),children:S.label})]}),e.timestamp&&(0,i.jsx)(`span`,{className:t.cn(`text-muted-foreground`,x.time),children:s(e.timestamp)})]}),u&&e.comment&&(0,i.jsx)(`div`,{className:`mt-2 p-2 rounded bg-muted/50`,children:(0,i.jsxs)(`div`,{className:`flex items-start gap-1.5`,children:[(0,i.jsx)(r.MessageSquare,{className:t.cn(x.icon,`text-muted-foreground mt-0.5`)}),(0,i.jsx)(`p`,{className:t.cn(`text-muted-foreground`,x.comment),children:e.comment})]})}),d&&e.status===`pending`&&(f||p)&&(0,i.jsx)(`div`,{className:`mt-3 pt-3 border-t`,children:y?(0,i.jsxs)(`div`,{className:`space-y-2`,children:[(0,i.jsx)(`textarea`,{value:_,onChange:e=>v(e.target.value),placeholder:`Add a comment (optional)`,className:t.cn(`w-full px-2 py-1.5 rounded border bg-background resize-none`,x.comment),rows:2,autoFocus:!0}),(0,i.jsxs)(`div`,{className:`flex gap-2`,children:[f&&(0,i.jsx)(`button`,{onClick:()=>{f?.(_||void 0),v(``),b(!1),g(!1)},className:t.cn(`flex-1 rounded font-medium transition-colors`,`bg-green-600 text-white hover:bg-green-700`,x.button),children:`Approve`}),p&&(0,i.jsx)(`button`,{onClick:()=>{p?.(_||void 0),v(``),b(!1),g(!1)},className:t.cn(`flex-1 rounded font-medium transition-colors`,`bg-red-600 text-white hover:bg-red-700`,x.button),children:`Reject`})]}),(0,i.jsx)(`button`,{onClick:()=>{b(!1),v(``)},className:t.cn(`w-full rounded font-medium transition-colors`,`text-muted-foreground hover:text-foreground`,x.button),children:`Cancel`})]}):(0,i.jsxs)(`div`,{className:`flex gap-2`,children:[f&&(0,i.jsxs)(`button`,{onClick:()=>b(!0),className:t.cn(`flex-1 rounded font-medium transition-colors`,`bg-green-600 text-white hover:bg-green-700`,x.button),children:[(0,i.jsx)(r.Check,{className:t.cn(x.icon,`inline-block mr-1`)}),`Approve`]}),p&&(0,i.jsxs)(`button`,{onClick:()=>b(!0),className:t.cn(`flex-1 rounded font-medium transition-colors`,`bg-red-600 text-white hover:bg-red-700`,x.button),children:[(0,i.jsx)(r.X,{className:t.cn(x.icon,`inline-block mr-1`)}),`Reject`]})]})})]})]})}function f({step:e,index:n,isLast:r,previousStatus:c,size:f,orientation:p,showComments:m,isCurrentUser:h,isCurrent:g,onApprove:_,onReject:v}){let y=o[f];return p===`horizontal`?(0,i.jsxs)(`div`,{className:`flex items-center`,children:[(0,i.jsx)(d,{step:e,size:f,showComments:m,isCurrentUser:h,onApprove:_,onReject:v,children:(0,i.jsxs)(`div`,{className:`flex flex-col items-center gap-1`,children:[(0,i.jsx)(l,{approver:e.approver,status:e.status,size:f,isCurrent:g}),(0,i.jsx)(`span`,{className:t.cn(`text-center max-w-[80px] truncate`,y.name,g?`text-foreground font-medium`:`text-muted-foreground`),children:e.approver.name.split(` `)[0]})]})}),!r&&(0,i.jsx)(u,{status:e.status,previousStatus:e.status,orientation:`horizontal`,size:f})]}):(0,i.jsxs)(`div`,{className:`flex`,children:[(0,i.jsxs)(`div`,{className:`flex flex-col items-center`,children:[(0,i.jsx)(d,{step:e,size:f,showComments:m,isCurrentUser:h,onApprove:_,onReject:v,children:(0,i.jsx)(l,{approver:e.approver,status:e.status,size:f,isCurrent:g})}),!r&&(0,i.jsx)(u,{status:e.status,previousStatus:e.status,orientation:`vertical`,size:f})]}),(0,i.jsxs)(`div`,{className:`ml-3 pb-4`,children:[(0,i.jsx)(`p`,{className:t.cn(`font-medium`,y.name,g?`text-foreground`:`text-muted-foreground`),children:e.approver.name}),e.approver.role&&(0,i.jsx)(`p`,{className:t.cn(`text-muted-foreground`,y.role),children:e.approver.role}),(0,i.jsxs)(`div`,{className:`flex items-center gap-2 mt-1`,children:[(0,i.jsx)(`span`,{className:t.cn(y.role,a[e.status].color,`font-medium`),children:a[e.status].label}),e.timestamp&&(0,i.jsx)(`span`,{className:t.cn(`text-muted-foreground`,y.time),children:s(e.timestamp)})]}),m&&e.comment&&(0,i.jsx)(`div`,{className:`mt-2 p-2 rounded bg-muted/50 max-w-xs`,children:(0,i.jsxs)(`p`,{className:t.cn(`text-muted-foreground`,y.comment),children:[`"`,e.comment,`"`]})})]})]})}function p({steps:e,currentUserId:r,onApprove:a,onReject:o,variant:s=`horizontal`,size:c=`md`,showComments:l=!1,className:u}){let d=n.useMemo(()=>e.findIndex(e=>e.status===`pending`),[e]);return(0,i.jsx)(`div`,{className:t.cn(s===`horizontal`?`flex items-start overflow-x-auto py-4`:`flex flex-col`,u),role:`list`,"aria-label":`Approval chain`,children:e.map((t,n)=>{let u=r===t.approver.id,p=n===d,m=n>0?e[n-1].status:void 0;return(0,i.jsx)(f,{step:t,index:n,isLast:n===e.length-1,previousStatus:m,size:c,orientation:s,showComments:l,isCurrentUser:u,isCurrent:p,onApprove:u&&t.status===`pending`&&a?e=>a(t.id,e):void 0,onReject:u&&t.status===`pending`&&o?e=>o(t.id,e):void 0},t.id)})})}exports.default=p;

package/dist/components/waka-approval-chain/index.es.js

@@ -0,0 +1,357 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { Check as n, Clock as r, MessageSquare as i, SkipForward as a, X as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/waka-approval-chain/index.tsx
+var l = {
+	pending: {
+		icon: r,
+		color: "text-amber-600",
+		bgColor: "bg-amber-100 dark:bg-amber-900/30",
+		borderColor: "border-amber-300 dark:border-amber-700",
+		label: "Pending"
+	},
+	approved: {
+		icon: n,
+		color: "text-green-600",
+		bgColor: "bg-green-100 dark:bg-green-900/30",
+		borderColor: "border-green-300 dark:border-green-700",
+		label: "Approved"
+	},
+	rejected: {
+		icon: o,
+		color: "text-red-600",
+		bgColor: "bg-red-100 dark:bg-red-900/30",
+		borderColor: "border-red-300 dark:border-red-700",
+		label: "Rejected"
+	},
+	skipped: {
+		icon: a,
+		color: "text-gray-500",
+		bgColor: "bg-gray-100 dark:bg-gray-800",
+		borderColor: "border-gray-300 dark:border-gray-600",
+		label: "Skipped"
+	}
+}, u = {
+	sm: {
+		avatar: "h-8 w-8",
+		avatarText: "text-xs",
+		icon: "h-3 w-3",
+		statusIcon: "h-4 w-4",
+		name: "text-xs",
+		role: "text-[10px]",
+		time: "text-[10px]",
+		comment: "text-xs",
+		button: "px-2 py-1 text-xs",
+		connector: "w-6",
+		connectorVertical: "h-6",
+		hoverCard: "w-48"
+	},
+	md: {
+		avatar: "h-10 w-10",
+		avatarText: "text-sm",
+		icon: "h-4 w-4",
+		statusIcon: "h-5 w-5",
+		name: "text-sm",
+		role: "text-xs",
+		time: "text-xs",
+		comment: "text-sm",
+		button: "px-3 py-1.5 text-sm",
+		connector: "w-8",
+		connectorVertical: "h-8",
+		hoverCard: "w-56"
+	},
+	lg: {
+		avatar: "h-12 w-12",
+		avatarText: "text-base",
+		icon: "h-5 w-5",
+		statusIcon: "h-6 w-6",
+		name: "text-base",
+		role: "text-sm",
+		time: "text-sm",
+		comment: "text-base",
+		button: "px-4 py-2 text-base",
+		connector: "w-10",
+		connectorVertical: "h-10",
+		hoverCard: "w-64"
+	}
+};
+function d(e) {
+	let t = Math.floor(((/* @__PURE__ */ new Date()).getTime() - e.getTime()) / 1e3);
+	if (t < 60) return "just now";
+	let n = Math.floor(t / 60);
+	if (n < 60) return `${n}m ago`;
+	let r = Math.floor(n / 60);
+	if (r < 24) return `${r}h ago`;
+	let i = Math.floor(r / 24);
+	if (i < 7) return `${i}d ago`;
+	let a = Math.floor(i / 7);
+	if (a < 4) return `${a}w ago`;
+	let o = Math.floor(i / 30);
+	return o < 12 ? `${o}mo ago` : `${Math.floor(i / 365)}y ago`;
+}
+function f(e) {
+	return e.split(" ").map((e) => e[0]).join("").toUpperCase().slice(0, 2);
+}
+function p({ approver: t, status: n, size: r, isCurrent: i }) {
+	let a = u[r], o = l[n], d = o.icon;
+	return /* @__PURE__ */ c("div", {
+		className: "relative",
+		children: [/* @__PURE__ */ s("div", {
+			className: e("relative rounded-full overflow-hidden border-2 transition-all duration-200", a.avatar, i && "ring-2 ring-primary ring-offset-2", o.borderColor),
+			children: t.avatar ? /* @__PURE__ */ s("img", {
+				src: t.avatar,
+				alt: t.name,
+				className: "h-full w-full object-cover"
+			}) : /* @__PURE__ */ s("div", {
+				className: e("h-full w-full flex items-center justify-center bg-muted", a.avatarText, "font-medium text-muted-foreground"),
+				children: f(t.name)
+			})
+		}), /* @__PURE__ */ s("div", {
+			className: e("absolute -bottom-1 -right-1 rounded-full p-0.5", o.bgColor, "border border-background"),
+			children: /* @__PURE__ */ s(d, { className: e(a.icon, o.color) })
+		})]
+	});
+}
+function m({ status: t, previousStatus: n, orientation: r, size: i }) {
+	let a = u[i], o = n === "approved", l = n === "rejected", d = o ? "bg-green-400" : l ? "bg-red-400" : "bg-gray-300 dark:bg-gray-600";
+	return r === "horizontal" ? /* @__PURE__ */ c("div", {
+		className: e("flex items-center", a.connector),
+		children: [/* @__PURE__ */ s("div", { className: e("flex-1 h-0.5", d) }), /* @__PURE__ */ s("div", { className: e("h-0 w-0 border-t-4 border-b-4 border-l-4 border-transparent", o ? "border-l-green-400" : l ? "border-l-red-400" : "border-l-gray-300 dark:border-l-gray-600") })]
+	}) : /* @__PURE__ */ c("div", {
+		className: e("flex flex-col items-center", a.connectorVertical),
+		children: [/* @__PURE__ */ s("div", { className: e("flex-1 w-0.5", d) }), /* @__PURE__ */ s("div", { className: e("w-0 h-0 border-l-4 border-r-4 border-t-4 border-transparent", o ? "border-t-green-400" : l ? "border-t-red-400" : "border-t-gray-300 dark:border-t-gray-600") })]
+	});
+}
+function h({ step: r, size: a, showComments: p, isCurrentUser: m, onApprove: h, onReject: g, children: _ }) {
+	let [v, y] = t.useState(!1), [b, x] = t.useState(""), [S, C] = t.useState(!1), w = u[a], T = l[r.status];
+	return /* @__PURE__ */ c("div", {
+		className: "relative",
+		onMouseEnter: () => y(!0),
+		onMouseLeave: () => {
+			S || y(!1);
+		},
+		children: [_, v && /* @__PURE__ */ c("div", {
+			className: e("absolute z-50 rounded-lg border bg-popover p-3 shadow-lg", "animate-in fade-in-0 zoom-in-95", w.hoverCard, "top-full left-1/2 -translate-x-1/2 mt-2"),
+			onMouseEnter: () => y(!0),
+			onMouseLeave: () => {
+				S || y(!1);
+			},
+			children: [
+				/* @__PURE__ */ s("div", { className: "absolute -top-2 left-1/2 -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-transparent border-b-popover" }),
+				/* @__PURE__ */ c("div", {
+					className: "flex items-start gap-3",
+					children: [/* @__PURE__ */ s("div", {
+						className: e("rounded-full overflow-hidden flex-shrink-0", w.avatar),
+						children: r.approver.avatar ? /* @__PURE__ */ s("img", {
+							src: r.approver.avatar,
+							alt: r.approver.name,
+							className: "h-full w-full object-cover"
+						}) : /* @__PURE__ */ s("div", {
+							className: e("h-full w-full flex items-center justify-center bg-muted", w.avatarText, "font-medium text-muted-foreground"),
+							children: f(r.approver.name)
+						})
+					}), /* @__PURE__ */ c("div", {
+						className: "flex-1 min-w-0",
+						children: [/* @__PURE__ */ s("p", {
+							className: e("font-medium truncate", w.name),
+							children: r.approver.name
+						}), r.approver.role && /* @__PURE__ */ s("p", {
+							className: e("text-muted-foreground truncate", w.role),
+							children: r.approver.role
+						})]
+					})]
+				}),
+				/* @__PURE__ */ c("div", {
+					className: "mt-2 flex items-center justify-between",
+					children: [/* @__PURE__ */ c("div", {
+						className: "flex items-center gap-1.5",
+						children: [/* @__PURE__ */ s(T.icon, { className: e(w.icon, T.color) }), /* @__PURE__ */ s("span", {
+							className: e(w.role, T.color, "font-medium"),
+							children: T.label
+						})]
+					}), r.timestamp && /* @__PURE__ */ s("span", {
+						className: e("text-muted-foreground", w.time),
+						children: d(r.timestamp)
+					})]
+				}),
+				p && r.comment && /* @__PURE__ */ s("div", {
+					className: "mt-2 p-2 rounded bg-muted/50",
+					children: /* @__PURE__ */ c("div", {
+						className: "flex items-start gap-1.5",
+						children: [/* @__PURE__ */ s(i, { className: e(w.icon, "text-muted-foreground mt-0.5") }), /* @__PURE__ */ s("p", {
+							className: e("text-muted-foreground", w.comment),
+							children: r.comment
+						})]
+					})
+				}),
+				m && r.status === "pending" && (h || g) && /* @__PURE__ */ s("div", {
+					className: "mt-3 pt-3 border-t",
+					children: S ? /* @__PURE__ */ c("div", {
+						className: "space-y-2",
+						children: [
+							/* @__PURE__ */ s("textarea", {
+								value: b,
+								onChange: (e) => x(e.target.value),
+								placeholder: "Add a comment (optional)",
+								className: e("w-full px-2 py-1.5 rounded border bg-background resize-none", w.comment),
+								rows: 2,
+								autoFocus: !0
+							}),
+							/* @__PURE__ */ c("div", {
+								className: "flex gap-2",
+								children: [h && /* @__PURE__ */ s("button", {
+									onClick: () => {
+										h?.(b || void 0), x(""), C(!1), y(!1);
+									},
+									className: e("flex-1 rounded font-medium transition-colors", "bg-green-600 text-white hover:bg-green-700", w.button),
+									children: "Approve"
+								}), g && /* @__PURE__ */ s("button", {
+									onClick: () => {
+										g?.(b || void 0), x(""), C(!1), y(!1);
+									},
+									className: e("flex-1 rounded font-medium transition-colors", "bg-red-600 text-white hover:bg-red-700", w.button),
+									children: "Reject"
+								})]
+							}),
+							/* @__PURE__ */ s("button", {
+								onClick: () => {
+									C(!1), x("");
+								},
+								className: e("w-full rounded font-medium transition-colors", "text-muted-foreground hover:text-foreground", w.button),
+								children: "Cancel"
+							})
+						]
+					}) : /* @__PURE__ */ c("div", {
+						className: "flex gap-2",
+						children: [h && /* @__PURE__ */ c("button", {
+							onClick: () => C(!0),
+							className: e("flex-1 rounded font-medium transition-colors", "bg-green-600 text-white hover:bg-green-700", w.button),
+							children: [/* @__PURE__ */ s(n, { className: e(w.icon, "inline-block mr-1") }), "Approve"]
+						}), g && /* @__PURE__ */ c("button", {
+							onClick: () => C(!0),
+							className: e("flex-1 rounded font-medium transition-colors", "bg-red-600 text-white hover:bg-red-700", w.button),
+							children: [/* @__PURE__ */ s(o, { className: e(w.icon, "inline-block mr-1") }), "Reject"]
+						})]
+					})
+				})
+			]
+		})]
+	});
+}
+function g({ step: t, index: n, isLast: r, previousStatus: i, size: a, orientation: o, showComments: f, isCurrentUser: g, isCurrent: _, onApprove: v, onReject: y }) {
+	let b = u[a];
+	return o === "horizontal" ? /* @__PURE__ */ c("div", {
+		className: "flex items-center",
+		children: [/* @__PURE__ */ s(h, {
+			step: t,
+			size: a,
+			showComments: f,
+			isCurrentUser: g,
+			onApprove: v,
+			onReject: y,
+			children: /* @__PURE__ */ c("div", {
+				className: "flex flex-col items-center gap-1",
+				children: [/* @__PURE__ */ s(p, {
+					approver: t.approver,
+					status: t.status,
+					size: a,
+					isCurrent: _
+				}), /* @__PURE__ */ s("span", {
+					className: e("text-center max-w-[80px] truncate", b.name, _ ? "text-foreground font-medium" : "text-muted-foreground"),
+					children: t.approver.name.split(" ")[0]
+				})]
+			})
+		}), !r && /* @__PURE__ */ s(m, {
+			status: t.status,
+			previousStatus: t.status,
+			orientation: "horizontal",
+			size: a
+		})]
+	}) : /* @__PURE__ */ c("div", {
+		className: "flex",
+		children: [/* @__PURE__ */ c("div", {
+			className: "flex flex-col items-center",
+			children: [/* @__PURE__ */ s(h, {
+				step: t,
+				size: a,
+				showComments: f,
+				isCurrentUser: g,
+				onApprove: v,
+				onReject: y,
+				children: /* @__PURE__ */ s(p, {
+					approver: t.approver,
+					status: t.status,
+					size: a,
+					isCurrent: _
+				})
+			}), !r && /* @__PURE__ */ s(m, {
+				status: t.status,
+				previousStatus: t.status,
+				orientation: "vertical",
+				size: a
+			})]
+		}), /* @__PURE__ */ c("div", {
+			className: "ml-3 pb-4",
+			children: [
+				/* @__PURE__ */ s("p", {
+					className: e("font-medium", b.name, _ ? "text-foreground" : "text-muted-foreground"),
+					children: t.approver.name
+				}),
+				t.approver.role && /* @__PURE__ */ s("p", {
+					className: e("text-muted-foreground", b.role),
+					children: t.approver.role
+				}),
+				/* @__PURE__ */ c("div", {
+					className: "flex items-center gap-2 mt-1",
+					children: [/* @__PURE__ */ s("span", {
+						className: e(b.role, l[t.status].color, "font-medium"),
+						children: l[t.status].label
+					}), t.timestamp && /* @__PURE__ */ s("span", {
+						className: e("text-muted-foreground", b.time),
+						children: d(t.timestamp)
+					})]
+				}),
+				f && t.comment && /* @__PURE__ */ s("div", {
+					className: "mt-2 p-2 rounded bg-muted/50 max-w-xs",
+					children: /* @__PURE__ */ c("p", {
+						className: e("text-muted-foreground", b.comment),
+						children: [
+							"\"",
+							t.comment,
+							"\""
+						]
+					})
+				})
+			]
+		})]
+	});
+}
+function _({ steps: n, currentUserId: r, onApprove: i, onReject: a, variant: o = "horizontal", size: c = "md", showComments: l = !1, className: u }) {
+	let d = t.useMemo(() => n.findIndex((e) => e.status === "pending"), [n]);
+	return /* @__PURE__ */ s("div", {
+		className: e(o === "horizontal" ? "flex items-start overflow-x-auto py-4" : "flex flex-col", u),
+		role: "list",
+		"aria-label": "Approval chain",
+		children: n.map((e, t) => {
+			let u = r === e.approver.id, f = t === d, p = t > 0 ? n[t - 1].status : void 0;
+			return /* @__PURE__ */ s(g, {
+				step: e,
+				index: t,
+				isLast: t === n.length - 1,
+				previousStatus: p,
+				size: c,
+				orientation: o,
+				showComments: l,
+				isCurrentUser: u,
+				isCurrent: f,
+				onApprove: u && e.status === "pending" && i ? (t) => i(e.id, t) : void 0,
+				onReject: u && e.status === "pending" && a ? (t) => a(e.id, t) : void 0
+			}, e.id);
+		})
+	});
+}
+//#endregion
+export { _ as default };

package/dist/components/waka-artifact-list/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs.js`),t=require(`../../utils/cn.cjs.js`),n=require(`../badge/index.cjs.js`),r=require(`../button/index.cjs.js`),i=require(`../input/index.cjs.js`),a=require(`../scroll-area/index.cjs.js`),o=require(`../tooltip/index.cjs.js`);let s=require(`react`);s=e.__toESM(s);let c=require(`lucide-react`),l=require(`react/jsx-runtime`);var u={archive:{icon:c.FileArchive,color:`text-orange-500`},binary:{icon:c.Package,color:`text-blue-500`},log:{icon:c.FileText,color:`text-gray-500`},report:{icon:c.FileText,color:`text-green-500`},image:{icon:c.Image,color:`text-purple-500`},other:{icon:c.File,color:`text-muted-foreground`}};function d(e){if(e===0)return`0 B`;let t=1024,n=[`B`,`KB`,`MB`,`GB`],r=Math.floor(Math.log(e)/Math.log(t));return parseFloat((e/t**+r).toFixed(2))+` `+n[r]}function f(e){return e.toLocaleDateString(`fr-FR`,{day:`2-digit`,month:`short`,hour:`2-digit`,minute:`2-digit`})}function p(e){if(!e)return!1;let t=e.getTime()-Date.now();return t>0&&t<1440*60*1e3}function m({artifact:e,onDownload:i,onDelete:a,onView:m,showExpiration:h,allowDelete:g}){let[_,v]=s.useState(!1),y=u[e.type],b=y.icon,x=p(e.expiresAt);return(0,l.jsxs)(`div`,{className:`flex items-center gap-4 p-3 border-b hover:bg-muted/30 transition-colors`,children:[(0,l.jsx)(b,{className:t.cn(`h-8 w-8 shrink-0`,y.color)}),(0,l.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,l.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,l.jsx)(`span`,{className:`font-medium truncate cursor-pointer hover:text-primary`,onClick:()=>m?.(e),children:e.name}),(0,l.jsx)(n.Badge,{variant:`outline`,className:`text-xs capitalize`,children:e.type})]}),(0,l.jsxs)(`div`,{className:`flex items-center gap-3 text-xs text-muted-foreground mt-1`,children:[(0,l.jsxs)(`span`,{className:`flex items-center gap-1`,children:[(0,l.jsx)(c.HardDrive,{className:`h-3 w-3`}),d(e.size)]}),(0,l.jsxs)(`span`,{className:`flex items-center gap-1`,children:[(0,l.jsx)(c.Clock,{className:`h-3 w-3`}),f(e.createdAt)]}),h&&e.expiresAt&&(0,l.jsxs)(`span`,{className:t.cn(`flex items-center gap-1`,x&&`text-yellow-500`),children:[`Expires: `,f(e.expiresAt)]})]})]}),e.sha256&&(0,l.jsx)(o.TooltipProvider,{children:(0,l.jsxs)(o.Tooltip,{children:[(0,l.jsx)(o.TooltipTrigger,{asChild:!0,children:(0,l.jsxs)(`button`,{className:`hidden md:flex items-center gap-1 text-xs text-muted-foreground hover:text-foreground`,onClick:()=>{e.sha256&&(navigator.clipboard.writeText(e.sha256),v(!0),setTimeout(()=>v(!1),2e3))},children:[_?(0,l.jsx)(c.CheckCircle2,{className:`h-3 w-3 text-green-500`}):(0,l.jsx)(c.Copy,{className:`h-3 w-3`}),(0,l.jsxs)(`code`,{className:`truncate max-w-[100px]`,children:[e.sha256.slice(0,12),`...`]})]})}),(0,l.jsx)(o.TooltipContent,{children:(0,l.jsxs)(`div`,{className:`space-y-1`,children:[(0,l.jsx)(`div`,{className:`text-xs font-medium`,children:`SHA256`}),(0,l.jsx)(`code`,{className:`text-xs break-all`,children:e.sha256})]})})]})}),(0,l.jsxs)(`div`,{className:`flex items-center gap-1 shrink-0`,children:[e.downloadUrl&&(0,l.jsx)(o.TooltipProvider,{children:(0,l.jsxs)(o.Tooltip,{children:[(0,l.jsx)(o.TooltipTrigger,{asChild:!0,children:(0,l.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-8 w-8 p-0`,onClick:()=>i?.(e),children:(0,l.jsx)(c.Download,{className:`h-4 w-4`})})}),(0,l.jsx)(o.TooltipContent,{children:`Download`})]})}),(0,l.jsx)(o.TooltipProvider,{children:(0,l.jsxs)(o.Tooltip,{children:[(0,l.jsx)(o.TooltipTrigger,{asChild:!0,children:(0,l.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-8 w-8 p-0`,onClick:()=>m?.(e),children:(0,l.jsx)(c.ExternalLink,{className:`h-4 w-4`})})}),(0,l.jsx)(o.TooltipContent,{children:`View Details`})]})}),g&&(0,l.jsx)(o.TooltipProvider,{children:(0,l.jsxs)(o.Tooltip,{children:[(0,l.jsx)(o.TooltipTrigger,{asChild:!0,children:(0,l.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-8 w-8 p-0 text-destructive hover:text-destructive`,onClick:()=>a?.(e),children:(0,l.jsx)(c.Trash2,{className:`h-4 w-4`})})}),(0,l.jsx)(o.TooltipContent,{children:`Delete`})]})})]})]})}function h({artifacts:e,onDownload:o,onDelete:f,onView:p,title:h=`Artifacts`,showExpiration:g=!0,allowDelete:_=!1,className:v}){let[y,b]=s.useState(``),[x,S]=s.useState(`all`),C=s.useMemo(()=>e.filter(e=>x!==`all`&&e.type!==x?!1:y?e.name.toLowerCase().includes(y.toLowerCase()):!0),[e,x,y]),w=e.reduce((e,t)=>e+t.size,0),T=s.useMemo(()=>e.reduce((e,t)=>(e[t.type]=(e[t.type]||0)+1,e),{}),[e]);return(0,l.jsxs)(`div`,{className:t.cn(`flex flex-col border rounded-lg bg-background`,v),children:[(0,l.jsxs)(`div`,{className:`flex items-center justify-between gap-4 p-3 border-b`,children:[(0,l.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,l.jsx)(c.Package,{className:`h-5 w-5`}),(0,l.jsx)(`h3`,{className:`font-semibold`,children:h}),(0,l.jsx)(n.Badge,{variant:`secondary`,children:e.length})]}),(0,l.jsxs)(`div`,{className:`flex items-center gap-2 text-sm text-muted-foreground`,children:[(0,l.jsx)(c.HardDrive,{className:`h-4 w-4`}),`Total: `,d(w)]})]}),(0,l.jsxs)(`div`,{className:`flex items-center gap-2 p-2 border-b bg-muted/30`,children:[(0,l.jsxs)(`div`,{className:`relative flex-1 max-w-sm`,children:[(0,l.jsx)(c.Search,{className:`absolute left-2.5 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground`}),(0,l.jsx)(i.Input,{placeholder:`Search artifacts...`,value:y,onChange:e=>b(e.target.value),className:`pl-8 h-8`})]}),(0,l.jsxs)(`div`,{className:`flex items-center gap-1 flex-wrap`,children:[(0,l.jsx)(r.Button,{variant:x===`all`?`default`:`ghost`,size:`sm`,className:`h-7 text-xs`,onClick:()=>S(`all`),children:`All`}),Object.entries(T).map(([e,n])=>{let i=u[e],a=i.icon;return(0,l.jsxs)(r.Button,{variant:x===e?`default`:`ghost`,size:`sm`,className:`h-7 text-xs`,onClick:()=>S(e),children:[(0,l.jsx)(a,{className:t.cn(`h-3 w-3 mr-1`,i.color)}),e,` (`,n,`)`]},e)})]})]}),(0,l.jsx)(a.ScrollArea,{className:`flex-1 max-h-[400px]`,children:C.length===0?(0,l.jsxs)(`div`,{className:`flex flex-col items-center justify-center h-32 text-muted-foreground`,children:[(0,l.jsx)(c.Folder,{className:`h-8 w-8 mb-2`}),(0,l.jsx)(`span`,{children:`No artifacts found`})]}):C.map(e=>(0,l.jsx)(m,{artifact:e,onDownload:o,onDelete:f,onView:p,showExpiration:g,allowDelete:_},e.id))})]})}var g=[{id:`1`,name:`build-linux-x64.tar.gz`,type:`archive`,size:45*1024*1024,createdAt:new Date(Date.now()-2*36e5),expiresAt:new Date(Date.now()+168*36e5),downloadUrl:`#`,sha256:`a1b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6q7r8s9t0u1v2w3x4y5z6`},{id:`2`,name:`build-darwin-arm64.tar.gz`,type:`archive`,size:42*1024*1024,createdAt:new Date(Date.now()-2*36e5),expiresAt:new Date(Date.now()+168*36e5),downloadUrl:`#`,sha256:`b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6q7r8s9t0u1v2w3x4y5z6a1`},{id:`3`,name:`test-results.xml`,type:`report`,size:256*1024,createdAt:new Date(Date.now()-2*36e5),downloadUrl:`#`},{id:`4`,name:`coverage-report.html`,type:`report`,size:1.2*1024*1024,createdAt:new Date(Date.now()-2*36e5),downloadUrl:`#`},{id:`5`,name:`build.log`,type:`log`,size:512*1024,createdAt:new Date(Date.now()-2*36e5),downloadUrl:`#`},{id:`6`,name:`docker-image.tar`,type:`image`,size:250*1024*1024,createdAt:new Date(Date.now()-2*36e5),expiresAt:new Date(Date.now()+12*36e5),downloadUrl:`#`,sha256:`c3d4e5f6g7h8i9j0k1l2m3n4o5p6q7r8s9t0u1v2w3x4y5z6a1b2`}];exports.WakaArtifactList=h,exports.defaultArtifacts=g;