@soroush.tech/markdown 1.2.0 → 1.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +27 -27
- package/dist/CodeBlock.d.cts +1 -1
- package/dist/CodeBlock.d.mts +1 -1
- package/dist/Control.cjs +2 -2
- package/dist/Control.d.cts +2 -2
- package/dist/Control.d.mts +2 -2
- package/dist/Control.mjs +2 -2
- package/dist/Editor.cjs +2 -2
- package/dist/Editor.d.cts +8 -8
- package/dist/Editor.d.mts +8 -8
- package/dist/Editor.mjs +2 -2
- package/dist/{LiveEdit-KDKu7Yvn.mjs → LiveEdit-CaMZLJCs.mjs} +8 -8
- package/dist/{LiveEdit-DmM35H99.cjs → LiveEdit-CbRkmd43.cjs} +8 -8
- package/dist/LiveEdit.cjs +1 -1
- package/dist/LiveEdit.d.cts +5 -5
- package/dist/LiveEdit.d.mts +5 -5
- package/dist/LiveEdit.mjs +1 -1
- package/dist/MarkdownContext.d.cts +1 -1
- package/dist/MarkdownContext.d.mts +1 -1
- package/dist/{Mermaid-BclI9A7e.mjs → Mermaid-B7vDwGQG.mjs} +3 -3
- package/dist/{Mermaid-DqP2Q0bt.cjs → Mermaid-CkUan4z-.cjs} +3 -3
- package/dist/Mermaid.cjs +1 -1
- package/dist/Mermaid.d.cts +1 -1
- package/dist/Mermaid.d.mts +1 -1
- package/dist/Mermaid.mjs +1 -1
- package/dist/{Preview-nvh2sGBQ.mjs → Preview-BFyaPHjw.mjs} +1 -1
- package/dist/{Preview-YtIipm0z.cjs → Preview-CnMWUtU2.cjs} +1 -1
- package/dist/Preview.cjs +1 -1
- package/dist/Preview.d.cts +1 -1
- package/dist/Preview.d.mts +1 -1
- package/dist/Preview.mjs +1 -1
- package/dist/{Toolbar-C0SNI-JK.mjs → Toolbar-BoEuAIiw.mjs} +3 -3
- package/dist/{Toolbar-Ba3l-oBU.cjs → Toolbar-CRlLqvj9.cjs} +3 -3
- package/dist/Toolbar.cjs +1 -1
- package/dist/Toolbar.mjs +1 -1
- package/dist/{applyAction-BGWMbUYT.mjs → applyAction-CegmXrxL.mjs} +6 -4
- package/dist/{applyAction-BDkgYhOd.cjs → applyAction-eBwIRQNK.cjs} +6 -4
- package/dist/{index-BO0LyUUG.d.cts → index-Bd3yPDn_.d.cts} +5 -5
- package/dist/{index-BO0LyUUG.d.mts → index-Bd3yPDn_.d.mts} +5 -5
- package/dist/{index-CPWcFD6T.d.mts → index-CBKWWR5Q.d.mts} +4 -4
- package/dist/{index-rGZIhUgj.d.mts → index-Cre2ivJn.d.cts} +8 -8
- package/dist/{index-rGZIhUgj.d.cts → index-Cre2ivJn.d.mts} +8 -8
- package/dist/{index-BtMTBOcM.d.cts → index-D1rI6OgO.d.cts} +4 -4
- package/dist/{index-BtMTBOcM.d.mts → index-D1rI6OgO.d.mts} +4 -4
- package/dist/{index-CxdJ1SgP.d.cts → index-TT9-Qjsh.d.cts} +4 -4
- package/dist/index.cjs +4 -4
- package/dist/index.d.cts +6 -6
- package/dist/index.d.mts +6 -6
- package/dist/index.mjs +4 -4
- package/package.json +10 -15
|
@@ -42,7 +42,7 @@ function groupToolbarActions(actions) {
|
|
|
42
42
|
//#region src/const.ts
|
|
43
43
|
const LIST_MARKER = /^(?:- \[[ xX]\] |- |\d+\. )/;
|
|
44
44
|
/**
|
|
45
|
-
* Every formatting action the toolbar exposes
|
|
45
|
+
* Every formatting action the toolbar exposes - one per markdown feature the `Markdown`
|
|
46
46
|
* renderer supports (GFM + the component map in `Markdown.Preview`). Data-driven so the
|
|
47
47
|
* toolbar and the transform logic stay in sync.
|
|
48
48
|
*/
|
|
@@ -186,7 +186,7 @@ const CODE_LANGUAGES = [
|
|
|
186
186
|
value: "md"
|
|
187
187
|
}
|
|
188
188
|
];
|
|
189
|
-
/** Inline `code`
|
|
189
|
+
/** Inline `code` - rendered next to the code-block select so both code controls sit together. */
|
|
190
190
|
const INLINE_CODE_ACTION = {
|
|
191
191
|
id: "inline-code",
|
|
192
192
|
label: "Code",
|
|
@@ -218,7 +218,7 @@ const headingAction = (level) => ({
|
|
|
218
218
|
family: HEADING_MARKER,
|
|
219
219
|
toggle: false
|
|
220
220
|
});
|
|
221
|
-
/** Every heading level the `Markdown` renderer supports (h1
|
|
221
|
+
/** Every heading level the `Markdown` renderer supports (h1-h6) - offered via the toolbar select. */
|
|
222
222
|
const HEADING_ACTIONS = [
|
|
223
223
|
1,
|
|
224
224
|
2,
|
|
@@ -42,7 +42,7 @@ function groupToolbarActions(actions) {
|
|
|
42
42
|
//#region src/const.ts
|
|
43
43
|
const LIST_MARKER = /^(?:- \[[ xX]\] |- |\d+\. )/;
|
|
44
44
|
/**
|
|
45
|
-
* Every formatting action the toolbar exposes
|
|
45
|
+
* Every formatting action the toolbar exposes - one per markdown feature the `Markdown`
|
|
46
46
|
* renderer supports (GFM + the component map in `Markdown.Preview`). Data-driven so the
|
|
47
47
|
* toolbar and the transform logic stay in sync.
|
|
48
48
|
*/
|
|
@@ -186,7 +186,7 @@ const CODE_LANGUAGES = [
|
|
|
186
186
|
value: "md"
|
|
187
187
|
}
|
|
188
188
|
];
|
|
189
|
-
/** Inline `code`
|
|
189
|
+
/** Inline `code` - rendered next to the code-block select so both code controls sit together. */
|
|
190
190
|
const INLINE_CODE_ACTION = {
|
|
191
191
|
id: "inline-code",
|
|
192
192
|
label: "Code",
|
|
@@ -218,7 +218,7 @@ const headingAction = (level) => ({
|
|
|
218
218
|
family: HEADING_MARKER,
|
|
219
219
|
toggle: false
|
|
220
220
|
});
|
|
221
|
-
/** Every heading level the `Markdown` renderer supports (h1
|
|
221
|
+
/** Every heading level the `Markdown` renderer supports (h1-h6) - offered via the toolbar select. */
|
|
222
222
|
const HEADING_ACTIONS = [
|
|
223
223
|
1,
|
|
224
224
|
2,
|
package/dist/Toolbar.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
const require_Toolbar = require("./Toolbar-
|
|
2
|
+
const require_Toolbar = require("./Toolbar-CRlLqvj9.cjs");
|
|
3
3
|
exports.TablePicker = require_Toolbar.TablePicker;
|
|
4
4
|
exports.Toolbar = require_Toolbar.Toolbar;
|
package/dist/Toolbar.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as TablePicker, t as Toolbar } from "./Toolbar-
|
|
1
|
+
import { n as TablePicker, t as Toolbar } from "./Toolbar-BoEuAIiw.mjs";
|
|
2
2
|
export { TablePicker, Toolbar };
|
|
@@ -79,10 +79,12 @@ function fenceEndAfter(value, pos) {
|
|
|
79
79
|
let openStart = -1;
|
|
80
80
|
for (const line of value.split("\n")) {
|
|
81
81
|
const lineEnd = offset + line.length;
|
|
82
|
-
if (line.startsWith("```"))
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
82
|
+
if (line.startsWith("```")) {
|
|
83
|
+
if (openStart === -1) openStart = offset;
|
|
84
|
+
else {
|
|
85
|
+
if (pos >= openStart && pos <= lineEnd) return lineEnd;
|
|
86
|
+
openStart = -1;
|
|
87
|
+
}
|
|
86
88
|
}
|
|
87
89
|
offset = lineEnd + 1;
|
|
88
90
|
}
|
|
@@ -79,10 +79,12 @@ function fenceEndAfter(value, pos) {
|
|
|
79
79
|
let openStart = -1;
|
|
80
80
|
for (const line of value.split("\n")) {
|
|
81
81
|
const lineEnd = offset + line.length;
|
|
82
|
-
if (line.startsWith("```"))
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
82
|
+
if (line.startsWith("```")) {
|
|
83
|
+
if (openStart === -1) openStart = offset;
|
|
84
|
+
else {
|
|
85
|
+
if (pos >= openStart && pos <= lineEnd) return lineEnd;
|
|
86
|
+
openStart = -1;
|
|
87
|
+
}
|
|
86
88
|
}
|
|
87
89
|
offset = lineEnd + 1;
|
|
88
90
|
}
|
|
@@ -4,22 +4,22 @@ interface DiagramViewerProps {
|
|
|
4
4
|
svg: string;
|
|
5
5
|
/** Show the expand-to-fullscreen control and dialog. Off for the nested (in-dialog) viewer. */
|
|
6
6
|
expandable?: boolean;
|
|
7
|
-
/** Fill the parent's height
|
|
7
|
+
/** Fill the parent's height - used by the viewer inside the fullscreen dialog. */
|
|
8
8
|
fill?: boolean;
|
|
9
9
|
}
|
|
10
10
|
//#endregion
|
|
11
11
|
//#region src/Mermaid/Mermaid.d.ts
|
|
12
|
-
/** DiagramViewer props a consumer may set
|
|
12
|
+
/** DiagramViewer props a consumer may set - `svg` and `fill` are managed internally. */
|
|
13
13
|
type DiagramProps = Omit<DiagramViewerProps, 'svg' | 'fill'>;
|
|
14
14
|
interface MermaidProps {
|
|
15
|
-
/** The mermaid diagram source
|
|
15
|
+
/** The mermaid diagram source - the body of a ` ```mermaid ` fenced block. */
|
|
16
16
|
chart: string;
|
|
17
17
|
/** Props forwarded to the diagram's zoom/pan viewer (e.g. `expandable`). */
|
|
18
18
|
diagram?: DiagramProps;
|
|
19
19
|
}
|
|
20
20
|
/**
|
|
21
|
-
* Renders a mermaid diagram. Until the client renders the SVG
|
|
22
|
-
* invalid
|
|
21
|
+
* Renders a mermaid diagram. Until the client renders the SVG - and if the source is
|
|
22
|
+
* invalid - it falls back to the diagram source in a `CodeBlock`, so server output and
|
|
23
23
|
* no-JS readers still show something useful and hydration stays stable.
|
|
24
24
|
*/
|
|
25
25
|
declare function Mermaid({ chart, diagram }: Readonly<MermaidProps>): import("react").JSX.Element;
|
|
@@ -4,22 +4,22 @@ interface DiagramViewerProps {
|
|
|
4
4
|
svg: string;
|
|
5
5
|
/** Show the expand-to-fullscreen control and dialog. Off for the nested (in-dialog) viewer. */
|
|
6
6
|
expandable?: boolean;
|
|
7
|
-
/** Fill the parent's height
|
|
7
|
+
/** Fill the parent's height - used by the viewer inside the fullscreen dialog. */
|
|
8
8
|
fill?: boolean;
|
|
9
9
|
}
|
|
10
10
|
//#endregion
|
|
11
11
|
//#region src/Mermaid/Mermaid.d.ts
|
|
12
|
-
/** DiagramViewer props a consumer may set
|
|
12
|
+
/** DiagramViewer props a consumer may set - `svg` and `fill` are managed internally. */
|
|
13
13
|
type DiagramProps = Omit<DiagramViewerProps, 'svg' | 'fill'>;
|
|
14
14
|
interface MermaidProps {
|
|
15
|
-
/** The mermaid diagram source
|
|
15
|
+
/** The mermaid diagram source - the body of a ` ```mermaid ` fenced block. */
|
|
16
16
|
chart: string;
|
|
17
17
|
/** Props forwarded to the diagram's zoom/pan viewer (e.g. `expandable`). */
|
|
18
18
|
diagram?: DiagramProps;
|
|
19
19
|
}
|
|
20
20
|
/**
|
|
21
|
-
* Renders a mermaid diagram. Until the client renders the SVG
|
|
22
|
-
* invalid
|
|
21
|
+
* Renders a mermaid diagram. Until the client renders the SVG - and if the source is
|
|
22
|
+
* invalid - it falls back to the diagram source in a `CodeBlock`, so server output and
|
|
23
23
|
* no-JS readers still show something useful and hydration stays stable.
|
|
24
24
|
*/
|
|
25
25
|
declare function Mermaid({ chart, diagram }: Readonly<MermaidProps>): import("react").JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { a as CodeBlockProps } from "./index-
|
|
2
|
-
import { r as MermaidProps } from "./index-
|
|
1
|
+
import { a as CodeBlockProps } from "./index-D1rI6OgO.mjs";
|
|
2
|
+
import { r as MermaidProps } from "./index-Bd3yPDn_.mjs";
|
|
3
3
|
import { TypographyProps } from "@soroush.tech/design-system/Typography";
|
|
4
4
|
import { ViewProps } from "@soroush.tech/design-system/View";
|
|
5
5
|
import { QuoteProps } from "@soroush.tech/design-system/Quote";
|
|
@@ -10,7 +10,7 @@ import { TableBodyProps, TableCellProps, TableHeadProps, TableProps, TableRowPro
|
|
|
10
10
|
//#region src/Preview/Preview.d.ts
|
|
11
11
|
/**
|
|
12
12
|
* Per-element prop overrides, merged over the design-system defaults (the caller's props win).
|
|
13
|
-
* Keyed by markdown element
|
|
13
|
+
* Keyed by markdown element - e.g. `slotProps={{ p: { color: 'primary' }, h1: { variant: 'h2' } }}`.
|
|
14
14
|
*/
|
|
15
15
|
interface PreviewSlotProps {
|
|
16
16
|
h1?: TypographyProps;
|
|
@@ -38,7 +38,7 @@ interface PreviewSlotProps {
|
|
|
38
38
|
thead?: TableHeadProps;
|
|
39
39
|
tbody?: TableBodyProps;
|
|
40
40
|
tr?: TableRowProps;
|
|
41
|
-
/** Props for a ` ```mermaid ` fence's `Mermaid` renderer
|
|
41
|
+
/** Props for a ` ```mermaid ` fence's `Mermaid` renderer - including `diagram` (viewer) props. */
|
|
42
42
|
mermaid?: Omit<MermaidProps, 'chart'>;
|
|
43
43
|
}
|
|
44
44
|
interface PreviewProps {
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { IconName } from "@soroush.tech/design-system/Icon";
|
|
2
2
|
//#region src/const.d.ts
|
|
3
|
-
/** How a text label is rendered
|
|
3
|
+
/** How a text label is rendered - mirrors the mark it inserts. */
|
|
4
4
|
type ToolbarLabelEmphasis = 'bold' | 'italic' | 'strike';
|
|
5
5
|
/** Shared presentation for a toolbar control. */
|
|
6
6
|
interface BaseAction {
|
|
7
7
|
id: string;
|
|
8
8
|
/** Text label shown when no `icon` is set. */
|
|
9
9
|
label: string;
|
|
10
|
-
/** Accessible name
|
|
10
|
+
/** Accessible name - always the control's aria-label. */
|
|
11
11
|
ariaLabel: string;
|
|
12
12
|
/** Registry icon shown instead of the text label. */
|
|
13
13
|
icon?: IconName;
|
|
@@ -16,7 +16,7 @@ interface BaseAction {
|
|
|
16
16
|
/** Consecutive actions sharing a group id render as one joined button cluster. */
|
|
17
17
|
group?: string;
|
|
18
18
|
}
|
|
19
|
-
/** Wraps the selection (or a placeholder) in a leading/trailing marker
|
|
19
|
+
/** Wraps the selection (or a placeholder) in a leading/trailing marker - bold, links, code blocks. */
|
|
20
20
|
interface WrapAction extends BaseAction {
|
|
21
21
|
kind: 'wrap';
|
|
22
22
|
prefix: string;
|
|
@@ -25,14 +25,14 @@ interface WrapAction extends BaseAction {
|
|
|
25
25
|
/** Block-level fence (e.g. code block): separated by newlines and never toggled off. */
|
|
26
26
|
block?: boolean;
|
|
27
27
|
}
|
|
28
|
-
/** Prepends a marker to every line the selection touches
|
|
28
|
+
/** Prepends a marker to every line the selection touches - headings, quotes, lists. */
|
|
29
29
|
interface LinePrefixAction extends BaseAction {
|
|
30
30
|
kind: 'linePrefix';
|
|
31
31
|
linePrefix: string;
|
|
32
32
|
/**
|
|
33
33
|
* Line-start pattern for a family of mutually-exclusive markers (e.g. all list types). When
|
|
34
34
|
* set, applying the action strips any matching marker first, then toggles its own off or
|
|
35
|
-
* replaces a sibling's
|
|
35
|
+
* replaces a sibling's - so the list/ordered/task buttons swap and toggle instead of stacking.
|
|
36
36
|
*/
|
|
37
37
|
family?: RegExp;
|
|
38
38
|
/**
|
|
@@ -42,7 +42,7 @@ interface LinePrefixAction extends BaseAction {
|
|
|
42
42
|
*/
|
|
43
43
|
toggle?: boolean;
|
|
44
44
|
}
|
|
45
|
-
/** Inserts a standalone snippet at the caret, ignoring the selection
|
|
45
|
+
/** Inserts a standalone snippet at the caret, ignoring the selection - tables, rules. */
|
|
46
46
|
interface InsertAction extends BaseAction {
|
|
47
47
|
kind: 'insert';
|
|
48
48
|
snippet: string;
|
|
@@ -62,11 +62,11 @@ interface MarkdownContextValue {
|
|
|
62
62
|
onChange: (value: string) => void;
|
|
63
63
|
/** Applies a toolbar action at the last remembered selection and queues the caret to restore. */
|
|
64
64
|
dispatch: (action: ToolbarAction) => void;
|
|
65
|
-
/** Records the current textarea selection
|
|
65
|
+
/** Records the current textarea selection - the Editor calls this on select/blur. */
|
|
66
66
|
rememberSelection: (selection: MarkdownSelection) => void;
|
|
67
67
|
/** Queues a selection to restore after the next value change (e.g. after Tab). */
|
|
68
68
|
queueSelection: (selection: MarkdownSelection) => void;
|
|
69
|
-
/** Returns and clears the queued selection
|
|
69
|
+
/** Returns and clears the queued selection - the Editor's effect calls this to restore focus. */
|
|
70
70
|
takeQueuedSelection: () => MarkdownSelection | null;
|
|
71
71
|
}
|
|
72
72
|
declare const MarkdownContext: import("react").Context<MarkdownContextValue | null>;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { IconName } from "@soroush.tech/design-system/Icon";
|
|
2
2
|
//#region src/const.d.ts
|
|
3
|
-
/** How a text label is rendered
|
|
3
|
+
/** How a text label is rendered - mirrors the mark it inserts. */
|
|
4
4
|
type ToolbarLabelEmphasis = 'bold' | 'italic' | 'strike';
|
|
5
5
|
/** Shared presentation for a toolbar control. */
|
|
6
6
|
interface BaseAction {
|
|
7
7
|
id: string;
|
|
8
8
|
/** Text label shown when no `icon` is set. */
|
|
9
9
|
label: string;
|
|
10
|
-
/** Accessible name
|
|
10
|
+
/** Accessible name - always the control's aria-label. */
|
|
11
11
|
ariaLabel: string;
|
|
12
12
|
/** Registry icon shown instead of the text label. */
|
|
13
13
|
icon?: IconName;
|
|
@@ -16,7 +16,7 @@ interface BaseAction {
|
|
|
16
16
|
/** Consecutive actions sharing a group id render as one joined button cluster. */
|
|
17
17
|
group?: string;
|
|
18
18
|
}
|
|
19
|
-
/** Wraps the selection (or a placeholder) in a leading/trailing marker
|
|
19
|
+
/** Wraps the selection (or a placeholder) in a leading/trailing marker - bold, links, code blocks. */
|
|
20
20
|
interface WrapAction extends BaseAction {
|
|
21
21
|
kind: 'wrap';
|
|
22
22
|
prefix: string;
|
|
@@ -25,14 +25,14 @@ interface WrapAction extends BaseAction {
|
|
|
25
25
|
/** Block-level fence (e.g. code block): separated by newlines and never toggled off. */
|
|
26
26
|
block?: boolean;
|
|
27
27
|
}
|
|
28
|
-
/** Prepends a marker to every line the selection touches
|
|
28
|
+
/** Prepends a marker to every line the selection touches - headings, quotes, lists. */
|
|
29
29
|
interface LinePrefixAction extends BaseAction {
|
|
30
30
|
kind: 'linePrefix';
|
|
31
31
|
linePrefix: string;
|
|
32
32
|
/**
|
|
33
33
|
* Line-start pattern for a family of mutually-exclusive markers (e.g. all list types). When
|
|
34
34
|
* set, applying the action strips any matching marker first, then toggles its own off or
|
|
35
|
-
* replaces a sibling's
|
|
35
|
+
* replaces a sibling's - so the list/ordered/task buttons swap and toggle instead of stacking.
|
|
36
36
|
*/
|
|
37
37
|
family?: RegExp;
|
|
38
38
|
/**
|
|
@@ -42,7 +42,7 @@ interface LinePrefixAction extends BaseAction {
|
|
|
42
42
|
*/
|
|
43
43
|
toggle?: boolean;
|
|
44
44
|
}
|
|
45
|
-
/** Inserts a standalone snippet at the caret, ignoring the selection
|
|
45
|
+
/** Inserts a standalone snippet at the caret, ignoring the selection - tables, rules. */
|
|
46
46
|
interface InsertAction extends BaseAction {
|
|
47
47
|
kind: 'insert';
|
|
48
48
|
snippet: string;
|
|
@@ -62,11 +62,11 @@ interface MarkdownContextValue {
|
|
|
62
62
|
onChange: (value: string) => void;
|
|
63
63
|
/** Applies a toolbar action at the last remembered selection and queues the caret to restore. */
|
|
64
64
|
dispatch: (action: ToolbarAction) => void;
|
|
65
|
-
/** Records the current textarea selection
|
|
65
|
+
/** Records the current textarea selection - the Editor calls this on select/blur. */
|
|
66
66
|
rememberSelection: (selection: MarkdownSelection) => void;
|
|
67
67
|
/** Queues a selection to restore after the next value change (e.g. after Tab). */
|
|
68
68
|
queueSelection: (selection: MarkdownSelection) => void;
|
|
69
|
-
/** Returns and clears the queued selection
|
|
69
|
+
/** Returns and clears the queued selection - the Editor's effect calls this to restore focus. */
|
|
70
70
|
takeQueuedSelection: () => MarkdownSelection | null;
|
|
71
71
|
}
|
|
72
72
|
declare const MarkdownContext: import("react").Context<MarkdownContextValue | null>;
|
|
@@ -12,14 +12,14 @@ declare function CodeBlock({ children, ...rest }: Readonly<CodeBlockProps>): imp
|
|
|
12
12
|
//#endregion
|
|
13
13
|
//#region src/CodeBlock/CodeBlock.data.d.ts
|
|
14
14
|
/**
|
|
15
|
-
* Syntax-highlighting tokens for `CodeBlock`
|
|
15
|
+
* Syntax-highlighting tokens for `CodeBlock` - mapped onto highlight.js token classes.
|
|
16
16
|
* Not part of design-system's own scales; `../index.ts` augments
|
|
17
17
|
* `@soroush.tech/design-system/theme` so `theme.syntax` is available wherever this
|
|
18
18
|
* package is imported. Merge one of the presets below into your theme via
|
|
19
19
|
* `createTheme(baseTheme, { syntax: syntaxDark })`, or supply your own.
|
|
20
20
|
*/
|
|
21
21
|
interface ThemeSyntax {
|
|
22
|
-
/** Default code text
|
|
22
|
+
/** Default code text - plain identifiers, operators, punctuation. */
|
|
23
23
|
base: string;
|
|
24
24
|
/** Keywords, built-ins, types, literals, selector tags. */
|
|
25
25
|
keyword: string;
|
|
@@ -33,11 +33,11 @@ interface ThemeSyntax {
|
|
|
33
33
|
constant: string;
|
|
34
34
|
/** Type and class names. */
|
|
35
35
|
type: string;
|
|
36
|
-
/** Comments and quotes
|
|
36
|
+
/** Comments and quotes - rendered dimmed and italic. */
|
|
37
37
|
comment: string;
|
|
38
38
|
/** Markup tags/names, meta, variables, deletions. */
|
|
39
39
|
tag: string;
|
|
40
|
-
/** Font family for the code surface
|
|
40
|
+
/** Font family for the code surface - independent of `theme.fonts.mono`. */
|
|
41
41
|
font: string;
|
|
42
42
|
}
|
|
43
43
|
/** Matched to the JetBrains "Islands Dark" editor scheme. */
|
|
@@ -12,14 +12,14 @@ declare function CodeBlock({ children, ...rest }: Readonly<CodeBlockProps>): imp
|
|
|
12
12
|
//#endregion
|
|
13
13
|
//#region src/CodeBlock/CodeBlock.data.d.ts
|
|
14
14
|
/**
|
|
15
|
-
* Syntax-highlighting tokens for `CodeBlock`
|
|
15
|
+
* Syntax-highlighting tokens for `CodeBlock` - mapped onto highlight.js token classes.
|
|
16
16
|
* Not part of design-system's own scales; `../index.ts` augments
|
|
17
17
|
* `@soroush.tech/design-system/theme` so `theme.syntax` is available wherever this
|
|
18
18
|
* package is imported. Merge one of the presets below into your theme via
|
|
19
19
|
* `createTheme(baseTheme, { syntax: syntaxDark })`, or supply your own.
|
|
20
20
|
*/
|
|
21
21
|
interface ThemeSyntax {
|
|
22
|
-
/** Default code text
|
|
22
|
+
/** Default code text - plain identifiers, operators, punctuation. */
|
|
23
23
|
base: string;
|
|
24
24
|
/** Keywords, built-ins, types, literals, selector tags. */
|
|
25
25
|
keyword: string;
|
|
@@ -33,11 +33,11 @@ interface ThemeSyntax {
|
|
|
33
33
|
constant: string;
|
|
34
34
|
/** Type and class names. */
|
|
35
35
|
type: string;
|
|
36
|
-
/** Comments and quotes
|
|
36
|
+
/** Comments and quotes - rendered dimmed and italic. */
|
|
37
37
|
comment: string;
|
|
38
38
|
/** Markup tags/names, meta, variables, deletions. */
|
|
39
39
|
tag: string;
|
|
40
|
-
/** Font family for the code surface
|
|
40
|
+
/** Font family for the code surface - independent of `theme.fonts.mono`. */
|
|
41
41
|
font: string;
|
|
42
42
|
}
|
|
43
43
|
/** Matched to the JetBrains "Islands Dark" editor scheme. */
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { a as CodeBlockProps } from "./index-
|
|
2
|
-
import { r as MermaidProps } from "./index-
|
|
1
|
+
import { a as CodeBlockProps } from "./index-D1rI6OgO.cjs";
|
|
2
|
+
import { r as MermaidProps } from "./index-Bd3yPDn_.cjs";
|
|
3
3
|
import { ViewProps } from "@soroush.tech/design-system/View";
|
|
4
4
|
import { QuoteProps } from "@soroush.tech/design-system/Quote";
|
|
5
5
|
import { CheckboxProps } from "@soroush.tech/design-system/Checkbox";
|
|
@@ -10,7 +10,7 @@ import { TypographyProps } from "@soroush.tech/design-system/Typography";
|
|
|
10
10
|
//#region src/Preview/Preview.d.ts
|
|
11
11
|
/**
|
|
12
12
|
* Per-element prop overrides, merged over the design-system defaults (the caller's props win).
|
|
13
|
-
* Keyed by markdown element
|
|
13
|
+
* Keyed by markdown element - e.g. `slotProps={{ p: { color: 'primary' }, h1: { variant: 'h2' } }}`.
|
|
14
14
|
*/
|
|
15
15
|
interface PreviewSlotProps {
|
|
16
16
|
h1?: TypographyProps;
|
|
@@ -38,7 +38,7 @@ interface PreviewSlotProps {
|
|
|
38
38
|
thead?: TableHeadProps;
|
|
39
39
|
tbody?: TableBodyProps;
|
|
40
40
|
tr?: TableRowProps;
|
|
41
|
-
/** Props for a ` ```mermaid ` fence's `Mermaid` renderer
|
|
41
|
+
/** Props for a ` ```mermaid ` fence's `Mermaid` renderer - including `diagram` (viewer) props. */
|
|
42
42
|
mermaid?: Omit<MermaidProps, 'chart'>;
|
|
43
43
|
}
|
|
44
44
|
interface PreviewProps {
|
package/dist/index.cjs
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
const require_Preview = require("./Preview-
|
|
2
|
+
const require_Preview = require("./Preview-CnMWUtU2.cjs");
|
|
3
3
|
const require_MarkdownContext = require("./MarkdownContext.cjs");
|
|
4
4
|
const require_Control = require("./Control.cjs");
|
|
5
|
-
const require_Toolbar = require("./Toolbar-
|
|
5
|
+
const require_Toolbar = require("./Toolbar-CRlLqvj9.cjs");
|
|
6
6
|
const require_Editor = require("./Editor.cjs");
|
|
7
7
|
const require_CodeBlock = require("./CodeBlock-Cymx1ZAY.cjs");
|
|
8
|
-
const require_Mermaid = require("./Mermaid-
|
|
9
|
-
const require_LiveEdit = require("./LiveEdit-
|
|
8
|
+
const require_Mermaid = require("./Mermaid-CkUan4z-.cjs");
|
|
9
|
+
const require_LiveEdit = require("./LiveEdit-CbRkmd43.cjs");
|
|
10
10
|
exports.CodeBlock = require_CodeBlock.CodeBlock;
|
|
11
11
|
exports.Control = require_Control.Control;
|
|
12
12
|
exports.Editor = require_Editor.Editor;
|
package/dist/index.d.cts
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import { a as CodeBlockProps, i as CodeBlock, n as syntaxDark, r as syntaxLight, t as ThemeSyntax } from "./index-
|
|
1
|
+
import { a as CodeBlockProps, i as CodeBlock, n as syntaxDark, r as syntaxLight, t as ThemeSyntax } from "./index-D1rI6OgO.cjs";
|
|
2
2
|
import { Control, ControlProps } from "./Control.cjs";
|
|
3
3
|
import { Editor, EditorProps } from "./Editor.cjs";
|
|
4
|
-
import { n as Mermaid, r as MermaidProps, t as DiagramProps } from "./index-
|
|
5
|
-
import { n as PreviewProps, r as PreviewSlotProps, t as Preview } from "./index-
|
|
4
|
+
import { n as Mermaid, r as MermaidProps, t as DiagramProps } from "./index-Bd3yPDn_.cjs";
|
|
5
|
+
import { n as PreviewProps, r as PreviewSlotProps, t as Preview } from "./index-TT9-Qjsh.cjs";
|
|
6
6
|
import { LiveEdit, LiveEditProps } from "./LiveEdit.cjs";
|
|
7
|
-
import { i as useMarkdownContext, n as MarkdownContextValue, r as MarkdownSelection, t as MarkdownContext } from "./index-
|
|
7
|
+
import { i as useMarkdownContext, n as MarkdownContextValue, r as MarkdownSelection, t as MarkdownContext } from "./index-Cre2ivJn.cjs";
|
|
8
8
|
import { TablePicker, TablePickerProps, Toolbar } from "./Toolbar.cjs";
|
|
9
9
|
//#region src/index.d.ts
|
|
10
10
|
/**
|
|
11
11
|
* Per-theme overrides for the `Mermaid` renderer, merged over (and winning against) its default
|
|
12
12
|
* mermaid `themeVariables`. Common variables are listed for autocomplete; any other mermaid theme
|
|
13
|
-
* variable is accepted. Set via `theme.mermaid` (e.g. `createTheme(baseTheme, { mermaid:
|
|
13
|
+
* variable is accepted. Set via `theme.mermaid` (e.g. `createTheme(baseTheme, { mermaid: ... })`).
|
|
14
14
|
*/
|
|
15
15
|
interface MermaidThemeVariables {
|
|
16
16
|
darkMode?: boolean;
|
|
@@ -41,7 +41,7 @@ declare module '@soroush.tech/design-system/theme' {
|
|
|
41
41
|
/** Per-theme overrides for the `Mermaid` renderer's mermaid `themeVariables`. */
|
|
42
42
|
mermaid?: MermaidThemeVariables;
|
|
43
43
|
/**
|
|
44
|
-
* Syntax-highlighting tokens for `CodeBlock`
|
|
44
|
+
* Syntax-highlighting tokens for `CodeBlock` - see `syntaxDark`/`syntaxLight`. Optional
|
|
45
45
|
* only so `design-system`'s own `baseTheme` literal still satisfies `Theme` in this
|
|
46
46
|
* monorepo's source-consuming builds; `CodeBlock` requires it in practice (no fallback).
|
|
47
47
|
*/
|
package/dist/index.d.mts
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import { a as CodeBlockProps, i as CodeBlock, n as syntaxDark, r as syntaxLight, t as ThemeSyntax } from "./index-
|
|
1
|
+
import { a as CodeBlockProps, i as CodeBlock, n as syntaxDark, r as syntaxLight, t as ThemeSyntax } from "./index-D1rI6OgO.mjs";
|
|
2
2
|
import { Control, ControlProps } from "./Control.mjs";
|
|
3
3
|
import { Editor, EditorProps } from "./Editor.mjs";
|
|
4
|
-
import { n as Mermaid, r as MermaidProps, t as DiagramProps } from "./index-
|
|
5
|
-
import { n as PreviewProps, r as PreviewSlotProps, t as Preview } from "./index-
|
|
4
|
+
import { n as Mermaid, r as MermaidProps, t as DiagramProps } from "./index-Bd3yPDn_.mjs";
|
|
5
|
+
import { n as PreviewProps, r as PreviewSlotProps, t as Preview } from "./index-CBKWWR5Q.mjs";
|
|
6
6
|
import { LiveEdit, LiveEditProps } from "./LiveEdit.mjs";
|
|
7
|
-
import { i as useMarkdownContext, n as MarkdownContextValue, r as MarkdownSelection, t as MarkdownContext } from "./index-
|
|
7
|
+
import { i as useMarkdownContext, n as MarkdownContextValue, r as MarkdownSelection, t as MarkdownContext } from "./index-Cre2ivJn.mjs";
|
|
8
8
|
import { TablePicker, TablePickerProps, Toolbar } from "./Toolbar.mjs";
|
|
9
9
|
//#region src/index.d.ts
|
|
10
10
|
/**
|
|
11
11
|
* Per-theme overrides for the `Mermaid` renderer, merged over (and winning against) its default
|
|
12
12
|
* mermaid `themeVariables`. Common variables are listed for autocomplete; any other mermaid theme
|
|
13
|
-
* variable is accepted. Set via `theme.mermaid` (e.g. `createTheme(baseTheme, { mermaid:
|
|
13
|
+
* variable is accepted. Set via `theme.mermaid` (e.g. `createTheme(baseTheme, { mermaid: ... })`).
|
|
14
14
|
*/
|
|
15
15
|
interface MermaidThemeVariables {
|
|
16
16
|
darkMode?: boolean;
|
|
@@ -41,7 +41,7 @@ declare module '@soroush.tech/design-system/theme' {
|
|
|
41
41
|
/** Per-theme overrides for the `Mermaid` renderer's mermaid `themeVariables`. */
|
|
42
42
|
mermaid?: MermaidThemeVariables;
|
|
43
43
|
/**
|
|
44
|
-
* Syntax-highlighting tokens for `CodeBlock`
|
|
44
|
+
* Syntax-highlighting tokens for `CodeBlock` - see `syntaxDark`/`syntaxLight`. Optional
|
|
45
45
|
* only so `design-system`'s own `baseTheme` literal still satisfies `Theme` in this
|
|
46
46
|
* monorepo's source-consuming builds; `CodeBlock` requires it in practice (no fallback).
|
|
47
47
|
*/
|
package/dist/index.mjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { MarkdownContext, useMarkdownContext } from "./MarkdownContext.mjs";
|
|
2
2
|
import { Control } from "./Control.mjs";
|
|
3
|
-
import { n as TablePicker, t as Toolbar } from "./Toolbar-
|
|
3
|
+
import { n as TablePicker, t as Toolbar } from "./Toolbar-BoEuAIiw.mjs";
|
|
4
4
|
import { Editor } from "./Editor.mjs";
|
|
5
5
|
import { n as syntaxLight, r as CodeBlock, t as syntaxDark } from "./CodeBlock-CVlrvVPP.mjs";
|
|
6
|
-
import { t as Mermaid } from "./Mermaid-
|
|
7
|
-
import { t as Preview } from "./Preview-
|
|
8
|
-
import { t as LiveEdit } from "./LiveEdit-
|
|
6
|
+
import { t as Mermaid } from "./Mermaid-B7vDwGQG.mjs";
|
|
7
|
+
import { t as Preview } from "./Preview-BFyaPHjw.mjs";
|
|
8
|
+
import { t as LiveEdit } from "./LiveEdit-CaMZLJCs.mjs";
|
|
9
9
|
export { CodeBlock, Control, Editor, LiveEdit, MarkdownContext, Mermaid, Preview, TablePicker, Toolbar, syntaxDark, syntaxLight, useMarkdownContext };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@soroush.tech/markdown",
|
|
3
|
-
"version": "1.2.
|
|
4
|
-
"description": "Headless, composable markdown editor + renderer for @soroush.tech/design-system
|
|
3
|
+
"version": "1.2.2",
|
|
4
|
+
"description": "Headless, composable markdown editor + renderer for @soroush.tech/design-system - Control, Toolbar, Editor, and Preview built on react-markdown, remark-gfm, and rehype-highlight.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"markdown",
|
|
7
7
|
"editor",
|
|
@@ -67,36 +67,31 @@
|
|
|
67
67
|
"peerDependencies": {
|
|
68
68
|
"react": "^19.2.8",
|
|
69
69
|
"react-dom": "^19.2.8",
|
|
70
|
-
"@soroush.tech/design-system": "^1.
|
|
70
|
+
"@soroush.tech/design-system": "^1.3.3"
|
|
71
71
|
},
|
|
72
72
|
"devDependencies": {
|
|
73
|
-
"@storybook/react-vite": "^10.5.
|
|
74
|
-
"@testing-library/jest-dom": "^7.0.
|
|
73
|
+
"@storybook/react-vite": "^10.5.8",
|
|
74
|
+
"@testing-library/jest-dom": "^7.0.1",
|
|
75
75
|
"@testing-library/react": "^16.3.2",
|
|
76
76
|
"@types/node": "^26.1.2",
|
|
77
77
|
"@types/react": "^19.2.18",
|
|
78
78
|
"@types/react-dom": "^19.2.4",
|
|
79
79
|
"@vitest/coverage-v8": "^4.1.10",
|
|
80
|
-
"eslint": "^10.8.0",
|
|
81
|
-
"eslint-plugin-react": "^7.37.5",
|
|
82
|
-
"eslint-plugin-react-hooks": "^7.1.1",
|
|
83
|
-
"eslint-plugin-react-refresh": "^0.5.3",
|
|
84
|
-
"eslint-plugin-storybook": "^10.5.6",
|
|
85
|
-
"globals": "^17.9.0",
|
|
86
80
|
"jsdom": "^29.1.1",
|
|
81
|
+
"oxlint": "^1.78.0",
|
|
87
82
|
"react": "^19.2.8",
|
|
88
83
|
"react-dom": "^19.2.8",
|
|
89
|
-
"storybook": "^10.5.
|
|
84
|
+
"storybook": "^10.5.8",
|
|
90
85
|
"tsdown": "^0.22.14",
|
|
91
|
-
"typescript": "~
|
|
86
|
+
"typescript": "~7.0.2",
|
|
92
87
|
"vitest": "^4.1.10",
|
|
93
|
-
"@soroush.tech/design-system": "1.
|
|
88
|
+
"@soroush.tech/design-system": "1.3.3",
|
|
94
89
|
"@soroush.tech/eslint-config": "0.0.0",
|
|
95
90
|
"@soroush.tech/hooks": "0.1.0"
|
|
96
91
|
},
|
|
97
92
|
"scripts": {
|
|
98
93
|
"build": "tsdown",
|
|
99
|
-
"lint": "
|
|
94
|
+
"lint": "oxlint --deny-warnings",
|
|
100
95
|
"typecheck": "tsc --noEmit",
|
|
101
96
|
"test": "vitest run",
|
|
102
97
|
"test:coverage": "vitest run --coverage",
|