@supersoniks/concorde 1.1.5 → 1.1.8

package/cli.js

@@ -58,41 +58,6 @@ function enableShortPaths() {
   }
 }
 
-function createConcordeTsApp() {
-  const { execSync } = require('child_process');
-  const runCommand = command => {
-    try {
-      execSync(command, { stdio: "inherit" });
-    } catch (e) {
-      console.error(`Failed to execute ${command}`, e);
-      return false;
-    }
-    return true;
-  }
-  const repoName = process.argv[2];
-  const gitCheckoutCommand = `git clone --depth 1 https://github.com/ladigitale/concorde-ts-starter ${repoName}`;
-  const removeDotGitCommand = `rm -rf ${repoName}/.git`;
-  const installDepsCommand = `cd ${repoName} && yarn install`
-  const enableShortPathCmd = `cd ${repoName} && npx concorde enable-short-paths`;
-  console.log(`Cloning repository with name ${repoName}`);
-  const checkout = runCommand(gitCheckoutCommand)
-  if (!checkout) process.exit(-1);
-  
-  const removeDotGit = runCommand(removeDotGitCommand);
-  if (!removeDotGit) process.exit(-1);
-  
-  console.log(`installing dependencies for ${repoName}`);
-  const installDeps = runCommand(installDepsCommand);
-  if (!installDeps) process.exit(-1);
-  
-  const enableShortPath = runCommand(enableShortPathCmd);
-  if (!enableShortPath) process.exit(-1);
-  
-  
-  console.log("Congratulations! You are ready. Follow the following commands to start");
-  console.log(`cd ${repoName} && yarn dev`);
-
-}
 switch (process.argv[2]) {
   case "enable-short-paths":
     enableShortPaths();
@@ -105,6 +70,5 @@ switch (process.argv[2]) {
     console.log("Usage: npx concorde <command>");
     console.log("Commands:");
     console.log("  enable-short-paths");
-    console.log("  create-concorde-ts-app projectName");
     break;
 }

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

@@ -9,6 +9,7 @@ declare const Fetch_base: {
         isDefaultLoaderEnabled: boolean;
         isFetchEnabled: boolean;
         _fetchData(): Promise<void>;
+        onInvalidate: any;
         disconnectedCallback(): void;
         connectedCallback(): void;
         firstUpdated(): void;
@@ -47,6 +48,7 @@ declare const Fetch_base: {
  * * On peut appler la methode invalidate() sur son publishe pour declencher le rechargement des données
  */
 export declare class Fetch extends Fetch_base {
+    noAutofill: boolean;
     static styles: import("lit").CSSResult[];
     render(): import("lit-html").TemplateResult<1>;
 }

package/core/components/functional/fetch/fetch.js

@@ -20,6 +20,10 @@ import Fetcher from "@supersoniks/concorde/core/mixins/Fetcher";
  * * On peut appler la methode invalidate() sur son publishe pour declencher le rechargement des données
  */
 let Fetch = class Fetch extends Fetcher(Subscriber(LitElement)) {
+    constructor() {
+        super(...arguments);
+        this.noAutofill = true;
+    }
     render() {
         return html `<slot></slot>`;
     }

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

@@ -11,6 +11,7 @@ declare const List_base: {
         isDefaultLoaderEnabled: boolean;
         isFetchEnabled: boolean;
         _fetchData(): Promise<void>;
+        onInvalidate: any;
         disconnectedCallback(): void;
         connectedCallback(): void;
         firstUpdated(): void;
@@ -64,6 +65,6 @@ export declare class List extends List_base {
      */
     idKey: string;
     connectedCallback(): void;
-    render(): import("lit-html").TemplateResult<1>;
+    render(): import("lit-html/directive").DirectiveResult<typeof import("lit-html/directives/template-content").TemplateContentDirective>;
 }
 export {};

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

@@ -48,11 +48,15 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
         this.defferedDebug = this.hasAttribute("debug") || null;
         this.isDefaultLoaderEnabled = false;
         this.isFetchEnabled = this.hasAttribute("fetch");
+        if (this.isFetchEnabled)
+            this.isLoading = true;
         super.connectedCallback();
     }
     render() {
         if (this.isLoading && !Array.isArray(this.props))
-            return html `<sonic-loader mode="inline"></sonic-loader>`;
+            return this.templateParts["skeleton"]
+                ? templateContent(this.templateParts["skeleton"])
+                : html `<sonic-loader mode="inline"></sonic-loader>`;
         // si props est une string on considère qu'il n'y a pas de résultats
         if (typeof this.props == "string") {
             return html `<div class="sonic-no-result-container">
@@ -61,7 +65,7 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
       </div>`;
         }
         // si props est un objet mais qu'il n'y a pas de contenu on retourn une div vide (nécessaire pour le lazyload)
-        if (!Objects.isObject(this.props) || Object.keys(this.props).length == 0) {
+        if (!Objects.isObject(this.props)) {
             return html `<div></div>`;
         }
         let props = this.props;
@@ -75,6 +79,10 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
                 props = [props];
             }
         }
+        // On peut définir un template spécifique si le résultat est un tableau vide
+        if (props.length == 0 && this.templateParts["no-item"]) {
+            return templateContent(this.templateParts["no-item"]);
+        }
         // Resultats
         let templateCount = this.templateList.length;
         let counter = -1;

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

@@ -146,7 +146,10 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement) {
         if (!Array.isArray(this.props))
             return nothing;
         return html `
-      ${repeat(this.props, (item) => item.id, (item) => html `
+      ${repeat(this.props, (item) => item.id, (item, index) => {
+            var _a;
+            let 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
               .itemPropertyMap=${this.itemPropertyMap}
@@ -156,10 +159,11 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement) {
               @loading=${this.resetDuration}
               dataProvider="${item.dataProvider}"
               idKey=${this.idKey}
-              .templates=${this.templates}
+              .templates=${templates}
             >
             </sonic-list>
-          `)}
+          `;
+        })}
     `;
     }
 };

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

@@ -4,6 +4,7 @@ declare const SonicSubscriber_base: (new (...args: any[]) => import("@supersonik
  * Voir la partie dédiée dans *MISCALLENOUS*
  */
 export declare class SonicSubscriber extends SonicSubscriber_base {
+    noAutofill: boolean;
     connectedCallback(): void;
     render(): import("lit-html").TemplateResult<1>;
 }

package/core/components/functional/subscriber/subscriber.js

@@ -11,6 +11,10 @@ import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
  * Voir la partie dédiée dans *MISCALLENOUS*
  */
 let SonicSubscriber = class SonicSubscriber extends Subscriber(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.noAutofill = true;
+    }
     connectedCallback() {
         this.noShadowDom = "";
         super.connectedCallback();

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

@@ -18,7 +18,12 @@ declare const Button_base: {
         updateDataValue(): void;
         error: true | null;
         autofocus: true | null;
-        disabled: true | null;
+        disabled: true | null; /**
+         * Un bouton simple avec deux slots, un nommé préfix et un nomé suffix de manière à pouvoir mettre (par exemple) une icone avant ou après le contenu.
+         * * L'objet et ses slot sont en display flex avec direction / alignement et justifications configurables
+         * * Le bouton est comparable au badge car il possèdent tous les deux les propriétés *type* (primary...), *variant*(outline, ghost), size(xs...)...
+         * * Le bouton possède cependant et notamment une propriété href contrairement à un badge
+         */
         required: true | null;
         formDataProvider: string;
         props: any;
@@ -99,6 +104,10 @@ export declare class Button extends Button_base {
     hasSuffix: boolean;
     prefixes: HTMLElement[];
     suffixes: HTMLElement[];
+    /**
+     * target
+     */
+    target: "_self" | "_blank" | null;
     /**
      * L'url
      */

package/core/components/ui/button/button.js

@@ -11,6 +11,7 @@ import { styleMap } from "lit/directives/style-map.js";
 import FormElement from "@supersoniks/concorde/core/mixins/FormElement";
 import FormCheckable from "@supersoniks/concorde/core/mixins/FormCheckable";
 import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
+import { ifDefined } from "lit/directives/if-defined.js";
 /**
  * Un bouton simple avec deux slots, un nommé préfix et un nomé suffix de manière à pouvoir mettre (par exemple) une icone avant ou après le contenu.
  * * L'objet et ses slot sont en display flex avec direction / alignement et justifications configurables
@@ -65,6 +66,10 @@ let Button = class Button extends FormCheckable(FormElement(Subscriber(LitElemen
         this.loading = false;
         this.hasPrefix = false;
         this.hasSuffix = false;
+        /**
+         * target
+         */
+        this.target = null;
         /**
          * L'url
          */
@@ -155,7 +160,7 @@ let Button = class Button extends FormCheckable(FormElement(Subscriber(LitElemen
       </button>
     `;
         return this.href
-            ? html `<a href="${this.href}" @click=${this.pushState ? this.handlePushState : null}>${btn}</a>`
+            ? html `<a href="${this.href}" target=${ifDefined(this.target)} @click=${this.pushState ? this.handlePushState : null}>${btn}</a>`
             : html `${btn}`;
     }
     onSlotChange() {
@@ -540,6 +545,9 @@ __decorate([
 __decorate([
     queryAssignedElements({ flatten: true, slot: 'suffix' })
 ], Button.prototype, "suffixes", void 0);
+__decorate([
+    property({ type: String })
+], Button.prototype, "target", void 0);
 __decorate([
     property({ type: String })
 ], Button.prototype, "href", null);

package/core/components/ui/theme/theme-collection/core-variables.js

@@ -4,7 +4,7 @@ export const coreVariables = css `
     /* --sc-rfs: 16px; */
 
     /* polices*/
-    --sc-font-family-base: "neue-haas-unica", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto,
+    --sc-font-family-base: "Inter var", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto,
       "Helvetica Neue", Arial, sans-serif;
     --sc-font-weight-base: 400;
     --sc-font-style-base: inherit;

package/core/core.js

@@ -2,6 +2,9 @@ import "./components/functional/functional";
 import "./components/ui/ui";
 import "./mixins/mixins";
 import { PublisherManager } from "@supersoniks/concorde/core/utils/PublisherProxy.mjs";
+import DataBindObserver from "./utils/DataBindObserver";
 let win = window;
-if (!win.PublisherManager)
+if (!win.SonicPublisherManager)
     win.SonicPublisherManager = PublisherManager;
+if (!win.SonicDataBindObserver)
+    win.SonicDataBindObserver = DataBindObserver;

package/core/mixins/Fetcher.d.ts

@@ -38,6 +38,7 @@ declare const Fetcher: <T extends Constructor<SubscriberInterface>>(superClass:
          * Un Toast est affiché si le chargement échoue
          */
         _fetchData(): Promise<void>;
+        onInvalidate: any;
         disconnectedCallback(): void;
         connectedCallback(): void;
         /**

package/core/mixins/Fetcher.js

@@ -56,6 +56,7 @@ const Fetcher = (superClass) => {
             return __awaiter(this, void 0, void 0, function* () {
                 if (!this.isFetchEnabled)
                     return;
+                this.api = new API(this.getApiConfiguration());
                 if (!this.api)
                     return;
                 if (!this.dataProvider)
@@ -89,7 +90,7 @@ const Fetcher = (superClass) => {
         disconnectedCallback() {
             var _a;
             super.disconnectedCallback();
-            (_a = this.publisher) === null || _a === void 0 ? void 0 : _a.offInvalidate(() => this._fetchData());
+            (_a = this.publisher) === null || _a === void 0 ? void 0 : _a.offInvalidate(this.onInvalidate);
             this.isFirstLoad = false;
         }
         connectedCallback() {
@@ -101,11 +102,11 @@ const Fetcher = (superClass) => {
             }
             super.connectedCallback();
             this.key = this.getAncestorAttributeValue("key");
-            this.api = new API(this.getApiConfiguration());
             if (this.props) {
                 this.publisher.set(this.props);
             }
-            (_a = this.publisher) === null || _a === void 0 ? void 0 : _a.onInvalidate(() => this._fetchData());
+            this.onInvalidate = () => this._fetchData();
+            (_a = this.publisher) === null || _a === void 0 ? void 0 : _a.onInvalidate(this.onInvalidate);
             const lazyLoad = this.getAncestorAttributeValue("lazyload");
             if (lazyLoad === null) {
                 this._fetchData();

package/core/mixins/Subscriber.js

@@ -47,6 +47,14 @@ const Subscriber = (superClass) => {
     class SubscriberElement extends superClass {
         constructor(...args) {
             super();
+            /**
+             * noAutoFill permet de désactiver le remplissage automatique des propriétés par le publisher dans le cas ou on utilise "props" seulement ou le dataBinding par exemple
+             */
+            this.noAutoFill = false;
+            /**
+             *
+             */
+            this.renderOnPropsInternalChange = false;
             /**
              * Par défaut on chée un shadow dom mais on peut demander à ne pas en avoir via cette propriété et un attribut associé.
              * Cela se fait à l'initialisation uniquement et n'est pas modifiable lors de la vie du composant.
@@ -179,8 +187,12 @@ const Subscriber = (superClass) => {
         disconnectedCallback() {
             this.removeDebugger();
             super.disconnectedCallback();
-            if (this.publisher)
+            if (this.publisher) {
                 this.publisher.stopTemplateFilling(this);
+                this.publisher.offInternalMutation(this.requestUpdate());
+            }
+            if (this.wordingPublisher)
+                this.wordingPublisher.stopTemplateFilling(this);
             if (this.onAssign)
                 this.publisher.offAssign(this.onAssign);
         }
@@ -263,12 +275,6 @@ const Subscriber = (superClass) => {
             }
             return { serviceURL, token, userName, password, tokenProvider };
         }
-        /**
-         * Initialise le remplisage automatique des traductions / du wording
-         * Un publisher spécifique est créé pour le composant à l'adresse "sonic-wording"
-         * Le composant recherche la valeur de l'attribute "wordingProvider" que contient le point d'accès à l'api de traduction / libellés
-         * Il utilise ce service et le publisher créé pour remplir automatiquement toutes les propriétés préfixées avec "wording_".
-         */
         initWording() {
             return __awaiter(this, void 0, void 0, function* () {
                 let hasWording = false;
@@ -304,6 +310,7 @@ const Subscriber = (superClass) => {
                         }
                     }
                     publisher.startTemplateFilling(this);
+                    this.wordingPublisher = publisher;
                 }
             });
         }
@@ -325,6 +332,7 @@ const Subscriber = (superClass) => {
                 return;
             if (this.publisher) {
                 this.publisher.stopTemplateFilling(this);
+                this.publisher.offInternalMutation(this.requestUpdate);
                 if (this.onAssign)
                     this.publisher.offAssign(this.onAssign);
             }
@@ -355,7 +363,10 @@ const Subscriber = (superClass) => {
                     this.requestUpdate();
                 };
                 this.publisher.onAssign(this.onAssign);
-                this.publisher.startTemplateFilling(this);
+                if (!this.noAutoFill)
+                    this.publisher.startTemplateFilling(this);
+                if (this.renderOnPropsInternalChange)
+                    this.publisher.onInternalMutation(this.requestUpdate);
                 if (this._props) {
                     this.publisher.set(this._props);
                 }

package/core/utils/DataBindObserver.d.ts

@@ -22,6 +22,8 @@ export default class DataBindObserver {
     /**
      * Commencer à observer un élément html.
      */
+    static enabled: boolean;
+    static disable(): void;
     static observe(element: HTMLElement): void;
     /**
      * Arrêter à observer un élément html.

package/core/utils/DataBindObserver.js

@@ -10,10 +10,15 @@ import { PublisherManager } from "@supersoniks/concorde/core/utils/PublisherProx
  * Voir la doc de subscriber à ce sujet car il l'utilise par défaut.
  */
 export default class DataBindObserver {
-    /**
-     * Commencer à observer un élément html.
-     */
+    static disable() {
+        if (!this.enabled)
+            return;
+        this.enabled = false;
+        Array.from(DataBindObserver.observedElements.keys()).forEach((k) => DataBindObserver.unObserve(k));
+    }
     static observe(element) {
+        if (!DataBindObserver.enabled)
+            return;
         if (DataBindObserver.observedElements.has(element))
             return;
         let obs = new MutationObserver(DataBindObserver.onMutation);
@@ -252,5 +257,12 @@ export default class DataBindObserver {
  * Maintient la liste des éléments observés de manière à pouvoir les désinscrire quand ils sont supprimés.
  */
 DataBindObserver.observedElements = new Map();
+/**
+ * Commencer à observer un élément html.
+ */
+DataBindObserver.enabled = true;
 DataBindObserver.publisherListeners = new Map();
 DataBindObserver.observe(document.documentElement);
+let win = window;
+if (!win.SonicDataBindObserver)
+    win.SonicDataBindObserver = DataBindObserver;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supersoniks/concorde",
-  "version": "1.1.5",
+  "version": "1.1.8",
   "customElements": "custom-elements.json",
   "license": "MIT",
   "publishConfig": {
@@ -169,7 +169,5 @@
     "./utils/api": "./core/utils/api",
     "./index": "./index"
   },
-  "bin": {
-    "concorde": "./cli.js"
-  }
+  "bin": "./bin/cli.js"
 }