@proximus/lavender-selectablebox 1.4.1 → 1.4.2-beta.1

package/dist/index.es.js

@@ -31,7 +31,7 @@ class c extends n {
     super(h), this.overflowXAttributeDelegate = new x(
       this,
       "overflow-x",
-      (e) => e,
+      (t) => t,
       "--overflow-x"
     ), this.template = `<div class="flex-container">
       <slot></slot>
@@ -75,14 +75,14 @@ class c extends n {
       "overflow-x--desktop"
     ];
   }
-  attributeChangedCallback(e, t, i) {
-    switch (e) {
+  attributeChangedCallback(t, e, i) {
+    switch (t) {
       case "gap":
       case "gap--mobile":
       case "gap--tablet":
       case "gap--laptop":
       case "gap--desktop":
-        this.updateFlexProperties(e, t, i, v);
+        this.updateFlexProperties(t, e, i, v);
         break;
       case "justify-content":
       case "justify-content--mobile":
@@ -90,8 +90,8 @@ class c extends n {
       case "justify-content--laptop":
       case "justify-content--desktop":
         this.updateFlexProperties(
-          e,
           t,
+          e,
           i,
           C
         );
@@ -101,245 +101,245 @@ class c extends n {
       case "align-items--tablet":
       case "align-items--laptop":
       case "align-items--desktop":
-        this.updateFlexProperties(e, t, i, w);
+        this.updateFlexProperties(t, e, i, w);
         break;
       case "wrap":
       case "wrap--mobile":
       case "wrap--tablet":
       case "wrap--laptop":
       case "wrap--desktop":
-        this.updateFlexProperties(e, t, i, $);
+        this.updateFlexProperties(t, e, i, $);
         break;
       case "direction":
       case "direction--mobile":
       case "direction--tablet":
       case "direction--laptop":
       case "direction--desktop":
-        this.updateFlexProperties(e, t, i, A);
+        this.updateFlexProperties(t, e, i, A);
         break;
       case "overflow-x":
       case "overflow-x--mobile":
       case "overflow-x--tablet":
       case "overflow-x--laptop":
       case "overflow-x--desktop":
-        this.updateOverflowX(e, t, i, S);
+        this.updateOverflowX(t, e, i, S);
         break;
       default:
-        super.attributeChangedCallback(e, t, i);
+        super.attributeChangedCallback(t, e, i);
         break;
     }
   }
-  updateOverflowX(e, t, i, o) {
+  updateOverflowX(t, e, i, o) {
     if (!m(o, i)) {
-      console.error(`${i} is not an allowed ${e} value`);
+      console.error(`${i} is not an allowed ${t} value`);
       return;
     }
     this.overflowXAttributeDelegate.attributeChangedCallback(
-      e,
       t,
+      e,
       i
     );
   }
-  updateFlexProperties(e, t, i, o) {
+  updateFlexProperties(t, e, i, o) {
     this.checkName(o, i) || console.error(`${i} is not a valid value for ${o}`);
-    const d = e.indexOf("--") > -1, s = d ? e.split("--")[0] : e, a = [];
+    const d = t.indexOf("--") > -1, s = d ? t.split("--")[0] : t, a = [];
     if (!d)
       this.getAttribute(s + "--mobile") || a.push("mobile"), this.getAttribute(s + "--tablet") || a.push("tablet"), this.getAttribute(s + "--laptop") || a.push("laptop"), this.getAttribute(s + "--desktop") || a.push("desktop"), a.forEach((l) => {
-        this.updateStyle(s, l, t, o), this.updateStyle(s, l, i, o);
+        this.updateStyle(s, l, e, o), this.updateStyle(s, l, i, o);
       });
     else {
-      const l = e.split("--")[1];
-      this.updateStyle(s, l, t, o), this.updateStyle(s, l, i, o);
+      const l = t.split("--")[1];
+      this.updateStyle(s, l, e, o), this.updateStyle(s, l, i, o);
     }
   }
-  updateStyle(e, t, i, o) {
-    i && (e === "gap" && o && o.includes(i) ? this.$el.style.setProperty(
-      `--flex-${e}--${t}-value`,
-      `var(--px-spacing-${i}-${t === "laptop" ? "desktop" : t})`
+  updateStyle(t, e, i, o) {
+    i && (t === "gap" && o && o.includes(i) ? this.$el.style.setProperty(
+      `--flex-${t}--${e}-value`,
+      `var(--px-spacing-${i}-${e === "laptop" ? "desktop" : e})`
     ) : this.$el.style.setProperty(
-      `--flex-${e}--${t}-value`,
+      `--flex-${t}--${e}-value`,
       i
     ));
   }
   get direction() {
     return this.getAttribute("direction");
   }
-  set direction(e) {
-    this.setAttribute("direction", e);
+  set direction(t) {
+    this.setAttribute("direction", t);
   }
   get directionMobile() {
     return this.getAttribute("direction--mobile");
   }
-  set directionMobile(e) {
-    this.setAttribute("direction--mobile", e);
+  set directionMobile(t) {
+    this.setAttribute("direction--mobile", t);
   }
   get directionTablet() {
     return this.getAttribute("direction--tablet");
   }
-  set directionTablet(e) {
-    this.setAttribute("direction--tablet", e);
+  set directionTablet(t) {
+    this.setAttribute("direction--tablet", t);
   }
   get directionLaptop() {
     return this.getAttribute("direction--laptop");
   }
-  set directionLaptop(e) {
-    this.setAttribute("direction--laptop", e);
+  set directionLaptop(t) {
+    this.setAttribute("direction--laptop", t);
   }
   get directionDesktop() {
     return this.getAttribute("direction--desktop");
   }
-  set directionDesktop(e) {
-    this.setAttribute("direction--desktop", e);
+  set directionDesktop(t) {
+    this.setAttribute("direction--desktop", t);
   }
   get gap() {
     return this.getAttribute("gap");
   }
-  set gap(e) {
-    this.setAttribute("gap", e);
+  set gap(t) {
+    this.setAttribute("gap", t);
   }
   get gapMobile() {
     return this.getAttribute("gap--mobile");
   }
-  set gapMobile(e) {
-    this.setAttribute("gap--mobile", e);
+  set gapMobile(t) {
+    this.setAttribute("gap--mobile", t);
   }
   get gapTablet() {
     return this.getAttribute("gap--tablet");
   }
-  set gapTablet(e) {
-    this.setAttribute("gap--tablet", e);
+  set gapTablet(t) {
+    this.setAttribute("gap--tablet", t);
   }
   get gapLaptop() {
     return this.getAttribute("gap--laptop");
   }
-  set gapLaptop(e) {
-    this.setAttribute("gap--laptop", e);
+  set gapLaptop(t) {
+    this.setAttribute("gap--laptop", t);
   }
   get gapDesktop() {
     return this.getAttribute("gap--desktop");
   }
-  set gapDesktop(e) {
-    this.setAttribute("gap--desktop", e);
+  set gapDesktop(t) {
+    this.setAttribute("gap--desktop", t);
   }
   get justifyContent() {
     return this.getAttribute("justify-content");
   }
-  set justifyContent(e) {
-    this.setAttribute("justify-content", e);
+  set justifyContent(t) {
+    this.setAttribute("justify-content", t);
   }
   get justifyContentMobile() {
     return this.getAttribute("justify-content--mobile");
   }
-  set justifyContentMobile(e) {
-    this.setAttribute("justify-content--mobile", e);
+  set justifyContentMobile(t) {
+    this.setAttribute("justify-content--mobile", t);
   }
   get justifyContentTablet() {
     return this.getAttribute("justify-content--tablet");
   }
-  set justifyContentTablet(e) {
-    this.setAttribute("justify-content--tablet", e);
+  set justifyContentTablet(t) {
+    this.setAttribute("justify-content--tablet", t);
   }
   get justifyContentLaptop() {
     return this.getAttribute("justify-content--laptop");
   }
-  set justifyContentLaptop(e) {
-    this.setAttribute("justify-content--laptop", e);
+  set justifyContentLaptop(t) {
+    this.setAttribute("justify-content--laptop", t);
   }
   get justifyContentDesktop() {
     return this.getAttribute("justify-content--desktop");
   }
-  set justifyContentDesktop(e) {
-    this.setAttribute("justify-content--desktop", e);
+  set justifyContentDesktop(t) {
+    this.setAttribute("justify-content--desktop", t);
   }
   get alignItems() {
     return this.getAttribute("align-items");
   }
-  set alignItems(e) {
-    this.setAttribute("align-items", e);
+  set alignItems(t) {
+    this.setAttribute("align-items", t);
   }
   get alignItemsMobile() {
     return this.getAttribute("align-items--mobile");
   }
-  set alignItemsMobile(e) {
-    this.setAttribute("align-items--mobile", e);
+  set alignItemsMobile(t) {
+    this.setAttribute("align-items--mobile", t);
   }
   get alignItemsTablet() {
     return this.getAttribute("align-items--tablet");
   }
-  set alignItemsTablet(e) {
-    this.setAttribute("align-items--tablet", e);
+  set alignItemsTablet(t) {
+    this.setAttribute("align-items--tablet", t);
   }
   get alignItemsLaptop() {
     return this.getAttribute("align-items--laptop");
   }
-  set alignItemsLaptop(e) {
-    this.setAttribute("align-items--laptop", e);
+  set alignItemsLaptop(t) {
+    this.setAttribute("align-items--laptop", t);
   }
   get alignItemsDesktop() {
     return this.getAttribute("align-items--desktop");
   }
-  set alignItemsDesktop(e) {
-    this.setAttribute("align-items--desktop", e);
+  set alignItemsDesktop(t) {
+    this.setAttribute("align-items--desktop", t);
   }
   get wrap() {
     return this.getAttribute("wrap");
   }
-  set wrap(e) {
-    this.setAttribute("wrap", e);
+  set wrap(t) {
+    this.setAttribute("wrap", t);
   }
   get wrapMobile() {
     return this.getAttribute("wrap--mobile");
   }
-  set wrapMobile(e) {
-    this.setAttribute("wrap--mobile", e);
+  set wrapMobile(t) {
+    this.setAttribute("wrap--mobile", t);
   }
   get wrapTablet() {
     return this.getAttribute("wrap--tablet");
   }
-  set wrapTablet(e) {
-    this.setAttribute("wrap--tablet", e);
+  set wrapTablet(t) {
+    this.setAttribute("wrap--tablet", t);
   }
   get wrapLaptop() {
     return this.getAttribute("wrap--laptop");
   }
-  set wrapLaptop(e) {
-    this.setAttribute("wrap--laptop", e);
+  set wrapLaptop(t) {
+    this.setAttribute("wrap--laptop", t);
   }
   get wrapDesktop() {
     return this.getAttribute("wrap--desktop");
   }
-  set wrapDesktop(e) {
-    this.setAttribute("wrap--desktop", e);
+  set wrapDesktop(t) {
+    this.setAttribute("wrap--desktop", t);
   }
   get overflowX() {
     return this.getAttribute("overflow-x");
   }
-  set overflowX(e) {
-    this.setAttribute("overflow-x", e);
+  set overflowX(t) {
+    this.setAttribute("overflow-x", t);
   }
   get overflowXMobile() {
     return this.getAttribute("overflow-x--mobile");
   }
-  set overflowXMobile(e) {
-    this.setAttribute("overflow-x--mobile", e);
+  set overflowXMobile(t) {
+    this.setAttribute("overflow-x--mobile", t);
   }
   get overflowXTablet() {
     return this.getAttribute("overflow-x--tablet");
   }
-  set overflowXTablet(e) {
-    this.setAttribute("overflow-x--tablet", e);
+  set overflowXTablet(t) {
+    this.setAttribute("overflow-x--tablet", t);
   }
   get overflowXLaptop() {
     return this.getAttribute("overflow-x--laptop");
   }
-  set overflowXLaptop(e) {
-    this.setAttribute("overflow-x--laptop", e);
+  set overflowXLaptop(t) {
+    this.setAttribute("overflow-x--laptop", t);
   }
   get overflowXDesktop() {
     return this.getAttribute("overflow-x--desktop");
   }
-  set overflowXDesktop(e) {
-    this.setAttribute("overflow-x--desktop", e);
+  set overflowXDesktop(t) {
+    this.setAttribute("overflow-x--desktop", t);
   }
   get $el() {
     return this.shadowRoot.querySelector(".flex-container");
@@ -369,25 +369,25 @@ class z extends HTMLElement {
     super(), this.isZeroSized = !1, this.growValue = "1", this.isVertical = !1;
   }
   static get observedAttributes() {
-    return ["grow"];
+    return ["grow", "nogap"];
   }
-  attributeChangedCallback(e, t, i) {
-    e === "grow" && (this.growValue = i || "1", this.isZeroSized || (this.style.flexGrow = this.growValue), this.scheduleRecheck());
+  attributeChangedCallback(t, e, i) {
+    t === "grow" && (this.growValue = i || "1", this.isZeroSized || (this.style.flexGrow = this.growValue), this.scheduleRecheck());
   }
   connectedCallback() {
-    this.growValue = this.getAttribute("grow") || "1", this.style.flexGrow = this.growValue, this.resizeObserver = new ResizeObserver(() => {
+    this.growValue = this.getAttribute("grow") || "1", this.style.flexGrow = this.growValue, this.nogap && (this.resizeObserver = new ResizeObserver(() => {
       this.handleSizeChange();
-    }), this.isVertical = this.parentElement.localName === "px-vstack" || this.parentElement.style.flexDirection === "column", this.resizeObserver.observe(this), this.scheduleRecheck();
+    }), this.isVertical = this.parentElement.localName === "px-vstack" || this.parentElement.style.flexDirection === "column", this.resizeObserver.observe(this), this.scheduleRecheck());
   }
   disconnectedCallback() {
-    var e;
-    (e = this.resizeObserver) == null || e.disconnect(), this.recheckHandle && (cancelAnimationFrame(this.recheckHandle), this.recheckHandle = void 0);
+    var t;
+    (t = this.resizeObserver) == null || t.disconnect(), this.recheckHandle && (cancelAnimationFrame(this.recheckHandle), this.recheckHandle = void 0);
   }
   get grow() {
     return this.getAttribute("grow");
   }
-  set grow(e) {
-    this.setAttribute("grow", e);
+  set grow(t) {
+    this.setAttribute("grow", t);
   }
   scheduleRecheck() {
     this.recheckHandle && cancelAnimationFrame(this.recheckHandle), this.recheckHandle = requestAnimationFrame(() => {
@@ -398,19 +398,25 @@ class z extends HTMLElement {
     this.isConnected && (this.style.display = "", this.style.flexGrow = this.growValue, this.handleSizeChange());
   }
   handleSizeChange() {
-    const e = this.getBoundingClientRect(), t = e.width === 0 && !this.isVertical || e.height === 0 && this.isVertical;
-    this.isZeroSized !== t && (this.isZeroSized = t, this.updateParticipation());
+    const t = this.getBoundingClientRect(), e = t.width === 0 && !this.isVertical || t.height === 0 && this.isVertical;
+    this.isZeroSized !== e && (this.isZeroSized = e, this.updateParticipation());
   }
   updateParticipation() {
     this.isZeroSized ? (this.style.display = "none", this.style.flexGrow = "0") : (this.style.display = "", this.style.flexGrow = this.growValue);
   }
+  get nogap() {
+    return this.hasAttribute("nogap");
+  }
+  set nogap(t) {
+    t ? this.setAttribute("nogap", "") : this.removeAttribute("nogap");
+  }
 }
 customElements.get("px-spacer") || customElements.define("px-spacer", z);
 const L = ":host{display:block;box-sizing:border-box}slot[name=body-container]{min-height:100vh}#image-sticky-box{margin-top:-2.5em}", b = new CSSStyleSheet();
 b.replaceSync(L);
 class D extends n {
   constructor() {
-    super(b), this.template = (e) => `
+    super(b), this.template = (t) => `
     <px-container border-radius="none" padding="none">
       <px-vstack>
         <px-container id="header-container" border-radius="none">
@@ -447,7 +453,7 @@ class D extends n {
             <px-spacer></px-spacer>
           </px-hstack>
         </px-container>
-        ${e ? ` <px-hstack>
+        ${t ? ` <px-hstack>
         <px-spacer></px-spacer>
         <px-container border-radius="none" box-shadow="xl" id="image-sticky-box" border="s" grow="${this.grow}" basis="${this.basis}" border-radius="m">
           <px-vstack gap="s">
@@ -563,11 +569,11 @@ class D extends n {
   get paddingHorizontal() {
     return this.getAttribute("padding-horizontal");
   }
-  set paddingVertical(e) {
-    this.setAttribute("padding-vertical", e);
+  set paddingVertical(t) {
+    this.setAttribute("padding-vertical", t);
   }
-  set paddingHorizontal(e) {
-    this.setAttribute("padding-horizontal", e);
+  set paddingHorizontal(t) {
+    this.setAttribute("padding-horizontal", t);
   }
   get gap() {
     return this.getAttribute("gap");
@@ -575,9 +581,9 @@ class D extends n {
   connectedCallback() {
     this.handlePaddingVerticalChange(this.paddingVertical), this.handlePaddingHorizontalChange(this.paddingHorizontal);
   }
-  attributeChangedCallback(e, t, i) {
-    if (t !== i)
-      switch (e) {
+  attributeChangedCallback(t, e, i) {
+    if (e !== i)
+      switch (t) {
         case "background-image":
           this.$imageContainer.setAttribute("background-image", i);
           break;
@@ -597,14 +603,14 @@ class D extends n {
           this.handlePaddingHorizontalChange(i);
           break;
         default:
-          super.attributeChangedCallback(e, t, i);
+          super.attributeChangedCallback(t, e, i);
       }
   }
-  handlePaddingVerticalChange(e) {
-    this.$headerContainer.setAttribute("padding-top", e), this.$footerContainer.setAttribute("padding-bottom", e);
+  handlePaddingVerticalChange(t) {
+    this.$headerContainer.setAttribute("padding-top", t), this.$footerContainer.setAttribute("padding-bottom", t);
   }
-  handlePaddingHorizontalChange(e) {
-    this.$headerContainer.paddingLeft = e, this.$headerContainer.paddingRight = e, this.$bodyContainer.paddingLeft = e, this.$bodyContainer.paddingRight = e, this.$contactContainer.paddingLeft = e, this.$contactContainer.paddingRight = e, this.$footerContainer.paddingLeft = e, this.$footerContainer.paddingRight = e, this.$imageContainer.paddingLeft = e, this.$imageContainer.paddingRight = e;
+  handlePaddingHorizontalChange(t) {
+    this.$headerContainer.paddingLeft = t, this.$headerContainer.paddingRight = t, this.$bodyContainer.paddingLeft = t, this.$bodyContainer.paddingRight = t, this.$contactContainer.paddingLeft = t, this.$contactContainer.paddingRight = t, this.$footerContainer.paddingLeft = t, this.$footerContainer.paddingRight = t, this.$imageContainer.paddingLeft = t, this.$imageContainer.paddingRight = t;
   }
 }
 customElements.get("px-page") === void 0 && customElements.define("px-page", D);
@@ -641,11 +647,11 @@ class R extends n {
   static get observedAttributes() {
     return [...super.observedAttributes, "inverted", "hide-footer"];
   }
-  attributeChangedCallback(e, t, i) {
-    if (t !== i)
-      switch (e) {
+  attributeChangedCallback(t, e, i) {
+    if (e !== i)
+      switch (t) {
         default:
-          super.attributeChangedCallback(e, t, i);
+          super.attributeChangedCallback(t, e, i);
           break;
       }
   }
@@ -655,14 +661,14 @@ class R extends n {
   get inverted() {
     return this.hasAttribute("inverted");
   }
-  set inverted(e) {
-    e ? this.setAttribute("inverted", "") : this.removeAttribute("inverted");
+  set inverted(t) {
+    t ? this.setAttribute("inverted", "") : this.removeAttribute("inverted");
   }
   get hideFooter() {
     return this.hasAttribute("hide-footer");
   }
-  set hideFooter(e) {
-    e ? this.setAttribute("hide-footer", "") : this.removeAttribute("hide-footer");
+  set hideFooter(t) {
+    t ? this.setAttribute("hide-footer", "") : this.removeAttribute("hide-footer");
   }
 }
 customElements.get("px-selectable-box") || customElements.define("px-selectable-box", R);
@@ -690,8 +696,8 @@ class F extends n {
     `;
   }
   constructor() {
-    var e;
-    super(g), this.shadowRoot.innerHTML = this.template(), this.internals = (e = this.attachInternals) == null ? void 0 : e.call(this), this.toggleFooterVisibility = this.toggleFooterVisibility.bind(this), this.role = "checkbox", this.internals && (this.internals.role = "checkbox", this.internals.ariaChecked = `${this.checked}`), this.ariaChecked = `${this.checked}`;
+    var t;
+    super(g), this.shadowRoot.innerHTML = this.template(), this.internals = (t = this.attachInternals) == null ? void 0 : t.call(this), this.toggleFooterVisibility = this.toggleFooterVisibility.bind(this), this.role = "checkbox", this.internals && (this.internals.role = "checkbox", this.internals.ariaChecked = `${this.checked}`), this.ariaChecked = `${this.checked}`;
   }
   connectedCallback() {
     this.tabIndex = 0, this.toggleFooterVisibility(), this.$slotFooter.addEventListener(
@@ -709,15 +715,15 @@ class F extends n {
       "disabled"
     ];
   }
-  attributeChangedCallback(e, t, i) {
-    if (t !== i)
-      switch (e) {
+  attributeChangedCallback(t, e, i) {
+    if (e !== i)
+      switch (t) {
         case "inverted":
           this.inverted ? (this.$selectableBox.setAttribute("inverted", ""), this.$checkbox.setAttribute("inverted", "")) : (this.$selectableBox.removeAttribute("inverted"), this.$checkbox.removeAttribute("inverted"));
           break;
         case "name":
         case "value":
-          this.$checkbox && this.$checkbox.setAttribute(e, i);
+          this.$checkbox && this.$checkbox.setAttribute(t, i);
           break;
         case "disabled":
           this.handleDisabledAttributeChange(i !== null);
@@ -726,7 +732,7 @@ class F extends n {
           this.handleCheckedAttributeChange(i);
           break;
         default:
-          super.attributeChangedCallback(e, t, i);
+          super.attributeChangedCallback(t, e, i);
           break;
       }
   }
@@ -742,25 +748,25 @@ class F extends n {
   setHoverAttribute() {
     this.$checkbox.setAttribute("hover", "");
   }
-  setKeypressEvent(e) {
-    switch (e.stopPropagation(), e.preventDefault(), e.code) {
+  setKeypressEvent(t) {
+    switch (t.stopPropagation(), t.preventDefault(), t.code) {
       case "Space":
         this.click();
         break;
     }
   }
-  setClickEvent(e) {
-    this.checked = !this.checked, e.stopPropagation(), e.preventDefault();
+  setClickEvent(t) {
+    this.checked = !this.checked, t.stopPropagation(), t.preventDefault();
   }
   toggleFooterVisibility() {
     this.$slottedFooter ? this.$selectableBox.removeAttribute("hide-footer") : this.$selectableBox.setAttribute("hide-footer", "");
   }
-  handleDisabledAttributeChange(e) {
-    e ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.ariaDisabled = "true", this.$checkbox.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.ariaDisabled = "false", this.$checkbox.removeAttribute("disabled"));
+  handleDisabledAttributeChange(t) {
+    t ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.ariaDisabled = "true", this.$checkbox.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.ariaDisabled = "false", this.$checkbox.removeAttribute("disabled"));
   }
-  handleCheckedAttributeChange(e) {
-    var t;
-    (t = this.internals) == null || t.setFormValue(this.formData()), e === null ? (this.internals && (this.internals.ariaChecked = "false"), this.ariaChecked = "false", this.checked = !1, this.$checkbox && this.$checkbox.removeAttribute("checked")) : (this.internals && (this.internals.ariaChecked = "true"), this.ariaChecked = "true", this.checked = !0, this.$checkbox && this.$checkbox.setAttribute("checked", ""), this.dispatchEvent(
+  handleCheckedAttributeChange(t) {
+    var e;
+    (e = this.internals) == null || e.setFormValue(this.formData()), t === null ? (this.internals && (this.internals.ariaChecked = "false"), this.ariaChecked = "false", this.checked = !1, this.$checkbox && this.$checkbox.removeAttribute("checked")) : (this.internals && (this.internals.ariaChecked = "true"), this.ariaChecked = "true", this.checked = !0, this.$checkbox && this.$checkbox.setAttribute("checked", ""), this.dispatchEvent(
       new Event("change", {
         bubbles: !0,
         composed: !0
@@ -776,13 +782,13 @@ class F extends n {
   formResetCallback() {
     this.checked = !1;
   }
-  formStateRestoreCallback(e) {
-    this.checked = e;
+  formStateRestoreCallback(t) {
+    this.checked = t;
   }
   formData() {
     if (this.name) {
-      const e = new FormData(), t = this.getAttribute("name");
-      return t && (this.checked ? e.set(t, this.value) : e.delete(t)), e;
+      const t = new FormData(), e = this.getAttribute("name");
+      return e && (this.checked ? t.set(e, this.value) : t.delete(e)), t;
     }
   }
   get $el() {
@@ -807,32 +813,32 @@ class F extends n {
   get inverted() {
     return this.hasAttribute("inverted");
   }
-  set inverted(e) {
-    e ? this.setAttribute("inverted", "") : this.removeAttribute("inverted");
+  set inverted(t) {
+    t ? this.setAttribute("inverted", "") : this.removeAttribute("inverted");
   }
   get checked() {
     return this.hasAttribute("checked");
   }
-  set checked(e) {
-    e ? this.setAttribute("checked", "") : this.removeAttribute("checked");
+  set checked(t) {
+    t ? this.setAttribute("checked", "") : this.removeAttribute("checked");
   }
   get name() {
     return this.getAttribute("name");
   }
-  set name(e) {
-    e ? this.setAttribute("name", e) : this.removeAttribute("name");
+  set name(t) {
+    t ? this.setAttribute("name", t) : this.removeAttribute("name");
   }
   get disabled() {
     return this.hasAttribute("disabled");
   }
-  set disabled(e) {
-    e ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
+  set disabled(t) {
+    t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
   }
   get value() {
     return this.getAttribute("value");
   }
-  set value(e) {
-    e ? this.setAttribute("value", e) : this.removeAttribute("value");
+  set value(t) {
+    t ? this.setAttribute("value", t) : this.removeAttribute("value");
   }
 }
 customElements.get("px-selectable-box-checkbox") || customElements.define("px-selectable-box-checkbox", F);
@@ -860,12 +866,12 @@ class H extends n {
     `;
   }
   constructor() {
-    var e;
-    super(f), this.shadowRoot.innerHTML = this.template(), this.internals = (e = this.attachInternals) == null ? void 0 : e.call(this), this.toggleFooterVisibility = this.toggleFooterVisibility.bind(this), this.role = "radio", this.internals && (this.internals.role = "radio", this.internals.ariaChecked = `${this.checked}`), this.ariaChecked = `${this.checked}`;
+    var t;
+    super(f), this.shadowRoot.innerHTML = this.template(), this.internals = (t = this.attachInternals) == null ? void 0 : t.call(this), this.toggleFooterVisibility = this.toggleFooterVisibility.bind(this), this.role = "radio", this.internals && (this.internals.role = "radio", this.internals.ariaChecked = `${this.checked}`), this.ariaChecked = `${this.checked}`;
   }
   connectedCallback() {
-    var e;
-    this.tabIndex = ((e = this.parentElement) == null ? void 0 : e.firstElementChild) === this ? 0 : -1, this.toggleFooterVisibility(), this.$slotFooter.addEventListener(
+    var t;
+    this.tabIndex = ((t = this.parentElement) == null ? void 0 : t.firstElementChild) === this ? 0 : -1, this.toggleFooterVisibility(), this.$slotFooter.addEventListener(
       "slotchange",
       this.toggleFooterVisibility
     ), this.addEventListener("mouseover", this.setHoverAttribute), this.addEventListener("mouseout", this.removeHoverAttribute), this.addEventListener("keypress", this.setKeypressEvent), this.addEventListener("click", this.setClickEvent), this.hasAttribute("checked") && (this.checked = !0);
@@ -880,15 +886,15 @@ class H extends n {
       "disabled"
     ];
   }
-  attributeChangedCallback(e, t, i) {
-    if (t !== i)
-      switch (e) {
+  attributeChangedCallback(t, e, i) {
+    if (e !== i)
+      switch (t) {
         case "inverted":
           this.inverted ? (this.$selectableBox.setAttribute("inverted", ""), this.$radio.setAttribute("inverted", "")) : (this.$selectableBox.removeAttribute("inverted"), this.$radio.removeAttribute("inverted"));
           break;
         case "name":
         case "value":
-          this.$radio && this.$radio.setAttribute(e, i);
+          this.$radio && this.$radio.setAttribute(t, i);
           break;
         case "disabled":
           this.handleDisabledAttributeChange(i !== null);
@@ -897,7 +903,7 @@ class H extends n {
           this.handleCheckedAttributeChange(i);
           break;
         default:
-          super.attributeChangedCallback(e, t, i);
+          super.attributeChangedCallback(t, e, i);
           break;
       }
   }
@@ -913,25 +919,25 @@ class H extends n {
   setHoverAttribute() {
     this.$radio.setAttribute("hover", "");
   }
-  setKeypressEvent(e) {
-    switch (e.preventDefault(), e.code) {
+  setKeypressEvent(t) {
+    switch (t.preventDefault(), t.code) {
       case "Space":
         this.click();
         break;
     }
   }
-  setClickEvent(e) {
-    this.checked || (this.checked = !0), e.stopPropagation(), e.preventDefault();
+  setClickEvent(t) {
+    this.checked || (this.checked = !0), t.stopPropagation(), t.preventDefault();
   }
   toggleFooterVisibility() {
     this.$slottedFooter ? this.$selectableBox.removeAttribute("hide-footer") : this.$selectableBox.setAttribute("hide-footer", "");
   }
-  handleDisabledAttributeChange(e) {
-    e ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.ariaDisabled = "true", this.$radio.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.ariaDisabled = "false", this.$radio.removeAttribute("disabled"));
+  handleDisabledAttributeChange(t) {
+    t ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.ariaDisabled = "true", this.$radio.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.ariaDisabled = "false", this.$radio.removeAttribute("disabled"));
   }
-  handleCheckedAttributeChange(e) {
-    var t;
-    (t = this.internals) == null || t.setFormValue(this.formData()), e === null ? (this.internals && (this.internals.ariaChecked = "false"), this.ariaChecked = "false", this.tabIndex = -1, this.checked = !1, this.$radio && this.$radio.removeAttribute("checked")) : (this.internals && (this.internals.ariaChecked = "true"), this.ariaChecked = "true", this.tabIndex = 0, this.checked = !0, this.$radio && this.$radio.setAttribute("checked", ""), this.dispatchEvent(
+  handleCheckedAttributeChange(t) {
+    var e;
+    (e = this.internals) == null || e.setFormValue(this.formData()), t === null ? (this.internals && (this.internals.ariaChecked = "false"), this.ariaChecked = "false", this.tabIndex = -1, this.checked = !1, this.$radio && this.$radio.removeAttribute("checked")) : (this.internals && (this.internals.ariaChecked = "true"), this.ariaChecked = "true", this.tabIndex = 0, this.checked = !0, this.$radio && this.$radio.setAttribute("checked", ""), this.dispatchEvent(
       new Event("change", {
         bubbles: !0,
         composed: !0
@@ -947,13 +953,13 @@ class H extends n {
   formResetCallback() {
     this.checked = !1;
   }
-  formStateRestoreCallback(e) {
-    this.checked = e;
+  formStateRestoreCallback(t) {
+    this.checked = t;
   }
   formData() {
     if (this.name) {
-      const e = new FormData(), t = this.getAttribute("name");
-      return t && (this.checked ? e.set(t, this.value) : e.delete(t)), e;
+      const t = new FormData(), e = this.getAttribute("name");
+      return e && (this.checked ? t.set(e, this.value) : t.delete(e)), t;
     }
   }
   get $el() {
@@ -978,32 +984,32 @@ class H extends n {
   get inverted() {
     return this.hasAttribute("inverted");
   }
-  set inverted(e) {
-    e ? this.setAttribute("inverted", "") : this.removeAttribute("inverted");
+  set inverted(t) {
+    t ? this.setAttribute("inverted", "") : this.removeAttribute("inverted");
   }
   get checked() {
     return this.hasAttribute("checked");
   }
-  set checked(e) {
-    e ? this.setAttribute("checked", "") : this.removeAttribute("checked");
+  set checked(t) {
+    t ? this.setAttribute("checked", "") : this.removeAttribute("checked");
   }
   get name() {
     return this.getAttribute("name");
   }
-  set name(e) {
-    e ? this.setAttribute("name", e) : this.removeAttribute("name");
+  set name(t) {
+    t ? this.setAttribute("name", t) : this.removeAttribute("name");
   }
   get disabled() {
     return this.hasAttribute("disabled");
   }
-  set disabled(e) {
-    e ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
+  set disabled(t) {
+    t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
   }
   get value() {
     return this.getAttribute("value");
   }
-  set value(e) {
-    e ? this.setAttribute("value", e) : this.removeAttribute("value");
+  set value(t) {
+    t ? this.setAttribute("value", t) : this.removeAttribute("value");
   }
 }
 customElements.get("px-selectable-box-radio") || customElements.define("px-selectable-box-radio", H);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proximus/lavender-selectablebox",
-  "version": "1.4.1",
+  "version": "1.4.2-beta.1",
   "description": "",
   "main": "dist/index.es.js",
   "types": "dist/index.d.ts",