@animus-ui/extract 0.1.0-next.v7 → 0.1.1-beta.2

package/dist/index.cjs

@@ -0,0 +1,393 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let fs = require("fs");
+let _animus_ui_properties = require("@animus-ui/properties");
+//#region pipeline/assemble-stylesheet.ts
+/**
+* The 7 Animus cascade layers. Always prefixed with `anm-` to avoid
+* collision with other frameworks' layer names (e.g., Tailwind's `base`).
+*/
+const ANIMUS_LAYERS = [
+	"anm-global",
+	"anm-base",
+	"anm-variants",
+	"anm-compounds",
+	"anm-states",
+	"anm-system",
+	"anm-custom"
+];
+/**
+* Build the `@layer` declaration line.
+*
+* When `isCustom` is false (default layers), uses ANIMUS_LAYERS directly.
+* When `isCustom` is true, passes names through as-is — the consumer already
+* wrote the final names including the `anm-` prefixed entries.
+*/
+function buildLayerDeclaration(layers, isCustom) {
+	return `@layer ${(isCustom ? layers : [...ANIMUS_LAYERS]).join(", ")};\n`;
+}
+/**
+* Validate that a consumer `layers` array contains all 7 Animus layers
+* in the correct relative order. Consumer layers may be interleaved.
+*
+* @throws Error with descriptive message on violation
+*/
+function validateLayerOrder(layers) {
+	const expected = [...ANIMUS_LAYERS];
+	let cursor = 0;
+	for (const layer of layers) if (cursor < expected.length && layer === expected[cursor]) cursor++;
+	if (cursor < expected.length) {
+		const missing = expected.slice(cursor);
+		const found = expected.slice(0, cursor);
+		if (!expected.every((l) => layers.includes(l))) {
+			const absent = expected.filter((l) => !layers.includes(l));
+			throw new Error(`[animus-extract] Custom layers missing required layers: ${absent.join(", ")}. All 7 Animus layers must be present: ${expected.join(", ")}`);
+		}
+		throw new Error(`[animus-extract] Custom layers have wrong order. Found ${found.join(", ")} but then expected ${missing[0]}. Required order: (${expected.join(" < ")}). You may interleave custom layers but must preserve this subsequence.`);
+	}
+}
+/**
+* Strip a leading `@layer ...;` declaration line from CSS if present.
+* The Rust crate embeds this in prod-mode output; we strip it so the
+* shared assembler controls placement.
+*/
+function stripLeadingLayerDeclaration(css) {
+	return css.replace(/^@layer\s+[^;{]+;\s*\n?/, "");
+}
+function assembleStylesheet(options) {
+	const hasCustomLayers = !!options.layers;
+	const layers = options.layers ?? ANIMUS_LAYERS;
+	if (options.layers) validateLayerOrder(options.layers);
+	const declaration = buildLayerDeclaration(layers, hasCustomLayers);
+	const variables = options.variableCss || "";
+	const componentCss = options.componentCss ? stripLeadingLayerDeclaration(options.componentCss) : "";
+	const body = [options.globalCss || "", componentCss].filter(Boolean).join("\n");
+	if (options.split) return {
+		declaration,
+		variables,
+		body
+	};
+	return [
+		declaration,
+		variables,
+		body
+	].filter(Boolean).join("\n");
+}
+//#endregion
+//#region pipeline/discover-packages.ts
+/**
+* Extract external DS package names from `includes` declarations in the system file.
+*
+* Supports two forms:
+*   - Primary (1.0+):  `createSystem({ includes: [identifier, ...] })` constructor arg
+*   - Legacy:          `.includes([identifier, ...])` chain method (RC migration fallback)
+*
+* For each identifier found, traces back to its import declaration and returns
+* the import specifier. Only packages explicitly declared via `includes` are treated
+* as external DS dependencies.
+*
+* Falls back to empty array if no `includes` declaration is found.
+*/
+function extractSystemFilePackages(systemFilePath) {
+	let source;
+	try {
+		source = (0, fs.readFileSync)(systemFilePath, "utf-8");
+	} catch {
+		return [];
+	}
+	const identifiers = /* @__PURE__ */ new Set();
+	const constructorRegex = /createSystem\s*\(\s*\{[^}]*?\bincludes\s*:\s*\[([^\]]*)\]/gs;
+	const chainRegex = /\.includes\s*\(\s*\[([^\]]*)\]\s*\)/gs;
+	const collectIdentifiers = (regex) => {
+		let match;
+		while ((match = regex.exec(source)) !== null) {
+			const inner = match[1];
+			for (const token of inner.split(",")) {
+				const id = token.trim();
+				if (id && /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(id)) identifiers.add(id);
+			}
+		}
+	};
+	collectIdentifiers(constructorRegex);
+	collectIdentifiers(chainRegex);
+	if (identifiers.size === 0) return [];
+	const importMap = /* @__PURE__ */ new Map();
+	const importRegex = /^\s*import\s+(?:([a-zA-Z_$][a-zA-Z0-9_$]*)\s*,\s*)?(?:\{([^}]*)\}|([a-zA-Z_$][a-zA-Z0-9_$]*))\s+from\s+['"]([^'"]+)['"]/gm;
+	let importMatch;
+	while ((importMatch = importRegex.exec(source)) !== null) {
+		const [, comboDefault, namedImports, defaultImport, specifier] = importMatch;
+		if (comboDefault) importMap.set(comboDefault, specifier);
+		if (defaultImport) importMap.set(defaultImport, specifier);
+		if (namedImports) for (const binding of namedImports.split(",")) {
+			const parts = binding.trim().split(/\s+as\s+/);
+			const localName = (parts[1] || parts[0]).trim();
+			if (localName) importMap.set(localName, specifier);
+		}
+	}
+	const packages = /* @__PURE__ */ new Set();
+	for (const id of identifiers) {
+		const specifier = importMap.get(id);
+		if (specifier && !specifier.startsWith(".")) {
+			const pkgName = specifier.startsWith("@") ? specifier.split("/").slice(0, 2).join("/") : specifier.split("/")[0];
+			packages.add(pkgName);
+		}
+	}
+	return Array.from(packages);
+}
+//#endregion
+//#region pipeline/mdx-preprocessor.ts
+/**
+* MDX source preprocessor for the extraction pipeline.
+*
+* MDX files are first-class consumers of ds-built components but are not
+* directly parseable by OXC (which the scanner uses for .tsx/.jsx). This
+* module compiles MDX sources to scanner-consumable JSX using @mdx-js/mdx.
+*
+* @mdx-js/mdx is declared as `peerDependenciesMeta.optional` on the
+* plugin packages that import this module. The dynamic import with
+* .catch() ensures non-MDX consumers (who configure `extensions` to
+* exclude .mdx) never trigger the resolution — zero install-footprint
+* cost for them.
+*
+* The `DEFAULT_EXTENSIONS` constant is the shared source of truth for
+* both `@animus-ui/vite-plugin` and `@animus-ui/next-plugin`. Each plugin
+* imports it directly; independent redeclaration of default extensions
+* is considered a regression.
+*/
+const DEFAULT_EXTENSIONS = [
+	".ts",
+	".tsx",
+	".js",
+	".jsx",
+	".mdx"
+];
+/**
+* Preprocess an MDX source string into scanner-consumable JSX.
+*
+* - Returns `{ kind: 'ok', source }` with JSX-compiled output on success.
+* - Returns `{ kind: 'missing-dep' }` if @mdx-js/mdx is not resolvable
+*   (consumer needs to install it).
+* - Returns `{ kind: 'error', error }` on compile failure (e.g. malformed
+*   MDX syntax). Plugins SHALL warn + skip affected files; the build
+*   continues with remaining files.
+*/
+async function preprocessMdx(source, filename) {
+	const mdxMod = await import("@mdx-js/mdx").catch(() => null);
+	if (mdxMod === null) return { kind: "missing-dep" };
+	try {
+		const vfile = await mdxMod.compile(source, {
+			outputFormat: "program",
+			development: false,
+			jsx: true
+		});
+		return {
+			kind: "ok",
+			source: `/* @mdx-source: ${filename} */\n${String(vfile)}`
+		};
+	} catch (err) {
+		return {
+			kind: "error",
+			error: err instanceof Error ? err.message : String(err)
+		};
+	}
+}
+//#endregion
+//#region pipeline/prefix.ts
+/**
+* Apply namespace prefix to a variable map, CSS variable declarations, and theme JSON.
+*
+* Variable map: `{ "colors.ember": "--color-ember" }` -> `{ "colors.ember": "--prefix-color-ember" }`
+* Variable CSS: `--color-ember: #FF2800` -> `--prefix-color-ember: #FF2800`
+*               `var(--color-ember)` -> `var(--prefix-color-ember)`
+* Theme JSON:   `{ "colors.ember": "var(--color-ember)" }` -> `{ "colors.ember": "var(--prefix-color-ember)" }`
+*/
+function applyPrefix(prefix, variableMapJson, variableCss, themeJson, contextualVarsJson) {
+	if (!prefix) return {
+		variableMapJson,
+		variableCss,
+		themeJson,
+		contextualVarsJson
+	};
+	const varRefRe = /var\(--([a-zA-Z][\w-]*)\)/g;
+	const map = JSON.parse(variableMapJson);
+	const prefixed = {};
+	for (const [key, varName] of Object.entries(map)) prefixed[key] = varName.startsWith("--") ? `--${prefix}-${varName.slice(2)}` : varName;
+	let css = variableCss;
+	css = css.replace(/--([a-zA-Z][\w-]*)\s*:/g, `--${prefix}-$1:`);
+	css = css.replace(varRefRe, `var(--${prefix}-$1)`);
+	const result = {
+		variableMapJson: JSON.stringify(prefixed),
+		variableCss: css
+	};
+	if (themeJson) result.themeJson = themeJson.replace(varRefRe, `var(--${prefix}-$1)`);
+	if (contextualVarsJson) {
+		const ctxVars = JSON.parse(contextualVarsJson);
+		const prefixedCtx = {};
+		for (const [scale, names] of Object.entries(ctxVars)) prefixedCtx[scale] = names.map((name) => `${prefix}-${name}`);
+		result.contextualVarsJson = JSON.stringify(prefixedCtx);
+	}
+	return result;
+}
+//#endregion
+//#region pipeline/utils.ts
+/** Convert camelCase CSS property names to kebab-case. */
+function camelToKebab(str) {
+	return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
+}
+//#endregion
+//#region pipeline/resolve-global-styles.ts
+/**
+* Resolve {scale.path} and {scale.path/alpha} token aliases in a CSS value string.
+* Mirrors the Rust theme_resolver's resolve_token_aliases logic.
+*/
+function resolveTokenAliases(value, flat, variableMap) {
+	if (!value.includes("{")) return value;
+	return value.replace(/\{([^}]+)\}/g, (_match, content) => {
+		const slashIdx = content.indexOf("/");
+		const tokenPath = slashIdx >= 0 ? content.slice(0, slashIdx) : content;
+		const alpha = slashIdx >= 0 ? Number.parseInt(content.slice(slashIdx + 1), 10) : null;
+		const flatKey = tokenPath;
+		let resolved;
+		if (variableMap[flatKey]) resolved = `var(${variableMap[flatKey]})`;
+		else if (flat[flatKey] != null) resolved = flat[flatKey];
+		else return `{${content}}`;
+		if (alpha === 0) return "transparent";
+		if (alpha != null && alpha !== 100) return `color-mix(in srgb, ${resolved} ${alpha}%, transparent)`;
+		return resolved;
+	});
+}
+/**
+* Resolve a single CSS value through prop config: scale lookup, transform, token aliases.
+*/
+function resolveValue(raw, config, flat, variableMap, transforms) {
+	let resolved = String(raw);
+	if (config?.scale) {
+		const key = config.scale + "." + raw;
+		if (flat[key] != null) resolved = flat[key];
+	}
+	if (config?.transform && transforms[config.transform]) {
+		const fn = transforms[config.transform];
+		const input = typeof resolved === "string" && !Number.isNaN(Number(resolved)) ? Number(resolved) : resolved;
+		resolved = String(fn(input));
+	}
+	return resolveTokenAliases(resolved, flat, variableMap);
+}
+/**
+* Resolve a block of selectors -> style objects using prop config + theme.
+* @keyframes selectors are resolved with full prop config support.
+*/
+function resolveBlock(selectors, propConfig, flat, variableMap, transforms) {
+	const rules = [];
+	for (const [selector, styleObj] of Object.entries(selectors)) {
+		if (selector.startsWith("@keyframes")) {
+			const frames = [];
+			for (const [pct, frameStyles] of Object.entries(styleObj)) if (typeof frameStyles === "object" && frameStyles !== null) {
+				const decls = [];
+				for (const [prop, raw] of Object.entries(frameStyles)) {
+					const cfg = propConfig[prop];
+					const cssProps = cfg?.properties?.length ? cfg.properties : cfg ? [cfg.property] : [prop];
+					const resolved = resolveValue(raw, cfg, flat, variableMap, transforms);
+					for (const cssProp of cssProps) decls.push(`    ${camelToKebab(cssProp)}: ${resolved};`);
+				}
+				frames.push(`  ${pct} {\n${decls.join("\n")}\n  }`);
+			}
+			rules.push(`${selector} {\n${frames.join("\n")}\n}`);
+			continue;
+		}
+		const decls = [];
+		for (const [prop, raw] of Object.entries(styleObj)) {
+			const config = propConfig[prop];
+			const cssProps = config?.properties?.length ? config.properties : config ? [config.property] : [prop];
+			const resolved = resolveValue(raw, config, flat, variableMap, transforms);
+			for (const cssProp of cssProps) decls.push(`  ${camelToKebab(cssProp)}: ${resolved};`);
+		}
+		if (decls.length) rules.push(`${selector} {\n${decls.join("\n")}\n}`);
+	}
+	return rules.join("\n\n");
+}
+/**
+* Resolve global style blocks into CSS strings.
+*
+* Takes the global style map (block name -> selectors -> props -> values),
+* resolves prop shorthand, scale lookups, transforms, and token aliases,
+* and returns a map of block name -> resolved CSS string.
+*/
+function resolveGlobalStyles(globalStyles, propConfig, flat, variableMap, transforms) {
+	const result = {};
+	for (const [name, block] of Object.entries(globalStyles)) {
+		const resolved = resolveBlock(block, propConfig, flat, variableMap, transforms);
+		if (resolved) result[name] = resolved;
+	}
+	return result;
+}
+//#endregion
+//#region pipeline/resolve-transforms.ts
+/**
+* Resolve __TRANSFORM__ placeholders in extracted CSS.
+*
+* Pattern: `__TRANSFORM__name__rawValue__` -> transform function result.
+* The Rust crate emits these placeholders for CSS values that require
+* JS transform functions (e.g., size, grid) which can't be evaluated in Rust.
+*/
+function resolveTransformPlaceholders(css, transforms) {
+	return css.replace(/__TRANSFORM__(\w+)__(.+?)__/g, (_, name, rawValue) => {
+		const fn = transforms[name];
+		if (!fn) return rawValue;
+		const result = fn(rawValue !== "" && !Number.isNaN(Number(rawValue)) ? Number(rawValue) : rawValue);
+		return typeof result === "object" ? JSON.stringify(result) : String(result);
+	});
+}
+//#endregion
+//#region pipeline/unit-fallback.ts
+/**
+* Append `px` to bare numeric values in CSS declarations for properties
+* that expect length units. Unitless properties are preserved as-is.
+* Numbers inside CSS function calls (cubic-bezier, rgb, calc, etc.) are skipped.
+*/
+function applyUnitFallback(css) {
+	return css.replace(/([a-z-]+)\s*:\s*([^;{}]+);/g, (match, prop, value) => {
+		if (_animus_ui_properties.UNITLESS_PROPERTIES.has(prop)) return match;
+		let depth = 0;
+		let fixed = "";
+		let i = 0;
+		while (i < value.length) if (value[i] === "(") {
+			depth++;
+			fixed += value[i];
+			i++;
+		} else if (value[i] === ")") {
+			depth--;
+			fixed += value[i];
+			i++;
+		} else if (depth > 0) {
+			fixed += value[i];
+			i++;
+		} else {
+			const numMatch = value.slice(i).match(/^(-?\d+\.?\d*)/);
+			if (numMatch) {
+				const num = numMatch[1];
+				const after = value[i + num.length];
+				if (after && /[a-z%]/i.test(after)) fixed += num;
+				else fixed += num + "px";
+				i += num.length;
+			} else {
+				fixed += value[i];
+				i++;
+			}
+		}
+		return fixed !== value ? `${prop}:${fixed};` : match;
+	});
+}
+//#endregion
+exports.ANIMUS_LAYERS = ANIMUS_LAYERS;
+exports.DEFAULT_EXTENSIONS = DEFAULT_EXTENSIONS;
+exports.applyPrefix = applyPrefix;
+exports.applyUnitFallback = applyUnitFallback;
+exports.assembleStylesheet = assembleStylesheet;
+exports.camelToKebab = camelToKebab;
+exports.extractSystemFilePackages = extractSystemFilePackages;
+exports.preprocessMdx = preprocessMdx;
+exports.resolveGlobalStyles = resolveGlobalStyles;
+exports.resolveTokenAliases = resolveTokenAliases;
+exports.resolveTransformPlaceholders = resolveTransformPlaceholders;
+exports.resolveValue = resolveValue;
+exports.stripLeadingLayerDeclaration = stripLeadingLayerDeclaration;
+exports.validateLayerOrder = validateLayerOrder;

package/dist/index.d.ts

@@ -0,0 +1,11 @@
+export type { AssembleStylesheetOptions, AssembleStylesheetParts, } from './assemble-stylesheet';
+export { ANIMUS_LAYERS, assembleStylesheet, stripLeadingLayerDeclaration, validateLayerOrder, } from './assemble-stylesheet';
+export { extractSystemFilePackages } from './discover-packages';
+export type { DefaultExtension, PreprocessMdxResult } from './mdx-preprocessor';
+export { DEFAULT_EXTENSIONS, preprocessMdx } from './mdx-preprocessor';
+export { applyPrefix } from './prefix';
+export { resolveGlobalStyles, resolveTokenAliases, resolveValue, } from './resolve-global-styles';
+export { resolveTransformPlaceholders } from './resolve-transforms';
+export { applyUnitFallback } from './unit-fallback';
+export { camelToKebab } from './utils';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../pipeline/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,yBAAyB,EACzB,uBAAuB,GACxB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EACL,aAAa,EACb,kBAAkB,EAClB,4BAA4B,EAC5B,kBAAkB,GACnB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,YAAY,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAChF,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACvE,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,YAAY,GACb,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,4BAA4B,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC"}