mantine-contextmenu 1.3.14 → 6.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -1
- package/dist/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenuItem.d.ts +3 -1
- package/dist/ContextMenuItem.d.ts.map +1 -1
- package/dist/ContextMenuPortal.d.ts +3 -0
- package/dist/ContextMenuPortal.d.ts.map +1 -0
- package/dist/ContextMenuProvider.d.ts.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +4 -4
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +4 -4
- package/dist/types.d.ts +10 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +9 -9
package/README.md
CHANGED
|
@@ -32,9 +32,12 @@ Visit [icflorescu.github.io/mantine-contextmenu](https://icflorescu.github.io/ma
|
|
|
32
32
|
Install the package and its dependencies:
|
|
33
33
|
|
|
34
34
|
```sh
|
|
35
|
-
npm i @mantine/core @mantine/hooks @emotion/react mantine-contextmenu
|
|
35
|
+
npm i @mantine/core@6 @mantine/hooks@6 @emotion/react mantine-contextmenu
|
|
36
36
|
```
|
|
37
37
|
|
|
38
|
+
**NOTE: Mantine-ContextMenu V6 is compatible with Mantine V6.**
|
|
39
|
+
**Mantine v7 support is in thwe roadmap. If you want to speed up the process, please consider [sponsoring my work](https://github.com/sponsors/icflorescu).**
|
|
40
|
+
|
|
38
41
|
If you're using Next.js, Vite, CRA, Remix or Gatsby, you might need to install additional dependencies. Please refer to Mantine's [getting started page](https://mantine.dev/pages/getting-started/) for more details.
|
|
39
42
|
|
|
40
43
|
Wrap your application in the `ContextMenuProvider` components:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../ContextMenu.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AActE,MAAM,MAAM,0BAA0B,GAAG;IACvC,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,OAAO,EAAE,kBAAkB,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,kBAAkB,GAC/C,0BAA0B,GAAG;IAC3B,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAEJ,wBAAgB,WAAW,CAAC,EAC1B,CAAC,EACD,CAAC,EACD,OAAO,EACP,MAAM,EACN,MAAM,EACN,YAAY,EACZ,MAAM,EACN,SAAS,EACT,KAAK,EACL,EAAE,EACF,UAAU,EACV,MAAM,GACP,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../ContextMenu.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AActE,MAAM,MAAM,0BAA0B,GAAG;IACvC,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,OAAO,EAAE,kBAAkB,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,kBAAkB,GAC/C,0BAA0B,GAAG;IAC3B,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAEJ,wBAAgB,WAAW,CAAC,EAC1B,CAAC,EACD,CAAC,EACD,OAAO,EACP,MAAM,EACN,MAAM,EACN,YAAY,EACZ,MAAM,EACN,SAAS,EACT,KAAK,EACL,EAAE,EACF,UAAU,EACV,MAAM,GACP,EAAE,gBAAgB,2CAkElB"}
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import { ContextMenuItemOptions } from './types';
|
|
2
2
|
import { WithRequiredProperty } from './utils';
|
|
3
|
-
export declare function ContextMenuItem({ className, style, icon, title, color, disabled, onClick, }: WithRequiredProperty<Omit<ContextMenuItemOptions, 'key'>, 'title'
|
|
3
|
+
export declare function ContextMenuItem({ className, style, icon, title, color, disabled, onClick, onHide, items, }: WithRequiredProperty<Omit<ContextMenuItemOptions, 'key'>, 'title'> & {
|
|
4
|
+
onHide: () => void;
|
|
5
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
4
6
|
//# sourceMappingURL=ContextMenuItem.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenuItem.d.ts","sourceRoot":"","sources":["../ContextMenuItem.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ContextMenuItem.d.ts","sourceRoot":"","sources":["../ContextMenuItem.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAsB,sBAAsB,EAAE,MAAM,SAAS,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAuC/C,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,KAAK,EACL,IAAI,EACJ,KAAK,EACL,KAAK,EACL,QAAQ,EACR,OAAO,EACP,MAAM,EACN,KAAK,GACN,EAAE,oBAAoB,CAAC,IAAI,CAAC,sBAAsB,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,GAAG;IAAE,MAAM,EAAE,MAAM,IAAI,CAAA;CAAE,2CAoD7F"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ContextMenuPortal.d.ts","sourceRoot":"","sources":["../ContextMenuPortal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEnE,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,GAAG,UAAU,EAAE,EAAE,gBAAgB,2CAU5E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenuProvider.d.ts","sourceRoot":"","sources":["../ContextMenuProvider.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ContextMenuProvider.d.ts","sourceRoot":"","sources":["../ContextMenuProvider.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAsB,wBAAwB,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAIrG;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,MAAa,EACb,MAAa,EACb,YAAmB,EACnB,QAAQ,GACT,EAAE,wBAAwB,2CA+B1B;AAED;;GAEG;AACH,wBAAgB,cAAc,4BAE7B"}
|
package/dist/index.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var ne=Object.create;var k=Object.defineProperty;var re=Object.getOwnPropertyDescriptor;var se=Object.getOwnPropertyNames;var ie=Object.getPrototypeOf,ue=Object.prototype.hasOwnProperty;var ae=(e,t)=>{for(var o in t)k(e,o,{get:t[o],enumerable:!0})},G=(e,t,o,u)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of se(t))!ue.call(e,n)&&n!==o&&k(e,n,{get:()=>t[n],enumerable:!(u=re(t,n))||u.enumerable});return e};var de=(e,t,o)=>(o=e!=null?ne(ie(e)):{},G(t||!e||!e.__esModule?k(o,"default",{value:e,enumerable:!0}):o,e)),pe=e=>G(k({},"__esModule",{value:!0}),e);var Ce={};ae(Ce,{ContextMenuDivider:()=>W,ContextMenuItem:()=>L,ContextMenuPortal:()=>$,ContextMenuProvider:()=>me,humanize:()=>R,useContextMenu:()=>fe});module.exports=pe(Ce);var C=de(require("react"),1);var O=require("@mantine/core"),J=require("react/jsx-runtime"),le=(0,O.createStyles)(e=>({root:{height:1,background:e.colorScheme==="dark"?e.colors.dark[5]:e.colors.gray[1]}}));function W({className:e,sx:t,style:o}){let{cx:u,classes:n}=le();return(0,J.jsx)(O.Box,{className:u(n.root,e),sx:t,style:o})}var i=require("@mantine/core"),z=require("react");var a=require("@mantine/core"),Z=require("@mantine/hooks"),T=require("react");function R(e){let t=e.replace(/([a-z\d])([A-Z]+)/g,"$1 $2").replace(/\W|_/g," ").trim().toLowerCase();return`${t.charAt(0).toUpperCase()}${t.slice(1)}`}var I=require("react/jsx-runtime"),X={},ce=(0,a.createStyles)(e=>({root:{position:"fixed",border:`1px solid ${e.colorScheme==="dark"?e.colors.dark[4]:e.colors.gray[3]}`,overflow:"hidden",transition:"all .15s ease"}}));function B({x:e,y:t,content:o,zIndex:u,shadow:n,borderRadius:p,onHide:l,className:y,style:c,sx:r,classNames:s,styles:M}){let[w]=(0,Z.useResizeObserver)(),{width:S,height:b}=w.current?.getBoundingClientRect()||{width:0,height:0},x=0,P=0;typeof window<"u"&&({innerWidth:x,innerHeight:P}=window);let[,h]=(0,T.useState)(!1);(0,T.useEffect)(()=>{h(!0)},[]);let{cx:m,classes:D,theme:q}=ce(),{dir:j,spacing:ee}=q,H=typeof M=="function"?M(q,X,X):M,f=(0,a.px)(ee.md);return(0,I.jsx)(a.Paper,{ref:w,shadow:n,radius:p,className:m(D.root,y,s?.root),style:{...H?.root,...c},sx:[{zIndex:u,top:t+b+f>P?P-b-f:t,left:j==="ltr"?e+S+f>x?x-S-f:e:x-f-(e-S-f<0?S+f:e)},...(0,a.packSx)(r)],children:Array.isArray(o)?o.map(({key:N,className:F,sx:U,style:K,onClick:Y,items:_,title:te,...oe})=>Y||_?(0,I.jsx)(L,{className:m(s?.item,F),sx:U,style:{...H?.item,...K},title:te??R(N),onClick:Y,onHide:l,items:_,...oe},N):(0,I.jsx)(W,{className:m(s?.divider,F),sx:U,style:{...H?.divider,...K}},N)):o(l)})}var d=require("react/jsx-runtime"),xe=(0,i.createStyles)((e,{color:t})=>{let o=(0,i.px)(e.spacing.sm)/2;return{button:{width:"100%",display:"flex",alignItems:"center",paddingTop:o,paddingBottom:o,paddingLeft:e.spacing.sm,paddingRight:e.spacing.sm,color:t&&e.colors[t][6],transition:"background .15s ease","&[disabled]":{cursor:"not-allowed",color:e.colorScheme==="dark"?e.colors.dark[3]:e.colors.gray[5]},"&:hover:not([disabled])":{background:e.fn.rgba(t?e.colors[t][6]:e.colorScheme==="dark"?e.colors.dark[3]:e.colors.gray[4],t?e.colorScheme==="dark"?.15:.08:.25)},"&:active:not([disabled])":{background:e.fn.rgba(t?e.colors[t][6]:e.colorScheme==="dark"?e.colors.dark[3]:e.colors.gray[4],t?e.colorScheme==="dark"?.3:.2:.5)}},title:{whiteSpace:"nowrap",flexGrow:1}}});function L({className:e,style:t,icon:o,title:u,color:n,disabled:p,onClick:l,onHide:y,items:c}){let r=(0,z.useRef)(null),[s,M]=(0,z.useState)(null),w=l?m=>{y(),l(m)}:void 0,S=()=>{let{top:m,right:D}=r.current.getBoundingClientRect();M({x:D,y:m})},b=()=>{M(null)},x=c&&!p,{cx:P,classes:h}=xe({color:n});return(0,d.jsxs)("div",{onMouseOver:x?S:void 0,onMouseOut:x?b:void 0,children:[(0,d.jsxs)(i.UnstyledButton,{ref:r,className:P(h.button,e),style:t,disabled:p,onClick:w,children:[o&&(0,d.jsx)(i.Box,{fz:0,mr:"xs",children:o}),(0,d.jsx)(i.Text,{className:h.title,size:"sm",children:u}),c&&(0,d.jsx)(i.Box,{fz:10,mt:-2,ml:"xs",children:"\u25B6"})]}),s&&(0,d.jsx)(B,{content:c,onHide:y,...s})]})}var Q=require("@mantine/core"),v=require("@mantine/hooks");var A=require("react/jsx-runtime");function $({onHide:e,...t}){(0,v.useWindowEvent)("resize",e),(0,v.useWindowEvent)("scroll",e);let o=(0,v.useClickOutside)(e);return(0,A.jsx)(Q.Portal,{innerRef:o,children:(0,A.jsx)(B,{...t,onHide:e})})}var g=require("react");var E=require("react/jsx-runtime"),V=(0,g.createContext)(()=>()=>{});function me({zIndex:e=9999,shadow:t="sm",borderRadius:o="xs",children:u}){let[n,p]=(0,g.useState)(null),l=()=>{p(null)},y=(c,r)=>s=>{s.preventDefault(),s.stopPropagation(),p({x:s.clientX,y:s.clientY,content:c,zIndex:r?.zIndex||e,shadow:r?.shadow||t,borderRadius:r?.borderRadius||o,className:r?.className,style:r?.style,sx:r?.sx,classNames:r?.classNames,styles:r?.styles})};return(0,E.jsxs)(V.Provider,{value:y,children:[u,n&&(0,E.jsx)($,{onHide:l,...n})]})}function fe(){return(0,g.useContext)(V)}
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../index.ts", "../react-shim.mjs", "../
|
|
4
|
-
"sourcesContent": ["export * from './ContextMenu';\nexport * from './ContextMenuDivider';\nexport * from './ContextMenuItem';\nexport * from './ContextMenuProvider';\nexport { humanize } from './utils';\n", "import * as React from 'react';\nexport { React };\n", "import { Paper, Portal, createStyles, packSx, px } from '@mantine/core';\nimport { useClickOutside, useMergedRef, useResizeObserver, useWindowEvent } from '@mantine/hooks';\nimport { CSSProperties, MouseEventHandler, useEffect, useState } from 'react';\nimport { ContextMenuDivider } from './ContextMenuDivider';\nimport { ContextMenuItem } from './ContextMenuItem';\nimport type { ContextMenuContent, ContextMenuOptions } from './types';\nimport { humanize } from './utils';\n\nconst EMPTY_OBJECT = {};\n\nconst useStyles = createStyles((theme) => ({\n root: {\n position: 'fixed',\n border: `1px solid ${theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]}`,\n overflow: 'hidden',\n transition: 'all .15s ease',\n },\n}));\n\nexport type ContextMenuInstanceOptions = {\n x: number;\n y: number;\n content: ContextMenuContent;\n};\n\nexport type ContextMenuProps = ContextMenuOptions &\n ContextMenuInstanceOptions & {\n onHide: () => void;\n };\n\nexport function ContextMenu({\n x,\n y,\n content,\n zIndex,\n shadow,\n borderRadius,\n onHide,\n className,\n style,\n sx,\n classNames,\n styles,\n}: ContextMenuProps) {\n useWindowEvent('resize', onHide);\n useWindowEvent('scroll', onHide);\n\n const clickOutsideRef = useClickOutside<HTMLDivElement>(onHide);\n const [sizeRef] = useResizeObserver<HTMLDivElement>();\n const { width, height } = sizeRef.current?.getBoundingClientRect() || { width: 0, height: 0 };\n const ref = useMergedRef(clickOutsideRef, sizeRef);\n\n let windowWidth = 0;\n let windowHeight = 0;\n if (typeof window !== 'undefined') ({ innerWidth: windowWidth, innerHeight: windowHeight } = window);\n\n // trigger a rerender to make sure that context menu is positioned correctly\n const [, setRendered] = useState(false);\n useEffect(() => {\n setRendered(true);\n }, []);\n\n const handleClick: (onClick: MouseEventHandler<HTMLButtonElement>) => MouseEventHandler<HTMLButtonElement> =\n (onClick) => (e) => {\n onHide();\n onClick(e);\n };\n\n const { cx, classes, theme } = useStyles();\n const { dir, spacing } = theme;\n const styleProperties = typeof styles === 'function' ? styles(theme, EMPTY_OBJECT, EMPTY_OBJECT) : styles;\n const mdSpacing = px(spacing.md);\n\n return (\n <Portal>\n <Paper\n ref={ref}\n shadow={shadow}\n radius={borderRadius}\n className={cx(classes.root, className, classNames?.root)}\n style={{ ...styleProperties?.root, ...style } as CSSProperties}\n sx={[\n {\n zIndex,\n top: y + height + mdSpacing > windowHeight ? windowHeight - height - mdSpacing : y,\n left:\n dir === 'ltr'\n ? x + width + mdSpacing > windowWidth\n ? windowWidth - width - mdSpacing\n : x\n : windowWidth - mdSpacing - (x - width - mdSpacing < 0 ? width + mdSpacing : x),\n },\n ...packSx(sx),\n ]}\n >\n {Array.isArray(content)\n ? content.map(({ key, className, sx, style, onClick, title, ...otherOptions }) =>\n onClick ? (\n <ContextMenuItem\n key={key}\n className={cx(classNames?.item, className)}\n sx={sx}\n style={{ ...styleProperties?.item, ...style } as CSSProperties}\n title={title ?? humanize(key)}\n onClick={handleClick(onClick)}\n {...otherOptions}\n />\n ) : (\n <ContextMenuDivider\n key={key}\n className={cx(classNames?.divider, className)}\n sx={sx}\n style={{ ...styleProperties?.divider, ...style } as CSSProperties}\n />\n )\n )\n : content(onHide)}\n </Paper>\n </Portal>\n );\n}\n", "import { Box, createStyles, type Sx } from '@mantine/core';\nimport type { CSSProperties } from 'react';\n\nconst useStyles = createStyles((theme) => ({\n root: {\n height: 1,\n background: theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[1],\n },\n}));\n\nexport type ContextMenuDividerProps = {\n className: string;\n sx: Sx | (Sx | undefined)[] | undefined;\n style: CSSProperties;\n};\n\nexport function ContextMenuDivider({ className, sx, style }: ContextMenuDividerProps) {\n const { cx, classes } = useStyles();\n return <Box className={cx(classes.root, className)} sx={sx} style={style} />;\n}\n", "import { Box, Text, UnstyledButton, createStyles, px, type MantineColor } from '@mantine/core';\nimport { ContextMenuItemOptions } from './types';\nimport { WithRequiredProperty } from './utils';\n\nconst useStyles = createStyles((theme, { color }: { color?: MantineColor }) => {\n const verticalPadding = px(theme.spacing.sm) / 2;\n return {\n root: {\n width: '100%',\n display: 'flex',\n alignItems: 'center',\n paddingTop: verticalPadding,\n paddingBottom: verticalPadding,\n paddingLeft: theme.spacing.sm,\n paddingRight: theme.spacing.sm,\n color: color && theme.colors[color][6],\n transition: 'background .15s ease',\n '&[disabled]': {\n cursor: 'not-allowed',\n color: theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[5],\n },\n '&:hover:not([disabled])': {\n background: theme.fn.rgba(\n color ? theme.colors[color][6] : theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[4],\n color ? (theme.colorScheme === 'dark' ? 0.15 : 0.08) : 0.25\n ),\n },\n '&:active:not([disabled])': {\n background: theme.fn.rgba(\n color ? theme.colors[color][6] : theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[4],\n color ? (theme.colorScheme === 'dark' ? 0.3 : 0.2) : 0.5\n ),\n },\n },\n icon: {\n fontSize: 0,\n marginRight: theme.spacing.xs,\n },\n title: {\n whiteSpace: 'nowrap',\n },\n };\n});\n\nexport function ContextMenuItem({\n className,\n style,\n icon,\n title,\n color,\n disabled,\n onClick,\n}: WithRequiredProperty<Omit<ContextMenuItemOptions, 'key'>, 'title' | 'onClick'>) {\n const { cx, classes } = useStyles({ color });\n return (\n <UnstyledButton className={cx(classes.root, className)} style={style} disabled={disabled} onClick={onClick}>\n {icon && <Box className={classes.icon}>{icon}</Box>}\n <Text className={classes.title} size=\"sm\">\n {title}\n </Text>\n </UnstyledButton>\n );\n}\n", "export type WithRequiredProperty<Type, Key extends keyof Type> = Type & {\n [Property in Key]-?: Type[Property];\n};\n\n/**\n * Utility function that returns a humanized version of a string, e.g. \"camelCase\" -> \"Camel Case\"\n */\nexport function humanize(value: string) {\n const str = value\n .replace(/([a-z\\d])([A-Z]+)/g, '$1 $2')\n .replace(/\\W|_/g, ' ')\n .trim()\n .toLowerCase();\n return `${str.charAt(0).toUpperCase()}${str.slice(1)}`;\n}\n", "import { createContext, useContext, useState } from 'react';\nimport { ContextMenu, ContextMenuInstanceOptions } from './ContextMenu';\nimport type { ContextMenuOptions, ContextMenuProviderProps, ShowContextMenuFunction } from './types';\n\nconst MenuContext = createContext<ShowContextMenuFunction>(() => () => undefined);\n\n/**\n * Provider that allows to show a context menu anywhere in your application.\n * If you wrap your application with this provider, you can use the `useContextMenu` hook\n * anywhere in the component tree to access a function that shows the context menu.\n */\nexport function ContextMenuProvider({\n zIndex = 9999,\n shadow = 'sm',\n borderRadius = 'xs',\n children,\n}: ContextMenuProviderProps) {\n const [data, setData] = useState<(ContextMenuInstanceOptions & ContextMenuOptions) | null>(null);\n\n const destroy = () => {\n setData(null);\n };\n\n const showContextMenu: ShowContextMenuFunction = (content, options) => (e) => {\n e.preventDefault();\n e.stopPropagation();\n setData({\n x: e.clientX,\n y: e.clientY,\n content,\n zIndex: options?.zIndex || zIndex,\n shadow: options?.shadow || shadow,\n borderRadius: options?.borderRadius || borderRadius,\n className: options?.className,\n style: options?.style,\n sx: options?.sx,\n classNames: options?.classNames,\n styles: options?.styles,\n });\n };\n\n return (\n <MenuContext.Provider value={showContextMenu}>\n {children}\n {data && <ContextMenu onHide={destroy} {...data} />}\n </MenuContext.Provider>\n );\n}\n\n/**\n * Hook returning a function that shows a context menu.\n */\nexport function useContextMenu() {\n return useContext(MenuContext);\n}\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,GAAA,GAAAC,GAAAD,GAAA,
|
|
6
|
-
"names": ["package_exports", "__export", "
|
|
3
|
+
"sources": ["../index.ts", "../react-shim.mjs", "../ContextMenuDivider.tsx", "../ContextMenuItem.tsx", "../ContextMenu.tsx", "../utils.ts", "../ContextMenuPortal.tsx", "../ContextMenuProvider.tsx"],
|
|
4
|
+
"sourcesContent": ["export * from './ContextMenuDivider';\nexport * from './ContextMenuItem';\nexport * from './ContextMenuPortal';\nexport * from './ContextMenuProvider';\nexport { humanize } from './utils';\n", "import * as React from 'react';\nexport { React };\n", "import { Box, createStyles, type Sx } from '@mantine/core';\nimport type { CSSProperties } from 'react';\n\nconst useStyles = createStyles((theme) => ({\n root: {\n height: 1,\n background: theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[1],\n },\n}));\n\nexport type ContextMenuDividerProps = {\n className: string;\n sx: Sx | (Sx | undefined)[] | undefined;\n style: CSSProperties;\n};\n\nexport function ContextMenuDivider({ className, sx, style }: ContextMenuDividerProps) {\n const { cx, classes } = useStyles();\n return <Box className={cx(classes.root, className)} sx={sx} style={style} />;\n}\n", "import { Box, Text, UnstyledButton, createStyles, px, type MantineColor } from '@mantine/core';\nimport { MouseEventHandler, useRef, useState } from 'react';\nimport { ContextMenu } from './ContextMenu';\nimport { ContextMenuContent, ContextMenuItemOptions } from './types';\nimport { WithRequiredProperty } from './utils';\n\nconst useStyles = createStyles((theme, { color }: { color?: MantineColor }) => {\n const verticalPadding = px(theme.spacing.sm) / 2;\n return {\n button: {\n width: '100%',\n display: 'flex',\n alignItems: 'center',\n paddingTop: verticalPadding,\n paddingBottom: verticalPadding,\n paddingLeft: theme.spacing.sm,\n paddingRight: theme.spacing.sm,\n color: color && theme.colors[color][6],\n transition: 'background .15s ease',\n '&[disabled]': {\n cursor: 'not-allowed',\n color: theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[5],\n },\n '&:hover:not([disabled])': {\n background: theme.fn.rgba(\n color ? theme.colors[color][6] : theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[4],\n color ? (theme.colorScheme === 'dark' ? 0.15 : 0.08) : 0.25\n ),\n },\n '&:active:not([disabled])': {\n background: theme.fn.rgba(\n color ? theme.colors[color][6] : theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[4],\n color ? (theme.colorScheme === 'dark' ? 0.3 : 0.2) : 0.5\n ),\n },\n },\n title: {\n whiteSpace: 'nowrap',\n flexGrow: 1,\n },\n };\n});\n\nexport function ContextMenuItem({\n className,\n style,\n icon,\n title,\n color,\n disabled,\n onClick,\n onHide,\n items,\n}: WithRequiredProperty<Omit<ContextMenuItemOptions, 'key'>, 'title'> & { onHide: () => void }) {\n const ref = useRef<HTMLButtonElement>(null);\n const [submenuPosition, setSubmenuPosition] = useState<{ x: number; y: number } | null>(null);\n\n const handleClick: MouseEventHandler<HTMLButtonElement> | undefined = onClick\n ? (e) => {\n onHide();\n onClick!(e);\n }\n : undefined;\n\n const showSubmenu = () => {\n const { top: y, right: x } = ref.current!.getBoundingClientRect();\n setSubmenuPosition({ x, y });\n };\n\n const hideSubmenu = () => {\n setSubmenuPosition(null);\n };\n\n const hasItemsAndIsNotDisabled = items && !disabled;\n const { cx, classes } = useStyles({ color });\n\n return (\n <div\n onMouseOver={hasItemsAndIsNotDisabled ? showSubmenu : undefined}\n onMouseOut={hasItemsAndIsNotDisabled ? hideSubmenu : undefined}\n >\n <UnstyledButton\n ref={ref}\n className={cx(classes.button, className)}\n style={style}\n disabled={disabled}\n onClick={handleClick}\n >\n {icon && (\n <Box fz={0} mr=\"xs\">\n {icon}\n </Box>\n )}\n <Text className={classes.title} size=\"sm\">\n {title}\n </Text>\n {items && (\n <Box fz={10} mt={-2} ml=\"xs\">\n \u25B6\n </Box>\n )}\n </UnstyledButton>\n {submenuPosition && <ContextMenu content={items as ContextMenuContent} onHide={onHide} {...submenuPosition} />}\n </div>\n );\n}\n", "import { Paper, createStyles, packSx, px } from '@mantine/core';\nimport { useResizeObserver } from '@mantine/hooks';\nimport { CSSProperties, useEffect, useState } from 'react';\nimport { ContextMenuDivider } from './ContextMenuDivider';\nimport { ContextMenuItem } from './ContextMenuItem';\nimport type { ContextMenuContent, ContextMenuOptions } from './types';\nimport { humanize } from './utils';\n\nconst EMPTY_OBJECT = {};\n\nconst useStyles = createStyles((theme) => ({\n root: {\n position: 'fixed',\n border: `1px solid ${theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]}`,\n overflow: 'hidden',\n transition: 'all .15s ease',\n },\n}));\n\nexport type ContextMenuInstanceOptions = {\n x: number;\n y: number;\n content: ContextMenuContent;\n};\n\nexport type ContextMenuProps = ContextMenuOptions &\n ContextMenuInstanceOptions & {\n onHide: () => void;\n };\n\nexport function ContextMenu({\n x,\n y,\n content,\n zIndex,\n shadow,\n borderRadius,\n onHide,\n className,\n style,\n sx,\n classNames,\n styles,\n}: ContextMenuProps) {\n const [paperRef] = useResizeObserver<HTMLDivElement>();\n const { width, height } = paperRef.current?.getBoundingClientRect() || { width: 0, height: 0 };\n\n let windowWidth = 0;\n let windowHeight = 0;\n if (typeof window !== 'undefined') ({ innerWidth: windowWidth, innerHeight: windowHeight } = window);\n\n // trigger a rerender to make sure that context menu is positioned correctly\n const [, setRendered] = useState(false);\n useEffect(() => {\n setRendered(true);\n }, []);\n\n const { cx, classes, theme } = useStyles();\n const { dir, spacing } = theme;\n const styleProperties = typeof styles === 'function' ? styles(theme, EMPTY_OBJECT, EMPTY_OBJECT) : styles;\n const mdSpacing = px(spacing.md);\n\n return (\n <Paper\n ref={paperRef}\n shadow={shadow}\n radius={borderRadius}\n className={cx(classes.root, className, classNames?.root)}\n style={{ ...styleProperties?.root, ...style } as CSSProperties}\n sx={[\n {\n zIndex,\n top: y + height + mdSpacing > windowHeight ? windowHeight - height - mdSpacing : y,\n left:\n dir === 'ltr'\n ? x + width + mdSpacing > windowWidth\n ? windowWidth - width - mdSpacing\n : x\n : windowWidth - mdSpacing - (x - width - mdSpacing < 0 ? width + mdSpacing : x),\n },\n ...packSx(sx),\n ]}\n >\n {Array.isArray(content)\n ? content.map(({ key, className, sx, style, onClick, items, title, ...otherOptions }) =>\n onClick || items ? (\n <ContextMenuItem\n key={key}\n className={cx(classNames?.item, className)}\n sx={sx}\n style={{ ...styleProperties?.item, ...style } as CSSProperties}\n title={title ?? humanize(key)}\n onClick={onClick}\n onHide={onHide}\n items={items}\n {...otherOptions}\n />\n ) : (\n <ContextMenuDivider\n key={key}\n className={cx(classNames?.divider, className)}\n sx={sx}\n style={{ ...styleProperties?.divider, ...style } as CSSProperties}\n />\n )\n )\n : content(onHide)}\n </Paper>\n );\n}\n", "export type WithRequiredProperty<Type, Key extends keyof Type> = Type & {\n [Property in Key]-?: Type[Property];\n};\n\n/**\n * Utility function that returns a humanized version of a string, e.g. \"camelCase\" -> \"Camel Case\"\n */\nexport function humanize(value: string) {\n const str = value\n .replace(/([a-z\\d])([A-Z]+)/g, '$1 $2')\n .replace(/\\W|_/g, ' ')\n .trim()\n .toLowerCase();\n return `${str.charAt(0).toUpperCase()}${str.slice(1)}`;\n}\n", "import { Portal } from '@mantine/core';\nimport { useClickOutside, useWindowEvent } from '@mantine/hooks';\nimport { ContextMenu, type ContextMenuProps } from './ContextMenu';\n\nexport function ContextMenuPortal({ onHide, ...otherProps }: ContextMenuProps) {\n useWindowEvent('resize', onHide);\n useWindowEvent('scroll', onHide);\n const portalInnerRef = useClickOutside<HTMLDivElement>(onHide);\n\n return (\n <Portal innerRef={portalInnerRef}>\n <ContextMenu {...otherProps} onHide={onHide} />\n </Portal>\n );\n}\n", "import { createContext, useContext, useState } from 'react';\nimport { ContextMenuInstanceOptions } from './ContextMenu';\nimport { ContextMenuPortal } from './ContextMenuPortal';\nimport type { ContextMenuOptions, ContextMenuProviderProps, ShowContextMenuFunction } from './types';\n\nconst MenuContext = createContext<ShowContextMenuFunction>(() => () => undefined);\n\n/**\n * Provider that allows to show a context menu anywhere in your application.\n * If you wrap your application with this provider, you can use the `useContextMenu` hook\n * anywhere in the component tree to access a function that shows the context menu.\n */\nexport function ContextMenuProvider({\n zIndex = 9999,\n shadow = 'sm',\n borderRadius = 'xs',\n children,\n}: ContextMenuProviderProps) {\n const [data, setData] = useState<(ContextMenuInstanceOptions & ContextMenuOptions) | null>(null);\n\n const destroy = () => {\n setData(null);\n };\n\n const showContextMenu: ShowContextMenuFunction = (content, options) => (e) => {\n e.preventDefault();\n e.stopPropagation();\n setData({\n x: e.clientX,\n y: e.clientY,\n content,\n zIndex: options?.zIndex || zIndex,\n shadow: options?.shadow || shadow,\n borderRadius: options?.borderRadius || borderRadius,\n className: options?.className,\n style: options?.style,\n sx: options?.sx,\n classNames: options?.classNames,\n styles: options?.styles,\n });\n };\n\n return (\n <MenuContext.Provider value={showContextMenu}>\n {children}\n {data && <ContextMenuPortal onHide={destroy} {...data} />}\n </MenuContext.Provider>\n );\n}\n\n/**\n * Hook returning a function that shows a context menu.\n */\nexport function useContextMenu() {\n return useContext(MenuContext);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["package_exports", "__export", "ContextMenuDivider", "ContextMenuItem", "ContextMenuPortal", "ContextMenuProvider", "humanize", "useContextMenu", "__toCommonJS", "React", "import_core", "import_jsx_runtime", "useStyles", "theme", "ContextMenuDivider", "className", "sx", "style", "cx", "classes", "import_core", "import_react", "import_core", "import_hooks", "import_react", "humanize", "value", "str", "import_jsx_runtime", "EMPTY_OBJECT", "useStyles", "theme", "ContextMenu", "x", "y", "content", "zIndex", "shadow", "borderRadius", "onHide", "className", "style", "sx", "classNames", "styles", "paperRef", "width", "height", "windowWidth", "windowHeight", "setRendered", "cx", "classes", "dir", "spacing", "styleProperties", "mdSpacing", "key", "onClick", "items", "title", "otherOptions", "ContextMenuItem", "humanize", "ContextMenuDivider", "import_jsx_runtime", "useStyles", "theme", "color", "verticalPadding", "ContextMenuItem", "className", "style", "icon", "title", "disabled", "onClick", "onHide", "items", "ref", "submenuPosition", "setSubmenuPosition", "handleClick", "e", "showSubmenu", "y", "x", "hideSubmenu", "hasItemsAndIsNotDisabled", "cx", "classes", "ContextMenu", "import_core", "import_hooks", "import_jsx_runtime", "ContextMenuPortal", "onHide", "otherProps", "portalInnerRef", "ContextMenu", "import_react", "import_jsx_runtime", "MenuContext", "ContextMenuProvider", "zIndex", "shadow", "borderRadius", "children", "data", "setData", "destroy", "showContextMenu", "content", "options", "e", "ContextMenuPortal", "useContextMenu"]
|
|
7
7
|
}
|
package/dist/index.d.ts
CHANGED
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,cAAc,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC"}
|
package/dist/index.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as x from"react";import{Box as G,createStyles as J}from"@mantine/core";import{jsx as Z}from"react/jsx-runtime";var X=J(e=>({root:{height:1,background:e.colorScheme==="dark"?e.colors.dark[5]:e.colors.gray[1]}}));function D({className:e,sx:t,style:o}){let{cx:i,classes:s}=X();return Z(G,{className:i(s.root,e),sx:t,style:o})}import{Box as W,Text as se,UnstyledButton as ie,createStyles as ue,px as ae}from"@mantine/core";import{useRef as de,useState as pe}from"react";import{Paper as Q,createStyles as V,packSx as j,px as ee}from"@mantine/core";import{useResizeObserver as te}from"@mantine/hooks";import{useEffect as oe,useState as ne}from"react";function k(e){let t=e.replace(/([a-z\d])([A-Z]+)/g,"$1 $2").replace(/\W|_/g," ").trim().toLowerCase();return`${t.charAt(0).toUpperCase()}${t.slice(1)}`}import{jsx as O}from"react/jsx-runtime";var H={},re=V(e=>({root:{position:"fixed",border:`1px solid ${e.colorScheme==="dark"?e.colors.dark[4]:e.colors.gray[3]}`,overflow:"hidden",transition:"all .15s ease"}}));function P({x:e,y:t,content:o,zIndex:i,shadow:s,borderRadius:u,onHide:a,className:m,style:d,sx:n,classNames:r,styles:f}){let[M]=te(),{width:C,height:S}=M.current?.getBoundingClientRect()||{width:0,height:0},p=0,y=0;typeof window<"u"&&({innerWidth:p,innerHeight:y}=window);let[,g]=ne(!1);oe(()=>{g(!0)},[]);let{cx:l,classes:w,theme:R}=re(),{dir:U,spacing:K}=R,b=typeof f=="function"?f(R,H,H):f,c=ee(K.md);return O(Q,{ref:M,shadow:s,radius:u,className:l(w.root,m,r?.root),style:{...b?.root,...d},sx:[{zIndex:i,top:t+S+c>y?y-S-c:t,left:U==="ltr"?e+C+c>p?p-C-c:e:p-c-(e-C-c<0?C+c:e)},...j(n)],children:Array.isArray(o)?o.map(({key:h,className:I,sx:T,style:B,onClick:z,items:E,title:Y,..._})=>z||E?O(N,{className:l(r?.item,I),sx:T,style:{...b?.item,...B},title:Y??k(h),onClick:z,onHide:a,items:E,..._},h):O(D,{className:l(r?.divider,I),sx:T,style:{...b?.divider,...B}},h)):o(a)})}import{jsx as v,jsxs as L}from"react/jsx-runtime";var le=ue((e,{color:t})=>{let o=ae(e.spacing.sm)/2;return{button:{width:"100%",display:"flex",alignItems:"center",paddingTop:o,paddingBottom:o,paddingLeft:e.spacing.sm,paddingRight:e.spacing.sm,color:t&&e.colors[t][6],transition:"background .15s ease","&[disabled]":{cursor:"not-allowed",color:e.colorScheme==="dark"?e.colors.dark[3]:e.colors.gray[5]},"&:hover:not([disabled])":{background:e.fn.rgba(t?e.colors[t][6]:e.colorScheme==="dark"?e.colors.dark[3]:e.colors.gray[4],t?e.colorScheme==="dark"?.15:.08:.25)},"&:active:not([disabled])":{background:e.fn.rgba(t?e.colors[t][6]:e.colorScheme==="dark"?e.colors.dark[3]:e.colors.gray[4],t?e.colorScheme==="dark"?.3:.2:.5)}},title:{whiteSpace:"nowrap",flexGrow:1}}});function N({className:e,style:t,icon:o,title:i,color:s,disabled:u,onClick:a,onHide:m,items:d}){let n=de(null),[r,f]=pe(null),M=a?l=>{m(),a(l)}:void 0,C=()=>{let{top:l,right:w}=n.current.getBoundingClientRect();f({x:w,y:l})},S=()=>{f(null)},p=d&&!u,{cx:y,classes:g}=le({color:s});return L("div",{onMouseOver:p?C:void 0,onMouseOut:p?S:void 0,children:[L(ie,{ref:n,className:y(g.button,e),style:t,disabled:u,onClick:M,children:[o&&v(W,{fz:0,mr:"xs",children:o}),v(se,{className:g.title,size:"sm",children:i}),d&&v(W,{fz:10,mt:-2,ml:"xs",children:"\u25B6"})]}),r&&v(P,{content:d,onHide:m,...r})]})}import{Portal as ce}from"@mantine/core";import{useClickOutside as xe,useWindowEvent as A}from"@mantine/hooks";import{jsx as $}from"react/jsx-runtime";function q({onHide:e,...t}){A("resize",e),A("scroll",e);let o=xe(e);return $(ce,{innerRef:o,children:$(P,{...t,onHide:e})})}import{createContext as me,useContext as fe,useState as Ce}from"react";import{jsx as ye,jsxs as Me}from"react/jsx-runtime";var F=me(()=>()=>{});function Qe({zIndex:e=9999,shadow:t="sm",borderRadius:o="xs",children:i}){let[s,u]=Ce(null),a=()=>{u(null)},m=(d,n)=>r=>{r.preventDefault(),r.stopPropagation(),u({x:r.clientX,y:r.clientY,content:d,zIndex:n?.zIndex||e,shadow:n?.shadow||t,borderRadius:n?.borderRadius||o,className:n?.className,style:n?.style,sx:n?.sx,classNames:n?.classNames,styles:n?.styles})};return Me(F.Provider,{value:m,children:[i,s&&ye(q,{onHide:a,...s})]})}function Ve(){return fe(F)}export{D as ContextMenuDivider,N as ContextMenuItem,q as ContextMenuPortal,Qe as ContextMenuProvider,k as humanize,Ve as useContextMenu};
|
|
2
2
|
//# sourceMappingURL=index.mjs.map
|
package/dist/index.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../react-shim.mjs", "../
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Paper, Portal, createStyles, packSx, px } from '@mantine/core';\nimport { useClickOutside, useMergedRef, useResizeObserver, useWindowEvent } from '@mantine/hooks';\nimport { CSSProperties, MouseEventHandler, useEffect, useState } from 'react';\nimport { ContextMenuDivider } from './ContextMenuDivider';\nimport { ContextMenuItem } from './ContextMenuItem';\nimport type { ContextMenuContent, ContextMenuOptions } from './types';\nimport { humanize } from './utils';\n\nconst EMPTY_OBJECT = {};\n\nconst useStyles = createStyles((theme) => ({\n root: {\n position: 'fixed',\n border: `1px solid ${theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]}`,\n overflow: 'hidden',\n transition: 'all .15s ease',\n },\n}));\n\nexport type ContextMenuInstanceOptions = {\n x: number;\n y: number;\n content: ContextMenuContent;\n};\n\nexport type ContextMenuProps = ContextMenuOptions &\n ContextMenuInstanceOptions & {\n onHide: () => void;\n };\n\nexport function ContextMenu({\n x,\n y,\n content,\n zIndex,\n shadow,\n borderRadius,\n onHide,\n className,\n style,\n sx,\n classNames,\n styles,\n}: ContextMenuProps) {\n useWindowEvent('resize', onHide);\n useWindowEvent('scroll', onHide);\n\n const clickOutsideRef = useClickOutside<HTMLDivElement>(onHide);\n const [sizeRef] = useResizeObserver<HTMLDivElement>();\n const { width, height } = sizeRef.current?.getBoundingClientRect() || { width: 0, height: 0 };\n const ref = useMergedRef(clickOutsideRef, sizeRef);\n\n let windowWidth = 0;\n let windowHeight = 0;\n if (typeof window !== 'undefined') ({ innerWidth: windowWidth, innerHeight: windowHeight } = window);\n\n // trigger a rerender to make sure that context menu is positioned correctly\n const [, setRendered] = useState(false);\n useEffect(() => {\n setRendered(true);\n }, []);\n\n const handleClick: (onClick: MouseEventHandler<HTMLButtonElement>) => MouseEventHandler<HTMLButtonElement> =\n (onClick) => (e) => {\n onHide();\n onClick(e);\n };\n\n const { cx, classes, theme } = useStyles();\n const { dir, spacing } = theme;\n const styleProperties = typeof styles === 'function' ? styles(theme, EMPTY_OBJECT, EMPTY_OBJECT) : styles;\n const mdSpacing = px(spacing.md);\n\n return (\n <Portal>\n <Paper\n ref={ref}\n shadow={shadow}\n radius={borderRadius}\n className={cx(classes.root, className, classNames?.root)}\n style={{ ...styleProperties?.root, ...style } as CSSProperties}\n sx={[\n {\n zIndex,\n top: y + height + mdSpacing > windowHeight ? windowHeight - height - mdSpacing : y,\n left:\n dir === 'ltr'\n ? x + width + mdSpacing > windowWidth\n ? windowWidth - width - mdSpacing\n : x\n : windowWidth - mdSpacing - (x - width - mdSpacing < 0 ? width + mdSpacing : x),\n },\n ...packSx(sx),\n ]}\n >\n {Array.isArray(content)\n ? content.map(({ key, className, sx, style, onClick, title, ...otherOptions }) =>\n onClick ? (\n <ContextMenuItem\n key={key}\n className={cx(classNames?.item, className)}\n sx={sx}\n style={{ ...styleProperties?.item, ...style } as CSSProperties}\n title={title ?? humanize(key)}\n onClick={handleClick(onClick)}\n {...otherOptions}\n />\n ) : (\n <ContextMenuDivider\n key={key}\n className={cx(classNames?.divider, className)}\n sx={sx}\n style={{ ...styleProperties?.divider, ...style } as CSSProperties}\n />\n )\n )\n : content(onHide)}\n </Paper>\n </Portal>\n );\n}\n", "import { Box, createStyles, type Sx } from '@mantine/core';\nimport type { CSSProperties } from 'react';\n\nconst useStyles = createStyles((theme) => ({\n root: {\n height: 1,\n background: theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[1],\n },\n}));\n\nexport type ContextMenuDividerProps = {\n className: string;\n sx: Sx | (Sx | undefined)[] | undefined;\n style: CSSProperties;\n};\n\nexport function ContextMenuDivider({ className, sx, style }: ContextMenuDividerProps) {\n const { cx, classes } = useStyles();\n return <Box className={cx(classes.root, className)} sx={sx} style={style} />;\n}\n", "import { Box, Text, UnstyledButton, createStyles, px, type MantineColor } from '@mantine/core';\nimport { ContextMenuItemOptions } from './types';\nimport { WithRequiredProperty } from './utils';\n\nconst useStyles = createStyles((theme, { color }: { color?: MantineColor }) => {\n const verticalPadding = px(theme.spacing.sm) / 2;\n return {\n root: {\n width: '100%',\n display: 'flex',\n alignItems: 'center',\n paddingTop: verticalPadding,\n paddingBottom: verticalPadding,\n paddingLeft: theme.spacing.sm,\n paddingRight: theme.spacing.sm,\n color: color && theme.colors[color][6],\n transition: 'background .15s ease',\n '&[disabled]': {\n cursor: 'not-allowed',\n color: theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[5],\n },\n '&:hover:not([disabled])': {\n background: theme.fn.rgba(\n color ? theme.colors[color][6] : theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[4],\n color ? (theme.colorScheme === 'dark' ? 0.15 : 0.08) : 0.25\n ),\n },\n '&:active:not([disabled])': {\n background: theme.fn.rgba(\n color ? theme.colors[color][6] : theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[4],\n color ? (theme.colorScheme === 'dark' ? 0.3 : 0.2) : 0.5\n ),\n },\n },\n icon: {\n fontSize: 0,\n marginRight: theme.spacing.xs,\n },\n title: {\n whiteSpace: 'nowrap',\n },\n };\n});\n\nexport function ContextMenuItem({\n className,\n style,\n icon,\n title,\n color,\n disabled,\n onClick,\n}: WithRequiredProperty<Omit<ContextMenuItemOptions, 'key'>, 'title' | 'onClick'>) {\n const { cx, classes } = useStyles({ color });\n return (\n <UnstyledButton className={cx(classes.root, className)} style={style} disabled={disabled} onClick={onClick}>\n {icon && <Box className={classes.icon}>{icon}</Box>}\n <Text className={classes.title} size=\"sm\">\n {title}\n </Text>\n </UnstyledButton>\n );\n}\n", "export type WithRequiredProperty<Type, Key extends keyof Type> = Type & {\n [Property in Key]-?: Type[Property];\n};\n\n/**\n * Utility function that returns a humanized version of a string, e.g. \"camelCase\" -> \"Camel Case\"\n */\nexport function humanize(value: string) {\n const str = value\n .replace(/([a-z\\d])([A-Z]+)/g, '$1 $2')\n .replace(/\\W|_/g, ' ')\n .trim()\n .toLowerCase();\n return `${str.charAt(0).toUpperCase()}${str.slice(1)}`;\n}\n", "import { createContext, useContext, useState } from 'react';\nimport { ContextMenu, ContextMenuInstanceOptions } from './ContextMenu';\nimport type { ContextMenuOptions, ContextMenuProviderProps, ShowContextMenuFunction } from './types';\n\nconst MenuContext = createContext<ShowContextMenuFunction>(() => () => undefined);\n\n/**\n * Provider that allows to show a context menu anywhere in your application.\n * If you wrap your application with this provider, you can use the `useContextMenu` hook\n * anywhere in the component tree to access a function that shows the context menu.\n */\nexport function ContextMenuProvider({\n zIndex = 9999,\n shadow = 'sm',\n borderRadius = 'xs',\n children,\n}: ContextMenuProviderProps) {\n const [data, setData] = useState<(ContextMenuInstanceOptions & ContextMenuOptions) | null>(null);\n\n const destroy = () => {\n setData(null);\n };\n\n const showContextMenu: ShowContextMenuFunction = (content, options) => (e) => {\n e.preventDefault();\n e.stopPropagation();\n setData({\n x: e.clientX,\n y: e.clientY,\n content,\n zIndex: options?.zIndex || zIndex,\n shadow: options?.shadow || shadow,\n borderRadius: options?.borderRadius || borderRadius,\n className: options?.className,\n style: options?.style,\n sx: options?.sx,\n classNames: options?.classNames,\n styles: options?.styles,\n });\n };\n\n return (\n <MenuContext.Provider value={showContextMenu}>\n {children}\n {data && <ContextMenu onHide={destroy} {...data} />}\n </MenuContext.Provider>\n );\n}\n\n/**\n * Hook returning a function that shows a context menu.\n */\nexport function useContextMenu() {\n return useContext(MenuContext);\n}\n"],
|
|
5
|
-
"mappings": "AAAA,UAAYA,MAAW,QCAvB,OAAS,
|
|
6
|
-
"names": ["React", "
|
|
3
|
+
"sources": ["../react-shim.mjs", "../ContextMenuDivider.tsx", "../ContextMenuItem.tsx", "../ContextMenu.tsx", "../utils.ts", "../ContextMenuPortal.tsx", "../ContextMenuProvider.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Box, createStyles, type Sx } from '@mantine/core';\nimport type { CSSProperties } from 'react';\n\nconst useStyles = createStyles((theme) => ({\n root: {\n height: 1,\n background: theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[1],\n },\n}));\n\nexport type ContextMenuDividerProps = {\n className: string;\n sx: Sx | (Sx | undefined)[] | undefined;\n style: CSSProperties;\n};\n\nexport function ContextMenuDivider({ className, sx, style }: ContextMenuDividerProps) {\n const { cx, classes } = useStyles();\n return <Box className={cx(classes.root, className)} sx={sx} style={style} />;\n}\n", "import { Box, Text, UnstyledButton, createStyles, px, type MantineColor } from '@mantine/core';\nimport { MouseEventHandler, useRef, useState } from 'react';\nimport { ContextMenu } from './ContextMenu';\nimport { ContextMenuContent, ContextMenuItemOptions } from './types';\nimport { WithRequiredProperty } from './utils';\n\nconst useStyles = createStyles((theme, { color }: { color?: MantineColor }) => {\n const verticalPadding = px(theme.spacing.sm) / 2;\n return {\n button: {\n width: '100%',\n display: 'flex',\n alignItems: 'center',\n paddingTop: verticalPadding,\n paddingBottom: verticalPadding,\n paddingLeft: theme.spacing.sm,\n paddingRight: theme.spacing.sm,\n color: color && theme.colors[color][6],\n transition: 'background .15s ease',\n '&[disabled]': {\n cursor: 'not-allowed',\n color: theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[5],\n },\n '&:hover:not([disabled])': {\n background: theme.fn.rgba(\n color ? theme.colors[color][6] : theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[4],\n color ? (theme.colorScheme === 'dark' ? 0.15 : 0.08) : 0.25\n ),\n },\n '&:active:not([disabled])': {\n background: theme.fn.rgba(\n color ? theme.colors[color][6] : theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[4],\n color ? (theme.colorScheme === 'dark' ? 0.3 : 0.2) : 0.5\n ),\n },\n },\n title: {\n whiteSpace: 'nowrap',\n flexGrow: 1,\n },\n };\n});\n\nexport function ContextMenuItem({\n className,\n style,\n icon,\n title,\n color,\n disabled,\n onClick,\n onHide,\n items,\n}: WithRequiredProperty<Omit<ContextMenuItemOptions, 'key'>, 'title'> & { onHide: () => void }) {\n const ref = useRef<HTMLButtonElement>(null);\n const [submenuPosition, setSubmenuPosition] = useState<{ x: number; y: number } | null>(null);\n\n const handleClick: MouseEventHandler<HTMLButtonElement> | undefined = onClick\n ? (e) => {\n onHide();\n onClick!(e);\n }\n : undefined;\n\n const showSubmenu = () => {\n const { top: y, right: x } = ref.current!.getBoundingClientRect();\n setSubmenuPosition({ x, y });\n };\n\n const hideSubmenu = () => {\n setSubmenuPosition(null);\n };\n\n const hasItemsAndIsNotDisabled = items && !disabled;\n const { cx, classes } = useStyles({ color });\n\n return (\n <div\n onMouseOver={hasItemsAndIsNotDisabled ? showSubmenu : undefined}\n onMouseOut={hasItemsAndIsNotDisabled ? hideSubmenu : undefined}\n >\n <UnstyledButton\n ref={ref}\n className={cx(classes.button, className)}\n style={style}\n disabled={disabled}\n onClick={handleClick}\n >\n {icon && (\n <Box fz={0} mr=\"xs\">\n {icon}\n </Box>\n )}\n <Text className={classes.title} size=\"sm\">\n {title}\n </Text>\n {items && (\n <Box fz={10} mt={-2} ml=\"xs\">\n \u25B6\n </Box>\n )}\n </UnstyledButton>\n {submenuPosition && <ContextMenu content={items as ContextMenuContent} onHide={onHide} {...submenuPosition} />}\n </div>\n );\n}\n", "import { Paper, createStyles, packSx, px } from '@mantine/core';\nimport { useResizeObserver } from '@mantine/hooks';\nimport { CSSProperties, useEffect, useState } from 'react';\nimport { ContextMenuDivider } from './ContextMenuDivider';\nimport { ContextMenuItem } from './ContextMenuItem';\nimport type { ContextMenuContent, ContextMenuOptions } from './types';\nimport { humanize } from './utils';\n\nconst EMPTY_OBJECT = {};\n\nconst useStyles = createStyles((theme) => ({\n root: {\n position: 'fixed',\n border: `1px solid ${theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]}`,\n overflow: 'hidden',\n transition: 'all .15s ease',\n },\n}));\n\nexport type ContextMenuInstanceOptions = {\n x: number;\n y: number;\n content: ContextMenuContent;\n};\n\nexport type ContextMenuProps = ContextMenuOptions &\n ContextMenuInstanceOptions & {\n onHide: () => void;\n };\n\nexport function ContextMenu({\n x,\n y,\n content,\n zIndex,\n shadow,\n borderRadius,\n onHide,\n className,\n style,\n sx,\n classNames,\n styles,\n}: ContextMenuProps) {\n const [paperRef] = useResizeObserver<HTMLDivElement>();\n const { width, height } = paperRef.current?.getBoundingClientRect() || { width: 0, height: 0 };\n\n let windowWidth = 0;\n let windowHeight = 0;\n if (typeof window !== 'undefined') ({ innerWidth: windowWidth, innerHeight: windowHeight } = window);\n\n // trigger a rerender to make sure that context menu is positioned correctly\n const [, setRendered] = useState(false);\n useEffect(() => {\n setRendered(true);\n }, []);\n\n const { cx, classes, theme } = useStyles();\n const { dir, spacing } = theme;\n const styleProperties = typeof styles === 'function' ? styles(theme, EMPTY_OBJECT, EMPTY_OBJECT) : styles;\n const mdSpacing = px(spacing.md);\n\n return (\n <Paper\n ref={paperRef}\n shadow={shadow}\n radius={borderRadius}\n className={cx(classes.root, className, classNames?.root)}\n style={{ ...styleProperties?.root, ...style } as CSSProperties}\n sx={[\n {\n zIndex,\n top: y + height + mdSpacing > windowHeight ? windowHeight - height - mdSpacing : y,\n left:\n dir === 'ltr'\n ? x + width + mdSpacing > windowWidth\n ? windowWidth - width - mdSpacing\n : x\n : windowWidth - mdSpacing - (x - width - mdSpacing < 0 ? width + mdSpacing : x),\n },\n ...packSx(sx),\n ]}\n >\n {Array.isArray(content)\n ? content.map(({ key, className, sx, style, onClick, items, title, ...otherOptions }) =>\n onClick || items ? (\n <ContextMenuItem\n key={key}\n className={cx(classNames?.item, className)}\n sx={sx}\n style={{ ...styleProperties?.item, ...style } as CSSProperties}\n title={title ?? humanize(key)}\n onClick={onClick}\n onHide={onHide}\n items={items}\n {...otherOptions}\n />\n ) : (\n <ContextMenuDivider\n key={key}\n className={cx(classNames?.divider, className)}\n sx={sx}\n style={{ ...styleProperties?.divider, ...style } as CSSProperties}\n />\n )\n )\n : content(onHide)}\n </Paper>\n );\n}\n", "export type WithRequiredProperty<Type, Key extends keyof Type> = Type & {\n [Property in Key]-?: Type[Property];\n};\n\n/**\n * Utility function that returns a humanized version of a string, e.g. \"camelCase\" -> \"Camel Case\"\n */\nexport function humanize(value: string) {\n const str = value\n .replace(/([a-z\\d])([A-Z]+)/g, '$1 $2')\n .replace(/\\W|_/g, ' ')\n .trim()\n .toLowerCase();\n return `${str.charAt(0).toUpperCase()}${str.slice(1)}`;\n}\n", "import { Portal } from '@mantine/core';\nimport { useClickOutside, useWindowEvent } from '@mantine/hooks';\nimport { ContextMenu, type ContextMenuProps } from './ContextMenu';\n\nexport function ContextMenuPortal({ onHide, ...otherProps }: ContextMenuProps) {\n useWindowEvent('resize', onHide);\n useWindowEvent('scroll', onHide);\n const portalInnerRef = useClickOutside<HTMLDivElement>(onHide);\n\n return (\n <Portal innerRef={portalInnerRef}>\n <ContextMenu {...otherProps} onHide={onHide} />\n </Portal>\n );\n}\n", "import { createContext, useContext, useState } from 'react';\nimport { ContextMenuInstanceOptions } from './ContextMenu';\nimport { ContextMenuPortal } from './ContextMenuPortal';\nimport type { ContextMenuOptions, ContextMenuProviderProps, ShowContextMenuFunction } from './types';\n\nconst MenuContext = createContext<ShowContextMenuFunction>(() => () => undefined);\n\n/**\n * Provider that allows to show a context menu anywhere in your application.\n * If you wrap your application with this provider, you can use the `useContextMenu` hook\n * anywhere in the component tree to access a function that shows the context menu.\n */\nexport function ContextMenuProvider({\n zIndex = 9999,\n shadow = 'sm',\n borderRadius = 'xs',\n children,\n}: ContextMenuProviderProps) {\n const [data, setData] = useState<(ContextMenuInstanceOptions & ContextMenuOptions) | null>(null);\n\n const destroy = () => {\n setData(null);\n };\n\n const showContextMenu: ShowContextMenuFunction = (content, options) => (e) => {\n e.preventDefault();\n e.stopPropagation();\n setData({\n x: e.clientX,\n y: e.clientY,\n content,\n zIndex: options?.zIndex || zIndex,\n shadow: options?.shadow || shadow,\n borderRadius: options?.borderRadius || borderRadius,\n className: options?.className,\n style: options?.style,\n sx: options?.sx,\n classNames: options?.classNames,\n styles: options?.styles,\n });\n };\n\n return (\n <MenuContext.Provider value={showContextMenu}>\n {children}\n {data && <ContextMenuPortal onHide={destroy} {...data} />}\n </MenuContext.Provider>\n );\n}\n\n/**\n * Hook returning a function that shows a context menu.\n */\nexport function useContextMenu() {\n return useContext(MenuContext);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["React", "Box", "createStyles", "jsx", "useStyles", "theme", "ContextMenuDivider", "className", "sx", "style", "cx", "classes", "Box", "Text", "UnstyledButton", "createStyles", "px", "useRef", "useState", "Paper", "createStyles", "packSx", "px", "useResizeObserver", "useEffect", "useState", "humanize", "value", "str", "jsx", "EMPTY_OBJECT", "useStyles", "createStyles", "theme", "ContextMenu", "x", "y", "content", "zIndex", "shadow", "borderRadius", "onHide", "className", "style", "sx", "classNames", "styles", "paperRef", "useResizeObserver", "width", "height", "windowWidth", "windowHeight", "setRendered", "useState", "useEffect", "cx", "classes", "dir", "spacing", "styleProperties", "mdSpacing", "px", "Paper", "packSx", "key", "onClick", "items", "title", "otherOptions", "ContextMenuItem", "humanize", "ContextMenuDivider", "jsx", "jsxs", "useStyles", "createStyles", "theme", "color", "verticalPadding", "px", "ContextMenuItem", "className", "style", "icon", "title", "disabled", "onClick", "onHide", "items", "ref", "useRef", "submenuPosition", "setSubmenuPosition", "useState", "handleClick", "e", "showSubmenu", "y", "x", "hideSubmenu", "hasItemsAndIsNotDisabled", "cx", "classes", "UnstyledButton", "Box", "Text", "ContextMenu", "Portal", "useClickOutside", "useWindowEvent", "jsx", "ContextMenuPortal", "onHide", "otherProps", "useWindowEvent", "portalInnerRef", "useClickOutside", "Portal", "ContextMenu", "createContext", "useContext", "useState", "jsx", "jsxs", "MenuContext", "createContext", "ContextMenuProvider", "zIndex", "shadow", "borderRadius", "children", "data", "setData", "useState", "destroy", "showContextMenu", "content", "options", "e", "ContextMenuPortal", "useContextMenu", "useContext"]
|
|
7
7
|
}
|
package/dist/types.d.ts
CHANGED
|
@@ -61,7 +61,7 @@ export type ContextMenuItemOptions = {
|
|
|
61
61
|
* Context menu item or divider style
|
|
62
62
|
*/
|
|
63
63
|
style?: CSSProperties;
|
|
64
|
-
} & ({
|
|
64
|
+
} & (({
|
|
65
65
|
/**
|
|
66
66
|
* Optional context menu item icon
|
|
67
67
|
*/
|
|
@@ -79,16 +79,25 @@ export type ContextMenuItemOptions = {
|
|
|
79
79
|
* Boolean indicating whether the context menu item is disabled
|
|
80
80
|
*/
|
|
81
81
|
disabled?: boolean;
|
|
82
|
+
} & ({
|
|
82
83
|
/**
|
|
83
84
|
* Optional context menu item `onClick` handler; if not provided, a divider will be rendered instead
|
|
84
85
|
*/
|
|
85
86
|
onClick: MouseEventHandler<HTMLButtonElement>;
|
|
87
|
+
items?: never;
|
|
86
88
|
} | {
|
|
89
|
+
onClick?: never;
|
|
90
|
+
/**
|
|
91
|
+
* Optional items; if provided, a submenu will be rendered
|
|
92
|
+
*/
|
|
93
|
+
items: ContextMenuItemOptions[];
|
|
94
|
+
})) | {
|
|
87
95
|
icon?: never;
|
|
88
96
|
title?: never;
|
|
89
97
|
color?: never;
|
|
90
98
|
disabled?: never;
|
|
91
99
|
onClick?: never;
|
|
100
|
+
items?: never;
|
|
92
101
|
});
|
|
93
102
|
export type ContextMenuContent = ContextMenuItemOptions[] | ((close: () => void) => JSX.Element);
|
|
94
103
|
export type ShowContextMenuFunction = (
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,eAAe,CAAC;AAC5G,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzE,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IAEvB;;;OAGG;IACH,YAAY,CAAC,EAAE,iBAAiB,CAAC;IAEjC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB;;;OAGG;IACH,EAAE,CAAC,EAAE,EAAE,GAAG,CAAC,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC;IAE7B;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;IAErD;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS,EAAE,aAAa,CAAC,CAAC;CAC7D,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,kBAAkB,GAAG;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,EAAE,CAAC,EAAE,EAAE,GAAG,CAAC,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC;IAC7B;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,GAAG,CACA;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,eAAe,CAAC;AAC5G,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzE,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IAEvB;;;OAGG;IACH,YAAY,CAAC,EAAE,iBAAiB,CAAC;IAEjC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB;;;OAGG;IACH,EAAE,CAAC,EAAE,EAAE,GAAG,CAAC,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC;IAE7B;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;IAErD;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS,EAAE,aAAa,CAAC,CAAC;CAC7D,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,kBAAkB,GAAG;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,EAAE,CAAC,EAAE,EAAE,GAAG,CAAC,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC;IAC7B;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,GAAG,CACA,CAAC;IACC;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;OAEG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,CACA;IACE;;OAEG;IACH,OAAO,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAE9C,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,GACD;IACE,OAAO,CAAC,EAAE,KAAK,CAAC;IAEhB;;OAEG;IACH,KAAK,EAAE,sBAAsB,EAAE,CAAC;CACjC,CACJ,CAAC,GACF;IACE,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CACJ,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,sBAAsB,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,KAAK,GAAG,CAAC,OAAO,CAAC,CAAC;AAEjG,MAAM,MAAM,uBAAuB,GAAG;AACpC;;;GAGG;AACH,OAAO,EAAE,kBAAkB;AAE3B;;GAEG;AACH,OAAO,CAAC,EAAE,kBAAkB,KACzB,iBAAiB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "mantine-contextmenu",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "6.0.0",
|
|
4
4
|
"description": "Enhance your Mantine UI applications usability with customizable context menus",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ui",
|
|
@@ -52,17 +52,17 @@
|
|
|
52
52
|
"lint": "eslint . --ext=.ts,.tsx && tsc --noEmit"
|
|
53
53
|
},
|
|
54
54
|
"devDependencies": {
|
|
55
|
-
"@mantine/core": "^6.0.
|
|
56
|
-
"@mantine/hooks": "^6.0.
|
|
57
|
-
"@types/react": "^18.2.
|
|
58
|
-
"@types/react-dom": "^18.2.
|
|
59
|
-
"esbuild": "^0.19.
|
|
55
|
+
"@mantine/core": "^6.0.21",
|
|
56
|
+
"@mantine/hooks": "^6.0.21",
|
|
57
|
+
"@types/react": "^18.2.24",
|
|
58
|
+
"@types/react-dom": "^18.2.8",
|
|
59
|
+
"esbuild": "^0.19.4",
|
|
60
60
|
"react": "^18.2.0",
|
|
61
|
-
"typescript": "^5.
|
|
61
|
+
"typescript": "^5.2.2"
|
|
62
62
|
},
|
|
63
63
|
"peerDependencies": {
|
|
64
|
-
"@mantine/core": ">=6 <=6.0.17 || >=6.0.19",
|
|
65
|
-
"@mantine/hooks": ">=6 <=6.0.17 || >=6.0.19",
|
|
64
|
+
"@mantine/core": ">=6 <=6.0.17 || >=6.0.19 < 7",
|
|
65
|
+
"@mantine/hooks": ">=6 <=6.0.17 || >=6.0.19 < 7",
|
|
66
66
|
"react": ">=18"
|
|
67
67
|
}
|
|
68
68
|
}
|