@hi-ui/hiui 3.9.0-rc.8 → 4.0.0-beta.1

package/es/table/SettingMenu.js

@@ -1,205 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _context = _interopRequireDefault(require("./context"));
-
-var _popper = _interopRequireDefault(require("../popper"));
-
-var _switch = _interopRequireDefault(require("../switch"));
-
-var _icon = _interopRequireDefault(require("../icon"));
-
-var _reactBeautifulDnd = require("react-beautiful-dnd");
-
-var _useClickOutside = _interopRequireDefault(require("./hooks/useClickOutside"));
-
-var _useLatest = require("@hi-ui/use-latest");
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-var SettingMenu = function SettingMenu() {
-  var colMenuRef = (0, _react.useRef)(null);
-
-  var _useState = (0, _react.useState)(false),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      showPopper = _useState2[0],
-      setShowPopper = _useState2[1];
-
-  var popperMenu = (0, _react.useRef)(null);
-  (0, _useClickOutside["default"])(popperMenu, function () {
-    return setShowPopper(false);
-  }, colMenuRef);
-
-  var _useContext = (0, _react.useContext)(_context["default"]),
-      getColKeyValue = _useContext.getColKeyValue,
-      sortCols = _useContext.sortCols,
-      setSortCols = _useContext.setSortCols,
-      cacheSortCols = _useContext.cacheSortCols,
-      setCacheSortCols = _useContext.setCacheSortCols,
-      cacheHiddenColKeys = _useContext.cacheHiddenColKeys,
-      setCacheHiddenColKeys = _useContext.setCacheHiddenColKeys,
-      hiddenColKeys = _useContext.hiddenColKeys,
-      setHiddenColKeys = _useContext.setHiddenColKeys,
-      theme = _useContext.theme,
-      localeDatas = _useContext.localeDatas;
-
-  var grid = 8;
-
-  var getItemStyle = function getItemStyle(isDragging, draggableStyle) {
-    return _objectSpread({
-      // some basic styles to make the items look a bit nicer
-      userSelect: 'none',
-      padding: grid * 2,
-      margin: "0 0 ".concat(grid, "px 0"),
-      background: '#fff',
-      border: isDragging ? '1px dashed var(--color-primary)' : 'none'
-    }, draggableStyle);
-  };
-
-  var getListStyle = function getListStyle(isDraggingOver) {
-    return {
-      padding: grid,
-      width: 250
-    };
-  };
-
-  var resetLatest = (0, _useLatest.useLatestCallback)(function () {
-    setCacheHiddenColKeys(hiddenColKeys);
-    setCacheSortCols(sortCols);
-  }); // useToggleEffect
-  // 当 visible 由 false 变为 true 时触发
-
-  var prevShowPopperRef = (0, _react.useRef)(!showPopper);
-  (0, _react.useEffect)(function () {
-    if (!prevShowPopperRef.current && showPopper) {
-      resetLatest();
-    }
-
-    prevShowPopperRef.current = showPopper;
-  }, [showPopper]); // useVisibleEffect
-
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
-    ref: colMenuRef,
-    className: 'hi-table__setting-btn',
-    onClick: function onClick() {
-      setShowPopper(!showPopper);
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
-    name: "set"
-  })), /*#__PURE__*/_react["default"].createElement(_popper["default"], {
-    show: showPopper,
-    attachEle: colMenuRef.current,
-    zIndex: 1040,
-    placement: "bottom-end",
-    width: "250"
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    ref: popperMenu,
-    className: "theme__".concat(theme, " hi-table__setting-menu")
-  }, /*#__PURE__*/_react["default"].createElement(_reactBeautifulDnd.DragDropContext, {
-    onDragEnd: function onDragEnd(result) {
-      if (result.destination) {
-        var _sortCol = (0, _toConsumableArray2["default"])(cacheSortCols);
-
-        var _sortCol$splice = _sortCol.splice(result.source.index, 1),
-            _sortCol$splice2 = (0, _slicedToArray2["default"])(_sortCol$splice, 1),
-            removed = _sortCol$splice2[0];
-
-        _sortCol.splice(result.destination.index, 0, removed);
-
-        setCacheSortCols(_sortCol);
-      }
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_reactBeautifulDnd.Droppable, {
-    droppableId: "droppable"
-  }, function (provided, snapshot) {
-    return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, provided.droppableProps, {
-      ref: provided.innerRef,
-      style: Object.assign({
-        marginTop: 8,
-        width: 276,
-        boxSizing: 'border-box',
-        background: '#fff',
-        boxShadow: '0px 2px 8px 0px rgba(56,62,71,0.1)',
-        borderRadius: 4,
-        border: '1px solid rgba(231,231,231,1)'
-      }, getListStyle(snapshot.isDraggingOver))
-    }, provided.droppableProps), /*#__PURE__*/_react["default"].createElement("div", {
-      style: {
-        padding: '16px 20px'
-      }
-    }, cacheSortCols.map(function (c, index) {
-      return /*#__PURE__*/_react["default"].createElement(_reactBeautifulDnd.Draggable, {
-        key: getColKeyValue(c),
-        draggableId: getColKeyValue(c),
-        index: index
-      }, function (provided, snapshot) {
-        return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
-          ref: provided.innerRef
-        }, provided.draggableProps, provided.dragHandleProps, {
-          style: Object.assign({
-            height: 28,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'space-between'
-          }, getItemStyle(snapshot.isDragging, provided.draggableProps.style))
-        }), /*#__PURE__*/_react["default"].createElement("div", {
-          style: {
-            display: 'flex',
-            alignItems: 'center'
-          }
-        }, /*#__PURE__*/_react["default"].createElement(_switch["default"], {
-          checked: !cacheHiddenColKeys.includes(getColKeyValue(c)),
-          onChange: function onChange(shouldChecked) {
-            var nextCacheHiddenColKeys = shouldChecked ? cacheHiddenColKeys.filter(function (col) {
-              return col !== getColKeyValue(c);
-            }) : cacheHiddenColKeys.concat(getColKeyValue(c));
-            setCacheHiddenColKeys(nextCacheHiddenColKeys);
-          }
-        }), /*#__PURE__*/_react["default"].createElement("span", {
-          style: {
-            display: 'inline-block',
-            marginLeft: 9
-          }
-        }, typeof c.title === 'function' ? c.title() : c.title)), /*#__PURE__*/_react["default"].createElement(_icon["default"], {
-          name: "columns"
-        }));
-      });
-    })), provided.placeholder, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "btn-group"
-    }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "btn btn--left",
-      onClick: function onClick(e) {
-        setShowPopper(false); // 触发 table 更新列显隐及排序
-
-        setHiddenColKeys(cacheHiddenColKeys);
-        setSortCols(cacheSortCols);
-      }
-    }, localeDatas.table.confirm), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "btn",
-      onClick: resetLatest
-    }, localeDatas.table.reset)));
-  })))));
-};
-
-var _default = SettingMenu;
-exports["default"] = _default;