carbon-components-angular
Version:
Next generation components
78 lines • 7.5 kB
JavaScript
import { Component, Input, Output, EventEmitter, HostBinding } from "@angular/core";
import * as i0 from "@angular/core";
import * as i1 from "carbon-components-angular/i18n";
import * as i2 from "@angular/common";
import * as i3 from "carbon-components-angular/icon";
export class TableExpandButton {
constructor(i18n) {
this.i18n = i18n;
/**
* Set to true to indicate the row has expanded
*/
this.expanded = false;
/**
* Set to true to indicate the row can be expanded.
* Defaults to false to allow for correct column alignment
*/
this.expandable = false;
this.skeleton = false;
this.expandClass = true;
this.expandRow = new EventEmitter();
this._ariaLabel = this.i18n.getOverridable("TABLE.EXPAND_BUTTON");
}
set ariaLabel(value) {
this._ariaLabel.override(value);
}
get ariaLabel() {
return this._ariaLabel.value;
}
get previousValue() {
return this.expanded ? "collapsed" : null;
}
getAriaLabel() {
return this._ariaLabel.subject;
}
}
TableExpandButton.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TableExpandButton, deps: [{ token: i1.I18n }], target: i0.ɵɵFactoryTarget.Component });
TableExpandButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TableExpandButton, selector: "[cdsTableExpandButton], [ibmTableExpandButton]", inputs: { expanded: "expanded", expandable: "expandable", ariaLabel: "ariaLabel", skeleton: "skeleton" }, outputs: { expandRow: "expandRow" }, host: { properties: { "class.cds--table-expand": "this.expandClass", "attr.data-previous-value": "this.previousValue" } }, ngImport: i0, template: `
<button
*ngIf="expandable"
class="cds--table-expand__button"
[attr.aria-label]="getAriaLabel() | async"
(click)="expandRow.emit()">
<svg cdsIcon="chevron--right" size="16" class="cds--table-expand__svg"></svg>
</button>
`, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TableExpandButton, decorators: [{
type: Component,
args: [{
// tslint:disable-next-line: component-selector
selector: "[cdsTableExpandButton], [ibmTableExpandButton]",
template: `
<button
*ngIf="expandable"
class="cds--table-expand__button"
[attr.aria-label]="getAriaLabel() | async"
(click)="expandRow.emit()">
<svg cdsIcon="chevron--right" size="16" class="cds--table-expand__svg"></svg>
</button>
`
}]
}], ctorParameters: function () { return [{ type: i1.I18n }]; }, propDecorators: { expanded: [{
type: Input
}], expandable: [{
type: Input
}], ariaLabel: [{
type: Input
}], skeleton: [{
type: Input
}], expandClass: [{
type: HostBinding,
args: ["class.cds--table-expand"]
}], previousValue: [{
type: HostBinding,
args: ["attr.data-previous-value"]
}], expandRow: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFibGUtZXhwYW5kLWJ1dHRvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvdGFibGUvY2VsbC90YWJsZS1leHBhbmQtYnV0dG9uLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ04sU0FBUyxFQUNULEtBQUssRUFDTCxNQUFNLEVBQ04sWUFBWSxFQUNaLFdBQVcsRUFDWCxNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFpQnZCLE1BQU0sT0FBTyxpQkFBaUI7SUFnQzdCLFlBQXNCLElBQVU7UUFBVixTQUFJLEdBQUosSUFBSSxDQUFNO1FBL0JoQzs7V0FFRztRQUNNLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFDMUI7OztXQUdHO1FBQ00sZUFBVSxHQUFHLEtBQUssQ0FBQztRQVduQixhQUFRLEdBQUcsS0FBSyxDQUFDO1FBRWMsZ0JBQVcsR0FBRyxJQUFJLENBQUM7UUFNakQsY0FBUyxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7UUFFckMsZUFBVSxHQUFHLElBQUksQ0FBQyxJQUFJLENBQUMsY0FBYyxDQUFDLHFCQUFxQixDQUFDLENBQUM7SUFFbkMsQ0FBQztJQXJCckMsSUFDSSxTQUFTLENBQUMsS0FBa0M7UUFDL0MsSUFBSSxDQUFDLFVBQVUsQ0FBQyxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDakMsQ0FBQztJQUVELElBQUksU0FBUztRQUNaLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxLQUFLLENBQUM7SUFDOUIsQ0FBQztJQU1ELElBQTZDLGFBQWE7UUFDekQsT0FBTyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQztJQUMzQyxDQUFDO0lBUUQsWUFBWTtRQUNYLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxPQUFPLENBQUM7SUFDaEMsQ0FBQzs7OEdBcENXLGlCQUFpQjtrR0FBakIsaUJBQWlCLGdXQVZuQjs7Ozs7Ozs7RUFRVDsyRkFFVyxpQkFBaUI7a0JBYjdCLFNBQVM7bUJBQUM7b0JBQ1YsK0NBQStDO29CQUMvQyxRQUFRLEVBQUUsZ0RBQWdEO29CQUMxRCxRQUFRLEVBQUU7Ozs7Ozs7O0VBUVQ7aUJBQ0Q7MkZBS1MsUUFBUTtzQkFBaEIsS0FBSztnQkFLRyxVQUFVO3NCQUFsQixLQUFLO2dCQUdGLFNBQVM7c0JBRFosS0FBSztnQkFTRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVrQyxXQUFXO3NCQUFsRCxXQUFXO3VCQUFDLHlCQUF5QjtnQkFFTyxhQUFhO3NCQUF6RCxXQUFXO3VCQUFDLDBCQUEwQjtnQkFJN0IsU0FBUztzQkFBbEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG5cdENvbXBvbmVudCxcblx0SW5wdXQsXG5cdE91dHB1dCxcblx0RXZlbnRFbWl0dGVyLFxuXHRIb3N0QmluZGluZ1xufSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgSTE4biwgT3ZlcnJpZGFibGUgfSBmcm9tIFwiY2FyYm9uLWNvbXBvbmVudHMtYW5ndWxhci9pMThuXCI7XG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSBcInJ4anNcIjtcblxuQENvbXBvbmVudCh7XG5cdC8vIHRzbGludDpkaXNhYmxlLW5leHQtbGluZTogY29tcG9uZW50LXNlbGVjdG9yXG5cdHNlbGVjdG9yOiBcIltjZHNUYWJsZUV4cGFuZEJ1dHRvbl0sIFtpYm1UYWJsZUV4cGFuZEJ1dHRvbl1cIixcblx0dGVtcGxhdGU6IGBcblx0XHQ8YnV0dG9uXG5cdFx0XHQqbmdJZj1cImV4cGFuZGFibGVcIlxuXHRcdFx0Y2xhc3M9XCJjZHMtLXRhYmxlLWV4cGFuZF9fYnV0dG9uXCJcblx0XHRcdFthdHRyLmFyaWEtbGFiZWxdPVwiZ2V0QXJpYUxhYmVsKCkgfCBhc3luY1wiXG5cdFx0XHQoY2xpY2spPVwiZXhwYW5kUm93LmVtaXQoKVwiPlxuXHRcdFx0PHN2ZyBjZHNJY29uPVwiY2hldnJvbi0tcmlnaHRcIiBzaXplPVwiMTZcIiBjbGFzcz1cImNkcy0tdGFibGUtZXhwYW5kX19zdmdcIj48L3N2Zz5cblx0XHQ8L2J1dHRvbj5cblx0YFxufSlcbmV4cG9ydCBjbGFzcyBUYWJsZUV4cGFuZEJ1dHRvbiB7XG5cdC8qKlxuXHQgKiBTZXQgdG8gdHJ1ZSB0byBpbmRpY2F0ZSB0aGUgcm93IGhhcyBleHBhbmRlZFxuXHQgKi9cblx0QElucHV0KCkgZXhwYW5kZWQgPSBmYWxzZTtcblx0LyoqXG5cdCAqIFNldCB0byB0cnVlIHRvIGluZGljYXRlIHRoZSByb3cgY2FuIGJlIGV4cGFuZGVkLlxuXHQgKiBEZWZhdWx0cyB0byBmYWxzZSB0byBhbGxvdyBmb3IgY29ycmVjdCBjb2x1bW4gYWxpZ25tZW50XG5cdCAqL1xuXHRASW5wdXQoKSBleHBhbmRhYmxlID0gZmFsc2U7XG5cblx0QElucHV0KClcblx0c2V0IGFyaWFMYWJlbCh2YWx1ZTogc3RyaW5nIHwgT2JzZXJ2YWJsZTxzdHJpbmc+KSB7XG5cdFx0dGhpcy5fYXJpYUxhYmVsLm92ZXJyaWRlKHZhbHVlKTtcblx0fVxuXG5cdGdldCBhcmlhTGFiZWwoKSB7XG5cdFx0cmV0dXJuIHRoaXMuX2FyaWFMYWJlbC52YWx1ZTtcblx0fVxuXG5cdEBJbnB1dCgpIHNrZWxldG9uID0gZmFsc2U7XG5cblx0QEhvc3RCaW5kaW5nKFwiY2xhc3MuY2RzLS10YWJsZS1leHBhbmRcIikgZXhwYW5kQ2xhc3MgPSB0cnVlO1xuXG5cdEBIb3N0QmluZGluZyhcImF0dHIuZGF0YS1wcmV2aW91cy12YWx1ZVwiKSBnZXQgcHJldmlvdXNWYWx1ZSgpIHtcblx0XHRyZXR1cm4gdGhpcy5leHBhbmRlZCA/IFwiY29sbGFwc2VkXCIgOiBudWxsO1xuXHR9XG5cblx0QE91dHB1dCgpIGV4cGFuZFJvdyA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcblxuXHRwcm90ZWN0ZWQgX2FyaWFMYWJlbCA9IHRoaXMuaTE4bi5nZXRPdmVycmlkYWJsZShcIlRBQkxFLkVYUEFORF9CVVRUT05cIik7XG5cblx0Y29uc3RydWN0b3IocHJvdGVjdGVkIGkxOG46IEkxOG4pIHsgfVxuXG5cdGdldEFyaWFMYWJlbCgpOiBPYnNlcnZhYmxlPHN0cmluZz4ge1xuXHRcdHJldHVybiB0aGlzLl9hcmlhTGFiZWwuc3ViamVjdDtcblx0fVxufVxuIl19