@supersoniks/concorde 1.1.44 → 1.1.46

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

@@ -19,7 +19,7 @@ declare const Fetch_base: {
         onInvalidate?: (() => void) | undefined;
         disconnectedCallback(): void;
         connectedCallback(): void;
-        firstUpdated(): void;
+        handleLazyLoad(): void;
         onIntersection(entries: IntersectionObserverEntry[]): void;
         propertyMap: object;
         isConnected: boolean;
@@ -45,6 +45,7 @@ declare const Fetch_base: {
         requestUpdate(): void;
         getAttribute(name: string): string;
         hasAttribute(attributeName: string): boolean;
+        getBoundingClientRect(): DOMRect;
     };
 } & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & typeof LitElement;
 /**

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

@@ -24,7 +24,7 @@ declare const List_base: {
         onInvalidate?: (() => void) | undefined;
         disconnectedCallback(): void;
         connectedCallback(): void;
-        firstUpdated(): void;
+        handleLazyLoad(): void;
         onIntersection(entries: IntersectionObserverEntry[]): void;
         propertyMap: object;
         isConnected: boolean;
@@ -50,6 +50,7 @@ declare const List_base: {
         requestUpdate(): void;
         getAttribute(name: string): string;
         hasAttribute(attributeName: string): boolean;
+        getBoundingClientRect(): DOMRect;
     };
 } & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
 /**
@@ -81,6 +82,7 @@ export declare class List extends List_base {
      */
     idKey: string;
     connectedCallback(): void;
+    disconnectedCallback(): void;
     renderLoadingState(): DirectiveResult<typeof TemplateContentDirective> | TemplateResult;
     renderNoResultState(): TemplateResult<1>;
     formatProps(): (import("../../../_types/types").CoreJSType[] & {

package/core/components/functional/list/list.js

@@ -53,6 +53,9 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
             this.isLoading = true;
         super.connectedCallback();
     }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+    }
     renderLoadingState() {
         return this.templateParts["skeleton"]
             ? templateContent(this.templateParts["skeleton"])
@@ -85,7 +88,7 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
                 props = Object.entries(props).map(([k, v]) => ({ key: k, value: v }));
             }
             else {
-                if (!response || response.ok)
+                if (Objects.isObject(props) && Object.keys(props).length > 0 && (!response || response.ok))
                     props = [props];
                 else {
                     props = [];
@@ -138,14 +141,16 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
       ${props === null || props === void 0 ? void 0 : props.map((item, index) => {
             if (item == null)
                 return nothing;
-            if (typeof item != "object" || Array.isArray(item))
-                return nothing;
-            const templatePartName = item[this.templateKey];
             let templatePart = null;
-            if (templatePartName && typeof templatePartName == "string") {
-                templatePart = this.templateParts[templatePartName];
+            let key = index;
+            if (typeof item == "object" && !Array.isArray(item)) {
+                const templatePartName = item[this.templateKey];
+                if (templatePartName && typeof templatePartName == "string") {
+                    templatePart = this.templateParts[templatePartName];
+                }
+                if (extractValues)
+                    key = item === null || item === void 0 ? void 0 : item["key"];
             }
-            const key = extractValues ? item === null || item === void 0 ? void 0 : item[this.idKey] : index;
             if (key == "_sonic_http_response_")
                 return nothing;
             if (typeof key != "string" && typeof key != "number")

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

@@ -3,6 +3,7 @@ import "@supersoniks/concorde/core/components/functional/list/list";
 import { PublisherProxy } from "@supersoniks/concorde/core/utils/PublisherProxy";
 type QueueItem = {
     id: string;
+    endPoint: string;
     dataProvider: string;
     offset: number;
     limit: number;
@@ -14,7 +15,7 @@ declare const Queue_base: (new (...args: any[]) => import("@supersoniks/concorde
 /**
  *### Une Queue charge du contenu par lot selon l'expression renseignée dans l'attribut *dataProviderExpression*.
  * * Chaque lot est chargé par un composant [List](./?path=/docs/core-components-functional-list-list--basic) dont le dataProvider créé à partir de l'attribut dataProviderExpression
- * * A l'initialisation elle regarde l'attribut dataFilterProvider qui donne l'adresse d'un [publisher](./?path=/docs/how-to-🥨-dialogue-inter-composant--page)
+ * * A l'initialisation elle regarde l'attribut dataFilterProvider qui donne l'adresse d'un publisher
  * Si cet attribut est touvé, Queue écoute le publisher fourni et se réinitialise à chaque modification du contenu de celui-ci.
  * Les valeurs renseignées dans ce publisher sont ajoutées en get à chaque requête
  * * la proriété *key* peut être utilisé pour cibler une propriété particulière du retour de l'api.
@@ -27,19 +28,25 @@ export default class Queue extends Queue_base {
     /**
      * Durée cible en ms d'une requête pour afficher 1 lot.
      */
+    cache: RequestCache;
     targetRequestDuration: number;
     limit: number;
+    lazyBoundsRatio: number;
     offset: number;
     resultCount: number;
+    noLazyload: boolean;
     filteredFields: string;
     disconnectedCallback(): void;
     static instanceCounter: number;
-    connectedCallback(): void;
+    instanceId: number;
+    localStorage: string;
+    connectedCallback(): Promise<void>;
     filterPublisher: PublisherProxy | null;
     configFilter(): void;
     filterTimeoutId?: ReturnType<typeof setTimeout>;
     searchHash: string;
     requestId: number;
+    isFirstRequest: boolean;
     updateFilteredContent(): void;
     /**
      * Cette expression est utilisée comme modèle par le composant Queue pour renseigngner le dataProvider de la [liste](./?path=/docs/core-components-functional-list-list--basic) créée.

package/core/components/functional/queue/queue.js

@@ -4,11 +4,20 @@ 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;
 };
+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());
+    });
+};
 var Queue_1;
 import { html, LitElement, nothing } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
-import { repeat } from "lit/directives/repeat.js";
+import { map } from "lit/directives/map.js";
 import { PublisherManager } from "@supersoniks/concorde/core/utils/PublisherProxy";
 import "@supersoniks/concorde/core/components/functional/list/list";
 import { HTML } from "@supersoniks/concorde/utils";
@@ -16,7 +25,7 @@ const tagName = "sonic-queue";
 /**
  *### Une Queue charge du contenu par lot selon l'expression renseignée dans l'attribut *dataProviderExpression*.
  * * Chaque lot est chargé par un composant [List](./?path=/docs/core-components-functional-list-list--basic) dont le dataProvider créé à partir de l'attribut dataProviderExpression
- * * A l'initialisation elle regarde l'attribut dataFilterProvider qui donne l'adresse d'un [publisher](./?path=/docs/how-to-🥨-dialogue-inter-composant--page)
+ * * A l'initialisation elle regarde l'attribut dataFilterProvider qui donne l'adresse d'un publisher
  * Si cet attribut est touvé, Queue écoute le publisher fourni et se réinitialise à chaque modification du contenu de celui-ci.
  * Les valeurs renseignées dans ce publisher sont ajoutées en get à chaque requête
  * * la proriété *key* peut être utilisé pour cibler une propriété particulière du retour de l'api.
@@ -31,18 +40,24 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
         /**
          * Durée cible en ms d'une requête pour afficher 1 lot.
          */
+        this.cache = "default";
         this.targetRequestDuration = 500;
         /*
          * Quantité d'éléments devant être chargés dans le premier lot.
          * Cette valeur est mise à jour ensuite par Queue pour chauq lot pour se rapprocher tanque possible de *targetRequestDuration*
          */
         this.limit = 5;
+        this.lazyBoundsRatio = 1;
         this.offset = 0;
         this.resultCount = 0;
+        this.noLazyload = false;
         this.filteredFields = "";
+        this.instanceId = 0;
+        this.localStorage = "disabled";
         this.filterPublisher = null;
         this.searchHash = "";
         this.requestId = 0;
+        this.isFirstRequest = true;
         /**
          * Cette expression est utilisée comme modèle par le composant Queue pour renseigngner le dataProvider de la [liste](./?path=/docs/core-components-functional-list-list--basic) créée.
          * * l'expression *$offset* est alors remplacée par le numéro de l'élément à partir duquel démarrer
@@ -63,33 +78,47 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
         return;
     }
     connectedCallback() {
-        this.noShadowDom = "";
-        this.defferedDebug = this.hasAttribute("debug") || null;
-        /**Compat avec states et routing **/
-        if (!this.dataProviderExpression) {
-            this.dataProviderExpression = HTML.getAncestorAttributeValue(this.parentElement, "dataProvider") || "";
-        }
-        if (!this.dataProvider)
-            this.dataProvider = "sonic-queue-" + Queue_1.instanceCounter++;
-        this.configFilter();
-        super.connectedCallback();
-        this.key = this.getAttribute("key");
-        if (!this.templates)
-            this.templates = Array.from(this.querySelectorAll("template"));
-        this.lastRequestTime = new Date().getTime();
-        let func = window.requestAnimationFrame;
-        func(() => this.next());
+        const _super = Object.create(null, {
+            connectedCallback: { get: () => super.connectedCallback }
+        });
+        return __awaiter(this, void 0, void 0, function* () {
+            this.instanceId = Queue_1.instanceCounter++;
+            this.localStorage = this.getAttribute("localStorage") || this.localStorage;
+            this.removeAttribute("localStorage");
+            this.noShadowDom = "";
+            this.defferedDebug = this.hasAttribute("debug") || null;
+            /**Compat avec states et routing **/
+            if (!this.dataProvider)
+                this.dataProvider =
+                    this.dataProviderExpression ||
+                        "sonic-queue-" +
+                            this.instanceId +
+                            "-" +
+                            Math.random().toString(36).substring(7);
+            if (!this.dataProviderExpression) {
+                this.dataProviderExpression =
+                    HTML.getAncestorAttributeValue(this.parentElement, "dataProvider") ||
+                        "";
+            }
+            _super.connectedCallback.call(this);
+            this.key = this.getAttribute("key");
+            if (!this.templates)
+                this.templates = Array.from(this.querySelectorAll("template"));
+            this.lastRequestTime = new Date().getTime();
+            yield PublisherManager.getInstance().isLocalStrorageReady;
+            this.configFilter();
+        });
     }
     configFilter() {
         var _a;
         const dataFilterProvider = this.getAncestorAttributeValue("dataFilterProvider");
-        if (!dataFilterProvider)
+        if (!dataFilterProvider) {
+            this.next();
             return;
-        this.filterPublisher = PublisherManager.getInstance().get(dataFilterProvider);
+        }
+        this.filterPublisher =
+            PublisherManager.getInstance().get(dataFilterProvider);
         (_a = this.filterPublisher) === null || _a === void 0 ? void 0 : _a.onInternalMutation(() => {
-            var _a;
-            if (Object.keys((_a = this.filterPublisher) === null || _a === void 0 ? void 0 : _a.get()).length == 0)
-                return;
             this.updateFilteredContent();
         });
     }
@@ -101,19 +130,21 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
         const dataProvider = this.dataProviderExpression;
         const split = dataProvider.split("?");
         split.shift();
-        let searchParams = new URLSearchParams(split.join("?"));
-        let filterData = (_a = this.filterPublisher) === null || _a === void 0 ? void 0 : _a.get();
-        let filteredFieldsArray = this.filteredFields.split(" ");
-        for (let f in filterData) {
+        const searchParams = new URLSearchParams(split.join("?"));
+        const filterData = (_a = this.filterPublisher) === null || _a === void 0 ? void 0 : _a.get();
+        const filteredFieldsArray = this.filteredFields.split(" ");
+        for (const f in filterData) {
             let value = filterData[f];
             if (Array.isArray(value))
                 value = value.filter((v) => v !== null);
-            if ((this.filteredFields && !filteredFieldsArray.includes(f)) || value == null || value.toString() === "")
+            if ((this.filteredFields && !filteredFieldsArray.includes(f)) ||
+                value == null ||
+                value.toString() === "")
                 continue;
             searchParams.set(f, filterData[f].toString());
         }
         const searchHash = searchParams.toString();
-        if (searchHash == this.searchHash)
+        if (searchHash == this.searchHash && !this.isFirstRequest)
             return;
         this.searchHash = searchHash;
         /**
@@ -124,20 +155,22 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
         }
         this.listDataProviders = [];
         clearTimeout(this.filterTimeoutId);
-        this.filterTimeoutId = setTimeout(() => {
+        this.filterTimeoutId = setTimeout(() => __awaiter(this, void 0, void 0, function* () {
             const count = this.resultCount;
             this.props = null;
             //On garde le décompte au cas ou il n'y aurait pas rechargement
-            this.resultCount = count;
             this.requestId++;
-            this.next();
-        }, 250);
+            this.resultCount = count;
+            yield PublisherManager.getInstance().isLocalStrorageReady;
+            window.requestAnimationFrame(() => this.next());
+        }), this.isFirstRequest ? 0 : 400);
+        this.isFirstRequest = false;
     }
     resetDuration() {
         this.lastRequestTime = new Date().getTime();
     }
     next(e) {
-        var _a, _b;
+        var _a;
         let offset = this.offset;
         const newTime = new Date().getTime();
         const requestDuration = newTime - this.lastRequestTime;
@@ -146,14 +179,17 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
          * Un ne repasse donc à 0 qu'à partir du premier chargement.
          * */
         if (!this.nextHadEvent && e) {
+            this.publisher.resultCount = 0;
             this.resultCount = 0;
         }
         this.nextHadEvent = !!e;
         if (e) {
-            if (e.detail.requestId != this.requestId)
+            if (e.detail.requestId < this.requestId)
                 return;
             this.resultCount += e.detail.props.length;
-            if (!e.detail.isFirstLoad || !e.detail.props.length || this.dataProviderExpression.indexOf("$offset") == -1) {
+            if (!e.detail.isFirstLoad ||
+                !e.detail.props.length ||
+                this.dataProviderExpression.indexOf("$offset") == -1) {
                 this.publisher.resultCount = this.resultCount;
                 return;
             }
@@ -166,22 +202,27 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
         else {
             const props = this.props;
             const item = props[props.length - 1];
-            offset = parseInt(item.offset.toString()) + parseInt(item.limit.toString());
+            offset =
+                parseInt(item.offset.toString()) + parseInt(item.limit.toString());
         }
-        if (requestDuration > 0 && e)
+        if (requestDuration > 0 && e && !this.localStorage)
             this.limit = Math.round((this.limit / requestDuration) * this.targetRequestDuration);
         if (this.limit < 1)
             this.limit = 1;
         if (this.limit > 15)
             this.limit = 15;
-        let dataProvider = this.dataProviderExpression.replace("$offset", offset + "").replace("$limit", this.limit + "");
+        let dataProvider = this.dataProviderExpression
+            .replace("$offset", offset + "")
+            .replace("$limit", this.limit + "");
         const split = dataProvider.split("?");
         const endpoint = split.shift();
         const searchParams = new URLSearchParams(split.join("?"));
         const filterData = (_a = this.filterPublisher) === null || _a === void 0 ? void 0 : _a.get();
         const filteredFieldsArray = this.filteredFields.split(" ");
         for (const f in filterData) {
-            if ((this.filteredFields && !filteredFieldsArray.includes(f)) || filterData[f] == null)
+            if ((this.filteredFields && filteredFieldsArray.includes(f)) ||
+                filterData[f] == null ||
+                filterData[f] == "")
                 continue;
             searchParams.set(f, filterData[f]);
         }
@@ -189,12 +230,13 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
             this.searchHash = searchParams.toString();
         dataProvider = endpoint + "?" + searchParams.toString();
         this.listDataProviders.push(dataProvider);
-        this.currentScrollPosition = (_b = document.scrollingElement) === null || _b === void 0 ? void 0 : _b.scrollTop;
+        // this.currentScrollPosition = document.scrollingElement?.scrollTop;
         const newProps = [
             ...this.props,
             {
                 id: searchParams.toString() + "/" + this.props.length,
-                dataProvider: dataProvider,
+                dataProvider: dataProvider + "_item_from_queue_" + this.instanceId,
+                endPoint: dataProvider,
                 offset: offset,
                 limit: this.limit,
             },
@@ -204,36 +246,49 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
         this.lastRequestTime = new Date().getTime();
     }
     render() {
-        if (this.currentScrollPosition) {
-            window.requestAnimationFrame(() => {
-                if (document.scrollingElement && this.currentScrollPosition != undefined)
-                    document.scrollingElement.scrollTop = this.currentScrollPosition;
-                this.currentScrollPosition = undefined;
-            });
-        }
+        /**
+         * supression du retablisment de la scroll pos.
+         **/
+        // if (this.currentScrollPosition) {
+        //   window.requestAnimationFrame(() => {
+        //     if (document.scrollingElement && this.currentScrollPosition != undefined)
+        //       document.scrollingElement.scrollTop = this.currentScrollPosition;
+        //     this.currentScrollPosition = undefined;
+        //   });
+        // }
         if (!Array.isArray(this.props))
             return nothing;
+        let lazyload = !this.noLazyload;
+        if (this.props.length == 1) {
+            lazyload = false;
+        }
         return html `
-      ${repeat(this.props, (item) => item.id, (item, index) => {
+      ${map(this.props, (item, index) => {
             var _a;
-            const templates = index == 0 ? this.templates : (_a = this.templates) === null || _a === void 0 ? void 0 : _a.filter((elt) => elt.getAttribute("data-value") != "no-item");
+            const templates = index == 0
+                ? this.templates
+                : (_a = this.templates) === null || _a === void 0 ? void 0 : _a.filter((elt) => elt.getAttribute("data-value") != "no-item");
             return html `
-            <sonic-list
-              fetch
-              displayContents
-              lazyload
-              requestId=${this.requestId}
-              .itemPropertyMap=${this.itemPropertyMap}
-              ?debug=${this.defferedDebug === true}
-              @load=${this.next}
-              key=${this.key}
-              @loading=${this.resetDuration}
-              dataProvider="${item.dataProvider}"
-              idKey=${this.idKey}
-              .templates=${templates}
-            >
-            </sonic-list>
-          `;
+          <sonic-list
+            fetch
+            cache=${this.cache}
+            displayContents
+            lazyBoundsRatio=${this.lazyBoundsRatio}
+            ?lazyload=${lazyload}
+            localStorage=${this.localStorage}
+            requestId=${this.requestId}
+            .itemPropertyMap=${this.itemPropertyMap}
+            ?debug=${this.defferedDebug === true}
+            @load=${this.next}
+            key=${this.key}
+            @loading=${this.resetDuration}
+            dataProvider="${item.dataProvider}"
+            endPoint="${item.endPoint}"
+            idKey=${this.idKey}
+            .templates=${templates}
+          >
+          </sonic-list>
+        `;
         })}
     `;
     }
@@ -245,18 +300,27 @@ __decorate([
 __decorate([
     property({ type: Object })
 ], Queue.prototype, "itemPropertyMap", void 0);
+__decorate([
+    property()
+], Queue.prototype, "cache", void 0);
 __decorate([
     property()
 ], Queue.prototype, "targetRequestDuration", void 0);
 __decorate([
     property()
 ], Queue.prototype, "limit", void 0);
+__decorate([
+    property()
+], Queue.prototype, "lazyBoundsRatio", void 0);
 __decorate([
     property()
 ], Queue.prototype, "offset", void 0);
 __decorate([
     property()
 ], Queue.prototype, "resultCount", void 0);
+__decorate([
+    property({ type: Boolean })
+], Queue.prototype, "noLazyload", void 0);
 __decorate([
     property()
 ], Queue.prototype, "filteredFields", void 0);

package/core/components/functional/router/router.js

@@ -54,13 +54,22 @@ let SonicRouter = class SonicRouter extends Subscriber(TemplatesContainer(LitEle
         for (const t of this.templatePartsList) {
             const path = t.getAttribute(this.templateValueAttribute) || "";
             const regexp = new RegExp(path);
-            const urlPattern = new UrlPattern(path);
             if (regexp.test(this.location)) {
                 templates.push(t);
             }
-            else if (urlPattern.match(this.location)) {
-                t.setAttribute("mode", "patternMatching");
-                templates.push(t);
+            else {
+                try {
+                    if (new UrlPattern(path).match(this.location)) {
+                        t.setAttribute("mode", "patternMatching");
+                        templates.push(t);
+                    }
+                }
+                catch (e) {
+                    if (this.location.indexOf(path.replace(document.location.origin, "")) != -1) {
+                        templates.push(t);
+                    }
+                    ;
+                }
             }
         }
         return html `${repeat(templates, (template, index) => {

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

@@ -19,7 +19,7 @@ declare const SonicSDUI_base: {
         onInvalidate?: (() => void) | undefined;
         disconnectedCallback(): void;
         connectedCallback(): void;
-        firstUpdated(): void;
+        handleLazyLoad(): void;
         onIntersection(entries: IntersectionObserverEntry[]): void;
         propertyMap: object;
         isConnected: boolean;
@@ -45,6 +45,7 @@ declare const SonicSDUI_base: {
         requestUpdate(): void;
         getAttribute(name: string): string;
         hasAttribute(attributeName: string): boolean;
+        getBoundingClientRect(): DOMRect;
     };
 } & (new (...args: any[]) => import("../../../mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & typeof LitElement;
 /**
@@ -55,7 +56,7 @@ declare const SonicSDUI_base: {
  * * 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.
  * * Le format du JSON est décrit par le type SDUIDescriptor
- * * Un attribut supplémentaire `transformation` permet de transformer le json reçu avant la générationd e l'interface utilisateur<br>
+ * * Un attribut supplémentaire `transformation` permet de transformer le json reçu avant la génération de l'interface utilisateur<br>
  * Son format est décrit par le type SDUITransformDescription
  *
  *  * Si le résultat de la requête est un objet, il est imbriqué dans un tableau pour garantir le fonctionnement.<br>

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

@@ -28,7 +28,7 @@ const tagName = "sonic-sdui"; // For Astro.build
  * * 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.
  * * Le format du JSON est décrit par le type SDUIDescriptor
- * * Un attribut supplémentaire `transformation` permet de transformer le json reçu avant la générationd e l'interface utilisateur<br>
+ * * Un attribut supplémentaire `transformation` permet de transformer le json reçu avant la génération de l'interface utilisateur<br>
  * Son format est décrit par le type SDUITransformDescription
  *
  *  * Si le résultat de la requête est un objet, il est imbriqué dans un tableau pour garantir le fonctionnement.<br>

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

@@ -40,6 +40,7 @@ let SonicStates = class SonicStates extends Subscriber(TemplatesContainer(LitEle
         };
     }
     connectedCallback() {
+        this.noShadowDom = "";
         super.connectedCallback();
         if (this.hasAttribute("data-path")) {
             this.statePath = this.getAttribute("data-path");

package/core/components/functional/value/value.js

@@ -15,9 +15,10 @@ let SonicValue = class SonicValue extends Subscriber(LitElement) {
         super.connectedCallback();
     }
     render() {
-        if (typeof this.props !== "string")
+        if (typeof this.props === "object" || this.props === undefined)
             return html `<slot name="prefix"></slot><slot></slot><slot name="suffix"></slot>`;
-        return html `${unsafeHTML(this.props)}<slot name="prefix"></slot><slot></slot><slot name="suffix"></slot>`;
+        return html `${unsafeHTML(this.props.toString())}<slot name="prefix"></slot><slot></slot
+      ><slot name="suffix"></slot>`;
     }
 };
 SonicValue = __decorate([

package/core/components/ui/alert/alert.d.ts

@@ -9,12 +9,15 @@ export declare class Alert extends LitElement {
      * Titre du message d'erreur
      */
     label: string;
+    noIcon: boolean;
     /**
      * Peut être renseigné dans le slot pour créer des messages plus complexes
      */
     text: string;
     size?: "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+    dismissible: boolean;
     background: boolean;
     status: "default" | "error" | "warning" | "primary" | "info";
     render(): import("lit-html").TemplateResult<1>;
+    close(): void;
 }