@umbra.ui/icons 0.1.0

package/src/icons/AwardIcon.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 fill-rule="evenodd" clip-rule="evenodd" d="M10.42 11.481L9.64302 12.133C9.27102 12.445 8.72903 12.445 8.35703 12.133L7.58002 11.481C7.40002 11.33 7.17202 11.247 6.93702 11.247H5.92302C5.43802 11.247 5.02203 10.899 4.93803 10.421L4.76203 9.422C4.72103 9.191 4.60003 8.981 4.42003 8.83L3.64302 8.178C3.27102 7.866 3.17703 7.332 3.42003 6.912L3.92703 6.033C4.04503 5.829 4.08703 5.591 4.04603 5.359L3.87002 4.36C3.78602 3.882 4.05703 3.413 4.51303 3.247L5.46603 2.9C5.68703 2.819 5.87202 2.664 5.99002 2.46L6.49703 1.581C6.74003 1.16 7.24902 0.975002 7.70502 1.141L8.65802 1.488C8.87902 1.568 9.12102 1.568 9.34202 1.488L10.295 1.141C10.751 0.975002 11.26 1.161 11.503 1.581L12.01 2.46C12.128 2.664 12.313 2.82 12.534 2.9L13.487 3.247C13.943 3.413 14.214 3.882 14.13 4.36L13.954 5.359C13.913 5.591 13.955 5.829 14.073 6.033L14.58 6.912C14.823 7.332 14.729 7.866 14.357 8.178L13.58 8.83C13.4 8.981 13.279 9.19 13.238 9.422L13.062 10.421C12.978 10.899 12.562 11.247 12.077 11.247H11.063C10.828 11.247 10.6 11.33 10.42 11.481ZM11 6.724C11 7.82857 10.1046 8.724 9 8.724C7.89543 8.724 7 7.82857 7 6.724C7 5.61943 7.89543 4.724 9 4.724C10.1046 4.724 11 5.61943 11 6.724Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9.64302 12.133L10.42 11.481C10.6 11.33 10.828 11.247 11.063 11.247H12.077C12.562 11.247 12.978 10.899 13.062 10.421L13.238 9.422C13.279 9.19 13.4 8.981 13.58 8.83L14.357 8.178C14.729 7.866 14.823 7.332 14.58 6.912L14.073 6.033C13.955 5.829 13.913 5.591 13.954 5.359L14.13 4.36C14.214 3.882 13.943 3.413 13.487 3.247L12.534 2.9C12.313 2.82 12.128 2.664 12.01 2.46L11.503 1.581C11.26 1.161 10.751 0.975002 10.295 1.141L9.34202 1.488C9.12102 1.568 8.87902 1.568 8.65802 1.488L7.70502 1.141C7.24902 0.975002 6.74003 1.16 6.49703 1.581L5.99002 2.46C5.87202 2.664 5.68703 2.819 5.46603 2.9L4.51303 3.247C4.05703 3.413 3.78602 3.882 3.87002 4.36L4.04603 5.359C4.08703 5.591 4.04503 5.829 3.92703 6.033L3.42003 6.912C3.17703 7.332 3.27102 7.866 3.64302 8.178L4.42003 8.83C4.60003 8.981 4.72103 9.191 4.76203 9.422L4.93803 10.421C5.02203 10.899 5.43802 11.247 5.92302 11.247H6.93702C7.17202 11.247 7.40002 11.33 7.58002 11.481L8.35703 12.133C8.72903 12.445 9.27102 12.445 9.64302 12.133Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M12.25 13.75V17.25L9 14.75L5.75 17.25V13.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 8.724C10.1046 8.724 11 7.82857 11 6.724C11 5.61943 10.1046 4.724 9 4.724C7.89543 4.724 7 5.61943 7 6.724C7 7.82857 7.89543 8.724 9 8.724Z" :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/BagShoppingIcon.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="M5.334 4.75H12.667C13.704 4.75 14.57 5.543 14.659 6.577L15.311 14.077C15.413 15.246 14.491 16.25 13.319 16.25H4.681C3.508 16.25 2.587 15.245 2.689 14.077L3.341 6.577C3.431 5.543 4.297 4.75 5.334 4.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M6.75 4.75V3C6.75 1.757 7.757 0.75 9 0.75C10.243 0.75 11.25 1.757 11.25 3V4.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.334 4.75H12.667C13.704 4.75 14.57 5.543 14.659 6.577L15.311 14.077C15.413 15.246 14.491 16.25 13.319 16.25H4.681C3.508 16.25 2.587 15.245 2.689 14.077L3.341 6.577C3.431 5.543 4.297 4.75 5.334 4.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/BallBasketIcon.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="M4.27521 7.66442C3.75427 7.3287 3.60725 6.6761 3.44903 5.97378L3.44903 5.97377C3.35967 5.57715 3.26675 5.16466 3.10088 4.78443C2.25051 5.9723 1.75 7.4277 1.75 9C1.75 10.5898 2.2617 12.0601 3.12938 13.2551C4.49531 12.364 6.35687 12.6099 6.89728 12.8029C6.95985 12.8252 7.06964 12.8688 7.21837 12.9279C8.37328 13.3864 11.8762 14.7774 13.8485 14.3903C15.3229 13.0632 16.25 11.1399 16.25 9C16.25 6.99571 15.4367 5.18138 14.1221 3.86903C11.7441 4.10774 10.3197 5.32739 9.1162 6.35794L8.94844 6.5014C7.51052 7.72786 5.22677 8.27765 4.27521 7.66442Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M8.65202 1.759C8.15802 2.196 5.25602 4.85 5.15602 9.218C5.07002 12.977 7.11501 15.509 7.63901 16.121" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M1.77002 9.532C2.96102 9.943 4.39502 10.314 6.03802 10.499C10.517 11.003 14.173 9.857 16.25 9" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M3.14697 13.277C3.14697 13.277 4.29397 12.609 5.66697 12.609C7.86997 12.609 10.333 14.896 13.905 14.336" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M3.14697 4.722C3.84397 6.25 3.29197 7.924 5.27097 7.924C9.33397 7.924 9.99997 3.937 14.189 3.937" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="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" :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/BallotCircleIcon.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 stroke-linecap="round" stroke-width="1.5" fill="none" :stroke="color" stroke-linejoin="round">
+      <path d="M5 7.5C6.38071 7.5 7.5 6.38071 7.5 5C7.5 3.61929 6.38071 2.5 5 2.5C3.61929 2.5 2.5 3.61929 2.5 5C2.5 6.38071 3.61929 7.5 5 7.5Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M5 15.5C6.38071 15.5 7.5 14.3807 7.5 13C7.5 11.6193 6.38071 10.5 5 10.5C3.61929 10.5 2.5 11.6193 2.5 13C2.5 14.3807 3.61929 15.5 5 15.5Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M10.5 5.25H15.25" />
+      <path d="M10.5 12.75H15.25" />
+      <path d="M5 7.5C6.38071 7.5 7.5 6.38071 7.5 5C7.5 3.61929 6.38071 2.5 5 2.5C3.61929 2.5 2.5 3.61929 2.5 5C2.5 6.38071 3.61929 7.5 5 7.5Z" />
+      <path d="M5 15.5C6.38071 15.5 7.5 14.3807 7.5 13C7.5 11.6193 6.38071 10.5 5 10.5C3.61929 10.5 2.5 11.6193 2.5 13C2.5 14.3807 3.61929 15.5 5 15.5Z" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/BasketShoppingIcon.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="M15 6.25L14.403 13.416C14.317 14.453 13.45 15.25 12.41 15.25H5.59C4.55 15.25 3.683 14.453 3.597 13.416L3 6.25" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M4.75 6.25L7.25 1.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.25 6.25L10.75 1.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M15 6.25L14.403 13.416C14.317 14.453 13.45 15.25 12.41 15.25H5.59C4.55 15.25 3.683 14.453 3.597 13.416L3 6.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M1.75 6.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/BatteryHighIcon.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 d="M13.75 4.25H3.75C2.64543 4.25 1.75 5.14543 1.75 6.25V11.75C1.75 12.8546 2.64543 13.75 3.75 13.75H13.75C14.8546 13.75 15.75 12.8546 15.75 11.75V6.25C15.75 5.14543 14.8546 4.25 13.75 4.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M4.75 7.25V10.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M7.5 7.25V10.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M10.25 7.25V10.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.75 4.25H3.75C2.64543 4.25 1.75 5.14543 1.75 6.25V11.75C1.75 12.8546 2.64543 13.75 3.75 13.75H13.75C14.8546 13.75 15.75 12.8546 15.75 11.75V6.25C15.75 5.14543 14.8546 4.25 13.75 4.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M17.25 7.75H15.75V10.25H17.25V7.75Z" :fill="color" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/BatteryIcon.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.75 4.25H3.75C2.64543 4.25 1.75 5.14543 1.75 6.25V11.75C1.75 12.8546 2.64543 13.75 3.75 13.75H13.75C14.8546 13.75 15.75 12.8546 15.75 11.75V6.25C15.75 5.14543 14.8546 4.25 13.75 4.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.75 4.25H3.75C2.64543 4.25 1.75 5.14543 1.75 6.25V11.75C1.75 12.8546 2.64543 13.75 3.75 13.75H13.75C14.8546 13.75 15.75 12.8546 15.75 11.75V6.25C15.75 5.14543 14.8546 4.25 13.75 4.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M17.25 7.75H15.75V10.25H17.25V7.75Z" :fill="color" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/BellIcon.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="M15.75 13.25C14.645 13.25 13.75 12.355 13.75 11.25V6.5C13.75 3.877 11.623 1.75 9 1.75C6.377 1.75 4.25 3.877 4.25 6.5V11.25C4.25 12.355 3.355 13.25 2.25 13.25H15.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M15.75 13.25C14.645 13.25 13.75 12.355 13.75 11.25V6.5C13.75 3.877 11.623 1.75 9 1.75C6.377 1.75 4.25 3.877 4.25 6.5V11.25C4.25 12.355 3.355 13.25 2.25 13.25H15.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M10.588 15.185C10.493 15.068 10.351 15 10.2 15H7.801C7.65 15 7.508 15.068 7.413 15.185C7.318 15.302 7.281 15.456 7.312 15.603C7.485 16.425 8.18 17 9.001 17C9.822 17 10.517 16.425 10.69 15.603C10.721 15.456 10.683 15.302 10.588 15.185Z" :fill="color" data-stroke="none" stroke="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/BicycleIcon.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="M6.06746 8.86299C5.56311 8.47839 4.93323 8.25 4.25 8.25C2.59315 8.25 1.25 9.59315 1.25 11.25C1.25 12.9069 2.59315 14.25 4.25 14.25C5.90685 14.25 7.25 12.9069 7.25 11.25H5.259C4.845 11.25 4.611 10.776 4.861 10.447L6.06746 8.86299Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.75 14.25C15.4069 14.25 16.75 12.9069 16.75 11.25C16.75 9.59315 15.4069 8.25 13.75 8.25C12.0931 8.25 10.75 9.59315 10.75 11.25C10.75 12.9069 12.0931 14.25 13.75 14.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.75 14.25C15.4069 14.25 16.75 12.9069 16.75 11.25C16.75 9.59315 15.4069 8.25 13.75 8.25C12.0931 8.25 10.75 9.59315 10.75 11.25C10.75 12.9069 12.0931 14.25 13.75 14.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M7.25 11.25C7.25 12.907 5.907 14.25 4.25 14.25C2.593 14.25 1.25 12.907 1.25 11.25C1.25 9.593 2.593 8.25 4.25 8.25C4.933 8.25 5.564 8.479 6.068 8.863" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M4.25 4.75H6.232L8.703 10.554C8.843 10.884 8.601 11.25 8.243 11.25H5.259C4.845 11.25 4.611 10.776 4.861 10.447L7.296 7.25H12.046" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.75 11.25L10.344 3.25H13.75C14.44 3.25 15 3.81 15 4.5C15 5.105 14.571 5.609 14 5.725" :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/BitcoinIcon.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 stroke-linecap="round" stroke-width="1.5" fill="none" :stroke="color" stroke-linejoin="round">
+      <path d="M11.5774 9.44356C10.2217 9.07673 8.20818 8.57301 7.37087 8.367L6.13483 13.3511C7.05189 13.577 9.16115 14.1047 10.2616 14.4077C11.6372 14.7865 13.3318 14.1685 13.6309 12.6334C13.9299 11.0983 13.272 9.9021 11.5774 9.44356Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M11.809 2.44501L11.253 4.65401" />
+      <path d="M8.88999 14.041L8.33398 16.25" />
+      <path d="M6.28302 3.403L12.357 4.932C13.577 5.239 14.317 6.477 14.01 7.697C13.703 8.917 12.465 9.657 11.245 9.35L7.38002 8.377" />
+      <path d="M7.38002 8.37601L11.798 9.48801C13.17 9.83301 14.003 11.226 13.657 12.598C13.312 13.97 11.919 14.803 10.547 14.458L3.92102 12.79" />
+      <path d="M9.048 1.75L5.573 15.555" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/BoltIcon.vue

@@ -0,0 +1,34 @@
+<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="m8.597,16.41l5.872-8.265c.118-.166,0-.395-.204-.395h-5.016l.604-5.98c.037-.26-.299-.394-.451-.18L3.531,9.855c-.118.166,0,.395.204.395h5.016l-.604,5.98c-.037.26.299.394.451.18Z" :fill="color" opacity=".3" stroke-width="0" data-color="color-2" />
+      <path d="m8.597,16.41l5.872-8.265c.118-.166,0-.395-.204-.395h-5.016l.604-5.98c.037-.26-.299-.394-.451-.18L3.531,9.855c-.118.166,0,.395.204.395h5.016l-.604,5.98c-.037.26.299.394.451.18Z" fill="none" :stroke="color" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/BoltLightningIcon.vue

@@ -0,0 +1,34 @@
+<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.25 16.25L9.25 9.25H4.466C4.118 9.25 3.877 8.904 3.997 8.578L6.38 2.078C6.452 1.881 6.64 1.75 6.849 1.75H11.019C11.371 1.75 11.612 2.103 11.485 2.431L10 6.25H13.75C14.162 6.25 14.397 6.72 14.15 7.05L7.25 16.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M7.25 16.25L9.25 9.25H4.466C4.118 9.25 3.877 8.904 3.997 8.578L6.38 2.078C6.452 1.881 6.64 1.75 6.849 1.75H11.019C11.371 1.75 11.612 2.103 11.485 2.431L10 6.25H13.75C14.162 6.25 14.397 6.72 14.15 7.05L7.25 16.25Z" :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/BoltSlashIcon.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="m3.734,10.25h4.016l2.5-2.5h-1l.604-5.979c.037-.26-.299-.394-.451-.18L3.531,9.855c-.118.166,0,.395.204.395Z" :fill="color" opacity=".3" stroke-width="0" data-color="color-2" />
+      <path d="m8.465,13.07l-.319,3.159c-.037.26.299.394.451.18l5.872-8.265c.118-.166,0-.395-.204-.395h-.481" fill="none" :stroke="color" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
+      <path d="m10.25,7.75h-1l.604-5.98c.037-.26-.299-.394-.451-.18L3.531,9.855c-.118.166,0,.395.204.395h4.016" fill="none" :stroke="color" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
+      <line x1="2" y1="16" x2="16" y2="2" fill="none" :stroke="color" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/BookBookmarkIcon.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="M2.75 4.25C2.75 3.14543 3.64543 2.25 4.75 2.25H15.25V12.25H2.75V4.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M2.75 14V4.25C2.75 3.145 3.645 2.25 4.75 2.25H15.25V12.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M11 14H7V17.5C7 17.702 7.122 17.885 7.309 17.962C7.496 18.041 7.71 17.997 7.854 17.854L9 16.708L10.146 17.854C10.242 17.95 10.37 18 10.5 18C10.564 18 10.63 17.988 10.691 17.962C10.878 17.885 11 17.702 11 17.5V14Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M5.25 15.75H4.5C3.534 15.75 2.75 14.967 2.75 14C2.75 13.033 3.534 12.25 4.5 12.25H15.25C14.609 13.094 14.516 14.797 15.25 15.75H12.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.75 10.5C6.16421 10.5 6.5 10.1642 6.5 9.75C6.5 9.33579 6.16421 9 5.75 9C5.33579 9 5 9.33579 5 9.75C5 10.1642 5.33579 10.5 5.75 10.5Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M5.75 5.5C6.16421 5.5 6.5 5.16421 6.5 4.75C6.5 4.33579 6.16421 4 5.75 4C5.33579 4 5 4.33579 5 4.75C5 5.16421 5.33579 5.5 5.75 5.5Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M5.75 8C6.16421 8 6.5 7.66421 6.5 7.25C6.5 6.83579 6.16421 6.5 5.75 6.5C5.33579 6.5 5 6.83579 5 7.25C5 7.66421 5.33579 8 5.75 8Z" :fill="color" data-stroke="none" stroke="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/BookOpenIcon.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="M8.99999 15.051C9.16999 15.051 9.33899 15.006 9.49399 14.917C10.137 14.546 11.226 14.07 12.635 14.072C13.534 14.073 14.302 14.269 14.905 14.507C15.553 14.762 16.249 14.267 16.249 13.57V4.48701C16.249 4.13301 16.068 3.80701 15.763 3.62701C15.126 3.25101 14.037 2.76401 12.623 2.76401C10.733 2.76401 9.42499 3.63601 8.99899 3.94601" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M8.99999 15.051C9.16999 15.051 9.33899 15.006 9.49399 14.917C10.137 14.546 11.226 14.07 12.635 14.072C13.534 14.073 14.302 14.269 14.905 14.507C15.553 14.762 16.249 14.267 16.249 13.57V4.48701C16.249 4.13301 16.068 3.80701 15.763 3.62701C15.126 3.25101 14.037 2.76401 12.623 2.76401C10.733 2.76401 9.42499 3.63601 8.99899 3.94601" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9.00001 15.051C8.83001 15.051 8.66101 15.006 8.50601 14.917C7.86301 14.546 6.77401 14.07 5.36501 14.072C4.46601 14.073 3.69801 14.269 3.09501 14.507C2.44701 14.762 1.75101 14.27 1.75101 13.574C1.75101 10.981 1.75101 6.10201 1.75101 4.48401C1.75101 4.13001 1.93201 3.80801 2.23701 3.62801C2.87401 3.25201 3.96301 2.76501 5.37701 2.76501C7.26701 2.76501 8.57501 3.63701 9.00101 3.94701V15.051H9.00001Z" :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/BookmarkIcon.vue

@@ -0,0 +1,34 @@
+<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="M14.25 16.25L9 12.75L3.75 16.25V3.75C3.75 2.645 4.645 1.75 5.75 1.75H12.25C13.355 1.75 14.25 2.645 14.25 3.75V16.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M14.25 16.25L9 12.75L3.75 16.25V3.75C3.75 2.645 4.645 1.75 5.75 1.75H12.25C13.355 1.75 14.25 2.645 14.25 3.75V16.25Z" :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/BookmarkSlashIcon.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 fill-rule="evenodd" clip-rule="evenodd" d="M14.25 3.75C14.25 2.645 13.355 1.75 12.25 1.75H5.75C4.645 1.75 3.75 2.645 3.75 3.75V14.25L14.25 3.75ZM14.25 6.96733L7.402 13.8153L9 12.75L14.25 16.25V6.96733Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M3.75 14.25V3.75C3.75 2.645 4.645 1.75 5.75 1.75H12.25C13.355 1.75 14.25 2.645 14.25 3.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M14.25 7.285V16.25L9 12.75L7.812 13.542" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M2 16L16 2" :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>