zs_library 0.1.1 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Desktop/ContextMenu/index.d.ts +3 -0
- package/dist/Desktop/ContextMenu/index.js +182 -0
- package/dist/Desktop/Items/GroupItem.d.ts +8 -0
- package/dist/Desktop/Items/GroupItem.js +176 -0
- package/dist/Desktop/Items/Modal/GroupItemModal.d.ts +10 -0
- package/dist/Desktop/Items/Modal/GroupItemModal.js +159 -0
- package/dist/Desktop/Items/Modal/InfoModal.d.ts +12 -0
- package/dist/Desktop/Items/Modal/InfoModal.js +34 -0
- package/dist/Desktop/Items/SortableItem.d.ts +18 -0
- package/dist/Desktop/Items/SortableItem.js +73 -0
- package/dist/Desktop/Sortable.d.ts +50 -0
- package/dist/Desktop/Sortable.js +164 -0
- package/dist/Desktop/config.d.ts +6 -0
- package/dist/Desktop/config.js +16 -0
- package/dist/Desktop/context.d.ts +49 -0
- package/dist/Desktop/context.js +338 -0
- package/dist/Desktop/hook.d.ts +1 -0
- package/dist/Desktop/hook.js +6 -0
- package/dist/Desktop/index.d.ts +29 -0
- package/dist/Desktop/index.js +22 -0
- package/dist/Desktop/style.d.ts +1 -0
- package/dist/Desktop/style.js +4 -0
- package/dist/Desktop/theme.d.ts +16 -0
- package/dist/Desktop/theme.js +28 -0
- package/dist/Desktop/types.d.ts +36 -0
- package/dist/Desktop/types.js +1 -0
- package/dist/Desktop/utils.d.ts +33 -0
- package/dist/Desktop/utils.js +37 -0
- package/dist/Editor/index.d.ts +1 -0
- package/dist/Editor/index.js +35 -36
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/package.json +14 -2
|
@@ -0,0 +1,338 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
3
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
5
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
6
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
7
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
8
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
9
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
10
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
11
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
12
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
13
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
14
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
15
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
16
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
17
|
+
import { useDebounceEffect, useLocalStorageState } from 'ahooks';
|
|
18
|
+
import React, { createContext, useEffect, useMemo, useRef, useState } from 'react';
|
|
19
|
+
import { v4 as uuidv4 } from 'uuid';
|
|
20
|
+
import { themeDark, themeLight } from "./theme";
|
|
21
|
+
import SortableUtils from "./utils";
|
|
22
|
+
export var SortableContext = /*#__PURE__*/createContext({
|
|
23
|
+
list: [],
|
|
24
|
+
setList: function setList() {},
|
|
25
|
+
contextMenu: null,
|
|
26
|
+
setContextMenu: function setContextMenu() {},
|
|
27
|
+
listStatus: null,
|
|
28
|
+
setListStatus: function setListStatus() {},
|
|
29
|
+
contextMenuFuns: function contextMenuFuns() {},
|
|
30
|
+
hideContextMenu: function hideContextMenu() {},
|
|
31
|
+
showInfoItemData: null,
|
|
32
|
+
setShowInfoItemData: function setShowInfoItemData() {},
|
|
33
|
+
openGroupItemData: null,
|
|
34
|
+
setOpenGroupItemData: function setOpenGroupItemData() {},
|
|
35
|
+
longPressTriggered: false,
|
|
36
|
+
updateItem: function updateItem() {},
|
|
37
|
+
updateItemConfig: function updateItemConfig() {},
|
|
38
|
+
removeItem: function removeItem() {},
|
|
39
|
+
moveItemId: null,
|
|
40
|
+
setMoveItemId: function setMoveItemId() {},
|
|
41
|
+
moveTargetId: null,
|
|
42
|
+
setMoveTargetId: function setMoveTargetId() {},
|
|
43
|
+
theme: themeLight
|
|
44
|
+
});
|
|
45
|
+
export var SortableProvider = function SortableProvider(_ref) {
|
|
46
|
+
var children = _ref.children,
|
|
47
|
+
_ref$list = _ref.list,
|
|
48
|
+
propList = _ref$list === void 0 ? [] : _ref$list,
|
|
49
|
+
propOnChange = _ref.onChange,
|
|
50
|
+
_ref$storageKey = _ref.storageKey,
|
|
51
|
+
storageKey = _ref$storageKey === void 0 ? 'ZS_LIBRARY_DESKTOP_SORTABLE_CONFIG' : _ref$storageKey,
|
|
52
|
+
propTheme = _ref.theme,
|
|
53
|
+
_ref$enableCaching = _ref.enableCaching,
|
|
54
|
+
enableCaching = _ref$enableCaching === void 0 ? true : _ref$enableCaching;
|
|
55
|
+
var _useState = useState(),
|
|
56
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
57
|
+
contextMenuTimer = _useState2[0],
|
|
58
|
+
setContextMenuTimer = _useState2[1];
|
|
59
|
+
var _useState3 = useState(),
|
|
60
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
61
|
+
pressTimer = _useState4[0],
|
|
62
|
+
setPressTimer = _useState4[1];
|
|
63
|
+
var _useState5 = useState(null),
|
|
64
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
65
|
+
listStatus = _useState6[0],
|
|
66
|
+
setListStatus = _useState6[1];
|
|
67
|
+
var listStatusRef = useRef(listStatus);
|
|
68
|
+
var _useState7 = useState(null),
|
|
69
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
70
|
+
contextMenu = _useState8[0],
|
|
71
|
+
setContextMenu = _useState8[1];
|
|
72
|
+
var _useState9 = useState([]),
|
|
73
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
74
|
+
list = _useState10[0],
|
|
75
|
+
setList = _useState10[1];
|
|
76
|
+
var _useState11 = useState(null),
|
|
77
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
78
|
+
showInfoItemData = _useState12[0],
|
|
79
|
+
setShowInfoItemData = _useState12[1];
|
|
80
|
+
var _useState13 = useState(null),
|
|
81
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
|
82
|
+
openGroupItemData = _useState14[0],
|
|
83
|
+
setOpenGroupItemData = _useState14[1];
|
|
84
|
+
var _useState15 = useState(false),
|
|
85
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
86
|
+
longPressTriggered = _useState16[0],
|
|
87
|
+
setLongPressTriggered = _useState16[1];
|
|
88
|
+
var _useState17 = useState(null),
|
|
89
|
+
_useState18 = _slicedToArray(_useState17, 2),
|
|
90
|
+
moveItemId = _useState18[0],
|
|
91
|
+
setMoveItemId = _useState18[1];
|
|
92
|
+
var _useState19 = useState(null),
|
|
93
|
+
_useState20 = _slicedToArray(_useState19, 2),
|
|
94
|
+
moveTargetId = _useState20[0],
|
|
95
|
+
setMoveTargetId = _useState20[1];
|
|
96
|
+
var _useState21 = useState(false),
|
|
97
|
+
_useState22 = _slicedToArray(_useState21, 2),
|
|
98
|
+
init = _useState22[0],
|
|
99
|
+
setInit = _useState22[1];
|
|
100
|
+
var _useLocalStorageState = useLocalStorageState(storageKey, {
|
|
101
|
+
defaultValue: [],
|
|
102
|
+
listenStorageChange: true
|
|
103
|
+
}),
|
|
104
|
+
_useLocalStorageState2 = _slicedToArray(_useLocalStorageState, 2),
|
|
105
|
+
localList = _useLocalStorageState2[0],
|
|
106
|
+
setLocalList = _useLocalStorageState2[1];
|
|
107
|
+
var hideContextMenu = function hideContextMenu() {
|
|
108
|
+
setContextMenu(null);
|
|
109
|
+
clearTimeout(contextMenuTimer);
|
|
110
|
+
setContextMenuTimer(undefined);
|
|
111
|
+
listStatusRef.current = null;
|
|
112
|
+
};
|
|
113
|
+
var getItemRectAndSetContextMenu = function getItemRectAndSetContextMenu(e, data) {
|
|
114
|
+
setContextMenu(_objectSpread(_objectSpread({}, e), {}, {
|
|
115
|
+
pageX: e.pageX,
|
|
116
|
+
pageY: e.pageY,
|
|
117
|
+
data: data
|
|
118
|
+
}));
|
|
119
|
+
clearTimeout(contextMenuTimer);
|
|
120
|
+
};
|
|
121
|
+
var contextMenuFuns = function contextMenuFuns(data) {
|
|
122
|
+
var _data$config = data.config,
|
|
123
|
+
config = _data$config === void 0 ? {} : _data$config;
|
|
124
|
+
if (config.allowContextMenu === false) {
|
|
125
|
+
return {};
|
|
126
|
+
}
|
|
127
|
+
return {
|
|
128
|
+
onMouseDown: function onMouseDown(e) {
|
|
129
|
+
setContextMenuTimer(setTimeout(function () {
|
|
130
|
+
// 解决闭包导致拖拽时右键菜单不消失的问题
|
|
131
|
+
if (listStatusRef.current !== null) return;
|
|
132
|
+
getItemRectAndSetContextMenu(e, data);
|
|
133
|
+
}, 800));
|
|
134
|
+
setLongPressTriggered(false);
|
|
135
|
+
setPressTimer(setTimeout(function () {
|
|
136
|
+
setLongPressTriggered(true);
|
|
137
|
+
// 这里处理长按事件
|
|
138
|
+
}, 800));
|
|
139
|
+
},
|
|
140
|
+
onMouseUp: function onMouseUp() {
|
|
141
|
+
clearTimeout(pressTimer);
|
|
142
|
+
setPressTimer(undefined);
|
|
143
|
+
clearTimeout(contextMenuTimer);
|
|
144
|
+
setContextMenuTimer(undefined);
|
|
145
|
+
},
|
|
146
|
+
onContextMenu: function onContextMenu(e) {
|
|
147
|
+
e.preventDefault();
|
|
148
|
+
getItemRectAndSetContextMenu(e, data);
|
|
149
|
+
}
|
|
150
|
+
};
|
|
151
|
+
};
|
|
152
|
+
var _setList = function _setList(newList, parentIds) {
|
|
153
|
+
var _parentIds = _toConsumableArray(parentIds || []);
|
|
154
|
+
if (_parentIds.length > 0) {
|
|
155
|
+
setList(function (oldList) {
|
|
156
|
+
var _items = _toConsumableArray(oldList);
|
|
157
|
+
var updateChild = function updateChild(_list) {
|
|
158
|
+
var parentId = _parentIds.shift();
|
|
159
|
+
var parent = _list.find(function (item) {
|
|
160
|
+
return item.id === parentId;
|
|
161
|
+
});
|
|
162
|
+
var parentIndex = _list.findIndex(function (item) {
|
|
163
|
+
return item.id === parentId;
|
|
164
|
+
});
|
|
165
|
+
|
|
166
|
+
/** 当第一个 parentId 匹配到,但剩余 parentIds > 0 表明需要继续向下匹配 */
|
|
167
|
+
if (_parentIds.length && parent) {
|
|
168
|
+
var _parent$children;
|
|
169
|
+
/** 如果当前数据实际只有一个子数据,则取消 group 状态 */
|
|
170
|
+
if (((_parent$children = parent.children) === null || _parent$children === void 0 ? void 0 : _parent$children.filter(function (i) {
|
|
171
|
+
return !newList.some(function (k) {
|
|
172
|
+
return k.id === i.id;
|
|
173
|
+
});
|
|
174
|
+
}).length) === 1 && newList.length === 1) {
|
|
175
|
+
var current = _objectSpread({}, newList[0]);
|
|
176
|
+
_list.splice(parentIndex, 1, current);
|
|
177
|
+
propOnChange === null || propOnChange === void 0 || propOnChange(_list);
|
|
178
|
+
return _list;
|
|
179
|
+
}
|
|
180
|
+
parent.children = updateChild(parent.children || []);
|
|
181
|
+
_list.splice(parentIndex, 1, parent);
|
|
182
|
+
propOnChange === null || propOnChange === void 0 || propOnChange(_list);
|
|
183
|
+
return _list;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
/** 当 parentIds = 0 且匹配到,表明当前为实际需要更新的数据 */
|
|
187
|
+
if (parent) {
|
|
188
|
+
var _parent$children2;
|
|
189
|
+
/** 没有子数据,且有新增数据,则将当前数据更改为 group 类型 */
|
|
190
|
+
if (!((_parent$children2 = parent.children) !== null && _parent$children2 !== void 0 && _parent$children2.length) && newList.length) {
|
|
191
|
+
var _current = _objectSpread({}, parent);
|
|
192
|
+
parent.data = {
|
|
193
|
+
name: '文件夹'
|
|
194
|
+
};
|
|
195
|
+
parent.type = 'group';
|
|
196
|
+
parent.children = [_current].concat(_toConsumableArray(newList));
|
|
197
|
+
parent.id = uuidv4();
|
|
198
|
+
_list.splice(parentIndex, 1, parent);
|
|
199
|
+
propOnChange === null || propOnChange === void 0 || propOnChange(_list);
|
|
200
|
+
return _list;
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
// ! 当前已经是 group 时,直接将 children 更改为最新的 list
|
|
204
|
+
parent.children = SortableUtils.uniqueArray(newList);
|
|
205
|
+
_list.splice(parentIndex, 1, parent);
|
|
206
|
+
propOnChange === null || propOnChange === void 0 || propOnChange(_list);
|
|
207
|
+
return _list;
|
|
208
|
+
}
|
|
209
|
+
return SortableUtils.uniqueArray(newList);
|
|
210
|
+
};
|
|
211
|
+
return SortableUtils.uniqueArray(updateChild(_items));
|
|
212
|
+
});
|
|
213
|
+
} else {
|
|
214
|
+
var _newList = SortableUtils.uniqueArray(newList);
|
|
215
|
+
|
|
216
|
+
// ! 根节点直接排序
|
|
217
|
+
propOnChange === null || propOnChange === void 0 || propOnChange(_newList);
|
|
218
|
+
setList(_newList);
|
|
219
|
+
}
|
|
220
|
+
};
|
|
221
|
+
var updateItemConfig = function updateItemConfig(id, config) {
|
|
222
|
+
setList(function (prevList) {
|
|
223
|
+
var _list = _toConsumableArray(prevList);
|
|
224
|
+
var updateItem = function updateItem(list) {
|
|
225
|
+
for (var i = 0; i < list.length; i++) {
|
|
226
|
+
var _list$i$children;
|
|
227
|
+
if (list[i].id === id) {
|
|
228
|
+
list[i].config = config;
|
|
229
|
+
break;
|
|
230
|
+
} else if (((_list$i$children = list[i].children) === null || _list$i$children === void 0 ? void 0 : _list$i$children.length) !== undefined) {
|
|
231
|
+
updateItem(list[i].children);
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
};
|
|
235
|
+
updateItem(_list);
|
|
236
|
+
propOnChange === null || propOnChange === void 0 || propOnChange(_list);
|
|
237
|
+
return _list;
|
|
238
|
+
});
|
|
239
|
+
};
|
|
240
|
+
var updateItem = function updateItem(id, data) {
|
|
241
|
+
setList(function (prevList) {
|
|
242
|
+
var _list = _toConsumableArray(prevList);
|
|
243
|
+
var updateItem = function updateItem(list) {
|
|
244
|
+
for (var i = 0; i < list.length; i++) {
|
|
245
|
+
var _list$i$children2;
|
|
246
|
+
if (list[i].id === id) {
|
|
247
|
+
list[i].data = data;
|
|
248
|
+
break;
|
|
249
|
+
} else if (((_list$i$children2 = list[i].children) === null || _list$i$children2 === void 0 ? void 0 : _list$i$children2.length) !== undefined) {
|
|
250
|
+
updateItem(list[i].children);
|
|
251
|
+
}
|
|
252
|
+
}
|
|
253
|
+
};
|
|
254
|
+
updateItem(_list);
|
|
255
|
+
propOnChange === null || propOnChange === void 0 || propOnChange(_list);
|
|
256
|
+
return _list;
|
|
257
|
+
});
|
|
258
|
+
};
|
|
259
|
+
var removeItem = function removeItem(id) {
|
|
260
|
+
setList(function (prevList) {
|
|
261
|
+
var _list = _toConsumableArray(prevList);
|
|
262
|
+
var removeItem = function removeItem(list) {
|
|
263
|
+
for (var i = 0; i < list.length; i++) {
|
|
264
|
+
var _list$i$children3;
|
|
265
|
+
if (list[i].id === id) {
|
|
266
|
+
list.splice(i, 1);
|
|
267
|
+
break;
|
|
268
|
+
} else if (((_list$i$children3 = list[i].children) === null || _list$i$children3 === void 0 ? void 0 : _list$i$children3.length) !== undefined) {
|
|
269
|
+
removeItem(list[i].children);
|
|
270
|
+
}
|
|
271
|
+
}
|
|
272
|
+
};
|
|
273
|
+
removeItem(_list);
|
|
274
|
+
propOnChange === null || propOnChange === void 0 || propOnChange(_list);
|
|
275
|
+
return _list;
|
|
276
|
+
});
|
|
277
|
+
};
|
|
278
|
+
useEffect(function () {
|
|
279
|
+
if ((propList === null || propList === void 0 ? void 0 : propList.length) > 0 && list.length === 0) {
|
|
280
|
+
_setList(propList);
|
|
281
|
+
}
|
|
282
|
+
// eslint-disable-next-line
|
|
283
|
+
}, [propList]);
|
|
284
|
+
useEffect(function () {
|
|
285
|
+
listStatusRef.current = listStatus;
|
|
286
|
+
if (listStatus !== null) {
|
|
287
|
+
hideContextMenu();
|
|
288
|
+
}
|
|
289
|
+
// eslint-disable-next-line
|
|
290
|
+
}, [listStatus]);
|
|
291
|
+
useEffect(function () {
|
|
292
|
+
if (!enableCaching) return;
|
|
293
|
+
if (localList !== null && localList !== void 0 && localList.length && !init) {
|
|
294
|
+
_setList(localList);
|
|
295
|
+
setInit(true);
|
|
296
|
+
}
|
|
297
|
+
}, [localList, init, enableCaching]);
|
|
298
|
+
useDebounceEffect(function () {
|
|
299
|
+
if (!enableCaching) return;
|
|
300
|
+
setLocalList(list);
|
|
301
|
+
}, [list, enableCaching], {
|
|
302
|
+
wait: 1000
|
|
303
|
+
});
|
|
304
|
+
var theme = useMemo(function () {
|
|
305
|
+
if (propTheme === 'light') {
|
|
306
|
+
return themeLight;
|
|
307
|
+
} else if (propTheme === 'dark') {
|
|
308
|
+
return themeDark;
|
|
309
|
+
} else {
|
|
310
|
+
return propTheme;
|
|
311
|
+
}
|
|
312
|
+
}, [propTheme]);
|
|
313
|
+
return /*#__PURE__*/React.createElement(SortableContext.Provider, {
|
|
314
|
+
value: {
|
|
315
|
+
list: list,
|
|
316
|
+
setList: _setList,
|
|
317
|
+
contextMenu: contextMenu,
|
|
318
|
+
setContextMenu: setContextMenu,
|
|
319
|
+
listStatus: listStatus,
|
|
320
|
+
setListStatus: setListStatus,
|
|
321
|
+
contextMenuFuns: contextMenuFuns,
|
|
322
|
+
hideContextMenu: hideContextMenu,
|
|
323
|
+
showInfoItemData: showInfoItemData,
|
|
324
|
+
setShowInfoItemData: setShowInfoItemData,
|
|
325
|
+
openGroupItemData: openGroupItemData,
|
|
326
|
+
setOpenGroupItemData: setOpenGroupItemData,
|
|
327
|
+
longPressTriggered: longPressTriggered,
|
|
328
|
+
updateItemConfig: updateItemConfig,
|
|
329
|
+
updateItem: updateItem,
|
|
330
|
+
removeItem: removeItem,
|
|
331
|
+
moveItemId: moveItemId,
|
|
332
|
+
setMoveItemId: setMoveItemId,
|
|
333
|
+
moveTargetId: moveTargetId,
|
|
334
|
+
setMoveTargetId: setMoveTargetId,
|
|
335
|
+
theme: theme
|
|
336
|
+
}
|
|
337
|
+
}, children);
|
|
338
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useSortable: () => import("./context").SortableContextProps;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { SortableProps } from './Sortable';
|
|
3
|
+
import { Theme } from './theme';
|
|
4
|
+
import { SortItem } from './types';
|
|
5
|
+
export interface DesktopProps<D = any, C = any> extends SortableProps<D, C> {
|
|
6
|
+
/**
|
|
7
|
+
* 数据源
|
|
8
|
+
*/
|
|
9
|
+
list: SortItem<D, C>[];
|
|
10
|
+
/**
|
|
11
|
+
* onChange 事件,当排序发生变化时触发
|
|
12
|
+
*/
|
|
13
|
+
onChange?: (list: SortItem<D, C>[]) => void;
|
|
14
|
+
/**
|
|
15
|
+
* 本地存储 key
|
|
16
|
+
*/
|
|
17
|
+
readonly storageKey?: string;
|
|
18
|
+
/**
|
|
19
|
+
* 主题配置
|
|
20
|
+
*/
|
|
21
|
+
theme?: 'light' | 'dark' | Theme;
|
|
22
|
+
/**
|
|
23
|
+
* 是否启用缓存
|
|
24
|
+
* @default true
|
|
25
|
+
*/
|
|
26
|
+
enableCaching: boolean;
|
|
27
|
+
}
|
|
28
|
+
declare const Desktop: <D, C>(props: DesktopProps<D, C>) => React.JSX.Element;
|
|
29
|
+
export default Desktop;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
var _excluded = ["list", "onChange", "storageKey", "theme", "enableCaching"];
|
|
2
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
3
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import Sortable from "./Sortable";
|
|
6
|
+
import { SortableProvider } from "./context";
|
|
7
|
+
var Desktop = function Desktop(props) {
|
|
8
|
+
var list = props.list,
|
|
9
|
+
onChange = props.onChange,
|
|
10
|
+
storageKey = props.storageKey,
|
|
11
|
+
theme = props.theme,
|
|
12
|
+
enableCaching = props.enableCaching,
|
|
13
|
+
rest = _objectWithoutProperties(props, _excluded);
|
|
14
|
+
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(SortableProvider, {
|
|
15
|
+
theme: theme,
|
|
16
|
+
list: list,
|
|
17
|
+
onChange: onChange,
|
|
18
|
+
storageKey: storageKey,
|
|
19
|
+
enableCaching: enableCaching
|
|
20
|
+
}, /*#__PURE__*/React.createElement(Sortable, rest)));
|
|
21
|
+
};
|
|
22
|
+
export default Desktop;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const ghostClass: string;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
var _templateObject;
|
|
2
|
+
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
3
|
+
import { css } from '@emotion/css';
|
|
4
|
+
export var ghostClass = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n padding: 8px;\n transition: all 0.2s;\n > div {\n transition: all 0.2s;\n border: 2px solid aquamarine;\n background-color: transparent;\n > div {\n opacity: 0;\n transition: all 0.2s;\n }\n }\n"])));
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export interface Theme {
|
|
2
|
+
token: {
|
|
3
|
+
itemNameColor?: string;
|
|
4
|
+
itemIconBackgroundColor?: string;
|
|
5
|
+
itemIconShadowColor?: string;
|
|
6
|
+
groupItemIconBackgroundColor?: string;
|
|
7
|
+
groupItemIconShadowColor?: string;
|
|
8
|
+
groupItemModalBackgroundColor?: string;
|
|
9
|
+
contextMenuTextColor?: string;
|
|
10
|
+
contextMenuActiveColor?: string;
|
|
11
|
+
contextMenuBackgroundColor?: string;
|
|
12
|
+
contextMenuShadowColor?: string;
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
export declare const themeLight: Theme;
|
|
16
|
+
export declare const themeDark: Theme;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
export var themeLight = {
|
|
2
|
+
token: {
|
|
3
|
+
itemNameColor: '#1a1a1a',
|
|
4
|
+
itemIconBackgroundColor: 'white',
|
|
5
|
+
itemIconShadowColor: 'rgba(0, 0, 0, 0.1)',
|
|
6
|
+
groupItemIconBackgroundColor: 'rgba(255, 255, 255, 0.1)',
|
|
7
|
+
groupItemIconShadowColor: 'rgba(0, 0, 0, 0.1)',
|
|
8
|
+
groupItemModalBackgroundColor: 'rgba(255, 255, 255, 0.8)',
|
|
9
|
+
contextMenuTextColor: 'black',
|
|
10
|
+
contextMenuActiveColor: '#f3f4f6',
|
|
11
|
+
contextMenuBackgroundColor: 'white',
|
|
12
|
+
contextMenuShadowColor: 'rgba(0, 0, 0, 0.1)'
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
export var themeDark = {
|
|
16
|
+
token: {
|
|
17
|
+
itemNameColor: 'white',
|
|
18
|
+
itemIconBackgroundColor: '#1f2937',
|
|
19
|
+
itemIconShadowColor: 'rgba(0, 0, 0, 0.1)',
|
|
20
|
+
groupItemIconBackgroundColor: 'rgba(0, 0, 0, 0.1)',
|
|
21
|
+
groupItemIconShadowColor: 'rgba(0, 0, 0, 0.1)',
|
|
22
|
+
groupItemModalBackgroundColor: 'rgba(0, 0, 0, 0.1)',
|
|
23
|
+
contextMenuTextColor: 'white',
|
|
24
|
+
contextMenuActiveColor: '#1a1a1a',
|
|
25
|
+
contextMenuBackgroundColor: '#1a1a1a',
|
|
26
|
+
contextMenuShadowColor: 'rgba(255, 255, 255, 0.1)'
|
|
27
|
+
}
|
|
28
|
+
};
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
export interface SortItemBaseConfig {
|
|
2
|
+
/** 最大行数 default 2 */
|
|
3
|
+
maxRow?: number;
|
|
4
|
+
/** 最大列数 default 2 */
|
|
5
|
+
maxCol?: number;
|
|
6
|
+
/** 行数 */
|
|
7
|
+
row?: number;
|
|
8
|
+
/** 列数 */
|
|
9
|
+
col?: number;
|
|
10
|
+
/** 允许设置大小 default true */
|
|
11
|
+
allowResize?: boolean;
|
|
12
|
+
/** 允许打开右键菜单 default true */
|
|
13
|
+
allowContextMenu?: boolean;
|
|
14
|
+
/** 允许显示分享按钮 default true */
|
|
15
|
+
allowShare?: boolean;
|
|
16
|
+
/** 允许显示删除按钮 default true */
|
|
17
|
+
allowDelete?: boolean;
|
|
18
|
+
/** 允许显示信息按钮 default true */
|
|
19
|
+
allowInfo?: boolean;
|
|
20
|
+
}
|
|
21
|
+
export interface SortItemBaseData {
|
|
22
|
+
name: string;
|
|
23
|
+
icon?: string;
|
|
24
|
+
}
|
|
25
|
+
export interface SortItem<D = any & SortItemBaseData, C = any & SortItemBaseConfig> {
|
|
26
|
+
id: string | number;
|
|
27
|
+
type: 'app' | 'group';
|
|
28
|
+
data?: D;
|
|
29
|
+
config?: C;
|
|
30
|
+
children?: SortItem<D, C>[];
|
|
31
|
+
/** 下面的参数为组件内部处理时自动添加,不影响数据 */
|
|
32
|
+
parentIds?: (string | number)[];
|
|
33
|
+
/** groupItem 点击时的坐标,用于打开弹窗时从坐标处打开 */
|
|
34
|
+
pageX?: number;
|
|
35
|
+
pageY?: number;
|
|
36
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { Theme } from './theme';
|
|
2
|
+
import { SortItem } from './types';
|
|
3
|
+
declare class SortableUtils {
|
|
4
|
+
/** 清理重复id */
|
|
5
|
+
static uniqueArray: (array: SortItem[]) => SortItem<any, any>[];
|
|
6
|
+
static getTheme: (theme?: Theme) => {
|
|
7
|
+
light: {
|
|
8
|
+
itemNameColor?: string | undefined;
|
|
9
|
+
itemIconBackgroundColor?: string | undefined;
|
|
10
|
+
itemIconShadowColor?: string | undefined;
|
|
11
|
+
groupItemIconBackgroundColor?: string | undefined;
|
|
12
|
+
groupItemIconShadowColor?: string | undefined;
|
|
13
|
+
groupItemModalBackgroundColor?: string | undefined;
|
|
14
|
+
contextMenuTextColor?: string | undefined;
|
|
15
|
+
contextMenuActiveColor?: string | undefined;
|
|
16
|
+
contextMenuBackgroundColor?: string | undefined;
|
|
17
|
+
contextMenuShadowColor?: string | undefined;
|
|
18
|
+
};
|
|
19
|
+
dark: {
|
|
20
|
+
itemNameColor?: string | undefined;
|
|
21
|
+
itemIconBackgroundColor?: string | undefined;
|
|
22
|
+
itemIconShadowColor?: string | undefined;
|
|
23
|
+
groupItemIconBackgroundColor?: string | undefined;
|
|
24
|
+
groupItemIconShadowColor?: string | undefined;
|
|
25
|
+
groupItemModalBackgroundColor?: string | undefined;
|
|
26
|
+
contextMenuTextColor?: string | undefined;
|
|
27
|
+
contextMenuActiveColor?: string | undefined;
|
|
28
|
+
contextMenuBackgroundColor?: string | undefined;
|
|
29
|
+
contextMenuShadowColor?: string | undefined;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
export default SortableUtils;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
2
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
4
|
+
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
|
|
5
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
6
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
7
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
8
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
9
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
10
|
+
import { themeDark, themeLight } from "./theme";
|
|
11
|
+
var SortableUtils = /*#__PURE__*/_createClass(function SortableUtils() {
|
|
12
|
+
_classCallCheck(this, SortableUtils);
|
|
13
|
+
});
|
|
14
|
+
/** 清理重复id */
|
|
15
|
+
_defineProperty(SortableUtils, "uniqueArray", function (array) {
|
|
16
|
+
return array.reduce(function (acc, current) {
|
|
17
|
+
var x = acc.find(function (item) {
|
|
18
|
+
return item.id === current.id;
|
|
19
|
+
});
|
|
20
|
+
if (!x) {
|
|
21
|
+
return acc.concat([current]);
|
|
22
|
+
} else {
|
|
23
|
+
return acc;
|
|
24
|
+
}
|
|
25
|
+
}, []);
|
|
26
|
+
});
|
|
27
|
+
_defineProperty(SortableUtils, "getTheme", function (theme) {
|
|
28
|
+
var tlt = themeLight.token;
|
|
29
|
+
var tdt = themeDark.token;
|
|
30
|
+
var tl = _objectSpread(_objectSpread({}, tlt), theme === null || theme === void 0 ? void 0 : theme.token);
|
|
31
|
+
var dl = _objectSpread(_objectSpread({}, tdt), theme === null || theme === void 0 ? void 0 : theme.token);
|
|
32
|
+
return {
|
|
33
|
+
light: tl,
|
|
34
|
+
dark: dl
|
|
35
|
+
};
|
|
36
|
+
});
|
|
37
|
+
export default SortableUtils;
|
package/dist/Editor/index.d.ts
CHANGED
|
@@ -11,6 +11,7 @@ export interface EditorProps extends Omit<Partial<BlockNoteViewProps>, 'onChange
|
|
|
11
11
|
value?: PartialBlock<any>[];
|
|
12
12
|
onChange?: (value: PartialBlock<any>[]) => void;
|
|
13
13
|
uploadFile?: (file: File) => Promise<string>;
|
|
14
|
+
className?: string;
|
|
14
15
|
}
|
|
15
16
|
declare const Editor: FC<EditorProps>;
|
|
16
17
|
export default Editor;
|