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

Rich text editor (WYSIWYG) #571

Open
10 tasks
matthewwong525 opened this issue Apr 9, 2023 · 7 comments
Open
10 tasks

Rich text editor (WYSIWYG) #571

matthewwong525 opened this issue Apr 9, 2023 · 7 comments
Assignees
Labels
enhancement New feature or request

Comments

@matthewwong525
Copy link
Collaborator

matthewwong525 commented Apr 9, 2023

Is your feature request related to a problem? Please describe.
Lots of people want WYSIWYG. And it's hard with limited customizations.

Describe the solution you'd like
Use appflowy-editor and need to test it out with slash commands, link suggestions, tag suggestions #138

I want feature parity with what I have now:

Describe alternatives you've considered
flutter_quill - but no official MD support. also, a bit weird
super_editor - poor documentation & looks complicated to setup for my use case. Not sure if they use context menu builder for commands

Additional context
Will need to wait for when they support mobile: AppFlowy-IO/appflowy-editor#47 (comment)

Subtasks

  • make link preview & link suggestion ( work as expected!
  • highlight [[links]] and make them clickable
  • Make checkboxes render to markdown properly (extra but really nice to have!)
  • Add toolbar similar to how it is right now
  • handle image paste from the web like before (including firefox pasting - maybe not a must have for this one)
  • iOS & Android toolbars
  • make stylesheet look nice
  • fix tests

NON issues (after):

  • source preview resets everytime you open a new note
  • make link suggestions activate from keyboard actions
@matthewwong525 matthewwong525 added the enhancement New feature or request label Apr 9, 2023
@matthewwong525 matthewwong525 changed the title WYSIWYG Rich text editor (WYSIWYG) Apr 11, 2023
@matthewwong525
Copy link
Collaborator Author

matthewwong525 commented Apr 12, 2023

It seems like appflowy editor is not complete yet (no mobile support). i'm thinking of just using super editor + my way of overlaying the previews / context menus. That might be the best solution for now.

@matthewwong525
Copy link
Collaborator Author

I've investigated adding super-editor-wysiwyg but for the following reasons I decided to stop development:

  • Issues with typing really fast and encountering problems
  • Context menus are difficult to implement
  • There is a lot of friction in developing (lots of moving parts with the lib)
    • adding shortcuts was difficult
    • even getting the selection to insert text was a lot of work
    • I got weird bugs when editing
    • markdown checkboxes weren't supported out of the box
    • pasting was a bit wonky and didn't always work even in lists
    • I wasn't confident in the editor to provide a smooth experience for the user

For the reasons above, i'm going to decide to put this on pause & then try again but this time with the appflowy-editor once they figure out mobile support AppFlowy-IO/appflowy-editor#68 (supposedly this quarter)

@annieappflowy
Copy link

@matthewwong525
Copy link
Collaborator Author

matthewwong525 commented May 31, 2023

In case you are interested https://blog-appflowy.ghost.io/how-we-built-a-highly-customizable-rich-text-editor-for-flutter/

Thank you @annieappflowy ! You're doing great work with appflowy by the way :)

@alihassan143
Copy link

@matthewwong525 appflowy now supports mobile platforms you can try now

@matthew-carroll
Copy link

@matthewwong525 I stumbled upon your posts here by happening to notice a reference from super_editor. It sounds like you've run into some issues and difficulties. I would encourage you to file issues, if you haven't already. I'd also encourage you to reach out and let us know what you're building, and how we can make it easier to accomplish your goals.

@annieappflowy
Copy link

Hi @matthewwong525 , we now support iOS and Android. View feature previews here

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

No branches or pull requests

4 participants