@supersoniks/concorde 3.1.92 → 3.1.94

package/concorde-core.es.js

@@ -559,7 +559,7 @@ let T = (k = class {
     const h = await new Response(a.readable).arrayBuffer();
     return new TextDecoder().decode(h);
   }
-}, k.buildDate = "Tue Aug 19 2025 16:15:46 GMT+0200 (Central European Summer Time)", k.changed = !1, k.saving = !1, k.saveId = 0, k.instance = null, k.instances = /* @__PURE__ */ new Map(), k.modifiedCollectore = [], k);
+}, k.buildDate = "Thu Aug 21 2025 10:27:12 GMT+0200 (Central European Summer Time)", k.changed = !1, k.saving = !1, k.saveId = 0, k.instance = null, k.instances = /* @__PURE__ */ new Map(), k.modifiedCollectore = [], k);
 if (typeof window < "u") {
   const r = window;
   r[Os + "PublisherManager"] = r[Os + "PublisherManager"] || T;
@@ -10936,11 +10936,18 @@ var Fh = Object.defineProperty, zh = Object.getOwnPropertyDescriptor, st = (r, t
 const So = "sonic-modal";
 let F = class extends G(x) {
   constructor() {
-    super(...arguments), this.forceAction = !1, this.removeOnHide = !1, this.removeHashOnHide = !1, this.align = "left", this.padding = "var(--sc_py) var(--sc_px)", this.maxWidth = "var(--sc_max-w)", this.maxHeight = "var(--sc_max-h)", this.width = "100%", this.height = "fit-content", this.zIndex = "var(--sc_z-index)", this.effect = "slide", this.fullScreen = !1, this.visible = !1, this.closeOnLocationChange = !1, this.location = "", this._animationState = "hidden", this._animationDuration = 400;
+    super(...arguments), this.forceAction = !1, this.removeOnHide = !1, this.removeHashOnHide = !1, this.align = "left", this.padding = "var(--sc-modal-py) var(--sc-modal-px)", this.maxWidth = "var(--sc_max-w)", this.maxHeight = "var(--sc_max-h)", this.width = "100%", this.height = "fit-content", this.zIndex = "var(--sc_z-index)", this.effect = "slide", this.fullScreen = !1, this.visible = !1, this.closeOnLocationChange = !1, this.location = "", this._animationState = "hidden", this._animationDuration = 300, this._animationConfig = {
+      quartOut: "cubic-bezier(0.165, 0.84, 0.44, 1)",
+      quadOut: "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
+      linear: "linear",
+      translateY: "translateY(2.5rem)",
+      durationIn: 300,
+      durationOut: 450
+    };
   }
   static create(r) {
     const t = document.createElement(So);
-    return t.options = r, r.removeHashOnHide === !0 && t.setAttribute("removeHashOnHide", "true"), r.removeOnHide === !0 && t.setAttribute("removeOnHide", "true"), r.closeOnLocationChange === !0 && t.setAttribute("closeOnLocationChange", "true"), r.maxWidth && (t.maxWidth = r == null ? void 0 : r.maxWidth), r.width && (t.width = r == null ? void 0 : r.width), r.maxHeight && (t.maxHeight = r == null ? void 0 : r.maxHeight), r.height && (t.height = r == null ? void 0 : r.height), r.forceAction && (t.forceAction = !0), r.fullScreen && (t.fullScreen = r == null ? void 0 : r.fullScreen), r.effect && (t.effect = r == null ? void 0 : r.effect), r.paddingX && t.style.setProperty("--sc_px", r == null ? void 0 : r.paddingX), r.paddingY && t.style.setProperty("--sc_py", r == null ? void 0 : r.paddingY), r.zIndex && t.style.setProperty("--sc_z-index", r == null ? void 0 : r.zIndex), yt.getPopContainer().appendChild(t), t.updateComplete.then(() => {
+    return t.options = r, r.removeHashOnHide === !0 && t.setAttribute("removeHashOnHide", "true"), r.removeOnHide === !0 && t.setAttribute("removeOnHide", "true"), r.closeOnLocationChange === !0 && t.setAttribute("closeOnLocationChange", "true"), r.maxWidth && (t.maxWidth = r == null ? void 0 : r.maxWidth), r.width && (t.width = r == null ? void 0 : r.width), r.maxHeight && (t.maxHeight = r == null ? void 0 : r.maxHeight), r.height && (t.height = r == null ? void 0 : r.height), r.forceAction && (t.forceAction = !0), r.fullScreen && (t.fullScreen = r == null ? void 0 : r.fullScreen), r.effect && (t.effect = r == null ? void 0 : r.effect), r.paddingX && t.style.setProperty("--sc-modal-px", r == null ? void 0 : r.paddingX), r.paddingY && t.style.setProperty("--sc-modal-py", r == null ? void 0 : r.paddingY), r.zIndex && t.style.setProperty("--sc_z-index", r == null ? void 0 : r.zIndex), yt.getPopContainer().appendChild(t), t.updateComplete.then(() => {
       t.show();
     }), t;
   }
@@ -11036,23 +11043,17 @@ let F = class extends G(x) {
   }
   // Show the modal
   async show() {
-    this._modalElement.show(), this._animationState = "in", this.animateIn(this._modalElement, this.effect).then(() => {
-      this._animationState = "visible", this.visible = !0, this.dispatchEvent(new CustomEvent("show")), this._modalElement.focus();
-    });
+    this._modalElement.show(), this._animationState = "in", await this.animation("in"), this._animationState = "visible", this.visible = !0, this.dispatchEvent(new CustomEvent("show")), this._modalElement.focus();
   }
   // Hide the modal
   async hide() {
-    this._animationState = "out", this.dispatchEvent(new CustomEvent("hide")), await Promise.all([this.animateOut(this._modalElement, this.effect)]).then(
-      () => {
-        this._modalElement.close(), this._animationState = "hidden", this.visible = !1, this.hasAttribute("resetDataProviderOnHide") && rt.get(
-          this.getAttribute("resetDataProviderOnHide")
-        ).set({}), this.removeHashOnHide && window.history.replaceState({}, "", window.location.pathname), this.removeOnHide && this.remove(), this.dispatchEvent(new CustomEvent("hidden"));
-      }
-    );
+    this._animationState = "out", this.dispatchEvent(new CustomEvent("hide")), await this.animation("out"), this._modalElement.close(), this._animationState = "hidden", this.visible = !1, this.hasAttribute("resetDataProviderOnHide") && rt.get(this.getAttribute("resetDataProviderOnHide")).set(
+      {}
+    ), this.removeHashOnHide && window.history.replaceState({}, "", window.location.pathname), this.removeOnHide && this.remove(), this.dispatchEvent(new CustomEvent("hidden"));
   }
   // Hide and remove the modal
-  dispose() {
-    this.hide(), this.remove();
+  async dispose() {
+    await this.hide(), this.remove();
   }
   // Hide and remove all modals
   static disposeAll() {
@@ -11073,59 +11074,41 @@ let F = class extends G(x) {
   // ------------------------
   // ANIMATIONS
   // ------------------------
-  animateIn(r, t = "slide") {
-    return new Promise((e) => {
-      if (!r) return e();
-      this.style.setProperty("--sc_backdrop-opacity", "0.8");
-      let i;
-      t === "slide" ? i = r.animate(
-        [
-          {
-            opacity: 0,
-            transform: "translateY(3.25rem)"
-          },
+  animation(r) {
+    return new Promise((t) => {
+      const { quartOut: e, linear: i, translateY: s, durationIn: o, durationOut: n, quadOut: a } = this._animationConfig, c = this._modalElement;
+      if (!c) return t();
+      const h = r === "in", d = h ? o : n;
+      h ? this.style.setProperty("--sc_backdrop-opacity", "0.8") : setTimeout(() => {
+        this.style.setProperty("--sc_backdrop-opacity", "0");
+      }, 300);
+      const p = [];
+      this.effect === "slide" && (p.push(
+        c.animate(
+          [
+            { transform: h ? s : "translateY(0)" },
+            { transform: h ? "translateY(0)" : s }
+          ],
           {
-            opacity: 1,
-            transform: "translateY(0)"
+            duration: d,
+            easing: h ? e : a,
+            fill: "both",
+            delay: h ? 100 : 0
           }
-        ],
-        {
-          duration: this._animationDuration,
-          easing: "cubic-bezier(0.250, 0.250, 0.420, 1.225)",
-          fill: "forwards",
-          delay: 80
-        }
-      ) : i = r.animate([{ opacity: 0 }, { opacity: 1 }], {
-        duration: this._animationDuration,
-        fill: "forwards"
-      }), i.onfinish = () => e();
-    });
-  }
-  animateOut(r, t = "slide") {
-    return new Promise((e) => {
-      if (!r) return e();
-      this.style.setProperty("--sc_backdrop-opacity", "0");
-      let i;
-      t === "slide" ? i = r.animate(
-        [
+        )
+      ), p.push(
+        c.animate(
+          [{ opacity: h ? 0 : 1 }, { opacity: h ? 1 : 0 }],
           {
-            opacity: 1,
-            transform: "translateY(0)"
-          },
-          {
-            opacity: 0,
-            transform: "translateY(3.25rem)"
+            duration: d,
+            easing: i,
+            fill: "both",
+            delay: h ? 100 : 0
           }
-        ],
-        {
-          duration: this._animationDuration,
-          easing: "cubic-bezier(0.250, 0.250, 0.420, 1.225)",
-          fill: "forwards"
-        }
-      ) : i = r.animate([{ opacity: 1 }, { opacity: 0 }], {
-        duration: this._animationDuration,
-        fill: "forwards"
-      }), i.onfinish = () => e();
+        )
+      )), Promise.all(p.map((m) => m.finished)).then(
+        () => t()
+      );
     });
   }
 };
@@ -11133,8 +11116,8 @@ F.styles = [
   fs,
   P`
       :host {
-        --sc_py: 2.5rem;
-        --sc_px: 1.5rem;
+        --sc-modal-py: 2.5rem;
+        --sc-modal-px: 1.5rem;
         --sc_max-w: min(100vw, 40rem);
         --sc_max-h: 85vh;
         --sc_rounded: var(--sc-rounded-lg);
@@ -11165,14 +11148,13 @@ F.styles = [
         z-index: var(--sc_z-index);
       }
 
-      /*#modal::backdrop {*/
       #backdrop {
         opacity: var(--sc_backdrop-opacity, 0);
         background: var(
           --sc_overlay-bg,
           var(--sc-base-200, rgba(0, 0, 0, 0.12))
         );
-        transition: opacity 0.2s ease-in-out;
+        transition: opacity 0.15s linear;
         inset: 0;
         position: fixed;
         z-index: var(--sc_z-index);
@@ -11183,13 +11165,13 @@ F.styles = [
         flex-direction: column;
         min-height: 10rem;
         line-height: 1.25;
-        padding: var(--sc_py) var(--sc_px);
+        padding: var(--sc-modal-py) var(--sc-modal-px);
       }
 
       ::slotted(sonic-modal-subtitle),
       sonic-modal-subtitle {
         margin-top: -0.9rem;
-        margin-bottom: 1.25rem;
+        margin-bottom: 2.5rem;
       }
 
       @media (max-width: 767.5px) {
@@ -11211,24 +11193,24 @@ F.styles = [
       /* Layout des éléments slottés */
       ::slotted(sonic-modal-title),
       sonic-modal-title {
-        margin-bottom: 1.25rem;
+        margin-bottom: 2.5rem;
       }
       :host([align="left"]) ::slotted(sonic-modal-title),
       :host([align="left"]) sonic-modal-title {
         padding-right: 1em;
       }
 
-      :host([align="left"]) .modal-content {
+      :host([align="left"]) #modal-content {
         text-align: left;
         align-items: flex-start;
       }
 
-      :host([align="center"]) .modal-content {
+      :host([align="center"]) #modal-content {
         text-align: center;
         align-items: center;
       }
 
-      :host([align="right"]) .modal-content {
+      :host([align="right"]) #modal-content {
         text-align: right;
         align-items: flex-end;
       }
@@ -11236,26 +11218,30 @@ F.styles = [
       /* Close button */
       ::slotted(sonic-modal-close),
       sonic-modal-close {
+        --sc_translate-x: calc(var(--sc-modal-px) - 0.25rem);
+        --sc_translate-y: calc(-1 * var(--sc-modal-py) - 0.25rem);
+        --sc_top: 0.25rem;
+        --sc_x: 0.25rem;
         position: sticky;
         display: block;
-        align-self: flex-end;
         height: 0;
-        top: var(--sc_py);
-        right: 0.5rem;
-        transform: translateX(calc(var(--sc_px) - 0.2rem))
-          translateY(calc(-1 * var(--sc_py) + 0.2rem));
+        top: var(--sc_top);
+        margin-left: auto;
+        margin-top: calc(-1 * var(--sc-modal-py) - 0.25rem);
+        margin-bottom: var(--sc-modal-py);
+        transform: translateX(var(--sc_translate-x));
         z-index: 20;
       }
       :host([align="right"]) ::slotted(sonic-modal-close),
       :host([align="right"]) sonic-modal-close {
         right: auto;
-        left: 0.5rem;
-        transform: translateX(calc(-1 * var(--sc_px)))
-          translateY(calc(-1 * var(--sc_py)));
+        margin-right: auto;
+        margin-left: 0;
+        transform: translateX(calc(-1 * var(--sc_translate-x)));
       }
 
       /* Border radius */
-      :host([rounded="none"]) modal {
+      :host([rounded="none"]) #modal {
         --sc-img-radius: 0 !important;
       }
     `