carbon-components-angular
Version:
Next generation components
109 lines • 10.5 kB
JavaScript
import { Directive, Input, HostListener } from "@angular/core";
import { DialogDirective } from "../dialog.directive";
import { DialogService } from "../dialog.service";
import { OverflowMenuPane } from "./overflow-menu-pane.component";
import { OverflowMenuCustomPane } from "./overflow-menu-custom-pane.component";
import * as i0 from "@angular/core";
import * as i1 from "../dialog.service";
import * as i2 from "carbon-components-angular/utils";
/**
* Directive for extending `Dialog` to create overflow menus.
*
* class: OverflowMenuDirective (extends DialogDirective)
*
*
* selector: `cdsOverflowMenu`
*
*
* ```html
* <div [cdsOverflowMenu]="templateRef"></div>
* <ng-template #templateRef>
* <!-- overflow menu options here -->
* </ng-template>
* ```
*
* ```html
* <div [cdsOverflowMenu]="templateRef" [customPane]="true"></div>
* <ng-template #templateRef>
* <!-- custom content goes here -->
* </ng-template>
* ```
*/
export class OverflowMenuDirective extends DialogDirective {
/**
* Creates an instance of `OverflowMenuDirective`.
*/
constructor(elementRef, viewContainerRef, dialogService, eventService) {
super(elementRef, viewContainerRef, dialogService, eventService);
this.elementRef = elementRef;
this.viewContainerRef = viewContainerRef;
this.dialogService = dialogService;
this.eventService = eventService;
/**
* Controls wether the overflow menu is flipped
*/
this.flip = false;
/**
* Classes to add to the dialog container
*/
this.wrapperClass = "";
/**
* Set to true to for custom content
*/
this.customPane = false;
}
/**
* @deprecated as of v5
* Takes a template ref of `OverflowMenuOptions`s
*/
set ibmOverflowMenu(template) {
this.cdsOverflowMenu = template;
}
updateConfig() {
this.dialogConfig.content = this.cdsOverflowMenu;
this.dialogConfig.flip = this.flip;
this.dialogConfig.offset = this.offset;
this.dialogConfig.wrapperClass = this.wrapperClass;
}
hostkeys(event) {
switch (event.key) {
case "Enter":
case " ":
event.preventDefault();
break;
}
}
open() {
return super.open(this.customPane ? OverflowMenuCustomPane : OverflowMenuPane);
}
}
OverflowMenuDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OverflowMenuDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i1.DialogService }, { token: i2.EventService }], target: i0.ɵɵFactoryTarget.Directive });
OverflowMenuDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: OverflowMenuDirective, selector: "[cdsOverflowMenu], [ibmOverflowMenu]", inputs: { ibmOverflowMenu: "ibmOverflowMenu", cdsOverflowMenu: "cdsOverflowMenu", flip: "flip", offset: "offset", wrapperClass: "wrapperClass", customPane: "customPane" }, host: { listeners: { "keydown": "hostkeys($event)" } }, providers: [
DialogService
], exportAs: ["overflowMenu"], usesInheritance: true, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OverflowMenuDirective, decorators: [{
type: Directive,
args: [{
selector: "[cdsOverflowMenu], [ibmOverflowMenu]",
exportAs: "overflowMenu",
providers: [
DialogService
]
}]
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i1.DialogService }, { type: i2.EventService }]; }, propDecorators: { ibmOverflowMenu: [{
type: Input
}], cdsOverflowMenu: [{
type: Input
}], flip: [{
type: Input
}], offset: [{
type: Input
}], wrapperClass: [{
type: Input
}], customPane: [{
type: Input
}], hostkeys: [{
type: HostListener,
args: ["keydown", ["$event"]]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3ZlcmZsb3ctbWVudS5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvZGlhbG9nL292ZXJmbG93LW1lbnUvb3ZlcmZsb3ctbWVudS5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNOLFNBQVMsRUFHVCxLQUFLLEVBRUwsWUFBWSxFQUNaLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUN0RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sbUJBQW1CLENBQUM7QUFDbEQsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDbEUsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7Ozs7QUFJL0U7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FzQkc7QUFRSCxNQUFNLE9BQU8scUJBQXNCLFNBQVEsZUFBZTtJQTJCekQ7O09BRUc7SUFDSCxZQUNXLFVBQXNCLEVBQ3RCLGdCQUFrQyxFQUNsQyxhQUE0QixFQUM1QixZQUEwQjtRQUVwQyxLQUFLLENBQUMsVUFBVSxFQUFFLGdCQUFnQixFQUFFLGFBQWEsRUFBRSxZQUFZLENBQUMsQ0FBQztRQUx2RCxlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQ3RCLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBa0I7UUFDbEMsa0JBQWEsR0FBYixhQUFhLENBQWU7UUFDNUIsaUJBQVksR0FBWixZQUFZLENBQWM7UUF4QnJDOztXQUVHO1FBQ00sU0FBSSxHQUFHLEtBQUssQ0FBQztRQUt0Qjs7V0FFRztRQUNNLGlCQUFZLEdBQUcsRUFBRSxDQUFDO1FBQzNCOztXQUVHO1FBQ00sZUFBVSxHQUFHLEtBQUssQ0FBQztJQVk1QixDQUFDO0lBcENEOzs7T0FHRztJQUNILElBQWEsZUFBZSxDQUFDLFFBQTBCO1FBQ3RELElBQUksQ0FBQyxlQUFlLEdBQUcsUUFBUSxDQUFDO0lBQ2pDLENBQUM7SUFnQ0QsWUFBWTtRQUNYLElBQUksQ0FBQyxZQUFZLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQyxlQUFlLENBQUM7UUFDakQsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQztRQUNuQyxJQUFJLENBQUMsWUFBWSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDO1FBQ3ZDLElBQUksQ0FBQyxZQUFZLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQyxZQUFZLENBQUM7SUFDcEQsQ0FBQztJQUdELFFBQVEsQ0FBQyxLQUFvQjtRQUM1QixRQUFRLEtBQUssQ0FBQyxHQUFHLEVBQUU7WUFDbEIsS0FBSyxPQUFPLENBQUM7WUFDYixLQUFLLEdBQUc7Z0JBQ1AsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO2dCQUN2QixNQUFNO1NBQ1A7SUFDRixDQUFDO0lBRUQsSUFBSTtRQUNILE9BQU8sS0FBSyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztJQUNoRixDQUFDOztrSEExRFcscUJBQXFCO3NHQUFyQixxQkFBcUIsbVNBSnRCO1FBQ1YsYUFBYTtLQUNiOzJGQUVXLHFCQUFxQjtrQkFQakMsU0FBUzttQkFBQztvQkFDVixRQUFRLEVBQUUsc0NBQXNDO29CQUNoRCxRQUFRLEVBQUUsY0FBYztvQkFDeEIsU0FBUyxFQUFFO3dCQUNWLGFBQWE7cUJBQ2I7aUJBQ0Q7dUxBTWEsZUFBZTtzQkFBM0IsS0FBSztnQkFJRyxlQUFlO3NCQUF2QixLQUFLO2dCQUlHLElBQUk7c0JBQVosS0FBSztnQkFJRyxNQUFNO3NCQUFkLEtBQUs7Z0JBSUcsWUFBWTtzQkFBcEIsS0FBSztnQkFJRyxVQUFVO3NCQUFsQixLQUFLO2dCQXNCTixRQUFRO3NCQURQLFlBQVk7dUJBQUMsU0FBUyxFQUFFLENBQUMsUUFBUSxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcblx0RGlyZWN0aXZlLFxuXHRFbGVtZW50UmVmLFxuXHRWaWV3Q29udGFpbmVyUmVmLFxuXHRJbnB1dCxcblx0VGVtcGxhdGVSZWYsXG5cdEhvc3RMaXN0ZW5lclxufSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgRGlhbG9nRGlyZWN0aXZlIH0gZnJvbSBcIi4uL2RpYWxvZy5kaXJlY3RpdmVcIjtcbmltcG9ydCB7IERpYWxvZ1NlcnZpY2UgfSBmcm9tIFwiLi4vZGlhbG9nLnNlcnZpY2VcIjtcbmltcG9ydCB7IE92ZXJmbG93TWVudVBhbmUgfSBmcm9tIFwiLi9vdmVyZmxvdy1tZW51LXBhbmUuY29tcG9uZW50XCI7XG5pbXBvcnQgeyBPdmVyZmxvd01lbnVDdXN0b21QYW5lIH0gZnJvbSBcIi4vb3ZlcmZsb3ctbWVudS1jdXN0b20tcGFuZS5jb21wb25lbnRcIjtcbmltcG9ydCB7IEV2ZW50U2VydmljZSB9IGZyb20gXCJjYXJib24tY29tcG9uZW50cy1hbmd1bGFyL3V0aWxzXCI7XG5cblxuLyoqXG4gKiBEaXJlY3RpdmUgZm9yIGV4dGVuZGluZyBgRGlhbG9nYCB0byBjcmVhdGUgb3ZlcmZsb3cgbWVudXMuXG4gKlxuICogY2xhc3M6IE92ZXJmbG93TWVudURpcmVjdGl2ZSAoZXh0ZW5kcyBEaWFsb2dEaXJlY3RpdmUpXG4gKlxuICpcbiAqIHNlbGVjdG9yOiBgY2RzT3ZlcmZsb3dNZW51YFxuICpcbiAqXG4gKiBgYGBodG1sXG4gKiA8ZGl2IFtjZHNPdmVyZmxvd01lbnVdPVwidGVtcGxhdGVSZWZcIj48L2Rpdj5cbiAqIDxuZy10ZW1wbGF0ZSAjdGVtcGxhdGVSZWY+XG4gKiBcdDwhLS0gb3ZlcmZsb3cgbWVudSBvcHRpb25zIGhlcmUgLS0+XG4gKiA8L25nLXRlbXBsYXRlPlxuICogYGBgXG4gKlxuICogYGBgaHRtbFxuICogPGRpdiBbY2RzT3ZlcmZsb3dNZW51XT1cInRlbXBsYXRlUmVmXCIgW2N1c3RvbVBhbmVdPVwidHJ1ZVwiPjwvZGl2PlxuICogPG5nLXRlbXBsYXRlICN0ZW1wbGF0ZVJlZj5cbiAqICA8IS0tIGN1c3RvbSBjb250ZW50IGdvZXMgaGVyZSAtLT5cbiAqIDwvbmctdGVtcGxhdGU+XG4gKiBgYGBcbiAqL1xuQERpcmVjdGl2ZSh7XG5cdHNlbGVjdG9yOiBcIltjZHNPdmVyZmxvd01lbnVdLCBbaWJtT3ZlcmZsb3dNZW51XVwiLFxuXHRleHBvcnRBczogXCJvdmVyZmxvd01lbnVcIixcblx0cHJvdmlkZXJzOiBbXG5cdFx0RGlhbG9nU2VydmljZVxuXHRdXG59KVxuZXhwb3J0IGNsYXNzIE92ZXJmbG93TWVudURpcmVjdGl2ZSBleHRlbmRzIERpYWxvZ0RpcmVjdGl2ZSB7XG5cdC8qKlxuXHQgKiBAZGVwcmVjYXRlZCBhcyBvZiB2NVxuXHQgKiBUYWtlcyBhIHRlbXBsYXRlIHJlZiBvZiBgT3ZlcmZsb3dNZW51T3B0aW9uc2BzXG5cdCAqL1xuXHRASW5wdXQoKSBzZXQgaWJtT3ZlcmZsb3dNZW51KHRlbXBsYXRlOiBUZW1wbGF0ZVJlZjxhbnk+KSB7XG5cdFx0dGhpcy5jZHNPdmVyZmxvd01lbnUgPSB0ZW1wbGF0ZTtcblx0fVxuXG5cdEBJbnB1dCgpIGNkc092ZXJmbG93TWVudTogVGVtcGxhdGVSZWY8YW55Pjtcblx0LyoqXG5cdCAqIENvbnRyb2xzIHdldGhlciB0aGUgb3ZlcmZsb3cgbWVudSBpcyBmbGlwcGVkXG5cdCAqL1xuXHRASW5wdXQoKSBmbGlwID0gZmFsc2U7XG5cdC8qKlxuXHQgKiBUaGlzIHNwZWNpZmllcyBhbnkgdmVydGljYWwgYW5kIGhvcml6b250YWwgb2Zmc2V0IGZvciB0aGUgcG9zaXRpb24gb2YgdGhlIGRpYWxvZ1xuXHQgKi9cblx0QElucHV0KCkgb2Zmc2V0OiB7IHg6IG51bWJlciwgeTogbnVtYmVyIH07XG5cdC8qKlxuXHQgKiBDbGFzc2VzIHRvIGFkZCB0byB0aGUgZGlhbG9nIGNvbnRhaW5lclxuXHQgKi9cblx0QElucHV0KCkgd3JhcHBlckNsYXNzID0gXCJcIjtcblx0LyoqXG5cdCAqIFNldCB0byB0cnVlIHRvIGZvciBjdXN0b20gY29udGVudFxuXHQgKi9cblx0QElucHV0KCkgY3VzdG9tUGFuZSA9IGZhbHNlO1xuXG5cdC8qKlxuXHQgKiBDcmVhdGVzIGFuIGluc3RhbmNlIG9mIGBPdmVyZmxvd01lbnVEaXJlY3RpdmVgLlxuXHQgKi9cblx0Y29uc3RydWN0b3IoXG5cdFx0cHJvdGVjdGVkIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYsXG5cdFx0cHJvdGVjdGVkIHZpZXdDb250YWluZXJSZWY6IFZpZXdDb250YWluZXJSZWYsXG5cdFx0cHJvdGVjdGVkIGRpYWxvZ1NlcnZpY2U6IERpYWxvZ1NlcnZpY2UsXG5cdFx0cHJvdGVjdGVkIGV2ZW50U2VydmljZTogRXZlbnRTZXJ2aWNlXG5cdCkge1xuXHRcdHN1cGVyKGVsZW1lbnRSZWYsIHZpZXdDb250YWluZXJSZWYsIGRpYWxvZ1NlcnZpY2UsIGV2ZW50U2VydmljZSk7XG5cdH1cblxuXHR1cGRhdGVDb25maWcoKSB7XG5cdFx0dGhpcy5kaWFsb2dDb25maWcuY29udGVudCA9IHRoaXMuY2RzT3ZlcmZsb3dNZW51O1xuXHRcdHRoaXMuZGlhbG9nQ29uZmlnLmZsaXAgPSB0aGlzLmZsaXA7XG5cdFx0dGhpcy5kaWFsb2dDb25maWcub2Zmc2V0ID0gdGhpcy5vZmZzZXQ7XG5cdFx0dGhpcy5kaWFsb2dDb25maWcud3JhcHBlckNsYXNzID0gdGhpcy53cmFwcGVyQ2xhc3M7XG5cdH1cblxuXHRASG9zdExpc3RlbmVyKFwia2V5ZG93blwiLCBbXCIkZXZlbnRcIl0pXG5cdGhvc3RrZXlzKGV2ZW50OiBLZXlib2FyZEV2ZW50KSB7XG5cdFx0c3dpdGNoIChldmVudC5rZXkpIHtcblx0XHRcdGNhc2UgXCJFbnRlclwiOlxuXHRcdFx0Y2FzZSBcIiBcIjpcblx0XHRcdFx0ZXZlbnQucHJldmVudERlZmF1bHQoKTtcblx0XHRcdFx0YnJlYWs7XG5cdFx0fVxuXHR9XG5cblx0b3BlbigpIHtcblx0XHRyZXR1cm4gc3VwZXIub3Blbih0aGlzLmN1c3RvbVBhbmUgPyBPdmVyZmxvd01lbnVDdXN0b21QYW5lIDogT3ZlcmZsb3dNZW51UGFuZSk7XG5cdH1cbn1cbiJdfQ==