@cedx/base 0.14.1 → 0.15.1
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/ReadMe.md +1 -1
- package/lib/UI/Components/LoadingIndicator.d.ts +7 -7
- package/lib/UI/Components/LoadingIndicator.d.ts.map +1 -1
- package/lib/UI/Components/LoadingIndicator.js +10 -10
- package/lib/UI/Components/Toast.d.ts +7 -2
- package/lib/UI/Components/Toast.d.ts.map +1 -1
- package/lib/UI/Components/Toast.js +30 -3
- package/package.json +1 -1
- package/src/Client/UI/Components/LoadingIndicator.ts +11 -11
- package/src/Client/UI/Components/Toast.ts +28 -3
package/ReadMe.md
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
# Belin.io Base
|
|
2
|
-
   
|
|
3
3
|
|
|
4
4
|
Base library by [Cédric Belin](https://belin.io), full stack developer,
|
|
5
5
|
implemented in [C#](https://learn.microsoft.com/en-us/dotnet/csharp) and [TypeScript](https://www.typescriptlang.org).
|
|
@@ -4,16 +4,16 @@
|
|
|
4
4
|
export declare class LoadingIndicator extends HTMLElement {
|
|
5
5
|
#private;
|
|
6
6
|
/**
|
|
7
|
-
*
|
|
7
|
+
* Hides the loading indicator.
|
|
8
|
+
* @param options Value indicating whether to force the loading indicator to hide.
|
|
8
9
|
*/
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Stops the loading indicator.
|
|
12
|
-
* @param options Value indicating whether to force the loading indicator to stop.
|
|
13
|
-
*/
|
|
14
|
-
stop(options?: {
|
|
10
|
+
hide(options?: {
|
|
15
11
|
force?: boolean;
|
|
16
12
|
}): void;
|
|
13
|
+
/**
|
|
14
|
+
* Shows the loading indicator.
|
|
15
|
+
*/
|
|
16
|
+
show(): void;
|
|
17
17
|
}
|
|
18
18
|
/**
|
|
19
19
|
* Declaration merging.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingIndicator.d.ts","sourceRoot":"","sources":["../../../src/Client/UI/Components/LoadingIndicator.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,qBAAa,gBAAiB,SAAQ,WAAW;;IAchD
|
|
1
|
+
{"version":3,"file":"LoadingIndicator.d.ts","sourceRoot":"","sources":["../../../src/Client/UI/Components/LoadingIndicator.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,qBAAa,gBAAiB,SAAQ,WAAW;;IAchD;;;OAGG;IACH,IAAI,CAAC,OAAO,GAAE;QAAC,KAAK,CAAC,EAAE,OAAO,CAAA;KAAM,GAAG,IAAI;IAQ3C;;OAEG;IACH,IAAI,IAAI,IAAI;CAIZ;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEd;;OAEG;IACH,UAAU,qBAAqB;QAC9B,mBAAmB,EAAE,gBAAgB,CAAC;KACtC;CACD"}
|
|
@@ -13,21 +13,21 @@ export class LoadingIndicator extends HTMLElement {
|
|
|
13
13
|
customElements.define("loading-indicator", this);
|
|
14
14
|
}
|
|
15
15
|
/**
|
|
16
|
-
*
|
|
16
|
+
* Hides the loading indicator.
|
|
17
|
+
* @param options Value indicating whether to force the loading indicator to hide.
|
|
17
18
|
*/
|
|
18
|
-
|
|
19
|
-
this.#requestCount++;
|
|
20
|
-
this.hidden = false;
|
|
21
|
-
}
|
|
22
|
-
/**
|
|
23
|
-
* Stops the loading indicator.
|
|
24
|
-
* @param options Value indicating whether to force the loading indicator to stop.
|
|
25
|
-
*/
|
|
26
|
-
stop(options = {}) {
|
|
19
|
+
hide(options = {}) {
|
|
27
20
|
this.#requestCount--;
|
|
28
21
|
if (this.#requestCount <= 0 || options.force) {
|
|
29
22
|
this.#requestCount = 0;
|
|
30
23
|
this.hidden = true;
|
|
31
24
|
}
|
|
32
25
|
}
|
|
26
|
+
/**
|
|
27
|
+
* Shows the loading indicator.
|
|
28
|
+
*/
|
|
29
|
+
show() {
|
|
30
|
+
this.#requestCount++;
|
|
31
|
+
this.hidden = false;
|
|
32
|
+
}
|
|
33
33
|
}
|
|
@@ -14,7 +14,7 @@ export declare class Toast extends HTMLElement {
|
|
|
14
14
|
get animation(): boolean;
|
|
15
15
|
set animation(value: boolean);
|
|
16
16
|
/**
|
|
17
|
-
* Value indicating whether to automatically hide
|
|
17
|
+
* Value indicating whether to automatically hide this toast.
|
|
18
18
|
*/
|
|
19
19
|
get autoHide(): boolean;
|
|
20
20
|
set autoHide(value: boolean);
|
|
@@ -38,7 +38,7 @@ export declare class Toast extends HTMLElement {
|
|
|
38
38
|
get culture(): Intl.Locale;
|
|
39
39
|
set culture(value: Intl.Locale);
|
|
40
40
|
/**
|
|
41
|
-
* The delay, in milliseconds, to hide
|
|
41
|
+
* The delay, in milliseconds, to hide this toast.
|
|
42
42
|
*/
|
|
43
43
|
get delay(): number;
|
|
44
44
|
set delay(value: number);
|
|
@@ -51,6 +51,11 @@ export declare class Toast extends HTMLElement {
|
|
|
51
51
|
*/
|
|
52
52
|
get icon(): string;
|
|
53
53
|
set icon(value: string);
|
|
54
|
+
/**
|
|
55
|
+
* Value indicating whether to initially show this toast.
|
|
56
|
+
*/
|
|
57
|
+
get open(): boolean;
|
|
58
|
+
set open(value: boolean);
|
|
54
59
|
/**
|
|
55
60
|
* Method invoked when an attribute has been changed.
|
|
56
61
|
* @param attribute The attribute name.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/Client/UI/Components/Toast.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,OAAO,EAAiB,MAAM,eAAe,CAAC;AAEtD;;GAEG;AACH,qBAAa,KAAM,SAAQ,WAAW;;IAErC;;OAEG;IACH,MAAM,CAAC,QAAQ,CAAC,kBAAkB,
|
|
1
|
+
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/Client/UI/Components/Toast.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,OAAO,EAAiB,MAAM,eAAe,CAAC;AAEtD;;GAEG;AACH,qBAAa,KAAM,SAAQ,WAAW;;IAErC;;OAEG;IACH,MAAM,CAAC,QAAQ,CAAC,kBAAkB,WAAqD;IAkCvF;;OAEG;IACH,IAAI,SAAS,IAAI,OAAO,CAEvB;IACD,IAAI,SAAS,CAAC,KAAK,EAAE,OAAO,EAG3B;IAED;;OAEG;IACH,IAAI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,KAAK,EAAE,OAAO,EAG1B;IAED;;OAEG;IACH,IAAI,OAAO,IAAI,MAAM,CAEpB;IACD,IAAI,OAAO,CAAC,KAAK,EAAE,MAAM,EAExB;IAED;;OAEG;IACH,IAAI,YAAY,CAAC,KAAK,EAAE,gBAAgB,EAEvC;IAED;;OAEG;IACH,IAAI,OAAO,IAAI,OAAO,CAGrB;IACD,IAAI,OAAO,CAAC,KAAK,EAAE,OAAO,EAEzB;IAED;;OAEG;IACH,IAAI,OAAO,IAAI,IAAI,CAAC,MAAM,CAGzB;IACD,IAAI,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,EAE7B;IAED;;OAEG;IACH,IAAI,KAAK,IAAI,MAAM,CAGlB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAEtB;IAED;;OAEG;IACH,IAAI,WAAW,IAAI,MAAM,CAExB;IAED;;OAEG;IACH,IAAI,IAAI,IAAI,MAAM,CAGjB;IACD,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAErB;IAED;;OAEG;IACH,IAAI,IAAI,IAAI,OAAO,CAElB;IACD,IAAI,IAAI,CAAC,KAAK,EAAE,OAAO,EAGtB;IAED;;;;;OAKG;IACH,wBAAwB,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,GAAC,IAAI,GAAG,IAAI;IAoB/F;;OAEG;IACH,iBAAiB,IAAI,IAAI;IASzB;;OAEG;IACH,oBAAoB,IAAI,IAAI;IAK5B;;OAEG;IACH,IAAI,IAAI,IAAI;IAIZ;;OAEG;IACH,IAAI,IAAI,IAAI;CA2EZ;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEd;;OAEG;IACH,UAAU,qBAAqB;QAC9B,cAAc,EAAE,KAAK,CAAC;KACtB;CACD"}
|
|
@@ -7,7 +7,7 @@ export class Toast extends HTMLElement {
|
|
|
7
7
|
/**
|
|
8
8
|
* The list of observed attributes.
|
|
9
9
|
*/
|
|
10
|
-
static observedAttributes = ["caption", "context", "culture", "icon"];
|
|
10
|
+
static observedAttributes = ["caption", "context", "culture", "icon", "open"];
|
|
11
11
|
/**
|
|
12
12
|
* The time units.
|
|
13
13
|
*/
|
|
@@ -47,7 +47,7 @@ export class Toast extends HTMLElement {
|
|
|
47
47
|
this.removeAttribute("animation");
|
|
48
48
|
}
|
|
49
49
|
/**
|
|
50
|
-
* Value indicating whether to automatically hide
|
|
50
|
+
* Value indicating whether to automatically hide this toast.
|
|
51
51
|
*/
|
|
52
52
|
get autoHide() {
|
|
53
53
|
return this.hasAttribute("autohide");
|
|
@@ -94,7 +94,7 @@ export class Toast extends HTMLElement {
|
|
|
94
94
|
this.setAttribute("culture", value.toString());
|
|
95
95
|
}
|
|
96
96
|
/**
|
|
97
|
-
* The delay, in milliseconds, to hide
|
|
97
|
+
* The delay, in milliseconds, to hide this toast.
|
|
98
98
|
*/
|
|
99
99
|
get delay() {
|
|
100
100
|
const value = Number(this.getAttribute("delay"));
|
|
@@ -119,6 +119,18 @@ export class Toast extends HTMLElement {
|
|
|
119
119
|
set icon(value) {
|
|
120
120
|
this.setAttribute("icon", value);
|
|
121
121
|
}
|
|
122
|
+
/**
|
|
123
|
+
* Value indicating whether to initially show this toast.
|
|
124
|
+
*/
|
|
125
|
+
get open() {
|
|
126
|
+
return this.hasAttribute("open");
|
|
127
|
+
}
|
|
128
|
+
set open(value) {
|
|
129
|
+
if (value)
|
|
130
|
+
this.setAttribute("open", "");
|
|
131
|
+
else
|
|
132
|
+
this.removeAttribute("open");
|
|
133
|
+
}
|
|
122
134
|
/**
|
|
123
135
|
* Method invoked when an attribute has been changed.
|
|
124
136
|
* @param attribute The attribute name.
|
|
@@ -140,6 +152,8 @@ export class Toast extends HTMLElement {
|
|
|
140
152
|
case "icon":
|
|
141
153
|
this.#updateIcon(newValue ?? "");
|
|
142
154
|
break;
|
|
155
|
+
case "open":
|
|
156
|
+
this.#updateVisibility();
|
|
143
157
|
// No default
|
|
144
158
|
}
|
|
145
159
|
}
|
|
@@ -223,4 +237,17 @@ export class Toast extends HTMLElement {
|
|
|
223
237
|
#updateIcon(value) {
|
|
224
238
|
this.querySelector(".toast-header .icon").textContent = value.trim() || getIcon(this.context);
|
|
225
239
|
}
|
|
240
|
+
/**
|
|
241
|
+
* Updates the toast visibility.
|
|
242
|
+
*/
|
|
243
|
+
#updateVisibility() {
|
|
244
|
+
const { classList } = this.firstElementChild;
|
|
245
|
+
if (!this.open)
|
|
246
|
+
classList.remove("show");
|
|
247
|
+
else {
|
|
248
|
+
if (this.animation)
|
|
249
|
+
classList.add("fade");
|
|
250
|
+
classList.add("show");
|
|
251
|
+
}
|
|
252
|
+
}
|
|
226
253
|
}
|
package/package.json
CHANGED
|
@@ -16,24 +16,24 @@ export class LoadingIndicator extends HTMLElement {
|
|
|
16
16
|
}
|
|
17
17
|
|
|
18
18
|
/**
|
|
19
|
-
*
|
|
19
|
+
* Hides the loading indicator.
|
|
20
|
+
* @param options Value indicating whether to force the loading indicator to hide.
|
|
20
21
|
*/
|
|
21
|
-
|
|
22
|
-
this.#requestCount++;
|
|
23
|
-
this.hidden = false;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
/**
|
|
27
|
-
* Stops the loading indicator.
|
|
28
|
-
* @param options Value indicating whether to force the loading indicator to stop.
|
|
29
|
-
*/
|
|
30
|
-
stop(options: {force?: boolean} = {}): void {
|
|
22
|
+
hide(options: {force?: boolean} = {}): void {
|
|
31
23
|
this.#requestCount--;
|
|
32
24
|
if (this.#requestCount <= 0 || options.force) {
|
|
33
25
|
this.#requestCount = 0;
|
|
34
26
|
this.hidden = true;
|
|
35
27
|
}
|
|
36
28
|
}
|
|
29
|
+
|
|
30
|
+
/**
|
|
31
|
+
* Shows the loading indicator.
|
|
32
|
+
*/
|
|
33
|
+
show(): void {
|
|
34
|
+
this.#requestCount++;
|
|
35
|
+
this.hidden = false;
|
|
36
|
+
}
|
|
37
37
|
}
|
|
38
38
|
|
|
39
39
|
/**
|
|
@@ -9,7 +9,7 @@ export class Toast extends HTMLElement {
|
|
|
9
9
|
/**
|
|
10
10
|
* The list of observed attributes.
|
|
11
11
|
*/
|
|
12
|
-
static readonly observedAttributes = ["caption", "context", "culture", "icon"];
|
|
12
|
+
static readonly observedAttributes = ["caption", "context", "culture", "icon", "open"];
|
|
13
13
|
|
|
14
14
|
/**
|
|
15
15
|
* The time units.
|
|
@@ -55,7 +55,7 @@ export class Toast extends HTMLElement {
|
|
|
55
55
|
}
|
|
56
56
|
|
|
57
57
|
/**
|
|
58
|
-
* Value indicating whether to automatically hide
|
|
58
|
+
* Value indicating whether to automatically hide this toast.
|
|
59
59
|
*/
|
|
60
60
|
get autoHide(): boolean {
|
|
61
61
|
return this.hasAttribute("autohide");
|
|
@@ -105,7 +105,7 @@ export class Toast extends HTMLElement {
|
|
|
105
105
|
}
|
|
106
106
|
|
|
107
107
|
/**
|
|
108
|
-
* The delay, in milliseconds, to hide
|
|
108
|
+
* The delay, in milliseconds, to hide this toast.
|
|
109
109
|
*/
|
|
110
110
|
get delay(): number {
|
|
111
111
|
const value = Number(this.getAttribute("delay"));
|
|
@@ -133,6 +133,17 @@ export class Toast extends HTMLElement {
|
|
|
133
133
|
this.setAttribute("icon", value);
|
|
134
134
|
}
|
|
135
135
|
|
|
136
|
+
/**
|
|
137
|
+
* Value indicating whether to initially show this toast.
|
|
138
|
+
*/
|
|
139
|
+
get open(): boolean {
|
|
140
|
+
return this.hasAttribute("open");
|
|
141
|
+
}
|
|
142
|
+
set open(value: boolean) {
|
|
143
|
+
if (value) this.setAttribute("open", "");
|
|
144
|
+
else this.removeAttribute("open");
|
|
145
|
+
}
|
|
146
|
+
|
|
136
147
|
/**
|
|
137
148
|
* Method invoked when an attribute has been changed.
|
|
138
149
|
* @param attribute The attribute name.
|
|
@@ -153,6 +164,8 @@ export class Toast extends HTMLElement {
|
|
|
153
164
|
case "icon":
|
|
154
165
|
this.#updateIcon(newValue ?? "");
|
|
155
166
|
break;
|
|
167
|
+
case "open":
|
|
168
|
+
this.#updateVisibility();
|
|
156
169
|
// No default
|
|
157
170
|
}
|
|
158
171
|
}
|
|
@@ -250,6 +263,18 @@ export class Toast extends HTMLElement {
|
|
|
250
263
|
#updateIcon(value: string): void {
|
|
251
264
|
this.querySelector(".toast-header .icon")!.textContent = value.trim() || getIcon(this.context);
|
|
252
265
|
}
|
|
266
|
+
|
|
267
|
+
/**
|
|
268
|
+
* Updates the toast visibility.
|
|
269
|
+
*/
|
|
270
|
+
#updateVisibility(): void {
|
|
271
|
+
const {classList} = this.firstElementChild!;
|
|
272
|
+
if (!this.open) classList.remove("show");
|
|
273
|
+
else {
|
|
274
|
+
if (this.animation) classList.add("fade");
|
|
275
|
+
classList.add("show");
|
|
276
|
+
}
|
|
277
|
+
}
|
|
253
278
|
}
|
|
254
279
|
|
|
255
280
|
/**
|