svedit 0.2.0 → 0.4.0

package/dist/Svedit.svelte.d.ts

@@ -7,6 +7,6 @@ type Svedit = {
 };
 declare const Svedit: import("svelte").Component<SveditProps, {
     focus_canvas: () => void;
-}, "">;
+}, "editable">;
 import type { SveditProps } from './types.d.ts';
 //# sourceMappingURL=Svedit.svelte.d.ts.map

package/dist/Svedit.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Svedit.svelte.d.ts","sourceRoot":"","sources":["../src/lib/Svedit.svelte.js"],"names":[],"mappings":";;;;;;;AA66BA;;OAAqD;iCAj6BgE,cAAc"}
+{"version":3,"file":"Svedit.svelte.d.ts","sourceRoot":"","sources":["../src/lib/Svedit.svelte.js"],"names":[],"mappings":";;;;;;;AAo6CA;;eAAqD;iCAx5CgE,cAAc"}

package/dist/Transaction.svelte.d.ts

@@ -1,6 +1,3 @@
-/**
- * @import { NodeId, SerializedNode, Selection, DocumentPath } from './types.js'
- */
 /**
  * Transaction class for managing atomic document operations with undo/redo support.
  *
@@ -54,7 +51,7 @@ export default class Transaction {
      * @example
      * ```js
      * tr.set(["list_1", "list_items"], [1, 2, 3]);
-     * tr.set(["page_1", "body", "0", "description"], ["Hello world", []]);
+     * tr.set(["page_1", "body", "0", "description"], {text: "Hello world", annotations: []});
      * ```
      */
     set(path: DocumentPath, value: any): void;
@@ -97,7 +94,7 @@ export default class Transaction {
      *
      * @param {Selection} selection - The new selection object
      * @returns {Transaction} This transaction instance for method chaining
-     * @todo Check if selection is valid and throw error if not
+     * @throws {Error} Throws if the selection is invalid or out of bounds
      */
     set_selection(selection: Selection): Transaction;
     /**
@@ -108,7 +105,7 @@ export default class Transaction {
      * when conflicting types are applied.
      *
      * @param {any} annotation_type - The type of annotation (e.g., 'link', 'bold', 'italic')
-     * @param {any} annotation_data - Additional data for the annotation (e.g., href for links)
+     * @param {any} annotation_properties - Additional data for the annotation (e.g., href for links)
      * @returns {Transaction} This transaction instance for method chaining
      *
      * @example
@@ -120,7 +117,7 @@ export default class Transaction {
      * tr.annotate_text('emphasis', {});
      * ```
      */
-    annotate_text(annotation_type: any, annotation_data: any): Transaction;
+    annotate_text(annotation_type: any, annotation_properties: any): Transaction;
     /**
      * Deletes the currently selected text or nodes.
      *

package/dist/Transaction.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Transaction.svelte.d.ts","sourceRoot":"","sources":["../src/lib/Transaction.svelte.js"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;;;;;;;;;;;;;GAcG;AACH;IACE;;;;OAIG;IACH,iBAFW,GAAG,EAWb;IARC,SAAc;IAEd,oCAAoC;IACpC,KADW,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CACnB;IACb,oCAAoC;IACpC,aADW,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CACX;IAErB,sBAA0C;IAG5C;;;;;OAKG;IACH,UAHW,YAAY,GACV,GAAG,CAIf;IAED;;;;OAIG;IACH,iBAFa,SAAS,CAIrB;IAED;;;;;;;;;;;;;;OAcG;IACH,UATW,YAAY,SACZ,GAAG,QA2Bb;IAED;;;;;;;;;;;;;;;;;;OAkBG;IACH,aAbW,GAAG,GACD,WAAW,CAyBvB;IAED;;;;;;;;;;;;OAYG;IACH,WARW,GAAG,GACD,WAAW,CAcvB;IAED;;;;;;OAMG;IACH,yBAJW,SAAS,GACP,WAAW,CAOvB;IAED;;;;;;;;;;;;;;;;;;;OAmBG;IACH,+BAbW,GAAG,mBACH,GAAG,GACD,WAAW,CAqFvB;IAED;;;;;;;;;OASG;IACH,oBAFa,WAAW,CA8FvB;IAED;;;;;;;;;;;;;;;;;;OAkBG;IACH,oBAbW,cAAc,EAAE,GACd,WAAW,CAqDvB;IAED;;;;;;;;;;;;;;;OAeG;IACH,2BAVW,MAAM,GACJ,WAAW,CAsEvB;IAED;;;;;;;;OAQG;IACH,2CA+BC;IAED;;;;;;;;;;OAUG;IACH,4CAqBC;CACF;kCA/jBmE,YAAY;+BAAZ,YAAY;oCAAZ,YAAY"}
+{"version":3,"file":"Transaction.svelte.d.ts","sourceRoot":"","sources":["../src/lib/Transaction.svelte.js"],"names":[],"mappings":"AAMA;;;;;;;;;;;;;;GAcG;AACH;IACE;;;;OAIG;IACH,iBAFW,GAAG,EAWb;IARC,SAAc;IAEd,oCAAoC;IACpC,KADW,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CACnB;IACb,oCAAoC;IACpC,aADW,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CACX;IAErB,sBAA0C;IAG5C;;;;;OAKG;IACH,UAHW,YAAY,GACV,GAAG,CAIf;IAED;;;;OAIG;IACH,iBAFa,SAAS,CAIrB;IAED;;;;;;;;;;;;;;OAcG;IACH,UATW,YAAY,SACZ,GAAG,QA2Bb;IAED;;;;;;;;;;;;;;;;;;OAkBG;IACH,aAbW,GAAG,GACD,WAAW,CAyBvB;IAED;;;;;;;;;;;;OAYG;IACH,WARW,GAAG,GACD,WAAW,CAcvB;IAED;;;;;;OAMG;IACH,yBAJW,SAAS,GACP,WAAW,CAOvB;IAED;;;;;;;;;;;;;;;;;;;OAmBG;IACH,+BAbW,GAAG,yBACH,GAAG,GACD,WAAW,CAuDvB;IAED;;;;;;;;;OASG;IACH,oBAFa,WAAW,CAyGvB;IAED;;;;;;;;;;;;;;;;;;OAkBG;IACH,oBAbW,cAAc,EAAE,GACd,WAAW,CAqDvB;IAED;;;;;;;;;;;;;;;OAeG;IACH,2BAVW,MAAM,GACJ,WAAW,CA8EvB;IAED;;;;;;;;OAQG;IACH,2CA+BC;IAED;;;;;;;;;;OAUG;IACH,4CAuBC;CACF;kCAxjBmE,YAAY;+BAAZ,YAAY;oCAAZ,YAAY"}

package/dist/Transaction.svelte.js

@@ -2,6 +2,8 @@
  * @import { NodeId, SerializedNode, Selection, DocumentPath } from './types.js'
  */
 
+import { get_char_length, char_slice } from './util.js';
+
 /**
  * Transaction class for managing atomic document operations with undo/redo support.
  *
@@ -65,7 +67,7 @@ export default class Transaction {
    * @example
    * ```js
    * tr.set(["list_1", "list_items"], [1, 2, 3]);
-   * tr.set(["page_1", "body", "0", "description"], ["Hello world", []]);
+   * tr.set(["page_1", "body", "0", "description"], {text: "Hello world", annotations: []});
    * ```
    */
   set (path, value) {
@@ -150,10 +152,10 @@ export default class Transaction {
    *
    * @param {Selection} selection - The new selection object
    * @returns {Transaction} This transaction instance for method chaining
-   * @todo Check if selection is valid and throw error if not
+   * @throws {Error} Throws if the selection is invalid or out of bounds
    */
   set_selection(selection) {
-    // TODO: Check if selection is valid and throw error if not
+    this.doc._validate_selection(selection);
     this.doc.selection = selection;
     return this;
   }
@@ -166,7 +168,7 @@ export default class Transaction {
    * when conflicting types are applied.
    *
    * @param {any} annotation_type - The type of annotation (e.g., 'link', 'bold', 'italic')
-   * @param {any} annotation_data - Additional data for the annotation (e.g., href for links)
+   * @param {any} annotation_properties - Additional data for the annotation (e.g., href for links)
    * @returns {Transaction} This transaction instance for method chaining
    *
    * @example
@@ -178,64 +180,25 @@ export default class Transaction {
    * tr.annotate_text('emphasis', {});
    * ```
    */
-  annotate_text(annotation_type, annotation_data) {
+  annotate_text(annotation_type, annotation_properties) {
     if (this.doc.selection.type !== 'text') return this;
 
     const { start, end } = this.doc.get_selection_range();
-    const annotated_string = structuredClone($state.snapshot(this.doc.get(this.doc.selection.path)));
-    const annotations = annotated_string[1];
-    const existing_annotations = this.doc.active_annotation();
-
-    // Special annotation type handling should probably be done in a separate function.
-    // The goal is to keep the core logic simple and allow developer to extend and pick only what they need.
-    // It could also be abstracted to not check for type (e.g. "link") but for a special attribute
-    // e.g. "zero-range-updatable" for annotations that are updatable without a range selection change.
-
-    // Special handling for links when there's no selection range
-    // Links should be updatable by just clicking on them without a range selection
-    if (annotation_type === 'link' && start === end && existing_annotations) {
-
-      // Use findIndex for deep comparison of annotation properties (comparison of annotation properties rather than object reference via indexOf)
-      const index = annotations.findIndex(/** @param {any} anno */ (anno) =>
-        anno[0] === existing_annotations[0] &&
-        anno[1] === existing_annotations[1] &&
-        anno[2] === existing_annotations[2]
-      );
-      // const index = annotations.indexOf(existing_annotations);
-
-      if (index !== -1) {
-        if (annotation_data.href === '') {
-          // Remove the annotation if the href is empty
-          annotations.splice(index, 1);
-        } else {
-          annotations[index] = [
-            existing_annotations[0],
-            existing_annotations[1],
-            'link',
-            { ...existing_annotations[3], ...annotation_data }
-          ];
-        }
-
-        this.set(this.doc.selection.path, annotated_string);
-        return this;
-      }
-    }
-
-    // Regular annotation handling
-    if (start === end) {
-      // For non-link annotations: You can not annotate text if the selection is collapsed.
-      return this;
-    }
+    const annotated_text = structuredClone($state.snapshot(this.doc.get(this.doc.selection.path)));
+    const annotations = annotated_text.annotations;
+    const existing_annotation = this.doc.active_annotation();
+    const existing_annotation_same_type = this.doc.active_annotation(annotation_type);
 
-    if (existing_annotations) {
+    if (existing_annotation) {
       // If there's an existing annotation of the same type, remove it
-      if (existing_annotations[2] === annotation_type) {
+      if (existing_annotation_same_type) {
         const index = annotations.findIndex(/** @param {any} anno */ (anno) =>
-          anno[0] === existing_annotations[0] &&
-          anno[1] === existing_annotations[1] &&
-          anno[2] === existing_annotations[2]
+          anno.start_offset === existing_annotation.start_offset &&
+          anno.end_offset === existing_annotation.end_offset
         );
         if (index !== -1) {
+          // Remove the annotation node from the graph
+          this.delete(annotations[index].node_id);
           annotations.splice(index, 1);
         }
       } else {
@@ -243,14 +206,23 @@ export default class Transaction {
         return this;
       }
     } else {
+      if (!this.doc.available_annotation_types.includes(annotation_type)) {
+        console.log(`Annotation type ${annotation_type} is not allowed here.`);
+        return this;
+      }
+
+      const new_annotation_node = {
+        id: this.doc.generate_id(),
+        type: annotation_type,
+        ...annotation_properties,
+      }
+      this.create(new_annotation_node);
       // If there's no existing annotation, add the new one
-      annotations.push([start, end, annotation_type, annotation_data]);
+      annotations.push({start_offset: start, end_offset: end, node_id: new_annotation_node.id});
     }
 
-    // Update the annotated string
-    this.set(this.doc.selection.path, annotated_string);
-    // Not needed anymore as doc.apply makes sure selection is rerendered
-    // this.doc.selection = { ...this.doc.selection };
+    // Update the annotated text
+    this.set(this.doc.selection.path, annotated_text);
     return this;
   }
 
@@ -306,13 +278,16 @@ export default class Transaction {
       const path = this.doc.selection.path;
       let text = structuredClone($state.snapshot(this.doc.get(path)));
 
-      // Update the text content
-      text[0] = text[0].slice(0, start) + text[0].slice(end);
+      // Update the text content using character-based operations
+      const original_text = text.text;
+      text.text = char_slice(original_text, 0, start) + char_slice(original_text, end, get_char_length(original_text));
 
+      // To mark annotation nodes for deletion.
+      const _deleted_nodes = [];
       // Update annotation offsets for deletion
       const deletion_length = end - start;
-      const new_annotations = text[1].map(/** @param {any} annotation */ (annotation) => {
-        const [annotation_start, annotation_end, type, annotation_data] = annotation;
+      const new_annotations = text.annotations.map(/** @param {any} annotation */ (annotation) => {
+        const {start_offset: annotation_start, end_offset: annotation_end, node_id} = annotation;
 
         // Adjust start offset
         let new_start = annotation_start;
@@ -338,16 +313,24 @@ export default class Transaction {
 
         // Remove annotation if it becomes invalid (start >= end)
         if (new_start >= new_end) {
+          console.log('deleting annotation');
+          _deleted_nodes.push(node_id);
           return false;
         }
 
-        return [new_start, new_end, type, annotation_data];
+        return {start_offset: new_start, end_offset: new_end, node_id};
       }).filter(Boolean);
 
-      text[1] = new_annotations;
+      text.annotations = new_annotations;
 
       // Update the text in the entry (this implicitly records an op via this.set)
       this.set(path, text);
+
+      // Remove annotation nodes that were implicitly deleted.
+      for (const node_id of _deleted_nodes) {
+        this.delete(node_id);
+      }
+
       this.set_selection({
         type: 'text',
         path,
@@ -439,17 +422,18 @@ export default class Transaction {
   insert_text(replaced_text) {
     if (this.doc.selection.type !== 'text') return this;
 
-    const annotated_string = structuredClone($state.snapshot(this.doc.get(this.doc.selection.path)));
+    const annotated_text = structuredClone($state.snapshot(this.doc.get(this.doc.selection.path)));
     const { start, end } = this.doc.get_selection_range();
 
-    // Transform the plain text string.
-    annotated_string[0] = annotated_string[0].slice(0, start) + replaced_text + annotated_string[0].slice(end);
+    // Transform the plain text string using character-based operations
+    const text = annotated_text.text;
+    annotated_text.text = char_slice(text, 0, start) + replaced_text + char_slice(text, end, get_char_length(text));
 
-    // Transform the annotations (annotated_string[1])
-    // NOTE: Annotations are stored as [start_offset, end_offset, type]
-    const delta = replaced_text.length - (end - start);
-    const new_annotations = annotated_string[1].map(/** @param {any} annotation */ (annotation) => {
-      const [annotation_start, annotation_end, type, annotation_data] = annotation;
+    // Transform the annotations (annotated_text.annotations)
+    // NOTE: Annotations are stored as {start_offset, end_offset, node_id}
+    const delta = get_char_length(replaced_text) - (end - start);
+    const new_annotations = annotated_text.annotations.map(/** @param {any} annotation */ (annotation) => {
+      const {start_offset: annotation_start, end_offset: annotation_end, node_id} = annotation;
 
       // Case 1: annotation is wrapped in start and end (remove it)
       if (start <= annotation_start && end >= annotation_end) {
@@ -458,7 +442,7 @@ export default class Transaction {
 
       // Case 2: text inserted before the annotation
       if (end <= annotation_start) {
-        return [annotation_start + delta, annotation_end + delta, type, annotation_data];
+        return {start_offset: annotation_start + delta, end_offset: annotation_end + delta, node_id};
       }
 
       // Case 3: text inserted after the annotation
@@ -469,14 +453,20 @@ export default class Transaction {
       // Case 4: annotation is partly selected towards right
       // NOTE: replaced_text will not be part of the annotation, we treat it the same as
       // a cursor right after the annotation
-      if (start > annotation_start && start < annotation_end && end === annotation_end) {
-        return [annotation_start, start, type, annotation_data];
+      if (start > annotation_start && start < annotation_end && end >= annotation_end) {
+        return {start_offset: annotation_start, end_offset: start, node_id};
       }
 
       // Case 5: text inserted inside an annotation
-      // NOTE: This also covers the case when a annotation is partly selected towards left
       if (start >= annotation_start && start <= annotation_end && end < annotation_end && end >= annotation_start) {
-        return [annotation_start, annotation_end + delta, type, annotation_data];
+        return {start_offset: annotation_start, end_offset: annotation_end + delta, node_id};
+      }
+
+      // Case 6: annotation is partly selected towards left
+      // NOTE: replaced_text will not be part of the annotation, we treat it the same as
+      // a cursor right before the annotation
+      if (start < annotation_start && end > annotation_start && end < annotation_end) {
+        return {start_offset: start + get_char_length(replaced_text), end_offset: annotation_end + delta, node_id};
       }
 
       // Unhandled edge case:
@@ -486,14 +476,15 @@ export default class Transaction {
       // return annotation;
     }).filter(Boolean);
 
-    this.set(this.doc.selection.path, [annotated_string[0], new_annotations]); // this will update the current state and create a history entry
+    annotated_text.annotations = new_annotations;
+    this.set(this.doc.selection.path, annotated_text); // this will update the current state and create a history entry
 
     // Setting the selection automatically triggers a re-render of the corresponding DOMSelection.
     const new_selection = {
       type: 'text',
       path: this.doc.selection.path,
-      anchor_offset: start + replaced_text.length,
-      focus_offset: start + replaced_text.length,
+      anchor_offset: start + get_char_length(replaced_text),
+      focus_offset: start + get_char_length(replaced_text),
     };
     this.doc.selection = new_selection;
     return this;
@@ -568,6 +559,8 @@ export default class Transaction {
           count += value.filter(id => id === target_node_id).length;
         } else if (prop_type === 'node' && value === target_node_id) {
           count += 1;
+        } else if (prop_type === 'annotated_text' && value && value.annotations) {
+          count += value.annotations.filter(annotation => annotation.node_id === target_node_id).length;
         }
       }
     }

package/dist/commands.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"commands.svelte.d.ts","sourceRoot":"","sources":["../src/lib/commands.svelte.js"],"names":[],"mappings":"AAGA,kDAoDC;AAED,iDA6DC;AAED,sDA6BC;AAED,6CA6GC"}
+{"version":3,"file":"commands.svelte.d.ts","sourceRoot":"","sources":["../src/lib/commands.svelte.js"],"names":[],"mappings":"AAGA,kDAqDC;AAED,iDAsEC;AAED,sDA6BC;AAED,6CA6GC"}

package/dist/commands.svelte.js

@@ -1,4 +1,4 @@
-import { split_annotated_string, join_annotated_string } from './util.js';
+import { split_annotated_text, join_annotated_text, get_char_length } from './util.js';
 import { get_default_node_type } from './Document.svelte.js';
 
 export function break_text_node(tr) {
@@ -30,7 +30,7 @@ export function break_text_node(tr) {
 
   const split_at_position = tr.doc.selection.anchor_offset;
   const content = tr.doc.get(selection.path);
-  const [left_text, right_text] = split_annotated_string(content, split_at_position);
+  const [left_text, right_text] = split_annotated_text(content, split_at_position);
 
   tr.set([node.id, 'content'], left_text);
 
@@ -42,7 +42,7 @@ export function break_text_node(tr) {
   };
 
   // TODO: Only use default_node_type when cursor is at the end of
-  const node_array_property_definition = doc.schema[node_array_node.type][node_array_prop];
+  const node_array_property_definition = doc.schema[node_array_node.type].properties[node_array_prop];
   const target_node_type = get_default_node_type(node_array_property_definition);
 
   if (!target_node_type) {
@@ -53,6 +53,7 @@ export function break_text_node(tr) {
   tr.set_selection(node_insert_position);
 
   doc.config.inserters[target_node_type](tr, right_text);
+  return true;
 }
 
 export function join_text_node(tr) {
@@ -81,7 +82,7 @@ export function join_text_node(tr) {
   }
 
   // Special behavior: if we can't join and current node is empty, delete it
-  if (!can_join && node.content[0] === '') {
+  if (!can_join && node.content.text === '') {
     tr.set_selection({
       type: 'node',
       path: doc.selection.path.slice(0, -2),
@@ -99,8 +100,15 @@ export function join_text_node(tr) {
 
   // Normal joining logic - both nodes are text nodes
   const previous_text_path = [...doc.selection.path.slice(0, -2), node_index - 1];
-  const joined_text = join_annotated_string(predecessor_node.content, node.content);
+  const joined_text = join_annotated_text(predecessor_node.content, node.content);
 
+  // Calculate cursor position based on original predecessor content length
+  const cursor_position = get_char_length(predecessor_node.content.text);
+
+  // First set the joined content on the predecessor node (preserves annotations)
+  tr.set([predecessor_node.id, 'content'], joined_text);
+
+  // Then delete the current node
   tr.set_selection({
     type: 'node',
     path: doc.selection.path.slice(0, -2),
@@ -109,13 +117,15 @@ export function join_text_node(tr) {
   });
 
   tr.delete_selection();
+  
+  // Finally set the cursor position at the join point using the pre-calculated position
   tr.set_selection({
     type: 'text',
     path: [...previous_text_path, 'content'],
-    anchor_offset: predecessor_node.content[0].length,
-    focus_offset: predecessor_node.content[0].length,
+    anchor_offset: cursor_position,
+    focus_offset: cursor_position,
   });
-  tr.set([predecessor_node.id, 'content'], joined_text);
+  return true;
 }
 
 export function insert_default_node(tr) {
@@ -132,7 +142,7 @@ export function insert_default_node(tr) {
   const property_name = path.at(-1);
 
   // Get the definition for this property
-  const property_definition = doc.schema[node_array_node.type][property_name];
+  const property_definition = doc.schema[node_array_node.type].properties[property_name];
   const default_type = get_default_node_type(property_definition);
 
   // Only proceed if there's exactly one allowed node_type
@@ -159,7 +169,7 @@ export function select_all(tr) {
 
   if (selection.type === 'text') {
     const text_content = doc.get(selection.path);
-    const text_length = text_content[0].length;
+    const text_length = get_char_length(text_content.text);
 
     // Check if all text is already selected
     const is_all_text_selected =

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 export { default as Svedit } from "./Svedit.svelte";
-export { default as AnnotatedStringProperty } from "./AnnotatedStringProperty.svelte";
+export { default as AnnotatedTextProperty } from "./AnnotatedTextProperty.svelte";
 export { default as CustomProperty } from "./CustomProperty.svelte";
 export { default as Node } from "./Node.svelte";
 export { default as NodeArrayProperty } from "./NodeArrayProperty.svelte";

package/dist/index.js

@@ -1,6 +1,6 @@
 // Main exports for the svedit library
 export { default as Svedit } from './Svedit.svelte';
-export { default as AnnotatedStringProperty } from './AnnotatedStringProperty.svelte';
+export { default as AnnotatedTextProperty } from './AnnotatedTextProperty.svelte';
 export { default as CustomProperty } from './CustomProperty.svelte';
 export { default as Node } from './Node.svelte';
 export { default as NodeArrayProperty } from './NodeArrayProperty.svelte';

package/dist/types.d.ts

@@ -68,7 +68,7 @@ export type ArrayType = "string_array" | "number_array" | "boolean_array" | "int
 /**
  * Special types for rich content.
  */
-export type RichType = "annotated_string";
+export type RichType = "annotated_text";
 
 /**
  * Node reference types for linking to other nodes.
@@ -88,7 +88,7 @@ export type PropertyType = PrimitiveType | ReferenceType;
 /**
  * Document schema primitive types - all possible property types in document schemas.
  */
-export type DocumentSchemaPrimitive = "string" | "number" | "boolean" | "integer" | "datetime" | "string_array" | "number_array" | "boolean_array" | "integer_array" | "annotated_string" | "node" | "node_array";
+export type DocumentSchemaPrimitive = "string" | "number" | "boolean" | "integer" | "datetime" | "string_array" | "number_array" | "boolean_array" | "integer_array" | "annotated_text" | "node" | "node_array";
 
 /**
  * Maps document schema types to their JavaScript runtime types.
@@ -103,7 +103,7 @@ export type DocumentSchemaValueToJs<T> =
   T extends "number_array" ? Array<number> :
   T extends "boolean_array" ? Array<boolean> :
   T extends "integer_array" ? Array<number> :
-  T extends "annotated_string" ? [string, Array<any>] :
+  T extends "annotated_text" ? AnnotatedText :
   T extends "node" ? string :
   T extends "node_array" ? Array<string> :
   never;
@@ -112,15 +112,24 @@ export type DocumentSchemaValueToJs<T> =
  * Converts a document node schema definition to its inferred JS type.
  * Handles the {type: "..."} wrapper structure used in document schemas.
  */
-export type DocumentNodeToJs<S extends Record<string, {type: DocumentSchemaPrimitive}>> =
-  { id: string, type: string } & { [K in keyof S]: DocumentSchemaValueToJs<S[K]["type"]> };
+export type DocumentNodeToJs<S extends NodeSchema> =
+  { id: string, type: string } & { [K in keyof S["properties"]]: DocumentSchemaValueToJs<S["properties"][K]["type"]> };
 
 /**
- * A property that stores a primitive value.
+ * A property that stores an annotated text with required allow_newlines setting.
+ */
+export type AnnotatedTextProperty = {
+  type: 'annotated_text';
+  node_types?: string[];
+  allow_newlines: boolean;
+};
+
+/**
+ * A property that stores a primitive value (excluding annotated_text).
  */
 export type PrimitiveProperty = {
-  [K in PrimitiveType]: { type: K }
-}[PrimitiveType];
+  [K in Exclude<PrimitiveType, 'annotated_text'>]: { type: K }
+}[Exclude<PrimitiveType, 'annotated_text'>];
 
 /**
  * A property that stores a reference to a single node.
@@ -143,13 +152,36 @@ export type NodeArrayProperty = {
 /**
  * Union type for all possible property definitions.
  */
-export type PropertyDefinition = PrimitiveProperty | NodeProperty | NodeArrayProperty;
+export type PropertyDefinition = PrimitiveProperty | AnnotatedTextProperty | NodeProperty | NodeArrayProperty;
+
+/**
+ * Node kind values for different types of content nodes
+ */
+export type NodeKind = 'document' | 'block' | 'text' | 'annotation';
+
+/**
+ * Schema for text nodes - must have a content property of type annotated_text
+ */
+export type TextNodeSchema = {
+  kind: 'text';
+  properties: {
+    content: AnnotatedTextProperty;
+  } & Record<string, PropertyDefinition>;
+};
+
+/**
+ * Schema for non-text nodes
+ */
+export type NonTextNodeSchema = {
+  kind: 'document' | 'block' | 'annotation';
+  properties: Record<string, PropertyDefinition>;
+};
 
 /**
  * A node schema defines the structure of a specific node type.
- * Maps property names to their definitions.
+ * Contains a kind and properties object that maps property names to their definitions.
  */
-export type NodeSchema = Record<string, PropertyDefinition>;
+export type NodeSchema = TextNodeSchema | NonTextNodeSchema;
 
 /**
  * A document schema defines all node types available in a document.
@@ -174,9 +206,9 @@ export type SerializedNode = {
 export type SerializedDocument = SerializedNode[];
 
 /**
- * Props for the AnnotatedStringProperty component
+ * Props for the AnnotatedTextProperty component
  */
-export type AnnotatedStringPropertyProps = {
+export type AnnotatedTextPropertyProps = {
   /** The full path to the property */
   path: DocumentPath;
   /** The `class` attribute on the content element */
@@ -239,26 +271,39 @@ export type SveditProps = {
   editable?: boolean,
   /** The path to the root element (e.g. ['page_1']) */
   path: DocumentPath,
-  /** The `class` attribute on the content element */
+  /** The `class` attribute on the canvas element */
   class?: string;
+  /** The `autocapitalize` attribute on the canvas element */
+  autocapitalize?: 'on' | 'off';
+  /** The `spellcheck` attribute on the canvas element */
+  spellcheck?: 'true' | 'false';
 };
 
 /**
  * Represents an annotation in an annotated string
- * Format: [start_offset, end_offset, type, options?]
  */
-export type Annotation = [number, number, string, Record<string, any>?];
+export type Annotation = {
+  start_offset: number;
+  end_offset: number;
+  node_id: NodeId;
+};
+
+/**
+ * Represents an annotated text with text and annotations
+ */
+export type AnnotatedText = {
+  text: string;
+  annotations: Array<Annotation>;
+};
 
 /**
  * Represents a fragment of annotated text content
  */
-export type AnnotationFragment = {
-  /** The annotation type (e.g., 'link', 'emphasis', 'strong') */
-  type: string;
+export type AnnotationFragment = string | {
+  /** NodeId that has annotation type and details */
+  node: any;
   /** The text content of the annotation */
   content: string;
   /** Index of the annotation in the original array */
   annotation_index: number;
-  /** Optional properties from the annotation's options object */
-  data?: any;
 };