payload 2.0.0-beta.2 → 2.0.0-beta.20

package/dist/admin/components/views/LivePreview/Context/index.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import type { LivePreview } from '../../../../../exports/config';
+import type { EditViewProps } from '../../types';
+import type { usePopupWindow } from '../usePopupWindow';
+export type ToolbarProviderProps = EditViewProps & {
+    breakpoints?: LivePreview['breakpoints'];
+    children: React.ReactNode;
+    deviceSize?: {
+        height: number;
+        width: number;
+    };
+    popupState: ReturnType<typeof usePopupWindow>;
+    url?: string;
+};
+export declare const LivePreviewProvider: React.FC<ToolbarProviderProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/admin/components/views/LivePreview/Context/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/admin/components/views/LivePreview/Context/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAiC,MAAM,OAAO,CAAA;AAErD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAChE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAOvD,MAAM,MAAM,oBAAoB,GAAG,aAAa,GAAG;IACjD,WAAW,CAAC,EAAE,WAAW,CAAC,aAAa,CAAC,CAAA;IACxC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,UAAU,CAAC,EAAE;QACX,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,UAAU,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;IAC7C,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAqG9D,CAAA"}

package/dist/admin/components/views/LivePreview/Context/index.js

@@ -0,0 +1,147 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "LivePreviewProvider", {
+    enumerable: true,
+    get: function() {
+        return LivePreviewProvider;
+    }
+});
+const _core = require("@dnd-kit/core");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _useResize = require("../../../../utilities/useResize");
+const _collisionDetection = require("./collisionDetection");
+const _context = require("./context");
+const _sizeReducer = require("./sizeReducer");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const LivePreviewProvider = (props)=>{
+    const { breakpoints, children } = props;
+    const iframeRef = _react.default.useRef(null);
+    const deviceFrameRef = _react.default.useRef(null);
+    const [iframeHasLoaded, setIframeHasLoaded] = _react.default.useState(false);
+    const [zoom, setZoom] = _react.default.useState(1);
+    const [position, setPosition] = _react.default.useState({
+        x: 0,
+        y: 0
+    });
+    const [size, setSize] = _react.default.useReducer(_sizeReducer.sizeReducer, {
+        height: 0,
+        width: 0
+    });
+    const [breakpoint, setBreakpoint] = _react.default.useState('responsive');
+    // The toolbar needs to freely drag and drop around the page
+    const handleDragEnd = (ev)=>{
+        // only update position if the toolbar is completely within the preview area
+        // otherwise reset it back to the previous position
+        // TODO: reset to the nearest edge of the preview area
+        if (ev.over && ev.over.id === 'live-preview-area') {
+            const newPos = {
+                x: position.x + ev.delta.x,
+                y: position.y + ev.delta.y
+            };
+            setPosition(newPos);
+        } else {
+        // reset
+        }
+    };
+    const setWidth = (0, _react.useCallback)((width)=>{
+        setSize({
+            type: 'width',
+            value: width
+        });
+    }, [
+        setSize
+    ]);
+    const setHeight = (0, _react.useCallback)((height)=>{
+        setSize({
+            type: 'height',
+            value: height
+        });
+    }, [
+        setSize
+    ]);
+    // explicitly set new width and height when as new breakpoints are selected
+    // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly
+    (0, _react.useEffect)(()=>{
+        const foundBreakpoint = breakpoints?.find((bp)=>bp.name === breakpoint);
+        if (foundBreakpoint && breakpoint !== 'responsive' && breakpoint !== 'custom' && typeof foundBreakpoint?.width === 'number' && typeof foundBreakpoint?.height === 'number') {
+            setSize({
+                type: 'reset',
+                value: {
+                    height: foundBreakpoint.height,
+                    width: foundBreakpoint.width
+                }
+            });
+        }
+    }, [
+        breakpoint,
+        breakpoints
+    ]);
+    // keep an accurate measurement of the actual device size as it is truly rendered
+    // this is helpful when `sizes` are non-number units like percentages, etc.
+    const { size: measuredDeviceSize } = (0, _useResize.useResize)(deviceFrameRef);
+    return /*#__PURE__*/ _react.default.createElement(_context.LivePreviewContext.Provider, {
+        value: {
+            breakpoint,
+            breakpoints,
+            deviceFrameRef,
+            iframeHasLoaded,
+            iframeRef,
+            measuredDeviceSize,
+            setBreakpoint,
+            setHeight,
+            setIframeHasLoaded,
+            setSize,
+            setToolbarPosition: setPosition,
+            setWidth,
+            setZoom,
+            size,
+            toolbarPosition: position,
+            zoom
+        }
+    }, /*#__PURE__*/ _react.default.createElement(_core.DndContext, {
+        collisionDetection: _collisionDetection.customCollisionDetection,
+        onDragEnd: handleDragEnd
+    }, children));
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL3ZpZXdzL0xpdmVQcmV2aWV3L0NvbnRleHQvaW5kZXgudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERuZENvbnRleHQgfSBmcm9tICdAZG5kLWtpdC9jb3JlJ1xuaW1wb3J0IFJlYWN0LCB7IHVzZUNhbGxiYWNrLCB1c2VFZmZlY3QgfSBmcm9tICdyZWFjdCdcblxuaW1wb3J0IHR5cGUgeyBMaXZlUHJldmlldyB9IGZyb20gJy4uLy4uLy4uLy4uLy4uL2V4cG9ydHMvY29uZmlnJ1xuaW1wb3J0IHR5cGUgeyBFZGl0Vmlld1Byb3BzIH0gZnJvbSAnLi4vLi4vdHlwZXMnXG5pbXBvcnQgdHlwZSB7IHVzZVBvcHVwV2luZG93IH0gZnJvbSAnLi4vdXNlUG9wdXBXaW5kb3cnXG5cbmltcG9ydCB7IHVzZVJlc2l6ZSB9IGZyb20gJy4uLy4uLy4uLy4uL3V0aWxpdGllcy91c2VSZXNpemUnXG5pbXBvcnQgeyBjdXN0b21Db2xsaXNpb25EZXRlY3Rpb24gfSBmcm9tICcuL2NvbGxpc2lvbkRldGVjdGlvbidcbmltcG9ydCB7IExpdmVQcmV2aWV3Q29udGV4dCB9IGZyb20gJy4vY29udGV4dCdcbmltcG9ydCB7IHNpemVSZWR1Y2VyIH0gZnJvbSAnLi9zaXplUmVkdWNlcidcblxuZXhwb3J0IHR5cGUgVG9vbGJhclByb3ZpZGVyUHJvcHMgPSBFZGl0Vmlld1Byb3BzICYge1xuICBicmVha3BvaW50cz86IExpdmVQcmV2aWV3WydicmVha3BvaW50cyddXG4gIGNoaWxkcmVuOiBSZWFjdC5SZWFjdE5vZGVcbiAgZGV2aWNlU2l6ZT86IHtcbiAgICBoZWlnaHQ6IG51bWJlclxuICAgIHdpZHRoOiBudW1iZXJcbiAgfVxuICBwb3B1cFN0YXRlOiBSZXR1cm5UeXBlPHR5cGVvZiB1c2VQb3B1cFdpbmRvdz5cbiAgdXJsPzogc3RyaW5nXG59XG5cbmV4cG9ydCBjb25zdCBMaXZlUHJldmlld1Byb3ZpZGVyOiBSZWFjdC5GQzxUb29sYmFyUHJvdmlkZXJQcm9wcz4gPSAocHJvcHMpID0+IHtcbiAgY29uc3QgeyBicmVha3BvaW50cywgY2hpbGRyZW4gfSA9IHByb3BzXG5cbiAgY29uc3QgaWZyYW1lUmVmID0gUmVhY3QudXNlUmVmPEhUTUxJRnJhbWVFbGVtZW50PihudWxsKVxuXG4gIGNvbnN0IGRldmljZUZyYW1lUmVmID0gUmVhY3QudXNlUmVmPEhUTUxEaXZFbGVtZW50PihudWxsKVxuXG4gIGNvbnN0IFtpZnJhbWVIYXNMb2FkZWQsIHNldElmcmFtZUhhc0xvYWRlZF0gPSBSZWFjdC51c2VTdGF0ZShmYWxzZSlcblxuICBjb25zdCBbem9vbSwgc2V0Wm9vbV0gPSBSZWFjdC51c2VTdGF0ZSgxKVxuXG4gIGNvbnN0IFtwb3NpdGlvbiwgc2V0UG9zaXRpb25dID0gUmVhY3QudXNlU3RhdGUoeyB4OiAwLCB5OiAwIH0pXG5cbiAgY29uc3QgW3NpemUsIHNldFNpemVdID0gUmVhY3QudXNlUmVkdWNlcihzaXplUmVkdWNlciwgeyBoZWlnaHQ6IDAsIHdpZHRoOiAwIH0pXG5cbiAgY29uc3QgW2JyZWFrcG9pbnQsIHNldEJyZWFrcG9pbnRdID1cbiAgICBSZWFjdC51c2VTdGF0ZTxMaXZlUHJldmlld1snYnJlYWtwb2ludHMnXVswXVsnbmFtZSddPigncmVzcG9uc2l2ZScpXG5cbiAgLy8gVGhlIHRvb2xiYXIgbmVlZHMgdG8gZnJlZWx5IGRyYWcgYW5kIGRyb3AgYXJvdW5kIHRoZSBwYWdlXG4gIGNvbnN0IGhhbmRsZURyYWdFbmQgPSAoZXYpID0+IHtcbiAgICAvLyBvbmx5IHVwZGF0ZSBwb3NpdGlvbiBpZiB0aGUgdG9vbGJhciBpcyBjb21wbGV0ZWx5IHdpdGhpbiB0aGUgcHJldmlldyBhcmVhXG4gICAgLy8gb3RoZXJ3aXNlIHJlc2V0IGl0IGJhY2sgdG8gdGhlIHByZXZpb3VzIHBvc2l0aW9uXG4gICAgLy8gVE9ETzogcmVzZXQgdG8gdGhlIG5lYXJlc3QgZWRnZSBvZiB0aGUgcHJldmlldyBhcmVhXG4gICAgaWYgKGV2Lm92ZXIgJiYgZXYub3Zlci5pZCA9PT0gJ2xpdmUtcHJldmlldy1hcmVhJykge1xuICAgICAgY29uc3QgbmV3UG9zID0ge1xuICAgICAgICB4OiBwb3NpdGlvbi54ICsgZXYuZGVsdGEueCxcbiAgICAgICAgeTogcG9zaXRpb24ueSArIGV2LmRlbHRhLnksXG4gICAgICB9XG5cbiAgICAgIHNldFBvc2l0aW9uKG5ld1BvcylcbiAgICB9IGVsc2Uge1xuICAgICAgLy8gcmVzZXRcbiAgICB9XG4gIH1cblxuICBjb25zdCBzZXRXaWR0aCA9IHVzZUNhbGxiYWNrKFxuICAgICh3aWR0aCkgPT4ge1xuICAgICAgc2V0U2l6ZSh7IHR5cGU6ICd3aWR0aCcsIHZhbHVlOiB3aWR0aCB9KVxuICAgIH0sXG4gICAgW3NldFNpemVdLFxuICApXG5cbiAgY29uc3Qgc2V0SGVpZ2h0ID0gdXNlQ2FsbGJhY2soXG4gICAgKGhlaWdodCkgPT4ge1xuICAgICAgc2V0U2l6ZSh7IHR5cGU6ICdoZWlnaHQnLCB2YWx1ZTogaGVpZ2h0IH0pXG4gICAgfSxcbiAgICBbc2V0U2l6ZV0sXG4gIClcblxuICAvLyBleHBsaWNpdGx5IHNldCBuZXcgd2lkdGggYW5kIGhlaWdodCB3aGVuIGFzIG5ldyBicmVha3BvaW50cyBhcmUgc2VsZWN0ZWRcbiAgLy8gZXhjbHVkZSBgY3VzdG9tYCBicmVha3BvaW50IGFzIGl0IGlzIGhhbmRsZWQgYnkgdGhlIGBzZXRXaWR0aGAgYW5kIGBzZXRIZWlnaHRgIGRpcmVjdGx5XG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgY29uc3QgZm91bmRCcmVha3BvaW50ID0gYnJlYWtwb2ludHM/LmZpbmQoKGJwKSA9PiBicC5uYW1lID09PSBicmVha3BvaW50KVxuXG4gICAgaWYgKFxuICAgICAgZm91bmRCcmVha3BvaW50ICYmXG4gICAgICBicmVha3BvaW50ICE9PSAncmVzcG9uc2l2ZScgJiZcbiAgICAgIGJyZWFrcG9pbnQgIT09ICdjdXN0b20nICYmXG4gICAgICB0eXBlb2YgZm91bmRCcmVha3BvaW50Py53aWR0aCA9PT0gJ251bWJlcicgJiZcbiAgICAgIHR5cGVvZiBmb3VuZEJyZWFrcG9pbnQ/LmhlaWdodCA9PT0gJ251bWJlcidcbiAgICApIHtcbiAgICAgIHNldFNpemUoe1xuICAgICAgICB0eXBlOiAncmVzZXQnLFxuICAgICAgICB2YWx1ZToge1xuICAgICAgICAgIGhlaWdodDogZm91bmRCcmVha3BvaW50LmhlaWdodCxcbiAgICAgICAgICB3aWR0aDogZm91bmRCcmVha3BvaW50LndpZHRoLFxuICAgICAgICB9LFxuICAgICAgfSlcbiAgICB9XG4gIH0sIFticmVha3BvaW50LCBicmVha3BvaW50c10pXG5cbiAgLy8ga2VlcCBhbiBhY2N1cmF0ZSBtZWFzdXJlbWVudCBvZiB0aGUgYWN0dWFsIGRldmljZSBzaXplIGFzIGl0IGlzIHRydWx5IHJlbmRlcmVkXG4gIC8vIHRoaXMgaXMgaGVscGZ1bCB3aGVuIGBzaXplc2AgYXJlIG5vbi1udW1iZXIgdW5pdHMgbGlrZSBwZXJjZW50YWdlcywgZXRjLlxuICBjb25zdCB7IHNpemU6IG1lYXN1cmVkRGV2aWNlU2l6ZSB9ID0gdXNlUmVzaXplKGRldmljZUZyYW1lUmVmKVxuXG4gIHJldHVybiAoXG4gICAgPExpdmVQcmV2aWV3Q29udGV4dC5Qcm92aWRlclxuICAgICAgdmFsdWU9e3tcbiAgICAgICAgYnJlYWtwb2ludCxcbiAgICAgICAgYnJlYWtwb2ludHMsXG4gICAgICAgIGRldmljZUZyYW1lUmVmLFxuICAgICAgICBpZnJhbWVIYXNMb2FkZWQsXG4gICAgICAgIGlmcmFtZVJlZixcbiAgICAgICAgbWVhc3VyZWREZXZpY2VTaXplLFxuICAgICAgICBzZXRCcmVha3BvaW50LFxuICAgICAgICBzZXRIZWlnaHQsXG4gICAgICAgIHNldElmcmFtZUhhc0xvYWRlZCxcbiAgICAgICAgc2V0U2l6ZSxcbiAgICAgICAgc2V0VG9vbGJhclBvc2l0aW9uOiBzZXRQb3NpdGlvbixcbiAgICAgICAgc2V0V2lkdGgsXG4gICAgICAgIHNldFpvb20sXG4gICAgICAgIHNpemUsXG4gICAgICAgIHRvb2xiYXJQb3NpdGlvbjogcG9zaXRpb24sXG4gICAgICAgIHpvb20sXG4gICAgICB9fVxuICAgID5cbiAgICAgIDxEbmRDb250ZXh0IGNvbGxpc2lvbkRldGVjdGlvbj17Y3VzdG9tQ29sbGlzaW9uRGV0ZWN0aW9ufSBvbkRyYWdFbmQ9e2hhbmRsZURyYWdFbmR9PlxuICAgICAgICB7Y2hpbGRyZW59XG4gICAgICA8L0RuZENvbnRleHQ+XG4gICAgPC9MaXZlUHJldmlld0NvbnRleHQuUHJvdmlkZXI+XG4gIClcbn1cbiJdLCJuYW1lcyI6WyJMaXZlUHJldmlld1Byb3ZpZGVyIiwicHJvcHMiLCJicmVha3BvaW50cyIsImNoaWxkcmVuIiwiaWZyYW1lUmVmIiwiUmVhY3QiLCJ1c2VSZWYiLCJkZXZpY2VGcmFtZVJlZiIsImlmcmFtZUhhc0xvYWRlZCIsInNldElmcmFtZUhhc0xvYWRlZCIsInVzZVN0YXRlIiwiem9vbSIsInNldFpvb20iLCJwb3NpdGlvbiIsInNldFBvc2l0aW9uIiwieCIsInkiLCJzaXplIiwic2V0U2l6ZSIsInVzZVJlZHVjZXIiLCJzaXplUmVkdWNlciIsImhlaWdodCIsIndpZHRoIiwiYnJlYWtwb2ludCIsInNldEJyZWFrcG9pbnQiLCJoYW5kbGVEcmFnRW5kIiwiZXYiLCJvdmVyIiwiaWQiLCJuZXdQb3MiLCJkZWx0YSIsInNldFdpZHRoIiwidXNlQ2FsbGJhY2siLCJ0eXBlIiwidmFsdWUiLCJzZXRIZWlnaHQiLCJ1c2VFZmZlY3QiLCJmb3VuZEJyZWFrcG9pbnQiLCJmaW5kIiwiYnAiLCJuYW1lIiwibWVhc3VyZWREZXZpY2VTaXplIiwidXNlUmVzaXplIiwiTGl2ZVByZXZpZXdDb250ZXh0IiwiUHJvdmlkZXIiLCJzZXRUb29sYmFyUG9zaXRpb24iLCJ0b29sYmFyUG9zaXRpb24iLCJEbmRDb250ZXh0IiwiY29sbGlzaW9uRGV0ZWN0aW9uIiwiY3VzdG9tQ29sbGlzaW9uRGV0ZWN0aW9u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

package/dist/admin/components/views/LivePreview/Context/sizeReducer.d.ts

@@ -0,0 +1,20 @@
+type SizeReducerState = {
+    height: number;
+    width: number;
+};
+export type SizeReducerAction = {
+    type: 'height' | 'width';
+    value: number;
+} | {
+    type: 'reset';
+    value: {
+        height: number;
+        width: number;
+    };
+};
+export declare const sizeReducer: (state: SizeReducerState, action: SizeReducerAction) => {
+    width: number;
+    height: number;
+};
+export {};
+//# sourceMappingURL=sizeReducer.d.ts.map

package/dist/admin/components/views/LivePreview/Context/sizeReducer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizeReducer.d.ts","sourceRoot":"","sources":["../../../../../../src/admin/components/views/LivePreview/Context/sizeReducer.ts"],"names":[],"mappings":"AAWA,KAAK,gBAAgB,GAAG;IACtB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,iBAAiB,GACzB;IACE,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAA;IACxB,KAAK,EAAE,MAAM,CAAA;CACd,GACD;IACE,IAAI,EAAE,OAAO,CAAA;IACb,KAAK,EAAE;QACL,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;CACF,CAAA;AAEL,eAAO,MAAM,WAAW,UAAW,gBAAgB,UAAU,iBAAiB;;YAjBpE,MAAM;CA0Bf,CAAA"}

package/dist/admin/components/views/LivePreview/Context/sizeReducer.js

@@ -0,0 +1,41 @@
+// export const sizeReducer: (state, action) => {
+//   switch (action.type) {
+//     case 'width':
+//       return { ...state, width: action.value }
+//     case 'height':
+//       return { ...state, height: action.value }
+//     default:
+//       return { ...state, ...(action?.value || {}) }
+//   }
+// },
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "sizeReducer", {
+    enumerable: true,
+    get: function() {
+        return sizeReducer;
+    }
+});
+const sizeReducer = (state, action)=>{
+    switch(action.type){
+        case 'width':
+            return {
+                ...state,
+                width: action.value
+            };
+        case 'height':
+            return {
+                ...state,
+                height: action.value
+            };
+        default:
+            return {
+                ...state,
+                ...action?.value || {}
+            };
+    }
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL3ZpZXdzL0xpdmVQcmV2aWV3L0NvbnRleHQvc2l6ZVJlZHVjZXIudHMiXSwic291cmNlc0NvbnRlbnQiOlsiLy8gZXhwb3J0IGNvbnN0IHNpemVSZWR1Y2VyOiAoc3RhdGUsIGFjdGlvbikgPT4ge1xuLy8gICBzd2l0Y2ggKGFjdGlvbi50eXBlKSB7XG4vLyAgICAgY2FzZSAnd2lkdGgnOlxuLy8gICAgICAgcmV0dXJuIHsgLi4uc3RhdGUsIHdpZHRoOiBhY3Rpb24udmFsdWUgfVxuLy8gICAgIGNhc2UgJ2hlaWdodCc6XG4vLyAgICAgICByZXR1cm4geyAuLi5zdGF0ZSwgaGVpZ2h0OiBhY3Rpb24udmFsdWUgfVxuLy8gICAgIGRlZmF1bHQ6XG4vLyAgICAgICByZXR1cm4geyAuLi5zdGF0ZSwgLi4uKGFjdGlvbj8udmFsdWUgfHwge30pIH1cbi8vICAgfVxuLy8gfSxcblxudHlwZSBTaXplUmVkdWNlclN0YXRlID0ge1xuICBoZWlnaHQ6IG51bWJlclxuICB3aWR0aDogbnVtYmVyXG59XG5cbmV4cG9ydCB0eXBlIFNpemVSZWR1Y2VyQWN0aW9uID1cbiAgfCB7XG4gICAgICB0eXBlOiAnaGVpZ2h0JyB8ICd3aWR0aCdcbiAgICAgIHZhbHVlOiBudW1iZXJcbiAgICB9XG4gIHwge1xuICAgICAgdHlwZTogJ3Jlc2V0J1xuICAgICAgdmFsdWU6IHtcbiAgICAgICAgaGVpZ2h0OiBudW1iZXJcbiAgICAgICAgd2lkdGg6IG51bWJlclxuICAgICAgfVxuICAgIH1cblxuZXhwb3J0IGNvbnN0IHNpemVSZWR1Y2VyID0gKHN0YXRlOiBTaXplUmVkdWNlclN0YXRlLCBhY3Rpb246IFNpemVSZWR1Y2VyQWN0aW9uKSA9PiB7XG4gIHN3aXRjaCAoYWN0aW9uLnR5cGUpIHtcbiAgICBjYXNlICd3aWR0aCc6XG4gICAgICByZXR1cm4geyAuLi5zdGF0ZSwgd2lkdGg6IGFjdGlvbi52YWx1ZSB9XG4gICAgY2FzZSAnaGVpZ2h0JzpcbiAgICAgIHJldHVybiB7IC4uLnN0YXRlLCBoZWlnaHQ6IGFjdGlvbi52YWx1ZSB9XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiB7IC4uLnN0YXRlLCAuLi4oYWN0aW9uPy52YWx1ZSB8fCB7fSkgfVxuICB9XG59XG4iXSwibmFtZXMiOlsic2l6ZVJlZHVjZXIiLCJzdGF0ZSIsImFjdGlvbiIsInR5cGUiLCJ3aWR0aCIsInZhbHVlIiwiaGVpZ2h0Il0sIm1hcHBpbmdzIjoiQUFBQSxpREFBaUQ7QUFDakQsMkJBQTJCO0FBQzNCLG9CQUFvQjtBQUNwQixpREFBaUQ7QUFDakQscUJBQXFCO0FBQ3JCLGtEQUFrRDtBQUNsRCxlQUFlO0FBQ2Ysc0RBQXNEO0FBQ3RELE1BQU07QUFDTixLQUFLOzs7OzsrQkFvQlFBOzs7ZUFBQUE7OztBQUFOLE1BQU1BLGNBQWMsQ0FBQ0MsT0FBeUJDO0lBQ25ELE9BQVFBLE9BQU9DLElBQUk7UUFDakIsS0FBSztZQUNILE9BQU87Z0JBQUUsR0FBR0YsS0FBSztnQkFBRUcsT0FBT0YsT0FBT0csS0FBSztZQUFDO1FBQ3pDLEtBQUs7WUFDSCxPQUFPO2dCQUFFLEdBQUdKLEtBQUs7Z0JBQUVLLFFBQVFKLE9BQU9HLEtBQUs7WUFBQztRQUMxQztZQUNFLE9BQU87Z0JBQUUsR0FBR0osS0FBSztnQkFBRSxHQUFJQyxRQUFRRyxTQUFTLENBQUMsQ0FBQztZQUFFO0lBQ2hEO0FBQ0YifQ==

package/dist/admin/components/views/LivePreview/Device/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const DeviceContainer: React.FC<{
+    children: React.ReactNode;
+}>;
+//# sourceMappingURL=index.d.ts.map

package/dist/admin/components/views/LivePreview/Device/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/admin/components/views/LivePreview/Device/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CA4CA,CAAA"}

package/dist/admin/components/views/LivePreview/Device/index.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "DeviceContainer", {
+    enumerable: true,
+    get: function() {
+        return DeviceContainer;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _context = require("../Context/context");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const DeviceContainer = (props)=>{
+    const { children } = props;
+    const { breakpoint, deviceFrameRef, size, zoom } = (0, _context.useLivePreviewContext)();
+    let x = '0';
+    let margin = '0';
+    if (breakpoint && breakpoint !== 'responsive') {
+        x = '-50%';
+        if (typeof zoom === 'number' && typeof size.width === 'number' && typeof size.height === 'number') {
+            const scaledWidth = size.width / zoom;
+            const difference = scaledWidth - size.width;
+            x = `${difference / 2}px`;
+            margin = 'auto';
+        }
+    }
+    let width = zoom ? `${100 / zoom}%` : '100%';
+    let height = zoom ? `${100 / zoom}%` : '100%';
+    if (breakpoint !== 'responsive') {
+        width = `${size?.width / (typeof zoom === 'number' ? zoom : 1)}px`;
+        height = `${size?.height / (typeof zoom === 'number' ? zoom : 1)}px`;
+    }
+    return /*#__PURE__*/ _react.default.createElement("div", {
+        ref: deviceFrameRef,
+        style: {
+            height,
+            margin,
+            transform: `translate3d(${x}, 0, 0)`,
+            width
+        }
+    }, children);
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL3ZpZXdzL0xpdmVQcmV2aWV3L0RldmljZS9pbmRleC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuXG5pbXBvcnQgeyB1c2VMaXZlUHJldmlld0NvbnRleHQgfSBmcm9tICcuLi9Db250ZXh0L2NvbnRleHQnXG5cbmV4cG9ydCBjb25zdCBEZXZpY2VDb250YWluZXI6IFJlYWN0LkZDPHtcbiAgY2hpbGRyZW46IFJlYWN0LlJlYWN0Tm9kZVxufT4gPSAocHJvcHMpID0+IHtcbiAgY29uc3QgeyBjaGlsZHJlbiB9ID0gcHJvcHNcblxuICBjb25zdCB7IGJyZWFrcG9pbnQsIGRldmljZUZyYW1lUmVmLCBzaXplLCB6b29tIH0gPSB1c2VMaXZlUHJldmlld0NvbnRleHQoKVxuXG4gIGxldCB4ID0gJzAnXG4gIGxldCBtYXJnaW4gPSAnMCdcblxuICBpZiAoYnJlYWtwb2ludCAmJiBicmVha3BvaW50ICE9PSAncmVzcG9uc2l2ZScpIHtcbiAgICB4ID0gJy01MCUnXG5cbiAgICBpZiAoXG4gICAgICB0eXBlb2Ygem9vbSA9PT0gJ251bWJlcicgJiZcbiAgICAgIHR5cGVvZiBzaXplLndpZHRoID09PSAnbnVtYmVyJyAmJlxuICAgICAgdHlwZW9mIHNpemUuaGVpZ2h0ID09PSAnbnVtYmVyJ1xuICAgICkge1xuICAgICAgY29uc3Qgc2NhbGVkV2lkdGggPSBzaXplLndpZHRoIC8gem9vbVxuICAgICAgY29uc3QgZGlmZmVyZW5jZSA9IHNjYWxlZFdpZHRoIC0gc2l6ZS53aWR0aFxuICAgICAgeCA9IGAke2RpZmZlcmVuY2UgLyAyfXB4YFxuICAgICAgbWFyZ2luID0gJ2F1dG8nXG4gICAgfVxuICB9XG5cbiAgbGV0IHdpZHRoID0gem9vbSA/IGAkezEwMCAvIHpvb219JWAgOiAnMTAwJSdcbiAgbGV0IGhlaWdodCA9IHpvb20gPyBgJHsxMDAgLyB6b29tfSVgIDogJzEwMCUnXG5cbiAgaWYgKGJyZWFrcG9pbnQgIT09ICdyZXNwb25zaXZlJykge1xuICAgIHdpZHRoID0gYCR7c2l6ZT8ud2lkdGggLyAodHlwZW9mIHpvb20gPT09ICdudW1iZXInID8gem9vbSA6IDEpfXB4YFxuICAgIGhlaWdodCA9IGAke3NpemU/LmhlaWdodCAvICh0eXBlb2Ygem9vbSA9PT0gJ251bWJlcicgPyB6b29tIDogMSl9cHhgXG4gIH1cblxuICByZXR1cm4gKFxuICAgIDxkaXZcbiAgICAgIHJlZj17ZGV2aWNlRnJhbWVSZWZ9XG4gICAgICBzdHlsZT17e1xuICAgICAgICBoZWlnaHQsXG4gICAgICAgIG1hcmdpbixcbiAgICAgICAgdHJhbnNmb3JtOiBgdHJhbnNsYXRlM2QoJHt4fSwgMCwgMClgLFxuICAgICAgICB3aWR0aCxcbiAgICAgIH19XG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvZGl2PlxuICApXG59XG4iXSwibmFtZXMiOlsiRGV2aWNlQ29udGFpbmVyIiwicHJvcHMiLCJjaGlsZHJlbiIsImJyZWFrcG9pbnQiLCJkZXZpY2VGcmFtZVJlZiIsInNpemUiLCJ6b29tIiwidXNlTGl2ZVByZXZpZXdDb250ZXh0IiwieCIsIm1hcmdpbiIsIndpZHRoIiwiaGVpZ2h0Iiwic2NhbGVkV2lkdGgiLCJkaWZmZXJlbmNlIiwiZGl2IiwicmVmIiwic3R5bGUiLCJ0cmFuc2Zvcm0iXSwibWFwcGluZ3MiOiI7Ozs7K0JBSWFBOzs7ZUFBQUE7Ozs4REFKSzt5QkFFb0I7Ozs7OztBQUUvQixNQUFNQSxrQkFFUixDQUFDQztJQUNKLE1BQU0sRUFBRUMsUUFBUSxFQUFFLEdBQUdEO0lBRXJCLE1BQU0sRUFBRUUsVUFBVSxFQUFFQyxjQUFjLEVBQUVDLElBQUksRUFBRUMsSUFBSSxFQUFFLEdBQUdDLElBQUFBLDhCQUFxQjtJQUV4RSxJQUFJQyxJQUFJO0lBQ1IsSUFBSUMsU0FBUztJQUViLElBQUlOLGNBQWNBLGVBQWUsY0FBYztRQUM3Q0ssSUFBSTtRQUVKLElBQ0UsT0FBT0YsU0FBUyxZQUNoQixPQUFPRCxLQUFLSyxLQUFLLEtBQUssWUFDdEIsT0FBT0wsS0FBS00sTUFBTSxLQUFLLFVBQ3ZCO1lBQ0EsTUFBTUMsY0FBY1AsS0FBS0ssS0FBSyxHQUFHSjtZQUNqQyxNQUFNTyxhQUFhRCxjQUFjUCxLQUFLSyxLQUFLO1lBQzNDRixJQUFJLENBQUMsRUFBRUssYUFBYSxFQUFFLEVBQUUsQ0FBQztZQUN6QkosU0FBUztRQUNYO0lBQ0Y7SUFFQSxJQUFJQyxRQUFRSixPQUFPLENBQUMsRUFBRSxNQUFNQSxLQUFLLENBQUMsQ0FBQyxHQUFHO0lBQ3RDLElBQUlLLFNBQVNMLE9BQU8sQ0FBQyxFQUFFLE1BQU1BLEtBQUssQ0FBQyxDQUFDLEdBQUc7SUFFdkMsSUFBSUgsZUFBZSxjQUFjO1FBQy9CTyxRQUFRLENBQUMsRUFBRUwsTUFBTUssUUFBUyxDQUFBLE9BQU9KLFNBQVMsV0FBV0EsT0FBTyxDQUFBLEVBQUcsRUFBRSxDQUFDO1FBQ2xFSyxTQUFTLENBQUMsRUFBRU4sTUFBTU0sU0FBVSxDQUFBLE9BQU9MLFNBQVMsV0FBV0EsT0FBTyxDQUFBLEVBQUcsRUFBRSxDQUFDO0lBQ3RFO0lBRUEscUJBQ0UsNkJBQUNRO1FBQ0NDLEtBQUtYO1FBQ0xZLE9BQU87WUFDTEw7WUFDQUY7WUFDQVEsV0FBVyxDQUFDLFlBQVksRUFBRVQsRUFBRSxPQUFPLENBQUM7WUFDcENFO1FBQ0Y7T0FFQ1I7QUFHUCJ9

package/dist/admin/components/views/LivePreview/DeviceContainer/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const DeviceContainer: React.FC<{
+    children: React.ReactNode;
+}>;
+//# sourceMappingURL=index.d.ts.map

package/dist/admin/components/views/LivePreview/DeviceContainer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/admin/components/views/LivePreview/DeviceContainer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAgDA,CAAA"}

package/dist/admin/components/views/LivePreview/DeviceContainer/index.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "DeviceContainer", {
+    enumerable: true,
+    get: function() {
+        return DeviceContainer;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _context = require("../Context/context");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const DeviceContainer = (props)=>{
+    const { children } = props;
+    const { breakpoint, breakpoints, deviceFrameRef, size, zoom } = (0, _context.useLivePreviewContext)();
+    const foundBreakpoint = breakpoint && breakpoints.find((bp)=>bp.name === breakpoint);
+    let x = '0';
+    let margin = '0';
+    if (foundBreakpoint && breakpoint !== 'responsive') {
+        x = '-50%';
+        if (typeof zoom === 'number' && typeof size.width === 'number' && typeof size.height === 'number') {
+            const scaledWidth = size.width / zoom;
+            const difference = scaledWidth - size.width;
+            x = `${difference / 2}px`;
+            margin = 'auto';
+        }
+    }
+    return /*#__PURE__*/ _react.default.createElement("div", {
+        ref: deviceFrameRef,
+        style: {
+            height: foundBreakpoint && foundBreakpoint?.name !== 'responsive' ? `${size?.height / (typeof zoom === 'number' ? zoom : 1)}px` : typeof zoom === 'number' ? `${100 / zoom}%` : '100%',
+            margin,
+            transform: `translate3d(${x}, 0, 0)`,
+            width: foundBreakpoint && foundBreakpoint?.name !== 'responsive' ? `${size?.width / (typeof zoom === 'number' ? zoom : 1)}px` : typeof zoom === 'number' ? `${100 / zoom}%` : '100%'
+        }
+    }, children);
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL3ZpZXdzL0xpdmVQcmV2aWV3L0RldmljZUNvbnRhaW5lci9pbmRleC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuXG5pbXBvcnQgeyB1c2VMaXZlUHJldmlld0NvbnRleHQgfSBmcm9tICcuLi9Db250ZXh0L2NvbnRleHQnXG5cbmV4cG9ydCBjb25zdCBEZXZpY2VDb250YWluZXI6IFJlYWN0LkZDPHtcbiAgY2hpbGRyZW46IFJlYWN0LlJlYWN0Tm9kZVxufT4gPSAocHJvcHMpID0+IHtcbiAgY29uc3QgeyBjaGlsZHJlbiB9ID0gcHJvcHNcblxuICBjb25zdCB7IGJyZWFrcG9pbnQsIGJyZWFrcG9pbnRzLCBkZXZpY2VGcmFtZVJlZiwgc2l6ZSwgem9vbSB9ID0gdXNlTGl2ZVByZXZpZXdDb250ZXh0KClcblxuICBjb25zdCBmb3VuZEJyZWFrcG9pbnQgPSBicmVha3BvaW50ICYmIGJyZWFrcG9pbnRzLmZpbmQoKGJwKSA9PiBicC5uYW1lID09PSBicmVha3BvaW50KVxuXG4gIGxldCB4ID0gJzAnXG4gIGxldCBtYXJnaW4gPSAnMCdcblxuICBpZiAoZm91bmRCcmVha3BvaW50ICYmIGJyZWFrcG9pbnQgIT09ICdyZXNwb25zaXZlJykge1xuICAgIHggPSAnLTUwJSdcblxuICAgIGlmIChcbiAgICAgIHR5cGVvZiB6b29tID09PSAnbnVtYmVyJyAmJlxuICAgICAgdHlwZW9mIHNpemUud2lkdGggPT09ICdudW1iZXInICYmXG4gICAgICB0eXBlb2Ygc2l6ZS5oZWlnaHQgPT09ICdudW1iZXInXG4gICAgKSB7XG4gICAgICBjb25zdCBzY2FsZWRXaWR0aCA9IHNpemUud2lkdGggLyB6b29tXG4gICAgICBjb25zdCBkaWZmZXJlbmNlID0gc2NhbGVkV2lkdGggLSBzaXplLndpZHRoXG4gICAgICB4ID0gYCR7ZGlmZmVyZW5jZSAvIDJ9cHhgXG4gICAgICBtYXJnaW4gPSAnYXV0bydcbiAgICB9XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDxkaXZcbiAgICAgIHJlZj17ZGV2aWNlRnJhbWVSZWZ9XG4gICAgICBzdHlsZT17e1xuICAgICAgICBoZWlnaHQ6XG4gICAgICAgICAgZm91bmRCcmVha3BvaW50ICYmIGZvdW5kQnJlYWtwb2ludD8ubmFtZSAhPT0gJ3Jlc3BvbnNpdmUnXG4gICAgICAgICAgICA/IGAke3NpemU/LmhlaWdodCAvICh0eXBlb2Ygem9vbSA9PT0gJ251bWJlcicgPyB6b29tIDogMSl9cHhgXG4gICAgICAgICAgICA6IHR5cGVvZiB6b29tID09PSAnbnVtYmVyJ1xuICAgICAgICAgICAgPyBgJHsxMDAgLyB6b29tfSVgXG4gICAgICAgICAgICA6ICcxMDAlJyxcbiAgICAgICAgbWFyZ2luLFxuICAgICAgICB0cmFuc2Zvcm06IGB0cmFuc2xhdGUzZCgke3h9LCAwLCAwKWAsXG4gICAgICAgIHdpZHRoOlxuICAgICAgICAgIGZvdW5kQnJlYWtwb2ludCAmJiBmb3VuZEJyZWFrcG9pbnQ/Lm5hbWUgIT09ICdyZXNwb25zaXZlJ1xuICAgICAgICAgICAgPyBgJHtzaXplPy53aWR0aCAvICh0eXBlb2Ygem9vbSA9PT0gJ251bWJlcicgPyB6b29tIDogMSl9cHhgXG4gICAgICAgICAgICA6IHR5cGVvZiB6b29tID09PSAnbnVtYmVyJ1xuICAgICAgICAgICAgPyBgJHsxMDAgLyB6b29tfSVgXG4gICAgICAgICAgICA6ICcxMDAlJyxcbiAgICAgIH19XG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvZGl2PlxuICApXG59XG4iXSwibmFtZXMiOlsiRGV2aWNlQ29udGFpbmVyIiwicHJvcHMiLCJjaGlsZHJlbiIsImJyZWFrcG9pbnQiLCJicmVha3BvaW50cyIsImRldmljZUZyYW1lUmVmIiwic2l6ZSIsInpvb20iLCJ1c2VMaXZlUHJldmlld0NvbnRleHQiLCJmb3VuZEJyZWFrcG9pbnQiLCJmaW5kIiwiYnAiLCJuYW1lIiwieCIsIm1hcmdpbiIsIndpZHRoIiwiaGVpZ2h0Iiwic2NhbGVkV2lkdGgiLCJkaWZmZXJlbmNlIiwiZGl2IiwicmVmIiwic3R5bGUiLCJ0cmFuc2Zvcm0iXSwibWFwcGluZ3MiOiI7Ozs7K0JBSWFBOzs7ZUFBQUE7Ozs4REFKSzt5QkFFb0I7Ozs7OztBQUUvQixNQUFNQSxrQkFFUixDQUFDQztJQUNKLE1BQU0sRUFBRUMsUUFBUSxFQUFFLEdBQUdEO0lBRXJCLE1BQU0sRUFBRUUsVUFBVSxFQUFFQyxXQUFXLEVBQUVDLGNBQWMsRUFBRUMsSUFBSSxFQUFFQyxJQUFJLEVBQUUsR0FBR0MsSUFBQUEsOEJBQXFCO0lBRXJGLE1BQU1DLGtCQUFrQk4sY0FBY0MsWUFBWU0sSUFBSSxDQUFDLENBQUNDLEtBQU9BLEdBQUdDLElBQUksS0FBS1Q7SUFFM0UsSUFBSVUsSUFBSTtJQUNSLElBQUlDLFNBQVM7SUFFYixJQUFJTCxtQkFBbUJOLGVBQWUsY0FBYztRQUNsRFUsSUFBSTtRQUVKLElBQ0UsT0FBT04sU0FBUyxZQUNoQixPQUFPRCxLQUFLUyxLQUFLLEtBQUssWUFDdEIsT0FBT1QsS0FBS1UsTUFBTSxLQUFLLFVBQ3ZCO1lBQ0EsTUFBTUMsY0FBY1gsS0FBS1MsS0FBSyxHQUFHUjtZQUNqQyxNQUFNVyxhQUFhRCxjQUFjWCxLQUFLUyxLQUFLO1lBQzNDRixJQUFJLENBQUMsRUFBRUssYUFBYSxFQUFFLEVBQUUsQ0FBQztZQUN6QkosU0FBUztRQUNYO0lBQ0Y7SUFFQSxxQkFDRSw2QkFBQ0s7UUFDQ0MsS0FBS2Y7UUFDTGdCLE9BQU87WUFDTEwsUUFDRVAsbUJBQW1CQSxpQkFBaUJHLFNBQVMsZUFDekMsQ0FBQyxFQUFFTixNQUFNVSxTQUFVLENBQUEsT0FBT1QsU0FBUyxXQUFXQSxPQUFPLENBQUEsRUFBRyxFQUFFLENBQUMsR0FDM0QsT0FBT0EsU0FBUyxXQUNoQixDQUFDLEVBQUUsTUFBTUEsS0FBSyxDQUFDLENBQUMsR0FDaEI7WUFDTk87WUFDQVEsV0FBVyxDQUFDLFlBQVksRUFBRVQsRUFBRSxPQUFPLENBQUM7WUFDcENFLE9BQ0VOLG1CQUFtQkEsaUJBQWlCRyxTQUFTLGVBQ3pDLENBQUMsRUFBRU4sTUFBTVMsUUFBUyxDQUFBLE9BQU9SLFNBQVMsV0FBV0EsT0FBTyxDQUFBLEVBQUcsRUFBRSxDQUFDLEdBQzFELE9BQU9BLFNBQVMsV0FDaEIsQ0FBQyxFQUFFLE1BQU1BLEtBQUssQ0FBQyxDQUFDLEdBQ2hCO1FBQ1I7T0FFQ0w7QUFHUCJ9

package/dist/admin/components/views/LivePreview/IFrame/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import './index.scss';
+export declare const IFrame: React.FC<{
+    ref: React.Ref<HTMLIFrameElement>;
+    setIframeHasLoaded: (value: boolean) => void;
+    url: string;
+}>;
+//# sourceMappingURL=index.d.ts.map

package/dist/admin/components/views/LivePreview/IFrame/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/admin/components/views/LivePreview/IFrame/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAGzC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC;IAC5B,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAA;IACjC,kBAAkB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;IAC5C,GAAG,EAAE,MAAM,CAAA;CACZ,CAmBC,CAAA"}

package/dist/admin/components/views/LivePreview/IFrame/index.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "IFrame", {
+    enumerable: true,
+    get: function() {
+        return IFrame;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _context = require("../Context/context");
+require("./index.scss");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const baseClass = 'live-preview-iframe';
+const IFrame = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
+    const { setIframeHasLoaded, url } = props;
+    const { zoom } = (0, _context.useLivePreviewContext)();
+    return /*#__PURE__*/ _react.default.createElement("iframe", {
+        className: baseClass,
+        onLoad: ()=>{
+            setIframeHasLoaded(true);
+        },
+        ref: ref,
+        src: url,
+        style: {
+            transform: typeof zoom === 'number' ? `scale(${zoom}) ` : undefined
+        },
+        title: url
+    });
+});
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL3ZpZXdzL0xpdmVQcmV2aWV3L0lGcmFtZS9pbmRleC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IGZvcndhcmRSZWYgfSBmcm9tICdyZWFjdCdcblxuaW1wb3J0IHsgdXNlTGl2ZVByZXZpZXdDb250ZXh0IH0gZnJvbSAnLi4vQ29udGV4dC9jb250ZXh0J1xuaW1wb3J0ICcuL2luZGV4LnNjc3MnXG5cbmNvbnN0IGJhc2VDbGFzcyA9ICdsaXZlLXByZXZpZXctaWZyYW1lJ1xuXG5leHBvcnQgY29uc3QgSUZyYW1lOiBSZWFjdC5GQzx7XG4gIHJlZjogUmVhY3QuUmVmPEhUTUxJRnJhbWVFbGVtZW50PlxuICBzZXRJZnJhbWVIYXNMb2FkZWQ6ICh2YWx1ZTogYm9vbGVhbikgPT4gdm9pZFxuICB1cmw6IHN0cmluZ1xufT4gPSBmb3J3YXJkUmVmKChwcm9wcywgcmVmKSA9PiB7XG4gIGNvbnN0IHsgc2V0SWZyYW1lSGFzTG9hZGVkLCB1cmwgfSA9IHByb3BzXG5cbiAgY29uc3QgeyB6b29tIH0gPSB1c2VMaXZlUHJldmlld0NvbnRleHQoKVxuXG4gIHJldHVybiAoXG4gICAgPGlmcmFtZVxuICAgICAgY2xhc3NOYW1lPXtiYXNlQ2xhc3N9XG4gICAgICBvbkxvYWQ9eygpID0+IHtcbiAgICAgICAgc2V0SWZyYW1lSGFzTG9hZGVkKHRydWUpXG4gICAgICB9fVxuICAgICAgcmVmPXtyZWZ9XG4gICAgICBzcmM9e3VybH1cbiAgICAgIHN0eWxlPXt7XG4gICAgICAgIHRyYW5zZm9ybTogdHlwZW9mIHpvb20gPT09ICdudW1iZXInID8gYHNjYWxlKCR7em9vbX0pIGAgOiB1bmRlZmluZWQsXG4gICAgICB9fVxuICAgICAgdGl0bGU9e3VybH1cbiAgICAvPlxuICApXG59KVxuIl0sIm5hbWVzIjpbIklGcmFtZSIsImJhc2VDbGFzcyIsImZvcndhcmRSZWYiLCJwcm9wcyIsInJlZiIsInNldElmcmFtZUhhc0xvYWRlZCIsInVybCIsInpvb20iLCJ1c2VMaXZlUHJldmlld0NvbnRleHQiLCJpZnJhbWUiLCJjbGFzc05hbWUiLCJvbkxvYWQiLCJzcmMiLCJzdHlsZSIsInRyYW5zZm9ybSIsInVuZGVmaW5lZCIsInRpdGxlIl0sIm1hcHBpbmdzIjoiOzs7OytCQU9hQTs7O2VBQUFBOzs7K0RBUHFCO3lCQUVJO1FBQy9COzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBRVAsTUFBTUMsWUFBWTtBQUVYLE1BQU1ELHVCQUlSRSxJQUFBQSxpQkFBVSxFQUFDLENBQUNDLE9BQU9DO0lBQ3RCLE1BQU0sRUFBRUMsa0JBQWtCLEVBQUVDLEdBQUcsRUFBRSxHQUFHSDtJQUVwQyxNQUFNLEVBQUVJLElBQUksRUFBRSxHQUFHQyxJQUFBQSw4QkFBcUI7SUFFdEMscUJBQ0UsNkJBQUNDO1FBQ0NDLFdBQVdUO1FBQ1hVLFFBQVE7WUFDTk4sbUJBQW1CO1FBQ3JCO1FBQ0FELEtBQUtBO1FBQ0xRLEtBQUtOO1FBQ0xPLE9BQU87WUFDTEMsV0FBVyxPQUFPUCxTQUFTLFdBQVcsQ0FBQyxNQUFNLEVBQUVBLEtBQUssRUFBRSxDQUFDLEdBQUdRO1FBQzVEO1FBQ0FDLE9BQU9WOztBQUdiIn0=

package/dist/admin/components/views/LivePreview/IFrame/index.scss

@@ -0,0 +1,8 @@
+@import '../../../../scss/styles.scss';
+
+.live-preview-iframe {
+  border: 0;
+  width: 100%;
+  height: 100%;
+  transform-origin: top left;
+}

package/dist/admin/components/views/LivePreview/Preview/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { EditViewProps } from '../../types';
+import type { usePopupWindow } from '../usePopupWindow';
+import './index.scss';
+export declare const LivePreview: React.FC<EditViewProps & {
+    popupState: ReturnType<typeof usePopupWindow>;
+    url?: string;
+}>;
+//# sourceMappingURL=index.d.ts.map

package/dist/admin/components/views/LivePreview/Preview/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/admin/components/views/LivePreview/Preview/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAIlD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAWvD,OAAO,cAAc,CAAA;AAmGrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAChC,aAAa,GAAG;IACd,UAAU,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;IAC7C,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CA4BF,CAAA"}