easy-layout 5.1.32 → 6.0.3

package/src/div/splitter/horizontal.js

@@ -15,11 +15,11 @@ class HorizontalSplitter extends Splitter {
     const disabled = this.isDisabled();
 
     if (!disabled) {
-      const sizeableElement = this.getSizeableElement(),
-            sizeableElementHeight = sizeableElement.getHeight(),
-            previousSizeableElementHeight = sizeableElementHeight;  ///
+      const sizeableDiv = this.getSizeableDiv(),
+            sizeableDivHeight = sizeableDiv.getHeight(),
+            previousSizeableDivHeight = sizeableDivHeight;  ///
 
-      this.setPreviousSizeableElementHeight(previousSizeableElementHeight);
+      this.setPreviousSizeableDivHeight(previousSizeableDivHeight);
     }
 
     this.setCursor();
@@ -30,12 +30,12 @@ class HorizontalSplitter extends Splitter {
 
     if (!disabled) {
       const direction = this.getDirection(),
-            sizeableElement = this.getSizeableElement(),
-            previousSizeableElementHeight = this.getPreviousSizeableElementHeight(),
-            sizeableElementHeight = previousSizeableElementHeight - direction * relativeMouseTop,
-            height = sizeableElementHeight; ///
+            sizeableDiv = this.getSizeableDiv(),
+            previousSizeableDivHeight = this.getPreviousSizeableDivHeight(),
+            sizeableDivHeight = previousSizeableDivHeight - direction * relativeMouseTop,
+            height = sizeableDivHeight; ///
 
-      sizeableElement.setHeight(height);
+      sizeableDiv.setHeight(height);
     }
   }
 
@@ -47,24 +47,24 @@ class HorizontalSplitter extends Splitter {
     }
   }
 
-  getPreviousSizeableElementHeight() {
+  getPreviousSizeableDivHeight() {
     const state = this.getState(),
-          { previousSizeableElementHeight } = state;
+          { previousSizeableDivHeight } = state;
 
-    return previousSizeableElementHeight;
+    return previousSizeableDivHeight;
   }
 
-  setPreviousSizeableElementHeight(previousSizeableElementHeight) {
+  setPreviousSizeableDivHeight(previousSizeableDivHeight) {
     this.updateState({
-      previousSizeableElementHeight
+      previousSizeableDivHeight
     });
   }
 
   setInitialState() {
-    const previousSizeableElementHeight = null;
+    const previousSizeableDivHeight = null;
 
     this.setState({
-      previousSizeableElementHeight
+      previousSizeableDivHeight
     });
   }
 

package/src/div/splitter/vertical.js

@@ -15,11 +15,11 @@ class VerticalSplitter extends Splitter {
     const disabled = this.isDisabled();
 
     if (!disabled) {
-      const sizeableElement = this.getSizeableElement(),
-            sizeableElementWidth = sizeableElement.getWidth(),
-            previousSizeableElementWidth = sizeableElementWidth;  ///
+      const sizeableDiv = this.getSizeableDiv(),
+            sizeableDivWidth = sizeableDiv.getWidth(),
+            previousSizeableDivWidth = sizeableDivWidth;  ///
 
-      this.setPreviousSizeableElementWidth(previousSizeableElementWidth);
+      this.setPreviousSizeableDivWidth(previousSizeableDivWidth);
     }
 
     this.setCursor();
@@ -30,12 +30,12 @@ class VerticalSplitter extends Splitter {
 
     if (!disabled) {
       const direction = this.getDirection(),
-            sizeableElement = this.getSizeableElement(),
-            previousSizeableElementWidth = this.getPreviousSizeableElementWidth(),
-            sizeableElementWidth = previousSizeableElementWidth - direction * relativeMouseLeft,
-            width = sizeableElementWidth; ///
+            sizeableDiv = this.getSizeableDiv(),
+            previousSizeableDivWidth = this.getPreviousSizeableDivWidth(),
+            sizeableDivWidth = previousSizeableDivWidth - direction * relativeMouseLeft,
+            width = sizeableDivWidth; ///
 
-      sizeableElement.setWidth(width);
+      sizeableDiv.setWidth(width);
     }
   }
 
@@ -47,24 +47,24 @@ class VerticalSplitter extends Splitter {
     }
   }
 
-  getPreviousSizeableElementWidth() {
+  getPreviousSizeableDivWidth() {
     const state = this.getState(),
-          { previousSizeableElementWidth } = state;
+          { previousSizeableDivWidth } = state;
 
-    return previousSizeableElementWidth;
+    return previousSizeableDivWidth;
   }
 
-  setPreviousSizeableElementWidth(previousSizeableElementWidth) {
+  setPreviousSizeableDivWidth(previousSizeableDivWidth) {
     this.updateState({
-      previousSizeableElementWidth
+      previousSizeableDivWidth
     });
   }
 
   setInitialState() {
-    const previousSizeableElementWidth = null;
+    const previousSizeableDivWidth = null;
 
     this.setState({
-      previousSizeableElementWidth
+      previousSizeableDivWidth
     });
   }
 

package/src/div/splitter.js

@@ -6,7 +6,6 @@ import { Element } from "easy";
 import { dragMixins } from "easy-drag-and-drop";
 
 import SizeableDiv from "../div/sizeable";
-import SizeableSection from "../section/sizeable";
 
 import { resetCursor } from "../cursor";
 
@@ -21,23 +20,23 @@ class SplitterDiv extends Element {
     resetCursor();
   }
 
-  getSizeableElement() {
-    let sizeableElement;
+  getSizeableDiv() {
+    let sizeableDiv;
 
     const nextSiblingElement = this.getNextSiblingElement(),
           previousSiblingElement = this.getPreviousSiblingElement(),
-          nextSiblingElementSizeableElement = isElementSizeableElement(nextSiblingElement),
-          previousSiblingElementSizeableElement = isElementSizeableElement(previousSiblingElement);
+          nextSiblingElementSizeableDiv = (nextSiblingElement instanceof SizeableDiv),
+          previousSiblingElementSizeableDiv = (previousSiblingElement instanceof SizeableDiv);
 
-    if (nextSiblingElementSizeableElement) {
-      sizeableElement = nextSiblingElement; ///
+    if (nextSiblingElementSizeableDiv) {
+      sizeableDiv = nextSiblingElement; ///
     }
 
-    if (previousSiblingElementSizeableElement) {
-      sizeableElement = previousSiblingElement; ///
+    if (previousSiblingElementSizeableDiv) {
+      sizeableDiv = previousSiblingElement; ///
     }
 
-    return sizeableElement;
+    return sizeableDiv;
   }
 
   getDirection() {
@@ -45,14 +44,14 @@ class SplitterDiv extends Element {
 
     const nextSiblingElement = this.getNextSiblingElement(),
           previousSiblingElement = this.getPreviousSiblingElement(),
-          nextSiblingElementSizeableElement = isElementSizeableElement(nextSiblingElement),
-          previousSiblingElementSizeableElement = isElementSizeableElement(previousSiblingElement);
+          nextSiblingElementSizeableDiv = (nextSiblingElement instanceof SizeableDiv),
+          previousSiblingElementSizeableDiv = (previousSiblingElement instanceof SizeableDiv);
 
-    if (nextSiblingElementSizeableElement) {
+    if (nextSiblingElementSizeableDiv) {
       direction = +1;
     }
 
-    if (previousSiblingElementSizeableElement) {
+    if (previousSiblingElementSizeableDiv) {
       direction = -1;
     }
 
@@ -132,9 +131,3 @@ export default withStyle(SplitterDiv)`
   flex-shrink: 0;
 
 `;
-
-function isElementSizeableElement(element) {
-  const elementSizeableElement = (element instanceof SizeableDiv) || (element instanceof SizeableSection);
-
-  return elementSizeableElement;
-}

package/src/example/div/column/middle.js

@@ -0,0 +1,17 @@
+"use strict";
+
+import withStyle from "easy-with-style";  ///
+
+import { ColumnDiv } from "../../../index"; ///
+
+class MiddleColumnDiv extends ColumnDiv {
+  static defaultProperties = {
+    className: "middle"
+  };
+}
+
+export default withStyle(MiddleColumnDiv)`
+
+  position: relative;
+  
+`;

package/src/example/div/sizeable/bottom.js

@@ -13,6 +13,5 @@ class BottomSizeableDiv extends SizeableDiv {
 export default withStyle(BottomSizeableDiv)`
 
   height: 24rem;
-  min-height: 12rem;
 
 `;

package/src/example/section/text.js

@@ -0,0 +1,38 @@
+"use strict";
+
+import withStyle from "easy-with-style";  ///
+
+const TextSection = (properties) => {
+  const { className } = properties;
+
+  return (
+
+    <section className={`${className} text`}>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam fermentum mauris vitae sem ultrices commodo. Pellentesque dui justo, fermentum quis vestibulum id, molestie vel leo. Maecenas vel consequat sem. Sed a maximus enim. Aenean quis mi sit amet quam sodales consequat. Aliquam justo arcu, lacinia et ultrices sit amet, rutrum id nisi. Suspendisse nec consectetur ante, sed hendrerit augue. Morbi viverra metus id turpis porttitor pellentesque. Donec pretium ex eget urna molestie, eget semper lacus dignissim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam pharetra nunc ac mauris tristique sagittis.
+      </p>
+      <p>
+        Curabitur blandit interdum dolor sed ultrices. Nunc pellentesque aliquet maximus. Suspendisse pellentesque dapibus accumsan. Sed at ipsum eget dolor consectetur vehicula. Quisque ornare eros id tincidunt interdum. Sed pulvinar, turpis sodales volutpat gravida, purus magna hendrerit purus, nec maximus arcu dui ac nisl. Quisque ac pellentesque risus.
+      </p>
+      <p>
+        Nulla ut justo ut nunc eleifend ultricies volutpat vel ex. Fusce quis velit lacus. Proin sagittis semper erat. Duis ut magna eget justo vulputate facilisis. Phasellus ultrices eleifend justo, ut faucibus lectus rutrum id. In pretium porta faucibus. Praesent vehicula ornare justo, sed mattis risus cursus at.
+      </p>
+      <p>
+        Fusce at bibendum nunc, eleifend consectetur sem. Fusce at elit augue. Sed lectus odio, pulvinar sed pharetra et, pharetra sed dolor. Morbi sodales sem odio, a venenatis odio commodo aliquam. Cras id volutpat metus, a maximus orci. Nullam ac rhoncus lorem. Nam scelerisque risus et elit egestas elementum. Fusce nec arcu at enim porttitor aliquam vel vitae est. Maecenas gravida, quam iaculis pellentesque vehicula, risus diam interdum nunc, vitae lobortis elit ante vitae turpis. Nam viverra, felis et faucibus luctus, ex sapien egestas lectus, vestibulum pulvinar turpis risus et nisi. Sed vitae suscipit libero, eu ultricies metus. Proin nibh arcu, blandit in sem vel, scelerisque vulputate arcu. Duis ultrices orci felis, maximus vulputate neque rutrum sit amet.
+      </p>
+      <p>
+        Ut lectus lacus, tempor ut pharetra eget, tempus eget dui. Nunc purus nisl, malesuada vel malesuada a, faucibus in dolor. Integer dictum lobortis est sed maximus. Aliquam ut lorem elementum velit consectetur commodo. Cras et est quis augue pellentesque iaculis. In tincidunt, arcu lobortis hendrerit ultricies, turpis orci vestibulum lacus, id dapibus sapien nibh vel urna. Nam blandit tellus id massa semper pharetra.
+      </p>
+    </section>
+
+  );
+};
+
+export default withStyle(TextSection)`
+
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  position: absolute;
+  
+`;

package/src/example/view.js

@@ -5,8 +5,10 @@ import withStyle from "easy-with-style";  ///
 import { RowDiv, RowsDiv, ColumnDiv, ColumnsDiv } from "../index"; ///
 
 import BlueRowDiv from "./div/row/blue";
+import TextSection from "./section/text";
 import YellowRowDiv from "./div/row/yellow";
 import BottomLeftDiv from "./div/bottomLeft";
+import MiddleColumnDiv from "./div/column/middle";
 import LeftSizeableDiv from "./div/sizeable/left";
 import RightSizeableDiv from "./div/sizeable/right";
 import PseudoSplitterDiv from "./div/splitter/pseudo";
@@ -46,7 +48,9 @@ const View = (properties) => {
           <RowsDiv>
             <RowDiv>
               <ColumnsDiv>
-                <ColumnDiv/>
+                <MiddleColumnDiv>
+                  <TextSection/>
+                </MiddleColumnDiv>
                 <RightVerticalSplitterDiv/>
                 <RightSizeableDiv>
                   <RowsDiv>

package/src/index.js

@@ -8,6 +8,5 @@ export { default as ColumnDiv } from "./div/column";
 export { default as ColumnsDiv } from "./div/columns";
 export { default as SplitterDiv } from "./div/splitter";
 export { default as SizeableDiv } from "./div/sizeable";
-export { default as SizeableSection } from "./section/sizeable";
 export { default as VerticalSplitterDiv } from "./div/splitter/vertical";
 export { default as HorizontalSplitterDiv } from "./div/splitter/horizontal";

package/lib/section/sizeable.js

@@ -1,193 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "default", {
-    enumerable: true,
-    get: function() {
-        return _default;
-    }
-});
-var _easyWithStyle = /*#__PURE__*/ _interopRequireDefault(require("easy-with-style"));
-var _easy = require("easy");
-function _assertThisInitialized(self) {
-    if (self === void 0) {
-        throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-    }
-    return self;
-}
-function _classCallCheck(instance, Constructor) {
-    if (!(instance instanceof Constructor)) {
-        throw new TypeError("Cannot call a class as a function");
-    }
-}
-function isNativeReflectConstruct() {
-    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
-    if (Reflect.construct.sham) return false;
-    if (typeof Proxy === "function") return true;
-    try {
-        Date.prototype.toString.call(Reflect.construct(Date, [], function() {}));
-        return true;
-    } catch (e) {
-        return false;
-    }
-}
-function _construct(Parent, args, Class) {
-    if (isNativeReflectConstruct()) {
-        _construct = Reflect.construct;
-    } else {
-        _construct = function _construct(Parent, args, Class) {
-            var a = [
-                null
-            ];
-            a.push.apply(a, args);
-            var Constructor = Function.bind.apply(Parent, a);
-            var instance = new Constructor();
-            if (Class) _setPrototypeOf(instance, Class.prototype);
-            return instance;
-        };
-    }
-    return _construct.apply(null, arguments);
-}
-function _defineProperty(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _getPrototypeOf(o) {
-    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
-        return o.__proto__ || Object.getPrototypeOf(o);
-    };
-    return _getPrototypeOf(o);
-}
-function _inherits(subClass, superClass) {
-    if (typeof superClass !== "function" && superClass !== null) {
-        throw new TypeError("Super expression must either be null or a function");
-    }
-    subClass.prototype = Object.create(superClass && superClass.prototype, {
-        constructor: {
-            value: subClass,
-            writable: true,
-            configurable: true
-        }
-    });
-    if (superClass) _setPrototypeOf(subClass, superClass);
-}
-function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
-function _isNativeFunction(fn) {
-    return Function.toString.call(fn).indexOf("[native code]") !== -1;
-}
-function _possibleConstructorReturn(self, call) {
-    if (call && (_typeof(call) === "object" || typeof call === "function")) {
-        return call;
-    }
-    return _assertThisInitialized(self);
-}
-function _setPrototypeOf(o, p) {
-    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
-        o.__proto__ = p;
-        return o;
-    };
-    return _setPrototypeOf(o, p);
-}
-function _taggedTemplateLiteral(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-var _typeof = function(obj) {
-    "@swc/helpers - typeof";
-    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
-};
-function _wrapNativeSuper(Class) {
-    var _cache = typeof Map === "function" ? new Map() : undefined;
-    _wrapNativeSuper = function _wrapNativeSuper(Class) {
-        if (Class === null || !_isNativeFunction(Class)) return Class;
-        if (typeof Class !== "function") {
-            throw new TypeError("Super expression must either be null or a function");
-        }
-        if (typeof _cache !== "undefined") {
-            if (_cache.has(Class)) return _cache.get(Class);
-            _cache.set(Class, Wrapper);
-        }
-        function Wrapper() {
-            return _construct(Class, arguments, _getPrototypeOf(this).constructor);
-        }
-        Wrapper.prototype = Object.create(Class.prototype, {
-            constructor: {
-                value: Wrapper,
-                enumerable: false,
-                writable: true,
-                configurable: true
-            }
-        });
-        return _setPrototypeOf(Wrapper, Class);
-    };
-    return _wrapNativeSuper(Class);
-}
-function _isNativeReflectConstruct() {
-    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
-    if (Reflect.construct.sham) return false;
-    if (typeof Proxy === "function") return true;
-    try {
-        Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {}));
-        return true;
-    } catch (e) {
-        return false;
-    }
-}
-function _createSuper(Derived) {
-    var hasNativeReflectConstruct = _isNativeReflectConstruct();
-    return function _createSuperInternal() {
-        var Super = _getPrototypeOf(Derived), result;
-        if (hasNativeReflectConstruct) {
-            var NewTarget = _getPrototypeOf(this).constructor;
-            result = Reflect.construct(Super, arguments, NewTarget);
-        } else {
-            result = Super.apply(this, arguments);
-        }
-        return _possibleConstructorReturn(this, result);
-    };
-}
-function _templateObject() {
-    var data = _taggedTemplateLiteral([
-        "\n\n  display: flex;\n  \n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-var SizeableSection = /*#__PURE__*/ function(Element) {
-    _inherits(SizeableSection, Element);
-    var _super = _createSuper(SizeableSection);
-    function SizeableSection() {
-        _classCallCheck(this, SizeableSection);
-        return _super.apply(this, arguments);
-    }
-    return SizeableSection;
-}(_wrapNativeSuper(_easy.Element));
-_defineProperty(SizeableSection, "tagName", "section");
-_defineProperty(SizeableSection, "defaultProperties", {
-    className: "sizeable"
-});
-var _default = (0, _easyWithStyle.default)(SizeableSection)(_templateObject());
-
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9zZWN0aW9uL3NpemVhYmxlLmpzIl0sInNvdXJjZXNDb250ZW50IjpbIlwidXNlIHN0cmljdFwiO1xuXG5pbXBvcnQgd2l0aFN0eWxlIGZyb20gXCJlYXN5LXdpdGgtc3R5bGVcIjsgIC8vL1xuXG5pbXBvcnQgeyBFbGVtZW50IH0gZnJvbSBcImVhc3lcIjtcblxuY2xhc3MgU2l6ZWFibGVTZWN0aW9uIGV4dGVuZHMgRWxlbWVudCB7XG4gIHN0YXRpYyB0YWdOYW1lID0gXCJzZWN0aW9uXCI7XG5cbiAgc3RhdGljIGRlZmF1bHRQcm9wZXJ0aWVzID0ge1xuICAgIGNsYXNzTmFtZTogXCJzaXplYWJsZVwiXG4gIH07XG59XG5cbmV4cG9ydCBkZWZhdWx0IHdpdGhTdHlsZShTaXplYWJsZVNlY3Rpb24pYFxuXG4gIGRpc3BsYXk6IGZsZXg7XG4gIFxuYDtcbiJdLCJuYW1lcyI6WyJTaXplYWJsZVNlY3Rpb24iLCJFbGVtZW50IiwidGFnTmFtZSIsImRlZmF1bHRQcm9wZXJ0aWVzIiwiY2xhc3NOYW1lIiwid2l0aFN0eWxlIl0sIm1hcHBpbmdzIjoiQUFBQSxZQUFZLENBQUM7Ozs7K0JBY2IsU0FJRTs7O2VBSkYsUUFJRTs7O2tFQWhCb0IsaUJBQWlCO29CQUVmLE1BQU07Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFFOUIsSUFBQSxBQUFNQSxlQUFlLGlCQVFsQixBQVJIO2NBQU1BLGVBQWU7OEJBQWZBLGVBQWU7YUFBZkEsZUFBZTs4QkFBZkEsZUFBZTs7O1dBQWZBLGVBQWU7Q0FNcEIsa0JBTjZCQyxLQUFPLFFBQUEsRUFNcEM7QUFMQyxnQkFESUQsZUFBZSxFQUNaRSxTQUFPLEVBQUcsU0FBUyxDQUFDO0FBRTNCLGdCQUhJRixlQUFlLEVBR1pHLG1CQUFpQixFQUFHO0lBQ3pCQyxTQUFTLEVBQUUsVUFBVTtDQUN0QixDQUFDO0lBR0osUUFJRSxHQUphQyxJQUFBQSxjQUFTLFFBQUEsRUFBQ0wsZUFBZSxDQUFDIn0=

package/src/section/sizeable.js

@@ -1,19 +0,0 @@
-"use strict";
-
-import withStyle from "easy-with-style";  ///
-
-import { Element } from "easy";
-
-class SizeableSection extends Element {
-  static tagName = "section";
-
-  static defaultProperties = {
-    className: "sizeable"
-  };
-}
-
-export default withStyle(SizeableSection)`
-
-  display: flex;
-  
-`;