@devalok/shilp-sutra 0.26.0 → 0.27.0

package/dist/ui/button.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as e, jsxs as C } from "react/jsx-runtime";
-import { ay as J } from "../_chunks/vendor-utils.js";
+import { c as J } from "../_chunks/vendor-utils.js";
 import { IconCheck as L, IconX as O } from "@tabler/icons-react";
 import { S as P, K as Q } from "../_chunks/primitives.js";
 import * as a from "react";
@@ -103,8 +103,8 @@ const R = J(
     onClickAsync: m,
     asyncFeedbackDuration: T = 1500,
     children: n,
-    ...y
-  }, N) => {
+    ...N
+  }, y) => {
     const u = U(), S = A ?? u.variant, z = V ?? u.color, i = B ?? u.size ?? "md", f = W[i], G = ee[i], [t, d] = a.useState("idle"), k = a.useRef(), o = a.useRef(!0);
     a.useEffect(() => () => {
       o.current = !1, clearTimeout(k.current);
@@ -127,10 +127,10 @@ const R = J(
           x && "w-full",
           h
         ),
-        ref: N,
+        ref: y,
         disabled: w || s,
         "aria-busy": s || void 0,
-        ...y
+        ...N
       };
       return /* @__PURE__ */ e(P, { ...v, children: /* @__PURE__ */ e(Q, { children: n }) });
     }
@@ -152,7 +152,7 @@ const R = J(
     return /* @__PURE__ */ C(
       "button",
       {
-        ...y,
+        ...N,
         className: c(
           R({ variant: S, color: z, size: i }),
           x && "w-full",
@@ -161,7 +161,7 @@ const R = J(
           r && "transition-colors duration-moderate-01 ease-productive-standard",
           h
         ),
-        ref: N,
+        ref: y,
         disabled: w || s || r,
         "aria-busy": s || void 0,
         onClick: j ? I : M,

package/dist/ui/card.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as t, jsxs as p } from "react/jsx-runtime";
 import * as s from "react";
-import { ay as v } from "../_chunks/vendor-utils.js";
+import { c as v } from "../_chunks/vendor-utils.js";
 import { tweens as w, springs as b, motionProps as g } from "./lib/motion.js";
 import { cn as o } from "./lib/utils.js";
 import { m } from "../_chunks/framer.js";

package/dist/ui/chip.js

@@ -2,7 +2,7 @@
 import { jsxs as p, jsx as a } from "react/jsx-runtime";
 import * as f from "react";
 import { IconX as N } from "@tabler/icons-react";
-import { ay as h } from "../_chunks/vendor-utils.js";
+import { c as h } from "../_chunks/vendor-utils.js";
 import { springs as w, motionProps as C } from "./lib/motion.js";
 import { cn as k } from "./lib/utils.js";
 import { m as n } from "../_chunks/framer.js";

package/dist/ui/input.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as d, jsxs as v } from "react/jsx-runtime";
 import * as g from "react";
-import { ay as p } from "../_chunks/vendor-utils.js";
+import { c as p } from "../_chunks/vendor-utils.js";
 import { cn as o } from "./lib/utils.js";
 import { motionProps as x } from "./lib/motion.js";
 import { useFormField as h } from "./form.js";

package/dist/ui/lib/utils.js

@@ -1,4 +1,4 @@
-import { az as d, aA as e } from "../../_chunks/vendor-utils.js";
+import { e as d, a as e } from "../../_chunks/vendor-utils.js";
 const t = d({
   extend: {
     theme: {

package/dist/ui/progress.js

@@ -1,9 +1,9 @@
 "use client";
-import { jsxs as o, jsx as r } from "react/jsx-runtime";
+import { jsxs as o, jsx as a } from "react/jsx-runtime";
 import * as h from "react";
 import { aQ as d, aR as l } from "../_chunks/primitives.js";
-import { ay as c } from "../_chunks/vendor-utils.js";
-import { cn as a } from "./lib/utils.js";
+import { c } from "../_chunks/vendor-utils.js";
+import { cn as r } from "./lib/utils.js";
 import { springs as w } from "./lib/motion.js";
 import { m as x } from "../_chunks/framer.js";
 const N = c(
@@ -42,32 +42,32 @@ const N = c(
     ...p
   }, g) => {
     const e = s == null;
-    return /* @__PURE__ */ o("div", { className: a("flex items-center gap-ds-03", n && "w-full"), children: [
-      /* @__PURE__ */ r(
+    return /* @__PURE__ */ o("div", { className: r("flex items-center gap-ds-03", n && "w-full"), children: [
+      /* @__PURE__ */ a(
         d,
         {
           ref: g,
           value: e ? null : s,
-          className: a(N({ size: u }), f),
+          className: r(N({ size: u }), f),
           ...p,
-          children: e ? /* @__PURE__ */ r(
+          children: e ? /* @__PURE__ */ a(
             l,
             {
-              className: a(
+              className: r(
                 m({ color: t }),
                 "w-2/5 animate-progress-indeterminate motion-reduce:animate-none",
                 i
               )
             }
-          ) : /* @__PURE__ */ r(
+          ) : /* @__PURE__ */ a(
             l,
             {
-              className: a("h-full", i),
+              className: r("h-full", i),
               asChild: !0,
-              children: /* @__PURE__ */ r(
+              children: /* @__PURE__ */ a(
                 x.div,
                 {
-                  className: a(m({ color: t })),
+                  className: r(m({ color: t })),
                   initial: !1,
                   animate: { width: `${s || 0}%` },
                   transition: w.smooth

package/dist/ui/segmented-control.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as d, jsxs as z } from "react/jsx-runtime";
 import D, { useState as k, useRef as I, useEffect as S, useCallback as R, useId as E } from "react";
-import { ay as H } from "../_chunks/vendor-utils.js";
+import { c as H } from "../_chunks/vendor-utils.js";
 import { cn as w } from "./lib/utils.js";
 import { springs as L } from "./lib/motion.js";
 import { L as T, m as C, A } from "../_chunks/framer.js";

package/dist/ui/select.js

@@ -3,7 +3,7 @@ import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import * as o from "react";
 import { ao as c, ap as g, aq as n, ar as m, as as w, at as p, au as N, av as f, aw as u, ax as v, ay as S, az as h, aA as I, aB as R, aC as C } from "../_chunks/primitives.js";
 import { IconChevronDown as y, IconChevronUp as j, IconCheck as B } from "@tabler/icons-react";
-import { ay as V } from "../_chunks/vendor-utils.js";
+import { c as V } from "../_chunks/vendor-utils.js";
 import { cn as r } from "./lib/utils.js";
 import { tweens as z, springs as T } from "./lib/motion.js";
 import { m as D } from "../_chunks/framer.js";

package/dist/ui/sheet.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx as r, jsxs as c } from "react/jsx-runtime";
 import * as o from "react";
-import { a9 as h, aa as R, ab as u, ac as x, ad as y, ae as b, af as P, ag as j } from "../_chunks/primitives.js";
-import { ay as T } from "../_chunks/vendor-utils.js";
+import { a9 as h, aa as R, ab as u, ac as x, ad as b, ae as y, af as P, ag as j } from "../_chunks/primitives.js";
+import { c as T } from "../_chunks/vendor-utils.js";
 import { IconX as A } from "@tabler/icons-react";
 import { cn as a } from "./lib/utils.js";
 import { tweens as M, motionProps as g, springs as z } from "./lib/motion.js";
@@ -116,23 +116,23 @@ const U = o.forwardRef(
 );
 U.displayName = "SheetFooter";
 const X = o.forwardRef(({ className: e, ...s }, t) => /* @__PURE__ */ r(
-  y,
+  b,
   {
     ref: t,
     className: a("text-ds-lg font-semibold text-surface-fg", e),
     ...s
   }
 ));
-X.displayName = y.displayName;
+X.displayName = b.displayName;
 const q = o.forwardRef(({ className: e, ...s }, t) => /* @__PURE__ */ r(
-  b,
+  y,
   {
     ref: t,
     className: a("text-ds-md text-surface-fg-muted", e),
     ...s
   }
 ));
-q.displayName = b.displayName;
+q.displayName = y.displayName;
 export {
   F as Sheet,
   Y as SheetClose,

package/dist/ui/sidebar.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as s, jsxs as h, Fragment as E } from "react/jsx-runtime";
 import { S as v } from "../_chunks/primitives.js";
-import { ay as T } from "../_chunks/vendor-utils.js";
+import { c as T } from "../_chunks/vendor-utils.js";
 import { IconLayoutSidebarLeftCollapse as A } from "@tabler/icons-react";
 import { useIsMobile as D } from "../hooks/use-mobile.js";
 import { springs as O } from "./lib/motion.js";
@@ -15,7 +15,7 @@ import { TooltipProvider as j, Tooltip as $, TooltipTrigger as F, TooltipContent
 import { createContext as V, forwardRef as i, useState as I, useCallback as C, useEffect as W, useMemo as k, useContext as q } from "react";
 import { m as U } from "../_chunks/framer.js";
 const X = "sidebar:state", Y = 60 * 60 * 24 * 7, J = "16rem", Q = "18rem", Z = "3rem", ee = "b", z = V(null);
-function y() {
+function N() {
   const a = q(z);
   if (!a)
     throw new Error("useSidebar must be used within a SidebarProvider.");
@@ -31,7 +31,7 @@ const ae = i(
     children: n,
     ...u
   }, f) => {
-    const c = D(), [b, p] = I(!1), [N, x] = I(a), g = e ?? N, S = C(
+    const c = D(), [b, p] = I(!1), [y, x] = I(a), g = e ?? y, S = C(
       (l) => {
         const m = typeof l == "function" ? l(g) : l;
         t ? t(m) : x(m), typeof document < "u" && (document.cookie = `${X}=${m}; path=/; max-age=${Y}`);
@@ -93,7 +93,7 @@ const te = i(
     children: o,
     ...n
   }, u) => {
-    const { isMobile: f, state: c, openMobile: b, setOpenMobile: p } = y();
+    const { isMobile: f, state: c, openMobile: b, setOpenMobile: p } = N();
     return t === "none" ? /* @__PURE__ */ s(
       "div",
       {
@@ -165,7 +165,7 @@ const te = i(
 );
 te.displayName = "Sidebar";
 const se = i(({ className: a, onClick: e, ...t }, d) => {
-  const { toggleSidebar: o } = y();
+  const { toggleSidebar: o } = N();
   return /* @__PURE__ */ h(
     R,
     {
@@ -188,7 +188,7 @@ const se = i(({ className: a, onClick: e, ...t }, d) => {
 se.displayName = "SidebarTrigger";
 const re = i(
   ({ className: a, ...e }, t) => {
-    const { toggleSidebar: d } = y();
+    const { toggleSidebar: d } = N();
     return /* @__PURE__ */ s(
       "button",
       {
@@ -400,7 +400,7 @@ const he = T(
     children: u,
     ...f
   }, c) => {
-    const b = a ? v : "button", { isMobile: p, state: N } = y(), x = /* @__PURE__ */ s(
+    const b = a ? v : "button", { isMobile: p, state: y } = N(), x = /* @__PURE__ */ s(
       b,
       {
         ref: c,
@@ -431,7 +431,7 @@ const he = T(
         {
           side: "right",
           align: "center",
-          hidden: N !== "collapsed" || p,
+          hidden: y !== "collapsed" || p,
           ...o
         }
       )
@@ -510,7 +510,7 @@ const we = i(({ className: a, showIcon: e = !1, ...t }, d) => {
   );
 });
 we.displayName = "SidebarMenuSkeleton";
-const ye = i(
+const Ne = i(
   ({ className: a, ...e }, t) => /* @__PURE__ */ s(
     "ul",
     {
@@ -525,11 +525,11 @@ const ye = i(
     }
   )
 );
-ye.displayName = "SidebarMenuSub";
-const Ne = i(
+Ne.displayName = "SidebarMenuSub";
+const ye = i(
   ({ ...a }, e) => /* @__PURE__ */ s("li", { ref: e, ...a })
 );
-Ne.displayName = "SidebarMenuSubItem";
+ye.displayName = "SidebarMenuSubItem";
 const Me = i(({ asChild: a = !1, size: e = "md", isActive: t, className: d, ...o }, n) => /* @__PURE__ */ s(
   a ? v : "a",
   {
@@ -566,12 +566,12 @@ export {
   ve as SidebarMenuButton,
   ge as SidebarMenuItem,
   we as SidebarMenuSkeleton,
-  ye as SidebarMenuSub,
+  Ne as SidebarMenuSub,
   Me as SidebarMenuSubButton,
-  Ne as SidebarMenuSubItem,
+  ye as SidebarMenuSubItem,
   ae as SidebarProvider,
   re as SidebarRail,
   le as SidebarSeparator,
   se as SidebarTrigger,
-  y as useSidebar
+  N as useSidebar
 };

package/dist/ui/skeleton.js

@@ -1,6 +1,6 @@
 import { jsx as l, jsxs as f } from "react/jsx-runtime";
 import * as o from "react";
-import { ay as g } from "../_chunks/vendor-utils.js";
+import { c as g } from "../_chunks/vendor-utils.js";
 import { cn as r } from "./lib/utils.js";
 const k = g("bg-skeleton-base", {
   variants: {

package/dist/ui/tabs.js

@@ -2,27 +2,27 @@
 import { jsx as s, jsxs as N } from "react/jsx-runtime";
 import { aS as h, aT as v, aU as b, aV as p } from "../_chunks/primitives.js";
 import * as t from "react";
-import { ay as g } from "../_chunks/vendor-utils.js";
+import { c as g } from "../_chunks/vendor-utils.js";
 import { cn as u } from "./lib/utils.js";
 import { springs as m, tweens as T } from "./lib/motion.js";
 import { L as w, m as f } from "../_chunks/framer.js";
-const x = t.createContext(void 0), I = t.forwardRef(({ value: a, defaultValue: i, onValueChange: e, ...n }, r) => {
-  const [o, c] = t.useState(a ?? i ?? "");
+const x = t.createContext(void 0), I = t.forwardRef(({ value: e, defaultValue: i, onValueChange: a, ...n }, r) => {
+  const [o, c] = t.useState(e ?? i ?? "");
   t.useEffect(() => {
-    a !== void 0 && c(a);
-  }, [a]);
+    e !== void 0 && c(e);
+  }, [e]);
   const d = t.useCallback(
     (l) => {
-      c(l), e == null || e(l);
+      c(l), a == null || a(l);
     },
-    [e]
+    [a]
   );
   return /* @__PURE__ */ s(x.Provider, { value: o, children: /* @__PURE__ */ s(
     h,
     {
       ref: r,
-      value: a,
-      defaultValue: a === void 0 ? i : void 0,
+      value: e,
+      defaultValue: e === void 0 ? i : void 0,
       onValueChange: d,
       ...n
     }
@@ -59,7 +59,7 @@ const y = t.createContext({
     },
     defaultVariants: { variant: "line" }
   }
-), R = t.forwardRef(({ className: a, variant: i, ...e }, n) => {
+), R = t.forwardRef(({ className: e, variant: i, ...a }, n) => {
   const r = i ?? "line", o = t.useId(), c = t.useMemo(
     () => ({ variant: r, layoutId: `tab-indicator-${o}` }),
     [r, o]
@@ -68,19 +68,19 @@ const y = t.createContext({
     v,
     {
       ref: n,
-      className: u(C({ variant: r }), a),
-      ...e
+      className: u(C({ variant: r }), e),
+      ...a
     }
   ) }) });
 });
 R.displayName = v.displayName;
-const V = t.forwardRef(({ className: a, variant: i, children: e, ...n }, r) => {
+const V = t.forwardRef(({ className: e, variant: i, children: a, ...n }, r) => {
   const o = t.useContext(y), c = t.useContext(x), d = i ?? o.variant, l = n.value === c;
   return /* @__PURE__ */ N(
     b,
     {
       ref: r,
-      className: u(L({ variant: d }), a),
+      className: u(L({ variant: d }), e),
       ...n,
       children: [
         d === "contained" && l && /* @__PURE__ */ s(
@@ -91,7 +91,7 @@ const V = t.forwardRef(({ className: a, variant: i, children: e, ...n }, r) => {
             transition: m.smooth
           }
         ),
-        /* @__PURE__ */ s("span", { className: "relative z-[1] inline-flex items-center gap-ds-02", children: e }),
+        /* @__PURE__ */ s("span", { className: "relative z-[1] inline-flex items-center gap-ds-02", children: a }),
         d === "line" && l && /* @__PURE__ */ s(
           f.span,
           {
@@ -105,15 +105,15 @@ const V = t.forwardRef(({ className: a, variant: i, children: e, ...n }, r) => {
   );
 });
 V.displayName = b.displayName;
-const j = t.forwardRef(({ className: a, children: i, ...e }, n) => /* @__PURE__ */ s(
+const j = t.forwardRef(({ className: e, children: i, ...a }, n) => /* @__PURE__ */ s(
   p,
   {
     ref: n,
     className: u(
       "mt-ds-05 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
-      a
+      e
     ),
-    ...e,
+    ...a,
     children: /* @__PURE__ */ s(
       f.div,
       {

package/dist/ui/text.js

@@ -1,5 +1,5 @@
 import * as e from "react";
-import { ay as o } from "../_chunks/vendor-utils.js";
+import { c as o } from "../_chunks/vendor-utils.js";
 import { cn as d } from "./lib/utils.js";
 const p = o("font-sans", {
   variants: {

package/dist/ui/textarea.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as c } from "react/jsx-runtime";
 import * as u from "react";
-import { ay as l } from "../_chunks/vendor-utils.js";
+import { c as l } from "../_chunks/vendor-utils.js";
 import { cn as m } from "./lib/utils.js";
 import { motionProps as f } from "./lib/motion.js";
 import { useFormField as b } from "./form.js";

package/dist/ui/toast.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as s, jsxs as d } from "react/jsx-runtime";
 import * as g from "react";
-import { t as f } from "../_chunks/vendor-client.js";
+import { t as f } from "../_chunks/sonner.js";
 import { IconInfoCircle as S, IconAlertTriangle as M, IconCircleX as O, IconCircleCheck as P, IconCheck as B, IconAlertCircle as U, IconPhoto as j, IconFile as L, IconRefresh as _, IconX as z, IconUpload as G } from "@tabler/icons-react";
 import { cn as b } from "./lib/utils.js";
 import { springs as p, tweens as y } from "./lib/motion.js";

package/dist/ui/toaster.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as t } from "react/jsx-runtime";
 import * as l from "react";
-import { T as f } from "../_chunks/vendor-client.js";
+import { T as f } from "../_chunks/sonner.js";
 import { cn as p } from "./lib/utils.js";
 const c = l.forwardRef(
   ({

package/dist/ui/toggle.js

@@ -2,7 +2,7 @@
 import { jsx as i } from "react/jsx-runtime";
 import * as n from "react";
 import { aH as e } from "../_chunks/primitives.js";
-import { ay as d } from "../_chunks/vendor-utils.js";
+import { c as d } from "../_chunks/vendor-utils.js";
 import { springs as m, motionProps as c } from "./lib/motion.js";
 import { cn as f } from "./lib/utils.js";
 import { m as l } from "../_chunks/framer.js";
@@ -25,14 +25,14 @@ const p = l.create(e), g = d(
       size: "md"
     }
   }
-), u = n.forwardRef(({ className: t, variant: s, size: o, ...a }, r) => /* @__PURE__ */ i(
+), u = n.forwardRef(({ className: t, variant: s, size: o, ...r }, a) => /* @__PURE__ */ i(
   p,
   {
-    ref: r,
+    ref: a,
     whileTap: { scale: 0.95 },
     transition: m.snappy,
     className: f(g({ variant: s, size: o }), t),
-    ...c(a)
+    ...c(r)
   }
 ));
 u.displayName = e.displayName;

package/llms-full.txt

@@ -5,7 +5,7 @@
 > All variant values and props verified from source CVA definitions.
 >
 > Package: @devalok/shilp-sutra
-> Version: 0.26.0
+> Version: 0.27.0
 
 ---
 

package/llms.txt

@@ -4,6 +4,22 @@
 > Built on the same primitives as shadcn/ui but with key API differences.
 > Read this file BEFORE writing any UI code. Do NOT guess from shadcn/ui knowledge.
 
+## BREAKING CHANGES (v0.27.0 — Externalized Dependencies)
+
+FilePreview and MarkdownViewer dependencies are now **external** (not bundled).
+Install them if you use these components:
+
+```bash
+pnpm add react-pdf react-zoom-pan-pinch react-syntax-highlighter
+```
+
+These are optional peerDependencies — consumers who don't use FilePreview or MarkdownViewer are unaffected.
+
+**Next.js optimization:** Add to your `next.config.js`:
+```js
+optimizePackageImports: ['@devalok/shilp-sutra']
+```
+
 ## BREAKING CHANGES (v0.23.0 — Semantic Surface & Shadow Tokens)
 
 **Surface tokens renamed:** Numeric `surface-1..4` replaced with semantic names.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devalok/shilp-sutra",
-  "version": "0.26.0",
+  "version": "0.27.0",
   "description": "Devalok Design System — tokens, components, and patterns for Next.js",
   "license": "MIT",
   "type": "module",
@@ -696,6 +696,9 @@
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19",
     "react-markdown": "^10.0.0",
+    "react-pdf": "^10.0.0",
+    "react-syntax-highlighter": "^15.0.0 || ^16.0.0",
+    "react-zoom-pan-pinch": "^3.0.0",
     "remark-gfm": "^4.0.0",
     "tailwindcss": "^3.4.0"
   },
@@ -748,6 +751,15 @@
     "react-markdown": {
       "optional": true
     },
+    "react-pdf": {
+      "optional": true
+    },
+    "react-syntax-highlighter": {
+      "optional": true
+    },
+    "react-zoom-pan-pinch": {
+      "optional": true
+    },
     "remark-gfm": {
       "optional": true
     },
@@ -759,7 +771,6 @@
     "@emoji-mart/data": "^1.2.1",
     "@emoji-mart/react": "^1.1.1",
     "@floating-ui/react-dom": "^2.1.7",
-    "@react-pdf/renderer": "^4.3.2",
     "@tabler/icons-react": "^3.37.1",
     "@tanstack/react-table": "^8.21.2",
     "@tanstack/react-virtual": "^3.13.19",
@@ -790,6 +801,7 @@
     "d3-time-format": "^4.1.0",
     "d3-transition": "^3.0.1",
     "date-fns": "^4.1.0",
+    "esbuild": "^0.27.4",
     "framer-motion": "^12.36.0",
     "input-otp": "^1.4.2",
     "react-markdown": "^10.1.0",