mirror of
https://github.com/lucide-icons/lucide.git
synced 2026-11-12 13:38:32 +00:00
Merge branch 'master' of github.com:lucide-icons/lucide
This commit is contained in:
Eric Fennis
@@ -33,6 +33,9 @@ jobs:
|
||||
- name: Build lucide package
|
||||
run: yarn build
|
||||
|
||||
- name: Test lucide package
|
||||
run: yarn test
|
||||
|
||||
# Build lucide-react
|
||||
- name: Install Dependencies lucide-react
|
||||
run: yarn --pure-lockfile
|
||||
@@ -42,6 +45,23 @@ jobs:
|
||||
run: yarn build
|
||||
working-directory: packages/lucide-react
|
||||
|
||||
- name: Test lucide-react
|
||||
run: yarn test
|
||||
working-directory: packages/lucide-react
|
||||
|
||||
# Build lucide-vue
|
||||
- name: Install Dependencies lucide-vue
|
||||
run: yarn --pure-lockfile
|
||||
working-directory: packages/lucide-vue
|
||||
|
||||
- name: Build lucide-vue
|
||||
run: yarn build
|
||||
working-directory: packages/lucide-vue
|
||||
|
||||
- name: Test lucide-vue
|
||||
run: yarn test
|
||||
working-directory: packages/lucide-vue
|
||||
|
||||
# Publish lucide
|
||||
- name: Set package.json version lucide
|
||||
run: yarn version --new-version ${{ steps.get_version.outputs.VERSION }} --no-git-tag-version
|
||||
@@ -58,10 +78,20 @@ jobs:
|
||||
run: yarn publish
|
||||
working-directory: packages/lucide-react
|
||||
|
||||
# Publish lucide-vue
|
||||
- name: Set package.json version lucide-vue
|
||||
run: yarn version --new-version ${{ steps.get_version.outputs.VERSION }} --no-git-tag-version
|
||||
working-directory: packages/lucide-vue
|
||||
|
||||
- name: publish lucide-vue
|
||||
run: yarn publish
|
||||
working-directory: packages/lucide-vue
|
||||
|
||||
- name: Commit package.json
|
||||
run: |
|
||||
git add package.json
|
||||
git add packages/lucide-react/package.json
|
||||
git add packages/lucide-vue/package.json
|
||||
git -c user.name="Lucide Bot" -c user.email="lucide-bot@users.noreply.github.com" \
|
||||
commit -m ":package: Bump version to ${{ steps.get_version.outputs.VERSION }}" --no-verify --quiet
|
||||
git remote set-url --push origin https://lucide-bot:$GITHUB_TOKEN@github.com/$GITHUB_REPOSITORY.git
|
||||
|
||||
@@ -5,3 +5,12 @@ node_modules
|
||||
tests
|
||||
scripts
|
||||
site
|
||||
src
|
||||
build
|
||||
babel.config.js
|
||||
categories.json
|
||||
jest.config.js
|
||||
netlify.toml
|
||||
rollup.config.js
|
||||
rollup.plugins.js
|
||||
tags.json
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<p align=center><img width="410" src="https://lucide.netlify.app/logo-text.svg" alt="Lucide Logo"></p>
|
||||
<p align=center><img width="410" src="https://lucide.dev/logo-text.svg" alt="Lucide Logo"></p>
|
||||
|
||||
# Lucide
|
||||
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M13.73 21a2 2 0 01-3.46 0" />
|
||||
<path d="M21 5h-6" />
|
||||
<path d="M18.021 9C18.29 15.193 21 17 21 17H3s3-2 3-9a6 6 0 017-5.916" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 349 B |
@@ -0,0 +1,16 @@
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M18.387 12C19.198 15.799 21 17 21 17H3s3-2 3-9a6 6 0 017-5.916" />
|
||||
<path d="M13.73 21a2 2 0 01-3.46 0" />
|
||||
<path d="M18 2v6" />
|
||||
<path d="M21 5h-6" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 374 B |
@@ -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 4H6v6h4V4z" />
|
||||
<path d="M18 14h-4v6h4v-6z" />
|
||||
<path d="M14 4h2v6m-2 0h4" />
|
||||
<path d="M6 14h2v6m-2 0h4" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 335 B |
@@ -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="M3 3v5h5" />
|
||||
<path d="M3.05 13A9 9 0 106 5.3L3 8" />
|
||||
<path d="M12 7v5l4 2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 301 B |
@@ -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="M21 11v8a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h8" />
|
||||
<path d="M8.5 10a1.5 1.5 0 100-3 1.5 1.5 0 000 3z" />
|
||||
<path d="M21 15l-5-5L5 21" />
|
||||
<path d="M22 5h-6" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 388 B |
@@ -9,9 +9,9 @@
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M21 11V19C21 20.1046 20.1046 21 19 21H5C3.89543 21 3 20.1046 3 19V5C3 3.89543 3.89543 3 5 3H13" />
|
||||
<path d="M8.5 10C9.32843 10 10 9.32843 10 8.5C10 7.67157 9.32843 7 8.5 7C7.67157 7 7 7.67157 7 8.5C7 9.32843 7.67157 10 8.5 10Z" />
|
||||
<path d="M21 15L16 10L5 21" />
|
||||
<path d="M19 2V8" />
|
||||
<path d="M22 5H16" />
|
||||
<path d="M21 11v8a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h8" />
|
||||
<path d="M8.5 10a1.5 1.5 0 100-3 1.5 1.5 0 000 3z" />
|
||||
<path d="M21 15l-5-5L5 21" />
|
||||
<path d="M19 2v6" />
|
||||
<path d="M22 5h-6" />
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 532 B After Width: | Height: | Size: 411 B |
@@ -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="M19 11V4a2 2 0 00-2-2H4a2 2 0 00-2 2v13a2 2 0 002 2h7" />
|
||||
<path d="M12 12l4.166 10 1.48-4.355L22 16.166 12 12z" />
|
||||
<path d="M18 18l3 3" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 362 B |
@@ -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="M3 3h6l6 18h6" />
|
||||
<path d="M14 3h7" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 260 B |
@@ -0,0 +1,14 @@
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<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" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 307 B |
+4
-4
@@ -9,8 +9,8 @@
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<circle cx="12" cy="11" r="1" />
|
||||
<path d="M17.03 18.46a9 9 0 10-10.02.03" />
|
||||
<path d="M16.06 13.91a5 5 0 10-7.97.2" />
|
||||
<path d="M11.11 17a.9.9 0 111.78 0l-.52 4.67a.37.37 0 01-.74 0l-.52-4.68z" />
|
||||
<circle cx="12" cy="11" r="1" />
|
||||
<path d="M17.03 18.46a9 9 0 10-10.02.03" />
|
||||
<path d="M16.06 13.91a5 5 0 10-7.97.2" />
|
||||
<path d="M11.11 17a.9.9 0 111.78 0l-.52 4.67a.37.37 0 01-.74 0l-.52-4.68z" />
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 417 B After Width: | Height: | Size: 413 B |
@@ -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="M5 16v2" />
|
||||
<path d="M19 16v2" />
|
||||
<rect x="2" y="8" width="20" height="8" rx="2" />
|
||||
<path d="M18 12h0" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 331 B |
@@ -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="M17 3v10" />
|
||||
<path d="M12.67 5.5l8.66 5" />
|
||||
<path d="M12.67 10.5l8.66-5" />
|
||||
<path d="M9 17a2 2 0 00-2-2H5a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2z" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 380 B |
@@ -0,0 +1,14 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M7 21h10" />
|
||||
<rect x="2" y="3" width="20" height="14" rx="2" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 285 B |
+3
-3
@@ -9,7 +9,7 @@
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<circle cx="12" cy="10" r="8" />
|
||||
<circle cx="12" cy="10" r="3" />
|
||||
<path d="M12 22V18M7 22H12H7ZM17 22H12H17Z" />
|
||||
<circle cx="12" cy="10" r="8" />
|
||||
<circle cx="12" cy="10" r="3" />
|
||||
<path d="M12 22v-4m-5 4h5-5zm10 0h-5 5z" />
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 330 B After Width: | Height: | Size: 324 B |
+5
-4
@@ -3,10 +3,11 @@
|
||||
"description": "Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
|
||||
"version": "0.13.0",
|
||||
"license": "ISC",
|
||||
"homepage": "https://lucide.netlify.app",
|
||||
"repository": "github:lucide-icons/lucide",
|
||||
"bugs": {
|
||||
"url": "https://github.com/lucide-icons/lucide/issues"
|
||||
"homepage": "https://lucide.dev",
|
||||
"bugs": "https://github.com/lucide-icons/lucide/issues",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/lucide-icons/lucide.git"
|
||||
},
|
||||
"amdName": "lucide",
|
||||
"source": "build/lucide.js",
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
stats
|
||||
node_modules
|
||||
tests
|
||||
scripts
|
||||
build
|
||||
src
|
||||
babel.config.js
|
||||
jest.config.js
|
||||
rollup.config.js
|
||||
@@ -15,7 +15,7 @@ npm install lucide-react
|
||||
## How to use
|
||||
|
||||
It's build with ESmodules so it's completely threeshakable.
|
||||
Each icon can be imported as an react component.
|
||||
Each icon can be imported as a react component.
|
||||
|
||||
### Example
|
||||
|
||||
@@ -56,7 +56,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.
|
||||
> :warning: 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
|
||||
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
// module.exports = require('../../babel.config');
|
||||
module.exports = {
|
||||
presets: ['react-app'],
|
||||
};
|
||||
|
||||
@@ -3,35 +3,39 @@
|
||||
"description": "Lucide React package, Lucide is a community-run fork of Feather Icons, open for anyone to contribute icons.",
|
||||
"version": "0.13.0",
|
||||
"license": "ISC",
|
||||
"homepage": "https://lucide.dev",
|
||||
"bugs": "https://github.com/lucide-icons/lucide/issues",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/lucide-icons/lucide.git",
|
||||
"directory": "packages/lucide-react"
|
||||
},
|
||||
"author": "Eric Fennis",
|
||||
"amdName": "lucide-react",
|
||||
"source": "build/lucide-react.js",
|
||||
"main": "dist/cjs/lucide-react.js",
|
||||
"main:umd": "dist/umd/lucide-react.js",
|
||||
"module": "dist/esm/lucide-react.js",
|
||||
"unpkg": "dist/umd/lucide-react.min.js",
|
||||
"repository": "github:lucide-icons/lucide",
|
||||
"author": "Eric Fennis",
|
||||
"scripts": {
|
||||
"build": "yarn clean && yarn build:move && yarn build:icons && yarn build:es && yarn build:bundles",
|
||||
"clean": "rm -rf dist && rm -rf build",
|
||||
"build:move": "cp -av src build",
|
||||
"build:icons": "yarn --cwd ../../ build:icons --output=../packages/lucide-react/build --templateSrc=../packages/lucide-react/scripts/exportTemplate --camelizeAttrs --renderUniqueKey",
|
||||
"build:icons": "yarn --cwd ../../ build:icons --output=../packages/lucide-react/build --templateSrc=../packages/lucide-react/scripts/exportTemplate --camelizeAttrs --noDefaultAttrs --renderUniqueKey",
|
||||
"build:es": "yarn --cwd ../../ babel packages/lucide-react/build -d packages/lucide-react/dist/esm",
|
||||
"build:bundles": "yarn --cwd ../../ rollup -c packages/lucide-react/rollup.config.js",
|
||||
"test": "jest"
|
||||
},
|
||||
"dependencies": {
|
||||
"prop-types": "^15.7.2",
|
||||
"react": "^17.0.1"
|
||||
"react": "^16.5.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-preset-react-app": "^10.0.0",
|
||||
"jest": "^26.6.3",
|
||||
"lucide": "file:../..",
|
||||
"react-test-renderer": "^17.0.1"
|
||||
"react-test-renderer": "^16.5.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"prop-types": "^15.7.2",
|
||||
"react": "^17.0.1"
|
||||
"react": "^16.5.1"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
const plugins = require('lucide/rollup.plugins');
|
||||
const plugins = require('../../rollup.plugins');
|
||||
const pkg = require('./package.json');
|
||||
|
||||
const outputFileName = pkg.name;
|
||||
const packageName = 'LucideReact';
|
||||
const outputFileName = 'lucide-react';
|
||||
const rootDir = 'packages/lucide-react'; // It runs from the root
|
||||
const outputDir = `${rootDir}/dist`;
|
||||
const inputs = [`${rootDir}/build/lucide-react.js`];
|
||||
@@ -31,7 +32,7 @@ const configs = bundles
|
||||
plugins: plugins(pkg, minify),
|
||||
external: ['react', 'prop-types'],
|
||||
output: {
|
||||
name: outputFileName,
|
||||
name: packageName,
|
||||
file: `${outputDir}/${format}/${outputFileName}${minify ? '.min' : ''}.js`,
|
||||
format,
|
||||
sourcemap: true,
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
export default ({ componentName, node }) => `
|
||||
import createReactComponent from '../createReactComponent';
|
||||
import defaultAttributes from '../defaultAttributes';
|
||||
|
||||
const ${componentName} = createReactComponent('${componentName}', ${node});
|
||||
const ${componentName} = createReactComponent('${componentName}', ['svg', defaultAttributes, ${node}]);
|
||||
|
||||
export default ${componentName};
|
||||
`;
|
||||
|
||||
@@ -11,7 +11,7 @@ export default (iconName, [tag, attrs, children]) => {
|
||||
...attrs,
|
||||
width: size,
|
||||
height: size,
|
||||
color,
|
||||
stroke: color,
|
||||
strokeWidth,
|
||||
...rest,
|
||||
},
|
||||
|
||||
@@ -0,0 +1,11 @@
|
||||
export default {
|
||||
xmlns: 'http://www.w3.org/2000/svg',
|
||||
width: 24,
|
||||
height: 24,
|
||||
viewBox: '0 0 24 24',
|
||||
fill: 'none',
|
||||
stroke: 'currentColor',
|
||||
strokeWidth: 2,
|
||||
strokeLinecap: 'round',
|
||||
strokeLinejoin: 'round',
|
||||
};
|
||||
@@ -2,7 +2,6 @@
|
||||
|
||||
exports[`Using lucide icon components should adjust the size, stroke color and stroke width 1`] = `
|
||||
<svg
|
||||
color="currentColor"
|
||||
fill="none"
|
||||
height={48}
|
||||
stroke="red"
|
||||
@@ -50,7 +49,6 @@ exports[`Using lucide icon components should adjust the size, stroke color and s
|
||||
|
||||
exports[`Using lucide icon components should render an component 1`] = `
|
||||
<svg
|
||||
color="currentColor"
|
||||
fill="none"
|
||||
height={24}
|
||||
stroke="currentColor"
|
||||
|
||||
@@ -3246,9 +3246,6 @@ lru-cache@^6.0.0:
|
||||
dependencies:
|
||||
yallist "^4.0.0"
|
||||
|
||||
"lucide@file:../..":
|
||||
version "0.11.0"
|
||||
|
||||
make-dir@^3.0.0:
|
||||
version "3.1.0"
|
||||
resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.1.0.tgz#415e967046b3a7f1d185277d84aa58203726a13f"
|
||||
@@ -3661,7 +3658,7 @@ prompts@^2.0.1:
|
||||
kleur "^3.0.3"
|
||||
sisteransi "^1.0.5"
|
||||
|
||||
prop-types@^15.7.2:
|
||||
prop-types@^15.6.2, prop-types@^15.7.2:
|
||||
version "15.7.2"
|
||||
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
|
||||
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
|
||||
@@ -3693,41 +3690,34 @@ qs@~6.5.2:
|
||||
resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"
|
||||
integrity sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==
|
||||
|
||||
"react-is@^16.12.0 || ^17.0.0", react-is@^17.0.1:
|
||||
version "17.0.1"
|
||||
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.1.tgz#5b3531bd76a645a4c9fb6e693ed36419e3301339"
|
||||
integrity sha512-NAnt2iGDXohE5LI7uBnLnqvLQMtzhkiAOLXTmv+qnF9Ky7xAPcX8Up/xWIhxvLVGJvuLiNc4xQLtuqDRzb4fSA==
|
||||
|
||||
react-is@^16.8.1:
|
||||
react-is@^16.8.1, react-is@^16.8.6:
|
||||
version "16.13.1"
|
||||
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
|
||||
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
|
||||
|
||||
react-shallow-renderer@^16.13.1:
|
||||
version "16.14.1"
|
||||
resolved "https://registry.yarnpkg.com/react-shallow-renderer/-/react-shallow-renderer-16.14.1.tgz#bf0d02df8a519a558fd9b8215442efa5c840e124"
|
||||
integrity sha512-rkIMcQi01/+kxiTE9D3fdS959U1g7gs+/rborw++42m1O9FAQiNI/UNRZExVUoAOprn4umcXf+pFRou8i4zuBg==
|
||||
react-is@^17.0.1:
|
||||
version "17.0.1"
|
||||
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.1.tgz#5b3531bd76a645a4c9fb6e693ed36419e3301339"
|
||||
integrity sha512-NAnt2iGDXohE5LI7uBnLnqvLQMtzhkiAOLXTmv+qnF9Ky7xAPcX8Up/xWIhxvLVGJvuLiNc4xQLtuqDRzb4fSA==
|
||||
|
||||
react-test-renderer@^16.5.1:
|
||||
version "16.14.0"
|
||||
resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.14.0.tgz#e98360087348e260c56d4fe2315e970480c228ae"
|
||||
integrity sha512-L8yPjqPE5CZO6rKsKXRO/rVPiaCOy0tQQJbC+UjPNlobl5mad59lvPjwFsQHTvL03caVDIVr9x9/OSgDe6I5Eg==
|
||||
dependencies:
|
||||
object-assign "^4.1.1"
|
||||
react-is "^16.12.0 || ^17.0.0"
|
||||
prop-types "^15.6.2"
|
||||
react-is "^16.8.6"
|
||||
scheduler "^0.19.1"
|
||||
|
||||
react-test-renderer@^17.0.1:
|
||||
version "17.0.1"
|
||||
resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-17.0.1.tgz#3187e636c3063e6ae498aedf21ecf972721574c7"
|
||||
integrity sha512-/dRae3mj6aObwkjCcxZPlxDFh73XZLgvwhhyON2haZGUEhiaY5EjfAdw+d/rQmlcFwdTpMXCSGVk374QbCTlrA==
|
||||
dependencies:
|
||||
object-assign "^4.1.1"
|
||||
react-is "^17.0.1"
|
||||
react-shallow-renderer "^16.13.1"
|
||||
scheduler "^0.20.1"
|
||||
|
||||
react@^17.0.1:
|
||||
version "17.0.1"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-17.0.1.tgz#6e0600416bd57574e3f86d92edba3d9008726127"
|
||||
integrity sha512-lG9c9UuMHdcAexXtigOZLX8exLWkW0Ku29qPRU8uhF2R9BN96dLCt0psvzPLlHc5OWkgymP3qwTRgbnw5BKx3w==
|
||||
react@^16.5.1:
|
||||
version "16.14.0"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-16.14.0.tgz#94d776ddd0aaa37da3eda8fc5b6b18a4c9a3114d"
|
||||
integrity sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
prop-types "^15.6.2"
|
||||
|
||||
read-pkg-up@^7.0.1:
|
||||
version "7.0.1"
|
||||
@@ -3962,10 +3952,10 @@ saxes@^5.0.0:
|
||||
dependencies:
|
||||
xmlchars "^2.2.0"
|
||||
|
||||
scheduler@^0.20.1:
|
||||
version "0.20.1"
|
||||
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.20.1.tgz#da0b907e24026b01181ecbc75efdc7f27b5a000c"
|
||||
integrity sha512-LKTe+2xNJBNxu/QhHvDR14wUXHRQbVY5ZOYpOGWRzhydZUqrLb2JBvLPY7cAqFmqrWuDED0Mjk7013SZiOz6Bw==
|
||||
scheduler@^0.19.1:
|
||||
version "0.19.1"
|
||||
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.19.1.tgz#4f3e2ed2c1a7d65681f4c854fa8c5a1ccb40f196"
|
||||
integrity sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
stats
|
||||
node_modules
|
||||
tests
|
||||
scripts
|
||||
build
|
||||
src
|
||||
babel.config.js
|
||||
jest.config.js
|
||||
rollup.config.js
|
||||
@@ -0,0 +1,103 @@
|
||||
# Lucide Vue
|
||||
|
||||
Use the lucide icon library in you Vue app.
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
yarn add lucide-vue
|
||||
|
||||
# or
|
||||
|
||||
npm install lucide-vue
|
||||
```
|
||||
|
||||
## How to use
|
||||
|
||||
It's build with ESmodules so it's completely threeshakable.
|
||||
Each icon can be imported as a vue component.
|
||||
|
||||
### Example
|
||||
|
||||
You can pass additional props to adjust the icon.
|
||||
|
||||
``` vue
|
||||
<template>
|
||||
<Camera
|
||||
color="red"
|
||||
:size="32"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Returns Vue component
|
||||
import { Camera } from 'lucide-vue';
|
||||
|
||||
export default {
|
||||
name: "My Component",
|
||||
components: { Camera }
|
||||
}
|
||||
|
||||
</script>
|
||||
```
|
||||
|
||||
### Props
|
||||
|
||||
| name | type | default
|
||||
| ------------ | -------- | --------
|
||||
| `size` | *Number* | 24
|
||||
| `color` | *String* | currentColor
|
||||
| `strokeWidth`| *Number* | 2
|
||||
| `defaultClass`| *String* | lucide-icon
|
||||
|
||||
### Custom props
|
||||
|
||||
You can also pass custom props that will be added in the svg as attributes.
|
||||
|
||||
``` vue
|
||||
<template>
|
||||
<Camera fill="red" />
|
||||
</template>
|
||||
```
|
||||
|
||||
### One generic icon component
|
||||
|
||||
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.
|
||||
|
||||
#### Icon Component Example
|
||||
|
||||
``` vue
|
||||
<template>
|
||||
<component :is="icon" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as icons from "lucide-vue";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
name: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
icon() {
|
||||
return icons[this.name];
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
```
|
||||
|
||||
##### Then you can use it like this
|
||||
|
||||
``` vue
|
||||
<template>
|
||||
<div id="app">
|
||||
<Icon name="Airplay" />
|
||||
</div>
|
||||
</template>
|
||||
```
|
||||
@@ -0,0 +1,12 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
[
|
||||
'@babel/preset-env',
|
||||
{
|
||||
targets: {
|
||||
node: 'current',
|
||||
},
|
||||
},
|
||||
],
|
||||
],
|
||||
};
|
||||
@@ -0,0 +1,14 @@
|
||||
module.exports = {
|
||||
verbose: true,
|
||||
roots: ['<rootDir>/src/', '<rootDir>/tests/'],
|
||||
moduleFileExtensions: ['js'],
|
||||
transform: {
|
||||
'^.+\\.js$': 'babel-jest',
|
||||
'^.+\\.vue$': 'vue-jest',
|
||||
},
|
||||
transformIgnorePatterns: [`/node_modules`],
|
||||
snapshotSerializers: ['<rootDir>/node_modules/jest-serializer-vue'],
|
||||
moduleNameMapper: {
|
||||
'^@/(.*)$': '<rootDir>/src/$1',
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,44 @@
|
||||
{
|
||||
"name": "lucide-vue",
|
||||
"version": "0.13.0-beta.1",
|
||||
"author": "Eric Fennis",
|
||||
"description": "Lucide Vue Package",
|
||||
"license": "ISC",
|
||||
"homepage": "https://lucide.dev",
|
||||
"bugs": "https://github.com/lucide-icons/lucide/issues",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/lucide-icons/lucide.git",
|
||||
"directory": "packages/lucide-vue"
|
||||
},
|
||||
"amdName": "lucide-vue",
|
||||
"source": "build/lucide-vue.js",
|
||||
"main": "dist/cjs/lucide-vue.js",
|
||||
"main:umd": "dist/umd/lucide-vue.js",
|
||||
"module": "dist/esm/lucide-vue.js",
|
||||
"unpkg": "dist/umd/lucide-vue.min.js",
|
||||
"dependencies": {
|
||||
"vue": "^2.6.12"
|
||||
},
|
||||
"scripts": {
|
||||
"build": "yarn clean && yarn build:move && yarn build:icons && yarn build:es && yarn build:bundles",
|
||||
"clean": "rm -rf dist && rm -rf build",
|
||||
"build:move": "cp -av src build",
|
||||
"build:icons": "yarn --cwd ../../ build:icons --output=../packages/lucide-vue/build --templateSrc=../packages/lucide-vue/scripts/exportTemplate --noDefaultAttrs",
|
||||
"build:es": "yarn --cwd ../../ babel packages/lucide-vue/build -d packages/lucide-vue/dist/esm",
|
||||
"build:bundles": "yarn --cwd ../../ rollup -c packages/lucide-vue/rollup.config.js",
|
||||
"test": "jest",
|
||||
"test:watch": "jest --watchAll"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/test-utils": "^1.1.2",
|
||||
"babel-jest": "^26.6.3",
|
||||
"jest": "^26.6.3",
|
||||
"jest-serializer-vue": "^2.0.2",
|
||||
"vue-jest": "^3.0.7",
|
||||
"vue-template-compiler": "^2.6.12"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": "^2.6.12"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,47 @@
|
||||
const plugins = require('../../rollup.plugins');
|
||||
const pkg = require('./package.json');
|
||||
|
||||
const packageName = 'LucideVue';
|
||||
const outputFileName = 'lucide-vue';
|
||||
const rootDir = 'packages/lucide-vue'; // It runs from the root
|
||||
const outputDir = `${rootDir}/dist`;
|
||||
const inputs = [`${rootDir}/build/lucide-vue.js`];
|
||||
const bundles = [
|
||||
{
|
||||
format: 'umd',
|
||||
inputs,
|
||||
outputDir,
|
||||
minify: true,
|
||||
},
|
||||
{
|
||||
format: 'umd',
|
||||
inputs,
|
||||
outputDir,
|
||||
},
|
||||
{
|
||||
format: 'cjs',
|
||||
inputs,
|
||||
outputDir,
|
||||
},
|
||||
];
|
||||
|
||||
const configs = bundles
|
||||
.map(({ inputs, outputDir, format, minify }) =>
|
||||
inputs.map(input => ({
|
||||
input,
|
||||
plugins: plugins(pkg, minify),
|
||||
external: ['vue'],
|
||||
output: {
|
||||
name: packageName,
|
||||
file: `${outputDir}/${format}/${outputFileName}${minify ? '.min' : ''}.js`,
|
||||
format,
|
||||
sourcemap: true,
|
||||
globals: {
|
||||
vue: 'vue',
|
||||
},
|
||||
},
|
||||
})),
|
||||
)
|
||||
.flat();
|
||||
|
||||
export default configs;
|
||||
@@ -0,0 +1,8 @@
|
||||
export default ({ componentName, node }) => `
|
||||
import createVueComponent from '../createVueComponent';
|
||||
import defaultAttributes from '../defaultAttributes';
|
||||
|
||||
const ${componentName} = createVueComponent('${componentName}Icon', ['svg', defaultAttributes, ${node}]);
|
||||
|
||||
export default ${componentName};
|
||||
`;
|
||||
@@ -0,0 +1,47 @@
|
||||
export default (iconName, [tag, defaultAttrs, children]) => ({
|
||||
name: iconName,
|
||||
functional: true,
|
||||
props: {
|
||||
color: {
|
||||
type: String,
|
||||
default: 'currentColor',
|
||||
},
|
||||
size: {
|
||||
type: Number,
|
||||
default: 24,
|
||||
},
|
||||
strokeWidth: {
|
||||
type: Number,
|
||||
default: 2,
|
||||
},
|
||||
defaultClass: {
|
||||
type: String,
|
||||
default: 'lucide-icon',
|
||||
},
|
||||
},
|
||||
render(
|
||||
createElement,
|
||||
{
|
||||
props: { color, size, strokeWidth, defaultClass },
|
||||
data,
|
||||
},
|
||||
) {
|
||||
return createElement(
|
||||
tag,
|
||||
{
|
||||
// eslint-disable-next-line prettier/prettier
|
||||
class: [defaultClass, data.class, data.staticClass, data.attrs && data.attrs.class].filter(Boolean),
|
||||
style: [data.style, data.staticStyle, data.attrs && data.attrs.style].filter(Boolean),
|
||||
attrs: {
|
||||
...defaultAttrs,
|
||||
width: size,
|
||||
height: size,
|
||||
stroke: color,
|
||||
'stroke-width': strokeWidth,
|
||||
...data.attrs,
|
||||
},
|
||||
},
|
||||
children.map(([childTag, childAttrs]) => createElement(childTag, { attrs: childAttrs })),
|
||||
);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,11 @@
|
||||
export default {
|
||||
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',
|
||||
};
|
||||
@@ -0,0 +1,5 @@
|
||||
/*
|
||||
Icons exports.
|
||||
|
||||
Will be generated
|
||||
*/
|
||||
@@ -0,0 +1 @@
|
||||
export * from './icons';
|
||||
@@ -0,0 +1,37 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Using lucide icon components should add a class to the element 1`] = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide-icon my-icon">
|
||||
<circle cx="12" cy="12" r="10"></circle>
|
||||
<path d="M8 14s1.5 2 4 2 4-2 4-2"></path>
|
||||
<line x1="9" y1="9" x2="9.01" y2="9"></line>
|
||||
<line x1="15" y1="9" x2="15.01" y2="9"></line>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
exports[`Using lucide icon components should add a style attribute to the element 1`] = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="position: absolute" class="lucide-icon">
|
||||
<circle cx="12" cy="12" r="10"></circle>
|
||||
<path d="M8 14s1.5 2 4 2 4-2 4-2"></path>
|
||||
<line x1="9" y1="9" x2="9.01" y2="9"></line>
|
||||
<line x1="15" y1="9" x2="15.01" y2="9"></line>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
exports[`Using lucide icon components should adjust the size, stroke color and stroke width 1`] = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="red" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" class="lucide-icon">
|
||||
<circle cx="12" cy="12" r="10"></circle>
|
||||
<path d="M8 14s1.5 2 4 2 4-2 4-2"></path>
|
||||
<line x1="9" y1="9" x2="9.01" y2="9"></line>
|
||||
<line x1="15" y1="9" x2="15.01" y2="9"></line>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
exports[`Using lucide icon components should render an component 1`] = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide-icon">
|
||||
<circle cx="12" cy="12" r="10"></circle>
|
||||
<path d="M8 14s1.5 2 4 2 4-2 4-2"></path>
|
||||
<line x1="9" y1="9" x2="9.01" y2="9"></line>
|
||||
<line x1="15" y1="9" x2="15.01" y2="9"></line>
|
||||
</svg>
|
||||
`;
|
||||
@@ -0,0 +1,45 @@
|
||||
import { mount } from '@vue/test-utils'
|
||||
import { Smile } from '..'
|
||||
|
||||
describe('Using lucide icon components', () => {
|
||||
it('should render an component', () => {
|
||||
const wrapper = mount(Smile)
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('should adjust the size, stroke color and stroke width', () => {
|
||||
const wrapper = mount(Smile, {
|
||||
propsData: {
|
||||
size: 48,
|
||||
stroke: 'red',
|
||||
strokeWidth: 4
|
||||
}
|
||||
})
|
||||
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
|
||||
it('should add a class to the element', () => {
|
||||
const wrapper = mount(Smile, {
|
||||
attrs: {
|
||||
class: "my-icon"
|
||||
}
|
||||
})
|
||||
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
expect(String(wrapper.classes())).toBe(String(['lucide-icon', 'my-icon']))
|
||||
});
|
||||
|
||||
it('should add a style attribute to the element', () => {
|
||||
const wrapper = mount(Smile, {
|
||||
attrs: {
|
||||
style: 'position: absolute',
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
expect(wrapper.attributes('style')).toContain('position: absolute')
|
||||
});
|
||||
});
|
||||
File diff suppressed because it is too large
Load Diff
@@ -38,13 +38,15 @@ export default (iconsObject, options) => {
|
||||
];
|
||||
});
|
||||
|
||||
iconNodes[icon] = [
|
||||
'svg',
|
||||
{
|
||||
...(options.camelizeAttrs ? camelizeAttrs(DEFAULT_ATTRS) : DEFAULT_ATTRS),
|
||||
},
|
||||
children,
|
||||
];
|
||||
iconNodes[icon] = !options.noDefaultAttrs
|
||||
? [
|
||||
'svg',
|
||||
{
|
||||
...(options.camelizeAttrs ? camelizeAttrs(DEFAULT_ATTRS) : DEFAULT_ATTRS),
|
||||
},
|
||||
children,
|
||||
]
|
||||
: children;
|
||||
});
|
||||
|
||||
return iconNodes;
|
||||
|
||||
+1
-2
@@ -13,7 +13,7 @@
|
||||
"dependencies": {
|
||||
"@chakra-ui/core": "^1.0.0-rc.8",
|
||||
"downloadjs": "^1.4.7",
|
||||
"framer-motion": "^2.9.4",
|
||||
"framer-motion": "^3.3.0",
|
||||
"fuse.js": "^6.0.4",
|
||||
"jszip": "^3.4.0",
|
||||
"lodash": "^4.17.20",
|
||||
@@ -23,7 +23,6 @@
|
||||
"react": "^16.13.1",
|
||||
"react-color": "2.17.3",
|
||||
"react-dom": "^16.13.1",
|
||||
"react-spring": "^8.0.27",
|
||||
"react-svg-loader": "^3.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import {Button, Flex, Link, Stack, Text,} from "@chakra-ui/core";
|
||||
import {Button, Flex, Link, WrapItem, Text, Wrap,} from "@chakra-ui/core";
|
||||
import download from "downloadjs";
|
||||
import JSZip from "jszip";
|
||||
import { Download, Github } from 'lucide-react';
|
||||
@@ -30,15 +30,26 @@ const Header = ({ data }) => {
|
||||
<Text fontSize="lg" as="p" textAlign="center" mb="8">
|
||||
An open-source icon library, a fork of <Link href="https://github.com/feathericons/feather" isExternal>Feather Icons</Link>. <br/>We're expanding the icon set as much as possible while keeping it nice-looking - <Link href={repositoryUrl} isExternal>join us</Link>!
|
||||
</Text>
|
||||
<Stack isInline marginTop={3} marginBottom={10}>
|
||||
<Button
|
||||
leftIcon={<Download/>}
|
||||
size="lg"
|
||||
onClick={downloadAllIcons}
|
||||
>
|
||||
Download all
|
||||
</Button>
|
||||
<Wrap
|
||||
isInline
|
||||
marginTop={3}
|
||||
marginBottom={10}
|
||||
spacing="15px"
|
||||
justify="center"
|
||||
>
|
||||
<WrapItem>
|
||||
<Button
|
||||
leftIcon={<Download/>}
|
||||
size="lg"
|
||||
onClick={downloadAllIcons}
|
||||
>
|
||||
Download all
|
||||
</Button>
|
||||
</WrapItem>
|
||||
<WrapItem>
|
||||
<IconCustomizerDrawer/>
|
||||
</WrapItem>
|
||||
<WrapItem>
|
||||
<Button
|
||||
as="a"
|
||||
leftIcon={<Github/>}
|
||||
@@ -49,7 +60,8 @@ const Header = ({ data }) => {
|
||||
>
|
||||
Github
|
||||
</Button>
|
||||
</Stack>
|
||||
</WrapItem>
|
||||
</Wrap>
|
||||
</Flex>
|
||||
)
|
||||
};
|
||||
|
||||
@@ -1,41 +1,37 @@
|
||||
import { useSpring, animated } from "react-spring";
|
||||
import { Box, Text, IconButton, useColorMode, Flex, ButtonGroup, Button, useToast } from "@chakra-ui/core";
|
||||
import { Box, Text, IconButton, useColorMode, Flex, Slide, ButtonGroup, Button, useToast, Heading, Avatar, AvatarGroup, Link, Tooltip, useMediaQuery, useDisclosure } from "@chakra-ui/core";
|
||||
import theme from "../lib/theme";
|
||||
import download from 'downloadjs';
|
||||
import copy from "copy-to-clipboard";
|
||||
import { X as Close } from 'lucide-react';
|
||||
import {useContext, useRef} from "react";
|
||||
import {useContext, useEffect, useRef} from "react";
|
||||
import {IconStyleContext} from "./CustomizeIconContext";
|
||||
import {IconWrapper} from "./IconWrapper";
|
||||
import ModifiedTooltip from "./ModifiedTooltip";
|
||||
|
||||
type IconDownload = {
|
||||
src: string;
|
||||
name: string;
|
||||
};
|
||||
|
||||
const IconDetailOverlay = ({ isOpen = true, onClose, icon }) => {
|
||||
const IconDetailOverlay = ({ open = true, close, icon }) => {
|
||||
const toast = useToast();
|
||||
const { colorMode } = useColorMode();
|
||||
const { tags = [], name } = icon;
|
||||
const {color, strokeWidth, size} = useContext(IconStyleContext);
|
||||
const iconRef = useRef<SVGSVGElement>(null);
|
||||
|
||||
const { transform, opacity } = useSpring({
|
||||
opacity: isOpen ? 1 : 0,
|
||||
transform: `translateY(${isOpen ? -120 : 0}%)`,
|
||||
config: { mass: 5, tension: 500, friction: 80 },
|
||||
});
|
||||
const [isMobile] = useMediaQuery("(max-width: 560px)")
|
||||
const { isOpen, onOpen, onClose } = useDisclosure()
|
||||
|
||||
const handleClose = () => {
|
||||
onClose();
|
||||
close();
|
||||
};
|
||||
|
||||
const panelStyling = {
|
||||
transform: transform.interpolate(t => t),
|
||||
opacity: opacity.interpolate(o => o),
|
||||
width: "100%",
|
||||
willChange: "transform"
|
||||
}
|
||||
useEffect(() => {
|
||||
if(open) {
|
||||
onOpen()
|
||||
}
|
||||
}, [open])
|
||||
|
||||
const iconStyling = (isLight) => ({
|
||||
height: "25vw",
|
||||
@@ -88,6 +84,7 @@ const IconDetailOverlay = ({ isOpen = true, onClose, icon }) => {
|
||||
height={0}
|
||||
key={name}
|
||||
>
|
||||
<Slide direction="bottom" in={isOpen} style={{ zIndex: 10 }}>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
justifyContent="space-between"
|
||||
@@ -98,9 +95,7 @@ const IconDetailOverlay = ({ isOpen = true, onClose, icon }) => {
|
||||
w="full"
|
||||
px={8}
|
||||
>
|
||||
<animated.div
|
||||
style={panelStyling}
|
||||
>
|
||||
|
||||
<Box
|
||||
borderWidth="1px"
|
||||
rounded="lg"
|
||||
@@ -163,11 +158,25 @@ const IconDetailOverlay = ({ isOpen = true, onClose, icon }) => {
|
||||
</svg>
|
||||
</Box>
|
||||
</Flex>
|
||||
<Flex marginLeft={[0, 8]}>
|
||||
<Box>
|
||||
<Text fontSize="3xl" style={{ cursor: "pointer" }} mb={1}>
|
||||
{icon.name}
|
||||
</Text>
|
||||
<Flex marginLeft={[0, 8]} w="100%">
|
||||
<Box w="100%">
|
||||
<Flex
|
||||
justify={isMobile ? 'center' : 'flex-start'}
|
||||
marginTop={isMobile ? 10 : 0}
|
||||
>
|
||||
<Box
|
||||
position="relative"
|
||||
mb={1}
|
||||
display="inline-block"
|
||||
style={{ cursor: "pointer" }}
|
||||
pr={6}
|
||||
>
|
||||
<Text fontSize="3xl">
|
||||
{icon.name}
|
||||
</Text>
|
||||
{ icon?.contributors?.length ? ( <ModifiedTooltip/> ) : null}
|
||||
</Box>
|
||||
</Flex>
|
||||
<Box mb={4}>
|
||||
{ tags?.length ? (
|
||||
<Text
|
||||
@@ -187,23 +196,42 @@ const IconDetailOverlay = ({ isOpen = true, onClose, icon }) => {
|
||||
Edit Tags
|
||||
</Button> */}
|
||||
</Box>
|
||||
<ButtonGroup spacing={4}>
|
||||
<Button variant="solid" onClick={() => downloadIcon({src: iconRef.current.outerHTML, name: icon.name})} mb={1}>
|
||||
Download SVG
|
||||
</Button>
|
||||
<Button variant="solid" onClick={() => copyIcon({src: iconRef.current.outerHTML, name: icon.name})} mb={1}>
|
||||
Copy SVG
|
||||
</Button>
|
||||
<Button variant="solid" onClick={() => downloadPNG({src: iconRef.current.outerHTML, name: icon.name})} mb={1}>
|
||||
Download PNG
|
||||
</Button>
|
||||
</ButtonGroup>
|
||||
<Box overflowY="auto" w="100%" pt={1} pb={1}>
|
||||
<ButtonGroup spacing={4}>
|
||||
<Button variant="solid" onClick={() => downloadIcon({src: iconRef.current.outerHTML, name: icon.name})} mb={1}>
|
||||
Download SVG
|
||||
</Button>
|
||||
<Button variant="solid" onClick={() => copyIcon({src: iconRef.current.outerHTML, name: icon.name})} mb={1}>
|
||||
Copy SVG
|
||||
</Button>
|
||||
<Button variant="solid" onClick={() => downloadPNG({src: iconRef.current.outerHTML, name: icon.name})} mb={1}>
|
||||
Download PNG
|
||||
</Button>
|
||||
</ButtonGroup>
|
||||
</Box>
|
||||
{ icon?.contributors?.length ? (
|
||||
<>
|
||||
<Heading as="h5" size="sm" marginTop={4} marginBottom={2}>
|
||||
Contributors:
|
||||
</Heading>
|
||||
<AvatarGroup size="md">
|
||||
{ icon.contributors.map((commit, index) => (
|
||||
<Link href={`https://github.com/${commit.author}`} isExternal key={`${index}_${commit.sha}`}>
|
||||
<Tooltip label={commit.author} key={commit.sha}>
|
||||
<Avatar name={commit.author} showBorder={false} src={`https://github.com/${commit.author}.png?size=88`} />
|
||||
</Tooltip>
|
||||
</Link>
|
||||
)) }
|
||||
</AvatarGroup>
|
||||
</>
|
||||
) : null }
|
||||
</Box>
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Box>
|
||||
</animated.div>
|
||||
|
||||
</Flex>
|
||||
</Slide>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -6,6 +6,7 @@ import {useContext, useMemo} from "react";
|
||||
import {IconStyleContext} from "./CustomizeIconContext";
|
||||
import {IconWrapper} from "./IconWrapper";
|
||||
import { useRouter } from "next/router";
|
||||
import ModifiedTooltip from './ModifiedTooltip';
|
||||
|
||||
const IconList = ({icons}) => {
|
||||
const router = useRouter()
|
||||
@@ -17,13 +18,13 @@ const IconList = ({icons}) => {
|
||||
|
||||
return (
|
||||
<Grid
|
||||
templateColumns={`repeat(auto-fill, minmax(160px, 1fr))`}
|
||||
templateColumns={`repeat(auto-fill, minmax(150px, 1fr))`}
|
||||
gap={5}
|
||||
marginBottom="320px"
|
||||
>
|
||||
{ icons.map((icon) => {
|
||||
const actualIcon = icon.item ? icon.item : icon;
|
||||
const { name, content } = actualIcon;
|
||||
const { name, content, contributors } = actualIcon;
|
||||
|
||||
return (
|
||||
<Link
|
||||
@@ -42,6 +43,7 @@ const IconList = ({icons}) => {
|
||||
borderWidth="1px"
|
||||
rounded="lg"
|
||||
padding={16}
|
||||
position="relative"
|
||||
onClick={(event) => {
|
||||
if (event.shiftKey) {
|
||||
copy(actualIcon.src);
|
||||
@@ -63,6 +65,7 @@ const IconList = ({icons}) => {
|
||||
key={name}
|
||||
alignItems="center"
|
||||
>
|
||||
{ contributors?.length ? ( <ModifiedTooltip/> ) : null}
|
||||
<Flex direction="column" align="center" justify="center">
|
||||
<IconWrapper
|
||||
content={content}
|
||||
|
||||
@@ -38,7 +38,7 @@ const Layout = ({ children }) => {
|
||||
maxW="1250px"
|
||||
margin="0 auto"
|
||||
w="full"
|
||||
px={8}
|
||||
px={5}
|
||||
>
|
||||
<Flex justifyContent="center" alignItems="center">
|
||||
<NextLink href="/" passHref>
|
||||
@@ -77,7 +77,7 @@ const Layout = ({ children }) => {
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Flex>
|
||||
<Flex margin="0 auto" direction="column" maxW="1250px" px={8}>
|
||||
<Flex margin="0 auto" direction="column" maxW="1250px" px={5}>
|
||||
{children}
|
||||
<Divider marginBottom={8} />
|
||||
<p style={{ alignSelf: "center" }}>
|
||||
|
||||
@@ -0,0 +1,31 @@
|
||||
import { Box, Tooltip, useColorMode } from "@chakra-ui/core";
|
||||
import theme from '../lib/theme';
|
||||
|
||||
const ModifiedTooltip = ({}) => {
|
||||
const { colorMode } = useColorMode();
|
||||
|
||||
return (
|
||||
<Tooltip
|
||||
hasArrow
|
||||
label="This is new or modified icon"
|
||||
bg={colorMode === 'light' ? theme.colors.white : theme.colors.gray[700]}
|
||||
color={colorMode === 'dark' ? theme.colors.white : null}
|
||||
>
|
||||
<Box
|
||||
{
|
||||
...{
|
||||
position: 'absolute',
|
||||
height: '8px',
|
||||
width: '8px',
|
||||
background: '#F56565',
|
||||
top: '8px',
|
||||
right: '8px',
|
||||
borderRadius: '4px'
|
||||
}
|
||||
}
|
||||
/>
|
||||
</Tooltip>
|
||||
)
|
||||
}
|
||||
|
||||
export default ModifiedTooltip;
|
||||
@@ -0,0 +1,129 @@
|
||||
import crypto from 'crypto';
|
||||
import fs from 'fs';
|
||||
import path from 'path';
|
||||
|
||||
const IGNORE_COMMIT_MESSAGES = ['fork', 'optimize'];
|
||||
|
||||
function getContentHashOfFile(path) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const hash = crypto.createHash('md4');
|
||||
const stream = fs.createReadStream(path);
|
||||
stream.on('error', err => reject(err));
|
||||
stream.on('data', chunk => hash.update(chunk));
|
||||
stream.on('end', () => resolve(hash.digest('hex')));
|
||||
});
|
||||
}
|
||||
|
||||
const fetchCommitsOfIcon = (name) =>
|
||||
new Promise(async (resolve, reject) => {
|
||||
try {
|
||||
const headers = new Headers();
|
||||
const username = 'ericfennis';
|
||||
const password = process.env.GITHUB_API_KEY;
|
||||
headers.set(
|
||||
'Authorization',
|
||||
`Basic ${Buffer.from(`${username}:${password}`).toString('base64')}`,
|
||||
);
|
||||
|
||||
const res = await fetch(
|
||||
`https://api.github.com/repos/lucide-icons/lucide/commits?path=icons/${name}.svg`,
|
||||
{
|
||||
method: 'GET',
|
||||
headers,
|
||||
},
|
||||
);
|
||||
|
||||
const data = await res.json();
|
||||
|
||||
resolve({
|
||||
name,
|
||||
commits: data,
|
||||
});
|
||||
} catch (error) {
|
||||
|
||||
reject(error);
|
||||
}
|
||||
});
|
||||
|
||||
export const filterCommits = (commits) =>
|
||||
commits.filter(({ commit }) =>
|
||||
!IGNORE_COMMIT_MESSAGES.some(ignoreItem =>
|
||||
commit.message.toLowerCase().includes(ignoreItem),
|
||||
))
|
||||
.map(({ sha, author, commit }) => ({
|
||||
author: author && author.login ? author.login : null,
|
||||
commit: sha,
|
||||
}));
|
||||
|
||||
const getIconHash = async (icon) => await getContentHashOfFile(path.join(process.cwd(), "../icons", `${icon}.svg`))
|
||||
const iconCacheDir = path.join(process.cwd(),'.next/cache/github-api');
|
||||
const iconCache = (hash) => path.join(iconCacheDir, `${hash}.json`);
|
||||
|
||||
export async function checkIconCache(icon) {
|
||||
const hash = await getIconHash(icon);
|
||||
|
||||
const cachePath = iconCache(hash);
|
||||
|
||||
if(fs.existsSync( cachePath )) {
|
||||
const iconCache = fs.readFileSync(cachePath, "utf8");
|
||||
|
||||
return JSON.parse(iconCache)
|
||||
}
|
||||
|
||||
return false
|
||||
}
|
||||
|
||||
async function writeIconCache(icon, content) {
|
||||
const hash = await getIconHash(icon);
|
||||
|
||||
const iconCachePath = iconCache(hash);
|
||||
|
||||
if (!fs.existsSync(iconCacheDir)){
|
||||
fs.mkdirSync(iconCacheDir);
|
||||
}
|
||||
|
||||
fs.writeFileSync(iconCachePath, JSON.stringify(content), 'utf-8');
|
||||
}
|
||||
|
||||
export async function getContributors(icon) {
|
||||
try {
|
||||
let iconCommits
|
||||
const iconCache = await checkIconCache(icon);
|
||||
|
||||
if (iconCache) {
|
||||
iconCommits = iconCache
|
||||
} else {
|
||||
const { commits } : any = await fetchCommitsOfIcon(icon);
|
||||
|
||||
writeIconCache(icon, commits)
|
||||
|
||||
iconCommits = commits
|
||||
}
|
||||
|
||||
if (iconCommits && iconCommits.length) {
|
||||
return filterCommits(iconCommits);
|
||||
}
|
||||
|
||||
return [];
|
||||
} catch (error) {
|
||||
throw new Error(error);
|
||||
}
|
||||
}
|
||||
|
||||
export async function getAllContributors(icons) {
|
||||
try {
|
||||
const AllIconCommits = await Promise.all(icons.map(fetchCommitsOfIcon));
|
||||
|
||||
const filteredCommits = AllIconCommits.reduce((acc, { name, commits }) => {
|
||||
if (commits && commits.length) {
|
||||
acc[name] = filterCommits(commits)
|
||||
}
|
||||
|
||||
return acc;
|
||||
}, {});
|
||||
|
||||
return filteredCommits
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
@@ -2,6 +2,7 @@ import fs from "fs";
|
||||
import path from "path";
|
||||
import cheerio from 'cheerio';
|
||||
import tags from '../../../tags.json';
|
||||
import { getContributors } from "./fetchAllContributors";
|
||||
|
||||
const directory = path.join(process.cwd(), "../icons");
|
||||
|
||||
@@ -13,25 +14,26 @@ export function getAllNames() {
|
||||
});
|
||||
}
|
||||
|
||||
export function getData(name) {
|
||||
export async function getData(name:string) {
|
||||
const fullPath = path.join(directory, `${name}.svg`);
|
||||
const fileContents = fs.readFileSync(fullPath, "utf8");
|
||||
|
||||
const $ = cheerio.load(fileContents);
|
||||
const content = $("svg").html();
|
||||
|
||||
const contributors = await getContributors(name);
|
||||
|
||||
return {
|
||||
name,
|
||||
tags: tags[name] || [],
|
||||
contributors,
|
||||
src: fileContents,
|
||||
content: content
|
||||
};
|
||||
}
|
||||
|
||||
export function getAllData() {
|
||||
export async function getAllData() {
|
||||
const names = getAllNames();
|
||||
|
||||
return names.map((name) => {
|
||||
return getData(name);
|
||||
});
|
||||
return Promise.all(names.map((name) => getData(name)));
|
||||
}
|
||||
|
||||
@@ -2,6 +2,7 @@ import { ChakraProvider } from '@chakra-ui/core';
|
||||
import customTheme from '../lib/theme';
|
||||
import '../assets/styling.css';
|
||||
import Head from 'next/head';
|
||||
import { CustomizeIconContext } from "../components/CustomizeIconContext";
|
||||
|
||||
const App = ({ Component, pageProps }) => {
|
||||
return (
|
||||
@@ -10,7 +11,9 @@ const App = ({ Component, pageProps }) => {
|
||||
<title>Lucide</title>
|
||||
</Head>
|
||||
<ChakraProvider theme={customTheme}>
|
||||
<Component {...pageProps} />
|
||||
<CustomizeIconContext>
|
||||
<Component {...pageProps} />
|
||||
</CustomizeIconContext>
|
||||
</ChakraProvider>
|
||||
</>
|
||||
);
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
import { useEffect } from 'react'
|
||||
import { useRouter } from 'next/router'
|
||||
import IconDetailOverlay from '../../components/IconDetailOverlay'
|
||||
import { getAllData, getData } from '../../lib/icons';
|
||||
@@ -29,7 +28,7 @@ const IconPage = ({ icon, data }) => {
|
||||
<IconDetailOverlay
|
||||
key={icon.name}
|
||||
icon={icon}
|
||||
onClose={onClose}
|
||||
close={onClose}
|
||||
/>
|
||||
<Header {...{data}}/>
|
||||
<IconOverview {...{data}}/>
|
||||
@@ -39,15 +38,17 @@ const IconPage = ({ icon, data }) => {
|
||||
|
||||
export default IconPage
|
||||
|
||||
export function getStaticProps({ params: { iconName } }) {
|
||||
const data = getAllData();
|
||||
const icon = getData(iconName);
|
||||
export async function getStaticProps({ params: { iconName } }) {
|
||||
const data = await getAllData();
|
||||
const icon = await getData(iconName);
|
||||
return { props: { icon, data } }
|
||||
}
|
||||
|
||||
export function getStaticPaths() {
|
||||
export async function getStaticPaths() {
|
||||
const data = await getAllData();
|
||||
|
||||
return {
|
||||
paths: getAllData().map(({name: iconName }) => ({
|
||||
paths: data.map(({ name: iconName }) => ({
|
||||
params: { iconName },
|
||||
})),
|
||||
fallback: false,
|
||||
|
||||
@@ -5,7 +5,6 @@ import IconOverview from "../components/IconOverview";
|
||||
import IconDetailOverlay from "../components/IconDetailOverlay";
|
||||
import { useRouter } from "next/router";
|
||||
import Header from "../components/Header";
|
||||
import {CustomizeIconContext} from "../components/CustomizeIconContext";
|
||||
|
||||
const IndexPage = ({ data }) => {
|
||||
const router = useRouter();
|
||||
@@ -13,21 +12,19 @@ const IndexPage = ({ data }) => {
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<CustomizeIconContext>
|
||||
<IconDetailOverlay
|
||||
isOpen={!!router.query.iconName}
|
||||
icon={getIcon(router.query.iconName)}
|
||||
onClose={() => router.push('/')}
|
||||
/>
|
||||
<Header {...{data}}/>
|
||||
<IconOverview {...{data}}/>
|
||||
</CustomizeIconContext>
|
||||
<IconDetailOverlay
|
||||
open={!!router.query.iconName}
|
||||
icon={getIcon(router.query.iconName)}
|
||||
close={() => router.push('/')}
|
||||
/>
|
||||
<Header {...{data}}/>
|
||||
<IconOverview {...{data}}/>
|
||||
</Layout>
|
||||
);
|
||||
};
|
||||
|
||||
export async function getStaticProps() {
|
||||
let data = getAllData();
|
||||
let data = await getAllData();
|
||||
|
||||
return {
|
||||
props: {
|
||||
|
||||
+24
-34
@@ -356,7 +356,7 @@
|
||||
core-js-pure "^3.0.0"
|
||||
regenerator-runtime "^0.13.4"
|
||||
|
||||
"@babel/runtime@7.12.5", "@babel/runtime@^7.0.0", "@babel/runtime@^7.10.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.3.1", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.9.2":
|
||||
"@babel/runtime@7.12.5", "@babel/runtime@^7.0.0", "@babel/runtime@^7.10.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.9.2":
|
||||
version "7.12.5"
|
||||
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.12.5.tgz#410e7e487441e1b360c29be715d870d9b985882e"
|
||||
integrity sha512-plcc+hbExy3McchJCEQG3knOsuh3HH+Prx1P6cLIkET/0dLuQDEnrT+s27Axgc9bqfsmNUNHfscgMUdBpC9xfg==
|
||||
@@ -3774,25 +3774,23 @@ fragment-cache@^0.2.1:
|
||||
dependencies:
|
||||
map-cache "^0.2.2"
|
||||
|
||||
framer-motion@^2.9.4:
|
||||
version "2.9.5"
|
||||
resolved "https://registry.yarnpkg.com/framer-motion/-/framer-motion-2.9.5.tgz#bbb185325d531c57f494cf3f6cf7719fc2c225c7"
|
||||
integrity sha512-epSX4Co1YbDv0mjfHouuY0q361TpHE7WQzCp/xMTilxy4kXd+Z23uJzPVorfzbm1a/9q1Yu8T5bndaw65NI4Tg==
|
||||
framer-motion@^3.3.0:
|
||||
version "3.3.0"
|
||||
resolved "https://registry.yarnpkg.com/framer-motion/-/framer-motion-3.3.0.tgz#e355824369f03c8cd07a87ef59b7a8348c33fafd"
|
||||
integrity sha512-bjUrwXfMJZ6D+HSMDiXbMGKmlWGnUux8HotWgORTZkdPTgKAndlRXjeC2ikCgNVo2ifmRvEla5ckP9JaZc7JKA==
|
||||
dependencies:
|
||||
framesync "^4.1.0"
|
||||
framesync "^5.0.0"
|
||||
hey-listen "^1.0.8"
|
||||
popmotion "9.0.0-rc.20"
|
||||
style-value-types "^3.1.9"
|
||||
popmotion "^9.1.0"
|
||||
style-value-types "^4.0.1"
|
||||
tslib "^1.10.0"
|
||||
optionalDependencies:
|
||||
"@emotion/is-prop-valid" "^0.8.2"
|
||||
|
||||
framesync@^4.1.0:
|
||||
version "4.1.0"
|
||||
resolved "https://registry.yarnpkg.com/framesync/-/framesync-4.1.0.tgz#69a8db3ca432dc70d6a76ba882684a1497ef068a"
|
||||
integrity sha512-MmgZ4wCoeVxNbx2xp5hN/zPDCbLSKiDt4BbbslK7j/pM2lg5S0vhTNv1v8BCVb99JPIo6hXBFdwzU7Q4qcAaoQ==
|
||||
dependencies:
|
||||
hey-listen "^1.0.5"
|
||||
framesync@5.0.0, framesync@^5.0.0:
|
||||
version "5.0.0"
|
||||
resolved "https://registry.yarnpkg.com/framesync/-/framesync-5.0.0.tgz#7de8caedf53ac441118e79680f1beb7391c328b6"
|
||||
integrity sha512-wd8t+JsQGisluSv1twiEeDv0aNGpavGb9q7xgIk9fGbcIWkNXF/KVtrjnOrCwBWJuiXxlJfNkcvGudsI32FxYA==
|
||||
|
||||
from2@^2.1.0:
|
||||
version "2.3.0"
|
||||
@@ -4064,7 +4062,7 @@ he@1.2.0:
|
||||
resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
|
||||
integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==
|
||||
|
||||
hey-listen@^1.0.5, hey-listen@^1.0.8:
|
||||
hey-listen@^1.0.8:
|
||||
version "1.0.8"
|
||||
resolved "https://registry.yarnpkg.com/hey-listen/-/hey-listen-1.0.8.tgz#8e59561ff724908de1aa924ed6ecc84a56a9aa68"
|
||||
integrity sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q==
|
||||
@@ -6049,14 +6047,14 @@ pnp-webpack-plugin@1.6.4:
|
||||
dependencies:
|
||||
ts-pnp "^1.1.6"
|
||||
|
||||
popmotion@9.0.0-rc.20:
|
||||
version "9.0.0-rc.20"
|
||||
resolved "https://registry.yarnpkg.com/popmotion/-/popmotion-9.0.0-rc.20.tgz#f3550042ae31957b5416793ae8723200951ad39d"
|
||||
integrity sha512-f98sny03WuA+c8ckBjNNXotJD4G2utG/I3Q23NU69OEafrXtxxSukAaJBxzbtxwDvz3vtZK69pu9ojdkMoBNTg==
|
||||
popmotion@^9.1.0:
|
||||
version "9.1.0"
|
||||
resolved "https://registry.yarnpkg.com/popmotion/-/popmotion-9.1.0.tgz#4360d06bd18ce8baa8f9284ecec7d55344af6325"
|
||||
integrity sha512-+J7pzzBy5kk2qsP8ilowKs/CH+HoZa3kOGEBNCleCvsPXEF3nKHdfAR3SboMyPvdpIrofaT7ZIy/xWgz446Azw==
|
||||
dependencies:
|
||||
framesync "^4.1.0"
|
||||
framesync "5.0.0"
|
||||
hey-listen "^1.0.8"
|
||||
style-value-types "^3.1.9"
|
||||
style-value-types "^4.0.1"
|
||||
tslib "^1.10.0"
|
||||
|
||||
posix-character-classes@^0.1.0:
|
||||
@@ -6215,7 +6213,7 @@ prompts@^2.0.1:
|
||||
kleur "^3.0.3"
|
||||
sisteransi "^1.0.5"
|
||||
|
||||
prop-types@15.7.2, prop-types@^15.5.10, prop-types@^15.5.8, prop-types@^15.6.2, prop-types@^15.7.2:
|
||||
prop-types@15.7.2, prop-types@^15.5.10, prop-types@^15.6.2, prop-types@^15.7.2:
|
||||
version "15.7.2"
|
||||
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
|
||||
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
|
||||
@@ -6421,14 +6419,6 @@ react-remove-scroll@2.4.0:
|
||||
use-callback-ref "^1.2.3"
|
||||
use-sidecar "^1.0.1"
|
||||
|
||||
react-spring@^8.0.27:
|
||||
version "8.0.27"
|
||||
resolved "https://registry.yarnpkg.com/react-spring/-/react-spring-8.0.27.tgz#97d4dee677f41e0b2adcb696f3839680a3aa356a"
|
||||
integrity sha512-nDpWBe3ZVezukNRandTeLSPcwwTMjNVu1IDq9qA/AMiUqHuRN4BeSWvKr3eIxxg1vtiYiOLy4FqdfCP5IoP77g==
|
||||
dependencies:
|
||||
"@babel/runtime" "^7.3.1"
|
||||
prop-types "^15.5.8"
|
||||
|
||||
react-style-singleton@^2.1.0:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/react-style-singleton/-/react-style-singleton-2.1.1.tgz#ce7f90b67618be2b6b94902a30aaea152ce52e66"
|
||||
@@ -7343,10 +7333,10 @@ style-loader@1.2.1:
|
||||
loader-utils "^2.0.0"
|
||||
schema-utils "^2.6.6"
|
||||
|
||||
style-value-types@^3.1.9:
|
||||
version "3.2.0"
|
||||
resolved "https://registry.yarnpkg.com/style-value-types/-/style-value-types-3.2.0.tgz#eb89cab1340823fa7876f3e289d29d99c92111bb"
|
||||
integrity sha512-ih0mGsrYYmVvdDi++/66O6BaQPRPRMQHoZevNNdMMcPlP/cH28Rnfsqf1UEba/Bwfuw9T8BmIMwbGdzsPwQKrQ==
|
||||
style-value-types@^4.0.1:
|
||||
version "4.0.1"
|
||||
resolved "https://registry.yarnpkg.com/style-value-types/-/style-value-types-4.0.1.tgz#23f05dd03e8a850654defc22cf03ebac572aaa00"
|
||||
integrity sha512-aOV/HHyynIyTmU27qfs0oAHhFde6BFIvV4+nMerE2MAPZMwYOeQk1/F3S6djxF2u4HdbiieCPs3ZzWsbNUoc9A==
|
||||
dependencies:
|
||||
hey-listen "^1.0.8"
|
||||
tslib "^1.10.0"
|
||||
|
||||
@@ -0,0 +1,11 @@
|
||||
export default {
|
||||
xmlns: 'http://www.w3.org/2000/svg',
|
||||
width: 24,
|
||||
height: 24,
|
||||
viewBox: '0 0 24 24',
|
||||
fill: 'none',
|
||||
stroke: 'currentColor',
|
||||
strokeWidth: 2,
|
||||
strokeLinecap: 'round',
|
||||
strokeLinejoin: 'round',
|
||||
};
|
||||
Reference in New Issue
Block a user