assui 3.2.67 → 3.2.68
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/button-drawer/index.d.ts +13 -5
- package/es/button-drawer/index.js +20 -20
- package/es/button-modal/index.d.ts +13 -5
- package/es/button-modal/index.js +19 -20
- package/es/index.d.ts +2 -0
- package/es/index.js +2 -1
- package/es/rc-split-view/DraggableHandle.d.ts +19 -0
- package/es/rc-split-view/DraggableHandle.js +37 -0
- package/es/rc-split-view/View.d.ts +13 -0
- package/es/rc-split-view/View.js +28 -0
- package/es/rc-split-view/demo/index.modules.less +9 -0
- package/es/rc-split-view/index.d.ts +65 -0
- package/es/rc-split-view/index.js +240 -0
- package/es/rc-split-view/style/index.css +76 -0
- package/es/rc-split-view/style/index.d.ts +1 -0
- package/es/rc-split-view/style/index.js +1 -0
- package/es/rc-split-view/style/index.less +92 -0
- package/es/rc-split-view/utils.d.ts +16 -0
- package/es/rc-split-view/utils.js +47 -0
- package/es/style/variables.less +1 -0
- package/lib/button-drawer/index.d.ts +13 -5
- package/lib/button-drawer/index.js +19 -19
- package/lib/button-modal/index.d.ts +13 -5
- package/lib/button-modal/index.js +19 -20
- package/lib/index.d.ts +2 -0
- package/lib/index.js +8 -0
- package/lib/rc-split-view/DraggableHandle.d.ts +19 -0
- package/lib/rc-split-view/DraggableHandle.js +47 -0
- package/lib/rc-split-view/View.d.ts +13 -0
- package/lib/rc-split-view/View.js +38 -0
- package/lib/rc-split-view/demo/index.modules.less +9 -0
- package/lib/rc-split-view/index.d.ts +65 -0
- package/lib/rc-split-view/index.js +251 -0
- package/lib/rc-split-view/style/index.css +76 -0
- package/lib/rc-split-view/style/index.d.ts +1 -0
- package/lib/rc-split-view/style/index.js +6 -0
- package/lib/rc-split-view/style/index.less +92 -0
- package/lib/rc-split-view/utils.d.ts +16 -0
- package/lib/rc-split-view/utils.js +62 -0
- package/lib/style/variables.less +1 -0
- package/package.json +2 -2
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
.split-view {
|
|
2
|
+
position: absolute;
|
|
3
|
+
display: flex;
|
|
4
|
+
flex: 1;
|
|
5
|
+
height: 100%;
|
|
6
|
+
overflow: hidden;
|
|
7
|
+
outline: none;
|
|
8
|
+
-moz-user-select: text;
|
|
9
|
+
-webkit-user-select: text;
|
|
10
|
+
user-select: text;
|
|
11
|
+
}
|
|
12
|
+
.split-view-horizontal {
|
|
13
|
+
top: 0;
|
|
14
|
+
bottom: 0;
|
|
15
|
+
flex-direction: column;
|
|
16
|
+
width: 100%;
|
|
17
|
+
min-height: 100%;
|
|
18
|
+
}
|
|
19
|
+
.split-view-vertical {
|
|
20
|
+
right: 0;
|
|
21
|
+
left: 0;
|
|
22
|
+
flex-direction: row;
|
|
23
|
+
}
|
|
24
|
+
.split-view-draggable-handle {
|
|
25
|
+
position: relative;
|
|
26
|
+
z-index: 1;
|
|
27
|
+
background-color: #f5f5f5;
|
|
28
|
+
}
|
|
29
|
+
.split-view-draggable-handle-horizontal {
|
|
30
|
+
justify-content: center;
|
|
31
|
+
height: 2px;
|
|
32
|
+
border-top: 1px solid transparent;
|
|
33
|
+
transform: translateY(-50%);
|
|
34
|
+
cursor: row-resize;
|
|
35
|
+
}
|
|
36
|
+
.split-view-draggable-handle-horizontal-content {
|
|
37
|
+
position: absolute;
|
|
38
|
+
top: 50%;
|
|
39
|
+
left: 0;
|
|
40
|
+
width: 100%;
|
|
41
|
+
min-height: 10px;
|
|
42
|
+
transform: translateY(calc(-50% - 1px));
|
|
43
|
+
}
|
|
44
|
+
.split-view-draggable-handle-horizontal:hover {
|
|
45
|
+
border-top-color: #02a6e3;
|
|
46
|
+
}
|
|
47
|
+
.split-view-draggable-handle-horizontal-disabled {
|
|
48
|
+
cursor: default;
|
|
49
|
+
}
|
|
50
|
+
.split-view-draggable-handle-horizontal-disabled:hover {
|
|
51
|
+
border-top-color: transparent;
|
|
52
|
+
}
|
|
53
|
+
.split-view-draggable-handle-vertical {
|
|
54
|
+
align-items: center;
|
|
55
|
+
width: 2px;
|
|
56
|
+
border-left: 1px solid transparent;
|
|
57
|
+
transform: translateX(-50%);
|
|
58
|
+
cursor: col-resize;
|
|
59
|
+
}
|
|
60
|
+
.split-view-draggable-handle-vertical-content {
|
|
61
|
+
position: absolute;
|
|
62
|
+
top: 0;
|
|
63
|
+
left: 50%;
|
|
64
|
+
min-width: 10px;
|
|
65
|
+
height: 100%;
|
|
66
|
+
transform: translateX(calc(-50% - 1px));
|
|
67
|
+
}
|
|
68
|
+
.split-view-draggable-handle-vertical:hover {
|
|
69
|
+
border-left-color: #02a6e3;
|
|
70
|
+
}
|
|
71
|
+
.split-view-draggable-handle-vertical-disabled {
|
|
72
|
+
cursor: default;
|
|
73
|
+
}
|
|
74
|
+
.split-view-draggable-handle-vertical-disabled:hover {
|
|
75
|
+
border-left-color: transparent;
|
|
76
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import './index.less';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import './index.less';
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
@import '../../style/variables.less';
|
|
2
|
+
|
|
3
|
+
.split-view {
|
|
4
|
+
position: absolute;
|
|
5
|
+
display: flex;
|
|
6
|
+
flex: 1;
|
|
7
|
+
height: 100%;
|
|
8
|
+
overflow: hidden;
|
|
9
|
+
outline: none;
|
|
10
|
+
-moz-user-select: text;
|
|
11
|
+
-webkit-user-select: text;
|
|
12
|
+
-ms-user-select: text;
|
|
13
|
+
user-select: text;
|
|
14
|
+
|
|
15
|
+
&-horizontal {
|
|
16
|
+
top: 0;
|
|
17
|
+
bottom: 0;
|
|
18
|
+
flex-direction: column;
|
|
19
|
+
width: 100%;
|
|
20
|
+
min-height: 100%;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
&-vertical {
|
|
24
|
+
right: 0;
|
|
25
|
+
left: 0;
|
|
26
|
+
flex-direction: row;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.split-view-draggable-handle {
|
|
31
|
+
position: relative;
|
|
32
|
+
z-index: 1;
|
|
33
|
+
background-color: @color_f5f5f5;
|
|
34
|
+
|
|
35
|
+
&-horizontal {
|
|
36
|
+
justify-content: center;
|
|
37
|
+
height: 2px;
|
|
38
|
+
border-top: 1px solid transparent;
|
|
39
|
+
transform: translateY(-50%);
|
|
40
|
+
cursor: row-resize;
|
|
41
|
+
|
|
42
|
+
&-content {
|
|
43
|
+
position: absolute;
|
|
44
|
+
top: 50%;
|
|
45
|
+
left: 0;
|
|
46
|
+
width: 100%;
|
|
47
|
+
min-height: 10px;
|
|
48
|
+
transform: translateY(calc(-50% - 1px));
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
&:hover {
|
|
52
|
+
border-top-color: @color_02a6e3;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&-disabled {
|
|
56
|
+
cursor: default;
|
|
57
|
+
|
|
58
|
+
&:hover {
|
|
59
|
+
border-top-color: transparent;
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
&-vertical {
|
|
65
|
+
align-items: center;
|
|
66
|
+
width: 2px;
|
|
67
|
+
border-left: 1px solid transparent;
|
|
68
|
+
transform: translateX(-50%);
|
|
69
|
+
cursor: col-resize;
|
|
70
|
+
|
|
71
|
+
&-content {
|
|
72
|
+
position: absolute;
|
|
73
|
+
top: 0;
|
|
74
|
+
left: 50%;
|
|
75
|
+
min-width: 10px;
|
|
76
|
+
height: 100%;
|
|
77
|
+
transform: translateX(calc(-50% - 1px));
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
&:hover {
|
|
81
|
+
border-left-color: @color_02a6e3;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
&-disabled {
|
|
85
|
+
cursor: default;
|
|
86
|
+
|
|
87
|
+
&:hover {
|
|
88
|
+
border-left-color: transparent;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { StatesTypes } from './index';
|
|
3
|
+
/** 获取默认尺寸 */
|
|
4
|
+
export declare const getDefaultSize: (defaultSize: number | string | undefined, minSize: number | undefined, maxSize: number | undefined, draggedSize?: number) => string | number | undefined;
|
|
5
|
+
/** 获取更新尺寸 */
|
|
6
|
+
export declare const getSizeUpdate: (props: {
|
|
7
|
+
size?: string | number;
|
|
8
|
+
defaultSize?: string | number;
|
|
9
|
+
minSize?: number;
|
|
10
|
+
maxSize?: number;
|
|
11
|
+
primary: "first" | "second";
|
|
12
|
+
}, state: StatesTypes) => any;
|
|
13
|
+
/** 排除空的子元素 */
|
|
14
|
+
export declare const removeNullChildren: (children: React.ReactNode) => (string | number | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | React.ReactPortal)[];
|
|
15
|
+
/** 失去焦点 */
|
|
16
|
+
export declare const unFocus: (document: Document, window: Window) => void;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import isUndefined from 'lodash/isUndefined';
|
|
3
|
+
import isNumber from 'lodash/isNumber';
|
|
4
|
+
/** 获取默认尺寸 */
|
|
5
|
+
export var getDefaultSize = function getDefaultSize(defaultSize, minSize, maxSize, draggedSize) {
|
|
6
|
+
if (isNumber(draggedSize)) {
|
|
7
|
+
var min = isNumber(minSize) ? minSize : 0;
|
|
8
|
+
var max = isNumber(maxSize) && maxSize >= 0 ? maxSize : Infinity;
|
|
9
|
+
return Math.max(min, Math.min(max, draggedSize));
|
|
10
|
+
}
|
|
11
|
+
if (!isUndefined(defaultSize)) {
|
|
12
|
+
return defaultSize;
|
|
13
|
+
}
|
|
14
|
+
return minSize;
|
|
15
|
+
};
|
|
16
|
+
/** 获取更新尺寸 */
|
|
17
|
+
export var getSizeUpdate = function getSizeUpdate(props, state) {
|
|
18
|
+
var newState = {};
|
|
19
|
+
var instanceProps = state.instanceProps;
|
|
20
|
+
var hasSize = !isUndefined(props.size);
|
|
21
|
+
if (instanceProps.size === props.size && hasSize) {
|
|
22
|
+
return {};
|
|
23
|
+
}
|
|
24
|
+
var newSize = hasSize ? props.size : getDefaultSize(props.defaultSize, props.minSize, props.maxSize, state.draggedSize);
|
|
25
|
+
if (hasSize) {
|
|
26
|
+
newState.draggedSize = newSize;
|
|
27
|
+
}
|
|
28
|
+
var isFirstViewPrimary = props.primary === 'first';
|
|
29
|
+
newState[isFirstViewPrimary ? 'firstViewSize' : 'secondViewSize'] = newSize;
|
|
30
|
+
newState[isFirstViewPrimary ? 'secondViewSize' : 'firstViewSize'] = undefined;
|
|
31
|
+
newState.instanceProps = {
|
|
32
|
+
size: props.size
|
|
33
|
+
};
|
|
34
|
+
return newState;
|
|
35
|
+
};
|
|
36
|
+
/** 排除空的子元素 */
|
|
37
|
+
export var removeNullChildren = function removeNullChildren(children) {
|
|
38
|
+
return React.Children.toArray(children).filter(function (c) {
|
|
39
|
+
return c;
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
/** 失去焦点 */
|
|
43
|
+
export var unFocus = function unFocus(document, window) {
|
|
44
|
+
var _a, _b;
|
|
45
|
+
(_a = document.getSelection()) === null || _a === void 0 ? void 0 : _a.empty();
|
|
46
|
+
(_b = window.getSelection()) === null || _b === void 0 ? void 0 : _b.removeAllRanges();
|
|
47
|
+
};
|
package/es/style/variables.less
CHANGED
|
@@ -4,11 +4,19 @@ export type DrawerAction = {
|
|
|
4
4
|
close: () => void;
|
|
5
5
|
open: () => void;
|
|
6
6
|
};
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
type ControlledProps = {
|
|
8
|
+
open: boolean;
|
|
9
|
+
onOpen?: () => void;
|
|
10
|
+
onClose: () => void;
|
|
11
|
+
};
|
|
12
|
+
type UncontrolledProps = {
|
|
9
13
|
onOpen?: () => void;
|
|
10
|
-
|
|
14
|
+
onClose?: () => void;
|
|
15
|
+
};
|
|
16
|
+
export interface BaseButtonDrawerProps extends Omit<DrawerProps, 'children'> {
|
|
17
|
+
trigger?: ((fun: () => void) => React.ReactElement) | React.ReactElement;
|
|
11
18
|
children: ((v: DrawerAction) => React.ReactElement) | React.ReactElement;
|
|
12
19
|
}
|
|
13
|
-
|
|
14
|
-
|
|
20
|
+
export type ButtonDrawerProps = (BaseButtonDrawerProps & ControlledProps) | (BaseButtonDrawerProps & UncontrolledProps);
|
|
21
|
+
declare const ButtonDrawer: (props: ButtonDrawerProps) => JSX.Element;
|
|
22
|
+
export default ButtonDrawer;
|
|
@@ -84,10 +84,8 @@ var drawer_1 = __importDefault(require("antd/lib/drawer"));
|
|
|
84
84
|
var isFunction_1 = __importDefault(require("lodash/isFunction"));
|
|
85
85
|
var classnames_1 = __importDefault(require("classnames"));
|
|
86
86
|
var CloseOutlined_1 = __importDefault(require("a-icons/lib/CloseOutlined"));
|
|
87
|
-
var
|
|
88
|
-
|
|
89
|
-
drawerVisible = _a[0],
|
|
90
|
-
setDrawerVisible = _a[1];
|
|
87
|
+
var ahooks_1 = require("ahooks");
|
|
88
|
+
var ButtonDrawer = function ButtonDrawer(props) {
|
|
91
89
|
var children = props.children,
|
|
92
90
|
onOpen = props.onOpen,
|
|
93
91
|
onClose = props.onClose,
|
|
@@ -95,16 +93,17 @@ var ButtonDrawer = function ButtonDrawer(props, ref) {
|
|
|
95
93
|
title = props.title,
|
|
96
94
|
className = props.className,
|
|
97
95
|
restProps = __rest(props, ["children", "onOpen", "onClose", "trigger", "title", "className"]);
|
|
96
|
+
var _a = __read((0, ahooks_1.useControllableValue)(props, {
|
|
97
|
+
valuePropName: 'open'
|
|
98
|
+
}), 2),
|
|
99
|
+
drawerVisible = _a[0],
|
|
100
|
+
setDrawerVisible = _a[1];
|
|
98
101
|
var closeDrawer = function closeDrawer() {
|
|
99
|
-
|
|
100
|
-
onClose();
|
|
101
|
-
}
|
|
102
|
+
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
102
103
|
setDrawerVisible(false);
|
|
103
104
|
};
|
|
104
105
|
var openDrawer = function openDrawer() {
|
|
105
|
-
|
|
106
|
-
onOpen();
|
|
107
|
-
}
|
|
106
|
+
onOpen === null || onOpen === void 0 ? void 0 : onOpen();
|
|
108
107
|
setDrawerVisible(true);
|
|
109
108
|
};
|
|
110
109
|
var actionRef = (0, react_1.useRef)({
|
|
@@ -115,13 +114,15 @@ var ButtonDrawer = function ButtonDrawer(props, ref) {
|
|
|
115
114
|
openDrawer();
|
|
116
115
|
}
|
|
117
116
|
});
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
117
|
+
var triggerNode;
|
|
118
|
+
if ((0, isFunction_1["default"])(trigger)) {
|
|
119
|
+
triggerNode = trigger(openDrawer);
|
|
120
|
+
} else {
|
|
121
|
+
triggerNode = trigger && react_1["default"].cloneElement(trigger, {
|
|
122
|
+
onClick: openDrawer
|
|
123
|
+
});
|
|
124
|
+
}
|
|
125
|
+
return react_1["default"].createElement(react_1["default"].Fragment, null, triggerNode, react_1["default"].createElement(drawer_1["default"], __assign({
|
|
125
126
|
maskClosable: false,
|
|
126
127
|
className: (0, classnames_1["default"])('button-drawer', className),
|
|
127
128
|
title: title,
|
|
@@ -132,5 +133,4 @@ var ButtonDrawer = function ButtonDrawer(props, ref) {
|
|
|
132
133
|
drawerAction: actionRef.current
|
|
133
134
|
})));
|
|
134
135
|
};
|
|
135
|
-
|
|
136
|
-
exports["default"] = ForwardRefButtonDrawer;
|
|
136
|
+
exports["default"] = ButtonDrawer;
|
|
@@ -4,11 +4,19 @@ export interface ModalAction {
|
|
|
4
4
|
open: () => void;
|
|
5
5
|
close: () => void;
|
|
6
6
|
}
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
type ControlledProps = {
|
|
8
|
+
open: boolean;
|
|
9
|
+
onOpen?: () => void;
|
|
10
|
+
onClose: () => void;
|
|
11
|
+
};
|
|
12
|
+
type UncontrolledProps = {
|
|
9
13
|
onOpen?: () => void;
|
|
10
|
-
|
|
14
|
+
onClose?: () => void;
|
|
15
|
+
};
|
|
16
|
+
export interface BaseButtonModalProps extends Omit<ModalProps, 'children'> {
|
|
17
|
+
trigger?: ((fun: () => void) => React.ReactElement) | React.ReactElement;
|
|
11
18
|
children: ((v: ModalAction) => React.ReactElement) | React.ReactElement;
|
|
12
19
|
}
|
|
13
|
-
|
|
14
|
-
|
|
20
|
+
export type ButtonModalProps = (BaseButtonModalProps & ControlledProps) | (BaseButtonModalProps & UncontrolledProps);
|
|
21
|
+
declare const ButtonModal: (props: ButtonModalProps) => JSX.Element;
|
|
22
|
+
export default ButtonModal;
|
|
@@ -83,10 +83,8 @@ var React = __importStar(require("react"));
|
|
|
83
83
|
var isFunction_1 = __importDefault(require("lodash/isFunction"));
|
|
84
84
|
var modal_1 = __importDefault(require("antd/lib/modal"));
|
|
85
85
|
var CloseOutlined_1 = __importDefault(require("a-icons/lib/CloseOutlined"));
|
|
86
|
-
var
|
|
87
|
-
|
|
88
|
-
visible = _a[0],
|
|
89
|
-
setModalVisible = _a[1];
|
|
86
|
+
var ahooks_1 = require("ahooks");
|
|
87
|
+
var ButtonModal = function ButtonModal(props) {
|
|
90
88
|
var children = props.children,
|
|
91
89
|
trigger = props.trigger,
|
|
92
90
|
onOpen = props.onOpen,
|
|
@@ -94,6 +92,11 @@ var ButtonModal = function ButtonModal(props, ref) {
|
|
|
94
92
|
onOk = props.onOk,
|
|
95
93
|
onCancel = props.onCancel,
|
|
96
94
|
restModalProps = __rest(props, ["children", "trigger", "onOpen", "onClose", "onOk", "onCancel"]);
|
|
95
|
+
var _a = __read((0, ahooks_1.useControllableValue)(props, {
|
|
96
|
+
valuePropName: 'open'
|
|
97
|
+
}), 2),
|
|
98
|
+
visible = _a[0],
|
|
99
|
+
setModalVisible = _a[1];
|
|
97
100
|
var openModal = function openModal() {
|
|
98
101
|
setModalVisible(true);
|
|
99
102
|
onOpen === null || onOpen === void 0 ? void 0 : onOpen();
|
|
@@ -106,26 +109,23 @@ var ButtonModal = function ButtonModal(props, ref) {
|
|
|
106
109
|
open: openModal,
|
|
107
110
|
close: closeModal
|
|
108
111
|
});
|
|
109
|
-
React.useImperativeHandle(ref, function () {
|
|
110
|
-
return modalActionRef.current;
|
|
111
|
-
});
|
|
112
112
|
var handleModalOk = function handleModalOk(e) {
|
|
113
|
-
|
|
114
|
-
return onOk(e);
|
|
115
|
-
}
|
|
113
|
+
onOk === null || onOk === void 0 ? void 0 : onOk(e);
|
|
116
114
|
closeModal();
|
|
117
|
-
return null;
|
|
118
115
|
};
|
|
119
116
|
var handleModalCancel = function handleModalCancel(e) {
|
|
120
|
-
|
|
121
|
-
onCancel(e);
|
|
122
|
-
}
|
|
117
|
+
onCancel === null || onCancel === void 0 ? void 0 : onCancel(e);
|
|
123
118
|
closeModal();
|
|
124
119
|
};
|
|
125
|
-
var
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
120
|
+
var triggerNode;
|
|
121
|
+
if ((0, isFunction_1["default"])(trigger)) {
|
|
122
|
+
triggerNode = trigger(openModal);
|
|
123
|
+
} else {
|
|
124
|
+
triggerNode = trigger && React.cloneElement(trigger, {
|
|
125
|
+
onClick: openModal
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
return React.createElement(React.Fragment, null, triggerNode, React.createElement(modal_1["default"], __assign({
|
|
129
129
|
open: visible,
|
|
130
130
|
onOk: handleModalOk,
|
|
131
131
|
onCancel: handleModalCancel,
|
|
@@ -136,5 +136,4 @@ var ButtonModal = function ButtonModal(props, ref) {
|
|
|
136
136
|
modalAction: modalActionRef.current
|
|
137
137
|
})));
|
|
138
138
|
};
|
|
139
|
-
|
|
140
|
-
exports["default"] = ForwardRefButtonModal;
|
|
139
|
+
exports["default"] = ButtonModal;
|
package/lib/index.d.ts
CHANGED
|
@@ -94,3 +94,5 @@ export { default as SignaturePad } from './signature-pad';
|
|
|
94
94
|
export type { SignaturePadProps } from './signature-pad';
|
|
95
95
|
export { default as MultiLineEllipsisText } from './multi-line-ellipsis-text';
|
|
96
96
|
export type { MultiLineEllipsisTextProps } from './multi-line-ellipsis-text';
|
|
97
|
+
export type { RcSplitViewProps } from './rc-split-view';
|
|
98
|
+
export { default as RcSplitView } from './rc-split-view';
|
package/lib/index.js
CHANGED
|
@@ -9,6 +9,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
9
9
|
value: true
|
|
10
10
|
});
|
|
11
11
|
exports.MultiLineEllipsisText = exports.SignaturePad = exports.ConditionSelect = exports.CountUp = exports.CountDown = exports.ComplexValSelect = exports.MultipartUpload = exports.LabelConditionSelectInput = exports.Flex = exports.Resizable = exports.RichTextEditor = exports.BeautifulDnd = exports.LabelCustomizeRangePicker = exports.TableCol = exports.LabelTreeSelect = exports.LabelConditionInput = exports.LabelNumberInput = exports.LabelAutoComplete = exports.LabelDatePicker = exports.LabelRangePicker = exports.JsonEditor = exports.AreaText = exports.LabelTextArea = exports.ASelect = exports.LabelSelect = exports.ColorSelect = exports.LabelInput = exports.TextInput = exports.TextArea = exports.SplitPane = exports.sortableHoc = exports.SingleImgUpload = exports.RcTransitionGroup = exports.RcQRcode = exports.RcEchart = exports.StepNumberInput = exports.LabelRangeNumber = exports.NumberInput = exports.RcMotion = exports.KeepTab = exports.ImgCrop = exports.HighlightWords = exports.HighlightTextarea = exports.CopyToClipboard = exports.NumberFormatInput = exports.ConfigProvider = exports.ConditionSelectInput = exports.ConditionInput = exports.ButtonModal = exports.ButtonDrawer = void 0;
|
|
12
|
+
exports.RcSplitView = void 0;
|
|
12
13
|
var button_drawer_1 = require("./button-drawer");
|
|
13
14
|
Object.defineProperty(exports, "ButtonDrawer", {
|
|
14
15
|
enumerable: true,
|
|
@@ -358,4 +359,11 @@ Object.defineProperty(exports, "MultiLineEllipsisText", {
|
|
|
358
359
|
get: function get() {
|
|
359
360
|
return __importDefault(multi_line_ellipsis_text_1)["default"];
|
|
360
361
|
}
|
|
362
|
+
});
|
|
363
|
+
var rc_split_view_1 = require("./rc-split-view");
|
|
364
|
+
Object.defineProperty(exports, "RcSplitView", {
|
|
365
|
+
enumerable: true,
|
|
366
|
+
get: function get() {
|
|
367
|
+
return __importDefault(rc_split_view_1)["default"];
|
|
368
|
+
}
|
|
361
369
|
});
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface DraggableHandleProps {
|
|
3
|
+
/** 组件样式 */
|
|
4
|
+
className: string;
|
|
5
|
+
/** 点击回调 */
|
|
6
|
+
onClick?: (value: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
|
|
7
|
+
/** 双击回调 */
|
|
8
|
+
onDoubleClick?: (value: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
|
|
9
|
+
/** 按下鼠标按钮回调 */
|
|
10
|
+
onMouseDown: (value: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
|
|
11
|
+
/** 事件在一个或多个触点与触控设备表面接触时被触发 */
|
|
12
|
+
onTouchStart: (value: React.TouchEvent<HTMLSpanElement>) => void;
|
|
13
|
+
/** 事件在一个或多个触点从触控平面上移开时触发 */
|
|
14
|
+
onTouchEnd: (value: React.TouchEvent<HTMLSpanElement>) => void;
|
|
15
|
+
/** 子元素 */
|
|
16
|
+
children?: React.ReactNode;
|
|
17
|
+
}
|
|
18
|
+
declare const DraggableHandle: React.FC<DraggableHandleProps>;
|
|
19
|
+
export default DraggableHandle;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var __importDefault = this && this.__importDefault || function (mod) {
|
|
4
|
+
return mod && mod.__esModule ? mod : {
|
|
5
|
+
"default": mod
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
Object.defineProperty(exports, "__esModule", {
|
|
9
|
+
value: true
|
|
10
|
+
});
|
|
11
|
+
var react_1 = __importDefault(require("react"));
|
|
12
|
+
var DraggableHandle = function DraggableHandle(props) {
|
|
13
|
+
var className = props.className,
|
|
14
|
+
_onClick = props.onClick,
|
|
15
|
+
_onDoubleClick = props.onDoubleClick,
|
|
16
|
+
_onMouseDown = props.onMouseDown,
|
|
17
|
+
_onTouchEnd = props.onTouchEnd,
|
|
18
|
+
_onTouchStart = props.onTouchStart,
|
|
19
|
+
children = props.children;
|
|
20
|
+
return react_1["default"].createElement("div", {
|
|
21
|
+
className: className,
|
|
22
|
+
onMouseDown: function onMouseDown(event) {
|
|
23
|
+
return _onMouseDown(event);
|
|
24
|
+
},
|
|
25
|
+
onTouchStart: function onTouchStart(event) {
|
|
26
|
+
event.preventDefault();
|
|
27
|
+
_onTouchStart(event);
|
|
28
|
+
},
|
|
29
|
+
onTouchEnd: function onTouchEnd(event) {
|
|
30
|
+
event.preventDefault();
|
|
31
|
+
_onTouchEnd(event);
|
|
32
|
+
},
|
|
33
|
+
onClick: function onClick(event) {
|
|
34
|
+
if (_onClick) {
|
|
35
|
+
event.preventDefault();
|
|
36
|
+
_onClick(event);
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
onDoubleClick: function onDoubleClick(event) {
|
|
40
|
+
if (_onDoubleClick) {
|
|
41
|
+
event.preventDefault();
|
|
42
|
+
_onDoubleClick(event);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
}, children);
|
|
46
|
+
};
|
|
47
|
+
exports["default"] = DraggableHandle;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface ViewProps {
|
|
3
|
+
/** 子元素 */
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
/** 样式 */
|
|
6
|
+
className?: string;
|
|
7
|
+
/** 拆分方式 */
|
|
8
|
+
split: 'vertical' | 'horizontal';
|
|
9
|
+
/** 大小 */
|
|
10
|
+
size?: string | number;
|
|
11
|
+
}
|
|
12
|
+
declare const View: React.ForwardRefExoticComponent<ViewProps & React.RefAttributes<HTMLDivElement>>;
|
|
13
|
+
export default View;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var __importDefault = this && this.__importDefault || function (mod) {
|
|
4
|
+
return mod && mod.__esModule ? mod : {
|
|
5
|
+
"default": mod
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
Object.defineProperty(exports, "__esModule", {
|
|
9
|
+
value: true
|
|
10
|
+
});
|
|
11
|
+
var react_1 = __importDefault(require("react"));
|
|
12
|
+
var isUndefined_1 = __importDefault(require("lodash/isUndefined"));
|
|
13
|
+
var View = react_1["default"].forwardRef(function (props, ref) {
|
|
14
|
+
var children = props.children,
|
|
15
|
+
className = props.className,
|
|
16
|
+
split = props.split,
|
|
17
|
+
size = props.size;
|
|
18
|
+
var viewStyle = {
|
|
19
|
+
flex: 1,
|
|
20
|
+
position: 'relative',
|
|
21
|
+
outline: 'none'
|
|
22
|
+
};
|
|
23
|
+
if (!(0, isUndefined_1["default"])(size)) {
|
|
24
|
+
if (split === 'vertical') {
|
|
25
|
+
viewStyle.width = size;
|
|
26
|
+
} else {
|
|
27
|
+
viewStyle.height = size;
|
|
28
|
+
viewStyle.display = 'flex';
|
|
29
|
+
}
|
|
30
|
+
viewStyle.flex = 'none';
|
|
31
|
+
}
|
|
32
|
+
return react_1["default"].createElement("div", {
|
|
33
|
+
ref: ref,
|
|
34
|
+
className: className,
|
|
35
|
+
style: viewStyle
|
|
36
|
+
}, children);
|
|
37
|
+
});
|
|
38
|
+
exports["default"] = View;
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import View from './View';
|
|
3
|
+
export { View };
|
|
4
|
+
export interface RcSplitViewProps {
|
|
5
|
+
/** 是否允许拖动 */
|
|
6
|
+
draggable?: boolean;
|
|
7
|
+
/** children */
|
|
8
|
+
children: React.ReactNode;
|
|
9
|
+
/** 自定义组件类名 */
|
|
10
|
+
className?: string;
|
|
11
|
+
/** 拖拽条单击回调 */
|
|
12
|
+
onResizerClick?: (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
|
|
13
|
+
/** 拖拽条双击回调 */
|
|
14
|
+
onResizerDoubleClick?: (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
|
|
15
|
+
/** 面板样式 */
|
|
16
|
+
viewClassName?: string;
|
|
17
|
+
/** 第一个面板样式 */
|
|
18
|
+
firstViewClassName?: string;
|
|
19
|
+
/** 第二个面板样式 */
|
|
20
|
+
secondViewClassName?: string;
|
|
21
|
+
/** 分隔条样式 */
|
|
22
|
+
handleClassName?: string;
|
|
23
|
+
/** 分隔条内容样式 */
|
|
24
|
+
handleContentClassName?: string;
|
|
25
|
+
/** 拆分方式 */
|
|
26
|
+
split?: 'vertical' | 'horizontal';
|
|
27
|
+
/** 拖拽过程回调 */
|
|
28
|
+
onChange?: (newSize: number) => void;
|
|
29
|
+
/** 拖拽开始回调 */
|
|
30
|
+
onDragStarted?: () => void;
|
|
31
|
+
/** 拖拽完成回调 */
|
|
32
|
+
onDragFinished?: (newSize: number) => void;
|
|
33
|
+
/** 主体窗口 */
|
|
34
|
+
primary?: 'first' | 'second';
|
|
35
|
+
/** 拖动固定步进值 */
|
|
36
|
+
step?: number;
|
|
37
|
+
/** 最大窗口大小 */
|
|
38
|
+
maxSize?: number;
|
|
39
|
+
/** 最小窗口大小 */
|
|
40
|
+
minSize?: number;
|
|
41
|
+
/** 窗口大小 */
|
|
42
|
+
size?: string | number;
|
|
43
|
+
/** 默认窗口大小 */
|
|
44
|
+
defaultSize?: string | number;
|
|
45
|
+
/** 分隔条内容 */
|
|
46
|
+
handleContent?: React.ReactNode;
|
|
47
|
+
}
|
|
48
|
+
export type StatesTypes = {
|
|
49
|
+
/** 激活 */
|
|
50
|
+
active: boolean;
|
|
51
|
+
/** 位置 */
|
|
52
|
+
position: number;
|
|
53
|
+
/** 拖拽尺寸 */
|
|
54
|
+
draggedSize?: number;
|
|
55
|
+
/** 实例参数 */
|
|
56
|
+
instanceProps: {
|
|
57
|
+
size?: string | number;
|
|
58
|
+
};
|
|
59
|
+
/** 第一面板的尺寸 */
|
|
60
|
+
firstViewSize?: number | string;
|
|
61
|
+
/** 第二面板的尺寸 */
|
|
62
|
+
secondViewSize?: number | string;
|
|
63
|
+
};
|
|
64
|
+
declare const RcSplitView: React.FC<RcSplitViewProps>;
|
|
65
|
+
export default RcSplitView;
|