From 6b0b0646d51d3b3f74e4d132df2bfd44be411530 Mon Sep 17 00:00:00 2001 From: Ku6epXBOCTuK Date: Thu, 10 Sep 2026 09:59:44 +0500 Subject: [PATCH] feat: update generate tool to new types --- web/src/lib/registry-new/generate.ts | 94 +++++++++++++++++++--------- 1 file changed, 63 insertions(+), 31 deletions(-) diff --git a/web/src/lib/registry-new/generate.ts b/web/src/lib/registry-new/generate.ts index b359ba1..ba08754 100644 --- a/web/src/lib/registry-new/generate.ts +++ b/web/src/lib/registry-new/generate.ts @@ -2,7 +2,6 @@ import { renderEmoji, renderTextToImage } from "../core/domText"; import { colorSpectrum, drawGrid, randomColorBlocks } from "../core/gen-tools"; import { noiseImage, solidImage } from "../core/generate"; import { changeCanvasSize } from "../core/geometry"; -import type { PixelImage } from "../core/types"; import { analogousSet, complementarySet, @@ -18,6 +17,7 @@ import { tetradicSet, triadicSet, } from "../core/palette"; +import type { PixelImage } from "../core/types"; import { field, toolSchema, @@ -26,7 +26,7 @@ import { type FontStyle, type Gradient, } from "../registry-schema"; -import type { ToolEntry } from "./types"; +import { genTool, type ToolEntry } from "./types"; function rgba(hex: string): [number, number, number, number] { const { r, g, b } = hexToRgb(hex); @@ -101,14 +101,15 @@ const createEmpty: ToolEntry = { "Creates a blank canvas of the chosen dimensions, either transparent or filled with a solid color.", category: "generate", schema: createEmptySchema, - generate: (p) => { + input: "none", + run: genTool((p) => { const w = Math.trunc(p.size.width); const h = Math.trunc(p.size.height); if (p.transparent) { return solidImage(w, h, [0, 0, 0, 0]); } return solidImage(w, h, rgba(p.color)); - }, + }), }; interface SingleColorParams { @@ -127,11 +128,12 @@ const singleColor: ToolEntry = { description: "Generates a rectangle of the given size and color.", category: "generate", schema: singleColorSchema, - generate: (p) => { + input: "none", + run: genTool((p) => { const w = Math.trunc(p.size.width); const h = Math.trunc(p.size.height); return solidImage(w, h, rgba(p.color)); - }, + }), }; interface RandomNoiseParams { @@ -151,11 +153,12 @@ const randomNoise: ToolEntry = { "Generates an image with random pixels. The seed fixes the result: one seed — one image.", category: "generate", schema: randomNoiseSchema, - generate: (p) => { + input: "none", + run: genTool((p) => { const w = Math.trunc(p.size.width); const h = Math.trunc(p.size.height); return noiseImage(w, h, p.seed); - }, + }), }; interface LinearGradientParams { @@ -185,7 +188,8 @@ const linearGradient: ToolEntry = { "Generates a smooth transition between two colors along a chosen angle.", category: "generate", schema: linearGradientSchema, - generate: (p) => { + input: "none", + run: genTool((p) => { const w = Math.trunc(p.size.width); const h = Math.trunc(p.size.height); return angleGradient( @@ -195,7 +199,7 @@ const linearGradient: ToolEntry = { rgba(p.gradient.to), p.gradient.angle, ); - }, + }), }; interface ColorSpectrumParams { @@ -235,11 +239,12 @@ const colorSpectrumTool: ToolEntry = { "Full hue rainbow 0–360° along the chosen axis with adjustable saturation and lightness.", category: "generate", schema: colorSpectrumSchema, - generate: (p) => { + input: "none", + run: genTool((p) => { const w = Math.trunc(p.size.width); const h = Math.trunc(p.size.height); return colorSpectrum(w, h, p.direction, p.saturation, p.lightness); - }, + }), }; interface RandomColorsParams { @@ -271,11 +276,12 @@ const randomColors: ToolEntry = { "Fills the canvas with random vivid color blocks. Deterministic by seed.", category: "generate", schema: randomColorsSchema, - generate: (p) => { + input: "none", + run: genTool((p) => { const w = Math.trunc(p.size.width); const h = Math.trunc(p.size.height); return randomColorBlocks(w, h, p.blockSize, p.seed); - }, + }), }; interface DrawGridParams { @@ -317,7 +323,8 @@ const drawGridTool: ToolEntry = { "Draws a grid with custom columns, rows and line width on a transparent or white background.", category: "generate", schema: drawGridSchema, - generate: (p) => { + input: "none", + run: genTool((p) => { const w = Math.trunc(p.size.width); const h = Math.trunc(p.size.height); return drawGrid( @@ -329,7 +336,7 @@ const drawGridTool: ToolEntry = { p.color, p.transparentBg, ); - }, + }), }; interface PlaceholderParams { @@ -364,7 +371,8 @@ const placeholder: ToolEntry = { "Generates a placeholder rectangle with its dimensions printed in the center.", category: "generate", schema: placeholderSchema, - generate: (p) => { + input: "none", + run: genTool((p) => { const w = Math.trunc(p.size.width); const h = Math.trunc(p.size.height); let out = solidImage(w, h, rgba(p.backgroundColor)); @@ -382,7 +390,7 @@ const placeholder: ToolEntry = { out = changeCanvasSize(label, w, h, "center"); } return out; - }, + }), }; interface BlendTwoParams { @@ -401,7 +409,8 @@ const blendTwo: ToolEntry = { description: "A continuous horizontal gradient between two colors.", category: "generate", schema: blendTwoSchema, - generate: (p) => renderBlend(p.pair.from, p.pair.to, p.width), + input: "none", + run: genTool((p) => renderBlend(p.pair.from, p.pair.to, p.width)), }; interface StepColorsParams { @@ -440,12 +449,14 @@ const stepColorsTool: ToolEntry = { description: "A discrete set of evenly spaced steps between two colors.", category: "generate", schema: stepColorsSchema, - generate: (p) => + input: "none", + run: genTool((p) => renderSwatches( stepColors(p.pair.from, p.pair.to, p.steps), p.width, p.layout, ), + ), }; interface EmojiToPngParams { @@ -466,7 +477,8 @@ const emojiToPng: ToolEntry = { category: "generate", domOnly: true, schema: emojiToPngSchema, - generate: (p) => renderEmoji(p.emoji, Math.round(p.size)), + input: "none", + run: genTool((p) => renderEmoji(p.emoji, Math.round(p.size))), }; interface ColorWheelParams { @@ -486,7 +498,8 @@ const colorWheelTool: ToolEntry = { "Generates an HSL color wheel: hue around the circle, saturation from center to edge, chosen lightness.", category: "generate", schema: colorWheelSchema, - generate: (p) => renderWheel(p.size, p.lightness), + input: "none", + run: genTool((p) => renderWheel(p.size, p.lightness)), }; interface PaletteBaseParams { @@ -530,8 +543,10 @@ const complementaryTool: ToolEntry = { { ...paletteBaseSchema }, { ...paletteLayoutGroup }, ), - generate: (p) => + input: "none", + run: genTool((p) => renderSwatches(complementarySet(p.baseColor), p.width, p.layout), + ), }; const triadicTool: ToolEntry = { @@ -546,7 +561,10 @@ const triadicTool: ToolEntry = { }, { ...paletteLayoutGroup }, ), - generate: (p) => renderSwatches(triadicSet(p.baseColor), p.width, p.layout), + input: "none", + run: genTool((p) => + renderSwatches(triadicSet(p.baseColor), p.width, p.layout), + ), }; const tetradicTool: ToolEntry = { @@ -562,7 +580,10 @@ const tetradicTool: ToolEntry = { }, { ...paletteLayoutGroup }, ), - generate: (p) => renderSwatches(tetradicSet(p.baseColor), p.width, p.layout), + input: "none", + run: genTool((p) => + renderSwatches(tetradicSet(p.baseColor), p.width, p.layout), + ), }; interface AnalogousParams extends PaletteBaseParams { @@ -585,12 +606,14 @@ const analogousTool: ToolEntry = { }, { ...paletteLayoutGroup }, ), - generate: (p) => + input: "none", + run: genTool((p) => renderSwatches( analogousSet(p.baseColor, p.spread, p.count), p.width, p.layout, ), + ), }; interface MonochromaticParams extends PaletteBaseParams { @@ -613,12 +636,14 @@ const monochromaticTool: ToolEntry = { }, { ...paletteLayoutGroup }, ), - generate: (p) => + input: "none", + run: genTool((p) => renderSwatches( monochromaticSet(p.baseColor, p.count, p.range), p.width, p.layout, ), + ), }; interface ShadesParams extends PaletteBaseParams { @@ -640,8 +665,10 @@ const shadesTool: ToolEntry = { }, { ...paletteLayoutGroup }, ), - generate: (p) => + input: "none", + run: genTool((p) => renderSwatches(shadeSet(p.baseColor, p.count, p.depth), p.width, p.layout), + ), }; interface MixColorsParams { @@ -671,7 +698,8 @@ const mixColorsTool: ToolEntry = { "Averages the selected colors into one swatch. Colors become one uniform fill.", category: "generate", schema: mixColorsSchema, - generate: (p) => renderSwatches([mixColors(p.colors)], p.width, "strip"), + input: "none", + run: genTool((p) => renderSwatches([mixColors(p.colors)], p.width, "strip")), }; interface SortColorsParams { @@ -731,8 +759,10 @@ const sortColorsTool: ToolEntry = { "Renders the chosen colors as swatches sorted by hue, brightness or saturation.", category: "generate", schema: sortColorsSchema, - generate: (p) => + input: "none", + run: genTool((p) => renderSwatches(sortPalette(p.colors, p.order), p.width, p.layout), + ), }; interface TextToPngParams { @@ -777,7 +807,8 @@ const textToPng: ToolEntry = { category: "generate", domOnly: true, schema: textToPngSchema, - generate: (p) => + input: "none", + run: genTool((p) => renderTextToImage({ text: p.text, fontSize: p.style.size, @@ -788,6 +819,7 @@ const textToPng: ToolEntry = { transparentBg: p.transparentBg, padding: p.padding, }), + ), }; export const generateEntries = [