dockview - npm Package Compare versions

Comparing version 1.7.6 to 1.8.0

dist/cjs/dockview/dockview.d.ts

@@ -5,3 +5,3 @@ import * as React from 'react';
 import { PanelCollection, PanelParameters } from '../types';
-import { IDockviewGroupControlProps } from './groupControlsRenderer';
+import { IDockviewHeaderActionsProps } from './headerActionsRenderer';
 export interface IGroupPanelBaseProps<T extends {
@@ -33,6 +33,8 @@ [index: string]: any;
     defaultTabComponent?: React.FunctionComponent<IDockviewPanelHeaderProps>;
-    groupControlComponent?: React.FunctionComponent<IDockviewGroupControlProps>;
+    rightHeaderActionsComponent?: React.FunctionComponent<IDockviewHeaderActionsProps>;
+    leftHeaderActionsComponent?: React.FunctionComponent<IDockviewHeaderActionsProps>;
     singleTabMode?: 'fullwidth' | 'default';
+    disableFloatingGroups?: boolean;
 }
 export declare const DockviewReact: React.ForwardRefExoticComponent<IDockviewReactProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=dockview.d.ts.map

dist/cjs/dockview/dockview.js

@@ -49,7 +49,7 @@ "use strict";
 var reactWatermarkPart_1 = require("./reactWatermarkPart");
-var groupControlsRenderer_1 = require("./groupControlsRenderer");
+var headerActionsRenderer_1 = require("./headerActionsRenderer");
 function createGroupControlElement(component, store) {
     return component
         ? function (groupPanel) {
-            return new groupControlsRenderer_1.ReactGroupControlsRendererPart(component, store, groupPanel);
+            return new headerActionsRenderer_1.ReactHeaderActionsRendererPart(component, store, groupPanel);
         }
@@ -111,4 +111,6 @@ : undefined;
             showDndOverlay: props.showDndOverlay,
-            createGroupControlElement: createGroupControlElement(props.groupControlComponent, { addPortal: addPortal }),
+            createLeftHeaderActionsElement: createGroupControlElement(props.leftHeaderActionsComponent, { addPortal: addPortal }),
+            createRightHeaderActionsElement: createGroupControlElement(props.rightHeaderActionsComponent, { addPortal: addPortal }),
             singleTabMode: props.singleTabMode,
+            disableFloatingGroups: props.disableFloatingGroups,
         });
@@ -176,2 +178,10 @@ var _a = domRef.current, clientWidth = _a.clientWidth, clientHeight = _a.clientHeight;
         }
+        dockviewRef.current.updateOptions({
+            disableFloatingGroups: props.disableFloatingGroups,
+        });
+    }, [props.disableFloatingGroups]);
+    React.useEffect(function () {
+        if (!dockviewRef.current) {
+            return;
+        }
         var frameworkTabComponents = props.tabComponents || {};
@@ -194,5 +204,13 @@ if (props.defaultTabComponent) {
         dockviewRef.current.updateOptions({
-            createGroupControlElement: createGroupControlElement(props.groupControlComponent, { addPortal: addPortal }),
+            createRightHeaderActionsElement: createGroupControlElement(props.rightHeaderActionsComponent, { addPortal: addPortal }),
         });
-    }, [props.groupControlComponent]);
+    }, [props.rightHeaderActionsComponent]);
+    React.useEffect(function () {
+        if (!dockviewRef.current) {
+            return;
+        }
+        dockviewRef.current.updateOptions({
+            createLeftHeaderActionsElement: createGroupControlElement(props.leftHeaderActionsComponent, { addPortal: addPortal }),
+        });
+    }, [props.leftHeaderActionsComponent]);
     return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
@@ -199,0 +217,0 @@ });

dist/cjs/index.d.ts

@@ -6,3 +6,3 @@ export * from 'dockview-core';
 export * from './gridview/gridview';
-export { IDockviewGroupControlProps } from './dockview/groupControlsRenderer';
+export { IDockviewHeaderActionsProps } from './dockview/headerActionsRenderer';
 export { IWatermarkPanelProps } from './dockview/reactWatermarkPart';
@@ -9,0 +9,0 @@ export * from './paneview/paneview';

dist/cjs/svg.d.ts

@@ -1,4 +0,4 @@
-/// <reference types="react" />
-export declare const CloseButton: () => JSX.Element;
-export declare const ExpandMore: () => JSX.Element;
+import * as React from 'react';
+export declare const CloseButton: () => React.JSX.Element;
+export declare const ExpandMore: () => React.JSX.Element;
 //# sourceMappingURL=svg.d.ts.map

dist/esm/dockview/dockview.d.ts

@@ -5,3 +5,3 @@ import * as React from 'react';
 import { PanelCollection, PanelParameters } from '../types';
-import { IDockviewGroupControlProps } from './groupControlsRenderer';
+import { IDockviewHeaderActionsProps } from './headerActionsRenderer';
 export interface IGroupPanelBaseProps<T extends {
@@ -33,6 +33,8 @@ [index: string]: any;
     defaultTabComponent?: React.FunctionComponent<IDockviewPanelHeaderProps>;
-    groupControlComponent?: React.FunctionComponent<IDockviewGroupControlProps>;
+    rightHeaderActionsComponent?: React.FunctionComponent<IDockviewHeaderActionsProps>;
+    leftHeaderActionsComponent?: React.FunctionComponent<IDockviewHeaderActionsProps>;
     singleTabMode?: 'fullwidth' | 'default';
+    disableFloatingGroups?: boolean;
 }
 export declare const DockviewReact: React.ForwardRefExoticComponent<IDockviewReactProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=dockview.d.ts.map

dist/esm/dockview/dockview.js

@@ -7,7 +7,7 @@ import * as React from 'react';
 import { ReactWatermarkPart } from './reactWatermarkPart';
-import { ReactGroupControlsRendererPart, } from './groupControlsRenderer';
+import { ReactHeaderActionsRendererPart, } from './headerActionsRenderer';
 function createGroupControlElement(component, store) {
     return component
         ? (groupPanel) => {
-            return new ReactGroupControlsRendererPart(component, store, groupPanel);
+            return new ReactHeaderActionsRendererPart(component, store, groupPanel);
         }
@@ -69,4 +69,6 @@ : undefined;
             showDndOverlay: props.showDndOverlay,
-            createGroupControlElement: createGroupControlElement(props.groupControlComponent, { addPortal }),
+            createLeftHeaderActionsElement: createGroupControlElement(props.leftHeaderActionsComponent, { addPortal }),
+            createRightHeaderActionsElement: createGroupControlElement(props.rightHeaderActionsComponent, { addPortal }),
             singleTabMode: props.singleTabMode,
+            disableFloatingGroups: props.disableFloatingGroups,
         });
@@ -134,2 +136,10 @@ const { clientWidth, clientHeight } = domRef.current;
         }
+        dockviewRef.current.updateOptions({
+            disableFloatingGroups: props.disableFloatingGroups,
+        });
+    }, [props.disableFloatingGroups]);
+    React.useEffect(() => {
+        if (!dockviewRef.current) {
+            return;
+        }
         const frameworkTabComponents = props.tabComponents || {};
@@ -152,5 +162,13 @@ if (props.defaultTabComponent) {
         dockviewRef.current.updateOptions({
-            createGroupControlElement: createGroupControlElement(props.groupControlComponent, { addPortal }),
+            createRightHeaderActionsElement: createGroupControlElement(props.rightHeaderActionsComponent, { addPortal }),
         });
-    }, [props.groupControlComponent]);
+    }, [props.rightHeaderActionsComponent]);
+    React.useEffect(() => {
+        if (!dockviewRef.current) {
+            return;
+        }
+        dockviewRef.current.updateOptions({
+            createLeftHeaderActionsElement: createGroupControlElement(props.leftHeaderActionsComponent, { addPortal }),
+        });
+    }, [props.leftHeaderActionsComponent]);
     return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
@@ -157,0 +175,0 @@ });

dist/esm/index.d.ts

@@ -6,3 +6,3 @@ export * from 'dockview-core';
 export * from './gridview/gridview';
-export { IDockviewGroupControlProps } from './dockview/groupControlsRenderer';
+export { IDockviewHeaderActionsProps } from './dockview/headerActionsRenderer';
 export { IWatermarkPanelProps } from './dockview/reactWatermarkPart';
@@ -9,0 +9,0 @@ export * from './paneview/paneview';

dist/esm/svg.d.ts

@@ -1,4 +0,4 @@
-/// <reference types="react" />
-export declare const CloseButton: () => JSX.Element;
-export declare const ExpandMore: () => JSX.Element;
+import * as React from 'react';
+export declare const CloseButton: () => React.JSX.Element;
+export declare const ExpandMore: () => React.JSX.Element;
 //# sourceMappingURL=svg.d.ts.map

package.json

 {
   "name": "dockview",
-  "version": "1.7.6",
+  "version": "1.8.0",
   "description": "Zero dependency layout manager supporting tabs, grids and splitviews with ReactJS support",
@@ -17,8 +17,8 @@ "main": "./dist/cjs/index.js",
   "scripts": {
-    "build:ci": "npm run build:cjs && npm run build:esm && npm run build:css",
+    "build:package": "npm run build:cjs && npm run build:esm && npm run build:css",
     "build:cjs": "cross-env ../../node_modules/.bin/tsc --project ./tsconfig.json --extendedDiagnostics",
     "build:css": "gulp sass",
     "build:esm": "cross-env ../../node_modules/.bin/tsc --project ./tsconfig.esm.json --extendedDiagnostics",
-    "build:modulefiles": "rollup -c",
-    "build": "npm run build:ci && npm run build:modulefiles",
+    "build:bundles": "rollup -c",
+    "build": "npm run build:package && npm run build:bundles",
     "clean": "rimraf dist/ .build/ .rollup.cache/",
@@ -60,3 +60,3 @@ "docs": "typedoc",
   "dependencies": {
-    "dockview-core": "^1.7.6"
+    "dockview-core": "^1.8.0"
   },
@@ -78,3 +78,3 @@ "devDependencies": {
   },
-  "gitHead": "5d1b6c336f066cfc43eb07ad6d27e1e30d1fe16f"
+  "gitHead": "2202a89c15d628c7245417c796625db3fc742c85"
 }

README.md

 <div align="center">
 <h1>dockview</h1>
 
-<p>Zero dependency layout manager supporting tabs, grids and splitviews with ReactJS support written in TypeScript</p>
+<p>Zero dependency layout manager supporting tabs, groups, grids and splitviews with ReactJS support written in TypeScript</p>
 
@@ -28,2 +28,3 @@ </div>
 -   Tabular docking and Drag and Drop support
+-   Floating groups, customized header bars and tab
 -   Documentation and examples
@@ -30,0 +31,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

9157970

increased by248.98%

Number of package files

155

increased by7.64%

Lines of code

53122

increased by8.56%

Number of lines in readme file

52

increased by1.96%

Dependency changes

• Updateddockview-core@^1.8.0