add github repo check in workflow

* add template icon

* rename to layout-template icon

* update icon with consisent layout structure

.github/workflows/ci.yml

@@ -0,0 +1,72 @@
+name: Continuous integration icons
+
+on:
+  push:
+    branches:
+      - master
+    paths:
+      - icons/**
+
+jobs:
+  create-release:
+    if: github.repository == 'lucide-icons/lucide'
+
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Fetch tags
+        run: git fetch --tags
+
+      - name: Get latest tag
+        id: latest-tag
+        run: echo "::set-output name=LATEST_TAG::$(git tag --list 2>/dev/null | tail -n1 2>/dev/null)"
+
+      - name: Get yarn cache directory path
+        id: yarn_cache
+        run: echo "::set-output name=YARN_CACHE_DIR::$(yarn cache dir)"
+
+      - name: Get cached packaged
+        uses: actions/cache@v2
+        with:
+          path: ${{ steps.yarn_cache.outputs.YARN_CACHE_DIR }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+
+      - name: Install dependencies
+        run: yarn --pure-lockfile
+
+      - name: Create new version
+        id: new-version
+        run: echo "::set-output name=NEW_VERSION::$(.github/workflows/version-up.sh --patch)"
+
+      - name: Create change log
+        id: change-log
+        run: |
+          CHANGE_LOG=$(yarn --silent run generate:changelog --old-tag=${{ steps.latest-tag.outputs.LATEST_TAG }})
+          CHANGE_LOG="${CHANGE_LOG//'%'/'%25'}"
+          CHANGE_LOG="${CHANGE_LOG//$'\n'/'%0A'}"
+          CHANGE_LOG="${CHANGE_LOG//$'\r'/'%0D'}"
+          echo $CHANGE_LOG
+          echo "::set-output name=CHANGE_LOG::$CHANGE_LOG"
+        env:
+          GITHUB_API_KEY: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Check output
+        run: |
+          echo "${{ steps.new-version.outputs.NEW_VERSION }}"
+          echo "${{ steps.change-log.outputs.CHANGE_LOG }}"
+
+      - name: Create Release
+        id: create_release
+        uses: actions/create-release@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} # This token is provided by Actions, you do not need to create your own token
+        with:
+          tag_name: ${{ steps.new-version.outputs.NEW_VERSION }}
+          release_name: New icons ${{ steps.new-version.outputs.NEW_VERSION }}
+          body: ${{ steps.change-log.outputs.CHANGE_LOG }}
+

.github/workflows/font.yml

@@ -2,6 +2,7 @@ name: Build Lucide
 on:
   push:
     branches: [ master ]
+
   pull_request:
     branches: [ master ]
 
@@ -20,13 +21,9 @@ jobs:
     - name: Install FontForge
       run: sudo apt-get install zlib1g-dev fontforge
 
-    - name: Install NodeJS and Yarn
-      run: sudo apt-get install nodejs yarn
-
     - name: Clone sfnt2woff-zopfli repo
       run: git clone https://github.com/bramstein/sfnt2woff-zopfli.git sfnt2woff-zopfli
 
-
     - name: Install and move sfnt2woff-zopfli
       run: |
           cd sfnt2woff-zopfli
@@ -36,7 +33,6 @@ jobs:
     - name: Clone woff2
       run: git clone --recursive https://github.com/google/woff2.git
 
-
     - name: Install woff2
       run: |
           cd woff2
@@ -47,16 +43,14 @@ jobs:
       run: sudo gem install fontcustom
 
     - name: Install "outline-stroke"
-      run: sudo yarn add svg-outline-stroke svgson
+      run: sudo yarn add svg-outline-stroke -W
 
     - name: "Outline SVG"
       run: mkdir converted_icons && node scripts/outline_svg.js
 
-
     - name: Build 'Lucide'
       run: echo "Building Lucide font" && fontcustom compile ./converted_icons -h -n Lucide -o build -F
 
-
     - name: Zip 'Lucide'
       run: zip -r Lucide.zip build
 

.github/workflows/release.yml

@@ -1,4 +1,4 @@
-name: Release to NPM
+name: Release Packages
 
 on:
   push:
@@ -6,94 +6,146 @@ on:
     - 'v*'
 
 jobs:
-  build-and-deploy:
+  pre-build:
     if: github.repository == 'lucide-icons/lucide'
-
     runs-on: ubuntu-latest
-
-    env:
-      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+    outputs:
+      VERSION: ${{ steps.get_version.outputs.VERSION }}
+      YARN_CACHE_DIR: ${{ steps.yarn_cache.outputs.YARN_CACHE_DIR }}
 
     steps:
       - name: Get the version
         id: get_version
         run: echo ::set-output name=VERSION::${GITHUB_REF/refs\/tags\/\v}
 
+      - name: Get yarn cache directory path
+        id: yarn_cache
+        run: echo "::set-output name=YARN_CACHE_DIR::$(yarn cache dir)"
+
+  lucide:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    needs: pre-build
+    steps:
       - uses: actions/checkout@v2
+      - uses: actions/cache@v2
         with:
-          clean: true
+          path: ${{ needs.pre-build.outputs.YARN_CACHE_DIR }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+
+      - name: Install dependencies
+        run: yarn --pure-lockfile
 
       - name: Set Auth Token
         run: npm config set //registry.npmjs.org/:_authToken ${{ secrets.NPM_TOKEN }}
 
-      # Build lucide
-      - name: Install Dependencies Lucide
+      - name: Set new version
+        run: yarn workspace lucide version --new-version ${{ needs.pre-build.outputs.VERSION }} --no-git-tag-version
+
+      - name: Build
+        run: yarn workspace lucide build
+
+      - name: Test
+        run: yarn workspace lucide test
+
+      - name: Publish
+        run: yarn workspace lucide publish
+
+      - name: Upload package.json
+        uses: actions/upload-artifact@v2
+        with:
+          path: packages/lucide/package.json
+
+  lucide-react:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    needs: pre-build
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/cache@v2
+        with:
+          path: ${{ needs.pre-build.outputs.YARN_CACHE_DIR }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+
+      - name: Install dependencies
         run: yarn --pure-lockfile
 
-      - name: Build lucide package
-        run: yarn build
+      - name: Set Auth Token
+        run: npm config set //registry.npmjs.org/:_authToken ${{ secrets.NPM_TOKEN }}
 
-      - name: Test lucide package
-        run: yarn test
-
-      # Build lucide-react
-      - name: Install Dependencies lucide-react
-        run: yarn --pure-lockfile
-        working-directory: packages/lucide-react
-
-      - name: Build lucide-react
-        run: yarn build
-        working-directory: packages/lucide-react
-
-      - name: Test lucide-react
-        run: yarn test
-        working-directory: packages/lucide-react
-
-      # Build lucide-vue
-      - name: Install Dependencies lucide-vue
-        run: yarn --pure-lockfile
-        working-directory: packages/lucide-vue
-
-      - name: Build lucide-vue
-        run: yarn build
-        working-directory: packages/lucide-vue
-
-      - name: Test lucide-vue
-        run: yarn test
-        working-directory: packages/lucide-vue
-
-      # Publish lucide
       - name: Set package.json version lucide
-        run: yarn version --new-version ${{ steps.get_version.outputs.VERSION }} --no-git-tag-version
+        run: yarn workspace lucide-react version --new-version ${{ needs.pre-build.outputs.VERSION }} --no-git-tag-version
 
-      - name: publish lucide
-        run: yarn publish
+      - name: Build
+        run: yarn workspace lucide-react build
 
-      # Publish lucide-react
-      - name: Set package.json version lucide-react
-        run: yarn version --new-version ${{ steps.get_version.outputs.VERSION }} --no-git-tag-version
-        working-directory: packages/lucide-react
+      - name: Test
+        run: yarn workspace lucide-react test
 
-      - name: publish lucide-react
-        run: yarn publish
-        working-directory: packages/lucide-react
+      - name: Publish
+        run: yarn workspace lucide-react publish
 
-      # Publish lucide-vue
-      - name: Set package.json version lucide-vue
-        run: yarn version --new-version ${{ steps.get_version.outputs.VERSION }} --no-git-tag-version
-        working-directory: packages/lucide-vue
+      - name: Upload package.json
+        uses: actions/upload-artifact@v2
+        with:
+          path: packages/lucide-react/package.json
 
-      - name: publish lucide-vue
-        run: yarn publish
-        working-directory: packages/lucide-vue
+  lucide-vue:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    needs: pre-build
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+        with:
+          node-version: '12.x'
 
-      - name: Commit package.json
-        run: |
-          git add package.json
-          git add packages/lucide-react/package.json
-          git add packages/lucide-vue/package.json
-          git -c user.name="Lucide Bot" -c user.email="lucide-bot@users.noreply.github.com" \
-            commit -m ":package: Bump version to ${{ steps.get_version.outputs.VERSION }}" --no-verify --quiet
-          git remote set-url --push origin https://lucide-bot:$GITHUB_TOKEN@github.com/$GITHUB_REPOSITORY.git
-          git push origin HEAD:master
+      - uses: actions/cache@v2
+        with:
+          path: ${{ needs.pre-build.outputs.YARN_CACHE_DIR }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
 
+      - name: Install dependencies
+        run: yarn --pure-lockfile
+
+      - name: Set Auth Token
+        run: npm config set //registry.npmjs.org/:_authToken ${{ secrets.NPM_TOKEN }}
+
+      - name: Set new version
+        run: yarn workspace lucide-vue version --new-version ${{ needs.pre-build.outputs.VERSION }} --no-git-tag-version
+
+      - name: Build
+        run: yarn workspace lucide-vue build
+
+      - name: Test
+        run: yarn workspace lucide-vue test
+
+      - name: Publish
+        run: yarn workspace lucide-vue publish
+
+      - name: Upload package.json
+        uses: actions/upload-artifact@v2
+        with:
+          path: packages/lucide-vue/package.json
+
+  upload-package-jsons:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    needs: [lucide, lucide-react, lucide-vue]
+
+    steps:
+    - uses: actions/checkout@v2
+    - uses: actions/download-artifact@v2
+    - name: Commit package.jsons
+      run: |
+        git add packages/*/package.json
+        git -c user.name="Lucide Bot" -c user.email="lucide-bot@users.noreply.github.com" \
+          commit -m ":package: Bump lucide package versions to ${{ needs.pre-build.outputs.VERSION }}" --no-verify --quiet
+        git remote set-url --push origin https://lucide-bot:${{ secrets.GITHUB_TOKEN }}@github.com/$GITHUB_REPOSITORY.git
+        git push origin HEAD:master

.github/workflows/version-up.sh

@@ -0,0 +1,284 @@
+#!/usr/bin/env bash
+## Copyright (C) 2017, Oleksandr Kucherenko
+## Last revisit: 2017-09-29
+
+## get highest version tag for all branches
+function highest_tag(){
+  local TAG=$(git tag --list 2>/dev/null | tail -n1 2>/dev/null)
+  echo "$TAG"
+}
+
+## extract current branch name
+function current_branch(){
+  ## expected: heads/{branch_name}
+  ## expected: {branch_name}
+    local BRANCH=$(git rev-parse --abbrev-ref HEAD | cut -d"/" -f2)
+    echo "$BRANCH"
+}
+
+## get latest/head commit hash number
+function head_hash(){
+  local COMMIT_HASH=$(git rev-parse --verify HEAD)
+  echo "$COMMIT_HASH"
+}
+
+## extract tag commit hash code, tag name provided by argument
+function tag_hash(){
+  local TAG_HASH=$(git log -1 --format=format:"%H" $1 2>/dev/null | tail -n1)
+  echo "$TAG_HASH"
+}
+
+## get latest revision number
+function latest_revision(){
+  local REV=$(git rev-list --count HEAD 2>/dev/null)
+  echo "$REV"
+}
+
+## parse last found tag, extract it PARTS
+function parse_last(){
+  local position=$(($1-1))
+
+  # two parts found only
+  local SUBS=( ${PARTS[$position]//-/ } )
+  #echo ${SUBS[@]}, size: ${#SUBS}
+
+  # found NUMBER
+  PARTS[$position]=${SUBS[0]}
+  #echo ${PARTS[@]}
+
+  # found SUFFIX
+  if [[ ${#SUBS} -ge 1 ]]; then
+    PARTS[4]=${SUBS[1],,} #lowercase
+    #echo ${PARTS[@]}, ${SUBS[@]}
+  fi
+}
+
+## increment REVISION part, don't touch STAGE
+function increment_revision(){
+  PARTS[3]=$(( PARTS[3] + 1 ))
+  IS_DIRTY=1
+}
+
+## increment PATCH part, reset all other lower PARTS, don't touch STAGE
+function increment_patch(){
+  PARTS[2]=$(( PARTS[2] + 1 ))
+  PARTS[3]=0
+  IS_DIRTY=1
+}
+
+## increment MINOR part, reset all other lower PARTS, don't touch STAGE
+function increment_minor(){
+    PARTS[1]=$(( PARTS[1] + 1 ))
+    PARTS[2]=0
+    PARTS[3]=0
+    IS_DIRTY=1
+}
+
+## increment MAJOR part, reset all other lower PARTS, don't touch STAGE
+function incremet_major(){
+  PARTS[0]="v$(( PARTS[0] + 1 ))"
+  PARTS[1]=0
+  PARTS[2]=0
+  PARTS[3]=0
+  IS_DIRTY=1
+}
+
+## increment the number only of last found PART: REVISION --> PATCH --> MINOR. don't touch STAGE
+function increment_last_found(){
+  if [[ "${#PARTS[3]}" == 0 || "${PARTS[3]}" == "0" ]]; then
+    if [[ "${#PARTS[2]}" == 0 || "${PARTS[2]}" == "0" ]]; then
+      increment_minor
+    else
+      increment_patch
+    fi
+  else
+    increment_revision
+  fi
+
+  # stage part is not EMPTY
+  if [[ "${#PARTS[4]}" != 0 ]]; then
+    IS_SHIFT=1
+  fi
+}
+
+## compose version from PARTS
+function compose(){
+  MAJOR="${PARTS[0]}"
+  MINOR=".${PARTS[1]}"
+  PATCH=".${PARTS[2]}"
+  REVISION=".${PARTS[3]}"
+  SUFFIX="-${PARTS[4]}"
+
+  if [[ "${#PATCH}" == 1 ]]; then # if empty {PATCH}
+    PATCH=""
+  fi
+
+  if [[ "${#REVISION}" == 1 ]]; then # if empty {REVISION}
+    REVISION=""
+  fi
+
+  if [[ "${PARTS[3]}" == "0" ]]; then # if revision is ZERO
+    REVISION=""
+  fi
+
+  # shrink patch and revision
+  if [[ -z "${REVISION// }" ]]; then
+    if [[ "${PARTS[2]}" == "0" ]]; then
+      PATCH=".0"
+    fi
+  else # revision is not EMPTY
+    if [[ "${#PATCH}" == 0 ]]; then
+      PATCH=".0"
+    fi
+  fi
+
+  # remove suffix if we don't have a alpha/beta/rc
+  if [[ "${#SUFFIX}" == 1 ]]; then
+    SUFFIX=""
+  fi
+
+
+  echo "${MAJOR}${MINOR}${PATCH}${REVISION}${SUFFIX}" #full format
+}
+
+# initial version used for repository without tags
+INIT_VERSION=0.0.0.0-alpha
+
+# do GIT data extracting
+TAG=$(highest_tag)
+REVISION=$(latest_revision)
+BRANCH=$(current_branch)
+TAG_HASH=$(tag_hash $TAG)
+HEAD_HASH=$(head_hash)
+
+# if tag and branch commit hashes are different, than print info about that
+#echo $HEAD_HASH vs $TAG_HASH
+if [[ "$@" == "" ]]; then
+    if [[ "$TAG_HASH" == "$HEAD_HASH" ]]; then
+      echo "Tag $TAG and HEAD are aligned. We will stay on the TAG version."
+      echo ""
+      NO_ARGS_VALUE='--stay'
+    else
+      PATTERN="^[0-9]+.[0-9]+(.[0-9]+)*(-(alpha|beta|rc))*$"
+
+      if [[ "$BRANCH" =~ $PATTERN ]]; then
+        echo "Detected version branch '$BRANCH'. We will auto-increment the last version PART."
+        echo ""
+        NO_ARGS_VALUE='--default'
+      else
+        echo "Detected branch name '$BRANCH' than does not match version pattern. We will increase MINOR."
+        echo ""
+        NO_ARGS_VALUE='--minor'
+      fi
+    fi
+fi
+
+#
+# {MAJOR}.{MINOR}[.{PATCH}[.{REVISION}][-(.*)]
+#
+#  Suffix: alpha, beta, rc
+#    No Suffix --> {NEW_VERSION}-alpha
+#    alpha --> beta
+#    beta --> rc
+#    rc --> {VERSION}
+#
+PARTS=( ${TAG//./ } )
+parse_last ${#PARTS[@]} # array size as argument
+#echo ${PARTS[@]}
+
+# if no parameters than emulate --default parameter
+if [[ "$@" == "" ]]; then
+  set -- $NO_ARGS_VALUE
+fi
+
+# parse input parameters
+for i in "$@"
+do
+  key="$i"
+
+  case $key in
+    -a|--alpha)                 # switched to ALPHA
+    PARTS[4]="alpha"
+    IS_SHIFT=1
+    ;;
+    -b|--beta)                  # switched to BETA
+    PARTS[4]="beta"
+    IS_SHIFT=1
+    ;;
+    -c|--release-candidate)     # switched to RC
+    PARTS[4]="rc"
+    IS_SHIFT=1
+    ;;
+    -r|--release)               # switched to RELEASE
+    PARTS[4]=""
+    IS_SHIFT=1
+    ;;
+    -p|--patch)                 # increment of PATCH
+    increment_patch
+    ;;
+    -e|--revision)              # increment of REVISION
+    increment_revision
+    ;;
+    -g|--git-revision)          # use git revision number as a revision part§
+    PARTS[3]=$(( REVISION ))
+    IS_DIRTY=1
+    ;;
+    -i|--minor)                 # increment of MINOR by default
+    increment_minor
+    ;;
+    --default)                 # stay on the same stage, but increment only last found PART of version code
+    increment_last_found
+    ;;
+    -m|--major)                 # increment of MAJOR
+    incremet_major
+    ;;
+    -s|--stay)                  # extract version info
+    IS_DIRTY=1
+    NO_APPLY_MSG=1
+    ;;
+    -t|--tag-only)                  # extract version info
+    TAG_ONLY=1
+    ;;
+    --apply)
+    DO_APPLY=1
+    ;;
+    -h|--help)
+    help
+    ;;
+  esac
+  shift
+done
+
+# detected shift, but no increment
+if [[ "$IS_SHIFT" == "1" ]]; then
+    # temporary disable stage shift
+    stage=${PARTS[4]}
+    PARTS[4]=''
+
+    # detect first run on repository, INIT_VERSION was used
+    if [[ "$(compose)" == "0.0" ]]; then
+        increment_minor
+    fi
+
+    PARTS[4]=$stage
+fi
+
+# no increment applied yet and no shift of state, do minor increase
+if [[ "$IS_DIRTY$IS_SHIFT" == "" ]]; then
+    increment_minor
+fi
+
+compose
+
+# is proposed tag in conflict with any other TAG
+PROPOSED_HASH=$(tag_hash $(compose))
+if [[ "${#PROPOSED_HASH}" -gt 0 && "$NO_APPLY_MSG" == "" ]]; then
+  echo -e "\033[31mERROR:\033[0m "
+  echo -e "\033[31mERROR:\033[0m Found conflict with existing tag \033[32m$(compose)\033[0m / $PROPOSED_HASH"
+  echo -e "\033[31mERROR:\033[0m Only manual resolving is possible now."
+  echo -e "\033[31mERROR:\033[0m "
+  echo -e "\033[31mERROR:\033[0m To Resolve try to add --revision or --patch modifier."
+  echo -e "\033[31mERROR:\033[0m "
+  echo ""
+  exit 1
+fi

.gitignore

@@ -4,9 +4,9 @@
 node_modules
 dist
 build
-/lib
 sandbox
 stash
 coverage
 stats
 *.log
+packages/**/src/icons/*.js

CONTRIBUTING.md

@@ -12,12 +12,13 @@ Feel free to open a pull-request to contribute to this project.
 [How to Contribute to an Open Source Project on GitHub](https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github)
 
 Guidelines for pull requests:
+
 - __Make your commit messages as descriptive as possible.__ Include as much information as you can. Explain anything that the file diffs themselves won’t make apparent.
 - __Document your pull request__. Explain your fix, link to the relevant issue, add screenshots when adding new icons.
 - __Make sure the target of your pull request is the relevant branch__. Most of bugfix or new feature should go to the `master` branch.
 - __Include only related work__. If your pull request has unrelated commit, it won't be accepted.
 
-###  Pull Requests Including Icons
+### Pull Requests Including Icons
 
 #### Guidelines
 
@@ -27,7 +28,7 @@ Read it here: [ICON_GUIDELINES](docs/ICON_DESIGN_GUIDE.md)
 #### Submitting Mulitple Icons
 
 If you want submit multiple icons, please separate the icons and group them. That makes reviewing the icons easier and keep the thread clean and scoped.
-So don't submit multiple icons in one PR that have noting to do with each other. 
+So don't submit multiple icons in one PR that have noting to do with each other.
 So for example don't create one PR with icons: `arrow-up`, `bicycle`, `arrow-down`.
 Seperate them by two PRs; 'pr-01' `arrow`, `arrow-down` and 'pr-02' `bicycle`.
 
@@ -38,4 +39,5 @@ Before creating an icon request, please search to see if someone has requested t
 If the icon has not already been requested, [create an issue](https://github.com/lucide-icons/lucide/issues/new?title=Icon%20Request:) with a title of `Icon request: <icon name>` and add as much information as possible.
 
 ## Icon Requests from Feather
+
 If you are a designer who wants to contribute to Lucide but you don't know what icons to work on, then have a look at the Requests from Feather. All open, unfinished and valid requests can be found in [Feather Icon Requests](https://github.com/lucide-icons/lucide/issues/119).

README.md

@@ -9,6 +9,15 @@
 ## What is Lucide?
 
 Lucide is a community-run fork of [Feather Icons](https://github.com/feathericons/feather), open for anyone to contribute icons.
+Started after growing disaffection of the moderation of the [Feather Icons](https://github.com/feathericons/feather) project, with over 300+ open issues and over 100+ open PRs, this project is no longer maintained. The owner of the project stopped merging icons and want to keep the project like it now is. Hundreds of developers/designer wasted their time trying to contribute, what a shame.
+
+We're trying to expanding the icon set as much as possible while keeping it nice-looking, we do it as a community of devs and designers, join us!
+
+### Why choose Lucide over Feather Icons
+
+- Lucide already expended the icon set by 130+ in less then a year, so more icons to work with.
+- Well maintained code base.
+- Active community.
 
 ## Table of Contents
 
@@ -16,38 +25,14 @@ Lucide is a community-run fork of [Feather Icons](https://github.com/feathericon
   * [Package managers](#package-managers)
   * [CDN](#cdn)
 * [Usage](#usage)
-  * [Unpkg](#with-unpkg)
-  * [ESModules](#with-esmodules)
-    * [Options](#additional-options)
-    * [Treeshake library](#treeshake-the-library-only-use-the-icons-you-use)
-    * [Custom binding](#custom-element-binding)
-  * [React](#with-react)
-  * [Vue](#with-vue)
+  * [Web](#web)
+  * [React](#react)
+  * [Vue](#vue)
   * [Figma](#figma)
 * [Contributing](#contributing)
 * [Community](#community)
 * [License](#license)
 
-## Installation
-
-### Package Managers
-
-``` bash
-npm install lucide
-#or
-yarn add lucide
-```
-
-### CDN
-
-``` html
-<!-- Development version -->
-<script src="https://unpkg.com/lucide@latest/dist/umd/lucide.js"></script>
-
-<!-- Production version -->
-<script src="https://unpkg.com/lucide@latest"></script>
-```
-
 ## Usage
 
 At its core, Lucide is a collection of [SVG](https://svgontheweb.com/#svg) files. This means that you can use Feather icons in all the same ways you can use SVGs (e.g. `img`, `background-image`, `inline`, `object`, `embed`, `iframe`). Here's a helpful article detailing the many ways SVGs can be used on the web: [SVG on the Web – Implementation Options](https://svgontheweb.com/#implementation)
@@ -55,104 +40,23 @@ At its core, Lucide is a collection of [SVG](https://svgontheweb.com/#svg) files
 The following are additional ways you can use Lucide.
 With the Javascript library you can easily incorporate the icon you want in your webpage.
 
-### With unpkg
+### Web
 
-Here is a complete example with unpkg
+Implementation of the lucide icon library for web applications.
 
-```html
-<!DOCTYPE html>
-<body>
-  <i icon-name="volume-2" class="my-class"></i>
-  <i icon-name="x"></i>
-  <i icon-name="menu"></i>
+```sh
+npm install lucide
 
-  <script src="https://unpkg.com/lucide@latest"></script>
-  <script>
-    lucide.createIcons();
-  </script>
-</body>
+#or
+
+yarn add lucide
 ```
 
-### With ESModules
+For more details, see the [documentation](https://github.com/lucide-icons/lucide/blob/master/packages/lucide-react/README.md).
 
-To reduce bundle size, lucide is built to be fully treeshakable.
-The `createIcons` function will search for HTMLElements with the attribute `icon-name` and replace it with the svg from the given icon name.
+### React
 
-```html
-<!-- Your HTML file -->
-<i icon-name="menu"></i>
-```
-
-```js
-import { createIcons, icons } from 'lucide';
-
-// Caution, this will import all the icons and bundle them.
-createIcons({icons});
-
-// Recommended way, to include only the icons you need.
-import { createIcons, Menu, ArrowRight, Globe } from 'lucide';
-
-createIcons({
-  icons: {
-    Menu,
-    ArrowRight,
-    Globe,
-  },
-});
-```
-
-#### Additional Options
-
-In the `createIcons` function you can pass some extra parameters to adjust the `nameAttr` or add custom attributes like for example classes.
-
-Here is a full example:
-
-```js
-import { createIcons } from 'lucide';
-
-createIcons({
-  attrs: {
-    class: ['my-custom-class', 'icon'],
-    'stroke-width': 1,
-    stroke: '#333',
-  },
-  nameAttr: 'icon-name', // atrribute for the icon name.
-});
-```
-
-#### Treeshake the library, only use the icons you use
-
-```js
-import { createIcons, Menu, ArrowRight, Globe } from 'lucide';
-
-createIcons({
-  icons: {
-    Menu,
-    ArrowRight,
-    Globe,
-  },
-});
-```
-
-#### Custom Element binding
-
-```js
-import { createElement, Menu } from 'lucide';
-
-const menuIcon = createElement(Menu); // Returns HTMLElement (svg)
-
-// set custom attributes with browser native functions
-menuIcon.setAttribute('stroke', '#333');
-menuIcon.classList.add('my-icon-class');
-
-// Append HTMLElement in webpage
-const myApp = document.getElementById('app');
-myApp.appendChild(menuIcon);
-```
-
-### With React
-
-You can also use the Lucide library using the react package.
+Implementation of the lucide icon library for react applications.
 
 ```sh
 yarn add lucide-react
@@ -162,11 +66,11 @@ yarn add lucide-react
 npm install lucide-react
 ```
 
-For more details, see the [documentation](https://github.com/lucide-icons/lucide/blob/master/packages/lucide-react/README.md).
+For more details, see the [documentation](https://github.com/lucide-icons/lucide/tree/master/packages/lucide-react#lucide-react).
 
-### With Vue
+### Vue
 
-You can also use the Lucide library using the Vue package.
+Implementation of the lucide icon library for vue applications.
 
 ```sh
 yarn add lucide-vue
@@ -176,11 +80,15 @@ yarn add lucide-vue
 npm install lucide-vue
 ```
 
-For more details, see the [documentation](https://github.com/lucide-icons/lucide/blob/master/packages/lucide-vue/README.md).
+For more details, see the [documentation](https://github.com/lucide-icons/lucide/tree/master/packages/lucide-vue#lucide-vue).
 
 ### Figma
 
-You can use the components from [this Figma file](https://www.figma.com/file/g0UipfQlRfGrntKPxZknM7/Featherity).
+The lucide figma plugin.
+
+Visit [Figma community page](https://www.figma.com/community/plugin/939567362549682242/Lucide-Icons) to install the plugin.
+
+<img width="420" src="https://www.figma.com/community/plugin/939567362549682242/thumbnail" alt="Figma Lucide Cover">
 
 ## Contributing
 
@@ -194,10 +102,10 @@ Join the community on our [Discord](https://discord.gg/EH6nSts) server!
 
 ## License
 
-Lucide is licensed under the [ISC License](https://github.com/lucide-icons/lucide/blob/master/LICENSE).
+Lucide is totally free for commercial use and personally use, this software is licensed under the [ISC License](https://github.com/lucide-icons/lucide/blob/master/LICENSE).
 
-<p align="center">
-  <a href="https://vercel.com?utm_source=lucide&utm_campaign=oss">
-    <img src="./site/public/vercel.svg" alt="Powered by Vercel" width="200" />
-  </a>
-</p>
+## Sponsors
+
+<a href="https://vercel.com?utm_source=lucide&utm_campaign=oss">
+  <img src="./site/public/vercel.svg" alt="Powered by Vercel" width="200" />
+</a>

babel.config.js

@@ -1,13 +1,5 @@
 module.exports = {
-  presets: [
-    [
-      '@babel/env',
-      {
-        loose: true,
-        modules: false,
-      },
-    ],
-  ],
+  presets: ['@babel/env'],
   env: {
     test: {
       presets: ['@babel/env'],

icons/alarm-minus.svg

@@ -14,5 +14,5 @@
   <path d="M22 6l-3-3" />
   <path d="M6 19l-2 2" />
   <path d="M18 19l2 2" />
-  <path d="M8 13h8" />
+  <path d="M9 13h6" />
 </svg>

icons/alarm-plus.svg

@@ -14,6 +14,6 @@
   <path d="M22 6l-3-3" />
   <path d="M6 19l-2 2" />
   <path d="M18 19l2 2" />
-  <path d="M12 9v8" />
-  <path d="M8 13h8" />
+  <path d="M12 10v6" />
+  <path d="M9 13h6" />
 </svg>

icons/banknote.svg

@@ -0,0 +1,15 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  width="24"
+  height="24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <rect x="2" y="6" width="20" height="12" rx="2" />
+  <circle cx="12" cy="12" r="2" />
+  <path d="M6 12h.01M18 12h.01" />
+</svg>

icons/bitcoin.svg

@@ -0,0 +1,13 @@
+<svg
+  width="24"
+  height="24"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M11.767 19.089c4.924.868 6.14-6.025 1.216-6.894m-1.216 6.894L5.86 18.047m5.908 1.042l-.347 1.97m1.563-8.864c4.924.869 6.14-6.025 1.215-6.893m-1.215 6.893l-3.94-.694m5.155-6.2L8.29 4.26m5.908 1.042l.348-1.97M7.48 20.364l3.126-17.727" />
+</svg>

icons/clipboard-list.svg

@@ -0,0 +1,18 @@
+<svg
+  width="24"
+  height="24"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M16 4h2a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2h2" />
+  <path d="M15 2H9a1 1 0 00-1 1v2a1 1 0 001 1h6a1 1 0 001-1V3a1 1 0 00-1-1z" />
+  <path d="M12 11h4" />
+  <path d="M12 16h4" />
+  <path d="M8 11h.01" />
+  <path d="M8 16h.01" />
+</svg>

icons/cloud-drizzle.svg

@@ -9,11 +9,11 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <line x1="8" y1="19" x2="8" y2="21" />
-  <line x1="8" y1="13" x2="8" y2="15" />
-  <line x1="16" y1="19" x2="16" y2="21" />
-  <line x1="16" y1="13" x2="16" y2="15" />
-  <line x1="12" y1="21" x2="12" y2="23" />
-  <line x1="12" y1="15" x2="12" y2="17" />
-  <path d="M20 16.58A5 5 0 0018 7h-1.26A8 8 0 104 15.25" />
+  <path d="M20 16.2A4.5 4.5 0 0017.5 8h-1.8A7 7 0 104 14.9" />
+  <path d="M8 19v1" />
+  <path d="M8 14v1" />
+  <path d="M16 19v1" />
+  <path d="M16 14v1" />
+  <path d="M12 21v1" />
+  <path d="M12 16v1" />
 </svg>

icons/cloud-hail.svg

@@ -0,0 +1,19 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M20 16.2A4.5 4.5 0 0017.5 8h-1.8A7 7 0 104 14.9" />
+  <path d="M16 14v2" />
+  <path d="M8 14v2" />
+  <path d="M16 20h0" />
+  <path d="M8 20h0" />
+  <path d="M12 16v2" />
+  <path d="M12 22h0" />
+</svg>

icons/cloud-lightning.svg

@@ -9,6 +9,6 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M19 16.9A5 5 0 0018 7h-1.26a8 8 0 10-11.62 9" />
-  <polyline points="13 11 9 17 15 17 11 23" />
+  <path d="M17.5 17a4.5 4.5 0 100-9h-1.8a7 7 0 10-10.3 8" />
+  <path d="M12 12l-3 5h5l-3 5" />
 </svg>

icons/cloud-off.svg

@@ -9,6 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M22.61 16.95A5 5 0 0018 10h-1.26a8 8 0 00-7.05-6M5 5a8 8 0 004 15h9a5 5 0 001.7-.3" />
-  <line x1="1" y1="1" x2="23" y2="23" />
+  <path d="M2 2l20 20" />
+  <path d="M10 5a7 7 0 015.7 5h1.8a4.5 4.5 0 014 6.5" />
+  <path d="M18.8 18.8c-.4.2-.8.2-1.3.2H9A7 7 0 015.8 5.8" />
 </svg>

icons/cloud-rain-wind.svg

@@ -0,0 +1,16 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M20 16.2A4.5 4.5 0 0017.5 8h-1.8A7 7 0 104 14.9" />
+  <path d="M9.2 22l3-7" />
+  <path d="M9 13l-3 7" />
+  <path d="M17 13l-3 7" />
+</svg>

icons/cloud-rain.svg

@@ -9,8 +9,8 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <line x1="16" y1="13" x2="16" y2="21" />
-  <line x1="8" y1="13" x2="8" y2="21" />
-  <line x1="12" y1="15" x2="12" y2="23" />
-  <path d="M20 16.58A5 5 0 0018 7h-1.26A8 8 0 104 15.25" />
+  <path d="M20 16.2A4.5 4.5 0 0017.5 8h-1.8A7 7 0 104 14.9" />
+  <path d="M16 14v6" />
+  <path d="M8 14v6" />
+  <path d="M12 16v6" />
 </svg>

icons/cloud-snow.svg

@@ -9,11 +9,11 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M20 17.58A5 5 0 0018 8h-1.26A8 8 0 104 16.25" />
-  <line x1="8" y1="16" x2="8.01" y2="16" />
-  <line x1="8" y1="20" x2="8.01" y2="20" />
-  <line x1="12" y1="18" x2="12.01" y2="18" />
-  <line x1="12" y1="22" x2="12.01" y2="22" />
-  <line x1="16" y1="16" x2="16.01" y2="16" />
-  <line x1="16" y1="20" x2="16.01" y2="20" />
+  <path d="M20 16.2A4.5 4.5 0 0017.5 8h-1.8A7 7 0 104 14.9" />
+  <path d="M8 15h0" />
+  <path d="M8 19h0" />
+  <path d="M12 17h0" />
+  <path d="M12 21h0" />
+  <path d="M16 15h0" />
+  <path d="M16 19h0" />
 </svg>

icons/cloud.svg

@@ -9,5 +9,5 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M18 10h-1.26A8 8 0 109 20h9a5 5 0 000-10z" />
+  <path d="M17.5 19a4.5 4.5 0 100-9h-1.8A7 7 0 109 19h8.5z" />
 </svg>

icons/code-2.svg

@@ -0,0 +1,15 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M18 16L22 12L18 8" />
+  <path d="M6 8L2 12L6 16" />
+  <path d="M14.5 4L9.5 20" />
+</svg>

icons/download-cloud.svg

@@ -9,7 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <polyline points="8 17 12 21 16 17" />
-  <line x1="12" y1="12" x2="12" y2="21" />
-  <path d="M20.88 18.09A5 5 0 0018 9h-1.26A8 8 0 103 16.29" />
+  <path d="M20 16.2A4.5 4.5 0 0017.5 8h-1.8A7 7 0 104 14.9" />
+  <path d="M12 12v9" />
+  <path d="M8 17l4 4 4-4" />
 </svg>

icons/droplets.svg

@@ -0,0 +1,14 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M7 16.3c2.2 0 4-1.83 4-4.05 0-1.16-.57-2.26-1.71-3.19S7.29 6.75 7 5.3c-.29 1.45-1.14 2.84-2.29 3.76S3 11.1 3 12.25c0 2.22 1.8 4.05 4 4.05z" />
+  <path d="M12.56 6.6A10.97 10.97 0 0014 3.02c.5 2.5 2 4.9 4 6.5s3 3.5 3 5.5a6.98 6.98 0 01-11.91 4.97" />
+</svg>

icons/euro.svg

@@ -0,0 +1,15 @@
+<svg
+  width="24"
+  height="24"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M4 10h12" />
+  <path d="M4 14h9" />
+  <path d="M19 6a7.7 7.7 0 00-5.2-2A7.9 7.9 0 006 12c0 4.4 3.5 8 7.8 8 2 0 3.8-.8 5.2-2" />
+</svg>

icons/file-input.svg

@@ -0,0 +1,16 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M4 22h14a2 2 0 002-2V7.5L14.5 2H6a2 2 0 00-2 2v4" />
+  <path d="M14 2v6h6" />
+  <path d="M2 15h10" />
+  <path d="M9 18l3-3-3-3" />
+</svg>

icons/file-output.svg

@@ -0,0 +1,16 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M4 22h14a2 2 0 002-2V7.5L14.5 2H6a2 2 0 00-2 2v4" />
+  <path d="M14 2v6h6" />
+  <path d="M2 15h10" />
+  <path d="M5 12l-3 3 3 3" />
+</svg>

icons/haze.svg

@@ -0,0 +1,20 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M5.2 6.2l1.4 1.4" />
+  <path d="M2 13h2" />
+  <path d="M20 13h2" />
+  <path d="M17.4 7.6l1.4-1.4" />
+  <path d="M22 17H2" />
+  <path d="M22 21H2" />
+  <path d="M16 13a4 4 0 00-8 0" />
+  <path d="M12 5V2.5" />
+</svg>

icons/indian-rupee.svg

@@ -0,0 +1,17 @@
+<svg
+  width="24"
+  height="24"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M6 3h12" />
+  <path d="M6 8h12" />
+  <path d="M6 13l8.5 8" />
+  <path d="M6 13h3" />
+  <path d="M9 13c6.667 0 6.667-10 0-10" />
+</svg>

icons/jersey-pound.svg

@@ -0,0 +1,15 @@
+<svg
+  width="24"
+  height="24"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12 9.5V21m0-11.5L6 3m6 6.5L18 3" />
+  <path d="M6 15h12" />
+  <path d="M6 11h12" />
+</svg>

icons/layout-template.svg

@@ -0,0 +1,15 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M21 3H3v7h18V3z" />
+  <path d="M21 14h-5v7h5v-7z" />
+  <path d="M12 14H3v7h9v-7z" />
+</svg>

icons/lightbulb-off.svg

@@ -0,0 +1,16 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M9 18h6" />
+  <path d="M10 22h4" />
+  <path d="M2 2l20 20" />
+  <path d="M8.91 14a4.61 4.61 0 00-1.41-2.5C6.23 10.23 6 9 6 8a6 6 0 01.084-1M9 2.804A6 6 0 0118 8a4.651 4.651 0 01-1.031 3" />
+</svg>

icons/loader-2.svg

@@ -0,0 +1,13 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M21 12a9 9 0 11-6.219-8.56" />
+</svg>

icons/mouse-pointer-click.svg

@@ -0,0 +1,15 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M9 9l5 12 1.774-5.226L21 14 9 9z" />
+  <path d="M16.071 16.071l4.243 4.243" />
+  <path d="M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122" />
+</svg>

icons/pound-sterling.svg

@@ -0,0 +1,16 @@
+<svg
+  width="24"
+  height="24"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M18 7c0-5.333-8-5.333-8 0" />
+  <path d="M10 7v14" />
+  <path d="M6 21h12" />
+  <path d="M6 13h10" />
+</svg>

icons/power-off.svg

@@ -0,0 +1,15 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M18.36 6.64A9 9 0 0120.77 15M5.63 6.64A9 9 0 1018.706 19" />
+  <path d="M12 2v4" />
+  <path d="M2 2l20 20" />
+</svg>

icons/redo.svg

@@ -9,6 +9,6 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <polyline points="22 10 22 16 16 16" />
-  <path d="M1.994 16c1.813-6.542 9.559-9.482 15.36-4.36l4.64 4.36" />
+  <path d="M21 7v6h-6" />
+  <path d="M3 17a9 9 0 019-9 9 9 0 016 2.3l3 2.7" />
 </svg>

icons/russian-ruble.svg

@@ -0,0 +1,17 @@
+<svg
+  width="24"
+  height="24"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M14 11c5.333 0 5.333-8 0-8" />
+  <path d="M6 11h8" />
+  <path d="M6 15h8" />
+  <path d="M9 21V3" />
+  <path d="M9 3h5" />
+</svg>

icons/star-half.svg

@@ -0,0 +1,13 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12 17.8L5.8 21 7 14.1 2 9.3l7-1L12 2" />
+</svg>

icons/sun.svg

@@ -9,13 +9,13 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <circle cx="12" cy="12" r="5" />
-  <line x1="12" y1="1" x2="12" y2="3" />
-  <line x1="12" y1="21" x2="12" y2="23" />
-  <line x1="4.22" y1="4.22" x2="5.64" y2="5.64" />
-  <line x1="18.36" y1="18.36" x2="19.78" y2="19.78" />
-  <line x1="1" y1="12" x2="3" y2="12" />
-  <line x1="21" y1="12" x2="23" y2="12" />
-  <line x1="4.22" y1="19.78" x2="5.64" y2="18.36" />
-  <line x1="18.36" y1="5.64" x2="19.78" y2="4.22" />
+  <circle cx="12" cy="12" r="4" />
+  <path d="M12 2v2" />
+  <path d="M12 20v2" />
+  <path d="M5 5l1.5 1.5" />
+  <path d="M17.5 17.5L19 19" />
+  <path d="M2 12h2" />
+  <path d="M20 12h2" />
+  <path d="M5 19l1.5-1.5" />
+  <path d="M17.5 6.5L19 5" />
 </svg>

icons/sunrise.svg

@@ -9,12 +9,12 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M17 18a5 5 0 00-10 0" />
-  <line x1="12" y1="2" x2="12" y2="9" />
-  <line x1="4.22" y1="10.22" x2="5.64" y2="11.64" />
-  <line x1="1" y1="18" x2="3" y2="18" />
-  <line x1="21" y1="18" x2="23" y2="18" />
-  <line x1="18.36" y1="11.64" x2="19.78" y2="10.22" />
-  <line x1="23" y1="22" x2="1" y2="22" />
-  <polyline points="8 6 12 2 16 6" />
+  <path d="M12 2v8" />
+  <path d="M5.2 11.2l1.4 1.4" />
+  <path d="M2 18h2" />
+  <path d="M20 18h2" />
+  <path d="M17.4 12.6l1.4-1.4" />
+  <path d="M22 22H2" />
+  <path d="M8 6l4-4 4 4" />
+  <path d="M16 18a4 4 0 00-8 0" />
 </svg>

icons/sunset.svg

@@ -9,12 +9,12 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M17 18a5 5 0 00-10 0" />
-  <line x1="12" y1="9" x2="12" y2="2" />
-  <line x1="4.22" y1="10.22" x2="5.64" y2="11.64" />
-  <line x1="1" y1="18" x2="3" y2="18" />
-  <line x1="21" y1="18" x2="23" y2="18" />
-  <line x1="18.36" y1="11.64" x2="19.78" y2="10.22" />
-  <line x1="23" y1="22" x2="1" y2="22" />
-  <polyline points="16 5 12 9 8 5" />
+  <path d="M12 10V2" />
+  <path d="M5.2 11.2l1.4 1.4" />
+  <path d="M2 18h2" />
+  <path d="M20 18h2" />
+  <path d="M17.4 12.6l1.4-1.4" />
+  <path d="M22 22H2" />
+  <path d="M16 6l-4 4-4-4" />
+  <path d="M16 18a4 4 0 00-8 0" />
 </svg>

icons/swiss-franc.svg

@@ -0,0 +1,15 @@
+<svg
+  width="24"
+  height="24"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M10 21V3h8" />
+  <path d="M6 16h9" />
+  <path d="M10 9.5h7" />
+</svg>

icons/terminal-square.svg

@@ -0,0 +1,15 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M7 11l2-2-2-2" />
+  <path d="M11 13h4" />
+  <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
+</svg>

icons/thermometer-snowflake.svg

@@ -0,0 +1,18 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M2 12h10" />
+  <path d="M9 4v16" />
+  <path d="M3 9l3 3-3 3" />
+  <path d="M12 6L9 9 6 6" />
+  <path d="M6 18l3-3 1.5 1.5" />
+  <path d="M18 2a2 2 0 00-2 2v10.5a4 4 0 104 0V4a2 2 0 00-2-2z" />
+</svg>

icons/thermometer-sun.svg

@@ -0,0 +1,18 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12 9a4 4 0 00-2 7.5" />
+  <path d="M12 3v2" />
+  <path d="M6.6 18.4l-1.4 1.4" />
+  <path d="M18 2a2 2 0 012 2v10.5a4 4 0 11-4 0V4c0-1.1.9-2 2-2z" />
+  <path d="M4 13H2" />
+  <path d="M6.6 7.6L5.2 6.2" />
+</svg>

icons/thermometer.svg

@@ -9,5 +9,5 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M14 14.76V3.5a2.5 2.5 0 00-5 0v11.26a4.5 4.5 0 105 0z" />
+  <path d="M12 2a2 2 0 00-2 2v10.5a4 4 0 104 0V4a2 2 0 00-2-2z" />
 </svg>

icons/undo.svg

@@ -9,6 +9,6 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <polyline points="2 10 2 16 8 16" />
-  <path d="M22 16c-1.814-6.542-9.56-9.482-15.36-4.36L2 16" />
+  <path d="M3 7v6h6" />
+  <path d="M21 17a9 9 0 00-9-9 9 9 0 00-6 2.3L3 13" />
 </svg>

icons/upload-cloud.svg

@@ -9,8 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <polyline points="16 16 12 12 8 16" />
-  <line x1="12" y1="12" x2="12" y2="21" />
-  <path d="M20.39 18.39A5 5 0 0018 9h-1.26A8 8 0 103 16.3" />
-  <polyline points="16 16 12 12 8 16" />
+  <path d="M20 16.2A4.5 4.5 0 0017.5 8h-1.8A7 7 0 104 14.9" />
+  <path d="M12 12v9" />
+  <path d="M16 16l-4-4-4 4" />
 </svg>

icons/wind.svg

@@ -9,5 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M9.59 4.59A2 2 0 1111 8H2m10.59 11.41A2 2 0 1014 16H2m15.73-8.27A2.5 2.5 0 1119.5 12H2" />
+  <path d="M17.7 7.7a2.5 2.5 0 111.8 4.3H2" />
+  <path d="M9.6 4.6A2 2 0 1111 8H2" />
+  <path d="M12.6 19.4A2 2 0 1014 16H2" />
 </svg>

netlify.toml

@@ -1,5 +0,0 @@
-[build]
-  base = "site/"
-  publish = "build/"
-  command = "yarn deploy"
-  ignore = "git diff --quiet origin/master HEAD ../icons ../site"

package.json

@@ -1,66 +1,52 @@
 {
-  "name": "lucide",
-  "description": "Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
-  "version": "0.14.0",
-  "license": "ISC",
-  "homepage": "https://lucide.dev",
-  "bugs": "https://github.com/lucide-icons/lucide/issues",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/lucide-icons/lucide.git"
-  },
-  "amdName": "lucide",
-  "source": "build/lucide.js",
-  "main": "dist/cjs/lucide.js",
-  "main:umd": "dist/umd/lucide.js",
-  "module": "dist/esm/lucide.js",
-  "unpkg": "dist/umd/lucide.min.js",
-  "sideEffects": false,
+  "private": true,
+  "workspaces": [
+    "packages/*",
+    "site"
+  ],
   "scripts": {
-    "start": "babel-watch --watch src",
-    "clean": "rimraf dist && rimraf build",
-    "build": "yarn clean && yarn build:move && yarn build:icons && yarn build:es && yarn build:bundles",
-    "build:move": "cp -av src build",
-    "build:icons": "npx babel-node ./scripts/buildIcons.js --presets @babel/env",
-    "build:es": "babel build -d dist/esm",
-    "build:bundles": "rollup -c rollup.config.js",
-    "optimize": "npx babel-node ./scripts/optimizeSvgs.js --presets @babel/env",
-    "addtags": "npx babel-node ./scripts/addMissingKeysToTags.js --presets @babel/env",
-    "test": "jest"
+    "build": "yarn lucide build && yarn lucide-react build && yarn lucide-vue build",
+    "test": "yarn lucide build:icons && yarn lucide-react build:icons && yarn lucide-vue build:icons && jest",
+    "lucide": "yarn workspace lucide",
+    "lucide-react": "yarn workspace lucide-react",
+    "lucide-vue": "yarn workspace lucide-vue",
+    "build:icons": "babel-node ./scripts/buildIcons.js --presets @babel/env",
+    "optimize": "babel-node ./scripts/optimizeSvgs.js --presets @babel/env",
+    "addtags": "babel-node ./scripts/addMissingKeysToTags.js --presets @babel/env",
+    "generate:changelog": "babel-node ./scripts/generateChangelog.js --presets @babel/env"
   },
   "devDependencies": {
     "@ampproject/rollup-plugin-closure-compiler": "^0.25.2",
     "@atomico/rollup-plugin-sizes": "^1.1.4",
     "@babel/cli": "^7.10.5",
     "@babel/core": "^7.11.1",
-    "@babel/node": "^7.10.5",
+    "@babel/node": "^7.13.10",
     "@babel/plugin-transform-runtime": "^7.11.5",
     "@babel/preset-env": "^7.11.0",
     "@rollup/plugin-babel": "^5.0.0",
-    "babel-jest": "^26.3.0",
+    "@rollup/plugin-commonjs": "^17.1.0",
+    "@rollup/plugin-node-resolve": "^11.2.0",
+    "@rollup/plugin-replace": "^2.4.1",
+    "babel-jest": "^26.6.3",
     "babel-plugin-add-import-extension": "^1.4.3",
-    "cheerio": "^1.0.0-rc.2",
     "core-js": "3",
     "eslint": "^4.19.1",
     "eslint-config-airbnb-base": "^12.1.0",
     "eslint-config-prettier": "^2.9.0",
     "eslint-plugin-import": "^2.5.0",
     "eslint-plugin-prettier": "^2.5.0",
-    "html-minifier": "^3.5.8",
-    "htmlparser2": "^4.1.0",
     "husky": "^4.3.6",
     "jest": "^26.4.2",
     "lint-staged": "^10.5.3",
     "minimist": "^1.2.5",
+    "node-fetch": "^2.6.1",
     "prettier": "1.17.1",
     "rollup": "^2.7.3",
-    "rollup-plugin-commonjs": "^10.1.0",
     "rollup-plugin-license": "^2.0.0",
-    "rollup-plugin-node-resolve": "^5.2.0",
-    "rollup-plugin-replace": "^2.2.0",
     "rollup-plugin-terser": "^5.2.0",
     "rollup-plugin-visualizer": "^4.1.0",
-    "svgo": "^1.3.2"
+    "svgo": "^1.3.2",
+    "svgson": "^4.1.0"
   },
   "husky": {
     "hooks": {

packages/lucide-figma/package.json

@@ -1,7 +1,8 @@
 {
   "name": "lucide-figma",
-  "version": "0.13.0",
+  "version": "0.15.0",
   "license": "ISC",
+  "private": true,
   "main": "build/ui.js",
   "scripts": {
     "build": "webpack --mode=production",
@@ -14,7 +15,7 @@
     "css-loader": "^3.0.0",
     "html-webpack-inline-source-plugin": "^0.0.10",
     "html-webpack-plugin": "^3.2.0",
-    "lucide-react": "^0.13.0",
+    "lucide-react": "^0.15.0",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
     "style-loader": "^0.23.1",

packages/lucide-react/LICENSE

@@ -0,0 +1,15 @@
+ISC License
+
+Copyright (c) 2020, Lucide Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

packages/lucide-react/README.md

@@ -1,6 +1,8 @@
 # Lucide React
 
-Use the lucide icon library in you react app.
+Implementation of the lucide icon library for react applications.
+
+> What is lucide? Read it [here](https://github.com/lucide-icons/lucide#what-is-lucide).
 
 ## Installation
 

packages/lucide-react/babel.config.js

@@ -1,3 +1,6 @@
+const mainConfig = require('../../babel.config');
+
 module.exports = {
   presets: ['react-app'],
+  env: mainConfig.env,
 };

packages/lucide-react/jest.config.js

@@ -3,9 +3,6 @@ module.exports = {
   roots: ['<rootDir>/src/', '<rootDir>/tests/'],
   moduleFileExtensions: ['js'],
   transformIgnorePatterns: [`/node_modules`],
-  moduleNameMapper: {
-    '^@/(.*)$': '<rootDir>/src/$1',
-  },
   transform: {
     '^.+\\.js$': 'babel-jest',
   },

packages/lucide-react/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-react",
   "description": "Lucide React package, Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
-  "version": "0.14.1",
+  "version": "0.15.0",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",
@@ -16,12 +16,13 @@
   "main:umd": "dist/umd/lucide-react.js",
   "module": "dist/esm/lucide-react.js",
   "unpkg": "dist/umd/lucide-react.min.js",
+  "typings": "dist/lucide-react.d.ts",
   "scripts": {
-    "build": "yarn clean && yarn build:move && yarn build:icons && yarn build:es && yarn build:bundles",
-    "clean": "rm -rf dist && rm -rf build",
-    "build:move": "cp -av src build",
-    "build:icons": "yarn --cwd ../../ build:icons --output=../packages/lucide-react/build --templateSrc=../packages/lucide-react/scripts/exportTemplate --camelizeAttrs --noDefaultAttrs --renderUniqueKey",
-    "build:es": "yarn --cwd ../../ babel packages/lucide-react/build -d packages/lucide-react/dist/esm",
+    "build": "yarn clean && yarn build:icons && yarn build:es && yarn build:types && yarn build:bundles",
+    "clean": "rm -rf dist && rm -rf stats && rm -rf ./src/icons/*.js",
+    "build:icons": "yarn --cwd ../../ build:icons --output=../packages/lucide-react/src --templateSrc=../packages/lucide-react/scripts/exportTemplate --renderUniqueKey",
+    "build:es": "yarn --cwd ../../ babel packages/lucide-react/src -d packages/lucide-react/dist/esm",
+    "build:types": "yarn --cwd ../../ babel-node packages/lucide-react/scripts/buildTypes.js",
     "build:bundles": "yarn --cwd ../../ rollup -c packages/lucide-react/rollup.config.js",
     "test": "jest"
   },

packages/lucide-react/rollup.config.js

@@ -1,11 +1,11 @@
-const plugins = require('../../rollup.plugins');
-const pkg = require('./package.json');
+import plugins from '../../rollup.plugins';
+import pkg from './package.json';
 
 const packageName = 'LucideReact';
 const outputFileName = 'lucide-react';
 const rootDir = 'packages/lucide-react'; // It runs from the root
 const outputDir = `${rootDir}/dist`;
-const inputs = [`${rootDir}/build/lucide-react.js`];
+const inputs = [`${rootDir}/src/lucide-react.js`];
 const bundles = [
   {
     format: 'umd',
@@ -30,7 +30,7 @@ const configs = bundles
     inputs.map(input => ({
       input,
       plugins: plugins(pkg, minify),
-      external: ['react', 'prop-types'],
+      external: ['react', 'prop-types', 'lucide'],
       output: {
         name: packageName,
         file: `${outputDir}/${format}/${outputFileName}${minify ? '.min' : ''}.js`,
@@ -39,6 +39,7 @@ const configs = bundles
         globals: {
           react: 'react',
           'prop-types': 'PropTypes',
+          lucide: 'lucide',
         },
       },
     })),

packages/lucide-react/scripts/buildTypes.js

@@ -0,0 +1,44 @@
+import path from 'path';
+import {
+  writeFile,
+  readSvgDirectory,
+  resetFile,
+  toPascalCase,
+  appendFile,
+} from '../../../scripts/helpers';
+
+const srcDirectory = path.join(__dirname, '../dist');
+
+// Declare type definitions
+const typeDefinitions = `\
+/// <reference types="react" />
+import { SVGAttributes } from 'react'
+
+// Create interface extending SVGAttributes
+export interface LucideProps extends Partial<React.SVGProps<SVGSVGElement>> {
+    color?: string
+    size?: string | number
+    stroke?: string | number
+    strokeWidth?: string | number
+}
+
+// Generated icons
+`;
+
+const ICONS_DIR = path.resolve(__dirname, '../../../icons');
+const TYPES_FILE = 'lucide-react.d.ts';
+
+resetFile(TYPES_FILE, srcDirectory);
+writeFile(typeDefinitions, TYPES_FILE, srcDirectory);
+
+const svgFiles = readSvgDirectory(ICONS_DIR);
+
+svgFiles.forEach(svgFile => {
+  const iconName = path.basename(svgFile, '.svg');
+  const componentName = toPascalCase(iconName);
+
+  const exportTypeString = `export declare const ${componentName}: (props: LucideProps) => JSX.Element;\n`;
+  appendFile(exportTypeString, TYPES_FILE, srcDirectory);
+});
+
+console.log(`Generated ${TYPES_FILE} file with`, svgFiles.length, 'icons');

packages/lucide-react/scripts/exportTemplate.js

@@ -1,8 +1,7 @@
-export default ({ componentName, node }) => `
+export default ({ componentName, children }) => `
 import createReactComponent from '../createReactComponent';
-import defaultAttributes from '../defaultAttributes';
 
-const ${componentName} = createReactComponent('${componentName}', ['svg', defaultAttributes, ${node}]);
+const ${componentName} = createReactComponent('${componentName}', ${JSON.stringify(children)});
 
 export default ${componentName};
 `;

packages/lucide-react/src/createReactComponent.js

@@ -1,21 +1,22 @@
 import { forwardRef, createElement } from 'react';
 import PropTypes from 'prop-types';
+import defaultAttributes from './defaultAttributes';
 
-export default (iconName, [tag, attrs, children]) => {
+export default (iconName, iconNode) => {
   const Component = forwardRef(
     ({ color = 'currentColor', size = 24, strokeWidth = 2, ...rest }, ref) =>
       createElement(
-        tag,
+        'svg',
         {
           ref,
-          ...attrs,
+          ...defaultAttributes,
           width: size,
           height: size,
           stroke: color,
           strokeWidth,
           ...rest,
         },
-        children.map(([childTag, childAttrs]) => createElement(childTag, childAttrs)),
+        iconNode.map(([tag, attrs]) => createElement(tag, attrs)),
       ),
   );
 

packages/lucide-react/src/icons/.gitkeep

@@ -0,0 +1 @@
+Folder for generated icons

packages/lucide-react/src/icons/index.js

@@ -1,5 +0,0 @@
-/*
- Icons exports.
-
- Will be generated
-*/

packages/lucide-react/tests/lucide-react.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Grid } from '..'
+import { Grid } from '../src/icons'
 
 describe('Using lucide icon components', () => {
   it('should render an component', () => {

packages/lucide-react/yarn.lock

@@ -4593,9 +4593,9 @@ xmlchars@^2.2.0:
   integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==
 
 y18n@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.0.tgz#95ef94f85ecc81d007c264e190a120f0a3c8566b"
-  integrity sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w==
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.1.tgz#8db2b83c31c5d75099bb890b23f3094891e247d4"
+  integrity sha512-wNcy4NvjMYL8gogWWYAO7ZFWFfHcbdbE57tZO8e4cbpj8tfUcwrwqSl3ad8HxpYWCdXcJUCeKKZS62Av1affwQ==
 
 yallist@^4.0.0:
   version "4.0.0"

packages/lucide-vue/LICENSE

@@ -0,0 +1,15 @@
+ISC License
+
+Copyright (c) 2020, Lucide Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

packages/lucide-vue/README.md

@@ -1,6 +1,8 @@
 # Lucide Vue
 
-Use the lucide icon library in you Vue app.
+Implementation of the lucide icon library for Vue applications.
+
+> What is lucide? Read it [here](https://github.com/lucide-icons/lucide#what-is-lucide).
 
 ## Installation
 

packages/lucide-vue/jest.config.js

@@ -7,7 +7,7 @@ module.exports = {
     '^.+\\.vue$': 'vue-jest',
   },
   transformIgnorePatterns: [`/node_modules`],
-  snapshotSerializers: ['<rootDir>/node_modules/jest-serializer-vue'],
+  snapshotSerializers: ['jest-serializer-vue'],
   moduleNameMapper: {
     '^@/(.*)$': '<rootDir>/src/$1',
   },

packages/lucide-vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lucide-vue",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "author": "Eric Fennis",
   "description": "Lucide Vue Package",
   "license": "ISC",
@@ -21,19 +21,16 @@
     "vue": "^2.6.12"
   },
   "scripts": {
-    "build": "yarn clean && yarn build:move && yarn build:icons && yarn build:es && yarn build:bundles",
-    "clean": "rm -rf dist && rm -rf build",
-    "build:move": "cp -av src build",
-    "build:icons": "yarn --cwd ../../ build:icons --output=../packages/lucide-vue/build --templateSrc=../packages/lucide-vue/scripts/exportTemplate --noDefaultAttrs",
-    "build:es": "yarn --cwd ../../ babel packages/lucide-vue/build -d packages/lucide-vue/dist/esm",
+    "build": "yarn clean && yarn build:icons && yarn build:es && yarn build:bundles",
+    "clean": "rm -rf dist && rm -rf stats && rm -rf ./src/icons/*.js",
+    "build:icons": "yarn --cwd ../../ build:icons --output=../packages/lucide-vue/src --templateSrc=../packages/lucide-vue/scripts/exportTemplate",
+    "build:es": "yarn --cwd ../../ babel packages/lucide-vue/src -d packages/lucide-vue/dist/esm",
     "build:bundles": "yarn --cwd ../../ rollup -c packages/lucide-vue/rollup.config.js",
     "test": "jest",
     "test:watch": "jest --watchAll"
   },
   "devDependencies": {
     "@vue/test-utils": "^1.1.2",
-    "babel-jest": "^26.6.3",
-    "jest": "^26.6.3",
     "jest-serializer-vue": "^2.0.2",
     "vue-jest": "^3.0.7",
     "vue-template-compiler": "^2.6.12"

packages/lucide-vue/rollup.config.js

@@ -1,11 +1,11 @@
-const plugins = require('../../rollup.plugins');
-const pkg = require('./package.json');
+import plugins from '../../rollup.plugins';
+import pkg from './package.json';
 
 const packageName = 'LucideVue';
 const outputFileName = 'lucide-vue';
 const rootDir = 'packages/lucide-vue'; // It runs from the root
 const outputDir = `${rootDir}/dist`;
-const inputs = [`${rootDir}/build/lucide-vue.js`];
+const inputs = [`${rootDir}/src/lucide-vue.js`];
 const bundles = [
   {
     format: 'umd',

packages/lucide-vue/scripts/exportTemplate.js

@@ -1,8 +1,7 @@
-export default ({ componentName, node }) => `
+export default ({ componentName, children }) => `
 import createVueComponent from '../createVueComponent';
-import defaultAttributes from '../defaultAttributes';
 
-const ${componentName} = createVueComponent('${componentName}Icon', ['svg', defaultAttributes, ${node}]);
+const ${componentName} = createVueComponent('${componentName}Icon', ${JSON.stringify(children)});
 
 export default ${componentName};
 `;

packages/lucide-vue/src/createVueComponent.js

@@ -1,4 +1,6 @@
-export default (iconName, [tag, defaultAttrs, children]) => ({
+import defaultAttributes from './defaultAttributes';
+
+export default (iconName, iconNode) => ({
   name: iconName,
   functional: true,
   props: {
@@ -27,13 +29,13 @@ export default (iconName, [tag, defaultAttrs, children]) => ({
     },
   ) {
     return createElement(
-      tag,
+      'svg',
       {
         // eslint-disable-next-line prettier/prettier
         class: [defaultClass, data.class, data.staticClass, data.attrs && data.attrs.class].filter(Boolean),
         style: [data.style, data.staticStyle, data.attrs && data.attrs.style].filter(Boolean),
         attrs: {
-          ...defaultAttrs,
+          ...defaultAttributes,
           width: size,
           height: size,
           stroke: color,
@@ -41,7 +43,7 @@ export default (iconName, [tag, defaultAttrs, children]) => ({
           ...data.attrs,
         },
       },
-      children.map(([childTag, childAttrs]) => createElement(childTag, { attrs: childAttrs })),
+      iconNode.map(([tag, attrs]) => createElement(tag, { attrs })),
     );
   },
 });

packages/lucide-vue/src/icons/.gitkeep

@@ -0,0 +1 @@
+Folder for generated icons

packages/lucide-vue/src/icons/index.js

@@ -1,5 +0,0 @@
-/*
- Icons exports.
-
- Will be generated
-*/

packages/lucide-vue/tests/lucide-vue.spec.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils'
-import { Smile } from '..'
+import { Smile } from '../src/icons'
 
 describe('Using lucide icon components', () => {
   it('should render an component', () => {

packages/lucide/.gitignore

@@ -0,0 +1 @@
+src/icons/*.js

packages/lucide/.npmignore

@@ -0,0 +1,10 @@
+stats
+node_modules
+tests
+scripts
+build
+src
+babel.config.js
+jest.config.js
+rollup.config.js
+yarn.error.log

packages/lucide/LICENSE

@@ -0,0 +1,15 @@
+ISC License
+
+Copyright (c) 2020, Lucide Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

packages/lucide/README.md

@@ -0,0 +1,120 @@
+# Lucide
+
+Implementation of the lucide icon library for web applications.
+
+## Installation
+
+### Package Managers
+
+``` bash
+npm install lucide
+#or
+yarn add lucide
+```
+
+### CDN
+
+``` html
+<!-- Development version -->
+<script src="https://unpkg.com/lucide@latest/dist/umd/lucide.js"></script>
+
+<!-- Production version -->
+<script src="https://unpkg.com/lucide@latest"></script>
+```
+
+## Usage
+
+### With unpkg
+
+Here is a complete example with unpkg
+
+```html
+<!DOCTYPE html>
+<body>
+  <i icon-name="volume-2" class="my-class"></i>
+  <i icon-name="x"></i>
+  <i icon-name="menu"></i>
+
+  <script src="https://unpkg.com/lucide@latest"></script>
+  <script>
+    lucide.createIcons();
+  </script>
+</body>
+```
+
+### With ESModules
+
+To reduce bundle size, lucide is built to be fully treeshakable.
+The `createIcons` function will search for HTMLElements with the attribute `icon-name` and replace it with the svg from the given icon name.
+
+```html
+<!-- Your HTML file -->
+<i icon-name="menu"></i>
+```
+
+```js
+import { createIcons, icons } from 'lucide';
+
+// Caution, this will import all the icons and bundle them.
+createIcons({icons});
+
+// Recommended way, to include only the icons you need.
+import { createIcons, Menu, ArrowRight, Globe } from 'lucide';
+
+createIcons({
+  icons: {
+    Menu,
+    ArrowRight,
+    Globe,
+  },
+});
+```
+
+#### Additional Options
+
+In the `createIcons` function you can pass some extra parameters to adjust the `nameAttr` or add custom attributes like for example classes.
+
+Here is a full example:
+
+```js
+import { createIcons } from 'lucide';
+
+createIcons({
+  attrs: {
+    class: ['my-custom-class', 'icon'],
+    'stroke-width': 1,
+    stroke: '#333',
+  },
+  nameAttr: 'icon-name', // attribute for the icon name.
+});
+```
+
+#### Treeshake the library, only use the icons you use
+
+```js
+import { createIcons, Menu, ArrowRight, Globe } from 'lucide';
+
+createIcons({
+  icons: {
+    Menu,
+    ArrowRight,
+    Globe,
+  },
+});
+```
+
+#### Custom Element binding
+
+```js
+import { createElement, Menu } from 'lucide';
+
+const menuIcon = createElement(Menu); // Returns HTMLElement (svg)
+
+// set custom attributes with browser native functions
+menuIcon.setAttribute('stroke', '#333');
+menuIcon.classList.add('my-icon-class');
+
+// Append HTMLElement in webpage
+const myApp = document.getElementById('app');
+myApp.appendChild(menuIcon);
+```

packages/lucide/babel.config.js

@@ -0,0 +1,14 @@
+const mainConfig = require('../../babel.config');
+
+module.exports = {
+  presets: [
+    [
+      '@babel/env',
+      {
+        loose: true,
+        modules: false,
+      },
+    ],
+  ],
+  env: mainConfig.env,
+};

packages/lucide/jest.config.js

@@ -5,9 +5,6 @@ module.exports = {
   roots: ['<rootDir>/src/', '<rootDir>/tests/'],
   moduleFileExtensions: ['js'],
   transformIgnorePatterns: [`/node_modules/(?!${esModules})`],
-  moduleNameMapper: {
-    '^@/(.*)$': '<rootDir>/src/$1',
-  },
   transform: {
     '^.+\\.js$': 'babel-jest',
   },

packages/lucide/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "lucide",
+  "description": "Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
+  "version": "0.15.0",
+  "license": "ISC",
+  "homepage": "https://lucide.dev",
+  "bugs": "https://github.com/lucide-icons/lucide/issues",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lucide-icons/lucide.git",
+    "directory": "packages/lucide"
+  },
+  "amdName": "lucide",
+  "source": "build/lucide.js",
+  "main": "dist/cjs/lucide.js",
+  "main:umd": "dist/umd/lucide.js",
+  "module": "dist/esm/lucide.js",
+  "unpkg": "dist/umd/lucide.min.js",
+  "typings": "dist/lucide.d.ts",
+  "sideEffects": false,
+  "scripts": {
+    "build": "yarn clean && yarn build:icons && yarn build:es && yarn build:types && yarn build:bundles",
+    "clean": "rm -rf dist && rm -rf stats && rm -rf ./src/icons/*.js",
+    "build:icons": "yarn --cwd ../../ build:icons --output=../packages/lucide/src",
+    "build:es": "babel src -d dist/esm",
+    "build:types": "yarn --cwd ../../ babel-node packages/lucide/scripts/buildTypes.js",
+    "build:bundles": "rollup -c rollup.config.js",
+    "test": "jest"
+  }
+}

packages/lucide/rollup.config.js

@@ -1,9 +1,9 @@
-const plugins = require('./rollup.plugins');
-const pkg = require('./package.json');
+import plugins from '../../rollup.plugins';
+import pkg from './package.json';
 
 const outputFileName = pkg.name;
 const outputDir = 'dist';
-const inputs = ['build/lucide.js'];
+const inputs = ['src/lucide.js'];
 const bundles = [
   {
     format: 'umd',
@@ -38,4 +38,4 @@ const configs = bundles
   )
   .flat();
 
-module.exports = configs;
+export default configs;

packages/lucide/scripts/buildTypes.js

@@ -0,0 +1,66 @@
+import path from 'path';
+
+import { readSvgDirectory, resetFile, appendFile, toPascalCase } from '../../../scripts/helpers';
+import defaultAttributes from '../src/defaultAttributes';
+
+const TARGET_DIR = path.join(__dirname, '../dist');
+const ICONS_DIR = path.resolve(__dirname, '../../../icons');
+const TYPES_FILE_NAME = 'lucide.d.ts';
+
+// Generates header of d.ts file include some types and functions
+const typeDefinitions = `\
+declare module 'lucide'
+export interface SVGProps extends Partial<SVGElement> ${JSON.stringify(defaultAttributes, null, 2)}
+
+export declare type IconNode = readonly [tag: string, attrs:SVGProps, children?:IconNode];
+export declare type CustomAttrs = { [attr:string]: any }
+export type Icons = { [key: string]: IconNode }
+
+export interface CreateIconsOptions {
+  /**
+   * List of icons you want to replace
+   *
+   * For example: \`{ Menu, Circle}\`.
+   *
+   * For replace all icons in lucide library, import \`icons\` and use it.
+   */
+  icons: Icons;
+
+  /**
+   * Search HTML emelemt by \`nameAttr\` property.
+   *
+   * For example if define \`<i lucide-icon="circle"></i>\`, fill by \`lucide-icon\`.
+   *
+   * @default 'icon-name'
+   */
+  nameAttr?: string;
+
+  /**
+   * Change defult attribute for show like color, fill, width , ...
+   *
+   * @default undefined
+   */
+  attrs?: CustomAttrs;
+}
+
+export function createElement(icon: IconNode): SVGSVGElement;
+export function createIcons(options: CreateIconsOptions): void;
+
+export declare const icons: Icons;
+
+// Generated icons
+`;
+
+resetFile(TYPES_FILE_NAME, TARGET_DIR);
+appendFile(typeDefinitions, TYPES_FILE_NAME, TARGET_DIR);
+
+const svgFiles = readSvgDirectory(ICONS_DIR);
+
+svgFiles.forEach(svgFile => {
+  const nameSvg = path.basename(svgFile, '.svg');
+  const namePascal = toPascalCase(nameSvg);
+
+  appendFile(`export declare const ${namePascal}: IconNode;\n`, TYPES_FILE_NAME, TARGET_DIR);
+});
+
+console.log(`Generated ${TYPES_FILE_NAME} file with`, svgFiles.length, 'icons');

packages/lucide/src/defaultAttributes.js

@@ -5,7 +5,7 @@ export default {
   viewBox: '0 0 24 24',
   fill: 'none',
   stroke: 'currentColor',
-  strokeWidth: 2,
-  strokeLinecap: 'round',
-  strokeLinejoin: 'round',
+  'stroke-width': 2,
+  'stroke-linecap': 'round',
+  'stroke-linejoin': 'round',
 };

packages/lucide/src/icons/.gitkeep

@@ -0,0 +1 @@
+Folder for generated icons

packages/lucide/src/lucide.js

@@ -1,5 +1,5 @@
 import replaceElement from './replaceElement';
-import * as allIcons from './icons/index';
+import * as allIcons from './icons';
 
 /**
  * Replaces all elements with matching nameAttr with the defined icons
@@ -34,4 +34,4 @@ export { default as createElement } from './createElement';
  Icons exports.
 */
 export { allIcons as icons };
-export * from './icons/index';
+export * from './icons';

packages/lucide/src/replaceElement.js

@@ -17,6 +17,7 @@ export const getAttrs = element =>
  * @returns {Array}
  */
 export const getClassNames = attrs => {
+  if (typeof attrs === 'string') return attrs;
   if (!attrs || !attrs.class) return '';
   if (attrs.class && typeof attrs.class === 'string') {
     return attrs.class.split(' ');
@@ -38,6 +39,7 @@ export const combineClassNames = arrayOfClassnames => {
   return classNameArray
     .map(classItem => classItem.trim())
     .filter(Boolean)
+    .filter((value, index, self) => self.indexOf(value) === index)
     .join(' ');
 };
 
@@ -63,23 +65,21 @@ export default (element, { nameAttr, icons, attrs }) => {
   }
 
   const elementAttrs = getAttrs(element);
+  const [tag, iconAttributes, children] = iconNode;
 
-  const [, iconAttrs] = iconNode;
-
-  const allAttrs = {
-    ...iconAttrs,
+  const iconAttrs = {
+    ...iconAttributes,
+    'icon-name': iconName,
     ...attrs,
   };
 
-  iconNode[1] = { ...allAttrs };
-
-  const classNames = combineClassNames([iconAttrs, elementAttrs, attrs]);
+  const classNames = combineClassNames(['lucide', elementAttrs, attrs]);
 
   if (classNames) {
-    iconNode[1].class = classNames;
+    iconAttrs.class = classNames;
   }
 
-  const svgElement = createElement(iconNode);
+  const svgElement = createElement([tag, iconAttrs, children]);
 
   return element.parentNode.replaceChild(svgElement, element);
 };

packages/lucide/tests/__snapshots__/lucide.spec.js.snap

@@ -0,0 +1,5 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`createIcons should add custom attributes 1`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"black\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" icon-name=\\"volume-2\\" class=\\"lucide icon custom-class\\"><polygon points=\\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\\"></polygon><path d=\\"M19.07 4.93a10 10 0 010 14.14M15.54 8.46a5 5 0 010 7.07\\"></path></svg>"`;
+
+exports[`createIcons should read elements from DOM and replace it with icons 1`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" icon-name=\\"volume-2\\" class=\\"lucide\\"><polygon points=\\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\\"></polygon><path d=\\"M19.07 4.93a10 10 0 010 14.14M15.54 8.46a5 5 0 010 7.07\\"></path></svg>"`;

packages/lucide/tests/__snapshots__/replaceElement.spec.js.snap

@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`combineClassNames should retuns a string of classNames 1`] = `"item1 item2 item3 item4 item5 item6 item7 item8 item9"`;
+exports[`combineClassNames should retuns a string of classNames 1`] = `"item item1 item2 item3 item4 item5 item6 item7 item8 item9"`;

packages/lucide/tests/lucide.spec.js

@@ -1,15 +1,19 @@
-import * as icons from './icons';
+import * as icons from '../src/icons';
 import { createIcons } from '../src/lucide';
 import fs from 'fs';
 import path from 'path';
-import { minify } from 'html-minifier';
+import { parseSync, stringify } from 'svgson';
 
-const ICONS_DIR = path.resolve(__dirname, '../icons');
+const ICONS_DIR = path.resolve(__dirname, '../../../icons');
 
 const getOriginalSvg = (iconName) => {
   const svgContent = fs.readFileSync(path.join(ICONS_DIR, `${iconName}.svg`), 'utf8');
+  const svgParsed = parseSync(svgContent);
 
-  return minify(svgContent, { collapseWhitespace: true, keepClosingSlash: true, });
+  svgParsed.attributes['icon-name'] = iconName;
+  svgParsed.attributes['class'] = 'lucide';
+
+  return stringify(svgParsed, { selfClose: false });
 };
 
 describe('createIcons', () => {
@@ -19,6 +23,8 @@ describe('createIcons', () => {
     createIcons({icons});
 
     const svg = getOriginalSvg('volume-2');
+
+    expect(document.body.innerHTML).toBe(svg)
     expect(document.body.innerHTML).toMatchSnapshot()
   });
 
@@ -36,10 +42,10 @@ describe('createIcons', () => {
   });
 
   it('should add custom attributes', () => {
-    document.body.innerHTML = `<i icon-name="volume-2"></i>`;
+    document.body.innerHTML = `<i icon-name="volume-2" class="lucide"></i>`;
 
     const attrs = {
-      class: 'icon custom-class',
+      class: 'lucide icon custom-class',
       fill: 'black',
     };
 
@@ -54,6 +60,8 @@ describe('createIcons', () => {
       return acc;
     },{})
 
+    expect(document.body.innerHTML).toMatchSnapshot();
+
     expect(attributesAndValues).toEqual(expect.objectContaining(attrs));
   });
 });

packages/lucide/tests/replaceElement.spec.js

@@ -44,6 +44,7 @@ describe('getClassNames', () => {
 describe('combineClassNames', () => {
   it('should retuns a string of classNames', () => {
     const arrayOfClassnames = [
+      'item',
       {
         class: ['item1','item2','item3']
       },

rollup.plugins.js

@@ -1,18 +1,20 @@
-const babel = require('@rollup/plugin-babel').default;
-const bundleSize = require('@atomico/rollup-plugin-sizes');
-const compiler = require('@ampproject/rollup-plugin-closure-compiler');
-const { terser } = require('rollup-plugin-terser');
-const visualizer = require('rollup-plugin-visualizer');
-const license = require('rollup-plugin-license');
-const replace = require('rollup-plugin-replace');
-const resolve = require('rollup-plugin-node-resolve');
-const commonJS = require('rollup-plugin-commonjs');
+/* eslint-disable import/no-extraneous-dependencies */
+import babel from '@rollup/plugin-babel';
+import bundleSize from '@atomico/rollup-plugin-sizes';
+import compiler from '@ampproject/rollup-plugin-closure-compiler';
+import { terser } from 'rollup-plugin-terser';
+import visualizer from 'rollup-plugin-visualizer';
+import license from 'rollup-plugin-license';
+import replace from '@rollup/plugin-replace';
+import resolve from '@rollup/plugin-node-resolve';
+import commonJS from '@rollup/plugin-commonjs';
 
 const plugins = (pkg, minify) =>
   [
     replace({
       'icons = {}': 'icons = allIcons',
       delimiters: ['', ''],
+      preventAssignment: false,
     }),
     babel({
       babelHelpers: 'bundled',
@@ -34,4 +36,4 @@ const plugins = (pkg, minify) =>
     }),
   ].filter(Boolean);
 
-module.exports = plugins;
+export default plugins;

scripts/build/generateIconFiles.js

@@ -4,24 +4,28 @@ import path from 'path';
 import prettier from 'prettier';
 import { toPascalCase } from '../helpers';
 
-export default function(iconNode, outputDirectory, template) {
-  const icons = Object.keys(iconNode);
+export default function(iconNodes, outputDirectory, template, { showLog = true }) {
+  const icons = Object.keys(iconNodes);
   const iconsDistDirectory = path.join(outputDirectory, `icons`);
 
   if (!fs.existsSync(iconsDistDirectory)) {
     fs.mkdirSync(iconsDistDirectory);
   }
 
-  icons.forEach(icon => {
-    const location = path.join(iconsDistDirectory, `${icon}.js`);
-    const componentName = toPascalCase(icon);
+  icons.forEach(iconName => {
+    const location = path.join(iconsDistDirectory, `${iconName}.js`);
+    const componentName = toPascalCase(iconName);
 
-    const node = JSON.stringify(iconNode[icon]);
+    let { children } = iconNodes[iconName];
+    children = children.map(({name, attributes}) => ([name, attributes]))
 
-    const elementTemplate = template({ componentName, node });
+    const elementTemplate = template({ componentName, iconName, children });
 
-    fs.writeFileSync(location, prettier.format(elementTemplate, { parser: 'babel' }), 'utf-8');
 
-    console.log('Successfully built', componentName);
+    fs.writeFileSync(location, prettier.format(elementTemplate, { singleQuote: true, trailingComma: 'all', parser: 'babel' }), 'utf-8');
+
+    if(showLog) {
+      console.log('Successfully built', componentName);
+    }
   });
 }

scripts/buildIcons.js

@@ -1,15 +1,12 @@
 import fs from 'fs';
 import path from 'path';
-// eslint-disable-next-line import/no-extraneous-dependencies
-import getArgumentOptions from 'minimist';
+import getArgumentOptions from 'minimist'; // eslint-disable-line import/no-extraneous-dependencies
 
 import renderIconsObject from './render/renderIconsObject';
-import renderIconNodes from './render/renderIconNodes';
 import generateIconFiles from './build/generateIconFiles';
 import generateExportsFile from './build/generateExportsFile';
-import { readSvgDirectory } from './helpers';
 
-/* eslint-disable import/no-dynamic-require */
+import { readSvgDirectory } from './helpers';
 
 const cliArguments = getArgumentOptions(process.argv.slice(2));
 
@@ -23,26 +20,14 @@ if (!fs.existsSync(OUTPUT_DIR)) {
 
 const svgFiles = readSvgDirectory(ICONS_DIR);
 
-const icons = renderIconsObject(svgFiles, ICONS_DIR);
+const icons = renderIconsObject(svgFiles, ICONS_DIR, cliArguments.renderUniqueKey);
 
-const iconVNodes = renderIconNodes(icons, cliArguments);
-
-const defaultIconFileTemplate = ({ componentName, node }) => `
-  const ${componentName} = ${node};
-
-  export default ${componentName};
-`;
-
-const iconFileTemplate = cliArguments.templateSrc
-  ? require(cliArguments.templateSrc).default
-  : defaultIconFileTemplate;
+const defaultIconFileTemplate = './templates/defaultIconFileTemplate';
+// eslint-disable-next-line import/no-dynamic-require
+const iconFileTemplate = require(cliArguments.templateSrc || defaultIconFileTemplate).default;
 
 // Generates iconsNodes files for each icon
-generateIconFiles(iconVNodes, OUTPUT_DIR, iconFileTemplate);
+generateIconFiles(icons, OUTPUT_DIR, iconFileTemplate, { showLog: !cliArguments.silent });
 
 // Generates entry files for the compiler filled with icons exports
-generateExportsFile(
-  path.join(SRC_DIR, 'icons/index.js'),
-  path.join(OUTPUT_DIR, 'icons'),
-  iconVNodes,
-);
+generateExportsFile(path.join(SRC_DIR, 'icons/index.js'), path.join(OUTPUT_DIR, 'icons'), icons);

scripts/generateChangelog.js

@@ -0,0 +1,87 @@
+import getArgumentOptions from 'minimist'; // eslint-disable-line import/no-extraneous-dependencies
+import githubApi from './githubApi';
+
+const fetchCompareTags = oldTag =>
+  githubApi(`https://api.github.com/repos/lucide-icons/lucide/compare/${oldTag}...master`);
+
+const iconRegex = /icons\/(.*)\.svg/g;
+const iconTemplate = ({ name, pullNumber, author }) =>
+  `- \`${name}\` (${pullNumber}) by @${author}`;
+
+const topics = [
+  {
+    title: 'New icons 🎨',
+    template: iconTemplate,
+    filter: ({ status, filename }) => status === 'added' && filename.match(iconRegex),
+  },
+  {
+    title: 'Modified Icons 🔨',
+    template: iconTemplate,
+    filter: ({ status, filename }) => status === 'modified' && filename.match(iconRegex),
+  },
+  {
+    title: 'Code improvements ⚡',
+    template: ({ title, pullNumber, author }) => `- ${title} (${pullNumber}) by @${author}`,
+    filter: ({ filename }, index, self) =>
+      !filename.match(iconRegex) && self.indexOf(filename) === index,
+  },
+];
+
+const fetchCommits = async file => {
+  const commits = await githubApi(
+    `https://api.github.com/repos/lucide-icons/lucide/commits?path=${file.filename}`,
+  );
+
+  return { ...file, commits };
+};
+
+const cliArguments = getArgumentOptions(process.argv.slice(2));
+
+// eslint-disable-next-line func-names
+(async function() {
+  try {
+    const output = await fetchCompareTags(cliArguments['old-tag']);
+    const changedFiles = output.files.filter(
+      ({ filename }) => !filename.match(/site\/(.*)|(.*)package\.json|tags.json/g),
+    );
+
+    const commits = await Promise.all(changedFiles.map(fetchCommits));
+
+    if (!commits.length) {
+      throw new Error('No commits found');
+    }
+
+    const mappedCommits = commits
+      .map(({ commits: [pr], filename, sha, status }) => {
+        const pullNumber = /(.*)\((#[0-9]*)\)/gm.exec(pr.commit.message);
+        const nameRegex = /^\/?(.+\/)*(.+)\.(.+)$/g.exec(filename);
+
+        return {
+          filename,
+          name: nameRegex && nameRegex[2] ? nameRegex[2] : null,
+          title: pullNumber && pullNumber[1] ? pullNumber[1].trim() : null,
+          pullNumber: pullNumber && pullNumber[2] ? pullNumber[2].trim() : null,
+          author: pr.author.login,
+          sha,
+          status,
+        };
+      })
+      .filter(({ pullNumber }) => !!pullNumber);
+
+    const changelog = topics.map(({ title, filter, template }) => {
+      const lines = mappedCommits.filter(filter).map(template);
+
+      if (lines.length) {
+        return [`## ${title}`, ' ', ...lines, ' '];
+      }
+
+      return [''];
+    });
+
+    const changelogMarkown = changelog.flat().join('\n');
+
+    console.log(changelogMarkown);
+  } catch (error) {
+    throw new Error(error);
+  }
+})();

scripts/githubApi.js

@@ -0,0 +1,22 @@
+// eslint-disable-next-line import/no-extraneous-dependencies
+import fetch, { Headers } from 'node-fetch';
+
+const githubApi = async endpoint => {
+  const headers = new Headers();
+  const username = 'ericfennis';
+  const password = process.env.GITHUB_API_KEY;
+
+  headers.set(
+    'Authorization',
+    `Basic ${Buffer.from(`${username}:${password}`).toString('base64')}`,
+  );
+
+  const res = await fetch(endpoint, {
+    method: 'GET',
+    headers,
+  });
+
+  return res.json();
+};
+
+export default githubApi;

scripts/helpers.js

@@ -2,9 +2,10 @@ import fs from 'fs';
 import path from 'path';
 
 /**
- * Converts string to PascalCase
+ * Converts string to CamelCase
  *
  * @param {string} string
+ * @returns {string} A camelized string
  */
 export const toCamelCase = string =>
   string.replace(/^([A-Z])|[\s-_]+(\w)/g, (match, p1, p2) =>
@@ -15,6 +16,7 @@ export const toCamelCase = string =>
  * Converts string to PascalCase
  *
  * @param {string} string
+ * @returns {string} A pascalized string
  */
 export const toPascalCase = string => {
   const camelCase = toCamelCase(string);
@@ -23,9 +25,10 @@ export const toPascalCase = string => {
 };
 
 /**
- * Converts string to PascalCase
+ * Converts string to KebabCase
  *
  * @param {string} string
+ * @returns {string} A kebabized string
  */
 export const toKebabCase = string => string.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
 
@@ -42,6 +45,7 @@ export const resetFile = (fileName, outputDirectory) =>
  * Reads the file contents.
  *
  * @param {string} path
+ * @returns {string} The contents of a file
  */
 export const readFile = entry => fs.readFileSync(path.resolve(__dirname, '../', entry), 'utf-8');
 
@@ -69,6 +73,7 @@ export const writeFile = (content, fileName, outputDirectory) =>
  * reads the icon directory
  *
  * @param {string} directory
+ * @returns {array} An array of file paths containig svgs
  */
 export const readSvgDirectory = directory =>
   fs.readdirSync(directory).filter(file => path.extname(file) === '.svg');
@@ -79,7 +84,8 @@ export const readSvgDirectory = directory =>
  * @param {string} fileName
  * @param {string} directory
  */
-export const readSvg = (fileName, directory) => fs.readFileSync(path.join(directory, fileName));
+export const readSvg = (fileName, directory) =>
+  fs.readFileSync(path.join(directory, fileName), 'utf-8');
 
 /**
  * writes content to a file
@@ -91,7 +97,13 @@ export const readSvg = (fileName, directory) => fs.readFileSync(path.join(direct
 export const writeSvgFile = (fileName, outputDirectory, content) =>
   fs.writeFileSync(path.join(outputDirectory, fileName), content, 'utf-8');
 
-// This is a djb2 hashing function
+/**
+ * djb2 hashing function
+ *
+ * @param {string} string
+ * @param {number} seed
+ * @returns {string} A hashed string of 6 characters
+ */
 export const hash = (string, seed = 5381) => {
   let i = string.length;
 
@@ -103,3 +115,27 @@ export const hash = (string, seed = 5381) => {
   // eslint-disable-next-line no-bitwise
   return (seed >>> 0).toString(36).substr(0, 6);
 };
+
+/**
+ * Generate Hashed string based on name and attributes
+ *
+ * @param {object} seed
+ * @param {string} seed.name A name, for example an icon name
+ * @param {object} seed.attributes An object of SVGElement Attrbutes
+ * @returns {string} A hashed string of 6 characters
+ */
+export const generateHashedKey = ({ name, attributes }) => hash(JSON.stringify([name, attributes]));
+
+/**
+ * Checks if array of items contains duplicated items
+ *
+ * @param {array} children an array of items
+ * @returns {Boolean} if items contains duplicated items.
+ */
+export const hasDuplicatedChildren = children => {
+  const hashedKeys = children.map(generateHashedKey);
+
+  return !hashedKeys.every(
+    (key, index) => index === hashedKeys.findIndex(childKey => childKey === key),
+  );
+};