dockview-react 7.0.3 → 8.0.0

package/LICENCE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 mathuo
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,22 +1,26 @@
 <div align="center">
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://github.com/dockview/dockview/blob/HEAD/static/img/dockview-lockup-dark.svg?raw=true">
+  <img src="https://github.com/dockview/dockview/blob/HEAD/static/img/dockview-lockup-light.svg?raw=true" alt="Dockview" width="480">
+</picture>
+
 <h1>dockview-react</h1>
 
-<p>React bindings for dockview — zero dependency layout manager supporting tabs, groups, grids and splitviews</p>
+<p>React bindings for dockview, a zero dependency layout manager supporting tabs, groups, grids and splitviews</p>
+
+[![npm version](https://img.shields.io/npm/v/dockview-react)](https://www.npmjs.com/package/dockview-react)
+[![npm downloads](https://img.shields.io/npm/dm/dockview-react)](https://www.npmjs.com/package/dockview-react)
+[![CI](https://img.shields.io/github/actions/workflow/status/dockview/dockview/main.yml?branch=master&label=CI)](https://github.com/dockview/dockview/actions?query=workflow%3ACI)
+[![Coverage](https://img.shields.io/sonar/coverage/dockview_dockview?server=https%3A%2F%2Fsonarcloud.io)](https://sonarcloud.io/summary/overall?id=dockview_dockview)
+[![Quality gate](https://img.shields.io/sonar/quality_gate/dockview_dockview?server=https%3A%2F%2Fsonarcloud.io)](https://sonarcloud.io/summary/overall?id=dockview_dockview)
+[![Bundle size](https://img.shields.io/bundlephobia/minzip/dockview-react?label=size)](https://bundlephobia.com/result?p=dockview-react)
 
 </div>
 
 ---
 
-[![npm version](https://badge.fury.io/js/dockview-react.svg)](https://www.npmjs.com/package/dockview-react)
-[![npm](https://img.shields.io/npm/dm/dockview-react)](https://www.npmjs.com/package/dockview-react)
-[![CI Build](https://github.com/mathuo/dockview/workflows/CI/badge.svg)](https://github.com/mathuo/dockview/actions?query=workflow%3ACI)
-[![Coverage](https://sonarcloud.io/api/project_badges/measure?project=mathuo_dockview&metric=coverage)](https://sonarcloud.io/summary/overall?id=mathuo_dockview)
-[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=mathuo_dockview&metric=alert_status)](https://sonarcloud.io/summary/overall?id=mathuo_dockview)
-[![Bundle Phobia](https://badgen.net/bundlephobia/minzip/dockview-react)](https://bundlephobia.com/result?p=dockview-react)
-
-##
-
-![](https://github.com/mathuo/dockview/blob/HEAD/packages/docs/static/img/splashscreenv2.png?raw=true)
+![A Dockview layout showing docked, tabbed and split panels in a trading workbench](https://github.com/dockview/dockview/blob/HEAD/static/img/demo-hero.webp?raw=true)
 
 Please see the website: https://dockview.dev
 
@@ -36,11 +40,11 @@ Please see the website: https://dockview.dev
 -   High test coverage
 -   Documentation website with live examples
 -   Transparent builds and Code Analysis
--   Security at mind - verified publishing and builds through GitHub Actions
+-   Security in mind - verified publishing and builds through GitHub Actions
 
 ## Quick Start
 
-Dockview has a peer dependency on `react >= 16.8.0` and `react-dom >= 16.8.0`. Install from [npm](https://www.npmjs.com/package/dockview-react):
+Dockview has a peer dependency on `react` and `react-dom`, versions 16.8 to 19. Install from [npm](https://www.npmjs.com/package/dockview-react):
 
 ```
 npm install dockview-react
@@ -52,10 +56,10 @@ Import the stylesheet:
 @import 'dockview-react/dist/styles/dockview.css';
 ```
 
-Apply a theme and render the component:
+Pass a theme and render the component:
 
 ```tsx
-import { DockviewReact } from 'dockview-react';
+import { DockviewReact, themeDark } from 'dockview-react';
 
 const components = {
     myComponent: (props) => <div>Hello World</div>,
@@ -63,8 +67,9 @@ const components = {
 
 function App() {
     return (
-        <div className="dockview-theme-dark" style={{ height: '400px' }}>
+        <div style={{ height: '400px' }}>
             <DockviewReact
+                theme={themeDark}
                 components={components}
                 onReady={(event) => {
                     event.api.addPanel({

package/dist/cjs/dockview/reactContextMenuItemPart.d.ts

@@ -1,6 +1,12 @@
 import React from 'react';
 import { ReactPortalStore } from '../react';
-import { IContextMenuItemRenderer, IContextMenuItemComponentProps } from 'dockview';
+import { IContextMenuItemRenderer, IContextMenuItemComponentProps, IChipContextMenuItemComponentProps } from 'dockview';
+/**
+ * The same renderer serves both the tab context menu (props carry a `panel`)
+ * and the tab group chip context menu (props carry a `tabGroup`), so it accepts
+ * either prop shape.
+ */
+type ContextMenuItemProps = IContextMenuItemComponentProps | IChipContextMenuItemComponentProps;
 export declare class ReactContextMenuItemPart implements IContextMenuItemRenderer {
     readonly id: string;
     private readonly component;
@@ -8,7 +14,8 @@ export declare class ReactContextMenuItemPart implements IContextMenuItemRendere
     private readonly _element;
     private part?;
     get element(): HTMLElement;
-    constructor(id: string, component: React.FunctionComponent<IContextMenuItemComponentProps>, reactPortalStore: ReactPortalStore);
-    init(props: IContextMenuItemComponentProps): void;
+    constructor(id: string, component: React.FunctionComponent<ContextMenuItemProps>, reactPortalStore: ReactPortalStore);
+    init(props: ContextMenuItemProps): void;
     dispose(): void;
 }
+export {};

package/dist/cjs/index.d.ts

@@ -1,8 +1,8 @@
 export * from 'dockview';
 export * from './dockview/dockview';
 export * from './dockview/defaultTab';
-export { IDockviewTabGroupChipProps } from './dockview/reactTabGroupChipPart';
-export { IDockviewGroupDragGhostProps } from './dockview/reactGroupDragGhostPart';
+export { type IDockviewTabGroupChipProps } from './dockview/reactTabGroupChipPart';
+export { type IDockviewGroupDragGhostProps } from './dockview/reactGroupDragGhostPart';
 export * from './splitview/splitview';
 export * from './gridview/gridview';
 export * from './paneview/paneview';

package/dist/cjs/svg.d.ts

@@ -1,3 +1,4 @@
 import React from 'react';
 export declare const CloseButton: () => React.JSX.Element;
+export declare const PinButton: () => React.JSX.Element;
 export declare const ExpandMore: () => React.JSX.Element;