@soroush.tech/markdown 1.2.0 → 1.2.2

package/README.md

@@ -7,27 +7,27 @@
 
 ## A **headless markdown editor and preview**.
 
-Compose a toolbar, a source editor, and a live preview however your UI needs — and every element is styled by your theme. The renderer works standalone too, turning any markdown string into themed components, with support for tables, task lists, strikethrough, autolinks, syntax-highlighted code, and mermaid diagrams.
+Compose a toolbar, a source editor, and a live preview however your UI needs - and every element is styled by your theme. The renderer works standalone too, turning any markdown string into themed components, with support for tables, task lists, strikethrough, autolinks, syntax-highlighted code, and mermaid diagrams.
 
-![The Preview renderer output — a heading, a formatted paragraph, a task list, a blockquote, a code block, a table, and a mermaid sequence diagram, all as themed components](https://raw.githubusercontent.com/soroush-tech/core/main/packages/markdown/src/assets/demo.png)
+![The Preview renderer output - a heading, a formatted paragraph, a task list, a blockquote, a code block, a table, and a mermaid sequence diagram, all as themed components](https://raw.githubusercontent.com/soroush-tech/core/main/packages/markdown/src/assets/demo.png)
 
 ## Why headless?
 
-Most markdown editors hand you a fixed widget — a bordered box with a toolbar bolted on top and an Edit/Preview toggle you can't move. This one gives you the **pieces** instead:
+Most markdown editors hand you a fixed widget - a bordered box with a toolbar bolted on top and an Edit/Preview toggle you can't move. This one gives you the **pieces** instead:
 
-- **You own the layout.** Put the preview beside the editor, below it, in a modal, or drop it entirely — the parts don't care.
+- **You own the layout.** Put the preview beside the editor, below it, in a modal, or drop it entirely - the parts don't care.
 - **You own the state.** The value is yours (`useState`, a form, a store); the editor just reads and writes it.
-- **It looks like your app.** Output is themed components — `Typography`, `Link`, `Table`, and its own `CodeBlock` — not unstyled HTML, so it inherits your theme with zero extra CSS.
+- **It looks like your app.** Output is themed components - `Typography`, `Link`, `Table`, and its own `CodeBlock` - not unstyled HTML, so it inherits your theme with zero extra CSS.
 
 ## Features
 
-- **GitHub-Flavored Markdown** — tables, task lists, strikethrough, and autolinks.
-- **Syntax-highlighted code** — fenced blocks are highlighted automatically; unknown languages degrade gracefully.
-- **Mermaid diagrams** — a ` ```mermaid ` fence renders as a themed diagram with built-in zoom and pan controls, loaded lazily on the client and falling back to the source until it does.
-- **A real editing surface** — Tab-to-indent, selection tracking, caret restoration, formatting buttons, heading and code-language selects, a hover-grid table picker, and a diagram picker that inserts starter templates for 23 mermaid diagram types.
-- **Composable parts** — `Control`, `Toolbar`, `Editor`, and `Preview`, coordinated through React context.
-- **Themeable to the slot** — restyle the editor, toolbar, and preview through your theme, no forking required.
-- **Typed and SSR-safe** — first-class TypeScript, 100% test coverage, no browser globals at module scope.
+- **GitHub-Flavored Markdown** - tables, task lists, strikethrough, and autolinks.
+- **Syntax-highlighted code** - fenced blocks are highlighted automatically; unknown languages degrade gracefully.
+- **Mermaid diagrams** - a ` ```mermaid ` fence renders as a themed diagram with built-in zoom and pan controls, loaded lazily on the client and falling back to the source until it does.
+- **A real editing surface** - Tab-to-indent, selection tracking, caret restoration, formatting buttons, heading and code-language selects, a hover-grid table picker, and a diagram picker that inserts starter templates for 23 mermaid diagram types.
+- **Composable parts** - `Control`, `Toolbar`, `Editor`, and `Preview`, coordinated through React context.
+- **Themeable to the slot** - restyle the editor, toolbar, and preview through your theme, no forking required.
+- **Typed and SSR-safe** - first-class TypeScript, 100% test coverage, no browser globals at module scope.
 
 ## Install
 
@@ -61,7 +61,7 @@ export function App() {
     <ThemeProvider>
       <Preview>
         {
-          '# Hello\n\nRendered through your **theme** — tables, `code`, and [links](https://soroush.tech) included.'
+          '# Hello\n\nRendered through your **theme** - tables, `code`, and [links](https://soroush.tech) included.'
         }
       </Preview>
     </ThemeProvider>
@@ -73,7 +73,7 @@ That's the whole renderer. To let people _write_ markdown, add the editing parts
 
 ## Editor
 
-The `Editor` works standalone via `value`/`onChange` — no `Control` needed:
+The `Editor` works standalone via `value`/`onChange` - no `Control` needed:
 
 ```tsx
 import { useState } from 'react'
@@ -81,7 +81,7 @@ import { Editor } from '@soroush.tech/markdown'
 import { ThemeProvider } from '@soroush.tech/design-system/theme'
 
 function MarkdownField() {
-  const [value, setValue] = useState('# Start writing\n\nJust the source editor — no preview.')
+  const [value, setValue] = useState('# Start writing\n\nJust the source editor - no preview.')
 
   return (
     <ThemeProvider>
@@ -117,26 +117,26 @@ function MarkdownField() {
 }
 ```
 
-There is intentionally **no Edit·Split·Preview switch** — which panes to show, and when, is your call.
+There is intentionally **no Edit·Split·Preview switch** - which panes to show, and when, is your call.
 
 ## The parts
 
 | Part      | Role                                                                              |
 | --------- | --------------------------------------------------------------------------------- |
-| `Control` | Headless provider — owns the `value`/selection state. Takes `value` + `onChange`. |
+| `Control` | Headless provider - owns the `value`/selection state. Takes `value` + `onChange`. |
 | `Toolbar` | Formatting buttons, heading/code-language selects, and the table picker.          |
-| `Editor`  | The source `<textarea>` — Tab-to-indent, selection, caret restore.                |
+| `Editor`  | The source `<textarea>` - Tab-to-indent, selection, caret restore.                |
 | `Preview` | Renders a markdown string (its child) to themed components.                       |
 
-`Toolbar` and `Editor` must be rendered inside `Control`; `Preview` works anywhere. Import each directly from the package — there is no `Markdown.*` namespace. Full prop references live in the [source on GitHub](https://github.com/soroush-tech/core/tree/main/packages/markdown/src).
+`Toolbar` and `Editor` must be rendered inside `Control`; `Preview` works anywhere. Import each directly from the package - there is no `Markdown.*` namespace. Full prop references live in the [source on GitHub](https://github.com/soroush-tech/core/tree/main/packages/markdown/src).
 
 ## Customizing the look
 
-Everything is styled through the design system's theme, and there are two levels to reach for — a shared theme for the whole look, and per-component slots for the markdown parts specifically.
+Everything is styled through the design system's theme, and there are two levels to reach for - a shared theme for the whole look, and per-component slots for the markdown parts specifically.
 
-### Customize the theme — restyle everything
+### Customize the theme - restyle everything
 
-`Preview` renders design-system components that read theme tokens, so your theme already governs how markdown looks. Build one with `createTheme` — palette, spacing, type scale, radii — and pass it to `ThemeProvider`; the markdown output changes along with the rest of your UI, no markdown-specific setup. See the [design system's theming guide](https://www.npmjs.com/package/@soroush.tech/design-system) for the full token set.
+`Preview` renders design-system components that read theme tokens, so your theme already governs how markdown looks. Build one with `createTheme` - palette, spacing, type scale, radii - and pass it to `ThemeProvider`; the markdown output changes along with the rest of your UI, no markdown-specific setup. See the [design system's theming guide](https://www.npmjs.com/package/@soroush.tech/design-system) for the full token set.
 
 ```tsx
 import { ThemeProvider, createTheme, baseTheme } from '@soroush.tech/design-system/theme'
@@ -152,12 +152,12 @@ const theme = createTheme(baseTheme, {
   },
 })
 
-// <ThemeProvider theme={theme}> … </ThemeProvider>
+// <ThemeProvider theme={theme}> ... </ThemeProvider>
 ```
 
-### Customize the components — target the markdown parts
+### Customize the components - target the markdown parts
 
-For tweaks specific to the editor, toolbar, or preview, this package registers three themeable slots under `theme.components` — `MarkdownEditor`, `MarkdownPreview`, and `MarkdownToolbar`:
+For tweaks specific to the editor, toolbar, or preview, this package registers three themeable slots under `theme.components` - `MarkdownEditor`, `MarkdownPreview`, and `MarkdownToolbar`:
 
 ```tsx
 const theme = createTheme(baseTheme, {
@@ -168,11 +168,11 @@ const theme = createTheme(baseTheme, {
 })
 ```
 
-The overrides are fully typed — importing the package registers the slots on the theme automatically.
+The overrides are fully typed - importing the package registers the slots on the theme automatically.
 
 ## Building your own parts
 
-Need a custom control or a word count? `useMarkdownContext()` exposes the same value, selection, and `dispatch` the built-in parts use — call it from any component inside `Control`.
+Need a custom control or a word count? `useMarkdownContext()` exposes the same value, selection, and `dispatch` the built-in parts use - call it from any component inside `Control`.
 
 ## License
 

package/dist/CodeBlock.d.cts

@@ -1,2 +1,2 @@
-import { a as CodeBlockProps, i as CodeBlock, n as syntaxDark, r as syntaxLight, t as ThemeSyntax } from "./index-BtMTBOcM.cjs";
+import { a as CodeBlockProps, i as CodeBlock, n as syntaxDark, r as syntaxLight, t as ThemeSyntax } from "./index-D1rI6OgO.cjs";
 export { CodeBlock, CodeBlockProps, ThemeSyntax, syntaxDark, syntaxLight };

package/dist/CodeBlock.d.mts

@@ -1,2 +1,2 @@
-import { a as CodeBlockProps, i as CodeBlock, n as syntaxDark, r as syntaxLight, t as ThemeSyntax } from "./index-BtMTBOcM.mjs";
+import { a as CodeBlockProps, i as CodeBlock, n as syntaxDark, r as syntaxLight, t as ThemeSyntax } from "./index-D1rI6OgO.mjs";
 export { CodeBlock, CodeBlockProps, ThemeSyntax, syntaxDark, syntaxLight };

package/dist/Control.cjs

@@ -1,12 +1,12 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_applyAction = require("./applyAction-BDkgYhOd.cjs");
+const require_applyAction = require("./applyAction-eBwIRQNK.cjs");
 const require_MarkdownContext = require("./MarkdownContext.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/Control/Control.tsx
 /**
 * The headless root of the Markdown compound: owns the shared value/selection state and exposes
-* it (plus a `dispatch` for toolbar actions) via context. It renders no UI of its own — the
+* it (plus a `dispatch` for toolbar actions) via context. It renders no UI of its own - the
 * consumer arranges the parts and decides which panes to show.
 */
 function Control({ value, onChange, children }) {

package/dist/Control.d.cts

@@ -5,12 +5,12 @@ interface ControlProps {
   value: string;
   /** Called with the next source on edit or a toolbar action. */
   onChange: (value: string) => void;
-  /** The composed parts — `Markdown.Toolbar`, `Markdown.Editor`, `Markdown.Preview`, … */
+  /** The composed parts - `Markdown.Toolbar`, `Markdown.Editor`, `Markdown.Preview`, ... */
   children: ReactNode;
 }
 /**
  * The headless root of the Markdown compound: owns the shared value/selection state and exposes
- * it (plus a `dispatch` for toolbar actions) via context. It renders no UI of its own — the
+ * it (plus a `dispatch` for toolbar actions) via context. It renders no UI of its own - the
  * consumer arranges the parts and decides which panes to show.
  */
 declare function Control({ value, onChange, children }: Readonly<ControlProps>): import("react").JSX.Element;

package/dist/Control.d.mts

@@ -5,12 +5,12 @@ interface ControlProps {
   value: string;
   /** Called with the next source on edit or a toolbar action. */
   onChange: (value: string) => void;
-  /** The composed parts — `Markdown.Toolbar`, `Markdown.Editor`, `Markdown.Preview`, … */
+  /** The composed parts - `Markdown.Toolbar`, `Markdown.Editor`, `Markdown.Preview`, ... */
   children: ReactNode;
 }
 /**
  * The headless root of the Markdown compound: owns the shared value/selection state and exposes
- * it (plus a `dispatch` for toolbar actions) via context. It renders no UI of its own — the
+ * it (plus a `dispatch` for toolbar actions) via context. It renders no UI of its own - the
  * consumer arranges the parts and decides which panes to show.
  */
 declare function Control({ value, onChange, children }: Readonly<ControlProps>): import("react").JSX.Element;

package/dist/Control.mjs

@@ -1,11 +1,11 @@
-import { t as applyAction } from "./applyAction-BGWMbUYT.mjs";
+import { t as applyAction } from "./applyAction-CegmXrxL.mjs";
 import { MarkdownContext } from "./MarkdownContext.mjs";
 import { useMemo, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/Control/Control.tsx
 /**
 * The headless root of the Markdown compound: owns the shared value/selection state and exposes
-* it (plus a `dispatch` for toolbar actions) via context. It renders no UI of its own — the
+* it (plus a `dispatch` for toolbar actions) via context. It renders no UI of its own - the
 * consumer arranges the parts and decides which panes to show.
 */
 function Control({ value, onChange, children }) {

package/dist/Editor.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_applyAction = require("./applyAction-BDkgYhOd.cjs");
+const require_applyAction = require("./applyAction-eBwIRQNK.cjs");
 const require_MarkdownContext = require("./MarkdownContext.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -26,7 +26,7 @@ const noop = () => {};
 * driven by context (so the `Toolbar` can act on it); on its own it is a plain controlled field
 * via `value`/`onChange`.
 */
-function Editor({ value: valueProp, onChange: onChangeProp, placeholder = "Write your article in Markdown…", minRows = 16, maxRows, variant, color, textColor: textColorProp, size, name, id, error, required, disabled, showShortcutHint = true }) {
+function Editor({ value: valueProp, onChange: onChangeProp, placeholder = "Write your article in Markdown...", minRows = 16, maxRows, variant, color, textColor: textColorProp, size, name, id, error, required, disabled, showShortcutHint = true }) {
 	const context = (0, react.useContext)(require_MarkdownContext.MarkdownContext);
 	const theme = (0, _soroush_tech_design_system_theme.useTheme)();
 	const textColor = textColorProp ?? (0, _soroush_tech_design_system_theme.themeDefault)(theme, "textColor", "initial");

package/dist/Editor.d.cts

@@ -1,9 +1,9 @@
 import { TextInputColor, TextInputSize, TextInputTextColor, TextInputVariant } from "@soroush.tech/design-system/TextInput";
 //#region src/Editor/Editor.d.ts
 interface EditorProps {
-  /** Standalone source value — used when rendered outside a `Control`. Ignored inside one. */
+  /** Standalone source value - used when rendered outside a `Control`. Ignored inside one. */
   value?: string;
-  /** Standalone change handler — used when rendered outside a `Control`. Ignored inside one. */
+  /** Standalone change handler - used when rendered outside a `Control`. Ignored inside one. */
   onChange?: (value: string) => void;
   /** Placeholder shown while the source is empty. */
   placeholder?: string;
@@ -11,18 +11,18 @@ interface EditorProps {
   minRows?: number;
   /**
    * Maximum rows before the auto-grow textarea stops growing and scrolls
-   * internally — keeps its border box visible inside height-bound panes.
+   * internally - keeps its border box visible inside height-bound panes.
    */
   maxRows?: number;
-  /** Visual style of the source input — forwarded to `TextInput`. Default: `'default'`. */
+  /** Visual style of the source input - forwarded to `TextInput`. Default: `'default'`. */
   variant?: TextInputVariant;
-  /** Focus/active border colour — forwarded to `TextInput`. */
+  /** Focus/active border colour - forwarded to `TextInput`. */
   color?: TextInputColor;
-  /** Text colour of the typed source — forwarded to `TextInput`. Default: `'initial'`. */
+  /** Text colour of the typed source - forwarded to `TextInput`. Default: `'initial'`. */
   textColor?: TextInputTextColor;
-  /** Padding/font-size density — forwarded to `TextInput`. */
+  /** Padding/font-size density - forwarded to `TextInput`. */
   size?: TextInputSize;
-  /** Native `name` on the textarea — set it for native `<form>` submission / FormData. */
+  /** Native `name` on the textarea - set it for native `<form>` submission / FormData. */
   name?: string;
   /** `id` for label association. Falls back to the enclosing `FormControl`. */
   id?: string;

package/dist/Editor.d.mts

@@ -1,9 +1,9 @@
 import { TextInputColor, TextInputSize, TextInputTextColor, TextInputVariant } from "@soroush.tech/design-system/TextInput";
 //#region src/Editor/Editor.d.ts
 interface EditorProps {
-  /** Standalone source value — used when rendered outside a `Control`. Ignored inside one. */
+  /** Standalone source value - used when rendered outside a `Control`. Ignored inside one. */
   value?: string;
-  /** Standalone change handler — used when rendered outside a `Control`. Ignored inside one. */
+  /** Standalone change handler - used when rendered outside a `Control`. Ignored inside one. */
   onChange?: (value: string) => void;
   /** Placeholder shown while the source is empty. */
   placeholder?: string;
@@ -11,18 +11,18 @@ interface EditorProps {
   minRows?: number;
   /**
    * Maximum rows before the auto-grow textarea stops growing and scrolls
-   * internally — keeps its border box visible inside height-bound panes.
+   * internally - keeps its border box visible inside height-bound panes.
    */
   maxRows?: number;
-  /** Visual style of the source input — forwarded to `TextInput`. Default: `'default'`. */
+  /** Visual style of the source input - forwarded to `TextInput`. Default: `'default'`. */
   variant?: TextInputVariant;
-  /** Focus/active border colour — forwarded to `TextInput`. */
+  /** Focus/active border colour - forwarded to `TextInput`. */
   color?: TextInputColor;
-  /** Text colour of the typed source — forwarded to `TextInput`. Default: `'initial'`. */
+  /** Text colour of the typed source - forwarded to `TextInput`. Default: `'initial'`. */
   textColor?: TextInputTextColor;
-  /** Padding/font-size density — forwarded to `TextInput`. */
+  /** Padding/font-size density - forwarded to `TextInput`. */
   size?: TextInputSize;
-  /** Native `name` on the textarea — set it for native `<form>` submission / FormData. */
+  /** Native `name` on the textarea - set it for native `<form>` submission / FormData. */
   name?: string;
   /** `id` for label association. Falls back to the enclosing `FormControl`. */
   id?: string;

package/dist/Editor.mjs

@@ -1,4 +1,4 @@
-import { t as applyAction } from "./applyAction-BGWMbUYT.mjs";
+import { t as applyAction } from "./applyAction-CegmXrxL.mjs";
 import { MarkdownContext } from "./MarkdownContext.mjs";
 import { useContext, useId, useLayoutEffect, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -25,7 +25,7 @@ const noop = () => {};
 * driven by context (so the `Toolbar` can act on it); on its own it is a plain controlled field
 * via `value`/`onChange`.
 */
-function Editor({ value: valueProp, onChange: onChangeProp, placeholder = "Write your article in Markdown…", minRows = 16, maxRows, variant, color, textColor: textColorProp, size, name, id, error, required, disabled, showShortcutHint = true }) {
+function Editor({ value: valueProp, onChange: onChangeProp, placeholder = "Write your article in Markdown...", minRows = 16, maxRows, variant, color, textColor: textColorProp, size, name, id, error, required, disabled, showShortcutHint = true }) {
 	const context = useContext(MarkdownContext);
 	const theme = useTheme();
 	const textColor = textColorProp ?? themeDefault(theme, "textColor", "initial");

package/dist/{LiveEdit-KDKu7Yvn.mjs → LiveEdit-CaMZLJCs.mjs}

@@ -1,5 +1,5 @@
 import { MarkdownContext } from "./MarkdownContext.mjs";
-import { t as Preview } from "./Preview-nvh2sGBQ.mjs";
+import { t as Preview } from "./Preview-BFyaPHjw.mjs";
 import { useContext, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 import { styled } from "@soroush.tech/design-system";
@@ -17,7 +17,7 @@ const processor = unified().use(rehypeParse, { fragment: true }).use(rehypeRemar
 });
 /**
 * Serializes an edited block's live DOM back to markdown. The preview renders
-* non-content UI inside a block (the code-copy control, decorative SVGs) —
+* non-content UI inside a block (the code-copy control, decorative SVGs) -
 * those are stripped from a clone first so only real content round-trips.
 */
 function blockToMarkdown(element) {
@@ -33,7 +33,7 @@ const FENCE = /^[ \t]{0,3}(`{3,}|~{3,})/;
 * marker itself when one opens a block, and `null` when one closes it.
 *
 * A closing marker must use the same character, be at least as long, and carry
-* nothing after it. The info string is what separates the two roles — a
+* nothing after it. The info string is what separates the two roles - a
 * ```` ```ts ```` line inside an open ```` ``` ```` block opens nothing and closes
 * nothing, it is content. Without that check the block would end early and its
 * remaining blank lines would split it into further blocks.
@@ -47,7 +47,7 @@ const nextFence = (line, fence) => {
 };
 /**
 * Splits markdown into top-level blocks separated by blank lines, keeping
-* fenced code blocks whole — blank lines inside a ``` / ~~~ fence never split.
+* fenced code blocks whole - blank lines inside a ``` / ~~~ fence never split.
 * Offsets index the original string, so an edited block's source can be
 * spliced back losslessly.
 */
@@ -118,7 +118,7 @@ const toBlocks = (value) => {
 	}];
 };
 /**
-* One contentEditable block. The preview element is created once per mount —
+* One contentEditable block. The preview element is created once per mount -
 * while the browser owns the DOM during typing, React must never reconcile
 * the subtree under the caret. The parent remounts the block (source-derived
 * key) whenever its markdown actually changes.
@@ -147,15 +147,15 @@ function EditableBlock({ index, source, isEditable, placeholder, slotProps, onEd
 }
 /**
 * A preview you write on directly: the document renders exactly like
-* `Preview`, split into blocks, and every block is `contentEditable` — no
+* `Preview`, split into blocks, and every block is `contentEditable` - no
 * textarea. While a block is being typed in, the browser owns its DOM; each
 * input serializes that block back to markdown and splices it into `value`,
 * so `onChange` stays live and untouched blocks keep their exact source.
-* Blur (or Escape) re-splits the document. Mermaid blocks are read-only —
+* Blur (or Escape) re-splits the document. Mermaid blocks are read-only -
 * a diagram has no text to edit in place. Inside a `Control` it is driven by
 * context; standalone it is a plain controlled component.
 */
-function LiveEdit({ value: valueProp, onChange: onChangeProp, placeholder = "Click to start writing…", slotProps }) {
+function LiveEdit({ value: valueProp, onChange: onChangeProp, placeholder = "Click to start writing...", slotProps }) {
 	const context = useContext(MarkdownContext);
 	const value = context?.value ?? valueProp ?? "";
 	const onChange = context?.onChange ?? onChangeProp ?? noop;

package/dist/{LiveEdit-DmM35H99.cjs → LiveEdit-CbRkmd43.cjs}

@@ -1,4 +1,4 @@
-const require_Preview = require("./Preview-YtIipm0z.cjs");
+const require_Preview = require("./Preview-CnMWUtU2.cjs");
 const require_MarkdownContext = require("./MarkdownContext.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -20,7 +20,7 @@ const processor = (0, require("unified").unified)().use(rehype_parse.default, {
 });
 /**
 * Serializes an edited block's live DOM back to markdown. The preview renders
-* non-content UI inside a block (the code-copy control, decorative SVGs) —
+* non-content UI inside a block (the code-copy control, decorative SVGs) -
 * those are stripped from a clone first so only real content round-trips.
 */
 function blockToMarkdown(element) {
@@ -36,7 +36,7 @@ const FENCE = /^[ \t]{0,3}(`{3,}|~{3,})/;
 * marker itself when one opens a block, and `null` when one closes it.
 *
 * A closing marker must use the same character, be at least as long, and carry
-* nothing after it. The info string is what separates the two roles — a
+* nothing after it. The info string is what separates the two roles - a
 * ```` ```ts ```` line inside an open ```` ``` ```` block opens nothing and closes
 * nothing, it is content. Without that check the block would end early and its
 * remaining blank lines would split it into further blocks.
@@ -50,7 +50,7 @@ const nextFence = (line, fence) => {
 };
 /**
 * Splits markdown into top-level blocks separated by blank lines, keeping
-* fenced code blocks whole — blank lines inside a ``` / ~~~ fence never split.
+* fenced code blocks whole - blank lines inside a ``` / ~~~ fence never split.
 * Offsets index the original string, so an edited block's source can be
 * spliced back losslessly.
 */
@@ -121,7 +121,7 @@ const toBlocks = (value) => {
 	}];
 };
 /**
-* One contentEditable block. The preview element is created once per mount —
+* One contentEditable block. The preview element is created once per mount -
 * while the browser owns the DOM during typing, React must never reconcile
 * the subtree under the caret. The parent remounts the block (source-derived
 * key) whenever its markdown actually changes.
@@ -150,15 +150,15 @@ function EditableBlock({ index, source, isEditable, placeholder, slotProps, onEd
 }
 /**
 * A preview you write on directly: the document renders exactly like
-* `Preview`, split into blocks, and every block is `contentEditable` — no
+* `Preview`, split into blocks, and every block is `contentEditable` - no
 * textarea. While a block is being typed in, the browser owns its DOM; each
 * input serializes that block back to markdown and splices it into `value`,
 * so `onChange` stays live and untouched blocks keep their exact source.
-* Blur (or Escape) re-splits the document. Mermaid blocks are read-only —
+* Blur (or Escape) re-splits the document. Mermaid blocks are read-only -
 * a diagram has no text to edit in place. Inside a `Control` it is driven by
 * context; standalone it is a plain controlled component.
 */
-function LiveEdit({ value: valueProp, onChange: onChangeProp, placeholder = "Click to start writing…", slotProps }) {
+function LiveEdit({ value: valueProp, onChange: onChangeProp, placeholder = "Click to start writing...", slotProps }) {
 	const context = (0, react.useContext)(require_MarkdownContext.MarkdownContext);
 	const value = context?.value ?? valueProp ?? "";
 	const onChange = context?.onChange ?? onChangeProp ?? noop;

package/dist/LiveEdit.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_LiveEdit = require("./LiveEdit-DmM35H99.cjs");
+const require_LiveEdit = require("./LiveEdit-CbRkmd43.cjs");
 exports.LiveEdit = require_LiveEdit.LiveEdit;

package/dist/LiveEdit.d.cts

@@ -1,9 +1,9 @@
-import { r as PreviewSlotProps } from "./index-CxdJ1SgP.cjs";
+import { r as PreviewSlotProps } from "./index-TT9-Qjsh.cjs";
 //#region src/LiveEdit/LiveEdit.d.ts
 interface LiveEditProps {
-  /** Standalone source value — used when rendered outside a `Control`. Ignored inside one. */
+  /** Standalone source value - used when rendered outside a `Control`. Ignored inside one. */
   value?: string;
-  /** Standalone change handler — used when rendered outside a `Control`. Ignored inside one. */
+  /** Standalone change handler - used when rendered outside a `Control`. Ignored inside one. */
   onChange?: (value: string) => void;
   /** Shown inside the (empty) document's first block until something is typed. */
   placeholder?: string;
@@ -12,11 +12,11 @@ interface LiveEditProps {
 }
 /**
  * A preview you write on directly: the document renders exactly like
- * `Preview`, split into blocks, and every block is `contentEditable` — no
+ * `Preview`, split into blocks, and every block is `contentEditable` - no
  * textarea. While a block is being typed in, the browser owns its DOM; each
  * input serializes that block back to markdown and splices it into `value`,
  * so `onChange` stays live and untouched blocks keep their exact source.
- * Blur (or Escape) re-splits the document. Mermaid blocks are read-only —
+ * Blur (or Escape) re-splits the document. Mermaid blocks are read-only -
  * a diagram has no text to edit in place. Inside a `Control` it is driven by
  * context; standalone it is a plain controlled component.
  */

package/dist/LiveEdit.d.mts

@@ -1,9 +1,9 @@
-import { r as PreviewSlotProps } from "./index-CPWcFD6T.mjs";
+import { r as PreviewSlotProps } from "./index-CBKWWR5Q.mjs";
 //#region src/LiveEdit/LiveEdit.d.ts
 interface LiveEditProps {
-  /** Standalone source value — used when rendered outside a `Control`. Ignored inside one. */
+  /** Standalone source value - used when rendered outside a `Control`. Ignored inside one. */
   value?: string;
-  /** Standalone change handler — used when rendered outside a `Control`. Ignored inside one. */
+  /** Standalone change handler - used when rendered outside a `Control`. Ignored inside one. */
   onChange?: (value: string) => void;
   /** Shown inside the (empty) document's first block until something is typed. */
   placeholder?: string;
@@ -12,11 +12,11 @@ interface LiveEditProps {
 }
 /**
  * A preview you write on directly: the document renders exactly like
- * `Preview`, split into blocks, and every block is `contentEditable` — no
+ * `Preview`, split into blocks, and every block is `contentEditable` - no
  * textarea. While a block is being typed in, the browser owns its DOM; each
  * input serializes that block back to markdown and splices it into `value`,
  * so `onChange` stays live and untouched blocks keep their exact source.
- * Blur (or Escape) re-splits the document. Mermaid blocks are read-only —
+ * Blur (or Escape) re-splits the document. Mermaid blocks are read-only -
  * a diagram has no text to edit in place. Inside a `Control` it is driven by
  * context; standalone it is a plain controlled component.
  */

package/dist/LiveEdit.mjs

@@ -1,2 +1,2 @@
-import { t as LiveEdit } from "./LiveEdit-KDKu7Yvn.mjs";
+import { t as LiveEdit } from "./LiveEdit-CaMZLJCs.mjs";
 export { LiveEdit };

package/dist/MarkdownContext.d.cts

@@ -1,2 +1,2 @@
-import { i as useMarkdownContext, n as MarkdownContextValue, r as MarkdownSelection, t as MarkdownContext } from "./index-rGZIhUgj.cjs";
+import { i as useMarkdownContext, n as MarkdownContextValue, r as MarkdownSelection, t as MarkdownContext } from "./index-Cre2ivJn.cjs";
 export { MarkdownContext, MarkdownContextValue, MarkdownSelection, useMarkdownContext };

package/dist/MarkdownContext.d.mts

@@ -1,2 +1,2 @@
-import { i as useMarkdownContext, n as MarkdownContextValue, r as MarkdownSelection, t as MarkdownContext } from "./index-rGZIhUgj.mjs";
+import { i as useMarkdownContext, n as MarkdownContextValue, r as MarkdownSelection, t as MarkdownContext } from "./index-Cre2ivJn.mjs";
 export { MarkdownContext, MarkdownContextValue, MarkdownSelection, useMarkdownContext };

package/dist/{Mermaid-BclI9A7e.mjs → Mermaid-B7vDwGQG.mjs}

@@ -21,7 +21,7 @@ const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
 * (bottom-right: a pan d-pad around a reset, plus zoom in/out) and an expand control
 * (top-right) that opens the diagram in a fullscreen dialog. Drag-to-pan and wheel-to-zoom
 * work too. Only the diagram layer clips; the controls sit above it, so a short diagram never
-* hides them. Everything is a CSS transform — no dependency.
+* hides them. Everything is a CSS transform - no dependency.
 */
 function DiagramViewer({ svg, expandable = true, fill = false }) {
 	const [scale, setScale] = useState(1);
@@ -198,8 +198,8 @@ async function toSvg(id, chart, theme) {
 	return svg;
 }
 /**
-* Renders a mermaid diagram. Until the client renders the SVG — and if the source is
-* invalid — it falls back to the diagram source in a `CodeBlock`, so server output and
+* Renders a mermaid diagram. Until the client renders the SVG - and if the source is
+* invalid - it falls back to the diagram source in a `CodeBlock`, so server output and
 * no-JS readers still show something useful and hydration stays stable.
 */
 function Mermaid({ chart, diagram }) {

package/dist/{Mermaid-DqP2Q0bt.cjs → Mermaid-CkUan4z-.cjs}

@@ -21,7 +21,7 @@ const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
 * (bottom-right: a pan d-pad around a reset, plus zoom in/out) and an expand control
 * (top-right) that opens the diagram in a fullscreen dialog. Drag-to-pan and wheel-to-zoom
 * work too. Only the diagram layer clips; the controls sit above it, so a short diagram never
-* hides them. Everything is a CSS transform — no dependency.
+* hides them. Everything is a CSS transform - no dependency.
 */
 function DiagramViewer({ svg, expandable = true, fill = false }) {
 	const [scale, setScale] = (0, react.useState)(1);
@@ -198,8 +198,8 @@ async function toSvg(id, chart, theme) {
 	return svg;
 }
 /**
-* Renders a mermaid diagram. Until the client renders the SVG — and if the source is
-* invalid — it falls back to the diagram source in a `CodeBlock`, so server output and
+* Renders a mermaid diagram. Until the client renders the SVG - and if the source is
+* invalid - it falls back to the diagram source in a `CodeBlock`, so server output and
 * no-JS readers still show something useful and hydration stays stable.
 */
 function Mermaid({ chart, diagram }) {

package/dist/Mermaid.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_Mermaid = require("./Mermaid-DqP2Q0bt.cjs");
+const require_Mermaid = require("./Mermaid-CkUan4z-.cjs");
 exports.Mermaid = require_Mermaid.Mermaid;

package/dist/Mermaid.d.cts

@@ -1,2 +1,2 @@
-import { n as Mermaid, r as MermaidProps, t as DiagramProps } from "./index-BO0LyUUG.cjs";
+import { n as Mermaid, r as MermaidProps, t as DiagramProps } from "./index-Bd3yPDn_.cjs";
 export { DiagramProps, Mermaid, MermaidProps };

package/dist/Mermaid.d.mts

@@ -1,2 +1,2 @@
-import { n as Mermaid, r as MermaidProps, t as DiagramProps } from "./index-BO0LyUUG.mjs";
+import { n as Mermaid, r as MermaidProps, t as DiagramProps } from "./index-Bd3yPDn_.mjs";
 export { DiagramProps, Mermaid, MermaidProps };

package/dist/Mermaid.mjs

@@ -1,2 +1,2 @@
-import { t as Mermaid } from "./Mermaid-BclI9A7e.mjs";
+import { t as Mermaid } from "./Mermaid-B7vDwGQG.mjs";
 export { Mermaid };

package/dist/{Preview-nvh2sGBQ.mjs → Preview-BFyaPHjw.mjs}

@@ -1,5 +1,5 @@
 import { r as CodeBlock } from "./CodeBlock-CVlrvVPP.mjs";
-import { t as Mermaid } from "./Mermaid-BclI9A7e.mjs";
+import { t as Mermaid } from "./Mermaid-B7vDwGQG.mjs";
 import { createContext, isValidElement, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Typography } from "@soroush.tech/design-system/Typography";

package/dist/{Preview-YtIipm0z.cjs → Preview-CnMWUtU2.cjs}

@@ -21,7 +21,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 }) : target, mod));
 //#endregion
 const require_CodeBlock = require("./CodeBlock-Cymx1ZAY.cjs");
-const require_Mermaid = require("./Mermaid-DqP2Q0bt.cjs");
+const require_Mermaid = require("./Mermaid-CkUan4z-.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _soroush_tech_design_system_Typography = require("@soroush.tech/design-system/Typography");

package/dist/Preview.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_Preview = require("./Preview-YtIipm0z.cjs");
+const require_Preview = require("./Preview-CnMWUtU2.cjs");
 exports.Preview = require_Preview.Preview;

package/dist/Preview.d.cts

@@ -1,2 +1,2 @@
-import { n as PreviewProps, r as PreviewSlotProps, t as Preview } from "./index-CxdJ1SgP.cjs";
+import { n as PreviewProps, r as PreviewSlotProps, t as Preview } from "./index-TT9-Qjsh.cjs";
 export { Preview, PreviewProps, PreviewSlotProps };

package/dist/Preview.d.mts

@@ -1,2 +1,2 @@
-import { n as PreviewProps, r as PreviewSlotProps, t as Preview } from "./index-CPWcFD6T.mjs";
+import { n as PreviewProps, r as PreviewSlotProps, t as Preview } from "./index-CBKWWR5Q.mjs";
 export { Preview, PreviewProps, PreviewSlotProps };

package/dist/Preview.mjs

@@ -1,2 +1,2 @@
-import { t as Preview } from "./Preview-nvh2sGBQ.mjs";
+import { t as Preview } from "./Preview-BFyaPHjw.mjs";
 export { Preview };