@worktile/theia 20.1.0-next.7 → 20.1.0-next.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -10782,9 +10782,13 @@ class TheTable extends TheBaseElement {
10782
10782
  });
10783
10783
  }
10784
10784
  updateHorizontalScrollbar() {
10785
+ this.syncMouseOverState();
10785
10786
  this.updateScrollbarVisibility();
10786
10787
  this.updateScrollbarFixedState();
10787
10788
  }
10789
+ syncMouseOverState() {
10790
+ this.isMouseOverTable = this.nativeElement.matches(':hover');
10791
+ }
10788
10792
  // 更新横向滚动条可见性
10789
10793
  updateScrollbarVisibility() {
10790
10794
  if (!this.tableWrapper || !this.horizontalScrollbarContainer || !this.horizontalScrollbarContent) {
@@ -18254,12 +18258,12 @@ class TheEditorComponent {
18254
18258
  this.theUploadingStatus = new EventEmitter(); // true 上传结束 false 上传中
18255
18259
  this.visibleQuickInsertPlus = true;
18256
18260
  this.elementToHtml = new WeakMap();
18257
- this.virtualConfig = signal({
18261
+ this.virtualScrollConfig = signal({
18258
18262
  enabled: false,
18259
18263
  scrollTop: 0,
18260
18264
  viewportHeight: 0,
18261
18265
  bufferCount: 5
18262
- }, ...(ngDevMode ? [{ debugName: "virtualConfig" }] : []));
18266
+ }, ...(ngDevMode ? [{ debugName: "virtualScrollConfig" }] : []));
18263
18267
  this.onChangeCallback = () => { };
18264
18268
  this.onTouchedCallback = () => { };
18265
18269
  this.locale = injectTranslations(inject(TheI18nService));
@@ -18350,7 +18354,7 @@ class TheEditorComponent {
18350
18354
  initializeDefaultMenuIcons(this.iconRegistry);
18351
18355
  }
18352
18356
  ngAfterViewInit() {
18353
- this.bindVirtualScrollContainer();
18357
+ this.listenScrollEvent();
18354
18358
  }
18355
18359
  ngOnChanges(changes) {
18356
18360
  const options = changes.theOptions;
@@ -18373,18 +18377,20 @@ class TheEditorComponent {
18373
18377
  ngOnDestroy() {
18374
18378
  THE_EDITOR_PREVIOUS_SELECTION.delete(this.editor);
18375
18379
  }
18376
- bindVirtualScrollContainer() {
18380
+ listenScrollEvent() {
18381
+ if (!this.virtualScrollConfig().enabled) {
18382
+ return;
18383
+ }
18377
18384
  const scrollContainer = this.theContextService.getScrollContainer();
18378
18385
  if (!scrollContainer) {
18379
18386
  return;
18380
18387
  }
18381
- this.scrollContainerElement = scrollContainer;
18382
18388
  this.ngZone.runOutsideAngular(() => {
18383
18389
  fromEvent(scrollContainer, 'scroll')
18384
18390
  .pipe(takeUntilDestroyed(this.destroyRef))
18385
18391
  .subscribe(() => {
18386
18392
  if (!JUST_NOW_UPDATED_VIRTUAL_VIEW.get(this.editor)) {
18387
- this.syncVirtualConfig();
18393
+ this.updateVirtualConfig();
18388
18394
  }
18389
18395
  else {
18390
18396
  if (localStorage.getItem(SLATE_DEBUG_KEY)) {
@@ -18393,25 +18399,26 @@ class TheEditorComponent {
18393
18399
  JUST_NOW_UPDATED_VIRTUAL_VIEW.set(this.editor, false);
18394
18400
  }
18395
18401
  });
18396
- this.syncVirtualConfig();
18402
+ this.updateVirtualConfig();
18397
18403
  });
18398
18404
  }
18399
- syncVirtualConfig() {
18400
- if (!this.virtualConfig().enabled || !this.scrollContainerElement) {
18405
+ updateVirtualConfig() {
18406
+ const scrollContainer = this.theContextService.getScrollContainer();
18407
+ if (!this.virtualScrollConfig().enabled || !scrollContainer) {
18401
18408
  return;
18402
18409
  }
18403
- const { scrollTop, offsetHeight } = this.scrollContainerElement;
18410
+ const { scrollTop, offsetHeight } = scrollContainer;
18404
18411
  if (localStorage.getItem(SLATE_DEBUG_KEY + '__SCROLL_TOP')) {
18405
18412
  console.log(`theia: scroll event fired from user: ${scrollTop}`);
18406
18413
  }
18407
- this.virtualConfig.update(config => ({
18414
+ this.virtualScrollConfig.update(config => ({
18408
18415
  ...config,
18409
18416
  scrollTop,
18410
18417
  viewportHeight: offsetHeight
18411
18418
  }));
18412
18419
  }
18413
18420
  initialize() {
18414
- this.virtualConfig.update(config => ({
18421
+ this.virtualScrollConfig.update(config => ({
18415
18422
  ...config,
18416
18423
  enabled: this.theOptions?.enableVirtualScroll
18417
18424
  }));
@@ -18614,7 +18621,7 @@ class TheEditorComponent {
18614
18621
  TheContextService,
18615
18622
  { provide: TheToolbarGroupToken, useValue: TheToolbarGroup },
18616
18623
  { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TheEditorComponent), multi: true }
18617
- ], viewQueries: [{ propertyName: "theEditableContainer", first: true, predicate: ["theEditableContainer"], descendants: true, read: ElementRef, static: true }, { propertyName: "globalToolbarInstance", first: true, predicate: ["globalToolbar"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (!options?.readonly && !theGlobalToolbar && !isMobileMode) {\n <the-toolbar\n [ngClass]=\"{\n 'the-toolbar-disabled': options?.disabled\n }\"\n #globalToolbar\n [editor]=\"editor\"\n [toolbarItems]=\"toolbarEntity.global\"\n [containerClass]=\"globalToolbarClass\"\n [align]=\"options?.toolbar?.align\"\n ></the-toolbar>\n}\n\n<div\n #theEditableContainer\n class=\"the-editable-container\"\n thyImageGroup\n [ngClass]=\"{\n 'the-editor-disabled': options?.disabled,\n 'max-height': maxHeight\n }\"\n [ngStyle]=\"{ 'max-height': maxHeight }\"\n>\n <slate-editable\n class=\"the-editor-typo\"\n [editor]=\"editor\"\n [ngModel]=\"editorValue\"\n [renderElement]=\"renderElement\"\n [renderText]=\"renderText\"\n [renderLeaf]=\"renderLeaf\"\n [isStrictDecorate]=\"false\"\n [decorate]=\"decorate\"\n [placeholder]=\"options?.placeholder\"\n [placeholderDecorate]=\"options?.placeholderDecorate ? options?.placeholderDecorate : null\"\n [readonly]=\"options?.readonly || options?.disabled\"\n [keydown]=\"onKeyDown\"\n [click]=\"onClick\"\n [paste]=\"onSlaPaste\"\n [blur]=\"onSlaBlur\"\n [focus]=\"onSlaFocus\"\n [copy]=\"onSlaCopy\"\n [cut]=\"onSlaCut\"\n [beforeInput]=\"onSlaBeforeInput\"\n [compositionStart]=\"onSlaCompositionStart\"\n [compositionEnd]=\"onSlaCompositionEnd\"\n [dragStart]=\"onSlaDragStart\"\n [dragOver]=\"onSlaDragOver\"\n [drop]=\"onDrop\"\n [scrollSelectionIntoView]=\"scrollSelectionIntoView\"\n [virtualScroll]=\"virtualConfig()\"\n (ngModelChange)=\"valueChange($event)\"\n (mousedown)=\"mousedown($event)\"\n ></slate-editable>\n\n @if (!isMobileMode) {\n @if (!options?.readonly && options?.inlineToolbarVisible) {\n <the-inline-toolbar [editor]=\"editor\" [toolbarItems]=\"toolbarEntity.inline\"></the-inline-toolbar>\n }\n @if (!options?.readonly) {\n <div theQuickInsert [editor]=\"editor\" [isVisible]=\"visibleQuickInsertPlus\"></div>\n }\n }\n</div>\n", dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SlateModule }, { kind: "component", type: i4.SlateEditable, selector: "slate-editable", inputs: ["editor", "renderElement", "renderLeaf", "renderText", "decorate", "placeholderDecorate", "scrollSelectionIntoView", "isStrictDecorate", "trackBy", "readonly", "placeholder", "virtualScroll", "beforeInput", "blur", "click", "compositionEnd", "compositionUpdate", "compositionStart", "copy", "cut", "dragOver", "dragStart", "dragEnd", "drop", "focus", "keydown", "paste", "spellCheck", "autoCorrect", "autoCapitalize"] }, { kind: "component", type: TheQuickInsert, selector: "[theQuickInsert]", inputs: ["editor", "isVisible"] }, { kind: "component", type: TheInlineToolbar, selector: "the-inline-toolbar", inputs: ["editor", "toolbarItems"] }, { kind: "component", type: TheToolbarComponent, selector: "the-toolbar", inputs: ["editor", "toolbarItems", "align", "containerClass", "isMore", "afterTemplate"] }, { kind: "component", type: ThyImageGroup, selector: "thy-image-group, [thyImageGroup]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
18624
+ ], viewQueries: [{ propertyName: "theEditableContainer", first: true, predicate: ["theEditableContainer"], descendants: true, read: ElementRef, static: true }, { propertyName: "globalToolbarInstance", first: true, predicate: ["globalToolbar"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (!options?.readonly && !theGlobalToolbar && !isMobileMode) {\n <the-toolbar\n [ngClass]=\"{\n 'the-toolbar-disabled': options?.disabled\n }\"\n #globalToolbar\n [editor]=\"editor\"\n [toolbarItems]=\"toolbarEntity.global\"\n [containerClass]=\"globalToolbarClass\"\n [align]=\"options?.toolbar?.align\"\n ></the-toolbar>\n}\n\n<div\n #theEditableContainer\n class=\"the-editable-container\"\n thyImageGroup\n [ngClass]=\"{\n 'the-editor-disabled': options?.disabled,\n 'max-height': maxHeight\n }\"\n [ngStyle]=\"{ 'max-height': maxHeight }\"\n>\n <slate-editable\n class=\"the-editor-typo\"\n [editor]=\"editor\"\n [ngModel]=\"editorValue\"\n [renderElement]=\"renderElement\"\n [renderText]=\"renderText\"\n [renderLeaf]=\"renderLeaf\"\n [isStrictDecorate]=\"false\"\n [decorate]=\"decorate\"\n [placeholder]=\"options?.placeholder\"\n [placeholderDecorate]=\"options?.placeholderDecorate ? options?.placeholderDecorate : null\"\n [readonly]=\"options?.readonly || options?.disabled\"\n [keydown]=\"onKeyDown\"\n [click]=\"onClick\"\n [paste]=\"onSlaPaste\"\n [blur]=\"onSlaBlur\"\n [focus]=\"onSlaFocus\"\n [copy]=\"onSlaCopy\"\n [cut]=\"onSlaCut\"\n [beforeInput]=\"onSlaBeforeInput\"\n [compositionStart]=\"onSlaCompositionStart\"\n [compositionEnd]=\"onSlaCompositionEnd\"\n [dragStart]=\"onSlaDragStart\"\n [dragOver]=\"onSlaDragOver\"\n [drop]=\"onDrop\"\n [scrollSelectionIntoView]=\"scrollSelectionIntoView\"\n [virtualScroll]=\"virtualScrollConfig()\"\n (ngModelChange)=\"valueChange($event)\"\n (mousedown)=\"mousedown($event)\"\n ></slate-editable>\n\n @if (!isMobileMode) {\n @if (!options?.readonly && options?.inlineToolbarVisible) {\n <the-inline-toolbar [editor]=\"editor\" [toolbarItems]=\"toolbarEntity.inline\"></the-inline-toolbar>\n }\n @if (!options?.readonly) {\n <div theQuickInsert [editor]=\"editor\" [isVisible]=\"visibleQuickInsertPlus\"></div>\n }\n }\n</div>\n", dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SlateModule }, { kind: "component", type: i4.SlateEditable, selector: "slate-editable", inputs: ["editor", "renderElement", "renderLeaf", "renderText", "decorate", "placeholderDecorate", "scrollSelectionIntoView", "isStrictDecorate", "trackBy", "readonly", "placeholder", "virtualScroll", "beforeInput", "blur", "click", "compositionEnd", "compositionUpdate", "compositionStart", "copy", "cut", "dragOver", "dragStart", "dragEnd", "drop", "focus", "keydown", "paste", "spellCheck", "autoCorrect", "autoCapitalize"] }, { kind: "component", type: TheQuickInsert, selector: "[theQuickInsert]", inputs: ["editor", "isVisible"] }, { kind: "component", type: TheInlineToolbar, selector: "the-inline-toolbar", inputs: ["editor", "toolbarItems"] }, { kind: "component", type: TheToolbarComponent, selector: "the-toolbar", inputs: ["editor", "toolbarItems", "align", "containerClass", "isMore", "afterTemplate"] }, { kind: "component", type: ThyImageGroup, selector: "thy-image-group, [thyImageGroup]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
18618
18625
  }
18619
18626
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: TheEditorComponent, decorators: [{
18620
18627
  type: Component,
@@ -18622,7 +18629,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
18622
18629
  TheContextService,
18623
18630
  { provide: TheToolbarGroupToken, useValue: TheToolbarGroup },
18624
18631
  { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => TheEditorComponent), multi: true }
18625
- ], template: "@if (!options?.readonly && !theGlobalToolbar && !isMobileMode) {\n <the-toolbar\n [ngClass]=\"{\n 'the-toolbar-disabled': options?.disabled\n }\"\n #globalToolbar\n [editor]=\"editor\"\n [toolbarItems]=\"toolbarEntity.global\"\n [containerClass]=\"globalToolbarClass\"\n [align]=\"options?.toolbar?.align\"\n ></the-toolbar>\n}\n\n<div\n #theEditableContainer\n class=\"the-editable-container\"\n thyImageGroup\n [ngClass]=\"{\n 'the-editor-disabled': options?.disabled,\n 'max-height': maxHeight\n }\"\n [ngStyle]=\"{ 'max-height': maxHeight }\"\n>\n <slate-editable\n class=\"the-editor-typo\"\n [editor]=\"editor\"\n [ngModel]=\"editorValue\"\n [renderElement]=\"renderElement\"\n [renderText]=\"renderText\"\n [renderLeaf]=\"renderLeaf\"\n [isStrictDecorate]=\"false\"\n [decorate]=\"decorate\"\n [placeholder]=\"options?.placeholder\"\n [placeholderDecorate]=\"options?.placeholderDecorate ? options?.placeholderDecorate : null\"\n [readonly]=\"options?.readonly || options?.disabled\"\n [keydown]=\"onKeyDown\"\n [click]=\"onClick\"\n [paste]=\"onSlaPaste\"\n [blur]=\"onSlaBlur\"\n [focus]=\"onSlaFocus\"\n [copy]=\"onSlaCopy\"\n [cut]=\"onSlaCut\"\n [beforeInput]=\"onSlaBeforeInput\"\n [compositionStart]=\"onSlaCompositionStart\"\n [compositionEnd]=\"onSlaCompositionEnd\"\n [dragStart]=\"onSlaDragStart\"\n [dragOver]=\"onSlaDragOver\"\n [drop]=\"onDrop\"\n [scrollSelectionIntoView]=\"scrollSelectionIntoView\"\n [virtualScroll]=\"virtualConfig()\"\n (ngModelChange)=\"valueChange($event)\"\n (mousedown)=\"mousedown($event)\"\n ></slate-editable>\n\n @if (!isMobileMode) {\n @if (!options?.readonly && options?.inlineToolbarVisible) {\n <the-inline-toolbar [editor]=\"editor\" [toolbarItems]=\"toolbarEntity.inline\"></the-inline-toolbar>\n }\n @if (!options?.readonly) {\n <div theQuickInsert [editor]=\"editor\" [isVisible]=\"visibleQuickInsertPlus\"></div>\n }\n }\n</div>\n" }]
18632
+ ], template: "@if (!options?.readonly && !theGlobalToolbar && !isMobileMode) {\n <the-toolbar\n [ngClass]=\"{\n 'the-toolbar-disabled': options?.disabled\n }\"\n #globalToolbar\n [editor]=\"editor\"\n [toolbarItems]=\"toolbarEntity.global\"\n [containerClass]=\"globalToolbarClass\"\n [align]=\"options?.toolbar?.align\"\n ></the-toolbar>\n}\n\n<div\n #theEditableContainer\n class=\"the-editable-container\"\n thyImageGroup\n [ngClass]=\"{\n 'the-editor-disabled': options?.disabled,\n 'max-height': maxHeight\n }\"\n [ngStyle]=\"{ 'max-height': maxHeight }\"\n>\n <slate-editable\n class=\"the-editor-typo\"\n [editor]=\"editor\"\n [ngModel]=\"editorValue\"\n [renderElement]=\"renderElement\"\n [renderText]=\"renderText\"\n [renderLeaf]=\"renderLeaf\"\n [isStrictDecorate]=\"false\"\n [decorate]=\"decorate\"\n [placeholder]=\"options?.placeholder\"\n [placeholderDecorate]=\"options?.placeholderDecorate ? options?.placeholderDecorate : null\"\n [readonly]=\"options?.readonly || options?.disabled\"\n [keydown]=\"onKeyDown\"\n [click]=\"onClick\"\n [paste]=\"onSlaPaste\"\n [blur]=\"onSlaBlur\"\n [focus]=\"onSlaFocus\"\n [copy]=\"onSlaCopy\"\n [cut]=\"onSlaCut\"\n [beforeInput]=\"onSlaBeforeInput\"\n [compositionStart]=\"onSlaCompositionStart\"\n [compositionEnd]=\"onSlaCompositionEnd\"\n [dragStart]=\"onSlaDragStart\"\n [dragOver]=\"onSlaDragOver\"\n [drop]=\"onDrop\"\n [scrollSelectionIntoView]=\"scrollSelectionIntoView\"\n [virtualScroll]=\"virtualScrollConfig()\"\n (ngModelChange)=\"valueChange($event)\"\n (mousedown)=\"mousedown($event)\"\n ></slate-editable>\n\n @if (!isMobileMode) {\n @if (!options?.readonly && options?.inlineToolbarVisible) {\n <the-inline-toolbar [editor]=\"editor\" [toolbarItems]=\"toolbarEntity.inline\"></the-inline-toolbar>\n }\n @if (!options?.readonly) {\n <div theQuickInsert [editor]=\"editor\" [isVisible]=\"visibleQuickInsertPlus\"></div>\n }\n }\n</div>\n" }]
18626
18633
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.DestroyRef }, { type: i0.ElementRef }, { type: i0.Injector }, { type: i0.NgZone }, { type: i0.ViewContainerRef }, { type: TheContextService }, { type: i2$5.ThyIconRegistry }, { type: undefined, decorators: [{
18627
18634
  type: Optional
18628
18635
  }, {