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.
Files changed (41) hide show
  1. package/es/button-drawer/index.d.ts +13 -5
  2. package/es/button-drawer/index.js +20 -20
  3. package/es/button-modal/index.d.ts +13 -5
  4. package/es/button-modal/index.js +19 -20
  5. package/es/index.d.ts +2 -0
  6. package/es/index.js +2 -1
  7. package/es/rc-split-view/DraggableHandle.d.ts +19 -0
  8. package/es/rc-split-view/DraggableHandle.js +37 -0
  9. package/es/rc-split-view/View.d.ts +13 -0
  10. package/es/rc-split-view/View.js +28 -0
  11. package/es/rc-split-view/demo/index.modules.less +9 -0
  12. package/es/rc-split-view/index.d.ts +65 -0
  13. package/es/rc-split-view/index.js +240 -0
  14. package/es/rc-split-view/style/index.css +76 -0
  15. package/es/rc-split-view/style/index.d.ts +1 -0
  16. package/es/rc-split-view/style/index.js +1 -0
  17. package/es/rc-split-view/style/index.less +92 -0
  18. package/es/rc-split-view/utils.d.ts +16 -0
  19. package/es/rc-split-view/utils.js +47 -0
  20. package/es/style/variables.less +1 -0
  21. package/lib/button-drawer/index.d.ts +13 -5
  22. package/lib/button-drawer/index.js +19 -19
  23. package/lib/button-modal/index.d.ts +13 -5
  24. package/lib/button-modal/index.js +19 -20
  25. package/lib/index.d.ts +2 -0
  26. package/lib/index.js +8 -0
  27. package/lib/rc-split-view/DraggableHandle.d.ts +19 -0
  28. package/lib/rc-split-view/DraggableHandle.js +47 -0
  29. package/lib/rc-split-view/View.d.ts +13 -0
  30. package/lib/rc-split-view/View.js +38 -0
  31. package/lib/rc-split-view/demo/index.modules.less +9 -0
  32. package/lib/rc-split-view/index.d.ts +65 -0
  33. package/lib/rc-split-view/index.js +251 -0
  34. package/lib/rc-split-view/style/index.css +76 -0
  35. package/lib/rc-split-view/style/index.d.ts +1 -0
  36. package/lib/rc-split-view/style/index.js +6 -0
  37. package/lib/rc-split-view/style/index.less +92 -0
  38. package/lib/rc-split-view/utils.d.ts +16 -0
  39. package/lib/rc-split-view/utils.js +62 -0
  40. package/lib/style/variables.less +1 -0
  41. 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
+ };
@@ -23,6 +23,7 @@
23
23
  @color_bfbfbf: #bfbfbf;
24
24
  @color_d4d4d4: #d4d4d4;
25
25
  @color_9f9f9f: #9f9f9f;
26
+ @color_02a6e3: #02a6e3;
26
27
 
27
28
  @font-size-sm: 12px;
28
29
  @font-size-base: 14px;
@@ -4,11 +4,19 @@ export type DrawerAction = {
4
4
  close: () => void;
5
5
  open: () => void;
6
6
  };
7
- export interface ButtonDrawerProps extends Omit<DrawerProps, 'children'> {
8
- onClose?: () => void;
7
+ type ControlledProps = {
8
+ open: boolean;
9
+ onOpen?: () => void;
10
+ onClose: () => void;
11
+ };
12
+ type UncontrolledProps = {
9
13
  onOpen?: () => void;
10
- trigger: React.ReactElement;
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
- declare const ForwardRefButtonDrawer: React.ForwardRefExoticComponent<ButtonDrawerProps & React.RefAttributes<unknown>>;
14
- export default ForwardRefButtonDrawer;
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 ButtonDrawer = function ButtonDrawer(props, ref) {
88
- var _a = __read((0, react_1.useState)(false), 2),
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
- if (onClose) {
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
- if (onOpen) {
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
- (0, react_1.useImperativeHandle)(ref, function () {
119
- return actionRef.current;
120
- });
121
- var buttonNode = trigger && react_1["default"].cloneElement(trigger, {
122
- onClick: openDrawer
123
- });
124
- return react_1["default"].createElement(react_1["default"].Fragment, null, buttonNode, react_1["default"].createElement(drawer_1["default"], __assign({
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
- var ForwardRefButtonDrawer = react_1["default"].forwardRef(ButtonDrawer);
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
- export interface ButtonModalProps extends Omit<ModalProps, 'children'> {
8
- onClose?: () => void;
7
+ type ControlledProps = {
8
+ open: boolean;
9
+ onOpen?: () => void;
10
+ onClose: () => void;
11
+ };
12
+ type UncontrolledProps = {
9
13
  onOpen?: () => void;
10
- trigger?: React.ReactElement;
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
- declare const ForwardRefButtonModal: React.ForwardRefExoticComponent<ButtonModalProps & React.RefAttributes<unknown>>;
14
- export default ForwardRefButtonModal;
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 ButtonModal = function ButtonModal(props, ref) {
87
- var _a = __read(React.useState(false), 2),
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
- if (onOk) {
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
- if (onCancel) {
121
- onCancel(e);
122
- }
117
+ onCancel === null || onCancel === void 0 ? void 0 : onCancel(e);
123
118
  closeModal();
124
119
  };
125
- var buttonNode = trigger && React.cloneElement(trigger, {
126
- onClick: openModal
127
- });
128
- return React.createElement(React.Fragment, null, buttonNode, React.createElement(modal_1["default"], __assign({
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
- var ForwardRefButtonModal = React.forwardRef(ButtonModal);
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,9 @@
1
+ .handle {
2
+ position: absolute;
3
+ top: 50%;
4
+ left: 5px;
5
+ width: 4px;
6
+ height: 40px;
7
+ background-color: red;
8
+ transform: translateY(-50%);
9
+ }
@@ -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;