@supersoniks/concorde 1.1.7 → 1.1.10

package/core/components/ui/table/table-tbody.d.ts

@@ -0,0 +1,5 @@
+import { LitElement } from "lit";
+export declare class TableTbody extends LitElement {
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}

package/core/components/ui/table/table-tbody.js

@@ -0,0 +1,37 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 { html, LitElement, css } from "lit";
+import { customElement } from "lit/decorators.js";
+let TableTbody = class TableTbody extends LitElement {
+    render() {
+        return html `<tbody><slot></slot></tbody>`;
+    }
+};
+TableTbody.styles = [
+    css `
+      :host {
+        display: contents;
+      }
+
+      ::slotted(sonic-tr:nth-child(odd)){
+        background:var(--sc-base-50);
+      }
+      
+      ::slotted(sonic-tr:hover) {
+        background:var(--sc-base-100);
+      }
+
+      ::slotted(sonic-tr:not(:last-child)){
+        border-bottom:var(--sc-form-border-width) solid var(--sc-base-200) !important;
+      }
+
+    `
+];
+TableTbody = __decorate([
+    customElement("sonic-tbody")
+], TableTbody);
+export { TableTbody };

package/core/components/ui/table/table-td.d.ts

@@ -0,0 +1,7 @@
+import { LitElement } from "lit";
+export declare class TableTd extends LitElement {
+    static styles: import("lit").CSSResult[];
+    colSpan: number | null;
+    rowSpan: number | null;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/core/components/ui/table/table-td.js

@@ -0,0 +1,45 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 { html, LitElement, css } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { ifDefined } from "lit/directives/if-defined.js";
+let TableTd = class TableTd extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.colSpan = null;
+        this.rowSpan = null;
+    }
+    render() {
+        return html `<td
+      colspan=${ifDefined(this.colSpan)}
+      rowspan=${ifDefined(this.rowSpan)}
+      part="td"
+      ><slot></slot></td>`;
+    }
+};
+TableTd.styles = [
+    css `
+      :host {
+        display: contents;
+      }
+
+      td {
+        text-transform:var(--sc-th-tt);
+        text-align:inherit;
+        padding:.3em .5em;
+      }`
+];
+__decorate([
+    property({ type: Number })
+], TableTd.prototype, "colSpan", void 0);
+__decorate([
+    property({ type: Number })
+], TableTd.prototype, "rowSpan", void 0);
+TableTd = __decorate([
+    customElement("sonic-td")
+], TableTd);
+export { TableTd };

package/core/components/ui/table/table-tfoot.d.ts

@@ -0,0 +1,5 @@
+import { LitElement } from "lit";
+export declare class TableTfoot extends LitElement {
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}

package/core/components/ui/table/table-tfoot.js

@@ -0,0 +1,23 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 { html, LitElement, css } from "lit";
+import { customElement } from "lit/decorators.js";
+let TableTfoot = class TableTfoot extends LitElement {
+    render() {
+        return html `<tfoot><slot></slot></tfoot>`;
+    }
+};
+TableTfoot.styles = [
+    css `
+      :host {
+        display: contents;
+      }`
+];
+TableTfoot = __decorate([
+    customElement("sonic-tfoot")
+], TableTfoot);
+export { TableTfoot };

package/core/components/ui/table/table-th.d.ts

@@ -0,0 +1,6 @@
+import { LitElement } from "lit";
+export declare class TableTh extends LitElement {
+    static styles: import("lit").CSSResult[];
+    align: "left" | "right" | "left" | "center";
+    render(): import("lit-html").TemplateResult<1>;
+}

package/core/components/ui/table/table-th.js

@@ -0,0 +1,43 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 { html, LitElement, css } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { styleMap } from "lit/directives/style-map.js";
+let TableTh = class TableTh extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.align = "left";
+    }
+    render() {
+        const styles = {
+            textAlign: this.align,
+        };
+        return html `<th part="th" style=${styleMap(styles)} ><slot></slot></th>
+    `;
+    }
+};
+TableTh.styles = [
+    css `
+      :host {
+        display: contents;
+        --sc-th-tt:uppercase;
+      }
+
+      th {
+        text-transform:var(--sc-th-tt);
+        text-align:inherit;
+        padding:.3em .5em;
+      }
+    `
+];
+__decorate([
+    property({ type: String, reflect: true })
+], TableTh.prototype, "align", void 0);
+TableTh = __decorate([
+    customElement("sonic-th")
+], TableTh);
+export { TableTh };

package/core/components/ui/table/table-thead.d.ts

@@ -0,0 +1,5 @@
+import { LitElement } from "lit";
+export declare class TableThead extends LitElement {
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}

package/core/components/ui/table/table-thead.js

@@ -0,0 +1,24 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 { html, LitElement, css } from "lit";
+import { customElement } from "lit/decorators.js";
+let TableThead = class TableThead extends LitElement {
+    render() {
+        return html `<slot></slot>`;
+    }
+};
+TableThead.styles = [
+    css `
+      :host {
+        display: table-row-group;
+      }
+    `
+];
+TableThead = __decorate([
+    customElement("sonic-thead")
+], TableThead);
+export { TableThead };

package/core/components/ui/table/table-tr.d.ts

@@ -0,0 +1,5 @@
+import { LitElement } from "lit";
+export declare class TableTr extends LitElement {
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}

package/core/components/ui/table/table-tr.js

@@ -0,0 +1,24 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 { html, LitElement, css } from "lit";
+import { customElement } from "lit/decorators.js";
+let TableTr = class TableTr extends LitElement {
+    render() {
+        return html `<slot></slot>`;
+    }
+};
+TableTr.styles = [
+    css `
+      :host {
+        display: table-row;
+      }
+    `
+];
+TableTr = __decorate([
+    customElement("sonic-tr")
+], TableTr);
+export { TableTr };

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

@@ -0,0 +1,16 @@
+import { LitElement } from "lit";
+import "./table-tr.ts";
+import "./table-th.ts";
+import "./table-td.ts";
+import "./table-thead.ts";
+import "./table-tbody.ts";
+import "./table-tfoot.ts";
+import "./table-caption.ts";
+export declare class Table extends LitElement {
+    static styles: import("lit").CSSResult[];
+    size: "xs" | "sm" | "md" | "lg" | "xl";
+    striped: boolean;
+    sticky: boolean;
+    hover: boolean;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/core/components/ui/table/table.js

@@ -0,0 +1,88 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 { html, LitElement, css } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import "./table-tr.ts";
+import "./table-th.ts";
+import "./table-td.ts";
+import "./table-thead.ts";
+import "./table-tbody.ts";
+import "./table-tfoot.ts";
+import "./table-caption.ts";
+let Table = class Table extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.size = "md";
+        this.striped = false;
+        this.sticky = false;
+        this.hover = false;
+    }
+    render() {
+        return html `
+      <div class="table-container">
+        <div class="table" ?striped=${this.striped} ?hover=${this.hover} ?sticky=${this.sticky}>
+          <slot></slot>
+        </div>
+      </div>
+    `;
+    }
+};
+Table.styles = [
+    css `
+      :host {
+        --sc-table-fw: var(--sc-font-weight-base);
+        --sc-table-fst: var(--sc-font-style-base);
+        --sc-table-fs: 1rem;
+        --sc-table-th-fw: bold;
+      }
+
+      .table-container {
+        overflow-x: auto;
+        -webkit-overflow-scrolling: touch;
+      }
+      
+      .table {
+        width: 100%;
+        font-size: var(--sc-table-fs);
+        display: table;
+      }
+
+      /*SIZE*/
+      :host([size="2xs"]) {
+        --sc-table-fs: 0.6rem;
+      }
+      :host([size="xs"]) {
+        --sc-table-fs: 0.75rem;
+      }
+      :host([size="sm"]) {
+        --sc-table-fs: 0.85rem;
+      }
+      :host([size="lg"]) {
+        --sc-table-fs: 1.2rem;
+      }
+      :host([size="xl"]) {
+        --sc-table-fs: 1.5rem;
+      }
+
+    `,
+];
+__decorate([
+    property({ type: String, reflect: true })
+], Table.prototype, "size", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], Table.prototype, "striped", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], Table.prototype, "sticky", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], Table.prototype, "hover", void 0);
+Table = __decorate([
+    customElement("sonic-table")
+], Table);
+export { Table };

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

@@ -4,10 +4,10 @@ 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;
+    --sc-font-style-base: normal;
 
     --sc-headings-font-family: var(--sc-font-family-base);
     --sc-headings-font-style: var(--sc-font-family-base);

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

@@ -12,8 +12,9 @@ const darkCss = css `
   --sc-warning-content: var(--sc-dark-warning-content, #382800);
   --sc-success-content: var(--sc-dark-success-content, #003320);
 
-  --sc-base: var(--sc-dark-base, #1f2937);
-  --sc-base-100: var(--sc-dark-base-100, #262f3d);
+  --sc-base: var(--sc-dark-base, #1d2634);
+  --sc-base-50: var(--sc-dark-base-50, #1f2937);
+  --sc-base-100: var(--sc-dark-base-100, #252C36);
   --sc-base-200: var(--sc-dark-base-200, #2c3543);
   --sc-base-300: var(--sc-dark-base-300, #38414e);
   --sc-base-400: var(--sc-dark-base-400, #515964);

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

@@ -16,6 +16,7 @@ export const light = css `
 
     /*Bases*/
     --sc-base: #fff;
+    --sc-base-50: #f8fafc;
     --sc-base-100: #f1f5f9;
     --sc-base-200: #e2e8f0;
     --sc-base-300: #cbd5e1;

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

@@ -2,6 +2,7 @@ import "./theme/theme";
 import "./badge/badge";
 import "./button/button";
 import "./link/link";
+import "./progress/progress";
 import "./form/input/input";
 import "./form/checkbox/checkbox";
 import "./form/radio/radio";
@@ -25,3 +26,5 @@ import "./toast/toast";
 import "./tooltip/tooltip";
 import "./pop/pop";
 import "./divider/divider";
+import "./card/card";
+import "./table/table";

package/core/components/ui/ui.js

@@ -4,6 +4,7 @@ import "./theme/theme";
 import "./badge/badge";
 import "./button/button";
 import "./link/link";
+import "./progress/progress";
 // FORMS
 import "./form/input/input";
 import "./form/checkbox/checkbox";
@@ -32,3 +33,5 @@ import "./toast/toast";
 import "./tooltip/tooltip";
 import "./pop/pop";
 import "./divider/divider";
+import "./card/card";
+import "./table/table";

package/core/mixins/Fetcher.d.ts

@@ -58,10 +58,7 @@ declare const Fetcher: <T extends Constructor<SubscriberInterface>>(superClass:
         noShadowDom: string | null;
         debug: HTMLElement | null;
         defferedDebug: boolean | null;
-        makeShadow(props: Record<string, any>, value: any): any;
-        dispatchEvent(event: Event): void; /**
-         * IObserver est l'intersection observer qui permet de charger les données au scroll si l'attribut lazyload est renseigné
-         */
+        dispatchEvent(event: Event): void;
         setAttribute(name: string, value: string): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined): 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)
@@ -78,7 +79,7 @@ const Fetcher = (superClass) => {
                 if (hasLoader)
                     Loader.hide();
                 if (this.key) {
-                    data = Objects.traverse(data, this.key.split("."));
+                    data = Objects.traverse(data, this.key.split("."), true);
                 }
                 this.props = data;
                 this.dispatchEvent(new CustomEvent("load", { detail: this }));
@@ -101,7 +102,6 @@ const Fetcher = (superClass) => {
             }
             super.connectedCallback();
             this.key = this.getAncestorAttributeValue("key");
-            this.api = new API(this.getApiConfiguration());
             if (this.props) {
                 this.publisher.set(this.props);
             }

package/core/mixins/FormCheckable.d.ts

@@ -55,7 +55,6 @@ declare const Form: <T extends Constructor<FormElementInterface>>(superClass: T)
         noShadowDom: string | null;
         debug: HTMLElement | null;
         defferedDebug: boolean | null;
-        makeShadow(props: Record<string, any>, value: any): any;
         dispatchEvent(event: Event): void;
         setAttribute(name: string, value: string): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
@@ -65,7 +64,9 @@ 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; /**
+         * comme radio,mais peut être désélectionné après sélection
+         */
         disconnectedCallback(): void;
     };
 } & T;

package/core/mixins/FormInput.d.ts

@@ -31,7 +31,6 @@ declare const Form: <T extends Constructor<FormElementInterface>>(superClass: T)
         noShadowDom: string | null;
         debug: HTMLElement | null;
         defferedDebug: boolean | null;
-        makeShadow(props: Record<string, any>, value: any): any;
         dispatchEvent(event: Event): void;
         setAttribute(name: string, value: string): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;

package/core/mixins/Subscriber.d.ts

@@ -12,7 +12,6 @@ export interface SubscriberInterface {
     noShadowDom: string | null;
     debug: HTMLElement | null;
     defferedDebug: boolean | null;
-    makeShadow(props: Record<string, any>, value: any): any;
     dispatchEvent(event: Event): void;
     setAttribute(name: string, value: string): void;
     addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;

package/core/mixins/Subscriber.js

@@ -92,21 +92,6 @@ const Subscriber = (superClass) => {
             this.onAssign = null;
             this.args = args;
         }
-        /**
-         * retourne un objet contenant les propriétés de value + celle de props si elle ne sont pas déjà dans value.
-         */
-        makeShadow(props, value) {
-            if (typeof value == "object" && value !== null) {
-                let newValue = Array.isArray(value) ? [] : {};
-                Object.assign(newValue, value);
-                value = newValue;
-                for (let key in props) {
-                    if (!value[key])
-                        value[key] = props[key];
-                }
-            }
-            return value;
-        }
         /**
          * va de parent en parent pour trouver un attribut
          * @param attributeName nom de l'attribut

package/core/utils/DataBindObserver.js

@@ -15,12 +15,10 @@ export default class DataBindObserver {
             return;
         this.enabled = false;
         Array.from(DataBindObserver.observedElements.keys()).forEach((k) => DataBindObserver.unObserve(k));
-        console.log("disabled");
     }
     static observe(element) {
         if (!DataBindObserver.enabled)
             return;
-        console.log("Observe");
         if (DataBindObserver.observedElements.has(element))
             return;
         let obs = new MutationObserver(DataBindObserver.onMutation);

package/core/utils/Objects.d.ts

@@ -17,7 +17,8 @@ declare class Objects {
     static isUndefindOrNull(object: any): boolean;
     /**
      * traverse l'objet pour obtenir la valeur a l'adresse donnée via le tableau de clés pathArray.
+     * Si extendValues = true, les propriétés des objets parents sont copiées au fur et a mesure de la descente dans la hierarchie, avant l'assignation des propriétés de l'objet lui même.
      */
-    static traverse(obj: any, pathArray: string[]): any;
+    static traverse(obj: any, pathArray: string[], extendValues?: boolean): any;
 }
 export default Objects;

package/core/utils/Objects.js

@@ -48,14 +48,20 @@ class Objects {
     }
     /**
      * traverse l'objet pour obtenir la valeur a l'adresse donnée via le tableau de clés pathArray.
+     * Si extendValues = true, les propriétés des objets parents sont copiées au fur et a mesure de la descente dans la hierarchie, avant l'assignation des propriétés de l'objet lui même.
      */
-    static traverse(obj, pathArray) {
+    static traverse(obj, pathArray, extendValues = false) {
         for (let key of pathArray) {
             let newObj = obj[key];
             if (newObj === undefined) {
                 return undefined;
             }
-            obj = obj[key];
+            if (extendValues && Objects.isObject(newObj)) {
+                obj = Object.assign(Array.isArray(newObj) ? [] : {}, obj, newObj);
+            }
+            else {
+                obj = obj[key];
+            }
         }
         return obj;
     }