Interactivity for task lists?

[matthewfeickert]

Hi. 👋 Is it possible to enable an extension or an option for MyST that would enable checkboxes to have interactivity (toggle between check and unchecked) when rendered out? That is, is is possible to have

- [x] item A
- [ ] item B

which gets rendered out by GitHub as

• item A
• item B

to have the same ability to click on the checkbox once rendered and switch it check status? I think the answer is no, as I don't think this behavior is in the CommonMark spec but I thought I would ask in the event that there is some sort of community extension that exists to handle this.

Apologies in advance if this has been discussed before. I couldn't find any good results when searching on "checkboxes" in GitHub Issues or Discussions.

[chrisjsewell]

Heya, there is an extension for task lists: https://myst-parser.readthedocs.io/en/latest/syntax/optional.html#task-lists
But it does not currently have interactivity.

My question would be, what would be your use case for the interactivity?
With GitHub toggling, it permanently changes the content of the comment text.
But obviously readers of a jupyter book website could not directly change the source text of the file on the GitHub repository.

[matthewfeickert]

Heya, there is an extension for task lists: https://myst-parser.readthedocs.io/en/latest/syntax/optional.html#task-lists But it does not currently have interactivity.

Thanks. markdown-it-py is nicely included with the other dependencies of Jupyter Book as of sometime before jupyter-book v0.12.3, so it very nicely works out of the box.

My question would be, what would be your use case for the interactivity?

Quite niche, but ticking off ingredients in cooking recipes from your phone as you prepare them 🙂

Though at this point it would be very fair to say "Please go write your own website with extensions, as this is far outside of scope".

With GitHub toggling, it permanently changes the content of the comment text. But obviously readers of a jupyter book website could not directly change the source text of the file on the GitHub repository.

True. Though I figured as things like sphinx-togglebutton exist, this might be possible to get around.

[choldgraf]

you use jupyter book / myst for groceries? this is awesome 😅

so what you're saying is that you'd want pure client-side interactivity, even if it did not change any kind of underlying content on github etc?

[chrisjsewell]

Interesting cheers

The actual markdown-it plugin does allow for the checkboxes to be enabled: https://mdit-py-plugins.readthedocs.io/en/latest/#task-lists.
But this option is not currently "exposed" via myst-parser/jupyter-book

Although obviously that checkbox state change is not "persisted" anywhere, so would revert on any page reload.

You could write some JavaScript, to enable the checkboxes and persist the state in https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
But yeh it's unlikely the core jupyter-book team will have time to work on this 😅

[matthewfeickert]

you use jupyter book / myst for groceries? this is awesome

We've started to write our family cookbook in Jupyter Book. :) @choldgraf Can you tell that I abuse the tools I know too much? 😛

so what you're saying is that you'd want pure client-side interactivity, even if it did not change any kind of underlying content on github etc?
Although obviously that checkbox state change is not "persisted" anywhere, so would revert on any page reload.

Correct. So having it revert on reload is exactly the behavior I want. (If you're preparing dinner you want to know if you've got all the veggies done this time, not that you got them prepared last week. 😉)

The actual markdown-it plugin does allow for the checkboxes to be enabled: https://mdit-py-plugins.readthedocs.io/en/latest/#task-lists.
But this option is not currently "exposed" via myst-parser/jupyter-book

Ah this is interesting. Thanks very much for digging into this more @chrisjsewell. I'll continue to poke at this, but I think that you've answered things for me now. Thanks!