Add fuzzy search (#511)

* Add fuzzy search

* Improve search performance

.github/workflows/release.yml

@@ -37,6 +37,7 @@ jobs:
         with:
           node-version: "14"
           cache: yarn
+          cache-dependency-path: 'yarn.lock'
 
       - name: Install dependencies
         run: yarn --prefer-offline
@@ -237,6 +238,77 @@ jobs:
           name: lucide-preact-package-json
           path: packages/lucide-preact/package.json
 
+  lucide-svelte:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    needs: pre-build
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2.4.0
+        with:
+          node-version: "14"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn --prefer-offline
+
+      - name: Set Auth Token
+        run: npm config set //registry.npmjs.org/:_authToken ${{ secrets.NPM_TOKEN }}
+
+      - name: Set package.json version lucide
+        run: yarn workspace lucide-svelte version --new-version ${{ needs.pre-build.outputs.VERSION }} --no-git-tag-version
+
+      - name: Build
+        run: yarn workspace lucide-svelte build
+
+      - name: Test
+        run: yarn workspace lucide-svelte test
+
+      - name: Publish
+        run: yarn workspace lucide-svelte publish
+
+      - name: Upload package.json
+        uses: actions/upload-artifact@v2
+        with:
+          name: lucide-svelte-package-json
+          path: packages/lucide-svelte/package.json
+
+  lucide-static:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    needs: [pre-build, lucide-font]
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/download-artifact@v2
+      - uses: actions/setup-node@v2.4.0
+        with:
+          node-version: "14"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn --prefer-offline
+
+      - name: Set Auth Token
+        run: npm config set //registry.npmjs.org/:_authToken ${{ secrets.NPM_TOKEN }}
+
+      - name: Set new version
+        run: yarn workspace lucide-static version --new-version ${{ needs.pre-build.outputs.VERSION }} --no-git-tag-version
+
+      - name: Move Font
+        run: cp -r lucide-font packages/lucide-static/font
+
+      - name: Build
+        run: yarn workspace lucide-static build
+
+      - name: Publish
+        run: yarn workspace lucide-static publish
+
+      - name: Upload package.json
+        uses: actions/upload-artifact@v2
+        with:
+          name: lucide-static-package-json
+          path: packages/lucide-static/package.json
+
   lucide-font:
     if: github.repository == 'lucide-icons/lucide'
     runs-on: ubuntu-latest
@@ -277,27 +349,14 @@ jobs:
 
       - name: Build Icon Font
         run: |
-          mkdir build
-          list=(-200 -300 "" -500 -600)
-          command=''
-          for name in "${list[@]}"
-          do
-            subcommand="(yarn build:outline-icons --outputDir=converted_icons${name} && fontcustom compile "./converted_icons${name}" -h -n "lucide${name}" -o ./build -F)"
-            if [ -z "$command" ]
-            then
-              command="$subcommand";
-            else
-              command="$command & $subcommand";
-            fi
-          done
-
-          eval $command
+          mkdir lucide-font
+          yarn build:outline-icons --outputDir=converted_icons && fontcustom compile "./converted_icons" -h -n "lucide" -o ./lucide-font -F
 
       - name: "Upload to Artifacts"
         uses: actions/upload-artifact@v1
         with:
           name: lucide-font
-          path: build
+          path: lucide-font
 
   lucide-flutter:
     if: github.repository == 'lucide-icons/lucide'
@@ -377,6 +436,7 @@ jobs:
         lucide-vue,
         lucide-vue-next,
         lucide-angular,
+        lucide-svelte,
         lucide-preact,
         lucide-flutter,
         lucide-font,
@@ -392,6 +452,7 @@ jobs:
           mv lucide-react-package-json/package.json packages/lucide-react/package.json
           mv lucide-vue-package-json/package.json packages/lucide-vue/package.json
           mv lucide-preact-package-json/package.json packages/lucide-preact/package.json
+          mv lucide-svelte-package-json/package.json packages/lucide-svelte/package.json
           mv lucide-vue-next-package-json/package.json packages/lucide-vue-next/package.json
           mv lucide-angular-package-json/package.json packages/lucide-angular/package.json
           mv lucide-flutter-pubspec-yaml/pubspec.yaml packages/lucide-flutter/pubspec.yaml

.github/workflows/test-lucide-svelte.yml

@@ -0,0 +1,36 @@
+name: Test Lucide Svelte
+
+on:
+  pull_request:
+    paths:
+      - packages/lucide-svelte/**
+  push:
+    paths:
+      - packages/lucide-svelte/**
+
+  workflow_dispatch:
+    inputs:
+      version:
+        description: Version
+        required: true
+
+jobs:
+  lucide-svelte:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2.4.0
+        with:
+          node-version: "14"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn --prefer-offline
+
+      - name: Build
+        run: yarn workspace lucide-svelte build
+
+      - name: Test
+        run: yarn workspace lucide-svelte test
+

.github/workflows/test-lucide-vue-next.yml

@@ -0,0 +1,36 @@
+name: Test Lucide Vue Next
+
+on:
+  pull_request:
+    paths:
+      - packages/lucide-vue-next/**
+  push:
+    paths:
+      - packages/lucide-vue-next/**
+
+  workflow_dispatch:
+    inputs:
+      version:
+        description: Version
+        required: true
+
+jobs:
+  lucide-vue-next:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2.4.0
+        with:
+          node-version: "14"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn --prefer-offline
+
+      - name: Build
+        run: yarn workspace lucide-vue-next build
+
+      - name: Test
+        run: yarn workspace lucide-vue-next test
+

.github/workflows/test-lucide-vue.yml

@@ -0,0 +1,36 @@
+name: Test Lucide Vue
+
+on:
+  pull_request:
+    paths:
+      - packages/lucide-vue/**
+  push:
+    paths:
+      - packages/lucide-vue/**
+
+  workflow_dispatch:
+    inputs:
+      version:
+        description: Version
+        required: true
+
+jobs:
+  lucide-vue:
+    if: github.repository == 'lucide-icons/lucide'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2.4.0
+        with:
+          node-version: "14"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn --prefer-offline
+
+      - name: Build
+        run: yarn workspace lucide-vue build
+
+      - name: Test
+        run: yarn workspace lucide-vue test
+

.vscode/settings.json

@@ -0,0 +1,7 @@
+{
+  "cSpell.words": [
+    "devs",
+    "preact",
+    "Preact"
+  ]
+}

README.md

@@ -11,13 +11,13 @@
 
 Lucide is a community-run fork of [Feather Icons](https://github.com/feathericons/feather), open for anyone to contribute icons.
 
-It began after growing disaffection of the [Feather Icons](https://github.com/feathericons/feather) project moderation. With over 300+ open issues and over 100+ open PRs, the Feather Icons project has been abandoned. This unfortunately means that hundreds of developers and designers wasted their time contributing to Feather Icons with no chance of PRs being accepted.
+It began after growing disaffection with the [Feather Icons](https://github.com/feathericons/feather) project moderation. With over 300+ open issues and over 100+ open PRs, the Feather Icons project has been abandoned. This unfortunately means that hundreds of developers and designers wasted their time contributing to Feather Icons with no chance of PRs being accepted.
 
 Lucide is trying to expand the icon set as much as possible while staying faithful to the original simplistic design language. We do this as a community of devs and designers and hope that you'll join us!
 
 ### Why choose Lucide over Feather Icons
 
-- Lucide already expanded the icon set by 130+ in less then a year, so more icons to work with.
+- Lucide already expanded the icon set by 130+ in less than a year, so more icons to work with.
 - Well maintained code base.
 - Active community.
 
@@ -33,6 +33,7 @@ Lucide is trying to expand the icon set as much as possible while staying faithf
   * [Vue 3](#vue-3)
   * [Angular](#angular)
   * [Preact](#preact)
+  * [Static](#static-svg-sprite-font-icons-)
   * [Figma](#figma)
   * [Laravel](#laravel)
   * [Flutter](#flutter)
@@ -129,6 +130,23 @@ npm install lucide-preact
 
 For more details, see the [documentation](https://github.com/lucide-icons/lucide/tree/master/packages/lucide-preact#lucide-preact).
 
+### Static (svg sprite, font, icons ..)
+
+Assets:
+[Font Files](https://github.com/lucide-icons/lucide/releases/tag/latest)
+[SVG Files](https://github.com/lucide-icons/lucide/releases/tag/latest)
+[SVG Sprite](https://cdn.jsdelivr.net/npm/lucide-static@latest/sprite.svg)
+
+NPM package
+
+```sh
+yarn add lucide-static
+
+# or
+
+npm install lucide-static
+```
+
 ### Figma
 
 The lucide figma plugin.

docs/FIGMA_GUIDE.md

@@ -0,0 +1,7 @@
+---
+title: Figma Template Guide
+---
+
+# Figma Template Guide
+
+Please help us write this guide.

docs/ICON_DESIGN_GUIDE.md

@@ -1,4 +1,8 @@
-# Icon Design Guide
+---
+title: Icon Design Guide
+---
+
+# Icon Design Principles
 
 Here are rules that should be followed to keep quality and consistency when making icons for Lucide.
 

docs/ILLUSTRATOR_GUIDE.md

@@ -1,3 +1,6 @@
+---
+title: Illustrator Template Guide
+---
 
 # Illustrator Template Guide
 
@@ -25,4 +28,4 @@ The Illustrator template is created following guidelines from the [Icon Design G
 
 After that, double check that the [code conventions and SVG global attributes](https://github.com/lucide-icons/lucide/blob/master/docs/ICON_DESIGN_GUIDE.md#code-conventions) are correct.
 
-7. Minify paths with [SVGOMG](https://jakearchibald.github.io/svgomg/).
+7. Minify paths with [SVGOMG](https://jakearchibald.github.io/svgomg/).

docs/INKSCAPE_GUIDE.md

@@ -1,3 +1,7 @@
+---
+title: Icon Design Guide
+---
+
 # Inkscape Setup Guide
 
 This guide shows the steps to setup Inkscape for creating icons that conform to the Featherity design

docs/comparison.md

@@ -0,0 +1,25 @@
+---
+title: Comparison
+---
+
+# Comparison
+
+## Lucide vs Feather Icons
+
+Lucide is a community-run fork of [Feather Icons](https://github.com/feathericons/feather).
+
+It began after growing disaffection of the [Feather Icons](https://github.com/feathericons/feather) project moderation. With over 300+ open issues and over 100+ open PRs, the Feather Icons project has been abandoned adn not maintained actively. This unfortunately means that hundreds of developers and designers wasted their time contributing to Feather Icons with no chance of PRs being accepted.
+
+Lucide is trying to expand the icon set as much as possible while staying faithful to the original simplistic design language. We do this as a community of devs and designers.
+
+### Why should I choose Lucide over Feather Icons?
+
+- Lucide already expended the icon set by 130+ in less then a year. Lucide has over 500+ icon, feather sticks around 286 icons.
+- Well maintained code base.
+- Active community.
+
+### Should I migrate to Lucide?
+
+That depends if you're fine with the icons from feather icons. If that is the case, it is maybe not the effort worth it.
+But if you keep wrestling and feel limited by the icons Feather provides you can consider to migrate.
+We didn't remove any icons when we forked, but there are some icons renamed.

docs/index.md

@@ -1,116 +1,23 @@
 ---
 title: Introduction
+nextPage:
+  - comparison
+  - installation
 ---
 
 # Introduction
 
-## What is Lucide?
+An open source icon library for displaying icons and symbols in digital and non digital projects. It is containing over 500+ Vector (svg) files. To use these icons, lucide provides several official packages to make it easier to use these icons in projects.
 
-Lucide is a community-run fork of [Feather Icons](https://github.com/feathericons/feather), open for anyone to contribute icons.
+Lucide contains icons with different variants and states. With that designers and developers can choose the right icon for them selves. If icons don't exist you're free to open design request. The Lucide community will help.
 
-It began after growing disaffection of the [Feather Icons](https://github.com/feathericons/feather) project moderation. With over 300+ open issues and over 100+ open PRs, the Feather Icons project has been abandoned. This unfortunately means that hundreds of developers and designers wasted their time contributing to Feather Icons with no chance of PRs being accepted.
+With help of the community, contributors are providing the library of new icons. With more icons, we simply have more icons to work with in your project. Also with rising of new applications with specific features lucide has the goal the provide the complete set for you project.
 
-Lucide is trying to expand the icon set as much as possible while staying faithful to the original simplistic design language. We do this as a community of devs and designers and hope that you'll join us!
+When designing new icons, the community is working with a set of design rules. This is to keep icons: recognizable, consistency in style, and readable on all sizes. The community likes to have creativity in new icons but conventional design is important to have recognizable icons.
 
-### Why choose Lucide over Feather Icons
+Beside design, code is also important. Assets like icons in for example web projects can increase the transferred bytes significantly. With the growing internet, lucide has the responsibility to keep their assets small as possible. To achieve this, lucide uses SVG compression and specific code architecture for three-shaking abilities. With three-shaking used you will only ship the icons you used, helps you to keep the software small as possible when distributed.
 
-- 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.
+Lucide provides several official packages for: [Web (Vanilla)](https://lucide.dev/docs/lucide), [React](https://lucide.dev/docs/lucide-react), [Vue](https://lucide.dev/docs/lucide-vue), [Vue 3](https://lucide.dev/docs/lucide-vue-next), [Svelte](https://lucide.dev/docs/lucide-svelte),[Preact](https://lucide.dev/docs/lucide-preact), [Angular](https://lucide.dev/docs/lucide-angular), [NodeJS](https://lucide.dev/docs/lucide-static#nodejs) and [Flutter](https://lucide.dev/docs/lucide-flutter).
 
-## Getting Started
-
-At its core, Lucide is a collection of [SVG](https://svgontheweb.com/#svg) files. This means that you can use Lucide 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)
-
-### Using Lucide packages
-
-### Web
-
-Implementation of the lucide icon library for web applications.
-
-```sh
-npm install lucide
-
-#or
-
-yarn add lucide
-```
-
-For more details, see the [documentation](lucide).
-
-### React
-
-Implementation of the lucide icon library for react applications.
-
-```sh
-yarn add lucide-react
-
-# or
-
-npm install lucide-react
-```
-
-For more details, see the [documentation](lucide-react).
-
-### Vue 2
-
-Implementation of the lucide icon library for vue applications.
-
-```sh
-yarn add lucide-vue
-
-# or
-
-npm install lucide-vue
-```
-
-For more details, see the [documentation](lucide-vue).
-
-### Vue 3
-
-Implementation of the lucide icon library for vue applications.
-
-```sh
-yarn add lucide-vue-next
-
-# or
-
-npm install lucide-vue-next
-```
-
-For more details, see the [documentation](lucide-vue-next).
-
-### Angular
-
-```sh
-yarn add lucide-angular
-
-# or
-
-npm install lucide-angular
-```
-
-For more details, see the [documentation](lucide-angular).
-
-### Preact
-
-Implementation of the lucide icon library for preact applications.
-
-```sh
-yarn add lucide-preact
-
-# or
-
-npm install lucide-preact
-```
-
-For more details, see the [documentation](lucide-preact).
-
-### Figma
-
-The lucide figma plugin.
-
-Visit [Figma community page](https://www.figma.com/community/plugin/939567362549682242/Lucide-Icons) to install the plugin.
-
-![Figma Lucide Cover](https://www.figma.com/community/plugin/939567362549682242/thumbnail "Figma Lucide Cover")
+Any questions about lucide? Ask the community. Active on [GitHub](https://github.com/lucide-icons/lucide) and [Discord](https://discord.gg/EH6nSts).
 

docs/installation.md

@@ -4,10 +4,126 @@ title: Installation
 
 # Installation
 
-Hello
+## Web
 
-> hello
+Implementation of the lucide icon library for web applications.
 
-```js
-console.log('asdadfasdf')
+```bash
+npm install lucide
+
+#or
+
+yarn add lucide
 ```
+
+For more details, see the [documentation](packages/lucide).
+
+## React
+
+Implementation of the lucide icon library for react applications.
+
+```bash
+yarn add lucide-react
+
+# or
+
+npm install lucide-react
+```
+
+For more details, see the [documentation](packages/lucide-react).
+
+## Vue 2
+
+Implementation of the lucide icon library for vue applications.
+
+```bash
+yarn add lucide-vue
+
+# or
+
+npm install lucide-vue
+```
+
+For more details, see the [documentation](packages/lucide-vue).
+
+## Vue 3
+
+Implementation of the lucide icon library for vue applications.
+
+```bash
+yarn add lucide-vue-next
+
+# or
+
+npm install lucide-vue-next
+```
+
+For more details, see the [documentation](packages/lucide-vue-next).
+
+## Svelte
+
+Implementation of the lucide icon library for vue applications.
+
+```bash
+yarn add lucide-svelte
+
+# or
+
+npm install lucide-svelte
+```
+
+For more details, see the [documentation](packages/lucide-svelte).
+
+## Angular
+
+```bash
+yarn add lucide-angular
+
+# or
+
+npm install lucide-angular
+```
+
+For more details, see the [documentation](packages/lucide-angular).
+
+## Preact
+
+Implementation of the lucide icon library for preact applications.
+
+```bash
+yarn add lucide-preact
+
+# or
+
+npm install lucide-preact
+```
+
+For more details, see the [documentation](packages/lucide-preact).
+
+## Figma
+
+The lucide figma plugin.
+
+Visit [Figma community page](https://www.figma.com/community/plugin/939567362549682242/Lucide-Icons) to install the plugin.
+
+![Setting Page Size](https://www.figma.com/community/plugin/939567362549682242/thumbnail "Figma Lucide Cover")
+
+## Laravel
+
+Implementation of Lucide icon's using `blade-icons` for Laravel based projects.
+
+```bash
+composer require mallardduck/blade-lucide-icons
+```
+
+For more details, see the [documentation](https://github.com/mallardduck/blade-lucide-icons/blob/main/README.md).
+
+## Flutter
+
+Implementation of Lucide icon library for Flutter applications.
+
+```bash
+flutter pub add lucide_icons
+```
+
+For more details, see the [pub.dev](https://pub.dev/packages/lucide_icons).

docs/packages/lucide-preact.md

@@ -62,7 +62,7 @@ const App = () => {
 
 It is possible to create one generic icon component to load icons.
 
-> :warning: Example below importing all EsModules, caution  using this example, not recommended when you using bundlers, your application build size will grow strongly.
+> ⚠️ Example below importing all EsModules, caution  using this example, not recommended when you using bundlers, your application build size will grow strongly.
 
 #### Icon Component Example
 

docs/packages/lucide-react.md

@@ -4,7 +4,7 @@ Implementation of the lucide icon library for react applications
 
 ## Installation
 
-```sh
+``` bash
 yarn add lucide-react
 
 # or

docs/packages/lucide-static.md

@@ -0,0 +1,181 @@
+# Lucide Static
+
+This package include the following lucide implementations:
+
+- All svg files
+- Javascript library containing strings of svgs.
+- Icon fonts
+- Svg sprite
+
+## Why lucide-static?
+
+This package is suitable for very specific use cases for example if you want to use icon fonts, svg sprites, normal svgs or Common.js Svg strings in your javascript project.
+
+> ⚠️ It is not recommended to use this package for svg sprites or icon fonts for web pages/applications, for prototyping it is ok. We recommend to bundlers for web applications to make sure you only bundle the used icons from this icon library (Threeshaking). Otherwise it will load all the icons, making you webpage loading slower. Threeshaking is only available in the packages: [lucide](lucide), [lucide-react](lucide-react), [lucide-vue](lucide-vue), [lucide-vue-next](lucide-vue-next), [lucide-angular](lucide-angular), [lucide-preact](lucide-preact)
+
+## Installation
+
+## Package Managers
+
+```sh
+yarn add lucide-static
+
+# or
+
+npm install lucide-static
+```
+
+### CDN
+
+``` html
+<!-- Svg File -->
+<img src="https://unpkg.com/lucide-static@latest/icons/home.svg">
+
+<!-- Icon Font -->
+<style>
+  @font-face {
+    font-family: "LucideIcons";
+    src: url(https://unpkg.com/lucide-static@latest/font/Lucide.ttf) format("truetype");
+  }
+</style>
+```
+
+## Usage
+
+Checkout the [codesandbox examples](https://codesandbox.io/s/using-the-svg-sprite-lz1kk).
+
+### SVG Files
+
+#### Svg file as image
+
+To use it in for example html:
+
+``` html
+<!-- Svg File -->
+<img src="~lucide-static/icons/home.svg">
+```
+
+``` css
+.home-icon {
+  background-image: url(~lucide-static/icons/home.svg)
+}
+```
+
+Make sure you have the correct webpack loaders to make this work. [url-loader](https://v4.webpack.js.org/loaders/url-loader/)
+
+#### Svg file Inline
+
+You can simply import each svg by targeting `lucide-static/icons/{icon-name}.svg`.
+To use svgs in your project you can for example use a [svg loader](https://v4.webpack.js.org/loaders/svg-inline-loader/).
+
+```js
+import arrowRightIcon from 'lucide-static/icons/arrow-right'
+
+// return string of a svg
+```
+
+### SVG Sprite
+
+You may need additional loader for this.
+
+```html
+<!-- Icon Sprite, not recommended for production! -->
+<img src="lucide-static/sprite.svg#home">
+
+<!-- or -->
+<svg
+  width="24"
+  height="24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <use href="#alert-triangle" />
+</svg>
+
+<svg>
+  ...sprite svg
+</svg>
+```
+
+If you'd prefer, you can use CSS to hold your base SVG properties
+
+```css
+.lucide-icon {
+    width: 24px;
+    height: 24px;
+    stroke: currentColor;
+    fill: none;
+    stroke-width: 2;
+    stroke-linecap: round;
+    stroke-linejoin: round;
+}
+```
+
+and update the svg as follows
+
+```svg
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  class="lucide-icon"
+>
+<use
+    href="#alert-triangle"
+  />
+</svg>
+<svg>
+  ...sprite svg
+</svg>
+```
+
+### Icon Font
+
+```css
+@import("~lucide-static/font/Lucide.css")
+```
+
+```html
+<div class="icon-home"></div>
+```
+
+
+### Node.js
+
+To use lucide icons in your Nodejs project you can import each icon as:
+
+```js
+const { messageSquare } = require('lucide-static/lib')
+```
+
+> Note: Each icon name is in camelCase.
+
+#### Example in node.js project
+
+```js
+const express = require('express')
+const { messageSquare } = require('lucide-static/lib')
+const app = express()
+const port = 3000
+
+app.get('/', (req, res) => {
+  res.send(`
+    <!DOCTYPE html>
+    <html>
+      <head>
+        <title>Page Title</title>
+      </head>
+      <body>
+        <h1>Lucide Icons</h1>
+        <p>This is a lucide icon ${messageSquare}</p>
+
+      </body>
+    </html>
+  `)
+})
+
+app.listen(port, () => {
+  console.log(`Example app listening at http://localhost:${port}`)
+})
+```

docs/packages/lucide-svelte.md

@@ -0,0 +1,89 @@
+# Lucide Svelte
+
+Implementation of the lucide icon library for svelte applications.
+
+## Installation
+
+```bash
+yarn add lucide-svelte
+
+# or
+
+npm install lucide-svelte
+```
+
+## How to use
+
+All the icons are Svelte components, that ouputs Svg elements. So each icon can be imported and used as a component. This also helps with the use of threeshaking so you only import the icons you use.
+
+### Example
+
+Default usage:
+
+```html
+<script>
+import { Skull } from 'lucide-svelte'
+</script>
+
+<Skull/>
+```
+
+You can pass additional props to adjust the icon.
+
+```html
+<script>
+import { Camera } from 'lucide-svelte'
+</script>
+
+<Camera />
+```
+
+### Available props
+
+|  name          |   type   |  default
+| -------------- | -------- | --------
+| `size`         | *Number* | 24
+| `color`        | *String* | currentColor
+| `strokeWidth`  | *Number* | 2
+| `*<SVGProps>`  | *String* | -
+
+\* All SVGProps are available to style the svgs. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation)
+
+### Example of custom props
+
+```html
+<script>
+import { Phone } from 'lucide-svelte'
+</script>
+
+<Phone fill="#333"/>
+```
+
+This results a filled phone icon.
+
+### One generic icon component
+
+It is possible to create one generic icon component to load icons.
+
+> ⚠️ Example below importing all EsModules, caution using this example, not recommended when you bundle your application,the build size will grow strongly. Because it will import all the icons.
+
+#### Icon Component Example
+
+``` html
+<script>
+  import * as icons from "lucide-svelte";
+  export let name;
+</script>
+
+<svelte:component this={icons[name]} {...$$props}/>
+```
+
+##### Then you can use it like this
+
+``` html
+<script>
+  import LucideIcon from "./LucideIcon";
+</script>
+
+<LucideIcon name="Menu" />
+```

docs/packages/lucide-vue-next.md

@@ -2,15 +2,19 @@
 
 Implementation of the lucide icon library for Vue 3 applications.
 
-> ⚠️ This version of lucide is for Vue 3, For Vue 2 got to [lucide-vue-next](https://github.com/lucide-icons/lucide/tree/master/packages/lucide-vue#lucide-vue)
+> ⚠️ This version of lucide is for Vue 3, For Vue 2 got to [lucide-vue-next](lucide-vue)
 
 ## Installation
 
-```sh
+**With yarn**
+
+```bash
 yarn add lucide-vue-next
+```
 
-# or
+**With npm**
 
+```bash
 npm install lucide-vue-next
 ```
 
@@ -23,7 +27,7 @@ Each icon can be imported as a vue component.
 
 You can pass additional props to adjust the icon.
 
-``` vue
+``` html
 <template>
   <Camera
     color="red"
@@ -56,7 +60,7 @@ export default {
 
 You can also pass custom props that will be added in the svg as attributes.
 
-``` vue
+``` html
 <template>
   <Camera fill="red" />
 </template>
@@ -66,11 +70,11 @@ You can also pass custom props that will be added in the svg as attributes.
 
 It is possible to create one generic icon component to load icons.
 
-> :warning: Example below importing all EsModules, caution using this example, not recommended when you using bundlers, your application build size will grow strongly.
+> ⚠️ Example below importing all EsModules, caution using this example, not recommended when you using bundlers, your application build size will grow strongly.
 
 #### Icon Component Example
 
-``` vue
+``` html
 <template>
   <component :is="icon" />
 </template>
@@ -85,18 +89,18 @@ export default {
       required: true,
     },
   },
-  computed: {
-    icon() {
-      return icons[this.name];
-    },
-  },
+  setup(props) {
+    const icon = computed(() => icons[props.name])
+
+    return { icon }
+  }
 };
 </script>
 ```
 
 ##### Then you can use it like this
 
-``` vue
+``` html
 <template>
   <div id="app">
     <Icon name="Airplay" />

docs/packages/lucide-vue.md

@@ -2,7 +2,7 @@
 
 Implementation of the lucide icon library for Vue applications.
 
-> ⚠️ This version of lucide is for Vue 2, For Vue 3 got to [lucide-vue-next](https://github.com/lucide-icons/lucide/tree/master/packages/lucide-vue-next#lucide-vue-next)
+> ⚠️ This version of lucide is for Vue 2, For Vue 3 got to [lucide-vue-next](lucide-vue-next)
 
 ## Installation
 
@@ -23,7 +23,7 @@ Each icon can be imported as a vue component.
 
 You can pass additional props to adjust the icon.
 
-``` vue
+``` html
 <template>
   <Camera
     color="red"
@@ -56,7 +56,7 @@ export default {
 
 You can also pass custom props that will be added in the svg as attributes.
 
-``` vue
+``` html
 <template>
   <Camera fill="red" />
 </template>
@@ -66,11 +66,11 @@ You can also pass custom props that will be added in the svg as attributes.
 
 It is possible to create one generic icon component to load icons.
 
-> :warning: Example below importing all EsModules, caution using this example, not recommended when you using bundlers, your application build size will grow strongly.
+> ⚠️ Example below importing all EsModules, caution using this example, not recommended when you using bundlers, your application build size will grow strongly.
 
 #### Icon Component Example
 
-``` vue
+``` html
 <template>
   <component :is="icon" />
 </template>
@@ -96,7 +96,7 @@ export default {
 
 ##### Then you can use it like this
 
-``` vue
+``` html
 <template>
   <div id="app">
     <Icon name="Airplay" />

icons/alarm-clock-off.svg

@@ -9,9 +9,9 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M19.94 14A8 8 0 0 0 10 5.25m8.13 12.89A8 8 0 1 1 6.87 6.86" />
-  <path d="m22 6-3-3" />
-  <path d="m6 19-2 2" />
-  <path d="m2 2 20 20" />
-  <path d="M4 4 2 6" />
+  <path d="M19.94 14A8 8 0 0010 5.25m8.13 12.89A8 8 0 116.87 6.86" />
+  <path d="M22 6l-3-3" />
+  <path d="M6 19l-2 2" />
+  <path d="M2 2l20 20" />
+  <path d="M4 4L2 6" />
 </svg>

icons/arrow-left-right.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"
+>
+  <polyline points="17 11 21 7 17 3" />
+  <line x1="21" y1="7" x2="9" y2="7" />
+  <polyline points="7 21 3 17 7 13" />
+  <line x1="15" y1="17" x2="3" y2="17" />
+</svg>

icons/banknote.svg

@@ -1,8 +1,8 @@
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  viewBox="0 0 24 24"
   width="24"
   height="24"
+  viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"
   stroke-width="2"

icons/bell-minus.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/bell-plus.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/bitcoin.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/bug.svg

@@ -1,4 +1,3 @@
-
 <svg
   xmlns="http://www.w3.org/2000/svg"
   width="24"

icons/carrot.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="M2.27 21.7s9.87-3.5 12.73-6.36a4.5 4.5 0 00-6.36-6.37C5.77 11.84 2.27 21.7 2.27 21.7zM8.64 14l-2.05-2.04M15.34 15l-2.46-2.46" />
+  <path d="M22 9s-1.33-2-3.5-2C16.86 7 15 9 15 9s1.33 2 3.5 2S22 9 22 9z" />
+  <path d="M15 2s-2 1.33-2 3.5S15 9 15 9s2-1.84 2-3.5C17 3.33 15 2 15 2z" />
+</svg>

icons/chevrons-down-up.svg

@@ -2,6 +2,7 @@
   xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
+  viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"
   stroke-width="2"

icons/chevrons-up-down.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/clipboard-list.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/clock-1.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 14.5 8" />
+</svg>

icons/clock-10.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 8 10" />
+</svg>

icons/clock-11.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 9.5 8" />
+</svg>

icons/clock-12.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12" />
+</svg>

icons/clock-2.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 16 10" />
+</svg>

icons/clock-3.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 16.5 12" />
+</svg>

icons/clock-4.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 16 14" />
+</svg>

icons/clock-5.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 14.5 16" />
+</svg>

icons/clock-6.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 12 16.5" />
+</svg>

icons/clock-7.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 9.5 16" />
+</svg>

icons/clock-8.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 8 14" />
+</svg>

icons/clock-9.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"
+>
+  <circle cx="12" cy="12" r="10" />
+  <polyline points="12 6 12 12 7.5 12" />
+</svg>

icons/cloud-fog.svg

@@ -10,6 +10,6 @@
   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 17L7 17" />
-  <path d="M17 21L9 21" />
+  <path d="M16 17H7" />
+  <path d="M17 21H9" />
 </svg>

icons/code-2.svg

@@ -9,7 +9,7 @@
   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" />
+  <path d="M18 16l4-4-4-4" />
+  <path d="M6 8l-4 4 4 4" />
+  <path d="M14.5 4l-5 16" />
 </svg>

icons/coffee.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/columns.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/drumstick.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="M15.45 15.4c-2.13.65-4.3.32-5.7-1.1-2.29-2.27-1.76-6.5 1.17-9.42 2.93-2.93 7.15-3.46 9.43-1.18 1.41 1.41 1.74 3.57 1.1 5.71-1.4-.51-3.26-.02-4.64 1.36-1.38 1.38-1.87 3.23-1.36 4.63z" />
+  <path d="M11.25 15.6l-2.16 2.16a2.5 2.5 0 11-4.56 1.73 2.49 2.49 0 01-1.41-4.24 2.5 2.5 0 013.14-.32l2.16-2.16" />
+</svg>

icons/edit-2.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/edit-3.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/edit.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/egg.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 22c6.23-.05 7.87-5.57 7.5-10-.36-4.34-3.95-9.96-7.5-10-3.55.04-7.14 5.66-7.5 10-.37 4.43 1.27 9.95 7.5 10z" />
+</svg>

icons/euro.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/figma.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/forward.svg

@@ -9,6 +9,6 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <polyline points="15 17 20 12 15 7"></polyline>
-  <path d="M4 18v-2a4 4 0 0 1 4-4h12"></path>
+  <polyline points="15 17 20 12 15 7" />
+  <path d="M4 18v-2a4 4 0 014-4h12" />
 </svg>

icons/framer.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/frown.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/function-square.svg

@@ -10,5 +10,6 @@
   stroke-linejoin="round"
 >
   <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
-  <path d="M9 17c1.93 0 2.85-1 2.85-2.8V9.99c0-1.93 1.03-3.26 3.15-2.93M9 11.24h5.66" />
+  <path d="M9 17c2 0 2.8-1 2.8-2.8V10c0-2 1-3.3 3.2-3" />
+  <path d="M9 11.2h5.7" />
 </svg>

icons/grid.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/indian-rupee.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/japanese-yen.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/key.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/list-plus.svg

@@ -12,6 +12,6 @@
   <path d="M11 12H3" />
   <path d="M16 6H3" />
   <path d="M16 18H3" />
-  <path d="M18 9V15" />
-  <path d="M21 12H15" />
+  <path d="M18 9v6" />
+  <path d="M21 12h-6" />
 </svg>

icons/meh.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/music.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/pen-tool.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/pencil.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"
@@ -10,5 +10,5 @@
   stroke-linejoin="round"
 >
   <line x1="18" y1="2" x2="22" y2="6" />
-  <path d="M7.5 20.5L19 9l-4-4L3.5 16.5 2 22l5.5-1.5z" />
+  <path d="M7.5 20.5L19 9l-4-4L3.5 16.5 2 22z" />
 </svg>

icons/person-standing.svg

@@ -10,7 +10,7 @@
   stroke-linejoin="round"
 >
   <circle cx="12" cy="5" r="1" />
-  <path d="M9 20L12 14L15 20" />
-  <path d="M6 8L12 10L18 8" />
-  <path d="M12 10V14" />
+  <path d="M9 20l3-6 3 6" />
+  <path d="M6 8l6 2 6-2" />
+  <path d="M12 10v4" />
 </svg>

icons/piggy-bank.svg

@@ -9,7 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M19 5c-1.5 0-2.8 1.4-3 2-3.5-1.5-11-.3-11 5 0 1.8 0 3 2 4.5V20h4v-2h3v2h4v-4c1-.5 1.7-1 2-2h2v-4h-2c0-1-.5-1.5-1-2h0V5Z" />
-  <path d="M2 9v1c0 1.1.9 2 2 2h1"/>
+  <path d="M19 5c-1.5 0-2.8 1.4-3 2-3.5-1.5-11-.3-11 5 0 1.8 0 3 2 4.5V20h4v-2h3v2h4v-4c1-.5 1.7-1 2-2h2v-4h-2c0-1-.5-1.5-1-2h0V5z" />
+  <path d="M2 9v1c0 1.1.9 2 2 2h1" />
   <path d="M16 11h0" />
 </svg>

icons/pin.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="M12 21v-7" />
+  <path d="M9 3v5l-2 4v2h10m0 0h-5m5 0v-2l-2-4V3" />
+  <path d="M7 3h10" />
+</svg>

icons/pound-sterling.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/reply-all.svg

@@ -9,7 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <polyline points="7 17 2 12 7 7"></polyline>
-  <polyline points="12 17 7 12 12 7"></polyline>
-  <path d="M22 18v-2a4 4 0 0 0-4-4H7"></path>
+  <polyline points="7 17 2 12 7 7" />
+  <polyline points="12 17 7 12 12 7" />
+  <path d="M22 18v-2a4 4 0 00-4-4H7" />
 </svg>

icons/reply.svg

@@ -9,6 +9,6 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <polyline points="9 17 4 12 9 7"></polyline>
-  <path d="M20 18v-2a4 4 0 0 0-4-4H4"></path>
+  <polyline points="9 17 4 12 9 7" />
+  <path d="M20 18v-2a4 4 0 00-4-4H4" />
 </svg>

icons/russian-ruble.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/scan-line.svg

@@ -0,0 +1,17 @@
+<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="M3 7V5a2 2 0 012-2h2" />
+  <path d="M17 3h2a2 2 0 012 2v2" />
+  <path d="M21 17v2a2 2 0 01-2 2h-2" />
+  <path d="M7 21H5a2 2 0 01-2-2v-2" />
+  <line x1="7" y1="12" x2="17" y2="12" />
+</svg>

icons/scan.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="M3 7V5a2 2 0 012-2h2" />
+  <path d="M17 3h2a2 2 0 012 2v2" />
+  <path d="M21 17v2a2 2 0 01-2 2h-2" />
+  <path d="M7 21H5a2 2 0 01-2-2v-2" />
+</svg>

icons/sheet.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/sidebar-close.svg

@@ -11,5 +11,5 @@
 >
   <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
   <line x1="9" y1="3" x2="9" y2="21" />
-  <path d="M17 16L13 12L17 8" />
+  <path d="M17 16l-4-4 4-4" />
 </svg>

icons/sidebar-open.svg

@@ -11,5 +11,5 @@
 >
   <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
   <line x1="9" y1="3" x2="9" y2="21" />
-  <path d="M13 8L17 12L13 16" />
+  <path d="M13 8l4 4-4 4" />
 </svg>

icons/sigma.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/signal-high.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="M2 20h.01" />
+  <path d="M7 20v-4" />
+  <path d="M12 20v-8" />
+  <path d="M17 20V8" />
+</svg>

icons/signal-low.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="M2 20h.01" />
+  <path d="M7 20v-4" />
+</svg>

icons/signal-medium.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="M2 20h.01" />
+  <path d="M7 20v-4" />
+  <path d="M12 20v-8" />
+</svg>

icons/signal-zero.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="M2 20h.01" />
+  <path d="M7 20v-4" />
+</svg>

icons/signal.svg

@@ -0,0 +1,17 @@
+<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 20h.01" />
+  <path d="M7 20v-4" />
+  <path d="M12 20v-8" />
+  <path d="M17 20V8" />
+  <path d="M22 4v16" />
+</svg>

icons/slack.svg

@@ -9,12 +9,12 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M14.5 10c-.83 0-1.5-.67-1.5-1.5v-5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5v5c0 .83-.67 1.5-1.5 1.5z" />
-  <path d="M20.5 10H19V8.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5-.67 1.5-1.5 1.5z" />
-  <path d="M9.5 14c.83 0 1.5.67 1.5 1.5v5c0 .83-.67 1.5-1.5 1.5S8 21.33 8 20.5v-5c0-.83.67-1.5 1.5-1.5z" />
-  <path d="M3.5 14H5v1.5c0 .83-.67 1.5-1.5 1.5S2 16.33 2 15.5 2.67 14 3.5 14z" />
-  <path d="M14 14.5c0-.83.67-1.5 1.5-1.5h5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-5c-.83 0-1.5-.67-1.5-1.5z" />
-  <path d="M15.5 19H14v1.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5-.67-1.5-1.5-1.5z" />
-  <path d="M10 9.5C10 8.67 9.33 8 8.5 8h-5C2.67 8 2 8.67 2 9.5S2.67 11 3.5 11h5c.83 0 1.5-.67 1.5-1.5z" />
-  <path d="M8.5 5H10V3.5C10 2.67 9.33 2 8.5 2S7 2.67 7 3.5 7.67 5 8.5 5z" />
+  <rect x="13" y="2" width="3" height="8" rx="1.5" />
+  <path d="M19 8.5V10h1.5A1.5 1.5 0 1019 8.5" />
+  <rect x="8" y="14" width="3" height="8" rx="1.5" />
+  <path d="M5 15.5V14H3.5A1.5 1.5 0 105 15.5" />
+  <rect x="14" y="13" width="8" height="3" rx="1.5" />
+  <path d="M15.5 19H14v1.5a1.5 1.5 0 101.5-1.5" />
+  <rect x="2" y="8" width="8" height="3" rx="1.5" />
+  <path d="M8.5 5H10V3.5A1.5 1.5 0 108.5 5" />
 </svg>

icons/smile.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/sprout.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/subscript.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="M4 5l8 8" />
+  <path d="M12 5l-8 8" />
+  <path d="M20 19h-4c0-1.5.44-2 1.5-2.5S20 15.33 20 14c0-.47-.17-.93-.48-1.29a2.11 2.11 0 00-2.62-.44c-.42.24-.74.62-.9 1.07" />
+</svg>

icons/superscript.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="M4 19l8-8" />
+  <path d="M12 19l-8-8" />
+  <path d="M20 12h-4c0-1.5.442-2 1.5-2.5S20 8.334 20 7.002c0-.472-.17-.93-.484-1.29a2.105 2.105 0 00-2.617-.436c-.42.239-.738.614-.899 1.06" />
+</svg>

icons/swiss-franc.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/table.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

icons/text-cursor-input.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="M5.3 4h.9C7.7 4 9 5.3 9 6.7m0 0v10.5c0 1.6-1.1 2.7-2.7 2.7h-1M9 6.7v10.6a2.6 2.6 0 002.7 2.7h1M9 6.7C9 5.2 10.2 4 11.8 4h.9" />
+  <path d="M13.1 7.9h6.8c1.1 0 2.1 1 2.1 2.1v4c0 1.1-.9 2.1-2.1 2.1h-6.8" />
+  <path d="M4.8 16.1h-.7C3 16.1 2 15.1 2 14v-4c0-1.1 1-2.1 2.1-2.1h.7" />
+</svg>

icons/text-cursor.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="M17 22h-1a4 4 0 01-4-4V6a4 4 0 014-4h1" />
+  <path d="M7 22h1a4 4 0 004-4v-1" />
+  <path d="M7 2h1a4 4 0 014 4v1" />
+</svg>

icons/timer-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="M10 2h4" />
+  <path d="M7.43 7.433A8 8 0 0118.566 18.57M4.582 11A8 8 0 0015 21.419" />
+  <path d="M2 2l20 20" />
+  <path d="M12 12v-2" />
+</svg>

icons/trello.svg

@@ -1,7 +1,7 @@
 <svg
+  xmlns="http://www.w3.org/2000/svg"
   width="24"
   height="24"
-  xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 24 24"
   fill="none"
   stroke="currentColor"

package.json

@@ -30,6 +30,8 @@
     "lucide-preact": "yarn workspace lucide-preact",
     "lucide-vue": "yarn workspace lucide-vue",
     "lucide-vue-next": "yarn workspace lucide-vue-next",
+    "lucide-svelte": "yarn workspace lucide-svelte",
+    "lucide-static": "yarn workspace lucide-static",
     "build:icons": "babel-node ./scripts/buildIcons.js --presets @babel/env",
     "build:outline-icons": "babel-node ./scripts/outlineSvg.js --presets @babel/env",
     "optimize": "babel-node ./scripts/optimizeSvgs.js --presets @babel/env",
@@ -60,7 +62,7 @@
     "jest": "^26.4.2",
     "lint-staged": "^10.5.3",
     "minimist": "^1.2.5",
-    "node-fetch": "^2.6.1",
+    "node-fetch": "^2.6.7",
     "prettier": "1.17.1",
     "rollup": "^2.7.3",
     "rollup-plugin-license": "^2.0.0",
@@ -78,6 +80,7 @@
     "icons/*.svg": "npx babel-node ./scripts/optimizeStagedSvgs.js --presets @babel/env"
   },
   "dependencies": {
+    "rollup-plugin-svelte": "^7.1.0",
     "svg-outline-stroke": "^1.3.1"
   }
 }

packages/lucide-angular/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-angular",
   "description": "A Lucide icon library package for Angular applications",
-  "version": "0.16.12",
+  "version": "0.16.29",
   "author": "SMAH1",
   "license": "ISC",
   "homepage": "https://lucide.dev",
@@ -44,17 +44,17 @@
     "@angular/core": "~11.2.14",
     "@angular/platform-browser": "~11.2.14",
     "@angular/platform-browser-dynamic": "~11.2.14",
-    "ng-packagr": "^11.2.4",
     "@types/jasmine": "~3.10.2",
     "@types/node": "^16.11.7",
     "codelyzer": "^6.0.2",
     "jasmine-core": "~3.10.1",
     "jasmine-spec-reporter": "~7.0.0",
-    "karma": "~6.3.8",
+    "karma": "~6.3.14",
     "karma-chrome-launcher": "~3.1.0",
     "karma-coverage": "~2.0.3",
     "karma-jasmine": "~4.0.1",
     "karma-jasmine-html-reporter": "^1.7.0",
+    "ng-packagr": "^11.2.4",
     "protractor": "~7.0.0",
     "puppeteer": "^8.0.0",
     "ts-node": "~10.4.0",

packages/lucide-figma/figma.d.ts

@@ -1,675 +0,0 @@
-// Global variable with Figma's plugin API.
-declare const figma: PluginAPI
-declare const __html__: string
-
-interface PluginAPI {
-  readonly currentPage: PageNode
-
-  // Root of the current Figma document.
-  readonly root: DocumentNode
-
-  // API for accessing viewport information.
-  readonly viewport: ViewportAPI
-
-  // call this once your plugin is finished executing.
-  closePlugin(): void
-
-  // Command that the user chose through menu when launching the plugin.
-  readonly command: string
-
-  // Finds a node by its id. If not found, returns null.
-  getNodeById(id: string): BaseNode | null
-
-  // Finds a style by its id. If not found, returns null.
-  getStyleById(id: string): BaseStyle | null
-
-  // Access browser APIs and/or show UI to the user.
-  showUI(html: string, options?: ShowUIOptions): void
-  readonly ui: UIAPI
-
-  // Lets you store persistent data on the user's local machine
-  readonly clientStorage: ClientStorageAPI
-
-  // This value is returned when a property is in a "mixed" state.
-  // In order to check if a property is in a mixed state, always
-  // compare directly to this value. I.e.
-  // `if (node.cornerRadius === figma.mixed) { ... }`
-  mixed: symbol
-
-  // Creates new nodes. Nodes will start off inserted
-  // into the current page.
-  // To move them elsewhere use `appendChild` or `insertChild`
-  createRectangle(): RectangleNode
-  createLine(): LineNode
-  createEllipse(): EllipseNode
-  createPolygon(): PolygonNode
-  createStar(): StarNode
-  createVector(): VectorNode
-  createText(): TextNode
-  createBooleanOperation(): BooleanOperationNode
-  createFrame(): FrameNode
-  createComponent(): ComponentNode
-  createPage(): PageNode
-  createSlice(): SliceNode
-
-  // Creates styles. A style's id can be assigned to
-  // node properties like textStyleId, fillStyleId, etc.
-  createPaintStyle(): PaintStyle
-  createTextStyle(): TextStyle
-  createEffectStyle(): EffectStyle
-  createGridStyle(): GridStyle
-
-  // These let you insert stuff from the team library if you have the key
-  importComponentByKeyAsync(key: string): Promise<ComponentNode>
-  importStyleByKeyAsync(key: string): Promise<BaseStyle>
-
-  // Return all fonts currently supported for use with the "fontName" property
-  listAvailableFontsAsync(): Promise<Font[]>
-
-  // You must await the promise returned here before being able to use "fontName"
-  loadFontAsync(fontName: FontName): Promise<void>
-
-  // Creates node from an SVG string.
-  createNodeFromSvg(svg: string): FrameNode
-
-  // Creates an Image object using the provided file contents.
-  createImage(data: Uint8Array): Image
-
-  // Groups every node in `nodes` under a new group.
-  group(nodes: ReadonlyArray<BaseNode>, parent: BaseNode & ChildrenMixin, index?: number): FrameNode
-
-  // Flattens every node in `nodes` into a single vector network.
-  flatten(nodes: ReadonlyArray<BaseNode>, parent?: BaseNode & ChildrenMixin, index?: number): VectorNode
-}
-
-interface ClientStorageAPI {
-  // This stores information in the browser, not on the server. It's similar to localStorage, but is
-  // asynchronous, and allows storing objects, arrays, strings, numbers, booleans, null, undefined and Uint8Arrays.
-  getAsync(key: string): Promise<any | undefined>
-  setAsync(key: string, value: any): Promise<void>
-}
-
-type ShowUIOptions = {
-  visible?: boolean, // defaults to true
-  width?: number,    // defaults to 300
-  height?: number,   // defaults to 200
-}
-
-interface UIAPI {
-  show(): void
-  hide(): void
-  resize(width: number, height: number): void
-  close(): void
-
-  // Sends a message to the iframe.
-  postMessage(pluginMessage: any): void
-
-  // Registers a callback for messages sent by the iframe.
-  onmessage: ((pluginMessage: any) => void) | undefined
-}
-
-interface ViewportAPI {
-  center: { x: number, y: number }
-
-  // 1.0 means 100% zoom, 0.5 means 50% zoom.
-  zoom: number
-
-  // Adjust the viewport such that it shows the provided nodes.
-  scrollAndZoomIntoView(nodes: ReadonlyArray<BaseNode>)
-}
-
-// manifest.json format
-interface ManifestJson {
-  // Name of the plugin.
-  name: string
-
-  // Version of the runtime that the plugin uses, e.g. '0.5.0'.
-  version: string
-
-  // The file name that contains the plugin code.
-  script: string
-
-  // The file name that contains the html code made available in script.
-  html?: string
-
-  // Shell command to be executed before the contents of the `html` and `script` files are read.
-  build?: string
-
-  // Menu items to show up in UI.
-  menu?: ManifestMenuItem[]
-}
-
-type ManifestMenuItem =
-  // Clickable menu item.
-  { name: string, command: string } |
-  // Separator
-  { separator: true } |
-  // Submenu
-  { name: string, menu: ManifestMenuItem[] }
-
-////////////////////////////////////////////////////////////////////////////////
-// Values
-
-// These are the top two rows of a 3x3 matrix. This is enough to represent
-// translation, rotation, and skew.
-type Transform = [
-  [number, number, number],
-  [number, number, number]
-]
-
-interface Vector {
-  readonly x: number
-  readonly y: number
-}
-
-interface RGB {
-  readonly r: number
-  readonly g: number
-  readonly b: number
-}
-
-interface RGBA {
-  readonly r: number
-  readonly g: number
-  readonly b: number
-  readonly a: number
-}
-
-interface FontName {
-  readonly family: string
-  readonly style: string
-}
-
-interface ArcData {
-  readonly startingAngle: number
-  readonly endingAngle: number
-  readonly innerRadius: number
-}
-
-interface ShadowEffect {
-  readonly type: "DROP_SHADOW" | "INNER_SHADOW"
-  readonly color: RGBA
-  readonly offset: Vector
-  readonly radius: number
-  readonly visible: boolean
-  readonly blendMode: BlendMode
-}
-
-interface BlurEffect {
-  readonly type: "LAYER_BLUR" | "BACKGROUND_BLUR"
-  readonly radius: number
-  readonly visible: boolean
-}
-
-type Effect = ShadowEffect | BlurEffect
-
-type ConstraintType = "MIN" | "CENTER" | "MAX" | "STRETCH" | "SCALE"
-
-interface Constraints {
-  readonly horizontal: ConstraintType
-  readonly vertical: ConstraintType
-}
-
-interface ColorStop {
-  readonly position: number
-  readonly color: RGBA
-}
-
-interface SolidPaint {
-  readonly type: "SOLID"
-  readonly color: RGB
-
-  readonly visible?: boolean
-  readonly opacity?: number
-}
-
-interface GradientPaint {
-  readonly type: "GRADIENT_LINEAR" | "GRADIENT_RADIAL" | "GRADIENT_ANGULAR" | "GRADIENT_DIAMOND"
-  readonly gradientTransform: Transform
-  readonly gradientStops: ReadonlyArray<ColorStop>
-
-  readonly visible?: boolean
-  readonly opacity?: number
-}
-
-interface ImagePaint {
-  readonly type: "IMAGE"
-  readonly scaleMode: "FILL" | "FIT" | "CROP" | "TILE"
-  readonly image: Image | null
-  readonly imageTransform?: Transform // setting for "CROP"
-  readonly scalingFactor?: number // setting for "TILE"
-
-  readonly visible?: boolean
-  readonly opacity?: number
-}
-
-type Paint = SolidPaint | GradientPaint | ImagePaint
-
-interface Guide {
-  readonly axis: "X" | "Y"
-  readonly offset: number
-}
-
-interface RowsColsLayoutGrid {
-  readonly pattern: "ROWS" | "COLUMNS"
-  readonly alignment: "MIN" | "STRETCH" | "CENTER"
-  readonly gutterSize: number
-
-  readonly count: number        // Infinity when "Auto" is set in the UI
-  readonly sectionSize?: number // Not set for alignment: "STRETCH"
-  readonly offset?: number      // Not set for alignment: "CENTER"
-
-  readonly visible?: boolean
-  readonly color?: RGBA
-}
-
-interface GridLayoutGrid {
-  readonly pattern: "GRID"
-  readonly sectionSize: number
-
-  readonly visible?: boolean
-  readonly color?: RGBA
-}
-
-type LayoutGrid = RowsColsLayoutGrid | GridLayoutGrid
-
-interface ExportSettingsImage {
-  format: "JPG" | "PNG"
-  contentsOnly?: boolean    // defaults to true
-  suffix?: string
-  constraint?: {            // defaults to unscaled ({ type: "SCALE", value: 1 })
-    type: "SCALE" | "WIDTH" | "HEIGHT"
-    value: number
-  }
-}
-
-interface ExportSettingsSVG {
-  format: "SVG"
-  contentsOnly?: boolean    // defaults to true
-  suffix?: string
-  svgOutlineText?: boolean  // defaults to true
-  svgIdAttribute?: boolean  // defaults to false
-  svgSimplifyStroke?: boolean // defaults to true
-}
-
-interface ExportSettingsPDF {
-  format: "PDF"
-  contentsOnly?: boolean    // defaults to true
-  suffix?: string
-}
-
-type ExportSettings = ExportSettingsImage | ExportSettingsSVG | ExportSettingsPDF
-
-type WindingRule = "NONZERO" | "EVENODD"
-
-interface VectorVertex {
-  readonly x: number
-  readonly y: number
-  readonly strokeCap?: StrokeCap
-  readonly strokeJoin?: StrokeJoin
-  readonly cornerRadius?: number
-  readonly handleMirroring?: HandleMirroring
-}
-
-interface VectorSegment {
-  readonly start: number
-  readonly end: number
-  readonly tangentStart?: Vector  // Defaults to { x: 0, y: 0 }
-  readonly tangentEnd?: Vector  // Defaults to { x: 0, y: 0 }
-}
-
-interface VectorRegion {
-  readonly windingRule: WindingRule
-  readonly loops: ReadonlyArray<ReadonlyArray<number>>
-}
-
-interface VectorNetwork {
-  readonly vertices: ReadonlyArray<VectorVertex>
-  readonly segments: ReadonlyArray<VectorSegment>
-  readonly regions?: ReadonlyArray<VectorRegion> // Defaults to []
-}
-
-interface VectorPath {
-  // Similar to the svg fill-rule
-  // "NONE" means an open path won't have a fill
-  readonly windingRule: WindingRule | "NONE"
-  readonly data: string
-}
-
-type VectorPaths = ReadonlyArray<VectorPath>
-
-interface NumberWithUnits {
-  readonly value: number
-  readonly units: "PIXELS" | "PERCENT"
-}
-
-type BlendMode =
-  "PASS_THROUGH" |
-  "NORMAL" |
-  "DARKEN" |
-  "MULTIPLY" |
-  "LINEAR_BURN" |
-  "COLOR_BURN" |
-  "LIGHTEN" |
-  "SCREEN" |
-  "LINEAR_DODGE" |
-  "COLOR_DODGE" |
-  "OVERLAY" |
-  "SOFT_LIGHT" |
-  "HARD_LIGHT" |
-  "DIFFERENCE" |
-  "EXCLUSION" |
-  "HUE" |
-  "SATURATION" |
-  "COLOR" |
-  "LUMINOSITY"
-
-interface Font {
-  fontName: FontName
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// Mixins
-
-interface BaseNodeMixin {
-  readonly id: string
-  readonly parent: (BaseNode & ChildrenMixin) | null
-  name: string
-  visible: boolean
-  locked: boolean
-  removed: boolean
-  toString(): string
-  remove(): void
-
-  // Attach custom data to a node. Only your plugin will be able to read this.
-  getPluginData(key: string): string
-  setPluginData(key: string, value: string): void
-
-  // Attach custom data to a node. All plugins will be able to read this.
-  // Namespace is a string that must be at least 3 alphanumeric characters, and should
-  // be a name related to your plugin. This is a mandatory argument to avoid multiple
-  // multiple plugins adding keys like "data" and colliding with each other. Other
-  // plugins will still be able to read shared plugin data as long as they know the
-  // namespace you use.
-  getSharedPluginData(namespace: string, key: string): string
-  setSharedPluginData(namespace: string, key: string, value: string): void
-}
-
-interface ChildrenMixin {
-  // Sorted back-to-front. I.e. the top-most child is last in this array.
-  readonly children: ReadonlyArray<BaseNode>
-
-  // Adds to the end of the .children array. I.e. visually on top of all other
-  // children.
-  appendChild(child: BaseNode): void
-
-  insertChild(index: number, child: BaseNode): void
-  findAll(callback?: (node: BaseNode) => boolean): ReadonlyArray<BaseNode>
-  findOne(callback: (node: BaseNode) => boolean): BaseNode | null
-}
-
-interface LayoutMixin {
-  readonly absoluteTransform: Transform
-  relativeTransform: Transform
-  x: number // The same as "relativeTransform[0][2]"
-  y: number // The same as "relativeTransform[1][2]"
-  rotation: number // The angle of the x axis of "relativeTransform" in degrees. Returns values from -180 to 180.
-
-  readonly size: Vector
-  readonly width: number // The same as "size.x"
-  readonly height: number // The same as "size.y"
-
-  // Resizes the node. If children of the node has constraints, it applies those constraints
-  // width and height must be >= 0.01
-  resize(width: number, height: number): void
-
-  // Resizes the node. Children of the node are never resized, even if those children have
-  // constraints. width and height must be >= 0.01
-  resizeWithoutConstraints(width: number, height: number): void
-
-  constraints: Constraints
-}
-
-interface BlendMixin {
-  opacity: number
-  blendMode: BlendMode
-  isMask: boolean
-  effects: ReadonlyArray<Effect>
-  effectStyleId: string
-}
-
-interface FrameMixin {
-  backgrounds: ReadonlyArray<Paint>
-  layoutGrids: ReadonlyArray<LayoutGrid>
-  clipsContent: boolean
-  guides: ReadonlyArray<Guide>
-  gridStyleId: string
-  backgroundStyleId: string
-}
-
-type StrokeCap = "NONE" | "ROUND" | "SQUARE" | "ARROW_LINES" | "ARROW_EQUILATERAL"
-type StrokeJoin = "MITER" | "BEVEL" | "ROUND"
-type HandleMirroring = "NONE" | "ANGLE" | "ANGLE_AND_LENGTH"
-
-interface GeometryMixin {
-  fills: ReadonlyArray<Paint> | symbol // This can return figma.mixed on TEXT nodes
-  strokes: ReadonlyArray<Paint>
-  strokeWeight: number
-  strokeAlign: "CENTER" | "INSIDE" | "OUTSIDE"
-  strokeCap: StrokeCap | symbol // This can return figma.mixed on VECTOR nodes if vertices have different strokeCap values
-  strokeJoin: StrokeJoin | symbol // This can return figma.mixed on VECTOR nodes if vertices have different strokeJoin values
-  dashPattern: ReadonlyArray<number>
-  fillStyleId: string | symbol // This can return figma.mixed on TEXT nodes
-  strokeStyleId: string
-}
-
-interface CornerMixin {
-  // This can return figma.mixed on VECTOR nodes if vertices have different cornerRadius values,
-  // and on RECTANGLE nodes if node.topLeftRadius etc has different values
-  cornerRadius: number | symbol
-
-  cornerSmoothing: number
-}
-
-interface ExportMixin {
-  exportSettings: ExportSettings[]
-  exportAsync(settings?: ExportSettings): Promise<Uint8Array> // Defaults to PNG format
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// Nodes
-
-interface DocumentNode extends BaseNodeMixin, ChildrenMixin {
-  readonly type: "DOCUMENT"
-  clone(): DocumentNode // Note: this always throws an error
-}
-
-interface PageNode extends BaseNodeMixin, ChildrenMixin, ExportMixin {
-  readonly type: "PAGE"
-  clone(): PageNode // cloned node starts off inserted into current page
-
-  guides: ReadonlyArray<Guide>
-  selection: ReadonlyArray<BaseNode>
-}
-
-interface FrameNode extends BaseNodeMixin, BlendMixin, ChildrenMixin, FrameMixin, LayoutMixin, ExportMixin {
-  readonly type: "FRAME" | "GROUP"
-  clone(): FrameNode // cloned node starts off inserted into current page
-}
-
-interface SliceNode extends BaseNodeMixin, LayoutMixin, ExportMixin {
-  readonly type: "SLICE"
-  clone(): SliceNode // cloned node starts off inserted into current page
-}
-
-interface RectangleNode extends BaseNodeMixin, BlendMixin, CornerMixin, GeometryMixin, LayoutMixin, ExportMixin {
-  readonly type: "RECTANGLE"
-  clone(): RectangleNode // cloned node starts off inserted into current page
-  topLeftRadius: number
-  topRightRadius: number
-  bottomLeftRadius: number
-  bottomRightRadius: number
-}
-
-interface LineNode extends BaseNodeMixin, BlendMixin, GeometryMixin, LayoutMixin, ExportMixin {
-  readonly type: "LINE"
-  clone(): LineNode // cloned node starts off inserted into current page
-}
-
-interface EllipseNode extends BaseNodeMixin, BlendMixin, CornerMixin, GeometryMixin, LayoutMixin, ExportMixin {
-  readonly type: "ELLIPSE"
-  clone(): EllipseNode // cloned node starts off inserted into current page
-  arcData: ArcData
-}
-
-interface PolygonNode extends BaseNodeMixin, BlendMixin, CornerMixin, GeometryMixin, LayoutMixin, ExportMixin {
-  readonly type: "POLYGON"
-  clone(): PolygonNode // cloned node starts off inserted into current page
-  pointCount: number
-}
-
-interface StarNode extends BaseNodeMixin, BlendMixin, CornerMixin, GeometryMixin, LayoutMixin, ExportMixin {
-  readonly type: "STAR"
-  clone(): StarNode // cloned node starts off inserted into current page
-  pointCount: number
-
-  // This is a percentage value from 0 to 1
-  innerRadius: number
-}
-
-interface VectorNode extends BaseNodeMixin, BlendMixin, CornerMixin, GeometryMixin, LayoutMixin, ExportMixin {
-  readonly type: "VECTOR"
-  clone(): VectorNode // cloned node starts off inserted into current page
-  vectorNetwork: VectorNetwork
-  vectorPaths: VectorPaths
-  handleMirroring: HandleMirroring | symbol // This can return figma.mixed if vertices have different handleMirroring values
-}
-
-interface TextNode extends BaseNodeMixin, BlendMixin, GeometryMixin, LayoutMixin, ExportMixin {
-  readonly type: "TEXT"
-  clone(): TextNode // cloned node starts off inserted into current page
-  characters: string
-  textAlignHorizontal: "LEFT" | "CENTER" | "RIGHT" | "JUSTIFIED"
-  textAlignVertical: "TOP" | "CENTER" | "BOTTOM"
-  textAutoResize: "NONE" | "WIDTH_AND_HEIGHT" | "HEIGHT"
-  paragraphIndent: number
-  paragraphSpacing: number
-  autoRename: boolean
-
-  // These properties can all return figma.mixed if the text has multiple values for the property
-  textStyleId: string | symbol
-  fontSize: number | symbol
-  fontName: FontName | symbol
-  textCase: "ORIGINAL" | "UPPER" | "LOWER" | "TITLE" | symbol
-  textDecoration: "NONE" | "UNDERLINE" | "STRIKETHROUGH" | symbol
-  letterSpacing: NumberWithUnits | symbol
-  lineHeight: NumberWithUnits | symbol
-}
-
-interface ComponentNode extends BaseNodeMixin, BlendMixin, ChildrenMixin, FrameMixin, LayoutMixin, ExportMixin {
-  readonly type: "COMPONENT"
-  clone(): ComponentNode // cloned node starts off inserted into current page
-
-  createInstance(): InstanceNode // instance starts off inserted into current page
-  description: string
-  readonly remote: boolean
-  readonly key: string // The key to use with "importComponentByKeyAsync"
-}
-
-interface InstanceNode extends BaseNodeMixin, BlendMixin, ChildrenMixin, FrameMixin, LayoutMixin, ExportMixin {
-  readonly type: "INSTANCE"
-  clone(): InstanceNode // cloned node starts off inserted into current page
-  masterComponent: ComponentNode
-}
-
-interface BooleanOperationNode extends BaseNodeMixin, BlendMixin, ChildrenMixin, CornerMixin, GeometryMixin, LayoutMixin, ExportMixin {
-  readonly type: "BOOLEAN_OPERATION"
-  clone(): BooleanOperationNode // cloned node starts off inserted into current page
-  booleanOperation: "UNION" | "INTERSECT" | "SUBTRACT" | "EXCLUDE"
-}
-
-type BaseNode =
-  DocumentNode |
-  PageNode |
-  SliceNode |
-  FrameNode |
-  ComponentNode |
-  InstanceNode |
-  BooleanOperationNode |
-  VectorNode |
-  StarNode |
-  LineNode |
-  EllipseNode |
-  PolygonNode |
-  RectangleNode |
-  TextNode
-
-type NodeType =
-  "DOCUMENT" |
-  "PAGE" |
-  "SLICE" |
-  "FRAME" |
-  "GROUP" |
-  "COMPONENT" |
-  "INSTANCE" |
-  "BOOLEAN_OPERATION" |
-  "VECTOR" |
-  "STAR" |
-  "LINE" |
-  "ELLIPSE" |
-  "POLYGON" |
-  "RECTANGLE" |
-  "TEXT"
-
-////////////////////////////////////////////////////////////////////////////////
-// Styles
-type StyleType = "PAINT" | "TEXT" | "EFFECT" | "GRID"
-
-interface BaseStyle {
-  // The string to uniquely identify a style by
-  readonly id: string
-  readonly type: StyleType
-  name: string // Note: setting this also sets "autoRename" to false on TextNodes
-  description: string
-  remote: boolean
-  readonly key: string // The key to use with "importStyleByKeyAsync"
-  remove(): void
-}
-
-interface PaintStyle extends BaseStyle {
-  type: "PAINT"
-  paints: ReadonlyArray<Paint>
-}
-
-interface TextStyle extends BaseStyle {
-  type: "TEXT"
-  fontSize: number
-  textDecoration: "NONE" | "UNDERLINE" | "STRIKETHROUGH"
-  fontName: FontName
-  letterSpacing: NumberWithUnits
-  lineHeight: NumberWithUnits
-  paragraphIndent: number
-  paragraphSpacing: number
-  textCase: "ORIGINAL" | "UPPER" | "LOWER" | "TITLE"
-}
-
-interface EffectStyle extends BaseStyle {
-  type: "EFFECT"
-  effects: ReadonlyArray<Paint>
-}
-
-interface GridStyle extends BaseStyle {
-  type: "GRID"
-  layoutGrids: ReadonlyArray<LayoutGrid>
-}
-
-////////////////////////////////////////////////////////////////////////////////
-// Other
-
-interface Image {
-  // Returns a unique hash for the image
-  readonly hash: string
-
-  // The contents of the image file
-  getBytesAsync(): Promise<Uint8Array>
-}

packages/lucide-figma/manifest.json

@@ -2,7 +2,16 @@
   "name": "Lucide Icons",
   "id": "939567362549682242",
   "api": "1.0.0",
-  "ui": "build/ui.html",
-  "main": "build/main.js",
-  "editorType": ["figma"]
+  "editorType": ["figma"],
+  "main": "dist/assets/main.js",
+  "ui": {
+    "interface": "dist/src/interface/interface.html",
+    "worker": "dist/src/worker/worker.html"
+  },
+  "parameterOnly": false,
+  "parameters": [{
+    "name": "Icon",
+    "key": "icon-name",
+    "description": "Enter the name of the icon you want to insert."
+  }]
 }

packages/lucide-figma/package.json

@@ -1,27 +1,30 @@
 {
   "name": "lucide-figma",
   "version": "0.15.11",
-  "license": "ISC",
   "private": true,
-  "main": "build/ui.js",
+  "license": "ISC",
+  "main": "src/main.js",
   "scripts": {
-    "build": "webpack --mode=production",
-    "watch": "webpack --mode=development --watch"
+    "dev": "vite",
+    "build": "tsc && rm -rf dist && yarn build:main && yarn build:worker && yarn build:interface",
+    "build:main": "INPUT=main vite build",
+    "build:worker": "INPUT=worker vite build",
+    "build:interface": "INPUT=interface vite build",
+    "serve": "vite preview"
   },
   "dependencies": {
     "@emotion/core": "^10.0.14",
-    "@types/react": "^16.8.23",
-    "@types/react-dom": "^16.8.4",
-    "css-loader": "^3.0.0",
-    "html-webpack-inline-source-plugin": "^0.0.10",
-    "html-webpack-plugin": "^3.2.0",
-    "lucide-react": "0.16.0",
-    "react": "^16.8.6",
-    "react-dom": "^16.8.6",
-    "style-loader": "^0.23.1",
-    "ts-loader": "^6.0.4",
-    "typescript": "^3.5.2",
-    "webpack": "^4.35.2",
-    "webpack-cli": "^3.3.5"
+    "minimist": "^1.2.5",
+    "react": "^17.0.0",
+    "react-dom": "^17.0.0"
+  },
+  "devDependencies": {
+    "@figma/plugin-typings": "^1.36.0",
+    "@types/react": "^17.0.0",
+    "@types/react-dom": "^17.0.0",
+    "@vitejs/plugin-react": "^1.0.0",
+    "typescript": "^4.3.2",
+    "vite": "^2.6.4",
+    "vite-plugin-singlefile": "^0.5.1"
   }
 }