@cueplusplus/ui 0.13.0

package/dist/theming/create-theme.js

@@ -0,0 +1,524 @@
+import { formatColorString } from "../color/_convert.js";
+import { WCAG_AA_NON_TEXT, WCAG_AA_TEXT, contrastRatio, contrastReport } from "./contrast.js";
+import { RESOLVED_MONO, assertCssValue, assertThemeName, derivedTokens, serializeSystemModeAliases, serializeThemeCss, themeSelector, tokenProperty } from "./serialize.js";
+import { COLOR_CONTRACT, resolve } from "@cueplusplus/theme-base";
+import { clampChroma, converter, formatHex, inGamut, parse } from "culori";
+import tokensBase from "@cueplusplus/tokens/base.json" with { type: "json" };
+//#region src/theming/create-theme.ts
+/**
+* `createTheme()` — the typed generator behind the spec's second theming tier.
+*
+* Three things it is not, because each of them is a trap this deliberately
+* avoids:
+*
+* - **Not a runtime engine.** It is a pure function of its arguments, called at
+*   build time (or once, in the configurator's export dialog), and what comes
+*   out is a plain `[data-theme]` stylesheet — tier 1, the guaranteed contract.
+*   Nothing about a shipped app depends on this module existing.
+* - **Not a palette generator.** Handed a preset and nothing else it returns the
+*   preset, byte for byte. Derivation is what happens to the tokens hanging off
+*   an anchor you actually moved, and only those: swap the accent and the hover,
+*   the ink on it, the focus ring and the selection wash follow; the ground, the
+*   ink and the five status tones do not. That rule is the whole reason
+*   "start from `terminal`, make it orange" is a two-line call rather than a
+*   fork of a palette.
+* - **Not a colour opinion.** Every derivation happens in oklch, where a
+*   lightness step is a step the eye agrees with, and every result is measured
+*   against WCAG before you are told it is fine. A failing pair comes back in
+*   the report rather than being silently repaired — with one exception, noted
+*   below, where the value was this module's invention in the first place.
+*/
+/**
+* The colour tokens every theme block declares, in the order the contract lists
+* them.
+*
+* Not a list this module owns any more, and not a copy of one: it *is*
+* `COLOR_CONTRACT`, re-exported under the name this package's public API has
+* always used. The two were byte-identical — twenty-six names, same order —
+* because the copy was written from the contract in the first place, and a
+* second list that has to agree with the first is a drift test waiting to be
+* written. `test/theming/create-theme.test.ts` asserts the identity, so a future
+* edit that quietly reintroduces a local array fails rather than diverges.
+*/
+const THEME_COLOR_TOKENS = COLOR_CONTRACT;
+/**
+* The radius multiplier each density level contributes.
+*
+* Geometry belongs to the density axis, so a theme that wants rounder corners
+* cannot simply declare `--cue-radius-scale`: its block would outrank the density
+* block and freeze ultra-compact's 0.75 at 1. {@link createTheme} instead
+* multiplies the two and emits one crossed rule per density that differs from the
+* default — which is why this ladder has to be known here.
+*
+* `Number(…)` because `base.json` is DTCG, where every value is text: the scale
+* arrives as `"0.75"` and what happens to it next is arithmetic. Keyed by the
+* base five alone, because those are the rungs a build-time generator can know
+* the geometry of; a rung a theme adds carries its own radius in its manifest.
+*/
+const DENSITY_RADIUS_SCALE = Object.fromEntries(Object.keys(tokensBase.densities).map((rung) => [rung, Number(tokensBase.densities[rung]["radius-scale"])]));
+/** The default density, whose radius scale the uncrossed theme block carries. */
+const DEFAULT_DENSITY_LEVEL = tokensBase.defaults.density;
+/**
+* How far the sunken ground sits below the page, in oklch lightness.
+*
+* Small on purpose: sunken is a well, not a second theme. Across the ten
+* shipped presets the authored gap runs −0.011 to −0.031.
+*/
+const SUNKEN_LIGHTNESS_STEP = -.02;
+/**
+* The three raised surfaces, as lightness above the ground.
+*
+* Even spacing, because the ladder encodes *elevation* and a reader counts
+* rungs. The shipped presets cluster around these three values.
+*/
+const SURFACE_LIGHTNESS_STEPS = [
+	.03,
+	.05,
+	.07
+];
+/**
+* The hairline and its stronger sibling, as lightness above the ground.
+*
+* Above the top surface, so a border still reads as a line when it is drawn on
+* `surface-3`. `border-overlay` reuses the strong value: an overlay floats over
+* everything, so its rim has to hold against the brightest thing under it.
+*/
+const BORDER_LIGHTNESS_STEPS = [.08, .14];
+/** How far secondary ink recedes from primary ink. */
+const FG_MUTED_LIGHTNESS_STEP = -.25;
+/** How far tertiary ink recedes from primary ink. */
+const FG_SUBTLE_LIGHTNESS_STEP = -.45;
+/**
+* Chroma each rung of the ink ramp keeps from the rung above.
+*
+* Ink greys as it recedes rather than staying saturated: a muted label that held
+* full chroma would read as a *coloured* label — a status, a link — instead of a
+* quiet one. The hue is preserved throughout, so the ramp still belongs to the
+* theme. `fg-subtle` takes the square, being two rungs down.
+*/
+const INK_RAMP_CHROMA_SCALE = .6;
+/** How far the accent darkens on hover. */
+const ACCENT_HOVER_LIGHTNESS_STEP = -.05;
+/** How much accent a derived selection wash carries. */
+const SELECTION_ACCENT_PERCENT = 22;
+/** What a label on a solid accent has to reach before this module accepts it. */
+const ACCENT_FG_MINIMUM = WCAG_AA_TEXT;
+/**
+* How much of the dark ground's lightness survives the flip to paper.
+*
+* A ground's job is to be the extreme, so inverting it means going to the *other*
+* extreme rather than to the arithmetic mirror: `1 − L` of a 0.16 near-black is a
+* 0.84 mid-grey, which is not a page. Compressing instead maps the ladder of
+* dark grounds onto a narrow paper band — a deeper dark theme gets a cleaner
+* white page — and lands within 0.01 of all ten authored light presets.
+*/
+const LIGHT_GROUND_COMPRESSION = .1;
+/** Lightness a derived light colour steps down by while hunting for contrast. */
+const LIGHT_DARKEN_STEP = .02;
+/** How many steps that hunt may take before it gives up and returns its darkest. */
+const LIGHT_DARKEN_LIMIT = 40;
+const toOklch = converter("oklch");
+const inSrgb = inGamut("rgb");
+/** Read an anchor into oklch, or say which anchor could not be read. */
+function readColor(value, label) {
+	const color = toOklch(parse(value));
+	if (color === void 0) throw new TypeError(`${label} is not a colour: ${JSON.stringify(value)}`);
+	return {
+		mode: "oklch",
+		l: color.l,
+		c: color.c,
+		h: color.h ?? 0
+	};
+}
+/**
+* Print a derived colour.
+*
+* Chroma is **clamped** into sRGB rather than clipped — clipping a too-saturated
+* step turns it into a different hue, whereas clamping only gives up the
+* saturation no display was going to show. Then it goes out through the same
+* formatter the colour picker writes with, so a generated token and a
+* hand-picked one are spelled the same way.
+*/
+function emit(color) {
+	const hex = formatHex(inSrgb(color) ? color : clampChroma(color, "oklch", "rgb"));
+	return formatColorString(hex, "oklch") ?? hex;
+}
+const clampLightness = (lightness) => Math.min(1, Math.max(0, lightness));
+/** The same hue, moved along the lightness axis and optionally greyed. */
+function shift(color, delta, chromaScale = 1) {
+	return emit({
+		mode: "oklch",
+		l: clampLightness(color.l + delta),
+		c: color.c * chromaScale,
+		h: color.h
+	});
+}
+/**
+* The candidate that can be read on `ground`, preferring the theme's own ink.
+*
+* Tried in order: the colours the theme already owns, then pure black and white
+* as a last resort. A theme's own ground or ink keeps the palette coherent; the
+* fallback exists because an accent at mid lightness contrasts with neither.
+*/
+function pickInk(ground, candidates) {
+	let best = candidates[0] ?? "#000000";
+	let bestRatio = -1;
+	for (const candidate of candidates) {
+		const ratio = contrastRatio(candidate, ground);
+		if (ratio > bestRatio) [best, bestRatio] = [candidate, ratio];
+	}
+	if (bestRatio >= ACCENT_FG_MINIMUM) return best;
+	for (const candidate of ["#000000", "#ffffff"]) {
+		const ratio = contrastRatio(candidate, ground);
+		if (ratio > bestRatio) [best, bestRatio] = [candidate, ratio];
+	}
+	return best;
+}
+/**
+* Darken a colour until it can be read on `ground`.
+*
+* Only ever applied to values this module invented — the light variant's accent
+* and status tones, which have to survive being moved from a near-black ground
+* to paper. An authored colour is never quietly adjusted; it is reported.
+*/
+function darkenToContrast(value, ground, minimum, label) {
+	const start = readColor(value, label);
+	for (let step = 0; step <= LIGHT_DARKEN_LIMIT; step += 1) {
+		const candidate = emit({
+			...start,
+			l: clampLightness(start.l - step * LIGHT_DARKEN_STEP)
+		});
+		if (contrastRatio(candidate, ground) >= minimum) return candidate;
+	}
+	return emit({
+		...start,
+		l: clampLightness(start.l - LIGHT_DARKEN_LIMIT * LIGHT_DARKEN_STEP)
+	});
+}
+/** Own-property lookup that admits a token may be absent. */
+function lookup(map, token) {
+	return map != null && Object.hasOwn(map, token) ? map[token] : void 0;
+}
+/**
+* A derived selection wash, as a live expression rather than a resolved colour.
+*
+* `var(--cue-accent)` is a self-reference — it resolves inside whichever block
+* declares it — so one string is correct in the dark block and the light one,
+* and stays correct if a consumer overrides the accent in tier 1 later.
+*/
+const SELECTION_WASH = `color-mix(in oklch, var(--cue-accent) 22%, transparent)`;
+/**
+* The five tones plus the live hue, in the order the colour contract lists them.
+*
+* `stream` resolves exactly like a status — authored, never derived from the
+* accent, and darkened to the non-text floor when a light block has to be
+* invented — but it is not a `tone` any component takes. See
+* `ThemeAnchors.status`.
+*/
+const TINTED = [...[
+	"ok",
+	"busy",
+	"warn",
+	"danger",
+	"info"
+], "stream"];
+/**
+* The tones that are also *grounds*, in contract order.
+*
+* Every other status colour is only ever a signal — a dot, a rim, a wash — and
+* whatever text sits near it sits on a surface. These two get filled: the amber
+* carries the confirm on a consequential press and the red the confirm on an
+* irreversible one, and text on a fill is text. So each gets an ink derived
+* against itself, `warn-fg` and `danger-fg`.
+*/
+const INKED = ["warn", "danger"];
+/** The three raised surfaces, in ladder order. */
+const SURFACES = [
+	"surface-1",
+	"surface-2",
+	"surface-3"
+];
+/**
+* Resolve the dark block.
+*
+* The shape of every branch is the same: an explicit override wins; otherwise
+* the preset's value stands *unless the anchor this token hangs off has moved*;
+* only then is anything derived.
+*/
+function resolveDark(anchors, preset) {
+	const colors = {};
+	const authored = /* @__PURE__ */ new Set();
+	const surfaces = anchors.surfaces ?? {};
+	const status = anchors.status ?? {};
+	/**
+	* One token. `derive` is omitted for the anchors themselves — a preset that
+	* declares no ground is not something to paper over with an invented one.
+	*/
+	const define = (token, explicit, moved, derive) => {
+		if (explicit !== void 0) {
+			readColor(explicit, token);
+			colors[token] = explicit;
+			return;
+		}
+		const inherited = lookup(preset, token);
+		if (!moved && inherited !== void 0) {
+			colors[token] = inherited;
+			authored.add(token);
+			return;
+		}
+		if (derive === void 0) throw new TypeError(`the base preset declares no ${token}`);
+		colors[token] = derive();
+	};
+	const groundMoved = anchors.bg !== void 0;
+	const inkMoved = anchors.fg !== void 0;
+	const accentMoved = anchors.accent !== void 0;
+	define("bg", anchors.bg, false);
+	const ground = readColor(colors["bg"], "bg");
+	define("sunken", surfaces.sunken, groundMoved, () => shift(ground, SUNKEN_LIGHTNESS_STEP));
+	SURFACES.forEach((token, index) => {
+		define(token, surfaces[token], groundMoved, () => shift(ground, SURFACE_LIGHTNESS_STEPS[index]));
+	});
+	define("fg", anchors.fg, false);
+	const ink = readColor(colors["fg"], "fg");
+	define("fg-muted", void 0, inkMoved, () => shift(ink, FG_MUTED_LIGHTNESS_STEP, INK_RAMP_CHROMA_SCALE));
+	define("fg-subtle", void 0, inkMoved, () => shift(ink, FG_SUBTLE_LIGHTNESS_STEP, INK_RAMP_CHROMA_SCALE ** 2));
+	define("border", void 0, groundMoved, () => shift(ground, BORDER_LIGHTNESS_STEPS[0]));
+	define("border-strong", void 0, groundMoved, () => shift(ground, BORDER_LIGHTNESS_STEPS[1]));
+	define("border-overlay", void 0, groundMoved, () => colors["border-strong"]);
+	define("accent", anchors.accent, false);
+	const accent = colors["accent"];
+	define("accent-hover", void 0, accentMoved, () => shift(readColor(accent, "accent"), ACCENT_HOVER_LIGHTNESS_STEP));
+	define("accent-fg", void 0, accentMoved, () => pickInk(accent, [colors["bg"], colors["fg"]]));
+	for (const tone of TINTED) define(tone, status[tone], false);
+	for (const tone of INKED) define(`${tone}-fg`, void 0, status[tone] !== void 0, () => pickInk(colors[tone], [
+		colors["bg"],
+		colors["sunken"],
+		colors["fg"]
+	]));
+	define("selection", void 0, accentMoved, () => SELECTION_WASH);
+	define("focus", void 0, accentMoved, () => accent);
+	define("data-ground", void 0, false);
+	define("scrim", void 0, false);
+	return {
+		colors,
+		authored
+	};
+}
+/**
+* Resolve the light block.
+*
+* Per token: if the dark value came from the preset untouched and the preset
+* ships a light block, the authored light value stands. Everything else is
+* inverted — which is guesswork, and is why any derivation here marks the report
+* provisional.
+*
+* The inversion is not `1 − L` across the board. The ground goes to paper (see
+* {@link LIGHT_GROUND_COMPRESSION}) and the ladder then steps *down* from it,
+* because paper leaves no headroom above: a "raised" surface on a white page is
+* the slightly grey one, and the sunken well — the one rung that cannot keep its
+* sign — folds to the far end, which is still the deepest thing on the page.
+*/
+function resolveLight(dark, preset) {
+	const colors = {};
+	let provisional = false;
+	const define = (token, derive) => {
+		const inherited = dark.authored.has(token) ? lookup(preset, token) : void 0;
+		if (inherited !== void 0) {
+			colors[token] = inherited;
+			return;
+		}
+		colors[token] = derive();
+		provisional = true;
+	};
+	const darkGround = readColor(dark.colors["bg"], "bg");
+	define("bg", () => emit({
+		mode: "oklch",
+		l: clampLightness(1 - LIGHT_GROUND_COMPRESSION * darkGround.l),
+		c: darkGround.c,
+		h: darkGround.h
+	}));
+	const paper = readColor(colors["bg"], "bg");
+	/** Deepest rung: past the top surface by the sunken step. */
+	const sunkenDepth = (SURFACE_LIGHTNESS_STEPS.at(-1) ?? 0) + Math.abs(SUNKEN_LIGHTNESS_STEP);
+	define("sunken", () => shift(paper, -sunkenDepth));
+	SURFACES.forEach((token, index) => {
+		define(token, () => shift(paper, -SURFACE_LIGHTNESS_STEPS[index]));
+	});
+	const darkInk = readColor(dark.colors["fg"], "fg");
+	define("fg", () => emit({
+		mode: "oklch",
+		l: clampLightness(1 - darkInk.l),
+		c: darkInk.c,
+		h: darkInk.h
+	}));
+	const ink = readColor(colors["fg"], "fg");
+	define("fg-muted", () => shift(ink, .25, INK_RAMP_CHROMA_SCALE));
+	define("fg-subtle", () => shift(ink, .45, INK_RAMP_CHROMA_SCALE ** 2));
+	define("border", () => shift(paper, -BORDER_LIGHTNESS_STEPS[0]));
+	define("border-strong", () => shift(paper, -BORDER_LIGHTNESS_STEPS[1]));
+	define("border-overlay", () => colors["border-strong"]);
+	const paperGround = colors["bg"];
+	define("accent", () => darkenToContrast(dark.colors["accent"], paperGround, WCAG_AA_TEXT, "accent"));
+	const accent = colors["accent"];
+	define("accent-hover", () => shift(readColor(accent, "accent"), ACCENT_HOVER_LIGHTNESS_STEP));
+	define("accent-fg", () => pickInk(accent, [colors["bg"], colors["fg"]]));
+	for (const tone of TINTED) define(tone, () => darkenToContrast(dark.colors[tone], paperGround, WCAG_AA_NON_TEXT, tone));
+	for (const tone of INKED) define(`${tone}-fg`, () => pickInk(colors[tone], [
+		colors["bg"],
+		colors["sunken"],
+		colors["fg"]
+	]));
+	define("selection", () => SELECTION_WASH);
+	define("focus", () => accent);
+	define("data-ground", () => dark.colors["data-ground"]);
+	define("scrim", () => dark.colors["scrim"]);
+	return {
+		colors,
+		provisional
+	};
+}
+/**
+* The font declarations a theme block carries.
+*
+* The monospace lands on `--cue-font-theme-mono`, not on `--cue-font-mono`, and
+* the shared token is restated as the resolution of the two axes' halves —
+* exactly what a shipped preset's block does. A generated theme that wrote the
+* shared token directly would beat a `[data-font]` pairing stamped on any
+* ancestor, purely by sitting nearer to the text, and a consumer's own preset
+* would be the one preset in the system the typeface picker could not move.
+*/
+function resolveFonts$1(anchors, preset) {
+	const fonts = anchors.fonts ?? {};
+	const declared = [];
+	if (fonts.sans !== void 0) declared.push(["font-sans", fonts.sans]);
+	declared.push(["font-theme-mono", fonts.mono ?? lookup(preset, "font-mono") ?? tokensBase.base["font-mono"]]);
+	if (fonts.display !== void 0) declared.push(["font-display", fonts.display]);
+	return [...declared.map(([name, value]) => [tokenProperty(name), assertCssValue(name, value)]), [tokenProperty("font-mono"), RESOLVED_MONO]];
+}
+/** Round a product of two scales to something a stylesheet can print. */
+const scaled = (a, b) => String(Number((a * b).toFixed(4)));
+/**
+* The radius rules for a theme that asked for one.
+*
+* Geometry belongs to the density axis, so the multiplier is **crossed** with it
+* rather than declared flat: an uncrossed `--cue-radius-scale` in a theme block
+* outranks the density block that set it and would freeze `ultra-compact`'s 0.75
+* at 1. The base block carries the product for the default density — that is the
+* value an unstamped document falls back to — and every density whose own scale
+* differs gets one crossed rule.
+*/
+function radiusBlocks(name, radiusScale) {
+	const property = tokenProperty("radius-scale");
+	const fallback = DENSITY_RADIUS_SCALE[DEFAULT_DENSITY_LEVEL];
+	const blocks = [];
+	for (const [level, scale] of Object.entries(DENSITY_RADIUS_SCALE)) {
+		if (scale === fallback) continue;
+		blocks.push({
+			selector: themeSelector(name, {
+				density: level,
+				pair: true
+			}),
+			sections: [{ declarations: [[property, scaled(radiusScale, scale)]] }]
+		});
+	}
+	return {
+		base: [[property, scaled(radiusScale, fallback)]],
+		blocks
+	};
+}
+/** `[--cue-token, value]` pairs, in the order the contract lists them. */
+function colorDeclarations(colors) {
+	return THEME_COLOR_TOKENS.map((token) => [tokenProperty(token), colors[token]]);
+}
+const DERIVED_COMMENT = "derived — kept inside the block so color-mix() reads this theme's values";
+const FONT_COMMENT = "font — the theme's override, or the base stack restated";
+const SHAPE_COMMENT = "shape — crossed with the density ladder below, never flat";
+/**
+* Generate a theme: a stylesheet, its token map, and a contrast report.
+*
+* Pure and synchronous. Call it in a build script, in a test, or in the
+* configurator's export dialog — never in a render path, because there is
+* nothing here a stylesheet is not already doing faster.
+*
+* @param anchors - The name, the manifest to start from, and whatever you moved.
+* @returns The stylesheet, the resolved tokens for both modes, and the report.
+* @throws TypeError if the name is not a CSS identifier, an anchor is not a
+*   colour, a font stack carries CSS punctuation, or `base` is a theme *name*
+*   rather than a manifest.
+* @example
+* const { css, report } = createTheme({ name: "acme", accent: "#ff8800" });
+* if (!report.passes) console.warn(report.failures);
+*/
+function createTheme(anchors) {
+	const name = assertThemeName(anchors.name);
+	if (typeof anchors.base === "string") throw new TypeError(`base is a manifest, not a name — import it from @cueplusplus/theme-${anchors.base}`);
+	const base = anchors.base ?? null;
+	const preset = {
+		dark: resolve(base, { mode: "dark" }).colors,
+		light: base === null || base.supportsLight ? resolve(base, { mode: "light" }).colors : null,
+		fonts: base?.fonts ?? {}
+	};
+	if (anchors.radiusScale !== void 0 && !(anchors.radiusScale > 0)) throw new TypeError(`radiusScale must be a positive number, got ${anchors.radiusScale}`);
+	const dark = resolveDark(anchors, preset.dark);
+	const light = anchors.supportsLight ?? preset.light !== null ? resolveLight(dark, preset.light) : null;
+	const derived = Object.entries(derivedTokens());
+	const fonts = resolveFonts$1(anchors, preset.fonts);
+	const radius = anchors.radiusScale === void 0 ? null : radiusBlocks(name, anchors.radiusScale);
+	const darkPaletteSections = [
+		{ declarations: colorDeclarations(dark.colors) },
+		{
+			comment: DERIVED_COMMENT,
+			declarations: derived
+		},
+		{
+			comment: FONT_COMMENT,
+			declarations: fonts
+		}
+	];
+	const darkSections = [...darkPaletteSections, ...radius === null ? [] : [{
+		comment: SHAPE_COMMENT,
+		declarations: radius.base
+	}]];
+	const lightSections = light === null ? null : [{ declarations: colorDeclarations(light.colors) }, {
+		comment: DERIVED_COMMENT,
+		declarations: derived
+	}];
+	const blocks = [
+		{
+			selector: themeSelector(name),
+			colorScheme: "dark",
+			sections: darkSections
+		},
+		...lightSections === null ? [] : [{
+			selector: themeSelector(name, { mode: "light" }),
+			colorScheme: "light",
+			sections: lightSections
+		}],
+		...radius?.blocks ?? []
+	];
+	const inputs = [{
+		mode: "dark",
+		tokens: dark.colors
+	}, ...light === null ? [] : [{
+		mode: "light",
+		tokens: light.colors,
+		provisional: light.provisional
+	}]];
+	return {
+		name,
+		css: `${serializeThemeCss(blocks, { banner: `@cueplusplus/ui — theme "${name}"` }).trimEnd()}\n\n${serializeSystemModeAliases(name, [{
+			mode: "dark",
+			colorScheme: "light dark",
+			sections: darkPaletteSections
+		}, {
+			mode: "light",
+			colorScheme: "light dark",
+			sections: lightSections ?? darkPaletteSections
+		}])}\n`,
+		tokens: Object.fromEntries(darkSections.flatMap((section) => section.declarations)),
+		light: light === null ? null : Object.fromEntries([...colorDeclarations(light.colors), ...derived]),
+		report: contrastReport(inputs)
+	};
+}
+//#endregion
+export { ACCENT_FG_MINIMUM, ACCENT_HOVER_LIGHTNESS_STEP, BORDER_LIGHTNESS_STEPS, DEFAULT_DENSITY_LEVEL, DENSITY_RADIUS_SCALE, FG_MUTED_LIGHTNESS_STEP, FG_SUBTLE_LIGHTNESS_STEP, INK_RAMP_CHROMA_SCALE, LIGHT_GROUND_COMPRESSION, SELECTION_ACCENT_PERCENT, SUNKEN_LIGHTNESS_STEP, SURFACE_LIGHTNESS_STEPS, THEME_COLOR_TOKENS, createTheme };

package/dist/theming/index.d.ts

@@ -0,0 +1,4 @@
+import { CONTRAST_REQUIREMENTS, ContrastCheck, ContrastInput, ContrastReport, ContrastRequirement, WCAG_AAA_TEXT, WCAG_AA_NON_TEXT, WCAG_AA_TEXT, contrastRatio, contrastReport, relativeLuminance } from "./contrast.js";
+import { ACCENT_FG_MINIMUM, ACCENT_HOVER_LIGHTNESS_STEP, BORDER_LIGHTNESS_STEPS, CreatedTheme, FG_MUTED_LIGHTNESS_STEP, FG_SUBTLE_LIGHTNESS_STEP, INK_RAMP_CHROMA_SCALE, LIGHT_GROUND_COMPRESSION, SELECTION_ACCENT_PERCENT, SUNKEN_LIGHTNESS_STEP, SURFACE_LIGHTNESS_STEPS, THEME_COLOR_TOKENS, ThemeAnchors, ThemeColorToken, createTheme } from "./create-theme.js";
+import { CUE_TOKEN_PREFIX, DERIVED_TOKEN_TEMPLATES, RESOLVED_MONO, SerializeThemeCssOptions, THEME_NAME_PATTERN, ThemeBlock, ThemeBlockSection, ThemeSelectorOptions, assertCssValue, assertThemeName, derivedTokens, serializeThemeBlock, serializeThemeCss, themeSelector, tokenProperty } from "./serialize.js";
+export { ACCENT_FG_MINIMUM, ACCENT_HOVER_LIGHTNESS_STEP, BORDER_LIGHTNESS_STEPS, CONTRAST_REQUIREMENTS, CUE_TOKEN_PREFIX, type ContrastCheck, type ContrastInput, type ContrastReport, type ContrastRequirement, type CreatedTheme, DERIVED_TOKEN_TEMPLATES, FG_MUTED_LIGHTNESS_STEP, FG_SUBTLE_LIGHTNESS_STEP, INK_RAMP_CHROMA_SCALE, LIGHT_GROUND_COMPRESSION, RESOLVED_MONO, SELECTION_ACCENT_PERCENT, SUNKEN_LIGHTNESS_STEP, SURFACE_LIGHTNESS_STEPS, type SerializeThemeCssOptions, THEME_COLOR_TOKENS, THEME_NAME_PATTERN, type ThemeAnchors, type ThemeBlock, type ThemeBlockSection, type ThemeColorToken, type ThemeSelectorOptions, WCAG_AAA_TEXT, WCAG_AA_NON_TEXT, WCAG_AA_TEXT, assertCssValue, assertThemeName, contrastRatio, contrastReport, createTheme, derivedTokens, relativeLuminance, serializeThemeBlock, serializeThemeCss, themeSelector, tokenProperty };

package/dist/theming/index.js

@@ -0,0 +1,4 @@
+import { CONTRAST_REQUIREMENTS, WCAG_AAA_TEXT, WCAG_AA_NON_TEXT, WCAG_AA_TEXT, contrastRatio, contrastReport, relativeLuminance } from "./contrast.js";
+import { CUE_TOKEN_PREFIX, DERIVED_TOKEN_TEMPLATES, RESOLVED_MONO, THEME_NAME_PATTERN, assertCssValue, assertThemeName, derivedTokens, serializeThemeBlock, serializeThemeCss, themeSelector, tokenProperty } from "./serialize.js";
+import { ACCENT_FG_MINIMUM, ACCENT_HOVER_LIGHTNESS_STEP, BORDER_LIGHTNESS_STEPS, FG_MUTED_LIGHTNESS_STEP, FG_SUBTLE_LIGHTNESS_STEP, INK_RAMP_CHROMA_SCALE, LIGHT_GROUND_COMPRESSION, SELECTION_ACCENT_PERCENT, SUNKEN_LIGHTNESS_STEP, SURFACE_LIGHTNESS_STEPS, THEME_COLOR_TOKENS, createTheme } from "./create-theme.js";
+export { ACCENT_FG_MINIMUM, ACCENT_HOVER_LIGHTNESS_STEP, BORDER_LIGHTNESS_STEPS, CONTRAST_REQUIREMENTS, CUE_TOKEN_PREFIX, DERIVED_TOKEN_TEMPLATES, FG_MUTED_LIGHTNESS_STEP, FG_SUBTLE_LIGHTNESS_STEP, INK_RAMP_CHROMA_SCALE, LIGHT_GROUND_COMPRESSION, RESOLVED_MONO, SELECTION_ACCENT_PERCENT, SUNKEN_LIGHTNESS_STEP, SURFACE_LIGHTNESS_STEPS, THEME_COLOR_TOKENS, THEME_NAME_PATTERN, WCAG_AAA_TEXT, WCAG_AA_NON_TEXT, WCAG_AA_TEXT, assertCssValue, assertThemeName, contrastRatio, contrastReport, createTheme, derivedTokens, relativeLuminance, serializeThemeBlock, serializeThemeCss, themeSelector, tokenProperty };