svedit 0.12.0 → 0.13.0

package/src/lib/TextProperty.svelte

@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
 	import { getContext } from 'svelte';
 	import {
 		char_slice,
@@ -9,12 +9,24 @@
 		calculate_fragment_ranges
 	} from './utils.js';
 
-	/** @import { TextPropertyProps, Mark, Fragment, SelectionRange } from './types.d.ts'; */
-
-	const svedit = getContext('svedit');
-
-	/** @type {TextPropertyProps} */
-	let { path, class: css_class, placeholder = '', tag = 'div', style = '', ...rest } = $props();
+	import type {
+		TextPropertyProps,
+		Mark,
+		Fragment,
+		SelectionRange,
+		SveditContext
+	} from './types.js';
+
+	const svedit = getContext<SveditContext>('svedit');
+
+	let {
+		path,
+		class: css_class,
+		placeholder = '',
+		tag = 'div',
+		style = '',
+		...rest
+	}: TextPropertyProps = $props();
 
 	let path_str = $derived(serialize_path(path));
 
@@ -30,9 +42,12 @@
 	// re-runs for every text property on every document change).
 	let is_empty = $derived(plain_text.length === 0 && !(svedit.is_composing && is_focused));
 
-	let is_collapsed = $derived(
-		is_focused && svedit.session.selection?.anchor_offset == svedit.session.selection?.focus_offset
-	);
+	let is_collapsed = $derived.by(() => {
+		const selection = svedit.session.selection;
+		return (
+			is_focused && selection?.type === 'text' && selection.anchor_offset === selection.focus_offset
+		);
+	});
 
 	// Get selection highlight range if it does not touch marks.
 	// Only render selection highlight when canvas is NOT focused.
@@ -60,12 +75,12 @@
 	/**
 	 * Converts text with marks into renderable fragments for display.
 	 * Annotations never fragment the text; they are data-only.
-	 * @param {string} text - The plain text content
-	 * @param {Array<Mark>} marks - Marks to render in-place
-	 * @param {SelectionRange} [selection_highlight_range] - Optional selection highlight range
-	 * @returns {Array<Fragment>} Array of fragments
 	 */
-	function get_fragments(text, marks, selection_highlight_range) {
+	function get_fragments(
+		text: string,
+		marks: Array<Mark>,
+		selection_highlight_range?: SelectionRange | null
+	): Array<Fragment> {
 		// Fast path: no marks and no selection highlight means the whole text
 		// is a single content fragment. This runs for EVERY text property on
 		// EVERY document change, so skipping the two full Intl.Segmenter passes
@@ -79,8 +94,7 @@
 			marks,
 			selection_highlight_range
 		);
-		/** @type {Array<Fragment>} */
-		let fragments = [];
+		const fragments: Array<Fragment> = [];
 
 		for (const range of ranges) {
 			const content = char_slice(text, range.start_offset, range.end_offset);
@@ -93,7 +107,7 @@
 					type: 'mark',
 					node,
 					content,
-					mark_index: range.mark_index
+					mark_index: range.mark_index!
 				});
 			} else if (range.type === 'selection_highlight') {
 				fragments.push({