@yoozsoft/yoozsoft-ng 4.0.1 → 4.0.3
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/yoozsoft-yoozsoft-ng-file-upload.mjs +59 -22
- package/fesm2022/yoozsoft-yoozsoft-ng-file-upload.mjs.map +1 -1
- package/fesm2022/yoozsoft-yoozsoft-ng-select.mjs +23 -11
- package/fesm2022/yoozsoft-yoozsoft-ng-select.mjs.map +1 -1
- package/fesm2022/yoozsoft-yoozsoft-ng-sidebar.mjs +23 -0
- package/fesm2022/yoozsoft-yoozsoft-ng-sidebar.mjs.map +1 -1
- package/file-upload/src/ys-file-upload/ys-file-upload.component.d.ts +28 -12
- package/navbar/src/models/navbar-item.d.ts +2 -1
- package/package.json +8 -8
- package/select/src/ys-select/ys-select.component.d.ts +5 -2
- package/sidebar/src/models/sidebar-item.d.ts +2 -1
- package/sidebar/src/services/sidebar.service.d.ts +21 -0
|
@@ -1,27 +1,44 @@
|
|
|
1
1
|
import { NgIf, NgFor, NgClass } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { EventEmitter, Component, Input, Output } from '@angular/core';
|
|
3
|
+
import { EventEmitter, forwardRef, Component, Input, Output } from '@angular/core';
|
|
4
|
+
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
4
5
|
|
|
5
6
|
class YsFileUploadComponent {
|
|
6
7
|
fileList;
|
|
7
8
|
files = [];
|
|
8
|
-
selectedFile;
|
|
9
|
+
selectedFile = null;
|
|
10
|
+
styleClass;
|
|
11
|
+
/**
|
|
12
|
+
* Allowing upload multiple files
|
|
13
|
+
* Default is false
|
|
14
|
+
*/
|
|
9
15
|
multiple = false;
|
|
16
|
+
/**
|
|
17
|
+
* Acceptable type of files
|
|
18
|
+
* Default is all file type
|
|
19
|
+
*/
|
|
10
20
|
accept = '*/*';
|
|
11
|
-
/**
|
|
21
|
+
/**
|
|
22
|
+
* Upload button label
|
|
23
|
+
* Default is Choose File
|
|
24
|
+
*/
|
|
12
25
|
uploadLabel = 'Choose File';
|
|
13
26
|
/**Style class of upload button */
|
|
14
27
|
uploadStyleClass;
|
|
15
28
|
/**Icon class of upload button */
|
|
16
29
|
uploadIconClass = 'fa fa-paperclip';
|
|
30
|
+
/**Display choosed file remove button */
|
|
31
|
+
isRemove = true;
|
|
17
32
|
/**Icon of remove item button */
|
|
18
33
|
removeIconClass = 'fa fa-times';
|
|
19
|
-
/**
|
|
34
|
+
/**
|
|
35
|
+
* Files list display direction
|
|
36
|
+
* Default is vertical (false)
|
|
37
|
+
*/
|
|
20
38
|
isHorizontal = false;
|
|
21
|
-
/**
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
message = "No file chosen";
|
|
39
|
+
/**Message displayed before choosing file */
|
|
40
|
+
noFileMessage = "No file chosen";
|
|
41
|
+
progressStyleClass;
|
|
25
42
|
/**Value of progress element */
|
|
26
43
|
progressValue;
|
|
27
44
|
/**Max value of progress element */
|
|
@@ -30,8 +47,8 @@ class YsFileUploadComponent {
|
|
|
30
47
|
isCancel = false;
|
|
31
48
|
/**Event to get choosed files */
|
|
32
49
|
choosed = new EventEmitter();
|
|
33
|
-
/**Event of selected file */
|
|
34
|
-
|
|
50
|
+
/**Event of selected file in the list of choosed file*/
|
|
51
|
+
select = new EventEmitter();
|
|
35
52
|
/**Event of cancel upload button */
|
|
36
53
|
cancel = new EventEmitter();
|
|
37
54
|
/**Disable elements */
|
|
@@ -44,6 +61,10 @@ class YsFileUploadComponent {
|
|
|
44
61
|
this.files = [];
|
|
45
62
|
return;
|
|
46
63
|
}
|
|
64
|
+
if (!Array.isArray(obj)) {
|
|
65
|
+
this.files = [obj];
|
|
66
|
+
return;
|
|
67
|
+
}
|
|
47
68
|
this.files = obj;
|
|
48
69
|
}
|
|
49
70
|
registerOnChange(fn) {
|
|
@@ -55,7 +76,7 @@ class YsFileUploadComponent {
|
|
|
55
76
|
setDisabledState(isDisabled) {
|
|
56
77
|
this.disabled = isDisabled;
|
|
57
78
|
}
|
|
58
|
-
|
|
79
|
+
onChangeFiles(event) {
|
|
59
80
|
this.fileList = event.target.files;
|
|
60
81
|
if (this.fileList?.length) {
|
|
61
82
|
if (!this.multiple) {
|
|
@@ -72,34 +93,48 @@ class YsFileUploadComponent {
|
|
|
72
93
|
}
|
|
73
94
|
this.onChange(this.files);
|
|
74
95
|
this.onTouched(this.files);
|
|
75
|
-
this.choosed.emit(this.files);
|
|
96
|
+
this.choosed.emit(this.multiple ? this.files : this.files[0]);
|
|
76
97
|
event.target.value = null;
|
|
77
98
|
}
|
|
78
99
|
removeFile(file) {
|
|
79
100
|
const index = this.files.indexOf(file);
|
|
80
101
|
this.files.splice(index, 1);
|
|
81
|
-
this.onChange(this.files);
|
|
102
|
+
this.onChange(this.multiple ? this.files : this.files[0]);
|
|
82
103
|
this.onTouched(this.files);
|
|
83
104
|
this.choosed.emit(this.files);
|
|
84
105
|
if (this.selectedFile == file) {
|
|
85
|
-
this.selectedFile =
|
|
86
|
-
this.
|
|
106
|
+
this.selectedFile = null;
|
|
107
|
+
this.select.emit(null);
|
|
87
108
|
}
|
|
88
109
|
}
|
|
89
110
|
onSelectFile(file) {
|
|
90
111
|
this.selectedFile = file;
|
|
91
|
-
this.
|
|
112
|
+
this.select.emit(this.selectedFile);
|
|
92
113
|
}
|
|
93
114
|
cancelUpload() {
|
|
94
115
|
this.cancel.emit();
|
|
95
116
|
}
|
|
96
117
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.3", ngImport: i0, type: YsFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
97
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.3", type: YsFileUploadComponent, isStandalone: true, selector: "ys-file-upload", inputs: { multiple: "multiple", accept: "accept", uploadLabel: "uploadLabel", uploadStyleClass: "uploadStyleClass", uploadIconClass: "uploadIconClass", removeIconClass: "removeIconClass", isHorizontal: "isHorizontal",
|
|
118
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.3", type: YsFileUploadComponent, isStandalone: true, selector: "ys-file-upload", inputs: { styleClass: "styleClass", multiple: "multiple", accept: "accept", uploadLabel: "uploadLabel", uploadStyleClass: "uploadStyleClass", uploadIconClass: "uploadIconClass", isRemove: "isRemove", removeIconClass: "removeIconClass", isHorizontal: "isHorizontal", noFileMessage: "noFileMessage", progressStyleClass: "progressStyleClass", progressValue: "progressValue", progressValueMax: "progressValueMax", isCancel: "isCancel", disabled: "disabled" }, outputs: { choosed: "choosed", select: "select", cancel: "cancel" }, providers: [
|
|
119
|
+
{
|
|
120
|
+
provide: NG_VALUE_ACCESSOR,
|
|
121
|
+
useExisting: forwardRef(() => YsFileUploadComponent),
|
|
122
|
+
multi: true
|
|
123
|
+
}
|
|
124
|
+
], ngImport: i0, template: "<input class=\"form-control d-none file-upload\" type=\"file\" id=\"ysFileUpload\" #ysFileUpload [multiple]=\"multiple\"\r\n [accept]=\"accept\" [disabled]=\"disabled\" (change)=\"onChangeFiles($event)\">\r\n\r\n<div class=\"file-upload\" [ngClass]=\"styleClass\">\r\n <div class=\"row\">\r\n <div class=\"col\">\r\n <button class=\"btn btn-primary btn-upload {{uploadStyleClass}}\" (click)=\"ysFileUpload.click()\"\r\n [disabled]=\"disabled\">\r\n <i [ngClass]=\"uploadIconClass\"></i>\r\n <span class=\"ms-2\" *ngIf=\"uploadLabel\">{{uploadLabel}}</span>\r\n </button>\r\n\r\n <span class=\"ms-2\" *ngIf=\"noFileMessage\">{{files.length ? '' : noFileMessage}}</span>\r\n\r\n <ul *ngIf=\"files.length\" class=\"file-upload-list list-group mt-2\"\r\n [ngClass]=\"{'list-group-horizontal overflow-auto': isHorizontal}\">\r\n <a class=\"file-upload-item list-group-item d-flex align-items-center\" role=\"button\"\r\n *ngFor=\"let file of files\" (click)=\"onSelectFile(file)\"\r\n [ngClass]=\"{'active': file == selectedFile, 'disabled': disabled}\">\r\n <span class=\"me-2\">{{file.name}}</span>\r\n <button *ngIf=\"isRemove\" class=\"btn btn-outline-danger btn-sm ms-auto\" type=\"button\"\r\n id=\"removeFileButton\" (click)=\"removeFile(file); $event.stopPropagation();\"\r\n [disabled]=\"disabled\">\r\n <i [ngClass]=\"removeIconClass\"></i>\r\n </button>\r\n </a>\r\n </ul>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"progress mt-2\" [ngClass]=\"progressStyleClass\" *ngIf=\"progressValue\">\r\n <div class=\"progress-bar\" role=\"progressbar\" [style.width.%]=\"progressValue\" [attr.aria-valuenow]=\"progressValue\"\r\n aria-valuemin=\"0\" [attr.aria-valuemax]=\"progressValueMax\"></div>\r\n\r\n <button *ngIf=\"isCancel && progressValue < progressValueMax\" class=\"btn btn-danger btn-sm btn-upload-cancel d-flex\"\r\n (click)=\"cancelUpload()\">\r\n <i class=\"fa fa-times\"></i>\r\n </button>\r\n</div>", styles: [".progress{height:20px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
98
125
|
}
|
|
99
126
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.3", ngImport: i0, type: YsFileUploadComponent, decorators: [{
|
|
100
127
|
type: Component,
|
|
101
|
-
args: [{ selector: 'ys-file-upload', imports: [NgIf, NgFor, NgClass],
|
|
102
|
-
|
|
128
|
+
args: [{ selector: 'ys-file-upload', imports: [NgIf, NgFor, NgClass], providers: [
|
|
129
|
+
{
|
|
130
|
+
provide: NG_VALUE_ACCESSOR,
|
|
131
|
+
useExisting: forwardRef(() => YsFileUploadComponent),
|
|
132
|
+
multi: true
|
|
133
|
+
}
|
|
134
|
+
], template: "<input class=\"form-control d-none file-upload\" type=\"file\" id=\"ysFileUpload\" #ysFileUpload [multiple]=\"multiple\"\r\n [accept]=\"accept\" [disabled]=\"disabled\" (change)=\"onChangeFiles($event)\">\r\n\r\n<div class=\"file-upload\" [ngClass]=\"styleClass\">\r\n <div class=\"row\">\r\n <div class=\"col\">\r\n <button class=\"btn btn-primary btn-upload {{uploadStyleClass}}\" (click)=\"ysFileUpload.click()\"\r\n [disabled]=\"disabled\">\r\n <i [ngClass]=\"uploadIconClass\"></i>\r\n <span class=\"ms-2\" *ngIf=\"uploadLabel\">{{uploadLabel}}</span>\r\n </button>\r\n\r\n <span class=\"ms-2\" *ngIf=\"noFileMessage\">{{files.length ? '' : noFileMessage}}</span>\r\n\r\n <ul *ngIf=\"files.length\" class=\"file-upload-list list-group mt-2\"\r\n [ngClass]=\"{'list-group-horizontal overflow-auto': isHorizontal}\">\r\n <a class=\"file-upload-item list-group-item d-flex align-items-center\" role=\"button\"\r\n *ngFor=\"let file of files\" (click)=\"onSelectFile(file)\"\r\n [ngClass]=\"{'active': file == selectedFile, 'disabled': disabled}\">\r\n <span class=\"me-2\">{{file.name}}</span>\r\n <button *ngIf=\"isRemove\" class=\"btn btn-outline-danger btn-sm ms-auto\" type=\"button\"\r\n id=\"removeFileButton\" (click)=\"removeFile(file); $event.stopPropagation();\"\r\n [disabled]=\"disabled\">\r\n <i [ngClass]=\"removeIconClass\"></i>\r\n </button>\r\n </a>\r\n </ul>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"progress mt-2\" [ngClass]=\"progressStyleClass\" *ngIf=\"progressValue\">\r\n <div class=\"progress-bar\" role=\"progressbar\" [style.width.%]=\"progressValue\" [attr.aria-valuenow]=\"progressValue\"\r\n aria-valuemin=\"0\" [attr.aria-valuemax]=\"progressValueMax\"></div>\r\n\r\n <button *ngIf=\"isCancel && progressValue < progressValueMax\" class=\"btn btn-danger btn-sm btn-upload-cancel d-flex\"\r\n (click)=\"cancelUpload()\">\r\n <i class=\"fa fa-times\"></i>\r\n </button>\r\n</div>", styles: [".progress{height:20px}\n"] }]
|
|
135
|
+
}], ctorParameters: () => [], propDecorators: { styleClass: [{
|
|
136
|
+
type: Input
|
|
137
|
+
}], multiple: [{
|
|
103
138
|
type: Input
|
|
104
139
|
}], accept: [{
|
|
105
140
|
type: Input
|
|
@@ -109,13 +144,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.3", ngImpor
|
|
|
109
144
|
type: Input
|
|
110
145
|
}], uploadIconClass: [{
|
|
111
146
|
type: Input
|
|
147
|
+
}], isRemove: [{
|
|
148
|
+
type: Input
|
|
112
149
|
}], removeIconClass: [{
|
|
113
150
|
type: Input
|
|
114
151
|
}], isHorizontal: [{
|
|
115
152
|
type: Input
|
|
116
|
-
}],
|
|
153
|
+
}], noFileMessage: [{
|
|
117
154
|
type: Input
|
|
118
|
-
}],
|
|
155
|
+
}], progressStyleClass: [{
|
|
119
156
|
type: Input
|
|
120
157
|
}], progressValue: [{
|
|
121
158
|
type: Input
|
|
@@ -125,7 +162,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.3", ngImpor
|
|
|
125
162
|
type: Input
|
|
126
163
|
}], choosed: [{
|
|
127
164
|
type: Output
|
|
128
|
-
}],
|
|
165
|
+
}], select: [{
|
|
129
166
|
type: Output
|
|
130
167
|
}], cancel: [{
|
|
131
168
|
type: Output
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"yoozsoft-yoozsoft-ng-file-upload.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/file-upload/src/ys-file-upload/ys-file-upload.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/src/ys-file-upload/ys-file-upload.component.html","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/yoozsoft-yoozsoft-ng-file-upload.ts"],"sourcesContent":["import { NgClass, NgFor, NgIf } from '@angular/common';\r\nimport { Component, EventEmitter, Input, Output } from '@angular/core';\r\nimport { ControlValueAccessor } from '@angular/forms';\r\n\r\n@Component({\r\n selector: 'ys-file-upload',\r\n imports: [NgIf, NgFor, NgClass],\r\n templateUrl: './ys-file-upload.component.html',\r\n styleUrl: './ys-file-upload.component.scss'\r\n})\r\nexport class YsFileUploadComponent implements ControlValueAccessor {\r\n\r\n private fileList?: FileList;\r\n files: File[] = [];\r\n selectedFile?: File;\r\n\r\n @Input() multiple: boolean = false;\r\n @Input() accept: string = '*/*';\r\n /**Label of upload button */\r\n @Input() uploadLabel?: string = 'Choose File';\r\n /**Style class of upload button */\r\n @Input() uploadStyleClass?: string;\r\n /**Icon class of upload button */\r\n @Input() uploadIconClass: string = 'fa fa-paperclip';\r\n /**Icon of remove item button */\r\n @Input() removeIconClass: string = 'fa fa-times';\r\n /**Files display style */\r\n @Input() isHorizontal: boolean = false;\r\n /**Display remove button */\r\n @Input() isRemove: boolean = true;\r\n\r\n /**Message displayed before choosen file */\r\n @Input() message: string = \"No file chosen\";\r\n\r\n /**Value of progress element */\r\n @Input() progressValue?: number;\r\n /**Max value of progress element */\r\n @Input() progressValueMax: number = 100;\r\n /**Display cancel upload button */\r\n @Input() isCancel: boolean = false;\r\n\r\n /**Event to get choosed files */\r\n @Output() choosed: EventEmitter<File[]> = new EventEmitter();\r\n /**Event of selected file */\r\n @Output() selected: EventEmitter<File | undefined> = new EventEmitter();\r\n /**Event of cancel upload button */\r\n @Output() cancel: EventEmitter<void> = new EventEmitter();\r\n\r\n /**Disable elements */\r\n @Input() disabled: boolean = false;\r\n onChange: any = () => { }\r\n onTouched: any = () => { }\r\n\r\n constructor() { }\r\n\r\n writeValue(obj: any): void {\r\n if (!obj) {\r\n this.files = [];\r\n return;\r\n }\r\n\r\n this.files = obj;\r\n }\r\n registerOnChange(fn: any): void {\r\n this.onChange = fn;\r\n }\r\n registerOnTouched(fn: any): void {\r\n this.onTouched = fn;\r\n }\r\n setDisabledState?(isDisabled: boolean): void {\r\n this.disabled = isDisabled;\r\n }\r\n\r\n onChoosedFiles(event: any) {\r\n this.fileList = event.target.files;\r\n\r\n if (this.fileList?.length) {\r\n\r\n if (!this.multiple) {\r\n this.files = [];\r\n }\r\n\r\n for (let i = 0; i < this.fileList.length; i++) {\r\n const file: File = this.fileList.item(i)!;\r\n this.files.push(file);\r\n }\r\n\r\n this.files.sort((a, b) => a.name > b.name ? -1 : 1);\r\n\r\n } else {\r\n this.files = [];\r\n }\r\n\r\n this.onChange(this.files);\r\n this.onTouched(this.files);\r\n\r\n this.choosed.emit(this.files);\r\n\r\n event.target.value = null;\r\n\r\n }\r\n\r\n removeFile(file: File) {\r\n const index = this.files.indexOf(file);\r\n this.files.splice(index, 1);\r\n\r\n this.onChange(this.files);\r\n this.onTouched(this.files);\r\n\r\n this.choosed.emit(this.files);\r\n\r\n if (this.selectedFile == file) {\r\n this.selectedFile = undefined;\r\n this.selected.emit(undefined);\r\n }\r\n }\r\n\r\n onSelectFile(file: File) {\r\n this.selectedFile = file;\r\n this.selected.emit(this.selectedFile);\r\n }\r\n\r\n cancelUpload() {\r\n this.cancel.emit();\r\n }\r\n\r\n}\r\n","<input class=\"form-control d-none file-upload\" type=\"file\" id=\"ysFileUpload\" #ysFileUpload [multiple]=\"multiple\"\r\n [accept]=\"accept\" [disabled]=\"disabled\" (change)=\"onChoosedFiles($event)\">\r\n\r\n<div class=\"file-upload\">\r\n <div class=\"row\">\r\n <div class=\"col\">\r\n <button class=\"btn btn-primary btn-upload {{uploadStyleClass}}\" (click)=\"ysFileUpload.click()\"\r\n [disabled]=\"disabled\">\r\n <i [ngClass]=\"uploadIconClass\"></i>\r\n <span class=\"ms-2\" *ngIf=\"uploadLabel\">{{uploadLabel}}</span>\r\n </button>\r\n\r\n <span class=\"ms-2\">{{files.length ? '' : message}}</span>\r\n\r\n <ul *ngIf=\"files.length\" class=\"file-upload-list list-group mt-2\"\r\n [ngClass]=\"{'list-group-horizontal': isHorizontal}\">\r\n <a class=\"file-upload-item list-group-item d-flex align-items-center\" role=\"button\"\r\n *ngFor=\"let file of files\" (click)=\"onSelectFile(file)\"\r\n [ngClass]=\"{'active': file == selectedFile, 'disabled': disabled}\">\r\n <span class=\"me-2\">{{file.name}}</span>\r\n <button *ngIf=\"isRemove\" class=\"btn btn-outline-danger btn-sm ms-auto\" type=\"button\"\r\n id=\"removeFileButton\" (click)=\"removeFile(file); $event.stopPropagation();\"\r\n [disabled]=\"disabled\">\r\n <i [ngClass]=\"removeIconClass\"></i>\r\n </button>\r\n </a>\r\n </ul>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"progress mt-2\" style=\"height: 20px;\" *ngIf=\"progressValue\">\r\n <div class=\"progress-bar\" role=\"progressbar\" [style.width.%]=\"progressValue\" [attr.aria-valuenow]=\"progressValue\"\r\n aria-valuemin=\"0\" [attr.aria-valuemax]=\"progressValueMax\"></div>\r\n\r\n <button *ngIf=\"isCancel && progressValue < progressValueMax\" class=\"btn btn-danger btn-sm btn-upload-cancel d-flex\"\r\n (click)=\"cancelUpload()\">\r\n <i class=\"fa fa-times\" (click)=\"cancelUpload()\"></i>\r\n </button>\r\n</div>","/*\r\n * Public API Surface of ys-select\r\n */\r\n\r\nexport * from './src/ys-file-upload/ys-file-upload.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"yoozsoft-yoozsoft-ng-file-upload.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/file-upload/src/ys-file-upload/ys-file-upload.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/src/ys-file-upload/ys-file-upload.component.html","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/yoozsoft-yoozsoft-ng-file-upload.ts"],"sourcesContent":["import { NgClass, NgFor, NgIf } from '@angular/common';\r\nimport { Component, EventEmitter, forwardRef, Input, Output } from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\n@Component({\r\n selector: 'ys-file-upload',\r\n imports: [NgIf, NgFor, NgClass],\r\n templateUrl: './ys-file-upload.component.html',\r\n styleUrl: './ys-file-upload.component.scss',\r\n providers: [\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => YsFileUploadComponent),\r\n multi: true\r\n }\r\n ]\r\n})\r\nexport class YsFileUploadComponent implements ControlValueAccessor {\r\n\r\n private fileList?: FileList;\r\n files: File[] = [];\r\n selectedFile: File | null = null;\r\n\r\n @Input() styleClass?: string;\r\n /**\r\n * Allowing upload multiple files\r\n * Default is false\r\n */\r\n @Input() multiple: boolean = false;\r\n /**\r\n * Acceptable type of files\r\n * Default is all file type\r\n */\r\n @Input() accept: string = '*/*';\r\n /**\r\n * Upload button label\r\n * Default is Choose File\r\n */\r\n @Input() uploadLabel?: string = 'Choose File';\r\n /**Style class of upload button */\r\n @Input() uploadStyleClass?: string;\r\n /**Icon class of upload button */\r\n @Input() uploadIconClass: string = 'fa fa-paperclip';\r\n\r\n /**Display choosed file remove button */\r\n @Input() isRemove: boolean = true;\r\n /**Icon of remove item button */\r\n @Input() removeIconClass: string = 'fa fa-times';\r\n\r\n /**\r\n * Files list display direction\r\n * Default is vertical (false)\r\n */\r\n @Input() isHorizontal: boolean = false;\r\n\r\n /**Message displayed before choosing file */\r\n @Input() noFileMessage: string = \"No file chosen\";\r\n\r\n @Input() progressStyleClass?: string;\r\n /**Value of progress element */\r\n @Input() progressValue?: number;\r\n /**Max value of progress element */\r\n @Input() progressValueMax: number = 100;\r\n /**Display cancel upload button */\r\n @Input() isCancel: boolean = false;\r\n\r\n /**Event to get choosed files */\r\n @Output() choosed: EventEmitter<File | File[]> = new EventEmitter();\r\n /**Event of selected file in the list of choosed file*/\r\n @Output() select: EventEmitter<File | null> = new EventEmitter();\r\n /**Event of cancel upload button */\r\n @Output() cancel: EventEmitter<void> = new EventEmitter();\r\n\r\n /**Disable elements */\r\n @Input() disabled: boolean = false;\r\n onChange: any = () => { }\r\n onTouched: any = () => { }\r\n\r\n constructor() { }\r\n\r\n writeValue(obj: any): void {\r\n if (!obj) {\r\n this.files = [];\r\n return;\r\n }\r\n\r\n if (!Array.isArray(obj)) {\r\n this.files = [obj];\r\n return;\r\n }\r\n\r\n this.files = obj;\r\n }\r\n registerOnChange(fn: any): void {\r\n this.onChange = fn;\r\n }\r\n registerOnTouched(fn: any): void {\r\n this.onTouched = fn;\r\n }\r\n setDisabledState?(isDisabled: boolean): void {\r\n this.disabled = isDisabled;\r\n }\r\n\r\n onChangeFiles(event: any) {\r\n this.fileList = event.target.files;\r\n\r\n if (this.fileList?.length) {\r\n\r\n if (!this.multiple) {\r\n this.files = [];\r\n }\r\n\r\n for (let i = 0; i < this.fileList.length; i++) {\r\n const file: File = this.fileList.item(i)!;\r\n this.files.push(file);\r\n }\r\n\r\n this.files.sort((a, b) => a.name > b.name ? -1 : 1);\r\n\r\n } else {\r\n this.files = [];\r\n }\r\n\r\n this.onChange(this.files);\r\n this.onTouched(this.files);\r\n\r\n this.choosed.emit(this.multiple ? this.files : this.files[0]);\r\n\r\n event.target.value = null;\r\n\r\n }\r\n\r\n removeFile(file: File) {\r\n const index = this.files.indexOf(file);\r\n this.files.splice(index, 1);\r\n\r\n this.onChange(this.multiple ? this.files : this.files[0]);\r\n this.onTouched(this.files);\r\n\r\n this.choosed.emit(this.files);\r\n\r\n if (this.selectedFile == file) {\r\n this.selectedFile = null;\r\n this.select.emit(null);\r\n }\r\n }\r\n\r\n onSelectFile(file: File) {\r\n this.selectedFile = file;\r\n this.select.emit(this.selectedFile);\r\n }\r\n\r\n cancelUpload() {\r\n this.cancel.emit();\r\n }\r\n\r\n}\r\n","<input class=\"form-control d-none file-upload\" type=\"file\" id=\"ysFileUpload\" #ysFileUpload [multiple]=\"multiple\"\r\n [accept]=\"accept\" [disabled]=\"disabled\" (change)=\"onChangeFiles($event)\">\r\n\r\n<div class=\"file-upload\" [ngClass]=\"styleClass\">\r\n <div class=\"row\">\r\n <div class=\"col\">\r\n <button class=\"btn btn-primary btn-upload {{uploadStyleClass}}\" (click)=\"ysFileUpload.click()\"\r\n [disabled]=\"disabled\">\r\n <i [ngClass]=\"uploadIconClass\"></i>\r\n <span class=\"ms-2\" *ngIf=\"uploadLabel\">{{uploadLabel}}</span>\r\n </button>\r\n\r\n <span class=\"ms-2\" *ngIf=\"noFileMessage\">{{files.length ? '' : noFileMessage}}</span>\r\n\r\n <ul *ngIf=\"files.length\" class=\"file-upload-list list-group mt-2\"\r\n [ngClass]=\"{'list-group-horizontal overflow-auto': isHorizontal}\">\r\n <a class=\"file-upload-item list-group-item d-flex align-items-center\" role=\"button\"\r\n *ngFor=\"let file of files\" (click)=\"onSelectFile(file)\"\r\n [ngClass]=\"{'active': file == selectedFile, 'disabled': disabled}\">\r\n <span class=\"me-2\">{{file.name}}</span>\r\n <button *ngIf=\"isRemove\" class=\"btn btn-outline-danger btn-sm ms-auto\" type=\"button\"\r\n id=\"removeFileButton\" (click)=\"removeFile(file); $event.stopPropagation();\"\r\n [disabled]=\"disabled\">\r\n <i [ngClass]=\"removeIconClass\"></i>\r\n </button>\r\n </a>\r\n </ul>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"progress mt-2\" [ngClass]=\"progressStyleClass\" *ngIf=\"progressValue\">\r\n <div class=\"progress-bar\" role=\"progressbar\" [style.width.%]=\"progressValue\" [attr.aria-valuenow]=\"progressValue\"\r\n aria-valuemin=\"0\" [attr.aria-valuemax]=\"progressValueMax\"></div>\r\n\r\n <button *ngIf=\"isCancel && progressValue < progressValueMax\" class=\"btn btn-danger btn-sm btn-upload-cancel d-flex\"\r\n (click)=\"cancelUpload()\">\r\n <i class=\"fa fa-times\"></i>\r\n </button>\r\n</div>","/*\r\n * Public API Surface of ys-select\r\n */\r\n\r\nexport * from './src/ys-file-upload/ys-file-upload.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { NgIf, NgFor
|
|
1
|
+
import { NgIf, NgFor } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
3
|
import { forwardRef, Component, Input } from '@angular/core';
|
|
4
4
|
import * as i1 from '@angular/forms';
|
|
@@ -16,16 +16,24 @@ class YsSelectComponent {
|
|
|
16
16
|
invalidStyleClass = 'is-invalid';
|
|
17
17
|
valid = false;
|
|
18
18
|
validStyleClass = 'is-valid';
|
|
19
|
+
/**Support multiple attribute */
|
|
19
20
|
multiple = false;
|
|
21
|
+
/**Size of multiple attribute */
|
|
22
|
+
size;
|
|
20
23
|
/**Display clear button */
|
|
21
24
|
isClear = false;
|
|
22
|
-
|
|
25
|
+
disabled = false;
|
|
23
26
|
onChange = () => { };
|
|
24
27
|
onTouched = () => { };
|
|
25
28
|
value;
|
|
26
29
|
writeValue(obj) {
|
|
27
|
-
if (this.placeholder && !obj) {
|
|
28
|
-
this.value =
|
|
30
|
+
if (!this.multiple && this.placeholder && !obj) {
|
|
31
|
+
this.value = null;
|
|
32
|
+
this.onChange(this.value);
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
35
|
+
if (this.multiple && !obj) {
|
|
36
|
+
this.multiple ? this.value = [] : this.value = null;
|
|
29
37
|
this.onChange(this.value);
|
|
30
38
|
return;
|
|
31
39
|
}
|
|
@@ -34,7 +42,7 @@ class YsSelectComponent {
|
|
|
34
42
|
this.value = obj[0];
|
|
35
43
|
}
|
|
36
44
|
else {
|
|
37
|
-
this.value =
|
|
45
|
+
this.value = null;
|
|
38
46
|
}
|
|
39
47
|
this.onChange(this.value);
|
|
40
48
|
return;
|
|
@@ -48,37 +56,37 @@ class YsSelectComponent {
|
|
|
48
56
|
this.onTouched = fn;
|
|
49
57
|
}
|
|
50
58
|
setDisabledState(isDisabled) {
|
|
51
|
-
this.
|
|
59
|
+
this.disabled = isDisabled;
|
|
52
60
|
}
|
|
53
61
|
onModelChange(option) {
|
|
54
62
|
this.onChange(option);
|
|
55
63
|
this.onTouched(option);
|
|
56
64
|
}
|
|
57
65
|
clearValue() {
|
|
58
|
-
this.value =
|
|
66
|
+
this.multiple ? this.value = [] : this.value = null;
|
|
59
67
|
this.onModelChange(this.value);
|
|
60
68
|
}
|
|
61
69
|
isObject(item) {
|
|
62
70
|
return typeof item == 'object';
|
|
63
71
|
}
|
|
64
72
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.3", ngImport: i0, type: YsSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
65
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.3", type: YsSelectComponent, isStandalone: true, selector: "ys-select", inputs: { id: "id", options: "options", optionLabel: "optionLabel", placeholder: "placeholder", styleClass: "styleClass", invalid: "invalid", invalidStyleClass: "invalidStyleClass", valid: "valid", validStyleClass: "validStyleClass", multiple: "multiple", isClear: "isClear" }, providers: [
|
|
73
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.3", type: YsSelectComponent, isStandalone: true, selector: "ys-select", inputs: { id: "id", options: "options", optionLabel: "optionLabel", placeholder: "placeholder", styleClass: "styleClass", invalid: "invalid", invalidStyleClass: "invalidStyleClass", valid: "valid", validStyleClass: "validStyleClass", multiple: "multiple", size: "size", isClear: "isClear", disabled: "disabled" }, providers: [
|
|
66
74
|
{
|
|
67
75
|
provide: NG_VALUE_ACCESSOR,
|
|
68
76
|
useExisting: forwardRef(() => YsSelectComponent),
|
|
69
77
|
multi: true
|
|
70
78
|
}
|
|
71
|
-
], ngImport: i0, template: "<div class=\"input-group ys-select\">\r\n\r\n <select *ngIf=\"!multiple\" [id]=\"id\"\r\n class=\"form-select {{styleClass}} {{invalid && invalidStyleClass}} {{valid && validStyleClass}}\"\r\n aria-label=\"Select option\" [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange($event)\" [disabled]=\"
|
|
79
|
+
], ngImport: i0, template: "<div class=\"input-group ys-select\">\r\n\r\n <select *ngIf=\"!multiple\" [id]=\"id\"\r\n class=\"form-select {{styleClass}} {{invalid && invalidStyleClass}} {{valid && validStyleClass}}\"\r\n aria-label=\"Select option\" [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange($event)\" [disabled]=\"disabled\">\r\n <option *ngIf=\"placeholder\" selected disabled [ngValue]=\"null\" class=\"d-none\"> {{placeholder}}\r\n </option>\r\n <option *ngFor=\"let item of options; let i = index;\" [selected]=\" i === 0 && !placeholder \" [ngValue]=\"item\">\r\n {{isObject(item) ? item[optionLabel] : item}}\r\n </option>\r\n </select>\r\n\r\n <select *ngIf=\"multiple\" [id]=\"id\"\r\n class=\"form-select {{styleClass}} {{invalid && invalidStyleClass}} {{valid && validStyleClass}}\"\r\n aria-label=\"Select option\" [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange($event)\" [disabled]=\"disabled\"\r\n [multiple]=\"multiple\" [size]=\"size\">\r\n <option *ngIf=\"placeholder\" selected disabled [ngValue]=\"null\"> {{placeholder}}\r\n </option>\r\n <option *ngFor=\"let item of options; let i = index;\" [selected]=\" i === 0 && !placeholder \" [ngValue]=\"item\">\r\n {{isObject(item) ? item[optionLabel] : item}}\r\n </option>\r\n </select>\r\n\r\n <button *ngIf=\"isClear\" class=\"btn btn-outline-secondary btn-clear\" type=\"button\" id=\"btn-clear\"\r\n (click)=\"clearValue()\" [disabled]=\"disabled\">\r\n <span class=\"fa fa-times\"></span>\r\n </button>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }, { 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])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
72
80
|
}
|
|
73
81
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.3", ngImport: i0, type: YsSelectComponent, decorators: [{
|
|
74
82
|
type: Component,
|
|
75
|
-
args: [{ selector: 'ys-select', imports: [NgIf, NgFor,
|
|
83
|
+
args: [{ selector: 'ys-select', imports: [NgIf, NgFor, FormsModule], providers: [
|
|
76
84
|
{
|
|
77
85
|
provide: NG_VALUE_ACCESSOR,
|
|
78
86
|
useExisting: forwardRef(() => YsSelectComponent),
|
|
79
87
|
multi: true
|
|
80
88
|
}
|
|
81
|
-
], template: "<div class=\"input-group ys-select\">\r\n\r\n <select *ngIf=\"!multiple\" [id]=\"id\"\r\n class=\"form-select {{styleClass}} {{invalid && invalidStyleClass}} {{valid && validStyleClass}}\"\r\n aria-label=\"Select option\" [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange($event)\" [disabled]=\"
|
|
89
|
+
], template: "<div class=\"input-group ys-select\">\r\n\r\n <select *ngIf=\"!multiple\" [id]=\"id\"\r\n class=\"form-select {{styleClass}} {{invalid && invalidStyleClass}} {{valid && validStyleClass}}\"\r\n aria-label=\"Select option\" [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange($event)\" [disabled]=\"disabled\">\r\n <option *ngIf=\"placeholder\" selected disabled [ngValue]=\"null\" class=\"d-none\"> {{placeholder}}\r\n </option>\r\n <option *ngFor=\"let item of options; let i = index;\" [selected]=\" i === 0 && !placeholder \" [ngValue]=\"item\">\r\n {{isObject(item) ? item[optionLabel] : item}}\r\n </option>\r\n </select>\r\n\r\n <select *ngIf=\"multiple\" [id]=\"id\"\r\n class=\"form-select {{styleClass}} {{invalid && invalidStyleClass}} {{valid && validStyleClass}}\"\r\n aria-label=\"Select option\" [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange($event)\" [disabled]=\"disabled\"\r\n [multiple]=\"multiple\" [size]=\"size\">\r\n <option *ngIf=\"placeholder\" selected disabled [ngValue]=\"null\"> {{placeholder}}\r\n </option>\r\n <option *ngFor=\"let item of options; let i = index;\" [selected]=\" i === 0 && !placeholder \" [ngValue]=\"item\">\r\n {{isObject(item) ? item[optionLabel] : item}}\r\n </option>\r\n </select>\r\n\r\n <button *ngIf=\"isClear\" class=\"btn btn-outline-secondary btn-clear\" type=\"button\" id=\"btn-clear\"\r\n (click)=\"clearValue()\" [disabled]=\"disabled\">\r\n <span class=\"fa fa-times\"></span>\r\n </button>\r\n</div>" }]
|
|
82
90
|
}], propDecorators: { id: [{
|
|
83
91
|
type: Input
|
|
84
92
|
}], options: [{
|
|
@@ -99,8 +107,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.3", ngImpor
|
|
|
99
107
|
type: Input
|
|
100
108
|
}], multiple: [{
|
|
101
109
|
type: Input
|
|
110
|
+
}], size: [{
|
|
111
|
+
type: Input
|
|
102
112
|
}], isClear: [{
|
|
103
113
|
type: Input
|
|
114
|
+
}], disabled: [{
|
|
115
|
+
type: Input
|
|
104
116
|
}] } });
|
|
105
117
|
|
|
106
118
|
/*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"yoozsoft-yoozsoft-ng-select.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/select/src/ys-select/ys-select.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/select/src/ys-select/ys-select.component.html","../../../../projects/yoozsoft/yoozsoft-ng/select/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/select/yoozsoft-yoozsoft-ng-select.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"yoozsoft-yoozsoft-ng-select.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/select/src/ys-select/ys-select.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/select/src/ys-select/ys-select.component.html","../../../../projects/yoozsoft/yoozsoft-ng/select/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/select/yoozsoft-yoozsoft-ng-select.ts"],"sourcesContent":["import { NgFor, NgIf } from '@angular/common';\r\nimport { Component, forwardRef, Input } from '@angular/core';\r\nimport { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\n@Component({\r\n selector: 'ys-select',\r\n imports: [NgIf, NgFor, FormsModule],\r\n templateUrl: './ys-select.component.html',\r\n styleUrl: './ys-select.component.scss',\r\n providers: [\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => YsSelectComponent),\r\n multi: true\r\n }\r\n ]\r\n})\r\nexport class YsSelectComponent implements ControlValueAccessor {\r\n\r\n /**ُSelect element id */\r\n @Input() id: string = 'ys-select';\r\n @Input() options: any[] = [];\r\n /**Name of field to display in option title */\r\n @Input() optionLabel: string = 'label';\r\n @Input() placeholder?: string;\r\n @Input() styleClass?: string;\r\n @Input() invalid?: boolean = false;\r\n @Input() invalidStyleClass?: string = 'is-invalid';\r\n @Input() valid?: boolean = false;\r\n @Input() validStyleClass?: string = 'is-valid';\r\n /**Support multiple attribute */\r\n @Input() multiple?: boolean = false;\r\n /**Size of multiple attribute */\r\n @Input() size?: number;\r\n /**Display clear button */\r\n @Input() isClear?: boolean = false;\r\n\r\n @Input() disabled: boolean = false;\r\n onChange: any = () => { }\r\n onTouched: any = () => { }\r\n\r\n value?: any;\r\n\r\n writeValue(obj: any): void {\r\n if (!this.multiple && this.placeholder && !obj) {\r\n this.value = null;\r\n this.onChange(this.value);\r\n return;\r\n }\r\n\r\n if (this.multiple && !obj) {\r\n this.multiple ? this.value = [] : this.value = null;\r\n this.onChange(this.value);\r\n return;\r\n }\r\n\r\n if (!this.multiple && obj && Array.isArray(obj)) {\r\n if (obj.length) {\r\n this.value = obj[0];\r\n }\r\n else {\r\n this.value = null;\r\n }\r\n this.onChange(this.value);\r\n return;\r\n }\r\n\r\n this.value = obj;\r\n }\r\n registerOnChange(fn: any): void {\r\n this.onChange = fn;\r\n }\r\n registerOnTouched(fn: any): void {\r\n this.onTouched = fn;\r\n }\r\n setDisabledState?(isDisabled: boolean): void {\r\n this.disabled = isDisabled;\r\n }\r\n\r\n onModelChange(option: any) {\r\n this.onChange(option);\r\n this.onTouched(option);\r\n }\r\n\r\n clearValue() {\r\n this.multiple ? this.value = [] : this.value = null;\r\n this.onModelChange(this.value);\r\n }\r\n\r\n isObject(item: any) {\r\n return typeof item == 'object';\r\n }\r\n\r\n}\r\n","<div class=\"input-group ys-select\">\r\n\r\n <select *ngIf=\"!multiple\" [id]=\"id\"\r\n class=\"form-select {{styleClass}} {{invalid && invalidStyleClass}} {{valid && validStyleClass}}\"\r\n aria-label=\"Select option\" [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange($event)\" [disabled]=\"disabled\">\r\n <option *ngIf=\"placeholder\" selected disabled [ngValue]=\"null\" class=\"d-none\"> {{placeholder}}\r\n </option>\r\n <option *ngFor=\"let item of options; let i = index;\" [selected]=\" i === 0 && !placeholder \" [ngValue]=\"item\">\r\n {{isObject(item) ? item[optionLabel] : item}}\r\n </option>\r\n </select>\r\n\r\n <select *ngIf=\"multiple\" [id]=\"id\"\r\n class=\"form-select {{styleClass}} {{invalid && invalidStyleClass}} {{valid && validStyleClass}}\"\r\n aria-label=\"Select option\" [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange($event)\" [disabled]=\"disabled\"\r\n [multiple]=\"multiple\" [size]=\"size\">\r\n <option *ngIf=\"placeholder\" selected disabled [ngValue]=\"null\"> {{placeholder}}\r\n </option>\r\n <option *ngFor=\"let item of options; let i = index;\" [selected]=\" i === 0 && !placeholder \" [ngValue]=\"item\">\r\n {{isObject(item) ? item[optionLabel] : item}}\r\n </option>\r\n </select>\r\n\r\n <button *ngIf=\"isClear\" class=\"btn btn-outline-secondary btn-clear\" type=\"button\" id=\"btn-clear\"\r\n (click)=\"clearValue()\" [disabled]=\"disabled\">\r\n <span class=\"fa fa-times\"></span>\r\n </button>\r\n</div>","/*\r\n * Public API Surface of ys-select\r\n */\r\n\r\nexport * from './src/ys-select/ys-select.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -9,14 +9,37 @@ class SidebarService {
|
|
|
9
9
|
constructor() { }
|
|
10
10
|
_isSidebarToggled$ = new BehaviorSubject(true);
|
|
11
11
|
_isSidebar$ = new BehaviorSubject(false);
|
|
12
|
+
/**
|
|
13
|
+
* Sidebar toggled state. Default value is true.
|
|
14
|
+
*/
|
|
12
15
|
get isSidebarToggled$() { return this._isSidebarToggled$.asObservable(); }
|
|
16
|
+
/**
|
|
17
|
+
* Sidebar display state. Default value is false.
|
|
18
|
+
*/
|
|
13
19
|
get isSidebar$() { return this._isSidebar$.asObservable(); }
|
|
20
|
+
/**
|
|
21
|
+
* Change sidebar toggle state.
|
|
22
|
+
*/
|
|
14
23
|
toggleSidebar() {
|
|
15
24
|
this._isSidebarToggled$.next(!this._isSidebarToggled$.value);
|
|
16
25
|
}
|
|
26
|
+
/**
|
|
27
|
+
* Set sidebar toggle state.
|
|
28
|
+
* @param isToggled
|
|
29
|
+
*/
|
|
30
|
+
setIsSidebarToggled(isToggled) {
|
|
31
|
+
this._isSidebarToggled$.next(isToggled);
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Set sidebar toggle state.
|
|
35
|
+
* @param isSidebar
|
|
36
|
+
*/
|
|
17
37
|
setIsSidebar(isSidebar) {
|
|
18
38
|
this._isSidebar$.next(isSidebar);
|
|
19
39
|
}
|
|
40
|
+
/**
|
|
41
|
+
* Return sidebar toggle state.
|
|
42
|
+
*/
|
|
20
43
|
get sidebarState() {
|
|
21
44
|
return this._isSidebarToggled$.getValue();
|
|
22
45
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"yoozsoft-yoozsoft-ng-sidebar.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/sidebar/src/services/sidebar.service.ts","../../../../projects/yoozsoft/yoozsoft-ng/sidebar/src/ys-sidebar/ys-sidebar.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/sidebar/src/ys-sidebar/ys-sidebar.component.html","../../../../projects/yoozsoft/yoozsoft-ng/sidebar/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/sidebar/yoozsoft-yoozsoft-ng-sidebar.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\r\nimport { BehaviorSubject } from 'rxjs';\r\n\r\n@Injectable({\r\n providedIn: 'root'\r\n})\r\nexport class SidebarService {\r\n\r\n constructor() { }\r\n\r\n private _isSidebarToggled$ = new BehaviorSubject<boolean>(true);\r\n\r\n private _isSidebar$ = new BehaviorSubject<boolean>(false);\r\n\r\n get isSidebarToggled$() { return this._isSidebarToggled$.asObservable(); }\r\n\r\n get isSidebar$() { return this._isSidebar$.asObservable(); }\r\n\r\n toggleSidebar() {\r\n this._isSidebarToggled$.next(!this._isSidebarToggled$.value);\r\n }\r\n\r\n setIsSidebar(isSidebar: boolean) {\r\n this._isSidebar$.next(isSidebar);\r\n }\r\n\r\n get sidebarState() {\r\n return this._isSidebarToggled$.getValue()\r\n }\r\n\r\n}\r\n","import { NgClass, NgFor, NgIf } from '@angular/common';\r\nimport { Component, Input, OnDestroy } from '@angular/core';\r\nimport { NavigationEnd, Router, RouterLink, RouterLinkActive } from '@angular/router';\r\nimport { Subscription } from 'rxjs';\r\nimport { SidebarItem, SidebarItemActive, UserProfile } from '../models';\r\n\r\n@Component({\r\n selector: 'ys-sidebar',\r\n imports: [NgIf, NgFor, NgClass, RouterLink, RouterLinkActive],\r\n templateUrl: './ys-sidebar.component.html',\r\n styleUrl: './ys-sidebar.component.scss'\r\n})\r\nexport class YsSidebarComponent implements OnDestroy {\r\n\r\n private subscription: Subscription;\r\n private currentItem?: SidebarItemActive;\r\n private currentItemState: boolean[] = [];\r\n\r\n private _items: SidebarItemActive[] = [];\r\n @Input()\r\n get items(): SidebarItemActive[] { return this._items };\r\n set items(value: SidebarItem[]) { this._items = value; }\r\n\r\n @Input() profile: UserProfile | null = null;\r\n @Input() styleClass?: string;\r\n @Input() itemsStyleClass?: string;\r\n\r\n constructor(private router: Router) {\r\n this.subscription = router.events.subscribe(e => {\r\n if (e instanceof NavigationEnd) {\r\n this.currentItem = undefined;\r\n this.currentItemState = [];\r\n }\r\n })\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this.subscription.unsubscribe();\r\n }\r\n\r\n get fullName(): string { return `${this.profile?.firstName} ${this.profile?.lastName}`; }\r\n\r\n openItem(item: SidebarItemActive): void {\r\n if (item.isOpen) {\r\n item.isOpen = !item.isOpen;\r\n return;\r\n }\r\n\r\n this.items.forEach(x => x.isOpen = false);\r\n item.isOpen = !item.isOpen;\r\n }\r\n\r\n isDropdown(item: SidebarItem): boolean {\r\n return (item.items?.length ?? 0) > 0;\r\n }\r\n\r\n onRouterLinkActive(isActive: boolean, item: SidebarItemActive) {\r\n this.currentItemState.push(isActive);\r\n\r\n if (!isActive && this.currentItem == item) {\r\n if (this.currentItemState.length == 2 && this.currentItemState[0] && !this.currentItemState[1]) {\r\n return;\r\n }\r\n }\r\n\r\n this.currentItem = item;\r\n item.isActive = isActive;\r\n // if (isActive) {\r\n // this.items.forEach(x => x.isOpen = false);\r\n // item.isOpen = true;\r\n // }\r\n }\r\n\r\n}\r\n","<aside class=\"sidebar card overflow-auto shadow-sm transition-ease\" [ngClass]=\"styleClass\">\r\n <div *ngIf=\"profile\">\r\n <div *ngIf=\"profile.image || fullName || profile.role\"\r\n class=\"sidebar-profile d-flex flex-column justify-content-center pt-3\">\r\n <div *ngIf=\"profile.image\" class=\"image-wrapper\" [ngClass]=\"{'mb-3': fullName || profile.role}\">\r\n <div class=\"user-image rounded-circle m-auto transition-ease\">\r\n <img src=\"{{profile.image.src}}\" class=\"img-fluid\" alt=\"{{profile.image.src}}\">\r\n </div>\r\n </div>\r\n <div *ngIf=\"fullName || profile.role\" class=\"profile-details d-flex flex-column text-center transition-ease\">\r\n <strong *ngIf=\"fullName\" class=\"text-uppercase name\">{{fullName || ''}}</strong>\r\n <small *ngIf=\"profile.role\" class=\"text-uppercase role\">{{profile.role}}</small>\r\n </div>\r\n </div>\r\n\r\n <hr />\r\n </div>\r\n\r\n <div class=\"sidebar-menu\" [ngClass]=\"{'pt-2': !profile}\">\r\n <ul class=\"sidebar-items nav nav-pills flex-column mx-2\" [ngClass]=\"itemsStyleClass\">\r\n <ng-container *ngFor=\"let item of items\">\r\n\r\n <hr *ngIf=\"item.isDivider\" class=\"sidebar-divider\" />\r\n\r\n <ng-container *ngIf=\"!item.isDivider\">\r\n <li *ngIf=\"!isDropdown(item)\" class=\"nav-item d-block\">\r\n <a class=\"nav-link d-flex align-items-center\" [routerLink]=\"item.routerLink\"\r\n [routerLinkActive]=\"['active']\" role=\"button\"\r\n (click)=\"openItem(item); item.onClick && item.onClick($event)\">\r\n <i *ngIf=\"item.iconClass\" [ngClass]=\"item.iconClass\"></i>\r\n <span class=\"link-label ms-3 me-auto\">{{item.label}}</span>\r\n <span *ngIf=\"item.badgeLabel\" class=\"badge bg-info\"\r\n [ngClass]=\"item.badgeStyleClass\">{{item.badgeLabel}}</span>\r\n </a>\r\n </li>\r\n <li *ngIf=\"isDropdown(item)\" class=\"nav-item d-block dropend\">\r\n <a class=\"nav-link d-flex align-items-center dropdown-toggle\"\r\n [ngClass]=\"{'active': item.isActive , 'toggled': item.isOpen}\" data-bs-toggle=\"dropend\"\r\n role=\"button\" aria-haspopup=\"true\" aria-expanded=\"false\"\r\n (click)=\"openItem(item); item.onClick && item.onClick($event)\">\r\n <i *ngIf=\"item.iconClass\" [ngClass]=\"item.iconClass\"></i>\r\n <span class=\"link-label ms-3 me-auto\">{{item.label}}</span>\r\n <span *ngIf=\"item.badgeLabel\" class=\"badge bg-info me-1\"\r\n [ngClass]=\"item.badgeStyleClass\">{{item.badgeLabel}}</span>\r\n </a>\r\n\r\n <ul class=\"nav-sub-items nav nav-pills flex-column rounded shadow-sm mb-2 mx-2\"\r\n [ngClass]=\"{'show': item.isOpen}\">\r\n <ng-container *ngFor=\"let subItem of item.items;\">\r\n\r\n <hr *ngIf=\"subItem.isDivider\" class=\"sidebar-divider my-1\" />\r\n\r\n <li *ngIf=\"!subItem.isDivider\" class=\"nav-item d-block\">\r\n <a class=\"nav-link d-flex align-items-center\" [routerLink]=\"subItem.routerLink\"\r\n role=\"button\" [routerLinkActive]=\"['active']\"\r\n (isActiveChange)=\"this.onRouterLinkActive($event, item)\"\r\n (click)=\"subItem.onClick && subItem.onClick($event)\">\r\n <i *ngIf=\"subItem.iconClass\" [ngClass]=\"subItem.iconClass\"></i>\r\n <span class=\"link-label ms-3 me-auto\">{{subItem.label}}</span>\r\n <span *ngIf=\"subItem.badgeLabel\" class=\"badge bg-info\"\r\n [ngClass]=\"subItem.badgeStyleClass\">{{subItem.badgeLabel}}</span>\r\n </a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </li>\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n </div>\r\n</aside>","/*\r\n * Public API Surface of ys-sidebar\r\n */\r\n\r\nexport * from './src/models';\r\nexport * from './src/services';\r\nexport * from './src/ys-sidebar/ys-sidebar.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"yoozsoft-yoozsoft-ng-sidebar.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/sidebar/src/services/sidebar.service.ts","../../../../projects/yoozsoft/yoozsoft-ng/sidebar/src/ys-sidebar/ys-sidebar.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/sidebar/src/ys-sidebar/ys-sidebar.component.html","../../../../projects/yoozsoft/yoozsoft-ng/sidebar/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/sidebar/yoozsoft-yoozsoft-ng-sidebar.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\r\nimport { BehaviorSubject } from 'rxjs';\r\n\r\n@Injectable({\r\n providedIn: 'root'\r\n})\r\nexport class SidebarService {\r\n\r\n constructor() { }\r\n\r\n private _isSidebarToggled$ = new BehaviorSubject<boolean>(true);\r\n\r\n private _isSidebar$ = new BehaviorSubject<boolean>(false);\r\n\r\n /**\r\n * Sidebar toggled state. Default value is true.\r\n */\r\n get isSidebarToggled$() { return this._isSidebarToggled$.asObservable(); }\r\n\r\n /**\r\n * Sidebar display state. Default value is false.\r\n */\r\n get isSidebar$() { return this._isSidebar$.asObservable(); }\r\n\r\n /**\r\n * Change sidebar toggle state.\r\n */\r\n toggleSidebar() {\r\n this._isSidebarToggled$.next(!this._isSidebarToggled$.value);\r\n }\r\n\r\n /**\r\n * Set sidebar toggle state.\r\n * @param isToggled \r\n */\r\n setIsSidebarToggled(isToggled: boolean) {\r\n this._isSidebarToggled$.next(isToggled);\r\n }\r\n\r\n /**\r\n * Set sidebar toggle state.\r\n * @param isSidebar \r\n */\r\n setIsSidebar(isSidebar: boolean) {\r\n this._isSidebar$.next(isSidebar);\r\n }\r\n\r\n /**\r\n * Return sidebar toggle state.\r\n */\r\n get sidebarState() {\r\n return this._isSidebarToggled$.getValue()\r\n }\r\n\r\n}\r\n","import { NgClass, NgFor, NgIf } from '@angular/common';\r\nimport { Component, Input, OnDestroy } from '@angular/core';\r\nimport { NavigationEnd, Router, RouterLink, RouterLinkActive } from '@angular/router';\r\nimport { Subscription } from 'rxjs';\r\nimport { SidebarItem, SidebarItemActive, UserProfile } from '../models';\r\n\r\n@Component({\r\n selector: 'ys-sidebar',\r\n imports: [NgIf, NgFor, NgClass, RouterLink, RouterLinkActive],\r\n templateUrl: './ys-sidebar.component.html',\r\n styleUrl: './ys-sidebar.component.scss'\r\n})\r\nexport class YsSidebarComponent implements OnDestroy {\r\n\r\n private subscription: Subscription;\r\n private currentItem?: SidebarItemActive;\r\n private currentItemState: boolean[] = [];\r\n\r\n private _items: SidebarItemActive[] = [];\r\n @Input()\r\n get items(): SidebarItemActive[] { return this._items };\r\n set items(value: SidebarItem[]) { this._items = value; }\r\n\r\n @Input() profile: UserProfile | null = null;\r\n @Input() styleClass?: string;\r\n @Input() itemsStyleClass?: string;\r\n\r\n constructor(private router: Router) {\r\n this.subscription = router.events.subscribe(e => {\r\n if (e instanceof NavigationEnd) {\r\n this.currentItem = undefined;\r\n this.currentItemState = [];\r\n }\r\n })\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this.subscription.unsubscribe();\r\n }\r\n\r\n get fullName(): string { return `${this.profile?.firstName} ${this.profile?.lastName}`; }\r\n\r\n openItem(item: SidebarItemActive): void {\r\n if (item.isOpen) {\r\n item.isOpen = !item.isOpen;\r\n return;\r\n }\r\n\r\n this.items.forEach(x => x.isOpen = false);\r\n item.isOpen = !item.isOpen;\r\n }\r\n\r\n isDropdown(item: SidebarItem): boolean {\r\n return (item.items?.length ?? 0) > 0;\r\n }\r\n\r\n onRouterLinkActive(isActive: boolean, item: SidebarItemActive) {\r\n this.currentItemState.push(isActive);\r\n\r\n if (!isActive && this.currentItem == item) {\r\n if (this.currentItemState.length == 2 && this.currentItemState[0] && !this.currentItemState[1]) {\r\n return;\r\n }\r\n }\r\n\r\n this.currentItem = item;\r\n item.isActive = isActive;\r\n // if (isActive) {\r\n // this.items.forEach(x => x.isOpen = false);\r\n // item.isOpen = true;\r\n // }\r\n }\r\n\r\n}\r\n","<aside class=\"sidebar card overflow-auto shadow-sm transition-ease\" [ngClass]=\"styleClass\">\r\n <div *ngIf=\"profile\">\r\n <div *ngIf=\"profile.image || fullName || profile.role\"\r\n class=\"sidebar-profile d-flex flex-column justify-content-center pt-3\">\r\n <div *ngIf=\"profile.image\" class=\"image-wrapper\" [ngClass]=\"{'mb-3': fullName || profile.role}\">\r\n <div class=\"user-image rounded-circle m-auto transition-ease\">\r\n <img src=\"{{profile.image.src}}\" class=\"img-fluid\" alt=\"{{profile.image.src}}\">\r\n </div>\r\n </div>\r\n <div *ngIf=\"fullName || profile.role\" class=\"profile-details d-flex flex-column text-center transition-ease\">\r\n <strong *ngIf=\"fullName\" class=\"text-uppercase name\">{{fullName || ''}}</strong>\r\n <small *ngIf=\"profile.role\" class=\"text-uppercase role\">{{profile.role}}</small>\r\n </div>\r\n </div>\r\n\r\n <hr />\r\n </div>\r\n\r\n <div class=\"sidebar-menu\" [ngClass]=\"{'pt-2': !profile}\">\r\n <ul class=\"sidebar-items nav nav-pills flex-column mx-2\" [ngClass]=\"itemsStyleClass\">\r\n <ng-container *ngFor=\"let item of items\">\r\n\r\n <hr *ngIf=\"item.isDivider\" class=\"sidebar-divider\" />\r\n\r\n <ng-container *ngIf=\"!item.isDivider\">\r\n <li *ngIf=\"!isDropdown(item)\" class=\"nav-item d-block\">\r\n <a class=\"nav-link d-flex align-items-center\" [routerLink]=\"item.routerLink\"\r\n [routerLinkActive]=\"['active']\" role=\"button\"\r\n (click)=\"openItem(item); item.onClick && item.onClick($event)\">\r\n <i *ngIf=\"item.iconClass\" [ngClass]=\"item.iconClass\"></i>\r\n <span class=\"link-label ms-3 me-auto\">{{item.label}}</span>\r\n <span *ngIf=\"item.badgeLabel\" class=\"badge bg-info\"\r\n [ngClass]=\"item.badgeStyleClass\">{{item.badgeLabel}}</span>\r\n </a>\r\n </li>\r\n <li *ngIf=\"isDropdown(item)\" class=\"nav-item d-block dropend\">\r\n <a class=\"nav-link d-flex align-items-center dropdown-toggle\"\r\n [ngClass]=\"{'active': item.isActive , 'toggled': item.isOpen}\" data-bs-toggle=\"dropend\"\r\n role=\"button\" aria-haspopup=\"true\" aria-expanded=\"false\"\r\n (click)=\"openItem(item); item.onClick && item.onClick($event)\">\r\n <i *ngIf=\"item.iconClass\" [ngClass]=\"item.iconClass\"></i>\r\n <span class=\"link-label ms-3 me-auto\">{{item.label}}</span>\r\n <span *ngIf=\"item.badgeLabel\" class=\"badge bg-info me-1\"\r\n [ngClass]=\"item.badgeStyleClass\">{{item.badgeLabel}}</span>\r\n </a>\r\n\r\n <ul class=\"nav-sub-items nav nav-pills flex-column rounded shadow-sm mb-2 mx-2\"\r\n [ngClass]=\"{'show': item.isOpen}\">\r\n <ng-container *ngFor=\"let subItem of item.items;\">\r\n\r\n <hr *ngIf=\"subItem.isDivider\" class=\"sidebar-divider my-1\" />\r\n\r\n <li *ngIf=\"!subItem.isDivider\" class=\"nav-item d-block\">\r\n <a class=\"nav-link d-flex align-items-center\" [routerLink]=\"subItem.routerLink\"\r\n role=\"button\" [routerLinkActive]=\"['active']\"\r\n (isActiveChange)=\"this.onRouterLinkActive($event, item)\"\r\n (click)=\"subItem.onClick && subItem.onClick($event)\">\r\n <i *ngIf=\"subItem.iconClass\" [ngClass]=\"subItem.iconClass\"></i>\r\n <span class=\"link-label ms-3 me-auto\">{{subItem.label}}</span>\r\n <span *ngIf=\"subItem.badgeLabel\" class=\"badge bg-info\"\r\n [ngClass]=\"subItem.badgeStyleClass\">{{subItem.badgeLabel}}</span>\r\n </a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </li>\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n </div>\r\n</aside>","/*\r\n * Public API Surface of ys-sidebar\r\n */\r\n\r\nexport * from './src/models';\r\nexport * from './src/services';\r\nexport * from './src/ys-sidebar/ys-sidebar.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -4,23 +4,39 @@ import * as i0 from "@angular/core";
|
|
|
4
4
|
export declare class YsFileUploadComponent implements ControlValueAccessor {
|
|
5
5
|
private fileList?;
|
|
6
6
|
files: File[];
|
|
7
|
-
selectedFile
|
|
7
|
+
selectedFile: File | null;
|
|
8
|
+
styleClass?: string;
|
|
9
|
+
/**
|
|
10
|
+
* Allowing upload multiple files
|
|
11
|
+
* Default is false
|
|
12
|
+
*/
|
|
8
13
|
multiple: boolean;
|
|
14
|
+
/**
|
|
15
|
+
* Acceptable type of files
|
|
16
|
+
* Default is all file type
|
|
17
|
+
*/
|
|
9
18
|
accept: string;
|
|
10
|
-
/**
|
|
19
|
+
/**
|
|
20
|
+
* Upload button label
|
|
21
|
+
* Default is Choose File
|
|
22
|
+
*/
|
|
11
23
|
uploadLabel?: string;
|
|
12
24
|
/**Style class of upload button */
|
|
13
25
|
uploadStyleClass?: string;
|
|
14
26
|
/**Icon class of upload button */
|
|
15
27
|
uploadIconClass: string;
|
|
28
|
+
/**Display choosed file remove button */
|
|
29
|
+
isRemove: boolean;
|
|
16
30
|
/**Icon of remove item button */
|
|
17
31
|
removeIconClass: string;
|
|
18
|
-
/**
|
|
32
|
+
/**
|
|
33
|
+
* Files list display direction
|
|
34
|
+
* Default is vertical (false)
|
|
35
|
+
*/
|
|
19
36
|
isHorizontal: boolean;
|
|
20
|
-
/**
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
message: string;
|
|
37
|
+
/**Message displayed before choosing file */
|
|
38
|
+
noFileMessage: string;
|
|
39
|
+
progressStyleClass?: string;
|
|
24
40
|
/**Value of progress element */
|
|
25
41
|
progressValue?: number;
|
|
26
42
|
/**Max value of progress element */
|
|
@@ -28,9 +44,9 @@ export declare class YsFileUploadComponent implements ControlValueAccessor {
|
|
|
28
44
|
/**Display cancel upload button */
|
|
29
45
|
isCancel: boolean;
|
|
30
46
|
/**Event to get choosed files */
|
|
31
|
-
choosed: EventEmitter<File[]>;
|
|
32
|
-
/**Event of selected file */
|
|
33
|
-
|
|
47
|
+
choosed: EventEmitter<File | File[]>;
|
|
48
|
+
/**Event of selected file in the list of choosed file*/
|
|
49
|
+
select: EventEmitter<File | null>;
|
|
34
50
|
/**Event of cancel upload button */
|
|
35
51
|
cancel: EventEmitter<void>;
|
|
36
52
|
/**Disable elements */
|
|
@@ -42,10 +58,10 @@ export declare class YsFileUploadComponent implements ControlValueAccessor {
|
|
|
42
58
|
registerOnChange(fn: any): void;
|
|
43
59
|
registerOnTouched(fn: any): void;
|
|
44
60
|
setDisabledState?(isDisabled: boolean): void;
|
|
45
|
-
|
|
61
|
+
onChangeFiles(event: any): void;
|
|
46
62
|
removeFile(file: File): void;
|
|
47
63
|
onSelectFile(file: File): void;
|
|
48
64
|
cancelUpload(): void;
|
|
49
65
|
static ɵfac: i0.ɵɵFactoryDeclaration<YsFileUploadComponent, never>;
|
|
50
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<YsFileUploadComponent, "ys-file-upload", never, { "multiple": { "alias": "multiple"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "uploadLabel": { "alias": "uploadLabel"; "required": false; }; "uploadStyleClass": { "alias": "uploadStyleClass"; "required": false; }; "uploadIconClass": { "alias": "uploadIconClass"; "required": false; }; "removeIconClass": { "alias": "removeIconClass"; "required": false; }; "isHorizontal": { "alias": "isHorizontal"; "required": false; }; "
|
|
66
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<YsFileUploadComponent, "ys-file-upload", never, { "styleClass": { "alias": "styleClass"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "uploadLabel": { "alias": "uploadLabel"; "required": false; }; "uploadStyleClass": { "alias": "uploadStyleClass"; "required": false; }; "uploadIconClass": { "alias": "uploadIconClass"; "required": false; }; "isRemove": { "alias": "isRemove"; "required": false; }; "removeIconClass": { "alias": "removeIconClass"; "required": false; }; "isHorizontal": { "alias": "isHorizontal"; "required": false; }; "noFileMessage": { "alias": "noFileMessage"; "required": false; }; "progressStyleClass": { "alias": "progressStyleClass"; "required": false; }; "progressValue": { "alias": "progressValue"; "required": false; }; "progressValueMax": { "alias": "progressValueMax"; "required": false; }; "isCancel": { "alias": "isCancel"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "choosed": "choosed"; "select": "select"; "cancel": "cancel"; }, never, never, true, never>;
|
|
51
67
|
}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
|
+
import { UrlTree } from "@angular/router";
|
|
1
2
|
export interface NavbarItem {
|
|
2
3
|
id?: number;
|
|
3
4
|
label?: string;
|
|
4
5
|
iconClass?: string;
|
|
5
6
|
onClick?: (event?: any) => void;
|
|
6
7
|
items?: NavbarItem[];
|
|
7
|
-
routerLink?: any[];
|
|
8
|
+
routerLink?: string | any[] | UrlTree | null | undefined;
|
|
8
9
|
tooltipLabel?: string;
|
|
9
10
|
isDivider?: boolean;
|
|
10
11
|
data?: any;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yoozsoft/yoozsoft-ng",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.3",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/common": "^19.0.0",
|
|
6
6
|
"@angular/core": "^19.0.0"
|
|
@@ -39,17 +39,13 @@
|
|
|
39
39
|
"types": "./datepicker/index.d.ts",
|
|
40
40
|
"default": "./fesm2022/yoozsoft-yoozsoft-ng-datepicker.mjs"
|
|
41
41
|
},
|
|
42
|
-
"./file-upload": {
|
|
43
|
-
"types": "./file-upload/index.d.ts",
|
|
44
|
-
"default": "./fesm2022/yoozsoft-yoozsoft-ng-file-upload.mjs"
|
|
45
|
-
},
|
|
46
42
|
"./directives": {
|
|
47
43
|
"types": "./directives/index.d.ts",
|
|
48
44
|
"default": "./fesm2022/yoozsoft-yoozsoft-ng-directives.mjs"
|
|
49
45
|
},
|
|
50
|
-
"./
|
|
51
|
-
"types": "./
|
|
52
|
-
"default": "./fesm2022/yoozsoft-yoozsoft-ng-
|
|
46
|
+
"./file-upload": {
|
|
47
|
+
"types": "./file-upload/index.d.ts",
|
|
48
|
+
"default": "./fesm2022/yoozsoft-yoozsoft-ng-file-upload.mjs"
|
|
53
49
|
},
|
|
54
50
|
"./footer": {
|
|
55
51
|
"types": "./footer/index.d.ts",
|
|
@@ -59,6 +55,10 @@
|
|
|
59
55
|
"types": "./navbar/index.d.ts",
|
|
60
56
|
"default": "./fesm2022/yoozsoft-yoozsoft-ng-navbar.mjs"
|
|
61
57
|
},
|
|
58
|
+
"./loading": {
|
|
59
|
+
"types": "./loading/index.d.ts",
|
|
60
|
+
"default": "./fesm2022/yoozsoft-yoozsoft-ng-loading.mjs"
|
|
61
|
+
},
|
|
62
62
|
"./overlay": {
|
|
63
63
|
"types": "./overlay/index.d.ts",
|
|
64
64
|
"default": "./fesm2022/yoozsoft-yoozsoft-ng-overlay.mjs"
|
|
@@ -12,10 +12,13 @@ export declare class YsSelectComponent implements ControlValueAccessor {
|
|
|
12
12
|
invalidStyleClass?: string;
|
|
13
13
|
valid?: boolean;
|
|
14
14
|
validStyleClass?: string;
|
|
15
|
+
/**Support multiple attribute */
|
|
15
16
|
multiple?: boolean;
|
|
17
|
+
/**Size of multiple attribute */
|
|
18
|
+
size?: number;
|
|
16
19
|
/**Display clear button */
|
|
17
20
|
isClear?: boolean;
|
|
18
|
-
|
|
21
|
+
disabled: boolean;
|
|
19
22
|
onChange: any;
|
|
20
23
|
onTouched: any;
|
|
21
24
|
value?: any;
|
|
@@ -27,5 +30,5 @@ export declare class YsSelectComponent implements ControlValueAccessor {
|
|
|
27
30
|
clearValue(): void;
|
|
28
31
|
isObject(item: any): boolean;
|
|
29
32
|
static ɵfac: i0.ɵɵFactoryDeclaration<YsSelectComponent, never>;
|
|
30
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<YsSelectComponent, "ys-select", never, { "id": { "alias": "id"; "required": false; }; "options": { "alias": "options"; "required": false; }; "optionLabel": { "alias": "optionLabel"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "invalidStyleClass": { "alias": "invalidStyleClass"; "required": false; }; "valid": { "alias": "valid"; "required": false; }; "validStyleClass": { "alias": "validStyleClass"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "isClear": { "alias": "isClear"; "required": false; }; }, {}, never, never, true, never>;
|
|
33
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<YsSelectComponent, "ys-select", never, { "id": { "alias": "id"; "required": false; }; "options": { "alias": "options"; "required": false; }; "optionLabel": { "alias": "optionLabel"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "invalidStyleClass": { "alias": "invalidStyleClass"; "required": false; }; "valid": { "alias": "valid"; "required": false; }; "validStyleClass": { "alias": "validStyleClass"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "size": { "alias": "size"; "required": false; }; "isClear": { "alias": "isClear"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
|
|
31
34
|
}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
import { UrlTree } from "@angular/router";
|
|
1
2
|
export interface SidebarItem {
|
|
2
3
|
id?: number;
|
|
3
4
|
label?: string;
|
|
4
|
-
routerLink?: string | any[];
|
|
5
|
+
routerLink?: string | any[] | UrlTree | null | undefined;
|
|
5
6
|
iconClass?: string;
|
|
6
7
|
badgeLabel?: string;
|
|
7
8
|
badgeStyleClass?: string;
|
|
@@ -3,10 +3,31 @@ export declare class SidebarService {
|
|
|
3
3
|
constructor();
|
|
4
4
|
private _isSidebarToggled$;
|
|
5
5
|
private _isSidebar$;
|
|
6
|
+
/**
|
|
7
|
+
* Sidebar toggled state. Default value is true.
|
|
8
|
+
*/
|
|
6
9
|
get isSidebarToggled$(): import("rxjs").Observable<boolean>;
|
|
10
|
+
/**
|
|
11
|
+
* Sidebar display state. Default value is false.
|
|
12
|
+
*/
|
|
7
13
|
get isSidebar$(): import("rxjs").Observable<boolean>;
|
|
14
|
+
/**
|
|
15
|
+
* Change sidebar toggle state.
|
|
16
|
+
*/
|
|
8
17
|
toggleSidebar(): void;
|
|
18
|
+
/**
|
|
19
|
+
* Set sidebar toggle state.
|
|
20
|
+
* @param isToggled
|
|
21
|
+
*/
|
|
22
|
+
setIsSidebarToggled(isToggled: boolean): void;
|
|
23
|
+
/**
|
|
24
|
+
* Set sidebar toggle state.
|
|
25
|
+
* @param isSidebar
|
|
26
|
+
*/
|
|
9
27
|
setIsSidebar(isSidebar: boolean): void;
|
|
28
|
+
/**
|
|
29
|
+
* Return sidebar toggle state.
|
|
30
|
+
*/
|
|
10
31
|
get sidebarState(): boolean;
|
|
11
32
|
static ɵfac: i0.ɵɵFactoryDeclaration<SidebarService, never>;
|
|
12
33
|
static ɵprov: i0.ɵɵInjectableDeclaration<SidebarService>;
|