@clhaas/palette-kit 0.1.8 → 0.3.0

package/dist/export/exportTheme.js

@@ -0,0 +1,170 @@
+import { serializeColorJson } from "../serialize/serializeColor.js";
+import { serializeColor } from "./serializeColor.js";
+const DEFAULT_OUTPUT = {
+    preferSpace: "oklch",
+    includeSpaces: [],
+    gamutMapping: "preferP3ThenCompress",
+    precision: { l: 1, c: 3, h: 1, alpha: 2 },
+    srgbFormat: "hex",
+    strict: false,
+    includeMeta: false,
+};
+const normalizeExportOutput = (output) => ({
+    preferSpace: output?.preferSpace ?? DEFAULT_OUTPUT.preferSpace,
+    includeSpaces: output?.includeSpaces ?? DEFAULT_OUTPUT.includeSpaces,
+    gamutMapping: output?.gamutMapping ?? DEFAULT_OUTPUT.gamutMapping,
+    precision: {
+        ...DEFAULT_OUTPUT.precision,
+        ...output?.precision,
+    },
+    srgbFormat: output?.srgbFormat ?? DEFAULT_OUTPUT.srgbFormat,
+    strict: output?.strict ?? DEFAULT_OUTPUT.strict,
+    includeMeta: output?.includeMeta ?? DEFAULT_OUTPUT.includeMeta,
+});
+const buildExportMeta = (output) => ({
+    gamutMapping: output.gamutMapping,
+    preferSpace: output.preferSpace,
+    includeSpaces: output.includeSpaces,
+    precision: output.precision,
+    srgbFormat: output.srgbFormat,
+    strict: output.strict,
+});
+const getTokenEntries = (tokens) => {
+    if (!tokens || Object.keys(tokens).length === 0) {
+        throw new Error("Theme tokens are required for export");
+    }
+    return Object.entries(tokens).sort(([a], [b]) => a.localeCompare(b));
+};
+const getTokenRole = (name, token) => token.role ?? name;
+const buildTokenQuery = (name, token, context) => {
+    const { role: _role, ...rest } = token;
+    return {
+        ...rest,
+        role: getTokenRole(name, token),
+        ...(context ? { context } : {}),
+    };
+};
+const buildTokenMeta = (name, token, context) => ({
+    role: getTokenRole(name, token),
+    ...(token.variant ? { variant: token.variant } : {}),
+    ...(token.usage ? { usage: token.usage } : {}),
+    ...(context ? { context } : token.context ? { context: token.context } : {}),
+    ...(token.surface ? { surface: token.surface } : {}),
+    ...(token.state ? { state: token.state } : {}),
+    ...(token.emphasis ? { emphasis: token.emphasis } : {}),
+    ...(token.on ? { on: token.on } : {}),
+    ...(token.contrast ? { contrast: token.contrast } : {}),
+});
+const buildTokenValue = (serialized) => ({
+    value: serialized.value,
+    ...(serialized.srgb !== undefined ? { srgb: serialized.srgb } : {}),
+    ...(serialized.p3 !== undefined ? { p3: serialized.p3 } : {}),
+    ...(serialized.oklch !== undefined ? { oklch: serialized.oklch } : {}),
+    alpha: serialized.alpha,
+    ...(serialized.meta !== undefined ? { meta: serialized.meta } : {}),
+});
+const toCssVarName = (name) => name.replace(/\./g, "-");
+const indent = (lines, prefix) => lines.length === 0 ? "" : lines.map((line) => `${prefix}${line}`).join("\n");
+/**
+ * Export CSS variables for a token map with progressive fallbacks.
+ *
+ * - Base output uses sRGB for maximum compatibility.
+ * - @supports blocks override the main token value with OKLCH and/or P3 as requested.
+ */
+export const exportThemeCss = (theme, tokens, output) => {
+    const normalized = normalizeExportOutput(output);
+    const entries = getTokenEntries(tokens);
+    const baseDecl = [];
+    const oklchDecl = [];
+    const p3Decl = [];
+    const needsOklch = normalized.preferSpace === "oklch" || normalized.includeSpaces.includes("oklch");
+    const needsP3 = normalized.preferSpace === "p3" || normalized.includeSpaces.includes("p3");
+    for (const [name, token] of entries) {
+        const query = buildTokenQuery(name, token);
+        const resolved = theme.resolve(query);
+        const meta = normalized.includeMeta ? buildTokenMeta(name, token) : undefined;
+        const baseName = toCssVarName(name);
+        // Base fallback MUST be sRGB (no silent OKLCH fallback).
+        const baseSrgb = serializeColor(resolved.oklch, { ...normalized, preferSpace: "srgb", includeSpaces: [], strict: normalized.strict }, meta).value;
+        baseDecl.push(`--pk-${baseName}: ${baseSrgb};`);
+        if (normalized.includeSpaces.includes("srgb")) {
+            baseDecl.push(`--pk-${baseName}-srgb: ${baseSrgb};`);
+        }
+        if (needsOklch) {
+            const oklchValue = serializeColor(resolved.oklch, { ...normalized, preferSpace: "oklch", includeSpaces: [] }, meta).value;
+            if (normalized.preferSpace === "oklch") {
+                oklchDecl.push(`--pk-${baseName}: ${oklchValue};`);
+            }
+            if (normalized.includeSpaces.includes("oklch")) {
+                oklchDecl.push(`--pk-${baseName}-oklch: ${oklchValue};`);
+            }
+        }
+        if (needsP3) {
+            const p3Text = serializeColor(resolved.oklch, { ...normalized, preferSpace: "oklch", includeSpaces: ["p3"] }, meta).p3;
+            if (normalized.preferSpace === "p3") {
+                if (!p3Text) {
+                    if (normalized.strict) {
+                        throw new Error("Unable to serialize preferred space: p3");
+                    }
+                }
+                else {
+                    p3Decl.push(`--pk-${baseName}: ${p3Text};`);
+                }
+            }
+            if (normalized.includeSpaces.includes("p3") && p3Text) {
+                p3Decl.push(`--pk-${baseName}-p3: ${p3Text};`);
+            }
+        }
+    }
+    const blocks = [];
+    blocks.push(`:root {\n${indent(baseDecl, "  ")}\n}\n`);
+    if (oklchDecl.length > 0) {
+        blocks.push(`@supports (color: oklch(0% 0 0)) {\n  :root {\n${indent(oklchDecl, "    ")}\n  }\n}\n`);
+    }
+    if (p3Decl.length > 0) {
+        blocks.push(`@supports (color: color(display-p3 1 1 1)) {\n  :root {\n${indent(p3Decl, "    ")}\n  }\n}\n`);
+    }
+    return {
+        css: `${blocks.join("\n").trimEnd()}\n`,
+        meta: normalized.includeMeta ? buildExportMeta(normalized) : undefined,
+    };
+};
+/**
+ * Export JSON tokens for both light and dark contexts.
+ */
+export const exportThemeJson = (theme, tokens, output) => {
+    const normalized = normalizeExportOutput(output);
+    const entries = getTokenEntries(tokens);
+    const lightTokens = {};
+    const darkTokens = {};
+    const contexts = ["light", "dark"];
+    for (const [name, token] of entries) {
+        for (const context of contexts) {
+            const query = buildTokenQuery(name, token, context);
+            const resolved = theme.resolve(query);
+            const meta = normalized.includeMeta ? buildTokenMeta(name, token, context) : undefined;
+            const serialized = serializeColorJson(resolved.oklch, normalized, meta);
+            const entry = buildTokenValue({
+                value: serialized.value,
+                srgb: serialized.srgb,
+                p3: serialized.p3,
+                oklch: serialized.oklch,
+                alpha: serialized.alpha,
+                meta: serialized.meta,
+            });
+            if (context === "light") {
+                lightTokens[name] = entry;
+            }
+            else {
+                darkTokens[name] = entry;
+            }
+        }
+    }
+    return {
+        tokens: {
+            light: lightTokens,
+            dark: darkTokens,
+        },
+        meta: normalized.includeMeta ? buildExportMeta(normalized) : undefined,
+    };
+};

package/dist/export/exportTheme.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/export/exportTheme.test.js

@@ -0,0 +1,118 @@
+import { describe, expect, it, vi } from "vitest";
+import { createTheme } from "../core/createTheme.js";
+import * as gamut from "../engine/gamut.js";
+import { exportThemeCss, exportThemeJson } from "./exportTheme.js";
+const buildTheme = () => {
+    const theme = createTheme({
+        seeds: {
+            light: { neutral: "#111827", accent: "#3d63dd" },
+            dark: { neutral: "#111827", accent: "#3d63dd" },
+        },
+    });
+    const tokens = {
+        "text.primary": {
+            usage: "text",
+            surface: "surface",
+            emphasis: "default",
+        },
+        "bg.app": {
+            usage: "bg",
+            surface: "app",
+        },
+        "custom.alias": {
+            role: "text.primary",
+            usage: "text",
+            surface: "surface",
+        },
+    };
+    return {
+        resolve: theme.resolve.bind(theme),
+        tokens,
+    };
+};
+describe("exportTheme", () => {
+    it("throws when theme tokens are missing", () => {
+        const theme = createTheme({
+            seeds: {
+                light: { neutral: "#111827", accent: "#3d63dd" },
+                dark: { neutral: "#111827", accent: "#3d63dd" },
+            },
+        });
+        expect(() => exportThemeCss(theme, {})).toThrow(/Theme tokens are required for export/i);
+        expect(() => exportThemeJson(theme, {})).toThrow(/Theme tokens are required for export/i);
+    });
+    it("exports deterministic CSS with @supports overrides", () => {
+        const theme = buildTheme();
+        const { css } = exportThemeCss(theme, theme.tokens, {
+            preferSpace: "oklch",
+            includeSpaces: ["p3", "oklch"],
+        });
+        expect(css).toMatchSnapshot();
+    });
+    it("includes meta when requested and omits when not", () => {
+        const theme = buildTheme();
+        const withMeta = exportThemeJson(theme, theme.tokens, { includeMeta: true });
+        expect(withMeta.tokens.light["bg.app"].meta?.gamutMapping).toBe("preferP3ThenCompress");
+        expect(withMeta.meta).toEqual({
+            gamutMapping: "preferP3ThenCompress",
+            preferSpace: "oklch",
+            includeSpaces: [],
+            precision: { l: 1, c: 3, h: 1, alpha: 2 },
+            srgbFormat: "hex",
+            strict: false,
+        });
+        const withoutMeta = exportThemeJson(theme, theme.tokens, { includeMeta: false });
+        expect(withoutMeta.tokens.light["bg.app"].meta).toBeUndefined();
+    });
+    it("includes export meta for CSS when requested", () => {
+        const theme = buildTheme();
+        const { meta } = exportThemeCss(theme, theme.tokens, { includeMeta: true });
+        expect(meta).toEqual({
+            gamutMapping: "preferP3ThenCompress",
+            preferSpace: "oklch",
+            includeSpaces: [],
+            precision: { l: 1, c: 3, h: 1, alpha: 2 },
+            srgbFormat: "hex",
+            strict: false,
+        });
+    });
+    it("exports deterministic JSON with light/dark contexts", () => {
+        const theme = buildTheme();
+        const { tokens } = exportThemeJson(theme, theme.tokens, {
+            preferSpace: "oklch",
+            includeSpaces: ["srgb"],
+        });
+        expect(tokens).toMatchSnapshot();
+    });
+    it("keeps ordering stable regardless of token map order", () => {
+        const theme = buildTheme();
+        const shuffled = {
+            "custom.alias": theme.tokens["custom.alias"],
+            "bg.app": theme.tokens["bg.app"],
+            "text.primary": theme.tokens["text.primary"],
+        };
+        const cssA = exportThemeCss(theme, theme.tokens, { preferSpace: "oklch" }).css;
+        const cssB = exportThemeCss(theme, shuffled, { preferSpace: "oklch" }).css;
+        const jsonA = exportThemeJson(theme, theme.tokens, { preferSpace: "oklch" }).tokens;
+        const jsonB = exportThemeJson(theme, shuffled, { preferSpace: "oklch" }).tokens;
+        expect(cssA).toBe(cssB);
+        expect(jsonA).toEqual(jsonB);
+    });
+    it("throws when strict preferred space cannot be serialized", () => {
+        const theme = buildTheme();
+        const original = gamut.toGamutRgb;
+        const spy = vi
+            .spyOn(gamut, "toGamutRgb")
+            .mockImplementation((color, target) => (target === "p3" ? null : original(color, target)));
+        try {
+            expect(() => exportThemeCss(theme, theme.tokens, {
+                preferSpace: "p3",
+                includeSpaces: ["p3"],
+                strict: true,
+            })).toThrow(/Unable to serialize preferred space: p3/i);
+        }
+        finally {
+            spy.mockRestore();
+        }
+    });
+});

package/dist/export/index.d.ts

@@ -0,0 +1 @@
+export * from "./exportTheme.js";

package/dist/export/index.js

@@ -0,0 +1 @@
+export * from "./exportTheme.js";

package/dist/export/serializeColor.d.ts

@@ -0,0 +1 @@
+export { serializeColor } from "../serialize/serializeColor.js";

package/dist/export/serializeColor.js

@@ -0,0 +1 @@
+export { serializeColor } from "../serialize/serializeColor.js";

package/dist/export/serializeColor.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/export/serializeColor.test.js

@@ -0,0 +1,54 @@
+import { describe, expect, it, vi } from "vitest";
+import { serializeColor } from "./serializeColor.js";
+import { serializeColorJson } from "../serialize/serializeColor.js";
+import * as gamut from "../engine/gamut.js";
+describe("serializeColor", () => {
+    it("serializes CSS with precision and includeSpaces", () => {
+        const color = { l: 60.12, c: 0.2345, h: 40.49, alpha: 0.5 };
+        const result = serializeColor(color, {
+            preferSpace: "oklch",
+            includeSpaces: ["srgb", "p3", "oklch"],
+            gamutMapping: "compressChroma",
+            precision: { l: 1, c: 2, h: 0, alpha: 2 },
+        });
+        expect(result.value).toBe("oklch(60.1% 0.23 40 / 0.5)");
+        expect(result.oklch).toBe("oklch(60.1% 0.23 40 / 0.5)");
+        expect(result.srgb).toMatch(/^#[0-9a-f]{8}$/i);
+        expect(result.p3?.startsWith("color(display-p3 ")).toBe(true);
+    });
+    it("serializes JSON with includeSpaces and rounding", () => {
+        const color = { l: 60.12, c: 0.2345, h: 40.49, alpha: 0.5 };
+        const result = serializeColorJson(color, {
+            preferSpace: "p3",
+            includeSpaces: ["srgb", "oklch"],
+            gamutMapping: "preferP3ThenCompress",
+            precision: { l: 1, c: 2, h: 0, alpha: 2 },
+        });
+        expect(result.value.startsWith("color(display-p3 ")).toBe(true);
+        expect(result.oklch).toBeDefined();
+        expect(result.srgb).toBeDefined();
+        expect(result.oklch).toBe("oklch(60.1% 0.23 40 / 0.5)");
+        expect(result.alpha).toBe(0.5);
+    });
+    it("clamps alpha to [0..1] in CSS and JSON outputs", () => {
+        const colorHi = { l: 60, c: 0.2, h: 40, alpha: 2 };
+        const cssHi = serializeColor(colorHi, { preferSpace: "oklch", precision: { alpha: 2 } });
+        expect(cssHi.alpha).toBe(1);
+        expect(cssHi.value).toMatch(/^oklch\(/);
+        const colorLo = { l: 60, c: 0.2, h: 40, alpha: -1 };
+        const jsonLo = serializeColorJson(colorLo, { preferSpace: "oklch", precision: { alpha: 2 } });
+        expect(jsonLo.alpha).toBe(0);
+        expect(jsonLo.value).toMatch(/\/\s*0(\.0+)?\)/);
+        expect(jsonLo.oklch).toMatch(/\/\s*0(\.0+)?\)/);
+    });
+    it("throws in strict mode when preferred space cannot be serialized", () => {
+        const spy = vi.spyOn(gamut, "toGamutRgb").mockReturnValue(null);
+        try {
+            expect(() => serializeColor({ l: 60, c: 0.2, h: 40, alpha: 1 }, { preferSpace: "srgb", includeSpaces: ["srgb"], strict: true })).toThrow(/Unable to serialize preferred space: srgb/i);
+            expect(() => serializeColorJson({ l: 60, c: 0.2, h: 40, alpha: 1 }, { preferSpace: "p3", includeSpaces: ["p3"], strict: true })).toThrow(/Unable to serialize preferred space: p3/i);
+        }
+        finally {
+            spy.mockRestore();
+        }
+    });
+});

package/dist/export.d.ts

@@ -0,0 +1 @@
+export * from "./export/index.js";

package/dist/export.js

@@ -0,0 +1 @@
+export * from "./export/index.js";

package/dist/index.d.ts

@@ -1,22 +1,3 @@
-export { generateAlphaScale } from "./alpha/generateAlphaScale.js";
-export { apcaContrast } from "./contrast/apca.js";
-export { onSolidTextTokens } from "./contrast/onSolid.js";
-export { adjustTextColor } from "./contrast/solveText.js";
-export type { CreateThemeOptions, TokenOverrides } from "./createTheme.js";
-export { createTheme } from "./createTheme.js";
-export { radixSeedNames, radixSeeds } from "./data/radixSeeds.js";
-export { analyzeScale } from "./diagnostics/analyzeScale.js";
-export { analyzeTheme } from "./diagnostics/analyzeTheme.js";
-export { selectThemeColorMode } from "./exporters/selectColorMode.js";
-export { toCssVars } from "./exporters/toCssVars.js";
-export { toJson, toJsonWithMode } from "./exporters/toJson.js";
-export { toReactNative } from "./exporters/toReactNative.js";
-export { toTailwind } from "./exporters/toTailwind.js";
-export { toTs, toTsWithMode } from "./exporters/toTs.js";
-export type { AnchorStepOption, AutoAnchorModeOptions, AutoAnchorOptions, GenerateScaleOptions, SeedNormalizeOptions, SeedNormalizeRange, } from "./generateScale.js";
-export { generateScale } from "./generateScale.js";
-export { generateOverlayScale } from "./overlays/generateOverlayScale.js";
-export { generateTextScale } from "./text/generateTextScale.js";
-export type { TextOnBgTokens } from "./text/resolveOnBgText.js";
-export { resolveOnBgTextTokens } from "./text/resolveOnBgText.js";
-export type { AlphaScale, AlphaScales, ColorHex, ColorSource, OklchColor, OverlayScale, RadixSeedName, Scale, ScaleColorMode, ScaleDiagnostics, Step, TemplateId, TextScale, Theme, ThemeColorMode, ThemeDiagnostics, } from "./types.js";
+export type { PaletteConfig, TokenPresetName } from "./cli/config.js";
+export * from "./core/index.js";
+export * from "./types/index.js";

package/dist/index.js

@@ -1,18 +1,2 @@
-export { generateAlphaScale } from "./alpha/generateAlphaScale.js";
-export { apcaContrast } from "./contrast/apca.js";
-export { onSolidTextTokens } from "./contrast/onSolid.js";
-export { adjustTextColor } from "./contrast/solveText.js";
-export { createTheme } from "./createTheme.js";
-export { radixSeedNames, radixSeeds } from "./data/radixSeeds.js";
-export { analyzeScale } from "./diagnostics/analyzeScale.js";
-export { analyzeTheme } from "./diagnostics/analyzeTheme.js";
-export { selectThemeColorMode } from "./exporters/selectColorMode.js";
-export { toCssVars } from "./exporters/toCssVars.js";
-export { toJson, toJsonWithMode } from "./exporters/toJson.js";
-export { toReactNative } from "./exporters/toReactNative.js";
-export { toTailwind } from "./exporters/toTailwind.js";
-export { toTs, toTsWithMode } from "./exporters/toTs.js";
-export { generateScale } from "./generateScale.js";
-export { generateOverlayScale } from "./overlays/generateOverlayScale.js";
-export { generateTextScale } from "./text/generateTextScale.js";
-export { resolveOnBgTextTokens } from "./text/resolveOnBgText.js";
+export * from "./core/index.js";
+export * from "./types/index.js";

package/dist/operators/emphasis.d.ts

@@ -0,0 +1,3 @@
+import type { OkLchColor } from "../engine/generateScale.js";
+import type { OperatorInput } from "./types.js";
+export declare const applyEmphasisOperator: (input: OperatorInput) => OkLchColor;

package/dist/operators/emphasis.js

@@ -0,0 +1,113 @@
+import { clamp } from "../utils/clamp.js";
+import { getNeutralL, getStepLightness, getSurfaceRange } from "./utils.js";
+const EMPHASIS_TUNING = {
+    app: {
+        mutedChroma: 0.55,
+        subtleChroma: 0.75,
+        strongChroma: 1.1,
+        mutedNeutralPull: 0.45,
+        subtleNeutralPull: 0.2,
+        strongDelta: 2,
+    },
+    surface: {
+        mutedChroma: 0.55,
+        subtleChroma: 0.75,
+        strongChroma: 1.1,
+        mutedNeutralPull: 0.45,
+        subtleNeutralPull: 0.2,
+        strongDelta: 2.5,
+    },
+    subtle: {
+        mutedChroma: 0.55,
+        subtleChroma: 0.75,
+        strongChroma: 1.1,
+        mutedNeutralPull: 0.5,
+        subtleNeutralPull: 0.25,
+        strongDelta: 3,
+    },
+    solid: {
+        mutedChroma: 0.55,
+        subtleChroma: 0.75,
+        strongChroma: 1.1,
+        mutedNeutralPull: 0.5,
+        subtleNeutralPull: 0.25,
+        strongDelta: 4,
+    },
+    overlay: {
+        mutedChroma: 0.55,
+        subtleChroma: 0.75,
+        strongChroma: 1.1,
+        mutedNeutralPull: 0.5,
+        subtleNeutralPull: 0.25,
+        strongDelta: 3,
+    },
+    data: {
+        mutedChroma: 0.55,
+        subtleChroma: 0.75,
+        strongChroma: 1.1,
+        mutedNeutralPull: 0.5,
+        subtleNeutralPull: 0.25,
+        strongDelta: 4,
+    },
+    transparent: {
+        mutedChroma: 0.55,
+        subtleChroma: 0.75,
+        strongChroma: 1.1,
+        mutedNeutralPull: 0.45,
+        subtleNeutralPull: 0.2,
+        strongDelta: 2,
+    },
+};
+const INVERTED_LERP_FACTOR = 0.8;
+const clampOkLch = (color, maxChroma) => ({
+    ...color,
+    l: clamp(color.l, 0, 100),
+    c: clamp(color.c, 0, maxChroma),
+});
+export const applyEmphasisOperator = (input) => {
+    const { emphasis, context, surface, usage } = input;
+    const tuning = EMPHASIS_TUNING[surface];
+    const range = getSurfaceRange(input.preset, surface, context);
+    const neutralL = getNeutralL(input.preset, surface, context);
+    if (emphasis === "default") {
+        return input.oklch;
+    }
+    const next = { ...input.oklch };
+    switch (emphasis) {
+        case "muted":
+            next.c *= tuning.mutedChroma;
+            next.l += (neutralL - next.l) * tuning.mutedNeutralPull;
+            break;
+        case "subtle":
+            next.c *= tuning.subtleChroma;
+            next.l += (neutralL - next.l) * tuning.subtleNeutralPull;
+            break;
+        case "strong": {
+            const diff = next.l - neutralL;
+            let direction = diff === 0 ? (context === "light" ? -1 : 1) : Math.sign(diff);
+            if (usage === "text" || usage === "icon") {
+                direction = context === "light" ? -1 : 1;
+            }
+            else if (context === "light" && direction > 0) {
+                direction = -1;
+            }
+            else if (context === "dark" && direction < 0) {
+                direction = 1;
+            }
+            next.c *= tuning.strongChroma;
+            next.l += direction * tuning.strongDelta;
+            break;
+        }
+        case "inverted": {
+            if (usage === "text" || usage === "icon") {
+                const targetStep = input.step === 12 ? 11 : 12;
+                const targetL = getStepLightness(input.preset, surface, context, targetStep);
+                next.l += (targetL - next.l) * INVERTED_LERP_FACTOR;
+            }
+            break;
+        }
+        default:
+            return input.oklch;
+    }
+    return clampOkLch(next, range.cMax);
+};

package/dist/operators/emphasis.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/operators/emphasis.test.js

@@ -0,0 +1,69 @@
+import { describe, expect, it } from "vitest";
+import { applyEmphasisOperator } from "./emphasis.js";
+import { getStepLightness } from "./utils.js";
+const base = {
+    oklch: { l: 62, c: 0.06, h: 215 },
+    context: "light",
+    surface: "surface",
+    usage: "text",
+    state: "default",
+    emphasis: "default",
+    preset: "modern",
+    step: 11,
+};
+describe("applyEmphasisOperator", () => {
+    it("muted and subtle reduce chroma predictably", () => {
+        const muted = applyEmphasisOperator({ ...base, emphasis: "muted" });
+        const subtle = applyEmphasisOperator({ ...base, emphasis: "subtle" });
+        expect(muted.c).toBeLessThan(base.oklch.c);
+        expect(subtle.c).toBeLessThan(base.oklch.c);
+        expect(subtle.c).toBeGreaterThan(muted.c);
+    });
+    it("strong increases chroma", () => {
+        const strong = applyEmphasisOperator({ ...base, emphasis: "strong" });
+        expect(strong.c).toBeGreaterThan(base.oklch.c);
+    });
+    it("strong shifts text lightness by context", () => {
+        const strongLight = applyEmphasisOperator({ ...base, emphasis: "strong", usage: "text" });
+        const strongDark = applyEmphasisOperator({
+            ...base,
+            emphasis: "strong",
+            usage: "text",
+            context: "dark",
+        });
+        expect(strongLight.l).toBeLessThan(base.oklch.l);
+        expect(strongDark.l).toBeGreaterThan(base.oklch.l);
+    });
+    it("does not change hue", () => {
+        const muted = applyEmphasisOperator({ ...base, emphasis: "muted" });
+        expect(muted.h).toBeCloseTo(base.oklch.h, 6);
+    });
+    it("inverted leaves backgrounds unchanged", () => {
+        const invertedBg = applyEmphasisOperator({
+            ...base,
+            emphasis: "inverted",
+            usage: "bg",
+        });
+        expect(invertedBg.l).toBeCloseTo(base.oklch.l, 6);
+    });
+    it("inverted leaves non-text usage unchanged", () => {
+        const invertedBorder = applyEmphasisOperator({
+            ...base,
+            emphasis: "inverted",
+            usage: "border",
+        });
+        expect(invertedBorder.l).toBeCloseTo(base.oklch.l, 6);
+        expect(invertedBorder.c).toBeCloseTo(base.oklch.c, 6);
+        expect(invertedBorder.h).toBeCloseTo(base.oklch.h, 6);
+    });
+    it("inverted moves text toward the target step without changing hue", () => {
+        const targetL = getStepLightness(base.preset, base.surface, base.context, 12);
+        const inverted = applyEmphasisOperator({
+            ...base,
+            emphasis: "inverted",
+            usage: "text",
+        });
+        expect(Math.abs(inverted.l - targetL)).toBeLessThan(Math.abs(base.oklch.l - targetL));
+        expect(inverted.h).toBeCloseTo(base.oklch.h, 6);
+    });
+});

package/dist/operators/index.d.ts

@@ -0,0 +1,3 @@
+export { applyEmphasisOperator } from "./emphasis.js";
+export { applyStateOperator } from "./state.js";
+export type { OperatorInput } from "./types.js";

package/dist/operators/index.js

@@ -0,0 +1,2 @@
+export { applyEmphasisOperator } from "./emphasis.js";
+export { applyStateOperator } from "./state.js";

package/dist/operators/state.d.ts

@@ -0,0 +1,3 @@
+import type { OkLchColor } from "../engine/generateScale.js";
+import type { OperatorInput } from "./types.js";
+export declare const applyStateOperator: (input: OperatorInput) => OkLchColor;