├── .babelrc ├── .editorconfig ├── .gitignore ├── .prettierrc ├── .yarnrc.yml ├── CHANGELOG.md ├── LICENSE ├── README.md ├── dist ├── vue-screen-size.esm.js ├── vue-screen-size.min.js └── vue-screen-size.umd.js ├── docs ├── assets │ ├── index.3331e506.css │ └── index.6494c871.js └── index.html ├── example ├── App.vue ├── index.html └── index.js ├── package.json ├── rollup.config.js ├── src ├── index.js ├── types.d.ts └── vue-screen-size.js ├── test └── VueScreenSize.spec.js ├── vite.config.js └── yarn.lock /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | "modules": false 7 | } 8 | ] 9 | ], 10 | "env": { 11 | "test": { 12 | "presets": [ 13 | [ 14 | "@babel/preset-env", 15 | { 16 | "targets": { 17 | "node": "current" 18 | } 19 | } 20 | ] 21 | ] 22 | } 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | end_of_line = lf 6 | indent_size = 2 7 | indent_style = space 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | trim_trailing_whitespace = false 13 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | 4 | # https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored 5 | .pnp.* 6 | .yarn/* 7 | !.yarn/patches 8 | !.yarn/plugins 9 | !.yarn/releases 10 | !.yarn/sdks 11 | !.yarn/versions 12 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 100, 3 | "semi": true, 4 | "singleQuote": true, 5 | "tabWidth": 2, 6 | "trailingComma": "all", 7 | "useTabs": false 8 | } 9 | -------------------------------------------------------------------------------- /.yarnrc.yml: -------------------------------------------------------------------------------- 1 | enableTelemetry: false 2 | nodeLinker: node-modules 3 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # CHANGELOG.md 2 | 3 | ## 2.1.0 4 | 5 | - Added basic TypeScript support though a manual .d.ts file. Thank you @LittleBigBug. 6 | 7 | ## 2.0.4 8 | 9 | - Upgrade package to support Vue 3. Vue 2 support can be found at `v1.0.1`. 10 | 11 | ## 1.0.0 (2019-02-27) 12 | 13 | - Initial work 14 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 John Datserakis 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vue-screen-size 2 | 3 | Get easy and reactive access to the width and height of your screen. 4 | 5 |

6 | NPM Version 7 | NPM Downloads 8 | License 9 | 10 | Tweet 11 |

12 | 13 | ## Vue 3 Support 14 | 15 | Vue 3 is supported from `v2.0.0` and beyond (current `master`). To use `vue-screen-size` with Vue 2, use `v1.0.1`. 16 | 17 | ## Links 18 | 19 | - [Demo](https://johndatserakis.github.io/vue-screen-size/) 20 | - [GitHub](https://github.com/johndatserakis/vue-screen-size) 21 | - [npm](https://www.npmjs.com/package/vue-screen-size) 22 | 23 | ## Install 24 | 25 | ```bash 26 | yarn add vue-screen-size 27 | ``` 28 | 29 | Or you can include it through the browser at the bottom of your page: 30 | 31 | ```html 32 | 33 | ``` 34 | 35 | ## About 36 | 37 | Sometimes when building an app you need to have access to the screen's dimensions. Usually that's going to be done in the css using `@media` - but sometimes you need to access that info right in your JavaScript. 38 | 39 | The issue with this is you have to worry about adding event listeners and then removing them later. We wanted to just be able to import something quickly and then be able to forget about it later. So this `mixin` does just that - just use `Vue.use()` or `mixins: [],` and you're off. 40 | 41 | There is something to consider - where and how you include this library. There are two ways, make sure to be aware of the differences: 42 | 43 | ## Usage Example 1 - Whole app has access (Not Recommended) 44 | 45 | In this usage - your whole app - and every child component - has access to the `$vssWidth`, `$vssHeight`, and `$vssEvent` variables. This is sorta pollutive though, as multiple instances of the mixin are initialized and it's kinda wasteful. The is due to the way Vue mixins are passed down to child components. You can read more about this [here](https://vuejs.org/v2/guide/mixins.html#Global-Mixin). The second example is recommended. 46 | 47 | ```javascript 48 | import { VueScreenSizeMixin } from 'vue-screen-size'; 49 | 50 | app.mixin(VueScreenSizeMixin); 51 | 52 | // Access `this.$vssWidth`, `this.$vssHeight`, and `this.$vssEvent` anywhere in your app. 53 | ``` 54 | 55 | ## Usage Example 2 - Just the component you install it on has access - (Recommended) 56 | 57 | In this usage - the component you install it on will have access to the `$vssWidth`, `$vssHeight`, and `$vssEvent` variables. This may be a bit more restrictive, but it's less wasteful and should give you better performance. 58 | 59 | ```javascript 60 | import { VueScreenSizeMixin } from 'vue-screen-size'; 61 | 62 | export default { 63 | mixins: [VueScreenSizeMixin], 64 | }; 65 | 66 | // Access `this.$vssWidth`, `this.$vssHeight`, and `this.$vssEvent` in your component. 67 | ``` 68 | 69 | ## Variables 70 | 71 | | name | type | description | 72 | | ---------- | ------ | ---------------------------------------------- | 73 | | $vssWidth | Number | The width of your screen | 74 | | $vssHeight | Number | The height of your screen | 75 | | $vssEvent | Object | The event object data from the resizing event. | 76 | 77 | ## Methods 78 | 79 | | method | parameters | description | 80 | | ------------------- | ---------- | ------------------------------------------------ | 81 | | $vssDestroyListener | none | Force the removal of the attached event listener | 82 | 83 | ## Development 84 | 85 | ```bash 86 | # Install dependencies 87 | yarn 88 | 89 | # Serve with hot reload 90 | yarn dev 91 | 92 | # Run the tests 93 | yarn test 94 | 95 | # Build demo page 96 | yarn build:example 97 | 98 | # Build library 99 | yarn build:library 100 | 101 | # Build everything and run tests 102 | yarn build 103 | ``` 104 | 105 | ## Other 106 | 107 | Go ahead and fork the project! Submit an issue if needed. Have fun! 108 | 109 | ## License 110 | 111 | [MIT](http://opensource.org/licenses/MIT) 112 | -------------------------------------------------------------------------------- /dist/vue-screen-size.esm.js: -------------------------------------------------------------------------------- 1 | var VueScreenSizeMixin = { 2 | data: function data() { 3 | return { 4 | event: null, 5 | vssWidth: null, 6 | vssHeight: null, 7 | }; 8 | }, 9 | computed: { 10 | $vssEvent: function $vssEvent() { 11 | return this.event; 12 | }, 13 | $vssWidth: function $vssWidth() { 14 | return this.vssWidth || this.getScreenWidth(); 15 | }, 16 | $vssHeight: function $vssHeight() { 17 | return this.vssHeight || this.getScreenHeight(); 18 | }, 19 | }, 20 | methods: { 21 | getScreenWidth: function getScreenWidth() { 22 | return window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; 23 | }, 24 | getScreenHeight: function getScreenHeight() { 25 | return ( 26 | window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight 27 | ); 28 | }, 29 | handleResize: function handleResize(event) { 30 | this.event = event; 31 | this.vssWidth = this.getScreenWidth(); 32 | this.vssHeight = this.getScreenHeight(); 33 | }, 34 | $vssDestroyListener: function $vssDestroyListener() { 35 | window.removeEventListener('resize', this.handleResize); 36 | }, 37 | }, 38 | mounted: function mounted() { 39 | window.addEventListener('resize', this.handleResize); 40 | }, 41 | destroyed: function destroyed() { 42 | window.removeEventListener('resize', this.handleResize); 43 | }, 44 | }; 45 | 46 | var install = function (app) { 47 | app.mixin(VueScreenSizeMixin); 48 | }; 49 | 50 | export default install; 51 | export { VueScreenSizeMixin }; 52 | -------------------------------------------------------------------------------- /dist/vue-screen-size.min.js: -------------------------------------------------------------------------------- 1 | var VueScreenSize=function(e){"use strict";var t={data:function(){return{event:null,vssWidth:null,vssHeight:null}},computed:{$vssEvent:function(){return this.event},$vssWidth:function(){return this.vssWidth||this.getScreenWidth()},$vssHeight:function(){return this.vssHeight||this.getScreenHeight()}},methods:{getScreenWidth:function(){return window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth},getScreenHeight:function(){return window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight},handleResize:function(e){this.event=e,this.vssWidth=this.getScreenWidth(),this.vssHeight=this.getScreenHeight()},$vssDestroyListener:function(){window.removeEventListener("resize",this.handleResize)}},mounted:function(){window.addEventListener("resize",this.handleResize)},destroyed:function(){window.removeEventListener("resize",this.handleResize)}};return e.VueScreenSizeMixin=t,e.default=function(e){e.mixin(t)},e}({}); 2 | -------------------------------------------------------------------------------- /dist/vue-screen-size.umd.js: -------------------------------------------------------------------------------- 1 | (function (global, factory) { 2 | typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) : 3 | typeof define === 'function' && define.amd ? define(['exports'], factory) : 4 | (global = global || self, factory(global.VueScreenSize = {})); 5 | }(this, (function (exports) { 'use strict'; 6 | 7 | var VueScreenSizeMixin = { 8 | data: function data() { 9 | return { 10 | event: null, 11 | vssWidth: null, 12 | vssHeight: null, 13 | }; 14 | }, 15 | computed: { 16 | $vssEvent: function $vssEvent() { 17 | return this.event; 18 | }, 19 | $vssWidth: function $vssWidth() { 20 | return this.vssWidth || this.getScreenWidth(); 21 | }, 22 | $vssHeight: function $vssHeight() { 23 | return this.vssHeight || this.getScreenHeight(); 24 | }, 25 | }, 26 | methods: { 27 | getScreenWidth: function getScreenWidth() { 28 | return window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; 29 | }, 30 | getScreenHeight: function getScreenHeight() { 31 | return ( 32 | window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight 33 | ); 34 | }, 35 | handleResize: function handleResize(event) { 36 | this.event = event; 37 | this.vssWidth = this.getScreenWidth(); 38 | this.vssHeight = this.getScreenHeight(); 39 | }, 40 | $vssDestroyListener: function $vssDestroyListener() { 41 | window.removeEventListener('resize', this.handleResize); 42 | }, 43 | }, 44 | mounted: function mounted() { 45 | window.addEventListener('resize', this.handleResize); 46 | }, 47 | destroyed: function destroyed() { 48 | window.removeEventListener('resize', this.handleResize); 49 | }, 50 | }; 51 | 52 | var install = function (app) { 53 | app.mixin(VueScreenSizeMixin); 54 | }; 55 | 56 | exports.VueScreenSizeMixin = VueScreenSizeMixin; 57 | exports.default = install; 58 | 59 | Object.defineProperty(exports, '__esModule', { value: true }); 60 | 61 | }))); 62 | -------------------------------------------------------------------------------- /docs/assets/index.3331e506.css: -------------------------------------------------------------------------------- 1 | @import"https://fonts.googleapis.com/css?family=Noto+Sans";html{width:100%;font-size:18px;color:#333}body{margin:0;height:100%;height:100vh;width:100%;font-family:Noto Sans,sans-serif}#app{height:100%;height:100vh;width:100%;line-height:1.5}.code-text{background:#eee;border:1px solid #ddd;padding:10px 20px;border-radius:4px;margin-bottom:20px;text-align:center}@media (min-width: 992px){.code-text{margin-bottom:0}}.btn{text-transform:uppercase;font-weight:700}.github-corner:hover .octo-arm{animation:octocat-wave .56s ease-in-out}@keyframes octocat-wave{0%,to{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width: 500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave .56s ease-in-out}} 2 | -------------------------------------------------------------------------------- /docs/assets/index.6494c871.js: -------------------------------------------------------------------------------- 1 | const _r=function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const r of document.querySelectorAll('link[rel="modulepreload"]'))s(r);new MutationObserver(r=>{for(const i of r)if(i.type==="childList")for(const o of i.addedNodes)o.tagName==="LINK"&&o.rel==="modulepreload"&&s(o)}).observe(document,{childList:!0,subtree:!0});function n(r){const i={};return r.integrity&&(i.integrity=r.integrity),r.referrerpolicy&&(i.referrerPolicy=r.referrerpolicy),r.crossorigin==="use-credentials"?i.credentials="include":r.crossorigin==="anonymous"?i.credentials="omit":i.credentials="same-origin",i}function s(r){if(r.ep)return;r.ep=!0;const i=n(r);fetch(r.href,i)}};_r();function _n(e,t){const n=Object.create(null),s=e.split(",");for(let r=0;r!!n[r.toLowerCase()]:r=>!!n[r]}const br="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly",xr=_n(br);function bs(e){return!!e||e===""}function bn(e){if(M(e)){const t={};for(let n=0;n{if(n){const s=n.split(Cr);s.length>1&&(t[s[0].trim()]=s[1].trim())}}),t}function xn(e){let t="";if(Y(e))t=e;else if(M(e))for(let n=0;nY(e)?e:e==null?"":M(e)||Z(e)&&(e.toString===vs||!F(e.toString))?JSON.stringify(e,xs,2):String(e),xs=(e,t)=>t&&t.__v_isRef?xs(e,t.value):tt(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((n,[s,r])=>(n[`${s} =>`]=r,n),{})}:ys(t)?{[`Set(${t.size})`]:[...t.values()]}:Z(t)&&!M(t)&&!ws(t)?String(t):t,B={},et=[],ge=()=>{},wr=()=>!1,Er=/^on[^a-z]/,Ht=e=>Er.test(e),yn=e=>e.startsWith("onUpdate:"),Q=Object.assign,Cn=(e,t)=>{const n=e.indexOf(t);n>-1&&e.splice(n,1)},Tr=Object.prototype.hasOwnProperty,P=(e,t)=>Tr.call(e,t),M=Array.isArray,tt=e=>Rt(e)==="[object Map]",ys=e=>Rt(e)==="[object Set]",F=e=>typeof e=="function",Y=e=>typeof e=="string",vn=e=>typeof e=="symbol",Z=e=>e!==null&&typeof e=="object",Cs=e=>Z(e)&&F(e.then)&&F(e.catch),vs=Object.prototype.toString,Rt=e=>vs.call(e),Or=e=>Rt(e).slice(8,-1),ws=e=>Rt(e)==="[object Object]",wn=e=>Y(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,Et=_n(",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"),St=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},Ar=/-(\w)/g,st=St(e=>e.replace(Ar,(t,n)=>n?n.toUpperCase():"")),Mr=/\B([A-Z])/g,it=St(e=>e.replace(Mr,"-$1").toLowerCase()),Es=St(e=>e.charAt(0).toUpperCase()+e.slice(1)),Vt=St(e=>e?`on${Es(e)}`:""),At=(e,t)=>!Object.is(e,t),Jt=(e,t)=>{for(let n=0;n{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,value:n})},Fr=e=>{const t=parseFloat(e);return isNaN(t)?e:t};let qn;const Ir=()=>qn||(qn=typeof globalThis!="undefined"?globalThis:typeof self!="undefined"?self:typeof window!="undefined"?window:typeof global!="undefined"?global:{});let be;class Pr{constructor(t=!1){this.active=!0,this.effects=[],this.cleanups=[],!t&&be&&(this.parent=be,this.index=(be.scopes||(be.scopes=[])).push(this)-1)}run(t){if(this.active){const n=be;try{return be=this,t()}finally{be=n}}}on(){be=this}off(){be=this.parent}stop(t){if(this.active){let n,s;for(n=0,s=this.effects.length;n{const t=new Set(e);return t.w=0,t.n=0,t},Ts=e=>(e.w&Re)>0,Os=e=>(e.n&Re)>0,Nr=({deps:e})=>{if(e.length)for(let t=0;t{const{deps:t}=e;if(t.length){let n=0;for(let s=0;s{(d==="length"||d>=s)&&c.push(u)});else switch(n!==void 0&&c.push(o.get(n)),t){case"add":M(e)?wn(n)&&c.push(o.get("length")):(c.push(o.get(We)),tt(e)&&c.push(o.get(nn)));break;case"delete":M(e)||(c.push(o.get(We)),tt(e)&&c.push(o.get(nn)));break;case"set":tt(e)&&c.push(o.get(We));break}if(c.length===1)c[0]&&sn(c[0]);else{const u=[];for(const d of c)d&&u.push(...d);sn(En(u))}}function sn(e,t){for(const n of M(e)?e:[...e])(n!==pe||n.allowRecurse)&&(n.scheduler?n.scheduler():n.run())}const Rr=_n("__proto__,__v_isRef,__isVue"),Fs=new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(vn)),Sr=On(),jr=On(!1,!0),$r=On(!0),Jn=Br();function Br(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const s=S(this);for(let i=0,o=this.length;i{e[t]=function(...n){ot();const s=S(this)[t].apply(this,n);return lt(),s}}),e}function On(e=!1,t=!1){return function(s,r,i){if(r==="__v_isReactive")return!e;if(r==="__v_isReadonly")return e;if(r==="__v_isShallow")return t;if(r==="__v_raw"&&i===(e?t?ti:Hs:t?Ns:Ls).get(s))return s;const o=M(s);if(!e&&o&&P(Jn,r))return Reflect.get(Jn,r,i);const c=Reflect.get(s,r,i);return(vn(r)?Fs.has(r):Rr(r))||(e||le(s,"get",r),t)?c:X(c)?!o||!wn(r)?c.value:c:Z(c)?e?Rs(c):Fn(c):c}}const Ur=Is(),Kr=Is(!0);function Is(e=!1){return function(n,s,r,i){let o=n[s];if(gt(o)&&X(o)&&!X(r))return!1;if(!e&&!gt(r)&&(Ss(r)||(r=S(r),o=S(o)),!M(n)&&X(o)&&!X(r)))return o.value=r,!0;const c=M(n)&&wn(s)?Number(s)e,jt=e=>Reflect.getPrototypeOf(e);function xt(e,t,n=!1,s=!1){e=e.__v_raw;const r=S(e),i=S(t);t!==i&&!n&&le(r,"get",t),!n&&le(r,"get",i);const{has:o}=jt(r),c=s?An:n?Ln:Pn;if(o.call(r,t))return c(e.get(t));if(o.call(r,i))return c(e.get(i));e!==r&&e.get(t)}function yt(e,t=!1){const n=this.__v_raw,s=S(n),r=S(e);return e!==r&&!t&&le(s,"has",e),!t&&le(s,"has",r),e===r?n.has(e):n.has(e)||n.has(r)}function Ct(e,t=!1){return e=e.__v_raw,!t&&le(S(e),"iterate",We),Reflect.get(e,"size",e)}function Yn(e){e=S(e);const t=S(this);return jt(t).has.call(t,e)||(t.add(e),Oe(t,"add",e,e)),this}function Zn(e,t){t=S(t);const n=S(this),{has:s,get:r}=jt(n);let i=s.call(n,e);i||(e=S(e),i=s.call(n,e));const o=r.call(n,e);return n.set(e,t),i?At(t,o)&&Oe(n,"set",e,t):Oe(n,"add",e,t),this}function Xn(e){const t=S(this),{has:n,get:s}=jt(t);let r=n.call(t,e);r||(e=S(e),r=n.call(t,e)),s&&s.call(t,e);const i=t.delete(e);return r&&Oe(t,"delete",e,void 0),i}function Qn(){const e=S(this),t=e.size!==0,n=e.clear();return t&&Oe(e,"clear",void 0,void 0),n}function vt(e,t){return function(s,r){const i=this,o=i.__v_raw,c=S(o),u=t?An:e?Ln:Pn;return!e&&le(c,"iterate",We),o.forEach((d,m)=>s.call(r,u(d),u(m),i))}}function wt(e,t,n){return function(...s){const r=this.__v_raw,i=S(r),o=tt(i),c=e==="entries"||e===Symbol.iterator&&o,u=e==="keys"&&o,d=r[e](...s),m=n?An:t?Ln:Pn;return!t&&le(i,"iterate",u?nn:We),{next(){const{value:y,done:v}=d.next();return v?{value:y,done:v}:{value:c?[m(y[0]),m(y[1])]:m(y),done:v}},[Symbol.iterator](){return this}}}}function Fe(e){return function(...t){return e==="delete"?!1:this}}function Vr(){const e={get(i){return xt(this,i)},get size(){return Ct(this)},has:yt,add:Yn,set:Zn,delete:Xn,clear:Qn,forEach:vt(!1,!1)},t={get(i){return xt(this,i,!1,!0)},get size(){return Ct(this)},has:yt,add:Yn,set:Zn,delete:Xn,clear:Qn,forEach:vt(!1,!0)},n={get(i){return xt(this,i,!0)},get size(){return Ct(this,!0)},has(i){return yt.call(this,i,!0)},add:Fe("add"),set:Fe("set"),delete:Fe("delete"),clear:Fe("clear"),forEach:vt(!0,!1)},s={get(i){return xt(this,i,!0,!0)},get size(){return Ct(this,!0)},has(i){return yt.call(this,i,!0)},add:Fe("add"),set:Fe("set"),delete:Fe("delete"),clear:Fe("clear"),forEach:vt(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(i=>{e[i]=wt(i,!1,!1),n[i]=wt(i,!0,!1),t[i]=wt(i,!1,!0),s[i]=wt(i,!0,!0)}),[e,n,t,s]}const[Jr,Yr,Zr,Xr]=Vr();function Mn(e,t){const n=t?e?Xr:Zr:e?Yr:Jr;return(s,r,i)=>r==="__v_isReactive"?!e:r==="__v_isReadonly"?e:r==="__v_raw"?s:Reflect.get(P(n,r)&&r in s?n:s,r,i)}const Qr={get:Mn(!1,!1)},Gr={get:Mn(!1,!0)},ei={get:Mn(!0,!1)},Ls=new WeakMap,Ns=new WeakMap,Hs=new WeakMap,ti=new WeakMap;function ni(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function si(e){return e.__v_skip||!Object.isExtensible(e)?0:ni(Or(e))}function Fn(e){return gt(e)?e:In(e,!1,Ps,Qr,Ls)}function ri(e){return In(e,!1,qr,Gr,Ns)}function Rs(e){return In(e,!0,kr,ei,Hs)}function In(e,t,n,s,r){if(!Z(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;const i=r.get(e);if(i)return i;const o=si(e);if(o===0)return e;const c=new Proxy(e,o===2?s:n);return r.set(e,c),c}function nt(e){return gt(e)?nt(e.__v_raw):!!(e&&e.__v_isReactive)}function gt(e){return!!(e&&e.__v_isReadonly)}function Ss(e){return!!(e&&e.__v_isShallow)}function js(e){return nt(e)||gt(e)}function S(e){const t=e&&e.__v_raw;return t?S(t):e}function $s(e){return Mt(e,"__v_skip",!0),e}const Pn=e=>Z(e)?Fn(e):e,Ln=e=>Z(e)?Rs(e):e;function ii(e){Le&&pe&&(e=S(e),Ms(e.dep||(e.dep=En())))}function oi(e,t){e=S(e),e.dep&&sn(e.dep)}function X(e){return!!(e&&e.__v_isRef===!0)}function li(e){return X(e)?e.value:e}const ci={get:(e,t,n)=>li(Reflect.get(e,t,n)),set:(e,t,n,s)=>{const r=e[t];return X(r)&&!X(n)?(r.value=n,!0):Reflect.set(e,t,n,s)}};function Bs(e){return nt(e)?e:new Proxy(e,ci)}class fi{constructor(t,n,s,r){this._setter=n,this.dep=void 0,this.__v_isRef=!0,this._dirty=!0,this.effect=new Tn(t,()=>{this._dirty||(this._dirty=!0,oi(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!r,this.__v_isReadonly=s}get value(){const t=S(this);return ii(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}function ui(e,t,n=!1){let s,r;const i=F(e);return i?(s=e,r=ge):(s=e.get,r=e.set),new fi(s,r,i||!r,n)}function Ne(e,t,n,s){let r;try{r=s?e(...s):e()}catch(i){$t(i,t,n)}return r}function ue(e,t,n,s){if(F(e)){const i=Ne(e,t,n,s);return i&&Cs(i)&&i.catch(o=>{$t(o,t,n)}),i}const r=[];for(let i=0;i>>1;mt(oe[s])Ee&&oe.splice(t,1)}function Ws(e,t,n,s){M(e)?n.push(...e):(!t||!t.includes(e,e.allowRecurse?s+1:s))&&n.push(e),Ds()}function gi(e){Ws(e,at,dt,Xe)}function mi(e){Ws(e,Ie,ht,Qe)}function Hn(e,t=null){if(dt.length){for(on=t,at=[...new Set(dt)],dt.length=0,Xe=0;Xemt(n)-mt(s)),Qe=0;Qee.id==null?1/0:e.id;function ks(e){rn=!1,Ft=!0,Hn(e),oe.sort((n,s)=>mt(n)-mt(s));const t=ge;try{for(Ee=0;EeA.trim()):y&&(r=n.map(Fr))}let c,u=s[c=Vt(t)]||s[c=Vt(st(t))];!u&&i&&(u=s[c=Vt(it(t))]),u&&ue(u,e,6,r);const d=s[c+"Once"];if(d){if(!e.emitted)e.emitted={};else if(e.emitted[c])return;e.emitted[c]=!0,ue(d,e,6,r)}}function qs(e,t,n=!1){const s=t.emitsCache,r=s.get(e);if(r!==void 0)return r;const i=e.emits;let o={},c=!1;if(!F(e)){const u=d=>{const m=qs(d,t,!0);m&&(c=!0,Q(o,m))};!n&&t.mixins.length&&t.mixins.forEach(u),e.extends&&u(e.extends),e.mixins&&e.mixins.forEach(u)}return!i&&!c?(s.set(e,null),null):(M(i)?i.forEach(u=>o[u]=null):Q(o,i),s.set(e,o),o)}function Bt(e,t){return!e||!Ht(t)?!1:(t=t.slice(2).replace(/Once$/,""),P(e,t[0].toLowerCase()+t.slice(1))||P(e,it(t))||P(e,t))}let Ce=null,Vs=null;function It(e){const t=Ce;return Ce=e,Vs=e&&e.type.__scopeId||null,t}function bi(e,t=Ce,n){if(!t||e._n)return e;const s=(...r)=>{s._d&&cs(-1);const i=It(t),o=e(...r);return It(i),s._d&&cs(1),o};return s._n=!0,s._c=!0,s._d=!0,s}function Yt(e){const{type:t,vnode:n,proxy:s,withProxy:r,props:i,propsOptions:[o],slots:c,attrs:u,emit:d,render:m,renderCache:y,data:v,setupState:A,ctx:R,inheritAttrs:N}=e;let I,H;const ce=It(e);try{if(n.shapeFlag&4){const z=r||s;I=ye(m.call(z,z,y,i,A,v,R)),H=u}else{const z=t;I=ye(z.length>1?z(i,{attrs:u,slots:c,emit:d}):z(i,null)),H=t.props?u:xi(u)}}catch(z){pt.length=0,$t(z,e,1),I=He(Te)}let q=I;if(H&&N!==!1){const z=Object.keys(H),{shapeFlag:se}=q;z.length&&se&7&&(o&&z.some(yn)&&(H=yi(H,o)),q=qe(q,H))}return n.dirs&&(q.dirs=q.dirs?q.dirs.concat(n.dirs):n.dirs),n.transition&&(q.transition=n.transition),I=q,It(ce),I}const xi=e=>{let t;for(const n in e)(n==="class"||n==="style"||Ht(n))&&((t||(t={}))[n]=e[n]);return t},yi=(e,t)=>{const n={};for(const s in e)(!yn(s)||!(s.slice(9)in t))&&(n[s]=e[s]);return n};function Ci(e,t,n){const{props:s,children:r,component:i}=e,{props:o,children:c,patchFlag:u}=t,d=i.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&u>=0){if(u&1024)return!0;if(u&16)return s?Gn(s,o,d):!!o;if(u&8){const m=t.dynamicProps;for(let y=0;ye.__isSuspense;function Ei(e,t){t&&t.pendingBranch?M(e)?t.effects.push(...e):t.effects.push(e):mi(e)}function Ti(e,t){if(J){let n=J.provides;const s=J.parent&&J.parent.provides;s===n&&(n=J.provides=Object.create(s)),n[e]=t}}function Zt(e,t,n=!1){const s=J||Ce;if(s){const r=s.parent==null?s.vnode.appContext&&s.vnode.appContext.provides:s.parent.provides;if(r&&e in r)return r[e];if(arguments.length>1)return n&&F(t)?t.call(s.proxy):t}}const es={};function Xt(e,t,n){return Js(e,t,n)}function Js(e,t,{immediate:n,deep:s,flush:r,onTrack:i,onTrigger:o}=B){const c=J;let u,d=!1,m=!1;if(X(e)?(u=()=>e.value,d=Ss(e)):nt(e)?(u=()=>e,s=!0):M(e)?(m=!0,d=e.some(nt),u=()=>e.map(H=>{if(X(H))return H.value;if(nt(H))return Ge(H);if(F(H))return Ne(H,c,2)})):F(e)?t?u=()=>Ne(e,c,2):u=()=>{if(!(c&&c.isUnmounted))return y&&y(),ue(e,c,3,[v])}:u=ge,t&&s){const H=u;u=()=>Ge(H())}let y,v=H=>{y=I.onStop=()=>{Ne(H,c,4)}};if(_t)return v=ge,t?n&&ue(t,c,3,[u(),m?[]:void 0,v]):u(),ge;let A=m?[]:es;const R=()=>{if(!!I.active)if(t){const H=I.run();(s||d||(m?H.some((ce,q)=>At(ce,A[q])):At(H,A)))&&(y&&y(),ue(t,c,3,[H,A===es?void 0:A,v]),A=H)}else I.run()};R.allowRecurse=!!t;let N;r==="sync"?N=R:r==="post"?N=()=>te(R,c&&c.suspense):N=()=>{!c||c.isMounted?gi(R):R()};const I=new Tn(u,N);return t?n?R():A=I.run():r==="post"?te(I.run.bind(I),c&&c.suspense):I.run(),()=>{I.stop(),c&&c.scope&&Cn(c.scope.effects,I)}}function Oi(e,t,n){const s=this.proxy,r=Y(e)?e.includes(".")?Ys(s,e):()=>s[e]:e.bind(s,s);let i;F(t)?i=t:(i=t.handler,n=t);const o=J;rt(this);const c=Js(r,i.bind(s),n);return o?rt(o):ke(),c}function Ys(e,t){const n=t.split(".");return()=>{let s=e;for(let r=0;r{Ge(n,t)});else if(ws(e))for(const n in e)Ge(e[n],t);return e}function Ai(){const e={isMounted:!1,isLeaving:!1,isUnmounting:!1,leavingVNodes:new Map};return Gs(()=>{e.isMounted=!0}),er(()=>{e.isUnmounting=!0}),e}const fe=[Function,Array],Mi={name:"BaseTransition",props:{mode:String,appear:Boolean,persisted:Boolean,onBeforeEnter:fe,onEnter:fe,onAfterEnter:fe,onEnterCancelled:fe,onBeforeLeave:fe,onLeave:fe,onAfterLeave:fe,onLeaveCancelled:fe,onBeforeAppear:fe,onAppear:fe,onAfterAppear:fe,onAppearCancelled:fe},setup(e,{slots:t}){const n=_o(),s=Ai();let r;return()=>{const i=t.default&&Xs(t.default(),!0);if(!i||!i.length)return;let o=i[0];if(i.length>1){for(const N of i)if(N.type!==Te){o=N;break}}const c=S(e),{mode:u}=c;if(s.isLeaving)return Qt(o);const d=ts(o);if(!d)return Qt(o);const m=ln(d,c,s,n);cn(d,m);const y=n.subTree,v=y&&ts(y);let A=!1;const{getTransitionKey:R}=d.type;if(R){const N=R();r===void 0?r=N:N!==r&&(r=N,A=!0)}if(v&&v.type!==Te&&(!Ue(d,v)||A)){const N=ln(v,c,s,n);if(cn(v,N),u==="out-in")return s.isLeaving=!0,N.afterLeave=()=>{s.isLeaving=!1,n.update()},Qt(o);u==="in-out"&&d.type!==Te&&(N.delayLeave=(I,H,ce)=>{const q=Zs(s,v);q[String(v.key)]=v,I._leaveCb=()=>{H(),I._leaveCb=void 0,delete m.delayedLeave},m.delayedLeave=ce})}return o}}},Fi=Mi;function Zs(e,t){const{leavingVNodes:n}=e;let s=n.get(t.type);return s||(s=Object.create(null),n.set(t.type,s)),s}function ln(e,t,n,s){const{appear:r,mode:i,persisted:o=!1,onBeforeEnter:c,onEnter:u,onAfterEnter:d,onEnterCancelled:m,onBeforeLeave:y,onLeave:v,onAfterLeave:A,onLeaveCancelled:R,onBeforeAppear:N,onAppear:I,onAfterAppear:H,onAppearCancelled:ce}=t,q=String(e.key),z=Zs(n,e),se=(j,V)=>{j&&ue(j,s,9,V)},Se={mode:i,persisted:o,beforeEnter(j){let V=c;if(!n.isMounted)if(r)V=N||c;else return;j._leaveCb&&j._leaveCb(!0);const k=z[q];k&&Ue(e,k)&&k.el._leaveCb&&k.el._leaveCb(),se(V,[j])},enter(j){let V=u,k=d,ae=m;if(!n.isMounted)if(r)V=I||u,k=H||d,ae=ce||m;else return;let re=!1;const de=j._enterCb=Ve=>{re||(re=!0,Ve?se(ae,[j]):se(k,[j]),Se.delayedLeave&&Se.delayedLeave(),j._enterCb=void 0)};V?(V(j,de),V.length<=1&&de()):de()},leave(j,V){const k=String(e.key);if(j._enterCb&&j._enterCb(!0),n.isUnmounting)return V();se(y,[j]);let ae=!1;const re=j._leaveCb=de=>{ae||(ae=!0,V(),de?se(R,[j]):se(A,[j]),j._leaveCb=void 0,z[k]===e&&delete z[k])};z[k]=e,v?(v(j,re),v.length<=1&&re()):re()},clone(j){return ln(j,t,n,s)}};return Se}function Qt(e){if(Ut(e))return e=qe(e),e.children=null,e}function ts(e){return Ut(e)?e.children?e.children[0]:void 0:e}function cn(e,t){e.shapeFlag&6&&e.component?cn(e.component.subTree,t):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function Xs(e,t=!1,n){let s=[],r=0;for(let i=0;i1)for(let i=0;i!!e.type.__asyncLoader,Ut=e=>e.type.__isKeepAlive;function Ii(e,t){Qs(e,"a",t)}function Pi(e,t){Qs(e,"da",t)}function Qs(e,t,n=J){const s=e.__wdc||(e.__wdc=()=>{let r=n;for(;r;){if(r.isDeactivated)return;r=r.parent}return e()});if(Kt(t,s,n),n){let r=n.parent;for(;r&&r.parent;)Ut(r.parent.vnode)&&Li(s,t,n,r),r=r.parent}}function Li(e,t,n,s){const r=Kt(t,e,s,!0);tr(()=>{Cn(s[t],r)},n)}function Kt(e,t,n=J,s=!1){if(n){const r=n[e]||(n[e]=[]),i=t.__weh||(t.__weh=(...o)=>{if(n.isUnmounted)return;ot(),rt(n);const c=ue(t,n,e,o);return ke(),lt(),c});return s?r.unshift(i):r.push(i),i}}const Ae=e=>(t,n=J)=>(!_t||e==="sp")&&Kt(e,t,n),Ni=Ae("bm"),Gs=Ae("m"),Hi=Ae("bu"),Ri=Ae("u"),er=Ae("bum"),tr=Ae("um"),Si=Ae("sp"),ji=Ae("rtg"),$i=Ae("rtc");function Bi(e,t=J){Kt("ec",e,t)}let un=!0;function Ui(e){const t=sr(e),n=e.proxy,s=e.ctx;un=!1,t.beforeCreate&&ns(t.beforeCreate,e,"bc");const{data:r,computed:i,methods:o,watch:c,provide:u,inject:d,created:m,beforeMount:y,mounted:v,beforeUpdate:A,updated:R,activated:N,deactivated:I,beforeDestroy:H,beforeUnmount:ce,destroyed:q,unmounted:z,render:se,renderTracked:Se,renderTriggered:j,errorCaptured:V,serverPrefetch:k,expose:ae,inheritAttrs:re,components:de,directives:Ve,filters:Bn}=t;if(d&&Ki(d,s,null,e.appContext.config.unwrapInjectedRef),o)for(const W in o){const U=o[W];F(U)&&(s[W]=U.bind(n))}if(r){const W=r.call(n,n);Z(W)&&(e.data=Fn(W))}if(un=!0,i)for(const W in i){const U=i[W],ve=F(U)?U.bind(n,n):F(U.get)?U.get.bind(n,n):ge,zt=!F(U)&&F(U.set)?U.set.bind(n):ge,ct=wo({get:ve,set:zt});Object.defineProperty(s,W,{enumerable:!0,configurable:!0,get:()=>ct.value,set:Je=>ct.value=Je})}if(c)for(const W in c)nr(c[W],s,n,W);if(u){const W=F(u)?u.call(n):u;Reflect.ownKeys(W).forEach(U=>{Ti(U,W[U])})}m&&ns(m,e,"c");function ee(W,U){M(U)?U.forEach(ve=>W(ve.bind(n))):U&&W(U.bind(n))}if(ee(Ni,y),ee(Gs,v),ee(Hi,A),ee(Ri,R),ee(Ii,N),ee(Pi,I),ee(Bi,V),ee($i,Se),ee(ji,j),ee(er,ce),ee(tr,z),ee(Si,k),M(ae))if(ae.length){const W=e.exposed||(e.exposed={});ae.forEach(U=>{Object.defineProperty(W,U,{get:()=>n[U],set:ve=>n[U]=ve})})}else e.exposed||(e.exposed={});se&&e.render===ge&&(e.render=se),re!=null&&(e.inheritAttrs=re),de&&(e.components=de),Ve&&(e.directives=Ve)}function Ki(e,t,n=ge,s=!1){M(e)&&(e=an(e));for(const r in e){const i=e[r];let o;Z(i)?"default"in i?o=Zt(i.from||r,i.default,!0):o=Zt(i.from||r):o=Zt(i),X(o)&&s?Object.defineProperty(t,r,{enumerable:!0,configurable:!0,get:()=>o.value,set:c=>o.value=c}):t[r]=o}}function ns(e,t,n){ue(M(e)?e.map(s=>s.bind(t.proxy)):e.bind(t.proxy),t,n)}function nr(e,t,n,s){const r=s.includes(".")?Ys(n,s):()=>n[s];if(Y(e)){const i=t[e];F(i)&&Xt(r,i)}else if(F(e))Xt(r,e.bind(n));else if(Z(e))if(M(e))e.forEach(i=>nr(i,t,n,s));else{const i=F(e.handler)?e.handler.bind(n):t[e.handler];F(i)&&Xt(r,i,e)}}function sr(e){const t=e.type,{mixins:n,extends:s}=t,{mixins:r,optionsCache:i,config:{optionMergeStrategies:o}}=e.appContext,c=i.get(t);let u;return c?u=c:!r.length&&!n&&!s?u=t:(u={},r.length&&r.forEach(d=>Pt(u,d,o,!0)),Pt(u,t,o)),i.set(t,u),u}function Pt(e,t,n,s=!1){const{mixins:r,extends:i}=t;i&&Pt(e,i,n,!0),r&&r.forEach(o=>Pt(e,o,n,!0));for(const o in t)if(!(s&&o==="expose")){const c=Di[o]||n&&n[o];e[o]=c?c(e[o],t[o]):t[o]}return e}const Di={data:ss,props:Be,emits:Be,methods:Be,computed:Be,beforeCreate:G,created:G,beforeMount:G,mounted:G,beforeUpdate:G,updated:G,beforeDestroy:G,beforeUnmount:G,destroyed:G,unmounted:G,activated:G,deactivated:G,errorCaptured:G,serverPrefetch:G,components:Be,directives:Be,watch:zi,provide:ss,inject:Wi};function ss(e,t){return t?e?function(){return Q(F(e)?e.call(this,this):e,F(t)?t.call(this,this):t)}:t:e}function Wi(e,t){return Be(an(e),an(t))}function an(e){if(M(e)){const t={};for(let n=0;n0)&&!(o&16)){if(o&8){const m=e.vnode.dynamicProps;for(let y=0;y{u=!0;const[v,A]=ir(y,t,!0);Q(o,v),A&&c.push(...A)};!n&&t.mixins.length&&t.mixins.forEach(m),e.extends&&m(e.extends),e.mixins&&e.mixins.forEach(m)}if(!i&&!u)return s.set(e,et),et;if(M(i))for(let m=0;m-1,A[1]=N<0||R-1||P(A,"default"))&&c.push(y)}}}const d=[o,c];return s.set(e,d),d}function rs(e){return e[0]!=="$"}function is(e){const t=e&&e.toString().match(/^\s*function (\w+)/);return t?t[1]:e===null?"null":""}function os(e,t){return is(e)===is(t)}function ls(e,t){return M(t)?t.findIndex(n=>os(n,e)):F(t)&&os(t,e)?0:-1}const or=e=>e[0]==="_"||e==="$stable",Rn=e=>M(e)?e.map(ye):[ye(e)],Vi=(e,t,n)=>{const s=bi((...r)=>Rn(t(...r)),n);return s._c=!1,s},lr=(e,t,n)=>{const s=e._ctx;for(const r in e){if(or(r))continue;const i=e[r];if(F(i))t[r]=Vi(r,i,s);else if(i!=null){const o=Rn(i);t[r]=()=>o}}},cr=(e,t)=>{const n=Rn(t);e.slots.default=()=>n},Ji=(e,t)=>{if(e.vnode.shapeFlag&32){const n=t._;n?(e.slots=S(t),Mt(t,"_",n)):lr(t,e.slots={})}else e.slots={},t&&cr(e,t);Mt(e.slots,Dt,1)},Yi=(e,t,n)=>{const{vnode:s,slots:r}=e;let i=!0,o=B;if(s.shapeFlag&32){const c=t._;c?n&&c===1?i=!1:(Q(r,t),!n&&c===1&&delete r._):(i=!t.$stable,lr(t,r)),o=t}else t&&(cr(e,t),o={default:1});if(i)for(const c in r)!or(c)&&!(c in o)&&delete r[c]};function je(e,t,n,s){const r=e.dirs,i=t&&t.dirs;for(let o=0;ohn(v,t&&(M(t)?t[A]:t),n,s,r));return}if(fn(s)&&!r)return;const i=s.shapeFlag&4?$n(s.component)||s.component.proxy:s.el,o=r?null:i,{i:c,r:u}=e,d=t&&t.r,m=c.refs===B?c.refs={}:c.refs,y=c.setupState;if(d!=null&&d!==u&&(Y(d)?(m[d]=null,P(y,d)&&(y[d]=null)):X(d)&&(d.value=null)),F(u))Ne(u,c,12,[o,m]);else{const v=Y(u),A=X(u);if(v||A){const R=()=>{if(e.f){const N=v?m[u]:u.value;r?M(N)&&Cn(N,i):M(N)?N.includes(i)||N.push(i):v?(m[u]=[i],P(y,u)&&(y[u]=m[u])):(u.value=[i],e.k&&(m[e.k]=u.value))}else v?(m[u]=o,P(y,u)&&(y[u]=o)):X(u)&&(u.value=o,e.k&&(m[e.k]=o))};o?(R.id=-1,te(R,n)):R()}}}const te=Ei;function Qi(e){return Gi(e)}function Gi(e,t){const n=Ir();n.__VUE__=!0;const{insert:s,remove:r,patchProp:i,createElement:o,createText:c,createComment:u,setText:d,setElementText:m,parentNode:y,nextSibling:v,setScopeId:A=ge,cloneNode:R,insertStaticContent:N}=e,I=(l,f,a,p=null,h=null,b=null,C=!1,_=null,x=!!f.dynamicChildren)=>{if(l===f)return;l&&!Ue(l,f)&&(p=bt(l),Me(l,h,b,!0),l=null),f.patchFlag===-2&&(x=!1,f.dynamicChildren=null);const{type:g,ref:E,shapeFlag:w}=f;switch(g){case Sn:H(l,f,a,p);break;case Te:ce(l,f,a,p);break;case Tt:l==null&&q(f,a,p,C);break;case xe:Ve(l,f,a,p,h,b,C,_,x);break;default:w&1?Se(l,f,a,p,h,b,C,_,x):w&6?Bn(l,f,a,p,h,b,C,_,x):(w&64||w&128)&&g.process(l,f,a,p,h,b,C,_,x,Ye)}E!=null&&h&&hn(E,l&&l.ref,b,f||l,!f)},H=(l,f,a,p)=>{if(l==null)s(f.el=c(f.children),a,p);else{const h=f.el=l.el;f.children!==l.children&&d(h,f.children)}},ce=(l,f,a,p)=>{l==null?s(f.el=u(f.children||""),a,p):f.el=l.el},q=(l,f,a,p)=>{[l.el,l.anchor]=N(l.children,f,a,p,l.el,l.anchor)},z=({el:l,anchor:f},a,p)=>{let h;for(;l&&l!==f;)h=v(l),s(l,a,p),l=h;s(f,a,p)},se=({el:l,anchor:f})=>{let a;for(;l&&l!==f;)a=v(l),r(l),l=a;r(f)},Se=(l,f,a,p,h,b,C,_,x)=>{C=C||f.type==="svg",l==null?j(f,a,p,h,b,C,_,x):ae(l,f,h,b,C,_,x)},j=(l,f,a,p,h,b,C,_)=>{let x,g;const{type:E,props:w,shapeFlag:T,transition:O,patchFlag:L,dirs:D}=l;if(l.el&&R!==void 0&&L===-1)x=l.el=R(l.el);else{if(x=l.el=o(l.type,b,w&&w.is,w),T&8?m(x,l.children):T&16&&k(l.children,x,null,p,h,b&&E!=="foreignObject",C,_),D&&je(l,null,p,"created"),w){for(const K in w)K!=="value"&&!Et(K)&&i(x,K,null,w[K],b,l.children,p,h,we);"value"in w&&i(x,"value",null,w.value),(g=w.onVnodeBeforeMount)&&_e(g,p,l)}V(x,l,l.scopeId,C,p)}D&&je(l,null,p,"beforeMount");const $=(!h||h&&!h.pendingBranch)&&O&&!O.persisted;$&&O.beforeEnter(x),s(x,f,a),((g=w&&w.onVnodeMounted)||$||D)&&te(()=>{g&&_e(g,p,l),$&&O.enter(x),D&&je(l,null,p,"mounted")},h)},V=(l,f,a,p,h)=>{if(a&&A(l,a),p)for(let b=0;b{for(let g=x;g{const _=f.el=l.el;let{patchFlag:x,dynamicChildren:g,dirs:E}=f;x|=l.patchFlag&16;const w=l.props||B,T=f.props||B;let O;a&&$e(a,!1),(O=T.onVnodeBeforeUpdate)&&_e(O,a,f,l),E&&je(f,l,a,"beforeUpdate"),a&&$e(a,!0);const L=h&&f.type!=="foreignObject";if(g?re(l.dynamicChildren,g,_,a,p,L,b):C||ve(l,f,_,null,a,p,L,b,!1),x>0){if(x&16)de(_,f,w,T,a,p,h);else if(x&2&&w.class!==T.class&&i(_,"class",null,T.class,h),x&4&&i(_,"style",w.style,T.style,h),x&8){const D=f.dynamicProps;for(let $=0;${O&&_e(O,a,f,l),E&&je(f,l,a,"updated")},p)},re=(l,f,a,p,h,b,C)=>{for(let _=0;_{if(a!==p){for(const _ in p){if(Et(_))continue;const x=p[_],g=a[_];x!==g&&_!=="value"&&i(l,_,g,x,C,f.children,h,b,we)}if(a!==B)for(const _ in a)!Et(_)&&!(_ in p)&&i(l,_,a[_],null,C,f.children,h,b,we);"value"in p&&i(l,"value",a.value,p.value)}},Ve=(l,f,a,p,h,b,C,_,x)=>{const g=f.el=l?l.el:c(""),E=f.anchor=l?l.anchor:c("");let{patchFlag:w,dynamicChildren:T,slotScopeIds:O}=f;O&&(_=_?_.concat(O):O),l==null?(s(g,a,p),s(E,a,p),k(f.children,a,E,h,b,C,_,x)):w>0&&w&64&&T&&l.dynamicChildren?(re(l.dynamicChildren,T,a,h,b,C,_),(f.key!=null||h&&f===h.subTree)&&ur(l,f,!0)):ve(l,f,a,E,h,b,C,_,x)},Bn=(l,f,a,p,h,b,C,_,x)=>{f.slotScopeIds=_,l==null?f.shapeFlag&512?h.ctx.activate(f,a,p,C,x):Wt(f,a,p,h,b,C,x):ee(l,f,x)},Wt=(l,f,a,p,h,b,C)=>{const _=l.component=mo(l,p,h);if(Ut(l)&&(_.ctx.renderer=Ye),bo(_),_.asyncDep){if(h&&h.registerDep(_,W),!l.el){const x=_.subTree=He(Te);ce(null,x,f,a)}return}W(_,l,f,a,h,b,C)},ee=(l,f,a)=>{const p=f.component=l.component;if(Ci(l,f,a))if(p.asyncDep&&!p.asyncResolved){U(p,f,a);return}else p.next=f,pi(p.update),p.update();else f.component=l.component,f.el=l.el,p.vnode=f},W=(l,f,a,p,h,b,C)=>{const _=()=>{if(l.isMounted){let{next:E,bu:w,u:T,parent:O,vnode:L}=l,D=E,$;$e(l,!1),E?(E.el=L.el,U(l,E,C)):E=L,w&&Jt(w),($=E.props&&E.props.onVnodeBeforeUpdate)&&_e($,O,E,L),$e(l,!0);const K=Yt(l),he=l.subTree;l.subTree=K,I(he,K,y(he.el),bt(he),l,h,b),E.el=K.el,D===null&&vi(l,K.el),T&&te(T,h),($=E.props&&E.props.onVnodeUpdated)&&te(()=>_e($,O,E,L),h)}else{let E;const{el:w,props:T}=f,{bm:O,m:L,parent:D}=l,$=fn(f);if($e(l,!1),O&&Jt(O),!$&&(E=T&&T.onVnodeBeforeMount)&&_e(E,D,f),$e(l,!0),w&&qt){const K=()=>{l.subTree=Yt(l),qt(w,l.subTree,l,h,null)};$?f.type.__asyncLoader().then(()=>!l.isUnmounted&&K()):K()}else{const K=l.subTree=Yt(l);I(null,K,a,p,l,h,b),f.el=K.el}if(L&&te(L,h),!$&&(E=T&&T.onVnodeMounted)){const K=f;te(()=>_e(E,D,K),h)}f.shapeFlag&256&&l.a&&te(l.a,h),l.isMounted=!0,f=a=p=null}},x=l.effect=new Tn(_,()=>Ks(l.update),l.scope),g=l.update=x.run.bind(x);g.id=l.uid,$e(l,!0),g()},U=(l,f,a)=>{f.component=l;const p=l.vnode.props;l.vnode=f,l.next=null,qi(l,f.props,p,a),Yi(l,f.children,a),ot(),Hn(void 0,l.update),lt()},ve=(l,f,a,p,h,b,C,_,x=!1)=>{const g=l&&l.children,E=l?l.shapeFlag:0,w=f.children,{patchFlag:T,shapeFlag:O}=f;if(T>0){if(T&128){ct(g,w,a,p,h,b,C,_,x);return}else if(T&256){zt(g,w,a,p,h,b,C,_,x);return}}O&8?(E&16&&we(g,h,b),w!==g&&m(a,w)):E&16?O&16?ct(g,w,a,p,h,b,C,_,x):we(g,h,b,!0):(E&8&&m(a,""),O&16&&k(w,a,p,h,b,C,_,x))},zt=(l,f,a,p,h,b,C,_,x)=>{l=l||et,f=f||et;const g=l.length,E=f.length,w=Math.min(g,E);let T;for(T=0;TE?we(l,h,b,!0,!1,w):k(f,a,p,h,b,C,_,x,w)},ct=(l,f,a,p,h,b,C,_,x)=>{let g=0;const E=f.length;let w=l.length-1,T=E-1;for(;g<=w&&g<=T;){const O=l[g],L=f[g]=x?Pe(f[g]):ye(f[g]);if(Ue(O,L))I(O,L,a,null,h,b,C,_,x);else break;g++}for(;g<=w&&g<=T;){const O=l[w],L=f[T]=x?Pe(f[T]):ye(f[T]);if(Ue(O,L))I(O,L,a,null,h,b,C,_,x);else break;w--,T--}if(g>w){if(g<=T){const O=T+1,L=OT)for(;g<=w;)Me(l[g],h,b,!0),g++;else{const O=g,L=g,D=new Map;for(g=L;g<=T;g++){const ie=f[g]=x?Pe(f[g]):ye(f[g]);ie.key!=null&&D.set(ie.key,g)}let $,K=0;const he=T-L+1;let Ze=!1,Dn=0;const ft=new Array(he);for(g=0;g=he){Me(ie,h,b,!0);continue}let me;if(ie.key!=null)me=D.get(ie.key);else for($=L;$<=T;$++)if(ft[$-L]===0&&Ue(ie,f[$])){me=$;break}me===void 0?Me(ie,h,b,!0):(ft[me-L]=g+1,me>=Dn?Dn=me:Ze=!0,I(ie,f[me],a,null,h,b,C,_,x),K++)}const Wn=Ze?eo(ft):et;for($=Wn.length-1,g=he-1;g>=0;g--){const ie=L+g,me=f[ie],zn=ie+1{const{el:b,type:C,transition:_,children:x,shapeFlag:g}=l;if(g&6){Je(l.component.subTree,f,a,p);return}if(g&128){l.suspense.move(f,a,p);return}if(g&64){C.move(l,f,a,Ye);return}if(C===xe){s(b,f,a);for(let w=0;w_.enter(b),h);else{const{leave:w,delayLeave:T,afterLeave:O}=_,L=()=>s(b,f,a),D=()=>{w(b,()=>{L(),O&&O()})};T?T(b,L,D):D()}else s(b,f,a)},Me=(l,f,a,p=!1,h=!1)=>{const{type:b,props:C,ref:_,children:x,dynamicChildren:g,shapeFlag:E,patchFlag:w,dirs:T}=l;if(_!=null&&hn(_,null,a,l,!0),E&256){f.ctx.deactivate(l);return}const O=E&1&&T,L=!fn(l);let D;if(L&&(D=C&&C.onVnodeBeforeUnmount)&&_e(D,f,l),E&6)mr(l.component,a,p);else{if(E&128){l.suspense.unmount(a,p);return}O&&je(l,null,f,"beforeUnmount"),E&64?l.type.remove(l,f,a,h,Ye,p):g&&(b!==xe||w>0&&w&64)?we(g,f,a,!1,!0):(b===xe&&w&384||!h&&E&16)&&we(x,f,a),p&&Un(l)}(L&&(D=C&&C.onVnodeUnmounted)||O)&&te(()=>{D&&_e(D,f,l),O&&je(l,null,f,"unmounted")},a)},Un=l=>{const{type:f,el:a,anchor:p,transition:h}=l;if(f===xe){gr(a,p);return}if(f===Tt){se(l);return}const b=()=>{r(a),h&&!h.persisted&&h.afterLeave&&h.afterLeave()};if(l.shapeFlag&1&&h&&!h.persisted){const{leave:C,delayLeave:_}=h,x=()=>C(a,b);_?_(l.el,b,x):x()}else b()},gr=(l,f)=>{let a;for(;l!==f;)a=v(l),r(l),l=a;r(f)},mr=(l,f,a)=>{const{bum:p,scope:h,update:b,subTree:C,um:_}=l;p&&Jt(p),h.stop(),b&&(b.active=!1,Me(C,l,f,a)),_&&te(_,f),te(()=>{l.isUnmounted=!0},f),f&&f.pendingBranch&&!f.isUnmounted&&l.asyncDep&&!l.asyncResolved&&l.suspenseId===f.pendingId&&(f.deps--,f.deps===0&&f.resolve())},we=(l,f,a,p=!1,h=!1,b=0)=>{for(let C=b;Cl.shapeFlag&6?bt(l.component.subTree):l.shapeFlag&128?l.suspense.next():v(l.anchor||l.el),Kn=(l,f,a)=>{l==null?f._vnode&&Me(f._vnode,null,null,!0):I(f._vnode||null,l,f,null,null,null,a),zs(),f._vnode=l},Ye={p:I,um:Me,m:Je,r:Un,mt:Wt,mc:k,pc:ve,pbc:re,n:bt,o:e};let kt,qt;return t&&([kt,qt]=t(Ye)),{render:Kn,hydrate:kt,createApp:Xi(Kn,kt)}}function $e({effect:e,update:t},n){e.allowRecurse=t.allowRecurse=n}function ur(e,t,n=!1){const s=e.children,r=t.children;if(M(s)&&M(r))for(let i=0;i>1,e[n[c]]0&&(t[s]=n[i-1]),n[i]=s)}}for(i=n.length,o=n[i-1];i-- >0;)n[i]=o,o=t[o];return n}const to=e=>e.__isTeleport,no=Symbol(),xe=Symbol(void 0),Sn=Symbol(void 0),Te=Symbol(void 0),Tt=Symbol(void 0),pt=[];let ze=null;function so(e=!1){pt.push(ze=e?null:[])}function ro(){pt.pop(),ze=pt[pt.length-1]||null}let Lt=1;function cs(e){Lt+=e}function io(e){return e.dynamicChildren=Lt>0?ze||et:null,ro(),Lt>0&&ze&&ze.push(e),e}function oo(e,t,n,s,r,i){return io(ne(e,t,n,s,r,i,!0))}function lo(e){return e?e.__v_isVNode===!0:!1}function Ue(e,t){return e.type===t.type&&e.key===t.key}const Dt="__vInternal",ar=({key:e})=>e!=null?e:null,Ot=({ref:e,ref_key:t,ref_for:n})=>e!=null?Y(e)||X(e)||F(e)?{i:Ce,r:e,k:t,f:!!n}:e:null;function ne(e,t=null,n=null,s=0,r=null,i=e===xe?0:1,o=!1,c=!1){const u={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&ar(t),ref:t&&Ot(t),scopeId:Vs,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:i,patchFlag:s,dynamicProps:r,dynamicChildren:null,appContext:null};return c?(jn(u,n),i&128&&e.normalize(u)):n&&(u.shapeFlag|=Y(n)?8:16),Lt>0&&!o&&ze&&(u.patchFlag>0||i&6)&&u.patchFlag!==32&&ze.push(u),u}const He=co;function co(e,t=null,n=null,s=0,r=null,i=!1){if((!e||e===no)&&(e=Te),lo(e)){const c=qe(e,t,!0);return n&&jn(c,n),c}if(vo(e)&&(e=e.__vccOpts),t){t=fo(t);let{class:c,style:u}=t;c&&!Y(c)&&(t.class=xn(c)),Z(u)&&(js(u)&&!M(u)&&(u=Q({},u)),t.style=bn(u))}const o=Y(e)?1:wi(e)?128:to(e)?64:Z(e)?4:F(e)?2:0;return ne(e,t,n,s,r,o,i,!0)}function fo(e){return e?js(e)||Dt in e?Q({},e):e:null}function qe(e,t,n=!1){const{props:s,ref:r,patchFlag:i,children:o}=e,c=t?ao(s||{},t):s;return{__v_isVNode:!0,__v_skip:!0,type:e.type,props:c,key:c&&ar(c),ref:t&&t.ref?n&&r?M(r)?r.concat(Ot(t)):[r,Ot(t)]:Ot(t):r,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:o,target:e.target,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==xe?i===-1?16:i|16:i,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:e.transition,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&qe(e.ssContent),ssFallback:e.ssFallback&&qe(e.ssFallback),el:e.el,anchor:e.anchor}}function De(e=" ",t=0){return He(Sn,null,e,t)}function uo(e,t){const n=He(Tt,null,e);return n.staticCount=t,n}function ye(e){return e==null||typeof e=="boolean"?He(Te):M(e)?He(xe,null,e.slice()):typeof e=="object"?Pe(e):He(Sn,null,String(e))}function Pe(e){return e.el===null||e.memo?e:qe(e)}function jn(e,t){let n=0;const{shapeFlag:s}=e;if(t==null)t=null;else if(M(t))n=16;else if(typeof t=="object")if(s&65){const r=t.default;r&&(r._c&&(r._d=!1),jn(e,r()),r._c&&(r._d=!0));return}else{n=32;const r=t._;!r&&!(Dt in t)?t._ctx=Ce:r===3&&Ce&&(Ce.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else F(t)?(t={default:t,_ctx:Ce},n=32):(t=String(t),s&64?(n=16,t=[De(t)]):n=8);e.children=t,e.shapeFlag|=n}function ao(...e){const t={};for(let n=0;ne?dr(e)?$n(e)||e.proxy:pn(e.parent):null,Nt=Q(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>pn(e.parent),$root:e=>pn(e.root),$emit:e=>e.emit,$options:e=>sr(e),$forceUpdate:e=>()=>Ks(e.update),$nextTick:e=>di.bind(e.proxy),$watch:e=>Oi.bind(e)}),ho={get({_:e},t){const{ctx:n,setupState:s,data:r,props:i,accessCache:o,type:c,appContext:u}=e;let d;if(t[0]!=="$"){const A=o[t];if(A!==void 0)switch(A){case 1:return s[t];case 2:return r[t];case 4:return n[t];case 3:return i[t]}else{if(s!==B&&P(s,t))return o[t]=1,s[t];if(r!==B&&P(r,t))return o[t]=2,r[t];if((d=e.propsOptions[0])&&P(d,t))return o[t]=3,i[t];if(n!==B&&P(n,t))return o[t]=4,n[t];un&&(o[t]=0)}}const m=Nt[t];let y,v;if(m)return t==="$attrs"&&le(e,"get",t),m(e);if((y=c.__cssModules)&&(y=y[t]))return y;if(n!==B&&P(n,t))return o[t]=4,n[t];if(v=u.config.globalProperties,P(v,t))return v[t]},set({_:e},t,n){const{data:s,setupState:r,ctx:i}=e;return r!==B&&P(r,t)?(r[t]=n,!0):s!==B&&P(s,t)?(s[t]=n,!0):P(e.props,t)||t[0]==="$"&&t.slice(1)in e?!1:(i[t]=n,!0)},has({_:{data:e,setupState:t,accessCache:n,ctx:s,appContext:r,propsOptions:i}},o){let c;return!!n[o]||e!==B&&P(e,o)||t!==B&&P(t,o)||(c=i[0])&&P(c,o)||P(s,o)||P(Nt,o)||P(r.config.globalProperties,o)},defineProperty(e,t,n){return n.get!=null?e._.accessCache[t]=0:P(n,"value")&&this.set(e,t,n.value,null),Reflect.defineProperty(e,t,n)}},po=fr();let go=0;function mo(e,t,n){const s=e.type,r=(t?t.appContext:e.appContext)||po,i={uid:go++,vnode:e,type:s,parent:t,appContext:r,root:null,next:null,subTree:null,effect:null,update:null,scope:new Pr(!0),render:null,proxy:null,exposed:null,exposeProxy:null,withProxy:null,provides:t?t.provides:Object.create(r.provides),accessCache:null,renderCache:[],components:null,directives:null,propsOptions:ir(s,r),emitsOptions:qs(s,r),emit:null,emitted:null,propsDefaults:B,inheritAttrs:s.inheritAttrs,ctx:B,data:B,props:B,attrs:B,slots:B,refs:B,setupState:B,setupContext:null,suspense:n,suspenseId:n?n.pendingId:0,asyncDep:null,asyncResolved:!1,isMounted:!1,isUnmounted:!1,isDeactivated:!1,bc:null,c:null,bm:null,m:null,bu:null,u:null,um:null,bum:null,da:null,a:null,rtg:null,rtc:null,ec:null,sp:null};return i.ctx={_:i},i.root=t?t.root:i,i.emit=_i.bind(null,i),e.ce&&e.ce(i),i}let J=null;const _o=()=>J||Ce,rt=e=>{J=e,e.scope.on()},ke=()=>{J&&J.scope.off(),J=null};function dr(e){return e.vnode.shapeFlag&4}let _t=!1;function bo(e,t=!1){_t=t;const{props:n,children:s}=e.vnode,r=dr(e);ki(e,n,r,t),Ji(e,s);const i=r?xo(e,t):void 0;return _t=!1,i}function xo(e,t){const n=e.type;e.accessCache=Object.create(null),e.proxy=$s(new Proxy(e.ctx,ho));const{setup:s}=n;if(s){const r=e.setupContext=s.length>1?Co(e):null;rt(e),ot();const i=Ne(s,e,0,[e.props,r]);if(lt(),ke(),Cs(i)){if(i.then(ke,ke),t)return i.then(o=>{fs(e,o,t)}).catch(o=>{$t(o,e,0)});e.asyncDep=i}else fs(e,i,t)}else hr(e,t)}function fs(e,t,n){F(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:Z(t)&&(e.setupState=Bs(t)),hr(e,n)}let us;function hr(e,t,n){const s=e.type;if(!e.render){if(!t&&us&&!s.render){const r=s.template;if(r){const{isCustomElement:i,compilerOptions:o}=e.appContext.config,{delimiters:c,compilerOptions:u}=s,d=Q(Q({isCustomElement:i,delimiters:c},o),u);s.render=us(r,d)}}e.render=s.render||ge}rt(e),ot(),Ui(e),lt(),ke()}function yo(e){return new Proxy(e.attrs,{get(t,n){return le(e,"get","$attrs"),t[n]}})}function Co(e){const t=s=>{e.exposed=s||{}};let n;return{get attrs(){return n||(n=yo(e))},slots:e.slots,emit:e.emit,expose:t}}function $n(e){if(e.exposed)return e.exposeProxy||(e.exposeProxy=new Proxy(Bs($s(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in Nt)return Nt[n](e)}}))}function vo(e){return F(e)&&"__vccOpts"in e}const wo=(e,t)=>ui(e,t,_t),Eo="3.2.33",To="http://www.w3.org/2000/svg",Ke=typeof document!="undefined"?document:null,as=Ke&&Ke.createElement("template"),Oo={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{const t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,s)=>{const r=t?Ke.createElementNS(To,e):Ke.createElement(e,n?{is:n}:void 0);return e==="select"&&s&&s.multiple!=null&&r.setAttribute("multiple",s.multiple),r},createText:e=>Ke.createTextNode(e),createComment:e=>Ke.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>Ke.querySelector(e),setScopeId(e,t){e.setAttribute(t,"")},cloneNode(e){const t=e.cloneNode(!0);return"_value"in e&&(t._value=e._value),t},insertStaticContent(e,t,n,s,r,i){const o=n?n.previousSibling:t.lastChild;if(r&&(r===i||r.nextSibling))for(;t.insertBefore(r.cloneNode(!0),n),!(r===i||!(r=r.nextSibling)););else{as.innerHTML=s?`${e}`:e;const c=as.content;if(s){const u=c.firstChild;for(;u.firstChild;)c.appendChild(u.firstChild);c.removeChild(u)}t.insertBefore(c,n)}return[o?o.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}};function Ao(e,t,n){const s=e._vtc;s&&(t=(t?[t,...s]:[...s]).join(" ")),t==null?e.removeAttribute("class"):n?e.setAttribute("class",t):e.className=t}function Mo(e,t,n){const s=e.style,r=Y(n);if(n&&!r){for(const i in n)gn(s,i,n[i]);if(t&&!Y(t))for(const i in t)n[i]==null&&gn(s,i,"")}else{const i=s.display;r?t!==n&&(s.cssText=n):t&&e.removeAttribute("style"),"_vod"in e&&(s.display=i)}}const ds=/\s*!important$/;function gn(e,t,n){if(M(n))n.forEach(s=>gn(e,t,s));else if(n==null&&(n=""),t.startsWith("--"))e.setProperty(t,n);else{const s=Fo(e,t);ds.test(n)?e.setProperty(it(s),n.replace(ds,""),"important"):e[s]=n}}const hs=["Webkit","Moz","ms"],Gt={};function Fo(e,t){const n=Gt[t];if(n)return n;let s=st(t);if(s!=="filter"&&s in e)return Gt[t]=s;s=Es(s);for(let r=0;r{let e=Date.now,t=!1;if(typeof window!="undefined"){Date.now()>document.createEvent("Event").timeStamp&&(e=()=>performance.now());const n=navigator.userAgent.match(/firefox\/(\d+)/i);t=!!(n&&Number(n[1])<=53)}return[e,t]})();let mn=0;const No=Promise.resolve(),Ho=()=>{mn=0},Ro=()=>mn||(No.then(Ho),mn=pr());function So(e,t,n,s){e.addEventListener(t,n,s)}function jo(e,t,n,s){e.removeEventListener(t,n,s)}function $o(e,t,n,s,r=null){const i=e._vei||(e._vei={}),o=i[t];if(s&&o)o.value=s;else{const[c,u]=Bo(t);if(s){const d=i[t]=Uo(s,r);So(e,c,d,u)}else o&&(jo(e,c,o,u),i[t]=void 0)}}const gs=/(?:Once|Passive|Capture)$/;function Bo(e){let t;if(gs.test(e)){t={};let n;for(;n=e.match(gs);)e=e.slice(0,e.length-n[0].length),t[n[0].toLowerCase()]=!0}return[it(e.slice(2)),t]}function Uo(e,t){const n=s=>{const r=s.timeStamp||pr();(Lo||r>=n.attached-1)&&ue(Ko(s,n.value),t,5,[s])};return n.value=e,n.attached=Ro(),n}function Ko(e,t){if(M(t)){const n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(s=>r=>!r._stopped&&s&&s(r))}else return t}const ms=/^on[a-z]/,Do=(e,t,n,s,r=!1,i,o,c,u)=>{t==="class"?Ao(e,s,r):t==="style"?Mo(e,n,s):Ht(t)?yn(t)||$o(e,t,n,s,o):(t[0]==="."?(t=t.slice(1),!0):t[0]==="^"?(t=t.slice(1),!1):Wo(e,t,s,r))?Po(e,t,s,i,o,c,u):(t==="true-value"?e._trueValue=s:t==="false-value"&&(e._falseValue=s),Io(e,t,s,r))};function Wo(e,t,n,s){return s?!!(t==="innerHTML"||t==="textContent"||t in e&&ms.test(t)&&F(n)):t==="spellcheck"||t==="draggable"||t==="translate"||t==="form"||t==="list"&&e.tagName==="INPUT"||t==="type"&&e.tagName==="TEXTAREA"||ms.test(t)&&Y(n)?!1:t in e}const zo={name:String,type:String,css:{type:Boolean,default:!0},duration:[String,Number,Object],enterFromClass:String,enterActiveClass:String,enterToClass:String,appearFromClass:String,appearActiveClass:String,appearToClass:String,leaveFromClass:String,leaveActiveClass:String,leaveToClass:String};Fi.props;const ko=Q({patchProp:Do},Oo);let _s;function qo(){return _s||(_s=Qi(ko))}const Vo=(...e)=>{const t=qo().createApp(...e),{mount:n}=t;return t.mount=s=>{const r=Jo(s);if(!r)return;const i=t._component;!F(i)&&!i.render&&!i.template&&(i.template=r.innerHTML),r.innerHTML="";const o=n(r,!1,r instanceof SVGElement);return r instanceof Element&&(r.removeAttribute("v-cloak"),r.setAttribute("data-v-app","")),o},t};function Jo(e){return Y(e)?document.querySelector(e):e}var Yo={data(){return{event:null,vssWidth:null,vssHeight:null}},computed:{$vssEvent(){return this.event},$vssWidth(){return this.vssWidth||this.getScreenWidth()},$vssHeight(){return this.vssHeight||this.getScreenHeight()}},methods:{getScreenWidth(){return window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth},getScreenHeight(){return window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight},handleResize(e){this.event=e,this.vssWidth=this.getScreenWidth(),this.vssHeight=this.getScreenHeight()},$vssDestroyListener(){window.removeEventListener("resize",this.handleResize)}},mounted(){window.addEventListener("resize",this.handleResize)},destroyed(){window.removeEventListener("resize",this.handleResize)}};var Zo=(e,t)=>{const n=e.__vccOpts||e;for(const[s,r]of t)n[s]=r;return n};const Xo={name:"app",mixins:[Yo],data(){return{}}},Qo={id:"app"},Go=uo('

vue-screen-size

To install:
yarn add vue-screen-size
View on GitHubView on NPM
',4),el={class:"container"},tl={class:"row justify-content-center"},nl={class:"col-lg-10"},sl=ne("p",null," Below are the values for the width and height of your screen. The values are calculated on page load, and are responsive - so if you resize the window you'll see the values update in real-time. ",-1),rl=De(" Width: "),il={class:"badge badge-primary"},ol=De(" Height: "),ll={class:"badge badge-primary"},cl=ne("p",null,[De(" Once installed, use "),ne("code",null,"$vssWidth"),De(" for the width and "),ne("code",null,"$vssHeight"),De(" for the height. See the "),ne("a",{href:"https://github.com/johndatserakis/vue-screen-size"},"documentation"),De(" on GitHub to get started. ")],-1);function fl(e,t,n,s,r,i){return so(),oo("div",Qo,[Go,ne("div",el,[ne("div",tl,[ne("div",nl,[sl,ne("p",null,[rl,ne("span",il,kn(e.$vssWidth),1)]),ne("p",null,[ol,ne("span",ll,kn(e.$vssHeight),1)]),cl])])])])}var ul=Zo(Xo,[["render",fl]]);const al=Vo(ul);al.mount("#app"); 2 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 11 | 12 | vue-screen-size | John Datserakis 13 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /example/App.vue: -------------------------------------------------------------------------------- 1 | 100 | 101 | 112 | 113 | 183 | -------------------------------------------------------------------------------- /example/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 11 | 12 | vue-screen-size | John Datserakis 13 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /example/index.js: -------------------------------------------------------------------------------- 1 | import { createApp } from 'vue'; 2 | import App from './App.vue'; 3 | 4 | const app = createApp(App); 5 | 6 | // This is an example of loading it the global way. 7 | // import { VueScreenSizeMixin } from '../src/index.js'; 8 | // app.mixin(VueScreenSizeMixin); 9 | 10 | app.mount('#app'); 11 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "author": "John Datserakis ", 3 | "browser": { 4 | "./sfc": "src/vue-screen-size.vue" 5 | }, 6 | "bugs": { 7 | "url": "https://github.com/johndatserakis/vue-screen-size/issues" 8 | }, 9 | "description": "Get easy and reactive access to the width and height of your screen.", 10 | "devDependencies": { 11 | "@babel/cli": "^7.4.4", 12 | "@babel/core": "^7.4.5", 13 | "@babel/preset-env": "^7.4.5", 14 | "@vitejs/plugin-vue": "^2.3.3", 15 | "@vue/compiler-sfc": "^3.2.31", 16 | "@vue/test-utils": "^2.0.0-rc.18", 17 | "babel-core": "^7.0.0-bridge.0", 18 | "babel-jest": "^24.8.0", 19 | "jest": "^24.8.0", 20 | "jest-serializer-vue": "^2.0.2", 21 | "minimist": "^1.2.0", 22 | "rimraf": "^3.0.2", 23 | "rollup": "^1.15.6", 24 | "rollup-plugin-buble": "^0.19.6", 25 | "rollup-plugin-commonjs": "^10.0.0", 26 | "rollup-plugin-node-resolve": "^5.0.3", 27 | "rollup-plugin-terser": "^5.0.0", 28 | "rollup-plugin-vue": "^6.0.0", 29 | "sass": "^1.49.9", 30 | "vite": "^2.9.9", 31 | "vue": "^3.2.31", 32 | "vue-jest": "^5.0.0-alpha.10" 33 | }, 34 | "jest": { 35 | "moduleFileExtensions": [ 36 | "js", 37 | "vue" 38 | ], 39 | "moduleNameMapper": { 40 | "^@/(.*)$": "/src/$1" 41 | }, 42 | "snapshotSerializers": [ 43 | "/node_modules/jest-serializer-vue" 44 | ], 45 | "transform": { 46 | ".*\\.(vue)$": "/node_modules/vue-jest", 47 | "^.+\\.js$": "/node_modules/babel-jest" 48 | } 49 | }, 50 | "keywords": [ 51 | "vue", 52 | "screen", 53 | "size", 54 | "width", 55 | "height" 56 | ], 57 | "license": "MIT", 58 | "main": "dist/vue-screen-size.umd.js", 59 | "module": "dist/vue-screen-size.esm.js", 60 | "name": "vue-screen-size", 61 | "peerDependencies": { 62 | "vue": "^3.2.31" 63 | }, 64 | "repository": { 65 | "type": "git", 66 | "url": "git+https://github.com/johndatserakis/vue-screen-size.git" 67 | }, 68 | "scripts": { 69 | "build": "npm run test && npm run build:example && npm run build:library", 70 | "build:es": "rollup --config rollup.config.js --format es --file dist/vue-screen-size.esm.js", 71 | "build:example": "rimraf docs && vite build", 72 | "build:library": "rimraf dist npm run build:umd & npm run build:es & npm run build:umd & npm run build:unpkg", 73 | "build:umd": "rollup --config rollup.config.js --format umd --file dist/vue-screen-size.umd.js", 74 | "build:unpkg": "rollup --config rollup.config.js --format iife --file dist/vue-screen-size.min.js", 75 | "test": "jest", 76 | "dev": "vite" 77 | }, 78 | "sideEffects": false, 79 | "typings": "src/types.d.ts", 80 | "unpkg": "dist/vue-screen-size.min.js", 81 | "version": "2.1.0" 82 | } 83 | -------------------------------------------------------------------------------- /rollup.config.js: -------------------------------------------------------------------------------- 1 | import vue from 'rollup-plugin-vue'; 2 | import buble from 'rollup-plugin-buble'; 3 | import commonjs from 'rollup-plugin-commonjs'; 4 | import resolve from 'rollup-plugin-node-resolve'; 5 | import { terser } from 'rollup-plugin-terser'; 6 | import minimist from 'minimist'; 7 | 8 | const argv = minimist(process.argv.slice(2)); 9 | 10 | const config = { 11 | input: 'src/index.js', 12 | output: { 13 | name: 'VueScreenSize', 14 | exports: 'named', 15 | globals: { 16 | vue: 'Vue', 17 | }, 18 | }, 19 | plugins: [ 20 | vue({ 21 | compileTemplate: true, 22 | css: false, 23 | }), 24 | resolve(), 25 | buble(), 26 | commonjs(), 27 | ], 28 | external: ['vue'], 29 | }; 30 | 31 | // Only minify browser (iife) version 32 | if (argv.format === 'iife') { 33 | config.plugins.push(terser()); 34 | 35 | // Here we remove our `external` dependency that we have in this project 36 | // Be careful with the index here - it has to match any dependency that 37 | // you want to be built into to the iife output 38 | // config.external.splice(1) 39 | } 40 | 41 | export default config; 42 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import VueScreenSizeMixin from './vue-screen-size'; 2 | 3 | const install = (app) => { 4 | app.mixin(VueScreenSizeMixin); 5 | }; 6 | 7 | export default install; 8 | 9 | // Also export the actual mixin so consumers can use it on a single component if they choose 10 | export { VueScreenSizeMixin }; 11 | -------------------------------------------------------------------------------- /src/types.d.ts: -------------------------------------------------------------------------------- 1 | declare module 'vue-screen-size' { 2 | class VueScreenSizeMixin { 3 | $vssEvent: UIEvent; 4 | $vssWidth: number; 5 | $vssHeight: number; 6 | getScreenWidth(): number; 7 | getScreenHeight(): number; 8 | handleResize(event: UIEvent): void; 9 | $vssDestroyListener(): void; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/vue-screen-size.js: -------------------------------------------------------------------------------- 1 | export default { 2 | data() { 3 | return { 4 | event: null, 5 | vssWidth: null, 6 | vssHeight: null, 7 | }; 8 | }, 9 | computed: { 10 | $vssEvent() { 11 | return this.event; 12 | }, 13 | $vssWidth() { 14 | return this.vssWidth || this.getScreenWidth(); 15 | }, 16 | $vssHeight() { 17 | return this.vssHeight || this.getScreenHeight(); 18 | }, 19 | }, 20 | methods: { 21 | getScreenWidth() { 22 | return window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; 23 | }, 24 | getScreenHeight() { 25 | return ( 26 | window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight 27 | ); 28 | }, 29 | handleResize(event) { 30 | this.event = event; 31 | this.vssWidth = this.getScreenWidth(); 32 | this.vssHeight = this.getScreenHeight(); 33 | }, 34 | $vssDestroyListener() { 35 | window.removeEventListener('resize', this.handleResize); 36 | }, 37 | }, 38 | mounted() { 39 | window.addEventListener('resize', this.handleResize); 40 | }, 41 | destroyed() { 42 | window.removeEventListener('resize', this.handleResize); 43 | }, 44 | }; 45 | -------------------------------------------------------------------------------- /test/VueScreenSize.spec.js: -------------------------------------------------------------------------------- 1 | let emptyComponent = { 2 | template: ` 3 |
4 | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Natus eveniet, quidem veniam. Excepturi provident at soluta, minus quasi similique fuga, eum eligendi autem magni qui modi pariatur esse tenetur vel! 5 |
6 | `, 7 | data() { 8 | return {}; 9 | }, 10 | }; 11 | 12 | import { shallowMount } from '@vue/test-utils'; 13 | import { VueScreenSizeMixin } from '@/index.js'; 14 | 15 | describe('vue-screen-size.js', () => { 16 | it('Sets $vssWidth and $vssHeight correctly', async () => { 17 | const wrapper = shallowMount(emptyComponent, { 18 | mixins: [VueScreenSizeMixin], 19 | }); 20 | 21 | expect(wrapper.vm.$vssWidth).toBeGreaterThan(1); 22 | expect(wrapper.vm.$vssHeight).toBeGreaterThan(1); 23 | }); 24 | }); 25 | -------------------------------------------------------------------------------- /vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import vue from '@vitejs/plugin-vue'; 3 | 4 | export default defineConfig({ 5 | base: '/vue-screen-size/', // For GitHub docs support 6 | build: { 7 | outDir: '../docs', 8 | }, 9 | plugins: [vue()], 10 | root: 'example', 11 | }); 12 | --------------------------------------------------------------------------------