@umbra.ui/icons 0.1.0

package/src/icons/ScaleIcon.vue

@@ -0,0 +1,44 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M0.775 9.25C0.767 9.333 0.75 9.414 0.75 9.5C0.75 11.019 1.981 12.25 3.5 12.25C5.019 12.25 6.25 11.019 6.25 9.5C6.25 9.414 6.232 9.333 6.225 9.25H0.775Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M17.225 9.25C17.233 9.333 17.25 9.414 17.25 9.5C17.25 11.019 16.019 12.25 14.5 12.25C12.981 12.25 11.75 11.019 11.75 9.5C11.75 9.414 11.768 9.333 11.775 9.25H17.225Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9 5.5C9.9665 5.5 10.75 4.7165 10.75 3.75C10.75 2.7835 9.9665 2 9 2C8.0335 2 7.25 2.7835 7.25 3.75C7.25 4.7165 8.0335 5.5 9 5.5Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M7.25002 3.75H3.52502" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M10.75 3.75H14.475" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M0.775 9.25C0.767 9.333 0.75 9.414 0.75 9.5C0.75 11.019 1.981 12.25 3.5 12.25C5.019 12.25 6.25 11.019 6.25 9.5C6.25 9.414 6.232 9.333 6.225 9.25H0.775Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M17.225 9.25C17.233 9.333 17.25 9.414 17.25 9.5C17.25 11.019 16.019 12.25 14.5 12.25C12.981 12.25 11.75 11.019 11.75 9.5C11.75 9.414 11.768 9.333 11.775 9.25H17.225Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M6.22502 9.25L3.52502 3.75L0.775024 9.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M11.775 9.25L14.475 3.75L17.225 9.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 5.5C9.9665 5.5 10.75 4.7165 10.75 3.75C10.75 2.7835 9.9665 2 9 2C8.0335 2 7.25 2.7835 7.25 3.75C7.25 4.7165 8.0335 5.5 9 5.5Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 5.5V15.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.25 15.75H4.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ScissorsCoupon2Icon.vue

@@ -0,0 +1,38 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path fill-rule="evenodd" clip-rule="evenodd" d="M11.4784 6.36469C12.4288 6.98227 12.7811 8.22972 12.2583 9.26456C11.6979 10.3737 10.3446 10.8186 9.23542 10.2583L7.21463 9.23738C6.97443 11.2147 5.29146 12.747 3.25 12.75V12.75C3.25 13.8546 4.14543 14.75 5.25 14.75H14.25C15.3546 14.75 16.25 13.8546 16.25 12.75V7.75C16.25 6.64543 15.3546 5.75 14.25 5.75H11.4784V6.36469ZM3.4596 9.20126L3.46555 9.19827L3.47824 9.19186C3.4721 9.19512 3.46589 9.19826 3.4596 9.20126Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M3.24402 4.5C4.21052 4.5 4.99402 3.7165 4.99402 2.75C4.99402 1.7835 4.21052 1 3.24402 1C2.27752 1 1.49402 1.7835 1.49402 2.75C1.49402 3.7165 2.27752 4.5 3.24402 4.5Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M2.45099 4.31L10.25 8.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M3.24402 10.5C4.21052 10.5 4.99402 9.7165 4.99402 8.75C4.99402 7.7835 4.21052 7 3.24402 7C2.27752 7 1.49402 7.7835 1.49402 8.75C1.49402 9.7165 2.27752 10.5 3.24402 10.5Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M2.45099 7.19L10.25 3.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M11.75 5.75H14.25C15.355 5.75 16.25 6.645 16.25 7.75V12.75C16.25 13.855 15.355 14.75 14.25 14.75H5.25C4.145 14.75 3.25 13.855 3.25 12.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ScissorsIcon.vue

@@ -0,0 +1,39 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M4 7.75C5.24264 7.75 6.25 6.74264 6.25 5.5C6.25 4.25736 5.24264 3.25 4 3.25C2.75736 3.25 1.75 4.25736 1.75 5.5C1.75 6.74264 2.75736 7.75 4 7.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M7 15.5C8.24264 15.5 9.25 14.4926 9.25 13.25C9.25 12.0074 8.24264 11 7 11C5.75736 11 4.75 12.0074 4.75 13.25C4.75 14.4926 5.75736 15.5 7 15.5Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M12.75 7.75H16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M4 7.75H9.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M4 7.75C5.24264 7.75 6.25 6.74264 6.25 5.5C6.25 4.25736 5.24264 3.25 4 3.25C2.75736 3.25 1.75 4.25736 1.75 5.5C1.75 6.74264 2.75736 7.75 4 7.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.409 11.659L14 3" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M7 15.5C8.24264 15.5 9.25 14.4926 9.25 13.25C9.25 12.0074 8.24264 11 7 11C5.75736 11 4.75 12.0074 4.75 13.25C4.75 14.4926 5.75736 15.5 7 15.5Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ScribbleIcon.vue

@@ -0,0 +1,33 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M1.75 9.881C1.75 9.881 5.824 5.674 8.142 3.85C9.692 2.631 10.605 2.511 11.167 3.072C12.192 4.093 10.76 5.99 8.809 8.584C6.858 11.178 5.446 12.666 6.515 13.675C7.57 14.671 9.752 12.443 10.565 11.535C11.378 10.627 13.234 8.613 14.143 9.46C14.948 10.21 13.753 12.022 13.33 12.832C12.907 13.642 12.387 14.478 13.005 15.037C13.879 15.828 15.25 14.161 15.25 14.161" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ShapesIcon.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M9.25 10.75H5.75C5.19772 10.75 4.75 11.1977 4.75 11.75V15.25C4.75 15.8023 5.19772 16.25 5.75 16.25H9.25C9.80228 16.25 10.25 15.8023 10.25 15.25V11.75C10.25 11.1977 9.80228 10.75 9.25 10.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M3.81801 1.99L1.18901 6.49799C0.995008 6.831 1.23501 7.24999 1.62101 7.24999H6.87901C7.26501 7.24999 7.50501 6.831 7.31101 6.49799L4.68201 1.99C4.48901 1.659 4.01101 1.659 3.81801 1.99Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.5 9.25C15.2949 9.25 16.75 7.79493 16.75 6C16.75 4.20507 15.2949 2.75 13.5 2.75C11.7051 2.75 10.25 4.20507 10.25 6C10.25 7.79493 11.7051 9.25 13.5 9.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9.25 10.75H5.75C5.19772 10.75 4.75 11.1977 4.75 11.75V15.25C4.75 15.8023 5.19772 16.25 5.75 16.25H9.25C9.80228 16.25 10.25 15.8023 10.25 15.25V11.75C10.25 11.1977 9.80228 10.75 9.25 10.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M3.81801 1.99L1.18901 6.49799C0.995008 6.83099 1.23501 7.24999 1.62101 7.24999H6.87901C7.26501 7.24999 7.50501 6.83099 7.31101 6.49799L4.68201 1.99C4.48901 1.659 4.01101 1.659 3.81801 1.99Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ShareUpRightIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 d="M15 13.08V4.92C15 3.85961 14.1404 3 13.08 3L4.92 3C3.85961 3 3 3.85961 3 4.92V13.08C3 14.1404 3.85961 15 4.92 15H13.08C14.1404 15 15 14.1404 15 13.08Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M10.5 2.75H15.25V7.5" />
+      <path d="M15.25 2.75L9 9" />
+      <path d="M15.25 10.5V13.25C15.25 14.355 14.355 15.25 13.25 15.25H4.75C3.645 15.25 2.75 14.355 2.75 13.25V4.75C2.75 3.645 3.645 2.75 4.75 2.75H7.5" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ShieldCheckIcon.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M9.305 1.848L14.555 3.528C14.969 3.661 15.25 4.046 15.25 4.48V11C15.25 14.03 10.566 15.748 9.308 16.155C9.105 16.221 8.895 16.221 8.692 16.155C7.434 15.748 2.75 14.03 2.75 11V4.48C2.75 4.045 3.031 3.66 3.445 3.528L8.695 1.848C8.893 1.785 9.106 1.785 9.305 1.848Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9.305 1.848L14.555 3.528C14.969 3.661 15.25 4.046 15.25 4.48V11C15.25 14.03 10.566 15.748 9.308 16.155C9.105 16.221 8.895 16.221 8.692 16.155C7.434 15.748 2.75 14.03 2.75 11V4.48C2.75 4.045 3.031 3.66 3.445 3.528L8.695 1.848C8.893 1.785 9.106 1.785 9.305 1.848Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M6.49701 9.75L8.10601 11.25L11.503 6.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ShopIcon.vue

@@ -0,0 +1,39 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M13.668 1.75H4.331C3.972 1.75 3.64 1.943 3.462 2.255L1.756 5.25C2.231 6.281 3.266 7 4.476 7C5.384 7 6.188 6.588 6.738 5.951C7.288 6.588 8.092 7 9 7C9.908 7 10.711 6.589 11.261 5.952C11.811 6.589 12.615 7 13.522 7C14.731 7 15.767 6.281 16.242 5.25L14.538 2.255C14.36 1.943 14.027 1.75 13.668 1.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M7.25 16V13C7.25 12.034 8.034 11.25 9 11.25C9.966 11.25 10.75 12.034 10.75 13V16" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M3.75 16.25V9.5" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M14.25 9.5V16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.668 1.75H4.331C3.972 1.75 3.64 1.943 3.462 2.255L1.756 5.25C2.231 6.281 3.266 7 4.476 7C5.384 7 6.188 6.588 6.738 5.951C7.288 6.588 8.092 7 9 7C9.908 7 10.711 6.589 11.261 5.952C11.811 6.589 12.615 7 13.522 7C14.731 7 15.767 6.281 16.242 5.25L14.538 2.255C14.36 1.943 14.027 1.75 13.668 1.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M7.25 16V13C7.25 12.034 8.034 11.25 9 11.25C9.966 11.25 10.75 12.034 10.75 13V16" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M1.75 16.25H16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/SideProfileIcon.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M11.25 16.5V13.75H12.889C13.938 13.75 14.808 12.94 14.884 11.894L14.996 10.351L16.5 9.74999L15 7.74999C15 4.01399 11.585 1.07499 7.707 1.88499C5.441 2.35799 3.61 4.18999 3.136 6.45499C2.541 9.30099 3.976 11.873 6.25 13.055V16.5" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M11.25 16.25V13.75H12.889C13.938 13.75 14.808 12.94 14.884 11.894L14.996 10.351L16.5 9.74999L15 7.74999C15 4.01399 11.585 1.07499 7.707 1.88499C5.441 2.35799 3.61 4.18999 3.136 6.45499C2.541 9.30099 3.976 11.873 6.25 13.055V16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M12.25 8C12.6642 8 13 7.66421 13 7.25C13 6.83579 12.6642 6.5 12.25 6.5C11.8358 6.5 11.5 6.83579 11.5 7.25C11.5 7.66421 11.8358 8 12.25 8Z" :fill="color" data-stroke="none" stroke="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Signal2Icon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M7.93903 13.72C8.52503 13.134 9.47503 13.134 10.06 13.72" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.81799 11.598C7.57499 9.84099 10.425 9.84099 12.182 11.598" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M3.69702 9.47699C6.62602 6.54799 11.375 6.54799 14.304 9.47699" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M1.57501 7.35599C5.67601 3.25499 12.324 3.25499 16.424 7.35599" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Sitemap4Icon.vue

@@ -0,0 +1,39 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M6 11.75H3.5C2.94772 11.75 2.5 12.1977 2.5 12.75V15.25C2.5 15.8023 2.94772 16.25 3.5 16.25H6C6.55228 16.25 7 15.8023 7 15.25V12.75C7 12.1977 6.55228 11.75 6 11.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M14.5 11.75H12C11.4477 11.75 11 12.1977 11 12.75V15.25C11 15.8023 11.4477 16.25 12 16.25H14.5C15.0523 16.25 15.5 15.8023 15.5 15.25V12.75C15.5 12.1977 15.0523 11.75 14.5 11.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.25 11.75V10.75C13.25 9.645 12.355 8.75 11.25 8.75H9H6.75C5.645 8.75 4.75 9.645 4.75 10.75V11.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 6.25V8.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M10.25 1.75H7.75C7.19772 1.75 6.75 2.19772 6.75 2.75V5.25C6.75 5.80228 7.19772 6.25 7.75 6.25H10.25C10.8023 6.25 11.25 5.80228 11.25 5.25V2.75C11.25 2.19772 10.8023 1.75 10.25 1.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M6 11.75H3.5C2.94772 11.75 2.5 12.1977 2.5 12.75V15.25C2.5 15.8023 2.94772 16.25 3.5 16.25H6C6.55228 16.25 7 15.8023 7 15.25V12.75C7 12.1977 6.55228 11.75 6 11.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M14.5 11.75H12C11.4477 11.75 11 12.1977 11 12.75V15.25C11 15.8023 11.4477 16.25 12 16.25H14.5C15.0523 16.25 15.5 15.8023 15.5 15.25V12.75C15.5 12.1977 15.0523 11.75 14.5 11.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/SlidersIcon.vue

@@ -0,0 +1,40 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M11 7.5C12.2426 7.5 13.25 6.49264 13.25 5.25C13.25 4.00736 12.2426 3 11 3C9.75736 3 8.75 4.00736 8.75 5.25C8.75 6.49264 9.75736 7.5 11 7.5Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M7 15C8.24264 15 9.25 13.9926 9.25 12.75C9.25 11.5074 8.24264 10.5 7 10.5C5.75736 10.5 4.75 11.5074 4.75 12.75C4.75 13.9926 5.75736 15 7 15Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.25 5.25H16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M1.75 5.25H8.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M11 7.5C12.2426 7.5 13.25 6.49264 13.25 5.25C13.25 4.00736 12.2426 3 11 3C9.75736 3 8.75 4.00736 8.75 5.25C8.75 6.49264 9.75736 7.5 11 7.5Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M4.75 12.75H1.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M16.25 12.75H9.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M7 15C8.24264 15 9.25 13.9926 9.25 12.75C9.25 11.5074 8.24264 10.5 7 10.5C5.75736 10.5 4.75 11.5074 4.75 12.75C4.75 13.9926 5.75736 15 7 15Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Sparkle3Icon.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M9.5 2.75L11.412 7.587L16.25 9.5L11.412 11.413L9.5 16.25L7.587 11.413L2.75 9.5L7.587 7.587L9.5 2.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M5.65799 2.99L4.39499 2.569L3.97399 1.306C3.83699 0.898 3.16199 0.898 3.02499 1.306L2.60399 2.569L1.34099 2.99C1.13699 3.058 0.998993 3.249 0.998993 3.464C0.998993 3.679 1.13699 3.87 1.34099 3.938L2.60399 4.359L3.02499 5.622C3.09299 5.826 3.28499 5.964 3.49999 5.964C3.71499 5.964 3.90599 5.826 3.97499 5.622L4.39599 4.359L5.65899 3.938C5.86299 3.87 6.00099 3.679 6.00099 3.464C6.00099 3.249 5.86199 3.058 5.65799 2.99Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M9.5 2.75L11.412 7.587L16.25 9.5L11.412 11.413L9.5 16.25L7.587 11.413L2.75 9.5L7.587 7.587L9.5 2.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/SquareDottedArrowBottomRightIcon.vue

@@ -0,0 +1,46 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path fill-rule="evenodd" clip-rule="evenodd" d="M4.5 2.5C3.39543 2.5 2.5 3.39543 2.5 4.5V13.5C2.5 14.6046 3.39543 15.5 4.5 15.5H9.25V9.25H15.5V4.5C15.5 3.39543 14.6046 2.5 13.5 2.5H4.5Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M2.75 9.75C3.16421 9.75 3.5 9.41421 3.5 9C3.5 8.58579 3.16421 8.25 2.75 8.25C2.33579 8.25 2 8.58579 2 9C2 9.41421 2.33579 9.75 2.75 9.75Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M9 3.5C9.41421 3.5 9.75 3.16421 9.75 2.75C9.75 2.33579 9.41421 2 9 2C8.58579 2 8.25 2.33579 8.25 2.75C8.25 3.16421 8.58579 3.5 9 3.5Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M2.75 3.5C3.16421 3.5 3.5 3.16421 3.5 2.75C3.5 2.33579 3.16421 2 2.75 2C2.33579 2 2 2.33579 2 2.75C2 3.16421 2.33579 3.5 2.75 3.5Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M2.75 6.625C3.16421 6.625 3.5 6.28921 3.5 5.875C3.5 5.46079 3.16421 5.125 2.75 5.125C2.33579 5.125 2 5.46079 2 5.875C2 6.28921 2.33579 6.625 2.75 6.625Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M2.75 12.875C3.16421 12.875 3.5 12.5392 3.5 12.125C3.5 11.7108 3.16421 11.375 2.75 11.375C2.33579 11.375 2 11.7108 2 12.125C2 12.5392 2.33579 12.875 2.75 12.875Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M2.75 16C3.16421 16 3.5 15.6642 3.5 15.25C3.5 14.8358 3.16421 14.5 2.75 14.5C2.33579 14.5 2 14.8358 2 15.25C2 15.6642 2.33579 16 2.75 16Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M15.25 3.5C15.6642 3.5 16 3.16421 16 2.75C16 2.33579 15.6642 2 15.25 2C14.8358 2 14.5 2.33579 14.5 2.75C14.5 3.16421 14.8358 3.5 15.25 3.5Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M15.25 6.625C15.6642 6.625 16 6.28921 16 5.875C16 5.46079 15.6642 5.125 15.25 5.125C14.8358 5.125 14.5 5.46079 14.5 5.875C14.5 6.28921 14.8358 6.625 15.25 6.625Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M12.125 3.5C12.5392 3.5 12.875 3.16421 12.875 2.75C12.875 2.33579 12.5392 2 12.125 2C11.7108 2 11.375 2.33579 11.375 2.75C11.375 3.16421 11.7108 3.5 12.125 3.5Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M5.875 3.5C6.28921 3.5 6.625 3.16421 6.625 2.75C6.625 2.33579 6.28921 2 5.875 2C5.46079 2 5.125 2.33579 5.125 2.75C5.125 3.16421 5.46079 3.5 5.875 3.5Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M5.875 16C6.28921 16 6.625 15.6642 6.625 15.25C6.625 14.8358 6.28921 14.5 5.875 14.5C5.46079 14.5 5.125 14.8358 5.125 15.25C5.125 15.6642 5.46079 16 5.875 16Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M9.25 15.25V9.25H15.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9.25 9.25L15.25 15.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/SquareMinusIcon.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M13.25 2.75H4.75C3.64543 2.75 2.75 3.64543 2.75 4.75V13.25C2.75 14.3546 3.64543 15.25 4.75 15.25H13.25C14.3546 15.25 15.25 14.3546 15.25 13.25V4.75C15.25 3.64543 14.3546 2.75 13.25 2.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.25 2.75H4.75C3.64543 2.75 2.75 3.64543 2.75 4.75V13.25C2.75 14.3546 3.64543 15.25 4.75 15.25H13.25C14.3546 15.25 15.25 14.3546 15.25 13.25V4.75C15.25 3.64543 14.3546 2.75 13.25 2.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.75 9H12.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/SquarePlusIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = 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 :fill="color">
+      <path d="M13.25 2.75H4.75C3.64543 2.75 2.75 3.64543 2.75 4.75V13.25C2.75 14.3546 3.64543 15.25 4.75 15.25H13.25C14.3546 15.25 15.25 14.3546 15.25 13.25V4.75C15.25 3.64543 14.3546 2.75 13.25 2.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.25 2.75H4.75C3.64543 2.75 2.75 3.64543 2.75 4.75V13.25C2.75 14.3546 3.64543 15.25 4.75 15.25H13.25C14.3546 15.25 15.25 14.3546 15.25 13.25V4.75C15.25 3.64543 14.3546 2.75 13.25 2.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.75 9H12.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 5.75V12.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>