@radix-ui/react-portal - npm Package Compare versions

Comparing version 0.1.5-rc.2 to 0.1.5-rc.3

dist/index.js

@@ -1,2 +0,96 @@
-var e,t,r=require("@radix-ui/react-primitive").Primitive,o=require("@radix-ui/react-use-layout-effect").useLayoutEffect,l=n(require("react-dom")),i=(e={},t=require("react"),Object.keys(t).forEach((function(r){"default"!==r&&"__esModule"!==r&&Object.defineProperty(e,r,{enumerable:!0,get:function(){return t[r]}})})),e),a=n(require("@babel/runtime/helpers/extends"));function n(e){return e&&e.__esModule?e.default:e}const u=/*#__PURE__*/i.forwardRef(((e,t)=>{var n,u;const{containerRef:d,style:c,...s}=e,f=null!==(n=null==d?void 0:d.current)&&void 0!==n?n:null===globalThis||void 0===globalThis||null===(u=globalThis.document)||void 0===u?void 0:u.body,[,b]=i.useState({});return o((()=>{b({})}),[]),f?/*#__PURE__*/l.createPortal(/*#__PURE__*/i.createElement(r.div,a({"data-radix-portal":""},s,{ref:t,style:f===document.body?{position:"absolute",top:0,left:0,zIndex:2147483647,...c}:void 0})),f):null}));exports.Portal=u;const d=/*#__PURE__*/i.forwardRef(((e,t)=>{var o;const{container:n=(null===globalThis||void 0===globalThis||null===(o=globalThis.document)||void 0===o?void 0:o.body),...u}=e;return n?/*#__PURE__*/l.createPortal(/*#__PURE__*/i.createElement(r.div,a({},u,{ref:t})),n):null}));exports.UnstablePortal=d;const c=u;exports.Root=c;
+var $amzHf$babelruntimehelpersextends = require("@babel/runtime/helpers/extends");
+var $amzHf$react = require("react");
+var $amzHf$reactdom = require("react-dom");
+var $amzHf$radixuireactuselayouteffect = require("@radix-ui/react-use-layout-effect");
+var $amzHf$radixuireactprimitive = require("@radix-ui/react-primitive");
+
+function $parcel$exportWildcard(dest, source) {
+  Object.keys(source).forEach(function(key) {
+    if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
+      return;
+    }
+
+    Object.defineProperty(dest, key, {
+      enumerable: true,
+      get: function get() {
+        return source[key];
+      }
+    });
+  });
+
+  return dest;
+}
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+var $913a70b877676c16$exports = {};
+
+$parcel$export($913a70b877676c16$exports, "Portal", () => $913a70b877676c16$export$602eac185826482c);
+$parcel$export($913a70b877676c16$exports, "UnstablePortal", () => $913a70b877676c16$export$aa829b6eed785496);
+$parcel$export($913a70b877676c16$exports, "Root", () => $913a70b877676c16$export$be92b6f5f03c0fe9);
+
+
+
+
+
+const $913a70b877676c16$var$MAX_Z_INDEX = 2147483647;
+/* -------------------------------------------------------------------------------------------------
+ * Portal
+ * -----------------------------------------------------------------------------------------------*/ const $913a70b877676c16$var$PORTAL_NAME = 'Portal';
+const $913a70b877676c16$export$602eac185826482c = /*#__PURE__*/ $amzHf$react.forwardRef((props, forwardedRef)=>{
+    var _containerRef$current, _globalThis$document;
+    const { containerRef: containerRef , style: style , ...portalProps } = props;
+    const hostElement = (_containerRef$current = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) !== null && _containerRef$current !== void 0 ? _containerRef$current : globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document = globalThis.document) === null || _globalThis$document === void 0 ? void 0 : _globalThis$document.body;
+    const [, forceUpdate] = $amzHf$react.useState({});
+    /**
+   * containerRef.current won't be set on first render, so we force a re-render.
+   * Because we do this in `useLayoutEffect`, we still avoid a flash.
+   */ $amzHf$radixuireactuselayouteffect.useLayoutEffect(()=>{
+        forceUpdate({});
+    }, []);
+    if (hostElement) return /*#__PURE__*/ ($parcel$interopDefault($amzHf$reactdom)).createPortal(/*#__PURE__*/ $amzHf$react.createElement($amzHf$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($amzHf$babelruntimehelpersextends))({
+        "data-radix-portal": ""
+    }, portalProps, {
+        ref: forwardedRef,
+        style: /**
+       * If the Portal is injected in `body`, we assume we want whatever is portalled
+       * to appear on top of everything. Ideally this would be handled by making sure the
+       * app root creates a new stacking context, however this is quite hard to automate.
+       * For this reason, we have opted for setting the max z-index on the portal itself.
+       */ hostElement === document.body ? {
+            position: 'absolute',
+            top: 0,
+            left: 0,
+            zIndex: $913a70b877676c16$var$MAX_Z_INDEX,
+            ...style
+        } : undefined
+    })), hostElement);
+     // bail out of ssr
+    return null;
+});
+/*#__PURE__*/ Object.assign($913a70b877676c16$export$602eac185826482c, {
+    displayName: $913a70b877676c16$var$PORTAL_NAME
+});
+/* -------------------------------------------------------------------------------------------------
+ * UnstablePortal
+ * -----------------------------------------------------------------------------------------------*/ const $913a70b877676c16$var$UNSTABLE_PORTAL_NAME = 'Portal';
+const $913a70b877676c16$export$aa829b6eed785496 = /*#__PURE__*/ $amzHf$react.forwardRef((props, forwardedRef)=>{
+    var _globalThis$document2;
+    const { container: container = globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document2 = globalThis.document) === null || _globalThis$document2 === void 0 ? void 0 : _globalThis$document2.body , ...portalProps } = props;
+    return container ? /*#__PURE__*/ ($parcel$interopDefault($amzHf$reactdom)).createPortal(/*#__PURE__*/ $amzHf$react.createElement($amzHf$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($amzHf$babelruntimehelpersextends))({}, portalProps, {
+        ref: forwardedRef
+    })), container) : null;
+});
+/*#__PURE__*/ Object.assign($913a70b877676c16$export$aa829b6eed785496, {
+    displayName: $913a70b877676c16$var$UNSTABLE_PORTAL_NAME
+});
+/* -----------------------------------------------------------------------------------------------*/ const $913a70b877676c16$export$be92b6f5f03c0fe9 = $913a70b877676c16$export$602eac185826482c;
+
+
+$parcel$exportWildcard(module.exports, $913a70b877676c16$exports);
+
+
 //# sourceMappingURL=index.js.map

dist/index.module.js

@@ -1,2 +0,77 @@
-import{Primitive as o}from"@radix-ui/react-primitive";import{useLayoutEffect as t}from"@radix-ui/react-use-layout-effect";import e from"react-dom";import*as r from"react";import l from"@babel/runtime/helpers/esm/extends";export const Portal=/*#__PURE__*/r.forwardRef(((a,i)=>{var n,d;const{containerRef:s,style:u,...c}=a,m=null!==(n=null==s?void 0:s.current)&&void 0!==n?n:null===globalThis||void 0===globalThis||null===(d=globalThis.document)||void 0===d?void 0:d.body,[,f]=r.useState({});return t((()=>{f({})}),[]),m?/*#__PURE__*/e.createPortal(/*#__PURE__*/r.createElement(o.div,l({"data-radix-portal":""},c,{ref:i,style:m===document.body?{position:"absolute",top:0,left:0,zIndex:2147483647,...u}:void 0})),m):null}));/*#__PURE__*/export const UnstablePortal=/*#__PURE__*/r.forwardRef(((t,a)=>{var i;const{container:n=(null===globalThis||void 0===globalThis||null===(i=globalThis.document)||void 0===i?void 0:i.body),...d}=t;return n?/*#__PURE__*/e.createPortal(/*#__PURE__*/r.createElement(o.div,l({},d,{ref:a})),n):null}));/*#__PURE__*/export const Root=Portal;
+import $7SXl2$babelruntimehelpersesmextends from "@babel/runtime/helpers/esm/extends";
+import {forwardRef as $7SXl2$forwardRef, useState as $7SXl2$useState, createElement as $7SXl2$createElement} from "react";
+import $7SXl2$reactdom from "react-dom";
+import {useLayoutEffect as $7SXl2$useLayoutEffect} from "@radix-ui/react-use-layout-effect";
+import {Primitive as $7SXl2$Primitive} from "@radix-ui/react-primitive";
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+var $f1701beae083dbae$exports = {};
+
+$parcel$export($f1701beae083dbae$exports, "Portal", () => $f1701beae083dbae$export$602eac185826482c);
+$parcel$export($f1701beae083dbae$exports, "UnstablePortal", () => $f1701beae083dbae$export$aa829b6eed785496);
+$parcel$export($f1701beae083dbae$exports, "Root", () => $f1701beae083dbae$export$be92b6f5f03c0fe9);
+
+
+
+
+
+const $f1701beae083dbae$var$MAX_Z_INDEX = 2147483647;
+/* -------------------------------------------------------------------------------------------------
+ * Portal
+ * -----------------------------------------------------------------------------------------------*/ const $f1701beae083dbae$var$PORTAL_NAME = 'Portal';
+const $f1701beae083dbae$export$602eac185826482c = /*#__PURE__*/ $7SXl2$forwardRef((props, forwardedRef)=>{
+    var _containerRef$current, _globalThis$document;
+    const { containerRef: containerRef , style: style , ...portalProps } = props;
+    const hostElement = (_containerRef$current = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) !== null && _containerRef$current !== void 0 ? _containerRef$current : globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document = globalThis.document) === null || _globalThis$document === void 0 ? void 0 : _globalThis$document.body;
+    const [, forceUpdate] = $7SXl2$useState({});
+    /**
+   * containerRef.current won't be set on first render, so we force a re-render.
+   * Because we do this in `useLayoutEffect`, we still avoid a flash.
+   */ $7SXl2$useLayoutEffect(()=>{
+        forceUpdate({});
+    }, []);
+    if (hostElement) return /*#__PURE__*/ $7SXl2$reactdom.createPortal(/*#__PURE__*/ $7SXl2$createElement($7SXl2$Primitive.div, $7SXl2$babelruntimehelpersesmextends({
+        "data-radix-portal": ""
+    }, portalProps, {
+        ref: forwardedRef,
+        style: /**
+       * If the Portal is injected in `body`, we assume we want whatever is portalled
+       * to appear on top of everything. Ideally this would be handled by making sure the
+       * app root creates a new stacking context, however this is quite hard to automate.
+       * For this reason, we have opted for setting the max z-index on the portal itself.
+       */ hostElement === document.body ? {
+            position: 'absolute',
+            top: 0,
+            left: 0,
+            zIndex: $f1701beae083dbae$var$MAX_Z_INDEX,
+            ...style
+        } : undefined
+    })), hostElement);
+     // bail out of ssr
+    return null;
+});
+/*#__PURE__*/ Object.assign($f1701beae083dbae$export$602eac185826482c, {
+    displayName: $f1701beae083dbae$var$PORTAL_NAME
+});
+/* -------------------------------------------------------------------------------------------------
+ * UnstablePortal
+ * -----------------------------------------------------------------------------------------------*/ const $f1701beae083dbae$var$UNSTABLE_PORTAL_NAME = 'Portal';
+const $f1701beae083dbae$export$aa829b6eed785496 = /*#__PURE__*/ $7SXl2$forwardRef((props, forwardedRef)=>{
+    var _globalThis$document2;
+    const { container: container = globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document2 = globalThis.document) === null || _globalThis$document2 === void 0 ? void 0 : _globalThis$document2.body , ...portalProps } = props;
+    return container ? /*#__PURE__*/ $7SXl2$reactdom.createPortal(/*#__PURE__*/ $7SXl2$createElement($7SXl2$Primitive.div, $7SXl2$babelruntimehelpersesmextends({}, portalProps, {
+        ref: forwardedRef
+    })), container) : null;
+});
+/*#__PURE__*/ Object.assign($f1701beae083dbae$export$aa829b6eed785496, {
+    displayName: $f1701beae083dbae$var$UNSTABLE_PORTAL_NAME
+});
+/* -----------------------------------------------------------------------------------------------*/ const $f1701beae083dbae$export$be92b6f5f03c0fe9 = $f1701beae083dbae$export$602eac185826482c;
+
+
+
+
+export {$f1701beae083dbae$export$602eac185826482c as Portal, $f1701beae083dbae$export$aa829b6eed785496 as UnstablePortal, $f1701beae083dbae$export$be92b6f5f03c0fe9 as Root};
 //# sourceMappingURL=index.module.js.map

package.json

 {
   "name": "@radix-ui/react-portal",
-  "version": "0.1.5-rc.2",
+  "version": "0.1.5-rc.3",
   "license": "MIT",
@@ -20,4 +20,4 @@ "source": "src/index.ts",
     "@babel/runtime": "^7.13.10",
-    "@radix-ui/react-primitive": "0.1.5-rc.2",
-    "@radix-ui/react-use-layout-effect": "0.1.1-rc.2"
+    "@radix-ui/react-primitive": "0.1.5-rc.3",
+    "@radix-ui/react-use-layout-effect": "0.1.1-rc.3"
   },
@@ -24,0 +24,0 @@ "peerDependencies": {

Fixed alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

24150

increased by53.88%

Lines of code

165

increased by534.62%

Number of low quality alerts

1

decreased by-50%

Dependency changes

• + Added@radix-ui/react-compose-refs@0.1.1-rc.3(transitive)

• + Added@radix-ui/react-primitive@0.1.5-rc.3(transitive)

• + Added@radix-ui/react-slot@0.1.3-rc.3(transitive)

• + Added@radix-ui/react-use-layout-effect@0.1.1-rc.3(transitive)

• - Removed@radix-ui/react-compose-refs@0.1.1-rc.2(transitive)

• - Removed@radix-ui/react-primitive@0.1.5-rc.2(transitive)

• - Removed@radix-ui/react-slot@0.1.3-rc.2(transitive)

• - Removed@radix-ui/react-use-layout-effect@0.1.1-rc.2(transitive)

• Updated@radix-ui/react-primitive@0.1.5-rc.3

• Updated@radix-ui/react-use-layout-effect@0.1.1-rc.3