sense-react-timeline-editor 1.1.23 → 1.1.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.esm.js +28 -16
  2. package/dist/index.js +28 -16
  3. package/package.json +1 -1
package/dist/index.esm.js CHANGED
@@ -3160,7 +3160,14 @@ var useRowSelection = function useRowSelection(options) {
3160
3160
  }
3161
3161
  },
3162
3162
  onSelectionEnd: function onSelectionEnd() {
3163
- // 框选结束时的处理（可用于性能优化）
3163
+ // 清除框选框
3164
+ setTimeout(function () {
3165
+ var selectionBoxes = document.querySelectorAll('.timeline-editor-selection-box');
3166
+ Array.from(selectionBoxes).forEach(function (selectionBox) {
3167
+ // @ts-expect-error 忽略类型检查错误
3168
+ selectionBox.style.left = '-10px';
3169
+ });
3170
+ }, 0);
3164
3171
  },
3165
3172
  shouldStartSelecting: function shouldStartSelecting(target) {
3166
3173
  var _element$closest, _element$closest2, _element$closest3, _element$closest4;
@@ -3177,7 +3184,8 @@ var useRowSelection = function useRowSelection(options) {
3177
3184
  style: {
3178
3185
  border: '2px solid #1890ff',
3179
3186
  backgroundColor: 'rgba(24, 144, 255, 0.1)',
3180
- zIndex: 9999
3187
+ zIndex: 9999,
3188
+ left: '-10px'
3181
3189
  }
3182
3190
  },
3183
3191
  isEnabled: !disabled,
@@ -3629,7 +3637,7 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
3629
3637
  var handleUploadChange = function handleUploadChange(row) {
3630
3638
  return /*#__PURE__*/function () {
3631
3639
  var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(info) {
3632
- var _info$file$response, _info$file;
3640
+ var _info$file$response, _info$file, _info$file$response2;
3633
3641
  var maxSize, hasDefault, totalDuration, _newAction, uid, duration, newAction;
3634
3642
  return _regenerator().w(function (_context) {
3635
3643
  while (1) switch (_context.n) {
@@ -3714,7 +3722,8 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
3714
3722
  isUpload: true,
3715
3723
  segment_type: 'bgm',
3716
3724
  isUploading: false,
3717
- uid: (_info$file = info.file) === null || _info$file === void 0 ? void 0 : _info$file.uid
3725
+ uid: (_info$file = info.file) === null || _info$file === void 0 ? void 0 : _info$file.uid,
3726
+ waveform: ((_info$file$response2 = info.file.response) === null || _info$file$response2 === void 0 ? void 0 : _info$file$response2.peaks) || []
3718
3727
  };
3719
3728
  onUpdateEditorData === null || onUpdateEditorData === void 0 ? void 0 : onUpdateEditorData(row, [newAction]);
3720
3729
  case 7:
@@ -4363,13 +4372,14 @@ var TimeArea = function TimeArea(_ref) {
4363
4372
  height: height
4364
4373
  },
4365
4374
  onClick: function onClick(e) {
4375
+ var _timelineEditorEl$scr;
4366
4376
  if (hideCursor) return;
4377
+ var timelineEditorEl = document.querySelector('.timeline-editor');
4367
4378
  var rect = e.currentTarget.getBoundingClientRect();
4368
4379
  var position = e.clientX - rect.x;
4369
- var left = Math.max(position, startLeft);
4370
- // const left = Math.max(position + scrollLeft, startLeft);
4380
+ var actualScrollLeft = (_timelineEditorEl$scr = timelineEditorEl === null || timelineEditorEl === void 0 ? void 0 : timelineEditorEl.scrollLeft) !== null && _timelineEditorEl$scr !== void 0 ? _timelineEditorEl$scr : scrollLeft;
4381
+ var left = Math.max(position + actualScrollLeft, startLeft);
4371
4382
  if (left > maxScaleCount * scaleWidth + startLeft) return;
4372
- // if (left > maxScaleCount * scaleWidth + startLeft - scrollLeft) return;
4373
4383
  var time = parserPixelToTime(left, {
4374
4384
  startLeft: startLeft,
4375
4385
  scale: scale,
@@ -4830,11 +4840,13 @@ var Timeline = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (p
4830
4840
  };
4831
4841
  });
4832
4842
  var onClickTimeline = useCallback(function (e) {
4833
- var _e$target;
4843
+ var _ref2, _timelineEditorEl$scr, _scrollSync$current2, _e$target;
4834
4844
  if (!domRef.current) return;
4845
+ var timelineEditorEl = document.querySelector('.timeline-editor');
4835
4846
  var rect = domRef.current.getBoundingClientRect();
4836
4847
  var position = e.clientX - rect.x;
4837
- var left = position + scrollSync.current.state.scrollLeft;
4848
+ var scrollLeft = (_ref2 = (_timelineEditorEl$scr = timelineEditorEl === null || timelineEditorEl === void 0 ? void 0 : timelineEditorEl.scrollLeft) !== null && _timelineEditorEl$scr !== void 0 ? _timelineEditorEl$scr : (_scrollSync$current2 = scrollSync.current) === null || _scrollSync$current2 === void 0 ? void 0 : _scrollSync$current2.state.scrollLeft) !== null && _ref2 !== void 0 ? _ref2 : 0;
4849
+ var left = position + scrollLeft;
4838
4850
  var time = parserPixelToTime(left, {
4839
4851
  startLeft: startLeft,
4840
4852
  scale: scale,
@@ -4904,9 +4916,9 @@ var Timeline = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (p
4904
4916
  className: "".concat(className || '', " ").concat(theme || '', " ").concat(PREFIX, " ").concat(disableDrag ? PREFIX + '-disable' : '')
4905
4917
  }, /*#__PURE__*/React.createElement(ScrollSync, {
4906
4918
  ref: scrollSync
4907
- }, function (_ref2) {
4908
- var scrollTop = _ref2.scrollTop,
4909
- _onScroll = _ref2.onScroll;
4919
+ }, function (_ref3) {
4920
+ var scrollTop = _ref3.scrollTop,
4921
+ _onScroll = _ref3.onScroll;
4910
4922
  var scrollLeft = (containerEl === null || containerEl === void 0 ? void 0 : containerEl.scrollLeft) || 0;
4911
4923
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TimeArea, _objectSpread2(_objectSpread2({}, checkedProps), {}, {
4912
4924
  timelineWidth: width,
@@ -4921,8 +4933,8 @@ var Timeline = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (p
4921
4933
  cursorRef: cursorRef
4922
4934
  })), areaCount === 1 ? (/*#__PURE__*/React.createElement(EditArea, _objectSpread2(_objectSpread2({}, checkedProps), {}, {
4923
4935
  timelineWidth: width,
4924
- ref: function ref(_ref3) {
4925
- return areaRef.current = _ref3 === null || _ref3 === void 0 ? void 0 : _ref3.domRef.current;
4936
+ ref: function ref(_ref4) {
4937
+ return areaRef.current = _ref4 === null || _ref4 === void 0 ? void 0 : _ref4.domRef.current;
4926
4938
  },
4927
4939
  disableDrag: disableDrag || isPlaying,
4928
4940
  editorData: editorData,
@@ -4983,8 +4995,8 @@ var Timeline = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (p
4983
4995
  }, checkedProps), {}, {
4984
4996
  className: index !== 0 ? "no-flex ".concat(key, " ").concat(index, " overflow-hidden") : "overflow-hidden ".concat(key, " ").concat(index),
4985
4997
  timelineWidth: width,
4986
- ref: function ref(_ref4) {
4987
- return areaRef.current = _ref4 === null || _ref4 === void 0 ? void 0 : _ref4.domRef.current;
4998
+ ref: function ref(_ref5) {
4999
+ return areaRef.current = _ref5 === null || _ref5 === void 0 ? void 0 : _ref5.domRef.current;
4988
5000
  },
4989
5001
  disableDrag: disableDrag || isPlaying,
4990
5002
  editorData: groupedData[key],
package/dist/index.js CHANGED
@@ -3170,7 +3170,14 @@ var useRowSelection = function useRowSelection(options) {
3170
3170
  }
3171
3171
  },
3172
3172
  onSelectionEnd: function onSelectionEnd() {
3173
- // 框选结束时的处理（可用于性能优化）
3173
+ // 清除框选框
3174
+ setTimeout(function () {
3175
+ var selectionBoxes = document.querySelectorAll('.timeline-editor-selection-box');
3176
+ Array.from(selectionBoxes).forEach(function (selectionBox) {
3177
+ // @ts-expect-error 忽略类型检查错误
3178
+ selectionBox.style.left = '-10px';
3179
+ });
3180
+ }, 0);
3174
3181
  },
3175
3182
  shouldStartSelecting: function shouldStartSelecting(target) {
3176
3183
  var _element$closest, _element$closest2, _element$closest3, _element$closest4;
@@ -3187,7 +3194,8 @@ var useRowSelection = function useRowSelection(options) {
3187
3194
  style: {
3188
3195
  border: '2px solid #1890ff',
3189
3196
  backgroundColor: 'rgba(24, 144, 255, 0.1)',
3190
- zIndex: 9999
3197
+ zIndex: 9999,
3198
+ left: '-10px'
3191
3199
  }
3192
3200
  },
3193
3201
  isEnabled: !disabled,
@@ -3639,7 +3647,7 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
3639
3647
  var handleUploadChange = function handleUploadChange(row) {
3640
3648
  return /*#__PURE__*/function () {
3641
3649
  var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(info) {
3642
- var _info$file$response, _info$file;
3650
+ var _info$file$response, _info$file, _info$file$response2;
3643
3651
  var maxSize, hasDefault, totalDuration, _newAction, uid, duration, newAction;
3644
3652
  return _regenerator().w(function (_context) {
3645
3653
  while (1) switch (_context.n) {
@@ -3724,7 +3732,8 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
3724
3732
  isUpload: true,
3725
3733
  segment_type: 'bgm',
3726
3734
  isUploading: false,
3727
- uid: (_info$file = info.file) === null || _info$file === void 0 ? void 0 : _info$file.uid
3735
+ uid: (_info$file = info.file) === null || _info$file === void 0 ? void 0 : _info$file.uid,
3736
+ waveform: ((_info$file$response2 = info.file.response) === null || _info$file$response2 === void 0 ? void 0 : _info$file$response2.peaks) || []
3728
3737
  };
3729
3738
  onUpdateEditorData === null || onUpdateEditorData === void 0 ? void 0 : onUpdateEditorData(row, [newAction]);
3730
3739
  case 7:
@@ -4373,13 +4382,14 @@ var TimeArea = function TimeArea(_ref) {
4373
4382
  height: height
4374
4383
  },
4375
4384
  onClick: function onClick(e) {
4385
+ var _timelineEditorEl$scr;
4376
4386
  if (hideCursor) return;
4387
+ var timelineEditorEl = document.querySelector('.timeline-editor');
4377
4388
  var rect = e.currentTarget.getBoundingClientRect();
4378
4389
  var position = e.clientX - rect.x;
4379
- var left = Math.max(position, startLeft);
4380
- // const left = Math.max(position + scrollLeft, startLeft);
4390
+ var actualScrollLeft = (_timelineEditorEl$scr = timelineEditorEl === null || timelineEditorEl === void 0 ? void 0 : timelineEditorEl.scrollLeft) !== null && _timelineEditorEl$scr !== void 0 ? _timelineEditorEl$scr : scrollLeft;
4391
+ var left = Math.max(position + actualScrollLeft, startLeft);
4381
4392
  if (left > maxScaleCount * scaleWidth + startLeft) return;
4382
- // if (left > maxScaleCount * scaleWidth + startLeft - scrollLeft) return;
4383
4393
  var time = parserPixelToTime(left, {
4384
4394
  startLeft: startLeft,
4385
4395
  scale: scale,
@@ -4840,11 +4850,13 @@ var Timeline = /*#__PURE__*/React__default['default'].memo(/*#__PURE__*/React__d
4840
4850
  };
4841
4851
  });
4842
4852
  var onClickTimeline = React.useCallback(function (e) {
4843
- var _e$target;
4853
+ var _ref2, _timelineEditorEl$scr, _scrollSync$current2, _e$target;
4844
4854
  if (!domRef.current) return;
4855
+ var timelineEditorEl = document.querySelector('.timeline-editor');
4845
4856
  var rect = domRef.current.getBoundingClientRect();
4846
4857
  var position = e.clientX - rect.x;
4847
- var left = position + scrollSync.current.state.scrollLeft;
4858
+ var scrollLeft = (_ref2 = (_timelineEditorEl$scr = timelineEditorEl === null || timelineEditorEl === void 0 ? void 0 : timelineEditorEl.scrollLeft) !== null && _timelineEditorEl$scr !== void 0 ? _timelineEditorEl$scr : (_scrollSync$current2 = scrollSync.current) === null || _scrollSync$current2 === void 0 ? void 0 : _scrollSync$current2.state.scrollLeft) !== null && _ref2 !== void 0 ? _ref2 : 0;
4859
+ var left = position + scrollLeft;
4848
4860
  var time = parserPixelToTime(left, {
4849
4861
  startLeft: startLeft,
4850
4862
  scale: scale,
@@ -4914,9 +4926,9 @@ var Timeline = /*#__PURE__*/React__default['default'].memo(/*#__PURE__*/React__d
4914
4926
  className: "".concat(className || '', " ").concat(theme || '', " ").concat(PREFIX, " ").concat(disableDrag ? PREFIX + '-disable' : '')
4915
4927
  }, /*#__PURE__*/React__default['default'].createElement(reactVirtualized.ScrollSync, {
4916
4928
  ref: scrollSync
4917
- }, function (_ref2) {
4918
- var scrollTop = _ref2.scrollTop,
4919
- _onScroll = _ref2.onScroll;
4929
+ }, function (_ref3) {
4930
+ var scrollTop = _ref3.scrollTop,
4931
+ _onScroll = _ref3.onScroll;
4920
4932
  var scrollLeft = (containerEl === null || containerEl === void 0 ? void 0 : containerEl.scrollLeft) || 0;
4921
4933
  return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(TimeArea, _objectSpread2(_objectSpread2({}, checkedProps), {}, {
4922
4934
  timelineWidth: width,
@@ -4931,8 +4943,8 @@ var Timeline = /*#__PURE__*/React__default['default'].memo(/*#__PURE__*/React__d
4931
4943
  cursorRef: cursorRef
4932
4944
  })), areaCount === 1 ? (/*#__PURE__*/React__default['default'].createElement(EditArea, _objectSpread2(_objectSpread2({}, checkedProps), {}, {
4933
4945
  timelineWidth: width,
4934
- ref: function ref(_ref3) {
4935
- return areaRef.current = _ref3 === null || _ref3 === void 0 ? void 0 : _ref3.domRef.current;
4946
+ ref: function ref(_ref4) {
4947
+ return areaRef.current = _ref4 === null || _ref4 === void 0 ? void 0 : _ref4.domRef.current;
4936
4948
  },
4937
4949
  disableDrag: disableDrag || isPlaying,
4938
4950
  editorData: editorData,
@@ -4993,8 +5005,8 @@ var Timeline = /*#__PURE__*/React__default['default'].memo(/*#__PURE__*/React__d
4993
5005
  }, checkedProps), {}, {
4994
5006
  className: index !== 0 ? "no-flex ".concat(key, " ").concat(index, " overflow-hidden") : "overflow-hidden ".concat(key, " ").concat(index),
4995
5007
  timelineWidth: width,
4996
- ref: function ref(_ref4) {
4997
- return areaRef.current = _ref4 === null || _ref4 === void 0 ? void 0 : _ref4.domRef.current;
5008
+ ref: function ref(_ref5) {
5009
+ return areaRef.current = _ref5 === null || _ref5 === void 0 ? void 0 : _ref5.domRef.current;
4998
5010
  },
4999
5011
  disableDrag: disableDrag || isPlaying,
5000
5012
  editorData: groupedData[key],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sense-react-timeline-editor",
3
- "version": "1.1.23",
3
+ "version": "1.1.25",
4
4
  "author": "xzdarcy",
5
5
  "license": "MIT",
6
6
  "keywords": [