@webilix/ngx-helper-m3 0.0.11 → 0.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/webilix-ngx-helper-m3.mjs +1100 -580
- package/fesm2022/webilix-ngx-helper-m3.mjs.map +1 -1
- package/lib/components/component.service.d.ts +11 -0
- package/lib/components/value/box/ngx-helper-value-box.component.d.ts +2 -10
- package/lib/components/value/list/ngx-helper-value-list.component.d.ts +4 -10
- package/lib/components/value/ngx-helper-value.interface.d.ts +1 -0
- package/lib/http/download/download.component.d.ts +25 -0
- package/lib/http/ngx-helper-http.interface.d.ts +15 -0
- package/lib/http/ngx-helper-http.service.d.ts +27 -0
- package/lib/http/upload/upload.component.d.ts +21 -0
- package/lib/ngx-helper.config.d.ts +5 -0
- package/lib/toast/ngx-helper-toast.interface.d.ts +4 -0
- package/lib/toast/ngx-helper-toast.service.d.ts +41 -0
- package/lib/toast/toast/toast.component.d.ts +35 -0
- package/ngx-helper-m3.css +158 -0
- package/package.json +1 -1
- package/public-api.d.ts +4 -0
- package/lib/components/value/ngx-helper-value.info.d.ts +0 -2
@@ -1,4 +1,5 @@
|
|
1
1
|
import { INgxHelperConfig } from '../ngx-helper.config';
|
2
|
+
import { INgxHelperValue } from './value/ngx-helper-value.interface';
|
2
3
|
import * as i0 from "@angular/core";
|
3
4
|
export interface IComponentConfig {
|
4
5
|
readonly mobileWidth: number;
|
@@ -14,8 +15,18 @@ export interface IComponentConfig {
|
|
14
15
|
};
|
15
16
|
};
|
16
17
|
}
|
18
|
+
export interface IValueComponentData {
|
19
|
+
readonly title: string;
|
20
|
+
readonly value: string;
|
21
|
+
readonly color?: string;
|
22
|
+
readonly action?: () => string[] | void;
|
23
|
+
readonly copyToClipboard?: boolean;
|
24
|
+
readonly ltr?: boolean;
|
25
|
+
readonly english?: boolean;
|
26
|
+
}
|
17
27
|
export declare class ComponentService {
|
18
28
|
getComponentConfig(config?: Partial<INgxHelperConfig>): IComponentConfig;
|
29
|
+
getValueData(values: INgxHelperValue[]): IValueComponentData[];
|
19
30
|
static ɵfac: i0.ɵɵFactoryDeclaration<ComponentService, never>;
|
20
31
|
static ɵprov: i0.ɵɵInjectableDeclaration<ComponentService>;
|
21
32
|
}
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import { OnChanges, OnInit, SimpleChanges } from '@angular/core';
|
2
2
|
import { Router } from '@angular/router';
|
3
3
|
import { INgxHelperConfig } from '../../../ngx-helper.config';
|
4
|
-
import { ComponentService } from '../../component.service';
|
4
|
+
import { ComponentService, IValueComponentData } from '../../component.service';
|
5
5
|
import { INgxHelperValue } from '../ngx-helper-value.interface';
|
6
6
|
import * as i0 from "@angular/core";
|
7
7
|
export declare class NgxHelperValueBoxComponent implements OnInit, OnChanges {
|
@@ -20,18 +20,10 @@ export declare class NgxHelperValueBoxComponent implements OnInit, OnChanges {
|
|
20
20
|
emptyText: string;
|
21
21
|
gapSize: string;
|
22
22
|
hideShadow: boolean;
|
23
|
-
data:
|
24
|
-
title: string;
|
25
|
-
value: string;
|
26
|
-
action?: () => string[] | void;
|
27
|
-
copyToClipboard?: boolean;
|
28
|
-
ltr?: boolean;
|
29
|
-
english?: boolean;
|
30
|
-
}[];
|
23
|
+
data: IValueComponentData[];
|
31
24
|
copyIndex?: number;
|
32
25
|
private copyTimeout;
|
33
26
|
private componentConfig;
|
34
|
-
private pipeTransform;
|
35
27
|
constructor(router: Router, componentService: ComponentService, config?: Partial<INgxHelperConfig> | undefined);
|
36
28
|
ngOnInit(): void;
|
37
29
|
ngOnChanges(changes: SimpleChanges): void;
|
@@ -1,25 +1,19 @@
|
|
1
1
|
import { OnChanges, SimpleChanges } from '@angular/core';
|
2
2
|
import { Router } from '@angular/router';
|
3
|
+
import { ComponentService, IValueComponentData } from '../../component.service';
|
3
4
|
import { INgxHelperValue } from '../ngx-helper-value.interface';
|
4
5
|
import * as i0 from "@angular/core";
|
5
6
|
export declare class NgxHelperValueListComponent implements OnChanges {
|
6
7
|
private readonly router;
|
8
|
+
private readonly componentService;
|
7
9
|
private className;
|
8
10
|
values: INgxHelperValue[];
|
9
11
|
titleWidth: string;
|
10
12
|
emptyText: string;
|
11
|
-
data:
|
12
|
-
title: string;
|
13
|
-
value: string;
|
14
|
-
action?: () => string[] | void;
|
15
|
-
copyToClipboard?: boolean;
|
16
|
-
ltr?: boolean;
|
17
|
-
english?: boolean;
|
18
|
-
}[];
|
13
|
+
data: IValueComponentData[];
|
19
14
|
copyIndex?: number;
|
20
15
|
private copyTimeout;
|
21
|
-
|
22
|
-
constructor(router: Router);
|
16
|
+
constructor(router: Router, componentService: ComponentService);
|
23
17
|
ngOnChanges(changes: SimpleChanges): void;
|
24
18
|
onClick(action?: () => string[] | void): void;
|
25
19
|
onCopy(event: Event, index: number): void;
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import { AfterViewInit } from '@angular/core';
|
2
|
+
import { HttpClient } from '@angular/common/http';
|
3
|
+
import { NgxHelperToastService } from '../../toast/ngx-helper-toast.service';
|
4
|
+
import { INgxHelperHttpDownloadConfig } from '../ngx-helper-http.interface';
|
5
|
+
import * as i0 from "@angular/core";
|
6
|
+
export declare class DownloadComponent implements AfterViewInit {
|
7
|
+
private readonly httpClient;
|
8
|
+
private readonly ngxHelperToastService;
|
9
|
+
private host;
|
10
|
+
private className;
|
11
|
+
bottom: string;
|
12
|
+
id: string;
|
13
|
+
path: string;
|
14
|
+
title: string;
|
15
|
+
config: Partial<INgxHelperHttpDownloadConfig>;
|
16
|
+
onSuccess: (arrayBuffer: ArrayBuffer) => void;
|
17
|
+
onError: () => void;
|
18
|
+
close: () => void;
|
19
|
+
progress: number;
|
20
|
+
constructor(httpClient: HttpClient, ngxHelperToastService: NgxHelperToastService);
|
21
|
+
ngAfterViewInit(): void;
|
22
|
+
download(): void;
|
23
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DownloadComponent, never>;
|
24
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DownloadComponent, "ng-component", never, {}, {}, never, never, true, never>;
|
25
|
+
}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
export interface INgxHelperHttpDownloadConfig {
|
2
|
+
readonly method: 'GET' | 'POST' | 'PUT' | 'PATCH';
|
3
|
+
readonly header: {
|
4
|
+
[key: string]: any;
|
5
|
+
};
|
6
|
+
}
|
7
|
+
export interface INgxHelperHttpUploadConfig {
|
8
|
+
readonly method: 'POST' | 'PUT' | 'PATCH';
|
9
|
+
readonly header: {
|
10
|
+
[key: string]: any;
|
11
|
+
};
|
12
|
+
readonly body: {
|
13
|
+
[key: string]: any;
|
14
|
+
};
|
15
|
+
}
|
@@ -0,0 +1,27 @@
|
|
1
|
+
import { ApplicationRef, Injector } from '@angular/core';
|
2
|
+
import { HttpStatusCode } from '@angular/common/http';
|
3
|
+
import { NgxHelperToastService } from '../toast/ngx-helper-toast.service';
|
4
|
+
import { INgxHelperHttpDownloadConfig, INgxHelperHttpUploadConfig } from './ngx-helper-http.interface';
|
5
|
+
import * as i0 from "@angular/core";
|
6
|
+
export declare class NgxHelperHttpService {
|
7
|
+
private readonly applicationRef;
|
8
|
+
private readonly injector;
|
9
|
+
private readonly ngxHelperToastService;
|
10
|
+
private components;
|
11
|
+
constructor(applicationRef: ApplicationRef, injector: Injector, ngxHelperToastService: NgxHelperToastService);
|
12
|
+
private getId;
|
13
|
+
private updatePositions;
|
14
|
+
private getBuffer;
|
15
|
+
download(path: string, title: string): void;
|
16
|
+
download(path: string, title: string, config: Partial<INgxHelperHttpDownloadConfig>): void;
|
17
|
+
upload<R, E>(file: File, url: string, onSuccess: (response: R | undefined, status: HttpStatusCode) => void, onError: (error: E | undefined, status: HttpStatusCode) => void): void;
|
18
|
+
upload<R, E>(file: File, url: string, config: Partial<INgxHelperHttpUploadConfig>, onSuccess: (response: R, status: HttpStatusCode) => void, onError: (error: E, status: HttpStatusCode) => void): void;
|
19
|
+
printPDF(url: string): void;
|
20
|
+
printPDF(url: string, config: Partial<INgxHelperHttpDownloadConfig>): void;
|
21
|
+
printPDF(buffer: ArrayBuffer): void;
|
22
|
+
printPDF(buffer: ArrayBuffer, config: Partial<INgxHelperHttpDownloadConfig>): void;
|
23
|
+
printPDF(blob: Blob): void;
|
24
|
+
printPDF(blob: Blob, config: Partial<INgxHelperHttpDownloadConfig>): void;
|
25
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<NgxHelperHttpService, never>;
|
26
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<NgxHelperHttpService>;
|
27
|
+
}
|
@@ -0,0 +1,21 @@
|
|
1
|
+
import { AfterViewInit } from '@angular/core';
|
2
|
+
import { HttpClient, HttpStatusCode } from '@angular/common/http';
|
3
|
+
import { INgxHelperHttpUploadConfig } from '../ngx-helper-http.interface';
|
4
|
+
import * as i0 from "@angular/core";
|
5
|
+
export declare class UploadComponent<R, E> implements AfterViewInit {
|
6
|
+
private readonly httpClient;
|
7
|
+
private host;
|
8
|
+
private className;
|
9
|
+
bottom: string;
|
10
|
+
id: string;
|
11
|
+
file: File;
|
12
|
+
url: string;
|
13
|
+
config: Partial<INgxHelperHttpUploadConfig>;
|
14
|
+
close: (type: 'RESPONSE' | 'ERROR', result: any, status: HttpStatusCode) => void;
|
15
|
+
progress: number;
|
16
|
+
constructor(httpClient: HttpClient);
|
17
|
+
ngAfterViewInit(): void;
|
18
|
+
upload(): void;
|
19
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<UploadComponent<any, any>, never>;
|
20
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<UploadComponent<any, any>, "ng-component", never, {}, {}, never, never, true, never>;
|
21
|
+
}
|
@@ -2,6 +2,11 @@ import { EnvironmentProviders, InjectionToken } from '@angular/core';
|
|
2
2
|
export interface INgxHelperConfig {
|
3
3
|
readonly mobileWidth: number;
|
4
4
|
readonly pageGroupSidebarWidth: string;
|
5
|
+
readonly toastTimeout: number;
|
6
|
+
readonly toastXPosition: 'LEFT' | 'CENTER' | 'RIGHT';
|
7
|
+
readonly toastAllowDuplicates: boolean;
|
8
|
+
readonly toastResetDuplicates: boolean;
|
9
|
+
readonly toastProgressAnimation: 'DECREASE' | 'INCREASE';
|
5
10
|
readonly stickyView: {
|
6
11
|
readonly top?: string | {
|
7
12
|
readonly desktopView: string;
|
@@ -0,0 +1,41 @@
|
|
1
|
+
import { ApplicationRef, Injector } from '@angular/core';
|
2
|
+
import { INgxHelperConfig } from '../ngx-helper.config';
|
3
|
+
import { INgxHelperToastConfig } from './ngx-helper-toast.interface';
|
4
|
+
import * as i0 from "@angular/core";
|
5
|
+
interface IToast {
|
6
|
+
readonly icon: string;
|
7
|
+
readonly textColor: string;
|
8
|
+
readonly backgroundColor: string;
|
9
|
+
}
|
10
|
+
export declare class NgxHelperToastService {
|
11
|
+
private readonly applicationRef;
|
12
|
+
private readonly injector;
|
13
|
+
private readonly config?;
|
14
|
+
private components;
|
15
|
+
constructor(applicationRef: ApplicationRef, injector: Injector, config?: Partial<INgxHelperConfig> | undefined);
|
16
|
+
private getId;
|
17
|
+
private updatePositions;
|
18
|
+
toast(toast: IToast, message: string | string[]): void;
|
19
|
+
toast(toast: IToast, message: string | string[], config: Partial<INgxHelperToastConfig>): void;
|
20
|
+
toast(toast: IToast, message: string | string[], onClose: () => void): void;
|
21
|
+
toast(toast: IToast, message: string | string[], config: Partial<INgxHelperToastConfig>, onClose: () => void): void;
|
22
|
+
info(message: string | string[]): void;
|
23
|
+
info(message: string | string[], config: Partial<INgxHelperToastConfig>): void;
|
24
|
+
info(message: string | string[], onClose: () => void): void;
|
25
|
+
info(message: string | string[], config: Partial<INgxHelperToastConfig>, onClose: () => void): void;
|
26
|
+
success(message: string | string[]): void;
|
27
|
+
success(message: string | string[], config: Partial<INgxHelperToastConfig>): void;
|
28
|
+
success(message: string | string[], onClose: () => void): void;
|
29
|
+
success(message: string | string[], config: Partial<INgxHelperToastConfig>, onClose: () => void): void;
|
30
|
+
warning(message: string | string[]): void;
|
31
|
+
warning(message: string | string[], config: Partial<INgxHelperToastConfig>): void;
|
32
|
+
warning(message: string | string[], onClose: () => void): void;
|
33
|
+
warning(message: string | string[], config: Partial<INgxHelperToastConfig>, onClose: () => void): void;
|
34
|
+
error(message: string | string[]): void;
|
35
|
+
error(message: string | string[], config: Partial<INgxHelperToastConfig>): void;
|
36
|
+
error(message: string | string[], onClose: () => void): void;
|
37
|
+
error(message: string | string[], config: Partial<INgxHelperToastConfig>, onClose: () => void): void;
|
38
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<NgxHelperToastService, [null, null, { optional: true; }]>;
|
39
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<NgxHelperToastService>;
|
40
|
+
}
|
41
|
+
export {};
|
@@ -0,0 +1,35 @@
|
|
1
|
+
import { AfterViewInit, ElementRef, OnDestroy, OnInit } from '@angular/core';
|
2
|
+
import { INgxHelperConfig } from '../../ngx-helper.config';
|
3
|
+
import { INgxHelperToastConfig } from '../ngx-helper-toast.interface';
|
4
|
+
import * as i0 from "@angular/core";
|
5
|
+
export declare class ToastComponent implements OnInit, OnDestroy, AfterViewInit {
|
6
|
+
readonly elementRef: ElementRef;
|
7
|
+
private onClick;
|
8
|
+
private host;
|
9
|
+
private className;
|
10
|
+
top: string;
|
11
|
+
textColor: string;
|
12
|
+
borderColor: string;
|
13
|
+
backgroundColor: string;
|
14
|
+
id: string;
|
15
|
+
icon: string;
|
16
|
+
messages: string[];
|
17
|
+
config: {
|
18
|
+
helper?: Partial<INgxHelperConfig>;
|
19
|
+
toast: Partial<INgxHelperToastConfig>;
|
20
|
+
};
|
21
|
+
init: () => void;
|
22
|
+
close: () => void;
|
23
|
+
timeout: number;
|
24
|
+
showClose: boolean;
|
25
|
+
animation: 'DECREASE' | 'INCREASE';
|
26
|
+
progress: number;
|
27
|
+
start: number;
|
28
|
+
private interval?;
|
29
|
+
constructor(elementRef: ElementRef);
|
30
|
+
ngOnInit(): void;
|
31
|
+
ngOnDestroy(): void;
|
32
|
+
ngAfterViewInit(): void;
|
33
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ToastComponent, never>;
|
34
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ToastComponent, "ng-component", never, {}, {}, never, never, true, never>;
|
35
|
+
}
|
package/ngx-helper-m3.css
CHANGED
@@ -79,6 +79,163 @@
|
|
79
79
|
}
|
80
80
|
}
|
81
81
|
|
82
|
+
/* NGX HELPER HTTP (UPLOAD / DOWNLOAD) */
|
83
|
+
.ngx-helper-m3-http {
|
84
|
+
position: fixed;
|
85
|
+
left: 1rem;
|
86
|
+
|
87
|
+
direction: ltr;
|
88
|
+
display: block;
|
89
|
+
height: 40px;
|
90
|
+
overflow: hidden;
|
91
|
+
width: calc(100vw - 4rem);
|
92
|
+
max-width: 250px;
|
93
|
+
transition: all 0.35s ease-out;
|
94
|
+
z-index: 5000;
|
95
|
+
|
96
|
+
border-radius: 8px;
|
97
|
+
border: 1px solid var(--outline-variant);
|
98
|
+
background-color: var(--surface-container);
|
99
|
+
|
100
|
+
.content {
|
101
|
+
display: flex;
|
102
|
+
align-items: center;
|
103
|
+
column-gap: 0.5rem;
|
104
|
+
|
105
|
+
height: 37px;
|
106
|
+
padding: 0 0.5rem;
|
107
|
+
|
108
|
+
.file {
|
109
|
+
flex: 1;
|
110
|
+
|
111
|
+
font-size: 90%;
|
112
|
+
text-align: left;
|
113
|
+
direction: ltr;
|
114
|
+
font-family: Roboto, 'Helvetica Neue', sans-serif;
|
115
|
+
|
116
|
+
white-space: nowrap;
|
117
|
+
overflow: hidden;
|
118
|
+
text-overflow: ellipsis;
|
119
|
+
}
|
120
|
+
|
121
|
+
.title {
|
122
|
+
flex: 1;
|
123
|
+
|
124
|
+
font-size: 90%;
|
125
|
+
text-align: right;
|
126
|
+
direction: rtl;
|
127
|
+
|
128
|
+
white-space: nowrap;
|
129
|
+
overflow: hidden;
|
130
|
+
text-overflow: ellipsis;
|
131
|
+
}
|
132
|
+
}
|
133
|
+
|
134
|
+
.progress-container {
|
135
|
+
width: 100%;
|
136
|
+
height: 3px;
|
137
|
+
background-color: var(--outline-variant);
|
138
|
+
position: relative;
|
139
|
+
|
140
|
+
.progress-value {
|
141
|
+
position: absolute;
|
142
|
+
top: 0;
|
143
|
+
bottom: 0;
|
144
|
+
left: 0;
|
145
|
+
|
146
|
+
background-color: var(--primary);
|
147
|
+
transition: all 0.35s ease-out;
|
148
|
+
}
|
149
|
+
}
|
150
|
+
}
|
151
|
+
|
152
|
+
/* NGX HELPER TOAST */
|
153
|
+
.ngx-helper-m3-toast {
|
154
|
+
position: fixed;
|
155
|
+
|
156
|
+
display: block;
|
157
|
+
direction: rtl;
|
158
|
+
width: calc(100vw - 4rem);
|
159
|
+
max-width: 350px;
|
160
|
+
transition: top 0.35s ease-out;
|
161
|
+
z-index: 5000;
|
162
|
+
border-radius: 8px;
|
163
|
+
cursor: pointer;
|
164
|
+
box-sizing: border-box;
|
165
|
+
overflow: hidden;
|
166
|
+
border: 1px solid transparent;
|
167
|
+
|
168
|
+
.content {
|
169
|
+
display: flex;
|
170
|
+
align-items: flex-start;
|
171
|
+
column-gap: 0.5rem;
|
172
|
+
|
173
|
+
.toast {
|
174
|
+
flex: 1;
|
175
|
+
|
176
|
+
display: flex;
|
177
|
+
align-items: center;
|
178
|
+
column-gap: 1rem;
|
179
|
+
|
180
|
+
padding-right: 1rem;
|
181
|
+
|
182
|
+
ul {
|
183
|
+
flex: 1;
|
184
|
+
list-style: none;
|
185
|
+
margin: 0;
|
186
|
+
padding: 1rem 0 1rem 1rem;
|
187
|
+
|
188
|
+
li {
|
189
|
+
margin: 0;
|
190
|
+
padding: 0;
|
191
|
+
font-weight: 500;
|
192
|
+
line-height: 1.45;
|
193
|
+
padding-top: 0.25rem;
|
194
|
+
}
|
195
|
+
|
196
|
+
li:first-of-type {
|
197
|
+
padding-top: 0;
|
198
|
+
}
|
199
|
+
}
|
200
|
+
|
201
|
+
mat-icon.icon {
|
202
|
+
font-size: 26px;
|
203
|
+
}
|
204
|
+
}
|
205
|
+
|
206
|
+
mat-icon.close {
|
207
|
+
padding: 1rem 0 0 1rem;
|
208
|
+
}
|
209
|
+
}
|
210
|
+
|
211
|
+
.progress-container {
|
212
|
+
width: 100%;
|
213
|
+
height: 4px;
|
214
|
+
position: relative;
|
215
|
+
|
216
|
+
.progress-value {
|
217
|
+
position: absolute;
|
218
|
+
top: 0;
|
219
|
+
bottom: 0;
|
220
|
+
left: 0;
|
221
|
+
|
222
|
+
transition: all 0.35s ease-out;
|
223
|
+
}
|
224
|
+
}
|
225
|
+
}
|
226
|
+
.ngx-helper-m3-toast.center {
|
227
|
+
left: 50%;
|
228
|
+
transform: translate(-50%, 0);
|
229
|
+
}
|
230
|
+
|
231
|
+
.ngx-helper-m3-toast.left {
|
232
|
+
left: 1rem;
|
233
|
+
}
|
234
|
+
|
235
|
+
.ngx-helper-m3-toast.right {
|
236
|
+
right: 1rem;
|
237
|
+
}
|
238
|
+
|
82
239
|
/* NGX HELPER VALUE LIST */
|
83
240
|
.ngx-helper-m3-box {
|
84
241
|
display: block;
|
@@ -334,6 +491,7 @@
|
|
334
491
|
}
|
335
492
|
|
336
493
|
.page-group-spacer {
|
494
|
+
z-index: 1;
|
337
495
|
height: 1rem;
|
338
496
|
width: 100%;
|
339
497
|
background-color: var(--background);
|
package/package.json
CHANGED
package/public-api.d.ts
CHANGED
@@ -29,3 +29,7 @@ export * from './lib/confirm/confirm.interface';
|
|
29
29
|
export * from './lib/confirm/confirm.service';
|
30
30
|
export * from './lib/container/container.interface';
|
31
31
|
export * from './lib/container/container.service';
|
32
|
+
export * from './lib/http/ngx-helper-http.interface';
|
33
|
+
export * from './lib/http/ngx-helper-http.service';
|
34
|
+
export * from './lib/toast/ngx-helper-toast.interface';
|
35
|
+
export * from './lib/toast/ngx-helper-toast.service';
|