fan-standard-comp 3.1.4 → 3.1.5

package/es/ButtonGroup/ButtonList.d.ts

@@ -0,0 +1,2 @@
+declare const RenderButtonList: (item: any) => JSX.Element;
+export default RenderButtonList;

package/es/ButtonGroup/ButtonList.js

@@ -0,0 +1,37 @@
+import "antd/es/button/style";
+import _Button from "antd/es/button";
+import "antd/es/dropdown/style";
+import _Dropdown from "antd/es/dropdown";
+// 渲染按钮形式 (用于筛选)
+import React from "react";
+import SpecIcon from "@/SpecIcon";
+import buttonMenu from './ButtonMenu';
+import IconNode from "@/components/IconNode";
+import { btnIsDisabled } from "@/utils/filterPermission";
+
+var RenderButtonList = function RenderButtonList(item) {
+  if (Array.isArray(item.children) && item.children.length > 0) {
+    return /*#__PURE__*/React.createElement(_Dropdown, {
+      overlay: buttonMenu(item.children),
+      placement: "bottomRight"
+    }, /*#__PURE__*/React.createElement(_Button, {
+      type: "primary"
+    }, item.exName || item.name, " ", /*#__PURE__*/React.createElement(SpecIcon, {
+      name: "down"
+    })));
+  }
+
+  return /*#__PURE__*/React.createElement(_Button, {
+    type: item.type ? item.type : 'primary',
+    danger: item.danger,
+    icon: /*#__PURE__*/React.createElement(IconNode, {
+      icon: item.icon
+    }),
+    disabled: btnIsDisabled(item.disabled, item.rowParams),
+    onClick: item.fn ? function () {
+      return item.fn(item);
+    } : null
+  }, item.exName || item.name);
+};
+
+export default RenderButtonList;

package/es/ButtonGroup/ButtonMenu.d.ts

@@ -0,0 +1,2 @@
+declare const RenderButtonList: (group: any) => JSX.Element;
+export default RenderButtonList;

package/es/ButtonGroup/ButtonMenu.js

@@ -0,0 +1,38 @@
+import "antd/es/menu/style";
+import _Menu from "antd/es/menu";
+// 渲染按钮多层级形式 (用于筛选)
+import React from "react";
+import IconNode from "@/components/IconNode";
+
+var RenderButtonList = function RenderButtonList(group) {
+  return /*#__PURE__*/React.createElement(_Menu, null, group.map(function (item, index) {
+    if (item.children) {
+      return /*#__PURE__*/React.createElement(_Menu.SubMenu, {
+        title: item.exName || item.name,
+        key: index
+      }, item.children.map(function (child, childIndex) {
+        return /*#__PURE__*/React.createElement(_Menu.Item, {
+          key: childIndex
+        }, /*#__PURE__*/React.createElement("a", {
+          onClick: child.fn ? function () {
+            return child.fn(child);
+          } : null
+        }, /*#__PURE__*/React.createElement(IconNode, {
+          icon: child.icon
+        }), " ", child.exName || child.name));
+      }));
+    }
+
+    return /*#__PURE__*/React.createElement(_Menu.Item, {
+      key: index
+    }, /*#__PURE__*/React.createElement("a", {
+      onClick: item.fn ? function () {
+        return item.fn(item);
+      } : null
+    }, /*#__PURE__*/React.createElement(IconNode, {
+      icon: item.icon
+    }), " ", item.exName || item.name));
+  }));
+};
+
+export default RenderButtonList;

package/es/ButtonGroup/PopConfirmTitle.d.ts

@@ -0,0 +1,9 @@
+interface ConfirmTitleProps {
+    extraRow?: object;
+    confirmText?: any;
+    confirmConfig?: {
+        title?: any;
+    };
+}
+declare const PopConfirmTitle: (propsData: ConfirmTitleProps) => any;
+export default PopConfirmTitle;

package/es/ButtonGroup/PopConfirmTitle.js

@@ -0,0 +1,37 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+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); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+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; }
+
+import React from "react"; // 气泡确认框标题配置
+
+var PopConfirmTitle = function PopConfirmTitle(propsData) {
+  var confirmConfig = propsData.confirmConfig,
+      confirmText = propsData.confirmText,
+      extraRow = propsData.extraRow;
+
+  if (propsData.hasOwnProperty('confirmConfig') && confirmConfig.title) {
+    var title = confirmConfig.title;
+    if (!title) return /*#__PURE__*/React.createElement(React.Fragment, null, null);
+    return typeof title === "function" ? title.apply(void 0, _toConsumableArray(Object.keys(extraRow).map(function (pItem) {
+      return extraRow[pItem];
+    }))) : title;
+  }
+
+  if (confirmText) {
+    return typeof confirmText === "function" ? confirmText.apply(void 0, _toConsumableArray(Object.keys(extraRow).map(function (pItem) {
+      return extraRow[pItem];
+    }))) : confirmText;
+  }
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, null);
+};
+
+export default PopConfirmTitle;

package/es/ButtonGroup/index.d.ts

@@ -0,0 +1,30 @@
+import React from "react";
+import './style/index.less';
+interface ButtonGroupRowParamsProps {
+    text?: any;
+    record?: object;
+    rowIndex?: number;
+}
+export interface ButtonGroupOptionsProps {
+    name?: string;
+    code?: string;
+    exName?: string;
+    isHide?: boolean;
+    disabled?: boolean;
+    icon?: React.ReactNode | string | string[];
+    fn?: any;
+    children?: ButtonGroupOptionsProps[];
+    render?: (() => React.ReactNode) | React.ReactNode;
+    confirmText?: any;
+    confirmConfig?: any;
+}
+interface ButtonGroupProps {
+    type?: 'button' | 'text';
+    rowParams?: ButtonGroupRowParamsProps;
+    codes?: object[];
+    permissionCodes?: string[];
+    options?: ButtonGroupOptionsProps[];
+    min?: number;
+}
+declare const ButtonGroup: (props: ButtonGroupProps) => JSX.Element;
+export default ButtonGroup;

package/es/ButtonGroup/index.js

@@ -0,0 +1,374 @@
+import "antd/es/popconfirm/style";
+import _Popconfirm from "antd/es/popconfirm";
+import "antd/es/button/style";
+import _Button from "antd/es/button";
+import "antd/es/dropdown/style";
+import _Dropdown from "antd/es/dropdown";
+import "antd/es/menu/style";
+import _Menu from "antd/es/menu";
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+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."); }
+
+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); }
+
+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; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import { __rest } from "tslib";
+import React, { useState, useEffect } from "react";
+import { IconNode } from "../components/index";
+import SpecIcon from "../SpecIcon/index";
+import PopConfirmTitle from './PopConfirmTitle';
+import { funcCode } from "../data/index";
+import { DownOutlined, QuestionCircleOutlined } from "@ant-design/icons";
+import { removeNoPermission, btnIsDisabled } from '../utils/filterPermission.js';
+import './style/index.less';
+
+var ButtonGroup = function ButtonGroup(props) {
+  var _props$type = props.type,
+      type = _props$type === void 0 ? 'button' : _props$type,
+      _props$rowParams = props.rowParams,
+      rowParams = _props$rowParams === void 0 ? {
+    text: undefined,
+    record: undefined,
+    rowIndex: undefined
+  } : _props$rowParams,
+      _props$codes = props.codes,
+      codes = _props$codes === void 0 ? funcCode.btnFuncCodes : _props$codes,
+      permissionCodes = props.permissionCodes;
+  var _props$options = props.options,
+      options = _props$options === void 0 ? [] : _props$options,
+      _props$min = props.min,
+      min = _props$min === void 0 ? 3 : _props$min; // 最小展示长度不能小于2
+
+  if (!options) return null; // 没有配置list返回null
+
+  var _useState = useState(-1),
+      _useState2 = _slicedToArray(_useState, 2),
+      popVisibleIndex = _useState2[0],
+      setPopVisibleIndex = _useState2[1];
+
+  var _useState3 = useState({}),
+      _useState4 = _slicedToArray(_useState3, 2),
+      popRow = _useState4[0],
+      setPopRow = _useState4[1];
+
+  var _useState5 = useState([]),
+      _useState6 = _slicedToArray(_useState5, 2),
+      resetList = _useState6[0],
+      setResetList = _useState6[1];
+
+  useEffect(function () {
+    // 重组选项options集合数据，排除：无权限（有配置code,并且不包含permissionCodes内）的数据及，isHide 为true的数据
+    setResetList(_toConsumableArray(removeNoPermission(options, permissionCodes, codes, rowParams)) || []);
+    return function () {
+      setResetList([]);
+    };
+  }, [options, codes, permissionCodes]);
+  useEffect(function () {
+    setPopVisibleIndex(-1);
+  }, [rowParams]); // 渲染按钮多层级形式 (用于筛选)
+
+  var buttonMenu = function buttonMenu(group) {
+    return /*#__PURE__*/React.createElement(_Menu, null, group.map(function (item, index) {
+      if (item.children) {
+        return /*#__PURE__*/React.createElement(_Menu.SubMenu, {
+          title: item.exName || item.name,
+          key: index
+        }, item.children.map(function (child, childIndex) {
+          return /*#__PURE__*/React.createElement(_Menu.Item, {
+            key: childIndex
+          }, /*#__PURE__*/React.createElement("a", {
+            onClick: child.fn ? function () {
+              return child.fn(child);
+            } : null
+          }, /*#__PURE__*/React.createElement(IconNode, {
+            icon: child.icon
+          }), " ", child.exName || child.name));
+        }));
+      }
+
+      return /*#__PURE__*/React.createElement(_Menu.Item, {
+        key: index
+      }, /*#__PURE__*/React.createElement("a", {
+        onClick: item.fn ? function () {
+          return item.fn(item);
+        } : null
+      }, /*#__PURE__*/React.createElement(IconNode, {
+        icon: item.icon
+      }), " ", item.exName || item.name));
+    }));
+  }; // 渲染按钮形式 (用于筛选)
+
+
+  var RenderButtonList = function RenderButtonList(item) {
+    var exName = item.exName,
+        name = item.name,
+        type = item.type,
+        icon = item.icon,
+        ghost = item.ghost,
+        danger = item.danger,
+        disabled = item.disabled,
+        loading = item.loading,
+        fn = item.fn,
+        code = item.code,
+        rowParams = item.rowParams,
+        others = __rest(item, ["exName", "name", "type", "icon", "ghost", "danger", "disabled", "loading", "fn", "code", "rowParams"]);
+
+    if (Array.isArray(item.children) && item.children.length > 0) {
+      return /*#__PURE__*/React.createElement(_Dropdown, {
+        overlay: buttonMenu(item.children),
+        placement: "bottomRight"
+      }, /*#__PURE__*/React.createElement(_Button, {
+        type: "primary"
+      }, item.exName || item.name, " ", /*#__PURE__*/React.createElement(SpecIcon, {
+        name: "down"
+      })));
+    }
+
+    return /*#__PURE__*/React.createElement(_Button, Object.assign({
+      type: type || 'primary',
+      danger: danger,
+      ghost: ghost,
+      onClick: fn ? function () {
+        return fn(item);
+      } : null
+    }, others, {
+      icon: /*#__PURE__*/React.createElement(IconNode, {
+        icon: icon
+      }),
+      disabled: btnIsDisabled(disabled, rowParams)
+    }), exName || name);
+  }; // 渲染文本形式多级菜单列表（用于表格）
+
+
+  var textMenu = function textMenu(group) {
+    return /*#__PURE__*/React.createElement(_Menu, {
+      className: "spec-button-text-dropdown"
+    }, group.map(function (gItem, gIndex) {
+      if (gItem.children) {
+        return /*#__PURE__*/React.createElement(_Menu.SubMenu, {
+          title: gItem.exName || gItem.name,
+          key: gItem
+        }, gItem.children.map(function (child, childIndex) {
+          return /*#__PURE__*/React.createElement(_Menu.Item, {
+            key: childIndex
+          }, /*#__PURE__*/React.createElement("a", {
+            onClick: child.fn ? function () {
+              return child.fn.apply(child, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+                return rowParams[pItem];
+              })));
+            } : null
+          }, child.render ? child.render.apply(child, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+            return rowParams[pItem];
+          }))) : child.exName || child.name));
+        }));
+      }
+
+      return /*#__PURE__*/React.createElement(_Menu.Item, {
+        key: gIndex,
+        disabled: btnIsDisabled(gItem.disabled, rowParams)
+      }, gItem.hasOwnProperty('confirmText') || gItem.hasOwnProperty('confirmConfig') ?
+      /*#__PURE__*/
+      // @ts-ignore
+      React.createElement("a", {
+        disabled: btnIsDisabled(gItem.disabled, rowParams),
+        onClick: gItem.fn ? function () {
+          setPopVisibleIndex(rowParams.rowIndex);
+          setPopRow(gItem);
+        } : null
+      }, gItem.render ? gItem.render.apply(gItem, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+        return rowParams[pItem];
+      }))) : gItem.exName || gItem.name) : /*#__PURE__*/React.createElement("a", {
+        className: "spec-button-group-text",
+        onClick: gItem.fn ? function () {
+          return gItem.fn.apply(gItem, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+            return rowParams[pItem];
+          })));
+        } : null,
+        // @ts-ignore
+        disabled: btnIsDisabled(gItem.disabled, rowParams)
+      }, gItem.render ? gItem.render.apply(gItem, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+        return rowParams[pItem];
+      }))) : gItem.exName || gItem.name));
+    }));
+  }; // 渲染文本形式 列表（用于表格）
+
+
+  var RenderTextList = function RenderTextList(item) {
+    if (Array.isArray(item.children) && item.children.length > 0) {
+      return /*#__PURE__*/React.createElement(_Dropdown, {
+        overlay: textMenu(item.children),
+        placement: "bottomRight"
+      }, /*#__PURE__*/React.createElement("a", {
+        className: "spec-button-group-text"
+      }, item.render ? item.render.apply(item, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+        return rowParams[pItem];
+      }))) : item.exName || item.name, " ", /*#__PURE__*/React.createElement(SpecIcon, {
+        name: "down"
+      })));
+    }
+
+    return /*#__PURE__*/React.createElement(React.Fragment, null, item.hasOwnProperty('confirmText') || item.hasOwnProperty('confirmConfig') ? /*#__PURE__*/React.createElement(_Popconfirm, Object.assign({
+      placement: "topRight",
+      icon: /*#__PURE__*/React.createElement(QuestionCircleOutlined, null)
+    }, item.hasOwnProperty('confirmConfig') ? item.confirmConfig : {}, {
+      title: /*#__PURE__*/React.createElement(PopConfirmTitle, Object.assign({}, item, {
+        extraRow: rowParams
+      })),
+      onCancel: function onCancel() {
+        if (item.hasOwnProperty('confirmConfig') && item.confirmConfig.onCancel) {
+          var _item$confirmConfig;
+
+          (_item$confirmConfig = item.confirmConfig).onCancel.apply(_item$confirmConfig, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+            return rowParams[pItem];
+          })));
+        }
+      },
+      onConfirm: function onConfirm() {
+        if (item.hasOwnProperty('confirmConfig') && item.confirmConfig.onConfirm) {
+          var _item$confirmConfig2;
+
+          (_item$confirmConfig2 = item.confirmConfig).onConfirm.apply(_item$confirmConfig2, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+            return rowParams[pItem];
+          })));
+        } else if (item.fn) {
+          item.fn.apply(item, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+            return rowParams[pItem];
+          })));
+        }
+      }
+    }), /*#__PURE__*/React.createElement("a", {
+      className: "spec-button-group-text",
+      key: item.index,
+      title: item.exName || item.name,
+      // @ts-ignore
+      disabled: btnIsDisabled(item.disabled, rowParams)
+    }, item.render ? item.render.apply(item, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+      return rowParams[pItem];
+    }))) : item.exName || item.name)) : /*#__PURE__*/React.createElement("a", {
+      className: "spec-button-group-text",
+      title: item.exName || item.name,
+      key: item.index,
+      // @ts-ignore
+      disabled: btnIsDisabled(item.disabled, rowParams),
+      onClick: item.fn ? function () {
+        return item.fn.apply(item, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+          return rowParams[pItem];
+        })));
+      } : null
+    }, item.render ? item.render.apply(item, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+      return rowParams[pItem];
+    }))) : item.exName || item.name));
+  }; // 渲染展示的按钮列表
+
+
+  var renderDisplayButton = function renderDisplayButton(item, index) {
+    /*渲染自定义*/
+    if (item.render) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, typeof item.render === 'function' ? item.render.apply(item, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+        return rowParams[pItem];
+      }))) : item.render);
+    }
+    /*渲染按钮形式*/
+
+
+    if (type === 'button') {
+      return /*#__PURE__*/React.createElement(RenderButtonList, Object.assign({
+        key: index
+      }, item, {
+        rowParams: rowParams
+      }));
+    }
+    /*渲染文本形式*/
+
+
+    return /*#__PURE__*/React.createElement(RenderTextList, Object.assign({
+      key: index
+    }, item));
+  };
+
+  if (min < 2) min = 2;
+
+  if (resetList.length === 0) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, type !== 'button' ? '-' : null);
+  }
+
+  if (resetList.length > min) {
+    var forGroup = resetList.slice(0, min - 1);
+    var forDrop = resetList.slice(min - 1);
+    return /*#__PURE__*/React.createElement("span", {
+      className: "spec-button-group"
+    }, forGroup.map(function (item, index) {
+      return index < min - 1 ? renderDisplayButton(item, index) : null;
+    }), type === 'button' ? /*#__PURE__*/React.createElement(_Dropdown, {
+      overlay: buttonMenu(forDrop),
+      placement: "bottomRight"
+    }, /*#__PURE__*/React.createElement(_Button, {
+      type: "primary"
+    }, "\u66F4\u591A ", /*#__PURE__*/React.createElement(SpecIcon, {
+      name: "down"
+    }))) : /*#__PURE__*/React.createElement(_Popconfirm, Object.assign({
+      placement: "topRight",
+      visible: popVisibleIndex === rowParams.rowIndex,
+      icon: /*#__PURE__*/React.createElement(QuestionCircleOutlined, null),
+      trigger: "click"
+    }, popRow.hasOwnProperty('confirmConfig') ? popRow.confirmConfig : {}, {
+      title: /*#__PURE__*/React.createElement(PopConfirmTitle, Object.assign({}, popRow, {
+        extraRow: rowParams
+      })),
+      onCancel: function onCancel() {
+        setPopVisibleIndex(-1); // 优先调用其 confirmConfig 配置的 onCancel 事件
+
+        if (popRow.hasOwnProperty('confirmConfig') && popRow.confirmConfig.onCancel) {
+          var _popRow$confirmConfig;
+
+          (_popRow$confirmConfig = popRow.confirmConfig).onCancel.apply(_popRow$confirmConfig, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+            return rowParams[pItem];
+          })));
+        }
+      },
+      onConfirm: function onConfirm() {
+        setPopVisibleIndex(-1); // 优先调用其 confirmConfig 配置的 onConfirm 事件
+
+        if (popRow.hasOwnProperty('confirmConfig') && popRow.confirmConfig.onConfirm) {
+          var _popRow$confirmConfig2;
+
+          (_popRow$confirmConfig2 = popRow.confirmConfig).onConfirm.apply(_popRow$confirmConfig2, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+            return rowParams[pItem];
+          })));
+        } else if (popRow.fn) {
+          popRow.fn.apply(popRow, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
+            return rowParams[pItem];
+          })));
+        }
+      }
+    }), /*#__PURE__*/React.createElement(_Dropdown, {
+      overlay: textMenu(forDrop),
+      placement: "bottomRight"
+    }, /*#__PURE__*/React.createElement("a", {
+      className: "spec-button-group-text"
+    }, "\u66F4\u591A ", /*#__PURE__*/React.createElement(DownOutlined, null)))));
+  }
+
+  return /*#__PURE__*/React.createElement("span", {
+    className: "spec-button-group"
+  }, resetList.map(function (item, index) {
+    return renderDisplayButton(item, index);
+  }));
+};
+
+export default ButtonGroup;

package/es/ButtonGroup/style/index.less

@@ -0,0 +1,36 @@
+@root-entry-name: default;
+@import (reference) '~antd/es/style/themes/index';
+
+
+.spec-button-group {
+  display: inline-block;
+  vertical-align: middle;
+  .ant-btn + .ant-btn {
+    margin-left: @padding-sm;
+  }
+  .spec-button-group-text + .spec-button-group-text {
+    position: relative;
+    margin-left: @padding-sm;
+    &:before {
+      position: absolute;
+      content: '';
+      top: 50%;
+      left: -@padding-sm/2;
+      transform: translate(0, -50%);
+      display: inline-block;
+      height: .9em;
+      vertical-align: middle;
+      border-left: 1px solid @border-color-base;
+    }
+  }
+  //& when (@theme = dark) {
+  //  .ant-btn + .ant-btn {
+  //    background: #795da3 !important;
+  //  }
+  //}
+  //& when not (@theme = dark) {
+  //  .ant-btn + .ant-btn {
+  //    background: #c81313 !important;
+  //  }
+  //}
+}

package/es/DragContent/DragBar.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import classNames from 'classnames';
+import './index.less';
+
+var DragBar = function DragBar(props) {
+  var direction = props.direction,
+      className = props.className,
+      onMouseDown = props.onMouseDown;
+  var directionStyle = direction === 'left' ? "spec-grid-dragbar-left-horizontal" : direction === 'right' ? "spec-grid-dragbar-right-horizontal" : direction === 'top' ? "spec-grid-dragbar-up-vertical" : "spec-grid-dragbar-down-vertical";
+
+  var handleMouseDown = function handleMouseDown(e) {
+    onMouseDown(e, direction);
+  };
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(directionStyle, className),
+    onMouseDown: handleMouseDown
+  });
+};
+
+export default DragBar;

package/es/DragContent/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+interface DragContentProps {
+    children?: React.ReactNode;
+    className?: string;
+    direction?: string[];
+    moveMaxWidth?: number;
+    moveMaxHeight?: number;
+    style?: React.CSSProperties;
+    dragMouseDown?: (evt: any, direction?: string) => void;
+    dragMouseMove?: (evt: any, direction?: string) => void;
+    dragMouseUp?: (evt: any, direction?: string) => void;
+}
+declare const DragContent: (props: DragContentProps) => JSX.Element;
+export default DragContent;