Zettlr: [FEATURE] TableEditor Overhaul (Syntax Highlighting, Actions, etc.)

[nathanlesage]

_Edited on Sept, 22th, 2020._

Description

As these issues tend to amount a lot, I'll open this meta issue. So please DO NOT open an issue if it pertains anything from "why does XYZ not work in the table editor?" To "can we implement ABC for the table editor?"

What is this about? Easy described, but hard to implement. The basic idea is that the contents of the table editor cells work just like the surrounding editor: display pre-rendered content (bold, emphasis, links, images), actions (editing footnotes, following links), and an editing history and the like. This is currently not the case.

Why is this hard to implement?

1. First of all, the cells in the table editor do not use CodeMirror like the main editor window, which means that nothing that works for the editor works in tables as of now.
2. Further, contenteditables are super hard to keep in check, they sometimes do what they want. Which is why as of now the TableEditor does not allow ANY pre-rendering. You can make use of markup in the TableEditor, and it will successfully render during export, but it will not render while editing with Zettlr.
3. Because we have to basically track all the fields all the time, and I personally still don't fully understand how they work.

So I'll keep this issue open to collect anything er should tackle. Issues pertaining to the table editor will rigorously be closed, and OPs will be directed here.

Action Points

• [ ] Check possible breaks with CodeMirror NEXT, as we will switch to that as soon as possible. This is necessary to prevent any double work.
• [ ] Discuss options for the TableEditor: better content editable handling, or tiny CodeMirror-instances?
• [ ] Enable syntax highlighting (bold, italic, strike through, links)
• [ ] Enable an undo/redo history
• [ ] Enable links
• [ ] Enable pre-rendering (images)
• [ ] Enable footnote-support

More features please indicate in the comments. I will then add them here.

[N0rbert]

The rendering inside tables fails with following code fragment:

Table is below

| Column 1                      | Column 2                           |
|:------------------------------|-----------------------------------:|
| **Bold**                      | [Link](https://link)               |
| **Bold text (`inline-code`)** | <https://incorrect-link>           |
| **Bold with escape \`**       | `inline code`                      |
| *Italic text*                 | Text, [**bold link**](https://url) |

In Zettlr 1.6.0 I get garbage:

This code is absolute correct, as both mdl and remark do not report any linting errors.
Other mature editors such as ReText and Typora render it absolutely as expected:

And github renders it correctly

Table is below

| Column 1 | Column 2 |
|:------------------------------|-----------------------------------:|
| Bold | Link |
| Bold text (inline-code) | https://incorrect-link |
| Bold with escape ` | inline code |
| Italic text | Text, bold link |

[nathanlesage]

In Zettlr 1.6.0 I get garbage:

If you would read the issue, you might understand that this is not "garbage", but simply not rendered markup. Please watch your language, I'm doing this all in my free time for no charge.

Other mature editors such as ReText and Typora render it absolutely as expected

Try to export your table, and it will be exported just fine, with all markup applied.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[N0rbert]

Still happens with Zettlr-1.7.0-beta.13-x86_64.AppImage , bug is not fixed.

[nathanlesage]

This is not a bug, it is simply not implemented.

[ekarbe]

Does this issue also address the fact that zettelkasten links do not work in the table?

To repro just set up a table:

| col1 | col2 |
| --- | --- |
| data1 | [[20200723472323]] data2 Data-Two |

Expected behaviour: Zettelkasten ID is a link to the file.
Behaviour: It is rendered as normal text. In the editor and after export.

Or is this intended?

[nathanlesage]

Does this issue also address the fact that zettelkasten links do not work in the table?

Yes, nothing special is currently working in the TableEditor. It does need a refresh, but it's in the backlog for now, because other things have priority. (After all, you should use Markdown tables rather sparsely either way ;)

[frederik-elwert]

A related issue: When applying markup in the table editor, e.g. selecting a word and pressing Ctrl+B, it actually looks like the markup gets applied and rendered (in bold face). But after leaving the table editor, it’s silently discarded. I guess it would be better to disable these shortcuts altogether while in the table editor.

[nathanlesage]

it actually looks like the markup gets applied and rendered (in bold face). But after leaving the table editor, it’s silently discarded. I guess it would be better to disable these shortcuts altogether while in the table editor.

Curious, I can't explain that behaviour, but I think maybe RTF is supported in contenteditable fields (which might be the way we're searching for concerning Markup there)

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[nathanlesage]

Edited to be more generic

[marbetschar]

thanks @nathanlesage for pointing me towards this issue.

On top of the proposed extensions, I'd appreciate if the Zettlr Editor becomes capable of rendering inline LaTeX formulae inserted into a Markdown table:

|   LaTeX | in Table                       |
|---------|--------------------------------|
| $a = b$ |  $\sum_{n = 1}^{\infty} x_{n}$ | 

[nathanlesage]

Short update: I've monkey-patched an HTML preview of the table cells. We need to migrate that whole behemoth to TypeScript soon, before we can actually tackle the rest. But I figured it would at least look nicer.

No interaction, yet (because, hell, when clicking on a cell you are supposed to edit it, right?), and no syntax highlighting, but it looks cool, at least 🤷🏼‍♂️.