@devalok/shilp-sutra 0.8.3 → 0.9.0

package/dist/_chunks/avatar.js

@@ -0,0 +1,50 @@
+"use client";
+import { jsxs as p, jsx as l } from "react/jsx-runtime";
+import * as i from "react";
+import { R as n, I as o, F as t } from "./primitives.js";
+import { m as u } from "./vendor.js";
+import { c as r } from "./utils.js";
+const h = u("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" }
+}), w = {
+  online: "bg-success",
+  offline: "bg-layer-03",
+  busy: "bg-error",
+  away: "bg-warning"
+}, x = {
+  online: "Online",
+  offline: "Offline",
+  busy: "Busy",
+  away: "Away"
+}, b = {
+  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 = i.forwardRef(({ className: a, size: s, shape: e, status: d, children: m, ...f }, c) => p("span", { className: "relative inline-flex shrink-0", children: [l(n, { ref: c, className: r(h({ size: s, shape: e }), a), ...f, children: m }), d && l("span", { className: r("absolute bottom-0 right-0 rounded-ds-full ring-2 ring-layer-01", w[d], b[s ?? "md"]), role: "img", "aria-label": x[d] })] }));
+g.displayName = n.displayName;
+const y = i.forwardRef(({ className: a, ...s }, e) => l(o, { ref: e, className: r("aspect-square h-full w-full", a), ...s }));
+y.displayName = o.displayName;
+const v = i.forwardRef(({ className: a, ...s }, e) => l(t, { ref: e, className: r("flex h-full w-full items-center justify-center rounded-ds-full bg-interactive-subtle text-interactive", a), ...s }));
+v.displayName = t.displayName;
+export {
+  g as A,
+  y as a,
+  v as b,
+  h as c
+};

package/dist/_chunks/button.js

@@ -0,0 +1,95 @@
+"use client";
+import { jsx as r, jsxs as x } from "react/jsx-runtime";
+import { m as V } from "./vendor.js";
+import { S as R, a as E } from "./primitives.js";
+import * as G from "react";
+import { u as M, S as q } from "./spinner.js";
+import { c as s } from "./utils.js";
+const p = V("inline-flex items-center justify-center gap-ds-03 whitespace-nowrap font-sans font-semibold select-none border border-transparent transition-[color,background-color,border-color,box-shadow] duration-fast-01 ease-productive-standard focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-[0.38]", {
+  variants: {
+    variant: {
+      solid: "",
+      default: "",
+      // alias → solid
+      outline: "",
+      ghost: "",
+      destructive: "",
+      // alias → solid + error
+      link: "text-text-link underline-offset-4 hover:underline active:opacity-[0.8]"
+    },
+    color: {
+      default: "",
+      error: ""
+    },
+    size: {
+      sm: "h-ds-sm rounded-ds-md px-ds-04 text-ds-sm",
+      md: "h-ds-md rounded-ds-md px-ds-05 text-ds-md",
+      lg: "h-ds-lg rounded-ds-lg px-ds-06 text-ds-base",
+      icon: "h-ds-md w-ds-md rounded-ds-md",
+      // alias → icon-md
+      "icon-sm": "h-ds-sm w-ds-sm rounded-ds-md",
+      "icon-md": "h-ds-md w-ds-md rounded-ds-md",
+      "icon-lg": "h-ds-lg w-ds-lg rounded-ds-lg"
+    }
+  },
+  compoundVariants: [
+    // solid + default (primary)
+    { variant: "solid", color: "default", className: "bg-interactive text-text-on-color hover:bg-interactive-hover active:bg-interactive-active shadow-01 hover:shadow-brand" },
+    // "default" alias → same as solid + default
+    { variant: "default", color: "default", className: "bg-interactive text-text-on-color hover:bg-interactive-hover active:bg-interactive-active shadow-01 hover:shadow-brand" },
+    { variant: "default", color: "error", className: "bg-error text-text-on-color hover:bg-error-hover active:bg-error-hover shadow-01" },
+    // "destructive" alias → solid + error
+    { variant: "destructive", color: "default", className: "bg-error text-text-on-color hover:bg-error-hover active:bg-error-hover shadow-01" },
+    { variant: "destructive", color: "error", className: "bg-error text-text-on-color hover:bg-error-hover active:bg-error-hover shadow-01" },
+    // solid + error
+    { variant: "solid", color: "error", className: "bg-error text-text-on-color hover:bg-error-hover active:bg-error-hover shadow-01" },
+    // outline + default (secondary)
+    { variant: "outline", color: "default", className: "bg-transparent text-interactive border-border-interactive hover:bg-interactive-subtle active:bg-layer-active" },
+    // outline + error (error-ghost)
+    { variant: "outline", color: "error", className: "bg-transparent text-error border border-border-error hover:bg-error-surface active:bg-error-surface" },
+    // ghost + default
+    { variant: "ghost", color: "default", className: "bg-transparent text-text-secondary hover:bg-layer-02 hover:text-text-primary active:bg-layer-active" },
+    // ghost + error
+    { variant: "ghost", color: "error", className: "bg-transparent text-error hover:bg-error-surface hover:text-error active:bg-error-surface" }
+  ],
+  defaultVariants: {
+    variant: "solid",
+    color: "default",
+    size: "md"
+  }
+}), A = {
+  sm: "h-ico-sm w-ico-sm [&>svg]:h-ico-sm [&>svg]:w-ico-sm",
+  md: "h-ico-sm w-ico-sm [&>svg]:h-ico-sm [&>svg]:w-ico-sm",
+  lg: "h-ico-md w-ico-md [&>svg]:h-ico-md [&>svg]:w-ico-md",
+  icon: "h-ico-sm w-ico-sm [&>svg]:h-ico-sm [&>svg]:w-ico-sm",
+  "icon-sm": "h-ico-sm w-ico-sm [&>svg]:h-ico-sm [&>svg]:w-ico-sm",
+  "icon-md": "h-ico-sm w-ico-sm [&>svg]:h-ico-sm [&>svg]:w-ico-sm",
+  "icon-lg": "h-ico-md w-ico-md [&>svg]:h-ico-md [&>svg]:w-ico-md"
+}, D = {
+  sm: "sm",
+  md: "sm",
+  lg: "md",
+  icon: "sm",
+  "icon-sm": "sm",
+  "icon-md": "sm",
+  "icon-lg": "md"
+}, F = G.forwardRef(({ className: c, variant: w, color: N, size: y, asChild: S = !1, startIcon: d, endIcon: l, loading: e = !1, loadingPosition: t = "start", fullWidth: m = !1, disabled: v, children: i, ...u }, h) => {
+  const a = M(), b = w ?? a.variant, f = N ?? a.color, o = y ?? a.size ?? "md", g = A[o], z = D[o], n = e ? r(q, { size: z }) : null;
+  if (S) {
+    const C = {
+      className: s(p({ variant: b, color: f, size: o }), m && "w-full", c),
+      ref: h,
+      disabled: v || e,
+      "aria-busy": e || void 0,
+      ...u
+    };
+    return r(R, { ...C, children: r(E, { children: i }) });
+  }
+  const j = () => e && t === "start" ? n : d ? r("span", { className: s("inline-flex shrink-0 items-center justify-center", g), children: d }) : null, k = () => e && t === "end" ? n : l ? r("span", { className: s("inline-flex shrink-0 items-center justify-center", g), children: l }) : null, B = () => e && t === "center" ? x("span", { className: "relative inline-flex items-center justify-center", children: [r("span", { className: "invisible", children: i }), r("span", { className: "absolute inset-0 flex items-center justify-center", children: n })] }) : i;
+  return x("button", { className: s(p({ variant: b, color: f, size: o }), m && "w-full", c), ref: h, disabled: v || e, "aria-busy": e || void 0, ...u, children: [j(), B(), k()] });
+});
+F.displayName = "Button";
+export {
+  F as B,
+  p as b
+};

package/dist/_chunks/card.js

@@ -0,0 +1,40 @@
+"use client";
+import { jsx as t } from "react/jsx-runtime";
+import * as o from "react";
+import { bj as n, bk as c } from "./primitives.js";
+import { c as s } from "./utils.js";
+import { m as l } from "./vendor.js";
+const f = o.forwardRef(({ className: e, error: r, ...a }, d) => t(n, { className: s("peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-ds-full border-2 border-transparent shadow-01 transition-colors duration-fast-01 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-[0.38] data-[state=checked]:bg-interactive data-[state=unchecked]:bg-border-strong", r && "border-border-error data-[state=checked]:bg-error", e), ...a, ref: d, children: t(c, { className: s("pointer-events-none block h-ico-md w-ico-md rounded-ds-full bg-text-on-color shadow-02 ring-0 transition-transform duration-fast-01 data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0") }) }));
+f.displayName = n.displayName;
+const b = l("rounded-ds-lg text-text-primary", {
+  variants: {
+    variant: {
+      default: "bg-layer-01 border border-border-subtle shadow-01",
+      elevated: "bg-layer-01 border border-border-subtle shadow-02",
+      outline: "bg-transparent border-2 border-border shadow-none",
+      flat: "bg-layer-02 border-none shadow-none"
+    }
+  },
+  defaultVariants: { variant: "default" }
+}), m = o.forwardRef(({ className: e, variant: r, interactive: a, ...d }, i) => t("div", { ref: i, className: s(b({ variant: r }), a && "hover:shadow-02 hover:border-border-strong cursor-pointer transition-shadow duration-fast-01", e), ...d }));
+m.displayName = "Card";
+const p = o.forwardRef(({ className: e, ...r }, a) => t("div", { ref: a, className: s("flex flex-col space-y-ds-02b p-ds-06", e), ...r }));
+p.displayName = "CardHeader";
+const u = o.forwardRef(({ className: e, ...r }, a) => t("div", { ref: a, className: s("font-sans font-semibold leading-ds-none tracking-ds-tight text-text-primary", e), ...r }));
+u.displayName = "CardTitle";
+const h = o.forwardRef(({ className: e, ...r }, a) => t("div", { ref: a, className: s("text-ds-md text-text-secondary", e), ...r }));
+h.displayName = "CardDescription";
+const v = o.forwardRef(({ className: e, ...r }, a) => t("div", { ref: a, className: s("p-ds-06 pt-0", e), ...r }));
+v.displayName = "CardContent";
+const w = o.forwardRef(({ className: e, ...r }, a) => t("div", { ref: a, className: s("flex items-center p-ds-06 pt-0", e), ...r }));
+w.displayName = "CardFooter";
+export {
+  m as C,
+  f as S,
+  p as a,
+  u as b,
+  v as c,
+  h as d,
+  w as e,
+  b as f
+};

package/dist/_chunks/checkbox.js

@@ -0,0 +1,14 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+import { C as r, b as n } from "./primitives.js";
+import { IconMinus as m, IconCheck as l } from "@tabler/icons-react";
+import * as b from "react";
+import { c as f } from "./utils.js";
+const h = b.forwardRef(({ className: o, error: i, indeterminate: a, checked: s, ...c }, d) => {
+  const t = a ? "indeterminate" : s;
+  return e(r, { ref: d, checked: t, className: f("peer h-ico-md w-ico-md shrink-0 rounded-ds-sm", "border border-border-strong", "bg-field", "transition-colors duration-fast-01", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-[0.38]", "data-[state=checked]:bg-interactive data-[state=checked]:border-interactive data-[state=checked]:text-text-on-color", "data-[state=indeterminate]:bg-interactive data-[state=indeterminate]:border-interactive data-[state=indeterminate]:text-text-on-color", i && "border-border-error", o), ...c, children: e(n, { className: "flex items-center justify-center text-current", children: t === "indeterminate" ? e(m, { className: "h-ico-sm w-ico-sm" }) : e(l, { className: "h-ico-sm w-ico-sm" }) }) });
+});
+h.displayName = r.displayName;
+export {
+  h as C
+};

package/dist/_chunks/form.js

@@ -0,0 +1,27 @@
+"use client";
+import { jsx as c } from "react/jsx-runtime";
+import * as e from "react";
+import { c as i } from "./utils.js";
+const x = e.createContext({}), m = e.forwardRef(({ className: s, helperTextId: o, state: a = "helper", required: l, children: n, ...t }, r) => {
+  const d = e.useId(), p = o || `${d}-helper`;
+  return c(x.Provider, { value: { state: a, helperTextId: p, required: l }, children: c("div", { ref: r, className: i("flex flex-col gap-ds-02", s), ...t, children: n }) });
+});
+m.displayName = "FormField";
+const u = {
+  helper: "text-text-helper",
+  error: "text-text-error",
+  warning: "text-text-warning",
+  success: "text-text-success"
+}, f = e.forwardRef(({ className: s, id: o, state: a, ...l }, n) => {
+  const t = e.useContext(x), r = a ?? t.state ?? "helper", d = o ?? t.helperTextId;
+  return c("p", { ref: n, id: d, role: r === "error" ? "alert" : void 0, className: i("text-ds-sm", u[r], s), ...l });
+});
+f.displayName = "FormHelperText";
+function C() {
+  return e.useContext(x);
+}
+export {
+  m as F,
+  f as a,
+  C as u
+};