@equinor/eds-icons
    TypeScript icon, indicating that this package has built-in type declarations

    0.7.0 • Public • Published

    @equinor/eds-icons

    This package is a collection of the system icons from the Equinor Design System as javascript objects.

    Installation

    npm install @equinor/eds-icons 

    If you use Typescript, make sure you have typescript >= 3.8 as a devDependency:

    npm install typescript --save-dev

    Usage

    Import svg data:

    import { save } from "@equinor/eds-icons"

    React

    We have developed a react component to simplify use of the EDS icons library within react.

    import { Icon } from '@equinor/eds-core-react'
    import { save } from '@equinor/eds-icons'
    
    // Use library approach 
    Icon.add({ save }) // (this needs only be done once)
    <Icon name="save" />
    
    // OR 
    
    // Use directly via data prop:
    <Icon data={save} />

    FAQ

    • If you are using NodeJS 13+ for module loading, it now has native ES modules support. Add "type":"module" to your apps package.json to enable this.

    • If you get a syntax error trying to import ES module, try importing the CJS module as not all loaders have support for ES modules yet

    Rendering icons

    You can render it using plain svg or use our provided React Icon component in @equinor/eds-core-react

    ⚠️ Due to how Figma parses and exports svg icons the following attributes must be added to your <path></path> element; fill-rule="evenodd" clip-rule="evenodd"

    Use EDS Assets in Figma(Equinor Figma account needed🔒) or storefront for icon names. Spaces in icon names are replaced with underscores.

    star-filled -> star_filled.

    Example of javascript object data

    {
      name: 'star_filled',
      prefix: 'eds',
      height: '24',
      width: '24',
      svgPathData: 'M12 16.067l4.947 3.6-1.894-5.814L20 10.334h-6.067l-1.933-6-1.933 6H4l4.947 3.52-1.894 5.814 4.947-3.6z',
    }

    Credits

    The EDS system icons are built on a copy of the Outlined Material Design icons provided open-source by Google. The icons have been customised and renamed for Equinor’s use.

    Install

    npm i @equinor/eds-icons

    DownloadsWeekly Downloads

    4,013

    Version

    0.7.0

    License

    Apache-2.0

    Unpacked Size

    865 kB

    Total Files

    10

    Last publish

    Collaborators

    • vnys
    • mimarz
    • wenche