flexlayout-react 0.8.2 → 0.8.4

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 (60) hide show
  1. package/ChangeLog.txt +10 -0
  2. package/README.md +3 -3
  3. package/declarations/Types.d.ts +3 -1
  4. package/declarations/model/BorderNode.d.ts +1 -0
  5. package/declarations/model/IJsonModel.d.ts +30 -2
  6. package/declarations/model/TabSetNode.d.ts +1 -0
  7. package/declarations/view/Layout.d.ts +1 -1
  8. package/declarations/view/Utils.d.ts +0 -3
  9. package/dist/flexlayout.js +12 -12
  10. package/dist/flexlayout_min.js +1 -1
  11. package/lib/Types.js +2 -0
  12. package/lib/Types.js.map +1 -1
  13. package/lib/model/BorderNode.js +4 -0
  14. package/lib/model/BorderNode.js.map +1 -1
  15. package/lib/model/LayoutWindow.js +1 -3
  16. package/lib/model/LayoutWindow.js.map +1 -1
  17. package/lib/model/Model.js +2 -9
  18. package/lib/model/Model.js.map +1 -1
  19. package/lib/model/TabSetNode.js +5 -1
  20. package/lib/model/TabSetNode.js.map +1 -1
  21. package/lib/view/BorderTabSet.js +17 -13
  22. package/lib/view/BorderTabSet.js.map +1 -1
  23. package/lib/view/Layout.js +2 -2
  24. package/lib/view/Layout.js.map +1 -1
  25. package/lib/view/Splitter.js +2 -2
  26. package/lib/view/Tab.js +5 -0
  27. package/lib/view/Tab.js.map +1 -1
  28. package/lib/view/TabOverflowHook.js +141 -112
  29. package/lib/view/TabOverflowHook.js.map +1 -1
  30. package/lib/view/TabSet.js +14 -20
  31. package/lib/view/TabSet.js.map +1 -1
  32. package/lib/view/Utils.js +0 -17
  33. package/lib/view/Utils.js.map +1 -1
  34. package/package.json +1 -1
  35. package/src/Types.ts +3 -0
  36. package/src/model/BorderNode.ts +7 -0
  37. package/src/model/IJsonModel.ts +34 -2
  38. package/src/model/LayoutWindow.ts +1 -3
  39. package/src/model/Model.ts +2 -9
  40. package/src/model/TabSetNode.ts +10 -1
  41. package/src/view/BorderTabSet.tsx +26 -15
  42. package/src/view/Layout.tsx +2 -2
  43. package/src/view/Splitter.tsx +2 -2
  44. package/src/view/Tab.tsx +6 -0
  45. package/src/view/TabOverflowHook.tsx +165 -127
  46. package/src/view/TabSet.tsx +19 -21
  47. package/src/view/Utils.tsx +0 -24
  48. package/style/_base.scss +26 -3
  49. package/style/dark.css +701 -685
  50. package/style/dark.css.map +1 -1
  51. package/style/gray.css +684 -668
  52. package/style/gray.css.map +1 -1
  53. package/style/light.css +685 -669
  54. package/style/light.css.map +1 -1
  55. package/style/rounded.css +730 -697
  56. package/style/rounded.css.map +1 -1
  57. package/style/rounded.scss +22 -5
  58. package/style/underline.css +705 -690
  59. package/style/underline.css.map +1 -1
  60. package/style/underline.scss +1 -1
@@ -136,7 +136,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
136
136
  \**********************/
137
137
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
138
138
 
139
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ CLASSES: () => (/* binding */ CLASSES)\n/* harmony export */ });\nvar CLASSES;\n(function (CLASSES) {\n CLASSES[\"FLEXLAYOUT__BORDER\"] = \"flexlayout__border\";\n CLASSES[\"FLEXLAYOUT__BORDER_\"] = \"flexlayout__border_\";\n CLASSES[\"FLEXLAYOUT__BORDER_TAB_CONTENTS\"] = \"flexlayout__border_tab_contents\";\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__EDGE_RECT_TOP\"] = \"flexlayout__edge_rect_top\";\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_LEFT\"] = \"flexlayout__edge_rect_left\";\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_BOTTOM\"] = \"flexlayout__edge_rect_bottom\";\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_RIGHT\"] = \"flexlayout__edge_rect_right\";\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__LAYOUT_MOVEABLES\"] = \"flexlayout__layout_moveables\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_OVERLAY\"] = \"flexlayout__layout_overlay\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_TAB_STAMPS\"] = \"flexlayout__layout_tab_stamps\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_MAIN\"] = \"flexlayout__layout_main\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_BORDER_CONTAINER\"] = \"flexlayout__layout_border_container\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_BORDER_CONTAINER_INNER\"] = \"flexlayout__layout_border_container_inner\";\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__SPLITTER_HANDLE\"] = \"flexlayout__splitter_handle\";\n CLASSES[\"FLEXLAYOUT__SPLITTER_HANDLE_HORZ\"] = \"flexlayout__splitter_handle_horz\";\n CLASSES[\"FLEXLAYOUT__SPLITTER_HANDLE_VERT\"] = \"flexlayout__splitter_handle_vert\";\n CLASSES[\"FLEXLAYOUT__ROW\"] = \"flexlayout__row\";\n CLASSES[\"FLEXLAYOUT__TAB\"] = \"flexlayout__tab\";\n CLASSES[\"FLEXLAYOUT__TAB_POSITION\"] = \"flexlayout__tab_position\";\n CLASSES[\"FLEXLAYOUT__TAB_MOVEABLE\"] = \"flexlayout__tab_moveable\";\n CLASSES[\"FLEXLAYOUT__TAB_OVERLAY\"] = \"flexlayout__tab_overlay\";\n CLASSES[\"FLEXLAYOUT__TABSET\"] = \"flexlayout__tabset\";\n CLASSES[\"FLEXLAYOUT__TABSET_CONTAINER\"] = \"flexlayout__tabset_container\";\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_STRETCH\"] = \"flexlayout__tab_button_stretch\";\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_ICON\"] = \"flexlayout__tab_toolbar_icon\";\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 || (CLASSES = {}));\n\n\n//# sourceURL=webpack://FlexLayout/./src/Types.ts?");
139
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ CLASSES: () => (/* binding */ CLASSES)\n/* harmony export */ });\nvar CLASSES;\n(function (CLASSES) {\n CLASSES[\"FLEXLAYOUT__BORDER\"] = \"flexlayout__border\";\n CLASSES[\"FLEXLAYOUT__BORDER_\"] = \"flexlayout__border_\";\n CLASSES[\"FLEXLAYOUT__BORDER_TAB_CONTENTS\"] = \"flexlayout__border_tab_contents\";\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__EDGE_RECT_TOP\"] = \"flexlayout__edge_rect_top\";\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_LEFT\"] = \"flexlayout__edge_rect_left\";\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_BOTTOM\"] = \"flexlayout__edge_rect_bottom\";\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_RIGHT\"] = \"flexlayout__edge_rect_right\";\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__LAYOUT_MOVEABLES\"] = \"flexlayout__layout_moveables\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_OVERLAY\"] = \"flexlayout__layout_overlay\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_TAB_STAMPS\"] = \"flexlayout__layout_tab_stamps\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_MAIN\"] = \"flexlayout__layout_main\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_BORDER_CONTAINER\"] = \"flexlayout__layout_border_container\";\n CLASSES[\"FLEXLAYOUT__LAYOUT_BORDER_CONTAINER_INNER\"] = \"flexlayout__layout_border_container_inner\";\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__SPLITTER_HANDLE\"] = \"flexlayout__splitter_handle\";\n CLASSES[\"FLEXLAYOUT__SPLITTER_HANDLE_HORZ\"] = \"flexlayout__splitter_handle_horz\";\n CLASSES[\"FLEXLAYOUT__SPLITTER_HANDLE_VERT\"] = \"flexlayout__splitter_handle_vert\";\n CLASSES[\"FLEXLAYOUT__ROW\"] = \"flexlayout__row\";\n CLASSES[\"FLEXLAYOUT__TAB\"] = \"flexlayout__tab\";\n CLASSES[\"FLEXLAYOUT__TAB_POSITION\"] = \"flexlayout__tab_position\";\n CLASSES[\"FLEXLAYOUT__TAB_MOVEABLE\"] = \"flexlayout__tab_moveable\";\n CLASSES[\"FLEXLAYOUT__TAB_OVERLAY\"] = \"flexlayout__tab_overlay\";\n CLASSES[\"FLEXLAYOUT__TABSET\"] = \"flexlayout__tabset\";\n CLASSES[\"FLEXLAYOUT__TABSET_CONTAINER\"] = \"flexlayout__tabset_container\";\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_STRETCH\"] = \"flexlayout__tab_button_stretch\";\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_ICON\"] = \"flexlayout__tab_toolbar_icon\";\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[\"FLEXLAYOUT__MINI_SCROLLBAR\"] = \"flexlayout__mini_scrollbar\";\n CLASSES[\"FLEXLAYOUT__MINI_SCROLLBAR_HIDDEN\"] = \"flexlayout__mini_scrollbar_hidden\";\n})(CLASSES || (CLASSES = {}));\n\n\n//# sourceURL=webpack://FlexLayout/./src/Types.ts?");
140
140
 
141
141
  /***/ }),
142
142
 
@@ -176,7 +176,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
176
176
  \*********************************/
177
177
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
178
178
 
179
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ BorderNode: () => (/* binding */ BorderNode)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DropInfo__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Model__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Model */ \"./src/model/Model.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\n\n\n\n\n\n\n\n\n\n\nclass BorderNode extends _Node__WEBPACK_IMPORTED_MODULE_8__.Node {\n /** @internal */\n static fromJson(json, model) {\n const location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(json.location);\n const border = new BorderNode(location, json, model);\n if (json.children) {\n border.children = json.children.map((jsonChild) => {\n const child = _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode.fromJson(jsonChild, model);\n child.setParent(border);\n return child;\n });\n }\n return border;\n }\n /** @internal */\n constructor(location, json, model) {\n super(model);\n /** @internal */\n this.outerRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n /** @internal */\n this.contentRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n /** @internal */\n this.tabHeaderRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n this.location = location;\n this.attributes.id = `border_${location.getName()}`;\n BorderNode.attributeDefinitions.fromJson(json, this.attributes);\n model.addNode(this);\n }\n getLocation() {\n return this.location;\n }\n getClassName() {\n return this.getAttr(\"className\");\n }\n isHorizontal() {\n return this.location.orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ;\n }\n getSize() {\n const defaultSize = this.getAttr(\"size\");\n const selected = this.getSelected();\n if (selected === -1) {\n return defaultSize;\n }\n else {\n const tabNode = this.children[selected];\n const tabBorderSize = this.isHorizontal() ? tabNode.getAttr(\"borderWidth\") : tabNode.getAttr(\"borderHeight\");\n if (tabBorderSize === -1) {\n return defaultSize;\n }\n else {\n return tabBorderSize;\n }\n }\n }\n getMinSize() {\n const selectedNode = this.getSelectedNode();\n let min = this.getAttr(\"minSize\");\n if (selectedNode) {\n const nodeMin = this.isHorizontal() ? selectedNode.getMinWidth() : selectedNode.getMinHeight();\n min = Math.max(min, nodeMin);\n }\n return min;\n }\n getMaxSize() {\n const selectedNode = this.getSelectedNode();\n let max = this.getAttr(\"maxSize\");\n if (selectedNode) {\n const nodeMax = this.isHorizontal() ? selectedNode.getMaxWidth() : selectedNode.getMaxHeight();\n max = Math.min(max, nodeMax);\n }\n return max;\n }\n getSelected() {\n return this.attributes.selected;\n }\n isAutoHide() {\n return this.getAttr(\"enableAutoHide\");\n }\n getSelectedNode() {\n if (this.getSelected() !== -1) {\n return this.children[this.getSelected()];\n }\n return undefined;\n }\n getOrientation() {\n return this.location.getOrientation();\n }\n /**\n * Returns the config attribute that can be used to store node specific data that\n * WILL be saved to the json. The config attribute should be changed via the action Actions.updateNodeAttributes rather\n * than directly, for example:\n * this.state.model.doAction(\n * FlexLayout.Actions.updateNodeAttributes(node.getId(), {config:myConfigObject}));\n */\n getConfig() {\n return this.attributes.config;\n }\n isMaximized() {\n return false;\n }\n isShowing() {\n return this.attributes.show;\n }\n toJson() {\n const json = {};\n BorderNode.attributeDefinitions.toJson(json, this.attributes);\n json.location = this.location.getName();\n json.children = this.children.map((child) => child.toJson());\n return json;\n }\n /** @internal */\n isAutoSelectTab(whenOpen) {\n if (whenOpen == null) {\n whenOpen = this.getSelected() !== -1;\n }\n if (whenOpen) {\n return this.getAttr(\"autoSelectTabWhenOpen\");\n }\n else {\n return this.getAttr(\"autoSelectTabWhenClosed\");\n }\n }\n /** @internal */\n setSelected(index) {\n this.attributes.selected = index;\n }\n /** @internal */\n getTabHeaderRect() {\n return this.tabHeaderRect;\n }\n /** @internal */\n setTabHeaderRect(r) {\n this.tabHeaderRect = r;\n }\n /** @internal */\n getOuterRect() {\n return this.outerRect;\n }\n /** @internal */\n setOuterRect(r) {\n this.outerRect = r;\n }\n /** @internal */\n getRect() {\n return this.tabHeaderRect;\n }\n /** @internal */\n getContentRect() {\n return this.contentRect;\n }\n /** @internal */\n setContentRect(r) {\n this.contentRect = r;\n }\n /** @internal */\n isEnableDrop() {\n return this.getAttr(\"enableDrop\");\n }\n /** @internal */\n setSize(pos) {\n const selected = this.getSelected();\n if (selected === -1) {\n this.attributes.size = pos;\n }\n else {\n const tabNode = this.children[selected];\n const tabBorderSize = this.isHorizontal() ? tabNode.getAttr(\"borderWidth\") : tabNode.getAttr(\"borderHeight\");\n if (tabBorderSize === -1) {\n this.attributes.size = pos;\n }\n else {\n if (this.isHorizontal()) {\n tabNode.setBorderWidth(pos);\n }\n else {\n tabNode.setBorderHeight(pos);\n }\n }\n }\n }\n /** @internal */\n updateAttrs(json) {\n BorderNode.attributeDefinitions.update(json, this.attributes);\n }\n /** @internal */\n remove(node) {\n const removedIndex = this.removeChild(node);\n if (this.getSelected() !== -1) {\n (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.adjustSelectedIndex)(this, removedIndex);\n }\n }\n /** @internal */\n canDrop(dragNode, x, y) {\n if (!(dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode)) {\n return undefined;\n }\n let dropInfo;\n const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n if (this.tabHeaderRect.contains(x, y)) {\n if (this.location.orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\n if (this.children.length > 0) {\n let child = this.children[0];\n let childRect = child.getTabRect();\n const childY = childRect.y;\n const childHeight = childRect.height;\n let pos = this.tabHeaderRect.x;\n let childCenter = 0;\n for (let i = 0; i < this.children.length; i++) {\n child = this.children[i];\n childRect = child.getTabRect();\n childCenter = childRect.x + childRect.width / 2;\n if (x >= pos && x < childCenter) {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childRect.x - 2, childY, 3, childHeight);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n break;\n }\n pos = childCenter;\n }\n if (dropInfo == null) {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childRect.getRight() - 2, childY, 3, childHeight);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this.children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n else {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(this.tabHeaderRect.x + 1, this.tabHeaderRect.y + 2, 3, 18);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, 0, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n else {\n if (this.children.length > 0) {\n let child = this.children[0];\n let childRect = child.getTabRect();\n const childX = childRect.x;\n const childWidth = childRect.width;\n let pos = this.tabHeaderRect.y;\n let childCenter = 0;\n for (let i = 0; i < this.children.length; i++) {\n child = this.children[i];\n childRect = child.getTabRect();\n childCenter = childRect.y + childRect.height / 2;\n if (y >= pos && y < childCenter) {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childX, childRect.y - 2, childWidth, 3);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n break;\n }\n pos = childCenter;\n }\n if (dropInfo == null) {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childX, childRect.getBottom() - 2, childWidth, 3);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this.children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n else {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(this.tabHeaderRect.x + 2, this.tabHeaderRect.y + 1, 18, 3);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, 0, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n if (!dragNode.canDockInto(dragNode, dropInfo)) {\n return undefined;\n }\n }\n else if (this.getSelected() !== -1 && this.outerRect.contains(x, y)) {\n const outlineRect = this.outerRect;\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n if (!dragNode.canDockInto(dragNode, dropInfo)) {\n return undefined;\n }\n }\n return dropInfo;\n }\n /** @internal */\n drop(dragNode, location, index, select) {\n let fromIndex = 0;\n const dragParent = dragNode.getParent();\n if (dragParent !== undefined) {\n fromIndex = dragParent.removeChild(dragNode);\n // if selected node in border is being docked into a different border then deselect border tabs\n if (dragParent !== this && dragParent instanceof BorderNode && dragParent.getSelected() === fromIndex) {\n dragParent.setSelected(-1);\n }\n else {\n (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.adjustSelectedIndex)(dragParent, fromIndex);\n }\n }\n // if dropping a tab back to same tabset and moving to forward position then reduce insertion index\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode && dragParent === this && fromIndex < index && index > 0) {\n index--;\n }\n // simple_bundled dock to existing tabset\n let insertPos = index;\n if (insertPos === -1) {\n insertPos = this.children.length;\n }\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\n this.addChild(dragNode, insertPos);\n }\n if (select || (select !== false && this.isAutoSelectTab())) {\n this.setSelected(insertPos);\n }\n this.model.tidy();\n }\n /** @internal */\n getSplitterBounds(index, useMinSize = false) {\n const pBounds = [0, 0];\n const minSize = useMinSize ? this.getMinSize() : 0;\n const maxSize = useMinSize ? this.getMaxSize() : 99999;\n const rootRow = this.model.getRoot(_Model__WEBPACK_IMPORTED_MODULE_7__.Model.MAIN_WINDOW_ID);\n const innerRect = rootRow.getRect();\n const splitterSize = this.model.getSplitterSize();\n if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP) {\n pBounds[0] = this.tabHeaderRect.getBottom() + minSize;\n const maxPos = this.tabHeaderRect.getBottom() + maxSize;\n pBounds[1] = Math.max(pBounds[0], innerRect.getBottom() - rootRow.getMinHeight() - splitterSize);\n pBounds[1] = Math.min(pBounds[1], maxPos);\n }\n else if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT) {\n pBounds[0] = this.tabHeaderRect.getRight() + minSize;\n const maxPos = this.tabHeaderRect.getRight() + maxSize;\n pBounds[1] = Math.max(pBounds[0], innerRect.getRight() - rootRow.getMinWidth() - splitterSize);\n pBounds[1] = Math.min(pBounds[1], maxPos);\n }\n else if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM) {\n pBounds[1] = this.tabHeaderRect.y - minSize - splitterSize;\n const maxPos = this.tabHeaderRect.y - maxSize - splitterSize;\n pBounds[0] = Math.min(pBounds[1], innerRect.y + rootRow.getMinHeight());\n pBounds[0] = Math.max(pBounds[0], maxPos);\n }\n else if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT) {\n pBounds[1] = this.tabHeaderRect.x - minSize - splitterSize;\n const maxPos = this.tabHeaderRect.x - maxSize - splitterSize;\n pBounds[0] = Math.min(pBounds[1], innerRect.x + rootRow.getMinWidth());\n pBounds[0] = Math.max(pBounds[0], maxPos);\n }\n return pBounds;\n }\n /** @internal */\n calculateSplit(splitter, splitterPos) {\n const pBounds = this.getSplitterBounds(splitterPos);\n if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM || this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT) {\n return Math.max(0, pBounds[1] - splitterPos);\n }\n else {\n return Math.max(0, splitterPos - pBounds[0]);\n }\n }\n /** @internal */\n getAttributeDefinitions() {\n return BorderNode.attributeDefinitions;\n }\n /** @internal */\n static getAttributeDefinitions() {\n return BorderNode.attributeDefinitions;\n }\n /** @internal */\n static createAttributeDefinitions() {\n const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\n attributeDefinitions.add(\"type\", BorderNode.TYPE, true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setFixed();\n attributeDefinitions.add(\"selected\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`index of selected/visible tab in border; -1 means no tab selected`);\n attributeDefinitions.add(\"show\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`show/hide this border`);\n attributeDefinitions.add(\"config\", undefined).setType(\"any\").setDescription(`a place to hold json config used in your own code`);\n attributeDefinitions.addInherited(\"enableDrop\", \"borderEnableDrop\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether tabs can be dropped into this border`);\n attributeDefinitions.addInherited(\"className\", \"borderClassName\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setDescription(`class applied to tab button`);\n attributeDefinitions.addInherited(\"autoSelectTabWhenOpen\", \"borderAutoSelectTabWhenOpen\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether to select new/moved tabs in border when the border is already open`);\n attributeDefinitions.addInherited(\"autoSelectTabWhenClosed\", \"borderAutoSelectTabWhenClosed\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether to select new/moved tabs in border when the border is currently closed`);\n attributeDefinitions.addInherited(\"size\", \"borderSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`size of the tab area when selected`);\n attributeDefinitions.addInherited(\"minSize\", \"borderMinSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`the minimum size of the tab area`);\n attributeDefinitions.addInherited(\"maxSize\", \"borderMaxSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`the maximum size of the tab area`);\n attributeDefinitions.addInherited(\"enableAutoHide\", \"borderEnableAutoHide\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`hide border if it has zero tabs`);\n return attributeDefinitions;\n }\n}\nBorderNode.TYPE = \"border\";\n/** @internal */\nBorderNode.attributeDefinitions = BorderNode.createAttributeDefinitions();\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/BorderNode.ts?");
179
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ BorderNode: () => (/* binding */ BorderNode)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DropInfo__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Model__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Model */ \"./src/model/Model.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\n\n\n\n\n\n\n\n\n\n\nclass BorderNode extends _Node__WEBPACK_IMPORTED_MODULE_8__.Node {\n /** @internal */\n static fromJson(json, model) {\n const location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(json.location);\n const border = new BorderNode(location, json, model);\n if (json.children) {\n border.children = json.children.map((jsonChild) => {\n const child = _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode.fromJson(jsonChild, model);\n child.setParent(border);\n return child;\n });\n }\n return border;\n }\n /** @internal */\n constructor(location, json, model) {\n super(model);\n /** @internal */\n this.outerRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n /** @internal */\n this.contentRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n /** @internal */\n this.tabHeaderRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n this.location = location;\n this.attributes.id = `border_${location.getName()}`;\n BorderNode.attributeDefinitions.fromJson(json, this.attributes);\n model.addNode(this);\n }\n getLocation() {\n return this.location;\n }\n getClassName() {\n return this.getAttr(\"className\");\n }\n isHorizontal() {\n return this.location.orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ;\n }\n getSize() {\n const defaultSize = this.getAttr(\"size\");\n const selected = this.getSelected();\n if (selected === -1) {\n return defaultSize;\n }\n else {\n const tabNode = this.children[selected];\n const tabBorderSize = this.isHorizontal() ? tabNode.getAttr(\"borderWidth\") : tabNode.getAttr(\"borderHeight\");\n if (tabBorderSize === -1) {\n return defaultSize;\n }\n else {\n return tabBorderSize;\n }\n }\n }\n getMinSize() {\n const selectedNode = this.getSelectedNode();\n let min = this.getAttr(\"minSize\");\n if (selectedNode) {\n const nodeMin = this.isHorizontal() ? selectedNode.getMinWidth() : selectedNode.getMinHeight();\n min = Math.max(min, nodeMin);\n }\n return min;\n }\n getMaxSize() {\n const selectedNode = this.getSelectedNode();\n let max = this.getAttr(\"maxSize\");\n if (selectedNode) {\n const nodeMax = this.isHorizontal() ? selectedNode.getMaxWidth() : selectedNode.getMaxHeight();\n max = Math.min(max, nodeMax);\n }\n return max;\n }\n getSelected() {\n return this.attributes.selected;\n }\n isAutoHide() {\n return this.getAttr(\"enableAutoHide\");\n }\n getSelectedNode() {\n if (this.getSelected() !== -1) {\n return this.children[this.getSelected()];\n }\n return undefined;\n }\n getOrientation() {\n return this.location.getOrientation();\n }\n /**\n * Returns the config attribute that can be used to store node specific data that\n * WILL be saved to the json. The config attribute should be changed via the action Actions.updateNodeAttributes rather\n * than directly, for example:\n * this.state.model.doAction(\n * FlexLayout.Actions.updateNodeAttributes(node.getId(), {config:myConfigObject}));\n */\n getConfig() {\n return this.attributes.config;\n }\n isMaximized() {\n return false;\n }\n isShowing() {\n return this.attributes.show;\n }\n toJson() {\n const json = {};\n BorderNode.attributeDefinitions.toJson(json, this.attributes);\n json.location = this.location.getName();\n json.children = this.children.map((child) => child.toJson());\n return json;\n }\n /** @internal */\n isAutoSelectTab(whenOpen) {\n if (whenOpen == null) {\n whenOpen = this.getSelected() !== -1;\n }\n if (whenOpen) {\n return this.getAttr(\"autoSelectTabWhenOpen\");\n }\n else {\n return this.getAttr(\"autoSelectTabWhenClosed\");\n }\n }\n isEnableTabScrollbar() {\n return this.getAttr(\"enableTabScrollbar\");\n }\n /** @internal */\n setSelected(index) {\n this.attributes.selected = index;\n }\n /** @internal */\n getTabHeaderRect() {\n return this.tabHeaderRect;\n }\n /** @internal */\n setTabHeaderRect(r) {\n this.tabHeaderRect = r;\n }\n /** @internal */\n getOuterRect() {\n return this.outerRect;\n }\n /** @internal */\n setOuterRect(r) {\n this.outerRect = r;\n }\n /** @internal */\n getRect() {\n return this.tabHeaderRect;\n }\n /** @internal */\n getContentRect() {\n return this.contentRect;\n }\n /** @internal */\n setContentRect(r) {\n this.contentRect = r;\n }\n /** @internal */\n isEnableDrop() {\n return this.getAttr(\"enableDrop\");\n }\n /** @internal */\n setSize(pos) {\n const selected = this.getSelected();\n if (selected === -1) {\n this.attributes.size = pos;\n }\n else {\n const tabNode = this.children[selected];\n const tabBorderSize = this.isHorizontal() ? tabNode.getAttr(\"borderWidth\") : tabNode.getAttr(\"borderHeight\");\n if (tabBorderSize === -1) {\n this.attributes.size = pos;\n }\n else {\n if (this.isHorizontal()) {\n tabNode.setBorderWidth(pos);\n }\n else {\n tabNode.setBorderHeight(pos);\n }\n }\n }\n }\n /** @internal */\n updateAttrs(json) {\n BorderNode.attributeDefinitions.update(json, this.attributes);\n }\n /** @internal */\n remove(node) {\n const removedIndex = this.removeChild(node);\n if (this.getSelected() !== -1) {\n (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.adjustSelectedIndex)(this, removedIndex);\n }\n }\n /** @internal */\n canDrop(dragNode, x, y) {\n if (!(dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode)) {\n return undefined;\n }\n let dropInfo;\n const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n if (this.tabHeaderRect.contains(x, y)) {\n if (this.location.orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\n if (this.children.length > 0) {\n let child = this.children[0];\n let childRect = child.getTabRect();\n const childY = childRect.y;\n const childHeight = childRect.height;\n let pos = this.tabHeaderRect.x;\n let childCenter = 0;\n for (let i = 0; i < this.children.length; i++) {\n child = this.children[i];\n childRect = child.getTabRect();\n childCenter = childRect.x + childRect.width / 2;\n if (x >= pos && x < childCenter) {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childRect.x - 2, childY, 3, childHeight);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n break;\n }\n pos = childCenter;\n }\n if (dropInfo == null) {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childRect.getRight() - 2, childY, 3, childHeight);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this.children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n else {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(this.tabHeaderRect.x + 1, this.tabHeaderRect.y + 2, 3, 18);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, 0, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n else {\n if (this.children.length > 0) {\n let child = this.children[0];\n let childRect = child.getTabRect();\n const childX = childRect.x;\n const childWidth = childRect.width;\n let pos = this.tabHeaderRect.y;\n let childCenter = 0;\n for (let i = 0; i < this.children.length; i++) {\n child = this.children[i];\n childRect = child.getTabRect();\n childCenter = childRect.y + childRect.height / 2;\n if (y >= pos && y < childCenter) {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childX, childRect.y - 2, childWidth, 3);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n break;\n }\n pos = childCenter;\n }\n if (dropInfo == null) {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(childX, childRect.getBottom() - 2, childWidth, 3);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this.children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n else {\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(this.tabHeaderRect.x + 2, this.tabHeaderRect.y + 1, 18, 3);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, 0, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n if (!dragNode.canDockInto(dragNode, dropInfo)) {\n return undefined;\n }\n }\n else if (this.getSelected() !== -1 && this.outerRect.contains(x, y)) {\n const outlineRect = this.outerRect;\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n if (!dragNode.canDockInto(dragNode, dropInfo)) {\n return undefined;\n }\n }\n return dropInfo;\n }\n /** @internal */\n drop(dragNode, location, index, select) {\n let fromIndex = 0;\n const dragParent = dragNode.getParent();\n if (dragParent !== undefined) {\n fromIndex = dragParent.removeChild(dragNode);\n // if selected node in border is being docked into a different border then deselect border tabs\n if (dragParent !== this && dragParent instanceof BorderNode && dragParent.getSelected() === fromIndex) {\n dragParent.setSelected(-1);\n }\n else {\n (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.adjustSelectedIndex)(dragParent, fromIndex);\n }\n }\n // if dropping a tab back to same tabset and moving to forward position then reduce insertion index\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode && dragParent === this && fromIndex < index && index > 0) {\n index--;\n }\n // simple_bundled dock to existing tabset\n let insertPos = index;\n if (insertPos === -1) {\n insertPos = this.children.length;\n }\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\n this.addChild(dragNode, insertPos);\n }\n if (select || (select !== false && this.isAutoSelectTab())) {\n this.setSelected(insertPos);\n }\n this.model.tidy();\n }\n /** @internal */\n getSplitterBounds(index, useMinSize = false) {\n const pBounds = [0, 0];\n const minSize = useMinSize ? this.getMinSize() : 0;\n const maxSize = useMinSize ? this.getMaxSize() : 99999;\n const rootRow = this.model.getRoot(_Model__WEBPACK_IMPORTED_MODULE_7__.Model.MAIN_WINDOW_ID);\n const innerRect = rootRow.getRect();\n const splitterSize = this.model.getSplitterSize();\n if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP) {\n pBounds[0] = this.tabHeaderRect.getBottom() + minSize;\n const maxPos = this.tabHeaderRect.getBottom() + maxSize;\n pBounds[1] = Math.max(pBounds[0], innerRect.getBottom() - rootRow.getMinHeight() - splitterSize);\n pBounds[1] = Math.min(pBounds[1], maxPos);\n }\n else if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT) {\n pBounds[0] = this.tabHeaderRect.getRight() + minSize;\n const maxPos = this.tabHeaderRect.getRight() + maxSize;\n pBounds[1] = Math.max(pBounds[0], innerRect.getRight() - rootRow.getMinWidth() - splitterSize);\n pBounds[1] = Math.min(pBounds[1], maxPos);\n }\n else if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM) {\n pBounds[1] = this.tabHeaderRect.y - minSize - splitterSize;\n const maxPos = this.tabHeaderRect.y - maxSize - splitterSize;\n pBounds[0] = Math.min(pBounds[1], innerRect.y + rootRow.getMinHeight());\n pBounds[0] = Math.max(pBounds[0], maxPos);\n }\n else if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT) {\n pBounds[1] = this.tabHeaderRect.x - minSize - splitterSize;\n const maxPos = this.tabHeaderRect.x - maxSize - splitterSize;\n pBounds[0] = Math.min(pBounds[1], innerRect.x + rootRow.getMinWidth());\n pBounds[0] = Math.max(pBounds[0], maxPos);\n }\n return pBounds;\n }\n /** @internal */\n calculateSplit(splitter, splitterPos) {\n const pBounds = this.getSplitterBounds(splitterPos);\n if (this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM || this.location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT) {\n return Math.max(0, pBounds[1] - splitterPos);\n }\n else {\n return Math.max(0, splitterPos - pBounds[0]);\n }\n }\n /** @internal */\n getAttributeDefinitions() {\n return BorderNode.attributeDefinitions;\n }\n /** @internal */\n static getAttributeDefinitions() {\n return BorderNode.attributeDefinitions;\n }\n /** @internal */\n static createAttributeDefinitions() {\n const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\n attributeDefinitions.add(\"type\", BorderNode.TYPE, true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setFixed();\n attributeDefinitions.add(\"selected\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`index of selected/visible tab in border; -1 means no tab selected`);\n attributeDefinitions.add(\"show\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`show/hide this border`);\n attributeDefinitions.add(\"config\", undefined).setType(\"any\").setDescription(`a place to hold json config used in your own code`);\n attributeDefinitions.addInherited(\"enableDrop\", \"borderEnableDrop\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether tabs can be dropped into this border`);\n attributeDefinitions.addInherited(\"className\", \"borderClassName\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setDescription(`class applied to tab button`);\n attributeDefinitions.addInherited(\"autoSelectTabWhenOpen\", \"borderAutoSelectTabWhenOpen\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether to select new/moved tabs in border when the border is already open`);\n attributeDefinitions.addInherited(\"autoSelectTabWhenClosed\", \"borderAutoSelectTabWhenClosed\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether to select new/moved tabs in border when the border is currently closed`);\n attributeDefinitions.addInherited(\"size\", \"borderSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`size of the tab area when selected`);\n attributeDefinitions.addInherited(\"minSize\", \"borderMinSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`the minimum size of the tab area`);\n attributeDefinitions.addInherited(\"maxSize\", \"borderMaxSize\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`the maximum size of the tab area`);\n attributeDefinitions.addInherited(\"enableAutoHide\", \"borderEnableAutoHide\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`hide border if it has zero tabs`);\n attributeDefinitions.addInherited(\"enableTabScrollbar\", \"borderEnableTabScrollbar\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether to show a mini scrollbar for the tabs`);\n return attributeDefinitions;\n }\n}\nBorderNode.TYPE = \"border\";\n/** @internal */\nBorderNode.attributeDefinitions = BorderNode.createAttributeDefinitions();\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/BorderNode.ts?");
180
180
 
181
181
  /***/ }),
182
182
 
@@ -236,7 +236,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n\n\n\n//# sourceURL=webpack:/
236
236
  \***********************************/
237
237
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
238
238
 
239
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ LayoutWindow: () => (/* binding */ LayoutWindow)\n/* harmony export */ });\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _view_Utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../view/Utils */ \"./src/view/Utils.tsx\");\n\n\n\nclass LayoutWindow {\n constructor(windowId, rect) {\n this._windowId = windowId;\n this._rect = rect;\n this._toScreenRectFunction = (r) => r;\n }\n visitNodes(fn) {\n this.root.forEachNode(fn, 0);\n }\n get windowId() {\n return this._windowId;\n }\n get rect() {\n return this._rect;\n }\n get layout() {\n return this._layout;\n }\n get window() {\n return this._window;\n }\n get root() {\n return this._root;\n }\n get maximizedTabSet() {\n return this._maximizedTabSet;\n }\n get activeTabSet() {\n return this._activeTabSet;\n }\n /** @internal */\n set rect(value) {\n this._rect = value;\n }\n /** @internal */\n set layout(value) {\n this._layout = value;\n }\n /** @internal */\n set window(value) {\n this._window = value;\n }\n /** @internal */\n set root(value) {\n this._root = value;\n }\n /** @internal */\n set maximizedTabSet(value) {\n this._maximizedTabSet = value;\n }\n /** @internal */\n set activeTabSet(value) {\n this._activeTabSet = value;\n }\n /** @internal */\n get toScreenRectFunction() {\n return this._toScreenRectFunction;\n }\n /** @internal */\n set toScreenRectFunction(value) {\n this._toScreenRectFunction = value;\n }\n toJson() {\n // chrome sets top,left to large -ve values when minimized, dont save in this case\n if (this._window && this._window.screenTop > -10000) {\n this.rect = new _Rect__WEBPACK_IMPORTED_MODULE_0__.Rect(this._window.screenLeft, this._window.screenTop, this._window.outerWidth, this._window.outerHeight);\n }\n return { layout: this.root.toJson(), rect: this.rect.toJson() };\n }\n static fromJson(windowJson, model, windowId) {\n const count = model.getwindowsMap().size;\n let rect = windowJson.rect ? _Rect__WEBPACK_IMPORTED_MODULE_0__.Rect.fromJson(windowJson.rect) : new _Rect__WEBPACK_IMPORTED_MODULE_0__.Rect(50 + 50 * count, 50 + 50 * count, 600, 400);\n rect = (0,_view_Utils__WEBPACK_IMPORTED_MODULE_2__.keepOnScreen)(rect); // snaps to grid of 10x10 and then moves into visible area\n // snapping prevents issue where window moves 1 pixel per save/restore on Chrome\n const layoutWindow = new LayoutWindow(windowId, rect);\n layoutWindow.root = _RowNode__WEBPACK_IMPORTED_MODULE_1__.RowNode.fromJson(windowJson.layout, model, layoutWindow);\n return layoutWindow;\n }\n}\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/LayoutWindow.ts?");
239
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ LayoutWindow: () => (/* binding */ LayoutWindow)\n/* harmony export */ });\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n\n\nclass LayoutWindow {\n constructor(windowId, rect) {\n this._windowId = windowId;\n this._rect = rect;\n this._toScreenRectFunction = (r) => r;\n }\n visitNodes(fn) {\n this.root.forEachNode(fn, 0);\n }\n get windowId() {\n return this._windowId;\n }\n get rect() {\n return this._rect;\n }\n get layout() {\n return this._layout;\n }\n get window() {\n return this._window;\n }\n get root() {\n return this._root;\n }\n get maximizedTabSet() {\n return this._maximizedTabSet;\n }\n get activeTabSet() {\n return this._activeTabSet;\n }\n /** @internal */\n set rect(value) {\n this._rect = value;\n }\n /** @internal */\n set layout(value) {\n this._layout = value;\n }\n /** @internal */\n set window(value) {\n this._window = value;\n }\n /** @internal */\n set root(value) {\n this._root = value;\n }\n /** @internal */\n set maximizedTabSet(value) {\n this._maximizedTabSet = value;\n }\n /** @internal */\n set activeTabSet(value) {\n this._activeTabSet = value;\n }\n /** @internal */\n get toScreenRectFunction() {\n return this._toScreenRectFunction;\n }\n /** @internal */\n set toScreenRectFunction(value) {\n this._toScreenRectFunction = value;\n }\n toJson() {\n // chrome sets top,left to large -ve values when minimized, dont save in this case\n if (this._window && this._window.screenTop > -10000) {\n this.rect = new _Rect__WEBPACK_IMPORTED_MODULE_0__.Rect(this._window.screenLeft, this._window.screenTop, this._window.outerWidth, this._window.outerHeight);\n }\n return { layout: this.root.toJson(), rect: this.rect.toJson() };\n }\n static fromJson(windowJson, model, windowId) {\n const count = model.getwindowsMap().size;\n let rect = windowJson.rect ? _Rect__WEBPACK_IMPORTED_MODULE_0__.Rect.fromJson(windowJson.rect) : new _Rect__WEBPACK_IMPORTED_MODULE_0__.Rect(50 + 50 * count, 50 + 50 * count, 600, 400);\n rect.snap(10); // snapping prevents issue where window moves 1 pixel per save/restore on Chrome\n const layoutWindow = new LayoutWindow(windowId, rect);\n layoutWindow.root = _RowNode__WEBPACK_IMPORTED_MODULE_1__.RowNode.fromJson(windowJson.layout, model, layoutWindow);\n return layoutWindow;\n }\n}\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/LayoutWindow.ts?");
240
240
 
241
241
  /***/ }),
242
242
 
@@ -246,7 +246,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
246
246
  \****************************/
247
247
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
248
248
 
249
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ DefaultMax: () => (/* binding */ DefaultMax),\n/* harmony export */ DefaultMin: () => (/* binding */ DefaultMin),\n/* harmony export */ Model: () => (/* binding */ Model)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _BorderSet__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./BorderSet */ \"./src/model/BorderSet.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _TabSetNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n/* harmony import */ var _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./LayoutWindow */ \"./src/model/LayoutWindow.ts\");\n/* harmony import */ var _view_Utils__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../view/Utils */ \"./src/view/Utils.tsx\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n/** @internal */\nconst DefaultMin = 0;\n/** @internal */\nconst DefaultMax = 99999;\n/**\n * Class containing the Tree of Nodes used by the FlexLayout component\n */\nclass Model {\n /**\n * 'private' constructor. Use the static method Model.fromJson(json) to create a model\n * @internal\n */\n constructor() {\n this.attributes = {};\n this.idMap = new Map();\n this.borders = new _BorderSet__WEBPACK_IMPORTED_MODULE_6__.BorderSet(this);\n this.windows = new Map();\n this.rootWindow = new _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow(Model.MAIN_WINDOW_ID, _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect.empty());\n this.windows.set(Model.MAIN_WINDOW_ID, this.rootWindow);\n this.changeListeners = [];\n }\n /**\n * Update the node tree by performing the given action,\n * Actions should be generated via static methods on the Actions class\n * @param action the action to perform\n * @returns added Node for Actions.addNode, windowId for createWindow\n */\n doAction(action) {\n var _a;\n let returnVal = undefined;\n // console.log(action);\n switch (action.type) {\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.ADD_NODE: {\n const newNode = new _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode(this, action.data.json, true);\n const toNode = this.idMap.get(action.data.toNode);\n if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode) {\n toNode.drop(newNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\n returnVal = newNode;\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.MOVE_NODE: {\n const fromNode = this.idMap.get(action.data.fromNode);\n if (fromNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode || fromNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode || fromNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode) {\n if (fromNode === this.getMaximizedTabset(fromNode.getWindowId())) {\n const fromWindow = this.windows.get(fromNode.getWindowId());\n fromWindow.maximizedTabSet = undefined;\n }\n const toNode = this.idMap.get(action.data.toNode);\n if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode) {\n toNode.drop(fromNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\n }\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.DELETE_TAB: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n node.delete();\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.DELETE_TABSET: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n // first delete all child tabs that are closeable\n const children = [...node.getChildren()];\n for (let i = 0; i < children.length; i++) {\n const child = children[i];\n if (child.isEnableClose()) {\n child.delete();\n }\n }\n if (node.getChildren().length === 0) {\n node.delete();\n }\n this.tidy();\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.POPOUT_TABSET: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n const isMaximized = node.isMaximized();\n const oldLayoutWindow = this.windows.get(node.getWindowId());\n const windowId = (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n const layoutWindow = new _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow(windowId, oldLayoutWindow.toScreenRectFunction(node.getRect()));\n const json = {\n type: \"row\",\n children: []\n };\n const row = _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.fromJson(json, this, layoutWindow);\n layoutWindow.root = row;\n this.windows.set(windowId, layoutWindow);\n row.drop(node, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, 0);\n if (isMaximized) {\n this.rootWindow.maximizedTabSet = undefined;\n }\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.POPOUT_TAB: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n const windowId = (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n let r = _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect.empty();\n if (node.getParent() instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n r = node.getParent().getRect();\n }\n else {\n r = node.getParent().getContentRect();\n }\n const oldLayoutWindow = this.windows.get(node.getWindowId());\n const layoutWindow = new _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow(windowId, oldLayoutWindow.toScreenRectFunction(r));\n const tabsetId = (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n const json = {\n type: \"row\",\n children: [\n { type: \"tabset\", id: tabsetId }\n ]\n };\n const row = _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.fromJson(json, this, layoutWindow);\n layoutWindow.root = row;\n this.windows.set(windowId, layoutWindow);\n const tabset = this.idMap.get(tabsetId);\n tabset.drop(node, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, 0, true);\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.CLOSE_WINDOW: {\n const window = this.windows.get(action.data.windowId);\n if (window) {\n (_a = this.rootWindow.root) === null || _a === void 0 ? void 0 : _a.drop(window === null || window === void 0 ? void 0 : window.root, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, -1);\n this.rootWindow.visitNodes((node, level) => {\n if (node instanceof _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode) {\n node.setWindowId(Model.MAIN_WINDOW_ID);\n }\n });\n // this.getFirstTabSet().drop(window?.root!,DockLocation.CENTER, -1);\n this.windows.delete(action.data.windowId);\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.CREATE_WINDOW: {\n const windowId = (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n const layoutWindow = new _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow(windowId, _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect.fromJson(action.data.rect));\n const row = _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.fromJson(action.data.layout, this, layoutWindow);\n layoutWindow.root = row;\n this.windows.set(windowId, layoutWindow);\n returnVal = windowId;\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.RENAME_TAB: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n node.setName(action.data.text);\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.SELECT_TAB: {\n const tabNode = this.idMap.get(action.data.tabNode);\n const windowId = action.data.windowId ? action.data.windowId : Model.MAIN_WINDOW_ID;\n const window = this.windows.get(windowId);\n if (tabNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n const parent = tabNode.getParent();\n const pos = parent.getChildren().indexOf(tabNode);\n if (parent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode) {\n if (parent.getSelected() === pos) {\n parent.setSelected(-1);\n }\n else {\n parent.setSelected(pos);\n }\n }\n else if (parent instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n if (parent.getSelected() !== pos) {\n parent.setSelected(pos);\n }\n window.activeTabSet = parent;\n }\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.SET_ACTIVE_TABSET: {\n const windowId = action.data.windowId ? action.data.windowId : Model.MAIN_WINDOW_ID;\n const window = this.windows.get(windowId);\n if (action.data.tabsetNode === undefined) {\n window.activeTabSet = undefined;\n }\n else {\n const tabsetNode = this.idMap.get(action.data.tabsetNode);\n if (tabsetNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n window.activeTabSet = tabsetNode;\n }\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.ADJUST_WEIGHTS: {\n const row = this.idMap.get(action.data.nodeId);\n const c = row.getChildren();\n for (let i = 0; i < c.length; i++) {\n const n = c[i];\n n.setWeight(action.data.weights[i]);\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.ADJUST_BORDER_SPLIT: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode) {\n node.setSize(action.data.pos);\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.MAXIMIZE_TOGGLE: {\n const windowId = action.data.windowId ? action.data.windowId : Model.MAIN_WINDOW_ID;\n const window = this.windows.get(windowId);\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n if (node === window.maximizedTabSet) {\n window.maximizedTabSet = undefined;\n }\n else {\n window.maximizedTabSet = node;\n window.activeTabSet = node;\n }\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.UPDATE_MODEL_ATTRIBUTES: {\n this.updateAttrs(action.data.json);\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.UPDATE_NODE_ATTRIBUTES: {\n const node = this.idMap.get(action.data.node);\n node.updateAttrs(action.data.json);\n break;\n }\n default:\n break;\n }\n this.updateIdMap();\n for (const listener of this.changeListeners) {\n listener(action);\n }\n return returnVal;\n }\n /**\n * Get the currently active tabset node\n */\n getActiveTabset(windowId = Model.MAIN_WINDOW_ID) {\n const window = this.windows.get(windowId);\n if (window && window.activeTabSet && this.getNodeById(window.activeTabSet.getId())) {\n return window.activeTabSet;\n }\n else {\n return undefined;\n }\n }\n /**\n * Get the currently maximized tabset node\n */\n getMaximizedTabset(windowId = Model.MAIN_WINDOW_ID) {\n return this.windows.get(windowId).maximizedTabSet;\n }\n /**\n * Gets the root RowNode of the model\n * @returns {RowNode}\n */\n getRoot(windowId = Model.MAIN_WINDOW_ID) {\n return this.windows.get(windowId).root;\n }\n isRootOrientationVertical() {\n return this.attributes.rootOrientationVertical;\n }\n isEnableRotateBorderIcons() {\n return this.attributes.enableRotateBorderIcons;\n }\n /**\n * Gets the\n * @returns {BorderSet|*}\n */\n getBorderSet() {\n return this.borders;\n }\n getwindowsMap() {\n return this.windows;\n }\n /**\n * Visits all the nodes in the model and calls the given function for each\n * @param fn a function that takes visited node and a integer level as parameters\n */\n visitNodes(fn) {\n this.borders.forEachNode(fn);\n for (const [_, w] of this.windows) {\n w.root.forEachNode(fn, 0);\n }\n }\n visitWindowNodes(windowId, fn) {\n if (this.windows.has(windowId)) {\n if (windowId === Model.MAIN_WINDOW_ID) {\n this.borders.forEachNode(fn);\n }\n this.windows.get(windowId).visitNodes(fn);\n }\n }\n /**\n * Gets a node by its id\n * @param id the id to find\n */\n getNodeById(id) {\n return this.idMap.get(id);\n }\n /**\n * Finds the first/top left tab set of the given node.\n * @param node The top node you want to begin searching from, deafults to the root node\n * @returns The first Tab Set\n */\n getFirstTabSet(node = this.windows.get(Model.MAIN_WINDOW_ID).root) {\n const child = node.getChildren()[0];\n if (child instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n return child;\n }\n else {\n return this.getFirstTabSet(child);\n }\n }\n /**\n * Loads the model from the given json object\n * @param json the json model to load\n * @returns {Model} a new Model object\n */\n static fromJson(json) {\n const model = new Model();\n Model.attributeDefinitions.fromJson(json.global, model.attributes);\n if (json.borders) {\n model.borders = _BorderSet__WEBPACK_IMPORTED_MODULE_6__.BorderSet.fromJson(json.borders, model);\n }\n if (json.popouts) {\n let i = 0;\n let top = 100;\n let left = 100;\n for (const windowId in json.popouts) {\n const windowJson = json.popouts[windowId];\n const layoutWindow = _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow.fromJson(windowJson, model, windowId);\n model.windows.set(windowId, layoutWindow);\n // offscreen windows will reload cascaded (since cannot reposition)\n if (!(0,_view_Utils__WEBPACK_IMPORTED_MODULE_12__.isOnScreen)(layoutWindow.rect)) {\n layoutWindow.rect = new _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect(top + i * 50, left + i * 50, 600, 400);\n i++;\n }\n }\n }\n model.rootWindow.root = _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.fromJson(json.layout, model, model.getwindowsMap().get(Model.MAIN_WINDOW_ID));\n model.tidy(); // initial tidy of node tree\n return model;\n }\n /**\n * Converts the model to a json object\n * @returns {IJsonModel} json object that represents this model\n */\n toJson() {\n const global = {};\n Model.attributeDefinitions.toJson(global, this.attributes);\n // save state of nodes\n this.visitNodes((node) => {\n node.fireEvent(\"save\", {});\n });\n const windows = {};\n for (const [id, window] of this.windows) {\n if (id !== Model.MAIN_WINDOW_ID) {\n windows[id] = window.toJson();\n }\n }\n return {\n global,\n borders: this.borders.toJson(),\n layout: this.rootWindow.root.toJson(),\n popouts: windows\n };\n }\n getSplitterSize() {\n return this.attributes.splitterSize;\n }\n getSplitterExtra() {\n return this.attributes.splitterExtra;\n }\n isEnableEdgeDock() {\n return this.attributes.enableEdgeDock;\n }\n isSplitterEnableHandle() {\n return this.attributes.splitterEnableHandle;\n }\n /**\n * Sets a function to allow/deny dropping a node\n * @param onAllowDrop function that takes the drag node and DropInfo and returns true if the drop is allowed\n */\n setOnAllowDrop(onAllowDrop) {\n this.onAllowDrop = onAllowDrop;\n }\n /**\n * set callback called when a new TabSet is created.\n * The tabNode can be undefined if it's the auto created first tabset in the root row (when the last\n * tab is deleted, the root tabset can be recreated)\n * @param onCreateTabSet\n */\n setOnCreateTabSet(onCreateTabSet) {\n this.onCreateTabSet = onCreateTabSet;\n }\n addChangeListener(listener) {\n this.changeListeners.push(listener);\n }\n removeChangeListener(listener) {\n const pos = this.changeListeners.findIndex(l => l === listener);\n if (pos !== -1) {\n this.changeListeners.splice(pos, 1);\n }\n }\n toString() {\n return JSON.stringify(this.toJson());\n }\n /***********************internal ********************************/\n /** @internal */\n removeEmptyWindows() {\n const emptyWindows = new Set();\n for (const [windowId] of this.windows) {\n if (windowId !== Model.MAIN_WINDOW_ID) {\n let count = 0;\n this.visitWindowNodes(windowId, (node) => {\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n count++;\n }\n });\n if (count === 0) {\n emptyWindows.add(windowId);\n }\n }\n }\n for (const windowId of emptyWindows) {\n this.windows.delete(windowId);\n }\n }\n /** @internal */\n setActiveTabset(tabsetNode, windowId) {\n const window = this.windows.get(windowId);\n if (window) {\n if (tabsetNode) {\n window.activeTabSet = tabsetNode;\n }\n else {\n window.activeTabSet = undefined;\n }\n }\n }\n /** @internal */\n setMaximizedTabset(tabsetNode, windowId) {\n const window = this.windows.get(windowId);\n if (window) {\n if (tabsetNode) {\n window.maximizedTabSet = tabsetNode;\n }\n else {\n window.maximizedTabSet = undefined;\n }\n }\n }\n /** @internal */\n updateIdMap() {\n // regenerate idMap to stop it building up\n this.idMap.clear();\n this.visitNodes((node) => {\n this.idMap.set(node.getId(), node);\n // if (node instanceof RowNode) {\n // node.normalizeWeights();\n // }\n });\n // console.log(JSON.stringify(Object.keys(this._idMap)));\n }\n /** @internal */\n addNode(node) {\n const id = node.getId();\n if (this.idMap.has(id)) {\n throw new Error(`Error: each node must have a unique id, duplicate id:${node.getId()}`);\n }\n this.idMap.set(id, node);\n }\n /** @internal */\n findDropTargetNode(windowId, dragNode, x, y) {\n let node = this.windows.get(windowId).root.findDropTargetNode(windowId, dragNode, x, y);\n if (node === undefined && windowId === Model.MAIN_WINDOW_ID) {\n node = this.borders.findDropTargetNode(dragNode, x, y);\n }\n return node;\n }\n /** @internal */\n tidy() {\n // console.log(\"before _tidy\", this.toString());\n for (const [_, window] of this.windows) {\n window.root.tidy();\n }\n // console.log(\"after _tidy\", this.toString());\n }\n /** @internal */\n updateAttrs(json) {\n Model.attributeDefinitions.update(json, this.attributes);\n }\n /** @internal */\n nextUniqueId() {\n return '#' + (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n }\n /** @internal */\n getAttribute(name) {\n return this.attributes[name];\n }\n /** @internal */\n getOnAllowDrop() {\n return this.onAllowDrop;\n }\n /** @internal */\n getOnCreateTabSet() {\n return this.onCreateTabSet;\n }\n static toTypescriptInterfaces() {\n Model.attributeDefinitions.pairAttributes(\"RowNode\", _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.getAttributeDefinitions());\n Model.attributeDefinitions.pairAttributes(\"TabSetNode\", _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode.getAttributeDefinitions());\n Model.attributeDefinitions.pairAttributes(\"TabNode\", _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode.getAttributeDefinitions());\n Model.attributeDefinitions.pairAttributes(\"BorderNode\", _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode.getAttributeDefinitions());\n let sb = [];\n sb.push(Model.attributeDefinitions.toTypescriptInterface(\"Global\", undefined));\n sb.push(_RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.getAttributeDefinitions().toTypescriptInterface(\"Row\", Model.attributeDefinitions));\n sb.push(_TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode.getAttributeDefinitions().toTypescriptInterface(\"TabSet\", Model.attributeDefinitions));\n sb.push(_TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode.getAttributeDefinitions().toTypescriptInterface(\"Tab\", Model.attributeDefinitions));\n sb.push(_BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode.getAttributeDefinitions().toTypescriptInterface(\"Border\", Model.attributeDefinitions));\n console.log(sb.join(\"\\n\"));\n }\n /** @internal */\n static createAttributeDefinitions() {\n const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\n attributeDefinitions.add(\"enableEdgeDock\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`enable docking to the edges of the layout, this will show the edge indicators`);\n attributeDefinitions.add(\"rootOrientationVertical\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`the top level 'row' will layout horizontally by default, set this option true to make it layout vertically`);\n attributeDefinitions.add(\"enableRotateBorderIcons\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`boolean indicating if tab icons should rotate with the text in the left and right borders`);\n // splitter\n attributeDefinitions.add(\"splitterSize\", 8).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`width in pixels of all splitters between tabsets/borders`);\n attributeDefinitions.add(\"splitterExtra\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`additional width in pixels of the splitter hit test area`);\n attributeDefinitions.add(\"splitterEnableHandle\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`enable a small centralized handle on all splitters`);\n // tab\n attributeDefinitions.add(\"tabEnableClose\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabCloseType\", 1).setType(\"ICloseType\");\n attributeDefinitions.add(\"tabEnablePopout\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setAlias(\"tabEnableFloat\");\n attributeDefinitions.add(\"tabEnablePopoutIcon\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabEnablePopoutOverlay\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabEnableRename\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabContentClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"tabClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"tabIcon\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"tabEnableRenderOnDemand\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabDragSpeed\", 0.3).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabBorderWidth\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabBorderHeight\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n // tabset\n attributeDefinitions.add(\"tabSetEnableDeleteWhenEmpty\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableDivide\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableMaximize\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableClose\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableSingleTabStretch\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetAutoSelectTab\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableActiveIcon\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetClassNameTabStrip\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"tabSetEnableTabStrip\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableTabWrap\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetTabLocation\", \"top\").setType(\"ITabLocation\");\n attributeDefinitions.add(\"tabMinWidth\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabMinHeight\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetMinWidth\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetMinHeight\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabMaxWidth\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabMaxHeight\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetMaxWidth\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetMaxHeight\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n // border\n attributeDefinitions.add(\"borderSize\", 200).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"borderMinSize\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"borderMaxSize\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"borderEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"borderAutoSelectTabWhenOpen\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"borderAutoSelectTabWhenClosed\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"borderClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"borderEnableAutoHide\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n return attributeDefinitions;\n }\n}\nModel.MAIN_WINDOW_ID = \"__main_window_id__\";\n/** @internal */\nModel.attributeDefinitions = Model.createAttributeDefinitions();\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Model.ts?");
249
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ DefaultMax: () => (/* binding */ DefaultMax),\n/* harmony export */ DefaultMin: () => (/* binding */ DefaultMin),\n/* harmony export */ Model: () => (/* binding */ Model)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _BorderSet__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./BorderSet */ \"./src/model/BorderSet.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _TabSetNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n/* harmony import */ var _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./LayoutWindow */ \"./src/model/LayoutWindow.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n/** @internal */\nconst DefaultMin = 0;\n/** @internal */\nconst DefaultMax = 99999;\n/**\n * Class containing the Tree of Nodes used by the FlexLayout component\n */\nclass Model {\n /**\n * 'private' constructor. Use the static method Model.fromJson(json) to create a model\n * @internal\n */\n constructor() {\n this.attributes = {};\n this.idMap = new Map();\n this.borders = new _BorderSet__WEBPACK_IMPORTED_MODULE_6__.BorderSet(this);\n this.windows = new Map();\n this.rootWindow = new _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow(Model.MAIN_WINDOW_ID, _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect.empty());\n this.windows.set(Model.MAIN_WINDOW_ID, this.rootWindow);\n this.changeListeners = [];\n }\n /**\n * Update the node tree by performing the given action,\n * Actions should be generated via static methods on the Actions class\n * @param action the action to perform\n * @returns added Node for Actions.addNode, windowId for createWindow\n */\n doAction(action) {\n var _a;\n let returnVal = undefined;\n // console.log(action);\n switch (action.type) {\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.ADD_NODE: {\n const newNode = new _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode(this, action.data.json, true);\n const toNode = this.idMap.get(action.data.toNode);\n if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode) {\n toNode.drop(newNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\n returnVal = newNode;\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.MOVE_NODE: {\n const fromNode = this.idMap.get(action.data.fromNode);\n if (fromNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode || fromNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode || fromNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode) {\n if (fromNode === this.getMaximizedTabset(fromNode.getWindowId())) {\n const fromWindow = this.windows.get(fromNode.getWindowId());\n fromWindow.maximizedTabSet = undefined;\n }\n const toNode = this.idMap.get(action.data.toNode);\n if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode) {\n toNode.drop(fromNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\n }\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.DELETE_TAB: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n node.delete();\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.DELETE_TABSET: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n // first delete all child tabs that are closeable\n const children = [...node.getChildren()];\n for (let i = 0; i < children.length; i++) {\n const child = children[i];\n if (child.isEnableClose()) {\n child.delete();\n }\n }\n if (node.getChildren().length === 0) {\n node.delete();\n }\n this.tidy();\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.POPOUT_TABSET: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n const isMaximized = node.isMaximized();\n const oldLayoutWindow = this.windows.get(node.getWindowId());\n const windowId = (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n const layoutWindow = new _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow(windowId, oldLayoutWindow.toScreenRectFunction(node.getRect()));\n const json = {\n type: \"row\",\n children: []\n };\n const row = _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.fromJson(json, this, layoutWindow);\n layoutWindow.root = row;\n this.windows.set(windowId, layoutWindow);\n row.drop(node, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, 0);\n if (isMaximized) {\n this.rootWindow.maximizedTabSet = undefined;\n }\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.POPOUT_TAB: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n const windowId = (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n let r = _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect.empty();\n if (node.getParent() instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n r = node.getParent().getRect();\n }\n else {\n r = node.getParent().getContentRect();\n }\n const oldLayoutWindow = this.windows.get(node.getWindowId());\n const layoutWindow = new _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow(windowId, oldLayoutWindow.toScreenRectFunction(r));\n const tabsetId = (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n const json = {\n type: \"row\",\n children: [\n { type: \"tabset\", id: tabsetId }\n ]\n };\n const row = _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.fromJson(json, this, layoutWindow);\n layoutWindow.root = row;\n this.windows.set(windowId, layoutWindow);\n const tabset = this.idMap.get(tabsetId);\n tabset.drop(node, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, 0, true);\n }\n this.removeEmptyWindows();\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.CLOSE_WINDOW: {\n const window = this.windows.get(action.data.windowId);\n if (window) {\n (_a = this.rootWindow.root) === null || _a === void 0 ? void 0 : _a.drop(window === null || window === void 0 ? void 0 : window.root, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, -1);\n this.rootWindow.visitNodes((node, level) => {\n if (node instanceof _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode) {\n node.setWindowId(Model.MAIN_WINDOW_ID);\n }\n });\n // this.getFirstTabSet().drop(window?.root!,DockLocation.CENTER, -1);\n this.windows.delete(action.data.windowId);\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.CREATE_WINDOW: {\n const windowId = (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n const layoutWindow = new _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow(windowId, _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect.fromJson(action.data.rect));\n const row = _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.fromJson(action.data.layout, this, layoutWindow);\n layoutWindow.root = row;\n this.windows.set(windowId, layoutWindow);\n returnVal = windowId;\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.RENAME_TAB: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n node.setName(action.data.text);\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.SELECT_TAB: {\n const tabNode = this.idMap.get(action.data.tabNode);\n const windowId = action.data.windowId ? action.data.windowId : Model.MAIN_WINDOW_ID;\n const window = this.windows.get(windowId);\n if (tabNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n const parent = tabNode.getParent();\n const pos = parent.getChildren().indexOf(tabNode);\n if (parent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode) {\n if (parent.getSelected() === pos) {\n parent.setSelected(-1);\n }\n else {\n parent.setSelected(pos);\n }\n }\n else if (parent instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n if (parent.getSelected() !== pos) {\n parent.setSelected(pos);\n }\n window.activeTabSet = parent;\n }\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.SET_ACTIVE_TABSET: {\n const windowId = action.data.windowId ? action.data.windowId : Model.MAIN_WINDOW_ID;\n const window = this.windows.get(windowId);\n if (action.data.tabsetNode === undefined) {\n window.activeTabSet = undefined;\n }\n else {\n const tabsetNode = this.idMap.get(action.data.tabsetNode);\n if (tabsetNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n window.activeTabSet = tabsetNode;\n }\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.ADJUST_WEIGHTS: {\n const row = this.idMap.get(action.data.nodeId);\n const c = row.getChildren();\n for (let i = 0; i < c.length; i++) {\n const n = c[i];\n n.setWeight(action.data.weights[i]);\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.ADJUST_BORDER_SPLIT: {\n const node = this.idMap.get(action.data.node);\n if (node instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode) {\n node.setSize(action.data.pos);\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.MAXIMIZE_TOGGLE: {\n const windowId = action.data.windowId ? action.data.windowId : Model.MAIN_WINDOW_ID;\n const window = this.windows.get(windowId);\n const node = this.idMap.get(action.data.node);\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n if (node === window.maximizedTabSet) {\n window.maximizedTabSet = undefined;\n }\n else {\n window.maximizedTabSet = node;\n window.activeTabSet = node;\n }\n }\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.UPDATE_MODEL_ATTRIBUTES: {\n this.updateAttrs(action.data.json);\n break;\n }\n case _Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.UPDATE_NODE_ATTRIBUTES: {\n const node = this.idMap.get(action.data.node);\n node.updateAttrs(action.data.json);\n break;\n }\n default:\n break;\n }\n this.updateIdMap();\n for (const listener of this.changeListeners) {\n listener(action);\n }\n return returnVal;\n }\n /**\n * Get the currently active tabset node\n */\n getActiveTabset(windowId = Model.MAIN_WINDOW_ID) {\n const window = this.windows.get(windowId);\n if (window && window.activeTabSet && this.getNodeById(window.activeTabSet.getId())) {\n return window.activeTabSet;\n }\n else {\n return undefined;\n }\n }\n /**\n * Get the currently maximized tabset node\n */\n getMaximizedTabset(windowId = Model.MAIN_WINDOW_ID) {\n return this.windows.get(windowId).maximizedTabSet;\n }\n /**\n * Gets the root RowNode of the model\n * @returns {RowNode}\n */\n getRoot(windowId = Model.MAIN_WINDOW_ID) {\n return this.windows.get(windowId).root;\n }\n isRootOrientationVertical() {\n return this.attributes.rootOrientationVertical;\n }\n isEnableRotateBorderIcons() {\n return this.attributes.enableRotateBorderIcons;\n }\n /**\n * Gets the\n * @returns {BorderSet|*}\n */\n getBorderSet() {\n return this.borders;\n }\n getwindowsMap() {\n return this.windows;\n }\n /**\n * Visits all the nodes in the model and calls the given function for each\n * @param fn a function that takes visited node and a integer level as parameters\n */\n visitNodes(fn) {\n this.borders.forEachNode(fn);\n for (const [_, w] of this.windows) {\n w.root.forEachNode(fn, 0);\n }\n }\n visitWindowNodes(windowId, fn) {\n if (this.windows.has(windowId)) {\n if (windowId === Model.MAIN_WINDOW_ID) {\n this.borders.forEachNode(fn);\n }\n this.windows.get(windowId).visitNodes(fn);\n }\n }\n /**\n * Gets a node by its id\n * @param id the id to find\n */\n getNodeById(id) {\n return this.idMap.get(id);\n }\n /**\n * Finds the first/top left tab set of the given node.\n * @param node The top node you want to begin searching from, deafults to the root node\n * @returns The first Tab Set\n */\n getFirstTabSet(node = this.windows.get(Model.MAIN_WINDOW_ID).root) {\n const child = node.getChildren()[0];\n if (child instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode) {\n return child;\n }\n else {\n return this.getFirstTabSet(child);\n }\n }\n /**\n * Loads the model from the given json object\n * @param json the json model to load\n * @returns {Model} a new Model object\n */\n static fromJson(json) {\n const model = new Model();\n Model.attributeDefinitions.fromJson(json.global, model.attributes);\n if (json.borders) {\n model.borders = _BorderSet__WEBPACK_IMPORTED_MODULE_6__.BorderSet.fromJson(json.borders, model);\n }\n if (json.popouts) {\n for (const windowId in json.popouts) {\n const windowJson = json.popouts[windowId];\n const layoutWindow = _LayoutWindow__WEBPACK_IMPORTED_MODULE_11__.LayoutWindow.fromJson(windowJson, model, windowId);\n model.windows.set(windowId, layoutWindow);\n }\n }\n model.rootWindow.root = _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.fromJson(json.layout, model, model.getwindowsMap().get(Model.MAIN_WINDOW_ID));\n model.tidy(); // initial tidy of node tree\n return model;\n }\n /**\n * Converts the model to a json object\n * @returns {IJsonModel} json object that represents this model\n */\n toJson() {\n const global = {};\n Model.attributeDefinitions.toJson(global, this.attributes);\n // save state of nodes\n this.visitNodes((node) => {\n node.fireEvent(\"save\", {});\n });\n const windows = {};\n for (const [id, window] of this.windows) {\n if (id !== Model.MAIN_WINDOW_ID) {\n windows[id] = window.toJson();\n }\n }\n return {\n global,\n borders: this.borders.toJson(),\n layout: this.rootWindow.root.toJson(),\n popouts: windows\n };\n }\n getSplitterSize() {\n return this.attributes.splitterSize;\n }\n getSplitterExtra() {\n return this.attributes.splitterExtra;\n }\n isEnableEdgeDock() {\n return this.attributes.enableEdgeDock;\n }\n isSplitterEnableHandle() {\n return this.attributes.splitterEnableHandle;\n }\n /**\n * Sets a function to allow/deny dropping a node\n * @param onAllowDrop function that takes the drag node and DropInfo and returns true if the drop is allowed\n */\n setOnAllowDrop(onAllowDrop) {\n this.onAllowDrop = onAllowDrop;\n }\n /**\n * set callback called when a new TabSet is created.\n * The tabNode can be undefined if it's the auto created first tabset in the root row (when the last\n * tab is deleted, the root tabset can be recreated)\n * @param onCreateTabSet\n */\n setOnCreateTabSet(onCreateTabSet) {\n this.onCreateTabSet = onCreateTabSet;\n }\n addChangeListener(listener) {\n this.changeListeners.push(listener);\n }\n removeChangeListener(listener) {\n const pos = this.changeListeners.findIndex(l => l === listener);\n if (pos !== -1) {\n this.changeListeners.splice(pos, 1);\n }\n }\n toString() {\n return JSON.stringify(this.toJson());\n }\n /***********************internal ********************************/\n /** @internal */\n removeEmptyWindows() {\n const emptyWindows = new Set();\n for (const [windowId] of this.windows) {\n if (windowId !== Model.MAIN_WINDOW_ID) {\n let count = 0;\n this.visitWindowNodes(windowId, (node) => {\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode) {\n count++;\n }\n });\n if (count === 0) {\n emptyWindows.add(windowId);\n }\n }\n }\n for (const windowId of emptyWindows) {\n this.windows.delete(windowId);\n }\n }\n /** @internal */\n setActiveTabset(tabsetNode, windowId) {\n const window = this.windows.get(windowId);\n if (window) {\n if (tabsetNode) {\n window.activeTabSet = tabsetNode;\n }\n else {\n window.activeTabSet = undefined;\n }\n }\n }\n /** @internal */\n setMaximizedTabset(tabsetNode, windowId) {\n const window = this.windows.get(windowId);\n if (window) {\n if (tabsetNode) {\n window.maximizedTabSet = tabsetNode;\n }\n else {\n window.maximizedTabSet = undefined;\n }\n }\n }\n /** @internal */\n updateIdMap() {\n // regenerate idMap to stop it building up\n this.idMap.clear();\n this.visitNodes((node) => {\n this.idMap.set(node.getId(), node);\n // if (node instanceof RowNode) {\n // node.normalizeWeights();\n // }\n });\n // console.log(JSON.stringify(Object.keys(this._idMap)));\n }\n /** @internal */\n addNode(node) {\n const id = node.getId();\n if (this.idMap.has(id)) {\n throw new Error(`Error: each node must have a unique id, duplicate id:${node.getId()}`);\n }\n this.idMap.set(id, node);\n }\n /** @internal */\n findDropTargetNode(windowId, dragNode, x, y) {\n let node = this.windows.get(windowId).root.findDropTargetNode(windowId, dragNode, x, y);\n if (node === undefined && windowId === Model.MAIN_WINDOW_ID) {\n node = this.borders.findDropTargetNode(dragNode, x, y);\n }\n return node;\n }\n /** @internal */\n tidy() {\n // console.log(\"before _tidy\", this.toString());\n for (const [_, window] of this.windows) {\n window.root.tidy();\n }\n // console.log(\"after _tidy\", this.toString());\n }\n /** @internal */\n updateAttrs(json) {\n Model.attributeDefinitions.update(json, this.attributes);\n }\n /** @internal */\n nextUniqueId() {\n return '#' + (0,_Utils__WEBPACK_IMPORTED_MODULE_10__.randomUUID)();\n }\n /** @internal */\n getAttribute(name) {\n return this.attributes[name];\n }\n /** @internal */\n getOnAllowDrop() {\n return this.onAllowDrop;\n }\n /** @internal */\n getOnCreateTabSet() {\n return this.onCreateTabSet;\n }\n static toTypescriptInterfaces() {\n Model.attributeDefinitions.pairAttributes(\"RowNode\", _RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.getAttributeDefinitions());\n Model.attributeDefinitions.pairAttributes(\"TabSetNode\", _TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode.getAttributeDefinitions());\n Model.attributeDefinitions.pairAttributes(\"TabNode\", _TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode.getAttributeDefinitions());\n Model.attributeDefinitions.pairAttributes(\"BorderNode\", _BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode.getAttributeDefinitions());\n let sb = [];\n sb.push(Model.attributeDefinitions.toTypescriptInterface(\"Global\", undefined));\n sb.push(_RowNode__WEBPACK_IMPORTED_MODULE_7__.RowNode.getAttributeDefinitions().toTypescriptInterface(\"Row\", Model.attributeDefinitions));\n sb.push(_TabSetNode__WEBPACK_IMPORTED_MODULE_9__.TabSetNode.getAttributeDefinitions().toTypescriptInterface(\"TabSet\", Model.attributeDefinitions));\n sb.push(_TabNode__WEBPACK_IMPORTED_MODULE_8__.TabNode.getAttributeDefinitions().toTypescriptInterface(\"Tab\", Model.attributeDefinitions));\n sb.push(_BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode.getAttributeDefinitions().toTypescriptInterface(\"Border\", Model.attributeDefinitions));\n console.log(sb.join(\"\\n\"));\n }\n /** @internal */\n static createAttributeDefinitions() {\n const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\n attributeDefinitions.add(\"enableEdgeDock\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`enable docking to the edges of the layout, this will show the edge indicators`);\n attributeDefinitions.add(\"rootOrientationVertical\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`the top level 'row' will layout horizontally by default, set this option true to make it layout vertically`);\n attributeDefinitions.add(\"enableRotateBorderIcons\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`boolean indicating if tab icons should rotate with the text in the left and right borders`);\n // splitter\n attributeDefinitions.add(\"splitterSize\", 8).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`width in pixels of all splitters between tabsets/borders`);\n attributeDefinitions.add(\"splitterExtra\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`additional width in pixels of the splitter hit test area`);\n attributeDefinitions.add(\"splitterEnableHandle\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`enable a small centralized handle on all splitters`);\n // tab\n attributeDefinitions.add(\"tabEnableClose\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabCloseType\", 1).setType(\"ICloseType\");\n attributeDefinitions.add(\"tabEnablePopout\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setAlias(\"tabEnableFloat\");\n attributeDefinitions.add(\"tabEnablePopoutIcon\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabEnablePopoutOverlay\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabEnableRename\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabContentClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"tabClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"tabIcon\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"tabEnableRenderOnDemand\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabDragSpeed\", 0.3).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabBorderWidth\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabBorderHeight\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n // tabset\n attributeDefinitions.add(\"tabSetEnableDeleteWhenEmpty\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableDivide\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableMaximize\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableClose\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableSingleTabStretch\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetAutoSelectTab\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableActiveIcon\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetClassNameTabStrip\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"tabSetEnableTabStrip\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetEnableTabWrap\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"tabSetTabLocation\", \"top\").setType(\"ITabLocation\");\n attributeDefinitions.add(\"tabMinWidth\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabMinHeight\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetMinWidth\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetMinHeight\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabMaxWidth\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabMaxHeight\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetMaxWidth\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetMaxHeight\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"tabSetEnableTabScrollbar\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n // border\n attributeDefinitions.add(\"borderSize\", 200).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"borderMinSize\", DefaultMin).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"borderMaxSize\", DefaultMax).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\n attributeDefinitions.add(\"borderEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"borderAutoSelectTabWhenOpen\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"borderAutoSelectTabWhenClosed\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"borderClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"borderEnableAutoHide\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n attributeDefinitions.add(\"borderEnableTabScrollbar\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\n return attributeDefinitions;\n }\n}\nModel.MAIN_WINDOW_ID = \"__main_window_id__\";\n/** @internal */\nModel.attributeDefinitions = Model.createAttributeDefinitions();\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Model.ts?");
250
250
 
251
251
  /***/ }),
252
252
 
@@ -286,7 +286,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
286
286
  \*********************************/
287
287
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
288
288
 
289
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ TabSetNode: () => (/* binding */ TabSetNode)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DropInfo__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _view_Utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../view/Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _Model__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Model */ \"./src/model/Model.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nclass TabSetNode extends _Node__WEBPACK_IMPORTED_MODULE_10__.Node {\n /** @internal */\n static fromJson(json, model, layoutWindow) {\n const newLayoutNode = new TabSetNode(model, json);\n if (json.children != null) {\n for (const jsonChild of json.children) {\n const child = _TabNode__WEBPACK_IMPORTED_MODULE_12__.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 layoutWindow.maximizedTabSet = newLayoutNode;\n }\n if (json.active && json.active === true) {\n layoutWindow.activeTabSet = newLayoutNode;\n }\n return newLayoutNode;\n }\n /** @internal */\n constructor(model, json) {\n super(model);\n /** @internal */\n this.tabStripRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n /** @internal */\n this.contentRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n this.calculatedMinHeight = 0;\n this.calculatedMinWidth = 0;\n this.calculatedMaxHeight = 0;\n this.calculatedMaxWidth = 0;\n TabSetNode.attributeDefinitions.fromJson(json, this.attributes);\n model.addNode(this);\n }\n getName() {\n return this.getAttr(\"name\");\n }\n isEnableActiveIcon() {\n return this.getAttr(\"enableActiveIcon\");\n }\n getSelected() {\n const selected = this.attributes.selected;\n if (selected !== undefined) {\n return selected;\n }\n return -1;\n }\n getSelectedNode() {\n const selected = this.getSelected();\n if (selected !== -1) {\n return this.children[selected];\n }\n return undefined;\n }\n getWeight() {\n return this.getAttr(\"weight\");\n }\n getAttrMinWidth() {\n return this.getAttr(\"minWidth\");\n }\n getAttrMinHeight() {\n return this.getAttr(\"minHeight\");\n }\n getMinWidth() {\n return this.calculatedMinWidth;\n }\n getMinHeight() {\n return this.calculatedMinHeight;\n }\n /** @internal */\n getMinSize(orientation) {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\n return this.getMinWidth();\n }\n else {\n return this.getMinHeight();\n }\n }\n getAttrMaxWidth() {\n return this.getAttr(\"maxWidth\");\n }\n getAttrMaxHeight() {\n return this.getAttr(\"maxHeight\");\n }\n getMaxWidth() {\n return this.calculatedMaxWidth;\n }\n getMaxHeight() {\n return this.calculatedMaxHeight;\n }\n /** @internal */\n getMaxSize(orientation) {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\n return this.getMaxWidth();\n }\n else {\n return this.getMaxHeight();\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 getConfig() {\n return this.attributes.config;\n }\n isMaximized() {\n return this.model.getMaximizedTabset(this.getWindowId()) === this;\n }\n isActive() {\n return this.model.getActiveTabset(this.getWindowId()) === this;\n }\n isEnableDeleteWhenEmpty() {\n return this.getAttr(\"enableDeleteWhenEmpty\");\n }\n isEnableDrop() {\n return this.getAttr(\"enableDrop\");\n }\n isEnableTabWrap() {\n return this.getAttr(\"enableTabWrap\");\n }\n isEnableDrag() {\n return this.getAttr(\"enableDrag\");\n }\n isEnableDivide() {\n return this.getAttr(\"enableDivide\");\n }\n isEnableMaximize() {\n return this.getAttr(\"enableMaximize\");\n }\n isEnableClose() {\n return this.getAttr(\"enableClose\");\n }\n isEnableSingleTabStretch() {\n return this.getAttr(\"enableSingleTabStretch\");\n }\n isEnableTabStrip() {\n return this.getAttr(\"enableTabStrip\");\n }\n isAutoSelectTab() {\n return this.getAttr(\"autoSelectTab\");\n }\n getClassNameTabStrip() {\n return this.getAttr(\"classNameTabStrip\");\n }\n getTabLocation() {\n return this.getAttr(\"tabLocation\");\n }\n toJson() {\n const json = {};\n TabSetNode.attributeDefinitions.toJson(json, this.attributes);\n json.children = this.children.map((child) => 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 calcMinMaxSize() {\n this.calculatedMinHeight = this.getAttrMinHeight();\n this.calculatedMinWidth = this.getAttrMinWidth();\n this.calculatedMaxHeight = this.getAttrMaxHeight();\n this.calculatedMaxWidth = this.getAttrMaxWidth();\n for (const child of this.children) {\n const c = child;\n this.calculatedMinWidth = Math.max(this.calculatedMinWidth, c.getMinWidth());\n this.calculatedMinHeight = Math.max(this.calculatedMinHeight, c.getMinHeight());\n this.calculatedMaxWidth = Math.min(this.calculatedMaxWidth, c.getMaxWidth());\n this.calculatedMaxHeight = Math.min(this.calculatedMaxHeight, c.getMaxHeight());\n }\n this.calculatedMinHeight += this.tabStripRect.height;\n this.calculatedMaxHeight += this.tabStripRect.height;\n }\n /** @internal */\n canMaximize() {\n if (this.isEnableMaximize()) {\n // always allow maximize toggle if already maximized\n if (this.getModel().getMaximizedTabset(this.getWindowId()) === this) {\n return true;\n }\n // only one tabset, so disable\n if (this.getParent() === this.getModel().getRoot(this.getWindowId()) && this.getModel().getRoot(this.getWindowId()).getChildren().length === 1) {\n return false;\n }\n return true;\n }\n return false;\n }\n /** @internal */\n setContentRect(rect) {\n this.contentRect = rect;\n }\n /** @internal */\n getContentRect() {\n return this.contentRect;\n }\n /** @internal */\n setTabStripRect(rect) {\n this.tabStripRect = rect;\n }\n /** @internal */\n setWeight(weight) {\n this.attributes.weight = weight;\n }\n /** @internal */\n setSelected(index) {\n this.attributes.selected = index;\n }\n getWindowId() {\n return this.parent.getWindowId();\n }\n /** @internal */\n canDrop(dragNode, x, y) {\n let dropInfo;\n if (dragNode === this) {\n const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n const outlineRect = this.tabStripRect;\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n else if (this.getWindowId() !== _Model__WEBPACK_IMPORTED_MODULE_9__.Model.MAIN_WINDOW_ID && !(0,_view_Utils__WEBPACK_IMPORTED_MODULE_7__.canDockToWindow)(dragNode)) {\n return undefined;\n }\n else if (this.contentRect.contains(x, y)) {\n let dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n if (this.model.getMaximizedTabset(this.parent.getWindowId()) === undefined) {\n dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getLocation(this.contentRect, x, y);\n }\n const outlineRect = dockLocation.getDockRect(this.rect);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n else if (this.tabStripRect != null && this.tabStripRect.contains(x, y)) {\n let r;\n let yy;\n let h;\n if (this.children.length === 0) {\n r = this.tabStripRect.clone();\n yy = r.y + 3;\n h = r.height - 4;\n r.width = 2;\n }\n else {\n let child = this.children[0];\n r = child.getTabRect();\n yy = r.y;\n h = r.height;\n let p = this.tabStripRect.x;\n let childCenter = 0;\n for (let i = 0; i < this.children.length; i++) {\n child = this.children[i];\n r = child.getTabRect();\n if (r.y !== yy) {\n yy = r.y;\n p = this.tabStripRect.x;\n }\n childCenter = r.x + r.width / 2;\n if (x >= p && x < childCenter && y > r.y && y < r.getBottom()) {\n const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(r.x - 2, r.y, 3, r.height);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n break;\n }\n p = childCenter;\n }\n }\n if (dropInfo == null) {\n const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(r.getRight() - 2, yy, 3, h);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this.children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n if (!dragNode.canDockInto(dragNode, dropInfo)) {\n return undefined;\n }\n return dropInfo;\n }\n /** @internal */\n delete() {\n this.parent.removeChild(this);\n }\n /** @internal */\n remove(node) {\n const removedIndex = this.removeChild(node);\n this.model.tidy();\n (0,_Utils__WEBPACK_IMPORTED_MODULE_13__.adjustSelectedIndex)(this, removedIndex);\n }\n /** @internal */\n drop(dragNode, location, index, select) {\n const dockLocation = location;\n if (this === dragNode) {\n // tabset drop into itself\n return; // dock back to itself\n }\n let dragParent = dragNode.getParent();\n let fromIndex = 0;\n if (dragParent !== undefined) {\n fromIndex = dragParent.removeChild(dragNode);\n // if selected node in border is being docked into tabset then deselect border tabs\n if (dragParent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_8__.BorderNode && dragParent.getSelected() === fromIndex) {\n dragParent.setSelected(-1);\n }\n else {\n (0,_Utils__WEBPACK_IMPORTED_MODULE_13__.adjustSelectedIndex)(dragParent, fromIndex);\n }\n }\n // if dropping a tab back to same tabset and moving to forward position then reduce insertion index\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_12__.TabNode && dragParent === this && fromIndex < index && index > 0) {\n index--;\n }\n // simple_bundled dock to existing tabset\n if (dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER) {\n let insertPos = index;\n if (insertPos === -1) {\n insertPos = this.children.length;\n }\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_12__.TabNode) {\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 if (dragNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode) {\n dragNode.forEachNode((child, level) => {\n if (child instanceof _TabNode__WEBPACK_IMPORTED_MODULE_12__.TabNode) {\n this.addChild(child, insertPos);\n // console.log(\"added child at : \" + insertPos);\n insertPos++;\n }\n }, 0);\n }\n else {\n for (let i = 0; i < dragNode.getChildren().length; i++) {\n const child = dragNode.getChildren()[i];\n this.addChild(child, insertPos);\n // console.log(\"added child at : \" + insertPos);\n insertPos++;\n }\n if (this.getSelected() === -1 && this.children.length > 0) {\n this.setSelected(0);\n }\n }\n this.model.setActiveTabset(this, this.parent.getWindowId());\n }\n else {\n let moveNode = dragNode;\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_12__.TabNode) {\n // create new tabset parent\n // console.log(\"create a new tabset\");\n const callback = this.model.getOnCreateTabSet();\n moveNode = new TabSetNode(this.model, callback ? callback(dragNode) : {});\n moveNode.addChild(dragNode);\n // console.log(\"added child at end\");\n dragParent = moveNode;\n }\n else if (dragNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode) {\n const parent = this.getParent();\n // need to turn round if same orientation unless docking oposite direction\n if (dragNode.getOrientation() === parent.getOrientation() &&\n (location.getOrientation() === parent.getOrientation() || location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER)) {\n const node = new _RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode(this.model, this.getWindowId(), {});\n node.addChild(dragNode);\n moveNode = node;\n }\n }\n else {\n moveNode = dragNode;\n }\n const parentRow = this.parent;\n const pos = parentRow.getChildren().indexOf(this);\n if (parentRow.getOrientation() === dockLocation.orientation) {\n moveNode.setWeight(this.getWeight() / 2);\n this.setWeight(this.getWeight() / 2);\n // console.log(\"added child 50% size at: \" + pos + dockLocation.indexPlus);\n parentRow.addChild(moveNode, 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 const newRow = new _RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode(this.model, this.getWindowId(), {});\n newRow.setWeight(this.getWeight());\n newRow.addChild(this);\n this.setWeight(50);\n moveNode.setWeight(50);\n // console.log(\"added child 50% size at: \" + dockLocation.indexPlus);\n newRow.addChild(moveNode, dockLocation.indexPlus);\n parentRow.removeChild(this);\n parentRow.addChild(newRow, pos);\n }\n if (moveNode instanceof TabSetNode) {\n this.model.setActiveTabset(moveNode, this.getWindowId());\n }\n }\n this.model.tidy();\n }\n /** @internal */\n updateAttrs(json) {\n TabSetNode.attributeDefinitions.update(json, this.attributes);\n }\n /** @internal */\n getAttributeDefinitions() {\n return TabSetNode.attributeDefinitions;\n }\n /** @internal */\n static getAttributeDefinitions() {\n return TabSetNode.attributeDefinitions;\n }\n /** @internal */\n static createAttributeDefinitions() {\n const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\n attributeDefinitions.add(\"type\", TabSetNode.TYPE, true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setFixed();\n attributeDefinitions.add(\"id\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setDescription(`the unique id of the tab set, if left undefined a uuid will be assigned`);\n attributeDefinitions.add(\"weight\", 100).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`relative weight for sizing of this tabset in parent row`);\n attributeDefinitions.add(\"selected\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`index of selected/visible tab in tabset`);\n attributeDefinitions.add(\"name\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"config\", undefined).setType(\"any\").setDescription(`a place to hold json config used in your own code`);\n attributeDefinitions.addInherited(\"enableDeleteWhenEmpty\", \"tabSetEnableDeleteWhenEmpty\").setDescription(`whether to delete this tabset when is has no tabs`);\n attributeDefinitions.addInherited(\"enableDrop\", \"tabSetEnableDrop\").setDescription(`allow user to drag tabs into this tabset`);\n attributeDefinitions.addInherited(\"enableDrag\", \"tabSetEnableDrag\").setDescription(`allow user to drag tabs out this tabset`);\n attributeDefinitions.addInherited(\"enableDivide\", \"tabSetEnableDivide\").setDescription(`allow user to drag tabs to region of this tabset, splitting into new tabset`);\n attributeDefinitions.addInherited(\"enableMaximize\", \"tabSetEnableMaximize\").setDescription(`allow user to maximize tabset to fill view via maximize button`);\n attributeDefinitions.addInherited(\"enableClose\", \"tabSetEnableClose\").setDescription(`allow user to close tabset via a close button`);\n attributeDefinitions.addInherited(\"enableSingleTabStretch\", \"tabSetEnableSingleTabStretch\").setDescription(`if the tabset has only a single tab then stretch the single tab to fill area and display in a header style`);\n attributeDefinitions.addInherited(\"classNameTabStrip\", \"tabSetClassNameTabStrip\").setDescription(`a class name to apply to the tab strip`);\n attributeDefinitions.addInherited(\"enableTabStrip\", \"tabSetEnableTabStrip\").setDescription(`enable tab strip and allow multiple tabs in this tabset`);\n attributeDefinitions.addInherited(\"minWidth\", \"tabSetMinWidth\").setDescription(`minimum width (in px) for this tabset`);\n attributeDefinitions.addInherited(\"minHeight\", \"tabSetMinHeight\").setDescription(`minimum height (in px) for this tabset`);\n attributeDefinitions.addInherited(\"maxWidth\", \"tabSetMaxWidth\").setDescription(`maximum width (in px) for this tabset`);\n attributeDefinitions.addInherited(\"maxHeight\", \"tabSetMaxHeight\").setDescription(`maximum height (in px) for this tabset`);\n attributeDefinitions.addInherited(\"enableTabWrap\", \"tabSetEnableTabWrap\").setDescription(`show tabs in location top or bottom`);\n attributeDefinitions.addInherited(\"tabLocation\", \"tabSetTabLocation\").setDescription(`the location of the tabs either top or bottom`);\n attributeDefinitions.addInherited(\"autoSelectTab\", \"tabSetAutoSelectTab\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether to select new/moved tabs in tabset`);\n attributeDefinitions.addInherited(\"enableActiveIcon\", \"tabSetEnableActiveIcon\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether the active icon (*) should be displayed when the tabset is active`);\n return attributeDefinitions;\n }\n}\nTabSetNode.TYPE = \"tabset\";\n/** @internal */\nTabSetNode.attributeDefinitions = TabSetNode.createAttributeDefinitions();\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/TabSetNode.ts?");
289
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ TabSetNode: () => (/* binding */ TabSetNode)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DropInfo__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DropInfo */ \"./src/DropInfo.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _view_Utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../view/Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _Model__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Model */ \"./src/model/Model.ts\");\n/* harmony import */ var _Node__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Node */ \"./src/model/Node.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nclass TabSetNode extends _Node__WEBPACK_IMPORTED_MODULE_10__.Node {\n /** @internal */\n static fromJson(json, model, layoutWindow) {\n const newLayoutNode = new TabSetNode(model, json);\n if (json.children != null) {\n for (const jsonChild of json.children) {\n const child = _TabNode__WEBPACK_IMPORTED_MODULE_12__.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 layoutWindow.maximizedTabSet = newLayoutNode;\n }\n if (json.active && json.active === true) {\n layoutWindow.activeTabSet = newLayoutNode;\n }\n return newLayoutNode;\n }\n /** @internal */\n constructor(model, json) {\n super(model);\n /** @internal */\n this.tabStripRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n /** @internal */\n this.contentRect = _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect.empty();\n this.calculatedMinHeight = 0;\n this.calculatedMinWidth = 0;\n this.calculatedMaxHeight = 0;\n this.calculatedMaxWidth = 0;\n TabSetNode.attributeDefinitions.fromJson(json, this.attributes);\n model.addNode(this);\n }\n getName() {\n return this.getAttr(\"name\");\n }\n isEnableActiveIcon() {\n return this.getAttr(\"enableActiveIcon\");\n }\n getSelected() {\n const selected = this.attributes.selected;\n if (selected !== undefined) {\n return selected;\n }\n return -1;\n }\n getSelectedNode() {\n const selected = this.getSelected();\n if (selected !== -1) {\n return this.children[selected];\n }\n return undefined;\n }\n getWeight() {\n return this.getAttr(\"weight\");\n }\n getAttrMinWidth() {\n return this.getAttr(\"minWidth\");\n }\n getAttrMinHeight() {\n return this.getAttr(\"minHeight\");\n }\n getMinWidth() {\n return this.calculatedMinWidth;\n }\n getMinHeight() {\n return this.calculatedMinHeight;\n }\n /** @internal */\n getMinSize(orientation) {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\n return this.getMinWidth();\n }\n else {\n return this.getMinHeight();\n }\n }\n getAttrMaxWidth() {\n return this.getAttr(\"maxWidth\");\n }\n getAttrMaxHeight() {\n return this.getAttr(\"maxHeight\");\n }\n getMaxWidth() {\n return this.calculatedMaxWidth;\n }\n getMaxHeight() {\n return this.calculatedMaxHeight;\n }\n /** @internal */\n getMaxSize(orientation) {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\n return this.getMaxWidth();\n }\n else {\n return this.getMaxHeight();\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 getConfig() {\n return this.attributes.config;\n }\n isMaximized() {\n return this.model.getMaximizedTabset(this.getWindowId()) === this;\n }\n isActive() {\n return this.model.getActiveTabset(this.getWindowId()) === this;\n }\n isEnableDeleteWhenEmpty() {\n return this.getAttr(\"enableDeleteWhenEmpty\");\n }\n isEnableDrop() {\n return this.getAttr(\"enableDrop\");\n }\n isEnableTabWrap() {\n return this.getAttr(\"enableTabWrap\");\n }\n isEnableDrag() {\n return this.getAttr(\"enableDrag\");\n }\n isEnableDivide() {\n return this.getAttr(\"enableDivide\");\n }\n isEnableMaximize() {\n return this.getAttr(\"enableMaximize\");\n }\n isEnableClose() {\n return this.getAttr(\"enableClose\");\n }\n isEnableSingleTabStretch() {\n return this.getAttr(\"enableSingleTabStretch\");\n }\n isEnableTabStrip() {\n return this.getAttr(\"enableTabStrip\");\n }\n isAutoSelectTab() {\n return this.getAttr(\"autoSelectTab\");\n }\n isEnableTabScrollbar() {\n return this.getAttr(\"enableTabScrollbar\");\n }\n getClassNameTabStrip() {\n return this.getAttr(\"classNameTabStrip\");\n }\n getTabLocation() {\n return this.getAttr(\"tabLocation\");\n }\n toJson() {\n const json = {};\n TabSetNode.attributeDefinitions.toJson(json, this.attributes);\n json.children = this.children.map((child) => 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 calcMinMaxSize() {\n this.calculatedMinHeight = this.getAttrMinHeight();\n this.calculatedMinWidth = this.getAttrMinWidth();\n this.calculatedMaxHeight = this.getAttrMaxHeight();\n this.calculatedMaxWidth = this.getAttrMaxWidth();\n for (const child of this.children) {\n const c = child;\n this.calculatedMinWidth = Math.max(this.calculatedMinWidth, c.getMinWidth());\n this.calculatedMinHeight = Math.max(this.calculatedMinHeight, c.getMinHeight());\n this.calculatedMaxWidth = Math.min(this.calculatedMaxWidth, c.getMaxWidth());\n this.calculatedMaxHeight = Math.min(this.calculatedMaxHeight, c.getMaxHeight());\n }\n this.calculatedMinHeight += this.tabStripRect.height;\n this.calculatedMaxHeight += this.tabStripRect.height;\n }\n /** @internal */\n canMaximize() {\n if (this.isEnableMaximize()) {\n // always allow maximize toggle if already maximized\n if (this.getModel().getMaximizedTabset(this.getWindowId()) === this) {\n return true;\n }\n // only one tabset, so disable\n if (this.getParent() === this.getModel().getRoot(this.getWindowId()) && this.getModel().getRoot(this.getWindowId()).getChildren().length === 1) {\n return false;\n }\n return true;\n }\n return false;\n }\n /** @internal */\n setContentRect(rect) {\n this.contentRect = rect;\n }\n /** @internal */\n getContentRect() {\n return this.contentRect;\n }\n /** @internal */\n setTabStripRect(rect) {\n this.tabStripRect = rect;\n }\n /** @internal */\n setWeight(weight) {\n this.attributes.weight = weight;\n }\n /** @internal */\n setSelected(index) {\n this.attributes.selected = index;\n }\n getWindowId() {\n return this.parent.getWindowId();\n }\n /** @internal */\n canDrop(dragNode, x, y) {\n let dropInfo;\n if (dragNode === this) {\n const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n const outlineRect = this.tabStripRect;\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n else if (this.getWindowId() !== _Model__WEBPACK_IMPORTED_MODULE_9__.Model.MAIN_WINDOW_ID && !(0,_view_Utils__WEBPACK_IMPORTED_MODULE_7__.canDockToWindow)(dragNode)) {\n return undefined;\n }\n else if (this.contentRect.contains(x, y)) {\n let dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n if (this.model.getMaximizedTabset(this.parent.getWindowId()) === undefined) {\n dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getLocation(this.contentRect, x, y);\n }\n const outlineRect = dockLocation.getDockRect(this.rect);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, -1, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n else if (this.tabStripRect != null && this.tabStripRect.contains(x, y)) {\n let r;\n let yy;\n let h;\n if (this.children.length === 0) {\n r = this.tabStripRect.clone();\n yy = r.y + 3;\n h = r.height - 4;\n r.width = 2;\n }\n else {\n let child = this.children[0];\n r = child.getTabRect();\n yy = r.y;\n h = r.height;\n let p = this.tabStripRect.x;\n let childCenter = 0;\n for (let i = 0; i < this.children.length; i++) {\n child = this.children[i];\n r = child.getTabRect();\n if (r.y !== yy) {\n yy = r.y;\n p = this.tabStripRect.x;\n }\n childCenter = r.x + r.width / 2;\n if (x >= p && x < childCenter && y > r.y && y < r.getBottom()) {\n const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(r.x - 2, r.y, 3, r.height);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, i, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n break;\n }\n p = childCenter;\n }\n }\n if (dropInfo == null) {\n const dockLocation = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\n const outlineRect = new _Rect__WEBPACK_IMPORTED_MODULE_5__.Rect(r.getRight() - 2, yy, 3, h);\n dropInfo = new _DropInfo__WEBPACK_IMPORTED_MODULE_3__.DropInfo(this, outlineRect, dockLocation, this.children.length, _Types__WEBPACK_IMPORTED_MODULE_6__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n }\n }\n if (!dragNode.canDockInto(dragNode, dropInfo)) {\n return undefined;\n }\n return dropInfo;\n }\n /** @internal */\n delete() {\n this.parent.removeChild(this);\n }\n /** @internal */\n remove(node) {\n const removedIndex = this.removeChild(node);\n this.model.tidy();\n (0,_Utils__WEBPACK_IMPORTED_MODULE_13__.adjustSelectedIndex)(this, removedIndex);\n }\n /** @internal */\n drop(dragNode, location, index, select) {\n const dockLocation = location;\n if (this === dragNode) {\n // tabset drop into itself\n return; // dock back to itself\n }\n let dragParent = dragNode.getParent();\n let fromIndex = 0;\n if (dragParent !== undefined) {\n fromIndex = dragParent.removeChild(dragNode);\n // if selected node in border is being docked into tabset then deselect border tabs\n if (dragParent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_8__.BorderNode && dragParent.getSelected() === fromIndex) {\n dragParent.setSelected(-1);\n }\n else {\n (0,_Utils__WEBPACK_IMPORTED_MODULE_13__.adjustSelectedIndex)(dragParent, fromIndex);\n }\n }\n // if dropping a tab back to same tabset and moving to forward position then reduce insertion index\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_12__.TabNode && dragParent === this && fromIndex < index && index > 0) {\n index--;\n }\n // simple_bundled dock to existing tabset\n if (dockLocation === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER) {\n let insertPos = index;\n if (insertPos === -1) {\n insertPos = this.children.length;\n }\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_12__.TabNode) {\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 if (dragNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode) {\n dragNode.forEachNode((child, level) => {\n if (child instanceof _TabNode__WEBPACK_IMPORTED_MODULE_12__.TabNode) {\n this.addChild(child, insertPos);\n // console.log(\"added child at : \" + insertPos);\n insertPos++;\n }\n }, 0);\n }\n else {\n for (let i = 0; i < dragNode.getChildren().length; i++) {\n const child = dragNode.getChildren()[i];\n this.addChild(child, insertPos);\n // console.log(\"added child at : \" + insertPos);\n insertPos++;\n }\n if (this.getSelected() === -1 && this.children.length > 0) {\n this.setSelected(0);\n }\n }\n this.model.setActiveTabset(this, this.parent.getWindowId());\n }\n else {\n let moveNode = dragNode;\n if (dragNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_12__.TabNode) {\n // create new tabset parent\n // console.log(\"create a new tabset\");\n const callback = this.model.getOnCreateTabSet();\n moveNode = new TabSetNode(this.model, callback ? callback(dragNode) : {});\n moveNode.addChild(dragNode);\n // console.log(\"added child at end\");\n dragParent = moveNode;\n }\n else if (dragNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode) {\n const parent = this.getParent();\n // need to turn round if same orientation unless docking oposite direction\n if (dragNode.getOrientation() === parent.getOrientation() &&\n (location.getOrientation() === parent.getOrientation() || location === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER)) {\n const node = new _RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode(this.model, this.getWindowId(), {});\n node.addChild(dragNode);\n moveNode = node;\n }\n }\n else {\n moveNode = dragNode;\n }\n const parentRow = this.parent;\n const pos = parentRow.getChildren().indexOf(this);\n if (parentRow.getOrientation() === dockLocation.orientation) {\n moveNode.setWeight(this.getWeight() / 2);\n this.setWeight(this.getWeight() / 2);\n // console.log(\"added child 50% size at: \" + pos + dockLocation.indexPlus);\n parentRow.addChild(moveNode, 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 const newRow = new _RowNode__WEBPACK_IMPORTED_MODULE_11__.RowNode(this.model, this.getWindowId(), {});\n newRow.setWeight(this.getWeight());\n newRow.addChild(this);\n this.setWeight(50);\n moveNode.setWeight(50);\n // console.log(\"added child 50% size at: \" + dockLocation.indexPlus);\n newRow.addChild(moveNode, dockLocation.indexPlus);\n parentRow.removeChild(this);\n parentRow.addChild(newRow, pos);\n }\n if (moveNode instanceof TabSetNode) {\n this.model.setActiveTabset(moveNode, this.getWindowId());\n }\n }\n this.model.tidy();\n }\n /** @internal */\n updateAttrs(json) {\n TabSetNode.attributeDefinitions.update(json, this.attributes);\n }\n /** @internal */\n getAttributeDefinitions() {\n return TabSetNode.attributeDefinitions;\n }\n /** @internal */\n static getAttributeDefinitions() {\n return TabSetNode.attributeDefinitions;\n }\n /** @internal */\n static createAttributeDefinitions() {\n const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\n attributeDefinitions.add(\"type\", TabSetNode.TYPE, true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setFixed();\n attributeDefinitions.add(\"id\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING).setDescription(`the unique id of the tab set, if left undefined a uuid will be assigned`);\n attributeDefinitions.add(\"weight\", 100).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`relative weight for sizing of this tabset in parent row`);\n attributeDefinitions.add(\"selected\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER).setDescription(`index of selected/visible tab in tabset`);\n attributeDefinitions.add(\"name\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\n attributeDefinitions.add(\"config\", undefined).setType(\"any\").setDescription(`a place to hold json config used in your own code`);\n attributeDefinitions.addInherited(\"enableDeleteWhenEmpty\", \"tabSetEnableDeleteWhenEmpty\").setDescription(`whether to delete this tabset when is has no tabs`);\n attributeDefinitions.addInherited(\"enableDrop\", \"tabSetEnableDrop\").setDescription(`allow user to drag tabs into this tabset`);\n attributeDefinitions.addInherited(\"enableDrag\", \"tabSetEnableDrag\").setDescription(`allow user to drag tabs out this tabset`);\n attributeDefinitions.addInherited(\"enableDivide\", \"tabSetEnableDivide\").setDescription(`allow user to drag tabs to region of this tabset, splitting into new tabset`);\n attributeDefinitions.addInherited(\"enableMaximize\", \"tabSetEnableMaximize\").setDescription(`allow user to maximize tabset to fill view via maximize button`);\n attributeDefinitions.addInherited(\"enableClose\", \"tabSetEnableClose\").setDescription(`allow user to close tabset via a close button`);\n attributeDefinitions.addInherited(\"enableSingleTabStretch\", \"tabSetEnableSingleTabStretch\").setDescription(`if the tabset has only a single tab then stretch the single tab to fill area and display in a header style`);\n attributeDefinitions.addInherited(\"classNameTabStrip\", \"tabSetClassNameTabStrip\").setDescription(`a class name to apply to the tab strip`);\n attributeDefinitions.addInherited(\"enableTabStrip\", \"tabSetEnableTabStrip\").setDescription(`enable tab strip and allow multiple tabs in this tabset`);\n attributeDefinitions.addInherited(\"minWidth\", \"tabSetMinWidth\").setDescription(`minimum width (in px) for this tabset`);\n attributeDefinitions.addInherited(\"minHeight\", \"tabSetMinHeight\").setDescription(`minimum height (in px) for this tabset`);\n attributeDefinitions.addInherited(\"maxWidth\", \"tabSetMaxWidth\").setDescription(`maximum width (in px) for this tabset`);\n attributeDefinitions.addInherited(\"maxHeight\", \"tabSetMaxHeight\").setDescription(`maximum height (in px) for this tabset`);\n attributeDefinitions.addInherited(\"enableTabWrap\", \"tabSetEnableTabWrap\").setDescription(`wrap tabs onto multiple lines`);\n attributeDefinitions.addInherited(\"tabLocation\", \"tabSetTabLocation\").setDescription(`the location of the tabs either top or bottom`);\n attributeDefinitions.addInherited(\"autoSelectTab\", \"tabSetAutoSelectTab\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether to select new/moved tabs in tabset`);\n attributeDefinitions.addInherited(\"enableActiveIcon\", \"tabSetEnableActiveIcon\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether the active icon (*) should be displayed when the tabset is active`);\n attributeDefinitions.addInherited(\"enableTabScrollbar\", \"tabSetEnableTabScrollbar\").setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN).setDescription(`whether to show a mini scrollbar for the tabs`);\n return attributeDefinitions;\n }\n}\nTabSetNode.TYPE = \"tabset\";\n/** @internal */\nTabSetNode.attributeDefinitions = TabSetNode.createAttributeDefinitions();\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/TabSetNode.ts?");
290
290
 
291
291
  /***/ }),
292
292
 
@@ -326,7 +326,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
326
326
  \***********************************/
327
327
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
328
328
 
329
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ BorderTabSet: () => (/* binding */ BorderTabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _BorderButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BorderButton */ \"./src/view/BorderButton.tsx\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./PopupMenu */ \"./src/view/PopupMenu.tsx\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n\n\n\n\n\n\n\n\n\n\n\n/** @internal */\nconst BorderTabSet = (props) => {\n const { border, layout, size } = props;\n const toolbarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const icons = layout.getIcons();\n react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\n border.setTabHeaderRect(_Rect__WEBPACK_IMPORTED_MODULE_10__.Rect.getBoundingClientRect(selfRef.current).relativeTo(layout.getDomRect()));\n });\n const { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__.useTabOverflow)(border, _Orientation__WEBPACK_IMPORTED_MODULE_7__.Orientation.flip(border.getOrientation()), toolbarRef, stickyButtonsRef);\n const onAuxMouseClick = (event) => {\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_9__.isAuxMouseEvent)(event)) {\n layout.auxMouseClick(border, event);\n }\n };\n const onContextMenu = (event) => {\n layout.showContextMenu(border, event);\n };\n const onInterceptPointerDown = (event) => {\n event.stopPropagation();\n };\n const onOverflowClick = (event) => {\n const callback = layout.getShowOverflowMenu();\n if (callback !== undefined) {\n callback(border, event, hiddenTabs, onOverflowItemSelect);\n }\n else {\n const element = overflowbuttonRef.current;\n (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout);\n }\n event.stopPropagation();\n };\n const onOverflowItemSelect = (item) => {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.selectTab(item.node.getId()));\n userControlledLeft.current = false;\n };\n const onPopoutTab = (event) => {\n const selectedTabNode = border.getChildren()[border.getSelected()];\n if (selectedTabNode !== undefined) {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.popoutTab(selectedTabNode.getId()));\n }\n event.stopPropagation();\n };\n const cm = layout.getClassName;\n const tabButtons = [];\n const layoutTab = (i) => {\n let isSelected = border.getSelected() === i;\n let child = border.getChildren()[i];\n tabButtons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderButton__WEBPACK_IMPORTED_MODULE_2__.BorderButton, { layout: layout, border: border.getLocation().getName(), node: child, path: border.getPath() + \"/tb\" + i, key: child.getId(), selected: isSelected, icons: icons }));\n if (i < border.getChildren().length - 1) {\n tabButtons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TAB_DIVIDER) }));\n }\n };\n for (let i = 0; i < border.getChildren().length; i++) {\n layoutTab(i);\n }\n let borderClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_ + border.getLocation().getName());\n if (border.getClassName() !== undefined) {\n borderClasses += \" \" + border.getClassName();\n }\n // allow customization of tabset right/bottom buttons\n let buttons = [];\n let stickyButtons = [];\n const renderState = { buttons, stickyButtons: stickyButtons, overflowPosition: undefined };\n layout.customizeTabSet(border, renderState);\n buttons = renderState.buttons;\n if (renderState.overflowPosition === undefined) {\n renderState.overflowPosition = stickyButtons.length;\n }\n if (stickyButtons.length > 0) {\n if (tabsTruncated) {\n buttons = [...stickyButtons, ...buttons];\n }\n else {\n tabButtons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onPointerDown: onInterceptPointerDown, onDragStart: (e) => { e.preventDefault(); }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\n }\n }\n if (hiddenTabs.length > 0) {\n const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Overflow_Menu_Tooltip);\n let overflowContent;\n if (typeof icons.more === \"function\") {\n overflowContent = icons.more(border, hiddenTabs);\n }\n else {\n overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n icons.more,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\n }\n buttons.splice(Math.min(renderState.overflowPosition, buttons.length), 0, react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"overflowbutton\", ref: overflowbuttonRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_ + border.getLocation().getName()), title: overflowTitle, onClick: onOverflowClick, onPointerDown: onInterceptPointerDown }, overflowContent));\n }\n const selectedIndex = border.getSelected();\n if (selectedIndex !== -1) {\n const selectedTabNode = border.getChildren()[selectedIndex];\n if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnablePopout()) {\n const popoutTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Popout_Tab);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"popout\", title: popoutTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT), onClick: onPopoutTab, onPointerDown: onInterceptPointerDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\n }\n }\n const toolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_ + border.getLocation().getName()) }, buttons));\n let innerStyle = {};\n let outerStyle = {};\n const borderHeight = size - 1;\n if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.LEFT) {\n innerStyle = { right: \"100%\", top: position };\n outerStyle = { width: borderHeight };\n }\n else if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.RIGHT) {\n innerStyle = { left: \"100%\", top: position };\n outerStyle = { width: borderHeight };\n }\n else {\n innerStyle = { left: position };\n outerStyle = { height: borderHeight };\n }\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, style: {\n display: \"flex\",\n flexDirection: (border.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_7__.Orientation.VERT ? \"row\" : \"column\")\n }, className: borderClasses, \"data-layout-path\": border.getPath(), onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onWheel: onMouseWheel },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: outerStyle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_ + border.getLocation().getName()) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: innerStyle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_ + border.getLocation().getName()) }, tabButtons)),\n toolbar));\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderTabSet.tsx?");
329
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ BorderTabSet: () => (/* binding */ BorderTabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _BorderButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BorderButton */ \"./src/view/BorderButton.tsx\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./PopupMenu */ \"./src/view/PopupMenu.tsx\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n\n\n\n\n\n\n\n\n\n\n\n/** @internal */\nconst BorderTabSet = (props) => {\n const { border, layout, size } = props;\n const toolbarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const tabStripInnerRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const icons = layout.getIcons();\n react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\n border.setTabHeaderRect(_Rect__WEBPACK_IMPORTED_MODULE_10__.Rect.getBoundingClientRect(selfRef.current).relativeTo(layout.getDomRect()));\n });\n const { selfRef, userControlledPositionRef, onScroll, hiddenTabs, onMouseWheel, isTabOverflow } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__.useTabOverflow)(layout, border, _Orientation__WEBPACK_IMPORTED_MODULE_7__.Orientation.flip(border.getOrientation()), tabStripInnerRef, layout.getClassName(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_BUTTON));\n const onAuxMouseClick = (event) => {\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_9__.isAuxMouseEvent)(event)) {\n layout.auxMouseClick(border, event);\n }\n };\n const onContextMenu = (event) => {\n layout.showContextMenu(border, event);\n };\n const onInterceptPointerDown = (event) => {\n event.stopPropagation();\n };\n const onOverflowClick = (event) => {\n const callback = layout.getShowOverflowMenu();\n const items = hiddenTabs.map(h => { return { index: h, node: border.getChildren()[h] }; });\n if (callback !== undefined) {\n callback(border, event, items, onOverflowItemSelect);\n }\n else {\n const element = overflowbuttonRef.current;\n (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, items, onOverflowItemSelect, layout);\n }\n event.stopPropagation();\n };\n const onOverflowItemSelect = (item) => {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.selectTab(item.node.getId()));\n userControlledPositionRef.current = false;\n };\n const onPopoutTab = (event) => {\n const selectedTabNode = border.getChildren()[border.getSelected()];\n if (selectedTabNode !== undefined) {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.popoutTab(selectedTabNode.getId()));\n }\n event.stopPropagation();\n };\n const cm = layout.getClassName;\n const tabButtons = [];\n const layoutTab = (i) => {\n let isSelected = border.getSelected() === i;\n let child = border.getChildren()[i];\n tabButtons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderButton__WEBPACK_IMPORTED_MODULE_2__.BorderButton, { layout: layout, border: border.getLocation().getName(), node: child, path: border.getPath() + \"/tb\" + i, key: child.getId(), selected: isSelected, icons: icons }));\n if (i < border.getChildren().length - 1) {\n tabButtons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TAB_DIVIDER) }));\n }\n };\n for (let i = 0; i < border.getChildren().length; i++) {\n layoutTab(i);\n }\n let borderClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_ + border.getLocation().getName());\n if (border.getClassName() !== undefined) {\n borderClasses += \" \" + border.getClassName();\n }\n // allow customization of tabset right/bottom buttons\n let buttons = [];\n let stickyButtons = [];\n const renderState = { buttons, stickyButtons: stickyButtons, overflowPosition: undefined };\n layout.customizeTabSet(border, renderState);\n buttons = renderState.buttons;\n if (renderState.overflowPosition === undefined) {\n renderState.overflowPosition = stickyButtons.length;\n }\n if (stickyButtons.length > 0) {\n if (isTabOverflow) {\n buttons = [...stickyButtons, ...buttons];\n }\n else {\n tabButtons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onPointerDown: onInterceptPointerDown, onDragStart: (e) => { e.preventDefault(); }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\n }\n }\n if (hiddenTabs.length > 0) {\n const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Overflow_Menu_Tooltip);\n let overflowContent;\n if (typeof icons.more === \"function\") {\n const items = hiddenTabs.map(h => { return { index: h, node: border.getChildren()[h] }; });\n overflowContent = icons.more(border, items);\n }\n else {\n overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n icons.more,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\n }\n buttons.splice(Math.min(renderState.overflowPosition, buttons.length), 0, react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"overflowbutton\", ref: overflowbuttonRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_ + border.getLocation().getName()), title: overflowTitle, onClick: onOverflowClick, onPointerDown: onInterceptPointerDown }, overflowContent));\n }\n const selectedIndex = border.getSelected();\n if (selectedIndex !== -1) {\n const selectedTabNode = border.getChildren()[selectedIndex];\n if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnablePopout()) {\n const popoutTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Popout_Tab);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"popout\", title: popoutTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT), onClick: onPopoutTab, onPointerDown: onInterceptPointerDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\n }\n }\n const toolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_ + border.getLocation().getName()) }, buttons));\n let innerStyle = {};\n let outerStyle = {};\n const borderHeight = size - 1;\n if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.LEFT) {\n innerStyle = { right: \"100%\", top: 0 };\n outerStyle = { width: borderHeight, overflowY: \"auto\" };\n }\n else if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.RIGHT) {\n innerStyle = { left: \"100%\", top: 0 };\n outerStyle = { width: borderHeight, overflowY: \"auto\" };\n }\n else {\n innerStyle = { left: 0 };\n outerStyle = { height: borderHeight, overflowX: \"auto\" };\n }\n const miniScrollbarClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__MINI_SCROLLBAR) + (border.isEnableTabScrollbar() ? \"\" : \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__MINI_SCROLLBAR_HIDDEN));\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, style: {\n display: \"flex\",\n flexDirection: (border.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_7__.Orientation.VERT ? \"row\" : \"column\")\n }, className: borderClasses, \"data-layout-path\": border.getPath(), onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onWheel: onMouseWheel },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: tabStripInnerRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_ + border.getLocation().getName()) + \" \" + miniScrollbarClasses, style: outerStyle, onScroll: onScroll },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: innerStyle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_ + border.getLocation().getName()) }, tabButtons)),\n toolbar));\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderTabSet.tsx?");
330
330
 
331
331
  /***/ }),
332
332
 
@@ -366,7 +366,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
366
366
  \*****************************/
367
367
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
368
368
 
369
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ FlexLayoutVersion: () => (/* binding */ FlexLayoutVersion),\n/* harmony export */ Layout: () => (/* binding */ Layout),\n/* harmony export */ LayoutInternal: () => (/* binding */ LayoutInternal)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react_dom_client__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom/client */ \"./node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/client.js\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_Model__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../model/Model */ \"./src/model/Model.ts\");\n/* harmony import */ var _model_TabNode__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../model/TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _BorderTab__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./BorderTab */ \"./src/view/BorderTab.tsx\");\n/* harmony import */ var _BorderTabSet__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./BorderTabSet */ \"./src/view/BorderTabSet.tsx\");\n/* harmony import */ var _DragContainer__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./DragContainer */ \"./src/view/DragContainer.tsx\");\n/* harmony import */ var _ErrorBoundary__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./ErrorBoundary */ \"./src/view/ErrorBoundary.tsx\");\n/* harmony import */ var _PopoutWindow__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./PopoutWindow */ \"./src/view/PopoutWindow.tsx\");\n/* harmony import */ var _Icons__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./Icons */ \"./src/view/Icons.tsx\");\n/* harmony import */ var _Overlay__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./Overlay */ \"./src/view/Overlay.tsx\");\n/* harmony import */ var _Row__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./Row */ \"./src/view/Row.tsx\");\n/* harmony import */ var _Tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./Tab */ \"./src/view/Tab.tsx\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var _TabButtonStamp__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./TabButtonStamp */ \"./src/view/TabButtonStamp.tsx\");\n/* harmony import */ var _SizeTracker__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./SizeTracker */ \"./src/view/SizeTracker.tsx\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n/**\n * A React component that hosts a multi-tabbed layout\n */\nclass Layout extends react__WEBPACK_IMPORTED_MODULE_0__.Component {\n /** @internal */\n constructor(props) {\n super(props);\n this.selfRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.revision = 0;\n }\n /** re-render the layout */\n redraw() {\n this.selfRef.current.redraw(\"parent \" + this.revision);\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 * @returns the added tab node or undefined\n */\n addTabToTabSet(tabsetId, json) {\n return this.selfRef.current.addTabToTabSet(tabsetId, json);\n }\n /**\n * Adds a new tab by dragging an item to the drop location, must be called from within an HTML\n * drag start handler. You can use the setDragComponent() method to set the drag image before calling this\n * method.\n * @param event the drag start event\n * @param json the json for the new tab node\n * @param onDrop a callback to call when the drag is complete\n */\n addTabWithDragAndDrop(event, json, onDrop) {\n this.selfRef.current.addTabWithDragAndDrop(event, json, onDrop);\n }\n /**\n * Move a tab/tabset using drag and drop, must be called from within an HTML\n * drag start handler\n * @param event the drag start event\n * @param node the tab or tabset to drag\n */\n moveTabWithDragAndDrop(event, node) {\n this.selfRef.current.moveTabWithDragAndDrop(event, node);\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 * @returns the added tab node or undefined\n */\n addTabToActiveTabSet(json) {\n return this.selfRef.current.addTabToActiveTabSet(json);\n }\n /**\n * Sets the drag image from a react component for a drag event\n * @param event the drag event\n * @param component the react component to be used for the drag image\n * @param x the x position of the drag cursor on the image\n * @param y the x position of the drag cursor on the image\n */\n setDragComponent(event, component, x, y) {\n this.selfRef.current.setDragComponent(event, component, x, y);\n }\n /** Get the root div element of the layout */\n getRootDiv() {\n return this.selfRef.current.getRootDiv();\n }\n /** @internal */\n render() {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(LayoutInternal, Object.assign({ ref: this.selfRef }, this.props, { renderRevision: this.revision++ })));\n }\n}\n/** @internal */\nclass LayoutInternal extends react__WEBPACK_IMPORTED_MODULE_0__.Component {\n // private renderCount: any;\n constructor(props) {\n super(props);\n this.moveableElementMap = new Map();\n this.dragEnterCount = 0;\n this.dragging = false;\n this.updateLayoutMetrics = () => {\n if (this.findBorderBarSizeRef.current) {\n const borderBarSize = this.findBorderBarSizeRef.current.getBoundingClientRect().height;\n if (borderBarSize !== this.state.calculatedBorderBarSize) {\n this.setState({ calculatedBorderBarSize: borderBarSize });\n }\n }\n };\n this.onModelChange = (action) => {\n this.redrawInternal(\"model change\");\n if (this.props.onModelChange) {\n this.props.onModelChange(this.props.model, action);\n }\n };\n this.updateRect = () => {\n const rect = this.getDomRect();\n if (!rect.equals(this.state.rect) && rect.width !== 0 && rect.height !== 0) {\n // console.log(\"updateRect\", rect.floor());\n this.setState({ rect });\n if (this.windowId !== _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID) {\n this.redrawInternal(\"rect updated\");\n }\n }\n };\n this.getClassName = (defaultClassName) => {\n if (this.props.classNameMapper === undefined) {\n return defaultClassName;\n }\n else {\n return this.props.classNameMapper(defaultClassName);\n }\n };\n this.onCloseWindow = (windowLayout) => {\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.closeWindow(windowLayout.windowId));\n };\n this.onSetWindow = (windowLayout, window) => {\n };\n this.showControlInPortal = (control, element) => {\n const portal = (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(control, element);\n this.setState({ portal });\n };\n this.hideControlInPortal = () => {\n this.setState({ portal: undefined });\n };\n this.getIcons = () => {\n return this.icons;\n };\n this.setDragNode = (event, node) => {\n LayoutInternal.dragState = new DragState(this.mainLayout, DragSource.Internal, node, undefined, undefined);\n // Note: can only set (very) limited types on android! so cannot set json\n // Note: must set text/plain for android to allow drag, \n // so just set a simple message indicating its a flexlayout drag (this is not used anywhere else)\n event.dataTransfer.setData('text/plain', \"--flexlayout--\");\n event.dataTransfer.effectAllowed = \"copyMove\";\n event.dataTransfer.dropEffect = \"move\";\n this.dragEnterCount = 0;\n if (node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_12__.TabSetNode) {\n let rendered = false;\n let content = this.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Move_Tabset);\n if (node.getChildren().length > 0) {\n content = this.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Move_Tabs).replace(\"?\", String(node.getChildren().length));\n }\n if (this.props.onRenderDragRect) {\n const dragComponent = this.props.onRenderDragRect(content, node, undefined);\n if (dragComponent) {\n this.setDragComponent(event, dragComponent, 10, 10);\n rendered = true;\n }\n }\n if (!rendered) {\n this.setDragComponent(event, content, 10, 10);\n }\n }\n else {\n const element = event.target;\n const rect = element.getBoundingClientRect();\n const offsetX = event.clientX - rect.left;\n const offsetY = event.clientY - rect.top;\n const parentNode = node === null || node === void 0 ? void 0 : node.getParent();\n const isInVerticalBorder = parentNode instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_9__.BorderNode && parentNode.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_5__.Orientation.HORZ;\n const x = isInVerticalBorder ? 10 : offsetX;\n const y = isInVerticalBorder ? 10 : offsetY;\n let rendered = false;\n if (this.props.onRenderDragRect) {\n const content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButtonStamp__WEBPACK_IMPORTED_MODULE_23__.TabButtonStamp, { key: node.getId(), layout: this, node: node });\n const dragComponent = this.props.onRenderDragRect(content, node, undefined);\n if (dragComponent) {\n this.setDragComponent(event, dragComponent, x, y);\n rendered = true;\n }\n }\n if (!rendered) {\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_22__.isSafari)()) { // safari doesnt render the offscreen tabstamps\n this.setDragComponent(event, react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButtonStamp__WEBPACK_IMPORTED_MODULE_23__.TabButtonStamp, { node: node, layout: this }), x, y);\n }\n else {\n event.dataTransfer.setDragImage(node.getTabStamp(), x, y);\n }\n }\n }\n };\n this.onDragEnterRaw = (event) => {\n this.dragEnterCount++;\n if (this.dragEnterCount === 1) {\n this.onDragEnter(event);\n }\n };\n this.onDragLeaveRaw = (event) => {\n this.dragEnterCount--;\n if (this.dragEnterCount === 0) {\n this.onDragLeave(event);\n }\n };\n this.onDragEnter = (event) => {\n // console.log(\"onDragEnter\", this.windowId, this.dragEnterCount);\n var _a;\n if (!LayoutInternal.dragState && this.props.onExternalDrag) { // not internal dragging\n const externalDrag = this.props.onExternalDrag(event);\n if (externalDrag) {\n const tempNode = _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode.fromJson(externalDrag.json, this.props.model, false);\n LayoutInternal.dragState = new DragState(this.mainLayout, DragSource.External, tempNode, externalDrag.json, externalDrag.onDrop);\n }\n }\n if (LayoutInternal.dragState) {\n if (this.windowId !== _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID && LayoutInternal.dragState.mainLayout === this.mainLayout) {\n LayoutInternal.dragState.mainLayout.setDraggingOverWindow(true);\n }\n if (LayoutInternal.dragState.mainLayout !== this.mainLayout) {\n return; // drag not by this layout or its popouts\n }\n event.preventDefault();\n this.dropInfo = undefined;\n const rootdiv = this.selfRef.current;\n this.outlineDiv = this.currentDocument.createElement(\"div\");\n this.outlineDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n this.outlineDiv.style.visibility = \"hidden\";\n const speed = this.props.model.getAttribute(\"tabDragSpeed\");\n this.outlineDiv.style.transition = `top ${speed}s, left ${speed}s, width ${speed}s, height ${speed}s`;\n rootdiv.appendChild(this.outlineDiv);\n this.dragging = true;\n this.showOverlay(true);\n // add edge indicators\n if (!this.isDraggingOverWindow && this.props.model.getMaximizedTabset(this.windowId) === undefined) {\n this.setState({ showEdges: this.props.model.isEnableEdgeDock() });\n }\n const clientRect = (_a = this.selfRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();\n const r = new _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect(event.clientX - (clientRect.left), event.clientY - (clientRect.top), 1, 1);\n r.positionElement(this.outlineDiv);\n }\n };\n this.onDragOver = (event) => {\n var _a, _b, _c;\n if (this.dragging && !this.isDraggingOverWindow) {\n // console.log(\"onDragOver\");\n event.preventDefault();\n const clientRect = (_a = this.selfRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();\n const pos = {\n x: event.clientX - ((_b = clientRect === null || clientRect === void 0 ? void 0 : clientRect.left) !== null && _b !== void 0 ? _b : 0),\n y: event.clientY - ((_c = clientRect === null || clientRect === void 0 ? void 0 : clientRect.top) !== null && _c !== void 0 ? _c : 0),\n };\n this.checkForBorderToShow(pos.x, pos.y);\n let dropInfo = this.props.model.findDropTargetNode(this.windowId, LayoutInternal.dragState.dragNode, pos.x, pos.y);\n if (dropInfo) {\n this.dropInfo = dropInfo;\n if (this.outlineDiv) {\n this.outlineDiv.className = this.getClassName(dropInfo.className);\n dropInfo.rect.positionElement(this.outlineDiv);\n this.outlineDiv.style.visibility = \"visible\";\n }\n }\n }\n };\n this.onDragLeave = (event) => {\n // console.log(\"onDragLeave\", this.windowId, this.dragging);\n if (this.dragging) {\n if (this.windowId !== _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID) {\n LayoutInternal.dragState.mainLayout.setDraggingOverWindow(false);\n }\n this.clearDragLocal();\n }\n };\n this.onDrop = (event) => {\n // console.log(\"ondrop\", this.windowId, this.dragging, Layout.dragState);\n if (this.dragging) {\n event.preventDefault();\n const dragState = LayoutInternal.dragState;\n if (this.dropInfo) {\n if (dragState.dragJson !== undefined) {\n const newNode = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.addNode(dragState.dragJson, this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\n if (dragState.fnNewNodeDropped !== undefined) {\n dragState.fnNewNodeDropped(newNode, event);\n }\n }\n else if (dragState.dragNode !== undefined) {\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.moveNode(dragState.dragNode.getId(), this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\n }\n }\n this.mainLayout.clearDragMain();\n }\n this.dragEnterCount = 0; // must set to zero here ref sublayouts\n };\n this.orderedIds = [];\n this.selfRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.moveablesRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.mainRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.findBorderBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.supportsPopout = props.supportsPopout !== undefined ? props.supportsPopout : defaultSupportsPopout;\n this.popoutURL = props.popoutURL ? props.popoutURL : \"popout.html\";\n this.icons = Object.assign(Object.assign({}, defaultIcons), props.icons);\n this.windowId = props.windowId ? props.windowId : _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID;\n this.mainLayout = this.props.mainLayout ? this.props.mainLayout : this;\n this.isDraggingOverWindow = false;\n this.layoutWindow = this.props.model.getwindowsMap().get(this.windowId);\n this.layoutWindow.layout = this;\n this.popoutWindowName = this.props.popoutWindowName || \"Popout Window\";\n // this.renderCount = 0;\n this.state = {\n rect: _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.empty(),\n editingTab: undefined,\n showEdges: false,\n showOverlay: false,\n calculatedBorderBarSize: 29,\n layoutRevision: 0,\n forceRevision: 0,\n showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.CENTER\n };\n this.isMainWindow = this.windowId === _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID;\n }\n componentDidMount() {\n this.updateRect();\n this.currentDocument = this.selfRef.current.ownerDocument;\n this.currentWindow = this.currentDocument.defaultView;\n this.layoutWindow.window = this.currentWindow;\n this.layoutWindow.toScreenRectFunction = (r) => this.getScreenRect(r);\n this.resizeObserver = new ResizeObserver(entries => {\n requestAnimationFrame(() => {\n this.updateRect();\n });\n });\n if (this.selfRef.current) {\n this.resizeObserver.observe(this.selfRef.current);\n }\n if (this.isMainWindow) {\n this.props.model.addChangeListener(this.onModelChange);\n this.updateLayoutMetrics();\n }\n else {\n // since resizeObserver doesn't always work as expected when observing element in another document\n this.currentWindow.addEventListener(\"resize\", () => {\n this.updateRect();\n });\n const sourceElement = this.props.mainLayout.getRootDiv();\n const targetElement = this.selfRef.current;\n (0,_Utils__WEBPACK_IMPORTED_MODULE_22__.copyInlineStyles)(sourceElement, targetElement);\n this.styleObserver = new MutationObserver(() => {\n const changed = (0,_Utils__WEBPACK_IMPORTED_MODULE_22__.copyInlineStyles)(sourceElement, targetElement);\n if (changed) {\n this.redraw(\"mutation observer\");\n }\n });\n // Observe changes to the source element's style attribute\n this.styleObserver.observe(sourceElement, { attributeFilter: ['style'] });\n }\n // allow tabs to overlay when hidden\n document.addEventListener('visibilitychange', () => {\n for (const [_, layoutWindow] of this.props.model.getwindowsMap()) {\n const layout = layoutWindow.layout;\n if (layout) {\n this.redraw(\"visibility change\");\n }\n }\n });\n }\n componentDidUpdate() {\n this.currentDocument = this.selfRef.current.ownerDocument;\n this.currentWindow = this.currentDocument.defaultView;\n if (this.isMainWindow) {\n if (this.props.model !== this.previousModel) {\n if (this.previousModel !== undefined) {\n this.previousModel.removeChangeListener(this.onModelChange); // stop listening to old model\n }\n this.props.model.getwindowsMap().get(this.windowId).layout = this;\n this.props.model.addChangeListener(this.onModelChange);\n this.layoutWindow = this.props.model.getwindowsMap().get(this.windowId);\n this.layoutWindow.layout = this;\n this.layoutWindow.toScreenRectFunction = (r) => this.getScreenRect(r);\n this.previousModel = this.props.model;\n this.tidyMoveablesMap();\n }\n this.updateLayoutMetrics();\n }\n }\n componentWillUnmount() {\n var _a, _b;\n if (this.selfRef.current) {\n (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.selfRef.current);\n }\n (_b = this.styleObserver) === null || _b === void 0 ? void 0 : _b.disconnect();\n }\n render() {\n // console.log(\"render\", this.windowId, this.state.revision, this.renderCount++);\n // first render will be used to find the size (via selfRef)\n if (!this.selfRef.current) {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.moveablesRef, key: \"__moveables__\", className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_MOVEABLES) }),\n this.renderMetricsElements()));\n }\n const model = this.props.model;\n model.getRoot(this.windowId).calcMinMaxSize();\n model.getRoot(this.windowId).setPaths(\"\");\n model.getBorderSet().setPaths();\n const inner = this.renderLayout();\n const outer = this.renderBorders(inner);\n const tabs = this.renderTabs();\n const reorderedTabs = this.reorderComponents(tabs, this.orderedIds);\n let floatingWindows = null;\n let tabMoveables = null;\n let tabStamps = null;\n let metricElements = null;\n if (this.isMainWindow) {\n floatingWindows = this.renderWindows();\n metricElements = this.renderMetricsElements();\n tabMoveables = this.renderTabMoveables();\n tabStamps = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"__tabStamps__\", className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_TAB_STAMPS) }, this.renderTabStamps());\n }\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT), onDragEnter: this.onDragEnterRaw, onDragLeave: this.onDragLeaveRaw, onDragOver: this.onDragOver, onDrop: this.onDrop },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.moveablesRef, key: \"__moveables__\", className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_MOVEABLES) }),\n metricElements,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Overlay__WEBPACK_IMPORTED_MODULE_19__.Overlay, { key: \"__overlay__\", layout: this, show: this.state.showOverlay }),\n outer,\n reorderedTabs,\n tabMoveables,\n tabStamps,\n this.state.portal,\n floatingWindows));\n }\n renderBorders(inner) {\n const classMain = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_MAIN);\n const borders = this.props.model.getBorderSet().getBorderMap();\n if (this.isMainWindow && borders.size > 0) {\n inner = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classMain, ref: this.mainRef }, inner));\n const borderSetComponents = new Map();\n const borderSetContentComponents = new Map();\n for (const [_, location] of _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.values) {\n const border = borders.get(location);\n const showBorder = border && (!border.isAutoHide() ||\n (border.isAutoHide() && (border.getChildren().length > 0 || this.state.showHiddenBorder === location)));\n if (showBorder) {\n borderSetComponents.set(location, react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderTabSet__WEBPACK_IMPORTED_MODULE_14__.BorderTabSet, { layout: this, border: border, size: this.state.calculatedBorderBarSize }));\n borderSetContentComponents.set(location, react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderTab__WEBPACK_IMPORTED_MODULE_13__.BorderTab, { layout: this, border: border, show: border.getSelected() !== -1 }));\n }\n }\n const classBorderOuter = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_BORDER_CONTAINER);\n const classBorderInner = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_BORDER_CONTAINER_INNER);\n if (this.props.model.getBorderSet().getLayoutHorizontal()) {\n const innerWithBorderTabs = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"column\" } },\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP),\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"row\" } },\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT),\n inner,\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT)),\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM)));\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderOuter, style: { flexDirection: \"column\" } },\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP),\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"row\" } },\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT),\n innerWithBorderTabs,\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT)),\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM)));\n }\n else {\n const innerWithBorderTabs = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"row\" } },\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT),\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"column\" } },\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP),\n inner,\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM)),\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT)));\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderOuter, style: { flexDirection: \"row\" } },\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT),\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"column\" } },\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP),\n innerWithBorderTabs,\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM)),\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT)));\n }\n }\n else { // no borders\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classMain, ref: this.mainRef, style: { position: \"absolute\", top: 0, left: 0, bottom: 0, right: 0, display: \"flex\" } }, inner));\n }\n }\n renderLayout() {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Row__WEBPACK_IMPORTED_MODULE_20__.Row, { key: \"__row__\", layout: this, node: this.props.model.getRoot(this.windowId) }),\n this.renderEdgeIndicators()));\n }\n renderEdgeIndicators() {\n const edges = [];\n const arrowIcon = this.icons.edgeArrow;\n if (this.state.showEdges) {\n const r = this.props.model.getRoot(this.windowId).getRect();\n const length = edgeRectLength;\n const width = edgeRectWidth;\n const offset = edgeRectLength / 2;\n const className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT);\n const radius = 50;\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"North\", style: { top: 0, left: r.width / 2 - offset, width: length, height: width, borderBottomLeftRadius: radius, borderBottomRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT_TOP) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { transform: \"rotate(180deg)\" } }, arrowIcon)));\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"West\", style: { top: r.height / 2 - offset, left: 0, width: width, height: length, borderTopRightRadius: radius, borderBottomRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT_LEFT) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { transform: \"rotate(90deg)\" } }, arrowIcon)));\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"South\", style: { top: r.height - width, left: r.width / 2 - offset, width: length, height: width, borderTopLeftRadius: radius, borderTopRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT_BOTTOM) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", null, arrowIcon)));\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"East\", style: { top: r.height / 2 - offset, left: r.width - width, width: width, height: length, borderTopLeftRadius: radius, borderBottomLeftRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT_RIGHT) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { transform: \"rotate(-90deg)\" } }, arrowIcon)));\n }\n return edges;\n }\n renderWindows() {\n const floatingWindows = [];\n if (this.supportsPopout) {\n const windows = this.props.model.getwindowsMap();\n let i = 1;\n for (const [windowId, layoutWindow] of windows) {\n if (windowId !== _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID) {\n floatingWindows.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_PopoutWindow__WEBPACK_IMPORTED_MODULE_17__.PopoutWindow, { key: windowId, layout: this, title: this.popoutWindowName + \" \" + i, layoutWindow: layoutWindow, url: this.popoutURL + \"?id=\" + windowId, onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(LayoutInternal, Object.assign({}, this.props, { windowId: windowId, mainLayout: this }))));\n i++;\n }\n }\n }\n return floatingWindows;\n }\n renderTabMoveables() {\n const tabMoveables = [];\n this.props.model.visitNodes((node) => {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode) {\n const child = node;\n const element = this.getMoveableElement(child.getId());\n child.setMoveableElement(element);\n const selected = child.isSelected();\n const rect = child.getParent().getContentRect();\n // only render first time if size >0\n const renderTab = child.isRendered() ||\n ((selected || !child.isEnableRenderOnDemand()) && (rect.width > 0 && rect.height > 0));\n if (renderTab) {\n // console.log(\"rendertab\", child.getName(), this.props.renderRevision);\n const key = child.getId() + (child.isEnableWindowReMount() ? child.getWindowId() : \"\");\n tabMoveables.push((0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_SizeTracker__WEBPACK_IMPORTED_MODULE_24__.SizeTracker, { rect: rect, selected: child.isSelected(), forceRevision: this.state.forceRevision, tabsRevision: this.props.renderRevision, key: key },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_ErrorBoundary__WEBPACK_IMPORTED_MODULE_16__.ErrorBoundary, { message: this.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Error_rendering_component) }, this.props.factory(child))), element, key));\n child.setRendered(renderTab);\n }\n }\n });\n return tabMoveables;\n }\n renderTabStamps() {\n const tabStamps = [];\n this.props.model.visitNodes((node) => {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode) {\n const child = node;\n // what the tab should look like when dragged (since images need to have been loaded before drag image can be taken)\n tabStamps.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_DragContainer__WEBPACK_IMPORTED_MODULE_15__.DragContainer, { key: child.getId(), layout: this, node: child }));\n }\n });\n return tabStamps;\n }\n renderTabs() {\n const tabs = new Map();\n this.props.model.visitWindowNodes(this.windowId, (node) => {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode) {\n const child = node;\n const selected = child.isSelected();\n const path = child.getPath();\n const renderTab = child.isRendered() || selected || !child.isEnableRenderOnDemand();\n if (renderTab) {\n // const rect = (child.getParent() as BorderNode | TabSetNode).getContentRect();\n // const key = child.getId();\n tabs.set(child.getId(), (\n // <SizeTracker rect={rect} forceRevision={this.state.forceRevision} key={key}>\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tab__WEBPACK_IMPORTED_MODULE_21__.Tab, { key: child.getId(), layout: this, path: path, node: child, selected: selected })\n // </SizeTracker>\n ));\n }\n }\n });\n return tabs;\n }\n renderMetricsElements() {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findBorderBarSize\", ref: this.findBorderBarSizeRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__BORDER_SIZER) }, \"FindBorderBarSize\"));\n }\n checkForBorderToShow(x, y) {\n const r = this.getBoundingClientRect(this.mainRef.current);\n const c = r.getCenter();\n const margin = edgeRectWidth;\n const offset = edgeRectLength / 2;\n let overEdge = false;\n if (this.props.model.isEnableEdgeDock() && this.state.showHiddenBorder === _DockLocation__WEBPACK_IMPORTED_MODULE_3__.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 let location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.CENTER;\n if (!overEdge) {\n if (x <= r.x + margin) {\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT;\n }\n else if (x >= r.getRight() - margin) {\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT;\n }\n else if (y <= r.y + margin) {\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP;\n }\n else if (y >= r.getBottom() - margin) {\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM;\n }\n }\n if (location !== this.state.showHiddenBorder) {\n this.setState({ showHiddenBorder: location });\n }\n }\n tidyMoveablesMap() {\n // console.log(\"tidyMoveablesMap\");\n const tabs = new Map();\n this.props.model.visitNodes((node, _) => {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode) {\n tabs.set(node.getId(), node);\n }\n });\n for (const [nodeId, element] of this.moveableElementMap) {\n if (!tabs.has(nodeId)) {\n // console.log(\"delete\", nodeId);\n element.remove(); // remove from dom\n this.moveableElementMap.delete(nodeId); // remove map entry \n }\n }\n }\n reorderComponents(components, ids) {\n const nextIds = [];\n const nextIdsSet = new Set();\n let reordered = [];\n // Keep any previous tabs in the same DOM order as before, removing any that have been deleted\n for (const id of ids) {\n if (components.get(id)) {\n nextIds.push(id);\n nextIdsSet.add(id);\n }\n }\n ids.splice(0, ids.length, ...nextIds);\n // Add tabs that have been added to the DOM\n for (const [id, _] of components) {\n if (!nextIdsSet.has(id)) {\n ids.push(id);\n }\n }\n reordered = ids.map((id) => {\n return components.get(id);\n });\n return reordered;\n }\n redraw(type) {\n // console.log(\"redraw\", this.windowId, type);\n this.mainLayout.setState((state, props) => { return { forceRevision: state.forceRevision + 1 }; });\n }\n redrawInternal(type) {\n // console.log(\"redrawInternal\", this.windowId, type);\n this.mainLayout.setState((state, props) => { return { layoutRevision: state.layoutRevision + 1 }; });\n }\n doAction(action) {\n if (this.props.onAction !== undefined) {\n const 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 getBoundingClientRect(div) {\n const layoutRect = this.getDomRect();\n if (layoutRect) {\n return _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.getBoundingClientRect(div).relativeTo(layoutRect);\n }\n return _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.empty();\n }\n getMoveableContainer() {\n return this.moveablesRef.current;\n }\n getMoveableElement(id) {\n let moveableElement = this.moveableElementMap.get(id);\n if (moveableElement === undefined) {\n moveableElement = document.createElement(\"div\");\n this.moveablesRef.current.appendChild(moveableElement);\n moveableElement.className = _Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_MOVEABLE;\n this.moveableElementMap.set(id, moveableElement);\n }\n return moveableElement;\n }\n getMainLayout() {\n return this.mainLayout;\n }\n getCurrentDocument() {\n return this.currentDocument;\n }\n getDomRect() {\n if (this.selfRef.current) {\n return _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.fromDomRect(this.selfRef.current.getBoundingClientRect());\n }\n else {\n return _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.empty();\n }\n }\n getWindowId() {\n return this.windowId;\n }\n getRootDiv() {\n return this.selfRef.current;\n }\n getMainElement() {\n return this.mainRef.current;\n }\n getFactory() {\n return this.props.factory;\n }\n isSupportsPopout() {\n return this.supportsPopout;\n }\n isRealtimeResize() {\n var _a;\n return (_a = this.props.realtimeResize) !== null && _a !== void 0 ? _a : false;\n }\n getPopoutURL() {\n return this.popoutURL;\n }\n setEditingTab(tabNode) {\n this.setState({ editingTab: tabNode });\n }\n getEditingTab() {\n return this.state.editingTab;\n }\n getModel() {\n return this.props.model;\n }\n getScreenRect(inRect) {\n const rect = inRect.clone();\n const layoutRect = this.getDomRect();\n // Note: outerHeight can be less than innerHeight when window is zoomed, so cannot use\n // const navHeight = Math.min(65, this.currentWindow!.outerHeight - this.currentWindow!.innerHeight);\n // const navWidth = Math.min(65, this.currentWindow!.outerWidth - this.currentWindow!.innerWidth);\n const navHeight = 60;\n const navWidth = 2;\n // console.log(rect.y, this.currentWindow!.screenX,layoutRect.y);\n rect.x = this.currentWindow.screenX + this.currentWindow.scrollX + navWidth / 2 + layoutRect.x + rect.x;\n rect.y = this.currentWindow.screenY + this.currentWindow.scrollY + (navHeight - navWidth / 2) + layoutRect.y + rect.y;\n rect.height += navHeight;\n rect.width += navWidth;\n return rect;\n }\n addTabToTabSet(tabsetId, json) {\n const tabsetNode = this.props.model.getNodeById(tabsetId);\n if (tabsetNode !== undefined) {\n const node = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.addNode(json, tabsetId, _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.CENTER, -1));\n return node;\n }\n return undefined;\n }\n addTabToActiveTabSet(json) {\n const tabsetNode = this.props.model.getActiveTabset(this.windowId);\n if (tabsetNode !== undefined) {\n const node = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.addNode(json, tabsetNode.getId(), _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.CENTER, -1));\n return node;\n }\n return undefined;\n }\n maximize(tabsetNode) {\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.maximizeToggle(tabsetNode.getId(), this.getWindowId()));\n }\n customizeTab(tabNode, renderValues) {\n if (this.props.onRenderTab) {\n this.props.onRenderTab(tabNode, renderValues);\n }\n }\n customizeTabSet(tabSetNode, renderValues) {\n if (this.props.onRenderTabSet) {\n this.props.onRenderTabSet(tabSetNode, renderValues);\n }\n }\n i18nName(id, param) {\n let 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 getShowOverflowMenu() {\n return this.props.onShowOverflowMenu;\n }\n getTabSetPlaceHolderCallback() {\n return this.props.onTabSetPlaceHolder;\n }\n showContextMenu(node, event) {\n if (this.props.onContextMenu) {\n this.props.onContextMenu(node, event);\n }\n }\n auxMouseClick(node, event) {\n if (this.props.onAuxMouseClick) {\n this.props.onAuxMouseClick(node, event);\n }\n }\n showOverlay(show) {\n this.setState({ showOverlay: show });\n (0,_Utils__WEBPACK_IMPORTED_MODULE_22__.enablePointerOnIFrames)(!show, this.currentDocument);\n }\n // *************************** Start Drag Drop *************************************\n addTabWithDragAndDrop(event, json, onDrop) {\n const tempNode = _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode.fromJson(json, this.props.model, false);\n LayoutInternal.dragState = new DragState(this.mainLayout, DragSource.Add, tempNode, json, onDrop);\n }\n moveTabWithDragAndDrop(event, node) {\n this.setDragNode(event, node);\n }\n setDragComponent(event, component, x, y) {\n let dragElement = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { position: \"unset\" }, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT) + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__DRAG_RECT) }, component));\n const tempDiv = this.currentDocument.createElement('div');\n tempDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\n tempDiv.style.position = \"absolute\";\n tempDiv.style.left = \"-10000px\";\n tempDiv.style.top = \"-10000px\";\n this.currentDocument.body.appendChild(tempDiv);\n (0,react_dom_client__WEBPACK_IMPORTED_MODULE_2__.createRoot)(tempDiv).render(dragElement);\n event.dataTransfer.setDragImage(tempDiv, x, y);\n setTimeout(() => {\n this.currentDocument.body.removeChild(tempDiv);\n }, 0);\n }\n setDraggingOverWindow(overWindow) {\n // console.log(\"setDraggingOverWindow\", overWindow);\n if (this.isDraggingOverWindow !== overWindow) {\n if (this.outlineDiv) {\n this.outlineDiv.style.visibility = overWindow ? \"hidden\" : \"visible\";\n }\n if (overWindow) {\n this.setState({ showEdges: false });\n }\n else {\n // add edge indicators\n if (this.props.model.getMaximizedTabset(this.windowId) === undefined) {\n this.setState({ showEdges: this.props.model.isEnableEdgeDock() });\n }\n }\n this.isDraggingOverWindow = overWindow;\n }\n }\n clearDragMain() {\n // console.log(\"clear drag main\");\n LayoutInternal.dragState = undefined;\n if (this.windowId === _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID) {\n this.isDraggingOverWindow = false;\n }\n for (const [, layoutWindow] of this.props.model.getwindowsMap()) {\n // console.log(layoutWindow);\n layoutWindow.layout.clearDragLocal();\n }\n }\n clearDragLocal() {\n // console.log(\"clear drag local\", this.windowId);\n this.setState({ showEdges: false });\n this.showOverlay(false);\n this.dragEnterCount = 0;\n this.dragging = false;\n if (this.outlineDiv) {\n this.selfRef.current.removeChild(this.outlineDiv);\n this.outlineDiv = undefined;\n }\n }\n}\nLayoutInternal.dragState = undefined;\nconst FlexLayoutVersion = \"0.8.1\";\nconst defaultIcons = {\n close: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.CloseIcon, null),\n closeTabset: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.CloseIcon, null),\n popout: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.PopoutIcon, null),\n maximize: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.MaximizeIcon, null),\n restore: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.RestoreIcon, null),\n more: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.OverflowIcon, null),\n edgeArrow: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.EdgeIcon, null),\n activeTabset: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.AsterickIcon, null)\n};\nvar DragSource;\n(function (DragSource) {\n DragSource[\"Internal\"] = \"internal\";\n DragSource[\"External\"] = \"external\";\n DragSource[\"Add\"] = \"add\";\n})(DragSource || (DragSource = {}));\n/** @internal */\nconst defaultSupportsPopout = (0,_Utils__WEBPACK_IMPORTED_MODULE_22__.isDesktop)();\n/** @internal */\nconst edgeRectLength = 100;\n/** @internal */\nconst edgeRectWidth = 10;\n// global layout drag state\nclass DragState {\n constructor(mainLayout, dragSource, dragNode, dragJson, fnNewNodeDropped) {\n this.mainLayout = mainLayout;\n this.dragSource = dragSource;\n this.dragNode = dragNode;\n this.dragJson = dragJson;\n this.fnNewNodeDropped = fnNewNodeDropped;\n }\n}\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Layout.tsx?");
369
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ FlexLayoutVersion: () => (/* binding */ FlexLayoutVersion),\n/* harmony export */ Layout: () => (/* binding */ Layout),\n/* harmony export */ LayoutInternal: () => (/* binding */ LayoutInternal)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react_dom_client__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom/client */ \"./node_modules/.pnpm/react-dom@19.0.0_react@19.0.0/node_modules/react-dom/client.js\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_Model__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../model/Model */ \"./src/model/Model.ts\");\n/* harmony import */ var _model_TabNode__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../model/TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _BorderTab__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./BorderTab */ \"./src/view/BorderTab.tsx\");\n/* harmony import */ var _BorderTabSet__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./BorderTabSet */ \"./src/view/BorderTabSet.tsx\");\n/* harmony import */ var _DragContainer__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./DragContainer */ \"./src/view/DragContainer.tsx\");\n/* harmony import */ var _ErrorBoundary__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./ErrorBoundary */ \"./src/view/ErrorBoundary.tsx\");\n/* harmony import */ var _PopoutWindow__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./PopoutWindow */ \"./src/view/PopoutWindow.tsx\");\n/* harmony import */ var _Icons__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./Icons */ \"./src/view/Icons.tsx\");\n/* harmony import */ var _Overlay__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./Overlay */ \"./src/view/Overlay.tsx\");\n/* harmony import */ var _Row__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./Row */ \"./src/view/Row.tsx\");\n/* harmony import */ var _Tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./Tab */ \"./src/view/Tab.tsx\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var _TabButtonStamp__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./TabButtonStamp */ \"./src/view/TabButtonStamp.tsx\");\n/* harmony import */ var _SizeTracker__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./SizeTracker */ \"./src/view/SizeTracker.tsx\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n/**\n * A React component that hosts a multi-tabbed layout\n */\nclass Layout extends react__WEBPACK_IMPORTED_MODULE_0__.Component {\n /** @internal */\n constructor(props) {\n super(props);\n this.selfRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.revision = 0;\n }\n /** re-render the layout */\n redraw() {\n this.selfRef.current.redraw(\"parent \" + this.revision);\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 * @returns the added tab node or undefined\n */\n addTabToTabSet(tabsetId, json) {\n return this.selfRef.current.addTabToTabSet(tabsetId, json);\n }\n /**\n * Adds a new tab by dragging an item to the drop location, must be called from within an HTML\n * drag start handler. You can use the setDragComponent() method to set the drag image before calling this\n * method.\n * @param event the drag start event\n * @param json the json for the new tab node\n * @param onDrop a callback to call when the drag is complete\n */\n addTabWithDragAndDrop(event, json, onDrop) {\n this.selfRef.current.addTabWithDragAndDrop(event, json, onDrop);\n }\n /**\n * Move a tab/tabset using drag and drop, must be called from within an HTML\n * drag start handler\n * @param event the drag start event\n * @param node the tab or tabset to drag\n */\n moveTabWithDragAndDrop(event, node) {\n this.selfRef.current.moveTabWithDragAndDrop(event, node);\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 * @returns the added tab node or undefined\n */\n addTabToActiveTabSet(json) {\n return this.selfRef.current.addTabToActiveTabSet(json);\n }\n /**\n * Sets the drag image from a react component for a drag event\n * @param event the drag event\n * @param component the react component to be used for the drag image\n * @param x the x position of the drag cursor on the image\n * @param y the x position of the drag cursor on the image\n */\n setDragComponent(event, component, x, y) {\n this.selfRef.current.setDragComponent(event, component, x, y);\n }\n /** Get the root div element of the layout */\n getRootDiv() {\n return this.selfRef.current.getRootDiv();\n }\n /** @internal */\n render() {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(LayoutInternal, Object.assign({ ref: this.selfRef }, this.props, { renderRevision: this.revision++ })));\n }\n}\n/** @internal */\nclass LayoutInternal extends react__WEBPACK_IMPORTED_MODULE_0__.Component {\n // private renderCount: any;\n constructor(props) {\n super(props);\n this.moveableElementMap = new Map();\n this.dragEnterCount = 0;\n this.dragging = false;\n this.updateLayoutMetrics = () => {\n if (this.findBorderBarSizeRef.current) {\n const borderBarSize = this.findBorderBarSizeRef.current.getBoundingClientRect().height;\n if (borderBarSize !== this.state.calculatedBorderBarSize) {\n this.setState({ calculatedBorderBarSize: borderBarSize });\n }\n }\n };\n this.onModelChange = (action) => {\n this.redrawInternal(\"model change\");\n if (this.props.onModelChange) {\n this.props.onModelChange(this.props.model, action);\n }\n };\n this.updateRect = () => {\n const rect = this.getDomRect();\n if (!rect.equals(this.state.rect) && rect.width !== 0 && rect.height !== 0) {\n // console.log(\"updateRect\", rect.floor());\n this.setState({ rect });\n if (this.windowId !== _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID) {\n this.redrawInternal(\"rect updated\");\n }\n }\n };\n this.getClassName = (defaultClassName) => {\n if (this.props.classNameMapper === undefined) {\n return defaultClassName;\n }\n else {\n return this.props.classNameMapper(defaultClassName);\n }\n };\n this.onCloseWindow = (windowLayout) => {\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.closeWindow(windowLayout.windowId));\n };\n this.onSetWindow = (windowLayout, window) => {\n };\n this.showControlInPortal = (control, element) => {\n const portal = (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(control, element);\n this.setState({ portal });\n };\n this.hideControlInPortal = () => {\n this.setState({ portal: undefined });\n };\n this.getIcons = () => {\n return this.icons;\n };\n this.setDragNode = (event, node) => {\n LayoutInternal.dragState = new DragState(this.mainLayout, DragSource.Internal, node, undefined, undefined);\n // Note: can only set (very) limited types on android! so cannot set json\n // Note: must set text/plain for android to allow drag, \n // so just set a simple message indicating its a flexlayout drag (this is not used anywhere else)\n event.dataTransfer.setData('text/plain', \"--flexlayout--\");\n event.dataTransfer.effectAllowed = \"copyMove\";\n event.dataTransfer.dropEffect = \"move\";\n this.dragEnterCount = 0;\n if (node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_12__.TabSetNode) {\n let rendered = false;\n let content = this.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Move_Tabset);\n if (node.getChildren().length > 0) {\n content = this.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Move_Tabs).replace(\"?\", String(node.getChildren().length));\n }\n if (this.props.onRenderDragRect) {\n const dragComponent = this.props.onRenderDragRect(content, node, undefined);\n if (dragComponent) {\n this.setDragComponent(event, dragComponent, 10, 10);\n rendered = true;\n }\n }\n if (!rendered) {\n this.setDragComponent(event, content, 10, 10);\n }\n }\n else {\n const element = event.target;\n const rect = element.getBoundingClientRect();\n const offsetX = event.clientX - rect.left;\n const offsetY = event.clientY - rect.top;\n const parentNode = node === null || node === void 0 ? void 0 : node.getParent();\n const isInVerticalBorder = parentNode instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_9__.BorderNode && parentNode.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_5__.Orientation.HORZ;\n const x = isInVerticalBorder ? 10 : offsetX;\n const y = isInVerticalBorder ? 10 : offsetY;\n let rendered = false;\n if (this.props.onRenderDragRect) {\n const content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButtonStamp__WEBPACK_IMPORTED_MODULE_23__.TabButtonStamp, { key: node.getId(), layout: this, node: node });\n const dragComponent = this.props.onRenderDragRect(content, node, undefined);\n if (dragComponent) {\n this.setDragComponent(event, dragComponent, x, y);\n rendered = true;\n }\n }\n if (!rendered) {\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_22__.isSafari)()) { // safari doesnt render the offscreen tabstamps\n this.setDragComponent(event, react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButtonStamp__WEBPACK_IMPORTED_MODULE_23__.TabButtonStamp, { node: node, layout: this }), x, y);\n }\n else {\n event.dataTransfer.setDragImage(node.getTabStamp(), x, y);\n }\n }\n }\n };\n this.onDragEnterRaw = (event) => {\n this.dragEnterCount++;\n if (this.dragEnterCount === 1) {\n this.onDragEnter(event);\n }\n };\n this.onDragLeaveRaw = (event) => {\n this.dragEnterCount--;\n if (this.dragEnterCount === 0) {\n this.onDragLeave(event);\n }\n };\n this.onDragEnter = (event) => {\n // console.log(\"onDragEnter\", this.windowId, this.dragEnterCount);\n var _a;\n if (!LayoutInternal.dragState && this.props.onExternalDrag) { // not internal dragging\n const externalDrag = this.props.onExternalDrag(event);\n if (externalDrag) {\n const tempNode = _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode.fromJson(externalDrag.json, this.props.model, false);\n LayoutInternal.dragState = new DragState(this.mainLayout, DragSource.External, tempNode, externalDrag.json, externalDrag.onDrop);\n }\n }\n if (LayoutInternal.dragState) {\n if (this.windowId !== _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID && LayoutInternal.dragState.mainLayout === this.mainLayout) {\n LayoutInternal.dragState.mainLayout.setDraggingOverWindow(true);\n }\n if (LayoutInternal.dragState.mainLayout !== this.mainLayout) {\n return; // drag not by this layout or its popouts\n }\n event.preventDefault();\n this.dropInfo = undefined;\n const rootdiv = this.selfRef.current;\n this.outlineDiv = this.currentDocument.createElement(\"div\");\n this.outlineDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\n this.outlineDiv.style.visibility = \"hidden\";\n const speed = this.props.model.getAttribute(\"tabDragSpeed\");\n this.outlineDiv.style.transition = `top ${speed}s, left ${speed}s, width ${speed}s, height ${speed}s`;\n rootdiv.appendChild(this.outlineDiv);\n this.dragging = true;\n this.showOverlay(true);\n // add edge indicators\n if (!this.isDraggingOverWindow && this.props.model.getMaximizedTabset(this.windowId) === undefined) {\n this.setState({ showEdges: this.props.model.isEnableEdgeDock() });\n }\n const clientRect = (_a = this.selfRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();\n const r = new _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect(event.clientX - (clientRect.left), event.clientY - (clientRect.top), 1, 1);\n r.positionElement(this.outlineDiv);\n }\n };\n this.onDragOver = (event) => {\n var _a, _b, _c;\n if (this.dragging && !this.isDraggingOverWindow) {\n // console.log(\"onDragOver\");\n event.preventDefault();\n const clientRect = (_a = this.selfRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();\n const pos = {\n x: event.clientX - ((_b = clientRect === null || clientRect === void 0 ? void 0 : clientRect.left) !== null && _b !== void 0 ? _b : 0),\n y: event.clientY - ((_c = clientRect === null || clientRect === void 0 ? void 0 : clientRect.top) !== null && _c !== void 0 ? _c : 0),\n };\n this.checkForBorderToShow(pos.x, pos.y);\n let dropInfo = this.props.model.findDropTargetNode(this.windowId, LayoutInternal.dragState.dragNode, pos.x, pos.y);\n if (dropInfo) {\n this.dropInfo = dropInfo;\n if (this.outlineDiv) {\n this.outlineDiv.className = this.getClassName(dropInfo.className);\n dropInfo.rect.positionElement(this.outlineDiv);\n this.outlineDiv.style.visibility = \"visible\";\n }\n }\n }\n };\n this.onDragLeave = (event) => {\n // console.log(\"onDragLeave\", this.windowId, this.dragging);\n if (this.dragging) {\n if (this.windowId !== _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID) {\n LayoutInternal.dragState.mainLayout.setDraggingOverWindow(false);\n }\n this.clearDragLocal();\n }\n };\n this.onDrop = (event) => {\n // console.log(\"ondrop\", this.windowId, this.dragging, Layout.dragState);\n if (this.dragging) {\n event.preventDefault();\n const dragState = LayoutInternal.dragState;\n if (this.dropInfo) {\n if (dragState.dragJson !== undefined) {\n const newNode = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.addNode(dragState.dragJson, this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\n if (dragState.fnNewNodeDropped !== undefined) {\n dragState.fnNewNodeDropped(newNode, event);\n }\n }\n else if (dragState.dragNode !== undefined) {\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.moveNode(dragState.dragNode.getId(), this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\n }\n }\n this.mainLayout.clearDragMain();\n }\n this.dragEnterCount = 0; // must set to zero here ref sublayouts\n };\n this.orderedIds = [];\n this.selfRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.moveablesRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.mainRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.findBorderBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\n this.supportsPopout = props.supportsPopout !== undefined ? props.supportsPopout : defaultSupportsPopout;\n this.popoutURL = props.popoutURL ? props.popoutURL : \"popout.html\";\n this.icons = Object.assign(Object.assign({}, defaultIcons), props.icons);\n this.windowId = props.windowId ? props.windowId : _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID;\n this.mainLayout = this.props.mainLayout ? this.props.mainLayout : this;\n this.isDraggingOverWindow = false;\n this.layoutWindow = this.props.model.getwindowsMap().get(this.windowId);\n this.layoutWindow.layout = this;\n this.popoutWindowName = this.props.popoutWindowName || \"Popout Window\";\n // this.renderCount = 0;\n this.state = {\n rect: _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.empty(),\n editingTab: undefined,\n showEdges: false,\n showOverlay: false,\n calculatedBorderBarSize: 29,\n layoutRevision: 0,\n forceRevision: 0,\n showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.CENTER\n };\n this.isMainWindow = this.windowId === _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID;\n }\n componentDidMount() {\n this.updateRect();\n this.currentDocument = this.selfRef.current.ownerDocument;\n this.currentWindow = this.currentDocument.defaultView;\n this.layoutWindow.window = this.currentWindow;\n this.layoutWindow.toScreenRectFunction = (r) => this.getScreenRect(r);\n this.resizeObserver = new ResizeObserver(entries => {\n requestAnimationFrame(() => {\n this.updateRect();\n });\n });\n if (this.selfRef.current) {\n this.resizeObserver.observe(this.selfRef.current);\n }\n if (this.isMainWindow) {\n this.props.model.addChangeListener(this.onModelChange);\n this.updateLayoutMetrics();\n }\n else {\n // since resizeObserver doesn't always work as expected when observing element in another document\n this.currentWindow.addEventListener(\"resize\", () => {\n this.updateRect();\n });\n const sourceElement = this.props.mainLayout.getRootDiv();\n const targetElement = this.selfRef.current;\n (0,_Utils__WEBPACK_IMPORTED_MODULE_22__.copyInlineStyles)(sourceElement, targetElement);\n this.styleObserver = new MutationObserver(() => {\n const changed = (0,_Utils__WEBPACK_IMPORTED_MODULE_22__.copyInlineStyles)(sourceElement, targetElement);\n if (changed) {\n this.redraw(\"mutation observer\");\n }\n });\n // Observe changes to the source element's style attribute\n this.styleObserver.observe(sourceElement, { attributeFilter: ['style'] });\n }\n // allow tabs to overlay when hidden\n document.addEventListener('visibilitychange', () => {\n for (const [_, layoutWindow] of this.props.model.getwindowsMap()) {\n const layout = layoutWindow.layout;\n if (layout) {\n this.redraw(\"visibility change\");\n }\n }\n });\n }\n componentDidUpdate() {\n this.currentDocument = this.selfRef.current.ownerDocument;\n this.currentWindow = this.currentDocument.defaultView;\n if (this.isMainWindow) {\n if (this.props.model !== this.previousModel) {\n if (this.previousModel !== undefined) {\n this.previousModel.removeChangeListener(this.onModelChange); // stop listening to old model\n }\n this.props.model.getwindowsMap().get(this.windowId).layout = this;\n this.props.model.addChangeListener(this.onModelChange);\n this.layoutWindow = this.props.model.getwindowsMap().get(this.windowId);\n this.layoutWindow.layout = this;\n this.layoutWindow.toScreenRectFunction = (r) => this.getScreenRect(r);\n this.previousModel = this.props.model;\n this.tidyMoveablesMap();\n }\n this.updateLayoutMetrics();\n }\n }\n componentWillUnmount() {\n var _a, _b;\n if (this.selfRef.current) {\n (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.selfRef.current);\n }\n (_b = this.styleObserver) === null || _b === void 0 ? void 0 : _b.disconnect();\n }\n render() {\n // console.log(\"render\", this.windowId, this.state.revision, this.renderCount++);\n // first render will be used to find the size (via selfRef)\n if (!this.selfRef.current) {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.moveablesRef, key: \"__moveables__\", className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_MOVEABLES) }),\n this.renderMetricsElements()));\n }\n const model = this.props.model;\n model.getRoot(this.windowId).calcMinMaxSize();\n model.getRoot(this.windowId).setPaths(\"\");\n model.getBorderSet().setPaths();\n const inner = this.renderLayout();\n const outer = this.renderBorders(inner);\n const tabs = this.renderTabs();\n const reorderedTabs = this.reorderComponents(tabs, this.orderedIds);\n let floatingWindows = null;\n let tabMoveables = null;\n let tabStamps = null;\n let metricElements = null;\n if (this.isMainWindow) {\n floatingWindows = this.renderWindows();\n metricElements = this.renderMetricsElements();\n tabMoveables = this.renderTabMoveables();\n tabStamps = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"__tabStamps__\", className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_TAB_STAMPS) }, this.renderTabStamps());\n }\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT), onDragEnter: this.onDragEnterRaw, onDragLeave: this.onDragLeaveRaw, onDragOver: this.onDragOver, onDrop: this.onDrop },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.moveablesRef, key: \"__moveables__\", className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_MOVEABLES) }),\n metricElements,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Overlay__WEBPACK_IMPORTED_MODULE_19__.Overlay, { key: \"__overlay__\", layout: this, show: this.state.showOverlay }),\n outer,\n reorderedTabs,\n tabMoveables,\n tabStamps,\n this.state.portal,\n floatingWindows));\n }\n renderBorders(inner) {\n const classMain = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_MAIN);\n const borders = this.props.model.getBorderSet().getBorderMap();\n if (this.isMainWindow && borders.size > 0) {\n inner = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classMain, ref: this.mainRef }, inner));\n const borderSetComponents = new Map();\n const borderSetContentComponents = new Map();\n for (const [_, location] of _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.values) {\n const border = borders.get(location);\n const showBorder = border && border.isShowing() && (!border.isAutoHide() ||\n (border.isAutoHide() && (border.getChildren().length > 0 || this.state.showHiddenBorder === location)));\n if (showBorder) {\n borderSetComponents.set(location, react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderTabSet__WEBPACK_IMPORTED_MODULE_14__.BorderTabSet, { layout: this, border: border, size: this.state.calculatedBorderBarSize }));\n borderSetContentComponents.set(location, react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderTab__WEBPACK_IMPORTED_MODULE_13__.BorderTab, { layout: this, border: border, show: border.getSelected() !== -1 }));\n }\n }\n const classBorderOuter = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_BORDER_CONTAINER);\n const classBorderInner = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT_BORDER_CONTAINER_INNER);\n if (this.props.model.getBorderSet().getLayoutHorizontal()) {\n const innerWithBorderTabs = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"column\" } },\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP),\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"row\" } },\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT),\n inner,\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT)),\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM)));\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderOuter, style: { flexDirection: \"column\" } },\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP),\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"row\" } },\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT),\n innerWithBorderTabs,\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT)),\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM)));\n }\n else {\n const innerWithBorderTabs = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"row\" } },\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT),\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"column\" } },\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP),\n inner,\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM)),\n borderSetContentComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT)));\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderOuter, style: { flexDirection: \"row\" } },\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT),\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classBorderInner, style: { flexDirection: \"column\" } },\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP),\n innerWithBorderTabs,\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM)),\n borderSetComponents.get(_DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT)));\n }\n }\n else { // no borders\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: classMain, ref: this.mainRef, style: { position: \"absolute\", top: 0, left: 0, bottom: 0, right: 0, display: \"flex\" } }, inner));\n }\n }\n renderLayout() {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Row__WEBPACK_IMPORTED_MODULE_20__.Row, { key: \"__row__\", layout: this, node: this.props.model.getRoot(this.windowId) }),\n this.renderEdgeIndicators()));\n }\n renderEdgeIndicators() {\n const edges = [];\n const arrowIcon = this.icons.edgeArrow;\n if (this.state.showEdges) {\n const r = this.props.model.getRoot(this.windowId).getRect();\n const length = edgeRectLength;\n const width = edgeRectWidth;\n const offset = edgeRectLength / 2;\n const className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT);\n const radius = 50;\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"North\", style: { top: 0, left: r.width / 2 - offset, width: length, height: width, borderBottomLeftRadius: radius, borderBottomRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT_TOP) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { transform: \"rotate(180deg)\" } }, arrowIcon)));\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"West\", style: { top: r.height / 2 - offset, left: 0, width: width, height: length, borderTopRightRadius: radius, borderBottomRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT_LEFT) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { transform: \"rotate(90deg)\" } }, arrowIcon)));\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"South\", style: { top: r.height - width, left: r.width / 2 - offset, width: length, height: width, borderTopLeftRadius: radius, borderTopRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT_BOTTOM) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", null, arrowIcon)));\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"East\", style: { top: r.height / 2 - offset, left: r.width - width, width: width, height: length, borderTopLeftRadius: radius, borderBottomLeftRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__EDGE_RECT_RIGHT) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { transform: \"rotate(-90deg)\" } }, arrowIcon)));\n }\n return edges;\n }\n renderWindows() {\n const floatingWindows = [];\n if (this.supportsPopout) {\n const windows = this.props.model.getwindowsMap();\n let i = 1;\n for (const [windowId, layoutWindow] of windows) {\n if (windowId !== _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID) {\n floatingWindows.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_PopoutWindow__WEBPACK_IMPORTED_MODULE_17__.PopoutWindow, { key: windowId, layout: this, title: this.popoutWindowName + \" \" + i, layoutWindow: layoutWindow, url: this.popoutURL + \"?id=\" + windowId, onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(LayoutInternal, Object.assign({}, this.props, { windowId: windowId, mainLayout: this }))));\n i++;\n }\n }\n }\n return floatingWindows;\n }\n renderTabMoveables() {\n const tabMoveables = [];\n this.props.model.visitNodes((node) => {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode) {\n const child = node;\n const element = this.getMoveableElement(child.getId());\n child.setMoveableElement(element);\n const selected = child.isSelected();\n const rect = child.getParent().getContentRect();\n // only render first time if size >0\n const renderTab = child.isRendered() ||\n ((selected || !child.isEnableRenderOnDemand()) && (rect.width > 0 && rect.height > 0));\n if (renderTab) {\n // console.log(\"rendertab\", child.getName(), this.props.renderRevision);\n const key = child.getId() + (child.isEnableWindowReMount() ? child.getWindowId() : \"\");\n tabMoveables.push((0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_SizeTracker__WEBPACK_IMPORTED_MODULE_24__.SizeTracker, { rect: rect, selected: child.isSelected(), forceRevision: this.state.forceRevision, tabsRevision: this.props.renderRevision, key: key },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_ErrorBoundary__WEBPACK_IMPORTED_MODULE_16__.ErrorBoundary, { message: this.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_4__.I18nLabel.Error_rendering_component) }, this.props.factory(child))), element, key));\n child.setRendered(renderTab);\n }\n }\n });\n return tabMoveables;\n }\n renderTabStamps() {\n const tabStamps = [];\n this.props.model.visitNodes((node) => {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode) {\n const child = node;\n // what the tab should look like when dragged (since images need to have been loaded before drag image can be taken)\n tabStamps.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_DragContainer__WEBPACK_IMPORTED_MODULE_15__.DragContainer, { key: child.getId(), layout: this, node: child }));\n }\n });\n return tabStamps;\n }\n renderTabs() {\n const tabs = new Map();\n this.props.model.visitWindowNodes(this.windowId, (node) => {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode) {\n const child = node;\n const selected = child.isSelected();\n const path = child.getPath();\n const renderTab = child.isRendered() || selected || !child.isEnableRenderOnDemand();\n if (renderTab) {\n // const rect = (child.getParent() as BorderNode | TabSetNode).getContentRect();\n // const key = child.getId();\n tabs.set(child.getId(), (\n // <SizeTracker rect={rect} forceRevision={this.state.forceRevision} key={key}>\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tab__WEBPACK_IMPORTED_MODULE_21__.Tab, { key: child.getId(), layout: this, path: path, node: child, selected: selected })\n // </SizeTracker>\n ));\n }\n }\n });\n return tabs;\n }\n renderMetricsElements() {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findBorderBarSize\", ref: this.findBorderBarSizeRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__BORDER_SIZER) }, \"FindBorderBarSize\"));\n }\n checkForBorderToShow(x, y) {\n const r = this.getBoundingClientRect(this.mainRef.current);\n const c = r.getCenter();\n const margin = edgeRectWidth;\n const offset = edgeRectLength / 2;\n let overEdge = false;\n if (this.props.model.isEnableEdgeDock() && this.state.showHiddenBorder === _DockLocation__WEBPACK_IMPORTED_MODULE_3__.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 let location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.CENTER;\n if (!overEdge) {\n if (x <= r.x + margin) {\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.LEFT;\n }\n else if (x >= r.getRight() - margin) {\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.RIGHT;\n }\n else if (y <= r.y + margin) {\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.TOP;\n }\n else if (y >= r.getBottom() - margin) {\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.BOTTOM;\n }\n }\n if (location !== this.state.showHiddenBorder) {\n this.setState({ showHiddenBorder: location });\n }\n }\n tidyMoveablesMap() {\n // console.log(\"tidyMoveablesMap\");\n const tabs = new Map();\n this.props.model.visitNodes((node, _) => {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode) {\n tabs.set(node.getId(), node);\n }\n });\n for (const [nodeId, element] of this.moveableElementMap) {\n if (!tabs.has(nodeId)) {\n // console.log(\"delete\", nodeId);\n element.remove(); // remove from dom\n this.moveableElementMap.delete(nodeId); // remove map entry \n }\n }\n }\n reorderComponents(components, ids) {\n const nextIds = [];\n const nextIdsSet = new Set();\n let reordered = [];\n // Keep any previous tabs in the same DOM order as before, removing any that have been deleted\n for (const id of ids) {\n if (components.get(id)) {\n nextIds.push(id);\n nextIdsSet.add(id);\n }\n }\n ids.splice(0, ids.length, ...nextIds);\n // Add tabs that have been added to the DOM\n for (const [id, _] of components) {\n if (!nextIdsSet.has(id)) {\n ids.push(id);\n }\n }\n reordered = ids.map((id) => {\n return components.get(id);\n });\n return reordered;\n }\n redraw(type) {\n // console.log(\"redraw\", this.windowId, type);\n this.mainLayout.setState((state, props) => { return { forceRevision: state.forceRevision + 1 }; });\n }\n redrawInternal(type) {\n // console.log(\"redrawInternal\", this.windowId, type);\n this.mainLayout.setState((state, props) => { return { layoutRevision: state.layoutRevision + 1 }; });\n }\n doAction(action) {\n if (this.props.onAction !== undefined) {\n const 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 getBoundingClientRect(div) {\n const layoutRect = this.getDomRect();\n if (layoutRect) {\n return _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.getBoundingClientRect(div).relativeTo(layoutRect);\n }\n return _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.empty();\n }\n getMoveableContainer() {\n return this.moveablesRef.current;\n }\n getMoveableElement(id) {\n let moveableElement = this.moveableElementMap.get(id);\n if (moveableElement === undefined) {\n moveableElement = document.createElement(\"div\");\n this.moveablesRef.current.appendChild(moveableElement);\n moveableElement.className = _Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_MOVEABLE;\n this.moveableElementMap.set(id, moveableElement);\n }\n return moveableElement;\n }\n getMainLayout() {\n return this.mainLayout;\n }\n getCurrentDocument() {\n return this.currentDocument;\n }\n getDomRect() {\n if (this.selfRef.current) {\n return _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.fromDomRect(this.selfRef.current.getBoundingClientRect());\n }\n else {\n return _Rect__WEBPACK_IMPORTED_MODULE_6__.Rect.empty();\n }\n }\n getWindowId() {\n return this.windowId;\n }\n getRootDiv() {\n return this.selfRef.current;\n }\n getMainElement() {\n return this.mainRef.current;\n }\n getFactory() {\n return this.props.factory;\n }\n isSupportsPopout() {\n return this.supportsPopout;\n }\n isRealtimeResize() {\n var _a;\n return (_a = this.props.realtimeResize) !== null && _a !== void 0 ? _a : false;\n }\n getPopoutURL() {\n return this.popoutURL;\n }\n setEditingTab(tabNode) {\n this.setState({ editingTab: tabNode });\n }\n getEditingTab() {\n return this.state.editingTab;\n }\n getModel() {\n return this.props.model;\n }\n getScreenRect(inRect) {\n const rect = inRect.clone();\n const layoutRect = this.getDomRect();\n // Note: outerHeight can be less than innerHeight when window is zoomed, so cannot use\n // const navHeight = Math.min(65, this.currentWindow!.outerHeight - this.currentWindow!.innerHeight);\n // const navWidth = Math.min(65, this.currentWindow!.outerWidth - this.currentWindow!.innerWidth);\n const navHeight = 60;\n const navWidth = 2;\n // console.log(rect.y, this.currentWindow!.screenX,layoutRect.y);\n rect.x = this.currentWindow.screenX + this.currentWindow.scrollX + navWidth / 2 + layoutRect.x + rect.x;\n rect.y = this.currentWindow.screenY + this.currentWindow.scrollY + (navHeight - navWidth / 2) + layoutRect.y + rect.y;\n rect.height += navHeight;\n rect.width += navWidth;\n return rect;\n }\n addTabToTabSet(tabsetId, json) {\n const tabsetNode = this.props.model.getNodeById(tabsetId);\n if (tabsetNode !== undefined) {\n const node = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.addNode(json, tabsetId, _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.CENTER, -1));\n return node;\n }\n return undefined;\n }\n addTabToActiveTabSet(json) {\n const tabsetNode = this.props.model.getActiveTabset(this.windowId);\n if (tabsetNode !== undefined) {\n const node = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.addNode(json, tabsetNode.getId(), _DockLocation__WEBPACK_IMPORTED_MODULE_3__.DockLocation.CENTER, -1));\n return node;\n }\n return undefined;\n }\n maximize(tabsetNode) {\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_8__.Actions.maximizeToggle(tabsetNode.getId(), this.getWindowId()));\n }\n customizeTab(tabNode, renderValues) {\n if (this.props.onRenderTab) {\n this.props.onRenderTab(tabNode, renderValues);\n }\n }\n customizeTabSet(tabSetNode, renderValues) {\n if (this.props.onRenderTabSet) {\n this.props.onRenderTabSet(tabSetNode, renderValues);\n }\n }\n i18nName(id, param) {\n let 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 getShowOverflowMenu() {\n return this.props.onShowOverflowMenu;\n }\n getTabSetPlaceHolderCallback() {\n return this.props.onTabSetPlaceHolder;\n }\n showContextMenu(node, event) {\n if (this.props.onContextMenu) {\n this.props.onContextMenu(node, event);\n }\n }\n auxMouseClick(node, event) {\n if (this.props.onAuxMouseClick) {\n this.props.onAuxMouseClick(node, event);\n }\n }\n showOverlay(show) {\n this.setState({ showOverlay: show });\n (0,_Utils__WEBPACK_IMPORTED_MODULE_22__.enablePointerOnIFrames)(!show, this.currentDocument);\n }\n // *************************** Start Drag Drop *************************************\n addTabWithDragAndDrop(event, json, onDrop) {\n const tempNode = _model_TabNode__WEBPACK_IMPORTED_MODULE_11__.TabNode.fromJson(json, this.props.model, false);\n LayoutInternal.dragState = new DragState(this.mainLayout, DragSource.Add, tempNode, json, onDrop);\n }\n moveTabWithDragAndDrop(event, node) {\n this.setDragNode(event, node);\n }\n setDragComponent(event, component, x, y) {\n let dragElement = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { position: \"unset\" }, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__LAYOUT) + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__DRAG_RECT) }, component));\n const tempDiv = this.currentDocument.createElement('div');\n tempDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\n tempDiv.style.position = \"absolute\";\n tempDiv.style.left = \"-10000px\";\n tempDiv.style.top = \"-10000px\";\n this.currentDocument.body.appendChild(tempDiv);\n (0,react_dom_client__WEBPACK_IMPORTED_MODULE_2__.createRoot)(tempDiv).render(dragElement);\n event.dataTransfer.setDragImage(tempDiv, x, y);\n setTimeout(() => {\n this.currentDocument.body.removeChild(tempDiv);\n }, 0);\n }\n setDraggingOverWindow(overWindow) {\n // console.log(\"setDraggingOverWindow\", overWindow);\n if (this.isDraggingOverWindow !== overWindow) {\n if (this.outlineDiv) {\n this.outlineDiv.style.visibility = overWindow ? \"hidden\" : \"visible\";\n }\n if (overWindow) {\n this.setState({ showEdges: false });\n }\n else {\n // add edge indicators\n if (this.props.model.getMaximizedTabset(this.windowId) === undefined) {\n this.setState({ showEdges: this.props.model.isEnableEdgeDock() });\n }\n }\n this.isDraggingOverWindow = overWindow;\n }\n }\n clearDragMain() {\n // console.log(\"clear drag main\");\n LayoutInternal.dragState = undefined;\n if (this.windowId === _model_Model__WEBPACK_IMPORTED_MODULE_10__.Model.MAIN_WINDOW_ID) {\n this.isDraggingOverWindow = false;\n }\n for (const [, layoutWindow] of this.props.model.getwindowsMap()) {\n // console.log(layoutWindow);\n layoutWindow.layout.clearDragLocal();\n }\n }\n clearDragLocal() {\n // console.log(\"clear drag local\", this.windowId);\n this.setState({ showEdges: false });\n this.showOverlay(false);\n this.dragEnterCount = 0;\n this.dragging = false;\n if (this.outlineDiv) {\n this.selfRef.current.removeChild(this.outlineDiv);\n this.outlineDiv = undefined;\n }\n }\n}\nLayoutInternal.dragState = undefined;\nconst FlexLayoutVersion = \"0.8.4\";\nconst defaultIcons = {\n close: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.CloseIcon, null),\n closeTabset: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.CloseIcon, null),\n popout: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.PopoutIcon, null),\n maximize: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.MaximizeIcon, null),\n restore: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.RestoreIcon, null),\n more: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.OverflowIcon, null),\n edgeArrow: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.EdgeIcon, null),\n activeTabset: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_18__.AsterickIcon, null)\n};\nvar DragSource;\n(function (DragSource) {\n DragSource[\"Internal\"] = \"internal\";\n DragSource[\"External\"] = \"external\";\n DragSource[\"Add\"] = \"add\";\n})(DragSource || (DragSource = {}));\n/** @internal */\nconst defaultSupportsPopout = (0,_Utils__WEBPACK_IMPORTED_MODULE_22__.isDesktop)();\n/** @internal */\nconst edgeRectLength = 100;\n/** @internal */\nconst edgeRectWidth = 10;\n// global layout drag state\nclass DragState {\n constructor(mainLayout, dragSource, dragNode, dragJson, fnNewNodeDropped) {\n this.mainLayout = mainLayout;\n this.dragSource = dragSource;\n this.dragNode = dragNode;\n this.dragJson = dragJson;\n this.fnNewNodeDropped = fnNewNodeDropped;\n }\n}\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Layout.tsx?");
370
370
 
371
371
  /***/ }),
372
372
 
@@ -426,7 +426,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
426
426
  \*******************************/
427
427
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
428
428
 
429
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ Splitter: () => (/* binding */ Splitter)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_RowNode__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../model/RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n\n\n\n\n\n\n\n\n/** @internal */\nconst Splitter = (props) => {\n const { layout, node, index, horizontal } = props;\n const [dragging, setDragging] = react__WEBPACK_IMPORTED_MODULE_0__.useState(false);\n const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const extendedRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const pBounds = react__WEBPACK_IMPORTED_MODULE_0__.useRef([]);\n const outlineDiv = react__WEBPACK_IMPORTED_MODULE_0__.useRef(undefined);\n const handleDiv = react__WEBPACK_IMPORTED_MODULE_0__.useRef(undefined);\n const dragStartX = react__WEBPACK_IMPORTED_MODULE_0__.useRef(0);\n const dragStartY = react__WEBPACK_IMPORTED_MODULE_0__.useRef(0);\n const initalSizes = react__WEBPACK_IMPORTED_MODULE_0__.useRef({ initialSizes: [], sum: 0, startPosition: 0 });\n // const throttleTimer = React.useRef<NodeJS.Timeout | undefined>(undefined);\n const size = node.getModel().getSplitterSize();\n let extra = node.getModel().getSplitterExtra();\n if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isDesktop)()) {\n // make hit test area on mobile at least 30px\n extra = Math.max(30, extra + size) - size;\n }\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n var _a, _b;\n // Android fix: must have passive touchstart handler to prevent default handling\n (_a = selfRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener(\"touchstart\", onTouchStart, { passive: false });\n (_b = extendedRef.current) === null || _b === void 0 ? void 0 : _b.addEventListener(\"touchstart\", onTouchStart, { passive: false });\n return () => {\n var _a, _b;\n (_a = selfRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener(\"touchstart\", onTouchStart);\n (_b = extendedRef.current) === null || _b === void 0 ? void 0 : _b.removeEventListener(\"touchstart\", onTouchStart);\n };\n }, []);\n const onTouchStart = (event) => {\n event.preventDefault();\n event.stopImmediatePropagation();\n };\n const onPointerDown = (event) => {\n var _a;\n event.stopPropagation();\n if (node instanceof _model_RowNode__WEBPACK_IMPORTED_MODULE_3__.RowNode) {\n initalSizes.current = node.getSplitterInitials(index);\n }\n (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.enablePointerOnIFrames)(false, layout.getCurrentDocument());\n (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.startDrag)(event.currentTarget.ownerDocument, event, onDragMove, onDragEnd, onDragCancel);\n pBounds.current = node.getSplitterBounds(index, true);\n const rootdiv = layout.getRootDiv();\n outlineDiv.current = layout.getCurrentDocument().createElement(\"div\");\n outlineDiv.current.style.flexDirection = horizontal ? \"row\" : \"column\";\n outlineDiv.current.className = layout.getClassName(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_DRAG);\n outlineDiv.current.style.cursor = node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT ? \"ns-resize\" : \"ew-resize\";\n if (node.getModel().isSplitterEnableHandle()) {\n handleDiv.current = layout.getCurrentDocument().createElement(\"div\");\n handleDiv.current.className = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE) + \" \" +\n (horizontal ? cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE_HORZ) : cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE_VERT));\n outlineDiv.current.appendChild(handleDiv.current);\n }\n const r = (_a = selfRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();\n const rect = new _Rect__WEBPACK_IMPORTED_MODULE_7__.Rect(r.x - layout.getDomRect().x, r.y - layout.getDomRect().y, r.width, r.height);\n dragStartX.current = event.clientX - r.x;\n dragStartY.current = event.clientY - r.y;\n rect.positionElement(outlineDiv.current);\n if (rootdiv) {\n rootdiv.appendChild(outlineDiv.current);\n }\n setDragging(true);\n };\n const onDragCancel = () => {\n const rootdiv = layout.getRootDiv();\n if (rootdiv && outlineDiv.current) {\n rootdiv.removeChild(outlineDiv.current);\n }\n outlineDiv.current = undefined;\n setDragging(false);\n };\n const onDragMove = (x, y) => {\n if (outlineDiv.current) {\n const clientRect = layout.getDomRect();\n if (!clientRect) {\n return;\n }\n if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\n outlineDiv.current.style.top = getBoundPosition(y - clientRect.y - dragStartY.current) + \"px\";\n }\n else {\n outlineDiv.current.style.left = getBoundPosition(x - clientRect.x - dragStartX.current) + \"px\";\n }\n if (layout.isRealtimeResize()) {\n updateLayout(true);\n }\n }\n };\n const onDragEnd = () => {\n if (outlineDiv.current) {\n updateLayout(false);\n const rootdiv = layout.getRootDiv();\n if (rootdiv && outlineDiv.current) {\n rootdiv.removeChild(outlineDiv.current);\n }\n outlineDiv.current = undefined;\n }\n (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.enablePointerOnIFrames)(true, layout.getCurrentDocument());\n setDragging(false);\n };\n const updateLayout = (realtime) => {\n const redraw = () => {\n if (outlineDiv.current) {\n let value = 0;\n if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\n value = outlineDiv.current.offsetTop;\n }\n else {\n value = outlineDiv.current.offsetLeft;\n }\n if (node instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_2__.BorderNode) {\n const pos = node.calculateSplit(node, value);\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_1__.Actions.adjustBorderSplit(node.getId(), pos));\n }\n else {\n const init = initalSizes.current;\n const weights = node.calculateSplit(index, value, init.initialSizes, init.sum, init.startPosition);\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_1__.Actions.adjustWeights(node.getId(), weights));\n }\n }\n };\n redraw();\n };\n const getBoundPosition = (p) => {\n const bounds = pBounds.current;\n let rtn = p;\n if (p < bounds[0]) {\n rtn = bounds[0];\n }\n if (p > bounds[1]) {\n rtn = bounds[1];\n }\n return rtn;\n };\n const cm = layout.getClassName;\n const style = {\n cursor: horizontal ? \"ew-resize\" : \"ns-resize\",\n flexDirection: horizontal ? \"column\" : \"row\"\n };\n let className = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_ + node.getOrientation().getName());\n if (node instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_2__.BorderNode) {\n className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_BORDER);\n }\n else {\n if (node.getModel().getMaximizedTabset(layout.getWindowId()) !== undefined) {\n style.display = \"none\";\n }\n }\n if (horizontal) {\n style.width = size + \"px\";\n style.minWidth = size + \"px\";\n }\n else {\n style.height = size + \"px\";\n style.minHeight = size + \"px\";\n }\n let handle;\n if (!dragging && node.getModel().isSplitterEnableHandle()) {\n handle = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE) + \" \" +\n (horizontal ? cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE_HORZ) : cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE_VERT)) }));\n }\n if (extra === 0) {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: className, style: style, ref: selfRef, \"data-layout-path\": node.getPath() + \"/s\" + (index - 1), onPointerDown: onPointerDown }, handle));\n }\n else {\n // add extended transparent div for hit testing\n const style2 = {};\n if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\n style2.height = \"100%\";\n style2.width = size + extra + \"px\";\n style2.cursor = \"ew-resize\";\n }\n else {\n style2.height = size + extra + \"px\";\n style2.width = \"100%\";\n style2.cursor = \"ns-resize\";\n }\n const className2 = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_EXTRA);\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: className, style: style, ref: selfRef, \"data-layout-path\": node.getPath() + \"/s\" + (index - 1), onPointerDown: onPointerDown },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: style2, ref: extendedRef, className: className2, onPointerDown: onPointerDown })));\n }\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Splitter.tsx?");
429
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ Splitter: () => (/* binding */ Splitter)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_RowNode__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../model/RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n\n\n\n\n\n\n\n\n/** @internal */\nconst Splitter = (props) => {\n const { layout, node, index, horizontal } = props;\n const [dragging, setDragging] = react__WEBPACK_IMPORTED_MODULE_0__.useState(false);\n const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const extendedRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const pBounds = react__WEBPACK_IMPORTED_MODULE_0__.useRef([]);\n const outlineDiv = react__WEBPACK_IMPORTED_MODULE_0__.useRef(undefined);\n const handleDiv = react__WEBPACK_IMPORTED_MODULE_0__.useRef(undefined);\n const dragStartX = react__WEBPACK_IMPORTED_MODULE_0__.useRef(0);\n const dragStartY = react__WEBPACK_IMPORTED_MODULE_0__.useRef(0);\n const initalSizes = react__WEBPACK_IMPORTED_MODULE_0__.useRef({ initialSizes: [], sum: 0, startPosition: 0 });\n // const throttleTimer = React.useRef<NodeJS.Timeout | undefined>(undefined);\n const size = node.getModel().getSplitterSize();\n let extra = node.getModel().getSplitterExtra();\n if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isDesktop)()) {\n // make hit test area on mobile at least 20px\n extra = Math.max(20, extra + size) - size;\n }\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n var _a, _b;\n // Android fix: must have passive touchstart handler to prevent default handling\n (_a = selfRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener(\"touchstart\", onTouchStart, { passive: false });\n (_b = extendedRef.current) === null || _b === void 0 ? void 0 : _b.addEventListener(\"touchstart\", onTouchStart, { passive: false });\n return () => {\n var _a, _b;\n (_a = selfRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener(\"touchstart\", onTouchStart);\n (_b = extendedRef.current) === null || _b === void 0 ? void 0 : _b.removeEventListener(\"touchstart\", onTouchStart);\n };\n }, []);\n const onTouchStart = (event) => {\n event.preventDefault();\n event.stopImmediatePropagation();\n };\n const onPointerDown = (event) => {\n var _a;\n event.stopPropagation();\n if (node instanceof _model_RowNode__WEBPACK_IMPORTED_MODULE_3__.RowNode) {\n initalSizes.current = node.getSplitterInitials(index);\n }\n (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.enablePointerOnIFrames)(false, layout.getCurrentDocument());\n (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.startDrag)(event.currentTarget.ownerDocument, event, onDragMove, onDragEnd, onDragCancel);\n pBounds.current = node.getSplitterBounds(index, true);\n const rootdiv = layout.getRootDiv();\n outlineDiv.current = layout.getCurrentDocument().createElement(\"div\");\n outlineDiv.current.style.flexDirection = horizontal ? \"row\" : \"column\";\n outlineDiv.current.className = layout.getClassName(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_DRAG);\n outlineDiv.current.style.cursor = node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT ? \"ns-resize\" : \"ew-resize\";\n if (node.getModel().isSplitterEnableHandle()) {\n handleDiv.current = layout.getCurrentDocument().createElement(\"div\");\n handleDiv.current.className = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE) + \" \" +\n (horizontal ? cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE_HORZ) : cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE_VERT));\n outlineDiv.current.appendChild(handleDiv.current);\n }\n const r = (_a = selfRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();\n const rect = new _Rect__WEBPACK_IMPORTED_MODULE_7__.Rect(r.x - layout.getDomRect().x, r.y - layout.getDomRect().y, r.width, r.height);\n dragStartX.current = event.clientX - r.x;\n dragStartY.current = event.clientY - r.y;\n rect.positionElement(outlineDiv.current);\n if (rootdiv) {\n rootdiv.appendChild(outlineDiv.current);\n }\n setDragging(true);\n };\n const onDragCancel = () => {\n const rootdiv = layout.getRootDiv();\n if (rootdiv && outlineDiv.current) {\n rootdiv.removeChild(outlineDiv.current);\n }\n outlineDiv.current = undefined;\n setDragging(false);\n };\n const onDragMove = (x, y) => {\n if (outlineDiv.current) {\n const clientRect = layout.getDomRect();\n if (!clientRect) {\n return;\n }\n if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\n outlineDiv.current.style.top = getBoundPosition(y - clientRect.y - dragStartY.current) + \"px\";\n }\n else {\n outlineDiv.current.style.left = getBoundPosition(x - clientRect.x - dragStartX.current) + \"px\";\n }\n if (layout.isRealtimeResize()) {\n updateLayout(true);\n }\n }\n };\n const onDragEnd = () => {\n if (outlineDiv.current) {\n updateLayout(false);\n const rootdiv = layout.getRootDiv();\n if (rootdiv && outlineDiv.current) {\n rootdiv.removeChild(outlineDiv.current);\n }\n outlineDiv.current = undefined;\n }\n (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.enablePointerOnIFrames)(true, layout.getCurrentDocument());\n setDragging(false);\n };\n const updateLayout = (realtime) => {\n const redraw = () => {\n if (outlineDiv.current) {\n let value = 0;\n if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.VERT) {\n value = outlineDiv.current.offsetTop;\n }\n else {\n value = outlineDiv.current.offsetLeft;\n }\n if (node instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_2__.BorderNode) {\n const pos = node.calculateSplit(node, value);\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_1__.Actions.adjustBorderSplit(node.getId(), pos));\n }\n else {\n const init = initalSizes.current;\n const weights = node.calculateSplit(index, value, init.initialSizes, init.sum, init.startPosition);\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_1__.Actions.adjustWeights(node.getId(), weights));\n }\n }\n };\n redraw();\n };\n const getBoundPosition = (p) => {\n const bounds = pBounds.current;\n let rtn = p;\n if (p < bounds[0]) {\n rtn = bounds[0];\n }\n if (p > bounds[1]) {\n rtn = bounds[1];\n }\n return rtn;\n };\n const cm = layout.getClassName;\n const style = {\n cursor: horizontal ? \"ew-resize\" : \"ns-resize\",\n flexDirection: horizontal ? \"column\" : \"row\"\n };\n let className = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_ + node.getOrientation().getName());\n if (node instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_2__.BorderNode) {\n className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_BORDER);\n }\n else {\n if (node.getModel().getMaximizedTabset(layout.getWindowId()) !== undefined) {\n style.display = \"none\";\n }\n }\n if (horizontal) {\n style.width = size + \"px\";\n style.minWidth = size + \"px\";\n }\n else {\n style.height = size + \"px\";\n style.minHeight = size + \"px\";\n }\n let handle;\n if (!dragging && node.getModel().isSplitterEnableHandle()) {\n handle = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE) + \" \" +\n (horizontal ? cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE_HORZ) : cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_HANDLE_VERT)) }));\n }\n if (extra === 0) {\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: className, style: style, ref: selfRef, \"data-layout-path\": node.getPath() + \"/s\" + (index - 1), onPointerDown: onPointerDown }, handle));\n }\n else {\n // add extended transparent div for hit testing\n const style2 = {};\n if (node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_4__.Orientation.HORZ) {\n style2.height = \"100%\";\n style2.width = size + extra + \"px\";\n style2.cursor = \"ew-resize\";\n }\n else {\n style2.height = size + extra + \"px\";\n style2.width = \"100%\";\n style2.cursor = \"ns-resize\";\n }\n const className2 = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__SPLITTER_EXTRA);\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: className, style: style, ref: selfRef, \"data-layout-path\": node.getPath() + \"/s\" + (index - 1), onPointerDown: onPointerDown },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: style2, ref: extendedRef, className: className2, onPointerDown: onPointerDown })));\n }\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Splitter.tsx?");
430
430
 
431
431
  /***/ }),
432
432
 
@@ -436,7 +436,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
436
436
  \**************************/
437
437
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
438
438
 
439
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ Tab: () => (/* binding */ Tab)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n\n\n\n\n\n/** @internal */\nconst Tab = (props) => {\n const { layout, selected, node, path } = props;\n const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const firstSelect = react__WEBPACK_IMPORTED_MODULE_0__.useRef(true);\n const parentNode = node.getParent();\n const rect = parentNode.getContentRect();\n react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\n const element = node.getMoveableElement();\n selfRef.current.appendChild(element);\n node.setMoveableElement(element);\n const handleScroll = () => {\n node.saveScrollPosition();\n };\n // keep scroll position\n element.addEventListener('scroll', handleScroll);\n // listen for clicks to change active tabset\n selfRef.current.addEventListener(\"pointerdown\", onPointerDown);\n return () => {\n element.removeEventListener('scroll', handleScroll);\n if (selfRef.current) {\n selfRef.current.removeEventListener(\"pointerdown\", onPointerDown);\n }\n node.setVisible(false);\n };\n }, []);\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n if (node.isSelected()) {\n if (firstSelect.current) {\n node.restoreScrollPosition(); // if window docked back in\n firstSelect.current = false;\n }\n }\n });\n const onPointerDown = () => {\n const parent = node.getParent(); // cannot use parentNode here since will be out of date\n if (parent instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_1__.TabSetNode) {\n if (!parent.isActive()) {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.setActiveTabset(parent.getId(), layout.getWindowId()));\n }\n }\n };\n node.setRect(rect); // needed for resize event\n const cm = layout.getClassName;\n const style = {};\n rect.styleWithPosition(style);\n let overlay = null;\n if (selected) {\n node.setVisible(true);\n if (document.hidden && node.isEnablePopoutOverlay()) {\n const overlayStyle = {};\n rect.styleWithPosition(overlayStyle);\n overlay = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: overlayStyle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__TAB_OVERLAY) }));\n }\n }\n else {\n style.display = \"none\";\n node.setVisible(false);\n }\n if (parentNode instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_1__.TabSetNode) {\n if (node.getModel().getMaximizedTabset(layout.getWindowId()) !== undefined) {\n if (parentNode.isMaximized()) {\n style.zIndex = 10;\n }\n else {\n style.display = \"none\";\n }\n }\n }\n let className = cm(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__TAB);\n if (parentNode instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__.BorderNode) {\n className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__TAB_BORDER);\n className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__TAB_BORDER_ + parentNode.getLocation().getName());\n }\n if (node.getContentClassName() !== undefined) {\n className += \" \" + node.getContentClassName();\n }\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n overlay,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, style: style, className: className, \"data-layout-path\": path })));\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Tab.tsx?");
439
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ Tab: () => (/* binding */ Tab)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n\n\n\n\n\n/** @internal */\nconst Tab = (props) => {\n const { layout, selected, node, path } = props;\n const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const firstSelect = react__WEBPACK_IMPORTED_MODULE_0__.useRef(true);\n const parentNode = node.getParent();\n const rect = parentNode.getContentRect();\n react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\n const element = node.getMoveableElement();\n selfRef.current.appendChild(element);\n node.setMoveableElement(element);\n const handleScroll = () => {\n node.saveScrollPosition();\n };\n // keep scroll position\n element.addEventListener('scroll', handleScroll);\n // listen for clicks to change active tabset\n selfRef.current.addEventListener(\"pointerdown\", onPointerDown);\n return () => {\n element.removeEventListener('scroll', handleScroll);\n if (selfRef.current) {\n selfRef.current.removeEventListener(\"pointerdown\", onPointerDown);\n }\n node.setVisible(false);\n };\n }, []);\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n if (node.isSelected()) {\n if (firstSelect.current) {\n node.restoreScrollPosition(); // if window docked back in\n firstSelect.current = false;\n }\n }\n });\n const onPointerDown = () => {\n const parent = node.getParent(); // cannot use parentNode here since will be out of date\n if (parent instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_1__.TabSetNode) {\n if (!parent.isActive()) {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.setActiveTabset(parent.getId(), layout.getWindowId()));\n }\n }\n };\n node.setRect(rect); // needed for resize event\n const cm = layout.getClassName;\n const style = {};\n rect.styleWithPosition(style);\n let overlay = null;\n if (selected) {\n node.setVisible(true);\n if (document.hidden && node.isEnablePopoutOverlay()) {\n const overlayStyle = {};\n rect.styleWithPosition(overlayStyle);\n overlay = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: overlayStyle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__TAB_OVERLAY) }));\n }\n }\n else {\n style.display = \"none\";\n node.setVisible(false);\n }\n if (parentNode instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_1__.TabSetNode) {\n if (node.getModel().getMaximizedTabset(layout.getWindowId()) !== undefined) {\n if (parentNode.isMaximized()) {\n style.zIndex = 10;\n }\n else {\n style.display = \"none\";\n }\n }\n }\n if (parentNode instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__.BorderNode) {\n if (!parentNode.isShowing()) {\n style.display = \"none\";\n }\n }\n let className = cm(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__TAB);\n if (parentNode instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_3__.BorderNode) {\n className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__TAB_BORDER);\n className += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_2__.CLASSES.FLEXLAYOUT__TAB_BORDER_ + parentNode.getLocation().getName());\n }\n if (node.getContentClassName() !== undefined) {\n className += \" \" + node.getContentClassName();\n }\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n overlay,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, style: style, className: className, \"data-layout-path\": path })));\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Tab.tsx?");
440
440
 
441
441
  /***/ }),
442
442
 
@@ -466,7 +466,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
466
466
  \**************************************/
467
467
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
468
468
 
469
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ useTabOverflow: () => (/* binding */ useTabOverflow)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n\n\n\n\n/** @internal */\nconst useTabOverflow = (node, orientation, toolbarRef, stickyButtonsRef) => {\n const firstRender = react__WEBPACK_IMPORTED_MODULE_0__.useRef(true);\n const tabsTruncated = react__WEBPACK_IMPORTED_MODULE_0__.useRef(false);\n const lastRect = react__WEBPACK_IMPORTED_MODULE_0__.useRef(_Rect__WEBPACK_IMPORTED_MODULE_1__.Rect.empty());\n const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const [position, setPosition] = react__WEBPACK_IMPORTED_MODULE_0__.useState(0);\n const userControlledLeft = react__WEBPACK_IMPORTED_MODULE_0__.useRef(false);\n const [hiddenTabs, setHiddenTabs] = react__WEBPACK_IMPORTED_MODULE_0__.useState([]);\n const lastHiddenCount = react__WEBPACK_IMPORTED_MODULE_0__.useRef(0);\n // if selected node or tabset/border rectangle change then unset usercontrolled (so selected tab will be kept in view)\n react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\n userControlledLeft.current = false;\n }, [node.getSelectedNode(), node.getRect().width, node.getRect().height]);\n react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\n const nodeRect = node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode ? node.getRect() : node.getTabHeaderRect();\n if (nodeRect.width > 0 && nodeRect.height > 0) {\n updateVisibleTabs();\n }\n });\n const instance = toolbarRef.current;\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n if (!instance) {\n return;\n }\n instance.addEventListener(\"wheel\", onWheel, { passive: false });\n return () => {\n instance.removeEventListener(\"wheel\", onWheel);\n };\n }, [instance]);\n // needed to prevent default mouse wheel over tabset/border (cannot do with react event?)\n const onWheel = (event) => {\n event.preventDefault();\n };\n const getNear = (rect) => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\n return rect.x;\n }\n else {\n return rect.y;\n }\n };\n const getFar = (rect) => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\n return rect.getRight();\n }\n else {\n return rect.getBottom();\n }\n };\n const getSize = (rect) => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\n return rect.width;\n }\n else {\n return rect.height;\n }\n };\n const updateVisibleTabs = () => {\n const tabMargin = 2;\n if (firstRender.current === true) {\n tabsTruncated.current = false;\n }\n const nodeRect = node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode ? node.getRect() : node.getTabHeaderRect();\n let lastChild = node.getChildren()[node.getChildren().length - 1];\n const 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 const enabled = node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode ? node.isEnableTabStrip() === true : true;\n let 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 let shiftPos = 0;\n const selectedTab = node.getSelectedNode();\n if (selectedTab && !userControlledLeft.current) {\n const selectedRect = selectedTab.getTabRect();\n const selectedStart = getNear(selectedRect) - tabMargin;\n const 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 // console.log(\"shiftPos1\", 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 // console.log(\"shiftPos2\", 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 const extraSpace = Math.max(0, endPos - (getFar(lastChild.getTabRect()) + tabMargin + shiftPos));\n const newPosition = Math.min(0, position + shiftPos + extraSpace);\n // console.log(\"newPosition\", newPosition, position, shiftPos, extraSpace);\n // find hidden tabs\n const diff = newPosition - position;\n const hidden = [];\n for (let i = 0; i < node.getChildren().length; i++) {\n const 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 tabsTruncated.current = hidden.length > 0;\n firstRender.current = false; // need to do a second render\n setHiddenTabs(hidden);\n // console.log(newPosition);\n setPosition(newPosition);\n }\n }\n else {\n firstRender.current = true;\n }\n };\n const onMouseWheel = (event) => {\n let 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, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated: tabsTruncated.current };\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabOverflowHook.tsx?");
469
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ useTabOverflow: () => (/* binding */ useTabOverflow)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n\n\n/** @internal */\nconst useTabOverflow = (layout, node, orientation, tabStripRef, tabClassName) => {\n const [hiddenTabs, setHiddenTabs] = react__WEBPACK_IMPORTED_MODULE_0__.useState([]);\n const [isTabOverflow, setTabOverflow] = react__WEBPACK_IMPORTED_MODULE_0__.useState(false);\n const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const userControlledPositionRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(false);\n const updateHiddenTabsTimerRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(undefined);\n const hiddenTabsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef([]);\n hiddenTabsRef.current = hiddenTabs;\n // if selected node or tabset/border rectangle change then unset usercontrolled (so selected tab will be kept in view)\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n userControlledPositionRef.current = false;\n }, [node.getSelectedNode(), node.getRect().width, node.getRect().height]);\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n checkForOverflow(); // if tabs + sticky buttons length > scroll area => move sticky buttons to right buttons\n if (!userControlledPositionRef.current) {\n const selectedTab = findSelectedTab();\n if (selectedTab) {\n selectedTab.scrollIntoView();\n }\n }\n updateHiddenTabs();\n });\n const updateHiddenTabs = () => {\n if (updateHiddenTabsTimerRef.current === undefined) {\n // throttle updates to prevent Maximum update depth exceeded error\n updateHiddenTabsTimerRef.current = setTimeout(() => {\n const newHiddenTabs = findHiddenTabs();\n if (!arraysEqual(newHiddenTabs, hiddenTabsRef.current)) {\n setHiddenTabs(newHiddenTabs);\n }\n updateHiddenTabsTimerRef.current = undefined;\n }, 100);\n }\n };\n const updateTabRects = () => {\n if (tabStripRef.current) {\n const tabContainer = tabStripRef.current.firstElementChild;\n const nodeChildren = node.getChildren();\n let i = 0;\n Array.from(tabContainer.children).forEach((child) => {\n if (child.classList.contains(tabClassName)) {\n const childNode = nodeChildren[i];\n childNode.setTabRect(layout.getBoundingClientRect(child));\n i++;\n }\n });\n }\n };\n const onScroll = () => {\n updateTabRects();\n updateHiddenTabs();\n userControlledPositionRef.current = true;\n };\n const findSelectedTab = () => {\n let found = undefined;\n if (tabStripRef.current) {\n const tabContainer = tabStripRef.current.firstElementChild;\n Array.from(tabContainer.children).forEach((child) => {\n if (child.classList.contains(tabClassName + \"--selected\")) {\n found = child;\n }\n });\n }\n return found;\n };\n const checkForOverflow = () => {\n if (tabStripRef.current) {\n const strip = tabStripRef.current;\n const tabContainer = strip.firstElementChild;\n const offset = isTabOverflow ? 10 : 0; // prevents flashing, after sticky buttons docked set, must be 10 pixels smaller before unsetting\n const dock = (getSize(tabContainer) + offset) > getSize(tabStripRef.current);\n if (dock !== isTabOverflow) {\n setTabOverflow(dock);\n }\n }\n };\n const findHiddenTabs = () => {\n const hidden = [];\n if (tabStripRef.current) {\n const strip = tabStripRef.current;\n const stripRect = strip.getBoundingClientRect();\n const visibleNear = getNear(stripRect) - 1;\n const visibleFar = getFar(stripRect) + 1;\n const tabContainer = strip.firstElementChild;\n let i = 0;\n Array.from(tabContainer.children).forEach((child) => {\n const tabRect = child.getBoundingClientRect();\n if (child.classList.contains(tabClassName)) {\n if (getNear(tabRect) < visibleNear || getFar(tabRect) > visibleFar) {\n hidden.push(i);\n }\n i++;\n }\n });\n }\n return hidden;\n };\n const onMouseWheel = (event) => {\n if (tabStripRef.current) {\n if (node.getChildren().length === 0)\n return;\n let 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 const newPos = getScrollPosition() - delta;\n const maxScroll = getScrollSize(tabStripRef.current) - getSize(tabStripRef.current);\n const p = Math.max(0, Math.min(maxScroll, newPos));\n userControlledPositionRef.current = true;\n setScrollPosition(p);\n updateTabRects();\n updateHiddenTabs();\n event.stopPropagation();\n }\n };\n // orientation helpers:\n const getNear = (rect) => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ) {\n return rect.x;\n }\n else {\n return rect.y;\n }\n };\n const getFar = (rect) => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ) {\n return rect.right;\n }\n else {\n return rect.bottom;\n }\n };\n const getSize = (elm) => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ) {\n return elm.clientWidth;\n }\n else {\n return elm.clientHeight;\n }\n };\n const getScrollSize = (elm) => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ) {\n return elm.scrollWidth;\n }\n else {\n return elm.scrollHeight;\n }\n };\n const setScrollPosition = (p) => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ) {\n tabStripRef.current.scrollLeft = p;\n }\n else {\n tabStripRef.current.scrollTop = p;\n }\n };\n const getScrollPosition = () => {\n if (orientation === _Orientation__WEBPACK_IMPORTED_MODULE_1__.Orientation.HORZ) {\n return tabStripRef.current.scrollLeft;\n }\n else {\n return tabStripRef.current.scrollTop;\n }\n };\n return { selfRef, userControlledPositionRef, onScroll, hiddenTabs, onMouseWheel, isTabOverflow };\n};\nfunction arraysEqual(arr1, arr2) {\n return arr1.length === arr2.length && arr1.every((val, index) => val === arr2[index]);\n}\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabOverflowHook.tsx?");
470
470
 
471
471
  /***/ }),
472
472
 
@@ -476,7 +476,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
476
476
  \*****************************/
477
477
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
478
478
 
479
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ TabSet: () => (/* binding */ TabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./PopupMenu */ \"./src/view/PopupMenu.tsx\");\n/* harmony import */ var _TabButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./TabButton */ \"./src/view/TabButton.tsx\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_9__);\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n\n\n\n\n\n\n\n\n\n\n\n/** @internal */\nconst TabSet = (props) => {\n const { node, layout } = props;\n const tabStripRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const tabStripInnerRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const contentRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const buttonBarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const icons = layout.getIcons();\n // must use useEffect (rather than useLayoutEffect) otherwise contentrect not set correctly (has height 0 when changing theme in demo)\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n node.setRect(layout.getBoundingClientRect(selfRef.current));\n if (tabStripRef.current) {\n node.setTabStripRect(layout.getBoundingClientRect(tabStripRef.current));\n }\n const newContentRect = _Rect__WEBPACK_IMPORTED_MODULE_10__.Rect.getContentRect(contentRef.current).relativeTo(layout.getDomRect());\n if (!node.getContentRect().equals(newContentRect)) {\n node.setContentRect(newContentRect);\n layout.redrawInternal(\"tabset content rect \" + newContentRect);\n }\n });\n // this must be after the useEffect, so the node rect is already set (else window popin will not position tabs correctly)\n const { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__.useTabOverflow)(node, _Orientation__WEBPACK_IMPORTED_MODULE_6__.Orientation.HORZ, buttonBarRef, stickyButtonsRef);\n const onOverflowClick = (event) => {\n const callback = layout.getShowOverflowMenu();\n if (callback !== undefined) {\n callback(node, event, hiddenTabs, onOverflowItemSelect);\n }\n else {\n const element = overflowbuttonRef.current;\n (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout);\n }\n event.stopPropagation();\n };\n const onOverflowItemSelect = (item) => {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(item.node.getId()));\n userControlledLeft.current = false;\n };\n const onDragStart = (event) => {\n if (!layout.getEditingTab()) {\n if (node.isEnableDrag()) {\n event.stopPropagation();\n layout.setDragNode(event.nativeEvent, node);\n }\n else {\n event.preventDefault();\n }\n }\n else {\n event.preventDefault();\n }\n };\n const onPointerDown = (event) => {\n if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\n let name = node.getName();\n if (name === undefined) {\n name = \"\";\n }\n else {\n name = \": \" + name;\n }\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.setActiveTabset(node.getId(), layout.getWindowId()));\n }\n };\n const onAuxMouseClick = (event) => {\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\n layout.auxMouseClick(node, event);\n }\n };\n const onContextMenu = (event) => {\n layout.showContextMenu(node, event);\n };\n const onInterceptPointerDown = (event) => {\n event.stopPropagation();\n };\n const onMaximizeToggle = (event) => {\n if (node.canMaximize()) {\n layout.maximize(node);\n }\n event.stopPropagation();\n };\n const onClose = (event) => {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTabset(node.getId()));\n event.stopPropagation();\n };\n const onCloseTab = (event) => {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTab(node.getChildren()[0].getId()));\n event.stopPropagation();\n };\n const onPopoutTab = (event) => {\n if (selectedTabNode !== undefined) {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.popoutTab(selectedTabNode.getId()));\n // layout.doAction(Actions.popoutTabset(node.getId()));\n }\n event.stopPropagation();\n };\n const onDoubleClick = (event) => {\n if (node.canMaximize()) {\n layout.maximize(node);\n }\n };\n // Start Render\n const cm = layout.getClassName;\n // tabbar inner can get shifted left via tab rename, this resets scrollleft to 0\n if (tabStripInnerRef.current !== null && tabStripInnerRef.current.scrollLeft !== 0) {\n tabStripInnerRef.current.scrollLeft = 0;\n }\n const selectedTabNode = node.getSelectedNode();\n const path = node.getPath();\n const tabs = [];\n if (node.isEnableTabStrip()) {\n for (let i = 0; i < node.getChildren().length; i++) {\n const child = node.getChildren()[i];\n let isSelected = node.getSelected() === i;\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButton__WEBPACK_IMPORTED_MODULE_4__.TabButton, { layout: layout, node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected }));\n if (i < node.getChildren().length - 1) {\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TAB_DIVIDER) }));\n }\n }\n }\n let stickyButtons = [];\n let buttons = [];\n // allow customization of header contents and buttons\n const renderState = { stickyButtons, buttons, overflowPosition: undefined };\n layout.customizeTabSet(node, renderState);\n stickyButtons = renderState.stickyButtons;\n buttons = renderState.buttons;\n const isTabStretch = node.isEnableSingleTabStretch() && node.getChildren().length === 1;\n const showClose = (isTabStretch && (node.getChildren()[0].isEnableClose())) || node.isEnableClose();\n if (renderState.overflowPosition === undefined) {\n renderState.overflowPosition = stickyButtons.length;\n }\n if (stickyButtons.length > 0) {\n if (!node.isEnableTabWrap() && (tabsTruncated || isTabStretch)) {\n buttons = [...stickyButtons, ...buttons];\n }\n else {\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onPointerDown: onInterceptPointerDown, onDragStart: (e) => { e.preventDefault(); }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\n }\n }\n if (!node.isEnableTabWrap()) {\n if (hiddenTabs.length > 0) {\n const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Overflow_Menu_Tooltip);\n let overflowContent;\n if (typeof icons.more === \"function\") {\n overflowContent = icons.more(node, hiddenTabs);\n }\n else {\n overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n icons.more,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\n }\n buttons.splice(Math.min(renderState.overflowPosition, buttons.length), 0, react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"overflowbutton\", \"data-layout-path\": path + \"/button/overflow\", ref: overflowbuttonRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW), title: overflowTitle, onClick: onOverflowClick, onPointerDown: onInterceptPointerDown }, overflowContent));\n }\n }\n if (selectedTabNode !== undefined &&\n layout.isSupportsPopout() &&\n selectedTabNode.isEnablePopout() &&\n selectedTabNode.isEnablePopoutIcon()) {\n const popoutTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Popout_Tab);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"popout\", \"data-layout-path\": path + \"/button/popout\", title: popoutTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT), onClick: onPopoutTab, onPointerDown: onInterceptPointerDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\n }\n if (node.canMaximize()) {\n const minTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Restore);\n const maxTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Maximize);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"max\", \"data-layout-path\": path + \"/button/max\", title: node.isMaximized() ? minTitle : maxTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_ + (node.isMaximized() ? \"max\" : \"min\")), onClick: onMaximizeToggle, onPointerDown: onInterceptPointerDown }, 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() && showClose) {\n const title = isTabStretch ? layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tab) : layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tabset);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: title, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE), onClick: isTabStretch ? onCloseTab : onClose, onPointerDown: onInterceptPointerDown }, (typeof icons.closeTabset === \"function\") ? icons.closeTabset(node) : icons.closeTabset));\n }\n if (node.isActive() && node.isEnableActiveIcon()) {\n const title = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Active_Tabset);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"active\", \"data-layout-path\": path + \"/button/active\", title: title, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_ICON) }, (typeof icons.activeTabset === \"function\") ? icons.activeTabset(node) : icons.activeTabset));\n }\n const buttonbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"buttonbar\", ref: buttonBarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onPointerDown: onInterceptPointerDown, onDragStart: (e) => { e.preventDefault(); } }, buttons));\n let tabStrip;\n let tabStripClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER);\n if (node.getClassNameTabStrip() !== undefined) {\n tabStripClasses += \" \" + node.getClassNameTabStrip();\n }\n tabStripClasses += \" \" + _Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER_ + node.getTabLocation();\n if (node.isActive()) {\n tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\n }\n if (node.isMaximized()) {\n tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\n }\n if (isTabStretch) {\n const tabNode = node.getChildren()[0];\n if (tabNode.getTabSetClassName() !== undefined) {\n tabStripClasses += \" \" + tabNode.getTabSetClassName();\n }\n }\n if (node.isEnableTabWrap()) {\n if (node.isEnableTabStrip()) {\n tabStrip = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabStripClasses, style: { flexWrap: \"wrap\", gap: \"1px\", marginTop: \"2px\" }, ref: tabStripRef, \"data-layout-path\": path + \"/tabstrip\", onPointerDown: onPointerDown, onDoubleClick: onDoubleClick, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, draggable: true, onDragStart: onDragStart },\n tabs,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { flexGrow: 1 } }),\n buttonbar));\n }\n }\n else {\n if (node.isEnableTabStrip()) {\n tabStrip = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabStripClasses, ref: tabStripRef, \"data-layout-path\": path + \"/tabstrip\", onPointerDown: onPointerDown, onDoubleClick: onDoubleClick, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, draggable: true, onWheel: onMouseWheel, onDragStart: onDragStart },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: tabStripInnerRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_ + node.getTabLocation()) },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { left: position, width: (isTabStretch ? \"100%\" : \"10000px\") }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_ + node.getTabLocation()) }, tabs)),\n buttonbar));\n }\n }\n var emptyTabset;\n if (node.getChildren().length === 0) {\n const placeHolderCallback = layout.getTabSetPlaceHolderCallback();\n if (placeHolderCallback) {\n emptyTabset = placeHolderCallback(node);\n }\n }\n let content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: contentRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_CONTENT) }, emptyTabset);\n if (node.getTabLocation() === \"top\") {\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n tabStrip,\n content);\n }\n else {\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n content,\n tabStrip);\n }\n let style = {\n flexGrow: Math.max(1, node.getWeight() * 1000),\n minWidth: node.getMinWidth(),\n minHeight: node.getMinHeight(),\n maxWidth: node.getMaxWidth(),\n maxHeight: node.getMaxHeight()\n };\n if (node.getModel().getMaximizedTabset(layout.getWindowId()) !== undefined && !node.isMaximized()) {\n style.display = \"none\";\n }\n // note: tabset container is needed to allow flexbox to size without border/padding/margin\n // then inner tabset can have border/padding/margin for styling\n const tabset = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_CONTAINER), style: style },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET), \"data-layout-path\": path }, content)));\n if (node.isMaximized()) {\n if (layout.getMainElement()) {\n return (0,react_dom__WEBPACK_IMPORTED_MODULE_9__.createPortal)(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: {\n position: \"absolute\",\n display: \"flex\",\n top: 0, left: 0, bottom: 0, right: 0\n } }, tabset), layout.getMainElement());\n }\n else {\n return tabset;\n }\n }\n else {\n return tabset;\n }\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabSet.tsx?");
479
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ TabSet: () => (/* binding */ TabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./PopupMenu */ \"./src/view/PopupMenu.tsx\");\n/* harmony import */ var _TabButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./TabButton */ \"./src/view/TabButton.tsx\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_9__);\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n\n\n\n\n\n\n\n\n\n\n\n/** @internal */\nconst TabSet = (props) => {\n const { node, layout } = props;\n const tabStripRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const tabStripInnerRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const contentRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const buttonBarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\n const icons = layout.getIcons();\n // must use useEffect (rather than useLayoutEffect) otherwise contentrect not set correctly (has height 0 when changing theme in demo)\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\n node.setRect(layout.getBoundingClientRect(selfRef.current));\n if (tabStripRef.current) {\n node.setTabStripRect(layout.getBoundingClientRect(tabStripRef.current));\n }\n const newContentRect = _Rect__WEBPACK_IMPORTED_MODULE_10__.Rect.getContentRect(contentRef.current).relativeTo(layout.getDomRect());\n if (!node.getContentRect().equals(newContentRect)) {\n node.setContentRect(newContentRect);\n setTimeout(() => {\n layout.redrawInternal(\"tabset content rect \" + newContentRect);\n }, 0);\n }\n });\n // this must be after the useEffect, so the node rect is already set (else window popin will not position tabs correctly)\n const { selfRef, userControlledPositionRef, onScroll, hiddenTabs, onMouseWheel, isTabOverflow } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__.useTabOverflow)(layout, node, _Orientation__WEBPACK_IMPORTED_MODULE_6__.Orientation.HORZ, tabStripInnerRef, layout.getClassName(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON));\n const onOverflowClick = (event) => {\n const callback = layout.getShowOverflowMenu();\n const items = hiddenTabs.map(h => { return { index: h, node: node.getChildren()[h] }; });\n if (callback !== undefined) {\n callback(node, event, items, onOverflowItemSelect);\n }\n else {\n const element = overflowbuttonRef.current;\n (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, items, onOverflowItemSelect, layout);\n }\n event.stopPropagation();\n };\n const onOverflowItemSelect = (item) => {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(item.node.getId()));\n userControlledPositionRef.current = false;\n };\n const onDragStart = (event) => {\n if (!layout.getEditingTab()) {\n if (node.isEnableDrag()) {\n event.stopPropagation();\n layout.setDragNode(event.nativeEvent, node);\n }\n else {\n event.preventDefault();\n }\n }\n else {\n event.preventDefault();\n }\n };\n const onPointerDown = (event) => {\n if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.setActiveTabset(node.getId(), layout.getWindowId()));\n }\n };\n const onAuxMouseClick = (event) => {\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\n layout.auxMouseClick(node, event);\n }\n };\n const onContextMenu = (event) => {\n layout.showContextMenu(node, event);\n };\n const onInterceptPointerDown = (event) => {\n event.stopPropagation();\n };\n const onMaximizeToggle = (event) => {\n if (node.canMaximize()) {\n layout.maximize(node);\n }\n event.stopPropagation();\n };\n const onClose = (event) => {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTabset(node.getId()));\n event.stopPropagation();\n };\n const onCloseTab = (event) => {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTab(node.getChildren()[0].getId()));\n event.stopPropagation();\n };\n const onPopoutTab = (event) => {\n if (selectedTabNode !== undefined) {\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.popoutTab(selectedTabNode.getId()));\n // layout.doAction(Actions.popoutTabset(node.getId()));\n }\n event.stopPropagation();\n };\n const onDoubleClick = (event) => {\n if (node.canMaximize()) {\n layout.maximize(node);\n }\n };\n // Start Render\n const cm = layout.getClassName;\n const selectedTabNode = node.getSelectedNode();\n const path = node.getPath();\n const tabs = [];\n if (node.isEnableTabStrip()) {\n for (let i = 0; i < node.getChildren().length; i++) {\n const child = node.getChildren()[i];\n let isSelected = node.getSelected() === i;\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButton__WEBPACK_IMPORTED_MODULE_4__.TabButton, { layout: layout, node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected }));\n if (i < node.getChildren().length - 1) {\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TAB_DIVIDER) }));\n }\n }\n }\n let stickyButtons = [];\n let buttons = [];\n // allow customization of header contents and buttons\n const renderState = { stickyButtons, buttons, overflowPosition: undefined };\n layout.customizeTabSet(node, renderState);\n stickyButtons = renderState.stickyButtons;\n buttons = renderState.buttons;\n const isTabStretch = node.isEnableSingleTabStretch() && node.getChildren().length === 1;\n const showClose = (isTabStretch && (node.getChildren()[0].isEnableClose())) || node.isEnableClose();\n if (renderState.overflowPosition === undefined) {\n renderState.overflowPosition = stickyButtons.length;\n }\n if (stickyButtons.length > 0) {\n if (!node.isEnableTabWrap() && (isTabOverflow || isTabStretch)) {\n buttons = [...stickyButtons, ...buttons];\n }\n else {\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onPointerDown: onInterceptPointerDown, onDragStart: (e) => { e.preventDefault(); }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\n }\n }\n if (!node.isEnableTabWrap()) {\n if (hiddenTabs.length > 0) {\n const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Overflow_Menu_Tooltip);\n let overflowContent;\n if (typeof icons.more === \"function\") {\n const items = hiddenTabs.map(h => { return { index: h, node: node.getChildren()[h] }; });\n overflowContent = icons.more(node, items);\n }\n else {\n overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n icons.more,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\n }\n buttons.splice(Math.min(renderState.overflowPosition, buttons.length), 0, react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"overflowbutton\", \"data-layout-path\": path + \"/button/overflow\", ref: overflowbuttonRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW), title: overflowTitle, onClick: onOverflowClick, onPointerDown: onInterceptPointerDown }, overflowContent));\n }\n }\n if (selectedTabNode !== undefined &&\n layout.isSupportsPopout() &&\n selectedTabNode.isEnablePopout() &&\n selectedTabNode.isEnablePopoutIcon()) {\n const popoutTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Popout_Tab);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"popout\", \"data-layout-path\": path + \"/button/popout\", title: popoutTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT), onClick: onPopoutTab, onPointerDown: onInterceptPointerDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\n }\n if (node.canMaximize()) {\n const minTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Restore);\n const maxTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Maximize);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"max\", \"data-layout-path\": path + \"/button/max\", title: node.isMaximized() ? minTitle : maxTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_ + (node.isMaximized() ? \"max\" : \"min\")), onClick: onMaximizeToggle, onPointerDown: onInterceptPointerDown }, 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() && showClose) {\n const title = isTabStretch ? layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tab) : layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tabset);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: title, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE), onClick: isTabStretch ? onCloseTab : onClose, onPointerDown: onInterceptPointerDown }, (typeof icons.closeTabset === \"function\") ? icons.closeTabset(node) : icons.closeTabset));\n }\n if (node.isActive() && node.isEnableActiveIcon()) {\n const title = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Active_Tabset);\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"active\", \"data-layout-path\": path + \"/button/active\", title: title, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_ICON) }, (typeof icons.activeTabset === \"function\") ? icons.activeTabset(node) : icons.activeTabset));\n }\n const buttonbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"buttonbar\", ref: buttonBarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onPointerDown: onInterceptPointerDown, onDragStart: (e) => { e.preventDefault(); } }, buttons));\n let tabStrip;\n let tabStripClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER);\n if (node.getClassNameTabStrip() !== undefined) {\n tabStripClasses += \" \" + node.getClassNameTabStrip();\n }\n tabStripClasses += \" \" + _Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER_ + node.getTabLocation();\n if (node.isActive()) {\n tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\n }\n if (node.isMaximized()) {\n tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\n }\n if (isTabStretch) {\n const tabNode = node.getChildren()[0];\n if (tabNode.getTabSetClassName() !== undefined) {\n tabStripClasses += \" \" + tabNode.getTabSetClassName();\n }\n }\n if (node.isEnableTabWrap()) {\n if (node.isEnableTabStrip()) {\n tabStrip = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabStripClasses, style: { flexWrap: \"wrap\", gap: \"1px\", marginTop: \"2px\" }, ref: tabStripRef, \"data-layout-path\": path + \"/tabstrip\", onPointerDown: onPointerDown, onDoubleClick: onDoubleClick, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, draggable: true, onDragStart: onDragStart },\n tabs,\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { flexGrow: 1 } }),\n buttonbar));\n }\n }\n else {\n if (node.isEnableTabStrip()) {\n const miniScrollbarClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__MINI_SCROLLBAR) + (node.isEnableTabScrollbar() ? \"\" : \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__MINI_SCROLLBAR_HIDDEN));\n tabStrip = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabStripClasses, ref: tabStripRef, \"data-layout-path\": path + \"/tabstrip\", onPointerDown: onPointerDown, onDoubleClick: onDoubleClick, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, draggable: true, onWheel: onMouseWheel, onDragStart: onDragStart },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: tabStripInnerRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_ + node.getTabLocation()) + \" \" + miniScrollbarClasses, style: { overflowX: 'auto', overflowY: \"hidden\" }, onScroll: onScroll },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { width: (isTabStretch ? \"100%\" : \"none\") }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_ + node.getTabLocation()) }, tabs)),\n buttonbar));\n }\n }\n var emptyTabset;\n if (node.getChildren().length === 0) {\n const placeHolderCallback = layout.getTabSetPlaceHolderCallback();\n if (placeHolderCallback) {\n emptyTabset = placeHolderCallback(node);\n }\n }\n let content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: contentRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_CONTENT) }, emptyTabset);\n if (node.getTabLocation() === \"top\") {\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n tabStrip,\n content);\n }\n else {\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\n content,\n tabStrip);\n }\n let style = {\n flexGrow: Math.max(1, node.getWeight() * 1000),\n minWidth: node.getMinWidth(),\n minHeight: node.getMinHeight(),\n maxWidth: node.getMaxWidth(),\n maxHeight: node.getMaxHeight()\n };\n if (node.getModel().getMaximizedTabset(layout.getWindowId()) !== undefined && !node.isMaximized()) {\n style.display = \"none\";\n }\n // note: tabset container is needed to allow flexbox to size without border/padding/margin\n // then inner tabset can have border/padding/margin for styling\n const tabset = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_CONTAINER), style: style },\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET), \"data-layout-path\": path }, content)));\n if (node.isMaximized()) {\n if (layout.getMainElement()) {\n return (0,react_dom__WEBPACK_IMPORTED_MODULE_9__.createPortal)(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: {\n position: \"absolute\",\n display: \"flex\",\n top: 0, left: 0, bottom: 0, right: 0\n } }, tabset), layout.getMainElement());\n }\n else {\n return tabset;\n }\n }\n else {\n return tabset;\n }\n};\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabSet.tsx?");
480
480
 
481
481
  /***/ }),
482
482
 
@@ -486,7 +486,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
486
486
  \****************************/
487
487
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
488
488
 
489
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ canDockToWindow: () => (/* binding */ canDockToWindow),\n/* harmony export */ copyInlineStyles: () => (/* binding */ copyInlineStyles),\n/* harmony export */ enablePointerOnIFrames: () => (/* binding */ enablePointerOnIFrames),\n/* harmony export */ getElementsByTagName: () => (/* binding */ getElementsByTagName),\n/* harmony export */ getRenderStateEx: () => (/* binding */ getRenderStateEx),\n/* harmony export */ isAuxMouseEvent: () => (/* binding */ isAuxMouseEvent),\n/* harmony export */ isDesktop: () => (/* binding */ isDesktop),\n/* harmony export */ isOnScreen: () => (/* binding */ isOnScreen),\n/* harmony export */ isSafari: () => (/* binding */ isSafari),\n/* harmony export */ keepOnScreen: () => (/* binding */ keepOnScreen),\n/* harmony export */ startDrag: () => (/* binding */ startDrag)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _model_TabNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../model/TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n\n\n\n/** @internal */\nfunction isDesktop() {\n const desktop = typeof window !== \"undefined\" && window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches;\n return desktop;\n}\n/** @internal */\nfunction getRenderStateEx(layout, node, iconAngle) {\n let leadingContent = undefined;\n let titleContent = node.getName();\n let name = node.getName();\n if (iconAngle === undefined) {\n iconAngle = 0;\n }\n if (leadingContent === undefined && node.getIcon() !== undefined) {\n if (iconAngle !== 0) {\n leadingContent = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"img\", { style: { width: \"1em\", height: \"1em\", transform: \"rotate(\" + iconAngle + \"deg)\" }, src: node.getIcon(), alt: \"leadingContent\" });\n }\n else {\n leadingContent = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"img\", { style: { width: \"1em\", height: \"1em\" }, src: node.getIcon(), alt: \"leadingContent\" });\n }\n }\n let buttons = [];\n // allow customization of leading contents (icon) and contents\n const renderState = { leading: leadingContent, content: titleContent, name, buttons };\n layout.customizeTab(node, renderState);\n node.setRenderedName(renderState.name);\n return renderState;\n}\n/** @internal */\nfunction isAuxMouseEvent(event) {\n let auxEvent = false;\n if (event.nativeEvent instanceof MouseEvent) {\n if (event.nativeEvent.button !== 0 || event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) {\n auxEvent = true;\n }\n }\n return auxEvent;\n}\nfunction enablePointerOnIFrames(enable, currentDocument) {\n const iframes = [\n ...getElementsByTagName('iframe', currentDocument),\n ...getElementsByTagName('webview', currentDocument),\n ];\n for (const iframe of iframes) {\n iframe.style.pointerEvents = enable ? 'auto' : 'none';\n }\n}\n;\nfunction getElementsByTagName(tag, currentDocument) {\n return [...currentDocument.getElementsByTagName(tag)];\n}\nfunction startDrag(doc, event, drag, dragEnd, dragCancel) {\n event.preventDefault();\n const pointerMove = (ev) => {\n ev.preventDefault();\n drag(ev.clientX, ev.clientY);\n };\n const pointerCancel = (ev) => {\n ev.preventDefault();\n dragCancel();\n };\n const pointerUp = () => {\n doc.removeEventListener(\"pointermove\", pointerMove);\n doc.removeEventListener(\"pointerup\", pointerUp);\n doc.removeEventListener(\"pointercancel\", pointerCancel);\n dragEnd();\n };\n doc.addEventListener(\"pointermove\", pointerMove);\n doc.addEventListener(\"pointerup\", pointerUp);\n doc.addEventListener('pointercancel', pointerCancel);\n}\nfunction canDockToWindow(node) {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_1__.TabNode) {\n return node.isEnablePopout();\n }\n else if (node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode) {\n for (const child of node.getChildren()) {\n if (child.isEnablePopout() === false) {\n return false;\n }\n }\n return true;\n }\n return false;\n}\nfunction keepOnScreen(rect) {\n rect.snap(10);\n const availableScreenWidth = window.screen.availWidth;\n const availableScreenHeight = window.screen.availHeight;\n if (rect.x + rect.width > availableScreenWidth || rect.y + rect.height > availableScreenHeight) {\n // Adjust the rectangle to fit within the available screen space\n rect.x = Math.max(0, Math.min(rect.x, availableScreenWidth - rect.width));\n rect.y = Math.max(0, Math.min(rect.y, availableScreenHeight - rect.height));\n }\n return rect;\n}\nfunction isOnScreen(rect) {\n const availableScreenWidth = window.screen.availWidth;\n const availableScreenHeight = window.screen.availHeight;\n return (rect.x >= 0 && rect.getRight() <= availableScreenWidth &&\n rect.y >= 0 || rect.getBottom() <= availableScreenHeight);\n}\nfunction copyInlineStyles(source, target) {\n // Get the inline style attribute from the source element\n const sourceStyle = source.getAttribute('style');\n const targetStyle = target.getAttribute('style');\n if (sourceStyle === targetStyle)\n return false;\n // console.log(\"copyInlineStyles\", sourceStyle);\n if (sourceStyle) {\n // Set the style attribute on the target element\n target.setAttribute('style', sourceStyle);\n }\n else {\n // If the source has no inline style, clear the target's style attribute\n target.removeAttribute('style');\n }\n return true;\n}\nfunction isSafari() {\n const userAgent = navigator.userAgent;\n return userAgent.includes(\"Safari\") && !userAgent.includes(\"Chrome\") && !userAgent.includes(\"Chromium\");\n}\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Utils.tsx?");
489
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ canDockToWindow: () => (/* binding */ canDockToWindow),\n/* harmony export */ copyInlineStyles: () => (/* binding */ copyInlineStyles),\n/* harmony export */ enablePointerOnIFrames: () => (/* binding */ enablePointerOnIFrames),\n/* harmony export */ getElementsByTagName: () => (/* binding */ getElementsByTagName),\n/* harmony export */ getRenderStateEx: () => (/* binding */ getRenderStateEx),\n/* harmony export */ isAuxMouseEvent: () => (/* binding */ isAuxMouseEvent),\n/* harmony export */ isDesktop: () => (/* binding */ isDesktop),\n/* harmony export */ isSafari: () => (/* binding */ isSafari),\n/* harmony export */ startDrag: () => (/* binding */ startDrag)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _model_TabNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../model/TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n\n\n\n/** @internal */\nfunction isDesktop() {\n const desktop = typeof window !== \"undefined\" && window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches;\n return desktop;\n}\n/** @internal */\nfunction getRenderStateEx(layout, node, iconAngle) {\n let leadingContent = undefined;\n let titleContent = node.getName();\n let name = node.getName();\n if (iconAngle === undefined) {\n iconAngle = 0;\n }\n if (leadingContent === undefined && node.getIcon() !== undefined) {\n if (iconAngle !== 0) {\n leadingContent = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"img\", { style: { width: \"1em\", height: \"1em\", transform: \"rotate(\" + iconAngle + \"deg)\" }, src: node.getIcon(), alt: \"leadingContent\" });\n }\n else {\n leadingContent = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"img\", { style: { width: \"1em\", height: \"1em\" }, src: node.getIcon(), alt: \"leadingContent\" });\n }\n }\n let buttons = [];\n // allow customization of leading contents (icon) and contents\n const renderState = { leading: leadingContent, content: titleContent, name, buttons };\n layout.customizeTab(node, renderState);\n node.setRenderedName(renderState.name);\n return renderState;\n}\n/** @internal */\nfunction isAuxMouseEvent(event) {\n let auxEvent = false;\n if (event.nativeEvent instanceof MouseEvent) {\n if (event.nativeEvent.button !== 0 || event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) {\n auxEvent = true;\n }\n }\n return auxEvent;\n}\nfunction enablePointerOnIFrames(enable, currentDocument) {\n const iframes = [\n ...getElementsByTagName('iframe', currentDocument),\n ...getElementsByTagName('webview', currentDocument),\n ];\n for (const iframe of iframes) {\n iframe.style.pointerEvents = enable ? 'auto' : 'none';\n }\n}\n;\nfunction getElementsByTagName(tag, currentDocument) {\n return [...currentDocument.getElementsByTagName(tag)];\n}\nfunction startDrag(doc, event, drag, dragEnd, dragCancel) {\n event.preventDefault();\n const pointerMove = (ev) => {\n ev.preventDefault();\n drag(ev.clientX, ev.clientY);\n };\n const pointerCancel = (ev) => {\n ev.preventDefault();\n dragCancel();\n };\n const pointerUp = () => {\n doc.removeEventListener(\"pointermove\", pointerMove);\n doc.removeEventListener(\"pointerup\", pointerUp);\n doc.removeEventListener(\"pointercancel\", pointerCancel);\n dragEnd();\n };\n doc.addEventListener(\"pointermove\", pointerMove);\n doc.addEventListener(\"pointerup\", pointerUp);\n doc.addEventListener('pointercancel', pointerCancel);\n}\nfunction canDockToWindow(node) {\n if (node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_1__.TabNode) {\n return node.isEnablePopout();\n }\n else if (node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_2__.TabSetNode) {\n for (const child of node.getChildren()) {\n if (child.isEnablePopout() === false) {\n return false;\n }\n }\n return true;\n }\n return false;\n}\nfunction copyInlineStyles(source, target) {\n // Get the inline style attribute from the source element\n const sourceStyle = source.getAttribute('style');\n const targetStyle = target.getAttribute('style');\n if (sourceStyle === targetStyle)\n return false;\n // console.log(\"copyInlineStyles\", sourceStyle);\n if (sourceStyle) {\n // Set the style attribute on the target element\n target.setAttribute('style', sourceStyle);\n }\n else {\n // If the source has no inline style, clear the target's style attribute\n target.removeAttribute('style');\n }\n return true;\n}\nfunction isSafari() {\n const userAgent = navigator.userAgent;\n return userAgent.includes(\"Safari\") && !userAgent.includes(\"Chrome\") && !userAgent.includes(\"Chromium\");\n}\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Utils.tsx?");
490
490
 
491
491
  /***/ }),
492
492