@worktile/theia 13.0.4 → 13.0.7

package/package.json

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

package/plugins/code/code.component.scss

@@ -89,3 +89,21 @@
     }
 }
 
+.the-code-block-operation {
+    position: absolute;
+    top: -10px;
+    left: 0;
+    z-index: 10;
+    min-width: 298px; // must assign min-width in table
+    padding: 5px 10px;
+    background: variables.$white;
+    box-shadow: variables.$box-shadow;
+    transform: translateY(-100%);
+
+    .thy-select-custom {
+        width: 115px;
+        .form-control {
+            border: none;
+        }
+    }
+}

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

@@ -16,7 +16,7 @@ $control-corner-width: 12px;
 
 .slate-element-table {
     display: block;
-    .the-temp-table {
+    .the-table {
         border-spacing: 0;
         word-wrap: break-word;
         box-sizing: border-box;
@@ -92,12 +92,12 @@ $control-corner-width: 12px;
 }
 
 
-.the-temp-table-container {
+.the-table-container {
     position: relative;
     box-sizing: border-box;
     margin: 0 auto 16px;
 
-    .the-temp-table-wrapper {
+    .the-table-wrapper {
         padding-top: 10px;
         margin-top: -10px;
         padding-bottom: 15px;
@@ -107,7 +107,7 @@ $control-corner-width: 12px;
         overflow: auto;
     }
 
-    .the-temp-table-row-controls-wrapper {
+    .the-table-row-controls-wrapper {
         position: absolute;
         left: -$control-width;
         top: 23px;
@@ -115,18 +115,18 @@ $control-corner-width: 12px;
         z-index: 1;
     }
 
-    &.the-temp-table-selection-hide ::selection {
+    &.the-table-selection-hide ::selection {
         background: transparent;
     }
 }
 
-.the-temp-table-with-controls {
-    .the-temp-table-row-controls,
-    .the-temp-table-controls-insert-wrapper {
+.the-table-with-controls {
+    .the-table-row-controls,
+    .the-table-controls-insert-wrapper {
         display: block;
     }
 
-    .the-temp-table-col-controls-wrapper .the-temp-table-col-controls {
+    .the-table-col-controls-wrapper .the-table-col-controls {
         background: variables.$gray-100;
         border-right: $controls-border;
         border-top: $controls-border;
@@ -136,17 +136,17 @@ $control-corner-width: 12px;
             border-left: $controls-border;
         }
         &:last-child {
-            .the-temp-table-controls-insert-wrapper {
+            .the-table-controls-insert-wrapper {
                 right: 0;
                 &:after {
                     left: 9px;
                 }
             }
-            .the-temp-table-controls-insert-wrapper:hover {
+            .the-table-controls-insert-wrapper:hover {
                 &:after {
                     left: 0;
                 }
-                .the-temp-table-controls-insert-line[data-dot-type='column'] {
+                .the-table-controls-insert-line[data-dot-type='column'] {
                     left: $dot-size;
                 }
             }
@@ -182,12 +182,12 @@ $control-corner-width: 12px;
     }
 }
 
-.the-temp-table-corner-controls {
+.the-table-corner-controls {
     width: 100%;
     height: $control-corner-width;
     position: relative;
     visibility: hidden;
-    .the-temp-table-corner-button {
+    .the-table-corner-button {
         position: absolute;
         top: 0;
         left: 0;
@@ -202,32 +202,32 @@ $control-corner-width: 12px;
         cursor: pointer;
     }
 
-    .the-temp-table-corner-controls-insert-row-marker .the-temp-table-controls-insert-wrapper {
+    .the-table-corner-controls-insert-row-marker .the-table-controls-insert-wrapper {
         left: -$dot-size;
         top: 2px;
     }
 
-    .the-temp-table-corner-controls-insert-column-marker .the-temp-table-controls-insert-wrapper {
+    .the-table-corner-controls-insert-column-marker .the-table-controls-insert-wrapper {
         left: 2px;
         top: -$dot-size;
     }
 
     &.active {
         z-index: 1;
-        .the-temp-table-corner-button {
+        .the-table-corner-button {
             @include mixins.controlSelected;
         }
     }
 
     &.dangerous {
         z-index: 1;
-        .the-temp-table-corner-button {
+        .the-table-corner-button {
             @include mixins.controlDangerous;
         }
     }
 }
 
-.the-temp-table-controls-insert-wrapper {
+.the-table-controls-insert-wrapper {
     width: $dot-size;
     height: $dot-size;
     position: absolute;
@@ -281,7 +281,7 @@ $control-corner-width: 12px;
         }
     }
 
-    .the-temp-table-controls-insert-line {
+    .the-table-controls-insert-line {
         position: absolute;
         background-color: variables.$primary;
         z-index: $dot-zIndex;
@@ -300,22 +300,22 @@ $control-corner-width: 12px;
     }
 }
 
-.the-temp-table-row-controls {
+.the-table-row-controls {
     width: $control-width;
     box-sizing: border-box;
     display: none;
     z-index: 11;
     position: relative;
 
-    .the-temp-table-row-controls-inner {
+    .the-table-row-controls-inner {
         display: flex;
         flex-direction: column;
     }
 
-    .the-temp-table-row-controls-button-wrap {
+    .the-table-row-controls-button-wrap {
         position: relative;
         margin-top: -1px;
-        .the-temp-table-controls-button {
+        .the-table-controls-button {
             display: block;
             outline: none;
             background-color: variables.$gray-100;
@@ -330,8 +330,8 @@ $control-corner-width: 12px;
 
         &.active {
             z-index: 1;
-            .the-temp-table-controls-button,
-            .the-temp-table-numbered-controls-button {
+            .the-table-controls-button,
+            .the-table-numbered-controls-button {
                 @include mixins.controlSelected;
             }
         }
@@ -339,39 +339,30 @@ $control-corner-width: 12px;
         &.dangerous {
             z-index: 1;
 
-            .the-temp-table-controls-button,
-            .the-temp-table-numbered-controls-button {
+            .the-table-controls-button,
+            .the-table-numbered-controls-button {
                 @include mixins.controlDangerous;
             }
         }
     }
 
-    .the-temp-table-controls-insert-wrapper {
+    .the-table-controls-insert-wrapper {
         bottom: -$dot-shadow-top;
         left: -$dot-size;
         top: auto;
     }
 
-    .the-temp-table-row-controls-button-wrap {
+    .the-table-row-controls-button-wrap {
         position: relative;
         margin-top: -1px;
     }
 }
 
-.the-temp-table-toolbar-wrap {
-    display: block;
-    border-radius: 5px;
-    z-index: 10;
-
-    @include mixins.the-toolbar-layout();
-    @include mixins.the-custom-action();
-}
-
-.the-temp-table-col-controls-wrapper {
+.the-table-col-controls-wrapper {
     height: $control-width;
     line-height: $control-width;
 
-    .the-temp-table-col-controls {
+    .the-table-col-controls {
         padding: 0;
         margin: 0;
         border: 0;
@@ -379,46 +370,34 @@ $control-corner-width: 12px;
         border-top: 1px solid transparent;
     }
 }
-.table-options {
-    background: transparent;
-    margin-right: 5px;
-    color: variables.$gray-700;
-    &:hover {
-        background: rgba(variables.$primary, 0.1);
-        color: variables.$primary;
-    }
-}
-.table-options-active {
-    background: rgba(variables.$primary, 0.1);
-    color: variables.$primary;
-}
+
 .table-options-pannel {
     .thy-popover-container {
         min-width: 200px;
     }
 }
 
-.the-temp-numbered-column-container {
+.the-numbered-column-container {
     padding-left: 44px;
 
-    .the-temp-table-row-controls {
+    .the-table-row-controls {
         display: block;
         top: 0px;
         width: 45px;
         margin-left: 10px;
         cursor: pointer;
-        .the-temp-table-numbered-controls-button {
+        .the-table-numbered-controls-button {
             background-color: variables.$gray-100;
             border: $controls-border;
             border-right: none;
         }
     }
-    .the-temp-table-focus {
-        .the-temp-table-row-controls {
+    .the-table-focus {
+        .the-table-row-controls {
             width: 55px;
             margin-left: 0;
         }
-        .the-temp-table-corner-controls-insert-column-marker .the-temp-table-controls-insert-wrapper {
+        .the-table-corner-controls-insert-column-marker .the-table-controls-insert-wrapper {
             left: 46px;
         }
     }
@@ -432,18 +411,18 @@ $control-corner-width: 12px;
 }
 
 .safari{
-    .the-temp-table-row-controls{
+    .the-table-row-controls{
         top: 1px;
     }
 }
 
 
 .the-editor-readonly{
-    .the-temp-table-row-controls, .the-temp-table-col-controls{
+    .the-table-row-controls, .the-table-col-controls{
         cursor: default;
     }
     .safari{
-        .the-temp-table-row-controls{
+        .the-table-row-controls{
             top: 0px;
         }
     }

package/plugins/table/utils/normalize-table.d.ts

@@ -1,2 +1,2 @@
-import { TableElement } from "../../../custom-types";
+import { TableElement } from '../../../custom-types';
 export declare const normalizeTable: (table: TableElement) => TableElement;

package/plugins/todo-item/todo-item.component.scss

@@ -1,4 +1,4 @@
-.the-temp-check-item {
+.the-check-item {
     height: auto;
     line-height: 24px;
     padding-left: 2em;

package/styles/editor.scss

@@ -33,7 +33,7 @@
                 cursor: inherit;
             }
         }
-        .the-temp-check-item {
+        .the-check-item {
             input[type='checkbox'] {
                 cursor: auto;
             }
@@ -49,7 +49,7 @@
     }
 
     .the-editor-disabled {
-        .the-temp-check-item {
+        .the-check-item {
             input[type='checkbox'] {
                 cursor: auto;
             }
@@ -67,6 +67,8 @@
         &.max-height {
             overflow-y: scroll;
         }
+
+        @include mixins.the-toolbar-divider-spacing();
     }
 }
 .the-editor-typo{
@@ -205,25 +207,13 @@
         ul[the-level="#{$i}"] {
             padding-left: $i * 2em;
         }
-        .the-temp-check-item[the-level="#{$i}"] {
+        .the-check-item[the-level="#{$i}"] {
             padding-left: calc(#{$i * 2em} + 2em);
         }
     }
 }
 
-.the-code-block-operation {
-    @include mixins.the-toolbar-layout();
-    display: flex;
-    transform: translateY(-100%);
-    left: 0;
-    top: -10px;
-    z-index: 10;
-    min-width: 298px; // must assign min-width in table
-    .thy-select-custom {
-        width: 115px;
-        .form-control {
-            border: none;
-        }
-    }
+.the-block-toolbar-popover .thy-popover-container {
+    padding: 5px 10px;
+    @include mixins.the-toolbar-divider-spacing();
 }
-

package/styles/mixins.scss

@@ -1,5 +1,4 @@
 @use 'ngx-tethys/styles/variables.scss';
-@use "ngx-tethys/styles/basic.scss" as thyBasic;
 @use './variables.scss' as theVariables;
 
 @mixin controlSelected {
@@ -23,13 +22,6 @@
     }
 }
 
-@mixin the-toolbar-layout {
-    position: absolute;
-    padding: 5px 10px;
-    background: variables.$white;
-    box-shadow: variables.$box-shadow;
-}
-
 @mixin the-toolbar-active {
     .thy-action.thy-popover-origin-active,
     .the-toolbar-dropdown-container.thy-popover-origin-active .thy-action {
@@ -41,34 +33,19 @@
 }
 
 @mixin the-toolbar-divider-spacing {
-    & + .thy-divider {
-        margin-left: #{theVariables.$thy-action-margin-right} !important;
-    }
-}
-
-@mixin the-custom-action() {
-    .thy-action {
-        position: relative;
-        color: variables.$gray-700;
-        cursor: pointer;
-
-        &:hover {
-            color: variables.$primary;
-        }
-
-        &.action-danger {
-            @include thyBasic.action-variant(variables.$action-color, variables.$danger, rgba(variables.$danger, 0.1));
+    .the-toolbar-item,
+    .the-toolbar-dropdown-container {
+        &:not(:last-child) {
+            margin-right: theVariables.$thy-action-margin-right;
         }
     }
 
     .thy-action,
     .the-toolbar-item,
     .the-toolbar-dropdown-container {
-        &:not(:last-child) {
-            margin-right: theVariables.$thy-action-margin-right;
+        & + .thy-divider {
+            margin-left: #{theVariables.$thy-action-margin-right} !important;
         }
-
-        @include the-toolbar-divider-spacing();
     }
 }
 

package/styles/typo.scss

@@ -1,7 +1,6 @@
 @use 'sass:math';
 @use 'ngx-tethys/styles/variables.scss';
 @use './variables.scss' as theVariables;
-@use './mixins.scss' as mixins;
 
 .the-editor-typo {
     display: flow-root;
@@ -144,8 +143,6 @@
         background: theVariables.$selection-background;
     }
 
-    @include mixins.the-custom-action();
-
     // 处理 block-card 图文混排
     .slate-block,
     .slate-block-card {