@proximus/lavender-image 2.0.0-alpha.100 → 2.0.0-alpha.102

package/dist/index.es.js

@@ -1,13 +1,13 @@
-import { cssTokenBreakpoints as x, PxElement as v, noBorderRadiusValues as A, borderRadiusValues as w, log as g } from "@proximus/lavender-common";
+import { cssTokenBreakpoints as v, PxElement as x, noBorderRadiusValues as A, borderRadiusValues as w, log as g } from "@proximus/lavender-common";
 const k = ":host{display:inline-block;line-height:0}:host([cover]) img{width:100%;height:100%;object-fit:cover}picture{display:inline-block}img{display:inline-block;border-style:none;width:var(--img-width--mobile, auto);max-width:100%}.border-radius-main,.border-radius-main img{border-radius:var(--px-radius-main)}.border-radius-pill,.border-radius-pill img{border-radius:var(--px-radius-pill)}.no-border-radius-top,.no-border-radius-top img{border-top-left-radius:var(--px-radius-none);border-top-right-radius:var(--px-radius-none)}.no-border-radius-right,.no-border-radius-right img{border-top-right-radius:var(--px-radius-none);border-bottom-right-radius:var(--px-radius-none)}.no-border-radius-bottom,.no-border-radius-bottom img{border-bottom-left-radius:var(--px-radius-none);border-bottom-right-radius:var(--px-radius-none)}.no-border-radius-left,.no-border-radius-left img{border-top-left-radius:var(--px-radius-none);border-bottom-left-radius:var(--px-radius-none)}.no-border-radius-all,.no-border-radius-all img{border-radius:var(--px-radius-none)}:host([disabled]) img{filter:opacity(.2) grayscale(100%)}@media screen and (max-width: 47.938rem){.no-border-radius-top--mobile,.no-border-radius-top--mobile img{border-top-left-radius:var(--px-radius-none);border-top-right-radius:var(--px-radius-none)}.no-border-radius-right--mobile,.no-border-radius-right--mobile img{border-top-right-radius:var(--px-radius-none);border-bottom-right-radius:var(--px-radius-none)}.no-border-radius-bottom--mobile,.no-border-radius-bottom--mobile img{border-bottom-left-radius:var(--px-radius-none);border-bottom-right-radius:var(--px-radius-none)}.no-border-radius-left--mobile,.no-border-radius-left--mobile img{border-top-left-radius:var(--px-radius-none);border-bottom-left-radius:var(--px-radius-none)}.no-border-radius-all--mobile,.no-border-radius-all--mobile img{border-radius:var(--px-radius-none)}}@media screen and (min-width: 48rem) and (max-width: 64rem){img{width:var(--img-width--tablet, auto)}.no-border-radius-top--tablet,.no-border-radius-top--tablet img{border-top-left-radius:var(--px-radius-none);border-top-right-radius:var(--px-radius-none)}.no-border-radius-right--tablet,.no-border-radius-right--tablet img{border-top-right-radius:var(--px-radius-none);border-bottom-right-radius:var(--px-radius-none)}.no-border-radius-bottom--tablet,.no-border-radius-bottom--tablet img{border-bottom-left-radius:var(--px-radius-none);border-bottom-right-radius:var(--px-radius-none)}.no-border-radius-left--tablet,.no-border-radius-left--tablet img{border-top-left-radius:var(--px-radius-none);border-bottom-left-radius:var(--px-radius-none)}.no-border-radius-all--tablet,.no-border-radius-all--tablet img{border-radius:var(--px-radius-none)}}@media screen and (min-width: 64.0625rem){img{width:var(--img-width--laptop, auto)}.no-border-radius-top--laptop,.no-border-radius-top--laptop img{border-top-left-radius:var(--px-radius-none);border-top-right-radius:var(--px-radius-none)}.no-border-radius-right--laptop,.no-border-radius-right--laptop img{border-top-right-radius:var(--px-radius-none);border-bottom-right-radius:var(--px-radius-none)}.no-border-radius-bottom--laptop,.no-border-radius-bottom--laptop img{border-bottom-left-radius:var(--px-radius-none);border-bottom-right-radius:var(--px-radius-none)}.no-border-radius-left--laptop,.no-border-radius-left--laptop img{border-top-left-radius:var(--px-radius-none);border-bottom-left-radius:var(--px-radius-none)}.no-border-radius-all--laptop,.no-border-radius-all--laptop img{border-radius:var(--px-radius-none)}}@media screen and (min-width: 90.0625rem){img{width:var(--img-width--desktop, auto)}}", m = new CSSStyleSheet();
 m.replaceSync(k);
-const $ = ["", "xs", "s", "m", "l", "xl"], y = ["", "xs", "s", "m", "l", "xl"], E = (c, t, r) => `:host([${c}${r ? `--${r}` : ""}='${t}']) img`, S = "px-image", C = x(
+const $ = ["", "xs", "s", "m", "l", "xl"], y = ["", "xs", "s", "m", "l", "xl"], E = (c, t, r) => `:host([${c}${r ? `--${r}` : ""}='${t}']) img`, S = "px-image", C = v(
   "height",
   E,
   y,
   S,
   "--img-height"
-), p = class p extends v {
+), p = class p extends x {
   constructor() {
     super(m, C);
   }
@@ -68,7 +68,7 @@ const $ = ["", "xs", "s", "m", "l", "xl"], y = ["", "xs", "s", "m", "l", "xl"],
   updateWidth(t, r, e, i) {
     if (!this.checkName(i, e)) {
       g(
-        `${e} is not an allowed ${t} value for ${this.tagName.toLowerCase()}`
+        `"${e}" is not a valid ${t} value for ${this.tagName.toLowerCase()}. Allowed values are: "${i.join('", "')}".`
       );
       return;
     }
@@ -91,7 +91,7 @@ const $ = ["", "xs", "s", "m", "l", "xl"], y = ["", "xs", "s", "m", "l", "xl"],
   updateAttribute(t, r, e, i) {
     if (!this.checkName(i, e))
       g(
-        `${e} is not an allowed ${t} value for ${this.tagName.toLowerCase()}`
+        `"${e}" is not a valid ${t} value for ${this.tagName.toLowerCase()}. Allowed values are: "${i.join('", "')}".`
       );
     else {
       const o = this.splitAttrNameFromBreakpoint(t), s = o.breakpoint;
@@ -227,7 +227,7 @@ const b = class b extends n {
 };
 b.nativeName = "img";
 let u = b;
-customElements.get("px-image") || customElements.define("px-img", u);
+customElements.get("px-img") || customElements.define("px-img", u);
 const h = class h extends n {
   constructor() {
     super(), this.possibleImgExtension = [

package/package.json

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