@justeattakeaway/pie-text-input 0.27.0 → 0.27.1

package/dist/index.d.ts

@@ -49,7 +49,7 @@ export declare class PieTextInput extends PieTextInput_base implements TextInput
     readonly: boolean;
     defaultValue: TextInputProps['defaultValue'];
     assistiveText: TextInputProps['assistiveText'];
-    status: "default" | "error" | "success";
+    status: "default" | "success" | "error";
     step: TextInputProps['step'];
     min: TextInputProps['min'];
     max: TextInputProps['max'];

package/dist/index.js

@@ -1,18 +1,18 @@
-import { LitElement as ft, html as pt, nothing as Nt, unsafeCSS as Lt } from "lit";
-import { property as u, query as ht } from "lit/decorators.js";
-import { ifDefined as h } from "lit/directives/if-defined.js";
+import { LitElement as ht, nothing as Nt, html as pt, unsafeCSS as Lt } from "lit";
+import { property as u, query as ft } from "lit/decorators.js";
+import { ifDefined as f } from "lit/directives/if-defined.js";
 import { classMap as $t } from "lit/directives/class-map.js";
 import { live as mt } from "lit/directives/live.js";
 import { FormControlMixin as Ot, RtlMixin as Rt, wrapNativeEvent as Pt, validPropertyValues as Z, defineCustomElement as _t } from "@justeattakeaway/pie-webc-core";
 import "@justeattakeaway/pie-assistive-text";
-var Ht = Object.defineProperty, Dt = (y, l, f, x) => {
-  for (var s = void 0, g = y.length - 1, E; g >= 0; g--)
-    (E = y[g]) && (s = E(l, f, s) || s);
-  return s && Ht(l, f, s), s;
+var Ht = Object.defineProperty, Dt = (v, l, h, x) => {
+  for (var s = void 0, g = v.length - 1, E; g >= 0; g--)
+    (E = v[g]) && (s = E(l, h, s) || s);
+  return s && Ht(l, h, s), s;
 };
-class gt extends ft {
+class gt extends ht {
   constructor() {
-    super(...arguments), this.v = "0.27.0";
+    super(...arguments), this.v = "0.27.1";
   }
 }
 Dt([
@@ -27,8 +27,8 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
   readonly: !1
 };
 (function() {
-  (function(y) {
-    const l = /* @__PURE__ */ new WeakMap(), f = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), s = /* @__PURE__ */ new WeakMap(), g = /* @__PURE__ */ new WeakMap(), E = /* @__PURE__ */ new WeakMap(), T = /* @__PURE__ */ new WeakMap(), v = /* @__PURE__ */ new WeakMap(), V = /* @__PURE__ */ new WeakMap(), S = /* @__PURE__ */ new WeakMap(), N = /* @__PURE__ */ new WeakMap(), L = /* @__PURE__ */ new WeakMap(), $ = /* @__PURE__ */ new WeakMap(), F = /* @__PURE__ */ new WeakMap(), I = /* @__PURE__ */ new WeakMap(), C = {
+  (function(v) {
+    const l = /* @__PURE__ */ new WeakMap(), h = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), s = /* @__PURE__ */ new WeakMap(), g = /* @__PURE__ */ new WeakMap(), E = /* @__PURE__ */ new WeakMap(), F = /* @__PURE__ */ new WeakMap(), y = /* @__PURE__ */ new WeakMap(), V = /* @__PURE__ */ new WeakMap(), S = /* @__PURE__ */ new WeakMap(), N = /* @__PURE__ */ new WeakMap(), L = /* @__PURE__ */ new WeakMap(), $ = /* @__PURE__ */ new WeakMap(), T = /* @__PURE__ */ new WeakMap(), I = /* @__PURE__ */ new WeakMap(), C = {
       ariaAtomic: "aria-atomic",
       ariaAutoComplete: "aria-autocomplete",
       ariaBusy: "aria-busy",
@@ -74,21 +74,21 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
     }, B = (e, t) => {
       for (let a in C) {
         t[a] = null;
-        let n = null;
-        const i = C[a];
+        let i = null;
+        const n = C[a];
         Object.defineProperty(t, a, {
           get() {
-            return n;
+            return i;
           },
           set(o) {
-            n = o, e.isConnected ? e.setAttribute(i, o) : S.set(e, t);
+            i = o, e.isConnected ? e.setAttribute(n, o) : S.set(e, t);
           }
         });
       }
     };
     function O(e) {
       const t = s.get(e), { form: a } = t;
-      nt(e, a, t), at(e, t.labels);
+      it(e, a, t), at(e, t.labels);
     }
     const R = (e, t = !1) => {
       const a = document.createTreeWalker(e, NodeFilter.SHOW_ELEMENT, {
@@ -96,23 +96,23 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
           return s.has(o) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
         }
       });
-      let n = a.nextNode();
-      const i = !t || e.disabled;
-      for (; n; )
-        n.formDisabledCallback && i && K(n, e.disabled), n = a.nextNode();
+      let i = a.nextNode();
+      const n = !t || e.disabled;
+      for (; i; )
+        i.formDisabledCallback && n && K(i, e.disabled), i = a.nextNode();
     }, P = { attributes: !0, attributeFilter: ["disabled", "name"] }, _ = z() ? new MutationObserver((e) => {
       for (const t of e) {
         const a = t.target;
         if (t.attributeName === "disabled" && (a.constructor.formAssociated ? K(a, a.hasAttribute("disabled")) : a.localName === "fieldset" && R(a)), t.attributeName === "name" && a.constructor.formAssociated) {
-          const n = s.get(a), i = V.get(a);
-          n.setFormValue(i);
+          const i = s.get(a), n = V.get(a);
+          i.setFormValue(n);
         }
       }
     }) : {};
     function U(e) {
       e.forEach((t) => {
-        const { addedNodes: a, removedNodes: n } = t, i = Array.from(a), o = Array.from(n);
-        i.forEach((r) => {
+        const { addedNodes: a, removedNodes: i } = t, n = Array.from(a), o = Array.from(i);
+        n.forEach((r) => {
           var m;
           if (s.has(r) && r.constructor.formAssociated && O(r), S.has(r)) {
             const p = S.get(r);
@@ -125,7 +125,7 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
             r.setAttribute("internals-valid", p.validity.valid.toString()), r.setAttribute("internals-invalid", (!p.validity.valid).toString()), r.setAttribute("aria-invalid", (!p.validity.valid).toString()), I.delete(r);
           }
           if (r.localName === "form") {
-            const p = v.get(r), k = document.createTreeWalker(r, NodeFilter.SHOW_ELEMENT, {
+            const p = y.get(r), k = document.createTreeWalker(r, NodeFilter.SHOW_ELEMENT, {
               acceptNode(X) {
                 return s.has(X) && X.constructor.formAssociated && !(p && p.has(X)) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
               }
@@ -137,23 +137,23 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
           r.localName === "fieldset" && ((m = _.observe) === null || m === void 0 || m.call(_, r, P), R(r, !0));
         }), o.forEach((r) => {
           const m = s.get(r);
-          m && x.get(m) && tt(m), T.has(r) && T.get(r).disconnect();
+          m && x.get(m) && tt(m), F.has(r) && F.get(r).disconnect();
         });
       });
     }
-    function yt(e) {
+    function vt(e) {
       e.forEach((t) => {
         const { removedNodes: a } = t;
-        a.forEach((n) => {
-          const i = $.get(t.target);
-          s.has(n) && ot(n), i.disconnect();
+        a.forEach((i) => {
+          const n = $.get(t.target);
+          s.has(i) && ot(i), n.disconnect();
         });
       });
     }
-    const vt = (e) => {
+    const yt = (e) => {
       var t, a;
-      const n = new MutationObserver(yt);
-      !((t = window == null ? void 0 : window.ShadyDOM) === null || t === void 0) && t.inUse && e.mode && e.host && (e = e.host), (a = n.observe) === null || a === void 0 || a.call(n, e, { childList: !0 }), $.set(e, n);
+      const i = new MutationObserver(vt);
+      !((t = window == null ? void 0 : window.ShadyDOM) === null || t === void 0) && t.inUse && e.mode && e.host && (e = e.host), (a = i.observe) === null || a === void 0 || a.call(i, e, { childList: !0 }), $.set(e, i);
     };
     z() && new MutationObserver(U);
     const j = {
@@ -173,13 +173,13 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
       x.set(t, []), (a = _.observe) === null || a === void 0 || a.call(_, e, P);
     }, at = (e, t) => {
       if (t.length) {
-        Array.from(t).forEach((n) => n.addEventListener("click", e.click.bind(e)));
+        Array.from(t).forEach((i) => i.addEventListener("click", e.click.bind(e)));
         let a = t[0].id;
         t[0].id || (a = `${t[0].htmlFor}_Label`, t[0].id = a), e.setAttribute("aria-labelledby", a);
       }
     }, H = (e) => {
-      const t = Array.from(e.elements).filter((o) => !o.tagName.includes("-") && o.validity).map((o) => o.validity.valid), a = v.get(e) || [], n = Array.from(a).filter((o) => o.isConnected).map((o) => s.get(o).validity.valid), i = [...t, ...n].includes(!1);
-      e.toggleAttribute("internals-invalid", i), e.toggleAttribute("internals-valid", !i);
+      const t = Array.from(e.elements).filter((o) => !o.tagName.includes("-") && o.validity).map((o) => o.validity.valid), a = y.get(e) || [], i = Array.from(a).filter((o) => o.isConnected).map((o) => s.get(o).validity.valid), n = [...t, ...i].includes(!1);
+      e.toggleAttribute("internals-invalid", n), e.toggleAttribute("internals-valid", !n);
     }, wt = (e) => {
       H(D(e.target));
     }, xt = (e) => {
@@ -188,25 +188,25 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
       const t = ["button[type=submit]", "input[type=submit]", "button:not([type])"].map((a) => `${a}:not([disabled])`).map((a) => `${a}:not([form])${e.id ? `,${a}[form='${e.id}']` : ""}`).join(",");
       e.addEventListener("click", (a) => {
         if (a.target.closest(t)) {
-          const i = v.get(e);
+          const n = y.get(e);
           if (e.noValidate)
             return;
-          i.size && Array.from(i).reverse().map((m) => s.get(m).reportValidity()).includes(!1) && a.preventDefault();
+          n.size && Array.from(n).reverse().map((m) => s.get(m).reportValidity()).includes(!1) && a.preventDefault();
         }
       });
     }, It = (e) => {
-      const t = v.get(e.target);
+      const t = y.get(e.target);
       t && t.size && t.forEach((a) => {
         a.constructor.formAssociated && a.formResetCallback && a.formResetCallback.apply(a);
       });
-    }, nt = (e, t, a) => {
+    }, it = (e, t, a) => {
       if (t) {
-        const n = v.get(t);
-        if (n)
-          n.add(e);
+        const i = y.get(t);
+        if (i)
+          i.add(e);
         else {
-          const i = /* @__PURE__ */ new Set();
-          i.add(e), v.set(t, i), Et(t), t.addEventListener("reset", It), t.addEventListener("input", wt), t.addEventListener("change", xt);
+          const n = /* @__PURE__ */ new Set();
+          n.add(e), y.set(t, n), Et(t), t.addEventListener("reset", It), t.addEventListener("input", wt), t.addEventListener("change", xt);
         }
         E.set(t, { ref: e, internals: a }), e.constructor.formAssociated && e.formAssociatedCallback && setTimeout(() => {
           e.formAssociatedCallback.apply(e, [t]);
@@ -218,15 +218,15 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
     }, M = (e, t, a = DOMException) => {
       if (!e.constructor.formAssociated)
         throw new a(t);
-    }, it = (e, t, a) => {
-      const n = v.get(e);
-      return n && n.size && n.forEach((i) => {
-        s.get(i)[a]() || (t = !1);
+    }, nt = (e, t, a) => {
+      const i = y.get(e);
+      return i && i.size && i.forEach((n) => {
+        s.get(n)[a]() || (t = !1);
       }), t;
     }, ot = (e) => {
       if (e.constructor.formAssociated) {
-        const t = s.get(e), { labels: a, form: n } = t;
-        at(e, a), nt(e, n, t);
+        const t = s.get(e), { labels: a, form: i } = t;
+        at(e, a), it(e, i, t);
       }
     };
     function z() {
@@ -237,7 +237,7 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
         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 kt = (e) => (e.badInput = !1, e.customError = !1, e.patternMismatch = !1, e.rangeOverflow = !1, e.rangeUnderflow = !1, e.stepMismatch = !1, e.tooLong = !1, e.tooShort = !1, e.typeMismatch = !1, e.valid = !0, e.valueMissing = !1, e), St = (e, t, a) => (e.valid = Ct(t), Object.keys(t).forEach((n) => e[n] = t[n]), a && H(a), e), Ct = (e) => {
+    const kt = (e) => (e.badInput = !1, e.customError = !1, e.patternMismatch = !1, e.rangeOverflow = !1, e.rangeUnderflow = !1, e.stepMismatch = !1, e.tooLong = !1, e.tooShort = !1, e.typeMismatch = !1, e.valid = !0, e.valueMissing = !1, e), St = (e, t, a) => (e.valid = Ct(t), Object.keys(t).forEach((i) => e[i] = t[i]), a && H(a), e), Ct = (e) => {
       let t = !0;
       for (let a in e)
         a !== "valid" && e[a] !== !1 && (t = !1);
@@ -258,9 +258,9 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
       add(t) {
         if (!/^--/.test(t) || typeof t != "string")
           throw new DOMException(`Failed to execute 'add' on 'CustomStateSet': The specified value ${t} must start with '--'.`);
-        const a = super.add(t), n = G.get(this), i = `state${t}`;
-        return n.isConnected ? rt(n, i) : setTimeout(() => {
-          rt(n, i);
+        const a = super.add(t), i = G.get(this), n = `state${t}`;
+        return i.isConnected ? rt(i, n) : setTimeout(() => {
+          rt(i, n);
         }), a;
       }
       clear() {
@@ -269,28 +269,27 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
         super.clear();
       }
       delete(t) {
-        const a = super.delete(t), n = G.get(this);
-        return n.isConnected ? (n.toggleAttribute(`state${t}`, !1), n.part && n.part.remove(`state${t}`)) : setTimeout(() => {
-          n.toggleAttribute(`state${t}`, !1), n.part && n.part.remove(`state${t}`);
+        const a = super.delete(t), i = G.get(this);
+        return i.isConnected ? (i.toggleAttribute(`state${t}`, !1), i.part && i.part.remove(`state${t}`)) : setTimeout(() => {
+          i.toggleAttribute(`state${t}`, !1), i.part && i.part.remove(`state${t}`);
         }), a;
       }
     }
-    function st(e, t, a, n) {
-      if (a === "a" && !n) throw new TypeError("Private accessor was defined without a getter");
-      if (typeof t == "function" ? e !== t || !n : !t.has(e)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-      return a === "m" ? n : a === "a" ? n.call(e) : n ? n.value : t.get(e);
+    function st(e, t, a, i) {
+      if (typeof t == "function" ? e !== t || !0 : !t.has(e)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+      return a === "m" ? i : a === "a" ? i.call(e) : i ? i.value : t.get(e);
     }
-    function Tt(e, t, a, n, i) {
+    function Ft(e, t, a, i, n) {
       if (typeof t == "function" ? e !== t || !0 : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
       return t.set(e, a), a;
     }
     var A;
-    class Ft {
+    class Tt {
       constructor(t) {
-        A.set(this, void 0), Tt(this, A, t);
+        A.set(this, void 0), Ft(this, A, t);
         for (let a = 0; a < t.length; a++) {
-          let n = t[a];
-          this[a] = n, n.hasAttribute("name") && (this[n.getAttribute("name")] = n);
+          let i = t[a];
+          this[a] = i, i.hasAttribute("name") && (this[i.getAttribute("name")] = i);
         }
         Object.freeze(this);
       }
@@ -311,23 +310,23 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
       const e = HTMLFormElement.prototype.checkValidity;
       HTMLFormElement.prototype.checkValidity = a;
       const t = HTMLFormElement.prototype.reportValidity;
-      HTMLFormElement.prototype.reportValidity = n;
+      HTMLFormElement.prototype.reportValidity = i;
       function a(...o) {
         let r = e.apply(this, o);
-        return it(this, r, "checkValidity");
+        return nt(this, r, "checkValidity");
       }
-      function n(...o) {
+      function i(...o) {
         let r = t.apply(this, o);
-        return it(this, r, "reportValidity");
+        return nt(this, r, "reportValidity");
       }
-      const { get: i } = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, "elements");
+      const { get: n } = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, "elements");
       Object.defineProperty(HTMLFormElement.prototype, "elements", {
         get(...o) {
-          const r = i.call(this, ...o), m = Array.from(v.get(this) || []);
+          const r = n.call(this, ...o), m = Array.from(y.get(this) || []);
           if (m.length === 0)
             return r;
           const p = Array.from(r).concat(m).sort((k, b) => k.compareDocumentPosition ? k.compareDocumentPosition(b) & 2 ? 1 : -1 : 0);
-          return new Ft(p);
+          return new Tt(p);
         }
       });
     }
@@ -338,21 +337,21 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
       constructor(t) {
         if (!t || !t.tagName || t.tagName.indexOf("-") === -1)
           throw new TypeError("Illegal constructor");
-        const a = t.getRootNode(), n = new Mt();
-        this.states = new J(t), l.set(this, t), f.set(this, n), s.set(t, this), B(t, this), bt(t, this), Object.seal(this), a instanceof DocumentFragment && vt(a);
+        const a = t.getRootNode(), i = new Mt();
+        this.states = new J(t), l.set(this, t), h.set(this, i), s.set(t, this), B(t, this), bt(t, this), Object.seal(this), a instanceof DocumentFragment && yt(a);
       }
       checkValidity() {
         const t = l.get(this);
         if (M(t, "Failed to execute 'checkValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate)
           return !0;
-        const a = f.get(this);
+        const a = h.get(this);
         if (!a.valid) {
-          const n = new Event("invalid", {
+          const i = new Event("invalid", {
             bubbles: !1,
             cancelable: !0,
             composed: !1
           });
-          t.dispatchEvent(n);
+          t.dispatchEvent(i);
         }
         return a.valid;
       }
@@ -365,39 +364,39 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
       get labels() {
         const t = l.get(this);
         M(t, "Failed to read the 'labels' property from 'ElementInternals': The target element is not a form-associated custom element.");
-        const a = t.getAttribute("id"), n = t.getRootNode();
-        return n && a ? n.querySelectorAll(`[for="${a}"]`) : [];
+        const a = t.getAttribute("id"), i = t.getRootNode();
+        return i && a ? i.querySelectorAll(`[for="${a}"]`) : [];
       }
       reportValidity() {
         const t = l.get(this);
         if (M(t, "Failed to execute 'reportValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !this.willValidate)
           return !0;
-        const a = this.checkValidity(), n = L.get(this);
-        if (n && !t.constructor.formAssociated)
+        const a = this.checkValidity(), i = L.get(this);
+        if (i && !t.constructor.formAssociated)
           throw new DOMException("Failed to execute 'reportValidity' on 'ElementInternals': The target element is not a form-associated custom element.");
-        return !a && n && (t.focus(), n.focus()), a;
+        return !a && i && (t.focus(), i.focus()), a;
       }
       setFormValue(t) {
         const a = l.get(this);
         if (M(a, "Failed to execute 'setFormValue' on 'ElementInternals': The target element is not a form-associated custom element."), tt(this), t != null && !(t instanceof FormData)) {
           if (a.getAttribute("name")) {
-            const n = et(a, this);
-            n.value = t;
+            const i = et(a, this);
+            i.value = t;
           }
-        } else t != null && t instanceof FormData && Array.from(t).reverse().forEach(([n, i]) => {
-          if (typeof i == "string") {
+        } else t != null && t instanceof FormData && Array.from(t).reverse().forEach(([i, n]) => {
+          if (typeof n == "string") {
             const o = et(a, this);
-            o.name = n, o.value = i;
+            o.name = i, o.value = n;
           }
         });
         V.set(a, t);
       }
-      setValidity(t, a, n) {
-        const i = l.get(this);
-        if (M(i, "Failed to execute 'setValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !t)
+      setValidity(t, a, i) {
+        const n = l.get(this);
+        if (M(n, "Failed to execute 'setValidity' on 'ElementInternals': The target element is not a form-associated custom element."), !t)
           throw new TypeError("Failed to execute 'setValidity' on 'ElementInternals': 1 argument required, but only 0 present.");
-        L.set(this, n);
-        const o = f.get(this), r = {};
+        L.set(this, i);
+        const o = h.get(this), r = {};
         for (const k in t)
           r[k] = t[k];
         Object.keys(r).length === 0 && kt(o);
@@ -406,7 +405,7 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
         const { valid: p } = St(o, m, this.form);
         if (!p && !a)
           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.");
-        g.set(this, p ? "" : a), i.isConnected ? (i.toggleAttribute("internals-invalid", !p), i.toggleAttribute("internals-valid", p), i.setAttribute("aria-invalid", `${!p}`)) : I.set(i, this);
+        g.set(this, p ? "" : a), n.isConnected ? (n.toggleAttribute("internals-invalid", !p), n.toggleAttribute("internals-valid", p), n.setAttribute("aria-invalid", `${!p}`)) : I.set(n, this);
       }
       get shadowRoot() {
         const t = l.get(this), a = N.get(t);
@@ -418,7 +417,7 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
       }
       get validity() {
         const t = l.get(this);
-        return M(t, "Failed to read the 'validity' property from 'ElementInternals': The target element is not a form-associated custom element."), f.get(this);
+        return M(t, "Failed to read the 'validity' property from 'ElementInternals': The target element is not a form-associated custom element."), h.get(this);
       }
       get willValidate() {
         const t = l.get(this);
@@ -447,7 +446,7 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
         "setValidity",
         "checkValidity",
         "reportValidity"
-      ].every((n) => n in a.internals);
+      ].every((i) => i in a.internals);
     }
     let ct = !1, dt = !1;
     function Q(e) {
@@ -460,14 +459,14 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
       if (!ct) {
         if (ct = !0, typeof window < "u" && (window.ElementInternals = lt), typeof CustomElementRegistry < "u") {
           const t = CustomElementRegistry.prototype.define;
-          CustomElementRegistry.prototype.define = function(a, n, i) {
-            if (n.formAssociated) {
-              const o = n.prototype.connectedCallback;
-              n.prototype.connectedCallback = function() {
-                F.has(this) || (F.set(this, !0), this.hasAttribute("disabled") && K(this, !0)), o != null && o.apply(this), ot(this);
+          CustomElementRegistry.prototype.define = function(a, i, n) {
+            if (i.formAssociated) {
+              const o = i.prototype.connectedCallback;
+              i.prototype.connectedCallback = function() {
+                T.has(this) || (T.set(this, !0), this.hasAttribute("disabled") && K(this, !0)), o != null && o.apply(this), ot(this);
               };
             }
-            t.call(this, a, n, i);
+            t.call(this, a, i, n);
           };
         }
         if (typeof HTMLElement < "u" && (HTMLElement.prototype.attachInternals = function() {
@@ -479,13 +478,13 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
             throw new DOMException("DOMException: Failed to execute 'attachInternals' on 'HTMLElement': ElementInternals for the specified element was already attached.");
           return new lt(this);
         }), typeof Element < "u") {
-          let t = function(...n) {
-            const i = a.apply(this, n);
-            if (N.set(this, i), z()) {
+          let t = function(...i) {
+            const n = a.apply(this, i);
+            if (N.set(this, n), z()) {
               const o = new MutationObserver(U);
-              window.ShadyDOM ? o.observe(this, j) : o.observe(i, j), T.set(this, o);
+              window.ShadyDOM ? o.observe(this, j) : o.observe(n, j), F.set(this, o);
             }
-            return i;
+            return n;
           };
           const a = Element.prototype.attachShadow;
           Element.prototype.attachShadow = t;
@@ -493,21 +492,21 @@ const zt = "*,*:after,*:before{box-sizing:inherit}.c-textInput{--input-padding-b
         z() && typeof document < "u" && new MutationObserver(U).observe(document.documentElement, j), typeof HTMLFormElement < "u" && At(), (e || typeof window < "u" && !window.CustomStateSet) && Q();
       }
     }
-    return !!customElements.polyfillWrapFlushCallback || (Vt() ? typeof window < "u" && !window.CustomStateSet && Q(HTMLElement.prototype.attachInternals) : ut(!1)), y.forceCustomStateSetPolyfill = Q, y.forceElementInternalsPolyfill = ut, Object.defineProperty(y, "__esModule", { value: !0 }), y;
+    return !!customElements.polyfillWrapFlushCallback || (Vt() ? typeof window < "u" && !window.CustomStateSet && Q(HTMLElement.prototype.attachInternals) : ut(!1)), v.forceCustomStateSetPolyfill = Q, v.forceElementInternalsPolyfill = ut, Object.defineProperty(v, "__esModule", { value: !0 }), v;
   })({});
 })();
-var Ut = Object.defineProperty, d = (y, l, f, x) => {
-  for (var s = void 0, g = y.length - 1, E; g >= 0; g--)
-    (E = y[g]) && (s = E(l, f, s) || s);
-  return s && Ut(l, f, s), s;
+var Ut = Object.defineProperty, d = (v, l, h, x) => {
+  for (var s = void 0, g = v.length - 1, E; g >= 0; g--)
+    (E = v[g]) && (s = E(l, h, s) || s);
+  return s && Ut(l, h, s), s;
 };
 const q = "pie-text-input", Y = "assistive-text", W = class W extends Ot(Rt(gt)) {
   constructor() {
     super(...arguments), this.type = w.type, this.value = w.value, this.disabled = w.disabled, this.readonly = w.readonly, this.status = w.status, this.size = w.size, this.required = !1, this.handleInput = (l) => {
       this.value = l.target.value, this._internals.setFormValue(this.value);
     }, this.handleChange = (l) => {
-      const f = Pt(l);
-      this.dispatchEvent(f);
+      const h = Pt(l);
+      this.dispatchEvent(h);
     };
   }
   /**
@@ -542,19 +541,19 @@ const q = "pie-text-input", Y = "assistive-text", W = class W extends Ot(Rt(gt))
   render() {
     const {
       assistiveText: l,
-      autocomplete: f,
+      autocomplete: h,
       autoFocus: x,
       disabled: s,
       inputmode: g,
       maxlength: E,
-      minlength: T,
-      min: v,
+      minlength: F,
+      min: y,
       max: V,
       name: S,
       pattern: N,
       step: L,
       placeholder: $,
-      readonly: F,
+      readonly: T,
       status: I,
       type: C,
       value: B,
@@ -565,7 +564,7 @@ const q = "pie-text-input", Y = "assistive-text", W = class W extends Ot(Rt(gt))
       [`c-textInput--${O}`]: !0,
       [`c-textInput--${I}`]: !0,
       "is-disabled": s,
-      "c-textInput--readonly": F
+      "c-textInput--readonly": T
     };
     return pt`
             <div
@@ -578,25 +577,25 @@ const q = "pie-text-input", Y = "assistive-text", W = class W extends Ot(Rt(gt))
                 <slot name="leadingIcon"></slot>
                 <slot name="leadingText"></slot>
                 <input
-                    type=${h(C)}
+                    type=${f(C)}
                     .value=${mt(B)}
-                    name=${h(S)}
+                    name=${f(S)}
                     ?disabled=${mt(s)}
-                    pattern=${h(N)}
-                    step=${h(L)}
-                    minlength=${h(T)}
-                    maxlength=${h(E)}
-                    min=${h(v)}
-                    max=${h(V)}
-                    autocomplete=${h(f)}
+                    pattern=${f(N)}
+                    step=${f(L)}
+                    minlength=${f(F)}
+                    maxlength=${f(E)}
+                    min=${f(y)}
+                    max=${f(V)}
+                    autocomplete=${f(h)}
                     ?autofocus=${x}
-                    inputmode=${h(g)}
-                    placeholder=${h($)}
-                    ?readonly=${F}
+                    inputmode=${f(g)}
+                    placeholder=${f($)}
+                    ?readonly=${T}
                     ?required=${R}
-                    aria-describedby=${h(l ? Y : void 0)}
+                    aria-describedby=${f(l ? Y : void 0)}
                     aria-invalid=${I === "error" ? "true" : "false"}
-                    aria-errormessage="${h(I === "error" ? Y : void 0)}"
+                    aria-errormessage="${f(I === "error" ? Y : void 0)}"
                     @input=${this.handleInput}
                     @change=${this.handleChange}
                     data-test-id="pie-text-input">
@@ -610,14 +609,14 @@ const q = "pie-text-input", Y = "assistive-text", W = class W extends Ot(Rt(gt))
             ${l ? pt`
                 <pie-assistive-text
                     id="${Y}"
-                    variant=${h(I)}
+                    variant=${f(I)}
                     data-test-id="pie-text-input-assistive-text">
                     ${l}
                 </pie-assistive-text>
             ` : Nt}`;
   }
 };
-W.shadowRootOptions = { ...ft.shadowRootOptions, delegatesFocus: !0 }, W.styles = Lt(zt);
+W.shadowRootOptions = { ...ht.shadowRootOptions, delegatesFocus: !0 }, W.styles = Lt(zt);
 let c = W;
 d([
   u({ type: String, reflect: !0 }),
@@ -683,10 +682,10 @@ d([
   u({ type: Boolean })
 ], c.prototype, "required");
 d([
-  ht("input")
+  ft("input")
 ], c.prototype, "input");
 d([
-  ht("input")
+  ft("input")
 ], c.prototype, "focusTarget");
 _t(q, c);
 export {

package/dist/react.d.ts

@@ -52,7 +52,7 @@ declare class PieTextInput_2 extends PieTextInput_base implements TextInputProps
     readonly: boolean;
     defaultValue: TextInputProps['defaultValue'];
     assistiveText: TextInputProps['assistiveText'];
-    status: "default" | "error" | "success";
+    status: "default" | "success" | "error";
     step: TextInputProps['step'];
     min: TextInputProps['min'];
     max: TextInputProps['max'];

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@justeattakeaway/pie-text-input",
   "description": "PIE Design System Input built using Web Components",
-  "version": "0.27.0",
+  "version": "0.27.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/justeattakeaway/pie",
@@ -39,16 +39,16 @@
   "license": "Apache-2.0",
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "0.9.0",
-    "@justeattakeaway/pie-components-config": "0.19.0",
+    "@justeattakeaway/pie-components-config": "0.19.1",
     "@justeattakeaway/pie-css": "0.16.0",
-    "@justeattakeaway/pie-icons-webc": "1.6.1",
+    "@justeattakeaway/pie-icons-webc": "1.6.2",
     "@justeattakeaway/pie-monorepo-utils": "0.5.0",
     "@justeattakeaway/pie-wrapper-react": "0.14.3",
     "cem-plugin-module-file-extensions": "0.0.5"
   },
   "dependencies": {
-    "@justeattakeaway/pie-assistive-text": "0.9.0",
-    "@justeattakeaway/pie-webc-core": "0.25.0",
+    "@justeattakeaway/pie-assistive-text": "0.9.1",
+    "@justeattakeaway/pie-webc-core": "0.25.1",
     "element-internals-polyfill": "1.3.11"
   },
   "volta": {

package/declaration.d.ts

@@ -1,9 +0,0 @@
-declare module '*.scss' {
-    const content: Record<string, string>;
-    export default content;
-}
-
-declare module '*.scss?inline' {
-    const content: Record<string, string>;
-    export default content;
-}