@botharness/pixel-avatar 0.6.0 → 0.7.0

package/README.md

@@ -22,6 +22,7 @@ const svg = pixelAvatarSvg(recipe); // 32×32 viewBox, crisp edges, no ids or sc
 - `AVATAR_PARTS_V2`, `AVATAR_EXTRA_PARTS`, `hiddenChoices(recipe)`: version 2 adds elf, dwarf, orc and flower species, armor/robe/tunic/cloak outfits, helmet/hood headwear, an optional `beard`, and a flower's `petals` and `flowerBase`. `hiddenChoices` names saved choices the current species or headwear keeps but does not draw, so an editor can say so instead of discarding them.
 - `PixelCustomPart`, `withHeadpiece(recipe, part)`, `customPartId`, `isPixelCustomPart`: a Human-drawn Custom Part in the `headpiece` slot (the top 32×16 of the tile). Its back layer is drawn behind the hair and its front layer over it, and both follow the head through turns. Each cell is `[x, y, color, tone]`, where `color` is an appearance color slot (`hairColor`, `skinColor`, `eyeColor`, `shirtColor`), so the part recolors with the Avatar, or a fixed `#rrggbb`, and `tone` is a step from −2 to 2 on the rig's shade ramp (`partToneColor`). A recipe wearing a part embeds its own copy as asset version 3. `customPartId` is the SHA-256 of the canonical content; names, authors and origins belong to the consumer's library.
 - `HAIR_PART_SLOTS`, `hairPieceStart(recipe, slot)`, `withCustomPart(recipe, slot, part)`, `wornPart`: drawn hair pieces. `bangs`, `leftSideHair`, `rightSideHair` and `backHair` each take a Custom Part (front layer only) that replaces the built-in piece while it stays saved underneath. In a hair part, a `hairColor` cell at tone 0 is live hair: it is shaded with the rest of the hair exactly like the built-in piece, so `hairPieceStart` flattens the worn built-in piece into such cells and an unchanged copy renders identically. Other cells show their own color. Drawn hair follows turns and is hidden under a helmet or hood and on a flower, like built-in hair.
+- `REPLACE_PART_SLOTS`, `replacePartStart(recipe, slot)`: drawn `outfit`, `accessory`, `beard`, `glasses`, `nose`, `cheeks`, `petals` and `flowerBase` parts (front layer only). A drawn part replaces the built-in part pixel for pixel in the layer that part paints into, while the built-in choice stays saved underneath. `replacePartStart` flattens the worn built-in part for this recipe: pixels that are exactly an appearance color at a tone become that color slot, and the rest become fixed colors, so an unchanged copy renders identically. Drawn face parts never cover the speaking mouth, and drawn parts are hidden wherever the species or headwear hides the built-in part. A drawn accessory replacing a helmet or hood no longer hides the hair.
 - `emptyPartLayer`, `paintPartLayer`, `fillPartLayer`, `mirrorPartX`, `partLayer`, `partCells`, `createCustomPart`: drawing on dense layers, with pencil and eraser strokes, 4-connected flood fill and mirroring across the Avatar centerline.
 - `faceCells`, `pixelSymbolCells`, `symbolArtCells`: pixels for [`@botharness/pixel-morph`](../morph).
 - `pixelAvatarSvg(recipe, { turns, classPrefix })`: optional pre-rendered head turns, and rig layer classes (`<prefix>-body`, `-head`, `-face`, `-gaze`, `-blink`) for CSS animation.

package/dist/index.d.ts

@@ -90,6 +90,14 @@ declare const CUSTOM_PART_KEYS: {
   readonly leftSideHair: "leftSideHairPart";
   readonly rightSideHair: "rightSideHairPart";
   readonly backHair: "backHairPart";
+  readonly outfit: "outfitPart";
+  readonly accessory: "accessoryPart";
+  readonly beard: "beardPart";
+  readonly glasses: "glassesPart";
+  readonly nose: "nosePart";
+  readonly cheeks: "cheeksPart";
+  readonly petals: "petalsPart";
+  readonly flowerBase: "flowerBasePart";
 };
 type CustomPartKey = (typeof CUSTOM_PART_KEYS)[PartSlot];
 /**
@@ -177,6 +185,38 @@ declare const PART_SLOTS: {
     readonly width: 32;
     readonly height: 32;
   };
+  readonly outfit: {
+    readonly width: 32;
+    readonly height: 32;
+  };
+  readonly accessory: {
+    readonly width: 32;
+    readonly height: 32;
+  };
+  readonly beard: {
+    readonly width: 32;
+    readonly height: 32;
+  };
+  readonly glasses: {
+    readonly width: 32;
+    readonly height: 32;
+  };
+  readonly nose: {
+    readonly width: 32;
+    readonly height: 32;
+  };
+  readonly cheeks: {
+    readonly width: 32;
+    readonly height: 32;
+  };
+  readonly petals: {
+    readonly width: 32;
+    readonly height: 32;
+  };
+  readonly flowerBase: {
+    readonly width: 32;
+    readonly height: 32;
+  };
 };
 type PartSlot = keyof typeof PART_SLOTS;
 /**
@@ -186,6 +226,13 @@ type PartSlot = keyof typeof PART_SLOTS;
 declare const HAIR_PART_SLOTS: readonly ["bangs", "leftSideHair", "rightSideHair", "backHair"];
 type HairPartSlot = (typeof HAIR_PART_SLOTS)[number];
 declare const isHairPartSlot: (slot: PartSlot) => slot is HairPartSlot;
+/**
+ * Slots whose drawn part replaces a built-in part pixel for pixel: the part's cells are painted
+ * where the built-in part would be, and every cell shows its own color and tone.
+ */
+declare const REPLACE_PART_SLOTS: readonly ["outfit", "accessory", "beard", "glasses", "nose", "cheeks", "petals", "flowerBase"];
+type ReplacePartSlot = (typeof REPLACE_PART_SLOTS)[number];
+declare const isReplacePartSlot: (slot: PartSlot) => slot is ReplacePartSlot;
 /** Tone steps on the rig's shade ramp: two darker, the color itself, two lighter. */
 declare const PART_TONES: readonly [-2, -1, 0, 1, 2];
 type PartTone = (typeof PART_TONES)[number];
@@ -196,7 +243,7 @@ type PartCell = readonly [x: number, y: number, color: PartColor, tone: PartTone
 declare const PART_LAYERS: readonly ["front", "back"];
 type PartLayerName = (typeof PART_LAYERS)[number];
 /** Most fixed colors one part may use. */
-declare const MAX_PART_FIXED_COLORS = 16;
+declare const MAX_PART_FIXED_COLORS = 32;
 /**
  * A Human-drawn Custom Part. Its content is immutable and its identity is `customPartId`;
  * name, author, origin and parent are metadata kept outside it.
@@ -260,6 +307,18 @@ declare function hairPieceStart(recipe: PixelAvatarRecipe, slot: HairPartSlot):
   front: PartCell[];
   back: PartCell[];
 };
+/**
+ * The part in a replacement slot as a Custom Part to start drawing from: the drawn part worn
+ * there, or the built-in part flattened for this recipe in the front pose. Each pixel becomes a
+ * color slot and tone when it is exactly one, so it recolors with the Avatar, and a fixed color
+ * otherwise; an unchanged copy renders identically. A flattened helmet or hood no longer hides
+ * the hair: only the built-in ones do.
+ */
+declare function replacePartStart(recipe: PixelAvatarRecipe, slot: ReplacePartSlot): {
+  slot: ReplacePartSlot;
+  front: PartCell[];
+  back: PartCell[];
+};
 //#endregion
 //#region src/random.d.ts
 declare function seededRandom(seed: string): () => number;
@@ -309,5 +368,5 @@ declare function pixelSymbolCells(symbol: PixelSymbol, color: string): PixelCell
  */
 declare function symbolArtCells(rows: readonly string[], color: string): PixelCell$1[];
 //#endregion
-export { AVATAR_COLORS, AVATAR_EXTRA_PARTS, AVATAR_HAIR_PARTS, AVATAR_PARTS, AVATAR_PARTS_V2, AVATAR_PIECE_COLORS, AVATAR_PRESETS, AVATAR_RANGES, AVATAR_SPECIES, AVATAR_SPECIES_SWATCHES, AVATAR_SWATCHES, AVATAR_TURNS, type AvatarColor, type AvatarExtraPart, type AvatarHairPart, type AvatarPart, type AvatarPieceColor, type AvatarRange, type AvatarSpecies, CUSTOM_PART_KEYS, type CustomPartKey, DEFAULT_RECIPE, HAIR_PART_SLOTS, type HairPartSlot, MAX_PART_FIXED_COLORS, PART_LAYERS, PART_SLOTS, PART_TONES, PIXEL_SYMBOLS, type PartCell, type PartColor, type PartInk, type PartLayer, type PartLayerName, type PartSlot, type PartTone, type PixelAvatarRecipe, type PixelAvatarRecipeV1, type PixelAvatarRecipeV2, type PixelAvatarRecipeV3, type PixelAvatarSvgOptions, type PixelCell, type PixelCustomPart, type PixelFigureOptions, type PixelGrid, type PixelMouthState, type PixelSymbol, canonicalCustomPart, canonicalRecipe, createCustomPart, createSeededRecipe, createSeededRecipeV2, customPartId, detailedRecipe, emptyPartLayer, faceCells, fillPartLayer, hairPieceStart, hiddenChoices, isHairPartSlot, isPixelAvatarRecipe, isPixelCustomPart, mirrorPartX, paintPartLayer, partCells, partLayer, partToneColor, pixelAvatarSvg, pixelFigure, pixelSymbolCells, pixelTileColor, seededRandom, seededRecipe, seededRecipeV2, symbolArtCells, withCustomPart, withHeadpiece, withSpecies, wornPart };
+export { AVATAR_COLORS, AVATAR_EXTRA_PARTS, AVATAR_HAIR_PARTS, AVATAR_PARTS, AVATAR_PARTS_V2, AVATAR_PIECE_COLORS, AVATAR_PRESETS, AVATAR_RANGES, AVATAR_SPECIES, AVATAR_SPECIES_SWATCHES, AVATAR_SWATCHES, AVATAR_TURNS, type AvatarColor, type AvatarExtraPart, type AvatarHairPart, type AvatarPart, type AvatarPieceColor, type AvatarRange, type AvatarSpecies, CUSTOM_PART_KEYS, type CustomPartKey, DEFAULT_RECIPE, HAIR_PART_SLOTS, type HairPartSlot, MAX_PART_FIXED_COLORS, PART_LAYERS, PART_SLOTS, PART_TONES, PIXEL_SYMBOLS, type PartCell, type PartColor, type PartInk, type PartLayer, type PartLayerName, type PartSlot, type PartTone, type PixelAvatarRecipe, type PixelAvatarRecipeV1, type PixelAvatarRecipeV2, type PixelAvatarRecipeV3, type PixelAvatarSvgOptions, type PixelCell, type PixelCustomPart, type PixelFigureOptions, type PixelGrid, type PixelMouthState, type PixelSymbol, REPLACE_PART_SLOTS, type ReplacePartSlot, canonicalCustomPart, canonicalRecipe, createCustomPart, createSeededRecipe, createSeededRecipeV2, customPartId, detailedRecipe, emptyPartLayer, faceCells, fillPartLayer, hairPieceStart, hiddenChoices, isHairPartSlot, isPixelAvatarRecipe, isPixelCustomPart, isReplacePartSlot, mirrorPartX, paintPartLayer, partCells, partLayer, partToneColor, pixelAvatarSvg, pixelFigure, pixelSymbolCells, pixelTileColor, replacePartStart, seededRandom, seededRecipe, seededRecipeV2, symbolArtCells, withCustomPart, withHeadpiece, withSpecies, wornPart };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -371,7 +371,15 @@ const CUSTOM_PART_KEYS = {
 	bangs: "bangsPart",
 	leftSideHair: "leftSideHairPart",
 	rightSideHair: "rightSideHairPart",
-	backHair: "backHairPart"
+	backHair: "backHairPart",
+	outfit: "outfitPart",
+	accessory: "accessoryPart",
+	beard: "beardPart",
+	glasses: "glassesPart",
+	nose: "nosePart",
+	cheeks: "cheeksPart",
+	petals: "petalsPart",
+	flowerBase: "flowerBasePart"
 };
 const PART_KEY_ENTRIES = Object.entries(CUSTOM_PART_KEYS);
 const DEFAULT_RECIPE = {
@@ -465,10 +473,10 @@ function hiddenChoices(recipe) {
 		"nose",
 		"cheeks",
 		"glasses",
-		...recipe.beard ? ["beard"] : []
+		...recipe.beard || wornPart(recipe, "beard") ? ["beard"] : []
 	];
 	const hidden = [];
-	if (recipe.accessory === "helmet" || recipe.accessory === "hood") hidden.push(...HAIR_PIECES);
+	if ((recipe.accessory === "helmet" || recipe.accessory === "hood") && !wornPart(recipe, "accessory")) hidden.push(...HAIR_PIECES);
 	if (recipe.species === "dwarf") hidden.push("nose");
 	return hidden;
 }
@@ -894,6 +902,38 @@ const PART_SLOTS = {
 	backHair: {
 		width: 32,
 		height: 32
+	},
+	outfit: {
+		width: 32,
+		height: 32
+	},
+	accessory: {
+		width: 32,
+		height: 32
+	},
+	beard: {
+		width: 32,
+		height: 32
+	},
+	glasses: {
+		width: 32,
+		height: 32
+	},
+	nose: {
+		width: 32,
+		height: 32
+	},
+	cheeks: {
+		width: 32,
+		height: 32
+	},
+	petals: {
+		width: 32,
+		height: 32
+	},
+	flowerBase: {
+		width: 32,
+		height: 32
 	}
 };
 /**
@@ -907,6 +947,21 @@ const HAIR_PART_SLOTS = [
 	"backHair"
 ];
 const isHairPartSlot = (slot) => HAIR_PART_SLOTS.includes(slot);
+/**
+* Slots whose drawn part replaces a built-in part pixel for pixel: the part's cells are painted
+* where the built-in part would be, and every cell shows its own color and tone.
+*/
+const REPLACE_PART_SLOTS = [
+	"outfit",
+	"accessory",
+	"beard",
+	"glasses",
+	"nose",
+	"cheeks",
+	"petals",
+	"flowerBase"
+];
+const isReplacePartSlot = (slot) => REPLACE_PART_SLOTS.includes(slot);
 /** Tone steps on the rig's shade ramp: two darker, the color itself, two lighter. */
 const PART_TONES = [
 	-2,
@@ -917,7 +972,7 @@ const PART_TONES = [
 ];
 const PART_LAYERS = ["front", "back"];
 /** Most fixed colors one part may use. */
-const MAX_PART_FIXED_COLORS = 16;
+const MAX_PART_FIXED_COLORS = 32;
 const FIXED = /^#[\da-f]{6}$/iu;
 const isColor = (value) => typeof value === "string" && (AVATAR_COLORS.includes(value) || FIXED.test(value));
 function isPixelCustomPart(value) {
@@ -925,7 +980,7 @@ function isPixelCustomPart(value) {
 	const r = value;
 	if (Object.keys(r).length !== 3 || !Object.hasOwn(PART_SLOTS, r["slot"])) return false;
 	const { width, height } = PART_SLOTS[r["slot"]];
-	if (isHairPartSlot(r["slot"]) && r["back"]?.length !== 0) return false;
+	if (r["slot"] !== "headpiece" && r["back"]?.length !== 0) return false;
 	const fixed = /* @__PURE__ */ new Set();
 	for (const name of PART_LAYERS) {
 		const cells = r[name];
@@ -1879,6 +1934,15 @@ function pixelTileColor(hair) {
 	].map((v) => v * 255));
 }
 function pixelFigure(recipe, yawDeg, options = {}) {
+	const { grids: _, ...out } = renderFigure(recipe, yawDeg, options, /* @__PURE__ */ new Set());
+	return out;
+}
+const FACE_SLOTS = [
+	"nose",
+	"cheeks",
+	"glasses"
+];
+function renderFigure(recipe, yawDeg, options, omit) {
 	const yaw = yawDeg * Math.PI / 180;
 	const sinY = Math.sin(yaw);
 	const s = Math.round(sinY * 3);
@@ -1895,9 +1959,40 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 		return front(x - Math.round(d * (1 + Math.max(0, y - 20) * .4) - d * tuck), y);
 	} : front;
 	const flower = recipe.species === "flower";
-	const covered = recipe.accessory === "helmet" || recipe.accessory === "hood";
+	const hiddenNow = hiddenChoices(recipe);
+	const drawnParts = new Map(REPLACE_PART_SLOTS.flatMap((slot) => {
+		const part = wornPart(recipe, slot);
+		const shown = slot === "petals" || slot === "flowerBase" ? flower : !hiddenNow.includes(slot);
+		return part && shown ? [[slot, part.front]] : [];
+	}));
+	const skip = (slot) => omit.has(slot) || drawnParts.has(slot);
+	const covered = !skip("accessory") && (recipe.accessory === "helmet" || recipe.accessory === "hood");
 	const bare = () => false;
-	const petalRing = flower ? petals(recipe.petals ?? "trumpet", s) : bare;
+	const petalRing = flower && !skip("petals") ? petals(recipe.petals ?? "trumpet", s) : bare;
+	const faceShift = Math.round(fs * .6);
+	const mouthCells = /* @__PURE__ */ new Set();
+	for (const rows of [...Object.values(MOUTHS), [
+		".K.",
+		"KMK",
+		".K."
+	]]) {
+		const left = Math.round(C - .5 + fs * .6 - (rows[0].length - 1) / 2);
+		rows.forEach((row, dy) => [...row].forEach((code, dx) => {
+			if (code !== ".") mouthCells.add(`${left + dx},${20 + (recipe.height ?? 0) + dy}`);
+		}));
+	}
+	const mouthBox = (x, y) => mouthCells.has(`${x},${y}`);
+	const overlay = (grid, slot, keepOutMouth = false) => {
+		const cells = drawnParts.get(slot);
+		if (!cells) return;
+		const shift = FACE_SLOTS.includes(slot) ? faceShift : s;
+		for (const [x, y, color, tone] of cells) {
+			const px = x + shift;
+			if (px < 0 || px >= N || keepOutMouth && mouthBox(px, y)) continue;
+			const base = color.startsWith("#") ? color.toLowerCase() : recipe[color];
+			grid[y][px] = TONES[tone](base);
+		}
+	};
 	const builtin = flower ? {
 		back: petalRing,
 		front: bare,
@@ -1941,8 +2036,13 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 	};
 	const inked = (slot) => drawnHair.filter((drawn) => slot === "all-front" ? drawn.slot !== "backHair" : drawn.slot === slot).flatMap((drawn) => drawn.part.front.filter(([, , color, tone]) => !(color === "hairColor" && tone === 0)));
 	const body = blank();
-	if (flower) flowerBase(recipe, body, s);
-	else outfit(recipe, body, s);
+	if (flower) {
+		if (!skip("flowerBase")) flowerBase(recipe, body, s);
+		overlay(body, "flowerBase");
+	} else {
+		if (!skip("outfit")) outfit(recipe, body, s);
+		overlay(body, "outfit");
+	}
 	const back = blank();
 	if (flower) {
 		paint(back, petalRing, hairColor);
@@ -1966,11 +2066,12 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 		for (const cell of [...placed.filter((p) => p.far), ...placed.filter((p) => !p.far)]) if (cell.x >= 0 && cell.x < N) grid[cell.y][cell.x] = cell.c;
 	};
 	placeCells(back, inked("backHair"), false);
+	overlay(back, "petals");
 	if (headpiece) placeCells(back, headpiece.back);
 	const head = blank();
 	paint(head, face, skin);
 	const h = recipe.height ?? 0;
-	if (recipe.beard && !flower) {
+	if (recipe.beard && !flower && !skip("beard")) {
 		const centre = C + fs * .6;
 		const mouthX = Math.round(C - .5 + fs * .6);
 		const chin = (x, y) => face(x, y) || face(x, y - 2);
@@ -2014,7 +2115,7 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 	});
 	if (!pointed && !flower) paint(head, masks.front, hairColor);
 	for (const [x, y] of masks.ties ?? []) sprite(back, ["T"], Math.round(x), y, { T: shade(recipe.shirtColor, .8) });
-	if (!flower) accessory(recipe, head, s, face);
+	if (!flower && !skip("accessory")) accessory(recipe, head, s, face);
 	const shadeHair = (g) => {
 		const out = g.map((r) => [...r]);
 		const cells = g.flatMap((row, y) => row.flatMap((c, x) => c === hairColor ? [[x, y]] : []));
@@ -2055,6 +2156,9 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 		}
 		return out;
 	};
+	const drawnOver = blank();
+	overlay(drawnOver, "beard", true);
+	overlay(drawnOver, "accessory");
 	const crown = blank();
 	placeCells(crown, inked("all-front"), false);
 	if (headpiece) placeCells(crown, headpiece.front);
@@ -2063,6 +2167,7 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 		back,
 		body,
 		shadeHair(head),
+		drawnOver,
 		crown
 	]) for (let y = 0; y < N; y++) for (let x = 0; x < N; x++) if (layer[y][x]) figure[y][x] = layer[y][x];
 	const features = blank();
@@ -2130,6 +2235,7 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 		N: shade(skin, .84),
 		n: shade(skin, .72)
 	});
+	else if (skip("nose")) overlay(features, "nose", true);
 	else if (recipe.nose === "dot") sprite(features, ["N"], cx, 18 + h, { N: shade(skin, .78) });
 	else if (recipe.nose === "button") sprite(features, ["N"], cx, 18 + h, { N: shade(skin, .88) });
 	else if (recipe.nose === "line") sprite(features, ["N", "N"], cx, 17 + h, { N: shade(skin, .82) });
@@ -2144,11 +2250,12 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 		});
 		if (recipe.species === "goblin") for (const tx of [Math.round(mx - 2.5), Math.round(mx + 2.5)]) sprite(layer, ["T"], tx, 21 + h, { T: TUSK });
 		if (recipe.species === "orc") for (const tx of [Math.round(mx - 2.5), Math.round(mx + 2.5)]) sprite(layer, ["T", "T"], tx, 20 + h, { T: TUSK });
-		if (recipe.cheeks === "blush" && !flower) {
+		if (skip("cheeks")) overlay(layer, "cheeks", true);
+		if (recipe.cheeks === "blush" && !flower && !skip("cheeks")) {
 			sprite(layer, ["PP"], left.x - 1, 19 + h, { P: mix$1(BLUSH, skin, .25) });
 			sprite(layer, ["PP"], right.x + right.w - 1, 19 + h, { P: mix$1(BLUSH, skin, .25) });
 		}
-		if (recipe.cheeks === "freckles" && !flower) {
+		if (recipe.cheeks === "freckles" && !flower && !skip("cheeks")) {
 			sprite(layer, ["F.F"], left.x, 19 + h, { F: shade(skin, .7) });
 			sprite(layer, ["F.F"], right.x + 1, 19 + h, { F: shade(skin, .7) });
 		}
@@ -2171,7 +2278,8 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 		const corner = (x === fx - 1 || x === fx + w) && (y === eyeTop - 1 || y === eyeTop + 4);
 		return box && !inside && !(round && corner);
 	}, INK$1);
-	const lenses = flower ? "none" : recipe.glasses;
+	const lenses = flower || skip("glasses") ? "none" : recipe.glasses;
+	overlay(glasses, "glasses", true);
 	if (lenses === "round" || lenses === "square") {
 		frame(left.x, left.w, lenses === "round");
 		frame(right.x, right.w, lenses === "round");
@@ -2201,7 +2309,7 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 			hairColor: color
 		};
 		for (const k of AVATAR_PIECE_COLORS) delete plain[k];
-		for (const cell of pixelFigure(plain, yawDeg).cells) variant[cell.y][cell.x] = cell.c;
+		for (const cell of renderFigure(plain, yawDeg, {}, omit).cells) variant[cell.y][cell.x] = cell.c;
 		const near = (x, y) => mask(x, y) || mask(x - 1, y) || mask(x + 1, y) || mask(x, y - 1) || mask(x, y + 1);
 		for (let y = 0; y < N; y++) for (let x = 0; x < N; x++) if (full[y][x] && near(x, y) && !eyes[y][x] && !glasses[y][x]) full[y][x] = variant[y][x];
 	});
@@ -2210,7 +2318,7 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 	for (let y = 0; y < N; y++) for (let x = 0; x < N; x++) {
 		const c = full[y][x];
 		if (!c) continue;
-		if (y >= 22 && !head[y][x] && !back[y][x] && !crown[y][x]) bodyCells[y][x] = c;
+		if (y >= 22 && !head[y][x] && !back[y][x] && !crown[y][x] && !drawnOver[y][x]) bodyCells[y][x] = c;
 		else headCells[y][x] = c;
 	}
 	const cells = [];
@@ -2223,6 +2331,13 @@ function pixelFigure(recipe, yawDeg, options = {}) {
 		});
 	}
 	return {
+		grids: {
+			figure,
+			features: savedFeatures,
+			glasses,
+			back,
+			body
+		},
 		cells,
 		tile: `<rect width="32" height="32" rx="6" fill="${pixelTileColor(recipe.hairColor)}"/>`,
 		body: `<g class="bh-illustrated-body">${rects(bodyCells)}</g>`,
@@ -2269,6 +2384,48 @@ function hairPieceStart(recipe, slot) {
 		back: []
 	};
 }
+/**
+* The part in a replacement slot as a Custom Part to start drawing from: the drawn part worn
+* there, or the built-in part flattened for this recipe in the front pose. Each pixel becomes a
+* color slot and tone when it is exactly one, so it recolors with the Avatar, and a fixed color
+* otherwise; an unchanged copy renders identically. A flattened helmet or hood no longer hides
+* the hair: only the built-in ones do.
+*/
+function replacePartStart(recipe, slot) {
+	const worn = wornPart(recipe, slot);
+	if (worn) return {
+		slot,
+		front: [...worn.front],
+		back: []
+	};
+	const layer = slot === "glasses" ? "glasses" : slot === "nose" || slot === "cheeks" ? "features" : slot === "petals" ? "back" : slot === "outfit" || slot === "flowerBase" ? "body" : "figure";
+	const shown = renderFigure(recipe, 0, {}, /* @__PURE__ */ new Set()).grids[layer];
+	const without = renderFigure(recipe, 0, {}, new Set([slot])).grids[layer];
+	const source = (c) => {
+		for (const key of AVATAR_COLORS) for (const tone of [
+			0,
+			-1,
+			1,
+			-2,
+			2
+		]) if (TONES[tone](recipe[key].toLowerCase()) === c) return [key, tone];
+		return [c, 0];
+	};
+	const front = [];
+	for (let y = 0; y < N; y++) for (let x = 0; x < N; x++) {
+		const c = shown[y][x];
+		if (c && c !== without[y][x]) front.push([
+			x,
+			y,
+			...source(c)
+		]);
+	}
+	return {
+		slot,
+		front,
+		back: []
+	};
+}
 
 //#endregion
 //#region src/svg.ts
@@ -2792,5 +2949,5 @@ function symbolArtCells(rows, color) {
 }
 
 //#endregion
-export { AVATAR_COLORS, AVATAR_EXTRA_PARTS, AVATAR_HAIR_PARTS, AVATAR_PARTS, AVATAR_PARTS_V2, AVATAR_PIECE_COLORS, AVATAR_PRESETS, AVATAR_RANGES, AVATAR_SPECIES, AVATAR_SPECIES_SWATCHES, AVATAR_SWATCHES, AVATAR_TURNS, CUSTOM_PART_KEYS, DEFAULT_RECIPE, HAIR_PART_SLOTS, MAX_PART_FIXED_COLORS, PART_LAYERS, PART_SLOTS, PART_TONES, PIXEL_SYMBOLS, canonicalCustomPart, canonicalRecipe, createCustomPart, createSeededRecipe, createSeededRecipeV2, customPartId, detailedRecipe, emptyPartLayer, faceCells, fillPartLayer, hairPieceStart, hiddenChoices, isHairPartSlot, isPixelAvatarRecipe, isPixelCustomPart, mirrorPartX, paintPartLayer, partCells, partLayer, partToneColor, pixelAvatarSvg, pixelFigure, pixelSymbolCells, pixelTileColor, seededRandom, seededRecipe, seededRecipeV2, symbolArtCells, withCustomPart, withHeadpiece, withSpecies, wornPart };
+export { AVATAR_COLORS, AVATAR_EXTRA_PARTS, AVATAR_HAIR_PARTS, AVATAR_PARTS, AVATAR_PARTS_V2, AVATAR_PIECE_COLORS, AVATAR_PRESETS, AVATAR_RANGES, AVATAR_SPECIES, AVATAR_SPECIES_SWATCHES, AVATAR_SWATCHES, AVATAR_TURNS, CUSTOM_PART_KEYS, DEFAULT_RECIPE, HAIR_PART_SLOTS, MAX_PART_FIXED_COLORS, PART_LAYERS, PART_SLOTS, PART_TONES, PIXEL_SYMBOLS, REPLACE_PART_SLOTS, canonicalCustomPart, canonicalRecipe, createCustomPart, createSeededRecipe, createSeededRecipeV2, customPartId, detailedRecipe, emptyPartLayer, faceCells, fillPartLayer, hairPieceStart, hiddenChoices, isHairPartSlot, isPixelAvatarRecipe, isPixelCustomPart, isReplacePartSlot, mirrorPartX, paintPartLayer, partCells, partLayer, partToneColor, pixelAvatarSvg, pixelFigure, pixelSymbolCells, pixelTileColor, replacePartStart, seededRandom, seededRecipe, seededRecipeV2, symbolArtCells, withCustomPart, withHeadpiece, withSpecies, wornPart };
 //# sourceMappingURL=index.js.map