mdeck 3.10.0 → 3.10.1

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 3.10.1 — 2026-10-11
+
+- Theme settings can be text: `type = "text"` for words a theme shows, such as Terminal's prompt. Authors write them as they should appear (`prompt: "~/demo $ "`), spaces included, and mdeck quotes them for the stylesheet; the editor shows a text box with the theme's own words. Before, such words could only be fixed in the theme.
+
 ## 3.10.0 — 2026-10-11
 
 - Glass has a `motion` setting: `motion: 0` holds its light still, for recordings and calm rooms. The guide for theme authors names the settings themes share: `motion` for what moves while presenting and `texture` for grain, paper and scanlines.

package/docs/reference/authoring.md

@@ -82,7 +82,7 @@ params:
 
 Available params depend on the theme; `mdeck list themes` shows them with the
 kind of value each takes: a size in pixels, a number, a switch (`1` or `0`), a
-choice or a font. `0` or `0px` turns a feature off.
+choice, a font or a text, written as it should appear (`prompt: "~/demo $ "`). `0` or `0px` turns a feature off.
 A font named this way is not downloaded: it has to be installed on the
 computer that shows the slides, or the browser uses the next font in the
 list; PDFs and single files embed only the theme's own fonts. A value that does not fit

package/docs/reference/extensions.md

@@ -201,7 +201,7 @@ Keep headings to a few words; three or four points make a good slide.
   `:root` block from them, so the stylesheet only contains rules.
 - `params` name the settings authors may change under `params:` in the deck.
   Each points at a token; its default is the token's value, so nothing is
-  written twice. `type` (`size`, `number`, `switch`, `choice` or `font`) says
+  written twice. `type` (`size`, `number`, `switch`, `choice`, `font` or `text`) says
   what kind of value it takes; `min`, `max` and `step` go with a size (in
   pixels) or a number, `choices` with a choice. The token's value must be of
   that type. The editor shows a slider, a box to tick or a list for it, and

package/docs/reference/themes.md

@@ -79,7 +79,8 @@ params:
 
 A parameter's default is its token's value. `type` says what kind of value it
 takes: `size` (pixels, with `min`, `max` and `step`), `number` (with the same
-three), `switch` (1 or 0), `choice` (one of `choices`) or `font`. A deck value
+three), `switch` (1 or 0), `choice` (one of `choices`), `font` or `text` (words to show,
+which mdeck quotes; the token's value is a quoted CSS string). A deck value
 that does not fit is left out, and `mdeck check` reports it, like unknown
 parameter names; one outside `min` and `max` is used, with a warning. Without
 a `type`, a parameter takes any text.

package/docs/site/content/theme-authoring.md

@@ -159,8 +159,9 @@ description = "12px by default, from about 6px to 20px; 0px leaves headings with
 | `switch` | `1` or `0` (also `true`/`false`, `on`/`off`) | a box to tick | |
 | `choice` | one of its `choices` | a list | `choices = ["left", "right"]` |
 | `font` | a CSS font list | a text box | |
+| `text` | words to show, such as a prompt; the author writes them plain and mdeck quotes them | a text box | |
 
-The token's value must be a value of that type: a `size` is written `"12px"`, a `switch` `"1"`. A value in the deck that does not fit is left out, and the theme's own value stays; `mdeck check` says why. A value outside `min` and `max` is used, with a warning: the range is what the theme was made for. A parameter without a `type` takes any text, as before.
+The token's value must be a value of that type: a `size` is written `"12px"`, a `switch` `"1"`, a `text` as a quoted CSS string, `"'~/talk $ '"`, used as `content: var(--prompt)`. A value in the deck that does not fit is left out, and the theme's own value stays; `mdeck check` says why. A value outside `min` and `max` is used, with a warning: the range is what the theme was made for. A parameter without a `type` takes any text, as before.
 
 A few habits make parameters easy to use:
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mdeck",
-  "version": "3.10.0",
+  "version": "3.10.1",
   "type": "module",
   "description": "Write slides as a plain text file, present them in the browser, share them as one HTML file or PDF.",
   "license": "MIT",

package/src/editor/components/DeckSettings.jsx

@@ -10,7 +10,7 @@ import { PalettePicker } from './PalettePicker.jsx'
 import { LookThumbnail } from './LookThumbnail.jsx'
 import { designUrl, DESIGN_TAB } from '../designLink.js'
 import { normalMode } from '../../runtime/hotspots.js'
-import { paramValue } from '../../extensions/params.js'
+import { paramValue, paramDefault } from '../../extensions/params.js'
 
 // What the `show` setting controls: the label for each choice and its values.
 const SHOW = { organization: ['Organization', ['title', 'all', 'none']], author: ['Author and date', ['title', 'all', 'none']], numbers: ['Slide numbers', ['slides', 'all', 'none']], sections: ['Section labels', ['all', 'none']] }
@@ -112,8 +112,8 @@ function DesignLink({ kind, item }) {
 
 // The control for one theme parameter, by its type: a slider for a size or a
 // number with a range, a box to tick for a switch, a list for a choice, else
-// text (with a colour picker when the default is a colour). An empty value
-// means the theme's own.
+// a text box (with a colour picker when the default is a colour). An empty
+// value means the theme's own; a text shows the theme's without its quotes.
 function ParamInput({ def, value, onChange }) {
   const current = value != null && !paramValue(def, value).problem ? paramValue(def, value).value : def.default
   if (def.type === 'switch') return <>
@@ -137,6 +137,6 @@ function ParamInput({ def, value, onChange }) {
   const color = isColor(def.default)
   return <>
     {color ? <input type="color" value={isColor(value) ? value : def.default} onInput={e => onChange(e.currentTarget.value)} style={{ flex: '0 0 auto' }} /> : null}
-    <input type="text" value={value ?? ''} placeholder={def.default} onInput={e => onChange(e.currentTarget.value)} />
+    <input type="text" value={value ?? ''} placeholder={paramDefault(def)} onInput={e => onChange(e.currentTarget.value)} />
   </>
 }

package/src/editor/components/ExtensionForms.jsx

@@ -8,7 +8,7 @@ const isColor = value => /^#[0-9a-f]{3,8}$/i.test(String(value ?? '').trim())
 const update = (list, index, patch) => list.map((item, i) => i === index ? { ...item, ...patch } : item)
 const without = (list, index) => list.filter((_, i) => i !== index)
 // The kinds of value a theme parameter takes (see src/extensions/params.js).
-const PARAM_KINDS = [['', 'text'], ['size', 'size'], ['number', 'number'], ['switch', 'switch'], ['choice', 'choice'], ['font', 'font']]
+const PARAM_KINDS = [['', 'CSS value'], ['size', 'size'], ['number', 'number'], ['switch', 'switch'], ['choice', 'choice'], ['font', 'font'], ['text', 'text']]
 
 function Identity({ model, onChange }) {
   return <>

package/src/extensions/params.js

@@ -7,11 +7,13 @@
 //   switch   1 or 0 (also true and false, on and off, yes and no)
 //   choice   one of `choices`
 //   font     a CSS font list
+//   text     words to show, such as a prompt: the author writes them plain,
+//            mdeck quotes them; the theme's own value is a quoted CSS string
 //
 // The manifest check, `mdeck check`, the slides and the editor all use these
 // functions, so they agree on what a value means.
 
-export const PARAM_TYPES = ['size', 'number', 'switch', 'choice', 'font']
+export const PARAM_TYPES = ['size', 'number', 'switch', 'choice', 'font', 'text']
 export const PARAM_KEYS = ['token', 'title', 'description', 'type', 'min', 'max', 'step', 'choices']
 const RANGED = ['size', 'number']
 const NUMBER_RE = /^-?(\d+\.?\d*|\.\d+)$/
@@ -26,6 +28,25 @@ function pixels(value) {
 
 const unit = param => param.type === 'size' ? 'px' : ''
 
+// A CSS string literal ('…' or "…") and the text in it.
+const STRING_RE = /^(['"])((?:\\[^]|(?!\1)[^\\\n])*)\1$/
+
+/** Text as a CSS string: quoted, with backslashes, quotes and line breaks escaped. */
+export function cssString(text) {
+  return '"' + String(text).replace(/\\/g, '\\\\').replace(/"/g, '\\"').replace(/\r?\n/g, '\\A ') + '"'
+}
+
+/** The text in a CSS string literal, or null when it is not one. */
+export function unquote(css) {
+  const match = STRING_RE.exec(String(css).trim())
+  return match ? match[2].replace(/\\A ?/g, '\n').replace(/\\([^])/g, '$1') : null
+}
+
+/** A parameter's default as an author would write it: a text without its quotes. */
+export function paramDefault(param) {
+  return param.type === 'text' ? unquote(param.default) ?? param.default : param.default
+}
+
 /** The range a parameter was made for, as text ("6px to 20px", "at least 0"), or ''. */
 export function paramRange(param) {
   const { min, max } = param
@@ -54,6 +75,8 @@ export function paramValue(param, raw) {
   const type = param.type
   if (raw == null || (typeof raw === 'object')) return { problem: 'needs a single value' }
   if (!type) return { value: String(raw) }
+  // Text keeps its spaces (a prompt ends in one) and may be empty.
+  if (type === 'text') return { value: cssString(raw) }
   const text = String(raw).trim()
   if (!text) return { problem: 'is empty' }
   if (type === 'font') return { value: text }
@@ -98,6 +121,10 @@ export function paramSettingProblems(param, fallback) {
     else if (new Set(choices).size !== choices.length) problems.push(['choices', 'lists a value twice'])
   } else if (param.choices != null) problems.push(['choices', `is for a choice, not a ${type}`])
   if (problems.length || fallback == null) return problems
+  if (type === 'text') {
+    if (unquote(fallback) == null) problems.push(['type', `a text's token is a quoted CSS string, such as "'~/talk $ '" (got ${JSON.stringify(fallback)})`])
+    return problems
+  }
   // The default is the token's value: it has to be a value of this type too.
   const result = paramValue(param, fallback)
   if (result.problem) problems.push(['type', `the token's value ${JSON.stringify(fallback)} ${result.problem}`])