@kep-platform/basic-component 0.0.28 → 0.0.32
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/Columns/Columns.d.ts +2 -1
- package/dist/Columns/Columns.js +3 -2
- package/dist/Draggable/Draggable.d.ts +6 -0
- package/dist/Draggable/Draggable.js +34 -0
- package/dist/Draggable/Droppable.d.ts +6 -0
- package/dist/Draggable/Droppable.js +16 -0
- package/dist/Draggable/index.d.ts +0 -0
- package/dist/Draggable/index.js +0 -0
- package/dist/Draggable/test.js +13 -0
- package/dist/Grid/Row.js +0 -1
- package/dist/PopupBox/PopupBox.js +1 -1
- package/dist/Tree/Tree.d.ts +3 -1
- package/dist/Tree/Tree.js +16 -15
- package/dist/Tree/TreeNode.d.ts +3 -1
- package/dist/Tree/TreeNode.js +3 -2
- package/dist/Tree/test.d.ts +3 -0
- package/dist/Tree/test.js +190 -0
- package/dist/Window/Window.d.ts +15 -0
- package/dist/Window/Window.js +152 -0
- package/dist/Window/WindowController.d.ts +10 -0
- package/dist/Window/WindowController.js +37 -0
- package/dist/Window/WindowOption.d.ts +7 -0
- package/dist/Window/WindowOption.js +43 -0
- package/dist/Window/WindowStore.d.ts +49 -0
- package/dist/Window/WindowStore.js +155 -0
- package/dist/Window/index.d.ts +2 -0
- package/dist/Window/index.js +2 -0
- package/dist/Window/test.d.ts +3 -0
- package/dist/Window/test.js +61 -0
- package/package.json +86 -81
- package/dist/Tree/BOMTree.js +0 -117
- /package/dist/{Tree/BOMTree.d.ts → Draggable/test.d.ts} +0 -0
@@ -0,0 +1,37 @@
|
|
1
|
+
var _excluded = ["type", "window", "children"];
|
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
|
+
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; }
|
4
|
+
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; }
|
5
|
+
import { useDraggable } from '@dnd-kit/core';
|
6
|
+
import React, { useEffect } from 'react';
|
7
|
+
import styled from 'styled-components';
|
8
|
+
var WindowControllerContainer = styled.div.withConfig({
|
9
|
+
displayName: "WindowControllerContainer",
|
10
|
+
componentId: "basic-component-347b__sc-1rv6ocd-0"
|
11
|
+
})(["&:active,&:focus{outline:none;}"]);
|
12
|
+
export default function WindowController(props) {
|
13
|
+
var type = props.type,
|
14
|
+
window = props.window,
|
15
|
+
children = props.children,
|
16
|
+
rest = _objectWithoutProperties(props, _excluded);
|
17
|
+
var _useDraggable = useDraggable({
|
18
|
+
id: "".concat(window.id, "/").concat(type),
|
19
|
+
disabled: window.fullscreen
|
20
|
+
}),
|
21
|
+
attributes = _useDraggable.attributes,
|
22
|
+
transform = _useDraggable.transform,
|
23
|
+
setNodeRef = _useDraggable.setNodeRef,
|
24
|
+
listeners = _useDraggable.listeners,
|
25
|
+
isDragging = _useDraggable.isDragging;
|
26
|
+
useEffect(function () {
|
27
|
+
if (transform && isDragging) {
|
28
|
+
window.controll(transform, type);
|
29
|
+
} else {
|
30
|
+
window.endControll();
|
31
|
+
}
|
32
|
+
}, [transform, isDragging, type]);
|
33
|
+
return /*#__PURE__*/React.createElement(WindowControllerContainer, _extends({}, rest, attributes, listeners, {
|
34
|
+
ref: setNodeRef,
|
35
|
+
role: "div"
|
36
|
+
}), children);
|
37
|
+
}
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import React, { HtmlHTMLAttributes, ReactNode } from 'react';
|
2
|
+
type WindowOptionProps = {
|
3
|
+
icon: ReactNode;
|
4
|
+
color?: string;
|
5
|
+
} & HtmlHTMLAttributes<HTMLSpanElement>;
|
6
|
+
export default function WindowOption(props: WindowOptionProps): React.JSX.Element;
|
7
|
+
export {};
|
@@ -0,0 +1,43 @@
|
|
1
|
+
var _excluded = ["icon"];
|
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
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
4
|
+
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."); }
|
5
|
+
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); }
|
6
|
+
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; }
|
7
|
+
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; } }
|
8
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
9
|
+
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; }
|
10
|
+
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; }
|
11
|
+
import React, { useState } from 'react';
|
12
|
+
import styled, { css } from 'styled-components';
|
13
|
+
var WindowOptionContainer = styled.span.withConfig({
|
14
|
+
shouldForwardProp: function shouldForwardProp(prop) {
|
15
|
+
return !['active'].includes(prop);
|
16
|
+
}
|
17
|
+
}).withConfig({
|
18
|
+
displayName: "WindowOptionContainer",
|
19
|
+
componentId: "basic-component-347b__sc-1ebf27x-0"
|
20
|
+
})(["cursor:pointer;& svg{transition:transform 0.5s;color:", ";}&:hover{& svg{transform:scale(1.2);}}", ""], function (props) {
|
21
|
+
return props.color || 'auto';
|
22
|
+
}, function (props) {
|
23
|
+
if (props.active) {
|
24
|
+
return css(["& svg{transform:scale(0.9) !important;}"]);
|
25
|
+
}
|
26
|
+
});
|
27
|
+
export default function WindowOption(props) {
|
28
|
+
var icon = props.icon,
|
29
|
+
rest = _objectWithoutProperties(props, _excluded);
|
30
|
+
var _useState = useState(false),
|
31
|
+
_useState2 = _slicedToArray(_useState, 2),
|
32
|
+
active = _useState2[0],
|
33
|
+
setActive = _useState2[1];
|
34
|
+
return /*#__PURE__*/React.createElement(WindowOptionContainer, _extends({}, rest, {
|
35
|
+
onPointerDown: function onPointerDown() {
|
36
|
+
setActive(true);
|
37
|
+
},
|
38
|
+
onPointerUp: function onPointerUp() {
|
39
|
+
setActive(false);
|
40
|
+
},
|
41
|
+
active: active
|
42
|
+
}), icon);
|
43
|
+
}
|
@@ -0,0 +1,49 @@
|
|
1
|
+
import { Transform } from '@dnd-kit/utilities';
|
2
|
+
import { WindowControllerType } from './WindowController';
|
3
|
+
export default class WindowStore {
|
4
|
+
width: string;
|
5
|
+
height: string;
|
6
|
+
left: string;
|
7
|
+
top: string;
|
8
|
+
zIndex: number;
|
9
|
+
fullscreen: boolean;
|
10
|
+
id: string;
|
11
|
+
transform: {
|
12
|
+
x: number;
|
13
|
+
y: number;
|
14
|
+
} | null;
|
15
|
+
isMoving: boolean;
|
16
|
+
isResizing: boolean;
|
17
|
+
minimizePos: {
|
18
|
+
left: number;
|
19
|
+
top: number;
|
20
|
+
} | null;
|
21
|
+
isMinimize: boolean;
|
22
|
+
isClosed: boolean;
|
23
|
+
onClosedHandler: ((id: string) => void) | undefined;
|
24
|
+
constructor(id: string, onClosedHandler?: (id: string) => void);
|
25
|
+
fullscreenWindow(): void;
|
26
|
+
fullscreenExitWindow(): void;
|
27
|
+
resetState(): void;
|
28
|
+
calculateTransform(transform: Transform): {
|
29
|
+
x: number;
|
30
|
+
y: number;
|
31
|
+
};
|
32
|
+
controll(transform: Transform, type: WindowControllerType): void;
|
33
|
+
endControll(): void;
|
34
|
+
minimizeWindow(minimize: {
|
35
|
+
left: number;
|
36
|
+
top: number;
|
37
|
+
}): void;
|
38
|
+
normalizeWindow(): void;
|
39
|
+
closeWindow(): void;
|
40
|
+
get style(): {
|
41
|
+
left: string | number;
|
42
|
+
top: string | number;
|
43
|
+
width: string | number;
|
44
|
+
height: string | number;
|
45
|
+
zIndex: number;
|
46
|
+
transform: string;
|
47
|
+
transition: string;
|
48
|
+
};
|
49
|
+
}
|
@@ -0,0 +1,155 @@
|
|
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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
3
|
+
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); } }
|
4
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
5
|
+
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; }
|
6
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
7
|
+
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); }
|
8
|
+
import { action, computed, makeObservable, observable } from 'mobx';
|
9
|
+
var WindowStore = /*#__PURE__*/function () {
|
10
|
+
function WindowStore(id, onClosedHandler) {
|
11
|
+
_classCallCheck(this, WindowStore);
|
12
|
+
_defineProperty(this, "width", '400px');
|
13
|
+
_defineProperty(this, "height", '400px');
|
14
|
+
_defineProperty(this, "left", '0px');
|
15
|
+
_defineProperty(this, "top", '0px');
|
16
|
+
_defineProperty(this, "zIndex", 1);
|
17
|
+
_defineProperty(this, "fullscreen", true);
|
18
|
+
_defineProperty(this, "id", '');
|
19
|
+
_defineProperty(this, "transform", null);
|
20
|
+
_defineProperty(this, "isMoving", false);
|
21
|
+
_defineProperty(this, "isResizing", false);
|
22
|
+
_defineProperty(this, "minimizePos", null);
|
23
|
+
_defineProperty(this, "isMinimize", false);
|
24
|
+
_defineProperty(this, "isClosed", false);
|
25
|
+
_defineProperty(this, "onClosedHandler", void 0);
|
26
|
+
makeObservable(this, {
|
27
|
+
width: observable,
|
28
|
+
height: observable,
|
29
|
+
left: observable,
|
30
|
+
top: observable,
|
31
|
+
zIndex: observable,
|
32
|
+
fullscreen: observable,
|
33
|
+
transform: observable.struct,
|
34
|
+
isMoving: observable,
|
35
|
+
isResizing: observable,
|
36
|
+
isClosed: observable,
|
37
|
+
fullscreenExitWindow: action,
|
38
|
+
fullscreenWindow: action,
|
39
|
+
controll: action,
|
40
|
+
endControll: action,
|
41
|
+
style: computed.struct,
|
42
|
+
isMinimize: observable,
|
43
|
+
minimizePos: observable.struct,
|
44
|
+
minimizeWindow: action,
|
45
|
+
normalizeWindow: action,
|
46
|
+
closeWindow: action,
|
47
|
+
resetState: action
|
48
|
+
});
|
49
|
+
this.id = id;
|
50
|
+
this.onClosedHandler = onClosedHandler;
|
51
|
+
}
|
52
|
+
_createClass(WindowStore, [{
|
53
|
+
key: "fullscreenWindow",
|
54
|
+
value: function fullscreenWindow() {
|
55
|
+
this.resetState();
|
56
|
+
this.fullscreen = true;
|
57
|
+
}
|
58
|
+
}, {
|
59
|
+
key: "fullscreenExitWindow",
|
60
|
+
value: function fullscreenExitWindow() {
|
61
|
+
this.resetState();
|
62
|
+
this.fullscreen = false;
|
63
|
+
}
|
64
|
+
}, {
|
65
|
+
key: "resetState",
|
66
|
+
value: function resetState() {
|
67
|
+
this.transform = null;
|
68
|
+
}
|
69
|
+
}, {
|
70
|
+
key: "calculateTransform",
|
71
|
+
value: function calculateTransform(transform) {
|
72
|
+
var _this$transform, _this$transform2;
|
73
|
+
return {
|
74
|
+
x: transform.x - (((_this$transform = this.transform) === null || _this$transform === void 0 ? void 0 : _this$transform.x) || 0),
|
75
|
+
y: transform.y - (((_this$transform2 = this.transform) === null || _this$transform2 === void 0 ? void 0 : _this$transform2.y) || 0)
|
76
|
+
};
|
77
|
+
}
|
78
|
+
}, {
|
79
|
+
key: "controll",
|
80
|
+
value: function controll(transform, type) {
|
81
|
+
var offsetTransform = this.calculateTransform(transform);
|
82
|
+
if (type === 'move') {
|
83
|
+
this.isMoving = true;
|
84
|
+
this.isResizing = false;
|
85
|
+
} else {
|
86
|
+
this.isMoving = false;
|
87
|
+
this.isResizing = true;
|
88
|
+
}
|
89
|
+
if (type.includes('left')) {
|
90
|
+
this.left = Math.round(parseFloat(this.left) + offsetTransform.x) + 'px';
|
91
|
+
this.width = Math.round(parseFloat(this.width) - offsetTransform.x) + 'px';
|
92
|
+
}
|
93
|
+
if (type.includes('right')) {
|
94
|
+
this.width = Math.round(parseFloat(this.width) + offsetTransform.x) + 'px';
|
95
|
+
}
|
96
|
+
if (type.includes('top')) {
|
97
|
+
this.top = Math.round(parseFloat(this.top) + offsetTransform.y) + 'px';
|
98
|
+
this.height = Math.round(parseFloat(this.height) - offsetTransform.y) + 'px';
|
99
|
+
}
|
100
|
+
if (type.includes('bottom')) {
|
101
|
+
this.height = Math.round(parseFloat(this.height) + offsetTransform.y) + 'px';
|
102
|
+
}
|
103
|
+
if (type.includes('move')) {
|
104
|
+
this.left = Math.round(parseFloat(this.left) + offsetTransform.x) + 'px';
|
105
|
+
this.top = Math.round(parseFloat(this.top) + offsetTransform.y) + 'px';
|
106
|
+
}
|
107
|
+
this.transform = transform;
|
108
|
+
}
|
109
|
+
}, {
|
110
|
+
key: "endControll",
|
111
|
+
value: function endControll() {
|
112
|
+
this.isMoving = false;
|
113
|
+
this.isResizing = false;
|
114
|
+
this.resetState();
|
115
|
+
}
|
116
|
+
}, {
|
117
|
+
key: "minimizeWindow",
|
118
|
+
value: function minimizeWindow(minimize) {
|
119
|
+
this.minimizePos = minimize;
|
120
|
+
this.isMinimize = true;
|
121
|
+
this.fullscreen = false;
|
122
|
+
this.resetState();
|
123
|
+
}
|
124
|
+
}, {
|
125
|
+
key: "normalizeWindow",
|
126
|
+
value: function normalizeWindow() {
|
127
|
+
this.minimizePos = null;
|
128
|
+
this.isMinimize = false;
|
129
|
+
this.fullscreen = false;
|
130
|
+
this.resetState();
|
131
|
+
}
|
132
|
+
}, {
|
133
|
+
key: "closeWindow",
|
134
|
+
value: function closeWindow() {
|
135
|
+
this.isClosed = true;
|
136
|
+
this.resetState();
|
137
|
+
}
|
138
|
+
}, {
|
139
|
+
key: "style",
|
140
|
+
get: function get() {
|
141
|
+
var renderStyle = {
|
142
|
+
left: this.isClosed ? this.left : this.isMinimize && this.minimizePos ? this.minimizePos.left : this.fullscreen ? 0 : this.left,
|
143
|
+
top: this.isClosed ? this.top : this.isMinimize && this.minimizePos ? this.minimizePos.top : this.fullscreen ? 0 : this.top,
|
144
|
+
width: this.isClosed ? this.width : this.isMinimize ? 0 : this.fullscreen ? '100%' : this.width,
|
145
|
+
height: this.isClosed ? this.height : this.isMinimize ? 0 : this.fullscreen ? '100%' : this.height,
|
146
|
+
zIndex: this.zIndex,
|
147
|
+
transform: this.isMinimize || this.isClosed ? 'scale(0)' : 'none',
|
148
|
+
transition: this.isMoving || this.isResizing ? 'none' : 'all 0.5s ease-out'
|
149
|
+
};
|
150
|
+
return renderStyle;
|
151
|
+
}
|
152
|
+
}]);
|
153
|
+
return WindowStore;
|
154
|
+
}();
|
155
|
+
export { WindowStore as default };
|
@@ -0,0 +1,61 @@
|
|
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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
3
|
+
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); } }
|
4
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
5
|
+
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; }
|
6
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
7
|
+
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); }
|
8
|
+
import { DndContext } from '@dnd-kit/core';
|
9
|
+
import { makeAutoObservable } from 'mobx';
|
10
|
+
import { observer } from 'mobx-react-lite';
|
11
|
+
import React from 'react';
|
12
|
+
import { Button } from "../Button";
|
13
|
+
import { Space } from "../Space";
|
14
|
+
import { GlobalStyles } from "../__styles";
|
15
|
+
import { Window, WindowStore } from "./index";
|
16
|
+
var WindowManager = /*#__PURE__*/function () {
|
17
|
+
function WindowManager() {
|
18
|
+
_classCallCheck(this, WindowManager);
|
19
|
+
_defineProperty(this, "windows", [new WindowStore('jss', this.closeWindowHanlder.bind(this)), new WindowStore('jx', this.closeWindowHanlder.bind(this)), new WindowStore('jiangxin', this.closeWindowHanlder.bind(this)), new WindowStore('xixi', this.closeWindowHanlder.bind(this))]);
|
20
|
+
makeAutoObservable(this);
|
21
|
+
}
|
22
|
+
_createClass(WindowManager, [{
|
23
|
+
key: "closeWindowHanlder",
|
24
|
+
value: function closeWindowHanlder(id) {
|
25
|
+
this.windows = this.windows.filter(function (window) {
|
26
|
+
return window.id !== id;
|
27
|
+
});
|
28
|
+
}
|
29
|
+
}, {
|
30
|
+
key: "report",
|
31
|
+
get: function get() {
|
32
|
+
return this.windows.map(function (window) {
|
33
|
+
return window.id;
|
34
|
+
}).join(',');
|
35
|
+
}
|
36
|
+
}]);
|
37
|
+
return WindowManager;
|
38
|
+
}();
|
39
|
+
var windowManager = new WindowManager();
|
40
|
+
export default observer(function Test() {
|
41
|
+
return /*#__PURE__*/React.createElement(DndContext, null, /*#__PURE__*/React.createElement(Space, null, windowManager.report, /*#__PURE__*/React.createElement(Button, {
|
42
|
+
onClick: function onClick() {
|
43
|
+
windowManager.windows.forEach(function (window) {
|
44
|
+
window.normalizeWindow();
|
45
|
+
});
|
46
|
+
}
|
47
|
+
}, "\u5C55\u5F00")), /*#__PURE__*/React.createElement("div", {
|
48
|
+
style: {
|
49
|
+
position: 'relative',
|
50
|
+
height: '1200px'
|
51
|
+
}
|
52
|
+
}, /*#__PURE__*/React.createElement(GlobalStyles, {
|
53
|
+
$css: []
|
54
|
+
}), windowManager.windows.map(function (windowStore) {
|
55
|
+
return /*#__PURE__*/React.createElement(Window, {
|
56
|
+
window: windowStore,
|
57
|
+
key: windowStore.id,
|
58
|
+
title: 'xixi'
|
59
|
+
}, "123");
|
60
|
+
})));
|
61
|
+
});
|
package/package.json
CHANGED
@@ -1,85 +1,90 @@
|
|
1
1
|
{
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
"
|
9
|
-
|
10
|
-
"build": "father build",
|
11
|
-
"build:watch": "father dev",
|
12
|
-
"docs:build": "dumi build",
|
13
|
-
"docs:preview": "dumi preview",
|
14
|
-
"prepare": "dumi setup",
|
15
|
-
"doctor": "father doctor",
|
16
|
-
"lint": "npm run lint:es && npm run lint:css",
|
17
|
-
"lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
|
18
|
-
"lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
|
19
|
-
"prepublishOnly": "father doctor && npm run build"
|
20
|
-
},
|
21
|
-
"authors": [
|
22
|
-
"lee-step-jss 1599925910@qq.com"
|
23
|
-
],
|
24
|
-
"license": "MIT",
|
25
|
-
"files": [
|
26
|
-
"dist"
|
27
|
-
],
|
28
|
-
"commitlint": {
|
29
|
-
"extends": [
|
30
|
-
"@commitlint/config-conventional"
|
31
|
-
]
|
32
|
-
},
|
33
|
-
"lint-staged": {
|
34
|
-
"*.{md,json}": [
|
35
|
-
"prettier --write --no-error-on-unmatched-pattern"
|
2
|
+
"name": "@kep-platform/basic-component",
|
3
|
+
"version": "0.0.32",
|
4
|
+
"description": "A react library developed with dumi",
|
5
|
+
"license": "MIT",
|
6
|
+
"module": "dist/index.js",
|
7
|
+
"types": "dist/index.d.ts",
|
8
|
+
"files": [
|
9
|
+
"dist"
|
36
10
|
],
|
37
|
-
"
|
38
|
-
|
39
|
-
|
11
|
+
"scripts": {
|
12
|
+
"build": "father build",
|
13
|
+
"build:watch": "father dev",
|
14
|
+
"dev": "dumi dev",
|
15
|
+
"docs:build": "dumi build",
|
16
|
+
"docs:preview": "dumi preview",
|
17
|
+
"doctor": "father doctor",
|
18
|
+
"lint": "npm run lint:es && npm run lint:css",
|
19
|
+
"lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
|
20
|
+
"lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
|
21
|
+
"prepare": "dumi setup",
|
22
|
+
"prepublishOnly": "npm run build",
|
23
|
+
"start": "npm run dev"
|
24
|
+
},
|
25
|
+
"commitlint": {
|
26
|
+
"extends": [
|
27
|
+
"@commitlint/config-conventional"
|
28
|
+
]
|
29
|
+
},
|
30
|
+
"lint-staged": {
|
31
|
+
"*.{md,json}": [
|
32
|
+
"prettier --write --no-error-on-unmatched-pattern"
|
33
|
+
],
|
34
|
+
"*.{css,less}": [
|
35
|
+
"stylelint --fix",
|
36
|
+
"prettier --write"
|
37
|
+
],
|
38
|
+
"*.{js,jsx}": [
|
39
|
+
"eslint --fix",
|
40
|
+
"prettier --write"
|
41
|
+
],
|
42
|
+
"*.{ts,tsx}": [
|
43
|
+
"eslint --fix",
|
44
|
+
"prettier --parser=typescript --write"
|
45
|
+
]
|
46
|
+
},
|
47
|
+
"dependencies": {
|
48
|
+
"@ant-design/icons": "^5.3.7",
|
49
|
+
"@dnd-kit/core": "^6.1.0",
|
50
|
+
"@dnd-kit/utilities": "^3.2.2",
|
51
|
+
"@kep-platform/hooks": "^0.0.32",
|
52
|
+
"color": "^4.2.3",
|
53
|
+
"rc-pagination": "^4.1.0",
|
54
|
+
"styled-components": "^6.1.11"
|
55
|
+
},
|
56
|
+
"devDependencies": {
|
57
|
+
"@babel/runtime": "^7.24.6",
|
58
|
+
"@commitlint/cli": "^17.1.2",
|
59
|
+
"@commitlint/config-conventional": "^17.1.0",
|
60
|
+
"@types/color": "^3.0.6",
|
61
|
+
"@types/react": "^18.0.0",
|
62
|
+
"@types/react-dom": "^18.0.0",
|
63
|
+
"@umijs/lint": "^4.0.0",
|
64
|
+
"babel-plugin-transform-remove-console": "^6.9.4",
|
65
|
+
"dumi": "^2.3.0",
|
66
|
+
"eslint": "^8.23.0",
|
67
|
+
"father": "^4.1.0",
|
68
|
+
"husky": "^8.0.1",
|
69
|
+
"lint-staged": "^13.0.3",
|
70
|
+
"prettier": "^2.7.1",
|
71
|
+
"prettier-plugin-organize-imports": "^3.0.0",
|
72
|
+
"prettier-plugin-packagejson": "^2.2.18",
|
73
|
+
"react": "^18.0.0",
|
74
|
+
"react-dom": "^18.0.0",
|
75
|
+
"stylelint": "^14.9.1"
|
76
|
+
},
|
77
|
+
"peerDependencies": {
|
78
|
+
"mobx": "^6.12.3",
|
79
|
+
"mobx-react-lite": "^4.0.7",
|
80
|
+
"react": ">=16.9.0",
|
81
|
+
"react-dom": ">=16.9.0"
|
82
|
+
},
|
83
|
+
"publishConfig": {
|
84
|
+
"access": "public"
|
85
|
+
},
|
86
|
+
"authors": [
|
87
|
+
"lee-step-jss 1599925910@qq.com"
|
40
88
|
],
|
41
|
-
"
|
42
|
-
"eslint --fix",
|
43
|
-
"prettier --write"
|
44
|
-
],
|
45
|
-
"*.{ts,tsx}": [
|
46
|
-
"eslint --fix",
|
47
|
-
"prettier --parser=typescript --write"
|
48
|
-
]
|
49
|
-
},
|
50
|
-
"publishConfig": {
|
51
|
-
"access": "public"
|
52
|
-
},
|
53
|
-
"peerDependencies": {
|
54
|
-
"react": ">=16.9.0",
|
55
|
-
"react-dom": ">=16.9.0"
|
56
|
-
},
|
57
|
-
"devDependencies": {
|
58
|
-
"@babel/runtime": "^7.24.6",
|
59
|
-
"@commitlint/cli": "^17.1.2",
|
60
|
-
"@commitlint/config-conventional": "^17.1.0",
|
61
|
-
"@types/color": "^3.0.6",
|
62
|
-
"@types/react": "^18.0.0",
|
63
|
-
"@types/react-dom": "^18.0.0",
|
64
|
-
"@umijs/lint": "^4.0.0",
|
65
|
-
"dumi": "^2.3.0",
|
66
|
-
"eslint": "^8.23.0",
|
67
|
-
"father": "^4.1.0",
|
68
|
-
"husky": "^8.0.1",
|
69
|
-
"lint-staged": "^13.0.3",
|
70
|
-
"prettier": "^2.7.1",
|
71
|
-
"prettier-plugin-organize-imports": "^3.0.0",
|
72
|
-
"prettier-plugin-packagejson": "^2.2.18",
|
73
|
-
"react": "^18.0.0",
|
74
|
-
"react-dom": "^18.0.0",
|
75
|
-
"stylelint": "^14.9.1"
|
76
|
-
},
|
77
|
-
"gitHead": "199e06d46f67de10c87f790fc5c704666a0eb288",
|
78
|
-
"dependencies": {
|
79
|
-
"@ant-design/icons": "^5.3.7",
|
80
|
-
"@kep-platform/hooks": "^0.0.28",
|
81
|
-
"color": "^4.2.3",
|
82
|
-
"rc-pagination": "^4.1.0",
|
83
|
-
"styled-components": "^6.1.11"
|
84
|
-
}
|
89
|
+
"gitHead": "581914abdd5785a77fa0400eb7cce9f25e07eabf"
|
85
90
|
}
|
package/dist/Tree/BOMTree.js
DELETED
@@ -1,117 +0,0 @@
|
|
1
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
2
|
-
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."); }
|
3
|
-
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); }
|
4
|
-
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; }
|
5
|
-
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; } }
|
6
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
7
|
-
import { GlobalStyles } from "./..";
|
8
|
-
import React, { useState } from 'react';
|
9
|
-
import styled from 'styled-components';
|
10
|
-
import Tree from "./Tree";
|
11
|
-
var Title = styled.div.withConfig({
|
12
|
-
displayName: "Title",
|
13
|
-
componentId: "basic-component-347b__sc-klaw2r-0"
|
14
|
-
})(["width:100%;text-align:center;"]);
|
15
|
-
export default (function () {
|
16
|
-
var _useState = useState([]),
|
17
|
-
_useState2 = _slicedToArray(_useState, 2),
|
18
|
-
selectedKeys = _useState2[0],
|
19
|
-
setSelectedKeys = _useState2[1];
|
20
|
-
var _useState3 = useState([]),
|
21
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
22
|
-
expandedKeys = _useState4[0],
|
23
|
-
setExpandedKeys = _useState4[1];
|
24
|
-
var treeData = [{
|
25
|
-
key: '1',
|
26
|
-
title: 'jss',
|
27
|
-
count: 1,
|
28
|
-
groupBy: 'count',
|
29
|
-
children: [{
|
30
|
-
key: '4',
|
31
|
-
title: 'skjdfkljasklfjkljdsklajfkl就是要长一的点点滴滴的点点滴滴哒哒哒哒哒哒哒哒哒哒哒哒哒哒',
|
32
|
-
children: []
|
33
|
-
}, {
|
34
|
-
key: '5',
|
35
|
-
title: 567,
|
36
|
-
children: []
|
37
|
-
}, {
|
38
|
-
key: '6',
|
39
|
-
title: 789,
|
40
|
-
children: []
|
41
|
-
}]
|
42
|
-
}, {
|
43
|
-
key: '2121212121212',
|
44
|
-
title: '2',
|
45
|
-
count: 1,
|
46
|
-
groupBy: 'count',
|
47
|
-
children: [{
|
48
|
-
key: '3',
|
49
|
-
title: 'jss',
|
50
|
-
name: 'jss',
|
51
|
-
children: [],
|
52
|
-
count: 2
|
53
|
-
}, {
|
54
|
-
key: '10',
|
55
|
-
title: 'jss',
|
56
|
-
name: 'jss',
|
57
|
-
children: [],
|
58
|
-
count: 2
|
59
|
-
}, {
|
60
|
-
key: '20',
|
61
|
-
title: '3',
|
62
|
-
children: [],
|
63
|
-
count: 2
|
64
|
-
}]
|
65
|
-
}];
|
66
|
-
var columns = [{
|
67
|
-
key: 'key',
|
68
|
-
title: '键值',
|
69
|
-
dataIndex: 'key',
|
70
|
-
align: 'center',
|
71
|
-
width: 400,
|
72
|
-
fixed: 'left'
|
73
|
-
}, {
|
74
|
-
key: 'name',
|
75
|
-
title: '姓名',
|
76
|
-
dataIndex: 'name',
|
77
|
-
align: 'center'
|
78
|
-
}, {
|
79
|
-
key: 'count',
|
80
|
-
title: '数量',
|
81
|
-
dataIndex: 'count',
|
82
|
-
align: 'center'
|
83
|
-
}];
|
84
|
-
var contextMenuRender = function contextMenuRender(node) {
|
85
|
-
return [{
|
86
|
-
key: 'delete',
|
87
|
-
label: "\u5220\u9664 node".concat(node.key)
|
88
|
-
}, {
|
89
|
-
key: 'add',
|
90
|
-
label: '新增'
|
91
|
-
}, {
|
92
|
-
key: 'edit',
|
93
|
-
label: '编辑'
|
94
|
-
}];
|
95
|
-
};
|
96
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(GlobalStyles, {
|
97
|
-
$css: []
|
98
|
-
}), /*#__PURE__*/React.createElement(Tree, {
|
99
|
-
title: /*#__PURE__*/React.createElement(Title, null, "\u6807\u8BC6"),
|
100
|
-
multiple: true,
|
101
|
-
titleWidth: 400,
|
102
|
-
contextMenuRender: contextMenuRender,
|
103
|
-
onContextMenuItemSelect: function onContextMenuItemSelect(node) {
|
104
|
-
console.log(node.key);
|
105
|
-
},
|
106
|
-
treeData: treeData,
|
107
|
-
columns: columns,
|
108
|
-
selectedKeys: selectedKeys,
|
109
|
-
expandedKeys: expandedKeys,
|
110
|
-
onSelect: function onSelect(selectedKeys) {
|
111
|
-
return setSelectedKeys(selectedKeys);
|
112
|
-
},
|
113
|
-
onExpand: function onExpand(expandedKeys) {
|
114
|
-
return setExpandedKeys(expandedKeys);
|
115
|
-
}
|
116
|
-
}));
|
117
|
-
});
|
File without changes
|