@proximus/lavender-cell 1.4.18-alpha.9 → 1.4.18-beta.1

package/dist/index.es.js

@@ -2,7 +2,7 @@ import { PxElement as e, WithExtraAttributes as t, booleanPropertyToAttributeSet
 import "@proximus/lavender-layout";
 import { checkboxStateValues as c } from "@proximus/lavender-checkbox";
 import { stateValues as l } from "@proximus/lavender-radio-group";
-//#region src/Common.ts
+// src/Common.ts
 var u = [
 	"",
 	"default",
@@ -20,11 +20,7 @@ function p(e) {
 	e.getAttribute("variant") === "contained" && !e.getAttribute("background-color") && e.setAttribute("background-color", "container-light");
 }
 function m(e, t, n) {
-	if (!r(u, n)) {
-		a(`"${n}" is not a valid variant value for a cell. Allowed values are: "${u.join("\", \"")}".`);
-		return;
-	}
-	t !== null && t !== "" && t !== "default" && e.classList.toggle(t), n !== null && n !== "" && n !== "default" && e.classList.toggle(n);
+	r(u, n) ? (t !== null && t !== "" && t !== "default" && e.classList.toggle(t), n !== null && n !== "" && n !== "default" && e.classList.toggle(n)) : a(`"${n}" is not a valid variant value for a cell. Allowed values are: "${u.join("\", \"")}".`);
 }
 function h(e, t, n, r = []) {
 	n ? (e.setAttribute("inverted", ""), r.forEach((e) => e.setAttribute("inverted", "")), t.forEach((e) => {
@@ -50,8 +46,7 @@ function _(e, t, n, r = [], i = {}) {
 		e.hasAttribute("disabled") && e.removeAttribute("disabled");
 	}), i.ariaEl && i.setAria && i.ariaEl.setAttribute("aria-disabled", "false"), i.ariaEl && i.setTabIndex && (i.ariaEl.tabIndex = 0));
 }
-//#endregion
-//#region src/common.css?inline
+// src/common.css?inline
 var v = ":host{outline:none;display:block}:is(:host .cell,:host .cell-link,:host .cell-button,:host .cell-checkbox,:host .cell-radio,:host .cell-switch),:is(:host .cell,:host .cell-link,:host .cell-button,:host .cell-checkbox,:host .cell-radio,:host .cell-switch) *{box-sizing:border-box}:host .cell,:host .cell-link,:host .cell-button,:host .cell-checkbox,:host .cell-radio,:host .cell-switch{--btn-transition:all .2s ease-in-out 0s;transition:var(--btn-transition);display:block}:host .cell-link,:host .cell-button,:host .cell-checkbox,:host .cell-radio,:host .cell-switch{outline-color:var(--px-color-border-focus-outline-default);outline-width:var(--px-focus-outline-mobile);width:100%}:host .cell-link,:host .cell-button{cursor:pointer}:host .cell-checkbox,:host .cell-radio,:host .cell-switch{cursor:default}:host:host(:not([disabled])):host(:focus-visible) .cell-checkbox,:host:host(:not([disabled])):host(:focus-visible) .cell-radio,:host:host(:not([disabled])):host(:focus-visible) .cell-switch{outline-offset:var(--px-focus-offset-mobile);outline-style:solid;position:relative}:is(:host:host(:not([disabled])) .cell-link,:host:host(:not([disabled])) .cell-button):focus-visible{outline-offset:var(--px-focus-offset-mobile);outline-style:solid;position:relative}:host:host([disabled]) .cell-link,:host:host([disabled]) .cell-button,:host:host([disabled]) .cell-checkbox,:host:host([disabled]) .cell-radio,:host:host([disabled]) .cell-switch{cursor:default;pointer-events:none}@media screen and (width>=48rem){:scope:host .cell-link,:scope:host .cell-button,:scope:host .cell-checkbox,:scope:host .cell-radio,:scope:host .cell-switch{outline-width:var(--px-focus-outline-tablet)}:scope:host:host(:not([disabled])):host(:focus-visible) .cell-checkbox,:scope:host:host(:not([disabled])):host(:focus-visible) .cell-radio,:scope:host:host(:not([disabled])):host(:focus-visible) .cell-switch{outline-offset:var(--px-focus-offset-tablet);outline-width:var(--px-focus-outline-tablet)}:is(:scope:host:host(:not([disabled])) .cell-link,:scope:host:host(:not([disabled])) .cell-button):focus-visible{outline-offset:var(--px-focus-offset-tablet);outline-width:var(--px-focus-outline-tablet)}}@media screen and (width>=64.0625rem){:scope:host .cell-link,:scope:host .cell-button,:scope:host .cell-checkbox,:scope:host .cell-radio,:scope:host .cell-switch{outline-width:var(--px-focus-outline-desktop)}:scope:host:host(:not([disabled])):host(:focus-visible) .cell-checkbox,:scope:host:host(:not([disabled])):host(:focus-visible) .cell-radio,:scope:host:host(:not([disabled])):host(:focus-visible) .cell-switch{outline-offset:var(--px-focus-offset-desktop);outline-width:var(--px-focus-outline-desktop)}:is(:scope:host:host(:not([disabled])) .cell-link,:scope:host:host(:not([disabled])) .cell-button):focus-visible{outline-offset:var(--px-focus-offset-desktop);outline-width:var(--px-focus-outline-desktop)}}:host([inverted]) .cell-link,:host([inverted]) .cell-button,:host([inverted]) .cell-checkbox,:host([inverted]) .cell-radio,:host([inverted]) .cell-switch{outline-color:var(--px-color-border-focus-outline-inverted)}", y = ":host([separator]):after{content:\"\";border-bottom:var(--px-size-border-m) solid var(--px-color-border-main-default);width:100%;display:block;position:relative}.cell{color:var(--px-color-text-neutral-default);padding:var(--px-spacing-s-mobile);font-family:var(--px-font-family)}.cell ::slotted([slot=label]){font-size:var(--px-text-size-label-l-mobile);font-weight:var(--px-font-weight-title);line-height:var(--px-line-height-ratio-l)}.cell ::slotted([slot=description]){font-weight:var(--px-font-weight-body);font-size:var(--px-text-size-label-m-mobile);line-height:var(--px-line-height-ratio-l)}.cell ::slotted([slot=suffix]){text-align:right;font-weight:var(--px-font-weight-title);line-height:var(--px-line-height-ratio-l)}.cell[compact]{padding-block:var(--px-spacing-xs-mobile)}:host([hoverable]:not([disabled])) .cell{cursor:pointer;text-decoration:none}:host([hoverable]:hover:not([disabled])) .cell{background-color:var(--px-color-background-state-hover-default)}:host([hoverable][disabled]) .cell{cursor:default;pointer-events:none;color:var(--px-color-text-state-disabled-default)}.contained{background-color:var(--cell-contained-background-color-default,var(--px-color-background-container-light-default))}:host([hoverable]) .contained{border:var(--px-size-border-m) solid transparent}:host([hoverable]:hover:not([disabled])) .contained{background-color:var(--px-color-background-state-hover-bordered-default);border-color:var(--px-color-border-state-hover-default)}:host([hoverable][disabled]) .contained{background-color:var(--px-color-background-state-disabled-default)}@media screen and (width<=47.938rem){:host([separator--mobile]):after{content:\"\";border-bottom:var(--px-size-border-m) solid var(--px-color-border-main-default);width:100%;display:block;position:relative}.contained{border-radius:var(--cell-contained-border-radius-top-left--mobile,var(--px-radius-main)) var(--cell-contained-border-radius-top-right--mobile,var(--px-radius-main)) var(--cell-contained-border-radius-bottom-right--mobile,var(--px-radius-main)) var(--cell-contained-border-radius-bottom-left--mobile,var(--px-radius-main))}}@media screen and (width>=48rem){:host{display:block}.cell{padding:var(--px-padding-s-tablet)}.cell ::slotted([slot=label]){font-size:var(--px-text-size-label-l-tablet)}.cell ::slotted([slot=description]){font-size:var(--px-text-size-label-m-tablet)}.cell[compact]{padding-block:var(--px-spacing-xs-tablet)}}@media screen and (width>=48rem) and (width<=64rem){:host([separator--tablet]):after{content:\"\";border-bottom:var(--px-size-border-m) solid var(--px-color-border-main-default);width:100%;display:block;position:relative}.contained{border-radius:var(--cell-contained-border-radius-top-left--tablet,var(--px-radius-main)) var(--cell-contained-border-radius-top-right--tablet,var(--px-radius-main)) var(--cell-contained-border-radius-bottom-right--tablet,var(--px-radius-main)) var(--cell-contained-border-radius-bottom-left--tablet,var(--px-radius-main))}}@media screen and (width>=64.0625rem){:host{display:block}.cell{padding:var(--px-spacing-s-laptop)}.cell ::slotted([slot=label]){font-size:var(--px-text-size-label-l-laptop)}.cell ::slotted([slot=description]){font-size:var(--px-text-size-label-m-laptop)}.cell[compact]{padding-block:var(--px-spacing-xs-laptop)}}@media screen and (width>=64.0625rem) and (width<=90rem){:host([separator--laptop]):after{content:\"\";border-bottom:var(--px-size-border-m) solid var(--px-color-border-main-default);width:100%;display:block;position:relative}.contained{border-radius:var(--cell-contained-border-radius-top-left--laptop,var(--px-radius-main)) var(--cell-contained-border-radius-top-right--laptop,var(--px-radius-main)) var(--cell-contained-border-radius-bottom-right--laptop,var(--px-radius-main)) var(--cell-contained-border-radius-bottom-left--laptop,var(--px-radius-main))}}@media screen and (width>=90.0625rem){:host{display:block}:host([separator--desktop]):after{content:\"\";border-bottom:var(--px-size-border-m) solid var(--px-color-border-main-default);width:100%;display:block;position:relative}.cell{padding:var(--px-spacing-s-desktop)}.cell ::slotted([slot=label]){font-size:var(--px-text-size-label-l-desktop)}.cell ::slotted([slot=description]){font-size:var(--px-text-size-label-m-desktop)}.cell[compact]{padding-block:var(--px-spacing-xs-desktop)}.contained{border-radius:var(--cell-contained-border-radius-top-left--desktop,var(--px-radius-main)) var(--cell-contained-border-radius-top-right--desktop,var(--px-radius-main)) var(--cell-contained-border-radius-bottom-right--desktop,var(--px-radius-main)) var(--cell-contained-border-radius-bottom-left--desktop,var(--px-radius-main))}}:host([inverted]):after{border-bottom-color:var(--px-color-border-main-inverted)}:host([inverted]) .cell{color:var(--px-color-text-neutral-inverted)}:host([inverted]):host([hoverable]:hover:not([disabled])) .cell{background-color:var(--px-color-background-state-hover-inverted)}:host([inverted]):host([hoverable][disabled]) .cell{color:var(--px-color-text-state-disabled-inverted)}:host([inverted]):host([hoverable][disabled]) .contained{background-color:var(--px-color-background-state-disabled-inverted)}:host([inverted]) .contained{background-color:var(--cell-contained-background-color-inverted,var(--px-color-background-container-light-inverted))}:host([inverted]):host([hoverable]:hover:not([disabled])) .contained{background-color:var(--px-color-background-state-hover-bordered-inverted);border-color:var(--px-color-border-state-hover-inverted)}", b = new CSSStyleSheet(), x = new CSSStyleSheet();
 b.replaceSync(v), x.replaceSync(y);
 var S = ["secondary"], C = [
@@ -257,8 +252,7 @@ var S = ["secondary"], C = [
 	}
 };
 customElements.get("px-cell") || customElements.define("px-cell", w);
-//#endregion
-//#region src/cell-link.css?inline
+// src/cell-link.css?inline
 var T = ".cell-link{text-decoration:none}.cell-link[noicon=\"\"] px-icon{display:none}.cell-link px-icon{color:var(--px-color-icon-brand-default)}.cell-link[aria-disabled=true] px-icon{color:var(--px-color-icon-state-disabled-default)}[compact] .cell-link{padding-block:var(--px-spacing-xs-mobile)}:host([inverted]) .cell-link px-icon{color:var(--px-color-icon-brand-inverted)}:host([inverted]) .cell-link[aria-disabled=true] px-icon{color:var(--px-color-icon-state-disabled-inverted)}", E = new CSSStyleSheet();
 E.replaceSync(v);
 var D = new CSSStyleSheet();
@@ -447,8 +441,7 @@ var O = class t extends e {
 	}
 };
 customElements.get("px-cell-link") || customElements.define("px-cell-link", O);
-//#endregion
-//#region src/cell-button.css?inline
+// src/cell-button.css?inline
 var k = ".cell-button{text-align:left;font-size:inherit;background:0 0;border:none;padding:0}", A = new CSSStyleSheet();
 A.replaceSync(v);
 var j = new CSSStyleSheet();
@@ -626,8 +619,7 @@ var M = class t extends e {
 	}
 };
 customElements.get("px-cell-button") || customElements.define("px-cell-button", M);
-//#endregion
-//#region src/CellCheckbox.ts
+// src/CellCheckbox.ts
 var N = new CSSStyleSheet();
 N.replaceSync(v);
 var P = [
@@ -738,11 +730,7 @@ var P = [
 		})));
 	}
 	handleCheckboxPositionChange(e) {
-		if (!this.checkName(P, e)) {
-			a(`"${e}" is not a valid position value for ${this.tagName.toLowerCase()}. Allowed values are: "${P.join("\", \"")}".`);
-			return;
-		}
-		this.$checkbox && (e === "" || e === "left" ? this.$checkbox.setAttribute("slot", "prefix") : e === "right" && this.$checkbox.setAttribute("slot", "action-indicator"));
+		this.checkName(P, e) ? this.$checkbox && (e === "" || e === "left" ? this.$checkbox.setAttribute("slot", "prefix") : e === "right" && this.$checkbox.setAttribute("slot", "action-indicator")) : a(`"${e}" is not a valid position value for ${this.tagName.toLowerCase()}. Allowed values are: "${P.join("\", \"")}".`);
 	}
 	static get formAssociated() {
 		return !0;
@@ -898,8 +886,7 @@ var P = [
 	}
 };
 customElements.get("px-cell-checkbox") || customElements.define("px-cell-checkbox", F);
-//#endregion
-//#region src/CellSwitch.ts
+// src/CellSwitch.ts
 var I = new CSSStyleSheet();
 I.replaceSync(v);
 var L = class e extends t {
@@ -1139,8 +1126,7 @@ var L = class e extends t {
 	}
 };
 customElements.get("px-cell-switch") || customElements.define("px-cell-switch", L);
-//#endregion
-//#region src/CellRadio.ts
+// src/CellRadio.ts
 var R = new CSSStyleSheet();
 R.replaceSync(v);
 var z = [
@@ -1251,11 +1237,7 @@ var z = [
 		})));
 	}
 	handleRadioPositionChange(e) {
-		if (!this.checkName(z, e)) {
-			a(`"${e}" is not a valid position value for ${this.tagName.toLowerCase()}. Allowed values are: "${z.join("\", \"")}".`);
-			return;
-		}
-		this.$radio && (e === "" || e === "left" ? this.$radio.setAttribute("slot", "prefix") : e === "right" && this.$radio.setAttribute("slot", "action-indicator"));
+		this.checkName(z, e) ? this.$radio && (e === "" || e === "left" ? this.$radio.setAttribute("slot", "prefix") : e === "right" && this.$radio.setAttribute("slot", "action-indicator")) : a(`"${e}" is not a valid position value for ${this.tagName.toLowerCase()}. Allowed values are: "${z.join("\", \"")}".`);
 	}
 	static get formAssociated() {
 		return !0;
@@ -1411,5 +1393,4 @@ var z = [
 	}
 };
 customElements.get("px-cell-radio") || customElements.define("px-cell-radio", B);
-//#endregion
 export { w as Cell, M as CellButton, F as CellCheckbox, O as CellLink, B as CellRadio, L as CellSwitch, P as cellCheckboxPosition, z as cellRadioPosition, C as radiusValues, S as suffixButtonIconVariantValues };

package/dist/web-types.json

@@ -1,14 +1,14 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@proximus/lavender-cell",
-  "version": "1.4.18-alpha.9",
+  "version": "1.4.18-beta.1",
   "description-markup": "markdown",
   "contributions": {
     "html": {
       "elements": [
         {
           "name": "px-cell",
-          "description": "\n\n---\n",
+          "description": "\n---\n",
           "doc-url": "",
           "attributes": [
             { "name": "inverted", "value": { "type": "string" } },
@@ -55,7 +55,7 @@
         },
         {
           "name": "px-cell-button",
-          "description": "A cell component that acts as a button.\n\n---\n",
+          "description": "A cell component that acts as a button.\n---\n",
           "doc-url": "",
           "attributes": [
             { "name": "inverted", "value": { "type": "string" } },
@@ -120,7 +120,7 @@
         },
         {
           "name": "px-cell-checkbox",
-          "description": "\n\n---\n\n\n### **Events:**\n - **change**",
+          "description": "\n---\n\n\n### **Events:**\n - **change**",
           "doc-url": "",
           "attributes": [
             { "name": "inverted", "value": { "type": "string" } },
@@ -179,7 +179,7 @@
         },
         {
           "name": "px-cell-link",
-          "description": "\n\n---\n",
+          "description": "\n---\n",
           "doc-url": "",
           "attributes": [
             { "name": "inverted", "value": { "type": "string" } },
@@ -232,7 +232,7 @@
         },
         {
           "name": "px-cell-radio",
-          "description": "\n\n---\n\n\n### **Events:**\n - **change**",
+          "description": "\n---\n\n\n### **Events:**\n - **change**",
           "doc-url": "",
           "attributes": [
             { "name": "inverted", "value": { "type": "string" } },
@@ -290,7 +290,7 @@
         },
         {
           "name": "px-cell-switch",
-          "description": "\n\n---\n\n\n### **Events:**\n - **change**",
+          "description": "\n---\n\n\n### **Events:**\n - **change**",
           "doc-url": "",
           "attributes": [
             { "name": "inverted", "value": { "type": "string" } },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proximus/lavender-cell",
-  "version": "1.4.18-alpha.9",
+  "version": "1.4.18-beta.1",
   "description": "",
   "main": "dist/index.es.js",
   "types": "dist/index.d.ts",