@devalok/shilp-sutra 0.34.0 → 0.36.0

package/dist/ui/avatar.js

@@ -1,174 +1,201 @@
 "use client";
-import { jsx as a, jsxs as R } from "react/jsx-runtime";
-import * as l from "react";
-import { g as v, h as N, F as C } from "../_chunks/primitives.js";
-import { a as F } from "../_chunks/vendor-utils.js";
-import { springs as k } from "./lib/motion.js";
-import { cn as n } from "./lib/utils.js";
-import { m as f } from "../_chunks/framer.js";
-const A = l.createContext("circle"), M = l.createContext("md"), p = F(
-  "relative flex shrink-0 overflow-hidden",
-  {
-    variants: {
-      size: {
-        xs: "h-ds-xs w-ds-xs",
-        sm: "h-ds-sm w-ds-sm",
-        md: "h-ds-md w-ds-md",
-        lg: "h-ds-lg w-ds-lg",
-        xl: "h-ds-xl w-ds-xl"
-      },
-      shape: {
-        circle: "rounded-ds-full",
-        square: "rounded-ds-none",
-        rounded: "rounded-ds-md"
-      }
-    },
-    defaultVariants: { size: "md", shape: "circle" }
-  }
-), h = {
-  online: "bg-success-9",
-  offline: "bg-surface-raised-hover",
-  busy: "bg-error-9",
-  away: "bg-warning-9"
-}, b = {
-  online: "Online",
-  offline: "Offline",
-  busy: "Busy",
-  away: "Away"
-}, y = {
-  xs: "h-ds-02b w-ds-02b",
-  sm: "h-[8px] w-[8px]",
-  md: "h-ds-03 w-ds-03",
-  lg: "h-[12px] w-[12px]",
-  xl: "h-ds-04 w-ds-04"
-}, O = {
-  lead: "ring-accent-7",
-  admin: "ring-warning-7",
-  client: "ring-info-7"
-}, j = {
-  circle: "rounded-ds-full",
-  square: "rounded-ds-none",
-  rounded: "rounded-ds-md"
-}, q = {
-  xs: "text-[9px]",
-  sm: "text-ds-xs",
-  md: "text-ds-sm",
-  lg: "text-ds-md",
-  xl: "text-ds-lg"
-}, w = [
-  { bg: "bg-accent-3", text: "text-accent-11" },
-  { bg: "bg-success-3", text: "text-success-11" },
-  { bg: "bg-warning-3", text: "text-warning-11" },
-  { bg: "bg-error-3", text: "text-error-11" },
-  { bg: "bg-info-3", text: "text-info-11" },
-  { bg: "bg-category-teal-3", text: "text-category-teal-11" },
-  { bg: "bg-category-indigo-3", text: "text-category-indigo-11" },
-  { bg: "bg-category-cyan-3", text: "text-category-cyan-11" }
+import { $t as e, Qt as t, en as n } from "../_chunks/primitives.js";
+import { a as r } from "../_chunks/framer.js";
+import { springs as i } from "./lib/motion.js";
+import { t as a } from "../_chunks/vendor-utils.js";
+import { cn as o } from "./lib/utils.js";
+import * as s from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/ui/avatar.tsx
+var u = s.createContext("circle"), d = s.createContext("md"), f = a("relative flex shrink-0 overflow-hidden", {
+	variants: {
+		size: {
+			xs: "h-ds-xs w-ds-xs",
+			sm: "h-ds-sm w-ds-sm",
+			md: "h-ds-md w-ds-md",
+			lg: "h-ds-lg w-ds-lg",
+			xl: "h-ds-xl w-ds-xl"
+		},
+		shape: {
+			circle: "rounded-ds-full",
+			square: "rounded-ds-none",
+			rounded: "rounded-ds-md"
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		shape: "circle"
+	}
+}), p = {
+	online: "bg-success-9",
+	offline: "bg-surface-raised-hover",
+	busy: "bg-error-9",
+	away: "bg-warning-9"
+}, m = {
+	online: "Online",
+	offline: "Offline",
+	busy: "Busy",
+	away: "Away"
+}, h = {
+	xs: "h-ds-02b w-ds-02b",
+	sm: "h-[8px] w-[8px]",
+	md: "h-ds-03 w-ds-03",
+	lg: "h-[12px] w-[12px]",
+	xl: "h-ds-04 w-ds-04"
+}, g = {
+	lead: "ring-accent-7",
+	admin: "ring-warning-7",
+	client: "ring-info-7"
+}, _ = {
+	circle: "rounded-ds-full",
+	square: "rounded-ds-none",
+	rounded: "rounded-ds-md"
+}, v = {
+	xs: "text-[9px]",
+	sm: "text-ds-xs",
+	md: "text-ds-sm",
+	lg: "text-ds-md",
+	xl: "text-ds-lg"
+}, y = [
+	{
+		bg: "bg-accent-3",
+		text: "text-accent-11"
+	},
+	{
+		bg: "bg-success-3",
+		text: "text-success-11"
+	},
+	{
+		bg: "bg-warning-3",
+		text: "text-warning-11"
+	},
+	{
+		bg: "bg-error-3",
+		text: "text-error-11"
+	},
+	{
+		bg: "bg-info-3",
+		text: "text-info-11"
+	},
+	{
+		bg: "bg-category-teal-3",
+		text: "text-category-teal-11"
+	},
+	{
+		bg: "bg-category-indigo-3",
+		text: "text-category-indigo-11"
+	},
+	{
+		bg: "bg-category-cyan-3",
+		text: "text-category-cyan-11"
+	}
 ];
-function I(o) {
-  let e = 5381;
-  for (let t = 0; t < o.length; t++)
-    e = (e << 5) + e + o.charCodeAt(t) | 0;
-  const r = Math.abs(e) % w.length;
-  return w[r];
+function b(e) {
+	let t = 5381;
+	for (let n = 0; n < e.length; n++) t = (t << 5) + t + e.charCodeAt(n) | 0;
+	return y[Math.abs(t) % y.length];
 }
-const L = l.forwardRef(({ className: o, size: e, shape: r, status: t, ring: i, badge: s, loading: x, children: d, ...c }, g) => {
-  const m = r ?? "circle", u = i && i !== "none" ? n("ring-2 ring-offset-2 ring-offset-surface-raised", O[i], j[m]) : void 0;
-  if (x)
-    return /* @__PURE__ */ a("span", { ref: g, className: n("relative inline-flex shrink-0", u), children: /* @__PURE__ */ a(
-      "span",
-      {
-        className: n(p({ size: e, shape: r }), "animate-pulse bg-surface-raised-hover"),
-        "data-slot": "avatar-skeleton"
-      }
-    ) });
-  const S = s !== void 0 && s !== 0;
-  return /* @__PURE__ */ a(A.Provider, { value: m, children: /* @__PURE__ */ a(M.Provider, { value: e ?? "md", children: /* @__PURE__ */ R("span", { className: n("relative inline-flex shrink-0", u), children: [
-    /* @__PURE__ */ a(
-      v,
-      {
-        ref: g,
-        className: n(p({ size: e, shape: r }), o),
-        ...c,
-        children: d
-      }
-    ),
-    t && (t === "online" ? /* @__PURE__ */ a(
-      f.span,
-      {
-        className: n("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-raised", h[t], y[e ?? "md"]),
-        animate: { opacity: [1, 0.75, 1] },
-        transition: { duration: 2.5, repeat: 1 / 0, ease: "easeInOut" },
-        role: "img",
-        "aria-label": b[t]
-      }
-    ) : /* @__PURE__ */ a("span", { className: n("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-raised", h[t], y[e ?? "md"]), role: "img", "aria-label": b[t] })),
-    S && (s === "dot" ? /* @__PURE__ */ a(
-      "span",
-      {
-        className: "absolute -right-0.5 -top-0.5 h-[8px] w-[8px] rounded-ds-full bg-error-9 ring-2 ring-surface-raised",
-        "data-slot": "avatar-badge-dot",
-        "aria-hidden": "true"
-      }
-    ) : typeof s == "number" ? /* @__PURE__ */ a(
-      f.span,
-      {
-        initial: { scale: 0 },
-        animate: { scale: 1 },
-        transition: k.bouncy,
-        className: "absolute -right-1 -top-1 flex min-w-[16px] items-center justify-center rounded-ds-full bg-error-9 px-1 text-[10px] font-bold leading-[16px] text-error-fg ring-2 ring-surface-raised",
-        "data-slot": "avatar-badge",
-        role: "status",
-        "aria-label": `${s > 99 ? "99+" : s} notifications`,
-        children: s > 99 ? "99+" : s
-      }
-    ) : /* @__PURE__ */ a("span", { className: "absolute -right-1 -top-1", "data-slot": "avatar-badge-custom", children: s }))
-  ] }) }) });
+var x = s.forwardRef(({ className: e, size: t, shape: a, status: s, ring: v, badge: y, loading: b, children: x, ...S }, C) => {
+	let w = a ?? "circle", T = v && v !== "none" ? o("ring-2 ring-offset-2 ring-offset-surface-raised", g[v], _[w]) : void 0;
+	if (b) return /* @__PURE__ */ c("span", {
+		ref: C,
+		className: o("relative inline-flex shrink-0", T),
+		children: /* @__PURE__ */ c("span", {
+			className: o(f({
+				size: t,
+				shape: a
+			}), "animate-pulse bg-surface-raised-hover"),
+			"data-slot": "avatar-skeleton"
+		})
+	});
+	let E = y !== void 0 && y !== 0;
+	return /* @__PURE__ */ c(u.Provider, {
+		value: w,
+		children: /* @__PURE__ */ c(d.Provider, {
+			value: t ?? "md",
+			children: /* @__PURE__ */ l("span", {
+				className: o("relative inline-flex shrink-0", T),
+				children: [
+					/* @__PURE__ */ c(n, {
+						ref: C,
+						className: o(f({
+							size: t,
+							shape: a
+						}), e),
+						...S,
+						children: x
+					}),
+					s && (s === "online" ? /* @__PURE__ */ c(r.span, {
+						className: o("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-raised", p[s], h[t ?? "md"]),
+						animate: { opacity: [
+							1,
+							.75,
+							1
+						] },
+						transition: {
+							duration: 2.5,
+							repeat: Infinity,
+							ease: "easeInOut"
+						},
+						role: "img",
+						"aria-label": m[s]
+					}) : /* @__PURE__ */ c("span", {
+						className: o("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-raised", p[s], h[t ?? "md"]),
+						role: "img",
+						"aria-label": m[s]
+					})),
+					E && (y === "dot" ? /* @__PURE__ */ c("span", {
+						className: "absolute -right-0.5 -top-0.5 h-[8px] w-[8px] rounded-ds-full bg-error-9 ring-2 ring-surface-raised",
+						"data-slot": "avatar-badge-dot",
+						"aria-hidden": "true"
+					}) : typeof y == "number" ? /* @__PURE__ */ c(r.span, {
+						initial: { scale: 0 },
+						animate: { scale: 1 },
+						transition: i.bouncy,
+						className: "absolute -right-1 -top-1 flex min-w-[16px] items-center justify-center rounded-ds-full bg-error-9 px-1 text-[10px] font-bold leading-[16px] text-error-fg ring-2 ring-surface-raised",
+						"data-slot": "avatar-badge",
+						role: "status",
+						"aria-label": `${y > 99 ? "99+" : y} notifications`,
+						children: y > 99 ? "99+" : y
+					}) : /* @__PURE__ */ c("span", {
+						className: "absolute -right-1 -top-1",
+						"data-slot": "avatar-badge-custom",
+						children: y
+					}))
+				]
+			})
+		})
+	});
 });
-L.displayName = v.displayName;
-const B = l.forwardRef(({ className: o, ...e }, r) => /* @__PURE__ */ a(
-  f.span,
-  {
-    initial: { opacity: 0, scale: 0.96 },
-    animate: { opacity: 1, scale: 1 },
-    transition: k.smooth,
-    className: "absolute inset-0 h-full w-full",
-    children: /* @__PURE__ */ a(
-      N,
-      {
-        ref: r,
-        className: n("aspect-square h-full w-full", o),
-        ...e
-      }
-    )
-  }
-));
-B.displayName = N.displayName;
-const z = l.forwardRef(({ className: o, colorSeed: e, children: r, ...t }, i) => {
-  const s = typeof r == "string" ? r : "", d = I(e ?? s), c = l.useContext(A), g = l.useContext(M), m = c === "square" ? "rounded-ds-none" : c === "rounded" ? "rounded-ds-md" : "rounded-ds-full", u = s.length === 1 ? "tracking-wide" : "tracking-normal";
-  return /* @__PURE__ */ a(
-    C,
-    {
-      ref: i,
-      "data-slot": "avatar-fallback",
-      className: n(
-        "flex h-full w-full items-center justify-center font-semibold",
-        m,
-        q[g],
-        d.bg,
-        d.text,
-        u,
-        o
-      ),
-      ...t,
-      children: r
-    }
-  );
+x.displayName = n.displayName;
+var S = s.forwardRef(({ className: t, ...n }, a) => /* @__PURE__ */ c(r.span, {
+	initial: {
+		opacity: 0,
+		scale: .96
+	},
+	animate: {
+		opacity: 1,
+		scale: 1
+	},
+	transition: i.smooth,
+	className: "absolute inset-0 h-full w-full",
+	children: /* @__PURE__ */ c(e, {
+		ref: a,
+		className: o("aspect-square h-full w-full", t),
+		...n
+	})
+}));
+S.displayName = e.displayName;
+var C = s.forwardRef(({ className: e, colorSeed: n, children: r, ...i }, a) => {
+	let l = typeof r == "string" ? r : "", f = b(n ?? l), p = s.useContext(u), m = s.useContext(d), h = p === "square" ? "rounded-ds-none" : p === "rounded" ? "rounded-ds-md" : "rounded-ds-full", g = l.length === 1 ? "tracking-wide" : "tracking-normal";
+	return /* @__PURE__ */ c(t, {
+		ref: a,
+		"data-slot": "avatar-fallback",
+		className: o("flex h-full w-full items-center justify-center font-semibold", h, v[m], f.bg, f.text, g, e),
+		...i,
+		children: r
+	});
 });
-z.displayName = C.displayName;
-export {
-  L as Avatar,
-  z as AvatarFallback,
-  B as AvatarImage,
-  p as avatarVariants
-};
+C.displayName = t.displayName;
+//#endregion
+export { x as Avatar, C as AvatarFallback, S as AvatarImage, f as avatarVariants };

package/dist/ui/avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar.js","names":[],"sources":["../../src/ui/avatar.tsx"],"sourcesContent":["'use client'\n\nimport * as React from \"react\"\nimport * as AvatarPrimitive from \"@primitives/react-avatar\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { motion } from \"framer-motion\"\n\nimport { springs } from \"./lib/motion\"\nimport { cn } from \"./lib/utils\"\n\n// ── Contexts so AvatarFallback can inherit shape & size from Avatar ──\ntype AvatarShape = 'circle' | 'square' | 'rounded'\ntype AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'\nconst AvatarShapeContext = React.createContext<AvatarShape>('circle')\nconst AvatarSizeContext = React.createContext<AvatarSize>('md')\n\nexport const avatarVariants = cva(\n  'relative flex shrink-0 overflow-hidden',\n  {\n    variants: {\n      size: {\n        xs: 'h-ds-xs w-ds-xs',\n        sm: 'h-ds-sm w-ds-sm',\n        md: 'h-ds-md w-ds-md',\n        lg: 'h-ds-lg w-ds-lg',\n        xl: 'h-ds-xl w-ds-xl',\n      },\n      shape: {\n        circle: 'rounded-ds-full',\n        square: 'rounded-ds-none',\n        rounded: 'rounded-ds-md',\n      },\n    },\n    defaultVariants: { size: 'md', shape: 'circle' },\n  }\n)\n\nexport type AvatarStatus = 'online' | 'offline' | 'busy' | 'away'\n\nexport type AvatarRing = 'none' | 'lead' | 'admin' | 'client'\n\nconst statusColorMap: Record<AvatarStatus, string> = {\n  online: 'bg-success-9',\n  offline: 'bg-surface-raised-hover',\n  busy: 'bg-error-9',\n  away: 'bg-warning-9',\n}\n\nconst statusLabelMap: Record<AvatarStatus, string> = {\n  online: 'Online',\n  offline: 'Offline',\n  busy: 'Busy',\n  away: 'Away',\n}\n\n/**\n * Dot size classes that scale with the avatar size.\n * xs/sm get a smaller dot, md gets medium, lg/xl get a larger dot.\n */\nconst statusDotSizeMap: Record<string, string> = {\n  xs: 'h-ds-02b w-ds-02b',\n  sm: 'h-[8px] w-[8px]',\n  md: 'h-ds-03 w-ds-03',\n  lg: 'h-[12px] w-[12px]',\n  xl: 'h-ds-04 w-ds-04',\n}\n\n// ── Role ring ───────────────────────────────────────────────────────────────\n\nconst ringColorMap: Record<Exclude<AvatarRing, 'none'>, string> = {\n  lead: 'ring-accent-7',\n  admin: 'ring-warning-7',\n  client: 'ring-info-7',\n}\n\nconst ringShapeMap: Record<string, string> = {\n  circle: 'rounded-ds-full',\n  square: 'rounded-ds-none',\n  rounded: 'rounded-ds-md',\n}\n\n// ── Fallback font sizes that scale with avatar size ─────────────────────────\nconst fallbackTextSizeMap: Record<AvatarSize, string> = {\n  xs: 'text-[9px]',\n  sm: 'text-ds-xs',\n  md: 'text-ds-sm',\n  lg: 'text-ds-md',\n  xl: 'text-ds-lg',\n}\n\n// ── Deterministic fallback colors ───────────────────────────────────────────\n\nconst FALLBACK_COLORS = [\n  { bg: 'bg-accent-3', text: 'text-accent-11' },\n  { bg: 'bg-success-3', text: 'text-success-11' },\n  { bg: 'bg-warning-3', text: 'text-warning-11' },\n  { bg: 'bg-error-3', text: 'text-error-11' },\n  { bg: 'bg-info-3', text: 'text-info-11' },\n  { bg: 'bg-category-teal-3', text: 'text-category-teal-11' },\n  { bg: 'bg-category-indigo-3', text: 'text-category-indigo-11' },\n  { bg: 'bg-category-cyan-3', text: 'text-category-cyan-11' },\n] as const\n\n/**\n * Simple string hash that produces a deterministic index into FALLBACK_COLORS.\n * Uses djb2 for a reasonable distribution with short strings.\n */\nfunction getFallbackColor(seed: string): (typeof FALLBACK_COLORS)[number] {\n  let hash = 5381\n  for (let i = 0; i < seed.length; i++) {\n    hash = ((hash << 5) + hash + seed.charCodeAt(i)) | 0\n  }\n  const index = Math.abs(hash) % FALLBACK_COLORS.length\n  return FALLBACK_COLORS[index]\n}\n\n/**\n * Props for Avatar — a user/entity image container with size, shape, and presence-status variants.\n *\n * **Sizes:** `xs` | `sm` | `md` (default) | `lg` | `xl` — the status dot scales with the avatar size.\n *\n * **Shapes:** `circle` (default, round) | `square` (sharp corners) | `rounded` (rounded corners, for bots/apps)\n *\n * **Status dot:** `status=\"online\"` (green) | `\"offline\"` (muted) | `\"busy\"` (red) | `\"away\"` (amber).\n * The dot renders with `role=\"img\"` and an accessible `aria-label` — it is not purely decorative.\n *\n * **Role ring:** `ring=\"lead\"` (accent) | `\"admin\"` (warning) | `\"client\"` (info) — a colored ring\n * around the avatar indicating the user's role.\n *\n * **Badge:** `badge={5}` (number) | `badge=\"dot\"` (notification dot) | `badge={<Icon />}` (custom).\n * Numbers > 99 display as \"99+\". Badge is hidden when `0` or `undefined`.\n *\n * **Loading:** `loading={true}` shows a pulse skeleton placeholder.\n *\n * **Children:** Use `<AvatarImage>` for the photo and `<AvatarFallback>` for initials when the image fails.\n *\n * @example\n * // User avatar with photo and fallback initials:\n * <Avatar size=\"md\">\n *   <AvatarImage src={user.avatarUrl} alt={user.name} />\n *   <AvatarFallback>JD</AvatarFallback>\n * </Avatar>\n *\n * @example\n * // Online presence indicator in a team roster:\n * <Avatar size=\"lg\" status=\"online\">\n *   <AvatarImage src={user.photoUrl} alt={user.name} />\n *   <AvatarFallback>{user.initials}</AvatarFallback>\n * </Avatar>\n *\n * @example\n * // Square shape for a bot/integration logo:\n * <Avatar shape=\"square\" size=\"xl\">\n *   <AvatarImage src=\"/logos/github.png\" alt=\"GitHub\" />\n * </Avatar>\n * // These are just a few ways — feel free to combine props creatively!\n */\nexport interface AvatarProps\n  extends Omit<React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>, 'children'>,\n    VariantProps<typeof avatarVariants> {\n  /** Optional status indicator displayed as a dot at the bottom-right corner */\n  status?: AvatarStatus\n  /** Role ring color indicator */\n  ring?: AvatarRing\n  /** Badge overlay: number, 'dot', or custom ReactNode */\n  badge?: number | 'dot' | React.ReactNode\n  /** Show loading skeleton instead of content */\n  loading?: boolean\n  children?: React.ReactNode\n}\n\nconst Avatar = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Root>,\n  AvatarProps\n>(({ className, size, shape, status, ring, badge, loading, children, ...props }, ref) => {\n  const resolvedShape = shape ?? 'circle'\n\n  // Build ring classes for the outer wrapper\n  const ringClasses = ring && ring !== 'none'\n    ? cn('ring-2 ring-offset-2 ring-offset-surface-raised', ringColorMap[ring], ringShapeMap[resolvedShape])\n    : undefined\n\n  // Loading skeleton — early return\n  if (loading) {\n    return (\n      <span ref={ref} className={cn('relative inline-flex shrink-0', ringClasses)}>\n        <span\n          className={cn(avatarVariants({ size, shape }), 'animate-pulse bg-surface-raised-hover')}\n          data-slot=\"avatar-skeleton\"\n        />\n      </span>\n    )\n  }\n\n  // Determine whether to render badge\n  const showBadge = badge !== undefined && badge !== 0\n\n  return (\n    <AvatarShapeContext.Provider value={resolvedShape}>\n    <AvatarSizeContext.Provider value={size ?? 'md'}>\n    <span className={cn('relative inline-flex shrink-0', ringClasses)}>\n      <AvatarPrimitive.Root\n        ref={ref}\n        className={cn(avatarVariants({ size, shape }), className)}\n        {...props}\n      >\n        {children}\n      </AvatarPrimitive.Root>\n      {status && (\n        status === 'online' ? (\n          <motion.span\n            className={cn('absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-raised', statusColorMap[status], statusDotSizeMap[size ?? 'md'])}\n            animate={{ opacity: [1, 0.75, 1] }}\n            transition={{ duration: 2.5, repeat: Infinity, ease: 'easeInOut' }}\n            role=\"img\"\n            aria-label={statusLabelMap[status]}\n          />\n        ) : (\n          <span className={cn('absolute bottom-0 right-0 rounded-ds-full ring-2 ring-surface-raised', statusColorMap[status], statusDotSizeMap[size ?? 'md'])} role=\"img\" aria-label={statusLabelMap[status]} />\n        )\n      )}\n      {showBadge && (\n        badge === 'dot' ? (\n          <span\n            className=\"absolute -right-0.5 -top-0.5 h-[8px] w-[8px] rounded-ds-full bg-error-9 ring-2 ring-surface-raised\"\n            data-slot=\"avatar-badge-dot\"\n            aria-hidden=\"true\"\n          />\n        ) : typeof badge === 'number' ? (\n          <motion.span\n            initial={{ scale: 0 }}\n            animate={{ scale: 1 }}\n            transition={springs.bouncy}\n            className=\"absolute -right-1 -top-1 flex min-w-[16px] items-center justify-center rounded-ds-full bg-error-9 px-1 text-[10px] font-bold leading-[16px] text-error-fg ring-2 ring-surface-raised\"\n            data-slot=\"avatar-badge\"\n            role=\"status\"\n            aria-label={`${badge > 99 ? '99+' : badge} notifications`}\n          >\n            {badge > 99 ? '99+' : badge}\n          </motion.span>\n        ) : (\n          <span className=\"absolute -right-1 -top-1\" data-slot=\"avatar-badge-custom\">\n            {badge}\n          </span>\n        )\n      )}\n    </span>\n    </AvatarSizeContext.Provider>\n    </AvatarShapeContext.Provider>\n  )\n})\nAvatar.displayName = AvatarPrimitive.Root.displayName\n\nconst AvatarImage = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Image>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(({ className, ...props }, ref) => (\n  <motion.span\n    initial={{ opacity: 0, scale: 0.96 }}\n    animate={{ opacity: 1, scale: 1 }}\n    transition={springs.smooth}\n    className=\"absolute inset-0 h-full w-full\"\n  >\n    <AvatarPrimitive.Image\n      ref={ref}\n      className={cn(\"aspect-square h-full w-full\", className)}\n      {...props}\n    />\n  </motion.span>\n))\nAvatarImage.displayName = AvatarPrimitive.Image.displayName\n\nexport interface AvatarFallbackProps\n  extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback> {\n  /**\n   * Seed string for deterministic color selection.\n   * Falls back to the text content of `children` if not provided.\n   */\n  colorSeed?: string\n}\n\nconst AvatarFallback = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Fallback>,\n  AvatarFallbackProps\n>(({ className, colorSeed, children, ...props }, ref) => {\n  // Derive seed: explicit colorSeed > children text content > empty string\n  const childrenText = typeof children === 'string' ? children : ''\n  const seed = colorSeed ?? childrenText\n  const color = getFallbackColor(seed)\n\n  // Inherit shape and size from parent Avatar via context\n  const shape = React.useContext(AvatarShapeContext)\n  const size = React.useContext(AvatarSizeContext)\n  const shapeClass = shape === 'square' ? 'rounded-ds-none' : shape === 'rounded' ? 'rounded-ds-md' : 'rounded-ds-full'\n\n  // Letter-spacing based on character count\n  const tracking = childrenText.length === 1 ? 'tracking-wide' : 'tracking-normal'\n\n  return (\n    <AvatarPrimitive.Fallback\n      ref={ref}\n      data-slot=\"avatar-fallback\"\n      className={cn(\n        'flex h-full w-full items-center justify-center font-semibold',\n        shapeClass,\n        fallbackTextSizeMap[size],\n        color.bg,\n        color.text,\n        tracking,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </AvatarPrimitive.Fallback>\n  )\n})\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName\n\nexport { Avatar, AvatarImage, AvatarFallback }\n"],"mappings":"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"}

package/dist/ui/badge-group.js

@@ -1,8 +1,3 @@
 "use client";
-import "react/jsx-runtime";
-import "react";
-import "./lib/utils.js";
-import { a } from "../_chunks/badge-group.js";
-export {
-  a as BadgeGroup
-};
+import { t as e } from "../_chunks/badge-group.js";
+export { e as BadgeGroup };

package/dist/ui/badge-indicator.js

@@ -1,54 +1,45 @@
 "use client";
-import { jsxs as d, jsx as n } from "react/jsx-runtime";
-import { cn as r } from "./lib/utils.js";
-import { springs as x } from "./lib/motion.js";
-import { u as b, A as u, m as h } from "../_chunks/framer.js";
-const y = {
-  "top-right": "-top-1 -right-1",
-  "top-left": "-top-1 -left-1",
-  "bottom-right": "-bottom-1 -right-1",
-  "bottom-left": "-bottom-1 -left-1"
-}, w = {
-  error: "bg-error-9 text-error-fg",
-  success: "bg-success-9 text-success-fg",
-  warning: "bg-warning-9 text-warning-fg",
-  accent: "bg-accent-9 text-accent-fg",
-  info: "bg-info-9 text-info-fg"
+import { a as e, c as t, n } from "../_chunks/framer.js";
+import { springs as r } from "./lib/motion.js";
+import { cn as i } from "./lib/utils.js";
+import "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/ui/badge-indicator.tsx
+var s = {
+	"top-right": "-top-1 -right-1",
+	"top-left": "-top-1 -left-1",
+	"bottom-right": "-bottom-1 -right-1",
+	"bottom-left": "-bottom-1 -left-1"
+}, c = {
+	error: "bg-error-9 text-error-fg",
+	success: "bg-success-9 text-success-fg",
+	warning: "bg-warning-9 text-warning-fg",
+	accent: "bg-accent-9 text-accent-fg",
+	info: "bg-info-9 text-info-fg"
 };
-function S({
-  count: t,
-  max: o = 99,
-  dot: e = !1,
-  color: s = "error",
-  invisible: a = !1,
-  showZero: c = !1,
-  placement: f = "top-right",
-  className: l,
-  children: p
-}) {
-  const i = b(), g = !a && (e || t !== void 0 && (t > 0 || c)), m = t !== void 0 && t > o ? `${o}+` : t;
-  return /* @__PURE__ */ d("span", { className: r("relative inline-flex", l), children: [
-    p,
-    /* @__PURE__ */ n(u, { children: g && /* @__PURE__ */ n(
-      h.span,
-      {
-        initial: i ? { opacity: 0 } : { scale: 0, opacity: 0 },
-        animate: i ? { opacity: 1 } : { scale: 1, opacity: 1 },
-        exit: i ? { opacity: 0 } : { scale: 0, opacity: 0 },
-        transition: x.bouncy,
-        className: r(
-          "absolute flex items-center justify-center rounded-full font-sans font-semibold ring-2 ring-surface-raised",
-          w[s],
-          y[f],
-          e ? "h-2.5 w-2.5" : "min-w-[18px] h-[18px] px-1 text-[11px] leading-none"
-        ),
-        children: !e && m
-      },
-      "indicator"
-    ) })
-  ] });
+function l({ count: l, max: u = 99, dot: d = !1, color: f = "error", invisible: p = !1, showZero: m = !1, placement: h = "top-right", className: g, children: _ }) {
+	let v = n(), y = !p && (d || l !== void 0 && (l > 0 || m)), b = l !== void 0 && l > u ? `${u}+` : l;
+	return /* @__PURE__ */ o("span", {
+		className: i("relative inline-flex", g),
+		children: [_, /* @__PURE__ */ a(t, { children: y && /* @__PURE__ */ a(e.span, {
+			initial: v ? { opacity: 0 } : {
+				scale: 0,
+				opacity: 0
+			},
+			animate: v ? { opacity: 1 } : {
+				scale: 1,
+				opacity: 1
+			},
+			exit: v ? { opacity: 0 } : {
+				scale: 0,
+				opacity: 0
+			},
+			transition: r.bouncy,
+			className: i("absolute flex items-center justify-center rounded-full font-sans font-semibold ring-2 ring-surface-raised", c[f], s[h], d ? "h-2.5 w-2.5" : "min-w-[18px] h-[18px] px-1 text-[11px] leading-none"),
+			children: !d && b
+		}, "indicator") })]
+	});
 }
-S.displayName = "BadgeIndicator";
-export {
-  S as BadgeIndicator
-};
+l.displayName = "BadgeIndicator";
+//#endregion
+export { l as BadgeIndicator };

package/dist/ui/badge-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge-indicator.js","names":[],"sources":["../../src/ui/badge-indicator.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { motion, AnimatePresence, useReducedMotion } from 'framer-motion'\nimport { cn } from './lib/utils'\nimport { springs } from './lib/motion'\n\nconst PLACEMENT_CLASSES = {\n  'top-right': '-top-1 -right-1',\n  'top-left': '-top-1 -left-1',\n  'bottom-right': '-bottom-1 -right-1',\n  'bottom-left': '-bottom-1 -left-1',\n} as const\n\nconst COLOR_CLASSES = {\n  error: 'bg-error-9 text-error-fg',\n  success: 'bg-success-9 text-success-fg',\n  warning: 'bg-warning-9 text-warning-fg',\n  accent: 'bg-accent-9 text-accent-fg',\n  info: 'bg-info-9 text-info-fg',\n} as const\n\nexport interface BadgeIndicatorProps {\n  count?: number\n  max?: number\n  dot?: boolean\n  color?: keyof typeof COLOR_CLASSES\n  invisible?: boolean\n  showZero?: boolean\n  placement?: keyof typeof PLACEMENT_CLASSES\n  className?: string\n  children: React.ReactNode\n}\n\nexport function BadgeIndicator({\n  count,\n  max = 99,\n  dot = false,\n  color = 'error',\n  invisible = false,\n  showZero = false,\n  placement = 'top-right',\n  className,\n  children,\n}: BadgeIndicatorProps) {\n  const prefersReduced = useReducedMotion()\n  const show = !invisible && (dot || (count !== undefined && (count > 0 || showZero)))\n  const displayCount = count !== undefined && count > max ? `${max}+` : count\n\n  return (\n    <span className={cn('relative inline-flex', className)}>\n      {children}\n      <AnimatePresence>\n        {show && (\n          <motion.span\n            key=\"indicator\"\n            initial={prefersReduced ? { opacity: 0 } : { scale: 0, opacity: 0 }}\n            animate={prefersReduced ? { opacity: 1 } : { scale: 1, opacity: 1 }}\n            exit={prefersReduced ? { opacity: 0 } : { scale: 0, opacity: 0 }}\n            transition={springs.bouncy}\n            className={cn(\n              'absolute flex items-center justify-center rounded-full font-sans font-semibold ring-2 ring-surface-raised',\n              COLOR_CLASSES[color],\n              PLACEMENT_CLASSES[placement],\n              dot\n                ? 'h-2.5 w-2.5'\n                : 'min-w-[18px] h-[18px] px-1 text-[11px] leading-none',\n            )}\n          >\n            {!dot && displayCount}\n          </motion.span>\n        )}\n      </AnimatePresence>\n    </span>\n  )\n}\n\nBadgeIndicator.displayName = 'BadgeIndicator'\n"],"mappings":";;;;;;;AAOA,IAAM,IAAoB;CACxB,aAAa;CACb,YAAY;CACZ,gBAAgB;CAChB,eAAe;CAChB,EAEK,IAAgB;CACpB,OAAO;CACP,SAAS;CACT,SAAS;CACT,QAAQ;CACR,MAAM;CACP;AAcD,SAAgB,EAAe,EAC7B,UACA,SAAM,IACN,SAAM,IACN,WAAQ,SACR,eAAY,IACZ,cAAW,IACX,eAAY,aACZ,cACA,eACsB;CACtB,IAAM,IAAiB,GAAkB,EACnC,IAAO,CAAC,MAAc,KAAQ,MAAU,KAAA,MAAc,IAAQ,KAAK,KACnE,IAAe,MAAU,KAAA,KAAa,IAAQ,IAAM,GAAG,EAAI,KAAK;AAEtE,QACE,kBAAC,QAAD;EAAM,WAAW,EAAG,wBAAwB,EAAU;YAAtD,CACG,GACD,kBAAC,GAAD,EAAA,UACG,KACC,kBAAC,EAAO,MAAR;GAEE,SAAS,IAAiB,EAAE,SAAS,GAAG,GAAG;IAAE,OAAO;IAAG,SAAS;IAAG;GACnE,SAAS,IAAiB,EAAE,SAAS,GAAG,GAAG;IAAE,OAAO;IAAG,SAAS;IAAG;GACnE,MAAM,IAAiB,EAAE,SAAS,GAAG,GAAG;IAAE,OAAO;IAAG,SAAS;IAAG;GAChE,YAAY,EAAQ;GACpB,WAAW,EACT,6GACA,EAAc,IACd,EAAkB,IAClB,IACI,gBACA,sDACL;aAEA,CAAC,KAAO;GACG,EAfR,YAeQ,EAEA,CAAA,CACb;;;AAIX,EAAe,cAAc"}

package/dist/ui/badge.js

@@ -1,16 +1,3 @@
 "use client";
-import "react/jsx-runtime";
-import "@tabler/icons-react";
-import "../_chunks/vendor-utils.js";
-import "./lib/motion.js";
-import "../_chunks/primitives.js";
-import "react";
-import "./icon.js";
-import "./lib/utils.js";
-import "./badge-indicator.js";
-import { B, b as f } from "../_chunks/badge-group.js";
-import "../_chunks/framer.js";
-export {
-  B as Badge,
-  f as badgeVariants
-};
+import { n as e, r as t } from "../_chunks/badge-group.js";
+export { e as Badge, t as badgeVariants };