@clepit/core 0.2.0-beta.322

package/dist/tools/block/openapi/spec.d.ts

@@ -0,0 +1,46 @@
+import { OpenApiData } from '../../../types';
+export type OpenApiParam = {
+    description?: string;
+    in: 'header' | 'path' | 'query';
+    name: string;
+    required: boolean;
+    schema?: unknown;
+};
+export type OpenApiResponse = {
+    description: string;
+    schema?: unknown;
+    status: string;
+};
+export type OpenApiOperation = {
+    description?: string;
+    id: string;
+    internal: boolean;
+    method: string;
+    params: OpenApiParam[];
+    path: string;
+    request?: unknown;
+    responses: OpenApiResponse[];
+    security: string[];
+    server?: string;
+    summary: string;
+    tags: string[];
+};
+export type OpenApiGroup = {
+    id: string;
+    operations: OpenApiOperation[];
+    title: string;
+};
+export type OpenApiServer = {
+    description?: string;
+    url: string;
+};
+export type OpenApiModel = {
+    groups: OpenApiGroup[];
+    schemas: Record<string, unknown>;
+    servers: OpenApiServer[];
+    title: string;
+    version: string;
+};
+export declare const slugify: (text: string) => string;
+export declare const parseOpenApi: (spec: unknown, data: OpenApiData) => OpenApiModel;
+//# sourceMappingURL=spec.d.ts.map

package/dist/tools/block/paragraph/css.d.ts

@@ -0,0 +1,5 @@
+export declare const inputStylesKey = "clepit-paragraph-input-styles";
+export declare const inputStyle = "\n/* Paragraph block styles */\n.clepit-paragraph {\n  outline: none;\n  margin: 0;\n  margin-block-start: 0;\n  margin-block-end: 0;\n  margin-inline-start: 0;\n  margin-inline-end: 0;\n  padding: 0 20px;\n}\n\n.clepit-block[data-tool=\"paragraph\"] .clepit-block-content {\n  font-size: 16px;\n  line-height: 1.6;\n}\n\n/* Paragraph placeholder styles */\n.clepit-paragraph[data-placeholder]:empty::before {\n  content: attr(data-placeholder);\n  color: var(--clepit-text-subtle);\n  pointer-events: none;\n  font-style: italic;\n}\n\n/* Paragraph link styles */\n.clepit-paragraph a {\n  color: var(--clepit-primary);\n  text-decoration: none;\n  cursor: pointer;\n  transition: color 0.2s ease;\n}\n\n.clepit-paragraph a:hover {\n  color: var(--clepit-primary-hover);\n  text-decoration: none;\n}\n\n/* Paragraph inline code styling */\n.clepit-paragraph code {\n  background: var(--clepit-error-bg);\n  color: var(--clepit-error);\n  padding: 0 4px;\n  border-radius: 4px;\n}\n\n/* Paragraph marker brush effect */\n.clepit-paragraph mark {\n  background: none;\n  position: relative;\n  color: inherit;\n  display: inline-block;\n  z-index: 0; /* create stacking context so ::before sits behind text, not page */\n  white-space: pre-wrap; /* ensure leading/trailing spaces inside mark render */\n}\n\n.clepit-paragraph mark::before {\n  content: '';\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0.15em;\n  height: 1.25em;\n  transform: rotate(-0.4deg);\n  background: url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'><path d='M0,8 C5,2 15,1 25,3 35,5 45,2 55,4 65,6 75,5 85,7 95,9 100,8 100,8 100,14 95,18 85,17 75,16 65,19 55,17 45,15 35,18 25,16 15,14 5,15 0,12 Z' fill='%23FFE047'/></svg>\") no-repeat center / 100% 100%;\n  z-index: -1; /* behind text but within mark's stacking context */\n}\n\n";
+export declare const outputStylesKey = "clepit-paragraph-output-styles";
+export declare const outputStyle = "\n/* Output paragraph styles */\n.clepit-output-paragraph {\n  margin: 0 0 1rem 0;\n  line-height: 1.6;\n  color: var(--clepit-text);\n}\n\n/* Output paragraph inline code styling */\n.clepit-output-paragraph code {\n  background: var(--clepit-error-bg);\n  color: var(--clepit-error);\n  padding: 0 4px;\n  border-radius: 4px;\n}\n\n/* Output paragraph marker brush effect */\n.clepit-output-paragraph mark {\n  background: none;\n  position: relative;\n  color: inherit;\n  display: inline-block;\n  z-index: 0;\n  white-space: pre-wrap;\n}\n\n.clepit-output-paragraph mark::before {\n  content: '';\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0.15em;\n  height: 1.25em;\n  transform: rotate(-0.4deg);\n  background: url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'><path d='M0,8 C5,2 15,1 25,3 35,5 45,2 55,4 65,6 75,5 85,7 95,9 100,8 100,8 100,14 95,18 85,17 75,16 65,19 55,17 45,15 35,18 25,16 15,14 5,15 0,12 Z' fill='%23FFE047'/></svg>\") no-repeat center / 100% 100%;\n  z-index: -1;\n}\n\n/* Output paragraph link styles */\n.clepit-output-paragraph a {\n  color: var(--clepit-primary);\n  text-decoration: none;\n  cursor: pointer;\n  transition: color 0.2s ease;\n}\n\n.clepit-output-paragraph a:hover {\n  color: var(--clepit-primary-hover);\n  text-decoration: none;\n}\n";
+//# sourceMappingURL=css.d.ts.map

package/dist/tools/block/paragraph/index.d.ts

@@ -0,0 +1,13 @@
+import { ParagraphInput } from './input';
+import { ParagraphOutput } from './output';
+import { ToolType } from '../../../types';
+export declare const ParagraphTool: {
+    icon: string;
+    readonly input: typeof ParagraphInput;
+    label: string;
+    readonly output: typeof ParagraphOutput;
+    shortcut: string;
+    testId: string;
+    type: ToolType;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/tools/block/paragraph/input.d.ts

@@ -0,0 +1,12 @@
+import { InputConfig, ParagraphData } from '../../../types';
+export declare class ParagraphInput {
+    static placeholder: string;
+    private static eventListenersMap;
+    private static addEventListener;
+    static save(element: HTMLElement): ParagraphData;
+    static render(containerId: string, data?: ParagraphData, config?: InputConfig<'paragraph'>): HTMLElement;
+    static isEmpty(blockElement: HTMLElement): boolean;
+    static isEmptyData(data: ParagraphData): boolean;
+    static destroy(containerId: string): void;
+}
+//# sourceMappingURL=input.d.ts.map

package/dist/tools/block/paragraph/output.d.ts

@@ -0,0 +1,13 @@
+import { Backing, ClepitElement } from '../../../core/element';
+import { BlockClassNames, BlockStyles, OutputConfig, ParagraphData } from '../../../types';
+export declare class ParagraphOutput {
+    static render(data: ParagraphData, config?: OutputConfig, styles?: BlockStyles['paragraph'], classNames?: BlockClassNames['paragraph']): HTMLElement;
+    /**
+     * The same drawing, expressed against the element layer so it can run with no
+     * browser. `render` above stays the DOM path the editor uses; this is what a
+     * consumer server-rendering the package calls.
+     */
+    static draw(data: ParagraphData, backing?: Backing): ClepitElement | null;
+    private static validate;
+}
+//# sourceMappingURL=output.d.ts.map

package/dist/tools/block/quote/css.d.ts

@@ -0,0 +1,5 @@
+export declare const inputStylesKey = "clepit-quote-input-styles";
+export declare const inputStyle: string;
+export declare const outputStylesKey = "clepit-quote-output-styles";
+export declare const outputStyle = "\n/* Output quote styles */\n.clepit-output-quote-container {\n  background: linear-gradient(135deg, var(--clepit-surface) 0%, var(--clepit-surface-2) 100%);\n  border: 1px solid var(--clepit-border);\n  border-radius: 4px;\n  padding: 12px 14px;\n  margin: 20px 0;\n  position: relative;\n}\n\n.clepit-output-quote-author {\n  color: var(--clepit-text-muted);\n  font-size: 0.9em;\n  font-style: normal;\n  font-family: inherit;\n  text-align: right;\n  margin-top: 10px;\n}\n\n.clepit-output-quote-divider {\n  height: 1px;\n  margin: 15px 0;\n  background: linear-gradient(to right, transparent, var(--clepit-border-subtle), transparent);\n}\n\n.clepit-output-quote-text {\n  font-size: 1.2em;\n  line-height: 1.6;\n  font-family: cursive, serif;\n  font-style: italic;\n  margin-bottom: 15px;\n}\n\n.clepit-output-quote-content {\n  /* Content styling handled by parent */\n}\n\n/* Output quote link styles */\n.clepit-output-quote a {\n  color: var(--clepit-primary);\n  text-decoration: none;\n  cursor: pointer;\n  transition: color 0.2s ease;\n}\n\n.clepit-output-quote a:hover {\n  color: var(--clepit-primary-hover);\n  text-decoration: none;\n}\n\n/* Output quote inline code styling */\n.clepit-output-quote code {\n  background: var(--clepit-error-bg);\n  color: var(--clepit-error);\n  padding: 0 4px;\n  border-radius: 4px;\n}\n\n.clepit-output-quote cite code {\n  background: var(--clepit-error-bg);\n  color: var(--clepit-error);\n  padding: 0 4px;\n  border-radius: 4px;\n}\n\n/* Output quote marker brush effect */\n.clepit-output-quote mark {\n  background: none;\n  position: relative;\n  color: inherit;\n  display: inline-block;\n  z-index: 0;\n  white-space: pre-wrap;\n}\n\n.clepit-output-quote mark::before {\n  content: '';\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0.15em;\n  height: 1.25em;\n  transform: rotate(-0.4deg);\n  background: url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'><path d='M0,8 C5,2 15,1 25,3 35,5 45,2 55,4 65,6 75,5 85,7 95,9 100,8 100,8 100,14 95,18 85,17 75,16 65,19 55,17 45,15 35,18 25,16 15,14 5,15 0,12 Z' fill='%23FFE047'/></svg>\") no-repeat center / 100% 100%;\n  z-index: -1;\n}\n\n.clepit-output-quote cite mark {\n  background: none;\n  position: relative;\n  color: inherit;\n  display: inline-block;\n  z-index: 0;\n  white-space: pre-wrap;\n}\n\n.clepit-output-quote cite mark::before {\n  content: '';\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0.15em;\n  height: 1.25em;\n  transform: rotate(-0.4deg);\n  background: url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'><path d='M0,8 C5,2 15,1 25,3 35,5 45,2 55,4 65,6 75,5 85,7 95,9 100,8 100,8 100,14 95,18 85,17 75,16 65,19 55,17 45,15 35,18 25,16 15,14 5,15 0,12 Z' fill='%23FFE047'/></svg>\") no-repeat center / 100% 100%;\n  z-index: -1;\n}\n";
+//# sourceMappingURL=css.d.ts.map

package/dist/tools/block/quote/index.d.ts

@@ -0,0 +1,13 @@
+import { QuoteInput } from './input';
+import { QuoteOutput } from './output';
+import { ToolType } from '../../../types';
+export declare const QuoteTool: {
+    icon: string;
+    readonly input: typeof QuoteInput;
+    label: string;
+    readonly output: typeof QuoteOutput;
+    shortcut: string;
+    testId: string;
+    type: ToolType;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/tools/block/quote/input.d.ts

@@ -0,0 +1,15 @@
+import { InputConfig, QuoteData } from '../../../types';
+export declare class QuoteInput {
+    static placeholder: string;
+    static authorPlaceholder: string;
+    private static eventListenersMap;
+    private static addEventListener;
+    static save(element: HTMLElement): QuoteData;
+    static render(containerId: string, data?: QuoteData, config?: InputConfig<'quote'>): HTMLElement;
+    private static handleKeydown;
+    static handleKeydownInAuthorInput(event: Event): void;
+    static isEmpty(blockElement: HTMLElement): boolean;
+    static isEmptyData(data: QuoteData): boolean;
+    static destroy(containerId: string): void;
+}
+//# sourceMappingURL=input.d.ts.map

package/dist/tools/block/quote/output.d.ts

@@ -0,0 +1,14 @@
+import { Backing, ClepitElement } from '../../../core/element';
+import { BlockClassNames, BlockStyles, OutputConfig, QuoteData } from '../../../types';
+export declare class QuoteOutput {
+    static render(data: QuoteData, config?: OutputConfig, styles?: BlockStyles['quote'], classNames?: BlockClassNames['quote']): HTMLElement;
+    /**
+     * The same drawing, against the element layer, so it runs with no browser.
+     *
+     * The tooltip pass in `render` is deliberately absent: attaching a tooltip is
+     * interaction, and interaction belongs to the DOM path.
+     */
+    static draw(data: QuoteData, backing?: Backing): ClepitElement | null;
+    private static validate;
+}
+//# sourceMappingURL=output.d.ts.map

package/dist/tools/block/sketch/css.d.ts

@@ -0,0 +1,6 @@
+export declare const inputStylesKey = "sketch-input";
+export declare const outputStylesKey = "sketch-output";
+export declare const sharedStyle = "\n.clepit-sketch {\n  border: 1px solid rgba(127, 127, 127, 0.35);\n  border-radius: 8px;\n  overflow: hidden;\n}\n.clepit-sketch__canvas {\n  display: block;\n  width: 100%;\n  height: 240px;\n  touch-action: none;\n}\n.clepit-sketch--input .clepit-sketch__canvas {\n  cursor: crosshair;\n}\n";
+export declare const inputStyle = "\n.clepit-sketch {\n  border: 1px solid rgba(127, 127, 127, 0.35);\n  border-radius: 8px;\n  overflow: hidden;\n}\n.clepit-sketch__canvas {\n  display: block;\n  width: 100%;\n  height: 240px;\n  touch-action: none;\n}\n.clepit-sketch--input .clepit-sketch__canvas {\n  cursor: crosshair;\n}\n";
+export declare const outputStyle = "\n.clepit-sketch {\n  border: 1px solid rgba(127, 127, 127, 0.35);\n  border-radius: 8px;\n  overflow: hidden;\n}\n.clepit-sketch__canvas {\n  display: block;\n  width: 100%;\n  height: 240px;\n  touch-action: none;\n}\n.clepit-sketch--input .clepit-sketch__canvas {\n  cursor: crosshair;\n}\n";
+//# sourceMappingURL=css.d.ts.map

package/dist/tools/block/sketch/index.d.ts

@@ -0,0 +1,13 @@
+import { SketchInput } from './input';
+import { SketchOutput } from './output';
+import { ToolType } from '../../../types';
+export declare const SketchTool: {
+    icon: string;
+    readonly input: typeof SketchInput;
+    label: string;
+    readonly output: typeof SketchOutput;
+    shortcut: string;
+    testId: string;
+    type: ToolType;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/tools/block/sketch/input.d.ts

@@ -0,0 +1,14 @@
+import { InputConfig, SketchData } from '../../../types';
+export declare class SketchInput {
+    static placeholder: string;
+    private static eventListenersMap;
+    static save(element: HTMLElement): SketchData;
+    static render(containerId: string, data?: SketchData, config?: InputConfig<'sketch'>): HTMLElement;
+    /** Pointer events, not mouse: one code path covers pen, touch and mouse, and
+     * pointer capture keeps a stroke attached when the cursor leaves the canvas. */
+    private static attachDrawing;
+    static isEmpty(blockElement: HTMLElement): boolean;
+    static isEmptyData(data: SketchData): boolean;
+    static destroy(containerId: string): void;
+}
+//# sourceMappingURL=input.d.ts.map

package/dist/tools/block/sketch/output.d.ts

@@ -0,0 +1,16 @@
+import { Backing, ClepitElement } from '../../../core/element';
+import { BlockClassNames, BlockStyles, OutputConfig, SketchData } from '../../../types';
+/** The drawing surface's fixed logical height. Strokes are stored in these
+ * coordinates so a sketch drawn on a phone renders identically here. Must match
+ * `sketchCanvasHeight` in the Dart twin. */
+export declare const SKETCH_CANVAS_HEIGHT = 240;
+export declare class SketchOutput {
+    static render(data: SketchData, _config?: OutputConfig, styles?: BlockStyles['sketch'], classNames?: BlockClassNames['sketch']): HTMLElement;
+    /** The same drawing, against the element layer, so it runs with no browser.
+     * The SVG namespace is carried through `createNS` so the editor still gets a
+     * real SVG element rather than an unknown HTML tag that renders as nothing. */
+    static draw(data: SketchData, backing?: Backing): ClepitElement | null;
+    private static safeWidth;
+    private static validate;
+}
+//# sourceMappingURL=output.d.ts.map

package/dist/tools/block/table/css.d.ts

@@ -0,0 +1,5 @@
+export declare const inputStylesKey = "clepit-table-input-styles";
+export declare const inputStyle: string;
+export declare const outputStylesKey = "clepit-table-output-styles";
+export declare const outputStyle = "\n/* Output table styles */\n.clepit-output-table-container {\n  margin: 1rem 0;\n  overflow-x: auto;\n}\n\n.clepit-output-table {\n  width: 100%;\n  border-collapse: collapse;\n  border: 1px solid var(--clepit-border);\n  border-radius: 8px;\n  overflow: hidden;\n  background: var(--clepit-bg);\n  box-shadow: 0 1px 2px rgba(0,0,0,0.04);\n}\n\n/* House style: rows carry no horizontal dividers and no column rules. Rows are\n * told apart by zebra striping, which is what does that job instead \u2014 removing\n * the rules is not a licence to remove the banding too. */\n/* These four rules were assigned from JavaScript, one element at a time, which\n * is a browser call inside a render path. In a stylesheet they cost nothing to\n * a page that draws without a browser, and a caller's own inline style still\n * wins over them exactly as it did before. */\n.clepit-output-table-wrapper {\n  overflow: hidden;\n  width: 100%;\n  border-radius: 4px;\n  margin-bottom: 1rem;\n}\n\n.clepit-output-table-scroller {\n  overflow-x: auto;\n}\n\n.clepit-output-table {\n  table-layout: auto;\n  margin-top: 0;\n  margin-bottom: 0;\n  border-radius: 0;\n}\n\n.clepit-output-table th,\n.clepit-output-table td {\n  padding: 10px 12px;\n  text-align: left;\n  min-width: 120px;\n  max-width: 400px;\n}\n\n.clepit-output-table th {\n  background: var(--clepit-surface);\n  border-bottom: 1px solid var(--clepit-border);\n  color: var(--clepit-text);\n  font-weight: 600;\n}\n\n.clepit-output-table tbody tr:nth-child(odd) {\n  background: var(--clepit-bg);\n}\n\n.clepit-output-table tbody tr:nth-child(even) {\n  background: var(--clepit-surface);\n}\n\n/* No hover state: a rendered table is display, not a control. A row that\n * changes colour under the pointer reads as clickable when it is not. */\n\n/* Table Output Caption */\n.clepit-output-table-caption {\n  margin-top: 0.5rem;\n  font-size: 0.875rem;\n  color: var(--clepit-text-muted);\n  font-style: italic;\n  text-align: center;\n}\n\n/* Make footer cell neutral so caption styles are visible */\n.clepit-output-table tfoot td,\n.clepit-output-table tfoot .clepit-output-table-caption-cell {\n  padding: 0;\n  border: 0;\n  background: transparent;\n}\n\n.clepit-output-table-download-btn {\n  margin-left: auto;\n  width: 24px;\n  height: 24px;\n  border: none;\n  outline: none;\n  cursor: pointer;\n  border-radius: 50%;\n  background: transparent;\n  transition: all 0.2s ease;\n  padding: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n}\n\n.clepit-output-table-download-btn:hover {\n  background: var(--clepit-bg);\n}\n\n.clepit-output-table-download-btn:hover .clepit-download-icon {\n  stroke: var(--clepit-primary);\n}\n\n.clepit-output-table-download-btn:active {\n  transform: scale(0.95);\n}\n\n.clepit-download-icon {\n  width: 20px;\n  height: 20px;\n  stroke: var(--clepit-text-muted);\n  transition: stroke 0.2s ease;\n}\n\n.clepit-output-table-footer-container {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 12px;\n  background: var(--clepit-surface);\n  border: 1px solid var(--clepit-border);\n  border-top: none;\n  border-radius: 0 0 8px 8px;\n}\n";
+//# sourceMappingURL=css.d.ts.map

package/dist/tools/block/table/index.d.ts

@@ -0,0 +1,13 @@
+import { TableInput } from './input';
+import { TableOutput } from './output';
+import { ToolType } from '../../../types';
+export declare const TableTool: {
+    icon: string;
+    readonly input: typeof TableInput;
+    label: string;
+    readonly output: typeof TableOutput;
+    shortcut: string;
+    testId: string;
+    type: ToolType;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/tools/block/table/input.d.ts

@@ -0,0 +1,28 @@
+import { InputConfig, TableData } from '../../../types';
+export declare class TableInput {
+    private static defaultCols;
+    private static defaultRows;
+    private static headerPlaceholder;
+    private static cellPlaceholder;
+    private static captionPlaceholder;
+    private static defaultData;
+    private static eventListenersMap;
+    private static addEventListener;
+    static save(element: HTMLElement): TableData;
+    static render(containerId: string, data?: TableData, config?: InputConfig<'table'>): HTMLElement;
+    private static createRow;
+    private static createCell;
+    private static createHeaderCell;
+    static handleAction(action: string, container: HTMLElement): void;
+    private static addRow;
+    private static removeRow;
+    private static addColumn;
+    private static removeColumn;
+    private static createMenu;
+    private static handleClick;
+    private static handleKeydown;
+    static isEmpty(blockElement: HTMLElement): boolean;
+    static isEmptyData(data: TableData): boolean;
+    static destroy(containerId: string): void;
+}
+//# sourceMappingURL=input.d.ts.map

package/dist/tools/block/table/output.d.ts

@@ -0,0 +1,28 @@
+import { Backing, ClepitElement } from '../../../core/element';
+import { BlockClassNames, BlockStyles, OutputConfig, TableData } from '../../../types';
+export declare class TableOutput {
+    private static eventListenersMap;
+    private static addEventListener;
+    static render(data: TableData, _config?: OutputConfig, styles?: BlockStyles['table'], classNames?: BlockClassNames['table'], containerId?: string): HTMLElement;
+    /**
+     * Everything the drawing deliberately left out.
+     *
+     * Turning a table into a CSV needs a Blob, an object URL and a synthetic
+     * click, none of which mean anything without a live page, so the download
+     * button is drawn as markup and wired only here.
+     */
+    private static attach;
+    /**
+     * The block as markup, with no browser involved.
+     *
+     * The download button is drawn but not wired: turning a table into a CSV
+     * needs a Blob, an object URL and a click, none of which mean anything
+     * without a live page, so all of that stays in the attach step.
+     */
+    static draw(data: TableData, backing?: Backing): ClepitElement | null;
+    private static drawDownloadIcon;
+    private static validate;
+    private static downloadTableAsCSV;
+    static destroy(containerId: string): void;
+}
+//# sourceMappingURL=output.d.ts.map

package/dist/tools/block/toc/css.d.ts

@@ -0,0 +1,6 @@
+export declare const inputStylesKey = "toc-input";
+export declare const outputStylesKey = "toc-output";
+export declare const sharedStyle = "\n.clepit-toc {\n  display: block;\n}\n.clepit-toc__entry {\n  display: block;\n  padding: 2px 0;\n  color: inherit;\n  text-decoration: none;\n}\n.clepit-toc__entry:hover {\n  text-decoration: underline;\n}\n.clepit-toc__empty {\n  opacity: 0.55;\n}\n";
+export declare const inputStyle = "\n.clepit-toc {\n  display: block;\n}\n.clepit-toc__entry {\n  display: block;\n  padding: 2px 0;\n  color: inherit;\n  text-decoration: none;\n}\n.clepit-toc__entry:hover {\n  text-decoration: underline;\n}\n.clepit-toc__empty {\n  opacity: 0.55;\n}\n";
+export declare const outputStyle = "\n.clepit-toc {\n  display: block;\n}\n.clepit-toc__entry {\n  display: block;\n  padding: 2px 0;\n  color: inherit;\n  text-decoration: none;\n}\n.clepit-toc__entry:hover {\n  text-decoration: underline;\n}\n.clepit-toc__empty {\n  opacity: 0.55;\n}\n";
+//# sourceMappingURL=css.d.ts.map

package/dist/tools/block/toc/index.d.ts

@@ -0,0 +1,13 @@
+import { TocInput } from './input';
+import { TocOutput } from './output';
+import { ToolType } from '../../../types';
+export declare const TocTool: {
+    icon: string;
+    readonly input: typeof TocInput;
+    label: string;
+    readonly output: typeof TocOutput;
+    shortcut: string;
+    testId: string;
+    type: ToolType;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/tools/block/toc/input.d.ts

@@ -0,0 +1,11 @@
+import { InputConfig, TocData } from '../../../types';
+export declare class TocInput {
+    static placeholder: string;
+    private static eventListenersMap;
+    static save(_element: HTMLElement): TocData;
+    static render(containerId: string, _data?: TocData, config?: InputConfig<'toc'>): HTMLElement;
+    static isEmpty(_blockElement: HTMLElement): boolean;
+    static isEmptyData(_data: TocData): boolean;
+    static destroy(containerId: string): void;
+}
+//# sourceMappingURL=input.d.ts.map

package/dist/tools/block/toc/output.d.ts

@@ -0,0 +1,18 @@
+import { Backing, ClepitElement, DrawContext } from '../../../core/element';
+import { Block, BlockClassNames, BlockStyles, OutputConfig, TocData } from '../../../types';
+export declare class TocOutput {
+    /** The document's blocks, provided by the renderer before it renders a toc
+     * block — a toc derives from siblings, which no block-local data carries. */
+    static render(_data: TocData, config?: OutputConfig & {
+        documentBlocks?: Block[];
+    }, styles?: BlockStyles['toc'], classNames?: BlockClassNames['toc']): HTMLElement;
+    /**
+     * The same drawing, against the element layer, so it runs with no browser.
+     *
+     * Where `render` shows "headings appear here", this draws nothing. That
+     * placeholder tells an author the block is working; a published page has no
+     * author to reassure, and an empty frame there reads as a broken toc.
+     */
+    static draw(data: TocData, backing?: Backing, context?: DrawContext): ClepitElement | null;
+}
+//# sourceMappingURL=output.d.ts.map

package/dist/tools/block/typeset/css.d.ts

@@ -0,0 +1,6 @@
+export declare const inputStylesKey = "typeset-input";
+export declare const outputStylesKey = "typeset-output";
+export declare const sharedStyle = "\n.clepit-typeset {\n  border: 1px solid rgba(127, 127, 127, 0.35);\n  border-radius: 8px;\n  padding: 12px;\n}\n.clepit-typeset__kind {\n  display: block;\n  opacity: 0.7;\n  font-size: 0.85em;\n  margin-bottom: 6px;\n}\n.clepit-typeset__kind:has(+ .clepit-typeset__title) {\n  display: inline-block;\n  font-size: 11px;\n  font-weight: 700;\n  letter-spacing: 0.06em;\n  margin-bottom: 0;\n  text-transform: uppercase;\n}\n.clepit-typeset__title {\n  display: block;\n  font-size: 1em;\n  font-weight: 600;\n  margin: 2px 0 8px;\n  opacity: 1;\n}\n.clepit-typeset__title[data-placeholder]:empty::before {\n  color: inherit;\n  content: attr(data-placeholder);\n  font-style: italic;\n  font-weight: 400;\n  opacity: 0.5;\n  pointer-events: none;\n}\n.clepit-typeset__source {\n  display: block;\n  margin: 0;\n  white-space: pre-wrap;\n  word-break: break-word;\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n}\n.clepit-typeset--input .clepit-typeset__source {\n  outline: none;\n}\n.clepit-typeset__diagram {\n  display: block;\n  max-width: 100%;\n  height: auto;\n}\n.clepit-typeset__node {\n  fill: rgba(127, 127, 127, 0.08);\n  stroke: currentColor;\n  stroke-width: 1.5;\n}\n.clepit-typeset__label {\n  fill: currentColor;\n  font-size: 13px;\n  font-family: inherit;\n}\n.clepit-typeset__edge,\n.clepit-typeset__message,\n.clepit-typeset__lifeline {\n  stroke: currentColor;\n  fill: none;\n}\n.clepit-typeset__lifeline {\n  stroke-dasharray: 4 4;\n  opacity: 0.55;\n}\n.clepit-typeset__arrowhead {\n  fill: currentColor;\n}\n.clepit-typeset__edge-label {\n  fill: currentColor;\n  font-size: 12px;\n  font-family: inherit;\n}\n.clepit-typeset__activation {\n  fill: rgba(127, 127, 127, 0.3);\n  stroke: currentColor;\n  stroke-width: 1;\n}\n.clepit-typeset__note {\n  fill: rgba(240, 200, 100, 0.18);\n  stroke: currentColor;\n  stroke-width: 1;\n}\n.clepit-typeset__formula {\n  display: block;\n  max-width: 100%;\n  height: auto;\n}\n.clepit-typeset__glyph {\n  fill: currentColor;\n  font-family: ui-serif, Georgia, 'Times New Roman', serif;\n}\n.clepit-typeset__glyph--text {\n  font-family: inherit;\n}\n.clepit-typeset__rule,\n.clepit-typeset__radical {\n  fill: currentColor;\n}\n.clepit-typeset__radical {\n  stroke: currentColor;\n  stroke-width: 1.2;\n  fill: none;\n}\n.clepit-typeset__fallback-reason {\n  display: block;\n  opacity: 0.7;\n  font-size: 0.85em;\n  margin-bottom: 6px;\n}\n";
+export declare const inputStyle = "\n.clepit-typeset {\n  border: 1px solid rgba(127, 127, 127, 0.35);\n  border-radius: 8px;\n  padding: 12px;\n}\n.clepit-typeset__kind {\n  display: block;\n  opacity: 0.7;\n  font-size: 0.85em;\n  margin-bottom: 6px;\n}\n.clepit-typeset__kind:has(+ .clepit-typeset__title) {\n  display: inline-block;\n  font-size: 11px;\n  font-weight: 700;\n  letter-spacing: 0.06em;\n  margin-bottom: 0;\n  text-transform: uppercase;\n}\n.clepit-typeset__title {\n  display: block;\n  font-size: 1em;\n  font-weight: 600;\n  margin: 2px 0 8px;\n  opacity: 1;\n}\n.clepit-typeset__title[data-placeholder]:empty::before {\n  color: inherit;\n  content: attr(data-placeholder);\n  font-style: italic;\n  font-weight: 400;\n  opacity: 0.5;\n  pointer-events: none;\n}\n.clepit-typeset__source {\n  display: block;\n  margin: 0;\n  white-space: pre-wrap;\n  word-break: break-word;\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n}\n.clepit-typeset--input .clepit-typeset__source {\n  outline: none;\n}\n.clepit-typeset__diagram {\n  display: block;\n  max-width: 100%;\n  height: auto;\n}\n.clepit-typeset__node {\n  fill: rgba(127, 127, 127, 0.08);\n  stroke: currentColor;\n  stroke-width: 1.5;\n}\n.clepit-typeset__label {\n  fill: currentColor;\n  font-size: 13px;\n  font-family: inherit;\n}\n.clepit-typeset__edge,\n.clepit-typeset__message,\n.clepit-typeset__lifeline {\n  stroke: currentColor;\n  fill: none;\n}\n.clepit-typeset__lifeline {\n  stroke-dasharray: 4 4;\n  opacity: 0.55;\n}\n.clepit-typeset__arrowhead {\n  fill: currentColor;\n}\n.clepit-typeset__edge-label {\n  fill: currentColor;\n  font-size: 12px;\n  font-family: inherit;\n}\n.clepit-typeset__activation {\n  fill: rgba(127, 127, 127, 0.3);\n  stroke: currentColor;\n  stroke-width: 1;\n}\n.clepit-typeset__note {\n  fill: rgba(240, 200, 100, 0.18);\n  stroke: currentColor;\n  stroke-width: 1;\n}\n.clepit-typeset__formula {\n  display: block;\n  max-width: 100%;\n  height: auto;\n}\n.clepit-typeset__glyph {\n  fill: currentColor;\n  font-family: ui-serif, Georgia, 'Times New Roman', serif;\n}\n.clepit-typeset__glyph--text {\n  font-family: inherit;\n}\n.clepit-typeset__rule,\n.clepit-typeset__radical {\n  fill: currentColor;\n}\n.clepit-typeset__radical {\n  stroke: currentColor;\n  stroke-width: 1.2;\n  fill: none;\n}\n.clepit-typeset__fallback-reason {\n  display: block;\n  opacity: 0.7;\n  font-size: 0.85em;\n  margin-bottom: 6px;\n}\n";
+export declare const outputStyle = "\n.clepit-typeset {\n  border: 1px solid rgba(127, 127, 127, 0.35);\n  border-radius: 8px;\n  padding: 12px;\n}\n.clepit-typeset__kind {\n  display: block;\n  opacity: 0.7;\n  font-size: 0.85em;\n  margin-bottom: 6px;\n}\n.clepit-typeset__kind:has(+ .clepit-typeset__title) {\n  display: inline-block;\n  font-size: 11px;\n  font-weight: 700;\n  letter-spacing: 0.06em;\n  margin-bottom: 0;\n  text-transform: uppercase;\n}\n.clepit-typeset__title {\n  display: block;\n  font-size: 1em;\n  font-weight: 600;\n  margin: 2px 0 8px;\n  opacity: 1;\n}\n.clepit-typeset__title[data-placeholder]:empty::before {\n  color: inherit;\n  content: attr(data-placeholder);\n  font-style: italic;\n  font-weight: 400;\n  opacity: 0.5;\n  pointer-events: none;\n}\n.clepit-typeset__source {\n  display: block;\n  margin: 0;\n  white-space: pre-wrap;\n  word-break: break-word;\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n}\n.clepit-typeset--input .clepit-typeset__source {\n  outline: none;\n}\n.clepit-typeset__diagram {\n  display: block;\n  max-width: 100%;\n  height: auto;\n}\n.clepit-typeset__node {\n  fill: rgba(127, 127, 127, 0.08);\n  stroke: currentColor;\n  stroke-width: 1.5;\n}\n.clepit-typeset__label {\n  fill: currentColor;\n  font-size: 13px;\n  font-family: inherit;\n}\n.clepit-typeset__edge,\n.clepit-typeset__message,\n.clepit-typeset__lifeline {\n  stroke: currentColor;\n  fill: none;\n}\n.clepit-typeset__lifeline {\n  stroke-dasharray: 4 4;\n  opacity: 0.55;\n}\n.clepit-typeset__arrowhead {\n  fill: currentColor;\n}\n.clepit-typeset__edge-label {\n  fill: currentColor;\n  font-size: 12px;\n  font-family: inherit;\n}\n.clepit-typeset__activation {\n  fill: rgba(127, 127, 127, 0.3);\n  stroke: currentColor;\n  stroke-width: 1;\n}\n.clepit-typeset__note {\n  fill: rgba(240, 200, 100, 0.18);\n  stroke: currentColor;\n  stroke-width: 1;\n}\n.clepit-typeset__formula {\n  display: block;\n  max-width: 100%;\n  height: auto;\n}\n.clepit-typeset__glyph {\n  fill: currentColor;\n  font-family: ui-serif, Georgia, 'Times New Roman', serif;\n}\n.clepit-typeset__glyph--text {\n  font-family: inherit;\n}\n.clepit-typeset__rule,\n.clepit-typeset__radical {\n  fill: currentColor;\n}\n.clepit-typeset__radical {\n  stroke: currentColor;\n  stroke-width: 1.2;\n  fill: none;\n}\n.clepit-typeset__fallback-reason {\n  display: block;\n  opacity: 0.7;\n  font-size: 0.85em;\n  margin-bottom: 6px;\n}\n";
+//# sourceMappingURL=css.d.ts.map

package/dist/tools/block/typeset/index.d.ts

@@ -0,0 +1,22 @@
+import { LatexInput, MermaidInput } from './input';
+import { LatexOutput, MermaidOutput } from './output';
+import { ToolType } from '../../../types';
+export declare const LatexTool: {
+    icon: string;
+    readonly input: typeof LatexInput;
+    label: string;
+    readonly output: typeof LatexOutput;
+    shortcut: string;
+    testId: string;
+    type: ToolType;
+};
+export declare const MermaidTool: {
+    icon: string;
+    readonly input: typeof MermaidInput;
+    label: string;
+    readonly output: typeof MermaidOutput;
+    shortcut: string;
+    testId: string;
+    type: ToolType;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/tools/block/typeset/input.d.ts

@@ -0,0 +1,18 @@
+import { InputConfig, TypesetData } from '../../../types';
+export declare class LatexInput {
+    static placeholder: string;
+    static save(element: HTMLElement): TypesetData;
+    static render(_containerId: string, data?: TypesetData, config?: InputConfig<'latex'>): HTMLElement;
+    static isEmpty(blockElement: HTMLElement): boolean;
+    static isEmptyData(data: TypesetData): boolean;
+    static destroy(_containerId: string): void;
+}
+export declare class MermaidInput {
+    static placeholder: string;
+    static save(element: HTMLElement): TypesetData;
+    static render(_containerId: string, data?: TypesetData, config?: InputConfig<'mermaid'>): HTMLElement;
+    static isEmpty(blockElement: HTMLElement): boolean;
+    static isEmptyData(data: TypesetData): boolean;
+    static destroy(_containerId: string): void;
+}
+//# sourceMappingURL=input.d.ts.map

package/dist/tools/block/typeset/latex/layout.d.ts

@@ -0,0 +1,32 @@
+import { AtomStyle, LatexNode } from './model';
+export type LatexBox = {
+    /** Distance from the baseline to the box's bottom edge. */
+    depth: number;
+    draw: LatexDraw[];
+    /** Distance from the baseline to the box's top edge. */
+    height: number;
+    width: number;
+};
+export type LatexDraw = {
+    kind: 'glyph';
+    size: number;
+    style: AtomStyle;
+    text: string;
+    x: number;
+    y: number;
+} | {
+    kind: 'rule';
+    thickness: number;
+    width: number;
+    x: number;
+    y: number;
+} | {
+    kind: 'radical';
+    height: number;
+    size: number;
+    width: number;
+    x: number;
+    y: number;
+};
+export declare function layoutLatex(node: LatexNode, size?: number): LatexBox;
+//# sourceMappingURL=layout.d.ts.map

package/dist/tools/block/typeset/latex/model.d.ts

@@ -0,0 +1,64 @@
+/** The parsed shape of a LaTeX math expression, independent of how it is drawn.
+ *
+ * The same split as the mermaid engine: parsing yields a tree, layout turns it
+ * into boxes, and only the final renderer differs per twin.
+ *
+ * The supported grammar is the closed list in the P7 design doc. Anything
+ * outside it produces `{ ok: false, reason }` rather than a partial tree —
+ * dropping an unrecognised subscript would silently change what the formula
+ * says, which is the failure P7-b exists to prevent. */
+/** `upright` is the difference between the variable `sin` and the function
+ * \sin: TeX sets ordinary letters in italic and named operators upright, and
+ * getting that wrong makes a formula read as a product of three variables. */
+export type AtomStyle = 'bold' | 'italic' | 'text' | 'upright';
+export type LatexNode = {
+    kind: 'accent';
+    over: string;
+    base: LatexNode;
+} | {
+    kind: 'atom';
+    style: AtomStyle;
+    text: string;
+} | {
+    kind: 'bigop';
+    lower: LatexNode | null;
+    symbol: string;
+    upper: LatexNode | null;
+} | {
+    close: string;
+    kind: 'delimited';
+    open: string;
+    body: LatexNode;
+} | {
+    denominator: LatexNode;
+    kind: 'fraction';
+    numerator: LatexNode;
+} | {
+    index: LatexNode | null;
+    kind: 'radical';
+    radicand: LatexNode;
+} | {
+    kind: 'matrix';
+    rows: LatexNode[][];
+    style: MatrixStyle;
+} | {
+    kind: 'row';
+    items: LatexNode[];
+} | {
+    kind: 'space';
+    width: number;
+} | {
+    base: LatexNode;
+    kind: 'script';
+    sub: LatexNode | null;
+    sup: LatexNode | null;
+};
+export type MatrixStyle = 'bracket' | 'double-pipe' | 'paren' | 'pipe' | 'plain';
+export type LatexParseResult = {
+    ok: true;
+    root: LatexNode;
+} | {
+    ok: false;
+    reason: string;
+};
+//# sourceMappingURL=model.d.ts.map

package/dist/tools/block/typeset/latex/parse.d.ts

@@ -0,0 +1,3 @@
+import { LatexParseResult } from './model';
+export declare function parseLatex(source: string): LatexParseResult;
+//# sourceMappingURL=parse.d.ts.map

package/dist/tools/block/typeset/latex/render.d.ts

@@ -0,0 +1,7 @@
+import { Backing, ClepitElement } from '../../../../core/element';
+import { LatexBox } from './layout';
+/** One emission path, two destinations. The backing decides whether the formula
+ * lands in a live document or in a string, so a server-rendered page and the
+ * editor cannot drift into drawing different mathematics. */
+export declare function renderLatex(box: LatexBox, backing?: Backing): ClepitElement;
+//# sourceMappingURL=render.d.ts.map

package/dist/tools/block/typeset/latex/symbols.d.ts

@@ -0,0 +1,26 @@
+import { MatrixStyle } from './model';
+/** The closed symbol tables for the supported LaTeX subset.
+ *
+ * A command absent from every table here is unsupported, and unsupported means
+ * the whole block falls back to its source. That is why these are exhaustive
+ * lists rather than pattern matches: a regex that accepted `\anything` would
+ * render an unknown command as empty space, which changes the formula.
+ *
+ * Kept identical to `utils/latex/symbols.dart` in the Dart twin. */
+export declare const GREEK: Record<string, string>;
+export declare const OPERATORS: Record<string, string>;
+/** Big operators take limits above and below in display style, which is why
+ * they are a separate node kind rather than ordinary atoms. */
+export declare const BIG_OPERATORS: Record<string, string>;
+/** Set upright, because `\sin x` is a function applied to x, not s·i·n·x. */
+export declare const NAMED_FUNCTIONS: string[];
+export declare const ACCENTS: Record<string, string>;
+export declare const SPACING: Record<string, number>;
+export declare const DELIMITERS: Record<string, string>;
+/** Refused outright rather than merely unsupported. The first group is macro
+ * definition, which turns a formula into a program and hands an author a way to
+ * make the parser diverge; the second is a link surface, and P7-b already pins
+ * that a `javascript:` URL in typeset source must stay inert literal text. */
+export declare const REFUSED: string[];
+export declare const MATRIX_ENVIRONMENTS: Record<string, MatrixStyle>;
+//# sourceMappingURL=symbols.d.ts.map

package/dist/tools/block/typeset/mermaid/layout.d.ts

@@ -0,0 +1,71 @@
+import { FlowchartModel, MermaidModel, SequenceMessageEnd } from './model';
+export type LaidOutNode = {
+    height: number;
+    id: string;
+    label: string;
+    shape: FlowchartModel['nodes'][number]['shape'];
+    width: number;
+    x: number;
+    y: number;
+};
+export type LaidOutEdge = {
+    arrow: boolean;
+    label: string | null;
+    labelX: number;
+    labelY: number;
+    line: FlowchartModel['edges'][number]['line'];
+    points: {
+        x: number;
+        y: number;
+    }[];
+};
+export type FlowchartLayout = {
+    edges: LaidOutEdge[];
+    height: number;
+    kind: 'flowchart';
+    nodes: LaidOutNode[];
+    width: number;
+};
+export type LaidOutLifeline = {
+    actor: boolean;
+    centerX: number;
+    headHeight: number;
+    headWidth: number;
+    id: string;
+    label: string;
+};
+export type LaidOutActivation = {
+    height: number;
+    width: number;
+    x: number;
+    y: number;
+};
+export type LaidOutMessage = {
+    end: SequenceMessageEnd;
+    fromX: number;
+    line: 'dotted' | 'solid';
+    selfCall: boolean;
+    text: string;
+    toX: number;
+    y: number;
+};
+export type LaidOutNote = {
+    height: number;
+    text: string;
+    width: number;
+    x: number;
+    y: number;
+};
+export type SequenceLayout = {
+    activations: LaidOutActivation[];
+    height: number;
+    kind: 'sequence';
+    lifelineBottom: number;
+    lifelines: LaidOutLifeline[];
+    messages: LaidOutMessage[];
+    notes: LaidOutNote[];
+    width: number;
+};
+export type MermaidLayout = FlowchartLayout | SequenceLayout;
+export declare function layoutMermaid(model: MermaidModel): MermaidLayout;
+//# sourceMappingURL=layout.d.ts.map