@supersoniks/concorde 3.1.1 → 3.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supersoniks/concorde",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "license": "MIT",
   "type": "module",
   "main": "",

package/src/core/_types/types.ts

@@ -16,6 +16,7 @@ export interface ConcordeWindow extends Window {
   }) => Credential;
   grecaptcha: {
     ready: (handler: () => void) => void;
+    reset: () => void;
     execute: (key: string, options: { action: string }) => Promise<string>;
   };
   SonicModal: any;

package/src/core/components/functional/submit/submit.ts

@@ -110,7 +110,7 @@ export class Submit extends Subscriber(LitElement) {
     formPublisher.isFormValid = true;
     formPublisher.invalidate();
     if (!formPublisher.isFormValid.get()) return;
-    if (this.publisher) this.publisher.disabled = true;
+    this.disabled = true;
     formPublisher.isFormValid;
     // support native html form
     const native = this.hasAttribute("native");
@@ -137,6 +137,7 @@ export class Submit extends Subscriber(LitElement) {
     const dataProvider = this.getAncestorAttributeValue("dataProvider");
     const endPoint = this.endPoint || dataProvider;
     Loader.show();
+
     const sendData = async () => {
       //
       //envoi données
@@ -219,7 +220,7 @@ export class Submit extends Subscriber(LitElement) {
       );
       if (submitResultDataProvider)
         PublisherManager.get(submitResultDataProvider).set(result);
-      if (this.publisher) this.publisher.disabled = null;
+      this.disabled = false;
     };
     const captchaPublisher = headerPublisher?.needsCaptchaValidation.get()
       ? headerPublisher

package/src/core/components/ui/form/input-autocomplete/input-autocomplete.ts

@@ -1,17 +1,27 @@
-import {html, LitElement, css, nothing} from "lit";
-import {customElement, property, queryAssignedNodes, state} from "lit/decorators.js";
-import {FormInput, FormElement, Subscriber, TemplatesContainer} from "@supersoniks/concorde/mixins";
+import { html, LitElement, css, nothing } from "lit";
+import {
+  customElement,
+  property,
+  queryAssignedNodes,
+  state,
+} from "lit/decorators.js";
+import {
+  FormInput,
+  FormElement,
+  Subscriber,
+  TemplatesContainer,
+} from "@supersoniks/concorde/mixins";
 import "@supersoniks/concorde/core/components/ui/form/input/input";
 import "@supersoniks/concorde/core/components/ui/pop/pop";
 import "@supersoniks/concorde/core/components/functional/queue/queue";
 import "@supersoniks/concorde/core/components/ui/menu/menu-item";
-import {ifDefined} from "lit/directives/if-defined.js";
-import {PublisherManager} from "@supersoniks/concorde/utils";
-import {PublisherProxy} from "@supersoniks/concorde/core/utils/PublisherProxy";
-import {Size} from "../../_css/size";
-import {Input} from "@supersoniks/concorde/core/components/ui/form/input/input";
-import {customScroll} from "@supersoniks/concorde/core/components/ui/_css/scroll";
-import {ResizeController} from "@lit-labs/observers/resize-controller.js";
+import { ifDefined } from "lit/directives/if-defined.js";
+import { PublisherManager } from "@supersoniks/concorde/utils";
+import { PublisherProxy } from "@supersoniks/concorde/core/utils/PublisherProxy";
+import { Size } from "../../_css/size";
+import { Input } from "@supersoniks/concorde/core/components/ui/form/input/input";
+import { customScroll } from "@supersoniks/concorde/core/components/ui/_css/scroll";
+import { ResizeController } from "@lit-labs/observers/resize-controller.js";
 
 type ListItem = Record<string, string>;
 
@@ -21,7 +31,9 @@ type ListItem = Record<string, string>;
  * La valeur de cet input est ensuite retransmit au premier via un dataProvider.
  */
 @customElement("sonic-input-autocomplete")
-export class InputAutocomplete extends TemplatesContainer(FormInput(FormElement(Subscriber(LitElement)))) {
+export class InputAutocomplete extends TemplatesContainer(
+  FormInput(FormElement(Subscriber(LitElement)))
+) {
   static styles = [
     customScroll,
     css`
@@ -41,20 +53,20 @@ export class InputAutocomplete extends TemplatesContainer(FormInput(FormElement(
   /**
    * Possibles mutualisation avec text
    */
-  @property({type: String}) size: Size = "md";
-  @property({type: String}) placeholder = "";
+  @property({ type: String }) size: Size = "md";
+  @property({ type: String }) placeholder = "";
   @property() filteredFields = "";
-  @property({type: Boolean}) readonly: boolean | null = null;
+  @property({ type: Boolean }) readonly: boolean | null = null;
 
-  @property({type: String}) dataProviderExpression = "";
-  @property({type: Boolean}) select?: boolean;
-  @property({type: String}) key = "";
+  @property({ type: String }) dataProviderExpression = "";
+  @property({ type: Boolean }) select?: boolean;
+  @property({ type: String }) key = "";
   /** The parameter name to use in dataProviderExpression route */
-  @property({type: String}) searchParameter = "";
+  @property({ type: String }) searchParameter = "";
   /** The property name to search in the dataProviderExpression result, use "_self" if result is a string list */
-  @property({type: String}) propertyName = "";
+  @property({ type: String }) propertyName = "";
 
-  @queryAssignedNodes({slot: "prefix", flatten: true})
+  @queryAssignedNodes({ slot: "prefix", flatten: true })
   slotInputPrefixNodes!: Array<Node>;
 
   @state() hasInputPrefix = false;
@@ -90,7 +102,11 @@ export class InputAutocomplete extends TemplatesContainer(FormInput(FormElement(
       this.lastValidSearch = "";
       return;
     }
-    const found = this.queryQueueListItem(this.queueDataProvider, this.findSelection, this.setSearchFromSelection);
+    const found = this.queryQueueListItem(
+      this.queueDataProvider,
+      this.findSelection,
+      this.setSearchFromSelection
+    );
     // Si la liste de this.queueDataProvider est bien initialisée, mais qu'aucun item ne correspond à la recherche
     // On affiche quand même la valeur dans le champ de recherche, car il provient directement du formDataProvider
     if (found === false) {
@@ -100,31 +116,58 @@ export class InputAutocomplete extends TemplatesContainer(FormInput(FormElement(
   };
 
   private initSearchParameter = () => {
-    this.queryQueueListItem(this.initQueueDataProvider, this.findSelection, this.setSearchFromSelection);
+    this.queryQueueListItem(
+      this.initQueueDataProvider,
+      this.findSelection,
+      this.setSearchFromSelection
+    );
   };
 
   private selectListItem = (listItem: ListItem) => {
-    const value = this.propertyName === "_self" ? listItem : listItem[this.propertyName || this.name];
+    const value =
+      this.propertyName === "_self"
+        ? listItem
+        : listItem[this.propertyName || this.name];
     this.formValuePublisher?.set(value);
   };
 
   private findSearchedItem = (listItem: ListItem) => {
-    const value = this.propertyName === "_self" ? listItem : listItem[this.propertyName || this.searchParameter || this.name];
+    console.log(this.propertyName);
+
+    const value =
+      this.propertyName === "_self"
+        ? listItem
+        : listItem[this.propertyName || this.searchParameter || this.name];
     return value == this.searchPublisher?.get();
   };
 
   private findSelection = (listItem: ListItem) => {
-    const value = this.propertyName === "_self" ? listItem : listItem[this.propertyName || this.name];
+    const value =
+      this.propertyName === "_self"
+        ? listItem
+        : listItem[this.propertyName || this.name];
     return value == this.value;
   };
 
   private setSearchFromSelection = (listItem: ListItem) => {
-    this.lastValidSearch = this.propertyName === "_self" ? listItem : listItem[this.propertyName || this.searchParameter || this.name];
+    this.lastValidSearch =
+      this.propertyName === "_self"
+        ? listItem
+        : listItem[this.searchParameter || this.propertyName || this.name];
     this.searchPublisher?.set(this.lastValidSearch);
   };
   private updateActiveSelection = () => {
-    this.queryQueueListItem(this.queueDataProvider, this.findSearchedItem, this.selectListItem);
-    if (!this.select && this.lastValidSearch && this.lastValidSearch != this.searchPublisher?.get() && this.formValuePublisher?.get()) {
+    this.queryQueueListItem(
+      this.queueDataProvider,
+      this.findSearchedItem,
+      this.selectListItem
+    );
+    if (
+      !this.select &&
+      this.lastValidSearch &&
+      this.lastValidSearch != this.searchPublisher?.get() &&
+      this.formValuePublisher?.get()
+    ) {
       this.formValuePublisher?.set("");
     }
   };
@@ -153,10 +196,14 @@ export class InputAutocomplete extends TemplatesContainer(FormInput(FormElement(
      * Les publishers utilisés plusieurs fois dans la classe son miss en propriétés privées de la classe
      */
     const getPublisher = PublisherManager.get;
-    this.searchPublisher = getPublisher(this.searchDataProvider)[searchParameter];
+    this.searchPublisher = getPublisher(this.searchDataProvider)[
+      searchParameter
+    ];
     this.formValuePublisher = getPublisher(formDataProvider)[this.name];
     this.countPublisher = getPublisher(this.queueDataProvider).resultCount;
-    this.initCountPublisher = getPublisher(this.initQueueDataProvider).resultCount;
+    this.initCountPublisher = getPublisher(
+      this.initQueueDataProvider
+    ).resultCount;
 
     /**
      * Si une valeur est fourrnie a l'initialisation, un queue spécifique appelle le service avec le name founi en paramètre
@@ -198,7 +245,11 @@ export class InputAutocomplete extends TemplatesContainer(FormInput(FormElement(
    *
    * @return bool|undefined True if item found, false otherwise, undefined if result is not a list
    */
-  queryQueueListItem(queueDataProvider: string, itemFinder: (listItem: ListItem) => boolean, itemMutator: (listItem: ListItem) => void) {
+  queryQueueListItem(
+    queueDataProvider: string,
+    itemFinder: (listItem: ListItem) => boolean,
+    itemMutator: (listItem: ListItem) => void
+  ) {
     const queuePublisher = PublisherManager.get(queueDataProvider);
     let listItem: ListItem | undefined;
     const listsDescriptors = queuePublisher.get();
@@ -250,20 +301,35 @@ export class InputAutocomplete extends TemplatesContainer(FormInput(FormElement(
           inlineContent
           size=${this.size}
         >
-          <slot name="prefix" slot="prefix" @slotchange=${this.hasSlotOrProps}></slot>
+          <slot
+            name="prefix"
+            slot="prefix"
+            @slotchange=${this.hasSlotOrProps}
+          ></slot>
 
           ${this.select
-            ? html` <sonic-icon slot="suffix" class="select-chevron" name="nav-arrow-down" .size=${this.size}></sonic-icon> `
+            ? html`
+                <sonic-icon
+                  slot="suffix"
+                  class="select-chevron"
+                  name="nav-arrow-down"
+                  .size=${this.size}
+                ></sonic-icon>
+              `
             : nothing}
         </sonic-input>
-        <sonic-menu slot="content" class="custom-scroll" style="${this.offsetWidth ? `width: ${this.offsetWidth}px` : ""}">
+        <sonic-menu
+          slot="content"
+          class="custom-scroll"
+          style="${this.offsetWidth ? `width: ${this.offsetWidth}px` : ""}"
+        >
           <sonic-queue
             dataProvider="${this.queueDataProvider}"
             filteredFields=${this.filteredFields}
             dataProviderExpression="${this.dataProviderExpression}"
             dataFilterProvider="${this.searchDataProvider}"
             key="${this.key}"
-            .templates=${this.templateList}
+            .templates=${this.templateList.concat(this.templatePartsList)}
             displayContents
           >
           </sonic-queue>

package/src/core/utils/PublisherProxy.ts

@@ -77,8 +77,9 @@ export class PublisherProxy<T = any> {
    * Supprime les écouteurs associés
    */
   delete() {
-    for (const proxy of this._proxies_.values()) {
-      proxy.delete();
+    for (const key in this._proxies_.keys()) {
+      if ((key as string) == "_parent_") continue;
+      this._proxies_.get(key)?.delete();
     }
     this._invalidateListeners_.clear();
     this._assignListeners_.clear();