pageflow 16.0.0 → 16.1.0

data/entry_types/scrolled/package/frontend/PhonePlatformContext-10a1d600.js

@@ -0,0 +1,32 @@
+import { browser } from 'pageflow/frontend';
+import React, { createContext, useContext, useState, useEffect } from 'react';
+import { _ as _slicedToArray } from './i18n-ddd92820.js';
+
+var BrowserFeaturesAvailableContext = createContext(); // Browser feature detection is not available during server side
+// rendering. To prevent mismatches during hydration, we keep features
+// disabled in the initial render. Since hydration only starts after
+// feature detection has finished, we can immediately re-render once
+// the provider has mounted.
+
+function BrowserFeaturesProvider(_ref) {
+  var children = _ref.children;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      isAvailable = _useState2[0],
+      setIsAvailable = _useState2[1];
+
+  useEffect(function () {
+    return setIsAvailable(true);
+  }, []);
+  return /*#__PURE__*/React.createElement(BrowserFeaturesAvailableContext.Provider, {
+    value: isAvailable
+  }, children);
+}
+function useBrowserFeature(name) {
+  return useContext(BrowserFeaturesAvailableContext) && browser.has(name);
+}
+
+var PhonePlatformContext = React.createContext(false);
+
+export { BrowserFeaturesProvider as B, PhonePlatformContext as P, useBrowserFeature as u };

data/entry_types/scrolled/package/frontend/ToggleFullscreenCornerButton-727cce0d.js

@@ -0,0 +1,107 @@
+import React from 'react';
+import { e as _objectWithoutProperties, u as useI18n } from './i18n-ddd92820.js';
+
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
+var EnterFullscreenIcon = (function (_ref) {
+  var _ref$styles = _ref.styles,
+      styles = _ref$styles === void 0 ? {} : _ref$styles,
+      props = _objectWithoutProperties(_ref, ["styles"]);
+
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    "aria-hidden": "true",
+    "data-prefix": "fas",
+    "data-icon": "expand",
+    className: (styles["svg-inline--fa"] || "svg-inline--fa") + " " + (styles["fa-expand"] || "fa-expand") + " " + (styles["fa-w-14"] || "fa-w-14"),
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fill: "currentColor",
+    d: "M0 180V56c0-13.3 10.7-24 24-24h124c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H64v84c0 6.6-5.4 12-12 12H12c-6.6 0-12-5.4-12-12zM288 44v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12V56c0-13.3-10.7-24-24-24H300c-6.6 0-12 5.4-12 12zm148 276h-40c-6.6 0-12 5.4-12 12v84h-84c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24V332c0-6.6-5.4-12-12-12zM160 468v-40c0-6.6-5.4-12-12-12H64v-84c0-6.6-5.4-12-12-12H12c-6.6 0-12 5.4-12 12v124c0 13.3 10.7 24 24 24h124c6.6 0 12-5.4 12-12z"
+  }));
+});
+
+function _extends$1() {
+  _extends$1 = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends$1.apply(this, arguments);
+}
+var ExitFullscreenIcon = (function (_ref) {
+  var _ref$styles = _ref.styles,
+      styles = _ref$styles === void 0 ? {} : _ref$styles,
+      props = _objectWithoutProperties(_ref, ["styles"]);
+
+  return /*#__PURE__*/React.createElement("svg", _extends$1({
+    "aria-hidden": "true",
+    "data-prefix": "fas",
+    "data-icon": "compress",
+    className: (styles["svg-inline--fa"] || "svg-inline--fa") + " " + (styles["fa-compress"] || "fa-compress") + " " + (styles["fa-w-14"] || "fa-w-14"),
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fill: "currentColor",
+    d: "M436 192H312c-13.3 0-24-10.7-24-24V44c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v84h84c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12zm-276-24V44c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v84H12c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24zm0 300V344c0-13.3-10.7-24-24-24H12c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12zm192 0v-84h84c6.6 0 12-5.4 12-12v-40c0-6.6-5.4-12-12-12H312c-13.3 0-24 10.7-24 24v124c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12z"
+  }));
+});
+
+var styles = {"button":"ToggleFullscreenButton-module_button__2n69- utils-module_unstyledButton__3rgne"};
+
+function ToggleFullscreenButton(props) {
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  return /*#__PURE__*/React.createElement("button", {
+    className: styles.button,
+    title: t(props.isFullscreen ? 'exit_fullscreen' : 'enter_fullscreen', {
+      scope: 'pageflow_scrolled.public'
+    }),
+    onClick: function onClick() {
+      return props.isFullscreen ? props.onExit() : props.onEnter();
+    }
+  }, icon(props));
+}
+
+function icon(props) {
+  if (props.isFullscreen) {
+    return /*#__PURE__*/React.createElement(ExitFullscreenIcon, null);
+  } else {
+    return /*#__PURE__*/React.createElement(EnterFullscreenIcon, null);
+  }
+}
+
+var styles$1 = {"corner":"ToggleFullscreenCornerButton-module_corner__CxAAH"};
+
+function ToggleFullscreenCornerButton(props) {
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles$1.corner
+  }, /*#__PURE__*/React.createElement(ToggleFullscreenButton, props));
+}
+
+export { ToggleFullscreenCornerButton as T };

data/entry_types/scrolled/package/frontend/Viewer-169e14ca.js

@@ -0,0 +1,154 @@
+import React, { useRef, useCallback, useState } from 'react';
+import 'react-dom';
+import { _ as _slicedToArray, b as _defineProperty } from './i18n-ddd92820.js';
+import classNames from 'classnames';
+import { a as useContentElementEditorState } from './useContentElementEditorState-63045393.js';
+import 'use-context-selector';
+import 'reselect';
+import 'slugify';
+import 'i18n-js';
+import { T as ToggleFullscreenCornerButton } from './ToggleFullscreenCornerButton-727cce0d.js';
+import { F as FullscreenViewer } from './index-02378634.js';
+import QuickPinchZoom, { make3dTransformValue } from 'react-quick-pinch-zoom';
+
+var styles = {"outer":"SwipeToClose-module_outer__1fl2h","inner":"SwipeToClose-module_inner__NOg1v"};
+
+function SwipeToClose(_ref) {
+  var onClose = _ref.onClose,
+      children = _ref.children;
+  var start = useRef();
+  var inner = useRef();
+  var ratio = useRef(0);
+  var handleTouchStart = useCallback(function (event) {
+    start.current = event.touches[0].pageY;
+  }, []);
+  var handleTouchMove = useCallback(function (event) {
+    var offset = Math.max(-200, Math.min(200, event.touches[0].pageY - start.current));
+    ratio.current = Math.abs(offset / 200);
+    requestAnimationFrame(function () {
+      if (inner.current) {
+        inner.current.style.setProperty('transition', "none");
+        inner.current.style.setProperty('transform', "translate3d(0, ".concat(offset, "px, 0)"));
+        inner.current.style.setProperty('opacity', 1 - ratio.current);
+      }
+    });
+  }, []);
+  var handleTouchEnd = useCallback(function (event) {
+    event.preventDefault();
+
+    if (ratio.current > 0.5) {
+      onClose();
+    }
+
+    requestAnimationFrame(function () {
+      if (inner.current) {
+        inner.current.style.setProperty('transition', "opacity 0.2s linear, transform 0.2s ease");
+        inner.current.style.setProperty('transform', "translate3d(0, 0, 0)");
+        inner.current.style.setProperty('opacity', 1);
+      }
+    });
+  }, [onClose]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.outer,
+    onClick: onClose,
+    onTouchStart: handleTouchStart,
+    onTouchMove: handleTouchMove,
+    onTouchEnd: handleTouchEnd
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.inner,
+    ref: inner
+  }, children));
+}
+
+var styles$1 = {"full":"ZoomableImage-module_full__1YJoO","container":"ZoomableImage-module_container__RTuPI","img":"ZoomableImage-module_img__3Vnst","visible":"ZoomableImage-module_visible__2ez0D"};
+
+function ZoomableImage(_ref) {
+  var onClose = _ref.onClose,
+      imageFile = _ref.imageFile;
+  var imgRef = useRef();
+
+  var _useState = useState(true),
+      _useState2 = _slicedToArray(_useState, 2),
+      isVisible = _useState2[0],
+      setIsVisible = _useState2[1];
+
+  var onUpdate = useCallback(function (_ref2) {
+    var x = _ref2.x,
+        y = _ref2.y,
+        scale = _ref2.scale;
+
+    if (imgRef.current) {
+      imgRef.current.style.setProperty('transform', make3dTransformValue({
+        x: x,
+        y: y,
+        scale: scale
+      }));
+    }
+  }, []);
+  var handleClose = useCallback(function () {
+    onClose();
+    setIsVisible(false);
+  }, [onClose]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles$1.full
+  }, /*#__PURE__*/React.createElement(SwipeToClose, {
+    onClose: handleClose
+  }, /*#__PURE__*/React.createElement(QuickPinchZoom, {
+    containerProps: {
+      className: styles$1.container
+    },
+    onUpdate: onUpdate,
+    isTouch: function isTouch() {
+      return true;
+    },
+    minZoom: 0.8,
+    maxZoom: 5,
+    tapZoomFactor: 1.5,
+    draggableUnZoomed: false,
+    doubleTapToggleZoom: true,
+    enforceBoundsDuringZoom: true,
+    centerContained: true
+  }, /*#__PURE__*/React.createElement("img", {
+    src: imageFile.urls.large,
+    width: imageFile.width,
+    height: imageFile.height,
+    alt: "img",
+    ref: imgRef,
+    className: classNames(styles$1.img, _defineProperty({}, styles$1.visible, isVisible))
+  }))));
+}
+
+function Viewer(_ref) {
+  var imageFile = _ref.imageFile,
+      contentElementId = _ref.contentElementId,
+      children = _ref.children;
+
+  var _useContentElementEdi = useContentElementEditorState(),
+      isEditable = _useContentElementEdi.isEditable,
+      isSelected = _useContentElementEdi.isSelected;
+
+  return /*#__PURE__*/React.createElement(FullscreenViewer, {
+    contentElementId: contentElementId,
+    renderChildren: function renderChildren(_ref2) {
+      var enterFullscreen = _ref2.enterFullscreen;
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+        onClick: enterFullscreen,
+        style: {
+          pointerEvents: isEditable && !isSelected ? 'none' : undefined
+        }
+      }, children), /*#__PURE__*/React.createElement(ToggleFullscreenCornerButton, {
+        isFullscreen: false,
+        onEnter: enterFullscreen
+      }));
+    },
+    renderFullscreenChildren: function renderFullscreenChildren(_ref3) {
+      var exitFullscreen = _ref3.exitFullscreen;
+      return /*#__PURE__*/React.createElement(ZoomableImage, {
+        onClose: exitFullscreen,
+        imageFile: imageFile
+      });
+    }
+  });
+}
+
+export default Viewer;

data/entry_types/scrolled/package/frontend/{Viewer-b6becc57.js → Viewer-ee1aa590.js}

@@ -1,112 +1,19 @@
 import 'pageflow/frontend';
 import React, { useMemo, useEffect, useRef, useState } from 'react';
 import ReactDOM from 'react-dom';
-import { _ as _objectWithoutProperties, u as useI18n, b as _defineProperty, n as useBrowserFeature, c as _slicedToArray } from './PhonePlatformContext-f6093cc6.js';
-import 'i18n-js';
+import { b as _defineProperty, e as _objectWithoutProperties, _ as _slicedToArray } from './i18n-ddd92820.js';
+import classNames from 'classnames';
 import 'use-context-selector';
 import 'reselect';
 import 'slugify';
-import classNames from 'classnames';
-import { A as ArrowRightIcon, u as usePhonePlatform } from './arrowRight-78a7cee4.js';
+import 'i18n-js';
+import { u as useBrowserFeature } from './PhonePlatformContext-10a1d600.js';
+import { T as ToggleFullscreenCornerButton } from './ToggleFullscreenCornerButton-727cce0d.js';
+import { a as ArrowLeftIcon, A as ArrowRightIcon, u as usePhonePlatform } from './arrowRight-92a34ccc.js';
 import { PanoViewer } from '@egjs/view360';
 import screenfull from 'screenfull';
 
-function _extends() {
-  _extends = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  return _extends.apply(this, arguments);
-}
-var EnterFullscreenIcon = (function (_ref) {
-  var _ref$styles = _ref.styles,
-      styles = _ref$styles === void 0 ? {} : _ref$styles,
-      props = _objectWithoutProperties(_ref, ["styles"]);
-
-  return /*#__PURE__*/React.createElement("svg", _extends({
-    "aria-hidden": "true",
-    "data-prefix": "fas",
-    "data-icon": "expand",
-    className: (styles["svg-inline--fa"] || "svg-inline--fa") + " " + (styles["fa-expand"] || "fa-expand") + " " + (styles["fa-w-14"] || "fa-w-14"),
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 448 512"
-  }, props), /*#__PURE__*/React.createElement("path", {
-    fill: "currentColor",
-    d: "M0 180V56c0-13.3 10.7-24 24-24h124c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H64v84c0 6.6-5.4 12-12 12H12c-6.6 0-12-5.4-12-12zM288 44v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12V56c0-13.3-10.7-24-24-24H300c-6.6 0-12 5.4-12 12zm148 276h-40c-6.6 0-12 5.4-12 12v84h-84c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24V332c0-6.6-5.4-12-12-12zM160 468v-40c0-6.6-5.4-12-12-12H64v-84c0-6.6-5.4-12-12-12H12c-6.6 0-12 5.4-12 12v124c0 13.3 10.7 24 24 24h124c6.6 0 12-5.4 12-12z"
-  }));
-});
-
-function _extends$1() {
-  _extends$1 = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  return _extends$1.apply(this, arguments);
-}
-var ExitFullscreenIcon = (function (_ref) {
-  var _ref$styles = _ref.styles,
-      styles = _ref$styles === void 0 ? {} : _ref$styles,
-      props = _objectWithoutProperties(_ref, ["styles"]);
-
-  return /*#__PURE__*/React.createElement("svg", _extends$1({
-    "aria-hidden": "true",
-    "data-prefix": "fas",
-    "data-icon": "compress",
-    className: (styles["svg-inline--fa"] || "svg-inline--fa") + " " + (styles["fa-compress"] || "fa-compress") + " " + (styles["fa-w-14"] || "fa-w-14"),
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 448 512"
-  }, props), /*#__PURE__*/React.createElement("path", {
-    fill: "currentColor",
-    d: "M436 192H312c-13.3 0-24-10.7-24-24V44c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v84h84c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12zm-276-24V44c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v84H12c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24zm0 300V344c0-13.3-10.7-24-24-24H12c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12zm192 0v-84h84c6.6 0 12-5.4 12-12v-40c0-6.6-5.4-12-12-12H312c-13.3 0-24 10.7-24 24v124c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12z"
-  }));
-});
-
-var styles = {"button":"ToggleFullscreenButton-module_button__3iBr8 utils-module_unstyledButton__3rgne"};
-
-function ToggleFullscreenButton(props) {
-  var _useI18n = useI18n(),
-      t = _useI18n.t;
-
-  return /*#__PURE__*/React.createElement("button", {
-    className: styles.button,
-    title: t(props.isFullscreen ? 'exit_fullscreen' : 'enter_fullscreen', {
-      scope: 'pageflow_scrolled.public'
-    }),
-    onClick: function onClick() {
-      return props.isFullscreen ? props.onExit() : props.onEnter();
-    }
-  }, icon(props));
-}
-
-function icon(props) {
-  if (props.isFullscreen) {
-    return /*#__PURE__*/React.createElement(ExitFullscreenIcon, null);
-  } else {
-    return /*#__PURE__*/React.createElement(EnterFullscreenIcon, null);
-  }
-}
-
-var styles$1 = {"wrapper":"Fullscreen-module_wrapper__300hJ"};
+var styles = {"wrapper":"Fullscreen-module_wrapper__300hJ"};
 
 function Fullscreen(_ref) {
   var isFullscreen = _ref.isFullscreen,
@@ -124,108 +31,74 @@ function Fullscreen(_ref) {
 
   if (isFullscreen) {
     return ReactDOM.createPortal( /*#__PURE__*/React.createElement("div", {
-      className: styles$1.wrapper
+      className: styles.wrapper
     }, children), root);
   } else {
     return children;
   }
 }
 
-function _extends$2() {
-  _extends$2 = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  return _extends$2.apply(this, arguments);
-}
-var ArrowLeftIcon = (function (_ref) {
-  var _ref$styles = _ref.styles,
-      styles = _ref$styles === void 0 ? {} : _ref$styles,
-      props = _objectWithoutProperties(_ref, ["styles"]);
-
-  return /*#__PURE__*/React.createElement("svg", _extends$2({
-    xmlns: "http://www.w3.org/2000/svg",
-    className: (styles["h-5"] || "h-5") + " " + (styles["w-5"] || "w-5"),
-    viewBox: "0 0 20 20",
-    fill: "currentColor"
-  }, props), /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z",
-    clipRule: "evenodd"
-  }));
-});
-
-var styles$2 = {"indicator":"PanoramaIndicator-module_indicator__3A90v","visible":"PanoramaIndicator-module_visible__3LOgm","arrow":"PanoramaIndicator-module_arrow__QV1Pd","arrowLeft":"PanoramaIndicator-module_arrowLeft__Jh7GC PanoramaIndicator-module_arrow__QV1Pd","arrowRight":"PanoramaIndicator-module_arrowRight__ZZBtO PanoramaIndicator-module_arrow__QV1Pd","nudgeLeft":"PanoramaIndicator-module_nudgeLeft__IU_Iy","nudgeRight":"PanoramaIndicator-module_nudgeRight__3XzNu","text":"PanoramaIndicator-module_text__2FzUy"};
+var styles$1 = {"indicator":"PanoramaIndicator-module_indicator__3A90v","visible":"PanoramaIndicator-module_visible__3LOgm","arrow":"PanoramaIndicator-module_arrow__QV1Pd","arrowLeft":"PanoramaIndicator-module_arrowLeft__Jh7GC PanoramaIndicator-module_arrow__QV1Pd","arrowRight":"PanoramaIndicator-module_arrowRight__ZZBtO PanoramaIndicator-module_arrow__QV1Pd","nudgeLeft":"PanoramaIndicator-module_nudgeLeft__IU_Iy","nudgeRight":"PanoramaIndicator-module_nudgeRight__3XzNu","text":"PanoramaIndicator-module_text__2FzUy"};
 
 function PanoramaIndicator(_ref) {
   var visible = _ref.visible;
   var size = 40;
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames(styles$2.indicator, _defineProperty({}, styles$2.visible, visible))
+    className: classNames(styles$1.indicator, _defineProperty({}, styles$1.visible, visible))
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$2.arrowLeft
+    className: styles$1.arrowLeft
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ArrowLeftIcon, {
     width: size,
     height: size
   }))), /*#__PURE__*/React.createElement("div", {
-    className: styles$2.arrowRight
+    className: styles$1.arrowRight
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ArrowRightIcon, {
     width: size,
     height: size
   }))), /*#__PURE__*/React.createElement("div", {
-    className: styles$2.text
+    className: styles$1.text
   }, "360\xB0"));
 }
 
-var styles$3 = {"indicator":"FullscreenIndicator-module_indicator__2Jl_-","visible":"FullscreenIndicator-module_visible__2ywsZ","icon":"FullscreenIndicator-module_icon__2Ddof","icons":"FullscreenIndicator-module_icons__3-Xm6","text":"FullscreenIndicator-module_text__3wCW3","pulse":"FullscreenIndicator-module_pulse__1qujU","iconTopLeft":"FullscreenIndicator-module_iconTopLeft__2u7-j FullscreenIndicator-module_icon__2Ddof","iconTopRight":"FullscreenIndicator-module_iconTopRight__14nUk FullscreenIndicator-module_icon__2Ddof","iconBottomRight":"FullscreenIndicator-module_iconBottomRight__lEtN6 FullscreenIndicator-module_icon__2Ddof","iconBottomLeft":"FullscreenIndicator-module_iconBottomLeft__voLm_ FullscreenIndicator-module_icon__2Ddof"};
+var styles$2 = {"indicator":"FullscreenIndicator-module_indicator__2Jl_-","visible":"FullscreenIndicator-module_visible__2ywsZ","icon":"FullscreenIndicator-module_icon__2Ddof","icons":"FullscreenIndicator-module_icons__3-Xm6","text":"FullscreenIndicator-module_text__3wCW3","pulse":"FullscreenIndicator-module_pulse__1qujU","iconTopLeft":"FullscreenIndicator-module_iconTopLeft__2u7-j FullscreenIndicator-module_icon__2Ddof","iconTopRight":"FullscreenIndicator-module_iconTopRight__14nUk FullscreenIndicator-module_icon__2Ddof","iconBottomRight":"FullscreenIndicator-module_iconBottomRight__lEtN6 FullscreenIndicator-module_icon__2Ddof","iconBottomLeft":"FullscreenIndicator-module_iconBottomLeft__voLm_ FullscreenIndicator-module_icon__2Ddof"};
 
 function FullscreenIndicator(_ref) {
   var visible = _ref.visible,
       onClick = _ref.onClick;
   var size = 50;
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames(styles$3.indicator, _defineProperty({}, styles$3.visible, visible))
+    className: classNames(styles$2.indicator, _defineProperty({}, styles$2.visible, visible))
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$3.icons
+    className: styles$2.icons
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$3.iconTopLeft
+    className: styles$2.iconTopLeft
   }, /*#__PURE__*/React.createElement(ArrowLeftIcon, {
     width: size,
     height: size
   })), /*#__PURE__*/React.createElement("div", {
-    className: styles$3.iconTopRight
+    className: styles$2.iconTopRight
   }, /*#__PURE__*/React.createElement(ArrowLeftIcon, {
     width: size,
     height: size
   })), /*#__PURE__*/React.createElement("div", {
-    className: styles$3.iconBottomRight
+    className: styles$2.iconBottomRight
   }, /*#__PURE__*/React.createElement(ArrowLeftIcon, {
     width: size,
     height: size
   })), /*#__PURE__*/React.createElement("div", {
-    className: styles$3.iconBottomLeft
+    className: styles$2.iconBottomLeft
   }, /*#__PURE__*/React.createElement(ArrowLeftIcon, {
     width: size,
     height: size
   }))), /*#__PURE__*/React.createElement("div", {
-    className: styles$3.text
+    className: styles$2.text
   }, "360\xB0"));
 }
 
-var styles$4 = {"full":"Viewer-module_full__1q18y","container":"Viewer-module_container__3eJ34 Viewer-module_full__1q18y","controls":"Viewer-module_controls__3BTof","spinner":"Viewer-module_spinner__2oRve","spin":"Viewer-module_spin__3jBR2","isLoading":"Viewer-module_isLoading__sQuGw"};
+var styles$3 = {"full":"Viewer-module_full__1q18y","container":"Viewer-module_container__3eJ34 Viewer-module_full__1q18y","spinner":"Viewer-module_spinner__2oRve","spin":"Viewer-module_spin__3jBR2","isLoading":"Viewer-module_isLoading__sQuGw"};
 
-function _extends$3() {
-  _extends$3 = Object.assign || function (target) {
+function _extends() {
+  _extends = Object.assign || function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
 
@@ -239,13 +112,13 @@ function _extends$3() {
     return target;
   };
 
-  return _extends$3.apply(this, arguments);
+  return _extends.apply(this, arguments);
 }
 var SpinnerIcon = (function (_ref) {
   var _ref$styles = _ref.styles,
       props = _objectWithoutProperties(_ref, ["styles"]);
 
-  return /*#__PURE__*/React.createElement("svg", _extends$3({
+  return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
     viewBox: "0 0 24 24"
@@ -299,7 +172,7 @@ function Viewer(_ref) {
   function appendViewerTo(parentNode) {
     if (!elRef.current) {
       elRef.current = document.createElement('div');
-      elRef.current.className = styles$4.full;
+      elRef.current.className = styles$3.full;
       viewerRef.current = new PanoViewer(elRef.current, {
         image: imageFile.urls.ultra,
         projectionType: imageFile.configuration.projection === 'equirectangular_stereo' ? PanoViewer.PROJECTION_TYPE.STEREOSCOPIC_EQUI : PanoViewer.PROJECTION_TYPE.EQUIRECTANGULAR,
@@ -424,25 +297,23 @@ function Viewer(_ref) {
   return /*#__PURE__*/React.createElement(Fullscreen, {
     isFullscreen: isFullscreen
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$4.container,
+    className: styles$3.container,
     onKeyDown: preventDefaultForArrowUpDown,
     onClick: function onClick() {
       isPhonePlatform && enterFullscreen();
     }
   }, /*#__PURE__*/React.createElement(DOMNodeContainer, {
-    className: styles$4.full,
+    className: styles$3.full,
     onUpdate: function onUpdate(el) {
       return appendViewerTo(el);
     }
   })), /*#__PURE__*/React.createElement(SpinnerIcon, {
-    className: classNames(styles$4.spinner, _defineProperty({}, styles$4.isLoading, isLoading))
-  }), (!isPhonePlatform || isFullscreen) && /*#__PURE__*/React.createElement("div", {
-    className: styles$4.controls
-  }, /*#__PURE__*/React.createElement(ToggleFullscreenButton, {
+    className: classNames(styles$3.spinner, _defineProperty({}, styles$3.isLoading, isLoading))
+  }), (!isPhonePlatform || isFullscreen) && /*#__PURE__*/React.createElement(ToggleFullscreenCornerButton, {
     isFullscreen: isFullscreen,
     onEnter: enterFullscreen,
     onExit: exitFullscreen
-  })), /*#__PURE__*/React.createElement(PanoramaIndicator, {
+  }), /*#__PURE__*/React.createElement(PanoramaIndicator, {
     visible: !isLoading && !isPhonePlatform && !isFullscreen && !hidePanoramaIndicator
   }), /*#__PURE__*/React.createElement(FullscreenIndicator, {
     visible: !isLoading && isPhonePlatform && !isFullscreen

data/entry_types/scrolled/package/frontend/arrowRight-92a34ccc.js

@@ -0,0 +1,77 @@
+import React from 'react';
+import { e as _objectWithoutProperties } from './i18n-ddd92820.js';
+import { P as PhonePlatformContext } from './PhonePlatformContext-10a1d600.js';
+
+function usePhonePlatform() {
+  return React.useContext(PhonePlatformContext);
+}
+
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
+var ArrowLeftIcon = (function (_ref) {
+  var _ref$styles = _ref.styles,
+      styles = _ref$styles === void 0 ? {} : _ref$styles,
+      props = _objectWithoutProperties(_ref, ["styles"]);
+
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    className: (styles["h-5"] || "h-5") + " " + (styles["w-5"] || "w-5"),
+    viewBox: "0 0 20 20",
+    fill: "currentColor"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z",
+    clipRule: "evenodd"
+  }));
+});
+
+function _extends$1() {
+  _extends$1 = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends$1.apply(this, arguments);
+}
+var ArrowRightIcon = (function (_ref) {
+  var _ref$styles = _ref.styles,
+      styles = _ref$styles === void 0 ? {} : _ref$styles,
+      props = _objectWithoutProperties(_ref, ["styles"]);
+
+  return /*#__PURE__*/React.createElement("svg", _extends$1({
+    xmlns: "http://www.w3.org/2000/svg",
+    className: (styles["h-5"] || "h-5") + " " + (styles["w-5"] || "w-5"),
+    viewBox: "0 0 20 20",
+    fill: "currentColor"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z",
+    clipRule: "evenodd"
+  }));
+});
+
+export { ArrowRightIcon as A, ArrowLeftIcon as a, usePhonePlatform as u };