@jamsrui/context-menu 0.0.19 → 0.1.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 CHANGED
@@ -2,12 +2,11 @@
2
2
 
3
3
  **A comprehensive React UI component library designed for developers, with Tailwind CSS integration for seamless styling.**
4
4
 
5
-
6
5
  ## 📖 **Overview**
7
6
 
8
7
  [JamsrUI](https://jamsr-ui.jamsrworld.com) is designed to help developers build modern, fast and visually appealing web applications with ease.
9
8
 
10
- ## 🚀 Getting Started
9
+ ## 🚀 Getting Started
11
10
 
12
11
  Boost & Build your websites using [JamsrUI](https://jamsr-ui.jamsrworld.com).
13
12
 
@@ -37,4 +36,3 @@ We welcome contributions from developers of all skill levels!
37
36
  ## ⭐ Support the Project
38
37
 
39
38
  If you find **JamsrUI** helpful, consider giving it a ⭐ on [GitHub](https://github.com/jamsrworld/jamsr-ui).
40
-
@@ -0,0 +1,10 @@
1
+ import * as react from 'react';
2
+ import { UIProps } from '@jamsrui/utils';
3
+
4
+ declare const ContextMenuContainer: (props: ContextMenuContainer.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
5
+ declare namespace ContextMenuContainer {
6
+ interface Props extends UIProps<"div"> {
7
+ }
8
+ }
9
+
10
+ export { ContextMenuContainer };
@@ -0,0 +1 @@
1
+ "use client";import{useRenderElement as n}from"@jamsrui/hooks";import{useContextMenuContext as r}from"./context-menu-context.mjs";const i=e=>{const{getContainerProps:t}=r();return n("div",{props:[t(e)]})};export{i as ContextMenuContainer};
@@ -1,7 +1,7 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
1
+ import * as react from 'react';
2
2
  import { UIProps } from '@jamsrui/utils';
3
3
 
4
- declare const ContextMenuContent: (props: ContextMenuContent.Props) => react_jsx_runtime.JSX.Element;
4
+ declare const ContextMenuContent: (props: ContextMenuContent.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
5
5
  declare namespace ContextMenuContent {
6
6
  interface Props extends UIProps<"div"> {
7
7
  }
@@ -1 +1 @@
1
- "use client";import{Fragment as M,jsx as t,jsxs as f}from"react/jsx-runtime";import{FloatingFocusManager as C,FloatingList as m,FloatingOverlay as c,FloatingPortal as x}from"@floating-ui/react";import{useRenderElement as F}from"@jamsrui/hooks";import{useContextMenuContext as d}from"./context-menu-context.mjs";import{ContextMenuFloatingContext as P}from"./context-menu-floating-context.mjs";const O=o=>{const{getFloatingListProps:e,getOverlayProps:n,getFocusManagerProps:r,getRootProps:i,getContentProps:s,isOpen:a,floatingCtx:l}=d(),{children:p}=o,g=t(M,{children:t("div",{...s(o),children:p})}),u=F("div",{props:[i(),{children:g}]});return t(P,{value:l,children:t(m,{...e(),children:a?f(x,{children:[t(c,{...n()}),t(C,{...r(),children:u})]}):null})})};export{O as ContextMenuContent};
1
+ "use client";import{useRenderElement as n}from"@jamsrui/hooks";import{useContextMenuContext as o}from"./context-menu-context.mjs";const m=e=>{const{getContentProps:t}=o();return n("div",{props:[t(e)]})};export{m as ContextMenuContent};
@@ -1,12 +1,11 @@
1
1
  import * as react from 'react';
2
- import { u as useContextMenu } from './context-menu-BgSke4mM.mjs';
3
- import 'react/jsx-runtime';
2
+ import { useContextMenu } from './use-context-menu.mjs';
4
3
  import '@floating-ui/react';
5
4
  import '@jamsrui/utils';
5
+ import './context-menu-container.mjs';
6
6
  import './context-menu-content.mjs';
7
7
  import './context-menu-floating-context.mjs';
8
- import './context-menu-item-inner.mjs';
9
- import './styles.mjs';
8
+ import './context-menu-item.mjs';
10
9
 
11
10
  declare const useContextMenuContext: () => ContextMenuContext.Props;
12
11
  declare const ContextMenuContext: react.Context<ContextMenuContext.Props | null>;
@@ -1,9 +1,13 @@
1
- import 'react';
2
- import '@jamsrui/utils';
3
- export { a as ContextMenuItem } from './context-menu-BgSke4mM.mjs';
4
- import 'react/jsx-runtime';
5
- import '@floating-ui/react';
6
- import './context-menu-content.mjs';
7
- import './context-menu-floating-context.mjs';
8
- import './context-menu-item-inner.mjs';
9
- import './styles.mjs';
1
+ import * as react from 'react';
2
+ import { UIProps } from '@jamsrui/utils';
3
+
4
+ declare const ContextMenuItem: (props: ContextMenuItem.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
5
+ declare namespace ContextMenuItem {
6
+ interface Props extends UIProps<"button"> {
7
+ textValue: string;
8
+ disabled?: boolean;
9
+ preventCloseOnClick?: boolean;
10
+ }
11
+ }
12
+
13
+ export { ContextMenuItem };
@@ -1 +1 @@
1
- "use client";import{Fragment as R,jsx as v,jsxs as k}from"react/jsx-runtime";import{useFloatingTree as x,useListItem as f}from"@floating-ui/react";import{useMergeRefs as I,useRenderElement as M}from"@jamsrui/hooks";import{useContextMenuContext as b}from"./context-menu-context.mjs";import{useContextMenuFloatingContext as P}from"./context-menu-floating-context.mjs";import{ContextMenuItemInner as g}from"./context-menu-item-inner.mjs";const O=s=>{const{getMenuItemProps:i}=b(),a=x(),{textValue:c,children:e,isDisabled:t,startContent:l,endContent:m,preventCloseOnClick:u,...d}=s,n=P(),o=f({label:c??(typeof e=="string"?e:void 0)}),r=o.index===n.activeIndex,p=I([o.ref]),C=k(R,{children:[l,v(g,{children:e}),m]});return M("button",{props:[i(d),{children:C,disabled:t,"data-disabled":t,"data-active":r,"aria-disabled":t,ref:p,tabIndex:r?0:-1,onClick(){u||a?.events.emit("click")},onMouseEnter(){n.setHasFocusInside(!0)}}]})};export{O as ContextMenuItem};
1
+ "use client";import{useFloatingTree as f,useListItem as C}from"@floating-ui/react";import{useHover as b,useMergeRefs as v,useRenderElement as I}from"@jamsrui/hooks";import{useContextMenuContext as M}from"./context-menu-context.mjs";import{useContextMenuFloatingContext as E}from"./context-menu-floating-context.mjs";import{dataAttr as t}from"@jamsrui/utils";const L=s=>{const{getMenuItemProps:i}=M(),a=f(),{textValue:l,children:d,disabled:e,preventCloseOnClick:u,...m}=s,n=E(),o=C({label:l}),{isHovered:c,ref:p}=b({isDisabled:e}),r=o.index===n.activeIndex,x=v([o.ref,p]);return I("button",{props:[i(m),{children:d,disabled:e,"data-disabled":t(e),"data-active":t(r),"aria-disabled":t(e),"data-hovered":t(c),ref:x,tabIndex:r?0:-1,onClick(){u||a?.events.emit("click")},onMouseEnter(){n.setHasFocusInside(!0)}}]})};export{L as ContextMenuItem};
@@ -0,0 +1,10 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ declare const ContextMenuPortal: (props: ContextMenuPortal.Props) => react_jsx_runtime.JSX.Element;
4
+ declare namespace ContextMenuPortal {
5
+ interface Props {
6
+ children: React.ReactElement;
7
+ }
8
+ }
9
+
10
+ export { ContextMenuPortal };
@@ -0,0 +1 @@
1
+ "use client";import{jsx as t,jsxs as x}from"react/jsx-runtime";import{FloatingFocusManager as g,FloatingList as s,FloatingOverlay as p,FloatingPortal as u}from"@floating-ui/react";import{useContextMenuContext as F}from"./context-menu-context.mjs";import{ContextMenuFloatingContext as c}from"./context-menu-floating-context.mjs";const m=o=>{const{children:e}=o,{getFloatingListProps:n,getOverlayProps:a,getFocusManagerProps:r,isOpen:l,floatingCtx:i}=F();return t(c,{value:i,children:t(s,{...n(),children:l?x(u,{children:[t(p,{...a()}),t(g,{...r(),children:e})]}):null})})};export{m as ContextMenuPortal};
@@ -1,9 +1,18 @@
1
- import 'react/jsx-runtime';
2
- export { C as ContextMenu } from './context-menu-BgSke4mM.mjs';
3
- import 'react';
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import { useContextMenu } from './use-context-menu.mjs';
4
3
  import '@floating-ui/react';
5
4
  import '@jamsrui/utils';
5
+ import 'react';
6
+ import './context-menu-container.mjs';
6
7
  import './context-menu-content.mjs';
7
8
  import './context-menu-floating-context.mjs';
8
- import './context-menu-item-inner.mjs';
9
- import './styles.mjs';
9
+ import './context-menu-item.mjs';
10
+
11
+ declare const ContextMenu: (props: ContextMenu.Props) => react_jsx_runtime.JSX.Element;
12
+ declare namespace ContextMenu {
13
+ interface Props extends useContextMenu.Props {
14
+ children: React.ReactNode;
15
+ }
16
+ }
17
+
18
+ export { ContextMenu };
package/dist/index.d.mts CHANGED
@@ -1,25 +1,26 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { WithGlobalConfig } from '@jamsrui/core';
3
1
  import * as react from 'react';
4
- import { C as ContextMenu$1, a as ContextMenuItem } from './context-menu-BgSke4mM.mjs';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+ import { ContextMenu as ContextMenu$1 } from './context-menu.mjs';
4
+ import { ContextMenuContainer } from './context-menu-container.mjs';
5
5
  import { ContextMenuContent } from './context-menu-content.mjs';
6
+ import { ContextMenuItem } from './context-menu-item.mjs';
7
+ import { ContextMenuPortal } from './context-menu-portal.mjs';
6
8
  import { ContextMenuTrigger } from './context-menu-trigger.mjs';
9
+ import './use-context-menu.mjs';
7
10
  import '@floating-ui/react';
8
11
  import '@jamsrui/utils';
9
12
  import './context-menu-floating-context.mjs';
10
- import './context-menu-item-inner.mjs';
11
- import './styles.mjs';
12
13
 
13
14
  declare const ContextMenu: ((props: ContextMenu$1.Props) => react_jsx_runtime.JSX.Element) & {
15
+ Container: (props: ContextMenuContainer.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
16
+ Portal: (props: ContextMenuPortal.Props) => react_jsx_runtime.JSX.Element;
14
17
  Trigger: (props: ContextMenuTrigger.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | null;
15
- Content: (props: ContextMenuContent.Props) => react_jsx_runtime.JSX.Element;
18
+ Content: (props: ContextMenuContent.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
16
19
  Item: (props: ContextMenuItem.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
17
20
  };
18
21
  declare namespace ContextMenu {
19
22
  interface Props extends ContextMenu$1.Props {
20
23
  }
21
- interface Config extends ContextMenuConfig.Props {
22
- }
23
24
  interface Trigger extends ContextMenuTrigger.Props {
24
25
  }
25
26
  interface Content extends ContextMenuContent.Props {
@@ -28,14 +29,4 @@ declare namespace ContextMenu {
28
29
  }
29
30
  }
30
31
 
31
- declare const useContextMenuConfig: () => ContextMenuConfig.Props;
32
- declare const ContextMenuConfig: (props: Omit<Partial<ContextMenuConfig.Props>, "children"> & {
33
- merge?: boolean;
34
- children: React.ReactNode;
35
- }) => react_jsx_runtime.JSX.Element;
36
- declare namespace ContextMenuConfig {
37
- interface Props extends WithGlobalConfig<ContextMenu.Props> {
38
- }
39
- }
40
-
41
- export { ContextMenu, ContextMenuConfig, ContextMenuContent, ContextMenuItem, ContextMenuTrigger, useContextMenuConfig };
32
+ export { ContextMenu };
package/dist/index.mjs CHANGED
@@ -1 +1 @@
1
- import{ContextMenu as o}from"./context-menu.mjs";import{ContextMenuConfig as r,useContextMenuConfig as x}from"./context-menu-config.mjs";import{ContextMenuContent as e}from"./context-menu-content.mjs";import{ContextMenuItem as t}from"./context-menu-item.mjs";import{ContextMenuTrigger as n}from"./context-menu-trigger.mjs";const u=Object.assign(o,{Trigger:n,Content:e,Item:t});export{u as ContextMenu,r as ContextMenuConfig,e as ContextMenuContent,t as ContextMenuItem,n as ContextMenuTrigger,x as useContextMenuConfig};
1
+ import{ContextMenu as t}from"./context-menu.mjs";import{ContextMenuContainer as e}from"./context-menu-container.mjs";import{ContextMenuContent as n}from"./context-menu-content.mjs";import{ContextMenuItem as o}from"./context-menu-item.mjs";import{ContextMenuPortal as r}from"./context-menu-portal.mjs";import{ContextMenuTrigger as x}from"./context-menu-trigger.mjs";const M=Object.assign(t,{Container:e,Portal:r,Trigger:x,Content:n,Item:o});export{M as ContextMenu};
@@ -1,9 +1,38 @@
1
- import 'react';
2
- import '@floating-ui/react';
3
- import '@jamsrui/utils';
4
- import './context-menu-content.mjs';
5
- import './context-menu-floating-context.mjs';
6
- export { u as useContextMenu } from './context-menu-BgSke4mM.mjs';
7
- import './context-menu-item-inner.mjs';
8
- import './styles.mjs';
9
- import 'react/jsx-runtime';
1
+ import { FloatingOverlayProps, FloatingFocusManagerProps, FloatingNodeProps, FloatingList, Placement } from '@floating-ui/react';
2
+ import { UIProps, PropGetter } from '@jamsrui/utils';
3
+ import { ComponentProps } from 'react';
4
+ import { ContextMenuContainer } from './context-menu-container.mjs';
5
+ import { ContextMenuContent } from './context-menu-content.mjs';
6
+ import { ContextMenuFloatingContext } from './context-menu-floating-context.mjs';
7
+ import { ContextMenuItem } from './context-menu-item.mjs';
8
+
9
+ declare const useContextMenu: (props: useContextMenu.Props) => {
10
+ getOverlayProps: () => FloatingOverlayProps & UIProps<"div">;
11
+ getFocusManagerProps: () => Omit<FloatingFocusManagerProps, "children">;
12
+ getContentProps: PropGetter<ContextMenuContent.Props>;
13
+ getNodeProps: () => FloatingNodeProps;
14
+ isOpen: boolean;
15
+ getTriggerProps: () => UIProps<"div">;
16
+ getFloatingListProps: () => Omit<ComponentProps<typeof FloatingList>, "children">;
17
+ floatingCtx: ContextMenuFloatingContext.Props;
18
+ getContainerProps: PropGetter<ContextMenuContainer.Props>;
19
+ getMenuItemProps: PropGetter<Partial<ContextMenuItem.Props>>;
20
+ isNested: boolean;
21
+ };
22
+ declare namespace useContextMenu {
23
+ interface Props {
24
+ isOpen?: boolean;
25
+ defaultOpen?: boolean;
26
+ onOpenChange?: (open: boolean) => void;
27
+ openDelay?: number;
28
+ closeDelay?: number;
29
+ closeOnEscapeKey?: boolean;
30
+ closeOnOutsidePress?: boolean;
31
+ lockScroll?: boolean;
32
+ placement?: Placement;
33
+ offset?: number;
34
+ className?: string;
35
+ }
36
+ }
37
+
38
+ export { useContextMenu };
@@ -1 +1 @@
1
- "use client";import{useCallback as a,useEffect as j,useMemo as B,useRef as g,useState as $}from"react";import{autoUpdate as pe,flip as de,offset as fe,safePolygon as ge,shift as Pe,useDismiss as xe,useFloating as Ie,useFloatingNodeId as Ce,useFloatingParentNodeId as Me,useFloatingTree as ve,useHover as ye,useInteractions as Fe,useListItem as be,useListNavigation as Ne,useMergeRefs as he,useRole as Oe,useTypeahead as Re}from"@floating-ui/react";import{useControlledState as ke}from"@jamsrui/hooks";import{cn as I,dataAttrDev as u,mapPropsVariants as Ee}from"@jamsrui/utils";import{useContextMenuFloatingContext as Se}from"./context-menu-floating-context.mjs";import{contextMenuVariants as q}from"./styles.mjs";const He=z=>{const m=Me(),t=m!==null,[J,Q]=Ee(z,q.variantKeys),{isOpen:W,defaultOpen:Z,onOpenChange:_,classNames:n,closeDelay:ee=0,closeOnEscapeKey:te=!0,closeOnOutsidePress:ne=!0,lockScroll:C=!0,offset:oe=4,openDelay:se=75,placement:ae="right-start"}=J,r=ve(),l=Ce(),P=be(),[o=!1,c]=ke({defaultProp:Z,onChange:_,prop:W}),[re,M]=$(!1),[d,v]=$(null),y=g([]),F=g([]),{refs:p,floatingStyles:b,context:i}=Ie({nodeId:l,open:o,onOpenChange:c,middleware:[fe({mainAxis:oe,alignmentAxis:t?-4:0}),de({fallbackPlacements:["left-start"]}),Pe({padding:5})],placement:ae,whileElementsMounted:pe}),le=ye(i,{enabled:t,delay:{open:se,close:ee},handleClose:ge({blockPointerEvents:!0})}),ie=Oe(i,{role:"menu"}),ce=xe(i,{escapeKey:te,outsidePress:ne}),ue=Ne(i,{listRef:y,onNavigate:v,activeIndex:d}),me=Re(i,{enabled:o,listRef:F,onMatch:v,activeIndex:d}),{getFloatingProps:N,getItemProps:h,getReferenceProps:O}=Fe([ie,le,ce,ue,me]);j(()=>{if(!r)return;function e(){c(!1)}function X(Y){Y.nodeId!==l&&Y.parentId===m&&c(!1)}return r.events.on("click",e),r.events.on("menuopen",X),()=>{r.events.off("click",e),r.events.off("menuopen",X)}},[r,l,m,c,o]),j(()=>{o&&r&&r.events.emit("menuopen",{parentId:m,nodeId:l})},[r,o,l,m]);const s=q(Q),R=o&&re&&t,f=Se(),k=g(!1),x=g(null),E=a(e=>{e.preventDefault(),p.setPositionReference({getBoundingClientRect(){return{width:0,height:0,x:e.clientX,y:e.clientY,top:e.clientY,right:e.clientX,bottom:e.clientY,left:e.clientX}}}),c(!0),x.current&&clearTimeout(x.current),k.current=!1,x.current=window.setTimeout(()=>{k.current=!0},300)},[p,c]),S=he([p.setReference,P.ref]),T=a(()=>({ref:S,tabIndex:t?f.activeIndex===P.index?0:-1:void 0,"data-slot":u("trigger"),role:t?"menuitem":void 0,"data-active":R,"data-nested":t,"data-open":o,onContextMenu:t?void 0:E,...O({...f.getItemProps({onMouseEnter(){M(!1),f.setHasFocusInside(!0)}})})}),[O,E,R,t,o,P.index,S,f]),D=a(()=>({lockScroll:C,"data-slot":u("overlay"),className:s.backdrop({className:n?.backdrop})}),[n?.backdrop,C,s]),w=a(()=>({context:i,modal:!0,initialFocus:1,returnFocus:!t,disabled:!1}),[i,t]),L=a(()=>({"data-component":u("menu"),"data-slot":u("root"),className:s.root({className:n?.root}),ref:p.setFloating,style:b,...N()}),[n?.root,b,N,p.setFloating,s]),A=a(()=>({className:s.content({className:I(n?.content)})}),[n?.content,s]),U=a(()=>({id:l}),[l]),G=a(()=>({elementsRef:y,labelsRef:F}),[]),H=B(()=>({activeIndex:d,getItemProps:h,setHasFocusInside:M}),[d,h]),K=a(e=>({...e,"data-slot":u("menu-item"),className:s.menuItem({className:I(n?.menuItem,e.className),color:e.color}),role:"menuitem"}),[n?.menuItem,s]),V=a(e=>({...e,"data-slot":u("menu-item-inner"),className:s.menuItemInner({className:I(n?.menuItemInner,e.className)})}),[n?.menuItemInner,s]);return B(()=>({getOverlayProps:D,getFocusManagerProps:w,getContentProps:A,getNodeProps:U,isOpen:o,getTriggerProps:T,getFloatingListProps:G,floatingCtx:H,getRootProps:L,getMenuItemProps:K,isNested:t,getMenuItemInnerProps:V}),[H,A,G,w,V,K,U,D,L,T,t,o])};export{He as useContextMenu};
1
+ "use client";import{useCallback as s,useEffect as H,useMemo as K,useRef as m,useState as X}from"react";import{autoUpdate as se,flip as re,offset as ae,safePolygon as le,shift as ie,useDismiss as ce,useFloating as ue,useFloatingNodeId as pe,useFloatingParentNodeId as me,useFloatingTree as de,useHover as fe,useInteractions as ge,useListItem as Pe,useListNavigation as Ce,useMergeRefs as xe,useRole as ve,useTypeahead as Fe}from"@floating-ui/react";import{useControlledState as Me}from"@jamsrui/hooks";import{useContextMenuFloatingContext as Ie}from"./context-menu-floating-context.mjs";const Te=Y=>{const i=me(),t=i!==null,{isOpen:j,defaultOpen:B,onOpenChange:q,closeDelay:z=0,closeOnEscapeKey:J=!0,closeOnOutsidePress:Q=!0,lockScroll:g=!0,offset:V=4,openDelay:W=75,placement:Z="right-start",className:ye,...be}=Y,o=de(),r=pe(),d=Pe(),[n=!1,l]=Me({defaultProp:B,onChange:q,prop:j}),[_,P]=X(!1),[u,C]=X(null),x=m([]),v=m([]),{refs:c,floatingStyles:F,context:a}=ue({nodeId:r,open:n,onOpenChange:l,middleware:[ae({mainAxis:V,alignmentAxis:t?-4:0}),re({fallbackPlacements:["left-start"]}),ie({padding:5})],placement:Z,whileElementsMounted:se}),$=fe(a,{enabled:t,delay:{open:W,close:z},handleClose:le({blockPointerEvents:!0})}),ee=ve(a,{role:"menu"}),te=ce(a,{escapeKey:J,outsidePress:Q}),ne=Ce(a,{listRef:x,onNavigate:C,activeIndex:u}),oe=Fe(a,{enabled:n,listRef:v,onMatch:C,activeIndex:u}),{getFloatingProps:M,getItemProps:I,getReferenceProps:y}=ge([ee,$,te,ne,oe]);H(()=>{if(!o)return;function e(){l(!1)}function A(G){G.nodeId!==r&&G.parentId===i&&l(!1)}return o.events.on("click",e),o.events.on("menuopen",A),()=>{o.events.off("click",e),o.events.off("menuopen",A)}},[o,r,i,l,n]),H(()=>{n&&o&&o.events.emit("menuopen",{parentId:i,nodeId:r})},[o,n,r,i]);const b=n&&_&&t,p=Ie(),h=m(!1),f=m(null),O=s(e=>{e.preventDefault(),c.setPositionReference({getBoundingClientRect(){return{width:0,height:0,x:e.clientX,y:e.clientY,top:e.clientY,right:e.clientX,bottom:e.clientY,left:e.clientX}}}),l(!0),f.current&&clearTimeout(f.current),h.current=!1,f.current=window.setTimeout(()=>{h.current=!0},300)},[c,l]),R=xe([c.setReference,d.ref]),N=s(()=>({ref:R,tabIndex:t?p.activeIndex===d.index?0:-1:void 0,"data-slot":"trigger",role:t?"menuitem":void 0,"data-active":b,"data-nested":t,"data-opened":n,onContextMenu:t?void 0:O,...y({...p.getItemProps({onMouseEnter(){P(!1),p.setHasFocusInside(!0)}})})}),[y,O,b,t,n,d.index,R,p]),E=s(()=>({lockScroll:g,"data-slot":"overlay"}),[g]),k=s(()=>({context:a,modal:!0,initialFocus:1,returnFocus:!t,disabled:!1}),[a,t]),D=s(e=>({"data-component":"menu","data-slot":"root",ref:c.setFloating,style:F,...M(),...e}),[F,M,c.setFloating]),T=s(e=>e,[]),w=s(()=>({id:r}),[r]),L=s(()=>({elementsRef:x,labelsRef:v}),[]),S=K(()=>({activeIndex:u,getItemProps:I,setHasFocusInside:P}),[u,I]),U=s(e=>({...e,"data-slot":"menu-item",role:"menuitem"}),[]);return K(()=>({getOverlayProps:E,getFocusManagerProps:k,getContentProps:T,getNodeProps:w,isOpen:n,getTriggerProps:N,getFloatingListProps:L,floatingCtx:S,getContainerProps:D,getMenuItemProps:U,isNested:t}),[S,T,L,k,U,w,E,D,N,t,n])};export{Te as useContextMenu};
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@jamsrui/context-menu",
3
- "version": "0.0.19",
3
+ "version": "0.1.0",
4
4
  "peerDependencies": {
5
5
  "react": ">=19"
6
6
  },
7
7
  "dependencies": {
8
8
  "@floating-ui/react": ">=0.27",
9
- "@jamsrui/hooks": "^0.0.19",
10
- "@jamsrui/core": "^0.0.15",
11
- "@jamsrui/utils": "^0.0.19"
9
+ "@jamsrui/hooks": "^0.1.0",
10
+ "@jamsrui/core": "^0.1.0",
11
+ "@jamsrui/utils": "^0.1.0"
12
12
  },
13
13
  "exports": {
14
14
  ".": {
@@ -1,66 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as react from 'react';
3
- import { ComponentProps } from 'react';
4
- import { FloatingOverlayProps, FloatingFocusManagerProps, FloatingNodeProps, FloatingList, Placement } from '@floating-ui/react';
5
- import { UIProps, PropGetter, SlotsToClassNames } from '@jamsrui/utils';
6
- import { ContextMenuContent } from './context-menu-content.mjs';
7
- import { ContextMenuFloatingContext } from './context-menu-floating-context.mjs';
8
- import { ContextMenuItemInner } from './context-menu-item-inner.mjs';
9
- import { ContextMenuVariantProps, ContextMenuSlots } from './styles.mjs';
10
-
11
- declare const ContextMenuItem: (props: ContextMenuItem.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
12
- declare namespace ContextMenuItem {
13
- interface Props extends UIProps<"button"> {
14
- textValue?: string;
15
- isDisabled?: boolean;
16
- color?: ContextMenu.Props["color"];
17
- startContent?: React.ReactNode;
18
- endContent?: React.ReactNode;
19
- preventCloseOnClick?: boolean;
20
- }
21
- }
22
-
23
- declare const useContextMenu: (props: useContextMenu.Props) => {
24
- getOverlayProps: () => FloatingOverlayProps & UIProps<"div">;
25
- getFocusManagerProps: () => Omit<FloatingFocusManagerProps, "children">;
26
- getContentProps: PropGetter<ContextMenuContent.Props>;
27
- getNodeProps: () => FloatingNodeProps;
28
- isOpen: boolean;
29
- getTriggerProps: () => UIProps<"div">;
30
- getFloatingListProps: () => Omit<ComponentProps<typeof FloatingList>, "children">;
31
- floatingCtx: ContextMenuFloatingContext.Props;
32
- getRootProps: () => {
33
- "data-component": string | undefined;
34
- "data-slot": string | undefined;
35
- className: string;
36
- ref: ((node: HTMLElement | null) => void) & ((node: HTMLElement | null) => void);
37
- style: react.CSSProperties;
38
- };
39
- getMenuItemProps: PropGetter<ContextMenuItem.Props>;
40
- isNested: boolean;
41
- getMenuItemInnerProps: PropGetter<ContextMenuItemInner.Props>;
42
- };
43
- declare namespace useContextMenu {
44
- interface Props extends ContextMenuVariantProps {
45
- classNames?: SlotsToClassNames<ContextMenuSlots>;
46
- isOpen?: boolean;
47
- defaultOpen?: boolean;
48
- onOpenChange?: (open: boolean) => void;
49
- openDelay?: number;
50
- closeDelay?: number;
51
- closeOnEscapeKey?: boolean;
52
- closeOnOutsidePress?: boolean;
53
- lockScroll?: boolean;
54
- placement?: Placement;
55
- offset?: number;
56
- }
57
- }
58
-
59
- declare const ContextMenu: (props: ContextMenu.Props) => react_jsx_runtime.JSX.Element;
60
- declare namespace ContextMenu {
61
- interface Props extends useContextMenu.Props {
62
- children: React.ReactNode;
63
- }
64
- }
65
-
66
- export { ContextMenu as C, ContextMenuItem as a, useContextMenu as u };
@@ -1,12 +0,0 @@
1
- import 'react/jsx-runtime';
2
- import '@jamsrui/core';
3
- export { ContextMenuConfig, useContextMenuConfig } from './index.mjs';
4
- import 'react';
5
- import './context-menu-BgSke4mM.mjs';
6
- import '@floating-ui/react';
7
- import '@jamsrui/utils';
8
- import './context-menu-content.mjs';
9
- import './context-menu-floating-context.mjs';
10
- import './context-menu-item-inner.mjs';
11
- import './styles.mjs';
12
- import './context-menu-trigger.mjs';
@@ -1 +0,0 @@
1
- "use client";import{createConfigContext as e}from"@jamsrui/utils";const[i,r]=e({displayName:"ContextMenuConfig"});export{i as ContextMenuConfig,r as useContextMenuConfig};
@@ -1,10 +0,0 @@
1
- import * as react from 'react';
2
- import { UIProps } from '@jamsrui/utils';
3
-
4
- declare const ContextMenuItemInner: (props: ContextMenuItemInner.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
5
- declare namespace ContextMenuItemInner {
6
- interface Props extends UIProps<"span"> {
7
- }
8
- }
9
-
10
- export { ContextMenuItemInner };
@@ -1 +0,0 @@
1
- "use client";import{useRenderElement as t}from"@jamsrui/hooks";import{useContextMenuContext as r}from"./context-menu-context.mjs";const m=e=>{const{getMenuItemInnerProps:n}=r();return t("span",{props:[n(e)]})};export{m as ContextMenuItemInner};
package/dist/styles.d.mts DELETED
@@ -1,155 +0,0 @@
1
- import * as _jamsrui_utils from '@jamsrui/utils';
2
- import { VariantProps } from '@jamsrui/utils';
3
-
4
- declare const contextMenuVariants: _jamsrui_utils.TVReturnType<{
5
- radius: {
6
- sm: {};
7
- md: {};
8
- lg: {};
9
- xl: {};
10
- "2xl": {};
11
- "3xl": {};
12
- full: {};
13
- none: {};
14
- };
15
- backdrop: {
16
- transparent: {
17
- backdrop: string;
18
- };
19
- opaque: {
20
- backdrop: string;
21
- };
22
- blur: {
23
- backdrop: string;
24
- };
25
- };
26
- color: {
27
- default: {
28
- menuItem: string;
29
- };
30
- primary: {
31
- menuItem: string;
32
- };
33
- secondary: {
34
- menuItem: string;
35
- };
36
- success: {
37
- menuItem: string;
38
- };
39
- warning: {
40
- menuItem: string;
41
- };
42
- danger: {
43
- menuItem: string;
44
- };
45
- };
46
- }, {
47
- arrow: string;
48
- backdrop: string;
49
- root: string;
50
- content: string;
51
- menuItem: string[];
52
- menuItemInner: string;
53
- }, undefined, {
54
- radius: {
55
- sm: {};
56
- md: {};
57
- lg: {};
58
- xl: {};
59
- "2xl": {};
60
- "3xl": {};
61
- full: {};
62
- none: {};
63
- };
64
- backdrop: {
65
- transparent: {
66
- backdrop: string;
67
- };
68
- opaque: {
69
- backdrop: string;
70
- };
71
- blur: {
72
- backdrop: string;
73
- };
74
- };
75
- color: {
76
- default: {
77
- menuItem: string;
78
- };
79
- primary: {
80
- menuItem: string;
81
- };
82
- secondary: {
83
- menuItem: string;
84
- };
85
- success: {
86
- menuItem: string;
87
- };
88
- warning: {
89
- menuItem: string;
90
- };
91
- danger: {
92
- menuItem: string;
93
- };
94
- };
95
- }, {
96
- arrow: string;
97
- backdrop: string;
98
- root: string;
99
- content: string;
100
- menuItem: string[];
101
- menuItemInner: string;
102
- }, _jamsrui_utils.TVReturnType<{
103
- radius: {
104
- sm: {};
105
- md: {};
106
- lg: {};
107
- xl: {};
108
- "2xl": {};
109
- "3xl": {};
110
- full: {};
111
- none: {};
112
- };
113
- backdrop: {
114
- transparent: {
115
- backdrop: string;
116
- };
117
- opaque: {
118
- backdrop: string;
119
- };
120
- blur: {
121
- backdrop: string;
122
- };
123
- };
124
- color: {
125
- default: {
126
- menuItem: string;
127
- };
128
- primary: {
129
- menuItem: string;
130
- };
131
- secondary: {
132
- menuItem: string;
133
- };
134
- success: {
135
- menuItem: string;
136
- };
137
- warning: {
138
- menuItem: string;
139
- };
140
- danger: {
141
- menuItem: string;
142
- };
143
- };
144
- }, {
145
- arrow: string;
146
- backdrop: string;
147
- root: string;
148
- content: string;
149
- menuItem: string[];
150
- menuItemInner: string;
151
- }, undefined, unknown, unknown, undefined>>;
152
- type ContextMenuVariantProps = VariantProps<typeof contextMenuVariants>;
153
- type ContextMenuSlots = keyof ReturnType<typeof contextMenuVariants>;
154
-
155
- export { type ContextMenuSlots, type ContextMenuVariantProps, contextMenuVariants };
package/dist/styles.mjs DELETED
@@ -1 +0,0 @@
1
- import{radiusVariant as e,tv as r}from"@jamsrui/utils";const t=r({slots:{arrow:"fill-background-secondary",backdrop:"z-backdrop",root:"min-w-[150px] z-popover",content:"relative z-popover box-border inline-flex w-full flex-col justify-center bg-surface p-1 text-sm shadow-md outline-none",menuItem:["relative box-border flex size-full cursor-default select-none items-center gap-2 px-2 py-1.5 text-left outline-none ui-disabled:cursor-not-allowed ui-disabled:opacity-disabled","ui-active:bg-surface-secondary"],menuItemInner:"grow"},variants:{radius:e(["content","menuItem"]),backdrop:{transparent:{backdrop:""},opaque:{backdrop:"bg-black/50"},blur:{backdrop:"bg-black/30 backdrop-blur-md backdrop-saturate-150"}},color:{default:{menuItem:"ui-hover:bg-surface-secondary ui-hover:text-foreground"},primary:{menuItem:"ui-hover:bg-primary ui-hover:text-primary-foreground"},secondary:{menuItem:"ui-hover:bg-secondary ui-hover:text-secondary-foreground"},success:{menuItem:"ui-hover:bg-success ui-hover:text-success-foreground"},warning:{menuItem:"ui-hover:bg-warning ui-hover:text-warning-foreground"},danger:{menuItem:"ui-hover:bg-danger ui-hover:text-danger-foreground"}}},defaultVariants:{backdrop:"transparent",radius:"md",color:"default"}});export{t as contextMenuVariants};