@lumaui/tokens 0.1.0 → 0.1.1

package/src/core/colors.json

@@ -1,164 +0,0 @@
-{
-  "luma": {
-    "color": {
-      "primary": {
-        "50": {
-          "value": "oklch(0.63 0.14 232.13)",
-          "type": "color",
-          "description": "Primary default - main brand color for buttons, links, actions"
-        },
-        "60": {
-          "value": "oklch(0.56 0.13 232.13)",
-          "type": "color",
-          "description": "Primary strong - emphasized elements"
-        },
-        "70": {
-          "value": "oklch(0.49 0.12 232.13)",
-          "type": "color",
-          "description": "Primary hover - hover state for primary elements"
-        },
-        "80": {
-          "value": "oklch(0.43 0.11 232.13)",
-          "type": "color",
-          "description": "Primary active - pressed/active state"
-        }
-      },
-      "neutral": {
-        "50": {
-          "value": "oklch(0.99 0 0)",
-          "type": "color",
-          "description": "Neutral lightest - nested card backgrounds, subtle surfaces"
-        },
-        "60": {
-          "value": "oklch(0.92 0.008 265)",
-          "type": "color",
-          "description": "Neutral light - borders, dividers"
-        },
-        "70": {
-          "value": "oklch(0.85 0.01 265)",
-          "type": "color",
-          "description": "Neutral medium - disabled text, placeholders"
-        },
-        "80": {
-          "value": "oklch(0.45 0.01 265)",
-          "type": "color",
-          "description": "Neutral dark - secondary text (WCAG AA compliant)"
-        },
-        "90": {
-          "value": "oklch(0.45 0.01 265)",
-          "type": "color",
-          "description": "Neutral darker - emphasized secondary text"
-        },
-        "100": {
-          "value": "oklch(0.22 0.01 265)",
-          "type": "color",
-          "description": "Neutral darkest - primary text, shadows"
-        }
-      },
-      "success": {
-        "50": {
-          "value": "oklch(0.72 0.08 150)",
-          "type": "color",
-          "description": "Success default - positive feedback, confirmations"
-        },
-        "60": {
-          "value": "oklch(0.65 0.07 150)",
-          "type": "color",
-          "description": "Success strong"
-        },
-        "70": {
-          "value": "oklch(0.58 0.06 150)",
-          "type": "color",
-          "description": "Success hover"
-        },
-        "80": {
-          "value": "oklch(0.52 0.05 150)",
-          "type": "color",
-          "description": "Success active"
-        }
-      },
-      "warning": {
-        "50": {
-          "value": "oklch(0.78 0.10 85)",
-          "type": "color",
-          "description": "Warning default - caution states, alerts"
-        },
-        "60": {
-          "value": "oklch(0.72 0.09 85)",
-          "type": "color",
-          "description": "Warning strong"
-        },
-        "70": {
-          "value": "oklch(0.65 0.08 85)",
-          "type": "color",
-          "description": "Warning hover"
-        },
-        "80": {
-          "value": "oklch(0.58 0.07 85)",
-          "type": "color",
-          "description": "Warning active"
-        }
-      },
-      "error": {
-        "50": {
-          "value": "oklch(0.62 0.11 25)",
-          "type": "color",
-          "description": "Error default - destructive actions, errors"
-        },
-        "60": {
-          "value": "oklch(0.56 0.10 25)",
-          "type": "color",
-          "description": "Error strong"
-        },
-        "70": {
-          "value": "oklch(0.50 0.09 25)",
-          "type": "color",
-          "description": "Error hover"
-        },
-        "80": {
-          "value": "oklch(0.44 0.08 25)",
-          "type": "color",
-          "description": "Error active"
-        }
-      },
-      "surface": {
-        "base": {
-          "value": "oklch(1 0 0)",
-          "type": "color",
-          "description": "Base surface background color (pure white avoided per Neo-Minimal)"
-        }
-      },
-      "text": {
-        "primary": {
-          "value": "{luma.color.neutral.100}",
-          "type": "color",
-          "description": "Primary text color - main body text"
-        },
-        "secondary": {
-          "value": "{luma.color.neutral.80}",
-          "type": "color",
-          "description": "Secondary text color - supporting text"
-        }
-      }
-    },
-    "focus": {
-      "ring": {
-        "color": {
-          "value": "oklch(0.63 0.14 232.13 / 0.45)",
-          "type": "color",
-          "description": "Global focus ring color - accessible, visible in both themes"
-        },
-        "width": {
-          "value": "2px",
-          "type": "dimension",
-          "description": "Focus ring width - WCAG 2.4.7 minimum"
-        },
-        "offset": {
-          "value": "2px",
-          "type": "dimension",
-          "description": "Focus ring offset from element"
-        }
-      }
-    }
-  }
-}

package/src/core/spacing.json

@@ -1,53 +0,0 @@
-{
-  "luma": {
-    "spacing": {
-      "xs": {
-        "value": "0.25rem",
-        "type": "dimension",
-        "description": "Extra small spacing (4px)"
-      },
-      "sm": {
-        "value": "0.5rem",
-        "type": "dimension",
-        "description": "Small spacing (8px)"
-      },
-      "md": {
-        "value": "1rem",
-        "type": "dimension",
-        "description": "Medium spacing (16px)"
-      },
-      "lg": {
-        "value": "1.5rem",
-        "type": "dimension",
-        "description": "Large spacing (24px)"
-      },
-      "xl": {
-        "value": "2.5rem",
-        "type": "dimension",
-        "description": "Extra large spacing (40px)"
-      }
-    },
-    "radius": {
-      "sm": {
-        "value": "6px",
-        "type": "dimension",
-        "description": "Small border radius"
-      },
-      "md": {
-        "value": "10px",
-        "type": "dimension",
-        "description": "Medium border radius"
-      },
-      "lg": {
-        "value": "18px",
-        "type": "dimension",
-        "description": "Large border radius"
-      },
-      "full": {
-        "value": "9999px",
-        "type": "dimension",
-        "description": "Full border radius (circular)"
-      }
-    }
-  }
-}

package/src/core/transitions.json

@@ -1,23 +0,0 @@
-{
-  "luma": {
-    "duration": {
-      "fast": {
-        "value": "150ms",
-        "type": "duration",
-        "description": "Fast transition duration"
-      },
-      "base": {
-        "value": "200ms",
-        "type": "duration",
-        "description": "Base transition duration"
-      }
-    },
-    "transition": {
-      "ease": {
-        "value": "ease-out",
-        "type": "string",
-        "description": "Default easing function"
-      }
-    }
-  }
-}

package/src/core/typography.json

@@ -1,64 +0,0 @@
-{
-  "luma": {
-    "font": {
-      "family": {
-        "base": {
-          "value": "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
-          "type": "fontFamily",
-          "description": "Base font family"
-        }
-      },
-      "weight": {
-        "regular": {
-          "value": "400",
-          "type": "fontWeight",
-          "description": "Regular font weight"
-        },
-        "medium": {
-          "value": "500",
-          "type": "fontWeight",
-          "description": "Medium font weight"
-        },
-        "semibold": {
-          "value": "600",
-          "type": "fontWeight",
-          "description": "Semibold font weight"
-        }
-      }
-    },
-    "text": {
-      "sm": {
-        "value": "0.75rem",
-        "type": "dimension",
-        "description": "Small text size (12px)"
-      },
-      "base": {
-        "value": "1rem",
-        "type": "dimension",
-        "description": "Base text size (16px)"
-      },
-      "lg": {
-        "value": "1.875rem",
-        "type": "dimension",
-        "description": "Large text size (30px)"
-      }
-    },
-    "line-height": {
-      "none": {
-        "value": "1",
-        "type": "number",
-        "description": "No line height"
-      },
-      "snug": {
-        "value": "1.375",
-        "type": "number",
-        "description": "Snug line height"
-      },
-      "relaxed": {
-        "value": "1.625",
-        "type": "number",
-        "description": "Relaxed line height"
-      }
-    }
-  }
-}

package/src/index.ts

@@ -1,8 +0,0 @@
-// Export design tokens
-// Import these tokens in your application's CSS file
-export const version = '0.0.1';
-
-// CSS files are exported via package.json exports field
-// Usage:
-// @import '@lumaui/tokens/luma.css';
-// @import '@lumaui/tokens/luma-dark.css';

package/src/luma-dark.css

@@ -1,34 +0,0 @@
-/* Luma Design System - Dark Theme */
-.dark {
-  --luma-color-primary: oklch(0.64 0.12 230);
-  --luma-color-primary-hover: oklch(0.58 0.11 230);
-  --luma-color-primary-active: oklch(0.52 0.1 230);
-  --luma-color-surface-base: oklch(0.15 0.005 0);
-  --luma-color-text-primary: oklch(0.98 0.002 0);
-  --luma-color-text-secondary: oklch(0.65 0.01 0);
-  --luma-card-background: oklch(0.17 0 0);
-  --luma-card-gradient-from: oklch(0.25 0.01 0 / 0.6);
-  --luma-card-gradient-to: oklch(0.2 0.008 0 / 0.6);
-  --luma-color-badge-bg: oklch(0.64 0.12 230 / 0.15);
-
-  /* Button - Dark Theme Overrides */
-  --luma-button-primary-bg: oklch(0.64 0.12 230);
-  --luma-button-primary-bg-hover: oklch(0.69 0.12 230);
-  --luma-button-primary-bg-active: oklch(0.74 0.13 230);
-  --luma-button-primary-text: oklch(0.1 0 0);
-
-  --luma-button-outline-border: oklch(0.65 0.01 0);
-  --luma-button-outline-border-hover: oklch(0.98 0.002 0);
-  --luma-button-outline-bg-hover: oklch(0.2 0.01 230);
-  --luma-button-outline-text: oklch(0.98 0.002 0);
-
-  --luma-button-ghost-bg-hover: oklch(0.2 0.01 230);
-  --luma-button-ghost-text: oklch(0.98 0.002 0);
-
-  --luma-button-danger-bg: oklch(0.6 0.24 25);
-  --luma-button-danger-bg-hover: oklch(0.65 0.25 25);
-  --luma-button-danger-bg-active: oklch(0.7 0.26 25);
-  --luma-button-danger-text: oklch(0.1 0 0);
-
-  --luma-button-focus-ring-color: oklch(0.64 0.12 230 / 0.25);
-}

package/src/luma.css

@@ -1,273 +0,0 @@
-@import 'tailwindcss';
-
-@theme {
-  /* Luma UI Design Tokens */
-
-  /* Colors - Primary */
-  --luma-color-primary: oklch(0.54 0.1 230);
-  --luma-color-primary-hover: oklch(0.49 0.09 230);
-  --luma-color-primary-active: oklch(0.44 0.08 230);
-
-  /* Colors - Surface */
-  --luma-color-surface-base: oklch(1 0 0);
-
-  /* Colors - Text */
-  --luma-color-text-primary: oklch(0.2 0.005 0);
-  --luma-color-text-secondary: oklch(0.5 0.01 0);
-
-  /* Colors - Card */
-  --luma-card-background: oklch(0.99 0 0);
-  --luma-card-gradient-from: oklch(0.92 0.005 0 / 0.6);
-  --luma-card-gradient-to: oklch(0.96 0.003 0 / 0.6);
-
-  /* Colors - Badge */
-  --luma-color-badge: var(--luma-color-primary);
-  --luma-color-badge-bg: oklch(0.54 0.1 230 / 0.1);
-
-  /* Font Family */
-  --luma-font-family-base:
-    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-
-  /* Font Sizes */
-  --luma-text-sm: 0.75rem;
-  --luma-text-base: 1rem;
-  --luma-text-lg: 1.875rem;
-
-  /* Font Weights */
-  --luma-font-weight-regular: 400;
-  --luma-font-weight-medium: 500;
-  --luma-font-weight-semibold: 600;
-
-  /* Line Heights */
-  --luma-line-height-snug: 1.375;
-  --luma-line-height-relaxed: 1.625;
-  --luma-line-height-none: 1;
-
-  /* Spacing */
-  --luma-spacing-xs: 0.25rem;
-  --luma-spacing-sm: 0.5rem;
-  --luma-spacing-md: 1rem;
-  --luma-spacing-lg: 1.5rem;
-  --luma-spacing-xl: 2.5rem;
-  --luma-card-padding: 1.5rem;
-
-  /* Border Radius */
-  --radius-luma-sm: 6px;
-  --radius-luma-md: 10px;
-  --radius-luma-lg: 18px;
-  --radius-luma-full: 9999px;
-
-  /* Transitions */
-  --luma-duration-fast: 150ms;
-  --luma-duration-base: 200ms;
-  --luma-transition-ease: ease-out;
-
-  /* Badge */
-  --luma-badge-padding-x: 0.625rem;
-  --luma-badge-padding-y: 0.25rem;
-  --luma-badge-font-size: var(--luma-text-sm);
-  --luma-badge-font-weight: var(--luma-font-weight-medium);
-
-  /* Card */
-  --luma-card-border-width: 1px;
-
-  /* Button Tokens */
-  /* Primary */
-  --luma-button-primary-bg: oklch(0.54 0.1 230);
-  --luma-button-primary-bg-hover: oklch(0.49 0.09 230);
-  --luma-button-primary-bg-active: oklch(0.44 0.08 230);
-  --luma-button-primary-text: oklch(1 0 0);
-
-  /* Outline */
-  --luma-button-outline-border: oklch(0.5 0.01 0);
-  --luma-button-outline-border-hover: oklch(0.2 0.005 0);
-  --luma-button-outline-bg-hover: oklch(0.96 0.01 230);
-  --luma-button-outline-text: oklch(0.2 0.005 0);
-
-  /* Ghost */
-  --luma-button-ghost-bg: transparent;
-  --luma-button-ghost-bg-hover: oklch(0.96 0.01 230);
-  --luma-button-ghost-text: oklch(0.2 0.005 0);
-
-  /* Danger */
-  --luma-button-danger-bg: oklch(0.55 0.22 25);
-  --luma-button-danger-bg-hover: oklch(0.5 0.2 25);
-  --luma-button-danger-bg-active: oklch(0.45 0.18 25);
-  --luma-button-danger-text: oklch(1 0 0);
-
-  /* Button Layout */
-  --luma-button-padding-x-sm: 1rem;
-  --luma-button-padding-y-sm: 0.5rem;
-  --luma-button-padding-x-md: 1.5rem;
-  --luma-button-padding-y-md: 0.75rem;
-  --luma-button-padding-x-lg: 2rem;
-  --luma-button-padding-y-lg: 1rem;
-  --luma-button-radius: var(--luma-radius-md);
-
-  /* Button Focus */
-  --luma-button-focus-ring-width: 2px;
-  --luma-button-focus-ring-color: oklch(0.54 0.1 230 / 0.25);
-}
-
-/* Utilities - Background Colors */
-@utility lm-bg-primary {
-  background-color: var(--luma-color-primary);
-}
-
-@utility lm-bg-surface-base {
-  background-color: var(--luma-color-surface-base);
-}
-
-@utility lm-bg-card-background {
-  background-color: var(--luma-card-background);
-}
-
-@utility lm-bg-badge-bg {
-  background-color: var(--luma-color-badge-bg);
-}
-
-/* Utilities - Text Colors */
-@utility lm-text-primary {
-  color: var(--luma-color-text-primary);
-}
-
-@utility lm-text-secondary {
-  color: var(--luma-color-text-secondary);
-}
-
-@utility lm-text-badge {
-  color: var(--luma-color-badge);
-}
-
-/* Utilities - Border Colors */
-@utility lm-border-text-primary {
-  border-color: var(--luma-color-text-primary);
-}
-
-@utility lm-border-text-secondary {
-  border-color: var(--luma-color-text-secondary);
-}
-
-/* Utilities - Border Radius */
-@utility lm-rounded-sm {
-  border-radius: var(--luma-radius-sm);
-}
-
-@utility lm-rounded-md {
-  border-radius: var(--luma-radius-md);
-}
-
-@utility lm-rounded-lg {
-  border-radius: var(--luma-radius-lg);
-}
-
-/* Utilities - Font Sizes */
-@utility lm-text-sm {
-  font-size: var(--luma-text-sm);
-}
-
-@utility lm-text-base {
-  font-size: var(--luma-text-base);
-}
-
-@utility lm-text-lg {
-  font-size: var(--luma-text-lg);
-}
-
-/* Utilities - Transitions */
-@utility lm-duration-fast {
-  transition-duration: var(--luma-duration-fast);
-}
-
-@utility lm-duration-base {
-  transition-duration: var(--luma-duration-base);
-}
-
-/* Utilities - Gradient */
-@utility lm-from-card-gradient-from {
-  --tw-gradient-from: var(--luma-card-gradient-from);
-  --tw-gradient-to: rgb(255 255 255 / 0);
-  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
-}
-
-@utility lm-to-card-gradient-to {
-  --tw-gradient-to: var(--luma-card-gradient-to);
-}
-
-/* Utilities - Padding */
-@utility lm-p-card {
-  padding: var(--luma-card-padding);
-}
-
-/* ===== BUTTON UTILITIES ===== */
-
-/* Primary Button */
-@utility lm-bg-button-primary {
-  background-color: var(--luma-button-primary-bg);
-}
-
-@utility lm-bg-button-primary-hover {
-  background-color: var(--luma-button-primary-bg-hover);
-}
-
-@utility lm-bg-button-primary-active {
-  background-color: var(--luma-button-primary-bg-active);
-}
-
-@utility lm-text-button-primary-text {
-  color: var(--luma-button-primary-text);
-}
-
-/* Outline Button */
-@utility lm-border-button-outline-border {
-  border-color: var(--luma-button-outline-border);
-}
-
-@utility lm-border-button-outline-border-hover {
-  border-color: var(--luma-button-outline-border-hover);
-}
-
-@utility lm-bg-button-outline-bg-hover {
-  background-color: var(--luma-button-outline-bg-hover);
-}
-
-@utility lm-button-outline-text {
-  color: var(--luma-button-outline-text);
-}
-
-/* Ghost Button */
-@utility lm-button-ghost-bg {
-  background-color: var(--luma-button-ghost-bg);
-}
-
-@utility lm-button-ghost-bg-hover {
-  background-color: var(--luma-button-ghost-bg-hover);
-}
-
-@utility lm-button-ghost-text {
-  color: var(--luma-button-ghost-text);
-}
-
-/* Danger Button */
-@utility lm-button-danger-bg {
-  background-color: var(--luma-button-danger-bg);
-}
-
-@utility lm-button-danger-bg-hover {
-  background-color: var(--luma-button-danger-bg-hover);
-}
-
-@utility lm-button-danger-bg-active {
-  background-color: var(--luma-button-danger-bg-active);
-}
-
-@utility lm-button-danger-text {
-  color: var(--luma-button-danger-text);
-}
-
-/* Button Focus Ring */
-@utility lm-ring-button-focus {
-  outline: var(--luma-button-focus-ring-width) solid
-    var(--luma-button-focus-ring-color);
-  outline-offset: 2px;
-}

package/src/themes/dark.tokens.css

@@ -1,55 +0,0 @@
-:root {
-  /* Cores - Primária (Blue Neo-Minimal) - Dark theme */
-  --lumo-color-primary: #5ca3d8;
-  --lumo-color-primary-hover: #4a91c6;
-  --lumo-color-primary-active: #387fb4;
-  --lumo-color-primary-focus: rgba(92, 163, 216, 0.3);
-  --lumo-color-primary-background: rgba(92, 163, 216, 0.15);
-
-  /* Cores - Neutros - Dark theme */
-  --lumo-color-surface-base: #0f1114;
-  --lumo-color-text-primary: #f9fafb;
-  --lumo-color-text-secondary: #9ca3af;
-  --lumo-color-gradient-from: rgba(39, 39, 42, 0.6);
-  --lumo-color-gradient-to: rgba(24, 24, 27, 0.6);
-
-  /* Tipografia permanece a mesma */
-  --lumo-font-family-base:
-    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-  --lumo-font-size-sm: 0.75rem;
-  --lumo-font-size-base: 1rem;
-  --lumo-font-size-lg: 1.875rem;
-  --lumo-font-weight-regular: 400;
-  --lumo-font-weight-medium: 500;
-  --lumo-font-weight-semibold: 600;
-  --lumo-line-height-snug: 1.375;
-  --lumo-line-height-relaxed: 1.625;
-  --lumo-line-height-none: 1;
-
-  /* Espaçamento permanece o mesmo */
-  --lumo-spacing-xs: 0.25rem;
-  --lumo-spacing-sm: 0.5rem;
-  --lumo-spacing-md: 1rem;
-  --lumo-spacing-lg: 1.5rem;
-  --lumo-spacing-xl: 2.5rem;
-
-  /* Border Radius permanece o mesmo */
-  --lumo-radius-sm: 6px;
-  --lumo-radius-md: 10px;
-  --lumo-radius-lg: 18px;
-  --lumo-radius-full: 9999px;
-
-  /* Transições permanecem as mesmas */
-  --lumo-transition-duration-fast: 150ms;
-  --lumo-transition-duration-base: 200ms;
-  --lumo-transition-ease: ease-out;
-
-  /* Badge - Dark theme */
-  --lumo-badge-background: var(--lumo-color-primary-background);
-  --lumo-badge-color: var(--lumo-color-primary);
-  --lumo-badge-padding-x: 0.625rem;
-  --lumo-badge-padding-y: 0.25rem;
-  --lumo-badge-radius: var(--lumo-radius-full);
-  --lumo-badge-font-size: var(--lumo-font-size-sm);
-  --lumo-badge-font-weight: var(--lumo-font-weight-medium);
-}