@unpunnyfuns/swatchbook-blocks 0.12.0 → 0.13.1

package/dist/index.mjs

@@ -5,6 +5,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { addons } from "storybook/preview-api";
 import { axes, css, cssVarPrefix, defaultTheme, diagnostics, presets, themes, themesResolved } from "virtual:swatchbook/tokens";
 import cx from "clsx";
+import { analyzeAxisVariance } from "@unpunnyfuns/swatchbook-core/variance";
 //#region src/format-color.ts
 const COLOR_FORMATS = [
 	"hex",
@@ -2136,7 +2137,13 @@ function AxisVariance({ path }) {
 	const tokenType = token?.$type;
 	const isColor = tokenType === "color";
 	const formatFn = (t) => valueFor(t, tokenType, colorFormat);
-	const variance = useMemo(() => analyzeVariance(path, axes, themes, themesResolved), [
+	const variance = useMemo(() => {
+		const result = analyzeAxisVariance(path, axes, themes, themesResolved);
+		return {
+			kind: result.kind === "constant" ? "constant" : result.kind === "single" ? "one-axis" : "multi-axis",
+			varyingAxes: result.varyingAxes
+		};
+	}, [
 		path,
 		axes,
 		themes,
@@ -2298,54 +2305,12 @@ function valueFor(token, $type, format) {
 	if (!token) return "—";
 	return formatTokenValue(token.$value, $type, format);
 }
-/**
-* Stable key for variance detection — compares structural equality across
-* themes, not a display string. We pin `raw` so color representation
-* changes (the toolbar's format dropdown) don't artificially make axes
-* look like they vary.
-*/
-function varianceKey(themesResolved, themeName, path) {
-	const t = themesResolved[themeName]?.[path];
-	if (!t) return "";
-	return JSON.stringify(t.$value);
-}
 function tupleName(themes, tuple) {
 	return themes.find((t) => {
 		const input = t.input;
 		return Object.keys(input).every((k) => input[k] === tuple[k]);
 	})?.name;
 }
-function analyzeVariance(path, axes, themes, themesResolved) {
-	const varyingAxes = [];
-	for (const axis of axes) {
-		const byOthers = /* @__PURE__ */ new Map();
-		for (const theme of themes) {
-			const others = axes.filter((a) => a.name !== axis.name).map((a) => `${a.name}=${theme.input[a.name] ?? ""}`).join("|");
-			const ctx = theme.input[axis.name] ?? "";
-			const bucket = byOthers.get(others) ?? /* @__PURE__ */ new Map();
-			bucket.set(ctx, varianceKey(themesResolved, theme.name, path));
-			byOthers.set(others, bucket);
-		}
-		let varies = false;
-		for (const bucket of byOthers.values()) if (new Set(bucket.values()).size > 1) {
-			varies = true;
-			break;
-		}
-		if (varies) varyingAxes.push(axis.name);
-	}
-	if (varyingAxes.length === 0) return {
-		kind: "constant",
-		varyingAxes
-	};
-	if (varyingAxes.length === 1) return {
-		kind: "one-axis",
-		varyingAxes
-	};
-	return {
-		kind: "multi-axis",
-		varyingAxes
-	};
-}
 //#endregion
 //#region src/token-detail/CompositeBreakdown.tsx
 function CompositeBreakdown({ path }) {