Home Explore Help
Register Sign In
caner
/
screenshot-vue
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Signed-off-by: Caner <5658514@qq.com>

Caner 2 years ago
parent
5a5fd935c2
commit
121287af21
14 changed files with 651 additions and 0 deletions
Split View Show Diff Stats
  1. 1 0
      .env
  2. 14 0
      index.html
  3. 14 0
      package.json
  4. 274 0
      src/App.vue
  5. 1 0
      src/assets/icons/cicle.svg
  6. 3 0
      src/assets/icons/close.svg
  7. 1 0
      src/assets/icons/font.svg
  8. 1 0
      src/assets/icons/rect.svg
  9. 1 0
      src/assets/icons/rightTop.svg
  10. 1 0
      src/assets/icons/write.svg
  11. 25 0
      src/components/icon.vue
  12. 57 0
      src/main.ts
  13. 31 0
      vite.config.ts
  14. 227 0
      yarn.lock

+ 1 - 0
.env
View File 

@@ -0,0 +1 @@
 
+VITE_PROXY_URL=http://sms_test.zkyxit.com:9090/api/

+ 14 - 0
index.html
View File 

@@ -0,0 +1,14 @@
 
+<!DOCTYPE html>
 
+<html lang="zh">
 
+  <head>
 
+    <meta charset="UTF-8" />
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+    <style>
 
+      html,body{user-select: none;margin: 0;padding: 0;}
 
+    </style>
 
+  </head>
 
+  <body>
 
+    <div id="app"></div>
 
+    <script type="module" src="./src/main.ts"></script>
 
+  </body>
 
+</html>

+ 14 - 0
package.json
View File 

@@ -0,0 +1,14 @@
 
+{
 
+  "name": "sms_app_vide_chat",
 
+  "private": true,
 
+  "version": "0.0.1",
 
+  "scripts": {
 
+    "dev": "vite",
 
+    "build": "vite build"
 
+  },
 
+  "dependencies": {
 
+  },
 
+  "devDependencies": {
 
+    "vite": "4.1.3"
 
+  }
 
+}

+ 274 - 0
src/App.vue
View File 

@@ -0,0 +1,274 @@
 
+
 
+<script setup lang="ts">
 
+import { ref } from 'vue'
 
+
 
+const capBox = ref({ left: '10px', top: '10px', width: '0px', height: '0px' })
 
+const capImg = ref({ width: window.innerWidth + 'px', height: window.innerHeight + 'px', transform: 'translate(-5px,-5px)' })
 
+const toolStyle = ref({ left: '10px', top: '10px' })
 
+const showTool = ref(false)
 
+
 
+function capBoxMove(e: any) {
 
+    const dom = e.target
 
+    const sx = e.layerX
 
+    const sy = e.layerY
 
+    showTool.value = false
 
+    const who = dom.dataset.id
 
+    console.log(666, e);
 
+
 
+    // let pdom = e.target.parentElement
 
+    // while (window.getComputedStyle(pdom).position !== 'relative' && pdom !== document.body) {
 
+    //     pdom = pdom.parentElement
 
+    // }
 
+
 
+    if (who === 'screen') {
 
+        capBox.value.width = '0px'
 
+        capBox.value.height = '0px'
 
+        capBox.value.left = sx + 'px'
 
+        capBox.value.top = sy + 'px'
 
+    }else if(who === 'close'){
 
+        capBox.value.width = '0px'
 
+        capBox.value.height = '0px'
 
+        showTool.value = false
 
+    }
 
+
 
+    // const cW = +window.getComputedStyle(dom).width.replace('px', '')
 
+    // const cH = +window.getComputedStyle(dom).height.replace('px', '')
 
+    document.onmousemove = em => {
 
+        if (who === 'screen') {
 
+            const w = em.x - sx
 
+            const h = em.y - sy
 
+            if (w >= 0 && h >= 0) {
 
+                capBox.value.width = w + 'px'
 
+                capBox.value.height = h + 'px'
 
+                toolStyle.value.left = (em.x - 200) + 'px'
 
+                toolStyle.value.top = (em.y + 20) + 'px'
 
+                capImg.value.transform = `translate(${w}px,${h}px)`
 
+            }
 
+
 
+        }
 
+        // const x = e.x - cW / 2
 
+        // const y = e.y - cH / 2
 
+
 
+        // // 移动
 
+        // if (dom.className === 'screen-box-border') {
 
+        //     // 计算移动当前元素的位置，并且给该元素样式中的left和top值赋值
 
+        //     dom.parentElement.style.left = x + 'px'
 
+        //     dom.parentElement.style.top = y + 'px'
 
+        // } else if (dom.className === 'screen-box-border-right-bottom') {
 
+        //     // 改变宽高
 
+        //     console.log(123, x, y, dom.parentElement);
 
+        //     const w = x - dom.parentElement.offsetLeft
 
+        //     const h = y - dom.parentElement.offsetTop
 
+        //     dom.parentElement.parentElement.style.width = w + cW + 'px'
 
+        //     dom.parentElement.parentElement.style.height = h + cH + 'px'
 
+        // }
 
+
 
+    }
 
+    document.onmouseup = () => {
 
+        document.onmousemove = null
 
+        document.onmouseup = null
 
+        document.onselectstart = null
 
+        showTool.value = !!+capBox.value.width.replace('px', '')
 
+    }
 
+}
 
+
 
+function close() {
 
+    showTool.value = false
 
+}
 
+
 
+</script>
 
+<template>
 
+    <div class="screen" @mousedown="capBoxMove">
 
+        <img class="screenshots-background-image" src="https://nashaofu.github.io/screenshots/assets/image-5cf1218d.jpg">
 
+        <!-- mark -->
 
+        <div class="screen-mark" data-id="screen"></div>
 
+        <!-- capBox -->
 
+        <div class="screen-box" :style="capBox">
 
+            <div class="screen-box-border">
 
+                <img class="screen-box-border-image" :style="capImg"
 
+                    src="https://nashaofu.github.io/screenshots/assets/image-5cf1218d.jpg" v-drag>
 
+
 
+                <div class="screen-box-border-top-left"></div>
 
+                <div class="screen-box-border-top-center"></div>
 
+                <div class="screen-box-border-top-right"></div>
 
+                <div class="screen-box-border-right-center"></div>
 
+                <div class="screen-box-border-right-bottom"></div>
 
+                <div class="screen-box-border-bottom-center"></div>
 
+                <div class="screen-box-border-bottom-left"></div>
 
+                <div class="screen-box-border-left-center"></div>
 
+            </div>
 
+
 
+            <div class="screen-box-mark">120x120</div>
 
+        </div>
 
+        <!-- tool -->
 
+        <div class="screen-tool" v-if="showTool" :style="toolStyle">
 
+            <icon name="rect" color="#333" :size="21" />
 
+            <icon name="cicle" color="#333" :size="22" />
 
+            <icon name="rightTop" color="#333" :size="22" />
 
+            <icon name="font" color="#333" :size="22" />
 
+            <icon name="close" color="#333" :size="22" data-id="close"/>
 
+            <icon name="write" color="#333" :size="22" />
 
+        </div>
 
+
 
+    </div>
 
+</template>
 
+<style scoped lang="scss">
 
+.screen {
 
+    background: grey;
 
+    width: 100vw;
 
+    height: 100vh;
 
+    overflow: hidden;
 
+    position: relative;
 
+
 
+    img {
 
+        width: 100%;
 
+        height: 100%;
 
+        user-select: none;
 
+        pointer-events: none;
 
+    }
 
+
 
+    &-mark {
 
+        position: absolute;
 
+        width: 100%;
 
+        height: 100%;
 
+        background-color: rgba($color: #000000, $alpha: 0.5);
 
+        left: 0;
 
+        top: 0;
 
+        z-index: 1;
 
+    }
 
+
 
+    &-box {
 
+        position: absolute;
 
+        width: 500px;
 
+        height: 500px;
 
+        z-index: 5;
 
+        left: 0;
 
+        top: 0;
 
+        overflow: hidden;
 
+        display: flex;
 
+        align-items: center;
 
+        justify-content: center;
 
+        cursor: move;
 
+
 
+        &-border {
 
+            box-sizing: border-box;
 
+            border: solid 2px #39f;
 
+            width: calc(100% - 4px);
 
+            height: calc(100% - 4px);
 
+            font-size: 0;
 
+            overflow: hidden;
 
+
 
+            &>div {
 
+                width: 7px;
 
+                height: 7px;
 
+                overflow: hidden;
 
+                background: #39f;
 
+                position: absolute;
 
+                border-radius: 50%;
 
+            }
 
+
 
+            &-top-left {
 
+                left: 0;
 
+                top: 0;
 
+                cursor: nw-resize;
 
+            }
 
+
 
+            &-top-right {
 
+                right: 0;
 
+                top: 0;
 
+                cursor: ne-resize;
 
+            }
 
+
 
+            &-top-center {
 
+                top: 0;
 
+                left: 50%;
 
+                cursor: n-resize;
 
+            }
 
+
 
+            &-bottom-center {
 
+                bottom: 0;
 
+                left: 50%;
 
+                cursor: s-resize;
 
+            }
 
+
 
+            &-bottom-left {
 
+                left: 0;
 
+                bottom: 0;
 
+                cursor: sw-resize;
 
+            }
 
+
 
+            &-right-center {
 
+                right: 0;
 
+                top: 50%;
 
+                cursor: w-resize;
 
+            }
 
+
 
+            &-right-bottom {
 
+                right: 0;
 
+                bottom: 0;
 
+                cursor: se-resize;
 
+            }
 
+
 
+            &-left-center {
 
+                left: 0;
 
+                top: 50%;
 
+                cursor: e-resize;
 
+            }
 
+        }
 
+
 
+        &-mark {
 
+            padding: 5px;
 
+            background: rgba($color: #000000, $alpha: 0.5);
 
+            color: white;
 
+            font-size: 12px;
 
+            position: absolute;
 
+            bottom: 8px;
 
+            left: 50%;
 
+            transform: translate(-50%, 0);
 
+        }
 
+
 
+
 
+    }
 
+
 
+    &-move-box {
 
+        position: absolute;
 
+        left: 0;
 
+        top: 0;
 
+        z-index: 6;
 
+
 
+        &>p {
 
+            color: #fff;
 
+            font-size: 11px;
 
+            background-color: #5f5e5e;
 
+            padding: 5px;
 
+            white-space: nowrap;
 
+            overflow: hidden;
 
+            text-align: left;
 
+            margin: 0;
 
+        }
 
+    }
 
+
 
+    &-tool {
 
+        position: absolute;
 
+        width: 200px;
 
+        height: 30px;
 
+        left: 300px;
 
+        top: 510px;
 
+        z-index: 6;
 
+        background: white;
 
+        border-radius: 3px;
 
+        display: flex;
 
+        justify-content: space-evenly;
 
+        align-items: center;
 
+
 
+        &>svg {
 
+            box-sizing: border-box;
 
+        }
 
+
 
+        &>svg:hover {
 
+            border: solid black 1px;
 
+            cursor: pointer;
 
+        }
 
+    }
 
+}
 
+</style>

+ 1 - 0
src/assets/icons/cicle.svg
View File 

@@ -0,0 +1 @@
 
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1686904416503" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9093" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512.005117 958.708971C265.683035 958.708971 65.290005 758.316965 65.290005 511.99386c0-246.310825 200.39303-446.703855 446.715111-446.703855 246.310825 0 446.703855 200.39303 446.703855 446.703855C958.708971 758.316965 758.316965 958.708971 512.005117 958.708971zM512.005117 169.716356c-188.738595 0-342.289784 153.545048-342.289784 342.277504 0 188.738595 153.551188 342.289784 342.289784 342.289784 188.733479 0 342.278527-153.551188 342.278527-342.289784C854.283644 323.261405 700.738595 169.716356 512.005117 169.716356z" p-id="9094" fill="#333333"></path></svg>

+ 3 - 0
src/assets/icons/close.svg
View File 

@@ -0,0 +1,3 @@
 
+<svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
 
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.71148 6.00003L9.89087 2.82065L9.17852 2.10829L5.99916 5.28765L2.81978 2.10828L2.10743 2.82063L5.28677 5.99998L2.10742 9.17933L2.81978 9.89169L5.99913 6.71234L9.17849 9.8917L9.89081 9.17938L6.71148 6.00003Z" />
 
+</svg>

+ 1 - 0
src/assets/icons/font.svg
View File 

@@ -0,0 +1 @@
 
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1686904206446" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5055" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M563.2 281.6V870.4a51.2 51.2 0 0 1-102.4 0V281.6H179.2a51.2 51.2 0 1 1 0-102.4h665.6a51.2 51.2 0 0 1 0 102.4H563.2z" fill="#333333" p-id="5056"></path></svg>

+ 1 - 0
src/assets/icons/rect.svg
View File 

@@ -0,0 +1 @@
 
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1686904474833" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10991" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M896 128v768H128V128h768m0-64H128c-32 0-64 32-64 64v768c0 32 32 64 64 64h768c32 0 64-32 64-64V128c0-32-32-64-64-64z" fill="#333333" p-id="10992"></path></svg>

+ 1 - 0
src/assets/icons/rightTop.svg
View File 

@@ -0,0 +1 @@
 
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1686904356563" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7185" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M708.266667 401.066667V597.333333h85.333333V256h-341.333333v85.333333h196.266666L256 733.866667l59.733333 59.733333 392.533334-392.533333z" fill="#333333" p-id="7186"></path></svg>

+ 1 - 0
src/assets/icons/write.svg
View File 

@@ -0,0 +1 @@
 
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1686904269338" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6050" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M869.66 102.485L366.342 603.814 165.799 393.745 80.46 479.083l285.882 295.409 588.657-586.667-85.34-85.339z" p-id="6051"></path></svg>

+ 25 - 0
src/components/icon.vue
View File 

@@ -0,0 +1,25 @@
 
+<script setup lang="ts">
 
+import { computed } from 'vue'
 
+const props = defineProps<{
 
+  name: string,
 
+  size?: number,
 
+  color?: string
 
+}>()
 
+const symbolId = computed(() => `#icon-${props.name}`)
 
+const newColor = computed(() => `${props.color ?? '#ccc'}`)
 
+const newSize = computed(() => `${props.size ?? 16}`)
 
+</script>
 
+<template>
 
+  <svg
 
+    aria-hidden="true"
 
+    :font-size="newSize"
 
+    :width="newSize"
 
+    :height="newSize"
 
+  >
 
+
 
+    <use
 
+      :href="symbolId"
 
+      :fill="newColor"
 
+    />
 
+  </svg>
 
+</template>

+ 57 - 0
src/main.ts
View File 

@@ -0,0 +1,57 @@
 
+import { createApp } from 'vue'
 
+import App from './App.vue'
 
+import Icon from '@/components/icon.vue'
 
+import 'virtual:svg-icons-register'
 
+const app = createApp(App)
 
+// 自定义拖拽指令
 
+app.directive('drag', (el) => {
 
+  const oDiv = el // 当前元素
 
+  el.style.pointerEvents = null // 防止触发点击事件
 
+  oDiv.onmousedown = (e: Any) => {
 
+    // 找父级 是否是absolute来进行移动
 
+    let target = oDiv
 
+    while (window.getComputedStyle(target).position !== 'absolute' && target !== document.body) {
 
+      target = target.parentElement
 
+    }
 
+    // 找父级 是否是relative来进行宽度计算
 
+    let targetParent = target.parentElement
 
+    while (window.getComputedStyle(targetParent).position !== 'relative' && targetParent !== document.body) {
 
+      targetParent = targetParent.parentElement
 
+    }
 
+
 
+    document.onselectstart = () => {
 
+      return false
 
+    }
 
+
 
+    // 鼠标按下，计算当前元素距离可视区的距离
 
+    const disX = e.clientX - target.offsetLeft
 
+    const disY = e.clientY - target.offsetTop
 
+    const cW = +window.getComputedStyle(target).width.replace('px', '')
 
+    const cH = +window.getComputedStyle(target).height.replace('px', '')
 
+    const maxW = +window.getComputedStyle(targetParent).width.replace('px', '')
 
+    const maxH = +window.getComputedStyle(targetParent).height.replace('px', '')
 
+    document.onmousemove = e => {
 
+      // 通过事件委托，计算移动的距离
 
+      // 因为浏览器里并不能直接取到并且使用clientX、clientY,所以使用事件委托在内部做完赋值
 
+      el.style.pointerEvents = 'none'
 
+      const l = e.clientX - disX
 
+      const t = e.clientY - disY
 
+      const cl = maxW - cW
 
+      const ct = maxH - cH
 
+      // 计算移动当前元素的位置，并且给该元素样式中的left和top值赋值
 
+      target.style.left = (l < 0 ? 0 : l > cl ? cl : l) + 'px'
 
+      target.style.top = (t < 0 ? 0 : t > ct ? ct : t) + 'px'
 
+    }
 
+    document.onmouseup = e => {
 
+      el.style.pointerEvents = null
 
+      document.onmousemove = null
 
+      document.onmouseup = null
 
+      document.onselectstart = null
 
+    }
 
+    // return false不加的话可能导致黏连，拖到一个地方时div粘在鼠标上不下来，相当于onmouseup失效
 
+    return false
 
+  }
 
+})
 
+
 
+app.component('Icon', Icon)
 
+app.mount('#app')

+ 31 - 0
vite.config.ts
View File 

@@ -0,0 +1,31 @@
 
+import vue from '@vitejs/plugin-vue'
 
+import { defineConfig } from 'vite'
 
+import { resolve } from 'path'
 
+import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
 
+
 
+export default ({ mode }) => {
 
+  return defineConfig({
 
+    base: './',
 
+    build: {
 
+      emptyOutDir: true,
 
+      outDir: '../../build/dist/screen-shots'
 
+    },
 
+    server: {
 
+      host: '0.0.0.0',
 
+      port: 15440,
 
+      strictPort: true
 
+    },
 
+    resolve: {
 
+      alias: {
 
+        '@': resolve(__dirname, 'src')
 
+      }
 
+    },    
+    plugins: [
 
+      vue(),
 
+      createSvgIconsPlugin({
 
+        iconDirs: [resolve(__dirname, './src/assets/icons')],
 
+        symbolId: 'icon-[dir]-[name]'
 
+      })
 
+    ]
 
+  })
 
+}

+ 227 - 0
yarn.lock
View File 

@@ -0,0 +1,227 @@
 
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
 
+# yarn lockfile v1
 
+
 
+
 
+"@esbuild/android-arm64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/android-arm64/-/android-arm64-0.16.17.tgz#cf91e86df127aa3d141744edafcba0abdc577d23"
 
+  integrity sha512-MIGl6p5sc3RDTLLkYL1MyL8BMRN4tLMRCn+yRJJmEDvYZ2M7tmAf80hx1kbNEUX2KJ50RRtxZ4JHLvCfuB6kBg==
 
+
 
+"@esbuild/android-arm@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/android-arm/-/android-arm-0.16.17.tgz#025b6246d3f68b7bbaa97069144fb5fb70f2fff2"
 
+  integrity sha512-N9x1CMXVhtWEAMS7pNNONyA14f71VPQN9Cnavj1XQh6T7bskqiLLrSca4O0Vr8Wdcga943eThxnVp3JLnBMYtw==
 
+
 
+"@esbuild/android-x64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/android-x64/-/android-x64-0.16.17.tgz#c820e0fef982f99a85c4b8bfdd582835f04cd96e"
 
+  integrity sha512-a3kTv3m0Ghh4z1DaFEuEDfz3OLONKuFvI4Xqczqx4BqLyuFaFkuaG4j2MtA6fuWEFeC5x9IvqnX7drmRq/fyAQ==
 
+
 
+"@esbuild/darwin-arm64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/darwin-arm64/-/darwin-arm64-0.16.17.tgz#edef4487af6b21afabba7be5132c26d22379b220"
 
+  integrity sha512-/2agbUEfmxWHi9ARTX6OQ/KgXnOWfsNlTeLcoV7HSuSTv63E4DqtAc+2XqGw1KHxKMHGZgbVCZge7HXWX9Vn+w==
 
+
 
+"@esbuild/darwin-x64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/darwin-x64/-/darwin-x64-0.16.17.tgz#42829168730071c41ef0d028d8319eea0e2904b4"
 
+  integrity sha512-2By45OBHulkd9Svy5IOCZt376Aa2oOkiE9QWUK9fe6Tb+WDr8hXL3dpqi+DeLiMed8tVXspzsTAvd0jUl96wmg==
 
+
 
+"@esbuild/freebsd-arm64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.16.17.tgz#1f4af488bfc7e9ced04207034d398e793b570a27"
 
+  integrity sha512-mt+cxZe1tVx489VTb4mBAOo2aKSnJ33L9fr25JXpqQqzbUIw/yzIzi+NHwAXK2qYV1lEFp4OoVeThGjUbmWmdw==
 
+
 
+"@esbuild/freebsd-x64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/freebsd-x64/-/freebsd-x64-0.16.17.tgz#636306f19e9bc981e06aa1d777302dad8fddaf72"
 
+  integrity sha512-8ScTdNJl5idAKjH8zGAsN7RuWcyHG3BAvMNpKOBaqqR7EbUhhVHOqXRdL7oZvz8WNHL2pr5+eIT5c65kA6NHug==
 
+
 
+"@esbuild/linux-arm64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-arm64/-/linux-arm64-0.16.17.tgz#a003f7ff237c501e095d4f3a09e58fc7b25a4aca"
 
+  integrity sha512-7S8gJnSlqKGVJunnMCrXHU9Q8Q/tQIxk/xL8BqAP64wchPCTzuM6W3Ra8cIa1HIflAvDnNOt2jaL17vaW+1V0g==
 
+
 
+"@esbuild/linux-arm@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-arm/-/linux-arm-0.16.17.tgz#b591e6a59d9c4fe0eeadd4874b157ab78cf5f196"
 
+  integrity sha512-iihzrWbD4gIT7j3caMzKb/RsFFHCwqqbrbH9SqUSRrdXkXaygSZCZg1FybsZz57Ju7N/SHEgPyaR0LZ8Zbe9gQ==
 
+
 
+"@esbuild/linux-ia32@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-ia32/-/linux-ia32-0.16.17.tgz#24333a11027ef46a18f57019450a5188918e2a54"
 
+  integrity sha512-kiX69+wcPAdgl3Lonh1VI7MBr16nktEvOfViszBSxygRQqSpzv7BffMKRPMFwzeJGPxcio0pdD3kYQGpqQ2SSg==
 
+
 
+"@esbuild/linux-loong64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-loong64/-/linux-loong64-0.16.17.tgz#d5ad459d41ed42bbd4d005256b31882ec52227d8"
 
+  integrity sha512-dTzNnQwembNDhd654cA4QhbS9uDdXC3TKqMJjgOWsC0yNCbpzfWoXdZvp0mY7HU6nzk5E0zpRGGx3qoQg8T2DQ==
 
+
 
+"@esbuild/linux-mips64el@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-mips64el/-/linux-mips64el-0.16.17.tgz#4e5967a665c38360b0a8205594377d4dcf9c3726"
 
+  integrity sha512-ezbDkp2nDl0PfIUn0CsQ30kxfcLTlcx4Foz2kYv8qdC6ia2oX5Q3E/8m6lq84Dj/6b0FrkgD582fJMIfHhJfSw==
 
+
 
+"@esbuild/linux-ppc64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-ppc64/-/linux-ppc64-0.16.17.tgz#206443a02eb568f9fdf0b438fbd47d26e735afc8"
 
+  integrity sha512-dzS678gYD1lJsW73zrFhDApLVdM3cUF2MvAa1D8K8KtcSKdLBPP4zZSLy6LFZ0jYqQdQ29bjAHJDgz0rVbLB3g==
 
+
 
+"@esbuild/linux-riscv64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-riscv64/-/linux-riscv64-0.16.17.tgz#c351e433d009bf256e798ad048152c8d76da2fc9"
 
+  integrity sha512-ylNlVsxuFjZK8DQtNUwiMskh6nT0vI7kYl/4fZgV1llP5d6+HIeL/vmmm3jpuoo8+NuXjQVZxmKuhDApK0/cKw==
 
+
 
+"@esbuild/linux-s390x@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-s390x/-/linux-s390x-0.16.17.tgz#661f271e5d59615b84b6801d1c2123ad13d9bd87"
 
+  integrity sha512-gzy7nUTO4UA4oZ2wAMXPNBGTzZFP7mss3aKR2hH+/4UUkCOyqmjXiKpzGrY2TlEUhbbejzXVKKGazYcQTZWA/w==
 
+
 
+"@esbuild/linux-x64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/linux-x64/-/linux-x64-0.16.17.tgz#e4ba18e8b149a89c982351443a377c723762b85f"
 
+  integrity sha512-mdPjPxfnmoqhgpiEArqi4egmBAMYvaObgn4poorpUaqmvzzbvqbowRllQ+ZgzGVMGKaPkqUmPDOOFQRUFDmeUw==
 
+
 
+"@esbuild/netbsd-x64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/netbsd-x64/-/netbsd-x64-0.16.17.tgz#7d4f4041e30c5c07dd24ffa295c73f06038ec775"
 
+  integrity sha512-/PzmzD/zyAeTUsduZa32bn0ORug+Jd1EGGAUJvqfeixoEISYpGnAezN6lnJoskauoai0Jrs+XSyvDhppCPoKOA==
 
+
 
+"@esbuild/openbsd-x64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/openbsd-x64/-/openbsd-x64-0.16.17.tgz#970fa7f8470681f3e6b1db0cc421a4af8060ec35"
 
+  integrity sha512-2yaWJhvxGEz2RiftSk0UObqJa/b+rIAjnODJgv2GbGGpRwAfpgzyrg1WLK8rqA24mfZa9GvpjLcBBg8JHkoodg==
 
+
 
+"@esbuild/sunos-x64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/sunos-x64/-/sunos-x64-0.16.17.tgz#abc60e7c4abf8b89fb7a4fe69a1484132238022c"
 
+  integrity sha512-xtVUiev38tN0R3g8VhRfN7Zl42YCJvyBhRKw1RJjwE1d2emWTVToPLNEQj/5Qxc6lVFATDiy6LjVHYhIPrLxzw==
 
+
 
+"@esbuild/win32-arm64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/win32-arm64/-/win32-arm64-0.16.17.tgz#7b0ff9e8c3265537a7a7b1fd9a24e7bd39fcd87a"
 
+  integrity sha512-ga8+JqBDHY4b6fQAmOgtJJue36scANy4l/rL97W+0wYmijhxKetzZdKOJI7olaBaMhWt8Pac2McJdZLxXWUEQw==
 
+
 
+"@esbuild/win32-ia32@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/win32-ia32/-/win32-ia32-0.16.17.tgz#e90fe5267d71a7b7567afdc403dfd198c292eb09"
 
+  integrity sha512-WnsKaf46uSSF/sZhwnqE4L/F89AYNMiD4YtEcYekBt9Q7nj0DiId2XH2Ng2PHM54qi5oPrQ8luuzGszqi/veig==
 
+
 
+"@esbuild/win32-x64@0.16.17":
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/@esbuild/win32-x64/-/win32-x64-0.16.17.tgz#c5a1a4bfe1b57f0c3e61b29883525c6da3e5c091"
 
+  integrity sha512-y+EHuSchhL7FjHgvQL/0fnnFmO4T1bhvWANX6gcnqTjtnKWbTvUMCpGnv2+t+31d7RzyEAYAd4u2fnIhHL6N/Q==
 
+
 
+esbuild@^0.16.14:
 
+  version "0.16.17"
 
+  resolved "https://registry.npmmirror.com/esbuild/-/esbuild-0.16.17.tgz#fc2c3914c57ee750635fee71b89f615f25065259"
 
+  integrity sha512-G8LEkV0XzDMNwXKgM0Jwu3nY3lSTwSGY6XbxM9cr9+s0T/qSV1q1JVPBGzm3dcjhCic9+emZDmMffkwgPeOeLg==
 
+  optionalDependencies:
 
+    "@esbuild/android-arm" "0.16.17"
 
+    "@esbuild/android-arm64" "0.16.17"
 
+    "@esbuild/android-x64" "0.16.17"
 
+    "@esbuild/darwin-arm64" "0.16.17"
 
+    "@esbuild/darwin-x64" "0.16.17"
 
+    "@esbuild/freebsd-arm64" "0.16.17"
 
+    "@esbuild/freebsd-x64" "0.16.17"
 
+    "@esbuild/linux-arm" "0.16.17"
 
+    "@esbuild/linux-arm64" "0.16.17"
 
+    "@esbuild/linux-ia32" "0.16.17"
 
+    "@esbuild/linux-loong64" "0.16.17"
 
+    "@esbuild/linux-mips64el" "0.16.17"
 
+    "@esbuild/linux-ppc64" "0.16.17"
 
+    "@esbuild/linux-riscv64" "0.16.17"
 
+    "@esbuild/linux-s390x" "0.16.17"
 
+    "@esbuild/linux-x64" "0.16.17"
 
+    "@esbuild/netbsd-x64" "0.16.17"
 
+    "@esbuild/openbsd-x64" "0.16.17"
 
+    "@esbuild/sunos-x64" "0.16.17"
 
+    "@esbuild/win32-arm64" "0.16.17"
 
+    "@esbuild/win32-ia32" "0.16.17"
 
+    "@esbuild/win32-x64" "0.16.17"
 
+
 
+fsevents@~2.3.2:
 
+  version "2.3.2"
 
+  resolved "https://registry.npmmirror.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
 
+  integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
 
+
 
+function-bind@^1.1.1:
 
+  version "1.1.1"
 
+  resolved "https://registry.npmmirror.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
 
+  integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==
 
+
 
+has@^1.0.3:
 
+  version "1.0.3"
 
+  resolved "https://registry.npmmirror.com/has/-/has-1.0.3.tgz#722d7cbfc1f6aa8241f16dd814e011e1f41e8796"
 
+  integrity sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==
 
+  dependencies:
 
+    function-bind "^1.1.1"
 
+
 
+is-core-module@^2.11.0:
 
+  version "2.12.1"
 
+  resolved "https://registry.npmmirror.com/is-core-module/-/is-core-module-2.12.1.tgz#0c0b6885b6f80011c71541ce15c8d66cf5a4f9fd"
 
+  integrity sha512-Q4ZuBAe2FUsKtyQJoQHlvP8OvBERxO3jEmy1I7hcRXcJBGGHFh/aJBswbXuS9sgrDH2QUO8ilkwNPHvHMd8clg==
 
+  dependencies:
 
+    has "^1.0.3"
 
+
 
+nanoid@^3.3.6:
 
+  version "3.3.6"
 
+  resolved "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c"
 
+  integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==
 
+
 
+path-parse@^1.0.7:
 
+  version "1.0.7"
 
+  resolved "https://registry.npmmirror.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735"
 
+  integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==
 
+
 
+picocolors@^1.0.0:
 
+  version "1.0.0"
 
+  resolved "https://registry.npmmirror.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
 
+  integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
 
+
 
+postcss@^8.4.21:
 
+  version "8.4.23"
 
+  resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.23.tgz#df0aee9ac7c5e53e1075c24a3613496f9e6552ab"
 
+  integrity sha512-bQ3qMcpF6A/YjR55xtoTr0jGOlnPOKAIMdOWiv0EIT6HVPEaJiJB4NLljSbiHoC2RX7DN5Uvjtpbg1NPdwv1oA==
 
+  dependencies:
 
+    nanoid "^3.3.6"
 
+    picocolors "^1.0.0"
 
+    source-map-js "^1.0.2"
 
+
 
+resolve@^1.22.1:
 
+  version "1.22.2"
 
+  resolved "https://registry.npmmirror.com/resolve/-/resolve-1.22.2.tgz#0ed0943d4e301867955766c9f3e1ae6d01c6845f"
 
+  integrity sha512-Sb+mjNHOULsBv818T40qSPeRiuWLyaGMa5ewydRLFimneixmVy2zdivRl+AF6jaYPC8ERxGDmFSiqui6SfPd+g==
 
+  dependencies:
 
+    is-core-module "^2.11.0"
 
+    path-parse "^1.0.7"
 
+    supports-preserve-symlinks-flag "^1.0.0"
 
+
 
+rollup@^3.10.0:
 
+  version "3.22.0"
 
+  resolved "https://registry.npmmirror.com/rollup/-/rollup-3.22.0.tgz#e6671baebdd473154ac7998bbc57faabcd7bba20"
 
+  integrity sha512-imsigcWor5Y/dC0rz2q0bBt9PabcL3TORry2hAa6O6BuMvY71bqHyfReAz5qyAqiQATD1m70qdntqBfBQjVWpQ==
 
+  optionalDependencies:
 
+    fsevents "~2.3.2"
 
+
 
+source-map-js@^1.0.2:
 
+  version "1.0.2"
 
+  resolved "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
 
+  integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
 
+
 
+supports-preserve-symlinks-flag@^1.0.0:
 
+  version "1.0.0"
 
+  resolved "https://registry.npmmirror.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
 
+  integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
 
+
 
+vite@4.1.3:
 
+  version "4.1.3"
 
+  resolved "https://registry.npmmirror.com/vite/-/vite-4.1.3.tgz#001a038c3a7757d532787c0de429b8368136ded5"
 
+  integrity sha512-0Zqo4/Fr/swSOBmbl+HAAhOjrqNwju+yTtoe4hQX9UsARdcuc9njyOdr6xU0DDnV7YP0RT6mgTTOiRtZgxfCxA==
 
+  dependencies:
 
+    esbuild "^0.16.14"
 
+    postcss "^8.4.21"
 
+    resolve "^1.22.1"
 
+    rollup "^3.10.0"
 
+  optionalDependencies:
 
+    fsevents "~2.3.2"