@supersoniks/concorde 1.1.41 → 1.1.43

package/core/components/functional/sdui/SDUIDescriptorTransformer.js

@@ -87,7 +87,7 @@ export default class SDUIDescriptorTransformer {
             return false;
         if (patternAttributes) {
             for (let name in patternAttributes) {
-                if (!this.stringMatchesExpression(nodeAttributes[name], patternAttributes[name])) {
+                if (!nodeAttributes || !this.stringMatchesExpression(nodeAttributes[name], patternAttributes[name])) {
                     return false;
                 }
             }
@@ -97,7 +97,7 @@ export default class SDUIDescriptorTransformer {
     /**
      * Pour chaque élément de la liste, remplace l'élément par ses enfants
      */
-    unWrap(transformAction, list) {
+    unwrap(transformAction, list) {
         var _a, _b;
         transformAction;
         for (let item of list) {
@@ -112,7 +112,7 @@ export default class SDUIDescriptorTransformer {
      * L'élément créé est inséré en lieu et place du premier élément de la liste
      */
     wrap(transformAction, list) {
-        var _a, _b, _c, _d, _e;
+        var _a, _b, _c, _d, _e, _f;
         let wrapper = Object.assign({}, transformAction.ui);
         if (!wrapper.nodes)
             wrapper.nodes = [];
@@ -124,10 +124,10 @@ export default class SDUIDescriptorTransformer {
             }
             i++;
         }
-        let idx = (_c = list[0].parent.nodes) === null || _c === void 0 ? void 0 : _c.indexOf(list[0].child);
+        let idx = (_d = (_c = list[0]) === null || _c === void 0 ? void 0 : _c.parent.nodes) === null || _d === void 0 ? void 0 : _d.indexOf(list[0].child);
         if (idx) {
-            (_d = list[0].parent.nodes) === null || _d === void 0 ? void 0 : _d.splice(idx, 1);
-            (_e = list[0].parent.nodes) === null || _e === void 0 ? void 0 : _e.splice(idx, 0, wrapper);
+            (_e = list[0].parent.nodes) === null || _e === void 0 ? void 0 : _e.splice(idx, 1);
+            (_f = list[0].parent.nodes) === null || _f === void 0 ? void 0 : _f.splice(idx, 0, wrapper);
         }
     }
     /**
@@ -137,10 +137,14 @@ export default class SDUIDescriptorTransformer {
         var _a, _b;
         for (let item of list) {
             (_a = item.parent.nodes) === null || _a === void 0 ? void 0 : _a.splice(item.parent.nodes.indexOf(item.child), 1);
-            let positionType = transformAction.after ? "after" : "before";
-            let element = this.getNodesMatchingPatterns([transformAction[positionType]], this.sduiDescriptor)[0];
+            let list = [];
+            if (transformAction.after)
+                list = this.getNodesMatchingPatterns([transformAction.after], this.sduiDescriptor);
+            if (transformAction.before)
+                list = this.getNodesMatchingPatterns([transformAction.before], this.sduiDescriptor);
+            let element = list[0];
             if (element) {
-                (_b = element.parent.nodes) === null || _b === void 0 ? void 0 : _b.splice(element.parent.nodes.indexOf(element.child) + (positionType == "after" ? 1 : 0), 0, item.child);
+                (_b = element.parent.nodes) === null || _b === void 0 ? void 0 : _b.splice(element.parent.nodes.indexOf(element.child) + (transformAction.after ? 1 : 0), 0, item.child);
             }
         }
     }
@@ -150,7 +154,6 @@ export default class SDUIDescriptorTransformer {
      */
     remap(transformAction, list) {
         var _a, _b, _c;
-        console.log(list);
         for (let item of list) {
             let newUI = Object.assign({}, transformAction.ui);
             if (!newUI.attributes) {
@@ -202,9 +205,18 @@ export default class SDUIDescriptorTransformer {
      */
     insert(transformAction, list) {
         var _a;
-        list;
         let positionType = transformAction.after ? "after" : transformAction.before ? "before" : "in";
-        let node = this.getNodesMatchingPatterns([transformAction[positionType]], this.sduiDescriptor)[0];
+        list = [];
+        if (transformAction.after) {
+            list = this.getNodesMatchingPatterns([transformAction.after], this.sduiDescriptor);
+        }
+        else if (transformAction.before) {
+            list = this.getNodesMatchingPatterns([transformAction.before], this.sduiDescriptor);
+        }
+        else if (transformAction.in) {
+            list = this.getNodesMatchingPatterns([transformAction.in], this.sduiDescriptor);
+        }
+        let node = list[0];
         if (node) {
             if (positionType == "in") {
                 if (!node.child.nodes)

package/core/components/functional/sdui/default-library.json

@@ -0,0 +1,108 @@
+{
+    "checkbox": {
+        "tagName": "sonic-checkbox"
+    },
+    "date": {
+        "tagName": "sonic-input",
+        "attributes": {
+            "type": "date"
+        }
+    },
+    "fieldset": {
+        "tagName": "sonic-fieldset",
+        "nodes": [{ "libraryKey": "formLayout" }],
+        "contentElementSelector": "sonic-form-layout"
+    },
+    "managed_file": {
+        "tagName": "sonic-input",
+        "attributes": {
+            "variant": "ghost",
+            "type": "file"
+        }
+    },
+    "password": {
+        "tagName": "sonic-input",
+        "attributes": {
+            "type": "password"
+        }
+    },
+    "radio": {
+        "tagName": "sonic-radio"
+    },
+    "select": {
+        "tagName": "sonic-select"
+    },
+    "textarea": {
+        "tagName": "sonic-textarea"
+    },
+    "textfield": {
+        "tagName": "sonic-input",
+        "attributes": {
+            "type": "text"
+        }
+    },
+    "hidden": {
+        "tagName": "sonic-input",
+        "attributes": {
+            "type": "hidden"
+        }
+    },
+    "button": {
+        "tagName": "sonic-button"
+    },
+    "form": {
+        "tagName": "sonic-submit",
+        "attributes": {
+            "onEnterKey": true
+        }
+    },
+    "submit": {
+        "tagName": "sonic-submit",
+        "attributes": {
+            "onClick": true
+        },
+        "contentElementSelector": "sonic-button",
+        "nodes": [
+            {
+                "libraryKey": "button",
+                "attributes": { "type": "success" },
+                "nodes": [
+                    {
+                        "tagName": "sonic-icon",
+                        "attributes": {
+                            "name": "check",
+                            "slot": "prefix"
+                        }
+                    }
+                ]
+            }
+        ]
+    },
+    "email": {
+        "tagName": "sonic-input",
+        "attributes": {
+            "type": "email"
+        }
+    },
+    "formItemContainer": {
+        "tagName": "div",
+        "attributes": {
+            "class": "form-item-container"
+        }
+    },
+    "formLayout": {
+        "tagName": "sonic-form-layout"
+    },
+    "formActions": {
+        "tagName": "sonic-form-actions"
+    },
+    "passwordHelper": {
+        "tagName": "sonic-password-helper"
+    },
+    "sameValueHelper": {
+        "tagName": "sonic-same-value-helper"
+    },
+    "divider": {
+        "tagName": "sonic-divider"
+    }
+}

package/core/components/functional/sdui/sdui-utils.d.ts

@@ -0,0 +1,5 @@
+import { SDUINode } from "./types";
+export default class SDUIUtils {
+    static toJson(nodes: HTMLCollection): string;
+    static parseNode(node: Node): SDUINode | null;
+}

package/core/components/functional/sdui/sdui-utils.js

@@ -0,0 +1,63 @@
+export default class SDUIUtils {
+    static toJson(nodes) {
+        const desc = {};
+        desc.nodes = [];
+        for (let node of nodes) {
+            const parsedChild = SDUIUtils.parseNode(node);
+            if (parsedChild) {
+                desc.nodes.push(parsedChild);
+            }
+        }
+        let dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(desc, null, 2));
+        let dlAnchorElem = document.createElement("a");
+        dlAnchorElem.setAttribute("href", dataStr);
+        dlAnchorElem.setAttribute("download", "sdui.json");
+        document.body.appendChild(dlAnchorElem);
+        dlAnchorElem.click();
+        dlAnchorElem.remove();
+        return JSON.stringify(desc, null, 4);
+    }
+    static parseNode(node) {
+        let sdui = {};
+        let nodeType = node.nodeType;
+        if (nodeType == Node.ELEMENT_NODE) {
+            let name = node.nodeName.toLowerCase();
+            sdui.tagName = name;
+            let element = node;
+            sdui.attributes = {};
+            const attributes = element.attributes;
+            const attrLength = attributes.length;
+            for (let i = 0; i < attrLength; i++) {
+                let attribute = attributes.item(i);
+                if (attribute)
+                    sdui.attributes[attribute.name] = attribute.value;
+            }
+            let childNodes = element.childNodes;
+            let children = element.children;
+            if (name == "template") {
+                let template = node;
+                childNodes = template.content.childNodes;
+                children = template.content.children;
+            }
+            if (children.length > 0) {
+                sdui.nodes = [];
+                for (let ch of childNodes) {
+                    const parsedChild = SDUIUtils.parseNode(ch);
+                    if (parsedChild) {
+                        sdui.nodes.push(parsedChild);
+                    }
+                }
+            }
+            else if (element.innerHTML) {
+                sdui.innerHTML = element.innerHTML;
+            }
+        }
+        if (nodeType == Node.TEXT_NODE) {
+            let content = (node.textContent || "").trim();
+            if (!content)
+                return null;
+            sdui.markup = content;
+        }
+        return sdui;
+    }
+}

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

@@ -1,8 +1,8 @@
+/// <reference types="node" />
 import { LitElement } from "lit";
-import { SDUIDescriptor } from "@supersoniks/concorde/core/components/functional/sdui/types";
 declare const SonicSDUI_base: {
     new (...args: any[]): {
-        api: import("../../../utils/api").default | null;
+        api: import("../../../utils/api").default<any, any> | null;
         key: String;
         isFirstLoad: boolean;
         isLoading: boolean;
@@ -11,8 +11,11 @@ declare const SonicSDUI_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;
@@ -29,6 +32,7 @@ declare const SonicSDUI_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;
@@ -40,7 +44,7 @@ declare const SonicSDUI_base: {
         getAttribute(name: string): string;
         hasAttribute(attributeName: String): boolean;
     };
-} & (new (...args: any[]) => import("../../../mixins/Subscriber").SubscriberInterface) & typeof LitElement;
+} & (new (...args: any[]) => import("../../../mixins/Subscriber").SubscriberInterface<any>) & typeof LitElement;
 /**
  *  ### sonic-sdui (Server Driven User Interface) est un fetcher chargant un JSON décrivant une interface utilisateur
  *
@@ -60,13 +64,16 @@ declare const SonicSDUI_base: {
  */
 export declare class SonicSDUI extends SonicSDUI_base {
     connectedCallback(): void;
+    sduiKey?: string;
+    messagesKey?: string;
+    private sduiDescriptor;
     /**
      * On peut passer la description sous form de props, sinon il faut utiliser l'attribut fetch
      */
-    get props(): SDUIDescriptor;
-    set props(value: SDUIDescriptor);
+    get props(): any;
+    set props(value: any);
     /**
-     * updateContents est déclenché quand les props sont renseignées
+     * updateContents est déclenché quand les sduiDescriptor sont renseignées
      * Le contenu du composant est regénéré en fonction du descripteur fourni
      */
     updateContents(): Promise<void>;
@@ -79,9 +86,13 @@ export declare class SonicSDUI extends SonicSDUI_base {
      **/
     private loadAssets;
     /**
-     * Transformation de la data fournie via props si il y a un attribut transformation
+     * Transformation de la data fournie via sduiDescriptor si il y a un attribut transformation
      * */
     private transformSDUIDescriptor;
+    /**
+     * Charge la library à utiliser
+     * */
+    private loadLibrary;
     /**
      * Point d'entrée : transformation des noeuds fournis en éléments graphiques
      **/
@@ -91,7 +102,7 @@ export declare class SonicSDUI extends SonicSDUI_base {
      */
     private parseChild;
     /**
-     * Si le noeud courant a des propriétés prefix et ou suffix il est entouré des markups fournis dans ces props.
+     * Si le noeud courant a des propriétés prefix et ou suffix il est entouré des markups fournis dans ces sduiDescriptor.
      * Le tout est inclu dans une div en display contents
      */
     private handlePrefixSuffix;

package/core/components/functional/sdui/sdui.js

@@ -13,12 +13,13 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { LitElement } from "lit";
-import { customElement, property } from "lit/decorators.js";
+import default_library from "@supersoniks/concorde/core/components/functional/sdui/default-library.json";
+import SDUIDescriptorTransformer from "@supersoniks/concorde/core/components/functional/sdui/SDUIDescriptorTransformer";
 import { Fetcher, Subscriber } from "@supersoniks/concorde/mixins";
 import { HTML, Objects } from "@supersoniks/concorde/utils";
+import { LitElement } from "lit";
+import { customElement, property } from "lit/decorators.js";
 const tagName = "sonic-sdui"; // For Astro.build
-import SDUIDescriptorTransformer from "@supersoniks/concorde/core/components/functional/sdui/SDUIDescriptorTransformer";
 /**
  *  ### sonic-sdui (Server Driven User Interface) est un fetcher chargant un JSON décrivant une interface utilisateur
  *
@@ -37,6 +38,10 @@ import SDUIDescriptorTransformer from "@supersoniks/concorde/core/components/fun
  * *
  */
 let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
+    constructor() {
+        super(...arguments);
+        this.sduiDescriptor = {};
+    }
     connectedCallback() {
         this.noShadowDom = "";
         this.displayContents = true;
@@ -50,19 +55,28 @@ let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
         return super.props;
     }
     set props(value) {
+        if (value === this.props)
+            return;
         super.props = value;
+        let newSduiDescriptor = this.sduiKey ? value[this.sduiKey] : value;
+        if (this.sduiDescriptor == newSduiDescriptor)
+            return;
+        this.sduiDescriptor = newSduiDescriptor;
         this.updateContents();
     }
     /**
-     * updateContents est déclenché quand les props sont renseignées
+     * updateContents est déclenché quand les sduiDescriptor sont renseignées
      * Le contenu du composant est regénéré en fonction du descripteur fourni
      */
     updateContents() {
         return __awaiter(this, void 0, void 0, function* () {
-            this.removeChildren();
-            if (!this.props)
+            if (!this.sduiDescriptor)
                 return;
+            let library = {};
+            Object.assign(library, default_library, this.sduiDescriptor.library);
+            this.sduiDescriptor.library = library;
             this.loadAssets();
+            yield this.loadLibrary();
             yield this.transformSDUIDescriptor();
             this.parseRootNodes();
         });
@@ -79,19 +93,19 @@ let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
      * Chargement de fichiers js et css associés si besoin
      **/
     loadAssets() {
-        if (!this.props)
+        if (!this.sduiDescriptor)
             return;
-        if (this.props.js) {
-            for (const src of this.props.js)
+        if (this.sduiDescriptor.js) {
+            for (const src of this.sduiDescriptor.js)
                 HTML.loadJS(src);
         }
-        if (this.props.css) {
-            for (const src of this.props.css)
+        if (this.sduiDescriptor.css) {
+            for (const src of this.sduiDescriptor.css)
                 HTML.loadCSS(src);
         }
     }
     /**
-     * Transformation de la data fournie via props si il y a un attribut transformation
+     * Transformation de la data fournie via sduiDescriptor si il y a un attribut transformation
      * */
     transformSDUIDescriptor() {
         return __awaiter(this, void 0, void 0, function* () {
@@ -100,18 +114,36 @@ let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
             let result = yield fetch(this.getAttribute("transformation"));
             let json = yield result.json();
             let transformer = new SDUIDescriptorTransformer();
-            yield transformer.transform(this.props, json);
+            yield transformer.transform(this.sduiDescriptor, json);
+        });
+    }
+    /**
+     * Charge la library à utiliser
+     * */
+    loadLibrary() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!this.hasAttribute("library"))
+                return;
+            let result = yield fetch(this.getAttribute("library"));
+            let json = yield result.json();
+            this.sduiDescriptor.library = json;
         });
     }
     /**
      * Point d'entrée : transformation des noeuds fournis en éléments graphiques
      **/
     parseRootNodes() {
-        if (!this.props)
+        this.removeChildren();
+        if (!this.sduiDescriptor)
             return;
-        let nodes = this.props.nodes;
+        let nodes = this.sduiDescriptor.nodes;
         if (!nodes)
-            return;
+            nodes = [];
+        let messageProvider = { tagName: "sonic-toast-message-subscriber", attributes: {} };
+        if (this.messagesKey) {
+            messageProvider.attributes = { subDataProvider: this.messagesKey };
+        }
+        nodes.push(messageProvider);
         nodes.forEach((node) => this.appendChild(this.parseChild(node)));
     }
     /**
@@ -133,7 +165,7 @@ let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
         return element;
     }
     /**
-     * Si le noeud courant a des propriétés prefix et ou suffix il est entouré des markups fournis dans ces props.
+     * Si le noeud courant a des propriétés prefix et ou suffix il est entouré des markups fournis dans ces sduiDescriptor.
      * Le tout est inclu dans une div en display contents
      */
     handlePrefixSuffix(node, element) {
@@ -157,6 +189,10 @@ let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
                 }
                 if (nodeToAppendOn.shadowRoot)
                     nodeToAppendOn.shadowRoot.appendChild(childElement);
+                else if (nodeToAppendOn.tagName.toLocaleLowerCase() == "template") {
+                    let template = nodeToAppendOn;
+                    template.content.appendChild(childElement);
+                }
                 else
                     nodeToAppendOn.appendChild(childElement);
             }
@@ -172,9 +208,9 @@ let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
     handleLibrary(node, tagName) {
         let element;
         let contentElement;
-        if (node.libraryKey && this.props.library) {
-            element = this.parseChild(this.props.library[node.libraryKey] || { tagName: "div" });
-            let selector = (this.props.library[node.libraryKey] || {}).contentElementSelector;
+        if (node.libraryKey && this.sduiDescriptor.library) {
+            element = this.parseChild(this.sduiDescriptor.library[node.libraryKey] || { tagName: "div" });
+            let selector = (this.sduiDescriptor.library[node.libraryKey] || {}).contentElementSelector;
             if (selector)
                 contentElement = element.querySelector(selector);
         }
@@ -188,10 +224,8 @@ let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
     handleAttributes(node, element) {
         let attributes = node.attributes;
         for (let k in attributes) {
-            let attr = attributes[k];
-            if (Objects.isObject(attr)) {
-                attr = JSON.stringify(attr);
-            }
+            let attrData = attributes[k];
+            let attr = Objects.isObject(attrData) ? JSON.stringify(attrData) : attrData;
             element.setAttribute(k, attr);
         }
     }
@@ -225,6 +259,12 @@ let SonicSDUI = class SonicSDUI extends Fetcher(Subscriber(LitElement)) {
         }
     }
 };
+__decorate([
+    property()
+], SonicSDUI.prototype, "sduiKey", void 0);
+__decorate([
+    property()
+], SonicSDUI.prototype, "messagesKey", void 0);
 __decorate([
     property()
 ], SonicSDUI.prototype, "props", null);

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

@@ -8,7 +8,7 @@ export declare type SDUINode = {
     libraryKey?: string;
     markup?: string;
     tagName?: string;
-    attributes: Record<string, string>;
+    attributes?: Record<string, string>;
     nodes?: Array<SDUINode>;
     innerHTML?: string;
     prefix?: string;
@@ -20,8 +20,10 @@ export declare type SDUITransformDescription = {
     library?: Record<string, SDUINode>;
     transforms: Array<SDUITransformAction>;
 };
+export declare type SDUITransformActionName = "remap" | "unwrap" | "wrap" | "delete" | "insert" | "move";
+export declare type SDUITransformActionFunction = (transformAction: SDUITransformAction, list: SDUITransformList) => void;
 export declare type SDUITransformAction = {
-    action: "remap" | "unwrap" | "wrap" | "delete" | "insert" | "move";
+    action: SDUITransformActionName;
     patterns?: Array<SDUINode>;
     after?: SDUINode;
     before?: SDUINode;

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

@@ -1,11 +1,27 @@
 import { LitElement } from "lit";
-declare const SonicStates_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
+import { PublisherInterface, TypeAndRecordOfType } from "@supersoniks/concorde/core/_types/types";
+declare const SonicStates_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<any>) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
+/**
+ * ### sonic-states affiche des états différents en fonction de la valeur d'une sous propriété de son dataProvider (attribut data-path en dot notation):
+ * * Il boucle sur ses template enfants et test si la regexp contenue dans l'attribut *data-value* match la valeur de la propriété
+ * * Si oui le contenu du template correspontant est affiché comme état.
+ * * Si l'attribut dataProviderExpression est fourni le contenu est entouré d'une div :
+ * * L'attribut "dataProvider" de cette div est le resultat de l'appel à la fonction replace sur valeur de la propriété avec comme paramettres la regexp et dataproviderExpression.
+ * * Les subscribers/fetch... du template se réfèrerons à ce dataProvider
+ * * On peut également utiliser les des expressions du type url-pattern pour les paramètres de la route voir les exemples
+ *
+ * **Exemples**
+ * Avec ma.propriete= 2 :
+ * * RegExp data-value = (\d+) et dataproviderExpression = /user/$1 l'attribut dataProvider vaudra "/user/2"
+ * * url-pattern data-value = :id et dataproviderExpression = /user/:id l'attribut dataProvider vaudra "/user/2"
+ *
+ */
 export declare class SonicStates extends SonicStates_base {
     state: string;
     inverted: Boolean;
     statePath: string;
-    onAssign: ((value: any) => void) | null;
-    statePublisher: any;
+    onAssign: (value: string) => void;
+    statePublisher?: TypeAndRecordOfType<PublisherInterface<string & Record<string, any>>>;
     connectedCallback(): void;
     disconnectedCallback(): void;
     render(): import("lit-html").TemplateResult<1>;

package/core/components/functional/states/states.js

@@ -12,6 +12,7 @@ import { repeat } from "lit/directives/repeat.js";
 import Objects from "@supersoniks/concorde/core/utils/Objects";
 import UrlPattern from "url-pattern";
 import TemplatesContainer from "@supersoniks/concorde/core/mixins/TemplatesContainer";
+const tagName = "sonic-states";
 /**
  * ### sonic-states affiche des états différents en fonction de la valeur d'une sous propriété de son dataProvider (attribut data-path en dot notation):
  * * Il boucle sur ses template enfants et test si la regexp contenue dans l'attribut *data-value* match la valeur de la propriété
@@ -27,14 +28,16 @@ import TemplatesContainer from "@supersoniks/concorde/core/mixins/TemplatesConta
  * * url-pattern data-value = :id et dataproviderExpression = /user/:id l'attribut dataProvider vaudra "/user/2"
  *
  */
-const tagName = "sonic-states";
 let SonicStates = class SonicStates extends Subscriber(TemplatesContainer(LitElement)) {
     constructor() {
         super(...arguments);
         this.state = "";
         this.inverted = false;
         this.statePath = "";
-        this.onAssign = null;
+        this.onAssign = (value) => {
+            this.state = value;
+            this.requestUpdate();
+        };
     }
     connectedCallback() {
         super.connectedCallback();
@@ -47,16 +50,13 @@ let SonicStates = class SonicStates extends Subscriber(TemplatesContainer(LitEle
             for (let s of split) {
                 this.statePublisher = this.statePublisher[s];
             }
-            this.onAssign = (value) => {
-                this.state = value;
-                this.requestUpdate();
-            };
             this.statePublisher.onAssign(this.onAssign);
         }
     }
     disconnectedCallback() {
+        var _a;
         if (this.statePath)
-            this.statePublisher.offAssign(this.onAssign);
+            (_a = this.statePublisher) === null || _a === void 0 ? void 0 : _a.offAssign(this.onAssign);
         super.disconnectedCallback();
     }
     render() {
@@ -133,8 +133,3 @@ SonicStates = __decorate([
     customElement(tagName)
 ], SonicStates);
 export { SonicStates };
-//Ajout pour custom-elements-manifesy pour storybook notamment
-try {
-    customElements.define(tagName, SonicStates);
-}
-catch (e) { }