Skip to content

J
juuust-icon
Commit bb35bbd0 authored by Jun's avatar Jun
Browse files
Options

update workflow and bin

parent 9d3d0625
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 69 additions and 1058 deletions
.github/workflows/push.yml
View file @ bb35bbd0
......@@ -14,9 +14,6 @@ jobs:
steps:
- uses: actions/checkout@v1
- name: "install"
run: yarn install
- name: Figma Action
uses: primer/[email protected]
with:
......@@ -25,15 +22,12 @@ jobs:
FIGMA_FILE_URL: ${{ secrets.FIGMA_FILE_URL }}
FIGMA_TOKEN: ${{ secrets.FIGMA_TOKEN }}
- name: "generate"
run: yarn generate
- name: "build"
run: yarn build
- name: "publish"
uses: actions/npm@master
env:
NPM_AUTH_TOKEN: ${{ secrets.NPM_AUTH_TOKEN }}
- uses: actions/setup-node@v1
with:
args: publish
node-version: '10.x'
- run: yarn install
- run: yarn generate
- run: yarn build
- run: yarn publish
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_AUTH_TOKEN }}
bin/build.js
View file @ bb35bbd0
......@@ -5,8 +5,9 @@ const fs = require('fs')
const format = require('prettier-eslint')
const upperCamelCase = require('uppercamelcase')
const processSvg = require('./processSvg')
const { defaultAttrs, getElementCode } = require('./template')
const icons = require('../icons.json')
const style = process.env.npm_package_config_style || 'stroke'
const { defaultAttrs, getElementCode } = require(`./template-${style}`)
const icons = require('../src/data.json.js')
const rootDir = path.join(__dirname, '..')
......@@ -45,7 +46,8 @@ const generateIndex = () => {
// generate attributes code
const attrsToString = (attrs) => {
return Object.keys(attrs).map((key) => {
if (key === 'width' || key === 'height' || key === 'stroke') {
// should distinguish fill or stroke
if (key === 'width' || key === 'height' || key === style) {
return key + '={' + attrs[key] + '}';
}
if (key === 'otherProps') {
......@@ -56,9 +58,11 @@ const attrsToString = (attrs) => {
};
// generate icon code separately
const generateIconCode = async ({name, code}) => {
const location = path.join(rootDir, 'src/icons', `${name}.js`)
const generateIconCode = async ({name}) => {
const location = path.join(rootDir, 'src/svg', `${name}.svg`)
const destination = path.join(rootDir, 'src/icons', `${name}.js`)
const ComponentName = (name === 'github') ? 'GitHub' : upperCamelCase(name)
const code = fs.readFileSync(location)
const svgCode = await processSvg(code)
const element = getElementCode(ComponentName, attrsToString(defaultAttrs), svgCode)
const component = format({
......@@ -73,7 +77,7 @@ const generateIconCode = async ({name, code}) => {
},
});
fs.writeFileSync(location, component, 'utf-8');
fs.writeFileSync(destination, component, 'utf-8');
console.log('Successfully built', ComponentName);
return {ComponentName, name}
......@@ -98,9 +102,12 @@ const appendToIndex = ({ComponentName, name}) => {
generateIndex()
icons.forEach(({name, code}) => {
generateIconCode({name, code})
.then(({ComponentName, name}) => {
appendToIndex({ComponentName, name})
})
})
Object
.keys(icons)
.map(key => icons[key])
.forEach(({name}) => {
generateIconCode({name})
.then(({ComponentName, name}) => {
appendToIndex({ComponentName, name})
})
})
bin/template-fill.js 0 → 100644
View file @ bb35bbd0
const defaultAttrs = {
xmlns: 'http://www.w3.org/2000/svg',
width: 'size',
height: 'size',
viewBox: '0 0 24 24',
fill: 'color',
otherProps: '...otherProps',
}
const getElementCode = (ComponentName, attrs, svgCode) => `
import React from 'react';
import PropTypes from 'prop-types';
const ${ComponentName} = (props) => {
const { color, size, ...otherProps } = props;
return (
<svg ${attrs}>
${svgCode}
</svg>
)
};
${ComponentName}.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number
]),
}
${ComponentName}.defaultProps = {
color: 'currentColor',
size: '24',
}
export default ${ComponentName}
`
module.exports = { defaultAttrs, getElementCode }
icons.json deleted 100644 → 0
View file @ 9d3d0625
This diff is collapsed.
package.json
View file @ bb35bbd0
......@@ -33,6 +33,9 @@
"build:es": "rm -rf build && babel src --out-dir build --copy-files",
"build": "concurrently \"yarn:build:*\""
},
"config" : {
"style" : "fill"
},
"license": "MIT",
"devDependencies": {
"@babel/cli": "^7.5.5",
......
src/icons/activity.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Activity = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M22 12h-4l-3 9L9 3l-3 9H2"></path>
</svg>
);
};
Activity.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Activity.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Activity;
src/icons/airplay.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Airplay = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M5 17H4a2 2 0 01-2-2V5a2 2 0 012-2h16a2 2 0 012 2v10a2 2 0 01-2 2h-1"></path>
<path d="M12 15l5 6H7l5-6z"></path>
</svg>
);
};
Airplay.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Airplay.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Airplay;
src/icons/alert-circle.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const AlertCircle = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<g clip-path="url(#clip0)">
<path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z"></path>
<path d="M12 8v4"></path>
<path d="M12 16h.01"></path>
</g>
<defs>
<clipPath id="clip0">
<rect width="24" height="24"></rect>
</clipPath>
</defs>
</svg>
);
};
AlertCircle.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
AlertCircle.defaultProps = {
color: 'currentColor',
size: '24'
};
export default AlertCircle;
src/icons/alert-octagon.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const AlertOctagon = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<g clip-path="url(#clip0)">
<path d="M7.86 2h8.28L22 7.86v8.28L16.14 22H7.86L2 16.14V7.86L7.86 2z"></path>
<path d="M12 16h.01"></path>
<path d="M12 8v4"></path>
</g>
<defs>
<clipPath id="clip0">
<rect width="24" height="24"></rect>
</clipPath>
</defs>
</svg>
);
};
AlertOctagon.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
AlertOctagon.defaultProps = {
color: 'currentColor',
size: '24'
};
export default AlertOctagon;
src/icons/alert-triangle.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const AlertTriangle = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<g clip-path="url(#clip0)">
<path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0v0z"></path>
<path d="M12 17h.01"></path>
<path d="M12 9v4"></path>
</g>
<defs>
<clipPath id="clip0">
<rect width="24" height="24"></rect>
</clipPath>
</defs>
</svg>
);
};
AlertTriangle.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
AlertTriangle.defaultProps = {
color: 'currentColor',
size: '24'
};
export default AlertTriangle;
src/icons/align-center.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const AlignCenter = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M18 10H6"></path>
<path d="M21 6H3"></path>
<path d="M21 14H3"></path>
<path d="M18 18H6"></path>
</svg>
);
};
AlignCenter.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
AlignCenter.defaultProps = {
color: 'currentColor',
size: '24'
};
export default AlignCenter;
src/icons/align-justify.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const AlignJustify = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M21 10H3"></path>
<path d="M21 6H3"></path>
<path d="M21 14H3"></path>
<path d="M21 18H3"></path>
</svg>
);
};
AlignJustify.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
AlignJustify.defaultProps = {
color: 'currentColor',
size: '24'
};
export default AlignJustify;
src/icons/align-left.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const AlignLeft = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M17 10H3"></path>
<path d="M21 6H3"></path>
<path d="M21 14H3"></path>
<path d="M17 18H3"></path>
</svg>
);
};
AlignLeft.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
AlignLeft.defaultProps = {
color: 'currentColor',
size: '24'
};
export default AlignLeft;
src/icons/align-right.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const AlignRight = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M21 10H7"></path>
<path d="M21 6H3"></path>
<path d="M21 14H3"></path>
<path d="M21 18H7"></path>
</svg>
);
};
AlignRight.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
AlignRight.defaultProps = {
color: 'currentColor',
size: '24'
};
export default AlignRight;
src/icons/anchor.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Anchor = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M12 8a3 3 0 100-6 3 3 0 000 6z"></path>
<path d="M12 22V8"></path>
<path d="M5 12H2a10 10 0 0020 0h-3"></path>
</svg>
);
};
Anchor.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Anchor.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Anchor;
src/icons/cloud-drizzle.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const CloudDrizzle = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<g clip-path="url(#clip0)">
<path d="M8 19v2"></path>
<path d="M8 13v2"></path>
<path d="M16 19v2"></path>
<path d="M16 13v2"></path>
<path d="M12 21v2"></path>
<path d="M12 15v2"></path>
<path d="M20 16.58A5 5 0 0018 7h-1.26A8 8 0 104 15.25"></path>
</g>
<defs>
<clipPath id="clip0">
<rect width="24" height="24"></rect>
</clipPath>
</defs>
</svg>
);
};
CloudDrizzle.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
CloudDrizzle.defaultProps = {
color: 'currentColor',
size: '24'
};
export default CloudDrizzle;
src/icons/cloud-lightning.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const CloudLightning = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<g clip-path="url(#clip0)">
<path d="M19 16.9A5 5 0 0018 7h-1.26a8 8 0 10-11.62 9"></path>
<path d="M13 11l-4 6h6l-4 6"></path>
</g>
<defs>
<clipPath id="clip0">
<rect width="24" height="24"></rect>
</clipPath>
</defs>
</svg>
);
};
CloudLightning.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
CloudLightning.defaultProps = {
color: 'currentColor',
size: '24'
};
export default CloudLightning;
src/icons/crop.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Crop = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M6.13 1L6 16a2 2 0 002 2h15"></path>
<path d="M1 6.13L16 6a2 2 0 012 2v15"></path>
</svg>
);
};
Crop.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Crop.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Crop;
src/icons/crosshair.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Crosshair = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z"></path>
<path d="M22 12h-4"></path>
<path d="M6 12H2"></path>
<path d="M12 6V2"></path>
<path d="M12 22v-4"></path>
</svg>
);
};
Crosshair.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Crosshair.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Crosshair;
src/icons/database.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Database = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M12 8c4.97 0 9-1.343 9-3s-4.03-3-9-3-9 1.343-9 3 4.03 3 9 3z"></path>
<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3"></path>
<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"></path>
</svg>
);
};
Database.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Database.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Database;
src/icons/folder.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Folder = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2v11z"></path>
</svg>
);
};
Folder.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Folder.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Folder;
src/icons/headphones.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Headphones = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M3 18v-6a9 9 0 1118 0v6"></path>
<path d="M21 19a2 2 0 01-2 2h-1a2 2 0 01-2-2v-3a2 2 0 012-2h3v5zM3 19a2 2 0 002 2h1a2 2 0 002-2v-3a2 2 0 00-2-2H3v5z"></path>
</svg>
);
};
Headphones.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Headphones.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Headphones;
src/icons/heart.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Heart = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.501 5.501 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78v0z"></path>
</svg>
);
};
Heart.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Heart.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Heart;
src/icons/help-circle.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const HelpCircle = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<g clip-path="url(#clip0)">
<path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z"></path>
<path d="M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3"></path>
<path d="M12 17h.01"></path>
</g>
<defs>
<clipPath id="clip0">
<rect width="24" height="24"></rect>
</clipPath>
</defs>
</svg>
);
};
HelpCircle.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
HelpCircle.defaultProps = {
color: 'currentColor',
size: '24'
};
export default HelpCircle;
src/icons/image.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Image = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M19 3H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V5a2 2 0 00-2-2z"></path>
<path d="M8.5 10a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"></path>
<path d="M21 15l-5-5L5 21"></path>
</svg>
);
};
Image.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Image.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Image;
src/icons/key.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const Key = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M21 2l-2 2m-7.61 7.61a5.5 5.5 0 11-7.778 7.778 5.5 5.5 0 017.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4"></path>
</svg>
);
};
Key.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
Key.defaultProps = {
color: 'currentColor',
size: '24'
};
export default Key;
src/icons/zoom-out.js deleted 100644 → 0
View file @ 9d3d0625
import React from 'react';
import PropTypes from 'prop-types';
const ZoomOut = props => {
const { color, size, ...otherProps } = props;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
{...otherProps}
>
<path d="M11 19a8 8 0 100-16 8 8 0 000 16z"></path>
<path d="M21 21l-4.35-4.35"></path>
<path d="M8 11h6"></path>
</svg>
);
};
ZoomOut.propTypes = {
color: PropTypes.string,
size: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
};
ZoomOut.defaultProps = {
color: 'currentColor',
size: '24'
};
export default ZoomOut;
src/index.d.ts deleted 100644 → 0
View file @ 9d3d0625
/// <reference types="react" />
import { ComponentType, SVGAttributes } from 'react';
interface Props extends SVGAttributes<SVGElement> {
color?: string;
size?: string | number;
}
type Icon = ComponentType<Props>;
export const Anchor: Icon;
export const AlignRight: Icon;
export const AlignLeft: Icon;
export const AlignJustify: Icon;
export const AlignCenter: Icon;
export const AlertTriangle: Icon;
export const AlertOctagon: Icon;
export const AlertCircle: Icon;
export const Airplay: Icon;
export const Activity: Icon;
export const Image: Icon;
export const Folder: Icon;
export const CloudLightning: Icon;
export const Database: Icon;
export const Crosshair: Icon;
export const Crop: Icon;
export const CloudDrizzle: Icon;
export const ZoomOut: Icon;
export const Key: Icon;
export const HelpCircle: Icon;
export const Heart: Icon;
export const Headphones: Icon;
src/index.js deleted 100644 → 0
View file @ 9d3d0625
export { default as Anchor } from './icons/anchor';
export { default as AlignRight } from './icons/align-right';
export { default as AlignLeft } from './icons/align-left';
export { default as AlignJustify } from './icons/align-justify';
export { default as AlignCenter } from './icons/align-center';
export { default as AlertTriangle } from './icons/alert-triangle';
export { default as AlertOctagon } from './icons/alert-octagon';
export { default as AlertCircle } from './icons/alert-circle';
export { default as Airplay } from './icons/airplay';
export { default as Activity } from './icons/activity';
export { default as Image } from './icons/image';
export { default as Folder } from './icons/folder';
export { default as CloudLightning } from './icons/cloud-lightning';
export { default as Database } from './icons/database';
export { default as Crosshair } from './icons/crosshair';
export { default as Crop } from './icons/crop';
export { default as CloudDrizzle } from './icons/cloud-drizzle';
export { default as ZoomOut } from './icons/zoom-out';
export { default as Key } from './icons/key';
export { default as HelpCircle } from './icons/help-circle';
export { default as Heart } from './icons/heart';
export { default as Headphones } from './icons/headphones';
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment