[v4] Heading block: `toolbar` option for text writer field ignored

[lukaskleinschmidt]

Description

I found some issues using the writer field marks.

# config A

text:
  label: Text
  type: writer
  inline: true # Does not change anything here
  marks:
    - italic
    - underline
    - strike
  toolbar:
    marks:
      - italic
      - underline
      - strike
      - "|"
      - clear

Actual result (Config A)

Expected result (Config B)

I can get the expected result by using the following config:

# config B

text:
  label: Text
  type: writer
  inline: true
  marks:
    - italic
    - underline
    - strike
    - "|"
    - clear

As far as I can tell from the source code and current informations available the first config (config A) should actually work?

---

Using it in a Block

For this I used a updated heading block.

  …
  text:
    label: field.blocks.heading.text
    type: writer
    inline: true
    placeholder: field.blocks.heading.placeholder
    marks:
      - italic
      - underline
      - strike
      # - "|"
      # - clear
    toolbar:
      marks:
        - italic
        - underline
        - strike
        - "|"
        - clear

Similar behaviour but on top of this the order of the marks is also messed up.

Config A

Config B

Your setup

Kirby Version
4.0.0-beta.1

Sorry for the unaligned Screenshots 😅

[distantnative]

I am not 100% clear what you are trying to achieve.

  marks:
    - italic
    - underline
    - strike
  toolbar:
    marks:
      - italic
      - underline
      - strike
      - "|"
      - clear

Reads as if you want to only enable 3 marks and no others, but then in the toolbar you actually want to list the clear mark that you don't want to enable though.

Maybe you can give some more insight into what you are trying to achieve and what would be expected.

[lukaskleinschmidt]

I was under the impression the the top level marks are the actual marks that the field will accept/allow when for example you paste in some html. And the toolbar.marks are the ones you can use to define what is shown/available in the toolbar.

https://getkirby.com/releases/4.0/writer-field-improvements

[distantnative]

Yes, but if you don't include clean in the top-level option (and thus it's not accepted/allowed), how should it work in the toolbar? You're basically trying to add a mark that you just excluded from being supported.

[lukaskleinschmidt]

The problem here specifically might be that clear is not a mark (HTML tag) in that sense as it just removes formatting. So I probably misunderstood the implementation.

[distantnative]

mark !== HTML tag, sometimes. clear is indeed a mark https://github.com/getkirby/kirby/blob/v4/develop/panel/src/components/Forms/Writer/Marks/Clear.js

If you exclude it from the top-level option, it does not get registered. When you then try to reference it in the toolbar option, Kirby cannot find it as it wasn't registered.

[lukaskleinschmidt]

Makes sense. Thanks for clearing that up. Just got a bit confused with the naming I guess 😅

[distantnative]

Regarding your using in block, that does work for me correctly or I am overlooking something

type: blocks
fieldsets:
  heading:
    fields:
      text:
        label: field.blocks.heading.text
        type: writer
        inline: true
        placeholder: field.blocks.heading.placeholder
        marks:
          - italic
          - underline
          - strike
          - clear
        toolbar:
          marks:
            - italic
            - underline
            - strike
            - "|"
            - clear

[lukaskleinschmidt]

Yes, seems to be fixed in 4.0.0-beta.2. Although one thing I just saw (4.0.0-beta.2). I looks like I get a double border when only including the clear mark. I think it is the same in your screenshot as well.

If I put the link mark back in the borders look fine.

Edit

In addition to that I somehow can't disable the link (or clear) mark in the toolbar. Please forgive me if this looks like nit-picking. It's just that I get a lot of (at least for me) unexpected behaviour. Maybe it is just something I would need to wait for a more detailed documentation.

# Results is the same output as shown in the second screenshot.
# I expected the result to be like the first screenshot.
text:
  label: field.blocks.heading.text
  type: writer
  inline: true
  placeholder: field.blocks.heading.placeholder
  marks:
    - italic
    - underline
    - strike
    - link
    - clear
  toolbar:
    marks:
      - italic
      - underline
      - strike
      - "|"
      - clear

Edit 2

It seems to be related to the wysiwyg: true mode when editing blocks inline. Will try to investigate to see if this is actually a bug…

[distantnative]

@lukaskleinschmidt it's actually related to the heading block. All what you are trying to do works just fine for the text block, but the heading block isn't set up that way where we thought people would try to customize this

[lukaskleinschmidt]

Is this something that might get fixed/updated or should I just set up my own preview? And thanks for looking into this in the first place :)

[distantnative]

Have a fix