search

facebook / lexical

Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance.
https://lexical.dev
MIT License
17.5k stars 1.45k forks source link

feat(lexical-playground): draggable block #2860

Closed LuciNyan closed 1 year ago

LuciNyan commented 1 year ago

Description

Add draggable block plugin

https://user-images.githubusercontent.com/22126563/190201193-3784dc18-7214-4b48-afba-ade0b5aa288d.mov

Close: #2115

vercel[bot] commented 1 year ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
lexical ✅ Ready (Inspect) Visit Preview Sep 17, 2022 at 1:21PM (UTC)
lexical-playground ✅ Ready (Inspect) Visit Preview Sep 17, 2022 at 1:21PM (UTC)
hustlefueled commented 1 year ago

I tried the deployment on the playground. Don't think this works yet. Or am I too early here? 🤔

LuciNyan commented 1 year ago

I tried the deployment on the playground. Don't think this works yet. Or am I too early here? 🤔

Yes, It's WIP, there is currently no drop handling.

LuciNyan commented 1 year ago

Hi @hustlefueled. Now it's working properly, but I haven't finished processing all the cases.

echarles commented 1 year ago

Tested on the deployed playground and it works beautifully for paragraphs, images... move. Maybe the handle could be vertically positioned at the top instead of at the middle (not sure what other editors do).

hustlefueled commented 1 year ago

Works for me too now. Looks good.

fantactuka commented 1 year ago

This PR is amazing! @LuciNyan do you plan any changes to it, otherwise can help with rebasing if needed and it should go to a playground!

LuciNyan commented 1 year ago

This PR is amazing! @LuciNyan do you plan any changes to it, otherwise can help with rebasing if needed and it should go to a playground!

Hi @fantactuka. This PR is not yet able to be used, it has some flaws and doesn't cover all cases. I'm sorry I may not be able to fix them for a while because my baby is sick, but I'll be back as soon as I can.

LuciNyan commented 1 year ago

Hi @fantactuka @acywatson! This PR is ready to be reviewed! XD

LuciNyan commented 1 year ago

Glad you like it! 😄 And Thank you for providing a lot of useful food for thought.

  • Locally, I had to add anchorEl.scrollTop to the computed top of both the drag handler and the drop target to account for scrollable containers.

I don't quite understand. Could you give me a specific example?

  • The drop action seems a little flaky. Sometimes it won't work, depending on where your mouse is when releasing the mouse.

I have noticed that this happens when I drag to the very end of the content and then drag down. Do you mean this scenario? If you are talking about other scenarios, Could you provide the steps to reproduce them?

fantactuka commented 1 year ago

Thanks @LuciNyan for amazing feature! Any improvements can go separately, and I believe many people would be happy to play around draggable blocks

silvergravel commented 8 months ago

Any ETA on when / if this implementation will be shifted to @lexical/react?

amilich commented 3 months ago

Any ETA on when / if this implementation will be shifted to @lexical/react?

is this usable in the react library yet?

ivailop7 commented 3 months ago

Any ETA on when / if this implementation will be shifted to @lexical/react?

is this usable in the react library yet?

This has been available for a year+ in the playground. The plugin code is available inside the playground folder in the repo.