@supersoniks/concorde 1.1.9 → 1.1.12
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/core/components/functional/configuration/configuration.d.ts +5 -0
- package/core/components/functional/configuration/configuration.js +21 -0
- package/core/components/functional/date/date.js +3 -2
- package/core/components/functional/fetch/fetch.d.ts +32 -11
- package/core/components/functional/fetch/fetch.js +28 -12
- package/core/components/functional/functional.d.ts +1 -0
- package/core/components/functional/functional.js +1 -0
- package/core/components/functional/list/list.d.ts +15 -7
- package/core/components/functional/list/list.js +50 -20
- package/core/components/functional/sonic-scope/sonic-scope.d.ts +5 -0
- package/core/components/functional/sonic-scope/sonic-scope.js +20 -0
- package/core/components/functional/states/states.js +0 -2
- package/core/components/functional/submit/submit.d.ts +2 -0
- package/core/components/functional/submit/submit.js +23 -8
- package/core/components/ui/alert/alert.js +4 -5
- package/core/components/ui/badge/badge.js +0 -1
- package/core/components/ui/button/button.d.ts +11 -3
- package/core/components/ui/button/button.js +20 -17
- package/core/components/ui/card/card-footer.d.ts +5 -0
- package/core/components/ui/card/card-footer.js +27 -0
- package/core/components/ui/card/card-header-descripton.d.ts +5 -0
- package/core/components/ui/card/card-header-descripton.js +33 -0
- package/core/components/ui/card/card-header.d.ts +8 -0
- package/core/components/ui/card/card-header.js +67 -0
- package/core/components/ui/card/card-main.d.ts +5 -0
- package/core/components/ui/card/card-main.js +29 -0
- package/core/components/ui/card/card.d.ts +12 -0
- package/core/components/ui/card/card.js +90 -0
- package/core/components/ui/form/checkbox/checkbox.d.ts +4 -4
- package/core/components/ui/form/checkbox/checkbox.js +3 -4
- package/core/components/ui/form/css/form-control.js +2 -0
- package/core/components/ui/form/fieldset/fieldset.js +1 -1
- package/core/components/ui/form/fieldset/legend-description.d.ts +5 -0
- package/core/components/ui/form/fieldset/legend-description.js +35 -0
- package/core/components/ui/form/fieldset/legend.d.ts +4 -5
- package/core/components/ui/form/fieldset/legend.js +21 -25
- package/core/components/ui/form/input/input.d.ts +3 -3
- package/core/components/ui/form/input/input.js +3 -3
- package/core/components/ui/form/textarea/textarea.d.ts +2 -2
- package/core/components/ui/form/textarea/textarea.js +2 -2
- package/core/components/ui/icon/icon.d.ts +16 -4
- package/core/components/ui/icon/icon.js +52 -6
- package/core/components/ui/icon/icons.d.ts +3 -2
- package/core/components/ui/icon/icons.js +78 -7
- package/core/components/ui/icon/icons.json +1 -1
- package/core/components/ui/link/link.d.ts +10 -1
- package/core/components/ui/link/link.js +21 -2
- package/core/components/ui/menu/menu.d.ts +11 -5
- package/core/components/ui/menu/menu.js +81 -35
- package/core/components/ui/pop/pop.js +5 -2
- package/core/components/ui/progress/progress.d.ts +9 -0
- package/core/components/ui/progress/progress.js +138 -0
- package/core/components/ui/table/table-caption.d.ts +5 -0
- package/core/components/ui/table/table-caption.js +24 -0
- package/core/components/ui/table/table-tbody.d.ts +5 -0
- package/core/components/ui/table/table-tbody.js +37 -0
- package/core/components/ui/table/table-td.d.ts +7 -0
- package/core/components/ui/table/table-td.js +45 -0
- package/core/components/ui/table/table-tfoot.d.ts +5 -0
- package/core/components/ui/table/table-tfoot.js +23 -0
- package/core/components/ui/table/table-th.d.ts +6 -0
- package/core/components/ui/table/table-th.js +43 -0
- package/core/components/ui/table/table-thead.d.ts +5 -0
- package/core/components/ui/table/table-thead.js +24 -0
- package/core/components/ui/table/table-tr.d.ts +5 -0
- package/core/components/ui/table/table-tr.js +24 -0
- package/core/components/ui/table/table.d.ts +16 -0
- package/core/components/ui/table/table.js +88 -0
- package/core/components/ui/tabs/tabs.d.ts +1 -0
- package/core/components/ui/tabs/tabs.js +7 -3
- package/core/components/ui/theme/theme-collection/core-variables.js +1 -1
- package/core/components/ui/theme/theme-collection/dark.js +3 -2
- package/core/components/ui/theme/theme-collection/light.js +1 -0
- package/core/components/ui/tooltip/tooltip.d.ts +1 -1
- package/core/components/ui/tooltip/tooltip.js +4 -4
- package/core/components/ui/ui.d.ts +3 -3
- package/core/components/ui/ui.js +5 -3
- package/core/mixins/Fetcher.d.ts +11 -9
- package/core/mixins/Fetcher.js +22 -4
- package/core/mixins/FormCheckable.d.ts +2 -2
- package/core/mixins/FormInput.d.ts +2 -2
- package/core/mixins/Subscriber.d.ts +2 -2
- package/core/mixins/Subscriber.js +0 -15
- package/core/utils/Electron.d.ts +3 -0
- package/core/utils/Electron.js +8 -0
- package/core/utils/LocationHandler.d.ts +2 -1
- package/core/utils/LocationHandler.js +25 -2
- package/core/utils/Objects.d.ts +2 -1
- package/core/utils/Objects.js +8 -2
- package/core/utils/PublisherProxy.mjs +42 -12
- package/core/utils/api.js +1 -1
- package/package.json +40 -1
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import { html, LitElement } from "lit";
|
|
8
|
+
import { customElement } from "lit/decorators.js";
|
|
9
|
+
let SonicConfiguration = class SonicConfiguration extends LitElement {
|
|
10
|
+
constructor() {
|
|
11
|
+
super(...arguments);
|
|
12
|
+
this.isSonicConfig = true;
|
|
13
|
+
}
|
|
14
|
+
render() {
|
|
15
|
+
return html `<slot></slot>`;
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
SonicConfiguration = __decorate([
|
|
19
|
+
customElement("sonic-configuration")
|
|
20
|
+
], SonicConfiguration);
|
|
21
|
+
export { SonicConfiguration };
|
|
@@ -71,9 +71,10 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
|
|
|
71
71
|
}
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
|
-
|
|
74
|
+
const isSameDay = start.getFullYear() == end.getFullYear() && start.getMonth() == end.getMonth() && start.getDate() == end.getDate();
|
|
75
|
+
if (parts.some((part) => part.source == "endRange") && !isSameDay) {
|
|
75
76
|
for (let part of parts) {
|
|
76
|
-
if (part.type == "literal" && part.source == "shared" && part.value.trim().length > 0) {
|
|
77
|
+
if (part.type == "literal" && part.source == "shared" && part.value.trim().length > 0 && !isSameDay) {
|
|
77
78
|
part.value = " " + this.duAu[1] + " ";
|
|
78
79
|
part.type = "to";
|
|
79
80
|
break;
|
|
@@ -8,6 +8,8 @@ declare const Fetch_base: {
|
|
|
8
8
|
iObserver: IntersectionObserver | null;
|
|
9
9
|
isDefaultLoaderEnabled: boolean;
|
|
10
10
|
isFetchEnabled: boolean;
|
|
11
|
+
_endPoint: string;
|
|
12
|
+
endPoint: string;
|
|
11
13
|
_fetchData(): Promise<void>;
|
|
12
14
|
onInvalidate: any;
|
|
13
15
|
disconnectedCallback(): void;
|
|
@@ -15,15 +17,15 @@ declare const Fetch_base: {
|
|
|
15
17
|
firstUpdated(): void;
|
|
16
18
|
onIntersection(entries: IntersectionObserverEntry[]): void;
|
|
17
19
|
props: any;
|
|
20
|
+
isConnected: boolean;
|
|
18
21
|
getAncestorAttributeValue(attributeName: string): string;
|
|
19
22
|
hasAncestorAttribute(attributeName: string): boolean;
|
|
20
23
|
querySelectorAll(selector: string): NodeListOf<Element>;
|
|
21
24
|
publisher: any;
|
|
22
|
-
dataProvider:
|
|
25
|
+
dataProvider: string | null;
|
|
23
26
|
noShadowDom: string | null;
|
|
24
27
|
debug: HTMLElement | null;
|
|
25
28
|
defferedDebug: boolean | null;
|
|
26
|
-
makeShadow(props: Record<string, any>, value: any): any;
|
|
27
29
|
dispatchEvent(event: Event): void;
|
|
28
30
|
setAttribute(name: string, value: string): void;
|
|
29
31
|
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
|
|
@@ -38,17 +40,36 @@ declare const Fetch_base: {
|
|
|
38
40
|
} & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface) & typeof LitElement;
|
|
39
41
|
/**
|
|
40
42
|
* ###Fetch charge un contenu via un appel d'api web.
|
|
41
|
-
*
|
|
42
|
-
*
|
|
43
|
-
*
|
|
44
|
-
*
|
|
45
|
-
*
|
|
46
|
-
*
|
|
47
|
-
*
|
|
48
|
-
*
|
|
43
|
+
* Extends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)
|
|
44
|
+
*
|
|
45
|
+
* #### Configuration via les attributs
|
|
46
|
+
*
|
|
47
|
+
* | nom | sur quelle balise | Description | Exemple de valeur | défaut / requis |
|
|
48
|
+
* | -------------------------------------------------------------------------------------- |
|
|
49
|
+
* | serviceURL |Fetcher ou un de ses parents | URL de base des services. | http://la-billetterie.net/api/v2 | domain du site |
|
|
50
|
+
* | endpoint |Fetcher | point d'accès d'un service | user/2 | valeur de l'attribut dataProvider |
|
|
51
|
+
* | dataProvider |Fetcher ou un de ses parents | Identifiant d'un publisher qui stock les données, voir [subscriber](./?path=/docs/miscallenous-🔔-subscriber--page). | billetterie/user/2 | *REQUIS* |
|
|
52
|
+
* | key |Fetcher | extrait une sous propriété de la donnée chargée avant de l'assignée à son publisher | ma.data | null |
|
|
53
|
+
*
|
|
54
|
+
* *Si la données est `{ma:{data:{a:1,b:2}}}` et `key="ma.data"`, la données disponible dans le composant sera `{a:1, b:2}`*
|
|
55
|
+
|
|
56
|
+
#### Intégration auto de basic auth (pour tester une api qui nécessite une authentification)
|
|
57
|
+
|
|
58
|
+
* Fetch utilise le service pour générer le token et l'ajoute au header de l'appel qui récupère les données.
|
|
59
|
+
|
|
60
|
+
* | nom | sur quelle balise | Description | Exemple de valeur | défaut / requis |
|
|
61
|
+
* | -------------------------------------------------------------------------------------- |
|
|
62
|
+
* | userName | Fetcher ou un de ses parents | Nom de l'utilisateur | DjuDju | null |
|
|
63
|
+
* | password | Fetcher ou un de ses parents | mot de passe | pom_549 | null |
|
|
64
|
+
* | tokenProvider | Fetcher ou un de ses parents | point d'accès du service fournissant le token | auth | null |
|
|
65
|
+
* | token | Fetcher ou un de ses parents | A fournir à la place des autres attributs si on le possède | q<d34gb | null |
|
|
66
|
+
|
|
67
|
+
#### Autres choses utiles
|
|
68
|
+
* * L'attribut *noLoader* du composant permet de désactiver l'affichage du loader par défaut.
|
|
69
|
+
* * On peut appeler la methode invalidate() sur le publisher associé au composant pour declencher le rechargement des données.
|
|
70
|
+
* * endPoint est une propriété réctive, par conséquent, sa modification, manuelle via template ou data binbding provoque la mise à jour du contenu.
|
|
49
71
|
*/
|
|
50
72
|
export declare class Fetch extends Fetch_base {
|
|
51
|
-
noAutofill: boolean;
|
|
52
73
|
static styles: import("lit").CSSResult[];
|
|
53
74
|
render(): import("lit-html").TemplateResult<1>;
|
|
54
75
|
}
|
|
@@ -10,20 +10,36 @@ import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
|
|
|
10
10
|
import Fetcher from "@supersoniks/concorde/core/mixins/Fetcher";
|
|
11
11
|
/**
|
|
12
12
|
* ###Fetch charge un contenu via un appel d'api web.
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
*
|
|
20
|
-
*
|
|
13
|
+
* Extends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)
|
|
14
|
+
*
|
|
15
|
+
* #### Configuration via les attributs
|
|
16
|
+
*
|
|
17
|
+
* | nom | sur quelle balise | Description | Exemple de valeur | défaut / requis |
|
|
18
|
+
* | -------------------------------------------------------------------------------------- |
|
|
19
|
+
* | serviceURL |Fetcher ou un de ses parents | URL de base des services. | http://la-billetterie.net/api/v2 | domain du site |
|
|
20
|
+
* | endpoint |Fetcher | point d'accès d'un service | user/2 | valeur de l'attribut dataProvider |
|
|
21
|
+
* | dataProvider |Fetcher ou un de ses parents | Identifiant d'un publisher qui stock les données, voir [subscriber](./?path=/docs/miscallenous-🔔-subscriber--page). | billetterie/user/2 | *REQUIS* |
|
|
22
|
+
* | key |Fetcher | extrait une sous propriété de la donnée chargée avant de l'assignée à son publisher | ma.data | null |
|
|
23
|
+
*
|
|
24
|
+
* *Si la données est `{ma:{data:{a:1,b:2}}}` et `key="ma.data"`, la données disponible dans le composant sera `{a:1, b:2}`*
|
|
25
|
+
|
|
26
|
+
#### Intégration auto de basic auth (pour tester une api qui nécessite une authentification)
|
|
27
|
+
|
|
28
|
+
* Fetch utilise le service pour générer le token et l'ajoute au header de l'appel qui récupère les données.
|
|
29
|
+
|
|
30
|
+
* | nom | sur quelle balise | Description | Exemple de valeur | défaut / requis |
|
|
31
|
+
* | -------------------------------------------------------------------------------------- |
|
|
32
|
+
* | userName | Fetcher ou un de ses parents | Nom de l'utilisateur | DjuDju | null |
|
|
33
|
+
* | password | Fetcher ou un de ses parents | mot de passe | pom_549 | null |
|
|
34
|
+
* | tokenProvider | Fetcher ou un de ses parents | point d'accès du service fournissant le token | auth | null |
|
|
35
|
+
* | token | Fetcher ou un de ses parents | A fournir à la place des autres attributs si on le possède | q<d34gb | null |
|
|
36
|
+
|
|
37
|
+
#### Autres choses utiles
|
|
38
|
+
* * L'attribut *noLoader* du composant permet de désactiver l'affichage du loader par défaut.
|
|
39
|
+
* * On peut appeler la methode invalidate() sur le publisher associé au composant pour declencher le rechargement des données.
|
|
40
|
+
* * endPoint est une propriété réctive, par conséquent, sa modification, manuelle via template ou data binbding provoque la mise à jour du contenu.
|
|
21
41
|
*/
|
|
22
42
|
let Fetch = class Fetch extends Fetcher(Subscriber(LitElement)) {
|
|
23
|
-
constructor() {
|
|
24
|
-
super(...arguments);
|
|
25
|
-
this.noAutofill = true;
|
|
26
|
-
}
|
|
27
43
|
render() {
|
|
28
44
|
return html `<slot></slot>`;
|
|
29
45
|
}
|
|
@@ -10,6 +10,8 @@ declare const List_base: {
|
|
|
10
10
|
iObserver: IntersectionObserver | null;
|
|
11
11
|
isDefaultLoaderEnabled: boolean;
|
|
12
12
|
isFetchEnabled: boolean;
|
|
13
|
+
_endPoint: string;
|
|
14
|
+
endPoint: string;
|
|
13
15
|
_fetchData(): Promise<void>;
|
|
14
16
|
onInvalidate: any;
|
|
15
17
|
disconnectedCallback(): void;
|
|
@@ -17,15 +19,15 @@ declare const List_base: {
|
|
|
17
19
|
firstUpdated(): void;
|
|
18
20
|
onIntersection(entries: IntersectionObserverEntry[]): void;
|
|
19
21
|
props: any;
|
|
22
|
+
isConnected: boolean;
|
|
20
23
|
getAncestorAttributeValue(attributeName: string): string;
|
|
21
24
|
hasAncestorAttribute(attributeName: string): boolean;
|
|
22
25
|
querySelectorAll(selector: string): NodeListOf<Element>;
|
|
23
26
|
publisher: any;
|
|
24
|
-
dataProvider:
|
|
27
|
+
dataProvider: string | null;
|
|
25
28
|
noShadowDom: string | null;
|
|
26
29
|
debug: HTMLElement | null;
|
|
27
30
|
defferedDebug: boolean | null;
|
|
28
|
-
makeShadow(props: Record<string, any>, value: any): any;
|
|
29
31
|
dispatchEvent(event: Event): void;
|
|
30
32
|
setAttribute(name: string, value: string): void;
|
|
31
33
|
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
|
|
@@ -41,16 +43,19 @@ declare const List_base: {
|
|
|
41
43
|
/**
|
|
42
44
|
* ### List boucle sur sa propriété "props" et crée des éléments a partir des données en bouclant également sur ses templates.
|
|
43
45
|
*
|
|
44
|
-
|
|
45
|
-
*
|
|
46
|
-
*
|
|
47
|
-
*
|
|
46
|
+
* Extends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)
|
|
47
|
+
*
|
|
48
|
+
* * Si le composant possède un attribut *fetch*, il charge un contenu via un appel d'api web.<br>
|
|
49
|
+
* Voir [fetcher](./?path=/docs/core-components-functional-fetch--basic) pour la configuration des autres attributs.
|
|
50
|
+
* * Chaque élément créé est englobé dans un objet [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page).<br>
|
|
51
|
+
* Un dataProvider y est associé a l'adresse suivante *dataProvider-de-la-liste$/*index-de-la-ligne-courante*
|
|
48
52
|
* Les données de la ligne sont donc disponible pour les élements internes (subscribers, data-binding)
|
|
49
53
|
* * Lors du chargement un objet loader inline est affiché.
|
|
50
|
-
* * Si le résultat de la requête est un objet, il est imbriqué dans un tableau pour garantir le fonctionnement
|
|
54
|
+
* * Si le résultat de la requête est un objet, il est imbriqué dans un tableau pour garantir le fonctionnement.<br>
|
|
51
55
|
* Cependant, si l'attribut `extractValues` est présent, les valeurs des propriétés de l'objet sont mises dans dans un tableau pour le rendu.
|
|
52
56
|
* * La propriété _key_ est ajoutés à la donnée de chaque item. Elle contient l'index dans le cas d'un liste simple ou la clés associée à la valeur si `extractValues` est définit.
|
|
53
57
|
* * On peut appler la methode invalidate() sur son publishe pour declencher le rechargement des données
|
|
58
|
+
* *
|
|
54
59
|
*/
|
|
55
60
|
export declare class List extends List_base {
|
|
56
61
|
static styles: import("lit").CSSResult[];
|
|
@@ -65,6 +70,9 @@ export declare class List extends List_base {
|
|
|
65
70
|
*/
|
|
66
71
|
idKey: string;
|
|
67
72
|
connectedCallback(): void;
|
|
73
|
+
renderLoadingState(): import("lit-html/directive").DirectiveResult<typeof import("lit-html/directives/template-content").TemplateContentDirective>;
|
|
74
|
+
renderNoResultState(): import("lit-html").TemplateResult<1>;
|
|
75
|
+
formatProps(): any;
|
|
68
76
|
render(): import("lit-html/directive").DirectiveResult<typeof import("lit-html/directives/template-content").TemplateContentDirective>;
|
|
69
77
|
}
|
|
70
78
|
export {};
|
|
@@ -18,16 +18,19 @@ import TemplatesContainer from "@supersoniks/concorde/core/mixins/TemplatesConta
|
|
|
18
18
|
/**
|
|
19
19
|
* ### List boucle sur sa propriété "props" et crée des éléments a partir des données en bouclant également sur ses templates.
|
|
20
20
|
*
|
|
21
|
-
|
|
22
|
-
*
|
|
23
|
-
*
|
|
24
|
-
*
|
|
21
|
+
* Extends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)
|
|
22
|
+
*
|
|
23
|
+
* * Si le composant possède un attribut *fetch*, il charge un contenu via un appel d'api web.<br>
|
|
24
|
+
* Voir [fetcher](./?path=/docs/core-components-functional-fetch--basic) pour la configuration des autres attributs.
|
|
25
|
+
* * Chaque élément créé est englobé dans un objet [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page).<br>
|
|
26
|
+
* Un dataProvider y est associé a l'adresse suivante *dataProvider-de-la-liste$/*index-de-la-ligne-courante*
|
|
25
27
|
* Les données de la ligne sont donc disponible pour les élements internes (subscribers, data-binding)
|
|
26
28
|
* * Lors du chargement un objet loader inline est affiché.
|
|
27
|
-
* * Si le résultat de la requête est un objet, il est imbriqué dans un tableau pour garantir le fonctionnement
|
|
29
|
+
* * Si le résultat de la requête est un objet, il est imbriqué dans un tableau pour garantir le fonctionnement.<br>
|
|
28
30
|
* Cependant, si l'attribut `extractValues` est présent, les valeurs des propriétés de l'objet sont mises dans dans un tableau pour le rendu.
|
|
29
31
|
* * La propriété _key_ est ajoutés à la donnée de chaque item. Elle contient l'index dans le cas d'un liste simple ou la clés associée à la valeur si `extractValues` est définit.
|
|
30
32
|
* * On peut appler la methode invalidate() sur son publishe pour declencher le rechargement des données
|
|
33
|
+
* *
|
|
31
34
|
*/
|
|
32
35
|
let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))) {
|
|
33
36
|
constructor() {
|
|
@@ -52,22 +55,19 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
|
|
|
52
55
|
this.isLoading = true;
|
|
53
56
|
super.connectedCallback();
|
|
54
57
|
}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
58
|
+
renderLoadingState() {
|
|
59
|
+
return this.templateParts["skeleton"]
|
|
60
|
+
? templateContent(this.templateParts["skeleton"])
|
|
61
|
+
: html `<sonic-loader mode="inline"></sonic-loader>`;
|
|
62
|
+
}
|
|
63
|
+
renderNoResultState() {
|
|
64
|
+
return html `
|
|
65
|
+
<div class="sonic-no-result-container">
|
|
63
66
|
<sonic-icon prefix="iconoir" name="emoji-think-left" size="lg"></sonic-icon
|
|
64
67
|
><span class="sonic-no-result-text">${this.props}</span>
|
|
65
68
|
</div>`;
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
if (!Objects.isObject(this.props)) {
|
|
69
|
-
return html `<div></div>`;
|
|
70
|
-
}
|
|
69
|
+
}
|
|
70
|
+
formatProps() {
|
|
71
71
|
let props = this.props;
|
|
72
72
|
let extractValues = this.hasAttribute("extractValues");
|
|
73
73
|
//si props n'est pas un tableau on l'adapte
|
|
@@ -79,13 +79,43 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
|
|
|
79
79
|
props = [props];
|
|
80
80
|
}
|
|
81
81
|
}
|
|
82
|
-
|
|
82
|
+
return props;
|
|
83
|
+
}
|
|
84
|
+
render() {
|
|
85
|
+
/**
|
|
86
|
+
* Loading
|
|
87
|
+
*/
|
|
88
|
+
const isLoadingState = this.isLoading && !Array.isArray(this.props);
|
|
89
|
+
if (isLoadingState)
|
|
90
|
+
return this.renderLoadingState();
|
|
91
|
+
/**
|
|
92
|
+
* Si props est une string on considère qu'il n'y a pas de résultats
|
|
93
|
+
*/
|
|
94
|
+
const isString = typeof this.props === "string";
|
|
95
|
+
if (isString)
|
|
96
|
+
return this.renderNoResultState();
|
|
97
|
+
/**
|
|
98
|
+
* si props mal formé ou null on retourne une div vide (nécessaire pour le lazyload)
|
|
99
|
+
*/
|
|
100
|
+
const propsIsBaddlyFormatted = !Objects.isObject(this.props);
|
|
101
|
+
if (propsIsBaddlyFormatted)
|
|
102
|
+
return html `<div></div>`;
|
|
103
|
+
/**
|
|
104
|
+
* On format les props pour les rendre compatibles avec le fonctionnement du rendu en fonction du paramétrage du composant (cf : "extractValues" )
|
|
105
|
+
*/
|
|
106
|
+
let props = this.formatProps();
|
|
107
|
+
/**
|
|
108
|
+
* On peut définir un template spécifique si le résultat est un tableau vide
|
|
109
|
+
*/
|
|
83
110
|
if (props.length == 0 && this.templateParts["no-item"]) {
|
|
84
111
|
return templateContent(this.templateParts["no-item"]);
|
|
85
112
|
}
|
|
86
|
-
|
|
113
|
+
/**
|
|
114
|
+
* Rendu des lignes
|
|
115
|
+
* */
|
|
87
116
|
let templateCount = this.templateList.length;
|
|
88
117
|
let counter = -1;
|
|
118
|
+
let extractValues = this.hasAttribute("extractValues");
|
|
89
119
|
return html `
|
|
90
120
|
${repeat(props, (item, index) => item[this.idKey] || index, (item, index) => {
|
|
91
121
|
let templatePartName = item[this.templateKey];
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import { html, LitElement } from "lit";
|
|
8
|
+
import { customElement } from "lit/decorators.js";
|
|
9
|
+
let SonicScope = class SonicScope extends LitElement {
|
|
10
|
+
createRenderRoot() {
|
|
11
|
+
return this;
|
|
12
|
+
}
|
|
13
|
+
render() {
|
|
14
|
+
return html `<slot></slot>`;
|
|
15
|
+
}
|
|
16
|
+
};
|
|
17
|
+
SonicScope = __decorate([
|
|
18
|
+
customElement("sonic-scope")
|
|
19
|
+
], SonicScope);
|
|
20
|
+
export { SonicScope };
|
|
@@ -37,7 +37,6 @@ let SonicStates = class SonicStates extends Subscriber(TemplatesContainer(LitEle
|
|
|
37
37
|
}
|
|
38
38
|
connectedCallback() {
|
|
39
39
|
super.connectedCallback();
|
|
40
|
-
console.log("BB");
|
|
41
40
|
if (this.hasAttribute("data-path")) {
|
|
42
41
|
this.statePath = this.getAttribute("data-path");
|
|
43
42
|
}
|
|
@@ -65,7 +64,6 @@ let SonicStates = class SonicStates extends Subscriber(TemplatesContainer(LitEle
|
|
|
65
64
|
if ((!Array.isArray(state) && Objects.isObject(state)) || state === undefined) {
|
|
66
65
|
state = "";
|
|
67
66
|
}
|
|
68
|
-
console.log(state);
|
|
69
67
|
for (let t of this.templatePartsList) {
|
|
70
68
|
let path = t.getAttribute(this.templateValueAttribute);
|
|
71
69
|
let stateToMatch = state;
|
|
@@ -15,7 +15,9 @@ declare const Submit_base: (new (...args: any[]) => import("@supersoniks/concord
|
|
|
15
15
|
*/
|
|
16
16
|
export declare class Submit extends Submit_base {
|
|
17
17
|
static styles: import("lit").CSSResult;
|
|
18
|
+
submitResultKey: string | null;
|
|
18
19
|
disabled: boolean;
|
|
20
|
+
endPoint: string | null;
|
|
19
21
|
api: API | null;
|
|
20
22
|
connectedCallback(): void;
|
|
21
23
|
submit(): Promise<void>;
|
|
@@ -20,6 +20,7 @@ import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
|
|
|
20
20
|
import API from "@supersoniks/concorde/core/utils/api";
|
|
21
21
|
import { Loader } from "@supersoniks/concorde/core/components/ui/loader/loader";
|
|
22
22
|
import { css, html, LitElement } from "lit";
|
|
23
|
+
import Objects from "@supersoniks/concorde/core/utils/Objects";
|
|
23
24
|
/**
|
|
24
25
|
* ###L'élément submit permet d'envoyer des données en rest
|
|
25
26
|
* * Les données envoyées sont celles présentes dans le publisher dont l'adresse est renseignée via l'attribut *formDataProvider*.
|
|
@@ -34,17 +35,21 @@ import { css, html, LitElement } from "lit";
|
|
|
34
35
|
let Submit = class Submit extends Subscriber(LitElement) {
|
|
35
36
|
constructor() {
|
|
36
37
|
super(...arguments);
|
|
38
|
+
this.submitResultKey = null;
|
|
37
39
|
this.disabled = false;
|
|
40
|
+
this.endPoint = null;
|
|
38
41
|
this.api = null;
|
|
39
42
|
}
|
|
40
43
|
connectedCallback() {
|
|
41
|
-
if (this.hasAttribute("onClick"))
|
|
44
|
+
if (this.hasAttribute("onClick")) {
|
|
42
45
|
this.addEventListener("click", () => this.submit());
|
|
43
|
-
|
|
46
|
+
}
|
|
47
|
+
if (this.hasAttribute("onEnterKey")) {
|
|
44
48
|
this.addEventListener("keydown", (e) => {
|
|
45
49
|
if (e.key === "Enter")
|
|
46
50
|
this.submit();
|
|
47
51
|
});
|
|
52
|
+
}
|
|
48
53
|
super.connectedCallback();
|
|
49
54
|
this.api = new API(this.getApiConfiguration());
|
|
50
55
|
}
|
|
@@ -55,20 +60,21 @@ let Submit = class Submit extends Subscriber(LitElement) {
|
|
|
55
60
|
let method = ((_a = this.getAttribute("method")) === null || _a === void 0 ? void 0 : _a.toLocaleLowerCase()) || "post";
|
|
56
61
|
let postData = PublisherManager.getInstance().get(this.getAncestorAttributeValue("formDataProvider")).get();
|
|
57
62
|
let result = null;
|
|
58
|
-
let
|
|
63
|
+
let dataProvider = this.getAncestorAttributeValue("dataProvider");
|
|
64
|
+
let endPoint = this.endPoint || dataProvider;
|
|
59
65
|
Loader.show();
|
|
60
66
|
switch (method) {
|
|
61
67
|
case "put":
|
|
62
|
-
result = yield ((_b = this.api) === null || _b === void 0 ? void 0 : _b.put(
|
|
68
|
+
result = yield ((_b = this.api) === null || _b === void 0 ? void 0 : _b.put(endPoint, postData));
|
|
63
69
|
break;
|
|
64
70
|
case "delete":
|
|
65
|
-
result = yield ((_c = this.api) === null || _c === void 0 ? void 0 : _c.delete(
|
|
71
|
+
result = yield ((_c = this.api) === null || _c === void 0 ? void 0 : _c.delete(endPoint, postData));
|
|
66
72
|
break;
|
|
67
73
|
case "get":
|
|
68
|
-
result = yield ((_d = this.api) === null || _d === void 0 ? void 0 : _d.get(
|
|
74
|
+
result = yield ((_d = this.api) === null || _d === void 0 ? void 0 : _d.get(endPoint));
|
|
69
75
|
break;
|
|
70
76
|
default:
|
|
71
|
-
result = yield ((_e = this.api) === null || _e === void 0 ? void 0 : _e.post(
|
|
77
|
+
result = yield ((_e = this.api) === null || _e === void 0 ? void 0 : _e.post(endPoint, postData));
|
|
72
78
|
break;
|
|
73
79
|
}
|
|
74
80
|
Loader.hide();
|
|
@@ -76,7 +82,10 @@ let Submit = class Submit extends Subscriber(LitElement) {
|
|
|
76
82
|
result = { messages: [{ content: "Network Error", status: "error" }] };
|
|
77
83
|
let clearedDataProvider = this.getAncestorAttributeValue("clearedDataOnSuccess");
|
|
78
84
|
if (clearedDataProvider) {
|
|
79
|
-
clearedDataProvider.split(" ").forEach(dataProvider => PublisherManager.
|
|
85
|
+
clearedDataProvider.split(" ").forEach(dataProvider => PublisherManager.get(dataProvider).set({}));
|
|
86
|
+
}
|
|
87
|
+
if (this.submitResultKey) {
|
|
88
|
+
result = Objects.traverse(result, this.submitResultKey.split("."), true);
|
|
80
89
|
}
|
|
81
90
|
PublisherManager.getInstance().get(this.getAncestorAttributeValue("submitResultDataProvider")).set(result);
|
|
82
91
|
this.publisher.disabled = false;
|
|
@@ -93,9 +102,15 @@ Submit.styles = css `
|
|
|
93
102
|
user-select: none;
|
|
94
103
|
}
|
|
95
104
|
`;
|
|
105
|
+
__decorate([
|
|
106
|
+
property({ type: String })
|
|
107
|
+
], Submit.prototype, "submitResultKey", void 0);
|
|
96
108
|
__decorate([
|
|
97
109
|
property({ type: Boolean })
|
|
98
110
|
], Submit.prototype, "disabled", void 0);
|
|
111
|
+
__decorate([
|
|
112
|
+
property({ type: String })
|
|
113
|
+
], Submit.prototype, "endPoint", void 0);
|
|
99
114
|
Submit = __decorate([
|
|
100
115
|
customElement("sonic-submit")
|
|
101
116
|
], Submit);
|
|
@@ -73,17 +73,16 @@ Alert.styles = [
|
|
|
73
73
|
font-weight: var(--sc-alert-title-fw);
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
:host([status="warning"])
|
|
76
|
+
:host([status="warning"]) {
|
|
77
77
|
--sc-alert-color: var(--sc-warning);
|
|
78
78
|
}
|
|
79
|
-
|
|
80
|
-
:host([status="error"]) .alert {
|
|
79
|
+
:host([status="error"]) {
|
|
81
80
|
--sc-alert-color: var(--sc-danger);
|
|
82
81
|
}
|
|
83
|
-
:host([status="info"])
|
|
82
|
+
:host([status="info"]) {
|
|
84
83
|
--sc-alert-color: var(--sc-info);
|
|
85
84
|
}
|
|
86
|
-
:host([status="success"])
|
|
85
|
+
:host([status="success"]) {
|
|
87
86
|
--sc-alert-color: var(--sc-success);
|
|
88
87
|
}
|
|
89
88
|
|
|
@@ -27,15 +27,15 @@ declare const Button_base: {
|
|
|
27
27
|
required: true | null;
|
|
28
28
|
formDataProvider: string;
|
|
29
29
|
props: any;
|
|
30
|
+
isConnected: boolean;
|
|
30
31
|
getAncestorAttributeValue(attributeName: string): string;
|
|
31
32
|
hasAncestorAttribute(attributeName: string): boolean;
|
|
32
33
|
querySelectorAll(selector: string): NodeListOf<Element>;
|
|
33
34
|
publisher: any;
|
|
34
|
-
dataProvider:
|
|
35
|
+
dataProvider: string | null;
|
|
35
36
|
noShadowDom: string | null;
|
|
36
37
|
debug: HTMLElement | null;
|
|
37
38
|
defferedDebug: boolean | null;
|
|
38
|
-
makeShadow(props: Record<string, any>, value: any): any;
|
|
39
39
|
dispatchEvent(event: Event): void;
|
|
40
40
|
setAttribute(name: string, value: string): void;
|
|
41
41
|
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
|
|
@@ -95,6 +95,13 @@ export declare class Button extends Button_base {
|
|
|
95
95
|
* Propriété min-width du bouton
|
|
96
96
|
*/
|
|
97
97
|
minWidth: string;
|
|
98
|
+
/**
|
|
99
|
+
* mode d'activation du bouton :
|
|
100
|
+
* - strict : l'url courante match exactement avec le href du bouton
|
|
101
|
+
* - partial : l'url courante match à gauche avec le href du bouton
|
|
102
|
+
* - disabled : aucune activation / désactivation
|
|
103
|
+
*/
|
|
104
|
+
autoActive: "strict" | "partial" | "disabled";
|
|
98
105
|
/**
|
|
99
106
|
* Laisse apparaitre un loader en remplacement du contenu du bouton.
|
|
100
107
|
* Désactive également le clic sur le bouton
|
|
@@ -114,12 +121,13 @@ export declare class Button extends Button_base {
|
|
|
114
121
|
private _href;
|
|
115
122
|
set href(value: string);
|
|
116
123
|
get href(): string;
|
|
124
|
+
goBack: string | null;
|
|
117
125
|
/**
|
|
118
126
|
* Si présent on passe en mode pushstate
|
|
119
127
|
*/
|
|
120
128
|
pushState: null;
|
|
121
129
|
active: boolean;
|
|
122
|
-
|
|
130
|
+
handleNavigation(e: Event): void;
|
|
123
131
|
handleChange(e?: any): void;
|
|
124
132
|
connectedCallback(): void;
|
|
125
133
|
setCheckedValue(checked: true | null): void;
|