Wondering what’s next for npm?Check out our public roadmap! »

    @lendi-ui/icon
    TypeScript icon, indicating that this package has built-in type declarations

    9.9.16 • Public • Published

    @lendi-ui/icon

    Adding a new icon

    Add the SVG into src/icons. Be thoughtful with naming, as this will determine the name of the component. For example, the file computer-bank will create a SVG component called computerBank (note that the kebab-case filename will become a camelCase component).

    To add a new alias, navigate to the ./build/alias.json file and add the key as the original file name (in pascal case) and give it an array with all the alias' to add.

    When this package is built, an equivalent react component will be created in src/icons-compiled.

    Installation

    yarn add @lendi-ui/icon
    

    Usage

    import { Lock } from '@lendi-ui/icon';
    
    <Lock color="secondary.500" />;

    or, to take advantage of multiple entrypoints:

    import Lock from '@lendi-ui/icon/Lock';
    
    <Lock color="secondary.500" />;

    Note: You must use the above syntax across your entire codebase to see any bundle savings from entrypoints

    Fill colours not working?

    In this case, you will need to add a fillPath class to the element in the SVG that needs to be recoloured, this can be determined by inspecting the svg in the browser and changing the fill colour until you find the correct element.

    Properties

    <PropTable>
      <PropTable.Entry required name="color" type={`string`} description="The Icon color"/>
    </PropTable>
    

    Keywords

    none

    Install

    npm i @lendi-ui/icon

    DownloadsWeekly Downloads

    708

    Version

    9.9.16

    License

    ISC

    Unpacked Size

    4.12 MB

    Total Files

    6083

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar