@fusion.dev/helix-core 0.180.0 → 0.181.0

package/custom-elements.json

@@ -2539,7 +2539,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Passes a click on the host itself to the control inside that answers clicks.\n\n**A click dispatched on the host reaches nothing that toggles.** A switch,\na checkbox or a radio renders its control in its shadow root, and only a\nclick that lands there moves it. `element.click()`, a test's or an\nautomation's, is dispatched on the host, and so is the click a `<label for>`\non the page sends the element it names: `helix-switch` left `checked` false\nunder `click()` while a pointer press on it turned it on. A native checkbox\ntoggles on both, and code written against one expects it.\n\n**Only a click that starts at the host**, whose path begins there. A press\ninside the shadow root reaches the host too, retargeted, and has already\ndone its work where it landed; the click this sends to the control reaches\nthe host the same way, and goes no further.",
+          "description": "Passes a click on the host itself to the control inside that answers clicks.\n\n**A click dispatched on the host reaches nothing that toggles.** A switch,\na checkbox or a radio renders its control in its shadow root, and only a\nclick that lands there moves it. `element.click()`, a test's or an\nautomation's, is dispatched on the host, and so is the click a `<label for>`\non the page sends the element it names: `helix-switch` left `checked` false\nunder `click()` while a pointer press on it turned it on. A native checkbox\ntoggles on both, and code written against one expects it.\n\n**One click reaches the page for each press, as from a native control.**\nThe control's click used to be sent composed, so it crossed the shadow root\nand reached the host after the host's own: a listener on the host heard two\nclicks for one `click()` or one press on a `<label for>`, where one on a\nnative checkbox hears one. So there are two paths, and each leaves exactly\none click outside the shadow root:\n\n- **The host's `click()`** calls {@link click}, which clicks the control\n  instead. That click is the only one: it reaches the host retargeted, as a\n  click inside a native control does, after the control has moved, so a\n  listener reads the new state and `preventDefault()` puts the old one back.\n- **A click that starts at the host** some other way, from a `<label for>`,\n  a press on the host's own box, or `dispatchEvent`, is the click the page\n  hears. The control is sent a copy that is not composed, so it moves the\n  control and stops at the shadow root. The copy goes in the capture phase,\n  so the host's own listeners already read the new state, as a native\n  checkbox's do. A press inside the shadow root has already landed on its\n  control and is left alone.",
           "name": "HostClickController",
           "members": [
             {
@@ -2560,6 +2560,16 @@
                 }
               }
             },
+            {
+              "kind": "method",
+              "name": "click",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "description": "Clicks the control, for the host's own `click()`. Answers `false` when\nthere is no control yet, before the first render, so the host can fall\nback to its own click."
+            },
             {
               "kind": "field",
               "name": "forward",
@@ -34084,7 +34094,7 @@
           "type": {
             "text": "string"
           },
-          "default": "'0.180.0'",
+          "default": "'0.181.0'",
           "description": "The version of the package this file ships in.\n\n**Written by `fusion/scripts/version.mjs`** wherever it writes the package's\n`package.json`, and stamped back into the repository beside it after a\nrelease, so the two never disagree; a spec beside this holds them to it.\nNothing else in the running code knows which release it is."
         }
       ],
@@ -34720,6 +34730,6 @@
   ],
   "helix": {
     "package": "@fusion.dev/helix-core",
-    "version": "0.180.0"
+    "version": "0.181.0"
   }
 }

package/dist/controllers/host-click-controller/host-click-controller.d.ts

@@ -10,10 +10,24 @@ import type { ReactiveController, ReactiveControllerHost } from 'lit';
  * under `click()` while a pointer press on it turned it on. A native checkbox
  * toggles on both, and code written against one expects it.
  *
- * **Only a click that starts at the host**, whose path begins there. A press
- * inside the shadow root reaches the host too, retargeted, and has already
- * done its work where it landed; the click this sends to the control reaches
- * the host the same way, and goes no further.
+ * **One click reaches the page for each press, as from a native control.**
+ * The control's click used to be sent composed, so it crossed the shadow root
+ * and reached the host after the host's own: a listener on the host heard two
+ * clicks for one `click()` or one press on a `<label for>`, where one on a
+ * native checkbox hears one. So there are two paths, and each leaves exactly
+ * one click outside the shadow root:
+ *
+ * - **The host's `click()`** calls {@link click}, which clicks the control
+ *   instead. That click is the only one: it reaches the host retargeted, as a
+ *   click inside a native control does, after the control has moved, so a
+ *   listener reads the new state and `preventDefault()` puts the old one back.
+ * - **A click that starts at the host** some other way, from a `<label for>`,
+ *   a press on the host's own box, or `dispatchEvent`, is the click the page
+ *   hears. The control is sent a copy that is not composed, so it moves the
+ *   control and stops at the shadow root. The copy goes in the capture phase,
+ *   so the host's own listeners already read the new state, as a native
+ *   checkbox's do. A press inside the shadow root has already landed on its
+ *   control and is left alone.
  */
 export declare class HostClickController implements ReactiveController {
     private readonly host;
@@ -21,5 +35,11 @@ export declare class HostClickController implements ReactiveController {
     constructor(host: ReactiveControllerHost & HTMLElement, target: () => HTMLElement | null | undefined);
     hostConnected(): void;
     hostDisconnected(): void;
+    /**
+     * Clicks the control, for the host's own `click()`. Answers `false` when
+     * there is no control yet, before the first render, so the host can fall
+     * back to its own click.
+     */
+    click(): boolean;
     private readonly forward;
 }

package/dist/controllers/host-click-controller/host-click-controller.js

@@ -3,17 +3,44 @@ export class HostClickController {
         this.host = host;
         this.target = target;
         this.forward = (event) => {
-            if (event.composedPath()[0] !== this.host) {
+            if (event.composedPath()[0] !== this.host || event.defaultPrevented) {
                 return;
             }
-            this.target()?.click();
+            const control = this.target();
+            if (!control || control.matches(':disabled')) {
+                return;
+            }
+            control.dispatchEvent(new MouseEvent('click', {
+                altKey: event.altKey,
+                bubbles: true,
+                button: event.button,
+                buttons: event.buttons,
+                cancelable: true,
+                clientX: event.clientX,
+                clientY: event.clientY,
+                composed: false,
+                ctrlKey: event.ctrlKey,
+                detail: event.detail,
+                metaKey: event.metaKey,
+                screenX: event.screenX,
+                screenY: event.screenY,
+                shiftKey: event.shiftKey,
+            }));
         };
         host.addController(this);
     }
     hostConnected() {
-        this.host.addEventListener('click', this.forward);
+        this.host.addEventListener('click', this.forward, { capture: true });
     }
     hostDisconnected() {
-        this.host.removeEventListener('click', this.forward);
+        this.host.removeEventListener('click', this.forward, { capture: true });
+    }
+    click() {
+        const control = this.target();
+        if (!control) {
+            return false;
+        }
+        control.click();
+        return true;
     }
 }

package/dist/version.d.ts

@@ -6,4 +6,4 @@
  * release, so the two never disagree; a spec beside this holds them to it.
  * Nothing else in the running code knows which release it is.
  */
-export declare const VERSION = "0.180.0";
+export declare const VERSION = "0.181.0";

package/dist/version.js

@@ -1 +1 @@
-export const VERSION = '0.180.0';
+export const VERSION = '0.181.0';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix-core",
   "description": "Helix element primitives: base classes, mixins, decorators, utilities.",
-  "version": "0.180.0",
+  "version": "0.181.0",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -74,11 +74,11 @@
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
     "@floating-ui/dom": "^1.8.0",
-    "@fusion.dev/helix-icons": "0.180.0"
+    "@fusion.dev/helix-icons": "0.181.0"
   },
   "devDependencies": {
-    "@fusion.dev/helix-cem": "0.180.0",
-    "@fusion.dev/helix-testing": "0.180.0",
+    "@fusion.dev/helix-cem": "0.181.0",
+    "@fusion.dev/helix-testing": "0.181.0",
     "@lit-labs/ssr": "^4.1.0",
     "lit": "^3.2.1"
   },