dockview - npm Package Compare versions

Comparing version 1.9.2 to 1.10.0

dist/cjs/dockview/defaultTab.d.ts

@@ -8,2 +8,1 @@ import { IDockviewPanelHeaderProps } from './dockview';
 export declare const DockviewDefaultTab: React.FunctionComponent<IDockviewDefaultTabProps>;
-//# sourceMappingURL=defaultTab.d.ts.map

dist/cjs/dockview/defaultTab.js

@@ -80,2 +80,1 @@ "use strict";
 exports.DockviewDefaultTab = DockviewDefaultTab;
-//# sourceMappingURL=defaultTab.js.map

dist/cjs/dockview/dockview.d.ts

 import * as React from 'react';
-import { DockviewDropEvent, DockviewDndOverlayEvent, DockviewPanelApi, DockviewApi, DockviewPanelRenderer, DroptargetOverlayModel } from 'dockview-core';
+import { DockviewWillDropEvent, DockviewDndOverlayEvent, DockviewPanelApi, DockviewApi, DockviewPanelRenderer, DroptargetOverlayModel, DockviewDidDropEvent } from 'dockview-core';
 import { IWatermarkPanelProps } from './reactWatermarkPart';
@@ -26,3 +26,4 @@ import { PanelCollection, PanelParameters } from '../types';
     watermarkComponent?: React.FunctionComponent<IWatermarkPanelProps>;
-    onDidDrop?: (event: DockviewDropEvent) => void;
+    onDidDrop?: (event: DockviewDidDropEvent) => void;
+    onWillDrop?: (event: DockviewWillDropEvent) => void;
     showDndOverlay?: (event: DockviewDndOverlayEvent) => boolean;
@@ -45,4 +46,5 @@ hideBorders?: boolean;
     rootOverlayModel?: DroptargetOverlayModel;
+    locked?: boolean;
+    disableDnd?: boolean;
 }
 export declare const DockviewReact: React.ForwardRefExoticComponent<IDockviewReactProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=dockview.d.ts.map

dist/cjs/dockview/dockview.js

@@ -121,2 +121,4 @@ "use strict";
             rootOverlayModel: props.rootOverlayModel,
+            locked: props.locked,
+            disableDnd: props.disableDnd,
         });
@@ -135,2 +137,16 @@ var _b = domRef.current, clientWidth = _b.clientWidth, clientHeight = _b.clientHeight;
         if (!dockviewRef.current) {
+            return;
+        }
+        dockviewRef.current.locked = !!props.locked;
+    }, [props.locked]);
+    React.useEffect(function () {
+        if (!dockviewRef.current) {
+            return;
+        }
+        dockviewRef.current.updateOptions({
+            disableDnd: props.disableDnd,
+        });
+    }, [props.disableDnd]);
+    React.useEffect(function () {
+        if (!dockviewRef.current) {
             return function () {
@@ -151,2 +167,17 @@ // noop
         if (!dockviewRef.current) {
+            return function () {
+                // noop
+            };
+        }
+        var disposable = dockviewRef.current.onWillDrop(function (event) {
+            if (props.onWillDrop) {
+                props.onWillDrop(event);
+            }
+        });
+        return function () {
+            disposable.dispose();
+        };
+    }, [props.onWillDrop]);
+    React.useEffect(function () {
+        if (!dockviewRef.current) {
             return;
@@ -250,2 +281,1 @@ }
 exports.DockviewReact.displayName = 'DockviewComponent';
-//# sourceMappingURL=dockview.js.map

dist/cjs/dockview/headerActionsRenderer.d.ts

@@ -34,2 +34,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=headerActionsRenderer.d.ts.map

dist/cjs/dockview/headerActionsRenderer.js

@@ -88,2 +88,1 @@ "use strict";
 exports.ReactHeaderActionsRendererPart = ReactHeaderActionsRendererPart;
-//# sourceMappingURL=headerActionsRenderer.js.map

dist/cjs/dockview/reactContentPart.d.ts

@@ -23,2 +23,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=reactContentPart.d.ts.map

dist/cjs/dockview/reactContentPart.js

@@ -51,2 +51,1 @@ "use strict";
 exports.ReactPanelContentPart = ReactPanelContentPart;
-//# sourceMappingURL=reactContentPart.js.map

dist/cjs/dockview/reactHeaderPart.d.ts

@@ -19,2 +19,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=reactHeaderPart.d.ts.map

dist/cjs/dockview/reactHeaderPart.js

@@ -44,2 +44,1 @@ "use strict";
 exports.ReactPanelHeaderPart = ReactPanelHeaderPart;
-//# sourceMappingURL=reactHeaderPart.js.map

dist/cjs/dockview/reactWatermarkPart.d.ts

@@ -25,2 +25,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=reactWatermarkPart.d.ts.map

dist/cjs/dockview/reactWatermarkPart.js

@@ -54,2 +54,1 @@ "use strict";
 exports.ReactWatermarkPart = ReactWatermarkPart;
-//# sourceMappingURL=reactWatermarkPart.js.map

dist/cjs/gridview/gridview.d.ts

@@ -23,2 +23,1 @@ import * as React from 'react';
 export declare const GridviewReact: React.ForwardRefExoticComponent<IGridviewReactProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=gridview.d.ts.map

dist/cjs/gridview/gridview.js

@@ -99,2 +99,1 @@ "use strict";
 exports.GridviewReact.displayName = 'GridviewComponent';
-//# sourceMappingURL=gridview.js.map

dist/cjs/gridview/view.d.ts

@@ -11,2 +11,1 @@ /// <reference types="react" />
 }
-//# sourceMappingURL=view.d.ts.map

dist/cjs/gridview/view.js

@@ -34,3 +34,5 @@ "use strict";
             api: this.api,
-            containerApi: new dockview_core_1.GridviewApi(this._params.accessor),
+            // TODO: fix casting hack
+            containerApi: new dockview_core_1.GridviewApi(this._params
+                .accessor),
         });
@@ -41,2 +43,1 @@ };
 exports.ReactGridPanelView = ReactGridPanelView;
-//# sourceMappingURL=view.js.map

dist/cjs/index.d.ts

@@ -11,2 +11,1 @@ export * from 'dockview-core';
 export * from './react';
-//# sourceMappingURL=index.d.ts.map

dist/cjs/index.js

@@ -25,2 +25,1 @@ "use strict";
 __exportStar(require("./react"), exports);
-//# sourceMappingURL=index.js.map

dist/cjs/paneview/paneview.d.ts

@@ -25,2 +25,1 @@ import * as React from 'react';
 export declare const PaneviewReact: React.ForwardRefExoticComponent<IPaneviewReactProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=paneview.d.ts.map

dist/cjs/paneview/paneview.js

@@ -141,2 +141,1 @@ "use strict";
 exports.PaneviewReact.displayName = 'PaneviewComponent';
-//# sourceMappingURL=paneview.js.map

dist/cjs/paneview/view.d.ts

@@ -20,2 +20,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=view.d.ts.map

dist/cjs/paneview/view.js

@@ -45,2 +45,1 @@ "use strict";
 exports.PanePanelSection = PanePanelSection;
-//# sourceMappingURL=view.js.map

dist/cjs/react.d.ts

@@ -34,4 +34,3 @@ import * as React from 'react';
 export declare const usePortalsLifecycle: PortalLifecycleHook;
-export declare function isReactElement(element: unknown): element is React.ReactElement;
+export declare function isReactComponent(component: any): boolean;
 export {};
-//# sourceMappingURL=react.d.ts.map

dist/cjs/react.js

@@ -62,3 +62,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isReactElement = exports.usePortalsLifecycle = exports.ReactPart = exports.ReactPartContext = void 0;
+exports.isReactComponent = exports.usePortalsLifecycle = exports.ReactPart = exports.ReactPartContext = void 0;
 var React = __importStar(require("react"));
@@ -130,9 +130,9 @@ var ReactDOM = __importStar(require("react-dom"));
         }
-        if (typeof this.component !== 'function') {
+        if (!isReactComponent(this.component)) {
             /**
              * we know this isn't a React.FunctionComponent so throw an error here.
-             * if we do not intercept this the React library will throw a very obsure error
-             * for the same reason, at least at this point we will emit a sensible stacktrace.
+             * if we do not intercept then React library will throw a very obsure error
+             * for the same reason... at least at this point we will emit a sensible stacktrace.
              */
-            throw new Error('Invalid Operation. dockview only supports React Functional Components.');
+            throw new Error('Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components');
         }
@@ -194,7 +194,10 @@ var bridgeComponent = React.createElement(React.forwardRef(ReactComponentBridge), {
 exports.usePortalsLifecycle = usePortalsLifecycle;
-// it does the job...
-function isReactElement(element) {
-    return !!(element === null || element === void 0 ? void 0 : element.type);
+function isReactComponent(component) {
+    /**
+     * Yes, we could use "react-is" but that would introduce an unwanted peer dependency
+     * so for now we will check in a rather crude fashion...
+     */
+    return (typeof component === 'function' /** Functional Componnts */ ||
+        !!(component === null || component === void 0 ? void 0 : component.$$typeof) /** React.memo(...) Components */);
 }
-exports.isReactElement = isReactElement;
-//# sourceMappingURL=react.js.map
+exports.isReactComponent = isReactComponent;

dist/cjs/splitview/splitview.d.ts

@@ -23,2 +23,1 @@ import * as React from 'react';
 export declare const SplitviewReact: React.ForwardRefExoticComponent<ISplitviewReactProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=splitview.d.ts.map

dist/cjs/splitview/splitview.js

@@ -94,2 +94,1 @@ "use strict";
 exports.SplitviewReact.displayName = 'SplitviewComponent';
-//# sourceMappingURL=splitview.js.map

dist/cjs/splitview/view.d.ts

@@ -11,2 +11,1 @@ /// <reference types="react" />
 }
-//# sourceMappingURL=view.d.ts.map

dist/cjs/splitview/view.js

@@ -40,2 +40,1 @@ "use strict";
 exports.ReactPanelView = ReactPanelView;
-//# sourceMappingURL=view.js.map

dist/cjs/svg.d.ts

 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/cjs/svg.js

@@ -36,2 +36,1 @@ "use strict";
 exports.ExpandMore = ExpandMore;
-//# sourceMappingURL=svg.js.map

dist/cjs/types.d.ts

@@ -9,2 +9,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=types.d.ts.map

dist/cjs/types.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=types.js.map

dist/esm/dockview/defaultTab.d.ts

@@ -8,2 +8,1 @@ import { IDockviewPanelHeaderProps } from './dockview';
 export declare const DockviewDefaultTab: React.FunctionComponent<IDockviewDefaultTabProps>;
-//# sourceMappingURL=defaultTab.d.ts.map

dist/esm/dockview/defaultTab.js

@@ -42,2 +42,1 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
-//# sourceMappingURL=defaultTab.js.map

dist/esm/dockview/dockview.d.ts

 import * as React from 'react';
-import { DockviewDropEvent, DockviewDndOverlayEvent, DockviewPanelApi, DockviewApi, DockviewPanelRenderer, DroptargetOverlayModel } from 'dockview-core';
+import { DockviewWillDropEvent, DockviewDndOverlayEvent, DockviewPanelApi, DockviewApi, DockviewPanelRenderer, DroptargetOverlayModel, DockviewDidDropEvent } from 'dockview-core';
 import { IWatermarkPanelProps } from './reactWatermarkPart';
@@ -26,3 +26,4 @@ import { PanelCollection, PanelParameters } from '../types';
     watermarkComponent?: React.FunctionComponent<IWatermarkPanelProps>;
-    onDidDrop?: (event: DockviewDropEvent) => void;
+    onDidDrop?: (event: DockviewDidDropEvent) => void;
+    onWillDrop?: (event: DockviewWillDropEvent) => void;
     showDndOverlay?: (event: DockviewDndOverlayEvent) => boolean;
@@ -45,4 +46,5 @@ hideBorders?: boolean;
     rootOverlayModel?: DroptargetOverlayModel;
+    locked?: boolean;
+    disableDnd?: boolean;
 }
 export declare const DockviewReact: React.ForwardRefExoticComponent<IDockviewReactProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=dockview.d.ts.map

dist/esm/dockview/dockview.js

@@ -79,2 +79,4 @@ import * as React from 'react';
             rootOverlayModel: props.rootOverlayModel,
+            locked: props.locked,
+            disableDnd: props.disableDnd,
         });
@@ -93,2 +95,16 @@ const { clientWidth, clientHeight } = domRef.current;
         if (!dockviewRef.current) {
+            return;
+        }
+        dockviewRef.current.locked = !!props.locked;
+    }, [props.locked]);
+    React.useEffect(() => {
+        if (!dockviewRef.current) {
+            return;
+        }
+        dockviewRef.current.updateOptions({
+            disableDnd: props.disableDnd,
+        });
+    }, [props.disableDnd]);
+    React.useEffect(() => {
+        if (!dockviewRef.current) {
             return () => {
@@ -109,2 +125,17 @@ // noop
         if (!dockviewRef.current) {
+            return () => {
+                // noop
+            };
+        }
+        const disposable = dockviewRef.current.onWillDrop((event) => {
+            if (props.onWillDrop) {
+                props.onWillDrop(event);
+            }
+        });
+        return () => {
+            disposable.dispose();
+        };
+    }, [props.onWillDrop]);
+    React.useEffect(() => {
+        if (!dockviewRef.current) {
             return;
@@ -208,2 +239,1 @@ }
 DockviewReact.displayName = 'DockviewComponent';
-//# sourceMappingURL=dockview.js.map

dist/esm/dockview/headerActionsRenderer.d.ts

@@ -34,2 +34,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=headerActionsRenderer.d.ts.map

dist/esm/dockview/headerActionsRenderer.js

@@ -70,2 +70,1 @@ import { ReactPart } from '../react';
 }
-//# sourceMappingURL=headerActionsRenderer.js.map

dist/esm/dockview/reactContentPart.d.ts

@@ -23,2 +23,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=reactContentPart.d.ts.map

dist/esm/dockview/reactContentPart.js

@@ -42,2 +42,1 @@ import { ReactPart } from '../react';
 }
-//# sourceMappingURL=reactContentPart.js.map

dist/esm/dockview/reactHeaderPart.d.ts

@@ -19,2 +19,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=reactHeaderPart.d.ts.map

dist/esm/dockview/reactHeaderPart.js

@@ -35,2 +35,1 @@ import { ReactPart } from '../react';
 }
-//# sourceMappingURL=reactHeaderPart.js.map

dist/esm/dockview/reactWatermarkPart.d.ts

@@ -25,2 +25,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=reactWatermarkPart.d.ts.map

dist/esm/dockview/reactWatermarkPart.js

@@ -45,2 +45,1 @@ import { ReactPart } from '../react';
 }
-//# sourceMappingURL=reactWatermarkPart.js.map

dist/esm/gridview/gridview.d.ts

@@ -23,2 +23,1 @@ import * as React from 'react';
 export declare const GridviewReact: React.ForwardRefExoticComponent<IGridviewReactProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=gridview.d.ts.map

dist/esm/gridview/gridview.js

@@ -57,2 +57,1 @@ import * as React from 'react';
 GridviewReact.displayName = 'GridviewComponent';
-//# sourceMappingURL=gridview.js.map

dist/esm/gridview/view.d.ts

@@ -11,2 +11,1 @@ /// <reference types="react" />
 }
-//# sourceMappingURL=view.d.ts.map

dist/esm/gridview/view.js

@@ -14,6 +14,7 @@ import { GridviewApi, GridviewPanel, } from 'dockview-core';
             api: this.api,
-            containerApi: new GridviewApi(this._params.accessor),
+            // TODO: fix casting hack
+            containerApi: new GridviewApi(this._params
+                .accessor),
         });
     }
 }
-//# sourceMappingURL=view.js.map

dist/esm/index.d.ts

@@ -11,2 +11,1 @@ export * from 'dockview-core';
 export * from './react';
-//# sourceMappingURL=index.d.ts.map

dist/esm/index.js

@@ -9,2 +9,1 @@ export * from 'dockview-core';
 export * from './react';
-//# sourceMappingURL=index.js.map

dist/esm/paneview/paneview.d.ts

@@ -25,2 +25,1 @@ import * as React from 'react';
 export declare const PaneviewReact: React.ForwardRefExoticComponent<IPaneviewReactProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=paneview.d.ts.map

dist/esm/paneview/paneview.js

@@ -86,2 +86,1 @@ import * as React from 'react';
 PaneviewReact.displayName = 'PaneviewComponent';
-//# sourceMappingURL=paneview.js.map

dist/esm/paneview/view.d.ts

@@ -20,2 +20,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=view.d.ts.map

dist/esm/paneview/view.js

@@ -36,2 +36,1 @@ import { ReactPart } from '../react';
 }
-//# sourceMappingURL=view.js.map

dist/esm/react.d.ts

@@ -34,4 +34,3 @@ import * as React from 'react';
 export declare const usePortalsLifecycle: PortalLifecycleHook;
-export declare function isReactElement(element: unknown): element is React.ReactElement;
+export declare function isReactComponent(component: any): boolean;
 export {};
-//# sourceMappingURL=react.d.ts.map

dist/esm/react.js

@@ -66,9 +66,9 @@ import * as React from 'react';
         }
-        if (typeof this.component !== 'function') {
+        if (!isReactComponent(this.component)) {
             /**
              * we know this isn't a React.FunctionComponent so throw an error here.
-             * if we do not intercept this the React library will throw a very obsure error
-             * for the same reason, at least at this point we will emit a sensible stacktrace.
+             * if we do not intercept then React library will throw a very obsure error
+             * for the same reason... at least at this point we will emit a sensible stacktrace.
              */
-            throw new Error('Invalid Operation. dockview only supports React Functional Components.');
+            throw new Error('Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components');
         }
@@ -125,6 +125,9 @@ const bridgeComponent = React.createElement(React.forwardRef(ReactComponentBridge), {
 };
-// it does the job...
-export function isReactElement(element) {
-    return !!(element === null || element === void 0 ? void 0 : element.type);
+export function isReactComponent(component) {
+    /**
+     * Yes, we could use "react-is" but that would introduce an unwanted peer dependency
+     * so for now we will check in a rather crude fashion...
+     */
+    return (typeof component === 'function' /** Functional Componnts */ ||
+        !!(component === null || component === void 0 ? void 0 : component.$$typeof) /** React.memo(...) Components */);
 }
-//# sourceMappingURL=react.js.map

dist/esm/splitview/splitview.d.ts

@@ -23,2 +23,1 @@ import * as React from 'react';
 export declare const SplitviewReact: React.ForwardRefExoticComponent<ISplitviewReactProps & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=splitview.d.ts.map

dist/esm/splitview/splitview.js

@@ -52,2 +52,1 @@ import * as React from 'react';
 SplitviewReact.displayName = 'SplitviewComponent';
-//# sourceMappingURL=splitview.js.map

dist/esm/splitview/view.d.ts

@@ -11,2 +11,1 @@ /// <reference types="react" />
 }
-//# sourceMappingURL=view.d.ts.map

dist/esm/splitview/view.js

@@ -18,2 +18,1 @@ import { SplitviewApi, SplitviewPanel, } from 'dockview-core';
 }
-//# sourceMappingURL=view.js.map

dist/esm/svg.d.ts

 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/svg.js

@@ -8,2 +8,1 @@ import * as React from 'react';
 };
-//# sourceMappingURL=svg.js.map

dist/esm/types.d.ts

@@ -9,2 +9,1 @@ import * as React from 'react';
 }
-//# sourceMappingURL=types.d.ts.map

dist/esm/types.js

 export {};
-//# sourceMappingURL=types.js.map

package.json

 {
   "name": "dockview",
-  "version": "1.9.2",
+  "version": "1.10.0",
   "description": "Zero dependency layout manager supporting tabs, grids and splitviews with ReactJS support",
@@ -46,5 +46,5 @@ "keywords": [
     "build:bundles": "rollup -c",
-    "build:cjs": "cross-env ../../node_modules/.bin/tsc --project ./tsconfig.json --extendedDiagnostics",
+    "build:cjs": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.json --verbose --extendedDiagnostics",
     "build:css": "gulp sass",
-    "build:esm": "cross-env ../../node_modules/.bin/tsc --project ./tsconfig.esm.json --extendedDiagnostics",
+    "build:esm": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.esm.json --verbose --extendedDiagnostics",
     "build:package": "npm run build:cjs && npm run build:esm && npm run build:css",
@@ -58,4 +58,4 @@ "clean": "rimraf dist/ .build/ .rollup.cache/",
   "dependencies": {
-    "dockview-core": "^1.9.2"
+    "dockview-core": "^1.10.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

11415752

increased by9.96%

Lines of code

66470

increased by7.8%

Worsened metrics

Number of package files

89

decreased by-41.83%

Dependency changes

• Updateddockview-core@^1.10.0