@difizen/libro-core 0.0.0-snapshot-20241017072317

package/src/add-cell/libro-add-cell-view.tsx

@@ -0,0 +1,99 @@
+import { DisplayWrapComponent } from '@difizen/libro-common';
+import {
+  inject,
+  transient,
+  prop,
+  useInject,
+  BaseView,
+  CommandRegistry,
+  view,
+  ViewInstance,
+} from '@difizen/mana-app';
+import { Button } from 'antd';
+import { forwardRef } from 'react';
+
+import { CellService } from '../cell/index.js';
+import type { CellMeta } from '../cell/index.js';
+import { NotebookCommands } from '../command/index.js';
+import type { LibroView } from '../libro-view.js';
+import { PlusOutlined } from '../material-from-designer.js';
+import './index.less';
+
+type AddType = {
+  name: string;
+  type: string;
+};
+
+export const LibroAddCell: React.FC = () => {
+  const instance = useInject<LibroAddCellView>(ViewInstance);
+  const command = useInject(CommandRegistry);
+  const addCell = async (type: string) => {
+    command.executeCommand(
+      NotebookCommands['InsertCellBottom'].id,
+      instance.parent,
+      type,
+    );
+  };
+  return (
+    <div className="libro-add-cell-container default-add-cell-container">
+      {instance.getCellList().map((item: AddType) => {
+        return (
+          <Button
+            className="libro-add-cell-container-item "
+            key={item.name}
+            onClick={() => {
+              addCell(item.type);
+            }}
+            icon={<PlusOutlined className="libro-add-cell-icon" />}
+          >
+            {item.name}
+          </Button>
+        );
+      })}
+    </div>
+  );
+};
+
+export const LibroWrappedAddCell = forwardRef(function LibroWrappedAddCell() {
+  const instance = useInject<LibroAddCellView>(ViewInstance);
+  return (
+    <DisplayWrapComponent mode={!instance.parent?.model.cellsEditable}>
+      <LibroAddCell />
+    </DisplayWrapComponent>
+  );
+});
+
+@transient()
+@view('libro-add-cell-view')
+export class LibroAddCellView extends BaseView {
+  parent: LibroView | undefined = undefined;
+  override view = LibroWrappedAddCell;
+
+  @prop()
+  addList: CellMeta[] = [];
+
+  cellService: CellService;
+
+  constructor(@inject(CellService) cellService: CellService) {
+    super();
+    this.cellService = cellService;
+  }
+
+  override onViewMount() {
+    this.addList = this.cellService.cellsMeta;
+  }
+
+  override onViewUnmount() {
+    //
+  }
+
+  override onViewResize() {
+    //
+  }
+
+  defaultFilter = (cellmeta: CellMeta) => cellmeta.type !== 'raw';
+
+  getCellList(filter = this.defaultFilter) {
+    return this.addList.filter(filter);
+  }
+}

package/src/cell/README.md

@@ -0,0 +1,14 @@
+# Cell abstraction
+
+## Cell View
+
+缩进代表继承关系
+
+- LibroCellView
+  - LibroEditorCellView: 带有文本编辑器相关能力
+    - LibroEditableExecutableCellView: 带有执行、输出能力
+      - LibroCodeCellView
+        - AIStudioLibroCodeCellView
+      - LibroSqlCellView
+    - LibroMarkdownCellView
+    - LibroRawCellView

package/src/cell/index.ts

@@ -0,0 +1,9 @@
+export * from './libro-cell-protocol.js';
+export * from './libro-cell-service.js';
+export * from './libro-cell-view.js';
+export * from './libro-cell-contribution.js';
+export * from './libro-cell-model.js';
+export * from './libro-edit-cell-view.js';
+export * from './libro-executable-cell-model.js';
+export * from './libro-markdown-cell-model.js';
+export * from './libro-executable-cell-view.js';

package/src/cell/libro-cell-contribution.ts

@@ -0,0 +1,34 @@
+import { inject, singleton } from '@difizen/mana-app';
+
+import type { CellModel, CellOptions } from '../libro-protocol.js';
+
+import type { CellMeta } from './libro-cell-protocol.js';
+import {
+  CellModelContribution,
+  CellModelFactory,
+  CellViewContribution,
+} from './libro-cell-protocol.js';
+import { LibroCellView } from './libro-cell-view.js';
+
+@singleton({ contrib: [CellModelContribution, CellViewContribution] })
+export class LibroCellContribution
+  implements CellModelContribution, CellViewContribution
+{
+  @inject(CellModelFactory) libroCellModelFactory: CellModelFactory;
+
+  cellMeta: CellMeta = {
+    type: 'raw',
+    name: 'Raw',
+    order: 'a',
+  };
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  canHandle(options: CellOptions): number {
+    return 1;
+  }
+  createModel(options: CellOptions): CellModel {
+    const model = this.libroCellModelFactory(options);
+    return model;
+  }
+  view = LibroCellView;
+}

package/src/cell/libro-cell-model.ts

@@ -0,0 +1,119 @@
+import { Model } from '@difizen/libro-code-editor';
+import type { ICell } from '@difizen/libro-common';
+import { concatMultilineString } from '@difizen/libro-common';
+import { DisposableCollection, watch } from '@difizen/mana-app';
+import { prop, inject, postConstruct, transient } from '@difizen/mana-app';
+
+import type { DefaultDecodedFormatter } from '../formatter/index.js';
+import { DefaultEncodedFormatter, LibroFormatterManager } from '../formatter/index.js';
+import { CellOptions } from '../libro-protocol.js';
+import type { CellModel } from '../libro-protocol.js';
+
+import type { LibroCellMetadata } from './libro-cell-protocol.js';
+import { getLibroCellType } from './libro-cell-protocol.js';
+
+@transient()
+export class LibroCellModel extends Model implements CellModel {
+  toDispose = new DisposableCollection();
+
+  options: CellOptions;
+
+  libroFormatType: string;
+
+  _decodeObject: DefaultDecodedFormatter;
+
+  @inject(LibroFormatterManager)
+  libroFormatterManager: LibroFormatterManager<
+    DefaultDecodedFormatter,
+    DefaultDecodedFormatter
+  >;
+
+  @prop()
+  metadata: Partial<LibroCellMetadata>;
+
+  @prop()
+  trusted: boolean;
+
+  version = 0;
+
+  constructor(@inject(CellOptions) options: CellOptions) {
+    super({
+      id: options.cell.id as string,
+      value: concatMultilineString(options?.cell?.source ?? ''),
+    });
+    this.options = options;
+    this.type = getLibroCellType(options);
+    this.libroFormatType = 'formatter-string';
+
+    this.metadata = {
+      ...options?.cell?.metadata,
+      libroFormatter: this.libroFormatType,
+    };
+    this.trusted = options?.cell?.metadata?.trusted ?? false;
+  }
+
+  @postConstruct()
+  init() {
+    const formatValue: DefaultEncodedFormatter = DefaultEncodedFormatter.is(
+      this.options?.cell,
+    )
+      ? this.options?.cell
+      : {
+          ...this.options?.cell,
+          metadata: {
+            ...this.options?.cell.metadata,
+            libroFormatter: this.libroFormatType,
+          },
+        };
+
+    this.decodeObject = this.libroFormatterManager.adapter(
+      this.libroFormatType,
+      formatValue,
+    );
+    this.updateVersion();
+  }
+
+  updateVersion = () => {
+    watch<Model>(this, 'value', () => {
+      this.version++;
+    });
+  };
+
+  get source(): string {
+    const encodedValue = this.libroFormatterManager.encode(
+      this.libroFormatType,
+      this.decodeObject,
+    );
+    return concatMultilineString(encodedValue.source);
+  }
+
+  set decodeObject(data: DefaultDecodedFormatter) {
+    this.value = data.value;
+    this._decodeObject = data;
+  }
+
+  get decodeObject() {
+    return { ...this._decodeObject, value: this.value };
+  }
+
+  toJSON(): Omit<ICell, 'outputs'> {
+    return {
+      id: this.id,
+      cell_type: this.type,
+      metadata: this.metadata,
+      source: this.source,
+    };
+  }
+
+  disposed = false;
+  override dispose() {
+    if (!this.disposed) {
+      this.toDispose.dispose();
+    }
+    this.disposed = true;
+  }
+}
+
+export function isLibroCellModel(model: CellModel): model is LibroCellModel {
+  return model instanceof LibroCellModel;
+}

package/src/cell/libro-cell-module.ts

@@ -0,0 +1,40 @@
+import { ManaModule } from '@difizen/mana-app';
+
+import { CellOptions } from '../libro-protocol.js';
+
+import { LibroCellContribution } from './libro-cell-contribution.js';
+import { LibroCellModel } from './libro-cell-model.js';
+import {
+  CellModelContribution,
+  CellModelFactory,
+  CellViewContribution,
+} from './libro-cell-protocol.js';
+import { LibroCellService } from './libro-cell-service.js';
+import { LibroCellView } from './libro-cell-view.js';
+
+/**
+ * 基础的cell实现，作为实现更复杂的cell的参考，一般不用加载到实际应用中
+ */
+export const LibroBaseCellModule = ManaModule.create()
+  .register(LibroCellContribution, LibroCellView, LibroCellModel)
+  .register({
+    token: CellModelFactory,
+    useFactory: (ctx) => {
+      return (options: CellOptions) => {
+        const child = ctx.container.createChild();
+        child.register({
+          token: CellOptions,
+          useValue: options,
+        });
+        const model = child.get(LibroCellModel);
+        return model;
+      };
+    },
+  });
+
+/**
+ * cell 定义
+ */
+export const LibroCellModule = ManaModule.create()
+  .contribution(CellViewContribution, CellModelContribution)
+  .register(LibroCellService);

package/src/cell/libro-cell-protocol.ts

@@ -0,0 +1,55 @@
+import type { IBaseCell, ICell, ICellMetadata } from '@difizen/libro-common';
+import type { MaybePromise, Newable } from '@difizen/mana-app';
+import { Syringe } from '@difizen/mana-app';
+
+import type { CellModel, CellOptions, CellView } from '../libro-protocol.js';
+
+export type LibroCellMetadata = ICellMetadata & {
+  libroCellType?: string;
+  libroFormatter?: string;
+  libroFormatterOptions?: object;
+};
+export interface LibroCustomCell extends IBaseCell {
+  metadata: Partial<LibroCellMetadata>;
+}
+export type LibroCell = LibroCustomCell | ICell;
+
+export type CellModelFactory = (options: CellOptions) => CellModel;
+export const CellModelFactory = Symbol('CellModelFactory');
+
+export const getLibroCellType = (options: CellOptions) => {
+  return (options.cell.metadata?.libroCellType as string) ?? options.cell.cell_type;
+};
+
+export const CellModelContribution = Syringe.defineToken('CellModelContribution');
+export interface CellModelContribution {
+  cellMeta: CellMeta;
+  canHandle: (options: CellOptions, libroType?: string) => number;
+  createModel: (options: CellOptions) => MaybePromise<CellModel>;
+  getDefaultCellOption?: () => CellOptions;
+}
+
+export const CellViewContribution = Syringe.defineToken('CellViewContribution');
+export interface CellViewContribution {
+  canHandle: (options: CellOptions) => number;
+  view: Newable<CellView>;
+}
+
+export interface CellMeta {
+  type: string;
+  name: string;
+  order: string;
+  nbformatType?: string;
+}
+
+//
+
+export const CellService = Symbol('CellService');
+export interface CellService {
+  cellsMeta: CellMeta[];
+  getModelFromCache: (groupId: string, modelId: string) => CellModel | undefined;
+  getOrCreateModel: (options: CellOptions, cacheGroupId?: string) => Promise<CellModel>;
+  getOrCreateView: (options: CellOptions, parentId: string) => Promise<CellView>;
+  findModelProvider: (options: CellOptions) => CellModelContribution | undefined;
+  findViewProvider: (options: CellOptions) => CellViewContribution | undefined;
+}

package/src/cell/libro-cell-service.ts

@@ -0,0 +1,158 @@
+import type { Contribution } from '@difizen/mana-app';
+import { Priority, prop } from '@difizen/mana-app';
+import { ApplicationContribution, ViewManager } from '@difizen/mana-app';
+import { contrib, inject, singleton } from '@difizen/mana-app';
+
+import type { CellView, CellModel, CellOptions } from '../libro-protocol.js';
+import { LibroService } from '../libro-service.js';
+
+import type { CellMeta } from './libro-cell-protocol.js';
+import {
+  CellService,
+  getLibroCellType,
+  CellViewContribution,
+  CellModelContribution,
+} from './libro-cell-protocol.js';
+
+@singleton({ contrib: [CellService, ApplicationContribution] })
+export class LibroCellService implements CellService, ApplicationContribution {
+  @prop()
+  cellsMeta: CellMeta[] = [];
+
+  protected readonly modelProvider: Contribution.Provider<CellModelContribution>;
+  protected readonly viewProvider: Contribution.Provider<CellViewContribution>;
+  protected cellTypeToModelContribution: Map<string, CellModelContribution> = new Map();
+  protected readonly viewManager: ViewManager;
+  protected modelCache: Map<string, Map<string, CellModel>> = new Map();
+
+  libroService: LibroService;
+  constructor(
+    @inject(ViewManager)
+    viewManager: ViewManager,
+    @inject(LibroService) libroService: LibroService,
+    @contrib(CellModelContribution)
+    modelProvider: Contribution.Provider<CellModelContribution>,
+    @contrib(CellViewContribution)
+    viewProvider: Contribution.Provider<CellViewContribution>,
+  ) {
+    this.modelProvider = modelProvider;
+    this.viewProvider = viewProvider;
+    this.viewManager = viewManager;
+    this.libroService = libroService;
+  }
+
+  protected getContributionDefaultCellOption(ctb: CellModelContribution): CellOptions {
+    if (ctb.getDefaultCellOption) {
+      return ctb.getDefaultCellOption();
+    }
+    return this.cellTypeToOption(ctb.cellMeta.type);
+  }
+
+  initialize() {
+    const prioritized = this.getDefaultOptionModelContributionPrioritized();
+    const metas: CellMeta[] = [];
+    prioritized.forEach((item) => {
+      if (!this.cellTypeToModelContribution.get(item.cellMeta.type)) {
+        this.cellTypeToModelContribution.set(item.cellMeta.type, item);
+        metas.push(item.cellMeta);
+      }
+    });
+    metas.sort((a, b) => a.order.localeCompare(b.order));
+    this.cellsMeta = metas;
+  }
+
+  getDefaultCellOption(cellType: string) {
+    const contribution = this.cellTypeToModelContribution.get(cellType);
+    if (!contribution) {
+      throw new Error(`no cell model contribution found for cell type ${cellType}`);
+    }
+    return this.getContributionDefaultCellOption(contribution);
+  }
+
+  protected cellTypeToOption(cellType: string): CellOptions {
+    return { cell: { cell_type: cellType, source: '', metadata: {} } };
+  }
+
+  getModelFromCache(groupId: string, modelId: string) {
+    return this.modelCache.get(groupId)?.get(modelId);
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  async getOrCreateModel(options: CellOptions, cacheGroupId = ''): Promise<CellModel> {
+    let cellmodelCache = this.modelCache.get(cacheGroupId);
+
+    if (!cellmodelCache) {
+      cellmodelCache = new Map();
+      this.modelCache.set(cacheGroupId, cellmodelCache);
+    }
+    if (options.modelId) {
+      const exist = this.modelCache.get(cacheGroupId)?.get(options.modelId);
+      if (exist) {
+        return exist;
+      }
+    }
+    const modelProvider = this.findModelProvider(options);
+    if (!modelProvider) {
+      throw new Error('no cell model provider found');
+    }
+    const model = await modelProvider.createModel(options);
+    cellmodelCache.set(model.id, model);
+    return model;
+  }
+  async getOrCreateView(options: CellOptions, parentId: string): Promise<CellView> {
+    const model = await this.getOrCreateModel(options, parentId);
+    const viewProvider = this.findViewProvider(options);
+    if (!viewProvider) {
+      throw new Error('no cell view provider found');
+    }
+
+    const cellViewPromise = this.viewManager.getOrCreateView(viewProvider.view, {
+      ...options,
+      modelId: model.id,
+      parentId: parentId,
+    });
+
+    const cellView = await cellViewPromise;
+    const parent = this.libroService.getViewCache().get(parentId);
+    if (parent) {
+      cellView.parent = parent;
+    }
+    return cellView;
+  }
+
+  findViewProvider(options: CellOptions): CellViewContribution | undefined {
+    const prioritized = Priority.sortSync(
+      this.viewProvider.getContributions(),
+      (contribution) => this.canHandleOption(contribution, options),
+    );
+
+    const sorted = prioritized.map((c) => c.value);
+    return sorted[0];
+  }
+  findModelProvider(options: CellOptions): CellModelContribution | undefined {
+    const prioritized = Priority.sortSync(
+      this.modelProvider.getContributions(),
+      (contribution) => this.canHandleOption(contribution, options),
+    );
+    const sorted = prioritized.map((c) => c.value);
+    return sorted[0];
+  }
+
+  protected getDefaultOptionModelContributionPrioritized(): CellModelContribution[] {
+    const prioritized = Priority.sortSync(
+      this.modelProvider.getContributions(),
+      (contribution) => {
+        const options = this.getContributionDefaultCellOption(contribution);
+        return this.canHandleOption(contribution, options);
+      },
+    );
+    const sorted = prioritized.map((c) => c.value);
+    return sorted;
+  }
+  protected canHandleOption(
+    ctb: CellModelContribution | CellViewContribution,
+    options: CellOptions,
+  ) {
+    return ctb.canHandle(options, getLibroCellType(options));
+  }
+}

package/src/cell/libro-cell-view.tsx

@@ -0,0 +1,156 @@
+import type { ViewComponent } from '@difizen/mana-app';
+import { Deferred } from '@difizen/mana-app';
+import { useInject, watch } from '@difizen/mana-app';
+import { BaseView, view, ViewInstance, ViewOption } from '@difizen/mana-app';
+import { inject } from '@difizen/mana-app';
+import { DisposableCollection } from '@difizen/mana-app';
+import { prop } from '@difizen/mana-app';
+import React from 'react';
+
+import type { CellViewOptions, CellModel } from '../libro-protocol.js';
+import type { CellView, NotebookView } from '../libro-protocol.js';
+
+import { CellService } from './libro-cell-protocol.js';
+import type { LibroCell } from './libro-cell-protocol.js';
+import { ExecutableCellModel } from './libro-executable-cell-model.js';
+
+export const LibroCellComponent = React.forwardRef(function LibroCellComponent() {
+  const instance = useInject<LibroCellView>(ViewInstance);
+  return <>{instance.model.value}</>;
+});
+
+@view('libro-cell-view')
+export class LibroCellView extends BaseView implements CellView {
+  protected override toDispose = new DisposableCollection();
+  options: CellViewOptions;
+
+  @prop()
+  noEditorAreaHeight = 0;
+
+  @prop()
+  cellViewTopPos = 0;
+
+  @prop()
+  renderEditorIntoVirtualized = false;
+
+  @prop()
+  model: CellModel;
+  protected cellService: CellService;
+  override view: ViewComponent = LibroCellComponent;
+
+  protected _parent: NotebookView;
+
+  get parent() {
+    return this._parent;
+  }
+  set parent(value: NotebookView) {
+    this._parent = value;
+    this.parentDefer.resolve(this.parent);
+  }
+
+  protected parentDefer = new Deferred<NotebookView>();
+
+  get parentReady() {
+    return this.parentDefer.promise;
+  }
+
+  @prop()
+  override className?: string | undefined = 'libro-cell-view-container';
+
+  @prop()
+  hasInputHidden: boolean;
+
+  @prop()
+  collapsedHidden = false;
+
+  @prop()
+  hasModal = false;
+
+  constructor(
+    @inject(ViewOption) options: CellViewOptions,
+    @inject(CellService) cellService: CellService,
+  ) {
+    super();
+    this.cellService = cellService;
+    this.options = options;
+    this.hasInputHidden = false;
+    const model = cellService.getModelFromCache(options.parentId, options.modelId);
+    if (!model) {
+      console.warn('cell model does not exist');
+      throw new Error('cell model does not exist');
+    }
+    this.model = model;
+    this.cellWatch();
+  }
+
+  cellWatch() {
+    this.toDispose.push(
+      watch(this.model, 'value', () => {
+        this.parent.model.onChange?.();
+        this.parent.model.onSourceChange?.([this]);
+      }),
+    );
+    this.toDispose.push(
+      watch(this.model, 'type', () => {
+        this.parent.model.onChange?.();
+        this.parent.model.onSourceChange?.([this]);
+      }),
+    );
+    if (ExecutableCellModel.is(this.model)) {
+      this.toDispose.push(
+        watch(this.model, 'executeCount', () => {
+          this.parent.model.onChange?.();
+        }),
+      );
+    }
+  }
+
+  // 计算编辑器区相对于编辑器区垂直方向的偏移量
+  calcEditorOffset() {
+    return 16 + 1;
+  }
+
+  hasCellHidden() {
+    return this.hasInputHidden;
+  }
+
+  async run() {
+    return Promise.resolve(true);
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  shouldEnterEditorMode(e: React.FocusEvent<HTMLElement>) {
+    return false;
+  }
+
+  blur() {
+    //
+  }
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  focus(isEdit: boolean) {
+    //
+  }
+
+  disposed = false;
+  override dispose() {
+    this.toDispose.dispose();
+    super.dispose();
+  }
+  toJSON(): LibroCell {
+    const meta = { ...(this.model.toJSON() as LibroCell), outputs: [] };
+    const modelContribution = this.cellService.findModelProvider(this.model.options);
+    if (modelContribution?.cellMeta.nbformatType) {
+      meta.metadata.libroCellType = modelContribution?.cellMeta.type;
+      meta.cell_type = modelContribution?.cellMeta.nbformatType;
+    }
+    return meta;
+  }
+
+  toJSONWithoutId = () => {
+    const JsonObject = this.toJSON();
+    delete JsonObject.id;
+    return {
+      ...JsonObject,
+    };
+  };
+}