mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
core(expansion-panel): fix typos and extra whitespace (#5659)
This commit is contained in:
committed by
Jeremy Elbourn
parent
0eedb5f800
commit
a40ad26288
@@ -14,10 +14,11 @@
|
||||
border-top-color: mat-color($foreground, divider);
|
||||
}
|
||||
|
||||
.mat-expansion-panel-header:focus,
|
||||
.mat-expansion-panel-header:focus,
|
||||
.mat-expansion-panel-header:hover {
|
||||
background: mat-color($background, hover);
|
||||
}
|
||||
|
||||
.mat-expansion-panel-header-title {
|
||||
color: mat-color($foreground, text);
|
||||
}
|
||||
@@ -29,4 +30,4 @@
|
||||
.mat-expansion-indicator::after {
|
||||
color: mat-color($foreground, secondary-text);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -27,15 +27,15 @@ let nextId = 0;
|
||||
*/
|
||||
@Injectable()
|
||||
export class AccordionItem implements OnDestroy {
|
||||
/** Event emitted every time the MdAccordianChild is closed. */
|
||||
/** Event emitted every time the MdAccordionChild is closed. */
|
||||
@Output() closed = new EventEmitter<void>();
|
||||
/** Event emitted every time the MdAccordianChild is opened. */
|
||||
/** Event emitted every time the MdAccordionChild is opened. */
|
||||
@Output() opened = new EventEmitter<void>();
|
||||
/** Event emitted when the MdAccordianChild is destroyed. */
|
||||
/** Event emitted when the MdAccordionChild is destroyed. */
|
||||
@Output() destroyed = new EventEmitter<void>();
|
||||
/** The unique MdAccordianChild id. */
|
||||
/** The unique MdAccordionChild id. */
|
||||
readonly id = `cdk-accordion-child-${nextId++}`;
|
||||
/** Whether the MdAccordianChild is expanded. */
|
||||
/** Whether the MdAccordionChild is expanded. */
|
||||
@Input() get expanded(): boolean { return this._expanded; }
|
||||
set expanded(expanded: boolean) {
|
||||
// Only emit events and update the internal value if the value changes.
|
||||
@@ -44,10 +44,10 @@ export class AccordionItem implements OnDestroy {
|
||||
if (expanded) {
|
||||
this.opened.emit();
|
||||
/**
|
||||
* In the unique selection dispatcher, the id parameter is the id of the CdkAccordonItem,
|
||||
* In the unique selection dispatcher, the id parameter is the id of the CdkAccordionItem,
|
||||
* the name value is the id of the accordion.
|
||||
*/
|
||||
let accordionId = this.accordion ? this.accordion.id : this.id;
|
||||
const accordionId = this.accordion ? this.accordion.id : this.id;
|
||||
this._expansionDispatcher.notify(this.id, accordionId);
|
||||
} else {
|
||||
this.closed.emit();
|
||||
@@ -66,14 +66,14 @@ export class AccordionItem implements OnDestroy {
|
||||
constructor(@Optional() public accordion: CdkAccordion,
|
||||
private _changeDetectorRef: ChangeDetectorRef,
|
||||
protected _expansionDispatcher: UniqueSelectionDispatcher) {
|
||||
this._removeUniqueSelectionListener =
|
||||
_expansionDispatcher.listen((id: string, accordionId: string) => {
|
||||
if (this.accordion && !this.accordion.multi &&
|
||||
this.accordion.id === accordionId && this.id !== id) {
|
||||
this.expanded = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
this._removeUniqueSelectionListener =
|
||||
_expansionDispatcher.listen((id: string, accordionId: string) => {
|
||||
if (this.accordion && !this.accordion.multi &&
|
||||
this.accordion.id === accordionId && this.id !== id) {
|
||||
this.expanded = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/** Emits an event for the accordion item being destroyed. */
|
||||
ngOnDestroy() {
|
||||
|
||||
@@ -20,8 +20,8 @@ describe('CdkAccordion', () => {
|
||||
}));
|
||||
|
||||
it('should ensure only one item is expanded at a time', () => {
|
||||
let fixture = TestBed.createComponent(SetOfItems);
|
||||
let items = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
const fixture = TestBed.createComponent(SetOfItems);
|
||||
const items = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
|
||||
fixture.componentInstance.firstPanelExpanded = true;
|
||||
fixture.detectChanges();
|
||||
@@ -35,8 +35,8 @@ describe('CdkAccordion', () => {
|
||||
});
|
||||
|
||||
it('should allow multiple items to be expanded simultaneously', () => {
|
||||
let fixture = TestBed.createComponent(SetOfItems);
|
||||
let panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
const fixture = TestBed.createComponent(SetOfItems);
|
||||
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
|
||||
fixture.componentInstance.multi = true;
|
||||
fixture.componentInstance.firstPanelExpanded = true;
|
||||
|
||||
@@ -3,5 +3,5 @@
|
||||
<ng-content select="md-panel-description, mat-panel-description"></ng-content>
|
||||
<ng-content></ng-content>
|
||||
</span>
|
||||
<span [@indicatorRotate]="_getExpandedState()" *ngIf="!_getHideToggle()"
|
||||
class="mat-expansion-indicator"></span>
|
||||
<span [@indicatorRotate]="_getExpandedState()" *ngIf="!_getHideToggle()"
|
||||
class="mat-expansion-indicator"></span>
|
||||
|
||||
@@ -14,7 +14,7 @@ $mat-expansion-panel-header-height-expanded: 64px;
|
||||
line-height: $mat-expansion-panel-header-height-expanded;
|
||||
}
|
||||
|
||||
&:focus,
|
||||
&:focus,
|
||||
&:hover {
|
||||
outline: none;
|
||||
}
|
||||
@@ -46,7 +46,7 @@ $mat-expansion-panel-header-height-expanded: 64px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Creates the expansion indicator arrow. Done using ::after rather than having
|
||||
* additional nodes in the template.
|
||||
*/
|
||||
|
||||
@@ -5,4 +5,4 @@
|
||||
<ng-content></ng-content>
|
||||
</div>
|
||||
<ng-content select="mat-action-row, md-action-row"></ng-content>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -30,4 +30,4 @@
|
||||
button.mat-button {
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -19,7 +19,7 @@ describe('MdExpansionPanel', () => {
|
||||
TestBed.compileComponents();
|
||||
}));
|
||||
|
||||
it('should expanded and collapse the panel', () => {
|
||||
it('should expand and collapse the panel', () => {
|
||||
const fixture = TestBed.createComponent(PanelWithContent);
|
||||
const contentEl = fixture.debugElement.query(By.css('.mat-expansion-panel-content'));
|
||||
const headerEl = fixture.debugElement.query(By.css('.mat-expansion-panel-header'));
|
||||
|
||||
Reference in New Issue
Block a user