@dryui/wizard 0.0.3 → 0.0.5

package/dist/index.js

@@ -58,7 +58,7 @@ function getWizardLayout(id) {
 }
 // ../mcp/src/spec.json
 var spec_default = {
-  version: "0.1.1",
+  version: "0.1.12",
   package: "@dryui/ui",
   themeImports: {
     default: "@dryui/ui/themes/default.css",
@@ -232,6 +232,12 @@ var spec_default = {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
         },
+        {
+          name: "data-group-orientation"
+        },
+        {
+          name: "data-in-group"
+        },
         {
           name: "data-size"
         },
@@ -957,6 +963,13 @@ var spec_default = {
         ]
       },
       cssVars: {
+        "--dry-btn-accent": "Accent",
+        "--dry-btn-accent-active": "Accent Active",
+        "--dry-btn-accent-fg": "Accent Fg",
+        "--dry-btn-accent-hover": "Accent Hover",
+        "--dry-btn-accent-stroke": "Accent Stroke",
+        "--dry-btn-border": "Border color",
+        "--dry-btn-on-accent": "On Accent",
         "--dry-dialog-bg": "Background color",
         "--dry-dialog-border": "Border color",
         "--dry-dialog-max-width": "Maximum width",
@@ -2040,6 +2053,9 @@ var spec_default = {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
         },
+        {
+          name: "data-indicator"
+        },
         {
           name: "data-orientation",
           description: "Reflects the current horizontal or vertical orientation.",
@@ -2175,6 +2191,9 @@ var spec_default = {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
         },
+        {
+          name: "data-indicator"
+        },
         {
           name: "data-state",
           description: "Reflects whether the collapsible content is expanded or collapsed.",
@@ -2578,8 +2597,7 @@ var spec_default = {
         ]
       },
       cssVars: {
-        "--dry-field-gap": "Gap spacing",
-        "--dry-field-label-order": "Label Order"
+        "--dry-field-gap": "Gap spacing"
       },
       dataAttributes: [
         {
@@ -3352,6 +3370,9 @@ var spec_default = {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
         },
+        {
+          name: "data-indicator"
+        },
         {
           name: "data-invalid",
           description: "Present when the current field value is invalid."
@@ -4475,9 +4496,6 @@ var spec_default = {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
         },
-        {
-          name: "data-option-swatch-group-content"
-        },
         {
           name: "data-option-swatch-group-item"
         },
@@ -4952,6 +4970,9 @@ var spec_default = {
         },
         {
           name: "data-tabs-trigger"
+        },
+        {
+          name: "data-tabs-trigger-content"
         }
       ],
       example: `<Tabs.Root bind:value={activeTab}>
@@ -8130,11 +8151,11 @@ var spec_default = {
         tree: [
           "Timeline.Root",
           "  Timeline.Item",
-          "  Timeline.Icon",
-          "  Timeline.Content",
-          "  Timeline.Title",
-          "  Timeline.Description",
-          "  Timeline.Time"
+          "    Timeline.Icon",
+          "    Timeline.Content",
+          "      Timeline.Title",
+          "      Timeline.Description",
+          "      Timeline.Time"
         ]
       },
       cssVars: {
@@ -8172,12 +8193,14 @@ var spec_default = {
         }
       ],
       example: `<Timeline.Root>
-  <Timeline.Item>...</Timeline.Item>
-  <Timeline.Icon>...</Timeline.Icon>
-  <Timeline.Content>...</Timeline.Content>
-  <Timeline.Title>...</Timeline.Title>
-  <Timeline.Description>...</Timeline.Description>
-  <Timeline.Time>...</Timeline.Time>
+  <Timeline.Item>
+    <Timeline.Icon />
+    <Timeline.Content>
+      <Timeline.Title>Event title</Timeline.Title>
+      <Timeline.Description>Event description</Timeline.Description>
+      <Timeline.Time>2 hours ago</Timeline.Time>
+    </Timeline.Content>
+  </Timeline.Item>
 </Timeline.Root>`
     },
     Typography: {
@@ -9876,6 +9899,7 @@ var spec_default = {
         ]
       },
       cssVars: {
+        "--dry-calendar-grid-gap": "Grid Gap",
         "--dry-dp-bg": "Background color",
         "--dry-dp-border": "Border color",
         "--dry-dp-font-size": "Font size",
@@ -9883,9 +9907,33 @@ var spec_default = {
         "--dry-dp-padding-y": "Vertical padding"
       },
       dataAttributes: [
+        {
+          name: "data-calendar-cell"
+        },
+        {
+          name: "data-calendar-columnheader"
+        },
         {
           name: "data-calendar-day"
         },
+        {
+          name: "data-calendar-day-button"
+        },
+        {
+          name: "data-calendar-header"
+        },
+        {
+          name: "data-calendar-heading"
+        },
+        {
+          name: "data-calendar-nav"
+        },
+        {
+          name: "data-calendar-panel"
+        },
+        {
+          name: "data-calendar-row"
+        },
         {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
@@ -9899,6 +9947,9 @@ var spec_default = {
         {
           name: "data-dp-trigger"
         },
+        {
+          name: "data-indicator"
+        },
         {
           name: "data-invalid",
           description: "Present when the current field value is invalid."
@@ -10362,9 +10413,33 @@ var spec_default = {
       },
       cssVars: {},
       dataAttributes: [
+        {
+          name: "data-calendar-cell"
+        },
+        {
+          name: "data-calendar-columnheader"
+        },
         {
           name: "data-calendar-day"
         },
+        {
+          name: "data-calendar-day-button"
+        },
+        {
+          name: "data-calendar-header"
+        },
+        {
+          name: "data-calendar-heading"
+        },
+        {
+          name: "data-calendar-nav"
+        },
+        {
+          name: "data-calendar-panel"
+        },
+        {
+          name: "data-calendar-row"
+        },
         {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
@@ -10378,15 +10453,15 @@ var spec_default = {
         {
           name: "data-drp-preset"
         },
-        {
-          name: "data-drp-root"
-        },
         {
           name: "data-drp-trigger"
         },
         {
           name: "data-in-range"
         },
+        {
+          name: "data-indicator"
+        },
         {
           name: "data-outside-month"
         },
@@ -10920,8 +10995,14 @@ var spec_default = {
         "--dry-range-calendar-day-hover-bg": "Calendar Day Hover Bg",
         "--dry-range-calendar-day-radius": "Calendar Day Radius",
         "--dry-range-calendar-day-size": "Calendar Day Size",
+        "--dry-range-calendar-heading-color": "Calendar Heading Color",
+        "--dry-range-calendar-nav-bg": "Calendar Nav Bg",
+        "--dry-range-calendar-nav-border": "Calendar Nav Border",
+        "--dry-range-calendar-nav-color": "Calendar Nav Color",
         "--dry-range-calendar-outside-color": "Calendar Outside Color",
         "--dry-range-calendar-padding": "Calendar Padding",
+        "--dry-range-calendar-panel-bg": "Calendar Panel Bg",
+        "--dry-range-calendar-panel-border": "Calendar Panel Border",
         "--dry-range-calendar-radius": "Calendar Radius",
         "--dry-range-calendar-range-bg": "Calendar Range Bg",
         "--dry-range-calendar-selected-bg": "Calendar Selected Bg",
@@ -10931,12 +11012,33 @@ var spec_default = {
         "--dry-range-calendar-today-color": "Calendar Today Color"
       },
       dataAttributes: [
+        {
+          name: "data-calendar-cell"
+        },
+        {
+          name: "data-calendar-columnheader"
+        },
         {
           name: "data-calendar-day"
         },
+        {
+          name: "data-calendar-day-button"
+        },
         {
           name: "data-calendar-header"
         },
+        {
+          name: "data-calendar-heading"
+        },
+        {
+          name: "data-calendar-nav"
+        },
+        {
+          name: "data-calendar-panel"
+        },
+        {
+          name: "data-calendar-row"
+        },
         {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
@@ -10959,10 +11061,6 @@ var spec_default = {
         {
           name: "data-range-start"
         },
-        {
-          name: "data-selected",
-          description: "Present when the current item is selected."
-        },
         {
           name: "data-today"
         }
@@ -11094,6 +11192,26 @@ var spec_default = {
           type: "number",
           required: false,
           description: "Step interval used when incrementing numeric values."
+        },
+        size: {
+          type: "'sm' | 'md' | 'lg'",
+          required: false,
+          acceptedValues: [
+            "sm",
+            "md",
+            "lg"
+          ],
+          description: "Size preset affecting density, spacing, or typography.",
+          default: "'md'"
+        },
+        name: {
+          type: "string",
+          required: false,
+          description: "Field name used during native form submission."
+        },
+        class: {
+          type: "string",
+          required: false
         }
       },
       forwardedProps: {
@@ -11107,25 +11225,23 @@ var spec_default = {
         ],
         note: "Forwards <input> attributes via rest props."
       },
-      cssVars: {
-        "--dry-time-input-bg": "Input Bg",
-        "--dry-time-input-border": "Input Border",
-        "--dry-time-input-color": "Input Color",
-        "--dry-time-input-font-size": "Input Font Size",
-        "--dry-time-input-padding-x": "Input Padding X",
-        "--dry-time-input-padding-y": "Input Padding Y",
-        "--dry-time-input-radius": "Input Radius"
-      },
+      cssVars: {},
       dataAttributes: [
         {
           name: "data-disabled",
           description: "Present when the component or part is disabled."
         },
         {
-          name: "data-time-input"
+          name: "data-placeholder"
+        },
+        {
+          name: "data-time-display"
         },
         {
           name: "data-time-input-wrapper"
+        },
+        {
+          name: "data-time-separator"
         }
       ],
       example: "<TimeInput>Content</TimeInput>"
@@ -11311,6 +11427,7 @@ var spec_default = {
       },
       cssVars: {
         "--dry-tags-input-font-size": "Input Font Size",
+        "--dry-tags-input-gap": "Input Gap",
         "--dry-tags-input-tag-font-size": "Input Tag Font Size",
         "--dry-tags-input-tag-padding-x": "Input Tag Padding X"
       },
@@ -11582,9 +11699,6 @@ var spec_default = {
         {
           name: "data-dragging"
         },
-        {
-          name: "data-file-upload"
-        },
         {
           name: "data-fu-dropzone"
         },
@@ -11995,14 +12109,18 @@ var spec_default = {
         ]
       },
       cssVars: {
+        "--dry-alpha-rgb": "Rgb",
         "--dry-color-picker-area-height": "Picker Area Height",
         "--dry-color-picker-area-width": "Picker Area Width",
         "--dry-color-picker-grid-dark": "Picker Grid Dark",
         "--dry-color-picker-grid-light": "Picker Grid Light",
         "--dry-color-picker-grid-size": "Picker Grid Size",
         "--dry-color-picker-indicator-border": "Picker Indicator Border",
+        "--dry-color-picker-indicator-color": "Picker Indicator Color",
+        "--dry-color-picker-indicator-left": "Picker Indicator Left",
         "--dry-color-picker-indicator-shadow": "Picker Indicator Shadow",
         "--dry-color-picker-indicator-size": "Picker Indicator Size",
+        "--dry-color-picker-indicator-top": "Picker Indicator Top",
         "--dry-color-picker-slider-thumb-bg": "Picker Slider Thumb Bg",
         "--dry-color-picker-slider-thumb-border": "Picker Slider Thumb Border",
         "--dry-color-picker-slider-thumb-shadow": "Picker Slider Thumb Shadow",
@@ -12013,7 +12131,9 @@ var spec_default = {
         "--dry-color-picker-swatch-size": "Picker Swatch Size",
         "--dry-color-picker-width": "Picker Width",
         "--dry-slider-thumb-size": "Thumb size",
-        "--dry-slider-track-height": "Track height"
+        "--dry-slider-track-height": "Track height",
+        "--dry-swatch-color": "Text color",
+        "--dry-swatch-opacity": "Opacity"
       },
       dataAttributes: [
         {
@@ -12489,7 +12609,13 @@ var spec_default = {
         ],
         note: "Forwards <div> attributes via rest props."
       },
-      cssVars: {},
+      cssVars: {
+        "--dry-spotlight-color": "Text color",
+        "--dry-spotlight-intensity": "Intensity",
+        "--dry-spotlight-radius": "Border radius",
+        "--dry-spotlight-x": "X",
+        "--dry-spotlight-y": "Y"
+      },
       dataAttributes: [
         {
           name: "data-active",
@@ -12580,8 +12706,10 @@ var spec_default = {
         "--dry-aurora-color-2": "Color 2",
         "--dry-aurora-color-3": "Color 3",
         "--dry-aurora-duration": "Duration",
+        "--dry-aurora-intensity": "Intensity",
         "--dry-aurora-shift": "Shift",
-        "--dry-aurora-surface": "Surface"
+        "--dry-aurora-surface": "Surface",
+        "--dry-aurora-waviness": "Waviness"
       },
       dataAttributes: [
         {
@@ -12817,6 +12945,7 @@ var spec_default = {
         "--dry-fab-color": "Text color",
         "--dry-fab-gap": "Gap spacing",
         "--dry-fab-offset": "Offset",
+        "--dry-fab-position": "Position",
         "--dry-fab-shadow": "Box shadow",
         "--dry-fab-z-index": "Z Index"
       },
@@ -13209,7 +13338,8 @@ var spec_default = {
         },
         overscan: {
           type: "number",
-          required: false
+          required: false,
+          default: "5"
         },
         children: {
           type: "Snippet<[{ item: T; index: number; style: string }]>",
@@ -13241,6 +13371,9 @@ var spec_default = {
       dataAttributes: [
         {
           name: "data-virtual-list"
+        },
+        {
+          name: "data-virtual-list-inner"
         }
       ],
       example: "<VirtualList>Content</VirtualList>"
@@ -14270,7 +14403,8 @@ var spec_default = {
             placeholder: {
               type: "string",
               required: false,
-              description: "Hint text shown when no value is selected or entered."
+              description: "Hint text shown when no value is selected or entered.",
+              default: "''"
             },
             readonly: {
               type: "boolean",
@@ -14356,8 +14490,20 @@ var spec_default = {
         {
           name: "data-part"
         },
+        {
+          name: "data-placeholder"
+        },
         {
           name: "data-readonly"
+        },
+        {
+          name: "data-rte-content"
+        },
+        {
+          name: "data-rte-root"
+        },
+        {
+          name: "data-rte-toolbar"
         }
       ],
       example: `<RichTextEditor.Root>
@@ -15530,6 +15676,7 @@ var spec_default = {
         "--dry-image-comparison-handle-shadow": "Comparison Handle Shadow",
         "--dry-image-comparison-handle-width": "Comparison Handle Width",
         "--dry-image-comparison-handle-z-index": "Comparison Handle Z Index",
+        "--dry-image-comparison-position": "Comparison Position",
         "--dry-image-comparison-radius": "Comparison Radius"
       },
       dataAttributes: [
@@ -17250,18 +17397,6 @@ var spec_default = {
         "--dry-map-radius": "Border radius"
       },
       dataAttributes: [
-        {
-          name: "data-map-mapboxgl"
-        },
-        {
-          name: "data-map-maplibregl"
-        },
-        {
-          name: "data-map-marker"
-        },
-        {
-          name: "data-map-popup"
-        },
         {
           name: "data-map-root"
         },
@@ -17278,7 +17413,7 @@ var spec_default = {
     },
     SystemMap: {
       import: "@dryui/ui",
-      description: "Layered architecture diagram for DolphinGraph nodes, relationships, and audit signals",
+      description: "Layered architecture diagram that visualizes component nodes, relationships, and dependency layers",
       category: "display",
       tags: [
         "diagram",
@@ -17349,92 +17484,40 @@ var spec_default = {
         ],
         note: "Forwards <div> attributes via rest props."
       },
-      cssVars: {
-        "--dry-system-map-bg": "Map Bg",
-        "--dry-system-map-border": "Map Border",
-        "--dry-system-map-shadow": "Map Shadow",
-        "--dry-system-map-surface": "Map Surface",
-        "--dry-system-map-text": "Map Text",
-        "--dry-system-map-text-muted": "Map Text Muted"
-      },
+      cssVars: {},
       dataAttributes: [
         {
-          name: "data-canvas-shell"
-        },
-        {
-          name: "data-dashed"
-        },
-        {
-          name: "data-edge-label"
-        },
-        {
-          name: "data-empty-hint"
-        },
-        {
-          name: "data-empty-label"
-        },
-        {
-          name: "data-eyebrow"
-        },
-        {
-          name: "data-group-label"
-        },
-        {
-          name: "data-header"
-        },
-        {
-          name: "data-header-badges"
-        },
-        {
-          name: "data-header-text"
+          name: "data-connector"
         },
         {
-          name: "data-lane-meta"
+          name: "data-connector-label"
         },
         {
-          name: "data-lane-title"
+          name: "data-connector-line"
         },
         {
-          name: "data-legend"
+          name: "data-edge-row"
         },
         {
-          name: "data-legend-item"
-        },
-        {
-          name: "data-legend-items"
-        },
-        {
-          name: "data-legend-section"
-        },
-        {
-          name: "data-line-swatch"
-        },
-        {
-          name: "data-map-title"
-        },
-        {
-          name: "data-node-description"
+          name: "data-empty"
         },
         {
-          name: "data-node-label"
+          name: "data-focused"
         },
         {
-          name: "data-node-meta"
+          name: "data-node"
         },
         {
-          name: "data-summary"
+          name: "data-node-helper"
         },
         {
-          name: "data-svg"
+          name: "data-node-name"
         },
         {
-          name: "data-swatch"
+          name: "data-orphans"
         },
         {
           name: "data-system-map"
-        },
-        {
-          name: "data-thumbnail-object"
         }
       ],
       example: "<SystemMap>Content</SystemMap>"
@@ -17890,8 +17973,7 @@ var spec_default = {
         },
         blendMode: {
           type: "BlendMode",
-          required: false,
-          default: "'screen'"
+          required: false
         },
         children: {
           type: "Snippet",
@@ -17910,7 +17992,13 @@ var spec_default = {
         ],
         note: "Forwards <div> attributes via rest props."
       },
-      cssVars: {},
+      cssVars: {
+        "--dry-beam-angle": "Angle",
+        "--dry-beam-color": "Text color",
+        "--dry-beam-intensity": "Intensity",
+        "--dry-beam-speed": "Speed",
+        "--dry-beam-width": "Width"
+      },
       dataAttributes: [
         {
           name: "data-beam"
@@ -18029,7 +18117,14 @@ var spec_default = {
         ],
         note: "Forwards <div> attributes via rest props."
       },
-      cssVars: {},
+      cssVars: {
+        "--dry-rays-blend": "Blend",
+        "--dry-rays-color": "Text color",
+        "--dry-rays-cx": "Cx",
+        "--dry-rays-cy": "Cy",
+        "--dry-rays-intensity": "Intensity",
+        "--dry-rays-speed": "Speed"
+      },
       dataAttributes: [
         {
           name: "data-animated"
@@ -23383,21 +23478,10 @@ var spec_default = {
   </body>
 </html>
 
-<!-- 2. src/app.css \u2014 global reset with DryUI tokens -->
+<!-- 2. src/app.css \u2014 import themes (resets are built in) -->
 @import '@dryui/ui/themes/default.css';
 @import '@dryui/ui/themes/dark.css';
 
-*, *::before, *::after { box-sizing: border-box; margin: 0; }
-
-html {
-  font-family: var(--dry-font-sans);
-  color: var(--dry-color-text-strong);
-  background: var(--dry-color-bg-base);
-  -webkit-font-smoothing: antialiased;
-}
-
-body { margin: 0; min-height: 100dvh; }
-
 <!-- 3. src/routes/+layout.svelte \u2014 root layout -->
 <script>
   import '../app.css';
@@ -23499,7 +23583,7 @@ body { margin: 0; min-height: 100dvh; }
       },
       "simple-content-page": {
         name: "simple-content-page",
-        description: "Clean content page with constrained width and vertical rhythm. Use Container for max-width and Stack for vertical spacing. Suitable for blog posts, documentation, settings pages.",
+        description: "Clean content page with constrained width and vertical rhythm. Use Container for max-width and CSS grid for vertical spacing. Suitable for blog posts, documentation, settings pages.",
         tags: [
           "page",
           "content",