UNPKG

@js-sugar/angular

Version:

JS-Sugar core package (Angular)

924 lines (902 loc) 83.7 kB
import * as i0 from '@angular/core'; import { Directive, Input, NgModule, Component, EventEmitter, Output, HostBinding, PLATFORM_ID, Inject, ContentChildren, Optional, ContentChild, Injectable, InjectionToken, Pipe } from '@angular/core'; import * as i2$1 from '@angular/common'; import { CommonModule, isPlatformBrowser, DOCUMENT } from '@angular/common'; import * as i1 from '@angular/animations'; import { style, animate, trigger, state, transition } from '@angular/animations'; import * as i2 from '@angular/cdk/bidi'; import { BidiModule } from '@angular/cdk/bidi'; import { Subject, BehaviorSubject } from 'rxjs'; import * as i1$1 from '@angular/cdk/overlay'; import { OverlayModule as OverlayModule$1 } from '@angular/cdk/overlay'; import { TemplatePortal } from '@angular/cdk/portal'; import * as i1$2 from '@angular/forms'; import { NG_VALIDATORS, Validators } from '@angular/forms'; import * as i1$3 from '@angular/common/http'; import { HttpParams } from '@angular/common/http'; import * as i1$4 from '@angular/router'; import { NavigationEnd } from '@angular/router'; import * as i2$2 from '@angular/platform-browser'; class CollapseDirective { constructor(_el, _builder, _renderer) { this._el = _el; this._builder = _builder; this.timing = '100ms ease-in'; this.collapsed = false; _renderer.setStyle(_el.nativeElement, 'overflow-y', 'hidden'); } ngOnChanges(changes) { var _a; if (((_a = changes['collapsed']) === null || _a === void 0 ? void 0 : _a.firstChange) === false) { this._collapseElement(this.collapsed); } } ngOnInit() { this._collapseElement(this.collapsed, 0); } _collapseElement(collapse, timing) { timing = timing != undefined ? timing : this.timing; const expandMeta = [ style({ height: 0 }), animate(timing, style({ height: '*' })), ]; const collapseMeta = [ style({ height: '*' }), animate(timing, style({ height: 0 })), ]; if (this._player) { this._player.destroy(); } this._player = this._builder.build(collapse ? collapseMeta : expandMeta).create(this._el.nativeElement); this._player.play(); } ngOnDestroy() { var _a; (_a = this._player) === null || _a === void 0 ? void 0 : _a.destroy(); } } CollapseDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CollapseDirective, deps: [{ token: i0.ElementRef }, { token: i1.AnimationBuilder }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); CollapseDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: CollapseDirective, selector: "[jssCollapse]", inputs: { timing: "timing", collapsed: ["jssCollapse", "collapsed"] }, exportAs: ["jssCollapse"], usesOnChanges: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CollapseDirective, decorators: [{ type: Directive, args: [{ selector: '[jssCollapse]', exportAs: 'jssCollapse', }] }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.AnimationBuilder }, { type: i0.Renderer2 }]; }, propDecorators: { timing: [{ type: Input }], collapsed: [{ type: Input, args: ['jssCollapse'] }] } }); class CollapseModule { } CollapseModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); CollapseModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: CollapseModule, declarations: [CollapseDirective], imports: [CommonModule], exports: [CollapseDirective] }); CollapseModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CollapseModule, imports: [CommonModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CollapseModule, decorators: [{ type: NgModule, args: [{ declarations: [ CollapseDirective, ], imports: [ CommonModule ], exports: [ CollapseDirective, ] }] }] }); class PanelBackdropComponent { constructor(elementRef) { this.elementRef = elementRef; } } PanelBackdropComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelBackdropComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); PanelBackdropComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: PanelBackdropComponent, selector: "jss-panel-backdrop", exportAs: ["jssPanelBackdrop"], ngImport: i0, template: '', isInline: true, styles: ["@keyframes backdrop-bg{0%{background-color:transparent}to{background-color:#0009}}:host{display:block;position:absolute;top:0;left:0;height:100%;width:100%;background-color:#0009;animation:backdrop-bg .1s}\n"] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelBackdropComponent, decorators: [{ type: Component, args: [{ selector: 'jss-panel-backdrop', exportAs: 'jssPanelBackdrop', template: '', styles: ["@keyframes backdrop-bg{0%{background-color:transparent}to{background-color:#0009}}:host{display:block;position:absolute;top:0;left:0;height:100%;width:100%;background-color:#0009;animation:backdrop-bg .1s}\n"] }] }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } }); const SIDENAV_ANIMATE = animate('.15s cubic-bezier(.7,.3,.1,1)'); class PanelComponent { constructor(elementRef, _parent, _renderer, _viewRef, _dir) { this.elementRef = elementRef; this._parent = _parent; this._renderer = _renderer; this._viewRef = _viewRef; this._dir = _dir; this._backdrop = false; this._animationState = false; this.position = 'start'; this.placement = 'container'; this.stretch = 'both'; this.show = true; this.size = 200; this.over = true; this.zOrder = 1; this.backdropClick = new EventEmitter(); } set backdrop(value) { if (value === this._backdrop) { return; } if (value) { const compRef = this._viewRef.createComponent(PanelBackdropComponent); this._renderer.setStyle(compRef.instance.elementRef.nativeElement, 'z-index', this.zOrder * 2 - 1); this._backdropUnlistenFunc = this._renderer.listen(compRef.instance.elementRef.nativeElement, 'click', (e) => { this.backdropClick.emit(this); }); } else { this._viewRef.clear(); } this._backdrop = value; } get backdrop() { return this._backdrop; } ngOnChanges(changes) { const change = changes['position'] || changes['stretch'] || changes['size'] || changes['show'] || changes['over']; if (change && !change.isFirstChange()) { this._parent.refresh(); this._animationState = !this._animationState; } } get _zIndex() { return this.zOrder * 2; } get _position() { return this.placement === 'container' ? 'absolute' : 'fixed'; } get _animationTrigger() { const ltr = this._dir.value === 'ltr'; const contentPos = this._parent.contentPosition; const isStretchNoneOrStart = this.stretch === 'none' || this.stretch === 'start'; const isStretchNone = this.stretch === 'none'; const isStretchStart = this.stretch === 'start'; const isStretchEnd = this.stretch === 'end'; const isStretchNoneOrEnd = isStretchNone || isStretchEnd; const isStretchBoth = this.stretch === 'both'; let params; switch (this.position) { case 'start': params = { top: isStretchNoneOrEnd ? `${contentPos === null || contentPos === void 0 ? void 0 : contentPos.top}px` : '0', bottom: isStretchNoneOrStart ? `${contentPos === null || contentPos === void 0 ? void 0 : contentPos.bottom}px` : '0', left: ltr ? '0' : '', right: ltr ? '' : '0', hideTransform: `translateX(${ltr ? -100 : 100}%)`, }; break; case 'end': params = { top: isStretchNoneOrEnd ? `${contentPos === null || contentPos === void 0 ? void 0 : contentPos.top}px` : '0', bottom: isStretchNoneOrStart ? `${contentPos === null || contentPos === void 0 ? void 0 : contentPos.bottom}px` : '0', left: ltr ? '' : '0', right: ltr ? '0' : '', hideTransform: `translateX(${ltr ? 100 : -100}%)`, }; break; case 'top': params = { top: '0', bottom: '', left: isStretchBoth || (isStretchStart && ltr) || (isStretchEnd && !ltr) ? '0' : `${contentPos === null || contentPos === void 0 ? void 0 : contentPos.left}px`, right: isStretchBoth || (isStretchEnd && ltr) || (isStretchStart && !ltr) ? '0' : `${contentPos === null || contentPos === void 0 ? void 0 : contentPos.right}px`, hideTransform: 'translateY(-100%)', }; break; case 'bottom': params = { top: '', bottom: '0', left: isStretchBoth || (isStretchStart && ltr) || (isStretchEnd && !ltr) ? '0' : `${contentPos === null || contentPos === void 0 ? void 0 : contentPos.left}px`, right: isStretchBoth || (isStretchEnd && ltr) || (isStretchStart && !ltr) ? '0' : `${contentPos === null || contentPos === void 0 ? void 0 : contentPos.right}px`, hideTransform: 'translateY(100%)', }; break; default: throw Error('Invalid position'); } return { value: this._animationState, params: Object.assign(Object.assign({}, params), { transform: this.show ? 'translate(0,0)' : params.hideTransform }) }; } ngOnDestroy() { if (this._backdropUnlistenFunc) { this._backdropUnlistenFunc(); } } } PanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelComponent, deps: [{ token: i0.ElementRef }, { token: PanelsComponent }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i2.Directionality }], target: i0.ɵɵFactoryTarget.Component }); PanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: PanelComponent, selector: "jss-panel", inputs: { position: "position", placement: "placement", stretch: "stretch", show: "show", size: "size", over: "over", zOrder: "zOrder", backdrop: "backdrop" }, outputs: { backdropClick: "backdropClick" }, host: { properties: { "style.z-index": "this._zIndex", "style.position": "this._position", "@t": "this._animationTrigger" } }, exportAs: ["jssPanel"], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{display:block;position:absolute}\n"], animations: [ trigger('t', [ state('0', style({ left: '{{left}}', right: '{{right}}', top: '{{top}}', bottom: '{{bottom}}', transform: '{{transform}}' }), { params: { left: '', right: '', top: '', bottom: '', transform: '' } }), state('1', style({ left: '{{left}}', right: '{{right}}', top: '{{top}}', bottom: '{{bottom}}', transform: '{{transform}}' }), { params: { left: '', right: '', top: '', bottom: '', transform: '' } }), transition('0 <=> 1', [ SIDENAV_ANIMATE, ]) ]), ] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelComponent, decorators: [{ type: Component, args: [{ selector: 'jss-panel', exportAs: 'jssPanel', animations: [ trigger('t', [ state('0', style({ left: '{{left}}', right: '{{right}}', top: '{{top}}', bottom: '{{bottom}}', transform: '{{transform}}' }), { params: { left: '', right: '', top: '', bottom: '', transform: '' } }), state('1', style({ left: '{{left}}', right: '{{right}}', top: '{{top}}', bottom: '{{bottom}}', transform: '{{transform}}' }), { params: { left: '', right: '', top: '', bottom: '', transform: '' } }), transition('0 <=> 1', [ SIDENAV_ANIMATE, ]) ]), ], template: "<ng-content></ng-content>", styles: [":host{display:block;position:absolute}\n"] }] }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: PanelsComponent }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i2.Directionality }]; }, propDecorators: { position: [{ type: Input }], placement: [{ type: Input }], stretch: [{ type: Input }], show: [{ type: Input }], size: [{ type: Input }], over: [{ type: Input }], zOrder: [{ type: Input }], backdrop: [{ type: Input }], backdropClick: [{ type: Output }], _zIndex: [{ type: HostBinding, args: ['style.z-index'] }], _position: [{ type: HostBinding, args: ['style.position'] }], _animationTrigger: [{ type: HostBinding, args: ['@t'] }] } }); class PanelsComponent { constructor(_dir, _platformId) { this._dir = _dir; this.layoutChange = new EventEmitter(); this._animationState = false; this._contentPosition = { top: 0, bottom: 0, left: 0, right: 0 }; this._isBrowser = isPlatformBrowser(_platformId); this._isRtl = this._dir.value === 'rtl'; } get contentPosition() { return this._contentPosition; } ngAfterContentInit() { this.refresh(); } refresh() { this.computeContentPosition(); this._animationState = !this._animationState; } computeContentPosition() { if (this._isBrowser) { const fixedPanels = this._panels.filter(p => p.show && !p.over); const max = (items) => items.length === 0 ? 0 : Math.max(...items); const getPositionSizes = (position) => fixedPanels .filter(p => p.position === position) .map(p => position === 'start' || position === 'end' ? p.elementRef.nativeElement.clientWidth : p.elementRef.nativeElement.clientHeight); const positions = ['start', 'end', 'top', 'bottom']; var paddings = positions.map(pos => max(getPositionSizes(pos))); this._contentPosition = { left: this._isRtl ? paddings[1] : paddings[0], right: this._isRtl ? paddings[0] : paddings[1], top: paddings[2], bottom: paddings[3], }; } else { this._contentPosition = { top: 0, right: 0, bottom: 0, left: 0 }; } } get _animationTrigger() { const { bottom, left, top, right } = this._contentPosition; return { value: this._animationState, params: { padding: `${top}px ${right}px ${bottom}px ${left}px`, } }; } } PanelsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelsComponent, deps: [{ token: i2.Directionality }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component }); PanelsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: PanelsComponent, selector: "jss-panels", outputs: { layoutChange: "layoutChange" }, queries: [{ propertyName: "_panels", predicate: PanelComponent }], exportAs: ["jssPanels"], ngImport: i0, template: "<ng-content select=\"jss-panel\"></ng-content>\r\n<div class=\"jss-panels-content\" [@t]=\"_animationTrigger\">\r\n <ng-content></ng-content>\r\n</div>", styles: [":host{display:block;position:relative;overflow:hidden}\n"], animations: [ trigger('t', [ state('0', style({ padding: '{{padding}}', height: '100%' }), { params: { padding: '' } }), state('1', style({ padding: '{{padding}}', height: '100%' }), { params: { padding: '' } }), transition('0 <=> 1', [ SIDENAV_ANIMATE, ]) ]), ] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelsComponent, decorators: [{ type: Component, args: [{ selector: 'jss-panels', exportAs: 'jssPanels', animations: [ trigger('t', [ state('0', style({ padding: '{{padding}}', height: '100%' }), { params: { padding: '' } }), state('1', style({ padding: '{{padding}}', height: '100%' }), { params: { padding: '' } }), transition('0 <=> 1', [ SIDENAV_ANIMATE, ]) ]), ], template: "<ng-content select=\"jss-panel\"></ng-content>\r\n<div class=\"jss-panels-content\" [@t]=\"_animationTrigger\">\r\n <ng-content></ng-content>\r\n</div>", styles: [":host{display:block;position:relative;overflow:hidden}\n"] }] }], ctorParameters: function () { return [{ type: i2.Directionality }, { type: undefined, decorators: [{ type: Inject, args: [PLATFORM_ID] }] }]; }, propDecorators: { layoutChange: [{ type: Output }], _panels: [{ type: ContentChildren, args: [PanelComponent] }] } }); class PanelsModule { } PanelsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); PanelsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: PanelsModule, declarations: [PanelComponent, PanelsComponent], imports: [CommonModule, BidiModule], exports: [PanelComponent, PanelsComponent] }); PanelsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelsModule, imports: [CommonModule, BidiModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PanelsModule, decorators: [{ type: NgModule, args: [{ declarations: [ PanelComponent, PanelsComponent ], imports: [ CommonModule, BidiModule ], exports: [ PanelComponent, PanelsComponent, ], entryComponents: [ PanelBackdropComponent ] }] }] }); class DividerMenuItemTemplateDirective { constructor(templateRef) { this.templateRef = templateRef; } } DividerMenuItemTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DividerMenuItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); DividerMenuItemTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: DividerMenuItemTemplateDirective, selector: "[jssDividerMenuItemTemplate]", exportAs: ["jssDividerMenuItemTemplate"], ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DividerMenuItemTemplateDirective, decorators: [{ type: Directive, args: [{ selector: '[jssDividerMenuItemTemplate]', exportAs: 'jssDividerMenuItemTemplate', }] }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } }); class GroupMenuItemTemplateDirective { constructor(templateRef) { this.templateRef = templateRef; } } GroupMenuItemTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GroupMenuItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); GroupMenuItemTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: GroupMenuItemTemplateDirective, selector: "[jssGroupMenuItemTemplate]", exportAs: ["jssGroupMenuItemTemplate"], ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GroupMenuItemTemplateDirective, decorators: [{ type: Directive, args: [{ selector: '[jssGroupMenuItemTemplate]', exportAs: 'jssGroupMenuItemTemplate', }] }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } }); class TextMenuItemTemplateDirective { constructor(templateRef) { this.templateRef = templateRef; } } TextMenuItemTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TextMenuItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); TextMenuItemTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: TextMenuItemTemplateDirective, selector: "[jssTextMenuItemTemplate]", exportAs: ["jssTextMenuItemTemplate"], ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TextMenuItemTemplateDirective, decorators: [{ type: Directive, args: [{ selector: '[jssTextMenuItemTemplate]', exportAs: 'jssTextMenuItemTemplate', }] }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } }); class User { constructor(permissions) { this._permissions = new Array(); if (Array.isArray(permissions)) { this._permissions = [...permissions]; } } get permissions() { return [...this._permissions]; } hasAllPermissions(permissions) { return permissions.every(x => this._permissions.some(y => x === y)); } hasAnyPermission(permissions) { return permissions.length == 0 || permissions.some(x => this._permissions.some(y => x === y)); } hasPermission(criteria) { if (typeof criteria === 'string') { return this._permissions.some(x => x === criteria); } if (typeof criteria === 'object' && (criteria === null || criteria === void 0 ? void 0 : criteria.any) && (criteria === null || criteria === void 0 ? void 0 : criteria.all)) { throw Error('Setting "any" and "all" at the same time is not valid.'); } if (Array.isArray(criteria === null || criteria === void 0 ? void 0 : criteria.any)) { return this.hasAnyPermission(criteria.any); } if (Array.isArray(criteria === null || criteria === void 0 ? void 0 : criteria.all)) { return this.hasAllPermissions(criteria.all); } throw Error('Invalid criteria'); } } class UserStore { constructor() { this._userSubject = new Subject(); this.change = this._userSubject.asObservable(); } get user() { return this._user; } setUser(user) { if (user === undefined || user instanceof User) { this._user = user; this._userSubject.next(user); return; } throw Error('Invalid User.'); } } class ShowPermissionDirective { constructor(templateRef, viewContainer, userStore) { this.templateRef = templateRef; this.viewContainer = viewContainer; this.userStore = userStore; this._viewCreated = false; } set showPermission(value) { var _a; let granted; const user = (_a = this.userStore) === null || _a === void 0 ? void 0 : _a.user; if (value == null) { granted = true; } else if (user == undefined) { granted = false; } else { granted = user.hasPermission(value); } this._show(granted); } _show(show) { if (show && !this._viewCreated) { this.viewContainer.createEmbeddedView(this.templateRef); this._viewCreated = true; } else if (!show && this._viewCreated) { this.viewContainer.clear(); this._viewCreated = false; } } } ShowPermissionDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: ShowPermissionDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: UserStore, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); ShowPermissionDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: ShowPermissionDirective, selector: "[jssShowPermission]", inputs: { showPermission: ["jssShowPermission", "showPermission"] }, exportAs: ["jssShowPermission"], ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: ShowPermissionDirective, decorators: [{ type: Directive, args: [{ selector: '[jssShowPermission]', exportAs: 'jssShowPermission', }] }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }, { type: UserStore, decorators: [{ type: Optional }] }]; }, propDecorators: { showPermission: [{ type: Input, args: ['jssShowPermission'] }] } }); class ShowDirective { constructor(templateRef, viewContainer, userStore) { this.templateRef = templateRef; this.viewContainer = viewContainer; this.userStore = userStore; this._viewCreated = false; this._subscription = userStore === null || userStore === void 0 ? void 0 : userStore.change.subscribe(x => this._decide()); } set show(value) { this._condition = value; this._decide(); } _decide() { var _a; let show; const user = (_a = this.userStore) === null || _a === void 0 ? void 0 : _a.user; const { user: userCondition, permission } = this._condition; if (userCondition === 'any') { show = true; } else if (userCondition === 'set') { if (user == undefined) { show = false; } else if (permission == undefined) { show = true; } else { show = user.hasPermission(permission); } } else { show = user == undefined; } if (show && !this._viewCreated) { this.viewContainer.createEmbeddedView(this.templateRef); this._viewCreated = true; } else if (!show && this._viewCreated) { this.viewContainer.clear(); this._viewCreated = false; } } ngOnDestroy() { var _a; (_a = this._subscription) === null || _a === void 0 ? void 0 : _a.unsubscribe(); } } ShowDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: ShowDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: UserStore, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); ShowDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: ShowDirective, selector: "[jssShow]", inputs: { show: ["jssShow", "show"] }, exportAs: ["jssShow"], ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: ShowDirective, decorators: [{ type: Directive, args: [{ selector: '[jssShow]', exportAs: 'jssShow', }] }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }, { type: UserStore, decorators: [{ type: Optional }] }]; }, propDecorators: { show: [{ type: Input, args: ['jssShow'] }] } }); class SecurityModule { } SecurityModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: SecurityModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); SecurityModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: SecurityModule, declarations: [ShowPermissionDirective, ShowDirective], exports: [ShowPermissionDirective, ShowDirective] }); SecurityModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: SecurityModule }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: SecurityModule, decorators: [{ type: NgModule, args: [{ declarations: [ ShowPermissionDirective, ShowDirective ], providers: [], exports: [ ShowPermissionDirective, ShowDirective ] }] }] }); class MenuComponent { constructor(_identityManager) { this._identityManager = _identityManager; this.itemClick = new EventEmitter(); this._expansionStates = new Map(); } _onTextMenuItemClick(item, e) { e.stopPropagation(); if (!item.disabled) { this.itemClick.emit({ item, mouseEvent: e }); } } _onGroupMenuItemClick(item, e) { e.stopPropagation(); if (!item.disabled) { var expanded = this._expansionStates.get(item); this._expansionStates.set(item, !expanded); } } _isGroupExpanded(item) { var state = this._expansionStates.get(item); return typeof state === 'undefined' ? false : state; } hasPermission(item) { return true; } } MenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: MenuComponent, deps: [{ token: UserStore, optional: true }], target: i0.ɵɵFactoryTarget.Component }); MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: MenuComponent, selector: "jss-menu", inputs: { items: "items" }, outputs: { itemClick: "itemClick" }, queries: [{ propertyName: "_textTemplate", first: true, predicate: TextMenuItemTemplateDirective, descendants: true }, { propertyName: "_groupTemplate", first: true, predicate: GroupMenuItemTemplateDirective, descendants: true }, { propertyName: "_dividerTemplate", first: true, predicate: DividerMenuItemTemplateDirective, descendants: true }], exportAs: ["jssMenu"], ngImport: i0, template: "<ul>\r\n <ng-container *ngTemplateOutlet=\"menuTemplate; context: {$implicit: items}\"></ng-container>\r\n</ul>\r\n\r\n<ng-template #menuTemplate let-items>\r\n <ng-container *ngFor=\"let item of items\">\r\n <ng-container [ngSwitch]=\"item.constructor.name\">\r\n <li *ngSwitchCase=\"'GroupMenuItem'\" class=\"jss-group-menu-item\" (click)=\"_onGroupMenuItemClick(item, $event)\">\r\n <span *ngIf=\"!_groupTemplate && item.text\" class=\"group-text\">{{item.text}}</span>\r\n <ng-container *ngIf=\"_groupTemplate\">\r\n <ng-container *ngTemplateOutlet=\"_groupTemplate.templateRef; context: {$implicit: item}\"></ng-container>\r\n </ng-container>\r\n <ul *ngIf=\"item.children\" [@t]=\"_isGroupExpanded(item)\">\r\n <ng-container *ngTemplateOutlet=\"menuTemplate; context: {$implicit: item.children}\">\r\n </ng-container>\r\n </ul>\r\n </li> \r\n\r\n <li *ngSwitchCase=\"'TextMenuItem'\" class=\"jss-text-menu-item\" (click)=\"_onTextMenuItemClick(item, $event)\">\r\n <span *ngIf=\"!_textTemplate\">{{item.text}}</span>\r\n <ng-container *ngIf=\"_textTemplate\">\r\n <ng-container *ngTemplateOutlet=\"_textTemplate.templateRef; context: {$implicit: item}\"></ng-container>\r\n </ng-container>\r\n </li>\r\n\r\n <li *ngSwitchCase=\"'DividerMenuItem'\" class=\"jss-divider-menu-item\">\r\n <hr *ngIf=\"!_dividerTemplate\">\r\n <ng-container *ngIf=\"_dividerTemplate\">\r\n <ng-container *ngTemplateOutlet=\"_dividerTemplate.templateRef; context: {$implicit: item}\"></ng-container>\r\n </ng-container>\r\n </li>\r\n </ng-container>\r\n </ng-container>\r\n</ng-template>", styles: [":host{display:block}ul{padding:0;margin:0;overflow:hidden}ul li{list-style:none}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], animations: [ trigger('t', [ state('0', style({ height: '0', })), state('1', style({ height: '*', })), transition('0 <=> 1', [ animate('.15s cubic-bezier(.7,.3,.1,1)'), ]) ]), ] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: MenuComponent, decorators: [{ type: Component, args: [{ selector: 'jss-menu', exportAs: 'jssMenu', animations: [ trigger('t', [ state('0', style({ height: '0', })), state('1', style({ height: '*', })), transition('0 <=> 1', [ animate('.15s cubic-bezier(.7,.3,.1,1)'), ]) ]), ], template: "<ul>\r\n <ng-container *ngTemplateOutlet=\"menuTemplate; context: {$implicit: items}\"></ng-container>\r\n</ul>\r\n\r\n<ng-template #menuTemplate let-items>\r\n <ng-container *ngFor=\"let item of items\">\r\n <ng-container [ngSwitch]=\"item.constructor.name\">\r\n <li *ngSwitchCase=\"'GroupMenuItem'\" class=\"jss-group-menu-item\" (click)=\"_onGroupMenuItemClick(item, $event)\">\r\n <span *ngIf=\"!_groupTemplate && item.text\" class=\"group-text\">{{item.text}}</span>\r\n <ng-container *ngIf=\"_groupTemplate\">\r\n <ng-container *ngTemplateOutlet=\"_groupTemplate.templateRef; context: {$implicit: item}\"></ng-container>\r\n </ng-container>\r\n <ul *ngIf=\"item.children\" [@t]=\"_isGroupExpanded(item)\">\r\n <ng-container *ngTemplateOutlet=\"menuTemplate; context: {$implicit: item.children}\">\r\n </ng-container>\r\n </ul>\r\n </li> \r\n\r\n <li *ngSwitchCase=\"'TextMenuItem'\" class=\"jss-text-menu-item\" (click)=\"_onTextMenuItemClick(item, $event)\">\r\n <span *ngIf=\"!_textTemplate\">{{item.text}}</span>\r\n <ng-container *ngIf=\"_textTemplate\">\r\n <ng-container *ngTemplateOutlet=\"_textTemplate.templateRef; context: {$implicit: item}\"></ng-container>\r\n </ng-container>\r\n </li>\r\n\r\n <li *ngSwitchCase=\"'DividerMenuItem'\" class=\"jss-divider-menu-item\">\r\n <hr *ngIf=\"!_dividerTemplate\">\r\n <ng-container *ngIf=\"_dividerTemplate\">\r\n <ng-container *ngTemplateOutlet=\"_dividerTemplate.templateRef; context: {$implicit: item}\"></ng-container>\r\n </ng-container>\r\n </li>\r\n </ng-container>\r\n </ng-container>\r\n</ng-template>", styles: [":host{display:block}ul{padding:0;margin:0;overflow:hidden}ul li{list-style:none}\n"] }] }], ctorParameters: function () { return [{ type: UserStore, decorators: [{ type: Optional }] }]; }, propDecorators: { items: [{ type: Input }], itemClick: [{ type: Output }], _textTemplate: [{ type: ContentChild, args: [TextMenuItemTemplateDirective] }], _groupTemplate: [{ type: ContentChild, args: [GroupMenuItemTemplateDirective] }], _dividerTemplate: [{ type: ContentChild, args: [DividerMenuItemTemplateDirective] }] } }); const DECLARES$1 = [ MenuComponent, TextMenuItemTemplateDirective, GroupMenuItemTemplateDirective, DividerMenuItemTemplateDirective ]; class MenuModule { } MenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: MenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); MenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: MenuModule, declarations: [MenuComponent, TextMenuItemTemplateDirective, GroupMenuItemTemplateDirective, DividerMenuItemTemplateDirective], imports: [CommonModule], exports: [MenuComponent, TextMenuItemTemplateDirective, GroupMenuItemTemplateDirective, DividerMenuItemTemplateDirective] }); MenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: MenuModule, imports: [CommonModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: MenuModule, decorators: [{ type: NgModule, args: [{ declarations: DECLARES$1, imports: [ CommonModule ], exports: DECLARES$1 }] }] }); class OverlayDirective { constructor(_overlayService, _viewRef, _elementRef) { this._overlayService = _overlayService; this._viewRef = _viewRef; this._elementRef = _elementRef; this.hasBackdrop = false; this.positions = [{ originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top' }]; this.showChange = new EventEmitter(); this.backdropClick = new EventEmitter(); this._show = false; } set show(value) { if ((value && !this._show) || (!value && this._show)) { if (value) { this._createOverlay(); } else { this._dispose(); } this._show = value; } } get show() { return this._show; } ngOnInit() { } toggle() { this.show = !this.show; this.showChange.emit(this.show); } _createOverlay() { var portal = new TemplatePortal(this.overlay, this._viewRef); const scrollStrategy = this._overlayService.scrollStrategies.reposition(); const positionStrategy = this._overlayService.position().flexibleConnectedTo(this._elementRef.nativeElement) .withPositions(this.positions); this._overlayRef = this._overlayService.create({ scrollStrategy, positionStrategy, hasBackdrop: this.hasBackdrop, backdropClass: 'jss-transparent-overlay' }); this._overlayRef.attach(portal); if (this.hasBackdrop) { this._backdropClickSubscription = this._overlayRef.backdropClick().subscribe(x => { this.backdropClick.emit(x); }); } } _dispose() { var _a, _b; (_a = this._backdropClickSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe(); (_b = this._overlayRef) === null || _b === void 0 ? void 0 : _b.dispose(); this._overlayRef = undefined; } ngOnDestroy() { this._dispose(); } } OverlayDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: OverlayDirective, deps: [{ token: i1$1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); OverlayDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: OverlayDirective, selector: "[jssOverlay]", inputs: { hasBackdrop: "hasBackdrop", overlay: ["jssOverlay", "overlay"], positions: "positions", show: "show" }, outputs: { showChange: "showChange", backdropClick: "backdropClick" }, exportAs: ["jssOverlay"], ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: OverlayDirective, decorators: [{ type: Directive, args: [{ selector: '[jssOverlay]', exportAs: 'jssOverlay', }] }], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }]; }, propDecorators: { hasBackdrop: [{ type: Input }], overlay: [{ type: Input, args: ['jssOverlay'] }], positions: [{ type: Input }], showChange: [{ type: Output }], backdropClick: [{ type: Output }], show: [{ type: Input }] } }); const cdkOverlayCss = `.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;top:0;bottom:0;left:0;right:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}@media screen and (-ms-high-contrast: active){.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop,.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}`; const transparentOverlayCss = '.jss-transparent-overlay{background-color:transparent!important}'; const css = cdkOverlayCss + transparentOverlayCss; class CdkOverlayService { constructor(_doc) { this._doc = _doc; this._cssInjected = false; } injectCss() { var _a; if (((_a = this._doc) === null || _a === void 0 ? void 0 : _a.head) && !this._cssInjected) { const head = this._doc.getElementsByTagName('head')[0]; const style = this._doc.createElement('style'); style.appendChild(this._doc.createTextNode(css)); head.appendChild(style); } } } CdkOverlayService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CdkOverlayService, deps: [{ token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); CdkOverlayService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CdkOverlayService, providedIn: 'root' }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CdkOverlayService, decorators: [{ type: Injectable, args: [{ providedIn: 'root' }] }], ctorParameters: function () { return [{ type: Document, decorators: [{ type: Optional }, { type: Inject, args: [DOCUMENT] }] }]; } }); class OverlayModule { constructor(cdkOverlayService) { cdkOverlayService.injectCss(); } } OverlayModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: OverlayModule, deps: [{ token: CdkOverlayService }], target: i0.ɵɵFactoryTarget.NgModule }); OverlayModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: OverlayModule, declarations: [OverlayDirective], imports: [CommonModule, OverlayModule$1], exports: [OverlayDirective] }); OverlayModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: OverlayModule, imports: [CommonModule, OverlayModule$1] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: OverlayModule, decorators: [{ type: NgModule, args: [{ declarations: [ OverlayDirective, ], imports: [ CommonModule, OverlayModule$1 ], exports: [ OverlayDirective, ] }] }], ctorParameters: function () { return [{ type: CdkOverlayService }]; } }); const APP_CONFIGURATION = new InjectionToken('AppConfiguration'); class ErrorDirective { constructor(_templateRef, _viewContainer, _form) { this._templateRef = _templateRef; this._viewContainer = _viewContainer; this._form = _form; this._errors = null; if (!_form) { throw Error('ErrorDirective must be used in a form element.'); } } ngOnInit() { this._formStatusChangeSubscription = this._form.statusChanges.subscribe(x => { const control = this._form.controls[this._fieldName]; this._errors = control.errors; if (control.invalid && (control.dirty || control.touched)) { this._show(true); } else { this._show(false); } }); this._formSubmitSubscription = this._form.ngSubmit.subscribe(s => { this._show(true); }); } set fieldName(value) { this._fieldName = value; } get fieldName() { return this.