@aptre/flex-layout 0.5.9 → 0.5.10

package/dist/index.mjs

@@ -6009,10 +6009,11 @@ var TabPanel = memo2(function TabPanel2({
       element.removeEventListener("pointerdown", onPointerDown, true);
     };
   }, [node, model, nodeId]);
-  let isHidden = !visible;
+  const isSelected = visible || node.isSelected();
+  let isHidden = !isSelected;
   let zIndex;
   if (hasMaximizedTabset) {
-    if (isMaximized && visible) {
+    if (isMaximized && isSelected) {
       zIndex = 11;
       isHidden = false;
     } else {
@@ -6047,12 +6048,15 @@ function TabContainer({
   renderTab,
   isDragging,
   classNameMapper,
-  model
+  model,
+  maximizedTabsetId
 }) {
+  void maximizedTabsetId;
   const className = classNameMapper ? classNameMapper("flexlayout__tab") : "flexlayout__tab";
   const maximizedTabset = model.getMaximizedTabset(Model.MAIN_WINDOW_ID);
   const hasMaximizedTabset = maximizedTabset !== void 0;
-  return /* @__PURE__ */ React20.createElement("div", { className: "flexlayout__optimized_layout_tab_container", "data-layout-path": "/tab-container" }, Array.from(tabs.entries()).map(([nodeId, tabInfo]) => {
+  const containerStyle = hasMaximizedTabset ? { zIndex: 10 } : {};
+  return /* @__PURE__ */ React20.createElement("div", { className: "flexlayout__optimized_layout_tab_container", "data-layout-path": "/tab-container", style: containerStyle }, Array.from(tabs.entries()).map(([nodeId, tabInfo]) => {
     const parent = tabInfo.node.getParent();
     const isMaximized = parent instanceof TabSetNode && parent.isMaximized();
     return /* @__PURE__ */ React20.createElement(
@@ -6077,6 +6081,7 @@ function TabContainer({
 function OptimizedLayout({ model, renderTab, classNameMapper, onDragStateChange, onModelChange: userOnModelChange, ...layoutProps }) {
   const [isDragging, setIsDragging] = useState4(false);
   const [tabs, setTabs] = useState4(() => /* @__PURE__ */ new Map());
+  const [maximizedTabsetId, setMaximizedTabsetId] = useState4(() => model.getMaximizedTabset(Model.MAIN_WINDOW_ID)?.getId());
   const syncTabsWithModel = useCallback(
     (prevTabs) => {
       const modelTabNodes = /* @__PURE__ */ new Map();
@@ -6152,6 +6157,8 @@ function OptimizedLayout({ model, renderTab, classNameMapper, onDragStateChange,
   );
   const handleModelChange = useCallback(
     (changedModel, action) => {
+      const newMaximizedId = changedModel.getMaximizedTabset(Model.MAIN_WINDOW_ID)?.getId();
+      setMaximizedTabsetId(newMaximizedId);
       setTabs((prevTabs) => {
         const synced = syncTabsWithModel(prevTabs);
         let hasVisibilityChange = false;
@@ -6177,7 +6184,7 @@ function OptimizedLayout({ model, renderTab, classNameMapper, onDragStateChange,
     },
     [handleTabMount, handleRectChange, handleVisibilityChange]
   );
-  return /* @__PURE__ */ React20.createElement("div", { className: "flexlayout__optimized_layout" }, /* @__PURE__ */ React20.createElement(Layout, { model, factory, classNameMapper, onDragStateChange: handleDragStateChange, onModelChange: handleModelChange, ...layoutProps }), /* @__PURE__ */ React20.createElement(TabContainer, { tabs, renderTab, isDragging, classNameMapper, model }));
+  return /* @__PURE__ */ React20.createElement("div", { className: "flexlayout__optimized_layout" }, /* @__PURE__ */ React20.createElement(Layout, { model, factory, classNameMapper, onDragStateChange: handleDragStateChange, onModelChange: handleModelChange, ...layoutProps }), /* @__PURE__ */ React20.createElement(TabContainer, { tabs, renderTab, isDragging, classNameMapper, model, maximizedTabsetId }));
 }
 
 // src/model/walk.ts

package/package.json

@@ -2,7 +2,7 @@
   "name": "@aptre/flex-layout",
   "author": "Caplin Systems Ltd",
   "description": "A multi-tab docking layout manager",
-  "version": "0.5.9",
+  "version": "0.5.10",
   "license": "ISC",
   "repository": {
     "type": "git",