update: icons and styles

.github/actions/release-node-alpha.yml

@@ -0,0 +1,37 @@
+# creates a new npm release
+name: release
+
+on:
+  workflow_call:
+    secrets:
+      NODE_AUTH_TOKEN:
+        required: true
+
+jobs:
+  release-alpha:
+    if: |
+      github.event.pull_request.head.repo.full_name == github.repository
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          registry-url: "https://registry.npmjs.org"
+          cache: "pnpm"
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: install standard
+        run: npm i -g standard-version
+
+      - name: release
+        run: |
+          standard-version --prerelease ${{ github.sha }} --skip.changelog --skip.commit --skip.tag
+
+      - name: Publish
+        run: pnpm --filter react-web3-icons ci:publish --tag beta
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NODE_AUTH_TOKEN }}

.github/actions/release-node.yml

@@ -0,0 +1,32 @@
+# creates a new npm release
+name: release
+
+on:
+  workflow_call:
+    secrets:
+      NODE_AUTH_TOKEN:
+        required: true
+
+jobs:
+  release:
+    if: |
+      github.event_name == 'push' &&
+      github.ref == format('refs/heads/{0}', github.event.repository.default_branch) &&
+      contains(github.event.head_commit.message, 'chore(main): release')
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          registry-url: "https://registry.npmjs.org"
+          cache: "pnpm"
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Publish
+        run: pnpm --filter react-web3-icons ci:publish
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NODE_AUTH_TOKEN }}

.github/workflows/release-please.yml

@@ -0,0 +1,33 @@
+on:
+  push:
+    branches:
+      - main
+
+permissions:
+  contents: write
+  pull-requests: write
+
+name: release-please
+jobs:
+  release-please:
+    runs-on: ubuntu-latest
+    outputs:
+      releaseCreated: ${{ steps.release.outputs.release_created }}
+    steps:
+      - uses: google-github-actions/release-please-action@v3
+        id: release
+        with:
+          release-type: node
+          package-name: react-web3-icons
+          pull-request-header: "I have created a release"
+          path: packages/react-web3-icons
+          monorepo-tags: true
+          tag-separator: '@'
+
+  release-node:
+    uses: ../actions/release-node.yml
+    if: ${{ needs.release-please.outputs.releaseCreated }}
+    needs:
+      - release-please
+    secrets:
+      NODE_AUTH_TOKEN: ${{ secrets.NODE_AUTH_TOKEN }}

.github/workflows/test-release-alpha.yml

@@ -0,0 +1,14 @@
+name: Test & alpha release
+
+concurrency:
+  group: ${{ github.head_ref || github.ref_name }}
+  cancel-in-progress: true
+
+on:
+  pull_request:
+
+jobs:
+  release-node-alpha:
+    uses: ../actions/release-node-alpha.yml
+    secrets:
+      NODE_AUTH_TOKEN: ${{ secrets.NODE_AUTH_TOKEN }}

.gitignore

@@ -2,6 +2,7 @@
 .DS_Store
 .AppleDouble
 .LSOverride
+.idea
 
 # Icon must end with two \r
 Icon

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 BGD labs
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,11 +1,20 @@
 # Web3 icons library
-**🚧 Work in progress 🚧**
+Svg set of web3 assets icons and utils for easy generation.
+
+### Installation
+We have prepared a package with all the icons for easy use in the React.js ecosystem. Described in more detail [here](./packages/react-web3-icons/README.md).
+
+#### npm
+<code>npm i @bgd-labs/react-web3-icons</code>
+#### yarn
+<code>yarn add @bgd-labs/react-web3-icons</code>
+#### pnpm
+<code>pnpm add @bgd-labs/react-web3-icons</code>
 
 ### Adding new icons
 1. Add new `svg` icon files to `src/assets/icons` folder
 2. Naming convention is `[symbol]_mono.svg` and `[symbol]_full.svg`
 3. Prepare a metadata file in `src/assets/icons` folder with the same name as the icon file, but with `.json` extension:
-
 ```json
 {
   "name": "Aave",
@@ -29,3 +38,5 @@ To run docs website locally:
 pnpm --filter docs dev
 ```
 
+## Copyright
+2024 BGD Labs

apps/docs/.eslintrc.cjs

@@ -7,8 +7,7 @@ const config = {
   "plugins": [
     "@typescript-eslint",
     "prettier",
-    "simple-import-sort",
-    "drizzle"
+    "simple-import-sort"
   ],
   "extends": [
     "next/core-web-vitals",
@@ -41,8 +40,6 @@ const config = {
         }
       }
     ],
-    "drizzle/enforce-delete-with-where": "error",
-    "drizzle/enforce-update-with-where": "error",
     "prettier/prettier": "warn",
     'simple-import-sort/imports': "error",
     'simple-import-sort/exports': "warn",

apps/docs/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 BGD labs
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

apps/docs/README.md

@@ -1 +1,5 @@
-# 🚧 (WIP)
+# React web3 icons preview
+This is a small application that has a gallery of all the asset icons that are included in the package. Also here you can immediately download the SVG icon of the asset you need in the desired version if you do not need to install the package, or for some reason the package does not suit you.
+
+## Copyright
+2024 BGD Labs

apps/docs/package.json

@@ -1,19 +1,38 @@
 {
-  "name": "docs",
-  "version": "0.1.0",
+  "name": "@bgd-labs/react-web3-icons-docs",
+  "description": "Gallery for easy export in svg of all assets icons from the package.",
+  "version": "0.0.1",
+  "author": "BGD labs",
+  "license": "MIT",
   "private": true,
   "type": "module",
+  "contributors": [
+    {
+      "name": "Karen Kakosyan",
+      "url": "https://github.com/smbdy"
+    },
+    {
+      "name": "Oleksandr Tkach",
+      "url": "https://github.com/Argeare5"
+    }
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/bgd-labs/icons.git"
+  },
+  "bugs": {
+    "url": "https://github.com/bgd-labs/icons/issues"
+  },
+  "homepage": "https://github.com/bgd-labs/icons/blob/main/README.md",
   "scripts": {
     "build": "next build",
-    "generate": "tsx src/scripts/generate.ts",
-    "prebuild": "npm run generate",
     "dev": "next dev",
     "lint": "next lint",
     "start": "next start"
   },
   "dependencies": {
     "@bgd-labs/aave-address-book": "^2.26.1",
-    "@bgd-labs/react-icons": "workspace:^",
+    "@bgd-labs/react-web3-icons": "workspace:^",
     "clsx": "^2.1.0",
     "next": "^14.1.4",
     "next-themes": "^0.3.0",

apps/docs/public/manifest.json

@@ -0,0 +1,17 @@
+{
+  "short_name": "Boilerplate",
+  "name": "App boilerplate",
+  "description": "App boilerplate description",
+  "iconPath": "vercel.svg",
+  "icons": [
+    {
+      "src": "vercel.svg",
+      "sizes": "32x32",
+      "type": "image/svg"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

apps/docs/src/app/icons/page.tsx

@@ -1,14 +1,20 @@
-import { Icon1inchMono } from "@bgd-labs/react-icons";
 import { IconCard } from "@/components/IconCard";
 
+import assets from "../../../../../icons/icons.json";
+
 const IconsPage = () => {
-  // TODO: map icons here
   return (
-    <main className="p-24">
-      <div className="block flex flex-wrap gap-4">
-        <IconCard name="1INCH" symbol="1inch">
-          <Icon1inchMono />
-        </IconCard>
+    <main className="p-4 md:p-8 xl:p-16">
+      <div className="flex flex-wrap items-center justify-center gap-2 sm:justify-start">
+        {assets
+          .filter((asset) => asset.symbol !== "unknown")
+          .map((asset) => (
+            <IconCard
+              key={asset.symbol}
+              name={asset.name}
+              symbol={asset.symbol}
+            />
+          ))}
       </div>
     </main>
   );

apps/docs/src/app/page.tsx

@@ -3,7 +3,7 @@ import Link from "next/link";
 export default function Home() {
   return (
     <main className="flex h-screen flex-col items-center justify-center">
-      <h1 className="mx-auto mb-6 text-left text-center text-7xl font-bold leading-snug">
+      <h1 className="mx-auto mb-6 text-center text-7xl font-bold leading-snug">
         Reliable{" "}
         <span className="mx-3‰ rounded-xl bg-gray-100 px-2 py-1 font-mono font-normal text-gray-600">
           {"<svg/>"}
@@ -12,7 +12,7 @@ export default function Home() {
       </h1>
       <div className="mx-auto mb-20 flex items-center justify-center gap-3">
         <Link
-          href="/icons/mono"
+          href="/icons"
           className="text-md w-56 rounded border border-gray-900 bg-gray-900 py-3 text-center font-semibold text-white"
         >
           Explore icons
@@ -28,9 +28,9 @@ export default function Home() {
             viewBox="0 0 24 24"
             fill="none"
             stroke="currentColor"
-            stroke-width="2"
-            stroke-linecap="round"
-            stroke-linejoin="round"
+            strokeWidth="2"
+            strokeLinecap="round"
+            strokeLinejoin="round"
             className="h-5 w-5 text-gray-400"
           >
             <path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4" />