mantine-contextmenu 7.6.1 → 7.7.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/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var re=Object.create;var N=Object.defineProperty;var ie=Object.getOwnPropertyDescriptor;var ue=Object.getOwnPropertyNames;var se=Object.getPrototypeOf,me=Object.prototype.hasOwnProperty;var xe=(e,t)=>{for(var n in t)N(e,n,{get:t[n],enumerable:!0})},X=(e,t,n,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of ue(t))!me.call(e,r)&&r!==n&&N(e,r,{get:()=>t[r],enumerable:!(i=ie(t,r))||i.enumerable});return e};var U=(e,t,n)=>(n=e!=null?re(se(e)):{},X(t||!e||!e.__esModule?N(n,"default",{value:e,enumerable:!0}):n,e)),ae=e=>X(N({},"__esModule",{value:!0}),e);var le={};xe(le,{ContextMenuCtx:()=>_,ContextMenuDivider:()=>$,ContextMenuItem:()=>Q,ContextMenuPortal:()=>V,ContextMenuProvider:()=>pe,ContextMenuSettingsCtx:()=>P,humanize:()=>G,useContextMenu:()=>de});module.exports=ae(le);var Y=require("@mantine/core"),Z=U(require("clsx")),J=require("react/jsx-runtime");function $({className:e,style:t}){return(0,J.jsx)(Y.Box,{className:(0,Z.default)("mantine-contextmenu-divider",e),style:t})}var o=require("@mantine/core"),B=require("@mantine/hooks"),oe=U(require("clsx")),w=require("react");var g=require("@mantine/core"),te=require("@mantine/hooks"),A=U(require("clsx")),ne=require("react");var v=require("react");var ee=require("@mantine/core"),R=require("@mantine/hooks");var j=require("react/jsx-runtime");function K({zIndex:e,children:t,onHide:n}){let i=r=>{r.preventDefault(),n()};return(0,j.jsx)("div",{className:"mantine-contextmenu-overlay",style:{zIndex:e},onClick:i,onContextMenu:i,children:t})}var k=require("react/jsx-runtime");function V({onHide:e,zIndex:t,...n}){return(0,R.useWindowEvent)("resize",e),(0,R.useWindowEvent)("scroll",e),(0,R.useHotkeys)([["Escape",e]]),(0,k.jsx)(ee.Portal,{children:(0,k.jsx)(K,{zIndex:t,onHide:e,children:(0,k.jsx)(W,{...n,onHide:e})})})}var z=require("react/jsx-runtime"),T={shadow:"sm",borderRadius:"xs",submenuDelay:500},P=(0,v.createContext)(T),_=(0,v.createContext)({showContextMenu:()=>()=>{},hideContextMenu:()=>{},isContextMenuVisible:!1});function pe({zIndex:e=9999,shadow:t=T.shadow,borderRadius:n=T.borderRadius,submenuDelay:i=T.submenuDelay,children:r}){let[l,c]=(0,v.useState)(null),p=()=>{c(null)},C=(M,s)=>m=>{m.preventDefault(),m.stopPropagation(),c({x:m.clientX,y:m.clientY,content:M,zIndex:s?.zIndex||e,className:s?.className,style:s?.style,classNames:s?.classNames,styles:s?.styles})};return(0,z.jsx)(P.Provider,{value:{shadow:t,borderRadius:n,submenuDelay:i},children:(0,z.jsxs)(_.Provider,{value:{showContextMenu:C,hideContextMenu:p,isContextMenuVisible:!!l},children:[r,l&&(0,z.jsx)(V,{onHide:p,...l})]})})}function de(){return(0,v.useContext)(_)}function G(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 F=require("react/jsx-runtime");function W({x:e,y:t,content:n,zIndex:i,onHide:r,className:l,style:c,classNames:p,styles:C}){let{shadow:M,borderRadius:s}=(0,ne.useContext)(P),[m]=(0,te.useResizeObserver)(),{width:h,height:S}=m.current?.getBoundingClientRect()||{width:0,height:0},f=0,O=0;typeof window<"u"&&({innerWidth:f,innerHeight:O}=window);let{dir:L}=(0,g.useDirection)();return(0,F.jsx)(g.Paper,{ref:m,shadow:M,radius:s,className:(0,A.default)("mantine-contextmenu",l,p?.root),style:[({spacing:{md:y}})=>{let u=(0,g.px)(y);return{zIndex:i,top:t+S+u>O?O-S-u:t,left:L==="ltr"?e+h+u>f?f-h-u:e:f-u-(e-h-u<0?h+u:e)}},c,C?.root],children:Array.isArray(n)?n.map(({key:y,hidden:u,className:H,style:E,onClick:I,items:D,title:q,...x})=>u?null:I||D?(0,F.jsx)(Q,{className:(0,A.default)(p?.item,H),style:[C?.item,E],title:q??G(y),onClick:I,onHide:r,items:D,...x},y):(0,F.jsx)($,{className:(0,A.default)(p?.divider,H),style:[C?.divider,E]},y)):n(r)})}var d=require("react/jsx-runtime");function Q({className:e,style:t,icon:n,iconRight:i,title:r,color:l,disabled:c,onClick:p,onHide:C,items:M}){let s=(0,w.useRef)(null),{submenuDelay:m}=(0,w.useContext)(P),h=(0,B.useMediaQuery)("(hover: hover)"),[S,f]=(0,w.useState)(null),{start:O,clear:L}=(0,B.useTimeout)(()=>{let{top:x,right:b}=s.current.getBoundingClientRect();f({x:b,y:x})},m),{start:y,clear:u}=(0,B.useTimeout)(()=>{f(null)},m),H=()=>{u(),O()},E=()=>{L(),y()},I=M&&!c,D=I&&h,q=I?x=>{x.stopPropagation(),H()}:p?x=>{C(),p(x)}:void 0;return(0,d.jsxs)("div",{onMouseEnter:D?H:void 0,onMouseLeave:D?E:void 0,children:[(0,d.jsxs)(o.UnstyledButton,{ref:s,style:[x=>{let{colors:b}=x,a=l?(0,o.parseThemeColor)({color:l,theme:x}).value:void 0;return{"--mantine-contextmenu-item-button-color":a||"var(--mantine-color-text)","--mantine-contextmenu-item-button-hover-bg-color-light":a?(0,o.rgba)(a,.08):(0,o.rgba)(b.gray[4],.25),"--mantine-contextmenu-item-button-hover-bg-color-dark":a?(0,o.rgba)(a,.15):(0,o.rgba)(b.dark[3],.25),"--mantine-contextmenu-item-button-pressed-bg-color-light":a?(0,o.rgba)(a,.2):(0,o.rgba)(b.gray[4],.5),"--mantine-contextmenu-item-button-pressed-bg-color-dark":a?(0,o.rgba)(a,.3):(0,o.rgba)(b.dark[3],.5)}},t],className:(0,oe.default)("mantine-contextmenu-item-button",e),disabled:c,onClick:q,children:[n&&(0,d.jsx)(o.Box,{fz:0,mr:"xs",mt:-2,children:n}),(0,d.jsx)("div",{className:"mantine-contextmenu-item-button-title",children:r}),i?(0,d.jsx)(o.Box,{fz:0,ml:"xs",mt:-2,children:i}):M&&(0,d.jsx)(o.Box,{fz:10,mt:-2,ml:"xs",children:"\u25B6"})]}),S&&(0,d.jsx)(W,{content:M,onHide:C,...S})]})}0&&(module.exports={ContextMenuCtx,ContextMenuDivider,ContextMenuItem,ContextMenuPortal,ContextMenuProvider,ContextMenuSettingsCtx,humanize,useContextMenu});
1
+ "use strict";"use client";var re=Object.create;var N=Object.defineProperty;var ue=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var se=Object.getPrototypeOf,me=Object.prototype.hasOwnProperty;var xe=(e,t)=>{for(var n in t)N(e,n,{get:t[n],enumerable:!0})},G=(e,t,n,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of ie(t))!me.call(e,r)&&r!==n&&N(e,r,{get:()=>t[r],enumerable:!(i=ue(t,r))||i.enumerable});return e};var U=(e,t,n)=>(n=e!=null?re(se(e)):{},G(t||!e||!e.__esModule?N(n,"default",{value:e,enumerable:!0}):n,e)),ae=e=>G(N({},"__esModule",{value:!0}),e);var de={};xe(de,{ContextMenuCtx:()=>X,ContextMenuDivider:()=>$,ContextMenuItem:()=>_,ContextMenuPortal:()=>V,ContextMenuProvider:()=>pe,ContextMenuSettingsCtx:()=>g,humanize:()=>Y,useContextMenu:()=>le});module.exports=ae(de);var Q=require("@mantine/core"),Z=U(require("clsx")),J=require("react/jsx-runtime");function $({className:e,style:t}){return(0,J.jsx)(Q.Box,{className:(0,Z.default)("mantine-contextmenu-divider",e),style:t})}var o=require("@mantine/core"),E=require("@mantine/hooks"),oe=U(require("clsx")),S=require("react");var w=require("@mantine/core"),te=require("@mantine/hooks"),A=U(require("clsx")),ne=require("react");var b=require("react");var ee=require("@mantine/core"),D=require("@mantine/hooks");var j=require("react/jsx-runtime");function K({zIndex:e,children:t,onHide:n}){let i=r=>{r.preventDefault(),n()};return(0,j.jsx)("div",{className:"mantine-contextmenu-overlay",style:{zIndex:e},onClick:i,onContextMenu:i,children:t})}var k=require("react/jsx-runtime");function V({onHide:e,zIndex:t,...n}){return(0,D.useWindowEvent)("resize",e),(0,D.useWindowEvent)("scroll",e),(0,D.useHotkeys)([["Escape",e]]),(0,k.jsx)(ee.Portal,{children:(0,k.jsx)(K,{zIndex:t,onHide:e,children:(0,k.jsx)(T,{...n,onHide:e})})})}var z=require("react/jsx-runtime"),W={shadow:"sm",borderRadius:"xs",submenuDelay:500},g=(0,b.createContext)(W),X=(0,b.createContext)({showContextMenu:()=>()=>{},hideContextMenu:()=>{},isContextMenuVisible:!1});function pe({zIndex:e=9999,shadow:t=W.shadow,borderRadius:n=W.borderRadius,submenuDelay:i=W.submenuDelay,children:r}){let[d,M]=(0,b.useState)(null),p=()=>{M(null)},c=(f,m)=>u=>{u.preventDefault(),u.stopPropagation();let C="touches"in u?u.touches[0].clientX:u.clientX,h="touches"in u?u.touches[0].clientY:u.clientY;M({x:C,y:h,content:f,zIndex:m?.zIndex||e,className:m?.className,style:m?.style,classNames:m?.classNames,styles:m?.styles})};return(0,z.jsx)(g.Provider,{value:{shadow:t,borderRadius:n,submenuDelay:i},children:(0,z.jsxs)(X.Provider,{value:{showContextMenu:c,hideContextMenu:p,isContextMenuVisible:!!d},children:[r,d&&(0,z.jsx)(V,{onHide:p,...d})]})})}function le(){return(0,b.useContext)(X)}function Y(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 F=require("react/jsx-runtime");function T({x:e,y:t,content:n,zIndex:i,onHide:r,className:d,style:M,classNames:p,styles:c}){let{shadow:f,borderRadius:m}=(0,ne.useContext)(g),[u]=(0,te.useResizeObserver)(),{width:C,height:h}=u.current?.getBoundingClientRect()||{width:0,height:0},v=0,O=0;typeof window<"u"&&({innerWidth:v,innerHeight:O}=window);let{dir:L}=(0,w.useDirection)();return(0,F.jsx)(w.Paper,{ref:u,shadow:f,radius:m,className:(0,A.default)("mantine-contextmenu",d,p?.root),style:[({spacing:{md:y}})=>{let s=(0,w.px)(y);return{zIndex:i,top:t+h+s>O?O-h-s:t,left:L==="ltr"?e+C+s>v?v-C-s:e:v-s-(e-C-s<0?C+s:e)}},M,c?.root],children:Array.isArray(n)?n.map(({key:y,hidden:s,className:H,style:B,onClick:I,items:R,title:q,...x})=>s?null:I||R?(0,F.jsx)(_,{className:(0,A.default)(p?.item,H),style:[c?.item,B],title:q??Y(y),onClick:I,onHide:r,items:R,...x},y):(0,F.jsx)($,{className:(0,A.default)(p?.divider,H),style:[c?.divider,B]},y)):n(r)})}var l=require("react/jsx-runtime");function _({className:e,style:t,icon:n,iconRight:i,title:r,color:d,disabled:M,onClick:p,onHide:c,items:f}){let m=(0,S.useRef)(null),{submenuDelay:u}=(0,S.useContext)(g),C=(0,E.useMediaQuery)("(hover: hover)"),[h,v]=(0,S.useState)(null),{start:O,clear:L}=(0,E.useTimeout)(()=>{let{top:x,right:P}=m.current.getBoundingClientRect();v({x:P,y:x})},u),{start:y,clear:s}=(0,E.useTimeout)(()=>{v(null)},u),H=()=>{s(),O()},B=()=>{L(),y()},I=f&&!M,R=I&&C,q=I?x=>{x.stopPropagation(),H()}:p?x=>{c(),p(x)}:void 0;return(0,l.jsxs)("div",{onMouseEnter:R?H:void 0,onMouseLeave:R?B:void 0,children:[(0,l.jsxs)(o.UnstyledButton,{ref:m,style:[x=>{let{colors:P}=x,a=d?(0,o.parseThemeColor)({color:d,theme:x}).value:void 0;return{"--mantine-contextmenu-item-button-color":a||"var(--mantine-color-text)","--mantine-contextmenu-item-button-hover-bg-color-light":a?(0,o.rgba)(a,.08):(0,o.rgba)(P.gray[4],.25),"--mantine-contextmenu-item-button-hover-bg-color-dark":a?(0,o.rgba)(a,.15):(0,o.rgba)(P.dark[3],.25),"--mantine-contextmenu-item-button-pressed-bg-color-light":a?(0,o.rgba)(a,.2):(0,o.rgba)(P.gray[4],.5),"--mantine-contextmenu-item-button-pressed-bg-color-dark":a?(0,o.rgba)(a,.3):(0,o.rgba)(P.dark[3],.5)}},t],className:(0,oe.default)("mantine-contextmenu-item-button",e),disabled:M,onClick:q,children:[n&&(0,l.jsx)(o.Box,{fz:0,mr:"xs",mt:-2,children:n}),(0,l.jsx)("div",{className:"mantine-contextmenu-item-button-title",children:r}),i?(0,l.jsx)(o.Box,{fz:0,ml:"xs",mt:-2,children:i}):f&&(0,l.jsx)(o.Box,{fz:10,mt:-2,ml:"xs",children:"\u25B6"})]}),h&&(0,l.jsx)(T,{content:f,onHide:c,...h})]})}0&&(module.exports={ContextMenuCtx,ContextMenuDivider,ContextMenuItem,ContextMenuPortal,ContextMenuProvider,ContextMenuSettingsCtx,humanize,useContextMenu});
2
2
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../package/index.ts","../package/ContextMenuDivider.tsx","../package/ContextMenuItem.tsx","../package/ContextMenu.tsx","../package/ContextMenuProvider.tsx","../package/ContextMenuPortal.tsx","../package/ContextMenuOverlay.tsx","../package/utils.ts"],"sourcesContent":["'use client';\n\nexport * from './ContextMenuDivider';\nexport * from './ContextMenuItem';\nexport * from './ContextMenuPortal';\nexport * from './ContextMenuProvider';\nexport * from './types';\nexport * from './utils';\n","import { Box } from '@mantine/core';\nimport clsx from 'clsx';\nimport type { ContextMenuItemOptions } from './types';\n\nexport type ContextMenuDividerProps = Pick<ContextMenuItemOptions, 'className' | 'style'>;\n\nexport function ContextMenuDivider({ className, style }: ContextMenuDividerProps) {\n return <Box className={clsx('mantine-contextmenu-divider', className)} style={style} />;\n}\n","import { Box, UnstyledButton, parseThemeColor, rgba } from '@mantine/core';\nimport { useMediaQuery, useTimeout } from '@mantine/hooks';\nimport clsx from 'clsx';\nimport { useContext, useRef, useState, type MouseEventHandler } from 'react';\nimport { ContextMenu } from './ContextMenu';\nimport { ContextMenuSettingsCtx } from './ContextMenuProvider';\nimport type { ContextMenuContent, ContextMenuItemOptions, WithRequiredProperty } from './types';\n\nexport function ContextMenuItem({\n className,\n style,\n icon,\n iconRight,\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 { submenuDelay } = useContext(ContextMenuSettingsCtx);\n\n const hoverAvailable = useMediaQuery(`(hover: hover)`);\n\n const [submenuPosition, setSubmenuPosition] = useState<{ x: number; y: number } | null>(null);\n\n const { start: startShowingSubmenu, clear: stopShowingSubmenu } = useTimeout(() => {\n const { top: y, right: x } = ref.current!.getBoundingClientRect();\n setSubmenuPosition({ x, y });\n }, submenuDelay);\n\n const { start: startHidingSubmenu, clear: stopHidingSubmenu } = useTimeout(() => {\n setSubmenuPosition(null);\n }, submenuDelay);\n\n const showSubmenu = () => {\n stopHidingSubmenu();\n startShowingSubmenu();\n };\n\n const hideSubmenu = () => {\n stopShowingSubmenu();\n startHidingSubmenu();\n };\n\n const hasSubmenu = items && !disabled;\n const showSubmenuOnHover = hasSubmenu && hoverAvailable;\n\n const handleClick: MouseEventHandler<HTMLButtonElement> | undefined = hasSubmenu\n ? (e) => {\n e.stopPropagation();\n showSubmenu();\n }\n : onClick\n ? (e) => {\n onHide();\n onClick!(e);\n }\n : undefined;\n\n return (\n <div\n onMouseEnter={showSubmenuOnHover ? showSubmenu : undefined}\n onMouseLeave={showSubmenuOnHover ? hideSubmenu : undefined}\n >\n <UnstyledButton\n ref={ref}\n style={[\n (theme) => {\n const { colors } = theme;\n const parsedColor = color ? parseThemeColor({ color, theme }).value : undefined;\n return {\n '--mantine-contextmenu-item-button-color': parsedColor ? parsedColor : 'var(--mantine-color-text)',\n '--mantine-contextmenu-item-button-hover-bg-color-light': parsedColor\n ? rgba(parsedColor, 0.08)\n : rgba(colors.gray[4], 0.25),\n '--mantine-contextmenu-item-button-hover-bg-color-dark': parsedColor\n ? rgba(parsedColor, 0.15)\n : rgba(colors.dark[3], 0.25),\n '--mantine-contextmenu-item-button-pressed-bg-color-light': parsedColor\n ? rgba(parsedColor, 0.2)\n : rgba(colors.gray[4], 0.5),\n '--mantine-contextmenu-item-button-pressed-bg-color-dark': parsedColor\n ? rgba(parsedColor, 0.3)\n : rgba(colors.dark[3], 0.5),\n };\n },\n style,\n ]}\n className={clsx('mantine-contextmenu-item-button', className)}\n disabled={disabled}\n onClick={handleClick}\n >\n {icon && (\n <Box fz={0} mr=\"xs\" mt={-2}>\n {icon}\n </Box>\n )}\n <div className=\"mantine-contextmenu-item-button-title\">{title}</div>\n { iconRight ? (\n <Box fz={0} ml=\"xs\" mt={-2}>\n {iconRight}\n </Box>\n ) : items && (\n <Box fz={10} mt={-2} ml=\"xs\">\n ▶\n </Box>\n )}\n </UnstyledButton>\n {submenuPosition && <ContextMenu content={items as ContextMenuContent} onHide={onHide} {...submenuPosition} />}\n </div>\n );\n}\n","import { Paper, px, useDirection } from '@mantine/core';\nimport { useResizeObserver } from '@mantine/hooks';\nimport clsx from 'clsx';\nimport { useContext } from 'react';\nimport { ContextMenuDivider } from './ContextMenuDivider';\nimport { ContextMenuItem } from './ContextMenuItem';\nimport { ContextMenuSettingsCtx } from './ContextMenuProvider';\nimport type { ContextMenuContent, ContextMenuOptions } from './types';\nimport { humanize } from './utils';\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({ x, y, content, zIndex, onHide, className, style, classNames, styles }: ContextMenuProps) {\n const { shadow, borderRadius } = useContext(ContextMenuSettingsCtx);\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 const { dir } = useDirection();\n\n return (\n <Paper\n ref={paperRef}\n shadow={shadow}\n radius={borderRadius}\n className={clsx('mantine-contextmenu', className, classNames?.root)}\n style={[\n ({ spacing: { md } }) => {\n const mdSpacing = px(md) as number;\n return {\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 },\n style,\n styles?.root,\n ]}\n >\n {Array.isArray(content)\n ? content.map(({ key, hidden, className, style, onClick, items, title, ...otherOptions }) =>\n hidden ? null : onClick || items ? (\n <ContextMenuItem\n key={key}\n className={clsx(classNames?.item, className)}\n style={[styles?.item, style]}\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={clsx(classNames?.divider, className)}\n style={[styles?.divider, style]}\n />\n )\n )\n : content(onHide)}\n </Paper>\n );\n}\n","import { createContext, useContext, useState } from 'react';\nimport type { ContextMenuInstanceOptions } from './ContextMenu';\nimport { ContextMenuPortal } from './ContextMenuPortal';\nimport type {\n ContextMenuOptions,\n ContextMenuProviderProps,\n ContextMenuSettings,\n HideContextMenuFunction,\n ShowContextMenuFunction,\n WithRequiredProperty,\n} from './types';\n\nconst DEFAULT_SETTINGS: WithRequiredProperty<ContextMenuSettings, 'shadow' | 'borderRadius' | 'submenuDelay'> = {\n shadow: 'sm',\n borderRadius: 'xs',\n submenuDelay: 500,\n};\n\nexport const ContextMenuSettingsCtx = createContext(DEFAULT_SETTINGS);\nexport const ContextMenuCtx = createContext<{\n /**\n * Function that shows the context menu.\n */\n showContextMenu: ShowContextMenuFunction;\n\n /**\n * Function that hides the context menu.\n */\n hideContextMenu: HideContextMenuFunction;\n\n /**\n * Boolean indicating whether the context menu is currently visible.\n */\n isContextMenuVisible: boolean;\n}>({ showContextMenu: () => () => undefined, hideContextMenu: () => undefined, isContextMenuVisible: false });\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 = DEFAULT_SETTINGS.shadow,\n borderRadius = DEFAULT_SETTINGS.borderRadius,\n submenuDelay = DEFAULT_SETTINGS.submenuDelay,\n children,\n}: ContextMenuProviderProps) {\n const [data, setData] = useState<(ContextMenuInstanceOptions & ContextMenuOptions) | null>(null);\n\n const hideContextMenu = () => {\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 className: options?.className,\n style: options?.style,\n classNames: options?.classNames,\n styles: options?.styles,\n });\n };\n\n return (\n <ContextMenuSettingsCtx.Provider value={{ shadow, borderRadius, submenuDelay }}>\n <ContextMenuCtx.Provider value={{ showContextMenu, hideContextMenu, isContextMenuVisible: !!data }}>\n {children}\n {data && <ContextMenuPortal onHide={hideContextMenu} {...data} />}\n </ContextMenuCtx.Provider>\n </ContextMenuSettingsCtx.Provider>\n );\n}\n\n/**\n * Hook returning functions that show and hide the context menu.\n */\nexport function useContextMenu() {\n return useContext(ContextMenuCtx);\n}\n","import { Portal } from '@mantine/core';\nimport { useHotkeys, useWindowEvent } from '@mantine/hooks';\nimport { ContextMenu, type ContextMenuProps } from './ContextMenu';\nimport { ContextMenuOverlay } from './ContextMenuOverlay';\n\nexport type ContextMenuPortalProps = ContextMenuProps & {\n zIndex?: number;\n};\n\nexport function ContextMenuPortal({ onHide, zIndex, ...otherProps }: ContextMenuPortalProps) {\n useWindowEvent('resize', onHide);\n useWindowEvent('scroll', onHide);\n useHotkeys([['Escape', onHide]]);\n\n return (\n <Portal>\n <ContextMenuOverlay zIndex={zIndex} onHide={onHide}>\n <ContextMenu {...otherProps} onHide={onHide} />\n </ContextMenuOverlay>\n </Portal>\n );\n}\n","export type ContextMenuOverlayProps = React.PropsWithChildren<{\n zIndex: number | undefined;\n onHide: () => void;\n}>;\n\nexport function ContextMenuOverlay({ zIndex, children, onHide }: ContextMenuOverlayProps) {\n const handleHide = (e: React.MouseEvent) => {\n e.preventDefault();\n onHide();\n };\n return (\n <div className=\"mantine-contextmenu-overlay\" style={{ zIndex }} onClick={handleHide} onContextMenu={handleHide}>\n {children}\n </div>\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"],"mappings":"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","names":["package_exports","__export","ContextMenuCtx","ContextMenuDivider","ContextMenuItem","ContextMenuPortal","ContextMenuProvider","ContextMenuSettingsCtx","humanize","useContextMenu","__toCommonJS","import_core","import_clsx","import_jsx_runtime","ContextMenuDivider","className","style","clsx","import_core","import_hooks","import_clsx","import_react","import_core","import_hooks","import_clsx","import_react","import_react","import_core","import_hooks","import_jsx_runtime","ContextMenuOverlay","zIndex","children","onHide","handleHide","e","import_jsx_runtime","ContextMenuPortal","onHide","zIndex","otherProps","ContextMenuOverlay","ContextMenu","import_jsx_runtime","DEFAULT_SETTINGS","ContextMenuSettingsCtx","ContextMenuCtx","ContextMenuProvider","zIndex","shadow","borderRadius","submenuDelay","children","data","setData","hideContextMenu","showContextMenu","content","options","e","ContextMenuPortal","useContextMenu","humanize","value","str","import_jsx_runtime","ContextMenu","x","y","content","zIndex","onHide","className","style","classNames","styles","shadow","borderRadius","ContextMenuSettingsCtx","paperRef","width","height","windowWidth","windowHeight","dir","clsx","md","mdSpacing","key","hidden","onClick","items","title","otherOptions","ContextMenuItem","humanize","ContextMenuDivider","import_jsx_runtime","ContextMenuItem","className","style","icon","iconRight","title","color","disabled","onClick","onHide","items","ref","submenuDelay","ContextMenuSettingsCtx","hoverAvailable","submenuPosition","setSubmenuPosition","startShowingSubmenu","stopShowingSubmenu","y","x","startHidingSubmenu","stopHidingSubmenu","showSubmenu","hideSubmenu","hasSubmenu","showSubmenuOnHover","handleClick","e","theme","colors","parsedColor","clsx","ContextMenu"]}
1
+ {"version":3,"sources":["../package/index.ts","../package/ContextMenuDivider.tsx","../package/ContextMenuItem.tsx","../package/ContextMenu.tsx","../package/ContextMenuProvider.tsx","../package/ContextMenuPortal.tsx","../package/ContextMenuOverlay.tsx","../package/utils.ts"],"sourcesContent":["'use client';\n\nexport * from './ContextMenuDivider';\nexport * from './ContextMenuItem';\nexport * from './ContextMenuPortal';\nexport * from './ContextMenuProvider';\nexport * from './types';\nexport * from './utils';\n","import { Box } from '@mantine/core';\nimport clsx from 'clsx';\nimport type { ContextMenuItemOptions } from './types';\n\nexport type ContextMenuDividerProps = Pick<ContextMenuItemOptions, 'className' | 'style'>;\n\nexport function ContextMenuDivider({ className, style }: ContextMenuDividerProps) {\n return <Box className={clsx('mantine-contextmenu-divider', className)} style={style} />;\n}\n","import { Box, UnstyledButton, parseThemeColor, rgba } from '@mantine/core';\nimport { useMediaQuery, useTimeout } from '@mantine/hooks';\nimport clsx from 'clsx';\nimport { useContext, useRef, useState, type MouseEventHandler } from 'react';\nimport { ContextMenu } from './ContextMenu';\nimport { ContextMenuSettingsCtx } from './ContextMenuProvider';\nimport type { ContextMenuContent, ContextMenuItemOptions, WithRequiredProperty } from './types';\n\nexport function ContextMenuItem({\n className,\n style,\n icon,\n iconRight,\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 { submenuDelay } = useContext(ContextMenuSettingsCtx);\n\n const hoverAvailable = useMediaQuery(`(hover: hover)`);\n\n const [submenuPosition, setSubmenuPosition] = useState<{ x: number; y: number } | null>(null);\n\n const { start: startShowingSubmenu, clear: stopShowingSubmenu } = useTimeout(() => {\n const { top: y, right: x } = ref.current!.getBoundingClientRect();\n setSubmenuPosition({ x, y });\n }, submenuDelay);\n\n const { start: startHidingSubmenu, clear: stopHidingSubmenu } = useTimeout(() => {\n setSubmenuPosition(null);\n }, submenuDelay);\n\n const showSubmenu = () => {\n stopHidingSubmenu();\n startShowingSubmenu();\n };\n\n const hideSubmenu = () => {\n stopShowingSubmenu();\n startHidingSubmenu();\n };\n\n const hasSubmenu = items && !disabled;\n const showSubmenuOnHover = hasSubmenu && hoverAvailable;\n\n const handleClick: MouseEventHandler<HTMLButtonElement> | undefined = hasSubmenu\n ? (e) => {\n e.stopPropagation();\n showSubmenu();\n }\n : onClick\n ? (e) => {\n onHide();\n onClick!(e);\n }\n : undefined;\n\n return (\n <div\n onMouseEnter={showSubmenuOnHover ? showSubmenu : undefined}\n onMouseLeave={showSubmenuOnHover ? hideSubmenu : undefined}\n >\n <UnstyledButton\n ref={ref}\n style={[\n (theme) => {\n const { colors } = theme;\n const parsedColor = color ? parseThemeColor({ color, theme }).value : undefined;\n return {\n '--mantine-contextmenu-item-button-color': parsedColor ? parsedColor : 'var(--mantine-color-text)',\n '--mantine-contextmenu-item-button-hover-bg-color-light': parsedColor\n ? rgba(parsedColor, 0.08)\n : rgba(colors.gray[4], 0.25),\n '--mantine-contextmenu-item-button-hover-bg-color-dark': parsedColor\n ? rgba(parsedColor, 0.15)\n : rgba(colors.dark[3], 0.25),\n '--mantine-contextmenu-item-button-pressed-bg-color-light': parsedColor\n ? rgba(parsedColor, 0.2)\n : rgba(colors.gray[4], 0.5),\n '--mantine-contextmenu-item-button-pressed-bg-color-dark': parsedColor\n ? rgba(parsedColor, 0.3)\n : rgba(colors.dark[3], 0.5),\n };\n },\n style,\n ]}\n className={clsx('mantine-contextmenu-item-button', className)}\n disabled={disabled}\n onClick={handleClick}\n >\n {icon && (\n <Box fz={0} mr=\"xs\" mt={-2}>\n {icon}\n </Box>\n )}\n <div className=\"mantine-contextmenu-item-button-title\">{title}</div>\n { iconRight ? (\n <Box fz={0} ml=\"xs\" mt={-2}>\n {iconRight}\n </Box>\n ) : items && (\n <Box fz={10} mt={-2} ml=\"xs\">\n ▶\n </Box>\n )}\n </UnstyledButton>\n {submenuPosition && <ContextMenu content={items as ContextMenuContent} onHide={onHide} {...submenuPosition} />}\n </div>\n );\n}\n","import { Paper, px, useDirection } from '@mantine/core';\nimport { useResizeObserver } from '@mantine/hooks';\nimport clsx from 'clsx';\nimport { useContext } from 'react';\nimport { ContextMenuDivider } from './ContextMenuDivider';\nimport { ContextMenuItem } from './ContextMenuItem';\nimport { ContextMenuSettingsCtx } from './ContextMenuProvider';\nimport type { ContextMenuContent, ContextMenuOptions } from './types';\nimport { humanize } from './utils';\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({ x, y, content, zIndex, onHide, className, style, classNames, styles }: ContextMenuProps) {\n const { shadow, borderRadius } = useContext(ContextMenuSettingsCtx);\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 const { dir } = useDirection();\n\n return (\n <Paper\n ref={paperRef}\n shadow={shadow}\n radius={borderRadius}\n className={clsx('mantine-contextmenu', className, classNames?.root)}\n style={[\n ({ spacing: { md } }) => {\n const mdSpacing = px(md) as number;\n return {\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 },\n style,\n styles?.root,\n ]}\n >\n {Array.isArray(content)\n ? content.map(({ key, hidden, className, style, onClick, items, title, ...otherOptions }) =>\n hidden ? null : onClick || items ? (\n <ContextMenuItem\n key={key}\n className={clsx(classNames?.item, className)}\n style={[styles?.item, style]}\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={clsx(classNames?.divider, className)}\n style={[styles?.divider, style]}\n />\n )\n )\n : content(onHide)}\n </Paper>\n );\n}\n","import { createContext, useContext, useState } from 'react';\nimport type { ContextMenuInstanceOptions } from './ContextMenu';\nimport { ContextMenuPortal } from './ContextMenuPortal';\nimport type {\n ContextMenuOptions,\n ContextMenuProviderProps,\n ContextMenuSettings,\n HideContextMenuFunction,\n ShowContextMenuFunction,\n WithRequiredProperty,\n} from './types';\n\nconst DEFAULT_SETTINGS: WithRequiredProperty<ContextMenuSettings, 'shadow' | 'borderRadius' | 'submenuDelay'> = {\n shadow: 'sm',\n borderRadius: 'xs',\n submenuDelay: 500,\n};\n\nexport const ContextMenuSettingsCtx = createContext(DEFAULT_SETTINGS);\nexport const ContextMenuCtx = createContext<{\n /**\n * Function that shows the context menu.\n */\n showContextMenu: ShowContextMenuFunction;\n\n /**\n * Function that hides the context menu.\n */\n hideContextMenu: HideContextMenuFunction;\n\n /**\n * Boolean indicating whether the context menu is currently visible.\n */\n isContextMenuVisible: boolean;\n}>({ showContextMenu: () => () => undefined, hideContextMenu: () => undefined, isContextMenuVisible: false });\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 = DEFAULT_SETTINGS.shadow,\n borderRadius = DEFAULT_SETTINGS.borderRadius,\n submenuDelay = DEFAULT_SETTINGS.submenuDelay,\n children,\n}: ContextMenuProviderProps) {\n const [data, setData] = useState<(ContextMenuInstanceOptions & ContextMenuOptions) | null>(null);\n\n const hideContextMenu = () => {\n setData(null);\n };\n\n const showContextMenu: ShowContextMenuFunction = (content, options) => (e: React.MouseEvent | React.TouchEvent) => {\n e.preventDefault();\n e.stopPropagation();\n\n const x = \"touches\" in e\n ? e.touches[0].clientX\n : e.clientX;\n const y = \"touches\" in e\n ? e.touches[0].clientY\n : e.clientY;\n\n setData({\n x,\n y,\n content,\n zIndex: options?.zIndex || zIndex,\n className: options?.className,\n style: options?.style,\n classNames: options?.classNames,\n styles: options?.styles,\n });\n };\n\n return (\n <ContextMenuSettingsCtx.Provider value={{ shadow, borderRadius, submenuDelay }}>\n <ContextMenuCtx.Provider value={{ showContextMenu, hideContextMenu, isContextMenuVisible: !!data }}>\n {children}\n {data && <ContextMenuPortal onHide={hideContextMenu} {...data} />}\n </ContextMenuCtx.Provider>\n </ContextMenuSettingsCtx.Provider>\n );\n}\n\n/**\n * Hook returning functions that show and hide the context menu.\n */\nexport function useContextMenu() {\n return useContext(ContextMenuCtx);\n}\n","import { Portal } from '@mantine/core';\nimport { useHotkeys, useWindowEvent } from '@mantine/hooks';\nimport { ContextMenu, type ContextMenuProps } from './ContextMenu';\nimport { ContextMenuOverlay } from './ContextMenuOverlay';\n\nexport type ContextMenuPortalProps = ContextMenuProps & {\n zIndex?: number;\n};\n\nexport function ContextMenuPortal({ onHide, zIndex, ...otherProps }: ContextMenuPortalProps) {\n useWindowEvent('resize', onHide);\n useWindowEvent('scroll', onHide);\n useHotkeys([['Escape', onHide]]);\n\n return (\n <Portal>\n <ContextMenuOverlay zIndex={zIndex} onHide={onHide}>\n <ContextMenu {...otherProps} onHide={onHide} />\n </ContextMenuOverlay>\n </Portal>\n );\n}\n","export type ContextMenuOverlayProps = React.PropsWithChildren<{\n zIndex: number | undefined;\n onHide: () => void;\n}>;\n\nexport function ContextMenuOverlay({ zIndex, children, onHide }: ContextMenuOverlayProps) {\n const handleHide = (e: React.MouseEvent) => {\n e.preventDefault();\n onHide();\n };\n return (\n <div className=\"mantine-contextmenu-overlay\" style={{ zIndex }} onClick={handleHide} onContextMenu={handleHide}>\n {children}\n </div>\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"],"mappings":"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","names":["package_exports","__export","ContextMenuCtx","ContextMenuDivider","ContextMenuItem","ContextMenuPortal","ContextMenuProvider","ContextMenuSettingsCtx","humanize","useContextMenu","__toCommonJS","import_core","import_clsx","import_jsx_runtime","ContextMenuDivider","className","style","clsx","import_core","import_hooks","import_clsx","import_react","import_core","import_hooks","import_clsx","import_react","import_react","import_core","import_hooks","import_jsx_runtime","ContextMenuOverlay","zIndex","children","onHide","handleHide","e","import_jsx_runtime","ContextMenuPortal","onHide","zIndex","otherProps","ContextMenuOverlay","ContextMenu","import_jsx_runtime","DEFAULT_SETTINGS","ContextMenuSettingsCtx","ContextMenuCtx","ContextMenuProvider","zIndex","shadow","borderRadius","submenuDelay","children","data","setData","hideContextMenu","showContextMenu","content","options","e","x","y","ContextMenuPortal","useContextMenu","humanize","value","str","import_jsx_runtime","ContextMenu","x","y","content","zIndex","onHide","className","style","classNames","styles","shadow","borderRadius","ContextMenuSettingsCtx","paperRef","width","height","windowWidth","windowHeight","dir","clsx","md","mdSpacing","key","hidden","onClick","items","title","otherOptions","ContextMenuItem","humanize","ContextMenuDivider","import_jsx_runtime","ContextMenuItem","className","style","icon","iconRight","title","color","disabled","onClick","onHide","items","ref","submenuDelay","ContextMenuSettingsCtx","hoverAvailable","submenuPosition","setSubmenuPosition","startShowingSubmenu","stopShowingSubmenu","y","x","startHidingSubmenu","stopHidingSubmenu","showSubmenu","hideSubmenu","hasSubmenu","showSubmenuOnHover","handleClick","e","theme","colors","parsedColor","clsx","ContextMenu"]}
package/dist/index.mjs CHANGED
@@ -1,2 +1,2 @@
1
- "use client";import{Box as Q}from"@mantine/core";import X from"clsx";import{jsx as Y}from"react/jsx-runtime";function W({className:e,style:t}){return Y(Q,{className:X("mantine-contextmenu-divider",e),style:t})}import{Box as k,UnstyledButton as se,parseThemeColor as me,rgba as l}from"@mantine/core";import{useMediaQuery as xe,useTimeout as _}from"@mantine/hooks";import ae from"clsx";import{useContext as pe,useRef as de,useState as le}from"react";import{Paper as ne,px as oe,useDirection as re}from"@mantine/core";import{useResizeObserver as ie}from"@mantine/hooks";import E from"clsx";import{useContext as ue}from"react";import{createContext as q,useContext as j,useState as ee}from"react";import{Portal as J}from"@mantine/core";import{useHotkeys as K,useWindowEvent as A}from"@mantine/hooks";import{jsx as Z}from"react/jsx-runtime";function T({zIndex:e,children:t,onHide:n}){let m=a=>{a.preventDefault(),n()};return Z("div",{className:"mantine-contextmenu-overlay",style:{zIndex:e},onClick:m,onContextMenu:m,children:t})}import{jsx as B}from"react/jsx-runtime";function F({onHide:e,zIndex:t,...n}){return A("resize",e),A("scroll",e),K([["Escape",e]]),B(J,{children:B(T,{zIndex:t,onHide:e,children:B(I,{...n,onHide:e})})})}import{jsx as L,jsxs as te}from"react/jsx-runtime";var D={shadow:"sm",borderRadius:"xs",submenuDelay:500},S=q(D),U=q({showContextMenu:()=>()=>{},hideContextMenu:()=>{},isContextMenuVisible:!1});function Ie({zIndex:e=9999,shadow:t=D.shadow,borderRadius:n=D.borderRadius,submenuDelay:m=D.submenuDelay,children:a}){let[p,C]=ee(null),x=()=>{C(null)},d=(c,r)=>i=>{i.preventDefault(),i.stopPropagation(),C({x:i.clientX,y:i.clientY,content:c,zIndex:r?.zIndex||e,className:r?.className,style:r?.style,classNames:r?.classNames,styles:r?.styles})};return L(S.Provider,{value:{shadow:t,borderRadius:n,submenuDelay:m},children:te(U.Provider,{value:{showContextMenu:d,hideContextMenu:x,isContextMenuVisible:!!p},children:[a,p&&L(F,{onHide:x,...p})]})})}function De(){return j(U)}function $(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 N}from"react/jsx-runtime";function I({x:e,y:t,content:n,zIndex:m,onHide:a,className:p,style:C,classNames:x,styles:d}){let{shadow:c,borderRadius:r}=ue(S),[i]=ie(),{width:y,height:h}=i.current?.getBoundingClientRect()||{width:0,height:0},M=0,b=0;typeof window<"u"&&({innerWidth:M,innerHeight:b}=window);let{dir:R}=re();return N(ne,{ref:i,shadow:c,radius:r,className:E("mantine-contextmenu",p,x?.root),style:[({spacing:{md:f}})=>{let o=oe(f);return{zIndex:m,top:t+h+o>b?b-h-o:t,left:R==="ltr"?e+y+o>M?M-y-o:e:M-o-(e-y-o<0?y+o:e)}},C,d?.root],children:Array.isArray(n)?n.map(({key:f,hidden:o,className:P,style:H,onClick:g,items:w,title:z,...u})=>o?null:g||w?N(V,{className:E(x?.item,P),style:[d?.item,H],title:z??$(f),onClick:g,onHide:a,items:w,...u},f):N(W,{className:E(x?.divider,P),style:[d?.divider,H]},f)):n(a)})}import{jsx as O,jsxs as G}from"react/jsx-runtime";function V({className:e,style:t,icon:n,iconRight:m,title:a,color:p,disabled:C,onClick:x,onHide:d,items:c}){let r=de(null),{submenuDelay:i}=pe(S),y=xe("(hover: hover)"),[h,M]=le(null),{start:b,clear:R}=_(()=>{let{top:u,right:v}=r.current.getBoundingClientRect();M({x:v,y:u})},i),{start:f,clear:o}=_(()=>{M(null)},i),P=()=>{o(),b()},H=()=>{R(),f()},g=c&&!C,w=g&&y,z=g?u=>{u.stopPropagation(),P()}:x?u=>{d(),x(u)}:void 0;return G("div",{onMouseEnter:w?P:void 0,onMouseLeave:w?H:void 0,children:[G(se,{ref:r,style:[u=>{let{colors:v}=u,s=p?me({color:p,theme:u}).value:void 0;return{"--mantine-contextmenu-item-button-color":s||"var(--mantine-color-text)","--mantine-contextmenu-item-button-hover-bg-color-light":s?l(s,.08):l(v.gray[4],.25),"--mantine-contextmenu-item-button-hover-bg-color-dark":s?l(s,.15):l(v.dark[3],.25),"--mantine-contextmenu-item-button-pressed-bg-color-light":s?l(s,.2):l(v.gray[4],.5),"--mantine-contextmenu-item-button-pressed-bg-color-dark":s?l(s,.3):l(v.dark[3],.5)}},t],className:ae("mantine-contextmenu-item-button",e),disabled:C,onClick:z,children:[n&&O(k,{fz:0,mr:"xs",mt:-2,children:n}),O("div",{className:"mantine-contextmenu-item-button-title",children:a}),m?O(k,{fz:0,ml:"xs",mt:-2,children:m}):c&&O(k,{fz:10,mt:-2,ml:"xs",children:"\u25B6"})]}),h&&O(I,{content:c,onHide:d,...h})]})}export{U as ContextMenuCtx,W as ContextMenuDivider,V as ContextMenuItem,F as ContextMenuPortal,Ie as ContextMenuProvider,S as ContextMenuSettingsCtx,$ as humanize,De as useContextMenu};
1
+ "use client";import{Box as _}from"@mantine/core";import G from"clsx";import{jsx as Q}from"react/jsx-runtime";function T({className:e,style:t}){return Q(_,{className:G("mantine-contextmenu-divider",e),style:t})}import{Box as k,UnstyledButton as se,parseThemeColor as me,rgba as c}from"@mantine/core";import{useMediaQuery as xe,useTimeout as X}from"@mantine/hooks";import ae from"clsx";import{useContext as pe,useRef as le,useState as de}from"react";import{Paper as ne,px as oe,useDirection as re}from"@mantine/core";import{useResizeObserver as ue}from"@mantine/hooks";import B from"clsx";import{useContext as ie}from"react";import{createContext as q,useContext as j,useState as ee}from"react";import{Portal as J}from"@mantine/core";import{useHotkeys as K,useWindowEvent as A}from"@mantine/hooks";import{jsx as Z}from"react/jsx-runtime";function W({zIndex:e,children:t,onHide:o}){let m=a=>{a.preventDefault(),o()};return Z("div",{className:"mantine-contextmenu-overlay",style:{zIndex:e},onClick:m,onContextMenu:m,children:t})}import{jsx as E}from"react/jsx-runtime";function F({onHide:e,zIndex:t,...o}){return A("resize",e),A("scroll",e),K([["Escape",e]]),E(J,{children:E(W,{zIndex:t,onHide:e,children:E(I,{...o,onHide:e})})})}import{jsx as L,jsxs as te}from"react/jsx-runtime";var R={shadow:"sm",borderRadius:"xs",submenuDelay:500},S=q(R),U=q({showContextMenu:()=>()=>{},hideContextMenu:()=>{},isContextMenuVisible:!1});function Ie({zIndex:e=9999,shadow:t=R.shadow,borderRadius:o=R.borderRadius,submenuDelay:m=R.submenuDelay,children:a}){let[p,C]=ee(null),x=()=>{C(null)},l=(M,u)=>n=>{n.preventDefault(),n.stopPropagation();let d="touches"in n?n.touches[0].clientX:n.clientX,f="touches"in n?n.touches[0].clientY:n.clientY;C({x:d,y:f,content:M,zIndex:u?.zIndex||e,className:u?.className,style:u?.style,classNames:u?.classNames,styles:u?.styles})};return L(S.Provider,{value:{shadow:t,borderRadius:o,submenuDelay:m},children:te(U.Provider,{value:{showContextMenu:l,hideContextMenu:x,isContextMenuVisible:!!p},children:[a,p&&L(F,{onHide:x,...p})]})})}function Re(){return j(U)}function $(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 N}from"react/jsx-runtime";function I({x:e,y:t,content:o,zIndex:m,onHide:a,className:p,style:C,classNames:x,styles:l}){let{shadow:M,borderRadius:u}=ie(S),[n]=ue(),{width:d,height:f}=n.current?.getBoundingClientRect()||{width:0,height:0},h=0,b=0;typeof window<"u"&&({innerWidth:h,innerHeight:b}=window);let{dir:D}=re();return N(ne,{ref:n,shadow:M,radius:u,className:B("mantine-contextmenu",p,x?.root),style:[({spacing:{md:v}})=>{let r=oe(v);return{zIndex:m,top:t+f+r>b?b-f-r:t,left:D==="ltr"?e+d+r>h?h-d-r:e:h-r-(e-d-r<0?d+r:e)}},C,l?.root],children:Array.isArray(o)?o.map(({key:v,hidden:r,className:P,style:H,onClick:g,items:w,title:z,...i})=>r?null:g||w?N(V,{className:B(x?.item,P),style:[l?.item,H],title:z??$(v),onClick:g,onHide:a,items:w,...i},v):N(T,{className:B(x?.divider,P),style:[l?.divider,H]},v)):o(a)})}import{jsx as O,jsxs as Y}from"react/jsx-runtime";function V({className:e,style:t,icon:o,iconRight:m,title:a,color:p,disabled:C,onClick:x,onHide:l,items:M}){let u=le(null),{submenuDelay:n}=pe(S),d=xe("(hover: hover)"),[f,h]=de(null),{start:b,clear:D}=X(()=>{let{top:i,right:y}=u.current.getBoundingClientRect();h({x:y,y:i})},n),{start:v,clear:r}=X(()=>{h(null)},n),P=()=>{r(),b()},H=()=>{D(),v()},g=M&&!C,w=g&&d,z=g?i=>{i.stopPropagation(),P()}:x?i=>{l(),x(i)}:void 0;return Y("div",{onMouseEnter:w?P:void 0,onMouseLeave:w?H:void 0,children:[Y(se,{ref:u,style:[i=>{let{colors:y}=i,s=p?me({color:p,theme:i}).value:void 0;return{"--mantine-contextmenu-item-button-color":s||"var(--mantine-color-text)","--mantine-contextmenu-item-button-hover-bg-color-light":s?c(s,.08):c(y.gray[4],.25),"--mantine-contextmenu-item-button-hover-bg-color-dark":s?c(s,.15):c(y.dark[3],.25),"--mantine-contextmenu-item-button-pressed-bg-color-light":s?c(s,.2):c(y.gray[4],.5),"--mantine-contextmenu-item-button-pressed-bg-color-dark":s?c(s,.3):c(y.dark[3],.5)}},t],className:ae("mantine-contextmenu-item-button",e),disabled:C,onClick:z,children:[o&&O(k,{fz:0,mr:"xs",mt:-2,children:o}),O("div",{className:"mantine-contextmenu-item-button-title",children:a}),m?O(k,{fz:0,ml:"xs",mt:-2,children:m}):M&&O(k,{fz:10,mt:-2,ml:"xs",children:"\u25B6"})]}),f&&O(I,{content:M,onHide:l,...f})]})}export{U as ContextMenuCtx,T as ContextMenuDivider,V as ContextMenuItem,F as ContextMenuPortal,Ie as ContextMenuProvider,S as ContextMenuSettingsCtx,$ as humanize,Re as useContextMenu};
2
2
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../package/ContextMenuDivider.tsx","../package/ContextMenuItem.tsx","../package/ContextMenu.tsx","../package/ContextMenuProvider.tsx","../package/ContextMenuPortal.tsx","../package/ContextMenuOverlay.tsx","../package/utils.ts"],"sourcesContent":["import { Box } from '@mantine/core';\nimport clsx from 'clsx';\nimport type { ContextMenuItemOptions } from './types';\n\nexport type ContextMenuDividerProps = Pick<ContextMenuItemOptions, 'className' | 'style'>;\n\nexport function ContextMenuDivider({ className, style }: ContextMenuDividerProps) {\n return <Box className={clsx('mantine-contextmenu-divider', className)} style={style} />;\n}\n","import { Box, UnstyledButton, parseThemeColor, rgba } from '@mantine/core';\nimport { useMediaQuery, useTimeout } from '@mantine/hooks';\nimport clsx from 'clsx';\nimport { useContext, useRef, useState, type MouseEventHandler } from 'react';\nimport { ContextMenu } from './ContextMenu';\nimport { ContextMenuSettingsCtx } from './ContextMenuProvider';\nimport type { ContextMenuContent, ContextMenuItemOptions, WithRequiredProperty } from './types';\n\nexport function ContextMenuItem({\n className,\n style,\n icon,\n iconRight,\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 { submenuDelay } = useContext(ContextMenuSettingsCtx);\n\n const hoverAvailable = useMediaQuery(`(hover: hover)`);\n\n const [submenuPosition, setSubmenuPosition] = useState<{ x: number; y: number } | null>(null);\n\n const { start: startShowingSubmenu, clear: stopShowingSubmenu } = useTimeout(() => {\n const { top: y, right: x } = ref.current!.getBoundingClientRect();\n setSubmenuPosition({ x, y });\n }, submenuDelay);\n\n const { start: startHidingSubmenu, clear: stopHidingSubmenu } = useTimeout(() => {\n setSubmenuPosition(null);\n }, submenuDelay);\n\n const showSubmenu = () => {\n stopHidingSubmenu();\n startShowingSubmenu();\n };\n\n const hideSubmenu = () => {\n stopShowingSubmenu();\n startHidingSubmenu();\n };\n\n const hasSubmenu = items && !disabled;\n const showSubmenuOnHover = hasSubmenu && hoverAvailable;\n\n const handleClick: MouseEventHandler<HTMLButtonElement> | undefined = hasSubmenu\n ? (e) => {\n e.stopPropagation();\n showSubmenu();\n }\n : onClick\n ? (e) => {\n onHide();\n onClick!(e);\n }\n : undefined;\n\n return (\n <div\n onMouseEnter={showSubmenuOnHover ? showSubmenu : undefined}\n onMouseLeave={showSubmenuOnHover ? hideSubmenu : undefined}\n >\n <UnstyledButton\n ref={ref}\n style={[\n (theme) => {\n const { colors } = theme;\n const parsedColor = color ? parseThemeColor({ color, theme }).value : undefined;\n return {\n '--mantine-contextmenu-item-button-color': parsedColor ? parsedColor : 'var(--mantine-color-text)',\n '--mantine-contextmenu-item-button-hover-bg-color-light': parsedColor\n ? rgba(parsedColor, 0.08)\n : rgba(colors.gray[4], 0.25),\n '--mantine-contextmenu-item-button-hover-bg-color-dark': parsedColor\n ? rgba(parsedColor, 0.15)\n : rgba(colors.dark[3], 0.25),\n '--mantine-contextmenu-item-button-pressed-bg-color-light': parsedColor\n ? rgba(parsedColor, 0.2)\n : rgba(colors.gray[4], 0.5),\n '--mantine-contextmenu-item-button-pressed-bg-color-dark': parsedColor\n ? rgba(parsedColor, 0.3)\n : rgba(colors.dark[3], 0.5),\n };\n },\n style,\n ]}\n className={clsx('mantine-contextmenu-item-button', className)}\n disabled={disabled}\n onClick={handleClick}\n >\n {icon && (\n <Box fz={0} mr=\"xs\" mt={-2}>\n {icon}\n </Box>\n )}\n <div className=\"mantine-contextmenu-item-button-title\">{title}</div>\n { iconRight ? (\n <Box fz={0} ml=\"xs\" mt={-2}>\n {iconRight}\n </Box>\n ) : items && (\n <Box fz={10} mt={-2} ml=\"xs\">\n ▶\n </Box>\n )}\n </UnstyledButton>\n {submenuPosition && <ContextMenu content={items as ContextMenuContent} onHide={onHide} {...submenuPosition} />}\n </div>\n );\n}\n","import { Paper, px, useDirection } from '@mantine/core';\nimport { useResizeObserver } from '@mantine/hooks';\nimport clsx from 'clsx';\nimport { useContext } from 'react';\nimport { ContextMenuDivider } from './ContextMenuDivider';\nimport { ContextMenuItem } from './ContextMenuItem';\nimport { ContextMenuSettingsCtx } from './ContextMenuProvider';\nimport type { ContextMenuContent, ContextMenuOptions } from './types';\nimport { humanize } from './utils';\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({ x, y, content, zIndex, onHide, className, style, classNames, styles }: ContextMenuProps) {\n const { shadow, borderRadius } = useContext(ContextMenuSettingsCtx);\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 const { dir } = useDirection();\n\n return (\n <Paper\n ref={paperRef}\n shadow={shadow}\n radius={borderRadius}\n className={clsx('mantine-contextmenu', className, classNames?.root)}\n style={[\n ({ spacing: { md } }) => {\n const mdSpacing = px(md) as number;\n return {\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 },\n style,\n styles?.root,\n ]}\n >\n {Array.isArray(content)\n ? content.map(({ key, hidden, className, style, onClick, items, title, ...otherOptions }) =>\n hidden ? null : onClick || items ? (\n <ContextMenuItem\n key={key}\n className={clsx(classNames?.item, className)}\n style={[styles?.item, style]}\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={clsx(classNames?.divider, className)}\n style={[styles?.divider, style]}\n />\n )\n )\n : content(onHide)}\n </Paper>\n );\n}\n","import { createContext, useContext, useState } from 'react';\nimport type { ContextMenuInstanceOptions } from './ContextMenu';\nimport { ContextMenuPortal } from './ContextMenuPortal';\nimport type {\n ContextMenuOptions,\n ContextMenuProviderProps,\n ContextMenuSettings,\n HideContextMenuFunction,\n ShowContextMenuFunction,\n WithRequiredProperty,\n} from './types';\n\nconst DEFAULT_SETTINGS: WithRequiredProperty<ContextMenuSettings, 'shadow' | 'borderRadius' | 'submenuDelay'> = {\n shadow: 'sm',\n borderRadius: 'xs',\n submenuDelay: 500,\n};\n\nexport const ContextMenuSettingsCtx = createContext(DEFAULT_SETTINGS);\nexport const ContextMenuCtx = createContext<{\n /**\n * Function that shows the context menu.\n */\n showContextMenu: ShowContextMenuFunction;\n\n /**\n * Function that hides the context menu.\n */\n hideContextMenu: HideContextMenuFunction;\n\n /**\n * Boolean indicating whether the context menu is currently visible.\n */\n isContextMenuVisible: boolean;\n}>({ showContextMenu: () => () => undefined, hideContextMenu: () => undefined, isContextMenuVisible: false });\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 = DEFAULT_SETTINGS.shadow,\n borderRadius = DEFAULT_SETTINGS.borderRadius,\n submenuDelay = DEFAULT_SETTINGS.submenuDelay,\n children,\n}: ContextMenuProviderProps) {\n const [data, setData] = useState<(ContextMenuInstanceOptions & ContextMenuOptions) | null>(null);\n\n const hideContextMenu = () => {\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 className: options?.className,\n style: options?.style,\n classNames: options?.classNames,\n styles: options?.styles,\n });\n };\n\n return (\n <ContextMenuSettingsCtx.Provider value={{ shadow, borderRadius, submenuDelay }}>\n <ContextMenuCtx.Provider value={{ showContextMenu, hideContextMenu, isContextMenuVisible: !!data }}>\n {children}\n {data && <ContextMenuPortal onHide={hideContextMenu} {...data} />}\n </ContextMenuCtx.Provider>\n </ContextMenuSettingsCtx.Provider>\n );\n}\n\n/**\n * Hook returning functions that show and hide the context menu.\n */\nexport function useContextMenu() {\n return useContext(ContextMenuCtx);\n}\n","import { Portal } from '@mantine/core';\nimport { useHotkeys, useWindowEvent } from '@mantine/hooks';\nimport { ContextMenu, type ContextMenuProps } from './ContextMenu';\nimport { ContextMenuOverlay } from './ContextMenuOverlay';\n\nexport type ContextMenuPortalProps = ContextMenuProps & {\n zIndex?: number;\n};\n\nexport function ContextMenuPortal({ onHide, zIndex, ...otherProps }: ContextMenuPortalProps) {\n useWindowEvent('resize', onHide);\n useWindowEvent('scroll', onHide);\n useHotkeys([['Escape', onHide]]);\n\n return (\n <Portal>\n <ContextMenuOverlay zIndex={zIndex} onHide={onHide}>\n <ContextMenu {...otherProps} onHide={onHide} />\n </ContextMenuOverlay>\n </Portal>\n );\n}\n","export type ContextMenuOverlayProps = React.PropsWithChildren<{\n zIndex: number | undefined;\n onHide: () => void;\n}>;\n\nexport function ContextMenuOverlay({ zIndex, children, onHide }: ContextMenuOverlayProps) {\n const handleHide = (e: React.MouseEvent) => {\n e.preventDefault();\n onHide();\n };\n return (\n <div className=\"mantine-contextmenu-overlay\" style={{ zIndex }} onClick={handleHide} onContextMenu={handleHide}>\n {children}\n </div>\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"],"mappings":"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","names":["Box","clsx","jsx","ContextMenuDivider","className","style","Box","UnstyledButton","parseThemeColor","rgba","useMediaQuery","useTimeout","clsx","useContext","useRef","useState","Paper","px","useDirection","useResizeObserver","clsx","useContext","createContext","useContext","useState","Portal","useHotkeys","useWindowEvent","jsx","ContextMenuOverlay","zIndex","children","onHide","handleHide","e","jsx","ContextMenuPortal","onHide","zIndex","otherProps","useWindowEvent","useHotkeys","Portal","ContextMenuOverlay","ContextMenu","jsx","jsxs","DEFAULT_SETTINGS","ContextMenuSettingsCtx","createContext","ContextMenuCtx","ContextMenuProvider","zIndex","shadow","borderRadius","submenuDelay","children","data","setData","useState","hideContextMenu","showContextMenu","content","options","e","ContextMenuPortal","useContextMenu","useContext","humanize","value","str","jsx","ContextMenu","x","y","content","zIndex","onHide","className","style","classNames","styles","shadow","borderRadius","useContext","ContextMenuSettingsCtx","paperRef","useResizeObserver","width","height","windowWidth","windowHeight","dir","useDirection","Paper","clsx","md","mdSpacing","px","key","hidden","onClick","items","title","otherOptions","ContextMenuItem","humanize","ContextMenuDivider","jsx","jsxs","ContextMenuItem","className","style","icon","iconRight","title","color","disabled","onClick","onHide","items","ref","useRef","submenuDelay","useContext","ContextMenuSettingsCtx","hoverAvailable","useMediaQuery","submenuPosition","setSubmenuPosition","useState","startShowingSubmenu","stopShowingSubmenu","useTimeout","y","x","startHidingSubmenu","stopHidingSubmenu","showSubmenu","hideSubmenu","hasSubmenu","showSubmenuOnHover","handleClick","e","UnstyledButton","theme","colors","parsedColor","parseThemeColor","rgba","clsx","Box","ContextMenu"]}
1
+ {"version":3,"sources":["../package/ContextMenuDivider.tsx","../package/ContextMenuItem.tsx","../package/ContextMenu.tsx","../package/ContextMenuProvider.tsx","../package/ContextMenuPortal.tsx","../package/ContextMenuOverlay.tsx","../package/utils.ts"],"sourcesContent":["import { Box } from '@mantine/core';\nimport clsx from 'clsx';\nimport type { ContextMenuItemOptions } from './types';\n\nexport type ContextMenuDividerProps = Pick<ContextMenuItemOptions, 'className' | 'style'>;\n\nexport function ContextMenuDivider({ className, style }: ContextMenuDividerProps) {\n return <Box className={clsx('mantine-contextmenu-divider', className)} style={style} />;\n}\n","import { Box, UnstyledButton, parseThemeColor, rgba } from '@mantine/core';\nimport { useMediaQuery, useTimeout } from '@mantine/hooks';\nimport clsx from 'clsx';\nimport { useContext, useRef, useState, type MouseEventHandler } from 'react';\nimport { ContextMenu } from './ContextMenu';\nimport { ContextMenuSettingsCtx } from './ContextMenuProvider';\nimport type { ContextMenuContent, ContextMenuItemOptions, WithRequiredProperty } from './types';\n\nexport function ContextMenuItem({\n className,\n style,\n icon,\n iconRight,\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 { submenuDelay } = useContext(ContextMenuSettingsCtx);\n\n const hoverAvailable = useMediaQuery(`(hover: hover)`);\n\n const [submenuPosition, setSubmenuPosition] = useState<{ x: number; y: number } | null>(null);\n\n const { start: startShowingSubmenu, clear: stopShowingSubmenu } = useTimeout(() => {\n const { top: y, right: x } = ref.current!.getBoundingClientRect();\n setSubmenuPosition({ x, y });\n }, submenuDelay);\n\n const { start: startHidingSubmenu, clear: stopHidingSubmenu } = useTimeout(() => {\n setSubmenuPosition(null);\n }, submenuDelay);\n\n const showSubmenu = () => {\n stopHidingSubmenu();\n startShowingSubmenu();\n };\n\n const hideSubmenu = () => {\n stopShowingSubmenu();\n startHidingSubmenu();\n };\n\n const hasSubmenu = items && !disabled;\n const showSubmenuOnHover = hasSubmenu && hoverAvailable;\n\n const handleClick: MouseEventHandler<HTMLButtonElement> | undefined = hasSubmenu\n ? (e) => {\n e.stopPropagation();\n showSubmenu();\n }\n : onClick\n ? (e) => {\n onHide();\n onClick!(e);\n }\n : undefined;\n\n return (\n <div\n onMouseEnter={showSubmenuOnHover ? showSubmenu : undefined}\n onMouseLeave={showSubmenuOnHover ? hideSubmenu : undefined}\n >\n <UnstyledButton\n ref={ref}\n style={[\n (theme) => {\n const { colors } = theme;\n const parsedColor = color ? parseThemeColor({ color, theme }).value : undefined;\n return {\n '--mantine-contextmenu-item-button-color': parsedColor ? parsedColor : 'var(--mantine-color-text)',\n '--mantine-contextmenu-item-button-hover-bg-color-light': parsedColor\n ? rgba(parsedColor, 0.08)\n : rgba(colors.gray[4], 0.25),\n '--mantine-contextmenu-item-button-hover-bg-color-dark': parsedColor\n ? rgba(parsedColor, 0.15)\n : rgba(colors.dark[3], 0.25),\n '--mantine-contextmenu-item-button-pressed-bg-color-light': parsedColor\n ? rgba(parsedColor, 0.2)\n : rgba(colors.gray[4], 0.5),\n '--mantine-contextmenu-item-button-pressed-bg-color-dark': parsedColor\n ? rgba(parsedColor, 0.3)\n : rgba(colors.dark[3], 0.5),\n };\n },\n style,\n ]}\n className={clsx('mantine-contextmenu-item-button', className)}\n disabled={disabled}\n onClick={handleClick}\n >\n {icon && (\n <Box fz={0} mr=\"xs\" mt={-2}>\n {icon}\n </Box>\n )}\n <div className=\"mantine-contextmenu-item-button-title\">{title}</div>\n { iconRight ? (\n <Box fz={0} ml=\"xs\" mt={-2}>\n {iconRight}\n </Box>\n ) : items && (\n <Box fz={10} mt={-2} ml=\"xs\">\n ▶\n </Box>\n )}\n </UnstyledButton>\n {submenuPosition && <ContextMenu content={items as ContextMenuContent} onHide={onHide} {...submenuPosition} />}\n </div>\n );\n}\n","import { Paper, px, useDirection } from '@mantine/core';\nimport { useResizeObserver } from '@mantine/hooks';\nimport clsx from 'clsx';\nimport { useContext } from 'react';\nimport { ContextMenuDivider } from './ContextMenuDivider';\nimport { ContextMenuItem } from './ContextMenuItem';\nimport { ContextMenuSettingsCtx } from './ContextMenuProvider';\nimport type { ContextMenuContent, ContextMenuOptions } from './types';\nimport { humanize } from './utils';\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({ x, y, content, zIndex, onHide, className, style, classNames, styles }: ContextMenuProps) {\n const { shadow, borderRadius } = useContext(ContextMenuSettingsCtx);\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 const { dir } = useDirection();\n\n return (\n <Paper\n ref={paperRef}\n shadow={shadow}\n radius={borderRadius}\n className={clsx('mantine-contextmenu', className, classNames?.root)}\n style={[\n ({ spacing: { md } }) => {\n const mdSpacing = px(md) as number;\n return {\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 },\n style,\n styles?.root,\n ]}\n >\n {Array.isArray(content)\n ? content.map(({ key, hidden, className, style, onClick, items, title, ...otherOptions }) =>\n hidden ? null : onClick || items ? (\n <ContextMenuItem\n key={key}\n className={clsx(classNames?.item, className)}\n style={[styles?.item, style]}\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={clsx(classNames?.divider, className)}\n style={[styles?.divider, style]}\n />\n )\n )\n : content(onHide)}\n </Paper>\n );\n}\n","import { createContext, useContext, useState } from 'react';\nimport type { ContextMenuInstanceOptions } from './ContextMenu';\nimport { ContextMenuPortal } from './ContextMenuPortal';\nimport type {\n ContextMenuOptions,\n ContextMenuProviderProps,\n ContextMenuSettings,\n HideContextMenuFunction,\n ShowContextMenuFunction,\n WithRequiredProperty,\n} from './types';\n\nconst DEFAULT_SETTINGS: WithRequiredProperty<ContextMenuSettings, 'shadow' | 'borderRadius' | 'submenuDelay'> = {\n shadow: 'sm',\n borderRadius: 'xs',\n submenuDelay: 500,\n};\n\nexport const ContextMenuSettingsCtx = createContext(DEFAULT_SETTINGS);\nexport const ContextMenuCtx = createContext<{\n /**\n * Function that shows the context menu.\n */\n showContextMenu: ShowContextMenuFunction;\n\n /**\n * Function that hides the context menu.\n */\n hideContextMenu: HideContextMenuFunction;\n\n /**\n * Boolean indicating whether the context menu is currently visible.\n */\n isContextMenuVisible: boolean;\n}>({ showContextMenu: () => () => undefined, hideContextMenu: () => undefined, isContextMenuVisible: false });\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 = DEFAULT_SETTINGS.shadow,\n borderRadius = DEFAULT_SETTINGS.borderRadius,\n submenuDelay = DEFAULT_SETTINGS.submenuDelay,\n children,\n}: ContextMenuProviderProps) {\n const [data, setData] = useState<(ContextMenuInstanceOptions & ContextMenuOptions) | null>(null);\n\n const hideContextMenu = () => {\n setData(null);\n };\n\n const showContextMenu: ShowContextMenuFunction = (content, options) => (e: React.MouseEvent | React.TouchEvent) => {\n e.preventDefault();\n e.stopPropagation();\n\n const x = \"touches\" in e\n ? e.touches[0].clientX\n : e.clientX;\n const y = \"touches\" in e\n ? e.touches[0].clientY\n : e.clientY;\n\n setData({\n x,\n y,\n content,\n zIndex: options?.zIndex || zIndex,\n className: options?.className,\n style: options?.style,\n classNames: options?.classNames,\n styles: options?.styles,\n });\n };\n\n return (\n <ContextMenuSettingsCtx.Provider value={{ shadow, borderRadius, submenuDelay }}>\n <ContextMenuCtx.Provider value={{ showContextMenu, hideContextMenu, isContextMenuVisible: !!data }}>\n {children}\n {data && <ContextMenuPortal onHide={hideContextMenu} {...data} />}\n </ContextMenuCtx.Provider>\n </ContextMenuSettingsCtx.Provider>\n );\n}\n\n/**\n * Hook returning functions that show and hide the context menu.\n */\nexport function useContextMenu() {\n return useContext(ContextMenuCtx);\n}\n","import { Portal } from '@mantine/core';\nimport { useHotkeys, useWindowEvent } from '@mantine/hooks';\nimport { ContextMenu, type ContextMenuProps } from './ContextMenu';\nimport { ContextMenuOverlay } from './ContextMenuOverlay';\n\nexport type ContextMenuPortalProps = ContextMenuProps & {\n zIndex?: number;\n};\n\nexport function ContextMenuPortal({ onHide, zIndex, ...otherProps }: ContextMenuPortalProps) {\n useWindowEvent('resize', onHide);\n useWindowEvent('scroll', onHide);\n useHotkeys([['Escape', onHide]]);\n\n return (\n <Portal>\n <ContextMenuOverlay zIndex={zIndex} onHide={onHide}>\n <ContextMenu {...otherProps} onHide={onHide} />\n </ContextMenuOverlay>\n </Portal>\n );\n}\n","export type ContextMenuOverlayProps = React.PropsWithChildren<{\n zIndex: number | undefined;\n onHide: () => void;\n}>;\n\nexport function ContextMenuOverlay({ zIndex, children, onHide }: ContextMenuOverlayProps) {\n const handleHide = (e: React.MouseEvent) => {\n e.preventDefault();\n onHide();\n };\n return (\n <div className=\"mantine-contextmenu-overlay\" style={{ zIndex }} onClick={handleHide} onContextMenu={handleHide}>\n {children}\n </div>\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"],"mappings":"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","names":["Box","clsx","jsx","ContextMenuDivider","className","style","Box","UnstyledButton","parseThemeColor","rgba","useMediaQuery","useTimeout","clsx","useContext","useRef","useState","Paper","px","useDirection","useResizeObserver","clsx","useContext","createContext","useContext","useState","Portal","useHotkeys","useWindowEvent","jsx","ContextMenuOverlay","zIndex","children","onHide","handleHide","e","jsx","ContextMenuPortal","onHide","zIndex","otherProps","useWindowEvent","useHotkeys","Portal","ContextMenuOverlay","ContextMenu","jsx","jsxs","DEFAULT_SETTINGS","ContextMenuSettingsCtx","createContext","ContextMenuCtx","ContextMenuProvider","zIndex","shadow","borderRadius","submenuDelay","children","data","setData","useState","hideContextMenu","showContextMenu","content","options","e","x","y","ContextMenuPortal","useContextMenu","useContext","humanize","value","str","jsx","ContextMenu","x","y","content","zIndex","onHide","className","style","classNames","styles","shadow","borderRadius","useContext","ContextMenuSettingsCtx","paperRef","useResizeObserver","width","height","windowWidth","windowHeight","dir","useDirection","Paper","clsx","md","mdSpacing","px","key","hidden","onClick","items","title","otherOptions","ContextMenuItem","humanize","ContextMenuDivider","jsx","jsxs","ContextMenuItem","className","style","icon","iconRight","title","color","disabled","onClick","onHide","items","ref","useRef","submenuDelay","useContext","ContextMenuSettingsCtx","hoverAvailable","useMediaQuery","submenuPosition","setSubmenuPosition","useState","startShowingSubmenu","stopShowingSubmenu","useTimeout","y","x","startHidingSubmenu","stopHidingSubmenu","showSubmenu","hideSubmenu","hasSubmenu","showSubmenuOnHover","handleClick","e","UnstyledButton","theme","colors","parsedColor","parseThemeColor","rgba","clsx","Box","ContextMenu"]}
@@ -1,2 +1,2 @@
1
- @layer mantine-contextmenu{.mantine-contextmenu{border:1px solid var(--mantine-color-gray-3);position:fixed}[data-mantine-color-scheme=dark] .mantine-contextmenu{border:1px solid var(--mantine-color-dark-4)}.mantine-contextmenu{overflow:hidden;transition:all .2s}.mantine-contextmenu-divider{background:var(--mantine-color-gray-1);height:calc(.0625rem*var(--mantine-scale))}}@layer mantine-contextmenu{[data-mantine-color-scheme=dark] .mantine-contextmenu-divider{background:var(--mantine-color-dark-5)}}@layer mantine-contextmenu{.mantine-contextmenu-item-button{align-items:center;color:var(--mantine-contextmenu-item-button-color);display:flex;padding:calc(var(--mantine-spacing-sm)/2) var(--mantine-spacing-sm);transition:background .2s;width:100%}.mantine-contextmenu-item-button[disabled]{color:var(--mantine-color-gray-5);cursor:not-allowed}[data-mantine-color-scheme=dark] .mantine-contextmenu-item-button[disabled]{color:var(--mantine-color-dark-3)}.mantine-contextmenu-item-button:hover:not([disabled]){background:var(--mantine-contextmenu-item-button-hover-bg-color-light)}[data-mantine-color-scheme=dark] .mantine-contextmenu-item-button:hover:not([disabled]){background:var(--mantine-contextmenu-item-button-hover-bg-color-dark)}.mantine-contextmenu-item-button:active:not([disabled]){background:var(--mantine-contextmenu-item-button-pressed-bg-color-light)}[data-mantine-color-scheme=dark] .mantine-contextmenu-item-button:active:not([disabled]){background:var(--mantine-contextmenu-item-button-pressed-bg-color-dark)}.mantine-contextmenu-item-button-title{flex-grow:1;font-size:var(--mantine-font-size-sm);white-space:nowrap}.mantine-contextmenu-overlay{background-color:transparent;height:100%;left:0;position:fixed;top:0;width:100%}}@layer mantine-contextmenu{}
1
+ @layer mantine-contextmenu{.mantine-contextmenu{border:1px solid var(--mantine-color-gray-3);position:fixed}[data-mantine-color-scheme=dark] .mantine-contextmenu{border:1px solid var(--mantine-color-dark-4)}.mantine-contextmenu{overflow:hidden;transition:all .2s}.mantine-contextmenu-divider{background:var(--mantine-color-gray-1);height:calc(.0625rem*var(--mantine-scale))}[data-mantine-color-scheme=dark] .mantine-contextmenu-divider{background:var(--mantine-color-dark-5)}.mantine-contextmenu-item-button{align-items:center;color:var(--mantine-contextmenu-item-button-color);display:flex;padding:calc(var(--mantine-spacing-sm)/2) var(--mantine-spacing-sm);transition:background .2s;width:100%}.mantine-contextmenu-item-button[disabled]{color:var(--mantine-color-gray-5);cursor:not-allowed}[data-mantine-color-scheme=dark] .mantine-contextmenu-item-button[disabled]{color:var(--mantine-color-dark-3)}.mantine-contextmenu-item-button:hover:not([disabled]){background:var(--mantine-contextmenu-item-button-hover-bg-color-light)}[data-mantine-color-scheme=dark] .mantine-contextmenu-item-button:hover:not([disabled]){background:var(--mantine-contextmenu-item-button-hover-bg-color-dark)}.mantine-contextmenu-item-button:active:not([disabled]){background:var(--mantine-contextmenu-item-button-pressed-bg-color-light)}[data-mantine-color-scheme=dark] .mantine-contextmenu-item-button:active:not([disabled]){background:var(--mantine-contextmenu-item-button-pressed-bg-color-dark)}.mantine-contextmenu-item-button-title{flex-grow:1;font-size:var(--mantine-font-size-sm);white-space:nowrap}.mantine-contextmenu-overlay{background-color:transparent;height:100%;left:0;position:fixed;top:0;width:100%}}@layer mantine-contextmenu{}@layer mantine-contextmenu{}@layer mantine-contextmenu{}
2
2
  /*# sourceMappingURL=styles.layer.css.map */
@@ -1 +1 @@
1
- {"version":3,"sources":["../package/ContextMenu.css","<no source>","../package/ContextMenuDivider.css","../package/ContextMenuItem.css","../package/ContextMenuOverlay.css"],"names":[],"mappings":"AAAA,2BAAA,qBAEE,4CAAsF,CADtF,cAIF,CCLA,sDDEE,6CCFF,qBDGE,eAAgB,CAChB,mBCJF,ACAA,6BAEE,sCAAgF,CADhF,0CAEF,CFGA,CENA,2BDAA,8DCEE,uCDFF,ACIA,CCJA,2BAAA,iCAGE,kBAAmB,CAKnB,kDAAmD,CANnD,YAAa,CAKb,mEAAwC,CAExC,yBAA2B,CAR3B,UAyBF,CAhBE,2CAEE,iCAA2E,CAD3E,kBAEF,CFbF,4EEYI,kCFZJ,AEcE,uDACE,sEAIF,CFnBF,wFEeI,sEFfJ,AEoBE,wDACE,wEAIF,CFzBF,yFEqBI,wEFrBJ,AE4BA,uCAGE,WAAY,CAFZ,qCAAsC,CACtC,kBAEF,CChCA,6BAME,4BAA6B,CAD7B,WAAY,CAFZ,MAAO,CAFP,cAAe,CACf,KAAM,CAEN,UAGF,CD0BA,CCjCA,2BAQA","file":"styles.layer.css","sourcesContent":[".mantine-contextmenu {\n position: fixed;\n border: 1px solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));\n overflow: hidden;\n transition: all 0.2s;\n}\n",null,".mantine-contextmenu-divider {\n height: rem(1px);\n background: light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5));\n}\n",".mantine-contextmenu-item-button {\n width: 100%;\n display: flex;\n align-items: center;\n padding-top: calc(var(--mantine-spacing-sm) / 2);\n padding-bottom: calc(var(--mantine-spacing-sm) / 2);\n padding-left: var(--mantine-spacing-sm);\n padding-right: var(--mantine-spacing-sm);\n color: var(--mantine-contextmenu-item-button-color);\n transition: background 0.2s;\n &[disabled] {\n cursor: not-allowed;\n color: light-dark(var(--mantine-color-gray-5), var(--mantine-color-dark-3));\n }\n &:hover:not([disabled]) {\n background: light-dark(\n var(--mantine-contextmenu-item-button-hover-bg-color-light),\n var(--mantine-contextmenu-item-button-hover-bg-color-dark)\n );\n }\n &:active:not([disabled]) {\n background: light-dark(\n var(--mantine-contextmenu-item-button-pressed-bg-color-light),\n var(--mantine-contextmenu-item-button-pressed-bg-color-dark)\n );\n }\n}\n\n.mantine-contextmenu-item-button-title {\n font-size: var(--mantine-font-size-sm);\n white-space: nowrap;\n flex-grow: 1;\n}\n",".mantine-contextmenu-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: transparent;\n}\n"]}
1
+ {"version":3,"sources":["../package/ContextMenu.css","<no source>","../package/ContextMenuDivider.css","../package/ContextMenuItem.css","../package/ContextMenuOverlay.css"],"names":[],"mappings":"AAAA,2BAAA,qBAEE,4CAAsF,CADtF,cAIF,CCLA,sDDEE,6CCFF,qBDGE,eAAgB,CAChB,mBCJF,ACAA,6BAEE,sCAAgF,CADhF,0CAEF,CDHA,8DCEE,uCDFF,AEAA,iCAGE,kBAAmB,CAKnB,kDAAmD,CANnD,YAAa,CAKb,mEAAwC,CAExC,yBAA2B,CAR3B,UAyBF,CAhBE,2CAEE,iCAA2E,CAD3E,kBAEF,CFbF,4EEYI,kCFZJ,AEcE,uDACE,sEAIF,CFnBF,wFEeI,sEFfJ,AEoBE,wDACE,wEAIF,CFzBF,yFEqBI,wEFrBJ,AE4BA,uCAGE,WAAY,CAFZ,qCAAsC,CACtC,kBAEF,CChCA,6BAME,4BAA6B,CAD7B,WAAY,CAFZ,MAAO,CAFP,cAAe,CACf,KAAM,CAEN,UAGF,CJDA,CENA,2BAIA,CCJA,2BAiCA,CCjCA,2BAQA","file":"styles.layer.css","sourcesContent":[".mantine-contextmenu {\n position: fixed;\n border: 1px solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));\n overflow: hidden;\n transition: all 0.2s;\n}\n",null,".mantine-contextmenu-divider {\n height: rem(1px);\n background: light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5));\n}\n",".mantine-contextmenu-item-button {\n width: 100%;\n display: flex;\n align-items: center;\n padding-top: calc(var(--mantine-spacing-sm) / 2);\n padding-bottom: calc(var(--mantine-spacing-sm) / 2);\n padding-left: var(--mantine-spacing-sm);\n padding-right: var(--mantine-spacing-sm);\n color: var(--mantine-contextmenu-item-button-color);\n transition: background 0.2s;\n &[disabled] {\n cursor: not-allowed;\n color: light-dark(var(--mantine-color-gray-5), var(--mantine-color-dark-3));\n }\n &:hover:not([disabled]) {\n background: light-dark(\n var(--mantine-contextmenu-item-button-hover-bg-color-light),\n var(--mantine-contextmenu-item-button-hover-bg-color-dark)\n );\n }\n &:active:not([disabled]) {\n background: light-dark(\n var(--mantine-contextmenu-item-button-pressed-bg-color-light),\n var(--mantine-contextmenu-item-button-pressed-bg-color-dark)\n );\n }\n}\n\n.mantine-contextmenu-item-button-title {\n font-size: var(--mantine-font-size-sm);\n white-space: nowrap;\n flex-grow: 1;\n}\n",".mantine-contextmenu-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: transparent;\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mantine-contextmenu",
3
- "version": "7.6.1",
3
+ "version": "7.7.0",
4
4
  "description": "Craft your applications for productivity and meet your users’ expectations by enhancing your Mantine-based UIs with a desktop-grade, lightweight yet fully-featured, dark-theme aware context-menu component, built by the creator of Mantine DataTable",
5
5
  "keywords": [
6
6
  "ui",
@@ -72,38 +72,38 @@
72
72
  "format": "prettier --write ."
73
73
  },
74
74
  "devDependencies": {
75
- "@ducanh2912/next-pwa": "^10.2.5",
76
- "@mantine/code-highlight": "^7.6.1",
77
- "@mantine/core": "^7.6.1",
78
- "@mantine/hooks": "^7.6.1",
79
- "@mantine/notifications": "^7.6.1",
80
- "@tabler/icons-react": "^2.47.0",
81
- "@types/lodash": "^4.14.202",
82
- "@types/node": "^20.11.21",
83
- "@types/react": "^18.2.60",
84
- "@types/react-dom": "^18.2.19",
85
- "@typescript-eslint/eslint-plugin": "^7.1.0",
86
- "@typescript-eslint/parser": "^7.1.0",
75
+ "@ducanh2912/next-pwa": "^10.2.6",
76
+ "@mantine/code-highlight": "^7.7.1",
77
+ "@mantine/core": "^7.7.1",
78
+ "@mantine/hooks": "^7.7.1",
79
+ "@mantine/notifications": "^7.7.1",
80
+ "@tabler/icons-react": "^3.1.0",
81
+ "@types/lodash": "^4.17.0",
82
+ "@types/node": "^20.12.4",
83
+ "@types/react": "^18.2.74",
84
+ "@types/react-dom": "^18.2.24",
85
+ "@typescript-eslint/eslint-plugin": "^7.5.0",
86
+ "@typescript-eslint/parser": "^7.5.0",
87
87
  "clsx": "^2.1.0",
88
- "cssnano": "^6.0.5",
88
+ "cssnano": "^6.1.2",
89
89
  "eslint": "^8.57.0",
90
- "eslint-config-next": "^14.1.0",
90
+ "eslint-config-next": "^14.1.4",
91
91
  "eslint-config-prettier": "^9.1.0",
92
92
  "lodash": "^4.17.21",
93
- "next": "14.1.0",
94
- "postcss": "^8.4.35",
93
+ "next": "14.1.4",
94
+ "postcss": "^8.4.38",
95
95
  "postcss-cli": "^11.0.0",
96
- "postcss-import": "^16.0.1",
96
+ "postcss-import": "^16.1.0",
97
97
  "postcss-preset-mantine": "^1.13.0",
98
98
  "postcss-simple-vars": "^7.0.1",
99
99
  "prettier": "^3.2.5",
100
100
  "react": "^18.2.0",
101
101
  "react-dom": "^18.2.0",
102
- "sharp": "^0.33.2",
102
+ "sharp": "^0.33.3",
103
103
  "swr": "^2.2.5",
104
104
  "tsup": "^8.0.2",
105
- "typescript": "^5.3.3",
106
- "webpack": "^5.90.3"
105
+ "typescript": "^5.4.3",
106
+ "webpack": "^5.91.0"
107
107
  },
108
108
  "peerDependencies": {
109
109
  "@mantine/core": ">=7",