Compare commits

...

16 Commits

Author SHA1 Message Date
Eric Fennis
b75aee4df3 Add Pilcrow Icon (paragraph) (#884)
* add pilcrow icon
* add tags
2022-11-15 10:34:25 +01:00
Ekow Baah-Nyarkoh
0c93e7bcb4 update documentation with correct import for all icons (#875) 2022-11-13 21:59:29 +01:00
Lucide Bot
538dad2d30 📦 Bump lucide package versions to 0.100.0 2022-11-10 21:58:48 +00:00
Karsa
797fa5c431 Update baby.svg (#881) 2022-11-10 22:52:27 +01:00
Wojciech Maj
8ccbb8f2e3 Update lucide-react on marketing site (#848) 2022-11-08 15:43:41 +01:00
Badraxas
b77ce99363 Adds devices icon (#871)
* Adding devices icon

* Update icons/devices.svg

* rename devices into monitor-smartphone

Co-authored-by: Karsa <contact@karsa.org>
2022-11-08 15:33:45 +01:00
Sean van Zuidam
c7f73611ca Add Magento 2 Hyva package to docs (#857)
* ADD: Hyva to 3de party section

* ADD: Hyva to readme

* IMP: description
2022-11-08 08:08:26 +01:00
Eric Fennis
2a1178b8a3 Introduce Docker Image for font building (#870)
* Add dockerfile

* Make the dockerfile work

* try docker container for font building

* remove workflow dep

* add docker compose file

* test docker image

* update build font flow

* update to v3

* cleanup

* add filter options for installs

* test

* revert filter on install

* optimize font building

* Rename workflow

* test and compare workflows

* test workflow

* test

* try with filter

* test old script github actions

* Fix old script

* this works?

* test script

* finialize font script

* remove workspace packages

* add pnpm-lock.yaml in workflows
2022-11-08 08:07:32 +01:00
Louis Bailleau
55ae908018 Update all packages dependencies in project root (#863)
* Update `svgo` and `svgson` version and fix some tests

* Update eslint-related packages and fix all linter errors

* Update all rollup-related packages version

* Update all rollup-related packages (part 2)

* Update the rest of package which need to be updated

* Fix unwanted comment

* Fix unwanted comment (again)
2022-11-07 22:29:19 +01:00
Ekow Baah-Nyarkoh
1cdcfd6403 Publish angular dist folder instead of project folder (#872)
* publish angular dist folder instead of project folder

* publish angular dist folder instead of project folder
2022-11-03 09:17:54 +01:00
Lucide Bot
810cd84876 📦 Bump lucide package versions to 0.98.0 2022-11-02 20:09:33 +00:00
Karsa
ca471899c1 Added dumbbell icon (#862)
Co-authored-by: Karsa <karsa@karsa.org>
2022-11-02 21:03:06 +01:00
Eric Fennis
b40edf1f3c Improve Loading in figma plugin (#866)
* Add skeleton

* improve icon loading
2022-11-02 21:01:34 +01:00
Ekow Baah-Nyarkoh
32c339cabd downgrade puppeteer to make angular build work (#867) 2022-11-02 21:01:10 +01:00
Karsa
3529cd3f4d Adds various food and food intolerance icons (#861)
* Food intolerance + allergy icons

* Fixes bean outline

* Update dna.svg

* Update bean.svg

Co-authored-by: Karsa <karsa@karsa.org>
2022-11-02 16:09:23 +01:00
locness3
a4d568f26e Improve "Why choose Lucide over Feather" section in README.md (#868)
Authored by: @locness3
- Updated the obsolete number of added icons (congratulations to everyone btw, this is impressive).
- Added mention official packages.
- Expanded on "Active community".
2022-11-02 16:01:54 +01:00
96 changed files with 34349 additions and 1598 deletions

View File

@@ -3,3 +3,4 @@ build
coverage coverage
lib lib
tests tests
node_modules

View File

@@ -1,7 +1,7 @@
module.exports = { module.exports = {
env: { env: {
browser: true, browser: true,
node: true node: true,
}, },
extends: ['airbnb-base', 'prettier'], extends: ['airbnb-base', 'prettier'],
plugins: ['import', 'prettier'], plugins: ['import', 'prettier'],
@@ -14,12 +14,26 @@ module.exports = {
'error', 'error',
{ {
singleQuote: true, singleQuote: true,
trailingComma: 'all' trailingComma: 'all',
} },
] ],
'import/no-extraneous-dependencies': [
'error',
{ devDependencies: ['**/*.test.js', '**/*.spec.js', './scripts/**'] },
],
'import/extensions': [
'error',
{
pattern: {
mjs: 'always',
json: 'always',
},
},
],
}, },
parserOptions: { parserOptions: {
tsconfigRootDir: __dirname, tsconfigRootDir: __dirname,
project: ['./site/tsconfig.json', './packages/*/tsconfig.json'], project: ['./site/tsconfig.json', './packages/*/tsconfig.json'],
ecmaVersion: 2020,
}, },
}; };

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-angular/** - packages/lucide-angular/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-angular/** - packages/lucide-angular/**
- pnpm-lock.yaml
jobs: jobs:
lucide-angular: lucide-angular:

59
.github/workflows/lucide-font.yml vendored Normal file
View File

@@ -0,0 +1,59 @@
name: Lucide font checks
on:
pull_request:
paths:
- icons/**
- pnpm-lock.yaml
push:
paths:
- icons/**
- pnpm-lock.yaml
jobs:
lucide-font:
runs-on: ubuntu-latest
container: ericfennis/lucide-font:latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3.4.1
with:
node-version: 16
- uses: pnpm/action-setup@v2.0.1
name: Install pnpm
id: pnpm-install
with:
version: 7
run_install: false
- name: Get pnpm store directory
id: pnpm-cache
run: |
echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
- uses: actions/cache@v3
name: Setup pnpm cache
with:
path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
key: ${{ runner.os }}-lucide-font-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-lucide-font-pnpm-store-
- name: Install dependencies
run: pnpm install --filter outline-svg
- name: Outline svg Icons
run: pnpm build:outline-icons
- name: Create directory
run: mkdir lucide-font
- name: Build font
run: fontcustom compile "./outlined" -h -n "lucide" -o ./lucide-font -F
- name: "Upload to Artifacts"
uses: actions/upload-artifact@v1
with:
name: lucide-font
path: lucide-font

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-preact/** - packages/lucide-preact/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-preact/** - packages/lucide-preact/**
- pnpm-lock.yaml
jobs: jobs:
lucide-preact: lucide-preact:

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-react-native/** - packages/lucide-react-native/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-react-native/** - packages/lucide-react-native/**
- pnpm-lock.yaml
jobs: jobs:
lucide-react-native: lucide-react-native:

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-react/** - packages/lucide-react/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-react/** - packages/lucide-react/**
- pnpm-lock.yaml
jobs: jobs:
lucide-react: lucide-react:

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-solid/** - packages/lucide-solid/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-solid/** - packages/lucide-solid/**
- pnpm-lock.yaml
jobs: jobs:
lucide-solid: lucide-solid:

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-static/** - packages/lucide-static/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-static/** - packages/lucide-static/**
- pnpm-lock.yaml
jobs: jobs:
lucide-static: lucide-static:

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-svelte/** - packages/lucide-svelte/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-svelte/** - packages/lucide-svelte/**
- pnpm-lock.yaml
jobs: jobs:
lucide-svelte: lucide-svelte:

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-vue-next/** - packages/lucide-vue-next/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-vue-next/** - packages/lucide-vue-next/**
- pnpm-lock.yaml
jobs: jobs:
lucide-vue-next: lucide-vue-next:

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide-vue/** - packages/lucide-vue/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide-vue/** - packages/lucide-vue/**
- pnpm-lock.yaml
jobs: jobs:
lucide-vue: lucide-vue:

View File

@@ -4,9 +4,11 @@ on:
pull_request: pull_request:
paths: paths:
- packages/lucide/** - packages/lucide/**
- pnpm-lock.yaml
push: push:
paths: paths:
- packages/lucide/** - packages/lucide/**
- pnpm-lock.yaml
jobs: jobs:
lucide: lucide:

View File

@@ -348,7 +348,7 @@ jobs:
run: pnpm --filter lucide-angular test run: pnpm --filter lucide-angular test
- name: Publish - name: Publish
run: pnpm --filter lucide-angular publish dist --no-git-checks --ignore-scripts run: pnpm --filter lucide-angular publish --no-git-checks --ignore-scripts
- name: Upload package.json - name: Upload package.json
uses: actions/upload-artifact@v2 uses: actions/upload-artifact@v2
@@ -581,9 +581,10 @@ jobs:
if: github.repository == 'lucide-icons/lucide' if: github.repository == 'lucide-icons/lucide'
runs-on: ubuntu-latest runs-on: ubuntu-latest
needs: pre-build needs: pre-build
container: ericfennis/lucide-font:latest
steps: steps:
- uses: actions/checkout@v3 - uses: actions/checkout@v3
- uses: actions/setup-node@v3 - uses: actions/setup-node@v3.4.1
with: with:
node-version: 16 node-version: 16
@@ -607,39 +608,19 @@ jobs:
restore-keys: | restore-keys: |
${{ runner.os }}-pnpm-store- ${{ runner.os }}-pnpm-store-
- name: Install FontForge
run: sudo apt-get install zlib1g-dev fontforge
- 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
make
sudo mv sfnt2woff-zopfli /usr/local/bin/sfnt2woff
- name: Clone woff2
run: git clone --recursive https://github.com/google/woff2.git
- name: Install woff2
run: |
cd woff2
sudo make clean all
sudo mv woff2_compress /usr/local/bin/ && sudo mv woff2_decompress /usr/local/bin/
- name: Install Font Custom dependency
run: sudo gem install fontcustom
- name: Install dependencies - name: Install dependencies
run: pnpm install run: pnpm install --filter outline-svg
- name: Build Icon Font - name: Outline svg Icons
run: | run: pnpm build:outline-icons
mkdir lucide-font
pnpm build:outline-icons --outputDir=converted_icons && fontcustom compile "./converted_icons" -h -n "lucide" -o ./lucide-font -F
- name: 'Upload to Artifacts' - name: Create directory
run: mkdir lucide-font
- name: Build font
run: fontcustom compile "./outlined" -h -n "lucide" -o ./lucide-font -F
- name: "Upload to Artifacts"
uses: actions/upload-artifact@v1 uses: actions/upload-artifact@v1
with: with:
name: lucide-font name: lucide-font

1
.gitignore vendored
View File

@@ -12,6 +12,7 @@ stash
coverage coverage
stats stats
*.log *.log
outlined
packages/**/src/icons/*.js packages/**/src/icons/*.js
packages/**/src/icons/*.ts packages/**/src/icons/*.ts
packages/**/LICENSE packages/**/LICENSE

View File

@@ -17,9 +17,10 @@ Lucide is trying to expand the icon set as much as possible while staying faithf
### Why choose Lucide over Feather Icons ### Why choose Lucide over Feather Icons
- Lucide already expanded the icon set by 130+ in less than a year, so more icons to work with. - More icons to work with: Lucide already has hundreds of icons more than Feather does.
- Official librairies and integrations with popular frameworks and design tools.
- Well maintained code base. - Well maintained code base.
- Active community. - Active community, regularly growing and improving the set.
## Table of Contents ## Table of Contents
@@ -37,6 +38,7 @@ Lucide is trying to expand the icon set as much as possible while staying faithf
- [Flutter](#flutter) - [Flutter](#flutter)
- [Svelte](#svelte) - [Svelte](#svelte)
- [Solid](#solid) - [Solid](#solid)
- [Hyva](#hyva)
- [Contributing](#contributing) - [Contributing](#contributing)
- [Community](#community) - [Community](#community)
- [License](#license) - [License](#license)
@@ -239,6 +241,16 @@ npm install lucide-solid
For more details, see the [documentation](https://github.com/lucide-icons/lucide/tree/main/packages/lucide-solid#lucide-solid). For more details, see the [documentation](https://github.com/lucide-icons/lucide/tree/main/packages/lucide-solid#lucide-solid).
### Hyva
Implementation of Lucide icon's using Hyvä's svg php viewmodal to render icons for Magento 2 Hyva theme based projects.
```sh
composer require siteation/magento2-hyva-icons-lucide
```
For more details, see the [documentation](https://github.com/Siteation/magento2-hyva-icons-lucide/blob/main/README.md).
## Contributing ## Contributing
For more info on how to contribute please see the [contribution guidelines](https://github.com/lucide-icons/lucide/blob/main/CONTRIBUTING.md). For more info on how to contribute please see the [contribution guidelines](https://github.com/lucide-icons/lucide/blob/main/CONTRIBUTING.md).

View File

@@ -136,7 +136,7 @@ In `Method 2`: import all icons in `app.module.ts` by:
```js ```js
import { icons } from 'lucide-angular/icons'; import { icons } from 'lucide-angular';
LucideAngularModule.pick(icons) LucideAngularModule.pick(icons)

View File

@@ -9,8 +9,8 @@
stroke-linecap="round" stroke-linecap="round"
stroke-linejoin="round" stroke-linejoin="round"
> >
<path d="M9 12h0" /> <path d="M9 12h0.01" />
<path d="M15 12h0" /> <path d="M15 12h0.01" />
<path d="M10 16c.5.3 1.2.5 2 .5s1.5-.2 2-.5" /> <path d="M10 16c.5.3 1.2.5 2 .5s1.5-.2 2-.5" />
<path d="M19 6.3a9 9 0 0 1 1.8 3.9 2 2 0 0 1 0 3.6 9 9 0 0 1-17.6 0 2 2 0 0 1 0-3.6A9 9 0 0 1 12 3c2 0 3.5 1.1 3.5 2.5s-.9 2.5-2 2.5c-.8 0-1.5-.4-1.5-1" /> <path d="M19 6.3a9 9 0 0 1 1.8 3.9 2 2 0 0 1 0 3.6 9 9 0 0 1-17.6 0 2 2 0 0 1 0-3.6A9 9 0 0 1 12 3c2 0 3.5 1.1 3.5 2.5s-.9 2.5-2 2.5c-.8 0-1.5-.4-1.5-1" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 463 B

After

Width:  |  Height:  |  Size: 469 B

16
icons/bean-off.svg Normal file
View File

@@ -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 9c-.64.64-1.521.954-2.402 1.165A6 6 0 0 0 8 22a13.96 13.96 0 0 0 9.9-4.1" />
<path d="M10.75 5.093A6 6 0 0 1 22 8c0 2.411-.61 4.68-1.683 6.66" />
<path d="M5.341 10.62a4 4 0 0 0 6.487 1.208M10.62 5.341a4.015 4.015 0 0 1 2.039 2.04" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 502 B

14
icons/bean.svg Normal file
View File

@@ -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="M10.165 6.598C9.954 7.478 9.64 8.36 9 9c-.64.64-1.521.954-2.402 1.165A6 6 0 0 0 8 22c7.732 0 14-6.268 14-14a6 6 0 0 0-11.835-1.402Z" />
<path d="M5.341 10.62A4 4 0 1 0 10.62 5.34" />
</svg>

After

Width:  |  Height:  |  Size: 404 B

20
icons/candy-off.svg Normal file
View File

@@ -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="m8.5 8.5-1 1a4.95 4.95 0 0 0 7 7l1-1" />
<path d="M11.843 6.187A4.947 4.947 0 0 1 16.5 7.5a4.947 4.947 0 0 1 1.313 4.657" />
<path d="M14 16.5V14" />
<path d="M14 6.5v1.843" />
<path d="M10 10v7.5" />
<path d="m16 7 1-5 1.367.683A3 3 0 0 0 19.708 3H21v1.292a3 3 0 0 0 .317 1.341L22 7l-5 1" />
<path d="m8 17-1 5-1.367-.683A3 3 0 0 0 4.292 21H3v-1.292a3 3 0 0 0-.317-1.341L2 17l5-1" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 657 B

17
icons/candy.svg Normal file
View File

@@ -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="m9.5 7.5-2 2a4.95 4.95 0 1 0 7 7l2-2a4.95 4.95 0 1 0-7-7Z" />
<path d="M14 6.5v10" />
<path d="M10 7.5v10" />
<path d="m16 7 1-5 1.37.68A3 3 0 0 0 19.7 3H21v1.3c0 .46.1.92.32 1.33L22 7l-5 1" />
<path d="m8 17-1 5-1.37-.68A3 3 0 0 0 4.3 21H3v-1.3a3 3 0 0 0-.32-1.33L2 17l5-1" />
</svg>

After

Width:  |  Height:  |  Size: 505 B

23
icons/dna-off.svg Normal file
View File

@@ -0,0 +1,23 @@
<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 2c-1.35 1.5-2.092 3-2.5 4.5M9 22c1.35-1.5 2.092-3 2.5-4.5" />
<path d="M2 15c3.333-3 6.667-3 10-3m10-3c-1.5 1.35-3 2.092-4.5 2.5" />
<path d="m17 6-2.5-2.5" />
<path d="m14 8-1.5-1.5" />
<path d="m7 18 2.5 2.5" />
<path d="m3.5 14.5.5.5" />
<path d="m20 9 .5.5" />
<path d="m6.5 12.5 1 1" />
<path d="m16.5 10.5 1 1" />
<path d="m10 16 1.5 1.5" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 630 B

23
icons/dna.svg Normal file
View File

@@ -0,0 +1,23 @@
<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 15c6.667-6 13.333 0 20-6" />
<path d="M9 22c1.798-1.998 2.518-3.995 2.807-5.993" />
<path d="M15 2c-1.798 1.998-2.518 3.995-2.807 5.993" />
<path d="m17 6-2.5-2.5" />
<path d="m14 8-1-1" />
<path d="m7 18 2.5 2.5" />
<path d="m3.5 14.5.5.5" />
<path d="m20 9 .5.5" />
<path d="m6.5 12.5 1 1" />
<path d="m16.5 10.5 1 1" />
<path d="m10 16 1.5 1.5" />
</svg>

After

Width:  |  Height:  |  Size: 593 B

19
icons/dumbbell.svg Normal file
View File

@@ -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="m6.5 6.5 11 11" />
<path d="m21 21-1-1" />
<path d="m3 3 1 1" />
<path d="m18 22 4-4" />
<path d="m2 6 4-4" />
<path d="m3 10 7-7" />
<path d="m14 21 7-7" />
</svg>

After

Width:  |  Height:  |  Size: 389 B

15
icons/egg-off.svg Normal file
View File

@@ -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="M6.399 6.399C5.362 8.157 4.65 10.189 4.5 12c-.37 4.43 1.27 9.95 7.5 10 3.256-.026 5.259-1.547 6.375-3.625" />
<path d="M19.532 13.875A14.07 14.07 0 0 0 19.5 12c-.36-4.34-3.95-9.96-7.5-10-1.04.012-2.082.502-3.046 1.297" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 484 B

View File

@@ -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="M10 10 4.72 20.55a1 1 0 0 0 .9 1.45h12.76a1 1 0 0 0 .9-1.45l-1.272-2.542" />
<path d="M10 2v2.343" />
<path d="M14 2v6.343" />
<path d="M8.5 2h7" />
<path d="M7 16h9" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 438 B

View File

@@ -9,7 +9,7 @@
stroke-linecap="round" stroke-linecap="round"
stroke-linejoin="round" stroke-linejoin="round"
> >
<path d="M10 2v8L4.72 20.55a1 1 0 0 0 .9 1.45h12.76a1 1 0 0 0 .9-1.45L14 10V2" /> <path d="M10 2v7.527a2 2 0 0 1-.211.896L4.72 20.55a1 1 0 0 0 .9 1.45h12.76a1 1 0 0 0 .9-1.45l-5.069-10.127A2 2 0 0 1 14 9.527V2" />
<path d="M8.5 2h7" /> <path d="M8.5 2h7" />
<path d="M7 16h10" /> <path d="M7 16h10" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 340 B

After

Width:  |  Height:  |  Size: 390 B

20
icons/hop-off.svg Normal file
View File

@@ -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="M17.5 5.5C19 7 20.5 9 21 11c-1.323.265-2.646.39-4.118.226" />
<path d="M5.5 17.5C7 19 9 20.5 11 21c.5-2.5.5-5-1-8.5" />
<path d="M17.5 17.5c-2.5 0-4 0-6-1" />
<path d="M20 11.5c1 1.5 2 3.5 2 4.5" />
<path d="M11.5 20c1.5 1 3.5 2 4.5 2 .5-1.5 0-3-.5-4.5" />
<path d="M22 22c-2 0-3.5-.5-5.5-1.5" />
<path d="M4.783 4.782C1.073 8.492 1 14.5 5 18c1-1 2-4.5 1.5-6.5 1.5 1 4 1 5.5.5M8.227 2.57C11.578 1.335 15.453 2.089 18 5c-.88.88-3.7 1.761-5.726 1.618" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 725 B

20
icons/hop.svg Normal file
View File

@@ -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="M17.5 5.5C19 7 20.5 9 21 11c-2.5.5-5 .5-8.5-1" />
<path d="M5.5 17.5C7 19 9 20.5 11 21c.5-2.5.5-5-1-8.5" />
<path d="M16.5 11.5c1 2 1 3.5 1 6-2.5 0-4 0-6-1" />
<path d="M20 11.5c1 1.5 2 3.5 2 4.5-1.5.5-3 0-4.5-.5" />
<path d="M11.5 20c1.5 1 3.5 2 4.5 2 .5-1.5 0-3-.5-4.5" />
<path d="M20.5 16.5c1 2 1.5 3.5 1.5 5.5-2 0-3.5-.5-5.5-1.5" />
<path d="M4.783 4.782C8.493 1.072 14.5 1 18 5c-1 1-4.5 2-6.5 1.5 1 1.5 1 4 .5 5.5-1.5.5-4 .5-5.5-.5C7 13.5 6 17 5 18c-4-3.5-3.927-9.508-.217-13.218Z" />
<path d="M4.5 4.5 3 3c-.184-.185-.184-.816 0-1" />
</svg>

After

Width:  |  Height:  |  Size: 775 B

16
icons/milk-off.svg Normal file
View File

@@ -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="M8 2h8" />
<path d="M9 2v1.343M15 2v2.789a4 4 0 0 0 .672 2.219l.656.984a4 4 0 0 1 .672 2.22v1.131M7.8 7.8l-.128.192A4 4 0 0 0 7 10.212V20a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2v-3" />
<path d="M7 15a6.47 6.47 0 0 1 5 0 6.472 6.472 0 0 0 3.435.435" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 506 B

15
icons/milk.svg Normal file
View File

@@ -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="M8 2h8" />
<path d="M9 2v2.789a4 4 0 0 1-.672 2.219l-.656.984A4 4 0 0 0 7 10.212V20a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2v-9.789a4 4 0 0 0-.672-2.219l-.656-.984A4 4 0 0 1 15 4.788V2" />
<path d="M7 15a6.472 6.472 0 0 1 5 0 6.47 6.47 0 0 0 5 0" />
</svg>

After

Width:  |  Height:  |  Size: 462 B

View File

@@ -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="M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8" />
<path d="M10 19v-3.96 3.15" />
<path d="M7 19h5" />
<rect x="16" y="12" width="6" height="10" rx="2" />
</svg>

After

Width:  |  Height:  |  Size: 389 B

17
icons/nut-off.svg Normal file
View File

@@ -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="M12 4V2" />
<path d="M5 10v4a7.004 7.004 0 0 0 5.277 6.787c.412.104.802.292 1.102.592L12 22l.621-.621c.3-.3.69-.488 1.102-.592a7.01 7.01 0 0 0 4.125-2.939" />
<path d="M19 10v3.343" />
<path d="M12 12c-1.349-.573-1.905-1.005-2.5-2-.546.902-1.048 1.353-2.5 2-1.018-.644-1.46-1.08-2-2-1.028.71-1.69.918-3 1 1.081-1.048 1.757-2.03 2-3 .194-.776.84-1.551 1.79-2.21m11.654 5.997c.887-.457 1.28-.891 1.556-1.787 1.032.916 1.683 1.157 3 1-1.297-1.036-1.758-2.03-2-3-.5-2-4-4-8-4-.74 0-1.461.068-2.15.192" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 767 B

15
icons/nut.svg Normal file
View File

@@ -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 4V2" />
<path d="M5 10v4a7.004 7.004 0 0 0 5.277 6.787c.412.104.802.292 1.102.592L12 22l.621-.621c.3-.3.69-.488 1.102-.592A7.003 7.003 0 0 0 19 14v-4" />
<path d="M12 4C8 4 4.5 6 4 8c-.243.97-.919 1.952-2 3 1.31-.082 1.972-.29 3-1 .54.92.982 1.356 2 2 1.452-.647 1.954-1.098 2.5-2 .595.995 1.151 1.427 2.5 2 1.31-.621 1.862-1.058 2.5-2 .629.977 1.162 1.423 2.5 2 1.209-.548 1.68-.967 2-2 1.032.916 1.683 1.157 3 1-1.297-1.036-1.758-2.03-2-3-.5-2-4-4-8-4Z" />
</svg>

After

Width:  |  Height:  |  Size: 686 B

15
icons/pilcrow.svg Normal file
View File

@@ -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="M13 4v16" />
<path d="M17 4v16" />
<path d="M19 4H9.5a4.5 4.5 0 0 0 0 9H13" />
</svg>

After

Width:  |  Height:  |  Size: 302 B

15
icons/vegan.svg Normal file
View File

@@ -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 2c4.056 3.007 9.232 9.337 10 20 .897-6.818 1.5-9.5 4-14" />
<path d="M20.375 6.533A9.953 9.953 0 0 1 22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2c2.003 0 3.869.589 5.433 1.603" />
<path d="M17.104 4c-1.002 1.274-1.146 2.586-1.1 4 1.9-.1 3.003-.201 4.3-1.4 1.406-1.3 1.6-2.3 1.7-4.6-2.7.1-3.623.375-4.9 2Z" />
</svg>

After

Width:  |  Height:  |  Size: 546 B

22
icons/wheat-off.svg Normal file
View File

@@ -0,0 +1,22 @@
<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 22 10-10" />
<path d="m16 8-1.17 1.17" />
<path d="M3.47 12.53 5 11l1.53 1.53a3.5 3.5 0 0 1 0 4.94L5 19l-1.53-1.53a3.5 3.5 0 0 1 0-4.94Z" />
<path d="m8 8-.53.53a3.5 3.5 0 0 0 0 4.94L9 15l1.53-1.53c.55-.55.88-1.25.98-1.97" />
<path d="M10.91 5.26c.15-.26.34-.51.56-.73L13 3l1.53 1.53a3.5 3.5 0 0 1 .28 4.62" />
<path d="M20 2h2v2a4 4 0 0 1-4 4h-2V6a4 4 0 0 1 4-4Z" />
<path d="M11.47 17.47 13 19l-1.53 1.53a3.5 3.5 0 0 1-4.94 0L5 19l1.53-1.53a3.5 3.5 0 0 1 4.94 0Z" />
<path d="m16 16-.53.53a3.5 3.5 0 0 1-4.94 0L9 15l1.53-1.53a3.49 3.49 0 0 1 1.97-.98" />
<path d="M18.74 13.09c.26-.15.51-.34.73-.56L21 11l-1.53-1.53a3.5 3.5 0 0 0-4.62-.28" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 924 B

20
icons/wheat.svg Normal file
View File

@@ -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="M2 22 16 8" />
<path d="M3.47 12.53 5 11l1.53 1.53a3.5 3.5 0 0 1 0 4.94L5 19l-1.53-1.53a3.5 3.5 0 0 1 0-4.94Z" />
<path d="M7.47 8.53 9 7l1.53 1.53a3.5 3.5 0 0 1 0 4.94L9 15l-1.53-1.53a3.5 3.5 0 0 1 0-4.94Z" />
<path d="M11.47 4.53 13 3l1.53 1.53a3.5 3.5 0 0 1 0 4.94L13 11l-1.53-1.53a3.5 3.5 0 0 1 0-4.94Z" />
<path d="M20 2h2v2a4 4 0 0 1-4 4h-2V6a4 4 0 0 1 4-4Z" />
<path d="M11.47 17.47 13 19l-1.53 1.53a3.5 3.5 0 0 1-4.94 0L5 19l1.53-1.53a3.5 3.5 0 0 1 4.94 0Z" />
<path d="M15.47 13.47 17 15l-1.53 1.53a3.5 3.5 0 0 1-4.94 0L9 15l1.53-1.53a3.5 3.5 0 0 1 4.94 0Z" />
<path d="M19.47 9.47 21 11l-1.53 1.53a3.5 3.5 0 0 1-4.94 0L13 11l1.53-1.53a3.5 3.5 0 0 1 4.94 0Z" />
</svg>

After

Width:  |  Height:  |  Size: 904 B

17
icons/wine-off.svg Normal file
View File

@@ -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="M8 22h8" />
<path d="M7 10h3m7 0h-1.343" />
<path d="M12 15v7" />
<path d="M7.307 7.307A12.33 12.33 0 0 0 7 10a5 5 0 0 0 7.391 4.391M8.638 2.981C8.75 2.668 8.872 2.34 9 2h6c1.5 4 2 6 2 8 0 .407-.05.809-.145 1.198" />
<line x1="2" y1="2" x2="22" y2="22" />
</svg>

After

Width:  |  Height:  |  Size: 483 B

View File

@@ -13,48 +13,48 @@
"lucide-svelte": "pnpm --filter lucide-svelte", "lucide-svelte": "pnpm --filter lucide-svelte",
"lucide-static": "pnpm --filter lucide-static", "lucide-static": "pnpm --filter lucide-static",
"build:icons": "node ./scripts/buildIcons.mjs --templateSrc ./packages/lucide/scripts/exportTemplate.mjs", "build:icons": "node ./scripts/buildIcons.mjs --templateSrc ./packages/lucide/scripts/exportTemplate.mjs",
"build:outline-icons": "node ./scripts/outlineSvg.mjs", "build:outline-icons": "pnpm --filter outline-svg start",
"generate:supersprite": "node ./scripts/generateSuperSVG.mjs", "generate:supersprite": "node ./scripts/generateSuperSVG.mjs",
"optimize": "node ./scripts/optimizeSvgs.mjs", "optimize": "node ./scripts/optimizeSvgs.mjs",
"addtags": "node ./scripts/addMissingKeysToTags.mjs", "addtags": "node ./scripts/addMissingKeysToTags.mjs",
"generate:changelog": "node ./scripts/generateChangelog.mjs", "generate:changelog": "node ./scripts/generateChangelog.mjs",
"postinstall": "husky install" "postinstall": "husky install",
"lint": "eslint --ext .ts,.js,.mjs ./{packages/lucide,scripts}"
}, },
"devDependencies": { "devDependencies": {
"@atomico/rollup-plugin-sizes": "^1.1.4", "@atomico/rollup-plugin-sizes": "^1.1.4",
"@babel/cli": "^7.18.9", "@babel/cli": "^7.19.3",
"@babel/core": "^7.18.9", "@babel/core": "^7.19.6",
"@babel/node": "^7.18.9", "@babel/node": "^7.20.0",
"@babel/plugin-transform-runtime": "^7.18.9", "@babel/plugin-transform-runtime": "^7.19.6",
"@babel/preset-env": "^7.18.9", "@babel/preset-env": "^7.19.4",
"@rollup/plugin-babel": "^5.3.1", "@rollup/plugin-babel": "^6.0.2",
"@rollup/plugin-commonjs": "^17.1.0", "@rollup/plugin-commonjs": "^23.0.2",
"@rollup/plugin-node-resolve": "^11.2.1", "@rollup/plugin-node-resolve": "^15.0.1",
"@rollup/plugin-replace": "^2.4.2", "@rollup/plugin-replace": "^5.0.1",
"babel-jest": "^26.6.3", "@rollup/plugin-typescript": "^9.0.2",
"babel-jest": "^29.2.2",
"babel-plugin-add-import-extension": "^1.6.0", "babel-plugin-add-import-extension": "^1.6.0",
"core-js": "^3.24.0", "core-js": "^3.26.0",
"esbuild": "^0.14.51", "esbuild": "^0.15.12",
"eslint": "^4.19.1", "eslint": "^8.26.0",
"eslint-config-airbnb-base": "^12.1.0", "eslint-config-airbnb-base": "^15.0.0",
"eslint-config-prettier": "^2.10.0", "eslint-config-prettier": "^8.5.0",
"eslint-plugin-import": "^2.26.0", "eslint-plugin-import": "^2.26.0",
"eslint-plugin-prettier": "^2.7.0", "eslint-plugin-prettier": "^4.2.1",
"husky": "^8.0.0", "husky": "^8.0.1",
"jest": "^28.1.3", "jest": "^29.2.2",
"lint-staged": "^10.5.4", "lint-staged": "^13.0.3",
"minimist": "^1.2.6", "minimist": "^1.2.7",
"node-fetch": "^2.6.7", "node-fetch": "^3.2.10",
"prettier": "1.17.1", "prettier": "2.7.1",
"rollup": "^2.77.2", "rollup": "^3.2.4",
"rollup-plugin-license": "^2.8.1", "rollup-plugin-license": "^3.0.1",
"rollup-plugin-svelte": "^7.1.0", "rollup-plugin-terser": "^7.0.2",
"rollup-plugin-terser": "^5.3.1", "rollup-plugin-visualizer": "^5.8.3",
"rollup-plugin-visualizer": "^4.2.2",
"@rollup/plugin-typescript": "^8.3.4",
"svg-outline-stroke": "^1.3.1", "svg-outline-stroke": "^1.3.1",
"svgo": "^2.8.0", "svgo": "^3.0.0",
"svgson": "^4.1.0" "svgson": "^5.2.1"
}, },
"husky": { "husky": {
"hooks": { "hooks": {

View File

@@ -138,7 +138,7 @@ In `Method 2`: import all icons in `app.module.ts` by:
```js ```js
... ...
import { icons } from 'lucide-angular/icons'; import { icons } from 'lucide-angular';
.... ....
LucideAngularModule.pick(icons) LucideAngularModule.pick(icons)
.... ....

View File

@@ -1,7 +1,7 @@
{ {
"name": "lucide-angular", "name": "lucide-angular",
"description": "A Lucide icon library package for Angular applications", "description": "A Lucide icon library package for Angular applications",
"version": "0.93.0", "version": "0.100.0",
"author": "SMAH1", "author": "SMAH1",
"license": "ISC", "license": "ISC",
"homepage": "https://lucide.dev", "homepage": "https://lucide.dev",
@@ -11,6 +11,9 @@
"url": "https://github.com/lucide-icons/lucide.git", "url": "https://github.com/lucide-icons/lucide.git",
"directory": "packages/lucide-angular" "directory": "packages/lucide-angular"
}, },
"publishConfig": {
"directory": "dist"
},
"keywords": [ "keywords": [
"Lucide", "Lucide",
"Angular", "Angular",
@@ -48,16 +51,16 @@
"@types/jasmine": "~4.3.0", "@types/jasmine": "~4.3.0",
"@types/node": "^18.11.4", "@types/node": "^18.11.4",
"codelyzer": "^6.0.2", "codelyzer": "^6.0.2",
"jasmine-core": "~4.4.0", "jasmine-core": "~3.10.1",
"jasmine-spec-reporter": "~7.0.0", "jasmine-spec-reporter": "~7.0.0",
"karma": "~6.4.1", "karma": "~6.3.14",
"karma-chrome-launcher": "~3.1.1", "karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.2.0", "karma-coverage": "~2.0.3",
"karma-jasmine": "~5.1.0", "karma-jasmine": "~4.0.1",
"karma-jasmine-html-reporter": "^2.0.0", "karma-jasmine-html-reporter": "^1.7.0",
"ng-packagr": "^14.2.1", "ng-packagr": "^14.2.1",
"protractor": "~7.0.0", "protractor": "~7.0.0",
"puppeteer": "^19.1.0", "puppeteer": "^8.0.0",
"rxjs": "7.5.7", "rxjs": "7.5.7",
"ts-node": "~10.9.1", "ts-node": "~10.9.1",
"tslint": "~6.1.0", "tslint": "~6.1.0",
@@ -65,4 +68,3 @@
"zone.js": "^0.11.8" "zone.js": "^0.11.8"
} }
} }

View File

@@ -66,3 +66,24 @@ export const getIcons = () => new Promise<LucideIcons>(async (resolve, reject)=>
} }
} }
}); });
type EventCallback = (lucideIcons: LucideIcons) => void
export const iconFetchListener = (callback: EventCallback) => {
fetchIcons()
const handleEvent = (event: MessageEvent) => {
if (event.type === 'message' && event?.data?.pluginMessage.type === 'cachedIcons') {
const lucideIcons = event?.data?.pluginMessage?.cachedIcons
callback(lucideIcons)
}
}
window.addEventListener('message', handleEvent)
const removeListener = () => {
window.removeEventListener('message', handleEvent)
}
return removeListener
}

View File

@@ -6,9 +6,11 @@
border-radius: 2px; border-radius: 2px;
appearance: none; appearance: none;
outline: 0; outline: 0;
&:hover { &:hover {
background: rgba(0, 0, 0, 0.06); background: rgba(0, 0, 0, 0.06);
} }
&:focus, &:focus,
&:active { &:active {
box-shadow: inset 0 0 0 2px var(--color-blue); box-shadow: inset 0 0 0 2px var(--color-blue);

View File

@@ -6,9 +6,10 @@ interface SearchInputProps extends React.HTMLProps<HTMLDivElement> {
value: string, value: string,
iconCount: number, iconCount: number,
onChange: (event: ChangeEvent<HTMLInputElement>) => void onChange: (event: ChangeEvent<HTMLInputElement>) => void
placeholder: string
} }
function SearchInput({ value, onChange, iconCount, className, ...props }: SearchInputProps) { function SearchInput({ value, onChange, placeholder, className, ...props }: SearchInputProps) {
return ( return (
<div <div
className="search-input" className="search-input"
@@ -20,7 +21,7 @@ function SearchInput({ value, onChange, iconCount, className, ...props }: Search
type="search" type="search"
value={value} value={value}
onChange={onChange} onChange={onChange}
placeholder={`Search ${iconCount} icons`} placeholder={placeholder}
className="input__field" className="input__field"
/> />
</div> </div>

View File

@@ -0,0 +1,25 @@
@keyframes load {
to {
background-position: 200% 0;
}
}
.skeleton {
--block: rgba(0, 0, 0, 0.06);
--loader: hsl(0 0% 89%);
background: linear-gradient(
-75deg,
transparent 40%,
var(--loader),
transparent 60%
) 0 0 / 200% 100%,
var(--block);
border-radius: calc(var(--padding) * 0.5);
animation: load 2s infinite linear;
background-attachment: fixed;
width: 40px;
height: 40px;
border-radius: 2px;
}

View File

@@ -0,0 +1,13 @@
import './Skeleton.scss'
const Skeleton = () => {
return (
<>
{Array.from({length: 48 }, () => (
<div className="skeleton"/>
))}
</>
)
}
export default Skeleton

View File

@@ -6,7 +6,7 @@ type Views = typeof views
import useSearch, { Icon } from '../hooks/useSearch' import useSearch, { Icon } from '../hooks/useSearch'
import { getIcons } from '../api/fetchIcons' import { getIcons, iconFetchListener, LucideIcons } from '../api/fetchIcons'
import './interface.scss' import './interface.scss'
import Menu from '../components/Menu' import Menu from '../components/Menu'
@@ -19,21 +19,19 @@ function App() {
const searchResults = useMemo(() => useSearch(icons, tags, query), [icons, query]) const searchResults = useMemo(() => useSearch(icons, tags, query), [icons, query])
const getLatestIcons = async () => { const handleFetchResponse = async (lucideIcons: LucideIcons) => {
const lucideIcons = await getIcons() const icons = Object.entries(lucideIcons.iconNodes)
setIcons(Object.entries(lucideIcons.iconNodes)) setIcons(icons)
setTags(lucideIcons.tags) setTags(lucideIcons.tags)
setVersion(lucideIcons.version) setVersion(lucideIcons.version)
} }
useEffect(() => { useEffect(() => {
getLatestIcons() const removeListener = iconFetchListener(handleFetchResponse)
}, [])
if(!icons.length) { return removeListener
return null }, [])
}
const View = views?.[page as keyof Views] ?? views.icons const View = views?.[page as keyof Views] ?? views.icons

View File

@@ -2,6 +2,7 @@ import IconButton from '../components/IconButton'
import SearchInput from '../components/SearchInput' import SearchInput from '../components/SearchInput'
import createIconComponent from '../helpers/createIconComponent' import createIconComponent from '../helpers/createIconComponent'
import { Icon } from '../hooks/useSearch' import { Icon } from '../hooks/useSearch'
import Skeleton from '../components/Skeleton/Skeleton'
interface PageProps { interface PageProps {
query: string query: string
@@ -24,16 +25,22 @@ const Icons = ({
value={query} value={query}
iconCount={icons.length} iconCount={icons.length}
onChange={(event) => setQuery(event.target.value)} onChange={(event) => setQuery(event.target.value)}
placeholder={icons.length ? `Search ${icons.length} icons`: 'Loading icons ..'}
/> />
<main> <main>
<div className='icon-grid'> <div className='icon-grid'>
{searchResults.map(([name, iconNode] :any) => ( {icons.length ? (
searchResults.map(([name, iconNode]: any) => (
<IconButton <IconButton
name={name} name={name}
key={name} key={name}
component={createIconComponent(name, iconNode)} component={createIconComponent(name, iconNode)}
/> />
))} ))
) : (
<Skeleton />
)}
</div> </div>
<footer> <footer>
<a <a

View File

@@ -1,6 +1,6 @@
name: lucide_icons name: lucide_icons
description: A Lucide icon library package for Flutter applications. Fork of Feather Icons, open for anyone to contribute icons. description: A Lucide icon library package for Flutter applications. Fork of Feather Icons, open for anyone to contribute icons.
version: 0.93.0 version: 0.100.0
homepage: https://lucide.dev homepage: https://lucide.dev
repository: https://github.com/lucide-icons/lucide repository: https://github.com/lucide-icons/lucide

View File

@@ -1,7 +1,7 @@
{ {
"name": "lucide-preact", "name": "lucide-preact",
"description": "A Lucide icon library package for Preact applications", "description": "A Lucide icon library package for Preact applications",
"version": "0.93.0", "version": "0.100.0",
"license": "ISC", "license": "ISC",
"homepage": "https://lucide.dev", "homepage": "https://lucide.dev",
"bugs": "https://github.com/lucide-icons/lucide/issues", "bugs": "https://github.com/lucide-icons/lucide/issues",
@@ -28,7 +28,7 @@
"build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey", "build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey",
"build:es": "babel src -d dist/esm", "build:es": "babel src -d dist/esm",
"build:types": "node ./scripts/buildTypes.mjs", "build:types": "node ./scripts/buildTypes.mjs",
"build:bundles": "rollup -c ./rollup.config.js", "build:bundles": "rollup -c ./rollup.config.mjs",
"test": "jest", "test": "jest",
"version": "pnpm version --git-tag-version=false" "version": "pnpm version --git-tag-version=false"
}, },

View File

@@ -1,5 +1,5 @@
import plugins from '../../rollup.plugins'; import plugins from '../../rollup.plugins.mjs';
import pkg from './package.json'; import pkg from './package.json' assert { type: "json" };
const packageName = 'LucidePreact'; const packageName = 'LucidePreact';
const outputFileName = 'lucide-preact'; const outputFileName = 'lucide-preact';

View File

@@ -1,7 +1,7 @@
{ {
"name": "lucide-react-native", "name": "lucide-react-native",
"description": "A Lucide icon library package for React Native applications", "description": "A Lucide icon library package for React Native applications",
"version": "0.48.0-alpha.5", "version": "0.100.0",
"license": "ISC", "license": "ISC",
"homepage": "https://lucide.dev", "homepage": "https://lucide.dev",
"bugs": "https://github.com/lucide-icons/lucide/issues", "bugs": "https://github.com/lucide-icons/lucide/issues",
@@ -28,12 +28,12 @@
"clean": "rm -rf dist && rm -rf stats && rm -rf ./src/icons/*.js", "clean": "rm -rf dist && rm -rf stats && rm -rf ./src/icons/*.js",
"build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey", "build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey",
"build:types": "node ./scripts/buildTypes.mjs", "build:types": "node ./scripts/buildTypes.mjs",
"build:bundles": "rollup -c ./rollup.config.js", "build:bundles": "rollup -c ./rollup.config.mjs",
"test": "jest", "test": "jest",
"version": "pnpm version --git-tag-version=false" "version": "pnpm version --git-tag-version=false"
}, },
"devDependencies": { "devDependencies": {
"@testing-library/react": "^11.2.6", "@testing-library/react": "^13.4.0",
"babel-preset-react-app": "^10.0.0", "babel-preset-react-app": "^10.0.0",
"jest": "^26.6.3", "jest": "^26.6.3",
"prop-types": "^15.7.2", "prop-types": "^15.7.2",

View File

@@ -1,5 +1,5 @@
import plugins from '../../rollup.plugins'; import plugins from '../../rollup.plugins.mjs';
import pkg from './package.json'; import pkg from './package.json' assert { type: 'json' };
const packageName = 'LucideReact'; const packageName = 'LucideReact';
const outputFileName = 'lucide-react-native'; const outputFileName = 'lucide-react-native';

View File

@@ -1,7 +1,7 @@
{ {
"name": "lucide-react", "name": "lucide-react",
"description": "A Lucide icon library package for React applications", "description": "A Lucide icon library package for React applications",
"version": "0.93.0", "version": "0.100.0",
"license": "ISC", "license": "ISC",
"homepage": "https://lucide.dev", "homepage": "https://lucide.dev",
"bugs": "https://github.com/lucide-icons/lucide/issues", "bugs": "https://github.com/lucide-icons/lucide/issues",
@@ -28,7 +28,7 @@
"build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey", "build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey",
"build:es": "babel src -d dist/esm", "build:es": "babel src -d dist/esm",
"build:types": "node ./scripts/buildTypes.mjs", "build:types": "node ./scripts/buildTypes.mjs",
"build:bundles": "rollup -c ./rollup.config.js", "build:bundles": "rollup -c ./rollup.config.mjs",
"test": "jest", "test": "jest",
"version": "pnpm version --git-tag-version=false" "version": "pnpm version --git-tag-version=false"
}, },

View File

@@ -1,5 +1,5 @@
import plugins from '../../rollup.plugins'; import plugins from '../../rollup.plugins.mjs';
import pkg from './package.json'; import pkg from './package.json' assert { type: 'json' };
const packageName = 'LucideReact'; const packageName = 'LucideReact';
const outputFileName = 'lucide-react'; const outputFileName = 'lucide-react';

View File

@@ -28,7 +28,7 @@
"build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey", "build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey",
"build:es": "babel src -d dist/esm", "build:es": "babel src -d dist/esm",
"build:types": "node ./scripts/buildTypes.mjs", "build:types": "node ./scripts/buildTypes.mjs",
"build:bundles": "rollup -c ./rollup.config.js", "build:bundles": "rollup -c ./rollup.config.mjs",
"test:jest": "jest", "test:jest": "jest",
"test": "vitest", "test": "vitest",
"version": "pnpm version --git-tag-version=false" "version": "pnpm version --git-tag-version=false"

View File

@@ -1,5 +1,5 @@
import plugins from '../../rollup.plugins'; import plugins from '../../rollup.plugins.mjs';
import pkg from './package.json'; import pkg from './package.json' assert { type: 'json' };
const packageName = 'LucideSolid'; const packageName = 'LucideSolid';
const outputFileName = 'lucide-solid'; const outputFileName = 'lucide-solid';

View File

@@ -11,7 +11,7 @@ describe('Using lucide icon components', () => {
it('should adjust the size, stroke color and stroke width', async () => { it('should adjust the size, stroke color and stroke width', async () => {
const testId = 'grid-icon'; const testId = 'grid-icon';
const { container, getByTestId } = render( () => const { container, getByTestId } = render(() =>
<Grid <Grid
data-testid={testId} data-testid={testId}
size={48} size={48}

View File

@@ -12,6 +12,7 @@ export default defineConfig({
setupFiles: './tests/setupVitest.js', setupFiles: './tests/setupVitest.js',
threads: false, threads: false,
isolate: false, isolate: false,
watch: false,
}, },
resolve: { resolve: {
conditions: ['development', 'browser'], conditions: ['development', 'browser'],

View File

@@ -1,7 +1,7 @@
{ {
"name": "lucide-svelte", "name": "lucide-svelte",
"description": "A Lucide icon library package for Svelte applications", "description": "A Lucide icon library package for Svelte applications",
"version": "0.93.0", "version": "0.100.0",
"license": "ISC", "license": "ISC",
"homepage": "https://lucide.dev", "homepage": "https://lucide.dev",
"bugs": "https://github.com/lucide-icons/lucide/issues", "bugs": "https://github.com/lucide-icons/lucide/issues",
@@ -29,7 +29,7 @@
"build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --exportFileName=index.js --iconFileExtention=.svelte --pretty=false", "build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --exportFileName=index.js --iconFileExtention=.svelte --pretty=false",
"build:es": "babel src -d dist/esm --copy-files", "build:es": "babel src -d dist/esm --copy-files",
"build:types": "node ./scripts/buildTypes.mjs", "build:types": "node ./scripts/buildTypes.mjs",
"build:bundles": "rollup -c ./rollup.config.js", "build:bundles": "rollup -c ./rollup.config.mjs",
"test": "jest", "test": "jest",
"test:watch": "jest --watch", "test:watch": "jest --watch",
"version": "pnpm version --git-tag-version=false" "version": "pnpm version --git-tag-version=false"

View File

@@ -6,7 +6,7 @@ import { terser } from 'rollup-plugin-terser';
import license from 'rollup-plugin-license'; import license from 'rollup-plugin-license';
import resolve from '@rollup/plugin-node-resolve'; import resolve from '@rollup/plugin-node-resolve';
import commonJS from '@rollup/plugin-commonjs'; import commonJS from '@rollup/plugin-commonjs';
import pkg from './package.json'; import pkg from './package.json' assert { type: 'json' };
const packageName = 'LucideSvelte'; const packageName = 'LucideSvelte';
const outputFileName = 'lucide-svelte'; const outputFileName = 'lucide-svelte';

View File

@@ -1,6 +1,6 @@
{ {
"name": "lucide-vue-next", "name": "lucide-vue-next",
"version": "0.93.0", "version": "0.100.0",
"author": "Eric Fennis", "author": "Eric Fennis",
"description": "A Lucide icon library package for Vue 3 applications", "description": "A Lucide icon library package for Vue 3 applications",
"license": "ISC", "license": "ISC",
@@ -30,7 +30,7 @@
"build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey", "build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs --renderUniqueKey",
"build:es": "babel src -d dist/esm", "build:es": "babel src -d dist/esm",
"build:types": "node ./scripts/buildTypes.mjs", "build:types": "node ./scripts/buildTypes.mjs",
"build:bundles": "rollup -c ./rollup.config.js", "build:bundles": "rollup -c ./rollup.config.mjs",
"test": "jest", "test": "jest",
"test:watch": "jest --watchAll", "test:watch": "jest --watchAll",
"version": "pnpm version --git-tag-version=false" "version": "pnpm version --git-tag-version=false"

View File

@@ -1,5 +1,5 @@
import plugins from '../../rollup.plugins'; import plugins from '../../rollup.plugins.mjs';
import pkg from './package.json'; import pkg from './package.json' assert { type: 'json' };
const packageName = 'LucideVueNext'; const packageName = 'LucideVueNext';
const outputFileName = 'lucide-vue-next'; const outputFileName = 'lucide-vue-next';

View File

@@ -1,6 +1,6 @@
{ {
"name": "lucide-vue", "name": "lucide-vue",
"version": "0.93.0", "version": "0.100.0",
"author": "Eric Fennis", "author": "Eric Fennis",
"description": "A Lucide icon library package for Vue 2 applications", "description": "A Lucide icon library package for Vue 2 applications",
"license": "ISC", "license": "ISC",
@@ -27,7 +27,7 @@
"clean": "rm -rf dist && rm -rf stats && rm -rf ./src/icons/*.js", "clean": "rm -rf dist && rm -rf stats && rm -rf ./src/icons/*.js",
"build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs", "build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs",
"build:es": "babel src -d dist/esm", "build:es": "babel src -d dist/esm",
"build:bundles": "rollup -c ./rollup.config.js", "build:bundles": "rollup -c ./rollup.config.mjs",
"test": "jest", "test": "jest",
"test:watch": "jest --watchAll", "test:watch": "jest --watchAll",
"version": "pnpm version --git-tag-version=false" "version": "pnpm version --git-tag-version=false"

View File

@@ -1,5 +1,5 @@
import plugins from '../../rollup.plugins'; import plugins from '../../rollup.plugins.mjs';
import pkg from './package.json'; import pkg from './package.json' assert { type: 'json' };
const packageName = 'LucideVue'; const packageName = 'LucideVue';
const outputFileName = 'lucide-vue'; const outputFileName = 'lucide-vue';

View File

@@ -1,7 +1,7 @@
{ {
"name": "lucide", "name": "lucide",
"description": "A Lucide icon library package for web and javascript applications.", "description": "A Lucide icon library package for web and javascript applications.",
"version": "0.93.0", "version": "0.100.0",
"license": "ISC", "license": "ISC",
"homepage": "https://lucide.dev", "homepage": "https://lucide.dev",
"bugs": "https://github.com/lucide-icons/lucide/issues", "bugs": "https://github.com/lucide-icons/lucide/issues",
@@ -28,7 +28,7 @@
"build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs", "build:icons": "node ../../scripts/buildIcons.mjs --output=./src --templateSrc=./scripts/exportTemplate.mjs",
"build:es": "babel src -d dist/esm", "build:es": "babel src -d dist/esm",
"build:types": "node ./scripts/buildTypes.mjs", "build:types": "node ./scripts/buildTypes.mjs",
"build:bundles": "rollup -c rollup.config.js", "build:bundles": "rollup -c rollup.config.mjs",
"test": "jest", "test": "jest",
"version": "pnpm version --git-tag-version=false" "version": "pnpm version --git-tag-version=false"
} }

View File

@@ -1,5 +1,5 @@
import plugins from '../../rollup.plugins'; import plugins from '../../rollup.plugins.mjs';
import pkg from './package.json'; import pkg from './package.json' assert { type: 'json' };
const outputFileName = pkg.name; const outputFileName = pkg.name;
const outputDir = 'dist'; const outputDir = 'dist';

View File

@@ -2,14 +2,13 @@ import path from 'path';
import { import {
readSvgDirectory, readSvgDirectory,
resetFile,
appendFile, appendFile,
writeFile, writeFile,
toPascalCase, toPascalCase,
getCurrentDirPath, getCurrentDirPath,
} from '../../../scripts/helpers.mjs'; } from '../../../scripts/helpers.mjs';
const currentDir = getCurrentDirPath(import.meta.url) const currentDir = getCurrentDirPath(import.meta.url);
const defaultAttributes = { const defaultAttributes = {
xmlns: 'http://www.w3.org/2000/svg', xmlns: 'http://www.w3.org/2000/svg',
@@ -77,7 +76,7 @@ writeFile(typeDefinitions, TYPES_FILE_NAME, TARGET_DIR);
const svgFiles = readSvgDirectory(ICONS_DIR); const svgFiles = readSvgDirectory(ICONS_DIR);
svgFiles.forEach(svgFile => { svgFiles.forEach((svgFile) => {
const nameSvg = path.basename(svgFile, '.svg'); const nameSvg = path.basename(svgFile, '.svg');
const namePascal = toPascalCase(nameSvg); const namePascal = toPascalCase(nameSvg);

View File

@@ -8,12 +8,12 @@
const createElement = (tag, attrs, children = []) => { const createElement = (tag, attrs, children = []) => {
const element = document.createElementNS('http://www.w3.org/2000/svg', tag); const element = document.createElementNS('http://www.w3.org/2000/svg', tag);
Object.keys(attrs).forEach(name => { Object.keys(attrs).forEach((name) => {
element.setAttribute(name, attrs[name]); element.setAttribute(name, attrs[name]);
}); });
if (children.length) { if (children.length) {
children = children.forEach(child => { children = children.forEach((child) => {
const childElement = createElement(...child); const childElement = createElement(...child);
element.appendChild(childElement); element.appendChild(childElement);

View File

@@ -18,7 +18,7 @@ const createIcons = ({ icons = {}, nameAttr = 'icon-name', attrs = {} } = {}) =>
const elementsToReplace = document.querySelectorAll(`[${nameAttr}]`); const elementsToReplace = document.querySelectorAll(`[${nameAttr}]`);
Array.from(elementsToReplace).forEach(element => Array.from(elementsToReplace).forEach((element) =>
replaceElement(element, { nameAttr, icons, attrs }), replaceElement(element, { nameAttr, icons, attrs }),
); );
}; };

View File

@@ -5,7 +5,7 @@ import createElement from './createElement';
* @param {HTMLElement} element * @param {HTMLElement} element
* @returns {Object} * @returns {Object}
*/ */
export const getAttrs = element => export const getAttrs = (element) =>
Array.from(element.attributes).reduce((attrs, attr) => { Array.from(element.attributes).reduce((attrs, attr) => {
attrs[attr.name] = attr.value; attrs[attr.name] = attr.value;
return attrs; return attrs;
@@ -16,7 +16,7 @@ export const getAttrs = element =>
* @param {Object} attrs * @param {Object} attrs
* @returns {Array} * @returns {Array}
*/ */
export const getClassNames = attrs => { export const getClassNames = (attrs) => {
if (typeof attrs === 'string') return attrs; if (typeof attrs === 'string') return attrs;
if (!attrs || !attrs.class) return ''; if (!attrs || !attrs.class) return '';
if (attrs.class && typeof attrs.class === 'string') { if (attrs.class && typeof attrs.class === 'string') {
@@ -33,17 +33,17 @@ export const getClassNames = attrs => {
* @param {array} arrayOfClassnames * @param {array} arrayOfClassnames
* @returns {string} * @returns {string}
*/ */
export const combineClassNames = arrayOfClassnames => { export const combineClassNames = (arrayOfClassnames) => {
const classNameArray = arrayOfClassnames.flatMap(getClassNames); const classNameArray = arrayOfClassnames.flatMap(getClassNames);
return classNameArray return classNameArray
.map(classItem => classItem.trim()) .map((classItem) => classItem.trim())
.filter(Boolean) .filter(Boolean)
.filter((value, index, self) => self.indexOf(value) === index) .filter((value, index, self) => self.indexOf(value) === index)
.join(' '); .join(' ');
}; };
const toPascalCase = string => const toPascalCase = (string) =>
string.replace(/(\w)(\w*)(_|-|\s*)/g, (g0, g1, g2) => g1.toUpperCase() + g2.toLowerCase()); string.replace(/(\w)(\w*)(_|-|\s*)/g, (g0, g1, g2) => g1.toUpperCase() + g2.toLowerCase());
/** /**

4798
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,3 +1,4 @@
packages: packages:
- 'packages/*' - 'packages/*'
- 'tools/*'
- 'site' - 'site'

View File

@@ -1,8 +1,8 @@
/* eslint-disable import/no-extraneous-dependencies */ /* eslint-disable import/no-extraneous-dependencies */
import babel from '@rollup/plugin-babel'; import { babel } from '@rollup/plugin-babel';
import bundleSize from '@atomico/rollup-plugin-sizes'; import bundleSize from '@atomico/rollup-plugin-sizes';
import { terser } from 'rollup-plugin-terser'; import { terser } from 'rollup-plugin-terser';
import visualizer from 'rollup-plugin-visualizer'; import { visualizer } from 'rollup-plugin-visualizer';
import license from 'rollup-plugin-license'; import license from 'rollup-plugin-license';
import replace from '@rollup/plugin-replace'; import replace from '@rollup/plugin-replace';
import resolve from '@rollup/plugin-node-resolve'; import resolve from '@rollup/plugin-node-resolve';

21
scripts/Dockerfile Normal file
View File

@@ -0,0 +1,21 @@
## This Dockerfile is for building image for github actions
FROM debian:stable-slim
RUN apt-get update
RUN apt-get install zlib1g-dev fontforge git build-essential ruby-full -y
# sfnt2woff
RUN git clone https://github.com/bramstein/sfnt2woff-zopfli.git sfnt2woff-zopfli
WORKDIR /sfnt2woff-zopfli
RUN make
RUN cp sfnt2woff-zopfli /usr/local/bin/sfnt2woff
# WOFF2
WORKDIR /
RUN git clone --recursive https://github.com/google/woff2.git
WORKDIR /woff2
RUN make clean all
RUN mv woff2_compress /usr/local/bin/
RUN mv woff2_decompress /usr/local/bin/
RUN gem install fontcustom

View File

@@ -2,17 +2,17 @@ import path from 'path';
import tags from '../tags.json' assert { type: 'json' }; import tags from '../tags.json' assert { type: 'json' };
import { readSvgDirectory, writeFile, getCurrentDirPath } from './helpers.mjs'; import { readSvgDirectory, writeFile, getCurrentDirPath } from './helpers.mjs';
const currentDir = getCurrentDirPath(import.meta.url) const currentDir = getCurrentDirPath(import.meta.url);
const ICONS_DIR = path.resolve(currentDir, '../icons'); const ICONS_DIR = path.resolve(currentDir, '../icons');
console.log(`Read all tags`); console.log(`Read all tags`);
const svgFiles = readSvgDirectory(ICONS_DIR); const svgFiles = readSvgDirectory(ICONS_DIR);
const iconNames = svgFiles.map(icon => icon.split('.')[0]); const iconNames = svgFiles.map((icon) => icon.split('.')[0]);
const iconTags = iconNames const iconTags = iconNames
.map(iconName => ({ .map((iconName) => ({
name: iconName, name: iconName,
tags: tags[iconName] || [], tags: tags[iconName] || [],
})) }))

View File

@@ -1,6 +1,6 @@
import fs from 'fs'; import fs from 'fs';
import path from 'path'; import path from 'path';
import getArgumentOptions from 'minimist'; // eslint-disable-line import/no-extraneous-dependencies import getArgumentOptions from 'minimist';
import renderIconsObject from './render/renderIconsObject.mjs'; import renderIconsObject from './render/renderIconsObject.mjs';
import generateIconFiles from './building/generateIconFiles.mjs'; import generateIconFiles from './building/generateIconFiles.mjs';
@@ -10,7 +10,7 @@ import { readSvgDirectory, getCurrentDirPath } from './helpers.mjs';
const cliArguments = getArgumentOptions(process.argv.slice(2)); const cliArguments = getArgumentOptions(process.argv.slice(2));
const currentDir = getCurrentDirPath(import.meta.url) const currentDir = getCurrentDirPath(import.meta.url);
const ICONS_DIR = path.resolve(currentDir, '../icons'); const ICONS_DIR = path.resolve(currentDir, '../icons');
const OUTPUT_DIR = path.resolve(process.cwd(), cliArguments.output || '../build'); const OUTPUT_DIR = path.resolve(process.cwd(), cliArguments.output || '../build');
@@ -29,17 +29,15 @@ const {
} = cliArguments; } = cliArguments;
async function buildIcons() { async function buildIcons() {
if (templateSrc == null) { if (templateSrc == null) {
throw new Error('No `templateSrc` argument given.') throw new Error('No `templateSrc` argument given.');
} }
const svgFiles = readSvgDirectory(ICONS_DIR); const svgFiles = readSvgDirectory(ICONS_DIR);
const icons = renderIconsObject(svgFiles, ICONS_DIR, renderUniqueKey); const icons = renderIconsObject(svgFiles, ICONS_DIR, renderUniqueKey);
const { default: iconFileTemplate } = await import(path.resolve(process.cwd(), templateSrc));
const {default: iconFileTemplate} = await import(path.resolve(process.cwd(), templateSrc));
// Generates iconsNodes files for each icon // Generates iconsNodes files for each icon
generateIconFiles({ generateIconFiles({
@@ -61,7 +59,7 @@ async function buildIcons() {
} }
try { try {
buildIcons() buildIcons();
} catch (error) { } catch (error) {
console.error(error) console.error(error);
} }

View File

@@ -2,7 +2,7 @@ import path from 'path';
import { toPascalCase, resetFile, appendFile } from '../helpers.mjs'; import { toPascalCase, resetFile, appendFile } from '../helpers.mjs';
export default function(inputEntry, outputDirectory, iconNodes, iconFileExtention = '') { export default (inputEntry, outputDirectory, iconNodes, iconFileExtention = '') => {
const fileName = path.basename(inputEntry); const fileName = path.basename(inputEntry);
// Reset file // Reset file
@@ -14,7 +14,7 @@ export default function(inputEntry, outputDirectory, iconNodes, iconFileExtentio
iconFileExtention === '.ts' || iconFileExtention === '.js' ? '' : iconFileExtention; iconFileExtention === '.ts' || iconFileExtention === '.js' ? '' : iconFileExtention;
// Generate Import for Icon VNodes // Generate Import for Icon VNodes
icons.forEach(iconName => { icons.forEach((iconName) => {
const componentName = toPascalCase(iconName); const componentName = toPascalCase(iconName);
const importString = `export { default as ${componentName} } from './${iconName}${fileExtention}';\n`; const importString = `export { default as ${componentName} } from './${iconName}${fileExtention}';\n`;
appendFile(importString, fileName, outputDirectory); appendFile(importString, fileName, outputDirectory);
@@ -23,4 +23,4 @@ export default function(inputEntry, outputDirectory, iconNodes, iconFileExtentio
appendFile('\n', fileName, outputDirectory); appendFile('\n', fileName, outputDirectory);
console.log(`Successfully generated ${fileName} file`); console.log(`Successfully generated ${fileName} file`);
} };

View File

@@ -1,17 +1,16 @@
/* eslint-disable import/no-extraneous-dependencies */
import fs from 'fs'; import fs from 'fs';
import path from 'path'; import path from 'path';
import prettier from 'prettier'; import prettier from 'prettier';
import { toPascalCase } from '../helpers.mjs'; import { toPascalCase } from '../helpers.mjs';
export default function({ export default ({
iconNodes, iconNodes,
outputDirectory, outputDirectory,
template, template,
showLog = true, showLog = true,
iconFileExtention = '.js', iconFileExtention = '.js',
pretty = true, pretty = true,
}) { }) => {
const icons = Object.keys(iconNodes); const icons = Object.keys(iconNodes);
const iconsDistDirectory = path.join(outputDirectory, `icons`); const iconsDistDirectory = path.join(outputDirectory, `icons`);
@@ -19,7 +18,7 @@ export default function({
fs.mkdirSync(iconsDistDirectory); fs.mkdirSync(iconsDistDirectory);
} }
const writeIconFiles = icons.map(async iconName => { const writeIconFiles = icons.map(async (iconName) => {
const location = path.join(iconsDistDirectory, `${iconName}${iconFileExtention}`); const location = path.join(iconsDistDirectory, `${iconName}${iconFileExtention}`);
const componentName = toPascalCase(iconName); const componentName = toPascalCase(iconName);
@@ -44,7 +43,7 @@ export default function({
console.log('Successfully built', icons.length, 'icons.'); console.log('Successfully built', icons.length, 'icons.');
} }
}) })
.catch(error => { .catch((error) => {
throw new Error(`Something went wrong generating icon files,\n ${error}`); throw new Error(`Something went wrong generating icon files,\n ${error}`);
}); });
} };

View File

@@ -1,7 +1,7 @@
import getArgumentOptions from 'minimist'; // eslint-disable-line import/no-extraneous-dependencies import getArgumentOptions from 'minimist';
import githubApi from './githubApi.mjs'; import githubApi from './githubApi.mjs';
const fetchCompareTags = oldTag => const fetchCompareTags = (oldTag) =>
githubApi(`https://api.github.com/repos/lucide-icons/lucide/compare/${oldTag}...main`); githubApi(`https://api.github.com/repos/lucide-icons/lucide/compare/${oldTag}...main`);
const iconRegex = /icons\/(.*)\.svg/g; const iconRegex = /icons\/(.*)\.svg/g;
@@ -27,7 +27,7 @@ const topics = [
}, },
]; ];
const fetchCommits = async file => { const fetchCommits = async (file) => {
const commits = await githubApi( const commits = await githubApi(
`https://api.github.com/repos/lucide-icons/lucide/commits?path=${file.filename}`, `https://api.github.com/repos/lucide-icons/lucide/commits?path=${file.filename}`,
); );
@@ -38,12 +38,12 @@ const fetchCommits = async file => {
const cliArguments = getArgumentOptions(process.argv.slice(2)); const cliArguments = getArgumentOptions(process.argv.slice(2));
// eslint-disable-next-line func-names // eslint-disable-next-line func-names
(async function() { (async function () {
try { try {
const output = await fetchCompareTags(cliArguments['old-tag']); const output = await fetchCompareTags(cliArguments['old-tag']);
if (output?.files == null) { if (output?.files == null) {
throw new Error('Tag not found!') throw new Error('Tag not found!');
} }
const changedFiles = output.files.filter( const changedFiles = output.files.filter(
@@ -95,7 +95,7 @@ const cliArguments = getArgumentOptions(process.argv.slice(2));
} catch (error) { } catch (error) {
throw new Error(error); throw new Error(error);
} }
})().catch(error => { })().catch((error) => {
console.error(error); console.error(error);
process.exit(1); process.exit(1);
}); });

View File

@@ -1,19 +1,17 @@
/* eslint-disable import/no-extraneous-dependencies */
import path from 'path'; import path from 'path';
import { stringify, parseSync } from 'svgson'; import { stringify, parseSync } from 'svgson';
import prettier from 'prettier'; import prettier from 'prettier';
import { appendFile, readSvgDirectory, getCurrentDirPath } from './helpers.mjs'; import { appendFile, readSvgDirectory, getCurrentDirPath } from './helpers.mjs';
/* eslint-disable import/no-extraneous-dependencies */
import readSvgs from '../packages/lucide-static/scripts/readSvgs.mjs'; import readSvgs from '../packages/lucide-static/scripts/readSvgs.mjs';
const currentDir = getCurrentDirPath(import.meta.url) const currentDir = getCurrentDirPath(import.meta.url);
const ICONS_DIR = path.resolve('icons'); const ICONS_DIR = path.resolve('icons');
const PACKAGE_DIR = path.resolve(currentDir); const PACKAGE_DIR = path.resolve(currentDir);
export default function generateSprite(svgs, packageDir) { export default function generateSprite(svgs, packageDir) {
const symbols = svgs.map(({ name, parsedSvg }, index) => { const symbols = svgs.map(({ parsedSvg }, index) => {
const itemsPerRow = 10; const itemsPerRow = 10;
const numInRow = index % itemsPerRow; const numInRow = index % itemsPerRow;
const column = numInRow + 1; const column = numInRow + 1;

View File

@@ -1,7 +1,6 @@
// eslint-disable-next-line import/no-extraneous-dependencies
import fetch, { Headers } from 'node-fetch'; import fetch, { Headers } from 'node-fetch';
const githubApi = async endpoint => { const githubApi = async (endpoint) => {
const headers = new Headers(); const headers = new Headers();
const username = 'ericfennis'; const username = 'ericfennis';
const password = process.env.GITHUB_API_KEY; const password = process.env.GITHUB_API_KEY;

View File

@@ -8,7 +8,7 @@ import { fileURLToPath } from 'url';
* @param {string} string * @param {string} string
* @returns {string} A camelized string * @returns {string} A camelized string
*/ */
export const toCamelCase = string => export const toCamelCase = (string) =>
string.replace(/^([A-Z])|[\s-_]+(\w)/g, (match, p1, p2) => string.replace(/^([A-Z])|[\s-_]+(\w)/g, (match, p1, p2) =>
p2 ? p2.toUpperCase() : p1.toLowerCase(), p2 ? p2.toUpperCase() : p1.toLowerCase(),
); );
@@ -19,7 +19,7 @@ export const toCamelCase = string =>
* @param {string} string * @param {string} string
* @returns {string} A pascalized string * @returns {string} A pascalized string
*/ */
export const toPascalCase = string => { export const toPascalCase = (string) => {
const camelCase = toCamelCase(string); const camelCase = toCamelCase(string);
return camelCase.charAt(0).toUpperCase() + camelCase.slice(1); return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
@@ -31,7 +31,7 @@ export const toPascalCase = string => {
* @param {string} string * @param {string} string
* @returns {string} A kebabized string * @returns {string} A kebabized string
*/ */
export const toKebabCase = string => string.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase(); export const toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
/** /**
* Resets the file contents. * Resets the file contents.
@@ -48,7 +48,7 @@ export const resetFile = (fileName, outputDirectory) =>
* @param {string} path * @param {string} path
* @returns {string} The contents of a file * @returns {string} The contents of a file
*/ */
export const readFile = entry => fs.readFileSync(path.resolve(__dirname, '../', entry), 'utf-8'); export const readFile = (entry) => fs.readFileSync(path.resolve(__dirname, '../', entry), 'utf-8');
/** /**
* append content to a file * append content to a file
@@ -76,8 +76,8 @@ export const writeFile = (content, fileName, outputDirectory) =>
* @param {string} directory * @param {string} directory
* @returns {array} An array of file paths containig svgs * @returns {array} An array of file paths containig svgs
*/ */
export const readSvgDirectory = directory => export const readSvgDirectory = (directory) =>
fs.readdirSync(directory).filter(file => path.extname(file) === '.svg'); fs.readdirSync(directory).filter((file) => path.extname(file) === '.svg');
/** /**
* Read svg from directory * Read svg from directory
@@ -133,12 +133,12 @@ export const generateHashedKey = ({ name, attributes }) => hash(JSON.stringify([
* @param {array} children an array of items * @param {array} children an array of items
* @returns {Boolean} if items contains duplicated items. * @returns {Boolean} if items contains duplicated items.
*/ */
export const hasDuplicatedChildren = children => { export const hasDuplicatedChildren = (children) => {
const hashedKeys = children.map(generateHashedKey); const hashedKeys = children.map(generateHashedKey);
return !hashedKeys.every( return !hashedKeys.every(
(key, index) => index === hashedKeys.findIndex(childKey => childKey === key), (key, index) => index === hashedKeys.findIndex((childKey) => childKey === key),
); );
}; };
export const getCurrentDirPath = currentPath => path.dirname(fileURLToPath(currentPath)); export const getCurrentDirPath = (currentPath) => path.dirname(fileURLToPath(currentPath));

View File

@@ -3,7 +3,7 @@ import processSvg from './render/processSvg.mjs';
const svgFiles = process.argv.slice(4); const svgFiles = process.argv.slice(4);
svgFiles.forEach(async svgFile => { svgFiles.forEach(async (svgFile) => {
const content = fs.readFileSync(svgFile); const content = fs.readFileSync(svgFile);
const svg = await processSvg(content); const svg = await processSvg(content);
fs.writeFileSync(svgFile, svg, 'utf-8'); fs.writeFileSync(svgFile, svg, 'utf-8');

View File

@@ -9,7 +9,7 @@ console.log(`Optimizing SVGs...`);
const svgFiles = readSvgDirectory(ICONS_DIR); const svgFiles = readSvgDirectory(ICONS_DIR);
svgFiles.forEach(svgFile => { svgFiles.forEach((svgFile) => {
const content = fs.readFileSync(path.join(ICONS_DIR, svgFile)); const content = fs.readFileSync(path.join(ICONS_DIR, svgFile));
processSvg(content).then(svg => writeSvgFile(svgFile, ICONS_DIR, svg)); processSvg(content).then((svg) => writeSvgFile(svgFile, ICONS_DIR, svg));
}); });

View File

@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import { optimize } from 'svgo'; import { optimize } from 'svgo';
import prettier from 'prettier'; import prettier from 'prettier';
import { parseSync, stringify } from 'svgson'; import { parseSync, stringify } from 'svgson';
@@ -52,10 +51,12 @@ function processSvg(svg) {
return ( return (
optimizeSvg(svg) optimizeSvg(svg)
.then(setAttrs) .then(setAttrs)
.then(optimizedSvg => prettier.format(optimizedSvg, { parser: 'babel' })) .then((optimizedSvg) =>
prettier.format(optimizedSvg, { parser: 'babel' }),
)
// remove semicolon inserted by prettier // remove semicolon inserted by prettier
// because prettier thinks it's formatting JSX not HTML // because prettier thinks it's formatting JSX not HTML
.then(svg => svg.replace(/;/g, '')) .then((svg) => svg.replace(/;/g, ''))
); );
} }

View File

@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import { basename } from 'path'; import { basename } from 'path';
import { parseSync } from 'svgson'; import { parseSync } from 'svgson';
import { generateHashedKey, readSvg, hasDuplicatedChildren } from '../helpers.mjs'; import { generateHashedKey, readSvg, hasDuplicatedChildren } from '../helpers.mjs';
@@ -11,7 +10,7 @@ import { generateHashedKey, readSvg, hasDuplicatedChildren } from '../helpers.mj
*/ */
export default (svgFiles, iconsDirectory, renderUniqueKey = false) => export default (svgFiles, iconsDirectory, renderUniqueKey = false) =>
svgFiles svgFiles
.map(svgFile => { .map((svgFile) => {
const name = basename(svgFile, '.svg'); const name = basename(svgFile, '.svg');
const svg = readSvg(svgFile, iconsDirectory); const svg = readSvg(svgFile, iconsDirectory);
const contents = parseSync(svg); const contents = parseSync(svg);
@@ -25,7 +24,7 @@ export default (svgFiles, iconsDirectory, renderUniqueKey = false) =>
} }
if (renderUniqueKey) { if (renderUniqueKey) {
contents.children = contents.children.map(child => { contents.children = contents.children.map((child) => {
child.attributes.key = generateHashedKey(child); child.attributes.key = generateHashedKey(child);
return child; return child;

29892
scripts/super-sprite.svg Normal file

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 807 KiB

View File

@@ -27,7 +27,7 @@
"js-yaml": "^4.1.0", "js-yaml": "^4.1.0",
"jszip": "^3.7.0", "jszip": "^3.7.0",
"lodash": "^4.17.20", "lodash": "^4.17.20",
"lucide-react": "0.14.0", "lucide-react": "^0.94.0",
"next": "12", "next": "12",
"next-mdx-remote": "^3.0.2", "next-mdx-remote": "^3.0.2",
"prism-react-renderer": "^1.2.1", "prism-react-renderer": "^1.2.1",

View File

@@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<svg width="30" height="30" viewBox="0 0 400 400" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="400" height="400" fill="#F6F7FF"/>
<path d="M222.131 112.458L237.41 66.8783H290.403L275.043 112.458H222.131Z" fill="#14FFAF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M158.026 174.716C172.966 162.84 191.165 155.37 211.659 155.37C253.609 155.37 294.409 182.196 294.409 250.953V336H240.776V250.953C240.776 215.516 223.929 202.107 200.933 202.107C181.969 202.107 168.181 213.026 160.516 224.517V336H106.692V115.336H74L91.2077 64H158.026V174.716ZM272.988 109.567L286.407 69.7565H239.485L226.132 109.567H272.988ZM235.338 64H294.409L277.112 115.336H218.13L235.338 64Z" fill="#0A23B9"/>
</svg>

After

Width:  |  Height:  |  Size: 752 B

View File

@@ -4,10 +4,37 @@
"description": "Implementation of Lucide icon's using blade-icons for Laravel based projects.", "description": "Implementation of Lucide icon's using blade-icons for Laravel based projects.",
"icon": "/framework-logos/laravel.svg", "icon": "/framework-logos/laravel.svg",
"shields": [ "shields": [
{ "alt": "Latest Stable Version", "src": "https://img.shields.io/packagist/v/mallardduck/blade-lucide-icons", "href": "https://packagist.org/packages/mallardduck/blade-lucide-icons" }, {
{ "alt": "Total Downloads", "src": "https://img.shields.io/packagist/dt/mallardduck/blade-lucide-icons", "href": "https://packagist.org/packages/mallardduck/blade-lucide-icons" } "alt": "Latest Stable Version",
"src": "https://img.shields.io/packagist/v/mallardduck/blade-lucide-icons",
"href": "https://packagist.org/packages/mallardduck/blade-lucide-icons"
},
{
"alt": "Total Downloads",
"src": "https://img.shields.io/packagist/dt/mallardduck/blade-lucide-icons",
"href": "https://packagist.org/packages/mallardduck/blade-lucide-icons"
}
], ],
"source": "https://github.com/mallardduck/blade-lucide-icons", "source": "https://github.com/mallardduck/blade-lucide-icons",
"documentation": "https://github.com/mallardduck/blade-lucide-icons/blob/main/README.md" "documentation": "https://github.com/mallardduck/blade-lucide-icons/blob/main/README.md"
},
{
"name": "hyva-lucide-icons",
"description": "Implementation of Lucide icon's using Hyvä's svg php viewmodal to render icons for Magento 2 Hyva theme based projects.",
"icon": "/framework-logos/hyva.svg",
"shields": [
{
"alt": "Latest Stable Version",
"src": "https://img.shields.io/packagist/v/siteation/magento2-hyva-icons-lucide",
"href": "https://packagist.org/packages/siteation/magento2-hyva-icons-lucide"
},
{
"alt": "Total Downloads",
"src": "https://img.shields.io/packagist/dt/siteation/magento2-hyva-icons-lucide",
"href": "https://packagist.org/packages/siteation/magento2-hyva-icons-lucide"
}
],
"source": "https://github.com/siteation/magento2-hyva-icons-lucide",
"documentation": "https://github.com/siteation/magento2-hyva-icons-lucide/blob/main/README.md"
} }
] ]

226
tags.json
View File

@@ -446,12 +446,21 @@
"beaker": [ "beaker": [
"cup" "cup"
], ],
"beer": [ "bean": [
"alcohol", "legume",
"bar", "soy",
"beverage", "food",
"brewery", "seed"
"drink" ],
"bean-off": [
"soy free",
"legume",
"soy",
"food",
"seed",
"allergy",
"intolerance",
"diet"
], ],
"bed": [ "bed": [
"sleep", "sleep",
@@ -468,6 +477,13 @@
"hotel", "hotel",
"furniture" "furniture"
], ],
"beer": [
"alcohol",
"bar",
"beverage",
"brewery",
"drink"
],
"bell": [ "bell": [
"alarm", "alarm",
"notification", "notification",
@@ -749,6 +765,19 @@
"webcam", "webcam",
"video" "video"
], ],
"candy": [
"sugar",
"food",
"sweet"
],
"candy-off": [
"sugar free",
"food",
"sweet",
"allergy",
"intolerance",
"diet"
],
"car": [ "car": [
"vehicle", "vehicle",
"transport", "transport",
@@ -1337,6 +1366,22 @@
"calculate", "calculate",
"maths" "maths"
], ],
"dna": [
"gene",
"gmo",
"helix",
"heredity",
"chromosome",
"nucleic acid"
],
"dna-off": [
"gene",
"gmo free",
"helix",
"heredity",
"chromosome",
"nucleic acid"
],
"dog": [ "dog": [
"animal", "animal",
"pet", "pet",
@@ -1369,6 +1414,12 @@
"chicken", "chicken",
"meat" "meat"
], ],
"dumbbell": [
"barbell",
"weight",
"workout",
"gym"
],
"ear": [ "ear": [
"hearing", "hearing",
"noise", "noise",
@@ -1404,6 +1455,7 @@
"food", "food",
"breakfast" "breakfast"
], ],
"egg-off": [],
"equal": [ "equal": [
"calculate", "calculate",
"maths" "maths"
@@ -1707,14 +1759,12 @@
"file-type": [ "file-type": [
"font", "font",
"text", "text",
"font",
"typography", "typography",
"type" "type"
], ],
"file-type-2": [ "file-type-2": [
"font", "font",
"text", "text",
"font",
"typography", "typography",
"type" "type"
], ],
@@ -1810,6 +1860,11 @@
"beaker", "beaker",
"erlenmeyer" "erlenmeyer"
], ],
"flask-conical-off": [
"beaker",
"erlenmeyer",
"non toxic"
],
"flask-round": [ "flask-round": [
"beaker" "beaker"
], ],
@@ -2027,11 +2082,6 @@
"automation", "automation",
"maths" "maths"
], ],
"joystick": [
"game",
"console",
"control stick"
],
"gamepad": [ "gamepad": [
"console" "console"
], ],
@@ -2089,16 +2139,16 @@
"code", "code",
"version control" "version control"
], ],
"git-pull-request-draft": [
"code",
"version control",
"draft"
],
"git-pull-request-closed": [ "git-pull-request-closed": [
"code", "code",
"version control", "version control",
"rejected" "rejected"
], ],
"git-pull-request-draft": [
"code",
"version control",
"draft"
],
"github": [ "github": [
"logo", "logo",
"version control" "version control"
@@ -2193,6 +2243,13 @@
"mist", "mist",
"fog" "fog"
], ],
"heading": [],
"heading-1": [],
"heading-2": [],
"heading-3": [],
"heading-4": [],
"heading-5": [],
"heading-6": [],
"headphones": [ "headphones": [
"music", "music",
"audio", "audio",
@@ -2258,6 +2315,20 @@
"house", "house",
"living" "living"
], ],
"hop": [
"beer",
"brewery",
"drink"
],
"hop-off": [
"beer",
"brewery",
"drink",
"hop free",
"allergy",
"intolerance",
"diet"
],
"hourglass": [ "hourglass": [
"timer", "timer",
"time", "time",
@@ -2330,6 +2401,11 @@
"money", "money",
"payment" "payment"
], ],
"joystick": [
"game",
"console",
"control stick"
],
"key": [ "key": [
"password", "password",
"login", "login",
@@ -2753,12 +2829,6 @@
"podcast", "podcast",
"microphone" "microphone"
], ],
"mic-off": [
"record",
"sound",
"mute",
"microphone"
],
"mic-2": [ "mic-2": [
"lyrics", "lyrics",
"voice", "voice",
@@ -2771,6 +2841,12 @@
"singing", "singing",
"microphone" "microphone"
], ],
"mic-off": [
"record",
"sound",
"mute",
"microphone"
],
"microscope": [ "microscope": [
"medical", "medical",
"education", "education",
@@ -2789,6 +2865,24 @@
"signpost", "signpost",
"version control" "version control"
], ],
"milk": [
"lactose",
"bottle",
"beverage",
"drink",
"water",
"diet"
],
"milk-off": [
"lactose free",
"bottle",
"beverage",
"drink",
"water",
"allergy",
"intolerance",
"diet"
],
"minimize": [ "minimize": [
"exit fullscreen", "exit fullscreen",
"close", "close",
@@ -2823,6 +2917,16 @@
"monitor-off": [ "monitor-off": [
"share" "share"
], ],
"monitor-smartphone": [
"smartphone",
"phone",
"cellphone",
"device",
"mobile",
"desktop",
"monitor",
"responsive"
],
"monitor-speaker": [ "monitor-speaker": [
"devices", "devices",
"connect", "connect",
@@ -2948,6 +3052,20 @@
"article", "article",
"headline" "headline"
], ],
"nut": [
"hazelnut",
"acorn",
"food",
"diet"
],
"nut-off": [
"hazelnut",
"acorn",
"food",
"allergy",
"intolerance",
"diet"
],
"octagon": [ "octagon": [
"stop", "stop",
"shape" "shape"
@@ -3096,6 +3214,15 @@
"money", "money",
"savings" "savings"
], ],
"pilcrow": [
"paragraph",
"mark",
"paraph",
"blind",
"typography",
"type",
"text"
],
"pin": [ "pin": [
"save", "save",
"map", "map",
@@ -3130,6 +3257,8 @@
"music", "music",
"start" "start"
], ],
"plug": [],
"plug-2": [],
"plug-zap": [ "plug-zap": [
"charge", "charge",
"charging", "charging",
@@ -3678,6 +3807,7 @@
"audio", "audio",
"music" "music"
], ],
"spline": [],
"sprout": [ "sprout": [
"leaf", "leaf",
"nature", "nature",
@@ -3709,6 +3839,13 @@
"remove", "remove",
"unrate" "unrate"
], ],
"stethoscope": [
"phonendoscope",
"medical",
"heart",
"lungs",
"sound"
],
"sticker": [ "sticker": [
"reaction", "reaction",
"emotion", "emotion",
@@ -3722,13 +3859,6 @@
"reaction", "reaction",
"memo" "memo"
], ],
"stethoscope": [
"phonendoscope",
"medical",
"heart",
"lungs",
"sound"
],
"stop-circle": [ "stop-circle": [
"media", "media",
"music" "music"
@@ -4152,6 +4282,13 @@
"dinner", "dinner",
"supper" "supper"
], ],
"vegan": [
"vegetarian",
"fruitarian",
"herbivorous",
"animal rights",
"diet"
],
"venetian-mask": [ "venetian-mask": [
"mask", "mask",
"masquerade", "masquerade",
@@ -4244,6 +4381,21 @@
"interface", "interface",
"callback" "callback"
], ],
"wheat": [
"corn",
"cereal",
"grain",
"gluten"
],
"wheat-off": [
"corn",
"cereal",
"grain",
"gluten free",
"allergy",
"intolerance",
"diet"
],
"wifi": [ "wifi": [
"connection", "connection",
"signal", "signal",
@@ -4267,6 +4419,18 @@
"vineyard", "vineyard",
"winery" "winery"
], ],
"wine-off": [
"alcohol",
"beverage",
"drink",
"glass",
"alcohol free",
"abstinence",
"abstaining",
"teetotalism",
"allergy",
"intolerance"
],
"wrap-text": [ "wrap-text": [
"words", "words",
"lines", "lines",

View File

@@ -1,19 +1,13 @@
import { promises as fs } from 'fs'; import { promises as fs } from 'fs';
import outlineStroke from 'svg-outline-stroke'; import outlineStroke from 'svg-outline-stroke';
import { parse, stringify } from 'svgson'; // eslint-disable-line import/no-extraneous-dependencies import { parse, stringify } from 'svgson';
import getArgumentOptions from 'minimist'; import getArgumentOptions from 'minimist';
import path from 'path';
const inputDir = `./icons/`; const inputDir = path.join(process.cwd(), '../../icons');
const cliArguments = getArgumentOptions(process.argv.slice(2)); const cliArguments = getArgumentOptions(process.argv.slice(2));
const { outputDir } = cliArguments; const { outputDir = 'outlined' } = cliArguments;
const targetDir = path.join(process.cwd(), '../../', outputDir);
const widthMap = {
'converted_icons-200': '1',
'converted_icons-300': '1.5',
converted_icons: '2',
'converted_icons-500': '2.5',
'converted_icons-600': '3',
};
function transformForward(node) { function transformForward(node) {
if (node.name === 'svg') { if (node.name === 'svg') {
@@ -43,12 +37,15 @@ function transformBackwards(node) {
async function init() { async function init() {
console.time('icon outliner'); console.time('icon outliner');
try { try {
await fs.mkdir(`./${outputDir}`); try {
await fs.mkdir(targetDir);
} catch (error) {} // eslint-disable-line no-empty
const icons = await fs.readdir(inputDir); const icons = await fs.readdir(inputDir);
const parsedIconNodes = await Promise.all( const parsedIconNodes = await Promise.all(
icons.map(async file => { icons.map(async (file) => {
const iconContent = await fs.readFile(`${inputDir}${file}`); const inputFilePath = path.resolve(process.cwd(), inputDir, file);
const iconContent = await fs.readFile(inputFilePath);
const iconNode = await parse(iconContent.toString(), { const iconNode = await parse(iconContent.toString(), {
transformNode: transformForward, transformNode: transformForward,
}); });
@@ -56,19 +53,15 @@ async function init() {
}), }),
); );
if (widthMap?.[outputDir] === undefined) {
throw new Error(`Could not find the directory: ${outputDir}.`)
}
await Promise.all( await Promise.all(
parsedIconNodes.map(async ([file, iconNode]) => { parsedIconNodes.map(async ([file, iconNode]) => {
iconNode.attributes['stroke-width'] = widthMap[outputDir];
const outlined = await outlineStroke(stringify(iconNode)); const outlined = await outlineStroke(stringify(iconNode));
const outlinedWithoutAttrs = await parse(outlined, { const outlinedWithoutAttrs = await parse(outlined, {
transformNode: transformBackwards, transformNode: transformBackwards,
}); });
await fs.writeFile(`./${outputDir}/${file}`, stringify(outlinedWithoutAttrs)); const filePath = path.join(targetDir, file);
await fs.writeFile(filePath, stringify(outlinedWithoutAttrs));
}), }),
); );

View File

@@ -0,0 +1,17 @@
{
"name": "outline-svg",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node ./main.mjs"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"minimist": "^1.2.6",
"svg-outline-stroke": "^1.3.1",
"svgson": "^5.2.1"
}
}