🚀 v1.1.4 - Add folders icons & new website.

README.md

@@ -3,11 +3,13 @@
 <img src="website/public/images/banner.png">
 </a>
 
-<a href="https://react-symbols.vercel.app/">Website</a>
+<p></p>
+
+<a href="https://react-symbols.vercel.app/">🔎 Discover</a>
 <span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>
-<a href="https://github.com/pheralb/react-symbols/tree/next">Next</a>
+<a href="#-getting-started">🤝 Contribute</a>
 <span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>
-<a href="https://marketplace.visualstudio.com/items?itemName=miguelsolorio.symbols">VSCode Theme</a>
+<a href="https://twitter.com/pheralb_">🐦 Twitter</a>
 
 ![GitHub releases](https://img.shields.io/github/release/pheralb/react-symbols)
 ![GitHub stars](https://img.shields.io/github/stars/pheralb/react-symbols)
@@ -23,7 +25,7 @@
 
 ## 🎉 Features
 
-- 📦 +80 icons.
+- 📦 +90 icons.
 - 🍃 Lightweight.
 - 💙 Ready to use with Typescript.
 - 🧡 SVG optimized and minified.
@@ -41,8 +43,8 @@ npm install @react-symbols/icons
 # pnpm ->
 pnpm add @react-symbols/icons
 
-# fnpm ->
-fnpm install @react-symbols/icons
+# ultra ->
+ultra install @react-symbols/icons
 
 # yarn ->
 yarn add @react-symbols/icons
@@ -68,7 +70,6 @@ export default MyComponent;
 
 <details>
   <summary>📀 Config for use the library in Remix.</summary>
-
 
 
 ```js
@@ -87,12 +88,12 @@ module.exports = {
 ## 📦 Icons
 
 - ✅ [Icons/files](https://github.com/miguelsolorio/vscode-symbols/tree/main/src/icons/files) - Ready.
-- 🧩 [Icons/folders](https://github.com/miguelsolorio/vscode-symbols/tree/main/src/icons/folders) - Working...
+- 🧩 [Icons/folders](https://github.com/miguelsolorio/vscode-symbols/tree/main/src/icons/folders) - Ready.
 
 ## 🙌 Contributing
 
-- ⭐ [Josyto](https://github.com/Josyto).
-- ⭐ [pablocdev](https://github.com/pablocdev).
+- [Josyto](https://github.com/Josyto).
+- [pablocdev](https://github.com/pablocdev).
 
 ## 🔑 License
 

library/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-symbols/icons",
-  "version": "1.1.3",
+  "version": "1.1.4",
   "description": "File icons by Miguel Solorio for React",
   "keywords": [
     "react",
@@ -40,14 +40,14 @@
   },
   "devDependencies": {
     "@swc/cli": "0.1.57",
-    "@swc/core": "1.3.15",
+    "@swc/core": "1.3.20",
     "@types/node": "18.11.9",
     "@types/react": "18.0.25",
-    "@types/react-dom": "18.0.8",
+    "@types/react-dom": "18.0.9",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "tsup": "6.4.0",
-    "typescript": "4.8.4"
+    "tsup": "6.5.0",
+    "typescript": "4.9.3"
   },
   "peerDependencies": {
     "react": ">=16.8.0",

library/src/index.ts

@@ -1,3 +1,5 @@
+// Files =>
+
 export { default as Angular } from './library/angular.js';
 export { default as Astro } from './library/astro.js';
 export { default as BracketsBlue } from './library/bracketsBlue.js';
@@ -88,3 +90,31 @@ export { default as Webpack } from './library/webpack.js';
 export { default as XML } from './library/xml.js';
 export { default as Yaml } from './library/yaml.js';
 export { default as Yarn } from './library/yarn.js';
+
+// Folders =>
+
+export { default as Folder } from './library/folders/folder.js';
+export { default as FolderAssets } from './library/folders/folderAssets.js';
+export { default as FolderBlue } from './library/folders/folderBlue.js';
+export { default as FolderBlueCode } from './library/folders/folderBlueCode.js';
+export { default as FolderBlueOutline } from './library/folders/folderBlueOutline.js';
+export { default as FolderGray } from './library/folders/folderGray.js';
+export { default as FolderGrayCode } from './library/folders/folderGrayCode.js';
+export { default as FolderGrayOutline } from './library/folders/folderGrayOutline.js';
+export { default as FolderGreen } from './library/folders/folderGreen.js';
+export { default as FolderGreenCode } from './library/folders/folderGreenCode.js';
+export { default as FolderGreenOutline } from './library/folders/folderGreenOutline.js';
+export { default as FolderOpen } from './library/folders/folderOpen.js';
+export { default as FolderOrange } from './library/folders/folderOrange.js';
+export { default as FolderOrangeCode } from './library/folders/folderOrangeCode.js';
+export { default as FolderOrangeOutline } from './library/folders/folderOrangeOutline.js';
+export { default as FolderPurple } from './library/folders/folderPurple.js';
+export { default as FolderPurpleCode } from './library/folders/folderPurpleCode.js';
+export { default as FolderPurpleOutline } from './library/folders/folderPurpleOutline.js';
+export { default as FolderRed } from './library/folders/folderRed.js';
+export { default as FolderRedCode } from './library/folders/folderRedCode.js';
+export { default as FolderRedOutline } from './library/folders/folderRedOutline.js';
+export { default as FolderSky } from './library/folders/folderSky.js';
+export { default as FolderSkyCode } from './library/folders/folderSkyCode.js';
+export { default as FolderSkyOutline } from './library/folders/folderSkyOutline.js';
+export { default as FolderSrc } from './library/folders/folderSrc.js';

library/src/library/folders/folder.tsx

@@ -0,0 +1,18 @@
+import { ComponentProps, FC } from 'react';
+
+const Folder: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      stroke="#64748B"
+      strokeWidth="2"
+      d="M7.784 5H5a2 2 0 00-2 2v10a2 2 0 002 2h14a2 2 0 002-2V9.875a2 2 0 00-2-2h-6.284a2 2 0 01-1.27-.455L9.054 5.455A2 2 0 007.783 5z"
+    ></path>
+  </svg>
+);
+
+export default Folder;

library/src/library/folders/folderAssets.tsx

@@ -0,0 +1,26 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderAssets: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h8v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <circle cx="21" cy="18" r="2" fill="#2563EB"></circle>
+    <rect width="4" height="4" x="14" y="11" fill="#0D9488" rx="1"></rect>
+    <path fill="#22D3EE" d="M16 16.5l1.732 3h-3.464l1.732-3z"></path>
+    <path
+      fill="#C084FC"
+      d="M20.308 11.871c.237-.643 1.147-.643 1.384 0a.738.738 0 00.437.436c.642.238.642 1.148 0 1.386a.738.738 0 00-.437.436c-.237.643-1.147.643-1.384 0a.738.738 0 00-.437-.436c-.642-.238-.642-1.148 0-1.386a.738.738 0 00.437-.436z"
+    ></path>
+  </svg>
+);
+
+export default FolderAssets;

library/src/library/folders/folderBlue.tsx

@@ -0,0 +1,20 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderBlue: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h9v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <circle cx="20" cy="16" r="4" fill="#2563EB"></circle>
+  </svg>
+);
+
+export default FolderBlue;

library/src/library/folders/folderBlueCode.tsx

@@ -0,0 +1,26 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderBlueCode: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h5v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <path
+      stroke="#2563EB"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      strokeWidth="1.5"
+      d="M15.146 13.797L13 15.943l2.146 2.146M21.077 13.797l2.145 2.146-2.145 2.146M16.561 19.52l3.1-7.153"
+    ></path>
+  </svg>
+);
+
+export default FolderBlueCode;

library/src/library/folders/folderBlueOutline.tsx

@@ -0,0 +1,20 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderBlueOutline: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h9v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <circle cx="20" cy="16" r="3" stroke="#2563EB" strokeWidth="2"></circle>
+  </svg>
+);
+
+export default FolderBlueOutline;

library/src/library/folders/folderGray.tsx

@@ -0,0 +1,20 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderGray: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h9v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <circle cx="20" cy="16" r="4" fill="#71717A"></circle>
+  </svg>
+);
+
+export default FolderGray;

library/src/library/folders/folderGrayCode.tsx

@@ -0,0 +1,26 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderGrayCode: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h5v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <path
+      stroke="#71717A"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      strokeWidth="1.5"
+      d="M15.146 13.797L13 15.943l2.146 2.146M21.077 13.797l2.145 2.146-2.145 2.146M16.561 19.52l3.1-7.153"
+    ></path>
+  </svg>
+);
+
+export default FolderGrayCode;

library/src/library/folders/folderGrayOutline.tsx

@@ -0,0 +1,20 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderGrayOutline: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h9v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <circle cx="20" cy="16" r="3" stroke="#71717A" strokeWidth="2"></circle>
+  </svg>
+);
+
+export default FolderGrayOutline;

library/src/library/folders/folderGreen.tsx

@@ -0,0 +1,20 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderGreen: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h9v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <circle cx="20" cy="16" r="4" fill="#16A34A"></circle>
+  </svg>
+);
+
+export default FolderGreen;

library/src/library/folders/folderGreenCode.tsx

@@ -0,0 +1,26 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderGreenCode: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h5v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <path
+      stroke="#16A34A"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      strokeWidth="1.5"
+      d="M15.146 13.797L13 15.943l2.146 2.146M21.077 13.797l2.145 2.146-2.145 2.146M16.561 19.52l3.1-7.153"
+    ></path>
+  </svg>
+);
+
+export default FolderGreenCode;

library/src/library/folders/folderGreenOutline.tsx

@@ -0,0 +1,20 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderGreenOutline: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      fillRule="evenodd"
+      d="M5 4a3 3 0 00-3 3v10a3 3 0 003 3h9v-2H5a1 1 0 01-1-1V7a1 1 0 011-1h2.784a1 1 0 01.635.227l2.393 1.966a3 3 0 001.904.682H19a1 1 0 011 1V10h2v-.125a3 3 0 00-3-3h-6.284a1 1 0 01-.635-.227L9.688 4.682A3 3 0 007.784 4H5z"
+      clipRule="evenodd"
+    ></path>
+    <circle cx="20" cy="16" r="3" stroke="#16A34A" strokeWidth="2"></circle>
+  </svg>
+);
+
+export default FolderGreenOutline;

library/src/library/folders/folderOpen.tsx

@@ -0,0 +1,19 @@
+import { ComponentProps, FC } from 'react';
+
+const FolderOpen: FC<ComponentProps<'svg'>> = (props) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    {...props}
+  >
+    <path
+      fill="#64748B"
+      stroke="#64748B"
+      strokeWidth="2"
+      d="M7.784 5H5a2 2 0 00-2 2v10a2 2 0 002 2h14a2 2 0 002-2V9.875a2 2 0 00-2-2h-6.284a2 2 0 01-1.27-.455L9.054 5.455A2 2 0 007.783 5z"
+    ></path>
+  </svg>
+);
+
+export default FolderOpen;