diff --git a/.changeset/healthy-kangaroos-applaud.md b/.changeset/healthy-kangaroos-applaud.md new file mode 100644 index 000000000..7121b4ce2 --- /dev/null +++ b/.changeset/healthy-kangaroos-applaud.md @@ -0,0 +1,5 @@ +--- +"markdown-it-myst": patch +--- + +Add inline options diff --git a/.changeset/pink-birds-join.md b/.changeset/pink-birds-join.md new file mode 100644 index 000000000..e39481903 --- /dev/null +++ b/.changeset/pink-birds-join.md @@ -0,0 +1,6 @@ +--- +"myst-directives": patch +"myst-transforms": patch +--- + +Move QMD admonition recognition to a transform diff --git a/.changeset/small-paws-suffer.md b/.changeset/small-paws-suffer.md new file mode 100644 index 000000000..db61233a3 --- /dev/null +++ b/.changeset/small-paws-suffer.md @@ -0,0 +1,5 @@ +--- +"myst-directives": patch +--- + +div node does not require a body diff --git a/.changeset/tough-terms-push.md b/.changeset/tough-terms-push.md new file mode 100644 index 000000000..0786edf6e --- /dev/null +++ b/.changeset/tough-terms-push.md @@ -0,0 +1,5 @@ +--- +"myst-roles": patch +--- + +Introduce a span role diff --git a/docs/inline-options.md b/docs/inline-options.md new file mode 100644 index 000000000..d051824de --- /dev/null +++ b/docs/inline-options.md @@ -0,0 +1,50 @@ +--- +title: Inline Options +# subtitle: Generate figures and other rich content using Jupyter kernels +# short_title: Execute During Build +# description: MyST can execute Markdown files and Jupyter Notebooks, making it possible to build rich websites from computational documents. +# thumbnail: thumbnails/execute-notebooks.png +--- + +MyST Markdown is introducing inline attributes for both roles and directives, allowing concise specification of CSS classes, IDs, and attributes. This complements existing methods for defining options, making markup more expressive and flexible. + +```markdown +:::{tip .dropdown open="true"} Title +Tip Content +::: +``` + +This can also be used for roles: + +`` {span .text-red-500}`Red text` `` + +{span .text-red-500}`Red text` + +## Syntax Overview + +The inline attribute syntax follows this pattern: + +````text +{role #id .class key="value" key=value}`content` + +```{directive #id .class key="value" key=value} +content +``` +```` + +Name (e.g. `tip` or `cite:p`) +: The directive or role name must come first. There must only be a single "bare" token. + +ID (`#id`) +: Defines the label/identifier of the node + +Class (`.class`) +: Adds CSS class(es). + +Quoted Attributes (`key="value"`) +: Supports attributes containing spaces or special characters. + +Unquoted Attributes (`key=value` or `key=123`) +: Allows simpler attribute values. + +For directives, these can be mixed with other ways to define options on directives, classes are combined in a single string other repeated directive options will raise a duplicate option warning. diff --git a/docs/myst.yml b/docs/myst.yml index 665039658..e2f1137cb 100644 --- a/docs/myst.yml +++ b/docs/myst.yml @@ -101,6 +101,7 @@ project: - file: glossaries-and-terms.md - file: writing-in-latex.md - file: table-of-contents.md + - file: inline-options.md - title: Executable Content children: - file: notebooks-with-markdown.md diff --git a/packages/markdown-it-myst/src/directives.ts b/packages/markdown-it-myst/src/directives.ts index e5477adfe..01abf8362 100644 --- a/packages/markdown-it-myst/src/directives.ts +++ b/packages/markdown-it-myst/src/directives.ts @@ -5,6 +5,7 @@ import type MarkdownIt from 'markdown-it/lib'; import type StateCore from 'markdown-it/lib/rules_core/state_core.js'; import { nestedPartToTokens } from './nestedParse.js'; import { stateError, stateWarn } from './utils.js'; +import { inlineOptionsToTokens } from './inlineAttributes.js'; const COLON_OPTION_REGEX = /^:(?