AGENTS.md

Guidance for coding agents working on AlexandrAI Tools Image Grayscale in the alexandrai-tools project.

Project overview

This guide covers src/tools/image-grayscale. clampPercent constrains intensity to zero through one hundred, and Body.astro applies the selected grayscale or sepia filter as a canvas context filter percentage, draws the source image at native dimensions, resets the filter to none, and downloads grayscale.png.

Primary source files

• src/tools/image-grayscale/index.ts defines meta, GrayscaleMode, and clampPercent.
• src/tools/image-grayscale/index.test.ts covers in-range values, below-zero clamping, above-one-hundred clamping, and exact zero and one hundred edges.
• src/tools/image-grayscale/Body.astro owns mode selection, intensity input, canvas filter application, PNG download, and clear state.
• src/tools/image-grayscale/i18n.ts owns localized labels.
• src/lib/tools.ts registers the tool metadata.

Setup commands

npm install npm test npm run typecheck npm run build npm run dev

Change rules

• Support grayscale and sepia modes only unless tests and labels are expanded.
• Clamp intensity to zero through one hundred before applying the filter.
• Draw output at the source image's native dimensions.
• Reset ctx.filter to none after drawing.
• Keep output as PNG.
• Do not mutate the original preview canvas.
• Keep filter strings simple and generated only from typed mode values.

Testing

Test clampPercent boundaries, both modes, zero intensity, full intensity, invalid intensity input at the UI layer, native output dimensions, filter reset, PNG download, and clear-state reset.

PR checklist

• npm test passes for image-grayscale.
• Canvas processing stays browser-local and deterministic enough for tests.
• Pure helper behavior, UI controls, and i18n labels stay aligned.
• Download format, filename, and reset behavior are covered.