@difizen/libro-lab 0.1.9 → 0.1.11

package/src/{menu → command}/module.ts

@@ -1,10 +1,10 @@
 import { createSlotPreference, HeaderArea, ManaModule } from '@difizen/mana-app';
 
+import { LabMenu } from './lab-menu-contribution.js';
 import { MenuBarView } from './menu-bar-view.js';
-import { HeaderMenu } from './menu-contribution.js';
 
 export const LibroLabHeaderMenuModule = ManaModule.create().register(
-  HeaderMenu,
+  LabMenu,
   MenuBarView,
   createSlotPreference({
     slot: HeaderArea.middle,

package/src/editor-viewer/code-editor-open-handler.ts

@@ -5,7 +5,7 @@ import { Priority } from '@difizen/mana-app';
 import { NavigatableViewOpenHandler, OpenHandler, singleton } from '@difizen/mana-app';
 
 import type { CodeEditorViewer } from './code-editor-viewer.js';
-import { CodeEditorViewerFactory } from './protocol.js';
+import { CodeEditorViewerFactory, textFileTypes } from './protocol.js';
 
 @singleton({ contrib: OpenHandler })
 export class CodeEditorViewerOpenHandler extends NavigatableViewOpenHandler<CodeEditorViewer> {
@@ -14,10 +14,7 @@ export class CodeEditorViewerOpenHandler extends NavigatableViewOpenHandler<Code
   id = CodeEditorViewerFactory;
 
   canHandle(uri: URI, options?: ViewOpenHandlerOptions) {
-    if (
-      uri.scheme === 'file' &&
-      !['.tar', '.zip', '.7z', '.gz', 'rar'].includes(uri.path.ext)
-    ) {
+    if (uri.scheme === 'file' && textFileTypes.includes(uri.path.ext)) {
       return 100;
     }
     return Priority.IDLE;

package/src/editor-viewer/code-editor-viewer.tsx

@@ -170,6 +170,13 @@ export class CodeEditorViewer extends BaseView implements NavigatableView, Savea
     return new URI(this.filePath);
   }
 
+  override onViewResize = () => {
+    if (!this.e2Editor) {
+      return;
+    }
+    this.e2Editor.codeEditor.layout();
+  };
+
   createMoveToUri(resourceUri: URI): URI | undefined {
     this.filePath = resourceUri.path.toString();
     return resourceUri;

package/src/editor-viewer/index.less

@@ -1,3 +1,19 @@
 .libro-lab-editor-viewer {
   height: 100%;
 }
+
+.libro-lab-default-viewer {
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+.libro-lab-default-viewer-text {
+  font-size: 18px;
+  color: #000000d8;
+  line-height: 26px;
+  text-align: center;
+  font-weight: 500;
+}

package/src/editor-viewer/libro-default-open-handler.ts

@@ -0,0 +1,34 @@
+import { LibroJupyterConfiguration } from '@difizen/libro-jupyter';
+import type { URI, ViewOpenHandlerOptions } from '@difizen/mana-app';
+import { ConfigurationService, inject } from '@difizen/mana-app';
+import { NavigatableViewOpenHandler, OpenHandler, singleton } from '@difizen/mana-app';
+import { LibroDefaultViewerFactory } from './protocol.js';
+import type { LibroDefaultViewer } from './libro-default-viewer.js';
+
+@singleton({ contrib: OpenHandler })
+export class LibroDefaultViewerOpenHandler extends NavigatableViewOpenHandler<LibroDefaultViewer> {
+  @inject(ConfigurationService) protected configurationService: ConfigurationService;
+
+  id = LibroDefaultViewerFactory;
+
+  canHandle() {
+    return 100;
+  }
+
+  override async open(uri: URI, options: ViewOpenHandlerOptions = {}) {
+    const { viewOptions, ...extra } = options;
+    const slot = await this.configurationService.get(
+      LibroJupyterConfiguration['OpenSlot'],
+    );
+
+    return super.open(uri, {
+      slot,
+      viewOptions: {
+        path: uri.path.toString(),
+        ...viewOptions,
+      },
+      reveal: true,
+      ...extra,
+    });
+  }
+}

package/src/editor-viewer/libro-default-viewer.tsx

@@ -0,0 +1,60 @@
+import type { NavigatableView } from '@difizen/mana-app';
+import {
+  inject,
+  LabelProvider,
+  prop,
+  URI,
+  URIIconReference,
+  ViewOption,
+} from '@difizen/mana-app';
+import { BaseView, transient, view } from '@difizen/mana-app';
+import React from 'react';
+import './index.less';
+
+import type { EditorOption } from './protocol.js';
+import { LibroDefaultViewerFactory } from './protocol.js';
+
+const DefaultViewerComponent: React.FC = () => {
+  return (
+    <div className="libro-lab-default-viewer">
+      <img
+        src="https://mdn.alipayobjects.com/huamei_xt20ge/afts/img/A*BcWvQL6qB0cAAAAAAAAAAAAADiuUAQ/original"
+        width={322}
+        height={228}
+      ></img>
+      <div className="libro-lab-default-viewer-text">当前文件类型暂不支持查看</div>
+    </div>
+  );
+};
+
+@transient()
+@view(LibroDefaultViewerFactory)
+export class LibroDefaultViewer extends BaseView implements NavigatableView {
+  override view = DefaultViewerComponent;
+
+  @prop() filePath?: string;
+
+  constructor(
+    @inject(ViewOption)
+    options: EditorOption,
+    @inject(LabelProvider) labelProvider: LabelProvider,
+  ) {
+    super();
+    this.title.caption = options.path;
+    this.filePath = options.path;
+    const uri = URI.withScheme(new URI(options.path), 'file');
+    const uriRef = URIIconReference.create('file', new URI(options.path));
+    const iconClass = labelProvider.getIcon(uriRef);
+    this.title.icon = <div className={iconClass} />;
+    this.title.label = uri.path.base;
+  }
+
+  getResourceUri(): URI | undefined {
+    return new URI(this.filePath);
+  }
+
+  createMoveToUri(resourceUri: URI): URI | undefined {
+    this.filePath = resourceUri.path.toString();
+    return resourceUri;
+  }
+}

package/src/editor-viewer/module.ts

@@ -2,7 +2,14 @@ import { ManaModule } from '@difizen/mana-app';
 
 import { CodeEditorViewerOpenHandler } from './code-editor-open-handler.js';
 import { CodeEditorViewer } from './code-editor-viewer.js';
+import { LibroDefaultViewerOpenHandler } from './libro-default-open-handler.js';
+import { LibroDefaultViewer } from './libro-default-viewer.js';
 
 export const CodeEditorViewerModule = ManaModule.create(
   'CodeEditorViewerModule',
-).register(CodeEditorViewer, CodeEditorViewerOpenHandler);
+).register(
+  CodeEditorViewer,
+  LibroDefaultViewer,
+  CodeEditorViewerOpenHandler,
+  LibroDefaultViewerOpenHandler,
+);

package/src/editor-viewer/protocol.ts

@@ -1,5 +1,30 @@
 export const CodeEditorViewerFactory = 'libro-lab-editor-viewer';
 
+export const LibroDefaultViewerFactory = 'libro-lab-default-viewer';
+
+export const textFileTypes: string[] = [
+  '.py',
+  '.txt',
+  '.sh',
+  '.tex',
+  '.html',
+  '.xml',
+  '.log',
+  '.ini',
+  '.yaml',
+  '.yml',
+  '.js',
+  '.ts',
+  '.csv',
+  '.css',
+  '.conf',
+  '.bat',
+  '.json',
+  '.jsonl',
+  '.md',
+  '',
+];
+
 export interface EditorOption {
   path: string;
   loadType?: string;

package/src/index.less

@@ -5,13 +5,17 @@
         background-color: #f0f2f51f;
         min-width: 40px;
         box-shadow:
-          1px 0 0 0 rgba(0, 10, 26, 0.84%),
-          2px 0 0 0 rgba(255, 255, 255, 4.8%);
+          1px 0 0 0 #000a1a02,
+          2px 0 0 0 #ffffff0c;
 
         .mana-tabs-ink-bar {
           display: none;
         }
 
+        .mana-tabs-tab:hover {
+          background-color: unset;
+        }
+
         .mana-tabs-tab {
           width: 40px;
           height: 40px;
@@ -32,12 +36,20 @@
           }
         }
 
+        .mana-tabs-tab-btn:hover {
+          background-color: #000a1a1f;
+
+          .mana-tab-icon {
+            color: #00000059;
+          }
+        }
+
         .mana-tabs-tab-active {
           .mana-tabs-tab-btn {
             background-color: #000a1a1f;
 
             .mana-tab-icon {
-              color: #1890ff;
+              color: #000a1a7f;
             }
           }
         }
@@ -70,9 +82,9 @@
 
 .default-folder-icon,
 .default-file-icon {
-  color: rgba(0, 0, 0, 45%);
+  color: #00000072;
 }
 
 .mana-tree-node-segment-grow {
-  color: rgba(0, 0, 0, 65%);
+  color: #000000a5;
 }

package/src/index.ts

@@ -3,7 +3,7 @@ export * from './lab-app.js';
 export * from './github-link/index.js';
 export * from './config/index.js';
 export * from './layout/index.js';
-export * from './menu/index.js';
+export * from './command/index.js';
 export * from './toc/index.js';
 export * from './welcome/index.js';
 export * from './kernel-manager/index.js';

package/src/lab-app.ts

@@ -1,9 +1,10 @@
 import {
   LibroService,
-  ServerConnection,
   LibroJupyterConfiguration,
+  ServerConnection,
   ServerManager,
 } from '@difizen/libro-jupyter';
+import { terminalDefaultSlot } from '@difizen/libro-terminal';
 import type { FileTreeView } from '@difizen/mana-app';
 import {
   ConfigurationService,
@@ -37,6 +38,10 @@ export class LibroLabApp implements ApplicationContribution {
       LibroJupyterConfiguration['OpenSlot'],
       LibroLabLayoutSlots.content,
     );
+    this.configurationService.set(
+      terminalDefaultSlot,
+      LibroLabLayoutSlots.contentBottom,
+    );
     this.serverManager.ready
       .then(() => {
         this.layoutService.setAreaVisible(LibroLabLayoutSlots.navigator, true);

package/src/layout/layout-service.ts

@@ -1,5 +1,5 @@
 import { LibroNavigatableView, LibroService } from '@difizen/libro-jupyter';
-import type { View, ViewOpenHandlerOptions } from '@difizen/mana-app';
+import type { View, ViewOpenHandlerOptions, ViewOpenOption } from '@difizen/mana-app';
 import { observable } from '@difizen/mana-app';
 import {
   DefaultSlotView,
@@ -13,7 +13,6 @@ import type { LibroLabLayoutSlotsType, StatusType } from './protocol.js';
 import { LibroLabLayoutSlots } from './protocol.js';
 
 export type VisibilityMap = Record<LibroLabLayoutSlotsType, boolean>;
-
 @singleton()
 export class LayoutService {
   protected readonly slotViewManager: SlotViewManager;
@@ -26,6 +25,9 @@ export class LayoutService {
     this.slotViewManager = slotViewManager;
     this.libroService = libroService;
     this.onOpenSlotActiveChange();
+    this.slotViewManager.onViewAdded((args) => {
+      this.onViewAdded(args.slot, args.view, args.option);
+    });
   }
 
   @prop()
@@ -50,8 +52,27 @@ export class LayoutService {
     this.visibilityMap[slot] = visible;
   }
 
+  protected onViewAdded(
+    slot: string,
+    view: View | undefined,
+    option: ViewOpenOption | undefined,
+  ) {
+    if (!view) {
+      // TODO: hide slot
+      return;
+    }
+    if (Object.keys(this.visibilityMap).includes(slot)) {
+      if (option?.reveal) {
+        this.setAreaVisible(slot as LibroLabLayoutSlotsType, true);
+      }
+    }
+  }
+
   async addView(view: View, option?: ViewOpenHandlerOptions): Promise<void> {
     const { slot = LibroLabLayoutSlots.main, ...viewOpenOption } = option || {};
+    if (option?.reveal) {
+      this.setAreaVisible(slot, true);
+    }
     await this.slotViewManager.addView(view, slot, viewOpenOption);
   }
 
@@ -82,9 +103,10 @@ export class LayoutService {
       );
       observable(slotView);
       if (slotView instanceof DefaultSlotView) {
-        slotView.onActiveChange(() => {
+        slotView.onActiveChange(async () => {
           const active = slotView.active;
           if (active instanceof LibroNavigatableView) {
+            await active.ready;
             active.libroView?.focus();
             this.libroService.active = active.libroView;
           } else {

package/src/module.tsx

@@ -9,6 +9,7 @@ import {
   HeaderArea,
 } from '@difizen/mana-app';
 
+import { LibroLabHeaderMenuModule } from './command/module.js';
 import { LabConfigAppContribution } from './config/config-contribution.js';
 import { CodeEditorViewerModule } from './editor-viewer/index.js';
 import { GithubLinkView } from './github-link/index.js';
@@ -24,7 +25,6 @@ import {
 import { SaveableTabView } from './layout/saveable-tab-view.js';
 import './index.less';
 import { LibroLabSideTabView } from './layout/side-tab-view.js';
-import { LibroLabHeaderMenuModule } from './menu/module.js';
 import { LibroLabTocModule } from './toc/module.js';
 import { EntryPointView } from './welcome/entry-point-view.js';
 import { WelcomeView } from './welcome/index.js';

package/src/welcome/entry-point-view.tsx

@@ -6,6 +6,7 @@ import {
   FileCreateModal,
   FileView,
 } from '@difizen/libro-jupyter';
+import { TerminalCommands } from '@difizen/libro-terminal';
 import {
   CommandRegistry,
   ModalService,
@@ -19,7 +20,6 @@ import { Col, Row } from 'antd';
 import { forwardRef, useEffect, useState } from 'react';
 
 import { TerminalIcon } from '../common/icon.js';
-import { MenuCommands } from '../menu/index.js';
 
 import './index.less';
 
@@ -123,7 +123,7 @@ export const EntryPointComponent = forwardRef(function EntryPointComponent() {
           <div
             className="libro-lab-entry-point-item"
             onClick={() => {
-              commandRegistry.executeCommand(MenuCommands.OpenTerminal.id);
+              commandRegistry.executeCommand(TerminalCommands['OpenTerminal'].id);
             }}
           >
             <TerminalIcon />

package/es/menu/index.d.ts

@@ -1,5 +0,0 @@
-export * from './menu-bar-view.js';
-export * from './menu-command.js';
-export * from './menu-contribution.js';
-export * from './module.js';
-//# sourceMappingURL=index.d.ts.map

package/es/menu/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/menu/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,aAAa,CAAC"}

package/es/menu/index.js

@@ -1,4 +0,0 @@
-export * from "./menu-bar-view.js";
-export * from "./menu-command.js";
-export * from "./menu-contribution.js";
-export * from "./module.js";

package/es/menu/menu-bar-view.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu-bar-view.d.ts","sourceRoot":"","sources":["../../src/menu/menu-bar-view.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,QAAQ,EAMT,MAAM,mBAAmB,CAAC;AAG3B,eAAO,MAAM,oBAAoB,mFAE/B,CAAC;AAEH,qBAEa,WAAY,SAAQ,QAAQ;IAC9B,IAAI,oFAAwB;IAErC,KAAK,SAAK;;CAOX"}

package/es/menu/menu-command.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu-command.d.ts","sourceRoot":"","sources":["../../src/menu/menu-command.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyIxB,CAAC"}

package/es/menu/menu-contribution.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu-contribution.d.ts","sourceRoot":"","sources":["../../src/menu/menu-contribution.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,YAAY,EAEb,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAqB,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC7E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EACL,mBAAmB,EACnB,eAAe,EAGf,gBAAgB,EAEhB,WAAW,EACZ,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAK5D,yBAAiB,WAAW,CAAC;IACpB,MAAM,IAAI,UAA+B,CAAC;IAC1C,MAAM,IAAI,UAA+B,CAAC;IAC1C,MAAM,IAAI,UAA+B,CAAC;IAC1C,MAAM,GAAG,UAA8B,CAAC;IACxC,MAAM,QAAQ,UAAmC,CAAC;IAClD,MAAM,IAAI,UAA+B,CAAC;CAClD;AAED,qBACa,UAAW,YAAW,gBAAgB,EAAE,mBAAmB;IAC7C,SAAS,CAAC,eAAe,EAAE,eAAe,CAAC;IAC9C,SAAS,CAAC,YAAY,EAAE,YAAY,CAAC;IACpC,SAAS,CAAC,aAAa,EAAE,aAAa,CAAC;IACrC,eAAe,EAAE,eAAe,CAAC;IACrC,WAAW,EAAE,WAAW,CAAC;IAE9C,aAAa,CAAC,IAAI,EAAE,YAAY;IAkLhC,gBAAgB,CAAC,QAAQ,EAAE,eAAe;CAgmB3C"}

package/es/menu/module.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../src/menu/module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAKjF,eAAO,MAAM,wBAAwB,YAOpC,CAAC"}

package/src/menu/index.ts

@@ -1,4 +0,0 @@
-export * from './menu-bar-view.js';
-export * from './menu-command.js';
-export * from './menu-contribution.js';
-export * from './module.js';