feat: Support custom attributes syntax to allow for multiple styles in the text rendering pipeline

[luanpotter]

Description

This is a proposal to extend both our text rendering pipeline and our markdown-parsing capabilities to support more fine-grained styling by leveraging a subset of the extended markdown definition of "custom attributes" (for example, see markdown-it-attrs as an exemplary implementation).

On the markdown side, the syntax will look like this:

[This is a custom class]{.my-custom-class}
This word will be [red]{.red} and this one will be [blue]{.blue}.

Note that the current implementation only supports specifying the class name and will skip other possible permutations.

On the Flame side, we add a new customStyles map to the DocumentStyle class, allowing users to provide as many styles as desired.

Example:

Currently, users have to hijack the existing syntaxes for the desired styles; with the addition of code and strike-through recently I have doubled the possibilities for custom styles, but the solution still remained a hack. Also I now need more styles, and the only way forward is to support arbitrary styling.

While we could consider supporting other attributes, such as id, css styling, etc, within the attribute syntax, the class name is the most flexible and versatile option, and it already solves all use cases, as class names can be used as ids (if desired) and can be used to apply the styling indirectly. I don't see any immediate advantage to supporting more complex constructs within the attributes block (though of course we can iterate as needed).

Checklist

• I have followed the Contributor Guide when preparing my PR.
• I have updated/added tests for ALL new/updated/fixed functionality.
• I have updated/added relevant documentation in docs and added dartdoc comments with ///.
• I have updated/added relevant examples in examples or docs.

Breaking Change?

• Yes, this PR is a breaking change.
• No, this PR is not a breaking change.

[github-actions]

Benchmark Results

Package flame:

Benchmarks	Current Branch [luan.custom-md]	Base Branch [main]	Diff
Render Components Benchmark	989.518 μs	964.761 μs	🔴 +2.566 %
Updating Components Benchmark	342521.000 μs	326599.429 μs	🔴 +4.875 %

---

Benchmarks provided with 💙 by Dart Benchmark Action.

[luanpotter]

sadly we cannot access the file as it is not exported. tbh I do prefer my naming schema though :P

[luanpotter]

we could consider support for other inline elements, for example **foo**{.super-bold}, which is part of markdown-it-attrs.
but I think it is unnecessary because you can just make your custom style bold or whatever you want.

[spydon]

Does this even need a class?

[luanpotter]

No but I thought it was more organized to group these together than let them laying around