@shortwind/catalog 0.1.0-beta.12 → 0.1.0-beta.14

package/dist/registry/badge/CHANGELOG.md

@@ -1,5 +1,5 @@
 # badge
 
-## 0.0.1
+## 0.0.2
 
 Initial release.

package/dist/registry/badge.css

@@ -1,10 +1,18 @@
-/* shortwind: badge@0.0.1 sha:8548b9a7305a0a59 */
+/* shortwind: badge@0.0.2 sha:07c6ab5a8deb77e3 */
 
 /* @guide
-   @badge is the neutral default; tone variants @badge-success/warning/danger/
-   info carry their own color; @badge-outline is unfilled. One tone per badge.
-   @badge-base is a color-less shell for building custom tones — not for direct
-   use.
+   @badge is the default. Its color is DATA-DRIVEN: it reads the --tone-bg /
+   --tone-fg CSS variables, so set the tone from your data with a data-tone
+   attribute instead of picking a different recipe name —
+   `<span className="@badge" data-tone={severity}>`. Define your tones once in
+   CSS (init scaffolds neutral/success/warning/danger/info; add your own
+   `[data-tone="sev1"] { --tone-bg: …; --tone-fg: … }`). With no data-tone it
+   falls back to the neutral muted look, identical to before.
+
+   The static @badge-success/warning/danger/info variants still exist for when
+   the tone is known at author time; reach for data-tone when it's chosen from
+   data. @badge-outline is unfilled. @badge-base is a color-less shell for
+   building custom tones — not for direct use.
 */
 
 /* Badge shell — shape, sizing, focus ring. No bg/text/border color so
@@ -13,9 +21,11 @@
   inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2
 }
 
-/* Default neutral badge. */
+/* Default badge — tone-aware. Reads --tone-bg/--tone-fg (set via data-tone),
+   falling back to the neutral muted tokens so it renders unchanged when no
+   tone is set. */
 @recipe badge {
-  inline-flex items-center gap-1 rounded-full bg-muted px-2 py-0.5 text-xs font-medium text-muted-foreground
+  inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-medium bg-[var(--tone-bg,var(--muted))] text-[var(--tone-fg,var(--muted-foreground))]
 }
 
 /* Success tone badge. */

package/dist/registry/{badge@0.0.1.css → badge@0.0.2.css}

@@ -1,10 +1,18 @@
-/* shortwind: badge@0.0.1 sha:8548b9a7305a0a59 */
+/* shortwind: badge@0.0.2 sha:07c6ab5a8deb77e3 */
 
 /* @guide
-   @badge is the neutral default; tone variants @badge-success/warning/danger/
-   info carry their own color; @badge-outline is unfilled. One tone per badge.
-   @badge-base is a color-less shell for building custom tones — not for direct
-   use.
+   @badge is the default. Its color is DATA-DRIVEN: it reads the --tone-bg /
+   --tone-fg CSS variables, so set the tone from your data with a data-tone
+   attribute instead of picking a different recipe name —
+   `<span className="@badge" data-tone={severity}>`. Define your tones once in
+   CSS (init scaffolds neutral/success/warning/danger/info; add your own
+   `[data-tone="sev1"] { --tone-bg: …; --tone-fg: … }`). With no data-tone it
+   falls back to the neutral muted look, identical to before.
+
+   The static @badge-success/warning/danger/info variants still exist for when
+   the tone is known at author time; reach for data-tone when it's chosen from
+   data. @badge-outline is unfilled. @badge-base is a color-less shell for
+   building custom tones — not for direct use.
 */
 
 /* Badge shell — shape, sizing, focus ring. No bg/text/border color so
@@ -13,9 +21,11 @@
   inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2
 }
 
-/* Default neutral badge. */
+/* Default badge — tone-aware. Reads --tone-bg/--tone-fg (set via data-tone),
+   falling back to the neutral muted tokens so it renders unchanged when no
+   tone is set. */
 @recipe badge {
-  inline-flex items-center gap-1 rounded-full bg-muted px-2 py-0.5 text-xs font-medium text-muted-foreground
+  inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-medium bg-[var(--tone-bg,var(--muted))] text-[var(--tone-fg,var(--muted-foreground))]
 }
 
 /* Success tone badge. */

package/dist/registry/button/CHANGELOG.md

@@ -1,5 +1,5 @@
 # button
 
-## 0.0.1
+## 0.0.2
 
 Initial release.

package/dist/registry/button.css

@@ -1,11 +1,13 @@
-/* shortwind: button@0.0.1 sha:777fa510c4ab4aeb */
+/* shortwind: button@0.0.2 sha:b0b08652cd757b90 */
 
 /* @guide
-   Name order is @btn-<intent>[-<size>]: intent first (primary/secondary/ghost/
-   danger/outline), size second (sm/lg; omit for default). One intent per
-   button — never combine @btn-primary with @btn-danger. @btn-ghost is text-only,
-   @btn-outline is bordered with no fill, @btn-icon is a square icon button.
-   @btn-base is the shared shell; don't use it on its own.
+   Name order is @button-<intent>[-<size>]: intent first (primary/secondary/
+   ghost/danger/outline), size second (sm/lg; omit for default). One intent per
+   button — never combine @button-primary with @button-danger. @button-ghost is
+   text-only, @button-outline is bordered with no fill, @button-icon is a square
+   icon button. @button-base is the shared shell; don't use it on its own.
+   The short @btn-<intent> forms are aliases that expand identically; the
+   full-word @button-* names are canonical — prefer them.
 */
 
 /* Shared button base — sizing, focus ring, disabled state. */
@@ -72,3 +74,44 @@
 @recipe btn-icon {
   inline-flex h-9 w-9 items-center justify-center rounded-md text-foreground transition-colors hover:bg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring disabled:cursor-not-allowed disabled:opacity-50
 }
+
+/* Full-word canonical aliases — expand identically to the @btn-* short forms. */
+
+/* Shared button shell (alias of @btn-base). */
+@recipe button-base { @btn-base }
+
+/* Primary call-to-action button (alias of @btn-primary). */
+@recipe button-primary { @btn-primary }
+
+/* Small primary button (alias of @btn-primary-sm). */
+@recipe button-primary-sm { @btn-primary-sm }
+
+/* Large primary button (alias of @btn-primary-lg). */
+@recipe button-primary-lg { @btn-primary-lg }
+
+/* Secondary button (alias of @btn-secondary). */
+@recipe button-secondary { @btn-secondary }
+
+/* Small secondary button (alias of @btn-secondary-sm). */
+@recipe button-secondary-sm { @btn-secondary-sm }
+
+/* Large secondary button (alias of @btn-secondary-lg). */
+@recipe button-secondary-lg { @btn-secondary-lg }
+
+/* Ghost button (alias of @btn-ghost). */
+@recipe button-ghost { @btn-ghost }
+
+/* Small ghost button (alias of @btn-ghost-sm). */
+@recipe button-ghost-sm { @btn-ghost-sm }
+
+/* Large ghost button (alias of @btn-ghost-lg). */
+@recipe button-ghost-lg { @btn-ghost-lg }
+
+/* Destructive button (alias of @btn-danger). */
+@recipe button-danger { @btn-danger }
+
+/* Outline button (alias of @btn-outline). */
+@recipe button-outline { @btn-outline }
+
+/* Square icon-only button (alias of @btn-icon). */
+@recipe button-icon { @btn-icon }

package/dist/registry/button@0.0.2.css

@@ -0,0 +1,117 @@
+/* shortwind: button@0.0.2 sha:b0b08652cd757b90 */
+
+/* @guide
+   Name order is @button-<intent>[-<size>]: intent first (primary/secondary/
+   ghost/danger/outline), size second (sm/lg; omit for default). One intent per
+   button — never combine @button-primary with @button-danger. @button-ghost is
+   text-only, @button-outline is bordered with no fill, @button-icon is a square
+   icon button. @button-base is the shared shell; don't use it on its own.
+   The short @btn-<intent> forms are aliases that expand identically; the
+   full-word @button-* names are canonical — prefer them.
+*/
+
+/* Shared button base — sizing, focus ring, disabled state. */
+@recipe btn-base {
+  inline-flex items-center justify-center gap-2 rounded-md px-4 py-2 text-sm font-medium transition-colors focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring disabled:cursor-not-allowed disabled:opacity-50
+}
+
+/* Primary call-to-action button. */
+@recipe btn-primary {
+  @btn-base bg-primary text-primary-foreground hover:bg-primary/90
+}
+
+/* Small primary button. */
+@recipe btn-primary-sm {
+  @btn-primary px-3 py-1.5 text-xs
+}
+
+/* Large primary button. */
+@recipe btn-primary-lg {
+  @btn-primary px-6 py-3 text-base
+}
+
+/* Secondary button — bordered surface tone. */
+@recipe btn-secondary {
+  @btn-base border border-border bg-secondary text-secondary-foreground hover:bg-secondary/80
+}
+
+/* Small secondary button. */
+@recipe btn-secondary-sm {
+  @btn-secondary px-3 py-1.5 text-xs
+}
+
+/* Large secondary button. */
+@recipe btn-secondary-lg {
+  @btn-secondary px-6 py-3 text-base
+}
+
+/* Ghost button — text only, no background. */
+@recipe btn-ghost {
+  @btn-base text-foreground hover:bg-muted
+}
+
+/* Small ghost button. */
+@recipe btn-ghost-sm {
+  @btn-ghost px-3 py-1.5 text-xs
+}
+
+/* Large ghost button. */
+@recipe btn-ghost-lg {
+  @btn-ghost px-6 py-3 text-base
+}
+
+/* Destructive button. */
+@recipe btn-danger {
+  @btn-base bg-destructive text-destructive-foreground hover:bg-destructive/90
+}
+
+/* Outline button — bordered without fill. */
+@recipe btn-outline {
+  @btn-base border border-primary text-primary hover:bg-primary/10
+}
+
+/* Square icon-only button. */
+@recipe btn-icon {
+  inline-flex h-9 w-9 items-center justify-center rounded-md text-foreground transition-colors hover:bg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring disabled:cursor-not-allowed disabled:opacity-50
+}
+
+/* Full-word canonical aliases — expand identically to the @btn-* short forms. */
+
+/* Shared button shell (alias of @btn-base). */
+@recipe button-base { @btn-base }
+
+/* Primary call-to-action button (alias of @btn-primary). */
+@recipe button-primary { @btn-primary }
+
+/* Small primary button (alias of @btn-primary-sm). */
+@recipe button-primary-sm { @btn-primary-sm }
+
+/* Large primary button (alias of @btn-primary-lg). */
+@recipe button-primary-lg { @btn-primary-lg }
+
+/* Secondary button (alias of @btn-secondary). */
+@recipe button-secondary { @btn-secondary }
+
+/* Small secondary button (alias of @btn-secondary-sm). */
+@recipe button-secondary-sm { @btn-secondary-sm }
+
+/* Large secondary button (alias of @btn-secondary-lg). */
+@recipe button-secondary-lg { @btn-secondary-lg }
+
+/* Ghost button (alias of @btn-ghost). */
+@recipe button-ghost { @btn-ghost }
+
+/* Small ghost button (alias of @btn-ghost-sm). */
+@recipe button-ghost-sm { @btn-ghost-sm }
+
+/* Large ghost button (alias of @btn-ghost-lg). */
+@recipe button-ghost-lg { @btn-ghost-lg }
+
+/* Destructive button (alias of @btn-danger). */
+@recipe button-danger { @btn-danger }
+
+/* Outline button (alias of @btn-outline). */
+@recipe button-outline { @btn-outline }
+
+/* Square icon-only button (alias of @btn-icon). */
+@recipe button-icon { @btn-icon }

package/dist/registry/index.json

@@ -12,10 +12,15 @@
     "layout",
     "list",
     "media",
+    "menu",
     "navigation",
     "progress",
+    "segmented",
+    "sheet",
     "skeleton",
+    "stat",
     "surface",
+    "switch",
     "table",
     "text",
     "tooltip"

package/dist/registry/layout/CHANGELOG.md

@@ -1,5 +1,5 @@
 # layout
 
-## 0.0.1
+## 0.0.2
 
 Initial release.

package/dist/registry/layout.css

@@ -1,14 +1,18 @@
-/* shortwind: layout@0.0.1 sha:48a2a7b6e1a5d7ad */
+/* shortwind: layout@0.0.2 sha:48025daeec83041a */
 
 /* @guide
    Composition primitives. @stack-* stacks children vertically (flex-col);
    @row* lays them out horizontally (flex-row). Choose the gap with the size
-   suffix (xs/sm/md/lg on stacks). Use @grid-2/3/4 only for true multi-column
-   grids, @center to center on both axes, @full to fill the parent. Common
-   slips: there is no @flex-row (use @row) or @flex-col (use a @stack-*), and
-   the grids are @grid-3, not @grid-cols-3.
+   suffix (xs/sm/md/lg on stacks); bare @stack is the default and equals
+   @stack-md. Use @grid-2/3/4 only for true multi-column grids, @center to
+   center on both axes, @full to fill the parent. Common slips: there is no
+   @flex-row (use @row) or @flex-col (use a @stack-*), and the grids are
+   @grid-3, not @grid-cols-3.
 */
 
+/* Bare stack — default gap, alias for @stack-md. */
+@recipe stack { @stack-md }
+
 /* Vertical stack with extra-small gap. */
 @recipe stack-xs {
   flex flex-col gap-1

package/dist/registry/{layout@0.0.1.css → layout@0.0.2.css}

@@ -1,14 +1,18 @@
-/* shortwind: layout@0.0.1 sha:48a2a7b6e1a5d7ad */
+/* shortwind: layout@0.0.2 sha:48025daeec83041a */
 
 /* @guide
    Composition primitives. @stack-* stacks children vertically (flex-col);
    @row* lays them out horizontally (flex-row). Choose the gap with the size
-   suffix (xs/sm/md/lg on stacks). Use @grid-2/3/4 only for true multi-column
-   grids, @center to center on both axes, @full to fill the parent. Common
-   slips: there is no @flex-row (use @row) or @flex-col (use a @stack-*), and
-   the grids are @grid-3, not @grid-cols-3.
+   suffix (xs/sm/md/lg on stacks); bare @stack is the default and equals
+   @stack-md. Use @grid-2/3/4 only for true multi-column grids, @center to
+   center on both axes, @full to fill the parent. Common slips: there is no
+   @flex-row (use @row) or @flex-col (use a @stack-*), and the grids are
+   @grid-3, not @grid-cols-3.
 */
 
+/* Bare stack — default gap, alias for @stack-md. */
+@recipe stack { @stack-md }
+
 /* Vertical stack with extra-small gap. */
 @recipe stack-xs {
   flex flex-col gap-1

package/dist/registry/list/CHANGELOG.md

@@ -1,5 +1,5 @@
 # list
 
-## 0.0.1
+## 0.0.2
 
 Initial release.

package/dist/registry/list.css

@@ -1,9 +1,11 @@
-/* shortwind: list@0.0.1 sha:f662887791fabb8d */
+/* shortwind: list@0.0.2 sha:6a7f93aa95067c44 */
 
 /* @guide
    @list wraps a stack of @list-item rows; use @list-bordered for divided rows.
-   Definition lists are separate: @dl with @dt (term) and @dd (description).
-   For site navigation reach for the navigation family (@nav), not @list.
+   Definition lists are separate: @description-list with @description-term and
+   @description-detail. The short @dl / @dt / @dd forms are aliases that expand
+   identically; the spelled-out names are canonical — prefer them. For site
+   navigation reach for the navigation family (@navigation), not @list.
 */
 
 /* Vertical list with default gap. */
@@ -35,3 +37,14 @@
 @recipe dd {
   text-sm text-foreground sm:col-span-2
 }
+
+/* Spelled-out canonical aliases — expand identically to @dl/@dt/@dd. */
+
+/* Definition list container (alias of @dl). */
+@recipe description-list { @dl }
+
+/* Definition term (alias of @dt). */
+@recipe description-term { @dt }
+
+/* Definition description (alias of @dd). */
+@recipe description-detail { @dd }

package/dist/registry/{list@0.0.1.css → list@0.0.2.css}

@@ -1,9 +1,11 @@
-/* shortwind: list@0.0.1 sha:f662887791fabb8d */
+/* shortwind: list@0.0.2 sha:6a7f93aa95067c44 */
 
 /* @guide
    @list wraps a stack of @list-item rows; use @list-bordered for divided rows.
-   Definition lists are separate: @dl with @dt (term) and @dd (description).
-   For site navigation reach for the navigation family (@nav), not @list.
+   Definition lists are separate: @description-list with @description-term and
+   @description-detail. The short @dl / @dt / @dd forms are aliases that expand
+   identically; the spelled-out names are canonical — prefer them. For site
+   navigation reach for the navigation family (@navigation), not @list.
 */
 
 /* Vertical list with default gap. */
@@ -35,3 +37,14 @@
 @recipe dd {
   text-sm text-foreground sm:col-span-2
 }
+
+/* Spelled-out canonical aliases — expand identically to @dl/@dt/@dd. */
+
+/* Definition list container (alias of @dl). */
+@recipe description-list { @dl }
+
+/* Definition term (alias of @dt). */
+@recipe description-term { @dt }
+
+/* Definition description (alias of @dd). */
+@recipe description-detail { @dd }