@seniorsistemas/angular-components 17.27.1-fix-interactive-content-46e38731 → 17.27.1-fix-interactive-content-22e06381
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.
- package/button/lib/button/button.component.d.ts +3 -3
- package/button/lib/button/button.module.d.ts +1 -6
- package/confirm-dialog/README.md +226 -0
- package/confirm-dialog/index.d.ts +5 -0
- package/confirm-dialog/lib/confirm-dialog.model.d.ts +8 -0
- package/confirm-dialog/lib/confirm-dialog.service.d.ts +8 -0
- package/confirm-dialog/lib/popup-confirm-dialog/popup-confirm-dialog.component.d.ts +7 -0
- package/confirm-dialog/package.json +3 -0
- package/confirm-dialog/public-api.d.ts +2 -0
- package/dialog/index.d.ts +5 -0
- package/dialog/lib/src/dialog/dialog.component.d.ts +29 -0
- package/dialog/lib/src/dialog/models/active-dialog.d.ts +11 -0
- package/dialog/lib/src/dialog/models/dialog-models.d.ts +18 -0
- package/dialog/lib/src/dialog/services/dialog.service.d.ts +24 -0
- package/dialog/lib/src/dialog/services/internal-dialog.service.d.ts +10 -0
- package/dialog/package.json +3 -0
- package/dialog/public-api.d.ts +4 -0
- package/dynamic-form/lib/dynamic-form/components/lookup/lookup.component.d.ts +2 -2
- package/dynamic-form/lib/dynamic-form/dynamic-form.module.d.ts +2 -2
- package/fesm2022/seniorsistemas-angular-components-button.mjs +16 -25
- package/fesm2022/seniorsistemas-angular-components-button.mjs.map +1 -1
- package/fesm2022/seniorsistemas-angular-components-confirm-dialog.mjs +54 -0
- package/fesm2022/seniorsistemas-angular-components-confirm-dialog.mjs.map +1 -0
- package/fesm2022/seniorsistemas-angular-components-dialog.mjs +221 -0
- package/fesm2022/seniorsistemas-angular-components-dialog.mjs.map +1 -0
- package/fesm2022/seniorsistemas-angular-components-dynamic-form.mjs +72 -67
- package/fesm2022/seniorsistemas-angular-components-dynamic-form.mjs.map +1 -1
- package/fesm2022/seniorsistemas-angular-components-fieldset.mjs +11 -7
- package/fesm2022/seniorsistemas-angular-components-fieldset.mjs.map +1 -1
- package/fesm2022/seniorsistemas-angular-components-image-cropper.mjs +15 -10
- package/fesm2022/seniorsistemas-angular-components-image-cropper.mjs.map +1 -1
- package/fesm2022/seniorsistemas-angular-components-interactive-content.mjs +1 -0
- package/fesm2022/seniorsistemas-angular-components-interactive-content.mjs.map +1 -1
- package/fesm2022/seniorsistemas-angular-components-select.mjs +2 -2
- package/fesm2022/seniorsistemas-angular-components-select.mjs.map +1 -1
- package/fesm2022/seniorsistemas-angular-components-structure.mjs +4 -14
- package/fesm2022/seniorsistemas-angular-components-structure.mjs.map +1 -1
- package/fesm2022/seniorsistemas-angular-components-text-area-ia.mjs +22 -15
- package/fesm2022/seniorsistemas-angular-components-text-area-ia.mjs.map +1 -1
- package/fieldset/lib/fieldset/fieldset.component.d.ts +7 -5
- package/image-cropper/lib/image-cropper/image-cropper.component.d.ts +2 -0
- package/image-cropper/lib/image-cropper/image-cropper.module.d.ts +6 -5
- package/package.json +16 -2
- package/structure/lib/structure/header.component.d.ts +0 -2
- package/tailwind.css +65 -2
- package/text-area-ia/lib/text-area-ia/text-area-ia.module.d.ts +7 -6
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { trigger, transition, style, animate, state } from '@angular/animations';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { EventEmitter, Component, Input,
|
|
4
|
-
import {
|
|
3
|
+
import { EventEmitter, Component, Input, ContentChildren, Output, NgModule } from '@angular/core';
|
|
4
|
+
import { TemplateDirective } from 'dist/template';
|
|
5
5
|
import * as i1 from '@angular/common';
|
|
6
6
|
import { CommonModule } from '@angular/common';
|
|
7
7
|
import * as i2 from '@seniorsistemas/angular-components/interactive-content';
|
|
@@ -13,10 +13,14 @@ class FieldsetComponent {
|
|
|
13
13
|
toggleable = false;
|
|
14
14
|
icon = '';
|
|
15
15
|
destroyOnHide = true;
|
|
16
|
+
templateDirectives;
|
|
16
17
|
headerTemplate;
|
|
17
18
|
beforeToggle = new EventEmitter();
|
|
18
19
|
afterToggle = new EventEmitter();
|
|
19
20
|
active = true;
|
|
21
|
+
ngAfterViewInit() {
|
|
22
|
+
this.headerTemplate = this.templateDirectives?.find((template) => template.type === 'header')?.template;
|
|
23
|
+
}
|
|
20
24
|
toggleActive(originalEvent) {
|
|
21
25
|
if (!this.toggleable) {
|
|
22
26
|
return;
|
|
@@ -26,7 +30,7 @@ class FieldsetComponent {
|
|
|
26
30
|
this.afterToggle.next({ collapsed: this.active, originalEvent });
|
|
27
31
|
}
|
|
28
32
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FieldsetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FieldsetComponent, selector: "s-fieldset", inputs: { legend: "legend", toggleable: "toggleable", icon: "icon", destroyOnHide: "destroyOnHide" }, outputs: { beforeToggle: "beforeToggle", afterToggle: "afterToggle" }, queries: [{ propertyName: "
|
|
33
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FieldsetComponent, selector: "s-fieldset", inputs: { legend: "legend", toggleable: "toggleable", icon: "icon", destroyOnHide: "destroyOnHide" }, outputs: { beforeToggle: "beforeToggle", afterToggle: "afterToggle" }, queries: [{ propertyName: "templateDirectives", predicate: TemplateDirective }], ngImport: i0, template: "<fieldset\n class=\"fieldset\"\n [class.fieldset-togglable]=\"toggleable\"\n>\n <legend\n class=\"fieldset-title\"\n (sInteractiveContent)=\"toggleActive($event)\"\n >\n <ng-container *ngIf=\"toggleable\">\n @if (active) {\n <i class=\"fas fa-plus\"></i>\n } @else {\n <i class=\"fas fa-minus\"></i>\n }\n </ng-container>\n @if (headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n } @else {\n <i\n *ngIf=\"icon\"\n [class]=\"icon\"\n ></i>\n {{ legend }}\n }\n </legend>\n @if (destroyOnHide ? (toggleable ? active : true) : true) {\n <div [@toggleAnimation]=\"destroyOnHide ? null : active ? 'open' : 'closed'\">\n <ng-content></ng-content>\n </div>\n }\n</fieldset>\n", styles: [".fieldset{background-color:#fff;border:1px solid #dedce5;border-radius:6px;margin-bottom:10px;min-height:4.5em;padding:6px 8px}.fieldset-title{align-items:center;color:#212533;font-family:Open Sans,sans-serif;font-size:14px;font-weight:700;display:flex;padding:0 4px;gap:4px;margin-left:16px;-webkit-user-select:none;user-select:none}.fieldset-togglable .fieldset-title,.fieldset-togglable .fieldset-title *{cursor:pointer}.hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.InteractiveContentDirective, selector: "[sInteractiveContent]", inputs: ["focusable", "disabled"], outputs: ["sInteractiveContent"] }], animations: [
|
|
30
34
|
trigger('toggleAnimation', [
|
|
31
35
|
transition(':enter', [
|
|
32
36
|
style({ opacity: 0, height: 0 }),
|
|
@@ -58,7 +62,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
58
62
|
state('closed', style({ opacity: 0, height: 0 })),
|
|
59
63
|
transition('open <=> closed', animate('300ms ease')),
|
|
60
64
|
]),
|
|
61
|
-
], template: "<fieldset\n class=\"fieldset\"\n [class.fieldset-togglable]=\"toggleable\"\n>\n <legend\n class=\"fieldset-title\"
|
|
65
|
+
], template: "<fieldset\n class=\"fieldset\"\n [class.fieldset-togglable]=\"toggleable\"\n>\n <legend\n class=\"fieldset-title\"\n (sInteractiveContent)=\"toggleActive($event)\"\n >\n <ng-container *ngIf=\"toggleable\">\n @if (active) {\n <i class=\"fas fa-plus\"></i>\n } @else {\n <i class=\"fas fa-minus\"></i>\n }\n </ng-container>\n @if (headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n } @else {\n <i\n *ngIf=\"icon\"\n [class]=\"icon\"\n ></i>\n {{ legend }}\n }\n </legend>\n @if (destroyOnHide ? (toggleable ? active : true) : true) {\n <div [@toggleAnimation]=\"destroyOnHide ? null : active ? 'open' : 'closed'\">\n <ng-content></ng-content>\n </div>\n }\n</fieldset>\n", styles: [".fieldset{background-color:#fff;border:1px solid #dedce5;border-radius:6px;margin-bottom:10px;min-height:4.5em;padding:6px 8px}.fieldset-title{align-items:center;color:#212533;font-family:Open Sans,sans-serif;font-size:14px;font-weight:700;display:flex;padding:0 4px;gap:4px;margin-left:16px;-webkit-user-select:none;user-select:none}.fieldset-togglable .fieldset-title,.fieldset-togglable .fieldset-title *{cursor:pointer}.hidden{display:none}\n"] }]
|
|
62
66
|
}], propDecorators: { legend: [{
|
|
63
67
|
type: Input
|
|
64
68
|
}], toggleable: [{
|
|
@@ -67,9 +71,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
67
71
|
type: Input
|
|
68
72
|
}], destroyOnHide: [{
|
|
69
73
|
type: Input
|
|
70
|
-
}],
|
|
71
|
-
type:
|
|
72
|
-
args: [
|
|
74
|
+
}], templateDirectives: [{
|
|
75
|
+
type: ContentChildren,
|
|
76
|
+
args: [TemplateDirective]
|
|
73
77
|
}], beforeToggle: [{
|
|
74
78
|
type: Output
|
|
75
79
|
}], afterToggle: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"seniorsistemas-angular-components-fieldset.mjs","sources":["../../projects/angular-components/fieldset/src/lib/fieldset/fieldset.component.ts","../../projects/angular-components/fieldset/src/lib/fieldset/fieldset.component.html","../../projects/angular-components/fieldset/src/lib/fieldset/fieldset.module.ts","../../projects/angular-components/fieldset/src/seniorsistemas-angular-components-fieldset.ts"],"sourcesContent":["import { animate, state, style, transition, trigger } from \"@angular/animations\";\nimport { Component,
|
|
1
|
+
{"version":3,"file":"seniorsistemas-angular-components-fieldset.mjs","sources":["../../projects/angular-components/fieldset/src/lib/fieldset/fieldset.component.ts","../../projects/angular-components/fieldset/src/lib/fieldset/fieldset.component.html","../../projects/angular-components/fieldset/src/lib/fieldset/fieldset.module.ts","../../projects/angular-components/fieldset/src/seniorsistemas-angular-components-fieldset.ts"],"sourcesContent":["import { animate, state, style, transition, trigger } from \"@angular/animations\";\nimport { AfterViewInit, Component, ContentChildren, EventEmitter, Input, Output, QueryList, TemplateRef } from \"@angular/core\";\n\n\nimport { TemplateDirective } from \"dist/template\";\nimport { FieldSetToggle } from \"./fieldset.models\";\n\n@Component({\n selector: \"s-fieldset\",\n templateUrl: \"./fieldset.component.html\",\n styleUrls: [\"./fieldset.component.scss\"],\n animations: [\n trigger('toggleAnimation', [\n transition(':enter', [\n style({ opacity: 0, height: 0 }),\n animate('300ms ease-out', style({ opacity: 1, height: '*' })),\n ]),\n transition(':leave', [\n style({ opacity: 1, height: '*' }),\n animate('300ms ease-in', style({ opacity: 0, height: 0 })),\n ]),\n state('open', style({ opacity: 1, height: '*' })),\n state('closed', style({ opacity: 0, height: 0 })),\n transition('open <=> closed', animate('300ms ease')),\n ]),\n ],\n})\nexport class FieldsetComponent implements AfterViewInit {\n @Input() legend = '';\n @Input() toggleable = false;\n @Input() icon = '';\n @Input() destroyOnHide = true;\n @ContentChildren(TemplateDirective) readonly templateDirectives: QueryList<TemplateDirective> | undefined;\n headerTemplate: TemplateRef<any> | undefined;\n @Output() beforeToggle = new EventEmitter<FieldSetToggle>();\n @Output() afterToggle = new EventEmitter<FieldSetToggle>();\n active = true;\n\n ngAfterViewInit(): void {\n this.headerTemplate = this.templateDirectives?.find((template) => template.type === 'header')?.template;\n }\n\n toggleActive(originalEvent: PointerEvent | KeyboardEvent) {\n if (!this.toggleable) {\n return;\n }\n this.beforeToggle.next({ collapsed: this.active, originalEvent })\n this.active = !this.active;\n this.afterToggle.next({ collapsed: this.active, originalEvent })\n }\n}\n","<fieldset\n class=\"fieldset\"\n [class.fieldset-togglable]=\"toggleable\"\n>\n <legend\n class=\"fieldset-title\"\n (sInteractiveContent)=\"toggleActive($event)\"\n >\n <ng-container *ngIf=\"toggleable\">\n @if (active) {\n <i class=\"fas fa-plus\"></i>\n } @else {\n <i class=\"fas fa-minus\"></i>\n }\n </ng-container>\n @if (headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n } @else {\n <i\n *ngIf=\"icon\"\n [class]=\"icon\"\n ></i>\n {{ legend }}\n }\n </legend>\n @if (destroyOnHide ? (toggleable ? active : true) : true) {\n <div [@toggleAnimation]=\"destroyOnHide ? null : active ? 'open' : 'closed'\">\n <ng-content></ng-content>\n </div>\n }\n</fieldset>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { BrowserAnimationsModule } from '@angular/platform-browser/animations';\n\nimport { InteractiveContentDirective } from '@seniorsistemas/angular-components/interactive-content';\n\nimport { FieldsetComponent } from './fieldset.component';\n\n@NgModule({\n imports: [CommonModule, InteractiveContentDirective, BrowserAnimationsModule],\n declarations: [FieldsetComponent],\n exports: [FieldsetComponent],\n})\nexport class FieldsetModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,19 +1,22 @@
|
|
|
1
1
|
import { CommonModule } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { EventEmitter, Component, ViewEncapsulation, Input, Output, ViewChild, ContentChild, NgModule, Injectable } from '@angular/core';
|
|
4
|
-
import * as i1 from 'primeng/dialog';
|
|
5
|
-
import { DialogModule } from 'primeng/dialog';
|
|
3
|
+
import { inject, EventEmitter, Component, ViewEncapsulation, Input, Output, ViewChild, ContentChild, NgModule, Injectable } from '@angular/core';
|
|
6
4
|
import Cropper from 'cropperjs';
|
|
7
5
|
import { HeaderComponent, FooterComponent, StructureModule } from '@seniorsistemas/angular-components/structure';
|
|
8
6
|
import { isNullOrUndefined } from '@seniorsistemas/angular-components/utils';
|
|
9
|
-
import * as
|
|
7
|
+
import * as i3 from '@seniorsistemas/angular-components/dialog';
|
|
8
|
+
import { ActiveDialog, DialogComponent } from '@seniorsistemas/angular-components/dialog';
|
|
9
|
+
import * as i1 from '@seniorsistemas/angular-components/button';
|
|
10
10
|
import { ButtonModule } from '@seniorsistemas/angular-components/button';
|
|
11
|
-
import * as
|
|
11
|
+
import * as i2 from '@seniorsistemas/angular-components/empty-state';
|
|
12
12
|
import { EmptyStateModule } from '@seniorsistemas/angular-components/empty-state';
|
|
13
|
+
import * as i4 from '@seniorsistemas/angular-components/template';
|
|
14
|
+
import { TemplateModule } from '@seniorsistemas/angular-components/template';
|
|
13
15
|
import { Subject } from 'rxjs';
|
|
14
16
|
import { takeUntil, delay } from 'rxjs/operators';
|
|
15
17
|
|
|
16
18
|
class ImageCropperComponent {
|
|
19
|
+
activeDialog = inject(ActiveDialog, { optional: true });
|
|
17
20
|
static nextId = 0;
|
|
18
21
|
id = `s-image-cropper-${ImageCropperComponent.nextId++}`;
|
|
19
22
|
visible = false;
|
|
@@ -100,6 +103,7 @@ class ImageCropperComponent {
|
|
|
100
103
|
}
|
|
101
104
|
}
|
|
102
105
|
}
|
|
106
|
+
this.visible = false;
|
|
103
107
|
this.visibleChange.emit(false);
|
|
104
108
|
}
|
|
105
109
|
onChangeImage() {
|
|
@@ -110,6 +114,7 @@ class ImageCropperComponent {
|
|
|
110
114
|
this.removedImage.emit();
|
|
111
115
|
}
|
|
112
116
|
onCancel() {
|
|
117
|
+
this.visible = false;
|
|
113
118
|
this.visibleChange.emit(false);
|
|
114
119
|
this.cancel.emit();
|
|
115
120
|
}
|
|
@@ -119,11 +124,11 @@ class ImageCropperComponent {
|
|
|
119
124
|
this.visibleChange.emit(visible);
|
|
120
125
|
}
|
|
121
126
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageCropperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
122
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ImageCropperComponent, selector: "s-image-cropper", inputs: { id: "id", visible: "visible", header: "header", cropLabel: "cropLabel", selectAnotherLabel: "selectAnotherLabel", removeLabel: "removeLabel", cancelLabel: "cancelLabel", emptyStateTitle: "emptyStateTitle", emptyStateActionLabel: "emptyStateActionLabel", emptyStateIconClass: "emptyStateIconClass", aspectRatio: "aspectRatio", rounded: "rounded", allowSelectAnother: "allowSelectAnother", allowRemove: "allowRemove", allowCancel: "allowCancel", imageSource: "imageSource" }, outputs: { visibleChange: "visibleChange", changeImage: "changeImage", croppedImage: "croppedImage", croppedCanvas: "croppedCanvas", removedImage: "removedImage", cancel: "cancel" }, queries: [{ propertyName: "headerSection", first: true, predicate: HeaderComponent, descendants: true, static: true }, { propertyName: "footerSection", first: true, predicate: FooterComponent, descendants: true, static: true }], viewQueries: [{ propertyName: "image", first: true, predicate: ["image"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div [id]=\"id\">\n <p-dialog\n styleClass=\"s-image-cropper {{ rounded ? 's-image-cropper--rounded' : '' }}\"\n [header]=\"headerSection ? '' : header\"\n [visible]=\"visible\"\n (visibleChange)=\"onModalVisibleChange($event)\"\n [modal]=\"true\"\n [blockScroll]=\"true\"\n [draggable]=\"false\"\n [resizable]=\"false\"\n [closeOnEscape]=\"allowCancel\"\n [closable]=\"allowCancel\"\n appendTo=\"body\"\n >\n @if (headerSection) {\n <ng-template #header>\n <ng-content select=\"s-header\"></ng-content>\n </ng-template>\n }\n @if (!imageSource) {\n <s-empty-state\n [id]=\"id + '-empty-state'\"\n [title]=\"emptyStateTitle\"\n [iconClass]=\"emptyStateIconClass\"\n [primaryActionLabel]=\"emptyStateActionLabel\"\n (primaryAction)=\"onChangeImage()\"\n >\n </s-empty-state>\n }\n\n <div\n [attr.data-hidden]=\"!imageSource\"\n class=\"image-container\"\n >\n <img\n [id]=\"id + '-cropper'\"\n #image\n [src]=\"imageSource || ''\"\n alt=\"cropped image\"\n />\n </div>\n <ng-template #footer>\n @if (!footerSection) {\n <div class=\"button-container\">\n @if (allowCancel) {\n <s-button\n [id]=\"id + '-cancel-button'\"\n type=\"button\"\n priority=\"link\"\n [label]=\"cancelLabel\"\n (clicked)=\"onCancel()\"\n >\n </s-button>\n }\n\n <div>\n @if (imageSource && allowRemove) {\n <s-button\n [id]=\"id + '-remove-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"removeLabel\"\n (clicked)=\"onRemoveImage()\"\n >\n </s-button>\n }\n @if (imageSource && allowSelectAnother) {\n <s-button\n [id]=\"id + '-select-another-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"selectAnotherLabel\"\n (clicked)=\"onChangeImage()\"\n >\n </s-button>\n }\n <s-button\n [id]=\"id + '-crop-button'\"\n type=\"button\"\n [label]=\"cropLabel\"\n (clicked)=\"onCropImage()\"\n >\n </s-button>\n </div>\n </div>\n }\n @if (footerSection) {\n <ng-content select=\"s-footer\"> </ng-content>\n }\n </ng-template>\n </p-dialog>\n</div>\n", styles: [".cropper-container{-webkit-touch-callout:none;direction:ltr;font-size:0;line-height:0;position:relative;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cropper-container img{backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{inset:0;position:absolute}.cropper-canvas,.cropper-wrap-box{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:1px solid #39f;outline-color:#3399ffbf;overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:after,.cropper-center:before{background-color:#eee;content:\" \";display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}@media (min-width:768px){.cropper-point.point-se{height:15px;width:15px}}@media (min-width:992px){.cropper-point.point-se{height:10px;width:10px}}@media (min-width:1200px){.cropper-point.point-se{height:5px;opacity:.75;width:5px}}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:\" \";display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}.s-image-cropper{border-radius:0!important;height:80%!important;max-width:100%!important;display:flex;justify-content:space-between;flex-direction:column}.s-image-cropper .ui-dialog-content{overflow:hidden;height:auto!important;flex:1;display:flex;flex-direction:column;justify-content:center}.s-image-cropper .ui-dialog-header,.s-image-cropper .ui-dialog-footer{flex-shrink:0;direction:ltr}.s-image-cropper .image-container{display:flex;align-items:center;justify-content:center;height:100%}.s-image-cropper img{max-width:100%;max-height:100%}.s-image-cropper .button-container{display:flex;justify-content:space-between;width:100%}.s-image-cropper .cropper-view-box{outline:2px dashed #fff}.s-image-cropper .cropper-line{opacity:0}.s-image-cropper .cropper-point{background-color:#fff;opacity:1;height:15px;width:15px;border-radius:50%}.s-image-cropper .cropper-point.point-e{right:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-n{top:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-w{left:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-s{bottom:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-ne{right:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-nw{left:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-sw{left:-8.5px;bottom:-8.5px}.s-image-cropper .cropper-point.point-se{right:-8.5px;bottom:-8.5px}.s-image-cropper--rounded .cropper-view-box,.s-image-cropper--rounded .cropper-face{border-radius:50%}.s-image-cropper--rounded .cropper-view-box{outline:1px dashed rgba(255,255,255,.3)}.s-image-cropper--rounded .cropper-view-box:after{border:2px dashed #fff;border-radius:50%;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}@media (max-width: 767px){.s-image-cropper{border:none!important;top:0!important;left:0!important;width:100%!important;height:100%!important}}@media (min-width: 768px){.s-image-cropper{width:80%!important}}@media (min-width: 1200px){.s-image-cropper{width:60%!important}}\n/*! Bundled license information:\n\ncropperjs/dist/cropper.min.css:\n (*!\n * Cropper.js v1.6.2\n * https://fengyuanchen.github.io/cropperjs\n *\n * Copyright 2015-present Chen Fengyuan\n * Released under the MIT license\n *\n * Date: 2024-04-21T07:43:02.731Z\n *)\n*/\n"], dependencies: [{ kind: "component", type: i1.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "component", type: i2.ButtonComponent, selector: "s-button", inputs: ["id", "label", "tooltip", "tooltipPosition", "iconClass", "rightIconClass", "caret", "styleClass", "baseZIndex", "disabled", "auxiliary", "type", "priority", "menuOptions", "size", "slide", "animation", "badge", "iconColor"], outputs: ["clicked"] }, { kind: "component", type: i3.EmptyStateComponent, selector: "s-empty-state", inputs: ["id", "title", "iconClass", "description", "showPrimaryAction", "showSecondaryAction", "primaryActionLabel", "secondaryActionLabel", "primaryModel"], outputs: ["primaryAction", "secondaryAction"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
127
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ImageCropperComponent, selector: "s-image-cropper", inputs: { id: "id", visible: "visible", header: "header", cropLabel: "cropLabel", selectAnotherLabel: "selectAnotherLabel", removeLabel: "removeLabel", cancelLabel: "cancelLabel", emptyStateTitle: "emptyStateTitle", emptyStateActionLabel: "emptyStateActionLabel", emptyStateIconClass: "emptyStateIconClass", aspectRatio: "aspectRatio", rounded: "rounded", allowSelectAnother: "allowSelectAnother", allowRemove: "allowRemove", allowCancel: "allowCancel", imageSource: "imageSource" }, outputs: { visibleChange: "visibleChange", changeImage: "changeImage", croppedImage: "croppedImage", croppedCanvas: "croppedCanvas", removedImage: "removedImage", cancel: "cancel" }, queries: [{ propertyName: "headerSection", first: true, predicate: HeaderComponent, descendants: true, static: true }, { propertyName: "footerSection", first: true, predicate: FooterComponent, descendants: true, static: true }], viewQueries: [{ propertyName: "image", first: true, predicate: ["image"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div [id]=\"id\">\n @let roundedClass = rounded ? 's-image-cropper--rounded' : '';\n <s-dialog\n size=\"lg\"\n [contentClassName]=\"'s-image-cropper ' + roundedClass\"\n [header]=\"headerSection ? '' : header\"\n [(visible)]=\"visible\"\n (visibleChange)=\"onModalVisibleChange($event!)\"\n [draggable]=\"false\"\n >\n @if (headerSection) {\n <ng-template sTemplate=\"header\">\n <ng-content select=\"s-header\"></ng-content>\n </ng-template>\n }\n @if (!imageSource) {\n <s-empty-state\n [id]=\"id + '-empty-state'\"\n [title]=\"emptyStateTitle\"\n [iconClass]=\"emptyStateIconClass\"\n [primaryActionLabel]=\"emptyStateActionLabel\"\n (primaryAction)=\"onChangeImage()\"\n >\n </s-empty-state>\n }\n <div\n [attr.data-hidden]=\"!imageSource\"\n class=\"image-container\"\n >\n <img\n [id]=\"id + '-cropper'\"\n #image\n [src]=\"imageSource || ''\"\n alt=\"cropped image\"\n />\n </div>\n <ng-template sTemplate=\"footer\">\n @if (!footerSection) {\n <div class=\"button-container\">\n @if (allowCancel) {\n <s-button\n [id]=\"id + '-cancel-button'\"\n type=\"button\"\n priority=\"link\"\n [label]=\"cancelLabel\"\n (clicked)=\"onCancel()\"\n >\n </s-button>\n }\n\n <div>\n @if (imageSource && allowRemove) {\n <s-button\n [id]=\"id + '-remove-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"removeLabel\"\n (clicked)=\"onRemoveImage()\"\n >\n </s-button>\n }\n @if (imageSource && allowSelectAnother) {\n <s-button\n [id]=\"id + '-select-another-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"selectAnotherLabel\"\n (clicked)=\"onChangeImage()\"\n >\n </s-button>\n }\n <s-button\n [id]=\"id + '-crop-button'\"\n type=\"button\"\n [label]=\"cropLabel\"\n (clicked)=\"onCropImage()\"\n >\n </s-button>\n </div>\n </div>\n }\n @if (footerSection) {\n <ng-content select=\"s-footer\"> </ng-content>\n }\n </ng-template>\n </s-dialog>\n</div>\n", styles: [".cropper-container{-webkit-touch-callout:none;direction:ltr;font-size:0;line-height:0;position:relative;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cropper-container img{backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{inset:0;position:absolute}.cropper-canvas,.cropper-wrap-box{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:1px solid #39f;outline-color:#3399ffbf;overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:after,.cropper-center:before{background-color:#eee;content:\" \";display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}@media (min-width:768px){.cropper-point.point-se{height:15px;width:15px}}@media (min-width:992px){.cropper-point.point-se{height:10px;width:10px}}@media (min-width:1200px){.cropper-point.point-se{height:5px;opacity:.75;width:5px}}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:\" \";display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}.s-image-cropper{border-radius:0!important;display:flex;justify-content:space-between;flex-direction:column}.s-image-cropper .image-container{display:flex;align-items:center;justify-content:center;height:100%}.s-image-cropper img{max-width:100%;max-height:100%}.s-image-cropper .button-container{display:flex;justify-content:space-between;width:100%}.s-image-cropper .cropper-view-box{outline:2px dashed #fff}.s-image-cropper .cropper-line{opacity:0}.s-image-cropper .cropper-point{background-color:#fff;opacity:1;height:15px;width:15px;border-radius:50%}.s-image-cropper .cropper-point.point-e{right:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-n{top:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-w{left:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-s{bottom:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-ne{right:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-nw{left:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-sw{left:-8.5px;bottom:-8.5px}.s-image-cropper .cropper-point.point-se{right:-8.5px;bottom:-8.5px}.s-image-cropper--rounded .cropper-view-box,.s-image-cropper--rounded .cropper-face{border-radius:50%}.s-image-cropper--rounded .cropper-view-box{outline:1px dashed rgba(255,255,255,.3)}.s-image-cropper--rounded .cropper-view-box:after{border:2px dashed #fff;border-radius:50%;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}\n/*! Bundled license information:\n\ncropperjs/dist/cropper.min.css:\n (*!\n * Cropper.js v1.6.2\n * https://fengyuanchen.github.io/cropperjs\n *\n * Copyright 2015-present Chen Fengyuan\n * Released under the MIT license\n *\n * Date: 2024-04-21T07:43:02.731Z\n *)\n*/\n"], dependencies: [{ kind: "component", type: i1.ButtonComponent, selector: "s-button", inputs: ["id", "label", "tooltip", "tooltipPosition", "iconClass", "rightIconClass", "caret", "styleClass", "baseZIndex", "disabled", "auxiliary", "type", "priority", "menuOptions", "size", "slide", "animation", "badge", "iconColor"], outputs: ["clicked"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "s-empty-state", inputs: ["id", "title", "iconClass", "description", "showPrimaryAction", "showSecondaryAction", "primaryActionLabel", "secondaryActionLabel", "primaryModel"], outputs: ["primaryAction", "secondaryAction"] }, { kind: "component", type: i3.DialogComponent, selector: "s-dialog", inputs: ["header", "visible", "size", "contentClassName", "escapeOnEsc", "destroyClickOutside"], outputs: ["visibleChange"] }, { kind: "directive", type: i4.TemplateDirective, selector: "[sTemplate]", inputs: ["sTemplate"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
123
128
|
}
|
|
124
129
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageCropperComponent, decorators: [{
|
|
125
130
|
type: Component,
|
|
126
|
-
args: [{ selector: 's-image-cropper', encapsulation: ViewEncapsulation.None, template: "<div [id]=\"id\">\n
|
|
131
|
+
args: [{ selector: 's-image-cropper', encapsulation: ViewEncapsulation.None, template: "<div [id]=\"id\">\n @let roundedClass = rounded ? 's-image-cropper--rounded' : '';\n <s-dialog\n size=\"lg\"\n [contentClassName]=\"'s-image-cropper ' + roundedClass\"\n [header]=\"headerSection ? '' : header\"\n [(visible)]=\"visible\"\n (visibleChange)=\"onModalVisibleChange($event!)\"\n [draggable]=\"false\"\n >\n @if (headerSection) {\n <ng-template sTemplate=\"header\">\n <ng-content select=\"s-header\"></ng-content>\n </ng-template>\n }\n @if (!imageSource) {\n <s-empty-state\n [id]=\"id + '-empty-state'\"\n [title]=\"emptyStateTitle\"\n [iconClass]=\"emptyStateIconClass\"\n [primaryActionLabel]=\"emptyStateActionLabel\"\n (primaryAction)=\"onChangeImage()\"\n >\n </s-empty-state>\n }\n <div\n [attr.data-hidden]=\"!imageSource\"\n class=\"image-container\"\n >\n <img\n [id]=\"id + '-cropper'\"\n #image\n [src]=\"imageSource || ''\"\n alt=\"cropped image\"\n />\n </div>\n <ng-template sTemplate=\"footer\">\n @if (!footerSection) {\n <div class=\"button-container\">\n @if (allowCancel) {\n <s-button\n [id]=\"id + '-cancel-button'\"\n type=\"button\"\n priority=\"link\"\n [label]=\"cancelLabel\"\n (clicked)=\"onCancel()\"\n >\n </s-button>\n }\n\n <div>\n @if (imageSource && allowRemove) {\n <s-button\n [id]=\"id + '-remove-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"removeLabel\"\n (clicked)=\"onRemoveImage()\"\n >\n </s-button>\n }\n @if (imageSource && allowSelectAnother) {\n <s-button\n [id]=\"id + '-select-another-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"selectAnotherLabel\"\n (clicked)=\"onChangeImage()\"\n >\n </s-button>\n }\n <s-button\n [id]=\"id + '-crop-button'\"\n type=\"button\"\n [label]=\"cropLabel\"\n (clicked)=\"onCropImage()\"\n >\n </s-button>\n </div>\n </div>\n }\n @if (footerSection) {\n <ng-content select=\"s-footer\"> </ng-content>\n }\n </ng-template>\n </s-dialog>\n</div>\n", styles: [".cropper-container{-webkit-touch-callout:none;direction:ltr;font-size:0;line-height:0;position:relative;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cropper-container img{backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{inset:0;position:absolute}.cropper-canvas,.cropper-wrap-box{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:1px solid #39f;outline-color:#3399ffbf;overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:after,.cropper-center:before{background-color:#eee;content:\" \";display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}@media (min-width:768px){.cropper-point.point-se{height:15px;width:15px}}@media (min-width:992px){.cropper-point.point-se{height:10px;width:10px}}@media (min-width:1200px){.cropper-point.point-se{height:5px;opacity:.75;width:5px}}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:\" \";display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}.s-image-cropper{border-radius:0!important;display:flex;justify-content:space-between;flex-direction:column}.s-image-cropper .image-container{display:flex;align-items:center;justify-content:center;height:100%}.s-image-cropper img{max-width:100%;max-height:100%}.s-image-cropper .button-container{display:flex;justify-content:space-between;width:100%}.s-image-cropper .cropper-view-box{outline:2px dashed #fff}.s-image-cropper .cropper-line{opacity:0}.s-image-cropper .cropper-point{background-color:#fff;opacity:1;height:15px;width:15px;border-radius:50%}.s-image-cropper .cropper-point.point-e{right:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-n{top:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-w{left:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-s{bottom:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-ne{right:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-nw{left:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-sw{left:-8.5px;bottom:-8.5px}.s-image-cropper .cropper-point.point-se{right:-8.5px;bottom:-8.5px}.s-image-cropper--rounded .cropper-view-box,.s-image-cropper--rounded .cropper-face{border-radius:50%}.s-image-cropper--rounded .cropper-view-box{outline:1px dashed rgba(255,255,255,.3)}.s-image-cropper--rounded .cropper-view-box:after{border:2px dashed #fff;border-radius:50%;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}\n/*! Bundled license information:\n\ncropperjs/dist/cropper.min.css:\n (*!\n * Cropper.js v1.6.2\n * https://fengyuanchen.github.io/cropperjs\n *\n * Copyright 2015-present Chen Fengyuan\n * Released under the MIT license\n *\n * Date: 2024-04-21T07:43:02.731Z\n *)\n*/\n"] }]
|
|
127
132
|
}], propDecorators: { id: [{
|
|
128
133
|
type: Input
|
|
129
134
|
}], visible: [{
|
|
@@ -181,13 +186,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
181
186
|
|
|
182
187
|
class ImageCropperModule {
|
|
183
188
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageCropperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
184
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ImageCropperModule, declarations: [ImageCropperComponent], imports: [CommonModule,
|
|
185
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageCropperModule, imports: [CommonModule,
|
|
189
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ImageCropperModule, declarations: [ImageCropperComponent], imports: [CommonModule, ButtonModule, EmptyStateModule, StructureModule, DialogComponent, TemplateModule], exports: [ImageCropperComponent, StructureModule] });
|
|
190
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageCropperModule, imports: [CommonModule, ButtonModule, EmptyStateModule, StructureModule, DialogComponent, TemplateModule, StructureModule] });
|
|
186
191
|
}
|
|
187
192
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageCropperModule, decorators: [{
|
|
188
193
|
type: NgModule,
|
|
189
194
|
args: [{
|
|
190
|
-
imports: [CommonModule,
|
|
195
|
+
imports: [CommonModule, ButtonModule, EmptyStateModule, StructureModule, DialogComponent, TemplateModule],
|
|
191
196
|
declarations: [ImageCropperComponent],
|
|
192
197
|
exports: [ImageCropperComponent, StructureModule],
|
|
193
198
|
}]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"seniorsistemas-angular-components-image-cropper.mjs","sources":["../../projects/angular-components/image-cropper/src/lib/image-cropper/image-cropper.component.ts","../../projects/angular-components/image-cropper/src/lib/image-cropper/image-cropper.component.html","../../projects/angular-components/image-cropper/src/lib/image-cropper/image-cropper.module.ts","../../projects/angular-components/image-cropper/src/lib/image-cropper/image-cropper.service.ts","../../projects/angular-components/image-cropper/src/seniorsistemas-angular-components-image-cropper.ts"],"sourcesContent":["import {\n Component,\n ContentChild,\n ElementRef,\n EventEmitter,\n Input,\n OnChanges,\n OnInit,\n Output,\n SimpleChanges,\n ViewChild,\n ViewEncapsulation\n} from '@angular/core';\nimport Cropper from 'cropperjs';\nimport { FooterComponent, HeaderComponent } from '@seniorsistemas/angular-components/structure';\nimport { isNullOrUndefined } from '@seniorsistemas/angular-components/utils';\n\n@Component({\n selector: 's-image-cropper',\n templateUrl: './image-cropper.component.html',\n styleUrls: ['./image-cropper.component.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class ImageCropperComponent implements OnInit, OnChanges {\n public static nextId = 0;\n\n @Input()\n public id = `s-image-cropper-${ImageCropperComponent.nextId++}`;\n\n @Input()\n public visible = false;\n\n @Input()\n public header = 'Recortar imagem';\n\n @Input()\n public cropLabel = 'Recortar';\n\n @Input()\n public selectAnotherLabel = 'Trocar';\n\n @Input()\n public removeLabel = 'Remover';\n\n @Input()\n public cancelLabel = 'Cancelar';\n\n @Input()\n public emptyStateTitle = 'Selecione uma foto, em seguida você poderá ajustá-la';\n\n @Input()\n public emptyStateActionLabel = 'Escolher imagem';\n\n @Input()\n public emptyStateIconClass = 'fa fa-picture-o';\n\n @Input()\n public aspectRatio = NaN;\n\n @Input()\n public rounded = false;\n\n @Input()\n public allowSelectAnother = true;\n\n @Input()\n public allowRemove = true;\n\n @Input()\n public allowCancel = true;\n\n @Input()\n public imageSource?: string;\n\n @Output()\n public visibleChange = new EventEmitter<boolean>();\n\n @Output()\n public changeImage = new EventEmitter();\n\n @Output()\n public croppedImage = new EventEmitter<string>();\n\n @Output()\n public croppedCanvas = new EventEmitter<HTMLCanvasElement>();\n\n @Output()\n public removedImage = new EventEmitter();\n\n @Output()\n // eslint-disable-next-line @angular-eslint/no-output-native\n public cancel = new EventEmitter();\n\n @ViewChild('image', { static: true })\n public image: ElementRef<HTMLImageElement> | null = null;\n\n @ContentChild(HeaderComponent, { static: true })\n public headerSection: HeaderComponent | null = null;\n\n @ContentChild(FooterComponent, { static: true })\n public footerSection: FooterComponent | null = null;\n\n public cropper: Cropper | null = null;\n\n public ngOnInit() {\n if (this.imageSource) this.initCropper();\n }\n\n public ngOnChanges(changes: SimpleChanges) {\n if (changes['imageSource'] && changes['imageSource'].currentValue) {\n this.initCropper();\n }\n }\n\n private initCropper() {\n if (isNullOrUndefined(this.image)) {\n return\n };\n if (this.cropper) {\n this.cropper.destroy();\n }\n this.image.nativeElement.src = this.imageSource as string;\n this.cropper = new Cropper(this.image.nativeElement, {\n aspectRatio: this.rounded ? 1 : this.aspectRatio,\n guides: false,\n dragMode: 'move' as Cropper.DragMode,\n minCropBoxHeight: 2,\n minCropBoxWidth: 2,\n toggleDragModeOnDblclick: false,\n });\n }\n\n public getRoundedCanvas(sourceCanvas: HTMLCanvasElement): HTMLCanvasElement | null {\n const canvas = document.createElement('canvas');\n const context = canvas.getContext('2d');\n\n if (isNullOrUndefined(context)) return null;\n\n const width = sourceCanvas.width;\n const height = sourceCanvas.height;\n\n canvas.width = width;\n canvas.height = height;\n\n context.imageSmoothingEnabled = true;\n context.drawImage(sourceCanvas, 0, 0, width, height);\n context.globalCompositeOperation = 'destination-in';\n context.beginPath();\n context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);\n context.fill();\n\n return canvas;\n }\n\n public onCropImage() {\n if (!this.imageSource) {\n this.croppedImage.emit();\n this.croppedCanvas.emit();\n } else {\n const cropperCanvas = this.cropper?.getCroppedCanvas();\n if (cropperCanvas) {\n const canvas = this.rounded ? this.getRoundedCanvas(cropperCanvas) : cropperCanvas;\n if (canvas) {\n this.croppedCanvas.emit(canvas);\n this.croppedImage.emit(canvas.toDataURL());\n }\n }\n }\n\n this.visibleChange.emit(false);\n }\n\n public onChangeImage() {\n this.changeImage.emit();\n }\n\n public onRemoveImage() {\n this.imageSource = undefined;\n this.removedImage.emit();\n }\n\n public onCancel() {\n this.visibleChange.emit(false);\n this.cancel.emit();\n }\n\n public onModalVisibleChange(visible: boolean) {\n if (!visible) this.onCancel();\n this.visibleChange.emit(visible);\n }\n}\n","<div [id]=\"id\">\n <p-dialog\n styleClass=\"s-image-cropper {{ rounded ? 's-image-cropper--rounded' : '' }}\"\n [header]=\"headerSection ? '' : header\"\n [visible]=\"visible\"\n (visibleChange)=\"onModalVisibleChange($event)\"\n [modal]=\"true\"\n [blockScroll]=\"true\"\n [draggable]=\"false\"\n [resizable]=\"false\"\n [closeOnEscape]=\"allowCancel\"\n [closable]=\"allowCancel\"\n appendTo=\"body\"\n >\n @if (headerSection) {\n <ng-template #header>\n <ng-content select=\"s-header\"></ng-content>\n </ng-template>\n }\n @if (!imageSource) {\n <s-empty-state\n [id]=\"id + '-empty-state'\"\n [title]=\"emptyStateTitle\"\n [iconClass]=\"emptyStateIconClass\"\n [primaryActionLabel]=\"emptyStateActionLabel\"\n (primaryAction)=\"onChangeImage()\"\n >\n </s-empty-state>\n }\n\n <div\n [attr.data-hidden]=\"!imageSource\"\n class=\"image-container\"\n >\n <img\n [id]=\"id + '-cropper'\"\n #image\n [src]=\"imageSource || ''\"\n alt=\"cropped image\"\n />\n </div>\n <ng-template #footer>\n @if (!footerSection) {\n <div class=\"button-container\">\n @if (allowCancel) {\n <s-button\n [id]=\"id + '-cancel-button'\"\n type=\"button\"\n priority=\"link\"\n [label]=\"cancelLabel\"\n (clicked)=\"onCancel()\"\n >\n </s-button>\n }\n\n <div>\n @if (imageSource && allowRemove) {\n <s-button\n [id]=\"id + '-remove-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"removeLabel\"\n (clicked)=\"onRemoveImage()\"\n >\n </s-button>\n }\n @if (imageSource && allowSelectAnother) {\n <s-button\n [id]=\"id + '-select-another-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"selectAnotherLabel\"\n (clicked)=\"onChangeImage()\"\n >\n </s-button>\n }\n <s-button\n [id]=\"id + '-crop-button'\"\n type=\"button\"\n [label]=\"cropLabel\"\n (clicked)=\"onCropImage()\"\n >\n </s-button>\n </div>\n </div>\n }\n @if (footerSection) {\n <ng-content select=\"s-footer\"> </ng-content>\n }\n </ng-template>\n </p-dialog>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DialogModule } from 'primeng/dialog';\n\n\nimport { ImageCropperComponent } from './image-cropper.component';\nimport { ButtonModule } from '@seniorsistemas/angular-components/button';\nimport { StructureModule } from '@seniorsistemas/angular-components/structure';\nimport { EmptyStateModule } from '@seniorsistemas/angular-components/empty-state';\n\n@NgModule({\n imports: [CommonModule, DialogModule, ButtonModule, EmptyStateModule, StructureModule],\n declarations: [ImageCropperComponent],\n exports: [ImageCropperComponent, StructureModule],\n})\nexport class ImageCropperModule { }\n","import {\n ApplicationRef,\n ComponentFactoryResolver,\n ComponentRef,\n EmbeddedViewRef,\n Injectable,\n Injector,\n} from '@angular/core';\n\nimport { Subject } from 'rxjs';\nimport { delay, takeUntil } from 'rxjs/operators';\n\nimport { ImageCropperComponent } from './image-cropper.component';\nimport { isNullOrUndefined } from '@seniorsistemas/angular-components/utils';\n\n@Injectable()\nexport class ImageCropperService {\n public activeCropper?: ActiveCropper;\n\n constructor(\n private readonly _componentFactoryResolver: ComponentFactoryResolver,\n private readonly _appRef: ApplicationRef,\n private readonly _injector: Injector,\n ) { }\n\n public show(config?: ImageCropperConfig): void {\n if (this.activeCropper) this._destroy(this.activeCropper);\n\n const activeCropper: ActiveCropper = {\n componentRef: this._componentFactoryResolver\n .resolveComponentFactory(ImageCropperComponent)\n .create(this._injector),\n ngUnsubscribe: new Subject<void>(),\n };\n\n this.activeCropper = activeCropper;\n\n if (isNullOrUndefined(activeCropper.componentRef)) return;\n\n this._appRef.attachView(activeCropper.componentRef.hostView);\n const domElem = (activeCropper.componentRef.hostView as EmbeddedViewRef<any>).rootNodes[0] as HTMLElement;\n document.body.appendChild(domElem);\n\n this._configureInstance(activeCropper, config);\n activeCropper.componentRef.instance.visible = true;\n\n activeCropper.componentRef.instance.visibleChange\n .pipe(takeUntil(this.activeCropper.ngUnsubscribe!), delay(1000))\n .subscribe((visible) => {\n if (!visible) this._destroy(activeCropper);\n });\n }\n\n private _configureInstance(activeCropper: ActiveCropper, config?: ImageCropperConfig): void {\n const instance: any = activeCropper.componentRef?.instance;\n\n if (config) {\n Object.keys(config).forEach((key) => {\n const value = (config as any)[key];\n if (typeof value !== 'function') instance[key] = value;\n else if (typeof value === 'function') {\n instance[key]\n .pipe(takeUntil(activeCropper.ngUnsubscribe!))\n .subscribe((...param: any[]) => (config as any)[key](...param));\n }\n });\n }\n\n instance.visibleChange\n .pipe(takeUntil(activeCropper.ngUnsubscribe!))\n .subscribe((visible: any) => (instance.visible = visible));\n }\n\n private _destroy(activeCropper: ActiveCropper): void {\n activeCropper.ngUnsubscribe!.next();\n activeCropper.ngUnsubscribe!.complete();\n\n if (isNullOrUndefined(activeCropper.componentRef)) return;\n\n this._appRef.detachView(activeCropper.componentRef.hostView);\n activeCropper.componentRef.destroy();\n }\n}\n\nexport interface ActiveCropper {\n componentRef?: ComponentRef<ImageCropperComponent>;\n ngUnsubscribe?: Subject<void>;\n}\n\nexport interface ImageCropperConfig {\n id?: any;\n header?: string;\n cropLabel?: string;\n selectAnotherLabel?: string;\n removeLabel?: string;\n cancelLabel?: string;\n emptyStateTitle?: string;\n emptyStateActionLabel?: string;\n emptyStateIconClass?: string;\n aspectRatio?: number;\n rounded?: boolean;\n allowSelectAnother?: boolean;\n allowRemove?: boolean;\n allowCancel?: boolean;\n imageSource?: string;\n\n cancel?: () => any;\n changeImage?: () => any;\n removedImage?: () => any;\n croppedImage?: (imageSource: string) => any;\n croppedCanvas?: (imageSource: HTMLCanvasElement) => any;\n}\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":"seniorsistemas-angular-components-image-cropper.mjs","sources":["../../projects/angular-components/image-cropper/src/lib/image-cropper/image-cropper.component.ts","../../projects/angular-components/image-cropper/src/lib/image-cropper/image-cropper.component.html","../../projects/angular-components/image-cropper/src/lib/image-cropper/image-cropper.module.ts","../../projects/angular-components/image-cropper/src/lib/image-cropper/image-cropper.service.ts","../../projects/angular-components/image-cropper/src/seniorsistemas-angular-components-image-cropper.ts"],"sourcesContent":["import {\n Component,\n ContentChild,\n ElementRef,\n EventEmitter,\n inject,\n Input,\n OnChanges,\n OnInit,\n Output,\n SimpleChanges,\n ViewChild,\n ViewEncapsulation\n} from '@angular/core';\nimport Cropper from 'cropperjs';\nimport { FooterComponent, HeaderComponent } from '@seniorsistemas/angular-components/structure';\nimport { isNullOrUndefined } from '@seniorsistemas/angular-components/utils';\nimport { ActiveDialog } from '@seniorsistemas/angular-components/dialog';\n\n@Component({\n selector: 's-image-cropper',\n templateUrl: './image-cropper.component.html',\n styleUrls: ['./image-cropper.component.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class ImageCropperComponent implements OnInit, OnChanges {\n activeDialog = inject(ActiveDialog, { optional: true });\n public static nextId = 0;\n\n @Input()\n public id = `s-image-cropper-${ImageCropperComponent.nextId++}`;\n\n @Input()\n public visible = false;\n\n @Input()\n public header = 'Recortar imagem';\n\n @Input()\n public cropLabel = 'Recortar';\n\n @Input()\n public selectAnotherLabel = 'Trocar';\n\n @Input()\n public removeLabel = 'Remover';\n\n @Input()\n public cancelLabel = 'Cancelar';\n\n @Input()\n public emptyStateTitle = 'Selecione uma foto, em seguida você poderá ajustá-la';\n\n @Input()\n public emptyStateActionLabel = 'Escolher imagem';\n\n @Input()\n public emptyStateIconClass = 'fa fa-picture-o';\n\n @Input()\n public aspectRatio = NaN;\n\n @Input()\n public rounded = false;\n\n @Input()\n public allowSelectAnother = true;\n\n @Input()\n public allowRemove = true;\n\n @Input()\n public allowCancel = true;\n\n @Input()\n public imageSource?: string;\n\n @Output()\n public visibleChange = new EventEmitter<boolean>();\n\n @Output()\n public changeImage = new EventEmitter();\n\n @Output()\n public croppedImage = new EventEmitter<string>();\n\n @Output()\n public croppedCanvas = new EventEmitter<HTMLCanvasElement>();\n\n @Output()\n public removedImage = new EventEmitter();\n\n @Output()\n // eslint-disable-next-line @angular-eslint/no-output-native\n public cancel = new EventEmitter();\n\n @ViewChild('image', { static: true })\n public image: ElementRef<HTMLImageElement> | null = null;\n\n @ContentChild(HeaderComponent, { static: true })\n public headerSection: HeaderComponent | null = null;\n\n @ContentChild(FooterComponent, { static: true })\n public footerSection: FooterComponent | null = null;\n\n public cropper: Cropper | null = null;\n\n public ngOnInit() {\n if (this.imageSource) this.initCropper();\n }\n\n public ngOnChanges(changes: SimpleChanges) {\n if (changes['imageSource'] && changes['imageSource'].currentValue) {\n this.initCropper();\n }\n }\n\n private initCropper() {\n if (isNullOrUndefined(this.image)) {\n return\n };\n if (this.cropper) {\n this.cropper.destroy();\n }\n this.image.nativeElement.src = this.imageSource as string;\n this.cropper = new Cropper(this.image.nativeElement, {\n aspectRatio: this.rounded ? 1 : this.aspectRatio,\n guides: false,\n dragMode: 'move' as Cropper.DragMode,\n minCropBoxHeight: 2,\n minCropBoxWidth: 2,\n toggleDragModeOnDblclick: false,\n });\n }\n\n public getRoundedCanvas(sourceCanvas: HTMLCanvasElement): HTMLCanvasElement | null {\n const canvas = document.createElement('canvas');\n const context = canvas.getContext('2d');\n\n if (isNullOrUndefined(context)) return null;\n\n const width = sourceCanvas.width;\n const height = sourceCanvas.height;\n\n canvas.width = width;\n canvas.height = height;\n\n context.imageSmoothingEnabled = true;\n context.drawImage(sourceCanvas, 0, 0, width, height);\n context.globalCompositeOperation = 'destination-in';\n context.beginPath();\n context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);\n context.fill();\n\n return canvas;\n }\n\n public onCropImage() {\n if (!this.imageSource) {\n this.croppedImage.emit();\n this.croppedCanvas.emit();\n } else {\n const cropperCanvas = this.cropper?.getCroppedCanvas();\n if (cropperCanvas) {\n const canvas = this.rounded ? this.getRoundedCanvas(cropperCanvas) : cropperCanvas;\n if (canvas) {\n this.croppedCanvas.emit(canvas);\n this.croppedImage.emit(canvas.toDataURL());\n }\n }\n }\n this.visible = false;\n this.visibleChange.emit(false);\n }\n\n public onChangeImage() {\n this.changeImage.emit();\n }\n\n public onRemoveImage() {\n this.imageSource = undefined;\n this.removedImage.emit();\n }\n\n public onCancel() {\n this.visible = false;\n this.visibleChange.emit(false);\n this.cancel.emit();\n }\n\n public onModalVisibleChange(visible: boolean) {\n if (!visible) this.onCancel();\n this.visibleChange.emit(visible);\n }\n}\n","<div [id]=\"id\">\n @let roundedClass = rounded ? 's-image-cropper--rounded' : '';\n <s-dialog\n size=\"lg\"\n [contentClassName]=\"'s-image-cropper ' + roundedClass\"\n [header]=\"headerSection ? '' : header\"\n [(visible)]=\"visible\"\n (visibleChange)=\"onModalVisibleChange($event!)\"\n [draggable]=\"false\"\n >\n @if (headerSection) {\n <ng-template sTemplate=\"header\">\n <ng-content select=\"s-header\"></ng-content>\n </ng-template>\n }\n @if (!imageSource) {\n <s-empty-state\n [id]=\"id + '-empty-state'\"\n [title]=\"emptyStateTitle\"\n [iconClass]=\"emptyStateIconClass\"\n [primaryActionLabel]=\"emptyStateActionLabel\"\n (primaryAction)=\"onChangeImage()\"\n >\n </s-empty-state>\n }\n <div\n [attr.data-hidden]=\"!imageSource\"\n class=\"image-container\"\n >\n <img\n [id]=\"id + '-cropper'\"\n #image\n [src]=\"imageSource || ''\"\n alt=\"cropped image\"\n />\n </div>\n <ng-template sTemplate=\"footer\">\n @if (!footerSection) {\n <div class=\"button-container\">\n @if (allowCancel) {\n <s-button\n [id]=\"id + '-cancel-button'\"\n type=\"button\"\n priority=\"link\"\n [label]=\"cancelLabel\"\n (clicked)=\"onCancel()\"\n >\n </s-button>\n }\n\n <div>\n @if (imageSource && allowRemove) {\n <s-button\n [id]=\"id + '-remove-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"removeLabel\"\n (clicked)=\"onRemoveImage()\"\n >\n </s-button>\n }\n @if (imageSource && allowSelectAnother) {\n <s-button\n [id]=\"id + '-select-another-button'\"\n type=\"button\"\n priority=\"secondary\"\n [label]=\"selectAnotherLabel\"\n (clicked)=\"onChangeImage()\"\n >\n </s-button>\n }\n <s-button\n [id]=\"id + '-crop-button'\"\n type=\"button\"\n [label]=\"cropLabel\"\n (clicked)=\"onCropImage()\"\n >\n </s-button>\n </div>\n </div>\n }\n @if (footerSection) {\n <ng-content select=\"s-footer\"> </ng-content>\n }\n </ng-template>\n </s-dialog>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\n\nimport { ImageCropperComponent } from './image-cropper.component';\nimport { ButtonModule } from '@seniorsistemas/angular-components/button';\nimport { StructureModule } from '@seniorsistemas/angular-components/structure';\nimport { EmptyStateModule } from '@seniorsistemas/angular-components/empty-state';\nimport { DialogComponent } from '@seniorsistemas/angular-components/dialog';\nimport { TemplateDirective, TemplateModule } from '@seniorsistemas/angular-components/template';\n\n@NgModule({\n imports: [CommonModule, ButtonModule, EmptyStateModule, StructureModule, DialogComponent, TemplateModule],\n declarations: [ImageCropperComponent],\n exports: [ImageCropperComponent, StructureModule],\n})\nexport class ImageCropperModule { }\n","import {\n ApplicationRef,\n ComponentFactoryResolver,\n ComponentRef,\n EmbeddedViewRef,\n Injectable,\n Injector,\n} from '@angular/core';\n\nimport { Subject } from 'rxjs';\nimport { delay, takeUntil } from 'rxjs/operators';\n\nimport { ImageCropperComponent } from './image-cropper.component';\nimport { isNullOrUndefined } from '@seniorsistemas/angular-components/utils';\nimport { toObservable } from '@angular/core/rxjs-interop';\n\n@Injectable()\nexport class ImageCropperService {\n public activeCropper?: ActiveCropper;\n\n constructor(\n private readonly _componentFactoryResolver: ComponentFactoryResolver,\n private readonly _appRef: ApplicationRef,\n private readonly _injector: Injector,\n ) { }\n\n public show(config?: ImageCropperConfig): void {\n if (this.activeCropper) this._destroy(this.activeCropper);\n\n const activeCropper: ActiveCropper = {\n componentRef: this._componentFactoryResolver\n .resolveComponentFactory(ImageCropperComponent)\n .create(this._injector),\n ngUnsubscribe: new Subject<void>(),\n };\n\n this.activeCropper = activeCropper;\n\n if (isNullOrUndefined(activeCropper.componentRef)) return;\n\n this._appRef.attachView(activeCropper.componentRef.hostView);\n const domElem = (activeCropper.componentRef.hostView as EmbeddedViewRef<any>).rootNodes[0] as HTMLElement;\n document.body.appendChild(domElem);\n\n this._configureInstance(activeCropper, config);\n activeCropper.componentRef.instance.visible = true;\n\n activeCropper.componentRef.instance.visibleChange\n .pipe(takeUntil(this.activeCropper.ngUnsubscribe!), delay(1000))\n .subscribe((visible) => {\n if (!visible) this._destroy(activeCropper);\n });\n }\n\n private _configureInstance(activeCropper: ActiveCropper, config?: ImageCropperConfig): void {\n const instance: any = activeCropper.componentRef?.instance;\n\n if (config) {\n Object.keys(config).forEach((key) => {\n const value = (config as any)[key];\n if (typeof value !== 'function') instance[key] = value;\n else if (typeof value === 'function') {\n instance[key]\n .pipe(takeUntil(activeCropper.ngUnsubscribe!))\n .subscribe((...param: any[]) => (config as any)[key](...param));\n }\n });\n }\n\n instance.visibleChange\n .pipe(takeUntil(activeCropper.ngUnsubscribe!))\n .subscribe((visible: any) => (instance.visible = visible));\n }\n\n private _destroy(activeCropper: ActiveCropper): void {\n activeCropper.ngUnsubscribe!.next();\n activeCropper.ngUnsubscribe!.complete();\n\n if (isNullOrUndefined(activeCropper.componentRef)) return;\n\n this._appRef.detachView(activeCropper.componentRef.hostView);\n activeCropper.componentRef.destroy();\n }\n}\n\nexport interface ActiveCropper {\n componentRef?: ComponentRef<ImageCropperComponent>;\n ngUnsubscribe?: Subject<void>;\n}\n\nexport interface ImageCropperConfig {\n id?: any;\n header?: string;\n cropLabel?: string;\n selectAnotherLabel?: string;\n removeLabel?: string;\n cancelLabel?: string;\n emptyStateTitle?: string;\n emptyStateActionLabel?: string;\n emptyStateIconClass?: string;\n aspectRatio?: number;\n rounded?: boolean;\n allowSelectAnother?: boolean;\n allowRemove?: boolean;\n allowCancel?: boolean;\n imageSource?: string;\n\n cancel?: () => any;\n changeImage?: () => any;\n removedImage?: () => any;\n croppedImage?: (imageSource: string) => any;\n croppedCanvas?: (imageSource: HTMLCanvasElement) => any;\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"seniorsistemas-angular-components-interactive-content.mjs","sources":["../../projects/angular-components/interactive-content/src/lib/interactive-content/interactive-content.directive.ts","../../projects/angular-components/interactive-content/src/seniorsistemas-angular-components-interactive-content.ts"],"sourcesContent":["import { Directive, ElementRef, OnInit, OnDestroy, input, output } from '@angular/core';\n\n@Directive({\n selector: '[sInteractiveContent]',\n standalone: true,\n})\nexport class InteractiveContentDirective implements OnInit, OnDestroy {\n public activated = output<PointerEvent | KeyboardEvent>({ alias: 'sInteractiveContent' });\n public focusable = input(true);\n public disabled = input(false);\n\n private readonly EVENT_LISTENER = (event: Event) => {\n if (this.disabled()) {\n return;\n }\n\n if (event instanceof KeyboardEvent) {\n const key = event.key;\n const validKeys = ['Enter', ' '];\n if (!validKeys.includes(key)) {\n return;\n }\n }\n this.activated.emit(event as PointerEvent | KeyboardEvent);\n };\n\n constructor(private readonly elementRef: ElementRef<HTMLElement>) {}\n\n public ngOnInit(): void {\n this.setTabIndex();\n this.checkAccessbilityEvents();\n }\n\n private setTabIndex() {\n if (this.disabled() || !this.focusable()) {\n this.element.tabIndex = -1;\n return;\n }\n\n if (this.element.tabIndex === undefined || this.element.tabIndex < 0) {\n this.element.tabIndex = 0;\n }\n }\n\n private checkAccessbilityEvents() {\n this.element.addEventListener('click', this.EVENT_LISTENER);\n this.element.addEventListener('keydown', this.EVENT_LISTENER);\n }\n\n private get element() {\n return this.elementRef.nativeElement;\n }\n\n ngOnDestroy(): void {\n this.element.removeEventListener('click', this.EVENT_LISTENER);\n this.element.removeEventListener('keydown', this.EVENT_LISTENER);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAMa,2BAA2B,CAAA;
|
|
1
|
+
{"version":3,"file":"seniorsistemas-angular-components-interactive-content.mjs","sources":["../../projects/angular-components/interactive-content/src/lib/interactive-content/interactive-content.directive.ts","../../projects/angular-components/interactive-content/src/seniorsistemas-angular-components-interactive-content.ts"],"sourcesContent":["import { Directive, ElementRef, OnInit, OnDestroy, input, output } from '@angular/core';\n\n@Directive({\n selector: '[sInteractiveContent]',\n standalone: true,\n})\nexport class InteractiveContentDirective implements OnInit, OnDestroy {\n public activated = output<PointerEvent | KeyboardEvent>({ alias: 'sInteractiveContent' });\n public focusable = input(true);\n public disabled = input(false);\n\n private readonly EVENT_LISTENER = (event: Event) => {\n if (this.disabled()) {\n return;\n }\n\n if (event instanceof KeyboardEvent) {\n const key = event.key;\n const validKeys = ['Enter', ' '];\n if (!validKeys.includes(key)) {\n return;\n }\n event.preventDefault();\n }\n this.activated.emit(event as PointerEvent | KeyboardEvent);\n };\n\n constructor(private readonly elementRef: ElementRef<HTMLElement>) {}\n\n public ngOnInit(): void {\n this.setTabIndex();\n this.checkAccessbilityEvents();\n }\n\n private setTabIndex() {\n if (this.disabled() || !this.focusable()) {\n this.element.tabIndex = -1;\n return;\n }\n\n if (this.element.tabIndex === undefined || this.element.tabIndex < 0) {\n this.element.tabIndex = 0;\n }\n }\n\n private checkAccessbilityEvents() {\n this.element.addEventListener('click', this.EVENT_LISTENER);\n this.element.addEventListener('keydown', this.EVENT_LISTENER);\n }\n\n private get element() {\n return this.elementRef.nativeElement;\n }\n\n ngOnDestroy(): void {\n this.element.removeEventListener('click', this.EVENT_LISTENER);\n this.element.removeEventListener('keydown', this.EVENT_LISTENER);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -710,7 +710,7 @@ class SelectComponent {
|
|
|
710
710
|
useExisting: forwardRef(() => SelectComponent),
|
|
711
711
|
multi: true,
|
|
712
712
|
},
|
|
713
|
-
], viewQueries: [{ propertyName: "_dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, isSignal: true }, { propertyName: "_containerDiv", first: true, predicate: ["containerDiv"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #portalAnchor></ng-template>\n\n<div\n #containerDiv\n class=\"group flex w-full overflow-hidden rounded-[3px] border outline-1 outline-primary focus:outline\"\n [ngClass]=\"{\n 'pointer-events-none border-grayscale-20 bg-grayscale-5': disabled(),\n 'pointer-events-auto border-grayscale-30 bg-grayscale-0': !disabled(),\n }\"\n [attr.aria-disabled]=\"disabled()\"\n (click)=\"onContainerDivClick()\"\n (keydown)=\"onKeyDown($event)\"\n tabindex=\"0\"\n>\n <span\n class=\"flex flex-grow select-none px-3 py-[7px]\"\n [ngClass]=\"{\n 'text-grayscale-90': !disabled() && !isClean(),\n 'text-grayscale-60': !disabled() && isClean(),\n 'text-grayscale-30': disabled(),\n }\"\n >\n {{ print() || placeholder() }}\n </span>\n\n @if (!disabled() && showClear() && !isClean()) {\n <button\n class=\"mx-3\"\n (click)=\"clear($event)\"\n >\n <i class=\"fas fa-times flex items-center\"></i>\n </button>\n }\n\n <div\n class=\"flex items-center border-l px-3 group-hover:bg-grayscale-10 group-focus:border-primary\"\n [ngClass]=\"{ 'border-grayscale-20': disabled(), 'border-grayscale-30': !disabled() }\"\n >\n <i\n class=\"fas\"\n [ngClass]=\"{\n 'text-grayscale-30': disabled(),\n 'text-grayscale-90': !disabled(),\n 'fa-caret-down': !showOptions(),\n 'fa-caret-up': showOptions(),\n }\"\n ></i>\n </div>\n</div>\n\n<ng-template #dropdownTemplate>\n <div\n class=\"dropdown-body-class z-[
|
|
713
|
+
], viewQueries: [{ propertyName: "_dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, isSignal: true }, { propertyName: "_containerDiv", first: true, predicate: ["containerDiv"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #portalAnchor></ng-template>\n\n<div\n #containerDiv\n class=\"group flex w-full overflow-hidden rounded-[3px] border outline-1 outline-primary focus:outline\"\n [ngClass]=\"{\n 'pointer-events-none border-grayscale-20 bg-grayscale-5': disabled(),\n 'pointer-events-auto border-grayscale-30 bg-grayscale-0': !disabled(),\n }\"\n [attr.aria-disabled]=\"disabled()\"\n (click)=\"onContainerDivClick()\"\n (keydown)=\"onKeyDown($event)\"\n tabindex=\"0\"\n>\n <span\n class=\"flex flex-grow select-none px-3 py-[7px]\"\n [ngClass]=\"{\n 'text-grayscale-90': !disabled() && !isClean(),\n 'text-grayscale-60': !disabled() && isClean(),\n 'text-grayscale-30': disabled(),\n }\"\n >\n {{ print() || placeholder() }}\n </span>\n\n @if (!disabled() && showClear() && !isClean()) {\n <button\n class=\"mx-3\"\n (click)=\"clear($event)\"\n >\n <i class=\"fas fa-times flex items-center\"></i>\n </button>\n }\n\n <div\n class=\"flex items-center border-l px-3 group-hover:bg-grayscale-10 group-focus:border-primary\"\n [ngClass]=\"{ 'border-grayscale-20': disabled(), 'border-grayscale-30': !disabled() }\"\n >\n <i\n class=\"fas\"\n [ngClass]=\"{\n 'text-grayscale-30': disabled(),\n 'text-grayscale-90': !disabled(),\n 'fa-caret-down': !showOptions(),\n 'fa-caret-up': showOptions(),\n }\"\n ></i>\n </div>\n</div>\n\n<ng-template #dropdownTemplate>\n <div\n class=\"dropdown-body-class z-[1000] rounded-[3px] bg-grayscale-0 py-1 shadow-md\"\n [style.position]=\"'absolute'\"\n [style.top.px]=\"dropTop\"\n [style.left.px]=\"dropLeft\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (filter()) {\n <div class=\"flex w-full items-center gap-3 px-3 py-1.5\">\n @if (multiple()) {\n <s-checkbox\n #selectAllCheckbox\n [checked]=\"allSelected()\"\n [indeterminate]=\"selectAllIsIndeterminate()\"\n (checkedChange)=\"toggleSelectAll()\"\n ></s-checkbox>\n }\n\n <div class=\"relative flex h-[35px] grow\">\n <form\n class=\"flex grow\"\n [formGroup]=\"filterForm\"\n >\n <input\n class=\"w-full grow rounded-[3px] border border-grayscale-30 pl-2.5 pr-7 outline-1 outline-primary\"\n type=\"text\"\n formControlName=\"filter\"\n (click)=\"$event.stopPropagation()\"\n />\n </form>\n <i class=\"fas fa-search absolute right-2.5 top-2.5 text-grayscale-90\"></i>\n </div>\n <button (click)=\"clearFilter()\">\n <i class=\"fas fa-times flex items-center\"></i>\n </button>\n </div>\n }\n\n <!-- Virtual scroll -->\n @if (virtualScroll() && filteredOptions().length > 10) {\n <cdk-virtual-scroll-viewport\n [itemSize]=\"virtualScrollItemSize()\"\n class=\"h-52 overflow-auto\"\n >\n <ng-container *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackById\">\n <s-select-option\n [id]=\"option.id\"\n [label]=\"getOptionLabel(option.data)\"\n [multiple]=\"multiple()\"\n [checkmark]=\"checkmark()\"\n [isSelected]=\"isOptionSelected(option.data)\"\n (selected)=\"selectItem(option.data)\"\n [isGrouper]=\"option.grouper\"\n [isFocused]=\"option.data === focusedItem()\"\n ></s-select-option>\n </ng-container>\n </cdk-virtual-scroll-viewport>\n }\n\n <!-- Normal list -->\n @if (!virtualScroll() || filteredOptions().length <= 10) {\n <ul class=\"max-h-52 overflow-auto\">\n @for (option of filteredOptions(); track option.id) {\n <s-select-option\n [id]=\"option.id\"\n [label]=\"getOptionLabel(option.data)\"\n [multiple]=\"multiple()\"\n [checkmark]=\"checkmark()\"\n [isSelected]=\"isOptionSelected(option.data)\"\n (selected)=\"selectItem(option.data)\"\n [isGrouper]=\"option.grouper ?? false\"\n [isFocused]=\"option.data === focusedItem()\"\n ></s-select-option>\n }\n </ul>\n }\n\n @if (filteredOptions().length === 0) {\n <span class=\"m-3 text-grayscale-60\">{{\n emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n }}</span>\n }\n </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i3.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i3.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: SelectOptionComponent, selector: "s-select-option", inputs: ["id", "label", "multiple", "checkmark", "isGrouper", "isFocused", "isSelected"], outputs: ["isSelectedChange", "selected"] }, { kind: "component", type: CheckboxComponent, selector: "s-checkbox", inputs: ["disabled", "checked", "indeterminate", "label"], outputs: ["disabledChange", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
|
|
714
714
|
}
|
|
715
715
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectComponent, decorators: [{
|
|
716
716
|
type: Component,
|
|
@@ -730,7 +730,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
730
730
|
useExisting: forwardRef(() => SelectComponent),
|
|
731
731
|
multi: true,
|
|
732
732
|
},
|
|
733
|
-
], template: "<ng-template #portalAnchor></ng-template>\n\n<div\n #containerDiv\n class=\"group flex w-full overflow-hidden rounded-[3px] border outline-1 outline-primary focus:outline\"\n [ngClass]=\"{\n 'pointer-events-none border-grayscale-20 bg-grayscale-5': disabled(),\n 'pointer-events-auto border-grayscale-30 bg-grayscale-0': !disabled(),\n }\"\n [attr.aria-disabled]=\"disabled()\"\n (click)=\"onContainerDivClick()\"\n (keydown)=\"onKeyDown($event)\"\n tabindex=\"0\"\n>\n <span\n class=\"flex flex-grow select-none px-3 py-[7px]\"\n [ngClass]=\"{\n 'text-grayscale-90': !disabled() && !isClean(),\n 'text-grayscale-60': !disabled() && isClean(),\n 'text-grayscale-30': disabled(),\n }\"\n >\n {{ print() || placeholder() }}\n </span>\n\n @if (!disabled() && showClear() && !isClean()) {\n <button\n class=\"mx-3\"\n (click)=\"clear($event)\"\n >\n <i class=\"fas fa-times flex items-center\"></i>\n </button>\n }\n\n <div\n class=\"flex items-center border-l px-3 group-hover:bg-grayscale-10 group-focus:border-primary\"\n [ngClass]=\"{ 'border-grayscale-20': disabled(), 'border-grayscale-30': !disabled() }\"\n >\n <i\n class=\"fas\"\n [ngClass]=\"{\n 'text-grayscale-30': disabled(),\n 'text-grayscale-90': !disabled(),\n 'fa-caret-down': !showOptions(),\n 'fa-caret-up': showOptions(),\n }\"\n ></i>\n </div>\n</div>\n\n<ng-template #dropdownTemplate>\n <div\n class=\"dropdown-body-class z-[
|
|
733
|
+
], template: "<ng-template #portalAnchor></ng-template>\n\n<div\n #containerDiv\n class=\"group flex w-full overflow-hidden rounded-[3px] border outline-1 outline-primary focus:outline\"\n [ngClass]=\"{\n 'pointer-events-none border-grayscale-20 bg-grayscale-5': disabled(),\n 'pointer-events-auto border-grayscale-30 bg-grayscale-0': !disabled(),\n }\"\n [attr.aria-disabled]=\"disabled()\"\n (click)=\"onContainerDivClick()\"\n (keydown)=\"onKeyDown($event)\"\n tabindex=\"0\"\n>\n <span\n class=\"flex flex-grow select-none px-3 py-[7px]\"\n [ngClass]=\"{\n 'text-grayscale-90': !disabled() && !isClean(),\n 'text-grayscale-60': !disabled() && isClean(),\n 'text-grayscale-30': disabled(),\n }\"\n >\n {{ print() || placeholder() }}\n </span>\n\n @if (!disabled() && showClear() && !isClean()) {\n <button\n class=\"mx-3\"\n (click)=\"clear($event)\"\n >\n <i class=\"fas fa-times flex items-center\"></i>\n </button>\n }\n\n <div\n class=\"flex items-center border-l px-3 group-hover:bg-grayscale-10 group-focus:border-primary\"\n [ngClass]=\"{ 'border-grayscale-20': disabled(), 'border-grayscale-30': !disabled() }\"\n >\n <i\n class=\"fas\"\n [ngClass]=\"{\n 'text-grayscale-30': disabled(),\n 'text-grayscale-90': !disabled(),\n 'fa-caret-down': !showOptions(),\n 'fa-caret-up': showOptions(),\n }\"\n ></i>\n </div>\n</div>\n\n<ng-template #dropdownTemplate>\n <div\n class=\"dropdown-body-class z-[1000] rounded-[3px] bg-grayscale-0 py-1 shadow-md\"\n [style.position]=\"'absolute'\"\n [style.top.px]=\"dropTop\"\n [style.left.px]=\"dropLeft\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (filter()) {\n <div class=\"flex w-full items-center gap-3 px-3 py-1.5\">\n @if (multiple()) {\n <s-checkbox\n #selectAllCheckbox\n [checked]=\"allSelected()\"\n [indeterminate]=\"selectAllIsIndeterminate()\"\n (checkedChange)=\"toggleSelectAll()\"\n ></s-checkbox>\n }\n\n <div class=\"relative flex h-[35px] grow\">\n <form\n class=\"flex grow\"\n [formGroup]=\"filterForm\"\n >\n <input\n class=\"w-full grow rounded-[3px] border border-grayscale-30 pl-2.5 pr-7 outline-1 outline-primary\"\n type=\"text\"\n formControlName=\"filter\"\n (click)=\"$event.stopPropagation()\"\n />\n </form>\n <i class=\"fas fa-search absolute right-2.5 top-2.5 text-grayscale-90\"></i>\n </div>\n <button (click)=\"clearFilter()\">\n <i class=\"fas fa-times flex items-center\"></i>\n </button>\n </div>\n }\n\n <!-- Virtual scroll -->\n @if (virtualScroll() && filteredOptions().length > 10) {\n <cdk-virtual-scroll-viewport\n [itemSize]=\"virtualScrollItemSize()\"\n class=\"h-52 overflow-auto\"\n >\n <ng-container *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackById\">\n <s-select-option\n [id]=\"option.id\"\n [label]=\"getOptionLabel(option.data)\"\n [multiple]=\"multiple()\"\n [checkmark]=\"checkmark()\"\n [isSelected]=\"isOptionSelected(option.data)\"\n (selected)=\"selectItem(option.data)\"\n [isGrouper]=\"option.grouper\"\n [isFocused]=\"option.data === focusedItem()\"\n ></s-select-option>\n </ng-container>\n </cdk-virtual-scroll-viewport>\n }\n\n <!-- Normal list -->\n @if (!virtualScroll() || filteredOptions().length <= 10) {\n <ul class=\"max-h-52 overflow-auto\">\n @for (option of filteredOptions(); track option.id) {\n <s-select-option\n [id]=\"option.id\"\n [label]=\"getOptionLabel(option.data)\"\n [multiple]=\"multiple()\"\n [checkmark]=\"checkmark()\"\n [isSelected]=\"isOptionSelected(option.data)\"\n (selected)=\"selectItem(option.data)\"\n [isGrouper]=\"option.grouper ?? false\"\n [isFocused]=\"option.data === focusedItem()\"\n ></s-select-option>\n }\n </ul>\n }\n\n @if (filteredOptions().length === 0) {\n <span class=\"m-3 text-grayscale-60\">{{\n emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n }}</span>\n }\n </div>\n</ng-template>\n" }]
|
|
734
734
|
}] });
|
|
735
735
|
|
|
736
736
|
/**
|