v0.4.1

What's Changed

• Removes Lucide from runtime dependencies by using generated local Lucide dev components.
• Preserves Lucide drop-in compatibility, including archived icons from recent Lucide versions.
• Ships archived Lucide SVG data as a single manifest instead of thousands of SVG files.
• Keeps production sprite rendering accessibility defaults overrideable with aria-hidden behavior covered by tests.

Published to npm as @react-zero-ui/icon-sprite@0.4.1.

v0.4.0

v0.4.0

Breaking Changes

• Removed icon exports for Lucide brand icons that are no longer available upstream, including Twitter, Twitch, YouTube, Facebook, GitHub, LinkedIn, Instagram, and related brand wrappers.
• Some icon wrapper filenames/exports were regenerated due to upstream Lucide/Tabler changes.

Updates

• Updated Lucide packages to 1.x.
• Updated Tabler packages to 3.43.x.
• Regenerated icon sprite mappings and wrappers.
• Added newly available Lucide and Tabler icons.

Migration Notes

If you used removed Lucide brand icons such as Twitter or Twitch, replace them with Tabler brand icons where available, such as IconBrandX or IconBrandTwitch.

0.3.0 - Tabler Icons Support

🚀 New Features

Tabler Icons Support - Full support for 5,200+ Tabler icons alongside Lucide. The library now includes 6,800+ icons total.
Stroke Width Support - Pass Stroke width as CSS variable to icons to modify the shadow dom in prod.

import { IconBrandGithub, IconHeart } from "@react-zero-ui/icon-sprite";

<IconBrandGithub size={24} />
<IconHeart size={24} className="text-red-500" />

📦 What's Included

Icon Library	Icons
Lucide	~1,600
Tabler	~5,200
Total	~6,800

📝 Changes

• Added @tabler/icons and @tabler/icons-react as dependencies
• Updated build pipeline to handle Tabler icon format
• Improved README with better structure and documentation

⬆️ Upgrade

npm update @react-zero-ui/icon-sprite

No breaking changes. Tabler icons are opt-in - just import them when needed.

---

Full Changelog: v0.2.0...v0.3.0

v0.2.0

What's Changed

• fix: prevent scanner from traversing node_modules and enable zero-ui.config.js file to be used, allowing users to set:

	/** Package import name (default: "@react-zero-ui/icon-sprite") */
	IMPORT_NAME?: string;
	/** Path to the sprite file relative to public dir (default: "/icons.svg") */
	SPRITE_PATH?: string;
	/** Root directory to scan for icon imports (default: auto-detected from "src", "app", or "pages") */
	ROOT_DIR?: string;
	/** Directory for custom SVG icons inside OUTPUT_DIR (default: "zero-ui-icons") */
	CUSTOM_SVG_DIR?: string;
	/** Output directory for built assets (default: "public") */
	OUTPUT_DIR?: string;
	/** Icon names to ignore during scanning (default: ["CustomIcon"]) */
	IGNORE_ICONS?: string[];
	/** Directories to exclude from scanning (default: ["node_modules", ".git", "dist", "build", ".next", "out"]) */
	EXCLUDE_DIRS?: string[];

New Contributors

• @sclark-bycore made their first contribution in #4

Full Changelog: v0.1.2...v0.2.0

Automatically generate an SVG sprite containing only the icons you used in development

🧠 What This Library Does

This package gives you:

1. Full Lucide-React DX in development
   Easy Imports, Instant updates, hot-reloading, JSX props, no caching issues. Use Just like Lucid but import the icon from @react-zero-ui/icon-sprite instead of lucide-react.

2. Zero-runtime SVG sprite usage in production
   Replaces every icon component with a <use href="/icons.svg#id" /> element at build time.

3. Tree-shaking via static analysis
   Icons are only included in the final sprite if your app actually uses them.

🙏 Custom icon support

Just drop SVGs into app/zero-ui-icons/, and use the <CustomIcon/> component. set the name prop to the name of the icon file want to use.

Tip

📁/public/zero-ui-icons/
  └── dog.svg 

import { CustomIcon } from "@react-zero-ui/icon-sprite";
//❗The name MUST match the name of the icon file - .svg extension is not needed.
<CustomIcon name="dog" size={24} />