From 9b4ff5bbd2584e3c51c52f81f6028491574f0f53 Mon Sep 17 00:00:00 2001 From: Sergey Andrievskiy Date: Fri, 13 Mar 2020 18:38:40 +0300 Subject: [PATCH] fix: support strict template check (#2273) BREAKING CHANGE: Generic value type removed from NbSelectComponent --- .../components-overview-block.component.html | 4 +- .../live-example-block.component.html | 2 +- .../components/md-block/md-block.component.ts | 4 +- .../stacked-examples.component.ts | 4 +- .../components-list.component.ts | 1 + .../accordion/accordion-item.component.ts | 5 +- .../accordion/accordion.component.ts | 3 +- .../components/actions/actions.component.ts | 4 +- .../theme/components/alert/alert.component.ts | 3 +- .../autocomplete/autocomplete.directive.ts | 6 +- .../components/button/button.component.ts | 8 ++- .../calendar-day-cell.component.ts | 3 +- .../calendar-day-picker.component.ts | 6 +- .../calendar-days-names.component.ts | 3 +- .../calendar-month-cell.component.ts | 3 +- .../calendar-month-picker.component.ts | 3 +- .../calendar-view-mode.component.ts | 3 +- .../calendar-picker-row.component.ts | 3 +- .../calendar-picker.component.ts | 3 +- .../calendar-week-number.component.ts | 3 +- .../calendar-year-cell.component.ts | 3 +- .../calendar-year-picker.component.ts | 3 +- .../theme/components/calendar-kit/model.ts | 2 + .../calendar/base-calendar.component.html | 6 +- .../calendar/base-calendar.component.ts | 13 +++- .../calendar-range-day-cell.component.ts | 3 +- .../calendar-range-month-cell.component.ts | 3 +- .../calendar-range-year-cell.component.ts | 3 +- .../calendar/calendar-range.component.ts | 15 ++++- .../components/calendar/calendar.component.ts | 13 +++- .../cdk/overlay/overlay-position.ts | 2 + .../components/cdk/overlay/overlay-trigger.ts | 1 + .../chat/chat-message-file.component.ts | 20 +++++- .../components/chat/chat-message.component.ts | 8 ++- .../theme/components/chat/chat.component.ts | 3 +- .../components/checkbox/checkbox.component.ts | 5 +- .../context-menu/context-menu.directive.ts | 3 +- .../datepicker/datepicker.component.ts | 13 ++-- .../datepicker/datepicker.directive.ts | 2 +- src/framework/theme/components/helpers.ts | 3 + .../theme/components/input/input.directive.ts | 3 +- .../components/layout/layout.component.ts | 11 +++- .../list/infinite-list.directive.ts | 3 +- .../theme/components/menu/menu.component.ts | 3 +- .../option/option-group.component.spec.ts | 4 +- .../option/option-group.component.ts | 3 +- .../components/option/option.component.ts | 9 +-- .../components/popover/popover.directive.ts | 6 +- .../components/radio/radio-group.component.ts | 3 +- .../theme/components/radio/radio.component.ts | 4 +- .../route-tabset/route-tabset.component.ts | 3 +- .../components/select/select.component.ts | 62 ++++++++++--------- .../theme/components/select/select.spec.ts | 28 ++++----- .../components/sidebar/sidebar.component.ts | 9 ++- .../components/stepper/step.component.ts | 18 ++++-- .../components/stepper/stepper.component.html | 2 +- .../components/stepper/stepper.component.ts | 20 +++++- .../components/tabset/tabset.component.ts | 8 ++- .../components/toggle/toggle.component.ts | 4 +- .../components/tooltip/tooltip.directive.ts | 4 +- .../tree-grid/tree-grid-sort.component.ts | 6 +- .../tree-grid/tree-grid.component.ts | 3 +- .../theme/components/user/user.component.ts | 6 +- .../flip-card/flip-card-sizes.component.html | 4 +- .../menu/menu-autocollapse.component.ts | 12 +--- .../menu/menu-children.component.ts | 8 +-- .../menu/menu-showcase.component.ts | 7 +-- .../oauth2-password-login.component.html | 4 +- .../oauth2-password-login.component.ts | 6 +- .../reveal-card-sizes.component.html | 4 +- .../spinner/spinner-card.component.ts | 2 +- .../spinner/spinner-tabs.component.ts | 2 +- .../stepper/stepper-linear.component.html | 4 +- .../menu/menu-test.component.ts | 14 ++--- .../auth/login/login.component.html | 4 +- tsconfig.json | 3 + 76 files changed, 321 insertions(+), 173 deletions(-) diff --git a/docs/app/blocks/components/components-overview-block/components-overview-block.component.html b/docs/app/blocks/components/components-overview-block/components-overview-block.component.html index 36df950cb3..2f90173fe6 100644 --- a/docs/app/blocks/components/components-overview-block/components-overview-block.component.html +++ b/docs/app/blocks/components/components-overview-block/components-overview-block.component.html @@ -6,8 +6,8 @@

Components Overview

-

{{ component.name }}

-
+

{{ component.name }}

+
diff --git a/docs/app/blocks/components/live-example-block/live-example-block.component.html b/docs/app/blocks/components/live-example-block/live-example-block.component.html index 419c0e6445..215f5aa40c 100644 --- a/docs/app/blocks/components/live-example-block/live-example-block.component.html +++ b/docs/app/blocks/components/live-example-block/live-example-block.component.html @@ -3,7 +3,7 @@
- diff --git a/docs/app/blocks/components/md-block/md-block.component.ts b/docs/app/blocks/components/md-block/md-block.component.ts index c92f9eafbb..6bce692a72 100644 --- a/docs/app/blocks/components/md-block/md-block.component.ts +++ b/docs/app/blocks/components/md-block/md-block.component.ts @@ -9,9 +9,9 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; @Component({ selector: 'ngd-md-block', template: ` - + -
+
`, diff --git a/docs/app/blocks/components/stacked-example-block/stacked-examples.component.ts b/docs/app/blocks/components/stacked-example-block/stacked-examples.component.ts index bad2fa5877..a57fa9b8ea 100644 --- a/docs/app/blocks/components/stacked-example-block/stacked-examples.component.ts +++ b/docs/app/blocks/components/stacked-example-block/stacked-examples.component.ts @@ -23,14 +23,14 @@ export const pulse = animation(
diff --git a/src/app/components-list/components-list.component.ts b/src/app/components-list/components-list.component.ts index 2c4546bde9..3cdfa3969b 100644 --- a/src/app/components-list/components-list.component.ts +++ b/src/app/components-list/components-list.component.ts @@ -51,6 +51,7 @@ export class ComponentsListComponent implements AfterViewInit { get vertical() { return this.isVertical; } + static ngAcceptInputType_vertical: boolean | string | null | undefined; @ViewChildren(RouterLinkActive) routerLinks: QueryList; @ViewChildren('link', { read: ElementRef }) linkElements: QueryList>; diff --git a/src/framework/theme/components/accordion/accordion-item.component.ts b/src/framework/theme/components/accordion/accordion-item.component.ts index 273d85e8ca..aed424d870 100644 --- a/src/framework/theme/components/accordion/accordion-item.component.ts +++ b/src/framework/theme/components/accordion/accordion-item.component.ts @@ -22,7 +22,7 @@ import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { NbAccordionComponent } from './accordion.component'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; /** * Component intended to be used within `` component @@ -52,6 +52,7 @@ export class NbAccordionItemComponent implements OnInit, OnChanges, OnDestroy { this.collapsedChange.emit(this.collapsedValue); this.invalidate(); } + static ngAcceptInputType_collapsed: NbBooleanInput; /** * Item is expanded (`false` by default) @@ -65,6 +66,7 @@ export class NbAccordionItemComponent implements OnInit, OnChanges, OnDestroy { set expanded(val: boolean) { this.collapsedValue = !convertToBoolProperty(val); } + static ngAcceptInputType_expanded: NbBooleanInput; /** * Item is disabled and cannot be opened. @@ -79,6 +81,7 @@ export class NbAccordionItemComponent implements OnInit, OnChanges, OnDestroy { this.disabledValue = convertToBoolProperty(val); this.invalidate(); } + static ngAcceptInputType_disabled: NbBooleanInput; /** * Emits whenever the expanded state of the accordion changes. diff --git a/src/framework/theme/components/accordion/accordion.component.ts b/src/framework/theme/components/accordion/accordion.component.ts index b16fa86da7..6de7568265 100644 --- a/src/framework/theme/components/accordion/accordion.component.ts +++ b/src/framework/theme/components/accordion/accordion.component.ts @@ -6,7 +6,7 @@ import { Component, ChangeDetectionStrategy, Input } from '@angular/core'; import { Subject } from 'rxjs'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; /** * An accordion allows to toggle the display of sections of content @@ -87,6 +87,7 @@ export class NbAccordionComponent { set multi(val: boolean) { this.multiValue = convertToBoolProperty(val); } + static ngAcceptInputType_multi: NbBooleanInput; private multiValue = false; diff --git a/src/framework/theme/components/actions/actions.component.ts b/src/framework/theme/components/actions/actions.component.ts index 3cb30019fc..d4580bb667 100644 --- a/src/framework/theme/components/actions/actions.component.ts +++ b/src/framework/theme/components/actions/actions.component.ts @@ -6,7 +6,7 @@ import { Component, HostBinding, Input } from '@angular/core'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NbComponentSize } from '../component-size'; import { NbComponentStatus } from '../component-status'; import { NbBadgePosition } from '../badge/badge.component'; @@ -91,6 +91,7 @@ export class NbActionComponent { this._disabled = convertToBoolProperty(value); } protected _disabled: boolean = false; + static ngAcceptInputType_disabled: NbBooleanInput; /** * Badge text to display @@ -220,6 +221,7 @@ export class NbActionsComponent { this._fullWidth = convertToBoolProperty(value); } protected _fullWidth: boolean = false; + static ngAcceptInputType_fullWidth: NbBooleanInput; @HostBinding('class.size-tiny') get tiny(): boolean { diff --git a/src/framework/theme/components/alert/alert.component.ts b/src/framework/theme/components/alert/alert.component.ts index e3843fa410..46730cfbee 100644 --- a/src/framework/theme/components/alert/alert.component.ts +++ b/src/framework/theme/components/alert/alert.component.ts @@ -8,7 +8,7 @@ import { Component, Input, HostBinding, Output, EventEmitter } from '@angular/co import { NbComponentSize } from '../component-size'; import { NbComponentStatus } from '../component-status'; -import { convertToBoolProperty, emptyStatusWarning } from '../helpers'; +import { convertToBoolProperty, emptyStatusWarning, NbBooleanInput } from '../helpers'; /** @@ -169,6 +169,7 @@ export class NbAlertComponent { this._closable = convertToBoolProperty(value); } protected _closable: boolean = false; + static ngAcceptInputType_closable: NbBooleanInput; /** * Emits when chip is removed diff --git a/src/framework/theme/components/autocomplete/autocomplete.directive.ts b/src/framework/theme/components/autocomplete/autocomplete.directive.ts index 537ba35e64..90fdbc7354 100644 --- a/src/framework/theme/components/autocomplete/autocomplete.directive.ts +++ b/src/framework/theme/components/autocomplete/autocomplete.directive.ts @@ -202,7 +202,7 @@ export class NbAutocompleteDirective implements OnDestroy, AfterViewInit, Con } @HostListener('input') - protected handleInput() { + handleInput() { const currentValue = this.hostRef.nativeElement.value; this._onChange(currentValue); this.setHostInputValue(this.getDisplayValue(currentValue)); @@ -211,12 +211,12 @@ export class NbAutocompleteDirective implements OnDestroy, AfterViewInit, Con @HostListener('keydown.arrowDown') @HostListener('keydown.arrowUp') - protected handleKeydown() { + handleKeydown() { this.show(); } @HostListener('blur') - protected handleBlur() { + handleBlur() { this._onTouched(); } diff --git a/src/framework/theme/components/button/button.component.ts b/src/framework/theme/components/button/button.component.ts index efcddf7878..ccb5226a11 100644 --- a/src/framework/theme/components/button/button.component.ts +++ b/src/framework/theme/components/button/button.component.ts @@ -20,7 +20,7 @@ import { import { NbComponentStatus } from '../component-status'; import { NbComponentShape } from '../component-shape'; import { NbComponentSize } from '../component-size'; -import { convertToBoolProperty, firstChildNotComment, lastChildNotComment } from '../helpers'; +import { convertToBoolProperty, firstChildNotComment, lastChildNotComment, NbBooleanInput } from '../helpers'; export type NbButtonAppearance = 'filled' | 'outline' | 'ghost' | 'hero'; @@ -573,6 +573,7 @@ export class NbButtonComponent implements AfterViewInit { this.appearance = 'filled'; } } + static ngAcceptInputType_filled: NbBooleanInput; /** * Sets `outline` appearance @@ -587,6 +588,7 @@ export class NbButtonComponent implements AfterViewInit { this.appearance = 'outline'; } } + static ngAcceptInputType_outline: NbBooleanInput; /** * Sets `ghost` appearance @@ -601,6 +603,7 @@ export class NbButtonComponent implements AfterViewInit { this.appearance = 'ghost'; } } + static ngAcceptInputType_ghost: NbBooleanInput; /** * Sets `hero` appearance @@ -615,6 +618,7 @@ export class NbButtonComponent implements AfterViewInit { this.appearance = 'hero'; } } + static ngAcceptInputType_hero: NbBooleanInput; /** * If set element will fill its container @@ -628,6 +632,7 @@ export class NbButtonComponent implements AfterViewInit { this._fullWidth = convertToBoolProperty(value); } private _fullWidth = false; + static ngAcceptInputType_fullWidth: NbBooleanInput; /** * Disables the button @@ -643,6 +648,7 @@ export class NbButtonComponent implements AfterViewInit { this.renderer.setProperty(this.hostElement.nativeElement, 'disabled', this.disabled); } private _disabled: boolean = false; + static ngAcceptInputType_disabled: NbBooleanInput; // issue #794 @HostBinding('attr.tabindex') diff --git a/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-cell.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-cell.component.ts index 48b2de3070..ab8cc3baca 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-cell.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-cell.component.ts @@ -14,7 +14,7 @@ import { Output, } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize } from '../../model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../../model'; import { NbDateService } from '../../services/date.service'; @@ -42,6 +42,7 @@ export class NbCalendarDayCellComponent implements NbCalendarCell { @Input() filter: (D) => boolean; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Output() select: EventEmitter = new EventEmitter(true); diff --git a/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-picker.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-picker.component.ts index 22bb4fe3a7..f5313ba164 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-picker.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-picker.component.ts @@ -18,8 +18,8 @@ import { import { NbCalendarMonthModelService } from '../../services/calendar-month-model.service'; import { NbCalendarDayCellComponent } from './calendar-day-cell.component'; -import { NbCalendarCell, NbCalendarSize } from '../../model'; -import { convertToBoolProperty } from '../../../helpers'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../../model'; +import { convertToBoolProperty, NbBooleanInput } from '../../../helpers'; /** @@ -95,6 +95,7 @@ export class NbCalendarDayPickerComponent implements OnChanges { * Can be 'medium' which is default or 'large'. * */ @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; /** * Already selected date. @@ -113,6 +114,7 @@ export class NbCalendarDayPickerComponent implements OnChanges { this._showWeekNumber = convertToBoolProperty(value); } protected _showWeekNumber: boolean = false; + static ngAcceptInputType_showWeekNumber: NbBooleanInput; /** * Sets symbol used as a header for week numbers column diff --git a/src/framework/theme/components/calendar-kit/components/calendar-days-names/calendar-days-names.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-days-names/calendar-days-names.component.ts index 4c1503157b..f96a6b02d2 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-days-names/calendar-days-names.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-days-names/calendar-days-names.component.ts @@ -6,7 +6,7 @@ import { ChangeDetectionStrategy, Component, OnInit, Input, HostBinding } from '@angular/core'; -import { NbCalendarDay, NbCalendarSize } from '../../model'; +import { NbCalendarDay, NbCalendarSize, NbCalendarSizeValues } from '../../model'; import { NbDateService } from '../../services/date.service'; @@ -23,6 +23,7 @@ export class NbCalendarDaysNamesComponent implements OnInit { days: NbCalendarDay[]; @Input() size: NbCalendarSize; + static ngAcceptInputType_size: NbCalendarSizeValues; @HostBinding('class.size-large') get isLarge(): boolean { diff --git a/src/framework/theme/components/calendar-kit/components/calendar-month-picker/calendar-month-cell.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-month-picker/calendar-month-cell.component.ts index 5832b3610c..ef817d63d1 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-month-picker/calendar-month-cell.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-month-picker/calendar-month-cell.component.ts @@ -13,7 +13,7 @@ import { Input, Output, } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize } from '../../model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../../model'; import { NbDateService } from '../../services/date.service'; @@ -36,6 +36,7 @@ export class NbCalendarMonthCellComponent implements NbCalendarCell { @Input() max: D; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Output() select: EventEmitter = new EventEmitter(true); diff --git a/src/framework/theme/components/calendar-kit/components/calendar-month-picker/calendar-month-picker.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-month-picker/calendar-month-picker.component.ts index 1a2b0dd75c..ac2723a66d 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-month-picker/calendar-month-picker.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-month-picker/calendar-month-picker.component.ts @@ -16,7 +16,7 @@ import { SimpleChanges, } from '@angular/core'; import { batch } from '../../helpers'; -import { NbCalendarCell, NbCalendarSize } from '../../model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../../model'; import { NbCalendarMonthCellComponent } from './calendar-month-cell.component'; import { NbDateService } from '../../services/date.service'; @@ -48,6 +48,7 @@ export class NbCalendarMonthPickerComponent implements OnChanges { @Input() filter: (D) => boolean; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; /** * Visible month diff --git a/src/framework/theme/components/calendar-kit/components/calendar-navigation/calendar-view-mode.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-navigation/calendar-view-mode.component.ts index d3e21726ce..d044016b18 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-navigation/calendar-view-mode.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-navigation/calendar-view-mode.component.ts @@ -7,7 +7,7 @@ import { TranslationWidth } from '@angular/common'; import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core'; -import { NbCalendarViewMode } from '../../model'; +import { NbCalendarViewMode, NbCalendarViewModeValues } from '../../model'; import { NbCalendarYearModelService } from '../../services/calendar-year-model.service'; import { NbDateService } from '../../services/date.service'; @@ -25,6 +25,7 @@ import { NbDateService } from '../../services/date.service'; export class NbCalendarViewModeComponent { @Input() date: D; @Input() viewMode: NbCalendarViewMode = NbCalendarViewMode.DATE; + static ngAcceptInputType_viewMode: NbCalendarViewModeValues; @Output() changeMode = new EventEmitter(true); constructor( diff --git a/src/framework/theme/components/calendar-kit/components/calendar-picker/calendar-picker-row.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-picker/calendar-picker-row.component.ts index 93d6ded216..d317817f39 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-picker/calendar-picker-row.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-picker/calendar-picker-row.component.ts @@ -18,7 +18,7 @@ import { ViewContainerRef, } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize } from '../../model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../../model'; @Component({ @@ -41,6 +41,7 @@ export class NbCalendarPickerRowComponent implements OnChanges { @Input() max: D; @Input() filter: (D) => boolean; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Output() select: EventEmitter = new EventEmitter(); // TODO static must be false as of Angular 9.0.0, issues/1514 diff --git a/src/framework/theme/components/calendar-kit/components/calendar-picker/calendar-picker.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-picker/calendar-picker.component.ts index cf64bd8765..d209b07719 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-picker/calendar-picker.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-picker/calendar-picker.component.ts @@ -6,7 +6,7 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, Type, HostBinding } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize } from '../../model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../../model'; @Component({ @@ -36,6 +36,7 @@ export class NbCalendarPickerComponent { @Input() max: D; @Input() filter: (D) => boolean; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Output() select: EventEmitter = new EventEmitter(); @HostBinding('class.size-large') diff --git a/src/framework/theme/components/calendar-kit/components/calendar-week-number/calendar-week-number.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-week-number/calendar-week-number.component.ts index bd44e0dd7b..67c8d8b2fa 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-week-number/calendar-week-number.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-week-number/calendar-week-number.component.ts @@ -7,7 +7,7 @@ import { Component, Input, HostBinding, ChangeDetectionStrategy, OnChanges, SimpleChanges } from '@angular/core'; import { NbDateService } from '../../services/date.service'; -import { NbCalendarSize } from '../../model'; +import { NbCalendarSize, NbCalendarSizeValues } from '../../model'; @Component({ selector: 'nb-calendar-week-numbers', @@ -29,6 +29,7 @@ export class NbCalendarWeekNumberComponent implements OnChanges { @Input() size: NbCalendarSize; + static ngAcceptInputType_size: NbCalendarSizeValues; /** * Sets symbol used as a header for week numbers column diff --git a/src/framework/theme/components/calendar-kit/components/calendar-year-picker/calendar-year-cell.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-year-picker/calendar-year-cell.component.ts index 36a1dcebb8..db326a2eae 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-year-picker/calendar-year-cell.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-year-picker/calendar-year-cell.component.ts @@ -14,7 +14,7 @@ import { Output, } from '@angular/core'; import { NbDateService } from '../../services/date.service'; -import { NbCalendarCell, NbCalendarSize } from '../../model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../../model'; @Component({ @@ -36,6 +36,7 @@ export class NbCalendarYearCellComponent implements NbCalendarCell { @Input() selectedValue: D; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Output() select: EventEmitter = new EventEmitter(true); diff --git a/src/framework/theme/components/calendar-kit/components/calendar-year-picker/calendar-year-picker.component.ts b/src/framework/theme/components/calendar-kit/components/calendar-year-picker/calendar-year-picker.component.ts index 60120f427d..0daf185c40 100644 --- a/src/framework/theme/components/calendar-kit/components/calendar-year-picker/calendar-year-picker.component.ts +++ b/src/framework/theme/components/calendar-kit/components/calendar-year-picker/calendar-year-picker.component.ts @@ -14,7 +14,7 @@ import { Output, Type, } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize } from '../../model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../../model'; import { NbCalendarYearCellComponent } from './calendar-year-cell.component'; import { NbDateService } from '../../services/date.service'; import { NbCalendarYearModelService } from '../../services/calendar-year-model.service'; @@ -55,6 +55,7 @@ export class NbCalendarYearPickerComponent implements OnChanges { cellComponent: Type> = NbCalendarYearCellComponent; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Input() year: D; diff --git a/src/framework/theme/components/calendar-kit/model.ts b/src/framework/theme/components/calendar-kit/model.ts index e8e20a200f..0099b84d50 100644 --- a/src/framework/theme/components/calendar-kit/model.ts +++ b/src/framework/theme/components/calendar-kit/model.ts @@ -11,12 +11,14 @@ export interface NbCalendarDay { isHoliday: boolean; } +export type NbCalendarViewModeValues = 'year' | 'month' | 'date'; export enum NbCalendarViewMode { YEAR = 'year', MONTH = 'month', DATE = 'date', } +export type NbCalendarSizeValues = 'medium' | 'large'; export enum NbCalendarSize { MEDIUM = 'medium', LARGE = 'large', diff --git a/src/framework/theme/components/calendar/base-calendar.component.html b/src/framework/theme/components/calendar/base-calendar.component.html index 5ec6a8930c..811a37585e 100644 --- a/src/framework/theme/components/calendar/base-calendar.component.html +++ b/src/framework/theme/components/calendar/base-calendar.component.html @@ -21,13 +21,13 @@ [size]="size" [date]="date" [showWeekNumber]="showWeekNumber" - (dateChange)="dateChange.emit($event)" + (dateChange)="dateChange.emit($any($event))" [weekNumberSymbol]="weekNumberSymbol"> diff --git a/src/framework/theme/components/calendar/base-calendar.component.ts b/src/framework/theme/components/calendar/base-calendar.component.ts index cccacb8f01..2106327edb 100644 --- a/src/framework/theme/components/calendar/base-calendar.component.ts +++ b/src/framework/theme/components/calendar/base-calendar.component.ts @@ -7,9 +7,15 @@ import { Component, EventEmitter, HostBinding, Input, OnInit, Output, Type } from '@angular/core'; import { NbCalendarYearModelService } from '../calendar-kit/services/calendar-year-model.service'; -import { NbCalendarCell, NbCalendarSize, NbCalendarViewMode } from '../calendar-kit/model'; +import { + NbCalendarCell, + NbCalendarSize, + NbCalendarViewMode, + NbCalendarSizeValues, + NbCalendarViewModeValues, +} from '../calendar-kit/model'; import { NbDateService } from '../calendar-kit/services/date.service'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; /** * The basis for calendar and range calendar components. @@ -32,6 +38,7 @@ export class NbBaseCalendarComponent implements OnInit { * Defines active view for calendar. * */ @Input('startView') activeViewMode: NbCalendarViewMode = NbCalendarViewMode.DATE; + static ngAcceptInputType_activeViewMode: NbCalendarViewModeValues; /** * Minimum available date for selection. @@ -68,6 +75,7 @@ export class NbBaseCalendarComponent implements OnInit { * Can be 'medium' which is default or 'large'. * */ @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Input() visibleDate: D; @@ -96,6 +104,7 @@ export class NbBaseCalendarComponent implements OnInit { this._showWeekNumber = convertToBoolProperty(value); } protected _showWeekNumber = false; + static ngAcceptInputType_showWeekNumber: NbBooleanInput; /** * Sets symbol used as a header for week numbers column diff --git a/src/framework/theme/components/calendar/calendar-range-day-cell.component.ts b/src/framework/theme/components/calendar/calendar-range-day-cell.component.ts index 72a9699f9f..e0c0b91b8f 100644 --- a/src/framework/theme/components/calendar/calendar-range-day-cell.component.ts +++ b/src/framework/theme/components/calendar/calendar-range-day-cell.component.ts @@ -14,7 +14,7 @@ import { HostListener, } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize } from '../calendar-kit/model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../calendar-kit/model'; import { NbCalendarRange } from './calendar-range.component'; import { NbDateService } from '../calendar-kit/services/date.service'; import { NbBaseCalendarRangeCell } from './base-calendar-range-cell'; @@ -41,6 +41,7 @@ export class NbCalendarRangeDayCellComponent extends NbBaseCalendarRangeCell< @Input() filter: (D) => boolean; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Output() select: EventEmitter = new EventEmitter(true); diff --git a/src/framework/theme/components/calendar/calendar-range-month-cell.component.ts b/src/framework/theme/components/calendar/calendar-range-month-cell.component.ts index d5add19f7b..0c0c1d0986 100644 --- a/src/framework/theme/components/calendar/calendar-range-month-cell.component.ts +++ b/src/framework/theme/components/calendar/calendar-range-month-cell.component.ts @@ -14,7 +14,7 @@ import { Output, } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize } from '../calendar-kit/model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../calendar-kit/model'; import { NbDateService } from '../calendar-kit/services/date.service'; import { NbCalendarRange } from './calendar-range.component'; import { NbBaseCalendarRangeCell } from './base-calendar-range-cell'; @@ -43,6 +43,7 @@ export class NbCalendarRangeMonthCellComponent extends NbBaseCalendarRangeCel @Input() max: D; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Output() select: EventEmitter = new EventEmitter(true); diff --git a/src/framework/theme/components/calendar/calendar-range-year-cell.component.ts b/src/framework/theme/components/calendar/calendar-range-year-cell.component.ts index 4e6151798c..8c5702a8bd 100644 --- a/src/framework/theme/components/calendar/calendar-range-year-cell.component.ts +++ b/src/framework/theme/components/calendar/calendar-range-year-cell.component.ts @@ -14,7 +14,7 @@ import { HostListener, } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize } from '../calendar-kit/model'; +import { NbCalendarCell, NbCalendarSize, NbCalendarSizeValues } from '../calendar-kit/model'; import { NbCalendarRange } from './calendar-range.component'; import { NbDateService } from '../calendar-kit/services/date.service'; import { NbBaseCalendarRangeCell } from './base-calendar-range-cell'; @@ -39,6 +39,7 @@ export class NbCalendarRangeYearCellComponent extends NbBaseCalendarRangeCell @Input() selectedValue: NbCalendarRange; @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Output() select: EventEmitter = new EventEmitter(true); diff --git a/src/framework/theme/components/calendar/calendar-range.component.ts b/src/framework/theme/components/calendar/calendar-range.component.ts index 25768c81ab..b85d50c251 100644 --- a/src/framework/theme/components/calendar/calendar-range.component.ts +++ b/src/framework/theme/components/calendar/calendar-range.component.ts @@ -6,12 +6,18 @@ import { Component, EventEmitter, Input, Output, Type } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize, NbCalendarViewMode } from '../calendar-kit/model'; +import { + NbCalendarCell, + NbCalendarSize, + NbCalendarViewMode, + NbCalendarSizeValues, + NbCalendarViewModeValues, +} from '../calendar-kit/model'; import { NbDateService } from '../calendar-kit/services/date.service'; import { NbCalendarRangeDayCellComponent } from './calendar-range-day-cell.component'; import { NbCalendarRangeYearCellComponent } from './calendar-range-year-cell.component'; import { NbCalendarRangeMonthCellComponent } from './calendar-range-month-cell.component'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; export interface NbCalendarRange { @@ -162,7 +168,7 @@ export interface NbCalendarRange { template: ` { * Defines starting view for the calendar. * */ @Input() startView: NbCalendarViewMode = NbCalendarViewMode.DATE; + static ngAcceptInputType_startView: NbCalendarViewModeValues; /** * A minimum available date for selection. @@ -238,6 +245,7 @@ export class NbCalendarRangeComponent { * Can be 'medium' which is default or 'large'. * */ @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Input() visibleDate: D; @@ -263,6 +271,7 @@ export class NbCalendarRangeComponent { this._showWeekNumber = convertToBoolProperty(value); } protected _showWeekNumber: boolean = false; + static ngAcceptInputType_showWeekNumber: NbBooleanInput; /** * Sets symbol used as a header for week numbers column diff --git a/src/framework/theme/components/calendar/calendar.component.ts b/src/framework/theme/components/calendar/calendar.component.ts index cb6b32d001..fb8e209759 100644 --- a/src/framework/theme/components/calendar/calendar.component.ts +++ b/src/framework/theme/components/calendar/calendar.component.ts @@ -6,8 +6,14 @@ import { Component, EventEmitter, Input, Output, Type } from '@angular/core'; -import { NbCalendarCell, NbCalendarSize, NbCalendarViewMode } from '../calendar-kit/model'; -import { convertToBoolProperty } from '../helpers'; +import { + NbCalendarCell, + NbCalendarSize, + NbCalendarViewMode, + NbCalendarSizeValues, + NbCalendarViewModeValues, +} from '../calendar-kit/model'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; /** @@ -221,6 +227,7 @@ export class NbCalendarComponent { * Defines starting view for calendar. * */ @Input() startView: NbCalendarViewMode = NbCalendarViewMode.DATE; + static ngAcceptInputType_startView: NbCalendarViewModeValues; /** * Minimum available date for selection. @@ -257,6 +264,7 @@ export class NbCalendarComponent { * Can be 'medium' which is default or 'large'. * */ @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; @Input() visibleDate: D; @@ -282,6 +290,7 @@ export class NbCalendarComponent { this._showWeekNumber = convertToBoolProperty(value); } protected _showWeekNumber: boolean = false; + static ngAcceptInputType_showWeekNumber: NbBooleanInput; /** * Sets symbol used as a header for week numbers column diff --git a/src/framework/theme/components/cdk/overlay/overlay-position.ts b/src/framework/theme/components/cdk/overlay/overlay-position.ts index b0f3a084a2..2d14a61fd8 100644 --- a/src/framework/theme/components/cdk/overlay/overlay-position.ts +++ b/src/framework/theme/components/cdk/overlay/overlay-position.ts @@ -28,6 +28,8 @@ export enum NbAdjustment { HORIZONTAL = 'horizontal', } +// tslint:disable-next-line:max-line-length +export type NbPositionValues = 'top' | 'bottom' | 'left' | 'right' | 'start' | 'end' | 'top-end' | 'top-start' | 'bottom-end' | 'bottom-start' | 'end-top' | 'end-bottom' | 'start-top' | 'start-bottom'; export enum NbPosition { TOP = 'top', BOTTOM = 'bottom', diff --git a/src/framework/theme/components/cdk/overlay/overlay-trigger.ts b/src/framework/theme/components/cdk/overlay/overlay-trigger.ts index b04c164fab..e08087cb70 100644 --- a/src/framework/theme/components/cdk/overlay/overlay-trigger.ts +++ b/src/framework/theme/components/cdk/overlay/overlay-trigger.ts @@ -3,6 +3,7 @@ import { EMPTY, fromEvent as observableFromEvent, merge as observableMerge, Obse import { debounceTime, delay, filter, map, repeat, share, switchMap, takeUntil, takeWhile } from 'rxjs/operators'; import { NB_DOCUMENT } from '../../../theme.options'; +export type NbTriggerValues = 'noop' | 'click' | 'hover' | 'hint' | 'focus'; export enum NbTrigger { NOOP = 'noop', CLICK = 'click', diff --git a/src/framework/theme/components/chat/chat-message-file.component.ts b/src/framework/theme/components/chat/chat-message-file.component.ts index 27c195bb77..87319bfd02 100644 --- a/src/framework/theme/components/chat/chat-message-file.component.ts +++ b/src/framework/theme/components/chat/chat-message-file.component.ts @@ -7,6 +7,16 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input } from '@angular/core'; import { DomSanitizer } from '@angular/platform-browser'; +export interface NbChatMessageFileIconPreview { + url: string; + icon: string; +} +export interface NbChatMessageFileImagePreview { + url: string; + type: string; +} +export type NbChatMessageFile = NbChatMessageFileIconPreview | NbChatMessageFileImagePreview; + /** * Chat message component. */ @@ -62,7 +72,7 @@ export class NbChatMessageFileComponent { * @type {Date} */ @Input() - set files(files: any[]) { + set files(files: NbChatMessageFile[]) { this.readyFiles = (files || []).map((file: any) => { const isImage = this.isImage(file); return { @@ -78,7 +88,11 @@ export class NbChatMessageFileComponent { } - isImage(file: any): boolean { - return ['image/png', 'image/jpeg', 'image/gif'].includes(file.type); + isImage(file: NbChatMessageFile): boolean { + const type = (file as NbChatMessageFileImagePreview).type; + if (type) { + return [ 'image/png', 'image/jpeg', 'image/gif' ].includes(type); + } + return false; } } diff --git a/src/framework/theme/components/chat/chat-message.component.ts b/src/framework/theme/components/chat/chat-message.component.ts index 083b4908c6..b85ff42988 100644 --- a/src/framework/theme/components/chat/chat-message.component.ts +++ b/src/framework/theme/components/chat/chat-message.component.ts @@ -5,10 +5,12 @@ */ import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { DomSanitizer, SafeStyle } from '@angular/platform-browser'; import { animate, state, style, transition, trigger } from '@angular/animations'; +import { NbChatMessageFile } from './chat-message-file.component'; + /** * Chat message component. * @@ -124,6 +126,7 @@ export class NbChatMessageComponent { this._reply = convertToBoolProperty(value); } protected _reply: boolean = false; + static ngAcceptInputType_reply: NbBooleanInput; /** * Message sender @@ -145,9 +148,8 @@ export class NbChatMessageComponent { /** * Array of files `{ url: 'file url', icon: 'file icon class' }` - * @type {string} */ - @Input() files: { url: string, icon: string }[]; + @Input() files: NbChatMessageFile[]; /** * Quoted message text diff --git a/src/framework/theme/components/chat/chat.component.ts b/src/framework/theme/components/chat/chat.component.ts index 7d2f989a0a..0a44f22347 100644 --- a/src/framework/theme/components/chat/chat.component.ts +++ b/src/framework/theme/components/chat/chat.component.ts @@ -21,7 +21,7 @@ import { import { NbComponentSize } from '../component-size'; import { NbComponentStatus } from '../component-status'; -import { convertToBoolProperty, emptyStatusWarning } from '../helpers'; +import { convertToBoolProperty, emptyStatusWarning, NbBooleanInput } from '../helpers'; import { NbChatFormComponent } from './chat-form.component'; import { NbChatMessageComponent } from './chat-message.component'; @@ -216,6 +216,7 @@ export class NbChatComponent implements OnChanges, AfterContentInit, AfterViewIn this._scrollBottom = convertToBoolProperty(value); } protected _scrollBottom: boolean = true; + static ngAcceptInputType_scrollBottom: NbBooleanInput; @ViewChild('scrollable') scrollable: ElementRef; @ContentChildren(NbChatMessageComponent) messages: QueryList; diff --git a/src/framework/theme/components/checkbox/checkbox.component.ts b/src/framework/theme/components/checkbox/checkbox.component.ts index 63104bac93..6f87d16877 100644 --- a/src/framework/theme/components/checkbox/checkbox.component.ts +++ b/src/framework/theme/components/checkbox/checkbox.component.ts @@ -21,7 +21,7 @@ import { import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { NbComponentStatus } from '../component-status'; -import { convertToBoolProperty, emptyStatusWarning } from '../helpers'; +import { convertToBoolProperty, emptyStatusWarning, NbBooleanInput } from '../helpers'; /** * Styled checkbox component @@ -310,6 +310,7 @@ export class NbCheckboxComponent implements AfterViewInit, ControlValueAccessor this._checked = convertToBoolProperty(value); } private _checked: boolean = false; + static ngAcceptInputType_checked: NbBooleanInput; /** * Controls input disabled state @@ -322,6 +323,7 @@ export class NbCheckboxComponent implements AfterViewInit, ControlValueAccessor this._disabled = convertToBoolProperty(value); } private _disabled: boolean = false; + static ngAcceptInputType_disabled: NbBooleanInput; /** * Checkbox status. @@ -352,6 +354,7 @@ export class NbCheckboxComponent implements AfterViewInit, ControlValueAccessor this._indeterminate = convertToBoolProperty(value); } private _indeterminate: boolean = false; + static ngAcceptInputType_indeterminate: NbBooleanInput; /** * Output when checked state is changed by a user diff --git a/src/framework/theme/components/context-menu/context-menu.directive.ts b/src/framework/theme/components/context-menu/context-menu.directive.ts index e82e262475..c1533c6c8a 100644 --- a/src/framework/theme/components/context-menu/context-menu.directive.ts +++ b/src/framework/theme/components/context-menu/context-menu.directive.ts @@ -22,7 +22,7 @@ import { NbDynamicOverlay, NbDynamicOverlayController } from '../cdk/overlay/dyn import { NbDynamicOverlayHandler } from '../cdk/overlay/dynamic/dynamic-overlay-handler'; import { NbOverlayRef } from '../cdk/overlay/mapping'; import { NbAdjustableConnectedPositionStrategy, NbAdjustment, NbPosition } from '../cdk/overlay/overlay-position'; -import { NbTrigger } from '../cdk/overlay/overlay-trigger'; + import { NbTrigger, NbTriggerValues } from '../cdk/overlay/overlay-trigger'; import { NbContextMenuComponent } from './context-menu.component'; import { NbMenuItem, NbMenuService } from '../menu/menu.service'; @@ -157,6 +157,7 @@ export class NbContextMenuDirective implements NbDynamicOverlayController, OnCha * */ @Input('nbContextMenuTrigger') trigger: NbTrigger = NbTrigger.CLICK; + static ngAcceptInputType_trigger: NbTriggerValues; @Input('nbContextMenuClass') contextMenuClass: string = ''; diff --git a/src/framework/theme/components/datepicker/datepicker.component.ts b/src/framework/theme/components/datepicker/datepicker.component.ts index b38f1145e3..b6a2716ea1 100644 --- a/src/framework/theme/components/datepicker/datepicker.component.ts +++ b/src/framework/theme/components/datepicker/datepicker.component.ts @@ -41,10 +41,12 @@ import { NbCalendarCell, NbCalendarSize, NbCalendarViewMode, + NbCalendarSizeValues, + NbCalendarViewModeValues, } from '../calendar-kit/model'; import { NbDateService } from '../calendar-kit/services/date.service'; import { NB_DATE_SERVICE_OPTIONS, NbDatepicker, NbPickerValidatorConfig } from './datepicker.directive'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; /** @@ -413,6 +415,7 @@ export class NbBasePickerComponent extends NbBasePicker { * Defines starting view for calendar. * */ @Input() startView: NbCalendarViewMode = NbCalendarViewMode.DATE; + static ngAcceptInputType_startView: NbCalendarViewModeValues; /** * Minimum available date for selection. @@ -449,6 +452,7 @@ export class NbBasePickerComponent extends NbBasePicker { * Can be 'medium' which is default or 'large'. * */ @Input() size: NbCalendarSize = NbCalendarSize.MEDIUM; + static ngAcceptInputType_size: NbCalendarSizeValues; /** * Depending on this date a particular month is selected in the calendar @@ -484,6 +488,7 @@ export class NbBasePickerComponent extends NbBasePicker { this._showWeekNumber = convertToBoolProperty(value); } protected _showWeekNumber: boolean = false; + static ngAcceptInputType_showWeekNumber: NbBooleanInput; constructor(@Inject(NB_DOCUMENT) document, positionBuilder: NbPositionBuilderService, @@ -502,7 +507,7 @@ export class NbBasePickerComponent extends NbBasePicker { return } - get value(): T | undefined { + get value(): T { return undefined; } set value(value: T) {} @@ -536,7 +541,7 @@ export class NbDatepickerComponent extends NbBasePickerComponent; } - get value(): D | undefined { + get value(): D { return this.picker ? this.picker.date : undefined; } @@ -592,7 +597,7 @@ export class NbRangepickerComponent return this.valueChange as EventEmitter>; } - get value(): NbCalendarRange | undefined { + get value(): NbCalendarRange { return this.picker ? this.picker.range : undefined; } diff --git a/src/framework/theme/components/datepicker/datepicker.directive.ts b/src/framework/theme/components/datepicker/datepicker.directive.ts index 3ee35157ee..5c02bc3345 100644 --- a/src/framework/theme/components/datepicker/datepicker.directive.ts +++ b/src/framework/theme/components/datepicker/datepicker.directive.ts @@ -87,7 +87,7 @@ export abstract class NbDatepicker { * */ abstract format: string; - abstract get value(): T | undefined; + abstract get value(): T; abstract set value(value: T); diff --git a/src/framework/theme/components/helpers.ts b/src/framework/theme/components/helpers.ts index b3fd1c8d8e..4d0fe4fc4a 100644 --- a/src/framework/theme/components/helpers.ts +++ b/src/framework/theme/components/helpers.ts @@ -4,6 +4,9 @@ * Licensed under the MIT License. See License.txt in the project root for license information. */ +export type NbNullableInput = string | null | undefined; +export type NbBooleanInput = boolean | NbNullableInput; + export function convertToBoolProperty(val: any): boolean { if (typeof val === 'string') { val = val.toLowerCase().trim(); diff --git a/src/framework/theme/components/input/input.directive.ts b/src/framework/theme/components/input/input.directive.ts index 875ac434a7..e07192e313 100644 --- a/src/framework/theme/components/input/input.directive.ts +++ b/src/framework/theme/components/input/input.directive.ts @@ -21,7 +21,7 @@ import { import { Subject, BehaviorSubject } from 'rxjs'; import { map, finalize, takeUntil } from 'rxjs/operators'; -import { convertToBoolProperty, emptyStatusWarning } from '../helpers'; +import { convertToBoolProperty, emptyStatusWarning, NbBooleanInput } from '../helpers'; import { NbComponentSize } from '../component-size'; import { NbComponentShape } from '../component-shape'; import { NbComponentStatus } from '../component-status'; @@ -267,6 +267,7 @@ export class NbInputDirective implements DoCheck, OnChanges, OnInit, AfterViewIn this._fullWidth = convertToBoolProperty(value); } private _fullWidth = false; + static ngAcceptInputType_fullWidth: NbBooleanInput; constructor( protected elementRef: ElementRef, diff --git a/src/framework/theme/components/layout/layout.component.ts b/src/framework/theme/components/layout/layout.component.ts index 888d28293b..10f11ed12c 100644 --- a/src/framework/theme/components/layout/layout.component.ts +++ b/src/framework/theme/components/layout/layout.component.ts @@ -12,7 +12,7 @@ import { isPlatformBrowser } from '@angular/common'; import { BehaviorSubject, Subject } from 'rxjs'; import { filter, takeUntil } from 'rxjs/operators'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NbThemeService } from '../../services/theme.service'; import { NbSpinnerService } from '../../services/spinner.service'; import { NbLayoutDirectionService } from '../../services/direction.service'; @@ -157,6 +157,7 @@ export class NbLayoutComponent implements AfterViewInit, OnDestroy { set center(val: boolean) { this.centerValue = convertToBoolProperty(val); } + static ngAcceptInputType_center: NbBooleanInput; /** * Defines whether the layout enters a 'window' mode, when the layout content (including sidebars and fixed header) @@ -170,6 +171,7 @@ export class NbLayoutComponent implements AfterViewInit, OnDestroy { this.windowModeValue = convertToBoolProperty(val); this.withScroll = this.windowModeValue; } + static ngAcceptInputType_windowMode: NbBooleanInput; /** * Defines whether to move the scrollbars to layout or leave it at the body level. @@ -189,6 +191,7 @@ export class NbLayoutComponent implements AfterViewInit, OnDestroy { this.renderer.setStyle(body, 'overflow', 'initial'); } } + static ngAcceptInputType_withScroll: NbBooleanInput; /** * Restores scroll to the top of the page after navigation @@ -198,6 +201,7 @@ export class NbLayoutComponent implements AfterViewInit, OnDestroy { set restoreScrollTop(val: boolean) { this.restoreScrollTopValue = convertToBoolProperty(val); } + static ngAcceptInputType_restoreScrollTop: NbBooleanInput; // TODO remove as of 5.0.0 @ViewChild('layoutTopDynamicArea', { read: ViewContainerRef }) veryTopRef: ViewContainerRef; @@ -516,6 +520,7 @@ export class NbLayoutColumnComponent { this.leftValue = convertToBoolProperty(val); this.startValue = false; } + static ngAcceptInputType_left: NbBooleanInput; /** * Make column first in the layout. @@ -526,6 +531,7 @@ export class NbLayoutColumnComponent { this.startValue = convertToBoolProperty(val); this.leftValue = false; } + static ngAcceptInputType_start: NbBooleanInput; } /** @@ -583,6 +589,7 @@ export class NbLayoutHeaderComponent { set fixed(val: boolean) { this.fixedValue = convertToBoolProperty(val); } + static ngAcceptInputType_fixed: NbBooleanInput; /** * Places header on a side of the sidebar, and not above. @@ -595,6 +602,7 @@ export class NbLayoutHeaderComponent { this.fixedValue = false; this.layout.withSubheader = this.subheaderValue; } + static ngAcceptInputType_subheader: NbBooleanInput; } /** @@ -638,5 +646,6 @@ export class NbLayoutFooterComponent { set fixed(val: boolean) { this.fixedValue = convertToBoolProperty(val); } + static ngAcceptInputType_fixed: NbBooleanInput; } diff --git a/src/framework/theme/components/list/infinite-list.directive.ts b/src/framework/theme/components/list/infinite-list.directive.ts index cfb7f087b4..ff94736060 100644 --- a/src/framework/theme/components/list/infinite-list.directive.ts +++ b/src/framework/theme/components/list/infinite-list.directive.ts @@ -12,7 +12,7 @@ import { } from '@angular/core'; import { Observable, forkJoin, of as observableOf, interval, timer, Subject } from 'rxjs'; import { filter, switchMap, map, takeUntil, take } from 'rxjs/operators'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NbLayoutScrollService } from '../../services/scroll.service'; import { NbLayoutRulerService } from '../../services/ruler.service'; import { NbListItemComponent } from './list.component'; @@ -78,6 +78,7 @@ export class NbInfiniteListDirective implements AfterViewInit, OnDestroy { set listenWindowScroll(value) { this.windowScroll = convertToBoolProperty(value); } + static ngAcceptInputType_listenWindowScroll: NbBooleanInput; /** * Emits when distance between list bottom and current scroll position is less than threshold. diff --git a/src/framework/theme/components/menu/menu.component.ts b/src/framework/theme/components/menu/menu.component.ts index 072a3d3542..246eccf021 100644 --- a/src/framework/theme/components/menu/menu.component.ts +++ b/src/framework/theme/components/menu/menu.component.ts @@ -21,7 +21,7 @@ import { Router, NavigationEnd } from '@angular/router'; import { BehaviorSubject, Subject } from 'rxjs'; import { takeUntil, filter, map } from 'rxjs/operators'; import { NbMenuInternalService, NbMenuItem, NbMenuBag, NbMenuService } from './menu.service'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NB_WINDOW } from '../../theme.options'; import { animate, state, style, transition, trigger } from '@angular/animations'; import { NbLayoutDirectionService } from '../../services/direction.service'; @@ -251,6 +251,7 @@ export class NbMenuComponent implements OnInit, AfterViewInit, OnDestroy { this._autoCollapse = convertToBoolProperty(value); } protected _autoCollapse: boolean = false; + static ngAcceptInputType_autoCollapse: NbBooleanInput; protected destroy$ = new Subject(); diff --git a/src/framework/theme/components/option/option-group.component.spec.ts b/src/framework/theme/components/option/option-group.component.spec.ts index 9ac499a359..c6d52ab897 100644 --- a/src/framework/theme/components/option/option-group.component.spec.ts +++ b/src/framework/theme/components/option/option-group.component.spec.ts @@ -33,7 +33,7 @@ export class NbOptionGroupTestComponent { showOption = true; optionGroupTitle = ''; - @ViewChild(NbSelectComponent) selectComponent: NbSelectComponent; + @ViewChild(NbSelectComponent) selectComponent: NbSelectComponent; @ViewChild(NbOptionGroupComponent) optionGroupComponent: NbOptionGroupComponent; @ViewChild(NbOptionComponent) optionComponent: NbOptionComponent; } @@ -41,7 +41,7 @@ export class NbOptionGroupTestComponent { describe('NbOptionGroupComponent', () => { let fixture: ComponentFixture; let testComponent: NbOptionGroupTestComponent; - let selectComponent: NbSelectComponent; + let selectComponent: NbSelectComponent; let optionGroupComponent: NbOptionGroupComponent; let optionComponent: NbOptionComponent; diff --git a/src/framework/theme/components/option/option-group.component.ts b/src/framework/theme/components/option/option-group.component.ts index 1b5898731f..33cc751ed8 100644 --- a/src/framework/theme/components/option/option-group.component.ts +++ b/src/framework/theme/components/option/option-group.component.ts @@ -17,7 +17,7 @@ import { import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NbOptionComponent } from './option.component'; /** @@ -59,6 +59,7 @@ export class NbOptionGroupComponent implements AfterContentInit, OnDestroy { } } protected _disabled: boolean = false; + static ngAcceptInputType_disabled: NbBooleanInput; @HostBinding('attr.disabled') get disabledAttribute(): '' | null { diff --git a/src/framework/theme/components/option/option.component.ts b/src/framework/theme/components/option/option.component.ts index c7aba80c6c..cb2a8d516a 100644 --- a/src/framework/theme/components/option/option.component.ts +++ b/src/framework/theme/components/option/option.component.ts @@ -26,7 +26,7 @@ import { Observable, Subject } from 'rxjs'; // Component class scoped counter for aria attributes. let lastOptionId: number = 0; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NbFocusableOption } from '../cdk/a11y/focus-key-manager'; import { NbHighlightableOption } from '../cdk/a11y/descendant-key-manager'; import { NB_SELECT_INJECTION_TOKEN } from '../select/select-injection-tokens'; @@ -90,7 +90,7 @@ import { NbSelectComponent } from '../select/select.component'; `, }) -export class NbOptionComponent implements OnDestroy, AfterViewInit, NbFocusableOption, NbHighlightableOption { +export class NbOptionComponent implements OnDestroy, AfterViewInit, NbFocusableOption, NbHighlightableOption { protected disabledByGroup = false; @@ -107,6 +107,7 @@ export class NbOptionComponent implements OnDestroy, AfterViewInit, NbFocusab this._disabled = convertToBoolProperty(value); } protected _disabled: boolean = false; + static ngAcceptInputType_disabled: NbBooleanInput; /** * Fires value when option selection change. @@ -122,7 +123,7 @@ export class NbOptionComponent implements OnDestroy, AfterViewInit, NbFocusab } selected: boolean = false; - protected parent: NbSelectComponent; + protected parent: NbSelectComponent; protected alive: boolean = true; /** @@ -166,7 +167,7 @@ export class NbOptionComponent implements OnDestroy, AfterViewInit, NbFocusab get multiple() { // We check parent existing because parent can be NbSelectComponent or // NbAutocomplete and `miltiple` property exists only in NbSelectComponent - return this.parent ? (>this.parent).multiple : false; + return this.parent ? (this.parent as NbSelectComponent).multiple : false; } @HostBinding('class.selected') diff --git a/src/framework/theme/components/popover/popover.directive.ts b/src/framework/theme/components/popover/popover.directive.ts index 2760dc1663..64092035d7 100644 --- a/src/framework/theme/components/popover/popover.directive.ts +++ b/src/framework/theme/components/popover/popover.directive.ts @@ -18,9 +18,9 @@ import { import { NbDynamicOverlay, NbDynamicOverlayController } from '../cdk/overlay/dynamic/dynamic-overlay'; import { NbDynamicOverlayHandler } from '../cdk/overlay/dynamic/dynamic-overlay-handler'; -import { NbAdjustment, NbPosition } from '../cdk/overlay/overlay-position'; +import { NbAdjustment, NbPosition, NbPositionValues } from '../cdk/overlay/overlay-position'; import { NbOverlayContent } from '../cdk/overlay/overlay-service'; -import { NbTrigger } from '../cdk/overlay/overlay-trigger'; +import { NbTrigger, NbTriggerValues } from '../cdk/overlay/overlay-trigger'; import { NbPopoverComponent } from './popover.component'; import { takeUntil, skip } from 'rxjs/operators'; import { Subject } from 'rxjs'; @@ -140,6 +140,7 @@ export class NbPopoverDirective implements NbDynamicOverlayController, OnChanges * */ @Input('nbPopoverPlacement') position: NbPosition = NbPosition.TOP; + static ngAcceptInputType_position: NbPositionValues; /** * Container position will be changes automatically based on this strategy if container can't fit view port. @@ -167,6 +168,7 @@ export class NbPopoverDirective implements NbDynamicOverlayController, OnChanges * */ @Input('nbPopoverTrigger') trigger: NbTrigger = NbTrigger.CLICK; + static ngAcceptInputType_trigger: NbTriggerValues; /** * Sets popover offset diff --git a/src/framework/theme/components/radio/radio-group.component.ts b/src/framework/theme/components/radio/radio-group.component.ts index b4c7d3a564..df14fe8fba 100644 --- a/src/framework/theme/components/radio/radio-group.component.ts +++ b/src/framework/theme/components/radio/radio-group.component.ts @@ -23,7 +23,7 @@ import { isPlatformBrowser } from '@angular/common'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { fromEvent, merge, Subject } from 'rxjs'; import { filter, switchMap, takeUntil } from 'rxjs/operators'; -import { convertToBoolProperty, emptyStatusWarning } from '../helpers'; +import { convertToBoolProperty, emptyStatusWarning, NbBooleanInput } from '../helpers'; import { NB_DOCUMENT } from '../../theme.options'; import { NbRadioComponent } from './radio.component'; import { NbComponentStatus } from '../component-status'; @@ -113,6 +113,7 @@ export class NbRadioGroupComponent implements AfterContentInit, OnDestroy, Contr this.updateDisabled(); } protected _disabled: boolean; + static ngAcceptInputType_disabled: NbBooleanInput; /** * Radio buttons status. diff --git a/src/framework/theme/components/radio/radio.component.ts b/src/framework/theme/components/radio/radio.component.ts index 923be50ac0..c7db5cd29d 100644 --- a/src/framework/theme/components/radio/radio.component.ts +++ b/src/framework/theme/components/radio/radio.component.ts @@ -17,7 +17,7 @@ import { Renderer2, } from '@angular/core'; -import { convertToBoolProperty, emptyStatusWarning } from '../helpers'; +import { convertToBoolProperty, emptyStatusWarning, NbBooleanInput } from '../helpers'; import { NbComponentStatus } from '../component-status'; /** @@ -258,6 +258,7 @@ export class NbRadioComponent { } } private _checked: boolean = false; + static ngAcceptInputType_checked: NbBooleanInput; @Input() get value(): any { @@ -281,6 +282,7 @@ export class NbRadioComponent { } } private _disabled: boolean = false; + static ngAcceptInputType_disabled: NbBooleanInput; @Input() get status(): NbComponentStatus { diff --git a/src/framework/theme/components/route-tabset/route-tabset.component.ts b/src/framework/theme/components/route-tabset/route-tabset.component.ts index 2b63916cb9..2af09c2b97 100644 --- a/src/framework/theme/components/route-tabset/route-tabset.component.ts +++ b/src/framework/theme/components/route-tabset/route-tabset.component.ts @@ -5,7 +5,7 @@ */ import { Component, Input, Output, EventEmitter, HostBinding } from '@angular/core'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; /** * Route tabset components. @@ -136,6 +136,7 @@ export class NbRouteTabsetComponent { set fullWidth(val: boolean) { this.fullWidthValue = convertToBoolProperty(val); } + static ngAcceptInputType_fullWidth: NbBooleanInput; /** * Emits when tab is selected diff --git a/src/framework/theme/components/select/select.component.ts b/src/framework/theme/components/select/select.component.ts index f69d4d49e8..a4be9d7c03 100644 --- a/src/framework/theme/components/select/select.component.ts +++ b/src/framework/theme/components/select/select.component.ts @@ -48,7 +48,7 @@ import { NbComponentShape } from '../component-shape'; import { NbComponentStatus } from '../component-status'; import { NB_DOCUMENT } from '../../theme.options'; import { NbOptionComponent } from '../option/option.component'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NB_SELECT_INJECTION_TOKEN } from './select-injection-tokens'; import { NbFormFieldControl, NbFormFieldControlConfig } from '../form-field/form-field-control'; import { NbFocusMonitor } from '../cdk/a11y/a11y.module'; @@ -507,7 +507,7 @@ export function nbSelectFormFieldControlConfigFactory() { { provide: NbFormFieldControlConfig, useFactory: nbSelectFormFieldControlConfigFactory }, ], }) -export class NbSelectComponent implements OnChanges, AfterViewInit, AfterContentInit, OnDestroy, +export class NbSelectComponent implements OnChanges, AfterViewInit, AfterContentInit, OnDestroy, ControlValueAccessor, NbFormFieldControl { /** @@ -545,6 +545,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this.appearance = 'outline'; } } + static ngAcceptInputType_outline: NbBooleanInput; /** * Adds `filled` styles @@ -559,6 +560,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this.appearance = 'filled'; } } + static ngAcceptInputType_filled: NbBooleanInput; /** * Adds `hero` styles @@ -573,6 +575,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this.appearance = 'hero'; } } + static ngAcceptInputType_hero: NbBooleanInput; /** * Disables the select @@ -585,6 +588,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this._disabled = convertToBoolProperty(value); } protected _disabled: boolean; + static ngAcceptInputType_disabled: NbBooleanInput; /** * If set element will fill its container @@ -598,6 +602,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this._fullWidth = convertToBoolProperty(value); } protected _fullWidth: boolean = false; + static ngAcceptInputType_fullWidth: NbBooleanInput; /** * Renders select placeholder if nothing selected. @@ -608,10 +613,10 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont * Accepts selected item or array of selected items. * */ @Input() - set selected(value: T | T[]) { + set selected(value) { this.writeValue(value); } - get selected(): T | T[] { + get selected() { return this.multiple ? this.selectionModel.map(o => o.value) : this.selectionModel[0].value; @@ -628,17 +633,18 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this._multiple = convertToBoolProperty(value); } protected _multiple: boolean = false; + static ngAcceptInputType_multiple: NbBooleanInput; /** * Will be emitted when selected value changes. * */ - @Output() selectedChange: EventEmitter = new EventEmitter(); + @Output() selectedChange: EventEmitter = new EventEmitter(); /** * List of `NbOptionComponent`'s components passed as content. * TODO maybe it would be better provide wrapper * */ - @ContentChildren(NbOptionComponent, { descendants: true }) options: QueryList>; + @ContentChildren(NbOptionComponent, { descendants: true }) options: QueryList; /** * Custom select label, will be rendered instead of default enumeration with coma. @@ -663,7 +669,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont /** * List of selected options. * */ - selectionModel: NbOptionComponent[] = []; + selectionModel: NbOptionComponent[] = []; positionStrategy: NbAdjustableConnectedPositionStrategy; @@ -682,14 +688,14 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont protected destroy$ = new Subject(); - protected keyManager: NbFocusKeyManager>; + protected keyManager: NbFocusKeyManager; /** * If a user assigns value before content nb-options's rendered the value will be putted in this variable. * And then applied after content rendered. * Only the last value will be applied. * */ - protected queue: T | T[]; + protected queue; /** * Function passed through control value accessor to propagate changes. @@ -723,7 +729,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont protected positionBuilder: NbPositionBuilderService, protected triggerStrategyBuilder: NbTriggerStrategyBuilderService, protected cd: ChangeDetectorRef, - protected focusKeyManagerFactoryService: NbFocusKeyManagerFactoryService>, + protected focusKeyManagerFactoryService: NbFocusKeyManagerFactoryService, protected focusMonitor: NbFocusMonitor, protected renderer: Renderer2, protected zone: NgZone) { @@ -764,7 +770,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont * */ get selectionView() { if (this.selectionModel.length > 1) { - return this.selectionModel.map((option: NbOptionComponent) => option.content).join(', '); + return this.selectionModel.map((option: NbOptionComponent) => option.content).join(', '); } return this.selectionModel[0].content; @@ -855,7 +861,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this.cd.markForCheck(); } - writeValue(value: T | T[]): void { + writeValue(value): void { if (!this.alive) { return; } @@ -873,7 +879,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont /** * Selects option or clear all selected options if value is null. * */ - protected handleOptionClick(option: NbOptionComponent) { + protected handleOptionClick(option: NbOptionComponent) { this.queue = null; if (option.value == null) { this.reset(); @@ -888,7 +894,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont * Deselect all selected options. * */ protected reset() { - this.selectionModel.forEach((option: NbOptionComponent) => option.deselect()); + this.selectionModel.forEach((option: NbOptionComponent) => option.deselect()); this.selectionModel = []; this.hide(); this.button.nativeElement.focus(); @@ -898,7 +904,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont /** * Determines how to select option as multiple or single. * */ - protected selectOption(option: NbOptionComponent) { + protected selectOption(option: NbOptionComponent) { if (this.multiple) { this.handleMultipleSelect(option); } else { @@ -909,7 +915,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont /** * Select single option. * */ - protected handleSingleSelect(option: NbOptionComponent) { + protected handleSingleSelect(option: NbOptionComponent) { const selected = this.selectionModel.pop(); if (selected && selected !== option) { @@ -927,7 +933,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont /** * Select for multiple options. * */ - protected handleMultipleSelect(option: NbOptionComponent) { + protected handleMultipleSelect(option: NbOptionComponent) { if (option.selected) { this.selectionModel = this.selectionModel.filter(s => s.value !== option.value); option.deselect(); @@ -936,7 +942,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont option.select(); } - this.emitSelected(this.selectionModel.map((opt: NbOptionComponent) => opt.value)); + this.emitSelected(this.selectionModel.map((opt: NbOptionComponent) => opt.value)); } protected attachToOverlay() { @@ -1018,12 +1024,12 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this.options.changes .pipe( startWith(this.options), - switchMap((options: QueryList>) => { + switchMap((options: QueryList) => { return merge(...options.map(option => option.click)); }), takeUntil(this.destroy$), ) - .subscribe((clickedOption: NbOptionComponent) => this.handleOptionClick(clickedOption)); + .subscribe((clickedOption: NbOptionComponent) => this.handleOptionClick(clickedOption)); } protected subscribeOnOverlayKeys(): void { @@ -1070,7 +1076,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont /** * Propagate selected value. * */ - protected emitSelected(selected: T | T[]) { + protected emitSelected(selected) { this.onChange(selected); this.selectedChange.emit(selected); } @@ -1078,7 +1084,7 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont /** * Set selected value in model. * */ - protected setSelection(value: T | T[]) { + protected setSelection(value) { const isArray: boolean = Array.isArray(value); if (this.multiple && !isArray) { @@ -1093,15 +1099,15 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont this.selectionModel = []; if (isArray) { - ( value).forEach((option: T) => this.selectValue(option)); + value.forEach(option => this.selectValue(option)); } else { - this.selectValue( value); + this.selectValue(value); } // find options which were selected before and trigger deselect previouslySelectedOptions - .filter((option: NbOptionComponent) => !this.selectionModel.includes(option)) - .forEach((option: NbOptionComponent) => option.deselect()); + .filter((option: NbOptionComponent) => !this.selectionModel.includes(option)) + .forEach((option: NbOptionComponent) => option.deselect()); this.cd.markForCheck(); } @@ -1109,8 +1115,8 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterCont /** * Selects value. * */ - protected selectValue(value: T) { - const corresponding = this.options.find((option: NbOptionComponent) => option.value === value); + protected selectValue(value) { + const corresponding = this.options.find((option: NbOptionComponent) => option.value === value); if (corresponding) { corresponding.select(); diff --git a/src/framework/theme/components/select/select.spec.ts b/src/framework/theme/components/select/select.spec.ts index ccdd556019..b6e88a9351 100644 --- a/src/framework/theme/components/select/select.spec.ts +++ b/src/framework/theme/components/select/select.spec.ts @@ -154,7 +154,7 @@ export class NbReactiveFormSelectComponent { showSelect: boolean = true; formControl: FormControl = new FormControl(); - @ViewChild(NbSelectComponent) selectComponent: NbSelectComponent; + @ViewChild(NbSelectComponent) selectComponent: NbSelectComponent; @ViewChildren(NbOptionComponent) optionComponents: QueryList>; } @@ -295,7 +295,7 @@ export class NbOptionDisabledTestComponent { optionGroupDisabled = false; optionDisabled = false; - @ViewChild(NbSelectComponent) selectComponent: NbSelectComponent; + @ViewChild(NbSelectComponent) selectComponent: NbSelectComponent; @ViewChild(NbOptionGroupComponent) optionGroupComponent: NbOptionGroupComponent; @ViewChild(NbOptionComponent) optionComponent: NbOptionComponent; } @@ -305,7 +305,7 @@ describe('Component: NbSelectComponent', () => { let overlayContainerService: NbOverlayContainerAdapter; let overlayContainer: HTMLElement; let document: Document; - let select: NbSelectComponent; + let select: NbSelectComponent; const setSelectedAndOpen = selected => { fixture.componentInstance.selected = selected; @@ -658,7 +658,7 @@ describe('Component: NbSelectComponent', () => { const touchedSpy = jasmine.createSpy('touched spy'); const selectFixture = TestBed.createComponent(NbSelectComponent); - const selectComponent: NbSelectComponent = selectFixture.componentInstance; + const selectComponent: NbSelectComponent = selectFixture.componentInstance; selectFixture.detectChanges(); flush(); @@ -671,7 +671,7 @@ describe('Component: NbSelectComponent', () => { const touchedSpy = jasmine.createSpy('touched spy'); const selectFixture = TestBed.createComponent(NbSelectComponent); - select = selectFixture.componentInstance as NbSelectComponent; + select = selectFixture.componentInstance as NbSelectComponent; selectFixture.detectChanges(); flush(); @@ -685,7 +685,7 @@ describe('Component: NbSelectComponent', () => { describe('NbSelectComponent - falsy values', () => { let fixture: ComponentFixture; let testComponent: NbSelectWithFalsyOptionValuesComponent; - let select: NbSelectComponent; + let select: NbSelectComponent; beforeEach(fakeAsync(() => { TestBed.configureTestingModule({ @@ -830,7 +830,7 @@ describe('NbSelectComponent - falsy values', () => { describe('NbSelectComponent - Triggers', () => { let fixture: ComponentFixture; - let selectComponent: NbSelectComponent; + let selectComponent: NbSelectComponent; let triggerBuilderStub; let showTriggerStub: Subject; let hideTriggerStub: Subject; @@ -889,7 +889,7 @@ describe('NbSelectComponent - Triggers', () => { describe('NbSelectComponent - Key manager', () => { let fixture: ComponentFixture; - let selectComponent: NbSelectComponent; + let selectComponent: NbSelectComponent; let tabOutStub: Subject; let keyManagerFactoryStub; let keyManagerStub; @@ -1004,7 +1004,7 @@ describe('NbOptionComponent', () => { describe('NbOptionComponent disabled', () => { let fixture: ComponentFixture; let testComponent: NbOptionDisabledTestComponent; - let selectComponent: NbSelectComponent; + let selectComponent: NbSelectComponent; let optionGroupComponent: NbOptionGroupComponent; let optionComponent: NbOptionComponent; @@ -1072,7 +1072,7 @@ describe('NbSelect - dynamic options', () => { }); describe('Set value from queue', () => { - let selectComponent: NbSelectComponent; + let selectComponent: NbSelectComponent; beforeEach(() => { // Force select to cache the value as there is no options to select. @@ -1123,7 +1123,7 @@ describe('NbSelect - dynamic options', () => { testComponent.formControl = new FormControl(1); fixture.detectChanges(); - const selectComponent: NbSelectComponent = fixture.debugElement + const selectComponent: NbSelectComponent = fixture.debugElement .query(By.directive(NbSelectComponent)).componentInstance; testComponent.options = [0]; fixture.detectChanges(); @@ -1145,7 +1145,7 @@ describe('NbSelect - dynamic options', () => { testComponent.formControl = new FormControl(1); fixture.detectChanges(); - const selectComponent: NbSelectComponent = fixture.debugElement + const selectComponent: NbSelectComponent = fixture.debugElement .query(By.directive(NbSelectComponent)).componentInstance; testComponent.options = [0]; fixture.detectChanges(); @@ -1167,7 +1167,7 @@ describe('NbSelect - dynamic options', () => { testComponent.formControl = new FormControl(1); fixture.detectChanges(); - const selectComponent: NbSelectComponent = fixture.debugElement + const selectComponent: NbSelectComponent = fixture.debugElement .query(By.directive(NbSelectComponent)).componentInstance; const writeValueSpy = spyOn(selectComponent, 'writeValue').and.callThrough(); @@ -1191,7 +1191,7 @@ describe('NbSelect - dynamic options', () => { testComponent.formControl = new FormControl(2); fixture.detectChanges(); - const selectComponent: NbSelectComponent = fixture.debugElement + const selectComponent: NbSelectComponent = fixture.debugElement .query(By.directive(NbSelectComponent)).componentInstance; const writeValueSpy = spyOn(selectComponent, 'writeValue').and.callThrough(); diff --git a/src/framework/theme/components/sidebar/sidebar.component.ts b/src/framework/theme/components/sidebar/sidebar.component.ts index fef2bd5116..88124f60da 100644 --- a/src/framework/theme/components/sidebar/sidebar.component.ts +++ b/src/framework/theme/components/sidebar/sidebar.component.ts @@ -8,7 +8,7 @@ import { Component, HostBinding, Input, OnInit, OnDestroy, ElementRef, OnChanges import { Subscription, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NbThemeService } from '../../services/theme.service'; import { NbMediaBreakpoint } from '../../services/breakpoints.service'; import { NbSidebarService } from './sidebar.service'; @@ -178,6 +178,7 @@ export class NbSidebarComponent implements OnChanges, OnInit, OnDestroy { this.startValue = false; this.endValue = false; } + static ngAcceptInputType_right: NbBooleanInput; /** * Places sidebar on the left side @@ -190,6 +191,7 @@ export class NbSidebarComponent implements OnChanges, OnInit, OnDestroy { this.startValue = false; this.endValue = false; } + static ngAcceptInputType_left: NbBooleanInput; /** * Places sidebar on the start edge of layout @@ -202,6 +204,7 @@ export class NbSidebarComponent implements OnChanges, OnInit, OnDestroy { this.leftValue = false; this.rightValue = false; } + static ngAcceptInputType_start: NbBooleanInput; /** * Places sidebar on the end edge of layout @@ -214,6 +217,7 @@ export class NbSidebarComponent implements OnChanges, OnInit, OnDestroy { this.leftValue = false; this.rightValue = false; } + static ngAcceptInputType_end: NbBooleanInput; /** * Makes sidebar fixed (shown above the layout content) @@ -223,6 +227,7 @@ export class NbSidebarComponent implements OnChanges, OnInit, OnDestroy { set fixed(val: boolean) { this.fixedValue = convertToBoolProperty(val); } + static ngAcceptInputType_fixed: NbBooleanInput; /** * Makes sidebar container fixed @@ -232,6 +237,7 @@ export class NbSidebarComponent implements OnChanges, OnInit, OnDestroy { set containerFixed(val: boolean) { this.containerFixedValue = convertToBoolProperty(val); } + static ngAcceptInputType_containerFixed: NbBooleanInput; /** * Initial sidebar state, `expanded`|`collapsed`|`compacted` @@ -250,6 +256,7 @@ export class NbSidebarComponent implements OnChanges, OnInit, OnDestroy { set responsive(val: boolean) { this.responsiveValue = convertToBoolProperty(val); } + static ngAcceptInputType_responsive: NbBooleanInput; /** * Tags a sidebar with some ID, can be later used in the sidebar service diff --git a/src/framework/theme/components/stepper/step.component.ts b/src/framework/theme/components/stepper/step.component.ts index 36edc1737a..b2f31f8d74 100644 --- a/src/framework/theme/components/stepper/step.component.ts +++ b/src/framework/theme/components/stepper/step.component.ts @@ -1,8 +1,7 @@ import { Component, Inject, Input, TemplateRef, ViewChild } from '@angular/core'; -import { AbstractControl } from '@angular/forms'; import { NbStepperComponent } from './stepper.component'; import { NB_STEPPER } from './stepper-tokens'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; /** * Component intended to be used within the `` component. @@ -30,10 +29,8 @@ export class NbStepComponent { /** * Top level abstract control of the step - * - * @type {AbstractControl} */ - @Input() stepControl: AbstractControl; + @Input() stepControl?: { valid: boolean | null, reset: () => void }; /** * Step label @@ -47,7 +44,15 @@ export class NbStepComponent { * * @type {boolean} */ - @Input() hidden: false; + @Input() + get hidden(): boolean { + return this._hidden; + } + set hidden(value: boolean) { + this._hidden = convertToBoolProperty(value); + } + protected _hidden = false; + static ngAcceptInputType_hidden: NbBooleanInput; /** * Check that label is a TemplateRef. @@ -71,6 +76,7 @@ export class NbStepComponent { this._completed = convertToBoolProperty(value); } protected _completed: boolean = false; + static ngAcceptInputType_completed: NbBooleanInput; protected get isCompleted() { return this.stepControl ? this.stepControl.valid && this.interacted : this.interacted; diff --git a/src/framework/theme/components/stepper/stepper.component.html b/src/framework/theme/components/stepper/stepper.component.html index e35af7cc27..411744dc26 100644 --- a/src/framework/theme/components/stepper/stepper.component.html +++ b/src/framework/theme/components/stepper/stepper.component.html @@ -18,7 +18,7 @@
- + {{ step.label }}
diff --git a/src/framework/theme/components/stepper/stepper.component.ts b/src/framework/theme/components/stepper/stepper.component.ts index 3f1210b38f..5cf745b42e 100644 --- a/src/framework/theme/components/stepper/stepper.component.ts +++ b/src/framework/theme/components/stepper/stepper.component.ts @@ -6,11 +6,13 @@ import { Component, - ContentChildren, HostBinding, + ContentChildren, + HostBinding, Input, QueryList, + TemplateRef, } from '@angular/core'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NB_STEPPER } from './stepper-tokens'; import { NbStepComponent } from './step.component'; @@ -143,12 +145,13 @@ export class NbStepperComponent { return this._disableStepNavigation; } protected _disableStepNavigation: boolean = false; + static ngAcceptInputType_disableStepNavigation: NbBooleanInput; /** * Selected step component */ @Input() - get selected(): NbStepComponent | undefined { + get selected(): NbStepComponent { return this.steps ? this.steps.toArray()[this.selectedIndex] : undefined; } set selected(step: NbStepComponent) { @@ -175,6 +178,7 @@ export class NbStepperComponent { return this._linear; } protected _linear = true; + static ngAcceptInputType_linear: NbBooleanInput; @HostBinding('class.vertical') get vertical() { @@ -213,6 +217,16 @@ export class NbStepperComponent { return this.selected === step; } + /* + * @docs-private + **/ + getStepTemplate(step: NbStepComponent): TemplateRef | null { + if (step.isLabelTemplate) { + return step.label as TemplateRef; + } + return null; + } + protected isStepValid(index: number): boolean { return this.steps.toArray()[index].completed; } diff --git a/src/framework/theme/components/tabset/tabset.component.ts b/src/framework/theme/components/tabset/tabset.component.ts index 2d98a8ed66..be07007270 100644 --- a/src/framework/theme/components/tabset/tabset.component.ts +++ b/src/framework/theme/components/tabset/tabset.component.ts @@ -18,7 +18,7 @@ import { } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NbComponentStatus } from '../component-status'; import { NbBadgePosition } from '../badge/badge.component'; import { NbIconConfig } from '../icon/icon.component'; @@ -74,6 +74,7 @@ export class NbTabComponent { set disabled(val: boolean) { this.disabledValue = convertToBoolProperty(val); } + static ngAcceptInputType_disabled: NbBooleanInput; /** * Show only icons when width is smaller than `tabs-icon-only-max-width` @@ -83,10 +84,10 @@ export class NbTabComponent { set responsive(val: boolean) { this.responsiveValue = convertToBoolProperty(val); } - get responsive() { return this.responsiveValue; } + static ngAcceptInputType_responsive: NbBooleanInput; @Input() route: string; @@ -110,6 +111,7 @@ export class NbTabComponent { this.init = true; } } + static ngAcceptInputType_active: NbBooleanInput; /** * Lazy load content before tab selection @@ -120,6 +122,7 @@ export class NbTabComponent { set lazyLoad(val: boolean) { this.init = convertToBoolProperty(val); } + static ngAcceptInputType_lazyLoad: NbBooleanInput; /** * Badge text to display @@ -283,6 +286,7 @@ export class NbTabsetComponent implements AfterContentInit { set fullWidth(val: boolean) { this.fullWidthValue = convertToBoolProperty(val); } + static ngAcceptInputType_fullWidth: NbBooleanInput; /** * If specified - tabset listens to this parameter and selects corresponding tab. diff --git a/src/framework/theme/components/toggle/toggle.component.ts b/src/framework/theme/components/toggle/toggle.component.ts index 9671e8c3fd..f6978c82a1 100644 --- a/src/framework/theme/components/toggle/toggle.component.ts +++ b/src/framework/theme/components/toggle/toggle.component.ts @@ -27,7 +27,7 @@ import { takeUntil } from 'rxjs/operators'; import { NbLayoutDirectionService } from '../../services/direction.service'; import { NbComponentStatus } from '../component-status'; -import { convertToBoolProperty, emptyStatusWarning } from '../helpers'; +import { convertToBoolProperty, emptyStatusWarning, NbBooleanInput } from '../helpers'; /** * Toggle is a control representing `on` and `off` states. @@ -313,6 +313,7 @@ export class NbToggleComponent implements OnInit, AfterViewInit, OnDestroy, Cont this._checked = convertToBoolProperty(value); } private _checked: boolean = false; + static ngAcceptInputType_checked: NbBooleanInput; /** * Controls input disabled state @@ -325,6 +326,7 @@ export class NbToggleComponent implements OnInit, AfterViewInit, OnDestroy, Cont this._disabled = convertToBoolProperty(value); } private _disabled: boolean = false; + static ngAcceptInputType_disabled: NbBooleanInput; /** * Toggle status. diff --git a/src/framework/theme/components/tooltip/tooltip.directive.ts b/src/framework/theme/components/tooltip/tooltip.directive.ts index 450594ba73..884d81c675 100644 --- a/src/framework/theme/components/tooltip/tooltip.directive.ts +++ b/src/framework/theme/components/tooltip/tooltip.directive.ts @@ -19,7 +19,7 @@ import { skip, takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; import { NbComponentStatus } from '../component-status'; -import { NbAdjustment, NbPosition } from '../cdk/overlay/overlay-position'; +import { NbAdjustment, NbPosition, NbPositionValues } from '../cdk/overlay/overlay-position'; import { NbTrigger } from '../cdk/overlay/overlay-trigger'; import { NbDynamicOverlay } from '../cdk/overlay/dynamic/dynamic-overlay'; import { NbDynamicOverlayHandler } from '../cdk/overlay/dynamic/dynamic-overlay-handler'; @@ -90,6 +90,8 @@ export class NbTooltipDirective implements OnInit, OnChanges, AfterViewInit, OnD */ @Input('nbTooltipPlacement') position: NbPosition = NbPosition.TOP; + static ngAcceptInputType_position: NbPositionValues; + /** * Container position will change automatically based on this strategy if container can't fit view port. * Set this property to `noop` value if you want to disable automatic adjustment. diff --git a/src/framework/theme/components/tree-grid/tree-grid-sort.component.ts b/src/framework/theme/components/tree-grid/tree-grid-sort.component.ts index 6084dc9a5d..b0b82920cd 100644 --- a/src/framework/theme/components/tree-grid/tree-grid-sort.component.ts +++ b/src/framework/theme/components/tree-grid/tree-grid-sort.component.ts @@ -17,7 +17,7 @@ import { TemplateRef, } from '@angular/core'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput, NbNullableInput } from '../helpers'; import { NB_SORT_HEADER_COLUMN_DEF } from '../cdk/table/cell'; /** Column definition associated with a `NbSortHeaderDirective`. */ @@ -34,6 +34,7 @@ export interface NbSortable { sort(sortRequest: NbSortRequest); } +export type NbSortDirectionValues = 'asc' | 'desc' | ''; export enum NbSortDirection { ASCENDING = 'asc', DESCENDING = 'desc', @@ -51,6 +52,7 @@ const sortDirections: NbSortDirection[] = [ @Directive({ selector: '[nbSort]' }) export class NbSortDirective { @Input('nbSort') sortable: NbSortable; + static ngAcceptInputType_sortable: NbSortable | NbNullableInput; @Output() sort: EventEmitter = new EventEmitter(); @@ -129,6 +131,7 @@ export class NbSortHeaderComponent { * @type {NbSortDirection} */ @Input('nbSortHeader') direction: NbSortDirection; + static ngAcceptInputType_direction: NbSortDirectionValues; private disabledValue: boolean = false; @@ -143,6 +146,7 @@ export class NbSortHeaderComponent { get disabled(): boolean { return this.disabledValue; } + static ngAcceptInputType_disabled: NbBooleanInput; @HostListener('click') sortIfEnabled() { diff --git a/src/framework/theme/components/tree-grid/tree-grid.component.ts b/src/framework/theme/components/tree-grid/tree-grid.component.ts index 66b8ad3bf6..a912486682 100644 --- a/src/framework/theme/components/tree-grid/tree-grid.component.ts +++ b/src/framework/theme/components/tree-grid/tree-grid.component.ts @@ -33,7 +33,7 @@ import { NbToggleOptions } from './data-source/tree-grid.service'; import { NB_TREE_GRID } from './tree-grid-injection-tokens'; import { NbTreeGridRowComponent } from './tree-grid-row.component'; import { NbTreeGridCellDirective } from './tree-grid-cell.component'; -import { convertToBoolProperty } from '../helpers'; +import { convertToBoolProperty, NbBooleanInput } from '../helpers'; import { NbTreeGridColumnDefDirective } from './tree-grid-column-def.directive'; import { NbTreeGridFooterRowDefDirective, @@ -189,6 +189,7 @@ export class NbTreeGridComponent extends NbTable - + Front Card Header A nebula is an interstellar cloud of dust, hydrogen, @@ -12,7 +12,7 @@ - + Back Card Header A nebula is an interstellar cloud of dust, hydrogen, diff --git a/src/playground/with-layout/menu/menu-autocollapse.component.ts b/src/playground/with-layout/menu/menu-autocollapse.component.ts index 5a1d3180a5..41bc45cb54 100644 --- a/src/playground/with-layout/menu/menu-autocollapse.component.ts +++ b/src/playground/with-layout/menu/menu-autocollapse.component.ts @@ -5,6 +5,7 @@ */ import { ChangeDetectionStrategy, Component } from '@angular/core'; +import { NbMenuItem } from '@nebular/theme'; @Component({ selector: 'nb-menu-autocollapse', @@ -14,22 +15,19 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; export class MenuAutoCollapseComponent { - items = [ + items: NbMenuItem[] = [ { title: 'Profile', expanded: true, children: [ { title: 'Change Password', - link: [], // goes into angular `routerLink` }, { title: 'Privacy Policy', - url: '#', // goes directly into `href` attribute }, { title: 'Logout', - link: [], }, ], }, @@ -38,15 +36,12 @@ export class MenuAutoCollapseComponent { children: [ { title: 'First Product', - link: [], // goes into angular `routerLink` }, { title: 'Second Product', - url: '#', // goes directly into `href` attribute }, { title: 'Third Product', - link: [], }, ], }, @@ -55,15 +50,12 @@ export class MenuAutoCollapseComponent { children: [ { title: 'First Order', - link: [], // goes into angular `routerLink` }, { title: 'Second Order', - url: '#', // goes directly into `href` attribute }, { title: 'Third Order', - link: [], }, ], }, diff --git a/src/playground/with-layout/menu/menu-children.component.ts b/src/playground/with-layout/menu/menu-children.component.ts index d0f92b21de..e43bb85c6b 100644 --- a/src/playground/with-layout/menu/menu-children.component.ts +++ b/src/playground/with-layout/menu/menu-children.component.ts @@ -5,6 +5,7 @@ */ import { ChangeDetectionStrategy, Component } from '@angular/core'; +import { NbMenuItem } from '@nebular/theme'; @Component({ selector: 'nb-menu-children', @@ -13,32 +14,27 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; }) export class MenuChildrenComponent { - items = [ + items: NbMenuItem[] = [ { title: 'Profile', expanded: true, children: [ { title: 'Change Password', - link: [], // goes into angular `routerLink` }, { title: 'Privacy Policy', - url: '#', // goes directly into `href` attribute }, { title: 'Logout', - link: [], }, ], }, { title: 'Shopping Bag', - link: [], }, { title: 'Orders', - link: [], }, ]; } diff --git a/src/playground/with-layout/menu/menu-showcase.component.ts b/src/playground/with-layout/menu/menu-showcase.component.ts index 871075c461..de5a995526 100644 --- a/src/playground/with-layout/menu/menu-showcase.component.ts +++ b/src/playground/with-layout/menu/menu-showcase.component.ts @@ -5,6 +5,7 @@ */ import { ChangeDetectionStrategy, Component } from '@angular/core'; +import { NbMenuItem } from '@nebular/theme'; @Component({ selector: 'nb-menu-showcase', @@ -13,26 +14,22 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; }) export class MenuShowcaseComponent { - items = [ + items: NbMenuItem[] = [ { title: 'Profile', icon: 'person-outline', - link: [], }, { title: 'Change Password', icon: 'lock-outline', - link: [], }, { title: 'Privacy Policy', icon: { icon: 'checkmark-outline', pack: 'eva' }, - link: [], }, { title: 'Logout', icon: 'unlock-outline', - link: [], }, ]; } diff --git a/src/playground/with-layout/oauth2-password/oauth2-password-login.component.html b/src/playground/with-layout/oauth2-password/oauth2-password-login.component.html index 3408cfb7f4..bc79655744 100644 --- a/src/playground/with-layout/oauth2-password/oauth2-password-login.component.html +++ b/src/playground/with-layout/oauth2-password/oauth2-password-login.component.html @@ -43,7 +43,7 @@

OAuth2 Sign In with email/password

pattern=".+@.+..+" placeholder="Email address" autofocus - [status]="email.dirty ? (email.invalid ? 'danger' : 'success') : ''" + [status]="email.dirty ? (email.invalid ? 'danger' : 'success') : 'basic'" [required]="getConfigValue('forms.validation.email.required')" [attr.aria-invalid]="email.invalid && email.touched ? true : null"> @@ -66,7 +66,7 @@

OAuth2 Sign In with email/password

type="password" id="input-password" placeholder="Password" - [status]="password.dirty ? (password.invalid ? 'danger' : 'success') : ''" + [status]="password.dirty ? (password.invalid ? 'danger' : 'success') : 'basic'" [required]="getConfigValue('forms.validation.password.required')" [minlength]="getConfigValue('forms.validation.password.minLength')" [maxlength]="getConfigValue('forms.validation.password.maxLength')" diff --git a/src/playground/with-layout/oauth2-password/oauth2-password-login.component.ts b/src/playground/with-layout/oauth2-password/oauth2-password-login.component.ts index 95c0fd85a0..9e49e7be81 100644 --- a/src/playground/with-layout/oauth2-password/oauth2-password-login.component.ts +++ b/src/playground/with-layout/oauth2-password/oauth2-password-login.component.ts @@ -12,7 +12,7 @@ import { NB_AUTH_OPTIONS, nbAuthCreateToken, NbAuthJWTToken, - NbAuthToken, + NbAuthOAuth2Token, } from '@nebular/auth'; import { getDeepFromObject } from '../../../framework/auth/helpers'; @@ -23,7 +23,7 @@ import { getDeepFromObject } from '../../../framework/auth/helpers'; }) export class OAuth2PasswordLoginComponent { - token: NbAuthToken; + token: NbAuthOAuth2Token; redirectDelay: number = 0; showMessages: any = {}; strategy: string = ''; @@ -54,7 +54,7 @@ export class OAuth2PasswordLoginComponent { this.authService.authenticate(this.strategy, this.user).subscribe((result: NbAuthResult) => { this.submitted = false; - this.token = result.getToken(); + this.token = result.getToken() as NbAuthOAuth2Token; if (result.isSuccess()) { this.messages = result.getMessages(); } else { diff --git a/src/playground/with-layout/reveal-card/reveal-card-sizes.component.html b/src/playground/with-layout/reveal-card/reveal-card-sizes.component.html index 82df7653f9..90b6525ee5 100644 --- a/src/playground/with-layout/reveal-card/reveal-card-sizes.component.html +++ b/src/playground/with-layout/reveal-card/reveal-card-sizes.component.html @@ -1,6 +1,6 @@ - + Front Card Header A nebula is an interstellar cloud of dust, hydrogen, @@ -12,7 +12,7 @@ - + Back Card Header A nebula is an interstellar cloud of dust, hydrogen, diff --git a/src/playground/with-layout/spinner/spinner-card.component.ts b/src/playground/with-layout/spinner/spinner-card.component.ts index 2172de7e00..420aaa7d6b 100644 --- a/src/playground/with-layout/spinner/spinner-card.component.ts +++ b/src/playground/with-layout/spinner/spinner-card.component.ts @@ -3,7 +3,7 @@ import { Component } from '@angular/core'; @Component({ selector: 'nb-app-spinner-card', template: ` - diff --git a/src/playground/with-layout/spinner/spinner-tabs.component.ts b/src/playground/with-layout/spinner/spinner-tabs.component.ts index c76b8d6fcf..1d252e61cf 100644 --- a/src/playground/with-layout/spinner/spinner-tabs.component.ts +++ b/src/playground/with-layout/spinner/spinner-tabs.component.ts @@ -3,7 +3,7 @@ import { Component } from '@angular/core'; @Component({ selector: 'nb-app-spinner-tabs', template: ` - + diff --git a/src/playground/with-layout/stepper/stepper-linear.component.html b/src/playground/with-layout/stepper/stepper-linear.component.html index f2c6271460..cf639461ba 100644 --- a/src/playground/with-layout/stepper/stepper-linear.component.html +++ b/src/playground/with-layout/stepper/stepper-linear.component.html @@ -52,8 +52,8 @@ required nbInput ngModel - #somethingForm="ngModel" - [status]="somethingForm.invalid ? 'danger' : 'basic'"> + #somethingInput="ngModel" + [status]="somethingInput.invalid ? 'danger' : 'basic'">
diff --git a/src/playground/without-layout/menu/menu-test.component.ts b/src/playground/without-layout/menu/menu-test.component.ts index 51d7fddb39..aa08e2585e 100644 --- a/src/playground/without-layout/menu/menu-test.component.ts +++ b/src/playground/without-layout/menu/menu-test.component.ts @@ -17,7 +17,7 @@ import { NbMenuService, NbMenuItem } from '@nebular/theme'; - + @@ -25,7 +25,7 @@ import { NbMenuService, NbMenuItem } from '@nebular/theme'; - + @@ -33,7 +33,7 @@ import { NbMenuService, NbMenuItem } from '@nebular/theme'; - + @@ -43,7 +43,7 @@ import { NbMenuService, NbMenuItem } from '@nebular/theme'; `, }) export class MenuTestComponent implements OnInit, OnDestroy { - sidebarMenuItems = [ + sidebarMenuItems: NbMenuItem[] = [ { title: 'Menu Items', group: true, @@ -97,7 +97,7 @@ export class MenuTestComponent implements OnInit, OnDestroy { ], }, ]; - firstMenuItems = [ + firstMenuItems: NbMenuItem[] = [ { title: 'Menu Items', group: true, @@ -116,7 +116,7 @@ export class MenuTestComponent implements OnInit, OnDestroy { icon: 'home-outline', }, ]; - secondMenuItems = [ + secondMenuItems: NbMenuItem[] = [ { title: 'Menu items with fragments ', group: true, @@ -125,7 +125,7 @@ export class MenuTestComponent implements OnInit, OnDestroy { title: 'Menu #1', link: '/menu/menu-test.component/1', icon: 'home-outline', - pathMatch: 'partial', + pathMatch: 'prefix', }, { title: 'Menu #12 + fragment', diff --git a/src/playground/without-layout/smart-home/auth/login/login.component.html b/src/playground/without-layout/smart-home/auth/login/login.component.html index 88f7f1205d..37a67c5d21 100644 --- a/src/playground/without-layout/smart-home/auth/login/login.component.html +++ b/src/playground/without-layout/smart-home/auth/login/login.component.html @@ -27,7 +27,7 @@

Sign In

pattern=".+@.+\..+" placeholder="Email address" autofocus - [status]="email.dirty ? (email.invalid ? 'danger' : 'success') : ''" + [status]="email.dirty ? (email.invalid ? 'danger' : 'success') : 'basic'" [required]="getConfigValue('forms.validation.email.required')" [attr.aria-invalid]="email.invalid && email.touched ? true : null"> @@ -50,7 +50,7 @@

Sign In

type="password" id="input-password" placeholder="Password" - [status]="password.dirty ? (password.invalid ? 'danger' : 'success') : ''" + [status]="password.dirty ? (password.invalid ? 'danger' : 'success') : 'basic'" [required]="getConfigValue('forms.validation.password.required')" [minlength]="getConfigValue('forms.validation.password.minLength')" [maxlength]="getConfigValue('forms.validation.password.maxLength')" diff --git a/tsconfig.json b/tsconfig.json index 52775f66f0..a406ef030f 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -16,5 +16,8 @@ "es2017", "dom" ] + }, + "angularCompilerOptions": { + "strictTemplates": true } }