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

Floating Menu + Text-Align doesn't show when any alignment is selected #1043

Closed
lostdesign opened this issue Apr 6, 2021 · 5 comments · Fixed by #1714
Closed

Floating Menu + Text-Align doesn't show when any alignment is selected #1043

lostdesign opened this issue Apr 6, 2021 · 5 comments · Fixed by #1714

Comments

@lostdesign
Copy link

What happens?
Using the floating menu and selecting center/right alignment using the text-align extension, will work fine for the first line. On newline, the floating menu will not appear again, which is a bit frustrating.

I am not sure wether is desired or not, surely makes sense to keep the formatting from before, though the floating menu will no longer appear, unless you have another way of setting text-align back to left.

How can others reproduce the issue?
Steps to reproduce the behavior:

  1. Remove all text in editor
  2. Write some text
  3. Add new line
  4. Select center/right formatting in floating menu
  5. Add new line
  6. Menu is gone and no longer accessible

Create a new Codesandbox replicating your error
https://codesandbox.io/s/tiptap-issue-template-forked-5ngm8?file=/src/components/Tiptap.vue

What behavior did you expect?
I think, despite having an active text-align formatting, the floating menu should still show or default back to left aligned or what ever the default should be? There for I'd say just showing the floating menu again would solve this issue, as you are "forever" stuck in the last text-align option you chose.

Do you have a screenshot?
Bildschirmfoto 2021-04-06 um 10 01 57

What’s your environment?

  • macOS Catalina
  • Chrome latest
  • Desktop

What else?
<3

@philippkuehn
Copy link
Contributor

Okay the issue is that the floating menu is only visible for a new default block (in most cases a paragraph) with default attributes (in most cases an empty object). When using the text align extension with centered align, the attributes are not the default attributes anymore (left align).

Hmm, not sure about this at the moment!

@lostdesign
Copy link
Author

Not sure myself either. For bulletlist/todos I'd say it totally make sense that any new line has a bulletlist/todo item. For the alignment I am unsure however, kinda makes sense to keep the alignment going although if you are just using the floating menu, the only way back out is by using shortcuts. My current work around is by also using the bubble menu, which requires someone to write text, highlight any part of it to access the bubble menu which then allows the user to set a different alignment.

@lostdesign
Copy link
Author

Cannot find any other editor right now that has text-align features in a floating menu. Medium seems to not offer alignment at all it seems, perhaps I'm dropping that feature as well.

@mariohamann
Copy link

mariohamann commented Apr 7, 2021

Cannot find any other editor right now that has text-align features in a floating menu. Medium seems to not offer alignment at all it seems, perhaps I'm dropping that feature as well.

I found this one: https://www.tiny.cloud/docs/demo/inline/
Maybe it helps?

@lostdesign
Copy link
Author

Cannot find any other editor right now that has text-align features in a floating menu. Medium seems to not offer alignment at all it seems, perhaps I'm dropping that feature as well.

I found this one: https://www.tiny.cloud/docs/demo/inline/
Maybe it helps?

Not exactly, they have only a demo of predefined blocks that you can modify - cannot recreate the behaviour of a new block but I'd expect it to work like in their demo, the menu floats above a block, which isn't really inline ^^

@hanspagel hanspagel transferred this issue from ueberdosis/tiptap-next Apr 21, 2021
@hanspagel hanspagel added the v2 label Apr 21, 2021
philippkuehn added a commit that referenced this issue Aug 11, 2021
…1043, fix #1268, fix #1503)

* add key option to bubble menu

* ignore react for now

* add shouldShow option to bubble menu extension

* improve types

* remove BubbleMenuPluginKey

* add key and shouldShow option to floating menu extension

* fix: don’t show floating menu within code block

* docs: add new menu options
andrewlu0 pushed a commit to trybaseplate/tiptap that referenced this issue Oct 20, 2023
, fix ueberdosis#1043, fix ueberdosis#1268, fix ueberdosis#1503)

* add key option to bubble menu

* ignore react for now

* add shouldShow option to bubble menu extension

* improve types

* remove BubbleMenuPluginKey

* add key and shouldShow option to floating menu extension

* fix: don’t show floating menu within code block

* docs: add new menu options
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants