# Convert Icons

Convert raw SVG icons to React TSX components using SVGR.

## Usage

```
/convert-icons
```

## Instructions

1. Check that raw SVG files exist in `src/shared/assets/raw-icons/`. If the directory doesn't exist or is empty, inform the user and ask them to place SVG files there first.

2. Run the conversion:
   ```bash
   bun run gicons
   ```
   This executes:
   ```
   npx @svgr/cli --ext tsx --typescript --no-prettier --icon --ref --no-svgo ./src/shared/assets/raw-icons/ --out-dir ./src/shared/ui/Icons/
   ```

3. Report which icon components were generated in `src/shared/ui/Icons/`.

4. The generated components can be imported as:
   ```tsx
   import { IconName } from "@shared/ui/Icons/IconName"
   ```

## Notes

- Raw SVGs go in: `src/shared/assets/raw-icons/`
- Generated TSX components output to: `src/shared/ui/Icons/`
- SVGR flags: TypeScript, icon mode (scales with font-size), forwardRef support, no Prettier formatting, no SVGO optimization
- The primary icon library is `lucide-react` — custom SVG icons are for icons not available in Lucide