@nebular/theme

@nebular/theme module, more details https://akveo.github.io/nebular/

Changelog

2.0.0 (2018-10-02)

Highlights

Nebular 2.0 is stable now! After 10 release candidates and a year of work we finally made it with a great help of Nebular community and we cannot be more grateful for all of your contributions! :tada:

Bug Fixes

• auth: fix OAuth2 strategy grant_type password to send username, not email (#659) (3a708dd), closes #653
• auth: fix isAuthenticatedOrRefresh to not refresh token with no value (#708) (b29418f)
• button: fix outline button (0bcad95)
• calendar: use nbButton in calendar navigation (#837) (f460f85), closes #827
• checkbox, radio: check mark positioning in IE (#830) (ac52315), closes #743
• docs:  fix warning Invalid value for $grid-breakpoints.. (#736) (23e7804)
• docs: add radio icon (#748) (9110266)
• docs: fix mention of angular-cli.json file to angular.json (#701) (3211c54)
• e2e: add redundance note in protractor.conf.ci.js (#839) (a7ed638)
• infinite-list: fix example file path (60d0d1e)
• login: take into account remember me setting (#644) (d35b65b), closes #330
• menu: height calculation (#621) (7542d5e), closes #620 #369 #532 #307 #444 #392 akveo/ngx-admin#1703 akveo/ngx-admin#1819
• modal: rtl modal header (#632) (0370abe), closes #419
• overlay: z-index (#735) (9c22a52)
• popover: fix popover component example (#711) (9980664), closes #618 #619
• radio: radio group ngModel doesn't setup initial value (#842) (92b6f6b)
• radio: radio group now has bigger priority when setting value and disabled (#841) (99acd25)
• scripts: add moment and date-fns bundles (#818) (c78ae5f)
• tabset: removes bold emphasize for hovered tab (#651) (22e39eb), closes #540
• theme: add nebular-icons as peer dependency (#749) (3e3fe1d), closes #195
• theme: use existing variable for bootstrap (#807) (e91f557), closes #739

Code Refactoring

• auth: rejects malformed tokens (#597) (127b5d2), closes #517
• menu: emit itemClick event after clicking on item with link (#728) (94342e0), closes #423
• menu: replace item click ReplaySubject with plain Subject (#724) (eb6e74b), closes #695
• theme: refactor popover, context-menu and search components to use overlays (#684) (d3ba6ab), closes #683 #664 #668
• theme: remove angular2-toaster styling (#721) (026974e)
• theme: separate bootstrap styles into @nebular/bootstrap (#707) (a25f615), closes #230

Features

• auth: add new isAuthenticatedOrRefresh method, update NbAuthJWTInterceptor to refresh the token (#649) (c8e8964)
• auth: remove bootstrap, use custom styles (#738) (b585490)
• calendar: add capability to hide header (#838) (df9b21c), closes #828
• checkbox: add outline on focus (#731) (cc892d5)
• docs: add groups to components list (#646) (73cf1b4)
• docs: add installation guides (#740) (d08c4d5)
• docs: add star & download badges into the hero section (#813) (c3c755a)
• docs: fix typo in security docs (#717) (fc3b2d4)
• docs: update akveo logo (#674) (5d79c2a)
• icons: add new icons (#722) (be06906)
• playground: automatic refresh token (#658) (b4fc624)
• sidebar: add ability fix sidebar container (#642) (7939344)
• sidebar: add ability fix sidebar container on low resolutions (#645) (efa16ef)
• tabset: update background fot tabset selected (#643) (ff8e9b6)
• theme: add cdk (#679) (b9283d3), closes #661 #660
• theme: add new DatePicker component (#732) (c00cc23)
• theme: add new Dialog component (#688) (2edd9b3), closes #666 #665
• theme: add new Radio component (#746) (9e04681)
• theme: add new Select component (#698) (d6a211f), closes #671
• theme: add new Toastr component (#692) (29e4fef), closes #667
• theme: add new Tooltip component (#703) (0e05034), closes #663
• theme: add new Window component (#713) (60a65cb), closes #669

HOW TO UPGRADE/BREAKING CHANGES

Steps

This release has introduced a number of changes which may required some manual update steps, depending on your setup:

1. In case if you use Nebular overrides of bootstrap styles - you need to manually install new @nebular/bootstrap package. To do that:

• install Nebular Bootstrap npm i @nebular/bootstrap
• then add it into your styles.scss

@import '~@nebular/bootstrap/styles/globals';
// ...

@include nb-install() {
  // ...
  @include nb-bootstrap-global();
}

• if you import ~@nebular/theme/styles/global/bootstrap/breakpoints in your code, replace it with ~@nebular/theme/styles/global/breakpoints
• if you import ~@nebular/theme/styles/global/bootstrap/*.scss somewhere in your code, replace it with ~@nebular/bootstrap/styles/*.scss

1. Nebular 2.0 introduced a new peer dependency - @angular/cdk. A lot of out of the box functionality provided by @angular team gives our components a solid foundation. To do that:

• install @angular/cdk npm i @angular/cdk

Breaking Changes

Here's a list of other possibly breaking changes that you may need to take into account:

• menu: NbMenuComponent and NbContextMenuDirective now fire itemClick even if item with routerLink was clicked.

• menu: The NbMenuService not reply the last click event. To update: if you use the knowledge that the last click event is replied you can wrap onItemClick stream in the custom stream based on ReplaySubject.

• theme: angular2-toaster styles were removed from Nebular. Instead, we suggest using our new NbToastrService. To update: add NbToastrModule into imports of your app.module. Inject NbToastrService into the required component. call NbToastrService.show(...) to render toasts. For more information check toastr documentation.

• theme: All bootstrap override styles were moved from the @nebular/theme package to the new @nebular/bootstrap package. If you don't need bootstrap support you can simply no use this package. @nebular/theme package introduced a dependency of normalize.css. To update:

  • install Nebular Bootstrap npm i @nebular/bootstrap
  • then add it into your styles.scss

  @import '~@nebular/bootstrap/styles/globals';
  // ...
  
  @include nb-install() {
    // ...
    @include nb-bootstrap-global();
  }
  

• theme: appendToLayoutTop and clearLayoutTop methods was removed from NbThemeService. Instead of this methods, you have to use NbOverlayService. It's the extension of @angular/cdk overlays, so, check documentation first of all. Basic usage of overlays may look like this:

  constructor(protected overlay: NbOverlayService) {
  }
  
  const overlayRef = overlay.create();
  const overlayComponentPortal = new ComponentPortal(MyOverlayComponent);
  overlayRef.attach(overlayComponentPortal);
  

• tabset: Possibly a breaking change since tabs won't be bold in hover state.

• auth: According to RFC6749 section 4.3.2, the OAuth2 token request body with grant-type='password' must provide username to the auth server and not email.

• auth: NbAuthJWTInterceptor now always tries to refresh the token. Urls for token sending can be filtered using a filter function:

{ provide: NB_AUTH_TOKEN_INTERCEPTOR_FILTER, useValue: (req) => filter(req)},

• auth: failWhenNoToken has been removed from password strategy as it was still not released and becoming redundant

<a name="2.0.0-rc.10"></a>