@nexus-cross/design-system 1.0.13 → 1.0.14

package/dist/styles/.generated/built.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"built.d.ts","sourceRoot":"","sources":["../../../src/styles/.generated/built.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,GAAG,mlpIAA2y+G,CAAC;AACrz+G,eAAe,GAAG,CAAC"}
+{"version":3,"file":"built.d.ts","sourceRoot":"","sources":["../../../src/styles/.generated/built.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,GAAG,6vsIAAi8hH,CAAC;AAC38hH,eAAe,GAAG,CAAC"}

package/dist/styles/layer.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkV35IEPRL_js = require('../chunks/chunk-V35IEPRL.js');
+var chunkLAOQRXCE_js = require('../chunks/chunk-LAOQRXCE.js');
 require('../chunks/chunk-JNMCYWGY.js');
 
 // src/styles/inject-layer.ts
@@ -9,7 +9,7 @@ var __nexus_styles_injected__ = typeof document !== "undefined" && !document.get
   const style = document.createElement("style");
   style.id = STYLE_ID;
   style.textContent = `@layer nexus {
-${chunkV35IEPRL_js.built_default}
+${chunkLAOQRXCE_js.built_default}
 }`;
   document.head.appendChild(style);
   return true;

package/dist/styles/layer.mjs

@@ -1,4 +1,4 @@
-import { built_default } from '../chunks/chunk-6ECGMUT6.mjs';
+import { built_default } from '../chunks/chunk-S6ODYMFP.mjs';
 import '../chunks/chunk-CVYXRSXT.mjs';
 
 // src/styles/inject-layer.ts

package/dist/styles.css

@@ -3624,17 +3624,14 @@
 }
 .nexus-stepper--horizontal .nexus-stepper__connector {
   flex: 1;
-  height: 2px;
-  background: var(--color-border-default);
-  transition: background var(--duration-transition-normal, 200ms)
+  height: 0;
+  border-top: 1px dashed var(--color-border-default);
+  transition: border-color var(--duration-transition-normal, 200ms)
     var(--ease-transition-normal);
 }
 .nexus-stepper--horizontal .nexus-stepper__connector--hidden {
   visibility: hidden;
 }
-.nexus-stepper--horizontal .nexus-stepper__connector--completed {
-  background: var(--color-accent-primary);
-}
 .nexus-stepper--horizontal .nexus-stepper__content {
   margin-top: var(--spacing-gap-sm, 0.5rem);
   padding: 0 var(--spacing-padding-2xs, 0.25rem);
@@ -3659,16 +3656,13 @@
   flex-shrink: 0;
 }
 .nexus-stepper--vertical .nexus-stepper__connector {
-  width: 2px;
+  width: 0;
   flex: 1;
   min-height: var(--spacing-padding-sm, 0.75rem);
-  background: var(--color-border-default);
-  transition: background var(--duration-transition-normal, 200ms)
+  border-left: 1px dashed var(--color-border-default);
+  transition: border-color var(--duration-transition-normal, 200ms)
     var(--ease-transition-normal);
 }
-.nexus-stepper--vertical .nexus-stepper__connector--completed {
-  background: var(--color-accent-primary);
-}
 .nexus-stepper--vertical .nexus-stepper__content {
   padding: var(--spacing-padding-xs, 0.5rem) 0;
 }
@@ -3679,25 +3673,27 @@
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
-  width: var(--size-control-sm, 2rem);
-  height: var(--size-control-sm, 2rem);
+  width: 30px;
+  height: 30px;
   border-radius: var(--radius-corner-full, 9999px);
-  border: 2px solid var(--color-border-medium);
-  background: var(--color-surface-default);
-  font-size: var(--text-text-sm, 0.875rem);
-  font-weight: var(--font-weight-text-medium-sm, 500);
-  color: var(--color-text-secondary);
-  transition: all var(--duration-transition-normal, 200ms)
-    var(--ease-transition-normal);
+  border: 1px solid var(--color-border-medium);
+  background: transparent;
+  font-size: var(--text-label-semibold-md, 0.875rem);
+  font-weight: var(--font-weight-label-semibold-md, 600);
+  color: var(--color-text-tertiary);
+  transition:
+    border-color var(--duration-transition-normal, 200ms) var(--ease-transition-normal),
+    background-color var(--duration-transition-normal, 200ms) var(--ease-transition-normal),
+    color var(--duration-transition-normal, 200ms) var(--ease-transition-normal);
 }
 .nexus-stepper--sm .nexus-stepper__indicator {
-  width: 1.75rem;
-  height: 1.75rem;
+  width: 1.5rem;
+  height: 1.5rem;
   font-size: var(--text-text-xs, 0.75rem);
 }
 .nexus-stepper__check {
-  width: var(--size-icon-sm, 1rem);
-  height: var(--size-icon-sm, 1rem);
+  width: 13px;
+  height: 13px;
 }
 .nexus-stepper--sm .nexus-stepper__check {
   width: var(--size-icon-xs, 0.75rem);
@@ -3707,33 +3703,31 @@
 /* ── State colors ── */
 .nexus-stepper__step--completed .nexus-stepper__indicator {
   border-color: var(--color-accent-primary);
-  background: var(--color-accent-primary);
-  color: var(--color-accent-on-primary);
+  background: transparent;
+  color: var(--color-accent-primary);
 }
 .nexus-stepper__step--active .nexus-stepper__indicator {
   border-color: var(--color-accent-primary);
-  color: var(--color-accent-primary);
-  background: var(--color-surface-default);
-  box-shadow: 0 0 0 3px
-    color-mix(in srgb, var(--color-accent-primary) 20%, transparent);
+  background: var(--color-accent-primary);
+  color: var(--color-accent-on-primary);
 }
 .nexus-stepper__step--error .nexus-stepper__indicator {
   border-color: var(--color-status-danger);
   color: var(--color-status-danger);
-  background: var(--color-surface-default);
-  box-shadow: 0 0 0 3px
-    color-mix(in srgb, var(--color-status-danger) 20%, transparent);
+  background: transparent;
 }
 .nexus-stepper__step--pending .nexus-stepper__indicator {
-  border-color: var(--color-border-default);
+  border-color: var(--color-border-medium);
   color: var(--color-text-tertiary);
 }
 
 /* ── Labels ── */
 .nexus-stepper__label {
   display: block;
-  font-size: var(--text-text-sm, 0.875rem);
-  font-weight: var(--font-weight-text-medium-sm, 500);
+  font-size: var(--text-text-medium-xs, 0.75rem);
+  font-weight: var(--font-weight-text-medium-xs, 500);
+  line-height: 1.5;
+  letter-spacing: var(--letter-spacing-text-medium-xs, -0.01em);
   color: var(--color-text-primary);
 }
 .nexus-stepper--sm .nexus-stepper__label {
@@ -3745,13 +3739,64 @@
   font-size: var(--text-text-xs, 0.75rem);
   color: var(--color-text-secondary);
 }
-.nexus-stepper__step--pending .nexus-stepper__label {
+.nexus-stepper__step--completed .nexus-stepper__label {
   color: var(--color-text-secondary);
 }
+.nexus-stepper__step--completed .nexus-stepper__description {
+  color: var(--color-text-muted);
+}
+.nexus-stepper__step--pending .nexus-stepper__label {
+  color: var(--color-text-tertiary);
+}
 .nexus-stepper__step--pending .nexus-stepper__description {
   color: var(--color-text-muted);
 }
 
+/* ── Animations ── */
+
+@keyframes nexus-stepper-pulse {
+  0%, 100% { box-shadow: 0 0 0 0 rgba(9, 180, 152, 0.25); }
+  50% { box-shadow: 0 0 0 3px rgba(9, 180, 152, 0.25); }
+}
+@keyframes nexus-stepper-pop {
+  0% { transform: scale(0.7); opacity: 0.5; }
+  60% { transform: scale(1.15); opacity: 1; }
+  100% { transform: scale(1); opacity: 1; }
+}
+@keyframes nexus-stepper-check-in {
+  0% { opacity: 0; transform: scale(0) rotate(-45deg); }
+  60% { opacity: 1; transform: scale(1.2) rotate(0deg); }
+  100% { opacity: 1; transform: scale(1) rotate(0deg); }
+}
+@keyframes nexus-stepper-label-slide {
+  0% { opacity: 0; transform: translateY(4px); }
+  100% { opacity: 1; transform: translateY(0); }
+}
+
+.nexus-stepper__step--active .nexus-stepper__indicator {
+  animation: nexus-stepper-pulse 2s ease-in-out infinite;
+}
+
+.nexus-stepper__step--animating.nexus-stepper__step--active .nexus-stepper__indicator {
+  animation:
+    nexus-stepper-pop 500ms cubic-bezier(0.175, 0.885, 0.32, 1.275) both,
+    nexus-stepper-pulse 2s ease-in-out 500ms infinite;
+}
+.nexus-stepper__step--animating.nexus-stepper__step--active .nexus-stepper__label {
+  animation: nexus-stepper-label-slide 350ms ease-out both;
+}
+.nexus-stepper__step--animating.nexus-stepper__step--active .nexus-stepper__description {
+  animation: nexus-stepper-label-slide 350ms ease-out 50ms both;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .nexus-stepper__step--active .nexus-stepper__indicator,
+  .nexus-stepper__step--animating .nexus-stepper__indicator,
+  .nexus-stepper__step--animating .nexus-stepper__label,
+  .nexus-stepper__step--animating .nexus-stepper__description,
+  .nexus-stepper__check { animation: none !important; }
+}
+
 /* ═══════════════════════════════════════════
      TagInput
      ═══════════════════════════════════════════ */

package/dist/styles.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkV35IEPRL_js = require('./chunks/chunk-V35IEPRL.js');
+var chunkLAOQRXCE_js = require('./chunks/chunk-LAOQRXCE.js');
 require('./chunks/chunk-JNMCYWGY.js');
 
 // src/styles/inject.ts
@@ -8,7 +8,7 @@ var STYLE_ID = "__nexus-ds__";
 var __nexus_styles_injected__ = typeof document !== "undefined" && !document.getElementById(STYLE_ID) ? (() => {
   const style = document.createElement("style");
   style.id = STYLE_ID;
-  style.textContent = chunkV35IEPRL_js.built_default;
+  style.textContent = chunkLAOQRXCE_js.built_default;
   document.head.appendChild(style);
   return true;
 })() : false;

package/dist/styles.layered.css

@@ -3625,17 +3625,14 @@
 }
 .nexus-stepper--horizontal .nexus-stepper__connector {
   flex: 1;
-  height: 2px;
-  background: var(--color-border-default);
-  transition: background var(--duration-transition-normal, 200ms)
+  height: 0;
+  border-top: 1px dashed var(--color-border-default);
+  transition: border-color var(--duration-transition-normal, 200ms)
     var(--ease-transition-normal);
 }
 .nexus-stepper--horizontal .nexus-stepper__connector--hidden {
   visibility: hidden;
 }
-.nexus-stepper--horizontal .nexus-stepper__connector--completed {
-  background: var(--color-accent-primary);
-}
 .nexus-stepper--horizontal .nexus-stepper__content {
   margin-top: var(--spacing-gap-sm, 0.5rem);
   padding: 0 var(--spacing-padding-2xs, 0.25rem);
@@ -3660,16 +3657,13 @@
   flex-shrink: 0;
 }
 .nexus-stepper--vertical .nexus-stepper__connector {
-  width: 2px;
+  width: 0;
   flex: 1;
   min-height: var(--spacing-padding-sm, 0.75rem);
-  background: var(--color-border-default);
-  transition: background var(--duration-transition-normal, 200ms)
+  border-left: 1px dashed var(--color-border-default);
+  transition: border-color var(--duration-transition-normal, 200ms)
     var(--ease-transition-normal);
 }
-.nexus-stepper--vertical .nexus-stepper__connector--completed {
-  background: var(--color-accent-primary);
-}
 .nexus-stepper--vertical .nexus-stepper__content {
   padding: var(--spacing-padding-xs, 0.5rem) 0;
 }
@@ -3680,25 +3674,27 @@
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
-  width: var(--size-control-sm, 2rem);
-  height: var(--size-control-sm, 2rem);
+  width: 30px;
+  height: 30px;
   border-radius: var(--radius-corner-full, 9999px);
-  border: 2px solid var(--color-border-medium);
-  background: var(--color-surface-default);
-  font-size: var(--text-text-sm, 0.875rem);
-  font-weight: var(--font-weight-text-medium-sm, 500);
-  color: var(--color-text-secondary);
-  transition: all var(--duration-transition-normal, 200ms)
-    var(--ease-transition-normal);
+  border: 1px solid var(--color-border-medium);
+  background: transparent;
+  font-size: var(--text-label-semibold-md, 0.875rem);
+  font-weight: var(--font-weight-label-semibold-md, 600);
+  color: var(--color-text-tertiary);
+  transition:
+    border-color var(--duration-transition-normal, 200ms) var(--ease-transition-normal),
+    background-color var(--duration-transition-normal, 200ms) var(--ease-transition-normal),
+    color var(--duration-transition-normal, 200ms) var(--ease-transition-normal);
 }
 .nexus-stepper--sm .nexus-stepper__indicator {
-  width: 1.75rem;
-  height: 1.75rem;
+  width: 1.5rem;
+  height: 1.5rem;
   font-size: var(--text-text-xs, 0.75rem);
 }
 .nexus-stepper__check {
-  width: var(--size-icon-sm, 1rem);
-  height: var(--size-icon-sm, 1rem);
+  width: 13px;
+  height: 13px;
 }
 .nexus-stepper--sm .nexus-stepper__check {
   width: var(--size-icon-xs, 0.75rem);
@@ -3708,33 +3704,31 @@
 /* ── State colors ── */
 .nexus-stepper__step--completed .nexus-stepper__indicator {
   border-color: var(--color-accent-primary);
-  background: var(--color-accent-primary);
-  color: var(--color-accent-on-primary);
+  background: transparent;
+  color: var(--color-accent-primary);
 }
 .nexus-stepper__step--active .nexus-stepper__indicator {
   border-color: var(--color-accent-primary);
-  color: var(--color-accent-primary);
-  background: var(--color-surface-default);
-  box-shadow: 0 0 0 3px
-    color-mix(in srgb, var(--color-accent-primary) 20%, transparent);
+  background: var(--color-accent-primary);
+  color: var(--color-accent-on-primary);
 }
 .nexus-stepper__step--error .nexus-stepper__indicator {
   border-color: var(--color-status-danger);
   color: var(--color-status-danger);
-  background: var(--color-surface-default);
-  box-shadow: 0 0 0 3px
-    color-mix(in srgb, var(--color-status-danger) 20%, transparent);
+  background: transparent;
 }
 .nexus-stepper__step--pending .nexus-stepper__indicator {
-  border-color: var(--color-border-default);
+  border-color: var(--color-border-medium);
   color: var(--color-text-tertiary);
 }
 
 /* ── Labels ── */
 .nexus-stepper__label {
   display: block;
-  font-size: var(--text-text-sm, 0.875rem);
-  font-weight: var(--font-weight-text-medium-sm, 500);
+  font-size: var(--text-text-medium-xs, 0.75rem);
+  font-weight: var(--font-weight-text-medium-xs, 500);
+  line-height: 1.5;
+  letter-spacing: var(--letter-spacing-text-medium-xs, -0.01em);
   color: var(--color-text-primary);
 }
 .nexus-stepper--sm .nexus-stepper__label {
@@ -3746,13 +3740,64 @@
   font-size: var(--text-text-xs, 0.75rem);
   color: var(--color-text-secondary);
 }
-.nexus-stepper__step--pending .nexus-stepper__label {
+.nexus-stepper__step--completed .nexus-stepper__label {
   color: var(--color-text-secondary);
 }
+.nexus-stepper__step--completed .nexus-stepper__description {
+  color: var(--color-text-muted);
+}
+.nexus-stepper__step--pending .nexus-stepper__label {
+  color: var(--color-text-tertiary);
+}
 .nexus-stepper__step--pending .nexus-stepper__description {
   color: var(--color-text-muted);
 }
 
+/* ── Animations ── */
+
+@keyframes nexus-stepper-pulse {
+  0%, 100% { box-shadow: 0 0 0 0 rgba(9, 180, 152, 0.25); }
+  50% { box-shadow: 0 0 0 3px rgba(9, 180, 152, 0.25); }
+}
+@keyframes nexus-stepper-pop {
+  0% { transform: scale(0.7); opacity: 0.5; }
+  60% { transform: scale(1.15); opacity: 1; }
+  100% { transform: scale(1); opacity: 1; }
+}
+@keyframes nexus-stepper-check-in {
+  0% { opacity: 0; transform: scale(0) rotate(-45deg); }
+  60% { opacity: 1; transform: scale(1.2) rotate(0deg); }
+  100% { opacity: 1; transform: scale(1) rotate(0deg); }
+}
+@keyframes nexus-stepper-label-slide {
+  0% { opacity: 0; transform: translateY(4px); }
+  100% { opacity: 1; transform: translateY(0); }
+}
+
+.nexus-stepper__step--active .nexus-stepper__indicator {
+  animation: nexus-stepper-pulse 2s ease-in-out infinite;
+}
+
+.nexus-stepper__step--animating.nexus-stepper__step--active .nexus-stepper__indicator {
+  animation:
+    nexus-stepper-pop 500ms cubic-bezier(0.175, 0.885, 0.32, 1.275) both,
+    nexus-stepper-pulse 2s ease-in-out 500ms infinite;
+}
+.nexus-stepper__step--animating.nexus-stepper__step--active .nexus-stepper__label {
+  animation: nexus-stepper-label-slide 350ms ease-out both;
+}
+.nexus-stepper__step--animating.nexus-stepper__step--active .nexus-stepper__description {
+  animation: nexus-stepper-label-slide 350ms ease-out 50ms both;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .nexus-stepper__step--active .nexus-stepper__indicator,
+  .nexus-stepper__step--animating .nexus-stepper__indicator,
+  .nexus-stepper__step--animating .nexus-stepper__label,
+  .nexus-stepper__step--animating .nexus-stepper__description,
+  .nexus-stepper__check { animation: none !important; }
+}
+
 /* ═══════════════════════════════════════════
      TagInput
      ═══════════════════════════════════════════ */

package/dist/styles.mjs

@@ -1,4 +1,4 @@
-import { built_default } from './chunks/chunk-6ECGMUT6.mjs';
+import { built_default } from './chunks/chunk-S6ODYMFP.mjs';
 import './chunks/chunk-CVYXRSXT.mjs';
 
 // src/styles/inject.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nexus-cross/design-system",
-  "version": "1.0.13",
+  "version": "1.0.14",
   "description": "NEXUS Design System UI Components",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -348,7 +348,7 @@
     "typescript": "^5.0.0",
     "vitest": "^1.6.1",
     "zod-to-json-schema": "^3.25.2",
-    "@nexus-cross/tokens": "1.0.13"
+    "@nexus-cross/tokens": "1.0.14"
   },
   "scripts": {
     "postinstall": "node scripts/setup-cursor-rules.cjs",