fan-standard-comp 3.2.1 → 4.0.1

package/lib/CalendarCoordPicker/index.js

@@ -0,0 +1,323 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _antd = require("antd");
+var _dayjs = _interopRequireDefault(require("dayjs"));
+require("./styles/index.less");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _icons = require("@ant-design/icons");
+var _CalendarMonthPicker = _interopRequireDefault(require("./CalendarMonthPicker"));
+var _styles = _interopRequireDefault(require("./styles"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // import type { CalendarProps } from 'antd';
+var CalendarCoordPicker = function CalendarCoordPicker(props) {
+  var _props$type = props.type,
+    type = _props$type === void 0 ? 'directPick' : _props$type,
+    year = props.year;
+  var componentName = 'spec-calendar-coordinate';
+  var _useStyle = (0, _styles.default)(componentName),
+    _useStyle2 = _slicedToArray(_useStyle, 2),
+    wrapSSR = _useStyle2[0],
+    hashId = _useStyle2[1];
+  var _useState = (0, _react.useState)((0, _dayjs.default)().year()),
+    _useState2 = _slicedToArray(_useState, 2),
+    yearNum = _useState2[0],
+    setYearNum = _useState2[1];
+  (0, _react.useEffect)(function () {
+    setYearNum(year || (0, _dayjs.default)().year());
+  }, [year]);
+  // const cellDays = useMemo(() => {
+  //   return
+  // }, [])
+  // const onPanelChange = (value: Dayjs, mode: CalendarProps<Dayjs>['mode']) => {
+  //   console.log(value.format('YYYY-MM-DD'), mode);
+  // };
+  (0, _react.useEffect)(function () {
+    // 获取日历格子元素
+    //     var calendarCells = document.querySelectorAll('.calendar-cell');
+    var calendarCells = document.querySelectorAll('.ant-picker-cell');
+    // console.log('calendarCells', calendarCells)
+    // console.log('calendarCells', document.getElementsByClassName('ant-picker-cell-in-view'))
+    // 记录鼠标按下的位置
+    var startX, startY;
+
+    // 记录鼠标框选的起始位置和结束位置
+    //     let startCell: any;
+    var endCell;
+    var startCellIndex, endCellIndex;
+    var startCellRect, endCellRect;
+    var cellSelectProcessing = false;
+
+    // 监听鼠标按下事件
+    document.addEventListener('mousedown', function (event) {
+      // 记录鼠标按下的位置
+      startX = event.clientX;
+      startY = event.clientY;
+      var startCellConfig = getCellFromCoordinates(startX, startY);
+      // 获取鼠标按下的日历格子
+      // startCell = startCellConfig.cell;
+      startCellIndex = startCellConfig.cellIndex;
+      startCellRect = startCellConfig.cellRect;
+      cellSelectProcessing = true;
+    });
+
+    // 监听鼠标移动事件
+    document.addEventListener('mousemove', function (event) {
+      // 获取鼠标移动的位置
+      var currentX = event.clientX;
+      var currentY = event.clientY;
+
+      // 获取鼠标移动的日历格子
+      var currentCellConfig = getCellFromCoordinates(currentX, currentY);
+      var currentCell = currentCellConfig.cell;
+      var currentCellIndex = currentCellConfig.cellIndex;
+      var currentCellRect = currentCellConfig.cellRect;
+
+      // 如果鼠标移动的日历格子不为空，则进行框选
+      if (cellSelectProcessing && currentCell) {
+        // 清除之前的框选样式
+        clearSelection();
+        // 设置当前日历格子的框选样式
+        // currentCell.classList.add('spec-calendar-coordinate-picker__order-selected');
+        // 记录结束位置
+        endCell = currentCell;
+        endCellIndex = currentCellIndex;
+        endCellRect = currentCellRect;
+        type === 'orderPick' ? getCellSelected() : getCellCoordinate();
+      }
+    });
+
+    // 监听鼠标松开事件
+    document.addEventListener('mouseup', function (event) {
+      // 清除框选样式
+      clearSelection();
+
+      // 获取鼠标松开的位置
+      var endX = event.clientX;
+      var endY = event.clientY;
+
+      // 获取鼠标松开的日历格子
+      var endCellConfig = getCellFromCoordinates(endX, endY);
+      endCell = endCellConfig.cell;
+      endCellIndex = endCellConfig.cellIndex;
+      endCellRect = endCellConfig.cellRect;
+
+      // 如果鼠标松开的日历格子不为空，则进行框选
+      if (endCell) {
+        type === 'orderPick' ? getCellSelected() : getCellCoordinate();
+      }
+      cellSelectProcessing = false;
+    });
+
+    // 按坐标内的顺序选中
+    var getCellSelected = function getCellSelected() {
+      for (var i = Math.min(startCellIndex, endCellIndex); i <= Math.max(startCellIndex, endCellIndex); i++) {
+        // const rect = calendarCells[i].getBoundingClientRect();
+        if (calendarCells[i].classList.contains('ant-picker-cell-in-view')) {
+          calendarCells[i].classList.add('spec-calendar-coordinate-picker__order-selected');
+        }
+      }
+    };
+    // 按坐标内的范围选中
+    var getCellCoordinate = function getCellCoordinate() {
+      var _startCellRect, _endCellRect, _startCellRect2, _endCellRect2, _startCellRect3, _endCellRect3;
+      var direct = ''; // 选中单元格方位
+      if (!startCellRect && !endCellRect) return;
+      if (((_startCellRect = startCellRect) === null || _startCellRect === void 0 ? void 0 : _startCellRect.x) === ((_endCellRect = endCellRect) === null || _endCellRect === void 0 ? void 0 : _endCellRect.x)) {
+        if (startCellRect.y === endCellRect.y) {
+          direct = 'center';
+        } else if (startCellRect.y > endCellRect.y) {
+          direct = 'centerTop';
+        } else if (startCellRect.y < endCellRect.y) {
+          direct = 'centerBottom';
+        }
+      } else if (((_startCellRect2 = startCellRect) === null || _startCellRect2 === void 0 ? void 0 : _startCellRect2.x) > ((_endCellRect2 = endCellRect) === null || _endCellRect2 === void 0 ? void 0 : _endCellRect2.x)) {
+        if (startCellRect.y === endCellRect.y) {
+          direct = 'centerLeft';
+        } else if (startCellRect.y > endCellRect.y) {
+          direct = 'leftTop';
+        } else if (startCellRect.y < endCellRect.y) {
+          direct = 'leftBottom';
+        }
+      } else if (((_startCellRect3 = startCellRect) === null || _startCellRect3 === void 0 ? void 0 : _startCellRect3.x) < ((_endCellRect3 = endCellRect) === null || _endCellRect3 === void 0 ? void 0 : _endCellRect3.x)) {
+        if (startCellRect.y === endCellRect.y) {
+          direct = 'centerRight';
+        } else if (startCellRect.y > endCellRect.y) {
+          direct = 'rightTop';
+        } else if (startCellRect.y < endCellRect.y) {
+          direct = 'rightBottom';
+        }
+      }
+      var selectedCells = []; // 过滤当前选中的单元格
+      for (var i = 0; i < calendarCells.length; i++) {
+        var rect = calendarCells[i].getBoundingClientRect();
+        if (rect && calendarCells[i].classList.contains('ant-picker-cell-in-view')) {
+          switch (direct) {
+            case 'center':
+              if (rect.x === endCellRect.x && rect.y === endCellRect.y) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+            case 'centerTop':
+              if (rect.x === endCellRect.x && rect.y >= endCellRect.y && rect.x === endCellRect.x && rect.y <= startCellRect.y) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+            case 'centerBottom':
+              if (rect.x === endCellRect.x && rect.y <= endCellRect.y && rect.x === endCellRect.x && rect.y >= startCellRect.y) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+            case 'centerRight':
+              if (rect.y === endCellRect.y && rect.x <= endCellRect.x && rect.y === endCellRect.y && rect.x >= startCellRect.x) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+            case 'rightBottom':
+              if (rect.y >= startCellRect.y && rect.y <= endCellRect.y && rect.x >= startCellRect.x && rect.x <= endCellRect.x) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+            case 'rightTop':
+              if (rect.x >= startCellRect.x && rect.x <= endCellRect.x && rect.y >= endCellRect.y && rect.y <= startCellRect.y) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+            case 'centerLeft':
+              if (rect.y === endCellRect.y && rect.x >= endCellRect.x && rect.y === endCellRect.y && rect.x <= startCellRect.x) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+            case 'leftBottom':
+              if (rect.y >= startCellRect.y && rect.y <= endCellRect.y && rect.x <= startCellRect.x && rect.x >= endCellRect.x) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+            case 'leftTop':
+              if (rect.y <= startCellRect.y && rect.y >= endCellRect.y && rect.x <= startCellRect.x && rect.x >= endCellRect.x) {
+                selectedCells.push(calendarCells[i]);
+              }
+              break;
+          }
+        }
+      }
+      // console.log('selectedCells', calendarCells)
+      for (var j = 0; j < selectedCells.length; j++) {
+        // rect.x  >= startX && rect.x  <= overX && rect.y >= startY && rect.y <= overY
+        selectedCells[j].classList.add('spec-calendar-coordinate-picker__directed-selected');
+      }
+    };
+    // 获取指定坐标的日历格子（按坐标）
+    var getCellFromCoordinates = function getCellFromCoordinates(x, y) {
+      var cell = null;
+      var cellIndex = null;
+      var cellRect = null; // 当前格子的坐标信息
+      // 遍历所有日历格子
+      for (var i = 0; i < calendarCells.length; i++) {
+        var rect = calendarCells[i].getBoundingClientRect();
+        // 判断坐标是否在日历格子的范围内
+        if (x >= rect.left && x <= rect.right && y >= rect.top && y <= rect.bottom) {
+          cell = calendarCells[i];
+          cellIndex = i;
+          cellRect = rect;
+          break;
+        }
+      }
+      return {
+        cellIndex: cellIndex,
+        cell: cell,
+        cellRect: cellRect
+      };
+    };
+
+    // 清除框选样式
+    var clearSelection = function clearSelection() {
+      for (var i = 0; i < calendarCells.length; i++) {
+        calendarCells[i].classList.remove('spec-calendar-coordinate-picker__order-selected');
+        calendarCells[i].classList.remove('spec-calendar-coordinate-picker__directed-selected');
+      }
+    };
+    return function () {
+      document.removeEventListener('mousedown', function () {}, false);
+      document.removeEventListener('mousemove', function () {}, false);
+      document.removeEventListener('mouseup', function () {}, false);
+    };
+  }, [type]);
+  var renderPickerHeader = function renderPickerHeader(_ref) {
+    var value = _ref.value;
+    //
+    // const start = 0;
+    // const end = 12;
+    // const monthOptions = [];
+    var current = value.clone();
+    var localeData = value.localeData();
+    var months = [];
+    for (var i = 0; i < 12; i++) {
+      current.month(i);
+      months.push(localeData.monthsShort(current));
+    }
+    return /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        textAlign: 'right',
+        fontSize: '16px',
+        paddingRight: '10px'
+      }
+    }, months[value.month()]);
+  };
+  var monthArray = (0, _react.useMemo)(function () {
+    var months = [];
+    for (var i = 0; i < 12; i++) {
+      months.push(i + 1);
+    }
+    return months;
+  }, []);
+  return wrapSSR( /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)(componentName, hashId)
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: 'spec-calendar-coordinate-header'
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: 'spec-calendar-coordinate-header-action prev'
+  }, /*#__PURE__*/_react.default.createElement(_antd.Button, {
+    size: 'small',
+    icon: /*#__PURE__*/_react.default.createElement(_icons.LeftOutlined, null),
+    title: "".concat(yearNum - 1, "\u5E74"),
+    onClick: function onClick() {
+      return setYearNum(yearNum - 1);
+    }
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: 'spec-calendar-coordinate-header-year'
+  }, yearNum, "\u5E74"), /*#__PURE__*/_react.default.createElement("div", {
+    className: 'spec-calendar-coordinate-header-action  next'
+  }, /*#__PURE__*/_react.default.createElement(_antd.Button, {
+    size: 'small',
+    icon: /*#__PURE__*/_react.default.createElement(_icons.RightOutlined, null),
+    title: "".concat(yearNum + 1, "\u5E74"),
+    onClick: function onClick() {
+      return setYearNum(yearNum + 1);
+    }
+  }))), /*#__PURE__*/_react.default.createElement("div", {
+    className: 'spec-calendar-coordinate-picker'
+  }, monthArray.map(function (mItem) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: 'spec-calendar-coordinate-picker-col',
+      key: mItem
+    }, /*#__PURE__*/_react.default.createElement(_CalendarMonthPicker.default, {
+      month: mItem,
+      year: yearNum,
+      headerRender: renderPickerHeader
+    }));
+  }))));
+};
+var _default = exports.default = CalendarCoordPicker;

package/lib/CalendarCoordPicker/styles/index.d.ts

@@ -0,0 +1,6 @@
+import { GlobalToken } from "antd";
+export interface CalendarCoordPickerTokenType extends GlobalToken {
+    [k: string]: any;
+}
+declare const CalendarCoordPickerStyleFunc: (prefix: string) => any;
+export default CalendarCoordPickerStyleFunc;

package/lib/CalendarCoordPicker/styles/index.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _genStyleHook = require("../../theme/utils/genStyleHook");
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var CalendarCoordPickerStyleFunc = function CalendarCoordPickerStyleFunc(prefix) {
+  var prepareComponentToken = function prepareComponentToken(token) {
+    return {
+      fontWeight: 400
+    };
+  };
+  return (0, _genStyleHook.createStyleHook)(prefix, function (token) {
+    var prefixCls = ".".concat(prefix);
+    return [_defineProperty({}, prefixCls, {
+      position: 'relative',
+      '.spec-calendar-coordinate-header': {
+        padding: "".concat(token.paddingSM, "px ").concat(token.paddingMD, "px"),
+        backgroundColor: ' @body-background',
+        marginBottom: token.paddingSM
+      },
+      '.spec-calendar-coordinate-picker__directed-selected': {
+        backgroundColor: token.colorPrimary + '!important'
+      }
+    })];
+  }, prepareComponentToken // 当前组件扩展的变量
+  );
+};
+var _default = exports.default = CalendarCoordPickerStyleFunc;

package/lib/CalendarCoordPicker/styles/index.less

@@ -0,0 +1,37 @@
+.spec-calendar-coordinate {
+  box-sizing: border-box;
+  & * {
+    box-sizing: border-box;
+  }
+}
+.spec-calendar-coordinate-header {
+  display: flex;
+
+  //padding: @padding-sm @padding-md;
+  //background-color: @body-background;
+  //margin-bottom: @padding-sm;
+  &-year{
+    flex: 1;
+    text-align: center;
+    font-size: 18px;
+  }
+}
+.spec-calendar-coordinate-picker{
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.spec-calendar-coordinate-picker-col {
+  width: 25%;
+  padding: 0 10px;
+  user-select: none;
+
+  .spec-calendar-coordinate-picker__order-selected{
+    background-color: #795da3;
+
+  }
+
+  .spec-calendar-coordinate-picker__directed-selected {
+    //background-color: @primary-color !important;
+  }
+}

package/lib/ConfigContext/index.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+declare const FanDefaultConfig: {
+    locale: string;
+};
+declare const FanContext: import("react").Context<any>;
+declare const FanProvider: import("react").Provider<any>;
+export { FanContext, FanProvider, FanDefaultConfig };

package/lib/ConfigContext/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FanProvider = exports.FanDefaultConfig = exports.FanContext = void 0;
+var _react = require("react");
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+// import type { Locale } from '../locale';
+
+// export type LocaleContextProps = Partial<Locale> & { exist?: boolean };
+
+// const FanLocaleContext = createContext<LocaleContextProps | undefined>(undefined);
+// const FanLocaleProvider = FanLocaleContext.Provider
+var FanDefaultConfig = exports.FanDefaultConfig = {
+  locale: 'zh-cn'
+};
+var FanContext = exports.FanContext = /*#__PURE__*/(0, _react.createContext)(_objectSpread({}, FanDefaultConfig));
+var FanProvider = exports.FanProvider = FanContext.Provider;
+// export { FanLocaleContext, FanLocaleProvider };

package/lib/DragContent/DragBar.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const DragBar: (props: any) => React.JSX.Element;
+export default DragBar;

package/lib/DragContent/DragBar.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
-require("./index.less");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var DragBar = function DragBar(props) {
   var direction = props.direction,
@@ -21,5 +20,4 @@ var DragBar = function DragBar(props) {
     onMouseDown: handleMouseDown
   });
 };
-var _default = DragBar;
-exports.default = _default;
+var _default = exports.default = DragBar;

package/lib/DragContent/index.d.ts

@@ -10,5 +10,5 @@ interface DragContentProps {
     dragMouseMove?: (evt: any, direction?: string) => void;
     dragMouseUp?: (evt: any, direction?: string) => void;
 }
-declare const DragContent: (props: DragContentProps) => JSX.Element;
+declare const DragContent: (props: DragContentProps) => any;
 export default DragContent;

package/lib/DragContent/index.js

@@ -8,14 +8,15 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _DragBar = _interopRequireDefault(require("./DragBar"));
+var _styles = _interopRequireDefault(require("./styles"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0) { ; } } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var DragContent = function DragContent(props) {
   var children = props.children,
@@ -29,6 +30,11 @@ var DragContent = function DragContent(props) {
     dragMouseDown = props.dragMouseDown,
     dragMouseMove = props.dragMouseMove,
     dragMouseUp = props.dragMouseUp;
+  var componentName = 'spec-grid-dragContent';
+  var _useStyle = (0, _styles.default)(componentName),
+    _useStyle2 = _slicedToArray(_useStyle, 2),
+    wrapSSR = _useStyle2[0],
+    hashId = _useStyle2[1];
   var divRef = (0, _react.useRef)();
   var _useState = (0, _react.useState)(0),
     _useState2 = _slicedToArray(_useState, 2),
@@ -46,6 +52,7 @@ var DragContent = function DragContent(props) {
     var parent = divRef.current;
     var nextNode = parent.nextSibling; //相邻兄弟节点
     var prevNode = parent.previousSibling; //相邻兄弟节点
+
     //获取前后兄弟节点宽高
     var prevWidth = 0,
       prevHeight = 0,
@@ -65,6 +72,7 @@ var DragContent = function DragContent(props) {
     var initHeight = parent.offsetHeight;
     // let initLeft = parent.offsetLeft;
     // let initTop = parent.offsetTop;
+
     var startX = e.clientX;
     var startY = e.clientY;
     document.onmousemove = function (e) {
@@ -72,10 +80,16 @@ var DragContent = function DragContent(props) {
       var currY = e.clientY;
       var disY = currY - startY;
       var disX = currX - startX;
+      // @ts-ignore
       var hasT = /top/.test(direction);
+      // @ts-ignore
       var hasB = /bottom/.test(direction);
+      // @ts-ignore
       var hasL = /left/.test(direction);
+      // @ts-ignore
       var hasR = /right/.test(direction);
+      // @ts-ignore
+
       if (hasL || hasR) {
         var newWidth = initWidth + (hasL ? -disX : hasR ? disX : 0);
         var width = newWidth > 0 ? newWidth : 0;
@@ -137,9 +151,9 @@ var DragContent = function DragContent(props) {
       if (dragMouseUp) dragMouseUp(e, direction);
     };
   };
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return wrapSSR( /*#__PURE__*/_react.default.createElement("div", {
     ref: divRef,
-    className: (0, _classnames.default)("spec-grid-dragContent", className),
+    className: (0, _classnames.default)(componentName, hashId, className),
     style: style
   }, children, direction && direction.map(function (item, idx) {
     return /*#__PURE__*/_react.default.createElement(_DragBar.default, {
@@ -147,7 +161,6 @@ var DragContent = function DragContent(props) {
       direction: item,
       onMouseDown: onmousedown
     });
-  }));
+  })));
 };
-var _default = DragContent;
-exports.default = _default;
+var _default = exports.default = DragContent;

package/lib/DragContent/styles/index.d.ts

@@ -0,0 +1,6 @@
+import { GlobalToken } from "antd";
+export interface DragContentTokenType extends GlobalToken {
+    [k: string]: any;
+}
+declare const DragContentStyleFunc: (prefix: string) => any;
+export default DragContentStyleFunc;

package/lib/DragContent/styles/index.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _genStyleHook = require("../../theme/utils/genStyleHook");
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var DragContentStyleFunc = function DragContentStyleFunc(prefix) {
+  var prepareComponentToken = function prepareComponentToken(token) {
+    return {
+      fontWeight: 400
+    };
+  };
+  return (0, _genStyleHook.createStyleHook)(prefix, function (token) {
+    var prefixCls = ".".concat(prefix);
+    return [_defineProperty({}, prefixCls, {
+      position: 'relative',
+      '.spec-grid-dragbar-left-horizontal': {
+        height: '100%',
+        width: '5px',
+        position: 'absolute',
+        left: 0,
+        top: 0,
+        cursor: ' col-resize'
+      },
+      '.spec-grid-dragbar-right-horizontal': {
+        height: '100%',
+        width: '5px',
+        position: 'absolute',
+        right: 0,
+        top: 0,
+        cursor: ' col-resize'
+      },
+      '.spec-grid-dragbar-up-vertical': {
+        height: '5px',
+        width: '100%',
+        position: 'absolute',
+        left: 0,
+        top: 0,
+        cursor: ' col-resize'
+      },
+      '.spec-grid-dragbar-down-vertical': {
+        height: '5px',
+        width: '100%',
+        position: 'absolute',
+        left: 0,
+        bottom: 0,
+        cursor: ' col-resize'
+      }
+    })];
+  }, prepareComponentToken // 当前组件扩展的变量
+  );
+};
+var _default = exports.default = DragContentStyleFunc;