@plasmicpkgs/react-aria 0.0.95 → 0.0.96

package/dist/react-aria.js

@@ -2158,8 +2158,6 @@ function BasePopover(props) {
   const triggerRef = React__default.default.useRef(null);
   const canvasContext = host.usePlasmicCanvasContext();
   const matchTriggerWidthProp = hasTrigger && matchTriggerWidth;
-  const dialogTriggerContext = React__default.default.useContext(PlasmicDialogTriggerContext);
-  const shouldTrapFocus = !canvasContext && !!dialogTriggerContext;
   const _b = utils.mergeProps(
     {
       // isNonModal: Whether the popover is non-modal, i.e. elements outside the popover may be interacted with by assistive technologies.
@@ -2182,15 +2180,13 @@ function BasePopover(props) {
       canMatchTriggerWidth: hasTrigger
     });
   }, [hasTrigger, setControlContextData]);
-  const withoutDialog = /* @__PURE__ */ React__default.default.createElement("div", null, children);
-  const dialog = /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Dialog, null, children);
   return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, isStandalone && /* @__PURE__ */ React__default.default.createElement("div", { ref: triggerRef }), /* @__PURE__ */ React__default.default.createElement(
     reactAriaComponents.Popover,
     __spreadValues$g({
       style: __spreadValues$g(__spreadValues$g({}, matchTriggerWidthProp ? { width: `var(--trigger-width)` } : {}), COMMON_STYLES)
     }, mergedProps),
     ({ placement }) => withObservedValues$a(
-      shouldTrapFocus ? dialog : withoutDialog,
+      children,
       {
         placementTop: placement === "top",
         placementBottom: placement === "bottom",
@@ -2496,6 +2492,36 @@ function registerComboBox(loader) {
   });
 }
 
+function BaseDialog({ children, className }) {
+  const canvasContext = host.usePlasmicCanvasContext();
+  if (canvasContext) {
+    return /* @__PURE__ */ React__default.default.createElement("div", { className, style: COMMON_STYLES }, children);
+  } else {
+    return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Dialog, { className, style: COMMON_STYLES }, children);
+  }
+}
+const DIALOG_COMPONENT_NAME = makeComponentName("dialog");
+function registerDialog(loader, overrides) {
+  registerComponentHelper(
+    loader,
+    BaseDialog,
+    {
+      name: DIALOG_COMPONENT_NAME,
+      displayName: "Aria Dialog",
+      importPath: "@plasmicpkgs/react-aria/skinny/registerDialog",
+      importName: "BaseDialog",
+      props: {
+        children: {
+          type: "slot",
+          mergeWithParent: true
+        }
+      },
+      trapsFocus: true
+    },
+    overrides
+  );
+}
+
 var __defProp$e = Object.defineProperty;
 var __defProps$c = Object.defineProperties;
 var __getOwnPropDescs$c = Object.getOwnPropertyDescriptors;
@@ -2647,18 +2673,47 @@ const BaseModal = React.forwardRef(
         (_a2 = mergedProps.onOpenChange) == null ? void 0 : _a2.call(mergedProps, true);
       }
     }));
-    const dialogInCanvas = /* @__PURE__ */ React__default.default.createElement("div", { style: COMMON_STYLES, className }, children);
-    const dialog = /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Dialog, { style: COMMON_STYLES, className }, children);
     return /* @__PURE__ */ React__default.default.createElement(
       reactAriaComponents.ModalOverlay,
       __spreadProps$b(__spreadValues$d({}, mergedProps), {
         className: `${resetClassName} ${modalOverlayClass}`
       }),
-      /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Modal, null, canvasCtx ? dialogInCanvas : dialog)
+      /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Modal, { className }, children)
     );
   }
 );
 const MODAL_COMPONENT_NAME = makeComponentName("modal");
+const MODAL_DEFAULT_SLOT_CONTENT = {
+  type: "vbox",
+  styles: {
+    width: "stretch",
+    padding: 0,
+    gap: "10px",
+    justifyContent: "flex-start",
+    alignItems: "flex-start"
+  },
+  children: [
+    {
+      type: "component",
+      name: HEADING_COMPONENT_NAME
+    },
+    {
+      type: "text",
+      value: "This is a Modal!"
+    },
+    {
+      type: "text",
+      value: "You can put anything you can imagine here!",
+      styles: {
+        fontWeight: 500
+      }
+    },
+    {
+      type: "text",
+      value: "Use it in a `Aria Dialog Trigger` component to trigger it on a button click!"
+    }
+  ]
+};
 function registerModal(loader, overrides) {
   registerComponentHelper(
     loader,
@@ -2697,37 +2752,7 @@ function registerModal(loader, overrides) {
         children: {
           type: "slot",
           mergeWithParent: true,
-          defaultValue: {
-            type: "vbox",
-            styles: {
-              width: "stretch",
-              padding: 0,
-              gap: "10px",
-              justifyContent: "flex-start",
-              alignItems: "flex-start"
-            },
-            children: [
-              {
-                type: "component",
-                name: HEADING_COMPONENT_NAME
-              },
-              {
-                type: "text",
-                value: "This is a Modal!"
-              },
-              {
-                type: "text",
-                value: "You can put anything you can imagine here!",
-                styles: {
-                  fontWeight: 500
-                }
-              },
-              {
-                type: "text",
-                value: "Use it in a `Aria Dialog Trigger` component to trigger it on a button click!"
-              }
-            ]
-          }
+          defaultValue: MODAL_DEFAULT_SLOT_CONTENT
         },
         modalOverlayClass: {
           type: "class",
@@ -2823,7 +2848,6 @@ function registerDialogTrigger(loader, overrides) {
       importPath: "@plasmicpkgs/react-aria/skinny/registerDialogTrigger",
       importName: "BaseDialogTrigger",
       styleSections: false,
-      isAttachment: true,
       props: {
         trigger: {
           type: "slot",
@@ -2842,10 +2866,21 @@ function registerDialogTrigger(loader, overrides) {
         dialog: {
           type: "slot",
           mergeWithParent: true,
-          defaultValue: {
-            type: "component",
-            name: MODAL_COMPONENT_NAME
-          }
+          defaultValue: [
+            {
+              type: "component",
+              name: MODAL_COMPONENT_NAME,
+              props: {
+                children: {
+                  type: "component",
+                  name: DIALOG_COMPONENT_NAME,
+                  props: {
+                    children: MODAL_DEFAULT_SLOT_CONTENT
+                  }
+                }
+              }
+            }
+          ]
         },
         isOpen: {
           type: "boolean",
@@ -4935,6 +4970,7 @@ function registerAll(loader) {
   registerText(loader);
   registerHeading(loader);
   registerDescription(loader);
+  registerDialog(loader);
   registerOverlayArrow(loader);
   registerSelect(loader);
   registerComboBox(loader);