{"version":3,"file":"primeng-megamenu.js","sources":["../../src/app/components/megamenu/megamenu.ts","../../src/app/components/megamenu/primeng-megamenu.ts"],"sourcesContent":["import {NgModule,Component,ElementRef,Input,Renderer2,ChangeDetectionStrategy, ViewEncapsulation, ChangeDetectorRef, AfterContentInit, ContentChildren, QueryList, TemplateRef} from '@angular/core';\nimport {CommonModule} from '@angular/common';\nimport {MegaMenuItem,MenuItem, PrimeTemplate} from 'primeng/api';\nimport {RouterModule} from '@angular/router';\nimport {RippleModule} from 'primeng/ripple';  \n\n@Component({\n    selector: 'p-megaMenu',\n    template: `\n        <div [class]=\"styleClass\" [ngStyle]=\"style\"\n            [ngClass]=\"{'p-megamenu p-component':true,'p-megamenu-horizontal': orientation == 'horizontal','p-megamenu-vertical': orientation == 'vertical'}\">\n            <div class=\"p-megamenu-start\" *ngIf=\"startTemplate\">\n                <ng-container *ngTemplateOutlet=\"startTemplate\"></ng-container>\n            </div>\n            <ul class=\"p-megamenu-root-list\" role=\"menubar\">\n                <ng-template ngFor let-category [ngForOf]=\"model\">\n                    <li *ngIf=\"category.separator\" class=\"p-menu-separator\" [ngClass]=\"{'p-hidden': category.visible === false}\">\n                    <li *ngIf=\"!category.separator\" [ngClass]=\"{'p-menuitem':true,'p-menuitem-active':category==activeItem, 'p-hidden': category.visible === false}\"\n                        (mouseenter)=\"onCategoryMouseEnter($event, category)\">\n                        <a *ngIf=\"!category.routerLink\" [href]=\"category.url||'#'\" [attr.target]=\"category.target\" [attr.title]=\"category.title\" [attr.id]=\"category.id\" (click)=\"onCategoryClick($event, category)\" [attr.tabindex]=\"category.tabindex ? category.tabindex : '0'\"\n                            [ngClass]=\"{'p-menuitem-link':true,'p-disabled':category.disabled}\" [ngStyle]=\"category.style\" [class]=\"category.styleClass\" pRipple>\n                            <span class=\"p-menuitem-icon\" *ngIf=\"category.icon\" [ngClass]=\"category.icon\"></span>\n                            <span class=\"p-menuitem-text\" *ngIf=\"category.escape !== false; else categoryHtmlLabel\">{{category.label}}</span>\n                            <ng-template #categoryHtmlLabel><span class=\"p-menuitem-text\" [innerHTML]=\"category.label\"></span></ng-template>\n                            <span *ngIf=\"category.items\" class=\"p-submenu-icon pi\" [ngClass]=\"{'pi-angle-down':orientation=='horizontal','pi-angle-right':orientation=='vertical'}\"></span>\n                        </a>\n                        <a *ngIf=\"category.routerLink\" [routerLink]=\"category.routerLink\" [queryParams]=\"category.queryParams\" [routerLinkActive]=\"'p-menuitem-link-active'\" [routerLinkActiveOptions]=\"category.routerLinkActiveOptions||{exact:false}\" [attr.tabindex]=\"category.tabindex ? category.tabindex : '0'\" \n                            [attr.target]=\"category.target\" [attr.title]=\"category.title\" [attr.id]=\"category.id\"\n                            (click)=\"onCategoryClick($event, category)\" [ngClass]=\"{'p-menuitem-link':true,'p-disabled':category.disabled}\" [ngStyle]=\"category.style\" [class]=\"category.styleClass\"\n                            [fragment]=\"category.fragment\" [queryParamsHandling]=\"category.queryParamsHandling\" [preserveFragment]=\"category.preserveFragment\" [skipLocationChange]=\"category.skipLocationChange\" [replaceUrl]=\"category.replaceUrl\" [state]=\"category.state\" pRipple>\n                            <span class=\"p-menuitem-icon\" *ngIf=\"category.icon\" [ngClass]=\"category.icon\"></span>\n                            <span class=\"p-menuitem-text\" *ngIf=\"category.escape !== false; else categoryHtmlRouteLabel\">{{category.label}}</span>\n                            <ng-template #categoryHtmlRouteLabel><span class=\"p-menuitem-text\" [innerHTML]=\"category.label\"></span></ng-template>\n                        </a>\n                        <div class=\"p-megamenu-panel\" *ngIf=\"category.items\">\n                            <div class=\"p-megamenu-grid\">\n                                <ng-template ngFor let-column [ngForOf]=\"category.items\">\n                                    <div [class]=\"getColumnClass(category)\">\n                                        <ng-template ngFor let-submenu [ngForOf]=\"column\">\n                                            <ul class=\"p-megamenu-submenu\" role=\"menu\">\n                                                <li class=\"p-megamenu-submenu-header\">\n                                                    <span *ngIf=\"submenu.escape !== false; else submenuHtmlLabel\">{{submenu.label}}</span>\n                                                    <ng-template #submenuHtmlLabel><span [innerHTML]=\"submenu.label\"></span></ng-template>\n                                                </li>\n                                                <ng-template ngFor let-item [ngForOf]=\"submenu.items\">\n                                                    <li *ngIf=\"item.separator\" class=\"p-menu-separator\" [ngClass]=\"{'p-hidden': item.visible === false}\" role=\"separator\">\n                                                    <li *ngIf=\"!item.separator\" class=\"p-menuitem\" [ngClass]=\"{'p-hidden': item.visible === false}\" role=\"none\">\n                                                        <a *ngIf=\"!item.routerLink\" role=\"menuitem\" [href]=\"item.url||'#'\" class=\"p-menuitem-link\" [attr.target]=\"item.target\" [attr.title]=\"item.title\" [attr.id]=\"item.id\" [attr.tabindex]=\"item.tabindex ? item.tabindex : '0'\"\n                                                            [ngClass]=\"{'p-disabled':item.disabled}\" (click)=\"itemClick($event, item)\" pRipple>\n                                                            <span class=\"p-menuitem-icon\" *ngIf=\"item.icon\" [ngClass]=\"item.icon\"></span>\n                                                            <span class=\"p-menuitem-text\" *ngIf=\"item.escape !== false; else htmlLabel\">{{item.label}}</span>\n                                                            <ng-template #htmlLabel><span class=\"p-menuitem-text\" [innerHTML]=\"item.label\"></span></ng-template>\n                                                        </a>\n                                                        <a *ngIf=\"item.routerLink\" role=\"menuitem\" [routerLink]=\"item.routerLink\" [queryParams]=\"item.queryParams\" [routerLinkActive]=\"'p-menuitem-link-active'\" [attr.tabindex]=\"item.tabindex ? item.tabindex : '0'\"\n                                                            [routerLinkActiveOptions]=\"item.routerLinkActiveOptions||{exact:false}\" class=\"p-menuitem-link\" \n                                                             [attr.target]=\"item.target\" [attr.title]=\"item.title\" [attr.id]=\"item.id\"\n                                                            [ngClass]=\"{'p-disabled':item.disabled}\" (click)=\"itemClick($event, item)\"\n                                                            [fragment]=\"item.fragment\" [queryParamsHandling]=\"item.queryParamsHandling\" [preserveFragment]=\"item.preserveFragment\" [skipLocationChange]=\"item.skipLocationChange\" [replaceUrl]=\"item.replaceUrl\" [state]=\"item.state\" pRipple>\n                                                            <span class=\"p-menuitem-icon\" *ngIf=\"item.icon\" [ngClass]=\"item.icon\"></span>\n                                                            <span class=\"p-menuitem-text\" *ngIf=\"item.escape !== false; else htmlRouteLabel\">{{item.label}}</span>\n                                                            <ng-template #htmlRouteLabel><span class=\"p-menuitem-text\" [innerHTML]=\"item.label\"></span></ng-template>\n                                                        </a>\n                                                    </li>\n                                                </ng-template>\n                                            </ul>\n                                        </ng-template>\n                                    </div>\n                                </ng-template>\n                            </div>\n                        </div>\n                    </li>\n                </ng-template>\n                <div class=\"p-megamenu-end\" *ngIf=\"endTemplate; else legacy\">\n                    <ng-container *ngTemplateOutlet=\"endTemplate\"></ng-container>\n                </div>\n                <ng-template #legacy>\n                    <div class=\"p-megamenu-end\">\n                        <ng-content></ng-content>\n                    </div>\n                </ng-template>\n            </ul>\n        </div>\n    `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./megamenu.css']\n})\nexport class MegaMenu implements AfterContentInit {\n\n    @Input() model: MegaMenuItem[];\n\n    @Input() style: any;\n\n    @Input() styleClass: string;\n    \n    @Input() orientation: string = 'horizontal';\n\n    @Input() autoZIndex: boolean = true;\n\n    @Input() baseZIndex: number = 0;\n\n    @ContentChildren(PrimeTemplate) templates: QueryList<any>;\n    \n    activeItem: any;\n\n    documentClickListener: any;\n\n    startTemplate: TemplateRef<any>;\n\n    endTemplate: TemplateRef<any>;\n                \n    constructor(public el: ElementRef, public renderer: Renderer2, public cd: ChangeDetectorRef) {}\n    \n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch(item.getType()) {\n                case 'start':\n                    this.startTemplate = item.template;\n                break;\n\n                case 'end':\n                    this.endTemplate = item.template;\n                break;\n            }\n        });\n    }\n\n    onCategoryMouseEnter(event, menuitem: MegaMenuItem) {\n        if (menuitem.disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        if (this.activeItem) {\n            this.activeItem = menuitem;\n        }\n    }\n\n    onCategoryClick(event, item: MenuItem | MegaMenuItem) {\n        if (item.disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        if (!item.url) {\n            event.preventDefault();\n        }\n\n        if (item.command) {\n            item.command({\n                originalEvent: event,\n                item: item\n            });\n        }\n\n        if (item.items) {\n            if (this.activeItem && this.activeItem === item) {\n                this.activeItem = null;\n                this.unbindDocumentClickListener();\n            }\n            else {\n                this.activeItem = item;\n                this.bindDocumentClickListener();\n            }\n        }\n    }\n    \n    itemClick(event, item: MenuItem | MegaMenuItem) {\n        if (item.disabled) {\n            event.preventDefault();\n            return;\n        }\n        \n        if (!item.url) {\n            event.preventDefault();\n        }\n        \n        if (item.command) {\n            item.command({\n                originalEvent: event,\n                item: item\n            });\n        }\n                        \n        this.activeItem = null;\n    }\n    \n    getColumnClass(menuitem: MegaMenuItem) {\n        let length = menuitem.items ? menuitem.items.length: 0;\n        let columnClass;\n        switch(length) {\n            case 2:\n                columnClass= 'p-megamenu-col-6';\n            break;\n            \n            case 3:\n                columnClass= 'p-megamenu-col-4';\n            break;\n            \n            case 4:\n                columnClass= 'p-megamenu-col-3';\n            break;\n            \n            case 6:\n                columnClass= 'p-megamenu-col-2';\n            break;\n                        \n            default:\n                columnClass= 'p-megamenu-col-12';\n            break;\n        }\n        \n        return columnClass;\n    }\n\n    bindDocumentClickListener() {\n        if (!this.documentClickListener) {\n            this.documentClickListener = (event) => {\n                if (this.el && !this.el.nativeElement.contains(event.target)) {\n                    this.activeItem = null;\n                    this.unbindDocumentClickListener();\n                    this.cd.markForCheck();\n                }\n            };\n\n            document.addEventListener('click', this.documentClickListener);\n        }\n    }\n\n    unbindDocumentClickListener() {\n        if (this.documentClickListener) {\n            document.removeEventListener('click', this.documentClickListener);\n            this.documentClickListener = null;\n        }\n    }\n}\n\n@NgModule({\n    imports: [CommonModule,RouterModule,RippleModule],\n    exports: [MegaMenu,RouterModule],\n    declarations: [MegaMenu]\n})\nexport class MegaMenuModule { }","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}