@cdx-ui/icons 0.0.1-beta.50 → 0.0.1-beta.51

package/README.md

@@ -169,13 +169,30 @@ Generated files include:
 
 Each generated icon file includes a base64-encoded `@preview` JSDoc tag, so hovering over an icon import in your editor shows a visual preview.
 
+### Generating bottom-tab icons
+
+Native bottom tabs need image assets, not React components. A second generation script (`scripts/generate-tab-icons.ts`) rasterizes the curated subset declared in `tab-icons.config.json` into monochrome template PNGs (24/48/72 px → `@1x`/`@2x`/`@3x`) using `@resvg/resvg-js`, and emits platform-split descriptor modules consumed via the `@cdx-ui/icons/tab-icons` subpath export.
+
+```sh
+pnpm --filter @cdx-ui/icons generate:tab-icons
+```
+
+Generated files (gitignored, like `src/icons/`):
+
+- `src/tab-icons/assets/{name}[-fill][@2x|@3x].png` — template PNGs (black + alpha; the tab bar tints them at runtime)
+- `src/tab-icons/generated/{name}.ts` — web descriptor (SVG component only, no asset imports)
+- `src/tab-icons/generated/{name}.native.ts` — native descriptor with static `require()` asset imports
+- `src/tab-icons/generated/index.ts` — barrel exporting `{Name}Tab` descriptors
+
+To add an icon to the curated set, add its base name to `tab-icons.config.json` and rebuild — unknown names fail the build. Consumer-facing usage is documented in [docs/icons.md § Bottom Tab Icons](../../docs/icons.md#bottom-tab-icons).
+
 ### Building
 
 ```sh
 pnpm --filter @cdx-ui/icons build
 ```
 
-This runs `clean` -> `generate` -> `bob build`. Output goes to `lib/` with three targets:
+This runs `clean` -> `generate` -> `generate:tab-icons` -> `bob build`. Output goes to `lib/` with three targets:
 
 - `lib/commonjs/` — CJS modules
 - `lib/module/` — ESM modules
@@ -192,21 +209,26 @@ icons/
 │   └── custom/                # Hand-authored custom SVGs
 ├── scripts/
 │   ├── download-icons.ts      # Downloads outlined SVGs from Google Fonts CDN
-│   └── generate-icons.ts      # SVG → TypeScript generation script
+│   ├── generate-icons.ts      # SVG → TypeScript generation script
+│   ├── generate-tab-icons.ts  # SVG → template PNG + descriptor generation
+│   └── shared.ts              # Naming utilities shared by both generators
 ├── src/
 │   ├── icons/                 # Generated icon components
 │   ├── aliases/               # Generated alias re-exports
+│   ├── tab-icons/             # Bottom-tab descriptors (entry + generated assets)
 │   ├── createForgeIcon.ts       # Factory function
 │   ├── defaultAttributes.ts   # SVG defaults (viewBox, fill)
 │   ├── types.ts               # TypeScript types
 │   └── index.ts               # Main entry point
+├── types/png.d.ts             # Ambient *.png module declaration (kept out of src/)
 ├── icon-metadata.json         # Alias and deprecation metadata
+├── tab-icons.config.json      # Curated bottom-tab icon subset
 ├── package.json
 ├── tsconfig.json
 └── tsconfig.build.json
 ```
 
-`src/icons/` and `src/aliases/` contain generated files (gitignored except for `.gitkeep` sentinels).
+`src/icons/`, `src/aliases/`, `src/tab-icons/assets/`, and `src/tab-icons/generated/` contain generated files (gitignored except for `.gitkeep` sentinels).
 
 ## Architecture