flexlayout-react 0.7.9 → 0.7.11
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.
- package/ChangeLog.txt +13 -0
- package/README.md +14 -3
- package/declarations/Types.d.ts +4 -0
- package/declarations/model/IJsonModel.d.ts +3 -0
- package/declarations/model/Model.d.ts +7 -0
- package/declarations/view/Layout.d.ts +1 -0
- package/dist/flexlayout.js +7 -7
- package/dist/flexlayout_min.js +1 -1
- package/lib/Types.js +4 -0
- package/lib/Types.js.map +1 -1
- package/lib/model/Model.js +21 -3
- package/lib/model/Model.js.map +1 -1
- package/lib/view/BorderButton.js +10 -1
- package/lib/view/BorderButton.js.map +1 -1
- package/lib/view/BorderTabSet.js +16 -5
- package/lib/view/BorderTabSet.js.map +1 -1
- package/lib/view/Layout.js +4 -4
- package/lib/view/Layout.js.map +1 -1
- package/lib/view/TabSet.js +6 -4
- package/lib/view/TabSet.js.map +1 -1
- package/lib/view/Utils.js +10 -2
- package/lib/view/Utils.js.map +1 -1
- package/package.json +1 -1
- package/src/Types.ts +5 -0
- package/src/model/IJsonModel.ts +5 -0
- package/src/model/Model.ts +27 -4
- package/src/view/BorderButton.tsx +10 -1
- package/src/view/BorderTabSet.tsx +27 -7
- package/src/view/Layout.tsx +9 -6
- package/src/view/TabSet.tsx +9 -6
- package/src/view/Utils.tsx +10 -2
- package/style/light.css +544 -544
package/dist/flexlayout.js
CHANGED
|
@@ -116,7 +116,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
116
116
|
\**********************/
|
|
117
117
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
118
118
|
|
|
119
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"CLASSES\": () => (/* binding */ CLASSES)\n/* harmony export */ });\nvar CLASSES;\r\n(function (CLASSES) {\r\n CLASSES[\"FLEXLAYOUT__BORDER\"] = \"flexlayout__border\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_\"] = \"flexlayout__border_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON\"] = \"flexlayout__border_button\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_\"] = \"flexlayout__border_button_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_CONTENT\"] = \"flexlayout__border_button_content\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_LEADING\"] = \"flexlayout__border_button_leading\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_TRAILING\"] = \"flexlayout__border_button_trailing\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON__SELECTED\"] = \"flexlayout__border_button--selected\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON__UNSELECTED\"] = \"flexlayout__border_button--unselected\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW\"] = \"flexlayout__border_toolbar_button_overflow\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_\"] = \"flexlayout__border_toolbar_button_overflow_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_INNER\"] = \"flexlayout__border_inner\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_INNER_\"] = \"flexlayout__border_inner_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER\"] = \"flexlayout__border_inner_tab_container\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_\"] = \"flexlayout__border_inner_tab_container_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TAB_DIVIDER\"] = \"flexlayout__border_tab_divider\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_SIZER\"] = \"flexlayout__border_sizer\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR\"] = \"flexlayout__border_toolbar\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_\"] = \"flexlayout__border_toolbar_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON\"] = \"flexlayout__border_toolbar_button\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT\"] = \"flexlayout__border_toolbar_button-float\";\r\n CLASSES[\"FLEXLAYOUT__DRAG_RECT\"] = \"flexlayout__drag_rect\";\r\n CLASSES[\"FLEXLAYOUT__EDGE_RECT\"] = \"flexlayout__edge_rect\";\r\n CLASSES[\"FLEXLAYOUT__ERROR_BOUNDARY_CONTAINER\"] = \"flexlayout__error_boundary_container\";\r\n CLASSES[\"FLEXLAYOUT__ERROR_BOUNDARY_CONTENT\"] = \"flexlayout__error_boundary_content\";\r\n CLASSES[\"FLEXLAYOUT__FLOATING_WINDOW_CONTENT\"] = \"flexlayout__floating_window_content\";\r\n CLASSES[\"FLEXLAYOUT__FLOATING_WINDOW_TAB\"] = \"flexlayout__floating_window_tab\";\r\n CLASSES[\"FLEXLAYOUT__LAYOUT\"] = \"flexlayout__layout\";\r\n CLASSES[\"FLEXLAYOUT__OUTLINE_RECT\"] = \"flexlayout__outline_rect\";\r\n CLASSES[\"FLEXLAYOUT__OUTLINE_RECT_EDGE\"] = \"flexlayout__outline_rect_edge\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER\"] = \"flexlayout__splitter\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER_EXTRA\"] = \"flexlayout__splitter_extra\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER_\"] = \"flexlayout__splitter_\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER_BORDER\"] = \"flexlayout__splitter_border\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER_DRAG\"] = \"flexlayout__splitter_drag\";\r\n CLASSES[\"FLEXLAYOUT__TAB\"] = \"flexlayout__tab\";\r\n CLASSES[\"FLEXLAYOUT__TABSET\"] = \"flexlayout__tabset\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_HEADER\"] = \"flexlayout__tabset_header\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_HEADER_SIZER\"] = \"flexlayout__tabset_header_sizer\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_HEADER_CONTENT\"] = \"flexlayout__tabset_header_content\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_MAXIMIZED\"] = \"flexlayout__tabset-maximized\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_SELECTED\"] = \"flexlayout__tabset-selected\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_SIZER\"] = \"flexlayout__tabset_sizer\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TAB_DIVIDER\"] = \"flexlayout__tabset_tab_divider\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_CONTENT\"] = \"flexlayout__tabset_content\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER\"] = \"flexlayout__tabset_tabbar_inner\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_\"] = \"flexlayout__tabset_tabbar_inner_\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER\"] = \"flexlayout__tabset_tabbar_inner_tab_container\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_\"] = \"flexlayout__tabset_tabbar_inner_tab_container_\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_OUTER\"] = \"flexlayout__tabset_tabbar_outer\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_OUTER_\"] = \"flexlayout__tabset_tabbar_outer_\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BORDER\"] = \"flexlayout__tab_border\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BORDER_\"] = \"flexlayout__tab_border_\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON\"] = \"flexlayout__tab_button\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_CONTENT\"] = \"flexlayout__tab_button_content\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_LEADING\"] = \"flexlayout__tab_button_leading\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_OVERFLOW\"] = \"flexlayout__tab_button_overflow\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT\"] = \"flexlayout__tab_button_overflow_count\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_TEXTBOX\"] = \"flexlayout__tab_button_textbox\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_TRAILING\"] = \"flexlayout__tab_button_trailing\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_STAMP\"] = \"flexlayout__tab_button_stamp\";\r\n CLASSES[\"FLEXLAYOUT__TAB_FLOATING\"] = \"flexlayout__tab_floating\";\r\n CLASSES[\"FLEXLAYOUT__TAB_FLOATING_INNER\"] = \"flexlayout__tab_floating_inner\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR\"] = \"flexlayout__tab_toolbar\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON\"] = \"flexlayout__tab_toolbar_button\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_\"] = \"flexlayout__tab_toolbar_button-\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT\"] = \"flexlayout__tab_toolbar_button-float\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER\"] = \"flexlayout__tab_toolbar_sticky_buttons_container\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE\"] = \"flexlayout__tab_toolbar_button-close\";\r\n CLASSES[\"FLEXLAYOUT__POPUP_MENU_CONTAINER\"] = \"flexlayout__popup_menu_container\";\r\n CLASSES[\"FLEXLAYOUT__POPUP_MENU_ITEM\"] = \"flexlayout__popup_menu_item\";\r\n CLASSES[\"FLEXLAYOUT__POPUP_MENU\"] = \"flexlayout__popup_menu\";\r\n})(CLASSES || (CLASSES = {}));\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/Types.ts?");
|
|
119
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"CLASSES\": () => (/* binding */ CLASSES)\n/* harmony export */ });\nvar CLASSES;\r\n(function (CLASSES) {\r\n CLASSES[\"FLEXLAYOUT__BORDER\"] = \"flexlayout__border\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_\"] = \"flexlayout__border_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON\"] = \"flexlayout__border_button\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_\"] = \"flexlayout__border_button_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_CONTENT\"] = \"flexlayout__border_button_content\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_LEADING\"] = \"flexlayout__border_button_leading\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON_TRAILING\"] = \"flexlayout__border_button_trailing\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON__SELECTED\"] = \"flexlayout__border_button--selected\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_BUTTON__UNSELECTED\"] = \"flexlayout__border_button--unselected\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW\"] = \"flexlayout__border_toolbar_button_overflow\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_\"] = \"flexlayout__border_toolbar_button_overflow_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_INNER\"] = \"flexlayout__border_inner\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_INNER_\"] = \"flexlayout__border_inner_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER\"] = \"flexlayout__border_inner_tab_container\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_\"] = \"flexlayout__border_inner_tab_container_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TAB_DIVIDER\"] = \"flexlayout__border_tab_divider\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_SIZER\"] = \"flexlayout__border_sizer\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR\"] = \"flexlayout__border_toolbar\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_\"] = \"flexlayout__border_toolbar_\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON\"] = \"flexlayout__border_toolbar_button\";\r\n CLASSES[\"FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT\"] = \"flexlayout__border_toolbar_button-float\";\r\n CLASSES[\"FLEXLAYOUT__DRAG_RECT\"] = \"flexlayout__drag_rect\";\r\n CLASSES[\"FLEXLAYOUT__EDGE_RECT\"] = \"flexlayout__edge_rect\";\r\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_TOP\"] = \"flexlayout__edge_rect_top\";\r\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_LEFT\"] = \"flexlayout__edge_rect_left\";\r\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_BOTTOM\"] = \"flexlayout__edge_rect_bottom\";\r\n CLASSES[\"FLEXLAYOUT__EDGE_RECT_RIGHT\"] = \"flexlayout__edge_rect_right\";\r\n CLASSES[\"FLEXLAYOUT__ERROR_BOUNDARY_CONTAINER\"] = \"flexlayout__error_boundary_container\";\r\n CLASSES[\"FLEXLAYOUT__ERROR_BOUNDARY_CONTENT\"] = \"flexlayout__error_boundary_content\";\r\n CLASSES[\"FLEXLAYOUT__FLOATING_WINDOW_CONTENT\"] = \"flexlayout__floating_window_content\";\r\n CLASSES[\"FLEXLAYOUT__FLOATING_WINDOW_TAB\"] = \"flexlayout__floating_window_tab\";\r\n CLASSES[\"FLEXLAYOUT__LAYOUT\"] = \"flexlayout__layout\";\r\n CLASSES[\"FLEXLAYOUT__OUTLINE_RECT\"] = \"flexlayout__outline_rect\";\r\n CLASSES[\"FLEXLAYOUT__OUTLINE_RECT_EDGE\"] = \"flexlayout__outline_rect_edge\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER\"] = \"flexlayout__splitter\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER_EXTRA\"] = \"flexlayout__splitter_extra\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER_\"] = \"flexlayout__splitter_\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER_BORDER\"] = \"flexlayout__splitter_border\";\r\n CLASSES[\"FLEXLAYOUT__SPLITTER_DRAG\"] = \"flexlayout__splitter_drag\";\r\n CLASSES[\"FLEXLAYOUT__TAB\"] = \"flexlayout__tab\";\r\n CLASSES[\"FLEXLAYOUT__TABSET\"] = \"flexlayout__tabset\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_HEADER\"] = \"flexlayout__tabset_header\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_HEADER_SIZER\"] = \"flexlayout__tabset_header_sizer\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_HEADER_CONTENT\"] = \"flexlayout__tabset_header_content\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_MAXIMIZED\"] = \"flexlayout__tabset-maximized\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_SELECTED\"] = \"flexlayout__tabset-selected\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_SIZER\"] = \"flexlayout__tabset_sizer\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TAB_DIVIDER\"] = \"flexlayout__tabset_tab_divider\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_CONTENT\"] = \"flexlayout__tabset_content\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER\"] = \"flexlayout__tabset_tabbar_inner\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_\"] = \"flexlayout__tabset_tabbar_inner_\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER\"] = \"flexlayout__tabset_tabbar_inner_tab_container\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_\"] = \"flexlayout__tabset_tabbar_inner_tab_container_\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_OUTER\"] = \"flexlayout__tabset_tabbar_outer\";\r\n CLASSES[\"FLEXLAYOUT__TABSET_TABBAR_OUTER_\"] = \"flexlayout__tabset_tabbar_outer_\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BORDER\"] = \"flexlayout__tab_border\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BORDER_\"] = \"flexlayout__tab_border_\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON\"] = \"flexlayout__tab_button\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_CONTENT\"] = \"flexlayout__tab_button_content\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_LEADING\"] = \"flexlayout__tab_button_leading\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_OVERFLOW\"] = \"flexlayout__tab_button_overflow\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT\"] = \"flexlayout__tab_button_overflow_count\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_TEXTBOX\"] = \"flexlayout__tab_button_textbox\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_TRAILING\"] = \"flexlayout__tab_button_trailing\";\r\n CLASSES[\"FLEXLAYOUT__TAB_BUTTON_STAMP\"] = \"flexlayout__tab_button_stamp\";\r\n CLASSES[\"FLEXLAYOUT__TAB_FLOATING\"] = \"flexlayout__tab_floating\";\r\n CLASSES[\"FLEXLAYOUT__TAB_FLOATING_INNER\"] = \"flexlayout__tab_floating_inner\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR\"] = \"flexlayout__tab_toolbar\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON\"] = \"flexlayout__tab_toolbar_button\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_\"] = \"flexlayout__tab_toolbar_button-\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT\"] = \"flexlayout__tab_toolbar_button-float\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER\"] = \"flexlayout__tab_toolbar_sticky_buttons_container\";\r\n CLASSES[\"FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE\"] = \"flexlayout__tab_toolbar_button-close\";\r\n CLASSES[\"FLEXLAYOUT__POPUP_MENU_CONTAINER\"] = \"flexlayout__popup_menu_container\";\r\n CLASSES[\"FLEXLAYOUT__POPUP_MENU_ITEM\"] = \"flexlayout__popup_menu_item\";\r\n CLASSES[\"FLEXLAYOUT__POPUP_MENU\"] = \"flexlayout__popup_menu\";\r\n})(CLASSES || (CLASSES = {}));\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/Types.ts?");
|
|
120
120
|
|
|
121
121
|
/***/ }),
|
|
122
122
|
|
|
@@ -216,7 +216,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n\r\n\n\n//# sourceURL=webpack
|
|
|
216
216
|
\****************************/
|
|
217
217
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
218
218
|
|
|
219
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Model\": () => (/* binding */ Model)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Actions__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _BorderSet__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./BorderSet */ \"./src/model/BorderSet.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _TabSetNode__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/**\r\n * Class containing the Tree of Nodes used by the FlexLayout component\r\n */\r\nclass Model {\r\n /**\r\n * Loads the model from the given json object\r\n * @param json the json model to load\r\n * @returns {Model} a new Model object\r\n */\r\n static fromJson(json) {\r\n const model = new Model();\r\n Model._attributeDefinitions.fromJson(json.global, model._attributes);\r\n if (json.borders) {\r\n model._borders = _BorderSet__WEBPACK_IMPORTED_MODULE_7__.BorderSet._fromJson(json.borders, model);\r\n }\r\n model._root = _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode._fromJson(json.layout, model);\r\n model._tidy(); // initial tidy of node tree\r\n return model;\r\n }\r\n /** @internal */\r\n static _createAttributeDefinitions() {\r\n const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\r\n attributeDefinitions.add(\"legacyOverflowMenu\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n // splitter\r\n attributeDefinitions.add(\"splitterSize\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"splitterExtra\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"enableEdgeDock\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"rootOrientationVertical\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"marginInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n .setType(\"IInsets\");\r\n attributeDefinitions.add(\"enableUseVisibility\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n // tab\r\n attributeDefinitions.add(\"tabEnableClose\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabCloseType\", 1).setType(\"ICloseType\");\r\n attributeDefinitions.add(\"tabEnableFloat\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabEnableRename\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"tabIcon\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"tabEnableRenderOnDemand\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabDragSpeed\", 0.3).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabBorderWidth\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabBorderHeight\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n // tabset\r\n attributeDefinitions.add(\"tabSetEnableDeleteWhenEmpty\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableDivide\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableMaximize\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableClose\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetAutoSelectTab\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetClassNameTabStrip\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"tabSetClassNameHeader\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"tabSetEnableTabStrip\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetHeaderHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabSetTabStripHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabSetMarginInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n .setType(\"IInsets\");\r\n attributeDefinitions.add(\"tabSetBorderInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n .setType(\"IInsets\");\r\n attributeDefinitions.add(\"tabSetTabLocation\", \"top\").setType(\"ITabLocation\");\r\n attributeDefinitions.add(\"tabSetMinWidth\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabSetMinHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n // border\r\n attributeDefinitions.add(\"borderSize\", 200).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"borderMinSize\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"borderBarSize\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"borderEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"borderAutoSelectTabWhenOpen\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"borderAutoSelectTabWhenClosed\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"borderClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"borderEnableAutoHide\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n return attributeDefinitions;\r\n }\r\n /**\r\n * 'private' constructor. Use the static method Model.fromJson(json) to create a model\r\n * @internal\r\n */\r\n constructor() {\r\n /** @internal */\r\n this._borderRects = { inner: _Rect__WEBPACK_IMPORTED_MODULE_4__.Rect.empty(), outer: _Rect__WEBPACK_IMPORTED_MODULE_4__.Rect.empty() };\r\n this._attributes = {};\r\n this._idMap = {};\r\n this._borders = new _BorderSet__WEBPACK_IMPORTED_MODULE_7__.BorderSet(this);\r\n this._pointerFine = true;\r\n this._showHiddenBorder = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n }\r\n /** @internal */\r\n _setChangeListener(listener) {\r\n this._changeListener = listener;\r\n }\r\n /**\r\n * Get the currently active tabset node\r\n */\r\n getActiveTabset() {\r\n if (this._activeTabSet && this.getNodeById(this._activeTabSet.getId())) {\r\n return this._activeTabSet;\r\n }\r\n else {\r\n return undefined;\r\n }\r\n }\r\n /** @internal */\r\n _getShowHiddenBorder() {\r\n return this._showHiddenBorder;\r\n }\r\n /** @internal */\r\n _setShowHiddenBorder(location) {\r\n this._showHiddenBorder = location;\r\n }\r\n /** @internal */\r\n _setActiveTabset(tabsetNode) {\r\n this._activeTabSet = tabsetNode;\r\n }\r\n /**\r\n * Get the currently maximized tabset node\r\n */\r\n getMaximizedTabset() {\r\n return this._maximizedTabSet;\r\n }\r\n /** @internal */\r\n _setMaximizedTabset(tabsetNode) {\r\n this._maximizedTabSet = tabsetNode;\r\n }\r\n /**\r\n * Gets the root RowNode of the model\r\n * @returns {RowNode}\r\n */\r\n getRoot() {\r\n return this._root;\r\n }\r\n isRootOrientationVertical() {\r\n return this._attributes.rootOrientationVertical;\r\n }\r\n isUseVisibility() {\r\n return this._attributes.enableUseVisibility;\r\n }\r\n /**\r\n * Gets the\r\n * @returns {BorderSet|*}\r\n */\r\n getBorderSet() {\r\n return this._borders;\r\n }\r\n /** @internal */\r\n _getOuterInnerRects() {\r\n return this._borderRects;\r\n }\r\n /** @internal */\r\n _getPointerFine() {\r\n return this._pointerFine;\r\n }\r\n /** @internal */\r\n _setPointerFine(pointerFine) {\r\n this._pointerFine = pointerFine;\r\n }\r\n /**\r\n * Visits all the nodes in the model and calls the given function for each\r\n * @param fn a function that takes visited node and a integer level as parameters\r\n */\r\n visitNodes(fn) {\r\n this._borders._forEachNode(fn);\r\n this._root._forEachNode(fn, 0);\r\n }\r\n /**\r\n * Gets a node by its id\r\n * @param id the id to find\r\n */\r\n getNodeById(id) {\r\n return this._idMap[id];\r\n }\r\n /**\r\n * Update the node tree by performing the given action,\r\n * Actions should be generated via static methods on the Actions class\r\n * @param action the action to perform\r\n * @returns added Node for Actions.addNode; undefined otherwise\r\n */\r\n doAction(action) {\r\n let returnVal = undefined;\r\n // console.log(action);\r\n switch (action.type) {\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADD_NODE: {\r\n const newNode = new _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode(this, action.data.json, true);\r\n const toNode = this._idMap[action.data.toNode];\r\n if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) {\r\n toNode.drop(newNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\r\n returnVal = newNode;\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.MOVE_NODE: {\r\n const fromNode = this._idMap[action.data.fromNode];\r\n if (fromNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode || fromNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n const toNode = this._idMap[action.data.toNode];\r\n if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) {\r\n toNode.drop(fromNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\r\n }\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.DELETE_TAB: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n node._delete();\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.DELETE_TABSET: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n // first delete all child tabs that are closeable\r\n const children = [...node.getChildren()];\r\n for (let i = 0; i < children.length; i++) {\r\n const child = children[i];\r\n if (child.isEnableClose()) {\r\n child._delete();\r\n }\r\n }\r\n if (node.getChildren().length === 0) {\r\n node._delete();\r\n }\r\n this._tidy();\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.FLOAT_TAB: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n node._setFloating(true);\r\n (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.adjustSelectedIndexAfterFloat)(node);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UNFLOAT_TAB: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n node._setFloating(false);\r\n (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.adjustSelectedIndexAfterDock)(node);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.RENAME_TAB: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n node._setName(action.data.text);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.SELECT_TAB: {\r\n const tabNode = this._idMap[action.data.tabNode];\r\n if (tabNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n const parent = tabNode.getParent();\r\n const pos = parent.getChildren().indexOf(tabNode);\r\n if (parent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode) {\r\n if (parent.getSelected() === pos) {\r\n parent._setSelected(-1);\r\n }\r\n else {\r\n parent._setSelected(pos);\r\n }\r\n }\r\n else if (parent instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n if (parent.getSelected() !== pos) {\r\n parent._setSelected(pos);\r\n }\r\n this._activeTabSet = parent;\r\n }\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.SET_ACTIVE_TABSET: {\r\n const tabsetNode = this._idMap[action.data.tabsetNode];\r\n if (tabsetNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n this._activeTabSet = tabsetNode;\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADJUST_SPLIT: {\r\n const node1 = this._idMap[action.data.node1];\r\n const node2 = this._idMap[action.data.node2];\r\n if ((node1 instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || node1 instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) && (node2 instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || node2 instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode)) {\r\n this._adjustSplitSide(node1, action.data.weight1, action.data.pixelWidth1);\r\n this._adjustSplitSide(node2, action.data.weight2, action.data.pixelWidth2);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADJUST_BORDER_SPLIT: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode) {\r\n node._setSize(action.data.pos);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.MAXIMIZE_TOGGLE: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n if (node === this._maximizedTabSet) {\r\n this._maximizedTabSet = undefined;\r\n }\r\n else {\r\n this._maximizedTabSet = node;\r\n this._activeTabSet = node;\r\n }\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UPDATE_MODEL_ATTRIBUTES: {\r\n this._updateAttrs(action.data.json);\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UPDATE_NODE_ATTRIBUTES: {\r\n const node = this._idMap[action.data.node];\r\n node._updateAttrs(action.data.json);\r\n break;\r\n }\r\n default:\r\n break;\r\n }\r\n this._updateIdMap();\r\n if (this._changeListener !== undefined) {\r\n this._changeListener(action);\r\n }\r\n return returnVal;\r\n }\r\n /** @internal */\r\n _updateIdMap() {\r\n // regenerate idMap to stop it building up\r\n this._idMap = {};\r\n this.visitNodes((node) => (this._idMap[node.getId()] = node));\r\n // console.log(JSON.stringify(Object.keys(this._idMap)));\r\n }\r\n /** @internal */\r\n _adjustSplitSide(node, weight, pixels) {\r\n node._setWeight(weight);\r\n if (node.getWidth() != null && node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.VERT) {\r\n node._updateAttrs({ width: pixels });\r\n }\r\n else if (node.getHeight() != null && node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\r\n node._updateAttrs({ height: pixels });\r\n }\r\n }\r\n /**\r\n * Converts the model to a json object\r\n * @returns {IJsonModel} json object that represents this model\r\n */\r\n toJson() {\r\n const global = {};\r\n Model._attributeDefinitions.toJson(global, this._attributes);\r\n // save state of nodes\r\n this.visitNodes((node) => {\r\n node._fireEvent(\"save\", undefined);\r\n });\r\n return { global, borders: this._borders._toJson(), layout: this._root.toJson() };\r\n }\r\n getSplitterSize() {\r\n let splitterSize = this._attributes.splitterSize;\r\n if (splitterSize === -1) {\r\n // use defaults\r\n splitterSize = this._pointerFine ? 8 : 12; // larger for mobile\r\n }\r\n return splitterSize;\r\n }\r\n isLegacyOverflowMenu() {\r\n return this._attributes.legacyOverflowMenu;\r\n }\r\n getSplitterExtra() {\r\n return this._attributes.splitterExtra;\r\n }\r\n isEnableEdgeDock() {\r\n return this._attributes.enableEdgeDock;\r\n }\r\n /** @internal */\r\n _addNode(node) {\r\n const id = node.getId();\r\n if (this._idMap[id] !== undefined) {\r\n throw new Error(`Error: each node must have a unique id, duplicate id:${node.getId()}`);\r\n }\r\n if (node.getType() !== \"splitter\") {\r\n this._idMap[id] = node;\r\n }\r\n }\r\n /** @internal */\r\n _layout(rect, metrics) {\r\n var _a;\r\n // let start = Date.now();\r\n this._borderRects = this._borders._layoutBorder({ outer: rect, inner: rect }, metrics);\r\n rect = this._borderRects.inner.removeInsets(this._getAttribute(\"marginInsets\"));\r\n (_a = this._root) === null || _a === void 0 ? void 0 : _a.calcMinSize();\r\n this._root._layout(rect, metrics);\r\n // console.log(\"layout time: \" + (Date.now() - start));\r\n return rect;\r\n }\r\n /** @internal */\r\n _findDropTargetNode(dragNode, x, y) {\r\n let node = this._root._findDropTargetNode(dragNode, x, y);\r\n if (node === undefined) {\r\n node = this._borders._findDropTargetNode(dragNode, x, y);\r\n }\r\n return node;\r\n }\r\n /** @internal */\r\n _tidy() {\r\n // console.log(\"before _tidy\", this.toString());\r\n this._root._tidy();\r\n // console.log(\"after _tidy\", this.toString());\r\n }\r\n /** @internal */\r\n _updateAttrs(json) {\r\n Model._attributeDefinitions.update(json, this._attributes);\r\n }\r\n /** @internal */\r\n _nextUniqueId() {\r\n return '#' + (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.randomUUID)();\r\n }\r\n /** @internal */\r\n _getAttribute(name) {\r\n return this._attributes[name];\r\n }\r\n /**\r\n * Sets a function to allow/deny dropping a node\r\n * @param onAllowDrop function that takes the drag node and DropInfo and returns true if the drop is allowed\r\n */\r\n setOnAllowDrop(onAllowDrop) {\r\n this._onAllowDrop = onAllowDrop;\r\n }\r\n /** @internal */\r\n _getOnAllowDrop() {\r\n return this._onAllowDrop;\r\n }\r\n /**\r\n * set callback called when a new TabSet is created.\r\n * The tabNode can be undefined if it's the auto created first tabset in the root row (when the last\r\n * tab is deleted, the root tabset can be recreated)\r\n * @param onCreateTabSet\r\n */\r\n setOnCreateTabSet(onCreateTabSet) {\r\n this._onCreateTabSet = onCreateTabSet;\r\n }\r\n /** @internal */\r\n _getOnCreateTabSet() {\r\n return this._onCreateTabSet;\r\n }\r\n static toTypescriptInterfaces() {\r\n console.log(Model._attributeDefinitions.toTypescriptInterface(\"Global\", undefined));\r\n console.log(_RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode.getAttributeDefinitions().toTypescriptInterface(\"Row\", Model._attributeDefinitions));\r\n console.log(_TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode.getAttributeDefinitions().toTypescriptInterface(\"TabSet\", Model._attributeDefinitions));\r\n console.log(_TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode.getAttributeDefinitions().toTypescriptInterface(\"Tab\", Model._attributeDefinitions));\r\n console.log(_BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode.getAttributeDefinitions().toTypescriptInterface(\"Border\", Model._attributeDefinitions));\r\n }\r\n toString() {\r\n return JSON.stringify(this.toJson());\r\n }\r\n}\r\n/** @internal */\r\nModel._attributeDefinitions = Model._createAttributeDefinitions();\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Model.ts?");
|
|
219
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Model\": () => (/* binding */ Model)\n/* harmony export */ });\n/* harmony import */ var _Attribute__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Attribute */ \"./src/Attribute.ts\");\n/* harmony import */ var _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../AttributeDefinitions */ \"./src/AttributeDefinitions.ts\");\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Actions__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _BorderNode__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _BorderSet__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./BorderSet */ \"./src/model/BorderSet.ts\");\n/* harmony import */ var _RowNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./RowNode */ \"./src/model/RowNode.ts\");\n/* harmony import */ var _TabNode__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _TabSetNode__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Utils */ \"./src/model/Utils.ts\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/**\r\n * Class containing the Tree of Nodes used by the FlexLayout component\r\n */\r\nclass Model {\r\n /**\r\n * Loads the model from the given json object\r\n * @param json the json model to load\r\n * @returns {Model} a new Model object\r\n */\r\n static fromJson(json) {\r\n const model = new Model();\r\n Model._attributeDefinitions.fromJson(json.global, model._attributes);\r\n if (json.borders) {\r\n model._borders = _BorderSet__WEBPACK_IMPORTED_MODULE_7__.BorderSet._fromJson(json.borders, model);\r\n }\r\n model._root = _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode._fromJson(json.layout, model);\r\n model._tidy(); // initial tidy of node tree\r\n return model;\r\n }\r\n /** @internal */\r\n static _createAttributeDefinitions() {\r\n const attributeDefinitions = new _AttributeDefinitions__WEBPACK_IMPORTED_MODULE_1__.AttributeDefinitions();\r\n attributeDefinitions.add(\"legacyOverflowMenu\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"enableEdgeDock\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"rootOrientationVertical\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"marginInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n .setType(\"IInsets\");\r\n attributeDefinitions.add(\"enableUseVisibility\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"enableRotateBorderIcons\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n // splitter\r\n attributeDefinitions.add(\"splitterSize\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"splitterExtra\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n // tab\r\n attributeDefinitions.add(\"tabEnableClose\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabCloseType\", 1).setType(\"ICloseType\");\r\n attributeDefinitions.add(\"tabEnableFloat\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabEnableRename\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"tabIcon\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"tabEnableRenderOnDemand\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabDragSpeed\", 0.3).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabBorderWidth\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabBorderHeight\", -1).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n // tabset\r\n attributeDefinitions.add(\"tabSetEnableDeleteWhenEmpty\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableDrag\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableDivide\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableMaximize\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetEnableClose\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetAutoSelectTab\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetClassNameTabStrip\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"tabSetClassNameHeader\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"tabSetEnableTabStrip\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"tabSetHeaderHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabSetTabStripHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabSetMarginInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n .setType(\"IInsets\");\r\n attributeDefinitions.add(\"tabSetBorderInsets\", { top: 0, right: 0, bottom: 0, left: 0 })\r\n .setType(\"IInsets\");\r\n attributeDefinitions.add(\"tabSetTabLocation\", \"top\").setType(\"ITabLocation\");\r\n attributeDefinitions.add(\"tabSetMinWidth\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"tabSetMinHeight\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n // border\r\n attributeDefinitions.add(\"borderSize\", 200).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"borderMinSize\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"borderBarSize\", 0).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.NUMBER);\r\n attributeDefinitions.add(\"borderEnableDrop\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"borderAutoSelectTabWhenOpen\", true).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"borderAutoSelectTabWhenClosed\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n attributeDefinitions.add(\"borderClassName\", undefined).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.STRING);\r\n attributeDefinitions.add(\"borderEnableAutoHide\", false).setType(_Attribute__WEBPACK_IMPORTED_MODULE_0__.Attribute.BOOLEAN);\r\n return attributeDefinitions;\r\n }\r\n /**\r\n * 'private' constructor. Use the static method Model.fromJson(json) to create a model\r\n * @internal\r\n */\r\n constructor() {\r\n /** @internal */\r\n this._borderRects = { inner: _Rect__WEBPACK_IMPORTED_MODULE_4__.Rect.empty(), outer: _Rect__WEBPACK_IMPORTED_MODULE_4__.Rect.empty() };\r\n this._attributes = {};\r\n this._idMap = {};\r\n this._borders = new _BorderSet__WEBPACK_IMPORTED_MODULE_7__.BorderSet(this);\r\n this._pointerFine = true;\r\n this._showHiddenBorder = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n }\r\n /** @internal */\r\n _setChangeListener(listener) {\r\n this._changeListener = listener;\r\n }\r\n /**\r\n * Get the currently active tabset node\r\n */\r\n getActiveTabset() {\r\n if (this._activeTabSet && this.getNodeById(this._activeTabSet.getId())) {\r\n return this._activeTabSet;\r\n }\r\n else {\r\n return undefined;\r\n }\r\n }\r\n /** @internal */\r\n _getShowHiddenBorder() {\r\n return this._showHiddenBorder;\r\n }\r\n /** @internal */\r\n _setShowHiddenBorder(location) {\r\n this._showHiddenBorder = location;\r\n }\r\n /** @internal */\r\n _setActiveTabset(tabsetNode) {\r\n this._activeTabSet = tabsetNode;\r\n }\r\n /**\r\n * Get the currently maximized tabset node\r\n */\r\n getMaximizedTabset() {\r\n return this._maximizedTabSet;\r\n }\r\n /** @internal */\r\n _setMaximizedTabset(tabsetNode) {\r\n this._maximizedTabSet = tabsetNode;\r\n }\r\n /**\r\n * Gets the root RowNode of the model\r\n * @returns {RowNode}\r\n */\r\n getRoot() {\r\n return this._root;\r\n }\r\n isRootOrientationVertical() {\r\n return this._attributes.rootOrientationVertical;\r\n }\r\n isUseVisibility() {\r\n return this._attributes.enableUseVisibility;\r\n }\r\n isEnableRotateBorderIcons() {\r\n return this._attributes.enableRotateBorderIcons;\r\n }\r\n /**\r\n * Gets the\r\n * @returns {BorderSet|*}\r\n */\r\n getBorderSet() {\r\n return this._borders;\r\n }\r\n /** @internal */\r\n _getOuterInnerRects() {\r\n return this._borderRects;\r\n }\r\n /** @internal */\r\n _getPointerFine() {\r\n return this._pointerFine;\r\n }\r\n /** @internal */\r\n _setPointerFine(pointerFine) {\r\n this._pointerFine = pointerFine;\r\n }\r\n /**\r\n * Visits all the nodes in the model and calls the given function for each\r\n * @param fn a function that takes visited node and a integer level as parameters\r\n */\r\n visitNodes(fn) {\r\n this._borders._forEachNode(fn);\r\n this._root._forEachNode(fn, 0);\r\n }\r\n /**\r\n * Gets a node by its id\r\n * @param id the id to find\r\n */\r\n getNodeById(id) {\r\n return this._idMap[id];\r\n }\r\n /**\r\n * Finds the first/top left tab set of the given node.\r\n * @param node The top node you want to begin searching from, deafults to the root node\r\n * @returns The first Tab Set\r\n */\r\n getFirstTabSet(node = this._root) {\r\n const child = node.getChildren()[0];\r\n if (child instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n return child;\r\n }\r\n else {\r\n return this.getFirstTabSet(child);\r\n }\r\n }\r\n /**\r\n * Update the node tree by performing the given action,\r\n * Actions should be generated via static methods on the Actions class\r\n * @param action the action to perform\r\n * @returns added Node for Actions.addNode; undefined otherwise\r\n */\r\n doAction(action) {\r\n let returnVal = undefined;\r\n // console.log(action);\r\n switch (action.type) {\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADD_NODE: {\r\n const newNode = new _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode(this, action.data.json, true);\r\n const toNode = this._idMap[action.data.toNode];\r\n if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) {\r\n toNode.drop(newNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\r\n returnVal = newNode;\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.MOVE_NODE: {\r\n const fromNode = this._idMap[action.data.fromNode];\r\n if (fromNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode || fromNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n const toNode = this._idMap[action.data.toNode];\r\n if (toNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || toNode instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode || toNode instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) {\r\n toNode.drop(fromNode, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.getByName(action.data.location), action.data.index, action.data.select);\r\n }\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.DELETE_TAB: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n node._delete();\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.DELETE_TABSET: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n // first delete all child tabs that are closeable\r\n const children = [...node.getChildren()];\r\n for (let i = 0; i < children.length; i++) {\r\n const child = children[i];\r\n if (child.isEnableClose()) {\r\n child._delete();\r\n }\r\n }\r\n if (node.getChildren().length === 0) {\r\n node._delete();\r\n }\r\n this._tidy();\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.FLOAT_TAB: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n node._setFloating(true);\r\n (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.adjustSelectedIndexAfterFloat)(node);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UNFLOAT_TAB: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n node._setFloating(false);\r\n (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.adjustSelectedIndexAfterDock)(node);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.RENAME_TAB: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n node._setName(action.data.text);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.SELECT_TAB: {\r\n const tabNode = this._idMap[action.data.tabNode];\r\n if (tabNode instanceof _TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode) {\r\n const parent = tabNode.getParent();\r\n const pos = parent.getChildren().indexOf(tabNode);\r\n if (parent instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode) {\r\n if (parent.getSelected() === pos) {\r\n parent._setSelected(-1);\r\n }\r\n else {\r\n parent._setSelected(pos);\r\n }\r\n }\r\n else if (parent instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n if (parent.getSelected() !== pos) {\r\n parent._setSelected(pos);\r\n }\r\n this._activeTabSet = parent;\r\n }\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.SET_ACTIVE_TABSET: {\r\n const tabsetNode = this._idMap[action.data.tabsetNode];\r\n if (tabsetNode instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n this._activeTabSet = tabsetNode;\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADJUST_SPLIT: {\r\n const node1 = this._idMap[action.data.node1];\r\n const node2 = this._idMap[action.data.node2];\r\n if ((node1 instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || node1 instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode) && (node2 instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode || node2 instanceof _RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode)) {\r\n this._adjustSplitSide(node1, action.data.weight1, action.data.pixelWidth1);\r\n this._adjustSplitSide(node2, action.data.weight2, action.data.pixelWidth2);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.ADJUST_BORDER_SPLIT: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode) {\r\n node._setSize(action.data.pos);\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.MAXIMIZE_TOGGLE: {\r\n const node = this._idMap[action.data.node];\r\n if (node instanceof _TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode) {\r\n if (node === this._maximizedTabSet) {\r\n this._maximizedTabSet = undefined;\r\n }\r\n else {\r\n this._maximizedTabSet = node;\r\n this._activeTabSet = node;\r\n }\r\n }\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UPDATE_MODEL_ATTRIBUTES: {\r\n this._updateAttrs(action.data.json);\r\n break;\r\n }\r\n case _Actions__WEBPACK_IMPORTED_MODULE_5__.Actions.UPDATE_NODE_ATTRIBUTES: {\r\n const node = this._idMap[action.data.node];\r\n node._updateAttrs(action.data.json);\r\n break;\r\n }\r\n default:\r\n break;\r\n }\r\n this._updateIdMap();\r\n if (this._changeListener !== undefined) {\r\n this._changeListener(action);\r\n }\r\n return returnVal;\r\n }\r\n /** @internal */\r\n _updateIdMap() {\r\n // regenerate idMap to stop it building up\r\n this._idMap = {};\r\n this.visitNodes((node) => (this._idMap[node.getId()] = node));\r\n // console.log(JSON.stringify(Object.keys(this._idMap)));\r\n }\r\n /** @internal */\r\n _adjustSplitSide(node, weight, pixels) {\r\n node._setWeight(weight);\r\n if (node.getWidth() != null && node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.VERT) {\r\n node._updateAttrs({ width: pixels });\r\n }\r\n else if (node.getHeight() != null && node.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_3__.Orientation.HORZ) {\r\n node._updateAttrs({ height: pixels });\r\n }\r\n }\r\n /**\r\n * Converts the model to a json object\r\n * @returns {IJsonModel} json object that represents this model\r\n */\r\n toJson() {\r\n const global = {};\r\n Model._attributeDefinitions.toJson(global, this._attributes);\r\n // save state of nodes\r\n this.visitNodes((node) => {\r\n node._fireEvent(\"save\", undefined);\r\n });\r\n return { global, borders: this._borders._toJson(), layout: this._root.toJson() };\r\n }\r\n getSplitterSize() {\r\n let splitterSize = this._attributes.splitterSize;\r\n if (splitterSize === -1) {\r\n // use defaults\r\n splitterSize = this._pointerFine ? 8 : 12; // larger for mobile\r\n }\r\n return splitterSize;\r\n }\r\n isLegacyOverflowMenu() {\r\n return this._attributes.legacyOverflowMenu;\r\n }\r\n getSplitterExtra() {\r\n return this._attributes.splitterExtra;\r\n }\r\n isEnableEdgeDock() {\r\n return this._attributes.enableEdgeDock;\r\n }\r\n /** @internal */\r\n _addNode(node) {\r\n const id = node.getId();\r\n if (this._idMap[id] !== undefined) {\r\n throw new Error(`Error: each node must have a unique id, duplicate id:${node.getId()}`);\r\n }\r\n if (node.getType() !== \"splitter\") {\r\n this._idMap[id] = node;\r\n }\r\n }\r\n /** @internal */\r\n _layout(rect, metrics) {\r\n var _a;\r\n // let start = Date.now();\r\n this._borderRects = this._borders._layoutBorder({ outer: rect, inner: rect }, metrics);\r\n rect = this._borderRects.inner.removeInsets(this._getAttribute(\"marginInsets\"));\r\n (_a = this._root) === null || _a === void 0 ? void 0 : _a.calcMinSize();\r\n this._root._layout(rect, metrics);\r\n // console.log(\"layout time: \" + (Date.now() - start));\r\n return rect;\r\n }\r\n /** @internal */\r\n _findDropTargetNode(dragNode, x, y) {\r\n let node = this._root._findDropTargetNode(dragNode, x, y);\r\n if (node === undefined) {\r\n node = this._borders._findDropTargetNode(dragNode, x, y);\r\n }\r\n return node;\r\n }\r\n /** @internal */\r\n _tidy() {\r\n // console.log(\"before _tidy\", this.toString());\r\n this._root._tidy();\r\n // console.log(\"after _tidy\", this.toString());\r\n }\r\n /** @internal */\r\n _updateAttrs(json) {\r\n Model._attributeDefinitions.update(json, this._attributes);\r\n }\r\n /** @internal */\r\n _nextUniqueId() {\r\n return '#' + (0,_Utils__WEBPACK_IMPORTED_MODULE_11__.randomUUID)();\r\n }\r\n /** @internal */\r\n _getAttribute(name) {\r\n return this._attributes[name];\r\n }\r\n /**\r\n * Sets a function to allow/deny dropping a node\r\n * @param onAllowDrop function that takes the drag node and DropInfo and returns true if the drop is allowed\r\n */\r\n setOnAllowDrop(onAllowDrop) {\r\n this._onAllowDrop = onAllowDrop;\r\n }\r\n /** @internal */\r\n _getOnAllowDrop() {\r\n return this._onAllowDrop;\r\n }\r\n /**\r\n * set callback called when a new TabSet is created.\r\n * The tabNode can be undefined if it's the auto created first tabset in the root row (when the last\r\n * tab is deleted, the root tabset can be recreated)\r\n * @param onCreateTabSet\r\n */\r\n setOnCreateTabSet(onCreateTabSet) {\r\n this._onCreateTabSet = onCreateTabSet;\r\n }\r\n /** @internal */\r\n _getOnCreateTabSet() {\r\n return this._onCreateTabSet;\r\n }\r\n static toTypescriptInterfaces() {\r\n console.log(Model._attributeDefinitions.toTypescriptInterface(\"Global\", undefined));\r\n console.log(_RowNode__WEBPACK_IMPORTED_MODULE_8__.RowNode.getAttributeDefinitions().toTypescriptInterface(\"Row\", Model._attributeDefinitions));\r\n console.log(_TabSetNode__WEBPACK_IMPORTED_MODULE_10__.TabSetNode.getAttributeDefinitions().toTypescriptInterface(\"TabSet\", Model._attributeDefinitions));\r\n console.log(_TabNode__WEBPACK_IMPORTED_MODULE_9__.TabNode.getAttributeDefinitions().toTypescriptInterface(\"Tab\", Model._attributeDefinitions));\r\n console.log(_BorderNode__WEBPACK_IMPORTED_MODULE_6__.BorderNode.getAttributeDefinitions().toTypescriptInterface(\"Border\", Model._attributeDefinitions));\r\n }\r\n toString() {\r\n return JSON.stringify(this.toJson());\r\n }\r\n}\r\n/** @internal */\r\nModel._attributeDefinitions = Model._createAttributeDefinitions();\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/model/Model.ts?");
|
|
220
220
|
|
|
221
221
|
/***/ }),
|
|
222
222
|
|
|
@@ -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 */ \"BorderButton\": () => (/* binding */ BorderButton)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/ICloseType */ \"./src/model/ICloseType.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst BorderButton = (props) => {\r\n const { layout, node, selected, border, iconFactory, titleFactory, icons, path } = props;\r\n const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const contentRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const onMouseDown = (event) => {\r\n if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isAuxMouseEvent)(event) && !layout.getEditingTab()) {\r\n layout.dragStart(event, undefined, node, node.isEnableDrag(), onClick, onDoubleClick);\r\n }\r\n };\r\n const onAuxMouseClick = (event) => {\r\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isAuxMouseEvent)(event)) {\r\n layout.auxMouseClick(node, event);\r\n }\r\n };\r\n const onContextMenu = (event) => {\r\n layout.showContextMenu(node, event);\r\n };\r\n const onClick = () => {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(node.getId()));\r\n };\r\n const onDoubleClick = (event) => {\r\n // if (node.isEnableRename()) {\r\n // onRename();\r\n // }\r\n };\r\n // const onRename = () => {\r\n // layout.setEditingTab(node);\r\n // layout.getCurrentDocument()!.body.addEventListener(\"mousedown\", onEndEdit);\r\n // layout.getCurrentDocument()!.body.addEventListener(\"touchstart\", onEndEdit);\r\n // };\r\n const onEndEdit = (event) => {\r\n if (event.target !== contentRef.current) {\r\n layout.getCurrentDocument().body.removeEventListener(\"mousedown\", onEndEdit);\r\n layout.getCurrentDocument().body.removeEventListener(\"touchstart\", onEndEdit);\r\n layout.setEditingTab(undefined);\r\n }\r\n };\r\n const isClosable = () => {\r\n const closeType = node.getCloseType();\r\n if (selected || closeType === _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__.ICloseType.Always) {\r\n return true;\r\n }\r\n if (closeType === _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__.ICloseType.Visible) {\r\n // not selected but x should be visible due to hover\r\n if (window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches) {\r\n return true;\r\n }\r\n }\r\n return false;\r\n };\r\n const onClose = (event) => {\r\n if (isClosable()) {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTab(node.getId()));\r\n }\r\n else {\r\n onClick();\r\n }\r\n };\r\n const onCloseMouseDown = (event) => {\r\n event.stopPropagation();\r\n };\r\n react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\r\n updateRect();\r\n if (layout.getEditingTab() === node) {\r\n contentRef.current.select();\r\n }\r\n });\r\n const updateRect = () => {\r\n // record position of tab in node\r\n const layoutRect = layout.getDomRect();\r\n const r = selfRef.current.getBoundingClientRect();\r\n node._setTabRect(new _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect(r.left - layoutRect.left, r.top - layoutRect.top, r.width, r.height));\r\n };\r\n const onTextBoxMouseDown = (event) => {\r\n // console.log(\"onTextBoxMouseDown\");\r\n event.stopPropagation();\r\n };\r\n const onTextBoxKeyPress = (event) => {\r\n // console.log(event, event.keyCode);\r\n if (event.keyCode === 27) {\r\n // esc\r\n layout.setEditingTab(undefined);\r\n }\r\n else if (event.keyCode === 13) {\r\n // enter\r\n layout.setEditingTab(undefined);\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.renameTab(node.getId(), event.target.value));\r\n }\r\n };\r\n const cm = layout.getClassName;\r\n let classNames = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_ + border);\r\n if (selected) {\r\n classNames += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON__SELECTED);\r\n }\r\n else {\r\n classNames += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON__UNSELECTED);\r\n }\r\n if (node.getClassName() !== undefined) {\r\n classNames += \" \" + node.getClassName();\r\n }\r\n const renderState = (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.getRenderStateEx)(layout, node, iconFactory, titleFactory);\r\n let content = renderState.content ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_CONTENT) }, renderState.content)) : null;\r\n const leading = renderState.leading ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_LEADING) }, renderState.leading)) : null;\r\n if (layout.getEditingTab() === node) {\r\n content = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"input\", { ref: contentRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__TAB_BUTTON_TEXTBOX), \"data-layout-path\": path + \"/textbox\", type: \"text\", autoFocus: true, defaultValue: node.getName(), onKeyDown: onTextBoxKeyPress, onMouseDown: onTextBoxMouseDown, onTouchStart: onTextBoxMouseDown }));\r\n }\r\n if (node.isEnableClose()) {\r\n const closeTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tab);\r\n renderState.buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: closeTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_TRAILING), onMouseDown: onCloseMouseDown, onClick: onClose, onTouchStart: onCloseMouseDown }, (typeof icons.close === \"function\") ? icons.close(node) : icons.close));\r\n }\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, \"data-layout-path\": path, className: classNames, onMouseDown: onMouseDown, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onTouchStart: onMouseDown, title: node.getHelpText() },\r\n leading,\r\n content,\r\n renderState.buttons));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderButton.tsx?");
|
|
289
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"BorderButton\": () => (/* binding */ BorderButton)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/ICloseType */ \"./src/model/ICloseType.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst BorderButton = (props) => {\r\n const { layout, node, selected, border, iconFactory, titleFactory, icons, path } = props;\r\n const selfRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const contentRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const onMouseDown = (event) => {\r\n if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isAuxMouseEvent)(event) && !layout.getEditingTab()) {\r\n layout.dragStart(event, undefined, node, node.isEnableDrag(), onClick, onDoubleClick);\r\n }\r\n };\r\n const onAuxMouseClick = (event) => {\r\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_6__.isAuxMouseEvent)(event)) {\r\n layout.auxMouseClick(node, event);\r\n }\r\n };\r\n const onContextMenu = (event) => {\r\n layout.showContextMenu(node, event);\r\n };\r\n const onClick = () => {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(node.getId()));\r\n };\r\n const onDoubleClick = (event) => {\r\n // if (node.isEnableRename()) {\r\n // onRename();\r\n // }\r\n };\r\n // const onRename = () => {\r\n // layout.setEditingTab(node);\r\n // layout.getCurrentDocument()!.body.addEventListener(\"mousedown\", onEndEdit);\r\n // layout.getCurrentDocument()!.body.addEventListener(\"touchstart\", onEndEdit);\r\n // };\r\n const onEndEdit = (event) => {\r\n if (event.target !== contentRef.current) {\r\n layout.getCurrentDocument().body.removeEventListener(\"mousedown\", onEndEdit);\r\n layout.getCurrentDocument().body.removeEventListener(\"touchstart\", onEndEdit);\r\n layout.setEditingTab(undefined);\r\n }\r\n };\r\n const isClosable = () => {\r\n const closeType = node.getCloseType();\r\n if (selected || closeType === _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__.ICloseType.Always) {\r\n return true;\r\n }\r\n if (closeType === _model_ICloseType__WEBPACK_IMPORTED_MODULE_4__.ICloseType.Visible) {\r\n // not selected but x should be visible due to hover\r\n if (window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches) {\r\n return true;\r\n }\r\n }\r\n return false;\r\n };\r\n const onClose = (event) => {\r\n if (isClosable()) {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTab(node.getId()));\r\n }\r\n else {\r\n onClick();\r\n }\r\n };\r\n const onCloseMouseDown = (event) => {\r\n event.stopPropagation();\r\n };\r\n react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => {\r\n updateRect();\r\n if (layout.getEditingTab() === node) {\r\n contentRef.current.select();\r\n }\r\n });\r\n const updateRect = () => {\r\n // record position of tab in node\r\n const layoutRect = layout.getDomRect();\r\n const r = selfRef.current.getBoundingClientRect();\r\n node._setTabRect(new _Rect__WEBPACK_IMPORTED_MODULE_3__.Rect(r.left - layoutRect.left, r.top - layoutRect.top, r.width, r.height));\r\n };\r\n const onTextBoxMouseDown = (event) => {\r\n // console.log(\"onTextBoxMouseDown\");\r\n event.stopPropagation();\r\n };\r\n const onTextBoxKeyPress = (event) => {\r\n // console.log(event, event.keyCode);\r\n if (event.keyCode === 27) {\r\n // esc\r\n layout.setEditingTab(undefined);\r\n }\r\n else if (event.keyCode === 13) {\r\n // enter\r\n layout.setEditingTab(undefined);\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.renameTab(node.getId(), event.target.value));\r\n }\r\n };\r\n const cm = layout.getClassName;\r\n let classNames = cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_ + border);\r\n if (selected) {\r\n classNames += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON__SELECTED);\r\n }\r\n else {\r\n classNames += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON__UNSELECTED);\r\n }\r\n if (node.getClassName() !== undefined) {\r\n classNames += \" \" + node.getClassName();\r\n }\r\n let iconAngle = 0;\r\n if (node.getModel().isEnableRotateBorderIcons() === false) {\r\n if (border === \"left\") {\r\n iconAngle = 90;\r\n }\r\n else if (border === \"right\") {\r\n iconAngle = -90;\r\n }\r\n }\r\n const renderState = (0,_Utils__WEBPACK_IMPORTED_MODULE_6__.getRenderStateEx)(layout, node, iconFactory, titleFactory, iconAngle);\r\n let content = renderState.content ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_CONTENT) }, renderState.content)) : null;\r\n const leading = renderState.leading ? (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_LEADING) }, renderState.leading)) : null;\r\n if (layout.getEditingTab() === node) {\r\n content = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"input\", { ref: contentRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__TAB_BUTTON_TEXTBOX), \"data-layout-path\": path + \"/textbox\", type: \"text\", autoFocus: true, defaultValue: node.getName(), onKeyDown: onTextBoxKeyPress, onMouseDown: onTextBoxMouseDown, onTouchStart: onTextBoxMouseDown }));\r\n }\r\n if (node.isEnableClose()) {\r\n const closeTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tab);\r\n renderState.buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: closeTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_5__.CLASSES.FLEXLAYOUT__BORDER_BUTTON_TRAILING), onMouseDown: onCloseMouseDown, onClick: onClose, onTouchStart: onCloseMouseDown }, (typeof icons.close === \"function\") ? icons.close(node) : icons.close));\r\n }\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, \"data-layout-path\": path, className: classNames, onMouseDown: onMouseDown, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onTouchStart: onMouseDown, title: node.getHelpText() },\r\n leading,\r\n content,\r\n renderState.buttons));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderButton.tsx?");
|
|
290
290
|
|
|
291
291
|
/***/ }),
|
|
292
292
|
|
|
@@ -296,7 +296,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
296
296
|
\***********************************/
|
|
297
297
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
298
298
|
|
|
299
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"BorderTabSet\": () => (/* binding */ BorderTabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _BorderButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BorderButton */ \"./src/view/BorderButton.tsx\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../PopupMenu */ \"./src/PopupMenu.tsx\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst BorderTabSet = (props) => {\r\n const { border, layout, iconFactory, titleFactory, icons, path } = props;\r\n const toolbarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__.useTabOverflow)(border, _Orientation__WEBPACK_IMPORTED_MODULE_7__.Orientation.flip(border.getOrientation()), toolbarRef, stickyButtonsRef);\r\n const onAuxMouseClick = (event) => {\r\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_9__.isAuxMouseEvent)(event)) {\r\n layout.auxMouseClick(border, event);\r\n }\r\n };\r\n const onContextMenu = (event) => {\r\n layout.showContextMenu(border, event);\r\n };\r\n const onInterceptMouseDown = (event) => {\r\n event.stopPropagation();\r\n };\r\n const onOverflowClick = (event) => {\r\n const callback = layout.getShowOverflowMenu();\r\n if (callback !== undefined) {\r\n callback(border, event, hiddenTabs, onOverflowItemSelect);\r\n }\r\n else {\r\n const element = overflowbuttonRef.current;\r\n (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout, iconFactory, titleFactory);\r\n }\r\n event.stopPropagation();\r\n };\r\n const onOverflowItemSelect = (item) => {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.selectTab(item.node.getId()));\r\n userControlledLeft.current = false;\r\n };\r\n const onFloatTab = (event) => {\r\n const selectedTabNode = border.getChildren()[border.getSelected()];\r\n if (selectedTabNode !== undefined) {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.floatTab(selectedTabNode.getId()));\r\n }\r\n event.stopPropagation();\r\n };\r\n const cm = layout.getClassName;\r\n let style = border.getTabHeaderRect().styleWithPosition({});\r\n const tabs = [];\r\n const layoutTab = (i) => {\r\n let isSelected = border.getSelected() === i;\r\n let child = border.getChildren()[i];\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderButton__WEBPACK_IMPORTED_MODULE_2__.BorderButton, { layout: layout, border: border.getLocation().getName(), node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected, iconFactory: iconFactory, titleFactory: titleFactory, icons: icons }));\r\n if (i < border.getChildren().length - 1) {\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TAB_DIVIDER) }));\r\n }\r\n };\r\n for (let i = 0; i < border.getChildren().length; i++) {\r\n layoutTab(i);\r\n }\r\n let borderClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_ + border.getLocation().getName());\r\n if (border.getClassName() !== undefined) {\r\n borderClasses += \" \" + border.getClassName();\r\n }\r\n // allow customization of tabset right/bottom buttons\r\n let buttons = [];\r\n const renderState = { headerContent: undefined, buttons, stickyButtons: [], headerButtons: [] };\r\n layout.customizeTabSet(border, renderState);\r\n buttons = renderState.buttons;\r\n let toolbar;\r\n if (hiddenTabs.length > 0) {\r\n const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Overflow_Menu_Tooltip);\r\n let overflowContent;\r\n if (typeof icons.more === \"function\") {\r\n overflowContent = icons.more(border, hiddenTabs);\r\n }\r\n else {\r\n overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n icons.more,\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\r\n }\r\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"overflowbutton\", ref: overflowbuttonRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_OVERFLOW_ + border.getLocation().getName()), title: overflowTitle, onClick: onOverflowClick, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, overflowContent));\r\n }\r\n const selectedIndex = border.getSelected();\r\n if (selectedIndex !== -1) {\r\n const selectedTabNode = border.getChildren()[selectedIndex];\r\n if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnableFloat() && !selectedTabNode.isFloating()) {\r\n const floatTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Float_Tab);\r\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"float\", title: floatTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT), onClick: onFloatTab, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\r\n }\r\n }\r\n toolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_ + border.getLocation().getName()) }, buttons));\r\n style = layout.styleFont(style);\r\n let innerStyle = {};\r\n const borderHeight = border.getBorderBarSize() - 1;\r\n if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.LEFT) {\r\n innerStyle = { right: borderHeight, height: borderHeight, top: position };\r\n }\r\n else if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.RIGHT) {\r\n innerStyle = { left: borderHeight, height: borderHeight, top: position };\r\n }\r\n else {\r\n innerStyle = { height: borderHeight, left: position };\r\n }\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, dir: \"ltr\", style: style, className: borderClasses, \"data-layout-path\": path, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onWheel: onMouseWheel },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { height: borderHeight }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_ + border.getLocation().getName()) },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: innerStyle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_ + border.getLocation().getName()) }, tabs)),\r\n toolbar));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderTabSet.tsx?");
|
|
299
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"BorderTabSet\": () => (/* binding */ BorderTabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _BorderButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BorderButton */ \"./src/view/BorderButton.tsx\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../PopupMenu */ \"./src/PopupMenu.tsx\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst BorderTabSet = (props) => {\r\n const { border, layout, iconFactory, titleFactory, icons, path } = props;\r\n const toolbarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_6__.useTabOverflow)(border, _Orientation__WEBPACK_IMPORTED_MODULE_7__.Orientation.flip(border.getOrientation()), toolbarRef, stickyButtonsRef);\r\n const onAuxMouseClick = (event) => {\r\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_9__.isAuxMouseEvent)(event)) {\r\n layout.auxMouseClick(border, event);\r\n }\r\n };\r\n const onContextMenu = (event) => {\r\n layout.showContextMenu(border, event);\r\n };\r\n const onInterceptMouseDown = (event) => {\r\n event.stopPropagation();\r\n };\r\n const onOverflowClick = (event) => {\r\n const callback = layout.getShowOverflowMenu();\r\n if (callback !== undefined) {\r\n callback(border, event, hiddenTabs, onOverflowItemSelect);\r\n }\r\n else {\r\n const element = overflowbuttonRef.current;\r\n (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout, iconFactory, titleFactory);\r\n }\r\n event.stopPropagation();\r\n };\r\n const onOverflowItemSelect = (item) => {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.selectTab(item.node.getId()));\r\n userControlledLeft.current = false;\r\n };\r\n const onFloatTab = (event) => {\r\n const selectedTabNode = border.getChildren()[border.getSelected()];\r\n if (selectedTabNode !== undefined) {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.floatTab(selectedTabNode.getId()));\r\n }\r\n event.stopPropagation();\r\n };\r\n const cm = layout.getClassName;\r\n let style = border.getTabHeaderRect().styleWithPosition({});\r\n const tabs = [];\r\n const layoutTab = (i) => {\r\n let isSelected = border.getSelected() === i;\r\n let child = border.getChildren()[i];\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderButton__WEBPACK_IMPORTED_MODULE_2__.BorderButton, { layout: layout, border: border.getLocation().getName(), node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected, iconFactory: iconFactory, titleFactory: titleFactory, icons: icons }));\r\n if (i < border.getChildren().length - 1) {\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TAB_DIVIDER) }));\r\n }\r\n };\r\n for (let i = 0; i < border.getChildren().length; i++) {\r\n layoutTab(i);\r\n }\r\n let borderClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_ + border.getLocation().getName());\r\n if (border.getClassName() !== undefined) {\r\n borderClasses += \" \" + border.getClassName();\r\n }\r\n // allow customization of tabset right/bottom buttons\r\n let buttons = [];\r\n let stickyButtons = [];\r\n const renderState = { headerContent: undefined, buttons, stickyButtons: stickyButtons, headerButtons: [], overflowPosition: undefined };\r\n layout.customizeTabSet(border, renderState);\r\n buttons = renderState.buttons;\r\n if (renderState.overflowPosition === undefined) {\r\n renderState.overflowPosition = stickyButtons.length;\r\n }\r\n if (stickyButtons.length > 0) {\r\n if (tabsTruncated) {\r\n buttons = [...stickyButtons, ...buttons];\r\n }\r\n else {\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\r\n }\r\n }\r\n if (hiddenTabs.length > 0) {\r\n const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Overflow_Menu_Tooltip);\r\n let overflowContent;\r\n if (typeof icons.more === \"function\") {\r\n overflowContent = icons.more(border, hiddenTabs);\r\n }\r\n else {\r\n overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n icons.more,\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\r\n }\r\n buttons.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, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, overflowContent));\r\n }\r\n const selectedIndex = border.getSelected();\r\n if (selectedIndex !== -1) {\r\n const selectedTabNode = border.getChildren()[selectedIndex];\r\n if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnableFloat() && !selectedTabNode.isFloating()) {\r\n const floatTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_5__.I18nLabel.Float_Tab);\r\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"float\", title: floatTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_TOOLBAR_BUTTON_FLOAT), onClick: onFloatTab, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\r\n }\r\n }\r\n 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));\r\n style = layout.styleFont(style);\r\n let innerStyle = {};\r\n const borderHeight = border.getBorderBarSize() - 1;\r\n if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.LEFT) {\r\n innerStyle = { right: borderHeight, height: borderHeight, top: position };\r\n }\r\n else if (border.getLocation() === _DockLocation__WEBPACK_IMPORTED_MODULE_1__.DockLocation.RIGHT) {\r\n innerStyle = { left: borderHeight, height: borderHeight, top: position };\r\n }\r\n else {\r\n innerStyle = { height: borderHeight, left: position };\r\n }\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, dir: \"ltr\", style: style, className: borderClasses, \"data-layout-path\": path, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onWheel: onMouseWheel },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { height: borderHeight }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_ + border.getLocation().getName()) },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: innerStyle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_8__.CLASSES.FLEXLAYOUT__BORDER_INNER_TAB_CONTAINER_ + border.getLocation().getName()) }, tabs)),\r\n toolbar));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/BorderTabSet.tsx?");
|
|
300
300
|
|
|
301
301
|
/***/ }),
|
|
302
302
|
|
|
@@ -346,7 +346,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
346
346
|
\*****************************/
|
|
347
347
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
348
348
|
|
|
349
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Layout\": () => (/* binding */ Layout)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DragDrop__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DragDrop */ \"./src/DragDrop.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../model/SplitterNode */ \"./src/model/SplitterNode.ts\");\n/* harmony import */ var _model_TabNode__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../model/TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _BorderTabSet__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./BorderTabSet */ \"./src/view/BorderTabSet.tsx\");\n/* harmony import */ var _Splitter__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./Splitter */ \"./src/view/Splitter.tsx\");\n/* harmony import */ var _Tab__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./Tab */ \"./src/view/Tab.tsx\");\n/* harmony import */ var _TabSet__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./TabSet */ \"./src/view/TabSet.tsx\");\n/* harmony import */ var _FloatingWindow__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./FloatingWindow */ \"./src/view/FloatingWindow.tsx\");\n/* harmony import */ var _FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./FloatingWindowTab */ \"./src/view/FloatingWindowTab.tsx\");\n/* harmony import */ var _TabFloating__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./TabFloating */ \"./src/view/TabFloating.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Icons__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./Icons */ \"./src/view/Icons.tsx\");\n/* harmony import */ var _TabButtonStamp__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./TabButtonStamp */ \"./src/view/TabButtonStamp.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nconst defaultIcons = {\r\n close: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.CloseIcon, null),\r\n closeTabset: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.CloseIcon, null),\r\n popout: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.PopoutIcon, null),\r\n maximize: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.MaximizeIcon, null),\r\n restore: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.RestoreIcon, null),\r\n more: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.OverflowIcon, null),\r\n};\r\n// Popout windows work in latest browsers based on webkit (Chrome, Opera, Safari, latest Edge) and Firefox. They do\r\n// not work on any version if IE or the original Edge browser\r\n// Assume any recent desktop browser not IE or original Edge will work\r\n/** @internal */\r\n// @ts-ignore\r\nconst isIEorEdge = typeof window !== \"undefined\" && (window.document.documentMode || /Edge\\//.test(window.navigator.userAgent));\r\n/** @internal */\r\nconst isDesktop = typeof window !== \"undefined\" && window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches;\r\n/** @internal */\r\nconst defaultSupportsPopout = isDesktop && !isIEorEdge;\r\n/**\r\n * A React component that hosts a multi-tabbed layout\r\n */\r\nclass Layout extends react__WEBPACK_IMPORTED_MODULE_0__.Component {\r\n constructor(props) {\r\n super(props);\r\n /** @internal */\r\n this.firstMove = false;\r\n /** @internal */\r\n this.dragRectRendered = true;\r\n /** @internal */\r\n this.dragDivText = undefined;\r\n /** @internal */\r\n this.edgeRectLength = 100;\r\n /** @internal */\r\n this.edgeRectWidth = 10;\r\n /** @internal */\r\n this.onModelChange = (action) => {\r\n this.forceUpdate();\r\n if (this.props.onModelChange) {\r\n this.props.onModelChange(this.props.model, action);\r\n }\r\n };\r\n /** @internal */\r\n this.updateRect = (domRect = this.getDomRect()) => {\r\n const rect = new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, domRect.width, domRect.height);\r\n if (!rect.equals(this.state.rect) && rect.width !== 0 && rect.height !== 0) {\r\n this.setState({ rect });\r\n }\r\n };\r\n /** @internal */\r\n this.updateLayoutMetrics = () => {\r\n if (this.findHeaderBarSizeRef.current) {\r\n const headerBarSize = this.findHeaderBarSizeRef.current.getBoundingClientRect().height;\r\n if (headerBarSize !== this.state.calculatedHeaderBarSize) {\r\n this.setState({ calculatedHeaderBarSize: headerBarSize });\r\n }\r\n }\r\n if (this.findTabBarSizeRef.current) {\r\n const tabBarSize = this.findTabBarSizeRef.current.getBoundingClientRect().height;\r\n if (tabBarSize !== this.state.calculatedTabBarSize) {\r\n this.setState({ calculatedTabBarSize: tabBarSize });\r\n }\r\n }\r\n if (this.findBorderBarSizeRef.current) {\r\n const borderBarSize = this.findBorderBarSizeRef.current.getBoundingClientRect().height;\r\n if (borderBarSize !== this.state.calculatedBorderBarSize) {\r\n this.setState({ calculatedBorderBarSize: borderBarSize });\r\n }\r\n }\r\n };\r\n /** @internal */\r\n this.getClassName = (defaultClassName) => {\r\n if (this.props.classNameMapper === undefined) {\r\n return defaultClassName;\r\n }\r\n else {\r\n return this.props.classNameMapper(defaultClassName);\r\n }\r\n };\r\n /** @internal */\r\n this.onCloseWindow = (id) => {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.unFloatTab(id));\r\n try {\r\n this.props.model.getNodeById(id)._setWindow(undefined);\r\n }\r\n catch (e) {\r\n // catch incase it was a model change\r\n }\r\n };\r\n /** @internal */\r\n this.onSetWindow = (id, window) => {\r\n this.props.model.getNodeById(id)._setWindow(window);\r\n };\r\n /** @internal */\r\n this.onCancelAdd = () => {\r\n var _a, _b;\r\n const rootdiv = this.selfRef.current;\r\n rootdiv.removeChild(this.dragDiv);\r\n this.dragDiv = undefined;\r\n this.hidePortal();\r\n if (this.fnNewNodeDropped != null) {\r\n this.fnNewNodeDropped();\r\n this.fnNewNodeDropped = undefined;\r\n }\r\n try {\r\n (_b = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated) === null || _b === void 0 ? void 0 : _b.call(_a);\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n this.newTabJson = undefined;\r\n this.customDrop = undefined;\r\n };\r\n /** @internal */\r\n this.onCancelDrag = (wasDragging) => {\r\n var _a, _b;\r\n if (wasDragging) {\r\n const rootdiv = this.selfRef.current;\r\n try {\r\n rootdiv.removeChild(this.outlineDiv);\r\n }\r\n catch (e) { }\r\n try {\r\n rootdiv.removeChild(this.dragDiv);\r\n }\r\n catch (e) { }\r\n this.dragDiv = undefined;\r\n this.hidePortal();\r\n this.setState({ showEdges: false });\r\n if (this.fnNewNodeDropped != null) {\r\n this.fnNewNodeDropped();\r\n this.fnNewNodeDropped = undefined;\r\n }\r\n try {\r\n (_b = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated) === null || _b === void 0 ? void 0 : _b.call(_a);\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n this.newTabJson = undefined;\r\n this.customDrop = undefined;\r\n }\r\n this.setState({ showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER });\r\n };\r\n /** @internal */\r\n this.onDragDivMouseDown = (event) => {\r\n event.preventDefault();\r\n this.dragStart(event, this.dragDivText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(this.newTabJson, this.props.model, false), true, undefined, undefined);\r\n };\r\n /** @internal */\r\n this.dragStart = (event, dragDivText, node, allowDrag, onClick, onDoubleClick) => {\r\n if (!allowDrag) {\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.startDrag(event, undefined, undefined, undefined, undefined, onClick, onDoubleClick, this.currentDocument, this.selfRef.current);\r\n }\r\n else {\r\n this.dragNode = node;\r\n this.dragDivText = dragDivText;\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.startDrag(event, this.onDragStart, this.onDragMove, this.onDragEnd, this.onCancelDrag, onClick, onDoubleClick, this.currentDocument, this.selfRef.current);\r\n }\r\n };\r\n /** @internal */\r\n this.dragRectRender = (text, node, json, onRendered) => {\r\n let content;\r\n if (text !== undefined) {\r\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { whiteSpace: \"pre\" } }, text.replace(\"<br>\", \"\\n\"));\r\n }\r\n else {\r\n if (node && node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n content = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButtonStamp__WEBPACK_IMPORTED_MODULE_20__.TabButtonStamp, { node: node, layout: this, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory }));\r\n }\r\n }\r\n if (this.props.onRenderDragRect !== undefined) {\r\n const customContent = this.props.onRenderDragRect(content, node, json);\r\n if (customContent !== undefined) {\r\n content = customContent;\r\n }\r\n }\r\n // hide div until the render is complete\r\n this.dragDiv.style.visibility = \"hidden\";\r\n this.dragRectRendered = false;\r\n this.showPortal(react__WEBPACK_IMPORTED_MODULE_0__.createElement(DragRectRenderWrapper\r\n // wait for it to be rendered\r\n , { \r\n // wait for it to be rendered\r\n onRendered: () => {\r\n this.dragRectRendered = true;\r\n onRendered === null || onRendered === void 0 ? void 0 : onRendered();\r\n } }, content), this.dragDiv);\r\n };\r\n /** @internal */\r\n this.showPortal = (control, element) => {\r\n const portal = (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(control, element);\r\n this.setState({ portal });\r\n };\r\n /** @internal */\r\n this.hidePortal = () => {\r\n this.setState({ portal: undefined });\r\n };\r\n /** @internal */\r\n this.onDragStart = () => {\r\n this.dropInfo = undefined;\r\n this.customDrop = undefined;\r\n const rootdiv = this.selfRef.current;\r\n this.outlineDiv = this.currentDocument.createElement(\"div\");\r\n this.outlineDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n this.outlineDiv.style.visibility = \"hidden\";\r\n rootdiv.appendChild(this.outlineDiv);\r\n if (this.dragDiv == null) {\r\n this.dragDiv = this.currentDocument.createElement(\"div\");\r\n this.dragDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__DRAG_RECT);\r\n this.dragDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\r\n this.dragRectRender(this.dragDivText, this.dragNode, this.newTabJson);\r\n rootdiv.appendChild(this.dragDiv);\r\n }\r\n // add edge indicators\r\n if (this.props.model.getMaximizedTabset() === undefined) {\r\n this.setState({ showEdges: this.props.model.isEnableEdgeDock() });\r\n }\r\n if (this.dragNode !== undefined && this.dragNode instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode && this.dragNode.getTabRect() !== undefined) {\r\n this.dragNode.getTabRect().positionElement(this.outlineDiv);\r\n }\r\n this.firstMove = true;\r\n return true;\r\n };\r\n /** @internal */\r\n this.onDragMove = (event) => {\r\n if (this.firstMove === false) {\r\n const speed = this.props.model._getAttribute(\"tabDragSpeed\");\r\n this.outlineDiv.style.transition = `top ${speed}s, left ${speed}s, width ${speed}s, height ${speed}s`;\r\n }\r\n this.firstMove = false;\r\n const clientRect = this.selfRef.current.getBoundingClientRect();\r\n const pos = {\r\n x: event.clientX - clientRect.left,\r\n y: event.clientY - clientRect.top,\r\n };\r\n this.checkForBorderToShow(pos.x, pos.y);\r\n // keep it between left & right\r\n const dragRect = this.dragDiv.getBoundingClientRect();\r\n let newLeft = pos.x - dragRect.width / 2;\r\n if (newLeft + dragRect.width > clientRect.width) {\r\n newLeft = clientRect.width - dragRect.width;\r\n }\r\n newLeft = Math.max(0, newLeft);\r\n this.dragDiv.style.left = newLeft + \"px\";\r\n this.dragDiv.style.top = pos.y + 5 + \"px\";\r\n if (this.dragRectRendered && this.dragDiv.style.visibility === \"hidden\") {\r\n // make visible once the drag rect has been rendered\r\n this.dragDiv.style.visibility = \"visible\";\r\n }\r\n let dropInfo = this.props.model._findDropTargetNode(this.dragNode, pos.x, pos.y);\r\n if (dropInfo) {\r\n if (this.props.onTabDrag) {\r\n this.handleCustomTabDrag(dropInfo, pos, event);\r\n }\r\n else {\r\n this.dropInfo = dropInfo;\r\n this.outlineDiv.className = this.getClassName(dropInfo.className);\r\n dropInfo.rect.positionElement(this.outlineDiv);\r\n this.outlineDiv.style.visibility = \"visible\";\r\n }\r\n }\r\n };\r\n /** @internal */\r\n this.onDragEnd = (event) => {\r\n const rootdiv = this.selfRef.current;\r\n rootdiv.removeChild(this.outlineDiv);\r\n rootdiv.removeChild(this.dragDiv);\r\n this.dragDiv = undefined;\r\n this.hidePortal();\r\n this.setState({ showEdges: false });\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n if (this.dropInfo) {\r\n if (this.customDrop) {\r\n this.newTabJson = undefined;\r\n try {\r\n const { callback, dragging, over, x, y, location } = this.customDrop;\r\n callback(dragging, over, x, y, location);\r\n if (this.fnNewNodeDropped != null) {\r\n this.fnNewNodeDropped();\r\n this.fnNewNodeDropped = undefined;\r\n }\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n }\r\n else if (this.newTabJson !== undefined) {\r\n const newNode = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(this.newTabJson, this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\r\n if (this.fnNewNodeDropped != null) {\r\n this.fnNewNodeDropped(newNode, event);\r\n this.fnNewNodeDropped = undefined;\r\n }\r\n this.newTabJson = undefined;\r\n }\r\n else if (this.dragNode !== undefined) {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.moveNode(this.dragNode.getId(), this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\r\n }\r\n }\r\n this.setState({ showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER });\r\n };\r\n this.props.model._setChangeListener(this.onModelChange);\r\n this.tabIds = [];\r\n this.selfRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n this.findHeaderBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n this.findTabBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n this.findBorderBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n this.supportsPopout = props.supportsPopout !== undefined ? props.supportsPopout : defaultSupportsPopout;\r\n this.popoutURL = props.popoutURL ? props.popoutURL : \"popout.html\";\r\n this.icons = Object.assign(Object.assign({}, defaultIcons), props.icons);\r\n this.state = {\r\n rect: new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, 0, 0),\r\n calculatedHeaderBarSize: 25,\r\n calculatedTabBarSize: 26,\r\n calculatedBorderBarSize: 30,\r\n editingTab: undefined,\r\n showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER,\r\n showEdges: false,\r\n };\r\n this.onDragEnter = this.onDragEnter.bind(this);\r\n }\r\n /** @internal */\r\n styleFont(style) {\r\n if (this.props.font) {\r\n if (this.selfRef.current) {\r\n if (this.props.font.size) {\r\n this.selfRef.current.style.setProperty(\"--font-size\", this.props.font.size);\r\n }\r\n if (this.props.font.family) {\r\n this.selfRef.current.style.setProperty(\"--font-family\", this.props.font.family);\r\n }\r\n }\r\n if (this.props.font.style) {\r\n style.fontStyle = this.props.font.style;\r\n }\r\n if (this.props.font.weight) {\r\n style.fontWeight = this.props.font.weight;\r\n }\r\n }\r\n return style;\r\n }\r\n /** @internal */\r\n doAction(action) {\r\n if (this.props.onAction !== undefined) {\r\n const outcome = this.props.onAction(action);\r\n if (outcome !== undefined) {\r\n return this.props.model.doAction(outcome);\r\n }\r\n return undefined;\r\n }\r\n else {\r\n return this.props.model.doAction(action);\r\n }\r\n }\r\n /** @internal */\r\n componentDidMount() {\r\n this.updateRect();\r\n this.updateLayoutMetrics();\r\n // need to re-render if size changes\r\n this.currentDocument = this.selfRef.current.ownerDocument;\r\n this.currentWindow = this.currentDocument.defaultView;\r\n this.resizeObserver = new ResizeObserver(entries => {\r\n this.updateRect(entries[0].contentRect);\r\n });\r\n this.resizeObserver.observe(this.selfRef.current);\r\n }\r\n /** @internal */\r\n componentDidUpdate() {\r\n this.updateLayoutMetrics();\r\n if (this.props.model !== this.previousModel) {\r\n if (this.previousModel !== undefined) {\r\n this.previousModel._setChangeListener(undefined); // stop listening to old model\r\n }\r\n this.props.model._setChangeListener(this.onModelChange);\r\n this.previousModel = this.props.model;\r\n }\r\n // console.log(\"Layout time: \" + this.layoutTime + \"ms Render time: \" + (Date.now() - this.start) + \"ms\");\r\n }\r\n /** @internal */\r\n getCurrentDocument() {\r\n return this.currentDocument;\r\n }\r\n /** @internal */\r\n getDomRect() {\r\n return this.selfRef.current.getBoundingClientRect();\r\n }\r\n /** @internal */\r\n getRootDiv() {\r\n return this.selfRef.current;\r\n }\r\n /** @internal */\r\n isSupportsPopout() {\r\n return this.supportsPopout;\r\n }\r\n /** @internal */\r\n isRealtimeResize() {\r\n var _a;\r\n return (_a = this.props.realtimeResize) !== null && _a !== void 0 ? _a : false;\r\n }\r\n /** @internal */\r\n onTabDrag(...args) {\r\n var _a, _b;\r\n return (_b = (_a = this.props).onTabDrag) === null || _b === void 0 ? void 0 : _b.call(_a, ...args);\r\n }\r\n /** @internal */\r\n getPopoutURL() {\r\n return this.popoutURL;\r\n }\r\n /** @internal */\r\n componentWillUnmount() {\r\n var _a;\r\n (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.selfRef.current);\r\n }\r\n /** @internal */\r\n setEditingTab(tabNode) {\r\n this.setState({ editingTab: tabNode });\r\n }\r\n /** @internal */\r\n getEditingTab() {\r\n return this.state.editingTab;\r\n }\r\n /** @internal */\r\n render() {\r\n // first render will be used to find the size (via selfRef)\r\n if (!this.selfRef.current) {\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__LAYOUT) }, this.metricsElements()));\r\n }\r\n this.props.model._setPointerFine(window && window.matchMedia && window.matchMedia(\"(pointer: fine)\").matches);\r\n // this.start = Date.now();\r\n const borderComponents = [];\r\n const tabSetComponents = [];\r\n const floatingWindows = [];\r\n const tabComponents = {};\r\n const splitterComponents = [];\r\n const metrics = {\r\n headerBarSize: this.state.calculatedHeaderBarSize,\r\n tabBarSize: this.state.calculatedTabBarSize,\r\n borderBarSize: this.state.calculatedBorderBarSize\r\n };\r\n this.props.model._setShowHiddenBorder(this.state.showHiddenBorder);\r\n this.centerRect = this.props.model._layout(this.state.rect, metrics);\r\n this.renderBorder(this.props.model.getBorderSet(), borderComponents, tabComponents, floatingWindows, splitterComponents);\r\n this.renderChildren(\"\", this.props.model.getRoot(), tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n const nextTopIds = [];\r\n const nextTopIdsMap = {};\r\n // Keep any previous tabs in the same DOM order as before, removing any that have been deleted\r\n for (const t of this.tabIds) {\r\n if (tabComponents[t]) {\r\n nextTopIds.push(t);\r\n nextTopIdsMap[t] = t;\r\n }\r\n }\r\n this.tabIds = nextTopIds;\r\n // Add tabs that have been added to the DOM\r\n for (const t of Object.keys(tabComponents)) {\r\n if (!nextTopIdsMap[t]) {\r\n this.tabIds.push(t);\r\n }\r\n }\r\n const edges = [];\r\n if (this.state.showEdges) {\r\n const r = this.centerRect;\r\n const length = this.edgeRectLength;\r\n const width = this.edgeRectWidth;\r\n const offset = this.edgeRectLength / 2;\r\n const className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__EDGE_RECT);\r\n const radius = 50;\r\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"North\", style: { top: r.y, left: r.x + r.width / 2 - offset, width: length, height: width, borderBottomLeftRadius: radius, borderBottomRightRadius: radius }, className: className }));\r\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"West\", style: { top: r.y + r.height / 2 - offset, left: r.x, width: width, height: length, borderTopRightRadius: radius, borderBottomRightRadius: radius }, className: className }));\r\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"South\", style: { top: r.y + r.height - width, left: r.x + r.width / 2 - offset, width: length, height: width, borderTopLeftRadius: radius, borderTopRightRadius: radius }, className: className }));\r\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"East\", style: { top: r.y + r.height / 2 - offset, left: r.x + r.width - width, width: width, height: length, borderTopLeftRadius: radius, borderBottomLeftRadius: radius }, className: className }));\r\n }\r\n // this.layoutTime = (Date.now() - this.start);\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__LAYOUT), onDragEnter: this.props.onExternalDrag ? this.onDragEnter : undefined },\r\n tabSetComponents,\r\n this.tabIds.map((t) => {\r\n return tabComponents[t];\r\n }),\r\n borderComponents,\r\n splitterComponents,\r\n edges,\r\n floatingWindows,\r\n this.metricsElements(),\r\n this.state.portal));\r\n }\r\n /** @internal */\r\n metricsElements() {\r\n // used to measure the tab and border tab sizes\r\n const fontStyle = this.styleFont({ visibility: \"hidden\" });\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findHeaderBarSize\", ref: this.findHeaderBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__TABSET_HEADER_SIZER) }, \"FindHeaderBarSize\"),\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findTabBarSize\", ref: this.findTabBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__TABSET_SIZER) }, \"FindTabBarSize\"),\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findBorderBarSize\", ref: this.findBorderBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__BORDER_SIZER) }, \"FindBorderBarSize\")));\r\n }\r\n /** @internal */\r\n renderBorder(borderSet, borderComponents, tabComponents, floatingWindows, splitterComponents) {\r\n for (const border of borderSet.getBorders()) {\r\n const borderPath = `/border/${border.getLocation().getName()}`;\r\n if (border.isShowing()) {\r\n borderComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderTabSet__WEBPACK_IMPORTED_MODULE_11__.BorderTabSet, { key: `border_${border.getLocation().getName()}`, path: borderPath, border: border, layout: this, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory, icons: this.icons }));\r\n const drawChildren = border._getDrawChildren();\r\n let i = 0;\r\n let tabCount = 0;\r\n for (const child of drawChildren) {\r\n if (child instanceof _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__.SplitterNode) {\r\n let path = borderPath + \"/s\";\r\n splitterComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Splitter__WEBPACK_IMPORTED_MODULE_12__.Splitter, { key: child.getId(), layout: this, node: child, path: path }));\r\n }\r\n else if (child instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n let path = borderPath + \"/t\" + tabCount++;\r\n if (this.supportsPopout && child.isFloating()) {\r\n const rect = this._getScreenRect(child);\r\n const tabBorderWidth = child._getAttr(\"borderWidth\");\r\n const tabBorderHeight = child._getAttr(\"borderHeight\");\r\n if (tabBorderWidth !== -1 && border.getLocation().getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_18__.Orientation.HORZ) {\r\n rect.width = tabBorderWidth;\r\n }\r\n else if (tabBorderHeight !== -1 && border.getLocation().getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_18__.Orientation.VERT) {\r\n rect.height = tabBorderHeight;\r\n }\r\n floatingWindows.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindow__WEBPACK_IMPORTED_MODULE_15__.FloatingWindow, { key: child.getId(), url: this.popoutURL, rect: rect, title: child.getName(), id: child.getId(), onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__.FloatingWindowTab, { layout: this, node: child, factory: this.props.factory })));\r\n tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabFloating__WEBPACK_IMPORTED_MODULE_17__.TabFloating, { key: child.getId(), layout: this, path: path, node: child, selected: i === border.getSelected() });\r\n }\r\n else {\r\n tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tab__WEBPACK_IMPORTED_MODULE_13__.Tab, { key: child.getId(), layout: this, path: path, node: child, selected: i === border.getSelected(), factory: this.props.factory });\r\n }\r\n }\r\n i++;\r\n }\r\n }\r\n }\r\n }\r\n /** @internal */\r\n renderChildren(path, node, tabSetComponents, tabComponents, floatingWindows, splitterComponents) {\r\n const drawChildren = node._getDrawChildren();\r\n let splitterCount = 0;\r\n let tabCount = 0;\r\n let rowCount = 0;\r\n for (const child of drawChildren) {\r\n if (child instanceof _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__.SplitterNode) {\r\n const newPath = path + \"/s\" + (splitterCount++);\r\n splitterComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Splitter__WEBPACK_IMPORTED_MODULE_12__.Splitter, { key: child.getId(), layout: this, path: newPath, node: child }));\r\n }\r\n else if (child instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__.TabSetNode) {\r\n const newPath = path + \"/ts\" + (rowCount++);\r\n tabSetComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabSet__WEBPACK_IMPORTED_MODULE_14__.TabSet, { key: child.getId(), layout: this, path: newPath, node: child, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory, icons: this.icons }));\r\n this.renderChildren(newPath, child, tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n }\r\n else if (child instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n const newPath = path + \"/t\" + (tabCount++);\r\n const selectedTab = child.getParent().getChildren()[child.getParent().getSelected()];\r\n if (selectedTab === undefined) {\r\n // this should not happen!\r\n console.warn(\"undefined selectedTab should not happen\");\r\n }\r\n if (this.supportsPopout && child.isFloating()) {\r\n const rect = this._getScreenRect(child);\r\n floatingWindows.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindow__WEBPACK_IMPORTED_MODULE_15__.FloatingWindow, { key: child.getId(), url: this.popoutURL, rect: rect, title: child.getName(), id: child.getId(), onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__.FloatingWindowTab, { layout: this, node: child, factory: this.props.factory })));\r\n tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabFloating__WEBPACK_IMPORTED_MODULE_17__.TabFloating, { key: child.getId(), layout: this, path: newPath, node: child, selected: child === selectedTab });\r\n }\r\n else {\r\n tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tab__WEBPACK_IMPORTED_MODULE_13__.Tab, { key: child.getId(), layout: this, path: newPath, node: child, selected: child === selectedTab, factory: this.props.factory });\r\n }\r\n }\r\n else {\r\n // is row\r\n const newPath = path + ((child.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_18__.Orientation.HORZ) ? \"/r\" : \"/c\") + (rowCount++);\r\n this.renderChildren(newPath, child, tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n }\r\n }\r\n }\r\n /** @internal */\r\n _getScreenRect(node) {\r\n const rect = node.getRect().clone();\r\n const bodyRect = this.selfRef.current.getBoundingClientRect();\r\n const navHeight = Math.min(80, this.currentWindow.outerHeight - this.currentWindow.innerHeight);\r\n const navWidth = Math.min(80, this.currentWindow.outerWidth - this.currentWindow.innerWidth);\r\n rect.x = rect.x + bodyRect.x + this.currentWindow.screenX + navWidth;\r\n rect.y = rect.y + bodyRect.y + this.currentWindow.screenY + navHeight;\r\n return rect;\r\n }\r\n /**\r\n * Adds a new tab to the given tabset\r\n * @param tabsetId the id of the tabset where the new tab will be added\r\n * @param json the json for the new tab node\r\n */\r\n addTabToTabSet(tabsetId, json) {\r\n const tabsetNode = this.props.model.getNodeById(tabsetId);\r\n if (tabsetNode !== undefined) {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(json, tabsetId, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, -1));\r\n }\r\n }\r\n /**\r\n * Adds a new tab to the active tabset (if there is one)\r\n * @param json the json for the new tab node\r\n */\r\n addTabToActiveTabSet(json) {\r\n const tabsetNode = this.props.model.getActiveTabset();\r\n if (tabsetNode !== undefined) {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(json, tabsetNode.getId(), _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, -1));\r\n }\r\n }\r\n /**\r\n * Adds a new tab by dragging a labeled panel to the drop location, dragging starts immediatelly\r\n * @param dragText the text to show on the drag panel\r\n * @param json the json for the new tab node\r\n * @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)\r\n */\r\n addTabWithDragAndDrop(dragText, json, onDrop) {\r\n this.fnNewNodeDropped = onDrop;\r\n this.newTabJson = json;\r\n this.dragStart(undefined, dragText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(json, this.props.model, false), true, undefined, undefined);\r\n }\r\n /**\r\n * Move a tab/tabset using drag and drop\r\n * @param node the tab or tabset to drag\r\n * @param dragText the text to show on the drag panel\r\n */\r\n moveTabWithDragAndDrop(node, dragText) {\r\n this.dragStart(undefined, dragText, node, true, undefined, undefined);\r\n }\r\n /**\r\n * Adds a new tab by dragging a labeled panel to the drop location, dragging starts when you\r\n * mouse down on the panel\r\n *\r\n * @param dragText the text to show on the drag panel\r\n * @param json the json for the new tab node\r\n * @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)\r\n */\r\n addTabWithDragAndDropIndirect(dragText, json, onDrop) {\r\n this.fnNewNodeDropped = onDrop;\r\n this.newTabJson = json;\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.addGlass(this.onCancelAdd);\r\n this.dragDivText = dragText;\r\n this.dragDiv = this.currentDocument.createElement(\"div\");\r\n this.dragDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__DRAG_RECT);\r\n this.dragDiv.addEventListener(\"mousedown\", this.onDragDivMouseDown);\r\n this.dragDiv.addEventListener(\"touchstart\", this.onDragDivMouseDown, { passive: false });\r\n this.dragRectRender(this.dragDivText, undefined, this.newTabJson, () => {\r\n if (this.dragDiv) {\r\n // now it's been rendered into the dom it can be centered\r\n this.dragDiv.style.visibility = \"visible\";\r\n const domRect = this.dragDiv.getBoundingClientRect();\r\n const r = new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, domRect === null || domRect === void 0 ? void 0 : domRect.width, domRect === null || domRect === void 0 ? void 0 : domRect.height);\r\n r.centerInRect(this.state.rect);\r\n this.dragDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\r\n this.dragDiv.style.left = r.x + \"px\";\r\n this.dragDiv.style.top = r.y + \"px\";\r\n }\r\n });\r\n const rootdiv = this.selfRef.current;\r\n rootdiv.appendChild(this.dragDiv);\r\n }\r\n /** @internal */\r\n handleCustomTabDrag(dropInfo, pos, event) {\r\n var _a, _b, _c;\r\n let invalidated = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated;\r\n const currentCallback = (_b = this.customDrop) === null || _b === void 0 ? void 0 : _b.callback;\r\n this.customDrop = undefined;\r\n const dragging = this.newTabJson || (this.dragNode instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode ? this.dragNode : undefined);\r\n if (dragging && (dropInfo.node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__.TabSetNode || dropInfo.node instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode) && dropInfo.index === -1) {\r\n const selected = dropInfo.node.getSelectedNode();\r\n const tabRect = selected === null || selected === void 0 ? void 0 : selected.getRect();\r\n if (selected && (tabRect === null || tabRect === void 0 ? void 0 : tabRect.contains(pos.x, pos.y))) {\r\n let customDrop = undefined;\r\n try {\r\n const dest = this.onTabDrag(dragging, selected, pos.x - tabRect.x, pos.y - tabRect.y, dropInfo.location, () => this.onDragMove(event));\r\n if (dest) {\r\n customDrop = {\r\n rect: new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(dest.x + tabRect.x, dest.y + tabRect.y, dest.width, dest.height),\r\n callback: dest.callback,\r\n invalidated: dest.invalidated,\r\n dragging: dragging,\r\n over: selected,\r\n x: pos.x - tabRect.x,\r\n y: pos.y - tabRect.y,\r\n location: dropInfo.location,\r\n cursor: dest.cursor\r\n };\r\n }\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n if ((customDrop === null || customDrop === void 0 ? void 0 : customDrop.callback) === currentCallback) {\r\n invalidated = undefined;\r\n }\r\n this.customDrop = customDrop;\r\n }\r\n }\r\n this.dropInfo = dropInfo;\r\n this.outlineDiv.className = this.getClassName(this.customDrop ? _Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__OUTLINE_RECT : dropInfo.className);\r\n if (this.customDrop) {\r\n this.customDrop.rect.positionElement(this.outlineDiv);\r\n }\r\n else {\r\n dropInfo.rect.positionElement(this.outlineDiv);\r\n }\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.setGlassCursorOverride((_c = this.customDrop) === null || _c === void 0 ? void 0 : _c.cursor);\r\n this.outlineDiv.style.visibility = \"visible\";\r\n try {\r\n invalidated === null || invalidated === void 0 ? void 0 : invalidated();\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n }\r\n /** @internal */\r\n onDragEnter(event) {\r\n // DragDrop keeps track of number of dragenters minus the number of\r\n // dragleaves. Only start a new drag if there isn't one already.\r\n if (_DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.isDragging())\r\n return;\r\n const drag = this.props.onExternalDrag(event);\r\n if (drag) {\r\n // Mimic addTabWithDragAndDrop, but pass in DragEvent\r\n this.fnNewNodeDropped = drag.onDrop;\r\n this.newTabJson = drag.json;\r\n this.dragStart(event, drag.dragText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(drag.json, this.props.model, false), true, undefined, undefined);\r\n }\r\n }\r\n /** @internal */\r\n checkForBorderToShow(x, y) {\r\n const r = this.props.model._getOuterInnerRects().outer;\r\n const c = r.getCenter();\r\n const margin = this.edgeRectWidth;\r\n const offset = this.edgeRectLength / 2;\r\n let overEdge = false;\r\n if (this.props.model.isEnableEdgeDock() && this.state.showHiddenBorder === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER) {\r\n if ((y > c.y - offset && y < c.y + offset) ||\r\n (x > c.x - offset && x < c.x + offset)) {\r\n overEdge = true;\r\n }\r\n }\r\n let location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n if (!overEdge) {\r\n if (x <= r.x + margin) {\r\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT;\r\n }\r\n else if (x >= r.getRight() - margin) {\r\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT;\r\n }\r\n else if (y <= r.y + margin) {\r\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP;\r\n }\r\n else if (y >= r.getBottom() - margin) {\r\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM;\r\n }\r\n }\r\n if (location !== this.state.showHiddenBorder) {\r\n this.setState({ showHiddenBorder: location });\r\n }\r\n }\r\n /** @internal */\r\n maximize(tabsetNode) {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.maximizeToggle(tabsetNode.getId()));\r\n }\r\n /** @internal */\r\n customizeTab(tabNode, renderValues) {\r\n if (this.props.onRenderTab) {\r\n this.props.onRenderTab(tabNode, renderValues);\r\n }\r\n }\r\n /** @internal */\r\n customizeTabSet(tabSetNode, renderValues) {\r\n if (this.props.onRenderTabSet) {\r\n this.props.onRenderTabSet(tabSetNode, renderValues);\r\n }\r\n }\r\n /** @internal */\r\n i18nName(id, param) {\r\n let message;\r\n if (this.props.i18nMapper) {\r\n message = this.props.i18nMapper(id, param);\r\n }\r\n if (message === undefined) {\r\n message = id + (param === undefined ? \"\" : param);\r\n }\r\n return message;\r\n }\r\n /** @internal */\r\n getOnRenderFloatingTabPlaceholder() {\r\n return this.props.onRenderFloatingTabPlaceholder;\r\n }\r\n /** @internal */\r\n getShowOverflowMenu() {\r\n return this.props.onShowOverflowMenu;\r\n }\r\n /** @internal */\r\n getTabSetPlaceHolderCallback() {\r\n return this.props.onTabSetPlaceHolder;\r\n }\r\n /** @internal */\r\n showContextMenu(node, event) {\r\n if (this.props.onContextMenu) {\r\n this.props.onContextMenu(node, event);\r\n }\r\n }\r\n /** @internal */\r\n auxMouseClick(node, event) {\r\n if (this.props.onAuxMouseClick) {\r\n this.props.onAuxMouseClick(node, event);\r\n }\r\n }\r\n}\r\n/** @internal */\r\nconst DragRectRenderWrapper = (props) => {\r\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\r\n var _a;\r\n (_a = props.onRendered) === null || _a === void 0 ? void 0 : _a.call(props);\r\n }, [props]);\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, props.children));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Layout.tsx?");
|
|
349
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Layout\": () => (/* binding */ Layout)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _DockLocation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../DockLocation */ \"./src/DockLocation.ts\");\n/* harmony import */ var _DragDrop__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../DragDrop */ \"./src/DragDrop.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _model_BorderNode__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../model/BorderNode */ \"./src/model/BorderNode.ts\");\n/* harmony import */ var _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../model/SplitterNode */ \"./src/model/SplitterNode.ts\");\n/* harmony import */ var _model_TabNode__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../model/TabNode */ \"./src/model/TabNode.ts\");\n/* harmony import */ var _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../model/TabSetNode */ \"./src/model/TabSetNode.ts\");\n/* harmony import */ var _Rect__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../Rect */ \"./src/Rect.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _BorderTabSet__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./BorderTabSet */ \"./src/view/BorderTabSet.tsx\");\n/* harmony import */ var _Splitter__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./Splitter */ \"./src/view/Splitter.tsx\");\n/* harmony import */ var _Tab__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./Tab */ \"./src/view/Tab.tsx\");\n/* harmony import */ var _TabSet__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./TabSet */ \"./src/view/TabSet.tsx\");\n/* harmony import */ var _FloatingWindow__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./FloatingWindow */ \"./src/view/FloatingWindow.tsx\");\n/* harmony import */ var _FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./FloatingWindowTab */ \"./src/view/FloatingWindowTab.tsx\");\n/* harmony import */ var _TabFloating__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./TabFloating */ \"./src/view/TabFloating.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Icons__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./Icons */ \"./src/view/Icons.tsx\");\n/* harmony import */ var _TabButtonStamp__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./TabButtonStamp */ \"./src/view/TabButtonStamp.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nconst defaultIcons = {\r\n close: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.CloseIcon, null),\r\n closeTabset: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.CloseIcon, null),\r\n popout: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.PopoutIcon, null),\r\n maximize: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.MaximizeIcon, null),\r\n restore: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.RestoreIcon, null),\r\n more: react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Icons__WEBPACK_IMPORTED_MODULE_19__.OverflowIcon, null),\r\n};\r\n// Popout windows work in latest browsers based on webkit (Chrome, Opera, Safari, latest Edge) and Firefox. They do\r\n// not work on any version if IE or the original Edge browser\r\n// Assume any recent desktop browser not IE or original Edge will work\r\n/** @internal */\r\n// @ts-ignore\r\nconst isIEorEdge = typeof window !== \"undefined\" && (window.document.documentMode || /Edge\\//.test(window.navigator.userAgent));\r\n/** @internal */\r\nconst isDesktop = typeof window !== \"undefined\" && window.matchMedia && window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches;\r\n/** @internal */\r\nconst defaultSupportsPopout = isDesktop && !isIEorEdge;\r\n/**\r\n * A React component that hosts a multi-tabbed layout\r\n */\r\nclass Layout extends react__WEBPACK_IMPORTED_MODULE_0__.Component {\r\n constructor(props) {\r\n super(props);\r\n /** @internal */\r\n this.firstMove = false;\r\n /** @internal */\r\n this.dragRectRendered = true;\r\n /** @internal */\r\n this.dragDivText = undefined;\r\n /** @internal */\r\n this.edgeRectLength = 100;\r\n /** @internal */\r\n this.edgeRectWidth = 10;\r\n /** @internal */\r\n this.onModelChange = (action) => {\r\n this.forceUpdate();\r\n if (this.props.onModelChange) {\r\n this.props.onModelChange(this.props.model, action);\r\n }\r\n };\r\n /** @internal */\r\n this.updateRect = (domRect = this.getDomRect()) => {\r\n const rect = new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, domRect.width, domRect.height);\r\n if (!rect.equals(this.state.rect) && rect.width !== 0 && rect.height !== 0) {\r\n this.setState({ rect });\r\n }\r\n };\r\n /** @internal */\r\n this.updateLayoutMetrics = () => {\r\n if (this.findHeaderBarSizeRef.current) {\r\n const headerBarSize = this.findHeaderBarSizeRef.current.getBoundingClientRect().height;\r\n if (headerBarSize !== this.state.calculatedHeaderBarSize) {\r\n this.setState({ calculatedHeaderBarSize: headerBarSize });\r\n }\r\n }\r\n if (this.findTabBarSizeRef.current) {\r\n const tabBarSize = this.findTabBarSizeRef.current.getBoundingClientRect().height;\r\n if (tabBarSize !== this.state.calculatedTabBarSize) {\r\n this.setState({ calculatedTabBarSize: tabBarSize });\r\n }\r\n }\r\n if (this.findBorderBarSizeRef.current) {\r\n const borderBarSize = this.findBorderBarSizeRef.current.getBoundingClientRect().height;\r\n if (borderBarSize !== this.state.calculatedBorderBarSize) {\r\n this.setState({ calculatedBorderBarSize: borderBarSize });\r\n }\r\n }\r\n };\r\n /** @internal */\r\n this.getClassName = (defaultClassName) => {\r\n if (this.props.classNameMapper === undefined) {\r\n return defaultClassName;\r\n }\r\n else {\r\n return this.props.classNameMapper(defaultClassName);\r\n }\r\n };\r\n /** @internal */\r\n this.onCloseWindow = (id) => {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.unFloatTab(id));\r\n try {\r\n this.props.model.getNodeById(id)._setWindow(undefined);\r\n }\r\n catch (e) {\r\n // catch incase it was a model change\r\n }\r\n };\r\n /** @internal */\r\n this.onSetWindow = (id, window) => {\r\n this.props.model.getNodeById(id)._setWindow(window);\r\n };\r\n /** @internal */\r\n this.onCancelAdd = () => {\r\n var _a, _b;\r\n const rootdiv = this.selfRef.current;\r\n rootdiv.removeChild(this.dragDiv);\r\n this.dragDiv = undefined;\r\n this.hidePortal();\r\n if (this.fnNewNodeDropped != null) {\r\n this.fnNewNodeDropped();\r\n this.fnNewNodeDropped = undefined;\r\n }\r\n try {\r\n (_b = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated) === null || _b === void 0 ? void 0 : _b.call(_a);\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n this.newTabJson = undefined;\r\n this.customDrop = undefined;\r\n };\r\n /** @internal */\r\n this.onCancelDrag = (wasDragging) => {\r\n var _a, _b;\r\n if (wasDragging) {\r\n const rootdiv = this.selfRef.current;\r\n try {\r\n rootdiv.removeChild(this.outlineDiv);\r\n }\r\n catch (e) { }\r\n try {\r\n rootdiv.removeChild(this.dragDiv);\r\n }\r\n catch (e) { }\r\n this.dragDiv = undefined;\r\n this.hidePortal();\r\n this.setState({ showEdges: false });\r\n if (this.fnNewNodeDropped != null) {\r\n this.fnNewNodeDropped();\r\n this.fnNewNodeDropped = undefined;\r\n }\r\n try {\r\n (_b = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated) === null || _b === void 0 ? void 0 : _b.call(_a);\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n this.newTabJson = undefined;\r\n this.customDrop = undefined;\r\n }\r\n this.setState({ showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER });\r\n };\r\n /** @internal */\r\n this.onDragDivMouseDown = (event) => {\r\n event.preventDefault();\r\n this.dragStart(event, this.dragDivText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(this.newTabJson, this.props.model, false), true, undefined, undefined);\r\n };\r\n /** @internal */\r\n this.dragStart = (event, dragDivText, node, allowDrag, onClick, onDoubleClick) => {\r\n if (!allowDrag) {\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.startDrag(event, undefined, undefined, undefined, undefined, onClick, onDoubleClick, this.currentDocument, this.selfRef.current);\r\n }\r\n else {\r\n this.dragNode = node;\r\n this.dragDivText = dragDivText;\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.startDrag(event, this.onDragStart, this.onDragMove, this.onDragEnd, this.onCancelDrag, onClick, onDoubleClick, this.currentDocument, this.selfRef.current);\r\n }\r\n };\r\n /** @internal */\r\n this.dragRectRender = (text, node, json, onRendered) => {\r\n let content;\r\n if (text !== undefined) {\r\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { whiteSpace: \"pre\" } }, text.replace(\"<br>\", \"\\n\"));\r\n }\r\n else {\r\n if (node && node instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n content = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButtonStamp__WEBPACK_IMPORTED_MODULE_20__.TabButtonStamp, { node: node, layout: this, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory }));\r\n }\r\n }\r\n if (this.props.onRenderDragRect !== undefined) {\r\n const customContent = this.props.onRenderDragRect(content, node, json);\r\n if (customContent !== undefined) {\r\n content = customContent;\r\n }\r\n }\r\n // hide div until the render is complete\r\n this.dragDiv.style.visibility = \"hidden\";\r\n this.dragRectRendered = false;\r\n this.showPortal(react__WEBPACK_IMPORTED_MODULE_0__.createElement(DragRectRenderWrapper\r\n // wait for it to be rendered\r\n , { \r\n // wait for it to be rendered\r\n onRendered: () => {\r\n this.dragRectRendered = true;\r\n onRendered === null || onRendered === void 0 ? void 0 : onRendered();\r\n } }, content), this.dragDiv);\r\n };\r\n /** @internal */\r\n this.showPortal = (control, element) => {\r\n const portal = (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(control, element);\r\n this.setState({ portal });\r\n };\r\n /** @internal */\r\n this.hidePortal = () => {\r\n this.setState({ portal: undefined });\r\n };\r\n /** @internal */\r\n this.onDragStart = () => {\r\n this.dropInfo = undefined;\r\n this.customDrop = undefined;\r\n const rootdiv = this.selfRef.current;\r\n this.outlineDiv = this.currentDocument.createElement(\"div\");\r\n this.outlineDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__OUTLINE_RECT);\r\n this.outlineDiv.style.visibility = \"hidden\";\r\n rootdiv.appendChild(this.outlineDiv);\r\n if (this.dragDiv == null) {\r\n this.dragDiv = this.currentDocument.createElement(\"div\");\r\n this.dragDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__DRAG_RECT);\r\n this.dragDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\r\n this.dragRectRender(this.dragDivText, this.dragNode, this.newTabJson);\r\n rootdiv.appendChild(this.dragDiv);\r\n }\r\n // add edge indicators\r\n if (this.props.model.getMaximizedTabset() === undefined) {\r\n this.setState({ showEdges: this.props.model.isEnableEdgeDock() });\r\n }\r\n if (this.dragNode !== undefined && this.dragNode instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode && this.dragNode.getTabRect() !== undefined) {\r\n this.dragNode.getTabRect().positionElement(this.outlineDiv);\r\n }\r\n this.firstMove = true;\r\n return true;\r\n };\r\n /** @internal */\r\n this.onDragMove = (event) => {\r\n if (this.firstMove === false) {\r\n const speed = this.props.model._getAttribute(\"tabDragSpeed\");\r\n this.outlineDiv.style.transition = `top ${speed}s, left ${speed}s, width ${speed}s, height ${speed}s`;\r\n }\r\n this.firstMove = false;\r\n const clientRect = this.selfRef.current.getBoundingClientRect();\r\n const pos = {\r\n x: event.clientX - clientRect.left,\r\n y: event.clientY - clientRect.top,\r\n };\r\n this.checkForBorderToShow(pos.x, pos.y);\r\n // keep it between left & right\r\n const dragRect = this.dragDiv.getBoundingClientRect();\r\n let newLeft = pos.x - dragRect.width / 2;\r\n if (newLeft + dragRect.width > clientRect.width) {\r\n newLeft = clientRect.width - dragRect.width;\r\n }\r\n newLeft = Math.max(0, newLeft);\r\n this.dragDiv.style.left = newLeft + \"px\";\r\n this.dragDiv.style.top = pos.y + 5 + \"px\";\r\n if (this.dragRectRendered && this.dragDiv.style.visibility === \"hidden\") {\r\n // make visible once the drag rect has been rendered\r\n this.dragDiv.style.visibility = \"visible\";\r\n }\r\n let dropInfo = this.props.model._findDropTargetNode(this.dragNode, pos.x, pos.y);\r\n if (dropInfo) {\r\n if (this.props.onTabDrag) {\r\n this.handleCustomTabDrag(dropInfo, pos, event);\r\n }\r\n else {\r\n this.dropInfo = dropInfo;\r\n this.outlineDiv.className = this.getClassName(dropInfo.className);\r\n dropInfo.rect.positionElement(this.outlineDiv);\r\n this.outlineDiv.style.visibility = \"visible\";\r\n }\r\n }\r\n };\r\n /** @internal */\r\n this.onDragEnd = (event) => {\r\n const rootdiv = this.selfRef.current;\r\n rootdiv.removeChild(this.outlineDiv);\r\n rootdiv.removeChild(this.dragDiv);\r\n this.dragDiv = undefined;\r\n this.hidePortal();\r\n this.setState({ showEdges: false });\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.hideGlass();\r\n if (this.dropInfo) {\r\n if (this.customDrop) {\r\n this.newTabJson = undefined;\r\n try {\r\n const { callback, dragging, over, x, y, location } = this.customDrop;\r\n callback(dragging, over, x, y, location);\r\n if (this.fnNewNodeDropped != null) {\r\n this.fnNewNodeDropped();\r\n this.fnNewNodeDropped = undefined;\r\n }\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n }\r\n else if (this.newTabJson !== undefined) {\r\n const newNode = this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(this.newTabJson, this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\r\n if (this.fnNewNodeDropped != null) {\r\n this.fnNewNodeDropped(newNode, event);\r\n this.fnNewNodeDropped = undefined;\r\n }\r\n this.newTabJson = undefined;\r\n }\r\n else if (this.dragNode !== undefined) {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.moveNode(this.dragNode.getId(), this.dropInfo.node.getId(), this.dropInfo.location, this.dropInfo.index));\r\n }\r\n }\r\n this.setState({ showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER });\r\n };\r\n this.props.model._setChangeListener(this.onModelChange);\r\n this.tabIds = [];\r\n this.selfRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n this.findHeaderBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n this.findTabBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n this.findBorderBarSizeRef = react__WEBPACK_IMPORTED_MODULE_0__.createRef();\r\n this.supportsPopout = props.supportsPopout !== undefined ? props.supportsPopout : defaultSupportsPopout;\r\n this.popoutURL = props.popoutURL ? props.popoutURL : \"popout.html\";\r\n this.icons = Object.assign(Object.assign({}, defaultIcons), props.icons);\r\n this.state = {\r\n rect: new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, 0, 0),\r\n calculatedHeaderBarSize: 25,\r\n calculatedTabBarSize: 26,\r\n calculatedBorderBarSize: 30,\r\n editingTab: undefined,\r\n showHiddenBorder: _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER,\r\n showEdges: false,\r\n };\r\n this.onDragEnter = this.onDragEnter.bind(this);\r\n }\r\n /** @internal */\r\n styleFont(style) {\r\n if (this.props.font) {\r\n if (this.selfRef.current) {\r\n if (this.props.font.size) {\r\n this.selfRef.current.style.setProperty(\"--font-size\", this.props.font.size);\r\n }\r\n if (this.props.font.family) {\r\n this.selfRef.current.style.setProperty(\"--font-family\", this.props.font.family);\r\n }\r\n }\r\n if (this.props.font.style) {\r\n style.fontStyle = this.props.font.style;\r\n }\r\n if (this.props.font.weight) {\r\n style.fontWeight = this.props.font.weight;\r\n }\r\n }\r\n return style;\r\n }\r\n /** @internal */\r\n doAction(action) {\r\n if (this.props.onAction !== undefined) {\r\n const outcome = this.props.onAction(action);\r\n if (outcome !== undefined) {\r\n return this.props.model.doAction(outcome);\r\n }\r\n return undefined;\r\n }\r\n else {\r\n return this.props.model.doAction(action);\r\n }\r\n }\r\n /** @internal */\r\n componentDidMount() {\r\n this.updateRect();\r\n this.updateLayoutMetrics();\r\n // need to re-render if size changes\r\n this.currentDocument = this.selfRef.current.ownerDocument;\r\n this.currentWindow = this.currentDocument.defaultView;\r\n this.resizeObserver = new ResizeObserver(entries => {\r\n this.updateRect(entries[0].contentRect);\r\n });\r\n this.resizeObserver.observe(this.selfRef.current);\r\n }\r\n /** @internal */\r\n componentDidUpdate() {\r\n this.updateLayoutMetrics();\r\n if (this.props.model !== this.previousModel) {\r\n if (this.previousModel !== undefined) {\r\n this.previousModel._setChangeListener(undefined); // stop listening to old model\r\n }\r\n this.props.model._setChangeListener(this.onModelChange);\r\n this.previousModel = this.props.model;\r\n }\r\n // console.log(\"Layout time: \" + this.layoutTime + \"ms Render time: \" + (Date.now() - this.start) + \"ms\");\r\n }\r\n /** @internal */\r\n getCurrentDocument() {\r\n return this.currentDocument;\r\n }\r\n /** @internal */\r\n getDomRect() {\r\n return this.selfRef.current.getBoundingClientRect();\r\n }\r\n /** @internal */\r\n getRootDiv() {\r\n return this.selfRef.current;\r\n }\r\n /** @internal */\r\n isSupportsPopout() {\r\n return this.supportsPopout;\r\n }\r\n /** @internal */\r\n isRealtimeResize() {\r\n var _a;\r\n return (_a = this.props.realtimeResize) !== null && _a !== void 0 ? _a : false;\r\n }\r\n /** @internal */\r\n onTabDrag(...args) {\r\n var _a, _b;\r\n return (_b = (_a = this.props).onTabDrag) === null || _b === void 0 ? void 0 : _b.call(_a, ...args);\r\n }\r\n /** @internal */\r\n getPopoutURL() {\r\n return this.popoutURL;\r\n }\r\n /** @internal */\r\n componentWillUnmount() {\r\n var _a;\r\n (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.selfRef.current);\r\n }\r\n /** @internal */\r\n setEditingTab(tabNode) {\r\n this.setState({ editingTab: tabNode });\r\n }\r\n /** @internal */\r\n getEditingTab() {\r\n return this.state.editingTab;\r\n }\r\n /** @internal */\r\n render() {\r\n // first render will be used to find the size (via selfRef)\r\n if (!this.selfRef.current) {\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__LAYOUT) }, this.metricsElements()));\r\n }\r\n this.props.model._setPointerFine(window && window.matchMedia && window.matchMedia(\"(pointer: fine)\").matches);\r\n // this.start = Date.now();\r\n const borderComponents = [];\r\n const tabSetComponents = [];\r\n const floatingWindows = [];\r\n const tabComponents = {};\r\n const splitterComponents = [];\r\n const metrics = {\r\n headerBarSize: this.state.calculatedHeaderBarSize,\r\n tabBarSize: this.state.calculatedTabBarSize,\r\n borderBarSize: this.state.calculatedBorderBarSize\r\n };\r\n this.props.model._setShowHiddenBorder(this.state.showHiddenBorder);\r\n this.centerRect = this.props.model._layout(this.state.rect, metrics);\r\n this.renderBorder(this.props.model.getBorderSet(), borderComponents, tabComponents, floatingWindows, splitterComponents);\r\n this.renderChildren(\"\", this.props.model.getRoot(), tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n const nextTopIds = [];\r\n const nextTopIdsMap = {};\r\n // Keep any previous tabs in the same DOM order as before, removing any that have been deleted\r\n for (const t of this.tabIds) {\r\n if (tabComponents[t]) {\r\n nextTopIds.push(t);\r\n nextTopIdsMap[t] = t;\r\n }\r\n }\r\n this.tabIds = nextTopIds;\r\n // Add tabs that have been added to the DOM\r\n for (const t of Object.keys(tabComponents)) {\r\n if (!nextTopIdsMap[t]) {\r\n this.tabIds.push(t);\r\n }\r\n }\r\n const edges = [];\r\n if (this.state.showEdges) {\r\n const r = this.centerRect;\r\n const length = this.edgeRectLength;\r\n const width = this.edgeRectWidth;\r\n const offset = this.edgeRectLength / 2;\r\n const className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__EDGE_RECT);\r\n const radius = 50;\r\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"North\", style: { top: r.y, left: r.x + r.width / 2 - offset, width: length, height: width, borderBottomLeftRadius: radius, borderBottomRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__EDGE_RECT_TOP) }));\r\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"West\", style: { top: r.y + r.height / 2 - offset, left: r.x, width: width, height: length, borderTopRightRadius: radius, borderBottomRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__EDGE_RECT_LEFT) }));\r\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"South\", style: { top: r.y + r.height - width, left: r.x + r.width / 2 - offset, width: length, height: width, borderTopLeftRadius: radius, borderTopRightRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__EDGE_RECT_BOTTOM) }));\r\n edges.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"East\", style: { top: r.y + r.height / 2 - offset, left: r.x + r.width - width, width: width, height: length, borderTopLeftRadius: radius, borderBottomLeftRadius: radius }, className: className + \" \" + this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__EDGE_RECT_RIGHT) }));\r\n }\r\n // this.layoutTime = (Date.now() - this.start);\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: this.selfRef, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__LAYOUT), onDragEnter: this.props.onExternalDrag ? this.onDragEnter : undefined },\r\n tabSetComponents,\r\n this.tabIds.map((t) => {\r\n return tabComponents[t];\r\n }),\r\n borderComponents,\r\n splitterComponents,\r\n edges,\r\n floatingWindows,\r\n this.metricsElements(),\r\n this.state.portal));\r\n }\r\n /** @internal */\r\n metricsElements() {\r\n // used to measure the tab and border tab sizes\r\n const fontStyle = this.styleFont({ visibility: \"hidden\" });\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findHeaderBarSize\", ref: this.findHeaderBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__TABSET_HEADER_SIZER) }, \"FindHeaderBarSize\"),\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findTabBarSize\", ref: this.findTabBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__TABSET_SIZER) }, \"FindTabBarSize\"),\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"findBorderBarSize\", ref: this.findBorderBarSizeRef, style: fontStyle, className: this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__BORDER_SIZER) }, \"FindBorderBarSize\")));\r\n }\r\n /** @internal */\r\n renderBorder(borderSet, borderComponents, tabComponents, floatingWindows, splitterComponents) {\r\n for (const border of borderSet.getBorders()) {\r\n const borderPath = `/border/${border.getLocation().getName()}`;\r\n if (border.isShowing()) {\r\n borderComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BorderTabSet__WEBPACK_IMPORTED_MODULE_11__.BorderTabSet, { key: `border_${border.getLocation().getName()}`, path: borderPath, border: border, layout: this, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory, icons: this.icons }));\r\n const drawChildren = border._getDrawChildren();\r\n let i = 0;\r\n let tabCount = 0;\r\n for (const child of drawChildren) {\r\n if (child instanceof _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__.SplitterNode) {\r\n let path = borderPath + \"/s\";\r\n splitterComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Splitter__WEBPACK_IMPORTED_MODULE_12__.Splitter, { key: child.getId(), layout: this, node: child, path: path }));\r\n }\r\n else if (child instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n let path = borderPath + \"/t\" + tabCount++;\r\n if (this.supportsPopout && child.isFloating()) {\r\n const rect = this._getScreenRect(child);\r\n const tabBorderWidth = child._getAttr(\"borderWidth\");\r\n const tabBorderHeight = child._getAttr(\"borderHeight\");\r\n if (tabBorderWidth !== -1 && border.getLocation().getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_18__.Orientation.HORZ) {\r\n rect.width = tabBorderWidth;\r\n }\r\n else if (tabBorderHeight !== -1 && border.getLocation().getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_18__.Orientation.VERT) {\r\n rect.height = tabBorderHeight;\r\n }\r\n floatingWindows.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindow__WEBPACK_IMPORTED_MODULE_15__.FloatingWindow, { key: child.getId(), url: this.popoutURL, rect: rect, title: child.getName(), id: child.getId(), onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__.FloatingWindowTab, { layout: this, node: child, factory: this.props.factory })));\r\n tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabFloating__WEBPACK_IMPORTED_MODULE_17__.TabFloating, { key: child.getId(), layout: this, path: path, node: child, selected: i === border.getSelected() });\r\n }\r\n else {\r\n tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tab__WEBPACK_IMPORTED_MODULE_13__.Tab, { key: child.getId(), layout: this, path: path, node: child, selected: i === border.getSelected(), factory: this.props.factory });\r\n }\r\n }\r\n i++;\r\n }\r\n }\r\n }\r\n }\r\n /** @internal */\r\n renderChildren(path, node, tabSetComponents, tabComponents, floatingWindows, splitterComponents) {\r\n const drawChildren = node._getDrawChildren();\r\n let splitterCount = 0;\r\n let tabCount = 0;\r\n let rowCount = 0;\r\n for (const child of drawChildren) {\r\n if (child instanceof _model_SplitterNode__WEBPACK_IMPORTED_MODULE_6__.SplitterNode) {\r\n const newPath = path + \"/s\" + (splitterCount++);\r\n splitterComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Splitter__WEBPACK_IMPORTED_MODULE_12__.Splitter, { key: child.getId(), layout: this, path: newPath, node: child }));\r\n }\r\n else if (child instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__.TabSetNode) {\r\n const newPath = path + \"/ts\" + (rowCount++);\r\n tabSetComponents.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabSet__WEBPACK_IMPORTED_MODULE_14__.TabSet, { key: child.getId(), layout: this, path: newPath, node: child, iconFactory: this.props.iconFactory, titleFactory: this.props.titleFactory, icons: this.icons }));\r\n this.renderChildren(newPath, child, tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n }\r\n else if (child instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode) {\r\n const newPath = path + \"/t\" + (tabCount++);\r\n const selectedTab = child.getParent().getChildren()[child.getParent().getSelected()];\r\n if (selectedTab === undefined) {\r\n // this should not happen!\r\n console.warn(\"undefined selectedTab should not happen\");\r\n }\r\n if (this.supportsPopout && child.isFloating()) {\r\n const rect = this._getScreenRect(child);\r\n floatingWindows.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindow__WEBPACK_IMPORTED_MODULE_15__.FloatingWindow, { key: child.getId(), url: this.popoutURL, rect: rect, title: child.getName(), id: child.getId(), onSetWindow: this.onSetWindow, onCloseWindow: this.onCloseWindow },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FloatingWindowTab__WEBPACK_IMPORTED_MODULE_16__.FloatingWindowTab, { layout: this, node: child, factory: this.props.factory })));\r\n tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabFloating__WEBPACK_IMPORTED_MODULE_17__.TabFloating, { key: child.getId(), layout: this, path: newPath, node: child, selected: child === selectedTab });\r\n }\r\n else {\r\n tabComponents[child.getId()] = react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Tab__WEBPACK_IMPORTED_MODULE_13__.Tab, { key: child.getId(), layout: this, path: newPath, node: child, selected: child === selectedTab, factory: this.props.factory });\r\n }\r\n }\r\n else {\r\n // is row\r\n const newPath = path + ((child.getOrientation() === _Orientation__WEBPACK_IMPORTED_MODULE_18__.Orientation.HORZ) ? \"/r\" : \"/c\") + (rowCount++);\r\n this.renderChildren(newPath, child, tabSetComponents, tabComponents, floatingWindows, splitterComponents);\r\n }\r\n }\r\n }\r\n /** @internal */\r\n _getScreenRect(node) {\r\n const rect = node.getRect().clone();\r\n const bodyRect = this.selfRef.current.getBoundingClientRect();\r\n const navHeight = Math.min(80, this.currentWindow.outerHeight - this.currentWindow.innerHeight);\r\n const navWidth = Math.min(80, this.currentWindow.outerWidth - this.currentWindow.innerWidth);\r\n rect.x = rect.x + bodyRect.x + this.currentWindow.screenX + navWidth;\r\n rect.y = rect.y + bodyRect.y + this.currentWindow.screenY + navHeight;\r\n return rect;\r\n }\r\n /**\r\n * Adds a new tab to the given tabset\r\n * @param tabsetId the id of the tabset where the new tab will be added\r\n * @param json the json for the new tab node\r\n */\r\n addTabToTabSet(tabsetId, json) {\r\n const tabsetNode = this.props.model.getNodeById(tabsetId);\r\n if (tabsetNode !== undefined) {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(json, tabsetId, _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, -1));\r\n }\r\n }\r\n /**\r\n * Adds a new tab to the active tabset (if there is one)\r\n * @param json the json for the new tab node\r\n */\r\n addTabToActiveTabSet(json) {\r\n const tabsetNode = this.props.model.getActiveTabset();\r\n if (tabsetNode !== undefined) {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.addNode(json, tabsetNode.getId(), _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER, -1));\r\n }\r\n }\r\n /**\r\n * Adds a new tab by dragging a labeled panel to the drop location, dragging starts immediatelly\r\n * @param dragText the text to show on the drag panel\r\n * @param json the json for the new tab node\r\n * @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)\r\n */\r\n addTabWithDragAndDrop(dragText, json, onDrop) {\r\n this.fnNewNodeDropped = onDrop;\r\n this.newTabJson = json;\r\n this.dragStart(undefined, dragText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(json, this.props.model, false), true, undefined, undefined);\r\n }\r\n /**\r\n * Move a tab/tabset using drag and drop\r\n * @param node the tab or tabset to drag\r\n * @param dragText the text to show on the drag panel\r\n */\r\n moveTabWithDragAndDrop(node, dragText) {\r\n this.dragStart(undefined, dragText, node, true, undefined, undefined);\r\n }\r\n /**\r\n * Adds a new tab by dragging a labeled panel to the drop location, dragging starts when you\r\n * mouse down on the panel\r\n *\r\n * @param dragText the text to show on the drag panel\r\n * @param json the json for the new tab node\r\n * @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)\r\n */\r\n addTabWithDragAndDropIndirect(dragText, json, onDrop) {\r\n this.fnNewNodeDropped = onDrop;\r\n this.newTabJson = json;\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.addGlass(this.onCancelAdd);\r\n this.dragDivText = dragText;\r\n this.dragDiv = this.currentDocument.createElement(\"div\");\r\n this.dragDiv.className = this.getClassName(_Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__DRAG_RECT);\r\n this.dragDiv.addEventListener(\"mousedown\", this.onDragDivMouseDown);\r\n this.dragDiv.addEventListener(\"touchstart\", this.onDragDivMouseDown, { passive: false });\r\n this.dragRectRender(this.dragDivText, undefined, this.newTabJson, () => {\r\n if (this.dragDiv) {\r\n // now it's been rendered into the dom it can be centered\r\n this.dragDiv.style.visibility = \"visible\";\r\n const domRect = this.dragDiv.getBoundingClientRect();\r\n const r = new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(0, 0, domRect === null || domRect === void 0 ? void 0 : domRect.width, domRect === null || domRect === void 0 ? void 0 : domRect.height);\r\n r.centerInRect(this.state.rect);\r\n this.dragDiv.setAttribute(\"data-layout-path\", \"/drag-rectangle\");\r\n this.dragDiv.style.left = r.x + \"px\";\r\n this.dragDiv.style.top = r.y + \"px\";\r\n }\r\n });\r\n const rootdiv = this.selfRef.current;\r\n rootdiv.appendChild(this.dragDiv);\r\n }\r\n /** @internal */\r\n handleCustomTabDrag(dropInfo, pos, event) {\r\n var _a, _b, _c;\r\n let invalidated = (_a = this.customDrop) === null || _a === void 0 ? void 0 : _a.invalidated;\r\n const currentCallback = (_b = this.customDrop) === null || _b === void 0 ? void 0 : _b.callback;\r\n this.customDrop = undefined;\r\n const dragging = this.newTabJson || (this.dragNode instanceof _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode ? this.dragNode : undefined);\r\n if (dragging && (dropInfo.node instanceof _model_TabSetNode__WEBPACK_IMPORTED_MODULE_8__.TabSetNode || dropInfo.node instanceof _model_BorderNode__WEBPACK_IMPORTED_MODULE_5__.BorderNode) && dropInfo.index === -1) {\r\n const selected = dropInfo.node.getSelectedNode();\r\n const tabRect = selected === null || selected === void 0 ? void 0 : selected.getRect();\r\n if (selected && (tabRect === null || tabRect === void 0 ? void 0 : tabRect.contains(pos.x, pos.y))) {\r\n let customDrop = undefined;\r\n try {\r\n const dest = this.onTabDrag(dragging, selected, pos.x - tabRect.x, pos.y - tabRect.y, dropInfo.location, () => this.onDragMove(event));\r\n if (dest) {\r\n customDrop = {\r\n rect: new _Rect__WEBPACK_IMPORTED_MODULE_9__.Rect(dest.x + tabRect.x, dest.y + tabRect.y, dest.width, dest.height),\r\n callback: dest.callback,\r\n invalidated: dest.invalidated,\r\n dragging: dragging,\r\n over: selected,\r\n x: pos.x - tabRect.x,\r\n y: pos.y - tabRect.y,\r\n location: dropInfo.location,\r\n cursor: dest.cursor\r\n };\r\n }\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n if ((customDrop === null || customDrop === void 0 ? void 0 : customDrop.callback) === currentCallback) {\r\n invalidated = undefined;\r\n }\r\n this.customDrop = customDrop;\r\n }\r\n }\r\n this.dropInfo = dropInfo;\r\n this.outlineDiv.className = this.getClassName(this.customDrop ? _Types__WEBPACK_IMPORTED_MODULE_10__.CLASSES.FLEXLAYOUT__OUTLINE_RECT : dropInfo.className);\r\n if (this.customDrop) {\r\n this.customDrop.rect.positionElement(this.outlineDiv);\r\n }\r\n else {\r\n dropInfo.rect.positionElement(this.outlineDiv);\r\n }\r\n _DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.setGlassCursorOverride((_c = this.customDrop) === null || _c === void 0 ? void 0 : _c.cursor);\r\n this.outlineDiv.style.visibility = \"visible\";\r\n try {\r\n invalidated === null || invalidated === void 0 ? void 0 : invalidated();\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n }\r\n /** @internal */\r\n onDragEnter(event) {\r\n // DragDrop keeps track of number of dragenters minus the number of\r\n // dragleaves. Only start a new drag if there isn't one already.\r\n if (_DragDrop__WEBPACK_IMPORTED_MODULE_3__.DragDrop.instance.isDragging())\r\n return;\r\n const drag = this.props.onExternalDrag(event);\r\n if (drag) {\r\n // Mimic addTabWithDragAndDrop, but pass in DragEvent\r\n this.fnNewNodeDropped = drag.onDrop;\r\n this.newTabJson = drag.json;\r\n this.dragStart(event, drag.dragText, _model_TabNode__WEBPACK_IMPORTED_MODULE_7__.TabNode._fromJson(drag.json, this.props.model, false), true, undefined, undefined);\r\n }\r\n }\r\n /** @internal */\r\n checkForBorderToShow(x, y) {\r\n const r = this.props.model._getOuterInnerRects().outer;\r\n const c = r.getCenter();\r\n const margin = this.edgeRectWidth;\r\n const offset = this.edgeRectLength / 2;\r\n let overEdge = false;\r\n if (this.props.model.isEnableEdgeDock() && this.state.showHiddenBorder === _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER) {\r\n if ((y > c.y - offset && y < c.y + offset) ||\r\n (x > c.x - offset && x < c.x + offset)) {\r\n overEdge = true;\r\n }\r\n }\r\n let location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.CENTER;\r\n if (!overEdge) {\r\n if (x <= r.x + margin) {\r\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.LEFT;\r\n }\r\n else if (x >= r.getRight() - margin) {\r\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.RIGHT;\r\n }\r\n else if (y <= r.y + margin) {\r\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.TOP;\r\n }\r\n else if (y >= r.getBottom() - margin) {\r\n location = _DockLocation__WEBPACK_IMPORTED_MODULE_2__.DockLocation.BOTTOM;\r\n }\r\n }\r\n if (location !== this.state.showHiddenBorder) {\r\n this.setState({ showHiddenBorder: location });\r\n }\r\n }\r\n /** @internal */\r\n maximize(tabsetNode) {\r\n this.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_4__.Actions.maximizeToggle(tabsetNode.getId()));\r\n }\r\n /** @internal */\r\n customizeTab(tabNode, renderValues) {\r\n if (this.props.onRenderTab) {\r\n this.props.onRenderTab(tabNode, renderValues);\r\n }\r\n }\r\n /** @internal */\r\n customizeTabSet(tabSetNode, renderValues) {\r\n if (this.props.onRenderTabSet) {\r\n this.props.onRenderTabSet(tabSetNode, renderValues);\r\n }\r\n }\r\n /** @internal */\r\n i18nName(id, param) {\r\n let message;\r\n if (this.props.i18nMapper) {\r\n message = this.props.i18nMapper(id, param);\r\n }\r\n if (message === undefined) {\r\n message = id + (param === undefined ? \"\" : param);\r\n }\r\n return message;\r\n }\r\n /** @internal */\r\n getOnRenderFloatingTabPlaceholder() {\r\n return this.props.onRenderFloatingTabPlaceholder;\r\n }\r\n /** @internal */\r\n getShowOverflowMenu() {\r\n return this.props.onShowOverflowMenu;\r\n }\r\n /** @internal */\r\n getTabSetPlaceHolderCallback() {\r\n return this.props.onTabSetPlaceHolder;\r\n }\r\n /** @internal */\r\n showContextMenu(node, event) {\r\n if (this.props.onContextMenu) {\r\n this.props.onContextMenu(node, event);\r\n }\r\n }\r\n /** @internal */\r\n auxMouseClick(node, event) {\r\n if (this.props.onAuxMouseClick) {\r\n this.props.onAuxMouseClick(node, event);\r\n }\r\n }\r\n}\r\n/** @internal */\r\nconst DragRectRenderWrapper = (props) => {\r\n react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {\r\n var _a;\r\n (_a = props.onRendered) === null || _a === void 0 ? void 0 : _a.call(props);\r\n }, [props]);\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, props.children));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Layout.tsx?");
|
|
350
350
|
|
|
351
351
|
/***/ }),
|
|
352
352
|
|
|
@@ -416,7 +416,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
416
416
|
\*****************************/
|
|
417
417
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
418
418
|
|
|
419
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"TabSet\": () => (/* binding */ TabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../PopupMenu */ \"./src/PopupMenu.tsx\");\n/* harmony import */ var _TabButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./TabButton */ \"./src/view/TabButton.tsx\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst TabSet = (props) => {\r\n const { node, layout, iconFactory, titleFactory, icons, path } = props;\r\n const toolbarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const tabbarInnerRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__.useTabOverflow)(node, _Orientation__WEBPACK_IMPORTED_MODULE_6__.Orientation.HORZ, toolbarRef, stickyButtonsRef);\r\n const onOverflowClick = (event) => {\r\n const callback = layout.getShowOverflowMenu();\r\n if (callback !== undefined) {\r\n callback(node, event, hiddenTabs, onOverflowItemSelect);\r\n }\r\n else {\r\n const element = overflowbuttonRef.current;\r\n (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout, iconFactory, titleFactory);\r\n }\r\n event.stopPropagation();\r\n };\r\n const onOverflowItemSelect = (item) => {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(item.node.getId()));\r\n userControlledLeft.current = false;\r\n };\r\n const onMouseDown = (event) => {\r\n if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\r\n let name = node.getName();\r\n if (name === undefined) {\r\n name = \"\";\r\n }\r\n else {\r\n name = \": \" + name;\r\n }\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.setActiveTabset(node.getId()));\r\n if (!layout.getEditingTab()) {\r\n const message = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Move_Tabset, name);\r\n if (node.getModel().getMaximizedTabset() !== undefined) {\r\n layout.dragStart(event, message, node, false, (event2) => undefined, onDoubleClick);\r\n }\r\n else {\r\n layout.dragStart(event, message, node, node.isEnableDrag(), (event2) => undefined, onDoubleClick);\r\n }\r\n }\r\n }\r\n };\r\n const onAuxMouseClick = (event) => {\r\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\r\n layout.auxMouseClick(node, event);\r\n }\r\n };\r\n const onContextMenu = (event) => {\r\n layout.showContextMenu(node, event);\r\n };\r\n const onInterceptMouseDown = (event) => {\r\n event.stopPropagation();\r\n };\r\n const onMaximizeToggle = (event) => {\r\n if (node.canMaximize()) {\r\n layout.maximize(node);\r\n }\r\n event.stopPropagation();\r\n };\r\n const onClose = (event) => {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTabset(node.getId()));\r\n event.stopPropagation();\r\n };\r\n const onFloatTab = (event) => {\r\n if (selectedTabNode !== undefined) {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.floatTab(selectedTabNode.getId()));\r\n }\r\n event.stopPropagation();\r\n };\r\n const onDoubleClick = (event) => {\r\n if (node.canMaximize()) {\r\n layout.maximize(node);\r\n }\r\n };\r\n // Start Render\r\n const cm = layout.getClassName;\r\n // tabbar inner can get shifted left via tab rename, this resets scrollleft to 0\r\n if (tabbarInnerRef.current !== null && tabbarInnerRef.current.scrollLeft !== 0) {\r\n tabbarInnerRef.current.scrollLeft = 0;\r\n }\r\n const selectedTabNode = node.getSelectedNode();\r\n let style = node._styleWithPosition();\r\n if (node.getModel().getMaximizedTabset() !== undefined && !node.isMaximized()) {\r\n (0,_Utils__WEBPACK_IMPORTED_MODULE_8__.hideElement)(style, node.getModel().isUseVisibility());\r\n }\r\n const tabs = [];\r\n if (node.isEnableTabStrip()) {\r\n for (let i = 0; i < node.getChildren().length; i++) {\r\n const child = node.getChildren()[i];\r\n let isSelected = node.getSelected() === i;\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButton__WEBPACK_IMPORTED_MODULE_4__.TabButton, { layout: layout, node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected, iconFactory: iconFactory, titleFactory: titleFactory, icons: icons }));\r\n if (i < node.getChildren().length - 1) {\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TAB_DIVIDER) }));\r\n }\r\n }\r\n }\r\n const showHeader = node.getName() !== undefined;\r\n let stickyButtons = [];\r\n let buttons = [];\r\n let headerButtons = [];\r\n // allow customization of header contents and buttons\r\n const renderState = { headerContent: node.getName(), stickyButtons, buttons, headerButtons };\r\n layout.customizeTabSet(node, renderState);\r\n const headerContent = renderState.headerContent;\r\n stickyButtons = renderState.stickyButtons;\r\n buttons = renderState.buttons;\r\n headerButtons = renderState.headerButtons;\r\n if (stickyButtons.length > 0) {\r\n if (tabsTruncated) {\r\n buttons = [...stickyButtons, ...buttons];\r\n }\r\n else {\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\r\n }\r\n }\r\n let toolbar;\r\n if (hiddenTabs.length > 0) {\r\n const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Overflow_Menu_Tooltip);\r\n let overflowContent;\r\n if (typeof icons.more === \"function\") {\r\n overflowContent = icons.more(node, hiddenTabs);\r\n }\r\n else {\r\n overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n icons.more,\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\r\n }\r\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"overflowbutton\", \"data-layout-path\": path + \"/button/overflow\", ref: overflowbuttonRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW), title: overflowTitle, onClick: onOverflowClick, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, overflowContent));\r\n }\r\n if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnableFloat() && !selectedTabNode.isFloating()) {\r\n const floatTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Float_Tab);\r\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"float\", \"data-layout-path\": path + \"/button/float\", title: floatTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT), onClick: onFloatTab, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\r\n }\r\n if (node.canMaximize()) {\r\n const minTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Restore);\r\n const maxTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Maximize);\r\n const btns = showHeader ? headerButtons : buttons;\r\n btns.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"max\", \"data-layout-path\": path + \"/button/max\", title: node.isMaximized() ? minTitle : maxTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_ + (node.isMaximized() ? \"max\" : \"min\")), onClick: onMaximizeToggle, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, node.isMaximized() ?\r\n (typeof icons.restore === \"function\") ? icons.restore(node) : icons.restore :\r\n (typeof icons.maximize === \"function\") ? icons.maximize(node) : icons.maximize));\r\n }\r\n if (!node.isMaximized() && node.isEnableClose()) {\r\n const title = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tabset);\r\n const btns = showHeader ? headerButtons : buttons;\r\n btns.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: title, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE), onClick: onClose, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.closeTabset === \"function\") ? icons.closeTabset(node) : icons.closeTabset));\r\n }\r\n toolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); } }, buttons));\r\n let header;\r\n let tabStrip;\r\n let tabStripClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER);\r\n if (node.getClassNameTabStrip() !== undefined) {\r\n tabStripClasses += \" \" + node.getClassNameTabStrip();\r\n }\r\n tabStripClasses += \" \" + _Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER_ + node.getTabLocation();\r\n if (node.isActive() && !showHeader) {\r\n tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\r\n }\r\n if (node.isMaximized() && !showHeader) {\r\n tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\r\n }\r\n if (showHeader) {\r\n const headerToolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); } }, headerButtons));\r\n let tabHeaderClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_HEADER);\r\n if (node.isActive()) {\r\n tabHeaderClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\r\n }\r\n if (node.isMaximized()) {\r\n tabHeaderClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\r\n }\r\n if (node.getClassNameHeader() !== undefined) {\r\n tabHeaderClasses += \" \" + node.getClassNameHeader();\r\n }\r\n header = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabHeaderClasses, style: { height: node.getHeaderHeight() + \"px\" }, \"data-layout-path\": path + \"/header\", onMouseDown: onMouseDown, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onTouchStart: onMouseDown },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_HEADER_CONTENT) }, headerContent),\r\n headerToolbar));\r\n }\r\n const tabStripStyle = { height: node.getTabStripHeight() + \"px\" };\r\n tabStrip = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabStripClasses, style: tabStripStyle, \"data-layout-path\": path + \"/tabstrip\", onMouseDown: onMouseDown, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onTouchStart: onMouseDown },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: tabbarInnerRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_ + node.getTabLocation()) },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { left: position }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_ + node.getTabLocation()) }, tabs)),\r\n toolbar));\r\n style = layout.styleFont(style);\r\n var placeHolder = undefined;\r\n if (node.getChildren().length === 0) {\r\n const placeHolderCallback = layout.getTabSetPlaceHolderCallback();\r\n if (placeHolderCallback) {\r\n placeHolder = placeHolderCallback(node);\r\n }\r\n }\r\n const center = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_CONTENT) }, placeHolder);\r\n var content;\r\n if (node.getTabLocation() === \"top\") {\r\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n header,\r\n tabStrip,\r\n center);\r\n }\r\n else {\r\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n header,\r\n center,\r\n tabStrip);\r\n }\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, dir: \"ltr\", \"data-layout-path\": path, style: style, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET), onWheel: onMouseWheel }, content));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabSet.tsx?");
|
|
419
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"TabSet\": () => (/* binding */ TabSet)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _I18nLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../I18nLabel */ \"./src/I18nLabel.ts\");\n/* harmony import */ var _model_Actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../model/Actions */ \"./src/model/Actions.ts\");\n/* harmony import */ var _PopupMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../PopupMenu */ \"./src/PopupMenu.tsx\");\n/* harmony import */ var _TabButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./TabButton */ \"./src/view/TabButton.tsx\");\n/* harmony import */ var _TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TabOverflowHook */ \"./src/view/TabOverflowHook.tsx\");\n/* harmony import */ var _Orientation__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Orientation */ \"./src/Orientation.ts\");\n/* harmony import */ var _Types__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../Types */ \"./src/Types.ts\");\n/* harmony import */ var _Utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Utils */ \"./src/view/Utils.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n/** @internal */\r\nconst TabSet = (props) => {\r\n const { node, layout, iconFactory, titleFactory, icons, path } = props;\r\n const toolbarRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const overflowbuttonRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const tabbarInnerRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const stickyButtonsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);\r\n const { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated } = (0,_TabOverflowHook__WEBPACK_IMPORTED_MODULE_5__.useTabOverflow)(node, _Orientation__WEBPACK_IMPORTED_MODULE_6__.Orientation.HORZ, toolbarRef, stickyButtonsRef);\r\n const onOverflowClick = (event) => {\r\n const callback = layout.getShowOverflowMenu();\r\n if (callback !== undefined) {\r\n callback(node, event, hiddenTabs, onOverflowItemSelect);\r\n }\r\n else {\r\n const element = overflowbuttonRef.current;\r\n (0,_PopupMenu__WEBPACK_IMPORTED_MODULE_3__.showPopup)(element, hiddenTabs, onOverflowItemSelect, layout, iconFactory, titleFactory);\r\n }\r\n event.stopPropagation();\r\n };\r\n const onOverflowItemSelect = (item) => {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.selectTab(item.node.getId()));\r\n userControlledLeft.current = false;\r\n };\r\n const onMouseDown = (event) => {\r\n if (!(0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\r\n let name = node.getName();\r\n if (name === undefined) {\r\n name = \"\";\r\n }\r\n else {\r\n name = \": \" + name;\r\n }\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.setActiveTabset(node.getId()));\r\n if (!layout.getEditingTab()) {\r\n const message = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Move_Tabset, name);\r\n if (node.getModel().getMaximizedTabset() !== undefined) {\r\n layout.dragStart(event, message, node, false, (event2) => undefined, onDoubleClick);\r\n }\r\n else {\r\n layout.dragStart(event, message, node, node.isEnableDrag(), (event2) => undefined, onDoubleClick);\r\n }\r\n }\r\n }\r\n };\r\n const onAuxMouseClick = (event) => {\r\n if ((0,_Utils__WEBPACK_IMPORTED_MODULE_8__.isAuxMouseEvent)(event)) {\r\n layout.auxMouseClick(node, event);\r\n }\r\n };\r\n const onContextMenu = (event) => {\r\n layout.showContextMenu(node, event);\r\n };\r\n const onInterceptMouseDown = (event) => {\r\n event.stopPropagation();\r\n };\r\n const onMaximizeToggle = (event) => {\r\n if (node.canMaximize()) {\r\n layout.maximize(node);\r\n }\r\n event.stopPropagation();\r\n };\r\n const onClose = (event) => {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.deleteTabset(node.getId()));\r\n event.stopPropagation();\r\n };\r\n const onFloatTab = (event) => {\r\n if (selectedTabNode !== undefined) {\r\n layout.doAction(_model_Actions__WEBPACK_IMPORTED_MODULE_2__.Actions.floatTab(selectedTabNode.getId()));\r\n }\r\n event.stopPropagation();\r\n };\r\n const onDoubleClick = (event) => {\r\n if (node.canMaximize()) {\r\n layout.maximize(node);\r\n }\r\n };\r\n // Start Render\r\n const cm = layout.getClassName;\r\n // tabbar inner can get shifted left via tab rename, this resets scrollleft to 0\r\n if (tabbarInnerRef.current !== null && tabbarInnerRef.current.scrollLeft !== 0) {\r\n tabbarInnerRef.current.scrollLeft = 0;\r\n }\r\n const selectedTabNode = node.getSelectedNode();\r\n let style = node._styleWithPosition();\r\n if (node.getModel().getMaximizedTabset() !== undefined && !node.isMaximized()) {\r\n (0,_Utils__WEBPACK_IMPORTED_MODULE_8__.hideElement)(style, node.getModel().isUseVisibility());\r\n }\r\n const tabs = [];\r\n if (node.isEnableTabStrip()) {\r\n for (let i = 0; i < node.getChildren().length; i++) {\r\n const child = node.getChildren()[i];\r\n let isSelected = node.getSelected() === i;\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabButton__WEBPACK_IMPORTED_MODULE_4__.TabButton, { layout: layout, node: child, path: path + \"/tb\" + i, key: child.getId(), selected: isSelected, iconFactory: iconFactory, titleFactory: titleFactory, icons: icons }));\r\n if (i < node.getChildren().length - 1) {\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"divider\" + i, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TAB_DIVIDER) }));\r\n }\r\n }\r\n }\r\n const showHeader = node.getName() !== undefined;\r\n let stickyButtons = [];\r\n let buttons = [];\r\n let headerButtons = [];\r\n // allow customization of header contents and buttons\r\n const renderState = { headerContent: node.getName(), stickyButtons, buttons, headerButtons, overflowPosition: undefined };\r\n layout.customizeTabSet(node, renderState);\r\n const headerContent = renderState.headerContent;\r\n stickyButtons = renderState.stickyButtons;\r\n buttons = renderState.buttons;\r\n headerButtons = renderState.headerButtons;\r\n if (renderState.overflowPosition === undefined) {\r\n renderState.overflowPosition = stickyButtons.length;\r\n }\r\n if (stickyButtons.length > 0) {\r\n if (tabsTruncated) {\r\n buttons = [...stickyButtons, ...buttons];\r\n }\r\n else {\r\n tabs.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: stickyButtonsRef, key: \"sticky_buttons_container\", onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_STICKY_BUTTONS_CONTAINER) }, stickyButtons));\r\n }\r\n }\r\n if (hiddenTabs.length > 0) {\r\n const overflowTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Overflow_Menu_Tooltip);\r\n let overflowContent;\r\n if (typeof icons.more === \"function\") {\r\n overflowContent = icons.more(node, hiddenTabs);\r\n }\r\n else {\r\n overflowContent = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n icons.more,\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_BUTTON_OVERFLOW_COUNT) }, hiddenTabs.length)));\r\n }\r\n buttons.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, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, overflowContent));\r\n }\r\n if (selectedTabNode !== undefined && layout.isSupportsPopout() && selectedTabNode.isEnableFloat() && !selectedTabNode.isFloating()) {\r\n const floatTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Float_Tab);\r\n buttons.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"float\", \"data-layout-path\": path + \"/button/float\", title: floatTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_FLOAT), onClick: onFloatTab, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.popout === \"function\") ? icons.popout(selectedTabNode) : icons.popout));\r\n }\r\n if (node.canMaximize()) {\r\n const minTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Restore);\r\n const maxTitle = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Maximize);\r\n const btns = showHeader ? headerButtons : buttons;\r\n btns.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"max\", \"data-layout-path\": path + \"/button/max\", title: node.isMaximized() ? minTitle : maxTitle, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_ + (node.isMaximized() ? \"max\" : \"min\")), onClick: onMaximizeToggle, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, node.isMaximized() ?\r\n (typeof icons.restore === \"function\") ? icons.restore(node) : icons.restore :\r\n (typeof icons.maximize === \"function\") ? icons.maximize(node) : icons.maximize));\r\n }\r\n if (!node.isMaximized() && node.isEnableClose()) {\r\n const title = layout.i18nName(_I18nLabel__WEBPACK_IMPORTED_MODULE_1__.I18nLabel.Close_Tabset);\r\n const btns = showHeader ? headerButtons : buttons;\r\n btns.push(react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"button\", { key: \"close\", \"data-layout-path\": path + \"/button/close\", title: title, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR_BUTTON_CLOSE), onClick: onClose, onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown }, (typeof icons.closeTabset === \"function\") ? icons.closeTabset(node) : icons.closeTabset));\r\n }\r\n const toolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); } }, buttons));\r\n let header;\r\n let tabStrip;\r\n let tabStripClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER);\r\n if (node.getClassNameTabStrip() !== undefined) {\r\n tabStripClasses += \" \" + node.getClassNameTabStrip();\r\n }\r\n tabStripClasses += \" \" + _Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_OUTER_ + node.getTabLocation();\r\n if (node.isActive() && !showHeader) {\r\n tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\r\n }\r\n if (node.isMaximized() && !showHeader) {\r\n tabStripClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\r\n }\r\n if (showHeader) {\r\n const headerToolbar = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { key: \"toolbar\", ref: toolbarRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TAB_TOOLBAR), onMouseDown: onInterceptMouseDown, onTouchStart: onInterceptMouseDown, onDragStart: (e) => { e.preventDefault(); } }, headerButtons));\r\n let tabHeaderClasses = cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_HEADER);\r\n if (node.isActive()) {\r\n tabHeaderClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_SELECTED);\r\n }\r\n if (node.isMaximized()) {\r\n tabHeaderClasses += \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_MAXIMIZED);\r\n }\r\n if (node.getClassNameHeader() !== undefined) {\r\n tabHeaderClasses += \" \" + node.getClassNameHeader();\r\n }\r\n header = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabHeaderClasses, style: { height: node.getHeaderHeight() + \"px\" }, \"data-layout-path\": path + \"/header\", onMouseDown: onMouseDown, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onTouchStart: onMouseDown },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_HEADER_CONTENT) }, headerContent),\r\n headerToolbar));\r\n }\r\n const tabStripStyle = { height: node.getTabStripHeight() + \"px\" };\r\n tabStrip = (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: tabStripClasses, style: tabStripStyle, \"data-layout-path\": path + \"/tabstrip\", onMouseDown: onMouseDown, onContextMenu: onContextMenu, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onTouchStart: onMouseDown },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: tabbarInnerRef, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_ + node.getTabLocation()) },\r\n react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { style: { left: position }, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER) + \" \" + cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_TABBAR_INNER_TAB_CONTAINER_ + node.getTabLocation()) }, tabs)),\r\n toolbar));\r\n style = layout.styleFont(style);\r\n var placeHolder = undefined;\r\n if (node.getChildren().length === 0) {\r\n const placeHolderCallback = layout.getTabSetPlaceHolderCallback();\r\n if (placeHolderCallback) {\r\n placeHolder = placeHolderCallback(node);\r\n }\r\n }\r\n const center = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET_CONTENT) }, placeHolder);\r\n var content;\r\n if (node.getTabLocation() === \"top\") {\r\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n header,\r\n tabStrip,\r\n center);\r\n }\r\n else {\r\n content = react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null,\r\n header,\r\n center,\r\n tabStrip);\r\n }\r\n return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"div\", { ref: selfRef, dir: \"ltr\", \"data-layout-path\": path, style: style, className: cm(_Types__WEBPACK_IMPORTED_MODULE_7__.CLASSES.FLEXLAYOUT__TABSET), onWheel: onMouseWheel }, content));\r\n};\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/TabSet.tsx?");
|
|
420
420
|
|
|
421
421
|
/***/ }),
|
|
422
422
|
|
|
@@ -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 */ \"getRenderStateEx\": () => (/* binding */ getRenderStateEx),\n/* harmony export */ \"hideElement\": () => (/* binding */ hideElement),\n/* harmony export */ \"isAuxMouseEvent\": () => (/* binding */ isAuxMouseEvent)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\r\n/** @internal */\r\nfunction getRenderStateEx(layout, node, iconFactory, titleFactory) {\r\n let leadingContent = iconFactory ? iconFactory(node) : undefined;\r\n let titleContent = node.getName();\r\n let name = node.getName();\r\n function isTitleObject(obj) {\r\n return obj.titleContent !== undefined;\r\n }\r\n if (titleFactory !== undefined) {\r\n const titleObj = titleFactory(node);\r\n if (titleObj !== undefined) {\r\n if (typeof titleObj === \"string\") {\r\n titleContent = titleObj;\r\n name = titleObj;\r\n }\r\n else if (isTitleObject(titleObj)) {\r\n titleContent = titleObj.titleContent;\r\n name = titleObj.name;\r\n }\r\n else {\r\n titleContent = titleObj;\r\n }\r\n }\r\n }\r\n if (leadingContent === undefined && node.getIcon() !== undefined) {\r\n leadingContent = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"img\", { style: { width: \"1em\", height: \"1em\" }, src: node.getIcon(), alt: \"leadingContent\" });\r\n }\r\n let buttons = [];\r\n // allow customization of leading contents (icon) and contents\r\n const renderState = { leading: leadingContent, content: titleContent, name, buttons };\r\n layout.customizeTab(node, renderState);\r\n node._setRenderedName(renderState.name);\r\n return renderState;\r\n}\r\n/** @internal */\r\nfunction hideElement(style, useVisibility) {\r\n if (useVisibility) {\r\n style.visibility = \"hidden\";\r\n }\r\n else {\r\n style.display = \"none\";\r\n }\r\n}\r\n/** @internal */\r\nfunction isAuxMouseEvent(event) {\r\n let auxEvent = false;\r\n if (event.nativeEvent instanceof MouseEvent) {\r\n if (event.nativeEvent.button !== 0 || event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) {\r\n auxEvent = true;\r\n }\r\n }\r\n return auxEvent;\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Utils.tsx?");
|
|
429
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"getRenderStateEx\": () => (/* binding */ getRenderStateEx),\n/* harmony export */ \"hideElement\": () => (/* binding */ hideElement),\n/* harmony export */ \"isAuxMouseEvent\": () => (/* binding */ isAuxMouseEvent)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\r\n/** @internal */\r\nfunction getRenderStateEx(layout, node, iconFactory, titleFactory, iconAngle) {\r\n let leadingContent = iconFactory ? iconFactory(node) : undefined;\r\n let titleContent = node.getName();\r\n let name = node.getName();\r\n if (iconAngle === undefined) {\r\n iconAngle = 0;\r\n }\r\n function isTitleObject(obj) {\r\n return obj.titleContent !== undefined;\r\n }\r\n if (titleFactory !== undefined) {\r\n const titleObj = titleFactory(node);\r\n if (titleObj !== undefined) {\r\n if (typeof titleObj === \"string\") {\r\n titleContent = titleObj;\r\n name = titleObj;\r\n }\r\n else if (isTitleObject(titleObj)) {\r\n titleContent = titleObj.titleContent;\r\n name = titleObj.name;\r\n }\r\n else {\r\n titleContent = titleObj;\r\n }\r\n }\r\n }\r\n if (leadingContent === undefined && node.getIcon() !== undefined) {\r\n if (iconAngle !== 0) {\r\n leadingContent = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"img\", { style: { width: \"1em\", height: \"1em\", transform: \"rotate(\" + iconAngle + \"deg)\" }, src: node.getIcon(), alt: \"leadingContent\" });\r\n }\r\n else {\r\n leadingContent = react__WEBPACK_IMPORTED_MODULE_0__.createElement(\"img\", { style: { width: \"1em\", height: \"1em\" }, src: node.getIcon(), alt: \"leadingContent\" });\r\n }\r\n }\r\n let buttons = [];\r\n // allow customization of leading contents (icon) and contents\r\n const renderState = { leading: leadingContent, content: titleContent, name, buttons };\r\n layout.customizeTab(node, renderState);\r\n node._setRenderedName(renderState.name);\r\n return renderState;\r\n}\r\n/** @internal */\r\nfunction hideElement(style, useVisibility) {\r\n if (useVisibility) {\r\n style.visibility = \"hidden\";\r\n }\r\n else {\r\n style.display = \"none\";\r\n }\r\n}\r\n/** @internal */\r\nfunction isAuxMouseEvent(event) {\r\n let auxEvent = false;\r\n if (event.nativeEvent instanceof MouseEvent) {\r\n if (event.nativeEvent.button !== 0 || event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) {\r\n auxEvent = true;\r\n }\r\n }\r\n return auxEvent;\r\n}\r\n\n\n//# sourceURL=webpack://FlexLayout/./src/view/Utils.tsx?");
|
|
430
430
|
|
|
431
431
|
/***/ }),
|
|
432
432
|
|