@ohif/app 3.8.0-beta.27 → 3.8.0-beta.29

package/dist/{12.bundle.56b9d54b9c0af71af1d7.js → 12.bundle.abb6ab88fda1125f3b47.js}

@@ -1,5 +1,5 @@
 "use strict";
-(self["webpackChunk"] = self["webpackChunk"] || []).push([[12],{
+(globalThis["webpackChunk"] = globalThis["webpackChunk"] || []).push([[12],{
 
 /***/ 85012:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
@@ -107,11 +107,10 @@ const _getDisplaySetsFromSeries = (instances, servicesManager, extensionManager)
     return displaySet;
   });
 };
-function getSopClassHandlerModule(_ref) {
-  let {
-    servicesManager,
-    extensionManager
-  } = _ref;
+function getSopClassHandlerModule({
+  servicesManager,
+  extensionManager
+}) {
   const getDisplaySetsFromSeries = instances => {
     return _getDisplaySetsFromSeries(instances, servicesManager, extensionManager);
   };
@@ -149,11 +148,10 @@ const dicomVideoExtension = {
    * @param {object} [configuration={}]
    * @param {object|array} [configuration.csToolsConfig] - Passed directly to `initCornerstoneTools`
    */
-  getViewportModule(_ref) {
-    let {
-      servicesManager,
-      extensionManager
-    } = _ref;
+  getViewportModule({
+    servicesManager,
+    extensionManager
+  }) {
     const ExtendedOHIFCornerstoneVideoViewport = props => {
       return /*#__PURE__*/react.createElement(OHIFCornerstoneVideoViewport, _extends({
         servicesManager: servicesManager,

package/dist/{125.bundle.253395f320b72180da63.js → 125.bundle.df666cb677e5a8982157.js}

@@ -1,5 +1,5 @@
 "use strict";
-(self["webpackChunk"] = self["webpackChunk"] || []).push([[125],{
+(globalThis["webpackChunk"] = globalThis["webpackChunk"] || []).push([[125],{
 
 /***/ 39125:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
@@ -13,10 +13,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
 
 
-function OHIFCornerstonePdfViewport(_ref) {
-  let {
-    displaySets
-  } = _ref;
+function OHIFCornerstonePdfViewport({
+  displaySets
+}) {
   const [url, setUrl] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null);
   if (displaySets && displaySets.length > 1) {
     throw new Error('OHIFCornerstonePdfViewport: only one display set is supported for dicom pdf right now');

package/dist/{170.bundle.80ad57e16afc8855b0fc.js → 170.bundle.57dff48fc09ba5fa844b.js}

@@ -1,5 +1,5 @@
 "use strict";
-(self["webpackChunk"] = self["webpackChunk"] || []).push([[170],{
+(globalThis["webpackChunk"] = globalThis["webpackChunk"] || []).push([[170],{
 
 /***/ 42170:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
@@ -29,10 +29,10 @@ const SOPClassHandlerId = `${id}.sopClassHandlerModule.${SOPClassHandlerName}`;
 var src = __webpack_require__(71771);
 // EXTERNAL MODULE: ../../../node_modules/gl-matrix/esm/index.js + 10 modules
 var esm = __webpack_require__(45451);
-// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/tools/dist/esm/index.js + 413 modules
-var dist_esm = __webpack_require__(1026);
-// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/core/dist/esm/index.js + 363 modules
-var core_dist_esm = __webpack_require__(56959);
+// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/tools/dist/esm/index.js + 424 modules
+var dist_esm = __webpack_require__(74566);
+// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/core/dist/esm/index.js + 364 modules
+var core_dist_esm = __webpack_require__(27968);
 // EXTERNAL MODULE: ../../../extensions/cornerstone-dicom-sr/src/tools/modules/dicomSRModule.js
 var dicomSRModule = __webpack_require__(64035);
 ;// CONCATENATED MODULE: ../../../extensions/cornerstone-dicom-sr/src/constants/scoordTypes.js
@@ -49,11 +49,9 @@ var dicomSRModule = __webpack_require__(64035);
 
 
 class DICOMSRDisplayTool extends dist_esm.AnnotationTool {
-  constructor() {
-    let toolProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    let defaultToolProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
-      configuration: {}
-    };
+  constructor(toolProps = {}, defaultToolProps = {
+    configuration: {}
+  }) {
     super(toolProps, defaultToolProps);
     // This tool should not inherit from AnnotationTool and we should not need
     // to add the following lines.
@@ -173,7 +171,6 @@ class DICOMSRDisplayTool extends dist_esm.AnnotationTool {
     });
     return allCanvasCoordinates; // used for drawing textBox
   }
-
   renderMultipoint(svgDrawingHelper, viewport, renderableData, annotationUID, referencedImageId, options) {
     let canvasCoordinates;
     renderableData.map((data, index) => {
@@ -216,7 +213,6 @@ class DICOMSRDisplayTool extends dist_esm.AnnotationTool {
     });
     return canvasCoordinates; // used for drawing textBox
   }
-
   renderEllipse(svgDrawingHelper, viewport, renderableData, annotationUID, referencedImageId, options) {
     let canvasCoordinates;
     renderableData.map((data, index) => {
@@ -242,8 +238,7 @@ class DICOMSRDisplayTool extends dist_esm.AnnotationTool {
     });
     return canvasCoordinates;
   }
-  renderTextBox(svgDrawingHelper, viewport, canvasCoordinates, canvasCoordinatesAdapter, annotation, styleSpecifier) {
-    let options = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : {};
+  renderTextBox(svgDrawingHelper, viewport, canvasCoordinates, canvasCoordinatesAdapter, annotation, styleSpecifier, options = {}) {
     if (!canvasCoordinates || !annotation) {
       return;
     }
@@ -565,7 +560,6 @@ const sopClassUids = ['1.2.840.10008.5.1.4.1.1.88.11',
 //COMPREHENSIVE_SR:
 '1.2.840.10008.5.1.4.1.1.88.34' //COMPREHENSIVE_3D_SR:
 ];
-
 const CORNERSTONE_3D_TOOLS_SOURCE_NAME = 'Cornerstone3DTools';
 const CORNERSTONE_3D_TOOLS_SOURCE_VERSION = '0.1';
 const validateSameStudyUID = (uid, instances) => {
@@ -589,7 +583,6 @@ const CodeNameCodeSequenceValues = {
   // SRT
   CornerstoneFreeText: Cornerstone3DCodeScheme.codeValues.CORNERSTONEFREETEXT //
 };
-
 const CodingSchemeDesignators = {
   SRT: 'SRT',
   CornerstoneCodeSchemes: [Cornerstone3DCodeScheme.CodingSchemeDesignator, 'CST4']
@@ -791,11 +784,10 @@ function _measurementReferencesSOPInstanceUID(measurement, SOPInstanceUID, frame
     }
   }
 }
-function getSopClassHandlerModule(_ref) {
-  let {
-    servicesManager,
-    extensionManager
-  } = _ref;
+function getSopClassHandlerModule({
+  servicesManager,
+  extensionManager
+}) {
   const getDisplaySetsFromSeries = instances => {
     return _getDisplaySetsFromSeries(instances, servicesManager, extensionManager);
   };
@@ -980,7 +972,6 @@ function _getLabelFromMeasuredValueSequence(ConceptNameCodeSequence, MeasuredVal
     value: `${formatedNumericValue} ${CodeValue}`
   }; // E.g. Long Axis: 31.0 mm
 }
-
 function _getReferencedImagesList(ImagingMeasurementReportContentSequence) {
   const ImageLibrary = ImagingMeasurementReportContentSequence.find(item => item.ConceptNameCodeSequence.CodeValue === CodeNameCodeSequenceValues.ImageLibrary);
   const ImageLibraryGroup = _getSequenceAsArray(ImageLibrary.ContentSequence).find(item => item.ConceptNameCodeSequence.CodeValue === CodeNameCodeSequenceValues.ImageLibraryGroup);
@@ -1080,10 +1071,9 @@ function getHangingProtocolModule() {
 
 ;// CONCATENATED MODULE: ../../../extensions/cornerstone-dicom-sr/src/onModeEnter.js
 
-function onModeEnter(_ref) {
-  let {
-    servicesManager
-  } = _ref;
+function onModeEnter({
+  servicesManager
+}) {
   const {
     displaySetService
   } = servicesManager.services;
@@ -1202,8 +1192,7 @@ const {
  * @param options Naturalized DICOM JSON headers to merge into the displaySet.
  *
  */
-const _generateReport = function (measurementData, additionalFindingTypes) {
-  let options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+const _generateReport = (measurementData, additionalFindingTypes, options = {}) => {
   const filteredToolState = utils_getFilteredCornerstoneToolState(measurementData, additionalFindingTypes);
   const report = MeasurementReport.generateReport(filteredToolState, core_dist_esm.metaData, core_dist_esm.utilities.worldToImageCoords, options);
   const {
@@ -1217,8 +1206,7 @@ const _generateReport = function (measurementData, additionalFindingTypes) {
   }
   return dataset;
 };
-const commandsModule = _ref => {
-  let {} = _ref;
+const commandsModule = ({}) => {
   const actions = {
     /**
      *
@@ -1228,12 +1216,11 @@ const commandsModule = _ref => {
      * as opposed to Finding Sites.
      * that you wish to serialize.
      */
-    downloadReport: _ref2 => {
-      let {
-        measurementData,
-        additionalFindingTypes,
-        options = {}
-      } = _ref2;
+    downloadReport: ({
+      measurementData,
+      additionalFindingTypes,
+      options = {}
+    }) => {
       const srDataset = actions.generateReport(measurementData, additionalFindingTypes, options);
       const reportBlob = dcmjs_es["default"].data.datasetToBlob(srDataset);
 
@@ -1250,13 +1237,12 @@ const commandsModule = _ref => {
      * @param options Naturalized DICOM JSON headers to merge into the displaySet.
      * @return The naturalized report
      */
-    storeMeasurements: async _ref3 => {
-      let {
-        measurementData,
-        dataSource,
-        additionalFindingTypes,
-        options = {}
-      } = _ref3;
+    storeMeasurements: async ({
+      measurementData,
+      dataSource,
+      additionalFindingTypes,
+      options = {}
+    }) => {
       // Use the @cornerstonejs adapter for converting to/from DICOM
       // But it is good enough for now whilst we only have cornerstone as a datasource.
       commandsModule_log.info('[DICOMSR] storeMeasurements');
@@ -1329,10 +1315,9 @@ function addToolInstance(name, toolClass, configuration) {
 /**
  * @param {object} configuration
  */
-function init(_ref) {
-  let {
-    configuration = {}
-  } = _ref;
+function init({
+  configuration = {}
+}) {
   (0,dist_esm.addTool)(DICOMSRDisplayTool);
   addToolInstance(tools_toolNames.SRLength, dist_esm.LengthTool, {});
   addToolInstance(tools_toolNames.SRBidirectional, dist_esm.BidirectionalTool);
@@ -1486,11 +1471,10 @@ const dicomSRExtension = {
    * @param {object} [configuration={}]
    * @param {object|array} [configuration.csToolsConfig] - Passed directly to `initCornerstoneTools`
    */
-  getViewportModule(_ref) {
-    let {
-      servicesManager,
-      extensionManager
-    } = _ref;
+  getViewportModule({
+    servicesManager,
+    extensionManager
+  }) {
     const ExtendedOHIFCornerstoneSRViewport = props => {
       return /*#__PURE__*/react.createElement(OHIFCornerstoneSRViewport, _extends({
         servicesManager: servicesManager,
@@ -1505,10 +1489,9 @@ const dicomSRExtension = {
   getCommandsModule: src_commandsModule,
   getSopClassHandlerModule: src_getSopClassHandlerModule,
   // Include dynamically computed values such as toolNames not known till instantiation
-  getUtilityModule(_ref2) {
-    let {
-      servicesManager
-    } = _ref2;
+  getUtilityModule({
+    servicesManager
+  }) {
     return [{
       name: 'tools',
       exports: {
@@ -1532,7 +1515,7 @@ const dicomSRExtension = {
 /* harmony export */   yR: () => (/* binding */ getTrackingUniqueIdentifiersForElement)
 /* harmony export */ });
 /* unused harmony export setActiveTrackingUniqueIdentifierForElement */
-/* harmony import */ var _cornerstonejs_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(56959);
+/* harmony import */ var _cornerstonejs_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(27968);
 
 const state = {
   TrackingUniqueIdentifier: null,
@@ -1547,8 +1530,7 @@ const state = {
  * of the SR tools in state here, so that we can filter them later.
  */
 
-function setTrackingUniqueIdentifiersForElement(element, trackingUniqueIdentifiers) {
-  let activeIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+function setTrackingUniqueIdentifiersForElement(element, trackingUniqueIdentifiers, activeIndex = 0) {
   const enabledElement = (0,_cornerstonejs_core__WEBPACK_IMPORTED_MODULE_0__.getEnabledElement)(element);
   const {
     viewport
@@ -1594,8 +1576,8 @@ __webpack_require__.d(__webpack_exports__, {
   Z: () => (/* binding */ hydrateStructuredReport)
 });
 
-// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/core/dist/esm/index.js + 363 modules
-var esm = __webpack_require__(56959);
+// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/core/dist/esm/index.js + 364 modules
+var esm = __webpack_require__(27968);
 // EXTERNAL MODULE: ../../core/src/index.ts + 65 modules
 var src = __webpack_require__(71771);
 ;// CONCATENATED MODULE: ../../../extensions/cornerstone-dicom-sr/src/utils/getLabelFromDCMJSImportedToolData.js
@@ -1622,8 +1604,8 @@ function getLabelFromDCMJSImportedToolData(toolData) {
 }
 // EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/adapters/dist/adapters.es.js
 var adapters_es = __webpack_require__(91202);
-// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/tools/dist/esm/index.js + 413 modules
-var dist_esm = __webpack_require__(1026);
+// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/tools/dist/esm/index.js + 424 modules
+var dist_esm = __webpack_require__(74566);
 ;// CONCATENATED MODULE: ../../../extensions/cornerstone-dicom-sr/src/utils/hydrateStructuredReport.js
 
 
@@ -1676,12 +1658,11 @@ const convertSites = (codingValues, sites) => {
  * Hydrates a structured report, for default viewports.
  *
  */
-function hydrateStructuredReport(_ref, displaySetInstanceUID) {
-  let {
-    servicesManager,
-    extensionManager,
-    appConfig
-  } = _ref;
+function hydrateStructuredReport({
+  servicesManager,
+  extensionManager,
+  appConfig
+}, displaySetInstanceUID) {
   const annotationManager = dist_esm.annotation.state.getAnnotationManager();
   const disableEditing = appConfig?.disableEditing;
   const dataSource = extensionManager.getActiveDataSource()[0];

package/dist/{181.bundle.87f1df4f401b8023cfd1.js → 181.bundle.ae92b8a551d041d06e90.js}

@@ -1,5 +1,5 @@
 "use strict";
-(self["webpackChunk"] = self["webpackChunk"] || []).push([[181],{
+(globalThis["webpackChunk"] = globalThis["webpackChunk"] || []).push([[181],{
 
 /***/ 86181:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
@@ -19,10 +19,10 @@ var index_esm = __webpack_require__(7023);
 // EXTERNAL MODULE: ../../../node_modules/prop-types/index.js
 var prop_types = __webpack_require__(3827);
 var prop_types_default = /*#__PURE__*/__webpack_require__.n(prop_types);
-// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/tools/dist/esm/index.js + 413 modules
-var esm = __webpack_require__(1026);
-// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/core/dist/esm/index.js + 363 modules
-var dist_esm = __webpack_require__(56959);
+// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/tools/dist/esm/index.js + 424 modules
+var esm = __webpack_require__(74566);
+// EXTERNAL MODULE: ../../../node_modules/@cornerstonejs/core/dist/esm/index.js + 364 modules
+var dist_esm = __webpack_require__(27968);
 // EXTERNAL MODULE: ../../core/src/index.ts + 65 modules
 var src = __webpack_require__(71771);
 // EXTERNAL MODULE: ../../ui/src/index.js + 486 modules
@@ -38,16 +38,15 @@ var state = __webpack_require__(73704);
 
 
 
-function CornerstoneImageScrollbar(_ref) {
-  let {
-    viewportData,
-    viewportId,
-    element,
-    imageSliceData,
-    setImageSliceData,
-    scrollbarHeight,
-    servicesManager
-  } = _ref;
+function CornerstoneImageScrollbar({
+  viewportData,
+  viewportId,
+  element,
+  imageSliceData,
+  setImageSliceData,
+  scrollbarHeight,
+  servicesManager
+}) {
   const {
     cineService,
     cornerstoneViewportService
@@ -183,8 +182,7 @@ function isValidNumber(value) {
  * @param {number} precision
  * @returns {number} formatted number.
  */
-function formatNumberPrecision(number) {
-  let precision = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+function formatNumberPrecision(number, precision = 0) {
   if (number !== null) {
     return parseFloat(number).toFixed(precision);
   }
@@ -197,8 +195,7 @@ function formatNumberPrecision(number) {
  * @param {string} strFormat
  * @returns {string} formatted date.
  */
-function formatDICOMDate(date) {
-  let strFormat = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'MMM D, YYYY';
+function formatDICOMDate(date, strFormat = 'MMM D, YYYY') {
   return moment_default()(date, 'YYYYMMDD').format(strFormat);
 }
 
@@ -215,8 +212,7 @@ function formatDICOMDate(date) {
  * @param {string} strFormat
  * @returns {string} formatted name.
  */
-function formatDICOMTime(time) {
-  let strFormat = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'HH:mm:ss';
+function formatDICOMTime(time, strFormat = 'HH:mm:ss') {
   return moment_default()(time, 'HH:mm:ss').format(strFormat);
 }
 
@@ -269,11 +265,10 @@ const EPSILON = 1e-4;
 /**
  * Window Level / Center Overlay item
  */
-function VOIOverlayItem(_ref) {
-  let {
-    voi,
-    customization
-  } = _ref;
+function VOIOverlayItem({
+  voi,
+  customization
+}) {
   const {
     windowWidth,
     windowCenter
@@ -300,11 +295,10 @@ function VOIOverlayItem(_ref) {
 /**
  * Zoom Level Overlay item
  */
-function ZoomOverlayItem(_ref2) {
-  let {
-    scale,
-    customization
-  } = _ref2;
+function ZoomOverlayItem({
+  scale,
+  customization
+}) {
   return /*#__PURE__*/react.createElement("div", {
     className: "overlay-item flex flex-row",
     style: {
@@ -320,12 +314,11 @@ function ZoomOverlayItem(_ref2) {
 /**
  * Instance Number Overlay Item
  */
-function InstanceNumberOverlayItem(_ref3) {
-  let {
-    instanceNumber,
-    imageSliceData,
-    customization
-  } = _ref3;
+function InstanceNumberOverlayItem({
+  instanceNumber,
+  imageSliceData,
+  customization
+}) {
   const {
     imageIndex,
     numberOfSlices
@@ -345,14 +338,13 @@ function InstanceNumberOverlayItem(_ref3) {
 /**
  * Customizable Viewport Overlay
  */
-function CustomizableViewportOverlay(_ref4) {
-  let {
-    element,
-    viewportData,
-    imageSliceData,
-    viewportId,
-    servicesManager
-  } = _ref4;
+function CustomizableViewportOverlay({
+  element,
+  viewportData,
+  imageSliceData,
+  viewportId,
+  servicesManager
+}) {
   const {
     toolbarService,
     cornerstoneViewportService,
@@ -649,15 +641,14 @@ const {
   getOrientationStringLPS,
   invertOrientationStringLPS
 } = esm.utilities.orientation;
-function ViewportOrientationMarkers(_ref) {
-  let {
-    element,
-    viewportData,
-    imageSliceData,
-    viewportId,
-    servicesManager,
-    orientationMarkers = ['top', 'left']
-  } = _ref;
+function ViewportOrientationMarkers({
+  element,
+  viewportData,
+  imageSliceData,
+  viewportId,
+  servicesManager,
+  orientationMarkers = ['top', 'left']
+}) {
   // Rotation is in degrees
   const [rotation, setRotation] = (0,react.useState)(0);
   const [flipHorizontal, setFlipHorizontal] = (0,react.useState)(false);
@@ -818,11 +809,10 @@ function _getOrientationMarkers(rowCosines, columnCosines, rotation, flipVertica
 
 
 
-function ViewportImageSliceLoadingIndicator(_ref) {
-  let {
-    viewportData,
-    element
-  } = _ref;
+function ViewportImageSliceLoadingIndicator({
+  viewportData,
+  element
+}) {
   const [loading, setLoading] = (0,react.useState)(false);
   const [error, setError] = (0,react.useState)(false);
   const loadIndicatorRef = (0,react.useRef)(null);
@@ -969,12 +959,11 @@ var state_0 = __webpack_require__(62657);
 
 
 
-function WrappedCinePlayer(_ref) {
-  let {
-    enabledVPElement,
-    viewportId,
-    servicesManager
-  } = _ref;
+function WrappedCinePlayer({
+  enabledVPElement,
+  viewportId,
+  servicesManager
+}) {
   const {
     toolbarService,
     customizationService,
@@ -1264,11 +1253,10 @@ const OHIFCornerstoneViewport = /*#__PURE__*/react.memo(props => {
   (0,react.useEffect)(() => {
     const {
       unsubscribe
-    } = displaySetService.subscribe(displaySetService.EVENTS.DISPLAY_SET_SERIES_METADATA_INVALIDATED, async _ref => {
-      let {
-        displaySetInstanceUID: invalidatedDisplaySetInstanceUID,
-        invalidateData
-      } = _ref;
+    } = displaySetService.subscribe(displaySetService.EVENTS.DISPLAY_SET_SERIES_METADATA_INVALIDATED, async ({
+      displaySetInstanceUID: invalidatedDisplaySetInstanceUID,
+      invalidateData
+    }) => {
       if (!invalidateData) {
         return;
       }

package/dist/181.css

@@ -1,3 +1,3 @@
-.viewport-wrapper{height:100%;position:relative;width:100%}.cornerstone-viewport-element{background-color:#000;height:100%;outline:0!important;overflow:hidden;position:relative;width:100%}
+.cornerstone-viewport-element,.viewport-wrapper{height:100%;position:relative;width:100%}.cornerstone-viewport-element{background-color:#000;outline:0!important;overflow:hidden}
 .viewport-overlay{max-width:40%}.viewport-overlay span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewport-overlay.left-viewport{text-align:left}.viewport-overlay.right-viewport-scrollbar{text-align:right}.viewport-overlay.right-viewport-scrollbar .flex.flex-row{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}
 .ViewportOrientationMarkers{--marker-width:100px;--marker-height:100px;--scrollbar-width:20px;font-size:15px;line-height:18px;pointer-events:none}.ViewportOrientationMarkers .orientation-marker{position:absolute}.ViewportOrientationMarkers .top-mid{left:50%;top:.6rem}.ViewportOrientationMarkers .left-mid{left:5px;top:47%}.ViewportOrientationMarkers .right-mid{left:calc(100% - var(--marker-width) - var(--scrollbar-width));top:47%}.ViewportOrientationMarkers .bottom-mid{left:47%;top:calc(100% - var(--marker-height) - .6rem)}.ViewportOrientationMarkers .right-mid .orientation-marker-value{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;min-width:var(--marker-width)}.ViewportOrientationMarkers .bottom-mid .orientation-marker-value{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;min-height:var(--marker-height)}