@covalent/core 3.1.1-beta.1 → 3.1.2-beta.7

package/side-sheet/side-sheet-container.d.ts

@@ -0,0 +1,92 @@
+import { AnimationEvent } from '@angular/animations';
+import { FocusMonitor, FocusOrigin, FocusTrapFactory } from '@angular/cdk/a11y';
+import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, DomPortal, TemplatePortal } from '@angular/cdk/portal';
+import { ChangeDetectorRef, ComponentRef, ElementRef, EmbeddedViewRef, EventEmitter } from '@angular/core';
+import { CovalentSideSheetConfig } from './side-sheet.config';
+export declare function _getFocusedElementPierceShadowDom(): HTMLElement | null;
+/**
+ * Base class for the `CovalentSideSheetContainer`. The base class does not implement
+ * animations as these are left to implementers of the side-sheet container.
+ */
+export declare abstract class _CovalentSideSheetContainerBase extends BasePortalOutlet {
+    protected _elementRef: ElementRef;
+    protected _focusTrapFactory: FocusTrapFactory;
+    protected _changeDetectorRef: ChangeDetectorRef;
+    /** The side-sheet configuration. */
+    _config: CovalentSideSheetConfig;
+    private _focusMonitor?;
+    protected _document: Document;
+    /** The portal outlet inside of this container into which the side-sheet content will be loaded. */
+    _portalOutlet: CdkPortalOutlet;
+    /** The class that traps and manages focus within the side-sheet. */
+    private _focusTrap;
+    /** Emits when an animation state changes. */
+    _animationStateChanged: EventEmitter<{
+        state: 'opened' | 'opening' | 'closing' | 'closed';
+        totalTime: number;
+    }>;
+    /** Element that was focused before the side-sheet was opened. Save this to restore upon close. */
+    private _elementFocusedBeforeSideSheetWasOpened;
+    /**
+     * Type of interaction that led to the side-sheet being closed. This is used to determine
+     * whether the focus style will be applied when returning focus to its original location
+     * after the side-sheet is closed.
+     */
+    _closeInteractionType: FocusOrigin | null;
+    /** ID of the element that should be considered as the side-sheet's label. */
+    _ariaLabelledBy: string | null;
+    /** ID for the container DOM element. */
+    _id: string;
+    constructor(_elementRef: ElementRef, _focusTrapFactory: FocusTrapFactory, _changeDetectorRef: ChangeDetectorRef, _document: any, 
+    /** The side-sheet configuration. */
+    _config: CovalentSideSheetConfig, _focusMonitor?: FocusMonitor);
+    /** Starts the side-sheet exit animation. */
+    abstract _startExitAnimation(): void;
+    /** Initializes the side-sheet container with the attached content. */
+    _initializeWithAttachedContent(): void;
+    /**
+     * Attach a ComponentPortal as content to this side-sheet container.
+     * @param portal Portal to be attached as the side-sheet content.
+     */
+    attachComponentPortal<T>(portal: ComponentPortal<T>): ComponentRef<T>;
+    /**
+     * Attach a TemplatePortal as content to this side-sheet container.
+     * @param portal Portal to be attached as the side-sheet content.
+     */
+    attachTemplatePortal<C>(portal: TemplatePortal<C>): EmbeddedViewRef<C>;
+    /**
+     * Attaches a DOM portal to the side-sheet container.
+     * @param portal Portal to be attached.
+     * @deprecated To be turned into a method.
+     */
+    attachDomPortal: (portal: DomPortal) => void;
+    /** Moves focus back into the side-sheet if it was moved out. */
+    _recaptureFocus(): void;
+    /**
+     * Moves the focus inside the focus trap. When autoFocus is not set to 'side-sheet', if focus
+     * cannot be moved then focus will go to the side-sheet container.
+     */
+    protected _trapFocus(): void;
+    /** Restores focus to the element that was focused before the side-sheet opened. */
+    protected _restoreFocus(): void;
+    /** Sets up the focus trap. */
+    private _setupFocusTrap;
+    /** Captures the element that was focused before the side-sheet was opened. */
+    private _capturePreviouslyFocusedElement;
+    /** Focuses the side-sheet container. */
+    private _focusSideSheetContainer;
+    /** Returns whether focus is inside the side-sheet. */
+    private _containsFocus;
+}
+/**
+ * Internal component that wraps the generated side-sheet content.
+ * This animation below is the only reason for duplicating most of the Material dialog code
+ */
+export declare class CovalentSideSheetContainer extends _CovalentSideSheetContainerBase {
+    /** State of the side-sheet animation. */
+    _state: 'void' | 'enter' | 'exit';
+    /** Callback, invoked whenever an animation on the host completes. */
+    _onAnimationDone({ toState, totalTime }: AnimationEvent): void;
+    /** Starts the side-sheet exit animation. */
+    _startExitAnimation(): void;
+}

package/side-sheet/side-sheet-ref.d.ts

@@ -0,0 +1,9 @@
+import { FocusOrigin } from '@angular/cdk/a11y';
+import { OverlayRef } from '@angular/cdk/overlay';
+import { MatDialogRef, _MatDialogContainerBase } from '@angular/material/dialog';
+export declare class CovalentSideSheetRef<T, R = any> extends MatDialogRef<T, R> {
+    _containerInstance: _MatDialogContainerBase;
+    readonly id: string;
+    constructor(overlayRef: OverlayRef, _containerInstance: _MatDialogContainerBase, id?: string);
+}
+export declare function _closeSideSheetVia<R>(ref: MatDialogRef<R>, interactionType: FocusOrigin, result?: R): void;

package/side-sheet/side-sheet.animation.d.ts

@@ -0,0 +1,4 @@
+import { AnimationTriggerMetadata } from '@angular/animations';
+export declare const tdSideSheetAnimations: {
+    readonly sideSheetContainer: AnimationTriggerMetadata;
+};

package/side-sheet/side-sheet.config.d.ts

@@ -0,0 +1,3 @@
+import { MatDialogConfig } from '@angular/material/dialog';
+export declare class CovalentSideSheetConfig<D = any> extends MatDialogConfig<D> {
+}

package/side-sheet/side-sheet.content-directives.d.ts

@@ -0,0 +1,50 @@
+import { OnChanges, OnInit, SimpleChanges, ElementRef } from '@angular/core';
+import { CovalentSideSheet } from './side-sheet';
+import { CovalentSideSheetRef } from './side-sheet-ref';
+/**
+ * Button that will close the current dialog.
+ */
+export declare class CovalentSideSheetClose implements OnInit, OnChanges {
+    dialogRef: CovalentSideSheetRef<any>;
+    private _elementRef;
+    private _dialog;
+    /** Screenreader label for the button. */
+    ariaLabel: string;
+    /** Default to "button" to prevents accidental form submits. */
+    type: 'submit' | 'button' | 'reset';
+    /** Dialog close input. */
+    dialogResult: any;
+    _CovalentSideSheetClose: any;
+    constructor(dialogRef: CovalentSideSheetRef<any>, _elementRef: ElementRef<HTMLElement>, _dialog: CovalentSideSheet);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    _onButtonClick(event: MouseEvent): void;
+}
+/**
+ * Title of a side sheet element. Stays fixed to the top of the side sheet when scrolling.
+ */
+export declare class CovalentSideSheetTitle implements OnInit {
+    private _dialogRef;
+    private _elementRef;
+    private _dialog;
+    /** Unique id for the dialog title. If none is supplied, it will be auto-generated. */
+    id: string;
+    constructor(_dialogRef: CovalentSideSheetRef<any>, _elementRef: ElementRef<HTMLElement>, _dialog: CovalentSideSheet);
+    ngOnInit(): void;
+}
+/**
+ * Scrollable content container of a dialog.
+ */
+export declare class CovalentSideSheetContent {
+}
+/**
+ * Container for the bottom action buttons in a dialog.
+ * Stays fixed to the bottom when scrolling.
+ */
+export declare class CovalentSideSheetActions {
+}
+/**
+ * Container for the wrapper part of the dialog
+ */
+export declare class CovalentSideSheetWrapper {
+}

package/side-sheet/side-sheet.d.ts

@@ -0,0 +1,56 @@
+import { InjectionToken, Injector, OnDestroy, TemplateRef, Type } from '@angular/core';
+import { Overlay } from '@angular/cdk/overlay';
+import { ComponentType } from '@angular/cdk/portal';
+import { CovalentSideSheetContainer, _CovalentSideSheetContainerBase } from './side-sheet-container';
+import { CovalentSideSheetRef } from './side-sheet-ref';
+import { CovalentSideSheetConfig } from './side-sheet.config';
+export declare class _CovalentSideSheetBase<C extends _CovalentSideSheetContainerBase> implements OnDestroy {
+    private _overlay;
+    private _injector;
+    private _defaultOptions;
+    private _parentSideSheet;
+    private _sideSheetRefConstructor;
+    private _sideSheetContainerType;
+    private _sideSheetDataToken;
+    private _openSideSheetsAtThisLevel;
+    private readonly _afterAllClosedAtThisLevel;
+    private readonly _afterOpenedAtThisLevel;
+    private _animationStateSubscriptions;
+    private defaultSidebarConfig;
+    constructor(_overlay: Overlay, _injector: Injector, _defaultOptions: CovalentSideSheetConfig | undefined, _parentSideSheet: _CovalentSideSheetBase<C> | undefined, _sideSheetRefConstructor: Type<CovalentSideSheetRef<any>>, _sideSheetContainerType: Type<C>, _sideSheetDataToken: InjectionToken<any>);
+    /** Keeps track of the currently-open side-sheets. */
+    get openSideSheets(): CovalentSideSheetRef<any>[];
+    open<T, D = any, R = any>(componentOrTemplateRef: ComponentType<T> | TemplateRef<T>, config?: CovalentSideSheetConfig<D>): CovalentSideSheetRef<T, R>;
+    ngOnDestroy(): void;
+    /**
+     * Closes all of the currently-open side-sheets.
+     */
+    closeAll(): void;
+    private _createOverlay;
+    /**
+     * Attaches a container to a side-sheets's already-created overlay.
+     * @param overlay Reference to the side-sheet's underlying overlay.
+     * @param config The side-sheet configuration.
+     * @returns A promise resolving to a ComponentRef for the attached container.
+     */
+    private _attachSideSheetContainer;
+    /**
+     * Attaches the user-provided component to the already-created side sheet container.
+     * @param componentOrTemplateRef The type of component being loaded into the side-sheet,
+     *     or a TemplateRef to instantiate as the content.
+     * @param dialogContainer Reference to the wrapping side-sheet container.
+     * @param overlayRef Reference to the overlay in which the side-sheet resides.
+     * @param config The side-sheet configuration.
+     * @returns A promise resolving to the CovalentSideSheetRef that should be returned to the user.
+     */
+    private _attachSideSheetContent;
+    private _createInjector;
+    /** Closes all of the side-sheet in an array. */
+    private _closeSideSheets;
+}
+/**
+ * Service to open Covalent Design side-sheet.
+ */
+export declare class CovalentSideSheet extends _CovalentSideSheetBase<CovalentSideSheetContainer> {
+    constructor(overlay: Overlay, injector: Injector, defaultOptions: CovalentSideSheetConfig, parentSideSheet: CovalentSideSheet);
+}

package/side-sheet/side-sheet.module.d.ts

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

package/side-sheet/side-sheet.scss

@@ -0,0 +1,69 @@
+$padding: 24px !default;
+$max-height: 65vh !default;
+$button-margin: 8px !default;
+
+.td-side-sheet-container {
+  background-color: white;
+  box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
+    0 6px 30px 5px rgba(0, 0, 0, 0.12);
+  display: block;
+  padding: $padding;
+  box-sizing: border-box;
+  overflow: auto;
+  outline: 0;
+  width: 100%;
+  height: 100%;
+  min-height: inherit;
+  max-height: inherit;
+}
+
+.td-side-sheet-wrapper {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+.td-side-sheet-content {
+  margin: 0 $padding * -1;
+  padding: 0 $padding;
+  overflow: auto;
+  flex: 1;
+  -webkit-overflow-scrolling: touch;
+}
+
+.td-side-sheet-title {
+  margin: -16px 0 20px;
+  display: flex;
+  align-items: center;
+}
+
+.td-side-sheet-actions {
+  padding: 8px 0;
+  margin: 0 -16px;
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  align-items: center;
+  box-sizing: content-box;
+
+  // Pull the actions down to avoid their padding stacking with the dialog's padding.
+  margin-bottom: -$padding;
+
+  &[align='end'] {
+    justify-content: flex-end;
+  }
+
+  &[align='center'] {
+    justify-content: center;
+  }
+
+  .mat-button-base + .mat-button-base,
+  .mat-mdc-button-base + .mat-mdc-button-base {
+    margin-left: $button-margin;
+
+    [dir='rtl'] & {
+      margin-left: 0;
+      margin-right: $button-margin;
+    }
+  }
+}

package/side-sheet/side-sheet.theme.scss

@@ -0,0 +1,8 @@
+@mixin td-side-sheet-theme($theme) {
+  $background: map-get($theme, background);
+  $dialog: map-get($background, dialog);
+
+  .td-side-sheet-container {
+    background-color: $dialog;
+  }
+}

package/tab-select/covalent-core-tab-select.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"CovalentTabSelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":11,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"TdTabSelectComponent"},{"__symbolic":"reference","name":"TdTabOptionComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/material/tabs","name":"MatTabsModule","line":19,"character":4}],"exports":[{"__symbolic":"reference","name":"TdTabSelectComponent"},{"__symbolic":"reference","name":"TdTabOptionComponent"}]}]}],"members":{}},"TdTabSelectBase":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":38,"character":41}]}]}},"_TdTabSelectMixinBase":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinControlValueAccessor","line":42,"character":37},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinDisabled","line":42,"character":63},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinDisableRipple","line":42,"character":77},"arguments":[{"__symbolic":"reference","name":"TdTabSelectBase"}]}]}]},"TdTabSelectComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"_TdTabSelectMixinBase"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":44,"character":1},"arguments":[{"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":45,"character":19},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":48,"character":15},"useExisting":{"__symbolic":"reference","name":"TdTabSelectComponent"},"multi":true}],"selector":"td-tab-select","inputs":["value","disabled","disableRipple"],"template":"<mat-tab-group\n  [attr.mat-stretch-tabs]=\"stretchTabs ? true : undefined\"\n  [backgroundColor]=\"backgroundColor\"\n  [color]=\"color\"\n  [disableRipple]=\"disableRipple\"\n  [selectedIndex]=\"selectedIndex\"\n  (selectedIndexChange)=\"selectedIndexChange($event)\"\n>\n  <ng-template let-tabOption ngFor [ngForOf]=\"tabOptions\">\n    <mat-tab [disabled]=\"tabOption.disabled || disabled\">\n      <ng-template matTabLabel>\n        <ng-template *ngIf=\"tabOption.content\" [cdkPortalOutlet]=\"tabOption.content\"></ng-template>\n      </ng-template>\n    </mat-tab>\n  </ng-template>\n</mat-tab-group>\n","styles":[":host::ng-deep>.mat-tab-group>.mat-tab-body-wrapper{display:none}"]}]}],"members":{"_matTabGroup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":69,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/tabs","name":"MatTabGroup","line":69,"character":13},{"static":true}]}]}],"_tabOptions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":78,"character":3},"arguments":[{"__symbolic":"reference","name":"TdTabOptionComponent"},{"descendants":true}]}]}],"stretchTabs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":87,"character":3},"arguments":["stretchTabs"]}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":98,"character":3}}]}],"backgroundColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":103,"character":3}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":109,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":38,"character":41},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":111,"character":70},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":111,"character":99}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"selectedIndexChange":[{"__symbolic":"method"}],"_refreshValues":[{"__symbolic":"method"}],"_setValue":[{"__symbolic":"method"}]}},"TdTabOptionBase":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":15,"character":40},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":15,"character":85}]}]}},"_TdTabOptionMixinBase":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinDisabled","line":19,"character":37},"arguments":[{"__symbolic":"reference","name":"TdTabOptionBase"}]},"TdTabOptionComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"_TdTabOptionMixinBase"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":21,"character":1},"arguments":[{"selector":"td-tab-option","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":25,"character":19},"member":"OnPush"},"inputs":["disabled"],"template":"<ng-template>\n  <ng-content></ng-content>\n</ng-template>\n","styles":[""]}]}],"members":{"_content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":35,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":35,"character":13},{"static":true}]}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":15,"character":40},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":15,"character":85}]}],"ngOnInit":[{"__symbolic":"method"}]}}},"origins":{"CovalentTabSelectModule":"./tab-select.module","TdTabSelectBase":"./tab-select.component","_TdTabSelectMixinBase":"./tab-select.component","TdTabSelectComponent":"./tab-select.component","TdTabOptionBase":"./tab-option.component","_TdTabOptionMixinBase":"./tab-option.component","TdTabOptionComponent":"./tab-option.component"},"importAs":"@covalent/core/tab-select"}
+{"__symbolic":"module","version":4,"metadata":{"CovalentTabSelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":11,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"TdTabSelectComponent"},{"__symbolic":"reference","name":"TdTabOptionComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/material/tabs","name":"MatTabsModule","line":19,"character":4}],"exports":[{"__symbolic":"reference","name":"TdTabSelectComponent"},{"__symbolic":"reference","name":"TdTabOptionComponent"}]}]}],"members":{}},"TdTabSelectBase":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":38,"character":41}]}]}},"_TdTabSelectMixinBase":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinControlValueAccessor","line":42,"character":37},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinDisabled","line":42,"character":63},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinDisableRipple","line":42,"character":77},"arguments":[{"__symbolic":"reference","name":"TdTabSelectBase"}]}]}]},"TdTabSelectComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"_TdTabSelectMixinBase"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":44,"character":1},"arguments":[{"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":45,"character":19},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":48,"character":15},"useExisting":{"__symbolic":"reference","name":"TdTabSelectComponent"},"multi":true}],"selector":"td-tab-select","inputs":["value","disabled","disableRipple"],"template":"<mat-tab-group\n  [attr.mat-stretch-tabs]=\"stretchTabs ? true : undefined\"\n  [backgroundColor]=\"backgroundColor\"\n  [color]=\"color\"\n  [disableRipple]=\"disableRipple\"\n  [selectedIndex]=\"selectedIndex\"\n  (selectedIndexChange)=\"selectedIndexChange($event)\"\n>\n  <ng-template let-tabOption ngFor [ngForOf]=\"tabOptions\">\n    <mat-tab [disabled]=\"tabOption.disabled || disabled\">\n      <ng-template matTabLabel>\n        <ng-template *ngIf=\"tabOption.content\" [cdkPortalOutlet]=\"tabOption.content\"></ng-template>\n      </ng-template>\n    </mat-tab>\n  </ng-template>\n</mat-tab-group>\n","styles":[":host::ng-deep>.mat-tab-group>.mat-tab-body-wrapper{display:none}"]}]}],"members":{"_matTabGroup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":70,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/tabs","name":"MatTabGroup","line":70,"character":13},{"static":true}]}]}],"_tabOptions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":79,"character":3},"arguments":[{"__symbolic":"reference","name":"TdTabOptionComponent"},{"descendants":true}]}]}],"stretchTabs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":88,"character":3},"arguments":["stretchTabs"]}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":99,"character":3}}]}],"backgroundColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":104,"character":3}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":110,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":38,"character":41},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":112,"character":70},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":112,"character":99}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"selectedIndexChange":[{"__symbolic":"method"}],"_refreshValues":[{"__symbolic":"method"}],"_setValue":[{"__symbolic":"method"}]}},"TdTabOptionBase":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":15,"character":40},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":15,"character":85}]}]}},"_TdTabOptionMixinBase":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinDisabled","line":19,"character":37},"arguments":[{"__symbolic":"reference","name":"TdTabOptionBase"}]},"TdTabOptionComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"_TdTabOptionMixinBase"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":21,"character":1},"arguments":[{"selector":"td-tab-option","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":25,"character":19},"member":"OnPush"},"inputs":["disabled"],"template":"<ng-template>\n  <ng-content></ng-content>\n</ng-template>\n","styles":[""]}]}],"members":{"_content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":35,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":35,"character":13},{"static":true}]}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":15,"character":40},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":15,"character":85}]}],"ngOnInit":[{"__symbolic":"method"}]}}},"origins":{"CovalentTabSelectModule":"./tab-select.module","TdTabSelectBase":"./tab-select.component","_TdTabSelectMixinBase":"./tab-select.component","TdTabSelectComponent":"./tab-select.component","TdTabOptionBase":"./tab-option.component","_TdTabOptionMixinBase":"./tab-option.component","TdTabOptionComponent":"./tab-option.component"},"importAs":"@covalent/core/tab-select"}

package/theming/_all-theme.scss

@@ -12,6 +12,7 @@
 @import '../paging/paging-bar-theme';
 @import '../notifications/notification-count-theme';
 @import '../message/message-theme';
+@import '../side-sheet/side-sheet.theme';
 // import the covalent mixins
 @import '../common/styles/styles';
 @import '../typography/all-typography';
@@ -33,4 +34,5 @@
   @include td-data-table-theme($theme);
   @include td-notification-count-theme($theme);
   @include td-message-theme($theme);
+  @include td-side-sheet-theme($theme);
 }

package/theming/prebuilt/blue-grey-deep-orange.css

@@ -1657,7 +1657,8 @@ th.mat-header-cell, td.mat-cell, td.mat-footer-cell {
 .mat-menu-item {
   background: transparent;
   color: rgba(0, 0, 0, 0.87); }
-  .mat-menu-item[disabled], .mat-menu-item[disabled]::after {
+  .mat-menu-item[disabled], .mat-menu-item[disabled]::after,
+  .mat-menu-item[disabled] .mat-icon-no-color {
     color: rgba(0, 0, 0, 0.38); }
 
 .mat-menu-item .mat-icon-no-color,
@@ -1977,6 +1978,24 @@ th.mat-header-cell, td.mat-cell, td.mat-footer-cell {
   background-color: #455a64;
   color: rgba(255, 255, 255, 0.87); }
 
+.mat-step-header.mat-accent .mat-step-icon {
+  color: white; }
+
+.mat-step-header.mat-accent .mat-step-icon-selected,
+.mat-step-header.mat-accent .mat-step-icon-state-done,
+.mat-step-header.mat-accent .mat-step-icon-state-edit {
+  background-color: #ff5722;
+  color: white; }
+
+.mat-step-header.mat-warn .mat-step-icon {
+  color: white; }
+
+.mat-step-header.mat-warn .mat-step-icon-selected,
+.mat-step-header.mat-warn .mat-step-icon-state-done,
+.mat-step-header.mat-warn .mat-step-icon-state-edit {
+  background-color: #e53935;
+  color: white; }
+
 .mat-step-header .mat-step-icon-state-error {
   background-color: transparent;
   color: #e53935; }
@@ -2315,6 +2334,12 @@ mat-list-item mat-icon,
 .mat-list-text p {
   color: rgba(0, 0, 0, 0.38); }
 
+table.mat-table {
+  background: transparent; }
+
+.mat-row:hover, .mat-row:focus {
+  background-color: rgba(0, 0, 0, 0.04); }
+
 .mat-drawer-container {
   background-color: #e0e0e0; }
 
@@ -2523,6 +2548,11 @@ td-file-input {
     -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
             box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); }
 
+.mat-toolbar.td-window-dialog-toolbar {
+  color: rgba(0, 0, 0, 0.87);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+  background: none; }
+
 .td-dialog-message {
   color: rgba(0, 0, 0, 0.54); }
 
@@ -2646,4 +2676,7 @@ table[td-data-table].mat-clickable tbody > tr.td-data-table-row:hover {
   color: #e53935;
   background-color: rgba(229, 57, 53, 0.15); }
 
+.td-side-sheet-container {
+  background-color: white; }
+
 /*# sourceMappingURL=blue-grey-deep-orange.css.map */