@sd-angular/core 19.0.0-beta.57 → 19.0.0-beta.59
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/components/avatar/src/avatar.component.d.ts +14 -10
- package/components/upload-file/src/configurations/upload-file.configuration.d.ts +1 -1
- package/components/upload-file/src/services/upload-file.service.d.ts +0 -1
- package/fesm2022/sd-angular-core-components-avatar.mjs +46 -31
- package/fesm2022/sd-angular-core-components-avatar.mjs.map +1 -1
- package/fesm2022/sd-angular-core-components-upload-file.mjs +34 -42
- package/fesm2022/sd-angular-core-components-upload-file.mjs.map +1 -1
- package/fesm2022/sd-angular-core-modules-layout.mjs +1 -1
- package/fesm2022/sd-angular-core-modules-layout.mjs.map +1 -1
- package/package.json +44 -44
- package/sd-angular-core-19.0.0-beta.59.tgz +0 -0
- package/sd-angular-core-19.0.0-beta.57.tgz +0 -0
|
@@ -1,15 +1,19 @@
|
|
|
1
|
-
import { OnInit } from '@angular/core';
|
|
2
1
|
import * as i0 from "@angular/core";
|
|
3
|
-
export declare class SdAvatar
|
|
2
|
+
export declare class SdAvatar {
|
|
4
3
|
#private;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
4
|
+
/**
|
|
5
|
+
* The source string to be used for the avatar.
|
|
6
|
+
* - If it matches a URL pattern, an image is displayed.
|
|
7
|
+
* - If it is a string representing a name, initials and a colored background are generated.
|
|
8
|
+
* - If undefined, it falls back to a neutral ? initial.
|
|
9
|
+
*/
|
|
10
|
+
readonly src: import("@angular/core").InputSignal<string | null | undefined>;
|
|
11
|
+
readonly size: import("@angular/core").InputSignal<number>;
|
|
12
|
+
constructor();
|
|
13
|
+
readonly isUrl: import("@angular/core").Signal<boolean>;
|
|
14
|
+
readonly bgColor: import("@angular/core").Signal<string>;
|
|
15
|
+
readonly initials: import("@angular/core").Signal<string>;
|
|
12
16
|
handleError(): void;
|
|
13
17
|
static ɵfac: i0.ɵɵFactoryDeclaration<SdAvatar, never>;
|
|
14
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SdAvatar, "sd-avatar", never, { "src": { "alias": "src"; "required": true; }; "size": { "alias": "size"; "required": false;
|
|
18
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SdAvatar, "sd-avatar", never, { "src": { "alias": "src"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
15
19
|
}
|
|
@@ -4,7 +4,7 @@ export interface ISdUploadFileConfiguration<TArgs = any> {
|
|
|
4
4
|
details: SdUploadFileFuncDetails<TArgs>;
|
|
5
5
|
download?: SdUploadFileFuncDownload<TArgs>;
|
|
6
6
|
}
|
|
7
|
-
export declare const
|
|
7
|
+
export declare const SD_UPLOAD_FILE_CONFIGURATION: InjectionToken<ISdUploadFileConfiguration<any>>;
|
|
8
8
|
export type SdUploadFileFuncUpload<TArgs> = (files: File[], args?: TArgs) => Promise<string[]>;
|
|
9
9
|
export type SdUploadFileFuncDetails<TArgs> = (idOrKey: (string | number)[], args?: TArgs) => Promise<SdUploadFileDetail[]>;
|
|
10
10
|
export type SdUploadFileFuncDownload<TArgs> = (idOrKey: string | number, args?: TArgs) => Promise<void>;
|
|
@@ -1,33 +1,55 @@
|
|
|
1
1
|
import { CommonModule } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import {
|
|
3
|
+
import { input, signal, effect, computed, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
4
4
|
|
|
5
5
|
class SdAvatar {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
6
|
+
/**
|
|
7
|
+
* The source string to be used for the avatar.
|
|
8
|
+
* - If it matches a URL pattern, an image is displayed.
|
|
9
|
+
* - If it is a string representing a name, initials and a colored background are generated.
|
|
10
|
+
* - If undefined, it falls back to a neutral ? initial.
|
|
11
|
+
*/
|
|
12
|
+
src = input.required();
|
|
13
|
+
size = input(32);
|
|
14
|
+
#imageError = signal(false);
|
|
15
|
+
constructor() {
|
|
16
|
+
// Reset image error state whenever src changes
|
|
17
|
+
effect(() => {
|
|
18
|
+
this.src();
|
|
19
|
+
this.#imageError.set(false);
|
|
20
|
+
});
|
|
14
21
|
}
|
|
15
|
-
|
|
16
|
-
//
|
|
22
|
+
isUrl = computed(() => {
|
|
23
|
+
// If image has failed to load, treat it as a non-url to fallback to initials using the literal URL text
|
|
24
|
+
if (this.#imageError()) {
|
|
25
|
+
return false;
|
|
26
|
+
}
|
|
27
|
+
const val = this.src() || '';
|
|
17
28
|
const urlPattern = /^(http|https|data:image|\/)/;
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
29
|
+
return urlPattern.test(val);
|
|
30
|
+
});
|
|
31
|
+
bgColor = computed(() => {
|
|
32
|
+
if (this.isUrl()) {
|
|
33
|
+
return 'transparent';
|
|
22
34
|
}
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
35
|
+
const val = this.src() || '';
|
|
36
|
+
if (!val) {
|
|
37
|
+
return '#bdc3c7';
|
|
26
38
|
}
|
|
27
|
-
|
|
39
|
+
return this.#generateColor(val);
|
|
40
|
+
});
|
|
41
|
+
initials = computed(() => {
|
|
42
|
+
if (this.isUrl()) {
|
|
43
|
+
return '';
|
|
44
|
+
}
|
|
45
|
+
const val = this.src() || '';
|
|
46
|
+
if (!val) {
|
|
47
|
+
return '?';
|
|
48
|
+
}
|
|
49
|
+
return this.#getInitials(val);
|
|
50
|
+
});
|
|
28
51
|
handleError() {
|
|
29
|
-
this.
|
|
30
|
-
this.#init();
|
|
52
|
+
this.#imageError.set(true);
|
|
31
53
|
}
|
|
32
54
|
#getInitials = (name) => {
|
|
33
55
|
return (name
|
|
@@ -68,19 +90,12 @@ class SdAvatar {
|
|
|
68
90
|
return colors[Math.abs(hash) % colors.length];
|
|
69
91
|
};
|
|
70
92
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdAvatar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
71
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: SdAvatar, isStandalone: true, selector: "sd-avatar", inputs: { src: "src", size: "size",
|
|
93
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: SdAvatar, isStandalone: true, selector: "sd-avatar", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"sd-avatar\" [style.width.px]=\"size()\" [style.height.px]=\"size()\" [style.line-height.px]=\"size()\" [style.backgroundColor]=\"bgColor()\">\n @if (isUrl()) {\n <img [src]=\"src()\" (error)=\"handleError()\" alt=\"avatar\" />\n } @else {\n <span class=\"sd-avatar-text\" [style.fontSize.px]=\"size() / 2.5\">\n {{ initials() }}\n </span>\n }\n</div>\n", styles: [".sd-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;color:#fff;font-weight:500;-webkit-user-select:none;user-select:none;background-size:cover}.sd-avatar img{width:100%;height:100%;object-fit:cover}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
72
94
|
}
|
|
73
95
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdAvatar, decorators: [{
|
|
74
96
|
type: Component,
|
|
75
|
-
args: [{ selector: 'sd-avatar', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sd-avatar\" [style.width.px]=\"size\" [style.height.px]=\"size\" [style.line-height.px]=\"size\" [style.backgroundColor]=\"bgColor\">\
|
|
76
|
-
}],
|
|
77
|
-
type: Input,
|
|
78
|
-
args: [{ required: true }]
|
|
79
|
-
}], size: [{
|
|
80
|
-
type: Input
|
|
81
|
-
}], name: [{
|
|
82
|
-
type: Input
|
|
83
|
-
}] } });
|
|
97
|
+
args: [{ selector: 'sd-avatar', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sd-avatar\" [style.width.px]=\"size()\" [style.height.px]=\"size()\" [style.line-height.px]=\"size()\" [style.backgroundColor]=\"bgColor()\">\n @if (isUrl()) {\n <img [src]=\"src()\" (error)=\"handleError()\" alt=\"avatar\" />\n } @else {\n <span class=\"sd-avatar-text\" [style.fontSize.px]=\"size() / 2.5\">\n {{ initials() }}\n </span>\n }\n</div>\n", styles: [".sd-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;color:#fff;font-weight:500;-webkit-user-select:none;user-select:none;background-size:cover}.sd-avatar img{width:100%;height:100%;object-fit:cover}\n"] }]
|
|
98
|
+
}], ctorParameters: () => [] });
|
|
84
99
|
|
|
85
100
|
/**
|
|
86
101
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-angular-core-components-avatar.mjs","sources":["../../../projects/sd-angular/components/avatar/src/avatar.component.ts","../../../projects/sd-angular/components/avatar/src/avatar.component.html","../../../projects/sd-angular/components/avatar/sd-angular-core-components-avatar.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\
|
|
1
|
+
{"version":3,"file":"sd-angular-core-components-avatar.mjs","sources":["../../../projects/sd-angular/components/avatar/src/avatar.component.ts","../../../projects/sd-angular/components/avatar/src/avatar.component.html","../../../projects/sd-angular/components/avatar/sd-angular-core-components-avatar.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, effect, input, signal } from '@angular/core';\n\n@Component({\n selector: 'sd-avatar',\n standalone: true,\n imports: [CommonModule],\n templateUrl: './avatar.component.html',\n styleUrls: ['./avatar.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SdAvatar {\n /**\n * The source string to be used for the avatar.\n * - If it matches a URL pattern, an image is displayed.\n * - If it is a string representing a name, initials and a colored background are generated.\n * - If undefined, it falls back to a neutral ? initial.\n */\n readonly src = input.required<string | undefined | null>();\n readonly size = input<number>(32);\n\n readonly #imageError = signal<boolean>(false);\n\n constructor() {\n // Reset image error state whenever src changes\n effect(() => {\n this.src();\n this.#imageError.set(false);\n });\n }\n\n readonly isUrl = computed(() => {\n // If image has failed to load, treat it as a non-url to fallback to initials using the literal URL text\n if (this.#imageError()) {\n return false;\n }\n const val = this.src() || '';\n const urlPattern = /^(http|https|data:image|\\/)/;\n return urlPattern.test(val);\n });\n\n readonly bgColor = computed(() => {\n if (this.isUrl()) {\n return 'transparent';\n }\n const val = this.src() || '';\n if (!val) {\n return '#bdc3c7';\n }\n return this.#generateColor(val);\n });\n\n readonly initials = computed(() => {\n if (this.isUrl()) {\n return '';\n }\n const val = this.src() || '';\n if (!val) {\n return '?';\n }\n return this.#getInitials(val);\n });\n\n handleError() {\n this.#imageError.set(true);\n }\n\n #getInitials = (name: string): string => {\n return (\n name\n .trim()\n .split(' ')\n .filter(Boolean)\n .map(n => n[0])\n .join('')\n .toUpperCase()\n .substring(0, 2) || ''\n );\n };\n\n #generateColor = (name: string): string => {\n const colors = [\n '#1abc9c',\n '#2ecc71',\n '#3498db',\n '#9b59b6',\n '#34495e',\n '#16a085',\n '#27ae60',\n '#2980b9',\n '#8e44ad',\n '#2c3e50',\n '#f1c40f',\n '#e67e22',\n '#e74c3c',\n '#95a5a6',\n '#f39c12',\n '#d35400',\n '#c0392b',\n '#bdc3c7',\n '#7f8c8d',\n ];\n let hash = 0;\n for (let i = 0; i < name.length; i++) {\n hash = name.charCodeAt(i) + ((hash << 5) - hash);\n }\n return colors[Math.abs(hash) % colors.length];\n };\n}\n","<div class=\"sd-avatar\" [style.width.px]=\"size()\" [style.height.px]=\"size()\" [style.line-height.px]=\"size()\" [style.backgroundColor]=\"bgColor()\">\n @if (isUrl()) {\n <img [src]=\"src()\" (error)=\"handleError()\" alt=\"avatar\" />\n } @else {\n <span class=\"sd-avatar-text\" [style.fontSize.px]=\"size() / 2.5\">\n {{ initials() }}\n </span>\n }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import * as i4 from '@angular/cdk/drag-drop';
|
|
|
4
4
|
import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
|
|
5
5
|
import * as i1 from '@angular/common';
|
|
6
6
|
import { CommonModule } from '@angular/common';
|
|
7
|
-
import { NgForm, FormGroup
|
|
7
|
+
import { NgForm, FormGroup } from '@angular/forms';
|
|
8
8
|
import * as i2 from '@angular/material/button';
|
|
9
9
|
import { MatButtonModule } from '@angular/material/button';
|
|
10
10
|
import * as i3 from '@angular/material/icon';
|
|
@@ -21,7 +21,7 @@ import { SdButton } from '@sd-angular/core/components/button';
|
|
|
21
21
|
import { SdModal } from '@sd-angular/core/components/modal';
|
|
22
22
|
import { SdUtilities } from '@sd-angular/core/utilities';
|
|
23
23
|
|
|
24
|
-
const
|
|
24
|
+
const SD_UPLOAD_FILE_CONFIGURATION = new InjectionToken('sd.upload-file.configuration');
|
|
25
25
|
|
|
26
26
|
class PreviewComponent {
|
|
27
27
|
cd;
|
|
@@ -123,11 +123,8 @@ const IsImage = (extension) => {
|
|
|
123
123
|
return IMAGE_EXTENSIONS.includes(extension?.toLowerCase());
|
|
124
124
|
};
|
|
125
125
|
|
|
126
|
-
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
127
|
-
// import { sha1 } from 'object-hash';
|
|
128
126
|
class UploadFileService {
|
|
129
127
|
#cache = {};
|
|
130
|
-
constructor() { }
|
|
131
128
|
#hash = (file) => {
|
|
132
129
|
if (!file) {
|
|
133
130
|
return null;
|
|
@@ -174,7 +171,7 @@ class UploadFileService {
|
|
|
174
171
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UploadFileService, decorators: [{
|
|
175
172
|
type: Injectable,
|
|
176
173
|
args: [{ providedIn: 'root' }]
|
|
177
|
-
}]
|
|
174
|
+
}] });
|
|
178
175
|
|
|
179
176
|
/* eslint-disable @angular-eslint/no-input-rename */
|
|
180
177
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
@@ -183,7 +180,7 @@ class SdUploadFile {
|
|
|
183
180
|
// ─── Injected Services ────────────────────────────────────────────────
|
|
184
181
|
#notifyService = inject(SdNotifyService);
|
|
185
182
|
#confirmService = inject(SdConfirmService);
|
|
186
|
-
#uploadFileConfig = inject(
|
|
183
|
+
#uploadFileConfig = inject(SD_UPLOAD_FILE_CONFIGURATION, { optional: true });
|
|
187
184
|
#uploadFileService = inject(UploadFileService);
|
|
188
185
|
#destroyRef = inject(DestroyRef);
|
|
189
186
|
// ─── Internal State ───────────────────────────────────────────────────
|
|
@@ -193,7 +190,6 @@ class SdUploadFile {
|
|
|
193
190
|
#canvas2 = `C${uuid.v4()}`;
|
|
194
191
|
#name = uuid.v4();
|
|
195
192
|
#formGroup;
|
|
196
|
-
#currentDropContainer;
|
|
197
193
|
formControl = new SdFormControl();
|
|
198
194
|
// ─── Signals (state) ──────────────────────────────────────────────────
|
|
199
195
|
previewFiles = signal([]);
|
|
@@ -336,7 +332,6 @@ class SdUploadFile {
|
|
|
336
332
|
}
|
|
337
333
|
}
|
|
338
334
|
#bindDropEvents(dropContainer) {
|
|
339
|
-
this.#currentDropContainer = dropContainer;
|
|
340
335
|
dropContainer.addEventListener('dragover', (evt) => {
|
|
341
336
|
evt.preventDefault();
|
|
342
337
|
dropContainer.style.opacity = 0.9;
|
|
@@ -365,18 +360,18 @@ class SdUploadFile {
|
|
|
365
360
|
this.formControl.markAsTouched();
|
|
366
361
|
this.formControl.setValue(this.model() || []);
|
|
367
362
|
};
|
|
368
|
-
#updateValidator = () => {
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
};
|
|
363
|
+
// #updateValidator = () => {
|
|
364
|
+
// this.formControl.clearValidators();
|
|
365
|
+
// this.formControl.clearAsyncValidators();
|
|
366
|
+
// const validators: ValidatorFn[] = [];
|
|
367
|
+
// const asyncValidators: AsyncValidatorFn[] = [];
|
|
368
|
+
// if (this.required()) {
|
|
369
|
+
// validators.push(Validators.required);
|
|
370
|
+
// }
|
|
371
|
+
// this.formControl.setValidators(validators);
|
|
372
|
+
// this.formControl.setAsyncValidators(asyncValidators);
|
|
373
|
+
// this.formControl.updateValueAndValidity();
|
|
374
|
+
// };
|
|
380
375
|
#validate = async (file) => {
|
|
381
376
|
if (this.type() === 'image') {
|
|
382
377
|
if (file.type.split('/')[0] !== 'image') {
|
|
@@ -616,12 +611,17 @@ class SdUploadFile {
|
|
|
616
611
|
const uploadedFiles = items.map(e => e?.file).filter(file => !!file);
|
|
617
612
|
let idOrKeys = [];
|
|
618
613
|
if (uploadedFiles.length) {
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
614
|
+
if (this.#uploadFileConfig) {
|
|
615
|
+
idOrKeys = await this.#uploadFileConfig.upload(uploadedFiles, this.args()).then(results => {
|
|
616
|
+
for (const uploadedFile of uploadedFiles) {
|
|
617
|
+
this.#uploadFileService.remove(uploadedFile);
|
|
618
|
+
}
|
|
619
|
+
return results;
|
|
620
|
+
});
|
|
621
|
+
}
|
|
622
|
+
else {
|
|
623
|
+
this.#notifyService.error(`Vui lòng inject SD_UPLOAD_FILE_CONFIGURATION`);
|
|
624
|
+
}
|
|
625
625
|
}
|
|
626
626
|
let idx = 0;
|
|
627
627
|
for (const item of items) {
|
|
@@ -679,20 +679,12 @@ class SdUploadFile {
|
|
|
679
679
|
}
|
|
680
680
|
const idOrKeys = keys.filter(key => !!key && !this.#isCdn(key) && !this.#isHashedKey(key));
|
|
681
681
|
let detailsList = [];
|
|
682
|
-
const
|
|
683
|
-
if (idOrKeys.length) {
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
});
|
|
689
|
-
}
|
|
690
|
-
else if (this.#uploadFileConfig.details) {
|
|
691
|
-
detailsList = await this.#uploadFileConfig.details(idOrKeys, this.args()).catch(error => {
|
|
692
|
-
console.error(error);
|
|
693
|
-
return [];
|
|
694
|
-
});
|
|
695
|
-
}
|
|
682
|
+
const details = this.details() || this.#uploadFileConfig?.details;
|
|
683
|
+
if (idOrKeys.length && details) {
|
|
684
|
+
detailsList = await details(idOrKeys, this.args()).catch(error => {
|
|
685
|
+
console.error(error);
|
|
686
|
+
return [];
|
|
687
|
+
});
|
|
696
688
|
}
|
|
697
689
|
const results = [];
|
|
698
690
|
for (const key of keys.filter(val => !!val)) {
|
|
@@ -808,5 +800,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
|
|
|
808
800
|
* Generated bundle index. Do not edit.
|
|
809
801
|
*/
|
|
810
802
|
|
|
811
|
-
export {
|
|
803
|
+
export { SD_UPLOAD_FILE_CONFIGURATION, SdUploadFile };
|
|
812
804
|
//# sourceMappingURL=sd-angular-core-components-upload-file.mjs.map
|