praxis-kit 0.1.0

package/dist/tailwind/index.js

@@ -0,0 +1,767 @@
+import { clsx } from "clsx";
+import { ConsoleReporter, DefaultPolicy, DiagnosticCategory, DiagnosticCode, Diagnostics, Severity } from "../_shared/diagnostics.js";
+import { cva } from "class-variance-authority";
+//#region ../../lib/foundation/src/iterate.ts
+function find(iterable, callback) {
+	for (const value of iterable) {
+		const result = callback(value);
+		if (result != null) return result;
+	}
+	return null;
+}
+function some(iterable, predicate) {
+	for (const value of iterable) if (predicate(value)) return true;
+	return false;
+}
+function every(iterable, predicate) {
+	let index = 0;
+	for (const value of iterable) if (!predicate(value, index++)) return false;
+	return true;
+}
+function* filter(iterable, predicate) {
+	let index = 0;
+	for (const value of iterable) if (predicate(value, index++)) yield value;
+}
+function* map(iterable, callback) {
+	let index = 0;
+	for (const value of iterable) yield callback(value, index++);
+}
+function forEach(iterable, callback) {
+	let index = 0;
+	for (const value of iterable) callback(value, index++);
+}
+function reduce(iterable, initial, callback) {
+	let accumulator = initial;
+	let index = 0;
+	for (const value of iterable) accumulator = callback(accumulator, value, index++);
+	return accumulator;
+}
+/**
+* Transforms an iterable into a Record.
+*
+* The callback returns a `[key, value]` tuple for each element. Returning
+* `null` aborts the collection and causes `collect()` to return `null`.
+*/
+function collect(iterable, callback) {
+	const result = {};
+	let index = 0;
+	for (const value of iterable) {
+		const entry = callback(value, index++);
+		if (entry === null) return null;
+		result[entry[0]] = entry[1];
+	}
+	return result;
+}
+function findLast(value, callback) {
+	for (let index = value.length - 1; index >= 0; index--) {
+		const result = callback(value[index], index);
+		if (result != null) return result;
+	}
+	return null;
+}
+function* items(collection) {
+	for (let i = 0; i < collection.length; i++) {
+		const item = collection.item(i);
+		if (item !== null) yield item;
+	}
+}
+function nodeList(list) {
+	return { *[Symbol.iterator]() {
+		for (let i = 0; i < list.length; i++) {
+			const node = list.item(i);
+			if (node !== null) yield node;
+		}
+	} };
+}
+function mapEntries(m) {
+	return m.entries();
+}
+function set(s) {
+	return s.values();
+}
+function hasOwn(object, key) {
+	return Object.hasOwn(object, key);
+}
+function* entries(object) {
+	for (const key in object) {
+		if (!hasOwn(object, key)) continue;
+		yield [key, object[key]];
+	}
+}
+function* keys(object) {
+	for (const [key] of entries(object)) yield key;
+}
+function* values(object) {
+	for (const [, value] of entries(object)) yield value;
+}
+function mapValues(object, callback) {
+	const result = {};
+	for (const [key, value] of entries(object)) result[key] = callback(value, key);
+	return result;
+}
+function forEachEntry(object, callback) {
+	for (const [key, value] of entries(object)) callback(key, value);
+}
+function forEachKey(object, callback) {
+	for (const key of keys(object)) callback(key);
+}
+function forEachValue(object, callback) {
+	for (const value of values(object)) callback(value);
+}
+function forEachSet(s, callback) {
+	for (const value of s) callback(value);
+}
+const iterate = Object.freeze({
+	entries,
+	filter,
+	find,
+	findLast,
+	forEach,
+	forEachEntry,
+	forEachKey,
+	forEachSet,
+	forEachValue,
+	items,
+	keys,
+	map,
+	mapEntries,
+	mapValues,
+	nodeList,
+	reduce,
+	collect,
+	set,
+	some,
+	every,
+	values
+});
+//#endregion
+//#region ../../lib/foundation/src/assert-never.ts
+function assertNever(value) {
+	throw new Error(`Unexpected value: ${String(value)}`);
+}
+//#endregion
+//#region ../../lib/foundation/src/cn.ts
+function cn(...inputs) {
+	return clsx(...inputs);
+}
+//#endregion
+//#region ../../lib/foundation/src/lru-cache.ts
+/**
+* A bounded cache that evicts the least recently used entry once `maxSize` is
+* exceeded. Backed by a single `Map`, relying on its insertion-order iteration:
+* `get()` promotes a hit to most-recently-used by deleting and re-inserting the
+* key (moving it to the tail), and `set()` evicts the head (oldest) key when
+* over capacity.
+*
+* Consolidates a pattern that was hand-rolled independently in three places
+* (`StaticClassResolver`, `VariantClassResolver`, `AriaPolicyEngine#planCache`)
+* before this existed.
+*/
+var LRUCache = class {
+	#maxSize;
+	#store = /* @__PURE__ */ new Map();
+	constructor(maxSize) {
+		if (!Number.isInteger(maxSize) || maxSize < 1) throw new RangeError("LRUCache maxSize must be a positive integer.");
+		this.#maxSize = maxSize;
+	}
+	get(key) {
+		if (!this.#store.has(key)) return void 0;
+		const value = this.#store.get(key);
+		this.#store.delete(key);
+		this.#store.set(key, value);
+		return value;
+	}
+	set(key, value) {
+		this.#store.delete(key);
+		this.#store.set(key, value);
+		if (this.#store.size > this.#maxSize) {
+			const lru = this.#store.keys().next().value;
+			if (lru !== void 0) this.#store.delete(lru);
+		}
+	}
+	has(key) {
+		return this.#store.has(key);
+	}
+	delete(key) {
+		return this.#store.delete(key);
+	}
+	get size() {
+		return this.#store.size;
+	}
+	clear() {
+		this.#store.clear();
+	}
+};
+//#endregion
+//#region ../../lib/foundation/src/type-guards.ts
+function isString(value) {
+	return typeof value === "string";
+}
+//#endregion
+//#region ../../lib/primitive/src/constants/html/void-tags.ts
+/**
+* HTML void elements.
+*
+* Void elements cannot have child nodes and therefore all share the same
+* empty content model — a WHATWG-stable fact, not a praxis-kit opinion.
+* Single source of truth shared by the contract engine's built-in void-tag
+* children contract (`@praxis-kit/core`'s `VOID_TAGS` re-export) and the
+* Tailwind pipeline's flex/grid-on-void-tag warning, so the two can't drift.
+*/
+const VOID_TAGS = [
+	"area",
+	"base",
+	"br",
+	"col",
+	"embed",
+	"hr",
+	"img",
+	"input",
+	"link",
+	"meta",
+	"param",
+	"source",
+	"track",
+	"wbr"
+];
+//#endregion
+//#region ../../lib/styling/src/cva.ts
+function cva$1(base, config) {
+	const fn = cva(base, config);
+	return (props) => cn(fn(props));
+}
+//#endregion
+//#region ../../lib/styling/src/static-class-resolver.ts
+var StaticClassResolver = class {
+	#baseClass;
+	#cache = new LRUCache(200);
+	#resolveTag;
+	constructor(baseClass, tagMap) {
+		this.#baseClass = Array.isArray(baseClass) ? baseClass.join(" ") : baseClass;
+		this.#resolveTag = tagMap ? (tag) => {
+			const extra = tagMap[tag];
+			if (!extra) return this.#baseClass;
+			const extraStr = Array.isArray(extra) ? extra.join(" ") : extra;
+			return `${this.#baseClass} ${extraStr}`;
+		} : () => this.#baseClass;
+	}
+	resolve(tag, skipTagMap = false) {
+		if (typeof tag !== "string" || skipTagMap) return this.#baseClass;
+		const cached = this.#cache.get(tag);
+		if (cached !== void 0) return cached;
+		const result = this.#resolveTag(tag);
+		this.#cache.set(tag, result);
+		return result;
+	}
+};
+//#endregion
+//#region ../../lib/styling/src/variant-class-resolver.ts
+/**
+* Runtime CVA class resolution with LRU + precomputed-map caching.
+*
+* Distinct from `variant-pass/` — `createVariantPass` is a composable pipeline stage for
+* build-time / plugin use (a `VariantConfig` → classes function), while this is the memoized
+* runtime resolver `createClassPipeline` calls per render.
+*
+* The precomputed map (`compileVariantLookup`, injected by the vite plugin) covers the
+* **no-recipe** combinations only — its keys are variant props alone, whereas this resolver's
+* cache keys are `recipe | variant props`, so a recipe-active call never hits a precomputed
+* entry and falls through to `#compute`. Recipe resolution stays fully runtime by design.
+*/
+var VariantClassResolver = class VariantClassResolver {
+	#cvaFn;
+	#recipeMap;
+	#variantKeys;
+	#precomputedClasses;
+	#cache = new LRUCache(1e3);
+	constructor(cvaFn, recipeMap, variantKeys, precomputedClasses) {
+		this.#cvaFn = cvaFn ?? null;
+		this.#recipeMap = Object.freeze(recipeMap ?? {});
+		this.#variantKeys = variantKeys ?? null;
+		this.#precomputedClasses = precomputedClasses ?? null;
+	}
+	resolve({ props, recipe }) {
+		const normalizedKey = recipe ?? "__none__";
+		const cacheKey = this.#createCacheKey(props, normalizedKey);
+		if (this.#precomputedClasses !== null) {
+			const precomputed = this.#precomputedClasses[cacheKey];
+			if (precomputed !== void 0) return precomputed;
+		}
+		const cached = this.#cache.get(cacheKey);
+		if (cached !== void 0) return cached;
+		const result = this.#compute(props, recipe);
+		this.#cache.set(cacheKey, result);
+		return result;
+	}
+	#compute(props, recipe) {
+		if (!this.#cvaFn) return "";
+		if (recipe === void 0) return this.#cvaFn(props);
+		const preset = this.#recipeMap[recipe];
+		if (!preset) return this.#cvaFn(props);
+		return this.#cvaFn({
+			...preset,
+			...props
+		});
+	}
+	#createCacheKey(props, recipe) {
+		if (this.#variantKeys !== null) {
+			let key = recipe;
+			iterate.forEachSet(this.#variantKeys, (k) => {
+				if (k in props) key += `|${k}:${VariantClassResolver.#serializeValue(props[k])}`;
+			});
+			return key;
+		}
+		let key = recipe;
+		iterate.forEach(Object.keys(props).sort(), (k) => {
+			key += `|${k}:${VariantClassResolver.#serializeValue(props[k])}`;
+		});
+		return key;
+	}
+	static #serializeValue(value) {
+		if (value === void 0) return "u";
+		if (value === null) return "n";
+		if (typeof value === "boolean") return `b:${value}`;
+		if (typeof value === "string") return `s:${value}`;
+		return `x:${String(value)}`;
+	}
+};
+//#endregion
+//#region ../../lib/styling/src/create-class-pipeline.ts
+function createClassPipeline(resolved) {
+	const baseClass = resolved.baseClassName ?? "";
+	const cvaFn = resolved.variants ? cva$1("", {
+		variants: resolved.variants,
+		defaultVariants: resolved.defaultVariants,
+		compoundVariants: resolved.compoundVariants
+	}) : null;
+	const variantKeys = resolved.variants ? new Set(Object.keys(resolved.variants)) : void 0;
+	const staticResolver = new StaticClassResolver(baseClass, resolved.tagMap);
+	const variantResolver = new VariantClassResolver(cvaFn, resolved.recipeMap, variantKeys, resolved.precomputedClasses);
+	return function resolveClasses(tag, props, className, recipe) {
+		const staticClasses = staticResolver.resolve(tag, recipe !== void 0);
+		const variantClasses = variantResolver.resolve({
+			props,
+			recipe
+		});
+		if (!className) return (staticClasses && variantClasses ? `${staticClasses} ${variantClasses}` : staticClasses || variantClasses) || void 0;
+		return cn(staticClasses, variantClasses, className);
+	};
+}
+//#endregion
+//#region ../../lib/pipeline-kit/src/core/compose-pipelines.ts
+/** Chains two pipelines: `first`'s output feeds `second`'s single argument. The result is
+*  itself a Pipeline<TArgs, TOutput> — it can be passed right back into composePipelines as
+*  either `first` or `second` of a further composition. That closure-under-composition is the
+*  point: pipeline segments nest without a special "composed pipeline" type of their own. */
+function composePipelines(first, second) {
+	return (...args) => second(first(...args));
+}
+//#endregion
+//#region ../../lib/tailwind/src/class-builder.ts
+var ClassBuilder = class {
+	build(tokens) {
+		const layout = [];
+		const normal = [];
+		iterate.forEach(tokens, (token) => {
+			switch (token.kind) {
+				case "layout":
+					layout.push(token.raw);
+					break;
+				case "utility":
+				case "gap":
+				case "item":
+				case "shared":
+				case "conditional":
+					normal.push(token.raw);
+					break;
+				default: throw assertNever(token);
+			}
+		});
+		return [...this.#dedupe(layout).toSorted(), ...this.#dedupe(normal)].join(" ");
+	}
+	#dedupe(arr) {
+		return [...new Set(arr)];
+	}
+};
+//#endregion
+//#region ../../lib/tailwind/src/layout-keys.ts
+/**
+* Canonical list of reserved layout prop names.
+*
+* This array is the single source of truth for every supported CSS `display`
+* value exposed as a boolean prop. The `LayoutKey` type is derived directly
+* from this list.
+*
+* To add a new display mode:
+*   1. Add the display value here.
+*   2. Register its layout family in `LAYOUT_FAMILY_MAP`.
+*
+* Prop names intentionally match the corresponding Tailwind/CSS display
+* utilities, so no additional prop-to-class mapping is required.
+*/
+const layoutKeys = [
+	"flex",
+	"inline-flex",
+	"grid",
+	"inline-grid",
+	"block",
+	"inline-block",
+	"inline",
+	"hidden",
+	"contents",
+	"flow-root",
+	"list-item",
+	"table",
+	"inline-table",
+	"table-caption",
+	"table-cell",
+	"table-column",
+	"table-column-group",
+	"table-footer-group",
+	"table-header-group",
+	"table-row-group",
+	"table-row"
+];
+//#endregion
+//#region ../../lib/tailwind/src/constants.ts
+const LAYOUT_OWNED_KEYS = new Set(layoutKeys);
+const LAYOUT_FAMILY_MAP = {
+	flex: "flex",
+	"inline-flex": "flex",
+	grid: "grid",
+	"inline-grid": "grid",
+	block: "none",
+	"inline-block": "none",
+	inline: "none",
+	hidden: "none",
+	contents: "none",
+	"flow-root": "none",
+	"list-item": "none",
+	table: "none",
+	"inline-table": "none",
+	"table-caption": "none",
+	"table-cell": "none",
+	"table-column": "none",
+	"table-column-group": "none",
+	"table-footer-group": "none",
+	"table-header-group": "none",
+	"table-row-group": "none",
+	"table-row": "none"
+};
+const EMPTY_SET = /* @__PURE__ */ new Set();
+const COMPOUND_META_KEYS = /* @__PURE__ */ new Set(["class"]);
+//#endregion
+//#region ../../lib/tailwind/src/class-classifier.ts
+const CONDITIONALS = {
+	"[&.flex": "flex",
+	"[&.grid": "grid"
+};
+const ITEM_PREFIXES = [
+	/^order/,
+	/^grow/,
+	/^shrink/,
+	/^basis-/,
+	/^self-/,
+	/^place-self-/,
+	/^justify-self-/,
+	/^col-/,
+	/^row-/
+];
+const SHARED_PREFIXES = [
+	/^justify-(?!items-|self-)/,
+	/^content-(normal|center|start|end|between|around|evenly|stretch)$/,
+	/^items-/,
+	/^place-content-/,
+	/^place-items-/
+];
+var ClassClassifier = class ClassClassifier {
+	static #getBaseUtility(token) {
+		let depth = 0;
+		return iterate.findLast(token, (char, index) => {
+			if (char === "]") depth++;
+			else if (char === "[") depth--;
+			else if (char === ":" && depth === 0 && token[index - 1] !== "\\") return token.slice(index + 1);
+			return null;
+		}) ?? token;
+	}
+	classify(token) {
+		const base = ClassClassifier.#getBaseUtility(token);
+		if (LAYOUT_OWNED_KEYS.has(base)) return {
+			kind: "layout",
+			value: base,
+			raw: token
+		};
+		const conditional = iterate.find(Object.entries(CONDITIONALS), ([prefix, requires]) => {
+			return token.startsWith(prefix) ? {
+				kind: "conditional",
+				requires,
+				raw: token
+			} : null;
+		});
+		if (conditional !== null) return conditional;
+		if (base === "gap" || base.startsWith("gap-")) return {
+			kind: "gap",
+			raw: token
+		};
+		if (ITEM_PREFIXES.some((rule) => rule.test(base))) return {
+			kind: "item",
+			raw: token
+		};
+		if (SHARED_PREFIXES.some((rule) => rule.test(base))) return {
+			kind: "shared",
+			raw: token
+		};
+		return {
+			kind: "utility",
+			base,
+			raw: token
+		};
+	}
+};
+//#endregion
+//#region ../../lib/tailwind/src/dependency-evaluator.ts
+var DependencyEvaluator = class {
+	rules;
+	constructor(rules) {
+		this.rules = rules;
+	}
+	evaluate(token, state) {
+		switch (token.kind) {
+			case "layout": return token.value === state.mode;
+			case "conditional": return token.requires === state.family;
+			case "utility": return iterate.find(Object.keys(this.rules), (layout) => this.rules[layout].some((rule) => rule.test(token.base)) ? state.family === layout : null) ?? true;
+			case "item": return true;
+			case "gap":
+			case "shared": return state.family !== "none";
+			default: throw assertNever(token);
+		}
+	}
+};
+//#endregion
+//#region ../../lib/tailwind/src/dependency-rules.ts
+const defaultDependencyRules = {
+	flex: [/^flex-/],
+	grid: [
+		/^grid-/,
+		/^auto-cols-/,
+		/^auto-rows-/,
+		/^justify-items-/
+	]
+};
+//#endregion
+//#region ../../lib/tailwind/src/diagnostics.ts
+const TailwindDiagnostics = {
+	multipleDisplayProps(active) {
+		return {
+			code: DiagnosticCode.TailwindMultipleDisplayProps,
+			category: DiagnosticCategory.Contract,
+			message: `[createTailwindPipeline] Multiple display props set (${active.join(", ")}); "${active[0]}" takes precedence.`
+		};
+	},
+	reservedLayoutLiteral(reserved) {
+		return {
+			code: DiagnosticCode.TailwindReservedLayoutLiteral,
+			category: DiagnosticCategory.Contract,
+			message: `[createTailwindPipeline] Reserved display class(es) ${reserved.map((r) => `"${r}"`).join(", ")} found in resolved classes. The display mode is controlled by the display props (flex, inline-flex, grid, block, hidden, etc.), not by class strings.`
+		};
+	},
+	deadVariantClass(dim, value, mode, classStr) {
+		return {
+			code: DiagnosticCode.TailwindDeadVariantClass,
+			category: DiagnosticCategory.Contract,
+			message: `[createTailwindPipeline] Variant "${dim}=${value}" contributes only classes stripped under layout mode "${mode}" ("${classStr}") — it produces nothing in this mode.`
+		};
+	},
+	layoutOnVoidTag(tag, mode) {
+		return {
+			code: DiagnosticCode.TailwindLayoutOnVoidTag,
+			category: DiagnosticCategory.Contract,
+			message: `[createTailwindPipeline] "${mode}" sets <${tag}>'s inner display, but <${tag}> is a void element and can never have children — there is nothing for a flex/grid formatting context to apply to, so "${mode}" (and any gap-* utility) has no effect here.`
+		};
+	}
+};
+//#endregion
+//#region ../../lib/tailwind/src/layout-state.ts
+/**
+* The resolved display mode for a single render.
+*
+* Mode is owned by the display props; a display class literal in the resolved
+* class string is a reserved-literal authoring mistake. Defaults to `'none'`
+* when no prop is set.
+*
+* `family` is derived from mode: `'flex'` for flex/inline-flex, `'grid'` for
+* grid/inline-grid, `'none'` for all other values (and when no prop is set).
+* The evaluator uses family — not mode — for utility and gap filtering.
+*/
+var LayoutState = class {
+	#mode;
+	#family;
+	constructor(mode) {
+		this.#mode = mode;
+		this.#family = mode === "none" ? "none" : LAYOUT_FAMILY_MAP[mode];
+		Object.freeze(this);
+	}
+	get mode() {
+		return this.#mode;
+	}
+	get family() {
+		return this.#family;
+	}
+};
+//#endregion
+//#region ../../lib/tailwind/src/create-tailwind-pipeline.ts
+const DEV = process.env.NODE_ENV !== "production";
+const devDiagnostics = new Diagnostics(new ConsoleReporter(), new DefaultPolicy({
+	reportThreshold: Severity.Warning,
+	throwThreshold: Severity.Fatal
+}));
+const classifier = new ClassClassifier();
+const evaluator = new DependencyEvaluator(defaultDependencyRules);
+const builder = new ClassBuilder();
+const VOID_TAG_SET = new Set(VOID_TAGS);
+function normalizeVariantValue(value) {
+	if (isString(value)) return value;
+	return value.join(" ");
+}
+function resolveLayout(diagnostics, props) {
+	const active = [];
+	iterate.forEach(layoutKeys, (key) => {
+		if (props[key]) active.push(key);
+	});
+	if (DEV && active.length > 1) diagnostics.warn(TailwindDiagnostics.multipleDisplayProps(active));
+	return active[0] ?? "none";
+}
+function warnLayoutOnVoidTag(diagnostics, tag, state) {
+	if (state.family === "none" || !isString(tag) || !VOID_TAG_SET.has(tag)) return;
+	diagnostics.warn(TailwindDiagnostics.layoutOnVoidTag(tag, state.mode));
+}
+function warnReservedLayoutLiterals(diagnostics, tokens) {
+	const reserved = [];
+	iterate.forEach(tokens, (token) => {
+		if (token.kind === "layout") reserved.push(token.raw);
+	});
+	if (reserved.length === 0) return;
+	diagnostics.warn(TailwindDiagnostics.reservedLayoutLiteral(reserved));
+}
+function getVariantConfig(options) {
+	return options.variants;
+}
+function getCompoundVariants(options) {
+	return options.compoundVariants ?? [];
+}
+function classifyTokens(className) {
+	return className.split(/\s+/).filter(Boolean).map(classifier.classify);
+}
+function compoundDimensions(compounds) {
+	if (compounds.length === 0) return EMPTY_SET;
+	const dims = /* @__PURE__ */ new Set();
+	iterate.forEach(compounds, (compound) => {
+		iterate.forEachKey(compound, (key) => {
+			if (!COMPOUND_META_KEYS.has(key)) dims.add(key);
+		});
+	});
+	return dims;
+}
+function getDefaultVariants(options) {
+	return options.defaultVariants;
+}
+function resolveActiveSelection(options, variants, props, recipe) {
+	const preset = recipe ? options.recipeMap?.[recipe] : void 0;
+	const defaults = getDefaultVariants(options);
+	const selection = {};
+	iterate.forEachKey(variants, (dim) => {
+		const value = props[dim] ?? preset?.[dim] ?? defaults?.[dim];
+		if (value !== void 0 && value !== null) selection[dim] = String(value);
+	});
+	return selection;
+}
+function warnDeadVariants(diagnostics, options, compoundDims, props, recipe, state) {
+	const variants = getVariantConfig(options);
+	if (!variants) return;
+	const selection = resolveActiveSelection(options, variants, props, recipe);
+	iterate.forEachEntry(selection, (dim, value) => {
+		if (compoundDims.has(dim)) return;
+		const raw = variants[dim]?.[value];
+		if (raw == null) return;
+		const classStr = normalizeVariantValue(raw);
+		const tokens = classifyTokens(classStr);
+		if (tokens.length === 0) return;
+		if (tokens.every((t) => !evaluator.evaluate(t, state))) diagnostics.warn(TailwindDiagnostics.deadVariantClass(dim, value, state.mode, classStr));
+	});
+}
+/**
+* Layout-aware class pipeline for Tailwind CSS utility class strings.
+*
+* This is a `ClassPluginFactory` — the runtime calls it with the component's
+* resolved pipeline options and strict mode. Do NOT call it yourself; pass the
+* function reference as `styling.plugin` and let the runtime invoke it.
+*
+* @example
+* ```ts
+* // CORRECT — pass the reference; the runtime calls it
+* createContractComponent({
+*   tag: 'div',
+*   styling: {
+*     base: 'items-center',
+*     plugin: createTailwindPipeline,
+*   },
+* })
+*
+* // WRONG — calling it manually produces a ClassPlugin where a ClassPluginFactory is expected
+* createContractComponent({
+*   tag: 'div',
+*   styling: {
+*     plugin: createTailwindPipeline({ base: 'items-center' }, false),
+*   },
+* })
+* ```
+*
+* With the plugin active, pass any display prop (`flex`, `inline-flex`, `grid`,
+* `inline-grid`, `block`, `hidden`, etc.) as a boolean to control the display
+* mode. The pipeline injects the display class and strips conflicting utilities:
+* flex-family modes strip `grid-*`; grid-family modes strip `flex-*`; all other
+* display values (and no prop) strip both `flex-*` and `grid-*`.
+*/
+function createTailwindPipeline(options, diagnostics) {
+	const innerPipeline = createClassPipeline(options);
+	const compoundDims = compoundDimensions(getCompoundVariants(options));
+	const resolveLayoutContext = (tag, props, className, recipe) => {
+		const mode = resolveLayout(devDiagnostics, props);
+		const tokens = classifyTokens(innerPipeline(tag, props, className, recipe) ?? "");
+		const state = new LayoutState(mode);
+		const filtered = tokens.filter((token) => evaluator.evaluate(token, state));
+		if (DEV) warnLayoutOnVoidTag(devDiagnostics, tag, state);
+		return {
+			mode,
+			state,
+			filtered,
+			tokens,
+			props,
+			recipe
+		};
+	};
+	const buildClassString = (ctx) => {
+		const built = builder.build(ctx.filtered);
+		if (ctx.mode === "none") return built;
+		return ctx.filtered.some((t) => t.kind === "layout" && t.value === ctx.mode) ? built : cn(ctx.mode, built);
+	};
+	const emitDiagnosticsFromContext = (ctx) => {
+		if (!DEV) return;
+		warnReservedLayoutLiterals(diagnostics, ctx.tokens);
+		warnDeadVariants(diagnostics, options, compoundDims, ctx.props, ctx.recipe, ctx.state);
+	};
+	const combined = (ctx) => {
+		const built = buildClassString(ctx);
+		emitDiagnosticsFromContext(ctx);
+		return built;
+	};
+	const mainPipeline = composePipelines(resolveLayoutContext, combined);
+	return {
+		ownedKeys: LAYOUT_OWNED_KEYS,
+		pipeline(tag, props, className, recipe) {
+			return mainPipeline(tag, props, className, recipe);
+		}
+	};
+}
+//#endregion
+export { createTailwindPipeline, layoutKeys };