@supersoniks/concorde 2.0.2 → 2.0.3

package/core/mixins/Subscriber.js

@@ -4,29 +4,14 @@ 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 API from "@supersoniks/concorde/core/utils/api";
 import DataBindObserver from "@supersoniks/concorde/core/utils/DataBindObserver";
 import HTML from "@supersoniks/concorde/core/utils/HTML";
 import Objects from "@supersoniks/concorde/core/utils/Objects";
 import { PublisherManager } from "@supersoniks/concorde/core/utils/PublisherProxy";
 import { property } from "lit/decorators.js";
+import WordingDirective from "../directives/Wording";
 let keepDebugOnMouseOut = false;
 let debugs = new Set();
-//Pour référence
-// export class Subscribable extends HTMLElement {
-//   constructor() {
-//     super();
-//   }
-//   requestUpdate(name?: PropertyKey, oldValue?: unknown, options?: PropertyDeclaration): void{name;oldValue;options;}
-//   protected updated(changedProperties: Map<string, PropertyDeclaration>): void {
-//     changedProperties;
-//   }
-//   connectedCallback(): void {}
-//   disconnectedCallback(): void {}
-//   protected createRenderRoot(): Element | ShadowRoot {
-//     return this.shadowRoot || this;
-//   }
-// }
 const Subscriber = (superClass, type) => {
     /**
      * La mixin Subscriber permet lier un composant à un publisher.
@@ -88,26 +73,6 @@ const Subscriber = (superClass, type) => {
             };
             args;
         }
-        onConnected(callback) {
-            if (!this.connectedCallbackCalls)
-                this.connectedCallbackCalls = new Set();
-            this.connectedCallbackCalls.add(callback);
-        }
-        onDisconnected(callback) {
-            if (!this.disconnectedCallbackCalls)
-                this.disconnectedCallbackCalls = new Set();
-            this.disconnectedCallbackCalls.add(callback);
-        }
-        offConnected(callback) {
-            if (!this.connectedCallbackCalls)
-                this.connectedCallbackCalls = new Set();
-            this.connectedCallbackCalls.delete(callback);
-        }
-        offDisconnected(callback) {
-            if (!this.disconnectedCallbackCalls)
-                this.disconnectedCallbackCalls = new Set();
-            this.disconnectedCallbackCalls.delete(callback);
-        }
         /**
          * va de parent en parent pour trouver un attribut
          * @param attributeName nom de l'attribut
@@ -157,7 +122,8 @@ const Subscriber = (superClass, type) => {
             if (this.hasAttribute("lazyRendering")) {
                 const options = {
                     root: null,
-                    rootMargin: Math.max(window.innerWidth, window.innerHeight) + "px",
+                    // rootMargin: Math.max(window.innerWidth, window.innerHeight) + "px",
+                    threshold: 0.9,
                 };
                 let firstView = true;
                 const iObserver = new IntersectionObserver((entries) => {
@@ -180,18 +146,15 @@ const Subscriber = (superClass, type) => {
                 this.addDebugger();
             }
             super.connectedCallback();
-            this.connectedCallbackCalls?.forEach((cb) => cb(this));
         }
         disconnectedCallback() {
-            this.disconnectedCallbackCalls?.forEach((cb) => cb(this));
             this.removeDebugger();
             super.disconnectedCallback();
             if (this.publisher) {
                 this.publisher.stopTemplateFilling(this);
                 this.publisher.offInternalMutation(this.requestUpdate);
             }
-            if (this.wordingPublisher)
-                this.wordingPublisher.stopTemplateFilling(this);
+            WordingDirective.publisher.stopTemplateFilling(this);
             if (this.onAssign)
                 this.publisher?.offAssign(this.onAssign);
         }
@@ -262,61 +225,22 @@ const Subscriber = (superClass, type) => {
          * A voir si on le bouge dans un utilitaire
          */
         getApiConfiguration() {
-            const token = this.getAncestorAttributeValue("token");
-            const addHTTPResponse = this.getAncestorAttributeValue("addHTTPResponse") != null;
-            const serviceURL = this.getAncestorAttributeValue("serviceURL");
-            let userName = null;
-            let password = null;
-            const tokenProvider = this.getAncestorAttributeValue("tokenProvider");
-            const authToken = this.getAncestorAttributeValue("eventsApiToken");
-            if (!token) {
-                userName = this.getAncestorAttributeValue("userName");
-                password = this.getAncestorAttributeValue("password");
-            }
-            const credentials = this.getAncestorAttributeValue("credentials") || undefined;
-            const cache = (this.getAttribute("cache") || undefined) || undefined;
-            return { serviceURL, token, userName, password, authToken, tokenProvider, addHTTPResponse, credentials, cache };
+            return HTML.getApiConfiguration(this);
         }
+        /**
+         * Initialise le remplisage automatique des traductions / du wording
+         * Un publisher spécifique est créé pour le composant à l'adresse "sonic-wording"
+         * Le composant recherche la valeur de l'attribute "wordingProvider" que contient le point d'accès à l'api de traduction / libellés
+         * Il utilise ce service et le publisher créé pour remplir automatiquement toutes les propriétés préfixées avec "wording_".
+         */
         async initWording() {
-            let hasWording = false;
             const propNames = Object.getOwnPropertyNames(this.constructor.prototype);
             for (const p of propNames) {
                 if (p.indexOf("wording_") == 0) {
-                    hasWording = true;
-                    break;
-                }
-            }
-            if (!hasWording)
-                return;
-            const publisher = PublisherManager.get("sonic-wording", { localStorageMode: "enabled" });
-            await PublisherManager.getInstance().isLocalStrorageReady;
-            const wordingProvider = this.getAncestorAttributeValue("wordingProvider");
-            const api = new API(this.getApiConfiguration());
-            if (wordingProvider) {
-                const wordings = [];
-                const wordingsAll = [];
-                const publisherValue = publisher.get();
-                for (const p of propNames) {
-                    if (p.indexOf("wording_") == 0) {
-                        const p8 = p.substring(8);
-                        if (!publisherValue[p]) {
-                            publisher[p] = "...";
-                            wordings.push(p8);
-                        }
-                        wordingsAll.push(p8);
-                    }
-                }
-                if (wordings.length > 0) {
-                    const calledURL = wordingProvider + "?labels[]=" + wordings.join("&labels[]=");
-                    // const result = (await api.post(wordingProvider, {labels: wordings})) as Record<string, string>;
-                    const result = (await api.get(calledURL));
-                    for (const elt in result) {
-                        publisher["wording_" + elt] = result[elt];
-                    }
+                    WordingDirective.callApi(this, p.substring(8));
                 }
-                publisher.startTemplateFilling(this);
-                this.wordingPublisher = publisher;
             }
+            WordingDirective.publisher.startTemplateFilling(this);
         }
         /**
          *

package/core/mixins/TemplatesContainer.js

@@ -45,6 +45,15 @@ const TemplatesContainer = (superClass) => {
                     this.templateParts[t.getAttribute(this.templateValueAttribute)] = t;
                     this.templatePartsList.push(t);
                 }
+                if (t.hasAttribute("skeleton")) {
+                    this.templateParts["skeleton"] = t;
+                }
+                if (t.hasAttribute("no-result")) {
+                    this.templateParts["no-result"] = t;
+                }
+                if (t.hasAttribute("no-item")) {
+                    this.templateParts["no-item"] = t;
+                }
             }
             this.templateList = templates.filter((t) => !t.getAttribute("data-value"));
             if (this.templateList.length == 0)

package/core/utils/Format.d.ts

@@ -3,6 +3,7 @@ declare class Format {
      * Passe le premier caractère de la chaine en majuscule
      */
     static ucFirst(str: string): string;
+    static minutesDuration(minutes: number, locale?: string, unitDisplay?: "long" | "short" | "narrow" | undefined): string;
     /**
      * Retourne le résultat de l'évaluation de la chaine fournie
      */

package/core/utils/Format.js

@@ -1,3 +1,4 @@
+import HTML from "@supersoniks/concorde/core/utils/HTML";
 class Format {
     /**
      * Passe le premier caractère de la chaine en majuscule
@@ -7,6 +8,21 @@ class Format {
             return str;
         return str.charAt(0).toUpperCase() + str.substring(1);
     }
+    static minutesDuration(minutes, locale = "", unitDisplay = "long") {
+        if (!locale)
+            locale = HTML.getLanguage();
+        const divMod = (n, m) => [Math.floor(n / m), n % m];
+        function timeUnitFormatter(locale, unit, unitDisplay) {
+            return Intl.NumberFormat(locale, { style: "unit", unit, unitDisplay }).format;
+        }
+        const [hrs, mins] = divMod(minutes, 60);
+        const list = [];
+        if (hrs)
+            list.push(timeUnitFormatter(locale, "hour", unitDisplay)(hrs));
+        if (mins)
+            list.push(timeUnitFormatter(locale, "minute", unitDisplay)(mins));
+        return new Intl.ListFormat(locale, { style: "long", type: "conjunction" }).format(list);
+    }
     /**
      * Retourne le résultat de l'évaluation de la chaine fournie
      */

package/core/utils/HTML.d.ts

@@ -1,16 +1,29 @@
 export type SearchableDomElement = HTMLElement | ShadowRoot;
+import { APIConfiguration } from "./api";
 declare class HTML {
     /**
      * retourne la langue de la page courante telle que défini via l'attribut lang de la balise html
      */
     static getLanguage(): string;
     static getCookies(): Record<string, string>;
+    static everyAncestors(node: SearchableDomElement, callback: (node: SearchableDomElement) => boolean): void;
     /**
      * Va de parent en parent en partant de node pour trouver un attribut
      * @param attributeName nom de l'attribut
      * @returns valeur de l'attribut ou null si l'attribut n'est pas trouvé
      */
     static getAncestorAttributeValue(node: SearchableDomElement | null, attributeName: string): string | null;
+    /**
+     * Petite fonction utilitaire pour retourner la configuration a passer à l'utilitaire API
+     * Utilisée pour la configuration du wording / de la traduction ainsi que par le mixin fetcher par exemple
+     */
+    static getApiConfiguration(node: SearchableDomElement): APIConfiguration;
+    /**
+     * Va de parent en parent en partant de node pour trouver un attribut
+     * @param attributeName nom de l'attribut
+     * @returns valeur de l'attribut ou null si l'attribut n'est pas trouvé
+     */
+    static getClosestElement(node: SearchableDomElement, selector: string): SearchableDomElement | null;
     /**
      * Va de parent en parent en partant de node pour trouver un attribut
      * @param attributeName nom de l'attribut

package/core/utils/HTML.js

@@ -3,7 +3,9 @@ class HTML {
      * retourne la langue de la page courante telle que défini via l'attribut lang de la balise html
      */
     static getLanguage() {
-        return document.getElementsByTagName("html")[0].getAttribute("lang");
+        const documentLanguage = document.documentElement.lang;
+        const selectedLanguage = localStorage.getItem("SonicSelectedLanguage");
+        return selectedLanguage || documentLanguage;
     }
     static getCookies() {
         return document.cookie.split(";").reduce((previous, current) => {
@@ -12,6 +14,14 @@ class HTML {
             return previous;
         }, {});
     }
+    static everyAncestors(node, callback) {
+        while (node) {
+            const result = callback(node);
+            if (!result)
+                return;
+            node = (node.parentNode || node.host);
+        }
+    }
     /**
      * Va de parent en parent en partant de node pour trouver un attribut
      * @param attributeName nom de l'attribut
@@ -31,13 +41,34 @@ class HTML {
         }
         return node.getAttribute(attributeName);
     }
+    /**
+     * Petite fonction utilitaire pour retourner la configuration a passer à l'utilitaire API
+     * Utilisée pour la configuration du wording / de la traduction ainsi que par le mixin fetcher par exemple
+     */
+    static getApiConfiguration(node) {
+        const token = HTML.getAncestorAttributeValue(node, "token");
+        const addHTTPResponse = HTML.getAncestorAttributeValue(node, "addHTTPResponse") != null;
+        const serviceURL = HTML.getAncestorAttributeValue(node, "serviceURL");
+        let userName = null;
+        let password = null;
+        const tokenProvider = HTML.getAncestorAttributeValue(node, "tokenProvider");
+        const authToken = HTML.getAncestorAttributeValue(node, "eventsApiToken");
+        if (!token) {
+            userName = HTML.getAncestorAttributeValue(node, "userName");
+            password = HTML.getAncestorAttributeValue(node, "password");
+        }
+        const credentials = HTML.getAncestorAttributeValue(node, "credentials") || undefined;
+        const cache = node.getAttribute("cache");
+        const blockUntilDone = node.hasAttribute("blockUntilDone");
+        return { serviceURL, token, userName, password, authToken, tokenProvider, addHTTPResponse, credentials, cache, blockUntilDone };
+    }
     /**
      * Va de parent en parent en partant de node pour trouver un attribut
      * @param attributeName nom de l'attribut
      * @returns valeur de l'attribut ou null si l'attribut n'est pas trouvé
      */
-    static getClosestForm(node) {
-        while (!(node.nodeName && node.nodeName.toLowerCase() === "form")) {
+    static getClosestElement(node, selector) {
+        while (!(node.nodeName && node.nodeName.toLowerCase() === selector)) {
             const newNode = node.parentNode || node.host;
             if (!newNode)
                 break;
@@ -48,6 +79,14 @@ class HTML {
         }
         return node;
     }
+    /**
+     * Va de parent en parent en partant de node pour trouver un attribut
+     * @param attributeName nom de l'attribut
+     * @returns valeur de l'attribut ou null si l'attribut n'est pas trouvé
+     */
+    static getClosestForm(node) {
+        return HTML.getClosestElement(node, "form");
+    }
     /**
      * Lance le chargement d'un js et retourne une promise qui resoud à true lorsque le chargement à réussi et à false, sinon.
      * */

package/core/utils/Objects.d.ts

@@ -16,6 +16,7 @@ declare class Objects {
      * @returns true si l'argument est null ou undefined
      */
     static isUndefindOrNull<T>(object: T): boolean;
+    static isEmpty(object: Record<string, unknown>): boolean;
     /**
      * traverse l'objet pour obtenir la valeur a l'adresse donnée via le tableau de clés pathArray.
      * Si extendValues = true, les propriétés des objets parents sont copiées au fur et a mesure de la descente dans la hierarchie, avant l'assignation des propriétés de l'objet lui même.

package/core/utils/Objects.js

@@ -54,6 +54,11 @@ class Objects {
     static isUndefindOrNull(object) {
         return object === null || object === undefined;
     }
+    static isEmpty(object) {
+        if (Objects.isUndefindOrNull(object))
+            return true;
+        return Object.keys(object).length === 0;
+    }
     /**
      * traverse l'objet pour obtenir la valeur a l'adresse donnée via le tableau de clés pathArray.
      * Si extendValues = true, les propriétés des objets parents sont copiées au fur et a mesure de la descente dans la hierarchie, avant l'assignation des propriétés de l'objet lui même.

package/core/utils/PublisherProxy.d.ts

@@ -36,8 +36,9 @@ export declare class PublisherProxy<T = any> {
      * Utile pour savoir si quelque chose est en écoute d'une modification sur le proxy via une des methodes associées
      */
     hasListener(): boolean;
+    _assignmentId_: number;
     _publishInternalMutation_(lockInternalMutationsTransmission?: boolean): void;
-    _publishAssignement_(lockInternalMutationsTransmission?: boolean): void;
+    _publishAssignement_(lockInternalMutationsTransmission?: boolean): Promise<void>;
     _publishInvalidation_(): void;
     _publishDynamicFilling_(key: string, value: CoreJSType): void;
     _publishTemplateFilling_(key: string, value: CoreJSType): void;
@@ -89,28 +90,25 @@ export declare class PublisherProxy<T = any> {
     /**
      * Assigne une nouvelle valeur au proxy ce qui déclenche la transmission de la donnée en fonction des "écouteurs" associés
      */
-    set(newValue: T, lockInternalMutationsTransmission?: boolean): boolean;
+    set(newValue: T, lockInternalMutationsTransmission?: boolean): Promise<boolean>;
     /**
      * Extraire la valeur actuelle du proxy
      */
+    _cachedGet_?: T;
     get(): T;
     /**
      * retourner le webcomponent auquel le proxy est associé
      */
     get $tag(): string;
 }
-/**
- * Utilitaires de gestion des Publisher
- * Obtenir, replacer ou supprimer un Publisher
- *
- */
 export declare class PublisherManager {
+    static buildDate: string;
     static changed: boolean;
     static saving: boolean;
     static saveId: number;
     static instance: PublisherManager | null;
     enabledLocaStorageProxies: string[];
-    publishers: Map<string, Publisher<PublisherContentType>>;
+    publishers: Map<string, Publisher<unknown>>;
     localStorageData: Record<string, {
         lastModifiationMS: number;
         data: PublisherContentType;
@@ -135,7 +133,7 @@ export declare class PublisherManager {
     /**
      * shortcut static pour supprimer un publisher de la liste et appel également delete sur le publisher ce qui le supprime, de même que ses sous publishers
      */
-    static delete(id: string): boolean;
+    static delete(id: string | null): boolean;
     /**
      * Obtenir un publisher vias sont id/adresse
      * Si le publisher n'existe pas, il est créé.
@@ -151,7 +149,15 @@ export declare class PublisherManager {
      */
     set(id: string, publisher: Publisher): void;
     /**
-     * supprimer un publisher de la liste et appel également delete sur le publisher ce qui le supprime, de même que ses sous publishers
+     * @warning
+     * !!!!! ATTENTION !!!!!
+     * Il est fort à aprier que vous ne voulez pas utiliser cette methode
+     * Il s'agit d'une supression complete
+     * * du publisher de la liste
+     * * des bindings
+     * * de même que ses sous publishers
+     *
+     * UTILISEZ PLUTÔT la méthode publisher.set({}) pour réinitialiser un publisher sans perdre les ecouteurs
      */
     delete(id: string): boolean;
     saveToLocalStorage(saveId?: number): Promise<void>;