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

Comparing version 0.0.14 to 0.0.15

dist/index.d.ts

@@ -7,4 +7,9 @@ import * as React from "react";
 import { Measurable } from "@radix-ui/rect";
-type PopperOwnProps = Polymorphic.Merge<Polymorphic.OwnProps<typeof Primitive>, {
-    anchorRef: React.RefObject<Measurable>;
+export const Popper: React.FC;
+type PopperAnchorOwnProps = Polymorphic.Merge<Polymorphic.OwnProps<typeof Primitive>, {
+    virtualRef?: React.RefObject<Measurable>;
+}>;
+type PopperAnchorPrimitive = Polymorphic.ForwardRefComponent<Polymorphic.IntrinsicElement<typeof Primitive>, PopperAnchorOwnProps>;
+export const PopperAnchor: PopperAnchorPrimitive;
+type PopperContentOwnProps = Polymorphic.Merge<Polymorphic.OwnProps<typeof Primitive>, {
     side?: Side;
@@ -17,4 +22,4 @@ sideOffset?: number;
 }>;
-type PopperPrimitive = Polymorphic.ForwardRefComponent<Polymorphic.IntrinsicElement<typeof Primitive>, PopperOwnProps>;
-export const Popper: PopperPrimitive;
+type PopperContentPrimitive = Polymorphic.ForwardRefComponent<Polymorphic.IntrinsicElement<typeof Primitive>, PopperContentOwnProps>;
+export const PopperContent: PopperContentPrimitive;
 type PopperArrowOwnProps = Polymorphic.Merge<Polymorphic.OwnProps<typeof ArrowPrimitive.Root>, {
@@ -25,5 +30,7 @@ offset?: number;
 export const PopperArrow: PopperArrowPrimitive;
-export const Root: PopperPrimitive;
+export const Root: React.FC<{}>;
+export const Anchor: PopperAnchorPrimitive;
+export const Content: PopperContentPrimitive;
 export const Arrow: PopperArrowPrimitive;
 
 //# sourceMappingURL=index.d.ts.map

dist/index.js

@@ -1,2 +0,2 @@
-var e,r=u({},require("@radix-ui/react-arrow")),t=require("@radix-ui/react-primitive").Primitive,i=require("@radix-ui/react-use-size").useSize,o=require("@radix-ui/react-use-rect").useRect,n=require("@radix-ui/react-context").createContext,s=require("@radix-ui/react-compose-refs").useComposedRefs,a=require("@radix-ui/popper").getPlacementData,l=u({},require("react")),c=(e=require("@babel/runtime/helpers/extends"))&&e.__esModule?e.default:e;function u(e,r){return Object.keys(r).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return r[t]}})})),e}const[d,f]=n("Popper"),p=/*#__PURE__*/l.forwardRef(((e,r)=>{const{anchorRef:n,side:u="bottom",sideOffset:f,align:p="center",alignOffset:w,collisionTolerance:m,avoidCollisions:v=!0,...x}=e,[y,R]=l.useState(),g=o(n),E=l.useRef(null),h=i(E),O=l.useRef(null),S=i(O),q=s(r,E),b=function(){const[e,r]=l.useState(void 0);return l.useEffect((()=>{let e;function t(){r({width:window.innerWidth,height:window.innerHeight})}function i(){window.clearTimeout(e),e=window.setTimeout(t,100)}return t(),window.addEventListener("resize",i),()=>window.removeEventListener("resize",i)}),[]),e}(),A=b?DOMRect.fromRect({...b,x:0,y:0}):void 0,{popperStyles:P,arrowStyles:z,placedSide:C,placedAlign:T}=a({anchorRect:g,popperSize:h,arrowSize:S,arrowOffset:y,side:u,sideOffset:f,align:p,alignOffset:w,shouldAvoidCollisions:v,collisionBoundariesRect:A,collisionTolerance:m}),_=void 0!==C;/*#__PURE__*/return l.createElement("div",{style:P,"data-radix-popper-wrapper":""},/*#__PURE__*/l.createElement(d,{arrowRef:O,arrowStyles:z,onArrowOffsetChange:R},/*#__PURE__*/l.createElement(t,c({"data-side":C,"data-align":T},x,{style:{...x.style,animation:_?void 0:"none"},ref:q}))))}));exports.Popper=p;const w=/*#__PURE__*/l.forwardRef((function(e,t){const{offset:i,...o}=e,n=f("PopperArrow"),{onArrowOffsetChange:s}=n;return l.useEffect((()=>s(i)),[s,i]),/*#__PURE__*/l.createElement("span",{style:{...n.arrowStyles,pointerEvents:"none"}},/*#__PURE__*/l.createElement("span",{ref:n.arrowRef,style:{display:"inline-block",verticalAlign:"top",pointerEvents:"auto"}},/*#__PURE__*/l.createElement(r.Root,c({},o,{ref:t,style:{...o.style,display:"block"}}))))}));exports.PopperArrow=w;const m=p;exports.Root=m;const v=w;exports.Arrow=v;
+var e,r=u({},require("@radix-ui/react-arrow")),t=require("@radix-ui/react-primitive").Primitive,n=require("@radix-ui/react-use-size").useSize,o=require("@radix-ui/react-use-rect").useRect,i=require("@radix-ui/react-context").createContext,s=require("@radix-ui/react-compose-refs").useComposedRefs,a=require("@radix-ui/popper").getPlacementData,c=u({},require("react")),l=(e=require("@babel/runtime/helpers/extends"))&&e.__esModule?e.default:e;function u(e,r){return Object.keys(r).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return r[t]}})})),e}const[p,d]=i("Popper"),f=({children:e})=>{const[r,t]=c.useState(null);/*#__PURE__*/return c.createElement(p,{anchor:r,onAnchorChange:t},e)};exports.Popper=f;const w=/*#__PURE__*/c.forwardRef(((e,r)=>{const{virtualRef:n,children:o,...i}=e,a=d("PopperAnchor"),u=c.useRef(null),p=s(r,u);return c.useEffect((()=>{a.onAnchorChange((null==n?void 0:n.current)||u.current)})),n?null:/*#__PURE__*/c.createElement(t,l({},i,{ref:p}),o)}));exports.PopperAnchor=w;const[h,m]=i("PopperContent"),x=/*#__PURE__*/c.forwardRef(((e,r)=>{const{side:i="bottom",sideOffset:u,align:p="center",alignOffset:f,collisionTolerance:w,avoidCollisions:m=!0,...x}=e,v=d("PopperContent"),[g,y]=c.useState(),E=o(v.anchor),[A,C]=c.useState(null),R=n(A),[S,P]=c.useState(null),O=n(S),q=s(r,(e=>C(e))),b=function(){const[e,r]=c.useState(void 0);return c.useEffect((()=>{let e;function t(){r({width:window.innerWidth,height:window.innerHeight})}function n(){window.clearTimeout(e),e=window.setTimeout(t,100)}return t(),window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)}),[]),e}(),z=b?DOMRect.fromRect({...b,x:0,y:0}):void 0,{popperStyles:T,arrowStyles:_,placedSide:k,placedAlign:M}=a({anchorRect:E,popperSize:R,arrowSize:O,arrowOffset:g,side:i,sideOffset:u,align:p,alignOffset:f,shouldAvoidCollisions:m,collisionBoundariesRect:z,collisionTolerance:w}),j=void 0!==k;/*#__PURE__*/return c.createElement("div",{style:T,"data-radix-popper-content-wrapper":""},/*#__PURE__*/c.createElement(h,{arrowStyles:_,onArrowChange:P,onArrowOffsetChange:y},/*#__PURE__*/c.createElement(t,l({"data-side":k,"data-align":M},x,{style:{...x.style,animation:j?void 0:"none"},ref:q}))))}));exports.PopperContent=x;const v=/*#__PURE__*/c.forwardRef((function(e,t){const{offset:n,...o}=e,i=m("PopperArrow"),{onArrowOffsetChange:s}=i;return c.useEffect((()=>s(n)),[s,n]),/*#__PURE__*/c.createElement("span",{style:{...i.arrowStyles,pointerEvents:"none"}},/*#__PURE__*/c.createElement("span",{ref:i.onArrowChange,style:{display:"inline-block",verticalAlign:"top",pointerEvents:"auto"}},/*#__PURE__*/c.createElement(r.Root,l({},o,{ref:t,style:{...o.style,display:"block"}}))))}));exports.PopperArrow=v;const g=f;exports.Root=g;const y=w;exports.Anchor=y;const E=x;exports.Content=E;const A=v;exports.Arrow=A;
 //# sourceMappingURL=index.js.map

dist/index.module.js

@@ -1,2 +0,2 @@
-import*as e from"@radix-ui/react-arrow";import{Primitive as r}from"@radix-ui/react-primitive";import{useSize as o}from"@radix-ui/react-use-size";import{useRect as t}from"@radix-ui/react-use-rect";import{createContext as i}from"@radix-ui/react-context";import{useComposedRefs as n}from"@radix-ui/react-compose-refs";import{getPlacementData as a}from"@radix-ui/popper";import*as s from"react";import l from"@babel/runtime/helpers/esm/extends";const[p,c]=i("Popper");export const Popper=/*#__PURE__*/s.forwardRef(((e,i)=>{const{anchorRef:c,side:f="bottom",sideOffset:d,align:m="center",alignOffset:u,collisionTolerance:w,avoidCollisions:x=!0,...v}=e,[y,R]=s.useState(),E=t(c),g=s.useRef(null),h=o(g),A=s.useRef(null),S=o(A),O=n(i,g),P=function(){const[e,r]=s.useState(void 0);return s.useEffect((()=>{let e;function o(){r({width:window.innerWidth,height:window.innerHeight})}function t(){window.clearTimeout(e),e=window.setTimeout(o,100)}return o(),window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)}),[]),e}(),b=P?DOMRect.fromRect({...P,x:0,y:0}):void 0,{popperStyles:z,arrowStyles:C,placedSide:T,placedAlign:k}=a({anchorRect:E,popperSize:h,arrowSize:S,arrowOffset:y,side:f,sideOffset:d,align:m,alignOffset:u,shouldAvoidCollisions:x,collisionBoundariesRect:b,collisionTolerance:w}),L=void 0!==T;/*#__PURE__*/return s.createElement("div",{style:z,"data-radix-popper-wrapper":""},/*#__PURE__*/s.createElement(p,{arrowRef:A,arrowStyles:C,onArrowOffsetChange:R},/*#__PURE__*/s.createElement(r,l({"data-side":T,"data-align":k},v,{style:{...v.style,animation:L?void 0:"none"},ref:O}))))}));/*#__PURE__*/export const PopperArrow=/*#__PURE__*/s.forwardRef((function(r,o){const{offset:t,...i}=r,n=c("PopperArrow"),{onArrowOffsetChange:a}=n;return s.useEffect((()=>a(t)),[a,t]),/*#__PURE__*/s.createElement("span",{style:{...n.arrowStyles,pointerEvents:"none"}},/*#__PURE__*/s.createElement("span",{ref:n.arrowRef,style:{display:"inline-block",verticalAlign:"top",pointerEvents:"auto"}},/*#__PURE__*/s.createElement(e.Root,l({},i,{ref:o,style:{...i.style,display:"block"}}))))}));/*#__PURE__*/export const Root=Popper;export const Arrow=PopperArrow;
+import*as e from"@radix-ui/react-arrow";import{Primitive as r}from"@radix-ui/react-primitive";import{useSize as o}from"@radix-ui/react-use-size";import{useRect as t}from"@radix-ui/react-use-rect";import{createContext as n}from"@radix-ui/react-context";import{useComposedRefs as i}from"@radix-ui/react-compose-refs";import{getPlacementData as a}from"@radix-ui/popper";import*as s from"react";import c from"@babel/runtime/helpers/esm/extends";const[p,l]=n("Popper");export const Popper=({children:e})=>{const[r,o]=s.useState(null);/*#__PURE__*/return s.createElement(p,{anchor:r,onAnchorChange:o},e)};/*#__PURE__*/export const PopperAnchor=/*#__PURE__*/s.forwardRef(((e,o)=>{const{virtualRef:t,children:n,...a}=e,p=l("PopperAnchor"),f=s.useRef(null),d=i(o,f);return s.useEffect((()=>{p.onAnchorChange((null==t?void 0:t.current)||f.current)})),t?null:/*#__PURE__*/s.createElement(r,c({},a,{ref:d}),n)}));/*#__PURE__*/const[f,d]=n("PopperContent");export const PopperContent=/*#__PURE__*/s.forwardRef(((e,n)=>{const{side:p="bottom",sideOffset:d,align:u="center",alignOffset:m,collisionTolerance:w,avoidCollisions:h=!0,...x}=e,A=l("PopperContent"),[v,g]=s.useState(),E=t(A.anchor),[y,C]=s.useState(null),P=o(y),[S,R]=s.useState(null),O=o(S),b=i(n,(e=>C(e))),z=function(){const[e,r]=s.useState(void 0);return s.useEffect((()=>{let e;function o(){r({width:window.innerWidth,height:window.innerHeight})}function t(){window.clearTimeout(e),e=window.setTimeout(o,100)}return o(),window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)}),[]),e}(),T=z?DOMRect.fromRect({...z,x:0,y:0}):void 0,{popperStyles:k,arrowStyles:L,placedSide:B,placedAlign:D}=a({anchorRect:E,popperSize:P,arrowSize:O,arrowOffset:v,side:p,sideOffset:d,align:u,alignOffset:m,shouldAvoidCollisions:h,collisionBoundariesRect:T,collisionTolerance:w}),H=void 0!==B;/*#__PURE__*/return s.createElement("div",{style:k,"data-radix-popper-content-wrapper":""},/*#__PURE__*/s.createElement(f,{arrowStyles:L,onArrowChange:R,onArrowOffsetChange:g},/*#__PURE__*/s.createElement(r,c({"data-side":B,"data-align":D},x,{style:{...x.style,animation:H?void 0:"none"},ref:b}))))}));/*#__PURE__*/export const PopperArrow=/*#__PURE__*/s.forwardRef((function(r,o){const{offset:t,...n}=r,i=d("PopperArrow"),{onArrowOffsetChange:a}=i;return s.useEffect((()=>a(t)),[a,t]),/*#__PURE__*/s.createElement("span",{style:{...i.arrowStyles,pointerEvents:"none"}},/*#__PURE__*/s.createElement("span",{ref:i.onArrowChange,style:{display:"inline-block",verticalAlign:"top",pointerEvents:"auto"}},/*#__PURE__*/s.createElement(e.Root,c({},n,{ref:o,style:{...n.style,display:"block"}}))))}));/*#__PURE__*/export const Root=Popper;export const Anchor=PopperAnchor;export const Content=PopperContent;export const Arrow=PopperArrow;
 //# sourceMappingURL=index.module.js.map

package.json

 {
   "name": "@radix-ui/react-popper",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "license": "MIT",
@@ -22,9 +22,9 @@ "source": "src/index.ts",
     "@radix-ui/popper": "0.0.10",
-    "@radix-ui/react-arrow": "0.0.11",
+    "@radix-ui/react-arrow": "0.0.12",
     "@radix-ui/react-compose-refs": "0.0.5",
     "@radix-ui/react-context": "0.0.5",
-    "@radix-ui/react-polymorphic": "0.0.10",
-    "@radix-ui/react-primitive": "0.0.11",
-    "@radix-ui/react-use-rect": "0.0.6",
-    "@radix-ui/react-use-size": "0.0.5",
+    "@radix-ui/react-polymorphic": "0.0.11",
+    "@radix-ui/react-primitive": "0.0.12",
+    "@radix-ui/react-use-rect": "0.0.7",
+    "@radix-ui/react-use-size": "0.0.6",
     "@radix-ui/rect": "0.0.5"
@@ -31,0 +31,0 @@ },

New 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

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

36314

30.14%

Lines of code

57

26.67%

Dependency changes

• + Added

  @radix-ui/react-arrow@0.0.12
  (transitive)

• + Added

  @radix-ui/react-polymorphic@0.0.11
  (transitive)

• + Added

  @radix-ui/react-primitive@0.0.12
  (transitive)

• + Added

  @radix-ui/react-use-rect@0.0.7
  (transitive)

• + Added

  @radix-ui/react-use-size@0.0.6
  (transitive)

• - Removed

  @radix-ui/react-arrow@0.0.11
  (transitive)

• - Removed

  @radix-ui/react-polymorphic@0.0.10
  (transitive)

• - Removed

  @radix-ui/react-primitive@0.0.11
  (transitive)

• - Removed

  @radix-ui/react-use-layout-effect@0.0.5
  (transitive)

• - Removed

  @radix-ui/react-use-rect@0.0.6
  (transitive)

• - Removed

  @radix-ui/react-use-size@0.0.5
  (transitive)

• Updated

  @radix-ui/react-arrow@0.0.12

• Updated

  @radix-ui/react-polymorphic@0.0.11

• Updated

  @radix-ui/react-primitive@0.0.12

• Updated

  @radix-ui/react-use-rect@0.0.7

• Updated

  @radix-ui/react-use-size@0.0.6