sense-react-timeline-editor 1.1.24 → 1.1.26

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.
@@ -12,6 +12,7 @@ export interface UseRowSelectionOptions {
12
12
  export declare const useRowSelection: (options: UseRowSelectionOptions) => {
13
13
  DragSelection: () => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
14
14
  selectedActionIds: string[];
15
+ justFinishedSelectionRef: import("react").MutableRefObject<boolean>;
15
16
  clearSelection: () => void;
16
17
  onClickOutside: (target: HTMLElement) => void;
17
18
  onCtrlClick: (actionId: string, event: MouseEvent) => void;
package/dist/index.esm.js CHANGED
@@ -3095,6 +3095,8 @@ var useRowSelection = function useRowSelection(options) {
3095
3095
  _useState2 = _slicedToArray(_useState, 2),
3096
3096
  selectedActionIds = _useState2[0],
3097
3097
  setSelectedActionIds = _useState2[1];
3098
+ var justFinishedSelectionRef = useRef(false);
3099
+ var selectionResetTimerRef = useRef(null);
3098
3100
  // 计算框选区域与 action 的交集
3099
3101
  var getIntersectedActions = useCallback(function (box) {
3100
3102
  var _containerRef$current, _containerRef$current2;
@@ -3160,7 +3162,22 @@ var useRowSelection = function useRowSelection(options) {
3160
3162
  }
3161
3163
  },
3162
3164
  onSelectionEnd: function onSelectionEnd() {
3163
- // 框选结束时的处理(可用于性能优化)
3165
+ justFinishedSelectionRef.current = true;
3166
+ if (selectionResetTimerRef.current) {
3167
+ clearTimeout(selectionResetTimerRef.current);
3168
+ }
3169
+ selectionResetTimerRef.current = setTimeout(function () {
3170
+ justFinishedSelectionRef.current = false;
3171
+ selectionResetTimerRef.current = null;
3172
+ }, 0);
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);
3164
3181
  },
3165
3182
  shouldStartSelecting: function shouldStartSelecting(target) {
3166
3183
  var _element$closest, _element$closest2, _element$closest3, _element$closest4;
@@ -3177,7 +3194,8 @@ var useRowSelection = function useRowSelection(options) {
3177
3194
  style: {
3178
3195
  border: '2px solid #1890ff',
3179
3196
  backgroundColor: 'rgba(24, 144, 255, 0.1)',
3180
- zIndex: 9999
3197
+ zIndex: 9999,
3198
+ left: '-10px'
3181
3199
  }
3182
3200
  },
3183
3201
  isEnabled: !disabled,
@@ -3222,11 +3240,15 @@ var useRowSelection = function useRowSelection(options) {
3222
3240
  document.addEventListener('keydown', handleKeyDown);
3223
3241
  return function () {
3224
3242
  document.removeEventListener('keydown', handleKeyDown);
3243
+ if (selectionResetTimerRef.current) {
3244
+ clearTimeout(selectionResetTimerRef.current);
3245
+ }
3225
3246
  };
3226
3247
  }, [handleKeyDown]);
3227
3248
  return {
3228
3249
  DragSelection: DragSelection,
3229
3250
  selectedActionIds: Array.from(selectedActionIds),
3251
+ justFinishedSelectionRef: justFinishedSelectionRef,
3230
3252
  clearSelection: clearSelection,
3231
3253
  onClickOutside: handleClickOutside,
3232
3254
  onCtrlClick: handleCtrlClick,
@@ -3629,7 +3651,7 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
3629
3651
  var handleUploadChange = function handleUploadChange(row) {
3630
3652
  return /*#__PURE__*/function () {
3631
3653
  var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(info) {
3632
- var _info$file$response, _info$file;
3654
+ var _info$file$response, _info$file, _info$file$response2;
3633
3655
  var maxSize, hasDefault, totalDuration, _newAction, uid, duration, newAction;
3634
3656
  return _regenerator().w(function (_context) {
3635
3657
  while (1) switch (_context.n) {
@@ -3714,7 +3736,8 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
3714
3736
  isUpload: true,
3715
3737
  segment_type: 'bgm',
3716
3738
  isUploading: false,
3717
- uid: (_info$file = info.file) === null || _info$file === void 0 ? void 0 : _info$file.uid
3739
+ uid: (_info$file = info.file) === null || _info$file === void 0 ? void 0 : _info$file.uid,
3740
+ waveform: ((_info$file$response2 = info.file.response) === null || _info$file$response2 === void 0 ? void 0 : _info$file$response2.peaks) || []
3718
3741
  };
3719
3742
  onUpdateEditorData === null || onUpdateEditorData === void 0 ? void 0 : onUpdateEditorData(row, [newAction]);
3720
3743
  case 7:
@@ -3895,6 +3918,7 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
3895
3918
  }),
3896
3919
  DragSelection = _useRowSelection.DragSelection,
3897
3920
  selectedActionIds = _useRowSelection.selectedActionIds,
3921
+ justFinishedSelectionRef = _useRowSelection.justFinishedSelectionRef,
3898
3922
  onClickOutside = _useRowSelection.onClickOutside,
3899
3923
  onCtrlClick = _useRowSelection.onCtrlClick,
3900
3924
  setSelectedActionIds = _useRowSelection.setSelectedActionIds;
@@ -4163,6 +4187,11 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
4163
4187
  return /*#__PURE__*/React.createElement("div", {
4164
4188
  ref: editAreaRef,
4165
4189
  className: prefix('edit-area') + " ".concat((className || '').replace('timeline-editor', '') || ''),
4190
+ onClickCapture: function onClickCapture(e) {
4191
+ if (!justFinishedSelectionRef.current) return;
4192
+ e.preventDefault();
4193
+ e.stopPropagation();
4194
+ },
4166
4195
  style: {
4167
4196
  height: isMulti ? _totalHeight : 'unset',
4168
4197
  maxHeight: isMulti ? _totalHeight : 'unset',
package/dist/index.js CHANGED
@@ -3105,6 +3105,8 @@ var useRowSelection = function useRowSelection(options) {
3105
3105
  _useState2 = _slicedToArray(_useState, 2),
3106
3106
  selectedActionIds = _useState2[0],
3107
3107
  setSelectedActionIds = _useState2[1];
3108
+ var justFinishedSelectionRef = React.useRef(false);
3109
+ var selectionResetTimerRef = React.useRef(null);
3108
3110
  // 计算框选区域与 action 的交集
3109
3111
  var getIntersectedActions = React.useCallback(function (box) {
3110
3112
  var _containerRef$current, _containerRef$current2;
@@ -3170,7 +3172,22 @@ var useRowSelection = function useRowSelection(options) {
3170
3172
  }
3171
3173
  },
3172
3174
  onSelectionEnd: function onSelectionEnd() {
3173
- // 框选结束时的处理(可用于性能优化)
3175
+ justFinishedSelectionRef.current = true;
3176
+ if (selectionResetTimerRef.current) {
3177
+ clearTimeout(selectionResetTimerRef.current);
3178
+ }
3179
+ selectionResetTimerRef.current = setTimeout(function () {
3180
+ justFinishedSelectionRef.current = false;
3181
+ selectionResetTimerRef.current = null;
3182
+ }, 0);
3183
+ // 清除框选框
3184
+ setTimeout(function () {
3185
+ var selectionBoxes = document.querySelectorAll('.timeline-editor-selection-box');
3186
+ Array.from(selectionBoxes).forEach(function (selectionBox) {
3187
+ // @ts-expect-error 忽略类型检查错误
3188
+ selectionBox.style.left = '-10px';
3189
+ });
3190
+ }, 0);
3174
3191
  },
3175
3192
  shouldStartSelecting: function shouldStartSelecting(target) {
3176
3193
  var _element$closest, _element$closest2, _element$closest3, _element$closest4;
@@ -3187,7 +3204,8 @@ var useRowSelection = function useRowSelection(options) {
3187
3204
  style: {
3188
3205
  border: '2px solid #1890ff',
3189
3206
  backgroundColor: 'rgba(24, 144, 255, 0.1)',
3190
- zIndex: 9999
3207
+ zIndex: 9999,
3208
+ left: '-10px'
3191
3209
  }
3192
3210
  },
3193
3211
  isEnabled: !disabled,
@@ -3232,11 +3250,15 @@ var useRowSelection = function useRowSelection(options) {
3232
3250
  document.addEventListener('keydown', handleKeyDown);
3233
3251
  return function () {
3234
3252
  document.removeEventListener('keydown', handleKeyDown);
3253
+ if (selectionResetTimerRef.current) {
3254
+ clearTimeout(selectionResetTimerRef.current);
3255
+ }
3235
3256
  };
3236
3257
  }, [handleKeyDown]);
3237
3258
  return {
3238
3259
  DragSelection: DragSelection,
3239
3260
  selectedActionIds: Array.from(selectedActionIds),
3261
+ justFinishedSelectionRef: justFinishedSelectionRef,
3240
3262
  clearSelection: clearSelection,
3241
3263
  onClickOutside: handleClickOutside,
3242
3264
  onCtrlClick: handleCtrlClick,
@@ -3639,7 +3661,7 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
3639
3661
  var handleUploadChange = function handleUploadChange(row) {
3640
3662
  return /*#__PURE__*/function () {
3641
3663
  var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(info) {
3642
- var _info$file$response, _info$file;
3664
+ var _info$file$response, _info$file, _info$file$response2;
3643
3665
  var maxSize, hasDefault, totalDuration, _newAction, uid, duration, newAction;
3644
3666
  return _regenerator().w(function (_context) {
3645
3667
  while (1) switch (_context.n) {
@@ -3724,7 +3746,8 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
3724
3746
  isUpload: true,
3725
3747
  segment_type: 'bgm',
3726
3748
  isUploading: false,
3727
- uid: (_info$file = info.file) === null || _info$file === void 0 ? void 0 : _info$file.uid
3749
+ uid: (_info$file = info.file) === null || _info$file === void 0 ? void 0 : _info$file.uid,
3750
+ waveform: ((_info$file$response2 = info.file.response) === null || _info$file$response2 === void 0 ? void 0 : _info$file$response2.peaks) || []
3728
3751
  };
3729
3752
  onUpdateEditorData === null || onUpdateEditorData === void 0 ? void 0 : onUpdateEditorData(row, [newAction]);
3730
3753
  case 7:
@@ -3905,6 +3928,7 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
3905
3928
  }),
3906
3929
  DragSelection = _useRowSelection.DragSelection,
3907
3930
  selectedActionIds = _useRowSelection.selectedActionIds,
3931
+ justFinishedSelectionRef = _useRowSelection.justFinishedSelectionRef,
3908
3932
  onClickOutside = _useRowSelection.onClickOutside,
3909
3933
  onCtrlClick = _useRowSelection.onCtrlClick,
3910
3934
  setSelectedActionIds = _useRowSelection.setSelectedActionIds;
@@ -4173,6 +4197,11 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
4173
4197
  return /*#__PURE__*/React__default['default'].createElement("div", {
4174
4198
  ref: editAreaRef,
4175
4199
  className: prefix('edit-area') + " ".concat((className || '').replace('timeline-editor', '') || ''),
4200
+ onClickCapture: function onClickCapture(e) {
4201
+ if (!justFinishedSelectionRef.current) return;
4202
+ e.preventDefault();
4203
+ e.stopPropagation();
4204
+ },
4176
4205
  style: {
4177
4206
  height: isMulti ? _totalHeight : 'unset',
4178
4207
  maxHeight: isMulti ? _totalHeight : 'unset',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sense-react-timeline-editor",
3
- "version": "1.1.24",
3
+ "version": "1.1.26",
4
4
  "author": "xzdarcy",
5
5
  "license": "MIT",
6
6
  "keywords": [