@lobehub/ui 1.10.0 → 1.11.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/es/ActionIcon/style.js +1 -1
- package/es/Highlighter/style.js +1 -2
- package/es/Input/index.js +7 -5
- package/es/Input/style.js +2 -3
- package/es/Markdown/style.js +1 -1
- package/es/SearchBar/index.js +2 -1
- package/es/Snippet/style.js +1 -2
- package/es/StroyBook/style.js +1 -1
- package/es/ThemeProvider/index.d.ts +2 -6
- package/es/ThemeProvider/index.js +8 -18
- package/es/styles/algorithms/generateColorPalette.d.ts +11 -0
- package/es/styles/algorithms/generateColorPalette.js +31 -0
- package/es/styles/{customStylish.d.ts → algorithms/generateCustomStylish.d.ts} +1 -1
- package/es/styles/{customStylish.js → algorithms/generateCustomStylish.js} +1 -1
- package/es/styles/algorithms/generateCustomToken.d.ts +3 -0
- package/es/styles/algorithms/generateCustomToken.js +57 -0
- package/es/styles/algorithms/generateTheme.d.ts +5 -0
- package/es/styles/algorithms/generateTheme.js +18 -0
- package/es/styles/colors.d.ts +38 -0
- package/es/styles/colors.js +176 -0
- package/es/styles/index.d.ts +3 -3
- package/es/styles/index.js +3 -3
- package/es/styles/theme/base.d.ts +2 -2
- package/es/styles/theme/base.js +8 -14
- package/es/styles/theme/dark.d.ts +3 -4
- package/es/styles/theme/dark.js +40 -71
- package/es/styles/theme/light.d.ts +3 -4
- package/es/styles/theme/light.js +41 -32
- package/es/types/customToken.d.ts +1027 -0
- package/es/types/global.d.ts +12 -0
- package/es/types/index.d.ts +5 -28
- package/es/types/index.js +1 -0
- package/lib/ActionIcon/index.js +77 -79
- package/lib/ActionIcon/style.js +17 -61
- package/lib/Avatar/index.js +62 -67
- package/lib/Chat/const.js +6 -27
- package/lib/Chat/index.js +24 -28
- package/lib/Chat/store/index.js +46 -40
- package/lib/Chat/store/initialState.js +6 -27
- package/lib/Chat/store/messageReducer.js +51 -58
- package/lib/Chat/store/selectors.js +44 -46
- package/lib/Chat/store/store.js +242 -115
- package/lib/Chat/types.js +4 -16
- package/lib/Chat/utils/fetch.js +104 -68
- package/lib/ContextMenu/MenuItem/icons.js +48 -66
- package/lib/ContextMenu/MenuItem/index.js +73 -66
- package/lib/ContextMenu/MenuItem/style.js +19 -89
- package/lib/ContextMenu/index.js +194 -178
- package/lib/ContextMenu/style.js +17 -85
- package/lib/ContextMenu/types/index.js +15 -18
- package/lib/ContextMenu/types/menuItem.js +4 -16
- package/lib/Conversation/App.js +47 -50
- package/lib/Conversation/ChatList/MessageItem/Content.js +98 -93
- package/lib/Conversation/ChatList/MessageItem/Toolbar.js +94 -104
- package/lib/Conversation/ChatList/MessageItem/index.js +125 -157
- package/lib/Conversation/ChatList/index.js +64 -58
- package/lib/Conversation/InputArea/ActionBar.js +74 -92
- package/lib/Conversation/InputArea/index.js +103 -142
- package/lib/Conversation/StoreUpdater.js +28 -48
- package/lib/Conversation/index.js +30 -42
- package/lib/CopyButton/index.js +37 -62
- package/lib/DraggablePanel/index.js +192 -207
- package/lib/DraggablePanel/style.js +30 -278
- package/lib/DraggablePanel/utils.js +14 -35
- package/lib/EditableMessage/index.js +66 -89
- package/lib/EditableMessageList/index.js +97 -112
- package/lib/EditableText/index.js +36 -49
- package/lib/Highlighter/SyntaxHighlighter/Prism.js +43 -38
- package/lib/Highlighter/SyntaxHighlighter/index.js +62 -53
- package/lib/Highlighter/SyntaxHighlighter/style.js +18 -56
- package/lib/Highlighter/index.js +52 -58
- package/lib/Highlighter/style.js +22 -102
- package/lib/Icon/index.js +29 -36
- package/lib/Input/index.js +45 -39
- package/lib/Input/style.js +17 -68
- package/lib/List/ListItem/index.js +108 -150
- package/lib/List/ListItem/time.js +15 -47
- package/lib/List/index.js +9 -37
- package/lib/Logo/Divider.js +21 -34
- package/lib/Logo/Logo3D.js +17 -33
- package/lib/Logo/LogoFlat.js +108 -118
- package/lib/Logo/LogoHighContrast.js +30 -33
- package/lib/Logo/LogoText.js +21 -34
- package/lib/Logo/index.js +97 -59
- package/lib/Logo/style.js +13 -36
- package/lib/Markdown/Code.js +16 -30
- package/lib/Markdown/CodeBlock.js +33 -65
- package/lib/Markdown/index.js +35 -54
- package/lib/Markdown/style.js +15 -125
- package/lib/MessageInput/index.js +60 -56
- package/lib/MessageModal/index.js +80 -91
- package/lib/SearchBar/index.js +86 -72
- package/lib/SearchBar/style.js +18 -46
- package/lib/SideNav/index.js +43 -31
- package/lib/SideNav/style.js +13 -43
- package/lib/Snippet/index.js +42 -45
- package/lib/Snippet/style.js +13 -72
- package/lib/StroyBook/index.js +60 -61
- package/lib/StroyBook/style.js +19 -87
- package/lib/Swatches/index.js +35 -53
- package/lib/TabsNav/index.js +23 -31
- package/lib/TabsNav/style.js +17 -60
- package/lib/ThemeProvider/GlobalStyle.js +29 -92
- package/lib/ThemeProvider/index.d.ts +2 -6
- package/lib/ThemeProvider/index.js +44 -69
- package/lib/ThemeSwitch/index.js +62 -46
- package/lib/Tooltip/index.js +26 -31
- package/lib/Tooltip/style.js +13 -49
- package/lib/components/ControlInput.js +86 -87
- package/lib/hooks/useCopied.js +27 -37
- package/lib/hooks/useHighlight.js +65 -70
- package/lib/index.js +211 -120
- package/lib/styles/algorithms/generateColorPalette.d.ts +11 -0
- package/lib/styles/algorithms/generateColorPalette.js +40 -0
- package/lib/styles/{customStylish.d.ts → algorithms/generateCustomStylish.d.ts} +1 -1
- package/lib/styles/algorithms/generateCustomStylish.js +27 -0
- package/lib/styles/algorithms/generateCustomToken.d.ts +3 -0
- package/lib/styles/algorithms/generateCustomToken.js +65 -0
- package/lib/styles/algorithms/generateTheme.d.ts +5 -0
- package/lib/styles/algorithms/generateTheme.js +28 -0
- package/lib/styles/colors.d.ts +38 -0
- package/lib/styles/colors.js +183 -0
- package/lib/styles/index.d.ts +3 -3
- package/lib/styles/index.js +25 -20
- package/lib/styles/theme/base.d.ts +2 -2
- package/lib/styles/theme/base.js +17 -44
- package/lib/styles/theme/dark.d.ts +3 -4
- package/lib/styles/theme/dark.js +45 -119
- package/lib/styles/theme/light.d.ts +3 -4
- package/lib/styles/theme/light.js +47 -61
- package/lib/types/customToken.d.ts +1027 -0
- package/lib/types/global.d.ts +12 -0
- package/lib/types/index.d.ts +5 -28
- package/lib/types/index.js +5 -0
- package/lib/utils/colorUtils.js +14 -48
- package/package.json +1 -1
- package/es/styles/algorithms/colorRelationship.d.ts +0 -6
- package/es/styles/algorithms/colorRelationship.js +0 -88
- package/es/styles/algorithms/index.d.ts +0 -15
- package/es/styles/algorithms/index.js +0 -66
- package/es/styles/algorithms/paletteGenerator.d.ts +0 -51
- package/es/styles/algorithms/paletteGenerator.js +0 -74
- package/es/styles/antdTheme.d.ts +0 -2
- package/es/styles/antdTheme.js +0 -4
- package/es/styles/customToken.d.ts +0 -65
- package/es/styles/customToken.js +0 -24
- package/es/styles/theme/index.d.ts +0 -2
- package/es/styles/theme/index.js +0 -2
- package/lib/styles/algorithms/colorRelationship.d.ts +0 -6
- package/lib/styles/algorithms/colorRelationship.js +0 -87
- package/lib/styles/algorithms/index.d.ts +0 -15
- package/lib/styles/algorithms/index.js +0 -81
- package/lib/styles/algorithms/paletteGenerator.d.ts +0 -51
- package/lib/styles/algorithms/paletteGenerator.js +0 -91
- package/lib/styles/antdTheme.d.ts +0 -2
- package/lib/styles/antdTheme.js +0 -30
- package/lib/styles/customStylish.js +0 -118
- package/lib/styles/customToken.d.ts +0 -65
- package/lib/styles/customToken.js +0 -54
- package/lib/styles/theme/index.d.ts +0 -2
- package/lib/styles/theme/index.js +0 -32
package/lib/ContextMenu/index.js
CHANGED
|
@@ -1,103 +1,102 @@
|
|
|
1
|
-
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __export = (target, all) => {
|
|
8
|
-
for (var name in all)
|
|
9
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
-
};
|
|
11
|
-
var __copyProps = (to, from, except, desc) => {
|
|
12
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
-
for (let key of __getOwnPropNames(from))
|
|
14
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
-
}
|
|
17
|
-
return to;
|
|
18
|
-
};
|
|
19
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
-
mod
|
|
26
|
-
));
|
|
27
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
1
|
+
"use strict";
|
|
28
2
|
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
default: () => ContextMenu_default
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
33
6
|
});
|
|
34
|
-
|
|
35
|
-
var
|
|
36
|
-
var
|
|
37
|
-
var
|
|
38
|
-
var
|
|
39
|
-
var
|
|
40
|
-
var
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
7
|
+
exports.default = void 0;
|
|
8
|
+
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
9
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
11
|
+
var _react = require("@floating-ui/react");
|
|
12
|
+
var _react2 = require("react");
|
|
13
|
+
var _antd = require("antd");
|
|
14
|
+
var _MenuItem = _interopRequireDefault(require("./MenuItem"));
|
|
15
|
+
var _style = require("./style");
|
|
16
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
|
+
var _excluded = ["items", "label", "container"];
|
|
18
|
+
var MenuComponent = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, forwardedRef) {
|
|
19
|
+
var items = _ref.items,
|
|
20
|
+
label = _ref.label,
|
|
21
|
+
container = _ref.container,
|
|
22
|
+
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
23
|
+
var _useStyles = (0, _style.useStyles)(),
|
|
24
|
+
styles = _useStyles.styles;
|
|
25
|
+
var _useState = (0, _react2.useState)(false),
|
|
26
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
27
|
+
isOpen = _useState2[0],
|
|
28
|
+
setIsOpen = _useState2[1];
|
|
29
|
+
var _useState3 = (0, _react2.useState)(null),
|
|
30
|
+
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
31
|
+
activeIndex = _useState4[0],
|
|
32
|
+
setActiveIndex = _useState4[1];
|
|
33
|
+
var _useState5 = (0, _react2.useState)(false),
|
|
34
|
+
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
|
|
35
|
+
allowHover = _useState6[0],
|
|
36
|
+
setAllowHover = _useState6[1];
|
|
37
|
+
var listItemsRef = (0, _react2.useRef)([]);
|
|
38
|
+
var listContentRef = (0, _react2.useRef)(items.map(function (item) {
|
|
39
|
+
return item.label;
|
|
40
|
+
}));
|
|
41
|
+
var allowMouseUpCloseRef = (0, _react2.useRef)(false);
|
|
42
|
+
var tree = (0, _react.useFloatingTree)();
|
|
43
|
+
var nodeId = (0, _react.useFloatingNodeId)();
|
|
44
|
+
var parentId = (0, _react.useFloatingParentNodeId)();
|
|
45
|
+
var isNested = parentId !== null;
|
|
46
|
+
var _useFloating = (0, _react.useFloating)({
|
|
47
|
+
nodeId: nodeId,
|
|
48
|
+
open: isOpen,
|
|
49
|
+
onOpenChange: setIsOpen,
|
|
50
|
+
placement: isNested ? 'right-start' : 'bottom-start',
|
|
51
|
+
middleware: [(0, _react.offset)({
|
|
52
|
+
mainAxis: isNested ? 0 : 4,
|
|
53
|
+
alignmentAxis: isNested ? -4 : 0
|
|
54
|
+
}), (0, _react.flip)(), (0, _react.shift)()],
|
|
55
|
+
whileElementsMounted: _react.autoUpdate
|
|
56
|
+
}),
|
|
57
|
+
refs = _useFloating.refs,
|
|
58
|
+
floatingStyles = _useFloating.floatingStyles,
|
|
59
|
+
context = _useFloating.context;
|
|
60
|
+
var hover = (0, _react.useHover)(context, {
|
|
65
61
|
enabled: isNested && allowHover,
|
|
66
|
-
delay: {
|
|
67
|
-
|
|
62
|
+
delay: {
|
|
63
|
+
open: 75
|
|
64
|
+
},
|
|
65
|
+
handleClose: (0, _react.safePolygon)({
|
|
68
66
|
blockPointerEvents: true
|
|
69
67
|
})
|
|
70
68
|
});
|
|
71
|
-
|
|
72
|
-
event:
|
|
69
|
+
var click = (0, _react.useClick)(context, {
|
|
70
|
+
event: 'mousedown',
|
|
73
71
|
toggle: !isNested || !allowHover,
|
|
74
72
|
ignoreMouse: isNested
|
|
75
73
|
});
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
74
|
+
var role = (0, _react.useRole)(context, {
|
|
75
|
+
role: 'menu'
|
|
76
|
+
});
|
|
77
|
+
var dismiss = (0, _react.useDismiss)(context);
|
|
78
|
+
var listNavigation = (0, _react.useListNavigation)(context, {
|
|
79
79
|
listRef: listItemsRef,
|
|
80
|
-
activeIndex,
|
|
80
|
+
activeIndex: activeIndex,
|
|
81
81
|
nested: isNested,
|
|
82
82
|
onNavigate: setActiveIndex
|
|
83
83
|
});
|
|
84
|
-
|
|
84
|
+
var typeahead = (0, _react.useTypeahead)(context, {
|
|
85
85
|
enabled: isOpen,
|
|
86
86
|
listRef: listContentRef,
|
|
87
|
-
onMatch: isOpen ? setActiveIndex :
|
|
88
|
-
activeIndex
|
|
87
|
+
onMatch: isOpen ? setActiveIndex : undefined,
|
|
88
|
+
activeIndex: activeIndex
|
|
89
89
|
});
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
(0,
|
|
99
|
-
if (!tree)
|
|
100
|
-
return;
|
|
90
|
+
var _useInteractions = (0, _react.useInteractions)([hover, click, role, dismiss, listNavigation, typeahead]),
|
|
91
|
+
getReferenceProps = _useInteractions.getReferenceProps,
|
|
92
|
+
getFloatingProps = _useInteractions.getFloatingProps,
|
|
93
|
+
getItemProps = _useInteractions.getItemProps;
|
|
94
|
+
|
|
95
|
+
// Event emitter allows you to communicate across tree components.
|
|
96
|
+
// This effect closes all menus when an item gets clicked anywhere
|
|
97
|
+
// in the tree.
|
|
98
|
+
(0, _react2.useEffect)(function () {
|
|
99
|
+
if (!tree) return;
|
|
101
100
|
function handleTreeClick() {
|
|
102
101
|
setIsOpen(false);
|
|
103
102
|
}
|
|
@@ -106,45 +105,53 @@ var MenuComponent = (0, import_react2.forwardRef)(({ items, label, container, ..
|
|
|
106
105
|
setIsOpen(false);
|
|
107
106
|
}
|
|
108
107
|
}
|
|
109
|
-
tree.events.on(
|
|
110
|
-
tree.events.on(
|
|
111
|
-
return ()
|
|
112
|
-
tree.events.off(
|
|
113
|
-
tree.events.off(
|
|
108
|
+
tree.events.on('click', handleTreeClick);
|
|
109
|
+
tree.events.on('menuopen', onSubMenuOpen);
|
|
110
|
+
return function () {
|
|
111
|
+
tree.events.off('click', handleTreeClick);
|
|
112
|
+
tree.events.off('menuopen', onSubMenuOpen);
|
|
114
113
|
};
|
|
115
114
|
}, [tree, nodeId, parentId]);
|
|
116
|
-
(0,
|
|
115
|
+
(0, _react2.useEffect)(function () {
|
|
117
116
|
if (isOpen && tree) {
|
|
118
|
-
tree.events.emit(
|
|
117
|
+
tree.events.emit('menuopen', {
|
|
118
|
+
parentId: parentId,
|
|
119
|
+
nodeId: nodeId
|
|
120
|
+
});
|
|
119
121
|
}
|
|
120
122
|
}, [tree, isOpen, nodeId, parentId]);
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
123
|
+
|
|
124
|
+
// Determine if "hover" logic can run based on the modality of input. This
|
|
125
|
+
// prevents unwanted focus synchronization as menus open and close with
|
|
126
|
+
// keyboard navigation and the cursor is resting on the menu.
|
|
127
|
+
(0, _react2.useEffect)(function () {
|
|
128
|
+
function onPointerMove(_ref2) {
|
|
129
|
+
var pointerType = _ref2.pointerType;
|
|
130
|
+
if (pointerType !== 'touch') {
|
|
124
131
|
setAllowHover(true);
|
|
125
132
|
}
|
|
126
133
|
}
|
|
127
134
|
function onKeyDown() {
|
|
128
135
|
setAllowHover(false);
|
|
129
136
|
}
|
|
130
|
-
window.addEventListener(
|
|
137
|
+
window.addEventListener('pointermove', onPointerMove, {
|
|
131
138
|
once: true,
|
|
132
139
|
capture: true
|
|
133
140
|
});
|
|
134
|
-
window.addEventListener(
|
|
135
|
-
return ()
|
|
136
|
-
window.removeEventListener(
|
|
141
|
+
window.addEventListener('keydown', onKeyDown, true);
|
|
142
|
+
return function () {
|
|
143
|
+
window.removeEventListener('pointermove', onPointerMove, {
|
|
137
144
|
capture: true
|
|
138
145
|
});
|
|
139
|
-
window.removeEventListener(
|
|
146
|
+
window.removeEventListener('keydown', onKeyDown, true);
|
|
140
147
|
};
|
|
141
148
|
}, [allowHover]);
|
|
142
|
-
(0,
|
|
143
|
-
|
|
149
|
+
(0, _react2.useEffect)(function () {
|
|
150
|
+
var timeout;
|
|
144
151
|
function onContextMenu(e) {
|
|
145
152
|
e.preventDefault();
|
|
146
153
|
refs.setPositionReference({
|
|
147
|
-
getBoundingClientRect() {
|
|
154
|
+
getBoundingClientRect: function getBoundingClientRect() {
|
|
148
155
|
return {
|
|
149
156
|
width: 0,
|
|
150
157
|
height: 0,
|
|
@@ -160,7 +167,7 @@ var MenuComponent = (0, import_react2.forwardRef)(({ items, label, container, ..
|
|
|
160
167
|
setIsOpen(true);
|
|
161
168
|
clearTimeout(timeout);
|
|
162
169
|
allowMouseUpCloseRef.current = false;
|
|
163
|
-
timeout = window.setTimeout(()
|
|
170
|
+
timeout = window.setTimeout(function () {
|
|
164
171
|
allowMouseUpCloseRef.current = true;
|
|
165
172
|
}, 300);
|
|
166
173
|
}
|
|
@@ -169,86 +176,95 @@ var MenuComponent = (0, import_react2.forwardRef)(({ items, label, container, ..
|
|
|
169
176
|
setIsOpen(false);
|
|
170
177
|
}
|
|
171
178
|
}
|
|
172
|
-
document.addEventListener(
|
|
173
|
-
document.addEventListener(
|
|
174
|
-
return ()
|
|
175
|
-
document.removeEventListener(
|
|
176
|
-
document.removeEventListener(
|
|
179
|
+
document.addEventListener('contextmenu', onContextMenu);
|
|
180
|
+
document.addEventListener('mouseup', onMouseUp);
|
|
181
|
+
return function () {
|
|
182
|
+
document.removeEventListener('contextmenu', onContextMenu);
|
|
183
|
+
document.removeEventListener('mouseup', onMouseUp);
|
|
177
184
|
clearTimeout(timeout);
|
|
178
185
|
};
|
|
179
186
|
}, [refs, container]);
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
key: data.key,
|
|
188
|
-
icon: data.icon,
|
|
189
|
-
shortcut: data.shortcut,
|
|
190
|
-
active: activeIndex === index,
|
|
191
|
-
...getItemProps({
|
|
192
|
-
ref(node) {
|
|
193
|
-
listItemsRef.current[index] = node;
|
|
194
|
-
},
|
|
195
|
-
onClick() {
|
|
196
|
-
var _a;
|
|
197
|
-
(_a = data.onClick) == null ? void 0 : _a.call(data);
|
|
198
|
-
setIsOpen(false);
|
|
199
|
-
},
|
|
200
|
-
onMouseUp() {
|
|
201
|
-
var _a;
|
|
202
|
-
(_a = data.onClick) == null ? void 0 : _a.call(data);
|
|
203
|
-
setIsOpen(false);
|
|
204
|
-
}
|
|
205
|
-
})
|
|
206
|
-
};
|
|
207
|
-
if ("children" in item) {
|
|
208
|
-
return /* @__PURE__ */ React.createElement(MenuComponent, { ...props2, items: item.children });
|
|
187
|
+
var renderMenuItem = (0, _react2.useCallback)(function (item, index) {
|
|
188
|
+
// 支持渲染分割线
|
|
189
|
+
if ('type' in item && item.type === 'divider') return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Divider, {
|
|
190
|
+
style: {
|
|
191
|
+
margin: '4px 12px',
|
|
192
|
+
minWidth: 'auto',
|
|
193
|
+
width: 'auto'
|
|
209
194
|
}
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
195
|
+
});
|
|
196
|
+
var data = item;
|
|
197
|
+
var props = (0, _objectSpread2.default)({
|
|
198
|
+
label: data.label,
|
|
199
|
+
key: data.key,
|
|
200
|
+
icon: data.icon,
|
|
201
|
+
shortcut: data.shortcut,
|
|
202
|
+
active: activeIndex === index
|
|
203
|
+
}, getItemProps({
|
|
204
|
+
ref: function ref(node) {
|
|
205
|
+
listItemsRef.current[index] = node;
|
|
206
|
+
},
|
|
207
|
+
onClick: function onClick() {
|
|
208
|
+
var _data$onClick;
|
|
209
|
+
(_data$onClick = data.onClick) === null || _data$onClick === void 0 ? void 0 : _data$onClick.call(data);
|
|
210
|
+
setIsOpen(false);
|
|
211
|
+
},
|
|
212
|
+
onMouseUp: function onMouseUp() {
|
|
213
|
+
var _data$onClick2;
|
|
214
|
+
(_data$onClick2 = data.onClick) === null || _data$onClick2 === void 0 ? void 0 : _data$onClick2.call(data);
|
|
215
|
+
setIsOpen(false);
|
|
216
|
+
}
|
|
217
|
+
}));
|
|
218
|
+
if ('children' in item) {
|
|
219
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuComponent, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
|
|
220
|
+
items: item.children
|
|
221
|
+
}));
|
|
222
|
+
}
|
|
223
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.default, (0, _objectSpread2.default)({}, props));
|
|
224
|
+
}, [activeIndex]);
|
|
225
|
+
var referenceRef = (0, _react.useMergeRefs)([refs.setReference, forwardedRef]);
|
|
226
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.FloatingNode, {
|
|
227
|
+
id: nodeId,
|
|
228
|
+
children: [!label ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({
|
|
218
229
|
ref: referenceRef,
|
|
219
230
|
nested: isNested,
|
|
220
|
-
label
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
231
|
+
label: label
|
|
232
|
+
// Indicates this is a nested <Menu /> acting as a <MenuItem />.
|
|
233
|
+
,
|
|
234
|
+
role: isNested ? 'menuitem' : 'menu'
|
|
235
|
+
}, props), getReferenceProps({
|
|
236
|
+
onClick: function onClick(event) {
|
|
237
|
+
event.stopPropagation();
|
|
238
|
+
}
|
|
239
|
+
}))), /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.FloatingPortal, {
|
|
240
|
+
children: isOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.FloatingFocusManager, {
|
|
241
|
+
context: context
|
|
242
|
+
// Prevent outside content interference.
|
|
243
|
+
,
|
|
244
|
+
modal: false
|
|
245
|
+
// Only initially focus the root floating menu.
|
|
246
|
+
,
|
|
247
|
+
initialFocus: isNested ? -1 : 0
|
|
248
|
+
// Only return focus to the root menu's reference when menus close.
|
|
249
|
+
,
|
|
250
|
+
returnFocus: !isNested,
|
|
251
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({
|
|
252
|
+
ref: refs.setFloating,
|
|
253
|
+
className: styles.container,
|
|
254
|
+
style: floatingStyles
|
|
255
|
+
}, getFloatingProps()), {}, {
|
|
256
|
+
children: items === null || items === void 0 ? void 0 : items.map(renderMenuItem)
|
|
257
|
+
}))
|
|
227
258
|
})
|
|
228
|
-
}
|
|
229
|
-
)
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
/* @__PURE__ */ React.createElement(
|
|
238
|
-
"div",
|
|
239
|
-
{
|
|
240
|
-
ref: refs.setFloating,
|
|
241
|
-
className: styles.container,
|
|
242
|
-
style: floatingStyles,
|
|
243
|
-
...getFloatingProps()
|
|
244
|
-
},
|
|
245
|
-
items == null ? void 0 : items.map(renderMenuItem)
|
|
246
|
-
)
|
|
247
|
-
)));
|
|
259
|
+
})]
|
|
260
|
+
});
|
|
261
|
+
});
|
|
262
|
+
var ContextMenu = /*#__PURE__*/(0, _react2.forwardRef)(function (props, ref) {
|
|
263
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.FloatingTree, {
|
|
264
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuComponent, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
|
|
265
|
+
ref: ref
|
|
266
|
+
}))
|
|
267
|
+
});
|
|
248
268
|
});
|
|
249
|
-
var
|
|
250
|
-
|
|
251
|
-
);
|
|
252
|
-
var ContextMenu_default = ContextMenu;
|
|
253
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
254
|
-
0 && (module.exports = {});
|
|
269
|
+
var _default = ContextMenu;
|
|
270
|
+
exports.default = _default;
|
package/lib/ContextMenu/style.js
CHANGED
|
@@ -1,88 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __export = (target, all) => {
|
|
6
|
-
for (var name in all)
|
|
7
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
-
};
|
|
9
|
-
var __copyProps = (to, from, except, desc) => {
|
|
10
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
-
for (let key of __getOwnPropNames(from))
|
|
12
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
-
}
|
|
15
|
-
return to;
|
|
16
|
-
};
|
|
17
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
1
|
+
"use strict";
|
|
18
2
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
useStyles: () => useStyles
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
23
6
|
});
|
|
24
|
-
|
|
25
|
-
var
|
|
26
|
-
var
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
overflow-y: auto
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
box-sizing: border-box;
|
|
37
|
-
width: 200px;
|
|
38
|
-
padding: 5px;
|
|
39
|
-
|
|
40
|
-
font-size: ${token.fontSize};
|
|
41
|
-
|
|
42
|
-
background: ${token.colorBgContainer};
|
|
43
|
-
border: 1px solid ${token.colorBorder};
|
|
44
|
-
border-radius: 8px;
|
|
45
|
-
outline: 0;
|
|
46
|
-
box-shadow: ${token.boxShadowSecondary};
|
|
47
|
-
|
|
48
|
-
&::-webkit-scrollbar {
|
|
49
|
-
display: none;
|
|
50
|
-
}
|
|
51
|
-
`
|
|
52
|
-
),
|
|
53
|
-
button: cx(
|
|
54
|
-
`${prefixCls}-button`,
|
|
55
|
-
css`
|
|
56
|
-
all: unset;
|
|
57
|
-
|
|
58
|
-
cursor: default;
|
|
59
|
-
user-select: none;
|
|
60
|
-
|
|
61
|
-
padding: 12px 10px;
|
|
62
|
-
|
|
63
|
-
font-size: ${token.fontSize}px;
|
|
64
|
-
line-height: 1;
|
|
65
|
-
color: ${token.colorText};
|
|
66
|
-
|
|
67
|
-
background: ${token.colorBgContainer};
|
|
68
|
-
border: 1px solid ${token.colorBorder};
|
|
69
|
-
border-radius: ${token.borderRadius}px;
|
|
70
|
-
|
|
71
|
-
-webkit-tap-highlight-color: transparent;
|
|
72
|
-
|
|
73
|
-
&:hover {
|
|
74
|
-
background: ${token.colorPrimaryBg};
|
|
75
|
-
border-color: transparent;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
&:focus-visible {
|
|
79
|
-
border-color: ${token.colorPrimary};
|
|
80
|
-
box-shadow: 0 0 0 2px ${token.colorPrimaryBg};
|
|
81
|
-
}
|
|
82
|
-
`
|
|
83
|
-
)
|
|
84
|
-
}));
|
|
85
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
86
|
-
0 && (module.exports = {
|
|
87
|
-
useStyles
|
|
7
|
+
exports.useStyles = void 0;
|
|
8
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
9
|
+
var _antdStyle = require("antd-style");
|
|
10
|
+
var _templateObject, _templateObject2;
|
|
11
|
+
var useStyles = (0, _antdStyle.createStyles)(function (_ref, prefixCls) {
|
|
12
|
+
var css = _ref.css,
|
|
13
|
+
cx = _ref.cx,
|
|
14
|
+
token = _ref.token;
|
|
15
|
+
return {
|
|
16
|
+
container: cx(prefixCls, css(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n user-select: none;\n scrollbar-width: none;\n\n overflow-y: auto;\n overscroll-behavior: contain;\n\n box-sizing: border-box;\n width: 200px;\n padding: 5px;\n\n font-size: ", ";\n\n background: ", ";\n border: 1px solid ", ";\n border-radius: 8px;\n outline: 0;\n box-shadow: ", ";\n\n &::-webkit-scrollbar {\n display: none;\n }\n "])), token.fontSize, token.colorBgContainer, token.colorBorder, token.boxShadowSecondary)),
|
|
17
|
+
button: cx("".concat(prefixCls, "-button"), css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n all: unset;\n\n cursor: default;\n user-select: none;\n\n padding: 12px 10px;\n\n font-size: ", "px;\n line-height: 1;\n color: ", ";\n\n background: ", ";\n border: 1px solid ", ";\n border-radius: ", "px;\n\n -webkit-tap-highlight-color: transparent;\n\n &:hover {\n background: ", ";\n border-color: transparent;\n }\n\n &:focus-visible {\n border-color: ", ";\n box-shadow: 0 0 0 2px ", ";\n }\n "])), token.fontSize, token.colorText, token.colorBgContainer, token.colorBorder, token.borderRadius, token.colorPrimaryBg, token.colorPrimary, token.colorPrimaryBg))
|
|
18
|
+
};
|
|
88
19
|
});
|
|
20
|
+
exports.useStyles = useStyles;
|
|
@@ -1,19 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __copyProps = (to, from, except, desc) => {
|
|
6
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
7
|
-
for (let key of __getOwnPropNames(from))
|
|
8
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
9
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
10
|
-
}
|
|
11
|
-
return to;
|
|
12
|
-
};
|
|
13
|
-
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
14
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
1
|
+
"use strict";
|
|
15
2
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
var _menuItem = require("./menuItem");
|
|
7
|
+
Object.keys(_menuItem).forEach(function (key) {
|
|
8
|
+
if (key === "default" || key === "__esModule") return;
|
|
9
|
+
if (key in exports && exports[key] === _menuItem[key]) return;
|
|
10
|
+
Object.defineProperty(exports, key, {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function get() {
|
|
13
|
+
return _menuItem[key];
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
});
|
|
@@ -1,17 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __copyProps = (to, from, except, desc) => {
|
|
6
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
7
|
-
for (let key of __getOwnPropNames(from))
|
|
8
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
9
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
10
|
-
}
|
|
11
|
-
return to;
|
|
12
|
-
};
|
|
13
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
1
|
+
"use strict";
|
|
14
2
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|