@supersoniks/concorde 1.1.42 → 1.1.44

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

@@ -1,5 +1,8 @@
 import { LitElement, PropertyValues } from "lit";
-declare const SonicSubscriber_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface) & typeof LitElement;
+declare const SonicSubscriber_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & typeof LitElement;
+/**
+ * Voir la partie dédiée dans *MISCALLENOUS*
+ */
 export declare class SonicSubscriber extends SonicSubscriber_base {
     noAutofill: boolean;
     connectedCallback(): void;

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

@@ -7,10 +7,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { html, LitElement } from "lit";
 import { customElement } from "lit/decorators.js";
 import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
+const tagName = "sonic-subscriber";
 /**
  * Voir la partie dédiée dans *MISCALLENOUS*
  */
-const tagName = "sonic-subscriber";
 let SonicSubscriber = class SonicSubscriber extends Subscriber(LitElement) {
     constructor() {
         super(...arguments);
@@ -36,8 +36,3 @@ SonicSubscriber = __decorate([
     customElement(tagName)
 ], SonicSubscriber);
 export { SonicSubscriber };
-//Ajout pour Storybook
-try {
-    customElements.define(tagName, SonicSubscriber);
-}
-catch (e) { }

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

@@ -0,0 +1,7 @@
+import { LitElement } from "lit";
+declare const SonicValue_base: (new (...args: any[]) => import("../../../mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & typeof LitElement;
+export declare class SonicValue extends SonicValue_base {
+    connectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+export {};

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

@@ -0,0 +1,26 @@
+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 { LitElement, html } from "lit";
+import { customElement } from "lit/decorators.js";
+import { Subscriber } from "@supersoniks/concorde/mixins";
+import { unsafeHTML } from "lit/directives/unsafe-html.js";
+const tagName = "sonic-value"; // For Astro.build
+let SonicValue = class SonicValue extends Subscriber(LitElement) {
+    connectedCallback() {
+        this.setAttribute("subDataProvider", this.getAttribute("key"));
+        super.connectedCallback();
+    }
+    render() {
+        if (typeof this.props !== "string")
+            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>`;
+    }
+};
+SonicValue = __decorate([
+    customElement(tagName)
+], SonicValue);
+export { SonicValue };

package/core/components/ui/_css/scroll.js

@@ -1,22 +1,21 @@
 import { css } from "lit";
 export const customScroll = css `
-
   .custom-scroll {
-    overflow:auto !important;
+    overflow: auto !important;
+    overflow-y: overlay !important;
   }
-  
+
   .custom-scroll::-webkit-scrollbar {
     width: 0.5rem;
     height: 0.5rem;
-    border: solid .15rem transparent;
+    border: solid 0.15rem transparent;
     border-radius: var(--sc-rounded);
-    background:transparent;
+    background: transparent;
   }
 
   .custom-scroll::-webkit-scrollbar-thumb {
     box-shadow: inset 0 0 2rem 2rem var(--sc-scrollbar-bg);
     border-radius: var(--sc-rounded);
-    border: solid .15rem transparent;
+    border: solid 0.15rem transparent;
   }
-
 `;

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

@@ -1 +1,2 @@
+export type Size = "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
 export declare const fontSize: import("lit").CSSResult;

package/core/components/ui/_css/size.js

@@ -3,10 +3,12 @@ export const fontSize = css `
   /*SIZES*/
   :host {
     --sc-fs: 1rem;
+    --sc-lh: 1.2;
     font-size: var(--sc-fs);
+    line-height: var(--sc-lh);
   }
   :host([size="2xs"]) {
-    --sc-fs: 0.68rem;
+    --sc-fs: 0.625rem;
   }
   :host([size="xs"]) {
     --sc-fs: 0.75rem;

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

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

package/core/components/ui/alert/alert.js

@@ -26,13 +26,13 @@ let Alert = class Alert extends LitElement {
         /**
          * Titre du message d'erreur
          */
-        this.label = '';
+        this.label = "";
         /**
          * Peut être renseigné dans le slot pour créer des messages plus complexes
          */
-        this.text = '';
+        this.text = "";
         this.background = false;
-        this.status = 'default';
+        this.status = "default";
     }
     render() {
         return html `<div part="alert" class="alert">
@@ -48,7 +48,7 @@ Alert.styles = [
     fontSize,
     css `
       :host {
-        --sc-alert-color: inherit;
+        --sc-alert-color: var(--sc-base-content);
         --sc-alert-rounded: var(--sc-rounded);
         --sc-alert-fw: var(--sc-font-weight-base);
         --sc-alert-fst: var(--sc-font-style-base);
@@ -63,7 +63,6 @@ Alert.styles = [
         position: relative;
         display: flex;
         gap: 0.4em;
-        line-height: 1.2;
         border-radius: var(--sc-alert-rounded);
       }
 
@@ -71,16 +70,16 @@ Alert.styles = [
         font-weight: var(--sc-alert-label-fw);
       }
 
-      :host([status='warning']) {
+      :host([status="warning"]) {
         --sc-alert-color: var(--sc-warning);
       }
-      :host([status='error']) {
+      :host([status="error"]) {
         --sc-alert-color: var(--sc-danger);
       }
-      :host([status='info']) {
+      :host([status="info"]) {
         --sc-alert-color: var(--sc-info);
       }
-      :host([status='success']) {
+      :host([status="success"]) {
         --sc-alert-color: var(--sc-success);
       }
 
@@ -91,7 +90,7 @@ Alert.styles = [
       }
       :host([background]) .alert:before {
         background-color: currentColor;
-        content: '';
+        content: "";
         display: block;
         position: absolute;
         left: 0;
@@ -112,10 +111,10 @@ Alert.styles = [
       }
 
       /*Rounded*/
-      :host([size='xs']) .alert {
+      :host([size="xs"]) .alert {
         --sc-alert-rounded: var(--sc-rounded-sm);
       }
-      :host([size='sm']) .alert {
+      :host([size="sm"]) .alert {
         --sc-alert-rounded: var(--sc-rounded-sm);
       }
     `,
@@ -139,7 +138,3 @@ Alert = __decorate([
     customElement(tagName)
 ], Alert);
 export { Alert };
-try {
-    customElements.define(tagName, Alert);
-}
-catch (e) { }

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

@@ -1,4 +1,5 @@
 import { LitElement } from "lit";
+import { Size } from "@supersoniks/concorde/core/components/ui/_css/size";
 /**
  * Un badge simple avec deux slots, un nommé prefix et un nomé suffix de manière à pouvoir mettre (par exemple) une icone avant ou après le contenu.
  * * Le badge est comparable au bouton car il possèdent tous les deux les propriétés *type* (primary...), *variant*(outline, ghost), size(xs...)...
@@ -19,6 +20,7 @@ export declare class Badge extends LitElement {
     /**
      * Taille du composant, implique notamment des modifications de typo et de marge interne
      */
-    size?: "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+    size?: Size;
+    ellipsis: boolean;
     render(): import("lit-html").TemplateResult<1>;
 }

package/core/components/ui/badge/badge.js

@@ -6,7 +6,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, LitElement, css } from "lit";
 import { customElement, property } from "lit/decorators.js";
-const tagName = 'sonic-badge';
+import { fontSize } from "@supersoniks/concorde/core/components/ui/_css/size";
+const tagName = "sonic-badge";
 /**
  * Un badge simple avec deux slots, un nommé prefix et un nomé suffix de manière à pouvoir mettre (par exemple) une icone avant ou après le contenu.
  * * Le badge est comparable au bouton car il possèdent tous les deux les propriétés *type* (primary...), *variant*(outline, ghost), size(xs...)...
@@ -25,6 +26,7 @@ let Badge = class Badge extends LitElement {
          * * outline : composant légé avec une bordure
          */
         this.variant = "default";
+        this.ellipsis = false;
     }
     render() {
         return html `
@@ -35,12 +37,13 @@ let Badge = class Badge extends LitElement {
     }
 };
 Badge.styles = [
+    fontSize,
     css `
       :host {
         --sc-badge-gap: 0.3em;
-        --sc-badge-py: 0.16em;
+        --sc-badge-py: 0.17em;
         --sc-badge-px: 0.66em;
-        --sc-badge-fs: 1rem;
+        --sc-fs: 1rem;
 
         --sc-badge-color: var(--sc-base-content, #1f2937);
         --sc-badge-bg: var(--sc-base-200, #e5e7eb);
@@ -49,15 +52,15 @@ Badge.styles = [
         --sc-badge-border-color: transparent;
         --sc-badge-border: var(--sc-badge-border-with) solid var(--sc-badge-border-color);
 
-        --sc-badge-rounded: calc(var(--sc-rounded) * 1000);
-        --sc-badge-line-height: 1.15;
+        --sc-badge-rounded: 99px;
         --sc-badge-fw: var(--sc-font-weight-base);
 
         display: inline-flex;
-        align-items:center;
+        align-items: center;
         box-sizing: border-box;
-        line-height: var(--sc-badge-line-height);
+        line-height: var(--sc-lh);
         border-radius: var(--sc-badge-rounded);
+
         background: var(--sc-badge-bg);
         color: var(--sc-badge-color);
 
@@ -70,6 +73,7 @@ Badge.styles = [
         padding-right: var(--sc-badge-px);
         min-height: calc(var(--sc-badge-px) * 2);
         border: var(--sc-badge-border);
+        -webkit-print-color-adjust: exact;
       }
 
       /*TYPES*/
@@ -100,34 +104,28 @@ Badge.styles = [
 
       /*SIZE*/
       :host {
-        font-size: var(--sc-badge-fs);
+        font-size: var(--sc-fs);
         gap: var(--sc-badge-gap);
       }
 
-
       :host([size="2xs"]) {
-        --sc-badge-fs: 0.58rem;
-        --sc-badge-gap: 0.3em;
+        --sc-badge-gap: 0.35em;
       }
       :host([size="xs"]) {
-        --sc-badge-fs: 0.68rem;
         --sc-badge-gap: 0.35em;
       }
 
       :host([size="sm"]) {
-        --sc-badge-fs: 0.85rem;
         --sc-badge-gap: 0.35em;
       }
 
       :host([size="lg"]) {
-        --sc-badge-line-height: 1.2;
-        --sc-badge-fs: 1.25rem;
+        --sc-lh: 1.2;
         --sc-badge-gap: 0.5em;
       }
 
       :host([size="xl"]) {
-        --sc-badge-line-height: 1.2;
-        --sc-badge-fs: 1.5rem;
+        --sc-lh: 1.2;
         --sc-badge-gap: 0.5em;
       }
 
@@ -156,6 +154,24 @@ Badge.styles = [
         color: var(--sc-badge-color);
         background: transparent;
       }
+
+      :host([ellipsis]) {
+        flex-wrap: nowrap;
+        white-space: nowrap;
+        max-width: 100%;
+      }
+      :host([ellipsis]) slot {
+        overflow: hidden;
+        display: block;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        max-width: 100%;
+      }
+
+      slot[name="suffix"],
+      slot[name="prefix"] {
+        flex-shrink: 0;
+      }
     `,
 ];
 __decorate([
@@ -167,12 +183,10 @@ __decorate([
 __decorate([
     property({ type: String, reflect: true })
 ], Badge.prototype, "size", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], Badge.prototype, "ellipsis", void 0);
 Badge = __decorate([
     customElement(tagName)
 ], Badge);
 export { Badge };
-//Ajout pour la creation du cem notamment pour Storybook
-try {
-    customElements.define(tagName, Badge);
-}
-catch (e) { }

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

@@ -6,32 +6,39 @@ declare const Button_base: {
         forceAutoFill: boolean;
         unique: true | null;
         radio: true | null;
-        _checked: true | null;
-        checked: true | null;
+        unCheckOnDisconnect: boolean;
+        _checked: true | "indeterminate" | null;
+        checked: true | "indeterminate" | null;
         validateFormElement(): void;
-        setCheckedValue(checked: true | null): void;
+        checksAll(): boolean;
+        setCheckedValue(checked: true | "indeterminate" | null): void;
         handleChange(): void;
         getValueForFormPublisher(): any;
-        setFormValueFromPublisher(value: any): void;
-        initPublisher(): void;
+        setFormValueFromPublisher(value: string | (string | null)[] | null): void;
+        getCheckAllPublisher(): any;
+        updateAllChecked: () => void;
+        onChecksAllRequest: (value: string) => void;
+        disconnectedCallback(): void;
+        connectedCallback(): void;
         getFormPublisher(): any;
         updateDataValue(): void;
-        handleBlur(e?: any): void;
+        handleBlur(e?: Event | undefined): void;
+        focus?: (() => void) | undefined;
+        shadowRoot?: ShadowRoot | undefined;
         error: boolean;
         autofocus: boolean;
         required: boolean;
         disabled: true | null;
         formDataProvider: string;
+        ariaLabelledby?: string | undefined;
+        ariaLabel?: string | undefined;
         _name: string;
         name: string;
-        props: any;
-        propertyMap: Object;
-        isConnected: boolean; /**
-         * 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
-         */
+        props: import("../../../_types/types").CoreJSType;
+        propertyMap: object;
+        isConnected: boolean;
+        children: HTMLCollection;
+        appendChild(node: Node): Node;
         getAncestorAttributeValue(attributeName: string): string;
         hasAncestorAttribute(attributeName: string): boolean;
         querySelectorAll(selector: string): NodeListOf<Element>;
@@ -46,14 +53,13 @@ declare const Button_base: {
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
         removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined): void;
         removeAttribute(name: string): void;
+        initPublisher(): void;
         getApiConfiguration(): import("../../../utils/api").APIConfiguration;
-        connectedCallback(): void;
         requestUpdate(): void;
         getAttribute(name: string): string;
-        hasAttribute(attributeName: String): boolean;
-        disconnectedCallback(): void;
+        hasAttribute(attributeName: string): boolean;
     };
-} & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/FormElement").FormElementInterface) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface) & typeof LitElement;
+} & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/FormElement").FormElementInterface) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & typeof LitElement;
 /**
  * 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
@@ -101,15 +107,15 @@ export declare class Button extends Button_base {
      */
     minWidth: string;
     /**
-    * Si un bouton n'a qu'une icone pour contenu, agrandi l'icone pour des raisons d'équilibre
-    */
+     * Si un bouton n'a qu'une icone pour contenu, agrandi l'icone pour des raisons d'équilibre
+     */
     icon: boolean;
     /**
      * mode d'activation du bouton :
      * - strict : l'url courante match exactement avec le href du bouton
      * - partial : l'url courante match à gauche avec le href du bouton
      * - disabled : aucune activation / désactivation
-    */
+     */
     autoActive: "strict" | "partial" | "disabled";
     /**
      * Laisse apparaitre un loader en remplacement du contenu du bouton.
@@ -137,7 +143,7 @@ export declare class Button extends Button_base {
     pushState: boolean;
     active: boolean;
     handleNavigation(e: Event): void;
-    handleChange(e?: any): void;
+    handleChange(e?: Event): void;
     connectedCallback(): void;
     setCheckedValue(checked: true | null): void;
     disconnectedCallback(): void;
@@ -147,5 +153,4 @@ export declare class Button extends Button_base {
     render(): import("lit-html").TemplateResult<1>;
     onSlotChange(): void;
 }
-export declare const SonicButton: typeof Button;
 export {};