@justeattakeaway/pie-card - npm Package Compare versions

Comparing version 0.20.0 to 0.20.1

dist/index.js

@@ -6,4 +6,4 @@ import { unsafeCSS as m, LitElement as y, html as u, nothing as v } from "lit";
 import { validPropertyValues as g, defineCustomElement as $ } from "@justeattakeaway/pie-webc-core";
-const k = `.c-card.c-card--draggable{cursor:grab}.c-card.c-card--draggable:active{cursor:grabbing}*,*:after,*:before{box-sizing:inherit}.c-card{--card-bg-color: var(--dt-color-container-default);--card-color: var(--dt-color-content-default);--card-radius: var(--dt-radius-rounded-c);--card-border-color: transparent;display:block;position:relative;color:var(--card-color);background-color:var(--card-bg-color);border:1px solid var(--card-border-color);border-radius:var(--card-radius);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;text-decoration:none}.c-card:focus-visible{box-shadow:0 0 0 2px var(--dt-color-focus-inner),0 0 0 4px var(--dt-color-focus-outer);outline:none}.c-card.c-card--disabled{--card-bg-color: var(--dt-color-disabled-01);cursor:not-allowed}.c-card.c-card--disabled ::slotted(*){color:var(--dt-color-content-disabled)}.c-card.c-card--disabled img{opacity:.5}.c-card.c-card--default{box-shadow:var(--dt-elevation-card)}.c-card.c-card--default:hover:not(.c-card--disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--card-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + var(--hover-modifier)))}.c-card.c-card--default:active:not(.c-card--disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--card-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + var(--active-modifier)))}.c-card.c-card--outline{border-color:var(--dt-color-border-strong)}.c-card.c-card--outline:hover:not(.c-card--disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--card-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + var(--hover-modifier)))}.c-card.c-card--outline:active:not(.c-card--disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--card-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + var(--active-modifier)))}.c-card.c-card--inverse{--card-bg-color: var(--dt-color-container-dark);--card-color: var(--dt-color-content-inverse);box-shadow:var(--dt-elevation-dark-card)}.c-card.c-card--inverse:hover:not(.c-card--disabled){--hover-modifier: var(--dt-color-hover-01);--card-bg-color: hsl(var(--dt-color-container-dark-h), var(--dt-color-container-dark-s), calc(var(--dt-color-container-dark-l) + var(--hover-modifier)))}.c-card.c-card--inverse:active:not(.c-card--disabled){--active-modifier: var(--dt-color-active-01);--card-bg-color: hsl(var(--dt-color-container-dark-h), var(--dt-color-container-dark-s), calc(var(--dt-color-container-dark-l) + var(--active-modifier)))}.c-card.c-card--outline-inverse{--card-bg-color: var(--dt-color-container-dark);--card-color: var(--dt-color-content-inverse);border-color:var(--dt-color-border-inverse)}.c-card.c-card--outline-inverse:hover:not(.c-card--disabled){--hover-modifier: var(--dt-color-hover-01);--card-bg-color: hsl(var(--dt-color-container-dark-h), var(--dt-color-container-dark-s), calc(var(--dt-color-container-dark-l) + var(--hover-modifier)))}.c-card.c-card--outline-inverse:active:not(.c-card--disabled){--active-modifier: var(--dt-color-active-01);--card-bg-color: hsl(var(--dt-color-container-dark-h), var(--dt-color-container-dark-s), calc(var(--dt-color-container-dark-l) + var(--active-modifier)))}.c-card.c-card--inverse.c-card--disabled,.c-card.c-card--outline-inverse.c-card--disabled{--card-bg-color: var(--dt-color-disabled-01-inverse)}
-`, x = ["default", "outline", "inverse", "outline-inverse"], C = ["a", "button"], h = ["a", "b", "c", "d", "e", "f", "g"], P = h.flatMap((i) => [i, ...h.map((o) => `${i},${o}`)]), l = {
+const x = `.c-card.c-card--draggable{cursor:grab}.c-card.c-card--draggable:active{cursor:grabbing}*,*:after,*:before{box-sizing:inherit}.c-card{--card-bg-color: var(--dt-color-container-default);--card-color: var(--dt-color-content-default);--card-radius: var(--dt-radius-rounded-c);--card-border-color: transparent;display:block;position:relative;color:var(--card-color);background-color:var(--card-bg-color);border:1px solid var(--card-border-color);border-radius:var(--card-radius);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;text-decoration:none}.c-card:focus-visible{box-shadow:0 0 0 2px var(--dt-color-focus-inner),0 0 0 4px var(--dt-color-focus-outer);outline:none}.c-card.c-card--disabled{--card-bg-color: var(--dt-color-disabled-01);cursor:not-allowed}.c-card.c-card--disabled ::slotted(*){color:var(--dt-color-content-disabled)}.c-card.c-card--disabled img{opacity:.5}.c-card.c-card--default{box-shadow:var(--dt-elevation-card)}.c-card.c-card--default:hover:not(.c-card--disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--card-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + var(--hover-modifier)))}.c-card.c-card--default:active:not(.c-card--disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--card-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + var(--active-modifier)))}.c-card.c-card--outline{border-color:var(--dt-color-border-strong)}.c-card.c-card--outline:hover:not(.c-card--disabled){--hover-modifier: calc(-1 * var(--dt-color-hover-01));--card-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + var(--hover-modifier)))}.c-card.c-card--outline:active:not(.c-card--disabled){--active-modifier: calc(-1 * var(--dt-color-active-01));--card-bg-color: hsl(var(--dt-color-container-default-h), var(--dt-color-container-default-s), calc(var(--dt-color-container-default-l) + var(--active-modifier)))}.c-card.c-card--inverse{--card-bg-color: var(--dt-color-container-inverse);--card-color: var(--dt-color-content-inverse);box-shadow:var(--dt-elevation-dark-card)}.c-card.c-card--inverse:hover:not(.c-card--disabled){--hover-modifier: var(--dt-color-hover-01);--card-bg-color: hsl(var(--dt-color-container-inverse-h), var(--dt-color-container-inverse-s), calc(var(--dt-color-container-inverse-l) + var(--hover-modifier)))}.c-card.c-card--inverse:active:not(.c-card--disabled){--active-modifier: var(--dt-color-active-01);--card-bg-color: hsl(var(--dt-color-container-inverse-h), var(--dt-color-container-inverse-s), calc(var(--dt-color-container-inverse-l) + var(--active-modifier)))}.c-card.c-card--outline-inverse{--card-bg-color: var(--dt-color-container-inverse);--card-color: var(--dt-color-content-inverse);border-color:var(--dt-color-border-inverse)}.c-card.c-card--outline-inverse:hover:not(.c-card--disabled){--hover-modifier: var(--dt-color-hover-01);--card-bg-color: hsl(var(--dt-color-container-inverse-h), var(--dt-color-container-inverse-s), calc(var(--dt-color-container-inverse-l) + var(--hover-modifier)))}.c-card.c-card--outline-inverse:active:not(.c-card--disabled){--active-modifier: var(--dt-color-active-01);--card-bg-color: hsl(var(--dt-color-container-inverse-h), var(--dt-color-container-inverse-s), calc(var(--dt-color-container-inverse-l) + var(--active-modifier)))}.c-card.c-card--inverse.c-card--disabled,.c-card.c-card--outline-inverse.c-card--disabled{--card-bg-color: var(--dt-color-disabled-01-inverse)}
+`, C = ["default", "outline", "inverse", "outline-inverse"], P = ["a", "button"], h = ["a", "b", "c", "d", "e", "f", "g"], D = h.flatMap((i) => [i, ...h.map((e) => `${i},${e}`)]), l = {
   disabled: !1,
@@ -14,6 +14,6 @@ variant: "default",
 };
-var D = Object.defineProperty, w = Object.getOwnPropertyDescriptor, d = (i, o, e, r) => {
-  for (var a = r > 1 ? void 0 : r ? w(o, e) : o, n = i.length - 1, s; n >= 0; n--)
-    (s = i[n]) && (a = (r ? s(o, e, a) : s(a)) || a);
-  return r && a && D(o, e, a), a;
+var w = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, d = (i, e, o, r) => {
+  for (var a = r > 1 ? void 0 : r ? _(e, o) : e, n = i.length - 1, s; n >= 0; n--)
+    (s = i[n]) && (a = (r ? s(e, o, a) : s(a)) || a);
+  return r && a && w(e, o, a), a;
 };
@@ -30,8 +30,8 @@ const b = "pie-card";
    */
-  renderAnchor(o) {
+  renderAnchor(e) {
     var r;
-    const e = this.generatePaddingCSS();
+    const o = this.generatePaddingCSS();
     return u`
             <a
-                class="${p(o)}"
+                class="${p(e)}"
                 data-test-id="pie-card"
@@ -45,3 +45,3 @@ ?disabled=${this.disabled}
                 aria-disabled=${this.disabled ? "true" : "false"}
-                style=${S(e)}>
+                style=${S(o)}>
                     <slot></slot>
@@ -62,13 +62,13 @@ </div>
   generatePaddingCSS() {
-    const { padding: o } = this;
-    let e = "";
-    if (!o)
+    const { padding: e } = this;
+    let o = "";
+    if (!e)
       return "";
-    const r = o.split(",").map((a) => a.trim()).filter((a) => /^[a-g]$/.test(a));
-    return r.length > 0 && r.length <= 2 && (e += `var(--dt-spacing-${r[0]})`, r.length > 1 && (e += ` var(--dt-spacing-${r[1]})`)), e ? `padding: ${e}` : "";
+    const r = e.split(",").map((a) => a.trim()).filter((a) => /^[a-g]$/.test(a));
+    return r.length > 0 && r.length <= 2 && (o += `var(--dt-spacing-${r[0]})`, r.length > 1 && (o += ` var(--dt-spacing-${r[1]})`)), o ? `padding: ${o}` : "";
   }
   render() {
     const {
-      variant: o,
-      disabled: e,
+      variant: e,
+      disabled: o,
       tag: r,
@@ -79,5 +79,5 @@ aria: a,
       "c-card": !0,
-      [`c-card--${o}`]: !0,
+      [`c-card--${e}`]: !0,
       "c-card--draggable": n,
-      "c-card--disabled": e
+      "c-card--disabled": o
     };
@@ -91,3 +91,3 @@ return r === "a" ? this.renderAnchor(f) : u`
                     aria-label=${(a == null ? void 0 : a.label) || v}
-                    aria-disabled=${e ? "true" : "false"}
+                    aria-disabled=${o ? "true" : "false"}
                     style=${s || ""}>
@@ -99,10 +99,10 @@ <slot></slot>
 }
-c.styles = m(k);
+c.styles = m(x);
 d([
   t(),
-  g(b, C, l.tag)
+  g(b, P, l.tag)
 ], c.prototype, "tag", 2);
 d([
   t(),
-  g(b, x, l.variant)
+  g(b, C, l.variant)
 ], c.prototype, "variant", 2);
@@ -129,3 +129,3 @@ d([
   t({ type: String }),
-  g(b, P, void 0)
+  g(b, D, void 0)
 ], c.prototype, "padding", 2);
@@ -136,5 +136,5 @@ $(b, c);
   l as defaultProps,
-  P as paddingValues,
-  C as tags,
-  x as variants
+  D as paddingValues,
+  P as tags,
+  C as variants
 };

package.json

 {
   "name": "@justeattakeaway/pie-card",
-  "version": "0.20.0",
+  "version": "0.20.1",
   "description": "PIE Design System Card built using Web Components",
@@ -5,0 +5,0 @@ "type": "module",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

35536

increased by0.15%

No dependency changes