@colijnit/corecomponents_v12 12.0.21 → 12.0.24

package/lib/components/base/base-input.component.d.ts

@@ -95,6 +95,8 @@ export declare abstract class BaseInputComponent<T> implements OnInit, OnDestroy
     keepFocus: boolean;
     canSaveOrCancel: boolean;
     objectConfigName: string;
+    committing: boolean;
+    commitFinished: boolean;
     protected _markedAsUserTouched: boolean;
     protected _destroyed: boolean;
     protected _hasOnPushCdStrategy: boolean;
@@ -121,7 +123,7 @@ export declare abstract class BaseInputComponent<T> implements OnInit, OnDestroy
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     commit: (model: any) => Promise<boolean>;
-    commitClick(event?: MouseEvent): Promise<void>;
+    commitClick(event?: MouseEvent): Promise<boolean>;
     cancelClick(event?: MouseEvent): void;
     showValidationError(error: string): void;
     /**
@@ -130,7 +132,7 @@ export declare abstract class BaseInputComponent<T> implements OnInit, OnDestroy
      */
     setModel(value: any): void;
     requestFocus(): void;
-    doFocus(event: any): any;
+    doFocus(event?: any): any;
     doBlur(event?: any): any;
     detectChanges(): void;
     markForCheck(): void;
@@ -148,6 +150,7 @@ export declare abstract class BaseInputComponent<T> implements OnInit, OnDestroy
     protected _markAsOnPush(): void;
     protected _checkState(): boolean;
     protected _updateControlValidatorsAndOwnFlags(): void;
+    private _commitFinished;
     private _clearErrorComponent;
     private _controlExists;
     private _controlIsValid;

package/lib/components/base/commit-buttons/commit-buttons.component.d.ts

@@ -0,0 +1,19 @@
+import { ElementRef, EventEmitter, QueryList, Renderer2 } from "@angular/core";
+export declare class CommitButtonsComponent {
+    private _renderer;
+    set content(children: any);
+    animateDivs: QueryList<ElementRef>;
+    set committing(value: boolean);
+    get committing(): boolean;
+    set commitFinished(value: boolean);
+    get commitFinished(): boolean;
+    cancelClick: EventEmitter<MouseEvent>;
+    commitClick: EventEmitter<MouseEvent>;
+    showClass(): boolean;
+    private _committing;
+    private _commitFinished;
+    constructor(_renderer: Renderer2);
+    private _checkAnimation;
+    private _checkAnimationFinished;
+    private _handleAnimationIteration;
+}

package/lib/components/base/commit-buttons/commit-buttons.module.d.ts

@@ -0,0 +1,2 @@
+export declare class CommitButtonsModule {
+}

package/lib/components/base/commit-buttons/style/_layout.scss

@@ -0,0 +1,127 @@
+@import "../../../../style/mixin";
+
+$checkMarkWidth: calc(0.3 * #{$cc-co-commit-buttons-button-size});
+$checkMarkHeight: calc(0.5 * #{$cc-co-commit-buttons-button-size});
+$checkMarkThickness: 3px;
+
+$spinnerSize: $cc-co-commit-buttons-button-size;
+$spinnerDivSize: calc(#{$cc-co-commit-buttons-button-size} - (.2 * #{$cc-co-commit-buttons-button-size}));
+$spinnerPadding: calc((#{$spinnerSize} - #{$spinnerDivSize}) / 2);
+
+@include export-module('cc-commit-buttons-layout') {
+  .co-commit-buttons {
+    .commit-buttons-wrapper {
+      position: absolute;
+      @if ($cc-co-input-text-button-position == 'top') {
+        top: -36px;
+        transform-origin: center bottom;
+        padding: 5px 0 0 5px;
+      } @else {
+        top: $cc-item-size;
+        transform-origin: center top;
+        padding: 0 5px 5px 0;
+      }
+      right: 0;
+      display: flex;
+      column-gap: 2px;
+      z-index: 10;
+      .commit-buttons-button {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        position: relative;
+        height: $cc-co-commit-buttons-button-size;
+        width: $cc-co-commit-buttons-button-size;
+        &.save {
+          .save-button-spinner .animate {
+            animation: spinner 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
+          }
+          &.finished {
+            .spinner-checkmark {
+              animation-duration: 800ms;
+              animation-timing-function: ease;
+              animation-name: checkmark;
+              //animation-delay: 2.2s;
+            }
+          }
+          .save-button-spinner {
+            display: inline-block;
+            position: relative;
+            width: $spinnerSize;
+            height: $spinnerSize;
+            padding: $spinnerPadding;
+            div {
+              position: absolute;
+              display: block;
+              box-sizing: border-box;
+              height: $spinnerDivSize;
+              width: $spinnerDivSize;
+              border-width: 2px;
+              border-style: solid;
+              border-radius: 50%;
+            }
+            //border-color: $cc-co-commit-buttons-commit-color;
+            div:nth-child(1) {
+              animation-delay: -0.45s;
+            }
+            div:nth-child(2) {
+              animation-delay: -0.3s;
+            }
+            div:nth-child(3) {
+              animation-delay: -0.15s;
+            }
+          }
+          .spinner-checkmark {
+            position: absolute;
+            opacity: 1;
+            transform: scaleX(-1) translate(85%, -5%) rotate(135deg);
+            height: $checkMarkHeight;
+            width: $checkMarkWidth;
+            transform-origin: left top;
+            content: '';
+            left: 50%;
+            top: 50%;
+          }
+        }
+        &.cancel {
+          .cancel-button {
+            position: relative;
+            display: inline-block;
+            width: 100%;
+            height: 100%;
+          }
+        }
+      }
+    }
+    @keyframes spinner {
+      0% {
+        transform: rotate(0deg);
+      }
+      100% {
+        transform: rotate(360deg);
+      }
+    }
+    @keyframes checkmark {
+      0% {
+        height: 0;
+        width: 0;
+        opacity: 1;
+      }
+      20% {
+        height: 0;
+        width: $checkMarkWidth;
+        opacity: 1;
+      }
+      40% {
+        height: $checkMarkHeight;
+        width: $checkMarkWidth;
+        opacity: 1;
+      }
+      100% {
+        height: $checkMarkHeight;
+        width: $checkMarkWidth;
+        opacity: 1;
+      }
+    }
+  }
+}

package/lib/components/base/commit-buttons/style/_material-definition.scss

@@ -0,0 +1,5 @@
+$cc-co-commit-buttons-button-background: $cc-color-form-input-border !default;
+$cc-co-commit-buttons-button-size: 30px !default;
+$cc-co-commit-buttons-commit-color: green !default;
+$cc-co-commit-buttons-cancel-color: red !default;
+$cc-co-input-text-button-position: 'bottom' !default;

package/lib/components/base/commit-buttons/style/_theme.scss

@@ -0,0 +1,34 @@
+@import "../../../../style/mixin";
+@import "./material-definition";
+
+@include export-module('cc-commit-buttons-theme') {
+  .co-commit-buttons {
+    .commit-buttons-wrapper {
+      .commit-buttons-button {
+        &.save {
+          background: $cc-co-commit-buttons-button-background;
+          .save-button-spinner .animate {
+            border-color: $cc-co-commit-buttons-commit-color transparent transparent transparent;
+          }
+          .save-button-spinner {
+            div {
+              border-color: $cc-co-commit-buttons-commit-color;
+            }
+          }
+          .spinner-checkmark {
+            border-right: $checkMarkThickness solid $cc-co-commit-buttons-commit-color;
+            border-top: $checkMarkThickness solid $cc-co-commit-buttons-commit-color;
+          }
+        }
+        &.cancel {
+          .cancel-button {
+            border: 7px solid #DAD9D9;
+            background:
+              linear-gradient(45deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 43%,$cc-co-commit-buttons-cancel-color 45%,$cc-co-commit-buttons-cancel-color 55%,rgba(0,0,0,0) 57%,rgba(0,0,0,0) 100%),
+              linear-gradient(135deg, #DAD9D9 0%,#DAD9D9 43%,$cc-co-commit-buttons-cancel-color 45%,$cc-co-commit-buttons-cancel-color 55%,#DAD9D9 57%,#DAD9D9 100%);
+          }
+        }
+      }
+    }
+  }
+}

package/lib/components/base/commit-buttons/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../../style/variables";
+@import "./material-definition";
+@import "./layout";
+@import "./theme";

package/lib/components/co-dialog/style/_layout.scss

@@ -40,5 +40,8 @@
       font-size: $cc-co-dialog-footer-font-size;
       padding: $cc-co-dialog-footer-padding;
     }
+    .dialog-close-button {
+      cursor: pointer;
+    }
   }
 }

package/lib/components/co-dialog-wizard/co-dialog-wizard.component.d.ts

@@ -0,0 +1,9 @@
+import { EventEmitter } from "@angular/core";
+import { CoreComponentsIcon } from "../../core/enum/core-components-icon.enum";
+export declare class CoDialogWizardComponent {
+    readonly icons: typeof CoreComponentsIcon;
+    showCloseIcon: boolean;
+    animation: boolean;
+    readonly closeClick: EventEmitter<MouseEvent>;
+    showClass(): boolean;
+}

package/lib/components/co-dialog-wizard/co-dialog-wizard.module.d.ts

@@ -0,0 +1,2 @@
+export declare class CoDialogWizardModule {
+}

package/lib/components/co-dialog-wizard/style/_layout.scss

@@ -0,0 +1,51 @@
+@include export-module('co-dialog-wizard-layout') {
+  .co-dialog-wizard {
+    font-family: $cc-co-dialog-wizard-font-family;
+    font-size: $cc-co-dialog-wizard-font-size;
+    .co-dialog-wizard-overlay {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      z-index: 800;
+    }
+    .co-dialog-wizard-wrapper {
+      position: fixed;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      min-width: $cc-co-dialog-wizard-min-width;
+      max-width: 100vw;
+      z-index: 801;
+      height: auto;
+      width: auto;
+      border-radius: $cc-co-dialog-wizard-border-radius;
+    }
+    .dialog-header {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      align-items: center;
+      font-family: $cc-co-dialog-wizard-header-font-family;
+      font-size: $cc-co-dialog-wizard-header-font-size;
+      padding: $cc-co-dialog-wizard-header-padding;
+      border-radius: $cc-co-dialog-wizard-header-border-radius;
+      margin: $cc-co-dialog-wizard-header-margin;
+    }
+    .dialog-content {
+      font-family: $cc-co-dialog-wizard-content-font-family;
+      font-size: $cc-co-dialog-wizard-content-font-size;
+      padding: $cc-co-dialog-wizard-content-padding;
+      border-radius: $cc-co-dialog-wizard-content-border-radius;
+    }
+    .dialog-close-button {
+      cursor: pointer;
+    }
+    .co-dialog-wizard-divider {
+      margin: $cc-co-dialog-wizard-header-divider-margin;
+      border: none;
+      border-top: $cc-co-dialog-wizard-header-divider-border-top;
+    }
+  }
+}

package/lib/components/co-dialog-wizard/style/_material-definition.scss

@@ -0,0 +1,25 @@
+$cc-co-dialog-wizard-font-family: $cc-font-family !default;
+$cc-co-dialog-wizard-font-size: $cc-font-size-default !default;
+$cc-co-dialog-wizard-header-font-family: $cc-font-family !default;
+$cc-co-dialog-wizard-header-font-size: $cc-font-size-default !default;
+$cc-co-dialog-wizard-header-text-color: $cc-color-dark !default;
+$cc-co-dialog-wizard-header-background-color: $cc-color-light-accent !default;
+$cc-co-dialog-wizard-header-padding: 10px !default;
+$cc-co-dialog-wizard-header-divider-margin: 0 10px 0 10px !default;
+$cc-co-dialog-wizard-header-divider-border-top: 1px solid $cc-color-light-accent !default;
+$cc-co-dialog-wizard-header-border-radius: 20px 20px 0 0 !default;
+$cc-co-dialog-wizard-header-margin: 0 0 0 10px !default;
+$cc-co-dialog-wizard-min-width: 250px !default;
+$cc-co-dialog-wizard-border-radius: 20px !default;
+$cc-co-dialog-wizard-background-color: $cc-color-light !default;
+$cc-co-dialog-wizard-box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.5) !default;
+$cc-co-dialog-wizard-overlay-background-color: rgba(0, 0, 0, 0.3) !default;
+$cc-co-dialog-wizard-overlay-backdrop-filter: blur(2px) !default;
+$cc-co-dialog-wizard-content-padding: 10px !default;
+$cc-co-dialog-wizard-content-border-radius: 20px !default;
+$cc-co-dialog-wizard-content-font-family: $cc-font-family !default;
+$cc-co-dialog-wizard-content-font-size: $cc-font-size-default !default;
+$cc-co-dialog-wizard-content-text-color: $cc-color-dark !default;
+$cc-co-dialog-wizard-content-background-color: $cc-color-light !default;
+
+

package/lib/components/co-dialog-wizard/style/_theme.scss

@@ -0,0 +1,16 @@
+@include export-module('co-dialog-wizard-theme') {
+  .co-dialog-wizard {
+    .co-dialog-wizard-overlay {
+      background-color: $cc-co-dialog-wizard-overlay-background-color;
+      backdrop-filter: $cc-co-dialog-wizard-overlay-backdrop-filter;
+    }
+    .co-dialog-wizard-wrapper {
+      background-color: $cc-co-dialog-wizard-background-color;
+      box-shadow: $cc-co-dialog-wizard-box-shadow;
+    }
+    .dialog-content {
+      color: $cc-co-dialog-wizard-content-text-color;
+      background-color: $cc-co-dialog-wizard-content-background-color;
+    }
+  }
+}

package/lib/components/co-dialog-wizard/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../style/mixin";
+@import "../../../style/variables";
+@import "./material-definition";
+@import "./layout";
+@import "./theme";

package/lib/components/collapsible/style/_layout.scss

@@ -22,7 +22,7 @@
     }
 
     .collapsible-title {
-      font-weight: bold;
+      font-weight: $cc-collapsible-title-font-weight;
     }
 
     .expand-icon-wrapper {

package/lib/components/collapsible/style/_material-definition.scss

@@ -6,4 +6,5 @@ $cc-collapsible-height: 40px !default;
 $cc-collapsible-icon-size: 20px !default;
 $cc-collapsible-border-bottom: 1px solid gray !default;
 $cc-collapsible-icon-margin-right: 15px !default;
+$cc-collapsible-title-font-weight: bold !default;
 $cc-collapsible-content-padding: 10px 0px 0px 10px !default;

package/lib/components/form/form.component.d.ts

@@ -9,6 +9,7 @@ export declare class FormComponent implements AfterViewInit, OnDestroy, OnInit {
     get readonly(): boolean;
     keepInView: Element;
     onChange: EventEmitter<FormControl>;
+    showClass: boolean;
     submitted: boolean;
     readonly validSubmit: EventEmitter<void>;
     readonly anySubmit: EventEmitter<void>;

package/lib/components/grid/base/base-grid.component.d.ts

@@ -1,6 +1,8 @@
+import { ElementRef } from "@angular/core";
 import { ContextMenuItemModel, GridComponent, PageSettingsModel, RowDropSettingsModel } from "@syncfusion/ej2-angular-grids";
 import { GridLines } from "../enum/grid-lines.enum";
 export declare class BaseGridComponent<T> {
+    element: ElementRef;
     grid: GridComponent;
     data: T[];
     gridLines: GridLines;
@@ -21,4 +23,5 @@ export declare class BaseGridComponent<T> {
     get columns(): {}[];
     pageSettings: PageSettingsModel;
     private _columns;
+    constructor(element: ElementRef);
 }

package/lib/components/grid/base/base-inline-edit-grid.component.d.ts

@@ -1,9 +1,18 @@
-import { EventEmitter } from "@angular/core";
+import { AfterViewInit, EventEmitter, OnDestroy } from "@angular/core";
 import { EditSettingsModel } from "@syncfusion/ej2-angular-grids";
 import { BaseToolbarGridComponent } from "./base-toolbar-grid.component";
-export declare class BaseInlineEditGridComponent<T> extends BaseToolbarGridComponent<T> {
+import { Observable, Subscription } from "rxjs";
+export declare class BaseInlineEditGridComponent<T> extends BaseToolbarGridComponent<T> implements AfterViewInit, OnDestroy {
     set inlineEdit(value: boolean);
     rowSaved: EventEmitter<T>;
+    beforeRowDelete: EventEmitter<any>;
+    rowDeleted: EventEmitter<T>;
     editSettings: EditSettingsModel;
+    actionBeginObservable$: Observable<any>;
+    actionBeginObservableSub: Subscription;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    handleActionBegin(action: any): Promise<void>;
     handleActionComplete(action: any): void;
+    waitForBeforeDelete(action: any): Promise<any>;
 }

package/lib/components/grid/base/base-selection-grid.component.d.ts

@@ -15,6 +15,8 @@ export declare class BaseSelectionGridComponent<T> extends BaseInlineEditGridCom
     contextMenuItemClick: EventEmitter<GridMenuEventArgs>;
     rowDragStartEvent: EventEmitter<GridRowDragEventArgs>;
     rowDropEvent: EventEmitter<GridRowDropEventArgs>;
+    beforeRowsDelete: EventEmitter<any>;
+    rowsDeleted: EventEmitter<T[]>;
     selectionOptions: SelectionSettingsModel;
     ngOnInit(): void;
     handleRowSelected(rowData: any): void;
@@ -24,4 +26,6 @@ export declare class BaseSelectionGridComponent<T> extends BaseInlineEditGridCom
     contextMenuClick(args: MenuEventArgs): void;
     rowDragStartClick(args: RowDragEventArgs): void;
     rowDropClick(args: RowDropEventArgs): void;
+    handleBeforeBatchDelete(args: any): void;
+    handleBatchDelete(rows: T[]): void;
 }

package/lib/components/grid-toolbar/grid-toolbar.component.d.ts

@@ -0,0 +1,13 @@
+import { EventEmitter } from "@angular/core";
+import { CoreComponentsIcon } from "../../core/enum/core-components-icon.enum";
+import { IconCacheService } from "../icon/icon-cache.service";
+export declare class GridToolbarComponent {
+    iconsService: IconCacheService;
+    readonly icons: typeof CoreComponentsIcon;
+    editClick: EventEmitter<MouseEvent>;
+    cancelClick: EventEmitter<void>;
+    saveClick: EventEmitter<void>;
+    addClick: EventEmitter<void>;
+    showClass(): boolean;
+    constructor(iconsService: IconCacheService);
+}

package/lib/components/grid-toolbar/grid-toolbar.module.d.ts

@@ -0,0 +1,2 @@
+export declare class GridToolbarModule {
+}

package/lib/components/grid-toolbar/style/_layout.scss

@@ -0,0 +1,10 @@
+@include export-module('cc-grid-toolbar-layout') {
+
+  .co-grid-toolbar {
+    .grid-toolbar-wrapper {
+      display: flex;
+      flex-direction: row;
+      column-gap: 5px;
+    }
+  }
+}

package/lib/components/grid-toolbar/style/_theme.scss

@@ -0,0 +1,5 @@
+@include export-module('cc-grid-toolbar-theme') {
+
+  .co-grid-toolbar {
+  }
+}

package/lib/components/grid-toolbar/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../style/mixin";
+@import "../../../style/variables";
+@import "./material-definition";
+@import "./layout";
+@import "./theme";

package/lib/components/input-combo-box/input-combo-box.component.d.ts

@@ -18,7 +18,6 @@ export declare class InputComboBoxComponent extends BaseInputComponent<any> {
     placeholder: string;
     shopPopup: boolean;
     showClass(): boolean;
-    customHeight: boolean;
     constructor(formComponent: FormComponent, changeDetector: ChangeDetectorRef, componentFactoryResolver: ComponentFactoryResolver, formUserChangeListener?: FormInputUserModelChangeListenerService, ngZoneWrapper?: NgZoneWrapperService, elementRef?: ElementRef);
     onFocus(): void;
 }

package/lib/components/input-number-picker/input-number-picker.component.d.ts

@@ -2,7 +2,6 @@ import { ChangeDetectorRef, ComponentFactoryResolver, EventEmitter, NgZone, OnDe
 import { BaseInputComponent } from "../base/base-input.component";
 import { BoundsConstrainedNumberValue } from "../../core/model/bounds-constrained-number-value";
 import { KeyboardCode } from "../../core/enum/keyboard-code.enum";
-import { InputTextComponent } from "../input-text/input-text.component";
 import { FormInputUserModelChangeListenerService } from "../../core/service/form-input-user-change-listener.service";
 import { InputNumberPickerButtonShowMode } from "../../core/enum/input-number-picker-show-mode.enum";
 import { IconCacheService } from "../icon/icon-cache.service";
@@ -13,8 +12,6 @@ export declare class InputNumberPickerComponent extends BaseInputComponent<numbe
     iconCacheService: IconCacheService;
     private _ngZone;
     protected componentFactoryResolver: ComponentFactoryResolver;
-    set model(model: number);
-    get model(): number;
     set min(min: number);
     set step(step: number);
     set max(max: number);
@@ -25,7 +22,6 @@ export declare class InputNumberPickerComponent extends BaseInputComponent<numbe
     noValidation: boolean;
     set decimals(decimals: number);
     readonly modelChange: EventEmitter<number>;
-    inputTextComp: InputTextComponent;
     get showButtonsOnFocusOnly(): boolean;
     get hasLabel(): boolean;
     showClass(): boolean;
@@ -50,6 +46,7 @@ export declare class InputNumberPickerComponent extends BaseInputComponent<numbe
     ngOnDestroy(): void;
     doIncrementAuto(): void;
     handleKeyDown(event: KeyboardEvent): boolean;
+    handleChangeModel(value: number): void;
     doDecrementAuto(): void;
     stopAutoCounting(): void;
     setValue(newValue: number, silent?: boolean): void;
@@ -57,8 +54,6 @@ export declare class InputNumberPickerComponent extends BaseInputComponent<numbe
     decrement(steps?: number): void;
     onPlusMouseDown(event: Event): void;
     onMinusMouseDown(event: Event): void;
-    onNumberInputFocus(): void;
-    onNumberInputBlur(): void;
     private _doIncreaseStepFactor;
     private _getNextStepFactorMouseDown;
     private _updateButtonsShowState;

package/lib/components/input-radio-button/style/_material-definition.scss

@@ -1,5 +1,5 @@
 $cc-rb-font-family: $cc-font-family !default;
-$cc-rb-height: $cc-item-height !default;
+$cc-rb-height: $cc-item-size !default;
 $cc-rb-border-radius: $cc-default-border-radius !default;
 $cc-rb-padding: 10px 20px !default;
 $cc-rb-border-color: $cc-color-border !default;

package/lib/components/input-text/style/_layout.scss

@@ -12,37 +12,5 @@
       margin: ($cc-item-size - 8px) / 2 0 0;
       outline: none;
     }
-    .input-save-cancel-button-wrapper {
-      position: absolute;
-      padding: 5px 0 0 5px;
-      top: -36px;
-      right: 0;
-      display: flex;
-      column-gap: 2px;
-      transform-origin: center bottom;
-      .input-save-cancel-button {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        height: 30px;
-        width: 30px;
-        &.save {
-          background: $cc-co-input-text-button-background;
-          &:before {
-            content: "\2713";
-            font-size: 20px;
-            color: $cc-co-input-text-commit-color;
-          }
-        }
-        &.cancel {
-          background: #DAD9D9;
-          &:before {
-            content: "x";
-            font-size: 20px;
-            color: $cc-co-input-text-cancel-color;
-          }
-        }
-      }
-    }
   }
 }

package/lib/components/input-text/style/_material-definition.scss

@@ -2,6 +2,3 @@ $cc-co-input-text-font-family: $cc-font-family !default;
 $cc-co-input-text-font-size: $cc-font-size-default !default;
 $cc-co-input-text-font-color: $cc-color-dark !default;
 $cc-co-input-text-border-color: $cc-color-border !default;
-$cc-co-input-text-button-background: $cc-color-form-input-border !default;
-$cc-co-input-text-commit-color: green !default;
-$cc-co-input-text-cancel-color: red !default;

package/lib/components/input-text/style/_theme.scss

@@ -3,21 +3,5 @@
     input {
       background: transparent;
     }
-    .input-save-cancel-button-wrapper {
-      .input-save-cancel-button {
-        &.save {
-          background: $cc-co-input-text-button-background;
-          &:before {
-            color: $cc-co-input-text-commit-color;
-          }
-        }
-        &.cancel {
-          background: $cc-co-input-text-button-background;
-          &:before {
-            color: $cc-co-input-text-cancel-color;
-          }
-        }
-      }
-    }
   }
 }

package/lib/components/input-text/style/material.scss

@@ -5,3 +5,4 @@
 @import "./layout";
 @import "./theme";
 @import "../../validation-error/style/material";
+@import "../../base/commit-buttons/style/material";

package/lib/components/simple-grid/base-simple-grid.component.d.ts

@@ -0,0 +1,31 @@
+import { EventEmitter, QueryList } from "@angular/core";
+import { SimpleGridColumnDirective } from "./simple-grid-column.directive";
+import { CdkDrag, CdkDragDrop, CdkDropList } from "@angular/cdk/drag-drop";
+export declare abstract class BaseSimpleGridComponent {
+    set content(columnComponents: QueryList<SimpleGridColumnDirective>);
+    data: Object[];
+    dragDropEnabled: boolean;
+    inlineEdit: boolean;
+    showToolbar: boolean;
+    /**
+     * Should component emit drag and drop actions instead of handle
+     * (update collection) by itself
+     */
+    emitDragDrop: boolean;
+    set extraColumns(value: SimpleGridColumnDirective[]);
+    onDrop: EventEmitter<{
+        from: number;
+        to: number;
+    }>;
+    selectRow: EventEmitter<{}>;
+    dblClickRow: EventEmitter<{}>;
+    saveRow: EventEmitter<{}>;
+    handleMouseMove(event: MouseEvent): void;
+    handleMouseUp(event: MouseEvent): void;
+    columns: SimpleGridColumnDirective[];
+    private _columnForResize;
+    handleSizerMouseDown(event: MouseEvent, column: SimpleGridColumnDirective): void;
+    handleCanDragDrop(drag: CdkDrag, drop: CdkDropList): boolean;
+    handleDrop(event: CdkDragDrop<Object[]>): void;
+    private _setColumns;
+}