babylonjs-gui 5.54.0 → 5.56.0

package/babylon.gui.d.ts

@@ -1082,16 +1082,20 @@ declare module BABYLON.GUI {
         isPointerBlocker: boolean;
         /** Gets or sets a boolean indicating if the control can be focusable */
         isFocusInvisible: boolean;
+        protected _clipChildren: boolean;
         /**
-         * Gets or sets a boolean indicating if the children are clipped to the current control bounds.
+         * Sets/Gets a boolean indicating if the children are clipped to the current control bounds.
          * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
          */
-        clipChildren: boolean;
+        set clipChildren(value: boolean);
+        get clipChildren(): boolean;
+        protected _clipContent: boolean;
         /**
-         * Gets or sets a boolean indicating that control content must be clipped
-         * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
+         * Sets/Gets a boolean indicating that control content must be clipped
+         * Please note that not clipping content may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
          */
-        clipContent: boolean;
+        set clipContent(value: boolean);
+        get clipContent(): boolean;
         /**
          * Gets or sets a boolean indicating that the current control should cache its rendering (useful when the control does not change often)
          */
@@ -2094,6 +2098,18 @@ declare module BABYLON.GUI {
         private _columnDefinitionObservers;
         private _cells;
         private _childControls;
+        /**
+         * Sets/Gets a boolean indicating that control content must be clipped
+         * Please note that not clipping content may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
+         */
+        set clipContent(value: boolean);
+        get clipContent(): boolean;
+        /**
+         * Sets/Gets a boolean indicating if the children are clipped to the current control bounds.
+         * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
+         */
+        set clipChildren(value: boolean);
+        get clipChildren(): boolean;
         /**
          * Gets the number of columns
          */

package/babylon.gui.js

@@ -4655,16 +4655,8 @@ var Control = /** @class */ (function () {
         this.isPointerBlocker = false;
         /** Gets or sets a boolean indicating if the control can be focusable */
         this.isFocusInvisible = false;
-        /**
-         * Gets or sets a boolean indicating if the children are clipped to the current control bounds.
-         * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
-         */
-        this.clipChildren = true;
-        /**
-         * Gets or sets a boolean indicating that control content must be clipped
-         * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
-         */
-        this.clipContent = true;
+        this._clipChildren = true;
+        this._clipContent = true;
         /**
          * Gets or sets a boolean indicating that the current control should cache its rendering (useful when the control does not change often)
          */
@@ -4768,6 +4760,34 @@ var Control = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(Control.prototype, "clipChildren", {
+        get: function () {
+            return this._clipChildren;
+        },
+        /**
+         * Sets/Gets a boolean indicating if the children are clipped to the current control bounds.
+         * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
+         */
+        set: function (value) {
+            this._clipChildren = value;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Control.prototype, "clipContent", {
+        get: function () {
+            return this._clipContent;
+        },
+        /**
+         * Sets/Gets a boolean indicating that control content must be clipped
+         * Please note that not clipping content may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
+         */
+        set: function (value) {
+            this._clipContent = value;
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(Control.prototype, "shadowOffsetX", {
         /** Gets or sets a value indicating the offset to apply on X axis to render the shadow */
         get: function () {
@@ -6903,10 +6923,10 @@ var Control = /** @class */ (function () {
     ], Control.prototype, "isFocusInvisible", void 0);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,core_Misc_observable__WEBPACK_IMPORTED_MODULE_1__.serialize)()
-    ], Control.prototype, "clipChildren", void 0);
+    ], Control.prototype, "clipChildren", null);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,core_Misc_observable__WEBPACK_IMPORTED_MODULE_1__.serialize)()
-    ], Control.prototype, "clipContent", void 0);
+    ], Control.prototype, "clipContent", null);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,core_Misc_observable__WEBPACK_IMPORTED_MODULE_1__.serialize)()
     ], Control.prototype, "useBitmapCache", void 0);
@@ -7872,7 +7892,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "../../../lts/gui/dist/2D/controls/container.js");
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "../../../lts/gui/dist/2D/valueAndUnit.js");
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "../../../lts/gui/dist/2D/controls/control.js");
-/* harmony import */ var core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! core/Misc/typeStore */ "core/Misc/observable");
+/* harmony import */ var core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! core/Misc/decorators */ "core/Misc/observable");
 /* harmony import */ var core_Misc_tools__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__);
 
 
@@ -7880,6 +7900,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 /**
  * Class used to create a 2D grid container
  */
@@ -7900,6 +7921,42 @@ var Grid = /** @class */ (function (_super) {
         _this._childControls = new Array();
         return _this;
     }
+    Object.defineProperty(Grid.prototype, "clipContent", {
+        get: function () {
+            return this._clipContent;
+        },
+        /**
+         * Sets/Gets a boolean indicating that control content must be clipped
+         * Please note that not clipping content may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
+         */
+        set: function (value) {
+            this._clipContent = value;
+            // This value has to be replicated on all of the container cells
+            for (var key in this._cells) {
+                this._cells[key].clipContent = value;
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Grid.prototype, "clipChildren", {
+        get: function () {
+            return this._clipChildren;
+        },
+        /**
+         * Sets/Gets a boolean indicating if the children are clipped to the current control bounds.
+         * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
+         */
+        set: function (value) {
+            this._clipChildren = value;
+            // This value has to be replicated on all of the container cells
+            for (var key in this._cells) {
+                this._cells[key].clipChildren = value;
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(Grid.prototype, "columnCount", {
         /**
          * Gets the number of columns
@@ -8163,6 +8220,8 @@ var Grid = /** @class */ (function (_super) {
             this._cells[key] = goodContainer;
             goodContainer.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_LEFT;
             goodContainer.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_TOP;
+            goodContainer.clipContent = this.clipContent;
+            goodContainer.clipChildren = this.clipChildren;
             _super.prototype.addControl.call(this, goodContainer);
         }
         goodContainer.addControl(control);
@@ -8397,6 +8456,9 @@ var Grid = /** @class */ (function (_super) {
             this.addControl(children[i], rowNumber, columnNumber);
         }
     };
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__.serialize)()
+    ], Grid.prototype, "clipContent", null);
     return Grid;
 }(_container__WEBPACK_IMPORTED_MODULE_1__.Container));
 
@@ -18434,10 +18496,10 @@ var ValueAndUnit = /** @class */ (function () {
             var width = 0;
             var height = 0;
             if (host.idealWidth) {
-                width = (this._value * host.getSize().width) / host.idealWidth;
+                width = Math.ceil((this._value * host.getSize().width) / host.idealWidth);
             }
             if (host.idealHeight) {
-                height = (this._value * host.getSize().height) / host.idealHeight;
+                height = Math.ceil((this._value * host.getSize().height) / host.idealHeight);
             }
             if (host.useSmallestIdeal && host.idealWidth && host.idealHeight) {
                 return window.innerWidth < window.innerHeight ? width : height;