@justeattakeaway/pie-checkbox 0.13.6 → 0.13.8

package/dist/index.js

@@ -16,10 +16,10 @@ const P = '*,*:after,*:before{box-sizing:inherit}@keyframes checkboxCheck{0%{wid
   required: !1,
   status: "default"
 };
-var L = Object.defineProperty, o = (p, c, t, s) => {
+var L = Object.defineProperty, o = (p, e, t, s) => {
   for (var a = void 0, n = p.length - 1, l; n >= 0; n--)
-    (l = p[n]) && (a = l(c, t, a) || a);
-  return a && L(c, t, a), a;
+    (l = p[n]) && (a = l(e, t, a) || a);
+  return a && L(e, t, a), a;
 };
 const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
   constructor() {
@@ -27,12 +27,12 @@ const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
   }
   connectedCallback() {
     super.connectedCallback(), this._abortController = new AbortController();
-    const { signal: c } = this._abortController;
+    const { signal: e } = this._abortController;
     this.addEventListener("pie-checkbox-group-disabled", (t) => {
       this._disabledByParent = t.detail.disabled;
-    }, { signal: c }), this.addEventListener("pie-checkbox-group-error", (t) => {
+    }, { signal: e }), this.addEventListener("pie-checkbox-group-error", (t) => {
       this._visuallyHiddenError = t.detail.error;
-    }, { signal: c });
+    }, { signal: e });
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this._abortController.abort();
@@ -56,8 +56,8 @@ const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
    * or because the disabled state changed on a <fieldset> that's an ancestor of this element.
    * @param disabled - The latest disabled state of the input.
    */
-  formDisabledCallback(c) {
-    this.disabled = c;
+  formDisabledCallback(e) {
+    this.disabled = e;
   }
   updated() {
     this._handleFormAssociation();
@@ -66,10 +66,10 @@ const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
    * Captures the native change event and wraps it in a custom event.
    * @param {Event} event - This should be the change event that was listened for on an input element with `type="checkbox"`.
    */
-  _handleChange(c) {
-    const { checked: t } = c == null ? void 0 : c.currentTarget;
+  _handleChange(e) {
+    const { checked: t } = e == null ? void 0 : e.currentTarget;
     this.checked = t;
-    const s = T(c);
+    const s = T(e);
     this.dispatchEvent(s), this._handleFormAssociation();
   }
   /**
@@ -81,12 +81,12 @@ const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
     if (this.checked === this.defaultChecked)
       return;
     this.checked = this.defaultChecked;
-    const c = new Event("change", { bubbles: !0, composed: !0 });
-    this.dispatchEvent(c), this._handleFormAssociation();
+    const e = new Event("change", { bubbles: !0, composed: !0 });
+    this.dispatchEvent(e), this._handleFormAssociation();
   }
   render() {
     const {
-      checked: c,
+      checked: e,
       value: t,
       name: s,
       disabled: a,
@@ -101,14 +101,14 @@ const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
       "c-checkbox": !0,
       [`c-checkbox--status-${h}`]: !d,
       "c-checkbox--disabled": d,
-      "c-checkbox--checked": c,
-      "c-checkbox--indeterminate": k && !c
+      "c-checkbox--checked": e,
+      "c-checkbox--indeterminate": k && !e
     }, E = {
       "c-checkbox-tick": !0,
       [`c-checkbox-tick--status-${h}`]: !d,
       "c-checkbox-tick--disabled": d,
-      "c-checkbox-tick--checked": c,
-      "c-checkbox-tick--indeterminate": k && !c,
+      "c-checkbox-tick--checked": e,
+      "c-checkbox-tick--indeterminate": k && !e,
       "c-checkbox-tick--rtl": _
     };
     return u`
@@ -118,7 +118,7 @@ const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
                 type="checkbox"
                 id="inputId"
                 .value=${t}
-                .checked=${A(c)}
+                .checked=${A(e)}
                 name=${f(s)}
                 ?disabled=${d}
                 ?required=${C}
@@ -126,9 +126,9 @@ const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
                 aria-invalid=${h === "error" ? "true" : "false"}
                 aria-describedby=${f(x ? g : void 0)}
                 @change=${this._handleChange}
-                data-test-id="checkbox-input"
+                data-test-id="pie-checkbox-input"
             />
-            <label for="inputId" data-test-id="checkbox-component">
+            <label for="inputId" data-test-id="pie-checkbox-label">
                 <span
                     class="${m(E)}"></span>
                 <span class="c-checkbox-text">
@@ -147,47 +147,47 @@ const w = "pie-checkbox", g = "assistive-text", b = class b extends S(z(v)) {
   }
 };
 b.shadowRootOptions = { ...v.shadowRootOptions, delegatesFocus: !0 }, b.styles = F(P);
-let e = b;
+let c = b;
 o([
   y()
-], e.prototype, "_disabledByParent");
+], c.prototype, "_disabledByParent");
 o([
   y()
-], e.prototype, "_visuallyHiddenError");
+], c.prototype, "_visuallyHiddenError");
 o([
   r({ type: String })
-], e.prototype, "value");
+], c.prototype, "value");
 o([
   r({ type: String })
-], e.prototype, "name");
+], c.prototype, "name");
 o([
   r({ type: Boolean, reflect: !0 })
-], e.prototype, "checked");
+], c.prototype, "checked");
 o([
   r({ type: Boolean, reflect: !0 })
-], e.prototype, "defaultChecked");
+], c.prototype, "defaultChecked");
 o([
   r({ type: Boolean, reflect: !0 })
-], e.prototype, "disabled");
+], c.prototype, "disabled");
 o([
   r({ type: Boolean, reflect: !0 })
-], e.prototype, "required");
+], c.prototype, "required");
 o([
   r({ type: Boolean, reflect: !0 })
-], e.prototype, "indeterminate");
+], c.prototype, "indeterminate");
 o([
   q('input[type="checkbox"]')
-], e.prototype, "_checkbox");
+], c.prototype, "_checkbox");
 o([
   r({ type: String })
-], e.prototype, "assistiveText");
+], c.prototype, "assistiveText");
 o([
   r({ type: String }),
   D(w, R, i.status)
-], e.prototype, "status");
-H(w, e);
+], c.prototype, "status");
+H(w, c);
 export {
-  e as PieCheckbox,
+  c as PieCheckbox,
   i as defaultProps,
   R as statusTypes
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@justeattakeaway/pie-checkbox",
   "description": "PIE Design System Checkbox built using Web Components",
-  "version": "0.13.6",
+  "version": "0.13.8",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -37,11 +37,11 @@
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "0.9.0",
     "@justeattakeaway/pie-components-config": "0.18.0",
-    "@justeattakeaway/pie-css": "0.13.1",
+    "@justeattakeaway/pie-css": "0.14.1",
     "cem-plugin-module-file-extensions": "0.0.5"
   },
   "dependencies": {
-    "@justeattakeaway/pie-assistive-text": "0.8.0",
+    "@justeattakeaway/pie-assistive-text": "0.8.2",
     "@justeattakeaway/pie-webc-core": "0.24.2"
   },
   "volta": {

package/src/index.ts

@@ -200,9 +200,9 @@ export class PieCheckbox extends FormControlMixin(RtlMixin(LitElement)) implemen
                 aria-invalid=${status === 'error' ? 'true' : 'false'}
                 aria-describedby=${ifDefined(assistiveText ? assistiveTextId : undefined)}
                 @change=${this._handleChange}
-                data-test-id="checkbox-input"
+                data-test-id="pie-checkbox-input"
             />
-            <label for="inputId" data-test-id="checkbox-component">
+            <label for="inputId" data-test-id="pie-checkbox-label">
                 <span
                     class="${classMap(labelClasses)}"></span>
                 <span class="c-checkbox-text">