@fragments-sdk/ui 0.14.0 → 0.15.1

package/dist/utils/seed-derivation.cjs

@@ -0,0 +1,449 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const PALETTES = {
+  // Stone - Muted cool neutrals (default, balanced)
+  stone: {
+    50: "#fafafa",
+    100: "#f4f4f5",
+    200: "#e4e4e7",
+    300: "#d4d4d8",
+    400: "#a1a1aa",
+    500: "#71717a",
+    600: "#52525b",
+    700: "#3f3f46",
+    800: "#27272a",
+    900: "#18181b",
+    950: "#09090b"
+  },
+  // Ice - Cool blue tones (professional, tech)
+  // Dark shades are muted for comfortable dark mode backgrounds
+  ice: {
+    50: "#f0f9ff",
+    100: "#e0f2fe",
+    200: "#bae6fd",
+    300: "#7dd3fc",
+    400: "#38bdf8",
+    500: "#0ea5e9",
+    600: "#0284c7",
+    700: "#0369a1",
+    800: "#0f2d3d",
+    // Darkened and desaturated for dark mode
+    900: "#0a1f2c",
+    // Darkened and desaturated for dark mode
+    950: "#06141c"
+    // Very dark blue-gray for dark mode bg
+  },
+  // Sand - Warm brown/terracotta tones (organic, earthy)
+  // Dark shades are muted for comfortable dark mode backgrounds
+  sand: {
+    50: "#fdf8f3",
+    100: "#f5ebe0",
+    200: "#e8d5c4",
+    300: "#d4b89c",
+    400: "#c19a6b",
+    500: "#a67c52",
+    600: "#8b5e34",
+    700: "#6f4518",
+    800: "#231a12",
+    // Darkened and desaturated for dark mode
+    900: "#181210",
+    // Darkened and desaturated for dark mode
+    950: "#0f0c09"
+    // Very dark warm gray for dark mode bg
+  },
+  // Earth - Green/olive tones (natural, growth)
+  // Dark shades are muted for comfortable dark mode backgrounds
+  earth: {
+    50: "#f5f7f2",
+    100: "#e8ede3",
+    200: "#d1dbc6",
+    300: "#b3c4a0",
+    400: "#8fa872",
+    500: "#6b8c4e",
+    600: "#517035",
+    700: "#3d5527",
+    800: "#1a2316",
+    // Darkened and desaturated for dark mode
+    900: "#121810",
+    // Darkened and desaturated for dark mode
+    950: "#0a0f08"
+    // Very dark green-gray for dark mode bg
+  },
+  // Fire - Warm red/orange tones (energy, passion)
+  // Dark shades are muted for comfortable dark mode backgrounds
+  fire: {
+    50: "#fff7ed",
+    100: "#ffedd5",
+    200: "#fed7aa",
+    300: "#fdba74",
+    400: "#fb923c",
+    500: "#f97316",
+    600: "#ea580c",
+    700: "#c2410c",
+    800: "#2d1810",
+    // Darkened and desaturated for dark mode
+    900: "#1c100a",
+    // Darkened and desaturated for dark mode
+    950: "#120a06"
+    // Very dark warm gray for dark mode bg
+  }
+};
+const PALETTE_SEMANTIC_COLORS = {
+  // Stone - Standard semantic colors (vibrant, universal)
+  stone: {
+    success: "#22c55e",
+    // Green 500
+    warning: "#f59e0b",
+    // Amber 500
+    danger: "#ef4444",
+    // Red 500
+    info: "#3b82f6"
+    // Blue 500
+  },
+  // Ice - Cool blue-shifted semantic colors
+  ice: {
+    success: "#10b981",
+    // Emerald 500 (cooler green)
+    warning: "#f59e0b",
+    // Amber 500
+    danger: "#f43f5e",
+    // Rose 500 (cooler red)
+    info: "#0ea5e9"
+    // Sky 500 (matches palette)
+  },
+  // Earth - Natural, muted semantic colors
+  earth: {
+    success: "#22c55e",
+    // Green 500 (natural)
+    warning: "#d97706",
+    // Amber 600 (earthier)
+    danger: "#dc2626",
+    // Red 600 (deeper)
+    info: "#0284c7"
+    // Sky 600 (muted)
+  },
+  // Sand - Warm, terracotta-shifted semantic colors
+  sand: {
+    success: "#16a34a",
+    // Green 600 (warmer)
+    warning: "#ea580c",
+    // Orange 600 (warm)
+    danger: "#dc2626",
+    // Red 600
+    info: "#2563eb"
+    // Blue 600
+  },
+  // Fire - Warm, vibrant semantic colors
+  fire: {
+    success: "#16a34a",
+    // Green 600
+    warning: "#f59e0b",
+    // Amber 500
+    danger: "#dc2626",
+    // Red 600 (complements orange)
+    info: "#2563eb"
+    // Blue 600
+  }
+};
+function getSemanticColors(palette, overrides) {
+  const defaults = PALETTE_SEMANTIC_COLORS[palette];
+  return {
+    success: (overrides == null ? void 0 : overrides.success) || defaults.success,
+    warning: (overrides == null ? void 0 : overrides.warning) || defaults.warning,
+    danger: (overrides == null ? void 0 : overrides.danger) || defaults.danger,
+    info: (overrides == null ? void 0 : overrides.info) || defaults.info
+  };
+}
+const RADIUS_STYLES = {
+  sharp: {
+    sm: "0",
+    md: "0",
+    lg: "0",
+    xl: "0"
+  },
+  subtle: {
+    sm: "0.125rem",
+    md: "0.25rem",
+    lg: "0.375rem",
+    xl: "0.5rem"
+  },
+  default: {
+    sm: "0.25rem",
+    md: "0.429rem",
+    lg: "0.571rem",
+    xl: "0.857rem"
+  },
+  rounded: {
+    sm: "0.375rem",
+    md: "0.5rem",
+    lg: "0.75rem",
+    xl: "1rem"
+  },
+  pill: {
+    sm: "0.5rem",
+    md: "0.75rem",
+    lg: "1rem",
+    xl: "1.5rem"
+  }
+};
+function hexToRgb(hex) {
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+  if (!result) {
+    throw new Error(`Invalid hex color: ${hex}`);
+  }
+  return {
+    r: parseInt(result[1], 16),
+    g: parseInt(result[2], 16),
+    b: parseInt(result[3], 16)
+  };
+}
+function rgbToHex(r, g, b) {
+  const toHex = (n) => {
+    const clamped = Math.max(0, Math.min(255, Math.round(n)));
+    return clamped.toString(16).padStart(2, "0");
+  };
+  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
+}
+function lighten(hex, percent) {
+  const { r, g, b } = hexToRgb(hex);
+  const factor = percent / 100;
+  return rgbToHex(
+    r + (255 - r) * factor,
+    g + (255 - g) * factor,
+    b + (255 - b) * factor
+  );
+}
+function darken(hex, percent) {
+  const { r, g, b } = hexToRgb(hex);
+  const factor = 1 - percent / 100;
+  return rgbToHex(r * factor, g * factor, b * factor);
+}
+function mixColors(color1, color2, weight) {
+  const c1 = hexToRgb(color1);
+  const c2 = hexToRgb(color2);
+  const w = weight / 100;
+  return rgbToHex(
+    c1.r * w + c2.r * (1 - w),
+    c1.g * w + c2.g * (1 - w),
+    c1.b * w + c2.b * (1 - w)
+  );
+}
+function getHslLightness(hex) {
+  const { r, g, b } = hexToRgb(hex);
+  const rNorm = r / 255;
+  const gNorm = g / 255;
+  const bNorm = b / 255;
+  const max = Math.max(rNorm, gNorm, bNorm);
+  const min = Math.min(rNorm, gNorm, bNorm);
+  return (max + min) / 2 * 100;
+}
+function deriveAccentHover(base, isDark) {
+  const l = getHslLightness(base);
+  if (isDark) {
+    if (l > 85) {
+      return darken(base, 10);
+    }
+    return lighten(base, 8);
+  } else {
+    if (l < 15) {
+      return lighten(base, 18);
+    }
+    return darken(base, 10);
+  }
+}
+function deriveAccentActive(base, isDark) {
+  const l = getHslLightness(base);
+  if (isDark) {
+    if (l > 85) {
+      return darken(base, 16);
+    }
+    return lighten(base, 14);
+  } else {
+    if (l < 15) {
+      return lighten(base, 28);
+    }
+    return darken(base, 18);
+  }
+}
+function deriveDarkAccent(brand) {
+  const { r, g, b } = hexToRgb(brand);
+  const max = Math.max(r, g, b);
+  const min = Math.min(r, g, b);
+  const saturation = max === 0 ? 0 : (max - min) / max;
+  if (saturation < 0.15) {
+    return "#f2f2f2";
+  }
+  const brightness = max / 255;
+  if (brightness > 0.9 && saturation > 0.7) {
+    return lighten(brand, 10);
+  }
+  if (brightness > 0.6) {
+    return lighten(brand, 20);
+  }
+  const luminance = 0.2126 * (r / 255) + 0.7152 * (g / 255) + 0.0722 * (b / 255);
+  const lightenAmount = luminance < 0.2 ? 45 : 30;
+  return lighten(brand, lightenAmount);
+}
+function interpolateShade(palette, level) {
+  const levels = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
+  if (level in palette) {
+    return palette[level];
+  }
+  let lower = levels[0];
+  let upper = levels[levels.length - 1];
+  for (const l of levels) {
+    if (l < level) lower = l;
+    if (l > level && upper === levels[levels.length - 1]) upper = l;
+  }
+  const lowerColor = palette[lower];
+  const upperColor = palette[upper];
+  const ratio = (level - lower) / (upper - lower) * 100;
+  return mixColors(upperColor, lowerColor, ratio);
+}
+function deriveSurfaces(palette, isDark, paletteName = "stone") {
+  const isColorful = paletteName !== "stone";
+  if (isDark) {
+    return {
+      primary: palette[950],
+      secondary: palette[900],
+      tertiary: palette[800],
+      elevated: interpolateShade(palette, 875),
+      subtle: interpolateShade(palette, 925),
+      hover: "rgba(255, 255, 255, 0.05)",
+      active: "rgba(255, 255, 255, 0.08)"
+    };
+  }
+  if (isColorful) {
+    return {
+      primary: palette[50],
+      secondary: palette[100],
+      tertiary: palette[200],
+      elevated: "#ffffff",
+      subtle: palette[50],
+      hover: "rgba(0, 0, 0, 0.04)",
+      active: "rgba(0, 0, 0, 0.06)"
+    };
+  }
+  return {
+    primary: "#ffffff",
+    secondary: palette[100],
+    tertiary: palette[100],
+    elevated: "#ffffff",
+    subtle: palette[50],
+    hover: "rgba(0, 0, 0, 0.04)",
+    active: "rgba(0, 0, 0, 0.06)"
+  };
+}
+function deriveText(palette, isDark, paletteName = "stone") {
+  if (isDark) {
+    return {
+      primary: palette[100],
+      secondary: palette[400],
+      // 90/10 mix of palette[400]/palette[500] for WCAG AAA 7:1
+      // against palette[950] backgrounds (pure palette[500] gives ~4.1:1)
+      tertiary: mixColors(palette[400], palette[500], 90),
+      inverse: palette[900]
+    };
+  }
+  const bgPrimary = paletteName === "stone" ? "#ffffff" : palette[50];
+  const aaaTarget = 7;
+  return {
+    primary: palette[900],
+    secondary: ensureContrast(palette[600], bgPrimary, aaaTarget),
+    tertiary: ensureContrast(mixColors(palette[500], palette[600], 20), bgPrimary, aaaTarget),
+    inverse: palette[100]
+  };
+}
+function deriveBorders(palette, isDark) {
+  if (isDark) {
+    return {
+      default: "rgba(255, 255, 255, 0.08)",
+      strong: "rgba(255, 255, 255, 0.14)"
+    };
+  }
+  return {
+    default: "rgba(0, 0, 0, 0.08)",
+    strong: "rgba(0, 0, 0, 0.14)"
+  };
+}
+function deriveShadows(isDark) {
+  if (isDark) {
+    return {
+      sm: "0 1px 2px 0 rgba(0, 0, 0, 0.2)",
+      md: "0 2px 4px -1px rgba(0, 0, 0, 0.25), 0 1px 3px -2px rgba(0, 0, 0, 0.2)",
+      lg: "0 8px 12px -3px rgba(0, 0, 0, 0.35), 0 3px 5px -4px rgba(0, 0, 0, 0.25)"
+    };
+  }
+  return {
+    sm: "0 1px 2px 0 rgba(0, 0, 0, 0.03)",
+    md: "0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 1px 3px -2px rgba(0, 0, 0, 0.04)",
+    lg: "0 8px 12px -3px rgba(0, 0, 0, 0.08), 0 3px 5px -4px rgba(0, 0, 0, 0.05)"
+  };
+}
+function srgbLinearize(channel) {
+  const srgb = channel / 255;
+  return srgb <= 0.04045 ? srgb / 12.92 : Math.pow((srgb + 0.055) / 1.055, 2.4);
+}
+function wcagLuminance(hex) {
+  const { r, g, b } = hexToRgb(hex);
+  return 0.2126 * srgbLinearize(r) + 0.7152 * srgbLinearize(g) + 0.0722 * srgbLinearize(b);
+}
+function wcagContrast(fg, bg) {
+  const l1 = wcagLuminance(fg);
+  const l2 = wcagLuminance(bg);
+  const lighter = Math.max(l1, l2);
+  const darker = Math.min(l1, l2);
+  return (lighter + 0.05) / (darker + 0.05);
+}
+function ensureContrast(fg, bg, targetRatio) {
+  let adjusted = fg;
+  for (let i = 0; i < 40; i++) {
+    if (wcagContrast(adjusted, bg) >= targetRatio) break;
+    adjusted = darken(adjusted, 4);
+  }
+  return adjusted;
+}
+function deriveSemanticText(color, isDark) {
+  const target = isDark ? 7.5 : 7;
+  const bg = isDark ? "#0a0a0a" : "#ffffff";
+  let adjusted = color;
+  for (let i = 0; i < 40; i++) {
+    if (wcagContrast(adjusted, bg) >= target) break;
+    if (isDark) {
+      adjusted = lighten(adjusted, 3);
+    } else {
+      adjusted = darken(adjusted, 3);
+    }
+  }
+  return adjusted;
+}
+function deriveSemanticBg(color, isDark) {
+  const { r, g, b } = hexToRgb(color);
+  const opacity = isDark ? 0.15 : 0.1;
+  return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+}
+function deriveSemanticHover(color) {
+  return darken(color, 10);
+}
+const DEFAULT_SEEDS = {
+  brand: "#18181b",
+  neutral: "stone",
+  density: "default",
+  radiusStyle: "default"
+  // Semantic colors omitted - will use palette defaults from PALETTE_SEMANTIC_COLORS
+};
+exports.DEFAULT_SEEDS = DEFAULT_SEEDS;
+exports.PALETTES = PALETTES;
+exports.PALETTE_SEMANTIC_COLORS = PALETTE_SEMANTIC_COLORS;
+exports.RADIUS_STYLES = RADIUS_STYLES;
+exports.deriveAccentActive = deriveAccentActive;
+exports.deriveAccentHover = deriveAccentHover;
+exports.deriveBorders = deriveBorders;
+exports.deriveDarkAccent = deriveDarkAccent;
+exports.deriveSemanticBg = deriveSemanticBg;
+exports.deriveSemanticHover = deriveSemanticHover;
+exports.deriveSemanticText = deriveSemanticText;
+exports.deriveShadows = deriveShadows;
+exports.deriveSurfaces = deriveSurfaces;
+exports.deriveText = deriveText;
+exports.getSemanticColors = getSemanticColors;

package/dist/utils/seed-derivation.d.ts

@@ -0,0 +1,140 @@
+/**
+ * Seed Derivation System
+ *
+ * Canonical TypeScript implementation of the seed-based token derivation system.
+ * This is the single source of truth — the SCSS derivation in
+ * libs/ui/src/tokens/_derive.scss mirrors this logic.
+ *
+ * Consumers (docs app, CLI viewer, configureTheme) should import from here
+ * or via the @fragments-sdk/ui barrel export.
+ */
+export type NeutralPalette = 'stone' | 'ice' | 'sand' | 'earth' | 'fire';
+export type DensityPreset = 'compact' | 'default' | 'relaxed';
+export type RadiusStyle = 'sharp' | 'subtle' | 'default' | 'rounded' | 'pill';
+export interface SeedConfig {
+    brand: string;
+    neutral: NeutralPalette;
+    density: DensityPreset;
+    radiusStyle: RadiusStyle;
+    danger?: string;
+    success?: string;
+    warning?: string;
+    info?: string;
+}
+interface PaletteShades {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+    950: string;
+}
+interface RadiusConfig {
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+}
+export declare const PALETTES: Record<NeutralPalette, PaletteShades>;
+interface SemanticColors {
+    success: string;
+    warning: string;
+    danger: string;
+    info: string;
+}
+/**
+ * Default semantic colors for each palette.
+ * These are carefully chosen to complement each palette's tone.
+ */
+export declare const PALETTE_SEMANTIC_COLORS: Record<NeutralPalette, SemanticColors>;
+/**
+ * Get semantic colors for a palette, with optional overrides
+ */
+export declare function getSemanticColors(palette: NeutralPalette, overrides?: Partial<SemanticColors>): SemanticColors;
+export declare const RADIUS_STYLES: Record<RadiusStyle, RadiusConfig>;
+/**
+ * Derive hover state for accent color.
+ * Handles extreme lightness values (near-black/near-white) by reversing
+ * the adjustment direction to ensure a visible hover state.
+ */
+export declare function deriveAccentHover(base: string, isDark: boolean): string;
+/**
+ * Derive active state for accent color.
+ * Handles extreme lightness values (near-black/near-white) by reversing
+ * the adjustment direction to ensure a visible active/pressed state.
+ */
+export declare function deriveAccentActive(base: string, isDark: boolean): string;
+/**
+ * Derive accent color for dark mode visibility
+ * For colored brands, adjust them to be visible on dark backgrounds
+ * For very dark/grayscale brands, use light gray
+ */
+export declare function deriveDarkAccent(brand: string): string;
+/**
+ * Derive surface tokens from a neutral palette
+ * For colorful palettes (ice, earth, sand, fire), use tinted backgrounds
+ * For stone palette, use neutral white/dark backgrounds
+ */
+export declare function deriveSurfaces(palette: PaletteShades, isDark: boolean, paletteName?: NeutralPalette): {
+    primary: string;
+    secondary: string;
+    tertiary: string;
+    elevated: string;
+    subtle: string;
+    hover: string;
+    active: string;
+};
+/**
+ * Derive text tokens from a neutral palette.
+ *
+ * For colorful palettes (ice, earth, sand, fire) in light mode, palette
+ * shades are saturated colors that may lack sufficient luminance contrast
+ * against their own tinted backgrounds (palette[50]). `ensureContrast`
+ * progressively darkens until WCAG AAA (7:1) is met.
+ */
+export declare function deriveText(palette: PaletteShades, isDark: boolean, paletteName?: NeutralPalette): {
+    primary: string;
+    secondary: string;
+    tertiary: string;
+    inverse: string;
+};
+/**
+ * Derive border tokens from a neutral palette
+ */
+export declare function deriveBorders(palette: PaletteShades, isDark: boolean): {
+    default: string;
+    strong: string;
+};
+/**
+ * Derive shadow tokens
+ */
+export declare function deriveShadows(isDark: boolean): {
+    sm: string;
+    md: string;
+    lg: string;
+};
+/**
+ * Derive a WCAG AA contrast-safe text color from a semantic color.
+ * Darkens (light mode) or lightens (dark mode) until a high-contrast target
+ * is met against the approximate page background (~white or ~black).
+ *
+ * Targets are intentionally above AA 4.5:1 to provide headroom for
+ * composited semantic backgrounds (rgba overlays) on tinted surfaces.
+ */
+export declare function deriveSemanticText(color: string, isDark: boolean): string;
+/**
+ * Derive semantic background colors
+ */
+export declare function deriveSemanticBg(color: string, isDark: boolean): string;
+/**
+ * Derive hover state for semantic colors
+ */
+export declare function deriveSemanticHover(color: string): string;
+export declare const DEFAULT_SEEDS: SeedConfig;
+export {};
+//# sourceMappingURL=seed-derivation.d.ts.map

package/dist/utils/seed-derivation.d.ts.map

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