React-Perf Migration

@solar-icons/react-perf was the pre-v2 performance package: one style per component, tree-shakable, no dynamic switching, no provider. In v2, this model becomes the default. Uninstall react-perf and install react.

Package

npm uninstall @solar-icons/react-perf
npm install @solar-icons/react

Component naming

Add Icon suffix. The style suffix depends on the import path.

Before (top-level, style suffix in name):

import { HomeBold, SettingsLinear } from '@solar-icons/react-perf'
;<HomeBold color="green" size={24} />

After:

import { HomeBoldIcon } from '@solar-icons/react'
;<HomeBoldIcon color="green" size={24} />

Before (per-style, no style suffix in name):

import { Home } from '@solar-icons/react-perf/Bold'
;<Home size={24} />

After:

import { HomeIcon } from '@solar-icons/react/bold'
;<HomeIcon size={24} />

Import paths

Style directories use kebab-case: Bold → bold, LineDuotone → line-duotone.

mirrored removed

// Before
<ArrowRight mirrored />

// After
<ArrowRightIcon style={{ transform: 'scaleX(-1)' }} />

size default changed

Default was 1em, now 24px. Explicit sizes work as before.

New features

SolarProvider, secondaryColor/secondaryOpacity for duotone, and strokeWidth are now available. See the React package page.