flexlayout-react 0.7.3 → 0.7.5

package/dist/flexlayout.js

@@ -20,46 +20,6 @@ return /******/ (() => { // webpackBootstrap
 /******/ 	"use strict";
 /******/ 	var __webpack_modules__ = ({
 
-/***/ "./node_modules/uuid/dist/esm-browser/index.js":
-/*!*****************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/index.js ***!
-  \*****************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"NIL\": () => (/* reexport safe */ _nil_js__WEBPACK_IMPORTED_MODULE_4__[\"default\"]),\n/* harmony export */   \"parse\": () => (/* reexport safe */ _parse_js__WEBPACK_IMPORTED_MODULE_8__[\"default\"]),\n/* harmony export */   \"stringify\": () => (/* reexport safe */ _stringify_js__WEBPACK_IMPORTED_MODULE_7__[\"default\"]),\n/* harmony export */   \"v1\": () => (/* reexport safe */ _v1_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"]),\n/* harmony export */   \"v3\": () => (/* reexport safe */ _v3_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"]),\n/* harmony export */   \"v4\": () => (/* reexport safe */ _v4_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"]),\n/* harmony export */   \"v5\": () => (/* reexport safe */ _v5_js__WEBPACK_IMPORTED_MODULE_3__[\"default\"]),\n/* harmony export */   \"validate\": () => (/* reexport safe */ _validate_js__WEBPACK_IMPORTED_MODULE_6__[\"default\"]),\n/* harmony export */   \"version\": () => (/* reexport safe */ _version_js__WEBPACK_IMPORTED_MODULE_5__[\"default\"])\n/* harmony export */ });\n/* harmony import */ var _v1_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./v1.js */ \"./node_modules/uuid/dist/esm-browser/v1.js\");\n/* harmony import */ var _v3_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./v3.js */ \"./node_modules/uuid/dist/esm-browser/v3.js\");\n/* harmony import */ var _v4_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./v4.js */ \"./node_modules/uuid/dist/esm-browser/v4.js\");\n/* harmony import */ var _v5_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./v5.js */ \"./node_modules/uuid/dist/esm-browser/v5.js\");\n/* harmony import */ var _nil_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./nil.js */ \"./node_modules/uuid/dist/esm-browser/nil.js\");\n/* harmony import */ var _version_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./version.js */ \"./node_modules/uuid/dist/esm-browser/version.js\");\n/* harmony import */ var _validate_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./validate.js */ \"./node_modules/uuid/dist/esm-browser/validate.js\");\n/* harmony import */ var _stringify_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stringify.js */ \"./node_modules/uuid/dist/esm-browser/stringify.js\");\n/* harmony import */ var _parse_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./parse.js */ \"./node_modules/uuid/dist/esm-browser/parse.js\");\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/index.js?");
-
-/***/ }),
-
-/***/ "./node_modules/uuid/dist/esm-browser/md5.js":
-/*!***************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/md5.js ***!
-  \***************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/*\n * Browser-compatible JavaScript MD5\n *\n * Modification of JavaScript MD5\n * https://github.com/blueimp/JavaScript-MD5\n *\n * Copyright 2011, Sebastian Tschan\n * https://blueimp.net\n *\n * Licensed under the MIT license:\n * https://opensource.org/licenses/MIT\n *\n * Based on\n * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message\n * Digest Algorithm, as defined in RFC 1321.\n * Version 2.2 Copyright (C) Paul Johnston 1999 - 2009\n * Other contributors: Greg Holt, Andrew Kepert, Ydnar, Lostinet\n * Distributed under the BSD License\n * See http://pajhome.org.uk/crypt/md5 for more info.\n */\nfunction md5(bytes) {\n  if (typeof bytes === 'string') {\n    var msg = unescape(encodeURIComponent(bytes)); // UTF8 escape\n\n    bytes = new Uint8Array(msg.length);\n\n    for (var i = 0; i < msg.length; ++i) {\n      bytes[i] = msg.charCodeAt(i);\n    }\n  }\n\n  return md5ToHexEncodedArray(wordsToMd5(bytesToWords(bytes), bytes.length * 8));\n}\n/*\n * Convert an array of little-endian words to an array of bytes\n */\n\n\nfunction md5ToHexEncodedArray(input) {\n  var output = [];\n  var length32 = input.length * 32;\n  var hexTab = '0123456789abcdef';\n\n  for (var i = 0; i < length32; i += 8) {\n    var x = input[i >> 5] >>> i % 32 & 0xff;\n    var hex = parseInt(hexTab.charAt(x >>> 4 & 0x0f) + hexTab.charAt(x & 0x0f), 16);\n    output.push(hex);\n  }\n\n  return output;\n}\n/**\n * Calculate output length with padding and bit length\n */\n\n\nfunction getOutputLength(inputLength8) {\n  return (inputLength8 + 64 >>> 9 << 4) + 14 + 1;\n}\n/*\n * Calculate the MD5 of an array of little-endian words, and a bit length.\n */\n\n\nfunction wordsToMd5(x, len) {\n  /* append padding */\n  x[len >> 5] |= 0x80 << len % 32;\n  x[getOutputLength(len) - 1] = len;\n  var a = 1732584193;\n  var b = -271733879;\n  var c = -1732584194;\n  var d = 271733878;\n\n  for (var i = 0; i < x.length; i += 16) {\n    var olda = a;\n    var oldb = b;\n    var oldc = c;\n    var oldd = d;\n    a = md5ff(a, b, c, d, x[i], 7, -680876936);\n    d = md5ff(d, a, b, c, x[i + 1], 12, -389564586);\n    c = md5ff(c, d, a, b, x[i + 2], 17, 606105819);\n    b = md5ff(b, c, d, a, x[i + 3], 22, -1044525330);\n    a = md5ff(a, b, c, d, x[i + 4], 7, -176418897);\n    d = md5ff(d, a, b, c, x[i + 5], 12, 1200080426);\n    c = md5ff(c, d, a, b, x[i + 6], 17, -1473231341);\n    b = md5ff(b, c, d, a, x[i + 7], 22, -45705983);\n    a = md5ff(a, b, c, d, x[i + 8], 7, 1770035416);\n    d = md5ff(d, a, b, c, x[i + 9], 12, -1958414417);\n    c = md5ff(c, d, a, b, x[i + 10], 17, -42063);\n    b = md5ff(b, c, d, a, x[i + 11], 22, -1990404162);\n    a = md5ff(a, b, c, d, x[i + 12], 7, 1804603682);\n    d = md5ff(d, a, b, c, x[i + 13], 12, -40341101);\n    c = md5ff(c, d, a, b, x[i + 14], 17, -1502002290);\n    b = md5ff(b, c, d, a, x[i + 15], 22, 1236535329);\n    a = md5gg(a, b, c, d, x[i + 1], 5, -165796510);\n    d = md5gg(d, a, b, c, x[i + 6], 9, -1069501632);\n    c = md5gg(c, d, a, b, x[i + 11], 14, 643717713);\n    b = md5gg(b, c, d, a, x[i], 20, -373897302);\n    a = md5gg(a, b, c, d, x[i + 5], 5, -701558691);\n    d = md5gg(d, a, b, c, x[i + 10], 9, 38016083);\n    c = md5gg(c, d, a, b, x[i + 15], 14, -660478335);\n    b = md5gg(b, c, d, a, x[i + 4], 20, -405537848);\n    a = md5gg(a, b, c, d, x[i + 9], 5, 568446438);\n    d = md5gg(d, a, b, c, x[i + 14], 9, -1019803690);\n    c = md5gg(c, d, a, b, x[i + 3], 14, -187363961);\n    b = md5gg(b, c, d, a, x[i + 8], 20, 1163531501);\n    a = md5gg(a, b, c, d, x[i + 13], 5, -1444681467);\n    d = md5gg(d, a, b, c, x[i + 2], 9, -51403784);\n    c = md5gg(c, d, a, b, x[i + 7], 14, 1735328473);\n    b = md5gg(b, c, d, a, x[i + 12], 20, -1926607734);\n    a = md5hh(a, b, c, d, x[i + 5], 4, -378558);\n    d = md5hh(d, a, b, c, x[i + 8], 11, -2022574463);\n    c = md5hh(c, d, a, b, x[i + 11], 16, 1839030562);\n    b = md5hh(b, c, d, a, x[i + 14], 23, -35309556);\n    a = md5hh(a, b, c, d, x[i + 1], 4, -1530992060);\n    d = md5hh(d, a, b, c, x[i + 4], 11, 1272893353);\n    c = md5hh(c, d, a, b, x[i + 7], 16, -155497632);\n    b = md5hh(b, c, d, a, x[i + 10], 23, -1094730640);\n    a = md5hh(a, b, c, d, x[i + 13], 4, 681279174);\n    d = md5hh(d, a, b, c, x[i], 11, -358537222);\n    c = md5hh(c, d, a, b, x[i + 3], 16, -722521979);\n    b = md5hh(b, c, d, a, x[i + 6], 23, 76029189);\n    a = md5hh(a, b, c, d, x[i + 9], 4, -640364487);\n    d = md5hh(d, a, b, c, x[i + 12], 11, -421815835);\n    c = md5hh(c, d, a, b, x[i + 15], 16, 530742520);\n    b = md5hh(b, c, d, a, x[i + 2], 23, -995338651);\n    a = md5ii(a, b, c, d, x[i], 6, -198630844);\n    d = md5ii(d, a, b, c, x[i + 7], 10, 1126891415);\n    c = md5ii(c, d, a, b, x[i + 14], 15, -1416354905);\n    b = md5ii(b, c, d, a, x[i + 5], 21, -57434055);\n    a = md5ii(a, b, c, d, x[i + 12], 6, 1700485571);\n    d = md5ii(d, a, b, c, x[i + 3], 10, -1894986606);\n    c = md5ii(c, d, a, b, x[i + 10], 15, -1051523);\n    b = md5ii(b, c, d, a, x[i + 1], 21, -2054922799);\n    a = md5ii(a, b, c, d, x[i + 8], 6, 1873313359);\n    d = md5ii(d, a, b, c, x[i + 15], 10, -30611744);\n    c = md5ii(c, d, a, b, x[i + 6], 15, -1560198380);\n    b = md5ii(b, c, d, a, x[i + 13], 21, 1309151649);\n    a = md5ii(a, b, c, d, x[i + 4], 6, -145523070);\n    d = md5ii(d, a, b, c, x[i + 11], 10, -1120210379);\n    c = md5ii(c, d, a, b, x[i + 2], 15, 718787259);\n    b = md5ii(b, c, d, a, x[i + 9], 21, -343485551);\n    a = safeAdd(a, olda);\n    b = safeAdd(b, oldb);\n    c = safeAdd(c, oldc);\n    d = safeAdd(d, oldd);\n  }\n\n  return [a, b, c, d];\n}\n/*\n * Convert an array bytes to an array of little-endian words\n * Characters >255 have their high-byte silently ignored.\n */\n\n\nfunction bytesToWords(input) {\n  if (input.length === 0) {\n    return [];\n  }\n\n  var length8 = input.length * 8;\n  var output = new Uint32Array(getOutputLength(length8));\n\n  for (var i = 0; i < length8; i += 8) {\n    output[i >> 5] |= (input[i / 8] & 0xff) << i % 32;\n  }\n\n  return output;\n}\n/*\n * Add integers, wrapping at 2^32. This uses 16-bit operations internally\n * to work around bugs in some JS interpreters.\n */\n\n\nfunction safeAdd(x, y) {\n  var lsw = (x & 0xffff) + (y & 0xffff);\n  var msw = (x >> 16) + (y >> 16) + (lsw >> 16);\n  return msw << 16 | lsw & 0xffff;\n}\n/*\n * Bitwise rotate a 32-bit number to the left.\n */\n\n\nfunction bitRotateLeft(num, cnt) {\n  return num << cnt | num >>> 32 - cnt;\n}\n/*\n * These functions implement the four basic operations the algorithm uses.\n */\n\n\nfunction md5cmn(q, a, b, x, s, t) {\n  return safeAdd(bitRotateLeft(safeAdd(safeAdd(a, q), safeAdd(x, t)), s), b);\n}\n\nfunction md5ff(a, b, c, d, x, s, t) {\n  return md5cmn(b & c | ~b & d, a, b, x, s, t);\n}\n\nfunction md5gg(a, b, c, d, x, s, t) {\n  return md5cmn(b & d | c & ~d, a, b, x, s, t);\n}\n\nfunction md5hh(a, b, c, d, x, s, t) {\n  return md5cmn(b ^ c ^ d, a, b, x, s, t);\n}\n\nfunction md5ii(a, b, c, d, x, s, t) {\n  return md5cmn(c ^ (b | ~d), a, b, x, s, t);\n}\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (md5);\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/md5.js?");
-
-/***/ }),
-
-/***/ "./node_modules/uuid/dist/esm-browser/nil.js":
-/*!***************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/nil.js ***!
-  \***************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ('00000000-0000-0000-0000-000000000000');\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/nil.js?");
-
-/***/ }),
-
-/***/ "./node_modules/uuid/dist/esm-browser/parse.js":
-/*!*****************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/parse.js ***!
-  \*****************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _validate_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./validate.js */ \"./node_modules/uuid/dist/esm-browser/validate.js\");\n\n\nfunction parse(uuid) {\n  if (!(0,_validate_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(uuid)) {\n    throw TypeError('Invalid UUID');\n  }\n\n  var v;\n  var arr = new Uint8Array(16); // Parse ########-....-....-....-............\n\n  arr[0] = (v = parseInt(uuid.slice(0, 8), 16)) >>> 24;\n  arr[1] = v >>> 16 & 0xff;\n  arr[2] = v >>> 8 & 0xff;\n  arr[3] = v & 0xff; // Parse ........-####-....-....-............\n\n  arr[4] = (v = parseInt(uuid.slice(9, 13), 16)) >>> 8;\n  arr[5] = v & 0xff; // Parse ........-....-####-....-............\n\n  arr[6] = (v = parseInt(uuid.slice(14, 18), 16)) >>> 8;\n  arr[7] = v & 0xff; // Parse ........-....-....-####-............\n\n  arr[8] = (v = parseInt(uuid.slice(19, 23), 16)) >>> 8;\n  arr[9] = v & 0xff; // Parse ........-....-....-....-############\n  // (Use \"/\" to avoid 32-bit truncation when bit-shifting high-order bytes)\n\n  arr[10] = (v = parseInt(uuid.slice(24, 36), 16)) / 0x10000000000 & 0xff;\n  arr[11] = v / 0x100000000 & 0xff;\n  arr[12] = v >>> 24 & 0xff;\n  arr[13] = v >>> 16 & 0xff;\n  arr[14] = v >>> 8 & 0xff;\n  arr[15] = v & 0xff;\n  return arr;\n}\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (parse);\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/parse.js?");
-
-/***/ }),
-
 /***/ "./node_modules/uuid/dist/esm-browser/regex.js":
 /*!*****************************************************!*\
   !*** ./node_modules/uuid/dist/esm-browser/regex.js ***!
@@ -80,16 +40,6 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
-/***/ "./node_modules/uuid/dist/esm-browser/sha1.js":
-/*!****************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/sha1.js ***!
-  \****************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n// Adapted from Chris Veness' SHA1 code at\n// http://www.movable-type.co.uk/scripts/sha1.html\nfunction f(s, x, y, z) {\n  switch (s) {\n    case 0:\n      return x & y ^ ~x & z;\n\n    case 1:\n      return x ^ y ^ z;\n\n    case 2:\n      return x & y ^ x & z ^ y & z;\n\n    case 3:\n      return x ^ y ^ z;\n  }\n}\n\nfunction ROTL(x, n) {\n  return x << n | x >>> 32 - n;\n}\n\nfunction sha1(bytes) {\n  var K = [0x5a827999, 0x6ed9eba1, 0x8f1bbcdc, 0xca62c1d6];\n  var H = [0x67452301, 0xefcdab89, 0x98badcfe, 0x10325476, 0xc3d2e1f0];\n\n  if (typeof bytes === 'string') {\n    var msg = unescape(encodeURIComponent(bytes)); // UTF8 escape\n\n    bytes = [];\n\n    for (var i = 0; i < msg.length; ++i) {\n      bytes.push(msg.charCodeAt(i));\n    }\n  } else if (!Array.isArray(bytes)) {\n    // Convert Array-like to Array\n    bytes = Array.prototype.slice.call(bytes);\n  }\n\n  bytes.push(0x80);\n  var l = bytes.length / 4 + 2;\n  var N = Math.ceil(l / 16);\n  var M = new Array(N);\n\n  for (var _i = 0; _i < N; ++_i) {\n    var arr = new Uint32Array(16);\n\n    for (var j = 0; j < 16; ++j) {\n      arr[j] = bytes[_i * 64 + j * 4] << 24 | bytes[_i * 64 + j * 4 + 1] << 16 | bytes[_i * 64 + j * 4 + 2] << 8 | bytes[_i * 64 + j * 4 + 3];\n    }\n\n    M[_i] = arr;\n  }\n\n  M[N - 1][14] = (bytes.length - 1) * 8 / Math.pow(2, 32);\n  M[N - 1][14] = Math.floor(M[N - 1][14]);\n  M[N - 1][15] = (bytes.length - 1) * 8 & 0xffffffff;\n\n  for (var _i2 = 0; _i2 < N; ++_i2) {\n    var W = new Uint32Array(80);\n\n    for (var t = 0; t < 16; ++t) {\n      W[t] = M[_i2][t];\n    }\n\n    for (var _t = 16; _t < 80; ++_t) {\n      W[_t] = ROTL(W[_t - 3] ^ W[_t - 8] ^ W[_t - 14] ^ W[_t - 16], 1);\n    }\n\n    var a = H[0];\n    var b = H[1];\n    var c = H[2];\n    var d = H[3];\n    var e = H[4];\n\n    for (var _t2 = 0; _t2 < 80; ++_t2) {\n      var s = Math.floor(_t2 / 20);\n      var T = ROTL(a, 5) + f(s, b, c, d) + e + K[s] + W[_t2] >>> 0;\n      e = d;\n      d = c;\n      c = ROTL(b, 30) >>> 0;\n      b = a;\n      a = T;\n    }\n\n    H[0] = H[0] + a >>> 0;\n    H[1] = H[1] + b >>> 0;\n    H[2] = H[2] + c >>> 0;\n    H[3] = H[3] + d >>> 0;\n    H[4] = H[4] + e >>> 0;\n  }\n\n  return [H[0] >> 24 & 0xff, H[0] >> 16 & 0xff, H[0] >> 8 & 0xff, H[0] & 0xff, H[1] >> 24 & 0xff, H[1] >> 16 & 0xff, H[1] >> 8 & 0xff, H[1] & 0xff, H[2] >> 24 & 0xff, H[2] >> 16 & 0xff, H[2] >> 8 & 0xff, H[2] & 0xff, H[3] >> 24 & 0xff, H[3] >> 16 & 0xff, H[3] >> 8 & 0xff, H[3] & 0xff, H[4] >> 24 & 0xff, H[4] >> 16 & 0xff, H[4] >> 8 & 0xff, H[4] & 0xff];\n}\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (sha1);\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/sha1.js?");
-
-/***/ }),
-
 /***/ "./node_modules/uuid/dist/esm-browser/stringify.js":
 /*!*********************************************************!*\
   !*** ./node_modules/uuid/dist/esm-browser/stringify.js ***!
@@ -100,36 +50,6 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
-/***/ "./node_modules/uuid/dist/esm-browser/v1.js":
-/*!**************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/v1.js ***!
-  \**************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _rng_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./rng.js */ \"./node_modules/uuid/dist/esm-browser/rng.js\");\n/* harmony import */ var _stringify_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./stringify.js */ \"./node_modules/uuid/dist/esm-browser/stringify.js\");\n\n // **`v1()` - Generate time-based UUID**\n//\n// Inspired by https://github.com/LiosK/UUID.js\n// and http://docs.python.org/library/uuid.html\n\nvar _nodeId;\n\nvar _clockseq; // Previous uuid creation time\n\n\nvar _lastMSecs = 0;\nvar _lastNSecs = 0; // See https://github.com/uuidjs/uuid for API details\n\nfunction v1(options, buf, offset) {\n  var i = buf && offset || 0;\n  var b = buf || new Array(16);\n  options = options || {};\n  var node = options.node || _nodeId;\n  var clockseq = options.clockseq !== undefined ? options.clockseq : _clockseq; // node and clockseq need to be initialized to random values if they're not\n  // specified.  We do this lazily to minimize issues related to insufficient\n  // system entropy.  See #189\n\n  if (node == null || clockseq == null) {\n    var seedBytes = options.random || (options.rng || _rng_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"])();\n\n    if (node == null) {\n      // Per 4.5, create and 48-bit node id, (47 random bits + multicast bit = 1)\n      node = _nodeId = [seedBytes[0] | 0x01, seedBytes[1], seedBytes[2], seedBytes[3], seedBytes[4], seedBytes[5]];\n    }\n\n    if (clockseq == null) {\n      // Per 4.2.2, randomize (14 bit) clockseq\n      clockseq = _clockseq = (seedBytes[6] << 8 | seedBytes[7]) & 0x3fff;\n    }\n  } // UUID timestamps are 100 nano-second units since the Gregorian epoch,\n  // (1582-10-15 00:00).  JSNumbers aren't precise enough for this, so\n  // time is handled internally as 'msecs' (integer milliseconds) and 'nsecs'\n  // (100-nanoseconds offset from msecs) since unix epoch, 1970-01-01 00:00.\n\n\n  var msecs = options.msecs !== undefined ? options.msecs : Date.now(); // Per 4.2.1.2, use count of uuid's generated during the current clock\n  // cycle to simulate higher resolution clock\n\n  var nsecs = options.nsecs !== undefined ? options.nsecs : _lastNSecs + 1; // Time since last uuid creation (in msecs)\n\n  var dt = msecs - _lastMSecs + (nsecs - _lastNSecs) / 10000; // Per 4.2.1.2, Bump clockseq on clock regression\n\n  if (dt < 0 && options.clockseq === undefined) {\n    clockseq = clockseq + 1 & 0x3fff;\n  } // Reset nsecs if clock regresses (new clockseq) or we've moved onto a new\n  // time interval\n\n\n  if ((dt < 0 || msecs > _lastMSecs) && options.nsecs === undefined) {\n    nsecs = 0;\n  } // Per 4.2.1.2 Throw error if too many uuids are requested\n\n\n  if (nsecs >= 10000) {\n    throw new Error(\"uuid.v1(): Can't create more than 10M uuids/sec\");\n  }\n\n  _lastMSecs = msecs;\n  _lastNSecs = nsecs;\n  _clockseq = clockseq; // Per 4.1.4 - Convert from unix epoch to Gregorian epoch\n\n  msecs += 12219292800000; // `time_low`\n\n  var tl = ((msecs & 0xfffffff) * 10000 + nsecs) % 0x100000000;\n  b[i++] = tl >>> 24 & 0xff;\n  b[i++] = tl >>> 16 & 0xff;\n  b[i++] = tl >>> 8 & 0xff;\n  b[i++] = tl & 0xff; // `time_mid`\n\n  var tmh = msecs / 0x100000000 * 10000 & 0xfffffff;\n  b[i++] = tmh >>> 8 & 0xff;\n  b[i++] = tmh & 0xff; // `time_high_and_version`\n\n  b[i++] = tmh >>> 24 & 0xf | 0x10; // include version\n\n  b[i++] = tmh >>> 16 & 0xff; // `clock_seq_hi_and_reserved` (Per 4.2.2 - include variant)\n\n  b[i++] = clockseq >>> 8 | 0x80; // `clock_seq_low`\n\n  b[i++] = clockseq & 0xff; // `node`\n\n  for (var n = 0; n < 6; ++n) {\n    b[i + n] = node[n];\n  }\n\n  return buf || (0,_stringify_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(b);\n}\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (v1);\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/v1.js?");
-
-/***/ }),
-
-/***/ "./node_modules/uuid/dist/esm-browser/v3.js":
-/*!**************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/v3.js ***!
-  \**************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _v35_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./v35.js */ \"./node_modules/uuid/dist/esm-browser/v35.js\");\n/* harmony import */ var _md5_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./md5.js */ \"./node_modules/uuid/dist/esm-browser/md5.js\");\n\n\nvar v3 = (0,_v35_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"])('v3', 0x30, _md5_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (v3);\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/v3.js?");
-
-/***/ }),
-
-/***/ "./node_modules/uuid/dist/esm-browser/v35.js":
-/*!***************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/v35.js ***!
-  \***************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"DNS\": () => (/* binding */ DNS),\n/* harmony export */   \"URL\": () => (/* binding */ URL),\n/* harmony export */   \"default\": () => (/* export default binding */ __WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _stringify_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./stringify.js */ \"./node_modules/uuid/dist/esm-browser/stringify.js\");\n/* harmony import */ var _parse_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./parse.js */ \"./node_modules/uuid/dist/esm-browser/parse.js\");\n\n\n\nfunction stringToBytes(str) {\n  str = unescape(encodeURIComponent(str)); // UTF8 escape\n\n  var bytes = [];\n\n  for (var i = 0; i < str.length; ++i) {\n    bytes.push(str.charCodeAt(i));\n  }\n\n  return bytes;\n}\n\nvar DNS = '6ba7b810-9dad-11d1-80b4-00c04fd430c8';\nvar URL = '6ba7b811-9dad-11d1-80b4-00c04fd430c8';\n/* harmony default export */ function __WEBPACK_DEFAULT_EXPORT__(name, version, hashfunc) {\n  function generateUUID(value, namespace, buf, offset) {\n    if (typeof value === 'string') {\n      value = stringToBytes(value);\n    }\n\n    if (typeof namespace === 'string') {\n      namespace = (0,_parse_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(namespace);\n    }\n\n    if (namespace.length !== 16) {\n      throw TypeError('Namespace must be array-like (16 iterable integer values, 0-255)');\n    } // Compute hash of namespace and value, Per 4.3\n    // Future: Use spread syntax when supported on all platforms, e.g. `bytes =\n    // hashfunc([...namespace, ... value])`\n\n\n    var bytes = new Uint8Array(16 + value.length);\n    bytes.set(namespace);\n    bytes.set(value, namespace.length);\n    bytes = hashfunc(bytes);\n    bytes[6] = bytes[6] & 0x0f | version;\n    bytes[8] = bytes[8] & 0x3f | 0x80;\n\n    if (buf) {\n      offset = offset || 0;\n\n      for (var i = 0; i < 16; ++i) {\n        buf[offset + i] = bytes[i];\n      }\n\n      return buf;\n    }\n\n    return (0,_stringify_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(bytes);\n  } // Function#name is not settable on some platforms (#270)\n\n\n  try {\n    generateUUID.name = name; // eslint-disable-next-line no-empty\n  } catch (err) {} // For CommonJS default export support\n\n\n  generateUUID.DNS = DNS;\n  generateUUID.URL = URL;\n  return generateUUID;\n}\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/v35.js?");
-
-/***/ }),
-
 /***/ "./node_modules/uuid/dist/esm-browser/v4.js":
 /*!**************************************************!*\
   !*** ./node_modules/uuid/dist/esm-browser/v4.js ***!
@@ -140,16 +60,6 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
-/***/ "./node_modules/uuid/dist/esm-browser/v5.js":
-/*!**************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/v5.js ***!
-  \**************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _v35_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./v35.js */ \"./node_modules/uuid/dist/esm-browser/v35.js\");\n/* harmony import */ var _sha1_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./sha1.js */ \"./node_modules/uuid/dist/esm-browser/sha1.js\");\n\n\nvar v5 = (0,_v35_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"])('v5', 0x50, _sha1_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (v5);\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/v5.js?");
-
-/***/ }),
-
 /***/ "./node_modules/uuid/dist/esm-browser/validate.js":
 /*!********************************************************!*\
   !*** ./node_modules/uuid/dist/esm-browser/validate.js ***!
@@ -160,23 +70,13 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
-/***/ "./node_modules/uuid/dist/esm-browser/version.js":
-/*!*******************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/version.js ***!
-  \*******************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _validate_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./validate.js */ \"./node_modules/uuid/dist/esm-browser/validate.js\");\n\n\nfunction version(uuid) {\n  if (!(0,_validate_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(uuid)) {\n    throw TypeError('Invalid UUID');\n  }\n\n  return parseInt(uuid.substr(14, 1), 16);\n}\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (version);\n\n//# sourceURL=webpack://FlexLayout/./node_modules/uuid/dist/esm-browser/version.js?");
-
-/***/ }),
-
 /***/ "./src/Attribute.ts":
 /*!**************************!*\
   !*** ./src/Attribute.ts ***!
   \**************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Attribute = void 0;\n/** @internal */\nvar Attribute = /** @class */ (function () {\n    function Attribute(name, modelName, defaultValue, alwaysWriteJson) {\n        this.name = name;\n        this.modelName = modelName;\n        this.defaultValue = defaultValue;\n        this.alwaysWriteJson = alwaysWriteJson;\n        this.required = false;\n        this.fixed = false;\n        this.type = \"any\";\n    }\n    Attribute.prototype.setType = function (value) {\n        this.type = value;\n        return this;\n    };\n    Attribute.prototype.setRequired = function () {\n        this.required = true;\n        return this;\n    };\n    Attribute.prototype.setFixed = function () {\n        this.fixed = true;\n        return this;\n    };\n    Attribute.NUMBER = \"number\";\n    Attribute.STRING = \"string\";\n    Attribute.BOOLEAN = \"boolean\";\n    return Attribute;\n}());\nexports.Attribute = Attribute;\n\n\n//# sourceURL=webpack://FlexLayout/./src/Attribute.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Attribute\": () => (/* binding */ Attribute)\n/* harmony export */ });\n/** @internal */\r\nclass Attribute {\r\n    constructor(name, modelName, defaultValue, alwaysWriteJson) {\r\n        this.name = name;\r\n        this.modelName = modelName;\r\n        this.defaultValue = defaultValue;\r\n        this.alwaysWriteJson = alwaysWriteJson;\r\n        this.required = false;\r\n        this.fixed = false;\r\n        this.type = \"any\";\r\n    }\r\n    setType(value) {\r\n        this.type = value;\r\n        return this;\r\n    }\r\n    setRequired() {\r\n        this.required = true;\r\n        return this;\r\n    }\r\n    setFixed() {\r\n        this.fixed = true;\r\n        return this;\r\n    }\r\n}\r\nAttribute.NUMBER = \"number\";\r\nAttribute.STRING = \"string\";\r\nAttribute.BOOLEAN = \"boolean\";\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/Attribute.ts?");
 
 /***/ }),
 
@@ -184,9 +84,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*************************************!*\
   !*** ./src/AttributeDefinitions.ts ***!
   \*************************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.AttributeDefinitions = void 0;\nvar Attribute_1 = __webpack_require__(/*! ./Attribute */ \"./src/Attribute.ts\");\n/** @internal */\nvar AttributeDefinitions = /** @class */ (function () {\n    function AttributeDefinitions() {\n        this.attributes = [];\n        this.nameToAttribute = {};\n    }\n    AttributeDefinitions.prototype.addWithAll = function (name, modelName, defaultValue, alwaysWriteJson) {\n        var attr = new Attribute_1.Attribute(name, modelName, defaultValue, alwaysWriteJson);\n        this.attributes.push(attr);\n        this.nameToAttribute[name] = attr;\n        return attr;\n    };\n    AttributeDefinitions.prototype.addInherited = function (name, modelName) {\n        return this.addWithAll(name, modelName, undefined, false);\n    };\n    AttributeDefinitions.prototype.add = function (name, defaultValue, alwaysWriteJson) {\n        return this.addWithAll(name, undefined, defaultValue, alwaysWriteJson);\n    };\n    AttributeDefinitions.prototype.getAttributes = function () {\n        return this.attributes;\n    };\n    AttributeDefinitions.prototype.getModelName = function (name) {\n        var conversion = this.nameToAttribute[name];\n        if (conversion !== undefined) {\n            return conversion.modelName;\n        }\n        return undefined;\n    };\n    AttributeDefinitions.prototype.toJson = function (jsonObj, obj) {\n        for (var _i = 0, _a = this.attributes; _i < _a.length; _i++) {\n            var attr = _a[_i];\n            var fromValue = obj[attr.name];\n            if (attr.alwaysWriteJson || fromValue !== attr.defaultValue) {\n                jsonObj[attr.name] = fromValue;\n            }\n        }\n    };\n    AttributeDefinitions.prototype.fromJson = function (jsonObj, obj) {\n        for (var _i = 0, _a = this.attributes; _i < _a.length; _i++) {\n            var attr = _a[_i];\n            var fromValue = jsonObj[attr.name];\n            if (fromValue === undefined) {\n                obj[attr.name] = attr.defaultValue;\n            }\n            else {\n                obj[attr.name] = fromValue;\n            }\n        }\n    };\n    AttributeDefinitions.prototype.update = function (jsonObj, obj) {\n        for (var _i = 0, _a = this.attributes; _i < _a.length; _i++) {\n            var attr = _a[_i];\n            if (jsonObj.hasOwnProperty(attr.name)) {\n                var fromValue = jsonObj[attr.name];\n                if (fromValue === undefined) {\n                    delete obj[attr.name];\n                }\n                else {\n                    obj[attr.name] = fromValue;\n                }\n            }\n        }\n    };\n    AttributeDefinitions.prototype.setDefaults = function (obj) {\n        for (var _i = 0, _a = this.attributes; _i < _a.length; _i++) {\n            var attr = _a[_i];\n            obj[attr.name] = attr.defaultValue;\n        }\n    };\n    AttributeDefinitions.prototype.toTypescriptInterface = function (name, parentAttributes) {\n        var lines = [];\n        var sorted = this.attributes.sort(function (a, b) { return a.name.localeCompare(b.name); });\n        // const sorted = this.attributes;\n        lines.push(\"export interface I\" + name + \"Attributes {\");\n        for (var i = 0; i < sorted.length; i++) {\n            var c = sorted[i];\n            var type = c.type;\n            var defaultValue = undefined;\n            var attr = c;\n            var inherited = undefined;\n            if (attr.defaultValue !== undefined) {\n                defaultValue = attr.defaultValue;\n            }\n            else if (attr.modelName !== undefined\n                && parentAttributes !== undefined\n                && parentAttributes.nameToAttribute[attr.modelName] !== undefined) {\n                inherited = attr.modelName;\n                attr = parentAttributes.nameToAttribute[attr.modelName];\n                defaultValue = attr.defaultValue;\n                type = attr.type;\n            }\n            var defValue = JSON.stringify(defaultValue);\n            var required = attr.required || attr.fixed ? \"\" : \"?\";\n            if (c.fixed) {\n                lines.push(\"\\t\" + c.name + \": \" + defValue + \";\");\n            }\n            else {\n                var comment = (defaultValue !== undefined ? \"default: \" + defValue : \"\") +\n                    (inherited !== undefined ? \" - inherited from global \" + inherited : \"\");\n                lines.push(\"\\t\" + c.name + required + \": \" + type + \";\" +\n                    (comment.length > 0 ? \" // \" + comment : \"\"));\n            }\n        }\n        lines.push(\"}\");\n        return lines.join(\"\\n\");\n    };\n    return AttributeDefinitions;\n}());\nexports.AttributeDefinitions = AttributeDefinitions;\n\n\n//# sourceURL=webpack://FlexLayout/./src/AttributeDefinitions.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"AttributeDefinitions\": () => (/* binding */ AttributeDefinitions)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Attribute */ \"./src/Attribute.ts\");\n\r\n/** @internal */\r\nclass AttributeDefinitions {\r\n    constructor() {\r\n        this.attributes = [];\r\n        this.nameToAttribute = {};\r\n    }\r\n    addWithAll(name, modelName, defaultValue, alwaysWriteJson) {\r\n        const attr = new _Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute(name, modelName, defaultValue, alwaysWriteJson);\r\n        this.attributes.push(attr);\r\n        this.nameToAttribute[name] = attr;\r\n        return attr;\r\n    }\r\n    addInherited(name, modelName) {\r\n        return this.addWithAll(name, modelName, undefined, false);\r\n    }\r\n    add(name, defaultValue, alwaysWriteJson) {\r\n        return this.addWithAll(name, undefined, defaultValue, alwaysWriteJson);\r\n    }\r\n    getAttributes() {\r\n        return this.attributes;\r\n    }\r\n    getModelName(name) {\r\n        const conversion = this.nameToAttribute[name];\r\n        if (conversion !== undefined) {\r\n            return conversion.modelName;\r\n        }\r\n        return undefined;\r\n    }\r\n    toJson(jsonObj, obj) {\r\n        for (const attr of this.attributes) {\r\n            const fromValue = obj[attr.name];\r\n            if (attr.alwaysWriteJson || fromValue !== attr.defaultValue) {\r\n                jsonObj[attr.name] = fromValue;\r\n            }\r\n        }\r\n    }\r\n    fromJson(jsonObj, obj) {\r\n        for (const attr of this.attributes) {\r\n            const fromValue = jsonObj[attr.name];\r\n            if (fromValue === undefined) {\r\n                obj[attr.name] = attr.defaultValue;\r\n            }\r\n            else {\r\n                obj[attr.name] = fromValue;\r\n            }\r\n        }\r\n    }\r\n    update(jsonObj, obj) {\r\n        for (const attr of this.attributes) {\r\n            if (jsonObj.hasOwnProperty(attr.name)) {\r\n                const fromValue = jsonObj[attr.name];\r\n                if (fromValue === undefined) {\r\n                    delete obj[attr.name];\r\n                }\r\n                else {\r\n                    obj[attr.name] = fromValue;\r\n                }\r\n            }\r\n        }\r\n    }\r\n    setDefaults(obj) {\r\n        for (const attr of this.attributes) {\r\n            obj[attr.name] = attr.defaultValue;\r\n        }\r\n    }\r\n    toTypescriptInterface(name, parentAttributes) {\r\n        const lines = [];\r\n        const sorted = this.attributes.sort((a, b) => a.name.localeCompare(b.name));\r\n        // const sorted = this.attributes;\r\n        lines.push(\"export interface I\" + name + \"Attributes {\");\r\n        for (let i = 0; i < sorted.length; i++) {\r\n            const c = sorted[i];\r\n            let type = c.type;\r\n            let defaultValue = undefined;\r\n            let attr = c;\r\n            let inherited = undefined;\r\n            if (attr.defaultValue !== undefined) {\r\n                defaultValue = attr.defaultValue;\r\n            }\r\n            else if (attr.modelName !== undefined\r\n                && parentAttributes !== undefined\r\n                && parentAttributes.nameToAttribute[attr.modelName] !== undefined) {\r\n                inherited = attr.modelName;\r\n                attr = parentAttributes.nameToAttribute[attr.modelName];\r\n                defaultValue = attr.defaultValue;\r\n                type = attr.type;\r\n            }\r\n            let defValue = JSON.stringify(defaultValue);\r\n            const required = attr.required || attr.fixed ? \"\" : \"?\";\r\n            if (c.fixed) {\r\n                lines.push(\"\\t\" + c.name + \": \" + defValue + \";\");\r\n            }\r\n            else {\r\n                const comment = (defaultValue !== undefined ? \"default: \" + defValue : \"\") +\r\n                    (inherited !== undefined ? \" - inherited from global \" + inherited : \"\");\r\n                lines.push(\"\\t\" + c.name + required + \": \" + type + \";\" +\r\n                    (comment.length > 0 ? \" // \" + comment : \"\"));\r\n            }\r\n        }\r\n        lines.push(\"}\");\r\n        return lines.join(\"\\n\");\r\n    }\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/AttributeDefinitions.ts?");
 
 /***/ }),
 
@@ -194,9 +94,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*****************************!*\
   !*** ./src/DockLocation.ts ***!
   \*****************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.DockLocation = void 0;\nvar Orientation_1 = __webpack_require__(/*! ./Orientation */ \"./src/Orientation.ts\");\nvar Rect_1 = __webpack_require__(/*! ./Rect */ \"./src/Rect.ts\");\nvar DockLocation = /** @class */ (function () {\n    /** @internal */\n    function DockLocation(name, orientation, indexPlus) {\n        this._name = name;\n        this._orientation = orientation;\n        this._indexPlus = indexPlus;\n        DockLocation.values[this._name] = this;\n    }\n    /** @internal */\n    DockLocation.getByName = function (name) {\n        return DockLocation.values[name];\n    };\n    /** @internal */\n    DockLocation.getLocation = function (rect, x, y) {\n        x = (x - rect.x) / rect.width;\n        y = (y - rect.y) / rect.height;\n        if (x >= 0.25 && x < 0.75 && y >= 0.25 && y < 0.75) {\n            return DockLocation.CENTER;\n        }\n        // Whether or not the point is in the bottom-left half of the rect\n        // +-----+\n        // |\\    |\n        // |x\\   |\n        // |xx\\  |\n        // |xxx\\ |\n        // |xxxx\\|\n        // +-----+\n        var bl = y >= x;\n        // Whether or not the point is in the bottom-right half of the rect\n        // +-----+\n        // |    /|\n        // |   /x|\n        // |  /xx|\n        // | /xxx|\n        // |/xxxx|\n        // +-----+\n        var br = y >= 1 - x;\n        if (bl) {\n            return br ? DockLocation.BOTTOM : DockLocation.LEFT;\n        }\n        else {\n            return br ? DockLocation.RIGHT : DockLocation.TOP;\n        }\n    };\n    DockLocation.prototype.getName = function () {\n        return this._name;\n    };\n    DockLocation.prototype.getOrientation = function () {\n        return this._orientation;\n    };\n    /** @internal */\n    DockLocation.prototype.getDockRect = function (r) {\n        if (this === DockLocation.TOP) {\n            return new Rect_1.Rect(r.x, r.y, r.width, r.height / 2);\n        }\n        else if (this === DockLocation.BOTTOM) {\n            return new Rect_1.Rect(r.x, r.getBottom() - r.height / 2, r.width, r.height / 2);\n        }\n        if (this === DockLocation.LEFT) {\n            return new Rect_1.Rect(r.x, r.y, r.width / 2, r.height);\n        }\n        else if (this === DockLocation.RIGHT) {\n            return new Rect_1.Rect(r.getRight() - r.width / 2, r.y, r.width / 2, r.height);\n        }\n        else {\n            return r.clone();\n        }\n    };\n    /** @internal */\n    DockLocation.prototype.split = function (rect, size) {\n        if (this === DockLocation.TOP) {\n            var r1 = new Rect_1.Rect(rect.x, rect.y, rect.width, size);\n            var r2 = new Rect_1.Rect(rect.x, rect.y + size, rect.width, rect.height - size);\n            return { start: r1, end: r2 };\n        }\n        else if (this === DockLocation.LEFT) {\n            var r1 = new Rect_1.Rect(rect.x, rect.y, size, rect.height);\n            var r2 = new Rect_1.Rect(rect.x + size, rect.y, rect.width - size, rect.height);\n            return { start: r1, end: r2 };\n        }\n        if (this === DockLocation.RIGHT) {\n            var r1 = new Rect_1.Rect(rect.getRight() - size, rect.y, size, rect.height);\n            var r2 = new Rect_1.Rect(rect.x, rect.y, rect.width - size, rect.height);\n            return { start: r1, end: r2 };\n        }\n        else {\n            // if (this === DockLocation.BOTTOM) {\n            var r1 = new Rect_1.Rect(rect.x, rect.getBottom() - size, rect.width, size);\n            var r2 = new Rect_1.Rect(rect.x, rect.y, rect.width, rect.height - size);\n            return { start: r1, end: r2 };\n        }\n    };\n    /** @internal */\n    DockLocation.prototype.reflect = function () {\n        if (this === DockLocation.TOP) {\n            return DockLocation.BOTTOM;\n        }\n        else if (this === DockLocation.LEFT) {\n            return DockLocation.RIGHT;\n        }\n        if (this === DockLocation.RIGHT) {\n            return DockLocation.LEFT;\n        }\n        else {\n            // if (this === DockLocation.BOTTOM) {\n            return DockLocation.TOP;\n        }\n    };\n    DockLocation.prototype.toString = function () {\n        return \"(DockLocation: name=\" + this._name + \", orientation=\" + this._orientation + \")\";\n    };\n    DockLocation.values = {};\n    DockLocation.TOP = new DockLocation(\"top\", Orientation_1.Orientation.VERT, 0);\n    DockLocation.BOTTOM = new DockLocation(\"bottom\", Orientation_1.Orientation.VERT, 1);\n    DockLocation.LEFT = new DockLocation(\"left\", Orientation_1.Orientation.HORZ, 0);\n    DockLocation.RIGHT = new DockLocation(\"right\", Orientation_1.Orientation.HORZ, 1);\n    DockLocation.CENTER = new DockLocation(\"center\", Orientation_1.Orientation.VERT, 0);\n    return DockLocation;\n}());\nexports.DockLocation = DockLocation;\n\n\n//# sourceURL=webpack://FlexLayout/./src/DockLocation.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"DockLocation\": () => (/* binding */ DockLocation)\n/* harmony export */ });\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Rect */ \"./src/Rect.ts\");\n\r\n\r\nclass DockLocation {\r\n    /** @internal */\r\n    constructor(name, orientation, indexPlus) {\r\n        this._name = name;\r\n        this._orientation = orientation;\r\n        this._indexPlus = indexPlus;\r\n        DockLocation.values[this._name] = this;\r\n    }\r\n    /** @internal */\r\n    static getByName(name) {\r\n        return DockLocation.values[name];\r\n    }\r\n    /** @internal */\r\n    static getLocation(rect, x, y) {\r\n        x = (x - rect.x) / rect.width;\r\n        y = (y - rect.y) / rect.height;\r\n        if (x >= 0.25 && x < 0.75 && y >= 0.25 && y < 0.75) {\r\n            return DockLocation.CENTER;\r\n        }\r\n        // Whether or not the point is in the bottom-left half of the rect\r\n        // +-----+\r\n        // |\\    |\r\n        // |x\\   |\r\n        // |xx\\  |\r\n        // |xxx\\ |\r\n        // |xxxx\\|\r\n        // +-----+\r\n        const bl = y >= x;\r\n        // Whether or not the point is in the bottom-right half of the rect\r\n        // +-----+\r\n        // |    /|\r\n        // |   /x|\r\n        // |  /xx|\r\n        // | /xxx|\r\n        // |/xxxx|\r\n        // +-----+\r\n        const br = y >= 1 - x;\r\n        if (bl) {\r\n            return br ? DockLocation.BOTTOM : DockLocation.LEFT;\r\n        }\r\n        else {\r\n            return br ? DockLocation.RIGHT : DockLocation.TOP;\r\n        }\r\n    }\r\n    getName() {\r\n        return this._name;\r\n    }\r\n    getOrientation() {\r\n        return this._orientation;\r\n    }\r\n    /** @internal */\r\n    getDockRect(r) {\r\n        if (this === DockLocation.TOP) {\r\n            return new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(r.x, r.y, r.width, r.height / 2);\r\n        }\r\n        else if (this === DockLocation.BOTTOM) {\r\n            return new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(r.x, r.getBottom() - r.height / 2, r.width, r.height / 2);\r\n        }\r\n        if (this === DockLocation.LEFT) {\r\n            return new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(r.x, r.y, r.width / 2, r.height);\r\n        }\r\n        else if (this === DockLocation.RIGHT) {\r\n            return new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(r.getRight() - r.width / 2, r.y, r.width / 2, r.height);\r\n        }\r\n        else {\r\n            return r.clone();\r\n        }\r\n    }\r\n    /** @internal */\r\n    split(rect, size) {\r\n        if (this === DockLocation.TOP) {\r\n            const r1 = new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(rect.x, rect.y, rect.width, size);\r\n            const r2 = new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(rect.x, rect.y + size, rect.width, rect.height - size);\r\n            return { start: r1, end: r2 };\r\n        }\r\n        else if (this === DockLocation.LEFT) {\r\n            const r1 = new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(rect.x, rect.y, size, rect.height);\r\n            const r2 = new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(rect.x + size, rect.y, rect.width - size, rect.height);\r\n            return { start: r1, end: r2 };\r\n        }\r\n        if (this === DockLocation.RIGHT) {\r\n            const r1 = new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(rect.getRight() - size, rect.y, size, rect.height);\r\n            const r2 = new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(rect.x, rect.y, rect.width - size, rect.height);\r\n            return { start: r1, end: r2 };\r\n        }\r\n        else {\r\n            // if (this === DockLocation.BOTTOM) {\r\n            const r1 = new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(rect.x, rect.getBottom() - size, rect.width, size);\r\n            const r2 = new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(rect.x, rect.y, rect.width, rect.height - size);\r\n            return { start: r1, end: r2 };\r\n        }\r\n    }\r\n    /** @internal */\r\n    reflect() {\r\n        if (this === DockLocation.TOP) {\r\n            return DockLocation.BOTTOM;\r\n        }\r\n        else if (this === DockLocation.LEFT) {\r\n            return DockLocation.RIGHT;\r\n        }\r\n        if (this === DockLocation.RIGHT) {\r\n            return DockLocation.LEFT;\r\n        }\r\n        else {\r\n            // if (this === DockLocation.BOTTOM) {\r\n            return DockLocation.TOP;\r\n        }\r\n    }\r\n    toString() {\r\n        return \"(DockLocation: name=\" + this._name + \", orientation=\" + this._orientation + \")\";\r\n    }\r\n}\r\nDockLocation.values = {};\r\nDockLocation.TOP = new DockLocation(\"top\", _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.VERT, 0);\r\nDockLocation.BOTTOM = new DockLocation(\"bottom\", _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.VERT, 1);\r\nDockLocation.LEFT = new DockLocation(\"left\", _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.HORZ, 0);\r\nDockLocation.RIGHT = new DockLocation(\"right\", _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.HORZ, 1);\r\nDockLocation.CENTER = new DockLocation(\"center\", _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.VERT, 0);\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/DockLocation.ts?");
 
 /***/ }),
 
@@ -204,9 +104,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*************************!*\
   !*** ./src/DragDrop.ts ***!
   \*************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.DragDrop = void 0;\nvar Rect_1 = __webpack_require__(/*! ./Rect */ \"./src/Rect.ts\");\n/** @internal */\nvar canUseDOM = !!(typeof window !== \"undefined\" && window.document && window.document.createElement);\nvar DragDrop = /** @class */ (function () {\n    /** @internal */\n    function DragDrop() {\n        /** @internal */\n        this._manualGlassManagement = false;\n        /** @internal */\n        this._startX = 0;\n        /** @internal */\n        this._startY = 0;\n        /** @internal */\n        this._dragDepth = 0;\n        /** @internal */\n        this._glassShowing = false;\n        /** @internal */\n        this._dragging = false;\n        /** @internal */\n        this._active = false; // drag and drop is in progress, can be used on ios to prevent body scrolling (see demo)\n        if (canUseDOM) {\n            // check for serverside rendering\n            this._glass = document.createElement(\"div\");\n            this._glass.style.zIndex = \"998\";\n            this._glass.style.backgroundColor = \"transparent\";\n            this._glass.style.outline = \"none\";\n        }\n        this._defaultGlassCursor = \"default\";\n        this._onMouseMove = this._onMouseMove.bind(this);\n        this._onMouseUp = this._onMouseUp.bind(this);\n        this._onKeyPress = this._onKeyPress.bind(this);\n        this._onDragCancel = this._onDragCancel.bind(this);\n        this._onDragEnter = this._onDragEnter.bind(this);\n        this._onDragLeave = this._onDragLeave.bind(this);\n        this.resizeGlass = this.resizeGlass.bind(this);\n        this._lastClick = 0;\n        this._clickX = 0;\n        this._clickY = 0;\n    }\n    // if you add the glass pane then you should remove it\n    DragDrop.prototype.addGlass = function (fCancel) {\n        var _a;\n        if (!this._glassShowing) {\n            if (!this._document) {\n                this._document = window.document;\n            }\n            if (!this._rootElement) {\n                this._rootElement = this._document.body;\n            }\n            this.resizeGlass();\n            (_a = this._document.defaultView) === null || _a === void 0 ? void 0 : _a.addEventListener('resize', this.resizeGlass);\n            this._document.body.appendChild(this._glass);\n            this._glass.tabIndex = -1;\n            this._glass.focus();\n            this._glass.addEventListener(\"keydown\", this._onKeyPress);\n            this._glass.addEventListener(\"dragenter\", this._onDragEnter, { passive: false });\n            this._glass.addEventListener(\"dragover\", this._onMouseMove, { passive: false });\n            this._glass.addEventListener(\"dragleave\", this._onDragLeave, { passive: false });\n            this._glassShowing = true;\n            this._fDragCancel = fCancel;\n            this._manualGlassManagement = false;\n        }\n        else {\n            // second call to addGlass (via dragstart)\n            this._manualGlassManagement = true;\n        }\n    };\n    DragDrop.prototype.resizeGlass = function () {\n        var glassRect = Rect_1.Rect.fromElement(this._rootElement);\n        glassRect.positionElement(this._glass, \"fixed\");\n    };\n    DragDrop.prototype.hideGlass = function () {\n        var _a;\n        if (this._glassShowing) {\n            this._document.body.removeChild(this._glass);\n            (_a = this._document.defaultView) === null || _a === void 0 ? void 0 : _a.removeEventListener('resize', this.resizeGlass);\n            this._glassShowing = false;\n            this._document = undefined;\n            this._rootElement = undefined;\n            this.setGlassCursorOverride(undefined);\n        }\n    };\n    /** @internal */\n    DragDrop.prototype._updateGlassCursor = function () {\n        var _a;\n        this._glass.style.cursor = (_a = this._glassCursorOverride) !== null && _a !== void 0 ? _a : this._defaultGlassCursor;\n    };\n    /** @internal */\n    DragDrop.prototype._setDefaultGlassCursor = function (cursor) {\n        this._defaultGlassCursor = cursor;\n        this._updateGlassCursor();\n    };\n    DragDrop.prototype.setGlassCursorOverride = function (cursor) {\n        this._glassCursorOverride = cursor;\n        this._updateGlassCursor();\n    };\n    DragDrop.prototype.startDrag = function (event, fDragStart, fDragMove, fDragEnd, fDragCancel, fClick, fDblClick, currentDocument, rootElement) {\n        // prevent 'duplicate' action (mouse event for same action as previous touch event (a fix for ios))\n        if (event && this._lastEvent && this._lastEvent.type.startsWith(\"touch\") && event.type.startsWith(\"mouse\") && event.timeStamp - this._lastEvent.timeStamp < 500) {\n            return;\n        }\n        this._lastEvent = event;\n        if (currentDocument) {\n            this._document = currentDocument;\n        }\n        else {\n            this._document = window.document;\n        }\n        if (rootElement) {\n            this._rootElement = rootElement;\n        }\n        else {\n            this._rootElement = this._document.body;\n        }\n        var posEvent = this._getLocationEvent(event);\n        this.addGlass(fDragCancel);\n        if (this._dragging) {\n            console.warn(\"this._dragging true on startDrag should never happen\");\n        }\n        if (event) {\n            this._startX = posEvent.clientX;\n            this._startY = posEvent.clientY;\n            if (!window.matchMedia || window.matchMedia(\"(pointer: fine)\").matches) {\n                this._setDefaultGlassCursor(getComputedStyle(event.target).cursor);\n            }\n            this._stopPropagation(event);\n            this._preventDefault(event);\n        }\n        else {\n            this._startX = 0;\n            this._startY = 0;\n            this._setDefaultGlassCursor(\"default\");\n        }\n        this._dragging = false;\n        this._fDragStart = fDragStart;\n        this._fDragMove = fDragMove;\n        this._fDragEnd = fDragEnd;\n        this._fDragCancel = fDragCancel;\n        this._fClick = fClick;\n        this._fDblClick = fDblClick;\n        this._active = true;\n        if ((event === null || event === void 0 ? void 0 : event.type) === 'dragenter') {\n            this._dragDepth = 1;\n            this._rootElement.addEventListener(\"dragenter\", this._onDragEnter, { passive: false });\n            this._rootElement.addEventListener(\"dragover\", this._onMouseMove, { passive: false });\n            this._rootElement.addEventListener(\"dragleave\", this._onDragLeave, { passive: false });\n            this._document.addEventListener(\"dragend\", this._onDragCancel, { passive: false });\n            this._document.addEventListener(\"drop\", this._onMouseUp, { passive: false });\n        }\n        else {\n            this._document.addEventListener(\"mouseup\", this._onMouseUp, { passive: false });\n            this._document.addEventListener(\"mousemove\", this._onMouseMove, { passive: false });\n            this._document.addEventListener(\"touchend\", this._onMouseUp, { passive: false });\n            this._document.addEventListener(\"touchmove\", this._onMouseMove, { passive: false });\n        }\n    };\n    DragDrop.prototype.isDragging = function () {\n        return this._dragging;\n    };\n    DragDrop.prototype.isActive = function () {\n        return this._active;\n    };\n    DragDrop.prototype.toString = function () {\n        var rtn = \"(DragDrop: \" + \"startX=\" + this._startX + \", startY=\" + this._startY + \", dragging=\" + this._dragging + \")\";\n        return rtn;\n    };\n    /** @internal */\n    DragDrop.prototype._onKeyPress = function (event) {\n        if (event.keyCode === 27) {\n            // esc\n            this._onDragCancel();\n        }\n    };\n    /** @internal */\n    DragDrop.prototype._onDragCancel = function () {\n        this._rootElement.removeEventListener(\"dragenter\", this._onDragEnter);\n        this._rootElement.removeEventListener(\"dragover\", this._onMouseMove);\n        this._rootElement.removeEventListener(\"dragleave\", this._onDragLeave);\n        this._document.removeEventListener(\"dragend\", this._onDragCancel);\n        this._document.removeEventListener(\"drop\", this._onMouseUp);\n        this._document.removeEventListener(\"mousemove\", this._onMouseMove);\n        this._document.removeEventListener(\"mouseup\", this._onMouseUp);\n        this._document.removeEventListener(\"touchend\", this._onMouseUp);\n        this._document.removeEventListener(\"touchmove\", this._onMouseMove);\n        this.hideGlass();\n        if (this._fDragCancel !== undefined) {\n            this._fDragCancel(this._dragging);\n        }\n        this._dragging = false;\n        this._active = false;\n    };\n    /** @internal */\n    DragDrop.prototype._getLocationEvent = function (event) {\n        var posEvent = event;\n        if (event && event.touches) {\n            posEvent = event.touches[0];\n        }\n        return posEvent;\n    };\n    /** @internal */\n    DragDrop.prototype._getLocationEventEnd = function (event) {\n        var posEvent = event;\n        if (event.changedTouches) {\n            posEvent = event.changedTouches[0];\n        }\n        return posEvent;\n    };\n    /** @internal */\n    DragDrop.prototype._stopPropagation = function (event) {\n        if (event.stopPropagation) {\n            event.stopPropagation();\n        }\n    };\n    /** @internal */\n    DragDrop.prototype._preventDefault = function (event) {\n        if (event.preventDefault && event.cancelable) {\n            event.preventDefault();\n        }\n        return event;\n    };\n    /** @internal */\n    DragDrop.prototype._onMouseMove = function (event) {\n        this._lastEvent = event;\n        var posEvent = this._getLocationEvent(event);\n        this._stopPropagation(event);\n        this._preventDefault(event);\n        if (!this._dragging && (Math.abs(this._startX - posEvent.clientX) > 5 || Math.abs(this._startY - posEvent.clientY) > 5)) {\n            this._dragging = true;\n            if (this._fDragStart) {\n                this._setDefaultGlassCursor(\"move\");\n                this._dragging = this._fDragStart({ clientX: this._startX, clientY: this._startY });\n            }\n        }\n        if (this._dragging) {\n            if (this._fDragMove) {\n                this._fDragMove(posEvent);\n            }\n        }\n        return false;\n    };\n    /** @internal */\n    DragDrop.prototype._onMouseUp = function (event) {\n        this._lastEvent = event;\n        var posEvent = this._getLocationEventEnd(event);\n        this._stopPropagation(event);\n        this._preventDefault(event);\n        this._active = false;\n        this._rootElement.removeEventListener(\"dragenter\", this._onDragEnter);\n        this._rootElement.removeEventListener(\"dragover\", this._onMouseMove);\n        this._rootElement.removeEventListener(\"dragleave\", this._onDragLeave);\n        this._document.removeEventListener(\"dragend\", this._onDragCancel);\n        this._document.removeEventListener(\"drop\", this._onMouseUp);\n        this._document.removeEventListener(\"mousemove\", this._onMouseMove);\n        this._document.removeEventListener(\"mouseup\", this._onMouseUp);\n        this._document.removeEventListener(\"touchend\", this._onMouseUp);\n        this._document.removeEventListener(\"touchmove\", this._onMouseMove);\n        if (!this._manualGlassManagement) {\n            this.hideGlass();\n        }\n        if (this._dragging) {\n            this._dragging = false;\n            if (this._fDragEnd) {\n                this._fDragEnd(event);\n            }\n            // dump(\"set dragging = false\\n\");\n        }\n        else {\n            if (this._fDragCancel) {\n                this._fDragCancel(this._dragging);\n            }\n            if (Math.abs(this._startX - posEvent.clientX) <= 5 && Math.abs(this._startY - posEvent.clientY) <= 5) {\n                var isDoubleClick = false;\n                var clickTime = new Date().getTime();\n                // check for double click\n                if (Math.abs(this._clickX - posEvent.clientX) <= 5 && Math.abs(this._clickY - posEvent.clientY) <= 5) {\n                    if (clickTime - this._lastClick < 500) {\n                        if (this._fDblClick) {\n                            this._fDblClick(event);\n                            isDoubleClick = true;\n                        }\n                    }\n                }\n                if (!isDoubleClick && this._fClick) {\n                    this._fClick(event);\n                }\n                this._lastClick = clickTime;\n                this._clickX = posEvent.clientX;\n                this._clickY = posEvent.clientY;\n            }\n        }\n        return false;\n    };\n    /** @internal */\n    DragDrop.prototype._onDragEnter = function (event) {\n        this._preventDefault(event);\n        this._stopPropagation(event);\n        this._dragDepth++;\n        return false;\n    };\n    /** @internal */\n    DragDrop.prototype._onDragLeave = function (event) {\n        this._preventDefault(event);\n        this._stopPropagation(event);\n        this._dragDepth--;\n        if (this._dragDepth <= 0) {\n            this._onDragCancel();\n        }\n        return false;\n    };\n    DragDrop.instance = new DragDrop();\n    return DragDrop;\n}());\nexports.DragDrop = DragDrop;\n\n\n//# sourceURL=webpack://FlexLayout/./src/DragDrop.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"DragDrop\": () => (/* binding */ DragDrop)\n/* harmony export */ });\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Rect */ \"./src/Rect.ts\");\n\r\n/** @internal */\r\nconst canUseDOM = !!(typeof window !== \"undefined\" && window.document && window.document.createElement);\r\nclass DragDrop {\r\n    /** @internal */\r\n    constructor() {\r\n        /** @internal */\r\n        this._manualGlassManagement = false;\r\n        /** @internal */\r\n        this._startX = 0;\r\n        /** @internal */\r\n        this._startY = 0;\r\n        /** @internal */\r\n        this._dragDepth = 0;\r\n        /** @internal */\r\n        this._glassShowing = false;\r\n        /** @internal */\r\n        this._dragging = false;\r\n        /** @internal */\r\n        this._active = false; // drag and drop is in progress, can be used on ios to prevent body scrolling (see demo)\r\n        if (canUseDOM) {\r\n            // check for serverside rendering\r\n            this._glass = document.createElement(\"div\");\r\n            this._glass.style.zIndex = \"998\";\r\n            this._glass.style.backgroundColor = \"transparent\";\r\n            this._glass.style.outline = \"none\";\r\n        }\r\n        this._defaultGlassCursor = \"default\";\r\n        this._onMouseMove = this._onMouseMove.bind(this);\r\n        this._onMouseUp = this._onMouseUp.bind(this);\r\n        this._onKeyPress = this._onKeyPress.bind(this);\r\n        this._onDragCancel = this._onDragCancel.bind(this);\r\n        this._onDragEnter = this._onDragEnter.bind(this);\r\n        this._onDragLeave = this._onDragLeave.bind(this);\r\n        this.resizeGlass = this.resizeGlass.bind(this);\r\n        this._lastClick = 0;\r\n        this._clickX = 0;\r\n        this._clickY = 0;\r\n    }\r\n    // if you add the glass pane then you should remove it\r\n    addGlass(fCancel) {\r\n        var _a;\r\n        if (!this._glassShowing) {\r\n            if (!this._document) {\r\n                this._document = window.document;\r\n            }\r\n            if (!this._rootElement) {\r\n                this._rootElement = this._document.body;\r\n            }\r\n            this.resizeGlass();\r\n            (_a = this._document.defaultView) === null || _a === void 0 ? void 0 : _a.addEventListener('resize', this.resizeGlass);\r\n            this._document.body.appendChild(this._glass);\r\n            this._glass.tabIndex = -1;\r\n            this._glass.focus();\r\n            this._glass.addEventListener(\"keydown\", this._onKeyPress);\r\n            this._glass.addEventListener(\"dragenter\", this._onDragEnter, { passive: false });\r\n            this._glass.addEventListener(\"dragover\", this._onMouseMove, { passive: false });\r\n            this._glass.addEventListener(\"dragleave\", this._onDragLeave, { passive: false });\r\n            this._glassShowing = true;\r\n            this._fDragCancel = fCancel;\r\n            this._manualGlassManagement = false;\r\n        }\r\n        else {\r\n            // second call to addGlass (via dragstart)\r\n            this._manualGlassManagement = true;\r\n        }\r\n    }\r\n    resizeGlass() {\r\n        const glassRect = _Rect__WEBPACK_IMPORTED_MODULE_0__.Rect.fromElement(this._rootElement);\r\n        glassRect.positionElement(this._glass, \"fixed\");\r\n    }\r\n    hideGlass() {\r\n        var _a;\r\n        if (this._glassShowing) {\r\n            this._document.body.removeChild(this._glass);\r\n            (_a = this._document.defaultView) === null || _a === void 0 ? void 0 : _a.removeEventListener('resize', this.resizeGlass);\r\n            this._glassShowing = false;\r\n            this._document = undefined;\r\n            this._rootElement = undefined;\r\n            this.setGlassCursorOverride(undefined);\r\n        }\r\n    }\r\n    /** @internal */\r\n    _updateGlassCursor() {\r\n        var _a;\r\n        this._glass.style.cursor = (_a = this._glassCursorOverride) !== null && _a !== void 0 ? _a : this._defaultGlassCursor;\r\n    }\r\n    /** @internal */\r\n    _setDefaultGlassCursor(cursor) {\r\n        this._defaultGlassCursor = cursor;\r\n        this._updateGlassCursor();\r\n    }\r\n    setGlassCursorOverride(cursor) {\r\n        this._glassCursorOverride = cursor;\r\n        this._updateGlassCursor();\r\n    }\r\n    startDrag(event, fDragStart, fDragMove, fDragEnd, fDragCancel, fClick, fDblClick, currentDocument, rootElement) {\r\n        // prevent 'duplicate' action (mouse event for same action as previous touch event (a fix for ios))\r\n        if (event && this._lastEvent && this._lastEvent.type.startsWith(\"touch\") && event.type.startsWith(\"mouse\") && event.timeStamp - this._lastEvent.timeStamp < 500) {\r\n            return;\r\n        }\r\n        this._lastEvent = event;\r\n        if (currentDocument) {\r\n            this._document = currentDocument;\r\n        }\r\n        else {\r\n            this._document = window.document;\r\n        }\r\n        if (rootElement) {\r\n            this._rootElement = rootElement;\r\n        }\r\n        else {\r\n            this._rootElement = this._document.body;\r\n        }\r\n        const posEvent = this._getLocationEvent(event);\r\n        this.addGlass(fDragCancel);\r\n        if (this._dragging) {\r\n            console.warn(\"this._dragging true on startDrag should never happen\");\r\n        }\r\n        if (event) {\r\n            this._startX = posEvent.clientX;\r\n            this._startY = posEvent.clientY;\r\n            if (!window.matchMedia || window.matchMedia(\"(pointer: fine)\").matches) {\r\n                this._setDefaultGlassCursor(getComputedStyle(event.target).cursor);\r\n            }\r\n            this._stopPropagation(event);\r\n            this._preventDefault(event);\r\n        }\r\n        else {\r\n            this._startX = 0;\r\n            this._startY = 0;\r\n            this._setDefaultGlassCursor(\"default\");\r\n        }\r\n        this._dragging = false;\r\n        this._fDragStart = fDragStart;\r\n        this._fDragMove = fDragMove;\r\n        this._fDragEnd = fDragEnd;\r\n        this._fDragCancel = fDragCancel;\r\n        this._fClick = fClick;\r\n        this._fDblClick = fDblClick;\r\n        this._active = true;\r\n        if ((event === null || event === void 0 ? void 0 : event.type) === 'dragenter') {\r\n            this._dragDepth = 1;\r\n            this._rootElement.addEventListener(\"dragenter\", this._onDragEnter, { passive: false });\r\n            this._rootElement.addEventListener(\"dragover\", this._onMouseMove, { passive: false });\r\n            this._rootElement.addEventListener(\"dragleave\", this._onDragLeave, { passive: false });\r\n            this._document.addEventListener(\"dragend\", this._onDragCancel, { passive: false });\r\n            this._document.addEventListener(\"drop\", this._onMouseUp, { passive: false });\r\n        }\r\n        else {\r\n            this._document.addEventListener(\"mouseup\", this._onMouseUp, { passive: false });\r\n            this._document.addEventListener(\"mousemove\", this._onMouseMove, { passive: false });\r\n            this._document.addEventListener(\"touchend\", this._onMouseUp, { passive: false });\r\n            this._document.addEventListener(\"touchmove\", this._onMouseMove, { passive: false });\r\n        }\r\n    }\r\n    isDragging() {\r\n        return this._dragging;\r\n    }\r\n    isActive() {\r\n        return this._active;\r\n    }\r\n    toString() {\r\n        const rtn = \"(DragDrop: \" + \"startX=\" + this._startX + \", startY=\" + this._startY + \", dragging=\" + this._dragging + \")\";\r\n        return rtn;\r\n    }\r\n    /** @internal */\r\n    _onKeyPress(event) {\r\n        if (event.keyCode === 27) {\r\n            // esc\r\n            this._onDragCancel();\r\n        }\r\n    }\r\n    /** @internal */\r\n    _onDragCancel() {\r\n        this._rootElement.removeEventListener(\"dragenter\", this._onDragEnter);\r\n        this._rootElement.removeEventListener(\"dragover\", this._onMouseMove);\r\n        this._rootElement.removeEventListener(\"dragleave\", this._onDragLeave);\r\n        this._document.removeEventListener(\"dragend\", this._onDragCancel);\r\n        this._document.removeEventListener(\"drop\", this._onMouseUp);\r\n        this._document.removeEventListener(\"mousemove\", this._onMouseMove);\r\n        this._document.removeEventListener(\"mouseup\", this._onMouseUp);\r\n        this._document.removeEventListener(\"touchend\", this._onMouseUp);\r\n        this._document.removeEventListener(\"touchmove\", this._onMouseMove);\r\n        this.hideGlass();\r\n        if (this._fDragCancel !== undefined) {\r\n            this._fDragCancel(this._dragging);\r\n        }\r\n        this._dragging = false;\r\n        this._active = false;\r\n    }\r\n    /** @internal */\r\n    _getLocationEvent(event) {\r\n        let posEvent = event;\r\n        if (event && event.touches) {\r\n            posEvent = event.touches[0];\r\n        }\r\n        return posEvent;\r\n    }\r\n    /** @internal */\r\n    _getLocationEventEnd(event) {\r\n        let posEvent = event;\r\n        if (event.changedTouches) {\r\n            posEvent = event.changedTouches[0];\r\n        }\r\n        return posEvent;\r\n    }\r\n    /** @internal */\r\n    _stopPropagation(event) {\r\n        if (event.stopPropagation) {\r\n            event.stopPropagation();\r\n        }\r\n    }\r\n    /** @internal */\r\n    _preventDefault(event) {\r\n        if (event.preventDefault && event.cancelable) {\r\n            event.preventDefault();\r\n        }\r\n        return event;\r\n    }\r\n    /** @internal */\r\n    _onMouseMove(event) {\r\n        this._lastEvent = event;\r\n        const posEvent = this._getLocationEvent(event);\r\n        this._stopPropagation(event);\r\n        this._preventDefault(event);\r\n        if (!this._dragging && (Math.abs(this._startX - posEvent.clientX) > 5 || Math.abs(this._startY - posEvent.clientY) > 5)) {\r\n            this._dragging = true;\r\n            if (this._fDragStart) {\r\n                this._setDefaultGlassCursor(\"move\");\r\n                this._dragging = this._fDragStart({ clientX: this._startX, clientY: this._startY });\r\n            }\r\n        }\r\n        if (this._dragging) {\r\n            if (this._fDragMove) {\r\n                this._fDragMove(posEvent);\r\n            }\r\n        }\r\n        return false;\r\n    }\r\n    /** @internal */\r\n    _onMouseUp(event) {\r\n        this._lastEvent = event;\r\n        const posEvent = this._getLocationEventEnd(event);\r\n        this._stopPropagation(event);\r\n        this._preventDefault(event);\r\n        this._active = false;\r\n        this._rootElement.removeEventListener(\"dragenter\", this._onDragEnter);\r\n        this._rootElement.removeEventListener(\"dragover\", this._onMouseMove);\r\n        this._rootElement.removeEventListener(\"dragleave\", this._onDragLeave);\r\n        this._document.removeEventListener(\"dragend\", this._onDragCancel);\r\n        this._document.removeEventListener(\"drop\", this._onMouseUp);\r\n        this._document.removeEventListener(\"mousemove\", this._onMouseMove);\r\n        this._document.removeEventListener(\"mouseup\", this._onMouseUp);\r\n        this._document.removeEventListener(\"touchend\", this._onMouseUp);\r\n        this._document.removeEventListener(\"touchmove\", this._onMouseMove);\r\n        if (!this._manualGlassManagement) {\r\n            this.hideGlass();\r\n        }\r\n        if (this._dragging) {\r\n            this._dragging = false;\r\n            if (this._fDragEnd) {\r\n                this._fDragEnd(event);\r\n            }\r\n            // dump(\"set dragging = false\\n\");\r\n        }\r\n        else {\r\n            if (this._fDragCancel) {\r\n                this._fDragCancel(this._dragging);\r\n            }\r\n            if (Math.abs(this._startX - posEvent.clientX) <= 5 && Math.abs(this._startY - posEvent.clientY) <= 5) {\r\n                let isDoubleClick = false;\r\n                const clickTime = new Date().getTime();\r\n                // check for double click\r\n                if (Math.abs(this._clickX - posEvent.clientX) <= 5 && Math.abs(this._clickY - posEvent.clientY) <= 5) {\r\n                    if (clickTime - this._lastClick < 500) {\r\n                        if (this._fDblClick) {\r\n                            this._fDblClick(event);\r\n                            isDoubleClick = true;\r\n                        }\r\n                    }\r\n                }\r\n                if (!isDoubleClick && this._fClick) {\r\n                    this._fClick(event);\r\n                }\r\n                this._lastClick = clickTime;\r\n                this._clickX = posEvent.clientX;\r\n                this._clickY = posEvent.clientY;\r\n            }\r\n        }\r\n        return false;\r\n    }\r\n    /** @internal */\r\n    _onDragEnter(event) {\r\n        this._preventDefault(event);\r\n        this._stopPropagation(event);\r\n        this._dragDepth++;\r\n        return false;\r\n    }\r\n    /** @internal */\r\n    _onDragLeave(event) {\r\n        this._preventDefault(event);\r\n        this._stopPropagation(event);\r\n        this._dragDepth--;\r\n        if (this._dragDepth <= 0) {\r\n            this._onDragCancel();\r\n        }\r\n        return false;\r\n    }\r\n}\r\nDragDrop.instance = new DragDrop();\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/DragDrop.ts?");
 
 /***/ }),
 
@@ -214,9 +114,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*************************!*\
   !*** ./src/DropInfo.ts ***!
   \*************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.DropInfo = void 0;\nvar DropInfo = /** @class */ (function () {\n    function DropInfo(node, rect, location, index, className) {\n        this.node = node;\n        this.rect = rect;\n        this.location = location;\n        this.index = index;\n        this.className = className;\n    }\n    return DropInfo;\n}());\nexports.DropInfo = DropInfo;\n\n\n//# sourceURL=webpack://FlexLayout/./src/DropInfo.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"DropInfo\": () => (/* binding */ DropInfo)\n/* harmony export */ });\nclass DropInfo {\r\n    constructor(node, rect, location, index, className) {\r\n        this.node = node;\r\n        this.rect = rect;\r\n        this.location = location;\r\n        this.index = index;\r\n        this.className = className;\r\n    }\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/DropInfo.ts?");
 
 /***/ }),
 
@@ -224,9 +124,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!**************************!*\
   !*** ./src/I18nLabel.ts ***!
   \**************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.I18nLabel = void 0;\nvar I18nLabel;\n(function (I18nLabel) {\n    I18nLabel[\"Close_Tab\"] = \"Close\";\n    I18nLabel[\"Close_Tabset\"] = \"Close tabset\";\n    I18nLabel[\"Move_Tab\"] = \"Move: \";\n    I18nLabel[\"Move_Tabset\"] = \"Move tabset\";\n    I18nLabel[\"Maximize\"] = \"Maximize tabset\";\n    I18nLabel[\"Restore\"] = \"Restore tabset\";\n    I18nLabel[\"Float_Tab\"] = \"Show selected tab in floating window\";\n    I18nLabel[\"Overflow_Menu_Tooltip\"] = \"Hidden tabs\";\n    I18nLabel[\"Floating_Window_Message\"] = \"This panel is shown in a floating window\";\n    I18nLabel[\"Floating_Window_Show_Window\"] = \"Show window\";\n    I18nLabel[\"Floating_Window_Dock_Window\"] = \"Dock window\";\n    I18nLabel[\"Error_rendering_component\"] = \"Error rendering component\";\n})(I18nLabel = exports.I18nLabel || (exports.I18nLabel = {}));\n\n\n//# sourceURL=webpack://FlexLayout/./src/I18nLabel.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"I18nLabel\": () => (/* binding */ I18nLabel)\n/* harmony export */ });\nvar I18nLabel;\r\n(function (I18nLabel) {\r\n    I18nLabel[\"Close_Tab\"] = \"Close\";\r\n    I18nLabel[\"Close_Tabset\"] = \"Close tabset\";\r\n    I18nLabel[\"Move_Tab\"] = \"Move: \";\r\n    I18nLabel[\"Move_Tabset\"] = \"Move tabset\";\r\n    I18nLabel[\"Maximize\"] = \"Maximize tabset\";\r\n    I18nLabel[\"Restore\"] = \"Restore tabset\";\r\n    I18nLabel[\"Float_Tab\"] = \"Show selected tab in floating window\";\r\n    I18nLabel[\"Overflow_Menu_Tooltip\"] = \"Hidden tabs\";\r\n    I18nLabel[\"Floating_Window_Message\"] = \"This panel is shown in a floating window\";\r\n    I18nLabel[\"Floating_Window_Show_Window\"] = \"Show window\";\r\n    I18nLabel[\"Floating_Window_Dock_Window\"] = \"Dock window\";\r\n    I18nLabel[\"Error_rendering_component\"] = \"Error rendering component\";\r\n})(I18nLabel || (I18nLabel = {}));\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/I18nLabel.ts?");
 
 /***/ }),
 
@@ -234,9 +134,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!****************************!*\
   !*** ./src/Orientation.ts ***!
   \****************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Orientation = void 0;\nvar Orientation = /** @class */ (function () {\n    /** @internal */\n    function Orientation(name) {\n        this._name = name;\n    }\n    Orientation.flip = function (from) {\n        if (from === Orientation.HORZ) {\n            return Orientation.VERT;\n        }\n        else {\n            return Orientation.HORZ;\n        }\n    };\n    Orientation.prototype.getName = function () {\n        return this._name;\n    };\n    Orientation.prototype.toString = function () {\n        return this._name;\n    };\n    Orientation.HORZ = new Orientation(\"horz\");\n    Orientation.VERT = new Orientation(\"vert\");\n    return Orientation;\n}());\nexports.Orientation = Orientation;\n\n\n//# sourceURL=webpack://FlexLayout/./src/Orientation.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Orientation\": () => (/* binding */ Orientation)\n/* harmony export */ });\nclass Orientation {\r\n    /** @internal */\r\n    constructor(name) {\r\n        this._name = name;\r\n    }\r\n    static flip(from) {\r\n        if (from === Orientation.HORZ) {\r\n            return Orientation.VERT;\r\n        }\r\n        else {\r\n            return Orientation.HORZ;\r\n        }\r\n    }\r\n    getName() {\r\n        return this._name;\r\n    }\r\n    toString() {\r\n        return this._name;\r\n    }\r\n}\r\nOrientation.HORZ = new Orientation(\"horz\");\r\nOrientation.VERT = new Orientation(\"vert\");\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/Orientation.ts?");
 
 /***/ }),
 
@@ -244,9 +144,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!***************************!*\
   !*** ./src/PopupMenu.tsx ***!
   \***************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.showPopup = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar DragDrop_1 = __webpack_require__(/*! ./DragDrop */ \"./src/DragDrop.ts\");\nvar Types_1 = __webpack_require__(/*! ./Types */ \"./src/Types.ts\");\nvar TabButtonStamp_1 = __webpack_require__(/*! ./view/TabButtonStamp */ \"./src/view/TabButtonStamp.tsx\");\n/** @internal */\nfunction showPopup(triggerElement, items, onSelect, layout, iconFactory, titleFactory) {\n    var layoutDiv = layout.getRootDiv();\n    var classNameMapper = layout.getClassName;\n    var currentDocument = triggerElement.ownerDocument;\n    var triggerRect = triggerElement.getBoundingClientRect();\n    var layoutRect = layoutDiv.getBoundingClientRect();\n    var elm = currentDocument.createElement(\"div\");\n    elm.className = classNameMapper(Types_1.CLASSES.FLEXLAYOUT__POPUP_MENU_CONTAINER);\n    if (triggerRect.left < layoutRect.left + layoutRect.width / 2) {\n        elm.style.left = triggerRect.left - layoutRect.left + \"px\";\n    }\n    else {\n        elm.style.right = layoutRect.right - triggerRect.right + \"px\";\n    }\n    if (triggerRect.top < layoutRect.top + layoutRect.height / 2) {\n        elm.style.top = triggerRect.top - layoutRect.top + \"px\";\n    }\n    else {\n        elm.style.bottom = layoutRect.bottom - triggerRect.bottom + \"px\";\n    }\n    DragDrop_1.DragDrop.instance.addGlass(function () { return onHide(); });\n    DragDrop_1.DragDrop.instance.setGlassCursorOverride(\"default\");\n    layoutDiv.appendChild(elm);\n    var onHide = function () {\n        layout.hidePortal();\n        DragDrop_1.DragDrop.instance.hideGlass();\n        layoutDiv.removeChild(elm);\n        elm.removeEventListener(\"mousedown\", onElementMouseDown);\n        currentDocument.removeEventListener(\"mousedown\", onDocMouseDown);\n    };\n    var onElementMouseDown = function (event) {\n        event.stopPropagation();\n    };\n    var onDocMouseDown = function (event) {\n        onHide();\n    };\n    elm.addEventListener(\"mousedown\", onElementMouseDown);\n    currentDocument.addEventListener(\"mousedown\", onDocMouseDown);\n    layout.showPortal(React.createElement(PopupMenu, { currentDocument: currentDocument, onSelect: onSelect, onHide: onHide, items: items, classNameMapper: classNameMapper, layout: layout, iconFactory: iconFactory, titleFactory: titleFactory }), elm);\n}\nexports.showPopup = showPopup;\n/** @internal */\nvar PopupMenu = function (props) {\n    var items = props.items, onHide = props.onHide, onSelect = props.onSelect, classNameMapper = props.classNameMapper, layout = props.layout, iconFactory = props.iconFactory, titleFactory = props.titleFactory;\n    var onItemClick = function (item, event) {\n        onSelect(item);\n        onHide();\n        event.stopPropagation();\n    };\n    var itemElements = items.map(function (item, i) { return (React.createElement(\"div\", { key: item.index, className: classNameMapper(Types_1.CLASSES.FLEXLAYOUT__POPUP_MENU_ITEM), \"data-layout-path\": \"/popup-menu/tb\" + i, onClick: function (event) { return onItemClick(item, event); }, title: item.node.getHelpText() }, item.node.getModel().isLegacyOverflowMenu() ?\n        item.node._getNameForOverflowMenu() :\n        React.createElement(TabButtonStamp_1.TabButtonStamp, { node: item.node, layout: layout, iconFactory: iconFactory, titleFactory: titleFactory }))); });\n    return (React.createElement(\"div\", { className: classNameMapper(Types_1.CLASSES.FLEXLAYOUT__POPUP_MENU), \"data-layout-path\": \"/popup-menu\" }, itemElements));\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/PopupMenu.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"showPopup\": () => (/* binding */ showPopup)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _DragDrop__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DragDrop */ \"./src/DragDrop.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Types */ \"./src/Types.ts\");\n/* harmony import */ var _view_TabButtonStamp__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./view/TabButtonStamp */ \"./src/view/TabButtonStamp.tsx\");\n\r\n\r\n\r\n\r\n/** @internal */\r\nfunction showPopup(triggerElement, items, onSelect, layout, iconFactory, titleFactory) {\r\n    const layoutDiv = layout.getRootDiv();\r\n    const classNameMapper = layout.getClassName;\r\n    const currentDocument = triggerElement.ownerDocument;\r\n    const triggerRect = triggerElement.getBoundingClientRect();\r\n    const layoutRect = layoutDiv.getBoundingClientRect();\r\n    const elm = currentDocument.createElement(\"div\");\r\n    elm.className = classNameMapper(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__POPUP_MENU_CONTAINER);\r\n    if (triggerRect.left < layoutRect.left + layoutRect.width / 2) {\r\n        elm.style.left = triggerRect.left - layoutRect.left + \"px\";\r\n    }\r\n    else {\r\n        elm.style.right = layoutRect.right - triggerRect.right + \"px\";\r\n    }\r\n    if (triggerRect.top < layoutRect.top + layoutRect.height / 2) {\r\n        elm.style.top = triggerRect.top - layoutRect.top + \"px\";\r\n    }\r\n    else {\r\n        elm.style.bottom = layoutRect.bottom - triggerRect.bottom + \"px\";\r\n    }\r\n    _DragDrop__WEBPACK_IMPORTED_MODULE_1__.DragDrop.instance.addGlass(() => onHide());\r\n    _DragDrop__WEBPACK_IMPORTED_MODULE_1__.DragDrop.instance.setGlassCursorOverride(\"default\");\r\n    layoutDiv.appendChild(elm);\r\n    const onHide = () => {\r\n        layout.hidePortal();\r\n        _DragDrop__WEBPACK_IMPORTED_MODULE_1__.DragDrop.instance.hideGlass();\r\n        layoutDiv.removeChild(elm);\r\n        elm.removeEventListener(\"mousedown\", onElementMouseDown);\r\n        currentDocument.removeEventListener(\"mousedown\", onDocMouseDown);\r\n    };\r\n    const onElementMouseDown = (event) => {\r\n        event.stopPropagation();\r\n    };\r\n    const onDocMouseDown = (event) => {\r\n        onHide();\r\n    };\r\n    elm.addEventListener(\"mousedown\", onElementMouseDown);\r\n    currentDocument.addEventListener(\"mousedown\", onDocMouseDown);\r\n    layout.showPortal(react__WEBPACK_IMPORTED_MODULE_0__.createElement(PopupMenu, { currentDocument: currentDocument, onSelect: onSelect, onHide: onHide, items: items, classNameMapper: classNameMapper, layout: layout, iconFactory: iconFactory, titleFactory: titleFactory }), elm);\r\n}\r\n/** @internal */\r\nconst PopupMenu = (props) => {\r\n    const { items, onHide, onSelect, classNameMapper, layout, iconFactory, titleFactory } = props;\r\n    const onItemClick = (item, event) => {\r\n        onSelect(item);\r\n        onHide();\r\n        event.stopPropagation();\r\n    };\r\n    const itemElements = items.map((item, i) => (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: item.index, className: classNameMapper(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__POPUP_MENU_ITEM), \"data-layout-path\": \"/popup-menu/tb\" + i, onClick: (event) => onItemClick(item, event), title: item.node.getHelpText() }, item.node.getModel().isLegacyOverflowMenu() ?\r\n        item.node._getNameForOverflowMenu() :\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(_view_TabButtonStamp__WEBPACK_IMPORTED_MODULE_3__.TabButtonStamp, { node: item.node, layout: layout, iconFactory: iconFactory, titleFactory: titleFactory }))));\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classNameMapper(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__POPUP_MENU), \"data-layout-path\": \"/popup-menu\" }, itemElements));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/PopupMenu.tsx?");
 
 /***/ }),
 
@@ -254,9 +154,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*********************!*\
   !*** ./src/Rect.ts ***!
   \*********************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Rect = void 0;\nvar Orientation_1 = __webpack_require__(/*! ./Orientation */ \"./src/Orientation.ts\");\nvar Rect = /** @class */ (function () {\n    function Rect(x, y, width, height) {\n        this.x = x;\n        this.y = y;\n        this.width = width;\n        this.height = height;\n    }\n    Rect.empty = function () {\n        return new Rect(0, 0, 0, 0);\n    };\n    Rect.fromElement = function (element) {\n        var _a = element.getBoundingClientRect(), x = _a.x, y = _a.y, width = _a.width, height = _a.height;\n        return new Rect(x, y, width, height);\n    };\n    Rect.prototype.clone = function () {\n        return new Rect(this.x, this.y, this.width, this.height);\n    };\n    Rect.prototype.equals = function (rect) {\n        if (this.x === rect.x && this.y === rect.y && this.width === rect.width && this.height === rect.height) {\n            return true;\n        }\n        else {\n            return false;\n        }\n    };\n    Rect.prototype.getBottom = function () {\n        return this.y + this.height;\n    };\n    Rect.prototype.getRight = function () {\n        return this.x + this.width;\n    };\n    Rect.prototype.getCenter = function () {\n        return { x: this.x + this.width / 2, y: this.y + this.height / 2 };\n    };\n    Rect.prototype.positionElement = function (element, position) {\n        this.styleWithPosition(element.style, position);\n    };\n    Rect.prototype.styleWithPosition = function (style, position) {\n        if (position === void 0) { position = \"absolute\"; }\n        style.left = this.x + \"px\";\n        style.top = this.y + \"px\";\n        style.width = Math.max(0, this.width) + \"px\"; // need Math.max to prevent -ve, cause error in IE\n        style.height = Math.max(0, this.height) + \"px\";\n        style.position = position;\n        return style;\n    };\n    Rect.prototype.contains = function (x, y) {\n        if (this.x <= x && x <= this.getRight() && this.y <= y && y <= this.getBottom()) {\n            return true;\n        }\n        else {\n            return false;\n        }\n    };\n    Rect.prototype.removeInsets = function (insets) {\n        return new Rect(this.x + insets.left, this.y + insets.top, Math.max(0, this.width - insets.left - insets.right), Math.max(0, this.height - insets.top - insets.bottom));\n    };\n    Rect.prototype.centerInRect = function (outerRect) {\n        this.x = (outerRect.width - this.width) / 2;\n        this.y = (outerRect.height - this.height) / 2;\n    };\n    /** @internal */\n    Rect.prototype._getSize = function (orientation) {\n        var prefSize = this.width;\n        if (orientation === Orientation_1.Orientation.VERT) {\n            prefSize = this.height;\n        }\n        return prefSize;\n    };\n    Rect.prototype.toString = function () {\n        return \"(Rect: x=\" + this.x + \", y=\" + this.y + \", width=\" + this.width + \", height=\" + this.height + \")\";\n    };\n    return Rect;\n}());\nexports.Rect = Rect;\n\n\n//# sourceURL=webpack://FlexLayout/./src/Rect.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Rect\": () => (/* binding */ Rect)\n/* harmony export */ });\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Orientation */ \"./src/Orientation.ts\");\n\r\nclass Rect {\r\n    constructor(x, y, width, height) {\r\n        this.x = x;\r\n        this.y = y;\r\n        this.width = width;\r\n        this.height = height;\r\n    }\r\n    static empty() {\r\n        return new Rect(0, 0, 0, 0);\r\n    }\r\n    static fromElement(element) {\r\n        let { x, y, width, height } = element.getBoundingClientRect();\r\n        return new Rect(x, y, width, height);\r\n    }\r\n    clone() {\r\n        return new Rect(this.x, this.y, this.width, this.height);\r\n    }\r\n    equals(rect) {\r\n        if (this.x === rect.x && this.y === rect.y && this.width === rect.width && this.height === rect.height) {\r\n            return true;\r\n        }\r\n        else {\r\n            return false;\r\n        }\r\n    }\r\n    getBottom() {\r\n        return this.y + this.height;\r\n    }\r\n    getRight() {\r\n        return this.x + this.width;\r\n    }\r\n    getCenter() {\r\n        return { x: this.x + this.width / 2, y: this.y + this.height / 2 };\r\n    }\r\n    positionElement(element, position) {\r\n        this.styleWithPosition(element.style, position);\r\n    }\r\n    styleWithPosition(style, position = \"absolute\") {\r\n        style.left = this.x + \"px\";\r\n        style.top = this.y + \"px\";\r\n        style.width = Math.max(0, this.width) + \"px\"; // need Math.max to prevent -ve, cause error in IE\r\n        style.height = Math.max(0, this.height) + \"px\";\r\n        style.position = position;\r\n        return style;\r\n    }\r\n    contains(x, y) {\r\n        if (this.x <= x && x <= this.getRight() && this.y <= y && y <= this.getBottom()) {\r\n            return true;\r\n        }\r\n        else {\r\n            return false;\r\n        }\r\n    }\r\n    removeInsets(insets) {\r\n        return new Rect(this.x + insets.left, this.y + insets.top, Math.max(0, this.width - insets.left - insets.right), Math.max(0, this.height - insets.top - insets.bottom));\r\n    }\r\n    centerInRect(outerRect) {\r\n        this.x = (outerRect.width - this.width) / 2;\r\n        this.y = (outerRect.height - this.height) / 2;\r\n    }\r\n    /** @internal */\r\n    _getSize(orientation) {\r\n        let prefSize = this.width;\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.VERT) {\r\n            prefSize = this.height;\r\n        }\r\n        return prefSize;\r\n    }\r\n    toString() {\r\n        return \"(Rect: x=\" + this.x + \", y=\" + this.y + \", width=\" + this.width + \", height=\" + this.height + \")\";\r\n    }\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/Rect.ts?");
 
 /***/ }),
 
@@ -264,9 +164,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!**********************!*\
   !*** ./src/Types.ts ***!
   \**********************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.CLASSES = void 0;\nvar CLASSES;\n(function (CLASSES) {\n    CLASSES[\"FLEXLAYOUT__BORDER\"] = \"flexlayout__border\";\n    CLASSES[\"FLEXLAYOUT__BORDER_\"] = \"flexlayout__border_\";\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON\"] = \"flexlayout__border_button\";\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_\"] = \"flexlayout__border_button_\";\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_CONTENT\"] = \"flexlayout__border_button_content\";\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_LEADING\"] = \"flexlayout__border_button_leading\";\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_TRAILING\"] = \"flexlayout__border_button_trailing\";\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON__SELECTED\"] = \"flexlayout__border_button--selected\";\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON__UNSELECTED\"] = \"flexlayout__border_button--unselected\";\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW\"] = \"flexlayout__border_toolbar_button_overflow\";\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_\"] = \"flexlayout__border_toolbar_button_overflow_\";\n    CLASSES[\"FLEXLAYOUT__BORDER_INNER\"] = \"flexlayout__border_inner\";\n    CLASSES[\"FLEXLAYOUT__BORDER_INNER_\"] = \"flexlayout__border_inner_\";\n    CLASSES[\"FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER\"] = \"flexlayout__border_inner_tab_container\";\n    CLASSES[\"FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_\"] = \"flexlayout__border_inner_tab_container_\";\n    CLASSES[\"FLEXLAYOUT__BORDER_TAB_DIVIDER\"] = \"flexlayout__border_tab_divider\";\n    CLASSES[\"FLEXLAYOUT__BORDER_SIZER\"] = \"flexlayout__border_sizer\";\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR\"] = \"flexlayout__border_toolbar\";\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_\"] = \"flexlayout__border_toolbar_\";\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON\"] = \"flexlayout__border_toolbar_button\";\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT\"] = \"flexlayout__border_toolbar_button-float\";\n    CLASSES[\"FLEXLAYOUT__DRAG_RECT\"] = \"flexlayout__drag_rect\";\n    CLASSES[\"FLEXLAYOUT__EDGE_RECT\"] = \"flexlayout__edge_rect\";\n    CLASSES[\"FLEXLAYOUT__ERROR_BOUNDARY_CONTAINER\"] = \"flexlayout__error_boundary_container\";\n    CLASSES[\"FLEXLAYOUT__ERROR_BOUNDARY_CONTENT\"] = \"flexlayout__error_boundary_content\";\n    CLASSES[\"FLEXLAYOUT__FLOATING_WINDOW_CONTENT\"] = \"flexlayout__floating_window_content\";\n    CLASSES[\"FLEXLAYOUT__FLOATING_WINDOW_TAB\"] = \"flexlayout__floating_window_tab\";\n    CLASSES[\"FLEXLAYOUT__LAYOUT\"] = \"flexlayout__layout\";\n    CLASSES[\"FLEXLAYOUT__OUTLINE_RECT\"] = \"flexlayout__outline_rect\";\n    CLASSES[\"FLEXLAYOUT__OUTLINE_RECT_EDGE\"] = \"flexlayout__outline_rect_edge\";\n    CLASSES[\"FLEXLAYOUT__SPLITTER\"] = \"flexlayout__splitter\";\n    CLASSES[\"FLEXLAYOUT__SPLITTER_EXTRA\"] = \"flexlayout__splitter_extra\";\n    CLASSES[\"FLEXLAYOUT__SPLITTER_\"] = \"flexlayout__splitter_\";\n    CLASSES[\"FLEXLAYOUT__SPLITTER_BORDER\"] = \"flexlayout__splitter_border\";\n    CLASSES[\"FLEXLAYOUT__SPLITTER_DRAG\"] = \"flexlayout__splitter_drag\";\n    CLASSES[\"FLEXLAYOUT__TAB\"] = \"flexlayout__tab\";\n    CLASSES[\"FLEXLAYOUT__TABSET\"] = \"flexlayout__tabset\";\n    CLASSES[\"FLEXLAYOUT__TABSET_HEADER\"] = \"flexlayout__tabset_header\";\n    CLASSES[\"FLEXLAYOUT__TABSET_HEADER_SIZER\"] = \"flexlayout__tabset_header_sizer\";\n    CLASSES[\"FLEXLAYOUT__TABSET_HEADER_CONTENT\"] = \"flexlayout__tabset_header_content\";\n    CLASSES[\"FLEXLAYOUT__TABSET_MAXIMIZED\"] = \"flexlayout__tabset-maximized\";\n    CLASSES[\"FLEXLAYOUT__TABSET_SELECTED\"] = \"flexlayout__tabset-selected\";\n    CLASSES[\"FLEXLAYOUT__TABSET_SIZER\"] = \"flexlayout__tabset_sizer\";\n    CLASSES[\"FLEXLAYOUT__TABSET_TAB_DIVIDER\"] = \"flexlayout__tabset_tab_divider\";\n    CLASSES[\"FLEXLAYOUT__TABSET_CONTENT\"] = \"flexlayout__tabset_content\";\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER\"] = \"flexlayout__tabset_tabbar_inner\";\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_\"] = \"flexlayout__tabset_tabbar_inner_\";\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER\"] = \"flexlayout__tabset_tabbar_inner_tab_container\";\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_\"] = \"flexlayout__tabset_tabbar_inner_tab_container_\";\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_OUTER\"] = \"flexlayout__tabset_tabbar_outer\";\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_OUTER_\"] = \"flexlayout__tabset_tabbar_outer_\";\n    CLASSES[\"FLEXLAYOUT__TAB_BORDER\"] = \"flexlayout__tab_border\";\n    CLASSES[\"FLEXLAYOUT__TAB_BORDER_\"] = \"flexlayout__tab_border_\";\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON\"] = \"flexlayout__tab_button\";\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_CONTENT\"] = \"flexlayout__tab_button_content\";\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_LEADING\"] = \"flexlayout__tab_button_leading\";\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_OVERFLOW\"] = \"flexlayout__tab_button_overflow\";\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT\"] = \"flexlayout__tab_button_overflow_count\";\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_TEXTBOX\"] = \"flexlayout__tab_button_textbox\";\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_TRAILING\"] = \"flexlayout__tab_button_trailing\";\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_STAMP\"] = \"flexlayout__tab_button_stamp\";\n    CLASSES[\"FLEXLAYOUT__TAB_FLOATING\"] = \"flexlayout__tab_floating\";\n    CLASSES[\"FLEXLAYOUT__TAB_FLOATING_INNER\"] = \"flexlayout__tab_floating_inner\";\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR\"] = \"flexlayout__tab_toolbar\";\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON\"] = \"flexlayout__tab_toolbar_button\";\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_\"] = \"flexlayout__tab_toolbar_button-\";\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT\"] = \"flexlayout__tab_toolbar_button-float\";\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER\"] = \"flexlayout__tab_toolbar_sticky_buttons_container\";\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE\"] = \"flexlayout__tab_toolbar_button-close\";\n    CLASSES[\"FLEXLAYOUT__POPUP_MENU_CONTAINER\"] = \"flexlayout__popup_menu_container\";\n    CLASSES[\"FLEXLAYOUT__POPUP_MENU_ITEM\"] = \"flexlayout__popup_menu_item\";\n    CLASSES[\"FLEXLAYOUT__POPUP_MENU\"] = \"flexlayout__popup_menu\";\n})(CLASSES = exports.CLASSES || (exports.CLASSES = {}));\n\n\n//# sourceURL=webpack://FlexLayout/./src/Types.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"CLASSES\": () => (/* binding */ CLASSES)\n/* harmony export */ });\nvar CLASSES;\r\n(function (CLASSES) {\r\n    CLASSES[\"FLEXLAYOUT__BORDER\"] = \"flexlayout__border\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_\"] = \"flexlayout__border_\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON\"] = \"flexlayout__border_button\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_\"] = \"flexlayout__border_button_\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_CONTENT\"] = \"flexlayout__border_button_content\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_LEADING\"] = \"flexlayout__border_button_leading\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_TRAILING\"] = \"flexlayout__border_button_trailing\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON__SELECTED\"] = \"flexlayout__border_button--selected\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_BUTTON__UNSELECTED\"] = \"flexlayout__border_button--unselected\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW\"] = \"flexlayout__border_toolbar_button_overflow\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_\"] = \"flexlayout__border_toolbar_button_overflow_\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_INNER\"] = \"flexlayout__border_inner\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_INNER_\"] = \"flexlayout__border_inner_\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER\"] = \"flexlayout__border_inner_tab_container\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_\"] = \"flexlayout__border_inner_tab_container_\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_TAB_DIVIDER\"] = \"flexlayout__border_tab_divider\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_SIZER\"] = \"flexlayout__border_sizer\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR\"] = \"flexlayout__border_toolbar\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_\"] = \"flexlayout__border_toolbar_\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON\"] = \"flexlayout__border_toolbar_button\";\r\n    CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT\"] = \"flexlayout__border_toolbar_button-float\";\r\n    CLASSES[\"FLEXLAYOUT__DRAG_RECT\"] = \"flexlayout__drag_rect\";\r\n    CLASSES[\"FLEXLAYOUT__EDGE_RECT\"] = \"flexlayout__edge_rect\";\r\n    CLASSES[\"FLEXLAYOUT__ERROR_BOUNDARY_CONTAINER\"] = \"flexlayout__error_boundary_container\";\r\n    CLASSES[\"FLEXLAYOUT__ERROR_BOUNDARY_CONTENT\"] = \"flexlayout__error_boundary_content\";\r\n    CLASSES[\"FLEXLAYOUT__FLOATING_WINDOW_CONTENT\"] = \"flexlayout__floating_window_content\";\r\n    CLASSES[\"FLEXLAYOUT__FLOATING_WINDOW_TAB\"] = \"flexlayout__floating_window_tab\";\r\n    CLASSES[\"FLEXLAYOUT__LAYOUT\"] = \"flexlayout__layout\";\r\n    CLASSES[\"FLEXLAYOUT__OUTLINE_RECT\"] = \"flexlayout__outline_rect\";\r\n    CLASSES[\"FLEXLAYOUT__OUTLINE_RECT_EDGE\"] = \"flexlayout__outline_rect_edge\";\r\n    CLASSES[\"FLEXLAYOUT__SPLITTER\"] = \"flexlayout__splitter\";\r\n    CLASSES[\"FLEXLAYOUT__SPLITTER_EXTRA\"] = \"flexlayout__splitter_extra\";\r\n    CLASSES[\"FLEXLAYOUT__SPLITTER_\"] = \"flexlayout__splitter_\";\r\n    CLASSES[\"FLEXLAYOUT__SPLITTER_BORDER\"] = \"flexlayout__splitter_border\";\r\n    CLASSES[\"FLEXLAYOUT__SPLITTER_DRAG\"] = \"flexlayout__splitter_drag\";\r\n    CLASSES[\"FLEXLAYOUT__TAB\"] = \"flexlayout__tab\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET\"] = \"flexlayout__tabset\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_HEADER\"] = \"flexlayout__tabset_header\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_HEADER_SIZER\"] = \"flexlayout__tabset_header_sizer\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_HEADER_CONTENT\"] = \"flexlayout__tabset_header_content\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_MAXIMIZED\"] = \"flexlayout__tabset-maximized\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_SELECTED\"] = \"flexlayout__tabset-selected\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_SIZER\"] = \"flexlayout__tabset_sizer\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_TAB_DIVIDER\"] = \"flexlayout__tabset_tab_divider\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_CONTENT\"] = \"flexlayout__tabset_content\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER\"] = \"flexlayout__tabset_tabbar_inner\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_\"] = \"flexlayout__tabset_tabbar_inner_\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER\"] = \"flexlayout__tabset_tabbar_inner_tab_container\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_\"] = \"flexlayout__tabset_tabbar_inner_tab_container_\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_OUTER\"] = \"flexlayout__tabset_tabbar_outer\";\r\n    CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_OUTER_\"] = \"flexlayout__tabset_tabbar_outer_\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BORDER\"] = \"flexlayout__tab_border\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BORDER_\"] = \"flexlayout__tab_border_\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON\"] = \"flexlayout__tab_button\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_CONTENT\"] = \"flexlayout__tab_button_content\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_LEADING\"] = \"flexlayout__tab_button_leading\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_OVERFLOW\"] = \"flexlayout__tab_button_overflow\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT\"] = \"flexlayout__tab_button_overflow_count\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_TEXTBOX\"] = \"flexlayout__tab_button_textbox\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_TRAILING\"] = \"flexlayout__tab_button_trailing\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_BUTTON_STAMP\"] = \"flexlayout__tab_button_stamp\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_FLOATING\"] = \"flexlayout__tab_floating\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_FLOATING_INNER\"] = \"flexlayout__tab_floating_inner\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR\"] = \"flexlayout__tab_toolbar\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON\"] = \"flexlayout__tab_toolbar_button\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_\"] = \"flexlayout__tab_toolbar_button-\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT\"] = \"flexlayout__tab_toolbar_button-float\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER\"] = \"flexlayout__tab_toolbar_sticky_buttons_container\";\r\n    CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE\"] = \"flexlayout__tab_toolbar_button-close\";\r\n    CLASSES[\"FLEXLAYOUT__POPUP_MENU_CONTAINER\"] = \"flexlayout__popup_menu_container\";\r\n    CLASSES[\"FLEXLAYOUT__POPUP_MENU_ITEM\"] = \"flexlayout__popup_menu_item\";\r\n    CLASSES[\"FLEXLAYOUT__POPUP_MENU\"] = \"flexlayout__popup_menu\";\r\n})(CLASSES || (CLASSES = {}));\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/Types.ts?");
 
 /***/ }),
 
@@ -274,9 +174,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!**********************!*\
   !*** ./src/index.ts ***!
   \**********************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    var desc = Object.getOwnPropertyDescriptor(m, k);\n    if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n      desc = { enumerable: true, get: function() { return m[k]; } };\n    }\n    Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    o[k2] = m[k];\n}));\nvar __exportStar = (this && this.__exportStar) || function(m, exports) {\n    for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n__exportStar(__webpack_require__(/*! ./view/Layout */ \"./src/view/Layout.tsx\"), exports);\n__exportStar(__webpack_require__(/*! ./model/Action */ \"./src/model/Action.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/Actions */ \"./src/model/Actions.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/BorderNode */ \"./src/model/BorderNode.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/BorderSet */ \"./src/model/BorderSet.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/ICloseType */ \"./src/model/ICloseType.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/IDraggable */ \"./src/model/IDraggable.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/IDropTarget */ \"./src/model/IDropTarget.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/IJsonModel */ \"./src/model/IJsonModel.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/Model */ \"./src/model/Model.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/Node */ \"./src/model/Node.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/RowNode */ \"./src/model/RowNode.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/SplitterNode */ \"./src/model/SplitterNode.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/TabNode */ \"./src/model/TabNode.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./model/TabSetNode */ \"./src/model/TabSetNode.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./DockLocation */ \"./src/DockLocation.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./DragDrop */ \"./src/DragDrop.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./DropInfo */ \"./src/DropInfo.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./I18nLabel */ \"./src/I18nLabel.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./Orientation */ \"./src/Orientation.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./Rect */ \"./src/Rect.ts\"), exports);\n__exportStar(__webpack_require__(/*! ./Types */ \"./src/Types.ts\"), exports);\n\n\n//# sourceURL=webpack://FlexLayout/./src/index.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Action\": () => (/* reexport safe */ _model_Action__WEBPACK_IMPORTED_MODULE_1__.Action),\n/* harmony export */   \"Actions\": () => (/* reexport safe */ _model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions),\n/* harmony export */   \"BorderNode\": () => (/* reexport safe */ _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__.BorderNode),\n/* harmony export */   \"BorderSet\": () => (/* reexport safe */ _model_BorderSet__WEBPACK_IMPORTED_MODULE_4__.BorderSet),\n/* harmony export */   \"CLASSES\": () => (/* reexport safe */ _Types__WEBPACK_IMPORTED_MODULE_21__.CLASSES),\n/* harmony export */   \"DockLocation\": () => (/* reexport safe */ _DockLocation__WEBPACK_IMPORTED_MODULE_15__.DockLocation),\n/* harmony export */   \"DragDrop\": () => (/* reexport safe */ _DragDrop__WEBPACK_IMPORTED_MODULE_16__.DragDrop),\n/* harmony export */   \"DropInfo\": () => (/* reexport safe */ _DropInfo__WEBPACK_IMPORTED_MODULE_17__.DropInfo),\n/* harmony export */   \"I18nLabel\": () => (/* reexport safe */ _I18nLabel__WEBPACK_IMPORTED_MODULE_18__.I18nLabel),\n/* harmony export */   \"ICloseType\": () => (/* reexport safe */ _model_ICloseType__WEBPACK_IMPORTED_MODULE_5__.ICloseType),\n/* harmony export */   \"Layout\": () => (/* reexport safe */ _view_Layout__WEBPACK_IMPORTED_MODULE_0__.Layout),\n/* harmony export */   \"Model\": () => (/* reexport safe */ _model_Model__WEBPACK_IMPORTED_MODULE_9__.Model),\n/* harmony export */   \"Node\": () => (/* reexport safe */ _model_Node__WEBPACK_IMPORTED_MODULE_10__.Node),\n/* harmony export */   \"Orientation\": () => (/* reexport safe */ _Orientation__WEBPACK_IMPORTED_MODULE_19__.Orientation),\n/* harmony export */   \"Rect\": () => (/* reexport safe */ _Rect__WEBPACK_IMPORTED_MODULE_20__.Rect),\n/* harmony export */   \"RowNode\": () => (/* reexport safe */ _model_RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode),\n/* harmony export */   \"SplitterNode\": () => (/* reexport safe */ _model_SplitterNode__WEBPACK_IMPORTED_MODULE_12__.SplitterNode),\n/* harmony export */   \"TabNode\": () => (/* reexport safe */ _model_TabNode__WEBPACK_IMPORTED_MODULE_13__.TabNode),\n/* harmony export */   \"TabSetNode\": () => (/* reexport safe */ _model_TabSetNode__WEBPACK_IMPORTED_MODULE_14__.TabSetNode)\n/* harmony export */ });\n/* harmony import */ var _view_Layout__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./view/Layout */ \"./src/view/Layout.tsx\");\n/* harmony import */ var _model_Action__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./model/Action */ \"./src/model/Action.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_BorderSet__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./model/BorderSet */ \"./src/model/BorderSet.ts\");\n/* harmony import */ var _model_ICloseType__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./model/ICloseType */ \"./src/model/ICloseType.ts\");\n/* harmony import */ var _model_IDraggable__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./model/IDraggable */ \"./src/model/IDraggable.ts\");\n/* harmony import */ var _model_IDropTarget__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./model/IDropTarget */ \"./src/model/IDropTarget.ts\");\n/* harmony import */ var _model_IJsonModel__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./model/IJsonModel */ \"./src/model/IJsonModel.ts\");\n/* harmony import */ var _model_Model__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./model/Model */ \"./src/model/Model.ts\");\n/* harmony import */ var _model_Node__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./model/Node */ \"./src/model/Node.ts\");\n/* harmony import */ var _model_RowNode__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./model/RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _model_SplitterNode__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./model/SplitterNode */ \"./src/model/SplitterNode.ts\");\n/* harmony import */ var _model_TabNode__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./model/TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DragDrop__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./DragDrop */ \"./src/DragDrop.ts\");\n/* harmony import */ var _DropInfo__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./DropInfo */ \"./src/DropInfo.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./Types */ \"./src/Types.ts\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/index.ts?");
 
 /***/ }),
 
@@ -284,9 +184,9 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /*!*****************************!*\
   !*** ./src/model/Action.ts ***!
   \*****************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Action = void 0;\nvar Action = /** @class */ (function () {\n    function Action(type, data) {\n        this.type = type;\n        this.data = data;\n    }\n    return Action;\n}());\nexports.Action = Action;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Action.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Action\": () => (/* binding */ Action)\n/* harmony export */ });\nclass Action {\r\n    constructor(type, data) {\r\n        this.type = type;\r\n        this.data = data;\r\n    }\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Action.ts?");
 
 /***/ }),
 
@@ -294,9 +194,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!******************************!*\
   !*** ./src/model/Actions.ts ***!
   \******************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Actions = void 0;\nvar Action_1 = __webpack_require__(/*! ./Action */ \"./src/model/Action.ts\");\n/**\n * The Action creator class for FlexLayout model actions\n */\nvar Actions = /** @class */ (function () {\n    function Actions() {\n    }\n    /**\n     * Adds a tab node to the given tabset node\n     * @param json the json for the new tab node e.g {type:\"tab\", component:\"table\"}\n     * @param toNodeId the new tab node will be added to the tabset with this node id\n     * @param location the location where the new tab will be added, one of the DockLocation enum values.\n     * @param index for docking to the center this value is the index of the tab, use -1 to add to the end.\n     * @param select (optional) whether to select the new tab, overriding autoSelectTab\n     * @returns {Action} the action\n     */\n    Actions.addNode = function (json, toNodeId, location, index, select) {\n        return new Action_1.Action(Actions.ADD_NODE, {\n            json: json,\n            toNode: toNodeId,\n            location: location.getName(),\n            index: index,\n            select: select,\n        });\n    };\n    /**\n     * Moves a node (tab or tabset) from one location to another\n     * @param fromNodeId the id of the node to move\n     * @param toNodeId the id of the node to receive the moved node\n     * @param location the location where the moved node will be added, one of the DockLocation enum values.\n     * @param index for docking to the center this value is the index of the tab, use -1 to add to the end.\n     * @param select (optional) whether to select the moved tab(s) in new tabset, overriding autoSelectTab\n     * @returns {Action} the action\n     */\n    Actions.moveNode = function (fromNodeId, toNodeId, location, index, select) {\n        return new Action_1.Action(Actions.MOVE_NODE, {\n            fromNode: fromNodeId,\n            toNode: toNodeId,\n            location: location.getName(),\n            index: index,\n            select: select,\n        });\n    };\n    /**\n     * Deletes a tab node from the layout\n     * @param tabsetNodeId the id of the tab node to delete\n     * @returns {Action} the action\n     */\n    Actions.deleteTab = function (tabNodeId) {\n        return new Action_1.Action(Actions.DELETE_TAB, { node: tabNodeId });\n    };\n    /**\n     * Deletes a tabset node and all it's child tab nodes from the layout\n     * @param tabsetNodeId the id of the tabset node to delete\n     * @returns {Action} the action\n     */\n    Actions.deleteTabset = function (tabsetNodeId) {\n        return new Action_1.Action(Actions.DELETE_TABSET, { node: tabsetNodeId });\n    };\n    /**\n     * Change the given nodes tab text\n     * @param tabNodeId the id of the node to rename\n     * @param text the test of the tab\n     * @returns {Action} the action\n     */\n    Actions.renameTab = function (tabNodeId, text) {\n        return new Action_1.Action(Actions.RENAME_TAB, { node: tabNodeId, text: text });\n    };\n    /**\n     * Selects the given tab in its parent tabset\n     * @param tabNodeId the id of the node to set selected\n     * @returns {Action} the action\n     */\n    Actions.selectTab = function (tabNodeId) {\n        return new Action_1.Action(Actions.SELECT_TAB, { tabNode: tabNodeId });\n    };\n    /**\n     * Set the given tabset node as the active tabset\n     * @param tabsetNodeId the id of the tabset node to set as active\n     * @returns {Action} the action\n     */\n    Actions.setActiveTabset = function (tabsetNodeId) {\n        return new Action_1.Action(Actions.SET_ACTIVE_TABSET, { tabsetNode: tabsetNodeId });\n    };\n    /**\n     * Adjust the splitter between two tabsets\n     * @example\n     *  Actions.adjustSplit({node1: \"1\", weight1:30, pixelWidth1:300, node2: \"2\", weight2:70, pixelWidth2:700});\n     *\n     * @param splitSpec an object the defines the new split between two tabsets, see example below.\n     * @returns {Action} the action\n     */\n    Actions.adjustSplit = function (splitSpec) {\n        var node1 = splitSpec.node1Id;\n        var node2 = splitSpec.node2Id;\n        return new Action_1.Action(Actions.ADJUST_SPLIT, {\n            node1: node1,\n            weight1: splitSpec.weight1,\n            pixelWidth1: splitSpec.pixelWidth1,\n            node2: node2,\n            weight2: splitSpec.weight2,\n            pixelWidth2: splitSpec.pixelWidth2,\n        });\n    };\n    Actions.adjustBorderSplit = function (nodeId, pos) {\n        return new Action_1.Action(Actions.ADJUST_BORDER_SPLIT, { node: nodeId, pos: pos });\n    };\n    /**\n     * Maximizes the given tabset\n     * @param tabsetNodeId the id of the tabset to maximize\n     * @returns {Action} the action\n     */\n    Actions.maximizeToggle = function (tabsetNodeId) {\n        return new Action_1.Action(Actions.MAXIMIZE_TOGGLE, { node: tabsetNodeId });\n    };\n    /**\n     * Updates the global model jsone attributes\n     * @param attributes the json for the model attributes to update (merge into the existing attributes)\n     * @returns {Action} the action\n     */\n    Actions.updateModelAttributes = function (attributes) {\n        return new Action_1.Action(Actions.UPDATE_MODEL_ATTRIBUTES, { json: attributes });\n    };\n    /**\n     * Updates the given nodes json attributes\n     * @param nodeId the id of the node to update\n     * @param attributes the json attributes to update (merge with the existing attributes)\n     * @returns {Action} the action\n     */\n    Actions.updateNodeAttributes = function (nodeId, attributes) {\n        return new Action_1.Action(Actions.UPDATE_NODE_ATTRIBUTES, { node: nodeId, json: attributes });\n    };\n    Actions.floatTab = function (nodeId) {\n        return new Action_1.Action(Actions.FLOAT_TAB, { node: nodeId });\n    };\n    Actions.unFloatTab = function (nodeId) {\n        return new Action_1.Action(Actions.UNFLOAT_TAB, { node: nodeId });\n    };\n    Actions.ADD_NODE = \"FlexLayout_AddNode\";\n    Actions.MOVE_NODE = \"FlexLayout_MoveNode\";\n    Actions.DELETE_TAB = \"FlexLayout_DeleteTab\";\n    Actions.DELETE_TABSET = \"FlexLayout_DeleteTabset\";\n    Actions.RENAME_TAB = \"FlexLayout_RenameTab\";\n    Actions.SELECT_TAB = \"FlexLayout_SelectTab\";\n    Actions.SET_ACTIVE_TABSET = \"FlexLayout_SetActiveTabset\";\n    Actions.ADJUST_SPLIT = \"FlexLayout_AdjustSplit\";\n    Actions.ADJUST_BORDER_SPLIT = \"FlexLayout_AdjustBorderSplit\";\n    Actions.MAXIMIZE_TOGGLE = \"FlexLayout_MaximizeToggle\";\n    Actions.UPDATE_MODEL_ATTRIBUTES = \"FlexLayout_UpdateModelAttributes\";\n    Actions.UPDATE_NODE_ATTRIBUTES = \"FlexLayout_UpdateNodeAttributes\";\n    Actions.FLOAT_TAB = \"FlexLayout_FloatTab\";\n    Actions.UNFLOAT_TAB = \"FlexLayout_UnFloatTab\";\n    return Actions;\n}());\nexports.Actions = Actions;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Actions.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Actions\": () => (/* binding */ Actions)\n/* harmony export */ });\n/* harmony import */ var _Action__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Action */ \"./src/model/Action.ts\");\n\r\n/**\r\n * The Action creator class for FlexLayout model actions\r\n */\r\nclass Actions {\r\n    /**\r\n     * Adds a tab node to the given tabset node\r\n     * @param json the json for the new tab node e.g {type:\"tab\", component:\"table\"}\r\n     * @param toNodeId the new tab node will be added to the tabset with this node id\r\n     * @param location the location where the new tab will be added, one of the DockLocation enum values.\r\n     * @param index for docking to the center this value is the index of the tab, use -1 to add to the end.\r\n     * @param select (optional) whether to select the new tab, overriding autoSelectTab\r\n     * @returns {Action} the action\r\n     */\r\n    static addNode(json, toNodeId, location, index, select) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.ADD_NODE, {\r\n            json,\r\n            toNode: toNodeId,\r\n            location: location.getName(),\r\n            index,\r\n            select,\r\n        });\r\n    }\r\n    /**\r\n     * Moves a node (tab or tabset) from one location to another\r\n     * @param fromNodeId the id of the node to move\r\n     * @param toNodeId the id of the node to receive the moved node\r\n     * @param location the location where the moved node will be added, one of the DockLocation enum values.\r\n     * @param index for docking to the center this value is the index of the tab, use -1 to add to the end.\r\n     * @param select (optional) whether to select the moved tab(s) in new tabset, overriding autoSelectTab\r\n     * @returns {Action} the action\r\n     */\r\n    static moveNode(fromNodeId, toNodeId, location, index, select) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.MOVE_NODE, {\r\n            fromNode: fromNodeId,\r\n            toNode: toNodeId,\r\n            location: location.getName(),\r\n            index,\r\n            select,\r\n        });\r\n    }\r\n    /**\r\n     * Deletes a tab node from the layout\r\n     * @param tabsetNodeId the id of the tab node to delete\r\n     * @returns {Action} the action\r\n     */\r\n    static deleteTab(tabNodeId) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.DELETE_TAB, { node: tabNodeId });\r\n    }\r\n    /**\r\n     * Deletes a tabset node and all it's child tab nodes from the layout\r\n     * @param tabsetNodeId the id of the tabset node to delete\r\n     * @returns {Action} the action\r\n     */\r\n    static deleteTabset(tabsetNodeId) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.DELETE_TABSET, { node: tabsetNodeId });\r\n    }\r\n    /**\r\n     * Change the given nodes tab text\r\n     * @param tabNodeId the id of the node to rename\r\n     * @param text the test of the tab\r\n     * @returns {Action} the action\r\n     */\r\n    static renameTab(tabNodeId, text) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.RENAME_TAB, { node: tabNodeId, text });\r\n    }\r\n    /**\r\n     * Selects the given tab in its parent tabset\r\n     * @param tabNodeId the id of the node to set selected\r\n     * @returns {Action} the action\r\n     */\r\n    static selectTab(tabNodeId) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.SELECT_TAB, { tabNode: tabNodeId });\r\n    }\r\n    /**\r\n     * Set the given tabset node as the active tabset\r\n     * @param tabsetNodeId the id of the tabset node to set as active\r\n     * @returns {Action} the action\r\n     */\r\n    static setActiveTabset(tabsetNodeId) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.SET_ACTIVE_TABSET, { tabsetNode: tabsetNodeId });\r\n    }\r\n    /**\r\n     * Adjust the splitter between two tabsets\r\n     * @example\r\n     *  Actions.adjustSplit({node1: \"1\", weight1:30, pixelWidth1:300, node2: \"2\", weight2:70, pixelWidth2:700});\r\n     *\r\n     * @param splitSpec an object the defines the new split between two tabsets, see example below.\r\n     * @returns {Action} the action\r\n     */\r\n    static adjustSplit(splitSpec) {\r\n        const node1 = splitSpec.node1Id;\r\n        const node2 = splitSpec.node2Id;\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.ADJUST_SPLIT, {\r\n            node1,\r\n            weight1: splitSpec.weight1,\r\n            pixelWidth1: splitSpec.pixelWidth1,\r\n            node2,\r\n            weight2: splitSpec.weight2,\r\n            pixelWidth2: splitSpec.pixelWidth2,\r\n        });\r\n    }\r\n    static adjustBorderSplit(nodeId, pos) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.ADJUST_BORDER_SPLIT, { node: nodeId, pos });\r\n    }\r\n    /**\r\n     * Maximizes the given tabset\r\n     * @param tabsetNodeId the id of the tabset to maximize\r\n     * @returns {Action} the action\r\n     */\r\n    static maximizeToggle(tabsetNodeId) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.MAXIMIZE_TOGGLE, { node: tabsetNodeId });\r\n    }\r\n    /**\r\n     * Updates the global model jsone attributes\r\n     * @param attributes the json for the model attributes to update (merge into the existing attributes)\r\n     * @returns {Action} the action\r\n     */\r\n    static updateModelAttributes(attributes) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.UPDATE_MODEL_ATTRIBUTES, { json: attributes });\r\n    }\r\n    /**\r\n     * Updates the given nodes json attributes\r\n     * @param nodeId the id of the node to update\r\n     * @param attributes the json attributes to update (merge with the existing attributes)\r\n     * @returns {Action} the action\r\n     */\r\n    static updateNodeAttributes(nodeId, attributes) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.UPDATE_NODE_ATTRIBUTES, { node: nodeId, json: attributes });\r\n    }\r\n    static floatTab(nodeId) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.FLOAT_TAB, { node: nodeId });\r\n    }\r\n    static unFloatTab(nodeId) {\r\n        return new _Action__WEBPACK_IMPORTED_MODULE_0__.Action(Actions.UNFLOAT_TAB, { node: nodeId });\r\n    }\r\n}\r\nActions.ADD_NODE = \"FlexLayout_AddNode\";\r\nActions.MOVE_NODE = \"FlexLayout_MoveNode\";\r\nActions.DELETE_TAB = \"FlexLayout_DeleteTab\";\r\nActions.DELETE_TABSET = \"FlexLayout_DeleteTabset\";\r\nActions.RENAME_TAB = \"FlexLayout_RenameTab\";\r\nActions.SELECT_TAB = \"FlexLayout_SelectTab\";\r\nActions.SET_ACTIVE_TABSET = \"FlexLayout_SetActiveTabset\";\r\nActions.ADJUST_SPLIT = \"FlexLayout_AdjustSplit\";\r\nActions.ADJUST_BORDER_SPLIT = \"FlexLayout_AdjustBorderSplit\";\r\nActions.MAXIMIZE_TOGGLE = \"FlexLayout_MaximizeToggle\";\r\nActions.UPDATE_MODEL_ATTRIBUTES = \"FlexLayout_UpdateModelAttributes\";\r\nActions.UPDATE_NODE_ATTRIBUTES = \"FlexLayout_UpdateNodeAttributes\";\r\nActions.FLOAT_TAB = \"FlexLayout_FloatTab\";\r\nActions.UNFLOAT_TAB = \"FlexLayout_UnFloatTab\";\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Actions.ts?");
 
 /***/ }),
 
@@ -304,9 +204,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*********************************!*\
   !*** ./src/model/BorderNode.ts ***!
   \*********************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        if (typeof b !== \"function\" && b !== null)\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.BorderNode = void 0;\nvar Attribute_1 = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\nvar AttributeDefinitions_1 = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\nvar DockLocation_1 = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\nvar DropInfo_1 = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar Node_1 = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\nvar SplitterNode_1 = __webpack_require__(/*! ./SplitterNode */ \"./src/model/SplitterNode.ts\");\nvar TabNode_1 = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\nvar BorderNode = /** @class */ (function (_super) {\n    __extends(BorderNode, _super);\n    /** @internal */\n    function BorderNode(location, json, model) {\n        var _this = _super.call(this, model) || this;\n        /** @internal */\n        _this._adjustedSize = 0;\n        /** @internal */\n        _this._calculatedBorderBarSize = 0;\n        _this._location = location;\n        _this._drawChildren = [];\n        _this._attributes.id = \"border_\".concat(location.getName());\n        BorderNode._attributeDefinitions.fromJson(json, _this._attributes);\n        model._addNode(_this);\n        return _this;\n    }\n    /** @internal */\n    BorderNode._fromJson = function (json, model) {\n        var location = DockLocation_1.DockLocation.getByName(json.location);\n        var border = new BorderNode(location, json, model);\n        if (json.children) {\n            border._children = json.children.map(function (jsonChild) {\n                var child = TabNode_1.TabNode._fromJson(jsonChild, model);\n                child._setParent(border);\n                return child;\n            });\n        }\n        return border;\n    };\n    /** @internal */\n    BorderNode._createAttributeDefinitions = function () {\n        var attributeDefinitions = new AttributeDefinitions_1.AttributeDefinitions();\n        attributeDefinitions.add(\"type\", BorderNode.TYPE, true).setType(Attribute_1.Attribute.STRING).setFixed();\n        attributeDefinitions.add(\"selected\", -1).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"show\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"config\", undefined).setType(\"any\");\n        attributeDefinitions.addInherited(\"barSize\", \"borderBarSize\").setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.addInherited(\"enableDrop\", \"borderEnableDrop\").setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"className\", \"borderClassName\").setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.addInherited(\"autoSelectTabWhenOpen\", \"borderAutoSelectTabWhenOpen\").setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"autoSelectTabWhenClosed\", \"borderAutoSelectTabWhenClosed\").setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"size\", \"borderSize\").setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.addInherited(\"minSize\", \"borderMinSize\").setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.addInherited(\"enableAutoHide\", \"borderEnableAutoHide\").setType(Attribute_1.Attribute.BOOLEAN);\n        return attributeDefinitions;\n    };\n    BorderNode.prototype.getLocation = function () {\n        return this._location;\n    };\n    BorderNode.prototype.getTabHeaderRect = function () {\n        return this._tabHeaderRect;\n    };\n    BorderNode.prototype.getRect = function () {\n        return this._tabHeaderRect;\n    };\n    BorderNode.prototype.getContentRect = function () {\n        return this._contentRect;\n    };\n    BorderNode.prototype.isEnableDrop = function () {\n        return this._getAttr(\"enableDrop\");\n    };\n    BorderNode.prototype.isAutoSelectTab = function (whenOpen) {\n        if (whenOpen == null) {\n            whenOpen = this.getSelected() !== -1;\n        }\n        if (whenOpen) {\n            return this._getAttr(\"autoSelectTabWhenOpen\");\n        }\n        else {\n            return this._getAttr(\"autoSelectTabWhenClosed\");\n        }\n    };\n    BorderNode.prototype.getClassName = function () {\n        return this._getAttr(\"className\");\n    };\n    /** @internal */\n    BorderNode.prototype.calcBorderBarSize = function (metrics) {\n        var barSize = this._getAttr(\"barSize\");\n        if (barSize !== 0) {\n            // its defined\n            this._calculatedBorderBarSize = barSize;\n        }\n        else {\n            this._calculatedBorderBarSize = metrics.borderBarSize;\n        }\n    };\n    BorderNode.prototype.getBorderBarSize = function () {\n        return this._calculatedBorderBarSize;\n    };\n    BorderNode.prototype.getSize = function () {\n        var defaultSize = this._getAttr(\"size\");\n        var selected = this.getSelected();\n        if (selected === -1) {\n            return defaultSize;\n        }\n        else {\n            var tabNode = this._children[selected];\n            var tabBorderSize = (this._location._orientation === Orientation_1.Orientation.HORZ) ? tabNode._getAttr(\"borderWidth\") : tabNode._getAttr(\"borderHeight\");\n            if (tabBorderSize === -1) {\n                return defaultSize;\n            }\n            else {\n                return tabBorderSize;\n            }\n        }\n    };\n    BorderNode.prototype.getMinSize = function () {\n        return this._getAttr(\"minSize\");\n    };\n    BorderNode.prototype.getSelected = function () {\n        return this._attributes.selected;\n    };\n    BorderNode.prototype.getSelectedNode = function () {\n        if (this.getSelected() !== -1) {\n            return this._children[this.getSelected()];\n        }\n        return undefined;\n    };\n    BorderNode.prototype.getOrientation = function () {\n        return this._location.getOrientation();\n    };\n    /**\n     * Returns the config attribute that can be used to store node specific data that\n     * WILL be saved to the json. The config attribute should be changed via the action Actions.updateNodeAttributes rather\n     * than directly, for example:\n     * this.state.model.doAction(\n     *   FlexLayout.Actions.updateNodeAttributes(node.getId(), {config:myConfigObject}));\n     */\n    BorderNode.prototype.getConfig = function () {\n        return this._attributes.config;\n    };\n    BorderNode.prototype.isMaximized = function () {\n        return false;\n    };\n    BorderNode.prototype.isShowing = function () {\n        var show = this._attributes.show;\n        if (show) {\n            if (this._model._getShowHiddenBorder() !== this._location && this.isAutoHide() && this._children.length === 0) {\n                return false;\n            }\n            return true;\n        }\n        else {\n            return false;\n        }\n    };\n    BorderNode.prototype.isAutoHide = function () {\n        return this._getAttr(\"enableAutoHide\");\n    };\n    /** @internal */\n    BorderNode.prototype._setSelected = function (index) {\n        this._attributes.selected = index;\n    };\n    /** @internal */\n    BorderNode.prototype._setSize = function (pos) {\n        var selected = this.getSelected();\n        if (selected === -1) {\n            this._attributes.size = pos;\n        }\n        else {\n            var tabNode = this._children[selected];\n            var tabBorderSize = (this._location._orientation === Orientation_1.Orientation.HORZ) ? tabNode._getAttr(\"borderWidth\") : tabNode._getAttr(\"borderHeight\");\n            if (tabBorderSize === -1) {\n                this._attributes.size = pos;\n            }\n            else {\n                if (this._location._orientation === Orientation_1.Orientation.HORZ) {\n                    tabNode._setBorderWidth(pos);\n                }\n                else {\n                    tabNode._setBorderHeight(pos);\n                }\n            }\n        }\n    };\n    /** @internal */\n    BorderNode.prototype._updateAttrs = function (json) {\n        BorderNode._attributeDefinitions.update(json, this._attributes);\n    };\n    /** @internal */\n    BorderNode.prototype._getDrawChildren = function () {\n        return this._drawChildren;\n    };\n    /** @internal */\n    BorderNode.prototype._setAdjustedSize = function (size) {\n        this._adjustedSize = size;\n    };\n    /** @internal */\n    BorderNode.prototype._getAdjustedSize = function () {\n        return this._adjustedSize;\n    };\n    /** @internal */\n    BorderNode.prototype._layoutBorderOuter = function (outer, metrics) {\n        this.calcBorderBarSize(metrics);\n        var split1 = this._location.split(outer, this.getBorderBarSize()); // split border outer\n        this._tabHeaderRect = split1.start;\n        return split1.end;\n    };\n    /** @internal */\n    BorderNode.prototype._layoutBorderInner = function (inner, metrics) {\n        this._drawChildren = [];\n        var location = this._location;\n        var split1 = location.split(inner, this._adjustedSize + this._model.getSplitterSize()); // split off tab contents\n        var split2 = location.reflect().split(split1.start, this._model.getSplitterSize()); // split contents into content and splitter\n        this._contentRect = split2.end;\n        for (var i = 0; i < this._children.length; i++) {\n            var child = this._children[i];\n            child._layout(this._contentRect, metrics);\n            child._setVisible(i === this.getSelected());\n            this._drawChildren.push(child);\n        }\n        if (this.getSelected() === -1) {\n            return inner;\n        }\n        else {\n            var newSplitter = new SplitterNode_1.SplitterNode(this._model);\n            newSplitter._setParent(this);\n            newSplitter._setRect(split2.start);\n            this._drawChildren.push(newSplitter);\n            return split1.end;\n        }\n    };\n    /** @internal */\n    BorderNode.prototype._remove = function (node) {\n        var removedIndex = this._removeChild(node);\n        if (this.getSelected() !== -1) {\n            (0, Utils_1.adjustSelectedIndex)(this, removedIndex);\n        }\n    };\n    /** @internal */\n    BorderNode.prototype.canDrop = function (dragNode, x, y) {\n        if (dragNode.getType() !== TabNode_1.TabNode.TYPE) {\n            return undefined;\n        }\n        var dropInfo;\n        var dockLocation = DockLocation_1.DockLocation.CENTER;\n        if (this._tabHeaderRect.contains(x, y)) {\n            if (this._location._orientation === Orientation_1.Orientation.VERT) {\n                if (this._children.length > 0) {\n                    var child = this._children[0];\n                    var childRect = child.getTabRect();\n                    var childY = childRect.y;\n                    var childHeight = childRect.height;\n                    var pos = this._tabHeaderRect.x;\n                    var childCenter = 0;\n                    for (var i = 0; i < this._children.length; i++) {\n                        child = this._children[i];\n                        childRect = child.getTabRect();\n                        childCenter = childRect.x + childRect.width / 2;\n                        if (x >= pos && x < childCenter) {\n                            var outlineRect = new Rect_1.Rect(childRect.x - 2, childY, 3, childHeight);\n                            dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, i, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n                            break;\n                        }\n                        pos = childCenter;\n                    }\n                    if (dropInfo == null) {\n                        var outlineRect = new Rect_1.Rect(childRect.getRight() - 2, childY, 3, childHeight);\n                        dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, this._children.length, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n                    }\n                }\n                else {\n                    var outlineRect = new Rect_1.Rect(this._tabHeaderRect.x + 1, this._tabHeaderRect.y + 2, 3, 18);\n                    dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, 0, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n                }\n            }\n            else {\n                if (this._children.length > 0) {\n                    var child = this._children[0];\n                    var childRect = child.getTabRect();\n                    var childX = childRect.x;\n                    var childWidth = childRect.width;\n                    var pos = this._tabHeaderRect.y;\n                    var childCenter = 0;\n                    for (var i = 0; i < this._children.length; i++) {\n                        child = this._children[i];\n                        childRect = child.getTabRect();\n                        childCenter = childRect.y + childRect.height / 2;\n                        if (y >= pos && y < childCenter) {\n                            var outlineRect = new Rect_1.Rect(childX, childRect.y - 2, childWidth, 3);\n                            dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, i, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n                            break;\n                        }\n                        pos = childCenter;\n                    }\n                    if (dropInfo == null) {\n                        var outlineRect = new Rect_1.Rect(childX, childRect.getBottom() - 2, childWidth, 3);\n                        dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, this._children.length, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n                    }\n                }\n                else {\n                    var outlineRect = new Rect_1.Rect(this._tabHeaderRect.x + 2, this._tabHeaderRect.y + 1, 18, 3);\n                    dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, 0, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n                }\n            }\n            if (!dragNode._canDockInto(dragNode, dropInfo)) {\n                return undefined;\n            }\n        }\n        else if (this.getSelected() !== -1 && this._contentRect.contains(x, y)) {\n            var outlineRect = this._contentRect;\n            dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, -1, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n            if (!dragNode._canDockInto(dragNode, dropInfo)) {\n                return undefined;\n            }\n        }\n        return dropInfo;\n    };\n    /** @internal */\n    BorderNode.prototype.drop = function (dragNode, location, index, select) {\n        var fromIndex = 0;\n        var dragParent = dragNode.getParent();\n        if (dragParent !== undefined) {\n            fromIndex = dragParent._removeChild(dragNode);\n            // if selected node in border is being docked into a different border then deselect border tabs\n            if (dragParent !== this && dragParent instanceof BorderNode && dragParent.getSelected() === fromIndex) {\n                dragParent._setSelected(-1);\n            }\n            else {\n                (0, Utils_1.adjustSelectedIndex)(dragParent, fromIndex);\n            }\n        }\n        // if dropping a tab back to same tabset and moving to forward position then reduce insertion index\n        if (dragNode.getType() === TabNode_1.TabNode.TYPE && dragParent === this && fromIndex < index && index > 0) {\n            index--;\n        }\n        // simple_bundled dock to existing tabset\n        var insertPos = index;\n        if (insertPos === -1) {\n            insertPos = this._children.length;\n        }\n        if (dragNode.getType() === TabNode_1.TabNode.TYPE) {\n            this._addChild(dragNode, insertPos);\n        }\n        if (select || (select !== false && this.isAutoSelectTab())) {\n            this._setSelected(insertPos);\n        }\n        this._model._tidy();\n    };\n    BorderNode.prototype.toJson = function () {\n        var json = {};\n        BorderNode._attributeDefinitions.toJson(json, this._attributes);\n        json.location = this._location.getName();\n        json.children = this._children.map(function (child) { return child.toJson(); });\n        return json;\n    };\n    /** @internal */\n    BorderNode.prototype._getSplitterBounds = function (splitter, useMinSize) {\n        if (useMinSize === void 0) { useMinSize = false; }\n        var pBounds = [0, 0];\n        var minSize = useMinSize ? this.getMinSize() : 0;\n        var outerRect = this._model._getOuterInnerRects().outer;\n        var innerRect = this._model._getOuterInnerRects().inner;\n        var rootRow = this._model.getRoot();\n        if (this._location === DockLocation_1.DockLocation.TOP) {\n            pBounds[0] = outerRect.y + minSize;\n            pBounds[1] = Math.max(pBounds[0], innerRect.getBottom() - splitter.getHeight() - rootRow.getMinHeight());\n        }\n        else if (this._location === DockLocation_1.DockLocation.LEFT) {\n            pBounds[0] = outerRect.x + minSize;\n            pBounds[1] = Math.max(pBounds[0], innerRect.getRight() - splitter.getWidth() - rootRow.getMinWidth());\n        }\n        else if (this._location === DockLocation_1.DockLocation.BOTTOM) {\n            pBounds[1] = outerRect.getBottom() - splitter.getHeight() - minSize;\n            pBounds[0] = Math.min(pBounds[1], innerRect.y + rootRow.getMinHeight());\n        }\n        else if (this._location === DockLocation_1.DockLocation.RIGHT) {\n            pBounds[1] = outerRect.getRight() - splitter.getWidth() - minSize;\n            pBounds[0] = Math.min(pBounds[1], innerRect.x + rootRow.getMinWidth());\n        }\n        return pBounds;\n    };\n    /** @internal */\n    BorderNode.prototype._calculateSplit = function (splitter, splitterPos) {\n        var pBounds = this._getSplitterBounds(splitter);\n        if (this._location === DockLocation_1.DockLocation.BOTTOM || this._location === DockLocation_1.DockLocation.RIGHT) {\n            return Math.max(0, pBounds[1] - splitterPos);\n        }\n        else {\n            return Math.max(0, splitterPos - pBounds[0]);\n        }\n    };\n    /** @internal */\n    BorderNode.prototype._getAttributeDefinitions = function () {\n        return BorderNode._attributeDefinitions;\n    };\n    /** @internal */\n    BorderNode.getAttributeDefinitions = function () {\n        return BorderNode._attributeDefinitions;\n    };\n    BorderNode.TYPE = \"border\";\n    /** @internal */\n    BorderNode._attributeDefinitions = BorderNode._createAttributeDefinitions();\n    return BorderNode;\n}(Node_1.Node));\nexports.BorderNode = BorderNode;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/BorderNode.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"BorderNode\": () => (/* binding */ BorderNode)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DropInfo__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n/* harmony import */ var _SplitterNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./SplitterNode */ \"./src/model/SplitterNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass BorderNode extends _Node__WEBPACK_IMPORTED_MODULE_7__.Node {\r\n    /** @internal */\r\n    constructor(location, json, model) {\r\n        super(model);\r\n        /** @internal */\r\n        this._adjustedSize = 0;\r\n        /** @internal */\r\n        this._calculatedBorderBarSize = 0;\r\n        this._location = location;\r\n        this._drawChildren = [];\r\n        this._attributes.id = `border_${location.getName()}`;\r\n        BorderNode._attributeDefinitions.fromJson(json, this._attributes);\r\n        model._addNode(this);\r\n    }\r\n    /** @internal */\r\n    static _fromJson(json, model) {\r\n        const location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(json.location);\r\n        const border = new BorderNode(location, json, model);\r\n        if (json.children) {\r\n            border._children = json.children.map((jsonChild) => {\r\n                const child = _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode._fromJson(jsonChild, model);\r\n                child._setParent(border);\r\n                return child;\r\n            });\r\n        }\r\n        return border;\r\n    }\r\n    /** @internal */\r\n    static _createAttributeDefinitions() {\r\n        const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\r\n        attributeDefinitions.add(\"type\", BorderNode.TYPE, true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setFixed();\r\n        attributeDefinitions.add(\"selected\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"show\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"config\", undefined).setType(\"any\");\r\n        attributeDefinitions.addInherited(\"barSize\", \"borderBarSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.addInherited(\"enableDrop\", \"borderEnableDrop\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"className\", \"borderClassName\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.addInherited(\"autoSelectTabWhenOpen\", \"borderAutoSelectTabWhenOpen\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"autoSelectTabWhenClosed\", \"borderAutoSelectTabWhenClosed\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"size\", \"borderSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.addInherited(\"minSize\", \"borderMinSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.addInherited(\"enableAutoHide\", \"borderEnableAutoHide\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        return attributeDefinitions;\r\n    }\r\n    getLocation() {\r\n        return this._location;\r\n    }\r\n    getTabHeaderRect() {\r\n        return this._tabHeaderRect;\r\n    }\r\n    getRect() {\r\n        return this._tabHeaderRect;\r\n    }\r\n    getContentRect() {\r\n        return this._contentRect;\r\n    }\r\n    isEnableDrop() {\r\n        return this._getAttr(\"enableDrop\");\r\n    }\r\n    isAutoSelectTab(whenOpen) {\r\n        if (whenOpen == null) {\r\n            whenOpen = this.getSelected() !== -1;\r\n        }\r\n        if (whenOpen) {\r\n            return this._getAttr(\"autoSelectTabWhenOpen\");\r\n        }\r\n        else {\r\n            return this._getAttr(\"autoSelectTabWhenClosed\");\r\n        }\r\n    }\r\n    getClassName() {\r\n        return this._getAttr(\"className\");\r\n    }\r\n    /** @internal */\r\n    calcBorderBarSize(metrics) {\r\n        const barSize = this._getAttr(\"barSize\");\r\n        if (barSize !== 0) {\r\n            // its defined\r\n            this._calculatedBorderBarSize = barSize;\r\n        }\r\n        else {\r\n            this._calculatedBorderBarSize = metrics.borderBarSize;\r\n        }\r\n    }\r\n    getBorderBarSize() {\r\n        return this._calculatedBorderBarSize;\r\n    }\r\n    getSize() {\r\n        const defaultSize = this._getAttr(\"size\");\r\n        const selected = this.getSelected();\r\n        if (selected === -1) {\r\n            return defaultSize;\r\n        }\r\n        else {\r\n            const tabNode = this._children[selected];\r\n            const tabBorderSize = (this._location._orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) ? tabNode._getAttr(\"borderWidth\") : tabNode._getAttr(\"borderHeight\");\r\n            if (tabBorderSize === -1) {\r\n                return defaultSize;\r\n            }\r\n            else {\r\n                return tabBorderSize;\r\n            }\r\n        }\r\n    }\r\n    getMinSize() {\r\n        return this._getAttr(\"minSize\");\r\n    }\r\n    getSelected() {\r\n        return this._attributes.selected;\r\n    }\r\n    getSelectedNode() {\r\n        if (this.getSelected() !== -1) {\r\n            return this._children[this.getSelected()];\r\n        }\r\n        return undefined;\r\n    }\r\n    getOrientation() {\r\n        return this._location.getOrientation();\r\n    }\r\n    /**\r\n     * Returns the config attribute that can be used to store node specific data that\r\n     * WILL be saved to the json. The config attribute should be changed via the action Actions.updateNodeAttributes rather\r\n     * than directly, for example:\r\n     * this.state.model.doAction(\r\n     *   FlexLayout.Actions.updateNodeAttributes(node.getId(), {config:myConfigObject}));\r\n     */\r\n    getConfig() {\r\n        return this._attributes.config;\r\n    }\r\n    isMaximized() {\r\n        return false;\r\n    }\r\n    isShowing() {\r\n        const show = this._attributes.show;\r\n        if (show) {\r\n            if (this._model._getShowHiddenBorder() !== this._location && this.isAutoHide() && this._children.length === 0) {\r\n                return false;\r\n            }\r\n            return true;\r\n        }\r\n        else {\r\n            return false;\r\n        }\r\n    }\r\n    isAutoHide() {\r\n        return this._getAttr(\"enableAutoHide\");\r\n    }\r\n    /** @internal */\r\n    _setSelected(index) {\r\n        this._attributes.selected = index;\r\n    }\r\n    /** @internal */\r\n    _setSize(pos) {\r\n        const selected = this.getSelected();\r\n        if (selected === -1) {\r\n            this._attributes.size = pos;\r\n        }\r\n        else {\r\n            const tabNode = this._children[selected];\r\n            const tabBorderSize = (this._location._orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) ? tabNode._getAttr(\"borderWidth\") : tabNode._getAttr(\"borderHeight\");\r\n            if (tabBorderSize === -1) {\r\n                this._attributes.size = pos;\r\n            }\r\n            else {\r\n                if (this._location._orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\r\n                    tabNode._setBorderWidth(pos);\r\n                }\r\n                else {\r\n                    tabNode._setBorderHeight(pos);\r\n                }\r\n            }\r\n        }\r\n    }\r\n    /** @internal */\r\n    _updateAttrs(json) {\r\n        BorderNode._attributeDefinitions.update(json, this._attributes);\r\n    }\r\n    /** @internal */\r\n    _getDrawChildren() {\r\n        return this._drawChildren;\r\n    }\r\n    /** @internal */\r\n    _setAdjustedSize(size) {\r\n        this._adjustedSize = size;\r\n    }\r\n    /** @internal */\r\n    _getAdjustedSize() {\r\n        return this._adjustedSize;\r\n    }\r\n    /** @internal */\r\n    _layoutBorderOuter(outer, metrics) {\r\n        this.calcBorderBarSize(metrics);\r\n        const split1 = this._location.split(outer, this.getBorderBarSize()); // split border outer\r\n        this._tabHeaderRect = split1.start;\r\n        return split1.end;\r\n    }\r\n    /** @internal */\r\n    _layoutBorderInner(inner, metrics) {\r\n        this._drawChildren = [];\r\n        const location = this._location;\r\n        const split1 = location.split(inner, this._adjustedSize + this._model.getSplitterSize()); // split off tab contents\r\n        const split2 = location.reflect().split(split1.start, this._model.getSplitterSize()); // split contents into content and splitter\r\n        this._contentRect = split2.end;\r\n        for (let i = 0; i < this._children.length; i++) {\r\n            const child = this._children[i];\r\n            child._layout(this._contentRect, metrics);\r\n            child._setVisible(i === this.getSelected());\r\n            this._drawChildren.push(child);\r\n        }\r\n        if (this.getSelected() === -1) {\r\n            return inner;\r\n        }\r\n        else {\r\n            const newSplitter = new _SplitterNode__WEBPACK_IMPORTED_MODULE_8__.SplitterNode(this._model);\r\n            newSplitter._setParent(this);\r\n            newSplitter._setRect(split2.start);\r\n            this._drawChildren.push(newSplitter);\r\n            return split1.end;\r\n        }\r\n    }\r\n    /** @internal */\r\n    _remove(node) {\r\n        const removedIndex = this._removeChild(node);\r\n        if (this.getSelected() !== -1) {\r\n            (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.adjustSelectedIndex)(this, removedIndex);\r\n        }\r\n    }\r\n    /** @internal */\r\n    canDrop(dragNode, x, y) {\r\n        if (dragNode.getType() !== _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode.TYPE) {\r\n            return undefined;\r\n        }\r\n        let dropInfo;\r\n        const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n        if (this._tabHeaderRect.contains(x, y)) {\r\n            if (this._location._orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\r\n                if (this._children.length > 0) {\r\n                    let child = this._children[0];\r\n                    let childRect = child.getTabRect();\r\n                    const childY = childRect.y;\r\n                    const childHeight = childRect.height;\r\n                    let pos = this._tabHeaderRect.x;\r\n                    let childCenter = 0;\r\n                    for (let i = 0; i < this._children.length; i++) {\r\n                        child = this._children[i];\r\n                        childRect = child.getTabRect();\r\n                        childCenter = childRect.x + childRect.width / 2;\r\n                        if (x >= pos && x < childCenter) {\r\n                            const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childRect.x - 2, childY, 3, childHeight);\r\n                            dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n                            break;\r\n                        }\r\n                        pos = childCenter;\r\n                    }\r\n                    if (dropInfo == null) {\r\n                        const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childRect.getRight() - 2, childY, 3, childHeight);\r\n                        dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this._children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n                    }\r\n                }\r\n                else {\r\n                    const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(this._tabHeaderRect.x + 1, this._tabHeaderRect.y + 2, 3, 18);\r\n                    dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, 0, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n                }\r\n            }\r\n            else {\r\n                if (this._children.length > 0) {\r\n                    let child = this._children[0];\r\n                    let childRect = child.getTabRect();\r\n                    const childX = childRect.x;\r\n                    const childWidth = childRect.width;\r\n                    let pos = this._tabHeaderRect.y;\r\n                    let childCenter = 0;\r\n                    for (let i = 0; i < this._children.length; i++) {\r\n                        child = this._children[i];\r\n                        childRect = child.getTabRect();\r\n                        childCenter = childRect.y + childRect.height / 2;\r\n                        if (y >= pos && y < childCenter) {\r\n                            const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childX, childRect.y - 2, childWidth, 3);\r\n                            dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n                            break;\r\n                        }\r\n                        pos = childCenter;\r\n                    }\r\n                    if (dropInfo == null) {\r\n                        const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childX, childRect.getBottom() - 2, childWidth, 3);\r\n                        dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this._children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n                    }\r\n                }\r\n                else {\r\n                    const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(this._tabHeaderRect.x + 2, this._tabHeaderRect.y + 1, 18, 3);\r\n                    dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, 0, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n                }\r\n            }\r\n            if (!dragNode._canDockInto(dragNode, dropInfo)) {\r\n                return undefined;\r\n            }\r\n        }\r\n        else if (this.getSelected() !== -1 && this._contentRect.contains(x, y)) {\r\n            const outlineRect = this._contentRect;\r\n            dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n            if (!dragNode._canDockInto(dragNode, dropInfo)) {\r\n                return undefined;\r\n            }\r\n        }\r\n        return dropInfo;\r\n    }\r\n    /** @internal */\r\n    drop(dragNode, location, index, select) {\r\n        let fromIndex = 0;\r\n        const dragParent = dragNode.getParent();\r\n        if (dragParent !== undefined) {\r\n            fromIndex = dragParent._removeChild(dragNode);\r\n            // if selected node in border is being docked into a different border then deselect border tabs\r\n            if (dragParent !== this && dragParent instanceof BorderNode && dragParent.getSelected() === fromIndex) {\r\n                dragParent._setSelected(-1);\r\n            }\r\n            else {\r\n                (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.adjustSelectedIndex)(dragParent, fromIndex);\r\n            }\r\n        }\r\n        // if dropping a tab back to same tabset and moving to forward position then reduce insertion index\r\n        if (dragNode.getType() === _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode.TYPE && dragParent === this && fromIndex < index && index > 0) {\r\n            index--;\r\n        }\r\n        // simple_bundled dock to existing tabset\r\n        let insertPos = index;\r\n        if (insertPos === -1) {\r\n            insertPos = this._children.length;\r\n        }\r\n        if (dragNode.getType() === _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode.TYPE) {\r\n            this._addChild(dragNode, insertPos);\r\n        }\r\n        if (select || (select !== false && this.isAutoSelectTab())) {\r\n            this._setSelected(insertPos);\r\n        }\r\n        this._model._tidy();\r\n    }\r\n    toJson() {\r\n        const json = {};\r\n        BorderNode._attributeDefinitions.toJson(json, this._attributes);\r\n        json.location = this._location.getName();\r\n        json.children = this._children.map((child) => child.toJson());\r\n        return json;\r\n    }\r\n    /** @internal */\r\n    _getSplitterBounds(splitter, useMinSize = false) {\r\n        const pBounds = [0, 0];\r\n        const minSize = useMinSize ? this.getMinSize() : 0;\r\n        const outerRect = this._model._getOuterInnerRects().outer;\r\n        const innerRect = this._model._getOuterInnerRects().inner;\r\n        const rootRow = this._model.getRoot();\r\n        if (this._location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP) {\r\n            pBounds[0] = outerRect.y + minSize;\r\n            pBounds[1] = Math.max(pBounds[0], innerRect.getBottom() - splitter.getHeight() - rootRow.getMinHeight());\r\n        }\r\n        else if (this._location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT) {\r\n            pBounds[0] = outerRect.x + minSize;\r\n            pBounds[1] = Math.max(pBounds[0], innerRect.getRight() - splitter.getWidth() - rootRow.getMinWidth());\r\n        }\r\n        else if (this._location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM) {\r\n            pBounds[1] = outerRect.getBottom() - splitter.getHeight() - minSize;\r\n            pBounds[0] = Math.min(pBounds[1], innerRect.y + rootRow.getMinHeight());\r\n        }\r\n        else if (this._location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT) {\r\n            pBounds[1] = outerRect.getRight() - splitter.getWidth() - minSize;\r\n            pBounds[0] = Math.min(pBounds[1], innerRect.x + rootRow.getMinWidth());\r\n        }\r\n        return pBounds;\r\n    }\r\n    /** @internal */\r\n    _calculateSplit(splitter, splitterPos) {\r\n        const pBounds = this._getSplitterBounds(splitter);\r\n        if (this._location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM || this._location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT) {\r\n            return Math.max(0, pBounds[1] - splitterPos);\r\n        }\r\n        else {\r\n            return Math.max(0, splitterPos - pBounds[0]);\r\n        }\r\n    }\r\n    /** @internal */\r\n    _getAttributeDefinitions() {\r\n        return BorderNode._attributeDefinitions;\r\n    }\r\n    /** @internal */\r\n    static getAttributeDefinitions() {\r\n        return BorderNode._attributeDefinitions;\r\n    }\r\n}\r\nBorderNode.TYPE = \"border\";\r\n/** @internal */\r\nBorderNode._attributeDefinitions = BorderNode._createAttributeDefinitions();\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/BorderNode.ts?");
 
 /***/ }),
 
@@ -314,9 +214,9 @@ eval("\nvar __extends = (this && this.__extends) || (function () {\n    var exte
 /*!********************************!*\
   !*** ./src/model/BorderSet.ts ***!
   \********************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.BorderSet = void 0;\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar BorderNode_1 = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\nvar BorderSet = /** @class */ (function () {\n    /** @internal */\n    function BorderSet(model) {\n        this._model = model;\n        this._borders = [];\n    }\n    /** @internal */\n    BorderSet._fromJson = function (json, model) {\n        var borderSet = new BorderSet(model);\n        borderSet._borders = json.map(function (borderJson) { return BorderNode_1.BorderNode._fromJson(borderJson, model); });\n        return borderSet;\n    };\n    BorderSet.prototype.getBorders = function () {\n        return this._borders;\n    };\n    /** @internal */\n    BorderSet.prototype._forEachNode = function (fn) {\n        for (var _i = 0, _a = this._borders; _i < _a.length; _i++) {\n            var borderNode = _a[_i];\n            fn(borderNode, 0);\n            for (var _b = 0, _c = borderNode.getChildren(); _b < _c.length; _b++) {\n                var node = _c[_b];\n                node._forEachNode(fn, 1);\n            }\n        }\n    };\n    /** @internal */\n    BorderSet.prototype._toJson = function () {\n        return this._borders.map(function (borderNode) { return borderNode.toJson(); });\n    };\n    /** @internal */\n    BorderSet.prototype._layoutBorder = function (outerInnerRects, metrics) {\n        var rect = outerInnerRects.outer;\n        var rootRow = this._model.getRoot();\n        var height = Math.max(0, rect.height - rootRow.getMinHeight());\n        var width = Math.max(0, rect.width - rootRow.getMinWidth());\n        var sumHeight = 0;\n        var sumWidth = 0;\n        var adjustableHeight = 0;\n        var adjustableWidth = 0;\n        var showingBorders = this._borders.filter(function (border) { return border.isShowing(); });\n        // sum size of borders to see they will fit\n        for (var _i = 0, showingBorders_1 = showingBorders; _i < showingBorders_1.length; _i++) {\n            var border = showingBorders_1[_i];\n            border._setAdjustedSize(border.getSize());\n            var visible = border.getSelected() !== -1;\n            if (border.getLocation().getOrientation() === Orientation_1.Orientation.HORZ) {\n                sumWidth += border.getBorderBarSize();\n                if (visible) {\n                    width -= this._model.getSplitterSize();\n                    sumWidth += border.getSize();\n                    adjustableWidth += border.getSize();\n                }\n            }\n            else {\n                sumHeight += border.getBorderBarSize();\n                if (visible) {\n                    height -= this._model.getSplitterSize();\n                    sumHeight += border.getSize();\n                    adjustableHeight += border.getSize();\n                }\n            }\n        }\n        // adjust border sizes if too large\n        var j = 0;\n        var adjusted = false;\n        while ((sumWidth > width && adjustableWidth > 0) || (sumHeight > height && adjustableHeight > 0)) {\n            var border = showingBorders[j];\n            if (border.getSelected() !== -1) {\n                // visible\n                var size = border._getAdjustedSize();\n                if (sumWidth > width && adjustableWidth > 0 && border.getLocation().getOrientation() === Orientation_1.Orientation.HORZ && size > 0\n                    && size > border.getMinSize()) {\n                    border._setAdjustedSize(size - 1);\n                    sumWidth--;\n                    adjustableWidth--;\n                    adjusted = true;\n                }\n                else if (sumHeight > height && adjustableHeight > 0 && border.getLocation().getOrientation() === Orientation_1.Orientation.VERT && size > 0\n                    && size > border.getMinSize()) {\n                    border._setAdjustedSize(size - 1);\n                    sumHeight--;\n                    adjustableHeight--;\n                    adjusted = true;\n                }\n            }\n            j = (j + 1) % showingBorders.length;\n            if (j === 0) {\n                if (adjusted) {\n                    adjusted = false;\n                }\n                else {\n                    break;\n                }\n            }\n        }\n        for (var _a = 0, showingBorders_2 = showingBorders; _a < showingBorders_2.length; _a++) {\n            var border = showingBorders_2[_a];\n            outerInnerRects.outer = border._layoutBorderOuter(outerInnerRects.outer, metrics);\n        }\n        outerInnerRects.inner = outerInnerRects.outer;\n        for (var _b = 0, showingBorders_3 = showingBorders; _b < showingBorders_3.length; _b++) {\n            var border = showingBorders_3[_b];\n            outerInnerRects.inner = border._layoutBorderInner(outerInnerRects.inner, metrics);\n        }\n        return outerInnerRects;\n    };\n    /** @internal */\n    BorderSet.prototype._findDropTargetNode = function (dragNode, x, y) {\n        for (var _i = 0, _a = this._borders; _i < _a.length; _i++) {\n            var border = _a[_i];\n            if (border.isShowing()) {\n                var dropInfo = border.canDrop(dragNode, x, y);\n                if (dropInfo !== undefined) {\n                    return dropInfo;\n                }\n            }\n        }\n        return undefined;\n    };\n    return BorderSet;\n}());\nexports.BorderSet = BorderSet;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/BorderSet.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"BorderSet\": () => (/* binding */ BorderSet)\n/* harmony export */ });\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n\r\n\r\nclass BorderSet {\r\n    /** @internal */\r\n    constructor(model) {\r\n        this._model = model;\r\n        this._borders = [];\r\n    }\r\n    /** @internal */\r\n    static _fromJson(json, model) {\r\n        const borderSet = new BorderSet(model);\r\n        borderSet._borders = json.map((borderJson) => _BorderNode__WEBPACK_IMPORTED_MODULE_1__.BorderNode._fromJson(borderJson, model));\r\n        return borderSet;\r\n    }\r\n    getBorders() {\r\n        return this._borders;\r\n    }\r\n    /** @internal */\r\n    _forEachNode(fn) {\r\n        for (const borderNode of this._borders) {\r\n            fn(borderNode, 0);\r\n            for (const node of borderNode.getChildren()) {\r\n                node._forEachNode(fn, 1);\r\n            }\r\n        }\r\n    }\r\n    /** @internal */\r\n    _toJson() {\r\n        return this._borders.map((borderNode) => borderNode.toJson());\r\n    }\r\n    /** @internal */\r\n    _layoutBorder(outerInnerRects, metrics) {\r\n        const rect = outerInnerRects.outer;\r\n        const rootRow = this._model.getRoot();\r\n        let height = Math.max(0, rect.height - rootRow.getMinHeight());\r\n        let width = Math.max(0, rect.width - rootRow.getMinWidth());\r\n        let sumHeight = 0;\r\n        let sumWidth = 0;\r\n        let adjustableHeight = 0;\r\n        let adjustableWidth = 0;\r\n        const showingBorders = this._borders.filter((border) => border.isShowing());\r\n        // sum size of borders to see they will fit\r\n        for (const border of showingBorders) {\r\n            border._setAdjustedSize(border.getSize());\r\n            const visible = border.getSelected() !== -1;\r\n            if (border.getLocation().getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.HORZ) {\r\n                sumWidth += border.getBorderBarSize();\r\n                if (visible) {\r\n                    width -= this._model.getSplitterSize();\r\n                    sumWidth += border.getSize();\r\n                    adjustableWidth += border.getSize();\r\n                }\r\n            }\r\n            else {\r\n                sumHeight += border.getBorderBarSize();\r\n                if (visible) {\r\n                    height -= this._model.getSplitterSize();\r\n                    sumHeight += border.getSize();\r\n                    adjustableHeight += border.getSize();\r\n                }\r\n            }\r\n        }\r\n        // adjust border sizes if too large\r\n        let j = 0;\r\n        let adjusted = false;\r\n        while ((sumWidth > width && adjustableWidth > 0) || (sumHeight > height && adjustableHeight > 0)) {\r\n            const border = showingBorders[j];\r\n            if (border.getSelected() !== -1) {\r\n                // visible\r\n                const size = border._getAdjustedSize();\r\n                if (sumWidth > width && adjustableWidth > 0 && border.getLocation().getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.HORZ && size > 0\r\n                    && size > border.getMinSize()) {\r\n                    border._setAdjustedSize(size - 1);\r\n                    sumWidth--;\r\n                    adjustableWidth--;\r\n                    adjusted = true;\r\n                }\r\n                else if (sumHeight > height && adjustableHeight > 0 && border.getLocation().getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_0__.Orientation.VERT && size > 0\r\n                    && size > border.getMinSize()) {\r\n                    border._setAdjustedSize(size - 1);\r\n                    sumHeight--;\r\n                    adjustableHeight--;\r\n                    adjusted = true;\r\n                }\r\n            }\r\n            j = (j + 1) % showingBorders.length;\r\n            if (j === 0) {\r\n                if (adjusted) {\r\n                    adjusted = false;\r\n                }\r\n                else {\r\n                    break;\r\n                }\r\n            }\r\n        }\r\n        for (const border of showingBorders) {\r\n            outerInnerRects.outer = border._layoutBorderOuter(outerInnerRects.outer, metrics);\r\n        }\r\n        outerInnerRects.inner = outerInnerRects.outer;\r\n        for (const border of showingBorders) {\r\n            outerInnerRects.inner = border._layoutBorderInner(outerInnerRects.inner, metrics);\r\n        }\r\n        return outerInnerRects;\r\n    }\r\n    /** @internal */\r\n    _findDropTargetNode(dragNode, x, y) {\r\n        for (const border of this._borders) {\r\n            if (border.isShowing()) {\r\n                const dropInfo = border.canDrop(dragNode, x, y);\r\n                if (dropInfo !== undefined) {\r\n                    return dropInfo;\r\n                }\r\n            }\r\n        }\r\n        return undefined;\r\n    }\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/BorderSet.ts?");
 
 /***/ }),
 
@@ -324,9 +224,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*********************************!*\
   !*** ./src/model/ICloseType.ts ***!
   \*********************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.ICloseType = void 0;\nvar ICloseType;\n(function (ICloseType) {\n    ICloseType[ICloseType[\"Visible\"] = 1] = \"Visible\";\n    ICloseType[ICloseType[\"Always\"] = 2] = \"Always\";\n    ICloseType[ICloseType[\"Selected\"] = 3] = \"Selected\";\n})(ICloseType = exports.ICloseType || (exports.ICloseType = {}));\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/ICloseType.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"ICloseType\": () => (/* binding */ ICloseType)\n/* harmony export */ });\nvar ICloseType;\r\n(function (ICloseType) {\r\n    ICloseType[ICloseType[\"Visible\"] = 1] = \"Visible\";\r\n    ICloseType[ICloseType[\"Always\"] = 2] = \"Always\";\r\n    ICloseType[ICloseType[\"Selected\"] = 3] = \"Selected\";\r\n})(ICloseType || (ICloseType = {}));\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/ICloseType.ts?");
 
 /***/ }),
 
@@ -334,9 +234,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*********************************!*\
   !*** ./src/model/IDraggable.ts ***!
   \*********************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/IDraggable.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/IDraggable.ts?");
 
 /***/ }),
 
@@ -344,9 +244,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n
 /*!**********************************!*\
   !*** ./src/model/IDropTarget.ts ***!
   \**********************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/IDropTarget.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/IDropTarget.ts?");
 
 /***/ }),
 
@@ -354,9 +254,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n
 /*!*********************************!*\
   !*** ./src/model/IJsonModel.ts ***!
   \*********************************/
-/***/ ((__unused_webpack_module, exports) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/IJsonModel.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/IJsonModel.ts?");
 
 /***/ }),
 
@@ -364,9 +264,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n
 /*!****************************!*\
   !*** ./src/model/Model.ts ***!
   \****************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n        if (ar || !(i in from)) {\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n            ar[i] = from[i];\n        }\n    }\n    return to.concat(ar || Array.prototype.slice.call(from));\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Model = void 0;\nvar uuid_1 = __webpack_require__(/*! uuid */ \"./node_modules/uuid/dist/esm-browser/index.js\");\nvar Attribute_1 = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\nvar AttributeDefinitions_1 = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\nvar DockLocation_1 = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar Actions_1 = __webpack_require__(/*! ./Actions */ \"./src/model/Actions.ts\");\nvar BorderNode_1 = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\nvar BorderSet_1 = __webpack_require__(/*! ./BorderSet */ \"./src/model/BorderSet.ts\");\nvar RowNode_1 = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\nvar TabNode_1 = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\nvar TabSetNode_1 = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n/**\n * Class containing the Tree of Nodes used by the FlexLayout component\n */\nvar Model = /** @class */ (function () {\n    /**\n     * 'private' constructor. Use the static method Model.fromJson(json) to create a model\n     *  @internal\n     */\n    function Model() {\n        /** @internal */\n        this._borderRects = { inner: Rect_1.Rect.empty(), outer: Rect_1.Rect.empty() };\n        this._attributes = {};\n        this._idMap = {};\n        this._borders = new BorderSet_1.BorderSet(this);\n        this._pointerFine = true;\n        this._showHiddenBorder = DockLocation_1.DockLocation.CENTER;\n    }\n    /**\n     * Loads the model from the given json object\n     * @param json the json model to load\n     * @returns {Model} a new Model object\n     */\n    Model.fromJson = function (json) {\n        var model = new Model();\n        Model._attributeDefinitions.fromJson(json.global, model._attributes);\n        if (json.borders) {\n            model._borders = BorderSet_1.BorderSet._fromJson(json.borders, model);\n        }\n        model._root = RowNode_1.RowNode._fromJson(json.layout, model);\n        model._tidy(); // initial tidy of node tree\n        return model;\n    };\n    /** @internal */\n    Model._createAttributeDefinitions = function () {\n        var attributeDefinitions = new AttributeDefinitions_1.AttributeDefinitions();\n        attributeDefinitions.add(\"legacyOverflowMenu\", false).setType(Attribute_1.Attribute.BOOLEAN);\n        // splitter\n        attributeDefinitions.add(\"splitterSize\", -1).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"splitterExtra\", 0).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"enableEdgeDock\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"rootOrientationVertical\", false).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"marginInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\n            .setType(\"IInsets\");\n        attributeDefinitions.add(\"enableUseVisibility\", false).setType(Attribute_1.Attribute.BOOLEAN);\n        // tab\n        attributeDefinitions.add(\"tabEnableClose\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabCloseType\", 1).setType(\"ICloseType\");\n        attributeDefinitions.add(\"tabEnableFloat\", false).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabEnableDrag\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabEnableRename\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabClassName\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"tabIcon\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"tabEnableRenderOnDemand\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabDragSpeed\", 0.3).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"tabBorderWidth\", -1).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"tabBorderHeight\", -1).setType(Attribute_1.Attribute.NUMBER);\n        // tabset\n        attributeDefinitions.add(\"tabSetEnableDeleteWhenEmpty\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabSetEnableDrop\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabSetEnableDrag\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabSetEnableDivide\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabSetEnableMaximize\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabSetEnableClose\", false).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabSetAutoSelectTab\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabSetClassNameTabStrip\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"tabSetClassNameHeader\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"tabSetEnableTabStrip\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"tabSetHeaderHeight\", 0).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"tabSetTabStripHeight\", 0).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"tabSetMarginInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\n            .setType(\"IInsets\");\n        attributeDefinitions.add(\"tabSetBorderInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\n            .setType(\"IInsets\");\n        attributeDefinitions.add(\"tabSetTabLocation\", \"top\").setType(\"ITabLocation\");\n        attributeDefinitions.add(\"tabSetMinWidth\", 0).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"tabSetMinHeight\", 0).setType(Attribute_1.Attribute.NUMBER);\n        // border\n        attributeDefinitions.add(\"borderSize\", 200).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"borderMinSize\", 0).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"borderBarSize\", 0).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"borderEnableDrop\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"borderAutoSelectTabWhenOpen\", true).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"borderAutoSelectTabWhenClosed\", false).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.add(\"borderClassName\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"borderEnableAutoHide\", false).setType(Attribute_1.Attribute.BOOLEAN);\n        return attributeDefinitions;\n    };\n    /** @internal */\n    Model.prototype._setChangeListener = function (listener) {\n        this._changeListener = listener;\n    };\n    /**\n     * Get the currently active tabset node\n     */\n    Model.prototype.getActiveTabset = function () {\n        if (this._activeTabSet && this.getNodeById(this._activeTabSet.getId())) {\n            return this._activeTabSet;\n        }\n        else {\n            return undefined;\n        }\n    };\n    /** @internal */\n    Model.prototype._getShowHiddenBorder = function () {\n        return this._showHiddenBorder;\n    };\n    /** @internal */\n    Model.prototype._setShowHiddenBorder = function (location) {\n        this._showHiddenBorder = location;\n    };\n    /** @internal */\n    Model.prototype._setActiveTabset = function (tabsetNode) {\n        this._activeTabSet = tabsetNode;\n    };\n    /**\n     * Get the currently maximized tabset node\n     */\n    Model.prototype.getMaximizedTabset = function () {\n        return this._maximizedTabSet;\n    };\n    /** @internal */\n    Model.prototype._setMaximizedTabset = function (tabsetNode) {\n        this._maximizedTabSet = tabsetNode;\n    };\n    /**\n     * Gets the root RowNode of the model\n     * @returns {RowNode}\n     */\n    Model.prototype.getRoot = function () {\n        return this._root;\n    };\n    Model.prototype.isRootOrientationVertical = function () {\n        return this._attributes.rootOrientationVertical;\n    };\n    Model.prototype.isUseVisibility = function () {\n        return this._attributes.enableUseVisibility;\n    };\n    /**\n     * Gets the\n     * @returns {BorderSet|*}\n     */\n    Model.prototype.getBorderSet = function () {\n        return this._borders;\n    };\n    /** @internal */\n    Model.prototype._getOuterInnerRects = function () {\n        return this._borderRects;\n    };\n    /** @internal */\n    Model.prototype._getPointerFine = function () {\n        return this._pointerFine;\n    };\n    /** @internal */\n    Model.prototype._setPointerFine = function (pointerFine) {\n        this._pointerFine = pointerFine;\n    };\n    /**\n     * Visits all the nodes in the model and calls the given function for each\n     * @param fn a function that takes visited node and a integer level as parameters\n     */\n    Model.prototype.visitNodes = function (fn) {\n        this._borders._forEachNode(fn);\n        this._root._forEachNode(fn, 0);\n    };\n    /**\n     * Gets a node by its id\n     * @param id the id to find\n     */\n    Model.prototype.getNodeById = function (id) {\n        return this._idMap[id];\n    };\n    /**\n     * Update the node tree by performing the given action,\n     * Actions should be generated via static methods on the Actions class\n     * @param action the action to perform\n     * @returns added Node for Actions.addNode; undefined otherwise\n     */\n    Model.prototype.doAction = function (action) {\n        var returnVal = undefined;\n        // console.log(action);\n        switch (action.type) {\n            case Actions_1.Actions.ADD_NODE: {\n                var newNode = new TabNode_1.TabNode(this, action.data.json, true);\n                var toNode = this._idMap[action.data.toNode];\n                if (toNode instanceof TabSetNode_1.TabSetNode || toNode instanceof BorderNode_1.BorderNode || toNode instanceof RowNode_1.RowNode) {\n                    toNode.drop(newNode, DockLocation_1.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\n                    returnVal = newNode;\n                }\n                break;\n            }\n            case Actions_1.Actions.MOVE_NODE: {\n                var fromNode = this._idMap[action.data.fromNode];\n                if (fromNode instanceof TabNode_1.TabNode || fromNode instanceof TabSetNode_1.TabSetNode) {\n                    var toNode = this._idMap[action.data.toNode];\n                    if (toNode instanceof TabSetNode_1.TabSetNode || toNode instanceof BorderNode_1.BorderNode || toNode instanceof RowNode_1.RowNode) {\n                        toNode.drop(fromNode, DockLocation_1.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\n                    }\n                }\n                break;\n            }\n            case Actions_1.Actions.DELETE_TAB: {\n                var node = this._idMap[action.data.node];\n                if (node instanceof TabNode_1.TabNode) {\n                    node._delete();\n                }\n                break;\n            }\n            case Actions_1.Actions.DELETE_TABSET: {\n                var node = this._idMap[action.data.node];\n                if (node instanceof TabSetNode_1.TabSetNode) {\n                    // first delete all child tabs that are closeable\n                    var children = __spreadArray([], node.getChildren(), true);\n                    for (var i = 0; i < children.length; i++) {\n                        var child = children[i];\n                        if (child.isEnableClose()) {\n                            child._delete();\n                        }\n                    }\n                    if (node.getChildren().length === 0) {\n                        node._delete();\n                    }\n                    this._tidy();\n                }\n                break;\n            }\n            case Actions_1.Actions.FLOAT_TAB: {\n                var node = this._idMap[action.data.node];\n                if (node instanceof TabNode_1.TabNode) {\n                    node._setFloating(true);\n                    (0, Utils_1.adjustSelectedIndexAfterFloat)(node);\n                }\n                break;\n            }\n            case Actions_1.Actions.UNFLOAT_TAB: {\n                var node = this._idMap[action.data.node];\n                if (node instanceof TabNode_1.TabNode) {\n                    node._setFloating(false);\n                    (0, Utils_1.adjustSelectedIndexAfterDock)(node);\n                }\n                break;\n            }\n            case Actions_1.Actions.RENAME_TAB: {\n                var node = this._idMap[action.data.node];\n                if (node instanceof TabNode_1.TabNode) {\n                    node._setName(action.data.text);\n                }\n                break;\n            }\n            case Actions_1.Actions.SELECT_TAB: {\n                var tabNode = this._idMap[action.data.tabNode];\n                if (tabNode instanceof TabNode_1.TabNode) {\n                    var parent_1 = tabNode.getParent();\n                    var pos = parent_1.getChildren().indexOf(tabNode);\n                    if (parent_1 instanceof BorderNode_1.BorderNode) {\n                        if (parent_1.getSelected() === pos) {\n                            parent_1._setSelected(-1);\n                        }\n                        else {\n                            parent_1._setSelected(pos);\n                        }\n                    }\n                    else if (parent_1 instanceof TabSetNode_1.TabSetNode) {\n                        if (parent_1.getSelected() !== pos) {\n                            parent_1._setSelected(pos);\n                        }\n                        this._activeTabSet = parent_1;\n                    }\n                }\n                break;\n            }\n            case Actions_1.Actions.SET_ACTIVE_TABSET: {\n                var tabsetNode = this._idMap[action.data.tabsetNode];\n                if (tabsetNode instanceof TabSetNode_1.TabSetNode) {\n                    this._activeTabSet = tabsetNode;\n                }\n                break;\n            }\n            case Actions_1.Actions.ADJUST_SPLIT: {\n                var node1 = this._idMap[action.data.node1];\n                var node2 = this._idMap[action.data.node2];\n                if ((node1 instanceof TabSetNode_1.TabSetNode || node1 instanceof RowNode_1.RowNode) && (node2 instanceof TabSetNode_1.TabSetNode || node2 instanceof RowNode_1.RowNode)) {\n                    this._adjustSplitSide(node1, action.data.weight1, action.data.pixelWidth1);\n                    this._adjustSplitSide(node2, action.data.weight2, action.data.pixelWidth2);\n                }\n                break;\n            }\n            case Actions_1.Actions.ADJUST_BORDER_SPLIT: {\n                var node = this._idMap[action.data.node];\n                if (node instanceof BorderNode_1.BorderNode) {\n                    node._setSize(action.data.pos);\n                }\n                break;\n            }\n            case Actions_1.Actions.MAXIMIZE_TOGGLE: {\n                var node = this._idMap[action.data.node];\n                if (node instanceof TabSetNode_1.TabSetNode) {\n                    if (node === this._maximizedTabSet) {\n                        this._maximizedTabSet = undefined;\n                    }\n                    else {\n                        this._maximizedTabSet = node;\n                        this._activeTabSet = node;\n                    }\n                }\n                break;\n            }\n            case Actions_1.Actions.UPDATE_MODEL_ATTRIBUTES: {\n                this._updateAttrs(action.data.json);\n                break;\n            }\n            case Actions_1.Actions.UPDATE_NODE_ATTRIBUTES: {\n                var node = this._idMap[action.data.node];\n                node._updateAttrs(action.data.json);\n                break;\n            }\n            default:\n                break;\n        }\n        this._updateIdMap();\n        if (this._changeListener !== undefined) {\n            this._changeListener();\n        }\n        return returnVal;\n    };\n    /** @internal */\n    Model.prototype._updateIdMap = function () {\n        var _this = this;\n        // regenerate idMap to stop it building up\n        this._idMap = {};\n        this.visitNodes(function (node) { return (_this._idMap[node.getId()] = node); });\n        // console.log(JSON.stringify(Object.keys(this._idMap)));\n    };\n    /** @internal */\n    Model.prototype._adjustSplitSide = function (node, weight, pixels) {\n        node._setWeight(weight);\n        if (node.getWidth() != null && node.getOrientation() === Orientation_1.Orientation.VERT) {\n            node._updateAttrs({ width: pixels });\n        }\n        else if (node.getHeight() != null && node.getOrientation() === Orientation_1.Orientation.HORZ) {\n            node._updateAttrs({ height: pixels });\n        }\n    };\n    /**\n     * Converts the model to a json object\n     * @returns {IJsonModel} json object that represents this model\n     */\n    Model.prototype.toJson = function () {\n        var global = {};\n        Model._attributeDefinitions.toJson(global, this._attributes);\n        // save state of nodes\n        this.visitNodes(function (node) {\n            node._fireEvent(\"save\", undefined);\n        });\n        return { global: global, borders: this._borders._toJson(), layout: this._root.toJson() };\n    };\n    Model.prototype.getSplitterSize = function () {\n        var splitterSize = this._attributes.splitterSize;\n        if (splitterSize === -1) {\n            // use defaults\n            splitterSize = this._pointerFine ? 8 : 12; // larger for mobile\n        }\n        return splitterSize;\n    };\n    Model.prototype.isLegacyOverflowMenu = function () {\n        return this._attributes.legacyOverflowMenu;\n    };\n    Model.prototype.getSplitterExtra = function () {\n        return this._attributes.splitterExtra;\n    };\n    Model.prototype.isEnableEdgeDock = function () {\n        return this._attributes.enableEdgeDock;\n    };\n    /** @internal */\n    Model.prototype._addNode = function (node) {\n        var id = node.getId();\n        if (this._idMap[id] !== undefined) {\n            throw new Error(\"Error: each node must have a unique id, duplicate id:\".concat(node.getId()));\n        }\n        if (node.getType() !== \"splitter\") {\n            this._idMap[id] = node;\n        }\n    };\n    /** @internal */\n    Model.prototype._layout = function (rect, metrics) {\n        var _a;\n        // let start = Date.now();\n        this._borderRects = this._borders._layoutBorder({ outer: rect, inner: rect }, metrics);\n        rect = this._borderRects.inner.removeInsets(this._getAttribute(\"marginInsets\"));\n        (_a = this._root) === null || _a === void 0 ? void 0 : _a.calcMinSize();\n        this._root._layout(rect, metrics);\n        // console.log(\"layout time: \" + (Date.now() - start));\n        return rect;\n    };\n    /** @internal */\n    Model.prototype._findDropTargetNode = function (dragNode, x, y) {\n        var node = this._root._findDropTargetNode(dragNode, x, y);\n        if (node === undefined) {\n            node = this._borders._findDropTargetNode(dragNode, x, y);\n        }\n        return node;\n    };\n    /** @internal */\n    Model.prototype._tidy = function () {\n        // console.log(\"before _tidy\", this.toString());\n        this._root._tidy();\n        // console.log(\"after _tidy\", this.toString());\n    };\n    /** @internal */\n    Model.prototype._updateAttrs = function (json) {\n        Model._attributeDefinitions.update(json, this._attributes);\n    };\n    /** @internal */\n    Model.prototype._nextUniqueId = function () {\n        return '#' + (0, uuid_1.v4)();\n    };\n    /** @internal */\n    Model.prototype._getAttribute = function (name) {\n        return this._attributes[name];\n    };\n    /**\n     * Sets a function to allow/deny dropping a node\n     * @param onAllowDrop function that takes the drag node and DropInfo and returns true if the drop is allowed\n     */\n    Model.prototype.setOnAllowDrop = function (onAllowDrop) {\n        this._onAllowDrop = onAllowDrop;\n    };\n    /** @internal */\n    Model.prototype._getOnAllowDrop = function () {\n        return this._onAllowDrop;\n    };\n    /**\n     * set callback called when a new TabSet is created.\n     * The tabNode can be undefined if it's the auto created first tabset in the root row (when the last\n     * tab is deleted, the root tabset can be recreated)\n     * @param onCreateTabSet\n     */\n    Model.prototype.setOnCreateTabSet = function (onCreateTabSet) {\n        this._onCreateTabSet = onCreateTabSet;\n    };\n    /** @internal */\n    Model.prototype._getOnCreateTabSet = function () {\n        return this._onCreateTabSet;\n    };\n    Model.toTypescriptInterfaces = function () {\n        console.log(Model._attributeDefinitions.toTypescriptInterface(\"Global\", undefined));\n        console.log(RowNode_1.RowNode.getAttributeDefinitions().toTypescriptInterface(\"Row\", Model._attributeDefinitions));\n        console.log(TabSetNode_1.TabSetNode.getAttributeDefinitions().toTypescriptInterface(\"TabSet\", Model._attributeDefinitions));\n        console.log(TabNode_1.TabNode.getAttributeDefinitions().toTypescriptInterface(\"Tab\", Model._attributeDefinitions));\n        console.log(BorderNode_1.BorderNode.getAttributeDefinitions().toTypescriptInterface(\"Border\", Model._attributeDefinitions));\n    };\n    Model.prototype.toString = function () {\n        return JSON.stringify(this.toJson());\n    };\n    /** @internal */\n    Model._attributeDefinitions = Model._createAttributeDefinitions();\n    return Model;\n}());\nexports.Model = Model;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Model.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Model\": () => (/* binding */ Model)\n/* harmony export */ });\n/* harmony import */ var uuid__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! uuid */ \"./node_modules/uuid/dist/esm-browser/v4.js\");\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Actions__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _BorderSet__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./BorderSet */ \"./src/model/BorderSet.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _TabSetNode__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/**\r\n * Class containing the Tree of Nodes used by the FlexLayout component\r\n */\r\nclass Model {\r\n    /**\r\n     * 'private' constructor. Use the static method Model.fromJson(json) to create a model\r\n     *  @internal\r\n     */\r\n    constructor() {\r\n        /** @internal */\r\n        this._borderRects = { inner: _Rect__WEBPACK_IMPORTED_MODULE_4__.Rect.empty(), outer: _Rect__WEBPACK_IMPORTED_MODULE_4__.Rect.empty() };\r\n        this._attributes = {};\r\n        this._idMap = {};\r\n        this._borders = new _BorderSet__WEBPACK_IMPORTED_MODULE_7__.BorderSet(this);\r\n        this._pointerFine = true;\r\n        this._showHiddenBorder = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n    }\r\n    /**\r\n     * Loads the model from the given json object\r\n     * @param json the json model to load\r\n     * @returns {Model} a new Model object\r\n     */\r\n    static fromJson(json) {\r\n        const model = new Model();\r\n        Model._attributeDefinitions.fromJson(json.global, model._attributes);\r\n        if (json.borders) {\r\n            model._borders = _BorderSet__WEBPACK_IMPORTED_MODULE_7__.BorderSet._fromJson(json.borders, model);\r\n        }\r\n        model._root = _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode._fromJson(json.layout, model);\r\n        model._tidy(); // initial tidy of node tree\r\n        return model;\r\n    }\r\n    /** @internal */\r\n    static _createAttributeDefinitions() {\r\n        const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\r\n        attributeDefinitions.add(\"legacyOverflowMenu\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        // splitter\r\n        attributeDefinitions.add(\"splitterSize\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"splitterExtra\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"enableEdgeDock\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"rootOrientationVertical\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"marginInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n            .setType(\"IInsets\");\r\n        attributeDefinitions.add(\"enableUseVisibility\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        // tab\r\n        attributeDefinitions.add(\"tabEnableClose\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabCloseType\", 1).setType(\"ICloseType\");\r\n        attributeDefinitions.add(\"tabEnableFloat\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabEnableRename\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"tabIcon\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"tabEnableRenderOnDemand\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabDragSpeed\", 0.3).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"tabBorderWidth\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"tabBorderHeight\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        // tabset\r\n        attributeDefinitions.add(\"tabSetEnableDeleteWhenEmpty\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabSetEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabSetEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabSetEnableDivide\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabSetEnableMaximize\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabSetEnableClose\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabSetAutoSelectTab\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabSetClassNameTabStrip\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"tabSetClassNameHeader\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"tabSetEnableTabStrip\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"tabSetHeaderHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"tabSetTabStripHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"tabSetMarginInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n            .setType(\"IInsets\");\r\n        attributeDefinitions.add(\"tabSetBorderInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n            .setType(\"IInsets\");\r\n        attributeDefinitions.add(\"tabSetTabLocation\", \"top\").setType(\"ITabLocation\");\r\n        attributeDefinitions.add(\"tabSetMinWidth\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"tabSetMinHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        // border\r\n        attributeDefinitions.add(\"borderSize\", 200).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"borderMinSize\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"borderBarSize\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"borderEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"borderAutoSelectTabWhenOpen\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"borderAutoSelectTabWhenClosed\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.add(\"borderClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"borderEnableAutoHide\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        return attributeDefinitions;\r\n    }\r\n    /** @internal */\r\n    _setChangeListener(listener) {\r\n        this._changeListener = listener;\r\n    }\r\n    /**\r\n     * Get the currently active tabset node\r\n     */\r\n    getActiveTabset() {\r\n        if (this._activeTabSet && this.getNodeById(this._activeTabSet.getId())) {\r\n            return this._activeTabSet;\r\n        }\r\n        else {\r\n            return undefined;\r\n        }\r\n    }\r\n    /** @internal */\r\n    _getShowHiddenBorder() {\r\n        return this._showHiddenBorder;\r\n    }\r\n    /** @internal */\r\n    _setShowHiddenBorder(location) {\r\n        this._showHiddenBorder = location;\r\n    }\r\n    /** @internal */\r\n    _setActiveTabset(tabsetNode) {\r\n        this._activeTabSet = tabsetNode;\r\n    }\r\n    /**\r\n     * Get the currently maximized tabset node\r\n     */\r\n    getMaximizedTabset() {\r\n        return this._maximizedTabSet;\r\n    }\r\n    /** @internal */\r\n    _setMaximizedTabset(tabsetNode) {\r\n        this._maximizedTabSet = tabsetNode;\r\n    }\r\n    /**\r\n     * Gets the root RowNode of the model\r\n     * @returns {RowNode}\r\n     */\r\n    getRoot() {\r\n        return this._root;\r\n    }\r\n    isRootOrientationVertical() {\r\n        return this._attributes.rootOrientationVertical;\r\n    }\r\n    isUseVisibility() {\r\n        return this._attributes.enableUseVisibility;\r\n    }\r\n    /**\r\n     * Gets the\r\n     * @returns {BorderSet|*}\r\n     */\r\n    getBorderSet() {\r\n        return this._borders;\r\n    }\r\n    /** @internal */\r\n    _getOuterInnerRects() {\r\n        return this._borderRects;\r\n    }\r\n    /** @internal */\r\n    _getPointerFine() {\r\n        return this._pointerFine;\r\n    }\r\n    /** @internal */\r\n    _setPointerFine(pointerFine) {\r\n        this._pointerFine = pointerFine;\r\n    }\r\n    /**\r\n     * Visits all the nodes in the model and calls the given function for each\r\n     * @param fn a function that takes visited node and a integer level as parameters\r\n     */\r\n    visitNodes(fn) {\r\n        this._borders._forEachNode(fn);\r\n        this._root._forEachNode(fn, 0);\r\n    }\r\n    /**\r\n     * Gets a node by its id\r\n     * @param id the id to find\r\n     */\r\n    getNodeById(id) {\r\n        return this._idMap[id];\r\n    }\r\n    /**\r\n     * Update the node tree by performing the given action,\r\n     * Actions should be generated via static methods on the Actions class\r\n     * @param action the action to perform\r\n     * @returns added Node for Actions.addNode; undefined otherwise\r\n     */\r\n    doAction(action) {\r\n        let returnVal = undefined;\r\n        // console.log(action);\r\n        switch (action.type) {\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADD_NODE: {\r\n                const newNode = new _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode(this, action.data.json, true);\r\n                const toNode = this._idMap[action.data.toNode];\r\n                if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) {\r\n                    toNode.drop(newNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\r\n                    returnVal = newNode;\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.MOVE_NODE: {\r\n                const fromNode = this._idMap[action.data.fromNode];\r\n                if (fromNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode || fromNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n                    const toNode = this._idMap[action.data.toNode];\r\n                    if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) {\r\n                        toNode.drop(fromNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\r\n                    }\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.DELETE_TAB: {\r\n                const node = this._idMap[action.data.node];\r\n                if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n                    node._delete();\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.DELETE_TABSET: {\r\n                const node = this._idMap[action.data.node];\r\n                if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n                    // first delete all child tabs that are closeable\r\n                    const children = [...node.getChildren()];\r\n                    for (let i = 0; i < children.length; i++) {\r\n                        const child = children[i];\r\n                        if (child.isEnableClose()) {\r\n                            child._delete();\r\n                        }\r\n                    }\r\n                    if (node.getChildren().length === 0) {\r\n                        node._delete();\r\n                    }\r\n                    this._tidy();\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.FLOAT_TAB: {\r\n                const node = this._idMap[action.data.node];\r\n                if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n                    node._setFloating(true);\r\n                    (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.adjustSelectedIndexAfterFloat)(node);\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UNFLOAT_TAB: {\r\n                const node = this._idMap[action.data.node];\r\n                if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n                    node._setFloating(false);\r\n                    (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.adjustSelectedIndexAfterDock)(node);\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.RENAME_TAB: {\r\n                const node = this._idMap[action.data.node];\r\n                if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n                    node._setName(action.data.text);\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.SELECT_TAB: {\r\n                const tabNode = this._idMap[action.data.tabNode];\r\n                if (tabNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n                    const parent = tabNode.getParent();\r\n                    const pos = parent.getChildren().indexOf(tabNode);\r\n                    if (parent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode) {\r\n                        if (parent.getSelected() === pos) {\r\n                            parent._setSelected(-1);\r\n                        }\r\n                        else {\r\n                            parent._setSelected(pos);\r\n                        }\r\n                    }\r\n                    else if (parent instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n                        if (parent.getSelected() !== pos) {\r\n                            parent._setSelected(pos);\r\n                        }\r\n                        this._activeTabSet = parent;\r\n                    }\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.SET_ACTIVE_TABSET: {\r\n                const tabsetNode = this._idMap[action.data.tabsetNode];\r\n                if (tabsetNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n                    this._activeTabSet = tabsetNode;\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADJUST_SPLIT: {\r\n                const node1 = this._idMap[action.data.node1];\r\n                const node2 = this._idMap[action.data.node2];\r\n                if ((node1 instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || node1 instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) && (node2 instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || node2 instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode)) {\r\n                    this._adjustSplitSide(node1, action.data.weight1, action.data.pixelWidth1);\r\n                    this._adjustSplitSide(node2, action.data.weight2, action.data.pixelWidth2);\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADJUST_BORDER_SPLIT: {\r\n                const node = this._idMap[action.data.node];\r\n                if (node instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode) {\r\n                    node._setSize(action.data.pos);\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.MAXIMIZE_TOGGLE: {\r\n                const node = this._idMap[action.data.node];\r\n                if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n                    if (node === this._maximizedTabSet) {\r\n                        this._maximizedTabSet = undefined;\r\n                    }\r\n                    else {\r\n                        this._maximizedTabSet = node;\r\n                        this._activeTabSet = node;\r\n                    }\r\n                }\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UPDATE_MODEL_ATTRIBUTES: {\r\n                this._updateAttrs(action.data.json);\r\n                break;\r\n            }\r\n            case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UPDATE_NODE_ATTRIBUTES: {\r\n                const node = this._idMap[action.data.node];\r\n                node._updateAttrs(action.data.json);\r\n                break;\r\n            }\r\n            default:\r\n                break;\r\n        }\r\n        this._updateIdMap();\r\n        if (this._changeListener !== undefined) {\r\n            this._changeListener();\r\n        }\r\n        return returnVal;\r\n    }\r\n    /** @internal */\r\n    _updateIdMap() {\r\n        // regenerate idMap to stop it building up\r\n        this._idMap = {};\r\n        this.visitNodes((node) => (this._idMap[node.getId()] = node));\r\n        // console.log(JSON.stringify(Object.keys(this._idMap)));\r\n    }\r\n    /** @internal */\r\n    _adjustSplitSide(node, weight, pixels) {\r\n        node._setWeight(weight);\r\n        if (node.getWidth() != null && node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.VERT) {\r\n            node._updateAttrs({ width: pixels });\r\n        }\r\n        else if (node.getHeight() != null && node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\r\n            node._updateAttrs({ height: pixels });\r\n        }\r\n    }\r\n    /**\r\n     * Converts the model to a json object\r\n     * @returns {IJsonModel} json object that represents this model\r\n     */\r\n    toJson() {\r\n        const global = {};\r\n        Model._attributeDefinitions.toJson(global, this._attributes);\r\n        // save state of nodes\r\n        this.visitNodes((node) => {\r\n            node._fireEvent(\"save\", undefined);\r\n        });\r\n        return { global, borders: this._borders._toJson(), layout: this._root.toJson() };\r\n    }\r\n    getSplitterSize() {\r\n        let splitterSize = this._attributes.splitterSize;\r\n        if (splitterSize === -1) {\r\n            // use defaults\r\n            splitterSize = this._pointerFine ? 8 : 12; // larger for mobile\r\n        }\r\n        return splitterSize;\r\n    }\r\n    isLegacyOverflowMenu() {\r\n        return this._attributes.legacyOverflowMenu;\r\n    }\r\n    getSplitterExtra() {\r\n        return this._attributes.splitterExtra;\r\n    }\r\n    isEnableEdgeDock() {\r\n        return this._attributes.enableEdgeDock;\r\n    }\r\n    /** @internal */\r\n    _addNode(node) {\r\n        const id = node.getId();\r\n        if (this._idMap[id] !== undefined) {\r\n            throw new Error(`Error: each node must have a unique id, duplicate id:${node.getId()}`);\r\n        }\r\n        if (node.getType() !== \"splitter\") {\r\n            this._idMap[id] = node;\r\n        }\r\n    }\r\n    /** @internal */\r\n    _layout(rect, metrics) {\r\n        var _a;\r\n        // let start = Date.now();\r\n        this._borderRects = this._borders._layoutBorder({ outer: rect, inner: rect }, metrics);\r\n        rect = this._borderRects.inner.removeInsets(this._getAttribute(\"marginInsets\"));\r\n        (_a = this._root) === null || _a === void 0 ? void 0 : _a.calcMinSize();\r\n        this._root._layout(rect, metrics);\r\n        // console.log(\"layout time: \" + (Date.now() - start));\r\n        return rect;\r\n    }\r\n    /** @internal */\r\n    _findDropTargetNode(dragNode, x, y) {\r\n        let node = this._root._findDropTargetNode(dragNode, x, y);\r\n        if (node === undefined) {\r\n            node = this._borders._findDropTargetNode(dragNode, x, y);\r\n        }\r\n        return node;\r\n    }\r\n    /** @internal */\r\n    _tidy() {\r\n        // console.log(\"before _tidy\", this.toString());\r\n        this._root._tidy();\r\n        // console.log(\"after _tidy\", this.toString());\r\n    }\r\n    /** @internal */\r\n    _updateAttrs(json) {\r\n        Model._attributeDefinitions.update(json, this._attributes);\r\n    }\r\n    /** @internal */\r\n    _nextUniqueId() {\r\n        return '#' + (0,uuid__WEBPACK_IMPORTED_MODULE_12__[\"default\"])();\r\n    }\r\n    /** @internal */\r\n    _getAttribute(name) {\r\n        return this._attributes[name];\r\n    }\r\n    /**\r\n     * Sets a function to allow/deny dropping a node\r\n     * @param onAllowDrop function that takes the drag node and DropInfo and returns true if the drop is allowed\r\n     */\r\n    setOnAllowDrop(onAllowDrop) {\r\n        this._onAllowDrop = onAllowDrop;\r\n    }\r\n    /** @internal */\r\n    _getOnAllowDrop() {\r\n        return this._onAllowDrop;\r\n    }\r\n    /**\r\n     * set callback called when a new TabSet is created.\r\n     * The tabNode can be undefined if it's the auto created first tabset in the root row (when the last\r\n     * tab is deleted, the root tabset can be recreated)\r\n     * @param onCreateTabSet\r\n     */\r\n    setOnCreateTabSet(onCreateTabSet) {\r\n        this._onCreateTabSet = onCreateTabSet;\r\n    }\r\n    /** @internal */\r\n    _getOnCreateTabSet() {\r\n        return this._onCreateTabSet;\r\n    }\r\n    static toTypescriptInterfaces() {\r\n        console.log(Model._attributeDefinitions.toTypescriptInterface(\"Global\", undefined));\r\n        console.log(_RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode.getAttributeDefinitions().toTypescriptInterface(\"Row\", Model._attributeDefinitions));\r\n        console.log(_TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode.getAttributeDefinitions().toTypescriptInterface(\"TabSet\", Model._attributeDefinitions));\r\n        console.log(_TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode.getAttributeDefinitions().toTypescriptInterface(\"Tab\", Model._attributeDefinitions));\r\n        console.log(_BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode.getAttributeDefinitions().toTypescriptInterface(\"Border\", Model._attributeDefinitions));\r\n    }\r\n    toString() {\r\n        return JSON.stringify(this.toJson());\r\n    }\r\n}\r\n/** @internal */\r\nModel._attributeDefinitions = Model._createAttributeDefinitions();\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Model.ts?");
 
 /***/ }),
 
@@ -374,9 +274,9 @@ eval("\nvar __spreadArray = (this && this.__spreadArray) || function (to, from,
 /*!***************************!*\
   !*** ./src/model/Node.ts ***!
   \***************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Node = void 0;\nvar DockLocation_1 = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar Node = /** @class */ (function () {\n    /** @internal */\n    function Node(model) {\n        /** @internal */\n        this._dirty = false;\n        /** @internal */\n        this._tempSize = 0;\n        this._model = model;\n        this._attributes = {};\n        this._children = [];\n        this._fixed = false;\n        this._rect = Rect_1.Rect.empty();\n        this._visible = false;\n        this._listeners = {};\n    }\n    Node.prototype.getId = function () {\n        var id = this._attributes.id;\n        if (id !== undefined) {\n            return id;\n        }\n        id = this._model._nextUniqueId();\n        this._setId(id);\n        return id;\n    };\n    Node.prototype.getModel = function () {\n        return this._model;\n    };\n    Node.prototype.getType = function () {\n        return this._attributes.type;\n    };\n    Node.prototype.getParent = function () {\n        return this._parent;\n    };\n    Node.prototype.getChildren = function () {\n        return this._children;\n    };\n    Node.prototype.getRect = function () {\n        return this._rect;\n    };\n    Node.prototype.isVisible = function () {\n        return this._visible;\n    };\n    Node.prototype.getOrientation = function () {\n        if (this._parent === undefined) {\n            return this._model.isRootOrientationVertical() ? Orientation_1.Orientation.VERT : Orientation_1.Orientation.HORZ;\n        }\n        else {\n            return Orientation_1.Orientation.flip(this._parent.getOrientation());\n        }\n    };\n    // event can be: resize, visibility, maximize (on tabset), close\n    Node.prototype.setEventListener = function (event, callback) {\n        this._listeners[event] = callback;\n    };\n    Node.prototype.removeEventListener = function (event) {\n        delete this._listeners[event];\n    };\n    /** @internal */\n    Node.prototype._setId = function (id) {\n        this._attributes.id = id;\n    };\n    /** @internal */\n    Node.prototype._fireEvent = function (event, params) {\n        // console.log(this._type, \" fireEvent \" + event + \" \" + JSON.stringify(params));\n        if (this._listeners[event] !== undefined) {\n            this._listeners[event](params);\n        }\n    };\n    /** @internal */\n    Node.prototype._getAttr = function (name) {\n        var val = this._attributes[name];\n        if (val === undefined) {\n            var modelName = this._getAttributeDefinitions().getModelName(name);\n            if (modelName !== undefined) {\n                val = this._model._getAttribute(modelName);\n            }\n        }\n        // console.log(name + \"=\" + val);\n        return val;\n    };\n    /** @internal */\n    Node.prototype._forEachNode = function (fn, level) {\n        fn(this, level);\n        level++;\n        for (var _i = 0, _a = this._children; _i < _a.length; _i++) {\n            var node = _a[_i];\n            node._forEachNode(fn, level);\n        }\n    };\n    /** @internal */\n    Node.prototype._setVisible = function (visible) {\n        if (visible !== this._visible) {\n            this._fireEvent(\"visibility\", { visible: visible });\n            this._visible = visible;\n        }\n    };\n    /** @internal */\n    Node.prototype._getDrawChildren = function () {\n        return this._children;\n    };\n    /** @internal */\n    Node.prototype._setParent = function (parent) {\n        this._parent = parent;\n    };\n    /** @internal */\n    Node.prototype._setRect = function (rect) {\n        this._rect = rect;\n    };\n    /** @internal */\n    Node.prototype._setWeight = function (weight) {\n        this._attributes.weight = weight;\n    };\n    /** @internal */\n    Node.prototype._setSelected = function (index) {\n        this._attributes.selected = index;\n    };\n    /** @internal */\n    Node.prototype._isFixed = function () {\n        return this._fixed;\n    };\n    /** @internal */\n    Node.prototype._layout = function (rect, metrics) {\n        this._rect = rect;\n    };\n    /** @internal */\n    Node.prototype._findDropTargetNode = function (dragNode, x, y) {\n        var rtn;\n        if (this._rect.contains(x, y)) {\n            if (this._model.getMaximizedTabset() !== undefined) {\n                rtn = this._model.getMaximizedTabset().canDrop(dragNode, x, y);\n            }\n            else {\n                rtn = this.canDrop(dragNode, x, y);\n                if (rtn === undefined) {\n                    if (this._children.length !== 0) {\n                        for (var _i = 0, _a = this._children; _i < _a.length; _i++) {\n                            var child = _a[_i];\n                            rtn = child._findDropTargetNode(dragNode, x, y);\n                            if (rtn !== undefined) {\n                                break;\n                            }\n                        }\n                    }\n                }\n            }\n        }\n        return rtn;\n    };\n    /** @internal */\n    Node.prototype.canDrop = function (dragNode, x, y) {\n        return undefined;\n    };\n    /** @internal */\n    Node.prototype._canDockInto = function (dragNode, dropInfo) {\n        if (dropInfo != null) {\n            if (dropInfo.location === DockLocation_1.DockLocation.CENTER && dropInfo.node.isEnableDrop() === false) {\n                return false;\n            }\n            // prevent named tabset docking into another tabset, since this would lose the header\n            if (dropInfo.location === DockLocation_1.DockLocation.CENTER && dragNode.getType() === \"tabset\" && dragNode.getName() !== undefined) {\n                return false;\n            }\n            if (dropInfo.location !== DockLocation_1.DockLocation.CENTER && dropInfo.node.isEnableDivide() === false) {\n                return false;\n            }\n            // finally check model callback to check if drop allowed\n            if (this._model._getOnAllowDrop()) {\n                return this._model._getOnAllowDrop()(dragNode, dropInfo);\n            }\n        }\n        return true;\n    };\n    /** @internal */\n    Node.prototype._removeChild = function (childNode) {\n        var pos = this._children.indexOf(childNode);\n        if (pos !== -1) {\n            this._children.splice(pos, 1);\n        }\n        this._dirty = true;\n        return pos;\n    };\n    /** @internal */\n    Node.prototype._addChild = function (childNode, pos) {\n        if (pos != null) {\n            this._children.splice(pos, 0, childNode);\n        }\n        else {\n            this._children.push(childNode);\n            pos = this._children.length - 1;\n        }\n        childNode._parent = this;\n        this._dirty = true;\n        return pos;\n    };\n    /** @internal */\n    Node.prototype._removeAll = function () {\n        this._children = [];\n        this._dirty = true;\n    };\n    /** @internal */\n    Node.prototype._styleWithPosition = function (style) {\n        if (style == null) {\n            style = {};\n        }\n        return this._rect.styleWithPosition(style);\n    };\n    /** @internal */\n    Node.prototype._getTempSize = function () {\n        return this._tempSize;\n    };\n    /** @internal */\n    Node.prototype._setTempSize = function (value) {\n        this._tempSize = value;\n    };\n    /** @internal */\n    Node.prototype.isEnableDivide = function () {\n        return true;\n    };\n    /** @internal */\n    Node.prototype._toAttributeString = function () {\n        return JSON.stringify(this._attributes, undefined, \"\\t\");\n    };\n    return Node;\n}());\nexports.Node = Node;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Node.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Node\": () => (/* binding */ Node)\n/* harmony export */ });\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n\r\n\r\n\r\nclass Node {\r\n    /** @internal */\r\n    constructor(model) {\r\n        /** @internal */\r\n        this._dirty = false;\r\n        /** @internal */\r\n        this._tempSize = 0;\r\n        this._model = model;\r\n        this._attributes = {};\r\n        this._children = [];\r\n        this._fixed = false;\r\n        this._rect = _Rect__WEBPACK_IMPORTED_MODULE_2__.Rect.empty();\r\n        this._visible = false;\r\n        this._listeners = {};\r\n    }\r\n    getId() {\r\n        let id = this._attributes.id;\r\n        if (id !== undefined) {\r\n            return id;\r\n        }\r\n        id = this._model._nextUniqueId();\r\n        this._setId(id);\r\n        return id;\r\n    }\r\n    getModel() {\r\n        return this._model;\r\n    }\r\n    getType() {\r\n        return this._attributes.type;\r\n    }\r\n    getParent() {\r\n        return this._parent;\r\n    }\r\n    getChildren() {\r\n        return this._children;\r\n    }\r\n    getRect() {\r\n        return this._rect;\r\n    }\r\n    isVisible() {\r\n        return this._visible;\r\n    }\r\n    getOrientation() {\r\n        if (this._parent === undefined) {\r\n            return this._model.isRootOrientationVertical() ? _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.VERT : _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ;\r\n        }\r\n        else {\r\n            return _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.flip(this._parent.getOrientation());\r\n        }\r\n    }\r\n    // event can be: resize, visibility, maximize (on tabset), close\r\n    setEventListener(event, callback) {\r\n        this._listeners[event] = callback;\r\n    }\r\n    removeEventListener(event) {\r\n        delete this._listeners[event];\r\n    }\r\n    /** @internal */\r\n    _setId(id) {\r\n        this._attributes.id = id;\r\n    }\r\n    /** @internal */\r\n    _fireEvent(event, params) {\r\n        // console.log(this._type, \" fireEvent \" + event + \" \" + JSON.stringify(params));\r\n        if (this._listeners[event] !== undefined) {\r\n            this._listeners[event](params);\r\n        }\r\n    }\r\n    /** @internal */\r\n    _getAttr(name) {\r\n        let val = this._attributes[name];\r\n        if (val === undefined) {\r\n            const modelName = this._getAttributeDefinitions().getModelName(name);\r\n            if (modelName !== undefined) {\r\n                val = this._model._getAttribute(modelName);\r\n            }\r\n        }\r\n        // console.log(name + \"=\" + val);\r\n        return val;\r\n    }\r\n    /** @internal */\r\n    _forEachNode(fn, level) {\r\n        fn(this, level);\r\n        level++;\r\n        for (const node of this._children) {\r\n            node._forEachNode(fn, level);\r\n        }\r\n    }\r\n    /** @internal */\r\n    _setVisible(visible) {\r\n        if (visible !== this._visible) {\r\n            this._fireEvent(\"visibility\", { visible });\r\n            this._visible = visible;\r\n        }\r\n    }\r\n    /** @internal */\r\n    _getDrawChildren() {\r\n        return this._children;\r\n    }\r\n    /** @internal */\r\n    _setParent(parent) {\r\n        this._parent = parent;\r\n    }\r\n    /** @internal */\r\n    _setRect(rect) {\r\n        this._rect = rect;\r\n    }\r\n    /** @internal */\r\n    _setWeight(weight) {\r\n        this._attributes.weight = weight;\r\n    }\r\n    /** @internal */\r\n    _setSelected(index) {\r\n        this._attributes.selected = index;\r\n    }\r\n    /** @internal */\r\n    _isFixed() {\r\n        return this._fixed;\r\n    }\r\n    /** @internal */\r\n    _layout(rect, metrics) {\r\n        this._rect = rect;\r\n    }\r\n    /** @internal */\r\n    _findDropTargetNode(dragNode, x, y) {\r\n        let rtn;\r\n        if (this._rect.contains(x, y)) {\r\n            if (this._model.getMaximizedTabset() !== undefined) {\r\n                rtn = this._model.getMaximizedTabset().canDrop(dragNode, x, y);\r\n            }\r\n            else {\r\n                rtn = this.canDrop(dragNode, x, y);\r\n                if (rtn === undefined) {\r\n                    if (this._children.length !== 0) {\r\n                        for (const child of this._children) {\r\n                            rtn = child._findDropTargetNode(dragNode, x, y);\r\n                            if (rtn !== undefined) {\r\n                                break;\r\n                            }\r\n                        }\r\n                    }\r\n                }\r\n            }\r\n        }\r\n        return rtn;\r\n    }\r\n    /** @internal */\r\n    canDrop(dragNode, x, y) {\r\n        return undefined;\r\n    }\r\n    /** @internal */\r\n    _canDockInto(dragNode, dropInfo) {\r\n        if (dropInfo != null) {\r\n            if (dropInfo.location === _DockLocation__WEBPACK_IMPORTED_MODULE_0__.DockLocation.CENTER && dropInfo.node.isEnableDrop() === false) {\r\n                return false;\r\n            }\r\n            // prevent named tabset docking into another tabset, since this would lose the header\r\n            if (dropInfo.location === _DockLocation__WEBPACK_IMPORTED_MODULE_0__.DockLocation.CENTER && dragNode.getType() === \"tabset\" && dragNode.getName() !== undefined) {\r\n                return false;\r\n            }\r\n            if (dropInfo.location !== _DockLocation__WEBPACK_IMPORTED_MODULE_0__.DockLocation.CENTER && dropInfo.node.isEnableDivide() === false) {\r\n                return false;\r\n            }\r\n            // finally check model callback to check if drop allowed\r\n            if (this._model._getOnAllowDrop()) {\r\n                return this._model._getOnAllowDrop()(dragNode, dropInfo);\r\n            }\r\n        }\r\n        return true;\r\n    }\r\n    /** @internal */\r\n    _removeChild(childNode) {\r\n        const pos = this._children.indexOf(childNode);\r\n        if (pos !== -1) {\r\n            this._children.splice(pos, 1);\r\n        }\r\n        this._dirty = true;\r\n        return pos;\r\n    }\r\n    /** @internal */\r\n    _addChild(childNode, pos) {\r\n        if (pos != null) {\r\n            this._children.splice(pos, 0, childNode);\r\n        }\r\n        else {\r\n            this._children.push(childNode);\r\n            pos = this._children.length - 1;\r\n        }\r\n        childNode._parent = this;\r\n        this._dirty = true;\r\n        return pos;\r\n    }\r\n    /** @internal */\r\n    _removeAll() {\r\n        this._children = [];\r\n        this._dirty = true;\r\n    }\r\n    /** @internal */\r\n    _styleWithPosition(style) {\r\n        if (style == null) {\r\n            style = {};\r\n        }\r\n        return this._rect.styleWithPosition(style);\r\n    }\r\n    /** @internal */\r\n    _getTempSize() {\r\n        return this._tempSize;\r\n    }\r\n    /** @internal */\r\n    _setTempSize(value) {\r\n        this._tempSize = value;\r\n    }\r\n    /** @internal */\r\n    isEnableDivide() {\r\n        return true;\r\n    }\r\n    /** @internal */\r\n    _toAttributeString() {\r\n        return JSON.stringify(this._attributes, undefined, \"\\t\");\r\n    }\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Node.ts?");
 
 /***/ }),
 
@@ -384,9 +284,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!******************************!*\
   !*** ./src/model/RowNode.ts ***!
   \******************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        if (typeof b !== \"function\" && b !== null)\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nvar __assign = (this && this.__assign) || function () {\n    __assign = Object.assign || function(t) {\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\n            s = arguments[i];\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\n                t[p] = s[p];\n        }\n        return t;\n    };\n    return __assign.apply(this, arguments);\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.RowNode = void 0;\nvar Attribute_1 = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\nvar AttributeDefinitions_1 = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\nvar DockLocation_1 = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\nvar DropInfo_1 = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar BorderNode_1 = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\nvar Node_1 = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\nvar SplitterNode_1 = __webpack_require__(/*! ./SplitterNode */ \"./src/model/SplitterNode.ts\");\nvar TabSetNode_1 = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\nvar RowNode = /** @class */ (function (_super) {\n    __extends(RowNode, _super);\n    /** @internal */\n    function RowNode(model, json) {\n        var _this = _super.call(this, model) || this;\n        _this._dirty = true;\n        _this._drawChildren = [];\n        _this._minHeight = 0;\n        _this._minWidth = 0;\n        RowNode._attributeDefinitions.fromJson(json, _this._attributes);\n        model._addNode(_this);\n        return _this;\n    }\n    /** @internal */\n    RowNode._fromJson = function (json, model) {\n        var newLayoutNode = new RowNode(model, json);\n        if (json.children != null) {\n            for (var _i = 0, _a = json.children; _i < _a.length; _i++) {\n                var jsonChild = _a[_i];\n                if (jsonChild.type === TabSetNode_1.TabSetNode.TYPE) {\n                    var child = TabSetNode_1.TabSetNode._fromJson(jsonChild, model);\n                    newLayoutNode._addChild(child);\n                }\n                else {\n                    var child = RowNode._fromJson(jsonChild, model);\n                    newLayoutNode._addChild(child);\n                }\n            }\n        }\n        return newLayoutNode;\n    };\n    /** @internal */\n    RowNode._createAttributeDefinitions = function () {\n        var attributeDefinitions = new AttributeDefinitions_1.AttributeDefinitions();\n        attributeDefinitions.add(\"type\", RowNode.TYPE, true).setType(Attribute_1.Attribute.STRING).setFixed();\n        attributeDefinitions.add(\"id\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"weight\", 100).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"width\", undefined).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"height\", undefined).setType(Attribute_1.Attribute.NUMBER);\n        return attributeDefinitions;\n    };\n    RowNode.prototype.getWeight = function () {\n        return this._attributes.weight;\n    };\n    RowNode.prototype.getWidth = function () {\n        return this._getAttr(\"width\");\n    };\n    RowNode.prototype.getHeight = function () {\n        return this._getAttr(\"height\");\n    };\n    /** @internal */\n    RowNode.prototype._setWeight = function (weight) {\n        this._attributes.weight = weight;\n    };\n    /** @internal */\n    RowNode.prototype._layout = function (rect, metrics) {\n        _super.prototype._layout.call(this, rect, metrics);\n        var pixelSize = this._rect._getSize(this.getOrientation());\n        var totalWeight = 0;\n        var fixedPixels = 0;\n        var prefPixels = 0;\n        var totalPrefWeight = 0;\n        var drawChildren = this._getDrawChildren();\n        for (var _i = 0, drawChildren_1 = drawChildren; _i < drawChildren_1.length; _i++) {\n            var child = drawChildren_1[_i];\n            var prefSize = child._getPrefSize(this.getOrientation());\n            if (child._isFixed()) {\n                if (prefSize !== undefined) {\n                    fixedPixels += prefSize;\n                }\n            }\n            else {\n                if (prefSize === undefined) {\n                    totalWeight += child.getWeight();\n                }\n                else {\n                    prefPixels += prefSize;\n                    totalPrefWeight += child.getWeight();\n                }\n            }\n        }\n        var resizePreferred = false;\n        var availablePixels = pixelSize - fixedPixels - prefPixels;\n        if (availablePixels < 0) {\n            availablePixels = pixelSize - fixedPixels;\n            resizePreferred = true;\n            totalWeight += totalPrefWeight;\n        }\n        // assign actual pixel sizes\n        var totalSizeGiven = 0;\n        var variableSize = 0;\n        for (var _a = 0, drawChildren_2 = drawChildren; _a < drawChildren_2.length; _a++) {\n            var child = drawChildren_2[_a];\n            var prefSize = child._getPrefSize(this.getOrientation());\n            if (child._isFixed()) {\n                if (prefSize !== undefined) {\n                    child._setTempSize(prefSize);\n                }\n            }\n            else {\n                if (prefSize == null || resizePreferred) {\n                    if (totalWeight === 0) {\n                        child._setTempSize(0);\n                    }\n                    else {\n                        var minSize = child.getMinSize(this.getOrientation());\n                        var size = Math.floor(availablePixels * (child.getWeight() / totalWeight));\n                        child._setTempSize(Math.max(minSize, size));\n                    }\n                    variableSize += child._getTempSize();\n                }\n                else {\n                    child._setTempSize(prefSize);\n                }\n            }\n            totalSizeGiven += child._getTempSize();\n        }\n        // adjust sizes to exactly fit\n        if (variableSize > 0) {\n            while (totalSizeGiven < pixelSize) {\n                for (var _b = 0, drawChildren_3 = drawChildren; _b < drawChildren_3.length; _b++) {\n                    var child = drawChildren_3[_b];\n                    if (!(child instanceof SplitterNode_1.SplitterNode)) {\n                        var prefSize = child._getPrefSize(this.getOrientation());\n                        if (!child._isFixed() && (prefSize === undefined || resizePreferred) && totalSizeGiven < pixelSize) {\n                            child._setTempSize(child._getTempSize() + 1);\n                            totalSizeGiven++;\n                        }\n                    }\n                }\n            }\n            // decrease size using nodes not at there minimum\n            while (totalSizeGiven > pixelSize) {\n                var changed = false;\n                for (var _c = 0, drawChildren_4 = drawChildren; _c < drawChildren_4.length; _c++) {\n                    var child = drawChildren_4[_c];\n                    if (!(child instanceof SplitterNode_1.SplitterNode)) {\n                        var minSize = child.getMinSize(this.getOrientation());\n                        var size = child._getTempSize();\n                        if (size > minSize && totalSizeGiven > pixelSize) {\n                            child._setTempSize(child._getTempSize() - 1);\n                            totalSizeGiven--;\n                            changed = true;\n                        }\n                    }\n                }\n                if (!changed) {\n                    // all children are at min values\n                    break;\n                }\n            }\n            // if still too big then simply reduce all nodes until fits\n            while (totalSizeGiven > pixelSize) {\n                var changed = false;\n                for (var _d = 0, drawChildren_5 = drawChildren; _d < drawChildren_5.length; _d++) {\n                    var child = drawChildren_5[_d];\n                    if (!(child instanceof SplitterNode_1.SplitterNode)) {\n                        var size = child._getTempSize();\n                        if (size > 0 && totalSizeGiven > pixelSize) {\n                            child._setTempSize(child._getTempSize() - 1);\n                            totalSizeGiven--;\n                            changed = true;\n                        }\n                    }\n                }\n                if (!changed) {\n                    // all children are at 0 values\n                    break;\n                }\n            }\n        }\n        // layout children\n        var p = 0;\n        for (var _e = 0, drawChildren_6 = drawChildren; _e < drawChildren_6.length; _e++) {\n            var child = drawChildren_6[_e];\n            if (this.getOrientation() === Orientation_1.Orientation.HORZ) {\n                child._layout(new Rect_1.Rect(this._rect.x + p, this._rect.y, child._getTempSize(), this._rect.height), metrics);\n            }\n            else {\n                child._layout(new Rect_1.Rect(this._rect.x, this._rect.y + p, this._rect.width, child._getTempSize()), metrics);\n            }\n            p += child._getTempSize();\n        }\n        return true;\n    };\n    /** @internal */\n    RowNode.prototype._getSplitterBounds = function (splitterNode, useMinSize) {\n        if (useMinSize === void 0) { useMinSize = false; }\n        var pBounds = [0, 0];\n        var drawChildren = this._getDrawChildren();\n        var p = drawChildren.indexOf(splitterNode);\n        var node1 = drawChildren[p - 1];\n        var node2 = drawChildren[p + 1];\n        if (this.getOrientation() === Orientation_1.Orientation.HORZ) {\n            var minSize1 = useMinSize ? node1.getMinWidth() : 0;\n            var minSize2 = useMinSize ? node2.getMinWidth() : 0;\n            pBounds[0] = node1.getRect().x + minSize1;\n            pBounds[1] = node2.getRect().getRight() - splitterNode.getWidth() - minSize2;\n        }\n        else {\n            var minSize1 = useMinSize ? node1.getMinHeight() : 0;\n            var minSize2 = useMinSize ? node2.getMinHeight() : 0;\n            pBounds[0] = node1.getRect().y + minSize1;\n            pBounds[1] = node2.getRect().getBottom() - splitterNode.getHeight() - minSize2;\n        }\n        return pBounds;\n    };\n    /** @internal */\n    RowNode.prototype._calculateSplit = function (splitter, splitterPos) {\n        var rtn;\n        var drawChildren = this._getDrawChildren();\n        var p = drawChildren.indexOf(splitter);\n        var pBounds = this._getSplitterBounds(splitter);\n        var weightedLength = drawChildren[p - 1].getWeight() + drawChildren[p + 1].getWeight();\n        var pixelWidth1 = Math.max(0, splitterPos - pBounds[0]);\n        var pixelWidth2 = Math.max(0, pBounds[1] - splitterPos);\n        if (pixelWidth1 + pixelWidth2 > 0) {\n            var weight1 = (pixelWidth1 * weightedLength) / (pixelWidth1 + pixelWidth2);\n            var weight2 = (pixelWidth2 * weightedLength) / (pixelWidth1 + pixelWidth2);\n            rtn = {\n                node1Id: drawChildren[p - 1].getId(),\n                weight1: weight1,\n                pixelWidth1: pixelWidth1,\n                node2Id: drawChildren[p + 1].getId(),\n                weight2: weight2,\n                pixelWidth2: pixelWidth2,\n            };\n        }\n        return rtn;\n    };\n    /** @internal */\n    RowNode.prototype._getDrawChildren = function () {\n        if (this._dirty) {\n            this._drawChildren = [];\n            for (var i = 0; i < this._children.length; i++) {\n                var child = this._children[i];\n                if (i !== 0) {\n                    var newSplitter = new SplitterNode_1.SplitterNode(this._model);\n                    newSplitter._setParent(this);\n                    this._drawChildren.push(newSplitter);\n                }\n                this._drawChildren.push(child);\n            }\n            this._dirty = false;\n        }\n        return this._drawChildren;\n    };\n    /** @internal */\n    RowNode.prototype.getMinSize = function (orientation) {\n        if (orientation === Orientation_1.Orientation.HORZ) {\n            return this.getMinWidth();\n        }\n        else {\n            return this.getMinHeight();\n        }\n    };\n    /** @internal */\n    RowNode.prototype.getMinWidth = function () {\n        return this._minWidth;\n    };\n    /** @internal */\n    RowNode.prototype.getMinHeight = function () {\n        return this._minHeight;\n    };\n    /** @internal */\n    RowNode.prototype.calcMinSize = function () {\n        this._minHeight = 0;\n        this._minWidth = 0;\n        var first = true;\n        for (var _i = 0, _a = this._children; _i < _a.length; _i++) {\n            var child = _a[_i];\n            var c = child;\n            if (c instanceof RowNode) {\n                c.calcMinSize();\n            }\n            if (this.getOrientation() === Orientation_1.Orientation.VERT) {\n                this._minHeight += c.getMinHeight();\n                if (!first) {\n                    this._minHeight += this._model.getSplitterSize();\n                }\n                this._minWidth = Math.max(this._minWidth, c.getMinWidth());\n            }\n            else {\n                this._minWidth += c.getMinWidth();\n                if (!first) {\n                    this._minWidth += this._model.getSplitterSize();\n                }\n                this._minHeight = Math.max(this._minHeight, c.getMinHeight());\n            }\n            first = false;\n        }\n    };\n    /** @internal */\n    RowNode.prototype._tidy = function () {\n        var i = 0;\n        while (i < this._children.length) {\n            var child = this._children[i];\n            if (child instanceof RowNode) {\n                child._tidy();\n                var childChildren = child.getChildren();\n                if (childChildren.length === 0) {\n                    this._removeChild(child);\n                }\n                else if (childChildren.length === 1) {\n                    // hoist child/children up to this level\n                    var subchild = childChildren[0];\n                    this._removeChild(child);\n                    if (subchild instanceof RowNode) {\n                        var subChildrenTotal = 0;\n                        var subChildChildren = subchild.getChildren();\n                        for (var _i = 0, subChildChildren_1 = subChildChildren; _i < subChildChildren_1.length; _i++) {\n                            var ssc = subChildChildren_1[_i];\n                            var subsubChild = ssc;\n                            subChildrenTotal += subsubChild.getWeight();\n                        }\n                        for (var j = 0; j < subChildChildren.length; j++) {\n                            var subsubChild = subChildChildren[j];\n                            subsubChild._setWeight((child.getWeight() * subsubChild.getWeight()) / subChildrenTotal);\n                            this._addChild(subsubChild, i + j);\n                        }\n                    }\n                    else {\n                        subchild._setWeight(child.getWeight());\n                        this._addChild(subchild, i);\n                    }\n                }\n                else {\n                    i++;\n                }\n            }\n            else if (child instanceof TabSetNode_1.TabSetNode && child.getChildren().length === 0) {\n                if (child.isEnableDeleteWhenEmpty()) {\n                    this._removeChild(child);\n                    if (child === this._model.getMaximizedTabset()) {\n                        this._model._setMaximizedTabset(undefined);\n                    }\n                }\n                else {\n                    i++;\n                }\n            }\n            else {\n                i++;\n            }\n        }\n        // add tabset into empty root\n        if (this === this._model.getRoot() && this._children.length === 0) {\n            var callback = this._model._getOnCreateTabSet();\n            var attrs = callback ? callback() : {};\n            attrs = __assign(__assign({}, attrs), { selected: -1 });\n            var child = new TabSetNode_1.TabSetNode(this._model, attrs);\n            this._model._setActiveTabset(child);\n            this._addChild(child);\n        }\n    };\n    /** @internal */\n    RowNode.prototype.canDrop = function (dragNode, x, y) {\n        var yy = y - this._rect.y;\n        var xx = x - this._rect.x;\n        var w = this._rect.width;\n        var h = this._rect.height;\n        var margin = 10; // height of edge rect\n        var half = 50; // half width of edge rect\n        var dropInfo;\n        if (this._model.isEnableEdgeDock() && this._parent === undefined) {\n            // _root row\n            if (x < this._rect.x + margin && yy > h / 2 - half && yy < h / 2 + half) {\n                var dockLocation = DockLocation_1.DockLocation.LEFT;\n                var outlineRect = dockLocation.getDockRect(this._rect);\n                outlineRect.width = outlineRect.width / 2;\n                dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, -1, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT_EDGE);\n            }\n            else if (x > this._rect.getRight() - margin && yy > h / 2 - half && yy < h / 2 + half) {\n                var dockLocation = DockLocation_1.DockLocation.RIGHT;\n                var outlineRect = dockLocation.getDockRect(this._rect);\n                outlineRect.width = outlineRect.width / 2;\n                outlineRect.x += outlineRect.width;\n                dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, -1, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT_EDGE);\n            }\n            else if (y < this._rect.y + margin && xx > w / 2 - half && xx < w / 2 + half) {\n                var dockLocation = DockLocation_1.DockLocation.TOP;\n                var outlineRect = dockLocation.getDockRect(this._rect);\n                outlineRect.height = outlineRect.height / 2;\n                dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, -1, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT_EDGE);\n            }\n            else if (y > this._rect.getBottom() - margin && xx > w / 2 - half && xx < w / 2 + half) {\n                var dockLocation = DockLocation_1.DockLocation.BOTTOM;\n                var outlineRect = dockLocation.getDockRect(this._rect);\n                outlineRect.height = outlineRect.height / 2;\n                outlineRect.y += outlineRect.height;\n                dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, -1, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT_EDGE);\n            }\n            if (dropInfo !== undefined) {\n                if (!dragNode._canDockInto(dragNode, dropInfo)) {\n                    return undefined;\n                }\n            }\n        }\n        return dropInfo;\n    };\n    /** @internal */\n    RowNode.prototype.drop = function (dragNode, location, index) {\n        var dockLocation = location;\n        var parent = dragNode.getParent();\n        if (parent) {\n            parent._removeChild(dragNode);\n        }\n        if (parent !== undefined && parent.getType() === TabSetNode_1.TabSetNode.TYPE) {\n            parent._setSelected(0);\n        }\n        if (parent !== undefined && parent.getType() === BorderNode_1.BorderNode.TYPE) {\n            parent._setSelected(-1);\n        }\n        var tabSet;\n        if (dragNode instanceof TabSetNode_1.TabSetNode) {\n            tabSet = dragNode;\n        }\n        else {\n            var callback = this._model._getOnCreateTabSet();\n            tabSet = new TabSetNode_1.TabSetNode(this._model, callback ? callback(dragNode) : {});\n            tabSet._addChild(dragNode);\n        }\n        var size = this._children.reduce(function (sum, child) {\n            return sum + child.getWeight();\n        }, 0);\n        if (size === 0) {\n            size = 100;\n        }\n        tabSet._setWeight(size / 3);\n        var horz = !this._model.isRootOrientationVertical();\n        if (horz && dockLocation === DockLocation_1.DockLocation.LEFT || !horz && dockLocation === DockLocation_1.DockLocation.TOP) {\n            this._addChild(tabSet, 0);\n        }\n        else if (horz && dockLocation === DockLocation_1.DockLocation.RIGHT || !horz && dockLocation === DockLocation_1.DockLocation.BOTTOM) {\n            this._addChild(tabSet);\n        }\n        else if (horz && dockLocation === DockLocation_1.DockLocation.TOP || !horz && dockLocation === DockLocation_1.DockLocation.LEFT) {\n            var vrow = new RowNode(this._model, {});\n            var hrow = new RowNode(this._model, {});\n            hrow._setWeight(75);\n            tabSet._setWeight(25);\n            for (var _i = 0, _a = this._children; _i < _a.length; _i++) {\n                var child = _a[_i];\n                hrow._addChild(child);\n            }\n            this._removeAll();\n            vrow._addChild(tabSet);\n            vrow._addChild(hrow);\n            this._addChild(vrow);\n        }\n        else if (horz && dockLocation === DockLocation_1.DockLocation.BOTTOM || !horz && dockLocation === DockLocation_1.DockLocation.RIGHT) {\n            var vrow = new RowNode(this._model, {});\n            var hrow = new RowNode(this._model, {});\n            hrow._setWeight(75);\n            tabSet._setWeight(25);\n            for (var _b = 0, _c = this._children; _b < _c.length; _b++) {\n                var child = _c[_b];\n                hrow._addChild(child);\n            }\n            this._removeAll();\n            vrow._addChild(hrow);\n            vrow._addChild(tabSet);\n            this._addChild(vrow);\n        }\n        this._model._setActiveTabset(tabSet);\n        this._model._tidy();\n    };\n    RowNode.prototype.toJson = function () {\n        var json = {};\n        RowNode._attributeDefinitions.toJson(json, this._attributes);\n        json.children = [];\n        for (var _i = 0, _a = this._children; _i < _a.length; _i++) {\n            var child = _a[_i];\n            json.children.push(child.toJson());\n        }\n        return json;\n    };\n    RowNode.prototype.isEnableDrop = function () {\n        return true;\n    };\n    /** @internal */\n    RowNode.prototype._getPrefSize = function (orientation) {\n        var prefSize = this.getWidth();\n        if (orientation === Orientation_1.Orientation.VERT) {\n            prefSize = this.getHeight();\n        }\n        return prefSize;\n    };\n    /** @internal */\n    RowNode.prototype._getAttributeDefinitions = function () {\n        return RowNode._attributeDefinitions;\n    };\n    /** @internal */\n    RowNode.prototype._updateAttrs = function (json) {\n        RowNode._attributeDefinitions.update(json, this._attributes);\n    };\n    /** @internal */\n    RowNode.getAttributeDefinitions = function () {\n        return RowNode._attributeDefinitions;\n    };\n    RowNode.TYPE = \"row\";\n    /** @internal */\n    RowNode._attributeDefinitions = RowNode._createAttributeDefinitions();\n    return RowNode;\n}(Node_1.Node));\nexports.RowNode = RowNode;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/RowNode.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"RowNode\": () => (/* binding */ RowNode)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DropInfo__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n/* harmony import */ var _SplitterNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./SplitterNode */ \"./src/model/SplitterNode.ts\");\n/* harmony import */ var _TabSetNode__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass RowNode extends _Node__WEBPACK_IMPORTED_MODULE_8__.Node {\r\n    /** @internal */\r\n    constructor(model, json) {\r\n        super(model);\r\n        this._dirty = true;\r\n        this._drawChildren = [];\r\n        this._minHeight = 0;\r\n        this._minWidth = 0;\r\n        RowNode._attributeDefinitions.fromJson(json, this._attributes);\r\n        model._addNode(this);\r\n    }\r\n    /** @internal */\r\n    static _fromJson(json, model) {\r\n        const newLayoutNode = new RowNode(model, json);\r\n        if (json.children != null) {\r\n            for (const jsonChild of json.children) {\r\n                if (jsonChild.type === _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode.TYPE) {\r\n                    const child = _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode._fromJson(jsonChild, model);\r\n                    newLayoutNode._addChild(child);\r\n                }\r\n                else {\r\n                    const child = RowNode._fromJson(jsonChild, model);\r\n                    newLayoutNode._addChild(child);\r\n                }\r\n            }\r\n        }\r\n        return newLayoutNode;\r\n    }\r\n    /** @internal */\r\n    static _createAttributeDefinitions() {\r\n        const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\r\n        attributeDefinitions.add(\"type\", RowNode.TYPE, true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setFixed();\r\n        attributeDefinitions.add(\"id\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"weight\", 100).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"width\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"height\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        return attributeDefinitions;\r\n    }\r\n    getWeight() {\r\n        return this._attributes.weight;\r\n    }\r\n    getWidth() {\r\n        return this._getAttr(\"width\");\r\n    }\r\n    getHeight() {\r\n        return this._getAttr(\"height\");\r\n    }\r\n    /** @internal */\r\n    _setWeight(weight) {\r\n        this._attributes.weight = weight;\r\n    }\r\n    /** @internal */\r\n    _layout(rect, metrics) {\r\n        super._layout(rect, metrics);\r\n        const pixelSize = this._rect._getSize(this.getOrientation());\r\n        let totalWeight = 0;\r\n        let fixedPixels = 0;\r\n        let prefPixels = 0;\r\n        let totalPrefWeight = 0;\r\n        const drawChildren = this._getDrawChildren();\r\n        for (const child of drawChildren) {\r\n            const prefSize = child._getPrefSize(this.getOrientation());\r\n            if (child._isFixed()) {\r\n                if (prefSize !== undefined) {\r\n                    fixedPixels += prefSize;\r\n                }\r\n            }\r\n            else {\r\n                if (prefSize === undefined) {\r\n                    totalWeight += child.getWeight();\r\n                }\r\n                else {\r\n                    prefPixels += prefSize;\r\n                    totalPrefWeight += child.getWeight();\r\n                }\r\n            }\r\n        }\r\n        let resizePreferred = false;\r\n        let availablePixels = pixelSize - fixedPixels - prefPixels;\r\n        if (availablePixels < 0) {\r\n            availablePixels = pixelSize - fixedPixels;\r\n            resizePreferred = true;\r\n            totalWeight += totalPrefWeight;\r\n        }\r\n        // assign actual pixel sizes\r\n        let totalSizeGiven = 0;\r\n        let variableSize = 0;\r\n        for (const child of drawChildren) {\r\n            const prefSize = child._getPrefSize(this.getOrientation());\r\n            if (child._isFixed()) {\r\n                if (prefSize !== undefined) {\r\n                    child._setTempSize(prefSize);\r\n                }\r\n            }\r\n            else {\r\n                if (prefSize == null || resizePreferred) {\r\n                    if (totalWeight === 0) {\r\n                        child._setTempSize(0);\r\n                    }\r\n                    else {\r\n                        const minSize = child.getMinSize(this.getOrientation());\r\n                        const size = Math.floor(availablePixels * (child.getWeight() / totalWeight));\r\n                        child._setTempSize(Math.max(minSize, size));\r\n                    }\r\n                    variableSize += child._getTempSize();\r\n                }\r\n                else {\r\n                    child._setTempSize(prefSize);\r\n                }\r\n            }\r\n            totalSizeGiven += child._getTempSize();\r\n        }\r\n        // adjust sizes to exactly fit\r\n        if (variableSize > 0) {\r\n            while (totalSizeGiven < pixelSize) {\r\n                for (const child of drawChildren) {\r\n                    if (!(child instanceof _SplitterNode__WEBPACK_IMPORTED_MODULE_9__.SplitterNode)) {\r\n                        const prefSize = child._getPrefSize(this.getOrientation());\r\n                        if (!child._isFixed() && (prefSize === undefined || resizePreferred) && totalSizeGiven < pixelSize) {\r\n                            child._setTempSize(child._getTempSize() + 1);\r\n                            totalSizeGiven++;\r\n                        }\r\n                    }\r\n                }\r\n            }\r\n            // decrease size using nodes not at there minimum\r\n            while (totalSizeGiven > pixelSize) {\r\n                let changed = false;\r\n                for (const child of drawChildren) {\r\n                    if (!(child instanceof _SplitterNode__WEBPACK_IMPORTED_MODULE_9__.SplitterNode)) {\r\n                        const minSize = child.getMinSize(this.getOrientation());\r\n                        const size = child._getTempSize();\r\n                        if (size > minSize && totalSizeGiven > pixelSize) {\r\n                            child._setTempSize(child._getTempSize() - 1);\r\n                            totalSizeGiven--;\r\n                            changed = true;\r\n                        }\r\n                    }\r\n                }\r\n                if (!changed) {\r\n                    // all children are at min values\r\n                    break;\r\n                }\r\n            }\r\n            // if still too big then simply reduce all nodes until fits\r\n            while (totalSizeGiven > pixelSize) {\r\n                let changed = false;\r\n                for (const child of drawChildren) {\r\n                    if (!(child instanceof _SplitterNode__WEBPACK_IMPORTED_MODULE_9__.SplitterNode)) {\r\n                        const size = child._getTempSize();\r\n                        if (size > 0 && totalSizeGiven > pixelSize) {\r\n                            child._setTempSize(child._getTempSize() - 1);\r\n                            totalSizeGiven--;\r\n                            changed = true;\r\n                        }\r\n                    }\r\n                }\r\n                if (!changed) {\r\n                    // all children are at 0 values\r\n                    break;\r\n                }\r\n            }\r\n        }\r\n        // layout children\r\n        let p = 0;\r\n        for (const child of drawChildren) {\r\n            if (this.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\r\n                child._layout(new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(this._rect.x + p, this._rect.y, child._getTempSize(), this._rect.height), metrics);\r\n            }\r\n            else {\r\n                child._layout(new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(this._rect.x, this._rect.y + p, this._rect.width, child._getTempSize()), metrics);\r\n            }\r\n            p += child._getTempSize();\r\n        }\r\n        return true;\r\n    }\r\n    /** @internal */\r\n    _getSplitterBounds(splitterNode, useMinSize = false) {\r\n        const pBounds = [0, 0];\r\n        const drawChildren = this._getDrawChildren();\r\n        const p = drawChildren.indexOf(splitterNode);\r\n        const node1 = drawChildren[p - 1];\r\n        const node2 = drawChildren[p + 1];\r\n        if (this.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\r\n            const minSize1 = useMinSize ? node1.getMinWidth() : 0;\r\n            const minSize2 = useMinSize ? node2.getMinWidth() : 0;\r\n            pBounds[0] = node1.getRect().x + minSize1;\r\n            pBounds[1] = node2.getRect().getRight() - splitterNode.getWidth() - minSize2;\r\n        }\r\n        else {\r\n            const minSize1 = useMinSize ? node1.getMinHeight() : 0;\r\n            const minSize2 = useMinSize ? node2.getMinHeight() : 0;\r\n            pBounds[0] = node1.getRect().y + minSize1;\r\n            pBounds[1] = node2.getRect().getBottom() - splitterNode.getHeight() - minSize2;\r\n        }\r\n        return pBounds;\r\n    }\r\n    /** @internal */\r\n    _calculateSplit(splitter, splitterPos) {\r\n        let rtn;\r\n        const drawChildren = this._getDrawChildren();\r\n        const p = drawChildren.indexOf(splitter);\r\n        const pBounds = this._getSplitterBounds(splitter);\r\n        const weightedLength = drawChildren[p - 1].getWeight() + drawChildren[p + 1].getWeight();\r\n        const pixelWidth1 = Math.max(0, splitterPos - pBounds[0]);\r\n        const pixelWidth2 = Math.max(0, pBounds[1] - splitterPos);\r\n        if (pixelWidth1 + pixelWidth2 > 0) {\r\n            const weight1 = (pixelWidth1 * weightedLength) / (pixelWidth1 + pixelWidth2);\r\n            const weight2 = (pixelWidth2 * weightedLength) / (pixelWidth1 + pixelWidth2);\r\n            rtn = {\r\n                node1Id: drawChildren[p - 1].getId(),\r\n                weight1,\r\n                pixelWidth1,\r\n                node2Id: drawChildren[p + 1].getId(),\r\n                weight2,\r\n                pixelWidth2,\r\n            };\r\n        }\r\n        return rtn;\r\n    }\r\n    /** @internal */\r\n    _getDrawChildren() {\r\n        if (this._dirty) {\r\n            this._drawChildren = [];\r\n            for (let i = 0; i < this._children.length; i++) {\r\n                const child = this._children[i];\r\n                if (i !== 0) {\r\n                    const newSplitter = new _SplitterNode__WEBPACK_IMPORTED_MODULE_9__.SplitterNode(this._model);\r\n                    newSplitter._setParent(this);\r\n                    this._drawChildren.push(newSplitter);\r\n                }\r\n                this._drawChildren.push(child);\r\n            }\r\n            this._dirty = false;\r\n        }\r\n        return this._drawChildren;\r\n    }\r\n    /** @internal */\r\n    getMinSize(orientation) {\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\r\n            return this.getMinWidth();\r\n        }\r\n        else {\r\n            return this.getMinHeight();\r\n        }\r\n    }\r\n    /** @internal */\r\n    getMinWidth() {\r\n        return this._minWidth;\r\n    }\r\n    /** @internal */\r\n    getMinHeight() {\r\n        return this._minHeight;\r\n    }\r\n    /** @internal */\r\n    calcMinSize() {\r\n        this._minHeight = 0;\r\n        this._minWidth = 0;\r\n        let first = true;\r\n        for (const child of this._children) {\r\n            const c = child;\r\n            if (c instanceof RowNode) {\r\n                c.calcMinSize();\r\n            }\r\n            if (this.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\r\n                this._minHeight += c.getMinHeight();\r\n                if (!first) {\r\n                    this._minHeight += this._model.getSplitterSize();\r\n                }\r\n                this._minWidth = Math.max(this._minWidth, c.getMinWidth());\r\n            }\r\n            else {\r\n                this._minWidth += c.getMinWidth();\r\n                if (!first) {\r\n                    this._minWidth += this._model.getSplitterSize();\r\n                }\r\n                this._minHeight = Math.max(this._minHeight, c.getMinHeight());\r\n            }\r\n            first = false;\r\n        }\r\n    }\r\n    /** @internal */\r\n    _tidy() {\r\n        let i = 0;\r\n        while (i < this._children.length) {\r\n            const child = this._children[i];\r\n            if (child instanceof RowNode) {\r\n                child._tidy();\r\n                const childChildren = child.getChildren();\r\n                if (childChildren.length === 0) {\r\n                    this._removeChild(child);\r\n                }\r\n                else if (childChildren.length === 1) {\r\n                    // hoist child/children up to this level\r\n                    const subchild = childChildren[0];\r\n                    this._removeChild(child);\r\n                    if (subchild instanceof RowNode) {\r\n                        let subChildrenTotal = 0;\r\n                        const subChildChildren = subchild.getChildren();\r\n                        for (const ssc of subChildChildren) {\r\n                            const subsubChild = ssc;\r\n                            subChildrenTotal += subsubChild.getWeight();\r\n                        }\r\n                        for (let j = 0; j < subChildChildren.length; j++) {\r\n                            const subsubChild = subChildChildren[j];\r\n                            subsubChild._setWeight((child.getWeight() * subsubChild.getWeight()) / subChildrenTotal);\r\n                            this._addChild(subsubChild, i + j);\r\n                        }\r\n                    }\r\n                    else {\r\n                        subchild._setWeight(child.getWeight());\r\n                        this._addChild(subchild, i);\r\n                    }\r\n                }\r\n                else {\r\n                    i++;\r\n                }\r\n            }\r\n            else if (child instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode && child.getChildren().length === 0) {\r\n                if (child.isEnableDeleteWhenEmpty()) {\r\n                    this._removeChild(child);\r\n                    if (child === this._model.getMaximizedTabset()) {\r\n                        this._model._setMaximizedTabset(undefined);\r\n                    }\r\n                }\r\n                else {\r\n                    i++;\r\n                }\r\n            }\r\n            else {\r\n                i++;\r\n            }\r\n        }\r\n        // add tabset into empty root\r\n        if (this === this._model.getRoot() && this._children.length === 0) {\r\n            const callback = this._model._getOnCreateTabSet();\r\n            let attrs = callback ? callback() : {};\r\n            attrs = Object.assign(Object.assign({}, attrs), { selected: -1 });\r\n            const child = new _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode(this._model, attrs);\r\n            this._model._setActiveTabset(child);\r\n            this._addChild(child);\r\n        }\r\n    }\r\n    /** @internal */\r\n    canDrop(dragNode, x, y) {\r\n        const yy = y - this._rect.y;\r\n        const xx = x - this._rect.x;\r\n        const w = this._rect.width;\r\n        const h = this._rect.height;\r\n        const margin = 10; // height of edge rect\r\n        const half = 50; // half width of edge rect\r\n        let dropInfo;\r\n        if (this._model.isEnableEdgeDock() && this._parent === undefined) {\r\n            // _root row\r\n            if (x < this._rect.x + margin && yy > h / 2 - half && yy < h / 2 + half) {\r\n                const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT;\r\n                const outlineRect = dockLocation.getDockRect(this._rect);\r\n                outlineRect.width = outlineRect.width / 2;\r\n                dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT_EDGE);\r\n            }\r\n            else if (x > this._rect.getRight() - margin && yy > h / 2 - half && yy < h / 2 + half) {\r\n                const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT;\r\n                const outlineRect = dockLocation.getDockRect(this._rect);\r\n                outlineRect.width = outlineRect.width / 2;\r\n                outlineRect.x += outlineRect.width;\r\n                dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT_EDGE);\r\n            }\r\n            else if (y < this._rect.y + margin && xx > w / 2 - half && xx < w / 2 + half) {\r\n                const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP;\r\n                const outlineRect = dockLocation.getDockRect(this._rect);\r\n                outlineRect.height = outlineRect.height / 2;\r\n                dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT_EDGE);\r\n            }\r\n            else if (y > this._rect.getBottom() - margin && xx > w / 2 - half && xx < w / 2 + half) {\r\n                const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM;\r\n                const outlineRect = dockLocation.getDockRect(this._rect);\r\n                outlineRect.height = outlineRect.height / 2;\r\n                outlineRect.y += outlineRect.height;\r\n                dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT_EDGE);\r\n            }\r\n            if (dropInfo !== undefined) {\r\n                if (!dragNode._canDockInto(dragNode, dropInfo)) {\r\n                    return undefined;\r\n                }\r\n            }\r\n        }\r\n        return dropInfo;\r\n    }\r\n    /** @internal */\r\n    drop(dragNode, location, index) {\r\n        const dockLocation = location;\r\n        const parent = dragNode.getParent();\r\n        if (parent) {\r\n            parent._removeChild(dragNode);\r\n        }\r\n        if (parent !== undefined && parent.getType() === _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode.TYPE) {\r\n            parent._setSelected(0);\r\n        }\r\n        if (parent !== undefined && parent.getType() === _BorderNode__WEBPACK_IMPORTED_MODULE_7__.BorderNode.TYPE) {\r\n            parent._setSelected(-1);\r\n        }\r\n        let tabSet;\r\n        if (dragNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n            tabSet = dragNode;\r\n        }\r\n        else {\r\n            const callback = this._model._getOnCreateTabSet();\r\n            tabSet = new _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode(this._model, callback ? callback(dragNode) : {});\r\n            tabSet._addChild(dragNode);\r\n        }\r\n        let size = this._children.reduce((sum, child) => {\r\n            return sum + child.getWeight();\r\n        }, 0);\r\n        if (size === 0) {\r\n            size = 100;\r\n        }\r\n        tabSet._setWeight(size / 3);\r\n        const horz = !this._model.isRootOrientationVertical();\r\n        if (horz && dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT || !horz && dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP) {\r\n            this._addChild(tabSet, 0);\r\n        }\r\n        else if (horz && dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT || !horz && dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM) {\r\n            this._addChild(tabSet);\r\n        }\r\n        else if (horz && dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP || !horz && dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT) {\r\n            const vrow = new RowNode(this._model, {});\r\n            const hrow = new RowNode(this._model, {});\r\n            hrow._setWeight(75);\r\n            tabSet._setWeight(25);\r\n            for (const child of this._children) {\r\n                hrow._addChild(child);\r\n            }\r\n            this._removeAll();\r\n            vrow._addChild(tabSet);\r\n            vrow._addChild(hrow);\r\n            this._addChild(vrow);\r\n        }\r\n        else if (horz && dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM || !horz && dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT) {\r\n            const vrow = new RowNode(this._model, {});\r\n            const hrow = new RowNode(this._model, {});\r\n            hrow._setWeight(75);\r\n            tabSet._setWeight(25);\r\n            for (const child of this._children) {\r\n                hrow._addChild(child);\r\n            }\r\n            this._removeAll();\r\n            vrow._addChild(hrow);\r\n            vrow._addChild(tabSet);\r\n            this._addChild(vrow);\r\n        }\r\n        this._model._setActiveTabset(tabSet);\r\n        this._model._tidy();\r\n    }\r\n    toJson() {\r\n        const json = {};\r\n        RowNode._attributeDefinitions.toJson(json, this._attributes);\r\n        json.children = [];\r\n        for (const child of this._children) {\r\n            json.children.push(child.toJson());\r\n        }\r\n        return json;\r\n    }\r\n    isEnableDrop() {\r\n        return true;\r\n    }\r\n    /** @internal */\r\n    _getPrefSize(orientation) {\r\n        let prefSize = this.getWidth();\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\r\n            prefSize = this.getHeight();\r\n        }\r\n        return prefSize;\r\n    }\r\n    /** @internal */\r\n    _getAttributeDefinitions() {\r\n        return RowNode._attributeDefinitions;\r\n    }\r\n    /** @internal */\r\n    _updateAttrs(json) {\r\n        RowNode._attributeDefinitions.update(json, this._attributes);\r\n    }\r\n    /** @internal */\r\n    static getAttributeDefinitions() {\r\n        return RowNode._attributeDefinitions;\r\n    }\r\n}\r\nRowNode.TYPE = \"row\";\r\n/** @internal */\r\nRowNode._attributeDefinitions = RowNode._createAttributeDefinitions();\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/RowNode.ts?");
 
 /***/ }),
 
@@ -394,9 +294,9 @@ eval("\nvar __extends = (this && this.__extends) || (function () {\n    var exte
 /*!***********************************!*\
   !*** ./src/model/SplitterNode.ts ***!
   \***********************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        if (typeof b !== \"function\" && b !== null)\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.SplitterNode = void 0;\nvar AttributeDefinitions_1 = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Node_1 = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\nvar SplitterNode = /** @class */ (function (_super) {\n    __extends(SplitterNode, _super);\n    /** @internal */\n    function SplitterNode(model) {\n        var _this = _super.call(this, model) || this;\n        _this._fixed = true;\n        _this._attributes.type = SplitterNode.TYPE;\n        model._addNode(_this);\n        return _this;\n    }\n    /** @internal */\n    SplitterNode.prototype.getWidth = function () {\n        return this._model.getSplitterSize();\n    };\n    /** @internal */\n    SplitterNode.prototype.getMinWidth = function () {\n        if (this.getOrientation() === Orientation_1.Orientation.VERT) {\n            return this._model.getSplitterSize();\n        }\n        else {\n            return 0;\n        }\n    };\n    /** @internal */\n    SplitterNode.prototype.getHeight = function () {\n        return this._model.getSplitterSize();\n    };\n    /** @internal */\n    SplitterNode.prototype.getMinHeight = function () {\n        if (this.getOrientation() === Orientation_1.Orientation.HORZ) {\n            return this._model.getSplitterSize();\n        }\n        else {\n            return 0;\n        }\n    };\n    /** @internal */\n    SplitterNode.prototype.getMinSize = function (orientation) {\n        if (orientation === Orientation_1.Orientation.HORZ) {\n            return this.getMinWidth();\n        }\n        else {\n            return this.getMinHeight();\n        }\n    };\n    /** @internal */\n    SplitterNode.prototype.getWeight = function () {\n        return 0;\n    };\n    /** @internal */\n    SplitterNode.prototype._setWeight = function (value) { };\n    /** @internal */\n    SplitterNode.prototype._getPrefSize = function (orientation) {\n        return this._model.getSplitterSize();\n    };\n    /** @internal */\n    SplitterNode.prototype._updateAttrs = function (json) { };\n    /** @internal */\n    SplitterNode.prototype._getAttributeDefinitions = function () {\n        return new AttributeDefinitions_1.AttributeDefinitions();\n    };\n    SplitterNode.prototype.toJson = function () {\n        return undefined;\n    };\n    SplitterNode.TYPE = \"splitter\";\n    return SplitterNode;\n}(Node_1.Node));\nexports.SplitterNode = SplitterNode;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/SplitterNode.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"SplitterNode\": () => (/* binding */ SplitterNode)\n/* harmony export */ });\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n\r\n\r\n\r\nclass SplitterNode extends _Node__WEBPACK_IMPORTED_MODULE_2__.Node {\r\n    /** @internal */\r\n    constructor(model) {\r\n        super(model);\r\n        this._fixed = true;\r\n        this._attributes.type = SplitterNode.TYPE;\r\n        model._addNode(this);\r\n    }\r\n    /** @internal */\r\n    getWidth() {\r\n        return this._model.getSplitterSize();\r\n    }\r\n    /** @internal */\r\n    getMinWidth() {\r\n        if (this.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.VERT) {\r\n            return this._model.getSplitterSize();\r\n        }\r\n        else {\r\n            return 0;\r\n        }\r\n    }\r\n    /** @internal */\r\n    getHeight() {\r\n        return this._model.getSplitterSize();\r\n    }\r\n    /** @internal */\r\n    getMinHeight() {\r\n        if (this.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ) {\r\n            return this._model.getSplitterSize();\r\n        }\r\n        else {\r\n            return 0;\r\n        }\r\n    }\r\n    /** @internal */\r\n    getMinSize(orientation) {\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ) {\r\n            return this.getMinWidth();\r\n        }\r\n        else {\r\n            return this.getMinHeight();\r\n        }\r\n    }\r\n    /** @internal */\r\n    getWeight() {\r\n        return 0;\r\n    }\r\n    /** @internal */\r\n    _setWeight(value) { }\r\n    /** @internal */\r\n    _getPrefSize(orientation) {\r\n        return this._model.getSplitterSize();\r\n    }\r\n    /** @internal */\r\n    _updateAttrs(json) { }\r\n    /** @internal */\r\n    _getAttributeDefinitions() {\r\n        return new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_0__.AttributeDefinitions();\r\n    }\r\n    toJson() {\r\n        return undefined;\r\n    }\r\n}\r\nSplitterNode.TYPE = \"splitter\";\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/SplitterNode.ts?");
 
 /***/ }),
 
@@ -404,9 +304,9 @@ eval("\nvar __extends = (this && this.__extends) || (function () {\n    var exte
 /*!******************************!*\
   !*** ./src/model/TabNode.ts ***!
   \******************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        if (typeof b !== \"function\" && b !== null)\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.TabNode = void 0;\nvar Attribute_1 = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\nvar AttributeDefinitions_1 = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\nvar Node_1 = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\nvar TabNode = /** @class */ (function (_super) {\n    __extends(TabNode, _super);\n    /** @internal */\n    function TabNode(model, json, addToModel) {\n        if (addToModel === void 0) { addToModel = true; }\n        var _this = _super.call(this, model) || this;\n        _this._extra = {}; // extra data added to node not saved in json\n        TabNode._attributeDefinitions.fromJson(json, _this._attributes);\n        if (addToModel === true) {\n            model._addNode(_this);\n        }\n        return _this;\n    }\n    /** @internal */\n    TabNode._fromJson = function (json, model, addToModel) {\n        if (addToModel === void 0) { addToModel = true; }\n        var newLayoutNode = new TabNode(model, json, addToModel);\n        return newLayoutNode;\n    };\n    /** @internal */\n    TabNode._createAttributeDefinitions = function () {\n        var attributeDefinitions = new AttributeDefinitions_1.AttributeDefinitions();\n        attributeDefinitions.add(\"type\", TabNode.TYPE, true).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"id\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"name\", \"[Unnamed Tab]\").setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"altName\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"helpText\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"component\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"config\", undefined).setType(\"any\");\n        attributeDefinitions.add(\"floating\", false).setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"enableClose\", \"tabEnableClose\").setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"closeType\", \"tabCloseType\").setType(\"ICloseType\");\n        attributeDefinitions.addInherited(\"enableDrag\", \"tabEnableDrag\").setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"enableRename\", \"tabEnableRename\").setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"className\", \"tabClassName\").setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.addInherited(\"icon\", \"tabIcon\").setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.addInherited(\"enableRenderOnDemand\", \"tabEnableRenderOnDemand\").setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"enableFloat\", \"tabEnableFloat\").setType(Attribute_1.Attribute.BOOLEAN);\n        attributeDefinitions.addInherited(\"borderWidth\", \"tabBorderWidth\").setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.addInherited(\"borderHeight\", \"tabBorderHeight\").setType(Attribute_1.Attribute.NUMBER);\n        return attributeDefinitions;\n    };\n    TabNode.prototype.getWindow = function () {\n        return this._window;\n    };\n    TabNode.prototype.getTabRect = function () {\n        return this._tabRect;\n    };\n    /** @internal */\n    TabNode.prototype._setTabRect = function (rect) {\n        this._tabRect = rect;\n    };\n    /** @internal */\n    TabNode.prototype._setRenderedName = function (name) {\n        this._renderedName = name;\n    };\n    /** @internal */\n    TabNode.prototype._getNameForOverflowMenu = function () {\n        var altName = this._getAttr(\"altName\");\n        if (altName !== undefined) {\n            return altName;\n        }\n        return this._renderedName;\n    };\n    TabNode.prototype.getName = function () {\n        return this._getAttr(\"name\");\n    };\n    TabNode.prototype.getHelpText = function () {\n        return this._getAttr(\"helpText\");\n    };\n    TabNode.prototype.getComponent = function () {\n        return this._getAttr(\"component\");\n    };\n    /**\n     * Returns the config attribute that can be used to store node specific data that\n     * WILL be saved to the json. The config attribute should be changed via the action Actions.updateNodeAttributes rather\n     * than directly, for example:\n     * this.state.model.doAction(\n     *   FlexLayout.Actions.updateNodeAttributes(node.getId(), {config:myConfigObject}));\n     */\n    TabNode.prototype.getConfig = function () {\n        return this._attributes.config;\n    };\n    /**\n     * Returns an object that can be used to store transient node specific data that will\n     * NOT be saved in the json.\n     */\n    TabNode.prototype.getExtraData = function () {\n        return this._extra;\n    };\n    TabNode.prototype.isFloating = function () {\n        return this._getAttr(\"floating\");\n    };\n    TabNode.prototype.getIcon = function () {\n        return this._getAttr(\"icon\");\n    };\n    TabNode.prototype.isEnableClose = function () {\n        return this._getAttr(\"enableClose\");\n    };\n    TabNode.prototype.getCloseType = function () {\n        return this._getAttr(\"closeType\");\n    };\n    TabNode.prototype.isEnableFloat = function () {\n        return this._getAttr(\"enableFloat\");\n    };\n    TabNode.prototype.isEnableDrag = function () {\n        return this._getAttr(\"enableDrag\");\n    };\n    TabNode.prototype.isEnableRename = function () {\n        return this._getAttr(\"enableRename\");\n    };\n    TabNode.prototype.getClassName = function () {\n        return this._getAttr(\"className\");\n    };\n    TabNode.prototype.isEnableRenderOnDemand = function () {\n        return this._getAttr(\"enableRenderOnDemand\");\n    };\n    /** @internal */\n    TabNode.prototype._setName = function (name) {\n        this._attributes.name = name;\n        if (this._window && this._window.document) {\n            this._window.document.title = name;\n        }\n    };\n    /** @internal */\n    TabNode.prototype._setFloating = function (float) {\n        this._attributes.floating = float;\n    };\n    /** @internal */\n    TabNode.prototype._layout = function (rect, metrics) {\n        if (!rect.equals(this._rect)) {\n            this._fireEvent(\"resize\", { rect: rect });\n        }\n        this._rect = rect;\n    };\n    /** @internal */\n    TabNode.prototype._delete = function () {\n        this._parent._remove(this);\n        this._fireEvent(\"close\", {});\n    };\n    TabNode.prototype.toJson = function () {\n        var json = {};\n        TabNode._attributeDefinitions.toJson(json, this._attributes);\n        return json;\n    };\n    /** @internal */\n    TabNode.prototype._updateAttrs = function (json) {\n        TabNode._attributeDefinitions.update(json, this._attributes);\n    };\n    /** @internal */\n    TabNode.prototype._getAttributeDefinitions = function () {\n        return TabNode._attributeDefinitions;\n    };\n    /** @internal */\n    TabNode.prototype._setWindow = function (window) {\n        this._window = window;\n    };\n    /** @internal */\n    TabNode.prototype._setBorderWidth = function (width) {\n        this._attributes.borderWidth = width;\n    };\n    /** @internal */\n    TabNode.prototype._setBorderHeight = function (height) {\n        this._attributes.borderHeight = height;\n    };\n    /** @internal */\n    TabNode.getAttributeDefinitions = function () {\n        return TabNode._attributeDefinitions;\n    };\n    TabNode.TYPE = \"tab\";\n    /** @internal */\n    TabNode._attributeDefinitions = TabNode._createAttributeDefinitions();\n    return TabNode;\n}(Node_1.Node));\nexports.TabNode = TabNode;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/TabNode.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TabNode\": () => (/* binding */ TabNode)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n\r\n\r\n\r\nclass TabNode extends _Node__WEBPACK_IMPORTED_MODULE_2__.Node {\r\n    /** @internal */\r\n    constructor(model, json, addToModel = true) {\r\n        super(model);\r\n        this._extra = {}; // extra data added to node not saved in json\r\n        TabNode._attributeDefinitions.fromJson(json, this._attributes);\r\n        if (addToModel === true) {\r\n            model._addNode(this);\r\n        }\r\n    }\r\n    /** @internal */\r\n    static _fromJson(json, model, addToModel = true) {\r\n        const newLayoutNode = new TabNode(model, json, addToModel);\r\n        return newLayoutNode;\r\n    }\r\n    /** @internal */\r\n    static _createAttributeDefinitions() {\r\n        const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\r\n        attributeDefinitions.add(\"type\", TabNode.TYPE, true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"id\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"name\", \"[Unnamed Tab]\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"altName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"helpText\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"component\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"config\", undefined).setType(\"any\");\r\n        attributeDefinitions.add(\"floating\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"enableClose\", \"tabEnableClose\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"closeType\", \"tabCloseType\").setType(\"ICloseType\");\r\n        attributeDefinitions.addInherited(\"enableDrag\", \"tabEnableDrag\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"enableRename\", \"tabEnableRename\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"className\", \"tabClassName\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.addInherited(\"icon\", \"tabIcon\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.addInherited(\"enableRenderOnDemand\", \"tabEnableRenderOnDemand\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"enableFloat\", \"tabEnableFloat\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        attributeDefinitions.addInherited(\"borderWidth\", \"tabBorderWidth\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.addInherited(\"borderHeight\", \"tabBorderHeight\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        return attributeDefinitions;\r\n    }\r\n    getWindow() {\r\n        return this._window;\r\n    }\r\n    getTabRect() {\r\n        return this._tabRect;\r\n    }\r\n    /** @internal */\r\n    _setTabRect(rect) {\r\n        this._tabRect = rect;\r\n    }\r\n    /** @internal */\r\n    _setRenderedName(name) {\r\n        this._renderedName = name;\r\n    }\r\n    /** @internal */\r\n    _getNameForOverflowMenu() {\r\n        const altName = this._getAttr(\"altName\");\r\n        if (altName !== undefined) {\r\n            return altName;\r\n        }\r\n        return this._renderedName;\r\n    }\r\n    getName() {\r\n        return this._getAttr(\"name\");\r\n    }\r\n    getHelpText() {\r\n        return this._getAttr(\"helpText\");\r\n    }\r\n    getComponent() {\r\n        return this._getAttr(\"component\");\r\n    }\r\n    /**\r\n     * Returns the config attribute that can be used to store node specific data that\r\n     * WILL be saved to the json. The config attribute should be changed via the action Actions.updateNodeAttributes rather\r\n     * than directly, for example:\r\n     * this.state.model.doAction(\r\n     *   FlexLayout.Actions.updateNodeAttributes(node.getId(), {config:myConfigObject}));\r\n     */\r\n    getConfig() {\r\n        return this._attributes.config;\r\n    }\r\n    /**\r\n     * Returns an object that can be used to store transient node specific data that will\r\n     * NOT be saved in the json.\r\n     */\r\n    getExtraData() {\r\n        return this._extra;\r\n    }\r\n    isFloating() {\r\n        return this._getAttr(\"floating\");\r\n    }\r\n    getIcon() {\r\n        return this._getAttr(\"icon\");\r\n    }\r\n    isEnableClose() {\r\n        return this._getAttr(\"enableClose\");\r\n    }\r\n    getCloseType() {\r\n        return this._getAttr(\"closeType\");\r\n    }\r\n    isEnableFloat() {\r\n        return this._getAttr(\"enableFloat\");\r\n    }\r\n    isEnableDrag() {\r\n        return this._getAttr(\"enableDrag\");\r\n    }\r\n    isEnableRename() {\r\n        return this._getAttr(\"enableRename\");\r\n    }\r\n    getClassName() {\r\n        return this._getAttr(\"className\");\r\n    }\r\n    isEnableRenderOnDemand() {\r\n        return this._getAttr(\"enableRenderOnDemand\");\r\n    }\r\n    /** @internal */\r\n    _setName(name) {\r\n        this._attributes.name = name;\r\n        if (this._window && this._window.document) {\r\n            this._window.document.title = name;\r\n        }\r\n    }\r\n    /** @internal */\r\n    _setFloating(float) {\r\n        this._attributes.floating = float;\r\n    }\r\n    /** @internal */\r\n    _layout(rect, metrics) {\r\n        if (!rect.equals(this._rect)) {\r\n            this._fireEvent(\"resize\", { rect });\r\n        }\r\n        this._rect = rect;\r\n    }\r\n    /** @internal */\r\n    _delete() {\r\n        this._parent._remove(this);\r\n        this._fireEvent(\"close\", {});\r\n    }\r\n    toJson() {\r\n        const json = {};\r\n        TabNode._attributeDefinitions.toJson(json, this._attributes);\r\n        return json;\r\n    }\r\n    /** @internal */\r\n    _updateAttrs(json) {\r\n        TabNode._attributeDefinitions.update(json, this._attributes);\r\n    }\r\n    /** @internal */\r\n    _getAttributeDefinitions() {\r\n        return TabNode._attributeDefinitions;\r\n    }\r\n    /** @internal */\r\n    _setWindow(window) {\r\n        this._window = window;\r\n    }\r\n    /** @internal */\r\n    _setBorderWidth(width) {\r\n        this._attributes.borderWidth = width;\r\n    }\r\n    /** @internal */\r\n    _setBorderHeight(height) {\r\n        this._attributes.borderHeight = height;\r\n    }\r\n    /** @internal */\r\n    static getAttributeDefinitions() {\r\n        return TabNode._attributeDefinitions;\r\n    }\r\n}\r\nTabNode.TYPE = \"tab\";\r\n/** @internal */\r\nTabNode._attributeDefinitions = TabNode._createAttributeDefinitions();\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/TabNode.ts?");
 
 /***/ }),
 
@@ -414,9 +314,9 @@ eval("\nvar __extends = (this && this.__extends) || (function () {\n    var exte
 /*!*********************************!*\
   !*** ./src/model/TabSetNode.ts ***!
   \*********************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        if (typeof b !== \"function\" && b !== null)\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.TabSetNode = void 0;\nvar Attribute_1 = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\nvar AttributeDefinitions_1 = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\nvar DockLocation_1 = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\nvar DropInfo_1 = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar BorderNode_1 = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\nvar Node_1 = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\nvar RowNode_1 = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\nvar TabNode_1 = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\nvar TabSetNode = /** @class */ (function (_super) {\n    __extends(TabSetNode, _super);\n    /** @internal */\n    function TabSetNode(model, json) {\n        var _this = _super.call(this, model) || this;\n        TabSetNode._attributeDefinitions.fromJson(json, _this._attributes);\n        model._addNode(_this);\n        _this._calculatedTabBarHeight = 0;\n        _this._calculatedHeaderBarHeight = 0;\n        return _this;\n    }\n    /** @internal */\n    TabSetNode._fromJson = function (json, model) {\n        var newLayoutNode = new TabSetNode(model, json);\n        if (json.children != null) {\n            for (var _i = 0, _a = json.children; _i < _a.length; _i++) {\n                var jsonChild = _a[_i];\n                var child = TabNode_1.TabNode._fromJson(jsonChild, model);\n                newLayoutNode._addChild(child);\n            }\n        }\n        if (newLayoutNode._children.length === 0) {\n            newLayoutNode._setSelected(-1);\n        }\n        if (json.maximized && json.maximized === true) {\n            model._setMaximizedTabset(newLayoutNode);\n        }\n        if (json.active && json.active === true) {\n            model._setActiveTabset(newLayoutNode);\n        }\n        return newLayoutNode;\n    };\n    /** @internal */\n    TabSetNode._createAttributeDefinitions = function () {\n        var attributeDefinitions = new AttributeDefinitions_1.AttributeDefinitions();\n        attributeDefinitions.add(\"type\", TabSetNode.TYPE, true).setType(Attribute_1.Attribute.STRING).setFixed();\n        attributeDefinitions.add(\"id\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"weight\", 100).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"width\", undefined).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"height\", undefined).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"selected\", 0).setType(Attribute_1.Attribute.NUMBER);\n        attributeDefinitions.add(\"name\", undefined).setType(Attribute_1.Attribute.STRING);\n        attributeDefinitions.add(\"config\", undefined).setType(\"any\");\n        attributeDefinitions.addInherited(\"enableDeleteWhenEmpty\", \"tabSetEnableDeleteWhenEmpty\");\n        attributeDefinitions.addInherited(\"enableDrop\", \"tabSetEnableDrop\");\n        attributeDefinitions.addInherited(\"enableDrag\", \"tabSetEnableDrag\");\n        attributeDefinitions.addInherited(\"enableDivide\", \"tabSetEnableDivide\");\n        attributeDefinitions.addInherited(\"enableMaximize\", \"tabSetEnableMaximize\");\n        attributeDefinitions.addInherited(\"enableClose\", \"tabSetEnableClose\");\n        attributeDefinitions.addInherited(\"classNameTabStrip\", \"tabSetClassNameTabStrip\");\n        attributeDefinitions.addInherited(\"classNameHeader\", \"tabSetClassNameHeader\");\n        attributeDefinitions.addInherited(\"enableTabStrip\", \"tabSetEnableTabStrip\");\n        attributeDefinitions.addInherited(\"borderInsets\", \"tabSetBorderInsets\");\n        attributeDefinitions.addInherited(\"marginInsets\", \"tabSetMarginInsets\");\n        attributeDefinitions.addInherited(\"minWidth\", \"tabSetMinWidth\");\n        attributeDefinitions.addInherited(\"minHeight\", \"tabSetMinHeight\");\n        attributeDefinitions.addInherited(\"headerHeight\", \"tabSetHeaderHeight\");\n        attributeDefinitions.addInherited(\"tabStripHeight\", \"tabSetTabStripHeight\");\n        attributeDefinitions.addInherited(\"tabLocation\", \"tabSetTabLocation\");\n        attributeDefinitions.addInherited(\"autoSelectTab\", \"tabSetAutoSelectTab\").setType(Attribute_1.Attribute.BOOLEAN);\n        return attributeDefinitions;\n    };\n    TabSetNode.prototype.getName = function () {\n        return this._getAttr(\"name\");\n    };\n    TabSetNode.prototype.getSelected = function () {\n        var selected = this._attributes.selected;\n        if (selected !== undefined) {\n            return selected;\n        }\n        return -1;\n    };\n    TabSetNode.prototype.getSelectedNode = function () {\n        var selected = this.getSelected();\n        if (selected !== -1) {\n            return this._children[selected];\n        }\n        return undefined;\n    };\n    TabSetNode.prototype.getWeight = function () {\n        return this._getAttr(\"weight\");\n    };\n    TabSetNode.prototype.getWidth = function () {\n        return this._getAttr(\"width\");\n    };\n    TabSetNode.prototype.getMinWidth = function () {\n        return this._getAttr(\"minWidth\");\n    };\n    TabSetNode.prototype.getHeight = function () {\n        return this._getAttr(\"height\");\n    };\n    TabSetNode.prototype.getMinHeight = function () {\n        return this._getAttr(\"minHeight\");\n    };\n    /** @internal */\n    TabSetNode.prototype.getMinSize = function (orientation) {\n        if (orientation === Orientation_1.Orientation.HORZ) {\n            return this.getMinWidth();\n        }\n        else {\n            return this.getMinHeight();\n        }\n    };\n    /**\n     * Returns the config attribute that can be used to store node specific data that\n     * WILL be saved to the json. The config attribute should be changed via the action Actions.updateNodeAttributes rather\n     * than directly, for example:\n     * this.state.model.doAction(\n     *   FlexLayout.Actions.updateNodeAttributes(node.getId(), {config:myConfigObject}));\n     */\n    TabSetNode.prototype.getConfig = function () {\n        return this._attributes.config;\n    };\n    TabSetNode.prototype.isMaximized = function () {\n        return this._model.getMaximizedTabset() === this;\n    };\n    TabSetNode.prototype.isActive = function () {\n        return this._model.getActiveTabset() === this;\n    };\n    TabSetNode.prototype.isEnableDeleteWhenEmpty = function () {\n        return this._getAttr(\"enableDeleteWhenEmpty\");\n    };\n    TabSetNode.prototype.isEnableDrop = function () {\n        return this._getAttr(\"enableDrop\");\n    };\n    TabSetNode.prototype.isEnableDrag = function () {\n        return this._getAttr(\"enableDrag\");\n    };\n    TabSetNode.prototype.isEnableDivide = function () {\n        return this._getAttr(\"enableDivide\");\n    };\n    TabSetNode.prototype.isEnableMaximize = function () {\n        return this._getAttr(\"enableMaximize\");\n    };\n    TabSetNode.prototype.isEnableClose = function () {\n        return this._getAttr(\"enableClose\");\n    };\n    TabSetNode.prototype.canMaximize = function () {\n        if (this.isEnableMaximize()) {\n            // always allow maximize toggle if already maximized\n            if (this.getModel().getMaximizedTabset() === this) {\n                return true;\n            }\n            // only one tabset, so disable\n            if (this.getParent() === this.getModel().getRoot() && this.getModel().getRoot().getChildren().length === 1) {\n                return false;\n            }\n            return true;\n        }\n        return false;\n    };\n    TabSetNode.prototype.isEnableTabStrip = function () {\n        return this._getAttr(\"enableTabStrip\");\n    };\n    TabSetNode.prototype.isAutoSelectTab = function () {\n        return this._getAttr(\"autoSelectTab\");\n    };\n    TabSetNode.prototype.getClassNameTabStrip = function () {\n        return this._getAttr(\"classNameTabStrip\");\n    };\n    TabSetNode.prototype.getClassNameHeader = function () {\n        return this._getAttr(\"classNameHeader\");\n    };\n    /** @internal */\n    TabSetNode.prototype.calculateHeaderBarHeight = function (metrics) {\n        var headerBarHeight = this._getAttr(\"headerHeight\");\n        if (headerBarHeight !== 0) {\n            // its defined\n            this._calculatedHeaderBarHeight = headerBarHeight;\n        }\n        else {\n            this._calculatedHeaderBarHeight = metrics.headerBarSize;\n        }\n    };\n    /** @internal */\n    TabSetNode.prototype.calculateTabBarHeight = function (metrics) {\n        var tabBarHeight = this._getAttr(\"tabStripHeight\");\n        if (tabBarHeight !== 0) {\n            // its defined\n            this._calculatedTabBarHeight = tabBarHeight;\n        }\n        else {\n            this._calculatedTabBarHeight = metrics.tabBarSize;\n        }\n    };\n    TabSetNode.prototype.getHeaderHeight = function () {\n        return this._calculatedHeaderBarHeight;\n    };\n    TabSetNode.prototype.getTabStripHeight = function () {\n        return this._calculatedTabBarHeight;\n    };\n    TabSetNode.prototype.getTabLocation = function () {\n        return this._getAttr(\"tabLocation\");\n    };\n    /** @internal */\n    TabSetNode.prototype._setWeight = function (weight) {\n        this._attributes.weight = weight;\n    };\n    /** @internal */\n    TabSetNode.prototype._setSelected = function (index) {\n        this._attributes.selected = index;\n    };\n    /** @internal */\n    TabSetNode.prototype.canDrop = function (dragNode, x, y) {\n        var dropInfo;\n        if (dragNode === this) {\n            var dockLocation = DockLocation_1.DockLocation.CENTER;\n            var outlineRect = this._tabHeaderRect;\n            dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, -1, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n        }\n        else if (this._contentRect.contains(x, y)) {\n            var dockLocation = DockLocation_1.DockLocation.CENTER;\n            if (this._model.getMaximizedTabset() === undefined) {\n                dockLocation = DockLocation_1.DockLocation.getLocation(this._contentRect, x, y);\n            }\n            var outlineRect = dockLocation.getDockRect(this._rect);\n            dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, -1, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n        }\n        else if (this._tabHeaderRect != null && this._tabHeaderRect.contains(x, y)) {\n            var r = void 0;\n            var yy = void 0;\n            var h = void 0;\n            if (this._children.length === 0) {\n                r = this._tabHeaderRect.clone();\n                yy = r.y + 3;\n                h = r.height - 4;\n                r.width = 2;\n            }\n            else {\n                var child = this._children[0];\n                r = child.getTabRect();\n                yy = r.y;\n                h = r.height;\n                var p = this._tabHeaderRect.x;\n                var childCenter = 0;\n                for (var i = 0; i < this._children.length; i++) {\n                    child = this._children[i];\n                    r = child.getTabRect();\n                    childCenter = r.x + r.width / 2;\n                    if (x >= p && x < childCenter) {\n                        var dockLocation = DockLocation_1.DockLocation.CENTER;\n                        var outlineRect = new Rect_1.Rect(r.x - 2, yy, 3, h);\n                        dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, i, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n                        break;\n                    }\n                    p = childCenter;\n                }\n            }\n            if (dropInfo == null) {\n                var dockLocation = DockLocation_1.DockLocation.CENTER;\n                var outlineRect = new Rect_1.Rect(r.getRight() - 2, yy, 3, h);\n                dropInfo = new DropInfo_1.DropInfo(this, outlineRect, dockLocation, this._children.length, Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n            }\n        }\n        if (!dragNode._canDockInto(dragNode, dropInfo)) {\n            return undefined;\n        }\n        return dropInfo;\n    };\n    /** @internal */\n    TabSetNode.prototype._layout = function (rect, metrics) {\n        this.calculateHeaderBarHeight(metrics);\n        this.calculateTabBarHeight(metrics);\n        if (this.isMaximized()) {\n            rect = this._model.getRoot().getRect();\n        }\n        rect = rect.removeInsets(this._getAttr(\"marginInsets\"));\n        this._rect = rect;\n        rect = rect.removeInsets(this._getAttr(\"borderInsets\"));\n        var showHeader = this.getName() !== undefined;\n        var y = 0;\n        var h = 0;\n        if (showHeader) {\n            y += this._calculatedHeaderBarHeight;\n            h += this._calculatedHeaderBarHeight;\n        }\n        if (this.isEnableTabStrip()) {\n            if (this.getTabLocation() === \"top\") {\n                this._tabHeaderRect = new Rect_1.Rect(rect.x, rect.y + y, rect.width, this._calculatedTabBarHeight);\n            }\n            else {\n                this._tabHeaderRect = new Rect_1.Rect(rect.x, rect.y + rect.height - this._calculatedTabBarHeight, rect.width, this._calculatedTabBarHeight);\n            }\n            h += this._calculatedTabBarHeight;\n            if (this.getTabLocation() === \"top\") {\n                y += this._calculatedTabBarHeight;\n            }\n        }\n        this._contentRect = new Rect_1.Rect(rect.x, rect.y + y, rect.width, rect.height - h);\n        for (var i = 0; i < this._children.length; i++) {\n            var child = this._children[i];\n            child._layout(this._contentRect, metrics);\n            child._setVisible(i === this.getSelected());\n        }\n    };\n    /** @internal */\n    TabSetNode.prototype._delete = function () {\n        this._parent._removeChild(this);\n    };\n    /** @internal */\n    TabSetNode.prototype._remove = function (node) {\n        var removedIndex = this._removeChild(node);\n        this._model._tidy();\n        (0, Utils_1.adjustSelectedIndex)(this, removedIndex);\n    };\n    /** @internal */\n    TabSetNode.prototype.drop = function (dragNode, location, index, select) {\n        var dockLocation = location;\n        if (this === dragNode) {\n            // tabset drop into itself\n            return; // dock back to itself\n        }\n        var dragParent = dragNode.getParent();\n        var fromIndex = 0;\n        if (dragParent !== undefined) {\n            fromIndex = dragParent._removeChild(dragNode);\n            // if selected node in border is being docked into tabset then deselect border tabs\n            if (dragParent instanceof BorderNode_1.BorderNode && dragParent.getSelected() === fromIndex) {\n                dragParent._setSelected(-1);\n            }\n            else {\n                (0, Utils_1.adjustSelectedIndex)(dragParent, fromIndex);\n            }\n        }\n        // if dropping a tab back to same tabset and moving to forward position then reduce insertion index\n        if (dragNode.getType() === TabNode_1.TabNode.TYPE && dragParent === this && fromIndex < index && index > 0) {\n            index--;\n        }\n        // simple_bundled dock to existing tabset\n        if (dockLocation === DockLocation_1.DockLocation.CENTER) {\n            var insertPos = index;\n            if (insertPos === -1) {\n                insertPos = this._children.length;\n            }\n            if (dragNode.getType() === TabNode_1.TabNode.TYPE) {\n                this._addChild(dragNode, insertPos);\n                if (select || (select !== false && this.isAutoSelectTab())) {\n                    this._setSelected(insertPos);\n                }\n                // console.log(\"added child at : \" + insertPos);\n            }\n            else {\n                for (var i = 0; i < dragNode.getChildren().length; i++) {\n                    var child = dragNode.getChildren()[i];\n                    this._addChild(child, insertPos);\n                    // console.log(\"added child at : \" + insertPos);\n                    insertPos++;\n                }\n            }\n            this._model._setActiveTabset(this);\n        }\n        else {\n            var tabSet = void 0;\n            if (dragNode instanceof TabNode_1.TabNode) {\n                // create new tabset parent\n                // console.log(\"create a new tabset\");\n                var callback = this._model._getOnCreateTabSet();\n                tabSet = new TabSetNode(this._model, callback ? callback(dragNode) : {});\n                tabSet._addChild(dragNode);\n                // console.log(\"added child at end\");\n                dragParent = tabSet;\n            }\n            else {\n                tabSet = dragNode;\n            }\n            var parentRow = this._parent;\n            var pos = parentRow.getChildren().indexOf(this);\n            if (parentRow.getOrientation() === dockLocation._orientation) {\n                tabSet._setWeight(this.getWeight() / 2);\n                this._setWeight(this.getWeight() / 2);\n                // console.log(\"added child 50% size at: \" +  pos + dockLocation.indexPlus);\n                parentRow._addChild(tabSet, pos + dockLocation._indexPlus);\n            }\n            else {\n                // create a new row to host the new tabset (it will go in the opposite direction)\n                // console.log(\"create a new row\");\n                var newRow = new RowNode_1.RowNode(this._model, {});\n                newRow._setWeight(this.getWeight());\n                newRow._addChild(this);\n                this._setWeight(50);\n                tabSet._setWeight(50);\n                // console.log(\"added child 50% size at: \" +  dockLocation.indexPlus);\n                newRow._addChild(tabSet, dockLocation._indexPlus);\n                parentRow._removeChild(this);\n                parentRow._addChild(newRow, pos);\n            }\n            this._model._setActiveTabset(tabSet);\n        }\n        this._model._tidy();\n    };\n    TabSetNode.prototype.toJson = function () {\n        var json = {};\n        TabSetNode._attributeDefinitions.toJson(json, this._attributes);\n        json.children = this._children.map(function (child) { return child.toJson(); });\n        if (this.isActive()) {\n            json.active = true;\n        }\n        if (this.isMaximized()) {\n            json.maximized = true;\n        }\n        return json;\n    };\n    /** @internal */\n    TabSetNode.prototype._updateAttrs = function (json) {\n        TabSetNode._attributeDefinitions.update(json, this._attributes);\n    };\n    /** @internal */\n    TabSetNode.prototype._getAttributeDefinitions = function () {\n        return TabSetNode._attributeDefinitions;\n    };\n    /** @internal */\n    TabSetNode.prototype._getPrefSize = function (orientation) {\n        var prefSize = this.getWidth();\n        if (orientation === Orientation_1.Orientation.VERT) {\n            prefSize = this.getHeight();\n        }\n        return prefSize;\n    };\n    /** @internal */\n    TabSetNode.getAttributeDefinitions = function () {\n        return TabSetNode._attributeDefinitions;\n    };\n    TabSetNode.TYPE = \"tabset\";\n    /** @internal */\n    TabSetNode._attributeDefinitions = TabSetNode._createAttributeDefinitions();\n    return TabSetNode;\n}(Node_1.Node));\nexports.TabSetNode = TabSetNode;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/TabSetNode.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TabSetNode\": () => (/* binding */ TabSetNode)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DropInfo__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass TabSetNode extends _Node__WEBPACK_IMPORTED_MODULE_8__.Node {\r\n    /** @internal */\r\n    constructor(model, json) {\r\n        super(model);\r\n        TabSetNode._attributeDefinitions.fromJson(json, this._attributes);\r\n        model._addNode(this);\r\n        this._calculatedTabBarHeight = 0;\r\n        this._calculatedHeaderBarHeight = 0;\r\n    }\r\n    /** @internal */\r\n    static _fromJson(json, model) {\r\n        const newLayoutNode = new TabSetNode(model, json);\r\n        if (json.children != null) {\r\n            for (const jsonChild of json.children) {\r\n                const child = _TabNode__WEBPACK_IMPORTED_MODULE_10__.TabNode._fromJson(jsonChild, model);\r\n                newLayoutNode._addChild(child);\r\n            }\r\n        }\r\n        if (newLayoutNode._children.length === 0) {\r\n            newLayoutNode._setSelected(-1);\r\n        }\r\n        if (json.maximized && json.maximized === true) {\r\n            model._setMaximizedTabset(newLayoutNode);\r\n        }\r\n        if (json.active && json.active === true) {\r\n            model._setActiveTabset(newLayoutNode);\r\n        }\r\n        return newLayoutNode;\r\n    }\r\n    /** @internal */\r\n    static _createAttributeDefinitions() {\r\n        const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\r\n        attributeDefinitions.add(\"type\", TabSetNode.TYPE, true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setFixed();\r\n        attributeDefinitions.add(\"id\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"weight\", 100).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"width\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"height\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"selected\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n        attributeDefinitions.add(\"name\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n        attributeDefinitions.add(\"config\", undefined).setType(\"any\");\r\n        attributeDefinitions.addInherited(\"enableDeleteWhenEmpty\", \"tabSetEnableDeleteWhenEmpty\");\r\n        attributeDefinitions.addInherited(\"enableDrop\", \"tabSetEnableDrop\");\r\n        attributeDefinitions.addInherited(\"enableDrag\", \"tabSetEnableDrag\");\r\n        attributeDefinitions.addInherited(\"enableDivide\", \"tabSetEnableDivide\");\r\n        attributeDefinitions.addInherited(\"enableMaximize\", \"tabSetEnableMaximize\");\r\n        attributeDefinitions.addInherited(\"enableClose\", \"tabSetEnableClose\");\r\n        attributeDefinitions.addInherited(\"classNameTabStrip\", \"tabSetClassNameTabStrip\");\r\n        attributeDefinitions.addInherited(\"classNameHeader\", \"tabSetClassNameHeader\");\r\n        attributeDefinitions.addInherited(\"enableTabStrip\", \"tabSetEnableTabStrip\");\r\n        attributeDefinitions.addInherited(\"borderInsets\", \"tabSetBorderInsets\");\r\n        attributeDefinitions.addInherited(\"marginInsets\", \"tabSetMarginInsets\");\r\n        attributeDefinitions.addInherited(\"minWidth\", \"tabSetMinWidth\");\r\n        attributeDefinitions.addInherited(\"minHeight\", \"tabSetMinHeight\");\r\n        attributeDefinitions.addInherited(\"headerHeight\", \"tabSetHeaderHeight\");\r\n        attributeDefinitions.addInherited(\"tabStripHeight\", \"tabSetTabStripHeight\");\r\n        attributeDefinitions.addInherited(\"tabLocation\", \"tabSetTabLocation\");\r\n        attributeDefinitions.addInherited(\"autoSelectTab\", \"tabSetAutoSelectTab\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n        return attributeDefinitions;\r\n    }\r\n    getName() {\r\n        return this._getAttr(\"name\");\r\n    }\r\n    getSelected() {\r\n        const selected = this._attributes.selected;\r\n        if (selected !== undefined) {\r\n            return selected;\r\n        }\r\n        return -1;\r\n    }\r\n    getSelectedNode() {\r\n        const selected = this.getSelected();\r\n        if (selected !== -1) {\r\n            return this._children[selected];\r\n        }\r\n        return undefined;\r\n    }\r\n    getWeight() {\r\n        return this._getAttr(\"weight\");\r\n    }\r\n    getWidth() {\r\n        return this._getAttr(\"width\");\r\n    }\r\n    getMinWidth() {\r\n        return this._getAttr(\"minWidth\");\r\n    }\r\n    getHeight() {\r\n        return this._getAttr(\"height\");\r\n    }\r\n    getMinHeight() {\r\n        return this._getAttr(\"minHeight\");\r\n    }\r\n    /** @internal */\r\n    getMinSize(orientation) {\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\r\n            return this.getMinWidth();\r\n        }\r\n        else {\r\n            return this.getMinHeight();\r\n        }\r\n    }\r\n    /**\r\n     * Returns the config attribute that can be used to store node specific data that\r\n     * WILL be saved to the json. The config attribute should be changed via the action Actions.updateNodeAttributes rather\r\n     * than directly, for example:\r\n     * this.state.model.doAction(\r\n     *   FlexLayout.Actions.updateNodeAttributes(node.getId(), {config:myConfigObject}));\r\n     */\r\n    getConfig() {\r\n        return this._attributes.config;\r\n    }\r\n    isMaximized() {\r\n        return this._model.getMaximizedTabset() === this;\r\n    }\r\n    isActive() {\r\n        return this._model.getActiveTabset() === this;\r\n    }\r\n    isEnableDeleteWhenEmpty() {\r\n        return this._getAttr(\"enableDeleteWhenEmpty\");\r\n    }\r\n    isEnableDrop() {\r\n        return this._getAttr(\"enableDrop\");\r\n    }\r\n    isEnableDrag() {\r\n        return this._getAttr(\"enableDrag\");\r\n    }\r\n    isEnableDivide() {\r\n        return this._getAttr(\"enableDivide\");\r\n    }\r\n    isEnableMaximize() {\r\n        return this._getAttr(\"enableMaximize\");\r\n    }\r\n    isEnableClose() {\r\n        return this._getAttr(\"enableClose\");\r\n    }\r\n    canMaximize() {\r\n        if (this.isEnableMaximize()) {\r\n            // always allow maximize toggle if already maximized\r\n            if (this.getModel().getMaximizedTabset() === this) {\r\n                return true;\r\n            }\r\n            // only one tabset, so disable\r\n            if (this.getParent() === this.getModel().getRoot() && this.getModel().getRoot().getChildren().length === 1) {\r\n                return false;\r\n            }\r\n            return true;\r\n        }\r\n        return false;\r\n    }\r\n    isEnableTabStrip() {\r\n        return this._getAttr(\"enableTabStrip\");\r\n    }\r\n    isAutoSelectTab() {\r\n        return this._getAttr(\"autoSelectTab\");\r\n    }\r\n    getClassNameTabStrip() {\r\n        return this._getAttr(\"classNameTabStrip\");\r\n    }\r\n    getClassNameHeader() {\r\n        return this._getAttr(\"classNameHeader\");\r\n    }\r\n    /** @internal */\r\n    calculateHeaderBarHeight(metrics) {\r\n        const headerBarHeight = this._getAttr(\"headerHeight\");\r\n        if (headerBarHeight !== 0) {\r\n            // its defined\r\n            this._calculatedHeaderBarHeight = headerBarHeight;\r\n        }\r\n        else {\r\n            this._calculatedHeaderBarHeight = metrics.headerBarSize;\r\n        }\r\n    }\r\n    /** @internal */\r\n    calculateTabBarHeight(metrics) {\r\n        const tabBarHeight = this._getAttr(\"tabStripHeight\");\r\n        if (tabBarHeight !== 0) {\r\n            // its defined\r\n            this._calculatedTabBarHeight = tabBarHeight;\r\n        }\r\n        else {\r\n            this._calculatedTabBarHeight = metrics.tabBarSize;\r\n        }\r\n    }\r\n    getHeaderHeight() {\r\n        return this._calculatedHeaderBarHeight;\r\n    }\r\n    getTabStripHeight() {\r\n        return this._calculatedTabBarHeight;\r\n    }\r\n    getTabLocation() {\r\n        return this._getAttr(\"tabLocation\");\r\n    }\r\n    /** @internal */\r\n    _setWeight(weight) {\r\n        this._attributes.weight = weight;\r\n    }\r\n    /** @internal */\r\n    _setSelected(index) {\r\n        this._attributes.selected = index;\r\n    }\r\n    /** @internal */\r\n    canDrop(dragNode, x, y) {\r\n        let dropInfo;\r\n        if (dragNode === this) {\r\n            const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n            const outlineRect = this._tabHeaderRect;\r\n            dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n        }\r\n        else if (this._contentRect.contains(x, y)) {\r\n            let dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n            if (this._model.getMaximizedTabset() === undefined) {\r\n                dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getLocation(this._contentRect, x, y);\r\n            }\r\n            const outlineRect = dockLocation.getDockRect(this._rect);\r\n            dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n        }\r\n        else if (this._tabHeaderRect != null && this._tabHeaderRect.contains(x, y)) {\r\n            let r;\r\n            let yy;\r\n            let h;\r\n            if (this._children.length === 0) {\r\n                r = this._tabHeaderRect.clone();\r\n                yy = r.y + 3;\r\n                h = r.height - 4;\r\n                r.width = 2;\r\n            }\r\n            else {\r\n                let child = this._children[0];\r\n                r = child.getTabRect();\r\n                yy = r.y;\r\n                h = r.height;\r\n                let p = this._tabHeaderRect.x;\r\n                let childCenter = 0;\r\n                for (let i = 0; i < this._children.length; i++) {\r\n                    child = this._children[i];\r\n                    r = child.getTabRect();\r\n                    childCenter = r.x + r.width / 2;\r\n                    if (x >= p && x < childCenter) {\r\n                        const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n                        const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(r.x - 2, yy, 3, h);\r\n                        dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n                        break;\r\n                    }\r\n                    p = childCenter;\r\n                }\r\n            }\r\n            if (dropInfo == null) {\r\n                const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n                const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(r.getRight() - 2, yy, 3, h);\r\n                dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this._children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n            }\r\n        }\r\n        if (!dragNode._canDockInto(dragNode, dropInfo)) {\r\n            return undefined;\r\n        }\r\n        return dropInfo;\r\n    }\r\n    /** @internal */\r\n    _layout(rect, metrics) {\r\n        this.calculateHeaderBarHeight(metrics);\r\n        this.calculateTabBarHeight(metrics);\r\n        if (this.isMaximized()) {\r\n            rect = this._model.getRoot().getRect();\r\n        }\r\n        rect = rect.removeInsets(this._getAttr(\"marginInsets\"));\r\n        this._rect = rect;\r\n        rect = rect.removeInsets(this._getAttr(\"borderInsets\"));\r\n        const showHeader = this.getName() !== undefined;\r\n        let y = 0;\r\n        let h = 0;\r\n        if (showHeader) {\r\n            y += this._calculatedHeaderBarHeight;\r\n            h += this._calculatedHeaderBarHeight;\r\n        }\r\n        if (this.isEnableTabStrip()) {\r\n            if (this.getTabLocation() === \"top\") {\r\n                this._tabHeaderRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(rect.x, rect.y + y, rect.width, this._calculatedTabBarHeight);\r\n            }\r\n            else {\r\n                this._tabHeaderRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(rect.x, rect.y + rect.height - this._calculatedTabBarHeight, rect.width, this._calculatedTabBarHeight);\r\n            }\r\n            h += this._calculatedTabBarHeight;\r\n            if (this.getTabLocation() === \"top\") {\r\n                y += this._calculatedTabBarHeight;\r\n            }\r\n        }\r\n        this._contentRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(rect.x, rect.y + y, rect.width, rect.height - h);\r\n        for (let i = 0; i < this._children.length; i++) {\r\n            const child = this._children[i];\r\n            child._layout(this._contentRect, metrics);\r\n            child._setVisible(i === this.getSelected());\r\n        }\r\n    }\r\n    /** @internal */\r\n    _delete() {\r\n        this._parent._removeChild(this);\r\n    }\r\n    /** @internal */\r\n    _remove(node) {\r\n        const removedIndex = this._removeChild(node);\r\n        this._model._tidy();\r\n        (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.adjustSelectedIndex)(this, removedIndex);\r\n    }\r\n    /** @internal */\r\n    drop(dragNode, location, index, select) {\r\n        const dockLocation = location;\r\n        if (this === dragNode) {\r\n            // tabset drop into itself\r\n            return; // dock back to itself\r\n        }\r\n        let dragParent = dragNode.getParent();\r\n        let fromIndex = 0;\r\n        if (dragParent !== undefined) {\r\n            fromIndex = dragParent._removeChild(dragNode);\r\n            // if selected node in border is being docked into tabset then deselect border tabs\r\n            if (dragParent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_7__.BorderNode && dragParent.getSelected() === fromIndex) {\r\n                dragParent._setSelected(-1);\r\n            }\r\n            else {\r\n                (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.adjustSelectedIndex)(dragParent, fromIndex);\r\n            }\r\n        }\r\n        // if dropping a tab back to same tabset and moving to forward position then reduce insertion index\r\n        if (dragNode.getType() === _TabNode__WEBPACK_IMPORTED_MODULE_10__.TabNode.TYPE && dragParent === this && fromIndex < index && index > 0) {\r\n            index--;\r\n        }\r\n        // simple_bundled dock to existing tabset\r\n        if (dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER) {\r\n            let insertPos = index;\r\n            if (insertPos === -1) {\r\n                insertPos = this._children.length;\r\n            }\r\n            if (dragNode.getType() === _TabNode__WEBPACK_IMPORTED_MODULE_10__.TabNode.TYPE) {\r\n                this._addChild(dragNode, insertPos);\r\n                if (select || (select !== false && this.isAutoSelectTab())) {\r\n                    this._setSelected(insertPos);\r\n                }\r\n                // console.log(\"added child at : \" + insertPos);\r\n            }\r\n            else {\r\n                for (let i = 0; i < dragNode.getChildren().length; i++) {\r\n                    const child = dragNode.getChildren()[i];\r\n                    this._addChild(child, insertPos);\r\n                    // console.log(\"added child at : \" + insertPos);\r\n                    insertPos++;\r\n                }\r\n                if (this.getSelected() === -1 && this._children.length > 0) {\r\n                    this._setSelected(0);\r\n                }\r\n            }\r\n            this._model._setActiveTabset(this);\r\n        }\r\n        else {\r\n            let tabSet;\r\n            if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_10__.TabNode) {\r\n                // create new tabset parent\r\n                // console.log(\"create a new tabset\");\r\n                const callback = this._model._getOnCreateTabSet();\r\n                tabSet = new TabSetNode(this._model, callback ? callback(dragNode) : {});\r\n                tabSet._addChild(dragNode);\r\n                // console.log(\"added child at end\");\r\n                dragParent = tabSet;\r\n            }\r\n            else {\r\n                tabSet = dragNode;\r\n            }\r\n            const parentRow = this._parent;\r\n            const pos = parentRow.getChildren().indexOf(this);\r\n            if (parentRow.getOrientation() === dockLocation._orientation) {\r\n                tabSet._setWeight(this.getWeight() / 2);\r\n                this._setWeight(this.getWeight() / 2);\r\n                // console.log(\"added child 50% size at: \" +  pos + dockLocation.indexPlus);\r\n                parentRow._addChild(tabSet, pos + dockLocation._indexPlus);\r\n            }\r\n            else {\r\n                // create a new row to host the new tabset (it will go in the opposite direction)\r\n                // console.log(\"create a new row\");\r\n                const newRow = new _RowNode__WEBPACK_IMPORTED_MODULE_9__.RowNode(this._model, {});\r\n                newRow._setWeight(this.getWeight());\r\n                newRow._addChild(this);\r\n                this._setWeight(50);\r\n                tabSet._setWeight(50);\r\n                // console.log(\"added child 50% size at: \" +  dockLocation.indexPlus);\r\n                newRow._addChild(tabSet, dockLocation._indexPlus);\r\n                parentRow._removeChild(this);\r\n                parentRow._addChild(newRow, pos);\r\n            }\r\n            this._model._setActiveTabset(tabSet);\r\n        }\r\n        this._model._tidy();\r\n    }\r\n    toJson() {\r\n        const json = {};\r\n        TabSetNode._attributeDefinitions.toJson(json, this._attributes);\r\n        json.children = this._children.map((child) => child.toJson());\r\n        if (this.isActive()) {\r\n            json.active = true;\r\n        }\r\n        if (this.isMaximized()) {\r\n            json.maximized = true;\r\n        }\r\n        return json;\r\n    }\r\n    /** @internal */\r\n    _updateAttrs(json) {\r\n        TabSetNode._attributeDefinitions.update(json, this._attributes);\r\n    }\r\n    /** @internal */\r\n    _getAttributeDefinitions() {\r\n        return TabSetNode._attributeDefinitions;\r\n    }\r\n    /** @internal */\r\n    _getPrefSize(orientation) {\r\n        let prefSize = this.getWidth();\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\r\n            prefSize = this.getHeight();\r\n        }\r\n        return prefSize;\r\n    }\r\n    /** @internal */\r\n    static getAttributeDefinitions() {\r\n        return TabSetNode._attributeDefinitions;\r\n    }\r\n}\r\nTabSetNode.TYPE = \"tabset\";\r\n/** @internal */\r\nTabSetNode._attributeDefinitions = TabSetNode._createAttributeDefinitions();\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/TabSetNode.ts?");
 
 /***/ }),
 
@@ -424,9 +324,9 @@ eval("\nvar __extends = (this && this.__extends) || (function () {\n    var exte
 /*!****************************!*\
   !*** ./src/model/Utils.ts ***!
   \****************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.adjustSelectedIndex = exports.adjustSelectedIndexAfterDock = exports.adjustSelectedIndexAfterFloat = void 0;\nvar TabSetNode_1 = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\nvar BorderNode_1 = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/** @internal */\nfunction adjustSelectedIndexAfterFloat(node) {\n    var parent = node.getParent();\n    if (parent !== null) {\n        if (parent instanceof TabSetNode_1.TabSetNode) {\n            var found = false;\n            var newSelected = 0;\n            var children = parent.getChildren();\n            for (var i = 0; i < children.length; i++) {\n                var child = children[i];\n                if (child === node) {\n                    found = true;\n                }\n                else {\n                    if (!child.isFloating()) {\n                        newSelected = i;\n                        if (found)\n                            break;\n                    }\n                }\n            }\n            parent._setSelected(newSelected);\n        }\n        else if (parent instanceof BorderNode_1.BorderNode) {\n            parent._setSelected(-1);\n        }\n    }\n}\nexports.adjustSelectedIndexAfterFloat = adjustSelectedIndexAfterFloat;\n/** @internal */\nfunction adjustSelectedIndexAfterDock(node) {\n    var parent = node.getParent();\n    if (parent !== null && (parent instanceof TabSetNode_1.TabSetNode || parent instanceof BorderNode_1.BorderNode)) {\n        var children = parent.getChildren();\n        for (var i = 0; i < children.length; i++) {\n            var child = children[i];\n            if (child === node) {\n                parent._setSelected(i);\n                return;\n            }\n        }\n    }\n}\nexports.adjustSelectedIndexAfterDock = adjustSelectedIndexAfterDock;\n/** @internal */\nfunction adjustSelectedIndex(parent, removedIndex) {\n    // for the tabset/border being removed from set the selected index\n    if (parent !== undefined && (parent.getType() === TabSetNode_1.TabSetNode.TYPE || parent.getType() === BorderNode_1.BorderNode.TYPE)) {\n        var selectedIndex = parent.getSelected();\n        if (selectedIndex !== -1) {\n            if (removedIndex === selectedIndex && parent.getChildren().length > 0) {\n                if (removedIndex >= parent.getChildren().length) {\n                    // removed last tab; select new last tab\n                    parent._setSelected(parent.getChildren().length - 1);\n                }\n                else {\n                    // leave selected index as is, selecting next tab after this one\n                }\n            }\n            else if (removedIndex < selectedIndex) {\n                parent._setSelected(selectedIndex - 1);\n            }\n            else if (removedIndex > selectedIndex) {\n                // leave selected index as is\n            }\n            else {\n                parent._setSelected(-1);\n            }\n        }\n    }\n}\nexports.adjustSelectedIndex = adjustSelectedIndex;\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Utils.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"adjustSelectedIndex\": () => (/* binding */ adjustSelectedIndex),\n/* harmony export */   \"adjustSelectedIndexAfterDock\": () => (/* binding */ adjustSelectedIndexAfterDock),\n/* harmony export */   \"adjustSelectedIndexAfterFloat\": () => (/* binding */ adjustSelectedIndexAfterFloat)\n/* harmony export */ });\n/* harmony import */ var _TabSetNode__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n\r\n\r\n/** @internal */\r\nfunction adjustSelectedIndexAfterFloat(node) {\r\n    const parent = node.getParent();\r\n    if (parent !== null) {\r\n        if (parent instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_0__.TabSetNode) {\r\n            let found = false;\r\n            let newSelected = 0;\r\n            const children = parent.getChildren();\r\n            for (let i = 0; i < children.length; i++) {\r\n                const child = children[i];\r\n                if (child === node) {\r\n                    found = true;\r\n                }\r\n                else {\r\n                    if (!child.isFloating()) {\r\n                        newSelected = i;\r\n                        if (found)\r\n                            break;\r\n                    }\r\n                }\r\n            }\r\n            parent._setSelected(newSelected);\r\n        }\r\n        else if (parent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_1__.BorderNode) {\r\n            parent._setSelected(-1);\r\n        }\r\n    }\r\n}\r\n/** @internal */\r\nfunction adjustSelectedIndexAfterDock(node) {\r\n    const parent = node.getParent();\r\n    if (parent !== null && (parent instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_0__.TabSetNode || parent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_1__.BorderNode)) {\r\n        const children = parent.getChildren();\r\n        for (let i = 0; i < children.length; i++) {\r\n            const child = children[i];\r\n            if (child === node) {\r\n                parent._setSelected(i);\r\n                return;\r\n            }\r\n        }\r\n    }\r\n}\r\n/** @internal */\r\nfunction adjustSelectedIndex(parent, removedIndex) {\r\n    // for the tabset/border being removed from set the selected index\r\n    if (parent !== undefined && (parent.getType() === _TabSetNode__WEBPACK_IMPORTED_MODULE_0__.TabSetNode.TYPE || parent.getType() === _BorderNode__WEBPACK_IMPORTED_MODULE_1__.BorderNode.TYPE)) {\r\n        const selectedIndex = parent.getSelected();\r\n        if (selectedIndex !== -1) {\r\n            if (removedIndex === selectedIndex && parent.getChildren().length > 0) {\r\n                if (removedIndex >= parent.getChildren().length) {\r\n                    // removed last tab; select new last tab\r\n                    parent._setSelected(parent.getChildren().length - 1);\r\n                }\r\n                else {\r\n                    // leave selected index as is, selecting next tab after this one\r\n                }\r\n            }\r\n            else if (removedIndex < selectedIndex) {\r\n                parent._setSelected(selectedIndex - 1);\r\n            }\r\n            else if (removedIndex > selectedIndex) {\r\n                // leave selected index as is\r\n            }\r\n            else {\r\n                parent._setSelected(-1);\r\n            }\r\n        }\r\n    }\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Utils.ts?");
 
 /***/ }),
 
@@ -434,9 +334,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!***********************************!*\
   !*** ./src/view/BorderButton.tsx ***!
   \***********************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.BorderButton = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar I18nLabel_1 = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\nvar Actions_1 = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar ICloseType_1 = __webpack_require__(/*! ../model/ICloseType */ \"./src/model/ICloseType.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/** @internal */\nvar BorderButton = function (props) {\n    var layout = props.layout, node = props.node, selected = props.selected, border = props.border, iconFactory = props.iconFactory, titleFactory = props.titleFactory, icons = props.icons, path = props.path;\n    var selfRef = React.useRef(null);\n    var contentRef = React.useRef(null);\n    var onMouseDown = function (event) {\n        if (!(0, Utils_1.isAuxMouseEvent)(event) && !layout.getEditingTab()) {\n            layout.dragStart(event, undefined, node, node.isEnableDrag(), onClick, onDoubleClick);\n        }\n    };\n    var onAuxMouseClick = function (event) {\n        if ((0, Utils_1.isAuxMouseEvent)(event)) {\n            layout.auxMouseClick(node, event);\n        }\n    };\n    var onContextMenu = function (event) {\n        layout.showContextMenu(node, event);\n    };\n    var onClick = function () {\n        layout.doAction(Actions_1.Actions.selectTab(node.getId()));\n    };\n    var onDoubleClick = function (event) {\n        // if (node.isEnableRename()) {\n        //     onRename();\n        // }\n    };\n    // const onRename = () => {\n    //     layout.setEditingTab(node);\n    //     layout.getCurrentDocument()!.body.addEventListener(\"mousedown\", onEndEdit);\n    //     layout.getCurrentDocument()!.body.addEventListener(\"touchstart\", onEndEdit);\n    // };\n    var onEndEdit = function (event) {\n        if (event.target !== contentRef.current) {\n            layout.getCurrentDocument().body.removeEventListener(\"mousedown\", onEndEdit);\n            layout.getCurrentDocument().body.removeEventListener(\"touchstart\", onEndEdit);\n            layout.setEditingTab(undefined);\n        }\n    };\n    var isClosable = function () {\n        var closeType = node.getCloseType();\n        if (selected || closeType === ICloseType_1.ICloseType.Always) {\n            return true;\n        }\n        if (closeType === ICloseType_1.ICloseType.Visible) {\n            // not selected but x should be visible due to hover\n            if (window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches) {\n                return true;\n            }\n        }\n        return false;\n    };\n    var onClose = function (event) {\n        if (isClosable()) {\n            layout.doAction(Actions_1.Actions.deleteTab(node.getId()));\n        }\n        else {\n            onClick();\n        }\n    };\n    var onCloseMouseDown = function (event) {\n        event.stopPropagation();\n    };\n    React.useLayoutEffect(function () {\n        updateRect();\n        if (layout.getEditingTab() === node) {\n            contentRef.current.select();\n        }\n    });\n    var updateRect = function () {\n        // record position of tab in node\n        var layoutRect = layout.getDomRect();\n        var r = selfRef.current.getBoundingClientRect();\n        node._setTabRect(new Rect_1.Rect(r.left - layoutRect.left, r.top - layoutRect.top, r.width, r.height));\n    };\n    var onTextBoxMouseDown = function (event) {\n        // console.log(\"onTextBoxMouseDown\");\n        event.stopPropagation();\n    };\n    var onTextBoxKeyPress = function (event) {\n        // console.log(event, event.keyCode);\n        if (event.keyCode === 27) {\n            // esc\n            layout.setEditingTab(undefined);\n        }\n        else if (event.keyCode === 13) {\n            // enter\n            layout.setEditingTab(undefined);\n            layout.doAction(Actions_1.Actions.renameTab(node.getId(), event.target.value));\n        }\n    };\n    var cm = layout.getClassName;\n    var classNames = cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_BUTTON) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_BUTTON_ + border);\n    if (selected) {\n        classNames += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_BUTTON__SELECTED);\n    }\n    else {\n        classNames += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_BUTTON__UNSELECTED);\n    }\n    if (node.getClassName() !== undefined) {\n        classNames += \" \" + node.getClassName();\n    }\n    var renderState = (0, Utils_1.getRenderStateEx)(layout, node, iconFactory, titleFactory);\n    var content = renderState.content ? (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_BUTTON_CONTENT) }, renderState.content)) : null;\n    var leading = renderState.leading ? (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_BUTTON_LEADING) }, renderState.leading)) : null;\n    if (layout.getEditingTab() === node) {\n        content = (React.createElement(\"input\", { ref: contentRef, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_TEXTBOX), \"data-layout-path\": path + \"/textbox\", type: \"text\", autoFocus: true, defaultValue: node.getName(), onKeyDown: onTextBoxKeyPress, onMouseDown: onTextBoxMouseDown, onTouchStart: onTextBoxMouseDown }));\n    }\n    if (node.isEnableClose()) {\n        var closeTitle = layout.i18nName(I18nLabel_1.I18nLabel.Close_Tab);\n        renderState.buttons.push(React.createElement(\"div\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: closeTitle, className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_BUTTON_TRAILING), onMouseDown: onCloseMouseDown, onClick: onClose, onTouchStart: onCloseMouseDown }, (typeof icons.close === \"function\") ? icons.close(node) : icons.close));\n    }\n    return (React.createElement(\"div\", { ref: selfRef, \"data-layout-path\": path, className: classNames, onMouseDown: onMouseDown, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onTouchStart: onMouseDown, title: node.getHelpText() },\n        leading,\n        content,\n        renderState.buttons));\n};\nexports.BorderButton = BorderButton;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderButton.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"BorderButton\": () => (/* binding */ BorderButton)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/ICloseType */ \"./src/model/ICloseType.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst BorderButton = (props) => {\r\n    const { layout, node, selected, border, iconFactory, titleFactory, icons, path } = props;\r\n    const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const contentRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const onMouseDown = (event) => {\r\n        if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isAuxMouseEvent)(event) && !layout.getEditingTab()) {\r\n            layout.dragStart(event, undefined, node, node.isEnableDrag(), onClick, onDoubleClick);\r\n        }\r\n    };\r\n    const onAuxMouseClick = (event) => {\r\n        if ((0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isAuxMouseEvent)(event)) {\r\n            layout.auxMouseClick(node, event);\r\n        }\r\n    };\r\n    const onContextMenu = (event) => {\r\n        layout.showContextMenu(node, event);\r\n    };\r\n    const onClick = () => {\r\n        layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(node.getId()));\r\n    };\r\n    const onDoubleClick = (event) => {\r\n        // if (node.isEnableRename()) {\r\n        //     onRename();\r\n        // }\r\n    };\r\n    // const onRename = () => {\r\n    //     layout.setEditingTab(node);\r\n    //     layout.getCurrentDocument()!.body.addEventListener(\"mousedown\", onEndEdit);\r\n    //     layout.getCurrentDocument()!.body.addEventListener(\"touchstart\", onEndEdit);\r\n    // };\r\n    const onEndEdit = (event) => {\r\n        if (event.target !== contentRef.current) {\r\n            layout.getCurrentDocument().body.removeEventListener(\"mousedown\", onEndEdit);\r\n            layout.getCurrentDocument().body.removeEventListener(\"touchstart\", onEndEdit);\r\n            layout.setEditingTab(undefined);\r\n        }\r\n    };\r\n    const isClosable = () => {\r\n        const closeType = node.getCloseType();\r\n        if (selected || closeType === _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__.ICloseType.Always) {\r\n            return true;\r\n        }\r\n        if (closeType === _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__.ICloseType.Visible) {\r\n            // not selected but x should be visible due to hover\r\n            if (window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches) {\r\n                return true;\r\n            }\r\n        }\r\n        return false;\r\n    };\r\n    const onClose = (event) => {\r\n        if (isClosable()) {\r\n            layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTab(node.getId()));\r\n        }\r\n        else {\r\n            onClick();\r\n        }\r\n    };\r\n    const onCloseMouseDown = (event) => {\r\n        event.stopPropagation();\r\n    };\r\n    react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\r\n        updateRect();\r\n        if (layout.getEditingTab() === node) {\r\n            contentRef.current.select();\r\n        }\r\n    });\r\n    const updateRect = () => {\r\n        // record position of tab in node\r\n        const layoutRect = layout.getDomRect();\r\n        const r = selfRef.current.getBoundingClientRect();\r\n        node._setTabRect(new _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect(r.left - layoutRect.left, r.top - layoutRect.top, r.width, r.height));\r\n    };\r\n    const onTextBoxMouseDown = (event) => {\r\n        // console.log(\"onTextBoxMouseDown\");\r\n        event.stopPropagation();\r\n    };\r\n    const onTextBoxKeyPress = (event) => {\r\n        // console.log(event, event.keyCode);\r\n        if (event.keyCode === 27) {\r\n            // esc\r\n            layout.setEditingTab(undefined);\r\n        }\r\n        else if (event.keyCode === 13) {\r\n            // enter\r\n            layout.setEditingTab(undefined);\r\n            layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.renameTab(node.getId(), event.target.value));\r\n        }\r\n    };\r\n    const cm = layout.getClassName;\r\n    let classNames = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_ + border);\r\n    if (selected) {\r\n        classNames += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON__SELECTED);\r\n    }\r\n    else {\r\n        classNames += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON__UNSELECTED);\r\n    }\r\n    if (node.getClassName() !== undefined) {\r\n        classNames += \" \" + node.getClassName();\r\n    }\r\n    const renderState = (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.getRenderStateEx)(layout, node, iconFactory, titleFactory);\r\n    let content = renderState.content ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_CONTENT) }, renderState.content)) : null;\r\n    const leading = renderState.leading ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_LEADING) }, renderState.leading)) : null;\r\n    if (layout.getEditingTab() === node) {\r\n        content = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"input\", { ref: contentRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__TAB_BUTTON_TEXTBOX), \"data-layout-path\": path + \"/textbox\", type: \"text\", autoFocus: true, defaultValue: node.getName(), onKeyDown: onTextBoxKeyPress, onMouseDown: onTextBoxMouseDown, onTouchStart: onTextBoxMouseDown }));\r\n    }\r\n    if (node.isEnableClose()) {\r\n        const closeTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tab);\r\n        renderState.buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: closeTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_TRAILING), onMouseDown: onCloseMouseDown, onClick: onClose, onTouchStart: onCloseMouseDown }, (typeof icons.close === \"function\") ? icons.close(node) : icons.close));\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, \"data-layout-path\": path, className: classNames, onMouseDown: onMouseDown, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onTouchStart: onMouseDown, title: node.getHelpText() },\r\n        leading,\r\n        content,\r\n        renderState.buttons));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderButton.tsx?");
 
 /***/ }),
 
@@ -444,9 +344,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!***********************************!*\
   !*** ./src/view/BorderTabSet.tsx ***!
   \***********************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.BorderTabSet = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar DockLocation_1 = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\nvar BorderButton_1 = __webpack_require__(/*! ./BorderButton */ \"./src/view/BorderButton.tsx\");\nvar PopupMenu_1 = __webpack_require__(/*! ../PopupMenu */ \"./src/PopupMenu.tsx\");\nvar Actions_1 = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\nvar I18nLabel_1 = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\nvar TabOverflowHook_1 = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/** @internal */\nvar BorderTabSet = function (props) {\n    var border = props.border, layout = props.layout, iconFactory = props.iconFactory, titleFactory = props.titleFactory, icons = props.icons, path = props.path;\n    var toolbarRef = React.useRef(null);\n    var overflowbuttonRef = React.useRef(null);\n    var stickyButtonsRef = React.useRef(null);\n    var _a = (0, TabOverflowHook_1.useTabOverflow)(border, Orientation_1.Orientation.flip(border.getOrientation()), toolbarRef, stickyButtonsRef), selfRef = _a.selfRef, position = _a.position, userControlledLeft = _a.userControlledLeft, hiddenTabs = _a.hiddenTabs, onMouseWheel = _a.onMouseWheel;\n    var onAuxMouseClick = function (event) {\n        if ((0, Utils_1.isAuxMouseEvent)(event)) {\n            layout.auxMouseClick(border, event);\n        }\n    };\n    var onContextMenu = function (event) {\n        layout.showContextMenu(border, event);\n    };\n    var onInterceptMouseDown = function (event) {\n        event.stopPropagation();\n    };\n    var onOverflowClick = function (event) {\n        var callback = layout.getShowOverflowMenu();\n        if (callback !== undefined) {\n            callback(border, event, hiddenTabs, onOverflowItemSelect);\n        }\n        else {\n            var element = overflowbuttonRef.current;\n            (0, PopupMenu_1.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout, iconFactory, titleFactory);\n        }\n        event.stopPropagation();\n    };\n    var onOverflowItemSelect = function (item) {\n        layout.doAction(Actions_1.Actions.selectTab(item.node.getId()));\n        userControlledLeft.current = false;\n    };\n    var onFloatTab = function (event) {\n        var selectedTabNode = border.getChildren()[border.getSelected()];\n        if (selectedTabNode !== undefined) {\n            layout.doAction(Actions_1.Actions.floatTab(selectedTabNode.getId()));\n        }\n        event.stopPropagation();\n    };\n    var cm = layout.getClassName;\n    var style = border.getTabHeaderRect().styleWithPosition({});\n    var tabs = [];\n    var layoutTab = function (i) {\n        var isSelected = border.getSelected() === i;\n        var child = border.getChildren()[i];\n        tabs.push(React.createElement(BorderButton_1.BorderButton, { layout: layout, border: border.getLocation().getName(), node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected, iconFactory: iconFactory, titleFactory: titleFactory, icons: icons }));\n        if (i < border.getChildren().length - 1) {\n            tabs.push(React.createElement(\"div\", { key: \"divider\" + i, className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_TAB_DIVIDER) }));\n        }\n    };\n    for (var i = 0; i < border.getChildren().length; i++) {\n        layoutTab(i);\n    }\n    var borderClasses = cm(Types_1.CLASSES.FLEXLAYOUT__BORDER) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_ + border.getLocation().getName());\n    if (border.getClassName() !== undefined) {\n        borderClasses += \" \" + border.getClassName();\n    }\n    // allow customization of tabset right/bottom buttons\n    var buttons = [];\n    var renderState = { headerContent: undefined, buttons: buttons, stickyButtons: [], headerButtons: [] };\n    layout.customizeTabSet(border, renderState);\n    buttons = renderState.buttons;\n    var toolbar;\n    if (hiddenTabs.length > 0) {\n        var overflowTitle = layout.i18nName(I18nLabel_1.I18nLabel.Overflow_Menu_Tooltip);\n        var overflowContent = void 0;\n        if (typeof icons.more === \"function\") {\n            overflowContent = icons.more(border, hiddenTabs);\n        }\n        else {\n            overflowContent = (React.createElement(React.Fragment, null,\n                icons.more,\n                React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\n        }\n        buttons.push(React.createElement(\"button\", { key: \"overflowbutton\", ref: overflowbuttonRef, className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_ + border.getLocation().getName()), title: overflowTitle, onClick: onOverflowClick, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, overflowContent));\n    }\n    var selectedIndex = border.getSelected();\n    if (selectedIndex !== -1) {\n        var selectedTabNode = border.getChildren()[selectedIndex];\n        if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnableFloat() && !selectedTabNode.isFloating()) {\n            var floatTitle = layout.i18nName(I18nLabel_1.I18nLabel.Float_Tab);\n            buttons.push(React.createElement(\"button\", { key: \"float\", title: floatTitle, className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT), onClick: onFloatTab, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\n        }\n    }\n    toolbar = (React.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_ + border.getLocation().getName()) }, buttons));\n    style = layout.styleFont(style);\n    var innerStyle = {};\n    var borderHeight = border.getBorderBarSize() - 1;\n    if (border.getLocation() === DockLocation_1.DockLocation.LEFT) {\n        innerStyle = { right: borderHeight, height: borderHeight, top: position };\n    }\n    else if (border.getLocation() === DockLocation_1.DockLocation.RIGHT) {\n        innerStyle = { left: borderHeight, height: borderHeight, top: position };\n    }\n    else {\n        innerStyle = { height: borderHeight, left: position };\n    }\n    return (React.createElement(\"div\", { ref: selfRef, dir: \"ltr\", style: style, className: borderClasses, \"data-layout-path\": path, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onWheel: onMouseWheel },\n        React.createElement(\"div\", { style: { height: borderHeight }, className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_INNER) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_INNER_ + border.getLocation().getName()) },\n            React.createElement(\"div\", { style: innerStyle, className: cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_ + border.getLocation().getName()) }, tabs)),\n        toolbar));\n};\nexports.BorderTabSet = BorderTabSet;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderTabSet.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"BorderTabSet\": () => (/* binding */ BorderTabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _BorderButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BorderButton */ \"./src/view/BorderButton.tsx\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../PopupMenu */ \"./src/PopupMenu.tsx\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst BorderTabSet = (props) => {\r\n    const { border, layout, iconFactory, titleFactory, icons, path } = props;\r\n    const toolbarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__.useTabOverflow)(border, _Orientation__WEBPACK_IMPORTED_MODULE_7__.Orientation.flip(border.getOrientation()), toolbarRef, stickyButtonsRef);\r\n    const onAuxMouseClick = (event) => {\r\n        if ((0,_Utils__WEBPACK_IMPORTED_MODULE_9__.isAuxMouseEvent)(event)) {\r\n            layout.auxMouseClick(border, event);\r\n        }\r\n    };\r\n    const onContextMenu = (event) => {\r\n        layout.showContextMenu(border, event);\r\n    };\r\n    const onInterceptMouseDown = (event) => {\r\n        event.stopPropagation();\r\n    };\r\n    const onOverflowClick = (event) => {\r\n        const callback = layout.getShowOverflowMenu();\r\n        if (callback !== undefined) {\r\n            callback(border, event, hiddenTabs, onOverflowItemSelect);\r\n        }\r\n        else {\r\n            const element = overflowbuttonRef.current;\r\n            (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout, iconFactory, titleFactory);\r\n        }\r\n        event.stopPropagation();\r\n    };\r\n    const onOverflowItemSelect = (item) => {\r\n        layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.selectTab(item.node.getId()));\r\n        userControlledLeft.current = false;\r\n    };\r\n    const onFloatTab = (event) => {\r\n        const selectedTabNode = border.getChildren()[border.getSelected()];\r\n        if (selectedTabNode !== undefined) {\r\n            layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.floatTab(selectedTabNode.getId()));\r\n        }\r\n        event.stopPropagation();\r\n    };\r\n    const cm = layout.getClassName;\r\n    let style = border.getTabHeaderRect().styleWithPosition({});\r\n    const tabs = [];\r\n    const layoutTab = (i) => {\r\n        let isSelected = border.getSelected() === i;\r\n        let child = border.getChildren()[i];\r\n        tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderButton__WEBPACK_IMPORTED_MODULE_2__.BorderButton, { layout: layout, border: border.getLocation().getName(), node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected, iconFactory: iconFactory, titleFactory: titleFactory, icons: icons }));\r\n        if (i < border.getChildren().length - 1) {\r\n            tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TAB_DIVIDER) }));\r\n        }\r\n    };\r\n    for (let i = 0; i < border.getChildren().length; i++) {\r\n        layoutTab(i);\r\n    }\r\n    let borderClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_ + border.getLocation().getName());\r\n    if (border.getClassName() !== undefined) {\r\n        borderClasses += \" \" + border.getClassName();\r\n    }\r\n    // allow customization of tabset right/bottom buttons\r\n    let buttons = [];\r\n    const renderState = { headerContent: undefined, buttons, stickyButtons: [], headerButtons: [] };\r\n    layout.customizeTabSet(border, renderState);\r\n    buttons = renderState.buttons;\r\n    let toolbar;\r\n    if (hiddenTabs.length > 0) {\r\n        const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Overflow_Menu_Tooltip);\r\n        let overflowContent;\r\n        if (typeof icons.more === \"function\") {\r\n            overflowContent = icons.more(border, hiddenTabs);\r\n        }\r\n        else {\r\n            overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n                icons.more,\r\n                react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\r\n        }\r\n        buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"overflowbutton\", ref: overflowbuttonRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_ + border.getLocation().getName()), title: overflowTitle, onClick: onOverflowClick, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, overflowContent));\r\n    }\r\n    const selectedIndex = border.getSelected();\r\n    if (selectedIndex !== -1) {\r\n        const selectedTabNode = border.getChildren()[selectedIndex];\r\n        if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnableFloat() && !selectedTabNode.isFloating()) {\r\n            const floatTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Float_Tab);\r\n            buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"float\", title: floatTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT), onClick: onFloatTab, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\r\n        }\r\n    }\r\n    toolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_ + border.getLocation().getName()) }, buttons));\r\n    style = layout.styleFont(style);\r\n    let innerStyle = {};\r\n    const borderHeight = border.getBorderBarSize() - 1;\r\n    if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.LEFT) {\r\n        innerStyle = { right: borderHeight, height: borderHeight, top: position };\r\n    }\r\n    else if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.RIGHT) {\r\n        innerStyle = { left: borderHeight, height: borderHeight, top: position };\r\n    }\r\n    else {\r\n        innerStyle = { height: borderHeight, left: position };\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, dir: \"ltr\", style: style, className: borderClasses, \"data-layout-path\": path, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onWheel: onMouseWheel },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { height: borderHeight }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_ + border.getLocation().getName()) },\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: innerStyle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_ + border.getLocation().getName()) }, tabs)),\r\n        toolbar));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderTabSet.tsx?");
 
 /***/ }),
 
@@ -454,9 +354,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!************************************!*\
   !*** ./src/view/ErrorBoundary.tsx ***!
   \************************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        if (typeof b !== \"function\" && b !== null)\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.ErrorBoundary = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/** @internal */\nvar ErrorBoundary = /** @class */ (function (_super) {\n    __extends(ErrorBoundary, _super);\n    function ErrorBoundary(props) {\n        var _this = _super.call(this, props) || this;\n        _this.state = { hasError: false };\n        return _this;\n    }\n    ErrorBoundary.getDerivedStateFromError = function (error) {\n        return { hasError: true };\n    };\n    ErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {\n        console.debug(error);\n        console.debug(errorInfo);\n    };\n    ErrorBoundary.prototype.render = function () {\n        if (this.state.hasError) {\n            return (React.createElement(\"div\", { className: Types_1.CLASSES.FLEXLAYOUT__ERROR_BOUNDARY_CONTAINER },\n                React.createElement(\"div\", { className: Types_1.CLASSES.FLEXLAYOUT__ERROR_BOUNDARY_CONTENT }, this.props.message)));\n        }\n        return this.props.children;\n    };\n    return ErrorBoundary;\n}(React.Component));\nexports.ErrorBoundary = ErrorBoundary;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/ErrorBoundary.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"ErrorBoundary\": () => (/* binding */ ErrorBoundary)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n\r\n\r\n/** @internal */\r\nclass ErrorBoundary extends react__WEBPACK_IMPORTED_MODULE_0__.Component {\r\n    constructor(props) {\r\n        super(props);\r\n        this.state = { hasError: false };\r\n    }\r\n    static getDerivedStateFromError(error) {\r\n        return { hasError: true };\r\n    }\r\n    componentDidCatch(error, errorInfo) {\r\n        console.debug(error);\r\n        console.debug(errorInfo);\r\n    }\r\n    render() {\r\n        if (this.state.hasError) {\r\n            return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: _Types__WEBPACK_IMPORTED_MODULE_1__.CLASSES.FLEXLAYOUT__ERROR_BOUNDARY_CONTAINER },\r\n                react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: _Types__WEBPACK_IMPORTED_MODULE_1__.CLASSES.FLEXLAYOUT__ERROR_BOUNDARY_CONTENT }, this.props.message)));\r\n        }\r\n        return this.props.children;\r\n    }\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/ErrorBoundary.tsx?");
 
 /***/ }),
 
@@ -464,9 +364,9 @@ eval("\nvar __extends = (this && this.__extends) || (function () {\n    var exte
 /*!*************************************!*\
   !*** ./src/view/FloatingWindow.tsx ***!
   \*************************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n        if (ar || !(i in from)) {\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n            ar[i] = from[i];\n        }\n    }\n    return to.concat(ar || Array.prototype.slice.call(from));\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.FloatingWindow = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar react_dom_1 = __webpack_require__(/*! react-dom */ \"react-dom\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/** @internal */\nvar FloatingWindow = function (props) {\n    var title = props.title, id = props.id, url = props.url, rect = props.rect, onCloseWindow = props.onCloseWindow, onSetWindow = props.onSetWindow, children = props.children;\n    var popoutWindow = React.useRef(null);\n    var _a = React.useState(undefined), content = _a[0], setContent = _a[1];\n    React.useLayoutEffect(function () {\n        var r = rect;\n        // Make a local copy of the styles from the current window which will be passed into\n        // the floating window. window.document.styleSheets is mutable and we can't guarantee\n        // the styles will exist when 'popoutWindow.load' is called below.\n        var styles = Array.from(window.document.styleSheets).reduce(function (result, styleSheet) {\n            var rules = undefined;\n            try {\n                rules = styleSheet.cssRules;\n            }\n            catch (e) {\n                // styleSheet.cssRules can throw security exception\n            }\n            try {\n                return __spreadArray(__spreadArray([], result, true), [\n                    {\n                        href: styleSheet.href,\n                        type: styleSheet.type,\n                        rules: rules ? Array.from(rules).map(function (rule) { return rule.cssText; }) : null,\n                    }\n                ], false);\n            }\n            catch (e) {\n                return result;\n            }\n        }, []);\n        popoutWindow.current = window.open(url, id, \"left=\".concat(r.x, \",top=\").concat(r.y, \",width=\").concat(r.width, \",height=\").concat(r.height));\n        if (popoutWindow.current !== null) {\n            onSetWindow(id, popoutWindow.current);\n            // listen for parent unloading to remove all popouts\n            window.addEventListener(\"beforeunload\", function () {\n                if (popoutWindow.current) {\n                    popoutWindow.current.close();\n                    popoutWindow.current = null;\n                }\n            });\n            popoutWindow.current.addEventListener(\"load\", function () {\n                var popoutDocument = popoutWindow.current.document;\n                popoutDocument.title = title;\n                var popoutContent = popoutDocument.createElement(\"div\");\n                popoutContent.className = Types_1.CLASSES.FLEXLAYOUT__FLOATING_WINDOW_CONTENT;\n                popoutDocument.body.appendChild(popoutContent);\n                copyStyles(popoutDocument, styles).then(function () {\n                    setContent(popoutContent);\n                });\n                // listen for popout unloading (needs to be after load for safari)\n                popoutWindow.current.addEventListener(\"beforeunload\", function () {\n                    onCloseWindow(id);\n                });\n            });\n        }\n        else {\n            console.warn(\"Unable to open window \".concat(url));\n            onCloseWindow(id);\n        }\n        return function () {\n            // delay so refresh will close window\n            setTimeout(function () {\n                if (popoutWindow.current) {\n                    popoutWindow.current.close();\n                    popoutWindow.current = null;\n                }\n            }, 0);\n        };\n    }, []);\n    if (content !== undefined) {\n        return (0, react_dom_1.createPortal)(children, content);\n    }\n    else {\n        return null;\n    }\n};\nexports.FloatingWindow = FloatingWindow;\n/** @internal */\nfunction copyStyles(doc, styleSheets) {\n    var head = doc.head;\n    var promises = [];\n    var _loop_1 = function (styleSheet) {\n        if (styleSheet.href) {\n            // prefer links since they will keep paths to images etc\n            var styleElement_1 = doc.createElement(\"link\");\n            styleElement_1.type = styleSheet.type;\n            styleElement_1.rel = \"stylesheet\";\n            styleElement_1.href = styleSheet.href;\n            head.appendChild(styleElement_1);\n            promises.push(new Promise(function (resolve, reject) {\n                styleElement_1.onload = function () { return resolve(true); };\n            }));\n        }\n        else {\n            if (styleSheet.rules) {\n                var style = doc.createElement(\"style\");\n                for (var _a = 0, _b = styleSheet.rules; _a < _b.length; _a++) {\n                    var rule = _b[_a];\n                    style.appendChild(doc.createTextNode(rule));\n                }\n                head.appendChild(style);\n            }\n        }\n    };\n    for (var _i = 0, styleSheets_1 = styleSheets; _i < styleSheets_1.length; _i++) {\n        var styleSheet = styleSheets_1[_i];\n        _loop_1(styleSheet);\n    }\n    return Promise.all(promises);\n}\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/FloatingWindow.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"FloatingWindow\": () => (/* binding */ FloatingWindow)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n\r\n\r\n\r\n/** @internal */\r\nconst FloatingWindow = (props) => {\r\n    const { title, id, url, rect, onCloseWindow, onSetWindow, children } = props;\r\n    const popoutWindow = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const timerId = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const [content, setContent] = react__WEBPACK_IMPORTED_MODULE_0__.useState(undefined);\r\n    react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\r\n        if (timerId.current) {\r\n            clearTimeout(timerId.current);\r\n        }\r\n        const r = rect;\r\n        // Make a local copy of the styles from the current window which will be passed into\r\n        // the floating window. window.document.styleSheets is mutable and we can't guarantee\r\n        // the styles will exist when 'popoutWindow.load' is called below.\r\n        const styles = Array.from(window.document.styleSheets).reduce((result, styleSheet) => {\r\n            let rules = undefined;\r\n            try {\r\n                rules = styleSheet.cssRules;\r\n            }\r\n            catch (e) {\r\n                // styleSheet.cssRules can throw security exception\r\n            }\r\n            try {\r\n                return [\r\n                    ...result,\r\n                    {\r\n                        href: styleSheet.href,\r\n                        type: styleSheet.type,\r\n                        rules: rules ? Array.from(rules).map(rule => rule.cssText) : null,\r\n                    }\r\n                ];\r\n            }\r\n            catch (e) {\r\n                return result;\r\n            }\r\n        }, []);\r\n        popoutWindow.current = window.open(url, id, `left=${r.x},top=${r.y},width=${r.width},height=${r.height}`);\r\n        if (popoutWindow.current !== null) {\r\n            onSetWindow(id, popoutWindow.current);\r\n            // listen for parent unloading to remove all popouts\r\n            window.addEventListener(\"beforeunload\", () => {\r\n                if (popoutWindow.current) {\r\n                    popoutWindow.current.close();\r\n                    popoutWindow.current = null;\r\n                }\r\n            });\r\n            popoutWindow.current.addEventListener(\"load\", () => {\r\n                const popoutDocument = popoutWindow.current.document;\r\n                popoutDocument.title = title;\r\n                const popoutContent = popoutDocument.createElement(\"div\");\r\n                popoutContent.className = _Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__FLOATING_WINDOW_CONTENT;\r\n                popoutDocument.body.appendChild(popoutContent);\r\n                copyStyles(popoutDocument, styles).then(() => {\r\n                    setContent(popoutContent);\r\n                });\r\n                // listen for popout unloading (needs to be after load for safari)\r\n                popoutWindow.current.addEventListener(\"beforeunload\", () => {\r\n                    onCloseWindow(id);\r\n                });\r\n            });\r\n        }\r\n        else {\r\n            console.warn(`Unable to open window ${url}`);\r\n            onCloseWindow(id);\r\n        }\r\n        return () => {\r\n            // delay so refresh will close window\r\n            timerId.current = setTimeout(() => {\r\n                if (popoutWindow.current) {\r\n                    popoutWindow.current.close();\r\n                    popoutWindow.current = null;\r\n                }\r\n            }, 0);\r\n        };\r\n    }, []);\r\n    if (content !== undefined) {\r\n        return (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(children, content);\r\n    }\r\n    else {\r\n        return null;\r\n    }\r\n};\r\n/** @internal */\r\nfunction copyStyles(doc, styleSheets) {\r\n    const head = doc.head;\r\n    const promises = [];\r\n    for (const styleSheet of styleSheets) {\r\n        if (styleSheet.href) {\r\n            // prefer links since they will keep paths to images etc\r\n            const styleElement = doc.createElement(\"link\");\r\n            styleElement.type = styleSheet.type;\r\n            styleElement.rel = \"stylesheet\";\r\n            styleElement.href = styleSheet.href;\r\n            head.appendChild(styleElement);\r\n            promises.push(new Promise((resolve, reject) => {\r\n                styleElement.onload = () => resolve(true);\r\n            }));\r\n        }\r\n        else {\r\n            if (styleSheet.rules) {\r\n                const style = doc.createElement(\"style\");\r\n                for (const rule of styleSheet.rules) {\r\n                    style.appendChild(doc.createTextNode(rule));\r\n                }\r\n                head.appendChild(style);\r\n            }\r\n        }\r\n    }\r\n    return Promise.all(promises);\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/FloatingWindow.tsx?");
 
 /***/ }),
 
@@ -474,9 +374,9 @@ eval("\nvar __spreadArray = (this && this.__spreadArray) || function (to, from,
 /*!****************************************!*\
   !*** ./src/view/FloatingWindowTab.tsx ***!
   \****************************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.FloatingWindowTab = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar ErrorBoundary_1 = __webpack_require__(/*! ./ErrorBoundary */ \"./src/view/ErrorBoundary.tsx\");\nvar I18nLabel_1 = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\nvar react_1 = __webpack_require__(/*! react */ \"react\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/** @internal */\nvar FloatingWindowTab = function (props) {\n    var layout = props.layout, node = props.node, factory = props.factory;\n    var cm = layout.getClassName;\n    var child = factory(node);\n    return (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__FLOATING_WINDOW_TAB) },\n        React.createElement(ErrorBoundary_1.ErrorBoundary, { message: props.layout.i18nName(I18nLabel_1.I18nLabel.Error_rendering_component) },\n            React.createElement(react_1.Fragment, null, child))));\n};\nexports.FloatingWindowTab = FloatingWindowTab;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/FloatingWindowTab.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"FloatingWindowTab\": () => (/* binding */ FloatingWindowTab)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _ErrorBoundary__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ErrorBoundary */ \"./src/view/ErrorBoundary.tsx\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst FloatingWindowTab = (props) => {\r\n    const { layout, node, factory } = props;\r\n    const cm = layout.getClassName;\r\n    const child = factory(node);\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_3__.CLASSES.FLEXLAYOUT__FLOATING_WINDOW_TAB) },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(_ErrorBoundary__WEBPACK_IMPORTED_MODULE_1__.ErrorBoundary, { message: props.layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_2__.I18nLabel.Error_rendering_component) },\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, child))));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/FloatingWindowTab.tsx?");
 
 /***/ }),
 
@@ -484,9 +384,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!****************************!*\
   !*** ./src/view/Icons.tsx ***!
   \****************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.RestoreIcon = exports.PopoutIcon = exports.OverflowIcon = exports.MaximizeIcon = exports.CloseIcon = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar style = { width: \"1em\", height: \"1em\", display: \"flex\", alignItems: \"center\" };\nvar CloseIcon = function () {\n    return (React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 24 24\" },\n        React.createElement(\"path\", { fill: \"none\", d: \"M0 0h24v24H0z\" }),\n        React.createElement(\"path\", { stroke: \"var(--color-icon)\", fill: \"var(--color-icon)\", d: \"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\" })));\n};\nexports.CloseIcon = CloseIcon;\nvar MaximizeIcon = function () {\n    return (React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 24 24\", fill: \"var(--color-icon)\" },\n        React.createElement(\"path\", { d: \"M0 0h24v24H0z\", fill: \"none\" }),\n        React.createElement(\"path\", { stroke: \"var(--color-icon)\", d: \"M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z\" })));\n};\nexports.MaximizeIcon = MaximizeIcon;\nvar OverflowIcon = function () {\n    return (React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 24 24\", fill: \"var(--color-icon)\" },\n        React.createElement(\"path\", { d: \"M0 0h24v24H0z\", fill: \"none\" }),\n        React.createElement(\"path\", { stroke: \"var(--color-icon)\", d: \"M7 10l5 5 5-5z\" })));\n};\nexports.OverflowIcon = OverflowIcon;\nvar PopoutIcon = function () {\n    return (\n    // <svg xmlns=\"http://www.w3.org/2000/svg\"  style={style}  viewBox=\"0 0 24 24\" fill=\"var(--color-icon)\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path stroke=\"var(--color-icon)\" d=\"M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5z\"/></svg>\n    // <svg xmlns=\"http://www.w3.org/2000/svg\" style={style} fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"var(--color-icon)\" stroke-width=\"2\">\n    //     <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14\" />\n    // </svg>\n    React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 20 20\", fill: \"var(--color-icon)\" },\n        React.createElement(\"path\", { d: \"M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z\" }),\n        React.createElement(\"path\", { d: \"M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z\" })));\n};\nexports.PopoutIcon = PopoutIcon;\nvar RestoreIcon = function () {\n    return (React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 24 24\", fill: \"var(--color-icon)\" },\n        React.createElement(\"path\", { d: \"M0 0h24v24H0z\", fill: \"none\" }),\n        React.createElement(\"path\", { stroke: \"var(--color-icon)\", d: \"M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z\" })));\n};\nexports.RestoreIcon = RestoreIcon;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Icons.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"CloseIcon\": () => (/* binding */ CloseIcon),\n/* harmony export */   \"MaximizeIcon\": () => (/* binding */ MaximizeIcon),\n/* harmony export */   \"OverflowIcon\": () => (/* binding */ OverflowIcon),\n/* harmony export */   \"PopoutIcon\": () => (/* binding */ PopoutIcon),\n/* harmony export */   \"RestoreIcon\": () => (/* binding */ RestoreIcon)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\r\nconst style = { width: \"1em\", height: \"1em\", display: \"flex\", alignItems: \"center\" };\r\nconst CloseIcon = () => {\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 24 24\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { fill: \"none\", d: \"M0 0h24v24H0z\" }),\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { stroke: \"var(--color-icon)\", fill: \"var(--color-icon)\", d: \"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\" })));\r\n};\r\nconst MaximizeIcon = () => {\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 24 24\", fill: \"var(--color-icon)\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { d: \"M0 0h24v24H0z\", fill: \"none\" }),\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { stroke: \"var(--color-icon)\", d: \"M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z\" })));\r\n};\r\nconst OverflowIcon = () => {\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 24 24\", fill: \"var(--color-icon)\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { d: \"M0 0h24v24H0z\", fill: \"none\" }),\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { stroke: \"var(--color-icon)\", d: \"M7 10l5 5 5-5z\" })));\r\n};\r\nconst PopoutIcon = () => {\r\n    return (\r\n    // <svg xmlns=\"http://www.w3.org/2000/svg\"  style={style}  viewBox=\"0 0 24 24\" fill=\"var(--color-icon)\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path stroke=\"var(--color-icon)\" d=\"M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5z\"/></svg>\r\n    // <svg xmlns=\"http://www.w3.org/2000/svg\" style={style} fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"var(--color-icon)\" stroke-width=\"2\">\r\n    //     <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14\" />\r\n    // </svg>\r\n    react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 20 20\", fill: \"var(--color-icon)\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { d: \"M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z\" }),\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { d: \"M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z\" })));\r\n};\r\nconst RestoreIcon = () => {\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", style: style, viewBox: \"0 0 24 24\", fill: \"var(--color-icon)\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { d: \"M0 0h24v24H0z\", fill: \"none\" }),\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"path\", { stroke: \"var(--color-icon)\", d: \"M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z\" })));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Icons.tsx?");
 
 /***/ }),
 
@@ -494,9 +394,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*****************************!*\
   !*** ./src/view/Layout.tsx ***!
   \*****************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        if (typeof b !== \"function\" && b !== null)\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nvar __assign = (this && this.__assign) || function () {\n    __assign = Object.assign || function(t) {\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\n            s = arguments[i];\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\n                t[p] = s[p];\n        }\n        return t;\n    };\n    return __assign.apply(this, arguments);\n};\nvar __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n        if (ar || !(i in from)) {\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n            ar[i] = from[i];\n        }\n    }\n    return to.concat(ar || Array.prototype.slice.call(from));\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Layout = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar react_dom_1 = __webpack_require__(/*! react-dom */ \"react-dom\");\nvar DockLocation_1 = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\nvar DragDrop_1 = __webpack_require__(/*! ../DragDrop */ \"./src/DragDrop.ts\");\nvar Actions_1 = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\nvar BorderNode_1 = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\nvar SplitterNode_1 = __webpack_require__(/*! ../model/SplitterNode */ \"./src/model/SplitterNode.ts\");\nvar TabNode_1 = __webpack_require__(/*! ../model/TabNode */ \"./src/model/TabNode.ts\");\nvar TabSetNode_1 = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar BorderTabSet_1 = __webpack_require__(/*! ./BorderTabSet */ \"./src/view/BorderTabSet.tsx\");\nvar Splitter_1 = __webpack_require__(/*! ./Splitter */ \"./src/view/Splitter.tsx\");\nvar Tab_1 = __webpack_require__(/*! ./Tab */ \"./src/view/Tab.tsx\");\nvar TabSet_1 = __webpack_require__(/*! ./TabSet */ \"./src/view/TabSet.tsx\");\nvar FloatingWindow_1 = __webpack_require__(/*! ./FloatingWindow */ \"./src/view/FloatingWindow.tsx\");\nvar FloatingWindowTab_1 = __webpack_require__(/*! ./FloatingWindowTab */ \"./src/view/FloatingWindowTab.tsx\");\nvar TabFloating_1 = __webpack_require__(/*! ./TabFloating */ \"./src/view/TabFloating.tsx\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Icons_1 = __webpack_require__(/*! ./Icons */ \"./src/view/Icons.tsx\");\nvar TabButtonStamp_1 = __webpack_require__(/*! ./TabButtonStamp */ \"./src/view/TabButtonStamp.tsx\");\nvar defaultIcons = {\n    close: React.createElement(Icons_1.CloseIcon, null),\n    closeTabset: React.createElement(Icons_1.CloseIcon, null),\n    popout: React.createElement(Icons_1.PopoutIcon, null),\n    maximize: React.createElement(Icons_1.MaximizeIcon, null),\n    restore: React.createElement(Icons_1.RestoreIcon, null),\n    more: React.createElement(Icons_1.OverflowIcon, null),\n};\n// Popout windows work in latest browsers based on webkit (Chrome, Opera, Safari, latest Edge) and Firefox. They do\n// not work on any version if IE or the original Edge browser\n// Assume any recent desktop browser not IE or original Edge will work\n/** @internal */\n// @ts-ignore\nvar isIEorEdge = typeof window !== \"undefined\" && (window.document.documentMode || /Edge\\//.test(window.navigator.userAgent));\n/** @internal */\nvar isDesktop = typeof window !== \"undefined\" && window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches;\n/** @internal */\nvar defaultSupportsPopout = isDesktop && !isIEorEdge;\n/**\n * A React component that hosts a multi-tabbed layout\n */\nvar Layout = /** @class */ (function (_super) {\n    __extends(Layout, _super);\n    function Layout(props) {\n        var _this = _super.call(this, props) || this;\n        /** @internal */\n        _this.firstMove = false;\n        /** @internal */\n        _this.dragRectRendered = true;\n        /** @internal */\n        _this.dragDivText = undefined;\n        /** @internal */\n        _this.edgeRectLength = 100;\n        /** @internal */\n        _this.edgeRectWidth = 10;\n        /** @internal */\n        _this.onModelChange = function () {\n            _this.forceUpdate();\n            if (_this.props.onModelChange) {\n                _this.props.onModelChange(_this.props.model);\n            }\n        };\n        /** @internal */\n        _this.updateRect = function (domRect) {\n            if (domRect === void 0) { domRect = _this.getDomRect(); }\n            var rect = new Rect_1.Rect(0, 0, domRect.width, domRect.height);\n            if (!rect.equals(_this.state.rect) && rect.width !== 0 && rect.height !== 0) {\n                _this.setState({ rect: rect });\n            }\n        };\n        /** @internal */\n        _this.updateLayoutMetrics = function () {\n            if (_this.findHeaderBarSizeRef.current) {\n                var headerBarSize = _this.findHeaderBarSizeRef.current.getBoundingClientRect().height;\n                if (headerBarSize !== _this.state.calculatedHeaderBarSize) {\n                    _this.setState({ calculatedHeaderBarSize: headerBarSize });\n                }\n            }\n            if (_this.findTabBarSizeRef.current) {\n                var tabBarSize = _this.findTabBarSizeRef.current.getBoundingClientRect().height;\n                if (tabBarSize !== _this.state.calculatedTabBarSize) {\n                    _this.setState({ calculatedTabBarSize: tabBarSize });\n                }\n            }\n            if (_this.findBorderBarSizeRef.current) {\n                var borderBarSize = _this.findBorderBarSizeRef.current.getBoundingClientRect().height;\n                if (borderBarSize !== _this.state.calculatedBorderBarSize) {\n                    _this.setState({ calculatedBorderBarSize: borderBarSize });\n                }\n            }\n        };\n        /** @internal */\n        _this.getClassName = function (defaultClassName) {\n            if (_this.props.classNameMapper === undefined) {\n                return defaultClassName;\n            }\n            else {\n                return _this.props.classNameMapper(defaultClassName);\n            }\n        };\n        /** @internal */\n        _this.onCloseWindow = function (id) {\n            _this.doAction(Actions_1.Actions.unFloatTab(id));\n            try {\n                _this.props.model.getNodeById(id)._setWindow(undefined);\n            }\n            catch (e) {\n                // catch incase it was a model change\n            }\n        };\n        /** @internal */\n        _this.onSetWindow = function (id, window) {\n            _this.props.model.getNodeById(id)._setWindow(window);\n        };\n        /** @internal */\n        _this.onCancelAdd = function () {\n            var _a, _b;\n            var rootdiv = _this.selfRef.current;\n            rootdiv.removeChild(_this.dragDiv);\n            _this.dragDiv = undefined;\n            _this.hidePortal();\n            if (_this.fnNewNodeDropped != null) {\n                _this.fnNewNodeDropped();\n                _this.fnNewNodeDropped = undefined;\n            }\n            try {\n                (_b = (_a = _this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated) === null || _b === void 0 ? void 0 : _b.call(_a);\n            }\n            catch (e) {\n                console.error(e);\n            }\n            DragDrop_1.DragDrop.instance.hideGlass();\n            _this.newTabJson = undefined;\n            _this.customDrop = undefined;\n        };\n        /** @internal */\n        _this.onCancelDrag = function (wasDragging) {\n            var _a, _b;\n            if (wasDragging) {\n                var rootdiv = _this.selfRef.current;\n                try {\n                    rootdiv.removeChild(_this.outlineDiv);\n                }\n                catch (e) { }\n                try {\n                    rootdiv.removeChild(_this.dragDiv);\n                }\n                catch (e) { }\n                _this.dragDiv = undefined;\n                _this.hidePortal();\n                _this.setState({ showEdges: false });\n                if (_this.fnNewNodeDropped != null) {\n                    _this.fnNewNodeDropped();\n                    _this.fnNewNodeDropped = undefined;\n                }\n                try {\n                    (_b = (_a = _this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated) === null || _b === void 0 ? void 0 : _b.call(_a);\n                }\n                catch (e) {\n                    console.error(e);\n                }\n                DragDrop_1.DragDrop.instance.hideGlass();\n                _this.newTabJson = undefined;\n                _this.customDrop = undefined;\n            }\n            _this.setState({ showHiddenBorder: DockLocation_1.DockLocation.CENTER });\n        };\n        /** @internal */\n        _this.onDragDivMouseDown = function (event) {\n            event.preventDefault();\n            _this.dragStart(event, _this.dragDivText, TabNode_1.TabNode._fromJson(_this.newTabJson, _this.props.model, false), true, undefined, undefined);\n        };\n        /** @internal */\n        _this.dragStart = function (event, dragDivText, node, allowDrag, onClick, onDoubleClick) {\n            if (!allowDrag) {\n                DragDrop_1.DragDrop.instance.startDrag(event, undefined, undefined, undefined, undefined, onClick, onDoubleClick, _this.currentDocument, _this.selfRef.current);\n            }\n            else {\n                _this.dragNode = node;\n                _this.dragDivText = dragDivText;\n                DragDrop_1.DragDrop.instance.startDrag(event, _this.onDragStart, _this.onDragMove, _this.onDragEnd, _this.onCancelDrag, onClick, onDoubleClick, _this.currentDocument, _this.selfRef.current);\n            }\n        };\n        /** @internal */\n        _this.dragRectRender = function (text, node, json, onRendered) {\n            var content;\n            if (text !== undefined) {\n                content = React.createElement(\"div\", { style: { whiteSpace: \"pre\" } }, text.replace(\"<br>\", \"\\n\"));\n            }\n            else {\n                if (node && node instanceof TabNode_1.TabNode) {\n                    content = (React.createElement(TabButtonStamp_1.TabButtonStamp, { node: node, layout: _this, iconFactory: _this.props.iconFactory, titleFactory: _this.props.titleFactory }));\n                }\n            }\n            if (_this.props.onRenderDragRect !== undefined) {\n                var customContent = _this.props.onRenderDragRect(content, node, json);\n                if (customContent !== undefined) {\n                    content = customContent;\n                }\n            }\n            // hide div until the render is complete\n            _this.dragDiv.style.visibility = \"hidden\";\n            _this.dragRectRendered = false;\n            _this.showPortal(React.createElement(DragRectRenderWrapper\n            // wait for it to be rendered\n            , { \n                // wait for it to be rendered\n                onRendered: function () {\n                    _this.dragRectRendered = true;\n                    onRendered === null || onRendered === void 0 ? void 0 : onRendered();\n                } }, content), _this.dragDiv);\n        };\n        /** @internal */\n        _this.showPortal = function (control, element) {\n            var portal = (0, react_dom_1.createPortal)(control, element);\n            _this.setState({ portal: portal });\n        };\n        /** @internal */\n        _this.hidePortal = function () {\n            _this.setState({ portal: undefined });\n        };\n        /** @internal */\n        _this.onDragStart = function () {\n            _this.dropInfo = undefined;\n            _this.customDrop = undefined;\n            var rootdiv = _this.selfRef.current;\n            _this.outlineDiv = _this.currentDocument.createElement(\"div\");\n            _this.outlineDiv.className = _this.getClassName(Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n            _this.outlineDiv.style.visibility = \"hidden\";\n            rootdiv.appendChild(_this.outlineDiv);\n            if (_this.dragDiv == null) {\n                _this.dragDiv = _this.currentDocument.createElement(\"div\");\n                _this.dragDiv.className = _this.getClassName(Types_1.CLASSES.FLEXLAYOUT__DRAG_RECT);\n                _this.dragDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\n                _this.dragRectRender(_this.dragDivText, _this.dragNode, _this.newTabJson);\n                rootdiv.appendChild(_this.dragDiv);\n            }\n            // add edge indicators\n            if (_this.props.model.getMaximizedTabset() === undefined) {\n                _this.setState({ showEdges: true });\n            }\n            if (_this.dragNode !== undefined && _this.dragNode instanceof TabNode_1.TabNode && _this.dragNode.getTabRect() !== undefined) {\n                _this.dragNode.getTabRect().positionElement(_this.outlineDiv);\n            }\n            _this.firstMove = true;\n            return true;\n        };\n        /** @internal */\n        _this.onDragMove = function (event) {\n            if (_this.firstMove === false) {\n                var speed = _this.props.model._getAttribute(\"tabDragSpeed\");\n                _this.outlineDiv.style.transition = \"top \".concat(speed, \"s, left \").concat(speed, \"s, width \").concat(speed, \"s, height \").concat(speed, \"s\");\n            }\n            _this.firstMove = false;\n            var clientRect = _this.selfRef.current.getBoundingClientRect();\n            var pos = {\n                x: event.clientX - clientRect.left,\n                y: event.clientY - clientRect.top,\n            };\n            _this.checkForBorderToShow(pos.x, pos.y);\n            // keep it between left & right\n            var dragRect = _this.dragDiv.getBoundingClientRect();\n            var newLeft = pos.x - dragRect.width / 2;\n            if (newLeft + dragRect.width > clientRect.width) {\n                newLeft = clientRect.width - dragRect.width;\n            }\n            newLeft = Math.max(0, newLeft);\n            _this.dragDiv.style.left = newLeft + \"px\";\n            _this.dragDiv.style.top = pos.y + 5 + \"px\";\n            if (_this.dragRectRendered && _this.dragDiv.style.visibility === \"hidden\") {\n                // make visible once the drag rect has been rendered\n                _this.dragDiv.style.visibility = \"visible\";\n            }\n            var dropInfo = _this.props.model._findDropTargetNode(_this.dragNode, pos.x, pos.y);\n            if (dropInfo) {\n                if (_this.props.onTabDrag) {\n                    _this.handleCustomTabDrag(dropInfo, pos, event);\n                }\n                else {\n                    _this.dropInfo = dropInfo;\n                    _this.outlineDiv.className = _this.getClassName(dropInfo.className);\n                    dropInfo.rect.positionElement(_this.outlineDiv);\n                    _this.outlineDiv.style.visibility = \"visible\";\n                }\n            }\n        };\n        /** @internal */\n        _this.onDragEnd = function (event) {\n            var rootdiv = _this.selfRef.current;\n            rootdiv.removeChild(_this.outlineDiv);\n            rootdiv.removeChild(_this.dragDiv);\n            _this.dragDiv = undefined;\n            _this.hidePortal();\n            _this.setState({ showEdges: false });\n            DragDrop_1.DragDrop.instance.hideGlass();\n            if (_this.dropInfo) {\n                if (_this.customDrop) {\n                    _this.newTabJson = undefined;\n                    try {\n                        var _a = _this.customDrop, callback = _a.callback, dragging = _a.dragging, over = _a.over, x = _a.x, y = _a.y, location_1 = _a.location;\n                        callback(dragging, over, x, y, location_1);\n                        if (_this.fnNewNodeDropped != null) {\n                            _this.fnNewNodeDropped();\n                            _this.fnNewNodeDropped = undefined;\n                        }\n                    }\n                    catch (e) {\n                        console.error(e);\n                    }\n                }\n                else if (_this.newTabJson !== undefined) {\n                    var newNode = _this.doAction(Actions_1.Actions.addNode(_this.newTabJson, _this.dropInfo.node.getId(), _this.dropInfo.location, _this.dropInfo.index));\n                    if (_this.fnNewNodeDropped != null) {\n                        _this.fnNewNodeDropped(newNode, event);\n                        _this.fnNewNodeDropped = undefined;\n                    }\n                    _this.newTabJson = undefined;\n                }\n                else if (_this.dragNode !== undefined) {\n                    _this.doAction(Actions_1.Actions.moveNode(_this.dragNode.getId(), _this.dropInfo.node.getId(), _this.dropInfo.location, _this.dropInfo.index));\n                }\n            }\n            _this.setState({ showHiddenBorder: DockLocation_1.DockLocation.CENTER });\n        };\n        _this.props.model._setChangeListener(_this.onModelChange);\n        _this.tabIds = [];\n        _this.selfRef = React.createRef();\n        _this.findHeaderBarSizeRef = React.createRef();\n        _this.findTabBarSizeRef = React.createRef();\n        _this.findBorderBarSizeRef = React.createRef();\n        _this.supportsPopout = props.supportsPopout !== undefined ? props.supportsPopout : defaultSupportsPopout;\n        _this.popoutURL = props.popoutURL ? props.popoutURL : \"popout.html\";\n        _this.icons = __assign(__assign({}, defaultIcons), props.icons);\n        _this.firstRender = true;\n        _this.state = {\n            rect: new Rect_1.Rect(0, 0, 0, 0),\n            calculatedHeaderBarSize: 25,\n            calculatedTabBarSize: 26,\n            calculatedBorderBarSize: 30,\n            editingTab: undefined,\n            showHiddenBorder: DockLocation_1.DockLocation.CENTER,\n            showEdges: false,\n        };\n        _this.onDragEnter = _this.onDragEnter.bind(_this);\n        return _this;\n    }\n    /** @internal */\n    Layout.prototype.styleFont = function (style) {\n        if (this.props.font) {\n            if (this.selfRef.current) {\n                if (this.props.font.size) {\n                    this.selfRef.current.style.setProperty(\"--font-size\", this.props.font.size);\n                }\n                if (this.props.font.family) {\n                    this.selfRef.current.style.setProperty(\"--font-family\", this.props.font.family);\n                }\n            }\n            if (this.props.font.style) {\n                style.fontStyle = this.props.font.style;\n            }\n            if (this.props.font.weight) {\n                style.fontWeight = this.props.font.weight;\n            }\n        }\n        return style;\n    };\n    /** @internal */\n    Layout.prototype.doAction = function (action) {\n        if (this.props.onAction !== undefined) {\n            var outcome = this.props.onAction(action);\n            if (outcome !== undefined) {\n                return this.props.model.doAction(outcome);\n            }\n            return undefined;\n        }\n        else {\n            return this.props.model.doAction(action);\n        }\n    };\n    /** @internal */\n    Layout.prototype.componentDidMount = function () {\n        var _this = this;\n        this.updateRect();\n        this.updateLayoutMetrics();\n        // need to re-render if size changes\n        this.currentDocument = this.selfRef.current.ownerDocument;\n        this.currentWindow = this.currentDocument.defaultView;\n        this.resizeObserver = new ResizeObserver(function (entries) {\n            _this.updateRect(entries[0].contentRect);\n        });\n        this.resizeObserver.observe(this.selfRef.current);\n    };\n    /** @internal */\n    Layout.prototype.componentDidUpdate = function () {\n        this.updateLayoutMetrics();\n        if (this.props.model !== this.previousModel) {\n            if (this.previousModel !== undefined) {\n                this.previousModel._setChangeListener(undefined); // stop listening to old model\n            }\n            this.props.model._setChangeListener(this.onModelChange);\n            this.previousModel = this.props.model;\n        }\n        // console.log(\"Layout time: \" + this.layoutTime + \"ms Render time: \" + (Date.now() - this.start) + \"ms\");\n    };\n    /** @internal */\n    Layout.prototype.getCurrentDocument = function () {\n        return this.currentDocument;\n    };\n    /** @internal */\n    Layout.prototype.getDomRect = function () {\n        return this.selfRef.current.getBoundingClientRect();\n    };\n    /** @internal */\n    Layout.prototype.getRootDiv = function () {\n        return this.selfRef.current;\n    };\n    /** @internal */\n    Layout.prototype.isSupportsPopout = function () {\n        return this.supportsPopout;\n    };\n    /** @internal */\n    Layout.prototype.isRealtimeResize = function () {\n        var _a;\n        return (_a = this.props.realtimeResize) !== null && _a !== void 0 ? _a : false;\n    };\n    /** @internal */\n    Layout.prototype.onTabDrag = function () {\n        var _a, _b;\n        var args = [];\n        for (var _i = 0; _i < arguments.length; _i++) {\n            args[_i] = arguments[_i];\n        }\n        return (_b = (_a = this.props).onTabDrag) === null || _b === void 0 ? void 0 : _b.call.apply(_b, __spreadArray([_a], args, false));\n    };\n    /** @internal */\n    Layout.prototype.getPopoutURL = function () {\n        return this.popoutURL;\n    };\n    /** @internal */\n    Layout.prototype.componentWillUnmount = function () {\n        var _a;\n        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.selfRef.current);\n    };\n    /** @internal */\n    Layout.prototype.setEditingTab = function (tabNode) {\n        this.setState({ editingTab: tabNode });\n    };\n    /** @internal */\n    Layout.prototype.getEditingTab = function () {\n        return this.state.editingTab;\n    };\n    /** @internal */\n    Layout.prototype.render = function () {\n        // first render will be used to find the size (via selfRef)\n        if (this.firstRender) {\n            this.firstRender = false;\n            return (React.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(Types_1.CLASSES.FLEXLAYOUT__LAYOUT) }, this.metricsElements()));\n        }\n        this.props.model._setPointerFine(window && window.matchMedia && window.matchMedia(\"(pointer: fine)\").matches);\n        // this.start = Date.now();\n        var borderComponents = [];\n        var tabSetComponents = [];\n        var floatingWindows = [];\n        var tabComponents = {};\n        var splitterComponents = [];\n        var metrics = {\n            headerBarSize: this.state.calculatedHeaderBarSize,\n            tabBarSize: this.state.calculatedTabBarSize,\n            borderBarSize: this.state.calculatedBorderBarSize\n        };\n        this.props.model._setShowHiddenBorder(this.state.showHiddenBorder);\n        this.centerRect = this.props.model._layout(this.state.rect, metrics);\n        this.renderBorder(this.props.model.getBorderSet(), borderComponents, tabComponents, floatingWindows, splitterComponents);\n        this.renderChildren(\"\", this.props.model.getRoot(), tabSetComponents, tabComponents, floatingWindows, splitterComponents);\n        var nextTopIds = [];\n        var nextTopIdsMap = {};\n        // Keep any previous tabs in the same DOM order as before, removing any that have been deleted\n        for (var _i = 0, _a = this.tabIds; _i < _a.length; _i++) {\n            var t = _a[_i];\n            if (tabComponents[t]) {\n                nextTopIds.push(t);\n                nextTopIdsMap[t] = t;\n            }\n        }\n        this.tabIds = nextTopIds;\n        // Add tabs that have been added to the DOM\n        for (var _b = 0, _c = Object.keys(tabComponents); _b < _c.length; _b++) {\n            var t = _c[_b];\n            if (!nextTopIdsMap[t]) {\n                this.tabIds.push(t);\n            }\n        }\n        var edges = [];\n        if (this.state.showEdges) {\n            var r = this.centerRect;\n            var length_1 = this.edgeRectLength;\n            var width = this.edgeRectWidth;\n            var offset = this.edgeRectLength / 2;\n            var className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n            var radius = 50;\n            edges.push(React.createElement(\"div\", { key: \"North\", style: { top: r.y, left: r.x + r.width / 2 - offset, width: length_1, height: width, borderBottomLeftRadius: radius, borderBottomRightRadius: radius }, className: className }));\n            edges.push(React.createElement(\"div\", { key: \"West\", style: { top: r.y + r.height / 2 - offset, left: r.x, width: width, height: length_1, borderTopRightRadius: radius, borderBottomRightRadius: radius }, className: className }));\n            edges.push(React.createElement(\"div\", { key: \"South\", style: { top: r.y + r.height - width, left: r.x + r.width / 2 - offset, width: length_1, height: width, borderTopLeftRadius: radius, borderTopRightRadius: radius }, className: className }));\n            edges.push(React.createElement(\"div\", { key: \"East\", style: { top: r.y + r.height / 2 - offset, left: r.x + r.width - width, width: width, height: length_1, borderTopLeftRadius: radius, borderBottomLeftRadius: radius }, className: className }));\n        }\n        // this.layoutTime = (Date.now() - this.start);\n        return (React.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(Types_1.CLASSES.FLEXLAYOUT__LAYOUT), onDragEnter: this.props.onExternalDrag ? this.onDragEnter : undefined },\n            tabSetComponents,\n            this.tabIds.map(function (t) {\n                return tabComponents[t];\n            }),\n            borderComponents,\n            splitterComponents,\n            edges,\n            floatingWindows,\n            this.metricsElements(),\n            this.state.portal));\n    };\n    /** @internal */\n    Layout.prototype.metricsElements = function () {\n        // used to measure the tab and border tab sizes\n        var fontStyle = this.styleFont({ visibility: \"hidden\" });\n        return (React.createElement(React.Fragment, null,\n            React.createElement(\"div\", { key: \"findHeaderBarSize\", ref: this.findHeaderBarSizeRef, style: fontStyle, className: this.getClassName(Types_1.CLASSES.FLEXLAYOUT__TABSET_HEADER_SIZER) }, \"FindHeaderBarSize\"),\n            React.createElement(\"div\", { key: \"findTabBarSize\", ref: this.findTabBarSizeRef, style: fontStyle, className: this.getClassName(Types_1.CLASSES.FLEXLAYOUT__TABSET_SIZER) }, \"FindTabBarSize\"),\n            React.createElement(\"div\", { key: \"findBorderBarSize\", ref: this.findBorderBarSizeRef, style: fontStyle, className: this.getClassName(Types_1.CLASSES.FLEXLAYOUT__BORDER_SIZER) }, \"FindBorderBarSize\")));\n    };\n    /** @internal */\n    Layout.prototype.renderBorder = function (borderSet, borderComponents, tabComponents, floatingWindows, splitterComponents) {\n        for (var _i = 0, _a = borderSet.getBorders(); _i < _a.length; _i++) {\n            var border = _a[_i];\n            var borderPath = \"/border/\".concat(border.getLocation().getName());\n            if (border.isShowing()) {\n                borderComponents.push(React.createElement(BorderTabSet_1.BorderTabSet, { key: \"border_\".concat(border.getLocation().getName()), path: borderPath, border: border, layout: this, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory, icons: this.icons }));\n                var drawChildren = border._getDrawChildren();\n                var i = 0;\n                var tabCount = 0;\n                for (var _b = 0, drawChildren_1 = drawChildren; _b < drawChildren_1.length; _b++) {\n                    var child = drawChildren_1[_b];\n                    if (child instanceof SplitterNode_1.SplitterNode) {\n                        var path = borderPath + \"/s\";\n                        splitterComponents.push(React.createElement(Splitter_1.Splitter, { key: child.getId(), layout: this, node: child, path: path }));\n                    }\n                    else if (child instanceof TabNode_1.TabNode) {\n                        var path = borderPath + \"/t\" + tabCount++;\n                        if (this.supportsPopout && child.isFloating()) {\n                            var rect = this._getScreenRect(child);\n                            floatingWindows.push(React.createElement(FloatingWindow_1.FloatingWindow, { key: child.getId(), url: this.popoutURL, rect: rect, title: child.getName(), id: child.getId(), onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\n                                React.createElement(FloatingWindowTab_1.FloatingWindowTab, { layout: this, node: child, factory: this.props.factory })));\n                            tabComponents[child.getId()] = React.createElement(TabFloating_1.TabFloating, { key: child.getId(), layout: this, path: path, node: child, selected: i === border.getSelected() });\n                        }\n                        else {\n                            tabComponents[child.getId()] = React.createElement(Tab_1.Tab, { key: child.getId(), layout: this, path: path, node: child, selected: i === border.getSelected(), factory: this.props.factory });\n                        }\n                    }\n                    i++;\n                }\n            }\n        }\n    };\n    /** @internal */\n    Layout.prototype.renderChildren = function (path, node, tabSetComponents, tabComponents, floatingWindows, splitterComponents) {\n        var drawChildren = node._getDrawChildren();\n        var splitterCount = 0;\n        var tabCount = 0;\n        var rowCount = 0;\n        for (var _i = 0, _a = drawChildren; _i < _a.length; _i++) {\n            var child = _a[_i];\n            if (child instanceof SplitterNode_1.SplitterNode) {\n                var newPath = path + \"/s\" + (splitterCount++);\n                splitterComponents.push(React.createElement(Splitter_1.Splitter, { key: child.getId(), layout: this, path: newPath, node: child }));\n            }\n            else if (child instanceof TabSetNode_1.TabSetNode) {\n                var newPath = path + \"/ts\" + (rowCount++);\n                tabSetComponents.push(React.createElement(TabSet_1.TabSet, { key: child.getId(), layout: this, path: newPath, node: child, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory, icons: this.icons }));\n                this.renderChildren(newPath, child, tabSetComponents, tabComponents, floatingWindows, splitterComponents);\n            }\n            else if (child instanceof TabNode_1.TabNode) {\n                var newPath = path + \"/t\" + (tabCount++);\n                var selectedTab = child.getParent().getChildren()[child.getParent().getSelected()];\n                if (selectedTab === undefined) {\n                    // this should not happen!\n                    console.warn(\"undefined selectedTab should not happen\");\n                }\n                if (this.supportsPopout && child.isFloating()) {\n                    var rect = this._getScreenRect(child);\n                    floatingWindows.push(React.createElement(FloatingWindow_1.FloatingWindow, { key: child.getId(), url: this.popoutURL, rect: rect, title: child.getName(), id: child.getId(), onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\n                        React.createElement(FloatingWindowTab_1.FloatingWindowTab, { layout: this, node: child, factory: this.props.factory })));\n                    tabComponents[child.getId()] = React.createElement(TabFloating_1.TabFloating, { key: child.getId(), layout: this, path: newPath, node: child, selected: child === selectedTab });\n                }\n                else {\n                    tabComponents[child.getId()] = React.createElement(Tab_1.Tab, { key: child.getId(), layout: this, path: newPath, node: child, selected: child === selectedTab, factory: this.props.factory });\n                }\n            }\n            else {\n                // is row\n                var newPath = path + ((child.getOrientation() === Orientation_1.Orientation.HORZ) ? \"/r\" : \"/c\") + (rowCount++);\n                this.renderChildren(newPath, child, tabSetComponents, tabComponents, floatingWindows, splitterComponents);\n            }\n        }\n    };\n    /** @internal */\n    Layout.prototype._getScreenRect = function (node) {\n        var rect = node.getRect().clone();\n        var bodyRect = this.selfRef.current.getBoundingClientRect();\n        var navHeight = Math.min(80, this.currentWindow.outerHeight - this.currentWindow.innerHeight);\n        var navWidth = Math.min(80, this.currentWindow.outerWidth - this.currentWindow.innerWidth);\n        rect.x = rect.x + bodyRect.x + this.currentWindow.screenX + navWidth;\n        rect.y = rect.y + bodyRect.y + this.currentWindow.screenY + navHeight;\n        return rect;\n    };\n    /**\n     * Adds a new tab to the given tabset\n     * @param tabsetId the id of the tabset where the new tab will be added\n     * @param json the json for the new tab node\n     */\n    Layout.prototype.addTabToTabSet = function (tabsetId, json) {\n        var tabsetNode = this.props.model.getNodeById(tabsetId);\n        if (tabsetNode !== undefined) {\n            this.doAction(Actions_1.Actions.addNode(json, tabsetId, DockLocation_1.DockLocation.CENTER, -1));\n        }\n    };\n    /**\n     * Adds a new tab to the active tabset (if there is one)\n     * @param json the json for the new tab node\n     */\n    Layout.prototype.addTabToActiveTabSet = function (json) {\n        var tabsetNode = this.props.model.getActiveTabset();\n        if (tabsetNode !== undefined) {\n            this.doAction(Actions_1.Actions.addNode(json, tabsetNode.getId(), DockLocation_1.DockLocation.CENTER, -1));\n        }\n    };\n    /**\n     * Adds a new tab by dragging a labeled panel to the drop location, dragging starts immediatelly\n     * @param dragText the text to show on the drag panel\n     * @param json the json for the new tab node\n     * @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)\n     */\n    Layout.prototype.addTabWithDragAndDrop = function (dragText, json, onDrop) {\n        this.fnNewNodeDropped = onDrop;\n        this.newTabJson = json;\n        this.dragStart(undefined, dragText, TabNode_1.TabNode._fromJson(json, this.props.model, false), true, undefined, undefined);\n    };\n    /**\n     * Move a tab/tabset using drag and drop\n     * @param node the tab or tabset to drag\n     * @param dragText the text to show on the drag panel\n     */\n    Layout.prototype.moveTabWithDragAndDrop = function (node, dragText) {\n        this.dragStart(undefined, dragText, node, true, undefined, undefined);\n    };\n    /**\n     * Adds a new tab by dragging a labeled panel to the drop location, dragging starts when you\n     * mouse down on the panel\n     *\n     * @param dragText the text to show on the drag panel\n     * @param json the json for the new tab node\n     * @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)\n     */\n    Layout.prototype.addTabWithDragAndDropIndirect = function (dragText, json, onDrop) {\n        var _this = this;\n        this.fnNewNodeDropped = onDrop;\n        this.newTabJson = json;\n        DragDrop_1.DragDrop.instance.addGlass(this.onCancelAdd);\n        this.dragDivText = dragText;\n        this.dragDiv = this.currentDocument.createElement(\"div\");\n        this.dragDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__DRAG_RECT);\n        this.dragDiv.addEventListener(\"mousedown\", this.onDragDivMouseDown);\n        this.dragDiv.addEventListener(\"touchstart\", this.onDragDivMouseDown, { passive: false });\n        this.dragRectRender(this.dragDivText, undefined, this.newTabJson, function () {\n            if (_this.dragDiv) {\n                // now it's been rendered into the dom it can be centered\n                _this.dragDiv.style.visibility = \"visible\";\n                var domRect = _this.dragDiv.getBoundingClientRect();\n                var r = new Rect_1.Rect(0, 0, domRect === null || domRect === void 0 ? void 0 : domRect.width, domRect === null || domRect === void 0 ? void 0 : domRect.height);\n                r.centerInRect(_this.state.rect);\n                _this.dragDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\n                _this.dragDiv.style.left = r.x + \"px\";\n                _this.dragDiv.style.top = r.y + \"px\";\n            }\n        });\n        var rootdiv = this.selfRef.current;\n        rootdiv.appendChild(this.dragDiv);\n    };\n    /** @internal */\n    Layout.prototype.handleCustomTabDrag = function (dropInfo, pos, event) {\n        var _this = this;\n        var _a, _b, _c;\n        var invalidated = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated;\n        var currentCallback = (_b = this.customDrop) === null || _b === void 0 ? void 0 : _b.callback;\n        this.customDrop = undefined;\n        var dragging = this.newTabJson || (this.dragNode instanceof TabNode_1.TabNode ? this.dragNode : undefined);\n        if (dragging && (dropInfo.node instanceof TabSetNode_1.TabSetNode || dropInfo.node instanceof BorderNode_1.BorderNode) && dropInfo.index === -1) {\n            var selected = dropInfo.node.getSelectedNode();\n            var tabRect = selected === null || selected === void 0 ? void 0 : selected.getRect();\n            if (selected && (tabRect === null || tabRect === void 0 ? void 0 : tabRect.contains(pos.x, pos.y))) {\n                var customDrop = undefined;\n                try {\n                    var dest = this.onTabDrag(dragging, selected, pos.x - tabRect.x, pos.y - tabRect.y, dropInfo.location, function () { return _this.onDragMove(event); });\n                    if (dest) {\n                        customDrop = {\n                            rect: new Rect_1.Rect(dest.x + tabRect.x, dest.y + tabRect.y, dest.width, dest.height),\n                            callback: dest.callback,\n                            invalidated: dest.invalidated,\n                            dragging: dragging,\n                            over: selected,\n                            x: pos.x - tabRect.x,\n                            y: pos.y - tabRect.y,\n                            location: dropInfo.location,\n                            cursor: dest.cursor\n                        };\n                    }\n                }\n                catch (e) {\n                    console.error(e);\n                }\n                if ((customDrop === null || customDrop === void 0 ? void 0 : customDrop.callback) === currentCallback) {\n                    invalidated = undefined;\n                }\n                this.customDrop = customDrop;\n            }\n        }\n        this.dropInfo = dropInfo;\n        this.outlineDiv.className = this.getClassName(this.customDrop ? Types_1.CLASSES.FLEXLAYOUT__OUTLINE_RECT : dropInfo.className);\n        if (this.customDrop) {\n            this.customDrop.rect.positionElement(this.outlineDiv);\n        }\n        else {\n            dropInfo.rect.positionElement(this.outlineDiv);\n        }\n        DragDrop_1.DragDrop.instance.setGlassCursorOverride((_c = this.customDrop) === null || _c === void 0 ? void 0 : _c.cursor);\n        this.outlineDiv.style.visibility = \"visible\";\n        try {\n            invalidated === null || invalidated === void 0 ? void 0 : invalidated();\n        }\n        catch (e) {\n            console.error(e);\n        }\n    };\n    /** @internal */\n    Layout.prototype.onDragEnter = function (event) {\n        // DragDrop keeps track of number of dragenters minus the number of\n        // dragleaves. Only start a new drag if there isn't one already.\n        if (DragDrop_1.DragDrop.instance.isDragging())\n            return;\n        var drag = this.props.onExternalDrag(event);\n        if (drag) {\n            // Mimic addTabWithDragAndDrop, but pass in DragEvent\n            this.fnNewNodeDropped = drag.onDrop;\n            this.newTabJson = drag.json;\n            this.dragStart(event, drag.dragText, TabNode_1.TabNode._fromJson(drag.json, this.props.model, false), true, undefined, undefined);\n        }\n    };\n    /** @internal */\n    Layout.prototype.checkForBorderToShow = function (x, y) {\n        var r = this.props.model._getOuterInnerRects().outer;\n        var c = r.getCenter();\n        var margin = this.edgeRectWidth;\n        var offset = this.edgeRectLength / 2;\n        var overEdge = false;\n        if (this.props.model.isEnableEdgeDock() && this.state.showHiddenBorder === DockLocation_1.DockLocation.CENTER) {\n            if ((y > c.y - offset && y < c.y + offset) ||\n                (x > c.x - offset && x < c.x + offset)) {\n                overEdge = true;\n            }\n        }\n        var location = DockLocation_1.DockLocation.CENTER;\n        if (!overEdge) {\n            if (x <= r.x + margin) {\n                location = DockLocation_1.DockLocation.LEFT;\n            }\n            else if (x >= r.getRight() - margin) {\n                location = DockLocation_1.DockLocation.RIGHT;\n            }\n            else if (y <= r.y + margin) {\n                location = DockLocation_1.DockLocation.TOP;\n            }\n            else if (y >= r.getBottom() - margin) {\n                location = DockLocation_1.DockLocation.BOTTOM;\n            }\n        }\n        if (location !== this.state.showHiddenBorder) {\n            this.setState({ showHiddenBorder: location });\n        }\n    };\n    /** @internal */\n    Layout.prototype.maximize = function (tabsetNode) {\n        this.doAction(Actions_1.Actions.maximizeToggle(tabsetNode.getId()));\n    };\n    /** @internal */\n    Layout.prototype.customizeTab = function (tabNode, renderValues) {\n        if (this.props.onRenderTab) {\n            this.props.onRenderTab(tabNode, renderValues);\n        }\n    };\n    /** @internal */\n    Layout.prototype.customizeTabSet = function (tabSetNode, renderValues) {\n        if (this.props.onRenderTabSet) {\n            this.props.onRenderTabSet(tabSetNode, renderValues);\n        }\n    };\n    /** @internal */\n    Layout.prototype.i18nName = function (id, param) {\n        var message;\n        if (this.props.i18nMapper) {\n            message = this.props.i18nMapper(id, param);\n        }\n        if (message === undefined) {\n            message = id + (param === undefined ? \"\" : param);\n        }\n        return message;\n    };\n    /** @internal */\n    Layout.prototype.getOnRenderFloatingTabPlaceholder = function () {\n        return this.props.onRenderFloatingTabPlaceholder;\n    };\n    /** @internal */\n    Layout.prototype.getShowOverflowMenu = function () {\n        return this.props.onShowOverflowMenu;\n    };\n    /** @internal */\n    Layout.prototype.getTabSetPlaceHolderCallback = function () {\n        return this.props.onTabSetPlaceHolder;\n    };\n    /** @internal */\n    Layout.prototype.showContextMenu = function (node, event) {\n        if (this.props.onContextMenu) {\n            this.props.onContextMenu(node, event);\n        }\n    };\n    /** @internal */\n    Layout.prototype.auxMouseClick = function (node, event) {\n        if (this.props.onAuxMouseClick) {\n            this.props.onAuxMouseClick(node, event);\n        }\n    };\n    return Layout;\n}(React.Component));\nexports.Layout = Layout;\n/** @internal */\nvar DragRectRenderWrapper = function (props) {\n    React.useEffect(function () {\n        var _a;\n        (_a = props.onRendered) === null || _a === void 0 ? void 0 : _a.call(props);\n    }, [props]);\n    return (React.createElement(React.Fragment, null, props.children));\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Layout.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Layout\": () => (/* binding */ Layout)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DragDrop__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DragDrop */ \"./src/DragDrop.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../model/SplitterNode */ \"./src/model/SplitterNode.ts\");\n/* harmony import */ var _model_TabNode__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../model/TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _BorderTabSet__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./BorderTabSet */ \"./src/view/BorderTabSet.tsx\");\n/* harmony import */ var _Splitter__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./Splitter */ \"./src/view/Splitter.tsx\");\n/* harmony import */ var _Tab__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./Tab */ \"./src/view/Tab.tsx\");\n/* harmony import */ var _TabSet__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./TabSet */ \"./src/view/TabSet.tsx\");\n/* harmony import */ var _FloatingWindow__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./FloatingWindow */ \"./src/view/FloatingWindow.tsx\");\n/* harmony import */ var _FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./FloatingWindowTab */ \"./src/view/FloatingWindowTab.tsx\");\n/* harmony import */ var _TabFloating__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./TabFloating */ \"./src/view/TabFloating.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Icons__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./Icons */ \"./src/view/Icons.tsx\");\n/* harmony import */ var _TabButtonStamp__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./TabButtonStamp */ \"./src/view/TabButtonStamp.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nconst defaultIcons = {\r\n    close: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.CloseIcon, null),\r\n    closeTabset: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.CloseIcon, null),\r\n    popout: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.PopoutIcon, null),\r\n    maximize: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.MaximizeIcon, null),\r\n    restore: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.RestoreIcon, null),\r\n    more: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.OverflowIcon, null),\r\n};\r\n// Popout windows work in latest browsers based on webkit (Chrome, Opera, Safari, latest Edge) and Firefox. They do\r\n// not work on any version if IE or the original Edge browser\r\n// Assume any recent desktop browser not IE or original Edge will work\r\n/** @internal */\r\n// @ts-ignore\r\nconst isIEorEdge = typeof window !== \"undefined\" && (window.document.documentMode || /Edge\\//.test(window.navigator.userAgent));\r\n/** @internal */\r\nconst isDesktop = typeof window !== \"undefined\" && window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches;\r\n/** @internal */\r\nconst defaultSupportsPopout = isDesktop && !isIEorEdge;\r\n/**\r\n * A React component that hosts a multi-tabbed layout\r\n */\r\nclass Layout extends react__WEBPACK_IMPORTED_MODULE_0__.Component {\r\n    constructor(props) {\r\n        super(props);\r\n        /** @internal */\r\n        this.firstMove = false;\r\n        /** @internal */\r\n        this.dragRectRendered = true;\r\n        /** @internal */\r\n        this.dragDivText = undefined;\r\n        /** @internal */\r\n        this.edgeRectLength = 100;\r\n        /** @internal */\r\n        this.edgeRectWidth = 10;\r\n        /** @internal */\r\n        this.onModelChange = () => {\r\n            this.forceUpdate();\r\n            if (this.props.onModelChange) {\r\n                this.props.onModelChange(this.props.model);\r\n            }\r\n        };\r\n        /** @internal */\r\n        this.updateRect = (domRect = this.getDomRect()) => {\r\n            const rect = new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, domRect.width, domRect.height);\r\n            if (!rect.equals(this.state.rect) && rect.width !== 0 && rect.height !== 0) {\r\n                this.setState({ rect });\r\n            }\r\n        };\r\n        /** @internal */\r\n        this.updateLayoutMetrics = () => {\r\n            if (this.findHeaderBarSizeRef.current) {\r\n                const headerBarSize = this.findHeaderBarSizeRef.current.getBoundingClientRect().height;\r\n                if (headerBarSize !== this.state.calculatedHeaderBarSize) {\r\n                    this.setState({ calculatedHeaderBarSize: headerBarSize });\r\n                }\r\n            }\r\n            if (this.findTabBarSizeRef.current) {\r\n                const tabBarSize = this.findTabBarSizeRef.current.getBoundingClientRect().height;\r\n                if (tabBarSize !== this.state.calculatedTabBarSize) {\r\n                    this.setState({ calculatedTabBarSize: tabBarSize });\r\n                }\r\n            }\r\n            if (this.findBorderBarSizeRef.current) {\r\n                const borderBarSize = this.findBorderBarSizeRef.current.getBoundingClientRect().height;\r\n                if (borderBarSize !== this.state.calculatedBorderBarSize) {\r\n                    this.setState({ calculatedBorderBarSize: borderBarSize });\r\n                }\r\n            }\r\n        };\r\n        /** @internal */\r\n        this.getClassName = (defaultClassName) => {\r\n            if (this.props.classNameMapper === undefined) {\r\n                return defaultClassName;\r\n            }\r\n            else {\r\n                return this.props.classNameMapper(defaultClassName);\r\n            }\r\n        };\r\n        /** @internal */\r\n        this.onCloseWindow = (id) => {\r\n            this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.unFloatTab(id));\r\n            try {\r\n                this.props.model.getNodeById(id)._setWindow(undefined);\r\n            }\r\n            catch (e) {\r\n                // catch incase it was a model change\r\n            }\r\n        };\r\n        /** @internal */\r\n        this.onSetWindow = (id, window) => {\r\n            this.props.model.getNodeById(id)._setWindow(window);\r\n        };\r\n        /** @internal */\r\n        this.onCancelAdd = () => {\r\n            var _a, _b;\r\n            const rootdiv = this.selfRef.current;\r\n            rootdiv.removeChild(this.dragDiv);\r\n            this.dragDiv = undefined;\r\n            this.hidePortal();\r\n            if (this.fnNewNodeDropped != null) {\r\n                this.fnNewNodeDropped();\r\n                this.fnNewNodeDropped = undefined;\r\n            }\r\n            try {\r\n                (_b = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated) === null || _b === void 0 ? void 0 : _b.call(_a);\r\n            }\r\n            catch (e) {\r\n                console.error(e);\r\n            }\r\n            _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n            this.newTabJson = undefined;\r\n            this.customDrop = undefined;\r\n        };\r\n        /** @internal */\r\n        this.onCancelDrag = (wasDragging) => {\r\n            var _a, _b;\r\n            if (wasDragging) {\r\n                const rootdiv = this.selfRef.current;\r\n                try {\r\n                    rootdiv.removeChild(this.outlineDiv);\r\n                }\r\n                catch (e) { }\r\n                try {\r\n                    rootdiv.removeChild(this.dragDiv);\r\n                }\r\n                catch (e) { }\r\n                this.dragDiv = undefined;\r\n                this.hidePortal();\r\n                this.setState({ showEdges: false });\r\n                if (this.fnNewNodeDropped != null) {\r\n                    this.fnNewNodeDropped();\r\n                    this.fnNewNodeDropped = undefined;\r\n                }\r\n                try {\r\n                    (_b = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated) === null || _b === void 0 ? void 0 : _b.call(_a);\r\n                }\r\n                catch (e) {\r\n                    console.error(e);\r\n                }\r\n                _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n                this.newTabJson = undefined;\r\n                this.customDrop = undefined;\r\n            }\r\n            this.setState({ showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER });\r\n        };\r\n        /** @internal */\r\n        this.onDragDivMouseDown = (event) => {\r\n            event.preventDefault();\r\n            this.dragStart(event, this.dragDivText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(this.newTabJson, this.props.model, false), true, undefined, undefined);\r\n        };\r\n        /** @internal */\r\n        this.dragStart = (event, dragDivText, node, allowDrag, onClick, onDoubleClick) => {\r\n            if (!allowDrag) {\r\n                _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.startDrag(event, undefined, undefined, undefined, undefined, onClick, onDoubleClick, this.currentDocument, this.selfRef.current);\r\n            }\r\n            else {\r\n                this.dragNode = node;\r\n                this.dragDivText = dragDivText;\r\n                _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.startDrag(event, this.onDragStart, this.onDragMove, this.onDragEnd, this.onCancelDrag, onClick, onDoubleClick, this.currentDocument, this.selfRef.current);\r\n            }\r\n        };\r\n        /** @internal */\r\n        this.dragRectRender = (text, node, json, onRendered) => {\r\n            let content;\r\n            if (text !== undefined) {\r\n                content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { whiteSpace: \"pre\" } }, text.replace(\"<br>\", \"\\n\"));\r\n            }\r\n            else {\r\n                if (node && node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n                    content = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButtonStamp__WEBPACK_IMPORTED_MODULE_20__.TabButtonStamp, { node: node, layout: this, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory }));\r\n                }\r\n            }\r\n            if (this.props.onRenderDragRect !== undefined) {\r\n                const customContent = this.props.onRenderDragRect(content, node, json);\r\n                if (customContent !== undefined) {\r\n                    content = customContent;\r\n                }\r\n            }\r\n            // hide div until the render is complete\r\n            this.dragDiv.style.visibility = \"hidden\";\r\n            this.dragRectRendered = false;\r\n            this.showPortal(react__WEBPACK_IMPORTED_MODULE_0__.createElement(DragRectRenderWrapper\r\n            // wait for it to be rendered\r\n            , { \r\n                // wait for it to be rendered\r\n                onRendered: () => {\r\n                    this.dragRectRendered = true;\r\n                    onRendered === null || onRendered === void 0 ? void 0 : onRendered();\r\n                } }, content), this.dragDiv);\r\n        };\r\n        /** @internal */\r\n        this.showPortal = (control, element) => {\r\n            const portal = (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(control, element);\r\n            this.setState({ portal });\r\n        };\r\n        /** @internal */\r\n        this.hidePortal = () => {\r\n            this.setState({ portal: undefined });\r\n        };\r\n        /** @internal */\r\n        this.onDragStart = () => {\r\n            this.dropInfo = undefined;\r\n            this.customDrop = undefined;\r\n            const rootdiv = this.selfRef.current;\r\n            this.outlineDiv = this.currentDocument.createElement(\"div\");\r\n            this.outlineDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n            this.outlineDiv.style.visibility = \"hidden\";\r\n            rootdiv.appendChild(this.outlineDiv);\r\n            if (this.dragDiv == null) {\r\n                this.dragDiv = this.currentDocument.createElement(\"div\");\r\n                this.dragDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__DRAG_RECT);\r\n                this.dragDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\r\n                this.dragRectRender(this.dragDivText, this.dragNode, this.newTabJson);\r\n                rootdiv.appendChild(this.dragDiv);\r\n            }\r\n            // add edge indicators\r\n            if (this.props.model.getMaximizedTabset() === undefined) {\r\n                this.setState({ showEdges: true });\r\n            }\r\n            if (this.dragNode !== undefined && this.dragNode instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode && this.dragNode.getTabRect() !== undefined) {\r\n                this.dragNode.getTabRect().positionElement(this.outlineDiv);\r\n            }\r\n            this.firstMove = true;\r\n            return true;\r\n        };\r\n        /** @internal */\r\n        this.onDragMove = (event) => {\r\n            if (this.firstMove === false) {\r\n                const speed = this.props.model._getAttribute(\"tabDragSpeed\");\r\n                this.outlineDiv.style.transition = `top ${speed}s, left ${speed}s, width ${speed}s, height ${speed}s`;\r\n            }\r\n            this.firstMove = false;\r\n            const clientRect = this.selfRef.current.getBoundingClientRect();\r\n            const pos = {\r\n                x: event.clientX - clientRect.left,\r\n                y: event.clientY - clientRect.top,\r\n            };\r\n            this.checkForBorderToShow(pos.x, pos.y);\r\n            // keep it between left & right\r\n            const dragRect = this.dragDiv.getBoundingClientRect();\r\n            let newLeft = pos.x - dragRect.width / 2;\r\n            if (newLeft + dragRect.width > clientRect.width) {\r\n                newLeft = clientRect.width - dragRect.width;\r\n            }\r\n            newLeft = Math.max(0, newLeft);\r\n            this.dragDiv.style.left = newLeft + \"px\";\r\n            this.dragDiv.style.top = pos.y + 5 + \"px\";\r\n            if (this.dragRectRendered && this.dragDiv.style.visibility === \"hidden\") {\r\n                // make visible once the drag rect has been rendered\r\n                this.dragDiv.style.visibility = \"visible\";\r\n            }\r\n            let dropInfo = this.props.model._findDropTargetNode(this.dragNode, pos.x, pos.y);\r\n            if (dropInfo) {\r\n                if (this.props.onTabDrag) {\r\n                    this.handleCustomTabDrag(dropInfo, pos, event);\r\n                }\r\n                else {\r\n                    this.dropInfo = dropInfo;\r\n                    this.outlineDiv.className = this.getClassName(dropInfo.className);\r\n                    dropInfo.rect.positionElement(this.outlineDiv);\r\n                    this.outlineDiv.style.visibility = \"visible\";\r\n                }\r\n            }\r\n        };\r\n        /** @internal */\r\n        this.onDragEnd = (event) => {\r\n            const rootdiv = this.selfRef.current;\r\n            rootdiv.removeChild(this.outlineDiv);\r\n            rootdiv.removeChild(this.dragDiv);\r\n            this.dragDiv = undefined;\r\n            this.hidePortal();\r\n            this.setState({ showEdges: false });\r\n            _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n            if (this.dropInfo) {\r\n                if (this.customDrop) {\r\n                    this.newTabJson = undefined;\r\n                    try {\r\n                        const { callback, dragging, over, x, y, location } = this.customDrop;\r\n                        callback(dragging, over, x, y, location);\r\n                        if (this.fnNewNodeDropped != null) {\r\n                            this.fnNewNodeDropped();\r\n                            this.fnNewNodeDropped = undefined;\r\n                        }\r\n                    }\r\n                    catch (e) {\r\n                        console.error(e);\r\n                    }\r\n                }\r\n                else if (this.newTabJson !== undefined) {\r\n                    const newNode = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(this.newTabJson, this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\r\n                    if (this.fnNewNodeDropped != null) {\r\n                        this.fnNewNodeDropped(newNode, event);\r\n                        this.fnNewNodeDropped = undefined;\r\n                    }\r\n                    this.newTabJson = undefined;\r\n                }\r\n                else if (this.dragNode !== undefined) {\r\n                    this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.moveNode(this.dragNode.getId(), this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\r\n                }\r\n            }\r\n            this.setState({ showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER });\r\n        };\r\n        this.props.model._setChangeListener(this.onModelChange);\r\n        this.tabIds = [];\r\n        this.selfRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n        this.findHeaderBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n        this.findTabBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n        this.findBorderBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n        this.supportsPopout = props.supportsPopout !== undefined ? props.supportsPopout : defaultSupportsPopout;\r\n        this.popoutURL = props.popoutURL ? props.popoutURL : \"popout.html\";\r\n        this.icons = Object.assign(Object.assign({}, defaultIcons), props.icons);\r\n        this.state = {\r\n            rect: new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, 0, 0),\r\n            calculatedHeaderBarSize: 25,\r\n            calculatedTabBarSize: 26,\r\n            calculatedBorderBarSize: 30,\r\n            editingTab: undefined,\r\n            showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER,\r\n            showEdges: false,\r\n        };\r\n        this.onDragEnter = this.onDragEnter.bind(this);\r\n    }\r\n    /** @internal */\r\n    styleFont(style) {\r\n        if (this.props.font) {\r\n            if (this.selfRef.current) {\r\n                if (this.props.font.size) {\r\n                    this.selfRef.current.style.setProperty(\"--font-size\", this.props.font.size);\r\n                }\r\n                if (this.props.font.family) {\r\n                    this.selfRef.current.style.setProperty(\"--font-family\", this.props.font.family);\r\n                }\r\n            }\r\n            if (this.props.font.style) {\r\n                style.fontStyle = this.props.font.style;\r\n            }\r\n            if (this.props.font.weight) {\r\n                style.fontWeight = this.props.font.weight;\r\n            }\r\n        }\r\n        return style;\r\n    }\r\n    /** @internal */\r\n    doAction(action) {\r\n        if (this.props.onAction !== undefined) {\r\n            const outcome = this.props.onAction(action);\r\n            if (outcome !== undefined) {\r\n                return this.props.model.doAction(outcome);\r\n            }\r\n            return undefined;\r\n        }\r\n        else {\r\n            return this.props.model.doAction(action);\r\n        }\r\n    }\r\n    /** @internal */\r\n    componentDidMount() {\r\n        this.updateRect();\r\n        this.updateLayoutMetrics();\r\n        // need to re-render if size changes\r\n        this.currentDocument = this.selfRef.current.ownerDocument;\r\n        this.currentWindow = this.currentDocument.defaultView;\r\n        this.resizeObserver = new ResizeObserver(entries => {\r\n            this.updateRect(entries[0].contentRect);\r\n        });\r\n        this.resizeObserver.observe(this.selfRef.current);\r\n    }\r\n    /** @internal */\r\n    componentDidUpdate() {\r\n        this.updateLayoutMetrics();\r\n        if (this.props.model !== this.previousModel) {\r\n            if (this.previousModel !== undefined) {\r\n                this.previousModel._setChangeListener(undefined); // stop listening to old model\r\n            }\r\n            this.props.model._setChangeListener(this.onModelChange);\r\n            this.previousModel = this.props.model;\r\n        }\r\n        // console.log(\"Layout time: \" + this.layoutTime + \"ms Render time: \" + (Date.now() - this.start) + \"ms\");\r\n    }\r\n    /** @internal */\r\n    getCurrentDocument() {\r\n        return this.currentDocument;\r\n    }\r\n    /** @internal */\r\n    getDomRect() {\r\n        return this.selfRef.current.getBoundingClientRect();\r\n    }\r\n    /** @internal */\r\n    getRootDiv() {\r\n        return this.selfRef.current;\r\n    }\r\n    /** @internal */\r\n    isSupportsPopout() {\r\n        return this.supportsPopout;\r\n    }\r\n    /** @internal */\r\n    isRealtimeResize() {\r\n        var _a;\r\n        return (_a = this.props.realtimeResize) !== null && _a !== void 0 ? _a : false;\r\n    }\r\n    /** @internal */\r\n    onTabDrag(...args) {\r\n        var _a, _b;\r\n        return (_b = (_a = this.props).onTabDrag) === null || _b === void 0 ? void 0 : _b.call(_a, ...args);\r\n    }\r\n    /** @internal */\r\n    getPopoutURL() {\r\n        return this.popoutURL;\r\n    }\r\n    /** @internal */\r\n    componentWillUnmount() {\r\n        var _a;\r\n        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.selfRef.current);\r\n    }\r\n    /** @internal */\r\n    setEditingTab(tabNode) {\r\n        this.setState({ editingTab: tabNode });\r\n    }\r\n    /** @internal */\r\n    getEditingTab() {\r\n        return this.state.editingTab;\r\n    }\r\n    /** @internal */\r\n    render() {\r\n        // first render will be used to find the size (via selfRef)\r\n        if (!this.selfRef.current) {\r\n            return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__LAYOUT) }, this.metricsElements()));\r\n        }\r\n        this.props.model._setPointerFine(window && window.matchMedia && window.matchMedia(\"(pointer: fine)\").matches);\r\n        // this.start = Date.now();\r\n        const borderComponents = [];\r\n        const tabSetComponents = [];\r\n        const floatingWindows = [];\r\n        const tabComponents = {};\r\n        const splitterComponents = [];\r\n        const metrics = {\r\n            headerBarSize: this.state.calculatedHeaderBarSize,\r\n            tabBarSize: this.state.calculatedTabBarSize,\r\n            borderBarSize: this.state.calculatedBorderBarSize\r\n        };\r\n        this.props.model._setShowHiddenBorder(this.state.showHiddenBorder);\r\n        this.centerRect = this.props.model._layout(this.state.rect, metrics);\r\n        this.renderBorder(this.props.model.getBorderSet(), borderComponents, tabComponents, floatingWindows, splitterComponents);\r\n        this.renderChildren(\"\", this.props.model.getRoot(), tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n        const nextTopIds = [];\r\n        const nextTopIdsMap = {};\r\n        // Keep any previous tabs in the same DOM order as before, removing any that have been deleted\r\n        for (const t of this.tabIds) {\r\n            if (tabComponents[t]) {\r\n                nextTopIds.push(t);\r\n                nextTopIdsMap[t] = t;\r\n            }\r\n        }\r\n        this.tabIds = nextTopIds;\r\n        // Add tabs that have been added to the DOM\r\n        for (const t of Object.keys(tabComponents)) {\r\n            if (!nextTopIdsMap[t]) {\r\n                this.tabIds.push(t);\r\n            }\r\n        }\r\n        const edges = [];\r\n        if (this.state.showEdges) {\r\n            const r = this.centerRect;\r\n            const length = this.edgeRectLength;\r\n            const width = this.edgeRectWidth;\r\n            const offset = this.edgeRectLength / 2;\r\n            const className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__EDGE_RECT);\r\n            const radius = 50;\r\n            edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"North\", style: { top: r.y, left: r.x + r.width / 2 - offset, width: length, height: width, borderBottomLeftRadius: radius, borderBottomRightRadius: radius }, className: className }));\r\n            edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"West\", style: { top: r.y + r.height / 2 - offset, left: r.x, width: width, height: length, borderTopRightRadius: radius, borderBottomRightRadius: radius }, className: className }));\r\n            edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"South\", style: { top: r.y + r.height - width, left: r.x + r.width / 2 - offset, width: length, height: width, borderTopLeftRadius: radius, borderTopRightRadius: radius }, className: className }));\r\n            edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"East\", style: { top: r.y + r.height / 2 - offset, left: r.x + r.width - width, width: width, height: length, borderTopLeftRadius: radius, borderBottomLeftRadius: radius }, className: className }));\r\n        }\r\n        // this.layoutTime = (Date.now() - this.start);\r\n        return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__LAYOUT), onDragEnter: this.props.onExternalDrag ? this.onDragEnter : undefined },\r\n            tabSetComponents,\r\n            this.tabIds.map((t) => {\r\n                return tabComponents[t];\r\n            }),\r\n            borderComponents,\r\n            splitterComponents,\r\n            edges,\r\n            floatingWindows,\r\n            this.metricsElements(),\r\n            this.state.portal));\r\n    }\r\n    /** @internal */\r\n    metricsElements() {\r\n        // used to measure the tab and border tab sizes\r\n        const fontStyle = this.styleFont({ visibility: \"hidden\" });\r\n        return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findHeaderBarSize\", ref: this.findHeaderBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__TABSET_HEADER_SIZER) }, \"FindHeaderBarSize\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findTabBarSize\", ref: this.findTabBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__TABSET_SIZER) }, \"FindTabBarSize\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findBorderBarSize\", ref: this.findBorderBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__BORDER_SIZER) }, \"FindBorderBarSize\")));\r\n    }\r\n    /** @internal */\r\n    renderBorder(borderSet, borderComponents, tabComponents, floatingWindows, splitterComponents) {\r\n        for (const border of borderSet.getBorders()) {\r\n            const borderPath = `/border/${border.getLocation().getName()}`;\r\n            if (border.isShowing()) {\r\n                borderComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderTabSet__WEBPACK_IMPORTED_MODULE_11__.BorderTabSet, { key: `border_${border.getLocation().getName()}`, path: borderPath, border: border, layout: this, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory, icons: this.icons }));\r\n                const drawChildren = border._getDrawChildren();\r\n                let i = 0;\r\n                let tabCount = 0;\r\n                for (const child of drawChildren) {\r\n                    if (child instanceof _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__.SplitterNode) {\r\n                        let path = borderPath + \"/s\";\r\n                        splitterComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Splitter__WEBPACK_IMPORTED_MODULE_12__.Splitter, { key: child.getId(), layout: this, node: child, path: path }));\r\n                    }\r\n                    else if (child instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n                        let path = borderPath + \"/t\" + tabCount++;\r\n                        if (this.supportsPopout && child.isFloating()) {\r\n                            const rect = this._getScreenRect(child);\r\n                            floatingWindows.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindow__WEBPACK_IMPORTED_MODULE_15__.FloatingWindow, { key: child.getId(), url: this.popoutURL, rect: rect, title: child.getName(), id: child.getId(), onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\r\n                                react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__.FloatingWindowTab, { layout: this, node: child, factory: this.props.factory })));\r\n                            tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabFloating__WEBPACK_IMPORTED_MODULE_17__.TabFloating, { key: child.getId(), layout: this, path: path, node: child, selected: i === border.getSelected() });\r\n                        }\r\n                        else {\r\n                            tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tab__WEBPACK_IMPORTED_MODULE_13__.Tab, { key: child.getId(), layout: this, path: path, node: child, selected: i === border.getSelected(), factory: this.props.factory });\r\n                        }\r\n                    }\r\n                    i++;\r\n                }\r\n            }\r\n        }\r\n    }\r\n    /** @internal */\r\n    renderChildren(path, node, tabSetComponents, tabComponents, floatingWindows, splitterComponents) {\r\n        const drawChildren = node._getDrawChildren();\r\n        let splitterCount = 0;\r\n        let tabCount = 0;\r\n        let rowCount = 0;\r\n        for (const child of drawChildren) {\r\n            if (child instanceof _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__.SplitterNode) {\r\n                const newPath = path + \"/s\" + (splitterCount++);\r\n                splitterComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Splitter__WEBPACK_IMPORTED_MODULE_12__.Splitter, { key: child.getId(), layout: this, path: newPath, node: child }));\r\n            }\r\n            else if (child instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__.TabSetNode) {\r\n                const newPath = path + \"/ts\" + (rowCount++);\r\n                tabSetComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabSet__WEBPACK_IMPORTED_MODULE_14__.TabSet, { key: child.getId(), layout: this, path: newPath, node: child, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory, icons: this.icons }));\r\n                this.renderChildren(newPath, child, tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n            }\r\n            else if (child instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n                const newPath = path + \"/t\" + (tabCount++);\r\n                const selectedTab = child.getParent().getChildren()[child.getParent().getSelected()];\r\n                if (selectedTab === undefined) {\r\n                    // this should not happen!\r\n                    console.warn(\"undefined selectedTab should not happen\");\r\n                }\r\n                if (this.supportsPopout && child.isFloating()) {\r\n                    const rect = this._getScreenRect(child);\r\n                    floatingWindows.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindow__WEBPACK_IMPORTED_MODULE_15__.FloatingWindow, { key: child.getId(), url: this.popoutURL, rect: rect, title: child.getName(), id: child.getId(), onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\r\n                        react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__.FloatingWindowTab, { layout: this, node: child, factory: this.props.factory })));\r\n                    tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabFloating__WEBPACK_IMPORTED_MODULE_17__.TabFloating, { key: child.getId(), layout: this, path: newPath, node: child, selected: child === selectedTab });\r\n                }\r\n                else {\r\n                    tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tab__WEBPACK_IMPORTED_MODULE_13__.Tab, { key: child.getId(), layout: this, path: newPath, node: child, selected: child === selectedTab, factory: this.props.factory });\r\n                }\r\n            }\r\n            else {\r\n                // is row\r\n                const newPath = path + ((child.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_18__.Orientation.HORZ) ? \"/r\" : \"/c\") + (rowCount++);\r\n                this.renderChildren(newPath, child, tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n            }\r\n        }\r\n    }\r\n    /** @internal */\r\n    _getScreenRect(node) {\r\n        const rect = node.getRect().clone();\r\n        const bodyRect = this.selfRef.current.getBoundingClientRect();\r\n        const navHeight = Math.min(80, this.currentWindow.outerHeight - this.currentWindow.innerHeight);\r\n        const navWidth = Math.min(80, this.currentWindow.outerWidth - this.currentWindow.innerWidth);\r\n        rect.x = rect.x + bodyRect.x + this.currentWindow.screenX + navWidth;\r\n        rect.y = rect.y + bodyRect.y + this.currentWindow.screenY + navHeight;\r\n        return rect;\r\n    }\r\n    /**\r\n     * Adds a new tab to the given tabset\r\n     * @param tabsetId the id of the tabset where the new tab will be added\r\n     * @param json the json for the new tab node\r\n     */\r\n    addTabToTabSet(tabsetId, json) {\r\n        const tabsetNode = this.props.model.getNodeById(tabsetId);\r\n        if (tabsetNode !== undefined) {\r\n            this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(json, tabsetId, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, -1));\r\n        }\r\n    }\r\n    /**\r\n     * Adds a new tab to the active tabset (if there is one)\r\n     * @param json the json for the new tab node\r\n     */\r\n    addTabToActiveTabSet(json) {\r\n        const tabsetNode = this.props.model.getActiveTabset();\r\n        if (tabsetNode !== undefined) {\r\n            this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(json, tabsetNode.getId(), _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, -1));\r\n        }\r\n    }\r\n    /**\r\n     * Adds a new tab by dragging a labeled panel to the drop location, dragging starts immediatelly\r\n     * @param dragText the text to show on the drag panel\r\n     * @param json the json for the new tab node\r\n     * @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)\r\n     */\r\n    addTabWithDragAndDrop(dragText, json, onDrop) {\r\n        this.fnNewNodeDropped = onDrop;\r\n        this.newTabJson = json;\r\n        this.dragStart(undefined, dragText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(json, this.props.model, false), true, undefined, undefined);\r\n    }\r\n    /**\r\n     * Move a tab/tabset using drag and drop\r\n     * @param node the tab or tabset to drag\r\n     * @param dragText the text to show on the drag panel\r\n     */\r\n    moveTabWithDragAndDrop(node, dragText) {\r\n        this.dragStart(undefined, dragText, node, true, undefined, undefined);\r\n    }\r\n    /**\r\n     * Adds a new tab by dragging a labeled panel to the drop location, dragging starts when you\r\n     * mouse down on the panel\r\n     *\r\n     * @param dragText the text to show on the drag panel\r\n     * @param json the json for the new tab node\r\n     * @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)\r\n     */\r\n    addTabWithDragAndDropIndirect(dragText, json, onDrop) {\r\n        this.fnNewNodeDropped = onDrop;\r\n        this.newTabJson = json;\r\n        _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.addGlass(this.onCancelAdd);\r\n        this.dragDivText = dragText;\r\n        this.dragDiv = this.currentDocument.createElement(\"div\");\r\n        this.dragDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__DRAG_RECT);\r\n        this.dragDiv.addEventListener(\"mousedown\", this.onDragDivMouseDown);\r\n        this.dragDiv.addEventListener(\"touchstart\", this.onDragDivMouseDown, { passive: false });\r\n        this.dragRectRender(this.dragDivText, undefined, this.newTabJson, () => {\r\n            if (this.dragDiv) {\r\n                // now it's been rendered into the dom it can be centered\r\n                this.dragDiv.style.visibility = \"visible\";\r\n                const domRect = this.dragDiv.getBoundingClientRect();\r\n                const r = new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, domRect === null || domRect === void 0 ? void 0 : domRect.width, domRect === null || domRect === void 0 ? void 0 : domRect.height);\r\n                r.centerInRect(this.state.rect);\r\n                this.dragDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\r\n                this.dragDiv.style.left = r.x + \"px\";\r\n                this.dragDiv.style.top = r.y + \"px\";\r\n            }\r\n        });\r\n        const rootdiv = this.selfRef.current;\r\n        rootdiv.appendChild(this.dragDiv);\r\n    }\r\n    /** @internal */\r\n    handleCustomTabDrag(dropInfo, pos, event) {\r\n        var _a, _b, _c;\r\n        let invalidated = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated;\r\n        const currentCallback = (_b = this.customDrop) === null || _b === void 0 ? void 0 : _b.callback;\r\n        this.customDrop = undefined;\r\n        const dragging = this.newTabJson || (this.dragNode instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode ? this.dragNode : undefined);\r\n        if (dragging && (dropInfo.node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__.TabSetNode || dropInfo.node instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode) && dropInfo.index === -1) {\r\n            const selected = dropInfo.node.getSelectedNode();\r\n            const tabRect = selected === null || selected === void 0 ? void 0 : selected.getRect();\r\n            if (selected && (tabRect === null || tabRect === void 0 ? void 0 : tabRect.contains(pos.x, pos.y))) {\r\n                let customDrop = undefined;\r\n                try {\r\n                    const dest = this.onTabDrag(dragging, selected, pos.x - tabRect.x, pos.y - tabRect.y, dropInfo.location, () => this.onDragMove(event));\r\n                    if (dest) {\r\n                        customDrop = {\r\n                            rect: new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(dest.x + tabRect.x, dest.y + tabRect.y, dest.width, dest.height),\r\n                            callback: dest.callback,\r\n                            invalidated: dest.invalidated,\r\n                            dragging: dragging,\r\n                            over: selected,\r\n                            x: pos.x - tabRect.x,\r\n                            y: pos.y - tabRect.y,\r\n                            location: dropInfo.location,\r\n                            cursor: dest.cursor\r\n                        };\r\n                    }\r\n                }\r\n                catch (e) {\r\n                    console.error(e);\r\n                }\r\n                if ((customDrop === null || customDrop === void 0 ? void 0 : customDrop.callback) === currentCallback) {\r\n                    invalidated = undefined;\r\n                }\r\n                this.customDrop = customDrop;\r\n            }\r\n        }\r\n        this.dropInfo = dropInfo;\r\n        this.outlineDiv.className = this.getClassName(this.customDrop ? _Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__OUTLINE_RECT : dropInfo.className);\r\n        if (this.customDrop) {\r\n            this.customDrop.rect.positionElement(this.outlineDiv);\r\n        }\r\n        else {\r\n            dropInfo.rect.positionElement(this.outlineDiv);\r\n        }\r\n        _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.setGlassCursorOverride((_c = this.customDrop) === null || _c === void 0 ? void 0 : _c.cursor);\r\n        this.outlineDiv.style.visibility = \"visible\";\r\n        try {\r\n            invalidated === null || invalidated === void 0 ? void 0 : invalidated();\r\n        }\r\n        catch (e) {\r\n            console.error(e);\r\n        }\r\n    }\r\n    /** @internal */\r\n    onDragEnter(event) {\r\n        // DragDrop keeps track of number of dragenters minus the number of\r\n        // dragleaves. Only start a new drag if there isn't one already.\r\n        if (_DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.isDragging())\r\n            return;\r\n        const drag = this.props.onExternalDrag(event);\r\n        if (drag) {\r\n            // Mimic addTabWithDragAndDrop, but pass in DragEvent\r\n            this.fnNewNodeDropped = drag.onDrop;\r\n            this.newTabJson = drag.json;\r\n            this.dragStart(event, drag.dragText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(drag.json, this.props.model, false), true, undefined, undefined);\r\n        }\r\n    }\r\n    /** @internal */\r\n    checkForBorderToShow(x, y) {\r\n        const r = this.props.model._getOuterInnerRects().outer;\r\n        const c = r.getCenter();\r\n        const margin = this.edgeRectWidth;\r\n        const offset = this.edgeRectLength / 2;\r\n        let overEdge = false;\r\n        if (this.props.model.isEnableEdgeDock() && this.state.showHiddenBorder === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER) {\r\n            if ((y > c.y - offset && y < c.y + offset) ||\r\n                (x > c.x - offset && x < c.x + offset)) {\r\n                overEdge = true;\r\n            }\r\n        }\r\n        let location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n        if (!overEdge) {\r\n            if (x <= r.x + margin) {\r\n                location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT;\r\n            }\r\n            else if (x >= r.getRight() - margin) {\r\n                location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT;\r\n            }\r\n            else if (y <= r.y + margin) {\r\n                location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP;\r\n            }\r\n            else if (y >= r.getBottom() - margin) {\r\n                location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM;\r\n            }\r\n        }\r\n        if (location !== this.state.showHiddenBorder) {\r\n            this.setState({ showHiddenBorder: location });\r\n        }\r\n    }\r\n    /** @internal */\r\n    maximize(tabsetNode) {\r\n        this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.maximizeToggle(tabsetNode.getId()));\r\n    }\r\n    /** @internal */\r\n    customizeTab(tabNode, renderValues) {\r\n        if (this.props.onRenderTab) {\r\n            this.props.onRenderTab(tabNode, renderValues);\r\n        }\r\n    }\r\n    /** @internal */\r\n    customizeTabSet(tabSetNode, renderValues) {\r\n        if (this.props.onRenderTabSet) {\r\n            this.props.onRenderTabSet(tabSetNode, renderValues);\r\n        }\r\n    }\r\n    /** @internal */\r\n    i18nName(id, param) {\r\n        let message;\r\n        if (this.props.i18nMapper) {\r\n            message = this.props.i18nMapper(id, param);\r\n        }\r\n        if (message === undefined) {\r\n            message = id + (param === undefined ? \"\" : param);\r\n        }\r\n        return message;\r\n    }\r\n    /** @internal */\r\n    getOnRenderFloatingTabPlaceholder() {\r\n        return this.props.onRenderFloatingTabPlaceholder;\r\n    }\r\n    /** @internal */\r\n    getShowOverflowMenu() {\r\n        return this.props.onShowOverflowMenu;\r\n    }\r\n    /** @internal */\r\n    getTabSetPlaceHolderCallback() {\r\n        return this.props.onTabSetPlaceHolder;\r\n    }\r\n    /** @internal */\r\n    showContextMenu(node, event) {\r\n        if (this.props.onContextMenu) {\r\n            this.props.onContextMenu(node, event);\r\n        }\r\n    }\r\n    /** @internal */\r\n    auxMouseClick(node, event) {\r\n        if (this.props.onAuxMouseClick) {\r\n            this.props.onAuxMouseClick(node, event);\r\n        }\r\n    }\r\n}\r\n/** @internal */\r\nconst DragRectRenderWrapper = (props) => {\r\n    react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\r\n        var _a;\r\n        (_a = props.onRendered) === null || _a === void 0 ? void 0 : _a.call(props);\r\n    }, [props]);\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, props.children));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Layout.tsx?");
 
 /***/ }),
 
@@ -504,9 +404,9 @@ eval("\nvar __extends = (this && this.__extends) || (function () {\n    var exte
 /*!*******************************!*\
   !*** ./src/view/Splitter.tsx ***!
   \*******************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Splitter = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar DragDrop_1 = __webpack_require__(/*! ../DragDrop */ \"./src/DragDrop.ts\");\nvar Actions_1 = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\nvar BorderNode_1 = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/** @internal */\nvar Splitter = function (props) {\n    var layout = props.layout, node = props.node, path = props.path;\n    var pBounds = React.useRef([]);\n    var outlineDiv = React.useRef(undefined);\n    var parentNode = node.getParent();\n    var onMouseDown = function (event) {\n        DragDrop_1.DragDrop.instance.setGlassCursorOverride(node.getOrientation() === Orientation_1.Orientation.HORZ ? \"ns-resize\" : \"ew-resize\");\n        DragDrop_1.DragDrop.instance.startDrag(event, onDragStart, onDragMove, onDragEnd, onDragCancel, undefined, undefined, layout.getCurrentDocument(), layout.getRootDiv());\n        pBounds.current = parentNode._getSplitterBounds(node, true);\n        var rootdiv = layout.getRootDiv();\n        outlineDiv.current = layout.getCurrentDocument().createElement(\"div\");\n        outlineDiv.current.style.position = \"absolute\";\n        outlineDiv.current.className = layout.getClassName(Types_1.CLASSES.FLEXLAYOUT__SPLITTER_DRAG);\n        outlineDiv.current.style.cursor = node.getOrientation() === Orientation_1.Orientation.HORZ ? \"ns-resize\" : \"ew-resize\";\n        var r = node.getRect();\n        if (node.getOrientation() === Orientation_1.Orientation.VERT && r.width < 2) {\n            r.width = 2;\n        }\n        else if (node.getOrientation() === Orientation_1.Orientation.HORZ && r.height < 2) {\n            r.height = 2;\n        }\n        r.positionElement(outlineDiv.current);\n        rootdiv.appendChild(outlineDiv.current);\n    };\n    var onDragCancel = function (wasDragging) {\n        var rootdiv = layout.getRootDiv();\n        rootdiv.removeChild(outlineDiv.current);\n    };\n    var onDragStart = function () {\n        return true;\n    };\n    var onDragMove = function (event) {\n        var clientRect = layout.getDomRect();\n        var pos = {\n            x: event.clientX - clientRect.left,\n            y: event.clientY - clientRect.top,\n        };\n        if (outlineDiv) {\n            if (node.getOrientation() === Orientation_1.Orientation.HORZ) {\n                outlineDiv.current.style.top = getBoundPosition(pos.y - 4) + \"px\";\n            }\n            else {\n                outlineDiv.current.style.left = getBoundPosition(pos.x - 4) + \"px\";\n            }\n        }\n        if (layout.isRealtimeResize()) {\n            updateLayout();\n        }\n    };\n    var updateLayout = function () {\n        var value = 0;\n        if (outlineDiv) {\n            if (node.getOrientation() === Orientation_1.Orientation.HORZ) {\n                value = outlineDiv.current.offsetTop;\n            }\n            else {\n                value = outlineDiv.current.offsetLeft;\n            }\n        }\n        if (parentNode instanceof BorderNode_1.BorderNode) {\n            var pos = parentNode._calculateSplit(node, value);\n            layout.doAction(Actions_1.Actions.adjustBorderSplit(node.getParent().getId(), pos));\n        }\n        else {\n            var splitSpec = parentNode._calculateSplit(node, value);\n            if (splitSpec !== undefined) {\n                layout.doAction(Actions_1.Actions.adjustSplit(splitSpec));\n            }\n        }\n    };\n    var onDragEnd = function () {\n        updateLayout();\n        var rootdiv = layout.getRootDiv();\n        rootdiv.removeChild(outlineDiv.current);\n    };\n    var getBoundPosition = function (p) {\n        var bounds = pBounds.current;\n        var rtn = p;\n        if (p < bounds[0]) {\n            rtn = bounds[0];\n        }\n        if (p > bounds[1]) {\n            rtn = bounds[1];\n        }\n        return rtn;\n    };\n    var cm = layout.getClassName;\n    var r = node.getRect();\n    var style = r.styleWithPosition({\n        cursor: node.getOrientation() === Orientation_1.Orientation.HORZ ? \"ns-resize\" : \"ew-resize\",\n    });\n    var className = cm(Types_1.CLASSES.FLEXLAYOUT__SPLITTER) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__SPLITTER_ + node.getOrientation().getName());\n    if (parentNode instanceof BorderNode_1.BorderNode) {\n        className += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__SPLITTER_BORDER);\n    }\n    else {\n        if (node.getModel().getMaximizedTabset() !== undefined) {\n            style.display = \"none\";\n        }\n    }\n    var extra = node.getModel().getSplitterExtra();\n    if (extra === 0) {\n        return (React.createElement(\"div\", { style: style, \"data-layout-path\": path, className: className, onTouchStart: onMouseDown, onMouseDown: onMouseDown }));\n    }\n    else {\n        // add extended transparent div for hit testing\n        // extends forward only, so as not to interfere with scrollbars\n        var r2 = r.clone();\n        r2.x = 0;\n        r2.y = 0;\n        if (node.getOrientation() === Orientation_1.Orientation.VERT) {\n            r2.width += extra;\n        }\n        else {\n            r2.height += extra;\n        }\n        var style2 = r2.styleWithPosition({\n            cursor: node.getOrientation() === Orientation_1.Orientation.HORZ ? \"ns-resize\" : \"ew-resize\"\n        });\n        var className2 = cm(Types_1.CLASSES.FLEXLAYOUT__SPLITTER_EXTRA);\n        return (React.createElement(\"div\", { style: style, \"data-layout-path\": path, className: className },\n            React.createElement(\"div\", { style: style2, className: className2, onTouchStart: onMouseDown, onMouseDown: onMouseDown })));\n    }\n};\nexports.Splitter = Splitter;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Splitter.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Splitter\": () => (/* binding */ Splitter)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _DragDrop__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../DragDrop */ \"./src/DragDrop.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst Splitter = (props) => {\r\n    const { layout, node, path } = props;\r\n    const pBounds = react__WEBPACK_IMPORTED_MODULE_0__.useRef([]);\r\n    const outlineDiv = react__WEBPACK_IMPORTED_MODULE_0__.useRef(undefined);\r\n    const parentNode = node.getParent();\r\n    const onMouseDown = (event) => {\r\n        _DragDrop__WEBPACK_IMPORTED_MODULE_1__.DragDrop.instance.setGlassCursorOverride(node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ ? \"ns-resize\" : \"ew-resize\");\r\n        _DragDrop__WEBPACK_IMPORTED_MODULE_1__.DragDrop.instance.startDrag(event, onDragStart, onDragMove, onDragEnd, onDragCancel, undefined, undefined, layout.getCurrentDocument(), layout.getRootDiv());\r\n        pBounds.current = parentNode._getSplitterBounds(node, true);\r\n        const rootdiv = layout.getRootDiv();\r\n        outlineDiv.current = layout.getCurrentDocument().createElement(\"div\");\r\n        outlineDiv.current.style.position = \"absolute\";\r\n        outlineDiv.current.className = layout.getClassName(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_DRAG);\r\n        outlineDiv.current.style.cursor = node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ ? \"ns-resize\" : \"ew-resize\";\r\n        const r = node.getRect();\r\n        if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT && r.width < 2) {\r\n            r.width = 2;\r\n        }\r\n        else if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ && r.height < 2) {\r\n            r.height = 2;\r\n        }\r\n        r.positionElement(outlineDiv.current);\r\n        rootdiv.appendChild(outlineDiv.current);\r\n    };\r\n    const onDragCancel = (wasDragging) => {\r\n        const rootdiv = layout.getRootDiv();\r\n        rootdiv.removeChild(outlineDiv.current);\r\n    };\r\n    const onDragStart = () => {\r\n        return true;\r\n    };\r\n    const onDragMove = (event) => {\r\n        const clientRect = layout.getDomRect();\r\n        const pos = {\r\n            x: event.clientX - clientRect.left,\r\n            y: event.clientY - clientRect.top,\r\n        };\r\n        if (outlineDiv) {\r\n            if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\r\n                outlineDiv.current.style.top = getBoundPosition(pos.y - 4) + \"px\";\r\n            }\r\n            else {\r\n                outlineDiv.current.style.left = getBoundPosition(pos.x - 4) + \"px\";\r\n            }\r\n        }\r\n        if (layout.isRealtimeResize()) {\r\n            updateLayout();\r\n        }\r\n    };\r\n    const updateLayout = () => {\r\n        let value = 0;\r\n        if (outlineDiv) {\r\n            if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\r\n                value = outlineDiv.current.offsetTop;\r\n            }\r\n            else {\r\n                value = outlineDiv.current.offsetLeft;\r\n            }\r\n        }\r\n        if (parentNode instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__.BorderNode) {\r\n            const pos = parentNode._calculateSplit(node, value);\r\n            layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.adjustBorderSplit(node.getParent().getId(), pos));\r\n        }\r\n        else {\r\n            const splitSpec = parentNode._calculateSplit(node, value);\r\n            if (splitSpec !== undefined) {\r\n                layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.adjustSplit(splitSpec));\r\n            }\r\n        }\r\n    };\r\n    const onDragEnd = () => {\r\n        updateLayout();\r\n        const rootdiv = layout.getRootDiv();\r\n        rootdiv.removeChild(outlineDiv.current);\r\n    };\r\n    const getBoundPosition = (p) => {\r\n        const bounds = pBounds.current;\r\n        let rtn = p;\r\n        if (p < bounds[0]) {\r\n            rtn = bounds[0];\r\n        }\r\n        if (p > bounds[1]) {\r\n            rtn = bounds[1];\r\n        }\r\n        return rtn;\r\n    };\r\n    const cm = layout.getClassName;\r\n    let r = node.getRect();\r\n    const style = r.styleWithPosition({\r\n        cursor: node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ ? \"ns-resize\" : \"ew-resize\",\r\n    });\r\n    let className = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_ + node.getOrientation().getName());\r\n    if (parentNode instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__.BorderNode) {\r\n        className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_BORDER);\r\n    }\r\n    else {\r\n        if (node.getModel().getMaximizedTabset() !== undefined) {\r\n            style.display = \"none\";\r\n        }\r\n    }\r\n    const extra = node.getModel().getSplitterExtra();\r\n    if (extra === 0) {\r\n        return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: style, \"data-layout-path\": path, className: className, onTouchStart: onMouseDown, onMouseDown: onMouseDown }));\r\n    }\r\n    else {\r\n        // add extended transparent div for hit testing\r\n        // extends forward only, so as not to interfere with scrollbars\r\n        let r2 = r.clone();\r\n        r2.x = 0;\r\n        r2.y = 0;\r\n        if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\r\n            r2.width += extra;\r\n        }\r\n        else {\r\n            r2.height += extra;\r\n        }\r\n        const style2 = r2.styleWithPosition({\r\n            cursor: node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ ? \"ns-resize\" : \"ew-resize\"\r\n        });\r\n        const className2 = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_EXTRA);\r\n        return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: style, \"data-layout-path\": path, className: className },\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: style2, className: className2, onTouchStart: onMouseDown, onMouseDown: onMouseDown })));\r\n    }\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Splitter.tsx?");
 
 /***/ }),
 
@@ -514,9 +414,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!**************************!*\
   !*** ./src/view/Tab.tsx ***!
   \**************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Tab = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar react_1 = __webpack_require__(/*! react */ \"react\");\nvar Actions_1 = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\nvar TabSetNode_1 = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar ErrorBoundary_1 = __webpack_require__(/*! ./ErrorBoundary */ \"./src/view/ErrorBoundary.tsx\");\nvar I18nLabel_1 = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\nvar BorderNode_1 = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/** @internal */\nvar Tab = function (props) {\n    var layout = props.layout, selected = props.selected, node = props.node, factory = props.factory, path = props.path;\n    var _a = React.useState(!props.node.isEnableRenderOnDemand() || props.selected), renderComponent = _a[0], setRenderComponent = _a[1];\n    React.useLayoutEffect(function () {\n        if (!renderComponent && selected) {\n            // load on demand\n            // console.log(\"load on demand: \" + node.getName());\n            setRenderComponent(true);\n        }\n    });\n    var onMouseDown = function () {\n        var parent = node.getParent();\n        if (parent.getType() === TabSetNode_1.TabSetNode.TYPE) {\n            if (!parent.isActive()) {\n                layout.doAction(Actions_1.Actions.setActiveTabset(parent.getId()));\n            }\n        }\n    };\n    var cm = layout.getClassName;\n    var useVisibility = node.getModel().isUseVisibility();\n    var parentNode = node.getParent();\n    var style = node._styleWithPosition();\n    if (!selected) {\n        (0, Utils_1.hideElement)(style, useVisibility);\n    }\n    if (parentNode instanceof TabSetNode_1.TabSetNode) {\n        if (node.getModel().getMaximizedTabset() !== undefined && !parentNode.isMaximized()) {\n            (0, Utils_1.hideElement)(style, useVisibility);\n        }\n    }\n    var child;\n    if (renderComponent) {\n        child = factory(node);\n    }\n    var className = cm(Types_1.CLASSES.FLEXLAYOUT__TAB);\n    if (parentNode instanceof BorderNode_1.BorderNode) {\n        className += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BORDER);\n        className += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BORDER_ + parentNode.getLocation().getName());\n    }\n    return (React.createElement(\"div\", { className: className, \"data-layout-path\": path, onMouseDown: onMouseDown, onTouchStart: onMouseDown, style: style },\n        React.createElement(ErrorBoundary_1.ErrorBoundary, { message: props.layout.i18nName(I18nLabel_1.I18nLabel.Error_rendering_component) },\n            React.createElement(react_1.Fragment, null, child))));\n};\nexports.Tab = Tab;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Tab.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Tab\": () => (/* binding */ Tab)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _ErrorBoundary__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ErrorBoundary */ \"./src/view/ErrorBoundary.tsx\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst Tab = (props) => {\r\n    const { layout, selected, node, factory, path } = props;\r\n    const [renderComponent, setRenderComponent] = react__WEBPACK_IMPORTED_MODULE_0__.useState(!props.node.isEnableRenderOnDemand() || props.selected);\r\n    react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\r\n        if (!renderComponent && selected) {\r\n            // load on demand\r\n            // console.log(\"load on demand: \" + node.getName());\r\n            setRenderComponent(true);\r\n        }\r\n    });\r\n    const onMouseDown = () => {\r\n        const parent = node.getParent();\r\n        if (parent.getType() === _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode.TYPE) {\r\n            if (!parent.isActive()) {\r\n                layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_1__.Actions.setActiveTabset(parent.getId()));\r\n            }\r\n        }\r\n    };\r\n    const cm = layout.getClassName;\r\n    const useVisibility = node.getModel().isUseVisibility();\r\n    const parentNode = node.getParent();\r\n    const style = node._styleWithPosition();\r\n    if (!selected) {\r\n        (0,_Utils__WEBPACK_IMPORTED_MODULE_7__.hideElement)(style, useVisibility);\r\n    }\r\n    if (parentNode instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode) {\r\n        if (node.getModel().getMaximizedTabset() !== undefined && !parentNode.isMaximized()) {\r\n            (0,_Utils__WEBPACK_IMPORTED_MODULE_7__.hideElement)(style, useVisibility);\r\n        }\r\n    }\r\n    let child;\r\n    if (renderComponent) {\r\n        child = factory(node);\r\n    }\r\n    let className = cm(_Types__WEBPACK_IMPORTED_MODULE_3__.CLASSES.FLEXLAYOUT__TAB);\r\n    if (parentNode instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode) {\r\n        className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_3__.CLASSES.FLEXLAYOUT__TAB_BORDER);\r\n        className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_3__.CLASSES.FLEXLAYOUT__TAB_BORDER_ + parentNode.getLocation().getName());\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: className, \"data-layout-path\": path, onMouseDown: onMouseDown, onTouchStart: onMouseDown, style: style },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(_ErrorBoundary__WEBPACK_IMPORTED_MODULE_4__.ErrorBoundary, { message: props.layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Error_rendering_component) },\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, child))));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Tab.tsx?");
 
 /***/ }),
 
@@ -524,9 +424,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!********************************!*\
   !*** ./src/view/TabButton.tsx ***!
   \********************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.TabButton = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar I18nLabel_1 = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\nvar Actions_1 = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar ICloseType_1 = __webpack_require__(/*! ../model/ICloseType */ \"./src/model/ICloseType.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/** @internal */\nvar TabButton = function (props) {\n    var layout = props.layout, node = props.node, selected = props.selected, iconFactory = props.iconFactory, titleFactory = props.titleFactory, icons = props.icons, path = props.path;\n    var selfRef = React.useRef(null);\n    var contentRef = React.useRef(null);\n    var onMouseDown = function (event) {\n        if (!(0, Utils_1.isAuxMouseEvent)(event) && !layout.getEditingTab()) {\n            layout.dragStart(event, undefined, node, node.isEnableDrag(), onClick, onDoubleClick);\n        }\n    };\n    var onAuxMouseClick = function (event) {\n        if ((0, Utils_1.isAuxMouseEvent)(event)) {\n            layout.auxMouseClick(node, event);\n        }\n    };\n    var onContextMenu = function (event) {\n        layout.showContextMenu(node, event);\n    };\n    var onClick = function () {\n        layout.doAction(Actions_1.Actions.selectTab(node.getId()));\n    };\n    var onDoubleClick = function (event) {\n        if (node.isEnableRename()) {\n            onRename();\n        }\n    };\n    var onRename = function () {\n        layout.setEditingTab(node);\n        layout.getCurrentDocument().body.addEventListener(\"mousedown\", onEndEdit);\n        layout.getCurrentDocument().body.addEventListener(\"touchstart\", onEndEdit);\n    };\n    var onEndEdit = function (event) {\n        if (event.target !== contentRef.current) {\n            layout.getCurrentDocument().body.removeEventListener(\"mousedown\", onEndEdit);\n            layout.getCurrentDocument().body.removeEventListener(\"touchstart\", onEndEdit);\n            layout.setEditingTab(undefined);\n        }\n    };\n    var isClosable = function () {\n        var closeType = node.getCloseType();\n        if (selected || closeType === ICloseType_1.ICloseType.Always) {\n            return true;\n        }\n        if (closeType === ICloseType_1.ICloseType.Visible) {\n            // not selected but x should be visible due to hover\n            if (window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches) {\n                return true;\n            }\n        }\n        return false;\n    };\n    var onClose = function (event) {\n        if (isClosable()) {\n            layout.doAction(Actions_1.Actions.deleteTab(node.getId()));\n        }\n        else {\n            onClick();\n        }\n    };\n    var onCloseMouseDown = function (event) {\n        event.stopPropagation();\n    };\n    React.useLayoutEffect(function () {\n        updateRect();\n        if (layout.getEditingTab() === node) {\n            contentRef.current.select();\n        }\n    });\n    var updateRect = function () {\n        // record position of tab in node\n        var layoutRect = layout.getDomRect();\n        var r = selfRef.current.getBoundingClientRect();\n        node._setTabRect(new Rect_1.Rect(r.left - layoutRect.left, r.top - layoutRect.top, r.width, r.height));\n    };\n    var onTextBoxMouseDown = function (event) {\n        // console.log(\"onTextBoxMouseDown\");\n        event.stopPropagation();\n    };\n    var onTextBoxKeyPress = function (event) {\n        // console.log(event, event.keyCode);\n        if (event.keyCode === 27) {\n            // esc\n            layout.setEditingTab(undefined);\n        }\n        else if (event.keyCode === 13) {\n            // enter\n            layout.setEditingTab(undefined);\n            layout.doAction(Actions_1.Actions.renameTab(node.getId(), event.target.value));\n        }\n    };\n    var cm = layout.getClassName;\n    var parentNode = node.getParent();\n    var baseClassName = Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON;\n    var classNames = cm(baseClassName);\n    classNames += \" \" + cm(baseClassName + \"_\" + parentNode.getTabLocation());\n    if (selected) {\n        classNames += \" \" + cm(baseClassName + \"--selected\");\n    }\n    else {\n        classNames += \" \" + cm(baseClassName + \"--unselected\");\n    }\n    if (node.getClassName() !== undefined) {\n        classNames += \" \" + node.getClassName();\n    }\n    var renderState = (0, Utils_1.getRenderStateEx)(layout, node, iconFactory, titleFactory);\n    var content = renderState.content ? (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_CONTENT) }, renderState.content)) : null;\n    var leading = renderState.leading ? (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_LEADING) }, renderState.leading)) : null;\n    if (layout.getEditingTab() === node) {\n        content = (React.createElement(\"input\", { ref: contentRef, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_TEXTBOX), \"data-layout-path\": path + \"/textbox\", type: \"text\", autoFocus: true, defaultValue: node.getName(), onKeyDown: onTextBoxKeyPress, onMouseDown: onTextBoxMouseDown, onTouchStart: onTextBoxMouseDown }));\n    }\n    if (node.isEnableClose()) {\n        var closeTitle = layout.i18nName(I18nLabel_1.I18nLabel.Close_Tab);\n        renderState.buttons.push(React.createElement(\"div\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: closeTitle, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_TRAILING), onMouseDown: onCloseMouseDown, onClick: onClose, onTouchStart: onCloseMouseDown }, (typeof icons.close === \"function\") ? icons.close(node) : icons.close));\n    }\n    return (React.createElement(\"div\", { ref: selfRef, \"data-layout-path\": path, className: classNames, onMouseDown: onMouseDown, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onTouchStart: onMouseDown, title: node.getHelpText() },\n        leading,\n        content,\n        renderState.buttons));\n};\nexports.TabButton = TabButton;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabButton.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TabButton\": () => (/* binding */ TabButton)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/ICloseType */ \"./src/model/ICloseType.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst TabButton = (props) => {\r\n    const { layout, node, selected, iconFactory, titleFactory, icons, path } = props;\r\n    const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const contentRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const onMouseDown = (event) => {\r\n        if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isAuxMouseEvent)(event) && !layout.getEditingTab()) {\r\n            layout.dragStart(event, undefined, node, node.isEnableDrag(), onClick, onDoubleClick);\r\n        }\r\n    };\r\n    const onAuxMouseClick = (event) => {\r\n        if ((0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isAuxMouseEvent)(event)) {\r\n            layout.auxMouseClick(node, event);\r\n        }\r\n    };\r\n    const onContextMenu = (event) => {\r\n        layout.showContextMenu(node, event);\r\n    };\r\n    const onClick = () => {\r\n        layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(node.getId()));\r\n    };\r\n    const onDoubleClick = (event) => {\r\n        if (node.isEnableRename()) {\r\n            onRename();\r\n        }\r\n    };\r\n    const onRename = () => {\r\n        layout.setEditingTab(node);\r\n        layout.getCurrentDocument().body.addEventListener(\"mousedown\", onEndEdit);\r\n        layout.getCurrentDocument().body.addEventListener(\"touchstart\", onEndEdit);\r\n    };\r\n    const onEndEdit = (event) => {\r\n        if (event.target !== contentRef.current) {\r\n            layout.getCurrentDocument().body.removeEventListener(\"mousedown\", onEndEdit);\r\n            layout.getCurrentDocument().body.removeEventListener(\"touchstart\", onEndEdit);\r\n            layout.setEditingTab(undefined);\r\n        }\r\n    };\r\n    const isClosable = () => {\r\n        const closeType = node.getCloseType();\r\n        if (selected || closeType === _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__.ICloseType.Always) {\r\n            return true;\r\n        }\r\n        if (closeType === _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__.ICloseType.Visible) {\r\n            // not selected but x should be visible due to hover\r\n            if (window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches) {\r\n                return true;\r\n            }\r\n        }\r\n        return false;\r\n    };\r\n    const onClose = (event) => {\r\n        if (isClosable()) {\r\n            layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTab(node.getId()));\r\n        }\r\n        else {\r\n            onClick();\r\n        }\r\n    };\r\n    const onCloseMouseDown = (event) => {\r\n        event.stopPropagation();\r\n    };\r\n    react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\r\n        updateRect();\r\n        if (layout.getEditingTab() === node) {\r\n            contentRef.current.select();\r\n        }\r\n    });\r\n    const updateRect = () => {\r\n        // record position of tab in node\r\n        const layoutRect = layout.getDomRect();\r\n        const r = selfRef.current.getBoundingClientRect();\r\n        node._setTabRect(new _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect(r.left - layoutRect.left, r.top - layoutRect.top, r.width, r.height));\r\n    };\r\n    const onTextBoxMouseDown = (event) => {\r\n        // console.log(\"onTextBoxMouseDown\");\r\n        event.stopPropagation();\r\n    };\r\n    const onTextBoxKeyPress = (event) => {\r\n        // console.log(event, event.keyCode);\r\n        if (event.keyCode === 27) {\r\n            // esc\r\n            layout.setEditingTab(undefined);\r\n        }\r\n        else if (event.keyCode === 13) {\r\n            // enter\r\n            layout.setEditingTab(undefined);\r\n            layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.renameTab(node.getId(), event.target.value));\r\n        }\r\n    };\r\n    const cm = layout.getClassName;\r\n    const parentNode = node.getParent();\r\n    let baseClassName = _Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__TAB_BUTTON;\r\n    let classNames = cm(baseClassName);\r\n    classNames += \" \" + cm(baseClassName + \"_\" + parentNode.getTabLocation());\r\n    if (selected) {\r\n        classNames += \" \" + cm(baseClassName + \"--selected\");\r\n    }\r\n    else {\r\n        classNames += \" \" + cm(baseClassName + \"--unselected\");\r\n    }\r\n    if (node.getClassName() !== undefined) {\r\n        classNames += \" \" + node.getClassName();\r\n    }\r\n    const renderState = (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.getRenderStateEx)(layout, node, iconFactory, titleFactory);\r\n    let content = renderState.content ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__TAB_BUTTON_CONTENT) }, renderState.content)) : null;\r\n    const leading = renderState.leading ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__TAB_BUTTON_LEADING) }, renderState.leading)) : null;\r\n    if (layout.getEditingTab() === node) {\r\n        content = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"input\", { ref: contentRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__TAB_BUTTON_TEXTBOX), \"data-layout-path\": path + \"/textbox\", type: \"text\", autoFocus: true, defaultValue: node.getName(), onKeyDown: onTextBoxKeyPress, onMouseDown: onTextBoxMouseDown, onTouchStart: onTextBoxMouseDown }));\r\n    }\r\n    if (node.isEnableClose()) {\r\n        const closeTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tab);\r\n        renderState.buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: closeTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__TAB_BUTTON_TRAILING), onMouseDown: onCloseMouseDown, onClick: onClose, onTouchStart: onCloseMouseDown }, (typeof icons.close === \"function\") ? icons.close(node) : icons.close));\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, \"data-layout-path\": path, className: classNames, onMouseDown: onMouseDown, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onTouchStart: onMouseDown, title: node.getHelpText() },\r\n        leading,\r\n        content,\r\n        renderState.buttons));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabButton.tsx?");
 
 /***/ }),
 
@@ -534,9 +434,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*************************************!*\
   !*** ./src/view/TabButtonStamp.tsx ***!
   \*************************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.TabButtonStamp = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/** @internal */\nvar TabButtonStamp = function (props) {\n    var layout = props.layout, node = props.node, iconFactory = props.iconFactory, titleFactory = props.titleFactory;\n    var selfRef = React.useRef(null);\n    var cm = layout.getClassName;\n    var classNames = cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_STAMP);\n    var renderState = (0, Utils_1.getRenderStateEx)(layout, node, iconFactory, titleFactory);\n    var content = renderState.content ? (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_CONTENT) }, renderState.content))\n        : node._getNameForOverflowMenu();\n    var leading = renderState.leading ? (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_LEADING) }, renderState.leading)) : null;\n    return (React.createElement(\"div\", { ref: selfRef, className: classNames, title: node.getHelpText() },\n        leading,\n        content));\n};\nexports.TabButtonStamp = TabButtonStamp;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabButtonStamp.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TabButtonStamp\": () => (/* binding */ TabButtonStamp)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n/** @internal */\r\nconst TabButtonStamp = (props) => {\r\n    const { layout, node, iconFactory, titleFactory } = props;\r\n    const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const cm = layout.getClassName;\r\n    let classNames = cm(_Types__WEBPACK_IMPORTED_MODULE_1__.CLASSES.FLEXLAYOUT__TAB_BUTTON_STAMP);\r\n    const renderState = (0,_Utils__WEBPACK_IMPORTED_MODULE_2__.getRenderStateEx)(layout, node, iconFactory, titleFactory);\r\n    let content = renderState.content ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_1__.CLASSES.FLEXLAYOUT__TAB_BUTTON_CONTENT) }, renderState.content))\r\n        : node._getNameForOverflowMenu();\r\n    const leading = renderState.leading ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_1__.CLASSES.FLEXLAYOUT__TAB_BUTTON_LEADING) }, renderState.leading)) : null;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, className: classNames, title: node.getHelpText() },\r\n        leading,\r\n        content));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabButtonStamp.tsx?");
 
 /***/ }),
 
@@ -544,9 +444,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!**********************************!*\
   !*** ./src/view/TabFloating.tsx ***!
   \**********************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.TabFloating = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar Actions_1 = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\nvar TabSetNode_1 = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar I18nLabel_1 = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/** @internal */\nvar TabFloating = function (props) {\n    var layout = props.layout, selected = props.selected, node = props.node, path = props.path;\n    var showPopout = function () {\n        if (node.getWindow()) {\n            node.getWindow().focus();\n        }\n    };\n    var dockPopout = function () {\n        layout.doAction(Actions_1.Actions.unFloatTab(node.getId()));\n    };\n    var onMouseDown = function () {\n        var parent = node.getParent();\n        if (parent.getType() === TabSetNode_1.TabSetNode.TYPE) {\n            if (!parent.isActive()) {\n                layout.doAction(Actions_1.Actions.setActiveTabset(parent.getId()));\n            }\n        }\n    };\n    var onClickFocus = function (event) {\n        event.preventDefault();\n        showPopout();\n    };\n    var onClickDock = function (event) {\n        event.preventDefault();\n        dockPopout();\n    };\n    var cm = layout.getClassName;\n    var parentNode = node.getParent();\n    var style = node._styleWithPosition();\n    if (!selected) {\n        (0, Utils_1.hideElement)(style, node.getModel().isUseVisibility());\n    }\n    if (parentNode instanceof TabSetNode_1.TabSetNode) {\n        if (node.getModel().getMaximizedTabset() !== undefined && !parentNode.isMaximized()) {\n            (0, Utils_1.hideElement)(style, node.getModel().isUseVisibility());\n        }\n    }\n    var message = layout.i18nName(I18nLabel_1.I18nLabel.Floating_Window_Message);\n    var showMessage = layout.i18nName(I18nLabel_1.I18nLabel.Floating_Window_Show_Window);\n    var dockMessage = layout.i18nName(I18nLabel_1.I18nLabel.Floating_Window_Dock_Window);\n    var customRenderCallback = layout.getOnRenderFloatingTabPlaceholder();\n    if (customRenderCallback) {\n        return (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_FLOATING), onMouseDown: onMouseDown, onTouchStart: onMouseDown, style: style }, customRenderCallback(dockPopout, showPopout)));\n    }\n    else {\n        return (React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_FLOATING), \"data-layout-path\": path, onMouseDown: onMouseDown, onTouchStart: onMouseDown, style: style },\n            React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_FLOATING_INNER) },\n                React.createElement(\"div\", null, message),\n                React.createElement(\"div\", null,\n                    React.createElement(\"a\", { href: \"#\", onClick: onClickFocus }, showMessage)),\n                React.createElement(\"div\", null,\n                    React.createElement(\"a\", { href: \"#\", onClick: onClickDock }, dockMessage)))));\n    }\n};\nexports.TabFloating = TabFloating;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabFloating.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TabFloating\": () => (/* binding */ TabFloating)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst TabFloating = (props) => {\r\n    const { layout, selected, node, path } = props;\r\n    const showPopout = () => {\r\n        if (node.getWindow()) {\r\n            node.getWindow().focus();\r\n        }\r\n    };\r\n    const dockPopout = () => {\r\n        layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_1__.Actions.unFloatTab(node.getId()));\r\n    };\r\n    const onMouseDown = () => {\r\n        const parent = node.getParent();\r\n        if (parent.getType() === _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode.TYPE) {\r\n            if (!parent.isActive()) {\r\n                layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_1__.Actions.setActiveTabset(parent.getId()));\r\n            }\r\n        }\r\n    };\r\n    const onClickFocus = (event) => {\r\n        event.preventDefault();\r\n        showPopout();\r\n    };\r\n    const onClickDock = (event) => {\r\n        event.preventDefault();\r\n        dockPopout();\r\n    };\r\n    const cm = layout.getClassName;\r\n    const parentNode = node.getParent();\r\n    const style = node._styleWithPosition();\r\n    if (!selected) {\r\n        (0,_Utils__WEBPACK_IMPORTED_MODULE_5__.hideElement)(style, node.getModel().isUseVisibility());\r\n    }\r\n    if (parentNode instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode) {\r\n        if (node.getModel().getMaximizedTabset() !== undefined && !parentNode.isMaximized()) {\r\n            (0,_Utils__WEBPACK_IMPORTED_MODULE_5__.hideElement)(style, node.getModel().isUseVisibility());\r\n        }\r\n    }\r\n    const message = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Floating_Window_Message);\r\n    const showMessage = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Floating_Window_Show_Window);\r\n    const dockMessage = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Floating_Window_Dock_Window);\r\n    const customRenderCallback = layout.getOnRenderFloatingTabPlaceholder();\r\n    if (customRenderCallback) {\r\n        return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_3__.CLASSES.FLEXLAYOUT__TAB_FLOATING), onMouseDown: onMouseDown, onTouchStart: onMouseDown, style: style }, customRenderCallback(dockPopout, showPopout)));\r\n    }\r\n    else {\r\n        return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_3__.CLASSES.FLEXLAYOUT__TAB_FLOATING), \"data-layout-path\": path, onMouseDown: onMouseDown, onTouchStart: onMouseDown, style: style },\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_3__.CLASSES.FLEXLAYOUT__TAB_FLOATING_INNER) },\r\n                react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", null, message),\r\n                react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", null,\r\n                    react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"a\", { href: \"#\", onClick: onClickFocus }, showMessage)),\r\n                react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", null,\r\n                    react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"a\", { href: \"#\", onClick: onClickDock }, dockMessage)))));\r\n    }\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabFloating.tsx?");
 
 /***/ }),
 
@@ -554,9 +454,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!**************************************!*\
   !*** ./src/view/TabOverflowHook.tsx ***!
   \**************************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.useTabOverflow = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar Rect_1 = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\nvar TabSetNode_1 = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/** @internal */\nvar useTabOverflow = function (node, orientation, toolbarRef, stickyButtonsRef) {\n    var firstRender = React.useRef(true);\n    var tabsTruncated = React.useRef(false);\n    var lastRect = React.useRef(new Rect_1.Rect(0, 0, 0, 0));\n    var selfRef = React.useRef(null);\n    var _a = React.useState(0), position = _a[0], setPosition = _a[1];\n    var userControlledLeft = React.useRef(false);\n    var _b = React.useState([]), hiddenTabs = _b[0], setHiddenTabs = _b[1];\n    var lastHiddenCount = React.useRef(0);\n    // if selected node or tabset/border rectangle change then unset usercontrolled (so selected tab will be kept in view)\n    React.useLayoutEffect(function () {\n        userControlledLeft.current = false;\n    }, [node.getSelectedNode(), node.getRect().width, node.getRect().height]);\n    React.useLayoutEffect(function () {\n        updateVisibleTabs();\n    });\n    React.useEffect(function () {\n        var instance = selfRef.current;\n        instance.addEventListener('wheel', onWheel, { passive: false });\n        return function () {\n            instance.removeEventListener('wheel', onWheel);\n        };\n    }, []);\n    // needed to prevent default mouse wheel over tabset/border (cannot do with react event?)\n    var onWheel = function (event) {\n        event.preventDefault();\n    };\n    var getNear = function (rect) {\n        if (orientation === Orientation_1.Orientation.HORZ) {\n            return rect.x;\n        }\n        else {\n            return rect.y;\n        }\n    };\n    var getFar = function (rect) {\n        if (orientation === Orientation_1.Orientation.HORZ) {\n            return rect.getRight();\n        }\n        else {\n            return rect.getBottom();\n        }\n    };\n    var getSize = function (rect) {\n        if (orientation === Orientation_1.Orientation.HORZ) {\n            return rect.width;\n        }\n        else {\n            return rect.height;\n        }\n    };\n    var updateVisibleTabs = function () {\n        var tabMargin = 2;\n        if (firstRender.current === true) {\n            tabsTruncated.current = false;\n        }\n        var nodeRect = node instanceof TabSetNode_1.TabSetNode ? node.getRect() : node.getTabHeaderRect();\n        var lastChild = node.getChildren()[node.getChildren().length - 1];\n        var stickyButtonsSize = stickyButtonsRef.current === null ? 0 : getSize(stickyButtonsRef.current.getBoundingClientRect());\n        if (firstRender.current === true ||\n            (lastHiddenCount.current === 0 && hiddenTabs.length !== 0) ||\n            nodeRect.width !== lastRect.current.width || // incase rect changed between first render and second\n            nodeRect.height !== lastRect.current.height) {\n            lastHiddenCount.current = hiddenTabs.length;\n            lastRect.current = nodeRect;\n            var enabled = node instanceof TabSetNode_1.TabSetNode ? node.isEnableTabStrip() === true : true;\n            var endPos = getFar(nodeRect) - stickyButtonsSize;\n            if (toolbarRef.current !== null) {\n                endPos -= getSize(toolbarRef.current.getBoundingClientRect());\n            }\n            if (enabled && node.getChildren().length > 0) {\n                if (hiddenTabs.length === 0 && position === 0 && getFar(lastChild.getTabRect()) + tabMargin < endPos) {\n                    return; // nothing to do all tabs are shown in available space\n                }\n                var shiftPos = 0;\n                var selectedTab = node.getSelectedNode();\n                if (selectedTab && !userControlledLeft.current) {\n                    var selectedRect = selectedTab.getTabRect();\n                    var selectedStart = getNear(selectedRect) - tabMargin;\n                    var selectedEnd = getFar(selectedRect) + tabMargin;\n                    // when selected tab is larger than available space then align left\n                    if (getSize(selectedRect) + 2 * tabMargin >= endPos - getNear(nodeRect)) {\n                        shiftPos = getNear(nodeRect) - selectedStart;\n                    }\n                    else {\n                        if (selectedEnd > endPos || selectedStart < getNear(nodeRect)) {\n                            if (selectedStart < getNear(nodeRect)) {\n                                shiftPos = getNear(nodeRect) - selectedStart;\n                            }\n                            // use second if statement to prevent tab moving back then forwards if not enough space for single tab\n                            if (selectedEnd + shiftPos > endPos) {\n                                shiftPos = endPos - selectedEnd;\n                            }\n                        }\n                    }\n                }\n                var extraSpace = Math.max(0, endPos - (getFar(lastChild.getTabRect()) + tabMargin + shiftPos));\n                var newPosition = Math.min(0, position + shiftPos + extraSpace);\n                // find hidden tabs\n                var diff = newPosition - position;\n                var hidden = [];\n                for (var i = 0; i < node.getChildren().length; i++) {\n                    var child = node.getChildren()[i];\n                    if (getNear(child.getTabRect()) + diff < getNear(nodeRect) || getFar(child.getTabRect()) + diff > endPos) {\n                        hidden.push({ node: child, index: i });\n                    }\n                }\n                if (hidden.length > 0) {\n                    tabsTruncated.current = true;\n                }\n                firstRender.current = false; // need to do a second render\n                setHiddenTabs(hidden);\n                setPosition(newPosition);\n            }\n        }\n        else {\n            firstRender.current = true;\n        }\n    };\n    var onMouseWheel = function (event) {\n        var delta = 0;\n        if (Math.abs(event.deltaX) > Math.abs(event.deltaY)) {\n            delta = -event.deltaX;\n        }\n        else {\n            delta = -event.deltaY;\n        }\n        if (event.deltaMode === 1) {\n            // DOM_DELTA_LINE\t0x01\tThe delta values are specified in lines.\n            delta *= 40;\n        }\n        setPosition(position + delta);\n        userControlledLeft.current = true;\n        event.stopPropagation();\n    };\n    return { selfRef: selfRef, position: position, userControlledLeft: userControlledLeft, hiddenTabs: hiddenTabs, onMouseWheel: onMouseWheel, tabsTruncated: tabsTruncated.current };\n};\nexports.useTabOverflow = useTabOverflow;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabOverflowHook.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"useTabOverflow\": () => (/* binding */ useTabOverflow)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst useTabOverflow = (node, orientation, toolbarRef, stickyButtonsRef) => {\r\n    const firstRender = react__WEBPACK_IMPORTED_MODULE_0__.useRef(true);\r\n    const tabsTruncated = react__WEBPACK_IMPORTED_MODULE_0__.useRef(false);\r\n    const lastRect = react__WEBPACK_IMPORTED_MODULE_0__.useRef(new _Rect__WEBPACK_IMPORTED_MODULE_1__.Rect(0, 0, 0, 0));\r\n    const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const [position, setPosition] = react__WEBPACK_IMPORTED_MODULE_0__.useState(0);\r\n    const userControlledLeft = react__WEBPACK_IMPORTED_MODULE_0__.useRef(false);\r\n    const [hiddenTabs, setHiddenTabs] = react__WEBPACK_IMPORTED_MODULE_0__.useState([]);\r\n    const lastHiddenCount = react__WEBPACK_IMPORTED_MODULE_0__.useRef(0);\r\n    // if selected node or tabset/border rectangle change then unset usercontrolled (so selected tab will be kept in view)\r\n    react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\r\n        userControlledLeft.current = false;\r\n    }, [node.getSelectedNode(), node.getRect().width, node.getRect().height]);\r\n    react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\r\n        updateVisibleTabs();\r\n    });\r\n    react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\r\n        const instance = selfRef.current;\r\n        instance.addEventListener('wheel', onWheel, { passive: false });\r\n        return () => {\r\n            instance.removeEventListener('wheel', onWheel);\r\n        };\r\n    }, []);\r\n    // needed to prevent default mouse wheel over tabset/border (cannot do with react event?)\r\n    const onWheel = (event) => {\r\n        event.preventDefault();\r\n    };\r\n    const getNear = (rect) => {\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\r\n            return rect.x;\r\n        }\r\n        else {\r\n            return rect.y;\r\n        }\r\n    };\r\n    const getFar = (rect) => {\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\r\n            return rect.getRight();\r\n        }\r\n        else {\r\n            return rect.getBottom();\r\n        }\r\n    };\r\n    const getSize = (rect) => {\r\n        if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\r\n            return rect.width;\r\n        }\r\n        else {\r\n            return rect.height;\r\n        }\r\n    };\r\n    const updateVisibleTabs = () => {\r\n        const tabMargin = 2;\r\n        if (firstRender.current === true) {\r\n            tabsTruncated.current = false;\r\n        }\r\n        const nodeRect = node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode ? node.getRect() : node.getTabHeaderRect();\r\n        let lastChild = node.getChildren()[node.getChildren().length - 1];\r\n        const stickyButtonsSize = stickyButtonsRef.current === null ? 0 : getSize(stickyButtonsRef.current.getBoundingClientRect());\r\n        if (firstRender.current === true ||\r\n            (lastHiddenCount.current === 0 && hiddenTabs.length !== 0) ||\r\n            nodeRect.width !== lastRect.current.width || // incase rect changed between first render and second\r\n            nodeRect.height !== lastRect.current.height) {\r\n            lastHiddenCount.current = hiddenTabs.length;\r\n            lastRect.current = nodeRect;\r\n            const enabled = node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode ? node.isEnableTabStrip() === true : true;\r\n            let endPos = getFar(nodeRect) - stickyButtonsSize;\r\n            if (toolbarRef.current !== null) {\r\n                endPos -= getSize(toolbarRef.current.getBoundingClientRect());\r\n            }\r\n            if (enabled && node.getChildren().length > 0) {\r\n                if (hiddenTabs.length === 0 && position === 0 && getFar(lastChild.getTabRect()) + tabMargin < endPos) {\r\n                    return; // nothing to do all tabs are shown in available space\r\n                }\r\n                let shiftPos = 0;\r\n                const selectedTab = node.getSelectedNode();\r\n                if (selectedTab && !userControlledLeft.current) {\r\n                    const selectedRect = selectedTab.getTabRect();\r\n                    const selectedStart = getNear(selectedRect) - tabMargin;\r\n                    const selectedEnd = getFar(selectedRect) + tabMargin;\r\n                    // when selected tab is larger than available space then align left\r\n                    if (getSize(selectedRect) + 2 * tabMargin >= endPos - getNear(nodeRect)) {\r\n                        shiftPos = getNear(nodeRect) - selectedStart;\r\n                    }\r\n                    else {\r\n                        if (selectedEnd > endPos || selectedStart < getNear(nodeRect)) {\r\n                            if (selectedStart < getNear(nodeRect)) {\r\n                                shiftPos = getNear(nodeRect) - selectedStart;\r\n                            }\r\n                            // use second if statement to prevent tab moving back then forwards if not enough space for single tab\r\n                            if (selectedEnd + shiftPos > endPos) {\r\n                                shiftPos = endPos - selectedEnd;\r\n                            }\r\n                        }\r\n                    }\r\n                }\r\n                const extraSpace = Math.max(0, endPos - (getFar(lastChild.getTabRect()) + tabMargin + shiftPos));\r\n                const newPosition = Math.min(0, position + shiftPos + extraSpace);\r\n                // find hidden tabs\r\n                const diff = newPosition - position;\r\n                const hidden = [];\r\n                for (let i = 0; i < node.getChildren().length; i++) {\r\n                    const child = node.getChildren()[i];\r\n                    if (getNear(child.getTabRect()) + diff < getNear(nodeRect) || getFar(child.getTabRect()) + diff > endPos) {\r\n                        hidden.push({ node: child, index: i });\r\n                    }\r\n                }\r\n                if (hidden.length > 0) {\r\n                    tabsTruncated.current = true;\r\n                }\r\n                firstRender.current = false; // need to do a second render\r\n                setHiddenTabs(hidden);\r\n                setPosition(newPosition);\r\n            }\r\n        }\r\n        else {\r\n            firstRender.current = true;\r\n        }\r\n    };\r\n    const onMouseWheel = (event) => {\r\n        let delta = 0;\r\n        if (Math.abs(event.deltaX) > Math.abs(event.deltaY)) {\r\n            delta = -event.deltaX;\r\n        }\r\n        else {\r\n            delta = -event.deltaY;\r\n        }\r\n        if (event.deltaMode === 1) {\r\n            // DOM_DELTA_LINE\t0x01\tThe delta values are specified in lines.\r\n            delta *= 40;\r\n        }\r\n        setPosition(position + delta);\r\n        userControlledLeft.current = true;\r\n        event.stopPropagation();\r\n    };\r\n    return { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated: tabsTruncated.current };\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabOverflowHook.tsx?");
 
 /***/ }),
 
@@ -564,9 +464,9 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /*!*****************************!*\
   !*** ./src/view/TabSet.tsx ***!
   \*****************************/
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nvar __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n        if (ar || !(i in from)) {\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n            ar[i] = from[i];\n        }\n    }\n    return to.concat(ar || Array.prototype.slice.call(from));\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.TabSet = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\nvar I18nLabel_1 = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\nvar Actions_1 = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\nvar PopupMenu_1 = __webpack_require__(/*! ../PopupMenu */ \"./src/PopupMenu.tsx\");\nvar TabButton_1 = __webpack_require__(/*! ./TabButton */ \"./src/view/TabButton.tsx\");\nvar TabOverflowHook_1 = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\nvar Orientation_1 = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\nvar Types_1 = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\nvar Utils_1 = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/** @internal */\nvar TabSet = function (props) {\n    var node = props.node, layout = props.layout, iconFactory = props.iconFactory, titleFactory = props.titleFactory, icons = props.icons, path = props.path;\n    var toolbarRef = React.useRef(null);\n    var overflowbuttonRef = React.useRef(null);\n    var tabbarInnerRef = React.useRef(null);\n    var stickyButtonsRef = React.useRef(null);\n    var _a = (0, TabOverflowHook_1.useTabOverflow)(node, Orientation_1.Orientation.HORZ, toolbarRef, stickyButtonsRef), selfRef = _a.selfRef, position = _a.position, userControlledLeft = _a.userControlledLeft, hiddenTabs = _a.hiddenTabs, onMouseWheel = _a.onMouseWheel, tabsTruncated = _a.tabsTruncated;\n    var onOverflowClick = function (event) {\n        var callback = layout.getShowOverflowMenu();\n        if (callback !== undefined) {\n            callback(node, event, hiddenTabs, onOverflowItemSelect);\n        }\n        else {\n            var element = overflowbuttonRef.current;\n            (0, PopupMenu_1.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout, iconFactory, titleFactory);\n        }\n        event.stopPropagation();\n    };\n    var onOverflowItemSelect = function (item) {\n        layout.doAction(Actions_1.Actions.selectTab(item.node.getId()));\n        userControlledLeft.current = false;\n    };\n    var onMouseDown = function (event) {\n        if (!(0, Utils_1.isAuxMouseEvent)(event)) {\n            var name_1 = node.getName();\n            if (name_1 === undefined) {\n                name_1 = \"\";\n            }\n            else {\n                name_1 = \": \" + name_1;\n            }\n            layout.doAction(Actions_1.Actions.setActiveTabset(node.getId()));\n            if (!layout.getEditingTab()) {\n                var message = layout.i18nName(I18nLabel_1.I18nLabel.Move_Tabset, name_1);\n                if (node.getModel().getMaximizedTabset() !== undefined) {\n                    layout.dragStart(event, message, node, false, function (event2) { return undefined; }, onDoubleClick);\n                }\n                else {\n                    layout.dragStart(event, message, node, node.isEnableDrag(), function (event2) { return undefined; }, onDoubleClick);\n                }\n            }\n        }\n    };\n    var onAuxMouseClick = function (event) {\n        if ((0, Utils_1.isAuxMouseEvent)(event)) {\n            layout.auxMouseClick(node, event);\n        }\n    };\n    var onContextMenu = function (event) {\n        layout.showContextMenu(node, event);\n    };\n    var onInterceptMouseDown = function (event) {\n        event.stopPropagation();\n    };\n    var onMaximizeToggle = function (event) {\n        if (node.canMaximize()) {\n            layout.maximize(node);\n        }\n        event.stopPropagation();\n    };\n    var onClose = function (event) {\n        layout.doAction(Actions_1.Actions.deleteTabset(node.getId()));\n        event.stopPropagation();\n    };\n    var onFloatTab = function (event) {\n        if (selectedTabNode !== undefined) {\n            layout.doAction(Actions_1.Actions.floatTab(selectedTabNode.getId()));\n        }\n        event.stopPropagation();\n    };\n    var onDoubleClick = function (event) {\n        if (node.canMaximize()) {\n            layout.maximize(node);\n        }\n    };\n    // Start Render\n    var cm = layout.getClassName;\n    // tabbar inner can get shifted left via tab rename, this resets scrollleft to 0\n    if (tabbarInnerRef.current !== null && tabbarInnerRef.current.scrollLeft !== 0) {\n        tabbarInnerRef.current.scrollLeft = 0;\n    }\n    var selectedTabNode = node.getSelectedNode();\n    var style = node._styleWithPosition();\n    if (node.getModel().getMaximizedTabset() !== undefined && !node.isMaximized()) {\n        (0, Utils_1.hideElement)(style, node.getModel().isUseVisibility());\n    }\n    var tabs = [];\n    if (node.isEnableTabStrip()) {\n        for (var i = 0; i < node.getChildren().length; i++) {\n            var child = node.getChildren()[i];\n            var isSelected = node.getSelected() === i;\n            tabs.push(React.createElement(TabButton_1.TabButton, { layout: layout, node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected, iconFactory: iconFactory, titleFactory: titleFactory, icons: icons }));\n            if (i < node.getChildren().length - 1) {\n                tabs.push(React.createElement(\"div\", { key: \"divider\" + i, className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_TAB_DIVIDER) }));\n            }\n        }\n    }\n    var showHeader = node.getName() !== undefined;\n    var stickyButtons = [];\n    var buttons = [];\n    var headerButtons = [];\n    // allow customization of header contents and buttons\n    var renderState = { headerContent: node.getName(), stickyButtons: stickyButtons, buttons: buttons, headerButtons: headerButtons };\n    layout.customizeTabSet(node, renderState);\n    var headerContent = renderState.headerContent;\n    stickyButtons = renderState.stickyButtons;\n    buttons = renderState.buttons;\n    headerButtons = renderState.headerButtons;\n    if (stickyButtons.length > 0) {\n        if (tabsTruncated) {\n            buttons = __spreadArray(__spreadArray([], stickyButtons, true), buttons, true);\n        }\n        else {\n            tabs.push(React.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: function (e) { e.preventDefault(); }, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\n        }\n    }\n    var toolbar;\n    if (hiddenTabs.length > 0) {\n        var overflowTitle = layout.i18nName(I18nLabel_1.I18nLabel.Overflow_Menu_Tooltip);\n        var overflowContent = void 0;\n        if (typeof icons.more === \"function\") {\n            overflowContent = icons.more(node, hiddenTabs);\n        }\n        else {\n            overflowContent = (React.createElement(React.Fragment, null,\n                icons.more,\n                React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\n        }\n        buttons.push(React.createElement(\"button\", { key: \"overflowbutton\", \"data-layout-path\": path + \"/button/overflow\", ref: overflowbuttonRef, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW), title: overflowTitle, onClick: onOverflowClick, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, overflowContent));\n    }\n    if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnableFloat() && !selectedTabNode.isFloating()) {\n        var floatTitle = layout.i18nName(I18nLabel_1.I18nLabel.Float_Tab);\n        buttons.push(React.createElement(\"button\", { key: \"float\", \"data-layout-path\": path + \"/button/float\", title: floatTitle, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT), onClick: onFloatTab, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\n    }\n    if (node.canMaximize()) {\n        var minTitle = layout.i18nName(I18nLabel_1.I18nLabel.Restore);\n        var maxTitle = layout.i18nName(I18nLabel_1.I18nLabel.Maximize);\n        var btns = showHeader ? headerButtons : buttons;\n        btns.push(React.createElement(\"button\", { key: \"max\", \"data-layout-path\": path + \"/button/max\", title: node.isMaximized() ? minTitle : maxTitle, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_ + (node.isMaximized() ? \"max\" : \"min\")), onClick: onMaximizeToggle, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, node.isMaximized() ?\n            (typeof icons.restore === \"function\") ? icons.restore(node) : icons.restore :\n            (typeof icons.maximize === \"function\") ? icons.maximize(node) : icons.maximize));\n    }\n    if (!node.isMaximized() && node.isEnableClose()) {\n        var title = layout.i18nName(I18nLabel_1.I18nLabel.Close_Tabset);\n        var btns = showHeader ? headerButtons : buttons;\n        btns.push(React.createElement(\"button\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: title, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE), onClick: onClose, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.closeTabset === \"function\") ? icons.closeTabset(node) : icons.closeTabset));\n    }\n    toolbar = (React.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: function (e) { e.preventDefault(); } }, buttons));\n    var header;\n    var tabStrip;\n    var tabStripClasses = cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER);\n    if (node.getClassNameTabStrip() !== undefined) {\n        tabStripClasses += \" \" + node.getClassNameTabStrip();\n    }\n    tabStripClasses += \" \" + Types_1.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER_ + node.getTabLocation();\n    if (node.isActive() && !showHeader) {\n        tabStripClasses += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\n    }\n    if (node.isMaximized() && !showHeader) {\n        tabStripClasses += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\n    }\n    if (showHeader) {\n        var headerToolbar = (React.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(Types_1.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: function (e) { e.preventDefault(); } }, headerButtons));\n        var tabHeaderClasses = cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_HEADER);\n        if (node.isActive()) {\n            tabHeaderClasses += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\n        }\n        if (node.isMaximized()) {\n            tabHeaderClasses += \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\n        }\n        if (node.getClassNameHeader() !== undefined) {\n            tabHeaderClasses += \" \" + node.getClassNameHeader();\n        }\n        header = (React.createElement(\"div\", { className: tabHeaderClasses, style: { height: node.getHeaderHeight() + \"px\" }, \"data-layout-path\": path + \"/header\", onMouseDown: onMouseDown, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onTouchStart: onMouseDown },\n            React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_HEADER_CONTENT) }, headerContent),\n            headerToolbar));\n    }\n    var tabStripStyle = { height: node.getTabStripHeight() + \"px\" };\n    tabStrip = (React.createElement(\"div\", { className: tabStripClasses, style: tabStripStyle, \"data-layout-path\": path + \"/tabstrip\", onMouseDown: onMouseDown, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onTouchStart: onMouseDown },\n        React.createElement(\"div\", { ref: tabbarInnerRef, className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_ + node.getTabLocation()) },\n            React.createElement(\"div\", { style: { left: position }, className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER) + \" \" + cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_ + node.getTabLocation()) }, tabs)),\n        toolbar));\n    style = layout.styleFont(style);\n    var placeHolder = undefined;\n    if (node.getChildren().length === 0) {\n        var placeHolderCallback = layout.getTabSetPlaceHolderCallback();\n        if (placeHolderCallback) {\n            placeHolder = placeHolderCallback(node);\n        }\n    }\n    var center = React.createElement(\"div\", { className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_CONTENT) }, placeHolder);\n    var content;\n    if (node.getTabLocation() === \"top\") {\n        content = React.createElement(React.Fragment, null,\n            header,\n            tabStrip,\n            center);\n    }\n    else {\n        content = React.createElement(React.Fragment, null,\n            header,\n            center,\n            tabStrip);\n    }\n    return (React.createElement(\"div\", { ref: selfRef, dir: \"ltr\", \"data-layout-path\": path, style: style, className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET), onWheel: onMouseWheel }, content));\n};\nexports.TabSet = TabSet;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabSet.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TabSet\": () => (/* binding */ TabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../PopupMenu */ \"./src/PopupMenu.tsx\");\n/* harmony import */ var _TabButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./TabButton */ \"./src/view/TabButton.tsx\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst TabSet = (props) => {\r\n    const { node, layout, iconFactory, titleFactory, icons, path } = props;\r\n    const toolbarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const tabbarInnerRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n    const { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__.useTabOverflow)(node, _Orientation__WEBPACK_IMPORTED_MODULE_6__.Orientation.HORZ, toolbarRef, stickyButtonsRef);\r\n    const onOverflowClick = (event) => {\r\n        const callback = layout.getShowOverflowMenu();\r\n        if (callback !== undefined) {\r\n            callback(node, event, hiddenTabs, onOverflowItemSelect);\r\n        }\r\n        else {\r\n            const element = overflowbuttonRef.current;\r\n            (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout, iconFactory, titleFactory);\r\n        }\r\n        event.stopPropagation();\r\n    };\r\n    const onOverflowItemSelect = (item) => {\r\n        layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(item.node.getId()));\r\n        userControlledLeft.current = false;\r\n    };\r\n    const onMouseDown = (event) => {\r\n        if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\r\n            let name = node.getName();\r\n            if (name === undefined) {\r\n                name = \"\";\r\n            }\r\n            else {\r\n                name = \": \" + name;\r\n            }\r\n            layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.setActiveTabset(node.getId()));\r\n            if (!layout.getEditingTab()) {\r\n                const message = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Move_Tabset, name);\r\n                if (node.getModel().getMaximizedTabset() !== undefined) {\r\n                    layout.dragStart(event, message, node, false, (event2) => undefined, onDoubleClick);\r\n                }\r\n                else {\r\n                    layout.dragStart(event, message, node, node.isEnableDrag(), (event2) => undefined, onDoubleClick);\r\n                }\r\n            }\r\n        }\r\n    };\r\n    const onAuxMouseClick = (event) => {\r\n        if ((0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\r\n            layout.auxMouseClick(node, event);\r\n        }\r\n    };\r\n    const onContextMenu = (event) => {\r\n        layout.showContextMenu(node, event);\r\n    };\r\n    const onInterceptMouseDown = (event) => {\r\n        event.stopPropagation();\r\n    };\r\n    const onMaximizeToggle = (event) => {\r\n        if (node.canMaximize()) {\r\n            layout.maximize(node);\r\n        }\r\n        event.stopPropagation();\r\n    };\r\n    const onClose = (event) => {\r\n        layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTabset(node.getId()));\r\n        event.stopPropagation();\r\n    };\r\n    const onFloatTab = (event) => {\r\n        if (selectedTabNode !== undefined) {\r\n            layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.floatTab(selectedTabNode.getId()));\r\n        }\r\n        event.stopPropagation();\r\n    };\r\n    const onDoubleClick = (event) => {\r\n        if (node.canMaximize()) {\r\n            layout.maximize(node);\r\n        }\r\n    };\r\n    // Start Render\r\n    const cm = layout.getClassName;\r\n    // tabbar inner can get shifted left via tab rename, this resets scrollleft to 0\r\n    if (tabbarInnerRef.current !== null && tabbarInnerRef.current.scrollLeft !== 0) {\r\n        tabbarInnerRef.current.scrollLeft = 0;\r\n    }\r\n    const selectedTabNode = node.getSelectedNode();\r\n    let style = node._styleWithPosition();\r\n    if (node.getModel().getMaximizedTabset() !== undefined && !node.isMaximized()) {\r\n        (0,_Utils__WEBPACK_IMPORTED_MODULE_8__.hideElement)(style, node.getModel().isUseVisibility());\r\n    }\r\n    const tabs = [];\r\n    if (node.isEnableTabStrip()) {\r\n        for (let i = 0; i < node.getChildren().length; i++) {\r\n            const child = node.getChildren()[i];\r\n            let isSelected = node.getSelected() === i;\r\n            tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButton__WEBPACK_IMPORTED_MODULE_4__.TabButton, { layout: layout, node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected, iconFactory: iconFactory, titleFactory: titleFactory, icons: icons }));\r\n            if (i < node.getChildren().length - 1) {\r\n                tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TAB_DIVIDER) }));\r\n            }\r\n        }\r\n    }\r\n    const showHeader = node.getName() !== undefined;\r\n    let stickyButtons = [];\r\n    let buttons = [];\r\n    let headerButtons = [];\r\n    // allow customization of header contents and buttons\r\n    const renderState = { headerContent: node.getName(), stickyButtons, buttons, headerButtons };\r\n    layout.customizeTabSet(node, renderState);\r\n    const headerContent = renderState.headerContent;\r\n    stickyButtons = renderState.stickyButtons;\r\n    buttons = renderState.buttons;\r\n    headerButtons = renderState.headerButtons;\r\n    if (stickyButtons.length > 0) {\r\n        if (tabsTruncated) {\r\n            buttons = [...stickyButtons, ...buttons];\r\n        }\r\n        else {\r\n            tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\r\n        }\r\n    }\r\n    let toolbar;\r\n    if (hiddenTabs.length > 0) {\r\n        const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Overflow_Menu_Tooltip);\r\n        let overflowContent;\r\n        if (typeof icons.more === \"function\") {\r\n            overflowContent = icons.more(node, hiddenTabs);\r\n        }\r\n        else {\r\n            overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n                icons.more,\r\n                react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\r\n        }\r\n        buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"overflowbutton\", \"data-layout-path\": path + \"/button/overflow\", ref: overflowbuttonRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW), title: overflowTitle, onClick: onOverflowClick, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, overflowContent));\r\n    }\r\n    if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnableFloat() && !selectedTabNode.isFloating()) {\r\n        const floatTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Float_Tab);\r\n        buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"float\", \"data-layout-path\": path + \"/button/float\", title: floatTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT), onClick: onFloatTab, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\r\n    }\r\n    if (node.canMaximize()) {\r\n        const minTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Restore);\r\n        const maxTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Maximize);\r\n        const btns = showHeader ? headerButtons : buttons;\r\n        btns.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"max\", \"data-layout-path\": path + \"/button/max\", title: node.isMaximized() ? minTitle : maxTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_ + (node.isMaximized() ? \"max\" : \"min\")), onClick: onMaximizeToggle, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, node.isMaximized() ?\r\n            (typeof icons.restore === \"function\") ? icons.restore(node) : icons.restore :\r\n            (typeof icons.maximize === \"function\") ? icons.maximize(node) : icons.maximize));\r\n    }\r\n    if (!node.isMaximized() && node.isEnableClose()) {\r\n        const title = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tabset);\r\n        const btns = showHeader ? headerButtons : buttons;\r\n        btns.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: title, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE), onClick: onClose, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.closeTabset === \"function\") ? icons.closeTabset(node) : icons.closeTabset));\r\n    }\r\n    toolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); } }, buttons));\r\n    let header;\r\n    let tabStrip;\r\n    let tabStripClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER);\r\n    if (node.getClassNameTabStrip() !== undefined) {\r\n        tabStripClasses += \" \" + node.getClassNameTabStrip();\r\n    }\r\n    tabStripClasses += \" \" + _Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER_ + node.getTabLocation();\r\n    if (node.isActive() && !showHeader) {\r\n        tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\r\n    }\r\n    if (node.isMaximized() && !showHeader) {\r\n        tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\r\n    }\r\n    if (showHeader) {\r\n        const headerToolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); } }, headerButtons));\r\n        let tabHeaderClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_HEADER);\r\n        if (node.isActive()) {\r\n            tabHeaderClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\r\n        }\r\n        if (node.isMaximized()) {\r\n            tabHeaderClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\r\n        }\r\n        if (node.getClassNameHeader() !== undefined) {\r\n            tabHeaderClasses += \" \" + node.getClassNameHeader();\r\n        }\r\n        header = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabHeaderClasses, style: { height: node.getHeaderHeight() + \"px\" }, \"data-layout-path\": path + \"/header\", onMouseDown: onMouseDown, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onTouchStart: onMouseDown },\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_HEADER_CONTENT) }, headerContent),\r\n            headerToolbar));\r\n    }\r\n    const tabStripStyle = { height: node.getTabStripHeight() + \"px\" };\r\n    tabStrip = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabStripClasses, style: tabStripStyle, \"data-layout-path\": path + \"/tabstrip\", onMouseDown: onMouseDown, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onTouchStart: onMouseDown },\r\n        react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: tabbarInnerRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_ + node.getTabLocation()) },\r\n            react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { left: position }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_ + node.getTabLocation()) }, tabs)),\r\n        toolbar));\r\n    style = layout.styleFont(style);\r\n    var placeHolder = undefined;\r\n    if (node.getChildren().length === 0) {\r\n        const placeHolderCallback = layout.getTabSetPlaceHolderCallback();\r\n        if (placeHolderCallback) {\r\n            placeHolder = placeHolderCallback(node);\r\n        }\r\n    }\r\n    const center = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_CONTENT) }, placeHolder);\r\n    var content;\r\n    if (node.getTabLocation() === \"top\") {\r\n        content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n            header,\r\n            tabStrip,\r\n            center);\r\n    }\r\n    else {\r\n        content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n            header,\r\n            center,\r\n            tabStrip);\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, dir: \"ltr\", \"data-layout-path\": path, style: style, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET), onWheel: onMouseWheel }, content));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabSet.tsx?");
 
 /***/ }),
 
@@ -574,9 +474,9 @@ eval("\nvar __spreadArray = (this && this.__spreadArray) || function (to, from,
 /*!****************************!*\
   !*** ./src/view/Utils.tsx ***!
   \****************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.isAuxMouseEvent = exports.hideElement = exports.getRenderStateEx = void 0;\nvar React = __webpack_require__(/*! react */ \"react\");\n/** @internal */\nfunction getRenderStateEx(layout, node, iconFactory, titleFactory) {\n    var leadingContent = iconFactory ? iconFactory(node) : undefined;\n    var titleContent = node.getName();\n    var name = node.getName();\n    function isTitleObject(obj) {\n        return obj.titleContent !== undefined;\n    }\n    if (titleFactory !== undefined) {\n        var titleObj = titleFactory(node);\n        if (titleObj !== undefined) {\n            if (typeof titleObj === \"string\") {\n                titleContent = titleObj;\n                name = titleObj;\n            }\n            else if (isTitleObject(titleObj)) {\n                titleContent = titleObj.titleContent;\n                name = titleObj.name;\n            }\n            else {\n                titleContent = titleObj;\n            }\n        }\n    }\n    if (leadingContent === undefined && node.getIcon() !== undefined) {\n        leadingContent = React.createElement(\"img\", { style: { width: \"1em\", height: \"1em\" }, src: node.getIcon(), alt: \"leadingContent\" });\n    }\n    var buttons = [];\n    // allow customization of leading contents (icon) and contents\n    var renderState = { leading: leadingContent, content: titleContent, name: name, buttons: buttons };\n    layout.customizeTab(node, renderState);\n    node._setRenderedName(renderState.name);\n    return renderState;\n}\nexports.getRenderStateEx = getRenderStateEx;\n/** @internal */\nfunction hideElement(style, useVisibility) {\n    if (useVisibility) {\n        style.visibility = \"hidden\";\n    }\n    else {\n        style.display = \"none\";\n    }\n}\nexports.hideElement = hideElement;\n/** @internal */\nfunction isAuxMouseEvent(event) {\n    var auxEvent = false;\n    if (event.nativeEvent instanceof MouseEvent) {\n        if (event.nativeEvent.button !== 0 || event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) {\n            auxEvent = true;\n        }\n    }\n    return auxEvent;\n}\nexports.isAuxMouseEvent = isAuxMouseEvent;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Utils.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"getRenderStateEx\": () => (/* binding */ getRenderStateEx),\n/* harmony export */   \"hideElement\": () => (/* binding */ hideElement),\n/* harmony export */   \"isAuxMouseEvent\": () => (/* binding */ isAuxMouseEvent)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\r\n/** @internal */\r\nfunction getRenderStateEx(layout, node, iconFactory, titleFactory) {\r\n    let leadingContent = iconFactory ? iconFactory(node) : undefined;\r\n    let titleContent = node.getName();\r\n    let name = node.getName();\r\n    function isTitleObject(obj) {\r\n        return obj.titleContent !== undefined;\r\n    }\r\n    if (titleFactory !== undefined) {\r\n        const titleObj = titleFactory(node);\r\n        if (titleObj !== undefined) {\r\n            if (typeof titleObj === \"string\") {\r\n                titleContent = titleObj;\r\n                name = titleObj;\r\n            }\r\n            else if (isTitleObject(titleObj)) {\r\n                titleContent = titleObj.titleContent;\r\n                name = titleObj.name;\r\n            }\r\n            else {\r\n                titleContent = titleObj;\r\n            }\r\n        }\r\n    }\r\n    if (leadingContent === undefined && node.getIcon() !== undefined) {\r\n        leadingContent = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"img\", { style: { width: \"1em\", height: \"1em\" }, src: node.getIcon(), alt: \"leadingContent\" });\r\n    }\r\n    let buttons = [];\r\n    // allow customization of leading contents (icon) and contents\r\n    const renderState = { leading: leadingContent, content: titleContent, name, buttons };\r\n    layout.customizeTab(node, renderState);\r\n    node._setRenderedName(renderState.name);\r\n    return renderState;\r\n}\r\n/** @internal */\r\nfunction hideElement(style, useVisibility) {\r\n    if (useVisibility) {\r\n        style.visibility = \"hidden\";\r\n    }\r\n    else {\r\n        style.display = \"none\";\r\n    }\r\n}\r\n/** @internal */\r\nfunction isAuxMouseEvent(event) {\r\n    let auxEvent = false;\r\n    if (event.nativeEvent instanceof MouseEvent) {\r\n        if (event.nativeEvent.button !== 0 || event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) {\r\n            auxEvent = true;\r\n        }\r\n    }\r\n    return auxEvent;\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Utils.tsx?");
 
 /***/ }),
 
@@ -620,13 +520,25 @@ module.exports = __WEBPACK_EXTERNAL_MODULE_react_dom__;
 /******/ 		};
 /******/ 	
 /******/ 		// Execute the module function
-/******/ 		__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
 /******/ 	
 /******/ 		// Return the exports of the module
 /******/ 		return module.exports;
 /******/ 	}
 /******/ 	
 /************************************************************************/
+/******/ 	/* webpack/runtime/compat get default export */
+/******/ 	(() => {
+/******/ 		// getDefaultExport function for compatibility with non-harmony modules
+/******/ 		__webpack_require__.n = (module) => {
+/******/ 			var getter = module && module.__esModule ?
+/******/ 				() => (module['default']) :
+/******/ 				() => (module);
+/******/ 			__webpack_require__.d(getter, { a: getter });
+/******/ 			return getter;
+/******/ 		};
+/******/ 	})();
+/******/ 	
 /******/ 	/* webpack/runtime/define property getters */
 /******/ 	(() => {
 /******/ 		// define getter functions for harmony exports
@@ -659,7 +571,7 @@ module.exports = __WEBPACK_EXTERNAL_MODULE_react_dom__;
 /******/ 	
 /******/ 	// startup
 /******/ 	// Load entry module and return exports
-/******/ 	// This entry module is referenced by other modules so it can't be inlined
+/******/ 	// This entry module can't be inlined because the eval devtool is used.
 /******/ 	var __webpack_exports__ = __webpack_require__("./src/index.ts");
 /******/ 	
 /******/ 	return __webpack_exports__;