flexlayout-react 0.6.7 → 0.6.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/.github/ISSUE_TEMPLATE/bug_report.yml +104 -0
  2. package/.github/ISSUE_TEMPLATE/config.yml +5 -0
  3. package/ChangeLog.txt +9 -0
  4. package/README.md +10 -0
  5. package/declarations/Types.d.ts +1 -0
  6. package/declarations/view/Layout.d.ts +3 -0
  7. package/dist/flexlayout.js +6 -6
  8. package/dist/flexlayout.js.zip +0 -0
  9. package/dist/flexlayout_min.js +1 -1
  10. package/dist/flexlayout_min.js.zip +0 -0
  11. package/lib/Types.js +1 -0
  12. package/lib/Types.js.map +1 -1
  13. package/lib/model/Node.js +13 -8
  14. package/lib/model/Node.js.map +1 -1
  15. package/lib/model/TabSetNode.js +4 -1
  16. package/lib/model/TabSetNode.js.map +1 -1
  17. package/lib/view/Layout.js +8 -2
  18. package/lib/view/Layout.js.map +1 -1
  19. package/lib/view/TabOverflowHook.js +1 -1
  20. package/lib/view/TabOverflowHook.js.map +1 -1
  21. package/lib/view/TabSet.js +28 -11
  22. package/lib/view/TabSet.js.map +1 -1
  23. package/package.json +1 -1
  24. package/src/Types.ts +1 -0
  25. package/src/model/Node.ts +11 -7
  26. package/src/model/TabSetNode.ts +4 -1
  27. package/src/view/Layout.tsx +13 -2
  28. package/src/view/TabOverflowHook.tsx +1 -1
  29. package/src/view/TabSet.tsx +25 -9
  30. package/style/_base.scss +9 -6
  31. package/style/dark.css +8 -6
  32. package/style/dark.css.map +1 -1
  33. package/style/gray.css +8 -6
  34. package/style/gray.css.map +1 -1
  35. package/style/light.css +8 -6
  36. package/style/light.css.map +1 -1
  37. package/style/underline.css +8 -6
  38. package/style/underline.css.map +1 -1
package/dist/flexlayout.js CHANGED
@@ -266,7 +266,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
266
266
  \**********************/
267
267
  /***/ ((__unused_webpack_module, exports) => {
268
268
 
269
- 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_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?");
269
+ 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?");
270
270
 
271
271
  /***/ }),
272
272
 
@@ -376,7 +376,7 @@ eval("\nvar __spreadArray = (this && this.__spreadArray) || function (to, from,
376
376
  \***************************/
377
377
  /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
378
378
 
379
- 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 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 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?");
379
+ 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?");
380
380
 
381
381
  /***/ }),
382
382
 
@@ -416,7 +416,7 @@ eval("\nvar __extends = (this && this.__extends) || (function () {\n var exte
416
416
  \*********************************/
417
417
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
418
418
 
419
- 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 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.getLocation(this._contentRect, x, y);\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 (0, Utils_1.adjustSelectedIndex)(dragParent, fromIndex);\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?");
419
+ 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 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 (0, Utils_1.adjustSelectedIndex)(dragParent, fromIndex);\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?");
420
420
 
421
421
  /***/ }),
422
422
 
@@ -496,7 +496,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
496
496
  \*****************************/
497
497
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
498
498
 
499
- 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 ReactDOM = __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.edgesShown = false;\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.hideEdges(rootdiv);\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 (_this.props.model.getMaximizedTabset() !== undefined || !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 = ReactDOM.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 _this.showEdges(rootdiv);\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.hideEdges(rootdiv);\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 };\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 if (this.edgesShown) {\n this.repositionEdges(this.state.rect);\n }\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 // 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 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 * 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);\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.showEdges = function (rootdiv) {\n if (this.props.model.isEnableEdgeDock()) {\n var length_1 = this.edgeRectLength + \"px\";\n var radius = \"50px\";\n var width = this.edgeRectWidth + \"px\";\n this.edgeTopDiv = this.currentDocument.createElement(\"div\");\n this.edgeTopDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n this.edgeTopDiv.style.width = length_1;\n this.edgeTopDiv.style.height = width;\n this.edgeTopDiv.style.borderBottomLeftRadius = radius;\n this.edgeTopDiv.style.borderBottomRightRadius = radius;\n this.edgeLeftDiv = this.currentDocument.createElement(\"div\");\n this.edgeLeftDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n this.edgeLeftDiv.style.width = width;\n this.edgeLeftDiv.style.height = length_1;\n this.edgeLeftDiv.style.borderTopRightRadius = radius;\n this.edgeLeftDiv.style.borderBottomRightRadius = radius;\n this.edgeBottomDiv = this.currentDocument.createElement(\"div\");\n this.edgeBottomDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n this.edgeBottomDiv.style.width = length_1;\n this.edgeBottomDiv.style.height = width;\n this.edgeBottomDiv.style.borderTopLeftRadius = radius;\n this.edgeBottomDiv.style.borderTopRightRadius = radius;\n this.edgeRightDiv = this.currentDocument.createElement(\"div\");\n this.edgeRightDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n this.edgeRightDiv.style.width = width;\n this.edgeRightDiv.style.height = length_1;\n this.edgeRightDiv.style.borderTopLeftRadius = radius;\n this.edgeRightDiv.style.borderBottomLeftRadius = radius;\n this.repositionEdges(this.state.rect);\n rootdiv.appendChild(this.edgeTopDiv);\n rootdiv.appendChild(this.edgeLeftDiv);\n rootdiv.appendChild(this.edgeBottomDiv);\n rootdiv.appendChild(this.edgeRightDiv);\n this.edgesShown = true;\n }\n };\n /** @internal */\n Layout.prototype.repositionEdges = function (domRect) {\n if (this.props.model.isEnableEdgeDock()) {\n var r = this.centerRect;\n this.edgeTopDiv.style.top = r.y + \"px\";\n this.edgeTopDiv.style.left = r.x + (r.width - this.edgeRectLength) / 2 + \"px\";\n this.edgeLeftDiv.style.top = r.y + (r.height - this.edgeRectLength) / 2 + \"px\";\n this.edgeLeftDiv.style.left = r.x + \"px\";\n this.edgeBottomDiv.style.bottom = domRect.height - r.getBottom() + \"px\";\n this.edgeBottomDiv.style.left = r.x + (r.width - this.edgeRectLength) / 2 + \"px\";\n this.edgeRightDiv.style.top = r.y + (r.height - this.edgeRectLength) / 2 + \"px\";\n this.edgeRightDiv.style.right = domRect.width - r.getRight() + \"px\";\n }\n };\n /** @internal */\n Layout.prototype.hideEdges = function (rootdiv) {\n if (this.props.model.isEnableEdgeDock()) {\n try {\n rootdiv.removeChild(this.edgeTopDiv);\n rootdiv.removeChild(this.edgeLeftDiv);\n rootdiv.removeChild(this.edgeBottomDiv);\n rootdiv.removeChild(this.edgeRightDiv);\n }\n catch (e) { }\n }\n this.edgesShown = false;\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.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?");
499
+ 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 ReactDOM = __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.edgesShown = false;\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.hideEdges(rootdiv);\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 = ReactDOM.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.showEdges(rootdiv);\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.hideEdges(rootdiv);\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 };\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 if (this.edgesShown) {\n this.repositionEdges(this.state.rect);\n }\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 // 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 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 * 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);\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.showEdges = function (rootdiv) {\n if (this.props.model.isEnableEdgeDock()) {\n var length_1 = this.edgeRectLength + \"px\";\n var radius = \"50px\";\n var width = this.edgeRectWidth + \"px\";\n this.edgeTopDiv = this.currentDocument.createElement(\"div\");\n this.edgeTopDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n this.edgeTopDiv.style.width = length_1;\n this.edgeTopDiv.style.height = width;\n this.edgeTopDiv.style.borderBottomLeftRadius = radius;\n this.edgeTopDiv.style.borderBottomRightRadius = radius;\n this.edgeLeftDiv = this.currentDocument.createElement(\"div\");\n this.edgeLeftDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n this.edgeLeftDiv.style.width = width;\n this.edgeLeftDiv.style.height = length_1;\n this.edgeLeftDiv.style.borderTopRightRadius = radius;\n this.edgeLeftDiv.style.borderBottomRightRadius = radius;\n this.edgeBottomDiv = this.currentDocument.createElement(\"div\");\n this.edgeBottomDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n this.edgeBottomDiv.style.width = length_1;\n this.edgeBottomDiv.style.height = width;\n this.edgeBottomDiv.style.borderTopLeftRadius = radius;\n this.edgeBottomDiv.style.borderTopRightRadius = radius;\n this.edgeRightDiv = this.currentDocument.createElement(\"div\");\n this.edgeRightDiv.className = this.getClassName(Types_1.CLASSES.FLEXLAYOUT__EDGE_RECT);\n this.edgeRightDiv.style.width = width;\n this.edgeRightDiv.style.height = length_1;\n this.edgeRightDiv.style.borderTopLeftRadius = radius;\n this.edgeRightDiv.style.borderBottomLeftRadius = radius;\n this.repositionEdges(this.state.rect);\n rootdiv.appendChild(this.edgeTopDiv);\n rootdiv.appendChild(this.edgeLeftDiv);\n rootdiv.appendChild(this.edgeBottomDiv);\n rootdiv.appendChild(this.edgeRightDiv);\n this.edgesShown = true;\n }\n };\n /** @internal */\n Layout.prototype.repositionEdges = function (domRect) {\n if (this.props.model.isEnableEdgeDock()) {\n var r = this.centerRect;\n this.edgeTopDiv.style.top = r.y + \"px\";\n this.edgeTopDiv.style.left = r.x + (r.width - this.edgeRectLength) / 2 + \"px\";\n this.edgeLeftDiv.style.top = r.y + (r.height - this.edgeRectLength) / 2 + \"px\";\n this.edgeLeftDiv.style.left = r.x + \"px\";\n this.edgeBottomDiv.style.bottom = domRect.height - r.getBottom() + \"px\";\n this.edgeBottomDiv.style.left = r.x + (r.width - this.edgeRectLength) / 2 + \"px\";\n this.edgeRightDiv.style.top = r.y + (r.height - this.edgeRectLength) / 2 + \"px\";\n this.edgeRightDiv.style.right = domRect.width - r.getRight() + \"px\";\n }\n };\n /** @internal */\n Layout.prototype.hideEdges = function (rootdiv) {\n if (this.props.model.isEnableEdgeDock()) {\n try {\n rootdiv.removeChild(this.edgeTopDiv);\n rootdiv.removeChild(this.edgeLeftDiv);\n rootdiv.removeChild(this.edgeBottomDiv);\n rootdiv.removeChild(this.edgeRightDiv);\n }\n catch (e) { }\n }\n this.edgesShown = false;\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?");
500
500
 
501
501
  /***/ }),
502
502
 
@@ -556,7 +556,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
556
556
  \**************************************/
557
557
  /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
558
558
 
559
- 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);\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?");
559
+ 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?");
560
560
 
561
561
  /***/ }),
562
562
 
@@ -566,7 +566,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
566
566
  \*****************************/
567
567
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
568
568
 
569
- 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 layout.dragStart(event, message, node, node.isEnableDrag(), function (event2) { return undefined; }, onDoubleClick);\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 tabs.push(React.createElement(\"div\", { key: \"divider\" + i, className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_TAB_DIVIDER) }));\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 if (node.getTabLocation() === \"top\") {\n var top_1 = showHeader ? node.getHeaderHeight() + \"px\" : \"0px\";\n tabStripStyle[\"top\"] = top_1;\n }\n else {\n tabStripStyle[\"bottom\"] = \"0px\";\n }\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 return (React.createElement(\"div\", { ref: selfRef, dir: \"ltr\", \"data-layout-path\": path, style: style, className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET), onWheel: onMouseWheel },\n header,\n tabStrip));\n};\nexports.TabSet = TabSet;\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabSet.tsx?");
569
+ 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 tabs.push(React.createElement(\"div\", { key: \"divider\" + i, className: cm(Types_1.CLASSES.FLEXLAYOUT__TABSET_TAB_DIVIDER) }));\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?");
570
570
 
571
571
  /***/ }),
572
572
 
package/dist/flexlayout.js.zip ADDED
Binary file