From b8ab4d8e4c7473be7965431d5215c49f07e7b1bd Mon Sep 17 00:00:00 2001 From: Vladimir Potekhin <46284632+vladimirpotekhin@users.noreply.github.com> Date: Tue, 12 Jul 2022 18:07:36 +0300 Subject: [PATCH] refactor(addon-commerce, addon-chart)!: remove deprecated enums (#2095) --- .../components/axes/axes.component.ts | 22 +-- projects/addon-charts/enums/index.ts | 1 - projects/addon-charts/enums/line-type.ts | 11 -- projects/addon-charts/enums/package.json | 7 - projects/addon-charts/index.ts | 1 - projects/addon-charts/types/line-handler.ts | 4 +- projects/addon-charts/types/line-type.ts | 2 +- .../components/card/card.component.ts | 38 ++--- .../input-card-grouped.component.ts | 85 +++++----- .../input-card/input-card.component.ts | 34 ++-- .../test/input-card.component.spec.ts | 13 +- .../components/money/money-options.ts | 4 +- .../components/money/money.component.ts | 4 +- .../money/pipes/sign-symbol.pipe.ts | 4 +- .../money/test/money.component.spec.ts | 148 +++++++++--------- .../money/utils/format-sign-symbol.ts | 4 +- .../constants/default-card-validator.ts | 4 +- projects/addon-commerce/enums/index.ts | 2 - projects/addon-commerce/enums/money-sign.ts | 16 -- .../addon-commerce/enums/payment-system.ts | 9 -- projects/addon-commerce/types/index.ts | 1 + projects/addon-commerce/types/money-sign.ts | 2 +- .../addon-commerce/types/payment-system.ts | 1 + .../utils/get-currency-symbol.ts | 8 +- .../utils/get-payment-system.ts | 74 +++------ .../utils/is-card-length-valid.ts | 21 +-- .../utils/is-card-number-valid.ts | 9 +- .../utils/test/get-currency-symbol.spec.ts | 22 +-- .../utils/test/get-payment-system.spec.ts | 107 +++++++------ .../utils/test/is-card-length-valid.spec.ts | 88 +++++------ .../validators/card-number.validator.ts | 6 +- .../validators/luhn.validator.ts | 6 +- .../editor-new/editor-new.component.ts | 63 +++++--- .../components/editor/editor.component.ts | 4 +- .../toolbar-navigation-manager.directive.ts | 4 +- .../toolbar-new/toolbar-new.component.ts | 8 +- .../components/toolbar/toolbar.component.ts | 8 +- .../touchable/touchable.directive.ts | 34 ++-- projects/addon-mobile/enums/index.ts | 1 - projects/addon-mobile/enums/package.json | 7 - projects/addon-mobile/enums/touch-mode.ts | 8 - projects/addon-mobile/index.ts | 1 - projects/addon-mobile/types/touch-mode.ts | 2 +- .../schematics/ng-update/constants/enums.ts | 11 ++ .../cdk/utils/focus/blur-native-focused.ts | 3 +- .../cdk/utils/focus/is-native-focused-in.ts | 5 +- .../focus/tests/is-native-focused-in.spec.ts | 6 +- .../data-list/data-list.component.ts | 4 +- .../hosted-dropdown.component.ts | 8 +- .../components/loader/loader.component.ts | 4 +- .../primitive-textfield.component.ts | 7 +- .../src/modules/charts/axes/axes.component.ts | 49 +++--- .../charts/bar-chart/bar-chart.component.ts | 4 +- .../charts/pie-chart/pie-chart.component.ts | 4 +- .../modules/components/card/card.component.ts | 8 +- .../components/card/examples/3/index.ts | 10 +- .../components/money/money.component.ts | 48 +++--- .../modules/utils/format/examples/3/index.ts | 4 +- .../utils/miscellaneous/examples/4/index.ts | 4 +- .../kit/components/filter/filter.component.ts | 4 +- .../input-range/input-range.component.ts | 4 +- .../input-tag/input-tag.component.ts | 4 +- .../pagination/pagination.component.ts | 4 +- .../radio-list/radio-list.component.ts | 4 +- .../kit/components/range/range.component.ts | 4 +- .../dropdown-hover.directive.ts | 22 +-- 66 files changed, 512 insertions(+), 611 deletions(-) delete mode 100644 projects/addon-charts/enums/index.ts delete mode 100644 projects/addon-charts/enums/line-type.ts delete mode 100644 projects/addon-charts/enums/package.json delete mode 100644 projects/addon-commerce/enums/money-sign.ts delete mode 100644 projects/addon-commerce/enums/payment-system.ts create mode 100644 projects/addon-commerce/types/payment-system.ts delete mode 100644 projects/addon-mobile/enums/index.ts delete mode 100644 projects/addon-mobile/enums/package.json delete mode 100644 projects/addon-mobile/enums/touch-mode.ts diff --git a/projects/addon-charts/components/axes/axes.component.ts b/projects/addon-charts/components/axes/axes.component.ts index b49dc4ff3efa..840c7a41ca74 100644 --- a/projects/addon-charts/components/axes/axes.component.ts +++ b/projects/addon-charts/components/axes/axes.component.ts @@ -6,7 +6,7 @@ import { Input, } from '@angular/core'; import {TUI_ALWAYS_DASHED, TUI_ALWAYS_SOLID} from '@taiga-ui/addon-charts/constants'; -import {TuiLineHandler, TuiLineTypeT} from '@taiga-ui/addon-charts/types'; +import {TuiLineHandler, TuiLineType} from '@taiga-ui/addon-charts/types'; import {CHAR_NO_BREAK_SPACE, tuiDefaultProp} from '@taiga-ui/cdk'; import {MODE_PROVIDER} from '@taiga-ui/core/providers'; import {TUI_MODE} from '@taiga-ui/core/tokens'; @@ -14,19 +14,19 @@ import {TuiBrightness} from '@taiga-ui/core/types'; import {Observable} from 'rxjs'; @Component({ - selector: `tui-axes`, - templateUrl: `./axes.template.html`, - styleUrls: [`./axes.style.less`], + selector: 'tui-axes', + templateUrl: './axes.template.html', + styleUrls: ['./axes.style.less'], changeDetection: ChangeDetectionStrategy.OnPush, providers: [MODE_PROVIDER], host: { - '($.data-mode.attr)': `mode$`, + '($.data-mode.attr)': 'mode$', }, }) export class TuiAxesComponent { @Input() @tuiDefaultProp() - axisX: TuiLineTypeT = `solid`; + axisX: TuiLineType = 'solid'; @Input() @tuiDefaultProp() @@ -34,7 +34,7 @@ export class TuiAxesComponent { @Input() @tuiDefaultProp() - axisY: TuiLineTypeT = `solid`; + axisY: TuiLineType = 'solid'; @Input() @tuiDefaultProp() @@ -46,7 +46,7 @@ export class TuiAxesComponent { @Input() @tuiDefaultProp() - axisYName = ``; + axisYName = ''; @Input() @tuiDefaultProp() @@ -58,7 +58,7 @@ export class TuiAxesComponent { @Input() @tuiDefaultProp() - axisYSecondaryName = ``; + axisYSecondaryName = ''; @Input() @tuiDefaultProp() @@ -76,9 +76,9 @@ export class TuiAxesComponent { @tuiDefaultProp() verticalLinesHandler: TuiLineHandler = TUI_ALWAYS_DASHED; - @HostBinding(`class._centered`) + @HostBinding('class._centered') get centeredXLabels(): boolean { - return this.axisY === `none`; + return this.axisY === 'none'; } constructor(@Inject(TUI_MODE) readonly mode$: Observable) {} diff --git a/projects/addon-charts/enums/index.ts b/projects/addon-charts/enums/index.ts deleted file mode 100644 index a249c00ccf37..000000000000 --- a/projects/addon-charts/enums/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './line-type'; diff --git a/projects/addon-charts/enums/line-type.ts b/projects/addon-charts/enums/line-type.ts deleted file mode 100644 index e348b59a3679..000000000000 --- a/projects/addon-charts/enums/line-type.ts +++ /dev/null @@ -1,11 +0,0 @@ -/** - * Native CSS border-style options - * @deprecated use join type {@link TuiLineTypeT} - */ -export const enum TuiLineType { - Solid = `solid`, - Dashed = `dashed`, - Dotted = `dotted`, - None = `none`, - Hidden = `hidden`, -} diff --git a/projects/addon-charts/enums/package.json b/projects/addon-charts/enums/package.json deleted file mode 100644 index 289d2d373a50..000000000000 --- a/projects/addon-charts/enums/package.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "ngPackage": { - "lib": { - "entryFile": "index.ts" - } - } -} diff --git a/projects/addon-charts/index.ts b/projects/addon-charts/index.ts index 4875a5cac6d0..f9bb8c030db5 100644 --- a/projects/addon-charts/index.ts +++ b/projects/addon-charts/index.ts @@ -1,5 +1,4 @@ export * from '@taiga-ui/addon-charts/components'; export * from '@taiga-ui/addon-charts/constants'; -export * from '@taiga-ui/addon-charts/enums'; export * from '@taiga-ui/addon-charts/interfaces'; export * from '@taiga-ui/addon-charts/types'; diff --git a/projects/addon-charts/types/line-handler.ts b/projects/addon-charts/types/line-handler.ts index 84b02e4b219c..4e407a6229cd 100644 --- a/projects/addon-charts/types/line-handler.ts +++ b/projects/addon-charts/types/line-handler.ts @@ -1,3 +1,3 @@ -import {TuiLineTypeT} from './line-type'; +import {TuiLineType} from './line-type'; -export type TuiLineHandler = (index: number, total: number) => TuiLineTypeT; +export type TuiLineHandler = (index: number, total: number) => TuiLineType; diff --git a/projects/addon-charts/types/line-type.ts b/projects/addon-charts/types/line-type.ts index a3bb2f63d400..9f426ed9ad28 100644 --- a/projects/addon-charts/types/line-type.ts +++ b/projects/addon-charts/types/line-type.ts @@ -1,4 +1,4 @@ /** * Native CSS border-style options */ -export type TuiLineTypeT = 'solid' | 'dashed' | 'dotted' | 'none' | 'hidden'; +export type TuiLineType = 'solid' | 'dashed' | 'dotted' | 'none' | 'hidden'; diff --git a/projects/addon-commerce/components/card/card.component.ts b/projects/addon-commerce/components/card/card.component.ts index b94f1cd0b91b..b439cd3f5492 100644 --- a/projects/addon-commerce/components/card/card.component.ts +++ b/projects/addon-commerce/components/card/card.component.ts @@ -1,5 +1,5 @@ import {ChangeDetectionStrategy, Component, HostBinding, Input} from '@angular/core'; -import {TuiPaymentSystem, TuiPaymentSystemT} from '@taiga-ui/addon-commerce/enums'; +import {TuiPaymentSystem} from '@taiga-ui/addon-commerce/types'; import {tuiDefaultProp} from '@taiga-ui/cdk'; import {TuiSizeS} from '@taiga-ui/core'; @@ -8,50 +8,50 @@ export function cardNumberAssertion({length}: string): boolean { return !length || length === 4; } -export const cardNumberAssertionMessage = `cardNumber should contain 4 symbols`; +export const cardNumberAssertionMessage = 'cardNumber should contain 4 symbols'; -const icons = { - [TuiPaymentSystem.Mir]: `tuiIconMirMono`, - [TuiPaymentSystem.Visa]: `tuiIconVisaMono`, - [TuiPaymentSystem.Electron]: `tuiIconElectronMono`, - [TuiPaymentSystem.Mastercard]: `tuiIconMastercard`, - [TuiPaymentSystem.Maestro]: `tuiIconMaestro`, +const icons: Record = { + mir: 'tuiIconMirMono', + visa: 'tuiIconVisaMono', + electron: 'tuiIconElectronMono', + mastercard: 'tuiIconMastercard', + maestro: 'tuiIconMaestro', }; @Component({ - selector: `tui-card`, - templateUrl: `card.template.html`, - styleUrls: [`./card.style.less`], + selector: 'tui-card', + templateUrl: 'card.template.html', + styleUrls: ['./card.style.less'], changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiCardComponent { @Input() - @HostBinding(`class._active`) + @HostBinding('class._active') @tuiDefaultProp() active = false; @Input() @tuiDefaultProp() - brandLogo = ``; + brandLogo = ''; @Input() @tuiDefaultProp(cardNumberAssertion, cardNumberAssertionMessage) - cardNumber = ``; + cardNumber = ''; @Input() @tuiDefaultProp() - paymentSystem: TuiPaymentSystemT | TuiPaymentSystem | null = null; + paymentSystem: TuiPaymentSystem | null = null; @Input() - @HostBinding(`attr.data-size`) + @HostBinding('attr.data-size') @tuiDefaultProp() - size: TuiSizeS = `m`; + size: TuiSizeS = 'm'; get hasBrandLogo(): boolean { - return !!this.brandLogo && this.size === `m`; + return !!this.brandLogo && this.size === 'm'; } get paymentSystemLogo(): string { - return this.paymentSystem ? icons[this.paymentSystem] : ``; + return this.paymentSystem ? icons[this.paymentSystem] : ''; } } diff --git a/projects/addon-commerce/components/input-card-grouped/input-card-grouped.component.ts b/projects/addon-commerce/components/input-card-grouped/input-card-grouped.component.ts index ae5eed52a571..fcc722b71028 100644 --- a/projects/addon-commerce/components/input-card-grouped/input-card-grouped.component.ts +++ b/projects/addon-commerce/components/input-card-grouped/input-card-grouped.component.ts @@ -17,16 +17,14 @@ import { } from '@angular/core'; import {NgControl} from '@angular/forms'; import {TUI_CARD_MASK, tuiDefaultCardValidator} from '@taiga-ui/addon-commerce/constants'; -import {TuiPaymentSystem} from '@taiga-ui/addon-commerce/enums'; import {TuiCard} from '@taiga-ui/addon-commerce/interfaces'; -import {TuiCodeCVCLength} from '@taiga-ui/addon-commerce/types'; +import {TuiCodeCVCLength, TuiPaymentSystem} from '@taiga-ui/addon-commerce/types'; import { - getPaymentSystem, tuiCreateAutoCorrectedExpirePipe, + tuiGetPaymentSystem, } from '@taiga-ui/addon-commerce/utils'; import { AbstractTuiNullableControl, - isNativeFocusedIn, TUI_FOCUSABLE_ITEM_ACCESSOR, tuiAssertIsElement, TuiBooleanHandler, @@ -34,6 +32,7 @@ import { tuiDefaultProp, TuiFocusableElementAccessor, tuiIsNativeFocused, + tuiIsNativeFocusedIn, tuiPure, tuiRequiredSetter, } from '@taiga-ui/cdk'; @@ -60,23 +59,23 @@ import { } from './input-card-grouped.providers'; const STUB: TuiCard = { - card: ``, - expire: ``, - cvc: ``, + card: '', + expire: '', + cvc: '', }; -const ICONS = { - [TuiPaymentSystem.Mir]: `tuiIconMir`, - [TuiPaymentSystem.Visa]: `tuiIconVisa`, - [TuiPaymentSystem.Electron]: `tuiIconElectron`, - [TuiPaymentSystem.Mastercard]: `tuiIconMastercard`, - [TuiPaymentSystem.Maestro]: `tuiIconMaestro`, +const ICONS: Record = { + mir: 'tuiIconMir', + visa: 'tuiIconVisa', + electron: 'tuiIconElectron', + mastercard: 'tuiIconMastercard', + maestro: 'tuiIconMaestro', }; // @dynamic @Component({ - selector: `tui-input-card-grouped`, - templateUrl: `./input-card-grouped.template.html`, - styleUrls: [`./input-card-grouped.style.less`], + selector: 'tui-input-card-grouped', + templateUrl: './input-card-grouped.template.html', + styleUrls: ['./input-card-grouped.style.less'], changeDetection: ChangeDetectionStrategy.OnPush, providers: [ MODE_PROVIDER, @@ -90,21 +89,21 @@ const ICONS = { }, ], host: { - '($.data-mode.attr)': `mode$`, - 'data-size': `l`, + '($.data-mode.attr)': 'mode$', + 'data-size': 'l', }, }) export class TuiInputCardGroupedComponent extends AbstractTuiNullableControl implements TuiFocusableElementAccessor, TuiDataListHost> { - @ViewChild(`inputCard`) + @ViewChild('inputCard') private readonly inputCard?: ElementRef; - @ViewChild(`inputExpire`) + @ViewChild('inputExpire') private readonly inputExpire?: ElementRef; - @ViewChild(`inputCVC`) + @ViewChild('inputCVC') private readonly inputCVC?: ElementRef; private expireInert = false; @@ -119,7 +118,7 @@ export class TuiInputCardGroupedComponent @Input() @tuiDefaultProp() - exampleText = `0000 0000 0000 0000`; + exampleText = '0000 0000 0000 0000'; @Input() @tuiDefaultProp() @@ -128,7 +127,7 @@ export class TuiInputCardGroupedComponent @Input() @tuiRequiredSetter() set codeLength(length: TuiCodeCVCLength) { - this.exampleTextCVC = `0`.repeat(length); + this.exampleTextCVC = '0'.repeat(length); this.maskCVC = { mask: new Array(length).fill(TUI_DIGIT_REGEXP), guide: false, @@ -142,12 +141,12 @@ export class TuiInputCardGroupedComponent readonly binChange = new EventEmitter(); @ContentChild(TuiDataListDirective, {read: TemplateRef}) - readonly dropdown: PolymorpheusContent = ``; + readonly dropdown: PolymorpheusContent = ''; @ContentChild(TuiDataListComponent) readonly datalist?: TuiDataListComponent; - exampleTextCVC = `000`; + exampleTextCVC = '000'; maskCVC: TextMaskConfig = { mask: new Array(3).fill(TUI_DIGIT_REGEXP), @@ -164,7 +163,7 @@ export class TuiInputCardGroupedComponent mask: [ TUI_DIGIT_REGEXP, TUI_DIGIT_REGEXP, - `/`, + '/', TUI_DIGIT_REGEXP, TUI_DIGIT_REGEXP, ], @@ -195,19 +194,19 @@ export class TuiInputCardGroupedComponent } get focused(): boolean { - return this.open || isNativeFocusedIn(this.elementRef.nativeElement); + return this.open || tuiIsNativeFocusedIn(this.elementRef.nativeElement); } get card(): string { - return this.value?.card ?? ``; + return this.value?.card ?? ''; } get expire(): string { - return this.value?.expire ?? ``; + return this.value?.expire ?? ''; } get cvc(): string { - return this.value?.cvc ?? ``; + return this.value?.cvc ?? ''; } get hasCleaner(): boolean { @@ -278,7 +277,7 @@ export class TuiInputCardGroupedComponent // Safari expiration date autofill workaround get name(): 'ccexpiryyear' | null { - return this.autocompleteEnabled ? `ccexpiryyear` : null; + return this.autocompleteEnabled ? 'ccexpiryyear' : null; } get cardPrefilled(): boolean { @@ -302,16 +301,16 @@ export class TuiInputCardGroupedComponent } get masked(): string { - return this.cardPrefilled ? `*${this.card.slice(-4)}` : `*`; + return this.cardPrefilled ? `*${this.card.slice(-4)}` : '*'; } - @HostListener(`keydown.esc`) + @HostListener('keydown.esc') onEsc(): void { this.open = false; } - @HostListener(`keydown.arrowDown.prevent`, [`$event.target`, `1`]) - @HostListener(`keydown.arrowUp.prevent`, [`$event.target`, `-1`]) + @HostListener('keydown.arrowDown.prevent', ['$event.target', '1']) + @HostListener('keydown.arrowUp.prevent', ['$event.target', '-1']) onArrow(element: HTMLElement, step: number): void { this.open = this.hasDropdown; this.changeDetectorRef.detectChanges(); @@ -319,7 +318,7 @@ export class TuiInputCardGroupedComponent } handleOption(option: Partial): void { - const {card = ``, expire = ``, cvc = ``} = option; + const {card = '', expire = '', cvc = ''} = option; const {bin} = this; const element = (!expire && this.inputExpire?.nativeElement) || this.inputCVC?.nativeElement; @@ -334,13 +333,13 @@ export class TuiInputCardGroupedComponent onCardChange(card: string): void { const {value, bin} = this; - const parsed = card.split(` `).join(``); + const parsed = card.split(' ').join(''); if (value && value.card === parsed) { return; } - this.updateProperty(parsed, `card`); + this.updateProperty(parsed, 'card'); this.updateBin(bin); if (this.cardValidator(this.card) && !this.expire && this.inputExpire) { @@ -359,12 +358,12 @@ export class TuiInputCardGroupedComponent expire = `12${expire.slice(2)}`; } - if (expire.slice(0, 2) === `00`) { + if (expire.slice(0, 2) === '00') { expire = `01${expire.slice(2)}`; } this.inputExpire.nativeElement.value = expire; - this.updateProperty(expire, `expire`); + this.updateProperty(expire, 'expire'); if (expire.length === 5) { this.focusCVC(); @@ -372,7 +371,7 @@ export class TuiInputCardGroupedComponent } onCVCChange(cvc: string): void { - this.updateProperty(cvc, `cvc`); + this.updateProperty(cvc, 'cvc'); } onActiveZoneChange(active: boolean): void { @@ -387,7 +386,7 @@ export class TuiInputCardGroupedComponent onMouseDown(event: MouseEvent): void { tuiAssertIsElement(event.target); - if (event.target.matches(`input`)) { + if (event.target.matches('input')) { return; } @@ -436,7 +435,7 @@ export class TuiInputCardGroupedComponent } private get paymentSystem(): TuiPaymentSystem | null { - return this.value && getPaymentSystem(this.value.card); + return this.value && tuiGetPaymentSystem(this.value.card); } @tuiPure diff --git a/projects/addon-commerce/components/input-card/input-card.component.ts b/projects/addon-commerce/components/input-card/input-card.component.ts index 4bafe7d166d8..1362ac8371cb 100644 --- a/projects/addon-commerce/components/input-card/input-card.component.ts +++ b/projects/addon-commerce/components/input-card/input-card.component.ts @@ -13,8 +13,8 @@ import { } from '@angular/core'; import {NgControl} from '@angular/forms'; import {TUI_CARD_MASK} from '@taiga-ui/addon-commerce/constants'; -import {TuiPaymentSystem} from '@taiga-ui/addon-commerce/enums'; -import {getPaymentSystem} from '@taiga-ui/addon-commerce/utils'; +import {TuiPaymentSystem} from '@taiga-ui/addon-commerce/types'; +import {tuiGetPaymentSystem} from '@taiga-ui/addon-commerce/utils'; import { AbstractTuiControl, TUI_FOCUSABLE_ITEM_ACCESSOR, @@ -29,12 +29,12 @@ import { } from '@taiga-ui/core'; import {TextMaskConfig} from 'angular2-text-mask'; -const icons = { - [TuiPaymentSystem.Mir]: `tuiIconMir`, - [TuiPaymentSystem.Visa]: `tuiIconVisa`, - [TuiPaymentSystem.Electron]: `tuiIconElectron`, - [TuiPaymentSystem.Mastercard]: `tuiIconMastercard`, - [TuiPaymentSystem.Maestro]: `tuiIconMaestro`, +const icons: Record = { + mir: 'tuiIconMir', + visa: 'tuiIconVisa', + electron: 'tuiIconElectron', + mastercard: 'tuiIconMastercard', + maestro: 'tuiIconMaestro', }; // eslint-disable-next-line @typescript-eslint/naming-convention @@ -42,16 +42,16 @@ export function cardTextfieldControllerFactory( directive: TuiTextfieldExampleTextDirective | null, ): TuiTextfieldExampleTextDirective { directive = directive || new TuiTextfieldExampleTextDirective(); - directive.exampleText = `0000 0000 0000 0000`; + directive.exampleText = '0000 0000 0000 0000'; return directive; } // @dynamic @Component({ - selector: `tui-input-card`, - templateUrl: `./input-card.template.html`, - styleUrls: [`./input-card.style.less`], + selector: 'tui-input-card', + templateUrl: './input-card.template.html', + styleUrls: ['./input-card.style.less'], changeDetection: ChangeDetectionStrategy.OnPush, providers: [ { @@ -124,7 +124,7 @@ export class TuiInputCardComponent } get paymentSystem(): TuiPaymentSystem | null { - return getPaymentSystem(this.value); + return tuiGetPaymentSystem(this.value); } get bin(): string | null { @@ -133,13 +133,13 @@ export class TuiInputCardComponent get formattedCard(): string { return this.value - .split(``) + .split('') .map((char, index) => (index && index % 4 === 0 ? ` ${char}` : char)) - .join(``); + .join(''); } onValueChange(value: string): void { - const parsed = value.split(` `).join(``); + const parsed = value.split(' ').join(''); const currentBin = this.bin; this.updateValue(parsed); @@ -172,6 +172,6 @@ export class TuiInputCardComponent } protected getFallbackValue(): string { - return ``; + return ''; } } diff --git a/projects/addon-commerce/components/input-card/test/input-card.component.spec.ts b/projects/addon-commerce/components/input-card/test/input-card.component.spec.ts index 2418b8fc4e36..b832643635f7 100644 --- a/projects/addon-commerce/components/input-card/test/input-card.component.spec.ts +++ b/projects/addon-commerce/components/input-card/test/input-card.component.spec.ts @@ -3,7 +3,6 @@ import {ComponentFixture, TestBed} from '@angular/core/testing'; import {FormControl, ReactiveFormsModule} from '@angular/forms'; import {configureTestSuite} from '@taiga-ui/testing'; -import {TuiPaymentSystem} from '../../../enums/payment-system'; import {TuiInputCardComponent} from '../input-card.component'; import {TuiInputCardModule} from '../input-card.module'; @@ -83,33 +82,31 @@ describe(`InputCard`, () => { it(`visa`, () => { testComponent.control.setValue(`4111 1111 1111 1111`); - expect(testComponent.component.paymentSystem).toBe(TuiPaymentSystem.Visa); + expect(testComponent.component.paymentSystem).toBe('visa'); }); it(`electron`, () => { testComponent.control.setValue(`4917300800000000`); - expect(testComponent.component.paymentSystem).toBe(TuiPaymentSystem.Electron); + expect(testComponent.component.paymentSystem).toBe('electron'); }); it(`mir`, () => { testComponent.control.setValue(`2200654321000000`); - expect(testComponent.component.paymentSystem).toBe(TuiPaymentSystem.Mir); + expect(testComponent.component.paymentSystem).toBe('mir'); }); it(`mastercard`, () => { testComponent.control.setValue(`5500 0000 0000 0004`); - expect(testComponent.component.paymentSystem).toBe( - TuiPaymentSystem.Mastercard, - ); + expect(testComponent.component.paymentSystem).toBe('mastercard'); }); it(`maestro`, () => { testComponent.control.setValue(`6759649826438453`); - expect(testComponent.component.paymentSystem).toBe(TuiPaymentSystem.Maestro); + expect(testComponent.component.paymentSystem).toBe('maestro'); }); }); diff --git a/projects/addon-commerce/components/money/money-options.ts b/projects/addon-commerce/components/money/money-options.ts index 4b943b4e2c71..d7e6b9c387bf 100644 --- a/projects/addon-commerce/components/money/money-options.ts +++ b/projects/addon-commerce/components/money/money-options.ts @@ -1,12 +1,12 @@ import {InjectionToken, ValueProvider} from '@angular/core'; import {TuiCurrency} from '@taiga-ui/addon-commerce/enums'; -import {TuiCurrencyVariants, TuiMoneySignT} from '@taiga-ui/addon-commerce/types'; +import {TuiCurrencyVariants, TuiMoneySign} from '@taiga-ui/addon-commerce/types'; import {TuiDecimalT} from '@taiga-ui/core'; export interface TuiMoneyOptions { readonly decimal: TuiDecimalT; readonly currency: TuiCurrencyVariants; - readonly sign: TuiMoneySignT; + readonly sign: TuiMoneySign; readonly colored: boolean; readonly precision: number; readonly singleColor: boolean; diff --git a/projects/addon-commerce/components/money/money.component.ts b/projects/addon-commerce/components/money/money.component.ts index 55b487e20640..4ccbac1f3091 100644 --- a/projects/addon-commerce/components/money/money.component.ts +++ b/projects/addon-commerce/components/money/money.component.ts @@ -7,8 +7,8 @@ import { } from '@angular/core'; import { TuiCurrencyVariants, + TuiMoneySign, TuiMoneySignSymbol, - TuiMoneySignT, } from '@taiga-ui/addon-commerce/types'; import {CHAR_MINUS, CHAR_PLUS, tuiDefaultProp} from '@taiga-ui/cdk'; import {TuiDecimalT} from '@taiga-ui/core'; @@ -37,7 +37,7 @@ export class TuiMoneyComponent { @Input() @tuiDefaultProp() - sign: TuiMoneySignT = this.options.sign; + sign: TuiMoneySign = this.options.sign; @Input() @tuiDefaultProp() diff --git a/projects/addon-commerce/components/money/pipes/sign-symbol.pipe.ts b/projects/addon-commerce/components/money/pipes/sign-symbol.pipe.ts index fc7e3bd9294f..25689171f1af 100644 --- a/projects/addon-commerce/components/money/pipes/sign-symbol.pipe.ts +++ b/projects/addon-commerce/components/money/pipes/sign-symbol.pipe.ts @@ -1,11 +1,11 @@ import {Pipe, PipeTransform} from '@angular/core'; -import {TuiMoneySignSymbol, TuiMoneySignT} from '@taiga-ui/addon-commerce/types'; +import {TuiMoneySign, TuiMoneySignSymbol} from '@taiga-ui/addon-commerce/types'; import {tuiFormatSignSymbol} from '../utils/format-sign-symbol'; @Pipe({name: `tuiSignSymbol`}) export class TuiSignSymbolPipe implements PipeTransform { - transform(value: number, sign: TuiMoneySignT): TuiMoneySignSymbol { + transform(value: number, sign: TuiMoneySign): TuiMoneySignSymbol { return tuiFormatSignSymbol(value, sign); } } diff --git a/projects/addon-commerce/components/money/test/money.component.spec.ts b/projects/addon-commerce/components/money/test/money.component.spec.ts index 6ed0223e25be..7e0c988e56bf 100644 --- a/projects/addon-commerce/components/money/test/money.component.spec.ts +++ b/projects/addon-commerce/components/money/test/money.component.spec.ts @@ -6,13 +6,13 @@ import { TuiCurrencyVariants, TuiMoneyComponent, TuiMoneyModule, - TuiMoneySignT, + TuiMoneySign, } from '@taiga-ui/addon-commerce'; import {CHAR_MINUS} from '@taiga-ui/cdk'; import {TuiDecimalT} from '@taiga-ui/core'; -import {configureTestSuite, TuiPageObject, tuiReplaceNbsp} from '@taiga-ui/testing'; +import {configureTestSuite, TuiPageObject} from '@taiga-ui/testing'; -describe(`Money`, () => { +describe('Money', () => { @Component({ template: ` { component!: TuiMoneyComponent; value = 237; - decimal: TuiDecimalT = `not-zero`; + decimal: TuiDecimalT = 'not-zero'; currency: TuiCurrencyVariants = null; - sign: TuiMoneySignT = `negative-only`; + sign: TuiMoneySign = 'negative-only'; colored = false; precision = 2; } @@ -43,7 +43,7 @@ describe(`Money`, () => { let pageObject: TuiPageObject; const testContext = { get prefix() { - return `tui-money__`; + return 'tui-money__'; }, }; @@ -62,27 +62,27 @@ describe(`Money`, () => { component = testComponent.component; }); - describe(`currency:`, () => { - it(`if null is passed, currency symbol is not shown`, () => { + describe('currency:', () => { + it('if null is passed, currency symbol is not shown', () => { const currency = pageObject.getByAutomationId( `${testContext.prefix}currency`, ); - expect(currency!.nativeElement.textContent.trim()).toEqual(``); + expect(currency!.nativeElement.textContent.trim()).toEqual(''); }); - it(`if empty string is passed, currency symbol is not shown`, () => { - testComponent.currency = ``; + it('if empty string is passed, currency symbol is not shown', () => { + testComponent.currency = ''; fixture.detectChanges(); const currency = pageObject.getByAutomationId( `${testContext.prefix}currency`, ); - expect(currency!.nativeElement.textContent.trim()).toEqual(``); + expect(currency!.nativeElement.textContent.trim()).toEqual(''); }); - it(`words with currency code`, () => { + it('words with currency code', () => { testComponent.currency = TuiCurrencyCode.Dollar; fixture.detectChanges(); @@ -90,10 +90,10 @@ describe(`Money`, () => { `${testContext.prefix}currency`, ); - expect(currency!.nativeElement.textContent.trim()).toEqual(`$`); + expect(currency!.nativeElement.textContent.trim()).toEqual('$'); }); - it(`works with currency name`, () => { + it('works with currency name', () => { testComponent.currency = TuiCurrency.Dollar; fixture.detectChanges(); @@ -101,11 +101,11 @@ describe(`Money`, () => { `${testContext.prefix}currency`, ); - expect(currency!.nativeElement.textContent.trim()).toEqual(`$`); + expect(currency!.nativeElement.textContent.trim()).toEqual('$'); }); - it(`works with custom currency`, () => { - const customCurrency = `CSTM`; + it('works with custom currency', () => { + const customCurrency = 'CSTM'; testComponent.currency = customCurrency; fixture.detectChanges(); @@ -118,16 +118,16 @@ describe(`Money`, () => { }); }); - describe(`decimal:`, () => { - it(`zero decimals not shown by default`, () => { + describe('decimal:', () => { + it('zero decimals not shown by default', () => { const fraction = pageObject.getByAutomationId( `${testContext.prefix}fraction-part`, ); - expect(fraction!.nativeElement.textContent).toEqual(``); + expect(fraction!.nativeElement.textContent).toEqual(''); }); - it(`non zero decimals a padded with zeroes by default`, () => { + it('non zero decimals a padded with zeroes by default', () => { testComponent.value = 237.1; fixture.detectChanges(); @@ -135,10 +135,10 @@ describe(`Money`, () => { `${testContext.prefix}fraction-part`, ); - expect(fraction!.nativeElement.textContent).toEqual(`,10`); + expect(fraction!.nativeElement.textContent).toEqual(',10'); }); - it(`correct rounding for float values`, () => { + it('correct rounding for float values', () => { testComponent.value = 8918 + 10333.6 + 3527.78 + 805.62 + 140; fixture.detectChanges(); @@ -151,15 +151,13 @@ describe(`Money`, () => { ); expect( - tuiReplaceNbsp( - `${integer!.nativeElement.textContent}${ - fraction!.nativeElement.textContent - }`, - ), - ).toEqual(`23 725`); + `${integer!.nativeElement.textContent}${ + fraction!.nativeElement.textContent + }`, + ).toEqual('23 725'); }); - it(`decimals only show 2 digits`, () => { + it('decimals only show 2 digits', () => { testComponent.value = 237.123; fixture.detectChanges(); @@ -167,33 +165,33 @@ describe(`Money`, () => { `${testContext.prefix}fraction-part`, ); - expect(fraction!.nativeElement.textContent).toEqual(`,12`); + expect(fraction!.nativeElement.textContent).toEqual(',12'); }); - it(`if ALWAYS is set, zero decimals are shown`, () => { - testComponent.decimal = `always`; + it('if ALWAYS is set, zero decimals are shown', () => { + testComponent.decimal = 'always'; fixture.detectChanges(); const fraction = pageObject.getByAutomationId( `${testContext.prefix}fraction-part`, ); - expect(fraction!.nativeElement.textContent).toEqual(`,00`); + expect(fraction!.nativeElement.textContent).toEqual(',00'); }); - it(`if Never is set, non zero decimals are not shown`, () => { + it('if Never is set, non zero decimals are not shown', () => { testComponent.value = 237.123; - testComponent.decimal = `never`; + testComponent.decimal = 'never'; fixture.detectChanges(); const fraction = pageObject.getByAutomationId( `${testContext.prefix}fraction-part`, ); - expect(fraction!.nativeElement.textContent).toEqual(``); + expect(fraction!.nativeElement.textContent).toEqual(''); }); - it(`if precision = 4, shows 4 digits of decimal part`, () => { + it('if precision = 4, shows 4 digits of decimal part', () => { testComponent.value = 237.123; testComponent.precision = 4; fixture.detectChanges(); @@ -202,18 +200,18 @@ describe(`Money`, () => { `${testContext.prefix}fraction-part`, ); - expect(fraction!.nativeElement.textContent).toEqual(`,1230`); + expect(fraction!.nativeElement.textContent).toEqual(',1230'); }); }); - describe(`sign:`, () => { - it(`by default plus is not shown`, () => { + describe('sign:', () => { + it('by default plus is not shown', () => { const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); - expect(sign!.nativeElement.textContent).toEqual(``); + expect(sign!.nativeElement.textContent).toEqual(''); }); - it(`by default minus is not shown`, () => { + it('by default minus is not shown', () => { testComponent.value = -237; fixture.detectChanges(); @@ -222,18 +220,18 @@ describe(`Money`, () => { expect(sign!.nativeElement.textContent).toEqual(CHAR_MINUS); }); - it(`if set to ALWAYS, plus is shown`, () => { - testComponent.sign = `always`; + it('if set to ALWAYS, plus is shown', () => { + testComponent.sign = 'always'; fixture.detectChanges(); const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); - expect(sign!.nativeElement.textContent).toEqual(`+`); + expect(sign!.nativeElement.textContent).toEqual('+'); }); - it(`if set to ALWAYS, minus is shown`, () => { + it('if set to ALWAYS, minus is shown', () => { testComponent.value = -237; - testComponent.sign = `always`; + testComponent.sign = 'always'; fixture.detectChanges(); const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); @@ -241,27 +239,27 @@ describe(`Money`, () => { expect(sign!.nativeElement.textContent).toEqual(CHAR_MINUS); }); - it(`if set to Never, plus is not shown`, () => { - testComponent.sign = `never`; + it('if set to Never, plus is not shown', () => { + testComponent.sign = 'never'; fixture.detectChanges(); const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); - expect(sign!.nativeElement.textContent).toEqual(``); + expect(sign!.nativeElement.textContent).toEqual(''); }); - it(`if set to Never, minus is not shown`, () => { + it('if set to Never, minus is not shown', () => { testComponent.value = -237; - testComponent.sign = `never`; + testComponent.sign = 'never'; fixture.detectChanges(); const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); - expect(sign!.nativeElement.textContent).toEqual(``); + expect(sign!.nativeElement.textContent).toEqual(''); }); - it(`if set to FORCE_NEGATIVE, minus is shown for positive numbers`, () => { - testComponent.sign = `force-negative`; + it('if set to FORCE_NEGATIVE, minus is shown for positive numbers', () => { + testComponent.sign = 'force-negative'; fixture.detectChanges(); const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); @@ -269,9 +267,9 @@ describe(`Money`, () => { expect(sign!.nativeElement.textContent).toEqual(CHAR_MINUS); }); - it(`if set to FORCE_NEGATIVE, minus is shown for negative numbers`, () => { + it('if set to FORCE_NEGATIVE, minus is shown for negative numbers', () => { testComponent.value = -237; - testComponent.sign = `force-negative`; + testComponent.sign = 'force-negative'; fixture.detectChanges(); const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); @@ -279,34 +277,34 @@ describe(`Money`, () => { expect(sign!.nativeElement.textContent).toEqual(CHAR_MINUS); }); - it(`if set to FORCE_POSITIVE, plus is shown for positive numbers`, () => { - testComponent.sign = `force-positive`; + it('if set to FORCE_POSITIVE, plus is shown for positive numbers', () => { + testComponent.sign = 'force-positive'; fixture.detectChanges(); const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); - expect(sign!.nativeElement.textContent).toEqual(`+`); + expect(sign!.nativeElement.textContent).toEqual('+'); }); - it(`if set to FORCE_POSITIVE, plus is shown for negative numbers`, () => { + it('if set to FORCE_POSITIVE, plus is shown for negative numbers', () => { testComponent.value = -237; - testComponent.sign = `force-positive`; + testComponent.sign = 'force-positive'; fixture.detectChanges(); const sign = pageObject.getByAutomationId(`${testContext.prefix}sign`); - expect(sign!.nativeElement.textContent).toEqual(`+`); + expect(sign!.nativeElement.textContent).toEqual('+'); }); }); - describe(`colored:`, () => { - it(`by default color is not changed for positive numbers`, () => { + describe('colored:', () => { + it('by default color is not changed for positive numbers', () => { const colored = component.red || component.green; expect(colored).toBe(false); }); - it(`by default color is not changed for negative numbers`, () => { + it('by default color is not changed for negative numbers', () => { testComponent.value = -237; fixture.detectChanges(); @@ -315,7 +313,7 @@ describe(`Money`, () => { expect(colored).toBe(false); }); - it(`if set to true, positive numbers are colored in green`, () => { + it('if set to true, positive numbers are colored in green', () => { testComponent.colored = true; fixture.detectChanges(); @@ -324,7 +322,7 @@ describe(`Money`, () => { expect(colored).toBe(true); }); - it(`if set to true, negative numbers are colored in green`, () => { + it('if set to true, negative numbers are colored in green', () => { testComponent.colored = true; testComponent.value = -237; fixture.detectChanges(); @@ -334,10 +332,10 @@ describe(`Money`, () => { expect(colored).toBe(true); }); - it(`if set to true, FORCE_POSITIVE numbers are colored in green`, () => { + it('if set to true, FORCE_POSITIVE numbers are colored in green', () => { testComponent.colored = true; testComponent.value = -237; - testComponent.sign = `force-positive`; + testComponent.sign = 'force-positive'; fixture.detectChanges(); const colored = !component.red && component.green; @@ -345,9 +343,9 @@ describe(`Money`, () => { expect(colored).toBe(true); }); - it(`if set to true, FORCE_NEGATIVE numbers are colored in red`, () => { + it('if set to true, FORCE_NEGATIVE numbers are colored in red', () => { testComponent.colored = true; - testComponent.sign = `force-negative`; + testComponent.sign = 'force-negative'; fixture.detectChanges(); const colored = component.red && !component.green; @@ -355,7 +353,7 @@ describe(`Money`, () => { expect(colored).toBe(true); }); - it(`zero is not colored`, () => { + it('zero is not colored', () => { testComponent.value = 0; fixture.detectChanges(); diff --git a/projects/addon-commerce/components/money/utils/format-sign-symbol.ts b/projects/addon-commerce/components/money/utils/format-sign-symbol.ts index 31b45cd3dd3a..598a9eaa082a 100644 --- a/projects/addon-commerce/components/money/utils/format-sign-symbol.ts +++ b/projects/addon-commerce/components/money/utils/format-sign-symbol.ts @@ -1,9 +1,9 @@ -import {TuiMoneySignSymbol, TuiMoneySignT} from '@taiga-ui/addon-commerce/types'; +import {TuiMoneySign, TuiMoneySignSymbol} from '@taiga-ui/addon-commerce/types'; import {CHAR_MINUS, CHAR_PLUS} from '@taiga-ui/cdk'; export function tuiFormatSignSymbol( value: number, - sign: TuiMoneySignT, + sign: TuiMoneySign, ): TuiMoneySignSymbol { if (sign === `never` || !value || (sign === `negative-only` && value > 0)) { return ``; diff --git a/projects/addon-commerce/constants/default-card-validator.ts b/projects/addon-commerce/constants/default-card-validator.ts index c2f0f4e21f99..c8840e65374c 100644 --- a/projects/addon-commerce/constants/default-card-validator.ts +++ b/projects/addon-commerce/constants/default-card-validator.ts @@ -1,5 +1,5 @@ -import {isCardLengthValid, isCardNumberValid} from '@taiga-ui/addon-commerce/utils'; +import {tuiIsCardLengthValid, tuiIsCardNumberValid} from '@taiga-ui/addon-commerce/utils'; import {TuiBooleanHandler} from '@taiga-ui/cdk'; export const tuiDefaultCardValidator: TuiBooleanHandler = card => - card.length > 11 && isCardLengthValid(card) && isCardNumberValid(card); + card.length > 11 && tuiIsCardLengthValid(card) && tuiIsCardNumberValid(card); diff --git a/projects/addon-commerce/enums/index.ts b/projects/addon-commerce/enums/index.ts index 6bf2adccf43e..3cd57b55226f 100644 --- a/projects/addon-commerce/enums/index.ts +++ b/projects/addon-commerce/enums/index.ts @@ -1,4 +1,2 @@ export * from './currency'; export * from './currency-code'; -export * from './money-sign'; -export * from './payment-system'; diff --git a/projects/addon-commerce/enums/money-sign.ts b/projects/addon-commerce/enums/money-sign.ts deleted file mode 100644 index b59dd1caef20..000000000000 --- a/projects/addon-commerce/enums/money-sign.ts +++ /dev/null @@ -1,16 +0,0 @@ -/** - * negative-only — show sign only for negative numbers - * always — always show sign, except for zero - * never — never show sign - * force-negative — show minus no matter the number, except for zero - * force-positive — show plus no matter the number, except for zero - * @deprecated use join type {@link TuiMoneySignT} - * TODO: delete in v3.0 - */ -export const enum TuiMoneySign { - NegativeOnly = `negative-only`, - Always = `always`, - Never = `never`, - ForceNegative = `force-negative`, - ForcePositive = `force-positive`, -} diff --git a/projects/addon-commerce/enums/payment-system.ts b/projects/addon-commerce/enums/payment-system.ts deleted file mode 100644 index 365ccf9d5825..000000000000 --- a/projects/addon-commerce/enums/payment-system.ts +++ /dev/null @@ -1,9 +0,0 @@ -export const enum TuiPaymentSystem { - Visa = `visa`, - Electron = `electron`, - Mastercard = `mastercard`, - Maestro = `maestro`, - Mir = `mir`, -} - -export type TuiPaymentSystemT = 'visa' | 'electron' | 'mastercard' | 'maestro' | 'mir'; diff --git a/projects/addon-commerce/types/index.ts b/projects/addon-commerce/types/index.ts index 35d5c6d16dc1..ed9ffe911648 100644 --- a/projects/addon-commerce/types/index.ts +++ b/projects/addon-commerce/types/index.ts @@ -1,3 +1,4 @@ export * from './code-length'; export * from './currency-variants'; export * from './money-sign'; +export * from './payment-system'; diff --git a/projects/addon-commerce/types/money-sign.ts b/projects/addon-commerce/types/money-sign.ts index f13b7303eb61..6e8acfe03601 100644 --- a/projects/addon-commerce/types/money-sign.ts +++ b/projects/addon-commerce/types/money-sign.ts @@ -1,6 +1,6 @@ import {CHAR_MINUS, CHAR_PLUS} from '@taiga-ui/cdk'; -export type TuiMoneySignT = +export type TuiMoneySign = | 'negative-only' | 'always' | 'never' diff --git a/projects/addon-commerce/types/payment-system.ts b/projects/addon-commerce/types/payment-system.ts new file mode 100644 index 000000000000..e5b1a3513c44 --- /dev/null +++ b/projects/addon-commerce/types/payment-system.ts @@ -0,0 +1 @@ +export type TuiPaymentSystem = 'visa' | 'electron' | 'mastercard' | 'maestro' | 'mir'; diff --git a/projects/addon-commerce/utils/get-currency-symbol.ts b/projects/addon-commerce/utils/get-currency-symbol.ts index 07dfd13699fc..d230e1dec373 100644 --- a/projects/addon-commerce/utils/get-currency-symbol.ts +++ b/projects/addon-commerce/utils/get-currency-symbol.ts @@ -1,11 +1,7 @@ import {TuiCurrency, TuiCurrencyCode} from '@taiga-ui/addon-commerce/enums'; import {TuiCurrencyVariants} from '@taiga-ui/addon-commerce/types'; -/** - * @deprecated: use {@link tuiGetCurrencySymbol} instead - */ -// eslint-disable-next-line @typescript-eslint/naming-convention -export function getCurrencySymbol(currency: TuiCurrencyVariants): string | null { +export function tuiGetCurrencySymbol(currency: TuiCurrencyVariants): string | null { switch (currency) { case TuiCurrency.Ruble: case TuiCurrencyCode.Ruble: @@ -79,5 +75,3 @@ export function getCurrencySymbol(currency: TuiCurrencyVariants): string | null return null; } } - -export const tuiGetCurrencySymbol = getCurrencySymbol; diff --git a/projects/addon-commerce/utils/get-payment-system.ts b/projects/addon-commerce/utils/get-payment-system.ts index f44e4e51f13e..714a57dd32d5 100644 --- a/projects/addon-commerce/utils/get-payment-system.ts +++ b/projects/addon-commerce/utils/get-payment-system.ts @@ -1,11 +1,7 @@ -import {TuiPaymentSystem} from '@taiga-ui/addon-commerce/enums'; - -/** - * @deprecated: use {@link tuiGetPaymentSystem} instead - */ -// eslint-disable-next-line @typescript-eslint/naming-convention -export function getPaymentSystem(cardNumber: string): TuiPaymentSystem | null { - if (cardNumber === ``) { +import {TuiPaymentSystem} from '@taiga-ui/addon-commerce/types'; + +export function tuiGetPaymentSystem(cardNumber: string): TuiPaymentSystem | null { + if (cardNumber === '') { return null; } @@ -14,36 +10,30 @@ export function getPaymentSystem(cardNumber: string): TuiPaymentSystem | null { const three = Number.parseInt(cardNumber.slice(0, 3), 10); const four = Number.parseInt(cardNumber.slice(0, 4), 10); - if (isMaestro(three, two, one)) { - return TuiPaymentSystem.Maestro; + if (tuiIsMaestro(three, two, one)) { + return 'maestro'; } - if (isMastercard(four, two, one)) { - return TuiPaymentSystem.Mastercard; + if (tuiIsMastercard(four, two, one)) { + return 'mastercard'; } - if (isMir(four)) { - return TuiPaymentSystem.Mir; + if (tuiIsMir(four)) { + return 'mir'; } - if (isElectron(four)) { - return TuiPaymentSystem.Electron; + if (tuiIsElectron(four)) { + return 'electron'; } - if (isVisa(one)) { - return TuiPaymentSystem.Visa; + if (tuiIsVisa(one)) { + return 'visa'; } return null; } -export const tuiGetPaymentSystem = getPaymentSystem; - -/** - * @deprecated: use {@link tuiIsMaestro} instead - */ -// eslint-disable-next-line @typescript-eslint/naming-convention -export function isMaestro(three: number, two: number, one: number): boolean { +export function tuiIsMaestro(three: number, two: number, one: number): boolean { if (one === 6) { return true; } @@ -59,13 +49,7 @@ export function isMaestro(three: number, two: number, one: number): boolean { return three < 510; } -export const tuiIsMaestro = isMaestro; - -/** - * @deprecated: use {@link tuiIsMastercard} instead - */ -// eslint-disable-next-line @typescript-eslint/naming-convention -export function isMastercard(four: number, two: number, one: number): boolean { +export function tuiIsMastercard(four: number, two: number, one: number): boolean { if (one === 5) { return true; } @@ -85,23 +69,11 @@ export function isMastercard(four: number, two: number, one: number): boolean { return four > 2220 && four < 2721; } -export const tuiIsMastercard = isMastercard; - -/** - * @deprecated: use {@link tuiIsMir} instead - */ -// eslint-disable-next-line @typescript-eslint/naming-convention -export function isMir(four: number): boolean { +export function tuiIsMir(four: number): boolean { return four > 2199 && four < 2205; } -export const tuiIsMir = isMir; - -/** - * @deprecated: use {@link tuiIsElectron} instead - */ -// eslint-disable-next-line @typescript-eslint/naming-convention -export function isElectron(four: number): boolean { +export function tuiIsElectron(four: number): boolean { switch (four) { case 4026: case 4175: @@ -116,14 +88,6 @@ export function isElectron(four: number): boolean { } } -export const tuiIsElectron = isElectron; - -/** - * @deprecated: use {@link tuiIsVisa} instead - */ -// eslint-disable-next-line @typescript-eslint/naming-convention -export function isVisa(one: number): boolean { +export function tuiIsVisa(one: number): boolean { return one === 4; } - -export const tuiIsVisa = isVisa; diff --git a/projects/addon-commerce/utils/is-card-length-valid.ts b/projects/addon-commerce/utils/is-card-length-valid.ts index 977047949532..5f0f99530d5a 100644 --- a/projects/addon-commerce/utils/is-card-length-valid.ts +++ b/projects/addon-commerce/utils/is-card-length-valid.ts @@ -1,29 +1,24 @@ -import {TuiPaymentSystem} from '@taiga-ui/addon-commerce/enums'; - -import {getPaymentSystem} from './get-payment-system'; +import {tuiGetPaymentSystem} from './get-payment-system'; /** - * @deprecated: use {@link tuiIsCardLengthValid} instead * Validates card number length using payment system dictionary */ // eslint-disable-next-line @typescript-eslint/naming-convention -export function isCardLengthValid(cardNumber: string): boolean { +export function tuiIsCardLengthValid(cardNumber: string): boolean { const {length} = cardNumber; - const paymentSystem = getPaymentSystem(cardNumber); + const paymentSystem = tuiGetPaymentSystem(cardNumber); switch (paymentSystem) { - case TuiPaymentSystem.Electron: + case 'electron': return length === 16; - case TuiPaymentSystem.Maestro: + case 'maestro': return length > 11 && length < 20; - case TuiPaymentSystem.Mastercard: - case TuiPaymentSystem.Mir: + case 'mastercard': + case 'mir': return length > 15 && length < 20; - case TuiPaymentSystem.Visa: + case 'visa': return length > 12 && length < 20; default: return length > 8 && length < 20; } } - -export const tuiIsCardLengthValid = isCardLengthValid; diff --git a/projects/addon-commerce/utils/is-card-number-valid.ts b/projects/addon-commerce/utils/is-card-number-valid.ts index 2b31fc146e6d..7de572f69c30 100644 --- a/projects/addon-commerce/utils/is-card-number-valid.ts +++ b/projects/addon-commerce/utils/is-card-number-valid.ts @@ -1,15 +1,14 @@ import {TUI_NON_DIGITS_REGEXP} from '@taiga-ui/core'; /** - * @deprecated: use {@link tuiIsCardNumberValid} instead * Validates card number using Luhn algorithm */ // eslint-disable-next-line @typescript-eslint/naming-convention -export function isCardNumberValid(value: string | number): boolean { - const cardNumber = String(value).replace(TUI_NON_DIGITS_REGEXP, ``); +export function tuiIsCardNumberValid(value: string | number): boolean { + const cardNumber = String(value).replace(TUI_NON_DIGITS_REGEXP, ''); const {length} = cardNumber; - const arr = cardNumber.split(``).map((char, index) => { + const arr = cardNumber.split('').map((char, index) => { const digit = parseInt(char, 10); if ((index + length) % 2 === 0) { @@ -23,5 +22,3 @@ export function isCardNumberValid(value: string | number): boolean { return !(arr.reduce((a, b) => a + b, 0) % 10); } - -export const tuiIsCardNumberValid = isCardNumberValid; diff --git a/projects/addon-commerce/utils/test/get-currency-symbol.spec.ts b/projects/addon-commerce/utils/test/get-currency-symbol.spec.ts index 09399841aa5f..ae9c6a2aad63 100644 --- a/projects/addon-commerce/utils/test/get-currency-symbol.spec.ts +++ b/projects/addon-commerce/utils/test/get-currency-symbol.spec.ts @@ -1,21 +1,21 @@ -import {getCurrencySymbol} from '../get-currency-symbol'; +import {tuiGetCurrencySymbol} from '../get-currency-symbol'; -describe(`getCurrencySymbol`, () => { - it(`returns founded currency symbol`, () => { - const currency = `HKD`; +describe('getCurrencySymbol', () => { + it('returns founded currency symbol', () => { + const currency = 'HKD'; - expect(getCurrencySymbol(currency)).toBe(`HK$`); + expect(tuiGetCurrencySymbol(currency)).toBe('HK$'); }); - it(`returns founded currency symbol`, () => { - const currencyCode = `344`; + it('returns founded currency symbol', () => { + const currencyCode = '344'; - expect(getCurrencySymbol(currencyCode)).toBe(`HK$`); + expect(tuiGetCurrencySymbol(currencyCode)).toBe('HK$'); }); - it(`returns null if symbol not found`, () => { - const customCurrency = `CSTM`; + it('returns null if symbol not found', () => { + const customCurrency = 'CSTM'; - expect(getCurrencySymbol(customCurrency)).toBe(null); + expect(tuiGetCurrencySymbol(customCurrency)).toBe(null); }); }); diff --git a/projects/addon-commerce/utils/test/get-payment-system.spec.ts b/projects/addon-commerce/utils/test/get-payment-system.spec.ts index 349b0139ea7f..0d35e96b6e1c 100644 --- a/projects/addon-commerce/utils/test/get-payment-system.spec.ts +++ b/projects/addon-commerce/utils/test/get-payment-system.spec.ts @@ -1,106 +1,105 @@ -import {TuiPaymentSystem} from '../../enums/payment-system'; -import {getPaymentSystem} from '../get-payment-system'; +import {tuiGetPaymentSystem} from '../get-payment-system'; -describe(`getPaymentSystem`, () => { - describe(`Visa`, () => { - it(`4`, () => { - expect(getPaymentSystem(`4000`)).toBe(TuiPaymentSystem.Visa); +describe('getPaymentSystem', () => { + describe('Visa', () => { + it('4', () => { + expect(tuiGetPaymentSystem('4000')).toBe('visa'); }); }); - describe(`Electron`, () => { - it(`4026`, () => { - expect(getPaymentSystem(`4026`)).toBe(TuiPaymentSystem.Electron); + describe('electron', () => { + it('4026', () => { + expect(tuiGetPaymentSystem('4026')).toBe('electron'); }); - it(`4175`, () => { - expect(getPaymentSystem(`4175`)).toBe(TuiPaymentSystem.Electron); + it('4175', () => { + expect(tuiGetPaymentSystem('4175')).toBe('electron'); }); - it(`4405`, () => { - expect(getPaymentSystem(`4405`)).toBe(TuiPaymentSystem.Electron); + it('4405', () => { + expect(tuiGetPaymentSystem('4405')).toBe('electron'); }); - it(`4508`, () => { - expect(getPaymentSystem(`4508`)).toBe(TuiPaymentSystem.Electron); + it('4508', () => { + expect(tuiGetPaymentSystem('4508')).toBe('electron'); }); - it(`4844`, () => { - expect(getPaymentSystem(`4844`)).toBe(TuiPaymentSystem.Electron); + it('4844', () => { + expect(tuiGetPaymentSystem('4844')).toBe('electron'); }); - it(`4913`, () => { - expect(getPaymentSystem(`4913`)).toBe(TuiPaymentSystem.Electron); + it('4913', () => { + expect(tuiGetPaymentSystem('4913')).toBe('electron'); }); - it(`4917`, () => { - expect(getPaymentSystem(`4917`)).toBe(TuiPaymentSystem.Electron); + it('4917', () => { + expect(tuiGetPaymentSystem('4917')).toBe('electron'); }); }); - describe(`Mastercard`, () => { - it(`2221`, () => { - expect(getPaymentSystem(`2221`)).toBe(TuiPaymentSystem.Mastercard); + describe('mastercard', () => { + it('2221', () => { + expect(tuiGetPaymentSystem('2221')).toBe('mastercard'); }); - it(`2720`, () => { - expect(getPaymentSystem(`2720`)).toBe(TuiPaymentSystem.Mastercard); + it('2720', () => { + expect(tuiGetPaymentSystem('2720')).toBe('mastercard'); }); - it(`5100`, () => { - expect(getPaymentSystem(`5100`)).toBe(TuiPaymentSystem.Mastercard); + it('5100', () => { + expect(tuiGetPaymentSystem('5100')).toBe('mastercard'); }); - it(`5500`, () => { - expect(getPaymentSystem(`5500`)).toBe(TuiPaymentSystem.Mastercard); + it('5500', () => { + expect(tuiGetPaymentSystem('5500')).toBe('mastercard'); }); - it(`5`, () => { - expect(getPaymentSystem(`5`)).toBe(TuiPaymentSystem.Mastercard); + it('5', () => { + expect(tuiGetPaymentSystem('5')).toBe('mastercard'); }); }); - describe(`Maestro`, () => { - it(`5000`, () => { - expect(getPaymentSystem(`5000`)).toBe(TuiPaymentSystem.Maestro); + describe('maestro', () => { + it('5000', () => { + expect(tuiGetPaymentSystem('5000')).toBe('maestro'); }); - it(`5090`, () => { - expect(getPaymentSystem(`5090`)).toBe(TuiPaymentSystem.Maestro); + it('5090', () => { + expect(tuiGetPaymentSystem('5090')).toBe('maestro'); }); - it(`5600`, () => { - expect(getPaymentSystem(`5600`)).toBe(TuiPaymentSystem.Maestro); + it('5600', () => { + expect(tuiGetPaymentSystem('5600')).toBe('maestro'); }); - it(`5890`, () => { - expect(getPaymentSystem(`5890`)).toBe(TuiPaymentSystem.Maestro); + it('5890', () => { + expect(tuiGetPaymentSystem('5890')).toBe('maestro'); }); - it(`6000`, () => { - expect(getPaymentSystem(`6000`)).toBe(TuiPaymentSystem.Maestro); + it('6000', () => { + expect(tuiGetPaymentSystem('6000')).toBe('maestro'); }); - it(`50`, () => { - expect(getPaymentSystem(`50`)).toBe(TuiPaymentSystem.Maestro); + it('50', () => { + expect(tuiGetPaymentSystem('50')).toBe('maestro'); }); - it(`56`, () => { - expect(getPaymentSystem(`56`)).toBe(TuiPaymentSystem.Maestro); + it('56', () => { + expect(tuiGetPaymentSystem('56')).toBe('maestro'); }); - it(`58`, () => { - expect(getPaymentSystem(`58`)).toBe(TuiPaymentSystem.Maestro); + it('58', () => { + expect(tuiGetPaymentSystem('58')).toBe('maestro'); }); }); - describe(`Mir`, () => { - it(`2200`, () => { - expect(getPaymentSystem(`2200`)).toBe(TuiPaymentSystem.Mir); + describe('Mir', () => { + it('2200', () => { + expect(tuiGetPaymentSystem('2200')).toBe('mir'); }); - it(`2204`, () => { - expect(getPaymentSystem(`2204`)).toBe(TuiPaymentSystem.Mir); + it('2204', () => { + expect(tuiGetPaymentSystem('2204')).toBe('mir'); }); }); }); diff --git a/projects/addon-commerce/utils/test/is-card-length-valid.spec.ts b/projects/addon-commerce/utils/test/is-card-length-valid.spec.ts index 17d9e5feeb07..96d31cba7f1e 100644 --- a/projects/addon-commerce/utils/test/is-card-length-valid.spec.ts +++ b/projects/addon-commerce/utils/test/is-card-length-valid.spec.ts @@ -1,87 +1,87 @@ -import {isCardLengthValid} from '../is-card-length-valid'; +import {tuiIsCardLengthValid} from '../is-card-length-valid'; -describe(`isCardLengthValid`, () => { - describe(`Visa`, () => { - it(`cannot be 12 digits long`, () => { - expect(isCardLengthValid(`400000000000`)).toBe(false); +describe('isCardLengthValid', () => { + describe('Visa', () => { + it('cannot be 12 digits long', () => { + expect(tuiIsCardLengthValid('400000000000')).toBe(false); }); - it(`can be 13 digits long`, () => { - expect(isCardLengthValid(`4000000000000`)).toBe(true); + it('can be 13 digits long', () => { + expect(tuiIsCardLengthValid('4000000000000')).toBe(true); }); - it(`can be 19 digits long`, () => { - expect(isCardLengthValid(`4000000000000000000`)).toBe(true); + it('can be 19 digits long', () => { + expect(tuiIsCardLengthValid('4000000000000000000')).toBe(true); }); }); - describe(`Electron`, () => { - it(`cannot be 15 digits long`, () => { - expect(isCardLengthValid(`402600000000000`)).toBe(false); + describe('Electron', () => { + it('cannot be 15 digits long', () => { + expect(tuiIsCardLengthValid('402600000000000')).toBe(false); }); - it(`can only be 16 digits long`, () => { - expect(isCardLengthValid(`4026000000000000`)).toBe(true); + it('can only be 16 digits long', () => { + expect(tuiIsCardLengthValid('4026000000000000')).toBe(true); }); - it(`cannot be 17 digits long`, () => { - expect(isCardLengthValid(`40260000000000000`)).toBe(false); + it('cannot be 17 digits long', () => { + expect(tuiIsCardLengthValid('40260000000000000')).toBe(false); }); }); - describe(`Mastercard`, () => { - it(`cannot be 15 digits long`, () => { - expect(isCardLengthValid(`510000000000000`)).toBe(false); + describe('Mastercard', () => { + it('cannot be 15 digits long', () => { + expect(tuiIsCardLengthValid('510000000000000')).toBe(false); }); - it(`can be 16 digits long`, () => { - expect(isCardLengthValid(`5100000000000000`)).toBe(true); + it('can be 16 digits long', () => { + expect(tuiIsCardLengthValid('5100000000000000')).toBe(true); }); - it(`can be 19 digits long`, () => { - expect(isCardLengthValid(`5100000000000000000`)).toBe(true); + it('can be 19 digits long', () => { + expect(tuiIsCardLengthValid('5100000000000000000')).toBe(true); }); }); - describe(`Maestro`, () => { - it(`can be 12 digits long`, () => { - expect(isCardLengthValid(`560000000000`)).toBe(true); + describe('Maestro', () => { + it('can be 12 digits long', () => { + expect(tuiIsCardLengthValid('560000000000')).toBe(true); }); - it(`can be 19 digits long`, () => { - expect(isCardLengthValid(`5600000000000000000`)).toBe(true); + it('can be 19 digits long', () => { + expect(tuiIsCardLengthValid('5600000000000000000')).toBe(true); }); }); - describe(`Mir`, () => { - it(`cannot be 15 digits long`, () => { - expect(isCardLengthValid(`220000000000000`)).toBe(false); + describe('Mir', () => { + it('cannot be 15 digits long', () => { + expect(tuiIsCardLengthValid('220000000000000')).toBe(false); }); - it(`can be 16 digits long`, () => { - expect(isCardLengthValid(`2200000000000000`)).toBe(true); + it('can be 16 digits long', () => { + expect(tuiIsCardLengthValid('2200000000000000')).toBe(true); }); - it(`can be 19 digits long`, () => { - expect(isCardLengthValid(`2200000000000000000`)).toBe(true); + it('can be 19 digits long', () => { + expect(tuiIsCardLengthValid('2200000000000000000')).toBe(true); }); }); - describe(`Unknown`, () => { - it(`cannot be 7 digits long`, () => { - expect(isCardLengthValid(`3566002`)).toBe(false); + describe('Unknown', () => { + it('cannot be 7 digits long', () => { + expect(tuiIsCardLengthValid('3566002')).toBe(false); }); - it(`can be 16 digits long`, () => { - expect(isCardLengthValid(`3566002020360505`)).toBe(true); + it('can be 16 digits long', () => { + expect(tuiIsCardLengthValid('3566002020360505')).toBe(true); }); - it(`can be 19 digits long`, () => { - expect(isCardLengthValid(`3566002020360505000`)).toBe(true); + it('can be 19 digits long', () => { + expect(tuiIsCardLengthValid('3566002020360505000')).toBe(true); }); - it(`cannot be 20 digits long`, () => { - expect(isCardLengthValid(`35660020203605050000`)).toBe(false); + it('cannot be 20 digits long', () => { + expect(tuiIsCardLengthValid('35660020203605050000')).toBe(false); }); }); }); diff --git a/projects/addon-commerce/validators/card-number.validator.ts b/projects/addon-commerce/validators/card-number.validator.ts index 62e351b72b34..2ccdae8c79e7 100644 --- a/projects/addon-commerce/validators/card-number.validator.ts +++ b/projects/addon-commerce/validators/card-number.validator.ts @@ -1,11 +1,11 @@ import {AbstractControl, ValidationErrors} from '@angular/forms'; -import {isCardNumberValid} from '@taiga-ui/addon-commerce/utils'; +import {tuiIsCardNumberValid} from '@taiga-ui/addon-commerce/utils'; import {TuiValidationError} from '@taiga-ui/cdk'; export function tuiCardNumberValidator({ value, }: AbstractControl): ValidationErrors | null { - return value?.card && !isCardNumberValid(value.card) - ? {card: new TuiValidationError(`Invalid card number`)} + return value?.card && !tuiIsCardNumberValid(value.card) + ? {card: new TuiValidationError('Invalid card number')} : null; } diff --git a/projects/addon-commerce/validators/luhn.validator.ts b/projects/addon-commerce/validators/luhn.validator.ts index d4aa9b308f9f..b0de3e985f48 100644 --- a/projects/addon-commerce/validators/luhn.validator.ts +++ b/projects/addon-commerce/validators/luhn.validator.ts @@ -1,10 +1,12 @@ import {AbstractControl, ValidatorFn} from '@angular/forms'; -import {isCardNumberValid} from '@taiga-ui/addon-commerce/utils'; +import {tuiIsCardNumberValid} from '@taiga-ui/addon-commerce/utils'; import {TuiValidationError} from '@taiga-ui/cdk'; import {PolymorpheusContent} from '@tinkoff/ng-polymorpheus'; export function tuiCreateLuhnValidator(message: PolymorpheusContent): ValidatorFn { return ({value}: AbstractControl) => { - return isCardNumberValid(value) ? null : {luhn: new TuiValidationError(message)}; + return tuiIsCardNumberValid(value) + ? null + : {luhn: new TuiValidationError(message)}; }; } diff --git a/projects/addon-editor/components/editor-new/editor-new.component.ts b/projects/addon-editor/components/editor-new/editor-new.component.ts index aa1662c340be..01caf11501aa 100644 --- a/projects/addon-editor/components/editor-new/editor-new.component.ts +++ b/projects/addon-editor/components/editor-new/editor-new.component.ts @@ -2,6 +2,7 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, + ElementRef, forwardRef, Inject, Input, @@ -12,28 +13,30 @@ import { } from '@angular/core'; import {NgControl} from '@angular/forms'; import {TuiEditor} from '@taiga-ui/addon-editor/abstract'; +import {TuiEditLinkComponent} from '@taiga-ui/addon-editor/components/edit-link'; import {TuiToolbarNewComponent} from '@taiga-ui/addon-editor/components/toolbar-new'; import {defaultEditorTools} from '@taiga-ui/addon-editor/constants'; import {TuiTiptapEditorService} from '@taiga-ui/addon-editor/directives'; import {TuiEditorTool} from '@taiga-ui/addon-editor/enums'; -import {TIPTAP_EDITOR, TUI_EDITOR_CONTENT_PROCESSOR} from '@taiga-ui/addon-editor/tokens'; +import {TIPTAP_EDITOR} from '@taiga-ui/addon-editor/tokens'; import { AbstractTuiControl, ALWAYS_FALSE_HANDLER, TUI_FOCUSABLE_ITEM_ACCESSOR, TuiBooleanHandler, tuiDefaultProp, - TuiStringHandler, + tuiIsNativeFocusedIn, } from '@taiga-ui/cdk'; import {Editor} from '@tiptap/core'; +import {Mark} from 'prosemirror-model'; import {Observable} from 'rxjs'; import {TUI_EDITOR_NEW_PROVIDERS} from './editor-new.providers'; @Component({ - selector: `tui-editor[new]`, - templateUrl: `./editor-new.component.html`, - styleUrls: [`./editor-new.style.less`], + selector: 'tui-editor[new]', + templateUrl: './editor-new.component.html', + styleUrls: ['./editor-new.style.less'], changeDetection: ChangeDetectionStrategy.OnPush, providers: [ { @@ -47,9 +50,12 @@ export class TuiEditorNewComponent extends AbstractTuiControl implements OnDestroy { + @ViewChild(TuiEditLinkComponent, {read: ElementRef}) + private readonly editLink?: ElementRef; + @Input() @tuiDefaultProp() - exampleText = ``; + exampleText = ''; @Input() @tuiDefaultProp() @@ -58,8 +64,6 @@ export class TuiEditorNewComponent @ViewChild(TuiToolbarNewComponent) readonly toolbar?: TuiToolbarNewComponent; - focused = false; - constructor( @Optional() @Self() @@ -68,8 +72,6 @@ export class TuiEditorNewComponent @Inject(ChangeDetectorRef) changeDetectorRef: ChangeDetectorRef, @Inject(TIPTAP_EDITOR) readonly editorLoaded$: Observable, @Inject(TuiTiptapEditorService) readonly editorService: TuiEditor, - @Inject(TUI_EDITOR_CONTENT_PROCESSOR) - private readonly contentProcessor: TuiStringHandler, ) { super(control, changeDetectorRef); } @@ -82,6 +84,14 @@ export class TuiEditorNewComponent return this.editorService.getOriginTiptapEditor() ? this.editorService : null; } + get focused(): boolean { + return ( + !!this.editor?.isFocused || + (!!this.toolbar && this.toolbar.focused) || + (!!this.editLink && tuiIsNativeFocusedIn(this.editLink.nativeElement)) + ); + } + get placeholderRaised(): boolean { return (this.computedFocused && !this.readOnly) || this.hasValue; } @@ -92,23 +102,18 @@ export class TuiEditorNewComponent ); } - writeValue(value: string | null): void { - const processed = this.contentProcessor(value || ``); - - super.writeValue(processed); - - if (processed !== value) { - this.control?.setValue(processed); - } - } - onHovered(hovered: boolean): void { this.updateHovered(hovered); } - onActiveZone(focused: boolean): void { - this.focused = focused; - this.updateFocused(focused); + selectLinkIfClosest(): void { + if (this.getMarkedLinkBeforeSelectClosest()) { + this.editor?.selectClosest(); + } + } + + onActiveZone(active: boolean): void { + this.updateFocused(active); } onModelChange(value: string): void { @@ -129,13 +134,19 @@ export class TuiEditorNewComponent } protected getFallbackValue(): string { - return ``; + return ''; } - private readonly isSelectionLink = ({startContainer, endContainer}: Range): boolean => - !!startContainer.parentElement?.closest(`a`)?.contains(endContainer); + private readonly isSelectionLink = (): boolean => !!this.editor?.isActive('link'); private get hasValue(): boolean { return !!this.value; } + + private getMarkedLinkBeforeSelectClosest(): Mark | null { + const [link] = this.editor?.state.tr.selection.$anchor.marks() || []; + const isLink = link?.type.name === 'link'; + + return isLink ? link : null; + } } diff --git a/projects/addon-editor/components/editor/editor.component.ts b/projects/addon-editor/components/editor/editor.component.ts index 31c15f4ae575..923235e6eda8 100644 --- a/projects/addon-editor/components/editor/editor.component.ts +++ b/projects/addon-editor/components/editor/editor.component.ts @@ -23,7 +23,6 @@ import {TUI_EDITOR_OPTIONS, TuiEditorOptions} from '@taiga-ui/addon-editor/token import { AbstractTuiControl, ALWAYS_FALSE_HANDLER, - isNativeFocusedIn, isNodeIn, setNativeFocused, TUI_FOCUSABLE_ITEM_ACCESSOR, @@ -32,6 +31,7 @@ import { TuiBooleanHandler, tuiDefaultProp, TuiDestroyService, + tuiIsNativeFocusedIn, typedFromEvent, watch, } from '@taiga-ui/cdk'; @@ -151,7 +151,7 @@ export class TuiEditorComponent extends AbstractTuiControl implements On return ( (!!this.focusableElement && this.focusableElement.focused) || (!!this.toolbar && this.toolbar.focused) || - (!!this.editLink && isNativeFocusedIn(this.editLink.nativeElement)) + (!!this.editLink && tuiIsNativeFocusedIn(this.editLink.nativeElement)) ); } diff --git a/projects/addon-editor/components/toolbar-new/toolbar-navigation-manager.directive.ts b/projects/addon-editor/components/toolbar-new/toolbar-navigation-manager.directive.ts index 8309c8e285c2..b6219b1c11ac 100644 --- a/projects/addon-editor/components/toolbar-new/toolbar-navigation-manager.directive.ts +++ b/projects/addon-editor/components/toolbar-new/toolbar-navigation-manager.directive.ts @@ -2,9 +2,9 @@ import {Directive, ElementRef, HostListener, Inject} from '@angular/core'; import { clamp, getClosestFocusable, - isNativeFocusedIn, isNativeMouseFocusable, setNativeFocused, + tuiIsNativeFocusedIn, TuiNativeFocusableElement, } from '@taiga-ui/cdk'; @@ -26,7 +26,7 @@ export class TuiToolbarNavigationManagerDirective { @HostListener('keydown.arrowLeft.prevent', ['true']) onHorizontalNavigation(toPrevious: boolean): void { const {toolsContainers} = this; - const focusedToolIndex = toolsContainers.findIndex(isNativeFocusedIn); + const focusedToolIndex = toolsContainers.findIndex(tuiIsNativeFocusedIn); const targetToolIndex = clamp( focusedToolIndex + (toPrevious ? -1 : 1), diff --git a/projects/addon-editor/components/toolbar-new/toolbar-new.component.ts b/projects/addon-editor/components/toolbar-new/toolbar-new.component.ts index 3b02b4ec183d..747e90e5ce6b 100644 --- a/projects/addon-editor/components/toolbar-new/toolbar-new.component.ts +++ b/projects/addon-editor/components/toolbar-new/toolbar-new.component.ts @@ -25,10 +25,10 @@ import { } from '@taiga-ui/addon-editor/tokens'; import { EMPTY_QUERY, - isNativeFocusedIn, setNativeFocused, tuiDefaultProp, TuiHandler, + tuiIsNativeFocusedIn, } from '@taiga-ui/cdk'; import {TuiHostedDropdownComponent} from '@taiga-ui/core'; import {LanguageEditor} from '@taiga-ui/i18n'; @@ -99,8 +99,10 @@ export class TuiToolbarNewComponent { get focused(): boolean { return ( - isNativeFocusedIn(this.elementRef.nativeElement) || - !!this.dropdowns.find(({nativeElement}) => isNativeFocusedIn(nativeElement)) + tuiIsNativeFocusedIn(this.elementRef.nativeElement) || + !!this.dropdowns.find(({nativeElement}) => + tuiIsNativeFocusedIn(nativeElement), + ) ); } diff --git a/projects/addon-editor/components/toolbar/toolbar.component.ts b/projects/addon-editor/components/toolbar/toolbar.component.ts index c2c70503fb73..f1f45c862243 100644 --- a/projects/addon-editor/components/toolbar/toolbar.component.ts +++ b/projects/addon-editor/components/toolbar/toolbar.component.ts @@ -28,12 +28,12 @@ import {isSelectionIn, tuiInsertHtml} from '@taiga-ui/addon-editor/utils'; import { EMPTY_QUERY, isFirefox, - isNativeFocusedIn, isNumber, setNativeFocused, tuiDefaultProp, TuiDestroyService, TuiHandler, + tuiIsNativeFocusedIn, TuiNativeFocusableElement, typedFromEvent, } from '@taiga-ui/cdk'; @@ -173,8 +173,10 @@ export class TuiToolbarComponent { get focused(): boolean { return ( - isNativeFocusedIn(this.elementRef.nativeElement) || - !!this.dropdowns.find(({nativeElement}) => isNativeFocusedIn(nativeElement)) + tuiIsNativeFocusedIn(this.elementRef.nativeElement) || + !!this.dropdowns.find(({nativeElement}) => + tuiIsNativeFocusedIn(nativeElement), + ) ); } diff --git a/projects/addon-mobile/directives/touchable/touchable.directive.ts b/projects/addon-mobile/directives/touchable/touchable.directive.ts index 253855588a41..bdcea3ab07fc 100644 --- a/projects/addon-mobile/directives/touchable/touchable.directive.ts +++ b/projects/addon-mobile/directives/touchable/touchable.directive.ts @@ -1,5 +1,5 @@ import {Directive, ElementRef, Inject, Input, Optional, Renderer2} from '@angular/core'; -import {TuiTouchModeT} from '@taiga-ui/addon-mobile/types'; +import {TuiTouchMode} from '@taiga-ui/addon-mobile/types'; import {findTouchIndex} from '@taiga-ui/addon-mobile/utils'; import { TUI_IS_IOS, @@ -12,19 +12,19 @@ import {race} from 'rxjs'; import {filter, map, switchMap, take, takeUntil, tap} from 'rxjs/operators'; const STYLE = { - transform: `scale(0.95)`, - opacity: `0.6`, - background: `rgba(146, 153, 162, 0.12)`, + transform: 'scale(0.95)', + opacity: '0.6', + background: 'rgba(146, 153, 162, 0.12)', } as const; @Directive({ - selector: `[tuiTouchable]`, + selector: '[tuiTouchable]', providers: [TuiDestroyService], }) export class TuiTouchableDirective { @Input() @tuiDefaultProp() - tuiTouchable: TuiTouchModeT | '' = ``; + tuiTouchable: TuiTouchMode | '' = ''; constructor( @Optional() @Inject(TUI_ELEMENT_REF) elementRef: ElementRef | null, @@ -39,7 +39,7 @@ export class TuiTouchableDirective { const element = elementRef ? elementRef.nativeElement : nativeElement; - typedFromEvent(element, `touchstart`, {passive: true}) + typedFromEvent(element, 'touchstart', {passive: true}) .pipe( tap(() => { this.onTouchStart(renderer, element); @@ -47,25 +47,25 @@ export class TuiTouchableDirective { map(({touches}) => touches[touches.length - 1].identifier), switchMap(identifier => race( - typedFromEvent(element, `touchmove`, {passive: true}).pipe( + typedFromEvent(element, 'touchmove', {passive: true}).pipe( filter(({touches}) => this.hasTouchLeft(element, touches, identifier), ), ), - typedFromEvent(element, `touchend`), + typedFromEvent(element, 'touchend'), ).pipe(take(1)), ), takeUntil(destroy$), ) .subscribe(() => { - renderer.removeStyle(element, `transform`); - renderer.removeStyle(element, `opacity`); - renderer.removeStyle(element, `background`); + renderer.removeStyle(element, 'transform'); + renderer.removeStyle(element, 'opacity'); + renderer.removeStyle(element, 'background'); }); } - get style(): TuiTouchModeT { - return this.tuiTouchable || `transform`; + get style(): TuiTouchMode { + return this.tuiTouchable || 'transform'; } private hasTouchLeft( @@ -86,10 +86,10 @@ export class TuiTouchableDirective { } private onTouchStart(renderer: Renderer2, element: HTMLElement): void { - if (this.style !== `transform`) { - renderer.removeStyle(element, `transition`); + if (this.style !== 'transform') { + renderer.removeStyle(element, 'transition'); } else { - renderer.setStyle(element, `transition`, `transform 0.2s`); + renderer.setStyle(element, 'transition', 'transform 0.2s'); } renderer.setStyle(element, this.style, STYLE[this.style]); diff --git a/projects/addon-mobile/enums/index.ts b/projects/addon-mobile/enums/index.ts deleted file mode 100644 index 40fe00bfcf0d..000000000000 --- a/projects/addon-mobile/enums/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './touch-mode'; diff --git a/projects/addon-mobile/enums/package.json b/projects/addon-mobile/enums/package.json deleted file mode 100644 index 289d2d373a50..000000000000 --- a/projects/addon-mobile/enums/package.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "ngPackage": { - "lib": { - "entryFile": "index.ts" - } - } -} diff --git a/projects/addon-mobile/enums/touch-mode.ts b/projects/addon-mobile/enums/touch-mode.ts deleted file mode 100644 index a3c8868b4423..000000000000 --- a/projects/addon-mobile/enums/touch-mode.ts +++ /dev/null @@ -1,8 +0,0 @@ -/** - * @deprecated use join type {@link TuiTouchModeT} - */ -export const enum TuiTouchMode { - Transform = `transform`, - Opacity = `opacity`, - Background = `background`, -} diff --git a/projects/addon-mobile/index.ts b/projects/addon-mobile/index.ts index 10788b5bf850..8a04a0604941 100644 --- a/projects/addon-mobile/index.ts +++ b/projects/addon-mobile/index.ts @@ -1,7 +1,6 @@ export * from '@taiga-ui/addon-mobile/components'; export * from '@taiga-ui/addon-mobile/const'; export * from '@taiga-ui/addon-mobile/directives'; -export * from '@taiga-ui/addon-mobile/enums'; export * from '@taiga-ui/addon-mobile/interfaces'; export * from '@taiga-ui/addon-mobile/tokens'; export * from '@taiga-ui/addon-mobile/types'; diff --git a/projects/addon-mobile/types/touch-mode.ts b/projects/addon-mobile/types/touch-mode.ts index 0b8a42d8b48d..49331b113842 100644 --- a/projects/addon-mobile/types/touch-mode.ts +++ b/projects/addon-mobile/types/touch-mode.ts @@ -1 +1 @@ -export type TuiTouchModeT = 'transform' | 'opacity' | 'background'; +export type TuiTouchMode = 'transform' | 'opacity' | 'background'; diff --git a/projects/cdk/schematics/ng-update/constants/enums.ts b/projects/cdk/schematics/ng-update/constants/enums.ts index f2e67209c304..a1c0c15cb5be 100644 --- a/projects/cdk/schematics/ng-update/constants/enums.ts +++ b/projects/cdk/schematics/ng-update/constants/enums.ts @@ -5,6 +5,17 @@ interface ReplacementEnum { } export const ENUMS_TO_REPLACE: ReplacementEnum[] = [ + { + name: 'TuiPaymentSystem', + replaceValues: { + Visa: 'visa', + Electron: 'electron', + Mastercard: 'mastercard', + Maestro: 'maestro', + Mir: 'mir', + }, + keepAsType: true, + }, { name: 'TuiTextAlign', replaceValues: { diff --git a/projects/cdk/utils/focus/blur-native-focused.ts b/projects/cdk/utils/focus/blur-native-focused.ts index ab8b141450d0..2d275a3cfe82 100644 --- a/projects/cdk/utils/focus/blur-native-focused.ts +++ b/projects/cdk/utils/focus/blur-native-focused.ts @@ -1,5 +1,4 @@ import {tuiGetNativeFocused} from './get-native-focused'; -import {setNativeFocused} from './set-native-focused'; /** * @deprecated: use {@link tuiBlurNativeFocused} instead @@ -11,7 +10,7 @@ export function blurNativeFocused(documentRef: Document): void { // TODO: iframe warning if (activeElement instanceof HTMLElement) { - setNativeFocused(activeElement, false); + activeElement.blur(); } } diff --git a/projects/cdk/utils/focus/is-native-focused-in.ts b/projects/cdk/utils/focus/is-native-focused-in.ts index 1018cd37d769..fcb4b869c5cc 100644 --- a/projects/cdk/utils/focus/is-native-focused-in.ts +++ b/projects/cdk/utils/focus/is-native-focused-in.ts @@ -1,14 +1,13 @@ import {tuiGetNativeFocused} from './get-native-focused'; /** - * @deprecated: use {@link tuiIsNativeFocusedIn} instead * Checks if focused element is within given element. * * @param node * @return true if focused node is contained within element */ // eslint-disable-next-line @typescript-eslint/naming-convention -export function isNativeFocusedIn(node: Node): boolean { +export function tuiIsNativeFocusedIn(node: Node): boolean { // !node.contains - check for IE11 if (!node.ownerDocument || !node.contains) { return false; @@ -18,5 +17,3 @@ export function isNativeFocusedIn(node: Node): boolean { return nativeFocused !== null && node.contains(nativeFocused); } - -export const tuiIsNativeFocusedIn = isNativeFocusedIn; diff --git a/projects/cdk/utils/focus/tests/is-native-focused-in.spec.ts b/projects/cdk/utils/focus/tests/is-native-focused-in.spec.ts index a47a786951dd..ad7d5e76ae58 100644 --- a/projects/cdk/utils/focus/tests/is-native-focused-in.spec.ts +++ b/projects/cdk/utils/focus/tests/is-native-focused-in.spec.ts @@ -1,15 +1,15 @@ -import {isNativeFocusedIn} from '../is-native-focused-in'; +import {tuiIsNativeFocusedIn} from '../is-native-focused-in'; describe(`isNativeFocusedIn`, () => { it(`element is not focused in`, () => { const element = document.createElement(`button`); - expect(isNativeFocusedIn(element)).toEqual(false); + expect(tuiIsNativeFocusedIn(element)).toEqual(false); }); it(`should return false if ownerDocument is null`, () => { const element = {ownerDocument: null} as Node; - expect(isNativeFocusedIn(element)).toEqual(false); + expect(tuiIsNativeFocusedIn(element)).toEqual(false); }); }); diff --git a/projects/core/components/data-list/data-list.component.ts b/projects/core/components/data-list/data-list.component.ts index b095179f74f1..35d0f0253f3c 100644 --- a/projects/core/components/data-list/data-list.component.ts +++ b/projects/core/components/data-list/data-list.component.ts @@ -13,12 +13,12 @@ import { } from '@angular/core'; import { EMPTY_QUERY, - isNativeFocusedIn, isPresent, itemsQueryListObservable, setNativeMouseFocused, tuiAssertIsElement, tuiDefaultProp, + tuiIsNativeFocusedIn, tuiMoveFocus, tuiPure, } from '@taiga-ui/cdk'; @@ -94,7 +94,7 @@ export class TuiDataListComponent implements TuiDataListAccessor { @HostListener('wheel.silent.passive') @HostListener('mouseleave', ['$event.target']) handleFocusLossIfNecessary(element: Element = this.elementRef.nativeElement): void { - if (this.origin && isNativeFocusedIn(element)) { + if (this.origin && tuiIsNativeFocusedIn(element)) { setNativeMouseFocused(this.origin, true, true); } } diff --git a/projects/core/components/hosted-dropdown/hosted-dropdown.component.ts b/projects/core/components/hosted-dropdown/hosted-dropdown.component.ts index c035d86aac51..729c6a678f51 100644 --- a/projects/core/components/hosted-dropdown/hosted-dropdown.component.ts +++ b/projects/core/components/hosted-dropdown/hosted-dropdown.component.ts @@ -15,7 +15,6 @@ import { import { getClosestFocusable, isElementEditable, - isNativeFocusedIn, isNativeKeyboardFocusable, setNativeFocused, TUI_FOCUSABLE_ITEM_ACCESSOR, @@ -23,6 +22,7 @@ import { TuiContextWithImplicit, tuiDefaultProp, TuiFocusableElementAccessor, + tuiIsNativeFocusedIn, TuiNativeFocusableElement, } from '@taiga-ui/cdk'; import {TuiDropdownDirective} from '@taiga-ui/core/directives/dropdown'; @@ -104,8 +104,10 @@ export class TuiHostedDropdownComponent implements TuiFocusableElementAccessor { @HostBinding(`class._hosted_dropdown_focused`) get focused(): boolean { return ( - isNativeFocusedIn(this.host) || - (this.open && !!this.wrapper && isNativeFocusedIn(this.wrapper.nativeElement)) + tuiIsNativeFocusedIn(this.host) || + (this.open && + !!this.wrapper && + tuiIsNativeFocusedIn(this.wrapper.nativeElement)) ); } diff --git a/projects/core/components/loader/loader.component.ts b/projects/core/components/loader/loader.component.ts index a7eaae64dc77..7ec626545856 100644 --- a/projects/core/components/loader/loader.component.ts +++ b/projects/core/components/loader/loader.component.ts @@ -9,10 +9,10 @@ import { } from '@angular/core'; import { blurNativeFocused, - isNativeFocusedIn, isSafari, TUI_IS_IOS, tuiDefaultProp, + tuiIsNativeFocusedIn, tuiRequiredSetter, } from '@taiga-ui/cdk'; import {sizeBigger} from '@taiga-ui/core/utils/miscellaneous'; @@ -81,6 +81,6 @@ export class TuiLoaderComponent { } get focused(): boolean { - return isNativeFocusedIn(this.elementRef.nativeElement); + return tuiIsNativeFocusedIn(this.elementRef.nativeElement); } } diff --git a/projects/core/components/primitive-textfield/primitive-textfield.component.ts b/projects/core/components/primitive-textfield/primitive-textfield.component.ts index 65a20c76dd16..016480bdd58c 100644 --- a/projects/core/components/primitive-textfield/primitive-textfield.component.ts +++ b/projects/core/components/primitive-textfield/primitive-textfield.component.ts @@ -14,11 +14,10 @@ import { } from '@angular/core'; import { AbstractTuiInteractive, - isNativeFocusedIn, - setNativeFocused, TuiContextWithImplicit, TuiCreditCardAutofillName, tuiDefaultProp, + tuiIsNativeFocusedIn, tuiPure, } from '@taiga-ui/cdk'; import { @@ -144,7 +143,7 @@ export class TuiPrimitiveTextfieldComponent } get focused(): boolean { - return isNativeFocusedIn(this.elementRef.nativeElement); + return tuiIsNativeFocusedIn(this.elementRef.nativeElement); } @HostBinding('attr.data-size') @@ -276,7 +275,7 @@ export class TuiPrimitiveTextfieldComponent } event.preventDefault(); - setNativeFocused(nativeFocusableElement); + nativeFocusableElement.focus(); } onModelChange(value: string): void { diff --git a/projects/demo/src/modules/charts/axes/axes.component.ts b/projects/demo/src/modules/charts/axes/axes.component.ts index a3592673f65b..ff0c7f318cbd 100644 --- a/projects/demo/src/modules/charts/axes/axes.component.ts +++ b/projects/demo/src/modules/charts/axes/axes.component.ts @@ -4,57 +4,52 @@ import { TUI_ALWAYS_DASHED, TUI_ALWAYS_SOLID, TuiLineHandler, - TuiLineTypeT, + TuiLineType, } from '@taiga-ui/addon-charts'; import {TuiDocExample} from '@taiga-ui/addon-doc'; @Component({ - selector: `example-tui-axes`, - templateUrl: `./axes.template.html`, - styleUrls: [`./axes.style.less`], + selector: 'example-tui-axes', + templateUrl: './axes.template.html', + styleUrls: ['./axes.style.less'], changeDetection, }) export class ExampleTuiAxesComponent { - readonly exampleModule = import(`!!raw-loader!./examples/import/import-module.md`); - readonly exampleHtml = import(`!!raw-loader!./examples/import/insert-template.md`); + readonly exampleModule = import('!!raw-loader!./examples/import/import-module.md'); + readonly exampleHtml = import('!!raw-loader!./examples/import/insert-template.md'); readonly example1: TuiDocExample = { - TypeScript: import(`!!raw-loader!./examples/1/index.ts`), - HTML: import(`!!raw-loader!./examples/1/index.html`), - LESS: import(`!!raw-loader!./examples/1/index.less`), + TypeScript: import('!!raw-loader!./examples/1/index.ts'), + HTML: import('!!raw-loader!./examples/1/index.html'), + LESS: import('!!raw-loader!./examples/1/index.less'), }; readonly example2: TuiDocExample = { - TypeScript: import(`!!raw-loader!./examples/2/index.ts`), - HTML: import(`!!raw-loader!./examples/2/index.html`), - LESS: import(`!!raw-loader!./examples/2/index.less`), + TypeScript: import('!!raw-loader!./examples/2/index.ts'), + HTML: import('!!raw-loader!./examples/2/index.html'), + LESS: import('!!raw-loader!./examples/2/index.less'), }; - readonly lineVariants: readonly TuiLineTypeT[] = [ - `solid`, - `dashed`, - `none`, - `hidden`, - ]; + readonly lineVariants: readonly TuiLineType[] = ['solid', 'dashed', 'none', 'hidden']; readonly labelsXVariants: ReadonlyArray> = [ [], - [``, `25%`, `50%`, `100%`], - [`One`, `Two`, `Three`], - [`One`, null, ``, `Two and a half`, `Three`, null], + ['', '25%', '50%', '100%'], + ['One', 'Two', 'Three'], + ['One', null, '', 'Two and a half', 'Three', null], ]; readonly labelsYVariants: ReadonlyArray = [ [], - [``, `25%`, `50%`, `100%`], - [`One`, `Two`, `Three`], - [`One`, ``, `Two and a half`, `Three`], + ['', '25%', '50%', '100%'], + ['One', 'Two', 'Three'], + ['One', '', 'Two and a half', 'Three'], ]; readonly handlerVariants: readonly TuiLineHandler[] = [ TUI_ALWAYS_SOLID, TUI_ALWAYS_DASHED, - index => (index % 2 ? `dashed` : `solid`), + index => (index % 2 ? 'dashed' : 'solid'), ]; axisX = this.lineVariants[0]; @@ -67,13 +62,13 @@ export class ExampleTuiAxesComponent { axisYLabels = this.labelsYVariants[0]; - axisYName = ``; + axisYName = ''; axisYSecondaryInset = false; axisYSecondaryLabels = this.labelsYVariants[0]; - axisYSecondaryName = ``; + axisYSecondaryName = ''; horizontalLines = 0; diff --git a/projects/demo/src/modules/charts/bar-chart/bar-chart.component.ts b/projects/demo/src/modules/charts/bar-chart/bar-chart.component.ts index f93f9306d4d5..2ad8010c3466 100644 --- a/projects/demo/src/modules/charts/bar-chart/bar-chart.component.ts +++ b/projects/demo/src/modules/charts/bar-chart/bar-chart.component.ts @@ -1,6 +1,6 @@ import {Component} from '@angular/core'; import {changeDetection} from '@demo/emulate/change-detection'; -import {getCurrencySymbol, TuiCurrency} from '@taiga-ui/addon-commerce'; +import {TuiCurrency, tuiGetCurrencySymbol} from '@taiga-ui/addon-commerce'; import {TuiDocExample} from '@taiga-ui/addon-doc'; import {TuiContextWithImplicit} from '@taiga-ui/cdk'; import {formatNumber, TuiHintModeT, TuiSizeL, TuiSizeS} from '@taiga-ui/core'; @@ -83,7 +83,7 @@ export class ExampleTuiBarChartComponent { return this.value .reduce( (result, set) => - `${result}${formatNumber(set[index])} ${getCurrencySymbol( + `${result}${formatNumber(set[index])} ${tuiGetCurrencySymbol( TuiCurrency.Ruble, )}\n`, ``, diff --git a/projects/demo/src/modules/charts/pie-chart/pie-chart.component.ts b/projects/demo/src/modules/charts/pie-chart/pie-chart.component.ts index 6eb095f8a7d9..ce234d5f9184 100644 --- a/projects/demo/src/modules/charts/pie-chart/pie-chart.component.ts +++ b/projects/demo/src/modules/charts/pie-chart/pie-chart.component.ts @@ -1,6 +1,6 @@ import {Component} from '@angular/core'; import {changeDetection} from '@demo/emulate/change-detection'; -import {getCurrencySymbol, TuiCurrency} from '@taiga-ui/addon-commerce'; +import {TuiCurrency, tuiGetCurrencySymbol} from '@taiga-ui/addon-commerce'; import {TuiDocExample} from '@taiga-ui/addon-doc'; import {round, sum, TuiContextWithImplicit} from '@taiga-ui/cdk'; import {formatNumber, TuiSizeXL, TuiSizeXS} from '@taiga-ui/core'; @@ -65,7 +65,7 @@ export class ExampleTuiPieChartComponent { } format(index: number): string { - return `${formatNumber(this.value[index])} ${getCurrencySymbol( + return `${formatNumber(this.value[index])} ${tuiGetCurrencySymbol( TuiCurrency.Ruble, )}`; } diff --git a/projects/demo/src/modules/components/card/card.component.ts b/projects/demo/src/modules/components/card/card.component.ts index 8c3a00a0be3e..a2f2f7d3af74 100644 --- a/projects/demo/src/modules/components/card/card.component.ts +++ b/projects/demo/src/modules/components/card/card.component.ts @@ -45,10 +45,10 @@ export class ExampleTuiCardComponent { }; paymentSystemVariants: readonly TuiPaymentSystem[] = [ - TuiPaymentSystem.Visa, - TuiPaymentSystem.Maestro, - TuiPaymentSystem.Mastercard, - TuiPaymentSystem.Mir, + 'visa', + 'maestro', + 'mastercard', + 'mir', ]; brandLogoVariants = [``, ...BRAND_LOGOS]; diff --git a/projects/demo/src/modules/components/card/examples/3/index.ts b/projects/demo/src/modules/components/card/examples/3/index.ts index 0ca4316fca91..9fe2766d09b4 100644 --- a/projects/demo/src/modules/components/card/examples/3/index.ts +++ b/projects/demo/src/modules/components/card/examples/3/index.ts @@ -4,13 +4,13 @@ import {encapsulation} from '@demo/emulate/encapsulation'; import {TuiPaymentSystem} from '@taiga-ui/addon-commerce'; @Component({ - selector: `tui-card-example-3`, - templateUrl: `./index.html`, - styleUrls: [`./index.less`], + selector: 'tui-card-example-3', + templateUrl: './index.html', + styleUrls: ['./index.less'], changeDetection, encapsulation, }) export class TuiCardExample3 { - readonly paymentSystem = TuiPaymentSystem.Mir; - readonly brandLogo = `https://ng-web-apis.github.io/dist/assets/images/web-api.svg`; + readonly paymentSystem: TuiPaymentSystem = 'mir'; + readonly brandLogo = 'https://ng-web-apis.github.io/dist/assets/images/web-api.svg'; } diff --git a/projects/demo/src/modules/components/money/money.component.ts b/projects/demo/src/modules/components/money/money.component.ts index 88718dd96fa0..9d209a8f85e8 100644 --- a/projects/demo/src/modules/components/money/money.component.ts +++ b/projects/demo/src/modules/components/money/money.component.ts @@ -4,48 +4,48 @@ import { TuiCurrency, TuiCurrencyCode, TuiCurrencyVariants, - TuiMoneySignT, + TuiMoneySign, } from '@taiga-ui/addon-commerce'; import {TuiDocExample} from '@taiga-ui/addon-doc'; import {TuiDecimalT} from '@taiga-ui/core'; @Component({ - selector: `example-tui-money`, - templateUrl: `./money.template.html`, + selector: 'example-tui-money', + templateUrl: './money.template.html', changeDetection, }) export class ExampleTuiMoneyComponent { - readonly exampleModule = import(`!!raw-loader!./examples/import/import-module.md`); + readonly exampleModule = import('!!raw-loader!./examples/import/import-module.md'); - readonly exampleHtml = import(`!!raw-loader!./examples/import/insert-template.md`); + readonly exampleHtml = import('!!raw-loader!./examples/import/insert-template.md'); readonly example1: TuiDocExample = { - TypeScript: import(`!!raw-loader!./examples/1/index.ts`), - HTML: import(`!!raw-loader!./examples/1/index.html`), + TypeScript: import('!!raw-loader!./examples/1/index.ts'), + HTML: import('!!raw-loader!./examples/1/index.html'), }; readonly example2: TuiDocExample = { - TypeScript: import(`!!raw-loader!./examples/2/index.ts`), - HTML: import(`!!raw-loader!./examples/2/index.html`), + TypeScript: import('!!raw-loader!./examples/2/index.ts'), + HTML: import('!!raw-loader!./examples/2/index.html'), }; readonly example3: TuiDocExample = { - TypeScript: import(`!!raw-loader!./examples/3/index.ts`), - HTML: import(`!!raw-loader!./examples/3/index.html`), - LESS: import(`!!raw-loader!./examples/3/index.less`), + TypeScript: import('!!raw-loader!./examples/3/index.ts'), + HTML: import('!!raw-loader!./examples/3/index.html'), + LESS: import('!!raw-loader!./examples/3/index.less'), }; readonly example4: TuiDocExample = { - TypeScript: import(`!!raw-loader!./examples/4/index.ts`), - HTML: import(`!!raw-loader!./examples/4/index.html`), + TypeScript: import('!!raw-loader!./examples/4/index.ts'), + HTML: import('!!raw-loader!./examples/4/index.html'), }; readonly example5: TuiDocExample = { - TypeScript: import(`!!raw-loader!./examples/5/index.ts`), - HTML: import(`!!raw-loader!./examples/5/index.html`), + TypeScript: import('!!raw-loader!./examples/5/index.ts'), + HTML: import('!!raw-loader!./examples/5/index.html'), }; - readonly decimalVariants: readonly TuiDecimalT[] = [`not-zero`, `always`, `never`]; + readonly decimalVariants: readonly TuiDecimalT[] = ['not-zero', 'always', 'never']; decimal = this.decimalVariants[0]; @@ -55,7 +55,7 @@ export class ExampleTuiMoneyComponent { TuiCurrency.Dollar, TuiCurrency.Pound, TuiCurrencyCode.TurkishLira, - `UGX`, + 'UGX', ]; currency = this.currencyVariants[0]; @@ -66,12 +66,12 @@ export class ExampleTuiMoneyComponent { colored = false; - readonly signVariants: readonly TuiMoneySignT[] = [ - `negative-only`, - `always`, - `never`, - `force-negative`, - `force-positive`, + readonly signVariants: readonly TuiMoneySign[] = [ + 'negative-only', + 'always', + 'never', + 'force-negative', + 'force-positive', ]; sign = this.signVariants[0]; diff --git a/projects/demo/src/modules/utils/format/examples/3/index.ts b/projects/demo/src/modules/utils/format/examples/3/index.ts index aa504671453e..cbc26711c0eb 100644 --- a/projects/demo/src/modules/utils/format/examples/3/index.ts +++ b/projects/demo/src/modules/utils/format/examples/3/index.ts @@ -2,7 +2,7 @@ import {Component} from '@angular/core'; import {FormControl, FormGroup} from '@angular/forms'; import {changeDetection} from '@demo/emulate/change-detection'; import {encapsulation} from '@demo/emulate/encapsulation'; -import {getCurrencySymbol} from '@taiga-ui/addon-commerce'; +import {tuiGetCurrencySymbol} from '@taiga-ui/addon-commerce'; @Component({ selector: `tui-format-example-3`, @@ -21,6 +21,6 @@ export class TuiFormatExample3 { get currency(): string | null { const {currency} = this.parametersForm.value; - return getCurrencySymbol(currency); + return tuiGetCurrencySymbol(currency); } } diff --git a/projects/demo/src/modules/utils/miscellaneous/examples/4/index.ts b/projects/demo/src/modules/utils/miscellaneous/examples/4/index.ts index 39f2d53436cd..ab2e67baff62 100644 --- a/projects/demo/src/modules/utils/miscellaneous/examples/4/index.ts +++ b/projects/demo/src/modules/utils/miscellaneous/examples/4/index.ts @@ -2,7 +2,7 @@ import {Component} from '@angular/core'; import {FormControl, FormGroup} from '@angular/forms'; import {changeDetection} from '@demo/emulate/change-detection'; import {encapsulation} from '@demo/emulate/encapsulation'; -import {getPaymentSystem} from '@taiga-ui/addon-commerce'; +import {tuiGetPaymentSystem} from '@taiga-ui/addon-commerce'; @Component({ selector: `tui-miscellaneous-example-4`, @@ -27,6 +27,6 @@ export class TuiMiscellaneousExample4 { get paymentSystem(): string | null { const {cardNumber} = this.parametersForm.value; - return getPaymentSystem(cardNumber); + return tuiGetPaymentSystem(cardNumber); } } diff --git a/projects/kit/components/filter/filter.component.ts b/projects/kit/components/filter/filter.component.ts index 9f5e1e831e30..2ab1d7873f86 100644 --- a/projects/kit/components/filter/filter.component.ts +++ b/projects/kit/components/filter/filter.component.ts @@ -15,7 +15,6 @@ import {NgControl} from '@angular/forms'; import { AbstractTuiMultipleControl, ALWAYS_FALSE_HANDLER, - isNativeFocusedIn, TUI_DEFAULT_IDENTITY_MATCHER, TUI_DEFAULT_STRINGIFY, TuiBooleanHandler, @@ -23,6 +22,7 @@ import { tuiDefaultProp, TuiHandler, TuiIdentityMatcher, + tuiIsNativeFocusedIn, tuiPure, } from '@taiga-ui/cdk'; import {TuiSizeL, TuiSizeS} from '@taiga-ui/core'; @@ -77,7 +77,7 @@ export class TuiFilterComponent extends AbstractTuiMultipleControl { badgeHandler: TuiHandler = item => Number(item); get focused(): boolean { - return isNativeFocusedIn(this.elementRef.nativeElement); + return tuiIsNativeFocusedIn(this.elementRef.nativeElement); } @tuiPure diff --git a/projects/kit/components/input-range/input-range.component.ts b/projects/kit/components/input-range/input-range.component.ts index e545becb37cb..748bc4bd211e 100644 --- a/projects/kit/components/input-range/input-range.component.ts +++ b/projects/kit/components/input-range/input-range.component.ts @@ -18,7 +18,6 @@ import {NgControl} from '@angular/forms'; import { clamp, EMPTY_QUERY, - isNativeFocusedIn, round, TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_MOBILE, @@ -26,6 +25,7 @@ import { tuiDefaultProp, TuiFocusableElementAccessor, tuiIsNativeFocused, + tuiIsNativeFocusedIn, TuiNativeFocusableElement, } from '@taiga-ui/cdk'; import { @@ -149,7 +149,7 @@ export class TuiInputRangeComponent } get focused(): boolean { - return isNativeFocusedIn(this.elementRef.nativeElement); + return tuiIsNativeFocusedIn(this.elementRef.nativeElement); } get showLeftValueContent(): boolean { diff --git a/projects/kit/components/input-tag/input-tag.component.ts b/projects/kit/components/input-tag/input-tag.component.ts index 2a45d66461ab..b674b06e880b 100644 --- a/projects/kit/components/input-tag/input-tag.component.ts +++ b/projects/kit/components/input-tag/input-tag.component.ts @@ -24,7 +24,6 @@ import { ALWAYS_TRUE_HANDLER, EMPTY_QUERY, getActualTarget, - isNativeFocusedIn, preventDefault, setNativeFocused, TUI_FOCUSABLE_ITEM_ACCESSOR, @@ -33,6 +32,7 @@ import { TuiContextWithImplicit, tuiDefaultProp, TuiFocusableElementAccessor, + tuiIsNativeFocusedIn, TuiScrollService, typedFromEvent, } from '@taiga-ui/cdk'; @@ -216,7 +216,7 @@ export class TuiInputTagComponent get focused(): boolean { return ( - isNativeFocusedIn(this.elementRef.nativeElement) || + tuiIsNativeFocusedIn(this.elementRef.nativeElement) || !!this.hostedDropdown?.focused ); } diff --git a/projects/kit/components/pagination/pagination.component.ts b/projects/kit/components/pagination/pagination.component.ts index 4da1d7b8827f..c908033abf67 100644 --- a/projects/kit/components/pagination/pagination.component.ts +++ b/projects/kit/components/pagination/pagination.component.ts @@ -15,12 +15,12 @@ import { AbstractTuiInteractive, clamp, EMPTY_QUERY, - isNativeFocusedIn, setNativeFocused, TUI_FOCUSABLE_ITEM_ACCESSOR, TuiContextWithImplicit, tuiDefaultProp, TuiFocusableElementAccessor, + tuiIsNativeFocusedIn, TuiNativeFocusableElement, } from '@taiga-ui/cdk'; import { @@ -145,7 +145,7 @@ export class TuiPaginationComponent } get focused(): boolean { - return isNativeFocusedIn(this.elementRef.nativeElement); + return tuiIsNativeFocusedIn(this.elementRef.nativeElement); } /** diff --git a/projects/kit/components/radio-list/radio-list.component.ts b/projects/kit/components/radio-list/radio-list.component.ts index 3df94131e669..a9fc818ea9f5 100644 --- a/projects/kit/components/radio-list/radio-list.component.ts +++ b/projects/kit/components/radio-list/radio-list.component.ts @@ -17,12 +17,12 @@ import { AbstractTuiNullableControl, ALWAYS_FALSE_HANDLER, EMPTY_QUERY, - isNativeFocusedIn, TUI_DEFAULT_IDENTITY_MATCHER, TUI_FOCUSABLE_ITEM_ACCESSOR, TuiBooleanHandler, tuiDefaultProp, TuiIdentityMatcher, + tuiIsNativeFocusedIn, TuiNativeFocusableElement, } from '@taiga-ui/cdk'; import {TuiOrientationT, TuiSizeL, TuiValueContentContext} from '@taiga-ui/core'; @@ -95,7 +95,7 @@ export class TuiRadioListComponent extends AbstractTuiNullableControl { } get focused(): boolean { - return isNativeFocusedIn(this.elementRef.nativeElement); + return tuiIsNativeFocusedIn(this.elementRef.nativeElement); } computeId(index: number): string { diff --git a/projects/kit/components/range/range.component.ts b/projects/kit/components/range/range.component.ts index 97bbd4ce7d93..9f9c0cebc2d0 100644 --- a/projects/kit/components/range/range.component.ts +++ b/projects/kit/components/range/range.component.ts @@ -19,7 +19,6 @@ import {NgControl} from '@angular/forms'; import { clamp, EMPTY_QUERY, - isNativeFocusedIn, nonNegativeFiniteAssertion, quantize, round, @@ -27,6 +26,7 @@ import { tuiAssert, tuiDefaultProp, TuiFocusableElementAccessor, + tuiIsNativeFocusedIn, TuiNativeFocusableElement, tuiPure, } from '@taiga-ui/cdk'; @@ -152,7 +152,7 @@ export class TuiRangeComponent } get focused(): boolean { - return isNativeFocusedIn(this.elementRef.nativeElement); + return tuiIsNativeFocusedIn(this.elementRef.nativeElement); } get fractionStep(): number { diff --git a/projects/kit/directives/dropdown-hover/dropdown-hover.directive.ts b/projects/kit/directives/dropdown-hover/dropdown-hover.directive.ts index eba4e82b80ec..cc700f599bb2 100644 --- a/projects/kit/directives/dropdown-hover/dropdown-hover.directive.ts +++ b/projects/kit/directives/dropdown-hover/dropdown-hover.directive.ts @@ -1,10 +1,10 @@ import {Directive, ElementRef, HostListener, Inject} from '@angular/core'; import { getClosestFocusable, - isNativeFocusedIn, isPresent, setNativeMouseFocused, TuiDestroyService, + tuiIsNativeFocusedIn, typedFromEvent, } from '@taiga-ui/cdk'; import {TuiHostedDropdownComponent} from '@taiga-ui/core'; @@ -23,7 +23,7 @@ import { } from 'rxjs/operators'; @Directive({ - selector: `tui-hosted-dropdown[tuiDropdownHover]`, + selector: 'tui-hosted-dropdown[tuiDropdownHover]', providers: [TuiDestroyService], }) export class TuiDropdownHoverDirective { @@ -42,26 +42,26 @@ export class TuiDropdownHoverDirective { ); const open$ = merge( - typedFromEvent(nativeElement, `mouseenter`), - typedFromEvent(nativeElement, `click`).pipe( + typedFromEvent(nativeElement, 'mouseenter'), + typedFromEvent(nativeElement, 'click').pipe( tap(e => e.stopImmediatePropagation()), ), dropdown$.pipe( switchMap(element => merge( - typedFromEvent(element, `focusin`), - typedFromEvent(element, `mouseenter`), + typedFromEvent(element, 'focusin'), + typedFromEvent(element, 'mouseenter'), ), ), ), ).pipe(mapTo(true)); const close$ = merge( - typedFromEvent(nativeElement, `mouseleave`), + typedFromEvent(nativeElement, 'mouseleave'), dropdown$.pipe( switchMap(element => - typedFromEvent(element, `mouseleave`).pipe( - filter(() => !isNativeFocusedIn(element)), + typedFromEvent(element, 'mouseleave').pipe( + filter(() => !tuiIsNativeFocusedIn(element)), ), ), ), @@ -78,11 +78,11 @@ export class TuiDropdownHoverDirective { }); } - @HostListener(`mouseenter`) + @HostListener('mouseenter') onMouseEnter(): void { const {host} = this.dropdown; - if (isNativeFocusedIn(host)) { + if (tuiIsNativeFocusedIn(host)) { return; }