Skip to content

imagekit: maskable-safe icons + commit missing generate command - #18

Merged
charlesponti merged 3 commits into
mainfrom
fix/imagekit-maskable-icons
Sep 11, 2026
Merged

charlesponti merged 3 commits into
mainfrom
fix/imagekit-maskable-icons

Conversation

@charlesponti

Copy link
Copy Markdown
Member

Summary

  • imagekit web gains --bg <color> / --safe-zone <fraction> so square icon outputs (favicons, apple-touch-icon, android/PWA icons, MS tiles) can be flattened onto an opaque background with content padded into the maskable safe zone — fixes OS icon masks clipping content or showing transparency as stray white/black.
  • Commits src/commands/generate.ts, which index.ts already imported but had never been added to git (broken checkout for anyone cloning fresh).
  • Bumps @ponti-studios/imagekit to 1.1.0.

Test plan

  • bun run typecheck
  • bun test (57 pass, including new --bg/--safe-zone coverage)
  • Verified against a real RGBA logo (packages/what/public/logo.png in labs) — output has no alpha channel and content isn't clipped

🤖 Generated with Claude Code

charlesponti and others added 3 commits September 11, 2026 13:15
Source art that bleeds to the canvas edges gets clipped by OS icon
masks (rounded square, circle) when used for maskable PWA/Android
icons or the iOS apple-touch-icon, and shows transparency as stray
white/black. With --bg set, `imagekit web` now trims, resizes content
into the safe-zone fraction of the canvas, flattens onto the opaque
background, and strips the alpha channel for every square icon output.
Behavior without --bg is unchanged.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Adds `imagekit generate` (OpenRouter image models) plus its README
docs and the @openrouter/sdk dependency. This was already wired into
index.ts but the command file itself hadn't been committed.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Copilot AI lite review requested due to automatic review settings September 11, 2026 20:27
@charlesponti
charlesponti merged commit 317197b into main Sep 11, 2026
16 checks passed
@charlesponti
charlesponti deleted the fix/imagekit-maskable-icons branch September 11, 2026 20:32

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟡 Changes recommended

Unresolved issues include stale CLI version reporting, HTTPS image URL handling, and invalid safe-zone validation.

Get a fresh assessment by requesting another Copilot review.

Pull request overview

Adds maskable-safe opaque web icons and restores the OpenRouter-based generate command.

Changes:

  • Adds --bg and --safe-zone icon processing.
  • Adds generation support, documentation, tests, and dependencies.
  • Updates package metadata and lockfile.
File summaries
File Summary
apps/imagekit/src/test-support.ts Image inspection helpers
apps/imagekit/src/index.ts CLI options and command registration
apps/imagekit/src/commands/web.ts Background flattening and safe-zone padding
apps/imagekit/src/commands/web.test.ts Web icon tests
apps/imagekit/src/commands/generate.ts OpenRouter image generation
apps/imagekit/README.md Command documentation
apps/imagekit/package.json Version and dependency updates
apps/imagekit/bun.lock Locked dependency updates
Review details

Suppressed comments (1)

apps/imagekit/src/commands/generate.ts:77

  • This adds a networked command with request construction, reference/system-prompt handling, response parsing, MIME/filename switching, and several failure paths, but there is no test covering cmdGenerate while the other imagekit commands have integration coverage. Add deterministic tests with a mocked SDK/transport so these paths can be verified without spending against OpenRouter.
    result = await openrouter.chat.send({
      chatRequest: {
        model,
        messages: [
          ...(systemInstructions
            ? [{ role: "system" as const, content: systemInstructions }]
            : []),
          {
            role: "user" as const,
            content: [{ type: "text" as const, text: prompt }, ...references],
          },
        ],
        modalities: ["image", "text"],
      },
    });
  • Files reviewed: 7/8 changed files
  • Comments generated: 4
  • Review effort level: Lite

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

{
"name": "@ponti-studios/imagekit",
"version": "1.0.0",
"version": "1.1.0",
process.exit(1);
}

const match = image.imageUrl.url.match(/^data:image\/(\w+);base64,(.+)$/);
ensureDir(outdir);

const bg = opts.bg;
const safeZone = Math.min(1, Math.max(0.1, opts.safeZone ?? 0.8));
const source = path.join(FIXTURES, "transparent-rgba.png");
const output = path.join(tmp, "icons");

const result = runIconkit(["web", source, "-o", output, "--bg", "#0a0a0a", "--safe-zone", "0.7"]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants