@egov3/graphics 1.0.46

package/.github/workflows/publish.yml

@@ -0,0 +1,61 @@
+name: Publish to npm
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+
+    permissions:
+      contents: write
+      packages: write
+      actions: write
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: "20"
+          registry-url: "https://registry.npmjs.org/"
+
+      - name: Install dependencies
+        run: yarn install
+
+      - name: Build project
+        run: yarn build
+
+      - name: Increment version
+        run: yarn version --patch --no-git-tag-version
+
+      - name: Check PERSONAL_TOKEN
+        run: |
+          echo "Token starts with: ${PERSONAL_TOKEN:0:4}... and ends with ...${PERSONAL_TOKEN: -4}"
+        env:
+          PERSONAL_TOKEN: ${{ secrets.PERSONAL_TOKEN }}
+
+      - name: Test git connection
+        run: |
+          git ls-remote https://Zhassulan-Baigozha:${{ secrets.PERSONAL_TOKEN }}@github.com/egov3/graphics.git
+        env:
+          PERSONAL_TOKEN: ${{ secrets.PERSONAL_TOKEN }}
+
+      - name: Commit updated package.json
+        run: |
+          git config --global user.name "github-actions[bot]"
+          git config --global user.email "github-actions[bot]@users.noreply.github.com"
+          git add package.json
+          git commit -m "ci: bump version to $(jq -r '.version' package.json)"
+          git stash --include-untracked
+          git pull --rebase https://x-access-token:${{ secrets.PERSONAL_TOKEN }}@github.com/egov3/graphics.git main
+          git push --force https://x-access-token:${{ secrets.PERSONAL_TOKEN }}@github.com/egov3/graphics.git main
+
+      - name: Publish to npm
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+        run: yarn publish --non-interactive --access public

package/package.json

@@ -0,0 +1,33 @@
+{
+	"name": "@egov3/graphics",
+	"version": "1.0.46",
+	"license": "MIT",
+	"main": "dist/cjs/index.js",
+	"module": "dist/esm/index.js",
+	"types": "dist/index.d.ts",
+	"type": "module",
+	"author": "Zhassulan Baigozha",
+	"description": "A system-design graphics NPM package in Typescript",
+	"scripts": {
+		"build": "tsup"
+	},
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/egov3/graphics.git"
+	},
+	"peerDependencies": {
+		"react": "^19.0.0",
+		"react-dom": "^19.0.0"
+	},
+	"dependencies": {
+		"react": "^19.0.0",
+		"react-dom": "^19.0.0"
+	},
+	"devDependencies": {
+		"@types/react": "^19.0.10",
+		"@types/react-dom": "^19.0.4",
+		"tslib": "^2.8.1",
+		"tsup": "^8.4.0",
+		"typescript": "^5.8.2"
+	}
+}

package/src/Additional/AttachFileAdd.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const AttachFileAdd = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M16.1731 11.1923V6.38463H17.6731V11.1923H16.1731ZM10.9039 17.3711C10.4616 17.198 10.101 16.9131 9.82214 16.5163C9.5433 16.1195 9.40389 15.6685 9.40389 15.1634V6.38463H10.9039V17.3711ZM11.8552 21.5C10.2312 21.5 8.8526 20.93 7.71926 19.7901C6.58595 18.6501 6.01929 17.2682 6.01929 15.6442V6.65383C6.01929 5.49999 6.41992 4.51923 7.22119 3.71155C8.02247 2.90385 9.00003 2.5 10.1539 2.5C11.3077 2.5 12.2853 2.90385 13.0865 3.71155C13.8878 4.51923 14.2885 5.49999 14.2885 6.65383V14H12.7885V6.64423C12.7782 5.90576 12.5218 5.28043 12.0191 4.76825C11.5164 4.25607 10.8947 3.99998 10.1539 3.99998C9.41618 3.99998 8.79265 4.25767 8.28329 4.77305C7.77392 5.28843 7.51924 5.91536 7.51924 6.65383V15.6442C7.50899 16.8532 7.92694 17.8814 8.77309 18.7288C9.61925 19.5763 10.6468 20 11.8558 20C12.2493 20 12.6231 19.9522 12.9773 19.8567C13.3315 19.7612 13.666 19.6179 13.9808 19.4269V21.0942C13.65 21.2275 13.3068 21.3285 12.951 21.3971C12.5952 21.4657 12.23 21.5 11.8552 21.5ZM16.1731 20.5V17.6923H13.3654V16.1923H16.1731V13.3846H17.6731V16.1923H20.4807V17.6923H17.6731V20.5H16.1731Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Additional/Refresh.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Refresh = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M21 9.99998V4.34308L19.0356 6.30748L18.3638 5.63618C17.5302 4.7907 16.5376 4.11849 15.4432 3.65829C14.3487 3.19809 13.174 2.95899 11.9867 2.95477C10.7994 2.95055 9.62307 3.18128 8.52535 3.63368C7.42764 4.08609 6.43029 4.75121 5.59075 5.59075C4.75121 6.43029 4.08609 7.42764 3.63368 8.52535C3.18128 9.62307 2.95055 10.7994 2.95477 11.9867C2.95899 13.174 3.19809 14.3487 3.65829 15.4432C4.11849 16.5376 4.7907 17.5302 5.63618 18.3638C6.83406 19.5627 8.34622 20.3988 9.9985 20.7758C11.6508 21.1529 13.376 21.0555 14.9753 20.495C16.5747 19.9345 17.9832 18.9335 19.0386 17.6075C20.094 16.2815 20.7534 14.6843 20.9408 13H18.9208C18.6935 14.5577 17.9472 15.9932 16.8025 17.0739C15.6579 18.1547 14.182 18.8175 12.6138 18.9551C11.0456 19.0927 9.47688 18.697 8.16156 17.832C6.84624 16.9671 5.86134 15.6835 5.3663 14.1892C4.87125 12.6948 4.89505 11.0771 5.43383 9.59792C5.97262 8.11876 6.99485 6.86473 8.33504 6.03884C9.67524 5.21296 11.2549 4.86356 12.8184 5.04721C14.3819 5.23086 15.8377 5.93681 16.95 7.05078L17.6216 7.72178L15.3431 9.99998H21Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Additional/SettingsFilled.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const SettingsFilled = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 10.75C11.7528 10.75 11.5111 10.8233 11.3055 10.9607C11.1 11.098 10.9398 11.2932 10.8452 11.5216C10.7505 11.7501 10.7258 12.0014 10.774 12.2439C10.8222 12.4863 10.9413 12.7091 11.1161 12.8839C11.2909 13.0587 11.5137 13.1778 11.7561 13.226C11.9986 13.2742 12.2499 13.2495 12.4784 13.1548C12.7068 13.0602 12.902 12.9 13.0393 12.6945C13.1767 12.4889 13.25 12.2472 13.25 12C13.25 11.6685 13.1183 11.3505 12.8839 11.1161C12.6495 10.8817 12.3315 10.75 12 10.75ZM16 3H8C6.67392 3 5.40215 3.52678 4.46447 4.46447C3.52678 5.40215 3 6.67392 3 8V16C3 17.3261 3.52678 18.5979 4.46447 19.5355C5.40215 20.4732 6.67392 21 8 21H16C17.3261 21 18.5979 20.4732 19.5355 19.5355C20.4732 18.5979 21 17.3261 21 16V8C21 6.67392 20.4732 5.40215 19.5355 4.46447C18.5979 3.52678 17.3261 3 16 3ZM16.6714 13.739C16.475 14.2605 16.1923 14.7452 15.835 15.1728L14.0918 14.4056L13.0376 15.0143L12.8296 16.9164C12.5559 16.9674 12.2784 16.9953 12 17C11.7215 16.9954 11.4438 16.9674 11.17 16.9164L10.962 15.0143L9.9078 14.4056L8.1646 15.1728C7.80715 14.7453 7.52438 14.2606 7.3282 13.739L8.8702 12.609V11.3913L7.3282 10.2613C7.52469 9.73977 7.80761 9.25505 8.1651 8.8275L9.9078 9.5947L10.962 8.9861L11.17 7.084C11.4438 7.03282 11.7215 7.00472 12 7C12.2785 7.00459 12.5562 7.03255 12.83 7.0836L13.038 8.9857L14.0922 9.5943L15.8354 8.8271C16.1927 9.25468 16.4755 9.73939 16.6718 10.2609L15.1298 11.3909V12.6082L16.6714 13.739Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Additional/SettingsOutline.tsx

@@ -0,0 +1,19 @@
+import React from "react";
+
+export const SettingsOutline = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M9.18055 1H14.8202L15.5899 4.84882C15.869 4.98915 16.1387 5.14529 16.3977 5.31603L20.1166 4.05797L22.9364 8.94201L19.9866 11.5344C20.0042 11.8437 20.0042 12.1561 19.9866 12.4655L22.9366 15.058L20.1168 19.942L16.3978 18.6839C16.1387 18.8547 15.869 19.0108 15.5899 19.1512L14.8202 23H9.18055L8.41078 19.1512C8.13166 19.0108 7.86197 18.8547 7.60288 18.6839L3.88388 19.942L1.06407 15.058L4.01406 12.4654C3.99652 12.1561 3.99652 11.8437 4.01407 11.5344L1.06427 8.94203L3.88407 4.05799L7.60295 5.31604C7.86202 5.14529 8.13169 4.98915 8.41078 4.84882L9.18055 1ZM10.8202 3L10.1682 6.25981C9.36005 6.59924 8.64186 7.01553 7.94757 7.54396L4.79632 6.47793L3.61612 8.52209L6.11366 10.717C6.00438 11.5864 6.00486 12.4173 6.11363 13.2829L3.61593 15.4779L4.79612 17.5221L7.94752 16.456C8.4939 16.8719 9.04056 17.2666 9.67893 17.5347L10.1682 17.7402L10.8202 21H13.1805L13.8325 17.7402C14.6407 17.4008 15.3589 16.9845 16.0532 16.456L19.2046 17.5221L20.3848 15.4779L17.8871 13.2829C17.9958 12.4173 17.9963 11.5864 17.887 10.717L20.3846 8.52207L19.2044 6.47791L16.0531 7.54395C15.3556 7.01304 14.637 6.59772 13.8325 6.25981L13.1805 3H10.8202ZM12.0006 10C10.8961 10 10.0006 10.8954 10.0006 12C10.0006 13.1046 10.8961 14 12.0006 14C13.1052 14 14.0006 13.1046 14.0006 12C14.0006 10.8954 13.1052 10 12.0006 10ZM8.00064 12C8.00064 9.79086 9.7915 8 12.0006 8C14.2098 8 16.0006 9.79086 16.0006 12C16.0006 14.2091 14.2098 16 12.0006 16C9.7915 16 8.00064 14.2091 8.00064 12Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Additional/Time.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Time = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM12 20C10.4178 20 8.87104 19.5308 7.55544 18.6518C6.23985 17.7727 5.21447 16.5233 4.60897 15.0615C4.00347 13.5997 3.84504 11.9911 4.15372 10.4393C4.4624 8.88743 5.22433 7.46197 6.34315 6.34315C7.46197 5.22433 8.88743 4.4624 10.4393 4.15372C11.9911 3.84504 13.5997 4.00346 15.0615 4.60896C16.5233 5.21447 17.7727 6.23984 18.6518 7.55544C19.5308 8.87103 20 10.4177 20 12C19.9976 14.121 19.154 16.1544 17.6542 17.6542C16.1544 19.154 14.121 19.9976 12 20ZM12.6665 6.2915H10.6665V13.2915H16.667V11.2915H12.6665V6.2915Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Additional/TimeFilled.tsx

@@ -0,0 +1,19 @@
+import React from "react";
+
+export const TimeFilled = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM10.6665 13.292H16.667V11.292H12.6665V6.29199H10.6665V13.292Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Additional/index.ts

@@ -0,0 +1,17 @@
+import { AttachFileAdd } from './AttachFileAdd';
+import { Refresh } from './Refresh';
+import { SettingsFilled } from './SettingsFilled';
+import { SettingsOutline } from './SettingsOutline';
+import { Time } from './Time';
+import { TimeFilled } from './TimeFilled';
+
+const Additional = {
+  AttachFileAdd,
+  Refresh,
+  SettingsOutline,
+  SettingsFilled,
+  Time,
+  TimeFilled
+};
+
+export default Additional;

package/src/Basic/ArrowLeft.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ArrowLeft = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M9.31433 7.87499L8.13599 6.69666L2.8335 12L8.13599 17.3033L9.31433 16.125L6.0235 12.8333H21.4277V11.1667H6.0235L9.31433 7.87499Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ArrowRight.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ArrowRight = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M14.9468 16.125L16.1252 17.3033L21.4277 12L16.1252 6.69667L14.9468 7.875L18.2377 11.1667H2.8335V12.8333H18.2377L14.9468 16.125Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ArrowUp.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ArrowUp = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M2.80798 9.87901L4.22198 11.293L11 4.51501V23H13V4.51501L19.778 11.293L21.192 9.87901L12 0.687012L2.80798 9.87901Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/Check.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Check = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M9.50003 18.399L1.29303 10.192L2.70703 8.77795L9.50003 15.571L21.293 3.77795L22.707 5.19195L9.50003 18.399Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ChevronDown.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ChevronDown = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 18.2319L2.94897 9.18194L4.36297 7.76794L12 15.4039L19.637 7.76794L21.051 9.18194L12 18.2319Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ChevronDownSmall.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ChevronDownSmall = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M7.08334 10.0833L8.25001 8.91667L12.0833 12.75L15.9167 8.91667L17.0833 10.0833L12.0833 15.0833L7.08334 10.0833Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ChevronLeft.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ChevronLeft = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M14.8181 21.051L5.76807 12L14.8181 2.94897L16.2321 4.36297L8.59606 12L16.2321 19.637L14.8181 21.051Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ChevronLeftSmall.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ChevronLeftSmall = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M14 7L15.1667 8.16667L11.3333 12L15.1667 15.8333L14 17L9 12L14 7Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ChevronRight.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ChevronRight = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M9.182 21.051L7.76801 19.637L15.404 12L7.76801 4.36297L9.182 2.94897L18.232 12L9.182 21.051Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ChevronRightSmall.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ChevronRightSmall = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M10.1667 17L9 15.8333L12.8333 12L9 8.16667L10.1667 7L15.1667 12L10.1667 17Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ChevronUp.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ChevronUp = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M19.637 16.2319L12 8.59594L4.36297 16.2319L2.94897 14.8179L12 5.76794L21.051 14.8179L19.637 16.2319Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/ChevronUpSmall.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const ChevronUpSmall = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M17.0833 13.9167L15.9167 15.0833L12.0833 11.25L8.25001 15.0833L7.08334 13.9167L12.0833 8.91667L17.0833 13.9167Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Basic/index.ts

@@ -0,0 +1,29 @@
+import { ArrowLeft } from './ArrowLeft';
+import { ArrowRight } from './ArrowRight';
+import { ArrowUp } from './ArrowUp';
+import { Check } from './Check';
+import { ChevronDown } from './ChevronDown';
+import { ChevronDownSmall } from './ChevronDownSmall';
+import { ChevronLeft } from './ChevronLeft';
+import { ChevronLeftSmall } from './ChevronLeftSmall';
+import { ChevronRight } from './ChevronRight';
+import { ChevronRightSmall } from './ChevronRightSmall';
+import { ChevronUp } from './ChevronUp';
+import { ChevronUpSmall } from './ChevronUpSmall';
+
+const Basic = {
+  ArrowLeft,
+  ArrowRight,
+  ArrowUp,
+  Check,
+  ChevronDownSmall,
+  ChevronDown,
+  ChevronLeftSmall,
+  ChevronLeft,
+  ChevronRightSmall,
+  ChevronRight,
+  ChevronUpSmall,
+  ChevronUp
+};
+
+export default Basic;

package/src/Emoji/Angry.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Angry = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM6.9312 8.1055L10.1187 9.6992L9.2241 11.4883L6.0366 9.8945L6.9312 8.1055ZM14.8281 17.4555C14.0664 16.7278 13.0535 16.3217 12 16.3217C10.9465 16.3217 9.93363 16.7278 9.1719 17.4555L7.7568 16.041C8.31398 15.4837 8.97548 15.0416 9.70354 14.74C10.4316 14.4383 11.2119 14.2831 12 14.2831C12.7881 14.2831 13.5684 14.4383 14.2965 14.74C15.0245 15.0416 15.686 15.4837 16.2432 16.041L14.8281 17.4555ZM14.7759 11.4887L13.8813 9.6996L17.0688 8.1059L17.9634 9.8949L14.7759 11.4887Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Emoji/Frowning.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Frowning = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM6.65 10C6.65 9.733 6.72918 9.47199 6.87752 9.24998C7.02586 9.02797 7.2367 8.85494 7.48338 8.75276C7.73006 8.65058 8.0015 8.62385 8.26338 8.67594C8.52525 8.72803 8.7658 8.8566 8.9546 9.04541C9.1434 9.23421 9.27197 9.47475 9.32406 9.73663C9.37615 9.9985 9.34942 10.2699 9.24724 10.5166C9.14506 10.7633 8.97203 10.9741 8.75002 11.1225C8.52802 11.2708 8.26701 11.35 8 11.35C7.64196 11.35 7.29858 11.2078 7.04541 10.9546C6.79224 10.7014 6.65 10.358 6.65 10ZM14.8281 17.4551C14.0664 16.7274 13.0535 16.3213 12 16.3213C10.9465 16.3213 9.93363 16.7274 9.1719 17.4551L7.7568 16.041C8.31398 15.4837 8.97548 15.0416 9.70354 14.74C10.4316 14.4383 11.2119 14.2831 12 14.2831C12.7881 14.2831 13.5684 14.4383 14.2965 14.74C15.0245 15.0416 15.686 15.4837 16.2432 16.041L14.8281 17.4551ZM16 11.35C15.733 11.35 15.472 11.2708 15.25 11.1225C15.028 10.9741 14.8549 10.7633 14.7528 10.5166C14.6506 10.2699 14.6239 9.9985 14.6759 9.73663C14.728 9.47475 14.8566 9.23421 15.0454 9.04541C15.2342 8.8566 15.4748 8.72803 15.7366 8.67594C15.9985 8.62385 16.2699 8.65058 16.5166 8.75276C16.7633 8.85494 16.9741 9.02797 17.1225 9.24998C17.2708 9.47199 17.35 9.733 17.35 10C17.35 10.358 17.2078 10.7014 16.9546 10.9546C16.7014 11.2078 16.358 11.35 16 11.35Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Emoji/Grin.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Grin = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM7.4583 9.1562C7.94731 9.1562 8.41629 9.35046 8.76207 9.69624C9.10785 10.042 9.3021 10.511 9.3021 11H5.6146C5.6146 10.511 5.80885 10.042 6.15461 9.69627C6.50036 9.3505 6.96932 9.15623 7.4583 9.1562ZM12 18C11.1153 17.9984 10.2562 17.7029 9.5577 17.1598C8.85924 16.6168 8.36104 15.857 8.1414 15H15.8586C15.639 15.857 15.1408 16.6168 14.4423 17.1598C13.7438 17.7029 12.8847 17.9984 12 18ZM14.6979 11C14.6961 10.7567 14.7425 10.5155 14.8343 10.2902C14.9262 10.065 15.0617 9.86012 15.2331 9.68747C15.4045 9.51481 15.6083 9.37778 15.8329 9.28427C16.0575 9.19076 16.2984 9.14262 16.5417 9.14262C16.7849 9.14262 17.0258 9.19076 17.2504 9.28427C17.475 9.37778 17.6788 9.51481 17.8502 9.68747C18.0216 9.86012 18.1571 10.065 18.249 10.2902C18.3408 10.5155 18.3872 10.7567 18.3854 11H14.6979Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Emoji/Neutral.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Neutral = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM6.65 10C6.65 9.733 6.72918 9.47199 6.87752 9.24998C7.02586 9.02797 7.2367 8.85494 7.48338 8.75276C7.73006 8.65058 8.0015 8.62385 8.26338 8.67594C8.52525 8.72803 8.7658 8.8566 8.9546 9.04541C9.1434 9.23421 9.27197 9.47475 9.32406 9.73663C9.37615 9.9985 9.34942 10.2699 9.24724 10.5166C9.14506 10.7633 8.97203 10.9741 8.75002 11.1225C8.52802 11.2708 8.26701 11.35 8 11.35C7.64196 11.35 7.29858 11.2078 7.04541 10.9546C6.79224 10.7014 6.65 10.358 6.65 10ZM15.3618 17H8.6382V15H15.3618V17ZM16 11.35C15.733 11.35 15.472 11.2708 15.25 11.1225C15.028 10.9741 14.8549 10.7633 14.7528 10.5166C14.6506 10.2699 14.6239 9.9985 14.6759 9.73663C14.728 9.47475 14.8566 9.23421 15.0454 9.04541C15.2342 8.8566 15.4748 8.72803 15.7366 8.67594C15.9985 8.62385 16.2699 8.65058 16.5166 8.75276C16.7633 8.85494 16.9741 9.02797 17.1225 9.24998C17.2708 9.47199 17.35 9.733 17.35 10C17.35 10.358 17.2078 10.7014 16.9546 10.9546C16.7014 11.2078 16.358 11.35 16 11.35Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Emoji/Smile.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Smile = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM6.65 10C6.65 9.733 6.72918 9.47199 6.87752 9.24998C7.02586 9.02797 7.2367 8.85494 7.48338 8.75276C7.73006 8.65058 8.0015 8.62385 8.26338 8.67594C8.52525 8.72803 8.7658 8.8566 8.9546 9.04541C9.1434 9.23421 9.27197 9.47475 9.32406 9.73663C9.37615 9.9985 9.34942 10.2699 9.24724 10.5166C9.14506 10.7633 8.97203 10.9741 8.75002 11.1225C8.52802 11.2708 8.26701 11.35 8 11.35C7.64196 11.35 7.29858 11.2078 7.04541 10.9546C6.79224 10.7014 6.65 10.358 6.65 10ZM12 18C11.2116 18.0022 10.4306 17.848 9.70228 17.5462C8.97392 17.2445 8.31266 16.8013 7.7568 16.2422L9.1719 14.8281C9.93363 15.5558 10.9465 15.9619 12 15.9619C13.0535 15.9619 14.0664 15.5558 14.8281 14.8281L16.2432 16.2422C15.6873 16.8013 15.0261 17.2445 14.2977 17.5462C13.5694 17.848 12.7884 18.0022 12 18ZM16 11.35C15.733 11.35 15.472 11.2708 15.25 11.1225C15.028 10.9741 14.8549 10.7633 14.7528 10.5166C14.6506 10.2699 14.6239 9.9985 14.6759 9.73663C14.728 9.47475 14.8566 9.23421 15.0454 9.04541C15.2342 8.8566 15.4748 8.72803 15.7366 8.67594C15.9985 8.62385 16.2699 8.65058 16.5166 8.75276C16.7633 8.85494 16.9741 9.02797 17.1225 9.24998C17.2708 9.47199 17.35 9.733 17.35 10C17.35 10.358 17.2078 10.7014 16.9546 10.9546C16.7014 11.2078 16.358 11.35 16 11.35Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/Emoji/index.ts

@@ -0,0 +1,15 @@
+import { Angry } from './Angry';
+import { Frowning } from './Frowning';
+import { Grin } from './Grin';
+import { Neutral } from './Neutral';
+import { Smile } from './Smile';
+
+const Emoji = {
+  Angry,
+  Frowning,
+  Grin,
+  Neutral,
+  Smile
+};
+
+export default Emoji;

package/src/General/Accessibility.tsx

@@ -0,0 +1,19 @@
+import React from "react";
+
+export const Accessibility = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M16.1679 21.5547L14.5476 19.1242C13.7127 19.2925 12.8595 19.3784 12 19.3784C9.5578 19.3784 7.16584 18.6849 5.10235 17.3787C3.03887 16.0725 1.38867 14.2073 0.34375 12C1.38963 9.79341 3.04005 7.92881 5.10332 6.62275C5.36457 6.45738 5.63109 6.30182 5.9023 6.15624L4.16795 3.55471L5.83205 2.44531L7.76156 5.33957C9.11781 4.86725 10.55 4.6223 12 4.62159C14.4419 4.62278 16.8333 5.3167 18.8966 6.62275C20.9599 7.92881 22.6103 9.79341 23.6562 12C22.6112 14.2073 20.961 16.0725 18.8975 17.3787C18.1577 17.847 17.3757 18.2366 16.5643 18.5436L17.8321 20.4453L16.1679 21.5547ZM17.4055 15.9278C16.7704 16.2915 16.1031 16.5892 15.414 16.8183L14.1701 14.9524C14.5115 14.7014 14.8087 14.3918 15.0466 14.0357C15.4492 13.4331 15.6642 12.7247 15.6642 12C15.6642 11.0282 15.2781 10.0962 14.5909 9.40899C13.9038 8.72182 12.9718 8.33577 12 8.33577C11.3326 8.33577 10.6791 8.51798 10.1093 8.8612L8.91389 7.06808C9.9117 6.77325 10.9508 6.62168 12 6.62168C13.8985 6.62168 15.7641 7.118 17.4117 8.06142C19.0593 9.00485 20.4316 10.3626 21.3925 12C20.4254 13.6319 19.0517 14.9852 17.4055 15.9278ZM13.1762 13.1762C13.1383 13.2141 13.0987 13.25 13.0577 13.2838L11.2213 10.5292C11.3632 10.4541 11.5161 10.3995 11.6753 10.3678C11.9981 10.3035 12.3327 10.3365 12.6368 10.4625C12.9409 10.5884 13.2008 10.8017 13.3837 11.0754C13.5665 11.3491 13.6642 11.6708 13.6642 12C13.6636 12.4412 13.4882 12.8642 13.1762 13.1762ZM13.3262 17.2922L7.0171 7.82844C6.87261 7.90279 6.72961 7.98046 6.58822 8.06142C6.17438 8.2984 5.7779 8.56152 5.40094 8.84864L11.0577 17.3337C11.3703 17.362 11.6847 17.377 12 17.3783C12.4448 17.3764 12.8876 17.3475 13.3262 17.2922ZM8.2259 16.6916C7.66406 16.4829 7.11826 16.2278 6.59437 15.9278C4.94818 14.9852 3.57449 13.6319 2.60735 12C2.98214 11.3614 3.4195 10.7653 3.91135 10.2198L8.2259 16.6916Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);

package/src/General/Account.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export const Account = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    fill="none"
+  >
+    <path
+      d="M12 6.7916C11.4067 6.7916 10.8266 6.96755 10.3333 7.29719C9.83995 7.62684 9.45543 8.09537 9.22837 8.64355C9.0013 9.19173 8.94189 9.79493 9.05765 10.3769C9.1734 10.9588 9.45913 11.4934 9.87868 11.9129C10.2982 12.3325 10.8328 12.6182 11.4147 12.734C11.9967 12.8497 12.5999 12.7903 13.1481 12.5632C13.6962 12.3362 14.1648 11.9517 14.4944 11.4583C14.8241 10.965 15 10.3849 15 9.7916C15 8.99595 14.6839 8.23289 14.1213 7.67028C13.5587 7.10767 12.7957 6.7916 12 6.7916ZM12 11.0916C11.7429 11.0916 11.4915 11.0154 11.2778 10.8725C11.064 10.7297 10.8974 10.5266 10.799 10.2891C10.7006 10.0515 10.6748 9.79016 10.725 9.53798C10.7751 9.28581 10.899 9.05417 11.0808 8.87236C11.2626 8.69055 11.4942 8.56674 11.7464 8.51658C11.9986 8.46642 12.2599 8.49216 12.4975 8.59056C12.735 8.68895 12.9381 8.85558 13.0809 9.06936C13.2238 9.28314 13.3 9.53448 13.3 9.7916C13.2996 10.1363 13.1625 10.4667 12.9188 10.7104C12.6751 10.9541 12.3447 11.0912 12 11.0916ZM12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM15.0029 19.41C13.0783 20.1968 10.9217 20.1968 8.9971 19.41V17.09C9.84669 16.402 10.9068 16.0266 12 16.0266C13.0932 16.0266 14.1533 16.402 15.0029 17.09V19.41ZM17.0029 18.233V16.2383L16.71 15.9453C16.0915 15.3267 15.3573 14.8359 14.5491 14.5011C13.741 14.1663 12.8748 13.994 12 13.994C11.1252 13.994 10.259 14.1663 9.4509 14.5011C8.64274 14.8359 7.90847 15.3267 7.29 15.9453L6.9971 16.2383V18.2329C5.70398 17.1966 4.76459 15.7843 4.3087 14.1911C3.8528 12.5979 3.90292 10.9024 4.45211 9.33894C5.0013 7.77545 6.02247 6.42109 7.37455 5.46296C8.72662 4.50484 10.3429 3.99023 12 3.99023C13.6571 3.99023 15.2734 4.50484 16.6255 5.46296C17.9775 6.42109 18.9987 7.77545 19.5479 9.33894C20.0971 10.9024 20.1472 12.5979 19.6913 14.1911C19.2354 15.7843 18.296 17.1967 17.0029 18.233Z"
+      fill={props.fill ?? "black"}
+    />
+  </svg>
+);