From 4bfcbf20ac5aa26b787ee670776786966747a3b8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jordi=20Guti=C3=A9rrez=20Hermoso?= Date: Mon, 5 Aug 2024 11:08:17 -0400 Subject: [PATCH] markdown: document this function --- app/client/lib/markdown.ts | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/app/client/lib/markdown.ts b/app/client/lib/markdown.ts index 49365b08..ce9d1ab5 100644 --- a/app/client/lib/markdown.ts +++ b/app/client/lib/markdown.ts @@ -2,6 +2,24 @@ import { sanitizeHTML } from 'app/client/ui/sanitizeHTML'; import { BindableValue, DomElementMethod, subscribeElem } from 'grainjs'; import { marked } from 'marked'; +/** + * Helper function for using Markdown in grainjs elements. It accepts + * both plain Markdown strings, as well as methods that use an observable. + * Example usage: + * + * cssSection(markdown(t(`# New Markdown Function + * + * We can _write_ [the usual Markdown](https://markdownguide.org) *inside* + * a Grainjs element.`))); + * + * or + * + * cssSection(markdown(use => use(toggle) ? t('The toggle is **on**') : t('The toggle is **off**')); + * + * Markdown strings are easier for our translators to handle, as it's possible + * to include all of the context around a single markdown string without + * breaking it up into separate strings for grainjs elements. + */ export function markdown(markdownObs: BindableValue): DomElementMethod { return elem => subscribeElem(elem, markdownObs, value => setMarkdownValue(elem, value)); }