refactor(chips): replace disabled property with mixin (#5072)

This commit is contained in:
Paul Gschwendtner
2017-06-12 22:51:41 +02:00
committed by Kara
parent 88089a7648
commit 90e6d3c08e
2 changed files with 15 additions and 8 deletions
+11 -1
View File
@@ -113,6 +113,15 @@ describe('Chips', () => {
expect(testComponent.chipSelect).toHaveBeenCalledWith({ chip: chipInstance });
});
it('should update the aria-label for disabled chips', () => {
expect(chipNativeElement.getAttribute('aria-disabled')).toBe('false');
testComponent.disabled = true;
fixture.detectChanges();
expect(chipNativeElement.getAttribute('aria-disabled')).toBe('true');
});
});
});
});
@@ -121,7 +130,7 @@ describe('Chips', () => {
template: `
<md-chip-list>
<div *ngIf="shouldShow">
<md-chip [color]="color" [selected]="selected"
<md-chip [color]="color" [selected]="selected" [disabled]="disabled"
(focus)="chipFocus($event)" (destroy)="chipDestroy($event)"
(select)="chipSelect($event)" (deselect)="chipDeselect($event)">
{{name}}
@@ -130,6 +139,7 @@ describe('Chips', () => {
</md-chip-list>`
})
class SingleChip {
disabled: boolean = false;
name: string = 'Test';
color: string = 'primary';
selected: boolean = false;
+4 -7
View File
@@ -11,6 +11,7 @@ import {
import {Focusable} from '../core/a11y/focus-key-manager';
import {coerceBooleanProperty} from '../core/coercion/boolean-property';
import {CanColor, mixinColor} from '../core/common-behaviors/color';
import {CanDisable, mixinDisabled} from '../core/common-behaviors/disabled';
export interface MdChipEvent {
chip: MdChip;
@@ -20,7 +21,7 @@ export interface MdChipEvent {
export class MdChipBase {
constructor(public _renderer: Renderer2, public _elementRef: ElementRef) {}
}
export const _MdChipMixinBase = mixinColor(MdChipBase, 'primary');
export const _MdChipMixinBase = mixinColor(mixinDisabled(MdChipBase), 'primary');
/**
@@ -39,7 +40,7 @@ export class MdBasicChip { }
@Directive({
selector: `md-basic-chip, [md-basic-chip], md-chip, [md-chip],
mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]`,
inputs: ['color'],
inputs: ['color', 'disabled'],
host: {
'class': 'mat-chip',
'tabindex': '-1',
@@ -52,11 +53,7 @@ export class MdBasicChip { }
'(blur)': '_hasFocus = false',
}
})
export class MdChip extends _MdChipMixinBase implements Focusable, OnDestroy, CanColor {
/** Whether or not the chip is disabled. */
@Input() get disabled(): boolean { return this._disabled; }
set disabled(value: boolean) { this._disabled = coerceBooleanProperty(value); }
protected _disabled: boolean = null;
export class MdChip extends _MdChipMixinBase implements Focusable, OnDestroy, CanColor, CanDisable {
/** Whether the chip is selected. */
@Input() get selected(): boolean { return this._selected; }