@devalok/shilp-sutra 0.3.1 → 0.4.0

package/dist/ui/radio.d.ts

@@ -3,5 +3,7 @@ import * as RadioGroupPrimitive from '../primitives/react-radio-group';
 import * as React from 'react';
 declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const RadioGroupItem: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export type RadioGroupProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>;
+export type RadioGroupItemProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>;
 export { RadioGroup, RadioGroupItem };
 //# sourceMappingURL=radio.d.ts.map

package/dist/ui/radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../src/ui/radio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,mBAAmB,MAAM,+BAA+B,CAAA;AAEpE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,QAAA,MAAM,UAAU,+JAKd,CAAA;AAGF,QAAA,MAAM,cAAc,yKAuBlB,CAAA;AAGF,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../src/ui/radio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,mBAAmB,MAAM,+BAA+B,CAAA;AAEpE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,QAAA,MAAM,UAAU,+JAKd,CAAA;AAGF,QAAA,MAAM,cAAc,yKAuBlB,CAAA;AAGF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,CAAA;AAC7F,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,CAAA;AAEjG,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/segmented-control.d.ts

@@ -2,13 +2,13 @@
 import { default as React } from 'react';
 declare const segmentedControlItemVariants: (props?: ({
     size?: "sm" | "md" | "lg" | null | undefined;
-    color?: "filled" | "tonal" | null | undefined;
+    variant?: "filled" | "tonal" | null | undefined;
     selected?: boolean | null | undefined;
     isHovered?: boolean | null | undefined;
     isDisabled?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type SegmentedControlSize = 'sm' | 'md' | 'lg' | 'small' | 'medium' | 'big';
-export type SegmentedControlColor = 'filled' | 'tonal';
+export type SegmentedControlVariant = 'filled' | 'tonal';
 /**
  * A single option in a `<SegmentedControl>`. The `id` must be unique across all options in
  * the same control — it is used as the selection key for `selectedId` and `onSelect`.
@@ -28,7 +28,7 @@ export interface SegmentedControlOption {
  * **`size`:** `'sm'` | `'md'` (default) | `'lg'`. Legacy aliases `'small'` | `'medium'` | `'big'` are
  * also accepted for backward compatibility but prefer the canonical form.
  *
- * **`color`:** `'tonal'` (default, subdued) | `'filled'` (vibrant brand color when selected).
+ * **`variant`:** `'tonal'` (default, subdued) | `'filled'` (vibrant brand color when selected).
  *
  * **Options:** Each option needs a unique `id`, a display `text`, and an optional `icon` component.
  *
@@ -38,7 +38,7 @@ export interface SegmentedControlOption {
  * // View mode switcher (list vs grid vs board):
  * <SegmentedControl
  *   size="md"
- *   color="tonal"
+ *   variant="tonal"
  *   options={[
  *     { id: 'list', text: 'List' },
  *     { id: 'grid', text: 'Grid' },
@@ -49,10 +49,10 @@ export interface SegmentedControlOption {
  * />
  *
  * @example
- * // Time range selector with filled color (more prominent):
+ * // Time range selector with filled variant (more prominent):
  * <SegmentedControl
  *   size="sm"
- *   color="filled"
+ *   variant="filled"
  *   options={[
  *     { id: '7d', text: '7D' },
  *     { id: '30d', text: '30D' },
@@ -65,7 +65,7 @@ export interface SegmentedControlOption {
  */
 export interface SegmentedControlProps {
     size: SegmentedControlSize;
-    color: SegmentedControlColor;
+    variant: SegmentedControlVariant;
     options: SegmentedControlOption[];
     selectedId: string;
     onSelect: (id: string) => void;
@@ -88,13 +88,13 @@ declare const SegmentedControl: React.ForwardRefExoticComponent<SegmentedControl
  *
  * <div role="tablist" className="inline-flex rounded-full border border-border bg-layer-02">
  *   <SegmentedControlItem
- *     size="md" color="tonal" text="List"
+ *     size="md" variant="tonal" text="List"
  *     isSelected={view === 'list'} isFocused={focused === 'list'}
  *     onClick={() => setView('list')}
  *     onFocus={() => setFocused('list')} onBlur={() => setFocused(null)}
  *   />
  *   <SegmentedControlItem
- *     size="md" color="tonal" text="Grid" icon={IconLayoutGrid}
+ *     size="md" variant="tonal" text="Grid" icon={IconLayoutGrid}
  *     isSelected={view === 'grid'} isFocused={focused === 'grid'}
  *     onClick={() => setView('grid')}
  *     onFocus={() => setFocused('grid')} onBlur={() => setFocused(null)}
@@ -105,7 +105,7 @@ declare const SegmentedControl: React.ForwardRefExoticComponent<SegmentedControl
  */
 export interface SegmentedControlItemProps {
     size: 'sm' | 'md' | 'lg';
-    color: SegmentedControlColor;
+    variant: SegmentedControlVariant;
     text: string;
     /** Optional icon component rendered before the text label. */
     icon?: React.ComponentType<{

package/dist/ui/segmented-control.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"segmented-control.d.ts","sourceRoot":"","sources":["../../src/ui/segmented-control.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAA;AAM/C,QAAA,MAAM,4BAA4B;;;;;;8EAsGjC,CAAA;AAqBD,MAAM,MAAM,oBAAoB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;AAClF,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,OAAO,CAAA;AAEtD;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACrC,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,8DAA8D;IAC9D,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CACnD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,oBAAoB,CAAA;IAC1B,KAAK,EAAE,qBAAqB,CAAA;IAC5B,OAAO,EAAE,sBAAsB,EAAE,CAAA;IACjC,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAGD,QAAA,MAAM,gBAAgB,8FAoFrB,CAAA;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACxB,KAAK,EAAE,qBAAqB,CAAA;IAC5B,IAAI,EAAE,MAAM,CAAA;IACZ,8DAA8D;IAC9D,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IAClD,UAAU,EAAE,OAAO,CAAA;IACnB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,MAAM,EAAE,MAAM,IAAI,CAAA;CACnB;AAED,QAAA,MAAM,oBAAoB,qGA0FzB,CAAA;AAGD,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,4BAA4B,EAAE,CAAA"}
+{"version":3,"file":"segmented-control.d.ts","sourceRoot":"","sources":["../../src/ui/segmented-control.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAA;AAM/C,QAAA,MAAM,4BAA4B;;;;;;8EAsGjC,CAAA;AAqBD,MAAM,MAAM,oBAAoB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;AAClF,MAAM,MAAM,uBAAuB,GAAG,QAAQ,GAAG,OAAO,CAAA;AAExD;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACrC,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,8DAA8D;IAC9D,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CACnD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,oBAAoB,CAAA;IAC1B,OAAO,EAAE,uBAAuB,CAAA;IAChC,OAAO,EAAE,sBAAsB,EAAE,CAAA;IACjC,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAGD,QAAA,MAAM,gBAAgB,8FAoFrB,CAAA;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACxB,OAAO,EAAE,uBAAuB,CAAA;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,8DAA8D;IAC9D,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IAClD,UAAU,EAAE,OAAO,CAAA;IACnB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,MAAM,EAAE,MAAM,IAAI,CAAA;CACnB;AAED,QAAA,MAAM,oBAAoB,qGA0FzB,CAAA;AAGD,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,4BAA4B,EAAE,CAAA"}

package/dist/ui/segmented-control.js

@@ -21,7 +21,7 @@ const z = S(
         md: "px-ds-02b py-ds-03 pl-ds-04 text-ds-md",
         lg: "h-[56px] px-ds-06 py-ds-05 text-ds-md"
       },
-      color: {
+      variant: {
         filled: "text-text-on-color [text-shadow:0px_1px_1px_var(--color-text-shadow)]",
         tonal: "text-text-tertiary"
       },
@@ -42,7 +42,7 @@ const z = S(
       // Selected + filled
       {
         selected: !0,
-        color: "filled",
+        variant: "filled",
         className: [
           "bg-interactive",
           "shadow-[0px_1px_3px_0.05px_var(--color-interactive-hover),inset_0px_8px_16px_0px_var(--color-inset-glow-strong),inset_0px_2px_0px_0px_var(--color-inset-glow-subtle)]"
@@ -51,13 +51,13 @@ const z = S(
       // Selected + tonal
       {
         selected: !0,
-        color: "tonal",
+        variant: "tonal",
         className: "bg-field text-text-primary"
       },
       // Hover + filled
       {
         isHovered: !0,
-        color: "filled",
+        variant: "filled",
         className: [
           "bg-interactive",
           "shadow-[0px_4px_8px_0px_var(--color-interactive-hover),0px_1px_3px_0.05px_var(--color-layer-02),inset_0px_8px_16px_0px_var(--color-inset-glow-strong),inset_0px_2px_0px_0px_var(--color-inset-glow-subtle)]"
@@ -66,29 +66,29 @@ const z = S(
       // Hover + tonal
       {
         isHovered: !0,
-        color: "tonal",
+        variant: "tonal",
         className: "text-text-primary"
       },
       // Disabled + filled
       {
         isDisabled: !0,
-        color: "filled",
+        variant: "filled",
         className: "text-text-placeholder"
       },
       // Disabled + tonal
       {
         isDisabled: !0,
-        color: "tonal",
+        variant: "tonal",
         className: "text-text-placeholder"
       },
       // Filled + SVG icon fill
       {
-        color: "filled",
+        variant: "filled",
         className: "[&_svg_path]:fill-icon-on-color"
       },
       // Filled + disabled SVG icon fill
       {
-        color: "filled",
+        variant: "filled",
         isDisabled: !0,
         className: "[&_svg_path]:fill-icon-disabled"
       },
@@ -100,7 +100,7 @@ const z = S(
     ],
     defaultVariants: {
       size: "md",
-      color: "tonal",
+      variant: "tonal",
       selected: !1,
       isHovered: !1,
       isDisabled: !1
@@ -119,43 +119,43 @@ function j(p) {
 }
 const E = w.forwardRef(
   function({
-    size: h,
-    color: x,
-    options: o,
+    size: g,
+    variant: x,
+    options: s,
     selectedId: m,
-    onSelect: d,
+    onSelect: i,
     disabled: f = !1,
     className: t = ""
-  }, s) {
-    const b = j(h), [_, i] = D(null), v = M(null), a = w.useCallback((e) => {
-      v.current = e, typeof s == "function" ? s(e) : s && (s.current = e);
-    }, [s]), y = (e) => {
+  }, n) {
+    const h = j(g), [v, d] = D(null), b = M(null), l = w.useCallback((e) => {
+      b.current = e, typeof n == "function" ? n(e) : n && (n.current = e);
+    }, [n]), y = (e) => {
       if (f) return;
-      const r = o.findIndex((g) => g.id === _);
-      let l = r;
+      const o = s.findIndex((_) => _.id === v);
+      let a = o;
       switch (e.key) {
         case "ArrowLeft":
-          e.preventDefault(), l = r > 0 ? r - 1 : o.length - 1;
+          e.preventDefault(), a = o > 0 ? o - 1 : s.length - 1;
           break;
         case "ArrowRight":
-          e.preventDefault(), l = r < o.length - 1 ? r + 1 : 0;
+          e.preventDefault(), a = o < s.length - 1 ? o + 1 : 0;
           break;
         case "Home":
-          e.preventDefault(), l = 0;
+          e.preventDefault(), a = 0;
           break;
         case "End":
-          e.preventDefault(), l = o.length - 1;
+          e.preventDefault(), a = s.length - 1;
           break;
         default:
           return;
       }
-      const c = o[l];
-      i(c.id), d(c.id);
+      const c = s[a];
+      d(c.id), i(c.id);
     };
     return /* @__PURE__ */ u(
       "div",
       {
-        ref: a,
+        ref: l,
         className: N(
           "inline-flex gap-0 p-0 rounded-ds-full",
           "bg-layer-02",
@@ -166,19 +166,19 @@ const E = w.forwardRef(
         onKeyDown: y,
         tabIndex: -1,
         "aria-label": "Segmented control options",
-        children: o.map((e) => /* @__PURE__ */ u(
+        children: s.map((e) => /* @__PURE__ */ u(
           k,
           {
-            size: b,
-            color: x,
+            size: h,
+            variant: x,
             text: e.text,
             icon: e.icon,
             isSelected: e.id === m,
-            onClick: () => d(e.id),
+            onClick: () => i(e.id),
             disabled: f,
-            isFocused: e.id === _,
-            onFocus: () => i(e.id),
-            onBlur: () => i(null)
+            isFocused: e.id === v,
+            onFocus: () => d(e.id),
+            onBlur: () => d(null)
           },
           e.id
         ))
@@ -189,57 +189,57 @@ const E = w.forwardRef(
 E.displayName = "SegmentedControl";
 const k = w.forwardRef(
   function({
-    size: h,
-    color: x,
-    text: o,
+    size: g,
+    variant: x,
+    text: s,
     icon: m,
-    isSelected: d,
+    isSelected: i,
     onClick: f,
     disabled: t = !1,
-    isFocused: s,
-    onFocus: b,
-    onBlur: _
-  }, i) {
-    const [v, a] = D("default"), { ripples: y, createRipple: e } = I(), r = () => {
-      !t && !s && a("hover");
-    }, l = () => {
-      t || a("default");
+    isFocused: n,
+    onFocus: h,
+    onBlur: v
+  }, d) {
+    const [b, l] = D("default"), { ripples: y, createRipple: e } = I(), o = () => {
+      !t && !n && l("hover");
+    }, a = () => {
+      t || l("default");
     }, c = () => {
-      t || a("pressed");
-    }, g = () => {
-      t || a("hover");
+      t || l("pressed");
+    }, _ = () => {
+      t || l("hover");
     };
     return /* @__PURE__ */ C(
       "button",
       {
-        ref: i,
+        ref: d,
         className: N(
           z({
-            size: h,
-            color: x,
-            selected: d,
-            isHovered: v === "hover",
+            size: g,
+            variant: x,
+            selected: i,
+            isHovered: b === "hover",
             isDisabled: t
           })
         ),
-        onClick: (n) => {
-          e(n), f();
+        onClick: (r) => {
+          e(r), f();
         },
         disabled: t,
         type: "button",
         role: "tab",
-        "aria-selected": d,
+        "aria-selected": i,
         "aria-disabled": t,
-        onMouseEnter: r,
-        onMouseLeave: l,
+        onMouseEnter: o,
+        onMouseLeave: a,
         onMouseDown: c,
-        onMouseUp: g,
+        onMouseUp: _,
         onTouchStart: c,
-        onTouchEnd: g,
-        onFocus: b,
-        onBlur: _,
+        onTouchEnd: _,
+        onFocus: h,
+        onBlur: v,
         children: [
-          y.map((n) => /* @__PURE__ */ u(
+          y.map((r) => /* @__PURE__ */ u(
             "span",
             {
               className: N(
@@ -247,16 +247,16 @@ const k = w.forwardRef(
                 H[x]
               ),
               style: {
-                left: n.x,
-                top: n.y,
-                width: n.size,
-                height: n.size
+                left: r.x,
+                top: r.y,
+                width: r.size,
+                height: r.size
               }
             },
-            n.id
+            r.id
           )),
           m && /* @__PURE__ */ u(m, { className: "h-ico-sm w-ico-sm shrink-0" }),
-          /* @__PURE__ */ u("span", { className: "font-accent leading-none", children: o })
+          /* @__PURE__ */ u("span", { className: "font-accent leading-none", children: s })
         ]
       }
     );

package/dist/ui/separator.d.ts

@@ -2,5 +2,6 @@
 import * as React from 'react';
 import * as SeparatorPrimitive from '../primitives/react-separator';
 declare const Separator: React.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type SeparatorProps = React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>;
 export { Separator };
 //# sourceMappingURL=separator.d.ts.map

package/dist/ui/separator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"separator.d.ts","sourceRoot":"","sources":["../../src/ui/separator.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,6BAA6B,CAAA;AAIjE,QAAA,MAAM,SAAS,6JAoBd,CAAA;AAGD,OAAO,EAAE,SAAS,EAAE,CAAA"}
+{"version":3,"file":"separator.d.ts","sourceRoot":"","sources":["../../src/ui/separator.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,6BAA6B,CAAA;AAIjE,QAAA,MAAM,SAAS,6JAoBd,CAAA;AAGD,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,CAAA;AAE3F,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/dist/ui/toast.d.ts

@@ -5,7 +5,7 @@ import * as ToastPrimitives from '../primitives/react-toast';
 declare const ToastProvider: React.FC<ToastPrimitives.ToastProviderProps>;
 declare const ToastViewport: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastViewportProps & React.RefAttributes<HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
 declare const Toast: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastProps & React.RefAttributes<HTMLLIElement>, "ref"> & VariantProps<(props?: ({
-    color?: "default" | "error" | "warning" | "success" | "info" | null | undefined;
+    color?: "error" | "warning" | "success" | "neutral" | "info" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string> & React.RefAttributes<HTMLLIElement>>;
 declare const ToastAction: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 declare const ToastClose: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastCloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/ui/toast.js

@@ -22,7 +22,7 @@ const v = u(
   {
     variants: {
       color: {
-        default: "border-border bg-layer-01 text-text-primary",
+        neutral: "border-border bg-layer-01 text-text-primary",
         success: "border-success-border bg-success-surface text-success-text",
         warning: "border-warning-border bg-warning-surface text-warning-text",
         error: "destructive group border-border-error bg-error-surface text-error-text",
@@ -30,7 +30,7 @@ const v = u(
       }
     },
     defaultVariants: {
-      color: "default"
+      color: "neutral"
     }
   }
 ), w = r.forwardRef(({ className: e, color: t, ...o }, f) => /* @__PURE__ */ s(

package/dist/ui/toaster.d.ts

@@ -34,7 +34,7 @@
  * import { toast } from '@devalok/shilp-sutra'
  * toast({ title: 'Deleted', color: 'error' })
  *
- * // Valid colors: 'default' | 'success' | 'warning' | 'error' | 'info'
+ * // Valid colors: 'neutral' | 'success' | 'warning' | 'error' | 'info'
  */
 export declare function Toaster(): import("react/jsx-runtime").JSX.Element;
 export declare namespace Toaster {

package/dist/ui/toggle-group.d.ts

@@ -1,5 +1,6 @@
 "use client";
 import { VariantProps } from 'class-variance-authority';
+import { toggleVariants } from './toggle';
 import * as React from 'react';
 import * as ToggleGroupPrimitive from '../primitives/react-toggle-group';
 declare const ToggleGroup: React.ForwardRefExoticComponent<((Omit<ToggleGroupPrimitive.ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<ToggleGroupPrimitive.ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement>, "ref">) & VariantProps<(props?: ({
@@ -10,5 +11,7 @@ declare const ToggleGroupItem: React.ForwardRefExoticComponent<Omit<ToggleGroupP
     variant?: "outline" | "default" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
+export type ToggleGroupProps = React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>;
+export type ToggleGroupItemProps = React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>;
 export { ToggleGroup, ToggleGroupItem };
 //# sourceMappingURL=toggle-group.d.ts.map

package/dist/ui/toggle-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-group.d.ts","sourceRoot":"","sources":["../../src/ui/toggle-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,oBAAoB,MAAM,gCAAgC,CAAA;AACtE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAY5D,QAAA,MAAM,WAAW;;;uHAcf,CAAA;AAGF,QAAA,MAAM,eAAe;;;yHAoBnB,CAAA;AAGF,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,CAAA"}
+{"version":3,"file":"toggle-group.d.ts","sourceRoot":"","sources":["../../src/ui/toggle-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,oBAAoB,MAAM,gCAAgC,CAAA;AACtE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAG5D,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AASzC,QAAA,MAAM,WAAW;;;uHAcf,CAAA;AAGF,QAAA,MAAM,eAAe;;;yHAoBnB,CAAA;AAGF,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAC7F,YAAY,CAAC,OAAO,cAAc,CAAC,CAAA;AACrC,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GACjG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAA;AAErC,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,CAAA"}

package/dist/ui/toggle.d.ts

@@ -10,5 +10,6 @@ declare const Toggle: React.ForwardRefExoticComponent<Omit<TogglePrimitive.Toggl
     variant?: "outline" | "default" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
+export type ToggleProps = React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>;
 export { Toggle, toggleVariants };
 //# sourceMappingURL=toggle.d.ts.map

package/dist/ui/toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../src/ui/toggle.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,0BAA0B,CAAA;AAC3D,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,cAAc;;;8EAqBnB,CAAA;AAED,QAAA,MAAM,MAAM;;;yHAUV,CAAA;AAGF,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../src/ui/toggle.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,0BAA0B,CAAA;AAC3D,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,cAAc;;;8EAqBnB,CAAA;AAED,QAAA,MAAM,MAAM;;;yHAUV,CAAA;AAGF,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GACnF,YAAY,CAAC,OAAO,cAAc,CAAC,CAAA;AAErC,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/toggle.js

@@ -27,7 +27,7 @@ const m = n(
   e,
   {
     ref: a,
-    className: l(m({ variant: s, size: i, className: t })),
+    className: l(m({ variant: s, size: i }), t),
     ...o
   }
 ));

package/dist/ui/tree-view/tree-item.d.ts

@@ -17,6 +17,8 @@ export interface TreeItemProps {
     children?: React.ReactNode;
     /** Depth level (used internally) */
     depth?: number;
+    /** Additional CSS class names */
+    className?: string;
 }
 declare const TreeItem: React.ForwardRefExoticComponent<TreeItemProps & React.RefAttributes<HTMLLIElement>>;
 export { TreeItem };

package/dist/ui/tree-view/tree-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tree-item.d.ts","sourceRoot":"","sources":["../../../src/ui/tree-view/tree-item.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,MAAM,WAAW,aAAa;IAC5B,2CAA2C;IAC3C,MAAM,EAAE,MAAM,CAAA;IACd,4BAA4B;IAC5B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,8CAA8C;IAC9C,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,uDAAuD;IACvD,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAChC,oDAAoD;IACpD,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wBAAwB;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,QAAA,MAAM,QAAQ,qFAkMb,CAAA;AAGD,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"tree-item.d.ts","sourceRoot":"","sources":["../../../src/ui/tree-view/tree-item.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,MAAM,WAAW,aAAa;IAC5B,2CAA2C;IAC3C,MAAM,EAAE,MAAM,CAAA;IACd,4BAA4B;IAC5B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,8CAA8C;IAC9C,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,uDAAuD;IACvD,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAChC,oDAAoD;IACpD,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wBAAwB;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,QAAQ,qFAoMb,CAAA;AAGD,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/ui/tree-view/tree-item.js

@@ -1,11 +1,11 @@
 "use client";
 import { jsxs as C, jsx as r } from "react/jsx-runtime";
-import { IconChevronRight as D } from "@tabler/icons-react";
+import { IconChevronRight as P } from "@tabler/icons-react";
 import * as s from "react";
 import { cn as m } from "../lib/utils.js";
-import { Checkbox as P } from "../checkbox.js";
-import { useTreeContext as R } from "./tree-view.js";
-const S = s.forwardRef(
+import { Checkbox as R } from "../checkbox.js";
+import { useTreeContext as S } from "./tree-view.js";
+const j = s.forwardRef(
   ({
     itemId: n,
     label: y,
@@ -14,13 +14,14 @@ const S = s.forwardRef(
     actions: g,
     disabled: o = !1,
     children: d,
-    depth: p = 0
-  }, N) => {
-    const t = R(), a = s.Children.count(d) > 0, i = t.tree.isExpanded(n), c = t.tree.isSelected(n), w = (e) => {
+    depth: p = 0,
+    className: N
+  }, w) => {
+    const t = S(), a = s.Children.count(d) > 0, i = t.tree.isExpanded(n), c = t.tree.isSelected(n), b = (e) => {
       o || t.tree.select(n, e);
-    }, b = (e) => {
-      e.stopPropagation(), !o && t.tree.toggle(n);
     }, E = (e) => {
+      e.stopPropagation(), !o && t.tree.toggle(n);
+    }, D = (e) => {
       o || ((e.key === "Enter" || e.key === " ") && (e.preventDefault(), t.tree.select(n)), e.key === "ArrowRight" && a && !i && (e.preventDefault(), e.stopPropagation(), t.tree.toggle(n)), e.key === "ArrowLeft" && a && i && (e.preventDefault(), e.stopPropagation(), t.tree.toggle(n)));
     }, x = s.useMemo(() => {
       if (!t.checkboxes || !a)
@@ -39,7 +40,7 @@ const S = s.forwardRef(
     return /* @__PURE__ */ C(
       "li",
       {
-        ref: N,
+        ref: w,
         role: "treeitem",
         "aria-expanded": a ? i : void 0,
         "aria-selected": c,
@@ -53,15 +54,16 @@ const S = s.forwardRef(
               role: "presentation",
               "data-tree-item": n,
               tabIndex: o ? -1 : 0,
-              onClick: w,
-              onKeyDown: E,
+              onClick: b,
+              onKeyDown: D,
               style: { paddingLeft: p * 20 + 8 },
               className: m(
                 "flex items-center gap-ds-02 py-ds-02 px-ds-02 rounded-ds-md cursor-pointer transition-colors duration-fast-01",
                 "hover:bg-layer-02",
                 "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus",
                 c && "bg-interactive-selected text-text-interactive",
-                o && "opacity-[0.38] cursor-not-allowed pointer-events-none"
+                o && "opacity-[0.38] cursor-not-allowed pointer-events-none",
+                N
               ),
               children: [
                 a ? /* @__PURE__ */ r(
@@ -70,10 +72,10 @@ const S = s.forwardRef(
                     type: "button",
                     tabIndex: -1,
                     "aria-hidden": "true",
-                    onClick: b,
+                    onClick: E,
                     className: "flex shrink-0 items-center justify-center p-0 border-0 bg-transparent cursor-pointer",
                     children: /* @__PURE__ */ r(
-                      D,
+                      P,
                       {
                         size: 16,
                         className: m(
@@ -85,7 +87,7 @@ const S = s.forwardRef(
                   }
                 ) : /* @__PURE__ */ r("span", { className: "inline-block w-4 shrink-0", "aria-hidden": "true" }),
                 t.checkboxes && /* @__PURE__ */ r(
-                  P,
+                  R,
                   {
                     checked: x.checked,
                     indeterminate: x.indeterminate,
@@ -131,7 +133,7 @@ const S = s.forwardRef(
     );
   }
 );
-S.displayName = "TreeItem";
+j.displayName = "TreeItem";
 export {
-  S as TreeItem
+  j as TreeItem
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devalok/shilp-sutra",
-  "version": "0.3.1",
+  "version": "0.4.0",
   "description": "Devalok Design System — tokens, components, and patterns for Next.js",
   "license": "MIT",
   "type": "module",