assui 3.2.67 → 3.2.69

package/es/button-drawer/index.d.ts

@@ -7,8 +7,8 @@ export type DrawerAction = {
 export interface ButtonDrawerProps extends Omit<DrawerProps, 'children'> {
     onClose?: () => void;
     onOpen?: () => void;
-    trigger: React.ReactElement;
+    trigger?: ((fun: () => void) => React.ReactElement) | React.ReactElement;
     children: ((v: DrawerAction) => React.ReactElement) | React.ReactElement;
 }
-declare const ForwardRefButtonDrawer: React.ForwardRefExoticComponent<ButtonDrawerProps & React.RefAttributes<unknown>>;
+declare const ForwardRefButtonDrawer: React.ForwardRefExoticComponent<ButtonDrawerProps & React.RefAttributes<DrawerAction>>;
 export default ForwardRefButtonDrawer;

package/es/button-drawer/index.js

@@ -38,13 +38,17 @@ var __read = this && this.__read || function (o, n) {
   }
   return ar;
 };
-import React, { useState, useRef, useImperativeHandle } from 'react';
+import React, { useRef, useImperativeHandle } from 'react';
 import Drawer from "antd/es/drawer";
 import isFunction from 'lodash/isFunction';
 import classNames from 'classnames';
 import CloseOutlined from "a-icons/es/CloseOutlined";
+import { useControllableValue } from 'ahooks';
 var ButtonDrawer = function ButtonDrawer(props, ref) {
-  var _a = __read(useState(false), 2),
+  var _a = __read(useControllableValue(props, {
+      valuePropName: 'open',
+      defaultValue: false
+    }), 2),
     drawerVisible = _a[0],
     setDrawerVisible = _a[1];
   var children = props.children,
@@ -55,32 +59,29 @@ var ButtonDrawer = function ButtonDrawer(props, ref) {
     className = props.className,
     restProps = __rest(props, ["children", "onOpen", "onClose", "trigger", "title", "className"]);
   var closeDrawer = function closeDrawer() {
-    if (onClose) {
-      onClose();
-    }
     setDrawerVisible(false);
+    onClose === null || onClose === void 0 ? void 0 : onClose();
   };
   var openDrawer = function openDrawer() {
-    if (onOpen) {
-      onOpen();
-    }
     setDrawerVisible(true);
+    onOpen === null || onOpen === void 0 ? void 0 : onOpen();
   };
   var actionRef = useRef({
-    close: function close() {
-      closeDrawer();
-    },
-    open: function open() {
-      openDrawer();
-    }
+    open: openDrawer,
+    close: closeDrawer
   });
   useImperativeHandle(ref, function () {
     return actionRef.current;
   });
-  var buttonNode = trigger && /*#__PURE__*/React.cloneElement(trigger, {
-    onClick: openDrawer
-  });
-  return /*#__PURE__*/React.createElement(React.Fragment, null, buttonNode, /*#__PURE__*/React.createElement(Drawer, __assign({
+  var triggerNode;
+  if (isFunction(trigger)) {
+    triggerNode = trigger(openDrawer);
+  } else {
+    triggerNode = trigger && /*#__PURE__*/React.cloneElement(trigger, {
+      onClick: openDrawer
+    });
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, triggerNode, /*#__PURE__*/React.createElement(Drawer, __assign({
     maskClosable: false,
     className: classNames('button-drawer', className),
     title: title,

package/es/button-modal/index.d.ts

@@ -7,8 +7,8 @@ export interface ModalAction {
 export interface ButtonModalProps extends Omit<ModalProps, 'children'> {
     onClose?: () => void;
     onOpen?: () => void;
-    trigger?: React.ReactElement;
+    trigger?: ((fun: () => void) => React.ReactElement) | React.ReactElement;
     children: ((v: ModalAction) => React.ReactElement) | React.ReactElement;
 }
-declare const ForwardRefButtonModal: React.ForwardRefExoticComponent<ButtonModalProps & React.RefAttributes<unknown>>;
+declare const ForwardRefButtonModal: React.ForwardRefExoticComponent<ButtonModalProps & React.RefAttributes<ModalAction>>;
 export default ForwardRefButtonModal;

package/es/button-modal/index.js

@@ -42,8 +42,12 @@ import * as React from 'react';
 import isFunction from 'lodash/isFunction';
 import Modal from "antd/es/modal";
 import CloseOutlined from "a-icons/es/CloseOutlined";
+import { useControllableValue } from 'ahooks';
 var ButtonModal = function ButtonModal(props, ref) {
-  var _a = __read(React.useState(false), 2),
+  var _a = __read(useControllableValue(props, {
+      valuePropName: 'open',
+      defaultValue: false
+    }), 2),
     visible = _a[0],
     setModalVisible = _a[1];
   var children = props.children,
@@ -69,22 +73,22 @@ var ButtonModal = function ButtonModal(props, ref) {
     return modalActionRef.current;
   });
   var handleModalOk = function handleModalOk(e) {
-    if (onOk) {
-      return onOk(e);
-    }
+    onOk === null || onOk === void 0 ? void 0 : onOk(e);
     closeModal();
-    return null;
   };
   var handleModalCancel = function handleModalCancel(e) {
-    if (onCancel) {
-      onCancel(e);
-    }
+    onCancel === null || onCancel === void 0 ? void 0 : onCancel(e);
     closeModal();
   };
-  var buttonNode = trigger && /*#__PURE__*/React.cloneElement(trigger, {
-    onClick: openModal
-  });
-  return /*#__PURE__*/React.createElement(React.Fragment, null, buttonNode, /*#__PURE__*/React.createElement(Modal, __assign({
+  var triggerNode;
+  if (isFunction(trigger)) {
+    triggerNode = trigger(openModal);
+  } else {
+    triggerNode = trigger && /*#__PURE__*/React.cloneElement(trigger, {
+      onClick: openModal
+    });
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, triggerNode, /*#__PURE__*/React.createElement(Modal, __assign({
     open: visible,
     onOk: handleModalOk,
     onCancel: handleModalCancel,

package/es/index.d.ts

@@ -94,3 +94,5 @@ export { default as SignaturePad } from './signature-pad';
 export type { SignaturePadProps } from './signature-pad';
 export { default as MultiLineEllipsisText } from './multi-line-ellipsis-text';
 export type { MultiLineEllipsisTextProps } from './multi-line-ellipsis-text';
+export type { RcSplitViewProps } from './rc-split-view';
+export { default as RcSplitView } from './rc-split-view';

package/es/index.js

@@ -47,4 +47,5 @@ export { default as CountDown } from './count-down';
 export { default as CountUp } from './count-up';
 export { default as ConditionSelect } from './condition-select';
 export { default as SignaturePad } from './signature-pad';
-export { default as MultiLineEllipsisText } from './multi-line-ellipsis-text';
+export { default as MultiLineEllipsisText } from './multi-line-ellipsis-text';
+export { default as RcSplitView } from './rc-split-view';

package/es/rc-split-view/DraggableHandle.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+interface DraggableHandleProps {
+    /** 组件样式 */
+    className: string;
+    /** 点击回调 */
+    onClick?: (value: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
+    /** 双击回调 */
+    onDoubleClick?: (value: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
+    /** 按下鼠标按钮回调 */
+    onMouseDown: (value: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
+    /** 事件在一个或多个触点与触控设备表面接触时被触发 */
+    onTouchStart: (value: React.TouchEvent<HTMLSpanElement>) => void;
+    /** 事件在一个或多个触点从触控平面上移开时触发 */
+    onTouchEnd: (value: React.TouchEvent<HTMLSpanElement>) => void;
+    /** 子元素 */
+    children?: React.ReactNode;
+}
+declare const DraggableHandle: React.FC<DraggableHandleProps>;
+export default DraggableHandle;

package/es/rc-split-view/DraggableHandle.js

@@ -0,0 +1,37 @@
+import React from 'react';
+var DraggableHandle = function DraggableHandle(props) {
+  var className = props.className,
+    _onClick = props.onClick,
+    _onDoubleClick = props.onDoubleClick,
+    _onMouseDown = props.onMouseDown,
+    _onTouchEnd = props.onTouchEnd,
+    _onTouchStart = props.onTouchStart,
+    children = props.children;
+  return /*#__PURE__*/React.createElement("div", {
+    className: className,
+    onMouseDown: function onMouseDown(event) {
+      return _onMouseDown(event);
+    },
+    onTouchStart: function onTouchStart(event) {
+      event.preventDefault();
+      _onTouchStart(event);
+    },
+    onTouchEnd: function onTouchEnd(event) {
+      event.preventDefault();
+      _onTouchEnd(event);
+    },
+    onClick: function onClick(event) {
+      if (_onClick) {
+        event.preventDefault();
+        _onClick(event);
+      }
+    },
+    onDoubleClick: function onDoubleClick(event) {
+      if (_onDoubleClick) {
+        event.preventDefault();
+        _onDoubleClick(event);
+      }
+    }
+  }, children);
+};
+export default DraggableHandle;

package/es/rc-split-view/View.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface ViewProps {
+    /** 子元素 */
+    children: React.ReactNode;
+    /** 样式 */
+    className?: string;
+    /** 拆分方式 */
+    split: 'vertical' | 'horizontal';
+    /** 大小 */
+    size?: string | number;
+}
+declare const View: React.ForwardRefExoticComponent<ViewProps & React.RefAttributes<HTMLDivElement>>;
+export default View;

package/es/rc-split-view/View.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import isUndefined from 'lodash/isUndefined';
+var View = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var children = props.children,
+    className = props.className,
+    split = props.split,
+    size = props.size;
+  var viewStyle = {
+    flex: 1,
+    position: 'relative',
+    outline: 'none'
+  };
+  if (!isUndefined(size)) {
+    if (split === 'vertical') {
+      viewStyle.width = size;
+    } else {
+      viewStyle.height = size;
+      viewStyle.display = 'flex';
+    }
+    viewStyle.flex = 'none';
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    ref: ref,
+    className: className,
+    style: viewStyle
+  }, children);
+});
+export default View;

package/es/rc-split-view/demo/index.modules.less

@@ -0,0 +1,9 @@
+.handle {
+  position: absolute;
+  top: 50%;
+  left: 5px;
+  width: 4px;
+  height: 40px;
+  background-color: red;
+  transform: translateY(-50%);
+}

package/es/rc-split-view/index.d.ts

@@ -0,0 +1,65 @@
+import React from 'react';
+import View from './View';
+export { View };
+export interface RcSplitViewProps {
+    /** 是否允许拖动 */
+    draggable?: boolean;
+    /** children */
+    children: React.ReactNode;
+    /** 自定义组件类名 */
+    className?: string;
+    /** 拖拽条单击回调 */
+    onResizerClick?: (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
+    /** 拖拽条双击回调 */
+    onResizerDoubleClick?: (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
+    /** 面板样式 */
+    viewClassName?: string;
+    /** 第一个面板样式 */
+    firstViewClassName?: string;
+    /** 第二个面板样式 */
+    secondViewClassName?: string;
+    /** 分隔条样式 */
+    handleClassName?: string;
+    /** 分隔条内容样式 */
+    handleContentClassName?: string;
+    /** 拆分方式 */
+    split?: 'vertical' | 'horizontal';
+    /** 拖拽过程回调 */
+    onChange?: (newSize: number) => void;
+    /** 拖拽开始回调 */
+    onDragStarted?: () => void;
+    /** 拖拽完成回调 */
+    onDragFinished?: (newSize: number) => void;
+    /** 主体窗口 */
+    primary?: 'first' | 'second';
+    /** 拖动固定步进值 */
+    step?: number;
+    /** 最大窗口大小 */
+    maxSize?: number;
+    /** 最小窗口大小 */
+    minSize?: number;
+    /** 窗口大小 */
+    size?: string | number;
+    /** 默认窗口大小 */
+    defaultSize?: string | number;
+    /** 分隔条内容 */
+    handleContent?: React.ReactNode;
+}
+export type StatesTypes = {
+    /** 激活 */
+    active: boolean;
+    /** 位置 */
+    position: number;
+    /** 拖拽尺寸 */
+    draggedSize?: number;
+    /** 实例参数 */
+    instanceProps: {
+        size?: string | number;
+    };
+    /** 第一面板的尺寸 */
+    firstViewSize?: number | string;
+    /** 第二面板的尺寸 */
+    secondViewSize?: number | string;
+};
+declare const RcSplitView: React.FC<RcSplitViewProps>;
+export default RcSplitView;

package/es/rc-split-view/index.js

@@ -0,0 +1,240 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __read = this && this.__read || function (o, n) {
+  var m = typeof Symbol === "function" && o[Symbol.iterator];
+  if (!m) return o;
+  var i = m.call(o),
+    r,
+    ar = [],
+    e;
+  try {
+    while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+  } catch (error) {
+    e = {
+      error: error
+    };
+  } finally {
+    try {
+      if (r && !r.done && (m = i["return"])) m.call(i);
+    } finally {
+      if (e) throw e.error;
+    }
+  }
+  return ar;
+};
+import React from 'react';
+import useGetState from "ahooks/es/useGetState";
+import useMount from "ahooks/es/useMount";
+import useUnmount from "ahooks/es/useUnmount";
+import classNames from 'classnames';
+import isUndefined from 'lodash/isUndefined';
+import View from './View';
+import DraggableHandle from './DraggableHandle';
+import { getSizeUpdate, removeNullChildren, getDefaultSize, unFocus } from './utils';
+export { View };
+var RcSplitView = function RcSplitView(props) {
+  var _a;
+  var _b = props.draggable,
+    draggable = _b === void 0 ? true : _b,
+    children = props.children,
+    className = props.className,
+    onResizerClick = props.onResizerClick,
+    onResizerDoubleClick = props.onResizerDoubleClick,
+    viewClassName = props.viewClassName,
+    firstViewClassName = props.firstViewClassName,
+    secondViewClassName = props.secondViewClassName,
+    handleClassName = props.handleClassName,
+    _c = props.split,
+    split = _c === void 0 ? 'vertical' : _c,
+    onDragStarted = props.onDragStarted,
+    onDragFinished = props.onDragFinished,
+    _d = props.primary,
+    primary = _d === void 0 ? 'first' : _d,
+    step = props.step,
+    maxSize = props.maxSize,
+    _e = props.minSize,
+    minSize = _e === void 0 ? 50 : _e,
+    onChange = props.onChange,
+    size = props.size,
+    defaultSize = props.defaultSize,
+    handleContent = props.handleContent,
+    handleContentClassName = props.handleContentClassName;
+  var initialSize = isUndefined(size) ? getDefaultSize(defaultSize, minSize, maxSize) : size;
+  var initialValue = {
+    active: false,
+    firstViewSize: primary === 'first' ? initialSize : undefined,
+    secondViewSize: primary === 'second' ? initialSize : undefined,
+    // these are props that are needed in static functions. ie: gDSFP
+    instanceProps: {
+      size: size
+    },
+    position: 0
+  };
+  var splitViewRef = React.useRef(null);
+  var firstViewRef = React.useRef(null);
+  var secondViewRef = React.useRef(null);
+  var _f = __read(useGetState(initialValue), 3),
+    states = _f[0],
+    setStates = _f[1],
+    getStates = _f[2];
+  var onTouchStart = function onTouchStart(event) {
+    var currentValue = getStates();
+    if (draggable) {
+      unFocus(document, window);
+      var _a = event.touches[0],
+        clientX = _a.clientX,
+        clientY = _a.clientY;
+      var position = split === 'vertical' ? clientX : clientY;
+      onDragStarted === null || onDragStarted === void 0 ? void 0 : onDragStarted();
+      setStates(__assign(__assign({}, currentValue), {
+        active: true,
+        position: position
+      }));
+    }
+  };
+  var onMouseDown = function onMouseDown(event) {
+    var eventWithTouches = __assign(__assign({}, event), {
+      touches: [{
+        clientX: event.clientX,
+        clientY: event.clientY
+      }]
+    });
+    onTouchStart(eventWithTouches);
+  };
+  var onMouseUp = function onMouseUp() {
+    var currentValue = getStates();
+    var active = currentValue.active,
+      draggedSize = currentValue.draggedSize;
+    if (draggable && active && draggedSize) {
+      onDragFinished === null || onDragFinished === void 0 ? void 0 : onDragFinished(draggedSize);
+      setStates(__assign(__assign({}, currentValue), {
+        active: false
+      }));
+    }
+  };
+  var onTouchMove = function onTouchMove(event) {
+    var _a;
+    var _b;
+    var currentValue = getStates();
+    var active = currentValue.active,
+      position = currentValue.position;
+    if (draggable && active) {
+      unFocus(document, window);
+      var isFirstPrimary = primary === 'first';
+      var firstRef = isFirstPrimary ? firstViewRef.current : secondViewRef.current;
+      var secondRef = isFirstPrimary ? secondViewRef.current : firstViewRef.current;
+      if (firstRef && secondRef) {
+        var firstNode = firstRef;
+        var secondNode = secondRef;
+        if (firstNode.getBoundingClientRect) {
+          var _c = firstNode.getBoundingClientRect(),
+            width = _c.width,
+            height = _c.height;
+          var current = split === 'vertical' ? event.touches[0].clientX : event.touches[0].clientY;
+          var nodeSize = split === 'vertical' ? width : height;
+          var positionDelta = position - current;
+          if (step) {
+            if (Math.abs(positionDelta) < step) {
+              return;
+            }
+            positionDelta = Math.trunc(positionDelta / step) * step;
+          }
+          var sizeDelta = isFirstPrimary ? positionDelta : -positionDelta;
+          var firstViewOrder = parseInt(window.getComputedStyle(firstNode).order, 10);
+          var secondViewOrder = parseInt(window.getComputedStyle(secondNode).order, 10);
+          if (firstViewOrder > secondViewOrder) {
+            sizeDelta = -sizeDelta;
+          }
+          var newMaxSize = maxSize || 0;
+          if (!isUndefined(maxSize) && maxSize <= 0) {
+            if (split === 'vertical') {
+              newMaxSize = ((_b = splitViewRef.current.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width) + maxSize;
+            } else {
+              newMaxSize = splitViewRef.current.getBoundingClientRect().height + maxSize;
+            }
+          }
+          var newSize = +nodeSize - sizeDelta;
+          var newPosition = position - positionDelta;
+          var restValue = {};
+          if (newSize < minSize) {
+            newSize = minSize;
+          } else if (!isUndefined(maxSize) && newSize > newMaxSize) {
+            newSize = newMaxSize;
+          } else {
+            restValue = {
+              position: newPosition
+            };
+          }
+          onChange === null || onChange === void 0 ? void 0 : onChange(newSize);
+          setStates(__assign(__assign(__assign({}, currentValue), (_a = {
+            draggedSize: newSize
+          }, _a[isFirstPrimary ? 'firstViewSize' : 'secondViewSize'] = newSize, _a)), restValue));
+        }
+      }
+    }
+  };
+  var onMouseMove = function onMouseMove(event) {
+    var eventWithTouches = __assign(__assign({}, event), {
+      touches: [{
+        clientX: event.clientX,
+        clientY: event.clientY
+      }]
+    });
+    onTouchMove(eventWithTouches);
+  };
+  useMount(function () {
+    document.addEventListener('mouseup', onMouseUp);
+    document.addEventListener('mousemove', onMouseMove);
+    document.addEventListener('touchmove', onTouchMove);
+    setStates(getSizeUpdate({
+      size: size,
+      defaultSize: defaultSize,
+      maxSize: maxSize,
+      minSize: minSize,
+      primary: primary
+    }, states));
+  });
+  useUnmount(function () {
+    document.removeEventListener('mouseup', onMouseUp);
+    document.removeEventListener('mousemove', onMouseMove);
+    document.removeEventListener('touchmove', onTouchMove);
+  });
+  var _g = __read(removeNullChildren(children), 2),
+    firstViewNode = _g[0],
+    secondViewNode = _g[1];
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames('split-view', "split-view-".concat(split), className),
+    ref: splitViewRef
+  }, /*#__PURE__*/React.createElement(View, {
+    className: classNames(viewClassName, firstViewClassName),
+    key: "first-view",
+    ref: firstViewRef,
+    size: states.firstViewSize,
+    split: split
+  }, firstViewNode), /*#__PURE__*/React.createElement(DraggableHandle, {
+    className: classNames('split-view-draggable-handle', (_a = {}, _a["split-view-draggable-handle-".concat(split, "-disabled")] = !draggable, _a), "split-view-draggable-handle-".concat(split), handleClassName),
+    onClick: onResizerClick,
+    onDoubleClick: onResizerDoubleClick,
+    onMouseDown: onMouseDown,
+    onTouchStart: onTouchStart,
+    onTouchEnd: onMouseUp,
+    key: "draggableHandle"
+  }, draggable && /*#__PURE__*/React.createElement("div", {
+    className: classNames("split-view-draggable-handle-".concat(split, "-content"), handleContentClassName)
+  }, handleContent)), /*#__PURE__*/React.createElement(View, {
+    className: classNames(viewClassName, secondViewClassName),
+    key: "second-view",
+    ref: secondViewRef,
+    size: states.secondViewSize,
+    split: split
+  }, secondViewNode));
+};
+export default RcSplitView;

package/es/rc-split-view/style/index.css

@@ -0,0 +1,76 @@
+.split-view {
+  position: absolute;
+  display: flex;
+  flex: 1;
+  height: 100%;
+  overflow: hidden;
+  outline: none;
+  -moz-user-select: text;
+  -webkit-user-select: text;
+  user-select: text;
+}
+.split-view-horizontal {
+  top: 0;
+  bottom: 0;
+  flex-direction: column;
+  width: 100%;
+  min-height: 100%;
+}
+.split-view-vertical {
+  right: 0;
+  left: 0;
+  flex-direction: row;
+}
+.split-view-draggable-handle {
+  position: relative;
+  z-index: 1;
+  background-color: #f5f5f5;
+}
+.split-view-draggable-handle-horizontal {
+  justify-content: center;
+  height: 2px;
+  border-top: 1px solid transparent;
+  transform: translateY(-50%);
+  cursor: row-resize;
+}
+.split-view-draggable-handle-horizontal-content {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  width: 100%;
+  min-height: 10px;
+  transform: translateY(calc(-50% - 1px));
+}
+.split-view-draggable-handle-horizontal:hover {
+  border-top-color: #02a6e3;
+}
+.split-view-draggable-handle-horizontal-disabled {
+  cursor: default;
+}
+.split-view-draggable-handle-horizontal-disabled:hover {
+  border-top-color: transparent;
+}
+.split-view-draggable-handle-vertical {
+  align-items: center;
+  width: 2px;
+  border-left: 1px solid transparent;
+  transform: translateX(-50%);
+  cursor: col-resize;
+}
+.split-view-draggable-handle-vertical-content {
+  position: absolute;
+  top: 0;
+  left: 50%;
+  min-width: 10px;
+  height: 100%;
+  transform: translateX(calc(-50% - 1px));
+}
+.split-view-draggable-handle-vertical:hover {
+  border-left-color: #02a6e3;
+}
+.split-view-draggable-handle-vertical-disabled {
+  cursor: default;
+}
+.split-view-draggable-handle-vertical-disabled:hover {
+  border-left-color: transparent;
+}

package/es/rc-split-view/style/index.d.ts

@@ -0,0 +1 @@
+import './index.less';

package/es/rc-split-view/style/index.js

@@ -0,0 +1 @@
+import './index.less';