simplest-scale-srceen/dist/simplest-scale-srceen.js

npm install simplest-scale-srceen

import { defineComponent as d, createVNode as o, ref as s } from "vue";
const r = 1920, c = 1080, a = /* @__PURE__ */ d({
  name: "scale-screen",
  props: {
    width: {
      default: window.screen.width > r ? window.screen.width : r,
      type: Number
    },
    height: {
      default: window.screen.height > c ? window.screen.height : c,
      type: Number
    }
  },
  setup() {
    const e = s(), t = s(), i = s(1), n = s("auto");
    return {
      containerEl: e,
      handle: t,
      scale: i,
      scrollHeight: n
    };
  },
  render() {
    const e = this.$slots.default || null;
    return e ? o("div", {
      class: "scale-screen-wrap",
      style: {
        height: this.scrollHeight
      }
    }, [o("div", {
      class: "scale-screen",
      ref: (t) => this.containerEl = t
    }, [e()])]) : o("div", null, null);
  },
  methods: {
    resize(e) {
      let {
        width: t,
        height: i
      } = this.$props;
      const n = (window.innerWidth - e) / t;
      this.scale = n, this.scrollHeight = n * i + "px", this.$emit("change", {
        scale: n,
        width: this.$props.width,
        height: this.$props.height
      }), this.containerEl.setAttribute("style", `width:${t}px;height:${i}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);
  }
}), w = (e, t) => {
  const i = e.__vccOpts || e;
  for (const [n, l] of t)
    i[n] = l;
  return i;
}, u = /* @__PURE__ */ w(a, [["__scopeId", "data-v-f3a65895"]]);
let h = !1;
const f = function(e) {
  h || (h = !0, e.component("scale-screen", u));
};
typeof window < "u" && window.Vue && f(window.Vue);
export {
  u as ScaleScreen,
  f as default
};