From 6eaf81abdca4ce4ad36ccbe2937a9c4b5c4f3f21 Mon Sep 17 00:00:00 2001 From: huess Date: Tue, 5 Oct 2021 22:28:37 +0200 Subject: [PATCH 1/8] feat(timepicker): allow displaying time in utc --- src/chronos/public_api.ts | 4 +++- src/timepicker/reducer/timepicker.reducer.ts | 4 +++- .../testing/timepicker-controls.util.spec.ts | 3 ++- .../testing/timepicker.component.spec.ts | 24 +++++++++++++++++++ src/timepicker/timepicker-controls.util.ts | 6 +++-- src/timepicker/timepicker.component.ts | 8 +++++-- src/timepicker/timepicker.config.ts | 2 ++ src/timepicker/timepicker.models.ts | 1 + 8 files changed, 45 insertions(+), 7 deletions(-) diff --git a/src/chronos/public_api.ts b/src/chronos/public_api.ts index 603acb0b28..9433ada3db 100644 --- a/src/chronos/public_api.ts +++ b/src/chronos/public_api.ts @@ -10,7 +10,9 @@ isSameDay, isSameMonth, getFullYear, getFirstDayOfMonth, -getMonth +getMonth, +getHours, +getMinutes, } from './utils/date-getters'; export { parseDate } from './create/local'; diff --git a/src/timepicker/reducer/timepicker.reducer.ts b/src/timepicker/reducer/timepicker.reducer.ts index 5ac8bcd05e..0c35a10d95 100644 --- a/src/timepicker/reducer/timepicker.reducer.ts +++ b/src/timepicker/reducer/timepicker.reducer.ts @@ -113,7 +113,9 @@ export function timepickerReducer(state = initialState, action: Action) { controls: _newControlsState }; - if (state.config.showMeridian !== _newState.config.showMeridian) { + if (state.config.showMeridian !== _newState.config.showMeridian || + state.config.useUtc !== _newState.config.useUtc + ) { if (state.value) { _newState.value = new Date(state.value); } diff --git a/src/timepicker/testing/timepicker-controls.util.spec.ts b/src/timepicker/testing/timepicker-controls.util.spec.ts index 1c959f5b1c..efa58061da 100644 --- a/src/timepicker/testing/timepicker-controls.util.spec.ts +++ b/src/timepicker/testing/timepicker-controls.util.spec.ts @@ -36,7 +36,8 @@ describe('Util: Timepicker-controls', () => { showSpinners: true, showMeridian: true, showSeconds: false, - meridians: ['AM', 'PM'] + meridians: ['AM', 'PM'], + useUtc: false }; controls = { diff --git a/src/timepicker/testing/timepicker.component.spec.ts b/src/timepicker/testing/timepicker.component.spec.ts index fa57cb55f1..14db06efac 100644 --- a/src/timepicker/testing/timepicker.component.spec.ts +++ b/src/timepicker/testing/timepicker.component.spec.ts @@ -6,6 +6,7 @@ import { By } from '@angular/platform-browser'; import { fireEvent } from '../../../scripts/helpers'; import '../../../scripts/jest/toHaveCssClass'; import { TimepickerActions, TimepickerComponent, TimepickerConfig, TimepickerModule } from '../index'; +import { padNumber } from '../timepicker.utils'; // eslint-disable-next-line @typescript-eslint/no-explicit-any function getInputElements(fixture: any) { @@ -1164,6 +1165,29 @@ describe('Component: TimepickerComponent', () => { })); }); + describe('use utc', () => { + beforeEach(() => { + fixture = TestBed.createComponent(TimepickerComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + + inputHours = getInputElements(fixture)[0]; + inputMinutes = getInputElements(fixture)[1]; + inputSeconds = getInputElements(fixture)[2]; + buttonChanges = getElements(fixture, 'a.btn'); + buttonMeridian = getElements(fixture, 'button')[0]; + }); + + it('should show utc values instead of client values', () => { + const time = testTime(12, 0, 0); + component.useUtc = true; + component.writeValue(time); + fixture.detectChanges(); + expect(inputHours.value).toBe(padNumber(time.getUTCHours())); + expect(inputMinutes.value).toBe(padNumber(time.getUTCMinutes())); + }); + }); + describe('custom placeholders', () => { beforeEach(() => { fixture = TestBed.createComponent(TimepickerComponent); diff --git a/src/timepicker/timepicker-controls.util.ts b/src/timepicker/timepicker-controls.util.ts index a9f4ff655c..b33e038e73 100644 --- a/src/timepicker/timepicker-controls.util.ts +++ b/src/timepicker/timepicker-controls.util.ts @@ -95,7 +95,8 @@ export function getControlsValue( showSeconds, meridians, min, - max + max, + useUtc } = state; return { @@ -111,7 +112,8 @@ export function getControlsValue( showSeconds, meridians, min, - max + max, + useUtc }; } diff --git a/src/timepicker/timepicker.component.ts b/src/timepicker/timepicker.component.ts index fc7b7abcf8..a71656f67d 100644 --- a/src/timepicker/timepicker.component.ts +++ b/src/timepicker/timepicker.component.ts @@ -10,6 +10,7 @@ import { Output, ViewEncapsulation } from '@angular/core'; +import { getHours, getMinutes } from 'ngx-bootstrap/chronos'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; @@ -120,6 +121,8 @@ export class TimepickerComponent @Output() isValid = new EventEmitter(); /** emits value of meridian*/ @Output() meridianChange = new EventEmitter(); + /** if true displays utc time instead of client time */ + @Input() useUtc = false; // ui variables hours = ''; minutes = ''; @@ -408,7 +411,8 @@ export class TimepickerComponent } const _hoursPerDayHalf = 12; - let _hours = _value.getHours(); + let _hours = getHours(_value, this.useUtc); + let _minutes = getMinutes(_value, this.useUtc); if (this.showMeridian) { this.meridian = this.meridians[_hours >= _hoursPerDayHalf ? 1 : 0]; @@ -421,7 +425,7 @@ export class TimepickerComponent } this.hours = padNumber(_hours); - this.minutes = padNumber(_value.getMinutes()); + this.minutes = padNumber(_minutes); this.seconds = padNumber(_value.getUTCSeconds()); } } diff --git a/src/timepicker/timepicker.config.ts b/src/timepicker/timepicker.config.ts index 4e45c22921..30f7c3538d 100644 --- a/src/timepicker/timepicker.config.ts +++ b/src/timepicker/timepicker.config.ts @@ -47,4 +47,6 @@ export class TimepickerConfig { ariaLabelMinutes = 'minutes'; /** seconds aria label */ ariaLabelSeconds = 'seconds'; + /** if true displays utc time instead of client time */ + useUtc = false; } diff --git a/src/timepicker/timepicker.models.ts b/src/timepicker/timepicker.models.ts index 5d04dc6c8a..9a0a61dec8 100644 --- a/src/timepicker/timepicker.models.ts +++ b/src/timepicker/timepicker.models.ts @@ -36,6 +36,7 @@ export interface TimepickerComponentState { showSeconds: boolean; meridians: string[]; + useUtc: boolean; } export type TimeChangeSource = 'wheel' | 'key' | ''; From 87c5048ff009228b9394e9c4f2b8bd810e2554cc Mon Sep 17 00:00:00 2001 From: huess Date: Tue, 5 Oct 2021 22:36:21 +0200 Subject: [PATCH 2/8] docs(timepicker): add documentation for useUtc property --- apps/ngx-bootstrap-docs/src/ng-api-doc.ts | 12 ++++++++++++ libs/doc-pages/timepicker/src/lib/demos/index.ts | 2 ++ .../timepicker/src/lib/demos/use-utc/use-utc.html | 9 +++++++++ .../timepicker/src/lib/demos/use-utc/use-utc.ts | 11 +++++++++++ .../timepicker/src/lib/timepicker-section.list.ts | 10 ++++++++++ 5 files changed, 44 insertions(+) create mode 100644 libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.html create mode 100644 libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.ts diff --git a/apps/ngx-bootstrap-docs/src/ng-api-doc.ts b/apps/ngx-bootstrap-docs/src/ng-api-doc.ts index ace012c51a..59ca03df69 100644 --- a/apps/ngx-bootstrap-docs/src/ng-api-doc.ts +++ b/apps/ngx-bootstrap-docs/src/ng-api-doc.ts @@ -4315,6 +4315,12 @@ export const ngdoc: any = { "defaultValue": "true", "type": "boolean", "description": "

if true spinner arrows above and below the inputs will be shown

\n" + }, + { + "name": "useUtc", + "defaultValue": "false", + "type": "boolean", + "description": "

if true displays utc time instead of client time

\n" } ], "outputs": [ @@ -4458,6 +4464,12 @@ export const ngdoc: any = { "defaultValue": "true", "type": "boolean", "description": "

if true spinner arrows above and below the inputs will be shown

\n" + }, + { + "name": "useUtc", + "defaultValue": "false", + "type": "boolean", + "description": "

if true displays utc time instead of client time

\n" } ] }, diff --git a/libs/doc-pages/timepicker/src/lib/demos/index.ts b/libs/doc-pages/timepicker/src/lib/demos/index.ts index 083fc0cc14..61b6e796cb 100644 --- a/libs/doc-pages/timepicker/src/lib/demos/index.ts +++ b/libs/doc-pages/timepicker/src/lib/demos/index.ts @@ -12,6 +12,7 @@ import { DemoTimepickerIsValidComponent } from './isvalid/isvalid'; import { DemoTimepickerMeridianComponent } from './meridian/meridian'; import { DemoTimepickerMinMaxComponent } from './min-max/min-max'; import { DemoTimepickerMousewheelComponent } from './mousewheel/mousewheel'; +import { DemoTimepickerUseUtcComponent } from './use-utc/use-utc'; import { DemoTimepickerPlaceholderComponent } from './placeholder/placeholder'; import { DemoTimepickerReadonlyComponent } from './readonly/readonly'; import { DemoTimepickerSpinnersComponent } from './spinners/spinners'; @@ -31,6 +32,7 @@ export const DEMO_COMPONENTS = [ DemoTimepickerToggleMinutesSecondsComponent, DemoTimepickerArrowkeysComponent, DemoTimepickerMousewheelComponent, + DemoTimepickerUseUtcComponent, DemoTimepickerCustomValidationComponent, DemoTimepickerIsValidComponent, DemoTimepickerCustomValidationComponent, diff --git a/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.html b/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.html new file mode 100644 index 0000000000..162fb1e67d --- /dev/null +++ b/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.html @@ -0,0 +1,9 @@ + + +
+
+ +
+
+ +
Time is: {{myTime}}
diff --git a/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.ts b/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.ts new file mode 100644 index 0000000000..95b2296fa4 --- /dev/null +++ b/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +@Component({ + // eslint-disable-next-line @angular-eslint/component-selector + selector: 'demo-timepicker-use-utc', + templateUrl: './use-utc.html' +}) +export class DemoTimepickerUseUtcComponent { + myTime: Date = new Date(); + useUtc = false; +} diff --git a/libs/doc-pages/timepicker/src/lib/timepicker-section.list.ts b/libs/doc-pages/timepicker/src/lib/timepicker-section.list.ts index b2bbd327b2..64e3e57946 100644 --- a/libs/doc-pages/timepicker/src/lib/timepicker-section.list.ts +++ b/libs/doc-pages/timepicker/src/lib/timepicker-section.list.ts @@ -26,6 +26,7 @@ import { } from '@ngx-bootstrap-doc/docs'; import { DemoTimepickerIsValidComponent } from './demos/isvalid/isvalid'; import { DemoTimepickerFormComponent } from './demos/form/form'; +import { DemoTimepickerUseUtcComponent } from './demos/use-utc/use-utc'; export const demoComponentContent: ContentSection[] = [ { @@ -169,6 +170,15 @@ export const demoComponentContent: ContentSection[] = [ component: require('!!raw-loader!./demos/config/config'), html: require('!!raw-loader!./demos/config/config.html'), outlet: DemoTimepickerConfigComponent + }, + { + title: 'Use utc', + anchor: 'use-utc', + component: require('!!raw-loader!./demos/use-utc/use-utc'), + html: require('!!raw-loader!./demos/use-utc/use-utc.html'), + description: `

useUtc can be used to display utc + time instead of client time.`, + outlet: DemoTimepickerUseUtcComponent } ] }, From 14b25310f7194f130113522658d36bec6bc1f381 Mon Sep 17 00:00:00 2001 From: huess Date: Tue, 5 Oct 2021 23:04:08 +0200 Subject: [PATCH 3/8] fix(timepicker): use const not let --- src/timepicker/timepicker.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/timepicker/timepicker.component.ts b/src/timepicker/timepicker.component.ts index a71656f67d..57fd665d58 100644 --- a/src/timepicker/timepicker.component.ts +++ b/src/timepicker/timepicker.component.ts @@ -412,7 +412,7 @@ export class TimepickerComponent const _hoursPerDayHalf = 12; let _hours = getHours(_value, this.useUtc); - let _minutes = getMinutes(_value, this.useUtc); + const _minutes = getMinutes(_value, this.useUtc); if (this.showMeridian) { this.meridian = this.meridians[_hours >= _hoursPerDayHalf ? 1 : 0]; From 4cce2a7064b25f62bb9aa606363b7aefb1125813 Mon Sep 17 00:00:00 2001 From: huess Date: Sun, 10 Oct 2021 14:20:35 +0200 Subject: [PATCH 4/8] fix(test): add missing property to utils test --- src/timepicker/testing/timepicker.utils.spec.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/timepicker/testing/timepicker.utils.spec.ts b/src/timepicker/testing/timepicker.utils.spec.ts index 01d89a07d2..d5011cd883 100644 --- a/src/timepicker/testing/timepicker.utils.spec.ts +++ b/src/timepicker/testing/timepicker.utils.spec.ts @@ -33,7 +33,8 @@ const controls: TimepickerComponentState = { showSpinners: false, showMeridian: true, showSeconds: true, - meridians: ['AM', 'PM'] + meridians: ['AM', 'PM'], + useUtc: false }; function testTime(hours?: number, minutes?: number, seconds?: number): Date { From d7d5d48fb033470fecf40e1745c22ffff4d984d9 Mon Sep 17 00:00:00 2001 From: huess Date: Sun, 14 Nov 2021 13:12:34 +0100 Subject: [PATCH 5/8] refactor(timepicker): transform input props to config props only --- apps/ngx-bootstrap-docs/src/ng-api-doc.ts | 6 ------ .../timepicker/src/lib/demos/use-utc/use-utc.html | 8 +------- .../timepicker/src/lib/demos/use-utc/use-utc.ts | 11 +++++++++-- src/timepicker/reducer/timepicker.reducer.ts | 4 +--- .../testing/timepicker-controls.util.spec.ts | 3 +-- src/timepicker/testing/timepicker.component.spec.ts | 2 +- src/timepicker/testing/timepicker.utils.spec.ts | 3 +-- src/timepicker/timepicker-controls.util.ts | 6 ++---- src/timepicker/timepicker.component.ts | 6 ++---- src/timepicker/timepicker.models.ts | 1 - 10 files changed, 18 insertions(+), 32 deletions(-) diff --git a/apps/ngx-bootstrap-docs/src/ng-api-doc.ts b/apps/ngx-bootstrap-docs/src/ng-api-doc.ts index 59ca03df69..ce23d944a9 100644 --- a/apps/ngx-bootstrap-docs/src/ng-api-doc.ts +++ b/apps/ngx-bootstrap-docs/src/ng-api-doc.ts @@ -4315,12 +4315,6 @@ export const ngdoc: any = { "defaultValue": "true", "type": "boolean", "description": "

if true spinner arrows above and below the inputs will be shown

\n" - }, - { - "name": "useUtc", - "defaultValue": "false", - "type": "boolean", - "description": "

if true displays utc time instead of client time

\n" } ], "outputs": [ diff --git a/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.html b/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.html index 162fb1e67d..00e678fdf1 100644 --- a/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.html +++ b/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.html @@ -1,9 +1,3 @@ - - -
-
- -
-
+ 
Time is: {{myTime}}
diff --git a/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.ts b/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.ts index 95b2296fa4..24af89d99b 100644 --- a/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.ts +++ b/libs/doc-pages/timepicker/src/lib/demos/use-utc/use-utc.ts @@ -1,11 +1,18 @@ import { Component } from '@angular/core'; +import { TimepickerConfig } from 'ngx-bootstrap/timepicker'; + +export function getTimepickerConfig(): TimepickerConfig { + return Object.assign(new TimepickerConfig(), { + useUtc: true + }); +} @Component({ // eslint-disable-next-line @angular-eslint/component-selector selector: 'demo-timepicker-use-utc', - templateUrl: './use-utc.html' + templateUrl: './use-utc.html', + providers: [{ provide: TimepickerConfig, useFactory: getTimepickerConfig }] }) export class DemoTimepickerUseUtcComponent { myTime: Date = new Date(); - useUtc = false; } diff --git a/src/timepicker/reducer/timepicker.reducer.ts b/src/timepicker/reducer/timepicker.reducer.ts index 0c35a10d95..5ac8bcd05e 100644 --- a/src/timepicker/reducer/timepicker.reducer.ts +++ b/src/timepicker/reducer/timepicker.reducer.ts @@ -113,9 +113,7 @@ export function timepickerReducer(state = initialState, action: Action) { controls: _newControlsState }; - if (state.config.showMeridian !== _newState.config.showMeridian || - state.config.useUtc !== _newState.config.useUtc - ) { + if (state.config.showMeridian !== _newState.config.showMeridian) { if (state.value) { _newState.value = new Date(state.value); } diff --git a/src/timepicker/testing/timepicker-controls.util.spec.ts b/src/timepicker/testing/timepicker-controls.util.spec.ts index efa58061da..1c959f5b1c 100644 --- a/src/timepicker/testing/timepicker-controls.util.spec.ts +++ b/src/timepicker/testing/timepicker-controls.util.spec.ts @@ -36,8 +36,7 @@ describe('Util: Timepicker-controls', () => { showSpinners: true, showMeridian: true, showSeconds: false, - meridians: ['AM', 'PM'], - useUtc: false + meridians: ['AM', 'PM'] }; controls = { diff --git a/src/timepicker/testing/timepicker.component.spec.ts b/src/timepicker/testing/timepicker.component.spec.ts index 14db06efac..f675b55956 100644 --- a/src/timepicker/testing/timepicker.component.spec.ts +++ b/src/timepicker/testing/timepicker.component.spec.ts @@ -1180,7 +1180,7 @@ describe('Component: TimepickerComponent', () => { it('should show utc values instead of client values', () => { const time = testTime(12, 0, 0); - component.useUtc = true; + component.config.useUtc = true; component.writeValue(time); fixture.detectChanges(); expect(inputHours.value).toBe(padNumber(time.getUTCHours())); diff --git a/src/timepicker/testing/timepicker.utils.spec.ts b/src/timepicker/testing/timepicker.utils.spec.ts index d5011cd883..01d89a07d2 100644 --- a/src/timepicker/testing/timepicker.utils.spec.ts +++ b/src/timepicker/testing/timepicker.utils.spec.ts @@ -33,8 +33,7 @@ const controls: TimepickerComponentState = { showSpinners: false, showMeridian: true, showSeconds: true, - meridians: ['AM', 'PM'], - useUtc: false + meridians: ['AM', 'PM'] }; function testTime(hours?: number, minutes?: number, seconds?: number): Date { diff --git a/src/timepicker/timepicker-controls.util.ts b/src/timepicker/timepicker-controls.util.ts index b33e038e73..a9f4ff655c 100644 --- a/src/timepicker/timepicker-controls.util.ts +++ b/src/timepicker/timepicker-controls.util.ts @@ -95,8 +95,7 @@ export function getControlsValue( showSeconds, meridians, min, - max, - useUtc + max } = state; return { @@ -112,8 +111,7 @@ export function getControlsValue( showSeconds, meridians, min, - max, - useUtc + max }; } diff --git a/src/timepicker/timepicker.component.ts b/src/timepicker/timepicker.component.ts index 57fd665d58..f78e8c1a10 100644 --- a/src/timepicker/timepicker.component.ts +++ b/src/timepicker/timepicker.component.ts @@ -121,8 +121,6 @@ export class TimepickerComponent @Output() isValid = new EventEmitter(); /** emits value of meridian*/ @Output() meridianChange = new EventEmitter(); - /** if true displays utc time instead of client time */ - @Input() useUtc = false; // ui variables hours = ''; minutes = ''; @@ -411,8 +409,8 @@ export class TimepickerComponent } const _hoursPerDayHalf = 12; - let _hours = getHours(_value, this.useUtc); - const _minutes = getMinutes(_value, this.useUtc); + let _hours = getHours(_value, this.config.useUtc); + const _minutes = getMinutes(_value, this.config.useUtc); if (this.showMeridian) { this.meridian = this.meridians[_hours >= _hoursPerDayHalf ? 1 : 0]; diff --git a/src/timepicker/timepicker.models.ts b/src/timepicker/timepicker.models.ts index 9a0a61dec8..5d04dc6c8a 100644 --- a/src/timepicker/timepicker.models.ts +++ b/src/timepicker/timepicker.models.ts @@ -36,7 +36,6 @@ export interface TimepickerComponentState { showSeconds: boolean; meridians: string[]; - useUtc: boolean; } export type TimeChangeSource = 'wheel' | 'key' | ''; From 57a60d11b7828883467a655c340e3d0832b8d40e Mon Sep 17 00:00:00 2001 From: Umanskiy Aleksey Date: Tue, 16 Jul 2024 09:42:58 +0300 Subject: [PATCH 6/8] fix(timepicker): fixed tests --- src/timepicker/testing/timepicker.component.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/timepicker/testing/timepicker.component.spec.ts b/src/timepicker/testing/timepicker.component.spec.ts index cd847af415..68e8ca7a66 100644 --- a/src/timepicker/testing/timepicker.component.spec.ts +++ b/src/timepicker/testing/timepicker.component.spec.ts @@ -1197,7 +1197,7 @@ describe('Component: TimepickerComponent', () => { inputHours = getInputElements(fixture)[0]; inputMinutes = getInputElements(fixture)[1]; inputSeconds = getInputElements(fixture)[2]; - buttonChanges = getElements(fixture, 'a.btn'); + buttngOnChangess = getElements(fixture, 'a.btn'); buttonMeridian = getElements(fixture, 'button')[0]; }); From d942ade43aada0bdd720d9498f645ab664516c4a Mon Sep 17 00:00:00 2001 From: Umanskiy Aleksey Date: Tue, 16 Jul 2024 11:46:21 +0300 Subject: [PATCH 7/8] fix(timepicker): fixed tests --- src/chronos/public_api.ts | 2 +- src/locale/public_api.ts | 2 +- src/timepicker/jest.config.ts | 3 ++- src/timepicker/testing/timepicker.component.spec.ts | 6 +++--- 4 files changed, 7 insertions(+), 6 deletions(-) diff --git a/src/chronos/public_api.ts b/src/chronos/public_api.ts index 3092a390db..bb3cc0445b 100644 --- a/src/chronos/public_api.ts +++ b/src/chronos/public_api.ts @@ -50,7 +50,7 @@ export { esUsLocale } from './i18n/es-us'; export { etLocale } from './i18n/et'; export { fiLocale } from './i18n/fi'; export { frLocale } from './i18n/fr'; -export {frCaLocale} from './i18n/fr-ca'; +export { frCaLocale } from './i18n/fr-ca'; export { glLocale } from './i18n/gl'; export { heLocale } from './i18n/he'; export { hiLocale } from './i18n/hi'; diff --git a/src/locale/public_api.ts b/src/locale/public_api.ts index c3932ae907..23d8c3f527 100644 --- a/src/locale/public_api.ts +++ b/src/locale/public_api.ts @@ -12,7 +12,7 @@ export { esUsLocale } from 'ngx-bootstrap/chronos'; export { etLocale } from 'ngx-bootstrap/chronos'; export { fiLocale } from 'ngx-bootstrap/chronos'; export { frLocale } from 'ngx-bootstrap/chronos'; -export {frCaLocale} from 'ngx-bootstrap/chronos'; +export { frCaLocale } from 'ngx-bootstrap/chronos'; export { glLocale } from 'ngx-bootstrap/chronos'; export { heLocale } from 'ngx-bootstrap/chronos'; export { hiLocale } from 'ngx-bootstrap/chronos'; diff --git a/src/timepicker/jest.config.ts b/src/timepicker/jest.config.ts index 41be90a3ca..7dd852669d 100644 --- a/src/timepicker/jest.config.ts +++ b/src/timepicker/jest.config.ts @@ -15,7 +15,8 @@ export default { 'jest-preset-angular', { tsconfig: '/tsconfig.spec.json', - stringifyContentPathRegex: '\\.(html|svg)$' + stringifyContentPathRegex: '\\.(html|svg)$', + isolatedModules: true } ] }, diff --git a/src/timepicker/testing/timepicker.component.spec.ts b/src/timepicker/testing/timepicker.component.spec.ts index 68e8ca7a66..6183d4d40f 100644 --- a/src/timepicker/testing/timepicker.component.spec.ts +++ b/src/timepicker/testing/timepicker.component.spec.ts @@ -1077,7 +1077,7 @@ describe('Component: TimepickerComponent', () => { component.updateHours(inputHours); expect(component.invalidHours).toEqual(false); - expect(component._updateTime).toHaveBeenCalled(); + expect(component._updateTime).toHaveBeenCalled(); }); it('should clear model if minute input is invalid', () => { @@ -1117,7 +1117,7 @@ describe('Component: TimepickerComponent', () => { component.updateMinutes(inputMinutes); expect(component.invalidMinutes).toEqual(false); - expect(component._updateTime).toHaveBeenCalled(); + expect(component._updateTime).toHaveBeenCalled(); }); it('should clear model if second input is invalid', () => { @@ -1159,7 +1159,7 @@ describe('Component: TimepickerComponent', () => { component.updateSeconds(inputSeconds); expect(component.invalidSeconds).toEqual(false); - expect(component._updateTime).toHaveBeenCalled(); + expect(component._updateTime).toHaveBeenCalled(); }); it('should valid value in input fields', fakeAsync(() => { From c7b9d0df8f85d250529fbeb4a8dadf6bbc61c797 Mon Sep 17 00:00:00 2001 From: Umanskiy Aleksey Date: Tue, 16 Jul 2024 14:24:18 +0300 Subject: [PATCH 8/8] feat(accordion): migrated to standalone --- .../schematics/schematics.component.html | 2 +- .../accordion/src/lib/accordion.module.ts | 2 +- .../doc-pages/accordion/src/lib/docs/usage.md | 2 +- src/accordion/accordion-group.component.ts | 20 +++++++++++-------- src/accordion/accordion.component.ts | 19 +++++++++--------- src/accordion/accordion.module.ts | 15 ++++---------- .../testing/accordion.component.spec.ts | 17 ++++++++-------- 7 files changed, 38 insertions(+), 39 deletions(-) diff --git a/libs/common-docs/src/lib/common/schematics/schematics.component.html b/libs/common-docs/src/lib/common/schematics/schematics.component.html index e3c89fbff3..bee3230604 100644 --- a/libs/common-docs/src/lib/common/schematics/schematics.component.html +++ b/libs/common-docs/src/lib/common/schematics/schematics.component.html @@ -138,7 +138,7 @@

Schematics

], imports: [ … - AccordionModule.forRoot(), + AccordionModule, ], bootstrap: [AppComponent] {{'}'}}) diff --git a/libs/doc-pages/accordion/src/lib/accordion.module.ts b/libs/doc-pages/accordion/src/lib/accordion.module.ts index 8cdc8ced3e..06e856a2d8 100644 --- a/libs/doc-pages/accordion/src/lib/accordion.module.ts +++ b/libs/doc-pages/accordion/src/lib/accordion.module.ts @@ -17,7 +17,7 @@ export { AccordionSectionComponent } from './accordion-section.component'; ...DEMO_COMPONENTS ], imports: [ - AccordionModule.forRoot(), + AccordionModule, CommonModule, FormsModule, DocsModule, diff --git a/libs/doc-pages/accordion/src/lib/docs/usage.md b/libs/doc-pages/accordion/src/lib/docs/usage.md index 7f803207de..a263020fad 100644 --- a/libs/doc-pages/accordion/src/lib/docs/usage.md +++ b/libs/doc-pages/accordion/src/lib/docs/usage.md @@ -5,7 +5,7 @@ import { AccordionModule } from 'ngx-bootstrap/accordion'; @NgModule({ imports: [ BrowserAnimationsModule, - AccordionModule.forRoot(), + AccordionModule, ... ] }) diff --git a/src/accordion/accordion-group.component.ts b/src/accordion/accordion-group.component.ts index f0dbc8ecd7..20e01f29a4 100644 --- a/src/accordion/accordion-group.component.ts +++ b/src/accordion/accordion-group.component.ts @@ -2,6 +2,8 @@ import { Component, HostBinding, Inject, Input, OnDestroy, OnInit, Output, EventEmitter } from '@angular/core'; import { AccordionComponent } from './accordion.component'; +import { CollapseModule } from 'ngx-bootstrap/collapse'; +import { NgClass, NgIf } from '@angular/common'; /** * ### Accordion heading @@ -10,14 +12,16 @@ import { AccordionComponent } from './accordion.component'; * will be used as group's header template. */ @Component({ - selector: 'accordion-group, accordion-panel', - templateUrl: './accordion-group.component.html', - // eslint-disable-next-line @angular-eslint/no-host-metadata-property - host: { - class: 'panel', - style: 'display: block' - }, - styleUrls: ['./accordion.scss'] + selector: 'accordion-group, accordion-panel', + templateUrl: './accordion-group.component.html', + // eslint-disable-next-line @angular-eslint/no-host-metadata-property + host: { + class: 'panel', + style: 'display: block' + }, + styleUrls: ['./accordion.scss'], + standalone: true, + imports: [NgClass, NgIf, CollapseModule] }) export class AccordionPanelComponent implements OnInit, OnDestroy { /** turn on/off animation */ diff --git a/src/accordion/accordion.component.ts b/src/accordion/accordion.component.ts index 6fd63d7cfa..c6782fa87a 100644 --- a/src/accordion/accordion.component.ts +++ b/src/accordion/accordion.component.ts @@ -4,15 +4,16 @@ import { AccordionConfig } from './accordion.config'; /** Displays collapsible content panels for presenting information in a limited amount of space. */ @Component({ - selector: 'accordion', - template: ``, - // eslint-disable-next-line @angular-eslint/no-host-metadata-property - host: { - '[attr.aria-multiselectable]': 'closeOthers', - role: 'tablist', - class: 'panel-group', - style: 'display: block' - } + selector: 'accordion', + template: ``, + // eslint-disable-next-line @angular-eslint/no-host-metadata-property + host: { + '[attr.aria-multiselectable]': 'closeOthers', + role: 'tablist', + class: 'panel-group', + style: 'display: block' + }, + standalone: true }) export class AccordionComponent { /** turn on/off animation */ diff --git a/src/accordion/accordion.module.ts b/src/accordion/accordion.module.ts index 667f85686d..4dd2978be8 100644 --- a/src/accordion/accordion.module.ts +++ b/src/accordion/accordion.module.ts @@ -1,17 +1,10 @@ -import { CommonModule } from '@angular/common'; -import { NgModule, ModuleWithProviders } from '@angular/core'; +import { NgModule } from '@angular/core'; import { AccordionComponent } from './accordion.component'; import { AccordionPanelComponent } from './accordion-group.component'; -import { CollapseModule } from 'ngx-bootstrap/collapse'; @NgModule({ - imports: [CommonModule, CollapseModule], - declarations: [AccordionComponent, AccordionPanelComponent], - exports: [AccordionComponent, AccordionPanelComponent] + imports: [AccordionComponent, AccordionPanelComponent], + exports: [AccordionComponent, AccordionPanelComponent] }) -export class AccordionModule { - static forRoot(): ModuleWithProviders { - return { ngModule: AccordionModule, providers: [] }; - } -} +export class AccordionModule {} diff --git a/src/accordion/testing/accordion.component.spec.ts b/src/accordion/testing/accordion.component.spec.ts index 335a2c0eee..f10d4e17ab 100644 --- a/src/accordion/testing/accordion.component.spec.ts +++ b/src/accordion/testing/accordion.component.spec.ts @@ -4,8 +4,9 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { AccordionConfig, AccordionModule } from '../index'; @Component({ - selector: 'accordion-test', - template: '' + selector: 'accordion-test', + template: '', + standalone: true }) class TestAccordionComponent { oneAtATime = true; @@ -75,12 +76,12 @@ describe('Component: Accordion', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [TestAccordionComponent], - imports: [ - AccordionModule.forRoot(), - BrowserAnimationsModule - ] - }); + imports: [ + AccordionModule, + BrowserAnimationsModule, + TestAccordionComponent + ] +}); TestBed.overrideComponent(TestAccordionComponent, { set: { template: html } });