@devalok/shilp-sutra-karm 0.16.0 → 0.17.0

package/dist/_chunks/project-card.js

@@ -1,60 +1,60 @@
 "use client";
-import * as p from "react";
-import { useEffect as x } from "react";
+import * as f from "react";
+import { useEffect as h } from "react";
 import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import { cn as f } from "@devalok/shilp-sutra/ui/lib/utils";
-import { Avatar as b, AvatarImage as u, AvatarFallback as y } from "@devalok/shilp-sutra/ui/avatar";
+import { cn as p } from "@devalok/shilp-sutra/ui/lib/utils";
+import { Avatar as b, AvatarImage as x, AvatarFallback as g } from "@devalok/shilp-sutra/ui/avatar";
 import { Badge as v } from "@devalok/shilp-sutra/ui/badge";
-import { Progress as N } from "@devalok/shilp-sutra/ui/progress";
-function g({ accentCss: d }) {
-  return x(() => {
-    if (!d) return;
-    const a = document.documentElement, o = d.split(";").map((e) => e.trim()).filter(Boolean), r = [];
-    for (const e of o) {
-      const i = e.indexOf(":");
-      if (i === -1) continue;
-      const l = e.slice(0, i).trim(), n = e.slice(i + 1).trim();
-      l && n && (a.style.setProperty(l, n), r.push(l));
+import { Progress as y } from "@devalok/shilp-sutra/ui/progress";
+function N({ accentCss: c }) {
+  return h(() => {
+    if (!c) return;
+    const a = document.documentElement, i = c.split(";").map((e) => e.trim()).filter(Boolean), r = [];
+    for (const e of i) {
+      const d = e.indexOf(":");
+      if (d === -1) continue;
+      const n = e.slice(0, d).trim(), o = e.slice(d + 1).trim();
+      n && o && (a.style.setProperty(n, o), r.push(n));
     }
     return () => {
       for (const e of r)
         a.style.removeProperty(e);
     };
-  }, [d]), null;
+  }, [c]), null;
 }
-g.displayName = "AccentProvider";
-const j = p.forwardRef(
-  ({ className: d, orgName: a, orgLogo: o, userName: r, userAvatar: e, children: i, ...l }, n) => {
-    const c = a.split(" ").map((m) => m[0]).join("").slice(0, 2).toUpperCase(), h = r.split(" ").map((m) => m[0]).join("").slice(0, 2).toUpperCase();
+N.displayName = "AccentProvider";
+const j = f.forwardRef(
+  ({ className: c, orgName: a, orgLogo: i, userName: r, userAvatar: e, children: d, ...n }, o) => {
+    const l = a.split(" ").map((m) => m[0]).join("").slice(0, 2).toUpperCase(), u = r.split(" ").map((m) => m[0]).join("").slice(0, 2).toUpperCase();
     return /* @__PURE__ */ s(
       "header",
       {
-        ref: n,
-        className: f(
-          "flex h-ds-lg items-center justify-between border-b border-border-subtle bg-layer-01 px-ds-06",
-          d
+        ref: o,
+        className: p(
+          "flex h-ds-lg items-center justify-between border-b border-surface-border bg-surface-1 px-ds-06",
+          c
         ),
-        ...l,
+        ...n,
         children: [
           /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-04", children: [
-            o ? /* @__PURE__ */ t(
+            i ? /* @__PURE__ */ t(
               "img",
               {
-                src: o,
+                src: i,
                 alt: a,
                 className: "h-ds-sm w-ds-sm rounded-ds-md object-cover"
               }
-            ) : /* @__PURE__ */ t("div", { className: "flex h-ds-sm w-ds-sm items-center justify-center rounded-ds-md bg-interactive text-ds-sm font-semibold text-text-on-color", children: c }),
-            /* @__PURE__ */ t("span", { className: "font-display text-ds-base font-semibold text-text-primary", children: a })
+            ) : /* @__PURE__ */ t("div", { className: "flex h-ds-sm w-ds-sm items-center justify-center rounded-ds-md bg-accent-9 text-ds-sm font-semibold text-accent-fg", children: l }),
+            /* @__PURE__ */ t("span", { className: "font-display text-ds-base font-semibold text-surface-fg", children: a })
           ] }),
           /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-04", children: [
-            i,
+            d,
             /* @__PURE__ */ s("div", { className: "flex items-center gap-ds-03", children: [
               /* @__PURE__ */ s(b, { className: "h-ds-sm w-ds-sm", children: [
-                e && /* @__PURE__ */ t(u, { src: e, alt: r }),
-                /* @__PURE__ */ t(y, { className: "bg-interactive-subtle text-ds-sm font-medium text-interactive", children: h })
+                e && /* @__PURE__ */ t(x, { src: e, alt: r }),
+                /* @__PURE__ */ t(g, { className: "bg-accent-2 text-ds-sm font-medium text-accent-11", children: u })
               ] }),
-              /* @__PURE__ */ t("span", { className: "hidden text-ds-md font-medium text-text-primary sm:inline", children: r })
+              /* @__PURE__ */ t("span", { className: "hidden text-ds-md font-medium text-surface-fg sm:inline", children: r })
             ] })
           ] })
         ]
@@ -67,46 +67,46 @@ const w = {
   active: "success",
   completed: "info",
   paused: "warning"
-}, P = p.forwardRef(
+}, P = f.forwardRef(
   ({
-    className: d,
+    className: c,
     name: a,
-    description: o,
+    description: i,
     status: r,
     taskCount: e = 0,
-    completedTasks: i = 0,
-    ...l
-  }, n) => {
-    const c = e > 0 ? Math.round(i / e * 100) : 0;
+    completedTasks: d = 0,
+    ...n
+  }, o) => {
+    const l = e > 0 ? Math.round(d / e * 100) : 0;
     return /* @__PURE__ */ s(
       "div",
       {
-        ref: n,
-        className: f(
-          "group cursor-pointer rounded-ds-lg border border-border-subtle bg-layer-01 p-ds-05b shadow-01 transition-shadow duration-moderate-02 hover:shadow-02",
-          d
+        ref: o,
+        className: p(
+          "group cursor-pointer rounded-ds-lg border border-surface-border bg-surface-1 p-ds-05b shadow-01 transition-shadow duration-200 hover:shadow-02",
+          c
         ),
-        ...l,
+        ...n,
         children: [
           /* @__PURE__ */ s("div", { className: "mb-ds-04 flex items-start justify-between", children: [
-            /* @__PURE__ */ t("h3", { className: "font-display text-ds-base font-semibold text-text-primary", children: a }),
+            /* @__PURE__ */ t("h3", { className: "font-display text-ds-base font-semibold text-surface-fg", children: a }),
             /* @__PURE__ */ t(v, { color: w[r], size: "sm", children: r })
           ] }),
-          o && /* @__PURE__ */ t("p", { className: "mb-ds-05 line-clamp-2 text-ds-md text-text-secondary", children: o }),
+          i && /* @__PURE__ */ t("p", { className: "mb-ds-05 line-clamp-2 text-ds-md text-surface-fg-muted", children: i }),
           /* @__PURE__ */ s("div", { className: "space-y-ds-03", children: [
-            /* @__PURE__ */ s("div", { className: "flex items-center justify-between text-ds-sm text-text-helper", children: [
+            /* @__PURE__ */ s("div", { className: "flex items-center justify-between text-ds-sm text-surface-fg-subtle", children: [
               /* @__PURE__ */ s("span", { children: [
-                i,
+                d,
                 " / ",
                 e,
                 " tasks"
               ] }),
               /* @__PURE__ */ s("span", { children: [
-                c,
+                l,
                 "%"
               ] })
             ] }),
-            /* @__PURE__ */ t(N, { value: c, className: "h-ds-02b", "aria-label": "Project progress" })
+            /* @__PURE__ */ t(y, { value: l, className: "h-ds-02b", "aria-label": "Project progress" })
           ] })
         ]
       }
@@ -115,7 +115,7 @@ const w = {
 );
 P.displayName = "ProjectCard";
 export {
-  g as A,
+  N as A,
   j as C,
   P
 };