zs_library 0.2.1 → 0.2.3

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.
@@ -1,4 +1,4 @@
1
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
1
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
2
2
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
3
3
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
4
4
  import { css, cx } from '@emotion/css';
@@ -34,7 +34,8 @@ var Sortable = function Sortable(props) {
34
34
  openGroupItemData = _useSortableState.openGroupItemData,
35
35
  setOpenGroupItemData = _useSortableState.setOpenGroupItemData,
36
36
  setMoveItemId = _useSortableState.setMoveItemId,
37
- setMoveTargetId = _useSortableState.setMoveTargetId;
37
+ setMoveTargetId = _useSortableState.setMoveTargetId,
38
+ addItem = _useSortableState.addItem;
38
39
  var _useSortableConfig = useSortableConfig(),
39
40
  pagingDotBuilder = _useSortableConfig.pagingDotBuilder,
40
41
  pagingDotsBuilder = _useSortableConfig.pagingDotsBuilder,
@@ -51,14 +52,16 @@ var Sortable = function Sortable(props) {
51
52
  right: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n .slick-dots {\n position: absolute;\n width: auto;\n right: 0;\n top: 0;\n bottom: 0;\n transform: translateX(100%);\n display: flex;\n justify-content: center;\n align-items: center;\n .slick-dots-default {\n flex-direction: column;\n }\n }\n "])))
52
53
  }[(_pagination$position = pagination.position) !== null && _pagination$position !== void 0 ? _pagination$position : 'bottom'];
53
54
  }, [pagination]);
54
- return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Slider, _extends({
55
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Slider, _extends({
56
+ useCSS: true,
57
+ useTransform: true,
55
58
  arrows: false,
56
59
  ref: _sliderRef !== null && _sliderRef !== void 0 ? _sliderRef : sliderRef,
57
60
  infinite: false,
58
61
  dots: true,
59
62
  touchMove: false,
60
63
  lazyLoad: "anticipated",
61
- className: cx(paginingLocationCss, className),
64
+ className: cx(paginingLocationCss, css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n .slick-track {\n display: flex;\n align-items: stretch;\n }\n .slick-slide {\n display: flex;\n align-self: stretch;\n height: unset;\n > div {\n display: flex;\n align-self: stretch;\n width: 100%;\n }\n }\n "]))), className),
62
65
  customPaging: function customPaging(i) {
63
66
  var _list$i;
64
67
  if (pagingDotBuilder) {
@@ -80,15 +83,29 @@ var Sortable = function Sortable(props) {
80
83
  }
81
84
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("ul", {
82
85
  ref: sliderDotsRef,
83
- className: cx('slick-dots-default', css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n padding: 0.5rem;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n gap: 0.5rem;\n background-color: rgba(0, 0, 0, 0.1);\n border-radius: 0.5rem;\n .slick-active {\n background-color: rgba(0, 0, 0, 0.3);\n color: white;\n padding: 0.25rem;\n border-radius: 0.25rem;\n }\n li {\n margin: 0;\n width: auto;\n height: auto;\n }\n "]))))
86
+ className: cx('slick-dots-default', css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n padding: 0.5rem;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n gap: 0.5rem;\n background-color: rgba(0, 0, 0, 0.1);\n border-radius: 0.5rem;\n .slick-active {\n background-color: rgba(0, 0, 0, 0.3);\n color: white;\n padding: 0.25rem;\n border-radius: 0.25rem;\n }\n li {\n margin: 0;\n width: auto;\n height: auto;\n }\n "]))))
84
87
  }, dots));
85
88
  }
86
89
  }, sliderProps), list.map(function (l) {
87
90
  var _l$children, _l$children2;
88
91
  return /*#__PURE__*/React.createElement("div", {
89
- key: l.id
92
+ key: l.id,
93
+ onDrop: function onDrop(e) {
94
+ e.preventDefault();
95
+ var data = e.dataTransfer.getData('text/plain');
96
+ if (data !== '') {
97
+ try {
98
+ addItem(JSON.parse(data), [l.id]);
99
+ } catch (e) {
100
+ console.log('drag error', e);
101
+ }
102
+ }
103
+ },
104
+ onDragOver: function onDragOver(e) {
105
+ e.preventDefault();
106
+ }
90
107
  }, /*#__PURE__*/React.createElement(ReactSortable, {
91
- className: cx(css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: grid;\n transition: all 0.3s;\n grid-template-columns: repeat(auto-fill, 96px);\n grid-auto-flow: dense;\n grid-auto-rows: 96px;\n place-items: center;\n justify-content: center;\n align-items: center;\n "])))),
108
+ className: cx(css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: grid;\n transition: all 0.3s;\n grid-template-columns: repeat(auto-fill, 96px);\n grid-auto-flow: dense;\n grid-auto-rows: 96px;\n place-items: center;\n justify-content: center;\n align-items: center;\n "])))),
92
109
  animation: 150,
93
110
  fallbackOnBody: true,
94
111
  swapThreshold: 0.65,
@@ -27,6 +27,7 @@ export interface SortableState {
27
27
  updateItem: (id: string | number, data: any) => void;
28
28
  updateItemConfig: (id: string | number, config: any) => void;
29
29
  removeItem: (id: string) => void;
30
+ addItem: (data: SortItem, parentIds: (string | number)[]) => void;
30
31
  /** 当前移动的元素id */
31
32
  moveItemId: string | null;
32
33
  setMoveItemId: (e: string | null) => void;
@@ -17,6 +17,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
17
17
  import { useDebounceEffect, useLocalStorageState } from 'ahooks';
18
18
  import React, { createContext, useEffect, useRef, useState } from 'react';
19
19
  import { v4 as uuidv4 } from 'uuid';
20
+ import { configMap } from "../../config";
20
21
  import SortableUtils from "../../utils";
21
22
  export var SortableStateContext = /*#__PURE__*/createContext({
22
23
  list: [],
@@ -35,6 +36,7 @@ export var SortableStateContext = /*#__PURE__*/createContext({
35
36
  updateItem: function updateItem() {},
36
37
  updateItemConfig: function updateItemConfig() {},
37
38
  removeItem: function removeItem() {},
39
+ addItem: function addItem() {},
38
40
  moveItemId: null,
39
41
  setMoveItemId: function setMoveItemId() {},
40
42
  moveTargetId: null,
@@ -275,6 +277,37 @@ export var SortableStateProvider = function SortableStateProvider(props) {
275
277
  return _list;
276
278
  });
277
279
  };
280
+ var addItem = function addItem(data, parentIds) {
281
+ var _list = _toConsumableArray(list);
282
+
283
+ // 根据 parentIds 递归查找,放置到对应的父级下
284
+ var addToChild = function addToChild(list, parentIds) {
285
+ var parentId = parentIds.shift();
286
+ var parent = list.find(function (item) {
287
+ return item.id === parentId;
288
+ });
289
+ var parentIndex = list.findIndex(function (item) {
290
+ return item.id === parentId;
291
+ });
292
+ if (!parent) {
293
+ return list;
294
+ } else {
295
+ if (parentIds.length) {
296
+ parent.children = addToChild(parent.children || [], parentIds);
297
+ } else {
298
+ var _data$type, _parent$children3, _data$config2;
299
+ var type = (_data$type = data === null || data === void 0 ? void 0 : data.type) !== null && _data$type !== void 0 ? _data$type : 'app';
300
+ parent.children = [].concat(_toConsumableArray((_parent$children3 = parent.children) !== null && _parent$children3 !== void 0 ? _parent$children3 : []), [_objectSpread(_objectSpread({}, data), {}, {
301
+ id: uuidv4(),
302
+ config: (_data$config2 = data === null || data === void 0 ? void 0 : data.config) !== null && _data$config2 !== void 0 ? _data$config2 : configMap[type]
303
+ })]);
304
+ }
305
+ list.splice(parentIndex, 1, parent);
306
+ return list;
307
+ }
308
+ };
309
+ setList(addToChild(_list, parentIds));
310
+ };
278
311
  useEffect(function () {
279
312
  if ((propList === null || propList === void 0 ? void 0 : propList.length) > 0 && list.length === 0) {
280
313
  _setList(propList);
@@ -319,6 +352,7 @@ export var SortableStateProvider = function SortableStateProvider(props) {
319
352
  updateItemConfig: updateItemConfig,
320
353
  updateItem: updateItem,
321
354
  removeItem: removeItem,
355
+ addItem: addItem,
322
356
  moveItemId: moveItemId,
323
357
  setMoveItemId: setMoveItemId,
324
358
  moveTargetId: moveTargetId,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "zs_library",
3
- "version": "0.2.1",
3
+ "version": "0.2.3",
4
4
  "description": "A react library developed with dumi",
5
5
  "homepage": "https://zs-library.vercel.app",
6
6
  "bugs": {
@@ -58,9 +58,9 @@
58
58
  ]
59
59
  },
60
60
  "dependencies": {
61
- "@blocknote/core": "^0.15.3",
62
- "@blocknote/mantine": "^0.15.3",
63
- "@blocknote/react": "^0.15.3",
61
+ "@blocknote/core": "^0.15.6",
62
+ "@blocknote/mantine": "^0.15.6",
63
+ "@blocknote/react": "^0.15.6",
64
64
  "@emotion/css": "^11.13.0",
65
65
  "@mantine/core": "^7.11.2",
66
66
  "@remixicon/react": "^4.2.0",