carbon-components-angular
Version:
Next generation components
123 lines • 9.9 kB
JavaScript
import { Component, Input, ContentChildren } from "@angular/core";
import { AccordionItem } from "./accordion-item.component";
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
/**
* Get started with importing the module:
*
* ```typescript
* import { AccordionModule } from 'carbon-components-angular';
* ```
*
* [See demo](../../?path=/story/components-accordion--basic)
*/
export class Accordion {
constructor() {
/**
* Sets the alignment of the chevron icon
*/
this.align = "end";
/**
* @todo remove `cds--accordion--${size}` classes in v12
*/
/**
* Sets the size of all accordian items
*/
this.size = "md";
/**
* Specify whether Accordion text should be flush, default is false.
* Does not work with `align="start"`.
*/
this.isFlush = false;
this._skeleton = false;
this._disabled = false;
}
set skeleton(value) {
this._skeleton = value;
this.updateChildren();
}
get skeleton() {
return this._skeleton;
}
/**
* Specify whether the entire accordion should be disabled.
* When `true`, all items are disabled regardless of their own `disabled` input.
* When `false`, each item uses its own `disabled` binding again.
*/
set disabled(value) {
this._disabled = value;
this.updateChildren();
}
get disabled() {
return this._disabled;
}
ngAfterContentInit() {
this.updateChildren();
}
updateChildren() {
if (this.children) {
this.children.toArray().forEach(child => {
child.skeleton = this.skeleton;
child.setParentDisabled(this.disabled);
if (this.disabled) {
child.expanded = false;
}
});
}
}
}
Accordion.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Accordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
Accordion.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: Accordion, selector: "cds-accordion, ibm-accordion", inputs: { align: "align", size: "size", isFlush: "isFlush", skeleton: "skeleton", disabled: "disabled" }, queries: [{ propertyName: "children", predicate: AccordionItem }], ngImport: i0, template: `
<div class="cds--accordion"
[ngClass]="{
'cds--accordion--end': align === 'end',
'cds--accordion--start': align === 'start',
'cds--accordion--sm': size === 'sm',
'cds--accordion--md': size ==='md',
'cds--accordion--lg': size === 'lg',
'cds--layout--size-sm': size === 'sm',
'cds--layout--size-md': size === 'md',
'cds--layout--size-lg': size === 'lg',
'cds--accordion--flush': isFlush && align !== 'start'
}"
role="list">
<ng-content></ng-content>
</div>
`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Accordion, decorators: [{
type: Component,
args: [{
selector: "cds-accordion, ibm-accordion",
template: `
<div class="cds--accordion"
[ngClass]="{
'cds--accordion--end': align === 'end',
'cds--accordion--start': align === 'start',
'cds--accordion--sm': size === 'sm',
'cds--accordion--md': size ==='md',
'cds--accordion--lg': size === 'lg',
'cds--layout--size-sm': size === 'sm',
'cds--layout--size-md': size === 'md',
'cds--layout--size-lg': size === 'lg',
'cds--accordion--flush': isFlush && align !== 'start'
}"
role="list">
<ng-content></ng-content>
</div>
`
}]
}], propDecorators: { align: [{
type: Input
}], size: [{
type: Input
}], isFlush: [{
type: Input
}], children: [{
type: ContentChildren,
args: [AccordionItem]
}], skeleton: [{
type: Input
}], disabled: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWNjb3JkaW9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9hY2NvcmRpb24vYWNjb3JkaW9uLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ04sU0FBUyxFQUNULEtBQUssRUFDTCxlQUFlLEVBR2YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLDRCQUE0QixDQUFDOzs7QUFFM0Q7Ozs7Ozs7O0dBUUc7QUFxQkgsTUFBTSxPQUFPLFNBQVM7SUFwQnRCO1FBcUJDOztXQUVHO1FBQ00sVUFBSyxHQUFvQixLQUFLLENBQUM7UUFFeEM7O1dBRUc7UUFDSDs7V0FFRztRQUNNLFNBQUksR0FBdUIsSUFBSSxDQUFDO1FBRXpDOzs7V0FHRztRQUNNLFlBQU8sR0FBRyxLQUFLLENBQUM7UUFJZixjQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ2xCLGNBQVMsR0FBRyxLQUFLLENBQUM7S0EwQzVCO0lBeENBLElBQ0ksUUFBUSxDQUFDLEtBQVU7UUFDdEIsSUFBSSxDQUFDLFNBQVMsR0FBRyxLQUFLLENBQUM7UUFDdkIsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQ3ZCLENBQUM7SUFFRCxJQUFJLFFBQVE7UUFDWCxPQUFPLElBQUksQ0FBQyxTQUFTLENBQUM7SUFDdkIsQ0FBQztJQUVEOzs7O09BSUc7SUFDSCxJQUNJLFFBQVEsQ0FBQyxLQUFjO1FBQzFCLElBQUksQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztJQUN2QixDQUFDO0lBRUQsSUFBSSxRQUFRO1FBQ1gsT0FBTyxJQUFJLENBQUMsU0FBUyxDQUFDO0lBQ3ZCLENBQUM7SUFFRCxrQkFBa0I7UUFDakIsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQ3ZCLENBQUM7SUFFUyxjQUFjO1FBQ3ZCLElBQUksSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUNsQixJQUFJLENBQUMsUUFBUSxDQUFDLE9BQU8sRUFBRSxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsRUFBRTtnQkFDdkMsS0FBSyxDQUFDLFFBQVEsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDO2dCQUMvQixLQUFLLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO2dCQUN2QyxJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUU7b0JBQ2xCLEtBQUssQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO2lCQUN2QjtZQUNGLENBQUMsQ0FBQyxDQUFDO1NBQ0g7SUFDRixDQUFDOztzR0FoRVcsU0FBUzswRkFBVCxTQUFTLHVNQW9CSixhQUFhLDZCQXRDcEI7Ozs7Ozs7Ozs7Ozs7Ozs7RUFnQlQ7MkZBRVcsU0FBUztrQkFwQnJCLFNBQVM7bUJBQUM7b0JBQ1YsUUFBUSxFQUFFLDhCQUE4QjtvQkFDeEMsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7O0VBZ0JUO2lCQUNEOzhCQUtTLEtBQUs7c0JBQWIsS0FBSztnQkFRRyxJQUFJO3NCQUFaLEtBQUs7Z0JBTUcsT0FBTztzQkFBZixLQUFLO2dCQUUwQixRQUFRO3NCQUF2QyxlQUFlO3VCQUFDLGFBQWE7Z0JBTTFCLFFBQVE7c0JBRFgsS0FBSztnQkFnQkYsUUFBUTtzQkFEWCxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcblx0Q29tcG9uZW50LFxuXHRJbnB1dCxcblx0Q29udGVudENoaWxkcmVuLFxuXHRRdWVyeUxpc3QsXG5cdEFmdGVyQ29udGVudEluaXRcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEFjY29yZGlvbkl0ZW0gfSBmcm9tIFwiLi9hY2NvcmRpb24taXRlbS5jb21wb25lbnRcIjtcblxuLyoqXG4gKiBHZXQgc3RhcnRlZCB3aXRoIGltcG9ydGluZyB0aGUgbW9kdWxlOlxuICpcbiAqIGBgYHR5cGVzY3JpcHRcbiAqIGltcG9ydCB7IEFjY29yZGlvbk1vZHVsZSB9IGZyb20gJ2NhcmJvbi1jb21wb25lbnRzLWFuZ3VsYXInO1xuICogYGBgXG4gKlxuICogW1NlZSBkZW1vXSguLi8uLi8/cGF0aD0vc3RvcnkvY29tcG9uZW50cy1hY2NvcmRpb24tLWJhc2ljKVxuICovXG5AQ29tcG9uZW50KHtcblx0c2VsZWN0b3I6IFwiY2RzLWFjY29yZGlvbiwgaWJtLWFjY29yZGlvblwiLFxuXHR0ZW1wbGF0ZTogYFxuXHRcdDxkaXYgY2xhc3M9XCJjZHMtLWFjY29yZGlvblwiXG5cdFx0XHRbbmdDbGFzc109XCJ7XG5cdFx0XHRcdCdjZHMtLWFjY29yZGlvbi0tZW5kJzogYWxpZ24gPT09ICdlbmQnLFxuXHRcdFx0XHQnY2RzLS1hY2NvcmRpb24tLXN0YXJ0JzogYWxpZ24gPT09ICdzdGFydCcsXG5cdFx0XHRcdCdjZHMtLWFjY29yZGlvbi0tc20nOiBzaXplID09PSAnc20nLFxuXHRcdFx0XHQnY2RzLS1hY2NvcmRpb24tLW1kJzogc2l6ZSA9PT0nbWQnLFxuXHRcdFx0XHQnY2RzLS1hY2NvcmRpb24tLWxnJzogc2l6ZSA9PT0gJ2xnJyxcblx0XHRcdFx0J2Nkcy0tbGF5b3V0LS1zaXplLXNtJzogc2l6ZSA9PT0gJ3NtJyxcblx0XHRcdFx0J2Nkcy0tbGF5b3V0LS1zaXplLW1kJzogc2l6ZSA9PT0gJ21kJyxcblx0XHRcdFx0J2Nkcy0tbGF5b3V0LS1zaXplLWxnJzogc2l6ZSA9PT0gJ2xnJyxcblx0XHRcdFx0J2Nkcy0tYWNjb3JkaW9uLS1mbHVzaCc6IGlzRmx1c2ggJiYgYWxpZ24gIT09ICdzdGFydCdcblx0XHRcdH1cIlxuXHRcdFx0cm9sZT1cImxpc3RcIj5cblx0XHRcdDxuZy1jb250ZW50PjwvbmctY29udGVudD5cblx0XHQ8L2Rpdj5cblx0YFxufSlcbmV4cG9ydCBjbGFzcyBBY2NvcmRpb24gaW1wbGVtZW50cyBBZnRlckNvbnRlbnRJbml0IHtcblx0LyoqXG5cdCAqIFNldHMgdGhlIGFsaWdubWVudCBvZiB0aGUgY2hldnJvbiBpY29uXG5cdCAqL1xuXHRASW5wdXQoKSBhbGlnbjogXCJzdGFydFwiIHwgXCJlbmRcIiA9IFwiZW5kXCI7XG5cblx0LyoqXG5cdCAqXHRAdG9kbyByZW1vdmUgYGNkcy0tYWNjb3JkaW9uLS0ke3NpemV9YCBjbGFzc2VzIGluIHYxMlxuXHQgKi9cblx0LyoqXG5cdCAqIFNldHMgdGhlIHNpemUgb2YgYWxsIGFjY29yZGlhbiBpdGVtc1xuXHQgKi9cblx0QElucHV0KCkgc2l6ZTogXCJzbVwiIHwgXCJtZFwiIHwgXCJsZ1wiID0gXCJtZFwiO1xuXG5cdC8qKlxuXHQgKiBTcGVjaWZ5IHdoZXRoZXIgQWNjb3JkaW9uIHRleHQgc2hvdWxkIGJlIGZsdXNoLCBkZWZhdWx0IGlzIGZhbHNlLlxuXHQgKiBEb2VzIG5vdCB3b3JrIHdpdGggYGFsaWduPVwic3RhcnRcImAuXG5cdCAqL1xuXHRASW5wdXQoKSBpc0ZsdXNoID0gZmFsc2U7XG5cblx0QENvbnRlbnRDaGlsZHJlbihBY2NvcmRpb25JdGVtKSBjaGlsZHJlbjogUXVlcnlMaXN0PEFjY29yZGlvbkl0ZW0+O1xuXG5cdHByb3RlY3RlZCBfc2tlbGV0b24gPSBmYWxzZTtcblx0cHJvdGVjdGVkIF9kaXNhYmxlZCA9IGZhbHNlO1xuXG5cdEBJbnB1dCgpXG5cdHNldCBza2VsZXRvbih2YWx1ZTogYW55KSB7XG5cdFx0dGhpcy5fc2tlbGV0b24gPSB2YWx1ZTtcblx0XHR0aGlzLnVwZGF0ZUNoaWxkcmVuKCk7XG5cdH1cblxuXHRnZXQgc2tlbGV0b24oKTogYW55IHtcblx0XHRyZXR1cm4gdGhpcy5fc2tlbGV0b247XG5cdH1cblxuXHQvKipcblx0ICogU3BlY2lmeSB3aGV0aGVyIHRoZSBlbnRpcmUgYWNjb3JkaW9uIHNob3VsZCBiZSBkaXNhYmxlZC5cblx0ICogV2hlbiBgdHJ1ZWAsIGFsbCBpdGVtcyBhcmUgZGlzYWJsZWQgcmVnYXJkbGVzcyBvZiB0aGVpciBvd24gYGRpc2FibGVkYCBpbnB1dC5cblx0ICogV2hlbiBgZmFsc2VgLCBlYWNoIGl0ZW0gdXNlcyBpdHMgb3duIGBkaXNhYmxlZGAgYmluZGluZyBhZ2Fpbi5cblx0ICovXG5cdEBJbnB1dCgpXG5cdHNldCBkaXNhYmxlZCh2YWx1ZTogYm9vbGVhbikge1xuXHRcdHRoaXMuX2Rpc2FibGVkID0gdmFsdWU7XG5cdFx0dGhpcy51cGRhdGVDaGlsZHJlbigpO1xuXHR9XG5cblx0Z2V0IGRpc2FibGVkKCk6IGJvb2xlYW4ge1xuXHRcdHJldHVybiB0aGlzLl9kaXNhYmxlZDtcblx0fVxuXG5cdG5nQWZ0ZXJDb250ZW50SW5pdCgpIHtcblx0XHR0aGlzLnVwZGF0ZUNoaWxkcmVuKCk7XG5cdH1cblxuXHRwcm90ZWN0ZWQgdXBkYXRlQ2hpbGRyZW4oKSB7XG5cdFx0aWYgKHRoaXMuY2hpbGRyZW4pIHtcblx0XHRcdHRoaXMuY2hpbGRyZW4udG9BcnJheSgpLmZvckVhY2goY2hpbGQgPT4ge1xuXHRcdFx0XHRjaGlsZC5za2VsZXRvbiA9IHRoaXMuc2tlbGV0b247XG5cdFx0XHRcdGNoaWxkLnNldFBhcmVudERpc2FibGVkKHRoaXMuZGlzYWJsZWQpO1xuXHRcdFx0XHRpZiAodGhpcy5kaXNhYmxlZCkge1xuXHRcdFx0XHRcdGNoaWxkLmV4cGFuZGVkID0gZmFsc2U7XG5cdFx0XHRcdH1cblx0XHRcdH0pO1xuXHRcdH1cblx0fVxufVxuIl19