Merge pull request #35 from nebula-aac/svg-icons

[svg] Added 8 icons from Meshery UI
layer5io · Aug 25, 2023 · 3ead289 · 3ead289
2 parents 9e972fe + 3da7f24
commit 3ead289
Show file tree

Hide file tree

Showing 8 changed files with 128 additions and 0 deletions.
diff --git a/packages/svg/src/icons/AddIcon.tsx b/packages/svg/src/icons/AddIcon.tsx
@@ -0,0 +1,13 @@
+import { FC } from "react";
+import { IconProps } from "./types";
+
+export const AddIcon: FC<IconProps> = ({ width, height, ...props }) => {
+    return (
+        <svg height="24" width="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" {...props}>
+            <path d="M0 0h24v24H0z" fill="none" />
+            <path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
+        </svg>
+    )
+}
+
+export default AddIcon
diff --git a/packages/svg/src/icons/AddIconCircleBorder.tsx b/packages/svg/src/icons/AddIconCircleBorder.tsx
@@ -0,0 +1,13 @@
+import { FC } from "react"
+import { IconProps } from "./types"
+
+export const AddIconCircleBordered: FC<IconProps> = ({ width, height, color, ...props }) => {
+    return (
+        <svg width="24" height="24" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
+            <path d="M0 0h48v48h-48z" fill="none" />
+            <path d="M26 14h-4v8h-8v4h8v8h4v-8h8v-4h-8v-8zm-2-10c-11.05 0-20 8.95-20 20s8.95 20 20 20 20-8.95 20-20-8.95-20-20-20zm0 36c-8.82 0-16-7.18-16-16s7.18-16 16-16 16 7.18 16 16-7.18 16-16 16z" />
+        </svg>
+    )
+}
+
+export default AddIconCircleBordered
diff --git a/packages/svg/src/icons/BellIcon.tsx b/packages/svg/src/icons/BellIcon.tsx
@@ -0,0 +1,19 @@
+import { FC } from "react"
+import { IconProps } from "./types"
+
+export const BellIcon: FC<IconProps> = ({ width, height, color, ...props }) => {
+    return (
+        <svg
+            width={width}
+            height={height}
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 24 24"
+            {...props}
+        >
+            <path d="M12 22c1.1 0 2-.9 2-2h-4c0 1.1.89 2 2 2zm6-6v-5c0-3.07-1.64-5.64-4.5-6.32V4c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5 1.5v.68C7.63 5.36 6 7.92 6 11v5l-2 2v1h16v-1l-2-2z" />
+        </svg>
+
+    )
+}
+
+export default BellIcon
diff --git a/packages/svg/src/icons/ChatIcon.tsx b/packages/svg/src/icons/ChatIcon.tsx
@@ -0,0 +1,18 @@
+import { FC } from "react"
+import { IconProps } from "./types"
+
+export const ChatIcon: FC<IconProps> = ({ width, height, color, ...props }) => {
+    return (
+        <svg
+            width={width}
+            height={height}
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 30 30"
+            {...props}
+        >
+            <path d="M15 3C7.82 3 2 7.925 2 14c0 3.368 1.793 6.378 4.611 8.396.072 1.536-.166 3.657-2.285 4.635a.5.5 0 0 0-.004.002A.5.5 0 0 0 4 27.5a.5.5 0 0 0 .5.5l.035-.002a.5.5 0 0 0 .008 0c2.434-.016 4.5-1.331 5.926-2.72.452-.442 1.082-.659 1.703-.542.91.173 1.856.264 2.828.264 7.18 0 13-4.925 13-11S22.18 3 15 3z" />
+        </svg>
+    )
+}
+
+export default ChatIcon
diff --git a/packages/svg/src/icons/ConfigurationIcon.tsx b/packages/svg/src/icons/ConfigurationIcon.tsx
@@ -0,0 +1,19 @@
+import { FC } from "react"
+import { IconProps } from "./types"
+
+export const ConfigurationIcon: FC<IconProps> = ({ width, height, color, ...props }) => {
+    return (
+        <svg
+            width={width}
+            height={height}
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 64 64"
+            {...props}
+        >
+            <path d="M58.17 44.55a9.57 9.57 0 0 0-9.75-2.34L21.79 15.58c2.35-6.79-3.95-13.91-11-12.4a1 1 0 0 0-.79.88 1 1 0 0 0 .28.81l4 4-1.18 4.23-4.27 1.14-4-4a1.1 1.1 0 0 0-.77-.24 1 1 0 0 0-.88.79c-1.55 7 5.7 13.41 12.42 11l26.61 26.63c-2.36 6.79 4 13.91 11 12.4a1 1 0 0 0 .79-.88 1 1 0 0 0-.28-.81l-4-4 1.18-4.23 4.27-1.14 4 4a1.29 1.29 0 0 0 .71.3 1 1 0 0 0 1-.81 9.59 9.59 0 0 0-2.71-8.7Z" />
+            <path d="M39.28 29.52a1 1 0 0 0 1.41 0l7.46-7.45c9 2.57 15.59-8.52 9-15.21s-17.75 0-15.19 9l-7.47 7.47a1 1 0 0 0 0 1.41Zm6.56-15.42 1-3.88a1 1 0 0 1 .71-.71l3.88-1a1 1 0 0 1 1 .26l2.84 2.84a1 1 0 0 1 .26 1l-1 3.88a1 1 0 0 1-.71.71l-3.88 1a1.07 1.07 0 0 1-.25 0 1 1 0 0 1-.71-.29l-2.88-2.85a1 1 0 0 1-.26-.96ZM24.72 34.48a1 1 0 0 0-1.41 0L15.84 42c-9-2.56-15.56 8.5-9 15.19s17.79 0 15.19-9l7.47-7.47a1 1 0 0 0 0-1.41Zm-7.23 15.6-.86 3.21a1 1 0 0 1-.71.71l-3.21.86a1 1 0 0 1-1-.26L9.4 52.25a1 1 0 0 1-.26-1l.86-3.17a1 1 0 0 1 .71-.71l3.21-.86a1 1 0 0 1 1 .26l2.35 2.35a1 1 0 0 1 .22.96Z" />
+        </svg>
+    )
+}
+
+export default ConfigurationIcon
diff --git a/packages/svg/src/icons/CredentialIcon.tsx b/packages/svg/src/icons/CredentialIcon.tsx
@@ -0,0 +1,18 @@
+import { FC } from "react"
+import { IconProps } from "./types"
+
+export const CredentialIcon: FC<IconProps> = ({ width, height, color, ...props }) => {
+    return (
+        <svg
+            width={width}
+            height={height}
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 18 19"
+            {...props}
+        >
+            <path d="M13.358 3.853a.348.348 0 0 1-.173-.046C11.745 3.066 10.5 2.75 9.008 2.75A8.58 8.58 0 0 0 4.83 3.808a.382.382 0 0 1-.51-.15.38.38 0 0 1 .15-.51A9.417 9.417 0 0 1 9.008 2c1.597 0 2.992.353 4.522 1.14a.367.367 0 0 1 .158.502.368.368 0 0 1-.33.21ZM2.625 7.79a.374.374 0 0 1-.308-.593A7.754 7.754 0 0 1 5.13 4.745c2.355-1.215 5.37-1.223 7.733-.008a7.784 7.784 0 0 1 2.812 2.438.375.375 0 0 1-.09.525.374.374 0 0 1-.525-.09 7.04 7.04 0 0 0-2.542-2.205c-2.153-1.103-4.905-1.103-7.05.007a7.115 7.115 0 0 0-2.55 2.22.327.327 0 0 1-.293.158Zm4.688 9.053a.352.352 0 0 1-.263-.113c-.652-.652-1.005-1.072-1.507-1.98-.518-.922-.788-2.047-.788-3.255C4.755 9.268 6.66 7.453 9 7.453s4.245 1.814 4.245 4.042c0 .21-.165.375-.375.375a.371.371 0 0 1-.375-.375c0-1.815-1.567-3.292-3.495-3.292-1.927 0-3.495 1.477-3.495 3.292 0 1.08.24 2.078.698 2.888.48.862.81 1.23 1.387 1.815a.385.385 0 0 1 0 .532.411.411 0 0 1-.277.113Zm5.377-1.388c-.892 0-1.68-.225-2.325-.668C9.248 14.03 8.58 12.8 8.58 11.495c0-.21.165-.375.375-.375s.375.165.375.375c0 1.058.54 2.055 1.455 2.67.533.36 1.155.533 1.905.533.18 0 .48-.023.78-.075a.374.374 0 0 1 .435.307.374.374 0 0 1-.307.435 5.18 5.18 0 0 1-.908.09ZM11.183 17a.439.439 0 0 1-.098-.015c-1.192-.33-1.972-.773-2.79-1.575a5.472 5.472 0 0 1-1.627-3.915c0-1.215 1.035-2.205 2.31-2.205 1.275 0 2.31.99 2.31 2.205 0 .803.697 1.455 1.56 1.455.862 0 1.56-.652 1.56-1.455 0-2.827-2.438-5.122-5.438-5.122-2.13 0-4.08 1.184-4.957 3.022-.293.607-.443 1.32-.443 2.1 0 .585.053 1.508.503 2.708a.366.366 0 0 1-.218.48.372.372 0 0 1-.48-.218 8.355 8.355 0 0 1-.547-2.97c0-.9.172-1.717.51-2.43.997-2.092 3.21-3.45 5.632-3.45 3.413 0 6.188 2.633 6.188 5.873 0 1.215-1.035 2.205-2.31 2.205-1.275 0-2.31-.99-2.31-2.205 0-.803-.698-1.455-1.56-1.455-.863 0-1.56.652-1.56 1.455 0 1.282.495 2.482 1.402 3.382.713.705 1.395 1.095 2.453 1.388a.372.372 0 0 1 .262.457.366.366 0 0 1-.352.285Z" />
+        </svg>
+    )
+}
+
+export default CredentialIcon
diff --git a/packages/svg/src/icons/DashboardIcon.tsx b/packages/svg/src/icons/DashboardIcon.tsx
@@ -0,0 +1,21 @@
+import { FC } from "react"
+import { IconProps } from "./types"
+
+export const DashboardIcon: FC<IconProps> = ({ width, height, color, ...props }) => {
+    return (
+        <svg
+            width={width}
+            height={height}
+            viewBox="0 0 24 24"
+            xmlns="http://www.w3.org/2000/svg"
+            {...props}
+        >
+            <g>
+                <path fill="none" d="M0 0h24v24H0z" />
+                <path d="M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z" />
+            </g>
+        </svg>
+    )
+}
+
+export default DashboardIcon
diff --git a/packages/svg/src/icons/index.ts b/packages/svg/src/icons/index.ts
@@ -1,6 +1,13 @@
 export * from "./Application"
 export * from "./Bus"
 export * from "./Circle"
+export { default as AddIcon } from "./AddIcon";
+export { default as AddIconCircleBorder } from "./AddIconCircleBorder";
+export { default as BellIcon } from "./BellIcon";
+export { default as ChatIcon } from "./ChatIcon";
+export { default as ConfigurationIcon } from "./ConfigurationIcon";
+export { default as CredentialIcon } from "./CredentialIcon";
+export { default as DashboardIcon } from "./DashboardIcon";
 export { default as CloneIcon } from "./CloneIcon";
 export { default as CloudSavedIcon } from "./CloudSavedIcon";
 export { default as CloudSavingIcon } from "./CloudSavingIcon";