@shortwind/catalog 0.1.0-beta.3

package/dist/registry/card@0.0.1.css

@@ -0,0 +1,43 @@
+/* shortwind: card@0.0.1 sha:4813cef10cd21824 */
+
+/* @guide
+   Pick exactly one container: @card (default), @card-elevated (raised shadow),
+   @card-flat (no border), or @card-interactive (clickable hover/focus) — don't
+   stack two container variants on one element. Lay out the inside with
+   @card-header / @card-body / @card-footer.
+*/
+
+/* Default content card with border, padding, and surface color. */
+@recipe card {
+  rounded-lg border border-border bg-card text-card-foreground p-4
+}
+
+/* Card with raised shadow for emphasis. */
+@recipe card-elevated {
+  @card shadow-md
+}
+
+/* Card without border, on a muted surface. */
+@recipe card-flat {
+  rounded-lg bg-muted text-foreground p-4
+}
+
+/* Clickable card with hover and focus-visible states. */
+@recipe card-interactive {
+  @card cursor-pointer transition-shadow hover:shadow-md focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring
+}
+
+/* Card header region with bottom divider. */
+@recipe card-header {
+  mb-3 border-b border-border pb-3
+}
+
+/* Card body region. */
+@recipe card-body {
+  py-1
+}
+
+/* Card footer with top divider and right-aligned actions. */
+@recipe card-footer {
+  mt-3 flex items-center justify-end gap-2 border-t border-border pt-3
+}

package/dist/registry/code/CHANGELOG.md

@@ -0,0 +1,5 @@
+# code
+
+## 0.0.1
+
+Initial release.

package/dist/registry/code.css

@@ -0,0 +1,22 @@
+/* shortwind: code@0.0.1 sha:cc8d2b0bedb5b453 */
+
+/* @guide
+   @code-inline for a code span inside prose, @code-block for a multi-line
+   preformatted block, @kbd for a keyboard-shortcut hint. Pick by context, not
+   by size.
+*/
+
+/* Inline code span. */
+@recipe code-inline {
+  rounded bg-muted px-1.5 py-0.5 font-mono text-[0.875em] text-foreground
+}
+
+/* Block of preformatted code. */
+@recipe code-block {
+  overflow-x-auto rounded-md border border-border bg-muted p-4 font-mono text-sm leading-6 text-foreground
+}
+
+/* Keyboard shortcut hint. */
+@recipe kbd {
+  inline-flex items-center rounded border border-border bg-muted px-1.5 py-0.5 font-mono text-xs text-foreground shadow-sm
+}

package/dist/registry/code@0.0.1.css

@@ -0,0 +1,22 @@
+/* shortwind: code@0.0.1 sha:cc8d2b0bedb5b453 */
+
+/* @guide
+   @code-inline for a code span inside prose, @code-block for a multi-line
+   preformatted block, @kbd for a keyboard-shortcut hint. Pick by context, not
+   by size.
+*/
+
+/* Inline code span. */
+@recipe code-inline {
+  rounded bg-muted px-1.5 py-0.5 font-mono text-[0.875em] text-foreground
+}
+
+/* Block of preformatted code. */
+@recipe code-block {
+  overflow-x-auto rounded-md border border-border bg-muted p-4 font-mono text-sm leading-6 text-foreground
+}
+
+/* Keyboard shortcut hint. */
+@recipe kbd {
+  inline-flex items-center rounded border border-border bg-muted px-1.5 py-0.5 font-mono text-xs text-foreground shadow-sm
+}

package/dist/registry/dialog/CHANGELOG.md

@@ -0,0 +1,5 @@
+# dialog
+
+## 0.0.1
+
+Initial release.

package/dist/registry/dialog.css

@@ -0,0 +1,33 @@
+/* shortwind: dialog@0.0.1 sha:b4dbf853e99fce75 */
+
+/* @guide
+   A modal is three layers: @dialog-overlay (dimmed backdrop), @dialog (the
+   centering wrapper), and @dialog-content (the panel). Structure the panel with
+   @dialog-header and @dialog-footer. Don't put content styling on @dialog
+   itself — it's only the positioner.
+*/
+
+/* Modal dialog wrapper — covers the viewport, centers content. */
+@recipe dialog {
+  fixed inset-0 z-50 flex items-center justify-center p-4
+}
+
+/* Dimmed overlay behind the dialog. */
+@recipe dialog-overlay {
+  fixed inset-0 z-40 bg-black/50
+}
+
+/* Dialog content panel. */
+@recipe dialog-content {
+  relative z-50 w-full max-w-md rounded-lg border border-border bg-popover text-popover-foreground p-6 shadow-xl
+}
+
+/* Dialog header region with title. */
+@recipe dialog-header {
+  mb-4 flex flex-col gap-1
+}
+
+/* Dialog footer with right-aligned actions. */
+@recipe dialog-footer {
+  mt-6 flex items-center justify-end gap-2
+}

package/dist/registry/dialog@0.0.1.css

@@ -0,0 +1,33 @@
+/* shortwind: dialog@0.0.1 sha:b4dbf853e99fce75 */
+
+/* @guide
+   A modal is three layers: @dialog-overlay (dimmed backdrop), @dialog (the
+   centering wrapper), and @dialog-content (the panel). Structure the panel with
+   @dialog-header and @dialog-footer. Don't put content styling on @dialog
+   itself — it's only the positioner.
+*/
+
+/* Modal dialog wrapper — covers the viewport, centers content. */
+@recipe dialog {
+  fixed inset-0 z-50 flex items-center justify-center p-4
+}
+
+/* Dimmed overlay behind the dialog. */
+@recipe dialog-overlay {
+  fixed inset-0 z-40 bg-black/50
+}
+
+/* Dialog content panel. */
+@recipe dialog-content {
+  relative z-50 w-full max-w-md rounded-lg border border-border bg-popover text-popover-foreground p-6 shadow-xl
+}
+
+/* Dialog header region with title. */
+@recipe dialog-header {
+  mb-4 flex flex-col gap-1
+}
+
+/* Dialog footer with right-aligned actions. */
+@recipe dialog-footer {
+  mt-6 flex items-center justify-end gap-2
+}

package/dist/registry/empty/CHANGELOG.md

@@ -0,0 +1,5 @@
+# empty
+
+## 0.0.1
+
+Initial release.

package/dist/registry/empty.css

@@ -0,0 +1,27 @@
+/* shortwind: empty@0.0.1 sha:003168e1b4a395c5 */
+
+/* @guide
+   @empty is the container for a no-data state; fill it with @empty-icon,
+   @empty-title, and @empty-description. These are slots for that pattern — use
+   @heading-* / @body from the text family for ordinary copy.
+*/
+
+/* Empty-state container. */
+@recipe empty {
+  flex flex-col items-center justify-center gap-3 rounded-md border border-dashed border-border p-8 text-center
+}
+
+/* Empty-state icon slot. */
+@recipe empty-icon {
+  flex h-12 w-12 items-center justify-center rounded-full bg-muted text-muted-foreground
+}
+
+/* Empty-state title text. */
+@recipe empty-title {
+  text-base font-semibold text-foreground
+}
+
+/* Empty-state supporting description. */
+@recipe empty-description {
+  max-w-sm text-sm text-muted-foreground
+}

package/dist/registry/empty@0.0.1.css

@@ -0,0 +1,27 @@
+/* shortwind: empty@0.0.1 sha:003168e1b4a395c5 */
+
+/* @guide
+   @empty is the container for a no-data state; fill it with @empty-icon,
+   @empty-title, and @empty-description. These are slots for that pattern — use
+   @heading-* / @body from the text family for ordinary copy.
+*/
+
+/* Empty-state container. */
+@recipe empty {
+  flex flex-col items-center justify-center gap-3 rounded-md border border-dashed border-border p-8 text-center
+}
+
+/* Empty-state icon slot. */
+@recipe empty-icon {
+  flex h-12 w-12 items-center justify-center rounded-full bg-muted text-muted-foreground
+}
+
+/* Empty-state title text. */
+@recipe empty-title {
+  text-base font-semibold text-foreground
+}
+
+/* Empty-state supporting description. */
+@recipe empty-description {
+  max-w-sm text-sm text-muted-foreground
+}

package/dist/registry/feedback/CHANGELOG.md

@@ -0,0 +1,5 @@
+# feedback
+
+## 0.0.1
+
+Initial release.

package/dist/registry/feedback.css

@@ -0,0 +1,47 @@
+/* shortwind: feedback@0.0.1 sha:818868f6af179bcf */
+
+/* @guide
+   Inline messages use @alert (neutral) or a tone variant @alert-success/
+   warning/danger/info — one tone each. @callout is a left-accent inline note,
+   @toast is a floating notification, @banner spans the full viewport width.
+*/
+
+/* Default informational alert. */
+@recipe alert {
+  flex items-start gap-3 rounded-md border border-border bg-card p-4 text-sm text-card-foreground
+}
+
+/* Success alert. */
+@recipe alert-success {
+  flex items-start gap-3 rounded-md border border-green-200 bg-green-50 p-4 text-sm text-green-900 dark:border-green-900 dark:bg-green-950 dark:text-green-100
+}
+
+/* Warning alert. */
+@recipe alert-warning {
+  flex items-start gap-3 rounded-md border border-amber-200 bg-amber-50 p-4 text-sm text-amber-900 dark:border-amber-900 dark:bg-amber-950 dark:text-amber-100
+}
+
+/* Danger alert. */
+@recipe alert-danger {
+  flex items-start gap-3 rounded-md border border-destructive/30 bg-destructive/10 p-4 text-sm text-destructive
+}
+
+/* Informational alert. */
+@recipe alert-info {
+  flex items-start gap-3 rounded-md border border-primary/30 bg-primary/10 p-4 text-sm text-primary
+}
+
+/* Inline callout — flush left edge accent. */
+@recipe callout {
+  border-l-4 border-primary bg-primary/10 p-4 text-sm text-foreground
+}
+
+/* Floating toast notification. */
+@recipe toast {
+  pointer-events-auto flex items-start gap-3 rounded-md border border-border bg-popover p-4 text-sm text-popover-foreground shadow-lg
+}
+
+/* Full-width banner spanning the viewport. */
+@recipe banner {
+  w-full bg-primary px-4 py-2 text-center text-sm font-medium text-primary-foreground
+}

package/dist/registry/feedback@0.0.1.css

@@ -0,0 +1,47 @@
+/* shortwind: feedback@0.0.1 sha:818868f6af179bcf */
+
+/* @guide
+   Inline messages use @alert (neutral) or a tone variant @alert-success/
+   warning/danger/info — one tone each. @callout is a left-accent inline note,
+   @toast is a floating notification, @banner spans the full viewport width.
+*/
+
+/* Default informational alert. */
+@recipe alert {
+  flex items-start gap-3 rounded-md border border-border bg-card p-4 text-sm text-card-foreground
+}
+
+/* Success alert. */
+@recipe alert-success {
+  flex items-start gap-3 rounded-md border border-green-200 bg-green-50 p-4 text-sm text-green-900 dark:border-green-900 dark:bg-green-950 dark:text-green-100
+}
+
+/* Warning alert. */
+@recipe alert-warning {
+  flex items-start gap-3 rounded-md border border-amber-200 bg-amber-50 p-4 text-sm text-amber-900 dark:border-amber-900 dark:bg-amber-950 dark:text-amber-100
+}
+
+/* Danger alert. */
+@recipe alert-danger {
+  flex items-start gap-3 rounded-md border border-destructive/30 bg-destructive/10 p-4 text-sm text-destructive
+}
+
+/* Informational alert. */
+@recipe alert-info {
+  flex items-start gap-3 rounded-md border border-primary/30 bg-primary/10 p-4 text-sm text-primary
+}
+
+/* Inline callout — flush left edge accent. */
+@recipe callout {
+  border-l-4 border-primary bg-primary/10 p-4 text-sm text-foreground
+}
+
+/* Floating toast notification. */
+@recipe toast {
+  pointer-events-auto flex items-start gap-3 rounded-md border border-border bg-popover p-4 text-sm text-popover-foreground shadow-lg
+}
+
+/* Full-width banner spanning the viewport. */
+@recipe banner {
+  w-full bg-primary px-4 py-2 text-center text-sm font-medium text-primary-foreground
+}

package/dist/registry/form/CHANGELOG.md

@@ -0,0 +1,5 @@
+# form
+
+## 0.0.1
+
+Initial release.

package/dist/registry/form.css

@@ -0,0 +1,67 @@
+/* shortwind: form@0.0.1 sha:bc12a9cc520a2d85 */
+
+/* @guide
+   Wrap each label+control+message in @field (use @field-error for the invalid
+   state); group related fields with @fieldset. Controls are bare: @input,
+   @textarea, @select, @checkbox, @radio, plus @input-error for invalid text
+   and @input-shell for the transparent shadcn-style shell. Helper text is
+   @help. There is no @form-group (use @field), @form-input (use @input),
+   @form-helper (use @help) or @form-checkbox (use @checkbox); the field label
+   recipe is @label, in the text family.
+*/
+
+/* Text input field. */
+@recipe input {
+  block w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-ring focus:outline-2 focus:outline-offset-2 focus:outline-ring disabled:cursor-not-allowed disabled:opacity-50
+}
+
+/* shadcn/dinachi-style input shell — transparent background, h-9, file/
+   placeholder/selection/aria-invalid/focus-visible states baked in. */
+@recipe input-shell {
+  flex h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs outline-none transition-[color,box-shadow] placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:border-destructive aria-invalid:ring-destructive/20 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:bg-input/30 dark:aria-invalid:ring-destructive/40
+}
+
+/* Input in error state. */
+@recipe input-error {
+  @input border-destructive focus:border-destructive focus:outline-destructive
+}
+
+/* Multi-line textarea. */
+@recipe textarea {
+  block w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-ring focus:outline-2 focus:outline-offset-2 focus:outline-ring disabled:cursor-not-allowed disabled:opacity-50
+}
+
+/* Native select control. */
+@recipe select {
+  block w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground focus:border-ring focus:outline-2 focus:outline-offset-2 focus:outline-ring disabled:cursor-not-allowed disabled:opacity-50
+}
+
+/* Checkbox input. */
+@recipe checkbox {
+  h-4 w-4 rounded border-input text-primary focus:outline-2 focus:outline-offset-2 focus:outline-ring
+}
+
+/* Radio input. */
+@recipe radio {
+  h-4 w-4 border-input text-primary focus:outline-2 focus:outline-offset-2 focus:outline-ring
+}
+
+/* Form field wrapper — label + input + help/error. */
+@recipe field {
+  flex flex-col gap-1.5
+}
+
+/* Form field in error state. */
+@recipe field-error {
+  flex flex-col gap-1.5
+}
+
+/* Grouped form section with optional legend. */
+@recipe fieldset {
+  flex flex-col gap-4 rounded-md border border-border p-4
+}
+
+/* Field-level helper text. */
+@recipe help {
+  text-xs text-muted-foreground
+}

package/dist/registry/form@0.0.1.css

@@ -0,0 +1,67 @@
+/* shortwind: form@0.0.1 sha:bc12a9cc520a2d85 */
+
+/* @guide
+   Wrap each label+control+message in @field (use @field-error for the invalid
+   state); group related fields with @fieldset. Controls are bare: @input,
+   @textarea, @select, @checkbox, @radio, plus @input-error for invalid text
+   and @input-shell for the transparent shadcn-style shell. Helper text is
+   @help. There is no @form-group (use @field), @form-input (use @input),
+   @form-helper (use @help) or @form-checkbox (use @checkbox); the field label
+   recipe is @label, in the text family.
+*/
+
+/* Text input field. */
+@recipe input {
+  block w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-ring focus:outline-2 focus:outline-offset-2 focus:outline-ring disabled:cursor-not-allowed disabled:opacity-50
+}
+
+/* shadcn/dinachi-style input shell — transparent background, h-9, file/
+   placeholder/selection/aria-invalid/focus-visible states baked in. */
+@recipe input-shell {
+  flex h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs outline-none transition-[color,box-shadow] placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:border-destructive aria-invalid:ring-destructive/20 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:bg-input/30 dark:aria-invalid:ring-destructive/40
+}
+
+/* Input in error state. */
+@recipe input-error {
+  @input border-destructive focus:border-destructive focus:outline-destructive
+}
+
+/* Multi-line textarea. */
+@recipe textarea {
+  block w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-ring focus:outline-2 focus:outline-offset-2 focus:outline-ring disabled:cursor-not-allowed disabled:opacity-50
+}
+
+/* Native select control. */
+@recipe select {
+  block w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground focus:border-ring focus:outline-2 focus:outline-offset-2 focus:outline-ring disabled:cursor-not-allowed disabled:opacity-50
+}
+
+/* Checkbox input. */
+@recipe checkbox {
+  h-4 w-4 rounded border-input text-primary focus:outline-2 focus:outline-offset-2 focus:outline-ring
+}
+
+/* Radio input. */
+@recipe radio {
+  h-4 w-4 border-input text-primary focus:outline-2 focus:outline-offset-2 focus:outline-ring
+}
+
+/* Form field wrapper — label + input + help/error. */
+@recipe field {
+  flex flex-col gap-1.5
+}
+
+/* Form field in error state. */
+@recipe field-error {
+  flex flex-col gap-1.5
+}
+
+/* Grouped form section with optional legend. */
+@recipe fieldset {
+  flex flex-col gap-4 rounded-md border border-border p-4
+}
+
+/* Field-level helper text. */
+@recipe help {
+  text-xs text-muted-foreground
+}

package/dist/registry/icon/CHANGELOG.md

@@ -0,0 +1,5 @@
+# icon
+
+## 0.0.1
+
+Initial release.

package/dist/registry/icon.css

@@ -0,0 +1,27 @@
+/* shortwind: icon@0.0.1 sha:fab3b2d3a0c089fb */
+
+/* @guide
+   Size an icon with @icon-sm/md/lg (16/20/24px) — these set width and height
+   only; add @icon-muted for secondary color. They're for SVG/icon elements, not
+   to be confused with @btn-icon (the icon button in the button family).
+*/
+
+/* Small icon — 16px. */
+@recipe icon-sm {
+  h-4 w-4 shrink-0
+}
+
+/* Default icon size — 20px. */
+@recipe icon-md {
+  h-5 w-5 shrink-0
+}
+
+/* Large icon — 24px. */
+@recipe icon-lg {
+  h-6 w-6 shrink-0
+}
+
+/* Icon with muted color. */
+@recipe icon-muted {
+  text-muted-foreground
+}

package/dist/registry/icon@0.0.1.css

@@ -0,0 +1,27 @@
+/* shortwind: icon@0.0.1 sha:fab3b2d3a0c089fb */
+
+/* @guide
+   Size an icon with @icon-sm/md/lg (16/20/24px) — these set width and height
+   only; add @icon-muted for secondary color. They're for SVG/icon elements, not
+   to be confused with @btn-icon (the icon button in the button family).
+*/
+
+/* Small icon — 16px. */
+@recipe icon-sm {
+  h-4 w-4 shrink-0
+}
+
+/* Default icon size — 20px. */
+@recipe icon-md {
+  h-5 w-5 shrink-0
+}
+
+/* Large icon — 24px. */
+@recipe icon-lg {
+  h-6 w-6 shrink-0
+}
+
+/* Icon with muted color. */
+@recipe icon-muted {
+  text-muted-foreground
+}

package/dist/registry/index.json

@@ -0,0 +1,23 @@
+{
+  "families": [
+    "badge",
+    "button",
+    "card",
+    "code",
+    "dialog",
+    "empty",
+    "feedback",
+    "form",
+    "icon",
+    "layout",
+    "list",
+    "media",
+    "navigation",
+    "progress",
+    "skeleton",
+    "surface",
+    "table",
+    "text",
+    "tooltip"
+  ]
+}

package/dist/registry/layout/CHANGELOG.md

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

package/dist/registry/layout.css

@@ -0,0 +1,70 @@
+/* shortwind: layout@0.0.1 sha:48a2a7b6e1a5d7ad */
+
+/* @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.
+*/
+
+/* Vertical stack with extra-small gap. */
+@recipe stack-xs {
+  flex flex-col gap-1
+}
+
+/* Vertical stack with small gap. */
+@recipe stack-sm {
+  flex flex-col gap-2
+}
+
+/* Vertical stack with medium gap. */
+@recipe stack-md {
+  flex flex-col gap-4
+}
+
+/* Vertical stack with large gap. */
+@recipe stack-lg {
+  flex flex-col gap-8
+}
+
+/* Horizontal row with default gap and centered items. */
+@recipe row {
+  flex flex-row items-center gap-2
+}
+
+/* Horizontal row with space between children. */
+@recipe row-between {
+  flex flex-row items-center justify-between gap-2
+}
+
+/* Horizontal row aligned to the end. */
+@recipe row-end {
+  flex flex-row items-center justify-end gap-2
+}
+
+/* Two-column responsive grid. */
+@recipe grid-2 {
+  grid grid-cols-1 gap-4 sm:grid-cols-2
+}
+
+/* Three-column responsive grid. */
+@recipe grid-3 {
+  grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3
+}
+
+/* Four-column responsive grid. */
+@recipe grid-4 {
+  grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4
+}
+
+/* Center content horizontally and vertically. */
+@recipe center {
+  flex items-center justify-center
+}
+
+/* Fill the available width and height. */
+@recipe full {
+  h-full w-full
+}