@waveinno/ui 0.2.0 → 0.4.0

package/dist/styles.css

@@ -2,7 +2,7 @@
 /* @waveinno/ui — import after tailwindcss:
      @import "tailwindcss";
      @import "@waveinno/ui/styles.css";
-     @source "<path to node_modules>/@waveinno/ui/src";
+     @source "<path to node_modules>/@waveinno/ui/dist";
    The consumer owns the Tailwind entry so it controls @source and plugins. */
 
 /* ══════════════════════════════════════════════════════════════════════════
@@ -37,6 +37,12 @@
   --primary-subtle: #eef2ff;
   --primary-muted: #c7d2fe;
   --accent: #7c3aed;
+  /* The brand gradient, royal to violet (the logo's own), and the ink that
+     dark panels, value bubbles and command menus are drawn in. A theme that
+     changes these changes every gradient, glow and ink surface with them. */
+  --brand-1: #1f45ea;
+  --brand-2: #7560fd;
+  --ink: #140d33;
 
   /* ── intent ── */
   --success: #009767;
@@ -53,10 +59,14 @@
   --elev3: 0 16px 48px rgba(5, 8, 22, 0.16);
   --lit: 0 0 #0000;
 
-  /* ── radius ── */
-  --r-ctl: 8px;
-  --r-card: 10px;
-  --r-dlg: 14px;
+  /* ── radius ──
+     One scale for every corner: the three named radii and each component's
+     own (written as calc(Npx * var(--radius-scale))). 0 is square, 1 the
+     WAVEINNO default, 1.8 very round. Pills stay pills. */
+  --radius-scale: 1;
+  --r-ctl: calc(8px * var(--radius-scale));
+  --r-card: calc(10px * var(--radius-scale));
+  --r-dlg: calc(14px * var(--radius-scale));
 
   /* ── shell geometry ── */
   --rail: 72px;
@@ -171,6 +181,9 @@
   --color-primary-subtle: var(--primary-subtle);
   --color-primary-muted: var(--primary-muted);
   --color-accent: var(--accent);
+  --color-brand-1: var(--brand-1);
+  --color-brand-2: var(--brand-2);
+  --color-ink: var(--ink);
 
   --color-success: var(--success);
   --color-success-subtle: var(--success-subtle);
@@ -656,3 +669,32 @@ select {
   100% { background-color: transparent }
 }
 .wm-saved { animation: wm-saved 900ms var(--ease) 1 }
+
+/* ── input and loading motion ── */
+/* A mark arriving: a radio's dot, a filled code box, the Caps Lock hint. */
+@keyframes wm-pop {
+  0% { transform: scale(.4); opacity: 0 }
+  70% { transform: scale(1.12); opacity: 1 }
+  100% { transform: scale(1) }
+}
+@keyframes wm-dot {
+  0%, 80%, 100% { transform: translateY(0); opacity: .35 }
+  40% { transform: translateY(-40%); opacity: 1 }
+}
+@keyframes wm-bar {
+  0%, 100% { transform: scaleY(.35) }
+  50% { transform: scaleY(1) }
+}
+.wm-dot { animation: wm-dot 1.1s var(--ease) infinite }
+.wm-bar { animation: wm-bar 1s var(--ease) infinite; transform-origin: center }
+
+/* A spinner that stops looks like a hang. Under reduced motion it keeps
+   turning, slowly, instead of being cut to one frame by the rule above. */
+@media (prefers-reduced-motion: reduce) {
+  [role="status"] .animate-spin,
+  .wm-dot,
+  .wm-bar {
+    animation-duration: 1.8s !important;
+    animation-iteration-count: infinite !important;
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@waveinno/ui",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "description": "WAVEINNO design system — tokens, shell, primitives and patterns shared by every WAVEINNO product",
   "keywords": [
     "waveinno",
@@ -29,6 +29,11 @@
       "import": "./dist/index.js",
       "default": "./dist/index.js"
     },
+    "./next": {
+      "types": "./dist/next/index.d.ts",
+      "import": "./dist/next/index.js",
+      "default": "./dist/next/index.js"
+    },
     "./styles.css": "./dist/styles.css",
     "./package.json": "./package.json",
     "./brand/*": "./dist/brand/*"
@@ -64,8 +69,10 @@
     "@radix-ui/react-label": "^2.1.15",
     "@radix-ui/react-popover": "^1.1.23",
     "@radix-ui/react-progress": "^1.1.16",
+    "@radix-ui/react-radio-group": "^1.4.7",
     "@radix-ui/react-select": "^2.3.7",
     "@radix-ui/react-separator": "^1.1.15",
+    "@radix-ui/react-slider": "^1.4.7",
     "@radix-ui/react-slot": "^1.3.3",
     "@radix-ui/react-switch": "^1.3.7",
     "@radix-ui/react-tabs": "^1.1.21",
@@ -85,6 +92,11 @@
     "react-dom": ">=19",
     "tailwindcss": ">=4"
   },
+  "peerDependenciesMeta": {
+    "next": {
+      "optional": true
+    }
+  },
   "devDependencies": {
     "@types/node": "^26.6.2",
     "@types/react": "^19.3.0",