Merge branch 'master' of https://github.com/mathuo/dockview into 538-interested-in-porting-dockview-to-vuejs

packages/dockview-core/src/__tests__/dockview/components/panel/content.spec.ts

@@ -63,7 +63,7 @@ describe('contentContainer', () => {
 
         const cut = new ContentContainer(
             fromPartial<DockviewComponent>({
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
                 overlayRenderContainer,
             }),
             fromPartial<DockviewGroupPanelModel>({
@@ -86,7 +86,7 @@ describe('contentContainer', () => {
             view: {
                 content: contentRenderer,
             },
-            api: { renderer: 'onlyWhenVisibile' },
+            api: { renderer: 'onlyWhenVisible' },
         });
 
         cut.openPanel(panel as IDockviewPanel);
@@ -111,7 +111,7 @@ describe('contentContainer', () => {
             view: {
                 content: contentRenderer2,
             } as Partial<IDockviewPanelModel>,
-            api: { renderer: 'onlyWhenVisibile' },
+            api: { renderer: 'onlyWhenVisible' },
         } as Partial<IDockviewPanel>;
 
         cut.openPanel(panel2 as IDockviewPanel);
@@ -132,7 +132,7 @@ describe('contentContainer', () => {
         disposable.dispose();
     });
 
-    test("that panels renderered as 'onlyWhenVisibile' are removed when closed", () => {
+    test("that panels renderered as 'onlyWhenVisible' are removed when closed", () => {
         const overlayRenderContainer = fromPartial<OverlayRenderContainer>({
             detatch: jest.fn(),
         });
@@ -148,14 +148,14 @@ describe('contentContainer', () => {
 
         const panel1 = fromPartial<IDockviewPanel>({
             api: {
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
             },
             view: { content: new TestContentRenderer('panel_1') },
         });
 
         const panel2 = fromPartial<IDockviewPanel>({
             api: {
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
             },
             view: { content: new TestContentRenderer('panel_2') },
         });

packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts

@@ -270,7 +270,7 @@ describe('dockviewGroupPanelModel', () => {
         options = {};
 
         panelApi = fromPartial<DockviewPanelApi>({
-            renderer: 'onlyWhenVisibile',
+            renderer: 'onlyWhenVisible',
             onDidTitleChange: new Emitter().event,
             onDidParametersChange: new Emitter().event,
         });

packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts

@@ -43,7 +43,7 @@ describe('dockviewPanel', () => {
             group,
             model,
             {
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
             }
         );
 
@@ -102,7 +102,7 @@ describe('dockviewPanel', () => {
             group,
             model,
             {
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
             }
         );
 
@@ -157,7 +157,7 @@ describe('dockviewPanel', () => {
             group,
             model,
             {
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
             }
         );
 
@@ -203,7 +203,7 @@ describe('dockviewPanel', () => {
             group,
             model,
             {
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
             }
         );
 
@@ -250,7 +250,7 @@ describe('dockviewPanel', () => {
             group,
             model,
             {
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
             }
         );
 
@@ -295,7 +295,7 @@ describe('dockviewPanel', () => {
             group,
             model,
             {
-                renderer: 'onlyWhenVisibile',
+                renderer: 'onlyWhenVisible',
             }
         );
 

packages/dockview-core/src/dockview/components/panel/content.ts

@@ -132,7 +132,7 @@ export class ContentContainer
         let container: HTMLElement;
 
         switch (panel.api.renderer) {
-            case 'onlyWhenVisibile':
+            case 'onlyWhenVisible':
                 this.group.renderContainer.detatch(panel);
                 if (this.panel) {
                     if (doRender) {
@@ -184,7 +184,7 @@ export class ContentContainer
 
     public closePanel(): void {
         if (this.panel) {
-            if (this.panel.api.renderer === 'onlyWhenVisibile') {
+            if (this.panel.api.renderer === 'onlyWhenVisible') {
                 this.panel.view.content.element.parentElement?.removeChild(
                     this.panel.view.content.element
                 );

packages/dockview-core/src/dockview/dockviewComponent.ts

@@ -416,7 +416,7 @@ export class DockviewComponent
     }
 
     get renderer(): DockviewPanelRenderer {
-        return this.options.defaultRenderer ?? 'onlyWhenVisibile';
+        return this.options.defaultRenderer ?? 'onlyWhenVisible';
     }
 
     constructor(options: DockviewComponentOptions) {

packages/dockview-core/src/overlayRenderContainer.ts

@@ -4,7 +4,7 @@ import { getDomNodePagePosition, toggleClass } from './dom';
 import { CompositeDisposable, Disposable, IDisposable } from './lifecycle';
 import { IDockviewPanel } from './dockview/dockviewPanel';
 
-export type DockviewPanelRenderer = 'onlyWhenVisibile' | 'always';
+export type DockviewPanelRenderer = 'onlyWhenVisible' | 'always';
 
 export interface IRenderable {
     readonly element: HTMLElement;

packages/docs/sandboxes/react/dockview/render-mode/src/app.tsx

@@ -55,9 +55,9 @@ const components = {
                         <button
                             onClick={() => {
                                 setMode(
-                                    mode === 'onlyWhenVisibile'
+                                    mode === 'onlyWhenVisible'
                                         ? 'always'
-                                        : 'onlyWhenVisibile'
+                                        : 'onlyWhenVisible'
                                 );
                             }}
                         >