@radix-ui/react-context-menu - npm Package Compare versions

Comparing version 0.0.19 to 0.0.20

dist/index.d.ts

@@ -5,5 +5,8 @@ import * as React from "react";
 import * as Polymorphic from "@radix-ui/react-polymorphic";
-export const ContextMenu: React.FC<{
+type Direction = 'ltr' | 'rtl';
+type ContextMenuOwnProps = {
     onOpenChange?(open: boolean): void;
-}>;
+    dir?: Direction;
+};
+export const ContextMenu: React.FC<ContextMenuOwnProps>;
 declare const TRIGGER_DEFAULT_TAG = "span";
@@ -13,3 +16,5 @@ type ContextMenuTriggerOwnProps = Polymorphic.OwnProps<typeof Primitive>;
 export const ContextMenuTrigger: ContextMenuTriggerPrimitive;
-type ContextMenuContentOwnProps = Omit<Polymorphic.OwnProps<typeof MenuPrimitive.Content>, 'trapFocus' | 'disableOutsideScroll' | 'portalled' | 'onOpenAutoFocus'>;
+type ContextMenuContentOwnProps = Polymorphic.Merge<Omit<Polymorphic.OwnProps<typeof MenuPrimitive.Content>, 'trapFocus' | 'disableOutsideScroll' | 'portalled' | 'side' | 'sideOffset' | 'align'>, {
+    offset?: number;
+}>;
 export type ContextMenuContentPrimitive = Polymorphic.ForwardRefComponent<Polymorphic.IntrinsicElement<typeof MenuPrimitive.Content>, ContextMenuContentOwnProps>;
@@ -19,2 +24,3 @@ export const ContextMenuContent: ContextMenuContentPrimitive;
 export const ContextMenuLabel: import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-primitive").PrimitivePrimitive, "div">, "div">;
+export const ContextMenuTriggerItem: import("@radix-ui/react-primitive").ExtendedPrimitive<MenuPrimitive.MenuSubTriggerPrimitive, "div">;
 export const ContextMenuItem: import("@radix-ui/react-primitive").ExtendedPrimitive<MenuPrimitive.MenuItemPrimitive, "div">;
@@ -26,5 +32,4 @@ export const ContextMenuCheckboxItem: import("@radix-ui/react-primitive").ExtendedPrimitive<MenuPrimitive.MenuCheckboxItemPrimitive, "div">;
 export const ContextMenuSeparator: import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-primitive").PrimitivePrimitive, "div">, "div">;
-export const Root: React.FC<{
-    onOpenChange?(open: boolean): void;
-}>;
+export const ContextMenuArrow: import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-popper").PopperArrowPrimitive, "svg">, "svg">;
+export const Root: React.FC<ContextMenuOwnProps>;
 export const Trigger: ContextMenuTriggerPrimitive;
@@ -35,2 +40,3 @@ export const Content: ContextMenuContentPrimitive;
 export const Item: import("@radix-ui/react-primitive").ExtendedPrimitive<MenuPrimitive.MenuItemPrimitive, "div">;
+export const TriggerItem: import("@radix-ui/react-primitive").ExtendedPrimitive<MenuPrimitive.MenuSubTriggerPrimitive, "div">;
 export const CheckboxItem: import("@radix-ui/react-primitive").ExtendedPrimitive<MenuPrimitive.MenuCheckboxItemPrimitive, "div">;
@@ -41,3 +47,4 @@ export const RadioGroup: import("@radix-ui/react-primitive").ExtendedPrimitive<MenuPrimitive.MenuRadioGroupPrimitive, "div">;
 export const Separator: import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-primitive").PrimitivePrimitive, "div">, "div">;
+export const Arrow: import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-primitive").ExtendedPrimitive<import("@radix-ui/react-popper").PopperArrowPrimitive, "svg">, "svg">;
 
 //# sourceMappingURL=index.d.ts.map

dist/index.js

@@ -1,2 +0,2 @@
-var e,t=require("@radix-ui/react-use-callback-ref").useCallbackRef,n=x({},require("@radix-ui/react-menu")),o=require("@radix-ui/react-primitive"),r=o.Primitive,a=o.extendPrimitive,s=require("@radix-ui/react-context").createContext,i=require("@radix-ui/primitive").composeEventHandlers,u=x({},require("react")),c=(e=require("@babel/runtime/helpers/extends"))&&e.__esModule?e.default:e;function x(e,t){return Object.keys(t).forEach((function(n){"default"!==n&&"__esModule"!==n&&Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[n]}})})),e}const[p,l]=s("ContextMenu"),d=e=>{const{children:o,onOpenChange:r}=e,[a,s]=u.useState(!1),i=t(r),c=u.useCallback((e=>{s(e),i(e)}),[i]);/*#__PURE__*/return u.createElement(n.Root,{open:a,onOpenChange:c},/*#__PURE__*/u.createElement(p,{open:a,onOpenChange:c},o))};exports.ContextMenu=d;const m="span",C=/*#__PURE__*/u.forwardRef(((e,t)=>{const{as:o=m,...a}=e,s=l("ContextMenuTrigger"),x=u.useRef({x:0,y:0}),p=u.useRef({getBoundingClientRect:()=>DOMRect.fromRect({width:0,height:0,...x.current})});/*#__PURE__*/return u.createElement(u.Fragment,null,/*#__PURE__*/u.createElement(n.Anchor,{virtualRef:p}),/*#__PURE__*/u.createElement(r,c({},a,{as:o,ref:t,onContextMenu:i(e.onContextMenu,(e=>{e.preventDefault(),x.current={x:e.clientX,y:e.clientY},s.onOpenChange(!0)}))})))}));exports.ContextMenuTrigger=C;const M=/*#__PURE__*/u.forwardRef(((e,t)=>{const{side:o="bottom",align:r="start",disableOutsidePointerEvents:a=!0,...s}=e,i=l("ContextMenuContent");/*#__PURE__*/return u.createElement(n.Content,c({},s,{ref:t,side:o,align:r,disableOutsidePointerEvents:!!i.open&&a,style:{...e.style,"--radix-context-menu-content-transform-origin":"var(--radix-popper-transform-origin)"},trapFocus:!0,disableOutsideScroll:!0,portalled:!0}))}));exports.ContextMenuContent=M;const f=a(n.Group,{displayName:"ContextMenuGroup"});exports.ContextMenuGroup=f;const b=a(n.Label,{displayName:"ContextMenuLabel"});exports.ContextMenuLabel=b;const I=a(n.Item,{displayName:"ContextMenuItem"});exports.ContextMenuItem=I;const g=a(n.CheckboxItem,{displayName:"ContextMenuCheckboxItem"});exports.ContextMenuCheckboxItem=g;const R=a(n.RadioGroup,{displayName:"ContextMenuRadioGroup"});exports.ContextMenuRadioGroup=R;const h=a(n.RadioItem,{displayName:"ContextMenuRadioItem"});exports.ContextMenuRadioItem=h;const y=a(n.ItemIndicator,{displayName:"ContextMenuItemIndicator"});exports.ContextMenuItemIndicator=y;const v=a(n.Separator,{displayName:"ContextMenuSeparator"});exports.ContextMenuSeparator=v;const E=d;exports.Root=E;const O=C;exports.Trigger=O;const k=M;exports.Content=k;const G=f;exports.Group=G;const N=b;exports.Label=N;const q=I;exports.Item=q;const S=g;exports.CheckboxItem=S;const P=R;exports.RadioGroup=P;const L=h;exports.RadioItem=L;const _=y;exports.ItemIndicator=_;const w=v;exports.Separator=w;
+var e,t=require("@radix-ui/react-use-callback-ref").useCallbackRef,n=x({},require("@radix-ui/react-menu")),o=require("@radix-ui/react-primitive"),r=o.Primitive,a=o.extendPrimitive,s=require("@radix-ui/react-context").createContext,i=require("@radix-ui/primitive").composeEventHandlers,u=x({},require("react")),c=(e=require("@babel/runtime/helpers/extends"))&&e.__esModule?e.default:e;function x(e,t){return Object.keys(t).forEach((function(n){"default"!==n&&"__esModule"!==n&&Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[n]}})})),e}const[p,l]=s("ContextMenu"),d=e=>{const{children:o,onOpenChange:r,dir:a}=e,[s,i]=u.useState(!1),c=u.useContext(M),x=t(r),l=u.useCallback((e=>{i(e),x(e)}),[x]);return c?/*#__PURE__*/u.createElement(p,{isRootMenu:!1,open:s,onOpenChange:l},/*#__PURE__*/u.createElement(n.Sub,{open:s,onOpenChange:l},o)):/*#__PURE__*/u.createElement(p,{isRootMenu:!0,open:s,onOpenChange:l},/*#__PURE__*/u.createElement(n.Root,{dir:a,open:s,onOpenChange:l},o))};exports.ContextMenu=d;const m="span",C=/*#__PURE__*/u.forwardRef(((e,t)=>{const{as:o=m,...a}=e,s=l("ContextMenuTrigger"),x=u.useRef({x:0,y:0}),p=u.useRef({getBoundingClientRect:()=>DOMRect.fromRect({width:0,height:0,...x.current})});/*#__PURE__*/return u.createElement(M.Provider,{value:!1},/*#__PURE__*/u.createElement(n.Anchor,{virtualRef:p}),/*#__PURE__*/u.createElement(r,c({},a,{as:o,ref:t,onContextMenu:i(e.onContextMenu,(e=>{e.preventDefault(),x.current={x:e.clientX,y:e.clientY},s.onOpenChange(!0)}))})))}));exports.ContextMenuTrigger=C;const M=/*#__PURE__*/u.createContext(!1),f=/*#__PURE__*/u.forwardRef(((e,t)=>{const{offset:o,...r}=e,a=l("ContextMenuContent"),s={...r,sideOffset:o,style:{...e.style,"--radix-context-menu-content-transform-origin":"var(--radix-popper-transform-origin)"}};/*#__PURE__*/return u.createElement(M.Provider,{value:!0},a.isRootMenu?/*#__PURE__*/u.createElement(g,c({},s,{ref:t})):/*#__PURE__*/u.createElement(n.Content,c({},s,{ref:t})))}));exports.ContextMenuContent=f;const g=/*#__PURE__*/u.forwardRef(((e,t)=>{const{disableOutsidePointerEvents:o=!0,...r}=e,a=l("ContextMenuContent");/*#__PURE__*/return u.createElement(n.Content,c({},r,{ref:t,disableOutsidePointerEvents:!!a.open&&o,trapFocus:!0,disableOutsideScroll:!0,portalled:!0,side:"bottom",align:"start",alignOffset:2}))})),I=a(n.Group,{displayName:"ContextMenuGroup"});exports.ContextMenuGroup=I;const R=a(n.Label,{displayName:"ContextMenuLabel"});exports.ContextMenuLabel=R;const b=a(n.SubTrigger,{displayName:"ContextMenuTriggerItem"});exports.ContextMenuTriggerItem=b;const h=a(n.Item,{displayName:"ContextMenuItem"});exports.ContextMenuItem=h;const y=a(n.CheckboxItem,{displayName:"ContextMenuCheckboxItem"});exports.ContextMenuCheckboxItem=y;const v=a(n.RadioGroup,{displayName:"ContextMenuRadioGroup"});exports.ContextMenuRadioGroup=v;const E=a(n.RadioItem,{displayName:"ContextMenuRadioItem"});exports.ContextMenuRadioItem=E;const O=a(n.ItemIndicator,{displayName:"ContextMenuItemIndicator"});exports.ContextMenuItemIndicator=O;const N=a(n.Separator,{displayName:"ContextMenuSeparator"});exports.ContextMenuSeparator=N;const k=a(n.Arrow,{displayName:"ContextMenuArrow"});exports.ContextMenuArrow=k;const w=d;exports.Root=w;const G=C;exports.Trigger=G;const S=f;exports.Content=S;const q=I;exports.Group=q;const P=R;exports.Label=P;const T=h;exports.Item=T;const A=b;exports.TriggerItem=A;const L=y;exports.CheckboxItem=L;const _=v;exports.RadioGroup=_;const j=E;exports.RadioItem=j;const D=O;exports.ItemIndicator=D;const B=N;exports.Separator=B;const F=k;exports.Arrow=F;
 //# sourceMappingURL=index.js.map

dist/index.module.js

@@ -1,2 +0,2 @@
-import{useCallbackRef as e}from"@radix-ui/react-use-callback-ref";import*as t from"@radix-ui/react-menu";import{Primitive as o,extendPrimitive as n}from"@radix-ui/react-primitive";import{createContext as r}from"@radix-ui/react-context";import{composeEventHandlers as a}from"@radix-ui/primitive";import*as i from"react";import x from"@babel/runtime/helpers/esm/extends";const[u,p]=r("ContextMenu");export const ContextMenu=o=>{const{children:n,onOpenChange:r}=o,[a,x]=i.useState(!1),p=e(r),c=i.useCallback((e=>{x(e),p(e)}),[p]);/*#__PURE__*/return i.createElement(t.Root,{open:a,onOpenChange:c},/*#__PURE__*/i.createElement(u,{open:a,onOpenChange:c},n))};/*#__PURE__*/const c="span";export const ContextMenuTrigger=/*#__PURE__*/i.forwardRef(((e,n)=>{const{as:r=c,...u}=e,s=p("ContextMenuTrigger"),m=i.useRef({x:0,y:0}),C=i.useRef({getBoundingClientRect:()=>DOMRect.fromRect({width:0,height:0,...m.current})});/*#__PURE__*/return i.createElement(i.Fragment,null,/*#__PURE__*/i.createElement(t.Anchor,{virtualRef:C}),/*#__PURE__*/i.createElement(o,x({},u,{as:r,ref:n,onContextMenu:a(e.onContextMenu,(e=>{e.preventDefault(),m.current={x:e.clientX,y:e.clientY},s.onOpenChange(!0)}))})))}));/*#__PURE__*/export const ContextMenuContent=/*#__PURE__*/i.forwardRef(((e,o)=>{const{side:n="bottom",align:r="start",disableOutsidePointerEvents:a=!0,...u}=e,c=p("ContextMenuContent");/*#__PURE__*/return i.createElement(t.Content,x({},u,{ref:o,side:n,align:r,disableOutsidePointerEvents:!!c.open&&a,style:{...e.style,"--radix-context-menu-content-transform-origin":"var(--radix-popper-transform-origin)"},trapFocus:!0,disableOutsideScroll:!0,portalled:!0}))}));/*#__PURE__*/export const ContextMenuGroup=n(t.Group,{displayName:"ContextMenuGroup"});export const ContextMenuLabel=n(t.Label,{displayName:"ContextMenuLabel"});export const ContextMenuItem=n(t.Item,{displayName:"ContextMenuItem"});export const ContextMenuCheckboxItem=n(t.CheckboxItem,{displayName:"ContextMenuCheckboxItem"});export const ContextMenuRadioGroup=n(t.RadioGroup,{displayName:"ContextMenuRadioGroup"});export const ContextMenuRadioItem=n(t.RadioItem,{displayName:"ContextMenuRadioItem"});export const ContextMenuItemIndicator=n(t.ItemIndicator,{displayName:"ContextMenuItemIndicator"});export const ContextMenuSeparator=n(t.Separator,{displayName:"ContextMenuSeparator"});export const Root=ContextMenu;export const Trigger=ContextMenuTrigger;export const Content=ContextMenuContent;export const Group=ContextMenuGroup;export const Label=ContextMenuLabel;export const Item=ContextMenuItem;export const CheckboxItem=ContextMenuCheckboxItem;export const RadioGroup=ContextMenuRadioGroup;export const RadioItem=ContextMenuRadioItem;export const ItemIndicator=ContextMenuItemIndicator;export const Separator=ContextMenuSeparator;
+import{useCallbackRef as e}from"@radix-ui/react-use-callback-ref";import*as t from"@radix-ui/react-menu";import{Primitive as o,extendPrimitive as n}from"@radix-ui/react-primitive";import{createContext as r}from"@radix-ui/react-context";import{composeEventHandlers as a}from"@radix-ui/primitive";import*as i from"react";import x from"@babel/runtime/helpers/esm/extends";const[u,s]=r("ContextMenu");export const ContextMenu=o=>{const{children:n,onOpenChange:r,dir:a}=o,[x,s]=i.useState(!1),p=i.useContext(c),m=e(r),C=i.useCallback((e=>{s(e),m(e)}),[m]);return p?/*#__PURE__*/i.createElement(u,{isRootMenu:!1,open:x,onOpenChange:C},/*#__PURE__*/i.createElement(t.Sub,{open:x,onOpenChange:C},n)):/*#__PURE__*/i.createElement(u,{isRootMenu:!0,open:x,onOpenChange:C},/*#__PURE__*/i.createElement(t.Root,{dir:a,open:x,onOpenChange:C},n))};/*#__PURE__*/const p="span";export const ContextMenuTrigger=/*#__PURE__*/i.forwardRef(((e,n)=>{const{as:r=p,...u}=e,m=s("ContextMenuTrigger"),C=i.useRef({x:0,y:0}),d=i.useRef({getBoundingClientRect:()=>DOMRect.fromRect({width:0,height:0,...C.current})});/*#__PURE__*/return i.createElement(c.Provider,{value:!1},/*#__PURE__*/i.createElement(t.Anchor,{virtualRef:d}),/*#__PURE__*/i.createElement(o,x({},u,{as:r,ref:n,onContextMenu:a(e.onContextMenu,(e=>{e.preventDefault(),C.current={x:e.clientX,y:e.clientY},m.onOpenChange(!0)}))})))}));/*#__PURE__*/const c=/*#__PURE__*/i.createContext(!1);export const ContextMenuContent=/*#__PURE__*/i.forwardRef(((e,o)=>{const{offset:n,...r}=e,a=s("ContextMenuContent"),u={...r,sideOffset:n,style:{...e.style,"--radix-context-menu-content-transform-origin":"var(--radix-popper-transform-origin)"}};/*#__PURE__*/return i.createElement(c.Provider,{value:!0},a.isRootMenu?/*#__PURE__*/i.createElement(m,x({},u,{ref:o})):/*#__PURE__*/i.createElement(t.Content,x({},u,{ref:o})))}));/*#__PURE__*/const m=/*#__PURE__*/i.forwardRef(((e,o)=>{const{disableOutsidePointerEvents:n=!0,...r}=e,a=s("ContextMenuContent");/*#__PURE__*/return i.createElement(t.Content,x({},r,{ref:o,disableOutsidePointerEvents:!!a.open&&n,trapFocus:!0,disableOutsideScroll:!0,portalled:!0,side:"bottom",align:"start",alignOffset:2}))}));export const ContextMenuGroup=n(t.Group,{displayName:"ContextMenuGroup"});export const ContextMenuLabel=n(t.Label,{displayName:"ContextMenuLabel"});export const ContextMenuTriggerItem=n(t.SubTrigger,{displayName:"ContextMenuTriggerItem"});export const ContextMenuItem=n(t.Item,{displayName:"ContextMenuItem"});export const ContextMenuCheckboxItem=n(t.CheckboxItem,{displayName:"ContextMenuCheckboxItem"});export const ContextMenuRadioGroup=n(t.RadioGroup,{displayName:"ContextMenuRadioGroup"});export const ContextMenuRadioItem=n(t.RadioItem,{displayName:"ContextMenuRadioItem"});export const ContextMenuItemIndicator=n(t.ItemIndicator,{displayName:"ContextMenuItemIndicator"});export const ContextMenuSeparator=n(t.Separator,{displayName:"ContextMenuSeparator"});export const ContextMenuArrow=n(t.Arrow,{displayName:"ContextMenuArrow"});export const Root=ContextMenu;export const Trigger=ContextMenuTrigger;export const Content=ContextMenuContent;export const Group=ContextMenuGroup;export const Label=ContextMenuLabel;export const Item=ContextMenuItem;export const TriggerItem=ContextMenuTriggerItem;export const CheckboxItem=ContextMenuCheckboxItem;export const RadioGroup=ContextMenuRadioGroup;export const RadioItem=ContextMenuRadioItem;export const ItemIndicator=ContextMenuItemIndicator;export const Separator=ContextMenuSeparator;export const Arrow=ContextMenuArrow;
 //# sourceMappingURL=index.module.js.map

package.json

 {
   "name": "@radix-ui/react-context-menu",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "license": "MIT",
@@ -23,5 +23,5 @@ "source": "src/index.ts",
     "@radix-ui/react-context": "0.0.5",
-    "@radix-ui/react-menu": "0.0.18",
-    "@radix-ui/react-polymorphic": "0.0.11",
-    "@radix-ui/react-primitive": "0.0.13",
+    "@radix-ui/react-menu": "0.0.19",
+    "@radix-ui/react-polymorphic": "0.0.12",
+    "@radix-ui/react-primitive": "0.0.14",
     "@radix-ui/react-use-callback-ref": "0.0.5"
@@ -28,0 +28,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

41555

26.06%

Lines of code

73

21.67%

Dependency changes

• + Added

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

• + Added

  @radix-ui/react-collection@0.0.13
  (transitive)

• + Added

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

• + Added

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

• + Added

  @radix-ui/react-menu@0.0.19
  (transitive)

• + Added

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

• + Added

  @radix-ui/react-popper@0.0.17
  (transitive)

• + Added

  @radix-ui/react-portal@0.0.14
  (transitive)

• + Added

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

• + Added

  @radix-ui/react-roving-focus@0.0.14
  (transitive)

• + Added

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

• + Added

  @radix-ui/react-use-direction@0.0.1
  (transitive)

• - Removed

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

• - Removed

  @radix-ui/react-collection@0.0.12
  (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-menu@0.0.18
  (transitive)

• - Removed

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

• - Removed

  @radix-ui/react-popper@0.0.16
  (transitive)

• - Removed

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

• - Removed

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

• - Removed

  @radix-ui/react-roving-focus@0.0.13
  (transitive)

• - Removed

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

• Updated

  @radix-ui/react-menu@0.0.19

• Updated

  @radix-ui/react-polymorphic@0.0.12

• Updated

  @radix-ui/react-primitive@0.0.14