@stories-js/core/dist/cjs/stories-zoom.cjs.entry.js

Stories web components to build stories

/*!
 * (C) StoriesJS https://storiesjs.org - GPL-2.0 License
 */
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-c25eada5.js');

function browserSupportsCssZoom() {
  try {
    return (
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    document.implementation.createHTMLDocument('').body.style.zoom !== undefined);
  }
  catch (error) {
    return false;
  }
}
function computeZoomStyle(zoom) {
  return {
    zoom: zoom.toPrecision(2),
  };
}
function computeTransformStyle(height, zoom) {
  return {
    height: (height + 50).toFixed(),
    transformOrigin: 'top left',
    transform: `scale(${zoom})`,
  };
}

const zoomCss = ":host{display:block}";

const zoomStyle = browserSupportsCssZoom();
const Zoom = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.height = 0;
    this.zoom = 1;
  }
  watchStateHandler(newDiv) {
    this.height = newDiv.getBoundingClientRect().height;
  }
  render() {
    const style = zoomStyle ? computeZoomStyle(this.zoom) : computeTransformStyle(this.height, this.zoom);
    return (index.h(index.Host, { style: style }, index.h("div", { ref: (el) => this.div = el, class: "innerZoomElementWrapper" }, index.h("slot", null))));
  }
  static get watchers() { return {
    "div": ["watchStateHandler"]
  }; }
};
Zoom.style = zoomCss;

exports.stories_zoom = Zoom;

//# sourceMappingURL=stories-zoom.cjs.entry.js.map