edytor 1.0.0-rc.2 → 1.0.0

package/dist/components/Block.svelte

@@ -3,9 +3,9 @@
 	import type { Edytor } from '../edytor.svelte.js';
 	import { UNKNOWN_KIND } from '../kinds.js';
 	import { voidChrome, type Block as BlockHandle } from '../block/block.svelte.js';
-	import type { BlockDefinition, BlockView } from '../plugins.js';
+	import type { BlockDefinition, BlockSnippetPayload, BlockView } from '../plugins.js';
 	import type { PreviewCell } from '../surface/cells.js';
-	import { replacedMark } from '../session/suggestions.svelte.js';
+	import { replacedMark, Suggestion } from '../session/suggestions.svelte.js';
 
 	const reported = new WeakMap<Edytor, Set<string>>();
 
@@ -42,6 +42,15 @@
 		void: voidChrome
 	});
 
+	/**
+	 * A child in the flow: a block's id, a block suggestion's preview in the
+	 * flow among its siblings (in place of a block), or a suggestion's own
+	 * block, rendered from its preview cell, never registered (`Suggestion`).
+	 */
+	export type Kid = string | Suggestion | PreviewCell;
+	const kidKey = (kid: Kid) =>
+		typeof kid === 'string' || kid instanceof Suggestion ? kid : kid.id;
+
 	/** Tags that take no content: the kind renders the element only. */
 	const VOID_TAGS = new Set(['area', 'br', 'col', 'embed', 'hr', 'img', 'input', 'wbr']);
 
@@ -82,158 +91,190 @@
 	import { getContext } from 'svelte';
 	import Child from './Block.svelte';
 	import Content from './Content.svelte';
-	import Suggestion from './Suggestion.svelte';
-	import { blockDir, ownText } from '../surface/attributes.js';
+	import SuggestionPreview from './Suggestion.svelte';
+	import { blockDir, ownText, type Owned } from '../surface/attributes.js';
 	import { colorAttributes } from '../block/colors.js';
 
-	let {
-		id,
-		preview
-	}: {
-		id: string;
-		/** A suggestion's block: rendered from its preview cell, never registered (`Suggestion`). */
-		preview?: PreviewCell;
-	} = $props();
+	let { kid }: { kid: Kid } = $props();
+	const suggestion = $derived(kid instanceof Suggestion ? kid : undefined);
+	const preview = $derived(
+		typeof kid === 'string' || suggestion ? undefined : (kid as PreviewCell)
+	);
+	const id = $derived(typeof kid === 'string' ? kid : preview?.id);
 
 	const edytor = getContext<Edytor>('edytor');
 	// The structure renders from the cell; the snippet receives a view object.
-	const cell = $derived(preview ?? edytor.cells?.get(id));
-	const block = $derived(preview ? previewViewOf(preview) : blockViewOf(edytor, id));
-	/** The suggestions shown before, after and inside this block (none in a preview). */
-	const shown = $derived(preview ? null : edytor.suggestions.at(id));
-	/** The children: a preview's own, else the cell's ids. */
+	const cell = $derived(preview ?? (id === undefined ? undefined : edytor.cells?.get(id)));
+	const block = $derived(
+		preview ? previewViewOf(preview) : id === undefined ? undefined : blockViewOf(edytor, id)
+	);
+	/** The suggestions shown at this block (none in a preview). */
+	const shown = $derived(preview || id === undefined ? null : edytor.suggestions.at(id));
+	/**
+	 * The children: a preview's own, else the cell's ids with the suggestions
+	 * shown around them and inside this block (`suggestions.around`).
+	 */
 	const kids = $derived(
 		preview
 			? preview.children
-			: (edytor.cells?.get(id)?.childIds ?? []).map((child) => ({ id: child }))
+			: id === undefined
+				? []
+				: edytor.suggestions.around(edytor.cells?.get(id)?.childIds ?? [], id)
 	);
 	const definition = $derived(cell && edytor.definitionOf(cell.type));
 	// The core renders the block element from the definition; the snippet renders inside it.
-	const element = $derived(definition && elementOf(definition.element ?? 'div', cell?.data, id));
+	const element = $derived(
+		definition && id !== undefined
+			? elementOf(definition.element ?? 'div', cell?.data, id)
+			: undefined
+	);
+	/** The element's tag: none until the block has a cell and a definition. */
+	const tag = $derived((cell && element && element.tag) || undefined);
 	// The element around the block's own text (a heading's `h2`): the core's, so an override keeps it.
 	const contentElement = $derived(
-		definition && elementOf(definition.contentElement, cell?.data, id)
+		definition && id !== undefined
+			? elementOf(definition.contentElement, cell?.data, id)
+			: undefined
 	);
-	/** Its direction from its own text (`blockDir`, bidi): none in a preview. */
-	const dir = $derived(preview ? null : blockDir(ownText(cell?.runs ?? [])));
 	/**
-	 * `dir` as an attribute, absent when `null`: Svelte writes `dir` as a
-	 * property, which would leave `dir=""` where the table wants none.
+	 * Registers the block element (one element per block, re-registered when
+	 * the tag changes) with what it owns: the core's attributes below, not
+	 * the kind's (`surface/attributes.ts` heals them).
 	 */
-	const direction = (node: HTMLElement, value: 'rtl' | 'ltr' | null) => {
-		const write = (next: 'rtl' | 'ltr' | null) =>
-			next ? node.setAttribute('dir', next) : node.removeAttribute('dir');
-		write(value);
-		return { update: write };
-	};
-	/** Registers the block element: one element per block, re-registered when the tag changes. */
-	const register = (node: HTMLElement) => block.handle?.attach(node);
+	const register = (node: HTMLElement) =>
+		block?.handle?.attach(node, (): Owned => {
+			const owned: Record<string, string | null> = {};
+			for (const [name, value] of Object.entries(attributes ?? {}))
+				if (!(name in (element?.attributes ?? {}))) owned[name] = (value as string) ?? null;
+			return { strict: false, owned, style: userSelect ? { 'user-select': userSelect } : {} };
+		});
+	/**
+	 * Whether the selection holds this block, and whether it touches it: one
+	 * boolean each, read from the block's own membership (`isSelected`,
+	 * `isFocused`), so a selection change re-runs only the blocks it enters and
+	 * leaves (a set's `has` re-runs the reader of every block outside it when
+	 * its members change: a caret moving to another block re-ran every block's).
+	 */
+	const selected = $derived(!!block?.handle && edytor.selection.isSelected(block.handle));
+	const focused = $derived(!!block?.handle && edytor.selection.isFocused(block.handle));
+	/**
+	 * Its colour and background by palette name (`block/colors.ts`), from its
+	 * data; written below as two properties (a second spread in the object
+	 * literal takes the engine's slow copy, three times the attributes' cost).
+	 */
+	const colors = $derived(colorAttributes(cell?.data));
 	/** The block element's attributes: the kind's, then the core's. */
 	const attributes = $derived(
 		element && {
 			...element.attributes,
-			// Its colour and background by palette name (`block/colors.ts`).
-			...colorAttributes(cell?.data),
+			'data-edytor-color': colors['data-edytor-color'],
+			'data-edytor-background': colors['data-edytor-background'],
 			'data-edytor-block': 'true',
 			'data-edytor-id': preview ? undefined : id,
 			'data-edytor-type': cell?.type,
 			'data-edytor-void': definition?.void ? 'true' : undefined,
-			'data-edytor-selected':
-				block.handle && edytor.selection.selectedBlocks.has(block.handle) ? 'true' : undefined,
-			'data-edytor-focused':
-				block.handle && edytor.selection.focusedBlocks.has(block.handle) ? 'true' : undefined,
+			'data-edytor-selected': selected ? 'true' : undefined,
+			'data-edytor-focused': focused ? 'true' : undefined,
 			'data-edytor-suggestion-replaced': shown ? (replacedMark(shown) ?? undefined) : undefined,
-			contenteditable: definition?.void ? ('false' as const) : undefined
+			contenteditable: definition?.void ? ('false' as const) : undefined,
+			// Its direction from its own text (`blockDir`, bidi), absent without one: none in a preview.
+			dir: (!preview && blockDir(ownText(cell?.runs ?? []))) || undefined
 		}
 	);
+	const userSelect = $derived(definition?.void ? 'none' : undefined);
+	/** What renders inside the element: the kind's snippet, or a kind this view does not register. */
+	const body = $derived(definition?.snippet ?? (definition === UNKNOWN_KIND ? unknown : undefined));
+	/** The kind snippet's payload: its view object, its text, its children (none: `null`). */
+	const payload = $derived({
+		block: block!,
+		content: contentElement ? wrappedContent : content,
+		children: kids.length ? children : null
+	});
 
 	// The kind `content()` last rendered under — read after each render.
 	let contentRenderedFor: string | undefined;
-	$effect(() => {
-		if (DEV && block.handle) checkRendersContent(block.handle, contentRenderedFor === cell?.type);
-	});
+	// Development only: production keeps no effect per block for it.
+	if (DEV)
+		$effect(() => {
+			if (block?.handle) checkRendersContent(block.handle, contentRenderedFor === cell?.type);
+		});
 </script>
 
 <!--
--->{#snippet text()}<!--
---><Content
-		{id}
+	The render places as few anchors as it can (`render.markers`, counted by
+	`render-markers.test.tsx`): Svelte leaves an empty comment or text node for
+	each block, dynamic element, component or snippet it places, except a
+	static component or snippet that is the only thing its fragment renders,
+	and the browser walks them all after each keystroke. So the bundled kinds'
+	block tags are static elements (a dynamic element leaves two markers
+	more), the text is a static component of the `content` snippet, and the
+	children are one `each` of static components (a suggestion in the flow is
+	one of them). The comments between the top-level nodes keep whitespace out
+	of the markup.
+-->
+{#snippet content()}
+	<Content
+		id={id ?? ''}
 		preview={preview?.runs}
 		onrender={DEV ? () => (contentRenderedFor = cell?.type) : undefined}
-	/><!--
--->{/snippet}<!--
--->{#snippet content()}<!--
--->{#if contentElement}<!--
---><svelte:element
-			this={contentElement.tag}
-			{...contentElement.attributes}>{@render text()}</svelte:element
-		><!--
--->{:else}<!--
--->{@render text()}<!--
--->{/if}<!--
--->{/snippet}<!--
--->{#snippet children()}<!--
---->{#each kids as child (child.id)}<!--
---><Child
-			id={child.id}
-			preview={preview && (child as PreviewCell)}
-		/><!--
--->{/each}<!--
--->{#each shown?.inside ?? [] as suggestion (suggestion.id)}<!--
---><Suggestion
-			{suggestion}
-		/><!--
--->{/each}<!--
--->{/snippet}<!--
--->{#each shown?.before ?? [] as suggestion (suggestion.id)}<!--
---><Suggestion
-		{suggestion}
-	/><!--
--->{/each}<!--
--->{#if cell && definition && element}<!--
-	A void tag (a divider's `hr`) takes no body: the element alone.
--->{#if VOID_TAGS.has(element.tag)}<!--
---><svelte:element
-			this={element.tag}
-			{...attributes}
-			style:user-select={definition.void ? 'none' : undefined}
-			use:register
-			use:direction={dir}
-		/><!--
--->{:else}<!--
---><svelte:element
-			this={element.tag}
-			{...attributes}
-			style:user-select={definition.void ? 'none' : undefined}
-			use:register
-			use:direction={dir}
-			><!--
-		-->{#if definition.snippet}<!--
-		-->{@render definition.snippet({
-					block,
-					content,
-					children: kids.length || shown?.inside.length ? children : null
-				})}<!--
-		-->{:else if definition === UNKNOWN_KIND}<!--
-			A kind this view does not register: a plain block, its text and children.
-		-->{@render content()}{#if kids.length || shown?.inside.length}<div
-						data-edytor-children
-					>
-						{@render children()}
-					</div>{/if}<!--
-		-->{/if}<!--
-	--></svelte:element
-		><!--
--->{/if}<!--
--->{/if}<!--
--->{#each shown?.after ?? [] as suggestion (suggestion.id)}<!--
---><Suggestion
-		{suggestion}
-	/><!--
--->{/each}
-
-<!--
--->
+	/>
+{/snippet}<!--
+	The kind's `contentElement` (a heading's `h2`) around the text.
+-->{#snippet wrappedContent()}
+	<svelte:element this={contentElement?.tag} {...contentElement?.attributes}>
+		<Content
+			id={id ?? ''}
+			preview={preview?.runs}
+			onrender={DEV ? () => (contentRenderedFor = cell?.type) : undefined}
+		/>
+	</svelte:element>
+{/snippet}<!--
+-->{#snippet children()}
+	{#each kids as kid (kidKey(kid))}
+		<Child {kid} />
+	{/each}
+{/snippet}<!--
+	A kind this view does not register: a plain block, its text and children.
+-->{#snippet unknown({
+	content,
+	children
+}: BlockSnippetPayload)}
+	{@render content()}<!--
+	-->{#if children}
+		<div data-edytor-children>
+			{@render children()}
+		</div>
+	{/if}
+{/snippet}<!--
+	The block element: the bundled kinds' tags as static elements, any other
+	through `svelte:element` (a void tag, a divider's `hr`, takes no body).
+-->{#if suggestion}
+	<SuggestionPreview {suggestion} />
+{:else if tag === 'div'}
+	<div {...attributes} style:user-select={userSelect} use:register>
+		{@render body?.(payload)}
+	</div>
+{:else if tag === 'li'}
+	<li {...attributes} style:user-select={userSelect} use:register>
+		{@render body?.(payload)}
+	</li>
+{:else if tag === 'details'}
+	<details {...attributes} style:user-select={userSelect} use:register>
+		{@render body?.(payload)}
+	</details>
+{:else if tag === 'figure'}
+	<figure {...attributes} style:user-select={userSelect} use:register>
+		{@render body?.(payload)}
+	</figure>
+{:else if tag === 'hr'}
+	<hr {...attributes} style:user-select={userSelect} use:register />
+{:else if tag && VOID_TAGS.has(tag)}
+	<svelte:element this={tag} {...attributes} style:user-select={userSelect} use:register />
+{:else if tag}
+	<svelte:element this={tag} {...attributes} style:user-select={userSelect} use:register>
+		{@render body?.(payload)}
+	</svelte:element>
+{/if}
 
 <style>
 	/*

package/dist/components/Block.svelte.d.ts

@@ -1,8 +1,13 @@
 import type { PreviewCell } from '../surface/cells.js';
+import { Suggestion } from '../session/suggestions.svelte.js';
+/**
+ * A child in the flow: a block's id, a block suggestion's preview in the
+ * flow among its siblings (in place of a block), or a suggestion's own
+ * block, rendered from its preview cell, never registered (`Suggestion`).
+ */
+export type Kid = string | Suggestion | PreviewCell;
 type $$ComponentProps = {
-    id: string;
-    /** A suggestion's block: rendered from its preview cell, never registered (`Suggestion`). */
-    preview?: PreviewCell;
+    kid: Kid;
 };
 declare const Block: import("svelte").Component<$$ComponentProps, {}, "">;
 type Block = ReturnType<typeof Block>;

package/dist/components/Content.svelte

@@ -2,10 +2,13 @@
 	import { getContext } from 'svelte';
 	import type { Edytor } from '../edytor.svelte.js';
 	import {
+		START,
 		partsOf,
 		segmentDeltas,
+		type AtomPart,
 		type Cell,
 		type Part,
+		type RenderDelta,
 		type Segment
 	} from '../surface/cells.js';
 	import type { ContentRun } from '../crdt/index.js';
@@ -32,11 +35,6 @@
 	const cell = $derived(preview ? undefined : edytor.cells?.get(id));
 	/** The cell's segments and atoms — the frozen list while the IME pin holds this cell. */
 	const parts = $derived(cell ? edytor.pin.parts(cell) : []);
-	/** Each part with its text ordinal (its text handle's position). */
-	const items = $derived.by(() => {
-		let ordinal = 0;
-		return parts.map((part) => ({ part, ordinal: part.kind === 'text' ? ordinal++ : -1 }));
-	});
 	/** Bumped only by the observer's repair of foreign damage: re-creates the text elements. */
 	const epoch = $derived(edytor.cells?.epoch(id) ?? 0);
 	const type = $derived(cell?.type ?? edytor.cells?.get(id)?.type);
@@ -44,15 +42,16 @@
 	// The placeholder attribute: withheld in the block a composition is in.
 	const placeholder = $derived(edytor.placeholderAt(id));
 
+	/** An empty content's one text (`partsOf`: a content starts with a text). */
+	const EMPTY: Segment = { kind: 'text', key: START, text: '', runs: [] };
+
+	/** Whether this view renders an atom of `part`'s kind (its record has a snippet). */
+	const rendersAtom = (part: AtomPart) => Boolean(edytor.inlineBlocks.get(part.type)?.snippet);
+
 	/** Segments are keyed causally (the preceding atom's id, or `start`), never by ordinal. */
-	const keyOf = ({ part }: { part: Part }) =>
-		part.kind === 'text' ? `s:${part.key}:${epoch}` : `a:${part.id}`;
+	const keyOf = (part: Part) => (part.kind === 'text' ? `s:${part.key}:${epoch}` : `a:${part.id}`);
 
-	const view = (segment: Segment) =>
-		edytor.pin.render(id, segment.key) ?? {
-			deltas: segmentDeltas(cell!, segment, transform),
-			empty: segment.text === ''
-		};
+	const view = (segment: Segment) => edytor.pin.shown(cell!, segment, transform);
 
 	/** A suggestion's text after this block's (`end`): its first block's content. */
 	const ghosts = $derived(
@@ -73,6 +72,55 @@
 		),
 		empty: !segment.text
 	});
+
+	/** The parts this content renders: a preview's (session parts, no handle), else the cell's. */
+	const own = $derived(preview ? partsOf(preview) : parts);
+	/**
+	 * The first text, before any atom (its key is always `start`): a static
+	 * element of the content, re-created only by an epoch bump. The rest is
+	 * one keyed list after it: two anchors for the whole content
+	 * (`render.markers`).
+	 */
+	const first = $derived((own[0]?.kind === 'text' ? own[0] : undefined) ?? EMPTY);
+	const firstShown = $derived(preview ? ghost(first) : view(first));
+	/**
+	 * Its handle, looked up again with each segment list the cell renders (a
+	 * keyed entry's is, with its entry): the handle can change while the
+	 * element stays (the virtual paragraph becoming a real block).
+	 */
+	const firstText = $derived.by(() => {
+		void parts;
+		return preview ? undefined : edytor.textAt(id, 0);
+	});
+
+	type Entry =
+		| { key: string; kind: 'text'; part: Segment; ordinal: number }
+		| { key: string; kind: 'rest'; deltas: readonly RenderDelta[] }
+		| { key: string; kind: 'atom'; part: AtomPart }
+		| { key: string; kind: 'ghost'; parts: readonly Part[] };
+	/**
+	 * What follows the first text, in order: the atoms and texts (with their
+	 * text ordinal, their handle's position), each text followed by the rest
+	 * a live composition merged into it (`pin.rest`), then the suggestions'
+	 * text after the block's.
+	 */
+	const entries = $derived.by(() => {
+		const list: Entry[] = [];
+		let ordinal = 0;
+		for (const part of own) {
+			if (part.kind !== 'text') {
+				// An atom whose kind renders nothing (no snippet in this view) takes no place.
+				if (rendersAtom(part)) list.push({ key: keyOf(part), kind: 'atom', part });
+				continue;
+			}
+			if (ordinal) list.push({ key: keyOf(part), kind: 'text', part, ordinal });
+			ordinal++;
+			const rest = preview ? [] : edytor.pin.rest(id, part.key);
+			if (rest.length) list.push({ key: `r:${part.key}`, kind: 'rest', deltas: rest });
+		}
+		ghosts.forEach((parts, index) => list.push({ key: `g:${index}`, kind: 'ghost', parts }));
+		return list;
+	});
 </script>
 
 <!--
@@ -89,7 +137,7 @@
 				empty={shown.empty}
 				newline={part.text.endsWith('\n')}
 			/><!--
-		-->{:else}<!--
+		-->{:else if rendersAtom(part)}<!--
 --><RenderInlineBlock
 				block={undefined}
 				{part}
@@ -97,44 +145,43 @@
 		-->{/if}<!--
 	-->{/each}<!--
 -->{/snippet}<!--
--->{#if preview}<!--
-	-->{@render session(
-		partsOf(preview)
-	)}<!--
--->{/if}<!--
--->{#each items as item (keyOf(item))}<!--
-	-->{#if item.part.kind === 'text'}<!--
+-->{#key epoch}<RenderText
+		text={firstText}
+		deltas={firstShown.deltas}
+		empty={firstShown.empty}
+		newline={first.text.endsWith('\n')}
+		placeholder={preview ? null : placeholder}
+	/>{/key}<!--
+-->{#each entries as entry (entry.key)}<!--
+	-->{#if entry.kind === 'text'}<!--
 		-->{@const shown =
-			view(item.part)}<!--
-		-->{@const rest = edytor.pin.rest(id, item.part.key)}<!--
+			preview ? ghost(entry.part) : view(entry.part)}<!--
 --><RenderText
-			text={edytor.textAt(id, item.ordinal)}
+			text={preview ? undefined : edytor.textAt(id, entry.ordinal)}
 			deltas={shown.deltas}
 			empty={shown.empty}
-			newline={item.part.text.endsWith('\n')}
-			{placeholder}
+			newline={entry.part.text.endsWith('\n')}
+			placeholder={preview ? null : placeholder}
 		/><!--
-		-->{#if rest.length}<!--
-			--><RenderText
-				text={undefined}
-				deltas={rest}
-				empty={false}
-				newline={false}
-				rest
-			/><!--
-		-->{/if}<!--
-	-->{:else}<!--
+	-->{:else if entry.kind === 'atom'}<!--
 --><RenderInlineBlock
-			block={edytor.atomAt(id, item.part.id)}
-			part={item.part}
+			block={preview ? undefined : edytor.atomAt(id, entry.part.id)}
+			part={entry.part}
 		/><!--
-	-->{/if}<!--
--->{/each}<!--
--->{#each ghosts as parts, index (index)}<!--
+	-->{:else if entry.kind === 'rest'}<!--
+--><RenderText
+			text={undefined}
+			deltas={entry.deltas}
+			empty={false}
+			newline={false}
+			rest
+		/><!--
+	-->{:else}<!--
 	--><span
-		data-edytor-text-suggestion
-		contentEditable="false"
-		style="user-select: none; pointer-events: none">{@render session(parts)}</span
-	><!--
+			data-edytor-text-suggestion
+			contentEditable="false"
+			style="user-select: none; pointer-events: none">{@render session(entry.parts)}</span
+		><!--
+	-->{/if}<!--
 -->{/each}<!--
 -->

package/dist/components/CustomMark.svelte

@@ -0,0 +1,46 @@
+<script lang="ts">
+	import { getContext } from 'svelte';
+	import type { Edytor } from '../edytor.svelte.js';
+	import type { Text } from '../text/text.svelte.js';
+	import type { RenderDelta } from '../surface/cells.js';
+	import Mark, { customAt, registerMark } from './Mark.svelte';
+	import CustomMark from './CustomMark.svelte';
+
+	/**
+	 * Mark `index` of `delta` drawn by its record's snippet, inside the core's
+	 * `<span data-edytor-mark>`: the snippet's `content()` is the marks after
+	 * it, then the text.
+	 */
+	let {
+		delta,
+		text,
+		index
+	}: {
+		text: Text | undefined;
+		delta: RenderDelta;
+		index: number;
+	} = $props();
+
+	const edytor = getContext<Edytor>('edytor');
+	const mark = $derived(delta.marks[index]);
+	const definition = $derived(edytor.marks.get(mark?.[0] ?? ''));
+	/** Another mark inside this one. */
+	const inner = $derived(index + 1 < delta.marks.length);
+	/** The text, as `content()`'s own text node when no mark is inside. */
+	const own = $derived(inner ? '' : delta.text);
+	const register = (node: HTMLElement) => registerMark(edytor, text, node, mark?.[0]);
+</script>
+
+{#snippet content()}{own}{#if !inner}{:else if customAt(edytor, delta, index + 1)}<CustomMark
+			index={index + 1}
+			{delta}
+			{text}
+		/>{:else}<Mark index={index + 1} {delta} {text} />{/if}{/snippet}
+
+<!-- The core's element around a custom snippet: a static `span` (no anchor of its own). -->
+<span
+	data-edytor-mark={mark?.[0]}
+	data-edytor-mark-void={definition?.void ? '' : undefined}
+	contenteditable={definition?.void ? 'false' : undefined}
+	use:register>{@render definition?.snippet?.({ content, mark: mark?.[1], text: text! })}</span
+>

package/dist/components/CustomMark.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Text } from '../text/text.svelte.js';
+import type { RenderDelta } from '../surface/cells.js';
+import CustomMark from './CustomMark.svelte';
+type $$ComponentProps = {
+    text: Text | undefined;
+    delta: RenderDelta;
+    index: number;
+};
+declare const CustomMark: import("svelte").Component<$$ComponentProps, {}, "">;
+type CustomMark = ReturnType<typeof CustomMark>;
+export default CustomMark;