Research
Security News
Quasar RAT Disguised as an npm Package for Detecting Vulnerabilities in Ethereum Smart Contracts
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
@react-spectrum/icon
Advanced tools
@react-spectrum/icons
React Spectrum is a trusted distributor of A4U icons for easy use in your applications. We provide 959 Workflow Icons and 45 Colored Workflow Icons. These are an open source set of icons and are the core set that Adobe uses. To see a list of Icons, please go to the following link. We may differ from Spectrum's icon page in terms of icons we supply. All Icons are available from the top level of this package.
All icons use default exports, so you are free to rename them as you see fit. Instead, we rely on the path to each icon module. There is a special React Inspector display name case, which is icons with names that start with a number. This is not allowed in React, so they have been prefixed with an underscore.
Both of these are valid:
import Add from '@spectrum-icons/workflow/Add'
import IconAdd from '@spectrum-icons/workflow/Add'
These will both display <Add />
in the React Inspector
For a component starting with a numeral:
import _123 from '@spectrum-icons/workflow/123'
import Icon123 from '@spectrum-icons/workflow/123'
These will both display <_123 />
in the React Inspector
Because we can't include icons for specific projects or non-open source icons, we also support providing your own icons.
To do this, import {Icon} from '@react-spectrum/icon';
and use it to wrap your own svg components. To take advantage of scale, our wrapper will pass the prop scale
to your svg component from the React Spectrum Provider.
import CustomSVGComponent from '@a4u/product/custom-icons/CustomSVGComponent';
<Icon><CustomSVGComponent /></Icon>
There are additional requirements that the custom icons must adhere to. They must match the size and viewbox of Workflow Icons. If you are an Adobe team, we recommend that you go through A4U to request a project specific set of icons, these can be packaged as an npm dependency for you and will be treated in the same way as the core Workflow Icons we redistribute. Their official site is https://icons.corp.adobe.com and there are links for creating requests.
Note: only works with A4u packaged icons. No guarantees for ones you or your designer package yourselves. See our build tools to help get your icons integrated into your project working with React Spectrum's Provider.
import CustomSVGComponent from 'path/to/custom-icons/CustomSVGComponent';
<CustomSVGComponent />
FAQs
Spectrum UI components in React
We found that @react-spectrum/icon demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
Security News
Research
A supply chain attack on Rspack's npm packages injected cryptomining malware, potentially impacting thousands of developers.
Research
Security News
Socket researchers discovered a malware campaign on npm delivering the Skuld infostealer via typosquatted packages, exposing sensitive data.