@foxeltech/angular-ui 0.0.5 → 0.0.7
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/foxeltech-angular-ui.mjs +50 -17
- package/fesm2022/foxeltech-angular-ui.mjs.map +1 -1
- package/index.d.ts +14 -4
- package/package.json +1 -1
- package/src/lib/styles/theme.css +1 -1
- package/src/lib/ui/components/dnd-upload/dnd-upload.component.html +20 -11
- package/src/lib/ui/components/tag/tag.component.html +1 -0
- package/theme.css +1 -1
package/index.d.ts
CHANGED
|
@@ -86,6 +86,7 @@ declare class FxToastrService {
|
|
|
86
86
|
private appRef;
|
|
87
87
|
private containerRef?;
|
|
88
88
|
private idCounter;
|
|
89
|
+
private recentMessages;
|
|
89
90
|
constructor(appRef: ApplicationRef);
|
|
90
91
|
private ensureContainerExists;
|
|
91
92
|
private show;
|
|
@@ -244,7 +245,6 @@ declare class FxUtils {
|
|
|
244
245
|
static convertColorFromVariable(name: string, alpha?: number): string;
|
|
245
246
|
static getTagClass(key: string, isCriticalExist?: boolean): TagType;
|
|
246
247
|
static validateEmail(value: string): boolean;
|
|
247
|
-
static isStrongPassword(password: string): boolean;
|
|
248
248
|
static formatSizeUnits(bytes: number): string;
|
|
249
249
|
}
|
|
250
250
|
|
|
@@ -388,6 +388,7 @@ declare class AuthStateService {
|
|
|
388
388
|
|
|
389
389
|
declare class AuthInterceptor implements HttpInterceptor {
|
|
390
390
|
private authState;
|
|
391
|
+
private handlingUnauthorized;
|
|
391
392
|
constructor(authState: AuthStateService);
|
|
392
393
|
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>>;
|
|
393
394
|
static ɵfac: i0.ɵɵFactoryDeclaration<AuthInterceptor, never>;
|
|
@@ -563,6 +564,8 @@ declare class SelectComponent extends FxComponent<string | string[]> implements
|
|
|
563
564
|
label: string;
|
|
564
565
|
value: string;
|
|
565
566
|
}[]>;
|
|
567
|
+
/** Emits the current value when the select panel closes (useful for multiple mode). */
|
|
568
|
+
closed: EventEmitter<string | string[]>;
|
|
566
569
|
searchTerm: string;
|
|
567
570
|
filteredOptions: {
|
|
568
571
|
label: string;
|
|
@@ -578,7 +581,7 @@ declare class SelectComponent extends FxComponent<string | string[]> implements
|
|
|
578
581
|
onSelectionChange(value: any): void;
|
|
579
582
|
isSelected(value: string): boolean;
|
|
580
583
|
static ɵfac: i0.ɵɵFactoryDeclaration<SelectComponent, never>;
|
|
581
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SelectComponent, "fx-ui-select", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "required": { "alias": "required"; "required": false; }; "class": { "alias": "class"; "required": false; }; "enableSearch": { "alias": "enableSearch"; "required": false; }; "searchFn": { "alias": "searchFn"; "required": false; }; }, {}, never, never, false, never>;
|
|
584
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SelectComponent, "fx-ui-select", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "required": { "alias": "required"; "required": false; }; "class": { "alias": "class"; "required": false; }; "enableSearch": { "alias": "enableSearch"; "required": false; }; "searchFn": { "alias": "searchFn"; "required": false; }; }, { "closed": "closed"; }, never, never, false, never>;
|
|
582
585
|
}
|
|
583
586
|
|
|
584
587
|
interface IRadioButton {
|
|
@@ -634,6 +637,10 @@ declare class DndUploadComponent {
|
|
|
634
637
|
accept: string;
|
|
635
638
|
maxSizeMB: number;
|
|
636
639
|
strictSize: boolean;
|
|
640
|
+
/** Icon name from heroicons (outline). Default: 'arrow-up-tray' */
|
|
641
|
+
icon: string;
|
|
642
|
+
/** CSS color value for accent (border, icon, link). Default uses --gradient-primary-start */
|
|
643
|
+
accentColor: string;
|
|
637
644
|
fileDrop: EventEmitter<File[]>;
|
|
638
645
|
fileClick: EventEmitter<void>;
|
|
639
646
|
uploadComplete: EventEmitter<File[]>;
|
|
@@ -643,6 +650,7 @@ declare class DndUploadComponent {
|
|
|
643
650
|
}>;
|
|
644
651
|
isDragOver: boolean;
|
|
645
652
|
private isOpening;
|
|
653
|
+
get accentStyle(): Record<string, string>;
|
|
646
654
|
onDragOver(event: DragEvent): void;
|
|
647
655
|
onDragLeave(event: DragEvent): void;
|
|
648
656
|
onDrop(event: DragEvent): void;
|
|
@@ -652,7 +660,7 @@ declare class DndUploadComponent {
|
|
|
652
660
|
private onUpload;
|
|
653
661
|
private isAccepted;
|
|
654
662
|
static ɵfac: i0.ɵɵFactoryDeclaration<DndUploadComponent, never>;
|
|
655
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<DndUploadComponent, "fx-ui-dnd-upload", never, { "multiple": { "alias": "multiple"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "maxSizeMB": { "alias": "maxSizeMB"; "required": false; }; "strictSize": { "alias": "strictSize"; "required": false; }; }, { "fileDrop": "fileDrop"; "fileClick": "fileClick"; "uploadComplete": "uploadComplete"; "uploadError": "uploadError"; }, never, never, false, never>;
|
|
663
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DndUploadComponent, "fx-ui-dnd-upload", never, { "multiple": { "alias": "multiple"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "maxSizeMB": { "alias": "maxSizeMB"; "required": false; }; "strictSize": { "alias": "strictSize"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "accentColor": { "alias": "accentColor"; "required": false; }; }, { "fileDrop": "fileDrop"; "fileClick": "fileClick"; "uploadComplete": "uploadComplete"; "uploadError": "uploadError"; }, never, never, false, never>;
|
|
656
664
|
}
|
|
657
665
|
|
|
658
666
|
declare class ButtonComponent {
|
|
@@ -803,8 +811,10 @@ declare class TagComponent {
|
|
|
803
811
|
rounded: boolean;
|
|
804
812
|
icon?: any;
|
|
805
813
|
solid: boolean;
|
|
814
|
+
click: EventEmitter<void>;
|
|
815
|
+
onClick(): void;
|
|
806
816
|
static ɵfac: i0.ɵɵFactoryDeclaration<TagComponent, never>;
|
|
807
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<TagComponent, "fx-ui-tag", never, { "label": { "alias": "label"; "required": false; }; "type": { "alias": "type"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "solid": { "alias": "solid"; "required": false; }; }, {}, never, never, false, never>;
|
|
817
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TagComponent, "fx-ui-tag", never, { "label": { "alias": "label"; "required": false; }; "type": { "alias": "type"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "solid": { "alias": "solid"; "required": false; }; }, { "click": "click"; }, never, never, false, never>;
|
|
808
818
|
}
|
|
809
819
|
|
|
810
820
|
type IChartType = 'bar' | 'pie' | 'line' | 'sunburst' | 'radar' | 'auto';
|
package/package.json
CHANGED
package/src/lib/styles/theme.css
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
<div
|
|
2
|
-
class="
|
|
2
|
+
class="dnd-wrapper"
|
|
3
|
+
[ngStyle]="accentStyle"
|
|
3
4
|
(dragover)="onDragOver($event)"
|
|
4
5
|
(dragleave)="onDragLeave($event)"
|
|
5
6
|
(drop)="onDrop($event)"
|
|
@@ -7,25 +8,33 @@
|
|
|
7
8
|
<div
|
|
8
9
|
role="button"
|
|
9
10
|
tabindex="0"
|
|
10
|
-
class="
|
|
11
|
-
[
|
|
12
|
-
'border-border-default bg-bg-hover': !isDragOver,
|
|
13
|
-
'border-gradient-primary-start bg-secondary': isDragOver,
|
|
14
|
-
}"
|
|
11
|
+
class="dnd-area"
|
|
12
|
+
[class.drag-over]="isDragOver"
|
|
15
13
|
(click)="onAreaClick(fileInput, $event)"
|
|
16
14
|
(keydown.enter)="onAreaClick(fileInput, $event)"
|
|
17
15
|
>
|
|
18
|
-
<
|
|
19
|
-
|
|
16
|
+
<fx-ui-hero-icon
|
|
17
|
+
[icon]="icon"
|
|
18
|
+
[size]="40"
|
|
19
|
+
class="flex dnd-icon"
|
|
20
|
+
></fx-ui-hero-icon>
|
|
21
|
+
<div class="dnd-text">
|
|
22
|
+
<span class="dnd-link">Click to upload</span>
|
|
23
|
+
<span class="dnd-or">or drag and drop</span>
|
|
20
24
|
</div>
|
|
21
|
-
<div class="
|
|
22
|
-
|
|
25
|
+
<div class="dnd-hint">
|
|
26
|
+
@if (accept) {
|
|
27
|
+
Accepted: {{ accept }}
|
|
28
|
+
} @else {
|
|
29
|
+
Any file type
|
|
30
|
+
}
|
|
31
|
+
— Max {{ maxSizeMB }} MB
|
|
23
32
|
</div>
|
|
24
33
|
|
|
25
34
|
<input
|
|
26
35
|
#fileInput
|
|
27
36
|
type="file"
|
|
28
|
-
class="
|
|
37
|
+
class="dnd-input"
|
|
29
38
|
[attr.multiple]="multiple ? '' : null"
|
|
30
39
|
[attr.accept]="accept"
|
|
31
40
|
(change)="onFileSelected($event)"
|