<h2>Overview</h2>
<p>The document discusses the transition from the phosphor-react package to @phosphor-icons/react, highlighting improved performance and a smaller bundle size. It emphasizes the drop-in replacement ease due to unchanged APIs. The legacy package will continue to receive maintenance but won't be updated with new icons. The installation process, usage tips, props information, and context usage in styling icons are also covered.</p>
<h2>Features</h2>
<ul>
<li><strong>Improved Performance</strong>: @phosphor-icons/react offers enhanced performance.</li>
<li><strong>Smaller Bundle Size</strong>: The new version boasts a significantly smaller bundle size.</li>
<li><strong>Easy Replacement</strong>: No API changes make replacing the legacy package straightforward.</li>
<li><strong>Support for Tree-shaking</strong>: Phosphor supports tree-shaking to include only necessary icon code.</li>
<li><strong>Props Usage</strong>: Icon components accept a variety of props like color, size, weight, mirrored, and alt text.</li>
<li><strong>Context Utilization</strong>: Icon styling can be efficiently managed using React Context.</li>
<li><strong>Composability</strong>: Components allow for arbitrary SVG elements as children for enhanced customization.</li>
</ul>


<h2>Overview:</h2>
<p>The legacy Phosphor-Vue package is being replaced with @phosphor-icons/vue in a major update, which offers improved performance and a smaller bundle size. There are no API changes, making the transition to the new version straightforward. The legacy package will still receive maintenance but will not receive new icons updates. Phosphor icons are designed to be a versatile icon family suitable for various interfaces, diagrams, and presentations.</p>
<h2>Features:</h2>
<ul>
<li><strong>Improved Performance</strong>: The new @phosphor-icons/vue package offers enhanced performance compared to the previous Phosphor-Vue package.</li>
<li><strong>Smaller Bundle Size</strong>: Users can benefit from a significantly reduced bundle size with the @phosphor-icons/vue package.</li>
<li><strong>Easy Transition</strong>: With no changes to APIs, upgrading to the new package is a simple drop-in replacement process.</li>
<li><strong>Styling Flexibility</strong>: Icon components accept various attributes for customization, such as color, size, weight, and mirroring.</li>
<li><strong>Composition Support</strong>: Phosphor icons utilize Vue's provide/inject options for applying default styles to icons, allowing for easy customization.</li>
<li><strong>Slots for Customization</strong>: Components have a <code>&#x3C;slot></code> for adding arbitrary SVG elements within valid constraints.</li>
</ul>


Phosphor Icons

React

Vue