@vuu-ui/vuu-context-menu 2.1.18 → 2.1.19-beta.1
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/package.json +8 -10
- package/cjs/ContextMenu.css.js +0 -6
- package/cjs/ContextMenu.css.js.map +0 -1
- package/cjs/ContextMenu.js +0 -48
- package/cjs/ContextMenu.js.map +0 -1
- package/cjs/ContextMenuProvider.js +0 -78
- package/cjs/ContextMenuProvider.js.map +0 -1
- package/cjs/index.js +0 -14
- package/cjs/index.js.map +0 -1
- package/cjs/menu-utils.js +0 -30
- package/cjs/menu-utils.js.map +0 -1
- package/cjs/useContextMenu.js +0 -88
- package/cjs/useContextMenu.js.map +0 -1
- package/esm/ContextMenu.css.js +0 -4
- package/esm/ContextMenu.css.js.map +0 -1
- package/esm/ContextMenu.js +0 -46
- package/esm/ContextMenu.js.map +0 -1
- package/esm/ContextMenuProvider.js +0 -75
- package/esm/ContextMenuProvider.js.map +0 -1
- package/esm/index.js +0 -4
- package/esm/index.js.map +0 -1
- package/esm/menu-utils.js +0 -25
- package/esm/menu-utils.js.map +0 -1
- package/esm/useContextMenu.js +0 -86
- package/esm/useContextMenu.js.map +0 -1
package/package.json
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "2.1.
|
|
2
|
+
"version": "2.1.19-beta.1",
|
|
3
3
|
"author": "heswell",
|
|
4
|
+
"type": "module",
|
|
4
5
|
"license": "Apache-2.0",
|
|
5
6
|
"devDependencies": {
|
|
6
|
-
"@vuu-ui/vuu-data-types": "2.1.
|
|
7
|
-
"@vuu-ui/vuu-protocol-types": "2.1.
|
|
8
|
-
"@vuu-ui/vuu-table-types": "2.1.
|
|
7
|
+
"@vuu-ui/vuu-data-types": "2.1.19-beta.1",
|
|
8
|
+
"@vuu-ui/vuu-protocol-types": "2.1.19-beta.1",
|
|
9
|
+
"@vuu-ui/vuu-table-types": "2.1.19-beta.1"
|
|
9
10
|
},
|
|
10
11
|
"dependencies": {
|
|
11
|
-
"@vuu-ui/vuu-utils": "2.1.
|
|
12
|
+
"@vuu-ui/vuu-utils": "2.1.19-beta.1",
|
|
12
13
|
"@salt-ds/core": "1.54.1",
|
|
13
14
|
"@salt-ds/styles": "0.2.1",
|
|
14
15
|
"@salt-ds/window": "0.1.1"
|
|
@@ -26,14 +27,11 @@
|
|
|
26
27
|
],
|
|
27
28
|
"exports": {
|
|
28
29
|
".": {
|
|
29
|
-
"
|
|
30
|
-
"import": "./esm/index.js",
|
|
30
|
+
"import": "./index.js",
|
|
31
31
|
"types": "./types/index.d.ts"
|
|
32
32
|
}
|
|
33
33
|
},
|
|
34
|
-
"
|
|
35
|
-
"module": "esm/index.js",
|
|
34
|
+
"module": "index.js",
|
|
36
35
|
"name": "@vuu-ui/vuu-context-menu",
|
|
37
|
-
"type": "module",
|
|
38
36
|
"types": "types/index.d.ts"
|
|
39
37
|
}
|
package/cjs/ContextMenu.css.js
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var contextMenuCss = ".vuuContextMenuPanel {\n &:has([data-icon]) {\n .saltMenuItem {\n padding-left: calc(var(--salt-spacing-400) + var(--salt-spacing-200));\n }\n .saltMenuItem[data-icon]:after {\n --vuu-icon-left: var(--salt-spacing-150);\n --vuu-icon-top: var(--salt-spacing-150);\n }\n .saltMenuItem[aria-haspopup=\"menu\"]:after {\n content: \"\";\n background-color: var(--vuu-icon-color, var(--saltIcon-color, var(--salt-content-secondary-foreground)));\n right: var(--salt-spacing-100);\n height: var(--vuu-icon-height, var(--vuu-icon-size, 12px));\n mask: var(--vuu-svg-triangle-right) center center / 8px 8px;\n mask-repeat: no-repeat;\n position: absolute;\n transform: rotate(315deg);\n top: var(--salt-spacing-200);\n width: var(--vuu-icon-width, var(--vuu-icon-size, 12px));\n }\n }\n}";
|
|
4
|
-
|
|
5
|
-
module.exports = contextMenuCss;
|
|
6
|
-
//# sourceMappingURL=ContextMenu.css.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
package/cjs/ContextMenu.js
DELETED
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var core = require('@salt-ds/core');
|
|
5
|
-
var styles = require('@salt-ds/styles');
|
|
6
|
-
var window = require('@salt-ds/window');
|
|
7
|
-
var menuUtils = require('./menu-utils.js');
|
|
8
|
-
var ContextMenu$1 = require('./ContextMenu.css.js');
|
|
9
|
-
|
|
10
|
-
const ContextMenu = ({
|
|
11
|
-
menuHandler,
|
|
12
|
-
menuItemDescriptors,
|
|
13
|
-
onOpenChange,
|
|
14
|
-
open,
|
|
15
|
-
x,
|
|
16
|
-
y
|
|
17
|
-
}) => {
|
|
18
|
-
const targetWindow = window.useWindow();
|
|
19
|
-
styles.useComponentCssInjection({
|
|
20
|
-
testId: "vuu-context-menu",
|
|
21
|
-
css: ContextMenu$1,
|
|
22
|
-
window: targetWindow
|
|
23
|
-
});
|
|
24
|
-
const virtualElement = {
|
|
25
|
-
getBoundingClientRect: () => ({
|
|
26
|
-
width: 0,
|
|
27
|
-
height: 0,
|
|
28
|
-
x,
|
|
29
|
-
y,
|
|
30
|
-
top: y,
|
|
31
|
-
right: x,
|
|
32
|
-
bottom: y,
|
|
33
|
-
left: x
|
|
34
|
-
})
|
|
35
|
-
};
|
|
36
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
37
|
-
core.Menu,
|
|
38
|
-
{
|
|
39
|
-
getVirtualElement: () => virtualElement,
|
|
40
|
-
onOpenChange,
|
|
41
|
-
open,
|
|
42
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuPanel, { className: "vuuContextMenuPanel", children: menuUtils.menuItemsFromMenuDescriptors(menuItemDescriptors, menuHandler) })
|
|
43
|
-
}
|
|
44
|
-
);
|
|
45
|
-
};
|
|
46
|
-
|
|
47
|
-
exports.ContextMenu = ContextMenu;
|
|
48
|
-
//# sourceMappingURL=ContextMenu.js.map
|
package/cjs/ContextMenu.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.js","sources":["../../../packages/vuu-context-menu/src/ContextMenu.tsx"],"sourcesContent":["import { VirtualElement } from \"@floating-ui/dom\";\nimport { Menu, MenuPanel, MenuProps } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { MenuActionHandler } from \"./ContextMenuProvider\";\nimport {\n ContextMenuItemDescriptor,\n menuItemsFromMenuDescriptors,\n} from \"./menu-utils\";\n\nimport contextMenuCss from \"./ContextMenu.css\";\n\nexport interface ContextMenuProps\n extends Pick<MenuProps, \"open\" | \"onOpenChange\"> {\n menuHandler: MenuActionHandler;\n menuItemDescriptors: ContextMenuItemDescriptor[];\n x: number;\n y: number;\n}\n\nexport const ContextMenu = ({\n menuHandler,\n menuItemDescriptors,\n onOpenChange,\n open,\n x,\n y,\n}: ContextMenuProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-context-menu\",\n css: contextMenuCss,\n window: targetWindow,\n });\n\n const virtualElement: VirtualElement = {\n getBoundingClientRect: () => ({\n width: 0,\n height: 0,\n x,\n y,\n top: y,\n right: x,\n bottom: y,\n left: x,\n }),\n };\n\n return (\n <Menu\n getVirtualElement={() => virtualElement}\n onOpenChange={onOpenChange}\n open={open}\n >\n <MenuPanel className=\"vuuContextMenuPanel\">\n {menuItemsFromMenuDescriptors(menuItemDescriptors, menuHandler)}\n </MenuPanel>\n </Menu>\n );\n};\n"],"names":["useWindow","useComponentCssInjection","contextMenuCss","jsx","Menu","MenuPanel","menuItemsFromMenuDescriptors"],"mappings":";;;;;;;;;AAoBO,MAAM,cAAc,CAAC;AAAA,EAC1B,WAAA;AAAA,EACA,mBAAA;AAAA,EACA,YAAA;AAAA,EACA,IAAA;AAAA,EACA,CAAA;AAAA,EACA;AACF,CAAwB,KAAA;AACtB,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,aAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,cAAiC,GAAA;AAAA,IACrC,uBAAuB,OAAO;AAAA,MAC5B,KAAO,EAAA,CAAA;AAAA,MACP,MAAQ,EAAA,CAAA;AAAA,MACR,CAAA;AAAA,MACA,CAAA;AAAA,MACA,GAAK,EAAA,CAAA;AAAA,MACL,KAAO,EAAA,CAAA;AAAA,MACP,MAAQ,EAAA,CAAA;AAAA,MACR,IAAM,EAAA;AAAA,KACR;AAAA,GACF;AAEA,EACE,uBAAAC,cAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,mBAAmB,MAAM,cAAA;AAAA,MACzB,YAAA;AAAA,MACA,IAAA;AAAA,MAEA,yCAACC,cAAU,EAAA,EAAA,SAAA,EAAU,uBAClB,QAA6B,EAAAC,sCAAA,CAAA,mBAAA,EAAqB,WAAW,CAChE,EAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var react = require('react');
|
|
5
|
-
|
|
6
|
-
const ContextMenuContext = react.createContext(
|
|
7
|
-
null
|
|
8
|
-
);
|
|
9
|
-
const Provider = ({
|
|
10
|
-
children,
|
|
11
|
-
context,
|
|
12
|
-
menuActionHandler,
|
|
13
|
-
menuBuilder
|
|
14
|
-
}) => {
|
|
15
|
-
const [contextMenu, setContextMenu] = react.useState(null);
|
|
16
|
-
const showContextMenu = react.useMemo(() => {
|
|
17
|
-
if (context?.showContextMenu) {
|
|
18
|
-
return context.showContextMenu;
|
|
19
|
-
} else {
|
|
20
|
-
return (contextMenu2) => {
|
|
21
|
-
setContextMenu(contextMenu2);
|
|
22
|
-
};
|
|
23
|
-
}
|
|
24
|
-
}, [context]);
|
|
25
|
-
const menuBuilders = react.useMemo(() => {
|
|
26
|
-
if (context?.menuBuilders && menuBuilder) {
|
|
27
|
-
return context.menuBuilders.concat(menuBuilder);
|
|
28
|
-
} else if (menuBuilder) {
|
|
29
|
-
return [menuBuilder];
|
|
30
|
-
} else {
|
|
31
|
-
return context?.menuBuilders || [];
|
|
32
|
-
}
|
|
33
|
-
}, [context, menuBuilder]);
|
|
34
|
-
const handleMenuAction = react.useCallback(
|
|
35
|
-
(menuItemId, options) => {
|
|
36
|
-
if (menuActionHandler?.(menuItemId, options)) {
|
|
37
|
-
return true;
|
|
38
|
-
}
|
|
39
|
-
if (context?.menuActionHandler?.(menuItemId, options)) {
|
|
40
|
-
return true;
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
[context, menuActionHandler]
|
|
44
|
-
);
|
|
45
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
46
|
-
ContextMenuContext.Provider,
|
|
47
|
-
{
|
|
48
|
-
value: {
|
|
49
|
-
menuActionHandler: handleMenuAction,
|
|
50
|
-
menuBuilders,
|
|
51
|
-
showContextMenu
|
|
52
|
-
},
|
|
53
|
-
children: [
|
|
54
|
-
children,
|
|
55
|
-
contextMenu
|
|
56
|
-
]
|
|
57
|
-
}
|
|
58
|
-
);
|
|
59
|
-
};
|
|
60
|
-
const ContextMenuProvider = ({
|
|
61
|
-
children,
|
|
62
|
-
menuActionHandler,
|
|
63
|
-
menuBuilder
|
|
64
|
-
}) => {
|
|
65
|
-
return /* @__PURE__ */ jsxRuntime.jsx(ContextMenuContext.Consumer, { children: (parentContext) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
66
|
-
Provider,
|
|
67
|
-
{
|
|
68
|
-
context: parentContext,
|
|
69
|
-
menuActionHandler,
|
|
70
|
-
menuBuilder,
|
|
71
|
-
children
|
|
72
|
-
}
|
|
73
|
-
) });
|
|
74
|
-
};
|
|
75
|
-
|
|
76
|
-
exports.ContextMenuContext = ContextMenuContext;
|
|
77
|
-
exports.ContextMenuProvider = ContextMenuProvider;
|
|
78
|
-
//# sourceMappingURL=ContextMenuProvider.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenuProvider.js","sources":["../../../packages/vuu-context-menu/src/ContextMenuProvider.tsx"],"sourcesContent":["import {\n createContext,\n ReactElement,\n ReactNode,\n useCallback,\n useMemo,\n useState,\n} from \"react\";\n\nimport { ContextMenuItemDescriptor } from \"./menu-utils\";\n\nexport type MenuActionHandler<T extends string = string, Options = unknown> = (\n menuItemId: T,\n options?: Options,\n) => boolean | undefined;\n\nexport type MenuBuilder<Location extends string = string, Options = unknown> = (\n location: Location,\n options: Options,\n) => ContextMenuItemDescriptor[];\n\nexport interface ContextMenuContextType {\n menuBuilders: MenuBuilder[];\n menuActionHandler: MenuActionHandler;\n showContextMenu: (contextMenu: ReactElement | null) => void;\n}\n\nexport const ContextMenuContext = createContext<ContextMenuContextType | null>(\n null,\n);\n\nexport interface ContextMenuProviderProps<\n L extends string = string,\n O = unknown,\n> {\n children: ReactNode;\n menuActionHandler?: MenuActionHandler;\n menuBuilder?: MenuBuilder<L, O>;\n}\n\ninterface ProviderProps<L extends string = string, O = unknown>\n extends ContextMenuProviderProps<L, O> {\n context: ContextMenuContextType | null;\n}\n\nconst Provider = <L extends string = string, O = unknown>({\n children,\n context,\n menuActionHandler,\n menuBuilder,\n}: ProviderProps<L, O>) => {\n const [contextMenu, setContextMenu] = useState<ReactElement | null>(null);\n const showContextMenu = useMemo(() => {\n if (context?.showContextMenu) {\n return context.showContextMenu;\n } else {\n return (contextMenu: ReactElement | null) => {\n setContextMenu(contextMenu);\n };\n }\n }, [context]);\n const menuBuilders = useMemo(() => {\n if (context?.menuBuilders && menuBuilder) {\n // menuBuilder may have a narrower type than the inherited menuBuilders, discard this\n return context.menuBuilders.concat(menuBuilder as MenuBuilder);\n } else if (menuBuilder) {\n return [menuBuilder as MenuBuilder];\n } else {\n return context?.menuBuilders || [];\n }\n }, [context, menuBuilder]);\n\n const handleMenuAction = useCallback<MenuActionHandler>(\n (menuItemId, options) => {\n if (menuActionHandler?.(menuItemId, options)) {\n return true;\n }\n\n if (context?.menuActionHandler?.(menuItemId, options)) {\n return true;\n }\n },\n [context, menuActionHandler],\n );\n\n return (\n <ContextMenuContext.Provider\n value={{\n menuActionHandler: handleMenuAction,\n menuBuilders,\n showContextMenu,\n }}\n >\n {children}\n {contextMenu}\n </ContextMenuContext.Provider>\n );\n};\n\nexport const ContextMenuProvider = <L extends string = string, O = unknown>({\n children,\n menuActionHandler,\n menuBuilder,\n}: ContextMenuProviderProps<L, O>) => {\n return (\n <ContextMenuContext.Consumer>\n {(parentContext) => (\n <Provider<L, O>\n context={parentContext}\n menuActionHandler={menuActionHandler}\n menuBuilder={menuBuilder}\n >\n {children}\n </Provider>\n )}\n </ContextMenuContext.Consumer>\n );\n};\n"],"names":["createContext","useState","useMemo","contextMenu","useCallback","jsxs","jsx"],"mappings":";;;;;AA2BO,MAAM,kBAAqB,GAAAA,mBAAA;AAAA,EAChC;AACF;AAgBA,MAAM,WAAW,CAAyC;AAAA,EACxD,QAAA;AAAA,EACA,OAAA;AAAA,EACA,iBAAA;AAAA,EACA;AACF,CAA2B,KAAA;AACzB,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAIC,eAA8B,IAAI,CAAA;AACxE,EAAM,MAAA,eAAA,GAAkBC,cAAQ,MAAM;AACpC,IAAA,IAAI,SAAS,eAAiB,EAAA;AAC5B,MAAA,OAAO,OAAQ,CAAA,eAAA;AAAA,KACV,MAAA;AACL,MAAA,OAAO,CAACC,YAAqC,KAAA;AAC3C,QAAA,cAAA,CAAeA,YAAW,CAAA;AAAA,OAC5B;AAAA;AACF,GACF,EAAG,CAAC,OAAO,CAAC,CAAA;AACZ,EAAM,MAAA,YAAA,GAAeD,cAAQ,MAAM;AACjC,IAAI,IAAA,OAAA,EAAS,gBAAgB,WAAa,EAAA;AAExC,MAAO,OAAA,OAAA,CAAQ,YAAa,CAAA,MAAA,CAAO,WAA0B,CAAA;AAAA,eACpD,WAAa,EAAA;AACtB,MAAA,OAAO,CAAC,WAA0B,CAAA;AAAA,KAC7B,MAAA;AACL,MAAO,OAAA,OAAA,EAAS,gBAAgB,EAAC;AAAA;AACnC,GACC,EAAA,CAAC,OAAS,EAAA,WAAW,CAAC,CAAA;AAEzB,EAAA,MAAM,gBAAmB,GAAAE,iBAAA;AAAA,IACvB,CAAC,YAAY,OAAY,KAAA;AACvB,MAAI,IAAA,iBAAA,GAAoB,UAAY,EAAA,OAAO,CAAG,EAAA;AAC5C,QAAO,OAAA,IAAA;AAAA;AAGT,MAAA,IAAI,OAAS,EAAA,iBAAA,GAAoB,UAAY,EAAA,OAAO,CAAG,EAAA;AACrD,QAAO,OAAA,IAAA;AAAA;AACT,KACF;AAAA,IACA,CAAC,SAAS,iBAAiB;AAAA,GAC7B;AAEA,EACE,uBAAAC,eAAA;AAAA,IAAC,kBAAmB,CAAA,QAAA;AAAA,IAAnB;AAAA,MACC,KAAO,EAAA;AAAA,QACL,iBAAmB,EAAA,gBAAA;AAAA,QACnB,YAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA;AAAA;AAAA;AAAA,GACH;AAEJ,CAAA;AAEO,MAAM,sBAAsB,CAAyC;AAAA,EAC1E,QAAA;AAAA,EACA,iBAAA;AAAA,EACA;AACF,CAAsC,KAAA;AACpC,EAAA,uBACGC,cAAA,CAAA,kBAAA,CAAmB,QAAnB,EAAA,EACE,WAAC,aACA,qBAAAA,cAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA,aAAA;AAAA,MACT,iBAAA;AAAA,MACA,WAAA;AAAA,MAEC;AAAA;AAAA,GAGP,EAAA,CAAA;AAEJ;;;;;"}
|
package/cjs/index.js
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var ContextMenuProvider = require('./ContextMenuProvider.js');
|
|
4
|
-
var menuUtils = require('./menu-utils.js');
|
|
5
|
-
var useContextMenu = require('./useContextMenu.js');
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
exports.ContextMenuProvider = ContextMenuProvider.ContextMenuProvider;
|
|
10
|
-
exports.hasShowNotificationAction = menuUtils.hasShowNotificationAction;
|
|
11
|
-
exports.isGroupMenuItemDescriptor = menuUtils.isGroupMenuItemDescriptor;
|
|
12
|
-
exports.isOpenBulkEditResponse = menuUtils.isOpenBulkEditResponse;
|
|
13
|
-
exports.useContextMenu = useContextMenu.useContextMenu;
|
|
14
|
-
//# sourceMappingURL=index.js.map
|
package/cjs/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
|
package/cjs/menu-utils.js
DELETED
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var core = require('@salt-ds/core');
|
|
5
|
-
|
|
6
|
-
const isGroupMenuItemDescriptor = (menuItem) => menuItem !== void 0 && "children" in menuItem;
|
|
7
|
-
const isOpenBulkEditResponse = (rpcResponse) => rpcResponse.rpcName === "beginEditSession";
|
|
8
|
-
const hasShowNotificationAction = (res) => res.action?.type === "SHOW_NOTIFICATION_ACTION";
|
|
9
|
-
const menuItemsFromMenuDescriptors = (menuDescriptors, menuActionHandler) => {
|
|
10
|
-
const fromDescriptor = (menuItem, index) => isGroupMenuItemDescriptor(menuItem) ? /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
|
|
11
|
-
/* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuItem, { children: menuItem.label }) }),
|
|
12
|
-
/* @__PURE__ */ jsxRuntime.jsx(core.MenuPanel, { className: "vuuContextMenuPanel", children: menuItem.children.map(fromDescriptor) })
|
|
13
|
-
] }, index) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14
|
-
core.MenuItem,
|
|
15
|
-
{
|
|
16
|
-
className: menuItem.className,
|
|
17
|
-
"data-icon": menuItem.icon,
|
|
18
|
-
onClick: () => menuActionHandler(menuItem.id, menuItem.options),
|
|
19
|
-
children: menuItem.label
|
|
20
|
-
},
|
|
21
|
-
index
|
|
22
|
-
);
|
|
23
|
-
return menuDescriptors.map(fromDescriptor);
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
exports.hasShowNotificationAction = hasShowNotificationAction;
|
|
27
|
-
exports.isGroupMenuItemDescriptor = isGroupMenuItemDescriptor;
|
|
28
|
-
exports.isOpenBulkEditResponse = isOpenBulkEditResponse;
|
|
29
|
-
exports.menuItemsFromMenuDescriptors = menuItemsFromMenuDescriptors;
|
|
30
|
-
//# sourceMappingURL=menu-utils.js.map
|
package/cjs/menu-utils.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"menu-utils.js","sources":["../../../packages/vuu-context-menu/src/menu-utils.tsx"],"sourcesContent":["import { Menu, MenuItem, MenuPanel, MenuTrigger } from \"@salt-ds/core\";\nimport type {\n MenuRpcResponse,\n OpenDialogActionWithSchema,\n} from \"@vuu-ui/vuu-data-types\";\nimport type {\n ShowNotificationAction,\n VuuRpcResponse,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport { MenuActionHandler } from \"./ContextMenuProvider\";\n\nexport interface ContextMenuItemBase {\n className?: string;\n icon?: string;\n label: string;\n location?: string;\n}\n\nexport interface ContextMenuLeafItemDescriptor extends ContextMenuItemBase {\n id: string;\n options?: unknown;\n}\n\nexport interface ContextMenuGroupItemDescriptor extends ContextMenuItemBase {\n children: ContextMenuItemDescriptor[];\n}\n\nexport type ContextMenuItemDescriptor =\n | ContextMenuLeafItemDescriptor\n | ContextMenuGroupItemDescriptor;\n\nexport const isGroupMenuItemDescriptor = (\n menuItem?: ContextMenuItemDescriptor,\n): menuItem is ContextMenuGroupItemDescriptor =>\n menuItem !== undefined && \"children\" in menuItem;\n\nexport const isOpenBulkEditResponse = (\n rpcResponse: Partial<VuuRpcResponse>,\n): rpcResponse is MenuRpcResponse<OpenDialogActionWithSchema> =>\n (rpcResponse as MenuRpcResponse).rpcName === \"beginEditSession\";\n\nexport const hasShowNotificationAction = (\n res: Partial<VuuRpcResponse>,\n): res is MenuRpcResponse<ShowNotificationAction> =>\n (res as MenuRpcResponse).action?.type === \"SHOW_NOTIFICATION_ACTION\";\n\nexport const menuItemsFromMenuDescriptors = (\n menuDescriptors: ContextMenuItemDescriptor[],\n menuActionHandler: MenuActionHandler,\n) => {\n const fromDescriptor = (\n menuItem: ContextMenuItemDescriptor,\n index: number,\n ) =>\n isGroupMenuItemDescriptor(menuItem) ? (\n <Menu key={index}>\n <MenuTrigger>\n <MenuItem>{menuItem.label}</MenuItem>\n </MenuTrigger>\n <MenuPanel className=\"vuuContextMenuPanel\">\n {menuItem.children.map(fromDescriptor)}\n </MenuPanel>\n </Menu>\n ) : (\n <MenuItem\n key={index}\n className={menuItem.className}\n data-icon={menuItem.icon}\n onClick={() => menuActionHandler(menuItem.id, menuItem.options)}\n >\n {menuItem.label}\n </MenuItem>\n );\n\n return menuDescriptors.map(fromDescriptor);\n};\n"],"names":["Menu","jsx","MenuTrigger","MenuItem","MenuPanel"],"mappings":";;;;;AA+BO,MAAM,yBAA4B,GAAA,CACvC,QAEA,KAAA,QAAA,KAAa,UAAa,UAAc,IAAA;AAEnC,MAAM,sBAAyB,GAAA,CACpC,WAEC,KAAA,WAAA,CAAgC,OAAY,KAAA;AAExC,MAAM,yBAA4B,GAAA,CACvC,GAEC,KAAA,GAAA,CAAwB,QAAQ,IAAS,KAAA;AAE/B,MAAA,4BAAA,GAA+B,CAC1C,eAAA,EACA,iBACG,KAAA;AACH,EAAM,MAAA,cAAA,GAAiB,CACrB,QACA,EAAA,KAAA,KAEA,0BAA0B,QAAQ,CAAA,mCAC/BA,SACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAACC,gBACC,EAAA,EAAA,QAAA,kBAAAD,cAAA,CAACE,aAAU,EAAA,EAAA,QAAA,EAAA,QAAA,CAAS,OAAM,CAC5B,EAAA,CAAA;AAAA,oBACAF,cAAA,CAACG,kBAAU,SAAU,EAAA,qBAAA,EAClB,mBAAS,QAAS,CAAA,GAAA,CAAI,cAAc,CACvC,EAAA;AAAA,GAAA,EAAA,EANS,KAOX,CAEA,mBAAAH,cAAA;AAAA,IAACE,aAAA;AAAA,IAAA;AAAA,MAEC,WAAW,QAAS,CAAA,SAAA;AAAA,MACpB,aAAW,QAAS,CAAA,IAAA;AAAA,MACpB,SAAS,MAAM,iBAAA,CAAkB,QAAS,CAAA,EAAA,EAAI,SAAS,OAAO,CAAA;AAAA,MAE7D,QAAS,EAAA,QAAA,CAAA;AAAA,KAAA;AAAA,IALL;AAAA,GAMP;AAGJ,EAAO,OAAA,eAAA,CAAgB,IAAI,cAAc,CAAA;AAC3C;;;;;;;"}
|
package/cjs/useContextMenu.js
DELETED
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var react = require('react');
|
|
5
|
-
var ContextMenu = require('./ContextMenu.js');
|
|
6
|
-
var ContextMenuProvider = require('./ContextMenuProvider.js');
|
|
7
|
-
|
|
8
|
-
const useContextMenu = (menuBuilder, menuActionHandler) => {
|
|
9
|
-
const ctx = react.useContext(ContextMenuProvider.ContextMenuContext);
|
|
10
|
-
const buildMenuOptions = react.useCallback(
|
|
11
|
-
(menuBuilders, location, options) => {
|
|
12
|
-
let results = [];
|
|
13
|
-
for (const menuBuilder2 of menuBuilders) {
|
|
14
|
-
results = results.concat(menuBuilder2(location, options));
|
|
15
|
-
}
|
|
16
|
-
return results;
|
|
17
|
-
},
|
|
18
|
-
[]
|
|
19
|
-
);
|
|
20
|
-
const handleOpenChange = react.useCallback(
|
|
21
|
-
(open) => {
|
|
22
|
-
if (!open) {
|
|
23
|
-
ctx?.showContextMenu(null);
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
|
-
[ctx]
|
|
27
|
-
);
|
|
28
|
-
const showContextMenu = react.useCallback(
|
|
29
|
-
(evt, location, options, { onOpenChange, x = evt.clientX, y = evt.clientY } = {
|
|
30
|
-
x: evt.clientX,
|
|
31
|
-
y: evt.clientY
|
|
32
|
-
}) => {
|
|
33
|
-
evt.stopPropagation?.();
|
|
34
|
-
evt.preventDefault?.();
|
|
35
|
-
const menuBuilders = [];
|
|
36
|
-
if (menuBuilder) {
|
|
37
|
-
menuBuilders.push(menuBuilder);
|
|
38
|
-
}
|
|
39
|
-
if (ctx && Array.isArray(ctx?.menuBuilders) && ctx.menuBuilders.length > 0) {
|
|
40
|
-
menuBuilders.push(...ctx.menuBuilders);
|
|
41
|
-
}
|
|
42
|
-
if (menuBuilders.length > 0) {
|
|
43
|
-
const menuItemDescriptors = buildMenuOptions(
|
|
44
|
-
menuBuilders,
|
|
45
|
-
location,
|
|
46
|
-
options
|
|
47
|
-
);
|
|
48
|
-
const menuHandler = (menuItemId, options2) => {
|
|
49
|
-
if (menuActionHandler?.(menuItemId, options2) === true) {
|
|
50
|
-
return true;
|
|
51
|
-
} else {
|
|
52
|
-
return ctx?.menuActionHandler(menuItemId, options2);
|
|
53
|
-
}
|
|
54
|
-
};
|
|
55
|
-
const localOpenChange = (isOpen) => {
|
|
56
|
-
onOpenChange?.(isOpen);
|
|
57
|
-
handleOpenChange(isOpen);
|
|
58
|
-
};
|
|
59
|
-
if (menuItemDescriptors.length) {
|
|
60
|
-
ctx?.showContextMenu(
|
|
61
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
62
|
-
ContextMenu.ContextMenu,
|
|
63
|
-
{
|
|
64
|
-
menuHandler,
|
|
65
|
-
menuItemDescriptors,
|
|
66
|
-
onOpenChange: localOpenChange,
|
|
67
|
-
open: true,
|
|
68
|
-
x,
|
|
69
|
-
y
|
|
70
|
-
}
|
|
71
|
-
)
|
|
72
|
-
);
|
|
73
|
-
return true;
|
|
74
|
-
}
|
|
75
|
-
} else {
|
|
76
|
-
console.warn(
|
|
77
|
-
"useContextMenu, no menuBuilders configured. These should be supplied via the ContextMenuProvider(s)"
|
|
78
|
-
);
|
|
79
|
-
}
|
|
80
|
-
return false;
|
|
81
|
-
},
|
|
82
|
-
[buildMenuOptions, ctx, handleOpenChange, menuActionHandler, menuBuilder]
|
|
83
|
-
);
|
|
84
|
-
return showContextMenu;
|
|
85
|
-
};
|
|
86
|
-
|
|
87
|
-
exports.useContextMenu = useContextMenu;
|
|
88
|
-
//# sourceMappingURL=useContextMenu.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useContextMenu.js","sources":["../../../packages/vuu-context-menu/src/useContextMenu.tsx"],"sourcesContent":["import { useCallback, useContext } from \"react\";\nimport { ContextMenu, ContextMenuProps } from \"./ContextMenu\";\nimport {\n ContextMenuContext,\n MenuActionHandler,\n MenuBuilder,\n} from \"./ContextMenuProvider\";\nimport { ContextMenuItemDescriptor } from \"./menu-utils\";\n\nexport type EventLike = {\n clientX: number;\n clientY: number;\n preventDefault?: () => void;\n stopPropagation?: () => void;\n};\n\nexport type ShowContextMenu = (\n e: EventLike,\n location: string,\n options: unknown,\n contextMenuProps?: Partial<\n Pick<ContextMenuProps, \"onOpenChange\" | \"x\" | \"y\">\n >,\n) => boolean;\n\n// The argument allows a top-level menuBuilder to operate outside the Context\nexport const useContextMenu = (\n menuBuilder?: MenuBuilder,\n menuActionHandler?: MenuActionHandler,\n): ShowContextMenu => {\n const ctx = useContext(ContextMenuContext);\n\n const buildMenuOptions = useCallback(\n (menuBuilders: MenuBuilder[], location: string, options: unknown) => {\n let results: ContextMenuItemDescriptor[] = [];\n for (const menuBuilder of menuBuilders) {\n // Maybe we should leave the concatenation to the menuBuilder, then it can control menuItem order\n results = results.concat(menuBuilder(location, options));\n }\n return results;\n },\n [],\n );\n\n const handleOpenChange = useCallback(\n (open: boolean) => {\n if (!open) {\n ctx?.showContextMenu(null);\n }\n },\n [ctx],\n );\n\n const showContextMenu = useCallback<ShowContextMenu>(\n (\n evt,\n location,\n options,\n { onOpenChange, x = evt.clientX, y = evt.clientY } = {\n x: evt.clientX,\n y: evt.clientY,\n },\n ) => {\n evt.stopPropagation?.();\n evt.preventDefault?.();\n\n const menuBuilders: MenuBuilder[] = [];\n if (menuBuilder) {\n menuBuilders.push(menuBuilder);\n }\n if (\n ctx &&\n Array.isArray(ctx?.menuBuilders) &&\n ctx.menuBuilders.length > 0\n ) {\n menuBuilders.push(...ctx.menuBuilders);\n }\n\n if (menuBuilders.length > 0) {\n const menuItemDescriptors = buildMenuOptions(\n menuBuilders,\n location,\n options,\n );\n\n const menuHandler: MenuActionHandler = (menuItemId, options) => {\n if (menuActionHandler?.(menuItemId, options) === true) {\n return true;\n } else {\n return ctx?.menuActionHandler(menuItemId, options);\n }\n };\n\n const localOpenChange = (isOpen: boolean) => {\n onOpenChange?.(isOpen);\n handleOpenChange(isOpen);\n };\n\n if (menuItemDescriptors.length) {\n ctx?.showContextMenu(\n <ContextMenu\n menuHandler={menuHandler}\n menuItemDescriptors={menuItemDescriptors}\n onOpenChange={localOpenChange}\n open={true}\n x={x}\n y={y}\n />,\n );\n return true;\n }\n } else {\n console.warn(\n \"useContextMenu, no menuBuilders configured. These should be supplied via the ContextMenuProvider(s)\",\n );\n }\n return false;\n },\n [buildMenuOptions, ctx, handleOpenChange, menuActionHandler, menuBuilder],\n );\n\n return showContextMenu;\n};\n"],"names":["useContext","ContextMenuContext","useCallback","menuBuilder","options","jsx","ContextMenu"],"mappings":"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"}
|
package/esm/ContextMenu.css.js
DELETED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var contextMenuCss = ".vuuContextMenuPanel {\n &:has([data-icon]) {\n .saltMenuItem {\n padding-left: calc(var(--salt-spacing-400) + var(--salt-spacing-200));\n }\n .saltMenuItem[data-icon]:after {\n --vuu-icon-left: var(--salt-spacing-150);\n --vuu-icon-top: var(--salt-spacing-150);\n }\n .saltMenuItem[aria-haspopup=\"menu\"]:after {\n content: \"\";\n background-color: var(--vuu-icon-color, var(--saltIcon-color, var(--salt-content-secondary-foreground)));\n right: var(--salt-spacing-100);\n height: var(--vuu-icon-height, var(--vuu-icon-size, 12px));\n mask: var(--vuu-svg-triangle-right) center center / 8px 8px;\n mask-repeat: no-repeat;\n position: absolute;\n transform: rotate(315deg);\n top: var(--salt-spacing-200);\n width: var(--vuu-icon-width, var(--vuu-icon-size, 12px));\n }\n }\n}";
|
|
2
|
-
|
|
3
|
-
export { contextMenuCss as default };
|
|
4
|
-
//# sourceMappingURL=ContextMenu.css.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
package/esm/ContextMenu.js
DELETED
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { Menu, MenuPanel } from '@salt-ds/core';
|
|
3
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
|
-
import { menuItemsFromMenuDescriptors } from './menu-utils.js';
|
|
6
|
-
import contextMenuCss from './ContextMenu.css.js';
|
|
7
|
-
|
|
8
|
-
const ContextMenu = ({
|
|
9
|
-
menuHandler,
|
|
10
|
-
menuItemDescriptors,
|
|
11
|
-
onOpenChange,
|
|
12
|
-
open,
|
|
13
|
-
x,
|
|
14
|
-
y
|
|
15
|
-
}) => {
|
|
16
|
-
const targetWindow = useWindow();
|
|
17
|
-
useComponentCssInjection({
|
|
18
|
-
testId: "vuu-context-menu",
|
|
19
|
-
css: contextMenuCss,
|
|
20
|
-
window: targetWindow
|
|
21
|
-
});
|
|
22
|
-
const virtualElement = {
|
|
23
|
-
getBoundingClientRect: () => ({
|
|
24
|
-
width: 0,
|
|
25
|
-
height: 0,
|
|
26
|
-
x,
|
|
27
|
-
y,
|
|
28
|
-
top: y,
|
|
29
|
-
right: x,
|
|
30
|
-
bottom: y,
|
|
31
|
-
left: x
|
|
32
|
-
})
|
|
33
|
-
};
|
|
34
|
-
return /* @__PURE__ */ jsx(
|
|
35
|
-
Menu,
|
|
36
|
-
{
|
|
37
|
-
getVirtualElement: () => virtualElement,
|
|
38
|
-
onOpenChange,
|
|
39
|
-
open,
|
|
40
|
-
children: /* @__PURE__ */ jsx(MenuPanel, { className: "vuuContextMenuPanel", children: menuItemsFromMenuDescriptors(menuItemDescriptors, menuHandler) })
|
|
41
|
-
}
|
|
42
|
-
);
|
|
43
|
-
};
|
|
44
|
-
|
|
45
|
-
export { ContextMenu };
|
|
46
|
-
//# sourceMappingURL=ContextMenu.js.map
|
package/esm/ContextMenu.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.js","sources":["../../../packages/vuu-context-menu/src/ContextMenu.tsx"],"sourcesContent":["import { VirtualElement } from \"@floating-ui/dom\";\nimport { Menu, MenuPanel, MenuProps } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { MenuActionHandler } from \"./ContextMenuProvider\";\nimport {\n ContextMenuItemDescriptor,\n menuItemsFromMenuDescriptors,\n} from \"./menu-utils\";\n\nimport contextMenuCss from \"./ContextMenu.css\";\n\nexport interface ContextMenuProps\n extends Pick<MenuProps, \"open\" | \"onOpenChange\"> {\n menuHandler: MenuActionHandler;\n menuItemDescriptors: ContextMenuItemDescriptor[];\n x: number;\n y: number;\n}\n\nexport const ContextMenu = ({\n menuHandler,\n menuItemDescriptors,\n onOpenChange,\n open,\n x,\n y,\n}: ContextMenuProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-context-menu\",\n css: contextMenuCss,\n window: targetWindow,\n });\n\n const virtualElement: VirtualElement = {\n getBoundingClientRect: () => ({\n width: 0,\n height: 0,\n x,\n y,\n top: y,\n right: x,\n bottom: y,\n left: x,\n }),\n };\n\n return (\n <Menu\n getVirtualElement={() => virtualElement}\n onOpenChange={onOpenChange}\n open={open}\n >\n <MenuPanel className=\"vuuContextMenuPanel\">\n {menuItemsFromMenuDescriptors(menuItemDescriptors, menuHandler)}\n </MenuPanel>\n </Menu>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAoBO,MAAM,cAAc,CAAC;AAAA,EAC1B,WAAA;AAAA,EACA,mBAAA;AAAA,EACA,YAAA;AAAA,EACA,IAAA;AAAA,EACA,CAAA;AAAA,EACA;AACF,CAAwB,KAAA;AACtB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAA,cAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,cAAiC,GAAA;AAAA,IACrC,uBAAuB,OAAO;AAAA,MAC5B,KAAO,EAAA,CAAA;AAAA,MACP,MAAQ,EAAA,CAAA;AAAA,MACR,CAAA;AAAA,MACA,CAAA;AAAA,MACA,GAAK,EAAA,CAAA;AAAA,MACL,KAAO,EAAA,CAAA;AAAA,MACP,MAAQ,EAAA,CAAA;AAAA,MACR,IAAM,EAAA;AAAA,KACR;AAAA,GACF;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,mBAAmB,MAAM,cAAA;AAAA,MACzB,YAAA;AAAA,MACA,IAAA;AAAA,MAEA,8BAAC,SAAU,EAAA,EAAA,SAAA,EAAU,uBAClB,QAA6B,EAAA,4BAAA,CAAA,mBAAA,EAAqB,WAAW,CAChE,EAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { createContext, useState, useMemo, useCallback } from 'react';
|
|
3
|
-
|
|
4
|
-
const ContextMenuContext = createContext(
|
|
5
|
-
null
|
|
6
|
-
);
|
|
7
|
-
const Provider = ({
|
|
8
|
-
children,
|
|
9
|
-
context,
|
|
10
|
-
menuActionHandler,
|
|
11
|
-
menuBuilder
|
|
12
|
-
}) => {
|
|
13
|
-
const [contextMenu, setContextMenu] = useState(null);
|
|
14
|
-
const showContextMenu = useMemo(() => {
|
|
15
|
-
if (context?.showContextMenu) {
|
|
16
|
-
return context.showContextMenu;
|
|
17
|
-
} else {
|
|
18
|
-
return (contextMenu2) => {
|
|
19
|
-
setContextMenu(contextMenu2);
|
|
20
|
-
};
|
|
21
|
-
}
|
|
22
|
-
}, [context]);
|
|
23
|
-
const menuBuilders = useMemo(() => {
|
|
24
|
-
if (context?.menuBuilders && menuBuilder) {
|
|
25
|
-
return context.menuBuilders.concat(menuBuilder);
|
|
26
|
-
} else if (menuBuilder) {
|
|
27
|
-
return [menuBuilder];
|
|
28
|
-
} else {
|
|
29
|
-
return context?.menuBuilders || [];
|
|
30
|
-
}
|
|
31
|
-
}, [context, menuBuilder]);
|
|
32
|
-
const handleMenuAction = useCallback(
|
|
33
|
-
(menuItemId, options) => {
|
|
34
|
-
if (menuActionHandler?.(menuItemId, options)) {
|
|
35
|
-
return true;
|
|
36
|
-
}
|
|
37
|
-
if (context?.menuActionHandler?.(menuItemId, options)) {
|
|
38
|
-
return true;
|
|
39
|
-
}
|
|
40
|
-
},
|
|
41
|
-
[context, menuActionHandler]
|
|
42
|
-
);
|
|
43
|
-
return /* @__PURE__ */ jsxs(
|
|
44
|
-
ContextMenuContext.Provider,
|
|
45
|
-
{
|
|
46
|
-
value: {
|
|
47
|
-
menuActionHandler: handleMenuAction,
|
|
48
|
-
menuBuilders,
|
|
49
|
-
showContextMenu
|
|
50
|
-
},
|
|
51
|
-
children: [
|
|
52
|
-
children,
|
|
53
|
-
contextMenu
|
|
54
|
-
]
|
|
55
|
-
}
|
|
56
|
-
);
|
|
57
|
-
};
|
|
58
|
-
const ContextMenuProvider = ({
|
|
59
|
-
children,
|
|
60
|
-
menuActionHandler,
|
|
61
|
-
menuBuilder
|
|
62
|
-
}) => {
|
|
63
|
-
return /* @__PURE__ */ jsx(ContextMenuContext.Consumer, { children: (parentContext) => /* @__PURE__ */ jsx(
|
|
64
|
-
Provider,
|
|
65
|
-
{
|
|
66
|
-
context: parentContext,
|
|
67
|
-
menuActionHandler,
|
|
68
|
-
menuBuilder,
|
|
69
|
-
children
|
|
70
|
-
}
|
|
71
|
-
) });
|
|
72
|
-
};
|
|
73
|
-
|
|
74
|
-
export { ContextMenuContext, ContextMenuProvider };
|
|
75
|
-
//# sourceMappingURL=ContextMenuProvider.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenuProvider.js","sources":["../../../packages/vuu-context-menu/src/ContextMenuProvider.tsx"],"sourcesContent":["import {\n createContext,\n ReactElement,\n ReactNode,\n useCallback,\n useMemo,\n useState,\n} from \"react\";\n\nimport { ContextMenuItemDescriptor } from \"./menu-utils\";\n\nexport type MenuActionHandler<T extends string = string, Options = unknown> = (\n menuItemId: T,\n options?: Options,\n) => boolean | undefined;\n\nexport type MenuBuilder<Location extends string = string, Options = unknown> = (\n location: Location,\n options: Options,\n) => ContextMenuItemDescriptor[];\n\nexport interface ContextMenuContextType {\n menuBuilders: MenuBuilder[];\n menuActionHandler: MenuActionHandler;\n showContextMenu: (contextMenu: ReactElement | null) => void;\n}\n\nexport const ContextMenuContext = createContext<ContextMenuContextType | null>(\n null,\n);\n\nexport interface ContextMenuProviderProps<\n L extends string = string,\n O = unknown,\n> {\n children: ReactNode;\n menuActionHandler?: MenuActionHandler;\n menuBuilder?: MenuBuilder<L, O>;\n}\n\ninterface ProviderProps<L extends string = string, O = unknown>\n extends ContextMenuProviderProps<L, O> {\n context: ContextMenuContextType | null;\n}\n\nconst Provider = <L extends string = string, O = unknown>({\n children,\n context,\n menuActionHandler,\n menuBuilder,\n}: ProviderProps<L, O>) => {\n const [contextMenu, setContextMenu] = useState<ReactElement | null>(null);\n const showContextMenu = useMemo(() => {\n if (context?.showContextMenu) {\n return context.showContextMenu;\n } else {\n return (contextMenu: ReactElement | null) => {\n setContextMenu(contextMenu);\n };\n }\n }, [context]);\n const menuBuilders = useMemo(() => {\n if (context?.menuBuilders && menuBuilder) {\n // menuBuilder may have a narrower type than the inherited menuBuilders, discard this\n return context.menuBuilders.concat(menuBuilder as MenuBuilder);\n } else if (menuBuilder) {\n return [menuBuilder as MenuBuilder];\n } else {\n return context?.menuBuilders || [];\n }\n }, [context, menuBuilder]);\n\n const handleMenuAction = useCallback<MenuActionHandler>(\n (menuItemId, options) => {\n if (menuActionHandler?.(menuItemId, options)) {\n return true;\n }\n\n if (context?.menuActionHandler?.(menuItemId, options)) {\n return true;\n }\n },\n [context, menuActionHandler],\n );\n\n return (\n <ContextMenuContext.Provider\n value={{\n menuActionHandler: handleMenuAction,\n menuBuilders,\n showContextMenu,\n }}\n >\n {children}\n {contextMenu}\n </ContextMenuContext.Provider>\n );\n};\n\nexport const ContextMenuProvider = <L extends string = string, O = unknown>({\n children,\n menuActionHandler,\n menuBuilder,\n}: ContextMenuProviderProps<L, O>) => {\n return (\n <ContextMenuContext.Consumer>\n {(parentContext) => (\n <Provider<L, O>\n context={parentContext}\n menuActionHandler={menuActionHandler}\n menuBuilder={menuBuilder}\n >\n {children}\n </Provider>\n )}\n </ContextMenuContext.Consumer>\n );\n};\n"],"names":["contextMenu"],"mappings":";;;AA2BO,MAAM,kBAAqB,GAAA,aAAA;AAAA,EAChC;AACF;AAgBA,MAAM,WAAW,CAAyC;AAAA,EACxD,QAAA;AAAA,EACA,OAAA;AAAA,EACA,iBAAA;AAAA,EACA;AACF,CAA2B,KAAA;AACzB,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAA8B,IAAI,CAAA;AACxE,EAAM,MAAA,eAAA,GAAkB,QAAQ,MAAM;AACpC,IAAA,IAAI,SAAS,eAAiB,EAAA;AAC5B,MAAA,OAAO,OAAQ,CAAA,eAAA;AAAA,KACV,MAAA;AACL,MAAA,OAAO,CAACA,YAAqC,KAAA;AAC3C,QAAA,cAAA,CAAeA,YAAW,CAAA;AAAA,OAC5B;AAAA;AACF,GACF,EAAG,CAAC,OAAO,CAAC,CAAA;AACZ,EAAM,MAAA,YAAA,GAAe,QAAQ,MAAM;AACjC,IAAI,IAAA,OAAA,EAAS,gBAAgB,WAAa,EAAA;AAExC,MAAO,OAAA,OAAA,CAAQ,YAAa,CAAA,MAAA,CAAO,WAA0B,CAAA;AAAA,eACpD,WAAa,EAAA;AACtB,MAAA,OAAO,CAAC,WAA0B,CAAA;AAAA,KAC7B,MAAA;AACL,MAAO,OAAA,OAAA,EAAS,gBAAgB,EAAC;AAAA;AACnC,GACC,EAAA,CAAC,OAAS,EAAA,WAAW,CAAC,CAAA;AAEzB,EAAA,MAAM,gBAAmB,GAAA,WAAA;AAAA,IACvB,CAAC,YAAY,OAAY,KAAA;AACvB,MAAI,IAAA,iBAAA,GAAoB,UAAY,EAAA,OAAO,CAAG,EAAA;AAC5C,QAAO,OAAA,IAAA;AAAA;AAGT,MAAA,IAAI,OAAS,EAAA,iBAAA,GAAoB,UAAY,EAAA,OAAO,CAAG,EAAA;AACrD,QAAO,OAAA,IAAA;AAAA;AACT,KACF;AAAA,IACA,CAAC,SAAS,iBAAiB;AAAA,GAC7B;AAEA,EACE,uBAAA,IAAA;AAAA,IAAC,kBAAmB,CAAA,QAAA;AAAA,IAAnB;AAAA,MACC,KAAO,EAAA;AAAA,QACL,iBAAmB,EAAA,gBAAA;AAAA,QACnB,YAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA;AAAA;AAAA;AAAA,GACH;AAEJ,CAAA;AAEO,MAAM,sBAAsB,CAAyC;AAAA,EAC1E,QAAA;AAAA,EACA,iBAAA;AAAA,EACA;AACF,CAAsC,KAAA;AACpC,EAAA,uBACG,GAAA,CAAA,kBAAA,CAAmB,QAAnB,EAAA,EACE,WAAC,aACA,qBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA,aAAA;AAAA,MACT,iBAAA;AAAA,MACA,WAAA;AAAA,MAEC;AAAA;AAAA,GAGP,EAAA,CAAA;AAEJ;;;;"}
|
package/esm/index.js
DELETED
package/esm/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
|
package/esm/menu-utils.js
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { Menu, MenuTrigger, MenuItem, MenuPanel } from '@salt-ds/core';
|
|
3
|
-
|
|
4
|
-
const isGroupMenuItemDescriptor = (menuItem) => menuItem !== void 0 && "children" in menuItem;
|
|
5
|
-
const isOpenBulkEditResponse = (rpcResponse) => rpcResponse.rpcName === "beginEditSession";
|
|
6
|
-
const hasShowNotificationAction = (res) => res.action?.type === "SHOW_NOTIFICATION_ACTION";
|
|
7
|
-
const menuItemsFromMenuDescriptors = (menuDescriptors, menuActionHandler) => {
|
|
8
|
-
const fromDescriptor = (menuItem, index) => isGroupMenuItemDescriptor(menuItem) ? /* @__PURE__ */ jsxs(Menu, { children: [
|
|
9
|
-
/* @__PURE__ */ jsx(MenuTrigger, { children: /* @__PURE__ */ jsx(MenuItem, { children: menuItem.label }) }),
|
|
10
|
-
/* @__PURE__ */ jsx(MenuPanel, { className: "vuuContextMenuPanel", children: menuItem.children.map(fromDescriptor) })
|
|
11
|
-
] }, index) : /* @__PURE__ */ jsx(
|
|
12
|
-
MenuItem,
|
|
13
|
-
{
|
|
14
|
-
className: menuItem.className,
|
|
15
|
-
"data-icon": menuItem.icon,
|
|
16
|
-
onClick: () => menuActionHandler(menuItem.id, menuItem.options),
|
|
17
|
-
children: menuItem.label
|
|
18
|
-
},
|
|
19
|
-
index
|
|
20
|
-
);
|
|
21
|
-
return menuDescriptors.map(fromDescriptor);
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
export { hasShowNotificationAction, isGroupMenuItemDescriptor, isOpenBulkEditResponse, menuItemsFromMenuDescriptors };
|
|
25
|
-
//# sourceMappingURL=menu-utils.js.map
|
package/esm/menu-utils.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"menu-utils.js","sources":["../../../packages/vuu-context-menu/src/menu-utils.tsx"],"sourcesContent":["import { Menu, MenuItem, MenuPanel, MenuTrigger } from \"@salt-ds/core\";\nimport type {\n MenuRpcResponse,\n OpenDialogActionWithSchema,\n} from \"@vuu-ui/vuu-data-types\";\nimport type {\n ShowNotificationAction,\n VuuRpcResponse,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport { MenuActionHandler } from \"./ContextMenuProvider\";\n\nexport interface ContextMenuItemBase {\n className?: string;\n icon?: string;\n label: string;\n location?: string;\n}\n\nexport interface ContextMenuLeafItemDescriptor extends ContextMenuItemBase {\n id: string;\n options?: unknown;\n}\n\nexport interface ContextMenuGroupItemDescriptor extends ContextMenuItemBase {\n children: ContextMenuItemDescriptor[];\n}\n\nexport type ContextMenuItemDescriptor =\n | ContextMenuLeafItemDescriptor\n | ContextMenuGroupItemDescriptor;\n\nexport const isGroupMenuItemDescriptor = (\n menuItem?: ContextMenuItemDescriptor,\n): menuItem is ContextMenuGroupItemDescriptor =>\n menuItem !== undefined && \"children\" in menuItem;\n\nexport const isOpenBulkEditResponse = (\n rpcResponse: Partial<VuuRpcResponse>,\n): rpcResponse is MenuRpcResponse<OpenDialogActionWithSchema> =>\n (rpcResponse as MenuRpcResponse).rpcName === \"beginEditSession\";\n\nexport const hasShowNotificationAction = (\n res: Partial<VuuRpcResponse>,\n): res is MenuRpcResponse<ShowNotificationAction> =>\n (res as MenuRpcResponse).action?.type === \"SHOW_NOTIFICATION_ACTION\";\n\nexport const menuItemsFromMenuDescriptors = (\n menuDescriptors: ContextMenuItemDescriptor[],\n menuActionHandler: MenuActionHandler,\n) => {\n const fromDescriptor = (\n menuItem: ContextMenuItemDescriptor,\n index: number,\n ) =>\n isGroupMenuItemDescriptor(menuItem) ? (\n <Menu key={index}>\n <MenuTrigger>\n <MenuItem>{menuItem.label}</MenuItem>\n </MenuTrigger>\n <MenuPanel className=\"vuuContextMenuPanel\">\n {menuItem.children.map(fromDescriptor)}\n </MenuPanel>\n </Menu>\n ) : (\n <MenuItem\n key={index}\n className={menuItem.className}\n data-icon={menuItem.icon}\n onClick={() => menuActionHandler(menuItem.id, menuItem.options)}\n >\n {menuItem.label}\n </MenuItem>\n );\n\n return menuDescriptors.map(fromDescriptor);\n};\n"],"names":[],"mappings":";;;AA+BO,MAAM,yBAA4B,GAAA,CACvC,QAEA,KAAA,QAAA,KAAa,UAAa,UAAc,IAAA;AAEnC,MAAM,sBAAyB,GAAA,CACpC,WAEC,KAAA,WAAA,CAAgC,OAAY,KAAA;AAExC,MAAM,yBAA4B,GAAA,CACvC,GAEC,KAAA,GAAA,CAAwB,QAAQ,IAAS,KAAA;AAE/B,MAAA,4BAAA,GAA+B,CAC1C,eAAA,EACA,iBACG,KAAA;AACH,EAAM,MAAA,cAAA,GAAiB,CACrB,QACA,EAAA,KAAA,KAEA,0BAA0B,QAAQ,CAAA,wBAC/B,IACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,WACC,EAAA,EAAA,QAAA,kBAAA,GAAA,CAAC,QAAU,EAAA,EAAA,QAAA,EAAA,QAAA,CAAS,OAAM,CAC5B,EAAA,CAAA;AAAA,oBACA,GAAA,CAAC,aAAU,SAAU,EAAA,qBAAA,EAClB,mBAAS,QAAS,CAAA,GAAA,CAAI,cAAc,CACvC,EAAA;AAAA,GAAA,EAAA,EANS,KAOX,CAEA,mBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MAEC,WAAW,QAAS,CAAA,SAAA;AAAA,MACpB,aAAW,QAAS,CAAA,IAAA;AAAA,MACpB,SAAS,MAAM,iBAAA,CAAkB,QAAS,CAAA,EAAA,EAAI,SAAS,OAAO,CAAA;AAAA,MAE7D,QAAS,EAAA,QAAA,CAAA;AAAA,KAAA;AAAA,IALL;AAAA,GAMP;AAGJ,EAAO,OAAA,eAAA,CAAgB,IAAI,cAAc,CAAA;AAC3C;;;;"}
|
package/esm/useContextMenu.js
DELETED
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useContext, useCallback } from 'react';
|
|
3
|
-
import { ContextMenu } from './ContextMenu.js';
|
|
4
|
-
import { ContextMenuContext } from './ContextMenuProvider.js';
|
|
5
|
-
|
|
6
|
-
const useContextMenu = (menuBuilder, menuActionHandler) => {
|
|
7
|
-
const ctx = useContext(ContextMenuContext);
|
|
8
|
-
const buildMenuOptions = useCallback(
|
|
9
|
-
(menuBuilders, location, options) => {
|
|
10
|
-
let results = [];
|
|
11
|
-
for (const menuBuilder2 of menuBuilders) {
|
|
12
|
-
results = results.concat(menuBuilder2(location, options));
|
|
13
|
-
}
|
|
14
|
-
return results;
|
|
15
|
-
},
|
|
16
|
-
[]
|
|
17
|
-
);
|
|
18
|
-
const handleOpenChange = useCallback(
|
|
19
|
-
(open) => {
|
|
20
|
-
if (!open) {
|
|
21
|
-
ctx?.showContextMenu(null);
|
|
22
|
-
}
|
|
23
|
-
},
|
|
24
|
-
[ctx]
|
|
25
|
-
);
|
|
26
|
-
const showContextMenu = useCallback(
|
|
27
|
-
(evt, location, options, { onOpenChange, x = evt.clientX, y = evt.clientY } = {
|
|
28
|
-
x: evt.clientX,
|
|
29
|
-
y: evt.clientY
|
|
30
|
-
}) => {
|
|
31
|
-
evt.stopPropagation?.();
|
|
32
|
-
evt.preventDefault?.();
|
|
33
|
-
const menuBuilders = [];
|
|
34
|
-
if (menuBuilder) {
|
|
35
|
-
menuBuilders.push(menuBuilder);
|
|
36
|
-
}
|
|
37
|
-
if (ctx && Array.isArray(ctx?.menuBuilders) && ctx.menuBuilders.length > 0) {
|
|
38
|
-
menuBuilders.push(...ctx.menuBuilders);
|
|
39
|
-
}
|
|
40
|
-
if (menuBuilders.length > 0) {
|
|
41
|
-
const menuItemDescriptors = buildMenuOptions(
|
|
42
|
-
menuBuilders,
|
|
43
|
-
location,
|
|
44
|
-
options
|
|
45
|
-
);
|
|
46
|
-
const menuHandler = (menuItemId, options2) => {
|
|
47
|
-
if (menuActionHandler?.(menuItemId, options2) === true) {
|
|
48
|
-
return true;
|
|
49
|
-
} else {
|
|
50
|
-
return ctx?.menuActionHandler(menuItemId, options2);
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
|
-
const localOpenChange = (isOpen) => {
|
|
54
|
-
onOpenChange?.(isOpen);
|
|
55
|
-
handleOpenChange(isOpen);
|
|
56
|
-
};
|
|
57
|
-
if (menuItemDescriptors.length) {
|
|
58
|
-
ctx?.showContextMenu(
|
|
59
|
-
/* @__PURE__ */ jsx(
|
|
60
|
-
ContextMenu,
|
|
61
|
-
{
|
|
62
|
-
menuHandler,
|
|
63
|
-
menuItemDescriptors,
|
|
64
|
-
onOpenChange: localOpenChange,
|
|
65
|
-
open: true,
|
|
66
|
-
x,
|
|
67
|
-
y
|
|
68
|
-
}
|
|
69
|
-
)
|
|
70
|
-
);
|
|
71
|
-
return true;
|
|
72
|
-
}
|
|
73
|
-
} else {
|
|
74
|
-
console.warn(
|
|
75
|
-
"useContextMenu, no menuBuilders configured. These should be supplied via the ContextMenuProvider(s)"
|
|
76
|
-
);
|
|
77
|
-
}
|
|
78
|
-
return false;
|
|
79
|
-
},
|
|
80
|
-
[buildMenuOptions, ctx, handleOpenChange, menuActionHandler, menuBuilder]
|
|
81
|
-
);
|
|
82
|
-
return showContextMenu;
|
|
83
|
-
};
|
|
84
|
-
|
|
85
|
-
export { useContextMenu };
|
|
86
|
-
//# sourceMappingURL=useContextMenu.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useContextMenu.js","sources":["../../../packages/vuu-context-menu/src/useContextMenu.tsx"],"sourcesContent":["import { useCallback, useContext } from \"react\";\nimport { ContextMenu, ContextMenuProps } from \"./ContextMenu\";\nimport {\n ContextMenuContext,\n MenuActionHandler,\n MenuBuilder,\n} from \"./ContextMenuProvider\";\nimport { ContextMenuItemDescriptor } from \"./menu-utils\";\n\nexport type EventLike = {\n clientX: number;\n clientY: number;\n preventDefault?: () => void;\n stopPropagation?: () => void;\n};\n\nexport type ShowContextMenu = (\n e: EventLike,\n location: string,\n options: unknown,\n contextMenuProps?: Partial<\n Pick<ContextMenuProps, \"onOpenChange\" | \"x\" | \"y\">\n >,\n) => boolean;\n\n// The argument allows a top-level menuBuilder to operate outside the Context\nexport const useContextMenu = (\n menuBuilder?: MenuBuilder,\n menuActionHandler?: MenuActionHandler,\n): ShowContextMenu => {\n const ctx = useContext(ContextMenuContext);\n\n const buildMenuOptions = useCallback(\n (menuBuilders: MenuBuilder[], location: string, options: unknown) => {\n let results: ContextMenuItemDescriptor[] = [];\n for (const menuBuilder of menuBuilders) {\n // Maybe we should leave the concatenation to the menuBuilder, then it can control menuItem order\n results = results.concat(menuBuilder(location, options));\n }\n return results;\n },\n [],\n );\n\n const handleOpenChange = useCallback(\n (open: boolean) => {\n if (!open) {\n ctx?.showContextMenu(null);\n }\n },\n [ctx],\n );\n\n const showContextMenu = useCallback<ShowContextMenu>(\n (\n evt,\n location,\n options,\n { onOpenChange, x = evt.clientX, y = evt.clientY } = {\n x: evt.clientX,\n y: evt.clientY,\n },\n ) => {\n evt.stopPropagation?.();\n evt.preventDefault?.();\n\n const menuBuilders: MenuBuilder[] = [];\n if (menuBuilder) {\n menuBuilders.push(menuBuilder);\n }\n if (\n ctx &&\n Array.isArray(ctx?.menuBuilders) &&\n ctx.menuBuilders.length > 0\n ) {\n menuBuilders.push(...ctx.menuBuilders);\n }\n\n if (menuBuilders.length > 0) {\n const menuItemDescriptors = buildMenuOptions(\n menuBuilders,\n location,\n options,\n );\n\n const menuHandler: MenuActionHandler = (menuItemId, options) => {\n if (menuActionHandler?.(menuItemId, options) === true) {\n return true;\n } else {\n return ctx?.menuActionHandler(menuItemId, options);\n }\n };\n\n const localOpenChange = (isOpen: boolean) => {\n onOpenChange?.(isOpen);\n handleOpenChange(isOpen);\n };\n\n if (menuItemDescriptors.length) {\n ctx?.showContextMenu(\n <ContextMenu\n menuHandler={menuHandler}\n menuItemDescriptors={menuItemDescriptors}\n onOpenChange={localOpenChange}\n open={true}\n x={x}\n y={y}\n />,\n );\n return true;\n }\n } else {\n console.warn(\n \"useContextMenu, no menuBuilders configured. These should be supplied via the ContextMenuProvider(s)\",\n );\n }\n return false;\n },\n [buildMenuOptions, ctx, handleOpenChange, menuActionHandler, menuBuilder],\n );\n\n return showContextMenu;\n};\n"],"names":["menuBuilder","options"],"mappings":"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"}
|