@tamagui/portal 1.0.1-beta.112 → 1.0.1-beta.113

package/dist/cjs/Portal.js

@@ -29,8 +29,7 @@ var import_core = require("@tamagui/core");
 var import_stacks = require("@tamagui/stacks");
 var React = __toESM(require("react"));
 var import_react_dom = require("react-dom");
-var import_react_native = require("react-native");
-const Portal = ({ visible, ...props }) => {
+const Portal = ({ host = ((_a) => (_a = globalThis.document) == null ? void 0 : _a.body)(), ...props }) => {
   const contents = /* @__PURE__ */ React.createElement(import_stacks.YStack, {
     pointerEvents: "box-none",
     fullscreen: true,
@@ -38,20 +37,10 @@ const Portal = ({ visible, ...props }) => {
     maxWidth: import_core.isWeb ? "100vw" : "100%",
     ...props
   });
-  if (!import_core.isWeb) {
-    return /* @__PURE__ */ React.createElement(import_react_native.Modal, {
-      presentationStyle: "overFullScreen",
-      hardwareAccelerated: true,
-      visible,
-      transparent: true,
-      pointerEvents: "box-none"
-    }, contents);
-  }
   const [hostElement, setHostElement] = React.useState(null);
   (0, import_core.useIsomorphicLayoutEffect)(() => {
-    var _a;
-    setHostElement((_a = globalThis.document) == null ? void 0 : _a.body);
-  }, []);
+    setHostElement(host);
+  }, [host]);
   if (hostElement) {
     return (0, import_react_dom.createPortal)(contents, hostElement);
   }

package/dist/cjs/Portal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/Portal.tsx"],
-  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport '@tamagui/polyfill-dev'\n\nimport { isWeb, useIsomorphicLayoutEffect } from '@tamagui/core'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\nimport { Modal } from 'react-native'\n\nexport type PortalProps = YStackProps & {\n  visible?: boolean\n}\n\nexport const Portal = ({ visible, ...props }: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      // @ts-expect-error ok on web\n      position={isWeb ? 'fixed' : 'absolute'}\n      maxWidth={isWeb ? '100vw' : '100%'}\n      {...props}\n    />\n  )\n\n  if (!isWeb) {\n    // check if theme stays in context here\n    return (\n      <Modal\n        presentationStyle=\"overFullScreen\"\n        hardwareAccelerated\n        visible={visible}\n        transparent\n        pointerEvents=\"box-none\"\n      >\n        {contents}\n      </Modal>\n    )\n  }\n\n  const [hostElement, setHostElement] = React.useState<any>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    setHostElement(globalThis.document?.body)\n  }, [])\n\n  if (hostElement) {\n    return createPortal(contents, hostElement)\n  }\n\n  // ssr return null\n  return null\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,0BAAO;AAEP,kBAAiD;AACjD,oBAAoC;AACpC,YAAuB;AACvB,uBAA6B;AAC7B,0BAAsB;AAMf,MAAM,SAAS,CAAC,EAAE,YAAY,YAAyB;AAC5D,QAAM,WACJ,oCAAC;AAAA,IACC,eAAc;AAAA,IACd,YAAU;AAAA,IAEV,UAAU,oBAAQ,UAAU;AAAA,IAC5B,UAAU,oBAAQ,UAAU;AAAA,IAC3B,GAAG;AAAA,GACN;AAGF,MAAI,CAAC,mBAAO;AAEV,WACE,oCAAC;AAAA,MACC,mBAAkB;AAAA,MAClB,qBAAmB;AAAA,MACnB;AAAA,MACA,aAAW;AAAA,MACX,eAAc;AAAA,OAEb,QACH;AAAA,EAEJ;AAEA,QAAM,CAAC,aAAa,kBAAkB,MAAM,SAAc,IAAI;AAE9D,6CAA0B,MAAM;AA1ClC;AA2CI,mBAAe,iBAAW,aAAX,mBAAqB,IAAI;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,MAAI,aAAa;AACf,WAAO,mCAAa,UAAU,WAAW;AAAA,EAC3C;AAGA,SAAO;AACT;",
+  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport '@tamagui/polyfill-dev'\n\nimport { isWeb, useIsomorphicLayoutEffect } from '@tamagui/core'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nexport type PortalProps = YStackProps & {\n  host?: any // element\n}\n\nexport const Portal = ({ host = globalThis.document?.body, ...props }: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      // @ts-expect-error ok on web\n      position={isWeb ? 'fixed' : 'absolute'}\n      maxWidth={isWeb ? '100vw' : '100%'}\n      {...props}\n    />\n  )\n\n  const [hostElement, setHostElement] = React.useState<any>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    setHostElement(host)\n  }, [host])\n\n  if (hostElement) {\n    return createPortal(contents, hostElement)\n  }\n\n  // ssr return null\n  return null\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,0BAAO;AAEP,kBAAiD;AACjD,oBAAoC;AACpC,YAAuB;AACvB,uBAA6B;AAMtB,MAAM,SAAS,CAAC,EAAE,OAAO,0BAAW,aAAX,mBAAqB,YAAS,YAAyB;AACrF,QAAM,WACJ,oCAAC;AAAA,IACC,eAAc;AAAA,IACd,YAAU;AAAA,IAEV,UAAU,oBAAQ,UAAU;AAAA,IAC5B,UAAU,oBAAQ,UAAU;AAAA,IAC3B,GAAG;AAAA,GACN;AAGF,QAAM,CAAC,aAAa,kBAAkB,MAAM,SAAc,IAAI;AAE9D,6CAA0B,MAAM;AAC9B,mBAAe,IAAI;AAAA,EACrB,GAAG,CAAC,IAAI,CAAC;AAET,MAAI,aAAa;AACf,WAAO,mCAAa,UAAU,WAAW;AAAA,EAC3C;AAGA,SAAO;AACT;",
   "names": []
 }

package/dist/cjs/Portal.native.js

@@ -0,0 +1,56 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Portal_native_exports = {};
+__export(Portal_native_exports, {
+  Portal: () => Portal
+});
+module.exports = __toCommonJS(Portal_native_exports);
+var import_stacks = require("@tamagui/stacks");
+var React = __toESM(require("react"));
+var import_react_native = require("react-native");
+var import_ReactNative = require("react-native/Libraries/Renderer/shims/ReactNative");
+let root = 0;
+const og = import_react_native.AppRegistry.runApplication.bind(import_react_native.AppRegistry);
+import_react_native.AppRegistry.runApplication = function(...args) {
+  var _a;
+  root = (_a = args[1]) == null ? void 0 : _a.rootTag;
+  return og(...args);
+};
+const Portal = (props) => {
+  const contents = /* @__PURE__ */ React.createElement(import_stacks.YStack, {
+    pointerEvents: "box-none",
+    fullscreen: true,
+    position: "absolute",
+    maxWidth: "100%",
+    zIndex: 1e5,
+    ...props
+  });
+  if (root) {
+    return (0, import_ReactNative.createPortal)(contents, root);
+  }
+  return null;
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Portal
+});
+//# sourceMappingURL=Portal.native.js.map

package/dist/cjs/Portal.native.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/Portal.native.tsx"],
+  "sourcesContent": ["import { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { AppRegistry } from 'react-native'\nimport { createPortal } from 'react-native/Libraries/Renderer/shims/ReactNative'\n\nexport type PortalProps = YStackProps\n\nlet root = 0\nconst og = AppRegistry.runApplication.bind(AppRegistry)\nAppRegistry.runApplication = function (...args) {\n  root = args[1]?.rootTag\n  return og(...args)\n}\n\nexport const Portal = (props: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      position=\"absolute\"\n      maxWidth=\"100%\"\n      zIndex={100000}\n      {...props}\n    />\n  )\n\n  if (root) {\n    return createPortal(contents, root)\n  }\n\n  return null\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAoC;AACpC,YAAuB;AACvB,0BAA4B;AAC5B,yBAA6B;AAI7B,IAAI,OAAO;AACX,MAAM,KAAK,gCAAY,eAAe,KAAK,+BAAW;AACtD,gCAAY,iBAAiB,YAAa,MAAM;AAThD;AAUE,SAAO,WAAK,OAAL,mBAAS;AAChB,SAAO,GAAG,GAAG,IAAI;AACnB;AAEO,MAAM,SAAS,CAAC,UAAuB;AAC5C,QAAM,WACJ,oCAAC;AAAA,IACC,eAAc;AAAA,IACd,YAAU;AAAA,IACV,UAAS;AAAA,IACT,UAAS;AAAA,IACT,QAAQ;AAAA,IACP,GAAG;AAAA,GACN;AAGF,MAAI,MAAM;AACR,WAAO,qCAAa,UAAU,IAAI;AAAA,EACpC;AAEA,SAAO;AACT;",
+  "names": []
+}

package/dist/esm/Portal.js

@@ -3,8 +3,7 @@ import { isWeb, useIsomorphicLayoutEffect } from "@tamagui/core";
 import { YStack } from "@tamagui/stacks";
 import * as React from "react";
 import { createPortal } from "react-dom";
-import { Modal } from "react-native";
-const Portal = ({ visible, ...props }) => {
+const Portal = ({ host = ((_a) => (_a = globalThis.document) == null ? void 0 : _a.body)(), ...props }) => {
   const contents = /* @__PURE__ */ React.createElement(YStack, {
     pointerEvents: "box-none",
     fullscreen: true,
@@ -12,20 +11,10 @@ const Portal = ({ visible, ...props }) => {
     maxWidth: isWeb ? "100vw" : "100%",
     ...props
   });
-  if (!isWeb) {
-    return /* @__PURE__ */ React.createElement(Modal, {
-      presentationStyle: "overFullScreen",
-      hardwareAccelerated: true,
-      visible,
-      transparent: true,
-      pointerEvents: "box-none"
-    }, contents);
-  }
   const [hostElement, setHostElement] = React.useState(null);
   useIsomorphicLayoutEffect(() => {
-    var _a;
-    setHostElement((_a = globalThis.document) == null ? void 0 : _a.body);
-  }, []);
+    setHostElement(host);
+  }, [host]);
   if (hostElement) {
     return createPortal(contents, hostElement);
   }

package/dist/esm/Portal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/Portal.tsx"],
-  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport '@tamagui/polyfill-dev'\n\nimport { isWeb, useIsomorphicLayoutEffect } from '@tamagui/core'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\nimport { Modal } from 'react-native'\n\nexport type PortalProps = YStackProps & {\n  visible?: boolean\n}\n\nexport const Portal = ({ visible, ...props }: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      // @ts-expect-error ok on web\n      position={isWeb ? 'fixed' : 'absolute'}\n      maxWidth={isWeb ? '100vw' : '100%'}\n      {...props}\n    />\n  )\n\n  if (!isWeb) {\n    // check if theme stays in context here\n    return (\n      <Modal\n        presentationStyle=\"overFullScreen\"\n        hardwareAccelerated\n        visible={visible}\n        transparent\n        pointerEvents=\"box-none\"\n      >\n        {contents}\n      </Modal>\n    )\n  }\n\n  const [hostElement, setHostElement] = React.useState<any>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    setHostElement(globalThis.document?.body)\n  }, [])\n\n  if (hostElement) {\n    return createPortal(contents, hostElement)\n  }\n\n  // ssr return null\n  return null\n}\n"],
-  "mappings": "AACA;AAEA;AACA;AACA;AACA;AACA;AAMO,MAAM,SAAS,CAAC,EAAE,YAAY,YAAyB;AAC5D,QAAM,WACJ,oCAAC;AAAA,IACC,eAAc;AAAA,IACd,YAAU;AAAA,IAEV,UAAU,QAAQ,UAAU;AAAA,IAC5B,UAAU,QAAQ,UAAU;AAAA,IAC3B,GAAG;AAAA,GACN;AAGF,MAAI,CAAC,OAAO;AAEV,WACE,oCAAC;AAAA,MACC,mBAAkB;AAAA,MAClB,qBAAmB;AAAA,MACnB;AAAA,MACA,aAAW;AAAA,MACX,eAAc;AAAA,OAEb,QACH;AAAA,EAEJ;AAEA,QAAM,CAAC,aAAa,kBAAkB,MAAM,SAAc,IAAI;AAE9D,4BAA0B,MAAM;AA1ClC;AA2CI,mBAAe,iBAAW,aAAX,mBAAqB,IAAI;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,MAAI,aAAa;AACf,WAAO,aAAa,UAAU,WAAW;AAAA,EAC3C;AAGA,SAAO;AACT;",
+  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport '@tamagui/polyfill-dev'\n\nimport { isWeb, useIsomorphicLayoutEffect } from '@tamagui/core'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nexport type PortalProps = YStackProps & {\n  host?: any // element\n}\n\nexport const Portal = ({ host = globalThis.document?.body, ...props }: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      // @ts-expect-error ok on web\n      position={isWeb ? 'fixed' : 'absolute'}\n      maxWidth={isWeb ? '100vw' : '100%'}\n      {...props}\n    />\n  )\n\n  const [hostElement, setHostElement] = React.useState<any>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    setHostElement(host)\n  }, [host])\n\n  if (hostElement) {\n    return createPortal(contents, hostElement)\n  }\n\n  // ssr return null\n  return null\n}\n"],
+  "mappings": "AACA;AAEA;AACA;AACA;AACA;AAMO,MAAM,SAAS,CAAC,EAAE,OAAO,0BAAW,aAAX,mBAAqB,YAAS,YAAyB;AACrF,QAAM,WACJ,oCAAC;AAAA,IACC,eAAc;AAAA,IACd,YAAU;AAAA,IAEV,UAAU,QAAQ,UAAU;AAAA,IAC5B,UAAU,QAAQ,UAAU;AAAA,IAC3B,GAAG;AAAA,GACN;AAGF,QAAM,CAAC,aAAa,kBAAkB,MAAM,SAAc,IAAI;AAE9D,4BAA0B,MAAM;AAC9B,mBAAe,IAAI;AAAA,EACrB,GAAG,CAAC,IAAI,CAAC;AAET,MAAI,aAAa;AACf,WAAO,aAAa,UAAU,WAAW;AAAA,EAC3C;AAGA,SAAO;AACT;",
   "names": []
 }

package/dist/esm/Portal.native.js

@@ -0,0 +1,29 @@
+import { YStack } from "@tamagui/stacks";
+import * as React from "react";
+import { AppRegistry } from "react-native";
+import { createPortal } from "react-native/Libraries/Renderer/shims/ReactNative";
+let root = 0;
+const og = AppRegistry.runApplication.bind(AppRegistry);
+AppRegistry.runApplication = function(...args) {
+  var _a;
+  root = (_a = args[1]) == null ? void 0 : _a.rootTag;
+  return og(...args);
+};
+const Portal = (props) => {
+  const contents = /* @__PURE__ */ React.createElement(YStack, {
+    pointerEvents: "box-none",
+    fullscreen: true,
+    position: "absolute",
+    maxWidth: "100%",
+    zIndex: 1e5,
+    ...props
+  });
+  if (root) {
+    return createPortal(contents, root);
+  }
+  return null;
+};
+export {
+  Portal
+};
+//# sourceMappingURL=Portal.native.js.map

package/dist/esm/Portal.native.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/Portal.native.tsx"],
+  "sourcesContent": ["import { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { AppRegistry } from 'react-native'\nimport { createPortal } from 'react-native/Libraries/Renderer/shims/ReactNative'\n\nexport type PortalProps = YStackProps\n\nlet root = 0\nconst og = AppRegistry.runApplication.bind(AppRegistry)\nAppRegistry.runApplication = function (...args) {\n  root = args[1]?.rootTag\n  return og(...args)\n}\n\nexport const Portal = (props: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      position=\"absolute\"\n      maxWidth=\"100%\"\n      zIndex={100000}\n      {...props}\n    />\n  )\n\n  if (root) {\n    return createPortal(contents, root)\n  }\n\n  return null\n}\n"],
+  "mappings": "AAAA;AACA;AACA;AACA;AAIA,IAAI,OAAO;AACX,MAAM,KAAK,YAAY,eAAe,KAAK,WAAW;AACtD,YAAY,iBAAiB,YAAa,MAAM;AAThD;AAUE,SAAO,WAAK,OAAL,mBAAS;AAChB,SAAO,GAAG,GAAG,IAAI;AACnB;AAEO,MAAM,SAAS,CAAC,UAAuB;AAC5C,QAAM,WACJ,oCAAC;AAAA,IACC,eAAc;AAAA,IACd,YAAU;AAAA,IACV,UAAS;AAAA,IACT,UAAS;AAAA,IACT,QAAQ;AAAA,IACP,GAAG;AAAA,GACN;AAGF,MAAI,MAAM;AACR,WAAO,aAAa,UAAU,IAAI;AAAA,EACpC;AAEA,SAAO;AACT;",
+  "names": []
+}

package/dist/jsx/Portal.js

@@ -3,17 +3,12 @@ import { isWeb, useIsomorphicLayoutEffect } from "@tamagui/core";
 import { YStack } from "@tamagui/stacks";
 import * as React from "react";
 import { createPortal } from "react-dom";
-import { Modal } from "react-native";
-const Portal = ({ visible, ...props }) => {
+const Portal = ({ host = ((_a) => (_a = globalThis.document) == null ? void 0 : _a.body)(), ...props }) => {
   const contents = <YStack pointerEvents="box-none" fullscreen position={isWeb ? "fixed" : "absolute"} maxWidth={isWeb ? "100vw" : "100%"} {...props} />;
-  if (!isWeb) {
-    return <Modal presentationStyle="overFullScreen" hardwareAccelerated visible={visible} transparent pointerEvents="box-none">{contents}</Modal>;
-  }
   const [hostElement, setHostElement] = React.useState(null);
   useIsomorphicLayoutEffect(() => {
-    var _a;
-    setHostElement((_a = globalThis.document) == null ? void 0 : _a.body);
-  }, []);
+    setHostElement(host);
+  }, [host]);
   if (hostElement) {
     return createPortal(contents, hostElement);
   }

package/dist/jsx/Portal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/Portal.tsx"],
-  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport '@tamagui/polyfill-dev'\n\nimport { isWeb, useIsomorphicLayoutEffect } from '@tamagui/core'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\nimport { Modal } from 'react-native'\n\nexport type PortalProps = YStackProps & {\n  visible?: boolean\n}\n\nexport const Portal = ({ visible, ...props }: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      // @ts-expect-error ok on web\n      position={isWeb ? 'fixed' : 'absolute'}\n      maxWidth={isWeb ? '100vw' : '100%'}\n      {...props}\n    />\n  )\n\n  if (!isWeb) {\n    // check if theme stays in context here\n    return (\n      <Modal\n        presentationStyle=\"overFullScreen\"\n        hardwareAccelerated\n        visible={visible}\n        transparent\n        pointerEvents=\"box-none\"\n      >\n        {contents}\n      </Modal>\n    )\n  }\n\n  const [hostElement, setHostElement] = React.useState<any>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    setHostElement(globalThis.document?.body)\n  }, [])\n\n  if (hostElement) {\n    return createPortal(contents, hostElement)\n  }\n\n  // ssr return null\n  return null\n}\n"],
-  "mappings": "AACA;AAEA;AACA;AACA;AACA;AACA;AAMO,MAAM,SAAS,CAAC,EAAE,YAAY,YAAyB;AAC5D,QAAM,WACJ,CAAC,OACC,cAAc,WACd,WAEA,UAAU,QAAQ,UAAU,YAC5B,UAAU,QAAQ,UAAU,YACxB,OACN;AAGF,MAAI,CAAC,OAAO;AAEV,WACE,CAAC,MACC,kBAAkB,iBAClB,oBACA,SAAS,SACT,YACA,cAAc,YAEb,SACH,EARC;AAAA,EAUL;AAEA,QAAM,CAAC,aAAa,kBAAkB,MAAM,SAAc,IAAI;AAE9D,4BAA0B,MAAM;AA1ClC;AA2CI,mBAAe,iBAAW,aAAX,mBAAqB,IAAI;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,MAAI,aAAa;AACf,WAAO,aAAa,UAAU,WAAW;AAAA,EAC3C;AAGA,SAAO;AACT;",
+  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport '@tamagui/polyfill-dev'\n\nimport { isWeb, useIsomorphicLayoutEffect } from '@tamagui/core'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nexport type PortalProps = YStackProps & {\n  host?: any // element\n}\n\nexport const Portal = ({ host = globalThis.document?.body, ...props }: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      // @ts-expect-error ok on web\n      position={isWeb ? 'fixed' : 'absolute'}\n      maxWidth={isWeb ? '100vw' : '100%'}\n      {...props}\n    />\n  )\n\n  const [hostElement, setHostElement] = React.useState<any>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    setHostElement(host)\n  }, [host])\n\n  if (hostElement) {\n    return createPortal(contents, hostElement)\n  }\n\n  // ssr return null\n  return null\n}\n"],
+  "mappings": "AACA;AAEA;AACA;AACA;AACA;AAMO,MAAM,SAAS,CAAC,EAAE,OAAO,0BAAW,aAAX,mBAAqB,YAAS,YAAyB;AACrF,QAAM,WACJ,CAAC,OACC,cAAc,WACd,WAEA,UAAU,QAAQ,UAAU,YAC5B,UAAU,QAAQ,UAAU,YACxB,OACN;AAGF,QAAM,CAAC,aAAa,kBAAkB,MAAM,SAAc,IAAI;AAE9D,4BAA0B,MAAM;AAC9B,mBAAe,IAAI;AAAA,EACrB,GAAG,CAAC,IAAI,CAAC;AAET,MAAI,aAAa;AACf,WAAO,aAAa,UAAU,WAAW;AAAA,EAC3C;AAGA,SAAO;AACT;",
   "names": []
 }

package/dist/jsx/Portal.native.js

@@ -0,0 +1,21 @@
+import { YStack } from "@tamagui/stacks";
+import { AppRegistry } from "react-native";
+import { createPortal } from "react-native/Libraries/Renderer/shims/ReactNative";
+let root = 0;
+const og = AppRegistry.runApplication.bind(AppRegistry);
+AppRegistry.runApplication = function(...args) {
+  var _a;
+  root = (_a = args[1]) == null ? void 0 : _a.rootTag;
+  return og(...args);
+};
+const Portal = (props) => {
+  const contents = <YStack pointerEvents="box-none" fullscreen position="absolute" maxWidth="100%" zIndex={1e5} {...props} />;
+  if (root) {
+    return createPortal(contents, root);
+  }
+  return null;
+};
+export {
+  Portal
+};
+//# sourceMappingURL=Portal.native.js.map

package/dist/jsx/Portal.native.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/Portal.native.tsx"],
+  "sourcesContent": ["import { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { AppRegistry } from 'react-native'\nimport { createPortal } from 'react-native/Libraries/Renderer/shims/ReactNative'\n\nexport type PortalProps = YStackProps\n\nlet root = 0\nconst og = AppRegistry.runApplication.bind(AppRegistry)\nAppRegistry.runApplication = function (...args) {\n  root = args[1]?.rootTag\n  return og(...args)\n}\n\nexport const Portal = (props: PortalProps) => {\n  const contents = (\n    <YStack\n      pointerEvents=\"box-none\"\n      fullscreen\n      position=\"absolute\"\n      maxWidth=\"100%\"\n      zIndex={100000}\n      {...props}\n    />\n  )\n\n  if (root) {\n    return createPortal(contents, root)\n  }\n\n  return null\n}\n"],
+  "mappings": "AAAA;AAEA;AACA;AAIA,IAAI,OAAO;AACX,MAAM,KAAK,YAAY,eAAe,KAAK,WAAW;AACtD,YAAY,iBAAiB,YAAa,MAAM;AAThD;AAUE,SAAO,WAAK,OAAL,mBAAS;AAChB,SAAO,GAAG,GAAG,IAAI;AACnB;AAEO,MAAM,SAAS,CAAC,UAAuB;AAC5C,QAAM,WACJ,CAAC,OACC,cAAc,WACd,WACA,SAAS,WACT,SAAS,OACT,QAAQ,SACJ,OACN;AAGF,MAAI,MAAM;AACR,WAAO,aAAa,UAAU,IAAI;AAAA,EACpC;AAEA,SAAO;AACT;",
+  "names": []
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/portal",
-  "version": "1.0.1-beta.112",
+  "version": "1.0.1-beta.113",
   "source": "src/index.ts",
   "types": "./types/index.d.ts",
   "main": "dist/cjs",
@@ -18,8 +18,8 @@
     "clean:build": "tamagui-build clean:build"
   },
   "dependencies": {
-    "@tamagui/core": "^1.0.1-beta.112",
-    "@tamagui/stacks": "^1.0.1-beta.112"
+    "@tamagui/core": "^1.0.1-beta.113",
+    "@tamagui/stacks": "^1.0.1-beta.113"
   },
   "peerDependencies": {
     "react": "*",
@@ -27,7 +27,7 @@
     "react-native": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.0.1-beta.112",
+    "@tamagui/build": "^1.0.1-beta.113",
     "@types/react-native": "^0.69.2",
     "react": "*",
     "react-dom": "*",

package/src/Portal.native.tsx

@@ -0,0 +1,32 @@
+import { YStack, YStackProps } from '@tamagui/stacks'
+import * as React from 'react'
+import { AppRegistry } from 'react-native'
+import { createPortal } from 'react-native/Libraries/Renderer/shims/ReactNative'
+
+export type PortalProps = YStackProps
+
+let root = 0
+const og = AppRegistry.runApplication.bind(AppRegistry)
+AppRegistry.runApplication = function (...args) {
+  root = args[1]?.rootTag
+  return og(...args)
+}
+
+export const Portal = (props: PortalProps) => {
+  const contents = (
+    <YStack
+      pointerEvents="box-none"
+      fullscreen
+      position="absolute"
+      maxWidth="100%"
+      zIndex={100000}
+      {...props}
+    />
+  )
+
+  if (root) {
+    return createPortal(contents, root)
+  }
+
+  return null
+}

package/src/Portal.tsx

@@ -5,13 +5,12 @@ import { isWeb, useIsomorphicLayoutEffect } from '@tamagui/core'
 import { YStack, YStackProps } from '@tamagui/stacks'
 import * as React from 'react'
 import { createPortal } from 'react-dom'
-import { Modal } from 'react-native'
 
 export type PortalProps = YStackProps & {
-  visible?: boolean
+  host?: any // element
 }
 
-export const Portal = ({ visible, ...props }: PortalProps) => {
+export const Portal = ({ host = globalThis.document?.body, ...props }: PortalProps) => {
   const contents = (
     <YStack
       pointerEvents="box-none"
@@ -23,26 +22,11 @@ export const Portal = ({ visible, ...props }: PortalProps) => {
     />
   )
 
-  if (!isWeb) {
-    // check if theme stays in context here
-    return (
-      <Modal
-        presentationStyle="overFullScreen"
-        hardwareAccelerated
-        visible={visible}
-        transparent
-        pointerEvents="box-none"
-      >
-        {contents}
-      </Modal>
-    )
-  }
-
   const [hostElement, setHostElement] = React.useState<any>(null)
 
   useIsomorphicLayoutEffect(() => {
-    setHostElement(globalThis.document?.body)
-  }, [])
+    setHostElement(host)
+  }, [host])
 
   if (hostElement) {
     return createPortal(contents, hostElement)

package/types/Portal.d.ts

@@ -1,7 +1,8 @@
 import '@tamagui/polyfill-dev';
 import { YStackProps } from '@tamagui/stacks';
+import * as React from 'react';
 export declare type PortalProps = YStackProps & {
-    visible?: boolean;
+    host?: any;
 };
-export declare const Portal: ({ visible, ...props }: PortalProps) => JSX.Element | null;
+export declare const Portal: ({ host, ...props }: PortalProps) => React.ReactPortal | null;
 //# sourceMappingURL=Portal.d.ts.map

package/types/Portal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Portal.d.ts","sourceRoot":"","sources":["../src/Portal.tsx"],"names":[],"mappings":"AACA,OAAO,uBAAuB,CAAA;AAG9B,OAAO,EAAU,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAKrD,oBAAY,WAAW,GAAG,WAAW,GAAG;IACtC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,eAAO,MAAM,MAAM,0BAA2B,WAAW,uBAuCxD,CAAA"}
+{"version":3,"file":"Portal.d.ts","sourceRoot":"","sources":["../src/Portal.tsx"],"names":[],"mappings":"AACA,OAAO,uBAAuB,CAAA;AAG9B,OAAO,EAAU,WAAW,EAAE,MAAM,iBAAiB,CAAA;AACrD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,oBAAY,WAAW,GAAG,WAAW,GAAG;IACtC,IAAI,CAAC,EAAE,GAAG,CAAA;CACX,CAAA;AAED,eAAO,MAAM,MAAM,uBAAoD,WAAW,6BAwBjF,CAAA"}

package/types/Portal.native.d.ts

@@ -0,0 +1,4 @@
+import { YStackProps } from '@tamagui/stacks';
+export declare type PortalProps = YStackProps;
+export declare const Portal: (props: PortalProps) => any;
+//# sourceMappingURL=Portal.native.d.ts.map

package/types/Portal.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Portal.native.d.ts","sourceRoot":"","sources":["../src/Portal.native.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAKrD,oBAAY,WAAW,GAAG,WAAW,CAAA;AASrC,eAAO,MAAM,MAAM,UAAW,WAAW,QAiBxC,CAAA"}