@justeattakeaway/pie-checkbox - npm Package Compare versions

Comparing version 0.0.0-snapshot-release-20240610140237 to 0.0.0-snapshot-release-20240610163725

custom-elements.json

@@ -203,3 +203,3 @@ {
               },
-              "description": "Called when the form that owns this component is reset.\nSets the checked state to the default value."
+              "description": "Called when the form that contains this component is reset.\nIf the current checked state is different to the default checked state,\nthe checked state is reset to the default checked state and a `change` event is emitted."
             }
@@ -206,0 +206,0 @@ ],

dist/index.d.ts

@@ -34,3 +34,3 @@ import { ComponentDefaultPropsGeneric } from '@justeattakeaway/pie-webc-core';
     /**
-     * The default checked state of the checkbox.
+     * The default checked state of the checkbox (not necessarily the same as the current checked state).
      */
@@ -105,4 +105,5 @@ defaultChecked?: boolean;
     /**
-     * Called when the form that owns this component is reset.
-     * Sets the checked state to the default value.
+     * Called when the form that contains this component is reset.
+     * If the current checked state is different to the default checked state,
+     * the checked state is reset to the default checked state and a `change` event is emitted.
      */
@@ -109,0 +110,0 @@ formResetCallback(): void;

dist/index.js

 import { LitElement as u, html as f, nothing as h, unsafeCSS as b } from "lit";
-import { FormControlMixin as y, RtlMixin as k, wrapNativeEvent as v, defineCustomElement as g } from "@justeattakeaway/pie-webc-core";
-import { live as C } from "lit/directives/live.js";
-import { property as a, query as x } from "lit/decorators.js";
+import { FormControlMixin as y, RtlMixin as k, wrapNativeEvent as v, defineCustomElement as C } from "@justeattakeaway/pie-webc-core";
+import { live as g } from "lit/directives/live.js";
+import { property as s, query as x } from "lit/decorators.js";
 import { ifDefined as $ } from "lit/directives/if-defined.js";
@@ -16,6 +16,6 @@ const F = `*,*:after,*:before{box-sizing:inherit}
 };
-var E = Object.defineProperty, q = Object.getOwnPropertyDescriptor, i = (p, e, r, n) => {
-  for (var o = n > 1 ? void 0 : n ? q(e, r) : e, c = p.length - 1, l; c >= 0; c--)
-    (l = p[c]) && (o = (n ? l(e, r, o) : l(o)) || o);
-  return n && o && E(e, r, o), o;
+var E = Object.defineProperty, q = Object.getOwnPropertyDescriptor, r = (p, e, n, a) => {
+  for (var o = a > 1 ? void 0 : a ? q(e, n) : e, c = p.length - 1, l; c >= 0; c--)
+    (l = p[c]) && (o = (a ? l(e, n, o) : l(o)) || o);
+  return a && o && E(e, n, o), o;
 };
@@ -60,18 +60,18 @@ const A = "pie-checkbox";
   handleChange(e) {
-    const { checked: r } = e == null ? void 0 : e.currentTarget;
-    this.checked = r;
-    const n = v(e);
-    this.dispatchEvent(n), this.handleFormAssociation();
+    const { checked: n } = e == null ? void 0 : e.currentTarget;
+    this.checked = n;
+    const a = v(e);
+    this.dispatchEvent(a), this.handleFormAssociation();
   }
   /**
-   * Called when the form that owns this component is reset.
-   * Sets the checked state to the default value.
+   * Called when the form that contains this component is reset.
+   * If the current checked state is different to the default checked state,
+   * the checked state is reset to the default checked state and a `change` event is emitted.
    */
   formResetCallback() {
-    const e = this.checked;
-    if (this.checked = this.defaultChecked, e !== this.checked) {
-      const r = new Event("change", { bubbles: !0, composed: !0 });
-      this.dispatchEvent(r);
-    }
-    this.handleFormAssociation();
+    if (this.checked === this.defaultChecked)
+      return;
+    this.checked = this.defaultChecked;
+    const e = new Event("change", { bubbles: !0, composed: !0 });
+    this.dispatchEvent(e), this.handleFormAssociation();
   }
@@ -81,4 +81,4 @@ render() {
       checked: e,
-      value: r,
-      name: n,
+      value: n,
+      name: a,
       label: o,
@@ -88,3 +88,3 @@ disabled: c,
       indeterminate: m,
-      aria: s
+      aria: i
     } = this;
@@ -95,11 +95,11 @@ return f`
                 type="checkbox"
-                .value=${r}
-                .checked=${C(e)}
-                name=${$(n)}
+                .value=${n}
+                .checked=${g(e)}
+                name=${$(a)}
                 ?disabled=${c}
                 ?required=${l}
                 .indeterminate=${!!m}
-                aria-label=${(s == null ? void 0 : s.label) || h}
-                aria-labelledby=${o ? h : (s == null ? void 0 : s.labelledby) || h}
-                aria-describedby= ${(s == null ? void 0 : s.describedby) || h}
+                aria-label=${(i == null ? void 0 : i.label) || h}
+                aria-labelledby=${o ? h : (i == null ? void 0 : i.labelledby) || h}
+                aria-describedby= ${(i == null ? void 0 : i.describedby) || h}
                 @change=${this.handleChange}
@@ -114,33 +114,33 @@ data-test-id="checkbox-input"
 t.styles = b(F);
-i([
-  a({ type: String })
+r([
+  s({ type: String })
 ], t.prototype, "value", 2);
-i([
-  a({ type: String })
+r([
+  s({ type: String })
 ], t.prototype, "label", 2);
-i([
-  a({ type: String })
+r([
+  s({ type: String })
 ], t.prototype, "name", 2);
-i([
-  a({ type: Boolean, reflect: !0 })
+r([
+  s({ type: Boolean, reflect: !0 })
 ], t.prototype, "checked", 2);
-i([
-  a({ type: Boolean, reflect: !0 })
+r([
+  s({ type: Boolean, reflect: !0 })
 ], t.prototype, "defaultChecked", 2);
-i([
-  a({ type: Boolean, reflect: !0 })
+r([
+  s({ type: Boolean, reflect: !0 })
 ], t.prototype, "disabled", 2);
-i([
-  a({ type: Boolean, reflect: !0 })
+r([
+  s({ type: Boolean, reflect: !0 })
 ], t.prototype, "required", 2);
-i([
-  a({ type: Boolean, reflect: !0 })
+r([
+  s({ type: Boolean, reflect: !0 })
 ], t.prototype, "indeterminate", 2);
-i([
-  a({ type: Object })
+r([
+  s({ type: Object })
 ], t.prototype, "aria", 2);
-i([
+r([
   x('input[type="checkbox"]')
 ], t.prototype, "checkbox", 2);
-g(A, t);
+C(A, t);
 export {
@@ -147,0 +147,0 @@ t as PieCheckbox,

dist/react.d.ts

@@ -35,3 +35,3 @@ import { ComponentDefaultPropsGeneric } from '@justeattakeaway/pie-webc-core';
     /**
-     * The default checked state of the checkbox.
+     * The default checked state of the checkbox (not necessarily the same as the current checked state).
      */
@@ -108,4 +108,5 @@ defaultChecked?: boolean;
     /**
-     * Called when the form that owns this component is reset.
-     * Sets the checked state to the default value.
+     * Called when the form that contains this component is reset.
+     * If the current checked state is different to the default checked state,
+     * the checked state is reset to the default checked state and a `change` event is emitted.
      */
@@ -112,0 +113,0 @@ formResetCallback(): void;

package.json

 {
   "name": "@justeattakeaway/pie-checkbox",
   "description": "PIE Design System Checkbox built using Web Components",
-  "version": "0.0.0-snapshot-release-20240610140237",
+  "version": "0.0.0-snapshot-release-20240610163725",
   "type": "module",
@@ -6,0 +6,0 @@ "main": "dist/index.js",

src/defs.ts

@@ -30,3 +30,3 @@ import { type ComponentDefaultPropsGeneric } from '@justeattakeaway/pie-webc-core';
     /**
-     * The default checked state of the checkbox.
+     * The default checked state of the checkbox (not necessarily the same as the current checked state).
      */
@@ -33,0 +33,0 @@ defaultChecked?: boolean;

src/index.ts

@@ -115,14 +115,15 @@ import {
     /**
-     * Called when the form that owns this component is reset.
-     * Sets the checked state to the default value.
+     * Called when the form that contains this component is reset.
+     * If the current checked state is different to the default checked state,
+     * the checked state is reset to the default checked state and a `change` event is emitted.
      */
     public formResetCallback () : void {
-        const oldValue = this.checked;
+        if (this.checked === this.defaultChecked) {
+            return;
+        }
+
         this.checked = this.defaultChecked;
 
-        // If the value has changed as part of the reset, emit a change event
-        if (oldValue !== this.checked) {
-            const changeEvent = new Event('change', { bubbles: true, composed: true });
-            this.dispatchEvent(changeEvent);
-        }
+        const changeEvent = new Event('change', { bubbles: true, composed: true });
+        this.dispatchEvent(changeEvent);
 
@@ -129,0 +130,0 @@ this.handleFormAssociation();

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

39141

increased by1.81%

Lines of code

924

increased by0.22%

No dependency changes