Morphos

@morphos/icons

Changelog for @morphos/icons.

2.0.0

  • Breaking: LucideSource (and the LucideIconName type) moved out of @morphos/icons into a new subpath, @morphos/icons/lucide. The main entry no longer imports lucide, so apps that use only their own icon set don't need it installed or bundled. Update imports: import { LucideSource } from '@morphos/icons/lucide'.
  • lucide is now an optional peer dependency — install it only if you use LucideSource.
  • Icon's name autocompletes lucide's names once @morphos/icons/lucide is imported (it augments the new IconNameRegistry interface). The main entry's types no longer depend on lucide, so type-checking works with skipLibCheck: false even when it isn't installed.
  • iconsPlugin() now trims the built-in "lucide" set in production builds. It scans your source for lucide icon names and bundles only those, instead of all ~2,100 icons (~500 kB). Automatic once iconsPlugin() is in your Vite config — no new setup. Dev is unchanged. Configure with iconsPlugin({ lucide: { include, scan } }), or opt out with iconsPlugin({ lucide: false }).

1.0.1

  • Test coverage for Icon's structured-shape rendering (circle, rect, line, polyline, ellipse, and unrecognized tags) and for IconProvider's error path when a decorated source's resolver was unregistered before use. No behavior change.

1.0.0

Breaking redesign around a single Icon component that resolves icons by name, plus a provider system for choosing which icon set name resolves against:

  • Breaking: LucideIcon and PhosphorIcon are removed. Icon no longer takes a svg/icon data prop — it now takes a typed name, resolved against the configured icon provider. lucide is a real peerDependency — its icon data is read live (import { icons } from "lucide"), no per-icon data wiring needed.
  • Breaking: IconProvider is now mandatory. There is no default provider — not even for "lucide". Every app must apply @IconProvider(...) somewhere, or Icon logs a warning and renders nothing.
  • IconProvider — a class decorator, same pattern as @Router, applied directly to the root component to configure the app-wide provider. Takes an IconSource class directly (not a string), or an array to register several at once, defaulting to the first. Runs at class-decoration time, before the class is ever instantiated, so there's no ordering caveat to work around. setIconProvider / getIconProvider do the same thing without decorating a class.
  • RegisterIconProvider + IconSource — registers a custom icon provider as a class, decorator-first, consistent with every other Morphos/PraxisJS component. Takes an optional second argument, defaultIcons (Record<name, svg>, or a glob path string via @morphos/icons/vite's iconsPlugin()) — resolve no longer needs implementing for the common case. Icon's provider prop and setIconProvider take the registered name, exactly like the built-in "lucide"; RegisterIconProvider also tags the class itself so IconProvider can read the name back.
  • "lucide" isn't special-cased anywhere: it's LucideSource, a built-in IconSource — a pre-configured wrapper, registered and activated the same way a custom provider is (@IconProvider(LucideSource), never automatic). resolve can return structured { nodes, viewBox? } data — the same [tag, attrs][] format lucide uses — instead of an { svg } string, for any provider whose source data is already shaped that way.
  • IconInstance — a PraxisJS Composable wrapping getIconProvider/setIconProvider, for changing the provider from inside a component via @Compose(IconInstance), same pattern as @praxisjs/composables' WindowSize.
  • provider (on Icon/setIconProvider) and Icon's name are typed as LiteralUnions — autocomplete still suggests the known values, but any string is accepted, so custom provider names and their icon names type-check too.

0.1.0

Initial release.

  • Icon — generic, framework-agnostic SVG icon primitive for raw markup.
  • LucideIcon — renders icon data from the lucide package's [tag, attrs][] node format.
  • PhosphorIcon — renders a raw SVG asset from @phosphor-icons/core, with mirrored support.

On this page