rei-mirrors/dockview
1
0
Fork 0
mirror of https://github.com/mathuo/dockview synced 2025-05-03 10:08:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: disableFloatingGroups

Browse Source
This commit is contained in:
mathuo 2023-07-12 22:06:30 +01:00
parent 07df1b48ba
commit 38b02a3775
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
3 changed files with 25 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/dockview-core/src/dockview/dockviewComponent.ts
View File

@ -85,6 +85,7 @@ export type DockviewComponentUpdateOptions = Pick<
| 'defaultTabComponent'
| 'createLeftHeaderActionsElement'
| 'createRightHeaderActionsElement'
| 'disableFloatingGroups'
>;
export interface DockviewDropEvent extends GroupviewDropEvent {

12
packages/dockview/src/dockview/dockview.tsx
View File

@ -68,6 +68,7 @@ export interface IDockviewReactProps {
rightHeaderActionsComponent?: React.FunctionComponent<IDockviewHeaderActionsProps>;
leftHeaderActionsComponent?: React.FunctionComponent<IDockviewHeaderActionsProps>;
singleTabMode?: 'fullwidth' | 'default';
disableFloatingGroups?: boolean;
}
const DEFAULT_REACT_TAB = 'props.defaultTabComponent';
@ -159,8 +160,8 @@ export const DockviewReact = React.forwardRef(
props.rightHeaderActionsComponent,
{ addPortal }
),
singleTabMode: props.singleTabMode,
disableFloatingGroups: props.disableFloatingGroups,
});
const { clientWidth, clientHeight } = domRef.current;
@ -231,6 +232,15 @@ export const DockviewReact = React.forwardRef(
});
}, [props.tabComponents]);
React.useEffect(() => {
if (!dockviewRef.current) {
return;
}
dockviewRef.current.updateOptions({
disableFloatingGroups: props.disableFloatingGroups,
});
}, [props.disableFloatingGroups]);
React.useEffect(() => {
if (!dockviewRef.current) {
return;

13
packages/docs/sandboxes/floatinggroup-dockview/src/app.tsx
View File

@ -132,6 +132,9 @@ export const DockviewPersistance = (props: { theme?: string }) => {
const [layout, setLayout] =
useLocalStorage<SerializedDockview>('floating.layout');
const [disableFloatingGroups, setDisableFloatingGroups] =
React.useState<boolean>(false);
const load = (api: DockviewApi) => {
api.clear();
if (layout) {
@ -194,6 +197,15 @@ export const DockviewPersistance = (props: { theme?: string }) => {
>
Add Floating Group
</button>
<button
onClick={() => {
setDisableFloatingGroups((x) => !x);
}}
>
{`${
disableFloatingGroups ? 'Enable' : 'Disable'
} floating groups`}
</button>
</div>
<div
style={{
@ -207,6 +219,7 @@ export const DockviewPersistance = (props: { theme?: string }) => {
watermarkComponent={Watermark}
leftHeaderActionsComponent={LeftComponent}
rightHeaderActionsComponent={RightComponent}
disableFloatingGroups={disableFloatingGroups}
className={`${props.theme || 'dockview-theme-abyss'}`}
/>
</div>