@francofantomius/material-components 1.1.2 → 1.3.0

package/dist/tokens/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/tokens/colors.ts","../../src/tokens/typography.ts","../../src/tokens/elevation.ts","../../src/tokens/shape.ts","../../src/tokens/motion.ts","../../src/tokens/theme.css.ts"],"sourcesContent":["export interface M3ColorScheme {\n  primary: string;\n  onPrimary: string;\n  primaryContainer: string;\n  onPrimaryContainer: string;\n  secondary: string;\n  onSecondary: string;\n  secondaryContainer: string;\n  onSecondaryContainer: string;\n  tertiary: string;\n  onTertiary: string;\n  tertiaryContainer: string;\n  onTertiaryContainer: string;\n  error: string;\n  onError: string;\n  errorContainer: string;\n  onErrorContainer: string;\n  background: string;\n  onBackground: string;\n  surface: string;\n  onSurface: string;\n  surfaceVariant: string;\n  onSurfaceVariant: string;\n  outline: string;\n  outlineVariant: string;\n  shadow: string;\n  scrim: string;\n  inverseSurface: string;\n  inverseOnSurface: string;\n  inversePrimary: string;\n  surfaceDim: string;\n  surfaceBright: string;\n  surfaceContainerLowest: string;\n  surfaceContainerLow: string;\n  surfaceContainer: string;\n  surfaceContainerHigh: string;\n  surfaceContainerHighest: string;\n}\n\nexport const lightColorScheme: M3ColorScheme = {\n  primary: '#6750A4',\n  onPrimary: '#FFFFFF',\n  primaryContainer: '#EADDFF',\n  onPrimaryContainer: '#21005D',\n  secondary: '#625B71',\n  onSecondary: '#FFFFFF',\n  secondaryContainer: '#E8DEF8',\n  onSecondaryContainer: '#1D192B',\n  tertiary: '#7D5260',\n  onTertiary: '#FFFFFF',\n  tertiaryContainer: '#FFD8E4',\n  onTertiaryContainer: '#31111D',\n  error: '#B3261E',\n  onError: '#FFFFFF',\n  errorContainer: '#F9DEDC',\n  onErrorContainer: '#410E0B',\n  background: '#FEF7FF',\n  onBackground: '#1D1B20',\n  surface: '#FEF7FF',\n  onSurface: '#1D1B20',\n  surfaceVariant: '#E7E0EC',\n  onSurfaceVariant: '#49454F',\n  outline: '#79747E',\n  outlineVariant: '#CAC4D0',\n  shadow: '#000000',\n  scrim: 'rgba(0, 0, 0, 0.32)',\n  inverseSurface: '#313033',\n  inverseOnSurface: '#F4EFF4',\n  inversePrimary: '#D0BCFF',\n  surfaceDim: '#DED8E1',\n  surfaceBright: '#FEF7FF',\n  surfaceContainerLowest: '#FFFFFF',\n  surfaceContainerLow: '#F7F2FA',\n  surfaceContainer: '#F3EDF7',\n  surfaceContainerHigh: '#ECE6F0',\n  surfaceContainerHighest: '#E6E0E9',\n};\n\nexport const darkColorScheme: M3ColorScheme = {\n  primary: '#D0BCFF',\n  onPrimary: '#381E72',\n  primaryContainer: '#4F378B',\n  onPrimaryContainer: '#EADDFF',\n  secondary: '#CCC2DC',\n  onSecondary: '#332D41',\n  secondaryContainer: '#4A4458',\n  onSecondaryContainer: '#E8DEF8',\n  tertiary: '#EFB8C8',\n  onTertiary: '#492532',\n  tertiaryContainer: '#633B48',\n  onTertiaryContainer: '#FFD8E4',\n  error: '#F2B8B5',\n  onError: '#601410',\n  errorContainer: '#8C1D18',\n  onErrorContainer: '#F9DEDC',\n  background: '#141218',\n  onBackground: '#E6E0E9',\n  surface: '#141218',\n  onSurface: '#E6E0E9',\n  surfaceVariant: '#49454F',\n  onSurfaceVariant: '#CAC4D0',\n  outline: '#938F99',\n  outlineVariant: '#49454F',\n  shadow: '#000000',\n  scrim: 'rgba(0, 0, 0, 0.32)',\n  inverseSurface: '#E6E0E9',\n  inverseOnSurface: '#313033',\n  inversePrimary: '#6750A4',\n  surfaceDim: '#141218',\n  surfaceBright: '#3B383E',\n  surfaceContainerLowest: '#0F0D13',\n  surfaceContainerLow: '#1D1B20',\n  surfaceContainer: '#211F26',\n  surfaceContainerHigh: '#2B2930',\n  surfaceContainerHighest: '#36343B',\n};\n\nexport function colorSchemeToCssVariables(scheme: Partial<M3ColorScheme>): Record<string, string> {\n  const vars: Record<string, string> = {};\n  for (const [key, value] of Object.entries(scheme)) {\n    const kebab = key.replace(/([A-Z])/g, '-$1').toLowerCase();\n    vars[`--md-sys-color-${kebab}`] = value;\n  }\n  return vars;\n}\n\n","export interface M3TypographyStyle {\n  fontFamily: string;\n  weight: number | string;\n  size: string;\n  lineHeight: string;\n  letterSpacing: string;\n}\n\nexport const typographyTokens = {\n  fontFamily: \"'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif\",\n  displayLarge: { size: '57px', lineHeight: '64px', letterSpacing: '-0.25px', weight: 400 },\n  displayMedium: { size: '45px', lineHeight: '52px', letterSpacing: '0px', weight: 400 },\n  displaySmall: { size: '36px', lineHeight: '44px', letterSpacing: '0px', weight: 400 },\n  headlineLarge: { size: '32px', lineHeight: '40px', letterSpacing: '0px', weight: 400 },\n  headlineMedium: { size: '28px', lineHeight: '36px', letterSpacing: '0px', weight: 400 },\n  headlineSmall: { size: '24px', lineHeight: '32px', letterSpacing: '0px', weight: 400 },\n  titleLarge: { size: '22px', lineHeight: '28px', letterSpacing: '0px', weight: 400 },\n  titleMedium: { size: '16px', lineHeight: '24px', letterSpacing: '0.15px', weight: 500 },\n  titleSmall: { size: '14px', lineHeight: '20px', letterSpacing: '0.1px', weight: 500 },\n  bodyLarge: { size: '16px', lineHeight: '24px', letterSpacing: '0.5px', weight: 400 },\n  bodyMedium: { size: '14px', lineHeight: '20px', letterSpacing: '0.25px', weight: 400 },\n  bodySmall: { size: '12px', lineHeight: '16px', letterSpacing: '0.4px', weight: 400 },\n  labelLarge: { size: '14px', lineHeight: '20px', letterSpacing: '0.1px', weight: 500 },\n  labelMedium: { size: '12px', lineHeight: '16px', letterSpacing: '0.5px', weight: 500 },\n  labelSmall: { size: '11px', lineHeight: '16px', letterSpacing: '0.5px', weight: 500 },\n};\n\n","export const elevationTokens = {\n  level0: 'none',\n  level1: '0px 1px 3px 1px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.30)',\n  level2: '0px 2px 6px 2px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.30)',\n  level3: '0px 1px 3px 0px rgba(0, 0, 0, 0.30), 0px 4px 8px 3px rgba(0, 0, 0, 0.15)',\n  level4: '0px 2px 3px 0px rgba(0, 0, 0, 0.30), 0px 6px 10px 4px rgba(0, 0, 0, 0.15)',\n  level5: '0px 4px 4px 0px rgba(0, 0, 0, 0.30), 0px 8px 12px 6px rgba(0, 0, 0, 0.15)',\n};\n\n","export const shapeTokens = {\n  cornerNone: '0px',\n  cornerExtraSmall: '4px',\n  cornerSmall: '8px',\n  cornerMedium: '12px',\n  cornerLarge: '16px',\n  cornerExtraLarge: '28px',\n  cornerFull: '9999px',\n};\n\n","export const motionTokens = {\n  easingStandard: 'cubic-bezier(0.2, 0, 0, 1)',\n  easingStandardDecelerate: 'cubic-bezier(0, 0, 0, 1)',\n  easingStandardAccelerate: 'cubic-bezier(0.3, 0, 1, 1)',\n  easingEmphasized: 'cubic-bezier(0.2, 0, 0, 1)',\n  easingEmphasizedDecelerate: 'cubic-bezier(0.05, 0.7, 0.1, 1)',\n  easingEmphasizedAccelerate: 'cubic-bezier(0.3, 0, 0.8, 0.15)',\n  \n  durationShort1: '50ms',\n  durationShort2: '100ms',\n  durationShort3: '150ms',\n  durationShort4: '200ms',\n  durationMedium1: '250ms',\n  durationMedium2: '300ms',\n  durationMedium3: '350ms',\n  durationMedium4: '400ms',\n  durationLong1: '450ms',\n  durationLong2: '500ms',\n  durationLong3: '550ms',\n  durationLong4: '600ms',\n};\n\n","import { css } from 'lit';\nimport { lightColorScheme, darkColorScheme, M3ColorScheme } from './colors.js';\nimport { typographyTokens } from './typography.js';\nimport { elevationTokens } from './elevation.js';\nimport { shapeTokens } from './shape.js';\nimport { motionTokens } from './motion.js';\n\nexport const themeStyles = css`\n  :root, :host {\n    /* Color Tokens - Default Light */\n    --md-sys-color-primary: ${css([lightColorScheme.primary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-primary: ${css([lightColorScheme.onPrimary] as unknown as TemplateStringsArray)};\n    --md-sys-color-primary-container: ${css([lightColorScheme.primaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-primary-container: ${css([lightColorScheme.onPrimaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-secondary: ${css([lightColorScheme.secondary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-secondary: ${css([lightColorScheme.onSecondary] as unknown as TemplateStringsArray)};\n    --md-sys-color-secondary-container: ${css([lightColorScheme.secondaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-secondary-container: ${css([lightColorScheme.onSecondaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-tertiary: ${css([lightColorScheme.tertiary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-tertiary: ${css([lightColorScheme.onTertiary] as unknown as TemplateStringsArray)};\n    --md-sys-color-tertiary-container: ${css([lightColorScheme.tertiaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-tertiary-container: ${css([lightColorScheme.onTertiaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-error: ${css([lightColorScheme.error] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-error: ${css([lightColorScheme.onError] as unknown as TemplateStringsArray)};\n    --md-sys-color-error-container: ${css([lightColorScheme.errorContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-error-container: ${css([lightColorScheme.onErrorContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-background: ${css([lightColorScheme.background] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-background: ${css([lightColorScheme.onBackground] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface: ${css([lightColorScheme.surface] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-surface: ${css([lightColorScheme.onSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-variant: ${css([lightColorScheme.surfaceVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-surface-variant: ${css([lightColorScheme.onSurfaceVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-outline: ${css([lightColorScheme.outline] as unknown as TemplateStringsArray)};\n    --md-sys-color-outline-variant: ${css([lightColorScheme.outlineVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-lowest: ${css([lightColorScheme.surfaceContainerLowest] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-low: ${css([lightColorScheme.surfaceContainerLow] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container: ${css([lightColorScheme.surfaceContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-high: ${css([lightColorScheme.surfaceContainerHigh] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-highest: ${css([lightColorScheme.surfaceContainerHighest] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-surface: ${css([lightColorScheme.inverseSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-on-surface: ${css([lightColorScheme.inverseOnSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-primary: ${css([lightColorScheme.inversePrimary] as unknown as TemplateStringsArray)};\n    --md-sys-color-scrim: ${css([lightColorScheme.scrim] as unknown as TemplateStringsArray)};\n\n    /* Typography */\n    --md-sys-typescale-font-family: ${css([typographyTokens.fontFamily] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-body-large-size: ${css([typographyTokens.bodyLarge.size] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-body-large-line-height: ${css([typographyTokens.bodyLarge.lineHeight] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-body-medium-size: ${css([typographyTokens.bodyMedium.size] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-label-large-size: ${css([typographyTokens.labelLarge.size] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-title-medium-size: ${css([typographyTokens.titleMedium.size] as unknown as TemplateStringsArray)};\n\n    /* Elevation */\n    --md-sys-elevation-level0: ${css([elevationTokens.level0] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level1: ${css([elevationTokens.level1] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level2: ${css([elevationTokens.level2] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level3: ${css([elevationTokens.level3] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level4: ${css([elevationTokens.level4] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level5: ${css([elevationTokens.level5] as unknown as TemplateStringsArray)};\n\n    /* Shape */\n    --md-sys-shape-corner-none: ${css([shapeTokens.cornerNone] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-extra-small: ${css([shapeTokens.cornerExtraSmall] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-small: ${css([shapeTokens.cornerSmall] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-medium: ${css([shapeTokens.cornerMedium] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-large: ${css([shapeTokens.cornerLarge] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-extra-large: ${css([shapeTokens.cornerExtraLarge] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-full: ${css([shapeTokens.cornerFull] as unknown as TemplateStringsArray)};\n\n    /* Motion */\n    --md-sys-motion-easing-standard: ${css([motionTokens.easingStandard] as unknown as TemplateStringsArray)};\n    --md-sys-motion-duration-short: ${css([motionTokens.durationShort2] as unknown as TemplateStringsArray)};\n    --md-sys-motion-duration-medium: ${css([motionTokens.durationMedium2] as unknown as TemplateStringsArray)};\n    --md-sys-motion-duration-long: ${css([motionTokens.durationLong2] as unknown as TemplateStringsArray)};\n\n    /* State Layer Opacities */\n    --md-sys-state-hover-opacity: 0.08;\n    --md-sys-state-focus-opacity: 0.12;\n    --md-sys-state-pressed-opacity: 0.12;\n    --md-sys-state-dragged-opacity: 0.16;\n  }\n\n  [data-theme='dark'] {\n    --md-sys-color-primary: ${css([darkColorScheme.primary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-primary: ${css([darkColorScheme.onPrimary] as unknown as TemplateStringsArray)};\n    --md-sys-color-primary-container: ${css([darkColorScheme.primaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-primary-container: ${css([darkColorScheme.onPrimaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-secondary: ${css([darkColorScheme.secondary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-secondary: ${css([darkColorScheme.onSecondary] as unknown as TemplateStringsArray)};\n    --md-sys-color-secondary-container: ${css([darkColorScheme.secondaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-secondary-container: ${css([darkColorScheme.onSecondaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-tertiary: ${css([darkColorScheme.tertiary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-tertiary: ${css([darkColorScheme.onTertiary] as unknown as TemplateStringsArray)};\n    --md-sys-color-tertiary-container: ${css([darkColorScheme.tertiaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-tertiary-container: ${css([darkColorScheme.onTertiaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-error: ${css([darkColorScheme.error] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-error: ${css([darkColorScheme.onError] as unknown as TemplateStringsArray)};\n    --md-sys-color-error-container: ${css([darkColorScheme.errorContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-error-container: ${css([darkColorScheme.onErrorContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-background: ${css([darkColorScheme.background] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-background: ${css([darkColorScheme.onBackground] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface: ${css([darkColorScheme.surface] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-surface: ${css([darkColorScheme.onSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-variant: ${css([darkColorScheme.surfaceVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-surface-variant: ${css([darkColorScheme.onSurfaceVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-outline: ${css([darkColorScheme.outline] as unknown as TemplateStringsArray)};\n    --md-sys-color-outline-variant: ${css([darkColorScheme.outlineVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-lowest: ${css([darkColorScheme.surfaceContainerLowest] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-low: ${css([darkColorScheme.surfaceContainerLow] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container: ${css([darkColorScheme.surfaceContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-high: ${css([darkColorScheme.surfaceContainerHigh] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-highest: ${css([darkColorScheme.surfaceContainerHighest] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-surface: ${css([darkColorScheme.inverseSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-on-surface: ${css([darkColorScheme.inverseOnSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-primary: ${css([darkColorScheme.inversePrimary] as unknown as TemplateStringsArray)};\n    --md-sys-color-scrim: ${css([darkColorScheme.scrim] as unknown as TemplateStringsArray)};\n  }\n`;\n\nexport function applyTheme(\n  theme: Partial<M3ColorScheme>,\n  target: HTMLElement = document.documentElement\n): void {\n  for (const [key, value] of Object.entries(theme)) {\n    if (value) {\n      const kebab = key.replace(/([A-Z])/g, '-$1').toLowerCase();\n      target.style.setProperty(`--md-sys-color-${kebab}`, value);\n    }\n  }\n}\n\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/tokens/palette-generator.ts","../../src/tokens/colors.ts","../../src/tokens/typography.ts","../../src/tokens/elevation.ts","../../src/tokens/shape.ts","../../src/tokens/motion.ts","../../src/tokens/theme.css.ts"],"sourcesContent":["import type { M3ColorScheme } from './colors.js';\nimport { colorSchemeToCssVariables } from './colors.js';\n\n\n/**\n * Converts a hex color string (#RGB or #RRGGBB) to HSL values [h, s, l].\n * h in [0, 360], s in [0, 100], l in [0, 100].\n */\nexport function hexToHsl(hex: string): [number, number, number] {\n  let c = hex.replace('#', '').trim();\n  if (c.length === 3) {\n    c = c.split('').map(x => x + x).join('');\n  }\n  const num = parseInt(c, 16);\n  if (isNaN(num)) {\n    return [0, 0, 0];\n  }\n  const r = ((num >> 16) & 255) / 255;\n  const g = ((num >> 8) & 255) / 255;\n  const b = (num & 255) / 255;\n\n  const max = Math.max(r, g, b);\n  const min = Math.min(r, g, b);\n  let h = 0;\n  let s = 0;\n  const l = (max + min) / 2;\n\n  if (max !== min) {\n    const d = max - min;\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n    switch (max) {\n      case r:\n        h = (g - b) / d + (g < b ? 6 : 0);\n        break;\n      case g:\n        h = (b - r) / d + 2;\n        break;\n      case b:\n        h = (r - g) / d + 4;\n        break;\n    }\n    h /= 6;\n  }\n\n  return [Math.round(h * 360), Math.round(s * 100), Math.round(l * 100)];\n}\n\n/**\n * Converts HSL values to a hex color string (#RRGGBB).\n */\nexport function hslToHex(h: number, s: number, l: number): string {\n  const normS = Math.max(0, Math.min(100, s)) / 100;\n  const normL = Math.max(0, Math.min(100, l)) / 100;\n  const a = normS * Math.min(normL, 1 - normL);\n  const f = (n: number) => {\n    const k = (n + (h % 360) / 30) % 12;\n    const color = normL - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);\n    return Math.round(255 * color).toString(16).padStart(2, '0');\n  };\n  return `#${f(0)}${f(8)}${f(4)}`.toUpperCase();\n}\n\n/**\n * Converts a hex color string to RGB values [r, g, b].\n */\nexport function hexToRgb(hex: string): [number, number, number] {\n  let c = hex.replace('#', '').trim();\n  if (c.length === 3) {\n    c = c.split('').map(x => x + x).join('');\n  }\n  const num = parseInt(c, 16);\n  if (isNaN(num)) return [0, 0, 0];\n  return [(num >> 16) & 255, (num >> 8) & 255, num & 255];\n}\n\n/**\n * Normalizes a hex color string to #RRGGBB uppercase format.\n */\nexport function normalizeHex(hex: string): string {\n  let c = hex.replace('#', '').trim();\n  if (c.length === 3) {\n    c = c.split('').map(x => x + x).join('');\n  }\n  return `#${c.padStart(6, '0').slice(0, 6)}`.toUpperCase();\n}\n\n/**\n * Automatically derives a full 37-token M3 color scheme (light or dark) from a seed hex color.\n */\nexport function generateColorScheme(sourceColorHex: string, isDark: boolean): M3ColorScheme {\n  const normalizedHex = normalizeHex(sourceColorHex);\n  const [h, s] = hexToHsl(normalizedHex);\n\n  if (isDark) {\n    return {\n      primary: hslToHex(h, Math.max(s, 60), 80),\n      onPrimary: hslToHex(h, Math.max(s, 70), 20),\n      primaryContainer: hslToHex(h, Math.max(s, 60), 32),\n      onPrimaryContainer: hslToHex(h, Math.max(s, 60), 90),\n      secondary: hslToHex((h + 10) % 360, 25, 75),\n      onSecondary: hslToHex((h + 10) % 360, 30, 20),\n      secondaryContainer: hslToHex((h + 10) % 360, 30, 32),\n      onSecondaryContainer: hslToHex((h + 10) % 360, 35, 92),\n      tertiary: hslToHex((h + 60) % 360, 40, 80),\n      onTertiary: hslToHex((h + 60) % 360, 45, 20),\n      tertiaryContainer: hslToHex((h + 60) % 360, 45, 32),\n      onTertiaryContainer: hslToHex((h + 60) % 360, 50, 92),\n      error: '#F2B8B5',\n      onError: '#601410',\n      errorContainer: '#8C1D18',\n      onErrorContainer: '#F9DEDC',\n      background: '#141218',\n      onBackground: '#E6E0E9',\n      surface: '#141218',\n      onSurface: '#E6E0E9',\n      surfaceVariant: '#49454F',\n      onSurfaceVariant: '#CAC4D0',\n      outline: '#938F99',\n      outlineVariant: '#49454F',\n      shadow: '#000000',\n      scrim: 'rgba(0, 0, 0, 0.32)',\n      inverseSurface: '#E6E0E9',\n      inverseOnSurface: '#313033',\n      inversePrimary: normalizedHex,\n      surfaceDim: '#141218',\n      surfaceBright: '#3B383E',\n      surfaceContainerLowest: '#0F0D13',\n      surfaceContainerLow: '#1D1B20',\n      surfaceContainer: '#211F26',\n      surfaceContainerHigh: '#2B2930',\n      surfaceContainerHighest: '#36343B',\n    };\n  }\n\n  return {\n    primary: normalizedHex,\n    onPrimary: '#FFFFFF',\n    primaryContainer: hslToHex(h, Math.max(s, 55), 90),\n    onPrimaryContainer: hslToHex(h, Math.max(s, 70), 16),\n    secondary: hslToHex((h + 10) % 360, 25, 42),\n    onSecondary: '#FFFFFF',\n    secondaryContainer: hslToHex((h + 10) % 360, 35, 92),\n    onSecondaryContainer: hslToHex((h + 10) % 360, 40, 16),\n    tertiary: hslToHex((h + 60) % 360, 40, 42),\n    onTertiary: '#FFFFFF',\n    tertiaryContainer: hslToHex((h + 60) % 360, 50, 92),\n    onTertiaryContainer: hslToHex((h + 60) % 360, 55, 16),\n    error: '#B3261E',\n    onError: '#FFFFFF',\n    errorContainer: '#F9DEDC',\n    onErrorContainer: '#410E0B',\n    background: hslToHex(h, 15, 99),\n    onBackground: '#1D1B20',\n    surface: hslToHex(h, 15, 99),\n    onSurface: '#1D1B20',\n    surfaceVariant: hslToHex(h, 15, 92),\n    onSurfaceVariant: '#49454F',\n    outline: '#79747E',\n    outlineVariant: '#CAC4D0',\n    shadow: '#000000',\n    scrim: 'rgba(0, 0, 0, 0.32)',\n    inverseSurface: '#313033',\n    inverseOnSurface: '#F4EFF4',\n    inversePrimary: hslToHex(h, Math.max(s, 60), 80),\n    surfaceDim: hslToHex(h, 10, 88),\n    surfaceBright: hslToHex(h, 15, 99),\n    surfaceContainerLowest: '#FFFFFF',\n    surfaceContainerLow: hslToHex(h, 12, 97),\n    surfaceContainer: hslToHex(h, 12, 95),\n    surfaceContainerHigh: hslToHex(h, 12, 92),\n    surfaceContainerHighest: hslToHex(h, 12, 90),\n  };\n}\n\nexport interface GeneratedTheme {\n  sourceColor: string;\n  light: M3ColorScheme;\n  dark: M3ColorScheme;\n  schemes: {\n    light: M3ColorScheme;\n    dark: M3ColorScheme;\n  };\n  cssVariables: {\n    light: Record<string, string>;\n    dark: Record<string, string>;\n  };\n  cssText: string;\n  apply: (options?: { dark?: boolean; target?: HTMLElement }) => void;\n}\n\n/**\n * Automatically derives full M3 light and dark CSS variable palettes from a single seed color.\n *\n * @param sourceColorHex - Seed hex color (e.g. '#6750A4' or '#006A6A')\n * @returns Complete M3 theme including light/dark color schemes, CSS variable records, and cssText stylesheet.\n */\nexport function generateTheme(sourceColorHex: string): GeneratedTheme {\n  const normalizedSource = normalizeHex(sourceColorHex);\n  const lightScheme = generateColorScheme(normalizedSource, false);\n  const darkScheme = generateColorScheme(normalizedSource, true);\n\n  const lightVariables = colorSchemeToCssVariables(lightScheme);\n  const darkVariables = colorSchemeToCssVariables(darkScheme);\n\n  const formatVariables = (vars: Record<string, string>, indent = '    ') =>\n    Object.entries(vars)\n      .map(([key, value]) => `${indent}${key}: ${value};`)\n      .join('\\n');\n\n  const cssText = `:root, :host {\\n${formatVariables(lightVariables)}\\n}\\n\\n[data-theme='dark'] {\\n${formatVariables(darkVariables)}\\n}`;\n\n  return {\n    sourceColor: normalizedSource,\n    light: lightScheme,\n    dark: darkScheme,\n    schemes: {\n      light: lightScheme,\n      dark: darkScheme,\n    },\n    cssVariables: {\n      light: lightVariables,\n      dark: darkVariables,\n    },\n    cssText,\n    apply(options?: { dark?: boolean; target?: HTMLElement }) {\n      const target = options?.target ?? (typeof document !== 'undefined' ? document.documentElement : undefined);\n      if (!target) return;\n      const isDark = options?.dark ?? target.getAttribute('data-theme') === 'dark';\n      const scheme = isDark ? darkScheme : lightScheme;\n      for (const [key, value] of Object.entries(scheme)) {\n        if (value) {\n          const kebab = key.replace(/([A-Z])/g, '-$1').toLowerCase();\n          target.style.setProperty(`--md-sys-color-${kebab}`, value);\n        }\n      }\n    },\n  };\n}\n","export interface M3ColorScheme {\n  primary: string;\n  onPrimary: string;\n  primaryContainer: string;\n  onPrimaryContainer: string;\n  secondary: string;\n  onSecondary: string;\n  secondaryContainer: string;\n  onSecondaryContainer: string;\n  tertiary: string;\n  onTertiary: string;\n  tertiaryContainer: string;\n  onTertiaryContainer: string;\n  error: string;\n  onError: string;\n  errorContainer: string;\n  onErrorContainer: string;\n  background: string;\n  onBackground: string;\n  surface: string;\n  onSurface: string;\n  surfaceVariant: string;\n  onSurfaceVariant: string;\n  outline: string;\n  outlineVariant: string;\n  shadow: string;\n  scrim: string;\n  inverseSurface: string;\n  inverseOnSurface: string;\n  inversePrimary: string;\n  surfaceDim: string;\n  surfaceBright: string;\n  surfaceContainerLowest: string;\n  surfaceContainerLow: string;\n  surfaceContainer: string;\n  surfaceContainerHigh: string;\n  surfaceContainerHighest: string;\n}\n\nexport const lightColorScheme: M3ColorScheme = {\n  primary: '#6750A4',\n  onPrimary: '#FFFFFF',\n  primaryContainer: '#EADDFF',\n  onPrimaryContainer: '#21005D',\n  secondary: '#625B71',\n  onSecondary: '#FFFFFF',\n  secondaryContainer: '#E8DEF8',\n  onSecondaryContainer: '#1D192B',\n  tertiary: '#7D5260',\n  onTertiary: '#FFFFFF',\n  tertiaryContainer: '#FFD8E4',\n  onTertiaryContainer: '#31111D',\n  error: '#B3261E',\n  onError: '#FFFFFF',\n  errorContainer: '#F9DEDC',\n  onErrorContainer: '#410E0B',\n  background: '#FEF7FF',\n  onBackground: '#1D1B20',\n  surface: '#FEF7FF',\n  onSurface: '#1D1B20',\n  surfaceVariant: '#E7E0EC',\n  onSurfaceVariant: '#49454F',\n  outline: '#79747E',\n  outlineVariant: '#CAC4D0',\n  shadow: '#000000',\n  scrim: 'rgba(0, 0, 0, 0.32)',\n  inverseSurface: '#313033',\n  inverseOnSurface: '#F4EFF4',\n  inversePrimary: '#D0BCFF',\n  surfaceDim: '#DED8E1',\n  surfaceBright: '#FEF7FF',\n  surfaceContainerLowest: '#FFFFFF',\n  surfaceContainerLow: '#F7F2FA',\n  surfaceContainer: '#F3EDF7',\n  surfaceContainerHigh: '#ECE6F0',\n  surfaceContainerHighest: '#E6E0E9',\n};\n\nexport const darkColorScheme: M3ColorScheme = {\n  primary: '#D0BCFF',\n  onPrimary: '#381E72',\n  primaryContainer: '#4F378B',\n  onPrimaryContainer: '#EADDFF',\n  secondary: '#CCC2DC',\n  onSecondary: '#332D41',\n  secondaryContainer: '#4A4458',\n  onSecondaryContainer: '#E8DEF8',\n  tertiary: '#EFB8C8',\n  onTertiary: '#492532',\n  tertiaryContainer: '#633B48',\n  onTertiaryContainer: '#FFD8E4',\n  error: '#F2B8B5',\n  onError: '#601410',\n  errorContainer: '#8C1D18',\n  onErrorContainer: '#F9DEDC',\n  background: '#141218',\n  onBackground: '#E6E0E9',\n  surface: '#141218',\n  onSurface: '#E6E0E9',\n  surfaceVariant: '#49454F',\n  onSurfaceVariant: '#CAC4D0',\n  outline: '#938F99',\n  outlineVariant: '#49454F',\n  shadow: '#000000',\n  scrim: 'rgba(0, 0, 0, 0.32)',\n  inverseSurface: '#E6E0E9',\n  inverseOnSurface: '#313033',\n  inversePrimary: '#6750A4',\n  surfaceDim: '#141218',\n  surfaceBright: '#3B383E',\n  surfaceContainerLowest: '#0F0D13',\n  surfaceContainerLow: '#1D1B20',\n  surfaceContainer: '#211F26',\n  surfaceContainerHigh: '#2B2930',\n  surfaceContainerHighest: '#36343B',\n};\n\nexport function colorSchemeToCssVariables(scheme: Partial<M3ColorScheme>): Record<string, string> {\n  const vars: Record<string, string> = {};\n  for (const [key, value] of Object.entries(scheme)) {\n    const kebab = key.replace(/([A-Z])/g, '-$1').toLowerCase();\n    vars[`--md-sys-color-${kebab}`] = value;\n  }\n  return vars;\n}\n\nexport * from './palette-generator.js';\n\n\n","export interface M3TypographyStyle {\n  fontFamily: string;\n  weight: number | string;\n  size: string;\n  lineHeight: string;\n  letterSpacing: string;\n}\n\nexport const typographyTokens = {\n  fontFamily: \"'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif\",\n  displayLarge: { size: '57px', lineHeight: '64px', letterSpacing: '-0.25px', weight: 400 },\n  displayMedium: { size: '45px', lineHeight: '52px', letterSpacing: '0px', weight: 400 },\n  displaySmall: { size: '36px', lineHeight: '44px', letterSpacing: '0px', weight: 400 },\n  headlineLarge: { size: '32px', lineHeight: '40px', letterSpacing: '0px', weight: 400 },\n  headlineMedium: { size: '28px', lineHeight: '36px', letterSpacing: '0px', weight: 400 },\n  headlineSmall: { size: '24px', lineHeight: '32px', letterSpacing: '0px', weight: 400 },\n  titleLarge: { size: '22px', lineHeight: '28px', letterSpacing: '0px', weight: 400 },\n  titleMedium: { size: '16px', lineHeight: '24px', letterSpacing: '0.15px', weight: 500 },\n  titleSmall: { size: '14px', lineHeight: '20px', letterSpacing: '0.1px', weight: 500 },\n  bodyLarge: { size: '16px', lineHeight: '24px', letterSpacing: '0.5px', weight: 400 },\n  bodyMedium: { size: '14px', lineHeight: '20px', letterSpacing: '0.25px', weight: 400 },\n  bodySmall: { size: '12px', lineHeight: '16px', letterSpacing: '0.4px', weight: 400 },\n  labelLarge: { size: '14px', lineHeight: '20px', letterSpacing: '0.1px', weight: 500 },\n  labelMedium: { size: '12px', lineHeight: '16px', letterSpacing: '0.5px', weight: 500 },\n  labelSmall: { size: '11px', lineHeight: '16px', letterSpacing: '0.5px', weight: 500 },\n};\n\n","export const elevationTokens = {\n  level0: 'none',\n  level1: '0px 1px 3px 1px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.30)',\n  level2: '0px 2px 6px 2px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.30)',\n  level3: '0px 1px 3px 0px rgba(0, 0, 0, 0.30), 0px 4px 8px 3px rgba(0, 0, 0, 0.15)',\n  level4: '0px 2px 3px 0px rgba(0, 0, 0, 0.30), 0px 6px 10px 4px rgba(0, 0, 0, 0.15)',\n  level5: '0px 4px 4px 0px rgba(0, 0, 0, 0.30), 0px 8px 12px 6px rgba(0, 0, 0, 0.15)',\n};\n\n","export const shapeTokens = {\n  cornerNone: '0px',\n  cornerExtraSmall: '4px',\n  cornerSmall: '8px',\n  cornerMedium: '12px',\n  cornerLarge: '16px',\n  cornerExtraLarge: '28px',\n  cornerFull: '9999px',\n};\n\n","export const motionTokens = {\n  easingStandard: 'cubic-bezier(0.2, 0, 0, 1)',\n  easingStandardDecelerate: 'cubic-bezier(0, 0, 0, 1)',\n  easingStandardAccelerate: 'cubic-bezier(0.3, 0, 1, 1)',\n  easingEmphasized: 'cubic-bezier(0.2, 0, 0, 1)',\n  easingEmphasizedDecelerate: 'cubic-bezier(0.05, 0.7, 0.1, 1)',\n  easingEmphasizedAccelerate: 'cubic-bezier(0.3, 0, 0.8, 0.15)',\n  \n  durationShort1: '50ms',\n  durationShort2: '100ms',\n  durationShort3: '150ms',\n  durationShort4: '200ms',\n  durationMedium1: '250ms',\n  durationMedium2: '300ms',\n  durationMedium3: '350ms',\n  durationMedium4: '400ms',\n  durationLong1: '450ms',\n  durationLong2: '500ms',\n  durationLong3: '550ms',\n  durationLong4: '600ms',\n};\n\n","import { css } from 'lit';\nimport { lightColorScheme, darkColorScheme, M3ColorScheme } from './colors.js';\nimport { typographyTokens } from './typography.js';\nimport { elevationTokens } from './elevation.js';\nimport { shapeTokens } from './shape.js';\nimport { motionTokens } from './motion.js';\n\nexport const themeStyles = css`\n  :root, :host {\n    /* Color Tokens - Default Light */\n    --md-sys-color-primary: ${css([lightColorScheme.primary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-primary: ${css([lightColorScheme.onPrimary] as unknown as TemplateStringsArray)};\n    --md-sys-color-primary-container: ${css([lightColorScheme.primaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-primary-container: ${css([lightColorScheme.onPrimaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-secondary: ${css([lightColorScheme.secondary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-secondary: ${css([lightColorScheme.onSecondary] as unknown as TemplateStringsArray)};\n    --md-sys-color-secondary-container: ${css([lightColorScheme.secondaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-secondary-container: ${css([lightColorScheme.onSecondaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-tertiary: ${css([lightColorScheme.tertiary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-tertiary: ${css([lightColorScheme.onTertiary] as unknown as TemplateStringsArray)};\n    --md-sys-color-tertiary-container: ${css([lightColorScheme.tertiaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-tertiary-container: ${css([lightColorScheme.onTertiaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-error: ${css([lightColorScheme.error] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-error: ${css([lightColorScheme.onError] as unknown as TemplateStringsArray)};\n    --md-sys-color-error-container: ${css([lightColorScheme.errorContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-error-container: ${css([lightColorScheme.onErrorContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-background: ${css([lightColorScheme.background] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-background: ${css([lightColorScheme.onBackground] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface: ${css([lightColorScheme.surface] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-surface: ${css([lightColorScheme.onSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-variant: ${css([lightColorScheme.surfaceVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-surface-variant: ${css([lightColorScheme.onSurfaceVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-outline: ${css([lightColorScheme.outline] as unknown as TemplateStringsArray)};\n    --md-sys-color-outline-variant: ${css([lightColorScheme.outlineVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-lowest: ${css([lightColorScheme.surfaceContainerLowest] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-low: ${css([lightColorScheme.surfaceContainerLow] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container: ${css([lightColorScheme.surfaceContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-high: ${css([lightColorScheme.surfaceContainerHigh] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-highest: ${css([lightColorScheme.surfaceContainerHighest] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-surface: ${css([lightColorScheme.inverseSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-on-surface: ${css([lightColorScheme.inverseOnSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-primary: ${css([lightColorScheme.inversePrimary] as unknown as TemplateStringsArray)};\n    --md-sys-color-scrim: ${css([lightColorScheme.scrim] as unknown as TemplateStringsArray)};\n\n    /* Typography */\n    --md-sys-typescale-font-family: ${css([typographyTokens.fontFamily] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-body-large-size: ${css([typographyTokens.bodyLarge.size] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-body-large-line-height: ${css([typographyTokens.bodyLarge.lineHeight] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-body-medium-size: ${css([typographyTokens.bodyMedium.size] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-label-large-size: ${css([typographyTokens.labelLarge.size] as unknown as TemplateStringsArray)};\n    --md-sys-typescale-title-medium-size: ${css([typographyTokens.titleMedium.size] as unknown as TemplateStringsArray)};\n\n    /* Elevation */\n    --md-sys-elevation-level0: ${css([elevationTokens.level0] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level1: ${css([elevationTokens.level1] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level2: ${css([elevationTokens.level2] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level3: ${css([elevationTokens.level3] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level4: ${css([elevationTokens.level4] as unknown as TemplateStringsArray)};\n    --md-sys-elevation-level5: ${css([elevationTokens.level5] as unknown as TemplateStringsArray)};\n\n    /* Shape */\n    --md-sys-shape-corner-none: ${css([shapeTokens.cornerNone] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-extra-small: ${css([shapeTokens.cornerExtraSmall] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-small: ${css([shapeTokens.cornerSmall] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-medium: ${css([shapeTokens.cornerMedium] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-large: ${css([shapeTokens.cornerLarge] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-extra-large: ${css([shapeTokens.cornerExtraLarge] as unknown as TemplateStringsArray)};\n    --md-sys-shape-corner-full: ${css([shapeTokens.cornerFull] as unknown as TemplateStringsArray)};\n\n    /* Motion */\n    --md-sys-motion-easing-standard: ${css([motionTokens.easingStandard] as unknown as TemplateStringsArray)};\n    --md-sys-motion-duration-short: ${css([motionTokens.durationShort2] as unknown as TemplateStringsArray)};\n    --md-sys-motion-duration-medium: ${css([motionTokens.durationMedium2] as unknown as TemplateStringsArray)};\n    --md-sys-motion-duration-long: ${css([motionTokens.durationLong2] as unknown as TemplateStringsArray)};\n\n    /* State Layer Opacities */\n    --md-sys-state-hover-opacity: 0.08;\n    --md-sys-state-focus-opacity: 0.12;\n    --md-sys-state-pressed-opacity: 0.12;\n    --md-sys-state-dragged-opacity: 0.16;\n  }\n\n  [data-theme='dark'] {\n    --md-sys-color-primary: ${css([darkColorScheme.primary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-primary: ${css([darkColorScheme.onPrimary] as unknown as TemplateStringsArray)};\n    --md-sys-color-primary-container: ${css([darkColorScheme.primaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-primary-container: ${css([darkColorScheme.onPrimaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-secondary: ${css([darkColorScheme.secondary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-secondary: ${css([darkColorScheme.onSecondary] as unknown as TemplateStringsArray)};\n    --md-sys-color-secondary-container: ${css([darkColorScheme.secondaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-secondary-container: ${css([darkColorScheme.onSecondaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-tertiary: ${css([darkColorScheme.tertiary] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-tertiary: ${css([darkColorScheme.onTertiary] as unknown as TemplateStringsArray)};\n    --md-sys-color-tertiary-container: ${css([darkColorScheme.tertiaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-tertiary-container: ${css([darkColorScheme.onTertiaryContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-error: ${css([darkColorScheme.error] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-error: ${css([darkColorScheme.onError] as unknown as TemplateStringsArray)};\n    --md-sys-color-error-container: ${css([darkColorScheme.errorContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-error-container: ${css([darkColorScheme.onErrorContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-background: ${css([darkColorScheme.background] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-background: ${css([darkColorScheme.onBackground] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface: ${css([darkColorScheme.surface] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-surface: ${css([darkColorScheme.onSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-variant: ${css([darkColorScheme.surfaceVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-on-surface-variant: ${css([darkColorScheme.onSurfaceVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-outline: ${css([darkColorScheme.outline] as unknown as TemplateStringsArray)};\n    --md-sys-color-outline-variant: ${css([darkColorScheme.outlineVariant] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-lowest: ${css([darkColorScheme.surfaceContainerLowest] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-low: ${css([darkColorScheme.surfaceContainerLow] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container: ${css([darkColorScheme.surfaceContainer] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-high: ${css([darkColorScheme.surfaceContainerHigh] as unknown as TemplateStringsArray)};\n    --md-sys-color-surface-container-highest: ${css([darkColorScheme.surfaceContainerHighest] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-surface: ${css([darkColorScheme.inverseSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-on-surface: ${css([darkColorScheme.inverseOnSurface] as unknown as TemplateStringsArray)};\n    --md-sys-color-inverse-primary: ${css([darkColorScheme.inversePrimary] as unknown as TemplateStringsArray)};\n    --md-sys-color-scrim: ${css([darkColorScheme.scrim] as unknown as TemplateStringsArray)};\n  }\n`;\n\nexport function applyTheme(\n  theme: Partial<M3ColorScheme>,\n  target: HTMLElement = document.documentElement\n): void {\n  for (const [key, value] of Object.entries(theme)) {\n    if (value) {\n      const kebab = key.replace(/([A-Z])/g, '-$1').toLowerCase();\n      target.style.setProperty(`--md-sys-color-${kebab}`, value);\n    }\n  }\n}\n\n"],"mappings":"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"}

package/llms.txt

@@ -162,18 +162,36 @@ Configure tokens globally on `:root` or scope them to a container. Dark mode can
 
 ### TypeScript Theme Helper API
 
-The `@francofantomius/material-components/theme` module provides utilities for dynamic runtime palette assignment:
+The `@francofantomius/material-components/theme` module provides utilities for dynamic runtime palette assignment and automatic theme generation:
 
 ```typescript
-import { applyTheme, darkColorScheme, lightColorScheme } from '@francofantomius/material-components/theme';
-
-// Switch to Dark Color Scheme
+import {
+  generateTheme,
+  generateColorScheme,
+  applyTheme,
+  darkColorScheme,
+  lightColorScheme,
+} from '@francofantomius/material-components/theme';
+
+// 1. Automatically derive complete M3 light and dark themes from any single seed color:
+const theme = generateTheme('#006A6A');
+
+// Apply to document (or any element) with light or dark mode:
+theme.apply(); // applies light or dark based on data-theme attribute
+theme.apply({ dark: true }); // forces dark mode
+theme.apply({ target: myContainer }); // scopes theme to container element
+
+// Access generated 37-token schemes and CSS variables:
+console.log(theme.light.primary); // e.g. '#006A6A'
+console.log(theme.dark.primary);
+console.log(theme.cssVariables.light); // { '--md-sys-color-primary': '#006A6A', ... }
+console.log(theme.cssText); // Ready-to-inject CSS string
+
+// 2. Predefined color schemes:
 applyTheme(darkColorScheme);
-
-// Switch back to Light Color Scheme
 applyTheme(lightColorScheme);
 
-// Apply Custom Brand Colors
+// 3. Custom brand color overrides:
 applyTheme({
   primary: '#006A60',
   onPrimary: '#FFFFFF',
@@ -186,7 +204,7 @@ applyTheme({
 
 ## Form Integration (FACE)
 
-Form controls (`<md-text-field>`, `<md-checkbox>`, `<md-switch>`, `<md-radio>`) are Form-Associated Custom Elements. They automatically participate in standard HTML forms and `FormData`.
+Form controls (`<md-text-field>`, `<md-checkbox>`, `<md-switch>`, `<md-radio>`, `<md-slider>`, `<md-date-picker>`, `<md-time-picker>`) are Form-Associated Custom Elements (FACE). They automatically participate in standard HTML forms, `FormData`, constraint validation (`required`, `min`, `max`, `checkValidity()`, `reportValidity()`), and form resets without manual JavaScript syncing.
 
 ### HTML Form Example
 
@@ -206,6 +224,41 @@ Form controls (`<md-text-field>`, `<md-checkbox>`, `<md-switch>`, `<md-radio>`)
     required
   ></md-text-field>
 
+  <!-- Slider input participating in form submission -->
+  <md-slider
+    name="budget"
+    min="0"
+    max="1000"
+    step="50"
+    value="250"
+    labeled
+  ></md-slider>
+
+  <!-- Dual-thumb range slider submitting two form values -->
+  <md-slider
+    range
+    name-start="min_price"
+    name-end="max_price"
+    value-start="100"
+    value-end="500"
+  ></md-slider>
+
+  <!-- Date picker participating in form submission -->
+  <md-date-picker
+    name="event_date"
+    label="Event Date"
+    required
+  ></md-date-picker>
+
+  <!-- Time picker with constraint validation -->
+  <md-time-picker
+    name="arrival_time"
+    format="24h"
+    min="08:00"
+    max="18:00"
+    required
+  ></md-time-picker>
+
   <md-checkbox name="newsletter" checked>
     Receive monthly newsletter
   </md-checkbox>
@@ -219,6 +272,7 @@ Form controls (`<md-text-field>`, `<md-checkbox>`, `<md-switch>`, `<md-radio>`)
     <md-button type="submit" variant="filled">Submit Form</md-button>
   </div>
 </form>
+
 ```
 
 ### JavaScript Handling
@@ -841,6 +895,8 @@ const isEnabled = ref(true);
 | `leading-icon` | `string` | `''` | Leading Material Symbols icon name |
 | `trailing-icon` | `string` | `''` | Trailing Material Symbols icon name |
 | `disabled` | `boolean` | `false` | Disables user interaction |
+| `required` | `boolean` | `false` | Form validation required constraint |
+| `error` | `boolean` | `false` | Applies error visual styling |
 | `name` | `string` | `''` | HTML form input name |
 | `name-start` | `string` | `''` | HTML form input name for start value (range mode) |
 | `name-end` | `string` | `''` | HTML form input name for end value (range mode) |
@@ -911,9 +967,10 @@ const isEnabled = ref(true);
 | `compact` | `boolean` | `false` | Shorthand boolean attribute for compact / small navbar sizing |
 | `active` | `boolean` | `false` | Controls whether search view is expanded and showing suggestions |
 | `suggestions` | `Array<string \| SearchSuggestion>` | `[]` | List of search suggestions with labels, supporting text, and icons |
-| `leading-icon` | `string` | `'search'` | Leading icon displayed when inactive |
+| `search-icon-position` | `'leading' \| 'trailing' \| 'left' \| 'right'` | `'leading'` | Position of search icon (`'leading'` / left, or `'trailing'` / right) |
+| `leading-icon` | `string` | `'search'` | Leading icon displayed when inactive (e.g. `'search'`, `'menu'`) |
 | `active-leading-icon` | `string` | `'arrow_back'` | Leading icon displayed when active |
-| `trailing-icon` | `string` | `''` | Optional trailing action icon |
+| `trailing-icon` | `string` | `''` | Optional trailing action icon (e.g. `'mic'`, `'search'`) |
 | `show-back-button` | `boolean` | `true` | Whether to show the back button in active mode |
 | `responsive` | `boolean` | `true` | Automatically switches to full-screen view and collapsed search icon on mobile (<= 768px) |
 | `collapse-on-mobile` | `boolean` | `true` | Collapses search bar into a compact search icon button on mobile screens when inactive |
@@ -921,27 +978,43 @@ const isEnabled = ref(true);
 | `disabled` | `boolean` | `false` | Disables user interaction |
 
 ##### Slots
-- `leading-icon`: Custom leading icon or button element.
-- `trailing-icon`: Custom trailing action buttons, avatar, or mic.
+- `leading` / `leading-icon`: Custom leading icon or navigation button element.
+- `trailing` / `trailing-icon`: Custom trailing action buttons, avatar, or mic.
 - `suggestions`: Custom slotted suggestions list.
 - `(default)`: Additional content rendered inside active search surface.
 
 ##### Events
 - `input`: Fired as user types (`detail: { value: string }`).
 - `change`: Fired on committed input change (`detail: { value: string }`).
-- `search`: Fired when user presses Enter or selects a suggestion (`detail: { value: string, suggestion?: object }`).
+- `search`: Fired when user presses Enter or clicks the search button (`detail: { value: string, suggestion?: object }`).
+- `leading-icon-click`: Fired when custom leading button (e.g. menu) is clicked (`detail: { icon: string }`).
+- `trailing-icon-click`: Fired when trailing icon button is clicked (`detail: { icon: string }`).
 - `active-change`: Fired when search bar expands/collapses (`detail: { active: boolean }`).
 - `suggestion-select`: Fired when a suggestion is selected (`detail: { suggestion: object, value: string, index: number }`).
 - `clear`: Fired when search value is cleared.
 
 ##### Code Example
 ```html
+<!-- Standard Search Bar -->
 <md-search-bar
   id="demo-search-bar"
   placeholder="Search destinations, hotels, flights..."
   trailing-icon="mic"
 ></md-search-bar>
 
+<!-- Search Icon on the Right -->
+<md-search-bar
+  placeholder="Search products..."
+  search-icon-position="right"
+></md-search-bar>
+
+<!-- Hamburger Menu Button on Left and Search Icon on Right -->
+<md-search-bar
+  placeholder="Search apps and files..."
+  leading-icon="menu"
+  search-icon-position="right"
+></md-search-bar>
+
 <!-- Custom Slotted Content in Active State -->
 <md-search-bar placeholder="Search files & documents">
   <div style="padding: 12px 16px;">
@@ -972,9 +1045,14 @@ const isEnabled = ref(true);
 | `headline` | `string` | `'Select time'` | Header headline text |
 | `auto-switch-to-minute` | `boolean` | `true` | Automatically transitions active field from hour to minute on dial |
 | `disabled` | `boolean` | `false` | Disables user interaction |
+| `min` | `string` | `''` | Minimum time constraint (e.g. `'09:00'` or `'09:00 AM'`) |
+| `max` | `string` | `''` | Maximum time constraint (e.g. `'17:00'` or `'05:00 PM'`) |
+| `error` | `boolean` | `false` | Applies error visual styling |
+| `error-text` | `string` | `''` | Validation error message |
 | `name` | `string` | `''` | HTML form input name (FACE) |
 | `required` | `boolean` | `false` | Form validation required constraint |
 
+
 ##### Methods
 - `showModal()`: Opens the time picker as a modal dialog.
 - `show()`: Opens the time picker.
@@ -1036,6 +1114,9 @@ const isEnabled = ref(true);
 | `error-text` | `string` | `''` | Validation error message |
 | `supporting-text` | `string` | `''` | Helper text below the date picker |
 | `name` | `string` | `''` | HTML form input name (FACE) |
+| `name-start` | `string` | `''` | HTML form input name for start date (range mode) |
+| `name-end` | `string` | `''` | HTML form input name for end date (range mode) |
+
 
 ##### Methods
 - `showModal()`: Opens the date picker as a modal dialog overlay.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@francofantomius/material-components",
-  "version": "1.1.2",
+  "version": "1.3.0",
   "description": "Reusable, accessible, and lightweight Material Design 3 Web Components built with Lit.",
   "repository": {
     "type": "git",
@@ -291,13 +291,13 @@
   },
   "scripts": {
     "dev": "vite",
-    "build": "tsc && vite build && node docs/generate.js && vite build --config vite.docs.config.ts && npm run analyze",
+    "build": "tsc && vite build && npm run analyze",
     "clean": "git clean -fdX",
-    "preview": "vite preview --config vite.docs.config.ts",
     "typecheck": "tsc --noEmit",
     "test": "vitest run",
     "test:watch": "vitest",
     "analyze": "cem analyze --litelement",
+    "build:example": "esbuild src/index.ts --bundle --format=iife --outfile=example.bundle.js",
     "prepublishOnly": "npm run typecheck && npm run test && npm run build"
   },
   "keywords": [
@@ -315,22 +315,11 @@
     "lit": "^3.3.3"
   },
   "devDependencies": {
-    "@custom-elements-manifest/analyzer": "^0.10.4",
-    "@typescript/typescript6": "^6.0.2",
+    "@custom-elements-manifest/analyzer": "^0.11.0",
     "esbuild": "^0.28.2",
-    "happy-dom": "^20.11.6",
+    "happy-dom": "^20.14.5",
     "typescript": "^7.0.2",
     "vite": "^8.2.2",
-    "vite-plugin-dts": "^5.0.3",
-    "vitest": "^4.1.11"
-  },
-  "allowScripts": {
-    "esbuild": true,
-    "happy-dom": true,
-    "typescript": true,
-    "vite": true,
-    "vite-plugin-dts": true,
-    "vitest": true,
-    "rs-module-lexer@2.8.0": true
+    "vitest": "^5.0.0"
   }
 }