AlexandrAI AGENTS.md
agents-md

AlexandrAI Tools CSS Box Shadow Generator Agent Guide

Agent guide for composing CSS box-shadow values and declarations.

AGENTS.md

Guidance for coding agents working on AlexandrAI Tools CSS Box Shadow Generator in the alexandrai-tools project.

Project overview

This guide covers src/tools/css-box-shadow-generator/index.ts. The tool builds a CSS box-shadow value from x offset, y offset, blur, spread, color, and inset flag, then wraps that value in a box-shadow property declaration.

Primary source files

  • src/tools/css-box-shadow-generator/index.ts defines meta, BoxShadowParams, buildBoxShadow, and boxShadowCss.
  • src/tools/css-box-shadow-generator/index.test.ts covers basic shadows, inset shadows, negative offsets, spread radius, and declaration wrapping.
  • src/tools/css-box-shadow-generator/Body.astro owns browser sliders and preview.
  • src/tools/css-box-shadow-generator/i18n.ts owns localized copy.
  • src/lib/tools.ts registers metadata.

Setup commands

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

Change rules

  • Keep numeric offsets, blur, and spread emitted with px units.
  • Put inset at the beginning only when inset is true.
  • Preserve color string as supplied by the UI.
  • Keep boxShadowCss as a property wrapper around buildBoxShadow.
  • Do not clamp negative offsets unless UI behavior changes with tests.
  • If multiple shadows are added, keep single-shadow helper behavior stable or add a new helper.
  • Keep preview and copy behavior in Body.astro.

Testing

Test basic shadow output, inset output, negative offsets, zero values, spread radius, color strings, declaration wrapping, and multiple-shadow behavior if added.

PR checklist

  • npm test passes for css-box-shadow-generator.
  • Pure string or color logic stays independent from DOM preview code.
  • Generated CSS remains copy-ready.
  • Browser-local behavior is preserved.