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

Comparing version 0.0.17 to 0.0.18

dist/index.d.ts

@@ -6,4 +6,2 @@ import * as React from "react";
 import * as Polymorphic from "@radix-ui/react-polymorphic";
-type DismissableLayerProps = React.ComponentProps<typeof DismissableLayer>;
-type FocusScopeProps = React.ComponentProps<typeof FocusScope>;
 type DialogOwnProps = {
@@ -40,3 +38,4 @@ open?: boolean;
 export const DialogContent: DialogContentPrimitive;
-type DialogContentImplOwnProps = Polymorphic.Merge<Polymorphic.OwnProps<typeof Primitive>, {
+type FocusScopeOwnProps = Polymorphic.OwnProps<typeof FocusScope>;
+type DialogContentImplOwnProps = Polymorphic.Merge<Omit<Polymorphic.OwnProps<typeof DismissableLayer>, 'disableOutsidePointerEvents' | 'onFocusOutside' | 'onInteractOutside' | 'onDismiss'>, {
     /**
@@ -46,3 +45,3 @@ * Event handler called when auto-focusing on open.
      */
-    onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus'];
+    onOpenAutoFocus?: FocusScopeOwnProps['onMountAutoFocus'];
     /**
@@ -52,15 +51,5 @@ * Event handler called when auto-focusing on close.
      */
-    onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus'];
-    /**
-     * Event handler called when the escape key is down.
-     * Can be prevented.
-     */
-    onEscapeKeyDown?: DismissableLayerProps['onEscapeKeyDown'];
-    /**
-     * Event handler called when the a pointer event happens outside of the `Dialog`.
-     * Can be prevented.
-     */
-    onPointerDownOutside?: DismissableLayerProps['onPointerDownOutside'];
+    onCloseAutoFocus?: FocusScopeOwnProps['onUnmountAutoFocus'];
 }>;
-type DialogContentImplPrimitive = Polymorphic.ForwardRefComponent<Polymorphic.IntrinsicElement<typeof Primitive>, DialogContentImplOwnProps>;
+type DialogContentImplPrimitive = Polymorphic.ForwardRefComponent<Polymorphic.IntrinsicElement<typeof DismissableLayer>, DialogContentImplOwnProps>;
 declare const DialogContentImpl: DialogContentImplPrimitive;
@@ -67,0 +56,0 @@ declare const CLOSE_DEFAULT_TAG = "button";

dist/index.js

@@ -1,2 +0,2 @@
-var e,t,r,o=require("aria-hidden").hideOthers,n=require("react-remove-scroll").RemoveScroll,a=require("@radix-ui/react-id").useId,u=require("@radix-ui/react-focus-guards").useFocusGuards,s=require("@radix-ui/react-primitive").Primitive,c=require("@radix-ui/react-presence").Presence,i=require("@radix-ui/react-portal").Portal,l=require("@radix-ui/react-focus-scope").FocusScope,p=require("@radix-ui/react-dismissable-layer").DismissableLayer,d=require("@radix-ui/react-use-controllable-state").useControllableState,f=require("@radix-ui/react-context").createContext,C=require("@radix-ui/react-compose-refs"),g=C.useComposedRefs,m=C.composeRefs,D=require("@radix-ui/primitive").composeEventHandlers,x=(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),h=(r=require("@babel/runtime/helpers/extends"))&&r.__esModule?r.default:r;const[E,y]=f("Dialog"),v=e=>{const{children:t,open:r,defaultOpen:o,onOpenChange:n}=e,u=x.useRef(null),[s=!1,c]=d({prop:r,defaultProp:o,onChange:n});/*#__PURE__*/return x.createElement(E,{triggerRef:u,contentId:a(),open:s,onOpenChange:c},t)};exports.Dialog=v;const O="button",b=/*#__PURE__*/x.forwardRef(((e,t)=>{const{as:r=O,...o}=e,n=y("DialogTrigger"),a=g(t,n.triggerRef);/*#__PURE__*/return x.createElement(s,h({type:"button","aria-haspopup":"dialog","aria-expanded":n.open,"aria-controls":n.contentId,"data-state":M(n.open)},o,{as:r,ref:a,onClick:D(e.onClick,(()=>n.onOpenChange(!0)))}))}));exports.DialogTrigger=b;const w=/*#__PURE__*/x.forwardRef(((e,t)=>{const{forceMount:r,...o}=e,n=y("DialogOverlay");/*#__PURE__*/return x.createElement(c,{present:r||n.open},/*#__PURE__*/x.createElement(q,h({"data-state":M(n.open)},o,{ref:t})))}));exports.DialogOverlay=w;const q=/*#__PURE__*/x.forwardRef(((e,t)=>/*#__PURE__*/x.createElement(i,null,/*#__PURE__*/x.createElement(s,h({},e,{ref:t}))))),F=/*#__PURE__*/x.forwardRef(((e,t)=>{const{forceMount:r,...o}=e,n=y("DialogContent");/*#__PURE__*/return x.createElement(c,{present:r||n.open},/*#__PURE__*/x.createElement(R,h({"data-state":M(n.open)},o,{ref:t})))}));/*#__PURE__*/exports.DialogContent=F;const R=/*#__PURE__*/x.forwardRef(((e,t)=>{const{onOpenAutoFocus:r,onCloseAutoFocus:a,onEscapeKeyDown:c,onPointerDownOutside:d,...f}=e,C=y("DialogContent");u();const g=x.useRef(null);return x.useEffect((()=>{const e=g.current;if(e)return o(e)}),[]),/*#__PURE__*/x.createElement(i,null,/*#__PURE__*/x.createElement(n,null,/*#__PURE__*/x.createElement(l,{trapped:C.open,onMountAutoFocus:r,onUnmountAutoFocus:a},(e=>/*#__PURE__*/x.createElement(p,{disableOutsidePointerEvents:!0,onEscapeKeyDown:c,onPointerDownOutside:D(d,(e=>{(2===e.button||0===e.button&&!0===e.ctrlKey)&&e.preventDefault()})),onFocusOutside:e=>e.preventDefault(),onDismiss:()=>C.onOpenChange(!1)},(r=>/*#__PURE__*/x.createElement(s,h({role:"dialog","aria-modal":!0,id:C.contentId},e,f,{ref:m(t,g,e.ref),onKeyDown:D(f.onKeyDown,e.onKeyDown),style:{...r.style,...f.style},onBlurCapture:D(f.onBlurCapture,r.onBlurCapture,{checkForDefaultPrevented:!1}),onFocusCapture:D(f.onFocusCapture,r.onFocusCapture,{checkForDefaultPrevented:!1}),onMouseDownCapture:D(f.onMouseDownCapture,r.onMouseDownCapture,{checkForDefaultPrevented:!1}),onTouchStartCapture:D(f.onTouchStartCapture,r.onTouchStartCapture,{checkForDefaultPrevented:!1})}))))))))})),P="button",k=/*#__PURE__*/x.forwardRef(((e,t)=>{const{as:r=P,...o}=e,n=y("DialogClose");/*#__PURE__*/return x.createElement(s,h({type:"button"},o,{as:r,ref:t,onClick:D(e.onClick,(()=>n.onOpenChange(!1)))}))}));/*#__PURE__*/function M(e){return e?"open":"closed"}exports.DialogClose=k;const K=v;exports.Root=K;const S=b;exports.Trigger=S;const T=w;exports.Overlay=T;const A=F;exports.Content=A;const I=k;exports.Close=I;
+var e,r,t,o=require("aria-hidden").hideOthers,n=require("react-remove-scroll").RemoveScroll,a=require("@radix-ui/react-focus-guards").useFocusGuards,i=require("@radix-ui/react-slot").Slot,s=require("@radix-ui/react-primitive").Primitive,u=require("@radix-ui/react-presence").Presence,c=require("@radix-ui/react-portal").Portal,l=require("@radix-ui/react-focus-scope").FocusScope,d=require("@radix-ui/react-dismissable-layer").DismissableLayer,p=require("@radix-ui/react-use-controllable-state").useControllableState,f=require("@radix-ui/react-id").useId,g=require("@radix-ui/react-context").createContext,m=require("@radix-ui/react-compose-refs").useComposedRefs,x=require("@radix-ui/primitive").composeEventHandlers,C=(e={},r=require("react"),Object.keys(r).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return r[t]}})})),e),E=(t=require("@babel/runtime/helpers/extends"))&&t.__esModule?t.default:t;const[D,O]=g("Dialog"),b=e=>{const{children:r,open:t,defaultOpen:o,onOpenChange:n}=e,a=C.useRef(null),[i=!1,s]=p({prop:t,defaultProp:o,onChange:n});/*#__PURE__*/return C.createElement(D,{triggerRef:a,contentId:f(),open:i,onOpenChange:s},r)};exports.Dialog=b;const q="button",v=/*#__PURE__*/C.forwardRef(((e,r)=>{const{as:t=q,...o}=e,n=O("DialogTrigger"),a=m(r,n.triggerRef);/*#__PURE__*/return C.createElement(s,E({type:"button","aria-haspopup":"dialog","aria-expanded":n.open,"aria-controls":n.contentId,"data-state":k(n.open)},o,{as:t,ref:a,onClick:x(e.onClick,(()=>n.onOpenChange(!0)))}))}));exports.DialogTrigger=v;const h=/*#__PURE__*/C.forwardRef(((e,r)=>{const{forceMount:t,...o}=e,n=O("DialogOverlay");/*#__PURE__*/return C.createElement(u,{present:t||n.open},/*#__PURE__*/C.createElement(R,E({"data-state":k(n.open)},o,{ref:r})))}));exports.DialogOverlay=h;const R=/*#__PURE__*/C.forwardRef(((e,r)=>/*#__PURE__*/C.createElement(c,null,/*#__PURE__*/C.createElement(s,E({},e,{ref:r}))))),y=/*#__PURE__*/C.forwardRef(((e,r)=>{const{forceMount:t,...o}=e,n=O("DialogContent");/*#__PURE__*/return C.createElement(u,{present:t||n.open},/*#__PURE__*/C.createElement(w,E({"data-state":k(n.open)},o,{ref:r})))}));/*#__PURE__*/exports.DialogContent=y;const w=/*#__PURE__*/C.forwardRef(((e,r)=>{const{onOpenAutoFocus:t,onCloseAutoFocus:s,onEscapeKeyDown:u,onPointerDownOutside:p,...f}=e,g=O("DialogContent"),D=C.useRef(null),b=m(r,D);return a(),C.useEffect((()=>{const e=D.current;if(e)return o(e)}),[]),/*#__PURE__*/C.createElement(c,null,/*#__PURE__*/C.createElement(n,null,/*#__PURE__*/C.createElement(l,{as:i,trapped:g.open,onMountAutoFocus:t,onUnmountAutoFocus:s},/*#__PURE__*/C.createElement(d,E({role:"dialog","aria-modal":!0,id:g.contentId},f,{ref:b,disableOutsidePointerEvents:!0,onEscapeKeyDown:u,onPointerDownOutside:x(p,(e=>{const r=e.detail.originalEvent;(2===r.button||0===r.button&&!0===r.ctrlKey)&&e.preventDefault()})),onFocusOutside:e=>e.preventDefault(),onDismiss:()=>g.onOpenChange(!1)})))))})),P="button",F=/*#__PURE__*/C.forwardRef(((e,r)=>{const{as:t=P,...o}=e,n=O("DialogClose");/*#__PURE__*/return C.createElement(s,E({type:"button"},o,{as:t,ref:r,onClick:x(e.onClick,(()=>n.onOpenChange(!1)))}))}));/*#__PURE__*/function k(e){return e?"open":"closed"}exports.DialogClose=F;const M=b;exports.Root=M;const A=v;exports.Trigger=A;const I=h;exports.Overlay=I;const S=y;exports.Content=S;const _=F;exports.Close=_;
 //# sourceMappingURL=index.js.map

dist/index.module.js

@@ -1,2 +0,2 @@
-import{hideOthers as e}from"aria-hidden";import{RemoveScroll as o}from"react-remove-scroll";import{useId as t}from"@radix-ui/react-id";import{useFocusGuards as r}from"@radix-ui/react-focus-guards";import{Primitive as n}from"@radix-ui/react-primitive";import{Presence as a}from"@radix-ui/react-presence";import{Portal as i}from"@radix-ui/react-portal";import{FocusScope as c}from"@radix-ui/react-focus-scope";import{DismissableLayer as u}from"@radix-ui/react-dismissable-layer";import{useControllableState as l}from"@radix-ui/react-use-controllable-state";import{createContext as s}from"@radix-ui/react-context";import{useComposedRefs as p,composeRefs as f}from"@radix-ui/react-compose-refs";import{composeEventHandlers as m}from"@radix-ui/primitive";import*as d from"react";import g from"@babel/runtime/helpers/esm/extends";const[D,C]=s("Dialog");export const Dialog=e=>{const{children:o,open:r,defaultOpen:n,onOpenChange:a}=e,i=d.useRef(null),[c=!1,u]=l({prop:r,defaultProp:n,onChange:a});/*#__PURE__*/return d.createElement(D,{triggerRef:i,contentId:t(),open:c,onOpenChange:u},o)};/*#__PURE__*/const x="button";export const DialogTrigger=/*#__PURE__*/d.forwardRef(((e,o)=>{const{as:t=x,...r}=e,a=C("DialogTrigger"),i=p(o,a.triggerRef);/*#__PURE__*/return d.createElement(n,g({type:"button","aria-haspopup":"dialog","aria-expanded":a.open,"aria-controls":a.contentId,"data-state":y(a.open)},r,{as:t,ref:i,onClick:m(e.onClick,(()=>a.onOpenChange(!0)))}))}));/*#__PURE__*/export const DialogOverlay=/*#__PURE__*/d.forwardRef(((e,o)=>{const{forceMount:t,...r}=e,n=C("DialogOverlay");/*#__PURE__*/return d.createElement(a,{present:t||n.open},/*#__PURE__*/d.createElement(E,g({"data-state":y(n.open)},r,{ref:o})))}));const E=/*#__PURE__*/d.forwardRef(((e,o)=>/*#__PURE__*/d.createElement(i,null,/*#__PURE__*/d.createElement(n,g({},e,{ref:o})))));/*#__PURE__*/export const DialogContent=/*#__PURE__*/d.forwardRef(((e,o)=>{const{forceMount:t,...r}=e,n=C("DialogContent");/*#__PURE__*/return d.createElement(a,{present:t||n.open},/*#__PURE__*/d.createElement(h,g({"data-state":y(n.open)},r,{ref:o})))}));const h=/*#__PURE__*/d.forwardRef(((t,a)=>{const{onOpenAutoFocus:l,onCloseAutoFocus:s,onEscapeKeyDown:p,onPointerDownOutside:D,...x}=t,E=C("DialogContent");r();const h=d.useRef(null);return d.useEffect((()=>{const o=h.current;if(o)return e(o)}),[]),/*#__PURE__*/d.createElement(i,null,/*#__PURE__*/d.createElement(o,null,/*#__PURE__*/d.createElement(c,{trapped:E.open,onMountAutoFocus:l,onUnmountAutoFocus:s},(e=>/*#__PURE__*/d.createElement(u,{disableOutsidePointerEvents:!0,onEscapeKeyDown:p,onPointerDownOutside:m(D,(e=>{(2===e.button||0===e.button&&!0===e.ctrlKey)&&e.preventDefault()})),onFocusOutside:e=>e.preventDefault(),onDismiss:()=>E.onOpenChange(!1)},(o=>/*#__PURE__*/d.createElement(n,g({role:"dialog","aria-modal":!0,id:E.contentId},e,x,{ref:f(a,h,e.ref),onKeyDown:m(x.onKeyDown,e.onKeyDown),style:{...o.style,...x.style},onBlurCapture:m(x.onBlurCapture,o.onBlurCapture,{checkForDefaultPrevented:!1}),onFocusCapture:m(x.onFocusCapture,o.onFocusCapture,{checkForDefaultPrevented:!1}),onMouseDownCapture:m(x.onMouseDownCapture,o.onMouseDownCapture,{checkForDefaultPrevented:!1}),onTouchStartCapture:m(x.onTouchStartCapture,o.onTouchStartCapture,{checkForDefaultPrevented:!1})}))))))))})),w="button";/*#__PURE__*/export const DialogClose=/*#__PURE__*/d.forwardRef(((e,o)=>{const{as:t=w,...r}=e,a=C("DialogClose");/*#__PURE__*/return d.createElement(n,g({type:"button"},r,{as:t,ref:o,onClick:m(e.onClick,(()=>a.onOpenChange(!1)))}))}));/*#__PURE__*/function y(e){return e?"open":"closed"}export const Root=Dialog;export const Trigger=DialogTrigger;export const Overlay=DialogOverlay;export const Content=DialogContent;export const Close=DialogClose;
+import{hideOthers as e}from"aria-hidden";import{RemoveScroll as o}from"react-remove-scroll";import{useFocusGuards as t}from"@radix-ui/react-focus-guards";import{Slot as r}from"@radix-ui/react-slot";import{Primitive as n}from"@radix-ui/react-primitive";import{Presence as a}from"@radix-ui/react-presence";import{Portal as i}from"@radix-ui/react-portal";import{FocusScope as c}from"@radix-ui/react-focus-scope";import{DismissableLayer as l}from"@radix-ui/react-dismissable-layer";import{useControllableState as s}from"@radix-ui/react-use-controllable-state";import{useId as p}from"@radix-ui/react-id";import{createContext as u}from"@radix-ui/react-context";import{useComposedRefs as m}from"@radix-ui/react-compose-refs";import{composeEventHandlers as f}from"@radix-ui/primitive";import*as d from"react";import g from"@babel/runtime/helpers/esm/extends";const[x,D]=u("Dialog");export const Dialog=e=>{const{children:o,open:t,defaultOpen:r,onOpenChange:n}=e,a=d.useRef(null),[i=!1,c]=s({prop:t,defaultProp:r,onChange:n});/*#__PURE__*/return d.createElement(x,{triggerRef:a,contentId:p(),open:i,onOpenChange:c},o)};/*#__PURE__*/const C="button";export const DialogTrigger=/*#__PURE__*/d.forwardRef(((e,o)=>{const{as:t=C,...r}=e,a=D("DialogTrigger"),i=m(o,a.triggerRef);/*#__PURE__*/return d.createElement(n,g({type:"button","aria-haspopup":"dialog","aria-expanded":a.open,"aria-controls":a.contentId,"data-state":v(a.open)},r,{as:t,ref:i,onClick:f(e.onClick,(()=>a.onOpenChange(!0)))}))}));/*#__PURE__*/export const DialogOverlay=/*#__PURE__*/d.forwardRef(((e,o)=>{const{forceMount:t,...r}=e,n=D("DialogOverlay");/*#__PURE__*/return d.createElement(a,{present:t||n.open},/*#__PURE__*/d.createElement(E,g({"data-state":v(n.open)},r,{ref:o})))}));const E=/*#__PURE__*/d.forwardRef(((e,o)=>/*#__PURE__*/d.createElement(i,null,/*#__PURE__*/d.createElement(n,g({},e,{ref:o})))));/*#__PURE__*/export const DialogContent=/*#__PURE__*/d.forwardRef(((e,o)=>{const{forceMount:t,...r}=e,n=D("DialogContent");/*#__PURE__*/return d.createElement(a,{present:t||n.open},/*#__PURE__*/d.createElement(O,g({"data-state":v(n.open)},r,{ref:o})))}));const O=/*#__PURE__*/d.forwardRef(((n,a)=>{const{onOpenAutoFocus:s,onCloseAutoFocus:p,onEscapeKeyDown:u,onPointerDownOutside:x,...C}=n,E=D("DialogContent"),O=d.useRef(null),b=m(a,O);return t(),d.useEffect((()=>{const o=O.current;if(o)return e(o)}),[]),/*#__PURE__*/d.createElement(i,null,/*#__PURE__*/d.createElement(o,null,/*#__PURE__*/d.createElement(c,{as:r,trapped:E.open,onMountAutoFocus:s,onUnmountAutoFocus:p},/*#__PURE__*/d.createElement(l,g({role:"dialog","aria-modal":!0,id:E.contentId},C,{ref:b,disableOutsidePointerEvents:!0,onEscapeKeyDown:u,onPointerDownOutside:f(x,(e=>{const o=e.detail.originalEvent;(2===o.button||0===o.button&&!0===o.ctrlKey)&&e.preventDefault()})),onFocusOutside:e=>e.preventDefault(),onDismiss:()=>E.onOpenChange(!1)})))))})),b="button";/*#__PURE__*/export const DialogClose=/*#__PURE__*/d.forwardRef(((e,o)=>{const{as:t=b,...r}=e,a=D("DialogClose");/*#__PURE__*/return d.createElement(n,g({type:"button"},r,{as:t,ref:o,onClick:f(e.onClick,(()=>a.onOpenChange(!1)))}))}));/*#__PURE__*/function v(e){return e?"open":"closed"}export const Root=Dialog;export const Trigger=DialogTrigger;export const Overlay=DialogOverlay;export const Content=DialogContent;export const Close=DialogClose;
 //# sourceMappingURL=index.module.js.map

package.json

 {
   "name": "@radix-ui/react-dialog",
-  "version": "0.0.17",
+  "version": "0.0.18",
   "license": "MIT",
@@ -24,10 +24,11 @@ "source": "src/index.ts",
     "@radix-ui/react-context": "0.0.5",
-    "@radix-ui/react-dismissable-layer": "0.0.13",
+    "@radix-ui/react-dismissable-layer": "0.0.14",
     "@radix-ui/react-focus-guards": "0.0.7",
-    "@radix-ui/react-focus-scope": "0.0.13",
+    "@radix-ui/react-focus-scope": "0.0.14",
     "@radix-ui/react-id": "0.0.6",
-    "@radix-ui/react-polymorphic": "0.0.11",
-    "@radix-ui/react-portal": "0.0.13",
+    "@radix-ui/react-polymorphic": "0.0.12",
+    "@radix-ui/react-portal": "0.0.14",
     "@radix-ui/react-presence": "0.0.14",
-    "@radix-ui/react-primitive": "0.0.13",
+    "@radix-ui/react-primitive": "0.0.14",
+    "@radix-ui/react-slot": "0.0.11",
     "@radix-ui/react-use-controllable-state": "0.0.6",
@@ -34,0 +35,0 @@ "aria-hidden": "^1.1.1",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

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

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

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

Worsened metrics

Total package byte prevSize

44278

decreased by-11.66%

Dependency count

18

increased by5.88%

Lines of code

90

decreased by-13.46%

Dependency changes

• + Added@radix-ui/react-slot@0.0.11

• + Added@radix-ui/react-dismissable-layer@0.0.14(transitive)

• + Added@radix-ui/react-focus-scope@0.0.14(transitive)

• + Added@radix-ui/react-polymorphic@0.0.12(transitive)

• + Added@radix-ui/react-portal@0.0.14(transitive)

• + Added@radix-ui/react-primitive@0.0.14(transitive)

• + Added@radix-ui/react-slot@0.0.11(transitive)

• - Removed@radix-ui/react-dismissable-layer@0.0.13(transitive)

• - Removed@radix-ui/react-focus-scope@0.0.13(transitive)

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

• - Removed@radix-ui/react-portal@0.0.13(transitive)

• - Removed@radix-ui/react-primitive@0.0.13(transitive)

• Updated@radix-ui/react-dismissable-layer@0.0.14

• Updated@radix-ui/react-focus-scope@0.0.14

• Updated@radix-ui/react-polymorphic@0.0.12

• Updated@radix-ui/react-portal@0.0.14

• Updated@radix-ui/react-primitive@0.0.14