@mozaic-ds/icons-vue 2.3.0 → 2.4.0

package/src/components/Megaphone64/Megaphone64.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64px" height="64px"><path fill-rule="evenodd" d="M29.252 9.03a1.5 1.5 0 0 1 1.29.42l24.514 24.514a1.5 1.5 0 0 1-.372 2.393l-17.015 8.8 4.441 7.995a1.5 1.5 0 0 1-.25 1.79l-3.771 3.77a1.5 1.5 0 0 1-2.122 0l-8.353-8.353-.065.033-5.49 5.49a1.5 1.5 0 0 1-2.121 0L8.622 44.572a1.5 1.5 0 0 1 0-2.122l5.492-5.492L28.15 9.822a1.5 1.5 0 0 1 1.102-.793m1.158 39.883 6.618 6.618 1.91-1.91-3.935-7.084zm-15.07-8.939 9.192 9.193-3.534 3.533-9.194-9.19zm1.836-2.406 9.763 9.762 15.068-7.794L24.97 22.5zm34.308-2.933-7.612 3.937-17.937-17.937 3.937-7.612zm-6.68-18.23a1 1 0 0 0 1.415 1.415l5.656-5.657a1 1 0 1 0-1.414-1.414zm-3.81-10.643a1 1 0 0 1 .784 1.176l-.943 4.714a1 1 0 1 1-1.96-.392l.942-4.714a1 1 0 0 1 1.177-.784m9.978 16.027a1 1 0 0 0 .392 1.962l4.715-.943a1 1 0 1 0-.393-1.962z"/></svg></template>
+<script setup lang="ts">
+/**
+ * Megaphone64 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Menu20/Menu20.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M2.583 4.167a.75.75 0 0 1 .75-.75h13.333a.75.75 0 1 1 0 1.5H3.333a.75.75 0 0 1-.75-.75m0 5.833a.75.75 0 0 1 .75-.75h13.333a.75.75 0 1 1 0 1.5H3.333a.75.75 0 0 1-.75-.75m0 5.833a.75.75 0 0 1 .75-.75h13.333a.75.75 0 1 1 0 1.5H3.333a.75.75 0 0 1-.75-.75"/></svg></template>
+<script setup lang="ts">
+/**
+ * Menu20 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Menu24/Menu24.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M3 5a1 1 0 0 1 1-1h16a1 1 0 1 1 0 2H4a1 1 0 0 1-1-1m0 7a1 1 0 0 1 1-1h16a1 1 0 1 1 0 2H4a1 1 0 0 1-1-1m0 7a1 1 0 0 1 1-1h16a1 1 0 1 1 0 2H4a1 1 0 0 1-1-1"/></svg></template>
+<script setup lang="ts">
+/**
+ * Menu24 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Menu32/Menu32.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M4.333 6.667a1 1 0 0 1 1-1h21.333a1 1 0 1 1 0 2H5.333a1 1 0 0 1-1-1m0 9.333a1 1 0 0 1 1-1h21.333a1 1 0 0 1 0 2H5.333a1 1 0 0 1-1-1m0 9.333a1 1 0 0 1 1-1h21.333a1 1 0 1 1 0 2H5.333a1 1 0 0 1-1-1"/></svg></template>
+<script setup lang="ts">
+/**
+ * Menu32 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Menu48/Menu48.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M6.5 10A1.5 1.5 0 0 1 8 8.5h32a1.5 1.5 0 0 1 0 3H8A1.5 1.5 0 0 1 6.5 10m0 14A1.5 1.5 0 0 1 8 22.5h32a1.5 1.5 0 0 1 0 3H8A1.5 1.5 0 0 1 6.5 24m0 14A1.5 1.5 0 0 1 8 36.5h32a1.5 1.5 0 0 1 0 3H8A1.5 1.5 0 0 1 6.5 38"/></svg></template>
+<script setup lang="ts">
+/**
+ * Menu48 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Menu64/Menu64.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64px" height="64px"><path fill-rule="evenodd" d="M9.167 13.334a1.5 1.5 0 0 1 1.5-1.5h42.667a1.5 1.5 0 0 1 0 3H10.667a1.5 1.5 0 0 1-1.5-1.5m0 18.666a1.5 1.5 0 0 1 1.5-1.5h42.667a1.5 1.5 0 1 1 0 3H10.667a1.5 1.5 0 0 1-1.5-1.5m0 18.667a1.5 1.5 0 0 1 1.5-1.5h42.667a1.5 1.5 0 0 1 0 3H10.667a1.5 1.5 0 0 1-1.5-1.5"/></svg></template>
+<script setup lang="ts">
+/**
+ * Menu64 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Mic20/Mic20.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M7.167 4.583a2.833 2.833 0 1 1 5.666 0v5a2.833 2.833 0 1 1-5.666 0zM10 3.25c-.736 0-1.333.597-1.333 1.333v5a1.333 1.333 0 1 0 2.666 0v-5c0-.736-.597-1.333-1.333-1.333m-.75 12.035a5.75 5.75 0 0 1-5-5.702v-2.5a.75.75 0 0 1 1.5 0v2.5a4.25 4.25 0 0 0 8.5 0v-2.5a.75.75 0 0 1 1.5 0v2.5a5.75 5.75 0 0 1-5 5.702v1.465h1.75a.75.75 0 0 1 0 1.5h-5a.75.75 0 0 1 0-1.5h1.75z"/></svg></template>
+<script setup lang="ts">
+/**
+ * Mic20 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Mic24/Mic24.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M8.5 5.5a3.5 3.5 0 1 1 7 0v6a3.5 3.5 0 1 1-7 0zM12 4a1.5 1.5 0 0 0-1.5 1.5v6a1.5 1.5 0 0 0 3 0v-6A1.5 1.5 0 0 0 12 4m0 12.5a5 5 0 0 0 5-5v-3a1 1 0 1 1 2 0v3a7 7 0 0 1-6 6.93V20h2a1 1 0 1 1 0 2H9a1 1 0 1 1 0-2h2v-1.57a7 7 0 0 1-6-6.93v-3a1 1 0 0 1 2 0v3a5 5 0 0 0 5 5"/></svg></template>
+<script setup lang="ts">
+/**
+ * Mic24 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Mic32/Mic32.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M11.667 7.333a4.333 4.333 0 1 1 8.666 0v8a4.333 4.333 0 1 1-8.666 0zM16 5a2.333 2.333 0 0 0-2.333 2.333v8a2.333 2.333 0 1 0 4.666 0v-8A2.333 2.333 0 0 0 16 5m.002 17.333H16a7 7 0 0 1-7-7v-4a1 1 0 1 0-2 0v4c0 4.633 3.5 8.448 8 8.945V27h-3a1 1 0 1 0 0 2h8a1 1 0 1 0 0-2h-3v-2.722c4.5-.497 8-4.312 8-8.945v-4a1 1 0 1 0-2 0v4a7 7 0 0 1-6.998 7"/></svg></template>
+<script setup lang="ts">
+/**
+ * Mic32 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Mic48/Mic48.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M17.5 11a6.5 6.5 0 1 1 13 0v12a6.5 6.5 0 1 1-13 0zM24 7.5a3.5 3.5 0 0 0-3.5 3.5v12a3.5 3.5 0 1 0 7 0V11A3.5 3.5 0 0 0 24 7.5m0 26c5.799 0 10.5-4.701 10.5-10.5v-6a1.5 1.5 0 0 1 3 0v6c0 6.949-5.25 12.671-12 13.418V40.5H30a1.5 1.5 0 0 1 0 3H18a1.5 1.5 0 0 1 0-3h4.5v-4.082c-6.75-.747-12-6.47-12-13.418v-6a1.5 1.5 0 0 1 3 0v6c0 5.799 4.701 10.5 10.5 10.5"/></svg></template>
+<script setup lang="ts">
+/**
+ * Mic48 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Mic64/Mic64.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64px" height="64px"><path fill-rule="evenodd" d="M23.833 14.667a8.167 8.167 0 1 1 16.334 0v16a8.167 8.167 0 0 1-16.334 0zM32 9.5a5.167 5.167 0 0 0-5.167 5.167v16a5.167 5.167 0 0 0 10.334 0v-16A5.167 5.167 0 0 0 32 9.5m.003 35.667H32c-8.008 0-14.5-6.492-14.5-14.5v-8a1.5 1.5 0 1 0-3 0v8c0 9.16 7.037 16.675 16 17.436V54.5H24a1.5 1.5 0 0 0 0 3h16a1.5 1.5 0 0 0 0-3h-6.5v-6.397c8.963-.76 16-8.277 16-17.436v-8a1.5 1.5 0 1 0-3 0v8c0 8.007-6.49 14.498-14.497 14.5"/></svg></template>
+<script setup lang="ts">
+/**
+ * Mic64 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MixerTruck20/MixerTruck20.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M1.859 7.411a.75.75 0 0 1-.248-.773l.862-3.22a.75.75 0 0 1 .66-.553l5.358-.467c2.103-.184 3.84 1.343 4.112 3.265a.75.75 0 0 1 .73-.58h2.084a.75.75 0 0 1 .67.415l2.084 4.166a.75.75 0 0 1 .08.336v4.166a.75.75 0 0 1-.75.75h-1.453a2.418 2.418 0 0 1-4.596 0h-2.07a2.418 2.418 0 0 1-4.597 0H3.333a.75.75 0 0 1-.75-.75v-3.333a.75.75 0 0 1 .75-.75h1.773zm5.322 4.172H4.083v1.833h.702a2.418 2.418 0 0 1 4.596 0h2.071c.191-.586.6-1.073 1.131-1.366v-.467H9.855a3.56 3.56 0 0 1-2.674 0m4.42-1.5h.982V6.837q-.03.174-.076.348l-.27 1.006-.27 1.006a3.6 3.6 0 0 1-.367.886m-1.082-1.274.27-1.006.269-1.006.003-.012-2.827 3.538c.98.136 2-.451 2.285-1.514M7.274 9.922l3.687-4.613a2.34 2.34 0 0 0-1.125-1.194L6.019 8.89l1.19.98zM5.246 8.256l-.991-.816 2.46-3.382 1.906-.166q.06-.005.118-.007zM3.184 6.56l.297.244 1.914-2.63-1.609.14zm13.566 6.857h-.702a2.42 2.42 0 0 0-1.965-1.644V10.75h2.667zM14.083 9.25h2.204l-1.334-2.667h-.87zM8 14.166a.917.917 0 1 0-1.833 0 .917.917 0 0 0 1.833 0m5.75.917a.917.917 0 1 0 0-1.833.917.917 0 0 0 0 1.833"/></svg></template>
+<script setup lang="ts">
+/**
+ * MixerTruck20 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MixerTruck24/MixerTruck24.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M2.166 8.97a1 1 0 0 1-.33-1.03L2.87 4.076a1 1 0 0 1 .88-.737l6.43-.56c2.456-.215 4.507 1.474 4.982 3.673A1 1 0 0 1 16 6h2.5a1 1 0 0 1 .894.553l2.5 5A1 1 0 0 1 22 12v5a1 1 0 0 1-1 1h-1.67a3.001 3.001 0 0 1-5.66 0h-2.34a3.001 3.001 0 0 1-5.66 0H4a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h1.849zM8.597 14H5v2h.67a3 3 0 0 1 2.931-1.998zm1.196.292A3 3 0 0 1 11.33 16h2.342A3 3 0 0 1 15 14.402V14h-3.155c-.646.256-1.351.36-2.052.293M14.09 12H15V9.04l-.219.816-.323 1.207q-.136.503-.368.937m-1.564-1.455.323-1.207.324-1.207.009-.034-3.344 4.184a2.383 2.383 0 0 0 2.688-1.736m-3.654 1.343 4.25-5.318a2.7 2.7 0 0 0-1.478-1.594l-4.437 5.552 1.507 1.24q.077.063.158.12M6.435 9.893l-1.348-1.11 2.76-3.794 2.507-.218q.092-.01.182-.01zm-2.5-2.057.378.311 2.214-3.043-1.905.166zM20 16h-.67A3 3 0 0 0 17 14.042V13h3zm-3-5h2.382l-1.5-3H17zm-9.5 6a1 1 0 1 0 2 0 1 1 0 0 0-2 0m9-1a1 1 0 1 0 0 2 1 1 0 0 0 0-2"/></svg></template>
+<script setup lang="ts">
+/**
+ * MixerTruck24 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MixerTruck32/MixerTruck32.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M3.1 11.704a1 1 0 0 1-.33-1.032l1.38-5.151a1 1 0 0 1 .88-.738l8.573-.747c4.081-.356 7.275 3.451 6.215 7.408l-.432 1.61-.431 1.61a5.5 5.5 0 0 1-.757 1.669h2.135v-7a1 1 0 0 1 1-1h3.334a1 1 0 0 1 .894.553l3.334 6.667A1 1 0 0 1 29 16v6.667a1 1 0 0 1-1 1h-2.471a3.668 3.668 0 0 1-7.058 0h-3.609a3.668 3.668 0 0 1-7.057 0H5.333a1 1 0 0 1-1-1v-5.334a1 1 0 0 1 1-1h3.395zm8.43 6.63H6.333v3.333h1.472a3.668 3.668 0 0 1 7.057 0h3.61a3.68 3.68 0 0 1 1.861-2.267v-1.067H15.73a5.5 5.5 0 0 1-4.2 0m5.493-4.188.431-1.61.432-1.61q.128-.483.135-.955l-5.317 6.653c1.79.493 3.793-.514 4.32-2.478m-5.263 2.058 6.046-7.566a3.94 3.94 0 0 0-2.223-2.342l-6.31 7.896 2.134 1.755q.171.141.353.257M8.5 13.556l-2.043-1.68 4.047-5.562 3.273-.286q.377-.032.737.004zm-3.632-2.988.816.67 3.5-4.81-3.283.287zM27 21.667h-1.471a3.67 3.67 0 0 0-3.196-2.652V17H27zm-5 2.666A1.667 1.667 0 1 1 22 21a1.667 1.667 0 0 1 0 3.333M22.333 15h4.049l-2.333-4.667h-1.716zM13 22.667a1.667 1.667 0 1 0-3.333 0 1.667 1.667 0 0 0 3.333 0"/></svg></template>
+<script setup lang="ts">
+/**
+ * MixerTruck32 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MixerTruck48/MixerTruck48.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M4.65 17.556a1.5 1.5 0 0 1-.495-1.547l2.07-7.727a1.5 1.5 0 0 1 1.319-1.106l12.86-1.122c4.067-.354 7.546 2.046 8.957 5.438q.043.083.07.172a8.77 8.77 0 0 1 .295 5.503l-.647 2.415-.647 2.415a8.3 8.3 0 0 1-1.135 2.503H30.5V14a1.5 1.5 0 0 1 1.5-1.5h5a1.5 1.5 0 0 1 1.342.83l5 10a1.5 1.5 0 0 1 .158.67v10a1.5 1.5 0 0 1-1.5 1.5h-3.707a5.502 5.502 0 0 1-10.586 0h-5.414a5.502 5.502 0 0 1-10.586 0H8A1.5 1.5 0 0 1 6.5 34v-8A1.5 1.5 0 0 1 8 24.5h5.092zM17.295 27.5H9.5v5h2.207a5.503 5.503 0 0 1 10.586 0h5.414a5.51 5.51 0 0 1 2.793-3.4v-1.6h-6.907a8.25 8.25 0 0 1-6.299 0m6.318-17.953a5.9 5.9 0 0 1 2.995 3.138l-9.175 11.481a6 6 0 0 1-.322-.245l-3.007-2.474zm-2.144-.52a6 6 0 0 0-.803.016l-4.58.4-6.206 8.53 2.679 2.203zM8.85 10.072l4.594-.4L8.332 16.7l-1.03-.847zM25.535 21.22c-.764 2.848-3.599 4.355-6.212 3.783l7.685-9.616q-.045.498-.18 1.003l-.647 2.415zM40.5 32.5h-2.207a5.5 5.5 0 0 0-4.793-3.977V25.5h7zm-7-10h6.073l-3.5-7H33.5zm-19 11.502a2.5 2.5 0 1 0 5 0 2.5 2.5 0 0 0-5-.002zM33 31.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5"/></svg></template>
+<script setup lang="ts">
+/**
+ * MixerTruck48 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MixerTruck64/MixerTruck64.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64px" height="64px"><path fill-rule="evenodd" d="M6.519 23.02a1.5 1.5 0 0 1-.496-1.546l2.76-10.303a1.5 1.5 0 0 1 1.32-1.106L27.25 8.57c5.021-.438 9.341 2.415 11.25 6.52q.045.029.088.064a1 1 0 0 1 .348 1.016c.7 2.028.831 4.296.216 6.59l-.862 3.219-.863 3.22a10.5 10.5 0 0 1-2.028 3.967h5.768v-14.5a1.5 1.5 0 0 1 1.5-1.5h6.666a1.5 1.5 0 0 1 1.342.83l6.667 13.333a1.5 1.5 0 0 1 .158.67v13.334a1.5 1.5 0 0 1-1.5 1.5h-5.332a6.836 6.836 0 0 1-13.336 0h-7.997a6.836 6.836 0 0 1-13.336 0h-5.332a1.5 1.5 0 0 1-1.5-1.5V34.666a1.5 1.5 0 0 1 1.5-1.5h8.184l-8.58-7.059a1 1 0 0 1-.472-.388zM23.16 36.167H12.167v7.667h3.832a6.836 6.836 0 0 1 13.336 0h7.997a6.85 6.85 0 0 1 3.835-4.72v-2.947h-9.81c-2.554 1.073-5.515 1.147-8.196 0m7.538-3h-.032v.017a7.55 7.55 0 0 1-5.597.489l11.46-14.34a8.3 8.3 0 0 1-.275 2.65l-.863 3.22-.863 3.22a7.43 7.43 0 0 1-3.83 4.744m-14.01-5.663-4.069-3.347 8.778-12.065 6.112-.533a8.4 8.4 0 0 1 1.885.046zm-5.28-14.54 7.348-.641-7.684 10.56-1.902-1.564zm20.082-.778a8.38 8.38 0 0 1 4.486 4.635L23.207 32.8a8 8 0 0 1-.71-.52l-4.263-3.506zM54.5 43.833h-3.833a6.836 6.836 0 0 0-6.501-5.331V33.5H54.5zM44 49.166A3.833 3.833 0 1 1 44 41.5a3.833 3.833 0 0 1 0 7.666m.166-18.666h9.406l-5.167-10.334h-4.24zM26.5 45.333a3.833 3.833 0 1 0-7.667 0 3.833 3.833 0 0 0 7.667 0"/></svg></template>
+<script setup lang="ts">
+/**
+ * MixerTruck64 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Modular20/Modular20.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M1.75 4.167a.75.75 0 0 1 .75-.75h3.75a.75.75 0 0 1 .67 1.085c-.082.166-.124.643.105 1.1.194.388.569.731 1.308.731s1.115-.343 1.309-.731c.228-.457.187-.934.104-1.1a.75.75 0 0 1 .67-1.085h3.75a.75.75 0 0 1 .75.75v3.16c.435-.073.92-.088 1.387.012.489.105.996.345 1.377.816.38.47.57 1.094.57 1.845s-.19 1.374-.57 1.845-.888.71-1.377.815c-.467.1-.952.086-1.386.013v3.16a.75.75 0 0 1-.75.75h-3.75a.75.75 0 0 1-.671-1.085c.083-.166.124-.643-.104-1.1-.194-.388-.57-.731-1.309-.731s-1.114.343-1.308.73c-.229.458-.187.935-.104 1.1a.75.75 0 0 1-.671 1.086H2.5a.75.75 0 0 1-.75-.75v-3.75a.75.75 0 0 1 1.085-.67c.166.082.643.124 1.1-.105.388-.194.732-.569.732-1.308s-.344-1.115-.732-1.309c-.457-.228-.934-.186-1.1-.104a.75.75 0 0 1-1.085-.67zm1.5.75V7.02c.455.006.932.117 1.356.329.863.431 1.56 1.306 1.56 2.65s-.697 2.219-1.56 2.65a3.2 3.2 0 0 1-1.356.328v2.105h2.105c.006-.455.116-.932.328-1.356.432-.862 1.306-1.56 2.65-1.56s2.22.698 2.65 1.56c.212.424.323.901.329 1.356h2.105v-3.416a.75.75 0 0 1 1.085-.671c.303.151.962.31 1.487.198.24-.052.41-.15.524-.292.114-.14.237-.403.237-.902 0-.5-.123-.762-.237-.902-.114-.142-.284-.24-.524-.292-.525-.112-1.184.046-1.487.198a.75.75 0 0 1-1.085-.67V4.916h-2.105a3.2 3.2 0 0 1-.329 1.356c-.43.862-1.306 1.56-2.65 1.56s-2.218-.698-2.65-1.56a3.2 3.2 0 0 1-.328-1.356z"/></svg></template>
+<script setup lang="ts">
+/**
+ * Modular20 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Modular24/Modular24.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M2 5a1 1 0 0 1 1-1h4.5a1 1 0 0 1 .894 1.447c-.082.165-.138.704.125 1.23.217.434.634.823 1.481.823s1.264-.389 1.48-.822c.264-.527.208-1.066.126-1.23A1 1 0 0 1 12.5 4H17a1 1 0 0 1 1 1v3.675a4.5 4.5 0 0 1 1.585.035c.602.129 1.234.426 1.708 1.013.475.587.707 1.36.707 2.277 0 .918-.232 1.69-.707 2.277-.474.587-1.106.884-1.709 1.013a4.5 4.5 0 0 1-1.584.035V19a1 1 0 0 1-1 1h-4.5a1 1 0 0 1-.894-1.447c.082-.165.138-.704-.125-1.23-.217-.434-.634-.823-1.481-.823s-1.264.389-1.48.822c-.264.527-.208 1.066-.126 1.23A1 1 0 0 1 7.5 20H3a1 1 0 0 1-1-1v-4.5a1 1 0 0 1 1.447-.894c.165.082.704.138 1.23-.125.434-.217.823-.634.823-1.481s-.389-1.264-.822-1.48c-.527-.264-1.066-.208-1.23-.126A1 1 0 0 1 2 9.5zm2 1v2.329a3.9 3.9 0 0 1 1.572.402C6.64 9.264 7.5 10.347 7.5 12s-.861 2.736-1.928 3.27c-.49.244-1.04.38-1.572.401V18h2.329a3.9 3.9 0 0 1 .402-1.572C7.264 15.36 8.347 14.5 10 14.5s2.736.861 3.27 1.928c.244.49.38 1.04.401 1.572H16v-4a1 1 0 0 1 1.447-.894c.349.174 1.116.358 1.718.229.273-.059.454-.168.573-.315S20 12.582 20 12s-.143-.873-.262-1.02-.3-.256-.572-.315c-.603-.129-1.37.055-1.719.23A1 1 0 0 1 16 10V6h-2.329a3.9 3.9 0 0 1-.402 1.572C12.736 8.64 11.653 9.5 10 9.5s-2.736-.861-3.27-1.928A3.9 3.9 0 0 1 6.33 6z"/></svg></template>
+<script setup lang="ts">
+/**
+ * Modular24 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Modular32/Modular32.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M3 6.667a1 1 0 0 1 1-1h6a1 1 0 0 1 .894 1.447c-.166.332-.221 1.162.167 1.939.342.683 1.009 1.28 2.272 1.28 1.264 0 1.93-.597 2.273-1.28.388-.777.332-1.607.166-1.94a1 1 0 0 1 .895-1.447h6a1 1 0 0 1 1 1v5.296c.73-.147 1.573-.195 2.376-.023.748.16 1.516.525 2.089 1.234.574.71.868 1.66.868 2.827s-.294 2.117-.868 2.827c-.574.708-1.34 1.074-2.09 1.234-.802.172-1.645.124-2.375-.024v5.296a1 1 0 0 1-1 1h-6a1 1 0 0 1-.895-1.447c.166-.332.222-1.163-.166-1.939-.342-.684-1.01-1.28-2.273-1.28s-1.93.596-2.272 1.28c-.388.776-.333 1.607-.167 1.939A1 1 0 0 1 10 26.333H4a1 1 0 0 1-1-1v-6a1 1 0 0 1 1.447-.894c.332.166 1.163.221 1.94-.167.683-.342 1.28-1.009 1.28-2.272 0-1.264-.597-1.93-1.28-2.272-.777-.389-1.608-.333-1.94-.167A1 1 0 0 1 3 12.666zm2 1v3.77a4.85 4.85 0 0 1 2.28.502c1.317.658 2.387 1.991 2.387 4.06s-1.07 3.404-2.386 4.062A4.85 4.85 0 0 1 5 20.563v3.77h3.77a4.85 4.85 0 0 1 .502-2.28c.658-1.317 1.992-2.387 4.061-2.387s3.403 1.07 4.061 2.387c.359.716.526 1.529.503 2.28h3.77v-5.666a1 1 0 0 1 1.447-.895c.515.258 1.616.525 2.51.333q.626-.133.953-.536c.217-.27.423-.737.423-1.57 0-.832-.206-1.3-.423-1.568q-.327-.403-.953-.537c-.894-.191-1.995.076-2.51.334a1 1 0 0 1-1.447-.895V7.667h-3.77a4.85 4.85 0 0 1-.503 2.28c-.658 1.317-1.99 2.386-4.06 2.386s-3.404-1.07-4.062-2.386a4.85 4.85 0 0 1-.502-2.28z"/></svg></template>
+<script setup lang="ts">
+/**
+ * Modular32 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Modular48/Modular48.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M4.5 10A1.5 1.5 0 0 1 6 8.5h9a1.5 1.5 0 0 1 1.342 2.17c-.25.499-.333 1.745.25 2.91.512 1.024 1.513 1.92 3.408 1.92s2.896-.895 3.408-1.92c.583-1.165.5-2.411.25-2.91A1.5 1.5 0 0 1 25 8.5h9a1.5 1.5 0 0 1 1.5 1.5v7.944c1.095-.221 2.36-.294 3.564-.036 1.123.24 2.274.788 3.134 1.852S43.5 22.249 43.5 24s-.441 3.175-1.302 4.24c-.86 1.064-2.01 1.611-3.134 1.852-1.205.258-2.469.185-3.564-.036V38a1.5 1.5 0 0 1-1.5 1.5h-9a1.5 1.5 0 0 1-1.342-2.17c.25-.499.333-1.745-.25-2.91-.512-1.025-1.513-1.92-3.408-1.92s-2.896.896-3.408 1.92c-.583 1.165-.5 2.411-.25 2.91A1.5 1.5 0 0 1 15 39.5H6A1.5 1.5 0 0 1 4.5 38v-9a1.5 1.5 0 0 1 2.17-1.342c.499.25 1.745.333 2.91-.25 1.024-.512 1.92-1.513 1.92-3.408s-.895-2.896-1.92-3.408c-1.165-.583-2.411-.5-2.91-.25A1.5 1.5 0 0 1 4.5 19zm3 1.5v5.655a7.3 7.3 0 0 1 3.42.753c1.976.988 3.58 2.987 3.58 6.092s-1.604 5.104-3.58 6.092a7.3 7.3 0 0 1-3.42.754V36.5h5.655a7.3 7.3 0 0 1 .753-3.42c.988-1.975 2.987-3.58 6.092-3.58s5.104 1.605 6.092 3.58a7.3 7.3 0 0 1 .754 3.42H32.5V28a1.5 1.5 0 0 1 2.17-1.342c.774.387 2.425.788 3.766.5.627-.134 1.101-.399 1.429-.804.326-.404.635-1.105.635-2.354s-.309-1.95-.635-2.354c-.328-.405-.802-.67-1.43-.804-1.34-.288-2.991.113-3.764.5A1.5 1.5 0 0 1 32.5 20v-8.5h-5.654a7.3 7.3 0 0 1-.754 3.42c-.988 1.975-2.987 3.58-6.092 3.58s-5.104-1.604-6.092-3.58a7.3 7.3 0 0 1-.753-3.42z"/></svg></template>
+<script setup lang="ts">
+/**
+ * Modular48 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Modular64/Modular64.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64px" height="64px"><path fill-rule="evenodd" d="M6.5 13.334a1.5 1.5 0 0 1 1.5-1.5h12a1.5 1.5 0 0 1 1.342 2.17c-.416.832-.5 2.66.333 4.325.763 1.526 2.263 2.838 4.992 2.838s4.229-1.312 4.991-2.838c.833-1.664.75-3.493.334-4.325a1.5 1.5 0 0 1 1.341-2.17h12a1.5 1.5 0 0 1 1.5 1.5V24.55c1.526-.382 3.393-.56 5.148-.184 1.415.303 2.836.986 3.894 2.294 1.059 1.31 1.625 3.088 1.625 5.34 0 2.25-.566 4.028-1.625 5.338-1.058 1.308-2.48 1.991-3.894 2.295-1.755.376-3.622.197-5.148-.184v11.217a1.5 1.5 0 0 1-1.5 1.5h-12a1.5 1.5 0 0 1-1.341-2.171c.415-.831.499-2.66-.334-4.325-.762-1.525-2.263-2.837-4.991-2.837-2.729 0-4.23 1.312-4.992 2.837-.832 1.664-.749 3.494-.333 4.325A1.5 1.5 0 0 1 20 52.166H8a1.5 1.5 0 0 1-1.5-1.5v-12a1.5 1.5 0 0 1 2.17-1.34c.832.415 2.661.498 4.326-.334 1.525-.763 2.837-2.263 2.837-4.992s-1.312-4.229-2.837-4.991c-1.665-.833-3.494-.75-4.325-.334A1.5 1.5 0 0 1 6.5 25.333zm3 1.5v8.571c1.544-.148 3.3.151 4.838.92 2.474 1.238 4.495 3.737 4.495 7.675s-2.02 6.438-4.495 7.675c-1.539.77-3.294 1.068-4.838.92v8.572h8.572c-.148-1.544.15-3.3.92-4.838 1.237-2.474 3.737-4.495 7.675-4.495s6.437 2.02 7.675 4.495c.769 1.538 1.067 3.294.92 4.838h8.571V37.334a1.5 1.5 0 0 1 2.171-1.342c1.107.553 3.424 1.12 5.348.708.92-.197 1.664-.597 2.19-1.247.524-.649.958-1.704.958-3.453s-.434-2.804-.958-3.453c-.526-.65-1.27-1.05-2.19-1.247-1.924-.412-4.241.155-5.348.708a1.5 1.5 0 0 1-2.17-1.341V14.834h-8.572c.147 1.543-.151 3.299-.92 4.837-1.238 2.475-3.737 4.496-7.675 4.496s-6.438-2.021-7.675-4.496c-.77-1.538-1.068-3.294-.92-4.837z"/></svg></template>
+<script setup lang="ts">
+/**
+ * Modular64 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/More20/More20.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M10.75 4.167a.75.75 0 0 0-1.5 0V9.25H4.167a.75.75 0 1 0 0 1.5H9.25v5.083a.75.75 0 1 0 1.5 0V10.75h5.084a.75.75 0 1 0 0-1.5H10.75z"/></svg></template>
+<script setup lang="ts">
+/**
+ * More20 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/More24/More24.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M13 5a1 1 0 1 0-2 0v6H5a1 1 0 1 0 0 2h6v6a1 1 0 1 0 2 0v-6h6a1 1 0 1 0 0-2h-6z"/></svg></template>
+<script setup lang="ts">
+/**
+ * More24 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/More32/More32.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M17 6.667a1 1 0 1 0-2 0V15H6.667a1 1 0 0 0 0 2H15v8.333a1 1 0 1 0 2 0V17h8.334a1 1 0 0 0 0-2H17z"/></svg></template>
+<script setup lang="ts">
+/**
+ * More32 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/More48/More48.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M25.5 10a1.5 1.5 0 0 0-3 0v12.5H10a1.5 1.5 0 0 0 0 3h12.5V38a1.5 1.5 0 0 0 3 0V25.5H38a1.5 1.5 0 0 0 0-3H25.5z"/></svg></template>
+<script setup lang="ts">
+/**
+ * More48 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/More64/More64.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64px" height="64px"><path fill-rule="evenodd" d="M33.5 13.334a1.5 1.5 0 0 0-3 0V30.5H13.333a1.5 1.5 0 1 0 0 3H30.5v17.167a1.5 1.5 0 1 0 3 0V33.5h17.166a1.5 1.5 0 1 0 0-3H33.5z"/></svg></template>
+<script setup lang="ts">
+/**
+ * More64 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MoreCircle20/MoreCircle20.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M3.25 10a6.75 6.75 0 1 1 13.5 0 6.75 6.75 0 0 1-13.5 0M10 1.75a8.25 8.25 0 1 0 0 16.5 8.25 8.25 0 0 0 0-16.5m.75 4.917a.75.75 0 0 0-1.5 0V9.25H6.667a.75.75 0 1 0 0 1.5H9.25v2.583a.75.75 0 0 0 1.5 0V10.75h2.583a.75.75 0 0 0 0-1.5H10.75z"/></svg></template>
+<script setup lang="ts">
+/**
+ * MoreCircle20 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MoreCircle24/MoreCircle24.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0m8-10C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2m1 6a1 1 0 1 0-2 0v3H8a1 1 0 1 0 0 2h3v3a1 1 0 1 0 2 0v-3h3a1 1 0 1 0 0-2h-3z"/></svg></template>
+<script setup lang="ts">
+/**
+ * MoreCircle24 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MoreCircle32/MoreCircle32.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M5 16C5 9.925 9.925 5 16 5s11 4.925 11 11-4.925 11-11 11S5 22.075 5 16M16 3C8.82 3 3 8.82 3 16s5.82 13 13 13 13-5.82 13-13S23.18 3 16 3m1 7.667a1 1 0 1 0-2 0V15h-4.333a1 1 0 1 0 0 2H15v4.333a1 1 0 1 0 2 0V17h4.333a1 1 0 1 0 0-2H17z"/></svg></template>
+<script setup lang="ts">
+/**
+ * MoreCircle32 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MoreCircle48/MoreCircle48.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M7.5 24c0-9.113 7.387-16.5 16.5-16.5S40.5 14.887 40.5 24 33.113 40.5 24 40.5 7.5 33.113 7.5 24M24 4.5C13.23 4.5 4.5 13.23 4.5 24S13.23 43.5 24 43.5 43.5 34.77 43.5 24 34.77 4.5 24 4.5M25.5 16a1.5 1.5 0 0 0-3 0v6.5H16a1.5 1.5 0 0 0 0 3h6.5V32a1.5 1.5 0 0 0 3 0v-6.5H32a1.5 1.5 0 0 0 0-3h-6.5z"/></svg></template>
+<script setup lang="ts">
+/**
+ * MoreCircle48 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/MoreCircle64/MoreCircle64.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64px" height="64px"><path fill-rule="evenodd" d="M9.5 32C9.5 19.574 19.574 9.5 32 9.5S54.5 19.574 54.5 32 44.426 54.5 32 54.5 9.5 44.426 9.5 32M32 6.5C17.917 6.5 6.5 17.917 6.5 32S17.917 57.5 32 57.5 57.5 46.083 57.5 32 46.083 6.5 32 6.5m1.5 14.833a1.5 1.5 0 0 0-3 0V30.5h-9.167a1.5 1.5 0 0 0 0 3H30.5v9.167a1.5 1.5 0 0 0 3 0V33.5h9.167a1.5 1.5 0 0 0 0-3H33.5z"/></svg></template>
+<script setup lang="ts">
+/**
+ * MoreCircle64 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Music20/Music20.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M16.254 1.879a.75.75 0 0 1 .33.621v10a2.417 2.417 0 1 1-1.5-2.237V6.941L8.25 9.674v6.16a2.417 2.417 0 1 1-1.5-2.237V5.833a.75.75 0 0 1 .472-.696l8.333-3.333a.75.75 0 0 1 .7.075M8.25 8.059l6.834-2.733V3.608L8.25 6.34zm5.917 3.524a.917.917 0 1 1 0 1.834.917.917 0 0 1 0-1.834m-8.333 3.334a.917.917 0 1 1 0 1.833.917.917 0 0 1 0-1.833"/></svg></template>
+<script setup lang="ts">
+/**
+ * Music20 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>

package/src/components/Music24/Music24.vue

@@ -0,0 +1,17 @@
+<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M19.56 2.172A1 1 0 0 1 20 3v12a3 3 0 1 1-2-2.83V8.478l-8 3.2V19a3 3 0 1 1-2-2.83V7a1 1 0 0 1 .629-.928l10-4a1 1 0 0 1 .932.1M10 9.523l8-3.2V4.477l-8 3.2zM17 14a1 1 0 1 1 0 2 1 1 0 0 1 0-2M7 18a1 1 0 1 1 0 2 1 1 0 0 1 0-2"/></svg></template>
+<script setup lang="ts">
+/**
+ * Music24 is an SVG icon wrapped in a Vue component to make it easier to use.
+ */
+withDefaults(
+  defineProps<{
+    /**
+     * Define the color of the icon.
+     */
+    color?: string;
+  }>(),
+  {
+    color: 'currentColor',
+  },
+);
+</script>