Skip to content

Latest commit

 

History

History
1411 lines (1135 loc) · 109 KB

CHANGELOG.md

File metadata and controls

1411 lines (1135 loc) · 109 KB

1.0.0-beta.5-1 (2017-06-12)

Small patch release to address a loading component issue and documentation updates with angular@4.2.0 change detection since creating components or changing inputs on component life hooks cycles need to explicitly call a change detection cycle by developers.

Bug Fixes

Internal

1.0.0-beta.5 Blackhole Sun (2017-06-09)

Breaking Change

td-chips

Now that chips have async support and we've abstracted the internal filtering mechanism, the developer needs to provide their own filter.

This will also allow the developer to create custom filters both locally and server-side.

e.g.

<td-chips [items]="filteredStrings"
          [(ngModel)]="stringsModel"
          placeholder="Enter autocomplete strings"
          (inputChange)="filterStrings($event)"
          requireMatch>
</td-chips>
strings: string[] = [
  'stepper',
  'expansion-panel',
  'markdown',
  'highlight',
  'loading',
  'media',
  'chips',
  'http',
  'json-formatter',
  'pipes',
  'need more?',
];

filteredStrings: string[];

stringsModel: string[] = this.strings.slice(0, 6);

ngOnInit(): void {
  this.filterStrings('');
}

filterStrings(value: string): void {
  if (value) {
    this.filteredStrings = this.strings.filter((item: any) => {
      return item.toLowerCase().indexOf(value.toLowerCase()) > -1;
    }).filter((filteredItem: any) => {
      return this.stringsModel ? this.stringsModel.indexOf(filteredItem) < 0 : true;
    });
  }
}

td-expansion-panel

With the introduction of td-expansion-panel-group, the td-expansion-panel expanded margin animation will not be applied unless the td-expansion-panel is grouped inside of a td-expansion-panel-group.

e.g.

<!-- not applied -->
<td-expansion-panel></td-expansion-panel>

<!-- applied -->
<td-expansion-panel-group>
  <td-expansion-panel></td-expansion-panel>
  <td-expansion-panel></td-expansion-panel>
  <td-expansion-panel></td-expansion-panel>
</td-expansion-panel-group>

Bug Fixes

Features

Performance

Internal

1.0.0-beta.4 Johnny B Goode (2017-05-16)

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

1.0.0-beta.3 Electric Relaxation (2017-04-05)

Breaking Change

Bug Fixes

Features

Refactor

Internal

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

Bug Fixes

Internal

1.0.0-beta.2 Hotel California (2017-02-23)

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.

1.0.0-beta.1 Purple Rain (2017-01-30)

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

0.10.0 Bedlington Cummerbund (2016-12-30)

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

0.9.0 Pallettown Cummerbund (2016-11-21)

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

0.7.0 Beetlejuice Charizard (2016-09-14)

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>

0.6.0 Butterfree Cumbersome (2016-08-19)

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>