@covalent/core 3.1.2 → 4.0.0-beta.2

package/steps/nav/nav-steps-horizontal/nav-steps-horizontal.component.d.ts

@@ -1,79 +0,0 @@
-import { QueryList, OnDestroy, AfterContentInit, AfterContentChecked, ChangeDetectorRef, ElementRef, Renderer2 } from '@angular/core';
-import { Direction, Directionality } from '@angular/cdk/bidi';
-import { ViewportRuler } from '@angular/cdk/scrolling';
-import { TdNavStepLinkComponent } from '../nav-step-link/nav-step-link.component';
-/**
- * The directions that scrolling can go in when the header's tabs exceed the header width. 'After'
- * will scroll the header towards the end of the tabs list and 'before' will scroll towards the
- * beginning of the list.
- */
-export declare type ScrollDirection = 'after' | 'before';
-export declare class TdNavStepsHorizontalComponent implements AfterContentChecked, AfterContentInit, OnDestroy {
-    private _elementRef;
-    private _viewportRuler;
-    private _dir;
-    private _renderer;
-    private _changeDetectorRef;
-    private _separators;
-    /** Emits when the component is destroyed. */
-    private readonly _destroyed;
-    private _widthSubject;
-    private _scrollDistance;
-    private _scrollDistanceChanged;
-    /** Whether the controls for pagination should be displayed */
-    _showPaginationControls: boolean;
-    /** Whether the step list can be scrolled more towards the end. */
-    _disableScrollAfter: boolean;
-    /** Whether the step list can be scrolled more towards the beginning. */
-    _disableScrollBefore: boolean;
-    _steps: QueryList<TdNavStepLinkComponent>;
-    _stepListContainer: ElementRef;
-    _stepList: ElementRef;
-    get nativeElementWidth(): number;
-    constructor(_elementRef: ElementRef, _viewportRuler: ViewportRuler, _dir: Directionality, _renderer: Renderer2, _changeDetectorRef: ChangeDetectorRef);
-    ngAfterContentInit(): void;
-    ngAfterContentChecked(): void;
-    ngOnDestroy(): void;
-    /**
-     * Listen to right and left key events to move the the viewport.
-     */
-    _handleKeydown(event: KeyboardEvent): void;
-    /**
-     * Updates the view whether pagination should be enabled or not.
-     */
-    updatePagination(): void;
-    /** The layout direction of the containing app. */
-    _getLayoutDirection(): Direction;
-    /** Performs the CSS transformation on the step list that will cause the list to scroll. */
-    _updateStepScrollPosition(): void;
-    /** Sets the distance in pixels that the step header should be transformed in the X-axis. */
-    get scrollDistance(): number;
-    set scrollDistance(v: number);
-    /**
-     * Moves the step list in the 'before' or 'after' direction (towards the beginning of the list or
-     * the end of the list, respectively).
-     */
-    _scrollHeader(scrollDir: ScrollDirection): void;
-    /**
-     * Evaluate whether the pagination controls should be displayed. If the scroll width of the
-     * step list is wider than the size of the header container, then the pagination controls should
-     * be shown.
-     */
-    _checkPaginationEnabled(): void;
-    /**
-     * Evaluate whether the before and after controls should be enabled or disabled.
-     * If the header is at the beginning of the list (scroll distance is equal to 0) then disable the
-     * before button. If the header is at the end of the list (scroll distance is equal to the
-     * maximum distance we can scroll), then disable the after button.
-     */
-    _checkScrollingControls(): void;
-    /**
-     * Determines what is the maximum length in pixels that can be set for the scroll distance. This
-     * is equal to the difference in width between the step list container and step header container.
-     */
-    _getMaxScrollDistance(): number;
-    /**
-     * Set the step line separators and display numbers
-     */
-    private _configureSteps;
-}

package/steps/nav/nav-steps-horizontal/nav-steps-horizontal.component.scss

@@ -1,83 +0,0 @@
-:host {
-  width: 100%;
-  display: block;
-}
-.td-steps-header,
-.td-steps-header-list {
-  // layout
-  box-sizing: border-box;
-  display: flex;
-  // layout="row"
-  flex-direction: row;
-}
-.td-steps-header-container {
-  display: flex;
-  flex-grow: 1;
-  overflow: hidden;
-  z-index: 1;
-}
-
-.td-steps-header-list {
-  flex-grow: 1;
-  position: relative;
-  transition: transform 500ms cubic-bezier(0.35, 0, 0.25, 1);
-  align-items: center;
-  align-content: center;
-  max-width: 100%;
-  justify-content: flex-start;
-}
-
-.td-step-header-pagination {
-  position: relative;
-  display: none;
-  justify-content: center;
-  align-items: center;
-  min-width: 32px;
-  cursor: pointer;
-  z-index: 2;
-}
-
-:host.td-step-header-pagination-controls-enabled .td-step-header-pagination {
-  display: flex;
-}
-
-// The pagination control that is displayed on the left side of the tab header.
-.td-step-header-pagination-before,
-:host.td-step-header-rtl .td-step-header-pagination-after {
-  padding-left: 4px;
-  .td-step-header-pagination-chevron {
-    transform: rotate(-135deg);
-  }
-}
-
-// The pagination control that is displayed on the right side of the tab header.
-:host.td-step-header-rtl .td-step-header-pagination-before,
-.td-step-header-pagination-after {
-  padding-right: 4px;
-  .td-step-header-pagination-chevron {
-    transform: rotate(45deg);
-  }
-}
-
-.td-step-header-pagination-chevron {
-  border-style: solid;
-  border-width: 2px 2px 0 0;
-  content: '';
-  height: 8px;
-  width: 8px;
-}
-
-.td-step-header-pagination-disabled {
-  box-shadow: none;
-  cursor: default;
-}
-
-.td-horizontal-line {
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
-  height: 1px;
-  min-width: 20px;
-  // flex
-  flex: 1;
-  box-sizing: border-box;
-}

package/steps/nav/nav-steps-vertical/nav-steps-vertical.component.d.ts

@@ -1,18 +0,0 @@
-import { QueryList, OnDestroy, AfterContentInit, Renderer2, ChangeDetectorRef, ElementRef } from '@angular/core';
-import { TdNavStepLinkComponent } from '../nav-step-link/nav-step-link.component';
-export declare class TdNavStepsVerticalComponent implements AfterContentInit, OnDestroy {
-    private _renderer;
-    private _changeDetectorRef;
-    private _separators;
-    /** Emits when the component is destroyed. */
-    private readonly _destroyed;
-    _steps: QueryList<TdNavStepLinkComponent>;
-    _stepList: ElementRef;
-    constructor(_renderer: Renderer2, _changeDetectorRef: ChangeDetectorRef);
-    ngAfterContentInit(): void;
-    ngOnDestroy(): void;
-    /**
-     * Set the step line separators and display numbers
-     */
-    private _configureSteps;
-}

package/steps/nav/nav-steps-vertical/nav-steps-vertical.component.scss

@@ -1,18 +0,0 @@
-.td-vertical-line-wrapper {
-  position: relative;
-  .td-vertical-line {
-    position: absolute;
-    top: -16px;
-    height: 34px;
-    border-left-width: 1px;
-    border-left-style: solid;
-    ::ng-deep :not([dir='rtl']) & {
-      left: 20px;
-      right: auto;
-    }
-    ::ng-deep [dir='rtl'] & {
-      left: auto;
-      right: 20px;
-    }
-  }
-}

package/steps/package.json

@@ -1,11 +0,0 @@
-{
-  "main": "../bundles/covalent-core-steps.umd.js",
-  "module": "../fesm2015/covalent-core-steps.js",
-  "es2015": "../fesm2015/covalent-core-steps.js",
-  "esm2015": "../esm2015/steps/covalent-core-steps.js",
-  "fesm2015": "../fesm2015/covalent-core-steps.js",
-  "typings": "covalent-core-steps.d.ts",
-  "metadata": "covalent-core-steps.metadata.json",
-  "sideEffects": false,
-  "name": "@covalent/core/steps"
-}

package/steps/public-api.d.ts

@@ -1,8 +0,0 @@
-export * from './steps.module';
-export * from './step.component';
-export * from './steps.component';
-export * from './step-body/step-body.component';
-export * from './step-header/step-header.component';
-export * from './nav/nav-step-link/nav-step-link.component';
-export * from './nav/nav-steps-horizontal/nav-steps-horizontal.component';
-export * from './nav/nav-steps-vertical/nav-steps-vertical.component';

package/steps/step-body/step-body.component.d.ts

@@ -1,25 +0,0 @@
-import { ElementRef } from '@angular/core';
-import { StepState } from '../step.component';
-export declare class TdStepBodyComponent {
-    contentRef: ElementRef;
-    get hasContent(): boolean;
-    actionsRef: ElementRef;
-    get hasActions(): boolean;
-    summaryRef: ElementRef;
-    get hasSummary(): boolean;
-    /**
-     * active?: boolean
-     * Sets for active/inactive states on body.
-     */
-    active: boolean;
-    /**
-     * state?: StepState or ['none' | 'required' | 'complete']
-     * Sets styles for state of body.
-     * Defaults to [StepState.None | 'none'].
-     */
-    state: StepState;
-    /**
-     * Returns 'true' if [state] equals to [StepState.Complete | 'complete'], else 'false'.
-     */
-    isComplete(): boolean;
-}

package/steps/step-body/step-body.component.scss

@@ -1,29 +0,0 @@
-:host {
-  // layout
-  box-sizing: border-box;
-  display: flex;
-  // layout="row"
-  flex-direction: row;
-  .td-step-body {
-    overflow-x: hidden;
-    // flex
-    flex: 1;
-    box-sizing: border-box;
-    .td-step-summary,
-    .td-step-content-wrapper {
-      &.ng-animating {
-        overflow: hidden;
-      }
-    }
-    .td-step-content {
-      overflow-x: auto;
-    }
-    .td-step-actions {
-      // layout
-      box-sizing: border-box;
-      display: flex;
-      // layout="row"
-      flex-direction: row;
-    }
-  }
-}

package/steps/step-header/step-header.component.d.ts

@@ -1,35 +0,0 @@
-import { ICanDisable, ICanDisableRipple } from '@covalent/core/common';
-import { StepState } from '../step.component';
-export declare class TdStepHeaderBase {
-}
-export declare const _TdStepHeaderMixinBase: (new (...args: any[]) => ICanDisableRipple) & (new (...args: any[]) => ICanDisable) & typeof TdStepHeaderBase;
-export declare class TdStepHeaderComponent extends _TdStepHeaderMixinBase implements ICanDisable, ICanDisableRipple {
-    /**
-     * Number assigned to [TdStepHeaderComponent].
-     */
-    number: number;
-    /**
-     * active?: boolean
-     * Sets for active/inactive states on header.
-     */
-    active: boolean;
-    /**
-     * state?: StepState or ['none' | 'required' | 'complete']
-     * Sets styles for state of header.
-     * Defaults to [StepState.None | 'none'].
-     */
-    state: StepState;
-    /**
-     * tabIndex?: number
-     * tabIndex of the step header for a11y
-     */
-    tabIndex: number;
-    /**
-     * Returns 'true' if [state] equals to [StepState.Complete | 'complete'], else 'false'.
-     */
-    isComplete(): boolean;
-    /**
-     * Returns 'true' if [state] equals to [StepState.Required | 'required'], else 'false'.
-     */
-    isRequired(): boolean;
-}

package/steps/step-header/step-header.component.scss

@@ -1,90 +0,0 @@
-$step-circle: 24px;
-
-.td-step-header {
-  position: relative;
-  outline: none;
-  min-width: 120px;
-  height: 72px;
-  // layout row
-  flex-direction: row;
-  // layout
-  box-sizing: border-box;
-  display: flex;
-  // flex
-  flex: 1;
-  // layout-align start
-  justify-content: flex-start;
-  // layout-align start center
-  align-items: center;
-  align-content: center;
-  max-width: 100%;
-  &:hover:not(.mat-disabled) {
-    cursor: pointer;
-  }
-  mat-icon.td-edit-icon {
-    margin: 0 8px;
-  }
-  mat-icon {
-    &.mat-warn {
-      font-size: $step-circle;
-      height: $step-circle;
-      width: $step-circle;
-    }
-    &.mat-complete {
-      position: relative;
-      left: -2px;
-      top: 2px;
-      font-size: $step-circle + 4;
-      height: $step-circle;
-      width: $step-circle;
-    }
-  }
-  .td-circle {
-    height: $step-circle;
-    width: $step-circle;
-    line-height: $step-circle;
-    border-radius: 99%;
-    text-align: center;
-    flex: none;
-    & mat-icon {
-      margin-top: 2px;
-      font-weight: bold;
-    }
-  }
-  .td-triangle {
-    & > mat-icon {
-      font-size: 25px;
-    }
-  }
-  .td-complete {
-    font-size: 0;
-  }
-  .td-circle,
-  .td-triangle,
-  .td-complete {
-    ::ng-deep :not([dir='rtl']) & {
-      margin: {
-        left: 8px;
-        right: 0;
-      }
-    }
-    ::ng-deep [dir='rtl'] & {
-      margin: {
-        left: 0;
-        right: 8px;
-      }
-    }
-  }
-  .td-circle,
-  .td-complete {
-    font-size: 14px;
-  }
-  .td-step-label-wrapper {
-    padding-left: 8px;
-    padding-right: 8px;
-  }
-  .td-step-header-separator {
-    flex: 1;
-    box-sizing: border-box;
-  }
-}

package/steps/step.component.d.ts

@@ -1,97 +0,0 @@
-import { TemplateRef, ViewContainerRef, OnInit } from '@angular/core';
-import { EventEmitter } from '@angular/core';
-import { TemplatePortalDirective, TemplatePortal } from '@angular/cdk/portal';
-import { ICanDisable, ICanDisableRipple } from '@covalent/core/common';
-export declare enum StepState {
-    None = "none",
-    Required = "required",
-    Complete = "complete"
-}
-export declare class TdStepLabelDirective extends TemplatePortalDirective {
-    constructor(templateRef: TemplateRef<any>, viewContainerRef: ViewContainerRef);
-}
-export declare class TdStepActionsDirective extends TemplatePortalDirective {
-    constructor(templateRef: TemplateRef<any>, viewContainerRef: ViewContainerRef);
-}
-export declare class TdStepSummaryDirective extends TemplatePortalDirective {
-    constructor(templateRef: TemplateRef<any>, viewContainerRef: ViewContainerRef);
-}
-export declare class TdStepBase {
-}
-export declare const _TdStepMixinBase: (new (...args: any[]) => ICanDisableRipple) & (new (...args: any[]) => ICanDisable) & typeof TdStepBase;
-export declare class TdStepComponent extends _TdStepMixinBase implements OnInit, ICanDisable, ICanDisableRipple {
-    private _viewContainerRef;
-    private _active;
-    private _state;
-    private _contentPortal;
-    get stepContent(): TemplatePortal<any>;
-    _content: TemplateRef<any>;
-    stepLabel: TdStepLabelDirective;
-    stepActions: TdStepActionsDirective;
-    stepSummary: TdStepSummaryDirective;
-    /**
-     * label?: string
-     * Sets label of [TdStepComponent] header.
-     * Defaults to 'Step #'
-     */
-    label: string;
-    /**
-     * sublabel?: string
-     * Sets sublabel of [TdStepComponent] header.
-     */
-    sublabel: string;
-    /**
-     * active?: boolean
-     * Toggles [TdStepComponent] between active/deactive.
-     */
-    set active(active: boolean);
-    get active(): boolean;
-    /**
-     * state?: StepState or ['none' | 'required' | 'complete']
-     * Sets state of [TdStepComponent] depending on value.
-     * Defaults to [StepState.None | 'none'].
-     */
-    set state(state: StepState);
-    get state(): StepState;
-    /**
-     * activated?: function
-     * Event emitted when [TdStepComponent] is activated.
-     */
-    activated: EventEmitter<void>;
-    /**
-     * deactivated?: function
-     * Event emitted when [TdStepComponent] is deactivated.
-     */
-    deactivated: EventEmitter<void>;
-    constructor(_viewContainerRef: ViewContainerRef);
-    ngOnInit(): void;
-    /**
-     * Toggle active state of [TdStepComponent]
-     * retuns 'true' if successful, else 'false'.
-     */
-    toggle(): boolean;
-    /**
-     * Opens [TdStepComponent]
-     * retuns 'true' if successful, else 'false'.
-     */
-    open(): boolean;
-    /**
-     * Closes [TdStepComponent]
-     * retuns 'true' if successful, else 'false'.
-     */
-    close(): boolean;
-    /**
-     * Returns 'true' if [state] equals to [StepState.Complete | 'complete'], else 'false'.
-     */
-    isComplete(): boolean;
-    /** Method executed when the disabled value changes */
-    onDisabledChange(v: boolean): void;
-    /**
-     * Method to change active state internally and emit the [activated] event if 'true' or [deactivated]
-     * event if 'false'. (Blocked if [disabled] is 'true')
-     * returns true if successfully changed state
-     */
-    private _setActive;
-    private _onActivated;
-    private _onDeactivated;
-}

package/steps/steps.component.d.ts

@@ -1,60 +0,0 @@
-import { OnDestroy, AfterContentInit } from '@angular/core';
-import { EventEmitter, QueryList } from '@angular/core';
-import { TdStepComponent } from './step.component';
-export interface IStepChangeEvent {
-    newStep: TdStepComponent;
-    prevStep: TdStepComponent;
-}
-export declare enum StepMode {
-    Vertical = "vertical",
-    Horizontal = "horizontal"
-}
-export declare class TdStepsComponent implements OnDestroy, AfterContentInit {
-    private _subcriptions;
-    private _mode;
-    private _steps;
-    set stepsContent(steps: QueryList<TdStepComponent>);
-    get steps(): TdStepComponent[];
-    prevStep: TdStepComponent;
-    /**
-     * mode?: StepMode or ["vertical" | "horizontal"]
-     * Defines if the mode of the [TdStepsComponent].  Defaults to [StepMode.Vertical | "vertical"]
-     */
-    set mode(mode: StepMode);
-    get mode(): StepMode;
-    /**
-     * stepChange?: function
-     * Method to be executed when [stepChange] event is emitted.
-     * Emits an [IStepChangeEvent] implemented object.
-     */
-    stepChange: EventEmitter<IStepChangeEvent>;
-    /**
-     * Executed after content is initialized, loops through any [TdStepComponent] children elements,
-     * assigns them a number and subscribes as an observer to their [activated] event.
-     */
-    ngAfterContentInit(): void;
-    /**
-     * Unsubscribes from [TdStepComponent] children elements when component is destroyed.
-     */
-    ngOnDestroy(): void;
-    /**
-     * Returns 'true' if [mode] equals to [StepMode.Horizontal | 'horizontal'], else 'false'.
-     */
-    isHorizontal(): boolean;
-    /**
-     * Returns 'true' if [mode] equals to [StepMode.Vertical | 'vertical'], else 'false'.
-     */
-    isVertical(): boolean;
-    areStepsActive(): boolean;
-    /**
-     * Wraps previous and new [TdStepComponent] numbers in an object that implements [IStepChangeEvent]
-     * and emits [stepChange] event.
-     */
-    private _onStepSelection;
-    /**
-     * Loops through [TdStepComponent] children elements and deactivates them ignoring the one passed as an argument.
-     */
-    private _deactivateAllBut;
-    private _registerSteps;
-    private _deregisterSteps;
-}

package/steps/steps.component.scss

@@ -1,55 +0,0 @@
-.td-line-wrapper,
-.td-step {
-  position: relative;
-}
-
-.td-steps-header {
-  // layout
-  box-sizing: border-box;
-  display: flex;
-  // layout="row"
-  flex-direction: row;
-}
-
-.td-line-wrapper {
-  width: 24px;
-  min-height: 1px;
-}
-
-.td-horizontal-line {
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
-  height: 1px;
-  position: relative;
-  top: 36px;
-  ::ng-deep :not([dir='rtl']) & {
-    left: -6px;
-    right: -3px;
-  }
-  ::ng-deep [dir='rtl'] & {
-    left: -3px;
-    right: -6px;
-  }
-
-  min-width: 15px;
-  // flex
-  flex: 1;
-  box-sizing: border-box;
-}
-
-.td-vertical-line {
-  position: absolute;
-  ::ng-deep :not([dir='rtl']) & {
-    left: 20px;
-    right: auto;
-  }
-  ::ng-deep [dir='rtl'] & {
-    left: auto;
-    right: 20px;
-  }
-
-  bottom: -16px;
-  top: -16px;
-  border-left-width: 1px;
-  border-left-style: solid;
-}

package/steps/steps.module.d.ts

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