fix: update i18n - update schema fields descriptions

2026-09-14 13:36:36 +00:00 · 2026-09-13 07:16:46 +05:00
parent 4de42b1e40
commit 08c9fbce3b
10 changed files with 287 additions and 57 deletions
@@ -26,6 +26,8 @@
 		label: string;
 		value: unknown;
 		spec: FieldSpec;
+		toolId: string;
+		fieldId: string;
 		onchange?: (value: unknown) => void;
 	}

@@ -49,10 +51,11 @@
 	interface Props {
 		schema: ToolSchema<Record<string, unknown>>;
 		values: Record<string, unknown>;
+		toolId: string;
 		onchange: (id: string, value: unknown) => void;
 		onreset: () => void;
 	}
-	let { schema, values, onchange, onreset }: Props = $props();
+	let { schema, values, toolId, onchange, onreset }: Props = $props();

 	interface LayoutGroup {
 		key: string;
@@ -104,6 +107,8 @@
 				label={fieldLabel(schema.fields[id], id)}
 				value={values[id]}
 				spec={schema.fields[id].spec}
+				{toolId}
+				fieldId={id}
 				onchange={(v) => onchange(id, v)}
 			/>
 		{/each}
@@ -179,7 +179,13 @@
 					<span class="label">{t("paramsCard.toolSettings")}</span>
 					<strong>{t("paramsCard.configureOutput")}</strong>
 				</div>
-				<SchemaFields {schema} {values} onchange={setValue} onreset={reset} />
+				<SchemaFields
+					{schema}
+					{values}
+					toolId={tool.id}
+					onchange={setValue}
+					onreset={reset}
+				/>
 			</section>

 			<section class="panel">
@@ -1,13 +1,16 @@
 <script lang="ts">
+	import { optionLabel } from "$lib/i18n/schema-tool-strings";
 	import type { FieldSpec, SelectSpec } from "$lib/registry-schema";

 	interface Props {
 		label: string;
 		value: unknown;
 		spec: FieldSpec;
+		toolId: string;
+		fieldId: string;
 		onchange?: (value: string) => void;
 	}
-	let { label, value, spec, onchange }: Props = $props();
+	let { label, value, spec, toolId, fieldId, onchange }: Props = $props();

 	const sp = $derived(spec as SelectSpec);
 	const current = $derived(
@@ -25,7 +28,9 @@
 		oninput={(e) => onchange?.((e.target as HTMLSelectElement).value)}
 	>
 		{#each sp.options as option (option.value)}
-			<option value={option.value}>{option.label}</option>
+			<option value={option.value}>
+				{optionLabel(toolId, fieldId, option.value, option.label)}
+			</option>
 		{/each}
 	</select>
 </label>
@@ -203,7 +203,26 @@ export const en: Dict = {
 		tooManyParts: "Too many parts ({count}). Maximum is 1000.",
 		toolUnknown: 'No tool is registered under "{id}".',
 	},
-	fields: {},
+	fields: {
+		amount: "Amount",
+		background: "Background",
+		blockSize: "Block size",
+		channelTolerance: "Channel tolerance",
+		color: "Color",
+		colorTolerance: "Color tolerance",
+		fillColor: "Fill color",
+		highlightColor: "Highlight color",
+		lumaThreshold: "Luminance threshold",
+		mode: "Mode",
+		opacity: "Opacity",
+		quality: "Quality",
+		radius: "Radius",
+		rarity: "Rarity",
+		seed: "Seed",
+		strength: "Strength",
+		threshold: "Threshold",
+		width: "Width",
+	},
 	groups: {
 		adjust: "Adjust",
 		anchor: "Anchor",
@@ -264,5 +283,40 @@ export const en: Dict = {
 				orientationSquare: "Square — the sides are equal.",
 			},
 		},
+		"show-transparent-png": {
+			options: {
+				mode: { binary: "Black & white mask", highlight: "Color highlight" },
+			},
+		},
+		"show-grayscale-pixels-png": {
+			options: {
+				mode: { binary: "Black & white mask", highlight: "Color highlight" },
+			},
+		},
+		"show-color-pixels-png": {
+			options: {
+				mode: { binary: "Black & white mask", highlight: "Color highlight" },
+			},
+		},
+		"light-pixel-mask-png": {
+			options: {
+				mode: { binary: "Black & white mask", highlight: "Color highlight" },
+			},
+		},
+		"dark-pixel-mask-png": {
+			options: {
+				mode: { binary: "Black & white mask", highlight: "Color highlight" },
+			},
+		},
+		"unique-color-mask-png": {
+			options: {
+				mode: { binary: "Black & white mask", highlight: "Color highlight" },
+			},
+		},
+		"add-noise-png": {
+			options: {
+				mode: { mono: "Monochrome grain", color: "Color noise" },
+			},
+		},
 	},
 };
@@ -204,7 +204,26 @@ export const ru: Dict = {
 		tooManyParts: "Слишком много частей ({count}). Ограничение — 1000.",
 		toolUnknown: "Инструмента с id «{id}» нет в реестре.",
 	},
-	fields: {},
+	fields: {
+		amount: "Количество",
+		background: "Фон",
+		blockSize: "Размер блока",
+		channelTolerance: "Допуск по каналам",
+		color: "Цвет",
+		colorTolerance: "Допуск похожести",
+		fillColor: "Цвет заливки",
+		highlightColor: "Цвет подсветки",
+		lumaThreshold: "Порог яркости",
+		mode: "Режим",
+		opacity: "Непрозрачность",
+		quality: "Качество",
+		radius: "Радиус",
+		rarity: "Максимум повторов",
+		seed: "Сид",
+		strength: "Сила",
+		threshold: "Порог",
+		width: "Ширина",
+	},
 	groups: {
 		adjust: "Коррекция",
 		anchor: "Привязка",
@@ -33,6 +33,16 @@ export function groupLabel(title: string): string {
 	return t(title);
 }

+/** Подпись опции select: словарь `tools[id].options[fieldId][value]`, фолбэк — label из схемы. */
+export function optionLabel(
+	toolId: string,
+	fieldId: string,
+	value: string,
+	fallback: string,
+): string {
+	return getMergedDict().tools[toolId]?.options?.[fieldId]?.[value] ?? fallback;
+}
+
 export function verdictText(toolId: string, key: string): string {
 	return getMergedDict().tools[toolId]?.results?.[key] ?? key;
 }
@@ -14,7 +14,15 @@
 import type { Position9 } from "./core/textdraw";
 import type { TextFont } from "./core/domText";

-export interface NumberSpec {
+/**
+ * Общее необязательное поле всех спеков: ключ подписи поля в словаре.
+ * Рендерится через `fieldLabel` (решение C) — без ключа используется `labelOf(id)`.
+ */
+export interface FieldSpecBase {
+	label?: string;
+}
+
+export interface NumberSpec extends FieldSpecBase {
 	kind: "number";
 	default: number;
 	min?: number;
@@ -22,7 +30,7 @@ export interface NumberSpec {
 	step?: number;
 }

-export interface SliderSpec {
+export interface SliderSpec extends FieldSpecBase {
 	kind: "slider";
 	default: number;
 	min: number;
@@ -30,24 +38,24 @@ export interface SliderSpec {
 	step?: number;
 }

-export interface ColorSpec {
+export interface ColorSpec extends FieldSpecBase {
 	kind: "color";
 	default: string;
 }

-export interface SelectSpec<V extends string = string> {
+export interface SelectSpec<V extends string = string> extends FieldSpecBase {
 	kind: "select";
 	default: V;
 	options: { value: V; label: string }[];
 }

-export interface TextSpec {
+export interface TextSpec extends FieldSpecBase {
 	kind: "text";
 	default: string;
 	placeholder?: string;
 }

-export interface CheckboxSpec {
+export interface CheckboxSpec extends FieldSpecBase {
 	kind: "checkbox";
 	default: boolean;
 }
@@ -58,7 +66,7 @@ export interface Dimension {
 	height: number;
 }

-export interface DimensionSpec {
+export interface DimensionSpec extends FieldSpecBase {
 	kind: "dimension";
 	/** Общий диапазон для обоих измерений. */
 	min: number;
@@ -73,7 +81,7 @@ export interface ColorPair {
 	to: string;
 }

-export interface ColorPairSpec {
+export interface ColorPairSpec extends FieldSpecBase {
 	kind: "color-pair";
 	from: string;
 	to: string;
@@ -82,7 +90,7 @@ export interface ColorPairSpec {
 /** Список цветов (палитра): массив hex-строк. */
 export type ColorList = string[];

-export interface ColorListSpec {
+export interface ColorListSpec extends FieldSpecBase {
 	kind: "colors";
 	default: string[];
 }
@@ -93,7 +101,7 @@ export interface Offset {
 	y: number;
 }

-export interface OffsetSpec {
+export interface OffsetSpec extends FieldSpecBase {
 	kind: "offset";
 	/** Общий диапазон для обеих осей (в процентах). */
 	min: number;
@@ -118,7 +126,7 @@ export const POSITION9_VALUES = [
 	"bottom-right",
 ] as const;

-export interface Position9Spec {
+export interface Position9Spec extends FieldSpecBase {
 	kind: "position9";
 	default: Position9;
 }
@@ -134,7 +142,7 @@ export interface FontStyle {
 	color: string;
 }

-export interface FontStyleSpec {
+export interface FontStyleSpec extends FieldSpecBase {
 	kind: "font-style";
 	/** Диапазон размера шрифта. */
 	min: number;
@@ -155,7 +163,7 @@ export interface Plate {
 	opacity: number;
 }

-export interface PlateSpec {
+export interface PlateSpec extends FieldSpecBase {
 	kind: "plate";
 	enabled: boolean;
 	color: string;
@@ -172,7 +180,7 @@ export interface Gradient {
 	angle: number;
 }

-export interface GradientSpec {
+export interface GradientSpec extends FieldSpecBase {
 	kind: "gradient";
 	from: string;
 	to: string;
@@ -1,5 +1,5 @@
-import { imgTool, textGen, type ToolEntry } from "./types";
-import { field, toolSchema } from "../registry-schema";
+import { hasTransparency, isGrayscale, orientationOf } from "../core/analyze";
+import { encode } from "../core/io";
 import {
 	extractByColor,
 	isGrayscaleish,
@@ -7,10 +7,10 @@ import {
 	rarityPredicate,
 	renderPredicateMask,
 } from "../core/masks";
-import { hasTransparency, isGrayscale, orientationOf } from "../core/analyze";
-import { encode } from "../core/io";
 import { base64ToBytes, looksLikePng, stripDataUri } from "../core/textio";
 import { t } from "../i18n/t";
+import { field, toolSchema } from "../registry-schema";
+import { imgTool, textGen, type ToolEntry } from "./types";

 interface ExtractColorParams {
 	color: string;
@@ -18,8 +18,14 @@ interface ExtractColorParams {
 }

 export const extractColorSchema = toolSchema<ExtractColorParams>({
-	color: field.color({ default: "#00ff88" }),
-	tolerance: field.slider({ min: 0, max: 50, step: 1, default: 10 }),
+	color: field.color({ label: "fields.color", default: "#00ff88" }),
+	tolerance: field.slider({
+		label: "fields.colorTolerance",
+		min: 0,
+		max: 50,
+		step: 1,
+		default: 10,
+	}),
 });

 const extractColor: ToolEntry<ExtractColorParams> = {
@@ -41,14 +47,21 @@ interface MaskParams {

 const maskBaseFields = {
 	mode: field.select({
+		label: "fields.mode",
 		default: "binary",
 		options: [
 			{ value: "binary", label: "Black & white mask" },
 			{ value: "highlight", label: "Color highlight" },
 		],
 	}),
-	color: field.color({ default: "#ff00aa" }),
-	opacity: field.slider({ min: 0, max: 100, step: 5, default: 70 }),
+	color: field.color({ label: "fields.highlightColor", default: "#ff00aa" }),
+	opacity: field.slider({
+		label: "fields.opacity",
+		min: 0,
+		max: 100,
+		step: 5,
+		default: 70,
+	}),
 };

 function renderMask(
@@ -66,6 +79,7 @@ function renderMask(
 export const showTransparentSchema = toolSchema<MaskParams>({
 	...maskBaseFields,
 	mode: field.select({
+		label: "fields.mode",
 		default: "highlight",
 		options: [
 			{ value: "binary", label: "Black & white mask" },
@@ -91,7 +105,13 @@ interface GrayscalePixelsParams extends MaskParams {

 export const showGrayscalePixelsSchema = toolSchema<GrayscalePixelsParams>({
 	...maskBaseFields,
-	tolerance: field.slider({ min: 0, max: 64, step: 1, default: 0 }),
+	tolerance: field.slider({
+		label: "fields.channelTolerance",
+		min: 0,
+		max: 64,
+		step: 1,
+		default: 0,
+	}),
 });

 const showGrayscalePixels: ToolEntry<GrayscalePixelsParams> = {
@@ -113,7 +133,13 @@ interface ColorPixelsParams extends MaskParams {

 export const showColorPixelsSchema = toolSchema<ColorPixelsParams>({
 	...maskBaseFields,
-	tolerance: field.slider({ min: 0, max: 64, step: 1, default: 8 }),
+	tolerance: field.slider({
+		label: "fields.channelTolerance",
+		min: 0,
+		max: 64,
+		step: 1,
+		default: 8,
+	}),
 });

 const showColorPixels: ToolEntry<ColorPixelsParams> = {
@@ -135,7 +161,13 @@ interface LightPixelParams extends MaskParams {

 export const lightPixelMaskSchema = toolSchema<LightPixelParams>({
 	...maskBaseFields,
-	threshold: field.slider({ min: 0, max: 100, step: 1, default: 70 }),
+	threshold: field.slider({
+		label: "fields.lumaThreshold",
+		min: 0,
+		max: 100,
+		step: 1,
+		default: 70,
+	}),
 });

 const lightPixelMask: ToolEntry<LightPixelParams> = {
@@ -156,7 +188,13 @@ interface DarkPixelParams extends MaskParams {

 export const darkPixelMaskSchema = toolSchema<DarkPixelParams>({
 	...maskBaseFields,
-	threshold: field.slider({ min: 0, max: 100, step: 1, default: 30 }),
+	threshold: field.slider({
+		label: "fields.lumaThreshold",
+		min: 0,
+		max: 100,
+		step: 1,
+		default: 30,
+	}),
 });

 const darkPixelMask: ToolEntry<DarkPixelParams> = {
@@ -177,7 +215,13 @@ interface UniqueColorParams extends MaskParams {

 export const uniqueColorMaskSchema = toolSchema<UniqueColorParams>({
 	...maskBaseFields,
-	rarity: field.slider({ min: 1, max: 50, step: 1, default: 1 }),
+	rarity: field.slider({
+		label: "fields.rarity",
+		min: 1,
+		max: 50,
+		step: 1,
+		default: 1,
+	}),
 });

 const uniqueColorMask: ToolEntry<UniqueColorParams> = {
@@ -1,6 +1,6 @@
-import { imgTool, textGen, type ToolEntry } from "./types";
-import { field, toolSchema } from "../registry-schema";
 import { flattenOntoColor } from "../core/alpha";
+import { decodeBytes, decodeSvgText, toBase64, toDataUrl } from "../core/io";
+import { hexToPixels, pixelsToHex } from "../core/text";
 import {
 	base64ToBytes,
 	bytesToImage,
@@ -9,12 +9,18 @@ import {
 	rgbValuesToImage,
 	stripDataUri,
 } from "../core/textio";
-import { hexToPixels, pixelsToHex } from "../core/text";
 import { clonePixelImage } from "../core/types";
-import { decodeBytes, decodeSvgText, toBase64, toDataUrl } from "../core/io";
+import { field, toolSchema } from "../registry-schema";
+import { imgTool, textGen, type ToolEntry } from "./types";

 const widthProps = (defaultValue: number) =>
-	field.number({ min: 1, max: 10000, step: 1, default: defaultValue });
+	field.number({
+		label: "fields.width",
+		min: 1,
+		max: 10000,
+		step: 1,
+		default: defaultValue,
+	});

 interface ConvertToJpgParams {
 	background: string;
@@ -22,8 +28,14 @@ interface ConvertToJpgParams {
 }

 export const convertToJpgSchema = toolSchema<ConvertToJpgParams>({
-	background: field.color({ default: "#ffffff" }),
-	quality: field.slider({ min: 1, max: 100, step: 1, default: 90 }),
+	background: field.color({ label: "fields.background", default: "#ffffff" }),
+	quality: field.slider({
+		label: "fields.quality",
+		min: 1,
+		max: 100,
+		step: 1,
+		default: 90,
+	}),
 });

 const convertToJpg: ToolEntry<ConvertToJpgParams> = {
@@ -43,7 +55,13 @@ interface ConvertToWebpParams {
 }

 export const convertToWebpSchema = toolSchema<ConvertToWebpParams>({
-	quality: field.slider({ min: 1, max: 100, step: 1, default: 90 }),
+	quality: field.slider({
+		label: "fields.quality",
+		min: 1,
+		max: 100,
+		step: 1,
+		default: 90,
+	}),
 });

 const convertToWebp: ToolEntry<ConvertToWebpParams> = {
@@ -1,21 +1,27 @@
-import { imgTool, type ToolEntry } from "./types";
-import { field, toolSchema } from "../registry-schema";
+import { gaussianBlur, sharpen as sharpenImage } from "../core/convolution";
+import { vignette } from "../core/effects";
+import { jpegRoundtrip } from "../core/io";
 import {
 	addNoise,
 	pixelate,
 	shuffleBlocks,
 	silhouette,
 } from "../core/pixel-fx";
-import { gaussianBlur, sharpen as sharpenImage } from "../core/convolution";
-import { vignette } from "../core/effects";
-import { jpegRoundtrip } from "../core/io";
+import { field, toolSchema } from "../registry-schema";
+import { imgTool, type ToolEntry } from "./types";

 interface BlurParams {
 	radius: number;
 }

 export const blurSchema = toolSchema<BlurParams>({
-	radius: field.slider({ min: 1, max: 32, step: 1, default: 4 }),
+	radius: field.slider({
+		label: "fields.radius",
+		min: 1,
+		max: 32,
+		step: 1,
+		default: 4,
+	}),
 });

 const blurTool: ToolEntry<BlurParams> = {
@@ -34,7 +40,13 @@ interface SharpenParams {
 }

 export const sharpenSchema = toolSchema<SharpenParams>({
-	strength: field.slider({ min: 0, max: 100, step: 1, default: 50 }),
+	strength: field.slider({
+		label: "fields.strength",
+		min: 0,
+		max: 100,
+		step: 1,
+		default: 50,
+	}),
 });

 const sharpenTool: ToolEntry<SharpenParams> = {
@@ -54,8 +66,14 @@ interface SilhouetteParams {
 }

 export const silhouetteSchema = toolSchema<SilhouetteParams>({
-	color: field.color({ default: "#111318" }),
-	threshold: field.slider({ min: 0, max: 100, step: 1, default: 10 }),
+	color: field.color({ label: "fields.fillColor", default: "#111318" }),
+	threshold: field.slider({
+		label: "fields.threshold",
+		min: 0,
+		max: 100,
+		step: 1,
+		default: 10,
+	}),
 });

 const silhouetteTool: ToolEntry<SilhouetteParams> = {
@@ -74,7 +92,13 @@ interface VignetteParams {
 }

 export const vignetteSchema = toolSchema<VignetteParams>({
-	strength: field.slider({ min: 0, max: 100, step: 5, default: 50 }),
+	strength: field.slider({
+		label: "fields.strength",
+		min: 0,
+		max: 100,
+		step: 5,
+		default: 50,
+	}),
 });

 const vignetteTool: ToolEntry<VignetteParams> = {
@@ -93,7 +117,13 @@ interface PixelateParams {
 }

 export const pixelateSchema = toolSchema<PixelateParams>({
-	blockSize: field.slider({ min: 2, max: 64, step: 1, default: 8 }),
+	blockSize: field.slider({
+		label: "fields.blockSize",
+		min: 2,
+		max: 64,
+		step: 1,
+		default: 8,
+	}),
 });

 const pixelateTool: ToolEntry<PixelateParams> = {
@@ -114,8 +144,20 @@ interface RandomizePixelsParams {

 export const randomizePixelsSchema = toolSchema<RandomizePixelsParams>(
 	{
-		blockSize: field.slider({ min: 1, max: 64, step: 1, default: 8 }),
-		seed: field.number({ min: 0, max: 999999, step: 1, default: 42 }),
+		blockSize: field.slider({
+			label: "fields.blockSize",
+			min: 1,
+			max: 64,
+			step: 1,
+			default: 8,
+		}),
+		seed: field.number({
+			label: "fields.seed",
+			min: 0,
+			max: 999999,
+			step: 1,
+			default: 42,
+		}),
 	},
 	{
 		layout: {
@@ -145,15 +187,28 @@ interface AddNoiseParams {

 export const addNoiseSchema = toolSchema<AddNoiseParams>(
 	{
-		amount: field.slider({ min: 0, max: 100, step: 1, default: 25 }),
+		amount: field.slider({
+			label: "fields.amount",
+			min: 0,
+			max: 100,
+			step: 1,
+			default: 25,
+		}),
 		mode: field.select({
+			label: "fields.mode",
 			default: "mono",
 			options: [
 				{ value: "mono", label: "Monochrome grain" },
 				{ value: "color", label: "Color noise" },
 			],
 		}),
-		seed: field.number({ min: 0, max: 999999, step: 1, default: 1234 }),
+		seed: field.number({
+			label: "fields.seed",
+			min: 0,
+			max: 999999,
+			step: 1,
+			default: 1234,
+		}),
 	},
 	{
 		layout: {
@@ -181,7 +236,13 @@ interface JpegArtifactsParams {
 }

 export const jpegArtifactsSchema = toolSchema<JpegArtifactsParams>({
-	quality: field.slider({ min: 1, max: 50, step: 1, default: 10 }),
+	quality: field.slider({
+		label: "fields.quality",
+		min: 1,
+		max: 50,
+		step: 1,
+		default: 10,
+	}),
 });

 const jpegArtifacts: ToolEntry<JpegArtifactsParams> = {