diff --git a/ChangeLog.txt b/ChangeLog.txt index 77550930..b9ed71ab 100644 --- a/ChangeLog.txt +++ b/ChangeLog.txt @@ -1,3 +1,8 @@ +0.8.1 +Fixed enableDrag on tab and tabset nodes. +Fixed calc for min/max tabset height from min/max tab height. +Modified style sheet code in demo to reduce flash. + 0.8.0 New: * Wrap tabs option diff --git a/examples/demo/App.tsx b/examples/demo/App.tsx index a67b8717..5c520a9d 100755 --- a/examples/demo/App.tsx +++ b/examples/demo/App.tsx @@ -339,27 +339,35 @@ class App extends React.Component { + let s1 = document.createElement("link"); + s1.setAttribute("id", "flexlayout-stylesheet"); + s1.setAttribute("rel", "stylesheet"); + s1.setAttribute("href", newAddress + "/" + target.value + ".css"); + + let s2 = document.createElement("link"); + s2.setAttribute("id", "page-stylesheet"); + s2.setAttribute("rel", "stylesheet"); + s2.setAttribute("href", target.value + ".css"); + + const promises: Promise[] = []; + promises.push(new Promise((resolve) => { + s1.onload = () => resolve(true); + })); + promises.push(new Promise((resolve) => { + s2.onload = () => resolve(true); + })); + document.head.appendChild(s1); + document.head.appendChild(s2); + + Promise.all(promises).then(() => { + document.head.removeChild(flexlayout_stylesheet); + document.head.removeChild(page_stylesheet!); this.forceUpdate(); - }, 300); + }); } onFontSizeChange = (event: React.FormEvent) => { diff --git a/package.json b/package.json index 37a97bde..6d0755a7 100755 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "flexlayout-react", - "version": "0.8.0", + "version": "0.8.1", "description": "A multi-tab docking layout manager", "main": "lib/index.js", "types": "./declarations/index.d.ts", diff --git a/src/model/TabSetNode.ts b/src/model/TabSetNode.ts index 13fed29a..061e767c 100755 --- a/src/model/TabSetNode.ts +++ b/src/model/TabSetNode.ts @@ -248,6 +248,9 @@ export class TabSetNode extends Node implements IDraggable, IDropTarget { this.calculatedMaxWidth = Math.min(this.calculatedMaxWidth, c.getMaxWidth()); this.calculatedMaxHeight = Math.min(this.calculatedMaxHeight, c.getMaxHeight()); } + + this.calculatedMinHeight += this.tabStripRect.height; + this.calculatedMaxHeight += this.tabStripRect.height; } /** @internal */ diff --git a/src/view/BorderButton.tsx b/src/view/BorderButton.tsx index 599cbe68..70f298ed 100755 --- a/src/view/BorderButton.tsx +++ b/src/view/BorderButton.tsx @@ -24,8 +24,12 @@ export const BorderButton = (props: IBorderButtonProps) => { const contentRef = React.useRef(null); const onDragStart = (event: React.DragEvent) => { - event.stopPropagation(); - layout.setDragNode(event.nativeEvent, node as TabNode); + if (node.isEnableDrag()) { + event.stopPropagation(); + layout.setDragNode(event.nativeEvent, node as TabNode); + } else { + event.preventDefault(); + } }; const onDragEnd = (event: React.DragEvent) => { diff --git a/src/view/Layout.tsx b/src/view/Layout.tsx index 2fabc720..d3b3d4b4 100755 --- a/src/view/Layout.tsx +++ b/src/view/Layout.tsx @@ -1224,6 +1224,8 @@ export class LayoutInternal extends React.Component { }); const onDragStart = (event: React.DragEvent) => { - event.stopPropagation(); // prevent starting a tabset drag as well - layout.setDragNode(event.nativeEvent, node as TabNode); + if (node.isEnableDrag()) { + event.stopPropagation(); // prevent starting a tabset drag as well + layout.setDragNode(event.nativeEvent, node as TabNode); + } else { + event.preventDefault(); + } }; const onDragEnd = (event: React.DragEvent) => { diff --git a/src/view/TabSet.tsx b/src/view/TabSet.tsx index 06ab7675..c7965eb3 100755 --- a/src/view/TabSet.tsx +++ b/src/view/TabSet.tsx @@ -73,8 +73,12 @@ export const TabSet = (props: ITabSetProps) => { const onDragStart = (event: React.DragEvent) => { if (!layout.getEditingTab()) { - event.stopPropagation(); - layout.setDragNode(event.nativeEvent, node as TabSetNode); + if (node.isEnableDrag()) { + event.stopPropagation(); + layout.setDragNode(event.nativeEvent, node as TabSetNode); + } else { + event.preventDefault(); + } } else { event.preventDefault(); }