@lemmo-lab/tokens 1.0.0

package/dist/css/variables.css

@@ -0,0 +1,411 @@
+/**
+ * @lemmo-lab/tokens - Default Theme & Design Primitives (Dark Default)
+ * Auto-generated by Style Dictionary pipeline. DO NOT EDIT DIRECTLY.
+ */
+
+:root {
+  /* --- SPACING (4px ladder) --- */
+  --lemmo-space-0: 0;
+  --lemu-space-0: 0;
+  --lemmo-space-50: .125rem;
+  --lemu-space-50: .125rem;
+  --lemmo-space-100: .25rem;
+  --lemu-space-100: .25rem;
+  --lemmo-space-150: .375rem;
+  --lemu-space-150: .375rem;
+  --lemmo-space-200: .5rem;
+  --lemu-space-200: .5rem;
+  --lemmo-space-250: .625rem;
+  --lemu-space-250: .625rem;
+  --lemmo-space-300: .75rem;
+  --lemu-space-300: .75rem;
+  --lemmo-space-400: 1rem;
+  --lemu-space-400: 1rem;
+  --lemmo-space-500: 1.25rem;
+  --lemu-space-500: 1.25rem;
+  --lemmo-space-600: 1.5rem;
+  --lemu-space-600: 1.5rem;
+  --lemmo-space-700: 1.75rem;
+  --lemu-space-700: 1.75rem;
+  --lemmo-space-800: 2rem;
+  --lemu-space-800: 2rem;
+  --lemmo-space-1000: 2.5rem;
+  --lemu-space-1000: 2.5rem;
+  --lemmo-space-1200: 3rem;
+  --lemu-space-1200: 3rem;
+  --lemmo-space-1400: 3.5rem;
+  --lemu-space-1400: 3.5rem;
+  --lemmo-space-1600: 4rem;
+  --lemu-space-1600: 4rem;
+  --lemmo-space-2000: 5rem;
+  --lemu-space-2000: 5rem;
+  --lemmo-space-2400: 6rem;
+  --lemu-space-2400: 6rem;
+
+  /* --- GAPS --- */
+  --lemmo-gap-1: .25rem;
+  --lemu-gap-1: .25rem;
+  --lemmo-gap-2: .5rem;
+  --lemu-gap-2: .5rem;
+  --lemmo-gap-3: .75rem;
+  --lemu-gap-3: .75rem;
+  --lemmo-gap-4: 1rem;
+  --lemu-gap-4: 1rem;
+  --lemmo-gap-0-5: .125rem;
+  --lemu-gap-0-5: .125rem;
+  --lemmo-gap-1-5: .375rem;
+  --lemu-gap-1-5: .375rem;
+  --lemmo-gap-2-5: .625rem;
+  --lemu-gap-2-5: .625rem;
+  --lemmo-gap-cardGrid: .5rem;
+  --lemu-gap-cardGrid: .5rem;
+  --lemmo-gap-cardInner: .5rem;
+  --lemu-gap-cardInner: .5rem;
+  --lemmo-gap-sectionSm: 2.5rem;
+  --lemu-gap-sectionSm: 2.5rem;
+  --lemmo-gap-sectionLg: 5rem;
+  --lemu-gap-sectionLg: 5rem;
+
+  /* --- RADIUS --- */
+  --lemmo-radius-0: 0;
+  --lemu-radius-0: 0;
+  --lemmo-radius-100: .25rem;
+  --lemu-radius-100: .25rem;
+  --lemmo-radius-150: .375rem;
+  --lemu-radius-150: .375rem;
+  --lemmo-radius-200: .5rem;
+  --lemu-radius-200: .5rem;
+  --lemmo-radius-250: .625rem;
+  --lemu-radius-250: .625rem;
+  --lemmo-radius-300: .75rem;
+  --lemu-radius-300: .75rem;
+  --lemmo-radius-400: 1rem;
+  --lemu-radius-400: 1rem;
+  --lemmo-radius-500: 1.25rem;
+  --lemu-radius-500: 1.25rem;
+  --lemmo-radius-600: 1.5rem;
+  --lemu-radius-600: 1.5rem;
+  --lemmo-radius-base: .5rem;
+  --lemu-radius-base: .5rem;
+  --lemmo-radius-050: .125rem;
+  --lemu-radius-050: .125rem;
+  --lemmo-radius-full: 9999px;
+  --lemu-radius-full: 9999px;
+  --lemmo-radius-badge: calc(var(--lemmo-radius-base) * 0.75);
+  --lemmo-radius-control: var(--lemmo-radius-base);
+  --lemmo-radius-card: calc(var(--lemmo-radius-base) * 1.5);
+  --lemmo-radius-media: calc(var(--lemmo-radius-base) * 2);
+  --lemmo-radius-featured-card: calc(var(--lemmo-radius-base) * 2.5);
+  --lemmo-radius-media-lg: calc(var(--lemmo-radius-base) * 3);
+  --lemmo-radius-pill: 9999px;
+
+  /* --- TYPOGRAPHY FAMILIES & SCALES --- */
+  --lemmo-font-satoshi: 'Satoshi', sans-serif;
+  --lemu-font-satoshi: 'Satoshi', sans-serif;
+  --lemmo-font-oddval: 'Oddval', 'Satoshi', sans-serif;
+  --lemu-font-oddval: 'Oddval', 'Satoshi', sans-serif;
+  --lemmo-font-morabba: 'Morabba', sans-serif;
+  --lemu-font-morabba: 'Morabba', sans-serif;
+  --lemmo-font-iransans: 'IRANSans', sans-serif;
+  --lemu-font-iransans: 'IRANSans', sans-serif;
+  --lemmo-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  --lemu-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  --lemmo-font-weight-regular: 400;
+  --lemu-font-weight-regular: 400;
+  --lemmo-font-weight-medium: 500;
+  --lemu-font-weight-medium: 500;
+  --lemmo-font-weight-cta: 510;
+  --lemu-font-weight-cta: 510;
+  --lemmo-font-weight-semiBold: 600;
+  --lemu-font-weight-semiBold: 600;
+  --lemmo-font-weight-bold: 700;
+  --lemu-font-weight-bold: 700;
+  --lemmo-font-weight-black: 900;
+  --lemu-font-weight-black: 900;
+  --lemmo-type-size-100: .75rem;
+  --lemu-type-size-100: .75rem;
+  --lemmo-type-size-200: .875rem;
+  --lemu-type-size-200: .875rem;
+  --lemmo-type-size-300: 1rem;
+  --lemu-type-size-300: 1rem;
+  --lemmo-type-size-400: 1.125rem;
+  --lemu-type-size-400: 1.125rem;
+  --lemmo-type-size-500: 1.25rem;
+  --lemu-type-size-500: 1.25rem;
+  --lemmo-type-size-600: 1.5rem;
+  --lemu-type-size-600: 1.5rem;
+  --lemmo-type-size-700: 1.75rem;
+  --lemu-type-size-700: 1.75rem;
+  --lemmo-type-size-800: 2rem;
+  --lemu-type-size-800: 2rem;
+  --lemmo-type-size-900: 2.25rem;
+  --lemu-type-size-900: 2.25rem;
+  --lemmo-type-size-1000: 2.5rem;
+  --lemu-type-size-1000: 2.5rem;
+  --lemmo-type-size-1100: 3rem;
+  --lemu-type-size-1100: 3rem;
+  --lemmo-type-size-1200: 3.5rem;
+  --lemu-type-size-1200: 3.5rem;
+  --lemmo-type-size-1300: 4rem;
+  --lemu-type-size-1300: 4rem;
+  --lemmo-type-size-1400: 4.5rem;
+  --lemu-type-size-1400: 4.5rem;
+  --lemmo-type-size-050: .625rem;
+  --lemu-type-size-050: .625rem;
+  --lemmo-type-leading-300: 1rem;
+  --lemu-type-leading-300: 1rem;
+  --lemmo-type-leading-400: 1.125rem;
+  --lemu-type-leading-400: 1.125rem;
+  --lemmo-type-leading-500: 1.25rem;
+  --lemu-type-leading-500: 1.25rem;
+  --lemmo-type-leading-600: 1.5rem;
+  --lemu-type-leading-600: 1.5rem;
+  --lemmo-type-leading-700: 1.75rem;
+  --lemu-type-leading-700: 1.75rem;
+  --lemmo-type-leading-800: 2rem;
+  --lemu-type-leading-800: 2rem;
+  --lemmo-type-leading-900: 2.25rem;
+  --lemu-type-leading-900: 2.25rem;
+  --lemmo-type-leading-1000: 2.5rem;
+  --lemu-type-leading-1000: 2.5rem;
+  --lemmo-type-leading-1100: 2.75rem;
+  --lemu-type-leading-1100: 2.75rem;
+  --lemmo-type-leading-1200: 3rem;
+  --lemu-type-leading-1200: 3rem;
+  --lemmo-type-leading-1300: 4rem;
+  --lemu-type-leading-1300: 4rem;
+  --lemmo-type-leading-1400: 4.5rem;
+  --lemu-type-leading-1400: 4.5rem;
+  --lemmo-type-track-none: 0;
+  --lemu-type-track-none: 0;
+  --lemmo-type-track-slight: -0.025rem;
+  --lemu-type-track-slight: -0.025rem;
+  --lemmo-type-track-tight: -0.075rem;
+  --lemu-type-track-tight: -0.075rem;
+  --lemmo-type-track-loose: 0.00625rem;
+  --lemu-type-track-loose: 0.00625rem;
+  --lemmo-type-track-wide: 0.0125rem;
+  --lemu-type-track-wide: 0.0125rem;
+  --lemmo-type-track-xxs: -0.3px;
+  --lemu-type-track-xxs: -0.3px;
+  --lemmo-type-track-5xl: -1.2px;
+  --lemu-type-track-5xl: -1.2px;
+  --lemmo-type-track-heading: -2%;
+  --lemu-type-track-heading: -2%;
+  --lemmo-type-track-caps: -4%;
+  --lemu-type-track-caps: -4%;
+  --lemmo-type-track-label: 0.2px;
+  --lemu-type-track-label: 0.2px;
+  --lemmo-type-track-caption: 0;
+  --lemu-type-track-caption: 0;
+  --lemmo-type-track-tableHead: -0.56px;
+  --lemu-type-track-tableHead: -0.56px;
+  --lemmo-leading-factor: 1;
+  --lemu-leading-factor: 1;
+
+  /* --- BREAKPOINTS & SIZES --- */
+  --lemmo-bp-base: 20rem;
+  --lemu-bp-base: 20rem;
+  --lemmo-bp-sm: 40rem;
+  --lemu-bp-sm: 40rem;
+  --lemmo-bp-md: 48rem;
+  --lemu-bp-md: 48rem;
+  --lemmo-bp-lg: 64rem;
+  --lemu-bp-lg: 64rem;
+  --lemmo-bp-xl: 80rem;
+  --lemu-bp-xl: 80rem;
+  --lemmo-bp-2xl: 120rem;
+  --lemu-bp-2xl: 120rem;
+  --lemmo-bp-3xl: 158rem;
+  --lemu-bp-3xl: 158rem;
+  --lemmo-stroke-none: 0;
+  --lemu-stroke-none: 0;
+  --lemmo-stroke-hairline: 0.5px;
+  --lemu-stroke-hairline: 0.5px;
+  --lemmo-stroke-thin: 1px;
+  --lemu-stroke-thin: 1px;
+  --lemmo-stroke-medium: 1.5px;
+  --lemu-stroke-medium: 1.5px;
+  --lemmo-stroke-thick: 2px;
+  --lemu-stroke-thick: 2px;
+  --lemmo-size-control-xs: 2rem;
+  --lemu-size-control-xs: 2rem;
+  --lemmo-size-control-sm: 2.25rem;
+  --lemu-size-control-sm: 2.25rem;
+  --lemmo-size-control-md: 2.5rem;
+  --lemu-size-control-md: 2.5rem;
+  --lemmo-size-control-lg: 2.75rem;
+  --lemu-size-control-lg: 2.75rem;
+  --lemmo-size-control-xl: 3rem;
+  --lemu-size-control-xl: 3rem;
+  --lemmo-size-icon-xs: .75rem;
+  --lemu-size-icon-xs: .75rem;
+  --lemmo-size-icon-sm: 1rem;
+  --lemu-size-icon-sm: 1rem;
+  --lemmo-size-icon-md: 1.25rem;
+  --lemu-size-icon-md: 1.25rem;
+  --lemmo-size-icon-lg: 1.5rem;
+  --lemu-size-icon-lg: 1.5rem;
+  --lemmo-size-icon-xl: 1.75rem;
+  --lemu-size-icon-xl: 1.75rem;
+
+  /* --- MOTION --- */
+  --lemmo-duration-fast: 100ms;
+  --lemu-duration-fast: 100ms;
+  --lemmo-duration-normal: 200ms;
+  --lemu-duration-normal: 200ms;
+  --lemmo-duration-slow: 300ms;
+  --lemu-duration-slow: 300ms;
+  --lemmo-duration-slower: 500ms;
+  --lemu-duration-slower: 500ms;
+  --lemmo-duration-slider: 150ms;
+  --lemu-duration-slider: 150ms;
+  --lemmo-duration-planSwap: 420ms;
+  --lemu-duration-planSwap: 420ms;
+  --lemmo-duration-breathe: 1.8s;
+  --lemu-duration-breathe: 1.8s;
+  --lemmo-ease-out: ease-out;
+  --lemu-ease-out: ease-out;
+  --lemmo-ease-inOut: ease-in-out;
+  --lemu-ease-inOut: ease-in-out;
+  --lemmo-ease-snap: cubic-bezier(0.77, 0, 0.175, 1);
+  --lemu-ease-snap: cubic-bezier(0.77, 0, 0.175, 1);
+  --lemmo-ease-spring: cubic-bezier(0.68, -0.55, 0.265, 1.55);
+  --lemu-ease-spring: cubic-bezier(0.68, -0.55, 0.265, 1.55);
+  --lemmo-ease-swift: cubic-bezier(0.55, 0, 0.1, 1);
+  --lemu-ease-swift: cubic-bezier(0.55, 0, 0.1, 1);
+  --lemmo-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
+  --lemu-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
+  --lemmo-ease-outExpo: cubic-bezier(0.16, 1, 0.3, 1);
+  --lemu-ease-outExpo: cubic-bezier(0.16, 1, 0.3, 1);
+  --lemmo-ease-outQuart: cubic-bezier(0.165, 0.84, 0.44, 1);
+  --lemu-ease-outQuart: cubic-bezier(0.165, 0.84, 0.44, 1);
+
+  /* --- DEFAULT (DARK) THEME COLORS --- */
+  --lemmo-page-background: #131517;
+  --lemu-page-background: #131517;
+  --lemmo-page-foreground: #e1e1e3;
+  --lemu-page-foreground: #e1e1e3;
+  --lemmo-surface-primary-background: #1c1e20;
+  --lemu-surface-primary-background: #1c1e20;
+  --lemmo-surface-primary-foreground: #e1e1e3;
+  --lemu-surface-primary-foreground: #e1e1e3;
+  --lemmo-surface-secondary-background: #23262a;
+  --lemu-surface-secondary-background: #23262a;
+  --lemmo-surface-secondary-foreground: #a1a1a5;
+  --lemu-surface-secondary-foreground: #a1a1a5;
+  --lemmo-surface-tertiary-background: #0f1113;
+  --lemu-surface-tertiary-background: #0f1113;
+  --lemmo-surface-tertiary-foreground: #e1e1e3;
+  --lemu-surface-tertiary-foreground: #e1e1e3;
+  --lemmo-surface-elevated-background: #18191c;
+  --lemu-surface-elevated-background: #18191c;
+  --lemmo-surface-elevated-foreground: #e1e1e3;
+  --lemu-surface-elevated-foreground: #e1e1e3;
+  --lemmo-surface-glass-background: rgba(15, 17, 19, 0.88);
+  --lemu-surface-glass-background: rgba(15, 17, 19, 0.88);
+  --lemmo-surface-glass-foreground: #e1e1e3;
+  --lemu-surface-glass-foreground: #e1e1e3;
+  --lemmo-surface-brand-background: #d1fe17;
+  --lemu-surface-brand-background: #d1fe17;
+  --lemmo-surface-brand-foreground: #131517;
+  --lemu-surface-brand-foreground: #131517;
+  --lemmo-text-primary: #e1e1e3;
+  --lemu-text-primary: #e1e1e3;
+  --lemmo-text-secondary: #a1a1a5;
+  --lemu-text-secondary: #a1a1a5;
+  --lemmo-text-muted: #898a8b;
+  --lemu-text-muted: #898a8b;
+  --lemmo-text-faint: #737475;
+  --lemu-text-faint: #737475;
+  --lemmo-text-onBrand: #131517;
+  --lemu-text-onBrand: #131517;
+  --lemmo-text-reverted: #060515;
+  --lemu-text-reverted: #060515;
+  --lemmo-text-danger: #ff5462;
+  --lemu-text-danger: #ff5462;
+  --lemmo-text-warning: #dfab01;
+  --lemu-text-warning: #dfab01;
+  --lemmo-text-success: #4ee466;
+  --lemu-text-success: #4ee466;
+  --lemmo-text-info: #5b91fe;
+  --lemu-text-info: #5b91fe;
+  --lemmo-border-default: rgba(255, 255, 255, 0.1);
+  --lemu-border-default: rgba(255, 255, 255, 0.1);
+  --lemmo-border-subtle: rgba(255, 255, 255, 0.04);
+  --lemu-border-subtle: rgba(255, 255, 255, 0.04);
+  --lemmo-border-mid: rgba(255, 255, 255, 0.05);
+  --lemu-border-mid: rgba(255, 255, 255, 0.05);
+  --lemmo-border-danger: #fa0019;
+  --lemu-border-danger: #fa0019;
+  --lemmo-border-warning: #dfab01;
+  --lemu-border-warning: #dfab01;
+  --lemmo-border-success: #2eb844;
+  --lemu-border-success: #2eb844;
+  --lemmo-border-info: #0256fe;
+  --lemu-border-info: #0256fe;
+  --lemmo-interactive-primary-background: #d1fe17;
+  --lemu-interactive-primary-background: #d1fe17;
+  --lemmo-interactive-primary-foreground: #131517;
+  --lemu-interactive-primary-foreground: #131517;
+  --lemmo-interactive-primary-hover: #c4ee0b;
+  --lemu-interactive-primary-hover: #c4ee0b;
+  --lemmo-interactive-secondary-background: #0256fe;
+  --lemu-interactive-secondary-background: #0256fe;
+  --lemmo-interactive-secondary-foreground: #e1e1e3;
+  --lemu-interactive-secondary-foreground: #e1e1e3;
+  --lemmo-interactive-secondary-hover: #245ef1;
+  --lemu-interactive-secondary-hover: #245ef1;
+  --lemmo-status-danger-background: #5c000f;
+  --lemu-status-danger-background: #5c000f;
+  --lemmo-status-danger-foreground: #ff5462;
+  --lemu-status-danger-foreground: #ff5462;
+  --lemmo-status-danger-border: #fa0019;
+  --lemu-status-danger-border: #fa0019;
+  --lemmo-status-danger-glow: {color.status.danger.glow};
+  --lemu-status-danger-glow: {color.status.danger.glow};
+  --lemmo-status-warning-background: #523f00;
+  --lemu-status-warning-background: #523f00;
+  --lemmo-status-warning-foreground: #ffef33;
+  --lemu-status-warning-foreground: #ffef33;
+  --lemmo-status-warning-border: #dfab01;
+  --lemu-status-warning-border: #dfab01;
+  --lemmo-status-warning-glow: {color.status.warning.glow};
+  --lemu-status-warning-glow: {color.status.warning.glow};
+  --lemmo-status-success-background: #0d4a17;
+  --lemu-status-success-background: #0d4a17;
+  --lemmo-status-success-foreground: #4ee466;
+  --lemu-status-success-foreground: #4ee466;
+  --lemmo-status-success-border: #2eb844;
+  --lemu-status-success-border: #2eb844;
+  --lemmo-status-success-glow: {color.status.success.glow};
+  --lemu-status-success-glow: {color.status.success.glow};
+  --lemmo-status-info-background: #000d26;
+  --lemu-status-info-background: #000d26;
+  --lemmo-status-info-foreground: #5b91fe;
+  --lemu-status-info-foreground: #5b91fe;
+  --lemmo-status-info-border: #0256fe;
+  --lemu-status-info-border: #0256fe;
+  --lemmo-status-info-glow: {color.status.info.glow};
+  --lemu-status-info-glow: {color.status.info.glow};
+}
+
+/* Automatic language switching for Persian [lang='fa'] */
+:root[lang='fa'],
+[lang='fa'] {
+  --lemmo-font-heading: var(--lemmo-font-morabba);
+  --lemmo-font-body: var(--lemmo-font-iransans);
+  --lemmo-leading-factor: 1.15;
+  --lemu-font-heading: var(--lemu-font-morabba);
+  --lemu-font-body: var(--lemu-font-iransans);
+  --lemu-leading-factor: 1.15;
+}
+
+/* Numerals standard: Satoshi in tabular-nums isolate */
+.tabular-nums,
+[data-numeric] {
+  font-family: var(--lemmo-font-satoshi);
+  font-feature-settings: 'tnum' 1;
+  direction: ltr;
+  unicode-bidi: isolate;
+}

package/dist/js/tokens.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @lemmo-lab/tokens - TypeScript Definitions
+ */
+
+export declare const core: typeof import('./tokens.js').core;
+export declare const semantic: typeof import('./tokens.js').semantic;
+export declare const themes: {
+  default: any;
+  light: any;
+  neon: any;
+  midnight: any;
+  [key: string]: any;
+};
+export declare const tokens: {
+  core: typeof core;
+  semantic: typeof semantic;
+  themes: typeof themes;
+  defaultTheme: any;
+  lightTheme: any;
+};
+export default tokens;