@umbra.ui/icons 0.2.0 → 0.5.0

package/dist/icons/TextASparkleIcon.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="M5.108 11.75H12.892" />
+      <path d="M14.25 15.25L9.401 2.75H8.599L5.108 11.75" />
+      <path d="M15.493 1.492L14.547 1.177L14.231 0.230004C14.129 -0.0759965 13.622 -0.0759965 13.52 0.230004L13.204 1.177L12.258 1.492C12.105 1.543 12.001 1.686 12.001 1.848C12.001 2.01 12.105 2.153 12.258 2.204L13.204 2.519L13.52 3.466C13.571 3.619 13.714 3.722 13.875 3.722C14.036 3.722 14.18 3.618 14.23 3.466L14.546 2.519L15.492 2.204C15.645 2.153 15.749 2.01 15.749 1.848C15.749 1.686 15.645 1.543 15.492 1.492H15.493Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M4.65799 13.526L3.39499 13.105L2.97399 11.842C2.83699 11.434 2.16199 11.434 2.02499 11.842L1.60399 13.105L0.340993 13.526C0.136993 13.594 -0.00100708 13.785 -0.00100708 14C-0.00100708 14.215 0.136993 14.406 0.340993 14.474L1.60399 14.895L2.02499 16.158C2.09299 16.362 2.28499 16.5 2.49999 16.5C2.71499 16.5 2.90599 16.362 2.97499 16.158L3.39599 14.895L4.65899 14.474C4.86299 14.406 5.00099 14.215 5.00099 14C5.00099 13.785 4.86199 13.594 4.65799 13.526Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M2.75 6C3.16421 6 3.5 5.66421 3.5 5.25C3.5 4.83579 3.16421 4.5 2.75 4.5C2.33579 4.5 2 4.83579 2 5.25C2 5.66421 2.33579 6 2.75 6Z" :fill="color" data-stroke="none" stroke="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/TextAlignCenterIcon.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="M2.75 14.25H15.25" />
+      <path d="M2.75 3.75H15.25" />
+      <path d="M6.25 9H11.75" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/TextAlignLeftIcon.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="M2.75 14.25H15.25" />
+      <path d="M2.75 3.75H15.25" />
+      <path d="M2.75 9H8.25" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/TextAlignRightIcon.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="M2.75 14.25H15.25" />
+      <path d="M2.75 3.75H15.25" />
+      <path d="M9.75 9H15.25" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/TextHighlight2Icon.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="M11.1021 2.6887L5.07549 8.7157C4.48969 9.3017 4.48969 10.2517 5.07549 10.8367L7.6628 13.4247C8.2486 14.0097 9.1983 14.0097 9.7841 13.4247L15.8107 7.3977C16.3965 6.8117 16.3965 5.8627 15.8107 5.2767L13.2234 2.6887C12.6376 2.1037 11.6879 2.1037 11.1021 2.6887Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M5.23939 15.2598L4.83609 15.6631C4.75819 15.741 4.64819 15.7777 4.53909 15.7621L1.91049 15.3866C1.62279 15.3455 1.50549 14.9936 1.71099 14.7881L3.23929 13.2598L5.23939 15.2598Z" :fill="color" />
+      <path d="M14.5214 3.97771L10.4034 8.0957" />
+      <path d="M11.1021 2.6887L5.07549 8.7157C4.48969 9.3017 4.48969 10.2517 5.07549 10.8367L7.6628 13.4247C8.2486 14.0097 9.1983 14.0097 9.7841 13.4247L15.8107 7.3977C16.3965 6.8117 16.3965 5.8627 15.8107 5.2767L13.2234 2.6887C12.6376 2.1037 11.6879 2.1037 11.1021 2.6887Z" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/TextSparkleIcon.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 2.75V15.25" />
+      <path d="M14.25 2.75H3.75" />
+      <path d="M4.49301 6.769L3.54701 6.454L3.23101 5.507C3.12901 5.201 2.62201 5.201 2.52001 5.507L2.20401 6.454L1.25801 6.769C1.10501 6.82 1.00101 6.963 1.00101 7.125C1.00101 7.287 1.10501 7.43 1.25801 7.481L2.20401 7.796L2.52001 8.743C2.57101 8.896 2.71401 8.999 2.87501 8.999C3.03601 8.999 3.18001 8.895 3.23001 8.743L3.54601 7.796L4.49201 7.481C4.64501 7.43 4.74901 7.287 4.74901 7.125C4.74901 6.963 4.64601 6.82 4.49301 6.769Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M16.658 9.99L15.395 9.569L14.974 8.306C14.837 7.898 14.162 7.898 14.025 8.306L13.604 9.569L12.341 9.99C12.137 10.058 11.999 10.249 11.999 10.464C11.999 10.679 12.137 10.87 12.341 10.938L13.604 11.359L14.025 12.622C14.093 12.826 14.285 12.964 14.5 12.964C14.715 12.964 14.906 12.826 14.975 12.622L15.396 11.359L16.659 10.938C16.863 10.87 17.001 10.679 17.001 10.464C17.001 10.249 16.862 10.058 16.658 9.99Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M5.25 13C5.66421 13 6 12.6642 6 12.25C6 11.8358 5.66421 11.5 5.25 11.5C4.83579 11.5 4.5 11.8358 4.5 12.25C4.5 12.6642 4.83579 13 5.25 13Z" :fill="color" data-stroke="none" stroke="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/TextToolIcon.vue

@@ -0,0 +1,42 @@
+<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="M13.25 3.25V4.25C13.25 4.52614 13.4739 4.75 13.75 4.75H14.75V13.25H13.75C13.4739 13.25 13.25 13.4739 13.25 13.75V14.75H4.75V13.75C4.75 13.4739 4.52614 13.25 4.25 13.25H3.25V4.75H4.25C4.52614 4.75 4.75 4.52614 4.75 4.25V3.25H13.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9 6.25V11.75" />
+      <path d="M11.25 6.25H6.75" />
+      <path d="M4.25 1.75H2.25C1.97386 1.75 1.75 1.97386 1.75 2.25V4.25C1.75 4.52614 1.97386 4.75 2.25 4.75H4.25C4.52614 4.75 4.75 4.52614 4.75 4.25V2.25C4.75 1.97386 4.52614 1.75 4.25 1.75Z" />
+      <path d="M15.75 1.75H13.75C13.4739 1.75 13.25 1.97386 13.25 2.25V4.25C13.25 4.52614 13.4739 4.75 13.75 4.75H15.75C16.0261 4.75 16.25 4.52614 16.25 4.25V2.25C16.25 1.97386 16.0261 1.75 15.75 1.75Z" />
+      <path d="M4.25 13.25H2.25C1.97386 13.25 1.75 13.4739 1.75 13.75V15.75C1.75 16.0261 1.97386 16.25 2.25 16.25H4.25C4.52614 16.25 4.75 16.0261 4.75 15.75V13.75C4.75 13.4739 4.52614 13.25 4.25 13.25Z" />
+      <path d="M15.75 13.25H13.75C13.4739 13.25 13.25 13.4739 13.25 13.75V15.75C13.25 16.0261 13.4739 16.25 13.75 16.25H15.75C16.0261 16.25 16.25 16.0261 16.25 15.75V13.75C16.25 13.4739 16.0261 13.25 15.75 13.25Z" />
+      <path d="M3.25 13.25V4.75" />
+      <path d="M13.25 14.75H4.75" />
+      <path d="M14.75 4.75V13.25" />
+      <path d="M4.75 3.25H13.25" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/UnorderedListIcon.vue

@@ -18,14 +18,13 @@ withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-    <title />
-    <g :fill="color">
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
       <path d="M3.75 7.25C4.85457 7.25 5.75 6.35457 5.75 5.25C5.75 4.14543 4.85457 3.25 3.75 3.25C2.64543 3.25 1.75 4.14543 1.75 5.25C1.75 6.35457 2.64543 7.25 3.75 7.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M3.75 14.75C4.85457 14.75 5.75 13.8546 5.75 12.75C5.75 11.6454 4.85457 10.75 3.75 10.75C2.64543 10.75 1.75 11.6454 1.75 12.75C1.75 13.8546 2.64543 14.75 3.75 14.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
-      <path d="M3.75 7.25C4.85457 7.25 5.75 6.35457 5.75 5.25C5.75 4.14543 4.85457 3.25 3.75 3.25C2.64543 3.25 1.75 4.14543 1.75 5.25C1.75 6.35457 2.64543 7.25 3.75 7.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M3.75 14.75C4.85457 14.75 5.75 13.8546 5.75 12.75C5.75 11.6454 4.85457 10.75 3.75 10.75C2.64543 10.75 1.75 11.6454 1.75 12.75C1.75 13.8546 2.64543 14.75 3.75 14.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M8.75 5.25H16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
-      <path d="M8.75 12.75H16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M3.75 7.25C4.85457 7.25 5.75 6.35457 5.75 5.25C5.75 4.14543 4.85457 3.25 3.75 3.25C2.64543 3.25 1.75 4.14543 1.75 5.25C1.75 6.35457 2.64543 7.25 3.75 7.25Z" />
+      <path d="M3.75 14.75C4.85457 14.75 5.75 13.8546 5.75 12.75C5.75 11.6454 4.85457 10.75 3.75 10.75C2.64543 10.75 1.75 11.6454 1.75 12.75C1.75 13.8546 2.64543 14.75 3.75 14.75Z" />
+      <path d="M8.75 5.25H16.25" />
+      <path d="M8.75 12.75H16.25" />
     </g>
   </svg>
 </template>

package/dist/icons/VolumeIcon.vue

@@ -18,10 +18,9 @@ withDefaults(defineProps<Props>(), {
     viewBox="0 0 18 18"
     xmlns="http://www.w3.org/2000/svg"
   >
-    <title />
-    <g :fill="color">
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
       <path d="M8 5.75H4.25C3.422 5.75 2.75 6.422 2.75 7.25V10.75C2.75 11.578 3.422 12.25 4.25 12.25H8L13.48 15.758C13.813 15.971 14.25 15.732 14.25 15.337V2.664C14.25 2.269 13.813 2.03 13.48 2.243L8 5.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
-      <path d="M8 5.75H4.25C3.422 5.75 2.75 6.422 2.75 7.25V10.75C2.75 11.578 3.422 12.25 4.25 12.25H8L13.48 15.758C13.813 15.971 14.25 15.732 14.25 15.337V2.664C14.25 2.269 13.813 2.03 13.48 2.243L8 5.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M8 5.75H4.25C3.422 5.75 2.75 6.422 2.75 7.25V10.75C2.75 11.578 3.422 12.25 4.25 12.25H8L13.48 15.758C13.813 15.971 14.25 15.732 14.25 15.337V2.664C14.25 2.269 13.813 2.03 13.48 2.243L8 5.75Z" />
     </g>
   </svg>
 </template>

package/dist/icons/VolumeOffIcon.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 fill-rule="evenodd" clip-rule="evenodd" d="M13.75 5.14289V2.664C13.75 2.269 13.313 2.03 12.98 2.243L7.5 5.75H3.75C2.922 5.75 2.25 6.422 2.25 7.25V10.75C2.25 11.578 2.922 12.25 3.75 12.25H6.37966L13.75 5.14289Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M12.98 15.758L8.89116 12.9498L13.2268 8.7726L13.75 9.08476V15.337C13.75 15.732 13.313 15.971 12.98 15.758Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.75 5.143V2.664C13.75 2.269 13.313 2.03 12.98 2.243L7.5 5.751H3.75C2.922 5.751 2.25 6.423 2.25 7.251V10.751C2.25 11.579 2.922 12.251 3.75 12.251H6.38" />
+      <path d="M2.75 15.75L16.75 2.25" />
+      <path d="M9.42419 13.4815L12.981 15.758C13.314 15.971 13.751 15.732 13.751 15.337V9.3092" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/Wallet2CircuitIcon.vue

@@ -18,8 +18,7 @@ withDefaults(defineProps<Props>(), {
     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">
+    <g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :stroke="color">
       <path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M15.75 13.25V11.75H13C12.034 11.75 11.25 10.966 11.25 10C11.25 9.033 12.034 8.25 13 8.25H15.75V6.5C15.75 5.395 14.855 4.5 13.75 4.5H4.25C3.145 4.5 2.25 5.395 2.25 6.5V13.25C2.25 14.355 3.145 15.25 4.25 15.25H13.75C14.855 15.25 15.75 14.355 15.75 13.25Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
       <path d="M2.25 6.49998C2.25 4.76698 3.499 3.28698 5.207 2.99498L11.769 1.87498C12.203 1.80098 12.635 2.01998 12.832 2.41398" />
       <path d="M1.25 14.75H6.5" />

package/dist/icons/WalletKeyIcon.vue

@@ -0,0 +1,38 @@
+<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" fill-rule="evenodd" clip-rule="evenodd" d="M14.75 6.75H4C2.895 6.75 2.25 5.855 2.25 4.75V10.0941C2.5723 10.0157 2.904 10 3.25 10C4.7266 10 6.0767 10.7832 6.8403 12H9.25C10.4907 12 11.5 13.0093 11.5 14.25C11.5 14.5135 11.4527 14.7655 11.3681 15C11.3372 15.0858 11.4745 15.25 11.5843 15.25H14.75C15.302 15.25 15.75 14.802 15.75 14.25V7.75C15.75 7.198 15.302 6.75 14.75 6.75Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M12.5 12C13.052 12 13.5 11.552 13.5 11C13.5 10.448 13.052 10 12.5 10C11.948 10 11.5 10.448 11.5 11C11.5 11.552 11.948 12 12.5 12Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M12.0781 15.25H14.75C15.302 15.25 15.75 14.802 15.75 14.25V7.75C15.75 7.198 15.302 6.75 14.75 6.75H4.25C3.145 6.75 2.25 5.855 2.25 4.75V9.35059" />
+      <path d="M2.25 4.75C2.25 3.645 3.145 2.75 4.25 2.75H12.75C13.302 2.75 13.75 3.198 13.75 3.75V4.25" />
+      <path d="M3.25 16.25C4.35457 16.25 5.25 15.3546 5.25 14.25C5.25 13.1454 4.35457 12.25 3.25 12.25C2.14543 12.25 1.25 13.1454 1.25 14.25C1.25 15.3546 2.14543 16.25 3.25 16.25Z" />
+      <path d="M5.25 14.25H9.25" />
+      <path d="M7.75 14.25V15.75" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/WaveformLinesIcon.vue

@@ -0,0 +1,37 @@
+<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="M1.25 8.25V9.75" />
+      <path d="M16.25 8.25V9.75" />
+      <path d="M4.25 3.75V14.25" />
+      <path d="M7.25 5.75V12.25" />
+      <path d="M10.25 2.75V15.25" />
+      <path d="M13.25 5.75V12.25" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/dist/icons/WindowLinkIcon.vue

@@ -0,0 +1,39 @@
+<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="M1.75 4.75C1.75 3.65 2.645 2.75 3.75 2.75H14.25C15.355 2.75 16.25 3.65 16.25 4.75V7.75H1.75V4.75Z" :fill="color" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M4.25 6C4.664 6 5 5.66 5 5.25C5 4.84 4.664 4.5 4.25 4.5C3.836 4.5 3.5 4.84 3.5 5.25C3.5 5.66 3.836 6 4.25 6Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M6.75 6C7.164 6 7.5 5.66 7.5 5.25C7.5 4.84 7.164 4.5 6.75 4.5C6.336 4.5 6 4.84 6 5.25C6 5.66 6.336 6 6.75 6Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M1.75 7.75H16.25" />
+      <path d="M16.25 9.31042V4.75C16.25 3.65 15.355 2.75 14.25 2.75H3.75C2.645 2.75 1.75 3.65 1.75 4.75V13.25C1.75 14.35 2.645 15.25 3.75 15.25H6.7566" />
+      <path d="M12 16.75H11.5C10.5335 16.75 9.75 15.9665 9.75 15V14C9.75 13.0335 10.5335 12.25 11.5 12.25H12" />
+      <path d="M15 16.75H15.5C16.4665 16.75 17.25 15.9665 17.25 15V14C17.25 13.0335 16.4665 12.25 15.5 12.25H15" />
+      <path d="M12.25 14.5H14.75" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>