@ng-vagabond-lab/ng-dsv 0.2.11 → 0.2.13
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/fesm2022/ng-vagabond-lab-ng-dsv-api.mjs +16 -11
- package/fesm2022/ng-vagabond-lab-ng-dsv-api.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-base-service.mjs +32 -22
- package/fesm2022/ng-vagabond-lab-ng-dsv-base-service.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-base.mjs +29 -25
- package/fesm2022/ng-vagabond-lab-ng-dsv-base.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-date.mjs +3 -3
- package/fesm2022/ng-vagabond-lab-ng-dsv-date.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-accordion.mjs +15 -9
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-accordion.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-avatar.mjs +11 -7
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-avatar.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-button.mjs +26 -16
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-button.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-card.mjs +16 -14
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-card.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-chip.mjs +7 -5
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-chip.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-color.mjs +22 -14
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-color.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-container.mjs +7 -5
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-container.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-file.mjs +35 -22
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-file.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-form-reactive.mjs +70 -47
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-form-reactive.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-form-signal.mjs +81 -54
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-form-signal.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-header.mjs +11 -7
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-header.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-img.mjs +19 -11
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-img.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-item.mjs +15 -9
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-item.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-linear-progress.mjs +9 -6
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-linear-progress.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-link-pipe.mjs +6 -6
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-link-pipe.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-list.mjs +22 -17
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-list.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-menu.mjs +24 -18
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-menu.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-modal.mjs +46 -29
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-modal.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-paginate.mjs +7 -5
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-paginate.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-scroll.mjs +33 -21
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-scroll.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-skeleton.mjs +3 -3
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-skeleton.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-tab.mjs +14 -10
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-tab.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-table.mjs +15 -9
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-table.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-theme.mjs +11 -10
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-theme.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-toast.mjs +16 -11
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-toast.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-tooltip.mjs +15 -9
- package/fesm2022/ng-vagabond-lab-ng-dsv-ds-tooltip.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-environment.mjs +7 -5
- package/fesm2022/ng-vagabond-lab-ng-dsv-environment.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-i18n.mjs +10 -6
- package/fesm2022/ng-vagabond-lab-ng-dsv-i18n.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-module-admin.mjs +51 -33
- package/fesm2022/ng-vagabond-lab-ng-dsv-module-admin.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-module-auth.mjs +21 -15
- package/fesm2022/ng-vagabond-lab-ng-dsv-module-auth.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-module-contact.mjs +5 -4
- package/fesm2022/ng-vagabond-lab-ng-dsv-module-contact.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-platform.mjs +9 -6
- package/fesm2022/ng-vagabond-lab-ng-dsv-platform.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-router.mjs +13 -11
- package/fesm2022/ng-vagabond-lab-ng-dsv-router.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-storage.mjs +15 -9
- package/fesm2022/ng-vagabond-lab-ng-dsv-storage.mjs.map +1 -1
- package/fesm2022/ng-vagabond-lab-ng-dsv-template.mjs +38 -28
- package/fesm2022/ng-vagabond-lab-ng-dsv-template.mjs.map +1 -1
- package/package.json +1 -1
- package/types/ng-vagabond-lab-ng-dsv-ds-form-signal.d.ts +1 -1
- package/types/ng-vagabond-lab-ng-dsv-i18n.d.ts +1 -0
|
@@ -2,26 +2,33 @@ import * as i0 from '@angular/core';
|
|
|
2
2
|
import { input, computed, Component, output, signal, Directive, viewChild } from '@angular/core';
|
|
3
3
|
|
|
4
4
|
class DsvFileShowComponent {
|
|
5
|
-
url = input('',
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
5
|
+
url = input('', /* @ts-ignore */
|
|
6
|
+
...(ngDevMode ? [{ debugName: "url" }] : /* istanbul ignore next */ []));
|
|
7
|
+
src = input.required(/* @ts-ignore */
|
|
8
|
+
...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
|
|
9
|
+
alt = input('Exemple du dsv file show', /* @ts-ignore */
|
|
10
|
+
...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
|
|
11
|
+
fileUrl = computed(() => this.url() + '/file/download?fileName=' + this.src(), /* @ts-ignore */
|
|
12
|
+
...(ngDevMode ? [{ debugName: "fileUrl" }] : /* istanbul ignore next */ []));
|
|
13
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFileShowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
14
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: DsvFileShowComponent, isStandalone: true, selector: "dsv-file-show", inputs: { url: { classPropertyName: "url", publicName: "url", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<img\n [src]=\"fileUrl()\"\n [alt]=\"alt()\"\n width=\"100%\"\n/>\n" });
|
|
11
15
|
}
|
|
12
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
16
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFileShowComponent, decorators: [{
|
|
13
17
|
type: Component,
|
|
14
18
|
args: [{ selector: 'dsv-file-show', template: "<img\n [src]=\"fileUrl()\"\n [alt]=\"alt()\"\n width=\"100%\"\n/>\n" }]
|
|
15
19
|
}], propDecorators: { url: [{ type: i0.Input, args: [{ isSignal: true, alias: "url", required: false }] }], src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }] } });
|
|
16
20
|
|
|
17
21
|
class FileUploadDirective {
|
|
18
|
-
appDragDrop = input(
|
|
22
|
+
appDragDrop = input(/* @ts-ignore */
|
|
23
|
+
...(ngDevMode ? [undefined, { debugName: "appDragDrop" }] : /* istanbul ignore next */ []));
|
|
19
24
|
dropped = output();
|
|
20
|
-
dragInProgress = signal(false,
|
|
25
|
+
dragInProgress = signal(false, /* @ts-ignore */
|
|
26
|
+
...(ngDevMode ? [{ debugName: "dragInProgress" }] : /* istanbul ignore next */ []));
|
|
21
27
|
enabled = computed(() => {
|
|
22
28
|
const value = this.appDragDrop();
|
|
23
29
|
return value === '' ? true : !!value;
|
|
24
|
-
},
|
|
30
|
+
}, /* @ts-ignore */
|
|
31
|
+
...(ngDevMode ? [{ debugName: "enabled" }] : /* istanbul ignore next */ []));
|
|
25
32
|
onDragOver(event) {
|
|
26
33
|
if (!this.enabled())
|
|
27
34
|
return;
|
|
@@ -43,10 +50,10 @@ class FileUploadDirective {
|
|
|
43
50
|
e.stopPropagation();
|
|
44
51
|
e.preventDefault();
|
|
45
52
|
}
|
|
46
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
47
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
53
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FileUploadDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
54
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.1", type: FileUploadDirective, isStandalone: true, selector: "[appDragDrop]", inputs: { appDragDrop: { classPropertyName: "appDragDrop", publicName: "appDragDrop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dropped: "dropped" }, host: { listeners: { "dragenter": "onDragOver($event)", "dragover": "onDragOver($event)", "dragleave": "onDragEnd($event)", "dragend": "onDragEnd($event)", "drop": "onDrop($event)" }, properties: { "class.dragging": "dragInProgress()" } }, ngImport: i0 });
|
|
48
55
|
}
|
|
49
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
56
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FileUploadDirective, decorators: [{
|
|
50
57
|
type: Directive,
|
|
51
58
|
args: [{
|
|
52
59
|
selector: '[appDragDrop]',
|
|
@@ -62,13 +69,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
62
69
|
}], propDecorators: { appDragDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "appDragDrop", required: false }] }], dropped: [{ type: i0.Output, args: ["dropped"] }] } });
|
|
63
70
|
|
|
64
71
|
class DsvFileUploadComponent {
|
|
65
|
-
multiple = input(false,
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
72
|
+
multiple = input(false, /* @ts-ignore */
|
|
73
|
+
...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
|
|
74
|
+
fileType = input('image/*', /* @ts-ignore */
|
|
75
|
+
...(ngDevMode ? [{ debugName: "fileType" }] : /* istanbul ignore next */ []));
|
|
76
|
+
imgAlt = input("Apperçu de l'image", /* @ts-ignore */
|
|
77
|
+
...(ngDevMode ? [{ debugName: "imgAlt" }] : /* istanbul ignore next */ []));
|
|
78
|
+
dragDropEnabled = input(true, /* @ts-ignore */
|
|
79
|
+
...(ngDevMode ? [{ debugName: "dragDropEnabled" }] : /* istanbul ignore next */ []));
|
|
69
80
|
filesChanged = output();
|
|
70
|
-
inputRef = viewChild('fileInput',
|
|
71
|
-
|
|
81
|
+
inputRef = viewChild('fileInput', /* @ts-ignore */
|
|
82
|
+
...(ngDevMode ? [{ debugName: "inputRef" }] : /* istanbul ignore next */ []));
|
|
83
|
+
file = signal(undefined, /* @ts-ignore */
|
|
84
|
+
...(ngDevMode ? [{ debugName: "file" }] : /* istanbul ignore next */ []));
|
|
72
85
|
addFiles(files) {
|
|
73
86
|
const reader = new FileReader();
|
|
74
87
|
reader.onload = () => {
|
|
@@ -87,10 +100,10 @@ class DsvFileUploadComponent {
|
|
|
87
100
|
this.addFiles(files);
|
|
88
101
|
}
|
|
89
102
|
}
|
|
90
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
91
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
103
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
104
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: DsvFileUploadComponent, isStandalone: true, selector: "dsv-file-upload", inputs: { multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, fileType: { classPropertyName: "fileType", publicName: "fileType", isSignal: true, isRequired: false, transformFunction: null }, imgAlt: { classPropertyName: "imgAlt", publicName: "imgAlt", isSignal: true, isRequired: false, transformFunction: null }, dragDropEnabled: { classPropertyName: "dragDropEnabled", publicName: "dragDropEnabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filesChanged: "filesChanged" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<label class=\"drag-zone\" [appDragDrop]=\"dragDropEnabled()\" (dropped)=\"handleFileDrop($event)\">\n <input\n type=\"file\"\n [accept]=\"fileType()\"\n [multiple]=\"multiple()\"\n (change)=\"addFiles(fileInput.files!)\"\n #fileInput\n class=\"visually-hidden\"\n />\n @if (!file()) {\n <ng-content></ng-content>\n } @else {\n <img [src]=\"file()\" [alt]=\"imgAlt()\" width=\"100%\" />\n }\n</label>\n", styles: [":host{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--background)}:host label{padding:5px}:host .drag-zone{width:80%;min-height:200px;border:1px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:space-around;cursor:pointer}:host .drag-zone.dragging{background-color:#cdcdff;border:3px dashed #999999}:host .drag-zone:focus-within{border:1px solid #999999}:host .visually-hidden{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"], dependencies: [{ kind: "directive", type: FileUploadDirective, selector: "[appDragDrop]", inputs: ["appDragDrop"], outputs: ["dropped"] }] });
|
|
92
105
|
}
|
|
93
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
106
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFileUploadComponent, decorators: [{
|
|
94
107
|
type: Component,
|
|
95
108
|
args: [{ selector: 'dsv-file-upload', imports: [FileUploadDirective], template: "<label class=\"drag-zone\" [appDragDrop]=\"dragDropEnabled()\" (dropped)=\"handleFileDrop($event)\">\n <input\n type=\"file\"\n [accept]=\"fileType()\"\n [multiple]=\"multiple()\"\n (change)=\"addFiles(fileInput.files!)\"\n #fileInput\n class=\"visually-hidden\"\n />\n @if (!file()) {\n <ng-content></ng-content>\n } @else {\n <img [src]=\"file()\" [alt]=\"imgAlt()\" width=\"100%\" />\n }\n</label>\n", styles: [":host{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--background)}:host label{padding:5px}:host .drag-zone{width:80%;min-height:200px;border:1px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:space-around;cursor:pointer}:host .drag-zone.dragging{background-color:#cdcdff;border:3px dashed #999999}:host .drag-zone:focus-within{border:1px solid #999999}:host .visually-hidden{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"] }]
|
|
96
109
|
}], propDecorators: { multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], fileType: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileType", required: false }] }], imgAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "imgAlt", required: false }] }], dragDropEnabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragDropEnabled", required: false }] }], filesChanged: [{ type: i0.Output, args: ["filesChanged"] }], inputRef: [{ type: i0.ViewChild, args: ['fileInput', { isSignal: true }] }] } });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-file.mjs","sources":["../../../projects/ng-dsv/ds/file/show/component/file-show.component.ts","../../../projects/ng-dsv/ds/file/show/component/file-show.component.html","../../../projects/ng-dsv/ds/file/upload/directive/file-upload-directives.ts","../../../projects/ng-dsv/ds/file/upload/component/file-upload.component.ts","../../../projects/ng-dsv/ds/file/upload/component/file-upload.component.html","../../../projects/ng-dsv/ds/file/ng-vagabond-lab-ng-dsv-ds-file.ts"],"sourcesContent":["import { Component, computed, input } from '@angular/core';\n\n@Component({\n selector: 'dsv-file-show',\n templateUrl: './file-show.component.html',\n})\nexport class DsvFileShowComponent {\n readonly url = input<string>('');\n readonly src = input.required<string>();\n readonly alt = input<string>('Exemple du dsv file show');\n\n readonly fileUrl = computed<string>(() => this.url() + '/file/download?fileName=' + this.src());\n}\n","<img\n [src]=\"fileUrl()\"\n [alt]=\"alt()\"\n width=\"100%\"\n/>\n","import { computed, Directive, input, output, signal } from '@angular/core';\n\n@Directive({\n selector: '[appDragDrop]',\n host: {\n '[class.dragging]': 'dragInProgress()',\n '(dragenter)': 'onDragOver($event)',\n '(dragover)': 'onDragOver($event)',\n '(dragleave)': 'onDragEnd($event)',\n '(dragend)': 'onDragEnd($event)',\n '(drop)': 'onDrop($event)',\n },\n})\nexport class FileUploadDirective {\n readonly appDragDrop = input<any>();\n\n readonly dropped = output<DragEvent>();\n\n readonly dragInProgress = signal(false);\n\n private readonly enabled = computed<boolean>(() => {\n const value = this.appDragDrop();\n return value === '' ? true : !!value;\n });\n\n onDragOver(event: DragEvent): void {\n if (!this.enabled()) return;\n this.stopAndPreventDefault(event);\n this.dragInProgress.set(true);\n }\n\n onDragEnd(event: DragEvent): void {\n if (!this.enabled()) return;\n this.stopAndPreventDefault(event);\n this.dragInProgress.set(false);\n }\n\n onDrop(event: DragEvent): void {\n this.stopAndPreventDefault(event);\n this.dragInProgress.set(false);\n this.dropped.emit(event);\n }\n\n private stopAndPreventDefault(e: UIEvent): void {\n e.stopPropagation();\n e.preventDefault();\n }\n}\n","import { Component, ElementRef, input, output, signal, viewChild } from '@angular/core';\nimport { FileUploadDirective } from '../directive/file-upload-directives';\n\n@Component({\n selector: 'dsv-file-upload',\n imports: [FileUploadDirective],\n templateUrl: './file-upload.component.html',\n styleUrls: ['./file-upload.component.scss'],\n})\nexport class DsvFileUploadComponent {\n readonly multiple = input<boolean>(false);\n readonly fileType = input<string>('image/*');\n readonly imgAlt = input<string>(\"Apperçu de l'image\");\n readonly dragDropEnabled = input<boolean>(true);\n\n readonly filesChanged = output<FileList>();\n\n readonly inputRef = viewChild<ElementRef>('fileInput');\n\n readonly file = signal<string | undefined>(undefined);\n\n addFiles(files: FileList): void {\n const reader = new FileReader();\n reader.onload = () => {\n this.file.set(reader.result as string);\n };\n reader.readAsDataURL(files.item(0) as Blob);\n this.filesChanged.emit(files);\n }\n\n handleFileDrop(event: DragEvent): void {\n if (event?.dataTransfer?.files?.length) {\n const files = event.dataTransfer.files;\n const input = this.inputRef()?.nativeElement;\n if (input) {\n input.files = files;\n }\n this.addFiles(files);\n }\n }\n}\n","<label class=\"drag-zone\" [appDragDrop]=\"dragDropEnabled()\" (dropped)=\"handleFileDrop($event)\">\n <input\n type=\"file\"\n [accept]=\"fileType()\"\n [multiple]=\"multiple()\"\n (change)=\"addFiles(fileInput.files!)\"\n #fileInput\n class=\"visually-hidden\"\n />\n @if (!file()) {\n <ng-content></ng-content>\n } @else {\n <img [src]=\"file()\" [alt]=\"imgAlt()\" width=\"100%\" />\n }\n</label>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAMa,oBAAoB,CAAA;
|
|
1
|
+
{"version":3,"file":"ng-vagabond-lab-ng-dsv-ds-file.mjs","sources":["../../../projects/ng-dsv/ds/file/show/component/file-show.component.ts","../../../projects/ng-dsv/ds/file/show/component/file-show.component.html","../../../projects/ng-dsv/ds/file/upload/directive/file-upload-directives.ts","../../../projects/ng-dsv/ds/file/upload/component/file-upload.component.ts","../../../projects/ng-dsv/ds/file/upload/component/file-upload.component.html","../../../projects/ng-dsv/ds/file/ng-vagabond-lab-ng-dsv-ds-file.ts"],"sourcesContent":["import { Component, computed, input } from '@angular/core';\n\n@Component({\n selector: 'dsv-file-show',\n templateUrl: './file-show.component.html',\n})\nexport class DsvFileShowComponent {\n readonly url = input<string>('');\n readonly src = input.required<string>();\n readonly alt = input<string>('Exemple du dsv file show');\n\n readonly fileUrl = computed<string>(() => this.url() + '/file/download?fileName=' + this.src());\n}\n","<img\n [src]=\"fileUrl()\"\n [alt]=\"alt()\"\n width=\"100%\"\n/>\n","import { computed, Directive, input, output, signal } from '@angular/core';\n\n@Directive({\n selector: '[appDragDrop]',\n host: {\n '[class.dragging]': 'dragInProgress()',\n '(dragenter)': 'onDragOver($event)',\n '(dragover)': 'onDragOver($event)',\n '(dragleave)': 'onDragEnd($event)',\n '(dragend)': 'onDragEnd($event)',\n '(drop)': 'onDrop($event)',\n },\n})\nexport class FileUploadDirective {\n readonly appDragDrop = input<any>();\n\n readonly dropped = output<DragEvent>();\n\n readonly dragInProgress = signal(false);\n\n private readonly enabled = computed<boolean>(() => {\n const value = this.appDragDrop();\n return value === '' ? true : !!value;\n });\n\n onDragOver(event: DragEvent): void {\n if (!this.enabled()) return;\n this.stopAndPreventDefault(event);\n this.dragInProgress.set(true);\n }\n\n onDragEnd(event: DragEvent): void {\n if (!this.enabled()) return;\n this.stopAndPreventDefault(event);\n this.dragInProgress.set(false);\n }\n\n onDrop(event: DragEvent): void {\n this.stopAndPreventDefault(event);\n this.dragInProgress.set(false);\n this.dropped.emit(event);\n }\n\n private stopAndPreventDefault(e: UIEvent): void {\n e.stopPropagation();\n e.preventDefault();\n }\n}\n","import { Component, ElementRef, input, output, signal, viewChild } from '@angular/core';\nimport { FileUploadDirective } from '../directive/file-upload-directives';\n\n@Component({\n selector: 'dsv-file-upload',\n imports: [FileUploadDirective],\n templateUrl: './file-upload.component.html',\n styleUrls: ['./file-upload.component.scss'],\n})\nexport class DsvFileUploadComponent {\n readonly multiple = input<boolean>(false);\n readonly fileType = input<string>('image/*');\n readonly imgAlt = input<string>(\"Apperçu de l'image\");\n readonly dragDropEnabled = input<boolean>(true);\n\n readonly filesChanged = output<FileList>();\n\n readonly inputRef = viewChild<ElementRef>('fileInput');\n\n readonly file = signal<string | undefined>(undefined);\n\n addFiles(files: FileList): void {\n const reader = new FileReader();\n reader.onload = () => {\n this.file.set(reader.result as string);\n };\n reader.readAsDataURL(files.item(0) as Blob);\n this.filesChanged.emit(files);\n }\n\n handleFileDrop(event: DragEvent): void {\n if (event?.dataTransfer?.files?.length) {\n const files = event.dataTransfer.files;\n const input = this.inputRef()?.nativeElement;\n if (input) {\n input.files = files;\n }\n this.addFiles(files);\n }\n }\n}\n","<label class=\"drag-zone\" [appDragDrop]=\"dragDropEnabled()\" (dropped)=\"handleFileDrop($event)\">\n <input\n type=\"file\"\n [accept]=\"fileType()\"\n [multiple]=\"multiple()\"\n (change)=\"addFiles(fileInput.files!)\"\n #fileInput\n class=\"visually-hidden\"\n />\n @if (!file()) {\n <ng-content></ng-content>\n } @else {\n <img [src]=\"file()\" [alt]=\"imgAlt()\" width=\"100%\" />\n }\n</label>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -8,35 +8,42 @@ import { ToastService } from '@ng-vagabond-lab/ng-dsv/ds/toast';
|
|
|
8
8
|
import { TranslatePipe } from '@ngx-translate/core';
|
|
9
9
|
|
|
10
10
|
class DsvFormReactiveLabelComponent {
|
|
11
|
-
label = input.required(
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
label = input.required(/* @ts-ignore */
|
|
12
|
+
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
13
|
+
field = input(/* @ts-ignore */
|
|
14
|
+
...(ngDevMode ? [undefined, { debugName: "field" }] : /* istanbul ignore next */ []));
|
|
15
|
+
show = input(true, /* @ts-ignore */
|
|
16
|
+
...(ngDevMode ? [{ debugName: "show" }] : /* istanbul ignore next */ []));
|
|
17
|
+
isRequired = signal(false, /* @ts-ignore */
|
|
18
|
+
...(ngDevMode ? [{ debugName: "isRequired" }] : /* istanbul ignore next */ []));
|
|
15
19
|
constructor() {
|
|
16
20
|
effect(() => {
|
|
17
21
|
this.isRequired.set(this.field()?.hasValidator?.(Validators.required) ?? false);
|
|
18
22
|
});
|
|
19
23
|
}
|
|
20
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
21
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
24
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
25
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: DsvFormReactiveLabelComponent, isStandalone: true, selector: "dsv-form-reactive-label", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (show()) {\n <label\n [for]=\"label()\"\n class=\"text\"\n [class.error]=\"field()?.touched && field()?.invalid\"\n >\n {{ label() }} {{ isRequired() ? '*' : '' }}\n </label>\n}\n", styles: [":host{margin-left:4px;height:100%;display:flex;align-content:center;opacity:.65;-webkit-user-select:none;user-select:none}:host label{display:flex;align-items:center;width:100%}:host:empty{display:none}\n"] });
|
|
22
26
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
27
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveLabelComponent, decorators: [{
|
|
24
28
|
type: Component,
|
|
25
29
|
args: [{ selector: 'dsv-form-reactive-label', template: "@if (show()) {\n <label\n [for]=\"label()\"\n class=\"text\"\n [class.error]=\"field()?.touched && field()?.invalid\"\n >\n {{ label() }} {{ isRequired() ? '*' : '' }}\n </label>\n}\n", styles: [":host{margin-left:4px;height:100%;display:flex;align-content:center;opacity:.65;-webkit-user-select:none;user-select:none}:host label{display:flex;align-items:center;width:100%}:host:empty{display:none}\n"] }]
|
|
26
30
|
}], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: false }] }], show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }] } });
|
|
27
31
|
|
|
28
32
|
class DsvFormReactiveCheckboxComponent {
|
|
29
|
-
form = input.required(
|
|
30
|
-
|
|
31
|
-
|
|
33
|
+
form = input.required(/* @ts-ignore */
|
|
34
|
+
...(ngDevMode ? [{ debugName: "form" }] : /* istanbul ignore next */ []));
|
|
35
|
+
field = input.required(/* @ts-ignore */
|
|
36
|
+
...(ngDevMode ? [{ debugName: "field" }] : /* istanbul ignore next */ []));
|
|
37
|
+
withLabel = input(true, /* @ts-ignore */
|
|
38
|
+
...(ngDevMode ? [{ debugName: "withLabel" }] : /* istanbul ignore next */ []));
|
|
32
39
|
callbackChange = output();
|
|
33
40
|
doChange() {
|
|
34
41
|
this.callbackChange.emit(this.form().value[this.field()]);
|
|
35
42
|
}
|
|
36
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
37
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
43
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
44
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: DsvFormReactiveCheckboxComponent, isStandalone: true, selector: "dsv-form-reactive-checkbox", inputs: { form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, withLabel: { classPropertyName: "withLabel", publicName: "withLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callbackChange: "callbackChange" }, ngImport: i0, template: "<div [formGroup]=\"form()\">\n <dsv-form-reactive-label\n [label]=\"field()\"\n [field]=\"form().get(field())!\"\n [show]=\"withLabel()\"\n />\n <div>\n <input\n type=\"checkbox\"\n [formControlName]=\"field()\"\n class=\"form-control\"\n [id]=\"field()\"\n />\n </div>\n</div>\n", styles: [":host{--input-width: calc(100% - 12px) ;--input-max-width: auto;--input-opacity: 1;--input-flex-direction: column;--input-align-center: false;--input-justify-content: false;--input-gap: 0;--input-height: auto;--input-min-height: 90px;--input-max-height: 150px;width:100%}:host>div{display:flex;flex-direction:var(--input-flex-direction);gap:var(--input-gap);align-items:var(--input-align-center);justify-content:var(--input-justify-content);position:relative;gap:2px}:host>div .form-control{font-family:inherit;display:block;margin:0;padding:5px;width:var(--input-width);max-width:var(--input-max-width);font-size:1rem;line-height:1.5;color:var(--text);background-color:var(--background-card);background-clip:padding-box;border:1px solid var(--border);border-radius:5px;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;outline-color:#0000004d;opacity:var(--input-opacity)}:host>div .form-control.icon{padding-left:25px}:host>div .form-control.error{border:1px solid var(--error)}:host>div .form-control:disabled{opacity:.6}:host>div i{position:absolute;z-index:1;top:10px;left:7px}:host>div textarea{overflow:auto;scrollbar-width:thin;resize:vertical}:host>div textarea.form-control{height:auto;height:var(--input-height);min-height:var(--input-min-height);max-height:var(--input-max-height)}:host-context(body.dark) .form-control{color-scheme:dark}\n", ":host{display:flex;flex:1;width:100%;margin-bottom:10px!important}:host>div{align-items:center;flex-direction:row;flex:1}:host>div dsv-form-label,:host>div dsv-form-reactive-label,:host>div dsv-form-signal-label{margin-bottom:0!important;flex:1!important;cursor:pointer!important}:host>div input{accent-color:var(--primary);width:20px!important;height:20px!important;margin-right:5px!important}:host>div input[type=checkbox]:checked{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid var(--primary);border-radius:3px;background-size:120%;background-color:var(--primary);background-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DsvFormReactiveLabelComponent, selector: "dsv-form-reactive-label", inputs: ["label", "field", "show"] }] });
|
|
38
45
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
46
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveCheckboxComponent, decorators: [{
|
|
40
47
|
type: Component,
|
|
41
48
|
args: [{ selector: 'dsv-form-reactive-checkbox', imports: [ReactiveFormsModule, DsvFormReactiveLabelComponent], template: "<div [formGroup]=\"form()\">\n <dsv-form-reactive-label\n [label]=\"field()\"\n [field]=\"form().get(field())!\"\n [show]=\"withLabel()\"\n />\n <div>\n <input\n type=\"checkbox\"\n [formControlName]=\"field()\"\n class=\"form-control\"\n [id]=\"field()\"\n />\n </div>\n</div>\n", styles: [":host{--input-width: calc(100% - 12px) ;--input-max-width: auto;--input-opacity: 1;--input-flex-direction: column;--input-align-center: false;--input-justify-content: false;--input-gap: 0;--input-height: auto;--input-min-height: 90px;--input-max-height: 150px;width:100%}:host>div{display:flex;flex-direction:var(--input-flex-direction);gap:var(--input-gap);align-items:var(--input-align-center);justify-content:var(--input-justify-content);position:relative;gap:2px}:host>div .form-control{font-family:inherit;display:block;margin:0;padding:5px;width:var(--input-width);max-width:var(--input-max-width);font-size:1rem;line-height:1.5;color:var(--text);background-color:var(--background-card);background-clip:padding-box;border:1px solid var(--border);border-radius:5px;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;outline-color:#0000004d;opacity:var(--input-opacity)}:host>div .form-control.icon{padding-left:25px}:host>div .form-control.error{border:1px solid var(--error)}:host>div .form-control:disabled{opacity:.6}:host>div i{position:absolute;z-index:1;top:10px;left:7px}:host>div textarea{overflow:auto;scrollbar-width:thin;resize:vertical}:host>div textarea.form-control{height:auto;height:var(--input-height);min-height:var(--input-min-height);max-height:var(--input-max-height)}:host-context(body.dark) .form-control{color-scheme:dark}\n", ":host{display:flex;flex:1;width:100%;margin-bottom:10px!important}:host>div{align-items:center;flex-direction:row;flex:1}:host>div dsv-form-label,:host>div dsv-form-reactive-label,:host>div dsv-form-signal-label{margin-bottom:0!important;flex:1!important;cursor:pointer!important}:host>div input{accent-color:var(--primary);width:20px!important;height:20px!important;margin-right:5px!important}:host>div input[type=checkbox]:checked{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid var(--primary);border-radius:3px;background-size:120%;background-color:var(--primary);background-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center}\n"] }]
|
|
42
49
|
}], propDecorators: { form: [{ type: i0.Input, args: [{ isSignal: true, alias: "form", required: true }] }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: true }] }], withLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "withLabel", required: false }] }], callbackChange: [{ type: i0.Output, args: ["callbackChange"] }] } });
|
|
@@ -44,19 +51,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
44
51
|
class DsvBaseFormReactiveComponent {
|
|
45
52
|
formBuilder = inject(FormBuilder);
|
|
46
53
|
form;
|
|
47
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
48
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
54
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvBaseFormReactiveComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
55
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.1", type: DsvBaseFormReactiveComponent, isStandalone: true, ngImport: i0 });
|
|
49
56
|
}
|
|
50
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
57
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvBaseFormReactiveComponent, decorators: [{
|
|
51
58
|
type: Directive
|
|
52
59
|
}] });
|
|
53
60
|
|
|
54
61
|
class DsvFormReactiveComponent {
|
|
55
62
|
toastService = inject(ToastService);
|
|
56
|
-
form = input.required(
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
63
|
+
form = input.required(/* @ts-ignore */
|
|
64
|
+
...(ngDevMode ? [{ debugName: "form" }] : /* istanbul ignore next */ []));
|
|
65
|
+
urlBack = input(/* @ts-ignore */
|
|
66
|
+
...(ngDevMode ? [undefined, { debugName: "urlBack" }] : /* istanbul ignore next */ []));
|
|
67
|
+
textValid = input('ENREGISTRER', /* @ts-ignore */
|
|
68
|
+
...(ngDevMode ? [{ debugName: "textValid" }] : /* istanbul ignore next */ []));
|
|
69
|
+
formValid = input('Formulaire envoyé !', /* @ts-ignore */
|
|
70
|
+
...(ngDevMode ? [{ debugName: "formValid" }] : /* istanbul ignore next */ []));
|
|
60
71
|
callback = output();
|
|
61
72
|
onSubmit() {
|
|
62
73
|
this.form().markAllAsTouched();
|
|
@@ -75,20 +86,21 @@ class DsvFormReactiveComponent {
|
|
|
75
86
|
});
|
|
76
87
|
}
|
|
77
88
|
}
|
|
78
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
79
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
89
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
90
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: DsvFormReactiveComponent, isStandalone: true, selector: "dsv-form-reactive", inputs: { form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, urlBack: { classPropertyName: "urlBack", publicName: "urlBack", isSignal: true, isRequired: false, transformFunction: null }, textValid: { classPropertyName: "textValid", publicName: "textValid", isSignal: true, isRequired: false, transformFunction: null }, formValid: { classPropertyName: "formValid", publicName: "formValid", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callback: "callback" }, ngImport: i0, template: "<form\n [formGroup]=\"form()\"\n (ngSubmit)=\"onSubmit()\"\n>\n <div class=\"form-scroll\">\n <ng-content></ng-content>\n </div>\n <div\n class=\"form-buttons\"\n [class.hidden]=\"!(urlBack() && textValid() !== '')\"\n >\n @if (urlBack()) {\n <dsv-button\n color=\"default\"\n variant=\"outlined\"\n [routerLink]=\"urlBack()\"\n [prevent]=\"false\"\n >{{ 'RETOUR' | translate }}</dsv-button\n >\n }\n @if (textValid() && textValid() !== '') {\n <dsv-button\n type=\"submit\"\n color=\"primary\"\n >{{ textValid()! | translate }}</dsv-button\n >\n }\n </div>\n</form>\n", styles: [":host{--form-flex-direction: column;--form-flex-wrap: nowrap;--form-flex-padding: 0;--form-max-height: auto;--form-overflow: auto;display:flex;width:100%;height:100%}:host form{flex-direction:column;display:flex;margin-top:0;unicode-bidi:isolate;max-height:var(--form-max-height)}:host form .form-scroll{overflow:var(--form-overflow);scrollbar-width:thin;display:flex;flex-direction:var(--form-flex-direction);flex-wrap:var(--form-flex-wrap);padding:var(--form-flex-padding);gap:10px}:host form .form-scroll>div{width:100%}:host .form-buttons:empty{display:none}:host .form-buttons{display:flex;justify-content:flex-end;gap:10px;padding-top:10px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: DsvButtonComponent, selector: "dsv-button", inputs: ["libelle", "routerLink", "icon", "iconEnd", "disabled", "noHover", "type", "prevent"], outputs: ["callback"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
80
91
|
}
|
|
81
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
92
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveComponent, decorators: [{
|
|
82
93
|
type: Component,
|
|
83
94
|
args: [{ selector: 'dsv-form-reactive', imports: [ReactiveFormsModule, DsvButtonComponent, RouterLink, TranslatePipe], template: "<form\n [formGroup]=\"form()\"\n (ngSubmit)=\"onSubmit()\"\n>\n <div class=\"form-scroll\">\n <ng-content></ng-content>\n </div>\n <div\n class=\"form-buttons\"\n [class.hidden]=\"!(urlBack() && textValid() !== '')\"\n >\n @if (urlBack()) {\n <dsv-button\n color=\"default\"\n variant=\"outlined\"\n [routerLink]=\"urlBack()\"\n [prevent]=\"false\"\n >{{ 'RETOUR' | translate }}</dsv-button\n >\n }\n @if (textValid() && textValid() !== '') {\n <dsv-button\n type=\"submit\"\n color=\"primary\"\n >{{ textValid()! | translate }}</dsv-button\n >\n }\n </div>\n</form>\n", styles: [":host{--form-flex-direction: column;--form-flex-wrap: nowrap;--form-flex-padding: 0;--form-max-height: auto;--form-overflow: auto;display:flex;width:100%;height:100%}:host form{flex-direction:column;display:flex;margin-top:0;unicode-bidi:isolate;max-height:var(--form-max-height)}:host form .form-scroll{overflow:var(--form-overflow);scrollbar-width:thin;display:flex;flex-direction:var(--form-flex-direction);flex-wrap:var(--form-flex-wrap);padding:var(--form-flex-padding);gap:10px}:host form .form-scroll>div{width:100%}:host .form-buttons:empty{display:none}:host .form-buttons{display:flex;justify-content:flex-end;gap:10px;padding-top:10px}\n"] }]
|
|
84
95
|
}], propDecorators: { form: [{ type: i0.Input, args: [{ isSignal: true, alias: "form", required: true }] }], urlBack: [{ type: i0.Input, args: [{ isSignal: true, alias: "urlBack", required: false }] }], textValid: [{ type: i0.Input, args: [{ isSignal: true, alias: "textValid", required: false }] }], formValid: [{ type: i0.Input, args: [{ isSignal: true, alias: "formValid", required: false }] }], callback: [{ type: i0.Output, args: ["callback"] }] } });
|
|
85
96
|
|
|
86
97
|
class DsvFormReactiveErrorComponent {
|
|
87
|
-
field = input.required(
|
|
88
|
-
|
|
89
|
-
static
|
|
98
|
+
field = input.required(/* @ts-ignore */
|
|
99
|
+
...(ngDevMode ? [{ debugName: "field" }] : /* istanbul ignore next */ []));
|
|
100
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
101
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: DsvFormReactiveErrorComponent, isStandalone: true, selector: "dsv-form-reactive-error", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "text error" }, ngImport: i0, template: "@if (field().touched && field().invalid) {\n @if (field().errors?.['required']) {\n <div>{{ 'Le champ est obligatoire.' | translate }}</div>\n }\n}\n", styles: [":host:not(:empty){padding:10px 3px}\n"], dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
90
102
|
}
|
|
91
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveErrorComponent, decorators: [{
|
|
92
104
|
type: Component,
|
|
93
105
|
args: [{ selector: 'dsv-form-reactive-error', imports: [TranslatePipe], host: {
|
|
94
106
|
class: 'text error',
|
|
@@ -96,26 +108,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
96
108
|
}], propDecorators: { field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: true }] }] } });
|
|
97
109
|
|
|
98
110
|
class DsvFormReactiveInputComponent {
|
|
99
|
-
form = input.required(
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
111
|
+
form = input.required(/* @ts-ignore */
|
|
112
|
+
...(ngDevMode ? [{ debugName: "form" }] : /* istanbul ignore next */ []));
|
|
113
|
+
field = input.required(/* @ts-ignore */
|
|
114
|
+
...(ngDevMode ? [{ debugName: "field" }] : /* istanbul ignore next */ []));
|
|
115
|
+
type = input('text', /* @ts-ignore */
|
|
116
|
+
...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
117
|
+
withLabel = input(true, /* @ts-ignore */
|
|
118
|
+
...(ngDevMode ? [{ debugName: "withLabel" }] : /* istanbul ignore next */ []));
|
|
119
|
+
required = input(false, /* @ts-ignore */
|
|
120
|
+
...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
121
|
+
icon = input(/* @ts-ignore */
|
|
122
|
+
...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
105
123
|
callbackSend = output();
|
|
106
124
|
onEnter() {
|
|
107
125
|
this.callbackSend.emit(this.form().value[this.field()]);
|
|
108
126
|
}
|
|
109
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
110
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
127
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
128
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: DsvFormReactiveInputComponent, isStandalone: true, selector: "dsv-form-reactive-input", inputs: { form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, withLabel: { classPropertyName: "withLabel", publicName: "withLabel", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callbackSend: "callbackSend" }, ngImport: i0, template: "<div [formGroup]=\"form()\">\n @if (withLabel()) {\n <dsv-form-reactive-label [label]=\"field()\" [field]=\"form().get(field())!\" />\n }\n @if (type() === 'textarea') {\n <textarea\n [id]=\"field()\"\n [formControlName]=\"field()\"\n class=\"form-control\"\n [class.error]=\"form().get(field())?.touched && form().get(field())?.invalid\"\n ></textarea>\n } @else {\n <input\n [id]=\"field()\"\n [type]=\"type()\"\n [formControlName]=\"field()\"\n class=\"form-control\"\n [class.icon]=\"icon()\"\n [class.error]=\"form().get(field())?.touched && form().get(field())?.invalid\"\n (change)=\"onEnter()\"\n (keydown.enter)=\"onEnter()\"\n step=\"1\"\n />\n }\n @if (icon()) {\n <i [class]=\"icon()\"></i>\n }\n <dsv-form-reactive-error [field]=\"form().get(field())!\" />\n</div>\n", styles: [":host{--input-width: calc(100% - 12px) ;--input-max-width: auto;--input-opacity: 1;--input-flex-direction: column;--input-align-center: false;--input-justify-content: false;--input-gap: 0;--input-height: auto;--input-min-height: 90px;--input-max-height: 150px;width:100%}:host>div{display:flex;flex-direction:var(--input-flex-direction);gap:var(--input-gap);align-items:var(--input-align-center);justify-content:var(--input-justify-content);position:relative;gap:2px}:host>div .form-control{font-family:inherit;display:block;margin:0;padding:5px;width:var(--input-width);max-width:var(--input-max-width);font-size:1rem;line-height:1.5;color:var(--text);background-color:var(--background-card);background-clip:padding-box;border:1px solid var(--border);border-radius:5px;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;outline-color:#0000004d;opacity:var(--input-opacity)}:host>div .form-control.icon{padding-left:25px}:host>div .form-control.error{border:1px solid var(--error)}:host>div .form-control:disabled{opacity:.6}:host>div i{position:absolute;z-index:1;top:10px;left:7px}:host>div textarea{overflow:auto;scrollbar-width:thin;resize:vertical}:host>div textarea.form-control{height:auto;height:var(--input-height);min-height:var(--input-min-height);max-height:var(--input-max-height)}:host-context(body.dark) .form-control{color-scheme:dark}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DsvFormReactiveLabelComponent, selector: "dsv-form-reactive-label", inputs: ["label", "field", "show"] }, { kind: "component", type: DsvFormReactiveErrorComponent, selector: "dsv-form-reactive-error", inputs: ["field"] }] });
|
|
111
129
|
}
|
|
112
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
130
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveInputComponent, decorators: [{
|
|
113
131
|
type: Component,
|
|
114
132
|
args: [{ selector: 'dsv-form-reactive-input', imports: [ReactiveFormsModule, DsvFormReactiveLabelComponent, DsvFormReactiveErrorComponent], template: "<div [formGroup]=\"form()\">\n @if (withLabel()) {\n <dsv-form-reactive-label [label]=\"field()\" [field]=\"form().get(field())!\" />\n }\n @if (type() === 'textarea') {\n <textarea\n [id]=\"field()\"\n [formControlName]=\"field()\"\n class=\"form-control\"\n [class.error]=\"form().get(field())?.touched && form().get(field())?.invalid\"\n ></textarea>\n } @else {\n <input\n [id]=\"field()\"\n [type]=\"type()\"\n [formControlName]=\"field()\"\n class=\"form-control\"\n [class.icon]=\"icon()\"\n [class.error]=\"form().get(field())?.touched && form().get(field())?.invalid\"\n (change)=\"onEnter()\"\n (keydown.enter)=\"onEnter()\"\n step=\"1\"\n />\n }\n @if (icon()) {\n <i [class]=\"icon()\"></i>\n }\n <dsv-form-reactive-error [field]=\"form().get(field())!\" />\n</div>\n", styles: [":host{--input-width: calc(100% - 12px) ;--input-max-width: auto;--input-opacity: 1;--input-flex-direction: column;--input-align-center: false;--input-justify-content: false;--input-gap: 0;--input-height: auto;--input-min-height: 90px;--input-max-height: 150px;width:100%}:host>div{display:flex;flex-direction:var(--input-flex-direction);gap:var(--input-gap);align-items:var(--input-align-center);justify-content:var(--input-justify-content);position:relative;gap:2px}:host>div .form-control{font-family:inherit;display:block;margin:0;padding:5px;width:var(--input-width);max-width:var(--input-max-width);font-size:1rem;line-height:1.5;color:var(--text);background-color:var(--background-card);background-clip:padding-box;border:1px solid var(--border);border-radius:5px;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;outline-color:#0000004d;opacity:var(--input-opacity)}:host>div .form-control.icon{padding-left:25px}:host>div .form-control.error{border:1px solid var(--error)}:host>div .form-control:disabled{opacity:.6}:host>div i{position:absolute;z-index:1;top:10px;left:7px}:host>div textarea{overflow:auto;scrollbar-width:thin;resize:vertical}:host>div textarea.form-control{height:auto;height:var(--input-height);min-height:var(--input-min-height);max-height:var(--input-max-height)}:host-context(body.dark) .form-control{color-scheme:dark}\n"] }]
|
|
115
133
|
}], propDecorators: { form: [{ type: i0.Input, args: [{ isSignal: true, alias: "form", required: true }] }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: true }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], withLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "withLabel", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], callbackSend: [{ type: i0.Output, args: ["callbackSend"] }] } });
|
|
116
134
|
|
|
117
135
|
class DsvFormReactiveSearchbarComponent extends DsvBaseFormReactiveComponent {
|
|
118
|
-
search = input('',
|
|
136
|
+
search = input('', /* @ts-ignore */
|
|
137
|
+
...(ngDevMode ? [{ debugName: "search" }] : /* istanbul ignore next */ []));
|
|
119
138
|
callbackSearch = output();
|
|
120
139
|
constructor() {
|
|
121
140
|
super();
|
|
@@ -128,27 +147,31 @@ class DsvFormReactiveSearchbarComponent extends DsvBaseFormReactiveComponent {
|
|
|
128
147
|
onSend(value) {
|
|
129
148
|
this.callbackSearch.emit(value);
|
|
130
149
|
}
|
|
131
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
132
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
150
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveSearchbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
151
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: DsvFormReactiveSearchbarComponent, isStandalone: true, selector: "dsv-form-reactive-searchbar", inputs: { search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callbackSearch: "callbackSearch" }, usesInheritance: true, ngImport: i0, template: "<dsv-form-reactive\n [form]=\"form\"\n textValid=\"\"\n>\n <dsv-form-reactive-input\n [form]=\"form\"\n field=\"search\"\n type=\"search\"\n icon=\"icon ri-search-line\"\n [withLabel]=\"false\"\n (callbackSend)=\"onSend($event)\"\n />\n</dsv-form-reactive>\n", styles: [":host{display:flex;margin:5px}:host dsv-form-reactive-input,:host dsv-form-signal-input{--input-width: 100% !important}\n"], dependencies: [{ kind: "component", type: DsvFormReactiveComponent, selector: "dsv-form-reactive", inputs: ["form", "urlBack", "textValid", "formValid"], outputs: ["callback"] }, { kind: "component", type: DsvFormReactiveInputComponent, selector: "dsv-form-reactive-input", inputs: ["form", "field", "type", "withLabel", "required", "icon"], outputs: ["callbackSend"] }] });
|
|
133
152
|
}
|
|
134
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
153
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DsvFormReactiveSearchbarComponent, decorators: [{
|
|
135
154
|
type: Component,
|
|
136
155
|
args: [{ selector: 'dsv-form-reactive-searchbar', imports: [DsvFormReactiveComponent, DsvFormReactiveInputComponent], template: "<dsv-form-reactive\n [form]=\"form\"\n textValid=\"\"\n>\n <dsv-form-reactive-input\n [form]=\"form\"\n field=\"search\"\n type=\"search\"\n icon=\"icon ri-search-line\"\n [withLabel]=\"false\"\n (callbackSend)=\"onSend($event)\"\n />\n</dsv-form-reactive>\n", styles: [":host{display:flex;margin:5px}:host dsv-form-reactive-input,:host dsv-form-signal-input{--input-width: 100% !important}\n"] }]
|
|
137
156
|
}], ctorParameters: () => [], propDecorators: { search: [{ type: i0.Input, args: [{ isSignal: true, alias: "search", required: false }] }], callbackSearch: [{ type: i0.Output, args: ["callbackSearch"] }] } });
|
|
138
157
|
|
|
139
158
|
class FormReactiveSelectComponent {
|
|
140
|
-
form = input.required(
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
159
|
+
form = input.required(/* @ts-ignore */
|
|
160
|
+
...(ngDevMode ? [{ debugName: "form" }] : /* istanbul ignore next */ []));
|
|
161
|
+
field = input.required(/* @ts-ignore */
|
|
162
|
+
...(ngDevMode ? [{ debugName: "field" }] : /* istanbul ignore next */ []));
|
|
163
|
+
withLabel = input(true, /* @ts-ignore */
|
|
164
|
+
...(ngDevMode ? [{ debugName: "withLabel" }] : /* istanbul ignore next */ []));
|
|
165
|
+
list = input([], /* @ts-ignore */
|
|
166
|
+
...(ngDevMode ? [{ debugName: "list" }] : /* istanbul ignore next */ []));
|
|
144
167
|
callbackChange = output();
|
|
145
168
|
doChange() {
|
|
146
169
|
this.callbackChange.emit(this.form().value[this.field()]);
|
|
147
170
|
}
|
|
148
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
149
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
171
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FormReactiveSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
172
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: FormReactiveSelectComponent, isStandalone: true, selector: "dsv-form-reactive-select", inputs: { form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, withLabel: { classPropertyName: "withLabel", publicName: "withLabel", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callbackChange: "callbackChange" }, ngImport: i0, template: "<div [formGroup]=\"form()\">\n <dsv-form-reactive-label\n [label]=\"field()\"\n [field]=\"form().get(field())!\"\n [show]=\"withLabel()\"\n />\n <div>\n <select\n [id]=\"field()\"\n [formControlName]=\"field()\"\n class=\"form-control\"\n (change)=\"doChange()\"\n [class.error]=\"form().get(field())?.touched && form().get(field())?.invalid\"\n >\n @for (list of list(); track list.id) {\n <option [value]=\"list.id\">\n {{ list.name }}\n </option>\n }\n </select>\n <dsv-form-reactive-error [field]=\"form().get(field())!\" />\n </div>\n</div>\n", styles: [":host{--input-width: calc(100% - 12px) ;--input-max-width: auto;--input-opacity: 1;--input-flex-direction: column;--input-align-center: false;--input-justify-content: false;--input-gap: 0;--input-height: auto;--input-min-height: 90px;--input-max-height: 150px;width:100%}:host>div{display:flex;flex-direction:var(--input-flex-direction);gap:var(--input-gap);align-items:var(--input-align-center);justify-content:var(--input-justify-content);position:relative;gap:2px}:host>div .form-control{font-family:inherit;display:block;margin:0;padding:5px;width:var(--input-width);max-width:var(--input-max-width);font-size:1rem;line-height:1.5;color:var(--text);background-color:var(--background-card);background-clip:padding-box;border:1px solid var(--border);border-radius:5px;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;outline-color:#0000004d;opacity:var(--input-opacity)}:host>div .form-control.icon{padding-left:25px}:host>div .form-control.error{border:1px solid var(--error)}:host>div .form-control:disabled{opacity:.6}:host>div i{position:absolute;z-index:1;top:10px;left:7px}:host>div textarea{overflow:auto;scrollbar-width:thin;resize:vertical}:host>div textarea.form-control{height:auto;height:var(--input-height);min-height:var(--input-min-height);max-height:var(--input-max-height)}:host-context(body.dark) .form-control{color-scheme:dark}\n", ":host{--select-width: calc(100% - 2px) ;--select-height: 32px;width:100%}:host>div .form-control{width:var(--select-width);height:var(--select-height)}:host>div .form-control[multiple]{height:auto}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DsvFormReactiveLabelComponent, selector: "dsv-form-reactive-label", inputs: ["label", "field", "show"] }, { kind: "component", type: DsvFormReactiveErrorComponent, selector: "dsv-form-reactive-error", inputs: ["field"] }] });
|
|
150
173
|
}
|
|
151
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FormReactiveSelectComponent, decorators: [{
|
|
152
175
|
type: Component,
|
|
153
176
|
args: [{ selector: 'dsv-form-reactive-select', imports: [ReactiveFormsModule, DsvFormReactiveLabelComponent, DsvFormReactiveErrorComponent], template: "<div [formGroup]=\"form()\">\n <dsv-form-reactive-label\n [label]=\"field()\"\n [field]=\"form().get(field())!\"\n [show]=\"withLabel()\"\n />\n <div>\n <select\n [id]=\"field()\"\n [formControlName]=\"field()\"\n class=\"form-control\"\n (change)=\"doChange()\"\n [class.error]=\"form().get(field())?.touched && form().get(field())?.invalid\"\n >\n @for (list of list(); track list.id) {\n <option [value]=\"list.id\">\n {{ list.name }}\n </option>\n }\n </select>\n <dsv-form-reactive-error [field]=\"form().get(field())!\" />\n </div>\n</div>\n", styles: [":host{--input-width: calc(100% - 12px) ;--input-max-width: auto;--input-opacity: 1;--input-flex-direction: column;--input-align-center: false;--input-justify-content: false;--input-gap: 0;--input-height: auto;--input-min-height: 90px;--input-max-height: 150px;width:100%}:host>div{display:flex;flex-direction:var(--input-flex-direction);gap:var(--input-gap);align-items:var(--input-align-center);justify-content:var(--input-justify-content);position:relative;gap:2px}:host>div .form-control{font-family:inherit;display:block;margin:0;padding:5px;width:var(--input-width);max-width:var(--input-max-width);font-size:1rem;line-height:1.5;color:var(--text);background-color:var(--background-card);background-clip:padding-box;border:1px solid var(--border);border-radius:5px;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;outline-color:#0000004d;opacity:var(--input-opacity)}:host>div .form-control.icon{padding-left:25px}:host>div .form-control.error{border:1px solid var(--error)}:host>div .form-control:disabled{opacity:.6}:host>div i{position:absolute;z-index:1;top:10px;left:7px}:host>div textarea{overflow:auto;scrollbar-width:thin;resize:vertical}:host>div textarea.form-control{height:auto;height:var(--input-height);min-height:var(--input-min-height);max-height:var(--input-max-height)}:host-context(body.dark) .form-control{color-scheme:dark}\n", ":host{--select-width: calc(100% - 2px) ;--select-height: 32px;width:100%}:host>div .form-control{width:var(--select-width);height:var(--select-height)}:host>div .form-control[multiple]{height:auto}\n"] }]
|
|
154
177
|
}], propDecorators: { form: [{ type: i0.Input, args: [{ isSignal: true, alias: "form", required: true }] }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: true }] }], withLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "withLabel", required: false }] }], list: [{ type: i0.Input, args: [{ isSignal: true, alias: "list", required: false }] }], callbackChange: [{ type: i0.Output, args: ["callbackChange"] }] } });
|