@justeattakeaway/pie-button 0.39.1 → 0.40.0

package/dist/index.js

@@ -1,5 +1,5 @@
 import { unsafeCSS as wt, LitElement as xt, html as N, nothing as O } from "lit";
-import { property as p } from "lit/decorators.js";
+import { property as m } from "lit/decorators.js";
 import { ifDefined as Et } from "lit/directives/if-defined.js";
 import "@justeattakeaway/pie-spinner";
 const R = (d, n, a) => function(b, y) {
@@ -242,7 +242,7 @@ const zt = ["xsmall", "small-productive", "small-expressive", "medium", "large"]
       this.badInput = !1, this.customError = !1, this.patternMismatch = !1, this.rangeOverflow = !1, this.rangeUnderflow = !1, this.stepMismatch = !1, this.tooLong = !1, this.tooShort = !1, this.typeMismatch = !1, this.valid = !0, this.valueMissing = !1, Object.seal(this);
     }
   }
-  const pt = (i) => (i.badInput = !1, i.customError = !1, i.patternMismatch = !1, i.rangeOverflow = !1, i.rangeUnderflow = !1, i.stepMismatch = !1, i.tooLong = !1, i.tooShort = !1, i.typeMismatch = !1, i.valid = !0, i.valueMissing = !1, i), mt = (i, t, e) => (i.valid = bt(t), Object.keys(t).forEach((r) => i[r] = t[r]), e && S(e), i), bt = (i) => {
+  const mt = (i) => (i.badInput = !1, i.customError = !1, i.patternMismatch = !1, i.rangeOverflow = !1, i.rangeUnderflow = !1, i.stepMismatch = !1, i.tooLong = !1, i.tooShort = !1, i.typeMismatch = !1, i.valid = !0, i.valueMissing = !1, i), pt = (i, t, e) => (i.valid = bt(t), Object.keys(t).forEach((r) => i[r] = t[r]), e && S(e), i), bt = (i) => {
     let t = !0;
     for (let e in i)
       e !== "valid" && i[e] !== !1 && (t = !1);
@@ -413,10 +413,10 @@ const zt = ["xsmall", "small-productive", "small-expressive", "medium", "large"]
       const l = n.get(this), s = {};
       for (const E in t)
         s[E] = t[E];
-      Object.keys(s).length === 0 && pt(l);
+      Object.keys(s).length === 0 && mt(l);
       const g = { ...l, ...s };
       delete g.valid;
-      const { valid: v } = mt(l, g, this.form);
+      const { valid: v } = pt(l, g, this.form);
       if (!v && !e)
         throw new DOMException("Failed to execute 'setValidity' on 'ElementInternals': The second argument should not be empty if one or more flags in the first argument are true.");
       b.set(this, v ? "" : e), o.isConnected ? (o.toggleAttribute("internals-invalid", !v), o.toggleAttribute("internals-valid", v), o.setAttribute("aria-invalid", `${!v}`)) : F.set(o, this);
@@ -508,7 +508,7 @@ const zt = ["xsmall", "small-productive", "small-expressive", "medium", "large"]
     T() && typeof document < "u" && new MutationObserver(P).observe(document.documentElement, _), typeof HTMLFormElement < "u" && gt(), typeof window < "u" && !window.CustomStateSet && (window.CustomStateSet = V);
   }
 })();
-var At = Object.defineProperty, St = Object.getOwnPropertyDescriptor, m = (d, n, a, c) => {
+var At = Object.defineProperty, St = Object.getOwnPropertyDescriptor, p = (d, n, a, c) => {
   for (var b = c > 1 ? void 0 : c ? St(n, a) : n, y = d.length - 1, u; y >= 0; y--)
     (u = d[y]) && (b = (c ? u(n, a, b) : u(b)) || b);
   return c && b && At(n, a, b), b;
@@ -565,7 +565,7 @@ class h extends xt {
    * @private
    */
   renderSpinner() {
-    const n = this.size.includes("small") ? "s" : "m", c = ["primary", "destructive", "outline-inverse", "ghost-inverse"].includes(this.variant) ? "inverse" : "secondary";
+    const n = this.size.includes("small") ? "small" : "medium", c = ["primary", "destructive", "outline-inverse", "ghost-inverse"].includes(this.variant) ? "inverse" : "secondary";
     return N`
                     <pie-spinner
                         size="${n}"
@@ -609,57 +609,57 @@ class h extends xt {
 }
 h.formAssociated = !0;
 h.styles = wt(Ft);
-m([
-  p(),
+p([
+  m(),
   R(L, zt, "medium")
 ], h.prototype, "size", 2);
-m([
-  p(),
+p([
+  m(),
   R(L, Mt, "submit")
 ], h.prototype, "type", 2);
-m([
-  p(),
+p([
+  m(),
   R(L, Ct, "primary")
 ], h.prototype, "variant", 2);
-m([
-  p({ type: String }),
+p([
+  m({ type: String }),
   R(L, Lt, "leading")
 ], h.prototype, "iconPlacement", 2);
-m([
-  p({ type: Boolean })
+p([
+  m({ type: Boolean })
 ], h.prototype, "disabled", 2);
-m([
-  p({ type: Boolean, reflect: !0 })
+p([
+  m({ type: Boolean, reflect: !0 })
 ], h.prototype, "isLoading", 2);
-m([
-  p({ type: Boolean })
+p([
+  m({ type: Boolean })
 ], h.prototype, "isFullWidth", 2);
-m([
-  p({ type: Boolean })
+p([
+  m({ type: Boolean })
 ], h.prototype, "isResponsive", 2);
-m([
-  p({ type: String })
+p([
+  m({ type: String })
 ], h.prototype, "name", 2);
-m([
-  p({ type: String })
+p([
+  m({ type: String })
 ], h.prototype, "value", 2);
-m([
-  p()
+p([
+  m()
 ], h.prototype, "formaction", 2);
-m([
-  p()
+p([
+  m()
 ], h.prototype, "formenctype", 2);
-m([
-  p()
+p([
+  m()
 ], h.prototype, "formmethod", 2);
-m([
-  p({ type: Boolean })
+p([
+  m({ type: Boolean })
 ], h.prototype, "formnovalidate", 2);
-m([
-  p()
+p([
+  m()
 ], h.prototype, "formtarget", 2);
-m([
-  p({ type: String })
+p([
+  m({ type: String })
 ], h.prototype, "responsiveSize", 2);
 kt(L, h);
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@justeattakeaway/pie-button",
-  "version": "0.39.1",
+  "version": "0.40.0",
   "description": "PIE design system button built using web components",
   "type": "module",
   "main": "dist/index.js",
@@ -37,7 +37,7 @@
     "dist/*.js"
   ],
   "dependencies": {
-    "@justeattakeaway/pie-spinner": "0.2.2",
+    "@justeattakeaway/pie-spinner": "0.3.0",
     "@justeattakeaway/pie-webc-core": "0.12.0",
     "element-internals-polyfill": "1.3.8"
   }

package/src/index.ts

@@ -210,7 +210,7 @@ export class PieButton extends LitElement implements ButtonProps {
      * @private
      */
     private renderSpinner (): TemplateResult {
-        const spinnerSize = this.size.includes('small') ? 's' : 'm'; // includes("small") matches for any small size value and xsmall
+        const spinnerSize = this.size.includes('small') ? 'small' : 'medium'; // includes("small") matches for any small size value and xsmall
         const inverseVariants: Array<ButtonProps['variant']> = ['primary', 'destructive', 'outline-inverse', 'ghost-inverse'];
         const spinnerVariant = inverseVariants.includes(this.variant) ? 'inverse' : 'secondary';