@supersoniks/concorde 1.1.42 → 1.1.44

package/core/mixins/FormElement.js

@@ -4,7 +4,7 @@ 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 { PublisherManager } from "@supersoniks/concorde/core/utils/PublisherProxy.mjs";
+import { PublisherManager } from "@supersoniks/concorde/core/utils/PublisherProxy";
 import { property } from "lit/decorators.js";
 import Objects from "@supersoniks/concorde/core/utils/Objects";
 const keyboardLoops = new Map();
@@ -26,9 +26,6 @@ const Form = (superClass) => {
             this.required = false;
             this.forceAutoFill = false;
             this.disabled = null;
-            this.onValueAssign = null;
-            this.onFormValueAssign = null;
-            this.onFormDataInValidate = null;
             this.formDataProvider = "";
             /**
              * Le nom du champ avec des caractéristiques similaire à un input html classique.
@@ -46,7 +43,8 @@ const Form = (superClass) => {
                 this.setFormValueFromPublisher(value);
             };
             this.onFormDataInValidate = () => {
-                if (!this.getFormPublisher().isFormValid.get()) {
+                const formPublisher = this.getFormPublisher();
+                if (!(formPublisher && formPublisher.isFormValid.get())) {
                     return;
                 }
                 this.validateFormElement();
@@ -61,25 +59,27 @@ const Form = (superClass) => {
             this._name = value;
             this.requestUpdate();
         }
-        validateFormElement() { }
+        validateFormElement() {
+            //Implémentation dans une sous classe
+        }
         updateDataValue() {
-            if (this._name) {
-                let formPublisher = this.getFormPublisher();
+            const name = this.getAttribute("name");
+            if (name) {
+                const formPublisher = this.getFormPublisher();
                 if (formPublisher) {
-                    formPublisher[this._name] = this.getValueForFormPublisher();
-                    this.setFormValueFromPublisher(formPublisher[this.name].get());
+                    formPublisher[name] = this.getValueForFormPublisher();
+                    this.setFormValueFromPublisher(formPublisher[name].get());
                 }
             }
         }
         getFormPublisher() {
-            if (!this.formDataProvider) {
+            if (!this.formDataProvider)
                 this.formDataProvider = this.getAncestorAttributeValue("formDataProvider");
-            }
             if (this.formDataProvider) {
                 return PublisherManager.get(this.formDataProvider);
             }
-            else
-                return this.publisher;
+            return null;
+            //else return this.publisher;
         }
         /**
          * Mise en forme de la valeur fournie au formPublisher associé au composant
@@ -106,10 +106,12 @@ const Form = (superClass) => {
             return this._value;
         }
         set value(value) {
-            if (Objects.isObject(value) && value.hasOwnProperty("__value") && value.value == undefined)
-                return;
             if (value == null)
-                return;
+                value = "";
+            if (Objects.isObject(value) &&
+                Object.prototype.hasOwnProperty.call(value, "__value") &&
+                value._value == undefined)
+                value = "";
             if (this._value == value)
                 return;
             this._value = value;
@@ -117,9 +119,12 @@ const Form = (superClass) => {
             this.requestUpdate();
         }
         initPublisher() {
+            let formPublisher = this.getFormPublisher();
+            const value = this.hasAncestorAttribute("initFromPublisher") && this._name && formPublisher[this._name].get()
+                ? formPublisher[this._name].get()
+                : this.getAttribute("value");
             if (this._name && this.publisher)
                 this.publisher[this._name].offAssign(this.onValueAssign);
-            let formPublisher = this.getFormPublisher();
             if (this._name && formPublisher)
                 formPublisher[this._name].offAssign(this.onFormValueAssign);
             super.initPublisher();
@@ -127,15 +132,17 @@ const Form = (superClass) => {
                 this._name = this.getAttribute("name");
             if (!this.value)
                 this._value = this.getAttribute("value");
-            this.updateDataValue();
             if (this.publisher && this._name) {
                 this.publisher[this._name].onAssign(this.onValueAssign);
             }
             formPublisher = this.getFormPublisher();
             if (this._name && formPublisher) {
                 formPublisher[this._name].onAssign(this.onFormValueAssign);
-                formPublisher.onInvalidate((this.onFormDataInValidate));
+                formPublisher.onInvalidate(this.onFormDataInValidate);
             }
+            this.updateDataValue();
+            if (value)
+                this.value = value;
         }
         handleBlur() {
             this.touched = true;
@@ -154,32 +161,35 @@ const Form = (superClass) => {
          * En appuyant sur la touche "Up", le déplacement inverse est effectué.
          */
         addKeyboardNavigation() {
-            let keyboardLoopIds = this.getAncestorAttributeValue("data-keyboard-nav");
+            const keyboardLoopIds = this.getAncestorAttributeValue("data-keyboard-nav");
             if (!keyboardLoopIds)
                 return;
-            let split = keyboardLoopIds.split(" ");
-            let keyboardLoopId = split[0];
+            const split = keyboardLoopIds.split(" ");
+            const keyboardLoopId = split[0];
             if (!keyboardLoopId)
                 return;
-            for (let keyboardLoopId2 of split) {
+            for (const keyboardLoopId2 of split) {
                 if (!keyboardLoops.has(keyboardLoopId2)) {
                     keyboardLoops.set(keyboardLoopId2, []);
                 }
-                let keyboardLoop = keyboardLoops.get(keyboardLoopId2);
-                if (keyboardLoop.indexOf(this) == -1) {
+                const keyboardLoop = keyboardLoops.get(keyboardLoopId2);
+                if ((keyboardLoop === null || keyboardLoop === void 0 ? void 0 : keyboardLoop.indexOf(this)) == -1) {
                     keyboardLoop.push(this);
                 }
             }
-            let keyboardLoop = keyboardLoops.get(keyboardLoopId);
+            const keyboardLoop = keyboardLoops.get(keyboardLoopId);
             this.addEventListener("keydown", (e) => {
-                if (!["ArrowDown", "ArrowUp"].includes(e.key))
+                var _a;
+                const keyboardEvent = e;
+                if (!["ArrowDown", "ArrowUp"].includes(keyboardEvent.key))
                     return;
-                let selector = "input:not([disabled]), button:not([disabled]), select:not([disabled]), textarea:not([disabled])";
-                let loop = keyboardLoop.filter((el) => {
-                    let child = el.shadowRoot.querySelector(selector);
+                const selector = "input:not([disabled]), button:not([disabled]), select:not([disabled]), textarea:not([disabled])";
+                const loop = keyboardLoop === null || keyboardLoop === void 0 ? void 0 : keyboardLoop.filter((el) => {
+                    var _a;
+                    const child = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(selector);
                     if (!child)
                         return false;
-                    let cpStyle = window.getComputedStyle(child);
+                    const cpStyle = window.getComputedStyle(child);
                     return (cpStyle.display !== "none" &&
                         cpStyle.display !== "" &&
                         cpStyle.pointerEvents != "none" &&
@@ -187,8 +197,8 @@ const Form = (superClass) => {
                         child.getBoundingClientRect().width > 0);
                 });
                 let next = null;
-                if (e.key == "ArrowDown") {
-                    let index = loop.indexOf(this);
+                if (keyboardEvent.key == "ArrowDown" && loop) {
+                    const index = loop.indexOf(this);
                     if (index == loop.length - 1) {
                         next = loop[0];
                     }
@@ -196,8 +206,8 @@ const Form = (superClass) => {
                         next = loop[index + 1];
                     }
                 }
-                else if (e.key == "ArrowUp") {
-                    let index = loop.indexOf(this);
+                else if (keyboardEvent.key == "ArrowUp" && loop) {
+                    const index = loop.indexOf(this);
                     if (index == 0) {
                         next = loop[loop.length - 1];
                     }
@@ -205,14 +215,15 @@ const Form = (superClass) => {
                         next = loop[index - 1];
                     }
                 }
-                let elt = next.shadowRoot.querySelector(selector);
-                if (elt) {
+                const elt = (_a = next === null || next === void 0 ? void 0 : next.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(selector);
+                if (elt && elt.focus) {
                     elt.focus();
                     e.preventDefault();
                 }
             });
         }
         connectedCallback() {
+            this.formDataProvider = this.getAncestorAttributeValue("formDataProvider");
             super.connectedCallback();
             this.addKeyboardNavigation();
         }
@@ -220,7 +231,7 @@ const Form = (superClass) => {
             super.disconnectedCallback();
             if (this._name && this.publisher)
                 this.publisher[this._name].offAssign(this.onValueAssign);
-            let formPublisher = this.getFormPublisher();
+            const formPublisher = this.getFormPublisher();
             if (this._name && formPublisher) {
                 formPublisher[this._name].offAssign(this.onFormValueAssign);
                 formPublisher.offInvalidate(this.onFormDataInValidate);
@@ -245,6 +256,12 @@ const Form = (superClass) => {
     __decorate([
         property({ type: Boolean })
     ], FormElement.prototype, "disabled", void 0);
+    __decorate([
+        property({ type: String, attribute: "data-aria-label" })
+    ], FormElement.prototype, "ariaLabel", void 0);
+    __decorate([
+        property({ type: String, attribute: "data-aria-labelledby" })
+    ], FormElement.prototype, "ariaLabelledby", void 0);
     __decorate([
         property()
     ], FormElement.prototype, "name", null);

package/core/mixins/FormInput.d.ts

@@ -1,8 +1,9 @@
 import { FormElementInterface } from "@supersoniks/concorde/core/mixins/FormElement";
-declare type Constructor<T> = new (...args: any[]) => T;
-declare type Type = "button" | "checkbox" | "color" | "date" | "datetime-local" | "email" | "file" | "hidden" | "image" | "month" | "number" | "password" | "radio" | "range" | "reset" | "search" | "submit" | "tel" | "text" | "time" | "url" | "week";
+import { MixinArgsType } from "../_types/types";
+type Constructor<T> = new (...args: MixinArgsType[]) => T;
+type Type = "button" | "checkbox" | "color" | "date" | "datetime-local" | "email" | "file" | "hidden" | "image" | "month" | "number" | "password" | "radio" | "range" | "reset" | "search" | "submit" | "tel" | "text" | "time" | "url" | "week";
 declare const Form: <T extends Constructor<FormElementInterface>>(superClass: T) => {
-    new (...args: any[]): {
+    new (...args: MixinArgsType[]): {
         validateFormElement(): void;
         forceAutoFill: boolean;
         /**
@@ -19,23 +20,32 @@ declare const Form: <T extends Constructor<FormElementInterface>>(superClass: T)
         autocomplete?: "url" | "name" | "language" | "on" | "tel" | "email" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "photo" | undefined;
         getFormPublisher(): any;
         updateDataValue(): void;
-        handleChange(e?: any): void;
-        handleBlur(e?: any): void;
-        getValueForFormPublisher(): any;
+        handleChange(e?: Event | undefined): void;
+        handleBlur(e?: Event | undefined): void;
+        getValueForFormPublisher(): string | object | string[] | null | undefined;
+        focus?: (() => void) | undefined;
+        shadowRoot?: ShadowRoot | undefined;
         error: boolean;
         autofocus: boolean;
         required: boolean;
         disabled: true | null;
         formDataProvider: string;
-        _value: any;
-        value: any;
+        ariaLabelledby?: string | undefined;
+        ariaLabel?: string | undefined;
+        _value: string | object | string[] | null | undefined;
+        value: string | object | string[] | null | undefined;
         _name: string;
         name: string;
-        props: any;
-        propertyMap: Object;
+        props: import("../_types/types").CoreJSType;
+        propertyMap: object;
         isConnected: boolean;
+        children: HTMLCollection;
+        appendChild(node: Node): Node;
         getAncestorAttributeValue(attributeName: string): string;
-        hasAncestorAttribute(attributeName: string): boolean;
+        hasAncestorAttribute(attributeName: string): boolean; /**
+         * Le type De l'input, comme en html cependant tous les types ne sont pas actuellements compatibles en raison du style en vigueur
+         * On peut essayer text, date, color, email par exemple, mais pas radio/checkbox/range a priori
+         */
         querySelectorAll(selector: string): NodeListOf<Element>;
         publisher: any;
         dataProvider: string | null;
@@ -53,7 +63,7 @@ declare const Form: <T extends Constructor<FormElementInterface>>(superClass: T)
         connectedCallback(): void;
         requestUpdate(): void;
         getAttribute(name: string): string;
-        hasAttribute(attributeName: String): boolean;
+        hasAttribute(attributeName: string): boolean;
         disconnectedCallback(): void;
     };
 } & T;

package/core/mixins/FormInput.js

@@ -19,11 +19,12 @@ const Form = (superClass) => {
         }
         validateFormElement() {
             var _a;
-            const that = this;
-            const input = (_a = that.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("input");
+            const input = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("input");
             if (!input || input.checkValidity())
                 return;
-            this.getFormPublisher().isFormValid = false;
+            const formPublisher = this.getFormPublisher();
+            if (formPublisher)
+                formPublisher.isFormValid = false;
             input.reportValidity();
         }
         set type(value) {

package/core/mixins/Subscriber.d.ts

@@ -1,19 +1,23 @@
-import { LitElement } from "lit";
 import { APIConfiguration } from "@supersoniks/concorde/core/utils/api";
-declare type Constructor<T> = new (...args: any[]) => T;
-export interface SubscriberInterface {
-    props: any;
-    propertyMap: Object;
+import { LitElement } from "lit";
+import { PublisherInterface, TypeAndRecordOfType, MixinArgsType, CoreJSType } from "@supersoniks/concorde/core/_types/types";
+type Constructor<T> = new (...args: MixinArgsType[]) => T;
+export interface SubscriberInterface<PropsType = CoreJSType> {
+    props: PropsType | null;
+    propertyMap: object;
     isConnected: boolean;
+    children: HTMLCollection;
+    appendChild(node: Node): Node;
     getAncestorAttributeValue(attributeName: string): string;
     hasAncestorAttribute(attributeName: string): boolean;
     querySelectorAll(selector: string): NodeListOf<Element>;
-    publisher: any;
+    publisher: TypeAndRecordOfType<PublisherInterface<PropsType>>;
     dataProvider: string | null;
     noShadowDom: string | null;
     debug: HTMLElement | null;
     defferedDebug: boolean | null;
     displayContents: boolean;
+    shadowRoot?: ShadowRoot;
     dispatchEvent(event: Event): void;
     setAttribute(name: string, value: string): void;
     addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
@@ -24,8 +28,8 @@ export interface SubscriberInterface {
     connectedCallback(): void;
     requestUpdate(): void;
     getAttribute(name: string): string;
-    hasAttribute(attributeName: String): boolean;
+    hasAttribute(attributeName: string): boolean;
     disconnectedCallback(): void;
 }
-declare const Subscriber: <T extends Constructor<LitElement>>(superClass: T) => Constructor<SubscriberInterface> & T;
+declare const Subscriber: <PropsType = CoreJSType, T extends Constructor<LitElement> = Constructor<LitElement>>(superClass: T, type?: PropsType | undefined) => Constructor<SubscriberInterface<PropsType>> & T;
 export default Subscriber;

package/core/mixins/Subscriber.js

@@ -13,12 +13,12 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { PublisherManager } from "@supersoniks/concorde/core/utils/PublisherProxy.mjs";
-import { property } from "lit/decorators.js";
 import API from "@supersoniks/concorde/core/utils/api";
-import HTML from "@supersoniks/concorde/core/utils/HTML";
 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";
 let keepDebugOnMouseOut = false;
 let debugs = new Set();
 //Pour référence
@@ -36,13 +36,14 @@ let debugs = new Set();
 //     return this.shadowRoot || this;
 //   }
 // }
-const Subscriber = (superClass) => {
+const Subscriber = (superClass, type) => {
     /**
      * La mixin Subscriber permet lier un composant à un publisher.
      * La liaison à un publisher se fait via l'attribut *dataProvider* du composant qui représente ce que l'on obtient en appellant PublisherManager.get(dataProvider).
      * les propriétés du composant sont automatiquement remplies avec les propriétés du même nom dans les données du publisher.
      * Le composant est automatiquement mis à jour lorsque les données du publisher sont mises à jour.
      */
+    type;
     class SubscriberElement extends superClass {
         constructor(...args) {
             super();
@@ -90,8 +91,10 @@ const Subscriber = (superClass) => {
             /**
              * On assign est enregistré car c'est un écouteur du publisher qui doit être délié lorsque l'objet est déconnecté du dom.
              */
-            this.onAssign = null;
-            this.args = args;
+            this.onAssign = (v) => {
+                this.props = v;
+            };
+            args;
         }
         /**
          * va de parent en parent pour trouver un attribut
@@ -107,11 +110,10 @@ const Subscriber = (superClass) => {
          * @returns valeur de l'attribut ou null si l'attribut n'est pas trouvé
          */
         getAncestorAttributeValue(attributeName) {
-            let node = this;
-            return HTML.getAncestorAttributeValue(node, attributeName);
+            return HTML.getAncestorAttributeValue(this, attributeName);
         }
         get props() {
-            if (!this.publisher)
+            if (this._props !== null || !this.publisher)
                 return this._props;
             return this.publisher.get();
         }
@@ -119,12 +121,11 @@ const Subscriber = (superClass) => {
             if (typeof value == "string" && ["{", "["].includes(value.trim().charAt(0))) {
                 value = JSON.parse(value);
             }
-            if (value == null || value === "")
-                value = {};
-            if (!this.publisher)
-                this.initPublisher();
+            if (value == this._props)
+                return;
             this._props = value;
-            if (this.publisher) {
+            // if (!this.publisher) this.initPublisher();
+            if (this.publisher && this.publisher.get() != value) {
                 this.publisher.set(value);
             }
             this.requestUpdate();
@@ -132,7 +133,8 @@ const Subscriber = (superClass) => {
         updated(_changedProperties) {
             super.updated(_changedProperties);
             let ref = this.shadowRoot || this;
-            let display = this.displayContents ? "contents" : ref.children.length == 0 ? "none" : null;
+            const children = [...ref.children].filter((child) => child.tagName != "STYLE");
+            let display = this.displayContents ? "contents" : children.length == 0 ? "none" : null;
             if (display)
                 this.style.display = display;
             else
@@ -140,12 +142,12 @@ const Subscriber = (superClass) => {
         }
         connectedCallback() {
             if (this.hasAttribute("lazyRendering")) {
-                let options = {
+                const options = {
                     root: null,
                     rootMargin: Math.max(window.innerWidth * 0.1, window.innerHeight * 0.1) + "px",
                 };
                 let firstView = true;
-                let iObserver = new IntersectionObserver((entries) => {
+                const iObserver = new IntersectionObserver((entries) => {
                     for (const e of entries) {
                         if (firstView && e.isIntersecting) {
                             firstView = false;
@@ -165,22 +167,24 @@ const Subscriber = (superClass) => {
             SubscriberElement.instanceCounter++;
         }
         disconnectedCallback() {
+            var _a;
             this.removeDebugger();
             super.disconnectedCallback();
             if (this.publisher) {
                 this.publisher.stopTemplateFilling(this);
-                this.publisher.offInternalMutation(this.requestUpdate());
+                this.publisher.offInternalMutation(this.requestUpdate);
             }
             if (this.wordingPublisher)
                 this.wordingPublisher.stopTemplateFilling(this);
             if (this.onAssign)
-                this.publisher.offAssign(this.onAssign);
+                (_a = this.publisher) === null || _a === void 0 ? void 0 : _a.offAssign(this.onAssign);
         }
         addDebugger() {
+            var _a;
             if (this.hasAttribute("debug") && !this.defferedDebug) {
                 if (!this.debug) {
                     this.debug = document.createElement("div");
-                    let style = this.debug.style;
+                    const style = this.debug.style;
                     style.position = "fixed";
                     style.top = "0";
                     style.right = "0";
@@ -195,10 +199,11 @@ const Subscriber = (superClass) => {
                     style.zIndex = "99999999";
                     style.maxHeight = "calc(100vh - 32px)";
                     style.fontFamily = "Consolas, monospace";
-                    style.maxWidth = "50vw";
+                    style.maxWidth = "min(50vw,25rem)";
                     style.fontSize = "12px";
                     style.minWidth = "300px";
                     style.overflowWrap = "break-word";
+                    style.resize = "vertical";
                 }
                 this.addEventListener("click", (e) => {
                     if (!e.ctrlKey)
@@ -207,8 +212,7 @@ const Subscriber = (superClass) => {
                     keepDebugOnMouseOut = !keepDebugOnMouseOut;
                 });
                 if (this.dataProvider) {
-                    let win = window;
-                    win[this.dataProvider] = this.publisher;
+                    window[this.dataProvider] = this.publisher;
                 }
                 this.addEventListener("mouseover", () => {
                     if (!keepDebugOnMouseOut)
@@ -220,13 +224,14 @@ const Subscriber = (superClass) => {
                     if (!keepDebugOnMouseOut)
                         this.removeDebugger();
                 });
-                this.publisher.onInternalMutation(() => {
+                (_a = this.publisher) === null || _a === void 0 ? void 0 : _a.onInternalMutation(() => {
+                    var _a;
                     this.debug.innerHTML = `🤖 DataProvider : "<b style="font-weight:bold;color:#fff;">${this.dataProvider}</b>"<br>
           <div style="font-size:10px;border-top:1px dashed;margin-top:5px;padding-left:23px;opacity:.6;padding-top:5px;">
             Variable disponible dans la console<br>
             ctrl + Clique : épingler / désépingler
            </div>
-          <pre style="margin-top:10px;background:transparent;padding:0;font-size:inherit;color:inherit;">${JSON.stringify(this.publisher.get(), null, "  ")}</pre>`;
+          <pre style="margin-top:10px;background:transparent;padding:0;font-size:inherit;color:inherit;">${JSON.stringify((_a = this.publisher) === null || _a === void 0 ? void 0 : _a.get(), null, "  ")}</pre>`;
                 });
             }
         }
@@ -244,7 +249,8 @@ const Subscriber = (superClass) => {
          */
         getApiConfiguration() {
             const token = this.getAncestorAttributeValue("token");
-            let serviceURL = this.getAncestorAttributeValue("serviceURL");
+            const addHTTPResponse = this.getAncestorAttributeValue("addHTTPResponse") != null;
+            const serviceURL = this.getAncestorAttributeValue("serviceURL");
             let userName = null;
             let password = null;
             let tokenProvider = null;
@@ -253,13 +259,14 @@ const Subscriber = (superClass) => {
                 password = this.getAncestorAttributeValue("password");
                 tokenProvider = this.getAncestorAttributeValue("tokenProvider");
             }
-            return { serviceURL, token, userName, password, tokenProvider };
+            const credentials = this.getAncestorAttributeValue("credentials") || undefined;
+            return { serviceURL, token, userName, password, tokenProvider, addHTTPResponse, credentials };
         }
         initWording() {
             return __awaiter(this, void 0, void 0, function* () {
                 let hasWording = false;
                 const propNames = Object.getOwnPropertyNames(this.constructor.prototype);
-                for (let p of propNames) {
+                for (const p of propNames) {
                     if (p.indexOf("wording_") == 0) {
                         hasWording = true;
                         break;
@@ -267,15 +274,15 @@ const Subscriber = (superClass) => {
                 }
                 if (!hasWording)
                     return;
-                let publisher = PublisherManager.getInstance().get("sonic-wording");
-                let wordingProvider = this.getAncestorAttributeValue("wordingProvider");
+                const publisher = PublisherManager.getInstance().get("sonic-wording");
+                const wordingProvider = this.getAncestorAttributeValue("wordingProvider");
                 const api = new API(this.getApiConfiguration());
                 if (wordingProvider) {
-                    let wordings = [];
-                    let wordingsAll = [];
-                    for (let p of propNames) {
+                    const wordings = [];
+                    const wordingsAll = [];
+                    for (const p of propNames) {
                         if (p.indexOf("wording_") == 0) {
-                            let p8 = p.substring(8);
+                            const p8 = p.substring(8);
                             if (!publisher.get()[p]) {
                                 publisher[p] = "...";
                                 wordings.push(p8);
@@ -284,8 +291,8 @@ const Subscriber = (superClass) => {
                         }
                     }
                     if (wordings.length > 0) {
-                        let result = yield api.post(wordingProvider, { labels: wordings });
-                        for (let elt in result) {
+                        const result = (yield api.post(wordingProvider, { labels: wordings }));
+                        for (const elt in result) {
                             publisher["wording_" + elt] = result[elt];
                         }
                     }
@@ -303,7 +310,7 @@ const Subscriber = (superClass) => {
             if (this.noShadowDom === "" || this.getAttribute("noShadowDom") === "") {
                 return this;
             }
-            let shadowRoot = super.createRenderRoot();
+            const shadowRoot = super.createRenderRoot();
             DataBindObserver.observe(shadowRoot);
             return shadowRoot;
         }
@@ -330,7 +337,7 @@ const Subscriber = (superClass) => {
                 let pub = mng.get(publisherId);
                 this.dataProvider = publisherId;
                 if (this.hasAttribute("subDataProvider")) {
-                    let dataPath = this.getAttribute("subDataProvider");
+                    const dataPath = this.getAttribute("subDataProvider");
                     this.dataProvider = publisherId + "/" + dataPath;
                     pub = Objects.traverse(pub, dataPath.split("."));
                     mng.set(this.dataProvider, pub);
@@ -339,17 +346,14 @@ const Subscriber = (superClass) => {
                 this.publisher = pub;
             }
             if (this.publisher) {
-                this.onAssign = () => {
-                    this.requestUpdate();
-                };
-                this.publisher.onAssign(this.onAssign);
+                if (this._props) {
+                    this.publisher.set(this._props);
+                }
                 if (!this.noAutoFill)
                     this.publisher.startTemplateFilling(this);
                 if (this.renderOnPropsInternalChange)
                     this.publisher.onInternalMutation(this.requestUpdate);
-                if (this._props) {
-                    this.publisher.set(this._props);
-                }
+                this.publisher.onAssign(this.onAssign);
             }
         }
     }
@@ -381,6 +385,5 @@ const Subscriber = (superClass) => {
     return SubscriberElement;
 };
 export default Subscriber;
-let win = window;
-if (!win.SonicPublisherManager)
-    win.SonicPublisherManager = PublisherManager;
+if (!window.SonicPublisherManager)
+    window.SonicPublisherManager = PublisherManager;

package/core/mixins/TemplatesContainer.d.ts

@@ -1,5 +1,6 @@
 import { LitElement } from "lit";
-declare type Constructor<T> = new (...args: any[]) => T;
+import { MixinArgsType } from "../_types/types";
+type Constructor<T> = new (...args: MixinArgsType[]) => T;
 export declare class TemplatesContainerInterface extends LitElement {
     connectedCallback(): void;
     templateParts: Record<string, HTMLTemplateElement>;

package/core/mixins/TemplatesContainer.js

@@ -39,8 +39,8 @@ const TemplatesContainer = (superClass) => {
             this.templatePartsList = [];
         }
         connectedCallback() {
-            let templates = this.templates || [...this.querySelectorAll("template")];
-            for (let t of templates) {
+            const templates = this.templates || [...this.querySelectorAll("template")];
+            for (const t of templates) {
                 if (t.hasAttribute(this.templateValueAttribute)) {
                     this.templateParts[t.getAttribute(this.templateValueAttribute)] = t;
                     this.templatePartsList.push(t);