@yuva-devlab/tokens 0.1.1 → 1.0.0

package/README.md

@@ -3,204 +3,45 @@
 [![npm version](https://img.shields.io/npm/v/@yuva-devlab/tokens.svg)](https://www.npmjs.com/package/@yuva-devlab/tokens)
 [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)
 
-> Design system tokens built with Vanilla Extract, providing a comprehensive
-> foundation for consistent UI development.
+> Tailwind CSS 4 preset and design token theme bridge for the Yuva DevLab Design System.
 
 ## Features
 
-- 🎨 **Automated Tonal Palettes** - Material Design 3 inspired color generation
-- 🌓 **Light/Dark Themes** - Semantic color tokens that adapt to theme
-- 📏 **Systematic Spacing** - Consistent scale from 2xs to 5xl
-- 📝 **Typography Scale** - Harmonious type system
-- 🎯 **Zero Runtime** - All tokens compiled to CSS variables at build time
-- 🔒 **Type-Safe** - Full TypeScript autocomplete for all tokens
+- 🎨 **Tailwind CSS 4 Preset** - Native `@theme inline` mappings bridging tokens to Tailwind utilities
+- 🌓 **Modern OKLCH Color Tokens** - Clean, perceptual contrast in light and dark modes
+- 🚀 **Zero-Config Theming** - Drop-in theme presets for applications (FinAI, OrchestrAI)
+- 🎯 **Pure CSS** - Zero runtime overhead and zero JS dependencies
 
 ## Installation
 
 ```bash
+# npm
 npm install @yuva-devlab/tokens
-```
-
-**Zero runtime dependencies** - All tokens are compiled to static CSS at build
-time.
-
-## Token Categories
-
-### Colors
-
-- **Tonal Palettes** - 13-shade palettes for primary, secondary, tertiary,
-  neutral, and error
-- **Semantic Colors** - Theme-aware tokens (background, surface, primary, etc.)
-- **State Colors** - Hover, active, and disabled states
-
-### Spacing
-
-- **Scale**: `2xs`, `xs`, `sm`, `md`, `lg`, `xl`, `2xl`, `3xl`, `4xl`, `5xl`
-- **Values**: 4px to 96px in systematic increments
-
-### Typography
-
-- **Sizes**: `xs`, `sm`, `md`, `lg`, `xl`, `2xl`, `3xl`, `4xl`, `5xl`
-- **Weights**: `light`, `regular`, `medium`, `semibold`, `bold`
-- **Line Heights**: Optimized for readability
-
-### Other Tokens
 
-- **Border Radius**: `sm`, `md`, `lg`, `xl`, `full`
-- **Shadows**: `sm`, `md`, `lg`, `xl`
-- **Z-Index**: Layered system for overlays, modals, tooltips
-- **Breakpoints**: Responsive design breakpoints
+# yarn
+yarn add @yuva-devlab/tokens
 
-## Usage
-
-### In Vanilla Extract
-
-```ts
-import { vars } from "@yuva-devlab/tokens";
-import { style } from "@vanilla-extract/css";
-
-export const card = style({
-  backgroundColor: vars.colors.surface,
-  padding: vars.spacing.lg,
-  borderRadius: vars.radii.md,
-  boxShadow: vars.shadows.sm,
-
-  // Typography
-  fontSize: vars.typography.size.md,
-  lineHeight: vars.typography.lineHeight.md,
-
-  // Responsive
-  "@media": {
-    [vars.breakpoints.md]: {
-      padding: vars.spacing.xl,
-    },
-  },
-});
+# pnpm
+pnpm add @yuva-devlab/tokens
 ```
 
-### Importing CSS
+## Usage with Tailwind CSS 4
 
-```tsx
-// Import compiled CSS in your app entry point
-import "@yuva-devlab/tokens/tokens.css";
-```
-
-### Using CSS Variables Directly
+In your application's global CSS (e.g. `globals.css`):
 
 ```css
-.my-component {
-  background-color: var(--colors-surface);
-  padding: var(--spacing-md);
-  border-radius: var(--radii-md);
-}
-```
-
-## Color System
-
-### Tonal Palettes
+@import "tailwindcss";
+@import "@yuva-devlab/tokens/preset.css";
 
-Each color has 13 shades (0-100 in increments of 10):
-
-```ts
-import { vars } from "@yuva-devlab/tokens";
-
-// Primary palette
-vars.palettes.primary[0]; // Lightest
-vars.palettes.primary[50]; // Mid-tone
-vars.palettes.primary[100]; // Darkest
-
-// Available palettes:
-// - primary (Natural green)
-// - secondary
-// - tertiary
-// - neutral
-// - neutralVariant
-// - error
-```
-
-### Semantic Colors
-
-Theme-aware tokens that automatically adapt:
-
-```ts
-vars.colors.background; // Page background
-vars.colors.surface; // Card/panel background
-vars.colors.primary; // Primary brand color
-vars.colors.onPrimary; // Text on primary
-vars.colors.secondary; // Secondary color
-vars.colors.error; // Error state
-vars.colors.outline; // Borders
-```
-
-## Spacing System
-
-```ts
-import { vars } from "@yuva-devlab/tokens";
-
-vars.spacing["2xs"]; // 4px
-vars.spacing.xs; // 8px
-vars.spacing.sm; // 12px
-vars.spacing.md; // 16px
-vars.spacing.lg; // 24px
-vars.spacing.xl; // 32px
-vars.spacing["2xl"]; // 48px
-vars.spacing["3xl"]; // 64px
-vars.spacing["4xl"]; // 80px
-vars.spacing["5xl"]; // 96px
-```
-
-## Typography
-
-```ts
-import { vars } from "@yuva-devlab/tokens";
-
-// Sizes
-vars.typography.size.xs; // 12px
-vars.typography.size.sm; // 14px
-vars.typography.size.md; // 16px
-vars.typography.size.lg; // 18px
-vars.typography.size.xl; // 20px
-vars.typography.size["2xl"]; // 24px
-vars.typography.size["3xl"]; // 30px
-vars.typography.size["4xl"]; // 36px
-vars.typography.size["5xl"]; // 48px
-
-// Weights
-vars.typography.weight.light; // 300
-vars.typography.weight.regular; // 400
-vars.typography.weight.medium; // 500
-vars.typography.weight.semibold; // 600
-vars.typography.weight.bold; // 700
-```
-
-## Development
-
-```bash
-# Build tokens
-pnpm --filter @yuva-devlab/tokens build
-
-# Watch mode
-pnpm --filter @yuva-devlab/tokens dev
-```
-
-## Architecture
-
-```
-Color Seeds (HSL)
-      ↓
-Tonal Palette Generation (MD3 algorithm)
-      ↓
-Semantic Token Mapping (Light/Dark)
-      ↓
-CSS Variables (Compiled by Vanilla Extract)
-      ↓
-Your Components
+/* Include your target app theme */
+@import "@yuva-devlab/tokens/themes/finai.css";
+/* or @import "@yuva-devlab/tokens/themes/orchestrai.css"; */
 ```
 
-## Related Packages
+## Available Themes
 
-- [@yuva-devlab/colors](../colors) - Palette generation utility
-- [@yuva-devlab/ui](../ui) - Components using these tokens
+- `@yuva-devlab/tokens/themes/finai.css`: Emerald & forest-green palette optimized for financial clarity and trust.
+- `@yuva-devlab/tokens/themes/orchestrai.css`: Modern high-contrast tech palette for orchestration dashboards.
 
 ## License
 

package/package.json

@@ -1,46 +1,29 @@
 {
   "name": "@yuva-devlab/tokens",
-  "version": "0.1.1",
+  "version": "1.0.0",
   "type": "module",
-  "main": "./dist/index.cjs",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
+  "style": "./src/styles.css",
   "sideEffects": [
-    "**/*.css.ts",
     "**/*.css"
   ],
   "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
-    },
-    "./tokens.css": "./dist/tokens.css",
+    ".": "./src/styles.css",
+    "./preset.css": "./src/preset.css",
+    "./styles.css": "./src/styles.css",
+    "./themes/finai.css": "./src/themes/theme-finai.css",
+    "./themes/orchestrai.css": "./src/themes/theme-orchestrai.css",
     "./package.json": "./package.json"
   },
+  "files": [
+    "src"
+  ],
   "license": "MIT",
   "devDependencies": {
-    "@vanilla-extract/vite-plugin": "^5.1.1",
-    "vite": "^7.2.4",
-    "vite-plugin-dts": "^4.5.4",
-    "@yuva-devlab/colors": "0.1.1",
-    "@yuva-devlab/eslint-config": "0.1.1",
-    "@yuva-devlab/prettier-config": "0.1.1",
-    "@yuva-devlab/typescript-config": "0.1.1"
-  },
-  "dependencies": {
-    "@vanilla-extract/css": "^1.17.4"
+    "@yuva-devlab/prettier-config": "0.1.1"
   },
   "scripts": {
-    "build": "vite build",
-    "lint": "eslint src",
-    "lint:fix": "eslint src --fix",
     "format": "prettier --write .",
     "format:check": "prettier --check .",
-    "type-check": "tsc --noEmit",
-    "clean:build": "rm -rf dist",
-    "clean:node_modules": "rm -rf node_modules",
-    "clean:turbo": "rm -rf .turbo",
-    "clean": "pnpm run clean:build && pnpm run clean:node_modules && pnpm run clean:turbo"
+    "clean": "rm -rf node_modules .turbo"
   }
 }

package/src/preset.css

@@ -0,0 +1,159 @@
+/**
+ * Yuva DevLab Design System — Tailwind CSS 4 Preset Bridge
+ * 
+ * Maps standard design tokens and CSS custom properties to Tailwind utility classes.
+ * Can be consumed by any downstream application (e.g. FinAI, OrchestrAI) via:
+ * `@import "@yuva-devlab/tokens/preset.css";`
+ */
+
+@theme inline {
+  /* ── Radii Mappings ──────────────────────────────────────────────────────── */
+  --radius-sm: calc(var(--radius, 0.5rem) - 4px);
+  --radius-md: calc(var(--radius, 0.5rem) - 2px);
+  --radius-lg: var(--radius, 0.5rem);
+  --radius-xl: calc(var(--radius, 0.5rem) + 4px);
+  --radius-2xl: calc(var(--radius, 0.5rem) + 8px);
+  --radius-3xl: calc(var(--radius, 0.5rem) + 12px);
+  --radius-4xl: calc(var(--radius, 0.5rem) + 16px);
+
+  /* ── Semantic Color Tokens ────────────────────────────────────────────────── */
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+
+  /* ── Contextual System Colors ────────────────────────────────────────────── */
+  --color-warning: var(--warning);
+  --color-warning-foreground: var(--warning-foreground);
+  --color-overlay: var(--overlay);
+
+  /* ── Navigation & Sidebar ────────────────────────────────────────────────── */
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+
+  /* ── Visual Data Telemetry (Charts) ──────────────────────────────────────── */
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+
+  /* ── Component Control Dimensions ────────────────────────────────────────── */
+  --height-control-xs: var(--control-height-xs, 1.75rem);
+  --height-control-sm: var(--control-height-sm, 2rem);
+  --height-control-md: var(--control-height-md, 2.25rem);
+  --height-control-lg: var(--control-height-lg, 2.5rem);
+  --height-control-xl: var(--control-height-xl, 3rem);
+
+  /* ── Icon Sizing Tokens ──────────────────────────────────────────────────── */
+  --size-icon-xs: var(--icon-xs, 0.875rem);
+  --size-icon-sm: var(--icon-sm, 1rem);
+  --size-icon-md: var(--icon-md, 1.25rem);
+  --size-icon-lg: var(--icon-lg, 1.5rem);
+  --size-icon-xl: var(--icon-xl, 2rem);
+}
+
+/* ── Cybernetic Grid & Graph Topologies ────────────────────────────────────── */
+@utility execution-grid {
+  background-image:
+    linear-gradient(var(--border) 1px, transparent 1px),
+    linear-gradient(90deg, var(--border) 1px, transparent 1px);
+  background-size: 36px 36px;
+  mask-image: linear-gradient(to bottom, black, transparent 72%);
+}
+
+@utility topology-grid {
+  background-image: radial-gradient(
+    circle at center,
+    var(--border) 1px,
+    transparent 1px
+  );
+  background-size: 18px 18px;
+  mask-image: linear-gradient(
+    90deg,
+    transparent,
+    black 15%,
+    black 85%,
+    transparent
+  );
+}
+
+/* ── Live Agent Telemetry Animations ───────────────────────────────────────── */
+@utility animate-agent-pulse {
+  animation: agent-pulse 1.8s ease-in-out infinite;
+}
+
+@utility animate-signal-travel {
+  animation: signal-travel 1.5s linear infinite;
+}
+
+@utility animate-progress-flow {
+  animation: progress-flow 1.8s ease-in-out infinite;
+}
+
+@utility runner-enter {
+  animation: runner-enter 260ms ease-out both;
+}
+
+@keyframes agent-pulse {
+  0%,
+  100% {
+    opacity: 0.55;
+    transform: scale(0.9);
+  }
+  50% {
+    opacity: 1;
+    transform: scale(1.15);
+  }
+}
+
+@keyframes signal-travel {
+  from {
+    left: 0;
+  }
+  to {
+    left: calc(100% - 0.5rem);
+  }
+}
+
+@keyframes progress-flow {
+  0%,
+  100% {
+    opacity: 0.55;
+  }
+  50% {
+    opacity: 1;
+  }
+}
+
+@keyframes runner-enter {
+  from {
+    opacity: 0;
+    transform: translateY(6px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}

package/src/styles.css

@@ -0,0 +1,2 @@
+@import "tailwindcss";
+@import "./preset.css";

package/src/themes/theme-finai.css

@@ -0,0 +1,110 @@
+/**
+ * FinAI Theme Preset — Emerald / Forest Green Palette
+ * Modern OKLCH color spaces optimized for trust, clarity, and financial wellness.
+ */
+
+:root,
+[data-theme="finai"] {
+  --radius: 0.75rem;
+  --background: oklch(0.985 0.001 247);
+  --foreground: oklch(0.21 0.02 260);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.21 0.02 260);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.21 0.02 260);
+  --primary: oklch(0.63 0.14 156);
+  --primary-foreground: oklch(0.99 0.005 150);
+  --secondary: oklch(0.965 0.003 260);
+  --secondary-foreground: oklch(0.21 0.02 260);
+  --muted: oklch(0.965 0.003 260);
+  --muted-foreground: oklch(0.52 0.015 260);
+  --accent: oklch(0.95 0.03 156);
+  --accent-foreground: oklch(0.35 0.09 156);
+  --destructive: oklch(0.6 0.22 25);
+  --destructive-foreground: oklch(0.99 0.005 0);
+  --warning: oklch(0.75 0.14 80);
+  --warning-foreground: oklch(0.2 0.02 80);
+  --border: oklch(0.92 0.005 260);
+  --input: oklch(0.92 0.005 260);
+  --ring: oklch(0.63 0.14 156);
+  --sidebar: oklch(1 0 0);
+  --sidebar-foreground: oklch(0.21 0.02 260);
+  --sidebar-primary: oklch(0.63 0.14 156);
+  --sidebar-primary-foreground: oklch(0.99 0.005 150);
+  --sidebar-accent: oklch(0.95 0.03 156);
+  --sidebar-accent-foreground: oklch(0.35 0.09 156);
+  --sidebar-border: oklch(0.93 0.005 260);
+  --sidebar-ring: oklch(0.63 0.14 156);
+  --chart-1: oklch(0.63 0.14 156);
+  --chart-2: oklch(0.55 0.02 260);
+  --chart-3: oklch(0.75 0.04 156);
+  --chart-4: oklch(0.7 0.15 60);
+  --chart-5: oklch(0.6 0.18 25);
+
+  /* ── Sizing, Spacing & Layout Tokens ───────────────────────────────────── */
+  --control-height-xs: 1.75rem;
+  --control-height-sm: 2rem;
+  --control-height-md: 2.375rem;
+  --control-height-lg: 2.75rem;
+  --control-height-xl: 3.25rem;
+
+  --icon-xs: 0.75rem;
+  --icon-sm: 0.875rem;
+  --icon-md: 1rem;
+  --icon-lg: 1.25rem;
+  --icon-xl: 1.5rem;
+
+  --space-1: 0.25rem;
+  --space-2: 0.5rem;
+  --space-3: 0.75rem;
+  --space-4: 1rem;
+  --space-5: 1.25rem;
+  --space-6: 1.5rem;
+  --space-8: 2rem;
+  --space-10: 2.5rem;
+
+  --card-padding: var(--space-5);
+  --dialog-padding: var(--space-6);
+  --form-field-gap: var(--space-4);
+  --section-gap: var(--space-6);
+  --table-row-padding-x: var(--space-6);
+  --table-row-padding-y: var(--space-4);
+}
+
+.dark,
+[data-theme="finai-dark"] {
+  --background: oklch(0.16 0.015 260);
+  --foreground: oklch(0.97 0.003 260);
+  --card: oklch(0.2 0.015 260);
+  --card-foreground: oklch(0.97 0.003 260);
+  --popover: oklch(0.2 0.015 260);
+  --popover-foreground: oklch(0.97 0.003 260);
+  --primary: oklch(0.7 0.15 156);
+  --primary-foreground: oklch(0.15 0.02 260);
+  --secondary: oklch(0.25 0.015 260);
+  --secondary-foreground: oklch(0.97 0.003 260);
+  --muted: oklch(0.25 0.015 260);
+  --muted-foreground: oklch(0.7 0.01 260);
+  --accent: oklch(0.3 0.05 156);
+  --accent-foreground: oklch(0.9 0.08 156);
+  --destructive: oklch(0.65 0.2 25);
+  --destructive-foreground: oklch(0.97 0.003 0);
+  --warning: oklch(0.75 0.14 80);
+  --warning-foreground: oklch(0.15 0.02 80);
+  --border: oklch(1 0 0 / 8%);
+  --input: oklch(1 0 0 / 12%);
+  --ring: oklch(0.7 0.15 156);
+  --sidebar: oklch(0.18 0.015 260);
+  --sidebar-foreground: oklch(0.97 0.003 260);
+  --sidebar-primary: oklch(0.7 0.15 156);
+  --sidebar-primary-foreground: oklch(0.15 0.02 260);
+  --sidebar-accent: oklch(0.26 0.03 156);
+  --sidebar-accent-foreground: oklch(0.97 0.003 260);
+  --sidebar-border: oklch(1 0 0 / 8%);
+  --sidebar-ring: oklch(0.7 0.15 156);
+  --chart-1: oklch(0.7 0.15 156);
+  --chart-2: oklch(0.6 0.02 260);
+  --chart-3: oklch(0.8 0.04 156);
+  --chart-4: oklch(0.75 0.15 60);
+  --chart-5: oklch(0.65 0.2 25);
+}

package/src/themes/theme-orchestrai.css

@@ -0,0 +1,45 @@
+/**
+ * OrchestrAI Theme Preset — Terminal Moss & Deep Slate Cybernetic Palette
+ * Modern OKLCH color spaces optimized for high-density agent telemetry and execution logs.
+ */
+
+:root,
+.dark,
+[data-theme="orchestrai"] {
+  --radius: 0.5rem;
+  --background: oklch(0.195 0.005 120);
+  --foreground: oklch(0.93 0.012 112);
+  --card: oklch(0.235 0.008 120);
+  --card-foreground: oklch(0.93 0.012 112);
+  --popover: oklch(0.235 0.008 120);
+  --popover-foreground: oklch(0.93 0.012 112);
+  --primary: oklch(0.77 0.12 120);
+  --primary-foreground: oklch(0.195 0.005 120);
+  --secondary: oklch(0.285 0.008 120);
+  --secondary-foreground: oklch(0.91 0.01 112);
+  --muted: oklch(0.31 0.008 120);
+  --muted-foreground: oklch(0.67 0.015 112);
+  --accent: oklch(0.34 0.025 120);
+  --accent-foreground: oklch(0.9 0.015 112);
+  --destructive: oklch(0.61 0.2 27);
+  --destructive-foreground: oklch(0.96 0.01 90);
+  --warning: oklch(0.72 0.13 78);
+  --warning-foreground: oklch(0.2 0.015 78);
+  --border: oklch(0.36 0.009 120);
+  --input: oklch(0.36 0.009 120);
+  --ring: oklch(0.77 0.12 120);
+  --sidebar: oklch(0.215 0.006 120);
+  --sidebar-foreground: oklch(0.89 0.012 112);
+  --sidebar-primary: oklch(0.77 0.12 120);
+  --sidebar-primary-foreground: oklch(0.195 0.005 120);
+  --sidebar-accent: oklch(0.28 0.02 120);
+  --sidebar-accent-foreground: oklch(0.93 0.012 112);
+  --sidebar-border: oklch(0.32 0.008 120);
+  --sidebar-ring: oklch(0.77 0.12 120);
+  --overlay: oklch(0.11 0.004 120);
+  --chart-1: oklch(0.77 0.12 120);
+  --chart-2: oklch(0.65 0.1 190);
+  --chart-3: oklch(0.7 0.13 78);
+  --chart-4: oklch(0.62 0.16 310);
+  --chart-5: oklch(0.72 0.12 40);
+}

package/.prettierignore

@@ -1,12 +0,0 @@
-# Dependencies
-node_modules
-
-# Build outputs
-dist
-build
-.turbo
-storybook-static
-
-# Generated files
-*.d.ts
-coverage

package/.turbo/turbo-build.log

@@ -1,18 +0,0 @@
-
-> @yuva-devlab/tokens@0.1.1 build /home/runner/work/yuva-devlab-workspace/yuva-devlab-workspace/packages/tokens
-> vite build
-
-vite v7.2.4 building client environment for production...
-transforming...
-✓ 21 modules transformed.
-rendering chunks...
-
-[vite:dts] Start generate declaration files...
-computing gzip size...
-dist/tokens.css  9.42 kB │ gzip: 2.19 kB
-dist/index.js    7.43 kB │ gzip: 1.55 kB
-[vite:dts] Declaration files built in 1028ms.
-
-dist/tokens.css  9.42 kB │ gzip: 2.19 kB
-dist/index.cjs   6.95 kB │ gzip: 1.59 kB
-✓ built in 1.38s

package/CHANGELOG.md

@@ -1,21 +0,0 @@
-# @yuva-devlab/tokens
-
-## 0.1.1
-
-### Patch Changes
-
-- 2cc8dcf: Complete documentation rewrite with comprehensive examples and API
-  reference
-
-## 0.1.0
-
-### Minor Changes
-
-- 16c5cc8: Initial Alpha release of the complete Yuva Devlab UI Library
-  ecosystem. Includes:
-  - Headless Radix Primitives
-  - Vanilla Extract Styling System
-  - Comprehensive Design Tokens
-  - Modern React Components
-  - Scalable Monorepo Configuration
-  - CLI tool for component scaffolding

package/dist/breakpoints.css.d.ts

@@ -1,13 +0,0 @@
-/**
- * Responsive breakpoint tokens.
- * Mobile-first approach aligned with common device sizes.
- */
-export declare const breakpoints: {
-    xs: `var(--${string})`;
-    sm: `var(--${string})`;
-    md: `var(--${string})`;
-    lg: `var(--${string})`;
-    xl: `var(--${string})`;
-    "2xl": `var(--${string})`;
-};
-//# sourceMappingURL=breakpoints.css.d.ts.map

package/dist/breakpoints.css.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"breakpoints.css.d.ts","sourceRoot":"","sources":["../src/breakpoints.css.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,eAAO,MAAM,WAAW;;;;;;;CAOtB,CAAC"}