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

    @core-ds/icons

    1.3.2 • Public • Published

    core-icons

    npm version

    Installation

    npm install @core-ds/icons

    Usage

    React

    import { AlertCircle } from '@core-ds/icons/16' // Import 16px icons
    import { Clipboard } from '@core-ds/icons/24' // Import 24px icons
    
    function Example() {
      return (
        <div>
          <AlertCircle />
          <Clipboard />
        </div>
      )
    }

    PHTML

    <?= coreIcon('alert-circle', 16) ?>
    <?= coreIcon('clipboard', 24) ?>
    <?= coreIcon('alert-circle') ?> <!-- Defaults to 16 if no size is specified. -->

    Contributing

    Local development setup

    Follow these steps to get the project setup on your local machine:

    # Clone repo
    git clone https://github.com/iFixit/core-icons.git
    cd core-icons
    
    # Install dependencies
    npm install
    
    # Add your Figma access token (generate an access token using the instructions below)
    echo "FIGMA_TOKEN=<paste-your-token-here>" > .env
    # This token gives us access to the Figma API which
    # allows us to export icons directly from a Figma file.

    Generating a Figma access token

    1. Login to your Figma account.
    2. Head to the Account Settings from the top-left menu inside Figma.
    3. Find the Personal Access Tokens section.
    4. Click Create new token.
    5. A token will be generated. This will be your only chance to copy the token, so make sure you keep a copy of this in a secure place.

    See Figma's developer docs for more information.

    Adding or updating an icon

    1. Update the Figma file

    If a designer has already updated the Figma file, you can skip to step 2. If not, open the Core Icons Figma file and make your changes. Reach out on Slack if you're having trouble opening the Figma file.

    2. Create a new branch

    Create a new branch for your changes:

    git checkout -b <branch>

    3. Pull changes from Figma

    Pull in the latest changes from the Figma file by running:

    npm run figma-pull

    4. Review, commit and push changes

    Review the changes made by figma-pull. If everything looks good, commit and push the changes:

    git add .
    git commit -m <message>
    git push

    5. Open a pull request

    Use GitHub to create a pull request for your branch.

    6. Bump the package version

    After your pull request has been approved, bump the package version by running:

    npm version [patch | minor | major]

    npm version will bump the version and write the new data back to package.json and package-lock.json. It will also create and push a version commit and tag.

    Note: In the context of Core Icons, significant changes to the library or workflow, or removing an icon would be considered a major update, adding a new icon would be considered a minor update, and fixing an icon would be considered a patch. Non-code changes (e.g. documentation) do not require a version bump.

    7. Merge into master

    After your pull request has been approved and the package version has been bumped, go ahead and merge the pull request into master. You don't have to worry about publishing to npm because we have a GitHub action set up to automatically publish the package when a commit is pushed to master.

    8. Create a release

    After your pull request have been merged, create a new release to document your changes. Use the tag you generated in step 6 to create the release.

    Done 🎉

    Keywords

    none

    Install

    npm i @core-ds/icons

    DownloadsWeekly Downloads

    112

    Version

    1.3.2

    License

    none

    Unpacked Size

    101 kB

    Total Files

    210

    Last publish

    Collaborators

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