@supersoniks/concorde 1.1.42 → 1.1.43

package/core/_types/types.d.ts

@@ -0,0 +1,26 @@
+import DataBindObserver from "@supersoniks/concorde/core/utils/DataBindObserver";
+import Publisher from "../utils/PublisherProxy";
+export interface ConcordeWindow extends Window {
+    SonicPublisherManager: any;
+    SonicDataBindObserver: DataBindObserver;
+    PasswordCredential: new (options: {
+        id: string;
+        password: string;
+    }) => any;
+    grecaptcha: {
+        ready: (handler: () => void) => void;
+        execute: (key: string, options: {
+            action: string;
+        }) => Promise<string>;
+    };
+    SonicModal: any;
+    SonicToast: any;
+    [key: string]: any;
+}
+export declare type CoreJSType = Object | string | number | boolean | BigInt | undefined | null | symbol;
+export declare type PublisherContentType = CoreJSType & {
+    __value?: any;
+} & Record<string, any>;
+export declare type PublisherInterface<T extends PublisherContentType = any> = Publisher<T> & any;
+export declare type TypeAndRecordOfType<U> = U & Record<string, U>;
+export declare type HTMLFormControl = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;

package/core/_types/types.js

@@ -0,0 +1 @@
+export {};

package/core/components/functional/date/date.d.ts

@@ -1,5 +1,11 @@
 import { LitElement, nothing } from "lit";
-declare const SonicDate_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
+declare type DateTimeFormatPartExtended = {
+    hidden?: boolean;
+    source?: string;
+    type: string;
+    value: string;
+};
+declare const SonicDate_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<any>) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
 export declare class SonicDate extends SonicDate_base {
     pageLanguage: string;
     private duAu;
@@ -18,18 +24,20 @@ export declare class SonicDate extends SonicDate_base {
     year: "numeric" | "2-digit";
     month: "numeric" | "2-digit" | "narrow" | "short" | "long";
     day: "numeric" | "2-digit";
-    weekday: "narrow" | "short" | "long";
-    hour: "numeric" | "2-digit" | null;
-    minute: "numeric" | "2-digit" | null;
+    weekday: "narrow" | "short" | "long" | "hidden";
+    hour: "numeric" | "2-digit" | "hidden";
+    minute: "numeric" | "2-digit" | "hidden";
     language: string;
     renderIf: boolean;
+    now: boolean;
     private startDateObject;
     private endDateObject;
     connectedCallback(): void;
     /**
      * Retourne un tableau des différentes parties de la date en fonction des options données, de la date de début et de fin.
      */
-    getDatesParts(start_date: number, end_date: number, options: any): any;
+    getDatesParts(start_date: number, end_date: number, options: Intl.DateTimeFormatOptions): DateTimeFormatPartExtended[];
+    dateStringToSeconds(dateString: string): number;
     render(): import("lit-html").TemplateResult<1> | typeof nothing;
 }
 export {};

package/core/components/functional/date/date.js

@@ -4,12 +4,12 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { html, LitElement, nothing } from "lit";
-import { customElement, property } from "lit/decorators.js";
 import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
-import HTML from "@supersoniks/concorde/core/utils/HTML";
-import Format from "@supersoniks/concorde/core/utils/Format";
 import TemplatesContainer from "@supersoniks/concorde/core/mixins/TemplatesContainer";
+import Format from "@supersoniks/concorde/core/utils/Format";
+import HTML from "@supersoniks/concorde/core/utils/HTML";
+import { html, LitElement, nothing } from "lit";
+import { customElement, property } from "lit/decorators.js";
 const tagName = "sonic-date";
 let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement)) {
     constructor() {
@@ -23,7 +23,7 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
         this.date_string = null;
         this.start_date_string = null;
         this.end_date_string = null;
-        this.start_date = new Date().getTime() / 1000;
+        this.start_date = 0;
         this.end_date = 0;
         this.era = "";
         this.year = "numeric";
@@ -34,6 +34,7 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
         this.minute = "2-digit";
         this.language = "";
         this.renderIf = true;
+        this.now = false;
         // @property({type:String}) second: 'numeric' | '2-digit'= "2-digit"
         // @property({ type: String }) hour12: boolean = false;
         this.startDateObject = new Date();
@@ -49,7 +50,8 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
         this.requestUpdate();
     }
     connectedCallback() {
-        this.wording_billet_periode_validite = "Du %s au %s";
+        if (!this.hasAttribute("wording_billet_periode_validite"))
+            this.wording_billet_periode_validite = "Du %s au %s";
         this.pageLanguage = HTML.getLanguage();
         super.connectedCallback();
     }
@@ -59,31 +61,29 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
     getDatesParts(start_date, end_date, options) {
         let start = this.startDateObject;
         start.setTime(start_date * 1000);
-        let parts = null;
+        let parts = [];
         if (end_date > 0) {
             let end = this.endDateObject;
             end.setTime(end_date * 1000);
-            if (start.toJSON().substring(0, 10) != end.toJSON().substring(0, 10)) {
+            //
+            //on affiche pas l'heure si les dates sont les mêmes
+            const isSameDay = start.toDateString() == end.toDateString();
+            if (!isSameDay) {
                 delete options.hour;
                 delete options.minute;
             }
             let format = new Intl.DateTimeFormat(this.language || this.pageLanguage, options);
             parts = format.formatRangeToParts(start, end);
+            //En mode  design on cache les ","
             if (this.designMode) {
-                for (let part of parts) {
-                    if (part.type == "literal" && this.designMode && part.value.trim() == ",") {
-                        part.hidden = true;
-                    }
-                }
+                parts.forEach((part) => (part.hidden = part.value.trim() == ","));
             }
-            const isSameDay = start.getFullYear() == end.getFullYear() && start.getMonth() == end.getMonth() && start.getDate() == end.getDate();
-            if (parts.some((part) => part.source == "endRange") && !isSameDay) {
-                for (let part of parts) {
-                    if (part.type == "literal" && part.source == "shared" && part.value.trim().length > 0 && !isSameDay) {
-                        part.value = " " + this.duAu[1] + " ";
-                        part.type = "to";
-                        break;
-                    }
+            //on affiche du au uniquement si on a deux dates différentes
+            if (!isSameDay) {
+                let to = parts.find((part) => part.type == "literal" && part.source == "shared" && part.value.trim().length > 0);
+                if (to) {
+                    to.value = " " + this.duAu[1] + " ";
+                    to.type = "to";
                 }
                 if (!this.designMode)
                     parts.unshift({ type: "from", value: this.duAu[0] + " ", source: "shared" });
@@ -94,39 +94,55 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
             parts = format.formatToParts(start);
         }
         parts[0].value = Format.ucFirst(parts[0].value);
-        parts = parts.filter((p) => p.hidden !== true);
-        return parts;
+        return parts.filter((p) => p.hidden !== true);
+    }
+    dateStringToSeconds(dateString) {
+        return new Date(dateString).getTime() / 1000;
     }
     render() {
         if (!this.renderIf)
             return nothing;
+        /* *
+         * Normalisation en fonction des valeurs de dates passées        *
+         * */
         if (this.date_string)
-            this.date = new Date(this.date_string).getTime() / 1000;
+            this.date = this.dateStringToSeconds(this.date_string);
         if (this.date)
             this.start_date = this.date;
         if (this.start_date_string)
-            this.start_date = new Date(this.start_date_string).getTime() / 1000;
+            this.start_date = this.dateStringToSeconds(this.start_date_string);
         if (this.end_date_string)
-            this.end_date = new Date(this.end_date_string).getTime() / 1000;
+            this.end_date = this.dateStringToSeconds(this.end_date_string);
+        if (!this.start_date && !this.now && !this.end_date)
+            return nothing;
+        if (!this.start_date)
+            this.start_date = Date.now() / 1000;
         if (this.end_date > 0 && this.end_date < this.start_date) {
             const copy = this.start_date;
             this.start_date = this.end_date;
             this.end_date = copy;
         }
+        /* *
+         * gestion des options d'affichage des dates
+         * */
         let options = {
-            weekday: this.weekday,
             year: this.year,
             month: this.month,
             day: this.day,
         };
-        if (this.hour)
+        if (this.weekday !== "hidden")
+            options.weekday = this.weekday;
+        if (this.hour !== "hidden")
             options.hour = this.hour;
-        if (this.minute)
+        if (this.minute !== "hidden")
             options.minute = this.minute;
         if (this.era)
             options.era = this.era;
         if (this.time_zone)
             options.timeZone = this.time_zone;
+        /**
+         * On récupère les différentes partie affichées en vu de l'injection dans le template
+         */
         let parts = this.getDatesParts(this.start_date, this.end_date, options);
         return html `${parts.map((part) => {
             let template = this.templateParts[part.type];
@@ -195,6 +211,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], SonicDate.prototype, "renderIf", void 0);
+__decorate([
+    property({ type: Boolean })
+], SonicDate.prototype, "now", void 0);
 SonicDate = __decorate([
     customElement(tagName)
 ], SonicDate);

package/core/components/functional/example/example.d.ts

@@ -1,5 +1,5 @@
 import { LitElement } from "lit";
-declare const SonicComponent_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface) & typeof LitElement;
+declare const SonicComponent_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<any>) & typeof LitElement;
 export declare class SonicComponent extends SonicComponent_base {
     text: string;
     render(): import("lit-html").TemplateResult<1>;

package/core/components/functional/example/example.js

@@ -14,7 +14,7 @@ let SonicComponent = class SonicComponent extends Subscriber(LitElement) {
         this.text = "Example";
     }
     render() {
-        return html `${this.text}`;
+        return html `<div>${this.text}</div>`;
     }
 };
 __decorate([

package/core/components/functional/fetch/fetch.d.ts

@@ -1,7 +1,8 @@
+/// <reference types="node" />
 import { LitElement } from "lit";
 declare const Fetch_base: {
     new (...args: any[]): {
-        api: import("../../../utils/api").default | null;
+        api: import("../../../utils/api").default<any, any> | null;
         key: String;
         isFirstLoad: boolean;
         isLoading: boolean;
@@ -10,8 +11,11 @@ declare const Fetch_base: {
         isFetchEnabled: boolean;
         _endPoint: string;
         endPoint: string;
+        requestId: number;
+        refetchEveryMs: number;
+        refetchTimeOutId?: NodeJS.Timeout | undefined;
         _fetchData(): Promise<void>;
-        onInvalidate: any;
+        onInvalidate?: (() => void) | undefined;
         disconnectedCallback(): void;
         connectedCallback(): void;
         firstUpdated(): void;
@@ -28,6 +32,7 @@ declare const Fetch_base: {
         debug: HTMLElement | null;
         defferedDebug: boolean | null;
         displayContents: boolean;
+        shadowRoot?: ShadowRoot | undefined;
         dispatchEvent(event: Event): void;
         setAttribute(name: string, value: string): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
@@ -39,7 +44,39 @@ declare const Fetch_base: {
         getAttribute(name: string): string;
         hasAttribute(attributeName: String): boolean;
     };
-} & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface) & typeof LitElement;
+} & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<any>) & typeof LitElement;
+/**
+ * ###Fetch charge un contenu via un appel d'api web.
+ * Extends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)
+ *
+ * #### Configuration via les attributs
+ *
+ * | nom          | sur quelle balise | Description | Exemple de valeur | défaut / requis |
+ * | -------------------------------------------------------------------------------------- |
+ * | serviceURL   |Fetcher ou un de ses parents | URL de base des services. | http://la-billetterie.net/api/v2 | domain du site |
+ * | endpoint   |Fetcher | point d'accès d'un service | user/2 | valeur de l'attribut dataProvider |
+ * | 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* |
+ * | headersDataProvider  |Fetcher ou un de ses parents | Identifiant d'un publisher qui stock les données destinées à être envoyées en entêtes de la requetes | MyCoockieHEaders | null |
+ * | key  |Fetcher  | extrait une sous propriété de la donnée chargée avant de l'assignée à son publisher | ma.data | null |
+ *
+ * *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}`*
+ 
+ #### Intégration auto de basic auth (pour tester une api qui nécessite une authentification)
+ 
+ * 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.
+
+ * | nom           | sur quelle balise | Description | Exemple de valeur | défaut / requis |
+ * | -------------------------------------------------------------------------------------- |
+ * | userName      | Fetcher ou un de ses parents | Nom de l'utilisateur | DjuDju | null |
+ * | password      | Fetcher ou un de ses parents | mot de passe | pom_549 | null |
+ * | tokenProvider | Fetcher ou un de ses parents | point d'accès du service fournissant le token | auth | null |
+ * | token | Fetcher ou un de ses parents | A fournir à la place des autres attributs si on le possède | q<d34gb | null |
+ 
+ #### Autres choses utiles
+ * * L'attribut *noLoader* du composant permet de désactiver l'affichage du loader par défaut.
+ * * On peut appeler la methode invalidate() sur le publisher associé au  composant pour declencher le rechargement des données.
+ * * endPoint est une propriété réctive, par conséquent, sa modification, manuelle via template ou data binbding provoque la mise à jour du contenu.
+ */
 export declare class Fetch extends Fetch_base {
     static styles: import("lit").CSSResult[];
     render(): import("lit-html").TemplateResult<1>;

package/core/components/functional/fetch/fetch.js

@@ -8,6 +8,7 @@ import { css, html, LitElement } from "lit";
 import { customElement } from "lit/decorators.js";
 import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
 import Fetcher from "@supersoniks/concorde/core/mixins/Fetcher";
+const tagName = "sonic-fetch"; // For Astro.build
 /**
  * ###Fetch charge un contenu via un appel d'api web.
  * Extends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)
@@ -19,6 +20,7 @@ import Fetcher from "@supersoniks/concorde/core/mixins/Fetcher";
  * | serviceURL   |Fetcher ou un de ses parents | URL de base des services. | http://la-billetterie.net/api/v2 | domain du site |
  * | endpoint   |Fetcher | point d'accès d'un service | user/2 | valeur de l'attribut dataProvider |
  * | 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* |
+ * | headersDataProvider  |Fetcher ou un de ses parents | Identifiant d'un publisher qui stock les données destinées à être envoyées en entêtes de la requetes | MyCoockieHEaders | null |
  * | key  |Fetcher  | extrait une sous propriété de la donnée chargée avant de l'assignée à son publisher | ma.data | null |
  *
  * *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}`*
@@ -39,7 +41,6 @@ import Fetcher from "@supersoniks/concorde/core/mixins/Fetcher";
  * * On peut appeler la methode invalidate() sur le publisher associé au  composant pour declencher le rechargement des données.
  * * endPoint est une propriété réctive, par conséquent, sa modification, manuelle via template ou data binbding provoque la mise à jour du contenu.
  */
-const tagName = "sonic-fetch"; // For Astro.build
 let Fetch = class Fetch extends Fetcher(Subscriber(LitElement)) {
     render() {
         return html `<slot></slot>`;
@@ -56,8 +57,3 @@ Fetch = __decorate([
     customElement(tagName)
 ], Fetch);
 export { Fetch };
-//Ajout pour custom-elements-manifesy pour storybook notamment
-try {
-    customElements.define(tagName, Fetch);
-}
-catch (e) { }

package/core/components/functional/functional.d.ts

@@ -11,3 +11,5 @@ import "./states/states";
 import "./sonic-scope/sonic-scope";
 import "./example/example";
 import "./sdui/sdui";
+import "./mix/mix";
+import "./value/value";

package/core/components/functional/functional.js

@@ -11,3 +11,5 @@ import "./states/states";
 import "./sonic-scope/sonic-scope";
 import "./example/example";
 import "./sdui/sdui";
+import "./mix/mix";
+import "./value/value";

package/core/components/functional/if/if.d.ts

@@ -1,4 +1,7 @@
 import { LitElement, nothing } from "lit";
+/**
+ * Le composant *sonic-if* affiche son contenu dans le slot principal si sa propriété .condition est évaluée à true
+ */
 export declare class SonicIF extends LitElement {
     static styles: import("lit").CSSResult;
     /**

package/core/components/functional/if/if.js

@@ -6,10 +6,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { css, html, LitElement, nothing } from "lit";
 import { customElement, property } from "lit/decorators.js";
+const tagName = "sonic-if"; // For Astro.build
 /**
  * Le composant *sonic-if* affiche son contenu dans le slot principal si sa propriété .condition est évaluée à true
  */
-const tagName = "sonic-if"; // For Astro.build
 let SonicIF = class SonicIF extends LitElement {
     constructor() {
         super(...arguments);
@@ -21,14 +21,13 @@ let SonicIF = class SonicIF extends LitElement {
     render() {
         if (!this.condition)
             return nothing;
-        return html `
-      <slot></slot>
-    `;
+        return html ` <slot></slot> `;
     }
 };
-SonicIF.styles = css `:host{
-    display:contents;
-  }
+SonicIF.styles = css `
+    :host {
+      display: contents;
+    }
   `;
 __decorate([
     property({ type: Boolean })
@@ -37,8 +36,3 @@ SonicIF = __decorate([
     customElement(tagName)
 ], SonicIF);
 export { SonicIF };
-//Ajout pour custom-elements-manifesy pour storybook notamment
-try {
-    customElements.define(tagName, SonicIF);
-}
-catch (e) { }

package/core/components/functional/if/if.test.d.ts

@@ -0,0 +1 @@
+import "./if";

package/core/components/functional/if/if.test.js

@@ -0,0 +1,44 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { expect } from "@jest/globals";
+import TestUtils from "@supersoniks/concorde/test-utils/TestUtils";
+import "./if";
+function create() {
+    return TestUtils.bootstrap(`<sonic-if>Some Content</sonic-if>`)[0];
+}
+test("shows ''Some Content'' condition = true set by property accessor", () => __awaiter(void 0, void 0, void 0, function* () {
+    const elt = create();
+    elt.condition = true;
+    yield elt.updated();
+    const renderedText = elt.shadowRoot.children[0].assignedNodes()[0].textContent;
+    expect(renderedText).toBe("Some Content");
+}));
+test("shows nothing condition = false set by property accessor", () => __awaiter(void 0, void 0, void 0, function* () {
+    const elt = create();
+    elt.condition = false;
+    yield elt.updated();
+    const children = Array.from(elt.shadowRoot.children).filter((elt) => elt.nodeName.toLowerCase() != "style");
+    const length = children.length;
+    expect(length).toBe(0);
+}));
+test("shows ''Some Content'' condition = true set by attribute", () => __awaiter(void 0, void 0, void 0, function* () {
+    const elt = create();
+    elt.setAttribute("condition", "");
+    yield elt.updated();
+    const renderedText = elt.shadowRoot.children[0].assignedNodes()[0].textContent;
+    expect(renderedText).toBe("Some Content");
+}));
+test("shows nothing condition not set", () => __awaiter(void 0, void 0, void 0, function* () {
+    const elt = create();
+    yield elt.updated();
+    const children = Array.from(elt.shadowRoot.children).filter((elt) => elt.nodeName.toLowerCase() != "style");
+    const length = children.length;
+    expect(length).toBe(0);
+}));

package/core/components/functional/list/list.d.ts

@@ -1,9 +1,13 @@
+/// <reference types="node" />
 import { LitElement } from "lit";
 import "@supersoniks/concorde/core/components/ui/loader/loader";
 import "@supersoniks/concorde/core/components/functional/subscriber/subscriber";
+import { DirectiveResult } from "lit/directive";
+import { TemplateContentDirective } from "lit/directives/template-content.js";
+import { TemplateResult } from "lit";
 declare const List_base: {
     new (...args: any[]): {
-        api: import("../../../utils/api").default | null;
+        api: import("../../../utils/api").default<any, any> | null;
         key: String;
         isFirstLoad: boolean;
         isLoading: boolean;
@@ -12,8 +16,11 @@ declare const List_base: {
         isFetchEnabled: boolean;
         _endPoint: string;
         endPoint: string;
+        requestId: number;
+        refetchEveryMs: number;
+        refetchTimeOutId?: NodeJS.Timeout | undefined;
         _fetchData(): Promise<void>;
-        onInvalidate: any;
+        onInvalidate?: (() => void) | undefined;
         disconnectedCallback(): void;
         connectedCallback(): void;
         firstUpdated(): void;
@@ -30,6 +37,7 @@ declare const List_base: {
         debug: HTMLElement | null;
         defferedDebug: boolean | null;
         displayContents: boolean;
+        shadowRoot?: ShadowRoot | undefined;
         dispatchEvent(event: Event): void;
         setAttribute(name: string, value: string): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
@@ -41,10 +49,26 @@ declare const List_base: {
         getAttribute(name: string): string;
         hasAttribute(attributeName: String): boolean;
     };
-} & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
+} & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<any>) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
+/**
+ *  ### List boucle sur sa propriété "props" et crée des éléments a partir des données en bouclant également sur ses templates.
+ *
+ * Extends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)
+ *
+ * * Si le composant possède un attribut *fetch*, il charge un contenu via un appel d'api web.<br>
+ * Voir [fetcher](./?path=/docs/core-components-functional-fetch--basic) pour la configuration des autres attributs.
+ * * Chaque élément créé est englobé dans un objet [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page).<br>
+ *  Un dataProvider y est associé a l'adresse suivante *dataProvider-de-la-liste$/*index-de-la-ligne-courante*
+ *  Les données de la ligne sont donc disponible pour les élements internes (subscribers, data-binding)
+ *  * Lors du chargement un objet loader inline est affiché.
+ *  * Si le résultat de la requête est un objet, il est imbriqué dans un tableau pour garantir le fonctionnement.<br>
+ * 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.
+ * * 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.
+ * * On peut appler la methode invalidate() sur son publishe pour declencher le rechargement des données
+ * *
+ */
 export declare class List extends List_base {
-    static styles: import("lit").CSSResult[];
-    itemPropertyMap: Object | null;
+    itemPropertyMap?: Object;
     /**
      * La propriété templateKey contient le nom de la propriété qui sera utilisé pour identifier le template à utiliser dans la donnée de la ligne.
      * Par exemple si templateIdentifier = "name" et que la donnée de la ligne est {name: "myTemplate" ... }, alors le template possédant l'attribut data-value="myTemplate" sera utilisé.
@@ -55,9 +79,9 @@ export declare class List extends List_base {
      */
     idKey: string;
     connectedCallback(): void;
-    renderLoadingState(): import("lit-html/directive").DirectiveResult<typeof import("lit-html/directives/template-content").TemplateContentDirective>;
-    renderNoResultState(): import("lit-html").TemplateResult<1>;
+    renderLoadingState(): DirectiveResult<typeof TemplateContentDirective> | TemplateResult;
+    renderNoResultState(): TemplateResult<1>;
     formatProps(): any;
-    render(): import("lit-html/directive").DirectiveResult<typeof import("lit-html/directives/template-content").TemplateContentDirective>;
+    render(): DirectiveResult<typeof TemplateContentDirective>;
 }
 export {};