@devalok/shilp-sutra-karm 0.20.2 → 0.21.0

package/dist/_chunks/chat-panel.js

@@ -8,23 +8,23 @@ import { cn as x } from "@devalok/shilp-sutra/ui/lib/utils";
 import { springs as v } from "@devalok/shilp-sutra/ui/lib/motion";
 import { u as Z } from "./use-composed-ref.js";
 import { m as A } from "./markdown-components.js";
-import { M as L } from "./vendor.js";
-import { IconRobot as C, IconAlertCircle as $, IconUser as O, IconSquare as S, IconSend as ee, IconMessagePlus as E, IconMessage as se, IconArchive as ae, IconTrash as re, IconChevronDown as te, IconHistory as ie, IconX as le } from "@tabler/icons-react";
+import { M as L } from "./vendor-markdown.js";
+import { IconRobot as C, IconAlertCircle as $, IconUser as O, IconSquare as S, IconSend as ee, IconMessagePlus as E, IconMessage as se, IconArchive as ae, IconTrash as re, IconChevronDown as te, IconHistory as ie, IconX as de } from "@tabler/icons-react";
 import { Button as D } from "@devalok/shilp-sutra/ui/button";
-import { formatRelativeTime as de } from "@devalok/shilp-sutra/ui/lib/date-utils";
+import { formatRelativeTime as le } from "@devalok/shilp-sutra/ui/lib/date-utils";
 import { DropdownMenu as ce, DropdownMenuTrigger as ne, DropdownMenuContent as oe, DropdownMenuItem as me } from "@devalok/shilp-sutra/ui";
 const H = w.forwardRef(
-  function({ text: l, isComplete: d = !1, className: i, ...f }, c) {
+  function({ text: d, isComplete: l = !1, className: i, ...f }, c) {
     return /* @__PURE__ */ s("div", { ref: c, className: x(i), ...f, "aria-live": "off", children: [
-      /* @__PURE__ */ e(L, { components: A, children: l }),
-      !d && /* @__PURE__ */ e("span", { className: "inline-block h-4 w-2 animate-pulse bg-surface-fg-muted ml-ds-01" }),
+      /* @__PURE__ */ e(L, { components: A, children: d }),
+      !l && /* @__PURE__ */ e("span", { className: "inline-block h-4 w-2 animate-pulse bg-surface-fg-muted ml-ds-01" }),
       /* @__PURE__ */ e(
         "span",
         {
           className: "sr-only",
           "aria-live": "polite",
           "aria-atomic": "true",
-          children: d ? l : ""
+          children: l ? d : ""
         }
       )
     ] });
@@ -33,8 +33,8 @@ const H = w.forwardRef(
 H.displayName = "StreamingText";
 const K = w.forwardRef(
   function({
-    messages: l,
-    isStreaming: d = !1,
+    messages: d,
+    isStreaming: l = !1,
     streamingText: i = "",
     isLoadingMessages: f = !1,
     emptyTitle: c = "Karm AI",
@@ -46,15 +46,15 @@ const K = w.forwardRef(
     return Y(() => {
       const a = h.current;
       a && (a.scrollTop = a.scrollHeight);
-    }, [l, i]), f ? /* @__PURE__ */ e("div", { ref: n, className: x("flex flex-1 items-center justify-center", o), ...m, children: /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-ds-03", children: [
+    }, [d, i]), f ? /* @__PURE__ */ e("div", { ref: n, className: x("flex flex-1 items-center justify-center", o), ...m, children: /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-ds-03", children: [
       /* @__PURE__ */ e("div", { className: "h-ds-xs w-ds-xs animate-spin rounded-ds-full border-2 border-surface-border border-t-transparent" }),
       /* @__PURE__ */ e("p", { className: "text-ds-sm text-surface-fg-subtle", children: "Loading messages..." })
-    ] }) }) : l.length === 0 && !d ? /* @__PURE__ */ e("div", { ref: n, className: x("flex flex-1 items-center justify-center p-ds-06", o), ...m, children: /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-ds-04 text-center", children: [
-      /* @__PURE__ */ e("div", { className: "flex h-ds-lg w-ds-lg items-center justify-center rounded-ds-full bg-surface-3", children: /* @__PURE__ */ e(C, { className: "h-ico-lg w-ico-lg text-surface-fg-muted" }) }),
+    ] }) }) : d.length === 0 && !l ? /* @__PURE__ */ e("div", { ref: n, className: x("flex flex-1 items-center justify-center p-ds-06", o), ...m, children: /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-ds-04 text-center", children: [
+      /* @__PURE__ */ e("div", { className: "flex h-ds-lg w-ds-lg items-center justify-center rounded-ds-full bg-surface-raised-hover", children: /* @__PURE__ */ e(C, { className: "h-ico-lg w-ico-lg text-surface-fg-muted" }) }),
       /* @__PURE__ */ e("h3", { className: "text-ds-base text-surface-fg", children: c }),
       /* @__PURE__ */ e("p", { className: "text-ds-sm max-w-[280px] text-surface-fg-subtle", children: u })
     ] }) }) : /* @__PURE__ */ e("div", { ref: t, className: x("no-scrollbar flex-1 overflow-y-auto p-ds-05", o), ...m, children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-ds-05", role: "log", "aria-label": "Chat messages", children: /* @__PURE__ */ s(W, { initial: !1, children: [
-      l.map((a) => a.role === "SYSTEM" ? /* @__PURE__ */ e(
+      d.map((a) => a.role === "SYSTEM" ? /* @__PURE__ */ e(
         g.div,
         {
           initial: { opacity: 0, y: 10 },
@@ -76,7 +76,7 @@ const K = w.forwardRef(
           className: "flex justify-end",
           children: /* @__PURE__ */ s("div", { className: "flex max-w-[85%] items-start gap-ds-03", children: [
             /* @__PURE__ */ e("div", { className: "rounded-ds-2xl rounded-br-ds-sm bg-accent-9 px-ds-04 py-ds-03 text-accent-fg", children: /* @__PURE__ */ e("p", { className: "text-ds-md whitespace-pre-wrap", children: a.content }) }),
-            /* @__PURE__ */ e("div", { className: "flex h-ds-xs-plus w-ds-xs-plus shrink-0 items-center justify-center rounded-ds-full bg-surface-3", children: /* @__PURE__ */ e(O, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) })
+            /* @__PURE__ */ e("div", { className: "flex h-ds-xs-plus w-ds-xs-plus shrink-0 items-center justify-center rounded-ds-full bg-surface-raised-hover", children: /* @__PURE__ */ e(O, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) })
           ] })
         },
         a.id
@@ -88,13 +88,13 @@ const K = w.forwardRef(
           transition: v.snappy,
           className: "flex justify-start",
           children: /* @__PURE__ */ s("div", { className: "flex max-w-[85%] items-start gap-ds-03", children: [
-            /* @__PURE__ */ e("div", { className: "flex h-ds-xs-plus w-ds-xs-plus shrink-0 items-center justify-center rounded-ds-full bg-surface-3", children: /* @__PURE__ */ e(C, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) }),
-            /* @__PURE__ */ e("div", { className: "rounded-ds-2xl rounded-bl-ds-sm bg-surface-3 px-ds-04 py-ds-03", children: /* @__PURE__ */ e("div", { className: "text-ds-md text-surface-fg", children: /* @__PURE__ */ e(L, { components: A, children: a.content }) }) })
+            /* @__PURE__ */ e("div", { className: "flex h-ds-xs-plus w-ds-xs-plus shrink-0 items-center justify-center rounded-ds-full bg-surface-raised-hover", children: /* @__PURE__ */ e(C, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) }),
+            /* @__PURE__ */ e("div", { className: "rounded-ds-2xl rounded-bl-ds-sm bg-surface-raised-hover px-ds-04 py-ds-03", children: /* @__PURE__ */ e("div", { className: "text-ds-md text-surface-fg", children: /* @__PURE__ */ e(L, { components: A, children: a.content }) }) })
           ] })
         },
         a.id
       )),
-      d && i && /* @__PURE__ */ e(
+      l && i && /* @__PURE__ */ e(
         g.div,
         {
           initial: { opacity: 0, y: 10 },
@@ -102,13 +102,13 @@ const K = w.forwardRef(
           transition: v.snappy,
           className: "flex justify-start",
           children: /* @__PURE__ */ s("div", { className: "flex max-w-[85%] items-start gap-ds-03", children: [
-            /* @__PURE__ */ e("div", { className: "flex h-ds-xs-plus w-ds-xs-plus shrink-0 items-center justify-center rounded-ds-full bg-surface-3", children: /* @__PURE__ */ e(C, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) }),
-            /* @__PURE__ */ e("div", { className: "rounded-ds-2xl rounded-bl-ds-sm bg-surface-3 px-ds-04 py-ds-03", children: /* @__PURE__ */ e("div", { className: "text-ds-md text-surface-fg", children: /* @__PURE__ */ e(H, { text: i }) }) })
+            /* @__PURE__ */ e("div", { className: "flex h-ds-xs-plus w-ds-xs-plus shrink-0 items-center justify-center rounded-ds-full bg-surface-raised-hover", children: /* @__PURE__ */ e(C, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) }),
+            /* @__PURE__ */ e("div", { className: "rounded-ds-2xl rounded-bl-ds-sm bg-surface-raised-hover px-ds-04 py-ds-03", children: /* @__PURE__ */ e("div", { className: "text-ds-md text-surface-fg", children: /* @__PURE__ */ e(H, { text: i }) }) })
           ] })
         },
         "streaming-text"
       ),
-      d && !i && /* @__PURE__ */ e(
+      l && !i && /* @__PURE__ */ e(
         g.div,
         {
           initial: { opacity: 0, y: 10 },
@@ -116,8 +116,8 @@ const K = w.forwardRef(
           transition: v.snappy,
           className: "flex justify-start",
           children: /* @__PURE__ */ s("div", { className: "flex max-w-[85%] items-start gap-ds-03", children: [
-            /* @__PURE__ */ e("div", { className: "flex h-ds-xs-plus w-ds-xs-plus shrink-0 items-center justify-center rounded-ds-full bg-surface-3", children: /* @__PURE__ */ e(C, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) }),
-            /* @__PURE__ */ e("div", { className: "rounded-ds-2xl rounded-bl-ds-sm bg-surface-3 px-ds-04 py-ds-03", children: /* @__PURE__ */ e("div", { className: "flex items-center gap-ds-02b py-ds-02", children: [0, 1, 2].map((a) => /* @__PURE__ */ e(
+            /* @__PURE__ */ e("div", { className: "flex h-ds-xs-plus w-ds-xs-plus shrink-0 items-center justify-center rounded-ds-full bg-surface-raised-hover", children: /* @__PURE__ */ e(C, { className: "h-ico-sm w-ico-sm text-surface-fg-muted" }) }),
+            /* @__PURE__ */ e("div", { className: "rounded-ds-2xl rounded-bl-ds-sm bg-surface-raised-hover px-ds-04 py-ds-03", children: /* @__PURE__ */ e("div", { className: "flex items-center gap-ds-02b py-ds-02", children: [0, 1, 2].map((a) => /* @__PURE__ */ e(
               g.span,
               {
                 className: "h-2 w-2 rounded-ds-full bg-surface-fg-subtle",
@@ -136,8 +136,8 @@ const K = w.forwardRef(
 K.displayName = "MessageList";
 const U = w.forwardRef(
   function({
-    onSubmit: l,
-    onCancel: d,
+    onSubmit: d,
+    onCancel: l,
     isStreaming: i = !1,
     placeholder: f = "Ask Karm AI...",
     disclaimer: c = "AI responses may be inaccurate. Verify important information.",
@@ -149,15 +149,15 @@ const U = w.forwardRef(
       r && (r.style.height = "auto", r.style.height = Math.min(r.scrollHeight, 160) + "px");
     }, []), y = T(() => {
       const r = n.trim();
-      !r || i || (h(""), t.current && (t.current.style.height = "auto"), l(r));
-    }, [n, i, l]), N = T(
+      !r || i || (h(""), t.current && (t.current.style.height = "auto"), d(r));
+    }, [n, i, d]), N = T(
       (r) => {
         r.key === "Enter" && !r.shiftKey && (r.preventDefault(), y());
       },
       [y]
     );
-    return /* @__PURE__ */ s("div", { ref: m, className: x("border-t border-surface-border-strong bg-surface-2 p-ds-04", u), ...o, children: [
-      /* @__PURE__ */ s("div", { className: "flex items-end gap-ds-03 rounded-ds-xl border border-surface-border-strong bg-surface-3 px-ds-04 py-ds-03", children: [
+    return /* @__PURE__ */ s("div", { ref: m, className: x("border-t border-surface-border-strong bg-surface-raised p-ds-04", u), ...o, children: [
+      /* @__PURE__ */ s("div", { className: "flex items-end gap-ds-03 rounded-ds-xl border border-surface-border-strong bg-surface-raised-hover px-ds-04 py-ds-03", children: [
         /* @__PURE__ */ e(
           "textarea",
           {
@@ -174,7 +174,7 @@ const U = w.forwardRef(
             className: "text-ds-md no-scrollbar max-h-[160px] min-h-ds-xs flex-1 resize-none bg-transparent text-surface-fg placeholder:text-surface-fg-subtle focus:outline-none disabled:opacity-action-disabled"
           }
         ),
-        i ? /* @__PURE__ */ e(D, { variant: "solid", color: "error", size: "icon-sm", className: "h-ds-sm w-ds-sm shrink-0 rounded-ds-lg", onClick: d, "aria-label": "Stop generating", children: /* @__PURE__ */ e(S, { className: "h-ico-sm w-ico-sm" }) }) : /* @__PURE__ */ e(D, { size: "icon-sm", className: "h-ds-sm w-ds-sm shrink-0 rounded-ds-lg", onClick: y, disabled: !n.trim(), "aria-label": "Send message", children: /* @__PURE__ */ e(ee, { className: "h-ico-sm w-ico-sm" }) })
+        i ? /* @__PURE__ */ e(D, { variant: "solid", color: "error", size: "icon-sm", className: "h-ds-sm w-ds-sm shrink-0 rounded-ds-lg", onClick: l, "aria-label": "Stop generating", children: /* @__PURE__ */ e(S, { className: "h-ico-sm w-ico-sm" }) }) : /* @__PURE__ */ e(D, { size: "icon-sm", className: "h-ds-sm w-ds-sm shrink-0 rounded-ds-lg", onClick: y, disabled: !n.trim(), "aria-label": "Send message", children: /* @__PURE__ */ e(ee, { className: "h-ico-sm w-ico-sm" }) })
       ] }),
       c && /* @__PURE__ */ e("p", { className: "text-ds-sm mt-ds-02b text-center text-surface-fg-subtle", children: c })
     ] });
@@ -183,8 +183,8 @@ const U = w.forwardRef(
 U.displayName = "ChatInput";
 const z = w.forwardRef(
   function({
-    conversations: l,
-    activeConversationId: d,
+    conversations: d,
+    activeConversationId: l,
     isLoading: i = !1,
     onSelect: f,
     onNewChat: c,
@@ -200,7 +200,7 @@ const z = w.forwardRef(
           "button",
           {
             onClick: c,
-            className: "flex items-center gap-ds-02b rounded-ds-lg px-ds-03 py-ds-02b text-surface-fg-muted transition-colors hover:bg-surface-3",
+            className: "flex items-center gap-ds-02b rounded-ds-lg px-ds-03 py-ds-02b text-surface-fg-muted transition-colors hover:bg-surface-raised-hover",
             children: [
               /* @__PURE__ */ e(E, { className: "h-ico-sm w-ico-sm" }),
               /* @__PURE__ */ e("span", { className: "text-ds-sm", children: "New Chat" })
@@ -208,15 +208,15 @@ const z = w.forwardRef(
           }
         )
       ] }),
-      /* @__PURE__ */ e("div", { className: "no-scrollbar flex-1 overflow-y-auto", children: i ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ e("div", { className: "h-ico-md w-ico-md animate-spin rounded-ds-full border-2 border-surface-border border-t-transparent" }) }) : l.length === 0 ? /* @__PURE__ */ s("div", { className: "flex flex-col items-center justify-center gap-ds-03 py-12", children: [
+      /* @__PURE__ */ e("div", { className: "no-scrollbar flex-1 overflow-y-auto", children: i ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ e("div", { className: "h-ico-md w-ico-md animate-spin rounded-ds-full border-2 border-surface-border border-t-transparent" }) }) : d.length === 0 ? /* @__PURE__ */ s("div", { className: "flex flex-col items-center justify-center gap-ds-03 py-12", children: [
         /* @__PURE__ */ e(se, { className: "h-ds-sm w-ds-sm text-surface-fg-subtle" }),
         /* @__PURE__ */ e("p", { className: "text-ds-md text-surface-fg-subtle", children: "No conversations yet" })
-      ] }) : /* @__PURE__ */ e("div", { className: "flex flex-col", children: l.map((t) => /* @__PURE__ */ s(
+      ] }) : /* @__PURE__ */ e("div", { className: "flex flex-col", children: d.map((t) => /* @__PURE__ */ s(
         "div",
         {
           className: x(
-            "group flex items-center gap-ds-04 border-b border-surface-border px-ds-05 py-ds-04 transition-colors hover:bg-surface-3",
-            d === t.id && "bg-surface-3"
+            "group flex items-center gap-ds-04 border-b border-surface-border px-ds-05 py-ds-04 transition-colors hover:bg-surface-raised-hover",
+            l === t.id && "bg-surface-raised-hover"
           ),
           children: [
             /* @__PURE__ */ s(
@@ -226,18 +226,18 @@ const z = w.forwardRef(
                 className: "flex min-w-0 flex-1 flex-col gap-ds-01 text-left",
                 children: [
                   /* @__PURE__ */ e("p", { className: "text-ds-md truncate text-surface-fg", children: t.title || "Untitled conversation" }),
-                  /* @__PURE__ */ e("p", { className: "text-ds-sm text-surface-fg-subtle", children: de(t.updatedAt) })
+                  /* @__PURE__ */ e("p", { className: "text-ds-sm text-surface-fg-subtle", children: le(t.updatedAt) })
                 ]
               }
             ),
-            /* @__PURE__ */ s("div", { className: "flex shrink-0 items-center gap-ds-02 opacity-0 transition-opacity group-hover:opacity-100", children: [
+            /* @__PURE__ */ s("div", { className: "flex shrink-0 items-center gap-ds-02 opacity-0 transition-opacity duration-fast-01 group-hover:opacity-100", children: [
               u && /* @__PURE__ */ e(
                 "button",
                 {
                   onClick: (a) => {
                     a.stopPropagation(), u(t.id);
                   },
-                  className: "flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md text-surface-fg-subtle transition-colors hover:bg-surface-3 hover:text-surface-fg-muted",
+                  className: "flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md text-surface-fg-subtle transition-colors hover:bg-surface-raised-hover hover:text-surface-fg-muted",
                   "aria-label": "Archive conversation",
                   children: /* @__PURE__ */ e(ae, { className: "h-ico-sm w-ico-sm" })
                 }
@@ -272,8 +272,8 @@ const fe = [
   { id: "dwar-palak", name: "Dwar-Palak", desc: "Access Control" }
 ], ue = w.forwardRef(
   function({
-    isOpen: l,
-    onOpenChange: d,
+    isOpen: d,
+    onOpenChange: l,
     messages: i,
     conversations: f,
     agents: c = fe,
@@ -294,12 +294,12 @@ const fe = [
     ...q
   }, B) {
     const [M, j] = P(!1), b = c.find((p) => p.id === u) ?? c[0];
-    return /* @__PURE__ */ e(_, { open: l, onOpenChange: d, children: /* @__PURE__ */ s(
+    return /* @__PURE__ */ e(_, { open: d, onOpenChange: l, children: /* @__PURE__ */ s(
       J,
       {
         ref: B,
         side: "right",
-        className: x("flex w-full flex-col gap-0 border-l border-surface-border-strong bg-surface-2 p-0 sm:max-w-[480px] [&>button]:hidden", V),
+        className: x("flex w-full flex-col gap-0 border-l border-surface-border-strong bg-surface-raised p-0 sm:max-w-[480px] [&>button]:hidden", V),
         ...q,
         children: [
           /* @__PURE__ */ e(Q, { className: "sr-only", children: "AI Chat" }),
@@ -308,7 +308,7 @@ const fe = [
               /* @__PURE__ */ e(ne, { asChild: !0, children: /* @__PURE__ */ s(
                 "button",
                 {
-                  className: "flex items-center gap-ds-02b rounded-ds-lg px-ds-03 py-ds-02b transition-colors hover:bg-surface-3",
+                  className: "flex items-center gap-ds-02b rounded-ds-lg px-ds-03 py-ds-02b transition-colors hover:bg-surface-raised-hover",
                   children: [
                     /* @__PURE__ */ e("span", { className: "text-ds-base text-surface-fg", children: b == null ? void 0 : b.name }),
                     /* @__PURE__ */ e("span", { className: "text-ds-sm text-surface-fg-subtle", children: b == null ? void 0 : b.desc }),
@@ -320,7 +320,7 @@ const fe = [
                 me,
                 {
                   onClick: () => N == null ? void 0 : N(p.id),
-                  className: u === p.id ? "bg-surface-3" : "",
+                  className: u === p.id ? "bg-surface-raised-hover" : "",
                   children: /* @__PURE__ */ s("div", { className: "flex flex-col", children: [
                     /* @__PURE__ */ e("span", { className: "text-ds-md text-surface-fg", children: p.name }),
                     /* @__PURE__ */ e("span", { className: "text-ds-sm text-surface-fg-subtle", children: p.desc })
@@ -335,7 +335,7 @@ const fe = [
                 onClick: () => {
                   r == null || r(), j(!1);
                 },
-                className: "flex h-ds-sm w-ds-sm items-center justify-center rounded-ds-lg text-surface-fg-muted transition-colors hover:bg-surface-3",
+                className: "flex h-ds-sm w-ds-sm items-center justify-center rounded-ds-lg text-surface-fg-muted transition-colors hover:bg-surface-raised-hover",
                 "aria-label": "New chat",
                 children: /* @__PURE__ */ e(E, { className: "h-ico-sm w-ico-sm" })
               }
@@ -345,8 +345,8 @@ const fe = [
               {
                 onClick: () => j(!M),
                 className: x(
-                  "flex h-ds-sm w-ds-sm items-center justify-center rounded-ds-lg transition-colors hover:bg-surface-3",
-                  M ? "bg-surface-3 text-surface-fg" : "text-surface-fg-muted"
+                  "flex h-ds-sm w-ds-sm items-center justify-center rounded-ds-lg transition-colors hover:bg-surface-raised-hover",
+                  M ? "bg-surface-raised-hover text-surface-fg" : "text-surface-fg-muted"
                 ),
                 "aria-label": "Conversation history",
                 children: /* @__PURE__ */ e(ie, { className: "h-ico-sm w-ico-sm" })
@@ -355,10 +355,10 @@ const fe = [
             /* @__PURE__ */ e(
               "button",
               {
-                onClick: () => d(!1),
-                className: "flex h-ds-sm w-ds-sm items-center justify-center rounded-ds-lg text-surface-fg-muted transition-colors hover:bg-surface-3",
+                onClick: () => l(!1),
+                className: "flex h-ds-sm w-ds-sm items-center justify-center rounded-ds-lg text-surface-fg-muted transition-colors hover:bg-surface-raised-hover",
                 "aria-label": "Close chat",
-                children: /* @__PURE__ */ e(le, { className: "h-ico-sm w-ico-sm" })
+                children: /* @__PURE__ */ e(de, { className: "h-ico-sm w-ico-sm" })
               }
             )
           ] }),

package/dist/_chunks/kanban-board.js

@@ -3,7 +3,7 @@ import { jsx as e, jsxs as a, Fragment as ve } from "react/jsx-runtime";
 import * as P from "react";
 import { useMemo as re, useState as E, useEffect as oe, useCallback as O, useContext as bt, createContext as xt, useRef as ye } from "react";
 import { createPortal as wt } from "react-dom";
-import { u as Pe, C as _e, c as ze, a as vt, S as Ue, v as yt, b as kt, d as De, D as Ct, e as Nt, h as It, f as Dt, s as Tt, K as Rt, T as St, P as At } from "./vendor.js";
+import { u as Pe, C as _e, a as vt, S as ze, v as yt, b as kt, c as De, D as Ct, d as Nt, h as It, e as Dt, s as Tt, K as Rt, T as St, P as At } from "./vendor-dnd.js";
 import { cn as N } from "@devalok/shilp-sutra/ui/lib/utils";
 import { MotionStagger as le, MotionStaggerItem as Q } from "@devalok/shilp-sutra/motion/primitives";
 import { Input as ke } from "@devalok/shilp-sutra/ui/input";
@@ -11,11 +11,12 @@ import { Button as F } from "@devalok/shilp-sutra/ui/button";
 import { Badge as Mt } from "@devalok/shilp-sutra/ui/badge";
 import { DropdownMenu as U, DropdownMenuTrigger as V, DropdownMenuContent as G, DropdownMenuLabel as te, DropdownMenuSeparator as Y, DropdownMenuCheckboxItem as Te, DropdownMenuRadioGroup as Lt, DropdownMenuRadioItem as Et, DropdownMenuItem as _ } from "@devalok/shilp-sutra/ui/dropdown-menu";
 import { SegmentedControl as Ot } from "@devalok/shilp-sutra/ui/segmented-control";
-import { IconX as Ce, IconSearch as Bt, IconFilter as Wt, IconUser as ce, IconLayoutGrid as Ft, IconLayoutList as $t, IconArrowRight as Se, IconAlertTriangle as Ne, IconEye as de, IconTrash as Ae, IconPlus as Me, IconDots as Pt, IconPencil as _t, IconGauge as zt, IconEyeOff as Ve, IconCalendar as Le, IconCheck as Ut, IconArrowUp as Ge, IconArrowDown as Ke, IconGripVertical as Vt, IconSubtask as Gt, IconLock as Kt, IconTag as Ht } from "@tabler/icons-react";
+import { IconX as Ce, IconSearch as Bt, IconFilter as Wt, IconUser as ce, IconLayoutGrid as Ft, IconLayoutList as $t, IconArrowRight as Se, IconAlertTriangle as Ne, IconEye as de, IconTrash as Ae, IconPlus as Me, IconDots as Pt, IconPencil as _t, IconGauge as zt, IconEyeOff as Ue, IconCalendar as Le, IconCheck as Ut, IconArrowUp as Ve, IconArrowDown as Ge, IconGripVertical as Vt, IconSubtask as Gt, IconLock as Kt, IconTag as Ht } from "@tabler/icons-react";
 import { AnimatePresence as ie, motion as se } from "framer-motion";
 import { springs as ae, motionProps as jt } from "@devalok/shilp-sutra/ui/lib/motion";
 import { AvatarGroup as Yt } from "@devalok/shilp-sutra/composed/avatar-group";
-import { u as He } from "./use-composed-ref.js";
+import { u as Ke } from "./use-composed-ref.js";
+import { w as He } from "./vendor-utils.js";
 import { Checkbox as je } from "@devalok/shilp-sutra/ui";
 import { Avatar as Qt, AvatarImage as qt, AvatarFallback as Xt } from "@devalok/shilp-sutra/ui/avatar";
 import { ContextMenu as Jt, ContextMenuTrigger as Zt, ContextMenuContent as es, ContextMenuSub as be, ContextMenuSubTrigger as xe, ContextMenuSubContent as we, ContextMenuItem as ee, ContextMenuSeparator as ts } from "@devalok/shilp-sutra/ui/context-menu";
@@ -28,7 +29,7 @@ const ss = 320, Be = [
   "bg-category-emerald-9",
   "bg-category-slate-9",
   "bg-accent-9"
-], Us = {
+], Vs = {
   LOW: "IconArrowDown",
   MEDIUM: "IconArrowRight",
   HIGH: "IconArrowUp",
@@ -801,7 +802,7 @@ const Je = P.forwardRef(({ column: t, index: s, className: n, ...r }, c) => {
           variant: "ghost",
           size: "icon-md",
           className: N(
-            "h-ds-xs w-ds-xs flex-shrink-0 opacity-0 transition-opacity",
+            "h-ds-xs w-ds-xs flex-shrink-0 opacity-0 transition-opacity duration-fast-02",
             "group-hover/header:opacity-100 focus:opacity-100",
             "hover:bg-accent-2 hover:text-accent-11"
           ),
@@ -818,7 +819,7 @@ const Je = P.forwardRef(({ column: t, index: s, className: n, ...r }, c) => {
             variant: "ghost",
             size: "icon-md",
             className: N(
-              "h-ds-xs w-ds-xs flex-shrink-0 opacity-0 transition-opacity",
+              "h-ds-xs w-ds-xs flex-shrink-0 opacity-0 transition-opacity duration-fast-02",
               "group-hover/header:opacity-100 focus:opacity-100"
             ),
             "aria-label": "Column options",
@@ -840,7 +841,7 @@ const Je = P.forwardRef(({ column: t, index: s, className: n, ...r }, c) => {
             {
               onClick: () => w(t.id, !(t.isClientVisible ?? !1)),
               children: t.isClientVisible ? /* @__PURE__ */ a(ve, { children: [
-                /* @__PURE__ */ e(Ve, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+                /* @__PURE__ */ e(Ue, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
                 "Hide from client"
               ] }) : /* @__PURE__ */ a(ve, { children: [
                 /* @__PURE__ */ e(de, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
@@ -901,7 +902,7 @@ const Je = P.forwardRef(({ column: t, index: s, className: n, ...r }, c) => {
                 {
                   className: N(
                     "flex items-center justify-center h-6 w-6 rounded-ds-md transition-colors",
-                    f ? "text-accent-11 bg-accent-2" : "text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-4"
+                    f ? "text-accent-11 bg-accent-2" : "text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-raised-active"
                   ),
                   title: f ? `Lead: ${(fe = i.find((k) => k.id === f)) == null ? void 0 : fe.name}` : "Assign task lead",
                   "aria-label": "Assign task lead",
@@ -933,7 +934,7 @@ const Je = P.forwardRef(({ column: t, index: s, className: n, ...r }, c) => {
               {
                 className: N(
                   "relative flex items-center justify-center h-6 w-6 rounded-ds-md cursor-pointer transition-colors",
-                  L ? "text-accent-11 bg-accent-2" : "text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-4"
+                  L ? "text-accent-11 bg-accent-2" : "text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-raised-active"
                 ),
                 title: L ? `Due: ${L}` : "Set due date",
                 "aria-label": "Set due date",
@@ -971,7 +972,7 @@ const Je = P.forwardRef(({ column: t, index: s, className: n, ...r }, c) => {
               "button",
               {
                 onClick: J,
-                className: "flex items-center justify-center h-6 w-6 rounded-ds-md text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-4 transition-colors",
+                className: "flex items-center justify-center h-6 w-6 rounded-ds-md text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-raised-active transition-colors",
                 title: "Cancel",
                 "aria-label": "Cancel adding task",
                 children: /* @__PURE__ */ e(Ce, { className: "h-3.5 w-3.5" })
@@ -1131,18 +1132,18 @@ function gs(t) {
   };
 }
 const et = {
-  LOW: Ke,
+  LOW: Ge,
   MEDIUM: Se,
-  HIGH: Ge,
+  HIGH: Ve,
   URGENT: Ne
-}, ps = ze(
-  "group/card relative rounded-ds-lg border border-transparent bg-surface-3 pl-3 pr-ds-03 py-ds-03 transition-all duration-100 ease-out cursor-pointer",
+}, ps = He(
+  "group/card relative rounded-ds-lg border border-transparent bg-surface-raised pl-3 pr-ds-03 py-ds-03 transition-[box-shadow,border-color,transform] duration-fast-02 ease-productive-standard cursor-pointer",
   {
     variants: {
       state: {
-        default: "shadow-01 hover:shadow-02 hover:-translate-y-px hover:border-surface-border-strong",
+        default: "shadow-raised hover:shadow-raised-hover hover:-translate-y-px hover:border-surface-border-strong",
         dragging: "opacity-action-disabled",
-        overlay: "rotate-[2deg] shadow-03 backdrop-blur-sm ring-1 ring-accent-7"
+        overlay: "rotate-[2deg] shadow-floating backdrop-blur-sm ring-1 ring-accent-7"
       },
       blocked: {
         true: "border-l-2 border-l-error-9",
@@ -1205,7 +1206,7 @@ function st({
             selected: x,
             dimmed: v
           }),
-          n && "scale-[1.03] rotate-[1.5deg] shadow-03",
+          n && "scale-[1.03] rotate-[1.5deg] shadow-floating",
           s && "opacity-40",
           d && "ring-1 ring-accent-9"
         ),
@@ -1218,7 +1219,7 @@ function st({
             se.div,
             {
               className: N(
-                "absolute -top-2 -left-2 z-10 transition-opacity",
+                "absolute -top-2 -left-2 z-10 transition-opacity duration-fast-02",
                 g || x ? "opacity-100" : "opacity-0 group-hover/card:opacity-100"
               ),
               initial: g || x ? { scale: 0.85 } : !1,
@@ -1231,7 +1232,7 @@ function st({
                   onCheckedChange: () => o(t.id),
                   onClick: (h) => h.stopPropagation(),
                   "aria-label": `Select task ${t.taskId}`,
-                  className: "rounded-full bg-surface-1 shadow-01"
+                  className: "rounded-full bg-surface-base shadow-raised"
                 }
               )
             }
@@ -1244,7 +1245,7 @@ function st({
               "button",
               {
                 className: N(
-                  "flex-shrink-0 cursor-grab rounded p-ds-01 opacity-0 transition-opacity",
+                  "flex-shrink-0 cursor-grab rounded p-ds-01 opacity-0 transition-opacity duration-fast-02",
                   "group-hover/card:opacity-action-disabled hover:!opacity-100",
                   "active:cursor-grabbing",
                   n && "opacity-action-disabled"
@@ -1298,7 +1299,7 @@ function st({
                 {
                   size: "xs",
                   className: N(
-                    "text-ds-xs border-2 border-surface-1",
+                    "text-ds-xs border-2 border-surface-base",
                     f > 0 && "-ml-ds-02b",
                     h.isOwner && "shadow-[0_0_0_1.5px_rgba(var(--accent-rgb,99,102,241),0.35),0_0_6px_rgba(var(--accent-rgb,99,102,241),0.2)]"
                   ),
@@ -1337,7 +1338,7 @@ const at = P.forwardRef(
         type: "task",
         task: s
       }
-    }), g = He(I, c), d = {
+    }), g = Ke(I, c), d = {
       transform: _e.Transform.toString(w),
       transition: p
     };
@@ -1352,8 +1353,8 @@ const at = P.forwardRef(
   }
 );
 at.displayName = "TaskCard";
-const bs = ze(
-  "group/card flex items-center gap-ds-02 py-2 pl-3 pr-ds-03 border border-transparent rounded-ds-lg bg-surface-3 transition-all duration-100 ease-out cursor-pointer hover:bg-surface-4 hover:shadow-02 hover:-translate-y-px",
+const bs = He(
+  "group/card flex items-center gap-ds-02 py-2 pl-3 pr-ds-03 border border-transparent rounded-ds-lg bg-surface-raised transition-[box-shadow,border-color,transform,background-color] duration-fast-02 ease-productive-standard cursor-pointer hover:bg-surface-raised-hover hover:shadow-raised-hover hover:-translate-y-px",
   {
     variants: {
       selected: {
@@ -1401,7 +1402,7 @@ function nt({
             dimmed: D
           }),
           s && "opacity-40",
-          n && "scale-[1.03] rotate-[1.5deg] shadow-03",
+          n && "scale-[1.03] rotate-[1.5deg] shadow-floating",
           g && "ring-1 ring-accent-9"
         ),
         onClick: () => w(t.id),
@@ -1413,7 +1414,7 @@ function nt({
             se.div,
             {
               className: N(
-                "absolute -top-1.5 -left-1.5 z-10 transition-opacity",
+                "absolute -top-1.5 -left-1.5 z-10 transition-opacity duration-fast-02",
                 x || p ? "opacity-100" : "opacity-0 group-hover/card:opacity-100"
               ),
               initial: x || p ? { scale: 0.85 } : !1,
@@ -1426,7 +1427,7 @@ function nt({
                   onCheckedChange: () => c(t.id),
                   onClick: (m) => m.stopPropagation(),
                   "aria-label": `Select task ${t.taskId}`,
-                  className: "rounded-full bg-surface-1 shadow-01"
+                  className: "rounded-full bg-surface-base shadow-raised"
                 }
               )
             }
@@ -1443,7 +1444,7 @@ function nt({
             "div",
             {
               className: N(
-                "flex h-[14px] w-[14px] shrink-0 items-center justify-center rounded-full border border-surface-1 bg-accent-2 text-[6px] font-semibold leading-none text-accent-11 overflow-hidden",
+                "flex h-[14px] w-[14px] shrink-0 items-center justify-center rounded-full border border-surface-base bg-accent-2 text-[6px] font-semibold leading-none text-accent-11 overflow-hidden",
                 t.owner && "shadow-[0_0_0_1px_rgba(var(--accent-rgb,99,102,241),0.35),0_0_4px_rgba(var(--accent-rgb,99,102,241),0.2)]"
               ),
               title: l.name,
@@ -1470,7 +1471,7 @@ const rt = P.forwardRef(
         type: "task",
         task: s
       }
-    }), g = He(I, c), d = {
+    }), g = Ke(I, c), d = {
       transform: _e.Transform.toString(w),
       transition: p
     };
@@ -1496,9 +1497,9 @@ const ot = P.forwardRef(
 );
 ot.displayName = "TaskCardOverlay";
 const xs = [
-  { value: "LOW", label: "Low", icon: Ke },
+  { value: "LOW", label: "Low", icon: Ge },
   { value: "MEDIUM", label: "Medium", icon: Se },
-  { value: "HIGH", label: "High", icon: Ge },
+  { value: "HIGH", label: "High", icon: Ve },
   { value: "URGENT", label: "Urgent", icon: Ne }
 ], lt = P.forwardRef(({ taskId: t, children: s, className: n }, r) => {
   const {
@@ -1606,7 +1607,7 @@ const xs = [
             {
               onSelect: () => x(t, "INTERNAL"),
               children: [
-                /* @__PURE__ */ e(Ve, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
+                /* @__PURE__ */ e(Ue, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
                 "Internal only"
               ]
             }
@@ -1670,9 +1671,9 @@ const ct = P.forwardRef(
       {
         ref: w,
         className: N(
-          "flex h-full flex-shrink-0 flex-col rounded-ds-xl bg-surface-2 border border-surface-3 hover:border-surface-border transition-colors p-1",
-          r && "shadow-04",
-          C && "bg-error-3",
+          "flex h-full flex-shrink-0 flex-col rounded-ds-xl bg-surface-sunken border border-surface-border-subtle hover:border-surface-border transition-colors p-1",
+          r && "shadow-overlay",
+          C && "bg-error-3 border-error-7",
           u
         ),
         ...I,
@@ -1689,7 +1690,7 @@ const ct = P.forwardRef(
               transition: ae.snappy,
               className: "no-scrollbar flex flex-1 flex-col gap-ds-02 overflow-y-auto px-ds-03 pt-2.5 pb-ds-03",
               children: [
-                /* @__PURE__ */ a(Ue, { items: d, strategy: yt, children: [
+                /* @__PURE__ */ a(ze, { items: d, strategy: yt, children: [
                   /* @__PURE__ */ e(le, { className: "contents", children: s.tasks.map((D, l) => /* @__PURE__ */ a(P.Fragment, { children: [
                     /* @__PURE__ */ e(ie, { children: c && c.index === l && /* @__PURE__ */ e(Re, {}) }),
                     /* @__PURE__ */ e(Q, { children: /* @__PURE__ */ e(lt, { taskId: D.id, children: p === "compact" ? /* @__PURE__ */ e(rt, { task: D }) : /* @__PURE__ */ e(at, { task: D }) }) })
@@ -1960,7 +1961,7 @@ function ys({ className: t }) {
             className: "no-scrollbar flex h-full gap-ds-05 overflow-x-auto pb-ds-05 outline-none",
             children: [
               /* @__PURE__ */ e(
-                Ue,
+                ze,
                 {
                   items: D,
                   strategy: It,
@@ -1987,7 +1988,7 @@ function ys({ className: t }) {
                 {
                   variant: "ghost",
                   onClick: u,
-                  className: "h-ds-md w-[320px] justify-start gap-ds-03 rounded-ds-xl border border-dashed border-surface-border bg-surface-2 text-surface-fg-subtle hover:border-accent-7 hover:bg-accent-2 hover:text-accent-11",
+                  className: "h-ds-md w-[320px] justify-start gap-ds-03 rounded-ds-xl border border-dashed border-surface-border bg-surface-raised text-surface-fg-subtle hover:border-accent-7 hover:bg-accent-2 hover:text-accent-11",
                   children: [
                     /* @__PURE__ */ e(Me, { className: "h-ico-sm w-ico-sm" }),
                     "Add column"
@@ -2028,7 +2029,7 @@ export {
   ss as d,
   Ze as e,
   Je as f,
-  Us as g,
+  Vs as g,
   rt as h,
   it as i,
   ot as j,

package/dist/_chunks/markdown-components.js

@@ -1,26 +1,26 @@
 "use client";
-import { jsx as e } from "react/jsx-runtime";
-const l = {
-  p: ({ children: s }) => /* @__PURE__ */ e("p", { className: "mb-ds-03 last:mb-0", children: s }),
+import { jsx as s } from "react/jsx-runtime";
+const a = {
+  p: ({ children: e }) => /* @__PURE__ */ s("p", { className: "mb-ds-03 last:mb-0", children: e }),
   code: ({
-    children: s,
+    children: e,
     className: t
-  }) => (t == null ? void 0 : t.includes("language-")) ? /* @__PURE__ */ e("code", { className: t, children: s }) : /* @__PURE__ */ e("code", { className: "rounded bg-surface-3 px-ds-02 py-ds-01 text-ds-md", children: s }),
-  pre: ({ children: s }) => /* @__PURE__ */ e("pre", { className: "mb-ds-03 overflow-x-auto rounded-ds-lg bg-surface-3 p-ds-04 text-ds-md", children: s }),
-  ul: ({ children: s }) => /* @__PURE__ */ e("ul", { className: "mb-ds-03 list-disc pl-ds-05", children: s }),
-  ol: ({ children: s }) => /* @__PURE__ */ e("ol", { className: "mb-ds-03 list-decimal pl-ds-05", children: s }),
-  li: ({ children: s }) => /* @__PURE__ */ e("li", { className: "mb-ds-02", children: s }),
-  strong: ({ children: s }) => /* @__PURE__ */ e("strong", { className: "font-semibold", children: s }),
+  }) => (t == null ? void 0 : t.includes("language-")) ? /* @__PURE__ */ s("code", { className: t, children: e }) : /* @__PURE__ */ s("code", { className: "rounded bg-surface-raised-hover px-ds-02 py-ds-01 text-ds-md", children: e }),
+  pre: ({ children: e }) => /* @__PURE__ */ s("pre", { className: "mb-ds-03 overflow-x-auto rounded-ds-lg bg-surface-raised-hover p-ds-04 text-ds-md", children: e }),
+  ul: ({ children: e }) => /* @__PURE__ */ s("ul", { className: "mb-ds-03 list-disc pl-ds-05", children: e }),
+  ol: ({ children: e }) => /* @__PURE__ */ s("ol", { className: "mb-ds-03 list-decimal pl-ds-05", children: e }),
+  li: ({ children: e }) => /* @__PURE__ */ s("li", { className: "mb-ds-02", children: e }),
+  strong: ({ children: e }) => /* @__PURE__ */ s("strong", { className: "font-semibold", children: e }),
   a: ({
-    href: s,
+    href: e,
     children: t,
     ...o
   }) => {
-    const d = s && /^(https?:\/\/|mailto:)/i.test(s) ? s : "#";
-    return /* @__PURE__ */ e(
+    const r = e && /^(https?:\/\/|mailto:)/i.test(e) ? e : "#";
+    return /* @__PURE__ */ s(
       "a",
       {
-        href: d,
+        href: r,
         target: "_blank",
         rel: "noopener noreferrer",
         className: "text-accent-11 underline hover:text-accent-12",
@@ -31,5 +31,5 @@ const l = {
   }
 };
 export {
-  l as m
+  a as m
 };