@devalok/shilp-sutra 0.33.2 → 0.34.1

package/dist/composed/activity-feed.js

@@ -1,209 +1,239 @@
 "use client";
-import { jsx as t, jsxs as r } from "react/jsx-runtime";
-import * as D from "react";
-import { cn as a } from "../ui/lib/utils.js";
-import { IconChevronRight as W } from "@tabler/icons-react";
-import { Icon as j } from "../ui/icon.js";
-import { Avatar as z, AvatarImage as R, AvatarFallback as L } from "../ui/avatar.js";
-import { Button as E } from "../ui/button.js";
-import { Skeleton as N } from "../ui/skeleton.js";
-import { getInitials as B } from "./lib/string-utils.js";
-import { formatRelativeTime as G } from "../ui/lib/date-utils.js";
-import { tweens as T } from "../ui/lib/motion.js";
-import { m as A } from "../_chunks/framer.js";
-const O = {
-  default: "bg-surface-fg-subtle",
-  success: "bg-success-9",
-  warning: "bg-warning-9",
-  error: "bg-error-9",
-  info: "bg-info-9"
-}, I = {
-  today: "Today",
-  yesterday: "Yesterday",
-  thisWeek: "This Week",
-  older: "Older"
+import { a as e } from "../_chunks/framer.js";
+import { tweens as t } from "../ui/lib/motion.js";
+import { cn as n } from "../ui/lib/utils.js";
+import { Icon as r } from "../ui/icon.js";
+import { Avatar as i, AvatarFallback as a, AvatarImage as o } from "../ui/avatar.js";
+import { Button as s } from "../ui/button.js";
+import { Skeleton as c } from "../ui/skeleton.js";
+import { formatRelativeTime as l } from "../ui/lib/date-utils.js";
+import { getInitials as u } from "./lib/string-utils.js";
+import * as d from "react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { IconChevronRight as m } from "@tabler/icons-react";
+//#region src/composed/activity-feed.tsx
+var h = {
+	default: "bg-surface-fg-subtle",
+	success: "bg-success-9",
+	warning: "bg-warning-9",
+	error: "bg-error-9",
+	info: "bg-info-9"
+}, g = {
+	today: "Today",
+	yesterday: "Yesterday",
+	thisWeek: "This Week",
+	older: "Older"
 };
-function Y(e, s) {
-  const l = { ...I, ...s }, n = /* @__PURE__ */ new Date(), f = new Date(n.getFullYear(), n.getMonth(), n.getDate()), o = new Date(f.getTime() - 1440 * 60 * 1e3), i = n.getDay(), w = i === 0 ? 6 : i - 1, k = new Date(
-    f.getTime() - w * 24 * 60 * 60 * 1e3
-  ), g = [], m = [], u = [], h = [];
-  for (const c of e) {
-    const v = (typeof c.timestamp == "string" ? new Date(c.timestamp) : c.timestamp).getTime();
-    v >= f.getTime() ? g.push(c) : v >= o.getTime() ? m.push(c) : v >= k.getTime() ? u.push(c) : h.push(c);
-  }
-  const p = [];
-  return g.length > 0 && p.push({ label: l.today, items: g }), m.length > 0 && p.push({ label: l.yesterday, items: m }), u.length > 0 && p.push({ label: l.thisWeek, items: u }), h.length > 0 && p.push({ label: l.older, items: h }), p;
+function _(e, t) {
+	let n = {
+		...g,
+		...t
+	}, r = /* @__PURE__ */ new Date(), i = new Date(r.getFullYear(), r.getMonth(), r.getDate()), a = /* @__PURE__ */ new Date(i.getTime() - 1440 * 60 * 1e3), o = r.getDay(), s = o === 0 ? 6 : o - 1, c = /* @__PURE__ */ new Date(i.getTime() - s * 24 * 60 * 60 * 1e3), l = [], u = [], d = [], f = [];
+	for (let t of e) {
+		let e = (typeof t.timestamp == "string" ? new Date(t.timestamp) : t.timestamp).getTime();
+		e >= i.getTime() ? l.push(t) : e >= a.getTime() ? u.push(t) : e >= c.getTime() ? d.push(t) : f.push(t);
+	}
+	let p = [];
+	return l.length > 0 && p.push({
+		label: n.today,
+		items: l
+	}), u.length > 0 && p.push({
+		label: n.yesterday,
+		items: u
+	}), d.length > 0 && p.push({
+		label: n.thisWeek,
+		items: d
+	}), f.length > 0 && p.push({
+		label: n.older,
+		items: f
+	}), p;
 }
-function M({ compact: e }) {
-  return /* @__PURE__ */ t("div", { className: a("flex flex-col", e ? "gap-1" : "gap-3"), children: [0, 1, 2].map((s) => /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-03", children: [
-    /* @__PURE__ */ t(N, { className: "h-2 w-2 shrink-0 rounded-ds-full" }),
-    !e && /* @__PURE__ */ t(N, { className: "h-4 w-4 shrink-0 rounded-ds-full" }),
-    /* @__PURE__ */ t(N, { className: a("flex-1", e ? "h-3" : "h-4") }),
-    /* @__PURE__ */ t(N, { className: "h-3 w-12" })
-  ] }, s)) });
+function v({ compact: e }) {
+	return /* @__PURE__ */ f("div", {
+		className: n("flex flex-col", e ? "gap-1" : "gap-3"),
+		children: [
+			0,
+			1,
+			2
+		].map((t) => /* @__PURE__ */ p("div", {
+			className: "flex items-center gap-ds-03",
+			children: [
+				/* @__PURE__ */ f(c, { className: "h-2 w-2 shrink-0 rounded-ds-full" }),
+				!e && /* @__PURE__ */ f(c, { className: "h-4 w-4 shrink-0 rounded-ds-full" }),
+				/* @__PURE__ */ f(c, { className: n("flex-1", e ? "h-3" : "h-4") }),
+				/* @__PURE__ */ f(c, { className: "h-3 w-12" })
+			]
+		}, t))
+	});
 }
-function U({
-  item: e,
-  compact: s
-}) {
-  const [l, n] = D.useState(!1), f = e.color ?? "default", o = () => {
-    e.detail && n((i) => !i);
-  };
-  return /* @__PURE__ */ r("div", { className: a("relative flex items-start", s ? "gap-ds-02" : "gap-ds-03"), children: [
-    /* @__PURE__ */ t(
-      "div",
-      {
-        className: a(
-          "relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-ds-full ring-2 ring-surface-base",
-          O[f]
-        )
-      }
-    ),
-    !s && e.actor && /* @__PURE__ */ r(z, { className: "h-5 w-5 shrink-0 text-[9px]", children: [
-      e.actor.image && /* @__PURE__ */ t(R, { src: e.actor.image, alt: e.actor.name }),
-      /* @__PURE__ */ t(L, { className: "text-[9px]", children: B(e.actor.name) })
-    ] }),
-    /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-1 flex-col", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-ds-02", children: [
-        /* @__PURE__ */ r("div", { className: a("min-w-0 flex-1 flex items-center gap-ds-01 flex-wrap", s ? "text-ds-xs" : "text-ds-sm"), children: [
-          e.actor && /* @__PURE__ */ r("span", { className: "font-medium text-surface-fg", children: [
-            e.actor.name,
-            " "
-          ] }),
-          e.detail && /* @__PURE__ */ t(j, { icon: W, size: "xs", className: a("shrink-0 text-surface-fg-subtle transition-transform duration-fast-02 ease-productive-standard", l && "rotate-90") }),
-          /* @__PURE__ */ t(
-            "span",
-            {
-              className: a(
-                "text-surface-fg-muted",
-                e.detail && "cursor-pointer hover:underline hover:bg-surface-raised rounded-ds-md"
-              ),
-              onClick: o,
-              role: e.detail ? "button" : void 0,
-              tabIndex: e.detail ? 0 : void 0,
-              onKeyDown: e.detail ? (i) => {
-                (i.key === "Enter" || i.key === " ") && (i.preventDefault(), o());
-              } : void 0,
-              children: e.action
-            }
-          )
-        ] }),
-        /* @__PURE__ */ t(
-          "time",
-          {
-            className: a(
-              "shrink-0 whitespace-nowrap text-surface-fg-subtle",
-              s ? "text-ds-xs" : "text-ds-sm"
-            ),
-            dateTime: (typeof e.timestamp == "string" ? new Date(e.timestamp) : e.timestamp).toISOString(),
-            children: G(e.timestamp)
-          }
-        )
-      ] }),
-      l && e.detail && /* @__PURE__ */ t("div", { className: "mt-ds-02 animate-in fade-in slide-in-from-top-1 text-ds-sm text-surface-fg-muted", children: e.detail })
-    ] })
-  ] });
+function y({ item: e, compact: t }) {
+	let [s, c] = d.useState(!1), g = e.color ?? "default", _ = () => {
+		e.detail && c((e) => !e);
+	};
+	return /* @__PURE__ */ p("div", {
+		className: n("relative flex items-start", t ? "gap-ds-02" : "gap-ds-03"),
+		children: [
+			/* @__PURE__ */ f("div", { className: n("relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-ds-full ring-2 ring-surface-base", h[g]) }),
+			!t && e.actor && /* @__PURE__ */ p(i, {
+				className: "h-5 w-5 shrink-0 text-[9px]",
+				children: [e.actor.image && /* @__PURE__ */ f(o, {
+					src: e.actor.image,
+					alt: e.actor.name
+				}), /* @__PURE__ */ f(a, {
+					className: "text-[9px]",
+					children: u(e.actor.name)
+				})]
+			}),
+			/* @__PURE__ */ p("div", {
+				className: "flex min-w-0 flex-1 flex-col",
+				children: [/* @__PURE__ */ p("div", {
+					className: "flex items-center justify-between gap-ds-02",
+					children: [/* @__PURE__ */ p("div", {
+						className: n("min-w-0 flex-1 flex items-center gap-ds-01 flex-wrap", t ? "text-ds-xs" : "text-ds-sm"),
+						children: [
+							e.actor && /* @__PURE__ */ p("span", {
+								className: "font-medium text-surface-fg",
+								children: [e.actor.name, " "]
+							}),
+							e.detail && /* @__PURE__ */ f(r, {
+								icon: m,
+								size: "xs",
+								className: n("shrink-0 text-surface-fg-subtle transition-transform duration-fast-02 ease-productive-standard", s && "rotate-90")
+							}),
+							/* @__PURE__ */ f("span", {
+								className: n("text-surface-fg-muted", e.detail && "cursor-pointer hover:underline hover:bg-surface-raised rounded-ds-md"),
+								onClick: _,
+								role: e.detail ? "button" : void 0,
+								tabIndex: e.detail ? 0 : void 0,
+								onKeyDown: e.detail ? (e) => {
+									(e.key === "Enter" || e.key === " ") && (e.preventDefault(), _());
+								} : void 0,
+								children: e.action
+							})
+						]
+					}), /* @__PURE__ */ f("time", {
+						className: n("shrink-0 whitespace-nowrap text-surface-fg-subtle", t ? "text-ds-xs" : "text-ds-sm"),
+						dateTime: (typeof e.timestamp == "string" ? new Date(e.timestamp) : e.timestamp).toISOString(),
+						children: l(e.timestamp)
+					})]
+				}), s && e.detail && /* @__PURE__ */ f("div", {
+					className: "mt-ds-02 animate-in fade-in slide-in-from-top-1 text-ds-sm text-surface-fg-muted",
+					children: e.detail
+				})]
+			})
+		]
+	});
 }
-function _({
-  item: e,
-  compact: s,
-  children: l
-}) {
-  const n = e.color ?? "default";
-  return /* @__PURE__ */ r("div", { className: a("relative flex items-start", s ? "gap-ds-02" : "gap-ds-03"), children: [
-    /* @__PURE__ */ t(
-      "div",
-      {
-        className: a(
-          "relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-ds-full ring-2 ring-surface-base",
-          O[n]
-        )
-      }
-    ),
-    /* @__PURE__ */ t("div", { className: "min-w-0 flex-1", children: l })
-  ] });
+function b({ item: e, compact: t, children: r }) {
+	let i = e.color ?? "default";
+	return /* @__PURE__ */ p("div", {
+		className: n("relative flex items-start", t ? "gap-ds-02" : "gap-ds-03"),
+		children: [/* @__PURE__ */ f("div", { className: n("relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-ds-full ring-2 ring-surface-base", h[i]) }), /* @__PURE__ */ f("div", {
+			className: "min-w-0 flex-1",
+			children: r
+		})]
+	});
 }
-function H({
-  label: e,
-  isFirst: s
-}) {
-  return /* @__PURE__ */ r(
-    A.div,
-    {
-      initial: { opacity: 0 },
-      animate: { opacity: 1 },
-      transition: T.fade,
-      className: a(
-        "flex items-center gap-ds-03",
-        s ? "" : "mt-ds-06",
-        "mb-ds-03"
-      ),
-      children: [
-        /* @__PURE__ */ t("hr", { className: "flex-1 border-surface-border" }),
-        /* @__PURE__ */ t("span", { className: "bg-surface-base px-ds-03 text-ds-xs font-medium uppercase tracking-wider text-surface-fg-subtle", children: e }),
-        /* @__PURE__ */ t("hr", { className: "flex-1 border-surface-border" })
-      ]
-    }
-  );
+function x({ label: r, isFirst: i }) {
+	return /* @__PURE__ */ p(e.div, {
+		initial: { opacity: 0 },
+		animate: { opacity: 1 },
+		transition: t.fade,
+		className: n("flex items-center gap-ds-03", i ? "" : "mt-ds-06", "mb-ds-03"),
+		children: [
+			/* @__PURE__ */ f("hr", { className: "flex-1 border-surface-border" }),
+			/* @__PURE__ */ f("span", {
+				className: "bg-surface-base px-ds-03 text-ds-xs font-medium uppercase tracking-wider text-surface-fg-subtle",
+				children: r
+			}),
+			/* @__PURE__ */ f("hr", { className: "flex-1 border-surface-border" })
+		]
+	});
 }
-const K = D.forwardRef(
-  ({
-    items: e,
-    onLoadMore: s,
-    loading: l = !1,
-    hasMore: n = !1,
-    emptyState: f,
-    compact: o = !1,
-    maxInitialItems: i,
-    groupBy: w = "none",
-    groupLabels: k,
-    renderItem: g,
-    className: m,
-    ...u
-  }, h) => {
-    const [p, c] = D.useState(!1);
-    if (l)
-      return /* @__PURE__ */ t("div", { ref: h, className: a("relative", m), ...u, children: /* @__PURE__ */ t(M, { compact: o }) });
-    if (e.length === 0)
-      return f ? /* @__PURE__ */ t("div", { ref: h, className: m, ...u, children: f }) : null;
-    const b = i != null && !p && e.length > i, v = b ? e.slice(0, i) : e, F = w === "time", S = (d, x) => {
-      if (g) {
-        const y = g(d, x);
-        if (y !== void 0)
-          return /* @__PURE__ */ t(_, { item: d, compact: o, children: y });
-      }
-      return /* @__PURE__ */ t(U, { item: d, compact: o });
-    };
-    return /* @__PURE__ */ r("div", { ref: h, className: a("relative", m), ...u, children: [
-      F ? /* @__PURE__ */ t("div", { children: Y(v, k).map((d, x) => /* @__PURE__ */ r("div", { children: [
-        /* @__PURE__ */ t(H, { label: d.label, isFirst: x === 0 }),
-        /* @__PURE__ */ r("div", { className: a("relative flex flex-col", o ? "gap-1" : "gap-3"), children: [
-          /* @__PURE__ */ t("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }),
-          d.items.map((y, C) => /* @__PURE__ */ t(A.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { ...T.fade, delay: C * 0.03 }, children: S(y, C) }, y.id))
-        ] })
-      ] }, d.label)) }) : /* @__PURE__ */ r("div", { className: a("relative flex flex-col", o ? "gap-1" : "gap-3"), children: [
-        /* @__PURE__ */ t("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }),
-        v.map((d, x) => /* @__PURE__ */ t(A.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { ...T.fade, delay: x * 0.03 }, children: S(d, x) }, d.id))
-      ] }),
-      b && /* @__PURE__ */ t("div", { className: "relative mt-ds-03 flex justify-center", children: /* @__PURE__ */ r(
-        E,
-        {
-          variant: "ghost",
-          size: "sm",
-          onClick: () => c(!0),
-          children: [
-            "Show all (",
-            e.length,
-            ")"
-          ]
-        }
-      ) }),
-      n && s && !b && /* @__PURE__ */ t("div", { className: "relative mt-ds-03 flex justify-center", children: /* @__PURE__ */ t(E, { variant: "ghost", size: "sm", onClick: s, children: "Load more" }) })
-    ] });
-  }
-);
-K.displayName = "ActivityFeed";
-export {
-  K as ActivityFeed,
-  Y as groupItemsByTime
-};
+var S = d.forwardRef(({ items: r, onLoadMore: i, loading: a = !1, hasMore: o = !1, emptyState: c, compact: l = !1, maxInitialItems: u, groupBy: m = "none", groupLabels: h, renderItem: g, className: S, ...C }, w) => {
+	let [T, E] = d.useState(!1);
+	if (a) return /* @__PURE__ */ f("div", {
+		ref: w,
+		className: n("relative", S),
+		...C,
+		children: /* @__PURE__ */ f(v, { compact: l })
+	});
+	if (r.length === 0) return c ? /* @__PURE__ */ f("div", {
+		ref: w,
+		className: S,
+		...C,
+		children: c
+	}) : null;
+	let D = u != null && !T && r.length > u, O = D ? r.slice(0, u) : r, k = m === "time", A = (e, t) => {
+		if (g) {
+			let n = g(e, t);
+			if (n !== void 0) return /* @__PURE__ */ f(b, {
+				item: e,
+				compact: l,
+				children: n
+			});
+		}
+		return /* @__PURE__ */ f(y, {
+			item: e,
+			compact: l
+		});
+	};
+	return /* @__PURE__ */ p("div", {
+		ref: w,
+		className: n("relative", S),
+		...C,
+		children: [
+			k ? /* @__PURE__ */ f("div", { children: _(O, h).map((r, i) => /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f(x, {
+				label: r.label,
+				isFirst: i === 0
+			}), /* @__PURE__ */ p("div", {
+				className: n("relative flex flex-col", l ? "gap-1" : "gap-3"),
+				children: [/* @__PURE__ */ f("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }), r.items.map((n, r) => /* @__PURE__ */ f(e.div, {
+					initial: { opacity: 0 },
+					animate: { opacity: 1 },
+					transition: {
+						...t.fade,
+						delay: r * .03
+					},
+					children: A(n, r)
+				}, n.id))]
+			})] }, r.label)) }) : /* @__PURE__ */ p("div", {
+				className: n("relative flex flex-col", l ? "gap-1" : "gap-3"),
+				children: [/* @__PURE__ */ f("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }), O.map((n, r) => /* @__PURE__ */ f(e.div, {
+					initial: { opacity: 0 },
+					animate: { opacity: 1 },
+					transition: {
+						...t.fade,
+						delay: r * .03
+					},
+					children: A(n, r)
+				}, n.id))]
+			}),
+			D && /* @__PURE__ */ f("div", {
+				className: "relative mt-ds-03 flex justify-center",
+				children: /* @__PURE__ */ p(s, {
+					variant: "ghost",
+					size: "sm",
+					onClick: () => E(!0),
+					children: [
+						"Show all (",
+						r.length,
+						")"
+					]
+				})
+			}),
+			o && i && !D && /* @__PURE__ */ f("div", {
+				className: "relative mt-ds-03 flex justify-center",
+				children: /* @__PURE__ */ f(s, {
+					variant: "ghost",
+					size: "sm",
+					onClick: i,
+					children: "Load more"
+				})
+			})
+		]
+	});
+});
+S.displayName = "ActivityFeed";
+//#endregion
+export { S as ActivityFeed, _ as groupItemsByTime };