@style-capture/core 0.0.1

package/dist/index.js

@@ -0,0 +1,1308 @@
+//#region src/claude-export.ts
+const CAPTURE_NODE_ATTRIBUTE = "data-lc";
+const MAX_TAILWIND_SUGGESTIONS = 6;
+const MAX_OPEN_QUESTION_ITEMS = 8;
+const CLAUDE_CAPTURE_INSTRUCTION = "Recreate or refactor this UI faithfully. html_capture + css_capture are ground truth. Preserve structure unless simplifying is clearly better. Tailwind hints are hints. Use the smallest codebase-ready change and state ambiguities instead of inventing details.";
+const compactInlineText = (value) => value.replaceAll(/\s+/g, " ").trim();
+const escapeXmlAttribute = (value) => value.replaceAll("&", "&amp;").replaceAll("\"", "&quot;").replaceAll("<", "&lt;").replaceAll(">", "&gt;");
+const compactSelector = (selector) => selector.replaceAll(/\s*([>+~])\s*/g, "$1").replaceAll(/,\s+/g, ",").replaceAll(/\s+/g, " ").trim();
+const buildCompactRefs = (order) => {
+	const refs = {};
+	for (const [index, elementId] of order.entries()) refs[elementId] = index.toString(36);
+	return refs;
+};
+const buildCompactSelector = (ref) => `[${CAPTURE_NODE_ATTRIBUTE}="${ref}"]`;
+const buildFallbackSelectors = (capture) => {
+	const selectors = {};
+	for (const elementId of capture.order) {
+		const snapshot = capture.elements[elementId];
+		if (!snapshot) continue;
+		selectors[elementId] = compactSelector(snapshot.selector);
+	}
+	return selectors;
+};
+const stripCommentNodes = (root) => {
+	const walker = root.ownerDocument.createTreeWalker(root, NodeFilter.SHOW_COMMENT);
+	const comments = [];
+	while (walker.nextNode()) if (walker.currentNode instanceof Comment) comments.push(walker.currentNode);
+	for (const comment of comments) comment.remove();
+};
+const minifyHtmlString = (html) => html.replaceAll(/<!--[\s\S]*?-->/g, "").replaceAll(/>\s+</g, "><").trim();
+const elementMatchesSnapshot = (element, snapshot) => {
+	if (element.tagName.toLowerCase() !== snapshot.tagName) return false;
+	for (const className of snapshot.classList) if (!element.classList.contains(className)) return false;
+	for (const [name, value] of Object.entries(snapshot.attributes)) {
+		if (name === "class") continue;
+		if (element.getAttribute(name) !== value) return false;
+	}
+	return true;
+};
+const findMatchingElementIndex = (candidates, snapshot, startIndex) => {
+	for (let index = startIndex; index < candidates.length; index += 1) if (elementMatchesSnapshot(candidates[index], snapshot)) return index;
+	return -1;
+};
+const annotateCaptureHtml = (capture) => {
+	const refs = buildCompactRefs(capture.order);
+	if (!capture.rootOuterHtml.trim()) return {
+		html: "",
+		refs,
+		selectors: buildFallbackSelectors(capture)
+	};
+	if (typeof DOMParser === "undefined") return {
+		html: minifyHtmlString(capture.rootOuterHtml),
+		refs,
+		selectors: buildFallbackSelectors(capture)
+	};
+	const root = new DOMParser().parseFromString(capture.rootOuterHtml, "text/html").body.firstElementChild;
+	if (!root) return {
+		html: minifyHtmlString(capture.rootOuterHtml),
+		refs,
+		selectors: buildFallbackSelectors(capture)
+	};
+	stripCommentNodes(root);
+	const candidates = [root, ...root.querySelectorAll("*")];
+	const selectors = buildFallbackSelectors(capture);
+	let searchStartIndex = 0;
+	for (const elementId of capture.order) {
+		const snapshot = capture.elements[elementId];
+		const ref = refs[elementId];
+		if (!(snapshot && ref)) continue;
+		const matchIndex = findMatchingElementIndex(candidates, snapshot, searchStartIndex);
+		if (matchIndex === -1) continue;
+		candidates[matchIndex].setAttribute(CAPTURE_NODE_ATTRIBUTE, ref);
+		selectors[elementId] = buildCompactSelector(ref);
+		searchStartIndex = matchIndex + 1;
+	}
+	return {
+		html: minifyHtmlString(root.outerHTML),
+		refs,
+		selectors
+	};
+};
+const formatCssPropertyName = (property) => {
+	if (property.includes("-")) return property;
+	return property.replaceAll(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
+};
+const formatDeclarationBlock = (styles) => Object.entries(styles).filter(([, value]) => value.trim().length > 0).toSorted(([left], [right]) => left.localeCompare(right)).map(([property, value]) => `${formatCssPropertyName(property)}:${compactInlineText(value)}`).join(";");
+const formatPseudoBlock = (selector, pseudo) => {
+	if (!pseudo) return "";
+	const declarationBlock = formatDeclarationBlock(pseudo.styles);
+	if (!declarationBlock) return "";
+	return `${selector}::${pseudo.kind}{${declarationBlock}}`;
+};
+const formatElementCssBlock = (snapshot, selector) => {
+	const parts = [];
+	const declarationBlock = formatDeclarationBlock(snapshot.styles);
+	const beforeBlock = formatPseudoBlock(selector, snapshot.pseudo.before);
+	const afterBlock = formatPseudoBlock(selector, snapshot.pseudo.after);
+	if (declarationBlock) parts.push(`${selector}{${declarationBlock}}`);
+	if (beforeBlock) parts.push(beforeBlock);
+	if (afterBlock) parts.push(afterBlock);
+	return parts.join("");
+};
+const formatCaptureCss = (capture, selectors) => capture.order.map((elementId) => {
+	const snapshot = capture.elements[elementId];
+	if (!snapshot) return "";
+	return formatElementCssBlock(snapshot, selectors[elementId] ?? snapshot.selector);
+}).filter(Boolean).join("");
+const buildTailwindHintEntries = (capture, mapping, refs) => {
+	if (!mapping) return [];
+	const entries = [];
+	const rootMapping = mapping.elements[capture.rootElementId];
+	if (rootMapping?.suggestedClassName || rootMapping?.className) entries.push({
+		key: "root",
+		value: rootMapping.suggestedClassName || rootMapping.className
+	});
+	const topSuggestions = capture.order.filter((elementId) => elementId !== capture.rootElementId).map((elementId) => mapping.elements[elementId]).filter((element) => Boolean(element?.suggestedClassName || element?.className)).slice(0, MAX_TAILWIND_SUGGESTIONS);
+	for (const suggestion of topSuggestions) entries.push({
+		key: refs[suggestion.elementId] ?? suggestion.elementId,
+		value: suggestion.suggestedClassName || suggestion.className
+	});
+	return entries;
+};
+const buildOpenQuestionEntries = (mapping, refs) => {
+	if (!mapping || mapping.reviewQueue.length === 0) return [];
+	return mapping.reviewQueue.slice(0, MAX_OPEN_QUESTION_ITEMS).map((item) => ({
+		key: refs[item.elementId] ?? item.elementId,
+		value: item.reasons.join("; ")
+	}));
+};
+const buildClaudeCapturePrompt = (capture, mapping) => {
+	const annotation = annotateCaptureHtml(capture);
+	const rootElement = capture.elements[capture.rootElementId];
+	return {
+		cssCapture: formatCaptureCss(capture, annotation.selectors),
+		htmlCapture: annotation.html,
+		instruction: CLAUDE_CAPTURE_INSTRUCTION,
+		metadata: {
+			elementCount: capture.summary.elementCount,
+			mode: capture.settings.captureMode,
+			pseudoCount: capture.summary.pseudoElementCount,
+			rootRef: annotation.refs[capture.rootElementId] ?? capture.rootElementId,
+			rootSelector: rootElement?.selector ?? "Unavailable",
+			url: capture.metadata.url
+		},
+		openQuestions: buildOpenQuestionEntries(mapping, annotation.refs),
+		tailwindHints: buildTailwindHintEntries(capture, mapping, annotation.refs)
+	};
+};
+const formatCaptureForClaudeMarkdown = (capture, mapping) => {
+	const prompt = buildClaudeCapturePrompt(capture, mapping);
+	const sections = [
+		`<style_capture url="${escapeXmlAttribute(prompt.metadata.url)}" mode="${prompt.metadata.mode}" root_ref="${prompt.metadata.rootRef}" root_selector="${escapeXmlAttribute(prompt.metadata.rootSelector)}" elements="${prompt.metadata.elementCount}" pseudos="${prompt.metadata.pseudoCount}">`,
+		prompt.instruction,
+		`<html_capture>${prompt.htmlCapture}</html_capture>`,
+		`<css_capture>${prompt.cssCapture}</css_capture>`
+	];
+	if (prompt.tailwindHints.length > 0) sections.push("<tailwind_hints>", ...prompt.tailwindHints.map((entry) => `${entry.key}=${compactInlineText(entry.value)}`), "</tailwind_hints>");
+	if (prompt.openQuestions.length > 0) sections.push("<open_questions>", ...prompt.openQuestions.map((entry) => `${entry.key}:${compactInlineText(entry.value)}`), "</open_questions>");
+	sections.push("</style_capture>");
+	return sections.join("\n").trim();
+};
+//#endregion
+//#region src/messages.ts
+const MESSAGE_TYPE_CAPTURE_COMPLETED = "capture/completed";
+const MESSAGE_TYPE_CAPTURE_CANCELLED = "capture/cancelled";
+const MESSAGE_TYPE_CAPTURE_FAILED = "capture/failed";
+const createDefaultSettings = () => ({
+	captureMode: "curated",
+	includeHiddenElements: false,
+	includePseudoElements: true
+});
+//#endregion
+//#region src/tailwind-mapper.ts
+const HIGH_CONFIDENCE = .92;
+const MEDIUM_CONFIDENCE = .72;
+const LOW_CONFIDENCE = .45;
+const PASSIVE_CONFIDENCE = .84;
+const LENGTH_PATTERN = /^(-?\d*\.?\d+)(px|rem|em|%|vh|vw)?$/;
+const RGB_PATTERN = /^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([0-9.]+))?\)$/;
+const WHITESPACE_SPLIT_PATTERN = /\s+/;
+const SPACING_SCALE = new Map([
+	[0, "0"],
+	[1, "px"],
+	[2, "0.5"],
+	[4, "1"],
+	[6, "1.5"],
+	[8, "2"],
+	[10, "2.5"],
+	[12, "3"],
+	[14, "3.5"],
+	[16, "4"],
+	[20, "5"],
+	[24, "6"],
+	[28, "7"],
+	[32, "8"],
+	[36, "9"],
+	[40, "10"],
+	[44, "11"],
+	[48, "12"],
+	[56, "14"],
+	[64, "16"],
+	[80, "20"],
+	[96, "24"],
+	[112, "28"],
+	[128, "32"],
+	[144, "36"],
+	[160, "40"],
+	[176, "44"],
+	[192, "48"],
+	[224, "56"],
+	[256, "64"],
+	[288, "72"],
+	[320, "80"],
+	[384, "96"]
+]);
+const FONT_SIZE_SCALE = new Map([
+	[12, "xs"],
+	[14, "sm"],
+	[16, "base"],
+	[18, "lg"],
+	[20, "xl"],
+	[24, "2xl"],
+	[30, "3xl"],
+	[36, "4xl"],
+	[48, "5xl"],
+	[60, "6xl"],
+	[72, "7xl"],
+	[96, "8xl"],
+	[128, "9xl"]
+]);
+const LINE_HEIGHT_SCALE = new Map([
+	[12, "3"],
+	[16, "4"],
+	[20, "5"],
+	[24, "6"],
+	[28, "7"],
+	[32, "8"],
+	[36, "9"],
+	[40, "10"]
+]);
+const RADIUS_SCALE = new Map([
+	[0, "none"],
+	[2, "sm"],
+	[4, ""],
+	[6, "md"],
+	[8, "lg"],
+	[12, "xl"],
+	[16, "2xl"],
+	[24, "3xl"]
+]);
+const BORDER_WIDTH_SCALE = new Map([
+	[1, ""],
+	[2, "2"],
+	[4, "4"],
+	[8, "8"]
+]);
+const Z_INDEX_SCALE = new Set([
+	0,
+	10,
+	20,
+	30,
+	40,
+	50
+]);
+const OPACITY_SCALE = new Set([
+	0,
+	5,
+	10,
+	15,
+	20,
+	25,
+	30,
+	35,
+	40,
+	45,
+	50,
+	55,
+	60,
+	65,
+	70,
+	75,
+	80,
+	85,
+	90,
+	95,
+	100
+]);
+const CLEAN_ARBITRARY_SOURCE_PROPERTIES = new Set([
+	"background-color",
+	"border-color",
+	"color",
+	"text-decoration-color"
+]);
+const REVIEW_ONLY_SOURCE_PROPERTIES = new Set([
+	"background-image",
+	"bottom",
+	"font-family",
+	"grid-template-columns",
+	"grid-template-rows",
+	"height",
+	"left",
+	"pseudo-elements",
+	"right",
+	"top",
+	"transform",
+	"transform-origin",
+	"width"
+]);
+const DISPLAY_MAP = {
+	contents: "contents",
+	flex: "flex",
+	"flow-root": "flow-root",
+	grid: "grid",
+	inline: "inline",
+	"inline-block": "inline-block",
+	"inline-flex": "inline-flex",
+	"inline-grid": "inline-grid",
+	none: "hidden"
+};
+const POSITION_MAP = {
+	absolute: "absolute",
+	fixed: "fixed",
+	relative: "relative",
+	sticky: "sticky"
+};
+const FLEX_DIRECTION_MAP = {
+	column: "flex-col",
+	"column-reverse": "flex-col-reverse",
+	"row-reverse": "flex-row-reverse"
+};
+const FLEX_WRAP_MAP = {
+	wrap: "flex-wrap",
+	"wrap-reverse": "flex-wrap-reverse"
+};
+const ALIGN_ITEMS_MAP = {
+	baseline: "items-baseline",
+	center: "items-center",
+	end: "items-end",
+	"flex-end": "items-end",
+	"flex-start": "items-start",
+	start: "items-start"
+};
+const JUSTIFY_CONTENT_MAP = {
+	center: "justify-center",
+	end: "justify-end",
+	"flex-end": "justify-end",
+	"flex-start": "justify-start",
+	left: "justify-start",
+	right: "justify-end",
+	"space-around": "justify-around",
+	"space-between": "justify-between",
+	"space-evenly": "justify-evenly",
+	start: "justify-start"
+};
+const GRID_AUTO_FLOW_MAP = {
+	column: "grid-flow-col",
+	"column dense": "grid-flow-col-dense",
+	dense: "grid-flow-dense",
+	"row dense": "grid-flow-row-dense"
+};
+const TEXT_ALIGN_MAP = {
+	center: "text-center",
+	end: "text-end",
+	justify: "text-justify",
+	right: "text-right"
+};
+const TEXT_TRANSFORM_MAP = {
+	capitalize: "capitalize",
+	lowercase: "lowercase",
+	uppercase: "uppercase"
+};
+const WHITE_SPACE_MAP = {
+	"break-spaces": "whitespace-break-spaces",
+	nowrap: "whitespace-nowrap",
+	pre: "whitespace-pre",
+	"pre-line": "whitespace-pre-line",
+	"pre-wrap": "whitespace-pre-wrap"
+};
+const LIST_STYLE_MAP = {
+	decimal: "list-decimal",
+	none: "list-none"
+};
+const OBJECT_FIT_MAP = {
+	contain: "object-contain",
+	cover: "object-cover",
+	none: "object-none",
+	"scale-down": "object-scale-down"
+};
+const OVERFLOW_MAP = {
+	auto: "auto",
+	clip: "clip",
+	hidden: "hidden",
+	scroll: "scroll",
+	visible: "visible"
+};
+const BORDER_STYLE_MAP = {
+	dashed: "border-dashed",
+	dotted: "border-dotted",
+	double: "border-double"
+};
+const FONT_WEIGHT_MAP = {
+	"100": "thin",
+	"200": "extralight",
+	"300": "light",
+	"500": "medium",
+	"600": "semibold",
+	"700": "bold",
+	"800": "extrabold",
+	"900": "black"
+};
+const POSITION_KEYWORD_MAP = {
+	"0% 0%": "top-left",
+	"0% 100%": "bottom-left",
+	"0% 50%": "left",
+	"100% 0%": "top-right",
+	"100% 100%": "bottom-right",
+	"100% 50%": "right",
+	"50% 0%": "top",
+	"50% 100%": "bottom"
+};
+const DIMENSION_KEYWORD_MAP = {
+	"100%": "full",
+	"100vh": "screen",
+	"100vw": "screen",
+	"fit-content": "fit",
+	"max-content": "max",
+	"min-content": "min"
+};
+const FONT_FAMILY_MAP = [
+	{
+		keyword: "monospace",
+		utility: "font-mono"
+	},
+	{
+		keyword: "sans-serif",
+		utility: "font-sans"
+	},
+	{
+		keyword: "system-ui",
+		utility: "font-sans"
+	},
+	{
+		keyword: "serif",
+		utility: "font-serif"
+	}
+];
+const roundToTwo = (value) => Math.round(value * 100) / 100;
+const dedupe = (values) => [...new Set((values ?? []).filter(Boolean))];
+const allEqual = (values) => values.every((value) => value === values[0]);
+const normalizeWhitespace = (value) => value.replaceAll(/\s+/g, " ").trim();
+const parseLength = (value) => {
+	const match = value.trim().match(LENGTH_PATTERN);
+	if (!match) return null;
+	return {
+		unit: match[2] ?? "px",
+		value: Number(match[1])
+	};
+};
+const isZeroLength = (value) => {
+	const length = parseLength(value);
+	return Boolean(length && Math.abs(length.value) <= .01);
+};
+const isTransparentColor = (value) => {
+	const normalized = value.trim().replaceAll(/\s+/g, "").toLowerCase();
+	return normalized === "rgba(0,0,0,0)" || normalized === "transparent";
+};
+const normalizeColor = (value) => {
+	const trimmed = value.trim().toLowerCase();
+	if (trimmed === "transparent" || isTransparentColor(trimmed)) return "transparent";
+	const rgbMatch = trimmed.match(RGB_PATTERN);
+	if (!rgbMatch) return trimmed;
+	const { 1: redRaw, 2: greenRaw, 3: blueRaw, 4: alpha } = rgbMatch;
+	const red = Number(redRaw).toString(16).padStart(2, "0");
+	const green = Number(greenRaw).toString(16).padStart(2, "0");
+	const blue = Number(blueRaw).toString(16).padStart(2, "0");
+	if (!alpha || alpha === "1") return `#${red}${green}${blue}`;
+	return trimmed.replaceAll(/\s+/g, "");
+};
+const sanitizeArbitraryValue = (value) => value.trim().replaceAll(/\s*,\s*/g, ",").replaceAll(/\s*\/\s*/g, "/").replaceAll(/\s+/g, "_");
+const createArbitraryUtility = (prefix, value) => `${prefix}-[${sanitizeArbitraryValue(value)}]`;
+const createArbitraryPropertyClass = (property, value) => `[${property}:${sanitizeArbitraryValue(value)}]`;
+const lookupMappedUtility = (map, value) => map[value] ?? null;
+const labelFromConfidence = (confidence) => {
+	if (confidence >= .85) return "high";
+	if (confidence >= .62) return "medium";
+	return "low";
+};
+const addMatch = (accumulator, match) => {
+	const utility = match.utility.trim();
+	if (!utility) return;
+	const nextMatch = {
+		...match,
+		label: labelFromConfidence(match.confidence),
+		notes: dedupe(match.notes),
+		sourceProperties: dedupe(match.sourceProperties),
+		sourceValues: dedupe(match.sourceValues),
+		utility
+	};
+	const existing = accumulator.matches.find((entry) => entry.utility === utility);
+	if (existing) {
+		existing.confidence = Math.max(existing.confidence, nextMatch.confidence);
+		existing.label = labelFromConfidence(existing.confidence);
+		existing.notes = dedupe([...existing.notes, ...nextMatch.notes]);
+		existing.sourceProperties = dedupe([...existing.sourceProperties, ...nextMatch.sourceProperties]);
+		existing.sourceValues = dedupe([...existing.sourceValues, ...nextMatch.sourceValues]);
+	} else accumulator.matches.push(nextMatch);
+	if (accumulator.classSet.has(utility)) return;
+	accumulator.classSet.add(utility);
+	accumulator.classes.push(utility);
+};
+const addUnsupported = (accumulator, property, value, reason) => {
+	const key = `${property}:${value}:${reason}`;
+	if (accumulator.unsupported.some((entry) => `${entry.property}:${entry.value}:${entry.reason}` === key)) return;
+	accumulator.unsupported.push({
+		property,
+		reason,
+		value
+	});
+};
+const addCandidateMatch = (accumulator, property, value, candidate) => {
+	if (!(value && candidate)) return;
+	addMatch(accumulator, {
+		confidence: candidate.confidence,
+		notes: candidate.notes ?? [],
+		sourceProperties: property.includes("|") ? property.split("|") : [property],
+		sourceValues: [value],
+		strategy: candidate.strategy,
+		utility: candidate.utility
+	});
+};
+const addMappedUtility = (accumulator, property, value, map, shouldAdd = true) => {
+	if (!(shouldAdd && value)) return;
+	const utility = lookupMappedUtility(map, value);
+	if (!utility) {
+		addUnsupported(accumulator, property, value, `${property} needs manual review.`);
+		return;
+	}
+	addMatch(accumulator, {
+		confidence: HIGH_CONFIDENCE,
+		sourceProperties: [property],
+		sourceValues: [value],
+		strategy: "semantic",
+		utility
+	});
+};
+const addArbitraryPropertyMatch = (accumulator, property, value, note) => {
+	if (!value || value === "none") return;
+	addMatch(accumulator, {
+		confidence: LOW_CONFIDENCE,
+		notes: [note],
+		sourceProperties: [property],
+		sourceValues: [value],
+		strategy: "arbitrary",
+		utility: createArbitraryPropertyClass(property, value)
+	});
+};
+const shouldEmitInheritedValue = (property, value, parentValue) => {
+	if (!value) return false;
+	if (!parentValue) return true;
+	if (property === "color") return normalizeColor(value) !== normalizeColor(parentValue);
+	return value !== parentValue;
+};
+const shouldMapDimension = (property, value) => {
+	if (!value) return false;
+	if (property.startsWith("min-")) return value !== "0px" && value !== "auto";
+	if (property.startsWith("max-")) return value !== "none";
+	return value !== "auto";
+};
+const buildSpacingCandidate = (prefix, value, allowNegative) => {
+	if (isZeroLength(value)) return null;
+	if (value === "auto" && prefix.startsWith("m")) return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "semantic",
+		utility: `${prefix}-auto`
+	};
+	const length = parseLength(value);
+	if (!length) return {
+		confidence: MEDIUM_CONFIDENCE,
+		notes: ["Spacing required an arbitrary value."],
+		strategy: "arbitrary",
+		utility: createArbitraryUtility(prefix, value)
+	};
+	if (length.value < 0 && !allowNegative) return null;
+	const token = length.unit === "px" ? SPACING_SCALE.get(Math.abs(length.value)) : null;
+	if (!token) return {
+		confidence: MEDIUM_CONFIDENCE,
+		notes: ["Spacing required an arbitrary value."],
+		strategy: "arbitrary",
+		utility: createArbitraryUtility(prefix, value)
+	};
+	const baseUtility = token === "px" ? `${prefix}-px` : `${prefix}-${token}`;
+	return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "scale",
+		utility: length.value < 0 ? `-${baseUtility}` : baseUtility
+	};
+};
+const buildDimensionCandidate = (prefix, value, options) => {
+	if (value === "auto") return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "semantic",
+		utility: `${prefix}-auto`
+	};
+	const keywordSuffix = DIMENSION_KEYWORD_MAP[value];
+	if (keywordSuffix) return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "semantic",
+		utility: `${prefix}-${keywordSuffix}`
+	};
+	const length = parseLength(value);
+	const token = length && length.unit === "px" ? SPACING_SCALE.get(Math.abs(length.value)) : null;
+	if (token) return {
+		confidence: options.confidence,
+		notes: options.note ? [options.note] : [],
+		strategy: "scale",
+		utility: token === "px" ? `${prefix}-px` : `${prefix}-${token}`
+	};
+	return {
+		confidence: options.confidence,
+		notes: options.note ? [options.note] : ["Length required an arbitrary value."],
+		strategy: "arbitrary",
+		utility: createArbitraryUtility(prefix, value)
+	};
+};
+const buildScaleCandidate = (prefix, value, scale, note) => {
+	const length = parseLength(value);
+	const token = length && length.unit === "px" ? scale.get(length.value) : null;
+	if (token) return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "scale",
+		utility: `${prefix}-${token}`
+	};
+	return {
+		confidence: MEDIUM_CONFIDENCE,
+		notes: [note],
+		strategy: "arbitrary",
+		utility: createArbitraryUtility(prefix, value)
+	};
+};
+const buildColorCandidate = (prefix, value) => {
+	const normalized = normalizeColor(value);
+	let semanticUtility = null;
+	if (normalized === "transparent") semanticUtility = `${prefix}-transparent`;
+	else if (normalized === "#000000") semanticUtility = `${prefix}-black`;
+	else if (normalized === "#ffffff") semanticUtility = `${prefix}-white`;
+	if (semanticUtility) return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "semantic",
+		utility: semanticUtility
+	};
+	return {
+		confidence: MEDIUM_CONFIDENCE,
+		strategy: "arbitrary",
+		utility: createArbitraryUtility(prefix, normalized)
+	};
+};
+const buildFontFamilyCandidate = (value) => {
+	const normalized = value.toLowerCase();
+	for (const { keyword, utility } of FONT_FAMILY_MAP) if (normalized.includes(keyword)) return {
+		confidence: MEDIUM_CONFIDENCE,
+		notes: ["Mapped to the nearest generic Tailwind family."],
+		strategy: "heuristic",
+		utility
+	};
+	return {
+		confidence: LOW_CONFIDENCE,
+		notes: ["Font family required an arbitrary property utility."],
+		strategy: "arbitrary",
+		utility: createArbitraryPropertyClass("font-family", value)
+	};
+};
+const buildBorderWidthCandidate = (prefix, value) => {
+	const length = parseLength(value);
+	const token = length && length.unit === "px" ? BORDER_WIDTH_SCALE.get(length.value) : null;
+	if (token !== void 0) return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "scale",
+		utility: token ? `${prefix}-${token}` : prefix
+	};
+	return {
+		confidence: MEDIUM_CONFIDENCE,
+		notes: ["Border width required an arbitrary value."],
+		strategy: "arbitrary",
+		utility: createArbitraryUtility(prefix, value)
+	};
+};
+const buildBorderColorCandidate = (value) => buildColorCandidate("border", value);
+const buildRadiusCandidate = (prefix, value) => {
+	const length = parseLength(value);
+	if (length && length.value >= 9999) return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "semantic",
+		utility: `${prefix}-full`
+	};
+	const token = length && length.unit === "px" ? RADIUS_SCALE.get(length.value) : null;
+	if (token !== void 0) return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "scale",
+		utility: token ? `${prefix}-${token}` : prefix
+	};
+	return {
+		confidence: MEDIUM_CONFIDENCE,
+		notes: ["Border radius required an arbitrary value."],
+		strategy: "arbitrary",
+		utility: createArbitraryUtility(prefix, value)
+	};
+};
+const buildZIndexCandidate = (value) => {
+	const numericValue = Number(value);
+	if (Number.isFinite(numericValue) && Z_INDEX_SCALE.has(numericValue)) return {
+		confidence: HIGH_CONFIDENCE,
+		strategy: "scale",
+		utility: `z-${numericValue}`
+	};
+	return {
+		confidence: MEDIUM_CONFIDENCE,
+		notes: ["Resolved z-index required an arbitrary value."],
+		strategy: "arbitrary",
+		utility: `z-[${sanitizeArbitraryValue(value)}]`
+	};
+};
+const addGapMatches = (accumulator, gap, rowGap, columnGap) => {
+	if (gap && gap !== "normal" && !isZeroLength(gap)) {
+		addCandidateMatch(accumulator, "gap", gap, buildSpacingCandidate("gap", gap, false));
+		return;
+	}
+	addCandidateMatch(accumulator, "row-gap", rowGap, rowGap ? buildSpacingCandidate("gap-y", rowGap, false) : null);
+	addCandidateMatch(accumulator, "column-gap", columnGap, columnGap ? buildSpacingCandidate("gap-x", columnGap, false) : null);
+};
+const addFlexNumberMatch = (accumulator, property, value, prefix) => {
+	if (!value) return;
+	let utility = createArbitraryUtility(prefix, value);
+	if (value === "1") utility = prefix;
+	else if (value === "0") utility = `${prefix}-0`;
+	const confidence = value === "0" || value === "1" ? HIGH_CONFIDENCE : LOW_CONFIDENCE;
+	const strategy = value === "0" || value === "1" ? "semantic" : "arbitrary";
+	addMatch(accumulator, {
+		confidence,
+		notes: strategy === "semantic" ? [] : [`${property} required an arbitrary value.`],
+		sourceProperties: [property],
+		sourceValues: [value],
+		strategy,
+		utility
+	});
+};
+const addAxisSpacingMatch = (accumulator, prefix, first, second, allowNegative) => {
+	if (!(first[1] && second[1]) || first[1] !== second[1]) return;
+	addCandidateMatch(accumulator, `${first[0]}|${second[0]}`, first[1], buildSpacingCandidate(prefix, first[1], allowNegative));
+};
+const addEdgeSpacingMatch = (accumulator, prefix, entry, allowNegative) => {
+	if (!entry[1] || isZeroLength(entry[1])) return;
+	addCandidateMatch(accumulator, entry[0], entry[1], buildSpacingCandidate(prefix, entry[1], allowNegative));
+};
+const addBoxSpacingMatches = (accumulator, prefix, entries) => {
+	const values = entries.map((entry) => entry[1]);
+	if (values.some((value) => !value)) return;
+	const normalizedValues = values;
+	if (normalizedValues.every((value) => isZeroLength(value))) return;
+	if (allEqual(normalizedValues)) {
+		addCandidateMatch(accumulator, entries[0][0], normalizedValues[0], buildSpacingCandidate(prefix, normalizedValues[0], prefix === "m"));
+		return;
+	}
+	addAxisSpacingMatch(accumulator, `${prefix}y`, entries[0], entries[2], prefix === "m");
+	addAxisSpacingMatch(accumulator, `${prefix}x`, entries[1], entries[3], prefix === "m");
+	addEdgeSpacingMatch(accumulator, `${prefix}t`, entries[0], prefix === "m");
+	addEdgeSpacingMatch(accumulator, `${prefix}r`, entries[1], prefix === "m");
+	addEdgeSpacingMatch(accumulator, `${prefix}b`, entries[2], prefix === "m");
+	addEdgeSpacingMatch(accumulator, `${prefix}l`, entries[3], prefix === "m");
+};
+const addColorMatch = (accumulator, prefix, property, value, shouldAdd) => {
+	if (!(shouldAdd && value)) return;
+	addCandidateMatch(accumulator, property, value, buildColorCandidate(prefix, value));
+};
+const addFontFamilyMatch = (accumulator, value, shouldAdd) => {
+	if (!(shouldAdd && value)) return;
+	addCandidateMatch(accumulator, "font-family", value, buildFontFamilyCandidate(value));
+};
+const addScaleMatch = (accumulator, property, value, shouldAdd, scale, prefix, note) => {
+	if (!(shouldAdd && value)) return;
+	addCandidateMatch(accumulator, property, value, buildScaleCandidate(prefix, value, scale, note));
+};
+const addFontWeightMatch = (accumulator, value, shouldAdd) => {
+	if (!(shouldAdd && value) || value === "400") return;
+	const utility = lookupMappedUtility(FONT_WEIGHT_MAP, value);
+	addMatch(accumulator, {
+		confidence: utility ? HIGH_CONFIDENCE : LOW_CONFIDENCE,
+		notes: utility ? [] : ["Font weight required an arbitrary value."],
+		sourceProperties: ["font-weight"],
+		sourceValues: [value],
+		strategy: utility ? "semantic" : "arbitrary",
+		utility: utility ? `font-${utility}` : createArbitraryUtility("font", value)
+	});
+};
+const addFontStyleMatch = (accumulator, value, shouldAdd) => {
+	if (!(shouldAdd && value) || value === "normal") return;
+	addMatch(accumulator, {
+		confidence: HIGH_CONFIDENCE,
+		sourceProperties: ["font-style"],
+		sourceValues: [value],
+		strategy: "semantic",
+		utility: value === "italic" ? "italic" : "not-italic"
+	});
+};
+const addTrackingMatch = (accumulator, value, shouldAdd) => {
+	if (!(shouldAdd && value) || value === "normal" || isZeroLength(value)) return;
+	addMatch(accumulator, {
+		confidence: LOW_CONFIDENCE,
+		notes: ["Letter spacing required an arbitrary value."],
+		sourceProperties: ["letter-spacing"],
+		sourceValues: [value],
+		strategy: "arbitrary",
+		utility: createArbitraryUtility("tracking", value)
+	});
+};
+const addDecorationLineMatches = (accumulator, value) => {
+	if (!value || value === "none") return;
+	for (const part of value.split(WHITESPACE_SPLIT_PATTERN)) {
+		const utility = {
+			"line-through": "line-through",
+			overline: "overline",
+			underline: "underline"
+		}[part] ?? null;
+		if (!utility) continue;
+		addMatch(accumulator, {
+			confidence: HIGH_CONFIDENCE,
+			sourceProperties: ["text-decoration-line"],
+			sourceValues: [value],
+			strategy: "semantic",
+			utility
+		});
+	}
+};
+const addUniformBorderMatch = (element, accumulator) => {
+	const widths = [
+		element.styles["border-top-width"],
+		element.styles["border-right-width"],
+		element.styles["border-bottom-width"],
+		element.styles["border-left-width"]
+	];
+	const styles = [
+		element.styles["border-top-style"],
+		element.styles["border-right-style"],
+		element.styles["border-bottom-style"],
+		element.styles["border-left-style"]
+	];
+	const colors = [
+		element.styles["border-top-color"],
+		element.styles["border-right-color"],
+		element.styles["border-bottom-color"],
+		element.styles["border-left-color"]
+	];
+	if (widths.some((value) => !value || isZeroLength(value)) || styles.some((value) => !value || value === "none")) return;
+	if (!(allEqual(widths) && allEqual(styles) && allEqual(colors))) {
+		addUnsupported(accumulator, "border", "mixed sides", "Per-side border variations need manual review.");
+		return;
+	}
+	const width = widths[0];
+	const borderStyle = styles[0];
+	const color = colors[0];
+	addCandidateMatch(accumulator, "border-width", width, buildBorderWidthCandidate("border", width));
+	if (borderStyle !== "solid") {
+		const utility = lookupMappedUtility(BORDER_STYLE_MAP, borderStyle);
+		if (utility) addMatch(accumulator, {
+			confidence: HIGH_CONFIDENCE,
+			sourceProperties: ["border-style"],
+			sourceValues: [borderStyle],
+			strategy: "semantic",
+			utility
+		});
+		else addUnsupported(accumulator, "border-style", borderStyle, "Border style needs manual review.");
+	}
+	addCandidateMatch(accumulator, "border-color", color, buildBorderColorCandidate(color));
+};
+const addRadiusMatches = (element, accumulator) => {
+	const values = [
+		element.styles["border-top-left-radius"],
+		element.styles["border-top-right-radius"],
+		element.styles["border-bottom-right-radius"],
+		element.styles["border-bottom-left-radius"]
+	];
+	if (values.some((value) => !value) || values.every((value) => isZeroLength(value))) return;
+	const radiusValues = values;
+	if (allEqual(radiusValues)) {
+		addCandidateMatch(accumulator, "border-radius", radiusValues[0], buildRadiusCandidate("rounded", radiusValues[0]));
+		return;
+	}
+	addUnsupported(accumulator, "border-radius", radiusValues.join(", "), "Mixed corner radii need manual review.");
+};
+const addShadowMatch = (accumulator, value) => {
+	if (!value || value === "none") return;
+	addMatch(accumulator, {
+		confidence: MEDIUM_CONFIDENCE,
+		sourceProperties: ["box-shadow"],
+		sourceValues: [value],
+		strategy: "arbitrary",
+		utility: createArbitraryUtility("shadow", value)
+	});
+};
+const addOpacityMatch = (accumulator, value) => {
+	if (!value || value === "1") return;
+	const numericValue = Number(value);
+	if (!Number.isFinite(numericValue)) return;
+	const percent = Math.round(numericValue * 100);
+	const semantic = OPACITY_SCALE.has(percent);
+	addMatch(accumulator, {
+		confidence: semantic ? MEDIUM_CONFIDENCE : LOW_CONFIDENCE,
+		notes: semantic ? [] : ["Opacity required an arbitrary value."],
+		sourceProperties: ["opacity"],
+		sourceValues: [value],
+		strategy: semantic ? "scale" : "arbitrary",
+		utility: semantic ? `opacity-${percent}` : createArbitraryUtility("opacity", value)
+	});
+};
+const addPositionMatch = (accumulator, prefix, property, value) => {
+	if (!value || value === "50% 50%") return;
+	const keyword = POSITION_KEYWORD_MAP[normalizeWhitespace(value)];
+	const named = keyword ? `${prefix}-${keyword}` : null;
+	addMatch(accumulator, {
+		confidence: named ? HIGH_CONFIDENCE : MEDIUM_CONFIDENCE,
+		notes: named ? [] : [`${property} required an arbitrary value.`],
+		sourceProperties: [property],
+		sourceValues: [value],
+		strategy: named ? "semantic" : "arbitrary",
+		utility: named ?? createArbitraryUtility(prefix, value)
+	});
+};
+const addOverflowAxisMatch = (accumulator, property, value) => {
+	if (value === "visible") return;
+	const suffix = lookupMappedUtility(OVERFLOW_MAP, value);
+	if (!suffix) {
+		addUnsupported(accumulator, property, value, "Overflow needs manual review.");
+		return;
+	}
+	addMatch(accumulator, {
+		confidence: HIGH_CONFIDENCE,
+		sourceProperties: [property],
+		sourceValues: [value],
+		strategy: "semantic",
+		utility: `${property}-${suffix}`
+	});
+};
+const addObjectPositionMatch = (accumulator, value) => {
+	addPositionMatch(accumulator, "object", "object-position", value);
+};
+const mapDisplay = (context, accumulator) => {
+	const { display } = context.element.styles;
+	if (!display || display === "block") return;
+	const utility = lookupMappedUtility(DISPLAY_MAP, display);
+	if (utility) {
+		addMatch(accumulator, {
+			confidence: HIGH_CONFIDENCE,
+			sourceProperties: ["display"],
+			sourceValues: [display],
+			strategy: "semantic",
+			utility
+		});
+		return;
+	}
+	addUnsupported(accumulator, "display", display, "Display needs manual review.");
+};
+const mapPositioning = (context, accumulator) => {
+	const { styles } = context.element;
+	const { position } = styles;
+	if (position && position !== "static") {
+		const utility = lookupMappedUtility(POSITION_MAP, position);
+		if (utility) addMatch(accumulator, {
+			confidence: HIGH_CONFIDENCE,
+			sourceProperties: ["position"],
+			sourceValues: [position],
+			strategy: "semantic",
+			utility
+		});
+	}
+	if (!position || position === "static") return;
+	for (const property of [
+		"top",
+		"right",
+		"bottom",
+		"left"
+	]) {
+		const value = styles[property];
+		if (!value || value === "auto") continue;
+		addCandidateMatch(accumulator, property, value, buildDimensionCandidate(property, value, {
+			confidence: LOW_CONFIDENCE,
+			note: "Computed insets are layout-derived and need review."
+		}));
+	}
+	const zIndex = styles["z-index"];
+	if (!zIndex || zIndex === "auto") return;
+	addCandidateMatch(accumulator, "z-index", zIndex, buildZIndexCandidate(zIndex));
+};
+const mapFlexLayout = (context, accumulator) => {
+	const { styles } = context.element;
+	const { display } = styles;
+	if (display !== "flex" && display !== "inline-flex") return;
+	addMappedUtility(accumulator, "flex-direction", styles["flex-direction"], FLEX_DIRECTION_MAP);
+	addMappedUtility(accumulator, "flex-wrap", styles["flex-wrap"], FLEX_WRAP_MAP);
+	addMappedUtility(accumulator, "justify-content", styles["justify-content"], JUSTIFY_CONTENT_MAP);
+	addMappedUtility(accumulator, "align-items", styles["align-items"], ALIGN_ITEMS_MAP);
+	addGapMatches(accumulator, styles.gap, styles["row-gap"], styles["column-gap"]);
+	addFlexNumberMatch(accumulator, "flex-grow", styles["flex-grow"], "grow");
+	addFlexNumberMatch(accumulator, "flex-shrink", styles["flex-shrink"], "shrink");
+	const basis = styles["flex-basis"];
+	if (!basis || basis === "auto") return;
+	addCandidateMatch(accumulator, "flex-basis", basis, buildDimensionCandidate("basis", basis, { confidence: MEDIUM_CONFIDENCE }));
+};
+const mapGridLayout = (context, accumulator) => {
+	const { styles } = context.element;
+	const { display } = styles;
+	if (display !== "grid" && display !== "inline-grid") return;
+	addGapMatches(accumulator, styles.gap, styles["row-gap"], styles["column-gap"]);
+	addMappedUtility(accumulator, "grid-auto-flow", styles["grid-auto-flow"], GRID_AUTO_FLOW_MAP);
+	for (const [property, prefix] of [
+		["grid-column-start", "col-start"],
+		["grid-column-end", "col-end"],
+		["grid-row-start", "row-start"],
+		["grid-row-end", "row-end"]
+	]) {
+		const value = styles[property];
+		if (!value || value === "auto") continue;
+		addMatch(accumulator, {
+			confidence: MEDIUM_CONFIDENCE,
+			sourceProperties: [property],
+			sourceValues: [value],
+			strategy: "arbitrary",
+			utility: createArbitraryUtility(prefix, value)
+		});
+	}
+	addArbitraryPropertyMatch(accumulator, "grid-template-columns", styles["grid-template-columns"], "Computed grid tracks lose authored repeat syntax.");
+	addArbitraryPropertyMatch(accumulator, "grid-template-rows", styles["grid-template-rows"], "Computed grid tracks lose authored repeat syntax.");
+};
+const mapSpacing = (context, accumulator) => {
+	addBoxSpacingMatches(accumulator, "p", [
+		["padding-top", context.element.styles["padding-top"]],
+		["padding-right", context.element.styles["padding-right"]],
+		["padding-bottom", context.element.styles["padding-bottom"]],
+		["padding-left", context.element.styles["padding-left"]]
+	]);
+	addBoxSpacingMatches(accumulator, "m", [
+		["margin-top", context.element.styles["margin-top"]],
+		["margin-right", context.element.styles["margin-right"]],
+		["margin-bottom", context.element.styles["margin-bottom"]],
+		["margin-left", context.element.styles["margin-left"]]
+	]);
+};
+const mapSizing = (context, accumulator) => {
+	const { styles } = context.element;
+	for (const [property, prefix, confidence] of [
+		[
+			"min-width",
+			"min-w",
+			MEDIUM_CONFIDENCE
+		],
+		[
+			"min-height",
+			"min-h",
+			MEDIUM_CONFIDENCE
+		],
+		[
+			"max-width",
+			"max-w",
+			MEDIUM_CONFIDENCE
+		],
+		[
+			"max-height",
+			"max-h",
+			MEDIUM_CONFIDENCE
+		],
+		[
+			"width",
+			"w",
+			LOW_CONFIDENCE
+		],
+		[
+			"height",
+			"h",
+			LOW_CONFIDENCE
+		]
+	]) {
+		const value = styles[property];
+		if (!shouldMapDimension(property, value)) continue;
+		addCandidateMatch(accumulator, property, value, buildDimensionCandidate(prefix, value, {
+			confidence,
+			note: property === "width" || property === "height" ? "Computed size values are often layout-dependent." : void 0
+		}));
+	}
+};
+const mapTypographyBasics = (context, accumulator) => {
+	const { element, parent } = context;
+	addColorMatch(accumulator, "text", "color", element.styles.color, shouldEmitInheritedValue("color", element.styles.color, parent?.styles.color));
+	addFontFamilyMatch(accumulator, element.styles["font-family"], shouldEmitInheritedValue("font-family", element.styles["font-family"], parent?.styles["font-family"]));
+	addScaleMatch(accumulator, "font-size", element.styles["font-size"], shouldEmitInheritedValue("font-size", element.styles["font-size"], parent?.styles["font-size"]), FONT_SIZE_SCALE, "text", "Font size required an arbitrary value.");
+	addFontWeightMatch(accumulator, element.styles["font-weight"], shouldEmitInheritedValue("font-weight", element.styles["font-weight"], parent?.styles["font-weight"]));
+	addFontStyleMatch(accumulator, element.styles["font-style"], shouldEmitInheritedValue("font-style", element.styles["font-style"], parent?.styles["font-style"]));
+	addScaleMatch(accumulator, "line-height", element.styles["line-height"], shouldEmitInheritedValue("line-height", element.styles["line-height"], parent?.styles["line-height"]) && element.styles["line-height"] !== "normal", LINE_HEIGHT_SCALE, "leading", "Line height required an arbitrary value.");
+	addTrackingMatch(accumulator, element.styles["letter-spacing"], shouldEmitInheritedValue("letter-spacing", element.styles["letter-spacing"], parent?.styles["letter-spacing"]));
+};
+const mapTypographyPresentation = (context, accumulator) => {
+	const { element, parent } = context;
+	addMappedUtility(accumulator, "text-align", element.styles["text-align"], TEXT_ALIGN_MAP, shouldEmitInheritedValue("text-align", element.styles["text-align"], parent?.styles["text-align"]) && !["left", "start"].includes(element.styles["text-align"] ?? ""));
+	addMappedUtility(accumulator, "text-transform", element.styles["text-transform"], TEXT_TRANSFORM_MAP, shouldEmitInheritedValue("text-transform", element.styles["text-transform"], parent?.styles["text-transform"]) && element.styles["text-transform"] !== "none");
+	addMappedUtility(accumulator, "white-space", element.styles["white-space"], WHITE_SPACE_MAP, shouldEmitInheritedValue("white-space", element.styles["white-space"], parent?.styles["white-space"]) && element.styles["white-space"] !== "normal");
+	addMappedUtility(accumulator, "list-style-type", element.styles["list-style-type"], LIST_STYLE_MAP, shouldEmitInheritedValue("list-style-type", element.styles["list-style-type"], parent?.styles["list-style-type"]) && element.styles["list-style-type"] !== "disc");
+	addDecorationLineMatches(accumulator, element.styles["text-decoration-line"]);
+	addColorMatch(accumulator, "decoration", "text-decoration-color", element.styles["text-decoration-color"], element.styles["text-decoration-line"] !== "none" && Boolean(element.styles["text-decoration-color"]));
+};
+const mapBackground = (context, accumulator) => {
+	addColorMatch(accumulator, "bg", "background-color", context.element.styles["background-color"], !isTransparentColor(context.element.styles["background-color"] ?? ""));
+	addArbitraryPropertyMatch(accumulator, "background-image", context.element.styles["background-image"], "Background images are emitted as arbitrary properties.");
+};
+const mapBorder = (context, accumulator) => {
+	addUniformBorderMatch(context.element, accumulator);
+	addRadiusMatches(context.element, accumulator);
+};
+const mapEffects = (context, accumulator) => {
+	const { styles } = context.element;
+	addShadowMatch(accumulator, styles["box-shadow"]);
+	addOpacityMatch(accumulator, styles.opacity);
+	addArbitraryPropertyMatch(accumulator, "transform", styles.transform, "Computed transforms are emitted as raw properties.");
+	addPositionMatch(accumulator, "origin", "transform-origin", styles["transform-origin"]);
+	if (styles.visibility === "hidden") addMatch(accumulator, {
+		confidence: HIGH_CONFIDENCE,
+		sourceProperties: ["visibility"],
+		sourceValues: ["hidden"],
+		strategy: "semantic",
+		utility: "invisible"
+	});
+};
+const mapOverflow = (context, accumulator) => {
+	const overflowX = context.element.styles["overflow-x"];
+	const overflowY = context.element.styles["overflow-y"];
+	if (!(overflowX && overflowY)) return;
+	if (overflowX === overflowY && overflowX !== "visible") {
+		const suffix = lookupMappedUtility(OVERFLOW_MAP, overflowX);
+		if (suffix) addMatch(accumulator, {
+			confidence: HIGH_CONFIDENCE,
+			sourceProperties: ["overflow-x", "overflow-y"],
+			sourceValues: [overflowX, overflowY],
+			strategy: "semantic",
+			utility: `overflow-${suffix}`
+		});
+		return;
+	}
+	addOverflowAxisMatch(accumulator, "overflow-x", overflowX);
+	addOverflowAxisMatch(accumulator, "overflow-y", overflowY);
+};
+const mapObjectLayout = (context, accumulator) => {
+	const objectFit = context.element.styles["object-fit"];
+	if (objectFit && objectFit !== "fill") {
+		const utility = lookupMappedUtility(OBJECT_FIT_MAP, objectFit);
+		if (utility) addMatch(accumulator, {
+			confidence: HIGH_CONFIDENCE,
+			sourceProperties: ["object-fit"],
+			sourceValues: [objectFit],
+			strategy: "semantic",
+			utility
+		});
+	}
+	addObjectPositionMatch(accumulator, context.element.styles["object-position"]);
+};
+const mapPseudoElements = (context, accumulator) => {
+	const pseudoKinds = Object.keys(context.element.pseudo);
+	if (pseudoKinds.length === 0) return;
+	addUnsupported(accumulator, "pseudo-elements", pseudoKinds.join(", "), "Pseudo-elements were captured, but Tailwind output still needs manual content utilities.");
+};
+const isReviewOnlyNote = (note) => {
+	const normalizedNote = note.toLowerCase();
+	return normalizedNote.includes("manual review") || normalizedNote.includes("layout-dependent") || normalizedNote.includes("layout-derived") || normalizedNote.includes("arbitrary property utility") || normalizedNote.includes("required an arbitrary value") || normalizedNote.includes("computed transforms") || normalizedNote.includes("lose authored repeat syntax");
+};
+const shouldMoveMatchToReview = (match) => {
+	if (match.label === "low" || match.utility.startsWith("[")) return true;
+	if (match.sourceProperties.some((property) => REVIEW_ONLY_SOURCE_PROPERTIES.has(property))) return true;
+	if (match.strategy === "arbitrary" && !match.sourceProperties.every((property) => CLEAN_ARBITRARY_SOURCE_PROPERTIES.has(property))) return true;
+	return match.notes.some((note) => isReviewOnlyNote(note));
+};
+const splitMatchesForSuggestion = (matches) => {
+	const reviewMatches = [];
+	const suggestedMatches = [];
+	for (const match of matches) if (shouldMoveMatchToReview(match)) reviewMatches.push(match);
+	else suggestedMatches.push(match);
+	return {
+		reviewMatches,
+		suggestedMatches
+	};
+};
+const calculateElementConfidence = (accumulator) => {
+	if (accumulator.matches.length === 0) return accumulator.unsupported.length > 0 ? LOW_CONFIDENCE : PASSIVE_CONFIDENCE;
+	const average = accumulator.matches.reduce((sum, match) => sum + match.confidence, 0) / accumulator.matches.length;
+	if (accumulator.unsupported.length === 0) return roundToTwo(average);
+	return roundToTwo(Math.max(LOW_CONFIDENCE, average - .12));
+};
+const buildReviewFallbackNote = (match) => {
+	if (match.label === "low") return "Low-confidence utility needs manual review.";
+	if (match.sourceProperties.some((property) => REVIEW_ONLY_SOURCE_PROPERTIES.has(property))) return "Computed layout or custom CSS was kept out of the clean suggestion.";
+	if (match.strategy === "arbitrary") return "Arbitrary utility was kept out of the clean suggestion.";
+	return "Utility was kept out of the clean suggestion for review.";
+};
+const buildReviewItem = (mapping) => {
+	const reasons = [...mapping.unsupported.map((entry) => `${entry.property}: ${entry.reason}`), ...mapping.matches.filter((match) => shouldMoveMatchToReview(match)).flatMap((match) => {
+		return (match.notes.length ? match.notes : [buildReviewFallbackNote(match)]).map((note) => `${match.utility}: ${note}`);
+	})];
+	if (reasons.length === 0) return null;
+	return {
+		confidence: mapping.confidence,
+		confidenceLabel: mapping.confidenceLabel,
+		elementId: mapping.elementId,
+		reasons: dedupe(reasons).slice(0, 6),
+		selector: mapping.selector,
+		unsupportedCount: mapping.unsupported.length
+	};
+};
+const createAccumulator = () => ({
+	classSet: /* @__PURE__ */ new Set(),
+	classes: [],
+	matches: [],
+	unsupported: []
+});
+const MAPPING_STEPS = [
+	mapDisplay,
+	mapPositioning,
+	mapFlexLayout,
+	mapGridLayout,
+	mapSpacing,
+	mapSizing,
+	mapTypographyBasics,
+	mapTypographyPresentation,
+	mapBackground,
+	mapBorder,
+	mapEffects,
+	mapOverflow,
+	mapObjectLayout,
+	mapPseudoElements
+];
+const mapElementSnapshot = (context) => {
+	const accumulator = createAccumulator();
+	for (const step of MAPPING_STEPS) step(context, accumulator);
+	const confidence = calculateElementConfidence(accumulator);
+	const { reviewMatches, suggestedMatches } = splitMatchesForSuggestion(accumulator.matches);
+	return {
+		className: accumulator.classes.join(" "),
+		confidence,
+		confidenceLabel: labelFromConfidence(confidence),
+		elementId: context.element.id,
+		matchCount: accumulator.matches.length,
+		matches: accumulator.matches,
+		reviewClassName: reviewMatches.map((match) => match.utility).join(" "),
+		reviewMatchCount: reviewMatches.length,
+		selector: context.element.selector,
+		suggestedClassName: suggestedMatches.map((match) => match.utility).join(" "),
+		suggestedMatchCount: suggestedMatches.length,
+		tagName: context.element.tagName,
+		unsupported: accumulator.unsupported
+	};
+};
+const mapCaptureToTailwind = (capture) => {
+	const elements = {};
+	const reviewQueue = [];
+	let cleanUtilityCount = 0;
+	let confidenceSum = 0;
+	let lowConfidenceElementCount = 0;
+	let mappedElementCount = 0;
+	let reviewUtilityCount = 0;
+	let unsupportedPropertyCount = 0;
+	let utilityCount = 0;
+	for (const elementId of capture.order) {
+		const element = capture.elements[elementId];
+		if (!element) continue;
+		const mapping = mapElementSnapshot({
+			element,
+			parent: element.parentId === null ? null : capture.elements[element.parentId] ?? null
+		});
+		elements[elementId] = mapping;
+		confidenceSum += mapping.confidence;
+		if (mapping.confidenceLabel === "low") lowConfidenceElementCount += 1;
+		if (mapping.matchCount > 0) mappedElementCount += 1;
+		unsupportedPropertyCount += mapping.unsupported.length;
+		cleanUtilityCount += mapping.suggestedMatchCount;
+		reviewUtilityCount += mapping.reviewMatchCount;
+		utilityCount += mapping.matches.length;
+		const reviewItem = buildReviewItem(mapping);
+		if (reviewItem) reviewQueue.push(reviewItem);
+	}
+	reviewQueue.sort((left, right) => {
+		if (left.confidence !== right.confidence) return left.confidence - right.confidence;
+		return right.unsupportedCount - left.unsupportedCount;
+	});
+	const elementCount = capture.order.length;
+	return {
+		elements,
+		order: capture.order,
+		reviewQueue,
+		summary: {
+			averageConfidence: elementCount ? roundToTwo(confidenceSum / elementCount) : 0,
+			cleanUtilityCount,
+			elementCount,
+			lowConfidenceElementCount,
+			mappedElementCount,
+			reviewCount: reviewQueue.length,
+			reviewUtilityCount,
+			unsupportedPropertyCount,
+			utilityCount
+		}
+	};
+};
+//#endregion
+export { MESSAGE_TYPE_CAPTURE_CANCELLED, MESSAGE_TYPE_CAPTURE_COMPLETED, MESSAGE_TYPE_CAPTURE_FAILED, buildClaudeCapturePrompt, createDefaultSettings, formatCaptureForClaudeMarkdown, mapCaptureToTailwind };
+
+//# sourceMappingURL=index.js.map