payload 2.0.0-beta.4 → 2.0.0-beta.6

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+XG4gIClcbn1cbiJdLCJuYW1lcyI6WyJMaXZlUHJldmlld1Byb3ZpZGVyIiwicHJvcHMiLCJicmVha3BvaW50cyIsImNoaWxkcmVuIiwiaWZyYW1lUmVmIiwiUmVhY3QiLCJ1c2VSZWYiLCJkZXZpY2VGcmFtZVJlZiIsImlmcmFtZUhhc0xvYWRlZCIsInNldElmcmFtZUhhc0xvYWRlZCIsInVzZVN0YXRlIiwiem9vbSIsInNldFpvb20iLCJwb3NpdGlvbiIsInNldFBvc2l0aW9uIiwieCIsInkiLCJzaXplIiwic2V0U2l6ZSIsInVzZVJlZHVjZXIiLCJzaXplUmVkdWNlciIsImhlaWdodCIsIndpZHRoIiwiYnJlYWtwb2ludCIsInNldEJyZWFrcG9pbnQiLCJoYW5kbGVEcmFnRW5kIiwiZXYiLCJvdmVyIiwiaWQiLCJuZXdQb3MiLCJkZWx0YSIsInNldFdpZHRoIiwidXNlQ2FsbGJhY2siLCJ0eXBlIiwidmFsdWUiLCJzZXRIZWlnaHQiLCJ1c2VFZmZlY3QiLCJmb3VuZEJyZWFrcG9pbnQiLCJmaW5kIiwiYnAiLCJuYW1lIiwibWVhc3VyZWREZXZpY2VTaXplIiwidXNlUmVzaXplIiwiTGl2ZVByZXZpZXdDb250ZXh0IiwiUHJvdmlkZXIiLCJzZXRUb29sYmFyUG9zaXRpb24iLCJ0b29sYmFyUG9zaXRpb24iLCJEbmRDb250ZXh0IiwiY29sbGlzaW9uRGV0ZWN0aW9uIiwiY3VzdG9tQ29sbGlzaW9uRGV0ZWN0aW9uIiwib25EcmFnRW5kIl0sIm1hcHBpbmdzIjoiOzs7OytCQXVCYUE7OztlQUFBQTs7O3NCQXZCYzsrREFDbUI7MkJBTXBCO29DQUNlO3lCQUNOOzZCQUNQOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBYXJCLE1BQU1BLHNCQUFzRCxDQUFDQztJQUNsRSxNQUFNLEVBQUVDLFdBQVcsRUFBRUMsUUFBUSxFQUFFLEdBQUdGO0lBRWxDLE1BQU1HLFlBQVlDLGNBQUssQ0FBQ0MsTUFBTSxDQUFvQjtJQUVsRCxNQUFNQyxpQkFBaUJGLGNBQUssQ0FBQ0MsTUFBTSxDQUFpQjtJQUVwRCxNQUFNLENBQUNFLGlCQUFpQkMsbUJBQW1CLEdBQUdKLGNBQUssQ0FBQ0ssUUFBUSxDQUFDO0lBRTdELE1BQU0sQ0FBQ0MsTUFBTUMsUUFBUSxHQUFHUCxjQUFLLENBQUNLLFFBQVEsQ0FBQztJQUV2QyxNQUFNLENBQUNHLFVBQVVDLFlBQVksR0FBR1QsY0FBSyxDQUFDSyxRQUFRLENBQUM7UUFBRUssR0FBRztRQUFHQyxHQUFHO0lBQUU7SUFFNUQsTUFBTSxDQUFDQyxNQUFNQyxRQUFRLEdBQUdiLGNBQUssQ0FBQ2MsVUFBVSxDQUFDQyx3QkFBVyxFQUFFO1FBQUVDLFFBQVE7UUFBR0MsT0FBTztJQUFFO0lBRTVFLE1BQU0sQ0FBQ0MsWUFBWUMsY0FBYyxHQUMvQm5CLGNBQUssQ0FBQ0ssUUFBUSxDQUF3QztJQUV4RCw0REFBNEQ7SUFDNUQsTUFBTWUsZ0JBQWdCLENBQUNDO1FBQ3JCLDRFQUE0RTtRQUM1RSxtREFBbUQ7UUFDbkQsc0RBQXNEO1FBQ3RELElBQUlBLEdBQUdDLElBQUksSUFBSUQsR0FBR0MsSUFBSSxDQUFDQyxFQUFFLEtBQUsscUJBQXFCO1lBQ2pELE1BQU1DLFNBQVM7Z0JBQ2JkLEdBQUdGLFNBQVNFLENBQUMsR0FBR1csR0FBR0ksS0FBSyxDQUFDZixDQUFDO2dCQUMxQkMsR0FBR0gsU0FBU0csQ0FBQyxHQUFHVSxHQUFHSSxLQUFLLENBQUNkLENBQUM7WUFDNUI7WUFFQUYsWUFBWWU7UUFDZCxPQUFPO1FBQ0wsUUFBUTtRQUNWO0lBQ0Y7SUFFQSxNQUFNRSxXQUFXQyxJQUFBQSxrQkFBVyxFQUMxQixDQUFDVjtRQUNDSixRQUFRO1lBQUVlLE1BQU07WUFBU0MsT0FBT1o7UUFBTTtJQUN4QyxHQUNBO1FBQUNKO0tBQVE7SUFHWCxNQUFNaUIsWUFBWUgsSUFBQUEsa0JBQVcsRUFDM0IsQ0FBQ1g7UUFDQ0gsUUFBUTtZQUFFZSxNQUFNO1lBQVVDLE9BQU9iO1FBQU87SUFDMUMsR0FDQTtRQUFDSDtLQUFRO0lBR1gsMkVBQTJFO0lBQzNFLDBGQUEwRjtJQUMxRmtCLElBQUFBLGdCQUFTLEVBQUM7UUFDUixNQUFNQyxrQkFBa0JuQyxhQUFhb0MsS0FBSyxDQUFDQyxLQUFPQSxHQUFHQyxJQUFJLEtBQUtqQjtRQUU5RCxJQUNFYyxtQkFDQWQsZUFBZSxnQkFDZkEsZUFBZSxZQUNmLE9BQU9jLGlCQUFpQmYsVUFBVSxZQUNsQyxPQUFPZSxpQkFBaUJoQixXQUFXLFVBQ25DO1lBQ0FILFFBQVE7Z0JBQ05lLE1BQU07Z0JBQ05DLE9BQU87b0JBQ0xiLFFBQVFnQixnQkFBZ0JoQixNQUFNO29CQUM5QkMsT0FBT2UsZ0JBQWdCZixLQUFLO2dCQUM5QjtZQUNGO1FBQ0Y7SUFDRixHQUFHO1FBQUNDO1FBQVlyQjtLQUFZO0lBRTVCLGlGQUFpRjtJQUNqRiwyRUFBMkU7SUFDM0UsTUFBTSxFQUFFZSxNQUFNd0Isa0JBQWtCLEVBQUUsR0FBR0MsSUFBQUEsb0JBQVMsRUFBQ25DO0lBRS9DLHFCQUNFLDZCQUFDb0MsMkJBQWtCLENBQUNDLFFBQVE7UUFDMUJWLE9BQU87WUFDTFg7WUFDQXJCO1lBQ0FLO1lBQ0FDO1lBQ0FKO1lBQ0FxQztZQUNBakI7WUFDQVc7WUFDQTFCO1lBQ0FTO1lBQ0EyQixvQkFBb0IvQjtZQUNwQmlCO1lBQ0FuQjtZQUNBSztZQUNBNkIsaUJBQWlCakM7WUFDakJGO1FBQ0Y7cUJBRUEsNkJBQUNvQyxnQkFBVTtRQUFDQyxvQkFBb0JDLDRDQUF3QjtRQUFFQyxXQUFXekI7T0FDbEV0QjtBQUlUIn0=

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/{PreviewIFrame → IFrame}/index.js

@@ -9,7 +9,7 @@ Object.defineProperty(exports, "IFrame", {
     }
 });
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
-const _context = require("../PreviewContext/context");
+const _context = require("../Context/context");
 require("./index.scss");
 function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
@@ -68,4 +68,4 @@ const IFrame = /*#__PURE__*/ (0, _react.forwardRef)((props, ref)=>{
     });
 });
 
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL3ZpZXdzL0xpdmVQcmV2aWV3L1ByZXZpZXdJRnJhbWUvaW5kZXgudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBmb3J3YXJkUmVmIH0gZnJvbSAncmVhY3QnXG5cbmltcG9ydCB7IHVzZUxpdmVQcmV2aWV3Q29udGV4dCB9IGZyb20gJy4uL1ByZXZpZXdDb250ZXh0L2NvbnRleHQnXG5pbXBvcnQgJy4vaW5kZXguc2NzcydcblxuY29uc3QgYmFzZUNsYXNzID0gJ2xpdmUtcHJldmlldy1pZnJhbWUnXG5cbmV4cG9ydCBjb25zdCBJRnJhbWU6IFJlYWN0LkZDPHtcbiAgcmVmOiBSZWFjdC5SZWY8SFRNTElGcmFtZUVsZW1lbnQ+XG4gIHNldElmcmFtZUhhc0xvYWRlZDogKHZhbHVlOiBib29sZWFuKSA9PiB2b2lkXG4gIHVybDogc3RyaW5nXG59PiA9IGZvcndhcmRSZWYoKHByb3BzLCByZWYpID0+IHtcbiAgY29uc3QgeyBzZXRJZnJhbWVIYXNMb2FkZWQsIHVybCB9ID0gcHJvcHNcblxuICBjb25zdCB7IHpvb20gfSA9IHVzZUxpdmVQcmV2aWV3Q29udGV4dCgpXG5cbiAgcmV0dXJuIChcbiAgICA8aWZyYW1lXG4gICAgICBjbGFzc05hbWU9e2Jhc2VDbGFzc31cbiAgICAgIG9uTG9hZD17KCkgPT4ge1xuICAgICAgICBzZXRJZnJhbWVIYXNMb2FkZWQodHJ1ZSlcbiAgICAgIH19XG4gICAgICByZWY9e3JlZn1cbiAgICAgIHNyYz17dXJsfVxuICAgICAgc3R5bGU9e3tcbiAgICAgICAgdHJhbnNmb3JtOiB0eXBlb2Ygem9vbSA9PT0gJ251bWJlcicgPyBgc2NhbGUoJHt6b29tfSkgYCA6IHVuZGVmaW5lZCxcbiAgICAgIH19XG4gICAgICB0aXRsZT17dXJsfVxuICAgIC8+XG4gIClcbn0pXG4iXSwibmFtZXMiOlsiSUZyYW1lIiwiYmFzZUNsYXNzIiwiZm9yd2FyZFJlZiIsInByb3BzIiwicmVmIiwic2V0SWZyYW1lSGFzTG9hZGVkIiwidXJsIiwiem9vbSIsInVzZUxpdmVQcmV2aWV3Q29udGV4dCIsImlmcmFtZSIsImNsYXNzTmFtZSIsIm9uTG9hZCIsInNyYyIsInN0eWxlIiwidHJhbnNmb3JtIiwidW5kZWZpbmVkIiwidGl0bGUiXSwibWFwcGluZ3MiOiI7Ozs7K0JBT2FBOzs7ZUFBQUE7OzsrREFQcUI7eUJBRUk7UUFDL0I7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFFUCxNQUFNQyxZQUFZO0FBRVgsTUFBTUQsdUJBSVJFLElBQUFBLGlCQUFVLEVBQUMsQ0FBQ0MsT0FBT0M7SUFDdEIsTUFBTSxFQUFFQyxrQkFBa0IsRUFBRUMsR0FBRyxFQUFFLEdBQUdIO0lBRXBDLE1BQU0sRUFBRUksSUFBSSxFQUFFLEdBQUdDLElBQUFBLDhCQUFxQjtJQUV0QyxxQkFDRSw2QkFBQ0M7UUFDQ0MsV0FBV1Q7UUFDWFUsUUFBUTtZQUNOTixtQkFBbUI7UUFDckI7UUFDQUQsS0FBS0E7UUFDTFEsS0FBS047UUFDTE8sT0FBTztZQUNMQyxXQUFXLE9BQU9QLFNBQVMsV0FBVyxDQUFDLE1BQU0sRUFBRUEsS0FBSyxFQUFFLENBQUMsR0FBR1E7UUFDNUQ7UUFDQUMsT0FBT1Y7O0FBR2IifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL3ZpZXdzL0xpdmVQcmV2aWV3L0lGcmFtZS9pbmRleC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IGZvcndhcmRSZWYgfSBmcm9tICdyZWFjdCdcblxuaW1wb3J0IHsgdXNlTGl2ZVByZXZpZXdDb250ZXh0IH0gZnJvbSAnLi4vQ29udGV4dC9jb250ZXh0J1xuaW1wb3J0ICcuL2luZGV4LnNjc3MnXG5cbmNvbnN0IGJhc2VDbGFzcyA9ICdsaXZlLXByZXZpZXctaWZyYW1lJ1xuXG5leHBvcnQgY29uc3QgSUZyYW1lOiBSZWFjdC5GQzx7XG4gIHJlZjogUmVhY3QuUmVmPEhUTUxJRnJhbWVFbGVtZW50PlxuICBzZXRJZnJhbWVIYXNMb2FkZWQ6ICh2YWx1ZTogYm9vbGVhbikgPT4gdm9pZFxuICB1cmw6IHN0cmluZ1xufT4gPSBmb3J3YXJkUmVmKChwcm9wcywgcmVmKSA9PiB7XG4gIGNvbnN0IHsgc2V0SWZyYW1lSGFzTG9hZGVkLCB1cmwgfSA9IHByb3BzXG5cbiAgY29uc3QgeyB6b29tIH0gPSB1c2VMaXZlUHJldmlld0NvbnRleHQoKVxuXG4gIHJldHVybiAoXG4gICAgPGlmcmFtZVxuICAgICAgY2xhc3NOYW1lPXtiYXNlQ2xhc3N9XG4gICAgICBvbkxvYWQ9eygpID0+IHtcbiAgICAgICAgc2V0SWZyYW1lSGFzTG9hZGVkKHRydWUpXG4gICAgICB9fVxuICAgICAgcmVmPXtyZWZ9XG4gICAgICBzcmM9e3VybH1cbiAgICAgIHN0eWxlPXt7XG4gICAgICAgIHRyYW5zZm9ybTogdHlwZW9mIHpvb20gPT09ICdudW1iZXInID8gYHNjYWxlKCR7em9vbX0pIGAgOiB1bmRlZmluZWQsXG4gICAgICB9fVxuICAgICAgdGl0bGU9e3VybH1cbiAgICAvPlxuICApXG59KVxuIl0sIm5hbWVzIjpbIklGcmFtZSIsImJhc2VDbGFzcyIsImZvcndhcmRSZWYiLCJwcm9wcyIsInJlZiIsInNldElmcmFtZUhhc0xvYWRlZCIsInVybCIsInpvb20iLCJ1c2VMaXZlUHJldmlld0NvbnRleHQiLCJpZnJhbWUiLCJjbGFzc05hbWUiLCJvbkxvYWQiLCJzcmMiLCJzdHlsZSIsInRyYW5zZm9ybSIsInVuZGVmaW5lZCIsInRpdGxlIl0sIm1hcHBpbmdzIjoiOzs7OytCQU9hQTs7O2VBQUFBOzs7K0RBUHFCO3lCQUVJO1FBQy9COzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBRVAsTUFBTUMsWUFBWTtBQUVYLE1BQU1ELHVCQUlSRSxJQUFBQSxpQkFBVSxFQUFDLENBQUNDLE9BQU9DO0lBQ3RCLE1BQU0sRUFBRUMsa0JBQWtCLEVBQUVDLEdBQUcsRUFBRSxHQUFHSDtJQUVwQyxNQUFNLEVBQUVJLElBQUksRUFBRSxHQUFHQyxJQUFBQSw4QkFBcUI7SUFFdEMscUJBQ0UsNkJBQUNDO1FBQ0NDLFdBQVdUO1FBQ1hVLFFBQVE7WUFDTk4sbUJBQW1CO1FBQ3JCO1FBQ0FELEtBQUtBO1FBQ0xRLEtBQUtOO1FBQ0xPLE9BQU87WUFDTEMsV0FBVyxPQUFPUCxTQUFTLFdBQVcsQ0FBQyxNQUFNLEVBQUVBLEtBQUssRUFBRSxDQUFDLEdBQUdRO1FBQzVEO1FBQ0FDLE9BQU9WOztBQUdiIn0=

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,KAAoB,MAAM,OAAO,CAAA;AAGxC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAUvD,OAAO,cAAc,CAAA;AAgFrB,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"}

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

@@ -0,0 +1,150 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "LivePreview", {
+    enumerable: true,
+    get: function() {
+        return LivePreview;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _context = require("../../../forms/Form/context");
+const _reduceFieldsToValues = /*#__PURE__*/ _interop_require_default(require("../../../forms/Form/reduceFieldsToValues"));
+const _Context = require("../Context");
+const _context1 = require("../Context/context");
+const _Device = require("../Device");
+const _IFrame = require("../IFrame");
+const _Toolbar = require("../Toolbar");
+const _ToolbarArea = require("../ToolbarArea");
+require("./index.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+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-window';
+const Preview = (props)=>{
+    const { popupState: { isPopupOpen, popupHasLoaded, popupRef }, url } = props;
+    const { iframeHasLoaded, iframeRef, setIframeHasLoaded } = (0, _context1.useLivePreviewContext)();
+    const { breakpoint } = (0, _context1.useLivePreviewContext)();
+    const [fields] = (0, _context.useAllFormFields)();
+    // The preview could either be an iframe embedded on the page
+    // Or it could be a separate popup window
+    // We need to transmit data to both accordingly
+    (0, _react.useEffect)(()=>{
+        if (fields && window && 'postMessage' in window) {
+            const values = (0, _reduceFieldsToValues.default)(fields);
+            const message = JSON.stringify({
+                data: values,
+                type: 'livePreview'
+            });
+            // external window
+            if (isPopupOpen) {
+                setIframeHasLoaded(false);
+                if (popupHasLoaded && popupRef.current) {
+                    popupRef.current.postMessage(message, url);
+                }
+            }
+            // embedded iframe
+            if (!isPopupOpen) {
+                if (iframeHasLoaded && iframeRef.current) {
+                    iframeRef.current.contentWindow?.postMessage(message, url);
+                }
+            }
+        }
+    }, [
+        fields,
+        url,
+        iframeHasLoaded,
+        isPopupOpen,
+        popupRef,
+        popupHasLoaded,
+        iframeRef,
+        setIframeHasLoaded
+    ]);
+    if (!isPopupOpen) {
+        return /*#__PURE__*/ _react.default.createElement("div", {
+            className: [
+                baseClass,
+                isPopupOpen && `${baseClass}--popup-open`,
+                breakpoint && breakpoint !== 'responsive' && `${baseClass}--has-breakpoint`
+            ].filter(Boolean).join(' ')
+        }, /*#__PURE__*/ _react.default.createElement(_ToolbarArea.ToolbarArea, null, /*#__PURE__*/ _react.default.createElement("div", {
+            className: `${baseClass}__wrapper`
+        }, /*#__PURE__*/ _react.default.createElement(_Device.DeviceContainer, null, /*#__PURE__*/ _react.default.createElement(_IFrame.IFrame, {
+            ref: iframeRef,
+            setIframeHasLoaded: setIframeHasLoaded,
+            url: url
+        }))), /*#__PURE__*/ _react.default.createElement(_Toolbar.LivePreviewToolbar, {
+            ...props,
+            iframeRef: iframeRef,
+            url: url
+        })));
+    }
+};
+const LivePreview = (props)=>{
+    let url;
+    let breakpoints = [
+        {
+            name: 'responsive',
+            height: '100%',
+            label: 'Responsive',
+            width: '100%'
+        }
+    ];
+    if ('collection' in props) {
+        url = props?.collection.admin.livePreview.url;
+        breakpoints = breakpoints.concat(props?.collection.admin.livePreview.breakpoints);
+    }
+    if ('global' in props) {
+        url = props?.global.admin.livePreview.url;
+        breakpoints = breakpoints.concat(props?.global.admin.livePreview.breakpoints);
+    }
+    return /*#__PURE__*/ _react.default.createElement(_Context.LivePreviewProvider, {
+        ...props,
+        breakpoints: breakpoints,
+        url: url
+    }, /*#__PURE__*/ _react.default.createElement(Preview, props));
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL3ZpZXdzL0xpdmVQcmV2aWV3L1ByZXZpZXcvaW5kZXgudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QgfSBmcm9tICdyZWFjdCdcblxuaW1wb3J0IHR5cGUgeyBMaXZlUHJldmlldyBhcyBMaXZlUHJldmlld1R5cGUgfSBmcm9tICcuLi8uLi8uLi8uLi8uLi9leHBvcnRzL2NvbmZpZydcbmltcG9ydCB0eXBlIHsgRWRpdFZpZXdQcm9wcyB9IGZyb20gJy4uLy4uL3R5cGVzJ1xuaW1wb3J0IHR5cGUgeyB1c2VQb3B1cFdpbmRvdyB9IGZyb20gJy4uL3VzZVBvcHVwV2luZG93J1xuXG5pbXBvcnQgeyB1c2VBbGxGb3JtRmllbGRzIH0gZnJvbSAnLi4vLi4vLi4vZm9ybXMvRm9ybS9jb250ZXh0J1xuaW1wb3J0IHJlZHVjZUZpZWxkc1RvVmFsdWVzIGZyb20gJy4uLy4uLy4uL2Zvcm1zL0Zvcm0vcmVkdWNlRmllbGRzVG9WYWx1ZXMnXG5pbXBvcnQgeyBMaXZlUHJldmlld1Byb3ZpZGVyIH0gZnJvbSAnLi4vQ29udGV4dCdcbmltcG9ydCB7IHVzZUxpdmVQcmV2aWV3Q29udGV4dCB9IGZyb20gJy4uL0NvbnRleHQvY29udGV4dCdcbmltcG9ydCB7IERldmljZUNvbnRhaW5lciB9IGZyb20gJy4uL0RldmljZSdcbmltcG9ydCB7IElGcmFtZSB9IGZyb20gJy4uL0lGcmFtZSdcbmltcG9ydCB7IExpdmVQcmV2aWV3VG9vbGJhciB9IGZyb20gJy4uL1Rvb2xiYXInXG5pbXBvcnQgeyBUb29sYmFyQXJlYSB9IGZyb20gJy4uL1Rvb2xiYXJBcmVhJ1xuaW1wb3J0ICcuL2luZGV4LnNjc3MnXG5cbmNvbnN0IGJhc2VDbGFzcyA9ICdsaXZlLXByZXZpZXctd2luZG93J1xuXG5jb25zdCBQcmV2aWV3OiBSZWFjdC5GQzxcbiAgRWRpdFZpZXdQcm9wcyAmIHtcbiAgICBwb3B1cFN0YXRlOiBSZXR1cm5UeXBlPHR5cGVvZiB1c2VQb3B1cFdpbmRvdz5cbiAgICB1cmw/OiBzdHJpbmdcbiAgfVxuPiA9IChwcm9wcykgPT4ge1xuICBjb25zdCB7XG4gICAgcG9wdXBTdGF0ZTogeyBpc1BvcHVwT3BlbiwgcG9wdXBIYXNMb2FkZWQsIHBvcHVwUmVmIH0sXG4gICAgdXJsLFxuICB9ID0gcHJvcHNcblxuICBjb25zdCB7IGlmcmFtZUhhc0xvYWRlZCwgaWZyYW1lUmVmLCBzZXRJZnJhbWVIYXNMb2FkZWQgfSA9IHVzZUxpdmVQcmV2aWV3Q29udGV4dCgpXG5cbiAgY29uc3QgeyBicmVha3BvaW50IH0gPSB1c2VMaXZlUHJldmlld0NvbnRleHQoKVxuXG4gIGNvbnN0IFtmaWVsZHNdID0gdXNlQWxsRm9ybUZpZWxkcygpXG5cbiAgLy8gVGhlIHByZXZpZXcgY291bGQgZWl0aGVyIGJlIGFuIGlmcmFtZSBlbWJlZGRlZCBvbiB0aGUgcGFnZVxuICAvLyBPciBpdCBjb3VsZCBiZSBhIHNlcGFyYXRlIHBvcHVwIHdpbmRvd1xuICAvLyBXZSBuZWVkIHRvIHRyYW5zbWl0IGRhdGEgdG8gYm90aCBhY2NvcmRpbmdseVxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChmaWVsZHMgJiYgd2luZG93ICYmICdwb3N0TWVzc2FnZScgaW4gd2luZG93KSB7XG4gICAgICBjb25zdCB2YWx1ZXMgPSByZWR1Y2VGaWVsZHNUb1ZhbHVlcyhmaWVsZHMpXG4gICAgICBjb25zdCBtZXNzYWdlID0gSlNPTi5zdHJpbmdpZnkoeyBkYXRhOiB2YWx1ZXMsIHR5cGU6ICdsaXZlUHJldmlldycgfSlcblxuICAgICAgLy8gZXh0ZXJuYWwgd2luZG93XG4gICAgICBpZiAoaXNQb3B1cE9wZW4pIHtcbiAgICAgICAgc2V0SWZyYW1lSGFzTG9hZGVkKGZhbHNlKVxuXG4gICAgICAgIGlmIChwb3B1cEhhc0xvYWRlZCAmJiBwb3B1cFJlZi5jdXJyZW50KSB7XG4gICAgICAgICAgcG9wdXBSZWYuY3VycmVudC5wb3N0TWVzc2FnZShtZXNzYWdlLCB1cmwpXG4gICAgICAgIH1cbiAgICAgIH1cblxuICAgICAgLy8gZW1iZWRkZWQgaWZyYW1lXG4gICAgICBpZiAoIWlzUG9wdXBPcGVuKSB7XG4gICAgICAgIGlmIChpZnJhbWVIYXNMb2FkZWQgJiYgaWZyYW1lUmVmLmN1cnJlbnQpIHtcbiAgICAgICAgICBpZnJhbWVSZWYuY3VycmVudC5jb250ZW50V2luZG93Py5wb3N0TWVzc2FnZShtZXNzYWdlLCB1cmwpXG4gICAgICAgIH1cbiAgICAgIH1cbiAgICB9XG4gIH0sIFtcbiAgICBmaWVsZHMsXG4gICAgdXJsLFxuICAgIGlmcmFtZUhhc0xvYWRlZCxcbiAgICBpc1BvcHVwT3BlbixcbiAgICBwb3B1cFJlZixcbiAgICBwb3B1cEhhc0xvYWRlZCxcbiAgICBpZnJhbWVSZWYsXG4gICAgc2V0SWZyYW1lSGFzTG9hZGVkLFxuICBdKVxuXG4gIGlmICghaXNQb3B1cE9wZW4pIHtcbiAgICByZXR1cm4gKFxuICAgICAgPGRpdlxuICAgICAgICBjbGFzc05hbWU9e1tcbiAgICAgICAgICBiYXNlQ2xhc3MsXG4gICAgICAgICAgaXNQb3B1cE9wZW4gJiYgYCR7YmFzZUNsYXNzfS0tcG9wdXAtb3BlbmAsXG4gICAgICAgICAgYnJlYWtwb2ludCAmJiBicmVha3BvaW50ICE9PSAncmVzcG9uc2l2ZScgJiYgYCR7YmFzZUNsYXNzfS0taGFzLWJyZWFrcG9pbnRgLFxuICAgICAgICBdXG4gICAgICAgICAgLmZpbHRlcihCb29sZWFuKVxuICAgICAgICAgIC5qb2luKCcgJyl9XG4gICAgICA+XG4gICAgICAgIDxUb29sYmFyQXJlYT5cbiAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17YCR7YmFzZUNsYXNzfV9fd3JhcHBlcmB9PlxuICAgICAgICAgICAgPERldmljZUNvbnRhaW5lcj5cbiAgICAgICAgICAgICAgPElGcmFtZSByZWY9e2lmcmFtZVJlZn0gc2V0SWZyYW1lSGFzTG9hZGVkPXtzZXRJZnJhbWVIYXNMb2FkZWR9IHVybD17dXJsfSAvPlxuICAgICAgICAgICAgPC9EZXZpY2VDb250YWluZXI+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPExpdmVQcmV2aWV3VG9vbGJhciB7Li4ucHJvcHN9IGlmcmFtZVJlZj17aWZyYW1lUmVmfSB1cmw9e3VybH0gLz5cbiAgICAgICAgPC9Ub29sYmFyQXJlYT5cbiAgICAgIDwvZGl2PlxuICAgIClcbiAgfVxufVxuXG5leHBvcnQgY29uc3QgTGl2ZVByZXZpZXc6IFJlYWN0LkZDPFxuICBFZGl0Vmlld1Byb3BzICYge1xuICAgIHBvcHVwU3RhdGU6IFJldHVyblR5cGU8dHlwZW9mIHVzZVBvcHVwV2luZG93PlxuICAgIHVybD86IHN0cmluZ1xuICB9XG4+ID0gKHByb3BzKSA9PiB7XG4gIGxldCB1cmxcblxuICBsZXQgYnJlYWtwb2ludHM6IExpdmVQcmV2aWV3VHlwZVsnYnJlYWtwb2ludHMnXSA9IFtcbiAgICB7XG4gICAgICBuYW1lOiAncmVzcG9uc2l2ZScsXG4gICAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgICAgIGxhYmVsOiAnUmVzcG9uc2l2ZScsXG4gICAgICB3aWR0aDogJzEwMCUnLFxuICAgIH0sXG4gIF1cblxuICBpZiAoJ2NvbGxlY3Rpb24nIGluIHByb3BzKSB7XG4gICAgdXJsID0gcHJvcHM/LmNvbGxlY3Rpb24uYWRtaW4ubGl2ZVByZXZpZXcudXJsXG4gICAgYnJlYWtwb2ludHMgPSBicmVha3BvaW50cy5jb25jYXQocHJvcHM/LmNvbGxlY3Rpb24uYWRtaW4ubGl2ZVByZXZpZXcuYnJlYWtwb2ludHMpXG4gIH1cblxuICBpZiAoJ2dsb2JhbCcgaW4gcHJvcHMpIHtcbiAgICB1cmwgPSBwcm9wcz8uZ2xvYmFsLmFkbWluLmxpdmVQcmV2aWV3LnVybFxuICAgIGJyZWFrcG9pbnRzID0gYnJlYWtwb2ludHMuY29uY2F0KHByb3BzPy5nbG9iYWwuYWRtaW4ubGl2ZVByZXZpZXcuYnJlYWtwb2ludHMpXG4gIH1cblxuICByZXR1cm4gKFxuICAgIDxMaXZlUHJldmlld1Byb3ZpZGVyIHsuLi5wcm9wc30gYnJlYWtwb2ludHM9e2JyZWFrcG9pbnRzfSB1cmw9e3VybH0+XG4gICAgICA8UHJldmlldyB7Li4ucHJvcHN9IC8+XG4gICAgPC9MaXZlUHJldmlld1Byb3ZpZGVyPlxuICApXG59XG4iXSwibmFtZXMiOlsiTGl2ZVByZXZpZXciLCJiYXNlQ2xhc3MiLCJQcmV2aWV3IiwicHJvcHMiLCJwb3B1cFN0YXRlIiwiaXNQb3B1cE9wZW4iLCJwb3B1cEhhc0xvYWRlZCIsInBvcHVwUmVmIiwidXJsIiwiaWZyYW1lSGFzTG9hZGVkIiwiaWZyYW1lUmVmIiwic2V0SWZyYW1lSGFzTG9hZGVkIiwidXNlTGl2ZVByZXZpZXdDb250ZXh0IiwiYnJlYWtwb2ludCIsImZpZWxkcyIsInVzZUFsbEZvcm1GaWVsZHMiLCJ1c2VFZmZlY3QiLCJ3aW5kb3ciLCJ2YWx1ZXMiLCJyZWR1Y2VGaWVsZHNUb1ZhbHVlcyIsIm1lc3NhZ2UiLCJKU09OIiwic3RyaW5naWZ5IiwiZGF0YSIsInR5cGUiLCJjdXJyZW50IiwicG9zdE1lc3NhZ2UiLCJjb250ZW50V2luZG93IiwiZGl2IiwiY2xhc3NOYW1lIiwiZmlsdGVyIiwiQm9vbGVhbiIsImpvaW4iLCJUb29sYmFyQXJlYSIsIkRldmljZUNvbnRhaW5lciIsIklGcmFtZSIsInJlZiIsIkxpdmVQcmV2aWV3VG9vbGJhciIsImJyZWFrcG9pbnRzIiwibmFtZSIsImhlaWdodCIsImxhYmVsIiwid2lkdGgiLCJjb2xsZWN0aW9uIiwiYWRtaW4iLCJsaXZlUHJldmlldyIsImNvbmNhdCIsImdsb2JhbCIsIkxpdmVQcmV2aWV3UHJvdmlkZXIiXSwibWFwcGluZ3MiOiI7Ozs7K0JBOEZhQTs7O2VBQUFBOzs7K0RBOUZvQjt5QkFNQTs2RUFDQTt5QkFDRzswQkFDRTt3QkFDTjt3QkFDVDt5QkFDWTs2QkFDUDtRQUNyQjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBRVAsTUFBTUMsWUFBWTtBQUVsQixN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

package/dist/admin/components/views/LivePreview/{PreviewWindow → Preview}/index.scss

@@ -8,7 +8,7 @@
   overflow: hidden;
 
   &--has-breakpoint {
-    padding-top: var(--base);
+    padding: var(--base);
 
     .live-preview-iframe {
       border: 1px solid var(--theme-elevation-100);

package/dist/admin/components/views/LivePreview/Toolbar/SizeInput/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import './index.scss';
+export declare const PreviewFrameSizeInput: React.FC<{
+    axis?: 'x' | 'y';
+}>;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/admin/components/views/LivePreview/Toolbar/SizeInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAA;AAGrD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC3C,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAA;CACjB,CAyDA,CAAA"}