npm - @pepperi-addons/ngx-lib - Versions diffs - 0.2.59-query-builder.13 → 0.2.61-query-builder.2 - Mend

@pepperi-addons/ngx-lib 0.2.59-query-builder.13 → 0.2.61-query-builder.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (232) hide show

package/fesm2015/pepperi-addons-ngx-lib-group-buttons.js CHANGED Viewed

@@ -47,7 +47,7 @@ PepGroupButtonsComponent.decorators = [
     { type: Component, args: [{
                 selector: 'pep-group-buttons',
                 template: "<div class=\"group-buttons-container\" pepRtlDirection>\r\n    <ng-container *ngIf=\"viewType === 'regular'\">\r\n        <button *ngFor=\"let button of buttons\" [pepDataQa]=\"button?.value\"\r\n            class=\"pep-button pep-spacing-element pull-left flip first-button {{ sizeType }} {{ styleType }}\"\r\n            [disabled]=\"buttonsDisabled || button.disabled\" mat-button (click)=\"onButtonClicked($event, button)\">\r\n            <span [title]=\"button?.value\">{{ button?.value }}</span>\r\n        </button>\r\n    </ng-container>\r\n\r\n    <div *ngIf=\"viewType === 'dropdown'\" class=\"dropdown-buttons pep-spacing-element\"\r\n        [ngClass]=\"{dropup: screenSize >= PepScreenSizeType.MD}\">\r\n        <button [pepDataQa]=\"buttons[0]?.value\"\r\n            class=\"pep-button pull-left flip first-button {{ sizeType }} {{ styleType }}\"\r\n            (click)=\"onButtonClicked($event, buttons[0])\" [disabled]=\"buttonsDisabled || buttons[0].disabled\"\r\n            mat-button>\r\n            <span class=\"ellipsis\" [title]=\"buttons[0]?.value\">{{ buttons[0]?.value }}</span>\r\n        </button>\r\n        <button class=\"pep-button icon-button pull-right flip last-button {{ sizeType }} {{ styleType }}\"\r\n            [matMenuTriggerFor]=\"actionsMenu\" [disabled]=\"buttonsDisabled\" pepMenuBlur mat-button>\r\n            <mat-icon>\r\n                <pep-icon name=\"{{ screenSize < PepScreenSizeType.MD ? 'arrow_down' : 'arrow_up' }}\">\r\n                </pep-icon>\r\n            </mat-icon>\r\n        </button>\r\n\r\n        <mat-menu #actionsMenu=\"matMenu\" xPosition=\"before\">\r\n            <ng-container *ngFor=\"let button of buttons; let i = index; first as isFirst\">\r\n                <button *ngIf=\"!isFirst\" mat-menu-item [pepDataQa]=\"button?.value\"\r\n                    (click)=\"onButtonClicked($event, button)\">\r\n                    <span [title]=\"button?.value\">{{ button?.value }}</span>\r\n                </button>\r\n            </ng-container>\r\n        </mat-menu>\r\n    </div>\r\n\r\n    <div *ngIf=\"viewType === 'split'\" class=\"split-buttons\">\r\n        <button *ngFor=\"let button of buttons; let index; let isFirst = first; let isLast = last\"\r\n            [pepDataQa]=\"button?.value\" mat-button pepButtonBlur\r\n            class=\"pep-button {{ sizeType }} {{ styleType }} {{ button?.classNames }} pull-left flip\"\r\n            [disabled]=\"buttonsDisabled || button.disabled\" [ngClass]=\"{\r\n                'first-button': isFirst, \r\n                'middle-button': !isFirst && !isLast, \r\n                'last-button': isLast, \r\n                'icon-button': button?.iconName && !button?.value}\" (click)=\"onButtonClicked($event, button)\">\r\n\r\n            <ng-container *ngTemplateOutlet=\"contentTemplate; context: {button: button}\"></ng-container>\r\n        </button>\r\n    </div>\r\n\r\n    <div *ngIf=\"viewType === 'toggle'\" class=\"toggle-buttons\" [ngClass]=\"{ 'stretch': stretch }\">\r\n        <button *ngFor=\"let button of buttons; let index; let isFirst = first; let isLast = last\"\r\n            [pepDataQa]=\"button?.value\" mat-button pepButtonBlur\r\n            class=\"pep-button {{ sizeType }} {{ styleType }} {{ button?.classNames }} pull-left flip\"\r\n            [disabled]=\"buttonsDisabled || button.disabled\" [ngClass]=\"{\r\n                'first-button': isFirst && !isLast, \r\n                'middle-button': !isFirst && !isLast, \r\n                'last-button': isLast && !isFirst,\r\n                'icon-button': button?.iconName && !button?.value,\r\n                'is-selected': button?.key !== '' && button?.key === selectedButtonKey}\"\r\n            (click)=\"onButtonClicked($event, button)\">\r\n            <ng-container *ngTemplateOutlet=\"contentTemplate; context: {button: button}\"></ng-container>\r\n        </button>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #contentTemplate let-button=\"button\">\r\n    <mat-icon *ngIf=\"button.iconName && (!button.iconPosition || button.iconPosition === 'start')\"\r\n        [ngClass]=\"{ 'pull-left flip': button.value }\">\r\n        <pep-icon name=\"{{button.iconName}}\"></pep-icon>\r\n    </mat-icon>\r\n    <span *ngIf=\"button.value\" class=\"ellipsis pull-left flip\"\r\n        [ngClass]=\"{ 'button-title-with-icon': button.iconName, 'icon-before': button.iconPosition === 'start' }\"\r\n        [title]=\"button.value\">\r\n        {{button.value}}\r\n    </span>\r\n    <mat-icon *ngIf=\"button.iconName && button.iconPosition === 'end'\" [ngClass]=\"{ 'pull-left flip': button.value }\">\r\n        <pep-icon name=\"{{button.iconName}}\"></pep-icon>\r\n    </mat-icon>\r\n</ng-template>",
-                styles: [".group-buttons-container{display:flex;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem)}.group-buttons-container .dropdown-buttons .first-button,.group-buttons-container .split-buttons .first-button,.group-buttons-container .toggle-buttons .first-button{-webkit-margin-end:1px;margin-inline-end:1px}.group-buttons-container .dropdown-buttons .first-button,.group-buttons-container .dropdown-buttons .first-button:after,.group-buttons-container .split-buttons .first-button,.group-buttons-container .split-buttons .first-button:after,.group-buttons-container .toggle-buttons .first-button,.group-buttons-container .toggle-buttons .first-button:after{border-radius:.25rem 0 0 .25rem;border-radius:var(--pep-border-radius-md,.25rem) 0 0 var(--pep-border-radius-md,.25rem)}.group-buttons-container .dropdown-buttons .last-button,.group-buttons-container .dropdown-buttons .last-button:after,.group-buttons-container .split-buttons .last-button,.group-buttons-container .split-buttons .last-button:after,.group-buttons-container .toggle-buttons .last-button,.group-buttons-container .toggle-buttons .last-button:after{border-radius:0 .25rem .25rem 0;border-radius:0 var(--pep-border-radius-md,.25rem) var(--pep-border-radius-md,.25rem) 0}.group-buttons-container .dropdown-buttons .pep-button,.group-buttons-container .dropdown-buttons .pepperi-button,.group-buttons-container .split-buttons .pep-button,.group-buttons-container .split-buttons .pepperi-button,.group-buttons-container .toggle-buttons .pep-button,.group-buttons-container .toggle-buttons .pepperi-button{margin-top:0!important}.group-buttons-container .dropdown-buttons .pep-button.cdk-focused,.group-buttons-container .dropdown-buttons .pepperi-button.cdk-focused,.group-buttons-container .split-buttons .pep-button.cdk-focused,.group-buttons-container .split-buttons .pepperi-button.cdk-focused,.group-buttons-container .toggle-buttons .pep-button.cdk-focused,.group-buttons-container .toggle-buttons .pepperi-button.cdk-focused{z-index:2}@media (max-width:599px){.group-buttons-container .dropdown-buttons.dropup .first-button,.group-buttons-container .split-buttons.dropup .first-button,.group-buttons-container .toggle-buttons.dropup .first-button{max-width:200px;padding:0 .25rem}.group-buttons-container .dropdown-buttons.dropup .last-button,.group-buttons-container .split-buttons.dropup .last-button,.group-buttons-container .toggle-buttons.dropup .last-button{padding:0}}.group-buttons-container .split-buttons,.group-buttons-container .toggle-buttons{display:grid;grid-auto-flow:column}.group-buttons-container .split-buttons.stretch,.group-buttons-container .toggle-buttons.stretch{width:100%}.group-buttons-container .split-buttons .pep-button,.group-buttons-container .toggle-buttons .pep-button{max-width:unset}.group-buttons-container .split-buttons .first-button,.group-buttons-container .toggle-buttons .first-button{-webkit-margin-end:-1px;margin-inline-end:-1px}.group-buttons-container .split-buttons .middle-button,.group-buttons-container .toggle-buttons .middle-button{border-radius:0;-webkit-margin-end:-1px;margin-inline-end:-1px}"]
+                styles: [".group-buttons-container{display:flex;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem)}.group-buttons-container .dropdown-buttons .first-button,.group-buttons-container .split-buttons .first-button,.group-buttons-container .toggle-buttons .first-button{-webkit-margin-end:1px;margin-inline-end:1px}.group-buttons-container .dropdown-buttons .first-button,.group-buttons-container .dropdown-buttons .first-button:after,.group-buttons-container .split-buttons .first-button,.group-buttons-container .split-buttons .first-button:after,.group-buttons-container .toggle-buttons .first-button,.group-buttons-container .toggle-buttons .first-button:after{border-radius:.25rem 0 0 .25rem;border-radius:var(--pep-border-radius-md,.25rem) 0 0 var(--pep-border-radius-md,.25rem)}.group-buttons-container .dropdown-buttons .last-button,.group-buttons-container .dropdown-buttons .last-button:after,.group-buttons-container .split-buttons .last-button,.group-buttons-container .split-buttons .last-button:after,.group-buttons-container .toggle-buttons .last-button,.group-buttons-container .toggle-buttons .last-button:after{border-radius:0 .25rem .25rem 0;border-radius:0 var(--pep-border-radius-md,.25rem) var(--pep-border-radius-md,.25rem) 0}.group-buttons-container .dropdown-buttons .pep-button,.group-buttons-container .dropdown-buttons .pepperi-button,.group-buttons-container .split-buttons .pep-button,.group-buttons-container .split-buttons .pepperi-button,.group-buttons-container .toggle-buttons .pep-button,.group-buttons-container .toggle-buttons .pepperi-button{margin-top:0!important}.group-buttons-container .dropdown-buttons .pep-button.cdk-focused,.group-buttons-container .dropdown-buttons .pepperi-button.cdk-focused,.group-buttons-container .split-buttons .pep-button.cdk-focused,.group-buttons-container .split-buttons .pepperi-button.cdk-focused,.group-buttons-container .toggle-buttons .pep-button.cdk-focused,.group-buttons-container .toggle-buttons .pepperi-button.cdk-focused{z-index:2}@media (max-width:599px){.group-buttons-container .dropdown-buttons.dropup .first-button,.group-buttons-container .split-buttons.dropup .first-button,.group-buttons-container .toggle-buttons.dropup .first-button{max-width:200px;padding:0 .25rem}.group-buttons-container .dropdown-buttons.dropup .last-button,.group-buttons-container .split-buttons.dropup .last-button,.group-buttons-container .toggle-buttons.dropup .last-button{padding:0}}.group-buttons-container .split-buttons,.group-buttons-container .toggle-buttons{display:grid;grid-auto-flow:column}.group-buttons-container .split-buttons.stretch,.group-buttons-container .toggle-buttons.stretch{width:100%}.group-buttons-container .split-buttons .pep-button,.group-buttons-container .toggle-buttons .pep-button{max-width:unset}.group-buttons-container .split-buttons .first-button,.group-buttons-container .toggle-buttons .first-button{-webkit-margin-end:-1px;margin-inline-end:-1px}.group-buttons-container .split-buttons .middle-button,.group-buttons-container .toggle-buttons .middle-button{border-radius:0;-webkit-margin-end:-1px;margin-inline-end:-1px}", ".group-buttons-container .toggle-buttons .is-selected.weak{background:#fafafa;background:hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),98%);box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.08);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.08);border:1px solid hsl(0,0%,calc(10% + 30%));border:1px solid hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.group-buttons-container .toggle-buttons .is-selected.weak:hover{background:#fafafa;background:hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),98%);box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.16);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.16);border:1px solid hsl(0,0%,calc(10% + 20%));border:1px solid hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),calc(var(--pep-color-regular-l, 10%) + 20%))}.group-buttons-container .toggle-buttons .is-selected.weak:focus{box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.16);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.16);box-shadow:0 0 0 .25rem rgba(23,102,166,.5);box-shadow:0 0 0 var(--pep-spacing-xs,.25rem) hsla(var(--pep-color-text-link-h,207),var(--pep-color-text-link-s,76%),var(--pep-color-text-link-l,37%),.5)}.group-buttons-container .toggle-buttons .is-selected.weak:active,.group-buttons-container .toggle-buttons .is-selected.weak:focus{background:#e0e0e0;background:hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),88%);border:1px solid #1a1a1a;border:1px solid hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),var(--pep-color-regular-l,10%))}.group-buttons-container .toggle-buttons .is-selected.weak:active{box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.32);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.32)}.group-buttons-container .toggle-buttons .is-selected.weak:disabled:not(.ignore-disabled){box-shadow:unset;border:unset;color:rgba(26,26,26,.35)!important;color:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)!important;background:#e0e0e0!important;background:hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),88%)!important;box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.04)!important;box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.04)!important;border:1px solid rgba(26,26,26,.08);border:1px solid hsla(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),var(--pep-color-regular-l,10%),.08)}.group-buttons-container .toggle-buttons .is-selected.weak:disabled:not(.ignore-disabled):after{border:unset}.group-buttons-container .toggle-buttons .is-selected.weak:disabled:not(.ignore-disabled) .svg-icon{fill:rgba(26,26,26,.35);fill:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)}.group-buttons-container .toggle-buttons .is-selected.weak:disabled:not(.ignore-disabled) .svg-icon.stroke{fill:unset;stroke:rgba(26,26,26,.35);stroke:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)}.group-buttons-container .toggle-buttons .is-selected.regular{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}.group-buttons-container .toggle-buttons .is-selected.regular:hover{background:rgba(26,26,26,.16);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.16)}.group-buttons-container .toggle-buttons .is-selected.regular:focus{box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.08);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.08);position:relative;box-shadow:0 0 0 .25rem rgba(23,102,166,.5);box-shadow:0 0 0 var(--pep-spacing-xs,.25rem) hsla(var(--pep-color-text-link-h,207),var(--pep-color-text-link-s,76%),var(--pep-color-text-link-l,37%),.5)}.group-buttons-container .toggle-buttons .is-selected.regular:focus:not(.keep-background-on-focus){background:#fff;background:hsl(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%))}.group-buttons-container .toggle-buttons .is-selected.regular:focus:after{z-index:0;content:\"\";transition:all .25s;display:block;position:absolute;top:0;bottom:0;left:0;right:0;border-radius:inherit;border:1px solid #1a1a1a;border:1px solid hsl(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%))}.group-buttons-container .toggle-buttons .is-selected.regular:active{box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.08);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.08);position:relative}.group-buttons-container .toggle-buttons .is-selected.regular:active:not(.keep-background-on-focus){background:#fff;background:hsl(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%))}.group-buttons-container .toggle-buttons .is-selected.regular:active:after{z-index:0;content:\"\";transition:all .25s;display:block;position:absolute;top:0;bottom:0;left:0;right:0;border-radius:inherit;border:1px solid #1a1a1a;border:1px solid hsl(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%))}.group-buttons-container .toggle-buttons .is-selected.regular:disabled:not(.ignore-disabled){box-shadow:unset;border:unset;color:rgba(26,26,26,.35)!important;color:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)!important;background:rgba(26,26,26,.04)!important;background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.04)!important}.group-buttons-container .toggle-buttons .is-selected.regular:disabled:not(.ignore-disabled):after{border:unset}.group-buttons-container .toggle-buttons .is-selected.regular:disabled:not(.ignore-disabled) .svg-icon{fill:rgba(26,26,26,.35);fill:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)}.group-buttons-container .toggle-buttons .is-selected.regular:disabled:not(.ignore-disabled) .svg-icon.stroke{fill:unset;stroke:rgba(26,26,26,.35);stroke:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)}"]
             },] }
 ];
 PepGroupButtonsComponent.ctorParameters = () => [

package/fesm2015/pepperi-addons-ngx-lib-group-buttons.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pepperi-addons-ngx-lib-group-buttons.js","sources":["../../../projects/ngx-lib/group-buttons/group-buttons.component.ts","../../../projects/ngx-lib/group-buttons/group-buttons.module.ts","../../../projects/ngx-lib/group-buttons/public-api.ts","../../../projects/ngx-lib/group-buttons/pepperi-addons-ngx-lib-group-buttons.ts"],"sourcesContent":["import {\r\n Component,\r\n OnDestroy,\r\n Input,\r\n Output,\r\n EventEmitter,\r\n} from '@angular/core';\r\nimport {\r\n PepLayoutService, PepScreenSizeType, PepStyleType, PepSizeType\r\n} from '@pepperi-addons/ngx-lib';\r\nimport {\r\n PepButton,\r\n IPepButtonClickEvent,\r\n} from '@pepperi-addons/ngx-lib/button';\r\n\r\nexport type PepGroupButtonsViewType = 'regular' \| 'dropdown' \| 'split' \| 'toggle';\r\n@Component({\r\n selector: 'pep-group-buttons',\r\n templateUrl: './group-buttons.component.html',\r\n styleUrls: ['./group-buttons.component.scss'],\r\n})\r\nexport class PepGroupButtonsComponent implements OnDestroy {\r\n PepScreenSizeType = PepScreenSizeType;\r\n screenSize: PepScreenSizeType;\r\n\r\n @Input() viewType: PepGroupButtonsViewType = 'regular';\r\n @Input() styleType: PepStyleType = 'weak';\r\n @Input() sizeType: PepSizeType = 'md';\r\n @Input() buttons: Array<PepButton> = [];\r\n @Input() buttonsDisabled = false;\r\n @Input() selectedButtonKey = '';\r\n @Input() stretch = false;\r\n\r\n @Output()\r\n buttonClick: EventEmitter<IPepButtonClickEvent> = new EventEmitter<IPepButtonClickEvent>();\r\n\r\n\r\n constructor(public layoutService: PepLayoutService) {\r\n this.layoutService.onResize$.subscribe((size) => {\r\n this.screenSize = size;\r\n });\r\n }\r\n\r\n ngOnDestroy(): void {\r\n // if (this.buttonClick) {\r\n // this.buttonClick.unsubscribe();\r\n // }\r\n }\r\n\r\n onButtonClicked(event: Event, button: PepButton): void {\r\n this.selectedButtonKey = button?.key;\r\n\r\n const buttonClick = {\r\n source: button,\r\n event,\r\n };\r\n\r\n if (button?.callback) {\r\n button.callback(buttonClick);\r\n } else {\r\n this.buttonClick.emit(buttonClick);\r\n }\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { MatCommonModule } from '@angular/material/core';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatMenuModule } from '@angular/material/menu';\r\nimport { MatIconModule } from '@angular/material/icon';\r\n\r\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\r\nimport {\r\n PepIconModule,\r\n PepIconRegistry,\r\n pepIconArrowUp,\r\n pepIconArrowDown,\r\n} from '@pepperi-addons/ngx-lib/icon';\r\n\r\nimport { PepGroupButtonsComponent } from './group-buttons.component';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n // Material modules\r\n MatCommonModule,\r\n MatFormFieldModule,\r\n MatButtonModule,\r\n MatMenuModule,\r\n MatIconModule,\r\n // ngx-lib modules\r\n PepNgxLibModule,\r\n PepIconModule,\r\n ],\r\n exports: [PepGroupButtonsComponent],\r\n declarations: [PepGroupButtonsComponent],\r\n})\r\nexport class PepGroupButtonsModule {\r\n constructor(private pepIconRegistry: PepIconRegistry) {\r\n this.pepIconRegistry.registerIcons([pepIconArrowUp, pepIconArrowDown]);\r\n }\r\n}\r\n","/\r\n Public API Surface of ngx-lib/group-buttons\r\n /\r\nexport from './group-buttons.module';\r\nexport * from './group-buttons.component';\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;MAqBa,wBAAwB;IAgBjC,YAAmB,aAA+B;QAA/B,kBAAa,GAAb,aAAa,CAAkB;QAflD,sBAAiB,GAAG,iBAAiB,CAAC;QAG7B,aAAQ,GAA4B,SAAS,CAAC;QAC9C,cAAS,GAAiB,MAAM,CAAC;QACjC,aAAQ,GAAgB,IAAI,CAAC;QAC7B,YAAO,GAAqB,EAAE,CAAC;QAC/B,oBAAe,GAAG,KAAK,CAAC;QACxB,sBAAiB,GAAG,EAAE,CAAC;QACvB,YAAO,GAAG,KAAK,CAAC;QAGzB,gBAAW,GAAuC,IAAI,YAAY,EAAwB,CAAC;QAIvF,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,IAAI;YACxC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;SAC1B,CAAC,CAAC;KACN;IAED,WAAW;;;;KAIV;IAED,eAAe,CAAC,KAAY,EAAE,MAAiB;QAC3C,IAAI,CAAC,iBAAiB,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,CAAC;QAErC,MAAM,WAAW,GAAG;YAChB,MAAM,EAAE,MAAM;YACd,KAAK;SACR,CAAC;QAEF,IAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,EAAE;YAClB,MAAM,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;SAChC;aAAM;YACH,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;SACtC;KACJ;;;YA9CJ,SAAS,SAAC;gBACP,QAAQ,EAAE,mBAAmB;gBAC7B,6nJAA6C;;aAEhD;;;YAZG,gBAAgB;;;uBAiBf,KAAK;wBACL,KAAK;uBACL,KAAK;sBACL,KAAK;8BACL,KAAK;gCACL,KAAK;sBACL,KAAK;0BAEL,MAAM;;;MCEE,qBAAqB;IAC9B,YAAoB,eAAgC;QAAhC,oBAAe,GAAf,eAAe,CAAiB;QAChD,IAAI,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC,cAAc,EAAE,gBAAgB,CAAC,CAAC,CAAC;KAC1E;;;YAnBJ,QAAQ,SAAC;gBACN,OAAO,EAAE;oBACL,YAAY;;oBAEZ,eAAe;oBACf,kBAAkB;oBAClB,eAAe;oBACf,aAAa;oBACb,aAAa;;oBAEb,eAAe;oBACf,aAAa;iBAChB;gBACD,OAAO,EAAE,CAAC,wBAAwB,CAAC;gBACnC,YAAY,EAAE,CAAC,wBAAwB,CAAC;aAC3C;;;YAtBG,eAAe;;;ACZnB;;;;ACAA;;;;;;"}
1	+ {"version":3,"file":"pepperi-addons-ngx-lib-group-buttons.js","sources":["../../../projects/ngx-lib/group-buttons/group-buttons.component.ts","../../../projects/ngx-lib/group-buttons/group-buttons.module.ts","../../../projects/ngx-lib/group-buttons/public-api.ts","../../../projects/ngx-lib/group-buttons/pepperi-addons-ngx-lib-group-buttons.ts"],"sourcesContent":["import {\r\n Component,\r\n OnDestroy,\r\n Input,\r\n Output,\r\n EventEmitter,\r\n} from '@angular/core';\r\nimport {\r\n PepLayoutService, PepScreenSizeType, PepStyleType, PepSizeType\r\n} from '@pepperi-addons/ngx-lib';\r\nimport {\r\n PepButton,\r\n IPepButtonClickEvent,\r\n} from '@pepperi-addons/ngx-lib/button';\r\n\r\nexport type PepGroupButtonsViewType = 'regular' \| 'dropdown' \| 'split' \| 'toggle';\r\n@Component({\r\n selector: 'pep-group-buttons',\r\n templateUrl: './group-buttons.component.html',\r\n styleUrls: ['./group-buttons.component.scss', './group-buttons.component.theme.scss'],\r\n})\r\nexport class PepGroupButtonsComponent implements OnDestroy {\r\n PepScreenSizeType = PepScreenSizeType;\r\n screenSize: PepScreenSizeType;\r\n\r\n @Input() viewType: PepGroupButtonsViewType = 'regular';\r\n @Input() styleType: PepStyleType = 'weak';\r\n @Input() sizeType: PepSizeType = 'md';\r\n @Input() buttons: Array<PepButton> = [];\r\n @Input() buttonsDisabled = false;\r\n @Input() selectedButtonKey = '';\r\n @Input() stretch = false;\r\n\r\n @Output()\r\n buttonClick: EventEmitter<IPepButtonClickEvent> = new EventEmitter<IPepButtonClickEvent>();\r\n\r\n\r\n constructor(public layoutService: PepLayoutService) {\r\n this.layoutService.onResize$.subscribe((size) => {\r\n this.screenSize = size;\r\n });\r\n }\r\n\r\n ngOnDestroy(): void {\r\n // if (this.buttonClick) {\r\n // this.buttonClick.unsubscribe();\r\n // }\r\n }\r\n\r\n onButtonClicked(event: Event, button: PepButton): void {\r\n this.selectedButtonKey = button?.key;\r\n\r\n const buttonClick = {\r\n source: button,\r\n event,\r\n };\r\n\r\n if (button?.callback) {\r\n button.callback(buttonClick);\r\n } else {\r\n this.buttonClick.emit(buttonClick);\r\n }\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { MatCommonModule } from '@angular/material/core';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatMenuModule } from '@angular/material/menu';\r\nimport { MatIconModule } from '@angular/material/icon';\r\n\r\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\r\nimport {\r\n PepIconModule,\r\n PepIconRegistry,\r\n pepIconArrowUp,\r\n pepIconArrowDown,\r\n} from '@pepperi-addons/ngx-lib/icon';\r\n\r\nimport { PepGroupButtonsComponent } from './group-buttons.component';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n // Material modules\r\n MatCommonModule,\r\n MatFormFieldModule,\r\n MatButtonModule,\r\n MatMenuModule,\r\n MatIconModule,\r\n // ngx-lib modules\r\n PepNgxLibModule,\r\n PepIconModule,\r\n ],\r\n exports: [PepGroupButtonsComponent],\r\n declarations: [PepGroupButtonsComponent],\r\n})\r\nexport class PepGroupButtonsModule {\r\n constructor(private pepIconRegistry: PepIconRegistry) {\r\n this.pepIconRegistry.registerIcons([pepIconArrowUp, pepIconArrowDown]);\r\n }\r\n}\r\n","/\r\n Public API Surface of ngx-lib/group-buttons\r\n /\r\nexport from './group-buttons.module';\r\nexport * from './group-buttons.component';\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;MAqBa,wBAAwB;IAgBjC,YAAmB,aAA+B;QAA/B,kBAAa,GAAb,aAAa,CAAkB;QAflD,sBAAiB,GAAG,iBAAiB,CAAC;QAG7B,aAAQ,GAA4B,SAAS,CAAC;QAC9C,cAAS,GAAiB,MAAM,CAAC;QACjC,aAAQ,GAAgB,IAAI,CAAC;QAC7B,YAAO,GAAqB,EAAE,CAAC;QAC/B,oBAAe,GAAG,KAAK,CAAC;QACxB,sBAAiB,GAAG,EAAE,CAAC;QACvB,YAAO,GAAG,KAAK,CAAC;QAGzB,gBAAW,GAAuC,IAAI,YAAY,EAAwB,CAAC;QAIvF,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,IAAI;YACxC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;SAC1B,CAAC,CAAC;KACN;IAED,WAAW;;;;KAIV;IAED,eAAe,CAAC,KAAY,EAAE,MAAiB;QAC3C,IAAI,CAAC,iBAAiB,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,CAAC;QAErC,MAAM,WAAW,GAAG;YAChB,MAAM,EAAE,MAAM;YACd,KAAK;SACR,CAAC;QAEF,IAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,EAAE;YAClB,MAAM,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;SAChC;aAAM;YACH,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;SACtC;KACJ;;;YA9CJ,SAAS,SAAC;gBACP,QAAQ,EAAE,mBAAmB;gBAC7B,6nJAA6C;;aAEhD;;;YAZG,gBAAgB;;;uBAiBf,KAAK;wBACL,KAAK;uBACL,KAAK;sBACL,KAAK;8BACL,KAAK;gCACL,KAAK;sBACL,KAAK;0BAEL,MAAM;;;MCEE,qBAAqB;IAC9B,YAAoB,eAAgC;QAAhC,oBAAe,GAAf,eAAe,CAAiB;QAChD,IAAI,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC,cAAc,EAAE,gBAAgB,CAAC,CAAC,CAAC;KAC1E;;;YAnBJ,QAAQ,SAAC;gBACN,OAAO,EAAE;oBACL,YAAY;;oBAEZ,eAAe;oBACf,kBAAkB;oBAClB,eAAe;oBACf,aAAa;oBACb,aAAa;;oBAEb,eAAe;oBACf,aAAa;iBAChB;gBACD,OAAO,EAAE,CAAC,wBAAwB,CAAC;gBACnC,YAAY,EAAE,CAAC,wBAAwB,CAAC;aAC3C;;;YAtBG,eAAe;;;ACZnB;;;;ACAA;;;;;;"}

package/fesm2015/pepperi-addons-ngx-lib-image.js CHANGED Viewed

@@ -243,7 +243,7 @@ PepImageComponent.decorators = [
                 selector: 'pep-image',
                 template: "<ng-container [formGroup]=\"form\">\r\n    <ng-container>\r\n        <ng-template #readonlyTemplate>\r\n            <div class=\"img-wrapper\" [ngClass]=\"{\r\n                'left-alignment': xAlignment == 'left',\r\n                'right-alignment': xAlignment == 'right',\r\n                'center-alignment': xAlignment == 'center'\r\n            }\">\r\n                <img [id]=\"key\" [style.max-height]=\"fieldHeight\" class=\"pep-report-file\" [alt]=\"label\" [src]=\"src\"\r\n                    (click)=\"itemImageClick($event)\" (error)=\"errorHandler($event)\" (load)=\"onImageLoad($event)\" />\r\n            </div>\r\n        </ng-template>\r\n\r\n        <ng-container *ngIf=\"layoutType === 'form'\">\r\n            <pep-field-title *ngIf=\"renderTitle\" [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\"\r\n                [xAlignment]=\"xAlignment\" [showTitle]=\"showTitle\">\r\n            </pep-field-title>\r\n            <ng-container *ngIf=\"disabled || readonly; then disabledTemplate; else editableTemplate\"></ng-container>\r\n            <ng-template #disabledTemplate>\r\n                <div class=\"pep-file body-sm\" [style.height]=\"fieldHeight\" [ngClass]=\"{'one-row': rowSpan == 1}\">\r\n                    <ng-container *ngTemplateOutlet=\"readonlyTemplate\"></ng-container>\r\n                </div>\r\n            </ng-template>\r\n            <ng-template #editableTemplate>\r\n                <div class=\"pep-file-container image-container\" [ngClass]=\"{ 'one-row': rowSpan == 1}\">\r\n                    <pep-files-uploader [id]=\"key\" [key]=\"key\" [fieldHeight]=\"fieldHeight\" [layoutType]=\"layoutType\"\r\n                        [standAlone]=\"standAlone\" [src]=\"srcLarge || src\" [label]=\"label\" [mandatory]=\"mandatory\"\r\n                        [disabled]=\"disabled\" [xAlignment]=\"xAlignment\" [rowSpan]=\"rowSpan\" [controlType]=\"controlType\"\r\n                        [form]=\"form\" [acceptedExtensions]=\"acceptImagesType\" (fileChange)=\"onFileChanged($event)\"\r\n                        (elementClick)=\"onFileClicked($event)\" [sizeLimitMB]=\"sizeLimitMB\">\r\n                    </pep-files-uploader>\r\n                </div>\r\n            </ng-template>\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"layoutType === 'card'\">\r\n            <ng-container *ngTemplateOutlet=\"readonlyTemplate\"></ng-container>\r\n            <!-- <div class=\"img-wrapper\"\r\n                [ngClass]=\"{\r\n                    'left-alignment': xAlignment == 'left',\r\n                    'right-alignment': xAlignment == 'right',\r\n                    'center-alignment': xAlignment == 'center'\r\n                }\">\r\n                <img [id]=\"key\" [style.max-height]=\"fieldHeight\" class=\"pep-report-file\" [alt]=\"label\" [src]=\"src\"\r\n                    (click)=\"itemImageClick($event)\" (error)=\"errorHandler($event)\" />\r\n            </div> -->\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"layoutType === 'table'\">\r\n            <ng-container *ngTemplateOutlet=\"readonlyTemplate\"></ng-container>\r\n            <!-- <div class=\"img-wrapper\" [ngClass]=\"{\r\n                    'left-alignment': xAlignment == 'left',\r\n                    'right-alignment': xAlignment == 'right',\r\n                    'center-alignment': xAlignment == 'center'\r\n                }\">\r\n                <img [id]=\"key\" [style.max-height]=\"fieldHeight\" class=\"pep-report-file pep-report-img\"\r\n                    [ngClass]=\"['text-align-' + xAlignment]\" [alt]=\"label\" [src]=\"src\" (click)=\"itemImageClick($event)\"\r\n                    (error)=\"errorHandler($event)\" (load)=\"onImageLoad($event)\" />\r\n            </div> -->\r\n        </ng-container>\r\n    </ng-container>\r\n\r\n    <!-- Menu -->\r\n    <ng-container *ngIf=\"menuField\">\r\n        <button [id]=\"key\" (click)=\"onMenuClick($event)\" class=\"floating-field pep-button icon-button weak invert\"\r\n            [ngClass]=\"{\r\n                bottom: menuField?.Layout?.YAlignment == '2',\r\n                top: menuField?.Layout?.YAlignment == '1',\r\n                left: menuField?.Layout?.XAlignment == '1',\r\n                right: menuField?.Layout?.XAlignment == '2'\r\n            }\">\r\n            <mat-icon>\r\n                <pep-icon name=\"system_menu\"></pep-icon>\r\n            </mat-icon>\r\n        </button>\r\n    </ng-container>\r\n\r\n    <!-- Campaign -->\r\n    <ng-container *ngIf=\"hasCampaignField && hasCampaignField?.FormattedValue\">\r\n        <span [id]=\"key\" class=\"campaign floating-field\" title=\"{{ hasCampaignField?.FormattedValue }}\" [ngClass]=\"{\r\n                bottom: hasCampaignField?.Layout?.YAlignment == '2',\r\n                top: hasCampaignField?.Layout?.YAlignment == '1',\r\n                left: hasCampaignField?.Layout?.XAlignment == '1',\r\n                right: hasCampaignField?.Layout?.XAlignment == '2'\r\n            }\">\r\n            <mat-icon class=\"has-active-campaign\">\r\n                <pep-icon name=\"system_bolt\"></pep-icon>\r\n            </mat-icon>\r\n        </span>\r\n    </ng-container>\r\n\r\n    <!-- Indicators -->\r\n    <ng-container *ngIf=\"indicatorsField && indicatorsField?.FormattedValue != ''\">\r\n        <span [id]=\"key\" class=\"indicators-container floating-field\" [ngClass]=\"{\r\n                bottom: indicatorsField?.Layout?.YAlignment == '2',\r\n                top: indicatorsField?.Layout?.YAlignment == '1',\r\n                left: indicatorsField?.Layout?.XAlignment == '1',\r\n                right: indicatorsField?.Layout?.XAlignment == '2'\r\n            }\">\r\n            <mat-icon>\r\n                <ng-container *ngFor=\"let value of indicatorsField?.FormattedValue?.split(';')\">\r\n                    <pep-icon class=\"pull-left flip\" name=\"indicator_dot_placeholder\" [fill]=\"value\"></pep-icon>\r\n                </ng-container>\r\n                <ng-container *ngIf=\"indicatorsField?.FormattedValue?.split(';').length < 4\">\r\n                    <pep-icon class=\"pull-left flip\" name=\"indicator_dot_placeholder\"></pep-icon>\r\n                </ng-container>\r\n            </mat-icon>\r\n        </span>\r\n    </ng-container>\r\n</ng-container>",
                 changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [":host{width:100%;height:inherit;display:grid}:host>*{align-self:center}.img-wrapper{display:flex;align-items:center;height:100%;max-width:100%}.img-wrapper.left-alignment{justify-content:flex-start}.img-wrapper.center-alignment{justify-content:center}.img-wrapper.right-alignment{justify-content:flex-end}.img-wrapper img{max-width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.pep-file-container,.pepperi-file-container{height:100%}.pep-file-container .img-wrapper,.pepperi-file-container .img-wrapper{height:calc(100% - 1.5rem)}.pep-file-container img,.pepperi-file-container img{cursor:pointer}.indicators-container{padding:0!important}.indicators-container mat-icon{height:100%;width:100%;padding:.4rem}.indicators-container mat-icon pep-icon{height:.75rem!important;width:.75rem!important;margin:.05rem}.floating-field{width:2.5rem;height:2.5rem;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);padding:.5rem;cursor:pointer;position:absolute!important}.top{top:0}.bottom{bottom:0}.left{left:0}.right{right:0}"]
+                styles: [":host{width:100%;height:inherit;display:grid}:host>*{align-self:center}.img-wrapper{display:flex;align-items:center;height:100%;max-width:100%}.img-wrapper.left-alignment{justify-content:flex-start}.img-wrapper.center-alignment{justify-content:center}.img-wrapper.right-alignment{justify-content:flex-end}.img-wrapper img{max-width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.pep-file-container,.pepperi-file-container{height:100%}.pep-file-container .img-wrapper,.pepperi-file-container .img-wrapper{height:calc(100% - 1.5rem)}.pep-file-container img,.pepperi-file-container img{cursor:pointer}.indicators-container{padding:0!important}.indicators-container mat-icon{height:100%;width:100%;padding:.4rem}.indicators-container mat-icon pep-icon{height:.75rem!important;width:.75rem!important;margin:.05rem}.floating-field{width:2.5rem;height:2.5rem;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);padding:.5rem;cursor:pointer;position:absolute!important}.top{top:0}.bottom{bottom:0}.left{left:0}.right{right:0}", ".indicators-container .circle{box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.08);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.08);border:1px solid hsl(0,0%,calc(10% + 20%));border:1px solid hsl(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),calc(var(--pep-color-system-primary-l, 10%) + 20%))}.floating-field.has-active-campaign .svg-icon{fill:#e60000;fill:hsl(var(--pep-color-system-caution-h,360),var(--pep-color-system-caution-s,100%),var(--pep-color-system-caution-l,45%))}.floating-field.indicators-container{background:hsla(0,0%,100%,.5);background:hsla(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%),.5)}.floating-field.indicators-container:hover{cursor:inherit}.image-container .mat-form-field-disabled .mat-form-field-flex{background:transparent!important}"]
             },] }
 ];
 PepImageComponent.ctorParameters = () => [

package/fesm2015/pepperi-addons-ngx-lib-image.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pepperi-addons-ngx-lib-image.js","sources":["../../../projects/ngx-lib/image/image.service.ts","../../../projects/ngx-lib/image/image.component.ts","../../../projects/ngx-lib/image/image.module.ts","../../../projects/ngx-lib/image/public-api.ts","../../../projects/ngx-lib/image/pepperi-addons-ngx-lib-image.ts"],"sourcesContent":["import { Injectable, TemplateRef } from '@angular/core';\r\nimport {\r\n PepFileService,\r\n PepCustomizationService,\r\n IPepOption,\r\n} from '@pepperi-addons/ngx-lib';\r\nimport { PepDialogService } from '@pepperi-addons/ngx-lib/dialog';\r\nimport { PepImagesFilmstripComponent } from '@pepperi-addons/ngx-lib/images-filmstrip';\r\nimport { IPepFileChangeEvent } from '@pepperi-addons/ngx-lib/files-uploader';\r\n\r\n@Injectable({\r\n providedIn: 'root',\r\n})\r\nexport class PepImageService {\r\n constructor(\r\n private dialogService: PepDialogService,\r\n private customizationService: PepCustomizationService,\r\n private fileService: PepFileService,\r\n ) { }\r\n\r\n openImageDialog(imageSrc: string, options: IPepOption[], title = ''): void {\r\n const arr = [imageSrc].concat(\r\n (options \|\| []).map((opt) => opt.value)\r\n );\r\n const imagesValue = arr.join(';');\r\n\r\n // Show image in modal.\r\n const config = this.dialogService.getDialogConfig({}, 'inline');\r\n config.maxWidth = '75vw';\r\n config.height = '95vh';\r\n\r\n this.dialogService.openDialog(\r\n PepImagesFilmstripComponent,\r\n {\r\n currIndex: 0,\r\n key: new Date().getDate(),\r\n value: imagesValue,\r\n label: title,\r\n uid: '',\r\n showThumbnails: arr.length > 1,\r\n },\r\n config\r\n );\r\n }\r\n\r\n openFromURI(event: IPepFileChangeEvent) {\r\n if (event) {\r\n const fileStrArr = event.fileStr.split(';');\r\n if (fileStrArr.length === 2) {\r\n const win = window.open('', '_blank');\r\n const contentType = fileStrArr[0].split(':')[1];\r\n const base64 = fileStrArr[1].split(',')[1];\r\n const blob = this.fileService.convertFromb64toBlob(\r\n base64,\r\n contentType\r\n );\r\n const url = URL.createObjectURL(blob);\r\n win.location.href = url;\r\n }\r\n }\r\n }\r\n}\r\n","import {\r\n Component,\r\n OnInit,\r\n OnChanges,\r\n Input,\r\n Output,\r\n EventEmitter,\r\n ChangeDetectorRef,\r\n ChangeDetectionStrategy,\r\n ElementRef,\r\n OnDestroy,\r\n Renderer2,\r\n Optional,\r\n} from '@angular/core';\r\nimport { FormGroup } from '@angular/forms';\r\nimport { TranslateService } from '@ngx-translate/core';\r\nimport {\r\n PepFileService,\r\n PepLayoutType,\r\n PepCustomizationService,\r\n PepHorizontalAlignment,\r\n DEFAULT_HORIZONTAL_ALIGNMENT,\r\n IPepFieldClickEvent,\r\n IPepOption,\r\n PepImageField,\r\n} from '@pepperi-addons/ngx-lib';\r\n\r\nimport { pepIconNoImage2 } from '@pepperi-addons/ngx-lib/icon';\r\nimport { PepImageService } from './image.service';\r\nimport { IPepFileChangeEvent } from '@pepperi-addons/ngx-lib/files-uploader';\r\n\r\n@Component({\r\n selector: 'pep-image',\r\n templateUrl: './image.component.html',\r\n styleUrls: ['./image.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class PepImageComponent implements OnChanges, OnInit, OnDestroy {\r\n public static MENU_CLICKED = '[MenuClicked]';\r\n\r\n @Input() key = '';\r\n @Input() srcLarge = '';\r\n @Input() src = '';\r\n @Input() options: IPepOption[] = [];\r\n @Input() label = '';\r\n // @Input() type = 'image';\r\n @Input() mandatory = false;\r\n @Input() disabled = false;\r\n @Input() readonly = false;\r\n @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\r\n\r\n private _rowSpan = 1;\r\n @Input()\r\n set rowSpan(value) {\r\n this._rowSpan = value;\r\n this.setFieldHeight();\r\n }\r\n get rowSpan(): number {\r\n return this._rowSpan;\r\n }\r\n\r\n @Input() indicatorsField: any = null;\r\n @Input() menuField: any = null;\r\n @Input() hasCampaignField: any = null;\r\n\r\n private _visible = true;\r\n @Input()\r\n set visible(visible: boolean) {\r\n this._visible = visible;\r\n if (visible) {\r\n this.renderer.removeClass(\r\n this.element.nativeElement,\r\n 'hidden-element'\r\n );\r\n } else {\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n 'hidden-element'\r\n );\r\n }\r\n }\r\n get visible(): boolean {\r\n return this._visible;\r\n }\r\n\r\n controlType = 'image';\r\n\r\n @Input() form: FormGroup = null;\r\n @Input() uid = '';\r\n @Input() showTitle = true;\r\n @Input() renderTitle = true;\r\n\r\n private _layoutType: PepLayoutType = 'form';\r\n @Input()\r\n set layoutType(value: PepLayoutType) {\r\n this._layoutType = value;\r\n this.setFieldHeight();\r\n }\r\n get layoutType(): PepLayoutType {\r\n return this._layoutType;\r\n }\r\n\r\n @Input() isActive = false;\r\n @Input() sizeLimitMB = 5;\r\n @Input() acceptImagesType = 'bmp,jpg,jpeg,png,gif'; // \"image/bmp, image/jpg, image/jpeg, image/png, image/tif, image/tiff\";\r\n\r\n @Output()\r\n fileChange: EventEmitter<any> = new EventEmitter<any>();\r\n\r\n @Output()\r\n elementClick: EventEmitter<IPepFieldClickEvent> = new EventEmitter<IPepFieldClickEvent>();\r\n\r\n fieldHeight = '';\r\n standAlone = false;\r\n dataURI = null;\r\n\r\n constructor(\r\n private imageService: PepImageService,\r\n private customizationService: PepCustomizationService,\r\n private fileService: PepFileService,\r\n private renderer: Renderer2,\r\n private element: ElementRef,\r\n private translate: TranslateService\r\n ) { }\r\n\r\n ngOnInit(): void {\r\n if (this.form === null) {\r\n this.standAlone = true;\r\n this.setFieldHeight();\r\n this.setDefaultForm();\r\n\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME\r\n );\r\n\r\n if (!this.renderTitle) {\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n PepCustomizationService.STAND_ALONE_FIELD_NO_SPACING_CLASS_NAME\r\n );\r\n }\r\n }\r\n }\r\n\r\n private setFieldHeight(): void {\r\n this.fieldHeight = this.customizationService.calculateFieldHeight(\r\n this.layoutType,\r\n this.rowSpan,\r\n this.standAlone\r\n );\r\n }\r\n\r\n private setDefaultForm(): void {\r\n const pepField = new PepImageField({\r\n key: this.key,\r\n value: this.src,\r\n mandatory: this.mandatory,\r\n readonly: this.readonly,\r\n disabled: this.disabled,\r\n });\r\n this.form = this.customizationService.getDefaultFromGroup(pepField);\r\n }\r\n\r\n ngOnChanges(changes: any): void {\r\n if (this.standAlone) {\r\n this.setDefaultForm();\r\n }\r\n\r\n if (changes.src?.currentValue?.length > 0) {\r\n // Empty dataURI if there is change in the src.\r\n this.dataURI = null;\r\n }\r\n }\r\n\r\n ngOnDestroy(): void {\r\n //\r\n }\r\n\r\n errorHandler(event: any): void {\r\n event.target.src = this.fileService.getSvgAsImageSrc(\r\n pepIconNoImage2.data\r\n );\r\n event.target.title = this.translate.instant('IMAGE.NO_IMAGE');\r\n }\r\n\r\n onImageLoad(event: any): void {\r\n event.target.style.visibility = 'visible';\r\n event.target.title =\r\n event.target.title.length === 0\r\n ? this.translate.instant('IMAGE.CLICK_TO_ENLARGE')\r\n : event.target.title;\r\n }\r\n\r\n onMenuClick(event: any): void {\r\n this.elementClick.emit({\r\n key: this.key,\r\n value: PepImageComponent.MENU_CLICKED,\r\n controlType: this.controlType,\r\n eventWhich: event.which,\r\n });\r\n }\r\n\r\n onFileChanged(fileData: IPepFileChangeEvent): void {\r\n this.dataURI = fileData;\r\n this.src = this.srcLarge =\r\n this.standAlone && this.dataURI ? this.dataURI.fileStr : '';\r\n\r\n this.customizationService.updateFormFieldValue(\r\n this.form,\r\n this.key,\r\n this.dataURI ? this.dataURI.fileExt : ''\r\n );\r\n // this.valueChange.emit({\r\n // key: this.key,\r\n // value,\r\n // });\r\n\r\n this.fileChange.emit(fileData);\r\n // this.fileChange.emit(value.length > 0 ? JSON.parse(value) : value);\r\n }\r\n\r\n objectIdIsNotEmpty(): boolean {\r\n return this.uid?.length > 0 && this.uid !== '0';\r\n }\r\n\r\n onFileClicked(event: IPepFieldClickEvent): void {\r\n let hasParentImage = true;\r\n if (\r\n // this.objectIdIsNotEmpty() &&\r\n this.src &&\r\n this.src.indexOf('no-image') > -1\r\n ) {\r\n hasParentImage = false;\r\n }\r\n\r\n this.elementClick.emit(event);\r\n }\r\n\r\n itemImageClick(event: any): void {\r\n let hasParentImage = true;\r\n const elemTarget = event.target \|\| event.srcElement;\r\n const nextElement = elemTarget.nextElementSibling \|\| null;\r\n const imageSRC = elemTarget.src \|\| null;\r\n const nextElementSRC =\r\n nextElement && nextElement.src ? nextElement.src : null;\r\n\r\n if (\r\n (imageSRC && imageSRC.indexOf('no-image') > -1) \|\|\r\n (nextElementSRC && nextElementSRC.src.indexOf('no-image') > -1)\r\n ) {\r\n hasParentImage = false;\r\n }\r\n\r\n // this.openImageModal(hasParentImage);\r\n // if (this.dataURI) {\r\n // this.imageService.openFromURI(this.dataURI);\r\n // } else {\r\n // this.imageService.openImageDialog(this.srcLarge \|\| this.src, this.options, this.label);\r\n // }\r\n\r\n this.elementClick.emit({\r\n key: this.key,\r\n controlType: this.controlType,\r\n eventWhich: event.which,\r\n otherData: {\r\n imageSrc: this.srcLarge \|\| this.src,\r\n options: this.options,\r\n title: this.label\r\n }\r\n });\r\n }\r\n\r\n // openImageModal(hasParentImage: boolean): void {\r\n // if (this.dataURI) {\r\n // const fileStrArr = this.dataURI.fileStr.split(';');\r\n // if (fileStrArr.length === 2) {\r\n // const win = window.open('', '_blank');\r\n // const contentType = fileStrArr[0].split(':')[1];\r\n // const base64 = fileStrArr[1].split(',')[1];\r\n // const blob = this.fileService.convertFromb64toBlob(\r\n // base64,\r\n // contentType\r\n // );\r\n // const url = URL.createObjectURL(blob);\r\n // win.location.href = url;\r\n // }\r\n // } else {\r\n // const arr = [this.srcLarge \|\| this.src].concat(\r\n // (this.options \|\| []).map((opt) => opt.value)\r\n // );\r\n // const imagesValue = arr.join(';');\r\n\r\n // // Show image in modal.\r\n // const config = this.dialogService.getDialogConfig({}, 'inline');\r\n // config.maxWidth = '75vw';\r\n // config.height = '95vh';\r\n\r\n // this.dialogService.openDialog(\r\n // PepImagesFilmstripComponent,\r\n // {\r\n // currIndex: 0,\r\n // key: this.key,\r\n // value: imagesValue,\r\n // label: this.label,\r\n // uid: this.uid,\r\n // showThumbnails: arr.length > 1,\r\n // },\r\n // config\r\n // );\r\n // }\r\n // }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ReactiveFormsModule } from '@angular/forms';\r\n\r\nimport { MatCommonModule } from '@angular/material/core';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\n\r\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\r\nimport {\r\n PepIconModule,\r\n PepIconRegistry,\r\n pepIconSystemMenu,\r\n pepIconSystemBolt,\r\n pepIconIndicatorDotPlaceholder,\r\n} from '@pepperi-addons/ngx-lib/icon';\r\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\r\nimport { PepFilesUploaderModule } from '@pepperi-addons/ngx-lib/files-uploader';\r\nimport {\r\n PepImagesFilmstripModule,\r\n PepImagesFilmstripComponent,\r\n} from '@pepperi-addons/ngx-lib/images-filmstrip';\r\n\r\nimport { PepImageComponent } from './image.component';\r\nimport { PepImageService } from './image.service';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n ReactiveFormsModule,\r\n // Material modules,\r\n MatCommonModule,\r\n MatFormFieldModule,\r\n MatIconModule,\r\n // ngx-lib modules\r\n PepNgxLibModule,\r\n PepIconModule,\r\n PepFieldTitleModule,\r\n PepImagesFilmstripModule,\r\n PepFilesUploaderModule,\r\n ],\r\n exports: [PepImageComponent],\r\n declarations: [PepImageComponent],\r\n entryComponents: [PepImagesFilmstripComponent],\r\n providers: [PepImageService]\r\n})\r\nexport class PepImageModule {\r\n constructor(private pepIconRegistry: PepIconRegistry) {\r\n this.pepIconRegistry.registerIcons([\r\n pepIconSystemMenu,\r\n pepIconSystemBolt,\r\n pepIconIndicatorDotPlaceholder,\r\n ]);\r\n }\r\n}\r\n","/\r\n Public API Surface of ngx-lib/image\r\n /\r\nexport from './image.module';\r\nexport * from './image.component';\r\nexport * from './image.service';\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"pepperi-addons-ngx-lib-image.js","sources":["../../../projects/ngx-lib/image/image.service.ts","../../../projects/ngx-lib/image/image.component.ts","../../../projects/ngx-lib/image/image.module.ts","../../../projects/ngx-lib/image/public-api.ts","../../../projects/ngx-lib/image/pepperi-addons-ngx-lib-image.ts"],"sourcesContent":["import { Injectable, TemplateRef } from '@angular/core';\r\nimport {\r\n PepFileService,\r\n PepCustomizationService,\r\n IPepOption,\r\n} from '@pepperi-addons/ngx-lib';\r\nimport { PepDialogService } from '@pepperi-addons/ngx-lib/dialog';\r\nimport { PepImagesFilmstripComponent } from '@pepperi-addons/ngx-lib/images-filmstrip';\r\nimport { IPepFileChangeEvent } from '@pepperi-addons/ngx-lib/files-uploader';\r\n\r\n@Injectable({\r\n providedIn: 'root',\r\n})\r\nexport class PepImageService {\r\n constructor(\r\n private dialogService: PepDialogService,\r\n private customizationService: PepCustomizationService,\r\n private fileService: PepFileService,\r\n ) { }\r\n\r\n openImageDialog(imageSrc: string, options: IPepOption[], title = ''): void {\r\n const arr = [imageSrc].concat(\r\n (options \|\| []).map((opt) => opt.value)\r\n );\r\n const imagesValue = arr.join(';');\r\n\r\n // Show image in modal.\r\n const config = this.dialogService.getDialogConfig({}, 'inline');\r\n config.maxWidth = '75vw';\r\n config.height = '95vh';\r\n\r\n this.dialogService.openDialog(\r\n PepImagesFilmstripComponent,\r\n {\r\n currIndex: 0,\r\n key: new Date().getDate(),\r\n value: imagesValue,\r\n label: title,\r\n uid: '',\r\n showThumbnails: arr.length > 1,\r\n },\r\n config\r\n );\r\n }\r\n\r\n openFromURI(event: IPepFileChangeEvent) {\r\n if (event) {\r\n const fileStrArr = event.fileStr.split(';');\r\n if (fileStrArr.length === 2) {\r\n const win = window.open('', '_blank');\r\n const contentType = fileStrArr[0].split(':')[1];\r\n const base64 = fileStrArr[1].split(',')[1];\r\n const blob = this.fileService.convertFromb64toBlob(\r\n base64,\r\n contentType\r\n );\r\n const url = URL.createObjectURL(blob);\r\n win.location.href = url;\r\n }\r\n }\r\n }\r\n}\r\n","import {\r\n Component,\r\n OnInit,\r\n OnChanges,\r\n Input,\r\n Output,\r\n EventEmitter,\r\n ChangeDetectorRef,\r\n ChangeDetectionStrategy,\r\n ElementRef,\r\n OnDestroy,\r\n Renderer2,\r\n Optional,\r\n} from '@angular/core';\r\nimport { FormGroup } from '@angular/forms';\r\nimport { TranslateService } from '@ngx-translate/core';\r\nimport {\r\n PepFileService,\r\n PepLayoutType,\r\n PepCustomizationService,\r\n PepHorizontalAlignment,\r\n DEFAULT_HORIZONTAL_ALIGNMENT,\r\n IPepFieldClickEvent,\r\n IPepOption,\r\n PepImageField,\r\n} from '@pepperi-addons/ngx-lib';\r\n\r\nimport { pepIconNoImage2 } from '@pepperi-addons/ngx-lib/icon';\r\nimport { PepImageService } from './image.service';\r\nimport { IPepFileChangeEvent } from '@pepperi-addons/ngx-lib/files-uploader';\r\n\r\n@Component({\r\n selector: 'pep-image',\r\n templateUrl: './image.component.html',\r\n styleUrls: ['./image.component.scss', './image.component.theme.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class PepImageComponent implements OnChanges, OnInit, OnDestroy {\r\n public static MENU_CLICKED = '[MenuClicked]';\r\n\r\n @Input() key = '';\r\n @Input() srcLarge = '';\r\n @Input() src = '';\r\n @Input() options: IPepOption[] = [];\r\n @Input() label = '';\r\n // @Input() type = 'image';\r\n @Input() mandatory = false;\r\n @Input() disabled = false;\r\n @Input() readonly = false;\r\n @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\r\n\r\n private _rowSpan = 1;\r\n @Input()\r\n set rowSpan(value) {\r\n this._rowSpan = value;\r\n this.setFieldHeight();\r\n }\r\n get rowSpan(): number {\r\n return this._rowSpan;\r\n }\r\n\r\n @Input() indicatorsField: any = null;\r\n @Input() menuField: any = null;\r\n @Input() hasCampaignField: any = null;\r\n\r\n private _visible = true;\r\n @Input()\r\n set visible(visible: boolean) {\r\n this._visible = visible;\r\n if (visible) {\r\n this.renderer.removeClass(\r\n this.element.nativeElement,\r\n 'hidden-element'\r\n );\r\n } else {\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n 'hidden-element'\r\n );\r\n }\r\n }\r\n get visible(): boolean {\r\n return this._visible;\r\n }\r\n\r\n controlType = 'image';\r\n\r\n @Input() form: FormGroup = null;\r\n @Input() uid = '';\r\n @Input() showTitle = true;\r\n @Input() renderTitle = true;\r\n\r\n private _layoutType: PepLayoutType = 'form';\r\n @Input()\r\n set layoutType(value: PepLayoutType) {\r\n this._layoutType = value;\r\n this.setFieldHeight();\r\n }\r\n get layoutType(): PepLayoutType {\r\n return this._layoutType;\r\n }\r\n\r\n @Input() isActive = false;\r\n @Input() sizeLimitMB = 5;\r\n @Input() acceptImagesType = 'bmp,jpg,jpeg,png,gif'; // \"image/bmp, image/jpg, image/jpeg, image/png, image/tif, image/tiff\";\r\n\r\n @Output()\r\n fileChange: EventEmitter<any> = new EventEmitter<any>();\r\n\r\n @Output()\r\n elementClick: EventEmitter<IPepFieldClickEvent> = new EventEmitter<IPepFieldClickEvent>();\r\n\r\n fieldHeight = '';\r\n standAlone = false;\r\n dataURI = null;\r\n\r\n constructor(\r\n private imageService: PepImageService,\r\n private customizationService: PepCustomizationService,\r\n private fileService: PepFileService,\r\n private renderer: Renderer2,\r\n private element: ElementRef,\r\n private translate: TranslateService\r\n ) { }\r\n\r\n ngOnInit(): void {\r\n if (this.form === null) {\r\n this.standAlone = true;\r\n this.setFieldHeight();\r\n this.setDefaultForm();\r\n\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME\r\n );\r\n\r\n if (!this.renderTitle) {\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n PepCustomizationService.STAND_ALONE_FIELD_NO_SPACING_CLASS_NAME\r\n );\r\n }\r\n }\r\n }\r\n\r\n private setFieldHeight(): void {\r\n this.fieldHeight = this.customizationService.calculateFieldHeight(\r\n this.layoutType,\r\n this.rowSpan,\r\n this.standAlone\r\n );\r\n }\r\n\r\n private setDefaultForm(): void {\r\n const pepField = new PepImageField({\r\n key: this.key,\r\n value: this.src,\r\n mandatory: this.mandatory,\r\n readonly: this.readonly,\r\n disabled: this.disabled,\r\n });\r\n this.form = this.customizationService.getDefaultFromGroup(pepField);\r\n }\r\n\r\n ngOnChanges(changes: any): void {\r\n if (this.standAlone) {\r\n this.setDefaultForm();\r\n }\r\n\r\n if (changes.src?.currentValue?.length > 0) {\r\n // Empty dataURI if there is change in the src.\r\n this.dataURI = null;\r\n }\r\n }\r\n\r\n ngOnDestroy(): void {\r\n //\r\n }\r\n\r\n errorHandler(event: any): void {\r\n event.target.src = this.fileService.getSvgAsImageSrc(\r\n pepIconNoImage2.data\r\n );\r\n event.target.title = this.translate.instant('IMAGE.NO_IMAGE');\r\n }\r\n\r\n onImageLoad(event: any): void {\r\n event.target.style.visibility = 'visible';\r\n event.target.title =\r\n event.target.title.length === 0\r\n ? this.translate.instant('IMAGE.CLICK_TO_ENLARGE')\r\n : event.target.title;\r\n }\r\n\r\n onMenuClick(event: any): void {\r\n this.elementClick.emit({\r\n key: this.key,\r\n value: PepImageComponent.MENU_CLICKED,\r\n controlType: this.controlType,\r\n eventWhich: event.which,\r\n });\r\n }\r\n\r\n onFileChanged(fileData: IPepFileChangeEvent): void {\r\n this.dataURI = fileData;\r\n this.src = this.srcLarge =\r\n this.standAlone && this.dataURI ? this.dataURI.fileStr : '';\r\n\r\n this.customizationService.updateFormFieldValue(\r\n this.form,\r\n this.key,\r\n this.dataURI ? this.dataURI.fileExt : ''\r\n );\r\n // this.valueChange.emit({\r\n // key: this.key,\r\n // value,\r\n // });\r\n\r\n this.fileChange.emit(fileData);\r\n // this.fileChange.emit(value.length > 0 ? JSON.parse(value) : value);\r\n }\r\n\r\n objectIdIsNotEmpty(): boolean {\r\n return this.uid?.length > 0 && this.uid !== '0';\r\n }\r\n\r\n onFileClicked(event: IPepFieldClickEvent): void {\r\n let hasParentImage = true;\r\n if (\r\n // this.objectIdIsNotEmpty() &&\r\n this.src &&\r\n this.src.indexOf('no-image') > -1\r\n ) {\r\n hasParentImage = false;\r\n }\r\n\r\n this.elementClick.emit(event);\r\n }\r\n\r\n itemImageClick(event: any): void {\r\n let hasParentImage = true;\r\n const elemTarget = event.target \|\| event.srcElement;\r\n const nextElement = elemTarget.nextElementSibling \|\| null;\r\n const imageSRC = elemTarget.src \|\| null;\r\n const nextElementSRC =\r\n nextElement && nextElement.src ? nextElement.src : null;\r\n\r\n if (\r\n (imageSRC && imageSRC.indexOf('no-image') > -1) \|\|\r\n (nextElementSRC && nextElementSRC.src.indexOf('no-image') > -1)\r\n ) {\r\n hasParentImage = false;\r\n }\r\n\r\n // this.openImageModal(hasParentImage);\r\n // if (this.dataURI) {\r\n // this.imageService.openFromURI(this.dataURI);\r\n // } else {\r\n // this.imageService.openImageDialog(this.srcLarge \|\| this.src, this.options, this.label);\r\n // }\r\n\r\n this.elementClick.emit({\r\n key: this.key,\r\n controlType: this.controlType,\r\n eventWhich: event.which,\r\n otherData: {\r\n imageSrc: this.srcLarge \|\| this.src,\r\n options: this.options,\r\n title: this.label\r\n }\r\n });\r\n }\r\n\r\n // openImageModal(hasParentImage: boolean): void {\r\n // if (this.dataURI) {\r\n // const fileStrArr = this.dataURI.fileStr.split(';');\r\n // if (fileStrArr.length === 2) {\r\n // const win = window.open('', '_blank');\r\n // const contentType = fileStrArr[0].split(':')[1];\r\n // const base64 = fileStrArr[1].split(',')[1];\r\n // const blob = this.fileService.convertFromb64toBlob(\r\n // base64,\r\n // contentType\r\n // );\r\n // const url = URL.createObjectURL(blob);\r\n // win.location.href = url;\r\n // }\r\n // } else {\r\n // const arr = [this.srcLarge \|\| this.src].concat(\r\n // (this.options \|\| []).map((opt) => opt.value)\r\n // );\r\n // const imagesValue = arr.join(';');\r\n\r\n // // Show image in modal.\r\n // const config = this.dialogService.getDialogConfig({}, 'inline');\r\n // config.maxWidth = '75vw';\r\n // config.height = '95vh';\r\n\r\n // this.dialogService.openDialog(\r\n // PepImagesFilmstripComponent,\r\n // {\r\n // currIndex: 0,\r\n // key: this.key,\r\n // value: imagesValue,\r\n // label: this.label,\r\n // uid: this.uid,\r\n // showThumbnails: arr.length > 1,\r\n // },\r\n // config\r\n // );\r\n // }\r\n // }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ReactiveFormsModule } from '@angular/forms';\r\n\r\nimport { MatCommonModule } from '@angular/material/core';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\n\r\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\r\nimport {\r\n PepIconModule,\r\n PepIconRegistry,\r\n pepIconSystemMenu,\r\n pepIconSystemBolt,\r\n pepIconIndicatorDotPlaceholder,\r\n} from '@pepperi-addons/ngx-lib/icon';\r\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\r\nimport { PepFilesUploaderModule } from '@pepperi-addons/ngx-lib/files-uploader';\r\nimport {\r\n PepImagesFilmstripModule,\r\n PepImagesFilmstripComponent,\r\n} from '@pepperi-addons/ngx-lib/images-filmstrip';\r\n\r\nimport { PepImageComponent } from './image.component';\r\nimport { PepImageService } from './image.service';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n ReactiveFormsModule,\r\n // Material modules,\r\n MatCommonModule,\r\n MatFormFieldModule,\r\n MatIconModule,\r\n // ngx-lib modules\r\n PepNgxLibModule,\r\n PepIconModule,\r\n PepFieldTitleModule,\r\n PepImagesFilmstripModule,\r\n PepFilesUploaderModule,\r\n ],\r\n exports: [PepImageComponent],\r\n declarations: [PepImageComponent],\r\n entryComponents: [PepImagesFilmstripComponent],\r\n providers: [PepImageService]\r\n})\r\nexport class PepImageModule {\r\n constructor(private pepIconRegistry: PepIconRegistry) {\r\n this.pepIconRegistry.registerIcons([\r\n pepIconSystemMenu,\r\n pepIconSystemBolt,\r\n pepIconIndicatorDotPlaceholder,\r\n ]);\r\n }\r\n}\r\n","/\r\n Public API Surface of ngx-lib/image\r\n /\r\nexport from './image.module';\r\nexport * from './image.component';\r\nexport * from './image.service';\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;MAaa,eAAe;IACxB,YACY,aAA+B,EAC/B,oBAA6C,EAC7C,WAA2B;QAF3B,kBAAa,GAAb,aAAa,CAAkB;QAC/B,yBAAoB,GAApB,oBAAoB,CAAyB;QAC7C,gBAAW,GAAX,WAAW,CAAgB;KAClC;IAEL,eAAe,CAAC,QAAgB,EAAE,OAAqB,EAAE,KAAK,GAAG,EAAE;QAC/D,MAAM,GAAG,GAAG,CAAC,QAAQ,CAAC,CAAC,MAAM,CACzB,CAAC,OAAO,IAAI,EAAE,EAAE,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK,CAAC,CAC1C,CAAC;QACF,MAAM,WAAW,GAAG,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;;QAGlC,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;QAChE,MAAM,CAAC,QAAQ,GAAG,MAAM,CAAC;QACzB,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC;QAEvB,IAAI,CAAC,aAAa,CAAC,UAAU,CACzB,2BAA2B,EAC3B;YACI,SAAS,EAAE,CAAC;YACZ,GAAG,EAAE,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE;YACzB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,KAAK;YACZ,GAAG,EAAE,EAAE;YACP,cAAc,EAAE,GAAG,CAAC,MAAM,GAAG,CAAC;SACjC,EACD,MAAM,CACT,CAAC;KACL;IAED,WAAW,CAAC,KAA0B;QAClC,IAAI,KAAK,EAAE;YACP,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YAC5C,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,EAAE;gBACzB,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;gBACtC,MAAM,WAAW,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;gBAChD,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC3C,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,oBAAoB,CAC9C,MAAM,EACN,WAAW,CACd,CAAC;gBACF,MAAM,GAAG,GAAG,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;gBACtC,GAAG,CAAC,QAAQ,CAAC,IAAI,GAAG,GAAG,CAAC;aAC3B;SACJ;KACJ;;;;YAlDJ,UAAU,SAAC;gBACR,UAAU,EAAE,MAAM;aACrB;;;YANQ,gBAAgB;YAHrB,uBAAuB;YADvB,cAAc;;;MCmCL,iBAAiB;IA+E1B,YACY,YAA6B,EAC7B,oBAA6C,EAC7C,WAA2B,EAC3B,QAAmB,EACnB,OAAmB,EACnB,SAA2B;QAL3B,iBAAY,GAAZ,YAAY,CAAiB;QAC7B,yBAAoB,GAApB,oBAAoB,CAAyB;QAC7C,gBAAW,GAAX,WAAW,CAAgB;QAC3B,aAAQ,GAAR,QAAQ,CAAW;QACnB,YAAO,GAAP,OAAO,CAAY;QACnB,cAAS,GAAT,SAAS,CAAkB;QAlF9B,QAAG,GAAG,EAAE,CAAC;QACT,aAAQ,GAAG,EAAE,CAAC;QACd,QAAG,GAAG,EAAE,CAAC;QACT,YAAO,GAAiB,EAAE,CAAC;QAC3B,UAAK,GAAG,EAAE,CAAC;;QAEX,cAAS,GAAG,KAAK,CAAC;QAClB,aAAQ,GAAG,KAAK,CAAC;QACjB,aAAQ,GAAG,KAAK,CAAC;QACjB,eAAU,GAA2B,4BAA4B,CAAC;QAEnE,aAAQ,GAAG,CAAC,CAAC;QAUZ,oBAAe,GAAQ,IAAI,CAAC;QAC5B,cAAS,GAAQ,IAAI,CAAC;QACtB,qBAAgB,GAAQ,IAAI,CAAC;QAE9B,aAAQ,GAAG,IAAI,CAAC;QAoBxB,gBAAW,GAAG,OAAO,CAAC;QAEb,SAAI,GAAc,IAAI,CAAC;QACvB,QAAG,GAAG,EAAE,CAAC;QACT,cAAS,GAAG,IAAI,CAAC;QACjB,gBAAW,GAAG,IAAI,CAAC;QAEpB,gBAAW,GAAkB,MAAM,CAAC;QAUnC,aAAQ,GAAG,KAAK,CAAC;QACjB,gBAAW,GAAG,CAAC,CAAC;QAChB,qBAAgB,GAAG,sBAAsB,CAAC;QAGnD,eAAU,GAAsB,IAAI,YAAY,EAAO,CAAC;QAGxD,iBAAY,GAAsC,IAAI,YAAY,EAAuB,CAAC;QAE1F,gBAAW,GAAG,EAAE,CAAC;QACjB,eAAU,GAAG,KAAK,CAAC;QACnB,YAAO,GAAG,IAAI,CAAC;KASV;IAvEL,IACI,OAAO,CAAC,KAAK;QACb,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QACtB,IAAI,CAAC,cAAc,EAAE,CAAC;KACzB;IACD,IAAI,OAAO;QACP,OAAO,IAAI,CAAC,QAAQ,CAAC;KACxB;IAOD,IACI,OAAO,CAAC,OAAgB;QACxB,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;QACxB,IAAI,OAAO,EAAE;YACT,IAAI,CAAC,QAAQ,CAAC,WAAW,CACrB,IAAI,CAAC,OAAO,CAAC,aAAa,EAC1B,gBAAgB,CACnB,CAAC;SACL;aAAM;YACH,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAClB,IAAI,CAAC,OAAO,CAAC,aAAa,EAC1B,gBAAgB,CACnB,CAAC;SACL;KACJ;IACD,IAAI,OAAO;QACP,OAAO,IAAI,CAAC,QAAQ,CAAC;KACxB;IAUD,IACI,UAAU,CAAC,KAAoB;QAC/B,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,cAAc,EAAE,CAAC;KACzB;IACD,IAAI,UAAU;QACV,OAAO,IAAI,CAAC,WAAW,CAAC;KAC3B;IAyBD,QAAQ;QACJ,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI,EAAE;YACpB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,IAAI,CAAC,cAAc,EAAE,CAAC;YACtB,IAAI,CAAC,cAAc,EAAE,CAAC;YAEtB,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAClB,IAAI,CAAC,OAAO,CAAC,aAAa,EAC1B,uBAAuB,CAAC,4BAA4B,CACvD,CAAC;YAEF,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;gBACnB,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAClB,IAAI,CAAC,OAAO,CAAC,aAAa,EAC1B,uBAAuB,CAAC,uCAAuC,CAClE,CAAC;aACL;SACJ;KACJ;IAEO,cAAc;QAClB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,oBAAoB,CAAC,oBAAoB,CAC7D,IAAI,CAAC,UAAU,EACf,IAAI,CAAC,OAAO,EACZ,IAAI,CAAC,UAAU,CAClB,CAAC;KACL;IAEO,cAAc;QAClB,MAAM,QAAQ,GAAG,IAAI,aAAa,CAAC;YAC/B,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,KAAK,EAAE,IAAI,CAAC,GAAG;YACf,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,oBAAoB,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC;KACvE;IAED,WAAW,CAAC,OAAY;;QACpB,IAAI,IAAI,CAAC,UAAU,EAAE;YACjB,IAAI,CAAC,cAAc,EAAE,CAAC;SACzB;QAED,IAAI,CAAA,MAAA,MAAA,OAAO,CAAC,GAAG,0CAAE,YAAY,0CAAE,MAAM,IAAG,CAAC,EAAE;;YAEvC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;SACvB;KACJ;IAED,WAAW;;KAEV;IAED,YAAY,CAAC,KAAU;QACnB,KAAK,CAAC,MAAM,CAAC,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAChD,eAAe,CAAC,IAAI,CACvB,CAAC;QACF,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;KACjE;IAED,WAAW,CAAC,KAAU;QAClB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,UAAU,GAAG,SAAS,CAAC;QAC1C,KAAK,CAAC,MAAM,CAAC,KAAK;YACd,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC;kBACzB,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,wBAAwB,CAAC;kBAChD,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;KAChC;IAED,WAAW,CAAC,KAAU;QAClB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;YACnB,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,KAAK,EAAE,iBAAiB,CAAC,YAAY;YACrC,WAAW,EAAE,IAAI,CAAC,WAAW;YAC7B,UAAU,EAAE,KAAK,CAAC,KAAK;SAC1B,CAAC,CAAC;KACN;IAED,aAAa,CAAC,QAA6B;QACvC,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC;QACxB,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,QAAQ;YACpB,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,GAAG,EAAE,CAAC;QAEhE,IAAI,CAAC,oBAAoB,CAAC,oBAAoB,CAC1C,IAAI,CAAC,IAAI,EACT,IAAI,CAAC,GAAG,EACR,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,GAAG,EAAE,CAC3C,CAAC;;;;;QAMF,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;;KAElC;IAED,kBAAkB;;QACd,OAAO,CAAA,MAAA,IAAI,CAAC,GAAG,0CAAE,MAAM,IAAG,CAAC,IAAI,IAAI,CAAC,GAAG,KAAK,GAAG,CAAC;KACnD;IAED,aAAa,CAAC,KAA0B;QACpC,IAAI,cAAc,GAAG,IAAI,CAAC;QAC1B;;QAEI,IAAI,CAAC,GAAG;YACR,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,EACnC;YACE,cAAc,GAAG,KAAK,CAAC;SAC1B;QAED,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACjC;IAED,cAAc,CAAC,KAAU;QACrB,IAAI,cAAc,GAAG,IAAI,CAAC;QAC1B,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,UAAU,CAAC;QACpD,MAAM,WAAW,GAAG,UAAU,CAAC,kBAAkB,IAAI,IAAI,CAAC;QAC1D,MAAM,QAAQ,GAAG,UAAU,CAAC,GAAG,IAAI,IAAI,CAAC;QACxC,MAAM,cAAc,GAChB,WAAW,IAAI,WAAW,CAAC,GAAG,GAAG,WAAW,CAAC,GAAG,GAAG,IAAI,CAAC;QAE5D,IACI,CAAC,QAAQ,IAAI,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;aAC7C,cAAc,IAAI,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EACjE;YACE,cAAc,GAAG,KAAK,CAAC;SAC1B;;;;;;;QASD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;YACnB,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,WAAW,EAAE,IAAI,CAAC,WAAW;YAC7B,UAAU,EAAE,KAAK,CAAC,KAAK;YACvB,SAAS,EAAE;gBACP,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,GAAG;gBACnC,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;aACpB;SACJ,CAAC,CAAC;KACN;;AAzOa,8BAAY,GAAG,eAAe,CAAC;;YAPhD,SAAS,SAAC;gBACP,QAAQ,EAAE,WAAW;gBACrB,+sMAAqC;gBAErC,eAAe,EAAE,uBAAuB,CAAC,MAAM;;aAClD;;;YARQ,eAAe;YATpB,uBAAuB;YAFvB,cAAc;YANd,SAAS;YAFT,UAAU;YAML,gBAAgB;;;kBAyBpB,KAAK;uBACL,KAAK;kBACL,KAAK;sBACL,KAAK;oBACL,KAAK;wBAEL,KAAK;uBACL,KAAK;uBACL,KAAK;yBACL,KAAK;sBAGL,KAAK;8BASL,KAAK;wBACL,KAAK;+BACL,KAAK;sBAGL,KAAK;mBAqBL,KAAK;kBACL,KAAK;wBACL,KAAK;0BACL,KAAK;yBAGL,KAAK;uBASL,KAAK;0BACL,KAAK;+BACL,KAAK;yBAEL,MAAM;2BAGN,MAAM;;;MC/DE,cAAc;IACvB,YAAoB,eAAgC;QAAhC,oBAAe,GAAf,eAAe,CAAiB;QAChD,IAAI,CAAC,eAAe,CAAC,aAAa,CAAC;YAC/B,iBAAiB;YACjB,iBAAiB;YACjB,8BAA8B;SACjC,CAAC,CAAC;KACN;;;YA3BJ,QAAQ,SAAC;gBACN,OAAO,EAAE;oBACL,YAAY;oBACZ,mBAAmB;;oBAEnB,eAAe;oBACf,kBAAkB;oBAClB,aAAa;;oBAEb,eAAe;oBACf,aAAa;oBACb,mBAAmB;oBACnB,wBAAwB;oBACxB,sBAAsB;iBACzB;gBACD,OAAO,EAAE,CAAC,iBAAiB,CAAC;gBAC5B,YAAY,EAAE,CAAC,iBAAiB,CAAC;gBACjC,eAAe,EAAE,CAAC,2BAA2B,CAAC;gBAC9C,SAAS,EAAE,CAAC,eAAe,CAAC;aAC/B;;;YAlCG,eAAe;;;ACXnB;;;;ACAA;;;;;;"}

package/fesm2015/pepperi-addons-ngx-lib-images-filmstrip.js CHANGED Viewed

@@ -302,7 +302,7 @@ PepImagesFilmstripComponent.decorators = [
                         deps: [TranslateService],
                     },
                 ],
-                styles: [":host{width:100%;height:inherit;display:block}:host>*{align-self:center}.gallery-dialog{height:inherit}.images-filmstrip-container,.images-filmstrip-container .img-wrapper,gallery{height:100%}gallery{direction:ltr;min-height:100%}.gallery-dialog-content gallery{min-width:65vw}.gallery-dialog-content ::ng-deep gallery-item gallery-image .g-image-item{background-size:content!important}.gallery-dialog-content ::ng-deep gallery-item .g-item-template ngx-imageviewer canvas{max-width:100%!important;max-height:100%!important}::ng-deep gallery-thumbs{margin:0 1rem 0 .5rem;margin:0 var(--pep-spacing-lg,1rem) 0 var(--pep-spacing-sm,.5rem)}::ng-deep gallery-thumbs gallery-thumb{padding:0!important;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);margin:.5rem 0;margin:var(--pep-spacing-sm,.5rem) 0}::ng-deep gallery-thumbs gallery-thumb .g-image-item{background-size:cover!important}::ng-deep gallery-item gallery-image .g-image-item{border-radius:.5rem;border-radius:var(--pep-border-radius-lg,.5rem)}::ng-deep gallery-item:hover{cursor:pointer}::ng-deep gallery-dots{position:absolute!important;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem)}::ng-deep gallery-dots.pep-button,::ng-deep gallery-dots.pepperi-button{display:flex!important}::ng-deep .img-container{display:flex;align-items:center}::ng-deep .g-nav-next,::ng-deep .g-nav-prev{width:2rem!important;height:2rem!important;padding:.25rem;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem)}::ng-deep .g-nav-next .mat-icon,::ng-deep .g-nav-prev .mat-icon{display:inline-block!important}::ng-deep .g-nav-prev{transform:translateY(-50%) perspective(1px) scaleX(-1)!important}.vertical-gallery ::ng-deep gallery-thumbs{margin:1rem 0 .5rem;margin:var(--pep-spacing-lg,1rem) 0 var(--pep-spacing-sm,.5rem) 0}.vertical-gallery ::ng-deep gallery-thumbs gallery-thumb{margin:0 .5rem;margin:0 var(--pep-spacing-sm,.5rem)}"]
+                styles: [":host{width:100%;height:inherit;display:block}:host>*{align-self:center}.gallery-dialog{height:inherit}.images-filmstrip-container,.images-filmstrip-container .img-wrapper,gallery{height:100%}gallery{direction:ltr;min-height:100%}.gallery-dialog-content gallery{min-width:65vw}.gallery-dialog-content ::ng-deep gallery-item gallery-image .g-image-item{background-size:content!important}.gallery-dialog-content ::ng-deep gallery-item .g-item-template ngx-imageviewer canvas{max-width:100%!important;max-height:100%!important}::ng-deep gallery-thumbs{margin:0 1rem 0 .5rem;margin:0 var(--pep-spacing-lg,1rem) 0 var(--pep-spacing-sm,.5rem)}::ng-deep gallery-thumbs gallery-thumb{padding:0!important;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);margin:.5rem 0;margin:var(--pep-spacing-sm,.5rem) 0}::ng-deep gallery-thumbs gallery-thumb .g-image-item{background-size:cover!important}::ng-deep gallery-item gallery-image .g-image-item{border-radius:.5rem;border-radius:var(--pep-border-radius-lg,.5rem)}::ng-deep gallery-item:hover{cursor:pointer}::ng-deep gallery-dots{position:absolute!important;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem)}::ng-deep gallery-dots.pep-button,::ng-deep gallery-dots.pepperi-button{display:flex!important}::ng-deep .img-container{display:flex;align-items:center}::ng-deep .g-nav-next,::ng-deep .g-nav-prev{width:2rem!important;height:2rem!important;padding:.25rem;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem)}::ng-deep .g-nav-next .mat-icon,::ng-deep .g-nav-prev .mat-icon{display:inline-block!important}::ng-deep .g-nav-prev{transform:translateY(-50%) perspective(1px) scaleX(-1)!important}.vertical-gallery ::ng-deep gallery-thumbs{margin:1rem 0 .5rem;margin:var(--pep-spacing-lg,1rem) 0 var(--pep-spacing-sm,.5rem) 0}.vertical-gallery ::ng-deep gallery-thumbs gallery-thumb{margin:0 .5rem;margin:0 var(--pep-spacing-sm,.5rem)}", "gallery{background-color:transparent}gallery-thumb{box-shadow:0 .25rem .5rem 0 rgba(26,26,26,.32);box-shadow:var(--pep-shadow-sm-offset,0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.32)}.g-nav-next,.g-nav-next:hover,.g-nav-prev,.g-nav-prev:hover{background:hsla(0,0%,100%,.5);background:hsla(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%),.5)}.g-nav-next:hover,.g-nav-prev:hover{box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.08);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.08);cursor:pointer}.g-nav-next:focus,.g-nav-prev:focus{box-shadow:0 0 0 .25rem rgba(23,102,166,.5);box-shadow:0 0 0 var(--pep-spacing-xs,.25rem) hsla(var(--pep-color-text-link-h,207),var(--pep-color-text-link-s,76%),var(--pep-color-text-link-l,37%),.5)}.g-nav-next:active,.g-nav-next:focus,.g-nav-prev:active,.g-nav-prev:focus{background:#fff;background:hsl(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%))}.g-nav-next:active,.g-nav-prev:active{box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.16);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.16)}.g-nav-next:disabled,.g-nav-prev:disabled{box-shadow:unset;border:unset;color:rgba(26,26,26,.35)!important;color:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)!important;background:hsla(0,0%,100%,.08)!important;background:hsla(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%),.08)!important}.g-nav-next:disabled:after,.g-nav-prev:disabled:after{border:unset}.g-nav-next:disabled .svg-icon,.g-nav-prev:disabled .svg-icon{fill:rgba(26,26,26,.35);fill:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)}.g-nav-next:disabled .svg-icon.stroke,.g-nav-prev:disabled .svg-icon.stroke{fill:unset;stroke:rgba(26,26,26,.35);stroke:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.35)}gallery-dots{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}"]
             },] }
 ];
 PepImagesFilmstripComponent.ctorParameters = () => [

package/fesm2015/pepperi-addons-ngx-lib-images-filmstrip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pepperi-addons-ngx-lib-images-filmstrip.js","sources":["../../../projects/ngx-lib/images-filmstrip/images-filmstrip.component.ts","../../../projects/ngx-lib/images-filmstrip/images-filmstrip.module.ts","../../../projects/ngx-lib/images-filmstrip/public-api.ts","../../../projects/ngx-lib/images-filmstrip/pepperi-addons-ngx-lib-images-filmstrip.ts"],"sourcesContent":["import {\r\n Component,\r\n ViewChild,\r\n OnInit,\r\n OnDestroy,\r\n AfterViewInit,\r\n ElementRef,\r\n Input,\r\n TemplateRef,\r\n Renderer2,\r\n ChangeDetectorRef,\r\n Inject,\r\n Optional,\r\n ViewContainerRef,\r\n OnChanges,\r\n} from '@angular/core';\r\nimport {\r\n trigger,\r\n state,\r\n style,\r\n transition,\r\n animate,\r\n} from '@angular/animations';\r\nimport { FormGroup } from '@angular/forms';\r\nimport { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';\r\nimport { TranslateService } from '@ngx-translate/core';\r\nimport {\r\n Gallery,\r\n GalleryConfig,\r\n LoadingStrategy,\r\n SlidingDirection,\r\n ThumbnailsPosition,\r\n GalleryItem,\r\n ImageItem,\r\n GalleryRef,\r\n} from 'ng-gallery';\r\nimport {\r\n PepCustomizationService,\r\n PepLayoutType,\r\n PepLayoutService,\r\n PepFileService,\r\n PepHorizontalAlignment,\r\n DEFAULT_HORIZONTAL_ALIGNMENT,\r\n PepImagesField,\r\n} from '@pepperi-addons/ngx-lib';\r\nimport { PepDialogService } from '@pepperi-addons/ngx-lib/dialog';\r\nimport { pepIconArrowRightAlt } from '@pepperi-addons/ngx-lib/icon';\r\nimport { pepIconNoImage2 } from '@pepperi-addons/ngx-lib/icon';\r\n\r\nimport 'hammerjs';\r\n\r\ninterface IPepImagesFilmstripDialogData {\r\n currIndex: number;\r\n key: string;\r\n value: string;\r\n label: string;\r\n uid: string;\r\n showThumbnails: boolean;\r\n}\r\n\r\n// export const slideInAnimation = trigger('slideAnimation', [\r\n// state('in', style({ transform: 'translateY(0)', opacity: 1 })),\r\n// transition(':enter', [\r\n// style({ transform: 'translateY(-100%)', opacity: 0 }),\r\n// animate(400)\r\n// ]),\r\n// transition(':leave', [\r\n// animate(400, style({ transform: 'translateY(-100%)', opacity: 0 }))\r\n// ])\r\n// ]);\r\n\r\nimport {\r\n IMAGEVIEWER_CONFIG,\r\n ImageViewerConfig,\r\n createButtonConfig,\r\n} from '@hallysonh/ngx-imageviewer';\r\n\r\nexport function createViewerConfig(\r\n translate: TranslateService\r\n): ImageViewerConfig {\r\n return {\r\n // width: 850,\r\n // height: 150,\r\n bgStyle: '#FFF', // component background style\r\n // scaleStep: 0.1, // zoom scale step (using the zoom in/out buttons)\r\n // rotateStepper: false, // touch rotate should rotate only 90 to 90 degrees\r\n loadingMessage: translate.instant('MESSAGES.INFO_LOADING_FILE'), // 'Loading...',\r\n // buttonStyle: {\r\n // iconFontFamily: 'Material Icons', // font used to render the button icons\r\n // alpha: 0.5, // buttons' transparence value\r\n // hoverAlpha: 0.7, // buttons' transparence value when mouse is over\r\n // bgStyle: '#000000', // buttons' background style\r\n // iconStyle: '#ffffff', // buttons' icon colors\r\n // borderStyle: '#000000', // buttons' border style\r\n // borderWidth: 0, // buttons' border width (0 == disabled)\r\n // },\r\n // tooltips: {\r\n // enabled: true, // enable or disable tooltips for buttons\r\n // bgStyle: '#000000', // tooltip background style\r\n // bgAlpha: 0.5, // tooltip background transparence\r\n // textStyle: '#ffffff', // tooltip's text style\r\n // textAlpha: 0.9, // tooltip's text transparence\r\n // padding: 15, // tooltip padding\r\n // radius: 20, // tooltip border radius\r\n // },\r\n // shorter button configuration style\r\n nextPageButton: createButtonConfig(\r\n 'navigate_next',\r\n 'Next page',\r\n 0,\r\n false\r\n ),\r\n beforePageButton: createButtonConfig(\r\n 'navigate_before',\r\n 'Previous page',\r\n 1,\r\n false\r\n ),\r\n zoomOutButton: createButtonConfig('zoom_out', 'Zoom out', 0, false),\r\n zoomInButton: createButtonConfig('zoom_in', 'Zoom in', 1, false),\r\n rotateLeftButton: createButtonConfig(\r\n 'rotate_left',\r\n 'Rotate left',\r\n 2,\r\n false\r\n ),\r\n rotateRightButton: createButtonConfig(\r\n 'rotate_right',\r\n 'Rotate right',\r\n 3,\r\n false\r\n ),\r\n resetButton: createButtonConfig('autorenew', 'Reset', 4, false),\r\n };\r\n}\r\n\r\n@Component({\r\n selector: 'pep-images-filmstrip',\r\n templateUrl: './images-filmstrip.component.html',\r\n styleUrls: ['./images-filmstrip.component.scss'],\r\n // animations: [slideInAnimation],\r\n providers: [\r\n {\r\n provide: IMAGEVIEWER_CONFIG,\r\n // useValue: IMAGEVIEWER_CONFIG_DEFAULT,\r\n useFactory: createViewerConfig,\r\n deps: [TranslateService],\r\n },\r\n ],\r\n})\r\nexport class PepImagesFilmstripComponent\r\n implements OnInit, OnChanges, AfterViewInit, OnDestroy {\r\n // @ViewChild('ngxViewerImage') ngxViewerImage: any; // TODO: Check if we need to use this??\r\n @Input() key = '';\r\n @Input() value = '';\r\n @Input() label = '';\r\n @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\r\n\r\n private _rowSpan = 1;\r\n @Input()\r\n set rowSpan(value) {\r\n this._rowSpan = value;\r\n this.setFieldHeight();\r\n }\r\n get rowSpan(): number {\r\n return this._rowSpan;\r\n }\r\n\r\n controlType = 'images';\r\n\r\n @Input() form: FormGroup = null;\r\n @Input() uid = '0';\r\n @Input() showTitle = false;\r\n @Input() renderTitle = true;\r\n\r\n private _layoutType: PepLayoutType = 'form';\r\n @Input()\r\n set layoutType(value: PepLayoutType) {\r\n this._layoutType = value;\r\n this.setFieldHeight();\r\n }\r\n get layoutType(): PepLayoutType {\r\n return this._layoutType;\r\n }\r\n\r\n @Input() currIndex = 0;\r\n @Input() showThumbnails = false;\r\n\r\n @ViewChild('galleryCont') galleryCont: ElementRef;\r\n @ViewChild('galleryDialogTemplate', { read: TemplateRef })\r\n galleryDialogTemplate: TemplateRef<any>;\r\n @ViewChild('galleryDialogCont') galleryDialogCont: ElementRef;\r\n\r\n config: GalleryConfig;\r\n items: GalleryItem[] = null;\r\n inDialog = false;\r\n\r\n mandatory = false;\r\n readonly = false;\r\n disabled = false;\r\n fieldHeight = '';\r\n standAlone = false;\r\n\r\n galleryWidth = 0;\r\n galleryHeight;\r\n isVertical = false;\r\n galleryRef: GalleryRef;\r\n dialogGalleryRef: GalleryRef;\r\n\r\n constructor(\r\n private customizationService: PepCustomizationService,\r\n private dialogService: PepDialogService,\r\n private layoutService: PepLayoutService,\r\n private fileService: PepFileService,\r\n private gallery: Gallery,\r\n private renderer: Renderer2,\r\n private element: ElementRef,\r\n private cd: ChangeDetectorRef,\r\n @Optional()\r\n private dialogRef: MatDialogRef<PepImagesFilmstripComponent>,\r\n @Optional()\r\n @Inject(MAT_DIALOG_DATA)\r\n private data: IPepImagesFilmstripDialogData\r\n ) {\r\n // If data exist copy all data properties into this.\r\n if (dialogRef && data) {\r\n this.inDialog = true;\r\n\r\n Object.keys(data).forEach((key) => {\r\n if (key in this) {\r\n this[key] = data[key];\r\n }\r\n });\r\n }\r\n\r\n this.config = {\r\n // nav: false, // Show navigation buttons\r\n navIcon: pepIconArrowRightAlt.data,\r\n // loop: true,\r\n // zoomOut: 0,\r\n // dots: false,\r\n // dotsPosition: 'bottom',\r\n // counterPosition: 'top',\r\n // thumb: true,\r\n counter: false, // Show counter\r\n gestures: true, // Use touch events (requires hammer.js)\r\n // autoPlay: false,\r\n // thumbWidth: 120,\r\n // thumbHeight: 90,\r\n imageSize: 'contain',\r\n // panSensitivity: 25,\r\n // disableThumb: false,\r\n // playerInterval: 3000,\r\n // thumbMode: ThumbnailsMode.Free,\r\n // thumbPosition: ThumbnailsPosition.Bottom,\r\n loadingStrategy: LoadingStrategy.Default,\r\n // slidingDirection: SlidingDirection.Horizontal,\r\n };\r\n }\r\n\r\n private setFieldHeight(): void {\r\n this.fieldHeight = this.customizationService.calculateFieldHeight(\r\n this.layoutType,\r\n this.rowSpan,\r\n this.standAlone\r\n );\r\n }\r\n\r\n private setDefaultForm(): void {\r\n const pepField = new PepImagesField({\r\n key: this.key,\r\n value: this.value,\r\n mandatory: this.mandatory,\r\n readonly: this.readonly,\r\n disabled: this.disabled,\r\n });\r\n this.form = this.customizationService.getDefaultFromGroup(pepField);\r\n }\r\n\r\n ngOnInit(): void {\r\n if (!this.inDialog) {\r\n if (this.form === null) {\r\n this.standAlone = true;\r\n this.setFieldHeight();\r\n this.setDefaultForm();\r\n\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME\r\n );\r\n\r\n if (!this.renderTitle) {\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n PepCustomizationService.STAND_ALONE_FIELD_NO_SPACING_CLASS_NAME\r\n );\r\n }\r\n }\r\n }\r\n\r\n if (this.items === null) {\r\n const imgArr = this.value ? this.value.split(';') : [];\r\n // add No image image when there is no images\r\n if (imgArr.length === 0) {\r\n const noImageSrc = this.fileService.getSvgAsImageSrc(\r\n pepIconNoImage2.data\r\n );\r\n imgArr.push(noImageSrc);\r\n }\r\n\r\n this.items = imgArr.map(\r\n (img) => new ImageItem({ src: img, thumb: img })\r\n );\r\n }\r\n\r\n this.config.dots = this.config.nav = this.items.length > 1;\r\n this.config.thumb =\r\n (this.key === 'ItemFilmstripImages' \|\| this.showThumbnails) &&\r\n this.items.length > 1\r\n ? true\r\n : false;\r\n this.currIndex =\r\n this.key === 'ItemFilmstripImages' &&\r\n this.currIndex === 0 &&\r\n this.items.length > 1\r\n ? Math.floor(this.items.length / 2) - 1\r\n : this.currIndex;\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n if (this.inDialog) {\r\n this.afterDialogOpened();\r\n } else {\r\n this.galleryRef = this.gallery.ref(\r\n `${this.key}-${this.uid}-gallery`\r\n );\r\n this.initGalleryStyle(this.galleryCont, this.galleryRef);\r\n }\r\n }\r\n\r\n ngOnChanges(): void {\r\n if (this.standAlone) {\r\n this.setDefaultForm();\r\n }\r\n }\r\n\r\n ngOnDestroy(): void {\r\n if (this.galleryRef) {\r\n this.galleryRef.destroy();\r\n }\r\n if (this.dialogGalleryRef) {\r\n this.dialogGalleryRef.destroy();\r\n }\r\n // if (this.myPinch) { this.myPinch.destroy(); }\r\n }\r\n\r\n initGalleryStyle(galleryContainer, galleryRef): void {\r\n setTimeout(() => {\r\n // Set thumbnails position and sliding direction\r\n this.setThumbnailDimension(galleryContainer);\r\n galleryRef.setConfig(this.config);\r\n }, 0);\r\n\r\n const currentIndex = this.currIndex;\r\n if (currentIndex > 0) {\r\n setTimeout(() => {\r\n galleryRef.load(this.items);\r\n galleryRef.set(currentIndex);\r\n }, 0);\r\n // galleryRef.set(currentIndex);\r\n } else {\r\n galleryRef.load(this.items);\r\n }\r\n }\r\n\r\n onError(e): void {\r\n const noImageSrc = this.fileService.getSvgAsImageSrc(\r\n pepIconNoImage2.data\r\n );\r\n const noimg = new ImageItem({ src: noImageSrc, thumb: noImageSrc });\r\n this.items.splice(e.itemIndex, 1, noimg);\r\n }\r\n\r\n enlargeImage(event: any): void {\r\n const config = this.dialogService.getDialogConfig({}, 'inline');\r\n config.maxWidth = '75vw';\r\n config.height = '95vh';\r\n\r\n const dialogRef = this.dialogService.openDialog(\r\n this.galleryDialogTemplate,\r\n {\r\n currIndex: this.currIndex,\r\n },\r\n config\r\n );\r\n\r\n dialogRef.afterOpened().subscribe(() => {\r\n this.afterDialogOpened();\r\n });\r\n\r\n // Update currentIndex in galleryRef\r\n // dialogRef.afterClosed().subscribe(value => {\r\n // this.galleryRef.set(this.currIndex);\r\n // });\r\n }\r\n\r\n afterDialogOpened(): void {\r\n this.dialogGalleryRef = this.gallery.ref(\r\n `${this.key}-${this.uid}-dlgGallery`\r\n );\r\n this.initGalleryStyle(this.galleryDialogCont, this.dialogGalleryRef);\r\n }\r\n\r\n setThumbnailDimension(galleryContainer): void {\r\n this.galleryWidth = galleryContainer.nativeElement.clientWidth;\r\n // this.galleryHeight = galleryContainer.nativeElement.clientHeight - 32; // TODO - TALK WITH TOMER\r\n this.galleryHeight = this.inDialog\r\n ? galleryContainer.nativeElement.clientHeight - 32\r\n : galleryContainer.nativeElement.clientHeight;\r\n // this.galleryHeight = galleryContainer.nativeElement.clientHeight - 32;\r\n this.cd.detectChanges();\r\n\r\n this.isVertical = this.galleryWidth < this.galleryHeight;\r\n this.cd.detectChanges();\r\n if (this.isVertical) {\r\n let width =\r\n (this.galleryWidth - (this.items.length - 1) * 16) /\r\n this.items.length;\r\n width = Math.min(Math.max(width, 24), 96);\r\n\r\n this.config.thumbHeight = width;\r\n this.config.thumbWidth = width + 16;\r\n } else {\r\n let height =\r\n (this.galleryHeight - (this.items.length - 1) * 16) /\r\n this.items.length;\r\n height = Math.min(Math.max(height, 24), 96);\r\n\r\n this.config.thumbHeight = height + 16;\r\n this.config.thumbWidth = height;\r\n }\r\n\r\n this.config.thumbPosition = this.isVertical\r\n ? ThumbnailsPosition.Bottom\r\n : this.layoutService.isRtl()\r\n ? ThumbnailsPosition.Right\r\n : ThumbnailsPosition.Left;\r\n this.config.slidingDirection =\r\n this.key !== 'ItemFilmstripImages'\r\n ? SlidingDirection.Horizontal\r\n : this.isVertical\r\n ? SlidingDirection.Horizontal\r\n : SlidingDirection.Vertical;\r\n\r\n this.config.imageSize = 'contain';\r\n }\r\n\r\n indexChange(item: any): void {\r\n this.currIndex = item.currIndex;\r\n // if (this.ngxViewerImage && this.ngxViewerImage.scale) {\r\n // this.ngxViewerImage.scale = 1;\r\n // this.updateStyle();\r\n // }\r\n }\r\n\r\n // scrollFunction(e: any): boolean {\r\n // e.deltaY > 0 ? this.zoomOut() : this.zoomIn();\r\n // return false;\r\n // }\r\n\r\n // zoomIn(): void {\r\n // if (this.ngxViewerImage.scale < 2) {\r\n // this.ngxViewerImage.scale = (1 + this.ngxViewerImage.config.zoomFactor);\r\n // } else {\r\n // this.ngxViewerImage.scale = 2;\r\n // }\r\n // this.updateStyle();\r\n // }\r\n\r\n // zoomOut(): void {\r\n // if (this.ngxViewerImage.scale > this.ngxViewerImage.config.zoomFactor) {\r\n // this.ngxViewerImage.scale /= (1 + this.ngxViewerImage.config.zoomFactor);\r\n // }\r\n // this.updateStyle();\r\n // }\r\n\r\n // private updateStyle(): void {\r\n // this.ngxViewerImage.style.transform = `translate(${this.ngxViewerImage.translateX}px,\r\n // ${this.ngxViewerImage.translateY}px) rotate(${this.ngxViewerImage.rotation}deg) scale(${this.ngxViewerImage.scale})`;\r\n\r\n // this.cd.detectChanges();\r\n // }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ReactiveFormsModule } from '@angular/forms';\r\n\r\nimport { MatCommonModule } from '@angular/material/core';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatDialogModule } from '@angular/material/dialog';\r\nimport { MatIconModule } from '@angular/material/icon';\r\n\r\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\r\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\r\nimport {\r\n PepIconModule,\r\n PepIconRegistry,\r\n pepIconSystemEdit,\r\n pepIconSystemClose,\r\n pepIconArrowRightAlt,\r\n pepIconArrowLeftAlt,\r\n} from '@pepperi-addons/ngx-lib/icon';\r\nimport { PepDialogModule } from '@pepperi-addons/ngx-lib/dialog';\r\n\r\nimport { GalleryModule } from 'ng-gallery';\r\nimport { ImageViewerModule } from '@hallysonh/ngx-imageviewer';\r\n\r\nimport { PepImagesFilmstripComponent } from './images-filmstrip.component';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n ReactiveFormsModule,\r\n // Material modules,\r\n MatCommonModule,\r\n MatFormFieldModule,\r\n MatDialogModule,\r\n MatIconModule,\r\n // External modules\r\n GalleryModule,\r\n ImageViewerModule,\r\n // ImageViewerModule.forRoot({\r\n // btnClass: 'default', // The CSS class(es) that will apply to the buttons\r\n // zoomFactor: 0.1, // The amount that the scale will be increased by\r\n // containerBackgroundColor: 'transparent', // The color to use for the background. This can provided in hex, or rgb(a).\r\n // wheelZoom: true, // If true, the mouse wheel can be used to zoom in\r\n // allowFullscreen: false, // If true, the fullscreen button will be shown, allowing the user to entr fullscreen mode\r\n // btnIcons: {\r\n // // The icon classes that will apply to the buttons. By default, font-awesome is used.\r\n // zoomIn: 'fa fa-plus',\r\n // zoomOut: 'fa fa-minus',\r\n // rotateClockwise: 'fa fa-repeat',\r\n // rotateCounterClockwise: 'fa fa-undo',\r\n // next: 'fa fa-arrow-right',\r\n // prev: 'fa fa-arrow-left',\r\n // fullscreen: 'fa fa-arrows-alt'\r\n // }\r\n // }),\r\n // ngx-lib modules\r\n PepNgxLibModule,\r\n PepIconModule,\r\n PepFieldTitleModule,\r\n PepDialogModule,\r\n ],\r\n exports: [PepImagesFilmstripComponent],\r\n declarations: [PepImagesFilmstripComponent],\r\n})\r\nexport class PepImagesFilmstripModule {\r\n constructor(private pepIconRegistry: PepIconRegistry) {\r\n this.pepIconRegistry.registerIcons([\r\n pepIconSystemEdit,\r\n pepIconSystemClose,\r\n pepIconArrowRightAlt,\r\n pepIconArrowLeftAlt,\r\n ]);\r\n }\r\n}\r\n","/\r\n * Public API Surface of ngx-lib/images-filmstrip\r\n /\r\nexport from './images-filmstrip.module';\r\nexport * from './images-filmstrip.component';\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;SA6EgB,kBAAkB,CAC9B,SAA2B;IAE3B,OAAO;;;QAGH,OAAO,EAAE,MAAM;;;QAGf,cAAc,EAAE,SAAS,CAAC,OAAO,CAAC,4BAA4B,CAAC;;;;;;;;;;;;;;;;;;;;QAoB/D,cAAc,EAAE,kBAAkB,CAC9B,eAAe,EACf,WAAW,EACX,CAAC,EACD,KAAK,CACR;QACD,gBAAgB,EAAE,kBAAkB,CAChC,iBAAiB,EACjB,eAAe,EACf,CAAC,EACD,KAAK,CACR;QACD,aAAa,EAAE,kBAAkB,CAAC,UAAU,EAAE,UAAU,EAAE,CAAC,EAAE,KAAK,CAAC;QACnE,YAAY,EAAE,kBAAkB,CAAC,SAAS,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,CAAC;QAChE,gBAAgB,EAAE,kBAAkB,CAChC,aAAa,EACb,aAAa,EACb,CAAC,EACD,KAAK,CACR;QACD,iBAAiB,EAAE,kBAAkB,CACjC,cAAc,EACd,cAAc,EACd,CAAC,EACD,KAAK,CACR;QACD,WAAW,EAAE,kBAAkB,CAAC,WAAW,EAAE,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC;KAClE,CAAC;AACN,CAAC;MAgBY,2BAA2B;IA2DpC,YACY,oBAA6C,EAC7C,aAA+B,EAC/B,aAA+B,EAC/B,WAA2B,EAC3B,OAAgB,EAChB,QAAmB,EACnB,OAAmB,EACnB,EAAqB,EAErB,SAAoD,EAGpD,IAAmC;QAZnC,yBAAoB,GAApB,oBAAoB,CAAyB;QAC7C,kBAAa,GAAb,aAAa,CAAkB;QAC/B,kBAAa,GAAb,aAAa,CAAkB;QAC/B,gBAAW,GAAX,WAAW,CAAgB;QAC3B,YAAO,GAAP,OAAO,CAAS;QAChB,aAAQ,GAAR,QAAQ,CAAW;QACnB,YAAO,GAAP,OAAO,CAAY;QACnB,OAAE,GAAF,EAAE,CAAmB;QAErB,cAAS,GAAT,SAAS,CAA2C;QAGpD,SAAI,GAAJ,IAAI,CAA+B;;QArEtC,QAAG,GAAG,EAAE,CAAC;QACT,UAAK,GAAG,EAAE,CAAC;QACX,UAAK,GAAG,EAAE,CAAC;QACX,eAAU,GAA2B,4BAA4B,CAAC;QAEnE,aAAQ,GAAG,CAAC,CAAC;QAUrB,gBAAW,GAAG,QAAQ,CAAC;QAEd,SAAI,GAAc,IAAI,CAAC;QACvB,QAAG,GAAG,GAAG,CAAC;QACV,cAAS,GAAG,KAAK,CAAC;QAClB,gBAAW,GAAG,IAAI,CAAC;QAEpB,gBAAW,GAAkB,MAAM,CAAC;QAUnC,cAAS,GAAG,CAAC,CAAC;QACd,mBAAc,GAAG,KAAK,CAAC;QAQhC,UAAK,GAAkB,IAAI,CAAC;QAC5B,aAAQ,GAAG,KAAK,CAAC;QAEjB,cAAS,GAAG,KAAK,CAAC;QAClB,aAAQ,GAAG,KAAK,CAAC;QACjB,aAAQ,GAAG,KAAK,CAAC;QACjB,gBAAW,GAAG,EAAE,CAAC;QACjB,eAAU,GAAG,KAAK,CAAC;QAEnB,iBAAY,GAAG,CAAC,CAAC;QAEjB,eAAU,GAAG,KAAK,CAAC;;QAoBf,IAAI,SAAS,IAAI,IAAI,EAAE;YACnB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YAErB,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG;gBAC1B,IAAI,GAAG,IAAI,IAAI,EAAE;oBACb,IAAI,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC;iBACzB;aACJ,CAAC,CAAC;SACN;QAED,IAAI,CAAC,MAAM,GAAG;;YAEV,OAAO,EAAE,oBAAoB,CAAC,IAAI;;;;;;;YAOlC,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,IAAI;;;;YAId,SAAS,EAAE,SAAS;;;;;;YAMpB,eAAe,EAAE,eAAe,CAAC,OAAO;;SAE3C,CAAC;KACL;IAnGD,IACI,OAAO,CAAC,KAAK;QACb,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QACtB,IAAI,CAAC,cAAc,EAAE,CAAC;KACzB;IACD,IAAI,OAAO;QACP,OAAO,IAAI,CAAC,QAAQ,CAAC;KACxB;IAUD,IACI,UAAU,CAAC,KAAoB;QAC/B,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,cAAc,EAAE,CAAC;KACzB;IACD,IAAI,UAAU;QACV,OAAO,IAAI,CAAC,WAAW,CAAC;KAC3B;IA6EO,cAAc;QAClB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,oBAAoB,CAAC,oBAAoB,CAC7D,IAAI,CAAC,UAAU,EACf,IAAI,CAAC,OAAO,EACZ,IAAI,CAAC,UAAU,CAClB,CAAC;KACL;IAEO,cAAc;QAClB,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC;YAChC,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,oBAAoB,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC;KACvE;IAED,QAAQ;QACJ,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAChB,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI,EAAE;gBACpB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;gBACvB,IAAI,CAAC,cAAc,EAAE,CAAC;gBACtB,IAAI,CAAC,cAAc,EAAE,CAAC;gBAEtB,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAClB,IAAI,CAAC,OAAO,CAAC,aAAa,EAC1B,uBAAuB,CAAC,4BAA4B,CACvD,CAAC;gBAEF,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;oBACnB,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAClB,IAAI,CAAC,OAAO,CAAC,aAAa,EAC1B,uBAAuB,CAAC,uCAAuC,CAClE,CAAC;iBACL;aACJ;SACJ;QAED,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,EAAE;YACrB,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC;;YAEvD,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE;gBACrB,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAChD,eAAe,CAAC,IAAI,CACvB,CAAC;gBACF,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;aAC3B;YAED,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,GAAG,CACnB,CAAC,GAAG,KAAK,IAAI,SAAS,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CACnD,CAAC;SACL;QAED,IAAI,CAAC,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;QAC3D,IAAI,CAAC,MAAM,CAAC,KAAK;YACb,CAAC,IAAI,CAAC,GAAG,KAAK,qBAAqB,IAAI,IAAI,CAAC,cAAc;gBACtD,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;kBACnB,IAAI;kBACJ,KAAK,CAAC;QAChB,IAAI,CAAC,SAAS;YACV,IAAI,CAAC,GAAG,KAAK,qBAAqB;gBAC9B,IAAI,CAAC,SAAS,KAAK,CAAC;gBACpB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;kBACnB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC;kBACrC,IAAI,CAAC,SAAS,CAAC;KAC5B;IAED,eAAe;QACX,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;SAC5B;aAAM;YACH,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,CAC9B,GAAG,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,GAAG,UAAU,CACpC,CAAC;YACF,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;SAC5D;KACJ;IAED,WAAW;QACP,IAAI,IAAI,CAAC,UAAU,EAAE;YACjB,IAAI,CAAC,cAAc,EAAE,CAAC;SACzB;KACJ;IAED,WAAW;QACP,IAAI,IAAI,CAAC,UAAU,EAAE;YACjB,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;SAC7B;QACD,IAAI,IAAI,CAAC,gBAAgB,EAAE;YACvB,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC;SACnC;;KAEJ;IAED,gBAAgB,CAAC,gBAAgB,EAAE,UAAU;QACzC,UAAU,CAAC;;YAEP,IAAI,CAAC,qBAAqB,CAAC,gBAAgB,CAAC,CAAC;YAC7C,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SACrC,EAAE,CAAC,CAAC,CAAC;QAEN,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC;QACpC,IAAI,YAAY,GAAG,CAAC,EAAE;YAClB,UAAU,CAAC;gBACP,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBAC5B,UAAU,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;aAChC,EAAE,CAAC,CAAC,CAAC;;SAET;aAAM;YACH,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAC/B;KACJ;IAED,OAAO,CAAC,CAAC;QACL,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAChD,eAAe,CAAC,IAAI,CACvB,CAAC;QACF,MAAM,KAAK,GAAG,IAAI,SAAS,CAAC,EAAE,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,CAAC;QACpE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC;KAC5C;IAED,YAAY,CAAC,KAAU;QACnB,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;QAChE,MAAM,CAAC,QAAQ,GAAG,MAAM,CAAC;QACzB,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC;QAEvB,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,UAAU,CAC3C,IAAI,CAAC,qBAAqB,EAC1B;YACI,SAAS,EAAE,IAAI,CAAC,SAAS;SAC5B,EACD,MAAM,CACT,CAAC;QAEF,SAAS,CAAC,WAAW,EAAE,CAAC,SAAS,CAAC;YAC9B,IAAI,CAAC,iBAAiB,EAAE,CAAC;SAC5B,CAAC,CAAC;;;;;KAMN;IAED,iBAAiB;QACb,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,CACpC,GAAG,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,GAAG,aAAa,CACvC,CAAC;QACF,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,iBAAiB,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;KACxE;IAED,qBAAqB,CAAC,gBAAgB;QAClC,IAAI,CAAC,YAAY,GAAG,gBAAgB,CAAC,aAAa,CAAC,WAAW,CAAC;;QAE/D,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,QAAQ;cAC5B,gBAAgB,CAAC,aAAa,CAAC,YAAY,GAAG,EAAE;cAChD,gBAAgB,CAAC,aAAa,CAAC,YAAY,CAAC;;QAElD,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,CAAC;QAExB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC;QACzD,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,CAAC;QACxB,IAAI,IAAI,CAAC,UAAU,EAAE;YACjB,IAAI,KAAK,GACL,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,EAAE;gBACjD,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;YACtB,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;YAE1C,IAAI,CAAC,MAAM,CAAC,WAAW,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,KAAK,GAAG,EAAE,CAAC;SACvC;aAAM;YACH,IAAI,MAAM,GACN,CAAC,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,EAAE;gBAClD,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;YACtB,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;YAE5C,IAAI,CAAC,MAAM,CAAC,WAAW,GAAG,MAAM,GAAG,EAAE,CAAC;YACtC,IAAI,CAAC,MAAM,CAAC,UAAU,GAAG,MAAM,CAAC;SACnC;QAED,IAAI,CAAC,MAAM,CAAC,aAAa,GAAG,IAAI,CAAC,UAAU;cACrC,kBAAkB,CAAC,MAAM;cACzB,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE;kBACtB,kBAAkB,CAAC,KAAK;kBACxB,kBAAkB,CAAC,IAAI,CAAC;QAClC,IAAI,CAAC,MAAM,CAAC,gBAAgB;YACxB,IAAI,CAAC,GAAG,KAAK,qBAAqB;kBAC5B,gBAAgB,CAAC,UAAU;kBAC3B,IAAI,CAAC,UAAU;sBACX,gBAAgB,CAAC,UAAU;sBAC3B,gBAAgB,CAAC,QAAQ,CAAC;QAExC,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,SAAS,CAAC;KACrC;IAED,WAAW,CAAC,IAAS;QACjB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;;;;;KAKnC;;;YAvUJ,SAAS,SAAC;gBACP,QAAQ,EAAE,sBAAsB;gBAChC,4zDAAgD;;gBAGhD,SAAS,EAAE;oBACP;wBACI,OAAO,EAAE,kBAAkB;;wBAE3B,UAAU,EAAE,kBAAkB;wBAC9B,IAAI,EAAE,CAAC,gBAAgB,CAAC;qBAC3B;iBACJ;;aACJ;;;YAhHG,uBAAuB;YAQlB,gBAAgB;YANrB,gBAAgB;YAChB,cAAc;YAbd,OAAO;YAlBP,SAAS;YAHT,UAAU;YAIV,iBAAiB;YAcK,YAAY,uBAkM7B,QAAQ;4CAER,QAAQ,YACR,MAAM,SAAC,eAAe;;;kBApE1B,KAAK;oBACL,KAAK;oBACL,KAAK;yBACL,KAAK;sBAGL,KAAK;mBAWL,KAAK;kBACL,KAAK;wBACL,KAAK;0BACL,KAAK;yBAGL,KAAK;wBASL,KAAK;6BACL,KAAK;0BAEL,SAAS,SAAC,aAAa;oCACvB,SAAS,SAAC,uBAAuB,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE;gCAExD,SAAS,SAAC,mBAAmB;;;MC/HrB,wBAAwB;IACjC,YAAoB,eAAgC;QAAhC,oBAAe,GAAf,eAAe,CAAiB;QAChD,IAAI,CAAC,eAAe,CAAC,aAAa,CAAC;YAC/B,iBAAiB;YACjB,kBAAkB;YAClB,oBAAoB;YACpB,mBAAmB;SACtB,CAAC,CAAC;KACN;;;YA9CJ,QAAQ,SAAC;gBACN,OAAO,EAAE;oBACL,YAAY;oBACZ,mBAAmB;;oBAEnB,eAAe;oBACf,kBAAkB;oBAClB,eAAe;oBACf,aAAa;;oBAEb,aAAa;oBACb,iBAAiB;;;;;;;;;;;;;;;;;;;oBAmBjB,eAAe;oBACf,aAAa;oBACb,mBAAmB;oBACnB,eAAe;iBAClB;gBACD,OAAO,EAAE,CAAC,2BAA2B,CAAC;gBACtC,YAAY,EAAE,CAAC,2BAA2B,CAAC;aAC9C;;;YAlDG,eAAe;;;ACbnB;;;;ACAA;;;;;;"}
1	+ {"version":3,"file":"pepperi-addons-ngx-lib-images-filmstrip.js","sources":["../../../projects/ngx-lib/images-filmstrip/images-filmstrip.component.ts","../../../projects/ngx-lib/images-filmstrip/images-filmstrip.module.ts","../../../projects/ngx-lib/images-filmstrip/public-api.ts","../../../projects/ngx-lib/images-filmstrip/pepperi-addons-ngx-lib-images-filmstrip.ts"],"sourcesContent":["import {\r\n Component,\r\n ViewChild,\r\n OnInit,\r\n OnDestroy,\r\n AfterViewInit,\r\n ElementRef,\r\n Input,\r\n TemplateRef,\r\n Renderer2,\r\n ChangeDetectorRef,\r\n Inject,\r\n Optional,\r\n ViewContainerRef,\r\n OnChanges,\r\n} from '@angular/core';\r\nimport {\r\n trigger,\r\n state,\r\n style,\r\n transition,\r\n animate,\r\n} from '@angular/animations';\r\nimport { FormGroup } from '@angular/forms';\r\nimport { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';\r\nimport { TranslateService } from '@ngx-translate/core';\r\nimport {\r\n Gallery,\r\n GalleryConfig,\r\n LoadingStrategy,\r\n SlidingDirection,\r\n ThumbnailsPosition,\r\n GalleryItem,\r\n ImageItem,\r\n GalleryRef,\r\n} from 'ng-gallery';\r\nimport {\r\n PepCustomizationService,\r\n PepLayoutType,\r\n PepLayoutService,\r\n PepFileService,\r\n PepHorizontalAlignment,\r\n DEFAULT_HORIZONTAL_ALIGNMENT,\r\n PepImagesField,\r\n} from '@pepperi-addons/ngx-lib';\r\nimport { PepDialogService } from '@pepperi-addons/ngx-lib/dialog';\r\nimport { pepIconArrowRightAlt } from '@pepperi-addons/ngx-lib/icon';\r\nimport { pepIconNoImage2 } from '@pepperi-addons/ngx-lib/icon';\r\n\r\nimport 'hammerjs';\r\n\r\ninterface IPepImagesFilmstripDialogData {\r\n currIndex: number;\r\n key: string;\r\n value: string;\r\n label: string;\r\n uid: string;\r\n showThumbnails: boolean;\r\n}\r\n\r\n// export const slideInAnimation = trigger('slideAnimation', [\r\n// state('in', style({ transform: 'translateY(0)', opacity: 1 })),\r\n// transition(':enter', [\r\n// style({ transform: 'translateY(-100%)', opacity: 0 }),\r\n// animate(400)\r\n// ]),\r\n// transition(':leave', [\r\n// animate(400, style({ transform: 'translateY(-100%)', opacity: 0 }))\r\n// ])\r\n// ]);\r\n\r\nimport {\r\n IMAGEVIEWER_CONFIG,\r\n ImageViewerConfig,\r\n createButtonConfig,\r\n} from '@hallysonh/ngx-imageviewer';\r\n\r\nexport function createViewerConfig(\r\n translate: TranslateService\r\n): ImageViewerConfig {\r\n return {\r\n // width: 850,\r\n // height: 150,\r\n bgStyle: '#FFF', // component background style\r\n // scaleStep: 0.1, // zoom scale step (using the zoom in/out buttons)\r\n // rotateStepper: false, // touch rotate should rotate only 90 to 90 degrees\r\n loadingMessage: translate.instant('MESSAGES.INFO_LOADING_FILE'), // 'Loading...',\r\n // buttonStyle: {\r\n // iconFontFamily: 'Material Icons', // font used to render the button icons\r\n // alpha: 0.5, // buttons' transparence value\r\n // hoverAlpha: 0.7, // buttons' transparence value when mouse is over\r\n // bgStyle: '#000000', // buttons' background style\r\n // iconStyle: '#ffffff', // buttons' icon colors\r\n // borderStyle: '#000000', // buttons' border style\r\n // borderWidth: 0, // buttons' border width (0 == disabled)\r\n // },\r\n // tooltips: {\r\n // enabled: true, // enable or disable tooltips for buttons\r\n // bgStyle: '#000000', // tooltip background style\r\n // bgAlpha: 0.5, // tooltip background transparence\r\n // textStyle: '#ffffff', // tooltip's text style\r\n // textAlpha: 0.9, // tooltip's text transparence\r\n // padding: 15, // tooltip padding\r\n // radius: 20, // tooltip border radius\r\n // },\r\n // shorter button configuration style\r\n nextPageButton: createButtonConfig(\r\n 'navigate_next',\r\n 'Next page',\r\n 0,\r\n false\r\n ),\r\n beforePageButton: createButtonConfig(\r\n 'navigate_before',\r\n 'Previous page',\r\n 1,\r\n false\r\n ),\r\n zoomOutButton: createButtonConfig('zoom_out', 'Zoom out', 0, false),\r\n zoomInButton: createButtonConfig('zoom_in', 'Zoom in', 1, false),\r\n rotateLeftButton: createButtonConfig(\r\n 'rotate_left',\r\n 'Rotate left',\r\n 2,\r\n false\r\n ),\r\n rotateRightButton: createButtonConfig(\r\n 'rotate_right',\r\n 'Rotate right',\r\n 3,\r\n false\r\n ),\r\n resetButton: createButtonConfig('autorenew', 'Reset', 4, false),\r\n };\r\n}\r\n\r\n@Component({\r\n selector: 'pep-images-filmstrip',\r\n templateUrl: './images-filmstrip.component.html',\r\n styleUrls: ['./images-filmstrip.component.scss', './images-filmstrip.component.theme.scss'],\r\n // animations: [slideInAnimation],\r\n providers: [\r\n {\r\n provide: IMAGEVIEWER_CONFIG,\r\n // useValue: IMAGEVIEWER_CONFIG_DEFAULT,\r\n useFactory: createViewerConfig,\r\n deps: [TranslateService],\r\n },\r\n ],\r\n})\r\nexport class PepImagesFilmstripComponent\r\n implements OnInit, OnChanges, AfterViewInit, OnDestroy {\r\n // @ViewChild('ngxViewerImage') ngxViewerImage: any; // TODO: Check if we need to use this??\r\n @Input() key = '';\r\n @Input() value = '';\r\n @Input() label = '';\r\n @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\r\n\r\n private _rowSpan = 1;\r\n @Input()\r\n set rowSpan(value) {\r\n this._rowSpan = value;\r\n this.setFieldHeight();\r\n }\r\n get rowSpan(): number {\r\n return this._rowSpan;\r\n }\r\n\r\n controlType = 'images';\r\n\r\n @Input() form: FormGroup = null;\r\n @Input() uid = '0';\r\n @Input() showTitle = false;\r\n @Input() renderTitle = true;\r\n\r\n private _layoutType: PepLayoutType = 'form';\r\n @Input()\r\n set layoutType(value: PepLayoutType) {\r\n this._layoutType = value;\r\n this.setFieldHeight();\r\n }\r\n get layoutType(): PepLayoutType {\r\n return this._layoutType;\r\n }\r\n\r\n @Input() currIndex = 0;\r\n @Input() showThumbnails = false;\r\n\r\n @ViewChild('galleryCont') galleryCont: ElementRef;\r\n @ViewChild('galleryDialogTemplate', { read: TemplateRef })\r\n galleryDialogTemplate: TemplateRef<any>;\r\n @ViewChild('galleryDialogCont') galleryDialogCont: ElementRef;\r\n\r\n config: GalleryConfig;\r\n items: GalleryItem[] = null;\r\n inDialog = false;\r\n\r\n mandatory = false;\r\n readonly = false;\r\n disabled = false;\r\n fieldHeight = '';\r\n standAlone = false;\r\n\r\n galleryWidth = 0;\r\n galleryHeight;\r\n isVertical = false;\r\n galleryRef: GalleryRef;\r\n dialogGalleryRef: GalleryRef;\r\n\r\n constructor(\r\n private customizationService: PepCustomizationService,\r\n private dialogService: PepDialogService,\r\n private layoutService: PepLayoutService,\r\n private fileService: PepFileService,\r\n private gallery: Gallery,\r\n private renderer: Renderer2,\r\n private element: ElementRef,\r\n private cd: ChangeDetectorRef,\r\n @Optional()\r\n private dialogRef: MatDialogRef<PepImagesFilmstripComponent>,\r\n @Optional()\r\n @Inject(MAT_DIALOG_DATA)\r\n private data: IPepImagesFilmstripDialogData\r\n ) {\r\n // If data exist copy all data properties into this.\r\n if (dialogRef && data) {\r\n this.inDialog = true;\r\n\r\n Object.keys(data).forEach((key) => {\r\n if (key in this) {\r\n this[key] = data[key];\r\n }\r\n });\r\n }\r\n\r\n this.config = {\r\n // nav: false, // Show navigation buttons\r\n navIcon: pepIconArrowRightAlt.data,\r\n // loop: true,\r\n // zoomOut: 0,\r\n // dots: false,\r\n // dotsPosition: 'bottom',\r\n // counterPosition: 'top',\r\n // thumb: true,\r\n counter: false, // Show counter\r\n gestures: true, // Use touch events (requires hammer.js)\r\n // autoPlay: false,\r\n // thumbWidth: 120,\r\n // thumbHeight: 90,\r\n imageSize: 'contain',\r\n // panSensitivity: 25,\r\n // disableThumb: false,\r\n // playerInterval: 3000,\r\n // thumbMode: ThumbnailsMode.Free,\r\n // thumbPosition: ThumbnailsPosition.Bottom,\r\n loadingStrategy: LoadingStrategy.Default,\r\n // slidingDirection: SlidingDirection.Horizontal,\r\n };\r\n }\r\n\r\n private setFieldHeight(): void {\r\n this.fieldHeight = this.customizationService.calculateFieldHeight(\r\n this.layoutType,\r\n this.rowSpan,\r\n this.standAlone\r\n );\r\n }\r\n\r\n private setDefaultForm(): void {\r\n const pepField = new PepImagesField({\r\n key: this.key,\r\n value: this.value,\r\n mandatory: this.mandatory,\r\n readonly: this.readonly,\r\n disabled: this.disabled,\r\n });\r\n this.form = this.customizationService.getDefaultFromGroup(pepField);\r\n }\r\n\r\n ngOnInit(): void {\r\n if (!this.inDialog) {\r\n if (this.form === null) {\r\n this.standAlone = true;\r\n this.setFieldHeight();\r\n this.setDefaultForm();\r\n\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME\r\n );\r\n\r\n if (!this.renderTitle) {\r\n this.renderer.addClass(\r\n this.element.nativeElement,\r\n PepCustomizationService.STAND_ALONE_FIELD_NO_SPACING_CLASS_NAME\r\n );\r\n }\r\n }\r\n }\r\n\r\n if (this.items === null) {\r\n const imgArr = this.value ? this.value.split(';') : [];\r\n // add No image image when there is no images\r\n if (imgArr.length === 0) {\r\n const noImageSrc = this.fileService.getSvgAsImageSrc(\r\n pepIconNoImage2.data\r\n );\r\n imgArr.push(noImageSrc);\r\n }\r\n\r\n this.items = imgArr.map(\r\n (img) => new ImageItem({ src: img, thumb: img })\r\n );\r\n }\r\n\r\n this.config.dots = this.config.nav = this.items.length > 1;\r\n this.config.thumb =\r\n (this.key === 'ItemFilmstripImages' \|\| this.showThumbnails) &&\r\n this.items.length > 1\r\n ? true\r\n : false;\r\n this.currIndex =\r\n this.key === 'ItemFilmstripImages' &&\r\n this.currIndex === 0 &&\r\n this.items.length > 1\r\n ? Math.floor(this.items.length / 2) - 1\r\n : this.currIndex;\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n if (this.inDialog) {\r\n this.afterDialogOpened();\r\n } else {\r\n this.galleryRef = this.gallery.ref(\r\n `${this.key}-${this.uid}-gallery`\r\n );\r\n this.initGalleryStyle(this.galleryCont, this.galleryRef);\r\n }\r\n }\r\n\r\n ngOnChanges(): void {\r\n if (this.standAlone) {\r\n this.setDefaultForm();\r\n }\r\n }\r\n\r\n ngOnDestroy(): void {\r\n if (this.galleryRef) {\r\n this.galleryRef.destroy();\r\n }\r\n if (this.dialogGalleryRef) {\r\n this.dialogGalleryRef.destroy();\r\n }\r\n // if (this.myPinch) { this.myPinch.destroy(); }\r\n }\r\n\r\n initGalleryStyle(galleryContainer, galleryRef): void {\r\n setTimeout(() => {\r\n // Set thumbnails position and sliding direction\r\n this.setThumbnailDimension(galleryContainer);\r\n galleryRef.setConfig(this.config);\r\n }, 0);\r\n\r\n const currentIndex = this.currIndex;\r\n if (currentIndex > 0) {\r\n setTimeout(() => {\r\n galleryRef.load(this.items);\r\n galleryRef.set(currentIndex);\r\n }, 0);\r\n // galleryRef.set(currentIndex);\r\n } else {\r\n galleryRef.load(this.items);\r\n }\r\n }\r\n\r\n onError(e): void {\r\n const noImageSrc = this.fileService.getSvgAsImageSrc(\r\n pepIconNoImage2.data\r\n );\r\n const noimg = new ImageItem({ src: noImageSrc, thumb: noImageSrc });\r\n this.items.splice(e.itemIndex, 1, noimg);\r\n }\r\n\r\n enlargeImage(event: any): void {\r\n const config = this.dialogService.getDialogConfig({}, 'inline');\r\n config.maxWidth = '75vw';\r\n config.height = '95vh';\r\n\r\n const dialogRef = this.dialogService.openDialog(\r\n this.galleryDialogTemplate,\r\n {\r\n currIndex: this.currIndex,\r\n },\r\n config\r\n );\r\n\r\n dialogRef.afterOpened().subscribe(() => {\r\n this.afterDialogOpened();\r\n });\r\n\r\n // Update currentIndex in galleryRef\r\n // dialogRef.afterClosed().subscribe(value => {\r\n // this.galleryRef.set(this.currIndex);\r\n // });\r\n }\r\n\r\n afterDialogOpened(): void {\r\n this.dialogGalleryRef = this.gallery.ref(\r\n `${this.key}-${this.uid}-dlgGallery`\r\n );\r\n this.initGalleryStyle(this.galleryDialogCont, this.dialogGalleryRef);\r\n }\r\n\r\n setThumbnailDimension(galleryContainer): void {\r\n this.galleryWidth = galleryContainer.nativeElement.clientWidth;\r\n // this.galleryHeight = galleryContainer.nativeElement.clientHeight - 32; // TODO - TALK WITH TOMER\r\n this.galleryHeight = this.inDialog\r\n ? galleryContainer.nativeElement.clientHeight - 32\r\n : galleryContainer.nativeElement.clientHeight;\r\n // this.galleryHeight = galleryContainer.nativeElement.clientHeight - 32;\r\n this.cd.detectChanges();\r\n\r\n this.isVertical = this.galleryWidth < this.galleryHeight;\r\n this.cd.detectChanges();\r\n if (this.isVertical) {\r\n let width =\r\n (this.galleryWidth - (this.items.length - 1) * 16) /\r\n this.items.length;\r\n width = Math.min(Math.max(width, 24), 96);\r\n\r\n this.config.thumbHeight = width;\r\n this.config.thumbWidth = width + 16;\r\n } else {\r\n let height =\r\n (this.galleryHeight - (this.items.length - 1) * 16) /\r\n this.items.length;\r\n height = Math.min(Math.max(height, 24), 96);\r\n\r\n this.config.thumbHeight = height + 16;\r\n this.config.thumbWidth = height;\r\n }\r\n\r\n this.config.thumbPosition = this.isVertical\r\n ? ThumbnailsPosition.Bottom\r\n : this.layoutService.isRtl()\r\n ? ThumbnailsPosition.Right\r\n : ThumbnailsPosition.Left;\r\n this.config.slidingDirection =\r\n this.key !== 'ItemFilmstripImages'\r\n ? SlidingDirection.Horizontal\r\n : this.isVertical\r\n ? SlidingDirection.Horizontal\r\n : SlidingDirection.Vertical;\r\n\r\n this.config.imageSize = 'contain';\r\n }\r\n\r\n indexChange(item: any): void {\r\n this.currIndex = item.currIndex;\r\n // if (this.ngxViewerImage && this.ngxViewerImage.scale) {\r\n // this.ngxViewerImage.scale = 1;\r\n // this.updateStyle();\r\n // }\r\n }\r\n\r\n // scrollFunction(e: any): boolean {\r\n // e.deltaY > 0 ? this.zoomOut() : this.zoomIn();\r\n // return false;\r\n // }\r\n\r\n // zoomIn(): void {\r\n // if (this.ngxViewerImage.scale < 2) {\r\n // this.ngxViewerImage.scale = (1 + this.ngxViewerImage.config.zoomFactor);\r\n // } else {\r\n // this.ngxViewerImage.scale = 2;\r\n // }\r\n // this.updateStyle();\r\n // }\r\n\r\n // zoomOut(): void {\r\n // if (this.ngxViewerImage.scale > this.ngxViewerImage.config.zoomFactor) {\r\n // this.ngxViewerImage.scale /= (1 + this.ngxViewerImage.config.zoomFactor);\r\n // }\r\n // this.updateStyle();\r\n // }\r\n\r\n // private updateStyle(): void {\r\n // this.ngxViewerImage.style.transform = `translate(${this.ngxViewerImage.translateX}px,\r\n // ${this.ngxViewerImage.translateY}px) rotate(${this.ngxViewerImage.rotation}deg) scale(${this.ngxViewerImage.scale})`;\r\n\r\n // this.cd.detectChanges();\r\n // }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ReactiveFormsModule } from '@angular/forms';\r\n\r\nimport { MatCommonModule } from '@angular/material/core';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatDialogModule } from '@angular/material/dialog';\r\nimport { MatIconModule } from '@angular/material/icon';\r\n\r\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\r\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\r\nimport {\r\n PepIconModule,\r\n PepIconRegistry,\r\n pepIconSystemEdit,\r\n pepIconSystemClose,\r\n pepIconArrowRightAlt,\r\n pepIconArrowLeftAlt,\r\n} from '@pepperi-addons/ngx-lib/icon';\r\nimport { PepDialogModule } from '@pepperi-addons/ngx-lib/dialog';\r\n\r\nimport { GalleryModule } from 'ng-gallery';\r\nimport { ImageViewerModule } from '@hallysonh/ngx-imageviewer';\r\n\r\nimport { PepImagesFilmstripComponent } from './images-filmstrip.component';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n ReactiveFormsModule,\r\n // Material modules,\r\n MatCommonModule,\r\n MatFormFieldModule,\r\n MatDialogModule,\r\n MatIconModule,\r\n // External modules\r\n GalleryModule,\r\n ImageViewerModule,\r\n // ImageViewerModule.forRoot({\r\n // btnClass: 'default', // The CSS class(es) that will apply to the buttons\r\n // zoomFactor: 0.1, // The amount that the scale will be increased by\r\n // containerBackgroundColor: 'transparent', // The color to use for the background. This can provided in hex, or rgb(a).\r\n // wheelZoom: true, // If true, the mouse wheel can be used to zoom in\r\n // allowFullscreen: false, // If true, the fullscreen button will be shown, allowing the user to entr fullscreen mode\r\n // btnIcons: {\r\n // // The icon classes that will apply to the buttons. By default, font-awesome is used.\r\n // zoomIn: 'fa fa-plus',\r\n // zoomOut: 'fa fa-minus',\r\n // rotateClockwise: 'fa fa-repeat',\r\n // rotateCounterClockwise: 'fa fa-undo',\r\n // next: 'fa fa-arrow-right',\r\n // prev: 'fa fa-arrow-left',\r\n // fullscreen: 'fa fa-arrows-alt'\r\n // }\r\n // }),\r\n // ngx-lib modules\r\n PepNgxLibModule,\r\n PepIconModule,\r\n PepFieldTitleModule,\r\n PepDialogModule,\r\n ],\r\n exports: [PepImagesFilmstripComponent],\r\n declarations: [PepImagesFilmstripComponent],\r\n})\r\nexport class PepImagesFilmstripModule {\r\n constructor(private pepIconRegistry: PepIconRegistry) {\r\n this.pepIconRegistry.registerIcons([\r\n pepIconSystemEdit,\r\n pepIconSystemClose,\r\n pepIconArrowRightAlt,\r\n pepIconArrowLeftAlt,\r\n ]);\r\n }\r\n}\r\n","/\r\n * Public API Surface of ngx-lib/images-filmstrip\r\n /\r\nexport from './images-filmstrip.module';\r\nexport * from './images-filmstrip.component';\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2015/pepperi-addons-ngx-lib-list.js CHANGED Viewed

@@ -2571,7 +2571,7 @@ PepListTotalComponent.decorators = [
     { type: Component, args: [{
                 selector: 'pep-list-total',
                 template: "<div class=\"total-items-container\">\r\n    <ng-container *ngIf=\"isMapView; then mapTemplate; else notMapTemplate\"></ng-container>\r\n\r\n    <ng-template #notMapTemplate>\r\n        <ng-container *ngIf=\"totalRows >= 0\">\r\n            <div class=\"body-{{sizeType}} total-items\"\r\n                [innerHtml]=\"(totalRows === 1 ? 'LIST.TOTAL_RESULT' : 'LIST.TOTAL_RESULTS') | translate: { totalRows: totalRows }\">\r\n            </div>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"totalAmount > 0\"> {{ 'LIST.TOTAL_OF' | translate }} {{ totalAmount }} </ng-container>\r\n    </ng-template>\r\n\r\n    <ng-template #mapTemplate>\r\n        <ng-container *ngIf=\"totalAmount >= 0\">\r\n        </ng-container>\r\n        <ng-container *ngIf=\"totalRows >= 0\">\r\n            <div class=\"body-{{sizeType}} total-items\"\r\n                [innerHtml]=\"(totalRows === 1 ? 'LIST.TOTAL_RESULT_OUT_OF_RESULT' : 'LIST.TOTAL_RESULTS_OUT_OF') | translate: { xRows: totalAmount, totalRows: totalRows }\">\r\n            </div>\r\n        </ng-container>\r\n    </ng-template>\r\n</div>",
-                styles: [".total-items-container{height:calc(.5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));display:flex;align-items:center}"]
+                styles: [".total-items-container{height:calc(.5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));display:flex;align-items:center}", ".total-items{color:rgba(26,26,26,.7);color:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.7)}.total-items .number{color:#1a1a1a;color:hsl(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%))}"]
             },] },
     { type: Injectable }
 ];