@devalok/shilp-sutra-karm 0.2.1 → 0.3.1

package/README.md

@@ -0,0 +1,65 @@
+# @devalok/shilp-sutra-karm
+
+Domain components for project management -- board, tasks, chat, dashboard, client portal, and admin.
+
+[![npm](https://img.shields.io/npm/v/@devalok/shilp-sutra-karm)](https://www.npmjs.com/package/@devalok/shilp-sutra-karm)
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
+
+---
+
+## Install
+
+```bash
+pnpm add @devalok/shilp-sutra-karm @devalok/shilp-sutra
+```
+
+**Note:** `@devalok/shilp-sutra >=0.3.0` is a required peer dependency.
+
+## Peer Dependencies
+
+| Package | Version | Required |
+|---------|---------|----------|
+| `@devalok/shilp-sutra` | `>=0.3.0` | Yes |
+| `react` | `^18 \|\| ^19` | Yes |
+| `react-dom` | `^18 \|\| ^19` | Yes |
+
+## Usage
+
+All Karm components are **client-only** (`"use client"` directives included).
+
+```tsx
+import { KanbanBoard } from '@devalok/shilp-sutra-karm/board'
+import { TaskDetailPanel } from '@devalok/shilp-sutra-karm/tasks'
+import { ChatPanel } from '@devalok/shilp-sutra-karm/chat'
+import { AttendanceCTA, DailyBrief } from '@devalok/shilp-sutra-karm/dashboard'
+import { ClientHeader, ProjectCard } from '@devalok/shilp-sutra-karm/client'
+import { AdminDashboard, BreakAdmin } from '@devalok/shilp-sutra-karm/admin'
+```
+
+## Sub-path Exports
+
+| Import path | Contents |
+|-------------|----------|
+| `@devalok/shilp-sutra-karm` | All domain components |
+| `@devalok/shilp-sutra-karm/board` | Kanban board with drag-and-drop |
+| `@devalok/shilp-sutra-karm/tasks` | Task detail panel, properties, tabs |
+| `@devalok/shilp-sutra-karm/chat` | AI chat panel, message list, streaming |
+| `@devalok/shilp-sutra-karm/dashboard` | Attendance CTA, daily brief |
+| `@devalok/shilp-sutra-karm/client` | Client portal (accent provider, header, project card) |
+| `@devalok/shilp-sutra-karm/admin` | Admin dashboard, break management, adjustments |
+
+## Tailwind Content
+
+Add Karm's dist to your Tailwind content array:
+
+```ts
+// tailwind.config.ts
+content: [
+  // ...your app files
+  './node_modules/@devalok/shilp-sutra-karm/dist/**/*.js',
+],
+```
+
+## License
+
+MIT -- Copyright 2026 Devalok Design & Strategy Studios

package/dist/admin/adjustments/approved-adjustments.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as e, jsxs as s } from "react/jsx-runtime";
 import * as p from "react";
 import { formatDate as c } from "../utils/date-utils.js";

package/dist/admin/break/break-admin-skeleton.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsxs as d, jsx as e } from "react/jsx-runtime";
 import * as r from "react";
 import { Skeleton as s } from "@devalok/shilp-sutra/ui";

package/dist/admin/break/break-admin.js

@@ -1,8 +1,9 @@
+"use client";
 import { jsxs as d, Fragment as q, jsx as e } from "react/jsx-runtime";
 import * as B from "react";
 import { useState as N, useMemo as re, useCallback as F, createContext as ie, useContext as ce } from "react";
 import { cn as p } from "@devalok/shilp-sutra/ui";
-import { useToast as le } from "@devalok/shilp-sutra/ui";
+import { useToast as le } from "@devalok/shilp-sutra/hooks";
 import { BreakBalance as de } from "./break-balance.js";
 import { LeaveRequest as me } from "./leave-request.js";
 import { Breaks as ue } from "./breaks.js";
@@ -19,11 +20,11 @@ function w() {
 }
 const L = B.forwardRef(
   function({
-    currentUser: s,
+    currentUser: n,
     breaks: i,
     pendingRequests: t,
     cashoutRequests: o = [],
-    breakBalanceData: n,
+    breakBalanceData: s,
     breakBalance: c,
     userImages: l,
     users: u,
@@ -31,7 +32,7 @@ const L = B.forwardRef(
     isLoadingBreaks: g = !1,
     isLoadingRequests: y = !1,
     isLoadingBalance: O = !1,
-    existingBreaks: v,
+    existingBreaks: C,
     filters: f,
     onFilterChange: R,
     onApproveRequest: P,
@@ -46,9 +47,9 @@ const L = B.forwardRef(
     realtimeCallbacks: he,
     children: ae
   }, oe) {
-    const [U, V] = N("breaks"), [b, C] = N(!1), [G, E] = N(
+    const [U, V] = N("breaks"), [b, v] = N(!1), [G, E] = N(
       null
-    ), [J, T] = N(null), { toast: h } = le(), ne = re(
+    ), [J, T] = N(null), { toast: h } = le(), se = re(
       () => ({
         selectedAssociate: null,
         dateFilterStart: null,
@@ -58,7 +59,7 @@ const L = B.forwardRef(
         isOpen: !1
       }),
       []
-    ), W = f || ne, X = F(
+    ), W = f || se, X = F(
       (a) => {
         R && R(a);
       },
@@ -71,7 +72,7 @@ const L = B.forwardRef(
             return;
           }
           try {
-            C(!0);
+            v(!0);
             const r = t.find((K) => K.id === x);
             if (!r)
               throw new Error("Request not found");
@@ -83,17 +84,17 @@ const L = B.forwardRef(
                 ] }),
                 /* @__PURE__ */ e("span", { className: "text-success-text", children: "approved successfully" })
               ] }),
-              variant: "default",
+              color: "default",
               style: { marginBottom: "var(--spacing-04)", border: "none" }
             });
           } catch (r) {
             console.error("Error approving request:", r), h({
               title: "Error",
               description: r instanceof Error ? r.message : "Failed to approve request",
-              variant: "error"
+              color: "error"
             });
           } finally {
-            C(!1);
+            v(!1);
           }
         }
       },
@@ -106,7 +107,7 @@ const L = B.forwardRef(
             return;
           }
           try {
-            C(!0);
+            v(!0);
             const r = t.find((K) => K.id === x);
             if (!r)
               throw new Error("Request not found");
@@ -118,35 +119,35 @@ const L = B.forwardRef(
                 ] }),
                 /* @__PURE__ */ e("span", { className: "text-error-text", children: "rejected" })
               ] }),
-              variant: "default",
+              color: "default",
               style: { marginBottom: "var(--spacing-04)", border: "none" }
             });
           } catch (r) {
             console.error("Error rejecting request:", r), h({
               title: "Error",
               description: r instanceof Error ? r.message : "Failed to reject request",
-              variant: "error"
+              color: "error"
             });
           } finally {
-            C(!1);
+            v(!1);
           }
         }
       },
       [b, t, j, h]
-    ), se = re(
+    ), ne = re(
       () => ({
-        currentUser: s,
+        currentUser: n,
         activeTab: U,
         setActiveTab: V,
         isProcessing: b,
         breaks: i,
         pendingRequests: t,
         cashoutRequests: o,
-        breakBalanceData: n,
+        breakBalanceData: s,
         breakBalance: c,
         userImages: l,
         users: u,
-        existingBreaks: v,
+        existingBreaks: C,
         filters: W,
         handleFilterChange: X,
         handleApproveRequest: Z,
@@ -162,18 +163,18 @@ const L = B.forwardRef(
         onFetchMonthBreaks: Q
       }),
       [
-        s,
+        n,
         U,
         V,
         b,
         i,
         t,
         o,
-        n,
+        s,
         c,
         l,
         u,
-        v,
+        C,
         W,
         X,
         Z,
@@ -189,7 +190,7 @@ const L = B.forwardRef(
         Q
       ]
     );
-    return k ? /* @__PURE__ */ e(pe, {}) : /* @__PURE__ */ e(te.Provider, { value: se, children: /* @__PURE__ */ e(
+    return k ? /* @__PURE__ */ e(pe, {}) : /* @__PURE__ */ e(te.Provider, { value: ne, children: /* @__PURE__ */ e(
       "div",
       {
         ref: oe,
@@ -210,19 +211,19 @@ const L = B.forwardRef(
   }
 );
 L.displayName = "BreakAdmin";
-const S = B.forwardRef(function({ className: s, ...i }, t) {
+const S = B.forwardRef(function({ className: n, ...i }, t) {
   const {
     filters: o,
-    handleFilterChange: n,
+    handleFilterChange: s,
     breakBalance: c,
     userImages: l,
     users: u
   } = w();
-  return /* @__PURE__ */ e("div", { ref: t, className: p(s), ...i, children: /* @__PURE__ */ e(
+  return /* @__PURE__ */ e("div", { ref: t, className: p(n), ...i, children: /* @__PURE__ */ e(
     fe,
     {
       filters: o,
-      onFilterChange: n,
+      onFilterChange: s,
       breakBalance: c,
       userImages: l,
       users: u
@@ -230,15 +231,15 @@ const S = B.forwardRef(function({ className: s, ...i }, t) {
   ) });
 });
 S.displayName = "BreakAdmin.Header";
-const M = B.forwardRef(function({ className: s, ...i }, t) {
-  const { activeTab: o, setActiveTab: n, pendingRequests: c, breakBalanceData: l } = w();
+const M = B.forwardRef(function({ className: n, ...i }, t) {
+  const { activeTab: o, setActiveTab: s, pendingRequests: c, breakBalanceData: l } = w();
   return /* @__PURE__ */ d(
     "div",
     {
       ref: t,
       className: p(
         "flex w-full gap-ds-03 border-b-[1px] border-border px-ds-06 pt-ds-03 max-lg:min-w-[800px]",
-        s
+        n
       ),
       ...i,
       children: [
@@ -246,7 +247,7 @@ const M = B.forwardRef(function({ className: s, ...i }, t) {
           "button",
           {
             className: p("text-ds-sm font-semibold uppercase tracking-wider mb-[-1px] px-ds-03 py-ds-04", o === "breaks" ? "text-text-primary border-b-[1px] border-interactive-hover" : "text-text-tertiary"),
-            onClick: () => n("breaks"),
+            onClick: () => s("breaks"),
             children: "BREAKS"
           }
         ),
@@ -254,7 +255,7 @@ const M = B.forwardRef(function({ className: s, ...i }, t) {
           "button",
           {
             className: p("text-ds-sm font-semibold uppercase tracking-wider mb-[-1px] flex items-center gap-ds-02 px-ds-03 py-ds-04", o === "requests" ? "border-b-[1px] border-interactive-hover text-text-primary" : "text-text-tertiary"),
-            onClick: () => n("requests"),
+            onClick: () => s("requests"),
             children: [
               "REQUESTS",
               " ",
@@ -266,7 +267,7 @@ const M = B.forwardRef(function({ className: s, ...i }, t) {
           "button",
           {
             className: p("text-ds-sm font-semibold uppercase tracking-wider mb-[-1px] flex items-center gap-ds-02 px-ds-03 py-ds-04", o === "balance" ? "border-b-[1px] border-interactive-hover text-text-primary" : "text-text-tertiary"),
-            onClick: () => n("balance"),
+            onClick: () => s("balance"),
             children: [
               "BALANCE",
               " ",
@@ -279,10 +280,10 @@ const M = B.forwardRef(function({ className: s, ...i }, t) {
   );
 });
 M.displayName = "BreakAdmin.TabBar";
-const _ = B.forwardRef(function({ className: s, ...i }, t) {
+const _ = B.forwardRef(function({ className: n, ...i }, t) {
   const {
     activeTab: o,
-    breaks: n,
+    breaks: s,
     userImages: c,
     existingBreaks: l,
     onFetchMonthBreaks: u,
@@ -290,10 +291,10 @@ const _ = B.forwardRef(function({ className: s, ...i }, t) {
     onDeleteBreak: g,
     onRefresh: y
   } = w();
-  return o !== "breaks" ? null : /* @__PURE__ */ e("div", { ref: t, className: p(s), ...i, children: /* @__PURE__ */ e(
+  return o !== "breaks" ? null : /* @__PURE__ */ e("div", { ref: t, className: p(n), ...i, children: /* @__PURE__ */ e(
     ue,
     {
-      breaks: n,
+      breaks: s,
       userImages: c,
       existingBreaks: l,
       onFetchMonthBreaks: u,
@@ -304,10 +305,10 @@ const _ = B.forwardRef(function({ className: s, ...i }, t) {
   ) });
 });
 _.displayName = "BreakAdmin.BreaksPanel";
-const D = B.forwardRef(function({ className: s, ...i }, t) {
+const D = B.forwardRef(function({ className: n, ...i }, t) {
   const {
     activeTab: o,
-    currentUser: n,
+    currentUser: s,
     pendingRequests: c,
     userImages: l,
     handleApproveRequest: u,
@@ -315,7 +316,7 @@ const D = B.forwardRef(function({ className: s, ...i }, t) {
     acceptedCommentBox: g,
     rejectedCommentBox: y,
     setAcceptedCommentBox: O,
-    setRejectedCommentBox: v
+    setRejectedCommentBox: C
   } = w();
   return o !== "requests" ? null : /* @__PURE__ */ e(
     "div",
@@ -324,7 +325,7 @@ const D = B.forwardRef(function({ className: s, ...i }, t) {
       className: p(
         /* intentional: h-[400px] is the fixed panel height for break tab content areas; mobile uses dvh for browser chrome */
         "no-scrollbar flex h-[400px] flex-col gap-ds-02 overflow-y-auto border-t border-t-border px-ds-06 pb-ds-02 pt-ds-02 max-md:h-[calc(100dvh-317px)] max-md:border-0",
-        s
+        n
       ),
       ...i,
       children: c.map((f) => /* @__PURE__ */ e(
@@ -336,10 +337,10 @@ const D = B.forwardRef(function({ className: s, ...i }, t) {
           handleApproveRequest: u,
           commentBoxOpen: g === f.id || y === f.id,
           onCommentBoxClose: () => {
-            O(null), v(null);
+            O(null), C(null);
           },
           clickedAction: g === f.id ? "approve" : y === f.id ? "reject" : null,
-          userId: n.id
+          userId: s.id
         },
         f.id
       ))
@@ -347,12 +348,12 @@ const D = B.forwardRef(function({ className: s, ...i }, t) {
   );
 });
 D.displayName = "BreakAdmin.RequestsPanel";
-const H = B.forwardRef(function({ className: s, ...i }, t) {
-  const { activeTab: o, breakBalanceData: n, userImages: c, onSaveBalance: l } = w();
-  return o !== "balance" ? null : /* @__PURE__ */ e("div", { ref: t, className: p(s), ...i, children: /* @__PURE__ */ e(
+const H = B.forwardRef(function({ className: n, ...i }, t) {
+  const { activeTab: o, breakBalanceData: s, userImages: c, onSaveBalance: l } = w();
+  return o !== "balance" ? null : /* @__PURE__ */ e("div", { ref: t, className: p(n), ...i, children: /* @__PURE__ */ e(
     de,
     {
-      breakBalanceData: n,
+      breakBalanceData: s,
       userImages: c,
       onSaveBalance: l
     }

package/dist/admin/break/break-balance.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import * as p from "react";
 import { Avatar as o, AvatarImage as f, AvatarFallback as u } from "@devalok/shilp-sutra/ui";

package/dist/admin/break/breaks.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsxs as t, jsx as e, Fragment as N } from "react/jsx-runtime";
 import * as g from "react";
 import { Popover as D, PopoverTrigger as j, PopoverContent as T } from "@devalok/shilp-sutra/ui";

package/dist/admin/break/delete-break.js

@@ -1,15 +1,16 @@
+"use client";
 import { jsxs as r, jsx as t } from "react/jsx-runtime";
 import * as u from "react";
 import { useState as d, useRef as p } from "react";
-import { useToast as x } from "@devalok/shilp-sutra/ui";
+import { useToast as x } from "@devalok/shilp-sutra/hooks";
 import { Dialog as h, DialogTrigger as g, DialogContent as b } from "@devalok/shilp-sutra/ui";
 import { Button as D } from "@devalok/shilp-sutra/ui";
 import { IconButton as k } from "@devalok/shilp-sutra/ui";
-import { IconTrash as y } from "@tabler/icons-react";
-const w = u.forwardRef(function({ id: N, userId: B, onDelete: a }, I) {
-  const [c, l] = d(!1), { toast: s } = x(), [m, o] = d(!1), i = p(null);
+import { IconTrash as w } from "@tabler/icons-react";
+const y = u.forwardRef(function({ id: B, userId: v, onDelete: l }, I) {
+  const [c, s] = d(!1), { toast: a } = x(), [m, o] = d(!1), i = p(null);
   return /* @__PURE__ */ r(h, { open: m, onOpenChange: o, children: [
-    /* @__PURE__ */ t(g, { asChild: !0, children: /* @__PURE__ */ t(k, { icon: /* @__PURE__ */ t(y, {}), size: "md", "aria-label": "Delete break" }) }),
+    /* @__PURE__ */ t(g, { asChild: !0, children: /* @__PURE__ */ t(k, { icon: /* @__PURE__ */ t(w, {}), size: "md", "aria-label": "Delete break" }) }),
     /* @__PURE__ */ r(b, { className: "flex w-[335px] flex-col items-center gap-ds-06 p-ds-06 max-md:w-[90%] max-md:rounded-ds-lg", children: [
       /* @__PURE__ */ r("div", { className: "flex w-full max-w-[240px] flex-col items-center gap-ds-04 text-center", children: [
         /* @__PURE__ */ t("p", { className: "text-ds-lg font-semibold text-center text-text-primary", children: "Delete this break?" }),
@@ -17,26 +18,26 @@ const w = u.forwardRef(function({ id: N, userId: B, onDelete: a }, I) {
       ] }),
       /* @__PURE__ */ t("form", { ref: i, onSubmit: async (e) => {
         var n;
-        e.preventDefault(), (n = e.stopPropagation) == null || n.call(e), l(!0);
+        e.preventDefault(), (n = e.stopPropagation) == null || n.call(e), s(!0);
         try {
-          a && a(), s({
+          l && l(), a({
             description: "Break request deleted successfully",
-            variant: "default"
+            color: "default"
           }), o(!1);
         } catch (f) {
-          console.error("Error deleting break request:", f), s({
+          console.error("Error deleting break request:", f), a({
             title: "Error",
             description: "Failed to delete break request",
-            variant: "error"
+            color: "error"
           });
         } finally {
-          l(!1);
+          s(!1);
         }
       }, className: "w-full", children: /* @__PURE__ */ t(
         D,
         {
           className: "w-full",
-          variant: "primary",
+          variant: "solid",
           onClick: () => {
             var e;
             return (e = i.current) == null ? void 0 : e.requestSubmit();
@@ -48,7 +49,7 @@ const w = u.forwardRef(function({ id: N, userId: B, onDelete: a }, I) {
     ] })
   ] });
 });
-w.displayName = "DeleteBreak";
+y.displayName = "DeleteBreak";
 export {
-  w as DeleteBreak
+  y as DeleteBreak
 };

package/dist/admin/break/edit-break-balance.js

@@ -1,43 +1,44 @@
+"use client";
 import { jsxs as a, jsx as t } from "react/jsx-runtime";
 import * as y from "react";
-import { useState as n, useRef as w, useEffect as g } from "react";
-import { useToast as N } from "@devalok/shilp-sutra/ui";
+import { useState as o, useRef as w, useEffect as g } from "react";
+import { useToast as N } from "@devalok/shilp-sutra/hooks";
 import { Dialog as k, DialogTrigger as D, DialogContent as B, DialogHeader as C, DialogDescription as E } from "@devalok/shilp-sutra/ui";
 import { Button as p } from "@devalok/shilp-sutra/ui";
 import { NumberInput as j } from "@devalok/shilp-sutra/ui";
 import { IconPencil as F } from "@tabler/icons-react";
 const I = y.forwardRef(function({
   selectedLeave: r,
-  onSave: s
+  onSave: n
 }, R) {
   var e;
-  const [o, l] = n(!1), [c, d] = n(
+  const [s, l] = o(!1), [c, u] = o(
     typeof (r == null ? void 0 : r.cashout) == "number" ? r.cashout : 0
-  ), [m, h] = n(
+  ), [d, h] = o(
     (r == null ? void 0 : r.carryForward) || 0
-  ), u = w(null), { toast: f } = N();
+  ), m = w(null), { toast: f } = N();
   g(() => {
-    d(
+    u(
       typeof (r == null ? void 0 : r.cashout) == "number" ? r.cashout : 0
     ), h((r == null ? void 0 : r.carryForward) || 0);
   }, [r]);
   const b = async (i) => {
     i.preventDefault(), l(!0);
     try {
-      s && s({
+      n && n({
         userId: r.userId,
         cashOutDays: c,
-        carryForward: m,
+        carryForward: d,
         year: (/* @__PURE__ */ new Date()).getFullYear()
       }), f({
         description: "Break balance updated successfully",
-        variant: "default"
+        color: "default"
       });
     } catch (x) {
       console.error("Error updating break balance:", x), f({
         title: "Error",
         description: "Failed to update break balance",
-        variant: "error"
+        color: "error"
       });
     } finally {
       l(!1);
@@ -47,7 +48,7 @@ const I = y.forwardRef(function({
     /* @__PURE__ */ t(D, { asChild: !0, children: /* @__PURE__ */ a(
       p,
       {
-        variant: "secondary",
+        variant: "outline",
         className: "text-ds-base border-border bg-layer-01 px-ds-05 py-ds-04 pr-ds-06 text-text-secondary shadow-02",
         children: [
           /* @__PURE__ */ t(F, {}),
@@ -64,7 +65,7 @@ const I = y.forwardRef(function({
       /* @__PURE__ */ a(
         "form",
         {
-          ref: u,
+          ref: m,
           onSubmit: b,
           id: "updatebreakbalanceform",
           className: "flex w-full flex-col gap-ds-05",
@@ -75,28 +76,28 @@ const I = y.forwardRef(function({
                 j,
                 {
                   value: c,
-                  onChange: d,
+                  onValueChange: u,
                   min: 0,
                   max: 100,
                   step: 1,
-                  disabled: o
+                  disabled: s
                 }
               )
             ] }),
             /* @__PURE__ */ a("div", { className: "flex w-full items-center justify-between", children: [
               /* @__PURE__ */ t("div", { className: "text-ds-sm font-semibold uppercase tracking-wider  text-text-placeholder", children: "Carry forward" }),
-              /* @__PURE__ */ t("div", { className: "flex w-[100px] items-center justify-center", children: /* @__PURE__ */ t("div", { className: "text-ds-base font-semibold text-text-secondary", children: m }) })
+              /* @__PURE__ */ t("div", { className: "flex w-[100px] items-center justify-center", children: /* @__PURE__ */ t("div", { className: "text-ds-base font-semibold text-text-secondary", children: d }) })
             ] }),
             /* @__PURE__ */ t(
               p,
               {
-                variant: "secondary",
+                variant: "outline",
                 fullWidth: !0,
                 onClick: () => {
                   var i;
-                  return (i = u.current) == null ? void 0 : i.requestSubmit();
+                  return (i = m.current) == null ? void 0 : i.requestSubmit();
                 },
-                disabled: o,
+                disabled: s,
                 children: "Update"
               }
             )