More inline markdown detection?

Bike Outliner
1

Recently, I learned that if you type three dashes (---) followed by a space, Bike will convert it to a horizontal rule (I wish Bike also detected that on a newline instead of a space, but that’s a separate thing).

We have similar recognition with ordered & unordered lists, blockquotes & headings.

I wish Bike also recognized the following styling/markdown:

  1. Highlights (i.e. ==text==)
  2. Bold (i.e. **hello**)
  3. Italics (i.e. __hello__)
  4. Inline code (i.e. `hello`)

So, nearly everything in the Formatting menu :sweat_smile:. Maybe, everything actually? Like, I’d also expect Links to be detected just via markdown syntax.

Bike is truly exceptional software. It lets me think messy and brings calm to chaos. Thank you!

2 Likes
2

What will happen when I **want** to display these `as literals`,

(for example if I’m discussing Markdown)

rather than having them converted to formats ?

1 Like
3

I think by default I probably don’t want to do this, since there are already standard “rich text” ways of doing this. With that said, it should be possible to write an extension that will do this.

I think when I’ve seen other rich text app allow this they don’t try to recognize the entire wrapped syntax such as **hello**, instead they just look for you typing ** and then when you have typed that they will delete the ** and set the formatting mode to strong.

Does that seem like what you would want? Or point me to a rich text app that behaves like you want. Links might be problem case, curious to see how other apps solve… my thinking is coming up with new sequence such as [[ might be best.

1 Like
4

Yep, exactly.

I’ll add this as a plugin, thanks!

5

Let me know if you run into problems.

For a possible starting point look at:

And specifically:

bike.keybindings.addKeybindings({
    keymap: 'text-mode',
    keybindings: {
      "'": (context) => wrapTextSelection("'", "'", context),
      '[': (context) => wrapTextSelection('[', ']', context),
      'Shift-"': (context) => wrapTextSelection('"', '"', context),
      'Shift-{': (context) => wrapTextSelection('{', '}', context),
      'Shift-(': (context) => wrapTextSelection('(', ')', context),
    },
})

For example for strong formatting I think you could.

  1. Add * keybinding like above example code.
  2. In handler function determine if text caret is already placed after an existing *.
  3. If so insert that * and select both ** and apply bold formatting.

This means that next char typed would replace those ** and be strong. It’s a little weird way to do it, but I think currently necessary because I haven’t added API to set typing attributes for a text caret selection… so instead attaching the strong attribute to the ** is needed. See if that works, and if you want I can add API for setting text caret typing attributes later.

6

I don’t know the underlying mechanics, but the two rich text apps that I know of don’t switch font style immediately. Instead, they require you to type out the entire markdown sequence **hello** and press space, similar to how this forum works if you switch it to rich text.

7

Oh, good to know, I think that should be possible to implement too. You could use <SPACE> as the keybinding and run logic in that callback.

I’m not sure that I like that approach as much, but should be possible to implement. My concern is you’ll now need to run the full markdown inline parsing logic on each <SPACE>. And it also seems to lead people in wrong direction… ie you can type Command-B for bold or you can type 4 *'s in the correct syntax for bold. First approach seems learnable and faster.

Please, anyone, do link to your favorite app that does this how you like. Nice think about extensions is should be possible to implement however you like.

3 Likes
8

Here are 3 examples (Day One, Obsidian & Bear). I prefer the way Obsidian handles it, but I think that’s more of a subjective taste preference than anything.

Note that in at least Bear, if you have a space after the first delimiter, it doesn’t change the style of what’s inside of it. So, ** this is not bolded**, but **this is**.

9

I don’t know about Day One, but Bear and Obsidian are specifically Markdown clients, and doesn’t use rich text. They just take the Markdown and then display it as rich text.

Bike is a rich text editor, like Word, Pages and Notes.app.

2 Likes
10

Yes, but with the advent of the bikemd file format, I would expect more built-in native markdown support!

11

At this point I think that’s unlikely to be built in. Bike adds a markdown file format to more easily integrate with markdown ecosystem, but Bike’s runtime editor is still a rich text editor with no internal knowledge of or focus on Markdown.

1 Like
12

Makes sense! Thank you.