@colijnit/transaction 12.1.7 → 12.1.8

package/{app → lib}/component/service-order/transaction-order-line-view/transaction-order-line-view.component.scss

@@ -1,4 +1,5 @@
-@import "src/style/variables";
+@import "../../../style/variables";
+/*
 @import "src/style/styles";
 
 :host {
@@ -86,3 +87,4 @@
     }
   }
 }
+*/

package/{app → lib}/component/service-order/transaction-order-lines/transaction-order-lines.component.scss

@@ -1,4 +1,5 @@
-@import "src/style/variables";
+@import "../../../style/variables";
+/*
 @import "src/style/styles";
 
 :host {
@@ -81,3 +82,4 @@
     }
   }
 }
+*/

package/{app → lib}/component/service-order/transaction-order-totals/transaction-order-totals.component.scss

@@ -1,4 +1,5 @@
-@import "src/style/variables";
+@import "../../../style/variables";
+/*
 @import "src/style/styles";
 
 :host {
@@ -22,3 +23,4 @@
     }
   }
 }
+*/

package/{app → lib}/component/service-order/warehouse/warehouse.component.scss

@@ -1,4 +1,5 @@
-@import "src/style/variables";
+@import "../../../style/variables";
+/*
 @import "src/style/styles";
 
 ::ng-deep #warehouseDialog {
@@ -50,3 +51,4 @@ co-button:not(:last-child) {
 co-input-number-picker co-button {
   max-width: 20px;
 }
+*/

package/lib/component/shared/transaction-article-text/style/_layout.scss

@@ -0,0 +1,42 @@
+@import "../../../../style/mixin";
+
+@include export-module('co-transaction-article-text-layout') {
+  .co-transaction-article-text {
+    font-size: $tp-co-transaction-article-text-font-size;
+    .article-text-content-wrapper {
+      display: flex;
+      flex-direction: row;
+      column-gap: 25px;
+      textarea {
+        font-family: $tp-co-transaction-article-text-font-family;
+        min-height: 250px;
+        min-width: 350px;
+        border: 1px solid;
+        &:focus {
+          outline: none;
+        }
+        &:read-only {
+          opacity: $tp-co-transaction-article-text-readonly-opacity;
+        }
+      }
+    }
+    .editor-wrapper {
+      display: flex;
+      //flex-basis: 450px;
+    }
+    .option-wrapper {
+      display: flex;
+      flex-direction: column;
+      row-gap: $tp-co-transaction-article-text-options-row-gap;
+      width: 300px;
+      flex-shrink: 0;
+    }
+    .button-wrapper {
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-end;
+      padding: 10px;
+      column-gap: 5px;
+    }
+  }
+}

package/lib/component/shared/transaction-article-text/style/_material-definition.scss

@@ -0,0 +1,7 @@
+$tp-co-transaction-article-text-font-family: $tp-font-family !default;
+$tp-co-transaction-article-text-font-size: $tp-font-size !default;
+$tp-co-transaction-article-text-readonly-opacity: 0.5 !default;
+$tp-co-transaction-article-text-border-color: $tp-color-border !default;
+$tp-co-transaction-article-text-options-row-gap: 40px !default;
+$cc-co-input-listbox-font-size: $tp-co-transaction-article-text-font-size;
+$cc-co-input-listbox-header-font-size: $tp-co-transaction-article-text-font-size;

package/lib/component/shared/transaction-article-text/style/_theme.scss

@@ -0,0 +1,11 @@
+@import "../../../../style/mixin";
+
+@include export-module('co-transaction-article-text-theme') {
+  .co-transaction-article-text {
+    .article-text-content-wrapper {
+      textarea {
+        border-color: $tp-co-transaction-article-text-border-color;
+      }
+    }
+  }
+}

package/lib/component/shared/transaction-article-text/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../../style/variables";
+@import "./material-definition";
+@import "./layout";
+@import "./theme";
+@import "lib/components/input-listbox/style/material";

package/lib/component/shared/transaction-article-text/transaction-article-text.component.d.ts

@@ -0,0 +1,31 @@
+import { EventEmitter, OnInit } from "@angular/core";
+import { TransactionService } from "../../../service/transaction.service";
+import { TransactionLineInfo } from "@colijnit/transactionapi/build/model/transaction-line-info.bo";
+import { StandardText } from "../../../model/standard-text";
+import { TransactionAddTextLineRequest } from "@colijnit/transactionapi/build/model/transaction-add-text-line-request.bo";
+export declare class TransactionArticleTextComponent implements OnInit {
+    service: TransactionService;
+    header: string;
+    set transactionLine(value: TransactionLineInfo);
+    set articleRef(value: string);
+    get articleRef(): string;
+    set editText(value: string);
+    set articleLineNr(value: number);
+    closeClick: EventEmitter<MouseEvent>;
+    cancelClick: EventEmitter<MouseEvent>;
+    saveClick: EventEmitter<TransactionAddTextLineRequest>;
+    showClass(): boolean;
+    showOverviewDialog: boolean;
+    standardTexts: StandardText[];
+    documents: any[];
+    fields: Object;
+    fieldsDocuments: Object;
+    transactionAddTextLineRequest: TransactionAddTextLineRequest;
+    private _articleRef;
+    constructor(service: TransactionService);
+    ngOnInit(): Promise<void>;
+    onOkClick(event: MouseEvent): void;
+    onCancelClick(event: MouseEvent): void;
+    onSelectStandardText(value: any): void;
+    handleDocumentsChange(docs: any): void;
+}

package/lib/component/shared/transaction-article-text/transaction-article-text.module.d.ts

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

package/lib/component/shared/transaction-article-text-overview/style/_layout.scss

@@ -0,0 +1,56 @@
+@import "../../../../style/mixin";
+
+@include export-module('co-transaction-article-text-overview-layout') {
+  .co-transaction-article-text-overview {
+    .button-wrapper {
+      display: flex;
+      flex-direction: row;
+      column-gap: $tp-transaction-article-text-overview-buttons-column-gap;
+      justify-content: flex-end;
+    }
+    .dialog-content {
+      min-width: 350px;
+      min-height: 200px;
+    }
+  }
+  .article-text-overview-article-text-wrapper {
+    font-family: $tp-transaction-article-text-overview-font-family;
+    font-size: $tp-transaction-article-text-overview-font-size;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    background-color: white;
+    column-gap: $tp-transaction-article-text-overview-column-gap;
+    border: $tp-transaction-article-text-overview-text-border;
+    border-width: $tp-transaction-article-text-overview-text-border-width;
+    box-shadow: $tp-transaction-article-text-overview-text-shadow-box;
+    .index {
+      padding: 10px;
+      background-color: $tp-transaction-article-text-overview-index-background-color;
+      width: 20px;
+    }
+  }
+  .article-text-overview-article-text-wrapper.cdk-drag-preview {
+    box-sizing: border-box;
+    border-radius: 4px;
+    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
+    0 8px 10px 1px rgba(0, 0, 0, 0.14),
+    0 3px 14px 2px rgba(0, 0, 0, 0.12);
+  }
+
+  .article-text-overview-article-text-wrapper.cdk-drag-placeholder {
+    opacity: 0.3;
+  }
+
+  .cdk-drag-animating {
+    //transition: transform 200ms cubic-bezier(0, 0, 0.2, 1);
+  }
+
+  .article-text-drag-drop-list.cdk-drop-list-dragging, .article-text-overview-article-text-wrapper.cdk-drag {
+    //transition: transform 200ms cubic-bezier(0, 0, 0.2, 1);
+  }
+
+  .draggable-item:last-child {
+    border: none;
+  }
+}

package/lib/component/shared/transaction-article-text-overview/style/_material-definition.scss

@@ -0,0 +1,9 @@
+$tp-transaction-article-text-overview-font-family: $tp-font-family !default;
+$tp-transaction-article-text-overview-font-size: $tp-font-size !default;
+$tp-transaction-article-text-overview-column-gap: 5px !default;
+$tp-transaction-article-text-overview-text-border: none !default;
+$tp-transaction-article-text-overview-text-border-width: 1px 1px 1px 1px !default;
+$tp-transaction-article-text-overview-text-border-color: $tp-color-border !default;
+$tp-transaction-article-text-overview-text-shadow-box: inset -1px 0px 1px 0px $tp-color-border !default;
+$tp-transaction-article-text-overview-index-background-color: $tp-color-light-accent !default;
+$tp-transaction-article-text-overview-buttons-column-gap: 5px !default;

package/lib/component/shared/transaction-article-text-overview/style/_theme.scss

@@ -0,0 +1,9 @@
+@import "../../../../style/mixin";
+
+@include export-module('co-transaction-article-text-overview-theme') {
+  .co-transaction-article-text-overview {
+  }
+  .article-text-overview-article-text-wrapper {
+    border-color: $tp-transaction-article-text-overview-text-border-color;
+  }
+}

package/lib/component/shared/transaction-article-text-overview/style/material.scss

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

package/lib/component/shared/transaction-article-text-overview/transaction-article-text-overview.component.d.ts

@@ -0,0 +1,30 @@
+import { EventEmitter } from "@angular/core";
+import { TransactionService } from "../../../service/transaction.service";
+import { TransactionLineInfo } from "@colijnit/transactionapi/build/model/transaction-line-info.bo";
+import { TransactionAddTextLineRequest } from "@colijnit/transactionapi/build/model/transaction-add-text-line-request.bo";
+import { CdkDrag, CdkDragDrop, CdkDropList } from "@angular/cdk/drag-drop";
+import { BusinessObjectFactory } from "../../../factory/business-object-factory";
+export declare class TransactionArticleTextOverviewComponent {
+    service: TransactionService;
+    private _boFactory;
+    header: string;
+    set transactionLine(value: TransactionLineInfo);
+    closeClick: EventEmitter<MouseEvent>;
+    cancelClick: EventEmitter<MouseEvent>;
+    saveClick: EventEmitter<TransactionAddTextLineRequest>;
+    showClass(): boolean;
+    collection: TransactionLineInfo[];
+    showTransactionArticleText: boolean;
+    editTransactionLine: TransactionLineInfo;
+    textToEdit: string;
+    constructor(service: TransactionService, _boFactory: BusinessObjectFactory);
+    onOkClick(event: MouseEvent): void;
+    onCancelClick(event: MouseEvent): void;
+    handleCanDragDrop(drag: CdkDrag, drop: CdkDropList): boolean;
+    handleDrop(event: CdkDragDrop<TransactionLineInfo[]>): void;
+    handleOpenArticleText(transLine: TransactionLineInfo): void;
+    closeTransactionArticleText(event: MouseEvent): void;
+    saveTransactionArticleLineText(transactionAddTextLineRequest: TransactionAddTextLineRequest): void;
+    private _hideArticleTextDialog;
+    private _getArticleTexts;
+}

package/lib/component/shared/transaction-article-text-overview/transaction-article-text-overview.module.d.ts

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

package/lib/component/shopping-cart/shopping-cart.component.d.ts

@@ -0,0 +1,15 @@
+import { EventEmitter, OnDestroy } from "@angular/core";
+import { DictionaryService } from "../../service/dictionary.service";
+import { TransactionInfoResponse } from "@colijnit/transactionapi/build/model/transaction-info-response.bo";
+import { TransactionService } from "../../service/transaction.service";
+export declare class ShoppingCartComponent implements OnDestroy {
+    service: TransactionService;
+    private _dictionary;
+    closeCart: EventEmitter<void>;
+    checkout: EventEmitter<void>;
+    showClass(): boolean;
+    transaction: TransactionInfoResponse;
+    private _subs;
+    constructor(service: TransactionService, _dictionary: DictionaryService);
+    ngOnDestroy(): void;
+}

package/lib/component/shopping-cart/shopping-cart.module.d.ts

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

package/lib/component/shopping-cart/style/_layout.scss

@@ -0,0 +1,33 @@
+@import "../../../style/mixin";
+
+@include export-module('co-shopping-cart-layout') {
+  .co-shopping-cart {
+    font-family: $tp-shopping-cart-font-family;
+    font-size: $tp-shopping-cart-font-size;
+    padding: $tp-shopping-cart-padding;
+    display: flex;
+    flex-direction: column;
+
+    .cart-header {
+      display: flex;
+      justify-content: space-between;
+
+      .cart-header-label {
+        font-weight: bold;
+      }
+    }
+    .co-transaction-line {
+      padding: 0;
+    }
+    .cart-buttons {
+      display: flex;
+      justify-content: flex-end;
+      align-items: center;
+      column-gap: $tp-shopping-cart-buttons-column-gap;
+      margin: $tp-shopping-cart-buttons-margin;
+    }
+    .button-resume {
+      cursor: pointer;
+    }
+  }
+}

package/lib/component/shopping-cart/style/_material-definition.scss

@@ -0,0 +1,10 @@
+$tp-shopping-cart-font-family: $tp-font-family !default;
+$tp-shopping-cart-font-size: $tp-font-size !default;
+$tp-shopping-cart-background-color: white !default;
+$tp-shopping-cart-color: $tp-color-dark !default;
+$tp-shopping-cart-padding: 10px !default;
+
+$tp-shopping-cart-buttons-column-gap: 15px !default;
+$tp-shopping-cart-buttons-margin: 15px 0 !default;
+$tp-shopping-cart-buttons-cart-resume-color: $tp-color-dark !default;
+$tp-shopping-cart-buttons-cart-checkout-background-color: $tp-color-active-light !default;

package/lib/component/shopping-cart/style/_theme.scss

@@ -0,0 +1,14 @@
+@import "../../../style/mixin";
+
+@include export-module('co-shopping-cart-theme') {
+  .co-shopping-cart {
+    background-color: $tp-shopping-cart-background-color;
+    color: $tp-shopping-cart-color;
+    .button-resume {
+      color: $tp-shopping-cart-buttons-cart-resume-color;
+    }
+    .button-checkout {
+      background-color: $tp-shopping-cart-buttons-cart-checkout-background-color;
+    }
+  }
+}

package/lib/component/shopping-cart/style/material.scss

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

package/{app/component/shopping-cart → lib/component/shopping-cart-OLD}/shopping-cart-manager/shopping-cart-manager.component.scss

@@ -1,6 +1,7 @@
-@import "src/style/variables";
-@import "src/style/styles";
+//@import "src/style/variables";
+//@import "src/style/styles";
 
+/*
 ::ng-deep #warehouseDialog {
   align-items: center;
   max-height: 100%;
@@ -50,3 +51,4 @@ co-button:not(:last-child) {
 co-input-number-picker co-button {
   max-width: 20px;
 }
+*/

package/lib/component/shopping-cart-preview/shopping-cart-preview.component.d.ts

@@ -0,0 +1,11 @@
+import { EventEmitter } from "@angular/core";
+import { TransactionService } from "../../service/transaction.service";
+import { Icon } from "../../enum/icon.enum";
+export declare class ShoppingCartPreviewComponent {
+    service: TransactionService;
+    readonly icons: typeof Icon;
+    checkout: EventEmitter<void>;
+    editCartClick: EventEmitter<void>;
+    showClass(): boolean;
+    constructor(service: TransactionService);
+}

package/lib/component/shopping-cart-preview/shopping-cart-preview.module.d.ts

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

package/lib/component/shopping-cart-preview/style/_layout.scss

@@ -0,0 +1,44 @@
+@import "../../../style/mixin";
+
+@include export-module('co-shopping-cart-preview-layout') {
+  .co-shopping-cart-preview {
+    display: block;
+    font-family: $tp-shopping-cart-preview-font-family;
+    font-size: $tp-shopping-cart-preview-font-size;
+    padding: $tp-shopping-cart-preview-padding;
+    border: $tp-shopping-cart-preview-border;
+    box-shadow: $tp-shopping-cart-preview-box-shadow;
+    .cart-header {
+      font-family: $tp-shopping-cart-preview-header-font-family;
+      font-size: $tp-shopping-cart-preview-header-font-size;
+      margin: $tp-shopping-cart-preview-header-margin;
+      text-transform: $tp-shopping-cart-preview-header-text-transform;
+      font-weight: $tp-shopping-cart-preview-header-font-weight;
+    }
+    .co-image-display .no-image .no-image-label {
+      font-size: 8px;
+    }
+
+    .co-transaction-line {
+      padding: 0;
+    }
+    .preview-totals-wrapper {
+      display: flex;
+      justify-content: flex-end;
+      margin: $tp-shopping-cart-preview-totals-margin;
+      .co-transaction-totals {
+        width: 250px;
+      }
+    }
+    .cart-buttons {
+      display: flex;
+      justify-content: flex-end;
+      align-items: center;
+      column-gap: $tp-shopping-cart-preview-buttons-column-gap;
+      margin: $tp-shopping-cart-preview-buttons-margin;
+    }
+    .button-edit-cart {
+      cursor: pointer;
+    }
+  }
+}

package/lib/component/shopping-cart-preview/style/_material-definition.scss

@@ -0,0 +1,20 @@
+$tp-shopping-cart-preview-font-family: $tp-font-family !default;
+$tp-shopping-cart-preview-font-size: $tp-font-size !default;
+$tp-shopping-cart-preview-background-color: white !default;
+$tp-shopping-cart-preview-font-color: $tp-color-dark !default;
+$tp-shopping-cart-preview-padding: 10px !default;
+$tp-shopping-cart-preview-border: none !default;
+$tp-shopping-cart-preview-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2) !default;
+
+$tp-shopping-cart-preview-header-font-family: $tp-font-family !default;
+$tp-shopping-cart-preview-header-font-size: $tp-font-size-big !default;
+$tp-shopping-cart-preview-header-font-color: $tp-color-active-light !default;
+$tp-shopping-cart-preview-header-font-weight: bold !default;
+$tp-shopping-cart-preview-header-text-transform: uppercase !default;
+$tp-shopping-cart-preview-header-margin: 5px !default;
+
+$tp-shopping-cart-preview-totals-margin: 15px 0 !default;
+$tp-shopping-cart-preview-buttons-column-gap: 15px !default;
+$tp-shopping-cart-preview-buttons-margin: 20px 0 !default;
+$tp-shopping-cart-preview-buttons-edit-cart-color: $tp-color-dark !default;
+$tp-shopping-cart-preview-buttons-checkout-background-color: $tp-color-active-light !default;

package/lib/component/shopping-cart-preview/style/_theme.scss

@@ -0,0 +1,17 @@
+@import "../../../style/mixin";
+
+@include export-module('co-shopping-cart-preview-theme') {
+  .co-shopping-cart-preview {
+    background-color: $tp-shopping-cart-preview-background-color;
+    color: $tp-shopping-cart-preview-font-color;
+    .cart-header {
+      color: $tp-shopping-cart-preview-header-font-color;
+    }
+    .button-edit-cart {
+      color: $tp-shopping-cart-preview-buttons-edit-cart-color;
+    }
+    .button-checkout {
+      background-color: $tp-shopping-cart-preview-buttons-checkout-background-color;
+    }
+  }
+}

package/lib/component/shopping-cart-preview/style/material.scss

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

package/lib/component/stepper/component/stepper-step.component.d.ts

@@ -0,0 +1,12 @@
+import { EventEmitter } from "@angular/core";
+export declare class StepperStepComponent {
+    index: number;
+    label: string;
+    set completed(value: boolean);
+    get completed(): boolean;
+    validateStep: EventEmitter<void>;
+    show: boolean;
+    showClass(): boolean;
+    private _completed;
+    onComplete: (complete: boolean) => void;
+}

package/lib/component/stepper/stepper.component.d.ts

@@ -0,0 +1,30 @@
+import { AfterContentInit, EventEmitter } from "@angular/core";
+import { StepperStepComponent } from "./component/stepper-step.component";
+export interface steps {
+    index: number;
+    description: string;
+    complete: boolean;
+}
+export declare class StepperComponent implements AfterContentInit {
+    set content(children: any);
+    finishButtonLabel: string;
+    finishStep: EventEmitter<void>;
+    showClass(): boolean;
+    set stepChildren(value: StepperStepComponent[]);
+    get stepChildren(): StepperStepComponent[];
+    get canPrevious(): boolean;
+    get canNext(): boolean;
+    get finished(): boolean;
+    activeStep: number;
+    firstStep: number;
+    lastStep: number;
+    steps: steps[];
+    private _stepChildren;
+    ngAfterContentInit(): void;
+    goto(idx: number): void;
+    gotoPrevious(): void;
+    gotoNext(): void;
+    private _validateCurrentStep;
+    private _setActive;
+    private _prepareSteps;
+}

package/lib/component/stepper/stepper.module.d.ts

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

package/lib/component/stepper/style/_layout.scss

@@ -0,0 +1,75 @@
+@import "../../../style/mixin";
+
+@include export-module('co-stepper-layout') {
+  .co-stepper {
+    font-family: $tp-co-stepper-font-family;
+    font-size: $tp-co-stepper-font-size;
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    .co-stepper-content {
+      display: flex;
+      flex-direction: row;
+    }
+    .stepper-step {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      &:not(:last-child):after {
+        content: "";
+        position: relative;
+        top: calc(#{$tp-co-stepper-step-index-size} / 2);
+        width: calc(100% - #{$tp-co-stepper-step-index-size} - (5px * 2));
+        left: 50%;
+        height: 2px;
+        background-color: $tp-co-stepper-step-complete-background-color;
+        order: -1;
+      }
+      .index {
+        cursor: pointer;
+        display: flex;
+        font-size: $tp-co-stepper-step-index-font-size;
+        height: $tp-co-stepper-step-index-size;
+        width: $tp-co-stepper-step-index-size;
+        align-items: center;
+        justify-content: center;
+        border-radius: 50%;
+        background-color: $tp-co-stepper-step-incomplete-background-color;
+        color: $tp-co-stepper-step-incomplete-color;
+      }
+      .description {
+        margin-top: 15px;
+        color: $tp-co-stepper-step-incomplete-background-color;
+      }
+      &.active {
+        .index {
+          background-color: $tp-co-stepper-step-active-background-color;
+          color: $tp-co-stepper-step-active-color;
+        }
+        .description {
+          color: $tp-co-stepper-step-active-background-color;
+        }
+      }
+      &.complete {
+        .index {
+          background-color: $tp-co-stepper-step-complete-background-color;
+          color: $tp-co-stepper-step-complete-color;
+        }
+        .description {
+          color: $tp-co-stepper-step-complete-background-color;
+        }
+      }
+    }
+    .co-stepper-step {
+      display: block;
+      padding: $tp-co-stepper-step-padding;
+    }
+    .stepper-button-wrapper {
+      display: flex;
+      column-gap: 5px;
+      justify-content: flex-end;
+      margin: 15px 0;
+    }
+  }
+}

package/lib/component/stepper/style/_material-definition.scss

@@ -0,0 +1,11 @@
+$tp-co-stepper-font-family: $tp-font-family !default;
+$tp-co-stepper-font-size: $tp-font-size !default;
+$tp-co-stepper-step-index-size: 30px !default;
+$tp-co-stepper-step-index-font-size: $tp-font-size-big !default;
+$tp-co-stepper-step-padding: 30px !default;
+$tp-co-stepper-step-complete-color: white !default;
+$tp-co-stepper-step-complete-background-color: $tp-color-active !default;
+$tp-co-stepper-step-incomplete-background-color: $tp-color-action-light !default;
+$tp-co-stepper-step-incomplete-color: $tp-color-dark !default;
+$tp-co-stepper-step-active-background-color: $tp-color-action !default;
+$tp-co-stepper-step-active-color: white !default;

package/lib/component/stepper/style/_theme.scss

@@ -0,0 +1,7 @@
+@import "../../../style/mixin";
+@import "./material-definition";
+
+@include export-module('co-stepper-theme') {
+  .co-stepper {
+  }
+}

package/lib/component/stepper/style/material.scss

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