simplest-scale-srceen/dist/simplest-scale-srceen.cjs

npm install simplest-scale-srceen

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("vue"),r=1920,o=1080,a=i.defineComponent({name:"scale-screen",props:{width:{default:window.screen.width>r?window.screen.width:r,type:Number},height:{default:window.screen.height>o?window.screen.height:o,type:Number}},setup(){const e=i.ref(),t=i.ref(),s=i.ref(1),n=i.ref("auto");return{containerEl:e,handle:t,scale:s,scrollHeight:n}},render(){const e=this.$slots.default||null;return e?i.createVNode("div",{class:"scale-screen-wrap",style:{height:this.scrollHeight}},[i.createVNode("div",{class:"scale-screen",ref:t=>this.containerEl=t},[e()])]):i.createVNode("div",null,null)},methods:{resize(e){let{width:t,height:s}=this.$props;const n=(window.innerWidth-e)/t;this.scale=n,this.scrollHeight=n*s+"px",this.$emit("change",{scale:n,width:this.$props.width,height:this.$props.height}),this.containerEl.setAttribute("style",`width:${t}px;height:${s}px;transform: scale(${n});`)}},mounted(){const e=window.innerWidth-this.containerEl.offsetWidth;let t=null;this.handle=()=>{t&&clearTimeout(t),t=window.setTimeout(()=>{this.resize(e)},30)},this.resize(e),window.addEventListener("resize",this.handle,!1)},unmounted(){window.removeEventListener("resize",this.handle)}}),u=(e,t)=>{const s=e.__vccOpts||e;for(const[n,h]of t)s[n]=h;return s},l=u(a,[["__scopeId","data-v-f3a65895"]]);let c=!1;const d=function(e){c||(c=!0,e.component("scale-screen",l))};typeof window<"u"&&window.Vue&&d(window.Vue);exports.ScaleScreen=l;exports.default=d;