index.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. var _typeof = require("@babel/runtime/helpers/typeof");
  4. Object.defineProperty(exports, "__esModule", {
  5. value: true
  6. });
  7. exports.default = void 0;
  8. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  9. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  10. var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
  11. var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
  12. var React = _interopRequireWildcard(require("react"));
  13. var _reactDom = require("react-dom");
  14. var _util = require("../util");
  15. var _Handle = _interopRequireDefault(require("./Handle"));
  16. var _excluded = ["prefixCls", "style", "onStartMove", "onOffsetChange", "values", "handleRender", "activeHandleRender", "draggingIndex", "draggingDelete", "onFocus"];
  17. 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); }
  18. 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; }
  19. var Handles = /*#__PURE__*/React.forwardRef(function (props, ref) {
  20. var prefixCls = props.prefixCls,
  21. style = props.style,
  22. onStartMove = props.onStartMove,
  23. onOffsetChange = props.onOffsetChange,
  24. values = props.values,
  25. handleRender = props.handleRender,
  26. activeHandleRender = props.activeHandleRender,
  27. draggingIndex = props.draggingIndex,
  28. draggingDelete = props.draggingDelete,
  29. onFocus = props.onFocus,
  30. restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
  31. var handlesRef = React.useRef({});
  32. // =========================== Active ===========================
  33. var _React$useState = React.useState(false),
  34. _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
  35. activeVisible = _React$useState2[0],
  36. setActiveVisible = _React$useState2[1];
  37. var _React$useState3 = React.useState(-1),
  38. _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
  39. activeIndex = _React$useState4[0],
  40. setActiveIndex = _React$useState4[1];
  41. var onActive = function onActive(index) {
  42. setActiveIndex(index);
  43. setActiveVisible(true);
  44. };
  45. var onHandleFocus = function onHandleFocus(e, index) {
  46. onActive(index);
  47. onFocus === null || onFocus === void 0 || onFocus(e);
  48. };
  49. var onHandleMouseEnter = function onHandleMouseEnter(e, index) {
  50. onActive(index);
  51. };
  52. // =========================== Render ===========================
  53. React.useImperativeHandle(ref, function () {
  54. return {
  55. focus: function focus(index) {
  56. var _handlesRef$current$i;
  57. (_handlesRef$current$i = handlesRef.current[index]) === null || _handlesRef$current$i === void 0 || _handlesRef$current$i.focus();
  58. },
  59. hideHelp: function hideHelp() {
  60. (0, _reactDom.flushSync)(function () {
  61. setActiveVisible(false);
  62. });
  63. }
  64. };
  65. });
  66. // =========================== Render ===========================
  67. // Handle Props
  68. var handleProps = (0, _objectSpread2.default)({
  69. prefixCls: prefixCls,
  70. onStartMove: onStartMove,
  71. onOffsetChange: onOffsetChange,
  72. render: handleRender,
  73. onFocus: onHandleFocus,
  74. onMouseEnter: onHandleMouseEnter
  75. }, restProps);
  76. return /*#__PURE__*/React.createElement(React.Fragment, null, values.map(function (value, index) {
  77. var dragging = draggingIndex === index;
  78. return /*#__PURE__*/React.createElement(_Handle.default, (0, _extends2.default)({
  79. ref: function ref(node) {
  80. if (!node) {
  81. delete handlesRef.current[index];
  82. } else {
  83. handlesRef.current[index] = node;
  84. }
  85. },
  86. dragging: dragging,
  87. draggingDelete: dragging && draggingDelete,
  88. style: (0, _util.getIndex)(style, index),
  89. key: index,
  90. value: value,
  91. valueIndex: index
  92. }, handleProps));
  93. }), activeHandleRender && activeVisible && /*#__PURE__*/React.createElement(_Handle.default, (0, _extends2.default)({
  94. key: "a11y"
  95. }, handleProps, {
  96. value: values[activeIndex],
  97. valueIndex: null,
  98. dragging: draggingIndex !== -1,
  99. draggingDelete: draggingDelete,
  100. render: activeHandleRender,
  101. style: {
  102. pointerEvents: 'none'
  103. },
  104. tabIndex: null,
  105. "aria-hidden": true
  106. })));
  107. });
  108. if (process.env.NODE_ENV !== 'production') {
  109. Handles.displayName = 'Handles';
  110. }
  111. var _default = exports.default = Handles;