reset packages directory

packages/react/src/icons/activity.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Activity = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline>
+      </svg>
+    );
+  }
+);
+
+Activity.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Activity.displayName = "Activity";
+
+export default Activity;

packages/react/src/icons/airplay.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Airplay = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M5 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-1"></path>
+        <polygon points="12 15 17 21 7 21 12 15"></polygon>
+      </svg>
+    );
+  }
+);
+
+Airplay.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Airplay.displayName = "Airplay";
+
+export default Airplay;

packages/react/src/icons/alert-circle.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const AlertCircle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <line x1="12" y1="8" x2="12" y2="12"></line>
+        <line x1="12" y1="16" x2="12.01" y2="16"></line>
+      </svg>
+    );
+  }
+);
+
+AlertCircle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+AlertCircle.displayName = "AlertCircle";
+
+export default AlertCircle;

packages/react/src/icons/alert-octagon.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const AlertOctagon = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polygon points="7.86 2 16.14 2 22 7.86 22 16.14 16.14 22 7.86 22 2 16.14 2 7.86 7.86 2"></polygon>
+        <line x1="12" y1="8" x2="12" y2="12"></line>
+        <line x1="12" y1="16" x2="12.01" y2="16"></line>
+      </svg>
+    );
+  }
+);
+
+AlertOctagon.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+AlertOctagon.displayName = "AlertOctagon";
+
+export default AlertOctagon;

packages/react/src/icons/alert-triangle.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const AlertTriangle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path>
+        <line x1="12" y1="9" x2="12" y2="13"></line>
+        <line x1="12" y1="17" x2="12.01" y2="17"></line>
+      </svg>
+    );
+  }
+);
+
+AlertTriangle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+AlertTriangle.displayName = "AlertTriangle";
+
+export default AlertTriangle;

packages/react/src/icons/align-center.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const AlignCenter = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="18" y1="10" x2="6" y2="10"></line>
+        <line x1="21" y1="6" x2="3" y2="6"></line>
+        <line x1="21" y1="14" x2="3" y2="14"></line>
+        <line x1="18" y1="18" x2="6" y2="18"></line>
+      </svg>
+    );
+  }
+);
+
+AlignCenter.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+AlignCenter.displayName = "AlignCenter";
+
+export default AlignCenter;

packages/react/src/icons/align-justify.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const AlignJustify = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="21" y1="10" x2="3" y2="10"></line>
+        <line x1="21" y1="6" x2="3" y2="6"></line>
+        <line x1="21" y1="14" x2="3" y2="14"></line>
+        <line x1="21" y1="18" x2="3" y2="18"></line>
+      </svg>
+    );
+  }
+);
+
+AlignJustify.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+AlignJustify.displayName = "AlignJustify";
+
+export default AlignJustify;

packages/react/src/icons/align-left.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const AlignLeft = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="17" y1="10" x2="3" y2="10"></line>
+        <line x1="21" y1="6" x2="3" y2="6"></line>
+        <line x1="21" y1="14" x2="3" y2="14"></line>
+        <line x1="17" y1="18" x2="3" y2="18"></line>
+      </svg>
+    );
+  }
+);
+
+AlignLeft.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+AlignLeft.displayName = "AlignLeft";
+
+export default AlignLeft;

packages/react/src/icons/align-right.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const AlignRight = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="21" y1="10" x2="7" y2="10"></line>
+        <line x1="21" y1="6" x2="3" y2="6"></line>
+        <line x1="21" y1="14" x2="3" y2="14"></line>
+        <line x1="21" y1="18" x2="7" y2="18"></line>
+      </svg>
+    );
+  }
+);
+
+AlignRight.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+AlignRight.displayName = "AlignRight";
+
+export default AlignRight;

packages/react/src/icons/anchor.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Anchor = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="5" r="3"></circle>
+        <line x1="12" y1="22" x2="12" y2="8"></line>
+        <path d="M5 12H2a10 10 0 0 0 20 0h-3"></path>
+      </svg>
+    );
+  }
+);
+
+Anchor.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Anchor.displayName = "Anchor";
+
+export default Anchor;

packages/react/src/icons/aperture.js

@@ -0,0 +1,40 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Aperture = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <line x1="14.31" y1="8" x2="20.05" y2="17.94"></line>
+        <line x1="9.69" y1="8" x2="21.17" y2="8"></line>
+        <line x1="7.38" y1="12" x2="13.12" y2="2.06"></line>
+        <line x1="9.69" y1="16" x2="3.95" y2="6.06"></line>
+        <line x1="14.31" y1="16" x2="2.83" y2="16"></line>
+        <line x1="16.62" y1="12" x2="10.88" y2="21.94"></line>
+      </svg>
+    );
+  }
+);
+
+Aperture.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Aperture.displayName = "Aperture";
+
+export default Aperture;

packages/react/src/icons/archive.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Archive = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="21 8 21 21 3 21 3 8"></polyline>
+        <rect x="1" y="3" width="22" height="5"></rect>
+        <line x1="10" y1="12" x2="14" y2="12"></line>
+      </svg>
+    );
+  }
+);
+
+Archive.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Archive.displayName = "Archive";
+
+export default Archive;

packages/react/src/icons/arrow-down-circle.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowDownCircle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <polyline points="8 12 12 16 16 12"></polyline>
+        <line x1="12" y1="8" x2="12" y2="16"></line>
+      </svg>
+    );
+  }
+);
+
+ArrowDownCircle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowDownCircle.displayName = "ArrowDownCircle";
+
+export default ArrowDownCircle;

packages/react/src/icons/arrow-down-left.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowDownLeft = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="17" y1="7" x2="7" y2="17"></line>
+        <polyline points="17 17 7 17 7 7"></polyline>
+      </svg>
+    );
+  }
+);
+
+ArrowDownLeft.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowDownLeft.displayName = "ArrowDownLeft";
+
+export default ArrowDownLeft;

packages/react/src/icons/arrow-down-right.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowDownRight = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="7" y1="7" x2="17" y2="17"></line>
+        <polyline points="17 7 17 17 7 17"></polyline>
+      </svg>
+    );
+  }
+);
+
+ArrowDownRight.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowDownRight.displayName = "ArrowDownRight";
+
+export default ArrowDownRight;

packages/react/src/icons/arrow-down.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowDown = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="12" y1="5" x2="12" y2="19"></line>
+        <polyline points="19 12 12 19 5 12"></polyline>
+      </svg>
+    );
+  }
+);
+
+ArrowDown.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowDown.displayName = "ArrowDown";
+
+export default ArrowDown;

packages/react/src/icons/arrow-left-circle.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowLeftCircle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <polyline points="12 8 8 12 12 16"></polyline>
+        <line x1="16" y1="12" x2="8" y2="12"></line>
+      </svg>
+    );
+  }
+);
+
+ArrowLeftCircle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowLeftCircle.displayName = "ArrowLeftCircle";
+
+export default ArrowLeftCircle;

packages/react/src/icons/arrow-left.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowLeft = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="19" y1="12" x2="5" y2="12"></line>
+        <polyline points="12 19 5 12 12 5"></polyline>
+      </svg>
+    );
+  }
+);
+
+ArrowLeft.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowLeft.displayName = "ArrowLeft";
+
+export default ArrowLeft;

packages/react/src/icons/arrow-right-circle.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowRightCircle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <polyline points="12 16 16 12 12 8"></polyline>
+        <line x1="8" y1="12" x2="16" y2="12"></line>
+      </svg>
+    );
+  }
+);
+
+ArrowRightCircle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowRightCircle.displayName = "ArrowRightCircle";
+
+export default ArrowRightCircle;

packages/react/src/icons/arrow-right.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowRight = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="5" y1="12" x2="19" y2="12"></line>
+        <polyline points="12 5 19 12 12 19"></polyline>
+      </svg>
+    );
+  }
+);
+
+ArrowRight.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowRight.displayName = "ArrowRight";
+
+export default ArrowRight;

packages/react/src/icons/arrow-up-circle.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowUpCircle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <polyline points="16 12 12 8 8 12"></polyline>
+        <line x1="12" y1="16" x2="12" y2="8"></line>
+      </svg>
+    );
+  }
+);
+
+ArrowUpCircle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowUpCircle.displayName = "ArrowUpCircle";
+
+export default ArrowUpCircle;

packages/react/src/icons/arrow-up-left.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowUpLeft = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="17" y1="17" x2="7" y2="7"></line>
+        <polyline points="7 17 7 7 17 7"></polyline>
+      </svg>
+    );
+  }
+);
+
+ArrowUpLeft.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowUpLeft.displayName = "ArrowUpLeft";
+
+export default ArrowUpLeft;

packages/react/src/icons/arrow-up-right.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowUpRight = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="7" y1="17" x2="17" y2="7"></line>
+        <polyline points="7 7 17 7 17 17"></polyline>
+      </svg>
+    );
+  }
+);
+
+ArrowUpRight.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowUpRight.displayName = "ArrowUpRight";
+
+export default ArrowUpRight;

packages/react/src/icons/arrow-up.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ArrowUp = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="12" y1="19" x2="12" y2="5"></line>
+        <polyline points="5 12 12 5 19 12"></polyline>
+      </svg>
+    );
+  }
+);
+
+ArrowUp.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ArrowUp.displayName = "ArrowUp";
+
+export default ArrowUp;

packages/react/src/icons/at-sign.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const AtSign = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="4"></circle>
+        <path d="M16 8v5a3 3 0 0 0 6 0v-1a10 10 0 1 0-3.92 7.94"></path>
+      </svg>
+    );
+  }
+);
+
+AtSign.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+AtSign.displayName = "AtSign";
+
+export default AtSign;

packages/react/src/icons/award.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Award = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="8" r="7"></circle>
+        <polyline points="8.21 13.89 7 23 12 20 17 23 15.79 13.88"></polyline>
+      </svg>
+    );
+  }
+);
+
+Award.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Award.displayName = "Award";
+
+export default Award;

packages/react/src/icons/bar-chart-2.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const BarChart2 = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="18" y1="20" x2="18" y2="10"></line>
+        <line x1="12" y1="20" x2="12" y2="4"></line>
+        <line x1="6" y1="20" x2="6" y2="14"></line>
+      </svg>
+    );
+  }
+);
+
+BarChart2.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+BarChart2.displayName = "BarChart2";
+
+export default BarChart2;

packages/react/src/icons/bar-chart.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const BarChart = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="12" y1="20" x2="12" y2="10"></line>
+        <line x1="18" y1="20" x2="18" y2="4"></line>
+        <line x1="6" y1="20" x2="6" y2="16"></line>
+      </svg>
+    );
+  }
+);
+
+BarChart.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+BarChart.displayName = "BarChart";
+
+export default BarChart;

packages/react/src/icons/battery-charging.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const BatteryCharging = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M7 7H3.77778C2.79594 7 2 7.74619 2 8.66667V15.3333C2 16.2538 2.79594 17 3.77778 17H6M14 7H16.2222C17.2041 7 18 7.74619 18 8.66667V15.3333C18 16.2538 17.2041 17 16.2222 17H13"></path>
+        <polyline points="11 7 8 12 12 12 9 17"></polyline>
+        <line x1="22" x2="22" y1="11" y2="13"></line>
+      </svg>
+    );
+  }
+);
+
+BatteryCharging.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+BatteryCharging.displayName = "BatteryCharging";
+
+export default BatteryCharging;

packages/react/src/icons/battery-full.js

@@ -0,0 +1,38 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const BatteryFull = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="2" y="7" width="16" height="10" rx="2" ry="2"></rect>
+        <line x1="22" x2="22" y1="11" y2="13"></line>
+        <line x1="6" x2="6" y1="10" y2="14"></line>
+        <line x1="10" x2="10" y1="10" y2="14"></line>
+        <line x1="14" x2="14" y1="10" y2="14"></line>
+      </svg>
+    );
+  }
+);
+
+BatteryFull.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+BatteryFull.displayName = "BatteryFull";
+
+export default BatteryFull;

packages/react/src/icons/battery-low.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const BatteryLow = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="2" y="7" width="16" height="10" rx="2" ry="2"></rect>
+        <line x1="22" x2="22" y1="11" y2="13"></line>
+        <line x1="6" x2="6" y1="10" y2="14"></line>
+      </svg>
+    );
+  }
+);
+
+BatteryLow.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+BatteryLow.displayName = "BatteryLow";
+
+export default BatteryLow;

packages/react/src/icons/battery-medium.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const BatteryMedium = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="2" y="7" width="16" height="10" rx="2" ry="2"></rect>
+        <line x1="22" x2="22" y1="11" y2="13"></line>
+        <line x1="6" x2="6" y1="10" y2="14"></line>
+        <line x1="10" x2="10" y1="10" y2="14"></line>
+      </svg>
+    );
+  }
+);
+
+BatteryMedium.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+BatteryMedium.displayName = "BatteryMedium";
+
+export default BatteryMedium;

packages/react/src/icons/battery.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Battery = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="2" y="7" width="16" height="10" rx="2" ry="2"></rect>
+        <line x1="22" x2="22" y1="11" y2="13"></line>
+      </svg>
+    );
+  }
+);
+
+Battery.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Battery.displayName = "Battery";
+
+export default Battery;

packages/react/src/icons/bell-off.js

@@ -0,0 +1,38 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const BellOff = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
+        <path d="M18.63 13A17.89 17.89 0 0 1 18 8"></path>
+        <path d="M6.26 6.26A5.86 5.86 0 0 0 6 8c0 7-3 9-3 9h14"></path>
+        <path d="M18 8a6 6 0 0 0-9.33-5"></path>
+        <line x1="1" y1="1" x2="23" y2="23"></line>
+      </svg>
+    );
+  }
+);
+
+BellOff.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+BellOff.displayName = "BellOff";
+
+export default BellOff;

packages/react/src/icons/bell.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Bell = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path>
+        <path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
+      </svg>
+    );
+  }
+);
+
+Bell.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Bell.displayName = "Bell";
+
+export default Bell;

packages/react/src/icons/bluetooth.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Bluetooth = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="6.5 6.5 17.5 17.5 12 23 12 1 17.5 6.5 6.5 17.5"></polyline>
+      </svg>
+    );
+  }
+);
+
+Bluetooth.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Bluetooth.displayName = "Bluetooth";
+
+export default Bluetooth;

packages/react/src/icons/bold.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Bold = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M6 4h8a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path>
+        <path d="M6 12h9a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path>
+      </svg>
+    );
+  }
+);
+
+Bold.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Bold.displayName = "Bold";
+
+export default Bold;

packages/react/src/icons/book-open.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const BookOpen = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"></path>
+        <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"></path>
+      </svg>
+    );
+  }
+);
+
+BookOpen.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+BookOpen.displayName = "BookOpen";
+
+export default BookOpen;

packages/react/src/icons/book.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Book = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
+        <path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
+      </svg>
+    );
+  }
+);
+
+Book.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Book.displayName = "Book";
+
+export default Book;

packages/react/src/icons/bookmark.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Bookmark = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path>
+      </svg>
+    );
+  }
+);
+
+Bookmark.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Bookmark.displayName = "Bookmark";
+
+export default Bookmark;

packages/react/src/icons/box.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Box = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path>
+        <polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline>
+        <line x1="12" y1="22.08" x2="12" y2="12"></line>
+      </svg>
+    );
+  }
+);
+
+Box.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Box.displayName = "Box";
+
+export default Box;

packages/react/src/icons/briefcase.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Briefcase = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="2" y="7" width="20" height="14" rx="2" ry="2"></rect>
+        <path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"></path>
+      </svg>
+    );
+  }
+);
+
+Briefcase.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Briefcase.displayName = "Briefcase";
+
+export default Briefcase;

packages/react/src/icons/calendar.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Calendar = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
+        <line x1="16" y1="2" x2="16" y2="6"></line>
+        <line x1="8" y1="2" x2="8" y2="6"></line>
+        <line x1="3" y1="10" x2="21" y2="10"></line>
+      </svg>
+    );
+  }
+);
+
+Calendar.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Calendar.displayName = "Calendar";
+
+export default Calendar;

packages/react/src/icons/camera-off.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CameraOff = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="1" y1="1" x2="23" y2="23"></line>
+        <path d="M21 21H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h3m3-3h6l2 3h4a2 2 0 0 1 2 2v9.34m-7.72-2.06a4 4 0 1 1-5.56-5.56"></path>
+      </svg>
+    );
+  }
+);
+
+CameraOff.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CameraOff.displayName = "CameraOff";
+
+export default CameraOff;

packages/react/src/icons/camera.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Camera = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"></path>
+        <circle cx="12" cy="13" r="4"></circle>
+      </svg>
+    );
+  }
+);
+
+Camera.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Camera.displayName = "Camera";
+
+export default Camera;

packages/react/src/icons/cast.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Cast = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M2 16.1A5 5 0 0 1 5.9 20M2 12.05A9 9 0 0 1 9.95 20M2 8V6a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2h-6"></path>
+        <line x1="2" y1="20" x2="2.01" y2="20"></line>
+      </svg>
+    );
+  }
+);
+
+Cast.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Cast.displayName = "Cast";
+
+export default Cast;

packages/react/src/icons/check-circle.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CheckCircle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path>
+        <polyline points="22 4 12 14.01 9 11.01"></polyline>
+      </svg>
+    );
+  }
+);
+
+CheckCircle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CheckCircle.displayName = "CheckCircle";
+
+export default CheckCircle;

packages/react/src/icons/check-square.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CheckSquare = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="9 11 12 14 22 4"></polyline>
+        <path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"></path>
+      </svg>
+    );
+  }
+);
+
+CheckSquare.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CheckSquare.displayName = "CheckSquare";
+
+export default CheckSquare;

packages/react/src/icons/check.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Check = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="20 6 9 17 4 12"></polyline>
+      </svg>
+    );
+  }
+);
+
+Check.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Check.displayName = "Check";
+
+export default Check;

packages/react/src/icons/chevron-down.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ChevronDown = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="6 9 12 15 18 9"></polyline>
+      </svg>
+    );
+  }
+);
+
+ChevronDown.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ChevronDown.displayName = "ChevronDown";
+
+export default ChevronDown;

packages/react/src/icons/chevron-left.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ChevronLeft = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="15 18 9 12 15 6"></polyline>
+      </svg>
+    );
+  }
+);
+
+ChevronLeft.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ChevronLeft.displayName = "ChevronLeft";
+
+export default ChevronLeft;

packages/react/src/icons/chevron-right.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ChevronRight = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="9 18 15 12 9 6"></polyline>
+      </svg>
+    );
+  }
+);
+
+ChevronRight.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ChevronRight.displayName = "ChevronRight";
+
+export default ChevronRight;

packages/react/src/icons/chevron-up.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ChevronUp = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="18 15 12 9 6 15"></polyline>
+      </svg>
+    );
+  }
+);
+
+ChevronUp.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ChevronUp.displayName = "ChevronUp";
+
+export default ChevronUp;

packages/react/src/icons/chevrons-down.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ChevronsDown = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="7 13 12 18 17 13"></polyline>
+        <polyline points="7 6 12 11 17 6"></polyline>
+      </svg>
+    );
+  }
+);
+
+ChevronsDown.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ChevronsDown.displayName = "ChevronsDown";
+
+export default ChevronsDown;

packages/react/src/icons/chevrons-left.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ChevronsLeft = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="11 17 6 12 11 7"></polyline>
+        <polyline points="18 17 13 12 18 7"></polyline>
+      </svg>
+    );
+  }
+);
+
+ChevronsLeft.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ChevronsLeft.displayName = "ChevronsLeft";
+
+export default ChevronsLeft;

packages/react/src/icons/chevrons-right.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ChevronsRight = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="13 17 18 12 13 7"></polyline>
+        <polyline points="6 17 11 12 6 7"></polyline>
+      </svg>
+    );
+  }
+);
+
+ChevronsRight.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ChevronsRight.displayName = "ChevronsRight";
+
+export default ChevronsRight;

packages/react/src/icons/chevrons-up.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const ChevronsUp = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="17 11 12 6 7 11"></polyline>
+        <polyline points="17 18 12 13 7 18"></polyline>
+      </svg>
+    );
+  }
+);
+
+ChevronsUp.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+ChevronsUp.displayName = "ChevronsUp";
+
+export default ChevronsUp;

packages/react/src/icons/chrome.js

@@ -0,0 +1,38 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Chrome = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <circle cx="12" cy="12" r="4"></circle>
+        <line x1="21.17" y1="8" x2="12" y2="8"></line>
+        <line x1="3.95" y1="6.06" x2="8.54" y2="14"></line>
+        <line x1="10.88" y1="21.94" x2="15.46" y2="14"></line>
+      </svg>
+    );
+  }
+);
+
+Chrome.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Chrome.displayName = "Chrome";
+
+export default Chrome;

packages/react/src/icons/circle.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Circle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+      </svg>
+    );
+  }
+);
+
+Circle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Circle.displayName = "Circle";
+
+export default Circle;

packages/react/src/icons/clipboard.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Clipboard = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"></path>
+        <rect x="8" y="2" width="8" height="4" rx="1" ry="1"></rect>
+      </svg>
+    );
+  }
+);
+
+Clipboard.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Clipboard.displayName = "Clipboard";
+
+export default Clipboard;

packages/react/src/icons/clock.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Clock = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <polyline points="12 6 12 12 16 14"></polyline>
+      </svg>
+    );
+  }
+);
+
+Clock.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Clock.displayName = "Clock";
+
+export default Clock;

packages/react/src/icons/cloud-drizzle.js

@@ -0,0 +1,40 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CloudDrizzle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="8" y1="19" x2="8" y2="21"></line>
+        <line x1="8" y1="13" x2="8" y2="15"></line>
+        <line x1="16" y1="19" x2="16" y2="21"></line>
+        <line x1="16" y1="13" x2="16" y2="15"></line>
+        <line x1="12" y1="21" x2="12" y2="23"></line>
+        <line x1="12" y1="15" x2="12" y2="17"></line>
+        <path d="M20 16.58A5 5 0 0 0 18 7h-1.26A8 8 0 1 0 4 15.25"></path>
+      </svg>
+    );
+  }
+);
+
+CloudDrizzle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CloudDrizzle.displayName = "CloudDrizzle";
+
+export default CloudDrizzle;

packages/react/src/icons/cloud-lightning.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CloudLightning = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M19 16.9A5 5 0 0 0 18 7h-1.26a8 8 0 1 0-11.62 9"></path>
+        <polyline points="13 11 9 17 15 17 11 23"></polyline>
+      </svg>
+    );
+  }
+);
+
+CloudLightning.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CloudLightning.displayName = "CloudLightning";
+
+export default CloudLightning;

packages/react/src/icons/cloud-off.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CloudOff = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M22.61 16.95A5 5 0 0 0 18 10h-1.26a8 8 0 0 0-7.05-6M5 5a8 8 0 0 0 4 15h9a5 5 0 0 0 1.7-.3"></path>
+        <line x1="1" y1="1" x2="23" y2="23"></line>
+      </svg>
+    );
+  }
+);
+
+CloudOff.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CloudOff.displayName = "CloudOff";
+
+export default CloudOff;

packages/react/src/icons/cloud-rain.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CloudRain = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="16" y1="13" x2="16" y2="21"></line>
+        <line x1="8" y1="13" x2="8" y2="21"></line>
+        <line x1="12" y1="15" x2="12" y2="23"></line>
+        <path d="M20 16.58A5 5 0 0 0 18 7h-1.26A8 8 0 1 0 4 15.25"></path>
+      </svg>
+    );
+  }
+);
+
+CloudRain.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CloudRain.displayName = "CloudRain";
+
+export default CloudRain;

packages/react/src/icons/cloud-snow.js

@@ -0,0 +1,40 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CloudSnow = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M20 17.58A5 5 0 0 0 18 8h-1.26A8 8 0 1 0 4 16.25"></path>
+        <line x1="8" y1="16" x2="8.01" y2="16"></line>
+        <line x1="8" y1="20" x2="8.01" y2="20"></line>
+        <line x1="12" y1="18" x2="12.01" y2="18"></line>
+        <line x1="12" y1="22" x2="12.01" y2="22"></line>
+        <line x1="16" y1="16" x2="16.01" y2="16"></line>
+        <line x1="16" y1="20" x2="16.01" y2="20"></line>
+      </svg>
+    );
+  }
+);
+
+CloudSnow.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CloudSnow.displayName = "CloudSnow";
+
+export default CloudSnow;

packages/react/src/icons/cloud.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Cloud = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z"></path>
+      </svg>
+    );
+  }
+);
+
+Cloud.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Cloud.displayName = "Cloud";
+
+export default Cloud;

packages/react/src/icons/code.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Code = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="16 18 22 12 16 6"></polyline>
+        <polyline points="8 6 2 12 8 18"></polyline>
+      </svg>
+    );
+  }
+);
+
+Code.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Code.displayName = "Code";
+
+export default Code;

packages/react/src/icons/codepen.js

@@ -0,0 +1,38 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Codepen = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polygon points="12 2 22 8.5 22 15.5 12 22 2 15.5 2 8.5 12 2"></polygon>
+        <line x1="12" y1="22" x2="12" y2="15.5"></line>
+        <polyline points="22 8.5 12 15.5 2 8.5"></polyline>
+        <polyline points="2 15.5 12 8.5 22 15.5"></polyline>
+        <line x1="12" y1="2" x2="12" y2="8.5"></line>
+      </svg>
+    );
+  }
+);
+
+Codepen.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Codepen.displayName = "Codepen";
+
+export default Codepen;

packages/react/src/icons/codesandbox.js

@@ -0,0 +1,39 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Codesandbox = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path>
+        <polyline points="7.5 4.21 12 6.81 16.5 4.21"></polyline>
+        <polyline points="7.5 19.79 7.5 14.6 3 12"></polyline>
+        <polyline points="21 12 16.5 14.6 16.5 19.79"></polyline>
+        <polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline>
+        <line x1="12" y1="22.08" x2="12" y2="12"></line>
+      </svg>
+    );
+  }
+);
+
+Codesandbox.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Codesandbox.displayName = "Codesandbox";
+
+export default Codesandbox;

packages/react/src/icons/coffee.js

@@ -0,0 +1,38 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Coffee = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M18 8h1a4 4 0 0 1 0 8h-1"></path>
+        <path d="M2 8h16v9a4 4 0 0 1-4 4H6a4 4 0 0 1-4-4V8z"></path>
+        <line x1="6" y1="1" x2="6" y2="4"></line>
+        <line x1="10" y1="1" x2="10" y2="4"></line>
+        <line x1="14" y1="1" x2="14" y2="4"></line>
+      </svg>
+    );
+  }
+);
+
+Coffee.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Coffee.displayName = "Coffee";
+
+export default Coffee;

packages/react/src/icons/columns.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Columns = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M12 3h7a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-7m0-18H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h7m0-18v18"></path>
+      </svg>
+    );
+  }
+);
+
+Columns.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Columns.displayName = "Columns";
+
+export default Columns;

packages/react/src/icons/command.js

@@ -0,0 +1,34 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Command = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M18 3a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3H6a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3V6a3 3 0 0 0-3-3 3 3 0 0 0-3 3 3 3 0 0 0 3 3h12a3 3 0 0 0 3-3 3 3 0 0 0-3-3z"></path>
+      </svg>
+    );
+  }
+);
+
+Command.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Command.displayName = "Command";
+
+export default Command;

packages/react/src/icons/compass.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Compass = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <polygon points="16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76"></polygon>
+      </svg>
+    );
+  }
+);
+
+Compass.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Compass.displayName = "Compass";
+
+export default Compass;

packages/react/src/icons/contact.js

@@ -0,0 +1,38 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Contact = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M19 22H5c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2h14c1.1 0 2 .9 2 2v14c0 1.1-.9 2-2 2z"></path>
+        <line x1="16" y1="2" x2="16" y2="4"></line>
+        <line x1="8" y1="2" x2="8" y2="4"></line>
+        <circle cx="12" cy="11" r="3"></circle>
+        <path d="M17 18.5c-1.4-1-3.1-1.5-5-1.5s-3.6.6-5 1.5"></path>
+      </svg>
+    );
+  }
+);
+
+Contact.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Contact.displayName = "Contact";
+
+export default Contact;

packages/react/src/icons/contrast.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Contrast = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <path d="M12 18a6 6 0 000-12v12z"></path>
+      </svg>
+    );
+  }
+);
+
+Contrast.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Contrast.displayName = "Contrast";
+
+export default Contrast;

packages/react/src/icons/copy.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Copy = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
+        <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
+      </svg>
+    );
+  }
+);
+
+Copy.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Copy.displayName = "Copy";
+
+export default Copy;

packages/react/src/icons/copyright.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Copyright = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <path d="M15 9.35418C14.2671 8.52376 13.1947 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16C13.1947 16 14.2671 15.4762 15 14.6458"></path>
+      </svg>
+    );
+  }
+);
+
+Copyright.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Copyright.displayName = "Copyright";
+
+export default Copyright;

packages/react/src/icons/corner-down-left.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CornerDownLeft = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="9 10 4 15 9 20"></polyline>
+        <path d="M20 4v7a4 4 0 0 1-4 4H4"></path>
+      </svg>
+    );
+  }
+);
+
+CornerDownLeft.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CornerDownLeft.displayName = "CornerDownLeft";
+
+export default CornerDownLeft;

packages/react/src/icons/corner-down-right.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CornerDownRight = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="15 10 20 15 15 20"></polyline>
+        <path d="M4 4v7a4 4 0 0 0 4 4h12"></path>
+      </svg>
+    );
+  }
+);
+
+CornerDownRight.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CornerDownRight.displayName = "CornerDownRight";
+
+export default CornerDownRight;

packages/react/src/icons/corner-left-down.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CornerLeftDown = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="14 15 9 20 4 15"></polyline>
+        <path d="M20 4h-7a4 4 0 0 0-4 4v12"></path>
+      </svg>
+    );
+  }
+);
+
+CornerLeftDown.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CornerLeftDown.displayName = "CornerLeftDown";
+
+export default CornerLeftDown;

packages/react/src/icons/corner-left-up.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CornerLeftUp = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="14 9 9 4 4 9"></polyline>
+        <path d="M20 20h-7a4 4 0 0 1-4-4V4"></path>
+      </svg>
+    );
+  }
+);
+
+CornerLeftUp.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CornerLeftUp.displayName = "CornerLeftUp";
+
+export default CornerLeftUp;

packages/react/src/icons/corner-right-down.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CornerRightDown = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="10 15 15 20 20 15"></polyline>
+        <path d="M4 4h7a4 4 0 0 1 4 4v12"></path>
+      </svg>
+    );
+  }
+);
+
+CornerRightDown.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CornerRightDown.displayName = "CornerRightDown";
+
+export default CornerRightDown;

packages/react/src/icons/corner-right-up.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CornerRightUp = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="10 9 15 4 20 9"></polyline>
+        <path d="M4 20h7a4 4 0 0 0 4-4V4"></path>
+      </svg>
+    );
+  }
+);
+
+CornerRightUp.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CornerRightUp.displayName = "CornerRightUp";
+
+export default CornerRightUp;

packages/react/src/icons/corner-up-left.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CornerUpLeft = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="9 14 4 9 9 4"></polyline>
+        <path d="M20 20v-7a4 4 0 0 0-4-4H4"></path>
+      </svg>
+    );
+  }
+);
+
+CornerUpLeft.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CornerUpLeft.displayName = "CornerUpLeft";
+
+export default CornerUpLeft;

packages/react/src/icons/corner-up-right.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CornerUpRight = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="15 14 20 9 15 4"></polyline>
+        <path d="M4 20v-7a4 4 0 0 1 4-4h12"></path>
+      </svg>
+    );
+  }
+);
+
+CornerUpRight.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CornerUpRight.displayName = "CornerUpRight";
+
+export default CornerUpRight;

packages/react/src/icons/cpu.js

@@ -0,0 +1,43 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Cpu = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="4" y="4" width="16" height="16" rx="2" ry="2"></rect>
+        <rect x="9" y="9" width="6" height="6"></rect>
+        <line x1="9" y1="1" x2="9" y2="4"></line>
+        <line x1="15" y1="1" x2="15" y2="4"></line>
+        <line x1="9" y1="20" x2="9" y2="23"></line>
+        <line x1="15" y1="20" x2="15" y2="23"></line>
+        <line x1="20" y1="9" x2="23" y2="9"></line>
+        <line x1="20" y1="14" x2="23" y2="14"></line>
+        <line x1="1" y1="9" x2="4" y2="9"></line>
+        <line x1="1" y1="14" x2="4" y2="14"></line>
+      </svg>
+    );
+  }
+);
+
+Cpu.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Cpu.displayName = "Cpu";
+
+export default Cpu;

packages/react/src/icons/credit-card.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const CreditCard = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="1" y="4" width="22" height="16" rx="2" ry="2"></rect>
+        <line x1="1" y1="10" x2="23" y2="10"></line>
+      </svg>
+    );
+  }
+);
+
+CreditCard.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+CreditCard.displayName = "CreditCard";
+
+export default CreditCard;

packages/react/src/icons/crop.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Crop = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M6.13 1L6 16a2 2 0 0 0 2 2h15"></path>
+        <path d="M1 6.13L16 6a2 2 0 0 1 2 2v15"></path>
+      </svg>
+    );
+  }
+);
+
+Crop.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Crop.displayName = "Crop";
+
+export default Crop;

packages/react/src/icons/crosshair.js

@@ -0,0 +1,38 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Crosshair = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <line x1="22" y1="12" x2="18" y2="12"></line>
+        <line x1="6" y1="12" x2="2" y2="12"></line>
+        <line x1="12" y1="6" x2="12" y2="2"></line>
+        <line x1="12" y1="22" x2="12" y2="18"></line>
+      </svg>
+    );
+  }
+);
+
+Crosshair.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Crosshair.displayName = "Crosshair";
+
+export default Crosshair;

packages/react/src/icons/database.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Database = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <ellipse cx="12" cy="5" rx="9" ry="3"></ellipse>
+        <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]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Database.displayName = "Database";
+
+export default Database;

packages/react/src/icons/delete.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Delete = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M21 4H8l-7 8 7 8h13a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2z"></path>
+        <line x1="18" y1="9" x2="12" y2="15"></line>
+        <line x1="12" y1="9" x2="18" y2="15"></line>
+      </svg>
+    );
+  }
+);
+
+Delete.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Delete.displayName = "Delete";
+
+export default Delete;

packages/react/src/icons/disc.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Disc = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="12" r="10"></circle>
+        <circle cx="12" cy="12" r="3"></circle>
+      </svg>
+    );
+  }
+);
+
+Disc.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Disc.displayName = "Disc";
+
+export default Disc;

packages/react/src/icons/divide-circle.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const DivideCircle = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="8" y1="12" x2="16" y2="12"></line>
+        <line x1="12" y1="16" x2="12" y2="16"></line>
+        <line x1="12" y1="8" x2="12" y2="8"></line>
+        <circle cx="12" cy="12" r="10"></circle>
+      </svg>
+    );
+  }
+);
+
+DivideCircle.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+DivideCircle.displayName = "DivideCircle";
+
+export default DivideCircle;

packages/react/src/icons/divide-square.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const DivideSquare = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
+        <line x1="8" y1="12" x2="16" y2="12"></line>
+        <line x1="12" y1="16" x2="12" y2="16"></line>
+        <line x1="12" y1="8" x2="12" y2="8"></line>
+      </svg>
+    );
+  }
+);
+
+DivideSquare.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+DivideSquare.displayName = "DivideSquare";
+
+export default DivideSquare;

packages/react/src/icons/divide.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Divide = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <circle cx="12" cy="6" r="2"></circle>
+        <line x1="5" y1="12" x2="19" y2="12"></line>
+        <circle cx="12" cy="18" r="2"></circle>
+      </svg>
+    );
+  }
+);
+
+Divide.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Divide.displayName = "Divide";
+
+export default Divide;

packages/react/src/icons/dollar-sign.js

@@ -0,0 +1,35 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const DollarSign = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <line x1="12" y1="1" x2="12" y2="23"></line>
+        <path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"></path>
+      </svg>
+    );
+  }
+);
+
+DollarSign.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+DollarSign.displayName = "DollarSign";
+
+export default DollarSign;

packages/react/src/icons/download-cloud.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const DownloadCloud = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <polyline points="8 17 12 21 16 17"></polyline>
+        <line x1="12" y1="12" x2="12" y2="21"></line>
+        <path d="M20.88 18.09A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.29"></path>
+      </svg>
+    );
+  }
+);
+
+DownloadCloud.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+DownloadCloud.displayName = "DownloadCloud";
+
+export default DownloadCloud;

packages/react/src/icons/download.js

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import PropTypes from "prop-types";
+
+const Download = forwardRef(
+  ({ color = "currentColor", size = 24, width = 2, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke={color}
+        strokeWidth={width}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        {...rest}
+      >
+        <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+        <polyline points="7 10 12 15 17 10"></polyline>
+        <line x1="12" y1="15" x2="12" y2="3"></line>
+      </svg>
+    );
+  }
+);
+
+Download.propTypes = {
+  color: PropTypes.string,
+  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+};
+
+Download.displayName = "Download";
+
+export default Download;