@adsgency_npm/adsgency-ads-ui 0.1.0-alpha.19 → 0.1.0-alpha.20

package/dist/index.cjs

@@ -1924,6 +1924,73 @@ function useNestedDismissableLayerCoordinator() {
     ]
   );
 }
+function useNestedDismissableLayerParent({
+  onEscapeKeyDown,
+  onFocusOutside,
+  onPointerDownOutside
+} = {}) {
+  const coordinator = useNestedDismissableLayerCoordinator();
+  const shieldNextFocusOutsideRef = React19.useRef(false);
+  const handlePointerDownOutside = React19.useCallback(
+    (event) => {
+      onPointerDownOutside?.(event);
+      if (event.defaultPrevented) return;
+      const hasActiveNestedLayer = coordinator.hasActiveNestedLayer();
+      const shouldShieldParent = hasActiveNestedLayer || coordinator.hadActiveNestedLayerAtPointerDown();
+      if (!shouldShieldParent) {
+        shieldNextFocusOutsideRef.current = false;
+        return;
+      }
+      shieldNextFocusOutsideRef.current = true;
+      if (hasActiveNestedLayer) {
+        coordinator.dismissTopNestedLayer();
+      }
+      event.preventDefault();
+    },
+    [coordinator, onPointerDownOutside]
+  );
+  const handleFocusOutside = React19.useCallback(
+    (event) => {
+      onFocusOutside?.(event);
+      if (event.defaultPrevented) return;
+      const followsShieldedPointer = shieldNextFocusOutsideRef.current;
+      shieldNextFocusOutsideRef.current = false;
+      if (followsShieldedPointer) {
+        event.preventDefault();
+        return;
+      }
+      if (!coordinator.hasActiveNestedLayer()) return;
+      coordinator.dismissTopNestedLayer();
+      event.preventDefault();
+    },
+    [coordinator, onFocusOutside]
+  );
+  const handleEscapeKeyDown = React19.useCallback(
+    (event) => {
+      onEscapeKeyDown?.(event);
+      if (event.defaultPrevented || !coordinator.hasActiveNestedLayer()) {
+        return;
+      }
+      coordinator.dismissTopNestedLayer();
+      event.preventDefault();
+    },
+    [coordinator, onEscapeKeyDown]
+  );
+  return React19.useMemo(
+    () => ({
+      coordinator,
+      onEscapeKeyDown: handleEscapeKeyDown,
+      onFocusOutside: handleFocusOutside,
+      onPointerDownOutside: handlePointerDownOutside
+    }),
+    [
+      coordinator,
+      handleEscapeKeyDown,
+      handleFocusOutside,
+      handlePointerDownOutside
+    ]
+  );
+}
 function NestedDismissableLayerProvider({
   children,
   coordinator
@@ -1953,55 +2020,12 @@ var PopoverContentImpl = React20.forwardRef(
     sideOffset = 4,
     ...props
   }, ref) => {
-    const coordinator = useNestedDismissableLayerCoordinator();
-    const shieldNextFocusOutsideRef = React20.useRef(false);
-    const handlePointerDownOutside = React20.useCallback(
-      (event) => {
-        onPointerDownOutside?.(event);
-        if (event.defaultPrevented) return;
-        const hasActiveNestedLayer = coordinator.hasActiveNestedLayer();
-        const shouldShieldParent = hasActiveNestedLayer || coordinator.hadActiveNestedLayerAtPointerDown();
-        if (!shouldShieldParent) {
-          shieldNextFocusOutsideRef.current = false;
-          return;
-        }
-        shieldNextFocusOutsideRef.current = true;
-        if (hasActiveNestedLayer) {
-          coordinator.dismissTopNestedLayer();
-        }
-        event.preventDefault();
-      },
-      [coordinator, onPointerDownOutside]
-    );
-    const handleFocusOutside = React20.useCallback(
-      (event) => {
-        onFocusOutside?.(event);
-        if (event.defaultPrevented) return;
-        const followsShieldedPointer = shieldNextFocusOutsideRef.current;
-        shieldNextFocusOutsideRef.current = false;
-        if (followsShieldedPointer) {
-          event.preventDefault();
-          return;
-        }
-        const hasActiveNestedLayer = coordinator.hasActiveNestedLayer();
-        if (!hasActiveNestedLayer) return;
-        coordinator.dismissTopNestedLayer();
-        event.preventDefault();
-      },
-      [coordinator, onFocusOutside]
-    );
-    const handleEscapeKeyDown = React20.useCallback(
-      (event) => {
-        onEscapeKeyDown?.(event);
-        if (event.defaultPrevented || !coordinator.hasActiveNestedLayer()) {
-          return;
-        }
-        coordinator.dismissTopNestedLayer();
-        event.preventDefault();
-      },
-      [coordinator, onEscapeKeyDown]
-    );
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(NestedDismissableLayerProvider, { coordinator, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    const parentLayer = useNestedDismissableLayerParent({
+      onEscapeKeyDown,
+      onFocusOutside,
+      onPointerDownOutside
+    });
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(NestedDismissableLayerProvider, { coordinator: parentLayer.coordinator, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       PopoverPrimitive.Content,
       {
         ref,
@@ -2011,9 +2035,9 @@ var PopoverContentImpl = React20.forwardRef(
           "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-popover-content-transform-origin]",
           className
         ),
-        onEscapeKeyDown: handleEscapeKeyDown,
-        onFocusOutside: handleFocusOutside,
-        onPointerDownOutside: handlePointerDownOutside,
+        onEscapeKeyDown: parentLayer.onEscapeKeyDown,
+        onFocusOutside: parentLayer.onFocusOutside,
+        onPointerDownOutside: parentLayer.onPointerDownOutside,
         ...props
       }
     ) });
@@ -6605,8 +6629,22 @@ var DialogBody = React60.forwardRef(
 );
 DialogBody.displayName = "DialogBody";
 var DialogContent = React60.forwardRef(
-  ({ children, className, closeLabel, hideCloseButton = false, ...props }, ref) => {
+  ({
+    children,
+    className,
+    closeLabel,
+    hideCloseButton = false,
+    onEscapeKeyDown,
+    onFocusOutside,
+    onPointerDownOutside,
+    ...props
+  }, ref) => {
     const { messages } = useAdsI18n();
+    const parentLayer = useNestedDismissableLayerParent({
+      onEscapeKeyDown,
+      onFocusOutside,
+      onPointerDownOutside
+    });
     const resolvedCloseLabel = closeLabel ?? messages.dialog.close;
     const childNodes = flattenDialogChildren(children);
     const headerIndex = childNodes.findIndex(
@@ -6635,21 +6673,19 @@ var DialogContent = React60.forwardRef(
       }
     }
     const footerNode = footerIndex >= 0 && footerIndex !== headerIndex ? childNodes[footerIndex] : null;
-    const bodyNodes = childNodes.filter(
-      (child, index) => {
-        if (index === headerIndex || index === footerIndex) {
-          return false;
-        }
-        return !generatedHeaderNodes.includes(child);
+    const bodyNodes = childNodes.filter((child, index) => {
+      if (index === headerIndex || index === footerIndex) {
+        return false;
       }
-    );
+      return !generatedHeaderNodes.includes(child);
+    });
     const explicitBodyNodes = bodyNodes.filter(
       (child) => isDialogSlotElement(child, DialogBody)
     );
     const looseBodyNodes = bodyNodes.filter(
       (child) => !isDialogSlotElement(child, DialogBody)
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(DialogPortal, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(NestedDismissableLayerProvider, { coordinator: parentLayer.coordinator, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(DialogPortal, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(DialogOverlay, {}),
       /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
         DialogPrimitive.Content,
@@ -6660,6 +6696,9 @@ var DialogContent = React60.forwardRef(
             adsTextColorClassName.card,
             className
           ),
+          onEscapeKeyDown: parentLayer.onEscapeKeyDown,
+          onFocusOutside: parentLayer.onFocusOutside,
+          onPointerDownOutside: parentLayer.onPointerDownOutside,
           ref,
           ...props,
           children: [
@@ -6682,7 +6721,7 @@ var DialogContent = React60.forwardRef(
           ]
         }
       )
-    ] });
+    ] }) });
   }
 );
 DialogContent.displayName = "DialogContent";