@worktile/theia 13.0.23 → 13.0.26

package/interfaces/editor.d.ts

@@ -73,8 +73,9 @@ export declare enum TheMode {
     default = "default",
     print = "print"
 }
+export declare type TheModeType = TheMode | string;
 export declare class TheModeConfig {
-    mode: TheMode;
+    mode: TheModeType;
 }
 export declare const THE_MODE_TOKEN: InjectionToken<TheModeConfig>;
 export declare const THE_MODE_PROVIDER: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worktile/theia",
-  "version": "13.0.23",
+  "version": "13.0.26",
   "description": "theia editor",
   "author": "YanDong <nanianqiumo@foxmail.com>",
   "homepage": "https://github.com/atinc/theia#readme",

package/plugins/table/components/table.component.d.ts

@@ -9,6 +9,7 @@ import { TheTableContextMenuService } from '../../../services/table-contextmenu.
 import { TheBaseElementComponent } from '../../../interfaces/view-base';
 import { TableCellElement, TableElement } from '../../../custom-types';
 import { TheTableColumn } from '../table.types';
+import { ScrollDispatcher } from '@angular/cdk/scrolling';
 import * as i0 from "@angular/core";
 export declare class TheTableComponent extends TheBaseElementComponent<TableElement, Editor> implements OnInit, AfterViewInit, OnDestroy {
     eventDispatcher: TableCellEventDispatcher;
@@ -18,6 +19,7 @@ export declare class TheTableComponent extends TheBaseElementComponent<TableElem
     ngZone: NgZone;
     tableService: TableService;
     private theTableContextMenuService;
+    private scrollDispatcher;
     destroy$: Subject<any>;
     rowControls: {
         height: number;
@@ -29,15 +31,16 @@ export declare class TheTableComponent extends TheBaseElementComponent<TableElem
     get nativeElement(): HTMLElement;
     get tbodyNativeElement(): HTMLElement;
     get isSelectedAllCell(): boolean;
-    tableWrapper: ElementRef;
+    tableWrapper: ElementRef<HTMLElement>;
     theTableElement: ElementRef;
     tbodyElement: ElementRef;
     handleMousedown(event: MouseEvent): void;
     onContextChange(): void;
-    constructor(elementRef: ElementRef, eventDispatcher: TableCellEventDispatcher, resizeNotifier: ColumnResizeNotifierSource, tableStore: TableStore, cdr: ChangeDetectorRef, ngZone: NgZone, tableService: TableService, theTableContextMenuService: TheTableContextMenuService);
+    constructor(elementRef: ElementRef, eventDispatcher: TableCellEventDispatcher, resizeNotifier: ColumnResizeNotifierSource, tableStore: TableStore, cdr: ChangeDetectorRef, ngZone: NgZone, tableService: TableService, theTableContextMenuService: TheTableContextMenuService, scrollDispatcher: ScrollDispatcher);
     ngOnInit(): void;
     getWrapperWidth(): number;
     ngAfterViewInit(): void;
+    bindTableScrollingShadow(): void;
     subscribeCellPositionChange(): void;
     subscribeCellsChange(): void;
     useRowControls(): void;

package/plugins/table/components/table.component.scss

@@ -1,7 +1,7 @@
 @use 'sass:math';
 @use 'ngx-tethys/styles/variables.scss';
-@use '../../../styles/variables.scss' as theVariables;
-@use '../../../styles/mixins.scss' as mixins;
+@use '../../../styles/variables.scss'as theVariables;
+@use '../../../styles/mixins.scss'as mixins;
 
 $expand-size: 12px;
 $controls-border: 1px solid variables.$gray-300;
@@ -16,6 +16,7 @@ $control-corner-width: 12px;
 
 .slate-element-table {
     display: block;
+
     .the-table {
         border-spacing: 0;
         word-wrap: break-word;
@@ -37,6 +38,7 @@ $control-corner-width: 12px;
             padding: 8px;
             position: relative;
             cursor: text;
+
             &::after {
                 display: block;
                 position: absolute;
@@ -77,12 +79,16 @@ $control-corner-width: 12px;
                 }
             }
         }
-        .focused-cell,.selected-cell{
+
+        .focused-cell,
+        .selected-cell {
             z-index: 10;
         }
+
         tbody {
             tr {
                 height: 41px;
+
                 td:first-child {
                     border-left: $controls-border;
                 }
@@ -97,11 +103,79 @@ $control-corner-width: 12px;
     box-sizing: border-box;
     margin: 0 auto 16px;
 
+    &.the-table-right-shadow::after {
+        bottom: 0;
+        right: 0;
+        top: $expand-size * 2 + 10px;
+        content: ' ';
+        position: absolute;
+        pointer-events: none;
+        width: 8px;
+        z-index: 2;
+        background: -webkit-gradient(linear, left, right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1));
+        background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1));
+    }
+
+    &.the-table-left-shadow::before {
+        bottom: 0;
+        top: $expand-size * 2 + 10px;
+        left: 0;
+        content: ' ';
+        position: absolute;
+        pointer-events: none;
+        width: 8px;
+        z-index: 2;
+        background: -webkit-gradient(linear, right, left, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.1)));
+        background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1));
+
+    }
+
+    &.the-table-with-controls {
+        &.the-table-right-shadow::after {
+            top: $expand-size + 10px + 1;
+        }
+
+        &.the-table-left-shadow::before {
+            top: $expand-size + 10px + 1;
+        }
+
+        &.the-table-left-shadow {
+            .the-table-row-controls-wrapper {
+                &::after {
+                    top: 0;
+                }
+            }
+        }
+
+        .the-table-wrapper {
+            margin-left: -11px;
+            padding-left: 11px;
+        }
+    }
+
+    &.the-numbered-column-container {
+        &.the-table-left-shadow {
+            &::before {
+                left: 44px;
+            }
+        }
+    
+        &.the-table-with-controls {
+            .the-table-wrapper {
+                margin-left: -55px;
+                padding-left: 55px;
+            }
+        }
+
+        .the-table-wrapper {
+            margin-left: -44px;
+            padding-left: 44px;
+        }
+    }
+
     .the-table-wrapper {
         padding-top: 10px;
         margin-top: -10px;
-        padding-bottom: 15px;
-        margin-bottom: -15px;
         z-index: 0;
         position: relative;
         overflow: auto;
@@ -121,6 +195,7 @@ $control-corner-width: 12px;
 }
 
 .the-table-with-controls {
+
     .the-table-row-controls,
     .the-table-controls-insert-wrapper {
         display: block;
@@ -132,27 +207,36 @@ $control-corner-width: 12px;
         border-top: $controls-border;
         background-clip: padding-box;
         cursor: pointer;
-        &:first-child{
+
+        &:first-child {
             border-left: $controls-border;
         }
+
         &:last-child {
             .the-table-controls-insert-wrapper {
                 right: 0;
+
                 &:after {
                     left: 9px;
                 }
             }
+
             .the-table-controls-insert-wrapper:hover {
                 &:after {
                     left: 0;
                 }
+
                 .the-table-controls-insert-line[data-dot-type='column'] {
                     left: $dot-size;
                 }
             }
         }
-        &.active, &.dangerous {
-            &::before, &::after{
+
+        &.active,
+        &.dangerous {
+
+            &::before,
+            &::after {
                 content: '';
                 position: absolute;
                 width: 1px;
@@ -160,13 +244,16 @@ $control-corner-width: 12px;
                 background: variables.$primary;
                 top: -1px;
             }
-            &::before{
+
+            &::before {
                 left: -1px;
             }
-            &::after{
+
+            &::after {
                 right: -1px;
             }
         }
+
         &.active {
             @include mixins.controlSelected;
             z-index: 11;
@@ -175,7 +262,9 @@ $control-corner-width: 12px;
         &.dangerous {
             @include mixins.controlDangerous;
             z-index: 11;
-            &::before,  &::after{
+
+            &::before,
+            &::after {
                 background: variables.$danger;
             }
         }
@@ -187,6 +276,7 @@ $control-corner-width: 12px;
     height: $control-corner-width;
     position: relative;
     visibility: hidden;
+
     .the-table-corner-button {
         position: absolute;
         top: 0;
@@ -214,6 +304,7 @@ $control-corner-width: 12px;
 
     &.active {
         z-index: 1;
+
         .the-table-corner-button {
             @include mixins.controlSelected;
         }
@@ -221,6 +312,7 @@ $control-corner-width: 12px;
 
     &.dangerous {
         z-index: 1;
+
         .the-table-corner-button {
             @include mixins.controlDangerous;
         }
@@ -264,6 +356,7 @@ $control-corner-width: 12px;
     }
 
     &:not(.disabled) {
+
         &:hover:after,
         &:hover:before {
             background-color: variables.$white !important;
@@ -315,6 +408,7 @@ $control-corner-width: 12px;
     .the-table-row-controls-button-wrap {
         position: relative;
         margin-top: -1px;
+
         .the-table-controls-button {
             display: block;
             outline: none;
@@ -330,6 +424,7 @@ $control-corner-width: 12px;
 
         &.active {
             z-index: 1;
+
             .the-table-controls-button,
             .the-table-numbered-controls-button {
                 @include mixins.controlSelected;
@@ -386,21 +481,25 @@ $control-corner-width: 12px;
         width: 45px;
         margin-left: 10px;
         cursor: pointer;
+
         .the-table-numbered-controls-button {
             background-color: variables.$gray-100;
             border: $controls-border;
             border-right: none;
         }
     }
+
     .the-table-focus {
         .the-table-row-controls {
             width: 55px;
             margin-left: 0;
         }
+
         .the-table-corner-controls-insert-column-marker .the-table-controls-insert-wrapper {
             left: 46px;
         }
     }
+
     .row-number {
         float: right;
         width: 45px;
@@ -410,19 +509,22 @@ $control-corner-width: 12px;
     }
 }
 
-.safari{
-    .the-table-row-controls{
+.safari {
+    .the-table-row-controls {
         top: 1px;
     }
 }
 
 
-.the-editor-readonly{
-    .the-table-row-controls, .the-table-col-controls{
+.the-editor-readonly {
+
+    .the-table-row-controls,
+    .the-table-col-controls {
         cursor: default;
     }
-    .safari{
-        .the-table-row-controls{
+
+    .safari {
+        .the-table-row-controls {
             top: 0px;
         }
     }

package/plugins/table/components/td/td.component.d.ts

@@ -38,9 +38,10 @@ export declare class TheTdComponent extends TheBaseElementComponent<TableCellEle
     get resizeNotifier(): ColumnResizeNotifierSource;
     get tableElement(): HTMLElement;
     get scrollableElementTop(): number;
-    get scrollableElementLeft(): any;
+    get scrollableElementLeft(): number;
     get isXAxisHover(): boolean;
     get rowResizeClass(): string[];
+    get tableToolbarOption(): import("../../../../interfaces").ThePluginOption<{}>;
     dotWrapperHovered: boolean;
     resizeRef: ResizeRef;
     backgroundColor: string;

package/plugins/table/components/toolbar/table-toolbar.component.d.ts

@@ -18,6 +18,7 @@ export declare class TheTableToolbarComponent implements OnInit, OnDestroy {
     isActiveSelect: boolean;
     tableElement: TableElement;
     get editor(): Editor;
+    get singleSelecting(): boolean;
     cellMenuList: MenuEntity[];
     get isShowSplitLine(): boolean;
     get tableOptions(): import("../../../../interfaces").ThePluginOption<{}>;

package/plugins/table/table.store.d.ts

@@ -22,6 +22,7 @@ export declare class TableStore {
     focusCellElement: HTMLTableCellElement;
     isPrepareSelecting: boolean;
     isCellSelecting: boolean;
+    singleSelecting: boolean;
     isRightClicking: boolean;
     maxCol: number;
     get selectedCells(): SelectedCell[];

package/styles/typo.scss

@@ -114,7 +114,7 @@
         &.slate-block-card-table {
             .card-left,
             .card-right {
-                bottom: 15px;
+                bottom: 0px;
             }
         }
         &.slate-block-card-hr {