@namelivia/vue-components 4.4.5 → 4.5.1

package/dist/index.js

@@ -2,7 +2,7 @@
 
 var vue = require('vue');
 
-var script$w = vue.defineComponent({
+var script$B = vue.defineComponent({
   name: 'SectionTitle',
   props: {
     text: {
@@ -12,10 +12,10 @@ var script$w = vue.defineComponent({
   }
 });
 
-const _hoisted_1$s = { class: "section-title" };
+const _hoisted_1$x = { class: "section-title" };
 
-function render$w(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("h1", _hoisted_1$s, vue.toDisplayString(_ctx.text), 1 /* TEXT */))
+function render$B(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("h1", _hoisted_1$x, vue.toDisplayString(_ctx.text), 1 /* TEXT */))
 }
 
 function styleInject(css, ref) {
@@ -48,18 +48,18 @@ function styleInject(css, ref) {
 var css_248z$w = "\n.section-title[data-v-0375af86] {\n  text-align: center;\n  font-size: var(--font-size-xlarge);\n  line-height: 1.5;\n}\n";
 styleInject(css_248z$w);
 
-script$w.render = render$w;
-script$w.__scopeId = "data-v-0375af86";
-script$w.__file = "src/SectionTitle/SectionTitle.vue";
+script$B.render = render$B;
+script$B.__scopeId = "data-v-0375af86";
+script$B.__file = "src/SectionTitle/SectionTitle.vue";
 
-var script$v = vue.defineComponent({
+var script$A = vue.defineComponent({
   name: "Loading",
   props: {
     text: String,
   },
 });
 
-function render$v(_ctx, _cache, $props, $setup, $data, $options) {
+function render$A(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("div", null, _cache[0] || (_cache[0] = [
     vue.createStaticVNode("<h1 class=\"loading-text\" data-v-7a9a3040>Loading...</h1><div class=\"loading-balls-container\" data-v-7a9a3040><div class=\"loading-ball blue\" data-v-7a9a3040></div><div class=\"loading-ball green\" data-v-7a9a3040></div><div class=\"loading-ball red\" data-v-7a9a3040></div></div>", 2)
   ])))
@@ -68,11 +68,11 @@ function render$v(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$v = "\n.loading-text[data-v-7a9a3040] {\n  text-align: center;\n  font-size: var(--font-size-large);\n  line-height: 1.75rem;\n}\n.loading-balls-container[data-v-7a9a3040] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.5rem;\n  animation: bounce-7a9a3040 1.5s infinite ease-in-out;\n}\n.loading-ball[data-v-7a9a3040] {\n  width: 2rem;\n  height: 2rem;\n  border-radius: var(--border-radius-round);\n}\n.loading-ball.blue[data-v-7a9a3040] {\n  background-color: var(--color-loading-ball-blue);\n}\n.loading-ball.green[data-v-7a9a3040] {\n  background-color: var(--color-loading-ball-green);\n}\n.loading-ball.red[data-v-7a9a3040] {\n  background-color: var(--color-loading-ball-red);\n}\n@keyframes bounce-7a9a3040 {\n0%, 100% {\n    transform: translateY(0);\n}\n50% {\n    transform: translateY(-1rem);\n}\n}\n";
 styleInject(css_248z$v);
 
-script$v.render = render$v;
-script$v.__scopeId = "data-v-7a9a3040";
-script$v.__file = "src/Loading/Loading.vue";
+script$A.render = render$A;
+script$A.__scopeId = "data-v-7a9a3040";
+script$A.__file = "src/Loading/Loading.vue";
 
-var script$u = vue.defineComponent({
+var script$z = vue.defineComponent({
   name: "CardImage",
   props: {
     src: String,
@@ -94,36 +94,36 @@ var script$u = vue.defineComponent({
   },
 });
 
-const _hoisted_1$r = ["src", "alt"];
+const _hoisted_1$w = ["src", "alt"];
 
-function render$u(_ctx, _cache, $props, $setup, $data, $options) {
+function render$z(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("img", {
     src: _ctx.src,
     alt: _ctx.alt,
     ref: "image"
-  }, null, 8 /* PROPS */, _hoisted_1$r))
+  }, null, 8 /* PROPS */, _hoisted_1$w))
 }
 
 var css_248z$u = "\nimg[data-v-5fa6a3f6] {\n      width: 100%;\n}\n";
 styleInject(css_248z$u);
 
-script$u.render = render$u;
-script$u.__scopeId = "data-v-5fa6a3f6";
-script$u.__file = "src/Card/CardImage.vue";
+script$z.render = render$z;
+script$z.__scopeId = "data-v-5fa6a3f6";
+script$z.__file = "src/Card/CardImage.vue";
 
-var script$t = vue.defineComponent({
+var script$y = vue.defineComponent({
   name: "CardBody",
   props: {
     title: String,
   },
 });
 
-const _hoisted_1$q = { class: "card-body" };
+const _hoisted_1$v = { class: "card-body" };
 const _hoisted_2$g = { class: "card-title" };
 const _hoisted_3$a = { class: "card-text" };
 
-function render$t(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [
+function render$y(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$v, [
     vue.createElementVNode("div", _hoisted_2$g, vue.toDisplayString(_ctx.title), 1 /* TEXT */),
     vue.createElementVNode("p", _hoisted_3$a, [
       vue.renderSlot(_ctx.$slots, "default")
@@ -134,11 +134,11 @@ function render$t(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$t = "\n.card-body[data-v-c140cd30] {\n  padding: var(--card-body-padding);\n}\n.card-title[data-v-c140cd30] {\n  font-weight: var(--font-weight-bold);\n  font-size: var(--font-size-large);\n  margin-bottom: var(--card-title-margin-bottom);\n}\n.card-text[data-v-c140cd30] {\n  color: var(--color-card-text);\n  font-size: var(--font-size-base);\n}\n";
 styleInject(css_248z$t);
 
-script$t.render = render$t;
-script$t.__scopeId = "data-v-c140cd30";
-script$t.__file = "src/Card/CardBody.vue";
+script$y.render = render$y;
+script$y.__scopeId = "data-v-c140cd30";
+script$y.__file = "src/Card/CardBody.vue";
 
-var script$s = vue.defineComponent({
+var script$x = vue.defineComponent({
   name: "Card",
   props: {
     image: String,
@@ -149,24 +149,24 @@ var script$s = vue.defineComponent({
     },
   },
   components: {
-    CardImage: script$u,
-    CardBody: script$t,
+    CardImage: script$z,
+    CardBody: script$y,
   },
   emits: ['width']
 });
 
-const _hoisted_1$p = {
+const _hoisted_1$u = {
   key: 0,
   class: "card-container"
 };
 const _hoisted_2$f = { class: "card" };
 
-function render$s(_ctx, _cache, $props, $setup, $data, $options) {
+function render$x(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_card_image = vue.resolveComponent("card-image");
   const _component_card_body = vue.resolveComponent("card-body");
 
   return (!_ctx.dismissed)
-    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$p, [
+    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$u, [
         vue.createElementVNode("div", _hoisted_2$f, [
           vue.createVNode(_component_card_image, {
             src: _ctx.image,
@@ -187,18 +187,18 @@ function render$s(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$s = "\n.card-container[data-v-da3858b4] {\n  margin: var(--card-margin);\n}\n.card[data-v-da3858b4] {\n  max-width: var(--card-max-width);\n  border-radius: var(--border-radius-big);\n  overflow: hidden;\n  box-shadow: var(--card-shadow);\n}\n";
 styleInject(css_248z$s);
 
-script$s.render = render$s;
-script$s.__scopeId = "data-v-da3858b4";
-script$s.__file = "src/Card/Card.vue";
+script$x.render = render$x;
+script$x.__scopeId = "data-v-da3858b4";
+script$x.__file = "src/Card/Card.vue";
 
-var script$r = vue.defineComponent({
+var script$w = vue.defineComponent({
   name: "CardGrid"
 });
 
-const _hoisted_1$o = { class: "card-grid" };
+const _hoisted_1$t = { class: "card-grid" };
 
-function render$r(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$o, [
+function render$w(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$t, [
     vue.renderSlot(_ctx.$slots, "default")
   ]))
 }
@@ -206,18 +206,18 @@ function render$r(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$r = "\n.card-grid[data-v-ad060034] {\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  align-content: center;\n}\n@media (min-width: 1024px) {\n.card-grid[data-v-ad060034] {\n    justify-content: space-between;\n}\n}\n";
 styleInject(css_248z$r);
 
-script$r.render = render$r;
-script$r.__scopeId = "data-v-ad060034";
-script$r.__file = "src/CardGrid/CardGrid.vue";
+script$w.render = render$w;
+script$w.__scopeId = "data-v-ad060034";
+script$w.__file = "src/CardGrid/CardGrid.vue";
 
-var script$q = vue.defineComponent({
+var script$v = vue.defineComponent({
   name: "Container"
 });
 
-const _hoisted_1$n = { class: "container" };
+const _hoisted_1$s = { class: "container" };
 
-function render$q(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$n, [
+function render$v(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$s, [
     vue.renderSlot(_ctx.$slots, "default")
   ]))
 }
@@ -225,11 +225,11 @@ function render$q(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$q = "\n.container[data-v-7cccf06a] {\n  max-width: var(--container-max-width);\n  margin: var(--container-margin);\n}\n";
 styleInject(css_248z$q);
 
-script$q.render = render$q;
-script$q.__scopeId = "data-v-7cccf06a";
-script$q.__file = "src/Container/Container.vue";
+script$v.render = render$v;
+script$v.__scopeId = "data-v-7cccf06a";
+script$v.__file = "src/Container/Container.vue";
 
-var script$p = vue.defineComponent({
+var script$u = vue.defineComponent({
   name: "MobileNavigationLink",
   props: {
     text: {
@@ -255,27 +255,27 @@ var script$p = vue.defineComponent({
   },
 });
 
-const _hoisted_1$m = ["href"];
+const _hoisted_1$r = ["href"];
 
-function render$p(_ctx, _cache, $props, $setup, $data, $options) {
+function render$u(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("a", {
     href: _ctx.linkDestination,
     class: vue.normalizeClass(_ctx.linkClass),
     "aria-current": "page"
-  }, vue.toDisplayString(_ctx.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_1$m))
+  }, vue.toDisplayString(_ctx.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_1$r))
 }
 
 var css_248z$p = "\n.current-link[data-v-3e279546] {\n  background-color: var(--color-navbar-current-background);\n  color: var(--color-navbar-text);\n  display: block;\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  border-radius: 0.375rem;\n  font-size: var(--font-size-navbar);\n  text-decoration: none;\n  cursor: default;\n}\n.regular-link[data-v-3e279546] {\n  color: var(--color-navbar-text);\n  display: block;\n  padding: 0.5rem 0.75rem;\n  border-radius: 0.375rem;\n  font-size: var(--font-size-navbar);\n  transition: background-color 0.2s ease, color 0.2s ease;\n  text-decoration: none;\n}\n.regular-link[data-v-3e279546]:hover {\n  background-color: var(--color-navbar-link-background);\n}\n";
 styleInject(css_248z$p);
 
-script$p.render = render$p;
-script$p.__scopeId = "data-v-3e279546";
-script$p.__file = "src/Navbar/MobileNavigationLink.vue";
+script$u.render = render$u;
+script$u.__scopeId = "data-v-3e279546";
+script$u.__file = "src/Navbar/MobileNavigationLink.vue";
 
-var script$o = vue.defineComponent({
+var script$t = vue.defineComponent({
   name: "MobileNavigationLinks",
   components: {
-    MobileNavigationLink: script$p,
+    MobileNavigationLink: script$u,
   },
   props: {
     links: {
@@ -288,13 +288,13 @@ var script$o = vue.defineComponent({
   },
 });
 
-const _hoisted_1$l = {
+const _hoisted_1$q = {
   key: 0,
   id: "mobile-menu"
 };
 const _hoisted_2$e = { class: "menu-panel" };
 
-function render$o(_ctx, _cache, $props, $setup, $data, $options) {
+function render$t(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_mobile_navigation_link = vue.resolveComponent("mobile-navigation-link");
 
   return (vue.openBlock(), vue.createBlock(vue.Transition, {
@@ -307,7 +307,7 @@ function render$o(_ctx, _cache, $props, $setup, $data, $options) {
   }, {
     default: vue.withCtx(() => [
       (_ctx.open)
-        ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$l, [
+        ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [
             vue.createElementVNode("div", _hoisted_2$e, [
               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.links, (link) => {
                 return (vue.openBlock(), vue.createBlock(_component_mobile_navigation_link, {
@@ -328,11 +328,11 @@ function render$o(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$o = "\n.fade-scale-enter-active[data-v-eb1296c6],\n.fade-scale-leave-active[data-v-eb1296c6] {\n  transition: all 200ms ease;\n}\n.fade-scale-enter-from[data-v-eb1296c6],\n.fade-scale-leave-to[data-v-eb1296c6] {\n  transform: scaleY(0);\n  transform-origin: top;\n}\n.fade-scale-enter-to[data-v-eb1296c6],\n.fade-scale-leave-from[data-v-eb1296c6] {\n  transform: scaleY(1);\n  transform-origin: top;\n}\n#mobile-menu[data-v-eb1296c6] {\n  display: block;\n}\n.menu-panel[data-v-eb1296c6] {\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.75rem;\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  background-color: var(--color-navbar-background);\n}\n@media (min-width: 640px) {\n#mobile-menu[data-v-eb1296c6] {\n    display: none;\n}\n}\n";
 styleInject(css_248z$o);
 
-script$o.render = render$o;
-script$o.__scopeId = "data-v-eb1296c6";
-script$o.__file = "src/Navbar/MobileNavigationLinks.vue";
+script$t.render = render$t;
+script$t.__scopeId = "data-v-eb1296c6";
+script$t.__file = "src/Navbar/MobileNavigationLinks.vue";
 
-var script$n = vue.defineComponent({
+var script$s = vue.defineComponent({
   name: "NavigationLink",
   props: {
     text: {
@@ -358,27 +358,27 @@ var script$n = vue.defineComponent({
   },
 });
 
-const _hoisted_1$k = ["href"];
+const _hoisted_1$p = ["href"];
 
-function render$n(_ctx, _cache, $props, $setup, $data, $options) {
+function render$s(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("a", {
     href: _ctx.linkDestination,
     class: vue.normalizeClass(_ctx.linkClass),
     "aria-current": "page"
-  }, vue.toDisplayString(_ctx.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_1$k))
+  }, vue.toDisplayString(_ctx.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_1$p))
 }
 
 var css_248z$n = "\n.current-link[data-v-4989b384] {\n  background-color: var(--color-navbar-current-background);\n  color: var(--color-navbar-text);\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  border-radius: 0.375rem;\n  font-size: var(--font-size-navbar);\n  text-decoration: none;\n  cursor: default;\n}\n.regular-link[data-v-4989b384] {\n  color: var(--color-navbar-text);\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  border-radius: 0.375rem;\n  font-size: var(--font-size-navbar);\n  transition: background-color 0.2s ease, color 0.2s ease;\n  text-decoration: none;\n}\n.regular-link[data-v-4989b384]:hover {\n  background-color: var(--color-navbar-link-background);\n}\n";
 styleInject(css_248z$n);
 
-script$n.render = render$n;
-script$n.__scopeId = "data-v-4989b384";
-script$n.__file = "src/Navbar/NavigationLink.vue";
+script$s.render = render$s;
+script$s.__scopeId = "data-v-4989b384";
+script$s.__file = "src/Navbar/NavigationLink.vue";
 
-var script$m = vue.defineComponent({
+var script$r = vue.defineComponent({
   name: "NavigationLinks",
   components: {
-    NavigationLink: script$n,
+    NavigationLink: script$s,
   },
   props: {
     links: {
@@ -387,13 +387,13 @@ var script$m = vue.defineComponent({
   },
 });
 
-const _hoisted_1$j = { class: "links-container" };
+const _hoisted_1$o = { class: "links-container" };
 const _hoisted_2$d = { class: "links-wrapper" };
 
-function render$m(_ctx, _cache, $props, $setup, $data, $options) {
+function render$r(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_navigation_link = vue.resolveComponent("navigation-link");
 
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$j, [
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$o, [
     vue.createElementVNode("div", _hoisted_2$d, [
       (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.links, (link) => {
         return (vue.openBlock(), vue.createBlock(_component_navigation_link, {
@@ -410,11 +410,11 @@ function render$m(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$m = "\n.links-container[data-v-294f43c2] {\n  display: none;\n}\n.links-wrapper[data-v-294f43c2] {\n  display: flex;\n  gap: 1rem;\n}\n@media (min-width: 640px) {\n.links-container[data-v-294f43c2] {\n    display: block;\n    margin-left: 1.5rem;\n}\n}\n";
 styleInject(css_248z$m);
 
-script$m.render = render$m;
-script$m.__scopeId = "data-v-294f43c2";
-script$m.__file = "src/Navbar/NavigationLinks.vue";
+script$r.render = render$r;
+script$r.__scopeId = "data-v-294f43c2";
+script$r.__file = "src/Navbar/NavigationLinks.vue";
 
-var script$l = vue.defineComponent({
+var script$q = vue.defineComponent({
   name: "NavbarTitle",
   props: {
     href: {
@@ -432,11 +432,11 @@ var script$l = vue.defineComponent({
   }
 });
 
-const _hoisted_1$i = ["href"];
+const _hoisted_1$n = ["href"];
 const _hoisted_2$c = ["src", "alt"];
 const _hoisted_3$9 = ["src", "alt"];
 
-function render$l(_ctx, _cache, $props, $setup, $data, $options) {
+function render$q(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("a", {
     class: "title-container",
     href: _ctx.href
@@ -451,17 +451,17 @@ function render$l(_ctx, _cache, $props, $setup, $data, $options) {
       src: _ctx.imageBig,
       alt: _ctx.title
     }, null, 8 /* PROPS */, _hoisted_3$9)
-  ], 8 /* PROPS */, _hoisted_1$i))
+  ], 8 /* PROPS */, _hoisted_1$n))
 }
 
 var css_248z$l = "\n.title-container[data-v-661ef87c] {\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n}\n.logo-small[data-v-661ef87c] {\n  display: block;\n  height: 2rem;\n  width: auto;\n}\n.logo-big[data-v-661ef87c] {\n  display: none;\n  height: 2rem;\n  width: auto;\n}\n@media (min-width: 1024px) {\n.logo-small[data-v-661ef87c] {\n    display: none;\n}\n.logo-big[data-v-661ef87c] {\n    display: block;\n}\n}\n\n\n";
 styleInject(css_248z$l);
 
-script$l.render = render$l;
-script$l.__scopeId = "data-v-661ef87c";
-script$l.__file = "src/Navbar/NavbarTitle.vue";
+script$q.render = render$q;
+script$q.__scopeId = "data-v-661ef87c";
+script$q.__file = "src/Navbar/NavbarTitle.vue";
 
-var script$k = vue.defineComponent({
+var script$p = vue.defineComponent({
   name: "RightContent",
   props: {
     locale: {
@@ -484,11 +484,11 @@ var script$k = vue.defineComponent({
   },
 });
 
-const _hoisted_1$h = { class: "action-container" };
+const _hoisted_1$m = { class: "action-container" };
 const _hoisted_2$b = ["src", "alt"];
 
-function render$k(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$h, [
+function render$p(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$m, [
     vue.createElementVNode("img", {
       class: "circle-image",
       src: _ctx.currentUserPicture,
@@ -500,11 +500,11 @@ function render$k(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$k = "\n.action-container[data-v-07675a13] {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  display: flex;\n  align-items: center;\n  padding-right: 0.5rem;\n  color: var(--color-navbar-text);\n  font-size: var(--font-size-navbar);\n}\n.circle-image[data-v-07675a13] {\n  border-radius: 9999px;\n  padding: 0.25rem;\n  height: 50px;\n  width: 50px;\n}\n@media (min-width: 640px) {\n.action-container[data-v-07675a13] {\n    position: static;\n    top: auto;\n    bottom: auto;\n    right: auto;\n    margin-left: 1.5rem;\n    padding-right: 0;\n}\n}\n\n";
 styleInject(css_248z$k);
 
-script$k.render = render$k;
-script$k.__scopeId = "data-v-07675a13";
-script$k.__file = "src/Navbar/RightContent.vue";
+script$p.render = render$p;
+script$p.__scopeId = "data-v-07675a13";
+script$p.__file = "src/Navbar/RightContent.vue";
 
-var script$j = vue.defineComponent({
+var script$o = vue.defineComponent({
   name: "MobileMenuButton",
   props: {
     open: {
@@ -520,7 +520,7 @@ var script$j = vue.defineComponent({
   },
 });
 
-function render$j(_ctx, _cache, $props, $setup, $data, $options) {
+function render$o(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("button", {
     class: "menu-button",
     type: "button",
@@ -546,18 +546,18 @@ function render$j(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$j = "\n.menu-button[data-v-397545ee] {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0.5rem;\n  border-radius: var(--border-radius-big);\n  color: var(--color-navbar-text);\n  background-color: transparent;\n  transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;\n  border: none;\n  cursor: pointer;\n}\n.menu-icon[data-v-397545ee] {\n  display: block;\n  height: 1.5rem;\n  width: 1.5rem;\n}\n";
 styleInject(css_248z$j);
 
-script$j.render = render$j;
-script$j.__scopeId = "data-v-397545ee";
-script$j.__file = "src/Navbar/MobileMenuButton.vue";
+script$o.render = render$o;
+script$o.__scopeId = "data-v-397545ee";
+script$o.__file = "src/Navbar/MobileMenuButton.vue";
 
-var script$i = vue.defineComponent({
+var script$n = vue.defineComponent({
   name: "Navbar",
   components: {
-    NavbarTitle: script$l,
-    NavigationLinks: script$m,
-    MobileNavigationLinks: script$o,
-    RightContent: script$k,
-    MobileMenuButton: script$j,
+    NavbarTitle: script$q,
+    NavigationLinks: script$r,
+    MobileNavigationLinks: script$t,
+    RightContent: script$p,
+    MobileMenuButton: script$o,
   },
   data() {
     return {
@@ -597,20 +597,20 @@ var script$i = vue.defineComponent({
   }
 });
 
-const _hoisted_1$g = { class: "navbar" };
+const _hoisted_1$l = { class: "navbar" };
 const _hoisted_2$a = { class: "navbar-container" };
 const _hoisted_3$8 = { class: "flex-header" };
 const _hoisted_4$3 = { class: "menu-toggle" };
 const _hoisted_5$2 = { class: "title-container" };
 
-function render$i(_ctx, _cache, $props, $setup, $data, $options) {
+function render$n(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_mobile_menu_button = vue.resolveComponent("mobile-menu-button");
   const _component_navbar_title = vue.resolveComponent("navbar-title");
   const _component_navigation_links = vue.resolveComponent("navigation-links");
   const _component_right_content = vue.resolveComponent("right-content");
   const _component_mobile_navigation_links = vue.resolveComponent("mobile-navigation-links");
 
-  return (vue.openBlock(), vue.createElementBlock("nav", _hoisted_1$g, [
+  return (vue.openBlock(), vue.createElementBlock("nav", _hoisted_1$l, [
     vue.createElementVNode("div", _hoisted_2$a, [
       vue.createElementVNode("div", _hoisted_3$8, [
         vue.createElementVNode("div", _hoisted_4$3, [
@@ -646,18 +646,18 @@ function render$i(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$i = "\n.navbar[data-v-1b5caf34] {\n  background-color: var(--color-navbar-background);\n}\n.navbar-container[data-v-1b5caf34] {\n  max-width: 80rem;\n  margin-left: auto;\n  margin-right: auto;\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n}\n.flex-header[data-v-1b5caf34] {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  height: 4rem;\n}\n.menu-toggle[data-v-1b5caf34] {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  display: flex;\n  align-items: center;\n}\n.title-container[data-v-1b5caf34] {\n  flex: 1 1 0%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n@media (min-width: 640px) {\n.navbar-container[data-v-1b5caf34] {\n    padding-left: 1.5rem;\n    padding-right: 1.5rem;\n}\n.menu-toggle[data-v-1b5caf34] {\n    display: none;\n}\n.title-container[data-v-1b5caf34] {\n    align-items: stretch;\n    justify-content: flex-start;\n}\n}\n@media (min-width: 1024px) {\n.navbar-container[data-v-1b5caf34] {\n    padding-left: 2rem;\n    padding-right: 2rem;\n}\n}\n";
 styleInject(css_248z$i);
 
-script$i.render = render$i;
-script$i.__scopeId = "data-v-1b5caf34";
-script$i.__file = "src/Navbar/Navbar.vue";
+script$n.render = render$n;
+script$n.__scopeId = "data-v-1b5caf34";
+script$n.__file = "src/Navbar/Navbar.vue";
 
-var script$h = vue.defineComponent({
+var script$m = vue.defineComponent({
   name: "StyledTable",
 });
 
-const _hoisted_1$f = { class: "styled-table" };
+const _hoisted_1$k = { class: "styled-table" };
 
-function render$h(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("table", _hoisted_1$f, [
+function render$m(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("table", _hoisted_1$k, [
     vue.renderSlot(_ctx.$slots, "default")
   ]))
 }
@@ -665,11 +665,11 @@ function render$h(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$h = "\n.styled-table[data-v-8e6b2044] {\n  width: 100%;\n  border-collapse: collapse;\n}\n";
 styleInject(css_248z$h);
 
-script$h.render = render$h;
-script$h.__scopeId = "data-v-8e6b2044";
-script$h.__file = "src/StyledTable/StyledTable.vue";
+script$m.render = render$m;
+script$m.__scopeId = "data-v-8e6b2044";
+script$m.__file = "src/StyledTable/StyledTable.vue";
 
-var script$g = vue.defineComponent({
+var script$l = vue.defineComponent({
   name: "RegularButton",
   props: {
     text: String,
@@ -698,24 +698,24 @@ var script$g = vue.defineComponent({
   },
 });
 
-const _hoisted_1$e = ["disabled"];
+const _hoisted_1$j = ["disabled"];
 
-function render$g(_ctx, _cache, $props, $setup, $data, $options) {
+function render$l(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("button", {
     onClick: _cache[0] || (_cache[0] = (...args) => (_ctx.onClick && _ctx.onClick(...args))),
     class: vue.normalizeClass(_ctx.cssClass),
     disabled: _ctx.loading
-  }, vue.toDisplayString(_ctx.loading ? _ctx.textWhileLoading : _ctx.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_1$e))
+  }, vue.toDisplayString(_ctx.loading ? _ctx.textWhileLoading : _ctx.text), 11 /* TEXT, CLASS, PROPS */, _hoisted_1$j))
 }
 
 var css_248z$g = "\n.regular-button[data-v-7c962c54] {\n  background-color: var(--color-regular);\n  color: var(--color-regular-text);\n  font-weight: var(--font-weight-bold);\n  padding: var(--button-padding);\n  border-radius: var(--border-radius-base);\n  border: var(--button-border);\n  cursor: pointer;\n  transition: var(--button-transition);\n}\n.regular-button[data-v-7c962c54]:hover {\n  background-color: var(--color-regular-hover);\n}\n\n/* Loading state */\n.loading[data-v-7c962c54] {\n  background-color: var(--color-regular-disabled);\n  cursor: wait;\n}\n.loading[data-v-7c962c54]:hover {\n  background-color: var(--color-regular-disabled);\n}\n";
 styleInject(css_248z$g);
 
-script$g.render = render$g;
-script$g.__scopeId = "data-v-7c962c54";
-script$g.__file = "src/Buttons/RegularButton/RegularButton.vue";
+script$l.render = render$l;
+script$l.__scopeId = "data-v-7c962c54";
+script$l.__file = "src/Buttons/RegularButton/RegularButton.vue";
 
-var script$f = vue.defineComponent({
+var script$k = vue.defineComponent({
   name: "Pagination",
   props: {
     previousLabel: String,
@@ -725,18 +725,18 @@ var script$f = vue.defineComponent({
     nextLink: String,
   },
   components: {
-    RegularButton: script$g,
+    RegularButton: script$l,
   },
 });
 
-const _hoisted_1$d = { class: "pagination-container" };
+const _hoisted_1$i = { class: "pagination-container" };
 const _hoisted_2$9 = ["href"];
 const _hoisted_3$7 = ["href"];
 
-function render$f(_ctx, _cache, $props, $setup, $data, $options) {
+function render$k(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_regular_button = vue.resolveComponent("regular-button");
 
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$i, [
     (_ctx.showPrevious)
       ? (vue.openBlock(), vue.createElementBlock("a", {
           key: 0,
@@ -754,31 +754,31 @@ function render$f(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$f = "\n.pagination-container[data-v-265c87a6] {\n  display: flex;\n  justify-content: space-between;\n  margin-top: 1rem;\n}\na[data-v-265c87a6] {\n  text-decoration: none;\n}\n";
 styleInject(css_248z$f);
 
-script$f.render = render$f;
-script$f.__scopeId = "data-v-265c87a6";
-script$f.__file = "src/Pagination/Pagination.vue";
+script$k.render = render$k;
+script$k.__scopeId = "data-v-265c87a6";
+script$k.__file = "src/Pagination/Pagination.vue";
 
-var script$e = vue.defineComponent({
+var script$j = vue.defineComponent({
   name: "Badge",
   props: {
     text: String,
   },
 });
 
-const _hoisted_1$c = { class: "badge" };
+const _hoisted_1$h = { class: "badge" };
 
-function render$e(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$c, vue.toDisplayString(_ctx.text), 1 /* TEXT */))
+function render$j(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$h, vue.toDisplayString(_ctx.text), 1 /* TEXT */))
 }
 
 var css_248z$e = "\n.badge[data-v-187659a4] {\n  background-color: var(--color-badge);\n  color: var(--color-badge-text);\n  font-size: var(--font-size-small);\n  font-weight: var(--font-weight-bold);\n  margin-right: var(--badge-margin-right);\n  padding: var(--badge-padding);\n  border-radius: var(--badge-border-radius);\n  display: inline-block;\n}\n.dark .badge[data-v-187659a4] {\n  background-color: var(--color-badge-dark);\n  color: var(--color-badge-dark-text);\n}\n";
 styleInject(css_248z$e);
 
-script$e.render = render$e;
-script$e.__scopeId = "data-v-187659a4";
-script$e.__file = "src/Badge/Badge.vue";
+script$j.render = render$j;
+script$j.__scopeId = "data-v-187659a4";
+script$j.__file = "src/Badge/Badge.vue";
 
-var script$d = vue.defineComponent({
+var script$i = vue.defineComponent({
   name: "Temperature",
   props: {
     title: String,
@@ -799,15 +799,15 @@ var script$d = vue.defineComponent({
   },
 });
 
-const _hoisted_1$b = { class: "wrapper" };
+const _hoisted_1$g = { class: "wrapper" };
 const _hoisted_2$8 = { class: "title" };
 const _hoisted_3$6 = { class: "avg" };
 const _hoisted_4$2 = { class: "minmax" };
 const _hoisted_5$1 = { class: "min" };
 const _hoisted_6 = { class: "max" };
 
-function render$d(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
+function render$i(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$g, [
     vue.createElementVNode("div", _hoisted_2$8, vue.toDisplayString(_ctx.title), 1 /* TEXT */),
     vue.createElementVNode("div", _hoisted_3$6, vue.toDisplayString(_ctx.avgFormatted) + " ℃", 1 /* TEXT */),
     vue.createElementVNode("div", _hoisted_4$2, [
@@ -821,11 +821,11 @@ function render$d(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$d = "\n.wrapper[data-v-4250e6d0] {\n    flex-direction: column;\n    display: inline-flex;\n}\n.avg[data-v-4250e6d0] {\n    display: flex;\n    font-size: var(--font-size-xlarge);\n    justify-content: center;\n}\n.title[data-v-4250e6d0] {\n    display: flex;\n    font-size: var(--font-size-base);\n    justify-content: center;\n}\n.minmax[data-v-4250e6d0] {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    font-size: var(--font-size-base);\n}\n";
 styleInject(css_248z$d);
 
-script$d.render = render$d;
-script$d.__scopeId = "data-v-4250e6d0";
-script$d.__file = "src/Temperature/Temperature.vue";
+script$i.render = render$i;
+script$i.__scopeId = "data-v-4250e6d0";
+script$i.__file = "src/Temperature/Temperature.vue";
 
-var script$c = vue.defineComponent({
+var script$h = vue.defineComponent({
   name: "Modal",
   emits: ['cancel', 'confirm'],
   props: {
@@ -841,18 +841,18 @@ var script$c = vue.defineComponent({
   },
 });
 
-const _hoisted_1$a = {
+const _hoisted_1$f = {
   key: 0,
   class: "modal-overlay"
 };
 const _hoisted_2$7 = { class: "modal-container" };
 
-function render$c(_ctx, _cache, $props, $setup, $data, $options) {
+function render$h(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_secondary_button = vue.resolveComponent("secondary-button");
   const _component_danger_button = vue.resolveComponent("danger-button");
 
   return (_ctx.open)
-    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
+    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$f, [
         vue.createElementVNode("div", _hoisted_2$7, [
           _cache[0] || (_cache[0] = vue.createElementVNode("h1", { class: "modal-title" }, "Are you sure?", -1 /* HOISTED */)),
           vue.createVNode(_component_secondary_button, {
@@ -872,21 +872,21 @@ function render$c(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$c = "\n.modal-overlay[data-v-11d137c2] {\n  background-color: var(--color-modal-overlay);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n}\n.modal-container[data-v-11d137c2] {\n  background-color: var(--color-modal-background);\n  padding: 3.5rem 4rem;\n  border-radius: var(--border-radius-big);\n  text-align: center;\n}\n.modal-title[data-v-11d137c2] {\n  font-size: var(--font-size-large);\n  margin-bottom: 1rem;\n  font-weight: var(--font-weight-bold);\n  color: var(--color-modal-title);\n}\n";
 styleInject(css_248z$c);
 
-script$c.render = render$c;
-script$c.__scopeId = "data-v-11d137c2";
-script$c.__file = "src/Modal/Modal.vue";
+script$h.render = render$h;
+script$h.__scopeId = "data-v-11d137c2";
+script$h.__file = "src/Modal/Modal.vue";
 
-var script$b = vue.defineComponent({
+var script$g = vue.defineComponent({
   name: "Spinner",
 });
 
-const _hoisted_1$9 = {
+const _hoisted_1$e = {
   class: "spinner",
   role: "status"
 };
 
-function render$b(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, _cache[0] || (_cache[0] = [
+function render$g(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$e, _cache[0] || (_cache[0] = [
     vue.createElementVNode("span", { class: "sr-only-text" }, "Please wait...", -1 /* HOISTED */)
   ])))
 }
@@ -894,24 +894,24 @@ function render$b(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$b = "\n.spinner[data-v-3d456f9a] {\n  display: inline-block;\n  height: 2rem;\n  width: 2rem;\n  border: 4px solid currentColor;\n  border-right-color: transparent;\n  border-radius: var(--border-radius-round);\n  animation: spin-3d456f9a 1.5s linear infinite;\n}\n.sr-only-text[data-v-3d456f9a] {\n  position: absolute;\n  margin: -1px;\n  height: 1px;\n  width: 1px;\n  overflow: hidden;\n  white-space: nowrap;\n  border: 0;\n  padding: 0;\n  clip: rect(0, 0, 0, 0);\n}\n@keyframes spin-3d456f9a {\nfrom {\n    transform: rotate(0deg);\n}\nto {\n    transform: rotate(360deg);\n}\n}\n";
 styleInject(css_248z$b);
 
-script$b.render = render$b;
-script$b.__scopeId = "data-v-3d456f9a";
-script$b.__file = "src/Spinner/Spinner.vue";
+script$g.render = render$g;
+script$g.__scopeId = "data-v-3d456f9a";
+script$g.__file = "src/Spinner/Spinner.vue";
 
-var script$a = vue.defineComponent({
+var script$f = vue.defineComponent({
   name: "RangeView",
   props: {
     ranges: Array,
   },
 });
 
-const _hoisted_1$8 = { class: "ranges-editor" };
+const _hoisted_1$d = { class: "ranges-editor" };
 const _hoisted_2$6 = { class: "labels" };
 const _hoisted_3$5 = { class: "label" };
 const _hoisted_4$1 = { class: "label" };
 
-function render$a(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
+function render$f(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
     (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.ranges, (range, index) => {
       return (vue.openBlock(), vue.createElementBlock("div", {
         class: "range",
@@ -930,34 +930,34 @@ function render$a(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$a = "\n.ranges-editor[data-v-3e589c2c] {\n  display: flex;\n  flex-direction: row;\n  cursor: pointer;\n}\n.range[data-v-3e589c2c] {\n    min-width: 50px;\n    text-align: center;\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n}\n.labels[data-v-3e589c2c] {\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-end;\n}\n.gap[data-v-3e589c2c] {\n    height: 10px;\n    width: auto;\n    background-color: red;\n    border: 1px solid black;\n}\n.label[data-v-3e589c2c] {\n    margin-top: 5px;\n}\n";
 styleInject(css_248z$a);
 
-script$a.render = render$a;
-script$a.__scopeId = "data-v-3e589c2c";
-script$a.__file = "src/RangeView/RangeView.vue";
+script$f.render = render$f;
+script$f.__scopeId = "data-v-3e589c2c";
+script$f.__file = "src/RangeView/RangeView.vue";
 
-var script$9 = vue.defineComponent({
+var script$e = vue.defineComponent({
   name: "ResetButton",
   props: {
     text: String,
   },
 });
 
-const _hoisted_1$7 = {
+const _hoisted_1$c = {
   class: "reset-button",
   type: "reset"
 };
 
-function render$9(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("button", _hoisted_1$7, vue.toDisplayString(_ctx.text), 1 /* TEXT */))
+function render$e(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("button", _hoisted_1$c, vue.toDisplayString(_ctx.text), 1 /* TEXT */))
 }
 
 var css_248z$9 = "\n.reset-button[data-v-70384d7c] {\n  background-color: var(--color-reset);\n  color: var(--color-reset-text);\n  font-weight: var(--font-weight-bold);\n  padding: var(--button-padding);\n  border-radius: var(--border-radius-base);\n  border: var(--button-border);\n  cursor: pointer;\n  transition: var(--button-transition);\n}\n.reset-button[data-v-70384d7c]:hover {\n  background-color: var(--color-reset-hover);\n}\n";
 styleInject(css_248z$9);
 
-script$9.render = render$9;
-script$9.__scopeId = "data-v-70384d7c";
-script$9.__file = "src/Buttons/ResetButton/ResetButton.vue";
+script$e.render = render$e;
+script$e.__scopeId = "data-v-70384d7c";
+script$e.__file = "src/Buttons/ResetButton/ResetButton.vue";
 
-var script$8 = vue.defineComponent({
+var script$d = vue.defineComponent({
   name: "SubmitButton",
   props: {
     text: {
@@ -969,24 +969,24 @@ var script$8 = vue.defineComponent({
   },
 });
 
-const _hoisted_1$6 = ["disabled"];
+const _hoisted_1$b = ["disabled"];
 
-function render$8(_ctx, _cache, $props, $setup, $data, $options) {
+function render$d(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("button", {
     class: "submit-button",
     type: "submit",
     disabled: _ctx.disabled
-  }, vue.toDisplayString(_ctx.text), 9 /* TEXT, PROPS */, _hoisted_1$6))
+  }, vue.toDisplayString(_ctx.text), 9 /* TEXT, PROPS */, _hoisted_1$b))
 }
 
 var css_248z$8 = "\n.submit-button[data-v-f7f11890] {\n  background-color: var(--color-submit);\n  color: var(--color-submit-text);\n  font-weight: var(--font-weight-bold);\n  padding: var(--button-padding);\n  border-radius: var(--border-radius-base);\n  border: var(--button-border);\n  cursor: pointer;\n  transition: var(--button-transition);\n}\n.submit-button[data-v-f7f11890]:hover {\n  background-color: var(--color-submit-hover);\n}\n.submit-button[data-v-f7f11890]:disabled {\n  background-color: var(--color-submit-disabled);\n  cursor: not-allowed;\n}\n";
 styleInject(css_248z$8);
 
-script$8.render = render$8;
-script$8.__scopeId = "data-v-f7f11890";
-script$8.__file = "src/Buttons/SubmitButton/SubmitButton.vue";
+script$d.render = render$d;
+script$d.__scopeId = "data-v-f7f11890";
+script$d.__file = "src/Buttons/SubmitButton/SubmitButton.vue";
 
-var script$7 = vue.defineComponent({
+var script$c = vue.defineComponent({
   name: "SecondaryButton",
   props: {
     text: String,
@@ -999,7 +999,7 @@ var script$7 = vue.defineComponent({
   },
 });
 
-function render$7(_ctx, _cache, $props, $setup, $data, $options) {
+function render$c(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("button", {
     class: "secondary-button",
     onClick: _cache[0] || (_cache[0] = (...args) => (_ctx.onClick && _ctx.onClick(...args)))
@@ -1009,11 +1009,11 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$7 = "\n.secondary-button[data-v-5bb3ed46] {\n  background-color: var(--color-secondary);\n  color: var(--color-secondary-text);\n  font-weight: var(--font-weight-bold);\n  padding: var(--button-padding);\n  border-radius: var(--border-radius-base);\n  border: var(--button-border);\n  cursor: pointer;\n  transition: var(--button-transition);\n}\n.secondary-button[data-v-5bb3ed46]:hover {\n  background-color: var(--color-secondary-hover);\n}\n";
 styleInject(css_248z$7);
 
-script$7.render = render$7;
-script$7.__scopeId = "data-v-5bb3ed46";
-script$7.__file = "src/Buttons/SecondaryButton/SecondaryButton.vue";
+script$c.render = render$c;
+script$c.__scopeId = "data-v-5bb3ed46";
+script$c.__file = "src/Buttons/SecondaryButton/SecondaryButton.vue";
 
-var script$6 = vue.defineComponent({
+var script$b = vue.defineComponent({
   name: "DangerButton",
   props: {
     text: String,
@@ -1026,7 +1026,7 @@ var script$6 = vue.defineComponent({
   },
 });
 
-function render$6(_ctx, _cache, $props, $setup, $data, $options) {
+function render$b(_ctx, _cache, $props, $setup, $data, $options) {
   return (vue.openBlock(), vue.createElementBlock("button", {
     class: "danger-button",
     onClick: _cache[0] || (_cache[0] = (...args) => (_ctx.onClick && _ctx.onClick(...args)))
@@ -1036,11 +1036,11 @@ function render$6(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$6 = "\n.danger-button[data-v-5e080598] {\n  background-color: var(--color-danger);\n  color: var(--color-danger-text);\n  font-weight: var(--font-weight-bold);\n  padding: var(--button-padding);\n  border-radius: var(--border-radius-base);\n  border: var(--button-border);\n  cursor: pointer;\n  transition: var(--button-transition);\n}\n.danger-button[data-v-5e080598]:hover {\n  background-color: var(--color-danger-hover);\n}\n";
 styleInject(css_248z$6);
 
-script$6.render = render$6;
-script$6.__scopeId = "data-v-5e080598";
-script$6.__file = "src/Buttons/DangerButton/DangerButton.vue";
+script$b.render = render$b;
+script$b.__scopeId = "data-v-5e080598";
+script$b.__file = "src/Buttons/DangerButton/DangerButton.vue";
 
-var script$5 = vue.defineComponent({
+var script$a = vue.defineComponent({
   name: "TextInput",
   props: {
     id: {
@@ -1070,12 +1070,12 @@ var script$5 = vue.defineComponent({
   },
 });
 
-const _hoisted_1$5 = { class: "text-input-container" };
+const _hoisted_1$a = { class: "text-input-container" };
 const _hoisted_2$5 = ["for"];
 const _hoisted_3$4 = ["id", "name", "required", "disabled", "placeholder", "value"];
 
-function render$5(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
+function render$a(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
     vue.createElementVNode("label", {
       class: "text-input-label",
       for: _ctx.id
@@ -1097,11 +1097,11 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$5 = "\n.text-input-container[data-v-6df3547e] {\n  margin-bottom: 1rem;\n}\n.text-input-label[data-v-6df3547e] {\n  display: block;\n  color: var(--color-text-input-label);\n  font-size: var(--font-size-small);\n  font-weight: var(--font-weight-bold);\n  margin-bottom: 0.5rem;\n}\n.text-input-field[data-v-6df3547e] {\n  box-shadow: 0 1px 3px var(--color-text-input-shadow);\n  appearance: none;\n  border: 1px solid var(--color-text-input-border);\n  border-radius: var(--border-radius--base);\n  width: 100%;\n  padding: 0.5rem 0.75rem;\n  color: var(--color-text-input);\n  line-height: 1.25;\n  transition: box-shadow 0.2s ease-in-out, border-color 0.2s ease-in-out;\n}\n.text-input-field[data-v-6df3547e]:focus {\n  outline: none;\n  box-shadow: 0 0 0 3px var(--color-text-input-shadow);\n  border-color: var(--color-text-input-border-focus);\n}\n.text-input-field[data-v-6df3547e]:disabled {\n  background-color: var(--color-input-disabled);\n  cursor: not-allowed;\n}\n";
 styleInject(css_248z$5);
 
-script$5.render = render$5;
-script$5.__scopeId = "data-v-6df3547e";
-script$5.__file = "src/Inputs/TextInput/TextInput.vue";
+script$a.render = render$a;
+script$a.__scopeId = "data-v-6df3547e";
+script$a.__file = "src/Inputs/TextInput/TextInput.vue";
 
-var script$4 = vue.defineComponent({
+var script$9 = vue.defineComponent({
   name: "CheckBoxInput",
   props: {
     id: {
@@ -1128,12 +1128,12 @@ var script$4 = vue.defineComponent({
   },
 });
 
-const _hoisted_1$4 = { class: "checkbox-container" };
+const _hoisted_1$9 = { class: "checkbox-container" };
 const _hoisted_2$4 = ["id", "name", "required", "value"];
 const _hoisted_3$3 = ["for"];
 
-function render$4(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
+function render$9(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
     vue.createElementVNode("input", {
       id: _ctx.id,
       name: _ctx.id,
@@ -1153,11 +1153,11 @@ function render$4(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$4 = "\n.checkbox-container[data-v-4612e592] {\n  margin-bottom: 1rem;\n}\ninput[type=\"checkbox\"][data-v-4612e592] {\n  margin-right: 0.5rem;\n}\n.checkbox-label[data-v-4612e592] {\n  display: block;\n  color: var(--color-checkbox-label);\n  font-size: var(--font-size-small);\n  font-weight: var(--font-weight-bold);\n}\n";
 styleInject(css_248z$4);
 
-script$4.render = render$4;
-script$4.__scopeId = "data-v-4612e592";
-script$4.__file = "src/Inputs/CheckBoxInput/CheckBoxInput.vue";
+script$9.render = render$9;
+script$9.__scopeId = "data-v-4612e592";
+script$9.__file = "src/Inputs/CheckBoxInput/CheckBoxInput.vue";
 
-var script$3 = vue.defineComponent({
+var script$8 = vue.defineComponent({
   name: "NumberInput",
   props: {
     id: {
@@ -1193,12 +1193,12 @@ var script$3 = vue.defineComponent({
   },
 });
 
-const _hoisted_1$3 = { class: "number-input-container" };
+const _hoisted_1$8 = { class: "number-input-container" };
 const _hoisted_2$3 = ["for"];
 const _hoisted_3$2 = ["id", "name", "required", "placeholder", "disabled", "value", "min", "step"];
 
-function render$3(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
+function render$8(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
     vue.createElementVNode("label", {
       class: "number-input-label",
       for: _ctx.id
@@ -1222,11 +1222,11 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$3 = "\n.number-input-container[data-v-26abc846] {\n  margin-bottom: 1rem;\n}\n.number-input-label[data-v-26abc846] {\n  display: block;\n  color: var(--color-number-input-label);\n  font-size: var(--font-size-small);\n  font-weight: var(--font-weight-bold);\n  margin-bottom: 0.5rem;\n}\n.number-input-field[data-v-26abc846] {\n  box-shadow: 0 1px 3px var(--color-input-shadow);\n  appearance: none;\n  border: 1px solid var(--color-number-input-border);\n  border-radius: var(--border-radius--base);\n  width: 100%;\n  padding: 0.5rem 0.75rem;\n  color: var(--color-number-input);\n  line-height: 1.25;\n  transition: box-shadow 0.2s ease-in-out, border-color 0.2s ease-in-out;\n}\n.number-input-field[data-v-26abc846]:focus {\n  outline: none;\n  box-shadow: 0 0 0 3px var(--color-input-shadow-focus);\n  border-color: var(--color-number-input-border-focus);\n}\n.number-input-field[data-v-26abc846]:disabled {\n  background-color: var(--color-input-disabled);\n  cursor: not-allowed;\n}\n";
 styleInject(css_248z$3);
 
-script$3.render = render$3;
-script$3.__scopeId = "data-v-26abc846";
-script$3.__file = "src/Inputs/NumberInput/NumberInput.vue";
+script$8.render = render$8;
+script$8.__scopeId = "data-v-26abc846";
+script$8.__file = "src/Inputs/NumberInput/NumberInput.vue";
 
-var script$2 = vue.defineComponent({
+var script$7 = vue.defineComponent({
   name: "ImageInput",
   props: {
     id: {
@@ -1256,12 +1256,12 @@ var script$2 = vue.defineComponent({
   },
 });
 
-const _hoisted_1$2 = { class: "image-input-container" };
+const _hoisted_1$7 = { class: "image-input-container" };
 const _hoisted_2$2 = ["for"];
 const _hoisted_3$1 = ["id", "name", "required", "placeholder", "value", "drop-placeholder"];
 
-function render$2(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
+function render$7(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [
     vue.createElementVNode("label", {
       class: "image-input-label",
       for: _ctx.id
@@ -1284,9 +1284,9 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$2 = "\n.image-input-container[data-v-d90b5f3c] {\n  margin-bottom: 1rem;\n}\n.image-input-label[data-v-d90b5f3c] {\n  display: block;\n  color: var(--color-image-input);\n  font-size: var(--font-size-small);\n  font-weight: var(--font-weight-bold);\n  margin-bottom: 0.5rem;\n}\n.image-input-field[data-v-d90b5f3c] {\n  box-shadow: 0 1px 3px var(--color-input-shadow);\n  appearance: none;\n  border: 1px solid var(--color-image-input-border);\n  border-radius: var(--border-radius--base);\n  width: 100%;\n  padding: 0.5rem 0.75rem;\n  color: var(--color-image-input);\n  line-height: 1.25;\n  transition: box-shadow 0.2s ease-in-out, border-color 0.2s ease-in-out;\n}\n.image-input-field[data-v-d90b5f3c]:focus {\n  outline: none;\n  box-shadow: 0 0 0 3px var(--color-image-input-shadow);\n  border-color: var(--color-image-input-border-focus);\n}\n";
 styleInject(css_248z$2);
 
-script$2.render = render$2;
-script$2.__scopeId = "data-v-d90b5f3c";
-script$2.__file = "src/Inputs/ImageInput/ImageInput.vue";
+script$7.render = render$7;
+script$7.__scopeId = "data-v-d90b5f3c";
+script$7.__file = "src/Inputs/ImageInput/ImageInput.vue";
 
 /*! image-blob-reduce 4.1.0 https://github.com/nodeca/image-blob-reduce @license MIT */
 function commonjsRequire (path) {
@@ -4883,10 +4883,10 @@ ImageBlobReduce.pica = pica;
 
 var imageBlobReduce = ImageBlobReduce;
 
-var script$1 = vue.defineComponent({
+var script$6 = vue.defineComponent({
   name: "ResizeImageUpload",
   components: {
-    ImageInput: script$2,
+    ImageInput: script$7,
   },
   props: {
     id: {
@@ -4932,13 +4932,13 @@ var script$1 = vue.defineComponent({
   },
 });
 
-const _hoisted_1$1 = { class: "image-input-container" };
+const _hoisted_1$6 = { class: "image-input-container" };
 const _hoisted_2$1 = { key: 0 };
 
-function render$1(_ctx, _cache, $props, $setup, $data, $options) {
+function render$6(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_image_input = vue.resolveComponent("image-input");
 
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
     vue.createVNode(_component_image_input, {
       id: _ctx.id,
       name: _ctx.id,
@@ -4957,11 +4957,11 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z$1 = "\nimage-input[data-v-3fb95754] {\n  display: block;\n  margin-bottom: 1rem;\n}\nimage-input label[data-v-3fb95754] {\n  display: block;\n  margin-bottom: 0.5rem;\n  font-weight: var(--font-weight-bold);\n  font-size: var(--font-size-small);\n  color: var(--color-image-input);\n}\nimage-input input[type=\"file\"][data-v-3fb95754] {\n  display: block;\n  width: 100%;\n  padding: 0.5rem;\n  border: 1px solid var(--color-image-input-border);\n  border-radius: var(--border-radius--base);\n  color: var(--color-image-input);\n  background-color: var(--color-image-input-background);\n  cursor: pointer;\n}\nimage-input input[type=\"file\"][data-v-3fb95754]:focus {\n  outline: none;\n  border-color: var(--color-image-input-border-focus);\n  box-shadow: 0 0 0 3px var(--color-image-input-shadow);\n}\nimage-input input[type=\"file\"][data-v-3fb95754]:disabled {\n  background-color: var(--color-input-disabled);\n  cursor: not-allowed;\n}\n";
 styleInject(css_248z$1);
 
-script$1.render = render$1;
-script$1.__scopeId = "data-v-3fb95754";
-script$1.__file = "src/Inputs/ResizeImageUpload/ResizeImageUpload.vue";
+script$6.render = render$6;
+script$6.__scopeId = "data-v-3fb95754";
+script$6.__file = "src/Inputs/ResizeImageUpload/ResizeImageUpload.vue";
 
-var script = vue.defineComponent({
+var script$5 = vue.defineComponent({
   name: "Selector",
   props: {
     id: {
@@ -5013,14 +5013,14 @@ var script = vue.defineComponent({
   },
 });
 
-const _hoisted_1 = { class: "selector-container" };
+const _hoisted_1$5 = { class: "selector-container" };
 const _hoisted_2 = ["for"];
 const _hoisted_3 = { class: "selector-relative-container" };
 const _hoisted_4 = ["id", "disabled"];
 const _hoisted_5 = ["value", "disabled"];
 
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+function render$5(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
     vue.createElementVNode("label", {
       class: "selector-label",
       for: _ctx.id
@@ -5059,32 +5059,252 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
 var css_248z = "\n.selector-container[data-v-008e1be2] {\n  margin-bottom: 1rem;\n}\n.selector-label[data-v-008e1be2] {\n  display: block;\n  color: var(--color-selector-label);\n  font-size: var(--font-size-small);\n  font-weight: var(--font-weight-bold);\n  margin-bottom: 0.5rem;\n}\n.selector-relative-container[data-v-008e1be2] {\n  position: relative;\n}\n.selector-field[data-v-008e1be2] {\n  appearance: none;\n  width: 100%;\n  background-color: var(--color-selector-background);\n  border: 1px solid var(--color-selector-border);\n  color: var(--color-selector-text);\n  padding: 0.75rem 1rem 0.75rem 0.75rem;\n  padding-right: 2rem;\n  border-radius: var(--border-radius--base);\n  line-height: 1.25;\n  transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;\n}\n.selector-field[data-v-008e1be2]:focus {\n  outline: none;\n  background-color: var(--color-selector-background-focused);\n  border-color: var(--color-selector-border-focused);\n}\n.selector-icon-container[data-v-008e1be2] {\n  pointer-events: none;\n  position: absolute;\n  inset: 0 auto;\n  right: 0;\n  display: flex;\n  align-items: center;\n  padding: 0 0.5rem;\n  color: var(--color-selector-icon-container);\n}\n.selector-icon[data-v-008e1be2] {\n  fill: currentColor;\n  height: 1rem;\n  width: 1rem;\n}\n";
 styleInject(css_248z);
 
+script$5.render = render$5;
+script$5.__scopeId = "data-v-008e1be2";
+script$5.__file = "src/Inputs/Selector/Selector.vue";
+
+var script$4 = {
+  name: 'DropIcon',
+  props: {
+    size: {
+      type: [Number, String],
+      default: 24
+    },
+    color: {
+      type: String,
+      default: 'currentColor'
+    }
+  }
+};
+
+const _hoisted_1$4 = ["width", "height", "stroke"];
+
+function render$4(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: $props.size,
+    height: $props.size,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: $props.color,
+    "stroke-width": "2",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round",
+    class: "lucide lucide-droplets-icon lucide-droplets"
+  }, _cache[0] || (_cache[0] = [
+    vue.createElementVNode("path", { d: "M7 16.3c2.2 0 4-1.83 4-4.05 0-1.16-.57-2.26-1.71-3.19S7.29 6.75 7 5.3c-.29 1.45-1.14 2.84-2.29 3.76S3 11.1 3 12.25c0 2.22 1.8 4.05 4 4.05z" }, null, -1 /* HOISTED */),
+    vue.createElementVNode("path", { d: "M12.56 6.6A10.97 10.97 0 0 0 14 3.02c.5 2.5 2 4.9 4 6.5s3 3.5 3 5.5a6.98 6.98 0 0 1-11.91 4.97" }, null, -1 /* HOISTED */)
+  ]), 8 /* PROPS */, _hoisted_1$4))
+}
+
+script$4.render = render$4;
+script$4.__file = "src/Icons/DropIcon/DropIcon.vue";
+
+var script$3 = {
+  name: 'SkullIcon',
+  props: {
+    size: {
+      type: [Number, String],
+      default: 24
+    },
+    color: {
+      type: String,
+      default: 'currentColor'
+    }
+  }
+};
+
+const _hoisted_1$3 = ["width", "height", "stroke"];
+
+function render$3(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: $props.size,
+    height: $props.size,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: $props.color,
+    "stroke-width": "2",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round",
+    class: "lucide lucide-skull-icon lucide-skull"
+  }, _cache[0] || (_cache[0] = [
+    vue.createElementVNode("path", { d: "m12.5 17-.5-1-.5 1h1z" }, null, -1 /* HOISTED */),
+    vue.createElementVNode("path", { d: "M15 22a1 1 0 0 0 1-1v-1a2 2 0 0 0 1.56-3.25 8 8 0 1 0-11.12 0A2 2 0 0 0 8 20v1a1 1 0 0 0 1 1z" }, null, -1 /* HOISTED */),
+    vue.createElementVNode("circle", {
+      cx: "15",
+      cy: "12",
+      r: "1"
+    }, null, -1 /* HOISTED */),
+    vue.createElementVNode("circle", {
+      cx: "9",
+      cy: "12",
+      r: "1"
+    }, null, -1 /* HOISTED */)
+  ]), 8 /* PROPS */, _hoisted_1$3))
+}
+
+script$3.render = render$3;
+script$3.__file = "src/Icons/SkullIcon/SkullIcon.vue";
+
+var script$2 = {
+  name: 'CalendarIcon',
+  props: {
+    size: {
+      type: [Number, String],
+      default: 24
+    },
+    color: {
+      type: String,
+      default: 'currentColor'
+    }
+  }
+};
+
+const _hoisted_1$2 = ["width", "height", "stroke"];
+
+function render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: $props.size,
+    height: $props.size,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: $props.color,
+    "stroke-width": "2",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round",
+    class: "lucide lucide-calendar-icon lucide-calendar"
+  }, _cache[0] || (_cache[0] = [
+    vue.createElementVNode("path", { d: "M8 2v4" }, null, -1 /* HOISTED */),
+    vue.createElementVNode("path", { d: "M16 2v4" }, null, -1 /* HOISTED */),
+    vue.createElementVNode("rect", {
+      width: "18",
+      height: "18",
+      x: "3",
+      y: "4",
+      rx: "2"
+    }, null, -1 /* HOISTED */),
+    vue.createElementVNode("path", { d: "M3 10h18" }, null, -1 /* HOISTED */)
+  ]), 8 /* PROPS */, _hoisted_1$2))
+}
+
+script$2.render = render$2;
+script$2.__file = "src/Icons/CalendarIcon/CalendarIcon.vue";
+
+var script$1 = {
+  name: 'SaveIcon',
+  props: {
+    size: {
+      type: [Number, String],
+      default: 24
+    },
+    color: {
+      type: String,
+      default: 'currentColor'
+    }
+  }
+};
+
+const _hoisted_1$1 = ["width", "height", "stroke"];
+
+function render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: $props.size,
+    height: $props.size,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: $props.color,
+    "stroke-width": "2",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round",
+    class: "lucide lucide-save-icon lucide-save"
+  }, _cache[0] || (_cache[0] = [
+    vue.createElementVNode("path", { d: "M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z" }, null, -1 /* HOISTED */),
+    vue.createElementVNode("path", { d: "M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7" }, null, -1 /* HOISTED */),
+    vue.createElementVNode("path", { d: "M7 3v4a1 1 0 0 0 1 1h7" }, null, -1 /* HOISTED */)
+  ]), 8 /* PROPS */, _hoisted_1$1))
+}
+
+script$1.render = render$1;
+script$1.__file = "src/Icons/SaveIcon/SaveIcon.vue";
+
+var script = {
+  name: 'CreateIcon',
+  props: {
+    size: {
+      type: [Number, String],
+      default: 24
+    },
+    color: {
+      type: String,
+      default: 'currentColor'
+    }
+  }
+};
+
+const _hoisted_1 = ["width", "height", "stroke"];
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return (vue.openBlock(), vue.createElementBlock("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: $props.size,
+    height: $props.size,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: $props.color,
+    "stroke-width": "2",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round",
+    class: "lucide lucide-badge-plus-icon lucide-badge-plus"
+  }, _cache[0] || (_cache[0] = [
+    vue.createElementVNode("path", { d: "M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" }, null, -1 /* HOISTED */),
+    vue.createElementVNode("line", {
+      x1: "12",
+      x2: "12",
+      y1: "8",
+      y2: "16"
+    }, null, -1 /* HOISTED */),
+    vue.createElementVNode("line", {
+      x1: "8",
+      x2: "16",
+      y1: "12",
+      y2: "12"
+    }, null, -1 /* HOISTED */)
+  ]), 8 /* PROPS */, _hoisted_1))
+}
+
 script.render = render;
-script.__scopeId = "data-v-008e1be2";
-script.__file = "src/Inputs/Selector/Selector.vue";
-
-exports.Badge = script$e;
-exports.Card = script$s;
-exports.CardGrid = script$r;
-exports.CheckBoxInput = script$4;
-exports.Container = script$q;
-exports.DangerButton = script$6;
-exports.ImageInput = script$2;
-exports.Loading = script$v;
-exports.Modal = script$c;
-exports.Navbar = script$i;
-exports.NumberInput = script$3;
-exports.Pagination = script$f;
-exports.RangeView = script$a;
-exports.RegularButton = script$g;
-exports.ResetButton = script$9;
-exports.ResizeImageUpload = script$1;
-exports.SecondaryButton = script$7;
-exports.SectionTitle = script$w;
-exports.Selector = script;
-exports.Spinner = script$b;
-exports.StyledTable = script$h;
-exports.SubmitButton = script$8;
-exports.Temperature = script$d;
-exports.TextInput = script$5;
+script.__file = "src/Icons/CreateIcon/CreateIcon.vue";
+
+exports.Badge = script$j;
+exports.CalendarIcon = script$2;
+exports.Card = script$x;
+exports.CardGrid = script$w;
+exports.CheckBoxInput = script$9;
+exports.Container = script$v;
+exports.CreateIcon = script;
+exports.DangerButton = script$b;
+exports.DropIcon = script$4;
+exports.ImageInput = script$7;
+exports.Loading = script$A;
+exports.Modal = script$h;
+exports.Navbar = script$n;
+exports.NumberInput = script$8;
+exports.Pagination = script$k;
+exports.RangeView = script$f;
+exports.RegularButton = script$l;
+exports.ResetButton = script$e;
+exports.ResizeImageUpload = script$6;
+exports.SaveIcon = script$1;
+exports.SecondaryButton = script$c;
+exports.SectionTitle = script$B;
+exports.Selector = script$5;
+exports.SkullIcon = script$3;
+exports.Spinner = script$g;
+exports.StyledTable = script$m;
+exports.SubmitButton = script$d;
+exports.Temperature = script$i;
+exports.TextInput = script$a;
 //# sourceMappingURL=index.js.map