diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index 3c35535a2..d47349edc 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -5,7 +5,8 @@ on: branches: [master] jobs: - build: + deploy_stories: + name: Deploy stories runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml index abbfa96f1..56615d459 100644 --- a/.github/workflows/publish.yml +++ b/.github/workflows/publish.yml @@ -5,7 +5,8 @@ on: types: [published] jobs: - build: + publish_package: + name: Publish package runs-on: ubuntu-latest steps: - uses: actions/checkout@v1 diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index b51709e1f..ff1811b79 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -3,7 +3,8 @@ name: Run unit test on: push jobs: - build: + run_unit_test: + name: Run unit test runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 diff --git a/src/radio/base-radio.ts b/src/radio/base-radio.ts new file mode 100644 index 000000000..ba19bf48e --- /dev/null +++ b/src/radio/base-radio.ts @@ -0,0 +1,86 @@ +import { FocusMonitor } from '@angular/cdk/a11y'; +import { + AfterViewInit, + ChangeDetectorRef, + ElementRef, + Input, + OnDestroy, + OnInit, + ViewChild, +} from '@angular/core'; +import { BehaviorSubject, Subject, combineLatest } from 'rxjs'; +import { map, takeUntil } from 'rxjs/operators'; + +import { RadioGroupComponent } from './radio-group/radio-group.component'; + +let uniqueId = 0; + +export class BaseRadio implements OnInit, AfterViewInit, OnDestroy { + id = `aui-radio-${uniqueId++}`; + + @Input() + disabled = false; + + @Input() + get value() { + return this._value; + } + + set value(val) { + this._value = val; + this.value$$.next(val); + } + + @ViewChild('elRef', { static: true }) + elRef: ElementRef; + + checked = false; + name = ''; + + protected _value: any; + protected readonly value$$ = new BehaviorSubject(this.value); + protected destroy$$ = new Subject(); + + constructor( + protected radioGroup: RadioGroupComponent, + protected focusMonitor: FocusMonitor, + protected cdr: ChangeDetectorRef, + ) {} + + ngOnInit() { + this.radioGroup.name$.pipe(takeUntil(this.destroy$$)).subscribe(name => { + this.name = name; + this.cdr.markForCheck(); + }); + + combineLatest([this.radioGroup.value$, this.value$$]) + .pipe( + takeUntil(this.destroy$$), + map(([groupValue, selfValue]) => groupValue === selfValue), + ) + .subscribe(checked => { + this.checked = checked; + this.cdr.markForCheck(); + }); + } + + ngAfterViewInit() { + this.focusMonitor.monitor(this.elRef.nativeElement, true); + } + + ngOnDestroy() { + this.destroy$$.next(); + this.focusMonitor.stopMonitoring(this.elRef.nativeElement); + } + + onClick() { + if (this.checked || this.disabled) { + return; + } + this.radioGroup.onRadioChange(this.value); + } + + onBlur() { + this.radioGroup.onRadioBlur(); + } +} diff --git a/src/radio/radio-button/radio-button.component.ts b/src/radio/radio-button/radio-button.component.ts index cc840181b..4fcfd16be 100644 --- a/src/radio/radio-button/radio-button.component.ts +++ b/src/radio/radio-button/radio-button.component.ts @@ -1,5 +1,7 @@ +import { FocusMonitor } from '@angular/cdk/a11y'; import { ChangeDetectionStrategy, + ChangeDetectorRef, Component, OnInit, ViewEncapsulation, @@ -7,7 +9,8 @@ import { import { takeUntil } from 'rxjs/operators'; import { Bem, buildBem } from '../../utils/bem'; -import { RadioComponent } from '../radio.component'; +import { BaseRadio } from '../base-radio'; +import { RadioGroupComponent } from '../radio-group/radio-group.component'; import { RadioSize } from '../radio.types'; @Component({ @@ -18,7 +21,7 @@ import { RadioSize } from '../radio.types'; changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, }) -export class RadioButtonComponent extends RadioComponent implements OnInit { +export class RadioButtonComponent extends BaseRadio implements OnInit { bem: Bem = buildBem('aui-radio-button'); size = RadioSize.Medium; @@ -30,6 +33,15 @@ export class RadioButtonComponent extends RadioComponent implements OnInit { } ${this.isPlain ? 'isPlain' : ''}`; } + // eslint-disable-next-line @typescript-eslint/no-useless-constructor + constructor( + radioGroup: RadioGroupComponent, + focusMonitor: FocusMonitor, + cdr: ChangeDetectorRef, + ) { + super(radioGroup, focusMonitor, cdr); + } + ngOnInit() { super.ngOnInit(); this.radioGroup.size$.pipe(takeUntil(this.destroy$$)).subscribe(size => { diff --git a/src/radio/radio.component.ts b/src/radio/radio.component.ts index 112f9c4b9..3359196b1 100644 --- a/src/radio/radio.component.ts +++ b/src/radio/radio.component.ts @@ -1,25 +1,16 @@ import { FocusMonitor } from '@angular/cdk/a11y'; import { - AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, - ElementRef, - Input, - OnDestroy, - OnInit, - ViewChild, ViewEncapsulation, } from '@angular/core'; -import { BehaviorSubject, Subject, combineLatest } from 'rxjs'; -import { map, takeUntil } from 'rxjs/operators'; import { Bem, buildBem } from '../utils/bem'; +import { BaseRadio } from './base-radio'; import { RadioGroupComponent } from './radio-group/radio-group.component'; -let uniqueId = 0; - @Component({ selector: 'aui-radio', templateUrl: './radio.component.html', @@ -28,79 +19,21 @@ let uniqueId = 0; changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, }) -export class RadioComponent implements OnInit, AfterViewInit, OnDestroy { - id = `aui-radio-${uniqueId++}`; +export class RadioComponent extends BaseRadio { bem: Bem = buildBem('aui-radio'); - @Input() - disabled = false; - - @Input() - get value() { - return this._value; - } - - set value(val) { - this._value = val; - this.value$$.next(val); - } - - @ViewChild('elRef', { static: true }) - elRef: ElementRef; - - checked = false; - name = ''; - - private _value: any; - private readonly value$$ = new BehaviorSubject(this.value); - protected destroy$$ = new Subject(); - get rootClass() { return `${this.bem.block()} ${this.disabled ? 'isDisabled' : ''} ${ this.checked ? 'isChecked' : '' }`; } + // eslint-disable-next-line @typescript-eslint/no-useless-constructor constructor( - protected cdr: ChangeDetectorRef, - protected radioGroup: RadioGroupComponent, - protected focusMonitor: FocusMonitor, - ) {} - - ngOnInit() { - this.radioGroup.name$.pipe(takeUntil(this.destroy$$)).subscribe(name => { - this.name = name; - this.cdr.markForCheck(); - }); - - combineLatest([this.radioGroup.value$, this.value$$]) - .pipe( - takeUntil(this.destroy$$), - map(([groupValue, selfValue]) => groupValue === selfValue), - ) - .subscribe(checked => { - this.checked = checked; - this.cdr.markForCheck(); - }); - } - - ngAfterViewInit() { - this.focusMonitor.monitor(this.elRef.nativeElement, true); - } - - ngOnDestroy() { - this.destroy$$.next(); - this.focusMonitor.stopMonitoring(this.elRef.nativeElement); - } - - onClick() { - if (this.checked || this.disabled) { - return; - } - this.radioGroup.onRadioChange(this.value); - } - - onBlur() { - this.radioGroup.onRadioBlur(); + radioGroup: RadioGroupComponent, + focusMonitor: FocusMonitor, + cdr: ChangeDetectorRef, + ) { + super(radioGroup, focusMonitor, cdr); } } diff --git a/tsconfig.json b/tsconfig.json index 7eed080db..158158599 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -5,5 +5,9 @@ "paths": { "@alauda/ui": ["src/public-api"] } + }, + "exclude": ["./release"], + "angularCompilerOptions": { + "enableIvy": false } }