@dryui/theme-wizard 3.0.0 → 5.0.0

package/dist/engine/url-codec.test.js

@@ -1,137 +0,0 @@
-// apps/docs/src/lib/theme-wizard/url-codec.test.ts
-import { describe, test, expect } from 'bun:test';
-import { encodeTheme, decodeTheme } from './url-codec.js';
-// ─── Round-trip helpers ────────────────────────────────────────────────────────
-function roundTrip(brand, options) {
-    const input = options !== undefined ? { brand, options } : { brand };
-    const encoded = encodeTheme(input);
-    return { encoded, decoded: decodeTheme(encoded) };
-}
-// ─── Encoding ─────────────────────────────────────────────────────────────────
-describe('encodeTheme', () => {
-    test('encodes default brand to h230s65b85', () => {
-        const encoded = encodeTheme({ brand: { h: 230, s: 65, b: 85 } });
-        expect(encoded).toBe('h230s65b85');
-    });
-    test('encodes ocean brand to h200s80b70', () => {
-        const encoded = encodeTheme({ brand: { h: 200, s: 80, b: 70 } });
-        expect(encoded).toBe('h200s80b70');
-    });
-    test('encodes brand without options — no dash suffix', () => {
-        const encoded = encodeTheme({ brand: { h: 145, s: 60, b: 55 } });
-        expect(encoded).not.toContain('-');
-    });
-    test('encodes brand + error hue override with dash separator', () => {
-        const encoded = encodeTheme({
-            brand: { h: 230, s: 65, b: 85 },
-            options: { statusHues: { error: 350 } }
-        });
-        expect(encoded).toBe('h230s65b85-e350');
-    });
-    test('encodes brand + multiple status hue overrides', () => {
-        const encoded = encodeTheme({
-            brand: { h: 230, s: 65, b: 85 },
-            options: { statusHues: { error: 350, warning: 45 } }
-        });
-        expect(encoded).toBe('h230s65b85-e350w45');
-    });
-    test('encodes all four status hues', () => {
-        const encoded = encodeTheme({
-            brand: { h: 230, s: 65, b: 85 },
-            options: { statusHues: { error: 0, warning: 40, success: 145, info: 210 } }
-        });
-        expect(encoded).toBe('h230s65b85-e0w40s145i210');
-    });
-    test('empty statusHues object produces no suffix', () => {
-        const encoded = encodeTheme({ brand: { h: 230, s: 65, b: 85 }, options: { statusHues: {} } });
-        expect(encoded).toBe('h230s65b85');
-    });
-    test('rounds fractional hue values', () => {
-        const encoded = encodeTheme({ brand: { h: 230.7, s: 65.4, b: 85.2 } });
-        expect(encoded).toBe('h231s65b85');
-    });
-});
-// ─── Decoding ─────────────────────────────────────────────────────────────────
-describe('decodeTheme', () => {
-    test('decodes h230s65b85 to default brand', () => {
-        const { brand } = decodeTheme('h230s65b85');
-        expect(brand).toEqual({ h: 230, s: 65, b: 85 });
-    });
-    test('decodes brand-only string — options is undefined', () => {
-        const result = decodeTheme('h200s80b70');
-        expect(result.options).toBeUndefined();
-    });
-    test('decodes string with single status hue override', () => {
-        const result = decodeTheme('h230s65b85-e350');
-        expect(result.brand).toEqual({ h: 230, s: 65, b: 85 });
-        expect(result.options?.statusHues?.error).toBe(350);
-    });
-    test('decodes string with multiple status hue overrides', () => {
-        const result = decodeTheme('h230s65b85-e350w45');
-        expect(result.options?.statusHues?.error).toBe(350);
-        expect(result.options?.statusHues?.warning).toBe(45);
-    });
-    test('decodes all four status hues', () => {
-        const result = decodeTheme('h230s65b85-e0w40s145i210');
-        expect(result.options?.statusHues).toEqual({
-            error: 0,
-            warning: 40,
-            success: 145,
-            info: 210
-        });
-    });
-    test('throws on empty string', () => {
-        expect(() => decodeTheme('')).toThrow();
-    });
-    test('throws on invalid brand segment', () => {
-        expect(() => decodeTheme('invalid')).toThrow();
-    });
-});
-// ─── Round-trip ───────────────────────────────────────────────────────────────
-describe('round-trip', () => {
-    test('default brand round-trips', () => {
-        const brand = { h: 230, s: 65, b: 85 };
-        const { decoded } = roundTrip(brand);
-        expect(decoded.brand).toEqual(brand);
-    });
-    test('ocean brand round-trips', () => {
-        const brand = { h: 200, s: 80, b: 70 };
-        const { decoded } = roundTrip(brand);
-        expect(decoded.brand).toEqual(brand);
-    });
-    test('forest brand round-trips', () => {
-        const brand = { h: 145, s: 60, b: 55 };
-        const { decoded } = roundTrip(brand);
-        expect(decoded.brand).toEqual(brand);
-    });
-    test('sunset brand round-trips', () => {
-        const brand = { h: 25, s: 80, b: 90 };
-        const { decoded } = roundTrip(brand);
-        expect(decoded.brand).toEqual(brand);
-    });
-    test('brand + error hue override round-trips', () => {
-        const brand = { h: 230, s: 65, b: 85 };
-        const options = { statusHues: { error: 350 } };
-        const { decoded } = roundTrip(brand, options);
-        expect(decoded.brand).toEqual(brand);
-        expect(decoded.options?.statusHues?.error).toBe(350);
-    });
-    test('brand + all status hues round-trips', () => {
-        const brand = { h: 230, s: 65, b: 85 };
-        const options = {
-            statusHues: { error: 5, warning: 38, success: 150, info: 205 }
-        };
-        const { decoded } = roundTrip(brand, options);
-        expect(decoded.brand).toEqual(brand);
-        expect(decoded.options?.statusHues).toEqual({ error: 5, warning: 38, success: 150, info: 205 });
-    });
-    test('compact string format — no redundant characters', () => {
-        const { encoded } = roundTrip({ h: 230, s: 65, b: 85 });
-        // Should be short: h230s65b85 = 10 chars
-        expect(encoded.length).toBeLessThanOrEqual(15);
-    });
-    test('encoded string only uses URL-safe characters', () => {
-        const { encoded } = roundTrip({ h: 230, s: 65, b: 85 }, { statusHues: { error: 0, warning: 40, success: 145, info: 210 } });
-        expect(encoded).toMatch(/^[a-zA-Z0-9-]+$/);
-    });
-});

package/dist/index.d.ts

@@ -1,14 +0,0 @@
-export * from './engine/index.js';
-export { wizardState, getDerivedTheme, setBrandHsb, setStep, goNextStep, goPrevStep, activateFastTrack, applyPreset, getStyleString, setFontPreset, setTypeScale, resetToDefaults, applyRecipe, setRadiusPreset, setRadiusScale, setDensity, getShadowTokens, getShapeTokens, setPersonality, getPersonalityTokens, getAllTokens, getOverrideTokens, RADIUS_PRESETS, FONT_STACKS } from './state.svelte.js';
-export type { PreviewMode, NeutralMode, RadiusPreset, Density, ShadowPreset, Personality, TypeScale, FontPreset } from './state.svelte.js';
-export { default as PersonalityStep } from './steps/Personality.svelte';
-export { default as BrandColor } from './steps/BrandColor.svelte';
-export { default as Typography } from './steps/Typography.svelte';
-export { default as Shape } from './steps/Shape.svelte';
-export { default as PreviewExport } from './steps/PreviewExport.svelte';
-export { default as WizardShell } from './components/WizardShell.svelte';
-export { default as HsbPicker } from './components/HsbPicker.svelte';
-export { default as ContrastBadge } from './components/ContrastBadge.svelte';
-export { default as AlphaSlider } from './components/AlphaSlider.svelte';
-export { default as StepIndicator } from './components/StepIndicator.svelte';
-export { default as TokenPreview } from './components/TokenPreview.svelte';

package/dist/index.js

@@ -1,17 +0,0 @@
-// Re-export all engine functions and types
-export * from './engine/index.js';
-// Re-export state (Svelte 5 runes)
-export { wizardState, getDerivedTheme, setBrandHsb, setStep, goNextStep, goPrevStep, activateFastTrack, applyPreset, getStyleString, setFontPreset, setTypeScale, resetToDefaults, applyRecipe, setRadiusPreset, setRadiusScale, setDensity, getShadowTokens, getShapeTokens, setPersonality, getPersonalityTokens, getAllTokens, getOverrideTokens, RADIUS_PRESETS, FONT_STACKS } from './state.svelte.js';
-// Step components
-export { default as PersonalityStep } from './steps/Personality.svelte';
-export { default as BrandColor } from './steps/BrandColor.svelte';
-export { default as Typography } from './steps/Typography.svelte';
-export { default as Shape } from './steps/Shape.svelte';
-export { default as PreviewExport } from './steps/PreviewExport.svelte';
-// UI components
-export { default as WizardShell } from './components/WizardShell.svelte';
-export { default as HsbPicker } from './components/HsbPicker.svelte';
-export { default as ContrastBadge } from './components/ContrastBadge.svelte';
-export { default as AlphaSlider } from './components/AlphaSlider.svelte';
-export { default as StepIndicator } from './components/StepIndicator.svelte';
-export { default as TokenPreview } from './components/TokenPreview.svelte';

package/dist/state.svelte.d.ts

@@ -1,104 +0,0 @@
-import { type BrandInput, type ThemeTokens } from './engine/derivation.js';
-import type { WizardRecipe } from './engine/url-codec.js';
-export type PreviewMode = 'light' | 'dark' | 'side-by-side';
-export type NeutralMode = 'monochromatic' | 'neutral';
-export type RadiusPreset = 'sharp' | 'soft' | 'rounded' | 'pill';
-export type Density = 'compact' | 'default' | 'spacious';
-export type ShadowPreset = 'flat' | 'subtle' | 'elevated' | 'deep';
-export type Personality = 'minimal' | 'clean' | 'structured' | 'rich';
-export type FontPreset = 'System' | 'Humanist' | 'Geometric' | 'Classical' | 'Serif' | 'Mono';
-export type TypeScale = 'compact' | 'default' | 'spacious';
-export declare const wizardState: {
-    currentStep: number;
-    personality: Personality;
-    brandHsb: BrandInput;
-    neutralMode: NeutralMode;
-    statusHues: {
-        error: number;
-        warning: number;
-        success: number;
-        info: number;
-    };
-    darkBgOverrides: {
-        base?: string;
-        raised?: string;
-        overlay?: string;
-    };
-    fastTrack: boolean;
-    typography: {
-        fontPreset: FontPreset;
-        scale: TypeScale;
-    };
-    shape: {
-        radiusPreset: RadiusPreset;
-        radiusScale: number;
-        density: Density;
-    };
-    shadows: {
-        preset: ShadowPreset;
-        intensity: number;
-        tintBrand: boolean;
-    };
-};
-export declare function getDerivedTheme(): ThemeTokens;
-/** Update the brand color (h: 0-360, s/b: 0-100). */
-export declare function setBrandHsb(h: number, s: number, b: number): void;
-/** Update a single status tone's hue. */
-export declare function setStatusHue(tone: 'error' | 'warning' | 'success' | 'info', hue: number): void;
-/** Update the neutral palette mode. */
-export declare function setNeutralMode(mode: NeutralMode): void;
-/** Set the personality (chrome level) and apply cross-step defaults. */
-export declare function setPersonality(p: Personality): void;
-/** Override a dark background level. */
-export declare function setDarkBg(level: 'base' | 'raised' | 'overlay', value: string): void;
-/** Navigate to a specific step (1–5). */
-export declare function setStep(n: number): void;
-/** Advance to the next step. */
-export declare function goNextStep(): void;
-/** Go back to the previous step. */
-export declare function goPrevStep(): void;
-/** Enable fast-track mode and jump to the final step. */
-export declare function activateFastTrack(): void;
-/** Apply a named preset from the PRESETS array. */
-export declare function applyPreset(name: string): void;
-/**
- * Return a CSS custom property string for live preview injection.
- *
- * @param mode - 'light' | 'dark'
- * @returns e.g. `--dry-color-brand: hsl(230, 75%, 60%); ...`
- */
-export declare function getStyleString(mode: 'light' | 'dark'): string;
-/** Update the font preset name. */
-export declare function setFontPreset(preset: FontPreset): void;
-/** Update the type scale. */
-export declare function setTypeScale(scale: TypeScale): void;
-/** Reset all wizard state to defaults. */
-export declare function resetToDefaults(): void;
-/** Apply a full wizard recipe, using personality defaults before explicit overrides. */
-export declare function applyRecipe(recipe: WizardRecipe): void;
-export declare function setRadiusPreset(preset: RadiusPreset): void;
-export declare function setRadiusScale(scale: number): void;
-export declare function setDensity(density: Density): void;
-export declare const RADIUS_PRESETS: Record<RadiusPreset, {
-    sm: number;
-    md: number;
-    lg: number;
-    xl: number;
-    '2xl': number;
-    full: number;
-}>;
-export declare function setShadowPreset(preset: ShadowPreset): void;
-export declare function setShadowIntensity(intensity: number): void;
-export declare function setShadowTint(tint: boolean): void;
-export declare function getShadowTokens(shadowPreset?: ShadowPreset, shadowIntensity?: number, tintBrand?: boolean, brandHue?: number): {
-    light: Record<string, string>;
-    dark: Record<string, string>;
-};
-export declare function getShapeTokens(radiusPreset?: RadiusPreset, radiusScale?: number, densityPreset?: Density): Record<string, string>;
-export declare function getPersonalityTokens(): Record<string, string>;
-export declare const FONT_STACKS: Record<FontPreset, string>;
-export declare function getTypographyTokens(fontPreset?: FontPreset, scale?: TypeScale): Record<string, string>;
-/** Return all tokens (color + shape + shadow + personality + typography) merged for a given mode. */
-export declare function getAllTokens(mode?: 'light' | 'dark'): Record<string, string>;
-/** Return only tokens that the user has changed from defaults. */
-export declare function getOverrideTokens(mode?: 'light' | 'dark'): Record<string, string>;