diff --git a/components.d.ts b/components.d.ts
index 139e2cab76cf09152dddbc49590c12cde6022201..2fd7373521a26f042c3f51940074c04aa60ae595 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -10,17 +10,22 @@ declare module 'vue' {
     Avatar: typeof import('primevue/avatar')['default']
     Button: typeof import('primevue/button')['default']
     CreateEntityMenu: typeof import('./src/components/CreateEntityMenu.vue')['default']
+    Dialog: typeof import('primevue/dialog')['default']
     Divider: typeof import('primevue/divider')['default']
     Drawer: typeof import('primevue/drawer')['default']
     ImageItem: typeof import('@/modules/entities/ImageItem.vue')['default']
     LogoAndLabel: typeof import('./src/components/LogoAndLabel.vue')['default']
-    MoveMenu: typeof import('./src/components/editEntityMenu/image/MoveMenu.vue')['default']
+    MoveImageMenu: typeof import('./src/components/editEntityMenu/image/MoveImageMenu.vue')['default']
+    MoveMenu: typeof import('./src/components/editEntityMenu/text/MoveMenu.vue')['default']
+    MoveTextMenu: typeof import('./src/components/editEntityMenu/text/MoveTextMenu.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     SpeedDial: typeof import('primevue/speeddial')['default']
     Splitter: typeof import('primevue/splitter')['default']
     SplitterPanel: typeof import('primevue/splitterpanel')['default']
-    StateMenu: typeof import('./src/components/editEntityMenu/image/StateMenu.vue')['default']
+    StateImageMenu: typeof import('./src/components/editEntityMenu/image/StateImageMenu.vue')['default']
+    StateMenu: typeof import('./src/components/editEntityMenu/text/StateMenu.vue')['default']
+    StateTextMenu: typeof import('./src/components/editEntityMenu/text/StateTextMenu.vue')['default']
     TextItem: typeof import('@/modules/entities/TextItem.vue')['default']
     Tree: typeof import('primevue/tree')['default']
     UserInfoHeaderWithSettings: typeof import('./src/components/UserInfoHeaderWithSettings.vue')['default']
diff --git a/env.d.ts b/env.d.ts
index 11f02fe2a0061d6e6e1f271b21da95423b448b32..910435b463b19b55228ca6e4d77b9d0213ee30f8 100644
--- a/env.d.ts
+++ b/env.d.ts
@@ -1 +1,2 @@
 /// <reference types="vite/client" />
+// npx tailwindcss -i ./src/input.css -o ./src/output.css --watch
diff --git a/package.json b/package.json
index 15be68437e82dca77bc43ba3806ab559e7188210..2001c5d999707e6e25d9424e27aeca97b1d65271 100644
--- a/package.json
+++ b/package.json
@@ -14,9 +14,9 @@
   },
   "dependencies": {
     "@primevue/themes": "^4.0.4",
-    "@vueuse/components": "^10.11.1",
     "@vueuse/core": "^10.11.0",
     "@vueuse/integrations": "^10.11.0",
+    "cropperjs": "^1.6.2",
     "pinia": "^2.1.7",
     "primeicons": "^7.0.0",
     "primevue": "^4.0.4",
@@ -24,6 +24,7 @@
     "universal-cookie": "^7",
     "uuid": "^10.0.0",
     "vue": "^3.4.29",
+    "vue-advanced-cropper": "^2.8.9",
     "vue-router": "^4.3.3"
   },
   "devDependencies": {
@@ -36,6 +37,7 @@
     "@vue/eslint-config-prettier": "^9.0.0",
     "@vue/eslint-config-typescript": "^13.0.0",
     "@vue/tsconfig": "^0.5.1",
+    "cost-of-modules": "^1.0.1",
     "eslint": "^8.57.0",
     "eslint-plugin-vue": "^9.23.0",
     "npm-run-all2": "^6.2.0",
diff --git a/src/app/App.vue b/src/app/App.vue
index df298a2f11b3e8ede53c033d188615b659efdd2e..c863b2c212458cc0de23afef931de2ba3cd308a7 100644
--- a/src/app/App.vue
+++ b/src/app/App.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import 'primeicons/primeicons.css';
-import BaseMenu from '@/modules/BaseMenu.vue';
+import BaseSidebarMenu from '@/modules/BaseSidebarMenu.vue';
 
 const visible = ref<boolean>(false);
 </script>
@@ -18,7 +18,7 @@ const visible = ref<boolean>(false);
   </div>
   <Drawer v-model:visible="visible">
     <template #container="{ closeCallback }">
-      <BaseMenu @closeCallback="closeCallback" />
+      <BaseSidebarMenu @closeCallback="closeCallback" />
     </template>
   </Drawer>
 </template>
diff --git a/src/app/interfaces/index.ts b/src/app/interfaces/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..424456135f391e911ae5f730ca6edcd14aad0bea
--- /dev/null
+++ b/src/app/interfaces/index.ts
@@ -0,0 +1,5 @@
+export interface IImageMainInfo {
+  url: string;
+  width: number;
+  height: number;
+}
diff --git a/src/components/CreateEntityMenu.vue b/src/components/CreateEntityMenu.vue
index eaf9bad5895bd5a18d354554d16e1a5067de4ed2..63759b78a265b3483b2f649f98765a5efd31f141 100644
--- a/src/components/CreateEntityMenu.vue
+++ b/src/components/CreateEntityMenu.vue
@@ -10,7 +10,8 @@ const {
   reset,
   onChange
 } = useFileDialog({
-  accept: 'image/*'
+  accept: 'image/*',
+  reset: true
 });
 
 const addImage = (files: FileList) => {
diff --git a/src/components/editEntityMenu/image/MoveMenu.vue b/src/components/editEntityMenu/image/MoveImageMenu.vue
similarity index 100%
rename from src/components/editEntityMenu/image/MoveMenu.vue
rename to src/components/editEntityMenu/image/MoveImageMenu.vue
diff --git a/src/components/editEntityMenu/image/StateMenu.vue b/src/components/editEntityMenu/image/StateImageMenu.vue
similarity index 100%
rename from src/components/editEntityMenu/image/StateMenu.vue
rename to src/components/editEntityMenu/image/StateImageMenu.vue
diff --git a/src/components/editEntityMenu/text/MoveMenu.vue b/src/components/editEntityMenu/text/MoveTextMenu.vue
similarity index 100%
rename from src/components/editEntityMenu/text/MoveMenu.vue
rename to src/components/editEntityMenu/text/MoveTextMenu.vue
diff --git a/src/components/editEntityMenu/text/StateMenu.vue b/src/components/editEntityMenu/text/StateTextMenu.vue
similarity index 100%
rename from src/components/editEntityMenu/text/StateMenu.vue
rename to src/components/editEntityMenu/text/StateTextMenu.vue
diff --git a/src/modules/BaseModal.vue b/src/modules/BaseModal.vue
new file mode 100644
index 0000000000000000000000000000000000000000..c3038b752ff0ca6895532468ab3d9e5c6492c2e9
--- /dev/null
+++ b/src/modules/BaseModal.vue
@@ -0,0 +1,108 @@
+<script setup lang="ts">
+import { useWindowSize, useVModels, useDraggable } from '@vueuse/core';
+import type { IImageMainInfo } from '@/app/interfaces';
+import { Cropper } from 'vue-advanced-cropper';
+import 'vue-advanced-cropper/dist/style.css';
+
+interface Props {
+  isVisible: boolean;
+  imageInfo: IImageMainInfo;
+}
+const props = defineProps<Props>();
+const emit = defineEmits(['update:isVisible']);
+const { isVisible, imageInfo } = useVModels(props, emit);
+
+const imageInstance = new Image();
+const finalImageUrl = ref<string>('');
+const { width: windowWidth, height: windowHeight } = useWindowSize();
+
+const stageSize = ref({
+  width: 200,
+  height: 200
+});
+
+watch(
+  () => imageInfo.value.url,
+  () => {
+    console.log('imageInfo', imageInfo.value);
+    if (imageInfo.value.url) {
+      imageInstance.src = imageInfo.value.url;
+      imageInstance.onload = () => {
+        const imageHeight = imageInfo.value.height;
+        const imageWidth = imageInfo.value.width;
+        imageInstance.src = imageInfo.value.url;
+        if (imageWidth < (imageHeight * windowWidth.value) / windowHeight.value) {
+          imageInstance.onload = () => {
+            stageSize.value.height = windowHeight.value * 0.75 - 20;
+            imageInstance.height = stageSize.value.height;
+            imageInstance.width = +(stageSize.value.height / imageHeight).toFixed(2) * imageWidth;
+            stageSize.value.width = imageInstance.width;
+          };
+        } else {
+          imageInstance.onload = () => {
+            stageSize.value.width = windowWidth.value * 0.63 - 60;
+            imageInstance.width = stageSize.value.width;
+            imageInstance.height = +(stageSize.value.width / imageWidth).toFixed(2) * imageHeight;
+            stageSize.value.height = imageInstance.height;
+          };
+        }
+        console.log(
+          'imageInstance.width',
+          imageInstance.width,
+          'imageInstance.height',
+          imageInstance.height
+        );
+      };
+    }
+  }
+);
+
+function saveImage() {
+  console.log('save image!');
+  imageInfo.value.url = finalImageUrl.value;
+  finalImageUrl.value = '';
+  isVisible.value = false;
+}
+const modalWidth = computed(() => {
+  if (stageSize.value.width > stageSize.value.height) {
+    return 63;
+  } else {
+    return (100 * (stageSize.value.width + 60)) / windowWidth.value;
+  }
+});
+function onCropperChange({ canvas }) {
+  finalImageUrl.value = canvas.toDataURL();
+  console.log('finalImageUrl.value', finalImageUrl.value);
+}
+</script>
+
+<template>
+  <div>
+    <Dialog
+      v-model:visible="isVisible"
+      modal
+      :draggable="false"
+      :style="`width: ${modalWidth}%; position: relative`"
+    >
+      <template #header>
+        <div class="mx-auto select-none">
+          <i class="pi pi-upload mr-4" style="font-size: 1.5rem"></i>
+          <span class="font-bold text-2xl">Upload background</span>
+        </div>
+      </template>
+      <button
+        @click.prevent="saveImage"
+        class="absolute top-0 left-2 -translate-y-full bg-blue-600 p-2 px-4 text-lg font-bold transition-all border-0 border-t-2 border-t-solid border-t-black rounded-t-lg select-none"
+      >
+        Save image
+      </button>
+      <div
+        :style="`position: relative; width: ${stageSize.width}px; height: ${stageSize.height}px;`"
+      >
+        <Cropper :src="imageInstance.src" @change="onCropperChange"></Cropper>
+      </div>
+    </Dialog>
+  </div>
+</template>
+
+<style scoped></style>
diff --git a/src/modules/BaseMenu.vue b/src/modules/BaseSidebarMenu.vue
similarity index 100%
rename from src/modules/BaseMenu.vue
rename to src/modules/BaseSidebarMenu.vue
diff --git a/src/modules/entities/ImageItem.vue b/src/modules/entities/ImageItem.vue
index dd8a0ec1089dda02c7490c71803606a9209c2e54..12d4ce16c1dc29e8673fd169d6caecd1b03c7796 100644
--- a/src/modules/entities/ImageItem.vue
+++ b/src/modules/entities/ImageItem.vue
@@ -3,8 +3,8 @@ import type { IImage } from '@/app/interfaces/entities';
 import { deleteEntity, editEntity } from '@/app/helpers';
 import { useDataStore } from '@/app/stores/data';
 import { useElementSize } from '@vueuse/core';
-import MoveMenu from '@/components/editEntityMenu/image/MoveMenu.vue';
-import StateMenu from '@/components/editEntityMenu/image/StateMenu.vue';
+import MoveImageMenu from '@/components/editEntityMenu/image/MoveImageMenu.vue';
+import StateImageMenu from '@/components/editEntityMenu/image/StateImageMenu.vue';
 
 interface Props {
   entityData: IImage;
@@ -72,7 +72,7 @@ const homeEntities = computed(() => dataStore.homeEntities);
 <template>
   <div
     :class="[
-      'entityContainer relative flex',
+      'entityContainer relative flex py-8 px-16',
       {
         'justify-start': entityData.image_position === 'left',
         'justify-center': entityData.image_position === 'center',
@@ -109,7 +109,7 @@ const homeEntities = computed(() => dataStore.homeEntities);
         />
       </div>
       <div class="speedDial absolute left-2 top-2 transition-all select-none">
-        <StateMenu
+        <StateImageMenu
           :entityData="entityData"
           :isResizable="isResizable"
           @deleteEntity="deleteEntity"
@@ -122,7 +122,7 @@ const homeEntities = computed(() => dataStore.homeEntities);
         v-if="homeEntities.length > 1"
         class="speedDial absolute left-2 bottom-2 transition-all select-none"
       >
-        <MoveMenu
+        <MoveImageMenu
           :entityData="entityData"
           :isResizable="isResizable"
           @editPosition="editPosition"
diff --git a/src/modules/entities/TextItem.vue b/src/modules/entities/TextItem.vue
index 2e936bfcfcbe97ec2c1e1261ad19c8f0057ab68d..cdd7be5af946aabcdc74ec601117f2712fe04fe6 100644
--- a/src/modules/entities/TextItem.vue
+++ b/src/modules/entities/TextItem.vue
@@ -3,8 +3,8 @@ import type { IText } from '@/app/interfaces/entities';
 import { useDataStore } from '@/app/stores/data';
 import { useTextareaAutosize } from '@vueuse/core';
 import { deleteEntity, editEntity } from '@/app/helpers';
-import StateMenu from '@/components/editEntityMenu/text/StateMenu.vue';
-import MoveMenu from '@/components/editEntityMenu/text/MoveMenu.vue';
+import StateTextMenu from '@/components/editEntityMenu/text/StateTextMenu.vue';
+import MoveTextMenu from '@/components/editEntityMenu/text/MoveTextMenu.vue';
 
 interface Props {
   entityData: IText;
@@ -59,7 +59,7 @@ const homeEntities = computed(() => dataStore.homeEntities);
       rows="2"
     />
     <div class="speedDial absolute left-2 top-2 transition-all select-none">
-      <StateMenu
+      <StateTextMenu
         :entityData="entityData"
         @deleteEntity="deleteEntity"
         @addTitle="addTitle"
@@ -70,7 +70,7 @@ const homeEntities = computed(() => dataStore.homeEntities);
       v-if="homeEntities.length > 1"
       class="speedDial absolute left-2 bottom-2 transition-all select-none"
     >
-      <MoveMenu :entityData="entityData" />
+      <MoveTextMenu :entityData="entityData" />
     </div>
   </div>
 </template>
diff --git a/src/output.css b/src/output.css
index cc2f81a73be841ff8d65249f2cbdd444510c1760..b54d04658fe476f2c828c7d53cbf6d58c0b2e54c 100644
--- a/src/output.css
+++ b/src/output.css
@@ -644,6 +644,10 @@ video {
   top: 0.5rem;
 }
 
+.z-50 {
+  z-index: 50;
+}
+
 .-m-2 {
   margin: -0.5rem;
 }
@@ -653,6 +657,11 @@ video {
   margin-bottom: -0.5rem;
 }
 
+.mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
+
 .-mb-2 {
   margin-bottom: -0.5rem;
 }
@@ -689,6 +698,10 @@ video {
   margin-right: 0.5rem;
 }
 
+.mr-4 {
+  margin-right: 1rem;
+}
+
 .mt-2 {
   margin-top: 0.5rem;
 }
@@ -727,6 +740,11 @@ video {
   height: 3rem;
 }
 
+.size-6 {
+  width: 1.5rem;
+  height: 1.5rem;
+}
+
 .h-\[1px\] {
   height: 1px;
 }
@@ -767,12 +785,23 @@ video {
   min-width: 100px;
 }
 
-.max-w-\[400px\] {
-  max-width: 400px;
+.-translate-x-1\/2 {
+  --tw-translate-x: -50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.-translate-y-1\/2 {
+  --tw-translate-y: -50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.-translate-y-full {
+  --tw-translate-y: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
-.max-w-\[800px\] {
-  max-width: 800px;
+.transform {
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
 .cursor-pointer {
@@ -841,14 +870,27 @@ video {
   border-radius: 0.375rem;
 }
 
+.rounded-t-lg {
+  border-top-left-radius: 0.5rem;
+  border-top-right-radius: 0.5rem;
+}
+
 .border {
   border-width: 1px;
 }
 
+.border-0 {
+  border-width: 0px;
+}
+
 .border-2 {
   border-width: 2px;
 }
 
+.border-t-2 {
+  border-top-width: 2px;
+}
+
 .border-solid {
   border-style: solid;
 }
@@ -858,11 +900,21 @@ video {
   border-color: rgb(0 0 0 / var(--tw-border-opacity));
 }
 
+.border-t-black {
+  --tw-border-opacity: 1;
+  border-top-color: rgb(0 0 0 / var(--tw-border-opacity));
+}
+
 .bg-black {
   --tw-bg-opacity: 1;
   background-color: rgb(0 0 0 / var(--tw-bg-opacity));
 }
 
+.bg-blue-400 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(96 165 250 / var(--tw-bg-opacity));
+}
+
 .bg-blue-500 {
   --tw-bg-opacity: 1;
   background-color: rgb(59 130 246 / var(--tw-bg-opacity));
@@ -888,8 +940,9 @@ video {
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
 }
 
-.bg-opacity-70 {
-  --tw-bg-opacity: 0.7;
+.bg-red-200 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(254 202 202 / var(--tw-bg-opacity));
 }
 
 .bg-opacity-80 {
@@ -918,6 +971,11 @@ video {
   padding-right: 4rem;
 }
 
+.px-4 {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
 .py-2 {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
@@ -967,6 +1025,11 @@ video {
   line-height: 2.5rem;
 }
 
+.text-lg {
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+
 .text-xl {
   font-size: 1.25rem;
   line-height: 1.75rem;
diff --git a/src/pages/HomePage.vue b/src/pages/HomePage.vue
index b1fdd51091086c9204c59eb013c2980038af451c..85ca5bb740295fc83e147b4f031e89374f525d62 100644
--- a/src/pages/HomePage.vue
+++ b/src/pages/HomePage.vue
@@ -2,12 +2,15 @@
 import { useElementSize } from '@vueuse/core';
 import EntityItem from '@/modules/EntityItem.vue';
 import CreateEntityMenu from '@/components/CreateEntityMenu.vue';
-import { setDefaultHomeBackground, uploadFile } from '@/app/helpers';
+// import { setDefaultHomeBackground, uploadFile } from '@/app/helpers';
+import { setDefaultHomeBackground } from '@/app/helpers';
 import { useInterfaceStore } from '@/app/stores/interface';
 import type { IEntity } from '@/app/interfaces/environment';
 import { useDataStore } from '@/app/stores/data';
 import { useAuthorizationStore } from '@/app/stores/authorization';
 import { useWebsocketStore } from '@/app/stores/websocket';
+import BaseModal from '@/modules/BaseModal.vue';
+import type { IImageMainInfo } from '@/app/interfaces';
 
 const backgroundImage = ref();
 const { height: backgroundImageHeight } = useElementSize(backgroundImage);
@@ -34,12 +37,49 @@ const addEntity = (newEntity: IEntity) => {
   console.log('data.body?.image_data: ', data.body?.image_data);
   websocketStore.sendData(data);
 };
+
+const imageInfo = ref<IImageMainInfo>({
+  url: backgroundUrl.value,
+  width: 0,
+  height: 0
+});
+const isModalUploadFile = ref<boolean>(false);
+function openUploadFileModal() {
+  console.log('openModal');
+  isModalUploadFile.value = true;
+}
+function uploadFile($event: Event) {
+  const target = $event.target as HTMLInputElement;
+  console.log('target.files', target.files);
+  if (target && target.files && target.files[0]) {
+    let image = new Image();
+    const file = target.files[0];
+    console.log('file: ', file);
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.addEventListener('load', () => {
+      image.src = reader.result;
+      image.onload = function () {
+        console.log('image width and height: ', image.width, image.height);
+        imageInfo.value.url = String(reader.result);
+        imageInfo.value.width = image.width;
+        imageInfo.value.height = image.height;
+        console.log('imageInfo.value', imageInfo.value);
+        openUploadFileModal();
+        const interfaceStore = useInterfaceStore();
+        // interfaceStore.changeHomeBackgroundUrl(url);
+        // localStorage.setItem('homeBackgroundUrl', url);
+      };
+    });
+  }
+}
 </script>
 
 <template>
   <header>
     <h1 class="text-center text-4xl py-4">Home page</h1>
   </header>
+  <BaseModal v-model:isVisible="isModalUploadFile" v-model:imageInfo="imageInfo" />
   <main class="flex flex-col">
     <Splitter
       :style="`height: calc(${backgroundImageHeight - 3}px + ${entitiesHeight}px + 100px);`"
@@ -49,7 +89,7 @@ const addEntity = (newEntity: IEntity) => {
     >
       <SplitterPanel
         ref="splitterBackground"
-        :pt:root:style="`position: relative; background-image: url(${backgroundUrl}); background-size: 100% auto; max-height: ${backgroundImageHeight - 3}px; min-height: 200px;`"
+        :pt:root:style="`position: relative; background-image: url(${imageInfo.url}); background-size: 100% auto; max-height: ${backgroundImageHeight - 3}px; min-height: 200px;`"
         class="splitterPanelBackground"
       >
         <div
@@ -58,14 +98,23 @@ const addEntity = (newEntity: IEntity) => {
           <input
             type="file"
             @change="uploadFile($event)"
+            onclick="this.value = null"
             title="Change image"
             accept="image/*"
             class="w-2 pr-[135px] -mr-[135px] py-2 -my-2 pl-2 -ml-2 opacity-0"
           /><span><i class="pi pi-image mr-2"></i>Change image</span>
         </div>
+        <!--          <input-->
+        <!--            type="button"-->
+        <!--            @click.prevent="openUploadFileModal"-->
+        <!--            title="Change image"-->
+        <!--            accept="image/*"-->
+        <!--            class="w-2 pr-[135px] -mr-[135px] py-2 -my-2 pl-2 -ml-2 opacity-0"-->
+        <!--          /><span><i class="pi pi-image mr-2"></i>Change image</span>-->
+        <!--        </div>-->
         <button
           @click.prevent="setDefaultHomeBackground"
-          v-if="backgroundUrl !== defaultBackgroundUrl"
+          v-if="imageInfo.url !== defaultBackgroundUrl"
           class="returnDefaultImageBlock absolute top-16 right-2 bg-blue-600 p-2 transition-all rounded-md border-2 border-solid border-black select-none"
         >
           Return default image
@@ -87,7 +136,7 @@ const addEntity = (newEntity: IEntity) => {
   </main>
   <img
     ref="backgroundImage"
-    :src="backgroundUrl"
+    :src="imageInfo.url"
     alt="background image"
     class="absolute w-full -top-full -left-full"
   />
diff --git a/yarn.lock b/yarn.lock
index 78c6dd12567b2926e62ee4ddfdf524474744fa6c..01f697996e796b92602d7a72c98cf1d3f7143ca5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -693,15 +693,6 @@
   resolved "https://registry.yarnpkg.com/@vue/tsconfig/-/tsconfig-0.5.1.tgz#3124ec16cc0c7e04165b88dc091e6b97782fffa9"
   integrity sha512-VcZK7MvpjuTPx2w6blwnwZAu5/LgBUtejFOi3pPGQFXQN5Ela03FUtd2Qtg4yWGGissVL0dr6Ro1LfOFh+PCuQ==
 
-"@vueuse/components@^10.11.1":
-  version "10.11.1"
-  resolved "https://registry.yarnpkg.com/@vueuse/components/-/components-10.11.1.tgz#f6ff60769221d94da8c300417765fb0fecf0602a"
-  integrity sha512-ThcreQCX/eq61sLkLKjigD4PQvs3Wy4zglICvQH9tP6xl87y5KsQEoizn6OI+R3hrOgwQHLJe7Y0wLLh3fBKcg==
-  dependencies:
-    "@vueuse/core" "10.11.1"
-    "@vueuse/shared" "10.11.1"
-    vue-demi ">=0.14.8"
-
 "@vueuse/core@10.11.0", "@vueuse/core@^10.11.0":
   version "10.11.0"
   resolved "https://registry.npmjs.org/@vueuse/core/-/core-10.11.0.tgz"
@@ -712,16 +703,6 @@
     "@vueuse/shared" "10.11.0"
     vue-demi ">=0.14.8"
 
-"@vueuse/core@10.11.1":
-  version "10.11.1"
-  resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-10.11.1.tgz#15d2c0b6448d2212235b23a7ba29c27173e0c2c6"
-  integrity sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==
-  dependencies:
-    "@types/web-bluetooth" "^0.0.20"
-    "@vueuse/metadata" "10.11.1"
-    "@vueuse/shared" "10.11.1"
-    vue-demi ">=0.14.8"
-
 "@vueuse/integrations@^10.11.0":
   version "10.11.0"
   resolved "https://registry.yarnpkg.com/@vueuse/integrations/-/integrations-10.11.0.tgz#ce2746587172af9ab8faa713f42e619609ed0de1"
@@ -736,11 +717,6 @@
   resolved "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.0.tgz"
   integrity sha512-kQX7l6l8dVWNqlqyN3ePW3KmjCQO3ZMgXuBMddIu83CmucrsBfXlH+JoviYyRBws/yLTQO8g3Pbw+bdIoVm4oQ==
 
-"@vueuse/metadata@10.11.1":
-  version "10.11.1"
-  resolved "https://registry.yarnpkg.com/@vueuse/metadata/-/metadata-10.11.1.tgz#209db7bb5915aa172a87510b6de2ca01cadbd2a7"
-  integrity sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==
-
 "@vueuse/shared@10.11.0":
   version "10.11.0"
   resolved "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.0.tgz"
@@ -748,13 +724,6 @@
   dependencies:
     vue-demi ">=0.14.8"
 
-"@vueuse/shared@10.11.1":
-  version "10.11.1"
-  resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-10.11.1.tgz#62b84e3118ae6e1f3ff38f4fbe71b0c5d0f10938"
-  integrity sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==
-  dependencies:
-    vue-demi ">=0.14.8"
-
 acorn-jsx@^5.3.2:
   version "5.3.2"
   resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937"
@@ -775,6 +744,16 @@ ajv@^6.12.4:
     json-schema-traverse "^0.4.1"
     uri-js "^4.2.2"
 
+ansi-regex@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.0.0.tgz#c5061b6e0ef8a81775e50f5d66151bf6bf371107"
+  integrity sha512-jCcLjwL2jOaTcRIaJkoRteMwNXg8nfJvwT/9K91kwZhH7bf4lsprqZ2+Qa7tSp8BYtejobOCBkDreC07q0KmZw==
+
+ansi-regex@^2.0.0:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df"
+  integrity sha512-TIGnTpdo+E3+pCyAluZvtED5p5wCqLdezCyhPZzKPcxvFplEt4i+W7OONCKgeZFT3+y5NZZfOOS/Bdcanm1MYA==
+
 ansi-regex@^5.0.1:
   version "5.0.1"
   resolved "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz"
@@ -872,6 +851,11 @@ camelcase-css@^2.0.1:
   resolved "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz"
   integrity sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==
 
+camelcase@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-3.0.0.tgz#32fc4b9fcdaf845fcdf7e73bb97cac2261f0ab0a"
+  integrity sha512-4nhGqUkc4BqbBBB4Q6zLuD7lzzrHYrjKGeYaEji/3tFR5VdJu9v+LilhGIVe8wxEJPPOeWo7eg8dwY13TZ1BNg==
+
 chalk@^4.0.0:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01"
@@ -895,6 +879,26 @@ chokidar@^3.5.3, chokidar@^3.6.0:
   optionalDependencies:
     fsevents "~2.3.2"
 
+classnames@^2.2.6:
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.5.1.tgz#ba774c614be0f016da105c858e7159eae8e7687b"
+  integrity sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==
+
+cli-table2@0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/cli-table2/-/cli-table2-0.2.0.tgz#2d1ef7f218a0e786e214540562d4bd177fe32d97"
+  integrity sha512-rNig1Ons+B0eTcophmN0nlbsROa7B3+Yfo1J3leU56awc8IuKDW3MLMv9gayl4zUnYaLGg8CrecKso+hSmUvUw==
+  dependencies:
+    lodash "^3.10.1"
+    string-width "^1.0.1"
+  optionalDependencies:
+    colors "^1.1.2"
+
+code-point-at@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77"
+  integrity sha512-RpAVKQA5T63xEj6/giIbUEtZwJ4UFIc3ZtvEkiaUERylqe8xb5IvqcgOurZLahv93CLKfxcw5YI+DZcUBRyLXA==
+
 color-convert@^2.0.1:
   version "2.0.1"
   resolved "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz"
@@ -907,6 +911,16 @@ color-name@~1.1.4:
   resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz"
   integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
 
+colors@1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/colors/-/colors-1.1.2.tgz#168a4701756b6a7f51a12ce0c97bfa28c084ed63"
+  integrity sha512-ENwblkFQpqqia6b++zLD/KUWafYlVY/UNnAp7oz7LY7E924wmpye416wBOmvv/HMWzl8gL1kJlfvId/1Dg176w==
+
+colors@^1.1.2:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78"
+  integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==
+
 commander@^4.0.0:
   version "4.1.1"
   resolved "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz"
@@ -932,6 +946,23 @@ cookie@^0.6.0:
   resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.6.0.tgz#2798b04b071b0ecbff0dbb62a505a8efa4e19051"
   integrity sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==
 
+cost-of-modules@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/cost-of-modules/-/cost-of-modules-1.0.1.tgz#f926126b553ccf0de3a998ab79ae738241525ed3"
+  integrity sha512-+eABqi/flqpoCLqQwZ6UQedhZpwuHc7RDn8uqSq6dHXrKzUjBCBHe8sSCOcZY5lWRbF5XJgQL8VRZnSo1tDTcw==
+  dependencies:
+    ansi-regex "2.0.0"
+    cli-table2 "0.2.0"
+    colors "1.1.2"
+    fs-extra "2.1.0"
+    sync-exec "0.6.2"
+    yargs-parser "4.0.2"
+
+cropperjs@^1.6.2:
+  version "1.6.2"
+  resolved "https://registry.yarnpkg.com/cropperjs/-/cropperjs-1.6.2.tgz#d1a5d627d880581cca41b7901f06923500e4201b"
+  integrity sha512-nhymn9GdnV3CqiEHJVai54TULFAE3VshJTXSqSJKa8yXAKyBKDWdhHarnlIPrshJ0WMFTGuFvG02YjLXfPiuOA==
+
 cross-spawn@^7.0.0, cross-spawn@^7.0.2, cross-spawn@^7.0.3:
   version "7.0.3"
   resolved "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz"
@@ -956,6 +987,11 @@ de-indent@^1.0.2:
   resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
   integrity sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==
 
+debounce@^1.2.0:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/debounce/-/debounce-1.2.1.tgz#38881d8f4166a5c5848020c11827b834bcb3e0a5"
+  integrity sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug==
+
 debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@^4.3.5:
   version "4.3.6"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.6.tgz#2ab2c38fbaffebf8aa95fdfe6d88438c7a13c52b"
@@ -997,6 +1033,11 @@ eastasianwidth@^0.2.0:
   resolved "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz"
   integrity sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==
 
+easy-bem@^1.0.2:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/easy-bem/-/easy-bem-1.1.1.tgz#1bfcc10425498090bcfddc0f9c000aba91399e03"
+  integrity sha512-GJRqdiy2h+EXy6a8E6R+ubmqUM08BK0FWNq41k24fup6045biQ8NXxoXimiwegMQvFFV3t1emADdGNL1TlS61A==
+
 emoji-regex@^8.0.0:
   version "8.0.0"
   resolved "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz"
@@ -1262,6 +1303,14 @@ foreground-child@^3.1.0:
     cross-spawn "^7.0.0"
     signal-exit "^4.0.1"
 
+fs-extra@2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-2.1.0.tgz#122ac03cf15a84dd89c7a5b4edb42b1b46265dbe"
+  integrity sha512-jX6W6pKa3sV+NBc7OFYEMe/2m/v51wnR+Q2pUIUywbsc5Ka83jbjgHtmBFP4GRtcxjbR74Lv4d0sz6Tr3JUKuQ==
+  dependencies:
+    graceful-fs "^4.1.2"
+    jsonfile "^2.1.0"
+
 fs.realpath@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
@@ -1334,6 +1383,11 @@ globby@^11.1.0:
     merge2 "^1.4.1"
     slash "^3.0.0"
 
+graceful-fs@^4.1.2, graceful-fs@^4.1.6:
+  version "4.2.11"
+  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.11.tgz#4183e4e8bf08bb6e05bbb2f7d2e0c8f712ca40e3"
+  integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==
+
 graphemer@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/graphemer/-/graphemer-1.4.0.tgz#fb2f1d55e0e3a1849aeffc90c4fa0dd53a0e66c6"
@@ -1406,6 +1460,13 @@ is-extglob@^2.1.1:
   resolved "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
   integrity sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==
 
+is-fullwidth-code-point@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz#ef9e31386f031a7f0d643af82fde50c457ef00cb"
+  integrity sha512-1pqUqRjkhPJ9miNq9SwMfdvi6lBJcd6eFxvfaivQhaH3SgisfiuudvFntdKOmxuee/77l+FPjKrQjWvmPjWrRw==
+  dependencies:
+    number-is-nan "^1.0.0"
+
 is-fullwidth-code-point@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz"
@@ -1479,6 +1540,13 @@ json-stable-stringify-without-jsonify@^1.0.1:
   resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651"
   integrity sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==
 
+jsonfile@^2.1.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-2.4.0.tgz#3736a2b428b87bbda0cc83b53fa3d633a35c2ae8"
+  integrity sha512-PKllAqbgLgxHaj8TElYymKCAgrASebJrWpTnEkOaTowt23VKXXN0sUeriJ+eh7y6ufb/CC5ap11pz71/cM0hUw==
+  optionalDependencies:
+    graceful-fs "^4.1.6"
+
 keyv@^4.5.3:
   version "4.5.4"
   resolved "https://registry.yarnpkg.com/keyv/-/keyv-4.5.4.tgz#a879a99e29452f942439f2a405e3af8b31d4de93"
@@ -1529,6 +1597,11 @@ lodash.merge@^4.6.2:
   resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
   integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
 
+lodash@^3.10.1:
+  version "3.10.1"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
+  integrity sha512-9mDDwqVIma6OZX79ZlDACZl8sBm0TEnkf99zV3iMA4GzkIT/9hiqP5mY0HoT1iNLCrKc/R1HByV+yJfRWVJryQ==
+
 lodash@^4.17.21:
   version "4.17.21"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
@@ -1652,6 +1725,11 @@ nth-check@^2.1.1:
   dependencies:
     boolbase "^1.0.0"
 
+number-is-nan@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
+  integrity sha512-4jbtZXNAsfZbAHiiqjLPBiCl16dES1zI4Hpzzxw61Tk+loF+sBDBKx1ICKKKwIqQ7M0mFn1TmkN7euSncWgHiQ==
+
 object-assign@^4.0.1:
   version "4.1.1"
   resolved "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
@@ -2027,6 +2105,15 @@ source-map-js@^1.2.0:
     is-fullwidth-code-point "^3.0.0"
     strip-ansi "^6.0.1"
 
+string-width@^1.0.1:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/string-width/-/string-width-1.0.2.tgz#118bdf5b8cdc51a2a7e70d211e07e2b0b9b107d3"
+  integrity sha512-0XsVpQLnVCXHJfyEs8tC0zpTVIr5PKKsQtkT29IwupnPTjtPmQ3xT/4yCREF9hYkV/3M3kzcUTSAZT6a6h81tw==
+  dependencies:
+    code-point-at "^1.0.0"
+    is-fullwidth-code-point "^1.0.0"
+    strip-ansi "^3.0.0"
+
 string-width@^4.1.0:
   version "4.2.3"
   resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz"
@@ -2052,6 +2139,13 @@ string-width@^5.0.1, string-width@^5.1.2:
   dependencies:
     ansi-regex "^5.0.1"
 
+strip-ansi@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-3.0.1.tgz#6a385fb8853d952d5ff05d0e8aaf94278dc63dcf"
+  integrity sha512-VhumSSbBqDTP8p2ZLKj40UjBCV4+v8bUSEpUb4KjRgWk9pbqGF4REFj6KEagidb2f/M6AzC0EmFyDNGaw9OCzg==
+  dependencies:
+    ansi-regex "^2.0.0"
+
 strip-ansi@^6.0.0, strip-ansi@^6.0.1:
   version "6.0.1"
   resolved "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz"
@@ -2103,6 +2197,11 @@ supports-preserve-symlinks-flag@^1.0.0:
   resolved "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz"
   integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
 
+sync-exec@0.6.2:
+  version "0.6.2"
+  resolved "https://registry.yarnpkg.com/sync-exec/-/sync-exec-0.6.2.tgz#717d22cc53f0ce1def5594362f3a89a2ebb91105"
+  integrity sha512-FHup6L3hMWn+2asiIC/7kj/3CaMM8aAAKPx62DRk42hQkz4H2yBADR0OnnY8Eh5Bxrzb371aPUfnW4WzAUYItQ==
+
 synckit@^0.9.1:
   version "0.9.1"
   resolved "https://registry.yarnpkg.com/synckit/-/synckit-0.9.1.tgz#febbfbb6649979450131f64735aa3f6c14575c88"
@@ -2312,6 +2411,15 @@ vscode-uri@^3.0.8:
   resolved "https://registry.yarnpkg.com/vscode-uri/-/vscode-uri-3.0.8.tgz#1770938d3e72588659a172d0fd4642780083ff9f"
   integrity sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==
 
+vue-advanced-cropper@^2.8.9:
+  version "2.8.9"
+  resolved "https://registry.yarnpkg.com/vue-advanced-cropper/-/vue-advanced-cropper-2.8.9.tgz#119ec7ade91dcf80fb22940ecbbf265ad0ae1bc4"
+  integrity sha512-1jc5gO674kVGpJKekoaol6ZlwaF5VYDLSBwBOUpViW0IOrrRsyLw6XNszjEqgbavvqinlKNS6Kqlom3B5M72Tw==
+  dependencies:
+    classnames "^2.2.6"
+    debounce "^1.2.0"
+    easy-bem "^1.0.2"
+
 vue-demi@>=0.14.8, vue-demi@^0.14.8:
   version "0.14.10"
   resolved "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz"
@@ -2412,6 +2520,13 @@ yaml@^2.3.4:
   resolved "https://registry.npmjs.org/yaml/-/yaml-2.5.0.tgz"
   integrity sha512-2wWLbGbYDiSqqIKoPjar3MPgB94ErzCtrNE1FdqGuaO0pi2JGjmE8aW8TDZwzU7vuxcGRdL/4gPQwQ7hD5AMSw==
 
+yargs-parser@4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-4.0.2.tgz#7f7173a8c7cca1d81dc7c18692fc07c2c2e2b1e0"
+  integrity sha512-feHRNN1ZO0vCSbl0wpkJvOzufe8I5xFNFKwjlDrc1Or77ITu5FZXe0tK8mcHy6ctxKaDloT49EiwzzhNlbypQw==
+  dependencies:
+    camelcase "^3.0.0"
+
 yocto-queue@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"