highmark-cli 0.0.139 → 0.0.141

package/lib/view/{div/leaf.js → div.js}

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "default", {
 });
 var _easywithstyle = /*#__PURE__*/ _interop_require_default(require("easy-with-style"));
 var _easy = require("easy");
-var _constants = require("../../constants");
+var _constants = require("../constants");
 function _assert_this_initialized(self) {
     if (self === void 0) {
         throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
@@ -172,21 +172,21 @@ function _create_super(Derived) {
 }
 function _templateObject() {
     var data = _tagged_template_literal([
-        "\n\n  width: 100%;\n  min-height: 100%;\n  pointer-events: none;\n  transform-origin: top left;\n  \n"
+        "\n\n  width: 100%;\n  transform-origin: top left;\n  \n"
     ]);
     _templateObject = function _templateObject() {
         return data;
     };
     return data;
 }
-var LeafDiv = /*#__PURE__*/ function(Element) {
-    _inherits(LeafDiv, Element);
-    var _super = _create_super(LeafDiv);
-    function LeafDiv() {
-        _class_call_check(this, LeafDiv);
+var Div = /*#__PURE__*/ function(Element) {
+    _inherits(Div, Element);
+    var _super = _create_super(Div);
+    function Div() {
+        _class_call_check(this, Div);
         return _super.apply(this, arguments);
     }
-    _create_class(LeafDiv, [
+    _create_class(Div, [
         {
             key: "getBackgroundColour",
             value: function getBackgroundColour() {
@@ -194,24 +194,29 @@ var LeafDiv = /*#__PURE__*/ function(Element) {
                 return backgroundColour;
             }
         },
+        {
+            key: "isAdded",
+            value: function isAdded() {
+                var domElement = this.getDOMElement(), parentNode = domElement.parentNode, added = parentNode !== null;
+                return added;
+            }
+        },
         {
             key: "zoom",
             value: function zoom(zoom) {
-                var width = "".concat(100 / zoom, "%"), transform = "scale(".concat(zoom, ")");
+                var zoomRatio = 100 / zoom, width = "".concat(zoomRatio, "%"), minHeight = "".concat(zoomRatio, "%"), transform = "scale(".concat(zoom, ")");
                 var css = {
                     width: width,
+                    minHeight: minHeight,
                     transform: transform
                 };
                 this.css(css);
             }
         }
     ]);
-    return LeafDiv;
+    return Div;
 }(_wrap_native_super(_easy.Element));
-_define_property(LeafDiv, "tagName", "div");
-_define_property(LeafDiv, "defaultProperties", {
-    className: "leaf"
-});
-var _default = (0, _easywithstyle.default)(LeafDiv)(_templateObject());
+_define_property(Div, "tagName", "div");
+var _default = (0, _easywithstyle.default)(Div)(_templateObject());
 
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy92aWV3L2Rpdi9sZWFmLmpzIl0sInNvdXJjZXNDb250ZW50IjpbIlwidXNlIHN0cmljdFwiO1xuXG5pbXBvcnQgd2l0aFN0eWxlIGZyb20gXCJlYXN5LXdpdGgtc3R5bGVcIjsgIC8vL1xuXG5pbXBvcnQgeyBFbGVtZW50IH0gZnJvbSBcImVhc3lcIjtcblxuaW1wb3J0IHsgQkFDS0dST1VORF9DT0xPVVIgfSBmcm9tIFwiLi4vLi4vY29uc3RhbnRzXCI7XG5cbmNsYXNzIExlYWZEaXYgZXh0ZW5kcyBFbGVtZW50IHtcbiAgZ2V0QmFja2dyb3VuZENvbG91cigpIHtcbiAgICBjb25zdCBiYWNrZ3JvdW5kQ29sb3VyID0gdGhpcy5jc3MoQkFDS0dST1VORF9DT0xPVVIpIHx8IG51bGw7XG5cbiAgICByZXR1cm4gYmFja2dyb3VuZENvbG91cjtcbiAgfVxuXG4gIHpvb20oem9vbSkge1xuICAgIGNvbnN0IHdpZHRoID0gYCR7MTAwL3pvb219JWAsXG4gICAgICAgICAgdHJhbnNmb3JtID0gYHNjYWxlKCR7em9vbX0pYDtcblxuICAgIGNvbnN0IGNzcyA9IHtcbiAgICAgIHdpZHRoLFxuICAgICAgdHJhbnNmb3JtXG4gICAgfTtcblxuICAgIHRoaXMuY3NzKGNzcyk7XG4gIH1cblxuICBzdGF0aWMgdGFnTmFtZSA9IFwiZGl2XCI7XG5cbiAgc3RhdGljIGRlZmF1bHRQcm9wZXJ0aWVzID0ge1xuICAgIGNsYXNzTmFtZTogXCJsZWFmXCJcbiAgfTtcbn1cblxuZXhwb3J0IGRlZmF1bHQgd2l0aFN0eWxlKExlYWZEaXYpYFxuXG4gIHdpZHRoOiAxMDAlO1xuICBtaW4taGVpZ2h0OiAxMDAlO1xuICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgdHJhbnNmb3JtLW9yaWdpbjogdG9wIGxlZnQ7XG4gIFxuYDtcbiJdLCJuYW1lcyI6WyJMZWFmRGl2IiwiZ2V0QmFja2dyb3VuZENvbG91ciIsImJhY2tncm91bmRDb2xvdXIiLCJjc3MiLCJCQUNLR1JPVU5EX0NPTE9VUiIsInpvb20iLCJ3aWR0aCIsInRyYW5zZm9ybSIsIkVsZW1lbnQiLCJ0YWdOYW1lIiwiZGVmYXVsdFByb3BlcnRpZXMiLCJjbGFzc05hbWUiLCJ3aXRoU3R5bGUiXSwicmFuZ2VNYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OzsiLCJtYXBwaW5ncyI6IkFBQUE7Ozs7K0JBa0NBOzs7ZUFBQTs7O29FQWhDc0I7b0JBRUU7eUJBRVU7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFFbEMsSUFBQSxBQUFNQSx3QkFBRCxBQUFMO2NBQU1BOytCQUFBQTthQUFBQTtnQ0FBQUE7OztrQkFBQUE7O1lBQ0pDLEtBQUFBO21CQUFBQSxTQUFBQTtnQkFDRSxJQUFNQyxtQkFBbUIsSUFBSSxDQUFDQyxHQUFHLENBQUNDLDRCQUFpQixLQUFLO2dCQUV4RCxPQUFPRjtZQUNUOzs7WUFFQUcsS0FBQUE7bUJBQUFBLFNBQUFBLEtBQUtBLElBQUk7Z0JBQ1AsSUFBTUMsUUFBUSxBQUFDLEdBQVcsT0FBVCxNQUFJRCxNQUFLLE1BQ3BCRSxZQUFZLEFBQUMsU0FBYSxPQUFMRixNQUFLO2dCQUVoQyxJQUFNRixNQUFNO29CQUNWRyxPQUFBQTtvQkFDQUMsV0FBQUE7Z0JBQ0Y7Z0JBRUEsSUFBSSxDQUFDSixHQUFHLENBQUNBO1lBQ1g7OztXQWpCSUg7cUJBQWdCUSxhQUFPO0FBbUIzQixpQkFuQklSLFNBbUJHUyxXQUFVO0FBRWpCLGlCQXJCSVQsU0FxQkdVLHFCQUFvQjtJQUN6QkMsV0FBVztBQUNiO0lBR0YsV0FBZUMsSUFBQUEsc0JBQVMsRUFBQ1oifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy92aWV3L2Rpdi5qcyJdLCJzb3VyY2VzQ29udGVudCI6WyJcInVzZSBzdHJpY3RcIjtcblxuaW1wb3J0IHdpdGhTdHlsZSBmcm9tIFwiZWFzeS13aXRoLXN0eWxlXCI7ICAvLy9cblxuaW1wb3J0IHsgRWxlbWVudCB9IGZyb20gXCJlYXN5XCI7XG5cbmltcG9ydCB7IEJBQ0tHUk9VTkRfQ09MT1VSIH0gZnJvbSBcIi4uL2NvbnN0YW50c1wiO1xuXG5jbGFzcyBEaXYgZXh0ZW5kcyBFbGVtZW50IHtcbiAgZ2V0QmFja2dyb3VuZENvbG91cigpIHtcbiAgICBjb25zdCBiYWNrZ3JvdW5kQ29sb3VyID0gdGhpcy5jc3MoQkFDS0dST1VORF9DT0xPVVIpIHx8IG51bGw7XG5cbiAgICByZXR1cm4gYmFja2dyb3VuZENvbG91cjtcbiAgfVxuXG4gIGlzQWRkZWQoKSB7XG4gICAgY29uc3QgZG9tRWxlbWVudCA9IHRoaXMuZ2V0RE9NRWxlbWVudCgpLFxuICAgICAgICAgIHsgcGFyZW50Tm9kZSB9ID0gZG9tRWxlbWVudCxcbiAgICAgICAgICBhZGRlZCA9IChwYXJlbnROb2RlICE9PSBudWxsKTtcblxuICAgIHJldHVybiBhZGRlZDtcbiAgfVxuXG4gIHpvb20oem9vbSkge1xuICAgIGNvbnN0IHpvb21SYXRpbyA9IDEwMCAvIHpvb20sXG4gICAgICAgICAgd2lkdGggPSBgJHt6b29tUmF0aW99JWAsXG4gICAgICAgICAgbWluSGVpZ2h0ID0gYCR7em9vbVJhdGlvfSVgLFxuICAgICAgICAgIHRyYW5zZm9ybSA9IGBzY2FsZSgke3pvb219KWA7XG5cbiAgICBjb25zdCBjc3MgPSB7XG4gICAgICB3aWR0aCxcbiAgICAgIG1pbkhlaWdodCxcbiAgICAgIHRyYW5zZm9ybVxuICAgIH07XG5cbiAgICB0aGlzLmNzcyhjc3MpO1xuICB9XG5cbiAgc3RhdGljIHRhZ05hbWUgPSBcImRpdlwiO1xufVxuXG5leHBvcnQgZGVmYXVsdCB3aXRoU3R5bGUoRGl2KWBcblxuICB3aWR0aDogMTAwJTtcbiAgdHJhbnNmb3JtLW9yaWdpbjogdG9wIGxlZnQ7XG4gIFxuYDtcbiJdLCJuYW1lcyI6WyJEaXYiLCJnZXRCYWNrZ3JvdW5kQ29sb3VyIiwiYmFja2dyb3VuZENvbG91ciIsImNzcyIsIkJBQ0tHUk9VTkRfQ09MT1VSIiwiaXNBZGRlZCIsImRvbUVsZW1lbnQiLCJnZXRET01FbGVtZW50IiwicGFyZW50Tm9kZSIsImFkZGVkIiwiem9vbSIsInpvb21SYXRpbyIsIndpZHRoIiwibWluSGVpZ2h0IiwidHJhbnNmb3JtIiwiRWxlbWVudCIsInRhZ05hbWUiLCJ3aXRoU3R5bGUiXSwicmFuZ2VNYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OyIsIm1hcHBpbmdzIjoiQUFBQTs7OzsrQkF5Q0E7OztlQUFBOzs7b0VBdkNzQjtvQkFFRTt5QkFFVTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUVsQyxJQUFBLEFBQU1BLG9CQUFELEFBQUw7Y0FBTUE7K0JBQUFBO2FBQUFBO2dDQUFBQTs7O2tCQUFBQTs7WUFDSkMsS0FBQUE7bUJBQUFBLFNBQUFBO2dCQUNFLElBQU1DLG1CQUFtQixJQUFJLENBQUNDLEdBQUcsQ0FBQ0MsNEJBQWlCLEtBQUs7Z0JBRXhELE9BQU9GO1lBQ1Q7OztZQUVBRyxLQUFBQTttQkFBQUEsU0FBQUE7Z0JBQ0UsSUFBTUMsYUFBYSxJQUFJLENBQUNDLGFBQWEsSUFDL0IsQUFBRUMsYUFBZUYsV0FBZkUsWUFDRkMsUUFBU0QsZUFBZTtnQkFFOUIsT0FBT0M7WUFDVDs7O1lBRUFDLEtBQUFBO21CQUFBQSxTQUFBQSxLQUFLQSxJQUFJO2dCQUNQLElBQU1DLFlBQVksTUFBTUQsTUFDbEJFLFFBQVEsQUFBQyxHQUFZLE9BQVZELFdBQVUsTUFDckJFLFlBQVksQUFBQyxHQUFZLE9BQVZGLFdBQVUsTUFDekJHLFlBQVksQUFBQyxTQUFhLE9BQUxKLE1BQUs7Z0JBRWhDLElBQU1QLE1BQU07b0JBQ1ZTLE9BQUFBO29CQUNBQyxXQUFBQTtvQkFDQUMsV0FBQUE7Z0JBQ0Y7Z0JBRUEsSUFBSSxDQUFDWCxHQUFHLENBQUNBO1lBQ1g7OztXQTVCSUg7cUJBQVllLGFBQU87QUE4QnZCLGlCQTlCSWYsS0E4QkdnQixXQUFVO0lBR25CLFdBQWVDLElBQUFBLHNCQUFTLEVBQUNqQiJ9

package/lib/view.js

@@ -192,18 +192,36 @@ var View = /*#__PURE__*/ function(Element) {
         {
             key: "updateZoom",
             value: function updateZoom() {
-                this.updateMenuDivZoom();
-                this.updateOverlayDivZoom();
+                this.updateMenuZoom();
+                this.updateOverlayZoom();
+            }
+        },
+        {
+            key: "didMount",
+            value: function didMount() {
+                this.updateMenuZoom();
+                this.updateOverlayZoom();
+                this.updateOverlayColours();
+                this.updateNativeGestures();
+                this.updateFullScreenCheckboxDiv();
+                this.updateInvertColoursCheckboxDiv();
+                this.updateNativeGesturesCheckboxDiv();
+            }
+        },
+        {
+            key: "willUnmount",
+            value: function willUnmount() {
+            ///
             }
         },
         {
             key: "childElements",
             value: function childElements() {
-                var divDOMElement = this.properties.divDOMElement;
+                var divDOMElements = this.properties.divDOMElements;
                 return [
                     /*#__PURE__*/ React.createElement(_preloader.default, null),
                     /*#__PURE__*/ React.createElement(_overlay.default, {
-                        divDOMElement: divDOMElement
+                        divDOMElements: divDOMElements
                     }),
                     /*#__PURE__*/ React.createElement(_menu.default, null)
                 ];
@@ -221,11 +239,11 @@ var View = /*#__PURE__*/ function(Element) {
 }(_wrap_native_super(_element.default));
 _define_property(View, "tagName", "div");
 _define_property(View, "ignoredProperties", [
-    "divDOMElement"
+    "divDOMElements"
 ]);
 _define_property(View, "defaultProperties", {
     className: "view"
 });
 var _default = (0, _easywithstyle.default)(View)(_templateObject());
 
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy92aWV3LmpzIl0sInNvdXJjZXNDb250ZW50IjpbIlwidXNlIHN0cmljdFwiO1xuXG5pbXBvcnQgd2l0aFN0eWxlIGZyb20gXCJlYXN5LXdpdGgtc3R5bGVcIjsgIC8vL1xuXG5pbXBvcnQgRWxlbWVudCBmcm9tIFwiLi92aWV3L2VsZW1lbnRcIjtcbmltcG9ydCBNZW51RGl2IGZyb20gXCIuL3ZpZXcvZGl2L21lbnVcIjtcbmltcG9ydCBPdmVybGF5RGl2IGZyb20gXCIuL3ZpZXcvZGl2L292ZXJsYXlcIjtcbmltcG9ydCBQcmVsb2FkZXJEaXYgZnJvbSBcIi4vdmlldy9kaXYvcHJlbG9hZGVyXCI7XG5cbmNsYXNzIFZpZXcgZXh0ZW5kcyBFbGVtZW50IHtcbiAgdXBkYXRlWm9vbSgpIHtcbiAgICB0aGlzLnVwZGF0ZU1lbnVEaXZab29tKCk7XG4gICAgdGhpcy51cGRhdGVPdmVybGF5RGl2Wm9vbSgpO1xuICB9XG5cbiAgY2hpbGRFbGVtZW50cygpIHtcbiAgICBjb25zdCB7IGRpdkRPTUVsZW1lbnQgfSA9IHRoaXMucHJvcGVydGllcztcblxuICAgIHJldHVybiAoW1xuXG4gICAgICA8UHJlbG9hZGVyRGl2Lz4sXG4gICAgICA8T3ZlcmxheURpdiBkaXZET01FbGVtZW50PXtkaXZET01FbGVtZW50fSAvPixcbiAgICAgIDxNZW51RGl2Lz5cblxuICAgIF0pO1xuICB9XG5cbiAgaW5pdGlhbGlzZSgpIHtcbiAgICB0aGlzLmFzc2lnbkNvbnRleHQoKTtcblxuICAgIHRoaXMuc2hvdygpO1xuICB9XG5cbiAgc3RhdGljIHRhZ05hbWUgPSBcImRpdlwiO1xuXG4gIHN0YXRpYyBpZ25vcmVkUHJvcGVydGllcyA9IFtcbiAgICBcImRpdkRPTUVsZW1lbnRcIlxuICBdO1xuXG4gIHN0YXRpYyBkZWZhdWx0UHJvcGVydGllcyA9IHtcbiAgICBjbGFzc05hbWU6IFwidmlld1wiXG4gIH07XG59XG5cbmV4cG9ydCBkZWZhdWx0IHdpdGhTdHlsZShWaWV3KWBcblxuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICBhbGlnbi1pdGVtczogc3RyZXRjaDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBcbmA7XG4iXSwibmFtZXMiOlsiVmlldyIsInVwZGF0ZVpvb20iLCJ1cGRhdGVNZW51RGl2Wm9vbSIsInVwZGF0ZU92ZXJsYXlEaXZab29tIiwiY2hpbGRFbGVtZW50cyIsImRpdkRPTUVsZW1lbnQiLCJwcm9wZXJ0aWVzIiwiUHJlbG9hZGVyRGl2IiwiT3ZlcmxheURpdiIsIk1lbnVEaXYiLCJpbml0aWFsaXNlIiwiYXNzaWduQ29udGV4dCIsInNob3ciLCJFbGVtZW50IiwidGFnTmFtZSIsImlnbm9yZWRQcm9wZXJ0aWVzIiwiZGVmYXVsdFByb3BlcnRpZXMiLCJjbGFzc05hbWUiLCJ3aXRoU3R5bGUiXSwicmFuZ2VNYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OyIsIm1hcHBpbmdzIjoiQUFBQTs7OzsrQkE0Q0E7OztlQUFBOzs7b0VBMUNzQjs4REFFRjsyREFDQTs4REFDRztnRUFDRTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUV6QixJQUFBLEFBQU1BLHFCQUFELEFBQUw7Y0FBTUE7K0JBQUFBO2FBQUFBO2dDQUFBQTs7O2tCQUFBQTs7WUFDSkMsS0FBQUE7bUJBQUFBLFNBQUFBO2dCQUNFLElBQUksQ0FBQ0MsaUJBQWlCO2dCQUN0QixJQUFJLENBQUNDLG9CQUFvQjtZQUMzQjs7O1lBRUFDLEtBQUFBO21CQUFBQSxTQUFBQTtnQkFDRSxJQUFNLEFBQUVDLGdCQUFrQixJQUFJLENBQUNDLFVBQVUsQ0FBakNEO2dCQUVSLE9BQVE7a0NBRU4sb0JBQUNFLGtCQUFZO2tDQUNiLG9CQUFDQyxnQkFBVTt3QkFBQ0gsZUFBZUE7O2tDQUMzQixvQkFBQ0ksYUFBTztpQkFFVDtZQUNIOzs7WUFFQUMsS0FBQUE7bUJBQUFBLFNBQUFBO2dCQUNFLElBQUksQ0FBQ0MsYUFBYTtnQkFFbEIsSUFBSSxDQUFDQyxJQUFJO1lBQ1g7OztXQXRCSVo7cUJBQWFhLGdCQUFPO0FBd0J4QixpQkF4QkliLE1Bd0JHYyxXQUFVO0FBRWpCLGlCQTFCSWQsTUEwQkdlLHFCQUFvQjtJQUN6QjtDQUNEO0FBRUQsaUJBOUJJZixNQThCR2dCLHFCQUFvQjtJQUN6QkMsV0FBVztBQUNiO0lBR0YsV0FBZUMsSUFBQUEsc0JBQVMsRUFBQ2xCIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy92aWV3LmpzIl0sInNvdXJjZXNDb250ZW50IjpbIlwidXNlIHN0cmljdFwiO1xuXG5pbXBvcnQgd2l0aFN0eWxlIGZyb20gXCJlYXN5LXdpdGgtc3R5bGVcIjsgIC8vL1xuXG5pbXBvcnQgRWxlbWVudCBmcm9tIFwiLi92aWV3L2VsZW1lbnRcIjtcbmltcG9ydCBNZW51RGl2IGZyb20gXCIuL3ZpZXcvZGl2L21lbnVcIjtcbmltcG9ydCBPdmVybGF5RGl2IGZyb20gXCIuL3ZpZXcvZGl2L292ZXJsYXlcIjtcbmltcG9ydCBQcmVsb2FkZXJEaXYgZnJvbSBcIi4vdmlldy9kaXYvcHJlbG9hZGVyXCI7XG5cbmNsYXNzIFZpZXcgZXh0ZW5kcyBFbGVtZW50IHtcbiAgdXBkYXRlWm9vbSgpIHtcbiAgICB0aGlzLnVwZGF0ZU1lbnVab29tKCk7XG4gICAgdGhpcy51cGRhdGVPdmVybGF5Wm9vbSgpO1xuICB9XG5cbiAgZGlkTW91bnQoKSB7XG4gICAgdGhpcy51cGRhdGVNZW51Wm9vbSgpO1xuICAgIHRoaXMudXBkYXRlT3ZlcmxheVpvb20oKTtcbiAgICB0aGlzLnVwZGF0ZU92ZXJsYXlDb2xvdXJzKCk7XG4gICAgdGhpcy51cGRhdGVOYXRpdmVHZXN0dXJlcygpO1xuICAgIHRoaXMudXBkYXRlRnVsbFNjcmVlbkNoZWNrYm94RGl2KCk7XG4gICAgdGhpcy51cGRhdGVJbnZlcnRDb2xvdXJzQ2hlY2tib3hEaXYoKTtcbiAgICB0aGlzLnVwZGF0ZU5hdGl2ZUdlc3R1cmVzQ2hlY2tib3hEaXYoKTtcbiAgfVxuXG4gIHdpbGxVbm1vdW50KCkge1xuICAgIC8vL1xuICB9XG5cbiAgY2hpbGRFbGVtZW50cygpIHtcbiAgICBjb25zdCB7IGRpdkRPTUVsZW1lbnRzIH0gPSB0aGlzLnByb3BlcnRpZXM7XG5cbiAgICByZXR1cm4gKFtcblxuICAgICAgPFByZWxvYWRlckRpdi8+LFxuICAgICAgPE92ZXJsYXlEaXYgZGl2RE9NRWxlbWVudHM9e2RpdkRPTUVsZW1lbnRzfSAvPixcbiAgICAgIDxNZW51RGl2Lz5cblxuICAgIF0pO1xuICB9XG5cbiAgaW5pdGlhbGlzZSgpIHtcbiAgICB0aGlzLmFzc2lnbkNvbnRleHQoKTtcblxuICAgIHRoaXMuc2hvdygpO1xuICB9XG5cbiAgc3RhdGljIHRhZ05hbWUgPSBcImRpdlwiO1xuXG4gIHN0YXRpYyBpZ25vcmVkUHJvcGVydGllcyA9IFtcbiAgICBcImRpdkRPTUVsZW1lbnRzXCJcbiAgXTtcblxuICBzdGF0aWMgZGVmYXVsdFByb3BlcnRpZXMgPSB7XG4gICAgY2xhc3NOYW1lOiBcInZpZXdcIlxuICB9O1xufVxuXG5leHBvcnQgZGVmYXVsdCB3aXRoU3R5bGUoVmlldylgXG5cbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogMTAwJTtcbiAgYWxpZ24taXRlbXM6IHN0cmV0Y2g7XG4gIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgXG5gO1xuIl0sIm5hbWVzIjpbIlZpZXciLCJ1cGRhdGVab29tIiwidXBkYXRlTWVudVpvb20iLCJ1cGRhdGVPdmVybGF5Wm9vbSIsImRpZE1vdW50IiwidXBkYXRlT3ZlcmxheUNvbG91cnMiLCJ1cGRhdGVOYXRpdmVHZXN0dXJlcyIsInVwZGF0ZUZ1bGxTY3JlZW5DaGVja2JveERpdiIsInVwZGF0ZUludmVydENvbG91cnNDaGVja2JveERpdiIsInVwZGF0ZU5hdGl2ZUdlc3R1cmVzQ2hlY2tib3hEaXYiLCJ3aWxsVW5tb3VudCIsImNoaWxkRWxlbWVudHMiLCJkaXZET01FbGVtZW50cyIsInByb3BlcnRpZXMiLCJQcmVsb2FkZXJEaXYiLCJPdmVybGF5RGl2IiwiTWVudURpdiIsImluaXRpYWxpc2UiLCJhc3NpZ25Db250ZXh0Iiwic2hvdyIsIkVsZW1lbnQiLCJ0YWdOYW1lIiwiaWdub3JlZFByb3BlcnRpZXMiLCJkZWZhdWx0UHJvcGVydGllcyIsImNsYXNzTmFtZSIsIndpdGhTdHlsZSJdLCJyYW5nZU1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7IiwibWFwcGluZ3MiOiJBQUFBOzs7OytCQTBEQTs7O2VBQUE7OztvRUF4RHNCOzhEQUVGOzJEQUNBOzhEQUNHO2dFQUNFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBRXpCLElBQUEsQUFBTUEscUJBQUQsQUFBTDtjQUFNQTsrQkFBQUE7YUFBQUE7Z0NBQUFBOzs7a0JBQUFBOztZQUNKQyxLQUFBQTttQkFBQUEsU0FBQUE7Z0JBQ0UsSUFBSSxDQUFDQyxjQUFjO2dCQUNuQixJQUFJLENBQUNDLGlCQUFpQjtZQUN4Qjs7O1lBRUFDLEtBQUFBO21CQUFBQSxTQUFBQTtnQkFDRSxJQUFJLENBQUNGLGNBQWM7Z0JBQ25CLElBQUksQ0FBQ0MsaUJBQWlCO2dCQUN0QixJQUFJLENBQUNFLG9CQUFvQjtnQkFDekIsSUFBSSxDQUFDQyxvQkFBb0I7Z0JBQ3pCLElBQUksQ0FBQ0MsMkJBQTJCO2dCQUNoQyxJQUFJLENBQUNDLDhCQUE4QjtnQkFDbkMsSUFBSSxDQUFDQywrQkFBK0I7WUFDdEM7OztZQUVBQyxLQUFBQTttQkFBQUEsU0FBQUE7WUFDRSxHQUFHO1lBQ0w7OztZQUVBQyxLQUFBQTttQkFBQUEsU0FBQUE7Z0JBQ0UsSUFBTSxBQUFFQyxpQkFBbUIsSUFBSSxDQUFDQyxVQUFVLENBQWxDRDtnQkFFUixPQUFRO2tDQUVOLG9CQUFDRSxrQkFBWTtrQ0FDYixvQkFBQ0MsZ0JBQVU7d0JBQUNILGdCQUFnQkE7O2tDQUM1QixvQkFBQ0ksYUFBTztpQkFFVDtZQUNIOzs7WUFFQUMsS0FBQUE7bUJBQUFBLFNBQUFBO2dCQUNFLElBQUksQ0FBQ0MsYUFBYTtnQkFFbEIsSUFBSSxDQUFDQyxJQUFJO1lBQ1g7OztXQXBDSW5CO3FCQUFhb0IsZ0JBQU87QUFzQ3hCLGlCQXRDSXBCLE1Bc0NHcUIsV0FBVTtBQUVqQixpQkF4Q0lyQixNQXdDR3NCLHFCQUFvQjtJQUN6QjtDQUNEO0FBRUQsaUJBNUNJdEIsTUE0Q0d1QixxQkFBb0I7SUFDekJDLFdBQVc7QUFDYjtJQUdGLFdBQWVDLElBQUFBLHNCQUFTLEVBQUN6QiJ9

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "highmark-cli",
   "author": "James Smith",
-  "version": "0.0.139",
+  "version": "0.0.141",
   "license": "MIT, Anti-996",
   "homepage": "https://github.com/djalbat/highmark-cli",
   "description": "Extensible, styleable Markdown.",
@@ -13,7 +13,7 @@
     "argumentative": "^2.0.28",
     "express": "^4.19.2",
     "highmark-fonts": "^1.0.36",
-    "highmark-markdown": "^0.0.228",
+    "highmark-markdown": "^0.0.229",
     "lively-cli": "^2.0.59",
     "necessary": "^13.6.1",
     "occam-entities": "^1.0.90"
@@ -24,6 +24,7 @@
     "easy-layout": "^6.0.145",
     "easy-with-style": "^3.0.349",
     "esbuild": "^0.9.2",
+    "fragmented": "^2.1.1",
     "juxtapose": "^4.0.81",
     "sufficient": "^2.0.55",
     "watchful-cli": "^1.7.44"

package/src/client.js

@@ -11,22 +11,25 @@ import View from "./view";
 import createMethods from "./createMethods";
 
 import { setOrientation } from "./state";
-import { DIV_SELECTOR, LOADING_DIV_SELECTOR } from "./selectors";
+import { DIVS_SELECTOR, LOADING_DIV_SELECTOR } from "./selectors";
 import { getOrientation, onOrientationChange } from "./utilities/orientation";
 
-const { renderStyles } = withStyle;
+const { renderStyles } = withStyle,
+      { onFragmentChange } = fragment;
 
 renderStyles();
 
-const divDOMElement = document.querySelector(DIV_SELECTOR);
+const divDOMElements = [ ...document.querySelectorAll(DIVS_SELECTOR) ];  ///
 
-divDOMElement.remove();
+divDOMElements.forEach((divDOMElement) => {
+  divDOMElement.remove();
+});
 
 const scheduler = null,
       model = null,
       view =
 
-        <View divDOMElement={divDOMElement} />
+        <View divDOMElements={divDOMElements} />
 
       ;
 
@@ -41,6 +44,8 @@ onOrientationChange((orientation) => {
   view.updateZoom();
 });
 
+
+
 getOrientation((orientation) => {
   setOrientation(orientation);
 

package/src/constants.js

@@ -5,14 +5,13 @@ export const { PI } = Math;
 export const GRID = "grid";
 export const STATE_KEY = "state";
 export const TAP_DELAY = 250;
-export const ZOOM_RATIO = 1.1;
 export const PI_OVER_TWO = PI / 2;
 export const SCROLL_DELAY = 10;
 export const DECELERATION = 0.0333333;
-export const SINGLE_SPACE = " ";
 export const UP_DIRECTION = +1;
 export const DOWN_DIRECTION = -1;
 export const MAXIMUM_SPREAD = PI / 4;
+export const MENU_ZOOM_RATIO = 1.1;
 export const MAXIMUM_TAP_TIME = 125;
 export const BACKGROUND_COLOUR = "background-color"; ///
 export const MINIMUM_SWIPE_SPEED = 1;

package/src/createMethods.js

@@ -1,5 +1,8 @@
 "use strict";
 
+import { MENU_ZOOM_RATIO } from "./constants";
+import { getMenuZoom, setMenuZoom, setOverlayZoom, setColoursInverted, setNativeGesturesRestored } from "./state";
+
 export default function createMethods(scheduler, model, view) {
   function openMenu() {
     view.openMenu();
@@ -10,43 +13,77 @@ export default function createMethods(scheduler, model, view) {
   }
 
   function zoomMenuIn() {
-    view.zoomMenuIn();
+    let menuZoom = getMenuZoom();
+
+    menuZoom *= MENU_ZOOM_RATIO;
+
+    setMenuZoom(menuZoom);
+
+    view.updateMenuZoom();
   }
 
   function zoomMenuOut() {
-    view.zoomMenuOut();
+    let menuZoom = getMenuZoom();
+
+    menuZoom /= MENU_ZOOM_RATIO;
+
+    setMenuZoom(menuZoom);
+
+    view.updateMenuZoom();
+  }
+
+  function zoomOverlay(overlayZoom) {
+    setOverlayZoom(overlayZoom);
+
+    view.updateOverlayZoom();
   }
 
   function invertColours() {
-    view.invertColours();
+    const coloursInverted = true;
+
+    setColoursInverted(coloursInverted);
+
+    view.updateOverlayColours();
   }
 
   function revertColours() {
-    view.revertColours();
+    const coloursInverted = false;
+
+    setColoursInverted(coloursInverted);
+
+    view.updateOverlayColours();
   }
 
   function exitFullScreen() {
     view.exitFullScreen();
+
+    view.updateFullScreenCheckboxDiv();
   }
 
   function enterFullScreen() {
-    view.enterFullScreen();
+    view.enterFullScreen(() => {
+      view.updateFullScreenCheckboxDiv();
+    });
   }
 
   function restoreNativeGestures() {
-    view.restoreNativeGestures();
+    const nativeGesturesRestored = true;
+
+    setNativeGesturesRestored(nativeGesturesRestored);
+
+    view.updateNativeGestures();
+
+    view.updateNativeGesturesCheckboxDiv();
   }
 
   function suppressNativeGestures() {
-    view.suppressNativeGestures();
-  }
+    const nativeGesturesRestored = false;
 
-  function checkRestoreNativeGesturesCheckbox(checked) {
-    view.checkRestoreNativeGesturesCheckbox(checked);
-  }
+    setNativeGesturesRestored(nativeGesturesRestored);
+
+    view.updateNativeGestures();
 
-  function uncheckRestoreNativeGesturesCheckbox(checked) {
-    view.uncheckRestoreNativeGesturesCheckbox(checked);
+    view.updateNativeGesturesCheckboxDiv();
   }
 
   return ({
@@ -54,13 +91,12 @@ export default function createMethods(scheduler, model, view) {
     closeMenu,
     zoomMenuIn,
     zoomMenuOut,
+    zoomOverlay,
     invertColours,
     revertColours,
     exitFullScreen,
     enterFullScreen,
     restoreNativeGestures,
-    suppressNativeGestures,
-    checkRestoreNativeGesturesCheckbox,
-    uncheckRestoreNativeGesturesCheckbox
+    suppressNativeGestures
   });
 }

package/src/localStorage.js

@@ -2,23 +2,25 @@
 
 import { STATE_KEY, LANDSCAPE_ORIENTATION, PORTRAIT_ORIENTATION } from "./constants";
 
-const viewZoom = {
+const menuZoom = {
         [PORTRAIT_ORIENTATION]: 1,
         [LANDSCAPE_ORIENTATION]: 1
       },
-      menuDivZoom = {
+      overlayZoom = {
         [PORTRAIT_ORIENTATION]: 1,
         [LANDSCAPE_ORIENTATION]: 1
       },
-      fullScreenViewZoom = {
+      fullScreenOverlayZoom = {
         [PORTRAIT_ORIENTATION]: 1,
         [LANDSCAPE_ORIENTATION]: 1
       },
       coloursInverted = false,
+      nativeGesturesRestored = false,
       defaultPersistentState = {
-        viewZoom,
-        menuDivZoom,
-        fullScreenViewZoom,
+        menuZoom,
+        overlayZoom,
+        fullScreenOverlayZoom,
+        nativeGesturesRestored,
         coloursInverted
       };
 
@@ -46,3 +48,4 @@ export function setPersistentState(persistentState) {
 
   localStorage.setItem(key, value);
 }
+

package/src/mixins/fullsrean.js

@@ -16,13 +16,12 @@ function exitFullScreen() {
   document.exitFullscreen();
 }
 
-function requestFullScreen() {
+function requestFullScreen(callback) {
   const domElement = this.getDOMElement();
 
   domElement.requestFullscreen()
-    .catch((error) => {
-      alert(error);
-    });
+    .then(callback)
+    .catch(alert);
 }
 
 function onFullscreenchange(fullscreenchangeHandler) {

package/src/selectors.js

@@ -1,5 +1,4 @@
 "use strict";
 
-export const DIV_SELECTOR = "body > div:not(.loading)"; ///
-export const DIVS_SELECTOR = "div"; ///
+export const DIVS_SELECTOR = "body > div:not(.loading)"; ///
 export const LOADING_DIV_SELECTOR = "body > div.loading";

package/src/state.js

@@ -2,95 +2,112 @@
 
 import { isFullScreen } from "./utilities/fullScreen";
 import { getPersistentState, setPersistentState } from "./localStorage";
-import {PORTRAIT_ORIENTATION} from "./constants";
 
 const orientation = null,
       state = {
         orientation
       };
 
-export function getViewZoom() {
-  stateFromPersistentState();
+export function getOrientation() {
+  const { orientation } = state;
 
-  const fullScreen = isFullScreen(),
-        orientation = getOrientation();
+  return orientation;
+}
 
-  let viewZoom;
+export function setOrientation(orientation) {
+  Object.assign(state, {
+    orientation
+  });
+}
 
-  if (fullScreen) {
-    ({ fullScreenViewZoom: viewZoom } = state);
-  } else {
-    ({ viewZoom } = state);
-  }
+export function getMenuZoom() {
+  stateFromPersistentState();
 
-  const orientedViewZoom = viewZoom[orientation]; ///
+  let menuZoom;
 
-  viewZoom = orientedViewZoom;  ///
+  ({ menuZoom } = state);
 
-  return viewZoom;
+  const { orientation } = state,
+        orientedMenuZoom = menuZoom[orientation]; ///
+
+  menuZoom = orientedMenuZoom;  ///
+
+  return menuZoom;
 }
 
-export function setViewZoom(viewZoom) {
+export function setMenuZoom(menuZoom) {
   stateFromPersistentState();
 
-  const fullScreen = isFullScreen(),
-        orientation = getOrientation();
-
-  const orientedViewZoom = viewZoom;  ///
+  const { orientation } = state,
+        orientedMenuZoom = menuZoom;  ///
 
-  if (fullScreen) {
-    ({ fullScreenViewZoom: viewZoom } = state);
-  } else {
-    ({ viewZoom } = state);
-  }
+  ({ menuZoom } = state);
 
-  Object.assign(viewZoom, {
-    [orientation]: orientedViewZoom
+  Object.assign(menuZoom, {
+    [orientation]: orientedMenuZoom
   });
 
   stateToPersistentState();
 }
 
-export function getMenuDivZoom() {
+export function getOverlayZoom() {
   stateFromPersistentState();
 
-  let menuDivZoom;
+  const fullScreen = isFullScreen(),
+        orientation = getOrientation();
 
-  ({ menuDivZoom } = state);
+  let overlayZoom;
 
-  const { orientation } = state,
-        orientedMenuDivZoom = menuDivZoom[orientation]; ///
+  if (fullScreen) {
+    ({ fullScreenOverlayZoom: overlayZoom } = state);
+  } else {
+    ({ overlayZoom } = state);
+  }
+
+  const orientedOverlayZoom = overlayZoom[orientation]; ///
 
-  menuDivZoom = orientedMenuDivZoom;  ///
+  overlayZoom = orientedOverlayZoom;  ///
 
-  return menuDivZoom;
+  return overlayZoom;
 }
 
-export function setMenuDivZoom(menuDivZoom) {
+export function setOverlayZoom(overlayZoom) {
   stateFromPersistentState();
 
-  const { orientation } = state,
-        orientedMenuDivZoom = menuDivZoom;  ///
+  const fullScreen = isFullScreen(),
+        orientation = getOrientation();
 
-  ({ menuDivZoom } = state);
+  const orientedOverlayZoom = overlayZoom;  ///
 
-  Object.assign(menuDivZoom, {
-    [orientation]: orientedMenuDivZoom
+  if (fullScreen) {
+    ({ fullScreenOverlayZoom: overlayZoom } = state);
+  } else {
+    ({ overlayZoom } = state);
+  }
+
+  Object.assign(overlayZoom, {
+    [orientation]: orientedOverlayZoom
   });
 
   stateToPersistentState();
 }
 
-export function getOrientation() {
-  const { orientation } = state;
+export function areNativeGesturesRestored() {
+  stateFromPersistentState();
 
-  return orientation;
+  const { nativeGesturesRestored } = state;
+
+  return nativeGesturesRestored;
 }
 
-export function setOrientation(orientation) {
+export function setNativeGesturesRestored(nativeGesturesRestored) {
+  stateFromPersistentState();
+
   Object.assign(state, {
-    orientation
+    nativeGesturesRestored
   });
+
+  stateToPersistentState();
 }
 
 export function areColoursInverted() {
@@ -112,11 +129,12 @@ export function setColoursInverted(coloursInverted) {
 }
 
 function stateToPersistentState() {
-  const { viewZoom, menuDivZoom, fullScreenViewZoom, coloursInverted } = state,
+  const { menuZoom, overlayZoom, fullScreenOverlayZoom, nativeGesturesRestored, coloursInverted } = state,
         persistentState = {
-          viewZoom,
-          menuDivZoom,
-          fullScreenViewZoom,
+          menuZoom,
+          overlayZoom,
+          fullScreenOverlayZoom,
+          nativeGesturesRestored,
           coloursInverted
         };
 

package/src/utilities/element.js

@@ -1,7 +1,5 @@
 "use strict";
 
-import { SINGLE_SPACE } from "../constants";
-
 export function elementsFromDOMElements(domElements, Element) {
   const elements = domElements.map((domElement) => {
     const element = elementFromDOMElement(domElement, Element);
@@ -13,22 +11,14 @@ export function elementsFromDOMElements(domElements, Element) {
 }
 
 export function elementFromDOMElement(domElement, Element) {
-  const element = <Element/>;
+  const element =
 
-  const { domElement: temporaryDOMElement } = element,
-        { className: classNamesString } = temporaryDOMElement,
-        classNames = classNamesString.split(SINGLE_SPACE);
+          <Element/>
 
-  const { classList } = domElement,
-        { childNodes } = temporaryDOMElement;
+        ,
+        className = classNameFromElement(element);
 
-  childNodes.forEach((childNode) => {
-    domElement.appendChild(childNode);
-  });
-
-  classNames.forEach((className) => {
-    classList.add(className);
-  });
+  addClassNameToDOMElement(domElement, className)
 
   element.domElement = domElement;  ///
 
@@ -36,3 +26,16 @@ export function elementFromDOMElement(domElement, Element) {
 
   return element;
 }
+
+function classNameFromElement(element) {
+  const domElement = element.getDOMElement(),
+        { className } = domElement;
+
+  return className;
+}
+
+function addClassNameToDOMElement(domElement, className) {
+  const { classList } = domElement;
+
+  classList.add(className);
+}

package/src/view/div/buttons.js

@@ -4,7 +4,6 @@ import withStyle from "easy-with-style";  ///
 
 import Element from "../element";
 import CloseMenuButton from "../button/closeMenu";
-import FullScreenButton from "../button/fullScreen";
 import ZoomMenuInButton from "../button/zoomMenuIn";
 import ZoomMenuOutButton from "../button/zoomMenuOut";
 
@@ -14,10 +13,9 @@ class ButtonsDiv extends Element {
   childElements() {
     return ([
 
-      <ZoomMenuInButton/>,
-      <CloseMenuButton/>,
       <ZoomMenuOutButton/>,
-      <FullScreenButton/>
+      <ZoomMenuInButton/>,
+      <CloseMenuButton/>
 
     ]);
   }
@@ -33,7 +31,7 @@ export default withStyle(ButtonsDiv)`
 
   gap: ${buttonsDivGap};
   display: grid;
-  grid-template-rows: min-content min-content;
-  grid-template-columns: min-content min-content;
+  grid-template-rows: min-content;
+  grid-template-columns: min-content min-content min-content;
   
 `;