@mehdashti/tokens 0.1.0

package/README.md

@@ -0,0 +1,218 @@
+# @smart/tokens
+
+> Design system tokens for Smart Platform - Colors, spacing, typography, and more
+
+Enterprise-grade design tokens built with the Industrial Petrol Palette. Provides consistent styling across all Smart Platform applications.
+
+## Features
+
+- ✅ **Industrial Petrol Palette** - Professional color scheme aligned with APISmith
+- ✅ **HSL Color Format** - Easy to manipulate and customize
+- ✅ **Dark/Light Themes** - Automatic theme switching support
+- ✅ **Semantic Colors** - Success, warning, error, info with backgrounds and borders
+- ✅ **Spacing Scale** - 4px base scale from 0 to 384px
+- ✅ **Typography System** - Font sizes, weights, and line heights
+- ✅ **Border Radius** - Consistent corner rounding
+- ✅ **Shadows** - Elevation system
+- ✅ **Z-Index** - Layering scale
+
+---
+
+## Installation
+
+```bash
+# Using pnpm (recommended)
+pnpm add @smart/tokens
+
+# Using npm
+npm install @smart/tokens
+
+# Using yarn
+yarn add @smart/tokens
+```
+
+---
+
+## Usage
+
+### Import CSS Theme
+
+```typescript
+// In your main entry file (e.g., main.tsx or App.tsx)
+import '@smart/tokens/theme.css'
+```
+
+This imports the complete theme with:
+- Base design tokens (spacing, typography, etc.)
+- Light theme (default)
+- Dark theme (`[data-theme="dark"]`)
+
+### Theme Switching
+
+```typescript
+// Set theme via data attribute
+document.documentElement.setAttribute('data-theme', 'dark')  // Dark mode
+document.documentElement.setAttribute('data-theme', 'light') // Light mode
+
+// Or use a theme store (recommended)
+import { create } from 'zustand'
+
+interface ThemeStore {
+  theme: 'light' | 'dark' | 'system'
+  setTheme: (theme: 'light' | 'dark' | 'system') => void
+}
+
+export const useThemeStore = create<ThemeStore>((set) => ({
+  theme: 'system',
+  setTheme: (theme) => {
+    const effectiveTheme = theme === 'system'
+      ? window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
+      : theme
+
+    document.documentElement.setAttribute('data-theme', effectiveTheme)
+    set({ theme })
+  }
+}))
+```
+
+### Using Tokens in CSS
+
+All tokens are available as CSS custom properties:
+
+```css
+.my-component {
+  /* Colors (use with hsl()) */
+  background-color: hsl(var(--background));
+  color: hsl(var(--foreground));
+  border: 1px solid hsl(var(--border));
+
+  /* Primary color */
+  background-color: hsl(var(--primary));
+  color: hsl(var(--primary-foreground));
+
+  /* Spacing */
+  padding: var(--spacing-4);      /* 16px */
+  margin: var(--spacing-2);       /* 8px */
+  gap: var(--spacing-0-5);        /* 2px */
+
+  /* Typography */
+  font-size: var(--font-size-base);   /* 1rem */
+
+  /* Border radius */
+  border-radius: var(--radius-md);    /* 3px */
+
+  /* Shadows */
+  box-shadow: var(--shadow-md);
+
+  /* Z-index */
+  z-index: var(--z-modal);
+}
+```
+
+---
+
+## Color Palette
+
+### Light Theme
+
+| Token | HSL | Hex | Usage |
+|-------|-----|-----|-------|
+| `--background` | `220 14% 96%` | `#F3F4F6` | Page background |
+| `--foreground` | `221 39% 11%` | `#1F2937` | Text color |
+| `--primary` | `195 100% 28%` | `#006D8F` | Primary actions, links |
+| `--primary-foreground` | `0 0% 100%` | `#FFFFFF` | Text on primary |
+| `--border` | `220 13% 91%` | `#E5E7EB` | Borders |
+
+### Dark Theme
+
+| Token | HSL | Hex | Usage |
+|-------|-----|-----|-------|
+| `--background` | `221 39% 11%` | `#111827` | Page background |
+| `--foreground` | `220 14% 96%` | `#F3F4F6` | Text color |
+| `--primary` | `195 45% 38%` | `#35778C` | Primary actions (matte) |
+| `--border` | `217 19% 27%` | `#374151` | Borders |
+
+### Semantic Colors
+
+#### Success (Green)
+- **Light:** `--success: 142 64% 24%` (#166534)
+- **Dark:** `--success: 156 72% 67%` (#6EE7B7)
+- **Background:** `--success-bg`
+- **Border:** `--success-border`
+
+#### Warning (Orange)
+- **Light:** `--warning: 26 83% 31%` (#92400E)
+- **Dark:** `--warning: 43 96% 65%` (#FCD34D)
+
+#### Error (Red)
+- **Light:** `--error: 0 74% 35%` (#991B1B)
+- **Dark:** `--error: 0 94% 82%` (#FCA5A5)
+
+#### Info (Blue)
+- **Light:** `--info: 224 76% 40%` (#1E40AF)
+- **Dark:** `--info: 213 93% 78%` (#93C5FD)
+
+---
+
+## Spacing Scale
+
+| Token | Value | Pixels |
+|-------|-------|--------|
+| `--spacing-0-5` | `0.125rem` | 2px |
+| `--spacing-1` | `0.25rem` | 4px |
+| `--spacing-2` | `0.5rem` | 8px |
+| `--spacing-4` | `1rem` | 16px |
+| `--spacing-8` | `2rem` | 32px |
+
+[See full table in docs]
+
+---
+
+## Examples
+
+### Button with Primary Color
+
+```tsx
+function PrimaryButton() {
+  return (
+    <button
+      style={{
+        backgroundColor: 'hsl(var(--primary))',
+        color: 'hsl(var(--primary-foreground))',
+        padding: 'var(--spacing-2) var(--spacing-4)',
+        borderRadius: 'var(--radius-md)',
+      }}
+    >
+      Click me
+    </button>
+  )
+}
+```
+
+### Alert with Semantic Colors
+
+```tsx
+<div
+  style={{
+    backgroundColor: 'hsl(var(--success-bg))',
+    color: 'hsl(var(--success))',
+    border: '1px solid hsl(var(--success-border))',
+    padding: 'var(--spacing-3)',
+    borderRadius: 'var(--radius-md)',
+  }}
+>
+  Success message
+</div>
+```
+
+---
+
+## Related Packages
+
+- [@smart/ui](../ui) - UI components
+- [@smart/auth-react](../auth-react) - Authentication
+- [@smart/data-client](../data-client) - API client
+
+---
+
+**Version:** 0.0.1

package/dist/borders.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Border Tokens
+ *
+ * Border radius and widths
+ */
+export declare const borderRadius: {
+    readonly none: "0";
+    readonly sm: "0.125rem";
+    readonly base: "0.25rem";
+    readonly md: "0.375rem";
+    readonly lg: "0.5rem";
+    readonly xl: "0.75rem";
+    readonly "2xl": "1rem";
+    readonly "3xl": "1.5rem";
+    readonly full: "9999px";
+};
+export declare const borderWidth: {
+    readonly 0: "0px";
+    readonly 1: "1px";
+    readonly 2: "2px";
+    readonly 4: "4px";
+    readonly 8: "8px";
+};
+//# sourceMappingURL=borders.d.ts.map

package/dist/borders.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"borders.d.ts","sourceRoot":"","sources":["../src/borders.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAMH,eAAO,MAAM,YAAY;;;;;;;;;;CAUf,CAAC;AAMX,eAAO,MAAM,WAAW;;;;;;CAMd,CAAC"}

package/dist/borders.js

@@ -0,0 +1,30 @@
+/**
+ * Border Tokens
+ *
+ * Border radius and widths
+ */
+// =============================================================================
+// Border Radius
+// =============================================================================
+export const borderRadius = {
+    none: "0",
+    sm: "0.125rem", // 2px
+    base: "0.25rem", // 4px
+    md: "0.375rem", // 6px
+    lg: "0.5rem", // 8px
+    xl: "0.75rem", // 12px
+    "2xl": "1rem", // 16px
+    "3xl": "1.5rem", // 24px
+    full: "9999px",
+};
+// =============================================================================
+// Border Width
+// =============================================================================
+export const borderWidth = {
+    0: "0px",
+    1: "1px",
+    2: "2px",
+    4: "4px",
+    8: "8px",
+};
+//# sourceMappingURL=borders.js.map

package/dist/borders.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"borders.js","sourceRoot":"","sources":["../src/borders.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,gFAAgF;AAChF,gBAAgB;AAChB,gFAAgF;AAEhF,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,IAAI,EAAE,GAAG;IACT,EAAE,EAAE,UAAU,EAAE,MAAM;IACtB,IAAI,EAAE,SAAS,EAAE,MAAM;IACvB,EAAE,EAAE,UAAU,EAAE,MAAM;IACtB,EAAE,EAAE,QAAQ,EAAE,MAAM;IACpB,EAAE,EAAE,SAAS,EAAE,OAAO;IACtB,KAAK,EAAE,MAAM,EAAE,OAAO;IACtB,KAAK,EAAE,QAAQ,EAAE,OAAO;IACxB,IAAI,EAAE,QAAQ;CACN,CAAC;AAEX,gFAAgF;AAChF,eAAe;AACf,gFAAgF;AAEhF,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,CAAC,EAAE,KAAK;IACR,CAAC,EAAE,KAAK;IACR,CAAC,EAAE,KAAK;IACR,CAAC,EAAE,KAAK;IACR,CAAC,EAAE,KAAK;CACA,CAAC"}

package/dist/breakpoints.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Breakpoint Tokens
+ *
+ * Responsive design breakpoints
+ */
+export declare const breakpoints: {
+    readonly sm: "640px";
+    readonly md: "768px";
+    readonly lg: "1024px";
+    readonly xl: "1280px";
+    readonly "2xl": "1536px";
+};
+export type BreakpointKey = keyof typeof breakpoints;
+//# sourceMappingURL=breakpoints.d.ts.map

package/dist/breakpoints.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../src/breakpoints.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,eAAO,MAAM,WAAW;;;;;;CAMd,CAAC;AAEX,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,WAAW,CAAC"}

package/dist/breakpoints.js

@@ -0,0 +1,13 @@
+/**
+ * Breakpoint Tokens
+ *
+ * Responsive design breakpoints
+ */
+export const breakpoints = {
+    sm: "640px",
+    md: "768px",
+    lg: "1024px",
+    xl: "1280px",
+    "2xl": "1536px",
+};
+//# sourceMappingURL=breakpoints.js.map

package/dist/breakpoints.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoints.js","sourceRoot":"","sources":["../src/breakpoints.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,EAAE,EAAE,OAAO;IACX,EAAE,EAAE,OAAO;IACX,EAAE,EAAE,QAAQ;IACZ,EAAE,EAAE,QAAQ;IACZ,KAAK,EAAE,QAAQ;CACP,CAAC"}

package/dist/colors.d.ts

@@ -0,0 +1,133 @@
+/**
+ * Color Tokens
+ *
+ * Semantic color system with light and dark theme support
+ */
+export declare const brandColors: {
+    readonly primary: {
+        readonly 50: "#eff6ff";
+        readonly 100: "#dbeafe";
+        readonly 200: "#bfdbfe";
+        readonly 300: "#93c5fd";
+        readonly 400: "#60a5fa";
+        readonly 500: "#3b82f6";
+        readonly 600: "#2563eb";
+        readonly 700: "#1d4ed8";
+        readonly 800: "#1e40af";
+        readonly 900: "#1e3a8a";
+        readonly 950: "#172554";
+    };
+    readonly secondary: {
+        readonly 50: "#f8fafc";
+        readonly 100: "#f1f5f9";
+        readonly 200: "#e2e8f0";
+        readonly 300: "#cbd5e1";
+        readonly 400: "#94a3b8";
+        readonly 500: "#64748b";
+        readonly 600: "#475569";
+        readonly 700: "#334155";
+        readonly 800: "#1e293b";
+        readonly 900: "#0f172a";
+        readonly 950: "#020617";
+    };
+};
+export declare const semanticColors: {
+    readonly success: {
+        readonly 50: "#f0fdf4";
+        readonly 100: "#dcfce7";
+        readonly 200: "#bbf7d0";
+        readonly 300: "#86efac";
+        readonly 400: "#4ade80";
+        readonly 500: "#22c55e";
+        readonly 600: "#16a34a";
+        readonly 700: "#15803d";
+        readonly 800: "#166534";
+        readonly 900: "#14532d";
+    };
+    readonly warning: {
+        readonly 50: "#fffbeb";
+        readonly 100: "#fef3c7";
+        readonly 200: "#fde68a";
+        readonly 300: "#fcd34d";
+        readonly 400: "#fbbf24";
+        readonly 500: "#f59e0b";
+        readonly 600: "#d97706";
+        readonly 700: "#b45309";
+        readonly 800: "#92400e";
+        readonly 900: "#78350f";
+    };
+    readonly error: {
+        readonly 50: "#fef2f2";
+        readonly 100: "#fee2e2";
+        readonly 200: "#fecaca";
+        readonly 300: "#fca5a5";
+        readonly 400: "#f87171";
+        readonly 500: "#ef4444";
+        readonly 600: "#dc2626";
+        readonly 700: "#b91c1c";
+        readonly 800: "#991b1b";
+        readonly 900: "#7f1d1d";
+    };
+    readonly info: {
+        readonly 50: "#eff6ff";
+        readonly 100: "#dbeafe";
+        readonly 200: "#bfdbfe";
+        readonly 300: "#93c5fd";
+        readonly 400: "#60a5fa";
+        readonly 500: "#3b82f6";
+        readonly 600: "#2563eb";
+        readonly 700: "#1d4ed8";
+        readonly 800: "#1e40af";
+        readonly 900: "#1e3a8a";
+    };
+};
+export declare const neutralColors: {
+    readonly 50: "#fafafa";
+    readonly 100: "#f5f5f5";
+    readonly 200: "#e5e5e5";
+    readonly 300: "#d4d4d4";
+    readonly 400: "#a3a3a3";
+    readonly 500: "#737373";
+    readonly 600: "#525252";
+    readonly 700: "#404040";
+    readonly 800: "#262626";
+    readonly 900: "#171717";
+    readonly 950: "#0a0a0a";
+};
+export interface ThemeColors {
+    background: string;
+    backgroundSecondary: string;
+    backgroundTertiary: string;
+    foreground: string;
+    foregroundSecondary: string;
+    foregroundTertiary: string;
+    border: string;
+    borderSecondary: string;
+    primary: string;
+    primaryHover: string;
+    primaryActive: string;
+    primaryForeground: string;
+    secondary: string;
+    secondaryHover: string;
+    secondaryActive: string;
+    secondaryForeground: string;
+    accent: string;
+    accentHover: string;
+    accentForeground: string;
+    destructive: string;
+    destructiveHover: string;
+    destructiveForeground: string;
+    muted: string;
+    mutedForeground: string;
+    success: string;
+    successForeground: string;
+    warning: string;
+    warningForeground: string;
+    error: string;
+    errorForeground: string;
+    info: string;
+    infoForeground: string;
+}
+export declare const lightTheme: ThemeColors;
+export declare const darkTheme: ThemeColors;
+//# sourceMappingURL=colors.d.ts.map

package/dist/colors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../src/colors.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAMH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bd,CAAC;AAMX,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiDjB,CAAC;AAMX,eAAO,MAAM,aAAa;;;;;;;;;;;;CAYhB,CAAC;AAMX,MAAM,WAAW,WAAW;IAE1B,UAAU,EAAE,MAAM,CAAC;IACnB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,kBAAkB,EAAE,MAAM,CAAC;IAG3B,UAAU,EAAE,MAAM,CAAC;IACnB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,kBAAkB,EAAE,MAAM,CAAC;IAG3B,MAAM,EAAE,MAAM,CAAC;IACf,eAAe,EAAE,MAAM,CAAC;IAGxB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAG1B,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,EAAE,MAAM,CAAC;IAG5B,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,gBAAgB,EAAE,MAAM,CAAC;IAGzB,WAAW,EAAE,MAAM,CAAC;IACpB,gBAAgB,EAAE,MAAM,CAAC;IACzB,qBAAqB,EAAE,MAAM,CAAC;IAG9B,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IAGxB,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,UAAU,EAAE,WAyCxB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,WAyCvB,CAAC"}

package/dist/colors.js

@@ -0,0 +1,174 @@
+/**
+ * Color Tokens
+ *
+ * Semantic color system with light and dark theme support
+ */
+// =============================================================================
+// Brand Colors
+// =============================================================================
+export const brandColors = {
+    primary: {
+        50: "#eff6ff",
+        100: "#dbeafe",
+        200: "#bfdbfe",
+        300: "#93c5fd",
+        400: "#60a5fa",
+        500: "#3b82f6",
+        600: "#2563eb",
+        700: "#1d4ed8",
+        800: "#1e40af",
+        900: "#1e3a8a",
+        950: "#172554",
+    },
+    secondary: {
+        50: "#f8fafc",
+        100: "#f1f5f9",
+        200: "#e2e8f0",
+        300: "#cbd5e1",
+        400: "#94a3b8",
+        500: "#64748b",
+        600: "#475569",
+        700: "#334155",
+        800: "#1e293b",
+        900: "#0f172a",
+        950: "#020617",
+    },
+};
+// =============================================================================
+// Semantic Colors
+// =============================================================================
+export const semanticColors = {
+    success: {
+        50: "#f0fdf4",
+        100: "#dcfce7",
+        200: "#bbf7d0",
+        300: "#86efac",
+        400: "#4ade80",
+        500: "#22c55e",
+        600: "#16a34a",
+        700: "#15803d",
+        800: "#166534",
+        900: "#14532d",
+    },
+    warning: {
+        50: "#fffbeb",
+        100: "#fef3c7",
+        200: "#fde68a",
+        300: "#fcd34d",
+        400: "#fbbf24",
+        500: "#f59e0b",
+        600: "#d97706",
+        700: "#b45309",
+        800: "#92400e",
+        900: "#78350f",
+    },
+    error: {
+        50: "#fef2f2",
+        100: "#fee2e2",
+        200: "#fecaca",
+        300: "#fca5a5",
+        400: "#f87171",
+        500: "#ef4444",
+        600: "#dc2626",
+        700: "#b91c1c",
+        800: "#991b1b",
+        900: "#7f1d1d",
+    },
+    info: {
+        50: "#eff6ff",
+        100: "#dbeafe",
+        200: "#bfdbfe",
+        300: "#93c5fd",
+        400: "#60a5fa",
+        500: "#3b82f6",
+        600: "#2563eb",
+        700: "#1d4ed8",
+        800: "#1e40af",
+        900: "#1e3a8a",
+    },
+};
+// =============================================================================
+// Neutral Colors
+// =============================================================================
+export const neutralColors = {
+    50: "#fafafa",
+    100: "#f5f5f5",
+    200: "#e5e5e5",
+    300: "#d4d4d4",
+    400: "#a3a3a3",
+    500: "#737373",
+    600: "#525252",
+    700: "#404040",
+    800: "#262626",
+    900: "#171717",
+    950: "#0a0a0a",
+};
+export const lightTheme = {
+    background: "#ffffff",
+    backgroundSecondary: neutralColors[50],
+    backgroundTertiary: neutralColors[100],
+    foreground: neutralColors[900],
+    foregroundSecondary: neutralColors[600],
+    foregroundTertiary: neutralColors[500],
+    border: neutralColors[200],
+    borderSecondary: neutralColors[300],
+    primary: brandColors.primary[600],
+    primaryHover: brandColors.primary[700],
+    primaryActive: brandColors.primary[800],
+    primaryForeground: "#ffffff",
+    secondary: brandColors.secondary[100],
+    secondaryHover: brandColors.secondary[200],
+    secondaryActive: brandColors.secondary[300],
+    secondaryForeground: brandColors.secondary[900],
+    accent: brandColors.primary[500],
+    accentHover: brandColors.primary[600],
+    accentForeground: "#ffffff",
+    destructive: semanticColors.error[600],
+    destructiveHover: semanticColors.error[700],
+    destructiveForeground: "#ffffff",
+    muted: neutralColors[100],
+    mutedForeground: neutralColors[500],
+    success: semanticColors.success[600],
+    successForeground: "#ffffff",
+    warning: semanticColors.warning[500],
+    warningForeground: neutralColors[900],
+    error: semanticColors.error[600],
+    errorForeground: "#ffffff",
+    info: semanticColors.info[600],
+    infoForeground: "#ffffff",
+};
+export const darkTheme = {
+    background: neutralColors[950],
+    backgroundSecondary: neutralColors[900],
+    backgroundTertiary: neutralColors[800],
+    foreground: neutralColors[50],
+    foregroundSecondary: neutralColors[400],
+    foregroundTertiary: neutralColors[500],
+    border: neutralColors[800],
+    borderSecondary: neutralColors[700],
+    primary: brandColors.primary[500],
+    primaryHover: brandColors.primary[400],
+    primaryActive: brandColors.primary[300],
+    primaryForeground: "#ffffff",
+    secondary: brandColors.secondary[800],
+    secondaryHover: brandColors.secondary[700],
+    secondaryActive: brandColors.secondary[600],
+    secondaryForeground: brandColors.secondary[50],
+    accent: brandColors.primary[400],
+    accentHover: brandColors.primary[300],
+    accentForeground: neutralColors[950],
+    destructive: semanticColors.error[500],
+    destructiveHover: semanticColors.error[400],
+    destructiveForeground: "#ffffff",
+    muted: neutralColors[800],
+    mutedForeground: neutralColors[400],
+    success: semanticColors.success[500],
+    successForeground: "#ffffff",
+    warning: semanticColors.warning[500],
+    warningForeground: neutralColors[900],
+    error: semanticColors.error[500],
+    errorForeground: "#ffffff",
+    info: semanticColors.info[500],
+    infoForeground: "#ffffff",
+};
+//# sourceMappingURL=colors.js.map

package/dist/colors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"colors.js","sourceRoot":"","sources":["../src/colors.ts"],"names":[],"mappings":"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"}

package/dist/css/rtl.css

@@ -0,0 +1,12 @@
+/**
+ * RTL (Right-to-Left) Support
+ * Generated from @mehdashti/tokens
+ */
+
+[dir="rtl"] {
+  direction: rtl;
+}
+
+[dir="rtl"] * {
+  text-align: start;
+}