@umbra.ui/icons 0.1.2 → 0.4.0

package/src/icons/CookieIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M14.75 8.00001C12.84 8.00001 11.281 6.56701 11.047 4.72001C10.948 4.73001 10.852 4.75001 10.75 4.75001C9.132 4.75001 7.822 3.46701 7.761 1.86301C4.348 2.45201 1.75 5.41901 1.75 9.00001C1.75 13.004 4.996 16.25 9 16.25C13.004 16.25 16.25 13.004 16.25 9.00001C16.25 8.56601 16.205 8.14301 16.132 7.72901C15.704 7.89901 15.239 8.00001 14.75 8.00001Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M14.75 8.00001C12.84 8.00001 11.281 6.56701 11.047 4.72001C10.948 4.73001 10.852 4.75001 10.75 4.75001C9.132 4.75001 7.822 3.46701 7.761 1.86301C4.348 2.45201 1.75 5.41901 1.75 9.00001C1.75 13.004 4.996 16.25 9 16.25C13.004 16.25 16.25 13.004 16.25 9.00001C16.25 8.56601 16.205 8.14301 16.132 7.72901C15.704 7.89901 15.239 8.00001 14.75 8.00001Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/CreditCardIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path fill-rule="evenodd" clip-rule="evenodd" d="M14.25 14.25H3.75C2.64543 14.25 1.75 13.3546 1.75 12.25V7.25H16.25V12.25C16.25 13.3546 15.3546 14.25 14.25 14.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M1.75 7.25H16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/CrosshairsIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path fill-rule="evenodd" clip-rule="evenodd" d="M15.5 9C15.5 12.5899 12.5899 15.5 9 15.5C5.41015 15.5 2.5 12.5899 2.5 9C2.5 5.41015 5.41015 2.5 9 2.5C12.5899 2.5 15.5 5.41015 15.5 9ZM11.25 9C11.25 10.2426 10.2426 11.25 9 11.25C7.75736 11.25 6.75 10.2426 6.75 9C6.75 7.75736 7.75736 6.75 9 6.75C10.2426 6.75 11.25 7.75736 11.25 9Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M9 15.5C12.5899 15.5 15.5 12.5899 15.5 9C15.5 5.41015 12.5899 2.5 9 2.5C5.41015 2.5 2.5 5.41015 2.5 9C2.5 12.5899 5.41015 15.5 9 15.5Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/CrosshairsSlashIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path fill-rule="evenodd" clip-rule="evenodd" d="M13.5962 4.40379C12.4199 3.22753 10.7949 2.5 9 2.5C5.41015 2.5 2.5 5.41015 2.5 9C2.5 10.7949 3.22753 12.4199 4.40379 13.5962L7.409 10.591C7.00183 10.1838 6.75 9.62131 6.75 9C6.75 7.75736 7.75736 6.75 9 6.75C9.62131 6.75 10.1838 7.00183 10.591 7.409L13.5962 4.40379ZM10.5844 10.5976C10.5888 10.5932 10.5932 10.5888 10.5976 10.5844L14.9042 6.27774C15.2866 7.10581 15.5 8.02799 15.5 9C15.5 12.5899 12.5899 15.5 9 15.5C8.02799 15.5 7.10581 15.2866 6.27774 14.9042L10.5844 10.5976Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M15.012 6.524C15.327 7.287 15.5 8.124 15.5 9C15.5 12.59 12.59 15.5 8.99999 15.5C8.12299 15.5 7.28699 15.326 6.52399 15.012" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/CryptographyIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,18 +18,14 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
-    <g :fill="color">
-      <path d="M7.25 7.75C8.07843 7.75 8.75 7.07843 8.75 6.25C8.75 5.42157 8.07843 4.75 7.25 4.75C6.42157 4.75 5.75 5.42157 5.75 6.25C5.75 7.07843 6.42157 7.75 7.25 7.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
-      <path d="M10.75 13.25C11.5784 13.25 12.25 12.5784 12.25 11.75C12.25 10.9216 11.5784 10.25 10.75 10.25C9.92157 10.25 9.25 10.9216 9.25 11.75C9.25 12.5784 9.92157 13.25 10.75 13.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
-      <path d="M7.25 7.75C8.07843 7.75 8.75 7.07843 8.75 6.25C8.75 5.42157 8.07843 4.75 7.25 4.75C6.42157 4.75 5.75 5.42157 5.75 6.25C5.75 7.07843 6.42157 7.75 7.25 7.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M16.25 6.5V11.881C16.25 12.146 16.145 12.401 15.957 12.588L12.588 15.957C12.4 16.145 12.146 16.25 11.881 16.25H5.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M6.75 10.25V12.586C6.75 12.851 6.855 13.106 7.043 13.293L7.75 14" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M3.25 14.25L4.042 13.225C4.177 13.05 4.25 12.835 4.25 12.614V9.437C4.25 9.158 4.366 8.892 4.571 8.703L6.137 7.253" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M10.75 13.25C11.5784 13.25 12.25 12.5784 12.25 11.75C12.25 10.9216 11.5784 10.25 10.75 10.25C9.92157 10.25 9.25 10.9216 9.25 11.75C9.25 12.5784 9.92157 13.25 10.75 13.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M11.25 7.75V5.414C11.25 5.149 11.145 4.894 10.957 4.707L10.25 4" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M14.75 3.75L13.958 4.775C13.823 4.95 13.75 5.165 13.75 5.386V8.563C13.75 8.842 13.634 9.108 13.429 9.297L11.863 10.747" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M12.25 1.75H6.119C5.854 1.75 5.599 1.855 5.412 2.043L2.043 5.412C1.855 5.6 1.75 5.854 1.75 6.119V11.5" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
+      <path opacity="0.3" d="M15.1635 5.61839L12.3815 2.8364C12.0065 2.4614 11.4975 2.2505 10.9675 2.2505H7.03259C6.50259 2.2505 5.99359 2.4614 5.61859 2.8364L2.83661 5.61839C2.46161 5.99339 2.25061 6.5024 2.25061 7.0325V10.9676C2.25061 11.4976 2.46161 12.0064 2.83661 12.3814L5.61859 15.1636C5.99359 15.5386 6.50259 15.7495 7.03259 15.7495H10.9675C11.4975 15.7495 12.0065 15.5386 12.3815 15.1636L15.1635 12.3814C15.5385 12.0064 15.7495 11.4976 15.7495 10.9676V7.0325C15.7495 6.5025 15.5385 5.99339 15.1635 5.61839ZM6.75 6.25C6.75 5.4219 7.4216 4.75 8.25 4.75C9.0784 4.75 9.75 5.4219 9.75 6.25C9.75 7.0781 9.0784 7.75 8.25 7.75C7.4216 7.75 6.75 7.0781 6.75 6.25ZM9.75 13.25C8.9216 13.25 8.25 12.5781 8.25 11.75C8.25 10.9219 8.9216 10.25 9.75 10.25C10.5784 10.25 11.25 10.9219 11.25 11.75C11.25 12.5781 10.5784 13.25 9.75 13.25Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M8.25 7.75C9.0784 7.75 9.75 7.078 9.75 6.25C9.75 5.422 9.0784 4.75 8.25 4.75C7.4216 4.75 6.75 5.422 6.75 6.25C6.75 7.078 7.4216 7.75 8.25 7.75Z" />
+      <path d="M3.75 14.25L5.04199 12.725C5.17699 12.55 5.25 12.335 5.25 12.114V9.437C5.25 9.158 5.36601 8.892 5.57101 8.703L7.13589 7.2541" />
+      <path d="M6.2041 15.75H11.3818C11.647 15.75 11.9014 15.6446 12.0889 15.4571L15.4572 12.0888C15.6447 11.9013 15.7501 11.6469 15.7501 11.3817V6.20399" />
+      <path d="M11.7959 2.25H6.61816C6.35296 2.25 6.09857 2.35539 5.91107 2.54289L2.54276 5.91119C2.35526 6.09869 2.24988 6.3531 2.24988 6.6183V11.796" />
+      <path d="M9.75 10.25C8.9216 10.25 8.25 10.922 8.25 11.75C8.25 12.578 8.9216 13.25 9.75 13.25C10.5784 13.25 11.25 12.578 11.25 11.75C11.25 10.922 10.5784 10.25 9.75 10.25Z" />
+      <path d="M14.25 3.75L12.958 5.27499C12.823 5.44999 12.75 5.665 12.75 5.886V8.563C12.75 8.842 12.634 9.108 12.429 9.297L10.8641 10.7459" />
     </g>
   </svg>
 </template>

package/src/icons/Cubes2Icon.vue

@@ -0,0 +1,41 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
+      <path d="M12.75 10.637V13.863C12.75 14.252 12.525 14.605 12.173 14.769L9.423 16.052C9.155 16.177 8.845 16.177 8.577 16.052L5.827 14.769C5.475 14.605 5.25 14.251 5.25 13.863V10.637C5.25 10.248 5.475 9.895 5.827 9.731L8.577 8.448C8.845 8.323 9.155 8.323 9.423 8.448L12.173 9.731C12.525 9.895 12.75 10.249 12.75 10.637Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M5.25 9.896V5.5" />
+      <path d="M8.83 3.82999L5.25 5.49999L1.67 3.82899" />
+      <path d="M9 4.387V7.613C9 8.002 8.775 8.355 8.423 8.519L5.673 9.802C5.405 9.927 5.095 9.927 4.827 9.802L2.077 8.519C1.725 8.355 1.5 8.001 1.5 7.613V4.387C1.5 3.998 1.725 3.645 2.077 3.481L4.827 2.198C5.095 2.073 5.405 2.073 5.673 2.198L8.423 3.481C8.775 3.645 9 3.999 9 4.387Z" />
+      <path d="M12.75 9.896V5.5" />
+      <path d="M9.17 3.82999L12.75 5.49999L16.33 3.82899" />
+      <path d="M9 4.387V7.613C9 8.002 9.225 8.355 9.577 8.519L12.327 9.802C12.595 9.927 12.905 9.927 13.173 9.802L15.923 8.519C16.275 8.355 16.5 8.001 16.5 7.613V4.387C16.5 3.998 16.275 3.645 15.923 3.481L13.173 2.198C12.905 2.073 12.595 2.073 12.327 2.198L9.577 3.481C9.225 3.645 9 3.999 9 4.387Z" />
+      <path d="M9 16.146V11.75" />
+      <path d="M12.58 10.08L9 11.75L5.42 10.079" />
+      <path d="M12.75 10.637V13.863C12.75 14.252 12.525 14.605 12.173 14.769L9.423 16.052C9.155 16.177 8.845 16.177 8.577 16.052L5.827 14.769C5.475 14.605 5.25 14.251 5.25 13.863V10.637C5.25 10.248 5.475 9.895 5.827 9.731L8.577 8.448C8.845 8.323 9.155 8.323 9.423 8.448L12.173 9.731C12.525 9.895 12.75 10.249 12.75 10.637Z" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/DarkLightIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M9 16.25C13.0041 16.25 16.25 13.0041 16.25 9C16.25 4.99594 13.0041 1.75 9 1.75C4.99594 1.75 1.75 4.99594 1.75 9C1.75 13.0041 4.99594 16.25 9 16.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M9 6V12C10.657 12 12 10.657 12 9C12 7.343 10.657 6 9 6Z" :fill="color" data-stroke="none" stroke="none" />

package/src/icons/DarkModeIcon.vue

@@ -0,0 +1,34 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
+      <path d="M9 16.25C13.0041 16.25 16.25 13.0041 16.25 9C16.25 4.99594 13.0041 1.75 9 1.75C4.99594 1.75 1.75 4.99594 1.75 9C1.75 13.0041 4.99594 16.25 9 16.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9 16.25C13.0041 16.25 16.25 13.0041 16.25 9C16.25 4.99594 13.0041 1.75 9 1.75C4.99594 1.75 1.75 4.99594 1.75 9C1.75 13.0041 4.99594 16.25 9 16.25Z" />
+      <path d="M9 4V14C11.761 14 14 11.761 14 9C14 6.239 11.761 4 9 4Z" :fill="color" data-stroke="none" stroke="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/DecentralizeIcon.vue

@@ -0,0 +1,43 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
+      <path opacity="0.3" d="M9 16.25C8.0335 16.25 7.25 15.466 7.25 14.5C7.25 13.534 8.0335 12.75 9 12.75C9.9665 12.75 10.75 13.534 10.75 14.5C10.75 15.466 9.9665 16.25 9 16.25Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path opacity="0.3" d="M14.5 14.25C13.5335 14.25 12.75 13.466 12.75 12.5C12.75 11.534 13.5335 10.75 14.5 10.75C15.4665 10.75 16.25 11.534 16.25 12.5C16.25 13.466 15.4665 14.25 14.5 14.25Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path opacity="0.3" d="M3.5 14.25C4.4665 14.25 5.25 13.466 5.25 12.5C5.25 11.534 4.4665 10.75 3.5 10.75C2.5335 10.75 1.75 11.534 1.75 12.5C1.75 13.466 2.5335 14.25 3.5 14.25Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path opacity="0.3" d="M9 8.25C9.966 8.25 10.75 7.466 10.75 6.5C10.75 5.534 9.966 4.75 9 4.75C8.034 4.75 7.25 5.534 7.25 6.5C7.25 7.466 8.034 8.25 9 8.25Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9 16.25C8.0335 16.25 7.25 15.466 7.25 14.5C7.25 13.534 8.0335 12.75 9 12.75C9.9665 12.75 10.75 13.534 10.75 14.5C10.75 15.466 9.9665 16.25 9 16.25Z" />
+      <path d="M14.5 14.25C13.5335 14.25 12.75 13.466 12.75 12.5C12.75 11.534 13.5335 10.75 14.5 10.75C15.4665 10.75 16.25 11.534 16.25 12.5C16.25 13.466 15.4665 14.25 14.5 14.25Z" />
+      <path d="M9 10.75V12.75" />
+      <path d="M13.25 7.75L14.2072 8.70749C14.3947 8.89499 14.5 9.14929 14.5 9.41449V10.5189" />
+      <path d="M3.5 14.25C4.4665 14.25 5.25 13.466 5.25 12.5C5.25 11.534 4.4665 10.75 3.5 10.75C2.5335 10.75 1.75 11.534 1.75 12.5C1.75 13.466 2.5335 14.25 3.5 14.25Z" />
+      <path d="M13.4034 4.7644C12.708 3.0041 11.0073 1.75 8.99995 1.75C6.99265 1.75 5.29196 3.0042 4.59656 4.7644" />
+      <path d="M4.75 7.75L3.7928 8.70749C3.6053 8.89499 3.5 9.14929 3.5 9.41449V10.5189" />
+      <path d="M9 8.25C9.966 8.25 10.75 7.466 10.75 6.5C10.75 5.534 9.966 4.75 9 4.75C8.034 4.75 7.25 5.534 7.25 6.5C7.25 7.466 8.034 8.25 9 8.25Z" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/DeleteLeftIcon.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
+      <path d="M13.25 3.75H5.477C5.175 3.75 4.89 3.886 4.7 4.121L0.75 9L4.7 13.879C4.89 14.114 5.175 14.25 5.477 14.25H13.25C14.355 14.25 15.25 13.355 15.25 12.25V5.75C15.25 4.645 14.355 3.75 13.25 3.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.25 3.75H5.477C5.175 3.75 4.89 3.886 4.7 4.121L0.75 9L4.7 13.879C4.89 14.114 5.175 14.25 5.477 14.25H13.25C14.355 14.25 15.25 13.355 15.25 12.25V5.75C15.25 4.645 14.355 3.75 13.25 3.75Z" />
+      <path d="M6.75 6.75L11.25 11.25" />
+      <path d="M11.25 6.75L6.75 11.25" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/DescendingSortingIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M10.25 12.75L12.75 15.25L15.25 12.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
       <path d="M12.75 15.25V6.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/DesktopArrowDownIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M12 3H14.25C15.355 3 16.25 3.895 16.25 5V11.25C16.25 12.355 15.355 13.25 14.25 13.25H3.75C2.645 13.25 1.75 12.355 1.75 11.25V5C1.75 3.895 2.645 3 3.75 3H6" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M11.75 7.5L9 10.25L6.25 7.5" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/DotsIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })

package/src/icons/DotsVerticalIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })

package/src/icons/DownloadIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <title />
+    <g stroke-linecap="round" stroke-width="1.5" fill="none" :stroke="color" stroke-linejoin="round">
+      <path opacity="0.3" d="M11.599 6H12.152C13.064 6 13.845 6.725 14.011 7.724L14.968 13.514C15.182 14.807 14.291 16 13.109 16H4.891C3.709 16 2.81799 14.807 3.03199 13.514L3.98899 7.724C4.15499 6.725 4.936 6 5.848 6H6.40099" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M12 6.25H12.335C13.3 6.25 14.127 6.939 14.302 7.888L15.315 13.388C15.541 14.617 14.598 15.75 13.348 15.75H4.65199C3.40199 15.75 2.45899 14.617 2.68499 13.388L3.69799 7.888C3.87299 6.939 4.69999 6.25 5.66499 6.25H5.99999" />
+      <path d="M12 9.5L9 12.5L6 9.5" />
+      <path d="M9 12.5V1.25" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/DrawCompassIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M9 6.75C10.1046 6.75 11 5.85457 11 4.75C11 3.64543 10.1046 2.75 9 2.75C7.89543 2.75 7 3.64543 7 4.75C7 5.85457 7.89543 6.75 9 6.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M9 1.5V2.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/EarthIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M8.63696 9.8623C7.60866 9.4483 6.30547 9.70093 5.78241 9.87899C6.01911 10.039 6.42389 10.3858 6.70054 10.9641C7.0347 11.6626 6.62959 12.3347 6.96763 13.034C7.27651 13.673 7.98121 13.7145 8.36986 14.1525C8.57018 14.4251 8.90405 15.2309 8.63696 16.2725C12.2694 16.4595 14.602 13.8798 15.3143 12.5666C15.1418 11.9879 14.7864 10.8611 13.8119 10.53C12.8369 10.1988 11.8571 11.9113 10.7236 11.5149C9.995 11.2602 9.92234 10.3798 8.63696 9.8623Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M6.85464 2.04794C4.55877 2.61683 3.05359 4.72306 2.58798 5.70507C2.85042 6.71248 3.86291 8.96094 5.81338 9.89554C4.94989 8.70189 5.18695 7.24911 6.27053 6.41619C7.71179 5.30832 9.14571 7.13998 9.80068 6.61936C10.0648 6.37555 9.77528 4.79079 9.97846 3.85111C10.1562 3.37704 11.0248 2.54064 13.0769 2.98761C12.1372 2.17492 9.72449 1.33682 6.85464 2.04794Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />

package/src/icons/EnvelopeIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path fill-rule="evenodd" clip-rule="evenodd" d="M1.75 5.64296L8.565 9.54C8.84 9.673 9.16 9.673 9.434 9.54L16.25 5.64239V5.25C16.25 4.14543 15.3546 3.25 14.25 3.25H3.75C2.64543 3.25 1.75 4.14543 1.75 5.25V5.64296Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M1.75 5.75L8.517 9.483C8.818 9.649 9.182 9.649 9.483 9.483L16.25 5.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/EnvelopeOpenIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M16.25 6.754V13.25C16.25 14.355 15.355 15.25 14.25 15.25H3.75C2.645 15.25 1.75 14.355 1.75 13.25V6.75L8.565 10.04C8.84 10.173 9.16 10.173 9.434 10.04L16.249 6.75L16.25 6.754Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M1.75 6.75001C1.75 6.02201 2.146 5.38901 2.784 5.03701L8.517 1.87401C8.818 1.70801 9.182 1.70801 9.483 1.87401L15.216 5.03701C15.854 5.38901 16.25 6.02101 16.25 6.75001" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/EraserIcon.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
+      <path fill-rule="evenodd" clip-rule="evenodd" d="M6.0957 6.1058L11.9292 11.9393L15.525 8.343C16.111 7.758 16.111 6.808 15.525 6.222L11.813 2.51C11.228 1.924 10.278 1.924 9.692 2.51L6.0957 6.1058Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M8.75 15.25H16" />
+      <path d="M5.87598 15.25L2.47398 11.848C1.88798 11.262 1.88798 10.312 2.47398 9.727L9.69199 2.51C10.278 1.924 11.228 1.924 11.813 2.51L15.525 6.222C16.111 6.808 16.111 7.758 15.525 8.343L8.61899 15.25H5.87598Z" />
+      <path d="M6.08301 6.11798L11.917 11.952" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/EthereumIcon.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
+      <path opacity="0.3" d="M14.75 9.5L9 1.25L3.25 9.5L9 12L14.75 9.5Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M3.25 9.5L9 16.75L14.75 9.5" />
+      <path d="M14.75 9.5L9 1.25L3.25 9.5L9 12L14.75 9.5Z" />
+      <path d="M9 1.25V12" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/EyeClosedIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M1.85901 7.27C3.67401 9.121 6.20301 10.27 9.00001 10.27C11.797 10.27 14.326 9.122 16.141 7.27" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
       <path d="M4.021 8.942L2.75 11.019" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/EyeDropperIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
+      <path d="M9.23499 5.735L3.12799 11.842C2.29099 12.679 2.29099 14.036 3.12799 14.872C3.96499 15.709 5.32199 15.709 6.15799 14.872L12.265 8.765" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9.23499 5.735L3.12799 11.842C2.29099 12.679 2.29099 14.036 3.12799 14.872C3.96499 15.709 5.32199 15.709 6.15799 14.872L12.265 8.765" />
+      <path d="M3.128 14.872L1.75 16.25" />
+      <path d="M12.265 8.765L15.122 5.908C15.959 5.071 15.959 3.714 15.122 2.878C14.285 2.041 12.928 2.041 12.092 2.878L9.23499 5.735" />
+      <path d="M7.75 4.25L13.75 10.25" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/EyeIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })

package/src/icons/EyeOpenIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })
@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-        <title />
+    <title />
     <g :fill="color">
       <path d="M9 13.25C10.5188 13.25 11.75 12.0188 11.75 10.5C11.75 8.98122 10.5188 7.75 9 7.75C7.48122 7.75 6.25 8.98122 6.25 10.5C6.25 12.0188 7.48122 13.25 9 13.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M1.85901 8C3.67401 6.149 6.20301 5 9.00001 5C11.797 5 14.326 6.148 16.141 8" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />

package/src/icons/EyeSlashIcon.vue

@@ -4,7 +4,7 @@ interface Props {
   color?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   size: 24,
   color: 'currentColor'
 })