carbon-components-angular
Version:
Next generation components
70 lines (67 loc) • 3.04 kB
JavaScript
/*!
*
* Neutrino v0.0.0 | overflow-menu.component.js
*
* Copyright 2014, 2018 IBM
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component, ElementRef, Input } from "@angular/core";
import { I18n } from "./../../i18n/i18n.module";
/**
* The OverFlow menu component encapsulates the OverFlowMenu directive, and the menu iconography into one convienent component
*
* html:
* ```
* <ibm-overflow-menu>
* <ibm-overflow-menu-option>Option 1</ibm-overflow-menu-option>
* <ibm-overflow-menu-option>Option 2</ibm-overflow-menu-option>
* </ibm-overflow-menu>
* ```
*/
var OverflowMenu = /** @class */ (function () {
function OverflowMenu(elementRef, i18n) {
this.elementRef = elementRef;
this.i18n = i18n;
this.buttonLabel = this.i18n.get().OVERFLOW_MENU.OVERFLOW;
this.flip = false;
}
Object.defineProperty(OverflowMenu.prototype, "open", {
get: function () {
if (this.elementRef.nativeElement.children[0].getAttribute("aria-expanded") === "true") {
return true;
}
return false;
},
enumerable: true,
configurable: true
});
OverflowMenu.decorators = [
{ type: Component, args: [{
selector: "ibm-overflow-menu",
template: "\n\t\t<div\n\t\t\t[ibmOverflowMenu]=\"options\"\n\t\t\t[ngClass]=\"{'bx--overflow-menu--open': open === true}\"\n\t\t\t[attr.aria-label]=\"buttonLabel\"\n\t\t\t[flip]=\"flip\"\n\t\t\tclass=\"bx--overflow-menu\"\n\t\t\tplacement=\"bottom\"\n\t\t\tstyle=\"display: block;\"\n\t\t\ttabindex=\"0\">\n\t\t\t<svg class=\"bx--overflow-menu__icon\" width=\"3\" height=\"15\" viewBox=\"0 0 3 15\">\n\t\t\t\t<g fill-rule=\"evenodd\">\n\t\t\t\t\t<circle cx=\"1.5\" cy=\"1.5\" r=\"1.5\" />\n\t\t\t\t\t<circle cx=\"1.5\" cy=\"7.5\" r=\"1.5\" />\n\t\t\t\t\t<circle cx=\"1.5\" cy=\"13.5\" r=\"1.5\" />\n\t\t\t\t</g>\n\t\t\t</svg>\n\t\t</div>\n\t\t<ng-template #options>\n\t\t\t<ng-content></ng-content>\n\t\t</ng-template>\n\t",
styles: ["\n\t\t.bx--overflow-menu--open {\n\t\t\topacity: 1\n\t\t}\n\t"]
},] },
];
/** @nocollapse */
OverflowMenu.ctorParameters = function () { return [
{ type: ElementRef },
{ type: I18n }
]; };
OverflowMenu.propDecorators = {
buttonLabel: [{ type: Input }],
flip: [{ type: Input }]
};
return OverflowMenu;
}());
export { OverflowMenu };
//# sourceMappingURL=overflow-menu.component.js.map