Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How can I resize the dragged event from outside? #2678

Closed
4 of 5 tasks
wakkihaya opened this issue Nov 13, 2024 · 1 comment
Closed
4 of 5 tasks

How can I resize the dragged event from outside? #2678

wakkihaya opened this issue Nov 13, 2024 · 1 comment
Labels

Comments

@wakkihaya
Copy link

Check that this is really a bug

  • I confirm

Reproduction link

https://jquense.github.io/react-big-calendar/examples/index.html?path=/docs/addons-drag-and-drop-props--on-drop-from-outside

Bug description

Is there a way to resize a dragged event from outside?

Steps to reproduce

  1. Drag an event onto the calendar’s 1-Day view.
  2. Hover over the newly dragged event.
    => The resize icon should appear. But not in real.

====

I’ve found a temporary workaround: by forcing the component to re-render after dragging, the dragged item converts from a preview item to an event item, allowing resizing. However, this causes a scrolling issue on the calendar after re-rendering , where I’d like to maintain the same y-position in the scrollable calendar view.

Screen.Recording.2024-11-13.at.19.19.57.mov

Expected Behavior

No response

Actual Behavior

No response

react-big-calendar version

1.15.0

React version

17.0.2

Platform/Target and Browser Versions

macOS

Validations

  • Read the docs.
  • Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
  • Make sure this is a react-big-calendar issue and not an implementation issue

Would you like to open a PR for this bug?

  • I'm willing to open a PR
@wakkihaya wakkihaya added the bug label Nov 13, 2024
@ardenc
Copy link

ardenc commented Nov 22, 2024

My dropped from outside events are draggable after dropping. You should just have to use the draggableAccessor property I believe.

   const draggableAccessor = useCallback((event: Event) => {
      // * note logic can be added to make certain events not draggable.
      return true;
   }, []);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants