@proximus/lavender-tile 2.0.0-alpha.1 → 2.0.0-alpha.10

package/dist/TileRadio.d.ts

@@ -2,7 +2,7 @@ import { WithExtraAttributes } from '@proximus/lavender-common';
 import '@proximus/lavender-layout';
 import { Tile } from './Tile';
 import { type IRadio } from '@proximus/lavender-radio-group';
-import { type RadioBase } from '@proximus/lavender-radio-group';
+import { type Radio } from '@proximus/lavender-radio-group';
 export declare class TileRadio extends WithExtraAttributes implements IRadio {
     protected internals: ElementInternals;
     protected template(): string;
@@ -18,7 +18,7 @@ export declare class TileRadio extends WithExtraAttributes implements IRadio {
     formData(): FormData;
     get $tile(): Tile;
     get $el(): HTMLElement;
-    get $radio(): RadioBase;
+    get $radio(): Radio;
     get $slotPrefix(): Element;
     get $children(): NodeListOf<Element>;
     get centerContent(): boolean;

package/dist/index.es.js

@@ -1,7 +1,7 @@
 import { PxElement as b, checkName as E, WithExtraAttributes as u } from "@proximus/lavender-common";
 import "@proximus/lavender-layout";
-import { checkboxStateValues as q } from "@proximus/lavender-checkbox";
-import { stateValues as D } from "@proximus/lavender-radio-group";
+import { checkboxStateValues as D } from "@proximus/lavender-checkbox";
+import { stateValues as q } from "@proximus/lavender-radio-group";
 function l(o) {
   o.hasAttribute("width") || o.setAttribute("width", "s"), o.setAttribute("border-radius", "pill");
 }
@@ -276,7 +276,7 @@ class R extends u {
   }
   constructor() {
     var t;
-    super($), this.shadowRoot.innerHTML = this.template(), this.internals = (t = this.attachInternals) == null ? void 0 : t.call(this), this.tabIndex = 0, this.internals && (this.internals.role = "checkbox", this.internals.ariaChecked = `${this.checked}`);
+    super($), this.shadowRoot.innerHTML = this.template(), this.internals = (t = this.attachInternals) == null ? void 0 : t.call(this), this.tabIndex = 0, this.role = "checkbox", this.internals && (this.internals.role = "checkbox", this.internals.ariaChecked = `${this.checked}`), this.ariaChecked = `${this.checked}`;
   }
   connectedCallback() {
     if (this.$slotPrefix) {
@@ -328,7 +328,7 @@ class R extends u {
           break;
         case "state":
           if (this.$checkbox)
-            if (this.checkName(q, i))
+            if (this.checkName(D, i))
               this.$checkbox.setAttribute("state", i);
             else {
               console.error(`${i} is not a valid state value`);
@@ -344,11 +344,11 @@ class R extends u {
       }
   }
   handleDisabledAttributeChange(t) {
-    t ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.$tile.disabled = !0, this.$checkbox.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.$tile.disabled = !1, this.$checkbox.removeAttribute("disabled"));
+    t ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.ariaDisabled = "true", this.$tile.disabled = !0, this.$checkbox.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.ariaDisabled = "false", this.$tile.disabled = !1, this.$checkbox.removeAttribute("disabled"));
   }
   handleCheckedAttributeChange(t) {
     var e;
-    (e = this.internals) == null || e.setFormValue(this.formData()), t === null ? (this.internals && (this.internals.ariaChecked = "false"), this.checked = !1, this.$checkbox && this.$checkbox.removeAttribute("checked")) : (this.internals && (this.internals.ariaChecked = "true"), this.checked = !0, this.$checkbox && this.$checkbox.setAttribute("checked", ""), this.dispatchEvent(
+    (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
@@ -446,7 +446,7 @@ class L extends u {
       <div class="tile-radio">
         <px-tile hoverable>
           <slot name="prefix" slot="prefix"></slot>
-          <px-radio-base slot="suffix" aria-hidden="true" tabindex="-1"></px-radio-base>
+          <px-radio slot="suffix" aria-hidden="true" tabindex="-1"></px-radio>
           <slot name="label" slot="label"></slot>
           <slot name="description" slot="description"></slot>
         </px-tile>
@@ -454,26 +454,27 @@ class L extends u {
     `;
   }
   constructor() {
-    var t, e;
-    super(C), this.shadowRoot.innerHTML = this.template(), this.internals = (t = this.attachInternals) == null ? void 0 : t.call(this), this.tabIndex = ((e = this.parentElement) == null ? void 0 : e.firstElementChild) === this ? 0 : -1, this.internals && (this.internals.role = "radio", this.internals.ariaChecked = `${this.checked}`);
+    var t;
+    super(C), this.shadowRoot.innerHTML = this.template(), this.internals = (t = this.attachInternals) == null ? void 0 : t.call(this), this.role = "radio", this.internals && (this.internals.role = "radio", this.internals.ariaChecked = `${this.checked}`), this.ariaChecked = `${this.checked}`;
   }
   connectedCallback() {
-    if (this.$slotPrefix) {
-      const t = this.querySelector('px-img[slot="prefix"]');
-      t && l(t);
+    var t;
+    if (this.tabIndex = ((t = this.parentElement) == null ? void 0 : t.firstElementChild) === this ? 0 : -1, this.$slotPrefix) {
+      const e = this.querySelector('px-img[slot="prefix"]');
+      e && l(e);
     }
     this.addEventListener("mouseover", () => {
       this.$radio.setAttribute("hover", "");
     }), this.addEventListener("mouseout", () => {
       this.$radio.removeAttribute("hover");
-    }), this.addEventListener("keypress", (t) => {
-      switch (t.stopPropagation(), t.preventDefault(), t.code) {
+    }), this.addEventListener("keypress", (e) => {
+      switch (e.stopPropagation(), e.preventDefault(), e.code) {
         case "Space":
           this.click();
           break;
       }
-    }), this.addEventListener("click", (t) => {
-      this.checked || (this.checked = !0), t.stopPropagation(), t.preventDefault();
+    }), this.addEventListener("click", (e) => {
+      this.checked || (this.checked = !0), e.stopPropagation(), e.preventDefault();
     }), this.hasAttribute("checked") && (this.checked = !0);
   }
   static get observedAttributes() {
@@ -507,7 +508,7 @@ class L extends u {
           break;
         case "state":
           if (this.$radio)
-            if (this.checkName(D, i))
+            if (this.checkName(q, i))
               this.$radio.setAttribute("state", i);
             else {
               console.error(`${i} is not a valid state value`);
@@ -523,11 +524,11 @@ class L extends u {
       }
   }
   handleDisabledAttributeChange(t) {
-    t ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.$tile.disabled = !0, this.$radio.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.$tile.disabled = !1, this.$radio.removeAttribute("disabled"));
+    t ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.ariaDisabled = "true", this.$tile.disabled = !0, this.$radio.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.ariaDisabled = "false", this.$tile.disabled = !1, this.$radio.removeAttribute("disabled"));
   }
   handleCheckedAttributeChange(t) {
     var e;
-    (e = this.internals) == null || e.setFormValue(this.formData()), t === null ? (this.internals && (this.internals.ariaChecked = "false"), this.setAttribute("tabIndex", "-1"), this.checked = !1, this.$radio && this.$radio.removeAttribute("checked")) : (this.internals && (this.internals.ariaChecked = "true"), this.setAttribute("tabIndex", "0"), this.checked = !0, this.$radio && this.$radio.setAttribute("checked", ""), this.dispatchEvent(
+    (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
@@ -559,7 +560,7 @@ class L extends u {
     return this.shadowRoot.querySelector(".tile-radio");
   }
   get $radio() {
-    return this.shadowRoot.querySelector("px-radio-base");
+    return this.shadowRoot.querySelector("px-radio");
   }
   get $slotPrefix() {
     return this.querySelector('[slot="prefix"]');
@@ -758,7 +759,7 @@ class H extends u {
   }
   constructor() {
     var t;
-    super(w), this.shadowRoot.innerHTML = this.template(), this.internals = (t = this.attachInternals) == null ? void 0 : t.call(this), this.tabIndex = 0, this.internals && (this.internals.role = "checkbox", this.internals.ariaChecked = `${this.checked}`);
+    super(w), this.shadowRoot.innerHTML = this.template(), this.internals = (t = this.attachInternals) == null ? void 0 : t.call(this), this.tabIndex = 0, this.role = "checkbox", this.internals && (this.internals.role = "checkbox", this.internals.ariaChecked = `${this.checked}`), this.ariaChecked = `${this.checked}`;
   }
   connectedCallback() {
     if (this.$slotPrefix) {
@@ -816,11 +817,11 @@ class H extends u {
       }
   }
   handleDisabledAttributeChange(t) {
-    t ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.$tile.disabled = !0, this.$switch.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.$tile.disabled = !1, this.$switch.removeAttribute("disabled"));
+    t ? (this.disabled = !0, this.internals && (this.internals.ariaDisabled = "true"), this.ariaDisabled = "true", this.$tile.disabled = !0, this.$switch.setAttribute("disabled", "")) : (this.disabled = !1, this.internals && (this.internals.ariaDisabled = "false"), this.ariaDisabled = "false", this.$tile.disabled = !1, this.$switch.removeAttribute("disabled"));
   }
   handleCheckedAttributeChange(t) {
     var e;
-    (e = this.internals) == null || e.setFormValue(this.formData()), t === null ? (this.internals && (this.internals.ariaChecked = "false"), this.checked = !1, this.$switch && this.$switch.removeAttribute("checked")) : (this.internals && (this.internals.ariaChecked = "true"), this.checked = !0, this.$switch && this.$switch.setAttribute("checked", ""), this.dispatchEvent(
+    (e = this.internals) == null || e.setFormValue(this.formData()), t === null ? (this.internals && (this.internals.ariaChecked = "false"), this.ariaChecked = "false", this.checked = !1, this.$switch && this.$switch.removeAttribute("checked")) : (this.internals && (this.internals.ariaChecked = "true"), this.ariaChecked = "true", this.checked = !0, this.$switch && this.$switch.setAttribute("checked", ""), this.dispatchEvent(
       new Event("change", {
         bubbles: !0,
         composed: !0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proximus/lavender-tile",
-  "version": "2.0.0-alpha.1",
+  "version": "2.0.0-alpha.10",
   "description": "",
   "main": "dist/index.es.js",
   "types": "dist/index.d.ts",