npm - @ben-million/tweaker - Versions diffs - 0.4.1 → 0.5.0 - Mend

@ben-million/tweaker 0.4.1 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","names":[],"sources":["../src/types.ts","../src/tweaker.tsx","../src/gray-scales.ts"],"mappings":";;;UAEiB,SAAA;EACf,KAAA;EACA,MAAA,EAAQ,MAAA;AAAA;AAAA,~~UAkBO~~,YAAA;EACf,MAAA,GAAS,MAAA,SAAe,SAAA;EACxB,WAAA;AAAA;;;~~cCdW~~,OAAA;EAAW,MAAA;EAAA;AAAA,GAAmD,YAAA,KAAY,kBAAA,CAAA,GAAA,CAAA,OAAA;;;~~cCR1E~~,WAAA,EAAa,MAAA,SAAe,SAAA"}
1	+ {"version":3,"file":"index.d.ts","names":[],"sources":["../src/types.ts","../src/tweaker.tsx","../src/gray-scales.ts"],"mappings":";;;UAEiB,SAAA;EACf,KAAA;EACA,MAAA,EAAQ,MAAA;AAAA;AAAA,UAwBO,YAAA;EACf,MAAA,GAAS,MAAA,SAAe,SAAA;EACxB,WAAA;AAAA;;;cClBW,OAAA;EAAW,MAAA;EAAA;AAAA,GAAmD,YAAA,KAAY,kBAAA,CAAA,GAAA,CAAA,OAAA;;;cCV1E,WAAA,EAAa,MAAA,SAAe,SAAA"}

package/dist/index.js CHANGED Viewed

@@ -136,10 +136,13 @@ const SHADE_KEYS = [
 	"900",
 	"950"
 ];
-const FONT_WEIGHT_MIN = 100;
-const FONT_WEIGHT_MAX = 900;
+const FONT_SIZE_MIN_PX = 1;
+const FONT_SIZE_MAX_PX = 200;
+const PADDING_MIN_PX = 0;
+const PADDING_MAX_PX = 200;
 const SCROLL_COLOR_SENSITIVITY = .01;
-const SCROLL_WEIGHT_SENSITIVITY = .5;
+const SCROLL_SIZE_SENSITIVITY = .1;
+const SCROLL_PADDING_SENSITIVITY = .1;
 const MINIMAP_WIDTH_PX = 160;
 const MINIMAP_HEIGHT_PX = 100;
 const THUMB_SIZE_PX = 10;
@@ -253,13 +256,21 @@ const applyModification = (modification, scales, scaleKey) => {
 	if (modification.property === "bg") modification.element.style.backgroundColor = colorValue;
 	else if (modification.property === "text") modification.element.style.color = colorValue;
 	else modification.element.style.borderColor = colorValue;
-	modification.element.style.fontWeight = String(Math.round(modification.fontWeight));
+	modification.element.style.fontSize = `${Math.round(modification.fontSize)}px`;
+	modification.element.style.paddingTop = `${Math.round(modification.paddingY)}px`;
+	modification.element.style.paddingBottom = `${Math.round(modification.paddingY)}px`;
+	modification.element.style.paddingLeft = `${Math.round(modification.paddingX)}px`;
+	modification.element.style.paddingRight = `${Math.round(modification.paddingX)}px`;
 };
 const restoreModification = (modification) => {
 	modification.element.style.backgroundColor = modification.originalInlineBg;
 	modification.element.style.color = modification.originalInlineColor;
 	modification.element.style.borderColor = modification.originalInlineBorderColor;
-	modification.element.style.fontWeight = modification.originalInlineFontWeight;
+	modification.element.style.fontSize = modification.originalInlineFontSize;
+	modification.element.style.paddingTop = modification.originalInlinePaddingTop;
+	modification.element.style.paddingBottom = modification.originalInlinePaddingBottom;
+	modification.element.style.paddingLeft = modification.originalInlinePaddingLeft;
+	modification.element.style.paddingRight = modification.originalInlinePaddingRight;
 };
 const roundToStep = (value) => parseFloat((Math.round(value * 10) / 10).toFixed(1));
@@ -269,7 +280,8 @@ const generatePrompt = (modifications, scales, scaleKey) => {
 	if (modifications.length === 0) return "";
 	const scaleName = scales[scaleKey]?.label || scaleKey;
 	const colorLines = [];
-	const weightLines = [];
+	const sizeLines = [];
+	const paddingLines = [];
 	modifications.forEach((modification) => {
 		const nameParts = [modification.selector];
 		if (modification.componentName) nameParts.unshift(`<${modification.componentName}>`);
@@ -280,18 +292,30 @@ const generatePrompt = (modifications, scales, scaleKey) => {
 		const property = modification.property === "bg" ? "background color" : modification.property === "text" ? "text color" : "border color";
 		colorLines.push(`- ${property} of ${description} → ${scaleName} ${shade} (${formatOklch(oklch)})`);
 		if (modification.sourceFile) colorLines.push(`  Source: ${modification.sourceFile}`);
-		const originalWeight = modification.originalInlineFontWeight || getComputedStyle(modification.element).fontWeight;
-		const newWeight = Math.round(modification.fontWeight);
-		if (String(newWeight) !== originalWeight) {
-			weightLines.push(`- font-weight of ${description} → ${newWeight}`);
-			if (modification.sourceFile) weightLines.push(`  Source: ${modification.sourceFile}`);
+		const originalSize = modification.originalInlineFontSize || getComputedStyle(modification.element).fontSize;
+		const newSize = Math.round(modification.fontSize);
+		if (`${newSize}px` !== originalSize) {
+			sizeLines.push(`- font-size of ${description} → ${newSize}px`);
+			if (modification.sourceFile) sizeLines.push(`  Source: ${modification.sourceFile}`);
+		}
+		const originalPaddingY = parseFloat(getComputedStyle(modification.element).paddingTop) || 0;
+		const originalPaddingX = parseFloat(getComputedStyle(modification.element).paddingLeft) || 0;
+		const newPaddingY = Math.round(modification.paddingY);
+		const newPaddingX = Math.round(modification.paddingX);
+		if (newPaddingY !== Math.round(originalPaddingY) || newPaddingX !== Math.round(originalPaddingX)) {
+			paddingLines.push(`- padding of ${description} → ${newPaddingY}px ${newPaddingX}px`);
+			if (modification.sourceFile) paddingLines.push(`  Source: ${modification.sourceFile}`);
 		}
 	});
 	const sections = [];
 	if (colorLines.length > 0) sections.push("Change the following colors using the design system's gray scale:", "", ...colorLines);
-	if (weightLines.length > 0) {
+	if (sizeLines.length > 0) {
+		if (sections.length > 0) sections.push("");
+		sections.push("Change the following font sizes:", "", ...sizeLines);
+	}
+	if (paddingLines.length > 0) {
 		if (sections.length > 0) sections.push("");
-		sections.push("Change the following font weights:", "", ...weightLines);
+		sections.push("Change the following padding:", "", ...paddingLines);
 	}
 	return sections.join("\n");
 };
@@ -303,6 +327,7 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 	const [modifications, setModifications] = useState([]);
 	const [activeIndex, setActiveIndex] = useState(-1);
 	const [inputValue, setInputValue] = useState("");
+	const [scrollMode, setScrollMode] = useState("style");
 	const typingBuffer = useRef("");
 	const typingTimeout = useRef(void 0);
 	const activeMod = activeIndex >= 0 ? modifications[activeIndex] : null;
@@ -311,10 +336,12 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 	const activeScaleRef = useRef(activeScale);
 	const modificationsRef = useRef(modifications);
 	const scalesRef = useRef(scales);
+	const scrollModeRef = useRef(scrollMode);
 	activeIndexRef.current = activeIndex;
 	activeScaleRef.current = activeScale;
 	modificationsRef.current = modifications;
 	scalesRef.current = scales;
+	scrollModeRef.current = scrollMode;
 	const updateActivePosition = useCallback((newPosition) => {
 		if (activeIndex < 0) return;
 		setModifications((previous) => {
@@ -340,13 +367,23 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 			setModifications((previous) => {
 				const updated = [...previous];
 				const current = updated[index];
-				const newPosition = Math.max(0, Math.min(SLIDER_MAX, current.position - event.deltaY * SCROLL_COLOR_SENSITIVITY));
-				const newWeight = Math.max(FONT_WEIGHT_MIN, Math.min(FONT_WEIGHT_MAX, current.fontWeight + event.deltaX * SCROLL_WEIGHT_SENSITIVITY));
-				updated[index] = {
-					...current,
-					position: roundToStep(newPosition),
-					fontWeight: newWeight
-				};
+				if (scrollModeRef.current === "padding") {
+					const newPaddingY = Math.max(PADDING_MIN_PX, Math.min(PADDING_MAX_PX, current.paddingY - event.deltaY * SCROLL_PADDING_SENSITIVITY));
+					const newPaddingX = Math.max(PADDING_MIN_PX, Math.min(PADDING_MAX_PX, current.paddingX + event.deltaX * SCROLL_PADDING_SENSITIVITY));
+					updated[index] = {
+						...current,
+						paddingY: Math.round(newPaddingY),
+						paddingX: Math.round(newPaddingX)
+					};
+				} else {
+					const newPosition = Math.max(0, Math.min(SLIDER_MAX, current.position - event.deltaY * SCROLL_COLOR_SENSITIVITY));
+					const newSize = Math.max(FONT_SIZE_MIN_PX, Math.min(FONT_SIZE_MAX_PX, current.fontSize + event.deltaX * SCROLL_SIZE_SENSITIVITY));
+					updated[index] = {
+						...current,
+						position: roundToStep(newPosition),
+						fontSize: Math.round(newSize)
+					};
+				}
 				applyModification(updated[index], scalesRef.current, activeScaleRef.current);
 				setInputValue(String(updated[index].position));
 				return updated;
@@ -438,6 +475,10 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 				event.preventDefault();
 				setPicking(true);
 			}
+			if (event.key === "p") {
+				event.preventDefault();
+				setScrollMode((previous) => previous === "style" ? "padding" : "style");
+			}
 			if (hasModifications && (event.key === "b" || event.key === "f" || event.key === "d")) {
 				event.preventDefault();
 				const property = event.key === "b" ? "bg" : event.key === "f" ? "text" : "border";
@@ -478,7 +519,9 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 		if (activeMod) applyModification(activeMod, scales, activeScale);
 	}, [
 		activeMod?.position,
-		activeMod?.fontWeight,
+		activeMod?.fontSize,
+		activeMod?.paddingX,
+		activeMod?.paddingY,
 		activeScale,
 		scales
 	]);
@@ -512,7 +555,9 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 			const hasBorder = borderAlpha > 0 && parseFloat(computed.borderWidth) > 0;
 			const defaultProperty = bgAlpha > 0 ? "bg" : hasBorder ? "border" : "text";
 			const position = findClosestPosition(scales, activeScale, defaultProperty === "bg" ? rgbToOklch(bgRed, bgGreen, bgBlue) : defaultProperty === "border" ? rgbToOklch(borderRed, borderGreen, borderBlue) : rgbToOklch(textRed, textGreen, textBlue));
-			const currentWeight = parseFloat(computed.fontWeight) || 400;
+			const currentSize = parseFloat(computed.fontSize) || 16;
+			const currentPaddingY = parseFloat(computed.paddingTop) || 0;
+			const currentPaddingX = parseFloat(computed.paddingLeft) || 0;
 			const newModification = {
 				element: target,
 				selector: getSelector(target),
@@ -522,10 +567,16 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 				originalInlineBg: target.style.backgroundColor,
 				originalInlineColor: target.style.color,
 				originalInlineBorderColor: target.style.borderColor,
-				originalInlineFontWeight: target.style.fontWeight,
+				originalInlineFontSize: target.style.fontSize,
+				originalInlinePaddingTop: target.style.paddingTop,
+				originalInlinePaddingBottom: target.style.paddingBottom,
+				originalInlinePaddingLeft: target.style.paddingLeft,
+				originalInlinePaddingRight: target.style.paddingRight,
 				property: defaultProperty,
 				position,
-				fontWeight: currentWeight
+				fontSize: currentSize,
+				paddingX: currentPaddingX,
+				paddingY: currentPaddingY
 			};
 			setModifications((previous) => [...previous, newModification]);
 			setActiveIndex(modifications.length);
@@ -552,8 +603,8 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 	]);
 	const fillColor = activeMod ? oklchToCssString(getColorAtPosition(scales, activeScale, activeMod.position)) : scales[activeScale]?.shades["500"] ?? "rgba(255,255,255,0.3)";
 	const propertyLabel = activeMod?.property === "text" ? "F" : activeMod?.property === "border" ? "D" : "B";
-	const thumbX = activeMod ? (activeMod.fontWeight - FONT_WEIGHT_MIN) / (FONT_WEIGHT_MAX - FONT_WEIGHT_MIN) * (MINIMAP_WIDTH_PX - THUMB_SIZE_PX) : 0;
-	const thumbY = activeMod ? (1 - activeMod.position / SLIDER_MAX) * (MINIMAP_HEIGHT_PX - THUMB_SIZE_PX) : MINIMAP_HEIGHT_PX - THUMB_SIZE_PX;
+	const thumbX = activeMod ? scrollMode === "padding" ? activeMod.paddingX / PADDING_MAX_PX * (MINIMAP_WIDTH_PX - THUMB_SIZE_PX) : (activeMod.fontSize - FONT_SIZE_MIN_PX) / (FONT_SIZE_MAX_PX - FONT_SIZE_MIN_PX) * (MINIMAP_WIDTH_PX - THUMB_SIZE_PX) : 0;
+	const thumbY = activeMod ? scrollMode === "padding" ? (1 - activeMod.paddingY / PADDING_MAX_PX) * (MINIMAP_HEIGHT_PX - THUMB_SIZE_PX) : (1 - activeMod.position / SLIDER_MAX) * (MINIMAP_HEIGHT_PX - THUMB_SIZE_PX) : MINIMAP_HEIGHT_PX - THUMB_SIZE_PX;
 	return /* @__PURE__ */ jsx(AnimatePresence, { children: (hasModifications || picking) && /* @__PURE__ */ jsxs(motion.div, {
 		"data-tweaker": true,
 		initial: {
@@ -570,30 +621,53 @@ const Tweaker = ({ scales = GRAY_SCALES, activeScale = "neutral" }) => {
 		},
 		transition: { duration: .2 },
 		style: minimapContainerStyle,
-		children: [/* @__PURE__ */ jsx("div", {
-			style: minimapFieldStyle,
-			children: /* @__PURE__ */ jsx("div", { style: {
-				position: "absolute",
-				left: thumbX,
-				top: thumbY,
-				width: THUMB_SIZE_PX,
-				height: THUMB_SIZE_PX,
-				borderRadius: "50%",
-				background: fillColor,
-				border: "2px solid rgba(255,255,255,0.9)",
-				boxShadow: "0 1px 4px rgba(0,0,0,0.4)",
-				transition: "left 50ms, top 50ms"
-			} })
-		}), /* @__PURE__ */ jsxs("div", {
-			style: minimapValuesStyle,
-			children: [/* @__PURE__ */ jsx("span", {
-				style: minimapLabelStyle,
-				children: picking ? "Picking…" : `${propertyLabel} ${inputValue || "0"}`
-			}), !picking && activeMod && /* @__PURE__ */ jsxs("span", {
-				style: minimapLabelStyle,
-				children: ["W ", Math.round(activeMod.fontWeight)]
-			})]
-		})]
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				style: minimapFieldStyle,
+				children: /* @__PURE__ */ jsx("div", { style: {
+					position: "absolute",
+					left: thumbX,
+					top: thumbY,
+					width: THUMB_SIZE_PX,
+					height: THUMB_SIZE_PX,
+					borderRadius: "50%",
+					background: fillColor,
+					border: "2px solid rgba(255,255,255,0.9)",
+					boxShadow: "0 1px 4px rgba(0,0,0,0.4)",
+					transition: "left 50ms, top 50ms"
+				} })
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				style: segmentContainerStyle,
+				children: [/* @__PURE__ */ jsx("button", {
+					type: "button",
+					style: {
+						...segmentButtonStyle,
+						...scrollMode === "style" ? segmentActiveStyle : {}
+					},
+					onClick: () => setScrollMode("style"),
+					children: "Style"
+				}), /* @__PURE__ */ jsx("button", {
+					type: "button",
+					style: {
+						...segmentButtonStyle,
+						...scrollMode === "padding" ? segmentActiveStyle : {}
+					},
+					onClick: () => setScrollMode("padding"),
+					children: "Padding"
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				style: minimapValuesStyle,
+				children: [/* @__PURE__ */ jsx("span", {
+					style: minimapLabelStyle,
+					children: picking ? "Picking…" : scrollMode === "padding" ? `Y ${activeMod?.paddingY ?? 0}px` : `${propertyLabel} ${inputValue || "0"}`
+				}), !picking && activeMod && /* @__PURE__ */ jsx("span", {
+					style: minimapLabelStyle,
+					children: scrollMode === "padding" ? `X ${activeMod.paddingX}px` : `${Math.round(activeMod.fontSize)}px`
+				})]
+			})
+		]
 	}, "minimap") });
 };
 const baseTextStyle = {
@@ -610,8 +684,7 @@ const minimapContainerStyle = {
 	zIndex: 9999,
 	display: "flex",
 	flexDirection: "column",
-	gap: 6,
-	pointerEvents: "none"
+	gap: 6
 };
 const minimapFieldStyle = {
 	position: "relative",
@@ -622,12 +695,39 @@ const minimapFieldStyle = {
 	backdropFilter: "blur(12px)",
 	WebkitBackdropFilter: "blur(12px)",
 	boxShadow: "0 0 0 1px rgba(255,255,255,0.08) inset",
-	overflow: "hidden"
+	overflow: "hidden",
+	pointerEvents: "none"
+};
+const segmentContainerStyle = {
+	display: "flex",
+	gap: 2,
+	background: "rgba(0,0,0,0.25)",
+	backdropFilter: "blur(12px)",
+	WebkitBackdropFilter: "blur(12px)",
+	borderRadius: 6,
+	padding: 2
+};
+const segmentButtonStyle = {
+	...baseTextStyle,
+	flex: 1,
+	fontSize: 10,
+	padding: "3px 0",
+	border: "none",
+	borderRadius: 4,
+	background: "transparent",
+	color: "rgba(255,255,255,0.4)",
+	cursor: "pointer",
+	transition: "all 100ms"
+};
+const segmentActiveStyle = {
+	background: "rgba(255,255,255,0.12)",
+	color: "rgba(255,255,255,0.85)"
 };
 const minimapValuesStyle = {
 	display: "flex",
 	justifyContent: "space-between",
-	padding: "0 2px"
+	padding: "0 2px",
+	pointerEvents: "none"
 };
 const minimapLabelStyle = {
 	...baseTextStyle,

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../src/gray-scales.ts","../src/constants.ts","../src/utils/color.ts","../src/utils/dom.ts","../src/utils/modification.ts","../src/utils/prompt.ts","../src/tweaker.tsx"],"sourcesContent":["import type { GrayScale } from \"./types\";\n\nexport const GRAY_SCALES: Record<string, GrayScale> = {\n neutral: {\n label: \"Neutral\",\n shades: {\n \"50\": \"oklch(0.985 0 0)\",\n \"100\": \"oklch(0.97 0 0)\",\n \"200\": \"oklch(0.922 0 0)\",\n \"300\": \"oklch(0.87 0 0)\",\n \"400\": \"oklch(0.708 0 0)\",\n \"500\": \"oklch(0.556 0 0)\",\n \"600\": \"oklch(0.439 0 0)\",\n \"700\": \"oklch(0.371 0 0)\",\n \"800\": \"oklch(0.269 0 0)\",\n \"900\": \"oklch(0.205 0 0)\",\n \"950\": \"oklch(0.145 0 0)\",\n },\n },\n slate: {\n label: \"Slate\",\n shades: {\n \"50\": \"oklch(0.984 0.003 247.858)\",\n \"100\": \"oklch(0.968 0.007 247.896)\",\n \"200\": \"oklch(0.929 0.013 255.508)\",\n \"300\": \"oklch(0.869 0.022 252.894)\",\n \"400\": \"oklch(0.704 0.04 256.788)\",\n \"500\": \"oklch(0.554 0.046 257.417)\",\n \"600\": \"oklch(0.446 0.043 257.281)\",\n \"700\": \"oklch(0.372 0.044 257.287)\",\n \"800\": \"oklch(0.279 0.041 260.031)\",\n \"900\": \"oklch(0.208 0.042 265.755)\",\n \"950\": \"oklch(0.129 0.042 264.695)\",\n },\n },\n gray: {\n label: \"Gray\",\n shades: {\n \"50\": \"oklch(0.985 0.002 247.839)\",\n \"100\": \"oklch(0.967 0.003 264.542)\",\n \"200\": \"oklch(0.928 0.006 264.531)\",\n \"300\": \"oklch(0.872 0.01 258.338)\",\n \"400\": \"oklch(0.707 0.022 261.325)\",\n \"500\": \"oklch(0.551 0.027 264.364)\",\n \"600\": \"oklch(0.446 0.03 256.802)\",\n \"700\": \"oklch(0.373 0.034 259.733)\",\n \"800\": \"oklch(0.278 0.033 256.848)\",\n \"900\": \"oklch(0.21 0.034 264.665)\",\n \"950\": \"oklch(0.13 0.028 261.692)\",\n },\n },\n zinc: {\n label: \"Zinc\",\n shades: {\n \"50\": \"oklch(0.985 0 0)\",\n \"100\": \"oklch(0.967 0.001 286.375)\",\n \"200\": \"oklch(0.92 0.004 286.32)\",\n \"300\": \"oklch(0.871 0.006 286.286)\",\n \"400\": \"oklch(0.705 0.015 286.067)\",\n \"500\": \"oklch(0.552 0.016 285.938)\",\n \"600\": \"oklch(0.442 0.017 285.786)\",\n \"700\": \"oklch(0.37 0.013 285.805)\",\n \"800\": \"oklch(0.274 0.006 286.033)\",\n \"900\": \"oklch(0.21 0.006 285.885)\",\n \"950\": \"oklch(0.141 0.005 285.823)\",\n },\n },\n stone: {\n label: \"Stone\",\n shades: {\n \"50\": \"oklch(0.985 0.001 106.423)\",\n \"100\": \"oklch(0.97 0.001 106.424)\",\n \"200\": \"oklch(0.923 0.003 48.717)\",\n \"300\": \"oklch(0.869 0.005 56.366)\",\n \"400\": \"oklch(0.709 0.01 56.259)\",\n \"500\": \"oklch(0.553 0.013 58.071)\",\n \"600\": \"oklch(0.444 0.011 73.639)\",\n \"700\": \"oklch(0.374 0.01 67.558)\",\n \"800\": \"oklch(0.268 0.007 34.298)\",\n \"900\": \"oklch(0.216 0.006 56.043)\",\n \"950\": \"oklch(0.147 0.004 49.25)\",\n },\n },\n mauve: {\n label: \"Mauve\",\n shades: {\n \"50\": \"oklch(0.985 0.003 310)\",\n \"100\": \"oklch(0.968 0.006 310)\",\n \"200\": \"oklch(0.925 0.011 310)\",\n \"300\": \"oklch(0.87 0.017 310)\",\n \"400\": \"oklch(0.708 0.03 310)\",\n \"500\": \"oklch(0.556 0.03 310)\",\n \"600\": \"oklch(0.44 0.028 310)\",\n \"700\": \"oklch(0.372 0.025 310)\",\n \"800\": \"oklch(0.27 0.02 310)\",\n \"900\": \"oklch(0.208 0.018 310)\",\n \"950\": \"oklch(0.145 0.014 310)\",\n },\n },\n olive: {\n label: \"Olive\",\n shades: {\n \"50\": \"oklch(0.985 0.003 130)\",\n \"100\": \"oklch(0.968 0.006 130)\",\n \"200\": \"oklch(0.925 0.011 130)\",\n \"300\": \"oklch(0.87 0.017 130)\",\n \"400\": \"oklch(0.708 0.028 130)\",\n \"500\": \"oklch(0.556 0.028 130)\",\n \"600\": \"oklch(0.44 0.024 130)\",\n \"700\": \"oklch(0.372 0.02 130)\",\n \"800\": \"oklch(0.27 0.016 130)\",\n \"900\": \"oklch(0.208 0.014 130)\",\n \"950\": \"oklch(0.145 0.01 130)\",\n },\n },\n};\n","export const SLIDER_MAX = 10;\nexport const BAR_WIDTH_PX = 3;\nexport const TEXT_PREVIEW_MAX_LENGTH = 30;\nexport const TYPING_RESET_DELAY_MS = 1500;\nexport const SHADE_KEYS = [\"50\", \"100\", \"200\", \"300\", \"400\", \"500\", \"600\", \"700\", \"800\", \"900\", \"950\"];\nexport const FONT_WEIGHT_MIN = 100;\nexport const FONT_WEIGHT_MAX = 900;\nexport const SCROLL_COLOR_SENSITIVITY = 0.01;\nexport const SCROLL_WEIGHT_SENSITIVITY = 0.5;\nexport const MINIMAP_WIDTH_PX = 160;\nexport const MINIMAP_HEIGHT_PX = 100;\nexport const THUMB_SIZE_PX = 10;\n","import type { OKLCH } from \"../types\";\nimport { SHADE_KEYS, SLIDER_MAX } from \"../constants\";\nimport type { GrayScale } from \"../types\";\n\nexport const parseOklch = (oklchStr: string): OKLCH => {\n const match = oklchStr.match(/oklch\$([\\d.]+)\\s+([\\d.]+)\\s+([\\d.]+)\$/);\n if (!match) return [0, 0, 0];\n return [Number(match[1]), Number(match[2]), Number(match[3])];\n};\n\nexport const lerpOklch = (colorA: OKLCH, colorB: OKLCH, interpolation: number): OKLCH => [\n colorA[0] + (colorB[0] - colorA[0]) * interpolation,\n colorA[1] + (colorB[1] - colorA[1]) * interpolation,\n colorA[2] + (colorB[2] - colorA[2]) * interpolation,\n];\n\nexport const formatOklch = (oklch: OKLCH): string =>\n `oklch(${oklch[0].toFixed(3)} ${oklch[1].toFixed(3)} ${oklch[2].toFixed(1)})`;\n\nexport const oklchToCssString = (oklch: OKLCH): string =>\n `oklch(${oklch[0]} ${oklch[1]} ${oklch[2]})`;\n\nexport const getColorAtPosition = (scales: Record<string, GrayScale>, scaleKey: string, position: number): OKLCH => {\n const scale = scales[scaleKey];\n if (!scale) return [0.5, 0, 0];\n\n const inverted = SLIDER_MAX - position;\n const segment = (inverted / SLIDER_MAX) * (SHADE_KEYS.length - 1);\n const index = Math.min(Math.floor(segment), SHADE_KEYS.length - 2);\n const interpolation = segment - index;\n\n const lower = parseOklch(scale.shades[SHADE_KEYS[index]]);\n const upper = parseOklch(scale.shades[SHADE_KEYS[index + 1]]);\n\n return lerpOklch(lower, upper, interpolation);\n};\n\nexport const getClosestShadeLabel = (position: number): string => {\n const inverted = SLIDER_MAX - position;\n const segment = (inverted / SLIDER_MAX) * (SHADE_KEYS.length - 1);\n const index = Math.round(segment);\n return SHADE_KEYS[Math.min(index, SHADE_KEYS.length - 1)];\n};\n\nexport const parseRgb = (color: string): [number, number, number, number] => {\n const match = color.match(\n /rgba?\$\\s([\\d.]+),\\s([\\d.]+),\\s([\\d.]+)(?:,\\s([\\d.]+))?\\s\$/\n );\n if (!match) return [0, 0, 0, 0];\n return [\n Number(match[1]),\n Number(match[2]),\n Number(match[3]),\n match[4] !== undefined ? Number(match[4]) : 1,\n ];\n};\n\nexport const rgbToOklch = (red: number, green: number, blue: number): OKLCH => {\n const linearize = (channel: number): number => {\n const normalized = channel / 255;\n return normalized <= 0.04045\n ? normalized / 12.92\n : Math.pow((normalized + 0.055) / 1.055, 2.4);\n };\n const linearRed = linearize(red);\n const linearGreen = linearize(green);\n const linearBlue = linearize(blue);\n\n const lmsL = Math.cbrt(0.4122214708 linearRed + 0.5363325363 * linearGreen + 0.0514459929 * linearBlue);\n const lmsM = Math.cbrt(0.2119034982 * linearRed + 0.6806995451 * linearGreen + 0.1073969566 * linearBlue);\n const lmsS = Math.cbrt(0.0883024619 * linearRed + 0.2817188376 * linearGreen + 0.6299787005 * linearBlue);\n\n const lightness = 0.2104542553 * lmsL + 0.793617785 * lmsM - 0.0040720468 * lmsS;\n const labA = 1.9779984951 * lmsL - 2.428592205 * lmsM + 0.4505937099 * lmsS;\n const labB = 0.0259040371 * lmsL + 0.7827717662 * lmsM - 0.808675766 * lmsS;\n\n const chroma = Math.sqrt(labA * labA + labB * labB);\n const hue = Math.atan2(labB, labA) * (180 / Math.PI);\n\n return [lightness, chroma, hue < 0 ? hue + 360 : hue];\n};\n\nexport const findClosestPosition = (scales: Record<string, GrayScale>, scaleKey: string, targetOklch: OKLCH): number => {\n let bestPosition = 0;\n let bestDistance = Infinity;\n\n for (let position = 0; position <= SLIDER_MAX; position++) {\n const color = getColorAtPosition(scales, scaleKey, position);\n const distance =\n (color[0] - targetOklch[0]) 2 +\n (color[1] - targetOklch[1]) 2 +\n ((color[2] - targetOklch[2]) / 360) ** 2;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestPosition = position;\n }\n }\n\n return bestPosition;\n};\n","import { TEXT_PREVIEW_MAX_LENGTH } from \"../constants\";\n\nexport const getSelector = (element: HTMLElement): string => {\n const tag = element.tagName.toLowerCase();\n const classes = Array.from(element.classList)\n .filter((className) => !className.startsWith(\"__\"))\n .slice(0, 2)\n .join(\".\");\n return classes ? `${tag}.${classes}` : tag;\n};\n\nexport const getTextPreview = (element: HTMLElement): string => {\n const text = element.textContent?.trim() \|\| \"\";\n return text.length > TEXT_PREVIEW_MAX_LENGTH\n ? `${text.slice(0, TEXT_PREVIEW_MAX_LENGTH)}…`\n : text;\n};\n","import type { GrayScale, Modification } from \"../types\";\nimport { getColorAtPosition, oklchToCssString } from \"./color\";\n\nexport const applyModification = (\n modification: Modification,\n scales: Record<string, GrayScale>,\n scaleKey: string,\n) => {\n const oklch = getColorAtPosition(scales, scaleKey, modification.position);\n const colorValue = oklchToCssString(oklch);\n if (modification.property === \"bg\") {\n modification.element.style.backgroundColor = colorValue;\n } else if (modification.property === \"text\") {\n modification.element.style.color = colorValue;\n } else {\n modification.element.style.borderColor = colorValue;\n }\n modification.element.style.fontWeight = String(Math.round(modification.fontWeight));\n};\n\nexport const restoreModification = (modification: Modification) => {\n modification.element.style.backgroundColor = modification.originalInlineBg;\n modification.element.style.color = modification.originalInlineColor;\n modification.element.style.borderColor = modification.originalInlineBorderColor;\n modification.element.style.fontWeight = modification.originalInlineFontWeight;\n};\n\nexport const roundToStep = (value: number): number =>\n parseFloat((Math.round(value * 10) / 10).toFixed(1));\n","import type { GrayScale, Modification } from \"../types\";\nimport { formatOklch, getColorAtPosition, getClosestShadeLabel } from \"./color\";\n\nexport const generatePrompt = (\n modifications: Modification[],\n scales: Record<string, GrayScale>,\n scaleKey: string,\n): string => {\n if (modifications.length === 0) return \"\";\n\n const scaleName = scales[scaleKey]?.label \|\| scaleKey;\n const colorLines: string[] = [];\n const weightLines: string[] = [];\n\n modifications.forEach((modification) => {\n const nameParts = [modification.selector];\n if (modification.componentName) nameParts.unshift(`<${modification.componentName}>`);\n if (modification.textPreview) nameParts.push(`(\"${modification.textPreview}\")`);\n const description = nameParts.join(\" \");\n\n const shade = getClosestShadeLabel(modification.position);\n const oklch = getColorAtPosition(scales, scaleKey, modification.position);\n const property =\n modification.property === \"bg\"\n ? \"background color\"\n : modification.property === \"text\"\n ? \"text color\"\n : \"border color\";\n colorLines.push(`- ${property} of ${description} → ${scaleName} ${shade} (${formatOklch(oklch)})`);\n if (modification.sourceFile) colorLines.push(` Source: ${modification.sourceFile}`);\n\n const originalWeight = modification.originalInlineFontWeight\n \|\| getComputedStyle(modification.element).fontWeight;\n const newWeight = Math.round(modification.fontWeight);\n if (String(newWeight) !== originalWeight) {\n weightLines.push(`- font-weight of ${description} → ${newWeight}`);\n if (modification.sourceFile) weightLines.push(` Source: ${modification.sourceFile}`);\n }\n });\n\n const sections: string[] = [];\n\n if (colorLines.length > 0) {\n sections.push(\n \"Change the following colors using the design system's gray scale:\",\n \"\",\n ...colorLines,\n );\n }\n\n if (weightLines.length > 0) {\n if (sections.length > 0) sections.push(\"\");\n sections.push(\"Change the following font weights:\", \"\", ...weightLines);\n }\n\n return sections.join(\"\\n\");\n};\n","import { useState, useCallback, useEffect, useRef } from \"react\";\nimport { motion, AnimatePresence } from \"motion/react\";\nimport type { Modification, TweakerProps } from \"./types\";\nimport { GRAY_SCALES } from \"./gray-scales\";\nimport { SLIDER_MAX, TYPING_RESET_DELAY_MS, FONT_WEIGHT_MIN, FONT_WEIGHT_MAX, SCROLL_COLOR_SENSITIVITY, SCROLL_WEIGHT_SENSITIVITY, MINIMAP_WIDTH_PX, MINIMAP_HEIGHT_PX, THUMB_SIZE_PX } from \"./constants\";\nimport { getColorAtPosition, oklchToCssString, parseRgb, rgbToOklch, findClosestPosition } from \"./utils/color\";\nimport { getSelector, getTextPreview } from \"./utils/dom\";\nimport { applyModification, restoreModification, roundToStep } from \"./utils/modification\";\nimport { generatePrompt } from \"./utils/prompt\";\n\nexport const Tweaker = ({ scales = GRAY_SCALES, activeScale = \"neutral\" }: TweakerProps) => {\n const [picking, setPicking] = useState(false);\n const [modifications, setModifications] = useState<Modification[]>([]);\n const [activeIndex, setActiveIndex] = useState(-1);\n const [inputValue, setInputValue] = useState(\"\");\n const typingBuffer = useRef(\"\");\n const typingTimeout = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n const activeMod = activeIndex >= 0 ? modifications[activeIndex] : null;\n const hasModifications = modifications.length > 0;\n\n const activeIndexRef = useRef(activeIndex);\n const activeScaleRef = useRef(activeScale);\n const modificationsRef = useRef(modifications);\n const scalesRef = useRef(scales);\n activeIndexRef.current = activeIndex;\n activeScaleRef.current = activeScale;\n modificationsRef.current = modifications;\n scalesRef.current = scales;\n\n const updateActivePosition = useCallback(\n (newPosition: number) => {\n if (activeIndex < 0) return;\n setModifications((previous) => {\n const updated = [...previous];\n updated[activeIndex] = { ...updated[activeIndex], position: newPosition };\n applyModification(updated[activeIndex], scales, activeScale);\n return updated;\n });\n },\n [activeIndex, activeScale, scales],\n );\n\n useEffect(() => {\n if (!hasModifications \|\| picking) return;\n\n const handleWheel = (event: WheelEvent) => {\n event.preventDefault();\n const index = activeIndexRef.current;\n if (index < 0) return;\n\n setModifications((previous) => {\n const updated = [...previous];\n const current = updated[index];\n const newPosition = Math.max(0, Math.min(SLIDER_MAX, current.position - event.deltaY * SCROLL_COLOR_SENSITIVITY));\n const newWeight = Math.max(FONT_WEIGHT_MIN, Math.min(FONT_WEIGHT_MAX, current.fontWeight + event.deltaX * SCROLL_WEIGHT_SENSITIVITY));\n updated[index] = { ...current, position: roundToStep(newPosition), fontWeight: newWeight };\n applyModification(updated[index], scalesRef.current, activeScaleRef.current);\n setInputValue(String(updated[index].position));\n return updated;\n });\n };\n\n document.addEventListener(\"wheel\", handleWheel, { passive: false, capture: true });\n return () => {\n document.removeEventListener(\"wheel\", handleWheel, true);\n };\n }, [hasModifications, picking]);\n\n useEffect(() => {\n if (!hasModifications) return;\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n event.preventDefault();\n const prompt = generatePrompt(modificationsRef.current, scalesRef.current, activeScaleRef.current);\n navigator.clipboard.writeText(prompt);\n modificationsRef.current.forEach(restoreModification);\n setModifications([]);\n setActiveIndex(-1);\n setInputValue(\"\");\n }\n\n if (event.key === \" \") {\n event.preventDefault();\n const prompt = generatePrompt(modificationsRef.current, scalesRef.current, activeScaleRef.current);\n navigator.clipboard.writeText(prompt);\n setPicking(true);\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => document.removeEventListener(\"keydown\", handleKeyDown);\n }, [hasModifications]);\n\n useEffect(() => {\n if (!activeMod \|\| picking) return;\n\n const handleKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n if (target.tagName === \"INPUT\" \|\| target.tagName === \"TEXTAREA\") return;\n if (event.key === \"Escape\") return;\n\n if ((event.key >= \"0\" && event.key <= \"9\") \|\| event.key === \".\") {\n event.preventDefault();\n const next = typingBuffer.current + event.key;\n\n if (event.key === \".\" && typingBuffer.current.includes(\".\")) return;\n\n const hasDecimal = typingBuffer.current.includes(\".\");\n if (hasDecimal && event.key !== \".\" && typingBuffer.current.split(\".\")[1]?.length >= 1) {\n return;\n }\n\n const parsed = parseFloat(next);\n if (!isNaN(parsed) && parsed > SLIDER_MAX) {\n typingBuffer.current = event.key === \".\" ? \".\" : event.key;\n } else {\n typingBuffer.current = next;\n }\n\n const value = parseFloat(typingBuffer.current);\n if (!isNaN(value)) {\n const clamped = Math.min(SLIDER_MAX, value);\n updateActivePosition(clamped);\n setInputValue(typingBuffer.current);\n }\n\n clearTimeout(typingTimeout.current);\n typingTimeout.current = setTimeout(() => {\n typingBuffer.current = \"\";\n }, TYPING_RESET_DELAY_MS);\n }\n\n if (event.key === \"Backspace\") {\n event.preventDefault();\n typingBuffer.current = typingBuffer.current.slice(0, -1);\n if (typingBuffer.current && typingBuffer.current !== \".\") {\n const value = Math.min(SLIDER_MAX, parseFloat(typingBuffer.current));\n updateActivePosition(value);\n setInputValue(typingBuffer.current);\n }\n clearTimeout(typingTimeout.current);\n typingTimeout.current = setTimeout(() => {\n typingBuffer.current = \"\";\n }, TYPING_RESET_DELAY_MS);\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n clearTimeout(typingTimeout.current);\n };\n }, [activeMod, picking, activeIndex, updateActivePosition]);\n\n useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n if (target.tagName === \"INPUT\" \|\| target.tagName === \"TEXTAREA\") return;\n if (event.key === \"t\") {\n event.preventDefault();\n setPicking(true);\n }\n if (hasModifications && (event.key === \"b\" \|\| event.key === \"f\" \|\| event.key === \"d\")) {\n event.preventDefault();\n const property: \"bg\" \| \"text\" \| \"border\" =\n event.key === \"b\" ? \"bg\" : event.key === \"f\" ? \"text\" : \"border\";\n const index = activeIndexRef.current;\n if (index < 0) return;\n setModifications((previous) => {\n const updated = [...previous];\n restoreModification(updated[index]);\n updated[index] = { ...updated[index], property };\n applyModification(updated[index], scalesRef.current, activeScaleRef.current);\n return updated;\n });\n }\n };\n\n const handleMiddleClick = (event: MouseEvent) => {\n if (event.button !== 1) return;\n event.preventDefault();\n setPicking(true);\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n document.addEventListener(\"mousedown\", handleMiddleClick, true);\n document.addEventListener(\"auxclick\", handleMiddleClick, true);\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n document.removeEventListener(\"mousedown\", handleMiddleClick, true);\n document.removeEventListener(\"auxclick\", handleMiddleClick, true);\n };\n }, [hasModifications]);\n\n useEffect(() => {\n return () => {\n modifications.forEach(restoreModification);\n };\n }, []);\n\n useEffect(() => {\n if (activeMod) {\n applyModification(activeMod, scales, activeScale);\n }\n }, [activeMod?.position, activeMod?.fontWeight, activeScale, scales]);\n\n useEffect(() => {\n if (!picking) return;\n\n let hoveredElement: HTMLElement \| null = null;\n\n const handleMouseOver = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n if (target.closest(\"[data-tweaker]\")) return;\n hoveredElement = target;\n target.style.outline = \"2px solid #3b82f6\";\n target.style.outlineOffset = \"2px\";\n };\n\n const handleMouseOut = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n target.style.outline = \"\";\n target.style.outlineOffset = \"\";\n if (hoveredElement === target) hoveredElement = null;\n };\n\n const handleClick = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n const target = event.target as HTMLElement;\n if (target.closest(\"[data-tweaker]\")) return;\n\n target.style.outline = \"\";\n target.style.outlineOffset = \"\";\n\n const computed = getComputedStyle(target);\n const [bgRed, bgGreen, bgBlue, bgAlpha] = parseRgb(computed.backgroundColor);\n const [textRed, textGreen, textBlue] = parseRgb(computed.color);\n const [borderRed, borderGreen, borderBlue, borderAlpha] = parseRgb(computed.borderColor);\n const hasBorder = borderAlpha > 0 && parseFloat(computed.borderWidth) > 0;\n\n const hasBackground = bgAlpha > 0;\n const defaultProperty: \"bg\" \| \"text\" \| \"border\" = hasBackground ? \"bg\" : hasBorder ? \"border\" : \"text\";\n const targetOklch =\n defaultProperty === \"bg\"\n ? rgbToOklch(bgRed, bgGreen, bgBlue)\n : defaultProperty === \"border\"\n ? rgbToOklch(borderRed, borderGreen, borderBlue)\n : rgbToOklch(textRed, textGreen, textBlue);\n\n const position = findClosestPosition(scales, activeScale, targetOklch);\n const currentWeight = parseFloat(computed.fontWeight) \|\| 400;\n\n const newModification: Modification = {\n element: target,\n selector: getSelector(target),\n componentName: null,\n sourceFile: null,\n textPreview: getTextPreview(target),\n originalInlineBg: target.style.backgroundColor,\n originalInlineColor: target.style.color,\n originalInlineBorderColor: target.style.borderColor,\n originalInlineFontWeight: target.style.fontWeight,\n property: defaultProperty,\n position,\n fontWeight: currentWeight,\n };\n\n setModifications((previous) => [...previous, newModification]);\n setActiveIndex(modifications.length);\n setInputValue(String(position));\n setPicking(false);\n };\n\n document.addEventListener(\"mouseover\", handleMouseOver, true);\n document.addEventListener(\"mouseout\", handleMouseOut, true);\n document.addEventListener(\"click\", handleClick, true);\n\n return () => {\n document.removeEventListener(\"mouseover\", handleMouseOver, true);\n document.removeEventListener(\"mouseout\", handleMouseOut, true);\n document.removeEventListener(\"click\", handleClick, true);\n if (hoveredElement) {\n hoveredElement.style.outline = \"\";\n hoveredElement.style.outlineOffset = \"\";\n }\n };\n }, [picking, activeScale, scales, modifications.length]);\n\n const fillColor = activeMod\n ? oklchToCssString(getColorAtPosition(scales, activeScale, activeMod.position))\n : scales[activeScale]?.shades[\"500\"] ?? \"rgba(255,255,255,0.3)\";\n\n const propertyLabel =\n activeMod?.property === \"text\" ? \"F\" : activeMod?.property === \"border\" ? \"D\" : \"B\";\n\n const thumbX = activeMod\n ? ((activeMod.fontWeight - FONT_WEIGHT_MIN) / (FONT_WEIGHT_MAX - FONT_WEIGHT_MIN)) * (MINIMAP_WIDTH_PX - THUMB_SIZE_PX)\n : 0;\n const thumbY = activeMod\n ? (1 - activeMod.position / SLIDER_MAX) * (MINIMAP_HEIGHT_PX - THUMB_SIZE_PX)\n : MINIMAP_HEIGHT_PX - THUMB_SIZE_PX;\n\n return (\n <AnimatePresence>\n {(hasModifications \|\| picking) && (\n <motion.div\n key=\"minimap\"\n data-tweaker\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 8 }}\n transition={{ duration: 0.2 }}\n style={minimapContainerStyle}\n >\n <div style={minimapFieldStyle}>\n <div\n style={{\n position: \"absolute\",\n left: thumbX,\n top: thumbY,\n width: THUMB_SIZE_PX,\n height: THUMB_SIZE_PX,\n borderRadius: \"50%\",\n background: fillColor,\n border: \"2px solid rgba(255,255,255,0.9)\",\n boxShadow: \"0 1px 4px rgba(0,0,0,0.4)\",\n transition: \"left 50ms, top 50ms\",\n }}\n />\n </div>\n <div style={minimapValuesStyle}>\n <span style={minimapLabelStyle}>\n {picking\n ? \"Picking…\"\n : `${propertyLabel} ${inputValue \|\| \"0\"}`}\n </span>\n {!picking && activeMod && (\n <span style={minimapLabelStyle}>\n W {Math.round(activeMod.fontWeight)}\n </span>\n )}\n </div>\n </motion.div>\n )}\n </AnimatePresence>\n );\n};\n\nconst baseTextStyle: React.CSSProperties = {\n fontFamily: \"system-ui, sans-serif\",\n fontWeight: 500,\n letterSpacing: \"-0.03em\",\n fontSynthesis: \"none\",\n WebkitFontSmoothing: \"antialiased\",\n};\n\nconst minimapContainerStyle: React.CSSProperties = {\n position: \"fixed\",\n left: 16,\n bottom: 16,\n zIndex: 9999,\n display: \"flex\",\n flexDirection: \"column\",\n gap: 6,\n pointerEvents: \"none\",\n};\n\nconst minimapFieldStyle: React.CSSProperties = {\n position: \"relative\",\n width: MINIMAP_WIDTH_PX,\n height: MINIMAP_HEIGHT_PX,\n borderRadius: 8,\n background: \"rgba(0,0,0,0.25)\",\n backdropFilter: \"blur(12px)\",\n WebkitBackdropFilter: \"blur(12px)\",\n boxShadow: \"0 0 0 1px rgba(255,255,255,0.08) inset\",\n overflow: \"hidden\",\n};\n\nconst minimapValuesStyle: React.CSSProperties = {\n display: \"flex\",\n justifyContent: \"space-between\",\n padding: \"0 2px\",\n};\n\nconst minimapLabelStyle: React.CSSProperties = {\n ...baseTextStyle,\n fontSize: 11,\n color: \"rgba(255,255,255,0.6)\",\n whiteSpace: \"nowrap\",\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../src/gray-scales.ts","../src/constants.ts","../src/utils/color.ts","../src/utils/dom.ts","../src/utils/modification.ts","../src/utils/prompt.ts","../src/tweaker.tsx"],"sourcesContent":["import type { GrayScale } from \"./types\";\n\nexport const GRAY_SCALES: Record<string, GrayScale> = {\n neutral: {\n label: \"Neutral\",\n shades: {\n \"50\": \"oklch(0.985 0 0)\",\n \"100\": \"oklch(0.97 0 0)\",\n \"200\": \"oklch(0.922 0 0)\",\n \"300\": \"oklch(0.87 0 0)\",\n \"400\": \"oklch(0.708 0 0)\",\n \"500\": \"oklch(0.556 0 0)\",\n \"600\": \"oklch(0.439 0 0)\",\n \"700\": \"oklch(0.371 0 0)\",\n \"800\": \"oklch(0.269 0 0)\",\n \"900\": \"oklch(0.205 0 0)\",\n \"950\": \"oklch(0.145 0 0)\",\n },\n },\n slate: {\n label: \"Slate\",\n shades: {\n \"50\": \"oklch(0.984 0.003 247.858)\",\n \"100\": \"oklch(0.968 0.007 247.896)\",\n \"200\": \"oklch(0.929 0.013 255.508)\",\n \"300\": \"oklch(0.869 0.022 252.894)\",\n \"400\": \"oklch(0.704 0.04 256.788)\",\n \"500\": \"oklch(0.554 0.046 257.417)\",\n \"600\": \"oklch(0.446 0.043 257.281)\",\n \"700\": \"oklch(0.372 0.044 257.287)\",\n \"800\": \"oklch(0.279 0.041 260.031)\",\n \"900\": \"oklch(0.208 0.042 265.755)\",\n \"950\": \"oklch(0.129 0.042 264.695)\",\n },\n },\n gray: {\n label: \"Gray\",\n shades: {\n \"50\": \"oklch(0.985 0.002 247.839)\",\n \"100\": \"oklch(0.967 0.003 264.542)\",\n \"200\": \"oklch(0.928 0.006 264.531)\",\n \"300\": \"oklch(0.872 0.01 258.338)\",\n \"400\": \"oklch(0.707 0.022 261.325)\",\n \"500\": \"oklch(0.551 0.027 264.364)\",\n \"600\": \"oklch(0.446 0.03 256.802)\",\n \"700\": \"oklch(0.373 0.034 259.733)\",\n \"800\": \"oklch(0.278 0.033 256.848)\",\n \"900\": \"oklch(0.21 0.034 264.665)\",\n \"950\": \"oklch(0.13 0.028 261.692)\",\n },\n },\n zinc: {\n label: \"Zinc\",\n shades: {\n \"50\": \"oklch(0.985 0 0)\",\n \"100\": \"oklch(0.967 0.001 286.375)\",\n \"200\": \"oklch(0.92 0.004 286.32)\",\n \"300\": \"oklch(0.871 0.006 286.286)\",\n \"400\": \"oklch(0.705 0.015 286.067)\",\n \"500\": \"oklch(0.552 0.016 285.938)\",\n \"600\": \"oklch(0.442 0.017 285.786)\",\n \"700\": \"oklch(0.37 0.013 285.805)\",\n \"800\": \"oklch(0.274 0.006 286.033)\",\n \"900\": \"oklch(0.21 0.006 285.885)\",\n \"950\": \"oklch(0.141 0.005 285.823)\",\n },\n },\n stone: {\n label: \"Stone\",\n shades: {\n \"50\": \"oklch(0.985 0.001 106.423)\",\n \"100\": \"oklch(0.97 0.001 106.424)\",\n \"200\": \"oklch(0.923 0.003 48.717)\",\n \"300\": \"oklch(0.869 0.005 56.366)\",\n \"400\": \"oklch(0.709 0.01 56.259)\",\n \"500\": \"oklch(0.553 0.013 58.071)\",\n \"600\": \"oklch(0.444 0.011 73.639)\",\n \"700\": \"oklch(0.374 0.01 67.558)\",\n \"800\": \"oklch(0.268 0.007 34.298)\",\n \"900\": \"oklch(0.216 0.006 56.043)\",\n \"950\": \"oklch(0.147 0.004 49.25)\",\n },\n },\n mauve: {\n label: \"Mauve\",\n shades: {\n \"50\": \"oklch(0.985 0.003 310)\",\n \"100\": \"oklch(0.968 0.006 310)\",\n \"200\": \"oklch(0.925 0.011 310)\",\n \"300\": \"oklch(0.87 0.017 310)\",\n \"400\": \"oklch(0.708 0.03 310)\",\n \"500\": \"oklch(0.556 0.03 310)\",\n \"600\": \"oklch(0.44 0.028 310)\",\n \"700\": \"oklch(0.372 0.025 310)\",\n \"800\": \"oklch(0.27 0.02 310)\",\n \"900\": \"oklch(0.208 0.018 310)\",\n \"950\": \"oklch(0.145 0.014 310)\",\n },\n },\n olive: {\n label: \"Olive\",\n shades: {\n \"50\": \"oklch(0.985 0.003 130)\",\n \"100\": \"oklch(0.968 0.006 130)\",\n \"200\": \"oklch(0.925 0.011 130)\",\n \"300\": \"oklch(0.87 0.017 130)\",\n \"400\": \"oklch(0.708 0.028 130)\",\n \"500\": \"oklch(0.556 0.028 130)\",\n \"600\": \"oklch(0.44 0.024 130)\",\n \"700\": \"oklch(0.372 0.02 130)\",\n \"800\": \"oklch(0.27 0.016 130)\",\n \"900\": \"oklch(0.208 0.014 130)\",\n \"950\": \"oklch(0.145 0.01 130)\",\n },\n },\n};\n","export const SLIDER_MAX = 10;\nexport const TEXT_PREVIEW_MAX_LENGTH = 30;\nexport const TYPING_RESET_DELAY_MS = 1500;\nexport const SHADE_KEYS = [\"50\", \"100\", \"200\", \"300\", \"400\", \"500\", \"600\", \"700\", \"800\", \"900\", \"950\"];\nexport const FONT_SIZE_MIN_PX = 1;\nexport const FONT_SIZE_MAX_PX = 200;\nexport const PADDING_MIN_PX = 0;\nexport const PADDING_MAX_PX = 200;\nexport const SCROLL_COLOR_SENSITIVITY = 0.01;\nexport const SCROLL_SIZE_SENSITIVITY = 0.1;\nexport const SCROLL_PADDING_SENSITIVITY = 0.1;\nexport const MINIMAP_WIDTH_PX = 160;\nexport const MINIMAP_HEIGHT_PX = 100;\nexport const THUMB_SIZE_PX = 10;\n","import type { OKLCH } from \"../types\";\nimport { SHADE_KEYS, SLIDER_MAX } from \"../constants\";\nimport type { GrayScale } from \"../types\";\n\nexport const parseOklch = (oklchStr: string): OKLCH => {\n const match = oklchStr.match(/oklch\$([\\d.]+)\\s+([\\d.]+)\\s+([\\d.]+)\$/);\n if (!match) return [0, 0, 0];\n return [Number(match[1]), Number(match[2]), Number(match[3])];\n};\n\nexport const lerpOklch = (colorA: OKLCH, colorB: OKLCH, interpolation: number): OKLCH => [\n colorA[0] + (colorB[0] - colorA[0]) * interpolation,\n colorA[1] + (colorB[1] - colorA[1]) * interpolation,\n colorA[2] + (colorB[2] - colorA[2]) * interpolation,\n];\n\nexport const formatOklch = (oklch: OKLCH): string =>\n `oklch(${oklch[0].toFixed(3)} ${oklch[1].toFixed(3)} ${oklch[2].toFixed(1)})`;\n\nexport const oklchToCssString = (oklch: OKLCH): string =>\n `oklch(${oklch[0]} ${oklch[1]} ${oklch[2]})`;\n\nexport const getColorAtPosition = (scales: Record<string, GrayScale>, scaleKey: string, position: number): OKLCH => {\n const scale = scales[scaleKey];\n if (!scale) return [0.5, 0, 0];\n\n const inverted = SLIDER_MAX - position;\n const segment = (inverted / SLIDER_MAX) * (SHADE_KEYS.length - 1);\n const index = Math.min(Math.floor(segment), SHADE_KEYS.length - 2);\n const interpolation = segment - index;\n\n const lower = parseOklch(scale.shades[SHADE_KEYS[index]]);\n const upper = parseOklch(scale.shades[SHADE_KEYS[index + 1]]);\n\n return lerpOklch(lower, upper, interpolation);\n};\n\nexport const getClosestShadeLabel = (position: number): string => {\n const inverted = SLIDER_MAX - position;\n const segment = (inverted / SLIDER_MAX) * (SHADE_KEYS.length - 1);\n const index = Math.round(segment);\n return SHADE_KEYS[Math.min(index, SHADE_KEYS.length - 1)];\n};\n\nexport const parseRgb = (color: string): [number, number, number, number] => {\n const match = color.match(\n /rgba?\$\\s([\\d.]+),\\s([\\d.]+),\\s([\\d.]+)(?:,\\s([\\d.]+))?\\s\$/\n );\n if (!match) return [0, 0, 0, 0];\n return [\n Number(match[1]),\n Number(match[2]),\n Number(match[3]),\n match[4] !== undefined ? Number(match[4]) : 1,\n ];\n};\n\nexport const rgbToOklch = (red: number, green: number, blue: number): OKLCH => {\n const linearize = (channel: number): number => {\n const normalized = channel / 255;\n return normalized <= 0.04045\n ? normalized / 12.92\n : Math.pow((normalized + 0.055) / 1.055, 2.4);\n };\n const linearRed = linearize(red);\n const linearGreen = linearize(green);\n const linearBlue = linearize(blue);\n\n const lmsL = Math.cbrt(0.4122214708 linearRed + 0.5363325363 * linearGreen + 0.0514459929 * linearBlue);\n const lmsM = Math.cbrt(0.2119034982 * linearRed + 0.6806995451 * linearGreen + 0.1073969566 * linearBlue);\n const lmsS = Math.cbrt(0.0883024619 * linearRed + 0.2817188376 * linearGreen + 0.6299787005 * linearBlue);\n\n const lightness = 0.2104542553 * lmsL + 0.793617785 * lmsM - 0.0040720468 * lmsS;\n const labA = 1.9779984951 * lmsL - 2.428592205 * lmsM + 0.4505937099 * lmsS;\n const labB = 0.0259040371 * lmsL + 0.7827717662 * lmsM - 0.808675766 * lmsS;\n\n const chroma = Math.sqrt(labA * labA + labB * labB);\n const hue = Math.atan2(labB, labA) * (180 / Math.PI);\n\n return [lightness, chroma, hue < 0 ? hue + 360 : hue];\n};\n\nexport const findClosestPosition = (scales: Record<string, GrayScale>, scaleKey: string, targetOklch: OKLCH): number => {\n let bestPosition = 0;\n let bestDistance = Infinity;\n\n for (let position = 0; position <= SLIDER_MAX; position++) {\n const color = getColorAtPosition(scales, scaleKey, position);\n const distance =\n (color[0] - targetOklch[0]) 2 +\n (color[1] - targetOklch[1]) 2 +\n ((color[2] - targetOklch[2]) / 360) ** 2;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestPosition = position;\n }\n }\n\n return bestPosition;\n};\n","import { TEXT_PREVIEW_MAX_LENGTH } from \"../constants\";\n\nexport const getSelector = (element: HTMLElement): string => {\n const tag = element.tagName.toLowerCase();\n const classes = Array.from(element.classList)\n .filter((className) => !className.startsWith(\"__\"))\n .slice(0, 2)\n .join(\".\");\n return classes ? `${tag}.${classes}` : tag;\n};\n\nexport const getTextPreview = (element: HTMLElement): string => {\n const text = element.textContent?.trim() \|\| \"\";\n return text.length > TEXT_PREVIEW_MAX_LENGTH\n ? `${text.slice(0, TEXT_PREVIEW_MAX_LENGTH)}…`\n : text;\n};\n","import type { GrayScale, Modification } from \"../types\";\nimport { getColorAtPosition, oklchToCssString } from \"./color\";\n\nexport const applyModification = (\n modification: Modification,\n scales: Record<string, GrayScale>,\n scaleKey: string,\n) => {\n const oklch = getColorAtPosition(scales, scaleKey, modification.position);\n const colorValue = oklchToCssString(oklch);\n if (modification.property === \"bg\") {\n modification.element.style.backgroundColor = colorValue;\n } else if (modification.property === \"text\") {\n modification.element.style.color = colorValue;\n } else {\n modification.element.style.borderColor = colorValue;\n }\n modification.element.style.fontSize = `${Math.round(modification.fontSize)}px`;\n modification.element.style.paddingTop = `${Math.round(modification.paddingY)}px`;\n modification.element.style.paddingBottom = `${Math.round(modification.paddingY)}px`;\n modification.element.style.paddingLeft = `${Math.round(modification.paddingX)}px`;\n modification.element.style.paddingRight = `${Math.round(modification.paddingX)}px`;\n};\n\nexport const restoreModification = (modification: Modification) => {\n modification.element.style.backgroundColor = modification.originalInlineBg;\n modification.element.style.color = modification.originalInlineColor;\n modification.element.style.borderColor = modification.originalInlineBorderColor;\n modification.element.style.fontSize = modification.originalInlineFontSize;\n modification.element.style.paddingTop = modification.originalInlinePaddingTop;\n modification.element.style.paddingBottom = modification.originalInlinePaddingBottom;\n modification.element.style.paddingLeft = modification.originalInlinePaddingLeft;\n modification.element.style.paddingRight = modification.originalInlinePaddingRight;\n};\n\nexport const roundToStep = (value: number): number =>\n parseFloat((Math.round(value * 10) / 10).toFixed(1));\n","import type { GrayScale, Modification } from \"../types\";\nimport { formatOklch, getColorAtPosition, getClosestShadeLabel } from \"./color\";\n\nexport const generatePrompt = (\n modifications: Modification[],\n scales: Record<string, GrayScale>,\n scaleKey: string,\n): string => {\n if (modifications.length === 0) return \"\";\n\n const scaleName = scales[scaleKey]?.label \|\| scaleKey;\n const colorLines: string[] = [];\n const sizeLines: string[] = [];\n const paddingLines: string[] = [];\n\n modifications.forEach((modification) => {\n const nameParts = [modification.selector];\n if (modification.componentName) nameParts.unshift(`<${modification.componentName}>`);\n if (modification.textPreview) nameParts.push(`(\"${modification.textPreview}\")`);\n const description = nameParts.join(\" \");\n\n const shade = getClosestShadeLabel(modification.position);\n const oklch = getColorAtPosition(scales, scaleKey, modification.position);\n const property =\n modification.property === \"bg\"\n ? \"background color\"\n : modification.property === \"text\"\n ? \"text color\"\n : \"border color\";\n colorLines.push(`- ${property} of ${description} → ${scaleName} ${shade} (${formatOklch(oklch)})`);\n if (modification.sourceFile) colorLines.push(` Source: ${modification.sourceFile}`);\n\n const originalSize = modification.originalInlineFontSize\n \|\| getComputedStyle(modification.element).fontSize;\n const newSize = Math.round(modification.fontSize);\n if (`${newSize}px` !== originalSize) {\n sizeLines.push(`- font-size of ${description} → ${newSize}px`);\n if (modification.sourceFile) sizeLines.push(` Source: ${modification.sourceFile}`);\n }\n\n const originalPaddingY = parseFloat(getComputedStyle(modification.element).paddingTop) \|\| 0;\n const originalPaddingX = parseFloat(getComputedStyle(modification.element).paddingLeft) \|\| 0;\n const newPaddingY = Math.round(modification.paddingY);\n const newPaddingX = Math.round(modification.paddingX);\n if (newPaddingY !== Math.round(originalPaddingY) \|\| newPaddingX !== Math.round(originalPaddingX)) {\n paddingLines.push(`- padding of ${description} → ${newPaddingY}px ${newPaddingX}px`);\n if (modification.sourceFile) paddingLines.push(` Source: ${modification.sourceFile}`);\n }\n });\n\n const sections: string[] = [];\n\n if (colorLines.length > 0) {\n sections.push(\n \"Change the following colors using the design system's gray scale:\",\n \"\",\n ...colorLines,\n );\n }\n\n if (sizeLines.length > 0) {\n if (sections.length > 0) sections.push(\"\");\n sections.push(\"Change the following font sizes:\", \"\", ...sizeLines);\n }\n\n if (paddingLines.length > 0) {\n if (sections.length > 0) sections.push(\"\");\n sections.push(\"Change the following padding:\", \"\", ...paddingLines);\n }\n\n return sections.join(\"\\n\");\n};\n","import { useState, useCallback, useEffect, useRef } from \"react\";\nimport { motion, AnimatePresence } from \"motion/react\";\nimport type { Modification, TweakerProps } from \"./types\";\nimport { GRAY_SCALES } from \"./gray-scales\";\nimport { SLIDER_MAX, TYPING_RESET_DELAY_MS, FONT_SIZE_MIN_PX, FONT_SIZE_MAX_PX, PADDING_MIN_PX, PADDING_MAX_PX, SCROLL_COLOR_SENSITIVITY, SCROLL_SIZE_SENSITIVITY, SCROLL_PADDING_SENSITIVITY, MINIMAP_WIDTH_PX, MINIMAP_HEIGHT_PX, THUMB_SIZE_PX } from \"./constants\";\nimport { getColorAtPosition, oklchToCssString, parseRgb, rgbToOklch, findClosestPosition } from \"./utils/color\";\nimport { getSelector, getTextPreview } from \"./utils/dom\";\nimport { applyModification, restoreModification, roundToStep } from \"./utils/modification\";\nimport { generatePrompt } from \"./utils/prompt\";\n\ntype ScrollMode = \"style\" \| \"padding\";\n\nexport const Tweaker = ({ scales = GRAY_SCALES, activeScale = \"neutral\" }: TweakerProps) => {\n const [picking, setPicking] = useState(false);\n const [modifications, setModifications] = useState<Modification[]>([]);\n const [activeIndex, setActiveIndex] = useState(-1);\n const [inputValue, setInputValue] = useState(\"\");\n const [scrollMode, setScrollMode] = useState<ScrollMode>(\"style\");\n const typingBuffer = useRef(\"\");\n const typingTimeout = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n const activeMod = activeIndex >= 0 ? modifications[activeIndex] : null;\n const hasModifications = modifications.length > 0;\n\n const activeIndexRef = useRef(activeIndex);\n const activeScaleRef = useRef(activeScale);\n const modificationsRef = useRef(modifications);\n const scalesRef = useRef(scales);\n const scrollModeRef = useRef(scrollMode);\n activeIndexRef.current = activeIndex;\n activeScaleRef.current = activeScale;\n modificationsRef.current = modifications;\n scalesRef.current = scales;\n scrollModeRef.current = scrollMode;\n\n const updateActivePosition = useCallback(\n (newPosition: number) => {\n if (activeIndex < 0) return;\n setModifications((previous) => {\n const updated = [...previous];\n updated[activeIndex] = { ...updated[activeIndex], position: newPosition };\n applyModification(updated[activeIndex], scales, activeScale);\n return updated;\n });\n },\n [activeIndex, activeScale, scales],\n );\n\n useEffect(() => {\n if (!hasModifications \|\| picking) return;\n\n const handleWheel = (event: WheelEvent) => {\n event.preventDefault();\n const index = activeIndexRef.current;\n if (index < 0) return;\n\n setModifications((previous) => {\n const updated = [...previous];\n const current = updated[index];\n\n if (scrollModeRef.current === \"padding\") {\n const newPaddingY = Math.max(PADDING_MIN_PX, Math.min(PADDING_MAX_PX, current.paddingY - event.deltaY * SCROLL_PADDING_SENSITIVITY));\n const newPaddingX = Math.max(PADDING_MIN_PX, Math.min(PADDING_MAX_PX, current.paddingX + event.deltaX * SCROLL_PADDING_SENSITIVITY));\n updated[index] = { ...current, paddingY: Math.round(newPaddingY), paddingX: Math.round(newPaddingX) };\n } else {\n const newPosition = Math.max(0, Math.min(SLIDER_MAX, current.position - event.deltaY * SCROLL_COLOR_SENSITIVITY));\n const newSize = Math.max(FONT_SIZE_MIN_PX, Math.min(FONT_SIZE_MAX_PX, current.fontSize + event.deltaX * SCROLL_SIZE_SENSITIVITY));\n updated[index] = { ...current, position: roundToStep(newPosition), fontSize: Math.round(newSize) };\n }\n\n applyModification(updated[index], scalesRef.current, activeScaleRef.current);\n setInputValue(String(updated[index].position));\n return updated;\n });\n };\n\n document.addEventListener(\"wheel\", handleWheel, { passive: false, capture: true });\n return () => {\n document.removeEventListener(\"wheel\", handleWheel, true);\n };\n }, [hasModifications, picking]);\n\n useEffect(() => {\n if (!hasModifications) return;\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n event.preventDefault();\n const prompt = generatePrompt(modificationsRef.current, scalesRef.current, activeScaleRef.current);\n navigator.clipboard.writeText(prompt);\n modificationsRef.current.forEach(restoreModification);\n setModifications([]);\n setActiveIndex(-1);\n setInputValue(\"\");\n }\n\n if (event.key === \" \") {\n event.preventDefault();\n const prompt = generatePrompt(modificationsRef.current, scalesRef.current, activeScaleRef.current);\n navigator.clipboard.writeText(prompt);\n setPicking(true);\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => document.removeEventListener(\"keydown\", handleKeyDown);\n }, [hasModifications]);\n\n useEffect(() => {\n if (!activeMod \|\| picking) return;\n\n const handleKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n if (target.tagName === \"INPUT\" \|\| target.tagName === \"TEXTAREA\") return;\n if (event.key === \"Escape\") return;\n\n if ((event.key >= \"0\" && event.key <= \"9\") \|\| event.key === \".\") {\n event.preventDefault();\n const next = typingBuffer.current + event.key;\n\n if (event.key === \".\" && typingBuffer.current.includes(\".\")) return;\n\n const hasDecimal = typingBuffer.current.includes(\".\");\n if (hasDecimal && event.key !== \".\" && typingBuffer.current.split(\".\")[1]?.length >= 1) {\n return;\n }\n\n const parsed = parseFloat(next);\n if (!isNaN(parsed) && parsed > SLIDER_MAX) {\n typingBuffer.current = event.key === \".\" ? \".\" : event.key;\n } else {\n typingBuffer.current = next;\n }\n\n const value = parseFloat(typingBuffer.current);\n if (!isNaN(value)) {\n const clamped = Math.min(SLIDER_MAX, value);\n updateActivePosition(clamped);\n setInputValue(typingBuffer.current);\n }\n\n clearTimeout(typingTimeout.current);\n typingTimeout.current = setTimeout(() => {\n typingBuffer.current = \"\";\n }, TYPING_RESET_DELAY_MS);\n }\n\n if (event.key === \"Backspace\") {\n event.preventDefault();\n typingBuffer.current = typingBuffer.current.slice(0, -1);\n if (typingBuffer.current && typingBuffer.current !== \".\") {\n const value = Math.min(SLIDER_MAX, parseFloat(typingBuffer.current));\n updateActivePosition(value);\n setInputValue(typingBuffer.current);\n }\n clearTimeout(typingTimeout.current);\n typingTimeout.current = setTimeout(() => {\n typingBuffer.current = \"\";\n }, TYPING_RESET_DELAY_MS);\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n clearTimeout(typingTimeout.current);\n };\n }, [activeMod, picking, activeIndex, updateActivePosition]);\n\n useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n if (target.tagName === \"INPUT\" \|\| target.tagName === \"TEXTAREA\") return;\n if (event.key === \"t\") {\n event.preventDefault();\n setPicking(true);\n }\n if (event.key === \"p\") {\n event.preventDefault();\n setScrollMode((previous) => (previous === \"style\" ? \"padding\" : \"style\"));\n }\n if (hasModifications && (event.key === \"b\" \|\| event.key === \"f\" \|\| event.key === \"d\")) {\n event.preventDefault();\n const property: \"bg\" \| \"text\" \| \"border\" =\n event.key === \"b\" ? \"bg\" : event.key === \"f\" ? \"text\" : \"border\";\n const index = activeIndexRef.current;\n if (index < 0) return;\n setModifications((previous) => {\n const updated = [...previous];\n restoreModification(updated[index]);\n updated[index] = { ...updated[index], property };\n applyModification(updated[index], scalesRef.current, activeScaleRef.current);\n return updated;\n });\n }\n };\n\n const handleMiddleClick = (event: MouseEvent) => {\n if (event.button !== 1) return;\n event.preventDefault();\n setPicking(true);\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n document.addEventListener(\"mousedown\", handleMiddleClick, true);\n document.addEventListener(\"auxclick\", handleMiddleClick, true);\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n document.removeEventListener(\"mousedown\", handleMiddleClick, true);\n document.removeEventListener(\"auxclick\", handleMiddleClick, true);\n };\n }, [hasModifications]);\n\n useEffect(() => {\n return () => {\n modifications.forEach(restoreModification);\n };\n }, []);\n\n useEffect(() => {\n if (activeMod) {\n applyModification(activeMod, scales, activeScale);\n }\n }, [activeMod?.position, activeMod?.fontSize, activeMod?.paddingX, activeMod?.paddingY, activeScale, scales]);\n\n useEffect(() => {\n if (!picking) return;\n\n let hoveredElement: HTMLElement \| null = null;\n\n const handleMouseOver = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n if (target.closest(\"[data-tweaker]\")) return;\n hoveredElement = target;\n target.style.outline = \"2px solid #3b82f6\";\n target.style.outlineOffset = \"2px\";\n };\n\n const handleMouseOut = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n target.style.outline = \"\";\n target.style.outlineOffset = \"\";\n if (hoveredElement === target) hoveredElement = null;\n };\n\n const handleClick = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n const target = event.target as HTMLElement;\n if (target.closest(\"[data-tweaker]\")) return;\n\n target.style.outline = \"\";\n target.style.outlineOffset = \"\";\n\n const computed = getComputedStyle(target);\n const [bgRed, bgGreen, bgBlue, bgAlpha] = parseRgb(computed.backgroundColor);\n const [textRed, textGreen, textBlue] = parseRgb(computed.color);\n const [borderRed, borderGreen, borderBlue, borderAlpha] = parseRgb(computed.borderColor);\n const hasBorder = borderAlpha > 0 && parseFloat(computed.borderWidth) > 0;\n\n const hasBackground = bgAlpha > 0;\n const defaultProperty: \"bg\" \| \"text\" \| \"border\" = hasBackground ? \"bg\" : hasBorder ? \"border\" : \"text\";\n const targetOklch =\n defaultProperty === \"bg\"\n ? rgbToOklch(bgRed, bgGreen, bgBlue)\n : defaultProperty === \"border\"\n ? rgbToOklch(borderRed, borderGreen, borderBlue)\n : rgbToOklch(textRed, textGreen, textBlue);\n\n const position = findClosestPosition(scales, activeScale, targetOklch);\n const currentSize = parseFloat(computed.fontSize) \|\| 16;\n const currentPaddingY = parseFloat(computed.paddingTop) \|\| 0;\n const currentPaddingX = parseFloat(computed.paddingLeft) \|\| 0;\n\n const newModification: Modification = {\n element: target,\n selector: getSelector(target),\n componentName: null,\n sourceFile: null,\n textPreview: getTextPreview(target),\n originalInlineBg: target.style.backgroundColor,\n originalInlineColor: target.style.color,\n originalInlineBorderColor: target.style.borderColor,\n originalInlineFontSize: target.style.fontSize,\n originalInlinePaddingTop: target.style.paddingTop,\n originalInlinePaddingBottom: target.style.paddingBottom,\n originalInlinePaddingLeft: target.style.paddingLeft,\n originalInlinePaddingRight: target.style.paddingRight,\n property: defaultProperty,\n position,\n fontSize: currentSize,\n paddingX: currentPaddingX,\n paddingY: currentPaddingY,\n };\n\n setModifications((previous) => [...previous, newModification]);\n setActiveIndex(modifications.length);\n setInputValue(String(position));\n setPicking(false);\n };\n\n document.addEventListener(\"mouseover\", handleMouseOver, true);\n document.addEventListener(\"mouseout\", handleMouseOut, true);\n document.addEventListener(\"click\", handleClick, true);\n\n return () => {\n document.removeEventListener(\"mouseover\", handleMouseOver, true);\n document.removeEventListener(\"mouseout\", handleMouseOut, true);\n document.removeEventListener(\"click\", handleClick, true);\n if (hoveredElement) {\n hoveredElement.style.outline = \"\";\n hoveredElement.style.outlineOffset = \"\";\n }\n };\n }, [picking, activeScale, scales, modifications.length]);\n\n const fillColor = activeMod\n ? oklchToCssString(getColorAtPosition(scales, activeScale, activeMod.position))\n : scales[activeScale]?.shades[\"500\"] ?? \"rgba(255,255,255,0.3)\";\n\n const propertyLabel =\n activeMod?.property === \"text\" ? \"F\" : activeMod?.property === \"border\" ? \"D\" : \"B\";\n\n const thumbX = activeMod\n ? scrollMode === \"padding\"\n ? (activeMod.paddingX / PADDING_MAX_PX) * (MINIMAP_WIDTH_PX - THUMB_SIZE_PX)\n : ((activeMod.fontSize - FONT_SIZE_MIN_PX) / (FONT_SIZE_MAX_PX - FONT_SIZE_MIN_PX)) * (MINIMAP_WIDTH_PX - THUMB_SIZE_PX)\n : 0;\n const thumbY = activeMod\n ? scrollMode === \"padding\"\n ? (1 - activeMod.paddingY / PADDING_MAX_PX) * (MINIMAP_HEIGHT_PX - THUMB_SIZE_PX)\n : (1 - activeMod.position / SLIDER_MAX) * (MINIMAP_HEIGHT_PX - THUMB_SIZE_PX)\n : MINIMAP_HEIGHT_PX - THUMB_SIZE_PX;\n\n return (\n <AnimatePresence>\n {(hasModifications \|\| picking) && (\n <motion.div\n key=\"minimap\"\n data-tweaker\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 8 }}\n transition={{ duration: 0.2 }}\n style={minimapContainerStyle}\n >\n <div style={minimapFieldStyle}>\n <div\n style={{\n position: \"absolute\",\n left: thumbX,\n top: thumbY,\n width: THUMB_SIZE_PX,\n height: THUMB_SIZE_PX,\n borderRadius: \"50%\",\n background: fillColor,\n border: \"2px solid rgba(255,255,255,0.9)\",\n boxShadow: \"0 1px 4px rgba(0,0,0,0.4)\",\n transition: \"left 50ms, top 50ms\",\n }}\n />\n </div>\n <div style={segmentContainerStyle}>\n <button\n type=\"button\"\n style={{\n ...segmentButtonStyle,\n ...(scrollMode === \"style\" ? segmentActiveStyle : {}),\n }}\n onClick={() => setScrollMode(\"style\")}\n >\n Style\n </button>\n <button\n type=\"button\"\n style={{\n ...segmentButtonStyle,\n ...(scrollMode === \"padding\" ? segmentActiveStyle : {}),\n }}\n onClick={() => setScrollMode(\"padding\")}\n >\n Padding\n </button>\n </div>\n <div style={minimapValuesStyle}>\n <span style={minimapLabelStyle}>\n {picking\n ? \"Picking…\"\n : scrollMode === \"padding\"\n ? `Y ${activeMod?.paddingY ?? 0}px`\n : `${propertyLabel} ${inputValue \|\| \"0\"}`}\n </span>\n {!picking && activeMod && (\n <span style={minimapLabelStyle}>\n {scrollMode === \"padding\"\n ? `X ${activeMod.paddingX}px`\n : `${Math.round(activeMod.fontSize)}px`}\n </span>\n )}\n </div>\n </motion.div>\n )}\n </AnimatePresence>\n );\n};\n\nconst baseTextStyle: React.CSSProperties = {\n fontFamily: \"system-ui, sans-serif\",\n fontWeight: 500,\n letterSpacing: \"-0.03em\",\n fontSynthesis: \"none\",\n WebkitFontSmoothing: \"antialiased\",\n};\n\nconst minimapContainerStyle: React.CSSProperties = {\n position: \"fixed\",\n left: 16,\n bottom: 16,\n zIndex: 9999,\n display: \"flex\",\n flexDirection: \"column\",\n gap: 6,\n};\n\nconst minimapFieldStyle: React.CSSProperties = {\n position: \"relative\",\n width: MINIMAP_WIDTH_PX,\n height: MINIMAP_HEIGHT_PX,\n borderRadius: 8,\n background: \"rgba(0,0,0,0.25)\",\n backdropFilter: \"blur(12px)\",\n WebkitBackdropFilter: \"blur(12px)\",\n boxShadow: \"0 0 0 1px rgba(255,255,255,0.08) inset\",\n overflow: \"hidden\",\n pointerEvents: \"none\",\n};\n\nconst segmentContainerStyle: React.CSSProperties = {\n display: \"flex\",\n gap: 2,\n background: \"rgba(0,0,0,0.25)\",\n backdropFilter: \"blur(12px)\",\n WebkitBackdropFilter: \"blur(12px)\",\n borderRadius: 6,\n padding: 2,\n};\n\nconst segmentButtonStyle: React.CSSProperties = {\n ...baseTextStyle,\n flex: 1,\n fontSize: 10,\n padding: \"3px 0\",\n border: \"none\",\n borderRadius: 4,\n background: \"transparent\",\n color: \"rgba(255,255,255,0.4)\",\n cursor: \"pointer\",\n transition: \"all 100ms\",\n};\n\nconst segmentActiveStyle: React.CSSProperties = {\n background: \"rgba(255,255,255,0.12)\",\n color: \"rgba(255,255,255,0.85)\",\n};\n\nconst minimapValuesStyle: React.CSSProperties = {\n display: \"flex\",\n justifyContent: \"space-between\",\n padding: \"0 2px\",\n pointerEvents: \"none\",\n};\n\nconst minimapLabelStyle: React.CSSProperties = {\n ...baseTextStyle,\n fontSize: 11,\n color: \"rgba(255,255,255,0.6)\",\n whiteSpace: \"nowrap\",\n};\n"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ben-million/tweaker",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "description": "A dev tool for tweaking colors along gray scales in React apps",
   "keywords": [
     "react",