Merge pull request #113 from EQWorks/icons

[G2M] icons - add clocl/data-failed/data-syncing/data-succeeded icons
EQWorks · Mar 14, 2022 · c6fd608 · c6fd608
2 parents c1f4697 + 6d132c7
commit c6fd608
Show file tree

Hide file tree

Showing 6 changed files with 130 additions and 1 deletion.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@eqworks/lumen-labs",
-  "version": "0.1.0-alpha.39",
+  "version": "0.1.0-alpha.40",
   "description": "",
   "main": "dist/index.js",
   "source": "src/index.js",

diff --git a/src/icons/clock.js b/src/icons/clock.js
@@ -0,0 +1,26 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+
+const iconSize = Object.freeze({
+  lg: 'w-3.5 h-3.5',
+  md: 'w-3 h-3',
+  sm: 'w-2.5, h-2.5',
+})
+const Clock = ({ className, size, ...props }) => {
+  return (
+    <svg
+      className={`${iconSize[size]} ${className}`}
+      viewBox="0 0 10 10"
+      fill="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path d="M5 0C4.0111 0 3.0444 0.293245 2.22215 0.842652C1.39991 1.39206 0.759043 2.17295 0.380605 3.08658C0.00216643 4.00021 -0.0968503 5.00555 0.0960758 5.97545C0.289002 6.94536 0.765206 7.83627 1.46447 8.53553C2.16373 9.2348 3.05465 9.711 4.02455 9.90392C4.99446 10.0969 5.99979 9.99783 6.91342 9.6194C7.82705 9.24096 8.60794 8.6001 9.15735 7.77785C9.70676 6.95561 10 5.98891 10 5C10 3.67392 9.47322 2.40215 8.53554 1.46447C7.59785 0.526784 6.32609 0 5 0V0ZM7.16667 7.175C7.12961 7.21573 7.08485 7.24872 7.03497 7.27205C6.98508 7.29537 6.93107 7.30858 6.87605 7.3109C6.82103 7.31323 6.7661 7.30463 6.71442 7.28559C6.66275 7.26655 6.61536 7.23746 6.575 7.2L4.49167 5.30833C4.45227 5.26758 4.42161 5.21921 4.40155 5.16619C4.38148 5.11318 4.37245 5.05663 4.375 5V2.70833C4.375 2.59783 4.4189 2.49185 4.49704 2.41371C4.57518 2.33557 4.68116 2.29167 4.79167 2.29167C4.90218 2.29167 5.00816 2.33557 5.0863 2.41371C5.16444 2.49185 5.20834 2.59783 5.20834 2.70833V4.81667L7.1375 6.5875C7.2191 6.66164 7.26799 6.7651 7.27346 6.87522C7.27893 6.98534 7.24053 7.09314 7.16667 7.175Z" />
+    </svg>
+  )
+}
+
+Clock.propTypes = { className: PropTypes.string, size: PropTypes.string }
+Clock.defaultProps = { className: 'h-5 w-5', size: '' }
+export default Clock
diff --git a/src/icons/data-failed.js b/src/icons/data-failed.js
@@ -0,0 +1,33 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+
+const iconSize = Object.freeze({
+  lg: 'w-3.5 h-3.5',
+  md: 'w-3 h-3',
+  sm: 'w-2.5, h-2.5',
+})
+const DataFailed = ({ className, size, ...props }) => {
+  return (
+    <svg
+      className={`${iconSize[size]} ${className}`}
+      viewBox="0 0 10 10"
+      fill="none"
+      stroke="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path d="M5 4.06292C2.41125 4.06292 0.3125 3.22333 0.3125 2.18792C0.3125 1.1525 2.41125 0.312916 5 0.312916C7.58875 0.312916 9.6875 1.15208 9.6875 2.18792C9.6875 2.74125 9.0875 3.23875 8.13375 3.58208" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M9.6875 4.06292V2.18792" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M0.3125 2.18792V4.68792C0.3125 5.50333 1.61458 6.1975 3.43208 6.45542" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M0.3125 4.68792V7.18792C0.3125 8.04958 1.76625 8.77583 3.74667 8.995" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M4.6875 7.18792C4.6875 7.85096 4.95089 8.48684 5.41973 8.95568C5.88857 9.42452 6.52446 9.68792 7.1875 9.68792C7.85054 9.68792 8.48643 9.42452 8.95527 8.95568C9.42411 8.48684 9.6875 7.85096 9.6875 7.18792C9.6875 6.52487 9.42411 5.88899 8.95527 5.42015C8.48643 4.95131 7.85054 4.68792 7.1875 4.68792C6.52446 4.68792 5.88857 4.95131 5.41973 5.42015C4.95089 5.88899 4.6875 6.52487 4.6875 7.18792V7.18792Z" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M8.125 6.25L6.25 8.125" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M6.25 6.25L8.125 8.125" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+    </svg>
+  )
+}
+
+DataFailed.propTypes = { className: PropTypes.string, size: PropTypes.string }
+DataFailed.defaultProps = { className: 'h-5 w-5', size: '' }
+export default DataFailed
diff --git a/src/icons/data-succeeded.js b/src/icons/data-succeeded.js
@@ -0,0 +1,32 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+
+const iconSize = Object.freeze({
+  lg: 'w-3.5 h-3.5',
+  md: 'w-3 h-3',
+  sm: 'w-2.5, h-2.5',
+})
+const DataSucceeded = ({ className, size, ...props }) => {
+  return (
+    <svg
+      className={`${iconSize[size]} ${className}`}
+      viewBox="0 0 10 10"
+      fill="none"
+      stroke="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path d="M5 4.06292C2.41125 4.06292 0.3125 3.22333 0.3125 2.18792C0.3125 1.1525 2.41125 0.312916 5 0.312916C7.58875 0.312916 9.6875 1.15208 9.6875 2.18792C9.6875 2.67708 9.21875 3.1225 8.45125 3.45667" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M9.6875 4.355V2.18792" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M0.3125 2.18792V4.68792C0.3125 5.50375 1.61583 6.19792 3.435 6.45583" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M0.3125 4.68792V7.18792C0.3125 8.04917 1.765 8.775 3.74375 8.99458" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M4.6875 7.18792C4.6875 7.85096 4.95089 8.48684 5.41973 8.95568C5.88857 9.42452 6.52446 9.68792 7.1875 9.68792C7.85054 9.68792 8.48643 9.42452 8.95527 8.95568C9.42411 8.48684 9.6875 7.85096 9.6875 7.18792C9.6875 6.52487 9.42411 5.88899 8.95527 5.42015C8.48643 4.95131 7.85054 4.68792 7.1875 4.68792C6.52446 4.68792 5.88857 4.95131 5.41973 5.42015C4.95089 5.88899 4.6875 6.52487 4.6875 7.18792V7.18792Z" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M8.30166 6.46083L7.09124 8.075C7.06433 8.11079 7.03004 8.14039 6.99071 8.1618C6.95137 8.18321 6.90789 8.19592 6.86322 8.19908C6.81854 8.20224 6.77371 8.19577 6.73175 8.18012C6.68979 8.16446 6.65168 8.13998 6.62 8.10833L5.995 7.48333" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+    </svg>
+  )
+}
+
+DataSucceeded.propTypes = { className: PropTypes.string, size: PropTypes.string }
+DataSucceeded.defaultProps = { className: 'h-5 w-5', size: '' }
+export default DataSucceeded
diff --git a/src/icons/data-syncing.js b/src/icons/data-syncing.js
@@ -0,0 +1,34 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+
+const iconSize = Object.freeze({
+  lg: 'w-3.5 h-3.5',
+  md: 'w-3 h-3',
+  sm: 'w-2.5, h-2.5',
+})
+const DataSyncing = ({ className, size, ...props }) => {
+  return (
+    <svg
+      className={`${iconSize[size]} ${className}`}
+      viewBox="0 0 10 10"
+      fill="none"
+      stroke="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path d="M5 4.06292C2.41125 4.06292 0.3125 3.22333 0.3125 2.18792C0.3125 1.1525 2.41125 0.312916 5 0.312916C7.58875 0.312916 9.6875 1.15208 9.6875 2.18792C9.6875 2.73917 9.0925 3.235 8.14583 3.57833" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M9.6875 3.75667V2.18792" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M0.3125 2.18792V4.68792C0.3125 5.54917 1.765 6.275 3.74375 6.49458" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M0.3125 4.68792V7.18792C0.3125 8.00458 1.61833 8.69958 3.44083 8.95667" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M6.25 7.81292H4.6875V9.37542" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M9.4446 8.11833C9.27911 8.60198 8.95862 9.01748 8.53286 9.30038C8.10711 9.58328 7.59989 9.71776 7.0899 9.68295C6.57991 9.64815 6.09566 9.446 5.71229 9.10788C5.32892 8.76976 5.06786 8.31456 4.9696 7.81292" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M8.125 6.56292H9.6875V5.00042" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+      <path d="M4.93042 6.25708C5.09622 5.77372 5.41684 5.35854 5.84257 5.07591C6.26831 4.79328 6.77539 4.65898 7.28521 4.69382C7.79503 4.72866 8.27912 4.9307 8.66245 5.26863C9.04577 5.60655 9.30692 6.06149 9.40542 6.56292" strokeWidth="0.625" strokeLinecap="round" strokeLinejoin="round"/>
+    </svg>
+  )
+}
+
+DataSyncing.propTypes = { className: PropTypes.string, size: PropTypes.string }
+DataSyncing.defaultProps = { className: 'h-5 w-5', size: '' }
+export default DataSyncing
diff --git a/src/icons/index.js b/src/icons/index.js
@@ -72,3 +72,7 @@ export { default as MoveDown } from './move-down'
 export { default as Play } from './play'
 export { default as Globe } from './globe'
 export { default as Gear } from './gear'
+export { default as Clock } from './clock'
+export { default as DataFailed } from './data-failed'
+export { default as DataSyncing } from './data-syncing'
+export { default as DataSucceeded } from './data-succeeded'