@devalok/shilp-sutra 0.36.0 → 0.37.0-next.0

package/dist/tokens/shilp-sutra.css

@@ -0,0 +1,41 @@
+/* ═══════════════════════════════════════════════════════════════════
+   @devalok/shilp-sutra — TW4-native consumer entry point
+
+   Consumers import this ONCE in their global stylesheet:
+
+     // app/globals.css
+     @import "tailwindcss";
+     @import "@devalok/shilp-sutra/css";
+
+   That's the whole setup. No `tailwind.config.ts`, no `@config`, no
+   JS preset. TW4 reads the @theme, @utility, @custom-variant, and
+   @source directives in this file and auto-generates the design
+   system's utility surface.
+   ═══════════════════════════════════════════════════════════════════ */
+
+/* Token layer — matches the internal `./tokens` export order.
+   If you add files here, also update `./tokens/index.css` for the
+   legacy subpath. */
+@import "./primitives.css";
+@import "./semantic.css";
+@import "./typography.css";
+@import "./typography-semantic.css";
+@import "./base.css";
+@import "./animations.css";
+@import "./utilities.css";
+@import "./variants.css";
+
+/* TW4 content detection — scan our shipped dist JS for utility classes
+   so consumers don't have to configure "content" for us.
+
+   Priority order is deliberate:
+     1. Relative-path form: from dist/tokens/shilp-sutra.css up to dist/.
+        Under pnpm strict-hoist this always lands on the real (non-symlinked)
+        dist directory, so TW4 can read our compiled JS no matter how the
+        consumer package manager laid things out.
+     2. Package-name form: fallback via Node package resolution. Works on
+        npm/yarn and on pnpm with shamefully-hoist, but can miss under
+        strict-hoist depending on the TW4 resolver version. */
+@source "../../dist";
+@source "@devalok/shilp-sutra";
+

package/dist/tokens/typography-semantic.css

@@ -1,5 +1,5 @@
 /* ═══════════════════════════════════════════════════════════════════
-   SEMANTIC TYPOGRAPHY VARIANTS
+   SEMANTIC TYPOGRAPHY VARIANTS (TW4 native)
    Maps raw type scale tokens → meaningful component names.
 
    Migration guide from legacy classes:
@@ -11,113 +11,120 @@
      B3-Reg  → body-sm        B4-Reg  → body-xs
      L1      → label-lg       L2      → label-md
      L3      → label-sm       L4      → label-xs
+
+   The `--typo-*` tokens below are INTERNAL composite values — they
+   group (size, weight, leading, tracking) per semantic variant so the
+   `@utility text-heading-xl { ... }` rules in utilities.css can inject
+   all four properties in one class. They stay in `:root`, NOT `@theme`,
+   because they don't map to a TW4 utility namespace directly — they're
+   read by our custom `@utility` rules.
    ═══════════════════════════════════════════════════════════════════ */
 
 :root {
   /* ── Heading Variants ──────────────────────── */
-  --typo-heading-2xl-size:     var(--font-size-6xl);
+  --typo-heading-2xl-size:     var(--text-ds-6xl);
   --typo-heading-2xl-weight:   var(--font-weight-regular);
-  --typo-heading-2xl-leading:  var(--line-height-tight);
+  --typo-heading-2xl-leading:  var(--leading-ds-tight);
   --typo-heading-2xl-tracking: -0.025em;
 
-  --typo-heading-xl-size:      var(--font-size-5xl);
+  --typo-heading-xl-size:      var(--text-ds-5xl);
   --typo-heading-xl-weight:    var(--font-weight-regular);
-  --typo-heading-xl-leading:   var(--line-height-tight);
+  --typo-heading-xl-leading:   var(--leading-ds-tight);
   --typo-heading-xl-tracking:  -0.025em;
 
-  --typo-heading-lg-size:      var(--font-size-4xl);
+  --typo-heading-lg-size:      var(--text-ds-4xl);
   --typo-heading-lg-weight:    var(--font-weight-regular);
-  --typo-heading-lg-leading:   var(--line-height-tight);
+  --typo-heading-lg-leading:   var(--leading-ds-tight);
   --typo-heading-lg-tracking:  -0.02em;
 
-  --typo-heading-md-size:      var(--font-size-3xl);
+  --typo-heading-md-size:      var(--text-ds-3xl);
   --typo-heading-md-weight:    var(--font-weight-regular);
-  --typo-heading-md-leading:   var(--line-height-tight);
+  --typo-heading-md-leading:   var(--leading-ds-tight);
   --typo-heading-md-tracking:  -0.02em;
 
-  --typo-heading-sm-size:      var(--font-size-2xl);
+  --typo-heading-sm-size:      var(--text-ds-2xl);
   --typo-heading-sm-weight:    var(--font-weight-regular);
-  --typo-heading-sm-leading:   var(--line-height-snug);
+  --typo-heading-sm-leading:   var(--leading-ds-snug);
   --typo-heading-sm-tracking:  -0.015em;
 
-  --typo-heading-xs-size:      var(--font-size-xl);
+  --typo-heading-xs-size:      var(--text-ds-xl);
   --typo-heading-xs-weight:    var(--font-weight-regular);
-  --typo-heading-xs-leading:   var(--line-height-snug);
+  --typo-heading-xs-leading:   var(--leading-ds-snug);
   --typo-heading-xs-tracking:  0;
 
   /* ── Body Variants ─────────────────────────── */
-  --typo-body-lg-size:         var(--font-size-base);
+  --typo-body-lg-size:         var(--text-ds-base);
   --typo-body-lg-weight:       var(--font-weight-regular);
-  --typo-body-lg-leading:      var(--line-height-relaxed);
+  --typo-body-lg-leading:      var(--leading-ds-relaxed);
   --typo-body-lg-tracking:     -0.01em;  /* was -0.02em; loosened for readability */
 
-  --typo-body-md-size:         var(--font-size-md);
+  --typo-body-md-size:         var(--text-ds-md);
   --typo-body-md-weight:       var(--font-weight-regular);
-  --typo-body-md-leading:      var(--line-height-relaxed);
+  --typo-body-md-leading:      var(--leading-ds-relaxed);
   --typo-body-md-tracking:     0em;     /* was -0.02em; neutral at 14px */
 
-  --typo-body-sm-size:         var(--font-size-sm);
+  --typo-body-sm-size:         var(--text-ds-sm);
   --typo-body-sm-weight:       var(--font-weight-regular);
-  --typo-body-sm-leading:      var(--line-height-relaxed);
+  --typo-body-sm-leading:      var(--leading-ds-relaxed);
   --typo-body-sm-tracking:     0.01em;  /* was -0.02em; positive for small text legibility */
 
-  --typo-body-xs-size:         var(--font-size-xs);
+  --typo-body-xs-size:         var(--text-ds-xs);
   --typo-body-xs-weight:       var(--font-weight-regular);
-  --typo-body-xs-leading:      var(--line-height-relaxed);
+  --typo-body-xs-leading:      var(--leading-ds-relaxed);
   --typo-body-xs-tracking:     0.02em;  /* was -0.02em; positive for tiny text legibility */
 
   /* ── Label Variants (uppercase UI labels) ─── */
-  --typo-label-lg-size:        var(--font-size-base);
+  --typo-label-lg-size:        var(--text-ds-base);
   --typo-label-lg-weight:      var(--font-weight-semibold);
-  --typo-label-lg-leading:     var(--line-height-snug);
+  --typo-label-lg-leading:     var(--leading-ds-snug);
   --typo-label-lg-tracking:    0.06em;
 
-  --typo-label-md-size:        var(--font-size-md);
+  --typo-label-md-size:        var(--text-ds-md);
   --typo-label-md-weight:      var(--font-weight-semibold);
-  --typo-label-md-leading:     var(--line-height-snug);
+  --typo-label-md-leading:     var(--leading-ds-snug);
   --typo-label-md-tracking:    0.06em;
 
-  --typo-label-sm-size:        var(--font-size-sm);
+  --typo-label-sm-size:        var(--text-ds-sm);
   --typo-label-sm-weight:      var(--font-weight-semibold);
-  --typo-label-sm-leading:     var(--line-height-snug);
+  --typo-label-sm-leading:     var(--leading-ds-snug);
   --typo-label-sm-tracking:    0.06em;
 
-  --typo-label-xs-size:        var(--font-size-xs);
+  --typo-label-xs-size:        var(--text-ds-xs);
   --typo-label-xs-weight:      var(--font-weight-semibold);
-  --typo-label-xs-leading:     var(--line-height-snug);
+  --typo-label-xs-leading:     var(--leading-ds-snug);
   --typo-label-xs-tracking:    0.06em;
 
   /* ── Label Plain (mixed-case, no text-transform) ── */
-  --typo-label-plain-lg-size:   var(--font-size-base);
+  --typo-label-plain-lg-size:   var(--text-ds-base);
   --typo-label-plain-lg-weight: var(--font-weight-semibold);
-  --typo-label-plain-lg-leading: var(--line-height-snug);
+  --typo-label-plain-lg-leading: var(--leading-ds-snug);
   --typo-label-plain-lg-tracking: 0em;
 
-  --typo-label-plain-md-size:   var(--font-size-md);
+  --typo-label-plain-md-size:   var(--text-ds-md);
   --typo-label-plain-md-weight: var(--font-weight-semibold);
-  --typo-label-plain-md-leading: var(--line-height-snug);
+  --typo-label-plain-md-leading: var(--leading-ds-snug);
   --typo-label-plain-md-tracking: 0em;
 
-  --typo-label-plain-sm-size:   var(--font-size-sm);
+  --typo-label-plain-sm-size:   var(--text-ds-sm);
   --typo-label-plain-sm-weight: var(--font-weight-semibold);
-  --typo-label-plain-sm-leading: var(--line-height-snug);
+  --typo-label-plain-sm-leading: var(--leading-ds-snug);
   --typo-label-plain-sm-tracking: 0em;
 
   /* ── Caption & Overline ────────────────────── */
-  --typo-caption-size:         var(--font-size-sm);
+  --typo-caption-size:         var(--text-ds-sm);
   --typo-caption-weight:       var(--font-weight-regular);
-  --typo-caption-leading:      var(--line-height-normal);
+  --typo-caption-leading:      var(--leading-ds-normal);
   --typo-caption-tracking:     0.025em;
 
-  --typo-overline-size:        var(--font-size-sm);
+  --typo-overline-size:        var(--text-ds-sm);
   --typo-overline-weight:      var(--font-weight-regular);
-  --typo-overline-leading:     var(--line-height-loose);
+  --typo-overline-leading:     var(--leading-ds-loose);
   --typo-overline-tracking:    0.08em;
 
   /* ── Code (monospace) ──────────────────────── */
-  --typo-code-size:            var(--font-size-sm);
+  --typo-code-size:            var(--text-ds-sm);
   --typo-code-weight:          var(--font-weight-regular);
-  --typo-code-leading:         var(--line-height-normal);
+  --typo-code-leading:         var(--leading-ds-normal);
   --typo-code-tracking:        0em;
   --typo-code-font:            var(--font-mono);
 }

package/dist/tokens/utilities.css

@@ -0,0 +1,276 @@
+/* ═══════════════════════════════════════════════════════════════════
+   CUSTOM UTILITIES (TW4 native)
+
+   `@utility <name>` declares a Tailwind 4 custom utility. Unlike plain
+   CSS classes, @utility participates in TW4's variant system — so you
+   can write `md:text-heading-xl`, `hover:focus-ring`, etc.
+
+   Migrated from the JS preset's `plugin(({ addBase, addUtilities }))`
+   block in 0.37.0.
+   ═══════════════════════════════════════════════════════════════════ */
+
+/* ───────────────────────────────────────────────────────────────────
+   TYPOGRAPHY COMPOSITES
+
+   Each variant sets font-size, font-weight, line-height, letter-spacing
+   in one class. Source of values: typography-semantic.css (--typo-*).
+   ─────────────────────────────────────────────────────────────────── */
+
+@utility text-heading-2xl {
+  font-size:      var(--typo-heading-2xl-size);
+  font-weight:    var(--typo-heading-2xl-weight);
+  line-height:    var(--typo-heading-2xl-leading);
+  letter-spacing: var(--typo-heading-2xl-tracking);
+}
+
+@utility text-heading-xl {
+  font-size:      var(--typo-heading-xl-size);
+  font-weight:    var(--typo-heading-xl-weight);
+  line-height:    var(--typo-heading-xl-leading);
+  letter-spacing: var(--typo-heading-xl-tracking);
+}
+
+@utility text-heading-lg {
+  font-size:      var(--typo-heading-lg-size);
+  font-weight:    var(--typo-heading-lg-weight);
+  line-height:    var(--typo-heading-lg-leading);
+  letter-spacing: var(--typo-heading-lg-tracking);
+}
+
+@utility text-heading-md {
+  font-size:      var(--typo-heading-md-size);
+  font-weight:    var(--typo-heading-md-weight);
+  line-height:    var(--typo-heading-md-leading);
+  letter-spacing: var(--typo-heading-md-tracking);
+}
+
+@utility text-heading-sm {
+  font-size:      var(--typo-heading-sm-size);
+  font-weight:    var(--typo-heading-sm-weight);
+  line-height:    var(--typo-heading-sm-leading);
+  letter-spacing: var(--typo-heading-sm-tracking);
+}
+
+@utility text-heading-xs {
+  font-size:      var(--typo-heading-xs-size);
+  font-weight:    var(--typo-heading-xs-weight);
+  line-height:    var(--typo-heading-xs-leading);
+  letter-spacing: var(--typo-heading-xs-tracking);
+}
+
+@utility text-body-lg {
+  font-size:      var(--typo-body-lg-size);
+  font-weight:    var(--typo-body-lg-weight);
+  line-height:    var(--typo-body-lg-leading);
+  letter-spacing: var(--typo-body-lg-tracking);
+}
+
+@utility text-body-md {
+  font-size:      var(--typo-body-md-size);
+  font-weight:    var(--typo-body-md-weight);
+  line-height:    var(--typo-body-md-leading);
+  letter-spacing: var(--typo-body-md-tracking);
+}
+
+@utility text-body-sm {
+  font-size:      var(--typo-body-sm-size);
+  font-weight:    var(--typo-body-sm-weight);
+  line-height:    var(--typo-body-sm-leading);
+  letter-spacing: var(--typo-body-sm-tracking);
+}
+
+@utility text-body-xs {
+  font-size:      var(--typo-body-xs-size);
+  font-weight:    var(--typo-body-xs-weight);
+  line-height:    var(--typo-body-xs-leading);
+  letter-spacing: var(--typo-body-xs-tracking);
+}
+
+/* UPPERCASE UI labels — uppercase text-transform applied. */
+@utility text-label-lg {
+  font-size:      var(--typo-label-lg-size);
+  font-weight:    var(--typo-label-lg-weight);
+  line-height:    var(--typo-label-lg-leading);
+  letter-spacing: var(--typo-label-lg-tracking);
+  text-transform: uppercase;
+}
+
+@utility text-label-md {
+  font-size:      var(--typo-label-md-size);
+  font-weight:    var(--typo-label-md-weight);
+  line-height:    var(--typo-label-md-leading);
+  letter-spacing: var(--typo-label-md-tracking);
+  text-transform: uppercase;
+}
+
+@utility text-label-sm {
+  font-size:      var(--typo-label-sm-size);
+  font-weight:    var(--typo-label-sm-weight);
+  line-height:    var(--typo-label-sm-leading);
+  letter-spacing: var(--typo-label-sm-tracking);
+  text-transform: uppercase;
+}
+
+@utility text-label-xs {
+  font-size:      var(--typo-label-xs-size);
+  font-weight:    var(--typo-label-xs-weight);
+  line-height:    var(--typo-label-xs-leading);
+  letter-spacing: var(--typo-label-xs-tracking);
+  text-transform: uppercase;
+}
+
+/* Label Plain — mixed case, no text-transform */
+@utility text-label-plain-lg {
+  font-size:      var(--typo-label-plain-lg-size);
+  font-weight:    var(--typo-label-plain-lg-weight);
+  line-height:    var(--typo-label-plain-lg-leading);
+  letter-spacing: var(--typo-label-plain-lg-tracking);
+}
+
+@utility text-label-plain-md {
+  font-size:      var(--typo-label-plain-md-size);
+  font-weight:    var(--typo-label-plain-md-weight);
+  line-height:    var(--typo-label-plain-md-leading);
+  letter-spacing: var(--typo-label-plain-md-tracking);
+}
+
+@utility text-label-plain-sm {
+  font-size:      var(--typo-label-plain-sm-size);
+  font-weight:    var(--typo-label-plain-sm-weight);
+  line-height:    var(--typo-label-plain-sm-leading);
+  letter-spacing: var(--typo-label-plain-sm-tracking);
+}
+
+@utility text-caption {
+  font-size:      var(--typo-caption-size);
+  font-weight:    var(--typo-caption-weight);
+  line-height:    var(--typo-caption-leading);
+  letter-spacing: var(--typo-caption-tracking);
+}
+
+@utility text-overline {
+  font-size:      var(--typo-overline-size);
+  font-weight:    var(--typo-overline-weight);
+  line-height:    var(--typo-overline-leading);
+  letter-spacing: var(--typo-overline-tracking);
+  text-transform: uppercase;
+}
+
+@utility text-code {
+  font-size:      var(--typo-code-size);
+  font-weight:    var(--typo-code-weight);
+  line-height:    var(--typo-code-leading);
+  letter-spacing: var(--typo-code-tracking);
+  font-family:    var(--typo-code-font);
+}
+
+/* ───────────────────────────────────────────────────────────────────
+   NUMBER FORMATTING
+   ─────────────────────────────────────────────────────────────────── */
+
+@utility tabular-nums {
+  font-variant-numeric: tabular-nums;
+}
+
+/* ───────────────────────────────────────────────────────────────────
+   TOUCH TARGET
+   Expands the clickable hit-area to WCAG minimum 44x44 px without
+   affecting visual size. Applied via `::before` pseudo-element.
+   ─────────────────────────────────────────────────────────────────── */
+
+@utility touch-target {
+  position: relative;
+
+  &::before {
+    content: "";
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    min-width: 44px;
+    min-height: 44px;
+  }
+}
+
+/* ───────────────────────────────────────────────────────────────────
+   FOCUS RINGS
+   Custom focus-visible ring utilities. Use in place of the default
+   `focus:ring-*` stack when you want the DS-branded ring with offset.
+   ─────────────────────────────────────────────────────────────────── */
+
+@utility focus-ring {
+  &:focus-visible {
+    outline: none;
+    box-shadow:
+      0 0 0 var(--border-focus-width) var(--color-surface-base),
+      0 0 0 calc(var(--border-focus-width) + var(--border-focus-offset)) var(--color-accent-9);
+  }
+}
+
+@utility focus-ring-inset {
+  &:focus-visible {
+    outline: none;
+    box-shadow: inset 0 0 0 var(--border-focus-width) var(--color-accent-9);
+  }
+}
+
+@utility focus-ring-sm {
+  &:focus-visible {
+    outline: none;
+    box-shadow: 0 0 0 var(--border-focus-width) var(--color-accent-7);
+  }
+}
+
+/* ───────────────────────────────────────────────────────────────────
+   SAFE AREA INSETS
+   For notched/island devices. `env()` falls back to 0 on browsers
+   without safe-area metadata.
+   ─────────────────────────────────────────────────────────────────── */
+
+@utility pt-safe { padding-top:    env(safe-area-inset-top, 0px); }
+@utility pb-safe { padding-bottom: env(safe-area-inset-bottom, 0px); }
+@utility pl-safe { padding-left:   env(safe-area-inset-left, 0px); }
+@utility pr-safe { padding-right:  env(safe-area-inset-right, 0px); }
+
+@utility p-safe {
+  padding-top:    env(safe-area-inset-top, 0px);
+  padding-bottom: env(safe-area-inset-bottom, 0px);
+  padding-left:   env(safe-area-inset-left, 0px);
+  padding-right:  env(safe-area-inset-right, 0px);
+}
+
+/* ───────────────────────────────────────────────────────────────────
+   Z-INDEX NAMED LAYERS
+
+   TW4 doesn't expose a `--z-*` auto-namespace; built-in z-* utilities
+   (z-10, z-20, ...) are hard-coded from `--default-z-*`. Our named
+   layers are declared here so class-generation picks them up.
+   Consumers still get TW4's default numeric scale alongside these.
+   ─────────────────────────────────────────────────────────────────── */
+
+@utility z-base      { z-index: var(--z-base); }
+@utility z-raised    { z-index: var(--z-raised); }
+@utility z-dropdown  { z-index: var(--z-dropdown); }
+@utility z-sticky    { z-index: var(--z-sticky); }
+@utility z-overlay   { z-index: var(--z-overlay); }
+@utility z-modal     { z-index: var(--z-modal); }
+@utility z-popover   { z-index: var(--z-popover); }
+@utility z-toast     { z-index: var(--z-toast); }
+@utility z-tooltip   { z-index: var(--z-tooltip); }
+
+/* ───────────────────────────────────────────────────────────────────
+   TRANSITION DURATIONS (named scale)
+
+   TW4's built-in `duration-<ms>` utilities (duration-75, duration-100,
+   etc.) still work. These add our named layer on top so consumers can
+   write `duration-fast-01` instead of `duration-70` etc.
+   ─────────────────────────────────────────────────────────────────── */
+
+@utility duration-instant      { transition-duration: var(--duration-instant); }
+@utility duration-fast-01      { transition-duration: var(--duration-fast-01); }
+@utility duration-fast-02      { transition-duration: var(--duration-fast-02); }
+@utility duration-moderate-01  { transition-duration: var(--duration-moderate-01); }
+@utility duration-moderate-01b { transition-duration: var(--duration-moderate-01b); }
+@utility duration-moderate-02  { transition-duration: var(--duration-moderate-02); }
+@utility duration-slow-01      { transition-duration: var(--duration-slow-01); }
+@utility duration-slow-02      { transition-duration: var(--duration-slow-02); }

package/dist/tokens/variants.css

@@ -0,0 +1,14 @@
+/* ═══════════════════════════════════════════════════════════════════
+   CUSTOM VARIANTS (TW4 native)
+
+   `@custom-variant <name> <selector>` registers a Tailwind 4 variant
+   that consumers can use as a prefix, e.g. `dark:bg-surface-raised`.
+
+   Our dark variant matches TW3's classic `darkMode: 'class'` behavior
+   plus one extra: the `.dark` element itself also receives `dark:*`
+   utilities. Matches the official TW4 docs' recommended snippet and
+   removes a footgun where a consumer sets `.dark` on <body> but uses
+   `dark:*` utilities directly on <body>.
+   ═══════════════════════════════════════════════════════════════════ */
+
+@custom-variant dark (&:where(.dark, .dark *));

package/dist/ui/accordion.d.ts

@@ -1,6 +1,6 @@
 "use client";
-import * as React from 'react';
 import * as AccordionPrimitive from '../primitives/react-accordion';
+import * as React from 'react';
 /**
  * Accordion compound component — vertically stacked, collapsible content sections.
  *
@@ -56,5 +56,5 @@ declare const AccordionContent: React.ForwardRefExoticComponent<Omit<AccordionPr
 export type AccordionItemProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>;
 export type AccordionTriggerProps = AccordionTriggerExtendedProps;
 export type AccordionContentProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>;
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
 //# sourceMappingURL=accordion.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../src/ui/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,6BAA6B,CAAA;AAQjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,QAAA,MAAM,SAAS,8JAA0B,CAAA;AAEzC,QAAA,MAAM,aAAa,iKASjB,CAAA;AAGF,UAAU,6BAA8B,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC;IAC/G,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CACnC;AAED,QAAA,MAAM,gBAAgB,yGAwBpB,CAAA;AAGF,QAAA,MAAM,gBAAgB,oKAiBpB,CAAA;AAGF,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,CAAA;AAC/F,MAAM,MAAM,qBAAqB,GAAG,6BAA6B,CAAA;AACjE,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,CAAA;AAErG,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../src/ui/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,kBAAkB,MAAM,6BAA6B,CAAA;AAGjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,QAAA,MAAM,SAAS,8JAA0B,CAAA;AAEzC,QAAA,MAAM,aAAa,iKASjB,CAAA;AAGF,UAAU,6BAA8B,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC;IAC/G,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CACnC;AAED,QAAA,MAAM,gBAAgB,yGAwBpB,CAAA;AAGF,QAAA,MAAM,gBAAgB,oKAiBpB,CAAA;AAGF,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,CAAA;AAC/F,MAAM,MAAM,qBAAqB,GAAG,6BAA6B,CAAA;AACjE,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,CAAA;AAErG,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAC,aAAa,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/ui/accordion.js

@@ -1,50 +1,50 @@
 "use client";
 import { Fn as e, In as t, Ln as n, Pn as r, Rn as i } from "../_chunks/primitives.js";
-import { a } from "../_chunks/framer.js";
-import { tweens as o } from "./lib/motion.js";
-import { cn as s } from "./lib/utils.js";
-import { Icon as c } from "./icon.js";
-import * as l from "react";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
-import { IconChevronDown as f } from "@tabler/icons-react";
+import { tweens as a } from "./lib/motion.js";
+import { cn as o } from "./lib/utils.js";
+import { Icon as s } from "./icon.js";
+import * as c from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { IconChevronDown as d } from "@tabler/icons-react";
+import { motion as f } from "framer-motion";
 //#region src/ui/accordion.tsx
-var p = n, m = l.forwardRef(({ className: e, ...n }, r) => /* @__PURE__ */ u(t, {
+var p = n, m = c.forwardRef(({ className: e, ...n }, r) => /* @__PURE__ */ l(t, {
 	ref: r,
-	className: s("border-b border-surface-border", e),
+	className: o("border-b border-surface-border", e),
 	...n
 }));
 m.displayName = "AccordionItem";
-var h = l.forwardRef(({ className: t, children: n, chevronPosition: r = "right", ...a }, o) => {
-	let l = /* @__PURE__ */ u(c, {
-		icon: f,
+var h = c.forwardRef(({ className: t, children: n, chevronPosition: r = "right", ...a }, c) => {
+	let f = /* @__PURE__ */ l(s, {
+		icon: d,
 		size: "sm",
 		className: "shrink-0 text-surface-fg-muted transition-transform duration-moderate-02 ease-productive-standard group-data-[state=open]:rotate-180"
 	});
-	return /* @__PURE__ */ u(e, {
+	return /* @__PURE__ */ l(e, {
 		className: "flex",
-		children: /* @__PURE__ */ d(i, {
-			ref: o,
-			className: s("group flex flex-1 items-center justify-between py-ds-05 text-left text-ds-md font-medium hover:bg-surface-raised rounded-ds-md data-[state=open]:bg-surface-raised focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9", t),
+		children: /* @__PURE__ */ u(i, {
+			ref: c,
+			className: o("group flex flex-1 items-center justify-between py-ds-05 text-left text-ds-md font-medium hover:bg-surface-raised rounded-ds-md data-[state=open]:bg-surface-raised focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9", t),
 			...a,
 			children: [
-				r === "left" && l,
+				r === "left" && f,
 				n,
-				r === "right" && l
+				r === "right" && f
 			]
 		})
 	});
 });
 h.displayName = i.displayName;
-var g = l.forwardRef(({ className: e, children: t, ...n }, i) => /* @__PURE__ */ u(r, {
+var g = c.forwardRef(({ className: e, children: t, ...n }, i) => /* @__PURE__ */ l(r, {
 	ref: i,
 	className: "w-full overflow-hidden text-ds-md data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up",
 	...n,
-	children: /* @__PURE__ */ u(a.div, {
+	children: /* @__PURE__ */ l(f.div, {
 		initial: !1,
 		animate: { opacity: 1 },
-		transition: o.fade,
-		children: /* @__PURE__ */ u("div", {
-			className: s("pb-ds-05 pt-ds-02", e),
+		transition: a.fade,
+		children: /* @__PURE__ */ l("div", {
+			className: o("pb-ds-05 pt-ds-02", e),
 			children: t
 		})
 	})

package/dist/ui/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","names":[],"sources":["../../src/ui/accordion.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as AccordionPrimitive from '@primitives/react-accordion'\nimport { IconChevronDown } from '@tabler/icons-react'\nimport { Icon } from './icon'\nimport { motion } from 'framer-motion'\n\nimport { cn } from './lib/utils'\nimport { tweens } from './lib/motion'\n\n/**\n * Accordion compound component — vertically stacked, collapsible content sections.\n *\n * **Parts (in composition order):**\n * - `Accordion` — root; controls single vs. multiple open panels (this root)\n * - `AccordionItem` — individual collapsible section (requires `value` prop)\n * - `AccordionTrigger` — the clickable header row (chevron icon auto-renders and rotates)\n * - `AccordionContent` — the collapsible body revealed when the item is open\n *\n * **`type` prop (required on root):**\n * - `\"single\"` — only one panel open at a time; supports `collapsible` prop to re-close the active item\n * - `\"multiple\"` — multiple panels open simultaneously (value is `string[]`); `collapsible` is NOT valid here\n *\n * @compound\n * @example\n * // Single-open FAQ accordion:\n * <Accordion type=\"single\" defaultValue=\"item-1\" collapsible>\n *   <AccordionItem value=\"item-1\">\n *     <AccordionTrigger>What is Shilp Sutra?</AccordionTrigger>\n *     <AccordionContent>\n *       A React design system built for Next.js App Router, with full accessibility baked in.\n *     </AccordionContent>\n *   </AccordionItem>\n *   <AccordionItem value=\"item-2\">\n *     <AccordionTrigger>Is dark mode supported?</AccordionTrigger>\n *     <AccordionContent>\n *       Yes — add the <code>.dark</code> class to the root element to activate it.\n *     </AccordionContent>\n *   </AccordionItem>\n * </Accordion>\n *\n * @example\n * // Multiple-open controlled accordion:\n * const [open, setOpen] = useState<string[]>(['billing'])\n * <Accordion type=\"multiple\" value={open} onValueChange={setOpen}>\n *   <AccordionItem value=\"billing\">\n *     <AccordionTrigger>Billing</AccordionTrigger>\n *     <AccordionContent>Your billing details here.</AccordionContent>\n *   </AccordionItem>\n *   <AccordionItem value=\"security\">\n *     <AccordionTrigger>Security</AccordionTrigger>\n *     <AccordionContent>Security settings here.</AccordionContent>\n *   </AccordionItem>\n * </Accordion>\n */\nconst Accordion = AccordionPrimitive.Root\n\nconst AccordionItem = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <AccordionPrimitive.Item\n    ref={ref}\n    className={cn('border-b border-surface-border', className)}\n    {...props}\n  />\n))\nAccordionItem.displayName = 'AccordionItem'\n\ninterface AccordionTriggerExtendedProps extends React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger> {\n  chevronPosition?: 'left' | 'right'\n}\n\nconst AccordionTrigger = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Trigger>,\n  AccordionTriggerExtendedProps\n>(({ className, children, chevronPosition = 'right', ...props }, ref) => {\n  const chevron = (\n    <Icon icon={IconChevronDown} size=\"sm\" className=\"shrink-0 text-surface-fg-muted transition-transform duration-moderate-02 ease-productive-standard group-data-[state=open]:rotate-180\" />\n  )\n\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        ref={ref}\n        className={cn(\n          'group flex flex-1 items-center justify-between py-ds-05 text-left text-ds-md font-medium hover:bg-surface-raised rounded-ds-md data-[state=open]:bg-surface-raised focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9',\n          className,\n        )}\n        {...props}\n      >\n        {chevronPosition === 'left' && chevron}\n        {children}\n        {chevronPosition === 'right' && chevron}\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n})\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName\n\nconst AccordionContent = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Content\n    ref={ref}\n    className=\"w-full overflow-hidden text-ds-md data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up\"\n    {...props}\n  >\n    <motion.div\n      initial={false}\n      animate={{ opacity: 1 }}\n      transition={tweens.fade}\n    >\n      <div className={cn('pb-ds-05 pt-ds-02', className)}>{children}</div>\n    </motion.div>\n  </AccordionPrimitive.Content>\n))\nAccordionContent.displayName = AccordionPrimitive.Content.displayName\n\nexport type AccordionItemProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\nexport type AccordionTriggerProps = AccordionTriggerExtendedProps\nexport type AccordionContentProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n"],"mappings":";;;;;;;;;;AAwDA,IAAM,IAAY,GAEZ,IAAgB,EAAM,YAGzB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,GAAD;CACO;CACL,WAAW,EAAG,kCAAkC,EAAU;CAC1D,GAAI;CACJ,CAAA,CACF;AACF,EAAc,cAAc;AAM5B,IAAM,IAAmB,EAAM,YAG5B,EAAE,cAAW,aAAU,qBAAkB,SAAS,GAAG,KAAS,MAAQ;CACvE,IAAM,IACJ,kBAAC,GAAD;EAAM,MAAM;EAAiB,MAAK;EAAK,WAAU;EAAyI,CAAA;AAG5L,QACE,kBAAC,GAAD;EAA2B,WAAU;YACnC,kBAAC,GAAD;GACO;GACL,WAAW,EACT,oPACA,EACD;GACD,GAAI;aANN;IAQG,MAAoB,UAAU;IAC9B;IACA,MAAoB,WAAW;IACL;;EACH,CAAA;EAE9B;AACF,EAAiB,cAAA,EAAyC;AAE1D,IAAM,IAAmB,EAAM,YAG5B,EAAE,cAAW,aAAU,GAAG,KAAS,MACpC,kBAAC,GAAD;CACO;CACL,WAAU;CACV,GAAI;WAEJ,kBAAC,EAAO,KAAR;EACE,SAAS;EACT,SAAS,EAAE,SAAS,GAAG;EACvB,YAAY,EAAO;YAEnB,kBAAC,OAAD;GAAK,WAAW,EAAG,qBAAqB,EAAU;GAAG;GAAe,CAAA;EACzD,CAAA;CACc,CAAA,CAC7B;AACF,EAAiB,cAAA,EAAyC"}
+{"version":3,"file":"accordion.js","names":[],"sources":["../../src/ui/accordion.tsx"],"sourcesContent":["'use client'\n\nimport * as AccordionPrimitive from '@primitives/react-accordion'\nimport { IconChevronDown } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { tweens } from './lib/motion'\nimport { cn } from './lib/utils'\n\n/**\n * Accordion compound component — vertically stacked, collapsible content sections.\n *\n * **Parts (in composition order):**\n * - `Accordion` — root; controls single vs. multiple open panels (this root)\n * - `AccordionItem` — individual collapsible section (requires `value` prop)\n * - `AccordionTrigger` — the clickable header row (chevron icon auto-renders and rotates)\n * - `AccordionContent` — the collapsible body revealed when the item is open\n *\n * **`type` prop (required on root):**\n * - `\"single\"` — only one panel open at a time; supports `collapsible` prop to re-close the active item\n * - `\"multiple\"` — multiple panels open simultaneously (value is `string[]`); `collapsible` is NOT valid here\n *\n * @compound\n * @example\n * // Single-open FAQ accordion:\n * <Accordion type=\"single\" defaultValue=\"item-1\" collapsible>\n *   <AccordionItem value=\"item-1\">\n *     <AccordionTrigger>What is Shilp Sutra?</AccordionTrigger>\n *     <AccordionContent>\n *       A React design system built for Next.js App Router, with full accessibility baked in.\n *     </AccordionContent>\n *   </AccordionItem>\n *   <AccordionItem value=\"item-2\">\n *     <AccordionTrigger>Is dark mode supported?</AccordionTrigger>\n *     <AccordionContent>\n *       Yes — add the <code>.dark</code> class to the root element to activate it.\n *     </AccordionContent>\n *   </AccordionItem>\n * </Accordion>\n *\n * @example\n * // Multiple-open controlled accordion:\n * const [open, setOpen] = useState<string[]>(['billing'])\n * <Accordion type=\"multiple\" value={open} onValueChange={setOpen}>\n *   <AccordionItem value=\"billing\">\n *     <AccordionTrigger>Billing</AccordionTrigger>\n *     <AccordionContent>Your billing details here.</AccordionContent>\n *   </AccordionItem>\n *   <AccordionItem value=\"security\">\n *     <AccordionTrigger>Security</AccordionTrigger>\n *     <AccordionContent>Security settings here.</AccordionContent>\n *   </AccordionItem>\n * </Accordion>\n */\nconst Accordion = AccordionPrimitive.Root\n\nconst AccordionItem = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <AccordionPrimitive.Item\n    ref={ref}\n    className={cn('border-b border-surface-border', className)}\n    {...props}\n  />\n))\nAccordionItem.displayName = 'AccordionItem'\n\ninterface AccordionTriggerExtendedProps extends React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger> {\n  chevronPosition?: 'left' | 'right'\n}\n\nconst AccordionTrigger = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Trigger>,\n  AccordionTriggerExtendedProps\n>(({ className, children, chevronPosition = 'right', ...props }, ref) => {\n  const chevron = (\n    <Icon icon={IconChevronDown} size=\"sm\" className=\"shrink-0 text-surface-fg-muted transition-transform duration-moderate-02 ease-productive-standard group-data-[state=open]:rotate-180\" />\n  )\n\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        ref={ref}\n        className={cn(\n          'group flex flex-1 items-center justify-between py-ds-05 text-left text-ds-md font-medium hover:bg-surface-raised rounded-ds-md data-[state=open]:bg-surface-raised focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9',\n          className,\n        )}\n        {...props}\n      >\n        {chevronPosition === 'left' && chevron}\n        {children}\n        {chevronPosition === 'right' && chevron}\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n})\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName\n\nconst AccordionContent = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Content\n    ref={ref}\n    className=\"w-full overflow-hidden text-ds-md data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up\"\n    {...props}\n  >\n    <motion.div\n      initial={false}\n      animate={{ opacity: 1 }}\n      transition={tweens.fade}\n    >\n      <div className={cn('pb-ds-05 pt-ds-02', className)}>{children}</div>\n    </motion.div>\n  </AccordionPrimitive.Content>\n))\nAccordionContent.displayName = AccordionPrimitive.Content.displayName\n\nexport type AccordionItemProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\nexport type AccordionTriggerProps = AccordionTriggerExtendedProps\nexport type AccordionContentProps = React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n\nexport { Accordion, AccordionContent,AccordionItem, AccordionTrigger }\n"],"mappings":";;;;;;;;;;AAwDA,IAAM,IAAY,GAEZ,IAAgB,EAAM,YAGzB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,GAAD;CACO;CACL,WAAW,EAAG,kCAAkC,EAAU;CAC1D,GAAI;CACJ,CAAA,CACF;AACF,EAAc,cAAc;AAM5B,IAAM,IAAmB,EAAM,YAG5B,EAAE,cAAW,aAAU,qBAAkB,SAAS,GAAG,KAAS,MAAQ;CACvE,IAAM,IACJ,kBAAC,GAAD;EAAM,MAAM;EAAiB,MAAK;EAAK,WAAU;EAAyI,CAAA;AAG5L,QACE,kBAAC,GAAD;EAA2B,WAAU;YACnC,kBAAC,GAAD;GACO;GACL,WAAW,EACT,oPACA,EACD;GACD,GAAI;aANN;IAQG,MAAoB,UAAU;IAC9B;IACA,MAAoB,WAAW;IACL;;EACH,CAAA;EAE9B;AACF,EAAiB,cAAA,EAAyC;AAE1D,IAAM,IAAmB,EAAM,YAG5B,EAAE,cAAW,aAAU,GAAG,KAAS,MACpC,kBAAC,GAAD;CACO;CACL,WAAU;CACV,GAAI;WAEJ,kBAAC,EAAO,KAAR;EACE,SAAS;EACT,SAAS,EAAE,SAAS,GAAG;EACvB,YAAY,EAAO;YAEnB,kBAAC,OAAD;GAAK,WAAW,EAAG,qBAAqB,EAAU;GAAG;GAAe,CAAA;EACzD,CAAA;CACc,CAAA,CAC7B;AACF,EAAiB,cAAA,EAAyC"}

package/dist/ui/alert-dialog.d.ts

@@ -1,6 +1,6 @@
 "use client";
-import * as React from 'react';
 import * as AlertDialogPrimitive from '../primitives/react-alert-dialog';
+import * as React from 'react';
 declare const AlertDialog: React.FC<React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Root>>;
 declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
 declare const AlertDialogPortal: React.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
@@ -19,5 +19,5 @@ declare const AlertDialogCancel: React.ForwardRefExoticComponent<Omit<AlertDialo
 export type { AlertDialogContentProps };
 export type AlertDialogActionProps = React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action>;
 export type AlertDialogCancelProps = React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel>;
-export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };
 //# sourceMappingURL=alert-dialog.d.ts.map