@irozon/design-system-react 0.2.0 → 0.2.1

package/dist/Dialog.js

@@ -26,6 +26,22 @@ export function Dialog({ open, onClose, variant, className, children, ...rest })
         dialog.addEventListener("cancel", handleCancel);
         return () => dialog.removeEventListener("cancel", handleCancel);
     }, [onClose]);
+    useEffect(() => {
+        const dialog = ref.current;
+        if (!dialog)
+            return;
+        // Native <dialog> has no built-in click-outside-to-close: a click
+        // anywhere in the viewport bubbles to the dialog element itself
+        // (event.target === dialog) unless it landed on real content inside
+        // it, in which case the target is that content element instead — the
+        // standard idiom for detecting a backdrop click on this element.
+        const handleClick = (event) => {
+            if (event.target === dialog)
+                onClose();
+        };
+        dialog.addEventListener("click", handleClick);
+        return () => dialog.removeEventListener("click", handleClick);
+    }, [onClose]);
     return (_jsx("dialog", { ref: ref, className: cx("iz-dialog", className), "data-variant": variant, ...rest, children: children }));
 }
 export function DialogHeader({ children }) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@irozon/design-system-react",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Canonical React components for the Irozon Design System — thin, accessible wrappers over @irozon/design-system's framework-neutral iz-* CSS. No independent visual styling of its own; the CSS package stays the single source of truth for how these look.",
   "license": "MIT",
   "keywords": [