@nectary/components 5.41.1 → 5.41.2

package/bundle.js

@@ -9032,6 +9032,7 @@ const applyCountPlaceholder = (template2, count) => {
   return template2.replaceAll("{count}", count);
 };
 const sanitizeAttr = (value) => value.replaceAll("&", "&amp;").replaceAll('"', "&quot;").replaceAll("<", "&lt;");
+const toReactCamelCaseHandlerName = (eventSuffix) => `on${eventSuffix.split("-").map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("")}`;
 const isValidAction = (value) => {
   if (typeof value !== "object" || value === null) {
     return false;
@@ -9102,9 +9103,9 @@ class FloatingPanel extends NectaryElement {
       this.#resizeThrottle?.fn();
     });
     this.#resizeObserver.observe(this.#$dialog);
-    this.addEventListener("-close", this.#onCloseReact, { signal });
-    this.addEventListener("-select-all", this.#onSelectAllReact, { signal });
-    this.addEventListener("-action", this.#onActionReact, { signal });
+    this.addEventListener("-close", this.#onCloseReactHandler, { signal });
+    this.addEventListener("-select-all", this.#onSelectAllReactHandler, { signal });
+    this.addEventListener("-action", this.#onActionReactHandler, { signal });
     if (!this.hasAttribute("actions")) {
       this.#renderActions(null);
     }
@@ -9305,7 +9306,7 @@ class FloatingPanel extends NectaryElement {
    * `-${action}` convenience event. The per-action event lets consumers bind
    * directly to a specific action (e.g. `on-archive`) without switching on
    * `e.detail` — and it works for any user-defined action, not just the
-   * built-in defaults. React handlers are forwarded by `#onActionReact`.
+   * built-in defaults. React handlers are forwarded by `#onActionReactHandler`.
    */
   #dispatchAction(action) {
     this.dispatchEvent(new CustomEvent("-action", { detail: action }));
@@ -9411,16 +9412,20 @@ class FloatingPanel extends NectaryElement {
   #onActionsPopoverClose = () => {
     this.#closeOverflowMenu();
   };
-  #onCloseReact = (e) => {
+  #onCloseReactHandler = (e) => {
     getReactEventHandler(this, "on-close")?.(e);
+    getReactEventHandler(this, "onClose")?.(e);
   };
-  #onSelectAllReact = (e) => {
+  #onSelectAllReactHandler = (e) => {
     getReactEventHandler(this, "on-select-all")?.(e);
+    getReactEventHandler(this, "onSelectAll")?.(e);
   };
-  #onActionReact = (e) => {
+  #onActionReactHandler = (e) => {
     getReactEventHandler(this, "on-action")?.(e);
+    getReactEventHandler(this, "onAction")?.(e);
     if (e instanceof CustomEvent && typeof e.detail === "string") {
       getReactEventHandler(this, `on-${e.detail}`)?.(e);
+      getReactEventHandler(this, toReactCamelCaseHandlerName(e.detail))?.(e);
     }
   };
   get panelRect() {

package/floating-panel/index.js

@@ -29,6 +29,7 @@ const applyCountPlaceholder = (template2, count) => {
   return template2.replaceAll("{count}", count);
 };
 const sanitizeAttr = (value) => value.replaceAll("&", "&amp;").replaceAll('"', "&quot;").replaceAll("<", "&lt;");
+const toReactCamelCaseHandlerName = (eventSuffix) => `on${eventSuffix.split("-").map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("")}`;
 const isValidAction = (value) => {
   if (typeof value !== "object" || value === null) {
     return false;
@@ -99,9 +100,9 @@ class FloatingPanel extends NectaryElement {
       this.#resizeThrottle?.fn();
     });
     this.#resizeObserver.observe(this.#$dialog);
-    this.addEventListener("-close", this.#onCloseReact, { signal });
-    this.addEventListener("-select-all", this.#onSelectAllReact, { signal });
-    this.addEventListener("-action", this.#onActionReact, { signal });
+    this.addEventListener("-close", this.#onCloseReactHandler, { signal });
+    this.addEventListener("-select-all", this.#onSelectAllReactHandler, { signal });
+    this.addEventListener("-action", this.#onActionReactHandler, { signal });
     if (!this.hasAttribute("actions")) {
       this.#renderActions(null);
     }
@@ -302,7 +303,7 @@ class FloatingPanel extends NectaryElement {
    * `-${action}` convenience event. The per-action event lets consumers bind
    * directly to a specific action (e.g. `on-archive`) without switching on
    * `e.detail` — and it works for any user-defined action, not just the
-   * built-in defaults. React handlers are forwarded by `#onActionReact`.
+   * built-in defaults. React handlers are forwarded by `#onActionReactHandler`.
    */
   #dispatchAction(action) {
     this.dispatchEvent(new CustomEvent("-action", { detail: action }));
@@ -408,16 +409,20 @@ class FloatingPanel extends NectaryElement {
   #onActionsPopoverClose = () => {
     this.#closeOverflowMenu();
   };
-  #onCloseReact = (e) => {
+  #onCloseReactHandler = (e) => {
     getReactEventHandler(this, "on-close")?.(e);
+    getReactEventHandler(this, "onClose")?.(e);
   };
-  #onSelectAllReact = (e) => {
+  #onSelectAllReactHandler = (e) => {
     getReactEventHandler(this, "on-select-all")?.(e);
+    getReactEventHandler(this, "onSelectAll")?.(e);
   };
-  #onActionReact = (e) => {
+  #onActionReactHandler = (e) => {
     getReactEventHandler(this, "on-action")?.(e);
+    getReactEventHandler(this, "onAction")?.(e);
     if (e instanceof CustomEvent && typeof e.detail === "string") {
       getReactEventHandler(this, `on-${e.detail}`)?.(e);
+      getReactEventHandler(this, toReactCamelCaseHandlerName(e.detail))?.(e);
     }
   };
   get panelRect() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nectary/components",
-  "version": "5.41.1",
+  "version": "5.41.2",
   "files": [
     "**/*/*.css",
     "**/*/*.json",