carbon-components-angular
Version:
Next generation components
75 lines • 6.78 kB
JavaScript
import { Component, Output, EventEmitter, Input } 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";
/**
* A toggle for the side navigation
*/
export class Hamburger {
constructor(i18n) {
this.i18n = i18n;
/**
* Controls the active/selected state for the `Hamburger` menu.
*/
this.active = false;
/**
* Set the title text when the hamburger is active
*/
this.activeTitle = this.i18n.get().UI_SHELL.HEADER.CLOSE_MENU;
/**
* Set the title text when the hamburger is inactive
*/
this.inactiveTitle = this.i18n.get().UI_SHELL.HEADER.OPEN_MENU;
/**
* `EventEmitter` to notify parent components of menu click events.
*/
this.selected = new EventEmitter();
}
/**
* Emit the Hamburger click event upwards.
*/
doClick() {
this.selected.emit(this.active);
}
}
Hamburger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Hamburger, deps: [{ token: i1.I18n }], target: i0.ɵɵFactoryTarget.Component });
Hamburger.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: Hamburger, selector: "cds-hamburger, ibm-hamburger", inputs: { active: "active", activeTitle: "activeTitle", inactiveTitle: "inactiveTitle" }, outputs: { selected: "selected" }, ngImport: i0, template: `
<button
type="button"
(click)="doClick()"
[]="{'cds--header__action--active': active}"
class="cds--header__menu-trigger cds--header__action cds--header__menu-toggle"
[]="active ? activeTitle : inactiveTitle"
[]="active ? activeTitle : inactiveTitle">
<svg *ngIf="!active" cdsIcon="menu" size="20"></svg>
<svg *ngIf="active" cdsIcon="close" size="20"></svg>
</button>
`, isInline: true, dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Hamburger, decorators: [{
type: Component,
args: [{
selector: "cds-hamburger, ibm-hamburger",
template: `
<button
type="button"
(click)="doClick()"
[]="{'cds--header__action--active': active}"
class="cds--header__menu-trigger cds--header__action cds--header__menu-toggle"
[]="active ? activeTitle : inactiveTitle"
[]="active ? activeTitle : inactiveTitle">
<svg *ngIf="!active" cdsIcon="menu" size="20"></svg>
<svg *ngIf="active" cdsIcon="close" size="20"></svg>
</button>
`
}]
}], ctorParameters: function () { return [{ type: i1.I18n }]; }, propDecorators: { active: [{
type: Input
}], activeTitle: [{
type: Input
}], inactiveTitle: [{
type: Input
}], selected: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGFtYnVyZ2VyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy91aS1zaGVsbC9oZWFkZXIvaGFtYnVyZ2VyLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ04sU0FBUyxFQUNULE1BQU0sRUFDTixZQUFZLEVBQ1osS0FBSyxFQUNMLE1BQU0sZUFBZSxDQUFDOzs7OztBQUd2Qjs7R0FFRztBQWdCSCxNQUFNLE9BQU8sU0FBUztJQXFCckIsWUFBbUIsSUFBVTtRQUFWLFNBQUksR0FBSixJQUFJLENBQU07UUFwQjdCOztXQUVHO1FBQ00sV0FBTSxHQUFHLEtBQUssQ0FBQztRQUV4Qjs7V0FFRztRQUNNLGdCQUFXLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsQ0FBQyxRQUFRLENBQUMsTUFBTSxDQUFDLFVBQVUsQ0FBQztRQUVsRTs7V0FFRztRQUNNLGtCQUFhLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsQ0FBQyxRQUFRLENBQUMsTUFBTSxDQUFDLFNBQVMsQ0FBQztRQUVuRTs7V0FFRztRQUNPLGFBQVEsR0FBeUIsSUFBSSxZQUFZLEVBQVUsQ0FBQztJQUV0QyxDQUFDO0lBRWpDOztPQUVHO0lBQ0ksT0FBTztRQUNiLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUNqQyxDQUFDOztzR0E1QlcsU0FBUzswRkFBVCxTQUFTLGlNQWJYOzs7Ozs7Ozs7OztFQVdUOzJGQUVXLFNBQVM7a0JBZnJCLFNBQVM7bUJBQUM7b0JBQ1YsUUFBUSxFQUFFLDhCQUE4QjtvQkFDeEMsUUFBUSxFQUFFOzs7Ozs7Ozs7OztFQVdUO2lCQUNEOzJGQUtTLE1BQU07c0JBQWQsS0FBSztnQkFLRyxXQUFXO3NCQUFuQixLQUFLO2dCQUtHLGFBQWE7c0JBQXJCLEtBQUs7Z0JBS0ksUUFBUTtzQkFBakIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG5cdENvbXBvbmVudCxcblx0T3V0cHV0LFxuXHRFdmVudEVtaXR0ZXIsXG5cdElucHV0XG59IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBJMThuIH0gZnJvbSBcImNhcmJvbi1jb21wb25lbnRzLWFuZ3VsYXIvaTE4blwiO1xuXG4vKipcbiAqIEEgdG9nZ2xlIGZvciB0aGUgc2lkZSBuYXZpZ2F0aW9uXG4gKi9cbkBDb21wb25lbnQoe1xuXHRzZWxlY3RvcjogXCJjZHMtaGFtYnVyZ2VyLCBpYm0taGFtYnVyZ2VyXCIsXG5cdHRlbXBsYXRlOiBgXG5cdFx0PGJ1dHRvblxuXHRcdFx0dHlwZT1cImJ1dHRvblwiXG5cdFx0XHQoY2xpY2spPVwiZG9DbGljaygpXCJcblx0XHRcdFtuZ0NsYXNzXT1cInsnY2RzLS1oZWFkZXJfX2FjdGlvbi0tYWN0aXZlJzogYWN0aXZlfVwiXG5cdFx0XHRjbGFzcz1cImNkcy0taGVhZGVyX19tZW51LXRyaWdnZXIgY2RzLS1oZWFkZXJfX2FjdGlvbiBjZHMtLWhlYWRlcl9fbWVudS10b2dnbGVcIlxuXHRcdFx0W2F0dHIuYXJpYS1sYWJlbF09XCJhY3RpdmUgPyBhY3RpdmVUaXRsZSA6IGluYWN0aXZlVGl0bGVcIlxuXHRcdFx0W2F0dHIudGl0bGVdPVwiYWN0aXZlID8gYWN0aXZlVGl0bGUgOiBpbmFjdGl2ZVRpdGxlXCI+XG5cdFx0XHQ8c3ZnICpuZ0lmPVwiIWFjdGl2ZVwiIGNkc0ljb249XCJtZW51XCIgc2l6ZT1cIjIwXCI+PC9zdmc+XG5cdFx0XHQ8c3ZnICpuZ0lmPVwiYWN0aXZlXCIgY2RzSWNvbj1cImNsb3NlXCIgc2l6ZT1cIjIwXCI+PC9zdmc+XG5cdFx0PC9idXR0b24+XG5cdGBcbn0pXG5leHBvcnQgY2xhc3MgSGFtYnVyZ2VyIHtcblx0LyoqXG5cdCAqIENvbnRyb2xzIHRoZSBhY3RpdmUvc2VsZWN0ZWQgc3RhdGUgZm9yIHRoZSBgSGFtYnVyZ2VyYCBtZW51LlxuXHQgKi9cblx0QElucHV0KCkgYWN0aXZlID0gZmFsc2U7XG5cblx0LyoqXG5cdCAqIFNldCB0aGUgdGl0bGUgdGV4dCB3aGVuIHRoZSBoYW1idXJnZXIgaXMgYWN0aXZlXG5cdCAqL1xuXHRASW5wdXQoKSBhY3RpdmVUaXRsZSA9IHRoaXMuaTE4bi5nZXQoKS5VSV9TSEVMTC5IRUFERVIuQ0xPU0VfTUVOVTtcblxuXHQvKipcblx0ICogU2V0IHRoZSB0aXRsZSB0ZXh0IHdoZW4gdGhlIGhhbWJ1cmdlciBpcyBpbmFjdGl2ZVxuXHQgKi9cblx0QElucHV0KCkgaW5hY3RpdmVUaXRsZSA9IHRoaXMuaTE4bi5nZXQoKS5VSV9TSEVMTC5IRUFERVIuT1BFTl9NRU5VO1xuXG5cdC8qKlxuXHQgKiBgRXZlbnRFbWl0dGVyYCB0byBub3RpZnkgcGFyZW50IGNvbXBvbmVudHMgb2YgbWVudSBjbGljayBldmVudHMuXG5cdCAqL1xuXHRAT3V0cHV0KCkgc2VsZWN0ZWQ6IEV2ZW50RW1pdHRlcjxPYmplY3Q+ID0gbmV3IEV2ZW50RW1pdHRlcjxPYmplY3Q+KCk7XG5cblx0Y29uc3RydWN0b3IocHVibGljIGkxOG46IEkxOG4pIHt9XG5cblx0LyoqXG5cdCAqIEVtaXQgdGhlIEhhbWJ1cmdlciBjbGljayBldmVudCB1cHdhcmRzLlxuXHQgKi9cblx0cHVibGljIGRvQ2xpY2soKSB7XG5cdFx0dGhpcy5zZWxlY3RlZC5lbWl0KHRoaXMuYWN0aXZlKTtcblx0fVxufVxuIl19