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

Range of WYSIWYG Editor Table Handling Improvements #4850

Merged
merged 5 commits into from
Feb 17, 2024

Conversation

ssddanbrown
Copy link
Member

@ssddanbrown ssddanbrown commented Feb 15, 2024

Range of fixes and improvements to handling tables, especially in regard to cleaning complex scenarios from tables imported from apps like word. We won't support all word-like content/formatting, but we can make handling that easier.

Related to #4845, #4844, #4843, #985

Changes

  • Updates TinyMCE to latest version.
  • Updates cell selection styles to avoid overflow scrolling on chromium browsers.
  • Adds some custom clear-format action handling to properly clear table cell styles on cell range selection.
  • Adds "Clear table formatting" menu option to remove styles/sizes from the table and everything within.
  • Adds "Resize to contents" menu option to remove just sizes from the table and everything within.

Todo

  • See if we can dynamically show table header row toggle on first row selection.
  • See if we can alter table menu to add:
    • Clear all table formatting option.
    • Clear all table sizing option (fit cells to content).
  • Fully test on edge in Win11 environment, with copied content from Word.

@ssddanbrown
Copy link
Member Author

Preview of new table format clear and table resize menu options:

Screencast.from.2024-02-16.14-40-22.webm

Shows in table context toolbar when in the first row.
@ssddanbrown ssddanbrown merged commit 9ff9b9c into development Feb 17, 2024
20 of 23 checks passed
@ssddanbrown ssddanbrown deleted the table_improvements branch February 17, 2024 16:40
@Roemer
Copy link

Roemer commented Mar 10, 2024

This is already pretty cool, a few questions:

  • Any specific reason that you didn't also add tablecolheader to make columns headers?
  • Why allow headers only on the first row? Others could be headers too.
  • I am trying to use your tableclearformatting and tableclearsizes in a custom header like:
    mceConfig.toolbar = [
      mceConfig.toolbar,
      'table tableinsertdialog tableclearformatting tableclearsizes | tableinsertrowbefore tableinsertrowafter tabledeleterow | tablecutrow tablecopyrow tablepasterowbefore tablepasterowafter | tableinsertcolbefore tableinsertcolafter tabledeletecol | tablemergecells tablesplitcells | tablerowheader tablecolheader | tablecellbackgroundcolor | tabledelete'
    ];

but it does not add the items, any idea here? Are they only menu items?

@ssddanbrown
Copy link
Member Author

Any specific reason that you didn't also add tablecolheader to make columns headers?

Because I hadn't seen any demand for it. I try to avoid any additions without clear need, even if simple to add.

Why allow headers only on the first row? Others could be headers too.

Because this is the most significant use-case. You can still make other rows headers if needed via the menu system, but the aim was to make the common case accessible. Plus it keeps the toolbar minimally complex unless there's a mucher higher chance of needing that action.

but it does not add the items, any idea here? Are they only menu items?

Yeah, don't think the main toolbars directly support having menu items added to.
You'd need to create buttons that have the same actions (exec the relevant commands).

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

Successfully merging this pull request may close these issues.

2 participants