Skip to content

Latest commit

 

History

History
1272 lines (1028 loc) · 97.9 KB

CHANGELOG.md

File metadata and controls

1272 lines (1028 loc) · 97.9 KB

Breaking Change

This was announced as deprecated in beta.3, so now you only need to import the module and it will work the same way.

e.g.

import: [
  CovalentStepsModule // instead of CovalentStepsModule.forRoot()
]

This was announced as deprecated in beta.3 to make developer import only what they need to reduce bundle size.

Since CovalentCoreModule has been removed, there is really no use for @angular/flex-layout inernally. we will leave it to the developer to include it on demand.

To not force npm install to get a specific material version, @angular/material was moved as peerDependency. This means you will need to add it into your package.json explicitly.

These selectors were deprecated a few releases back so it should be ok to remove them now. See #535 for more information.

Bug Fixes

Features

Internal

1.0.0-beta.3-1 (2017-04-10)

External Breaking Changes

  • theming: update theming to point to the correct path

    Before:

      @import '~@angular/material/core/theming/all-theme';

    After:

      @import '~@angular/material/theming';

Breaking Changes

Bug Fixes

Features

Performance

Breaking Change

Bug Fixes

Features

Refactor

Internal

1.0.0-beta.2-1 (2017-02-27)

Bug Fixes

Internal

Breaking Change

  • material: breaking changes from @material.

  • file-upload: add way to set its labels for easier i18n usage (c91d3cdd61358a1af2ad459cd67f56d62070c3c7), closes #286

    Usage:

    <td-file-upload #singleFileUpload (upload)="uploadEvent($event)" [disabled]="disabled">
      <md-icon>file_upload</md-icon><span>{{ singleFileUpload.files?.name }}</span>
      <template td-file-input-label>
        <md-icon>attach_file</md-icon><span>Choose a file...</span>
      </template>
    </td-file-upload>
  • paging-bar: add way to set its labels for easier i18n usage. (e454b985fdbbaed6dce2040830177f47118a5be3) closes #356 and 214

    Usage:

    <td-paging-bar #pagingBar pageSizeAllText="All" [pageSizeAll]="true">
      <span td-paging-bar-label hide-xs>Row per page:</span>
      {{pagingBar.range}} <span hide-xs>of {{pagingBar.total}}</span>
    </td-paging-bar>

Bug Fixes

Features

Refactor

Internal

1.0.0-beta.1-1 (2017-01-31)

Bug Fixes

  • loading: Fixed edge case that tried to create the same tdLoading twice a component that uses [routerLinkActive] when navigating into it.

Breaking Changes

td-layout

Before (deprecated):

<td-layout>
  <md-nav-list menu-items></md-nav-list>
  // content
</td-layout>

After:

<td-layout>
  <md-nav-list td-sidenav-content></md-nav-list>
  // content
</td-layout>

td-layout-nav

Before (deprecated):

<td-layout-nav>
  <div toolbar-content></div>
  // content
</td-layout-nav>

After:

<td-layout-nav>
  <div td-toolbar-content></div>
  // content
</td-layout-nav>

td-layout-card-over

Before (deprecated):

<td-layout-card-over>
  // content
  <div after-card></div>
</td-layout-card-over>

After:

<td-layout-card-over>
  // content
  <div td-after-card></div>
</td-layout-card-over>

td-layout-nav-list

Before (deprecated):

<td-layout-nav-list>
  <div list-toolbar-content></div>
  <md-nav-list list-items></md-nav-list>
  <div nav-toolbar-content></div>
  // content
</td-layout-nav-list>

After:

<td-layout-nav-list>
  <div td-sidenav-toolbar-content></div>
  <md-nav-list td-sidenav-content></md-nav-list>
  <div td-toolbar-content></div>
  // content
</td-layout-nav-list>

td-layout-manage-list

Before (deprecated):

<td-layout-manage-list>
  <md-toolbar list-items></md-toolbar>
  <md-nav-list list-items></md-nav-list>
  <div toolbar-buttons></div>
  // content
</td-layout-manage-list>

After:

<td-layout-manage-list>
  <md-toolbar td-sidenav-content></md-toolbar>
  <md-nav-list td-sidenav-content></md-nav-list>
  <div td-toolbar-content></div>
  // content
</td-layout-manage-list>

Bug Fixes

Features

Usage:

<td-layout>
  <td-navigation-drawer sidenavTitle="title" logo="logoName" name="User Name" email="user@email.com" backgroundUrl="safeUrl/to/background" color="none">
     Main Content
    <div td-navigation-drawer-menu>
      Menu Content
    </div>
  </td-navigation-drawer>
  .. rest of the app
</td-layout>

Usage:

<td-layout-manage-list #manageList
                        [opened]="media.registerQuery('gt-sm') | async"
                        [mode]="(media.registerQuery('gt-sm') | async) ? 'side' : 'push'"
                        [sidenavWidth]="(media.registerQuery('gt-xs') | async) ? '257px' : '100%'">
  <md-nav-list td-sidenav-content (click)="!media.query('gt-sm') && manageList.close()">
<td-layout-nav-list #navList
                    logo="assets:teradata"
                    toolbarTitle="Covalent"
                    [opened]="media.registerQuery('gt-sm') | async"
                    [mode]="(media.registerQuery('gt-sm') | async) ? 'side' : 'push'"
                    [sidenavWidth]="(media.registerQuery('gt-xs') | async) ? '350px' : '100%'">
  <md-nav-list td-sidenav-content (click)="!media.query('gt-sm') && navList.close()">
constructor(public media: TdMediaService) {}

ngAfterViewInit(): void {
  // broadcast to all listener observables when loading the page
  this.media.broadcast();
}

Internal

0.10.2 (2017-1-3)

Bug Fixes

  • http: interceptors instead of inteceptors typo in HttpConfig. closes #233

0.10.1 (2017-1-2)

Bug Fixes

Breaking Changes

  • deploy: Single core package. (81901b23eca8e02330260b5831c64da3005a39fd), closes #166 and #93

    • Created submodules of all core modules which are wrapped by one parent module CovalentCoreModule (@covalent/core)

      • CovalentCommonModule
      • CovalentChipsModule
      • CovalentDataTableModule
      • CovalentDialogsModule
      • CovalentExpansionPanelModule
      • CovalentFileModule
      • CovalentJsonFormatterModule
      • CovalentLayoutModule
      • CovalentLoadingModule
      • CovalentMediaModule
      • CovalentMenuModule
      • CovalentNofiticationsModule
      • CovalentPagingModule
      • CovalentSearchModule
      • CovalentStepsModule
    • Stand alone modules:

      • CovalentHttpModule (@covalent/http)
      • CovalentDynamicFormsModule (@covalent/dynamic-forms)
      • CovalentHighlightModule (@covalent/highlight)
      • CovalentMarkdownModule (@covalent/markdown)
    • markdown is a separate module and its theme needs to be imported separatly @import ~@covalent/markdown/markdown-theme' and included @include covalent-markdown-theme($theme);

    • highlight is a separate module and its theme needs to be imported separatly @import ~@covalent/highlight/highlight-theme' and included @include covalent-highlight-theme();

    • all-theme and platform.css changed directories.

      Before:

      `~@covalent/core/styles/platform.css`
      `~@covalent/core/styles/theming/all-theme';`

      After:

      `@covalent/core/common/platform.css`
      `~@covalent/core/theming/all-theme';`
  • http: Path interceptors configuration. (7db377e62254f6add6995065f09f4b5528bd0c16), closes #194

    Before:

    CovalentHttpModule.forRoot([Interceptor1, Interceptor2]),

    After:

    const httpInterceptorProviders: Type<IHttpInterceptor>[] = [
      Interceptor1,
      Interceptor2,
      ...
    ];
    ...
    imports: [
      CovalentHttpModule.forRoot({
        interceptors: [{
          interceptor: Interceptor1, paths: ['**'],
        }, {
          interceptor: Interceptor2, paths: ['**'],
        }],
      }),
      ...
    ],
    providers: [
      httpInterceptorProviders,
      ...
    ],
  • steps: (stepChange) event now returns the step objects instead of the step number. (6486eb527ae845224a170b8c7dda2dc92a089c3a)

    Before:

    export interface IStepChangeEvent {
      newStep: number;
      prevStep: number;
    }

    After:

    export interface IStepChangeEvent {
      newStep: TdStepComponent;
      prevStep: TdStepComponent;
    }
  • layouts: logo expects an svgIcon value now from an MdIconRegistry svg. (breaking change from @angular/material). (6cd31f063ae5a1fd0e31378c1bbf6c466a7d3c15)

    Before:

    <td-layout logo="/assets/route/to/icon1.svg">

    After (once at any toplevel component):

    import { DomSanitizer } from '@angular/platform-browser';
    import { MdIconRegistry } from '@angular/material';
    ...
    ...
    constructor(iconRegistry: MdIconRegistry, domSanitizer: DomSanitizer) {
      iconRegistry.addSvgIconInNamespace('assets', 'icon1', domSanitizer.bypassSecurityTrustResourceUrl('/assets/route/to/icon1.svg'));
    }
    <td-layout logo="assets:icon1">
  • charts (deprecated): CovalentChartModule is being deprecated in favor of ngx-charts @swimlane/ngx-charts.

Bug Fixes

Features

Internal

Code Health

Breaking Changes

Before (deprecated):

<td-layout title="Covalent">
<td-layout-nav-list title="Covalent">
<td-layout-nav title="Covalent">
<td-layout-card-over title="Title" subtitle="Subtitle">

After:

<td-layout sidenavTitle="Title">
<td-layout-nav-list toolbarTitle="Title">
<td-layout-nav toolbarTitle="Title">
<td-layout-card-over cardTitle="Title" cardSubtitle="Subtitle">

Example:

@import '~@angular/material/core/theming/all-theme';
@import '~@covalent/core/styles/theming/all-theme';

@include md-core();

$primary: md-palette($md-orange, 800);
$accent:  md-palette($md-light-blue, 600, A100, A400);

$warn:    md-palette($md-red);

$theme: md-light-theme($primary, $accent, $warn);

@include angular-material-theme($theme);
@include covalent-theme($theme);

Before:

<td-data-table
  [data]="data"
  [columns]="columns"
  sortBy="age"
  title="title"
  sortOrder="DESC"
  pagination="true"
  pageSize="5"
  sorting="true"
  search="true"
  rowSelection="true"
  multiple="true"
  search="true">
</td-data-table>

After:

<td-data-table
  [data]="filteredData"
  [columns]="columns"
  [selectable]="selectable"
  [multiple]="multiple"
  [sortable]="true"
  [sortBy]="sortBy"
  [(ngModel)]="selectedRows"
  [sortOrder]="sortOrder"
  (sortChange)="sort($event)">
</td-data-table>

Before:

<td-step>
  <template td-step-content>
    ... add content that will be shown when the step is "active"
  </template>
</td-step>

After:

<td-step>
  ... add content that will be shown when the step is "active"
</td-step>

Bug Fixes

Features

Usage:

<table td-data-table>
  <th td-data-table-column
        [name]="colName"
        [numeric]="numeric"
        [active]="true|false"
        [sortable]="true|false"
        [sortOrder]="colName"
        (sortChange)="handleSort($event)">
    ...
  </th>
  <tr td-data-table-row>
    <td td-data-table-cell
        [numeric]="column.numeric">
      ...
    </td>
  </tr>
</table>

Usage:

 <td-data-table
  [data]="{'type': 'test'}"
  [columns]="['type']">
  <template tdDataTableTemplate="type" let-value="value" let-row="row" let-column="column">
    ...
  </template>
</td-data-table>

Usage:

<td-expansion-panel label="label" sublabel="sublabel">
  <template td-expansion-panel-header>
    ... add header content (overrides label and sublabel)
  </template>
  <template td-expansion-panel-label>
    ... add label content (if not used, falls back to [label] input)
  </template>
  <template td-expansion-panel-sublabel>
    ... add sublabel content (if not used, falls back to [sublabel] input)
  </template>
  ...
</td-expansion-panel>
  • steps: Support for label template template[td-step-label] as an alternative while keeping the easy API [label] input for normal (simple) use cases in td-step (5d87249e9a13561ff2bb14fd3ebf41393f902230)

Usage:

<td-step label="Label">
  <template td-step-label>
    ... add label content (if not used, falls back to [label] input)
  </template>
  ... add content that will be shown when the step is "active"
</td-step>  

Internal

0.8.0 Pixel Raichu (2016-10-14)

Breaking Changes

theme.scss content:

@import '~@angular/material/core/theming/all-theme';
// Plus imports for other components in your app.

// Include the base styles for Angular Material core. We include this here so that you only
// have to load a single css file for Angular Material in your app.
@include md-core();

// Define the palettes for your theme using the Material Design palettes available in palette.scss
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
// hue.
$primary: md-palette($md-orange, 800);
$accent:  md-palette($md-light-blue, 600, A100, A400);

// The warn palette is optional (defaults to red).
$warn:    md-palette($md-red, 600);

// Create the theme object (a Sass map containing all of the palettes).
$theme: md-light-theme($primary, $accent, $warn);

// Include theme styles for core and each component used in your app.
// Alternatively, you can import and @include the theme mixins for each component
// that you are using.
@include angular-material-theme($theme);

Before:

<td-step-summary>
  // summary here
</td-step-summary>

<td-step-actions>
  // actions here
</td-step-actions>

After:

<template td-step-summary>
  // summary here
</template >

<template td-step-actions>
  // actions here
</template >

Before:

<td-step>
  // content here
</td-step>

After:

<td-step>
  <template td-step-content>
    // content here
  </template >
</td-step>

Bug Fixes

Features

Internal

Bug Fixes

Code Refactoring

Features

Internal

Breaking Changes

  • release: Upgraded to RC7. (78f813c412ea42124e399edd7960b58d56139768), closes #36

  • release: Upgrade material to alpha.8-1. (6104b554376bb70d013e80d7b39d78a04dc4aa62)

  • release: Updated rxjs to 5.0.0-beta.12 (@angular dependency). (78f813c412ea42124e399edd7960b58d56139768)

  • release: Updated zone.js to 0.6.21 (@angular dependency). (78f813c412ea42124e399edd7960b58d56139768)

  • release: Added hammerjs dependency (@angular2-material dependency). (6104b554376bb70d013e80d7b39d78a04dc4aa62)

  • release: Removed bootstrap and implemented everything with NgModule decorator. (6104b554376bb70d013e80d7b39d78a04dc4aa62)

  • loading: Removed tdLoadingDirective class from API. (2bbe223982df4deb2d3eca15cad9b4a230f66713)

  • highlight: Removed static lib file and added npm dependency for highlight.js (see docs for more info on how to setup). (e555bc438ab898c48a24f507204205db95c4dcbc)

  • all: Covalent now depends on TypeScript 2.0.

  • all: Updated packaging to match angular/angular2-material's packaging creating a [module].umd.js file per module.

    Example SystemJS config with UMD bundles:

    '@covalent/core': {
        format: 'cjs',
        main: 'core.umd.js'
      }
  • all: Covalent modules must be included with forRoot() when bootstrapping. See the ngModules guide for more information.

    @NgModule({
        imports: [
            CovalentCoreModule.forRoot(),
            CovalentHttpModule.forRoot()
        ]
    ...
    });
  • http: Use CovalentHttpModule.forRoot() to register interceptors. (provideInterceptors() is deprecated and removed) (91050c51fa32b6e57d711199997829d0f4fc4c62), closes #58

    Before:

      bootstrap(AppComponent,[
        provideInterceptors([ CustomInterceptor ]),
        ...
      ])

    After:

      imports: [
        CovalentHttpModule.forRoot([ CustomInterceptor ]),
        ...
      ]
  • layouts: Changed placeholders to accept attributes since angular2 complains if the element doesnt exist, and turned md-content into a class since angular2-material never intended for it to be a component. (ab67c403d0aad3022e2e0112dfd62a89295c4f4b)

    Before(elements):

      <toolbar-content>
        ...
      </toolbar-content>
    
      <list-toolbar-content>
        ...
      </list-toolbar-content>
    
      <toolbar-buttons>
        ...
      </toolbar-buttons>
    
      <nav-toolbar-content>
        ...
      </nav-toolbar-content>
    
      <md-content>
        ...
      </md-content>

    After(attributes):

      <div toolbar-content>
        ...
      </div>
    
      <div list-toolbar-content>
        ...
      </div>
    
      <div toolbar-buttons>
        ...
      </div>
    
      <div nav-toolbar-content>
        ...
      </div>
    
      <div class="md-content">
        ...
      </div>  

Bug Fixes

Code Refactoring

Features

Internal

Breaking Changes

  • loading: There is a need to add TD_LOADING_ENTRY_COMPONENTS in the precompile array of your main component, so the TdLoadingComponent can be resolved by the ComponentFactoryResolver.

    e.g.

    import { TD_LOADING_ENTRY_COMPONENTS } from '@covalent/core';
    ...
      precompile: [ TD_LOADING_ENTRY_COMPONENTS ],
    })
    export class YourMainComponent {}
  • td-layout: <menu-items> will need to change to <md-nav-list menu-items>

    Before:

    <td-layout>
      <menu-items>
        ...
      </menu-items>
    </td-layout>

    After:

    <td-layout>
      <md-nav-list menu-items>
        ...
      </md-nav-list>
    </td-layout>
  • td-layout-nav-list: <list-items> will need to change to <md-nav-list list-items>

    Before:

    <td-layout-nav-list>
      <list-items>
        ...
      </list-items>
    </td-layout-nav-list>

    After:

    <td-layout-nav-list>
      <md-nav-list list-items>
        ...
      </md-nav-list>
    </td-layout-nav-list>
  • td-layout-manage-list: <list-items> will need to change to <md-nav-list list-items>

    Before:

    <td-layout-manage-list>
      <list-items>
        ...
      </list-items>
    </td-layout-manage-list>

    After:

    <td-layout-manage-list>
      <md-nav-list list-items>
        ...
      </md-nav-list>
    </td-layout-manage-list>