Add Schema

Schema is a class that defines the structure of the model. It is used
to validate the model and to build the model from JSON.

Author: hackerwins

src/commands.ts

@@ -1,4 +1,4 @@
-import { Model } from './model';
+import { Model } from './model/model';
 
 export type Command = SetValue | Edit;
 

src/editor.ts

@@ -3,7 +3,7 @@ import { Module } from './utils/module';
 import { Observable, Unsubscribe } from './utils/observable';
 
 import { View as View } from './view/view';
-import { Model } from './model';
+import { Model } from './model/model';
 import { Command, execute } from './commands';
 
 /**
@@ -38,7 +38,7 @@ export class Editor extends Observable<Array<Command>> implements Module {
     super();
 
     this.view = View.create(container);
-    this.model = new Model(opts.initialValue || '');
+    this.model = Model.create(opts.initialValue || '');
     this.history = new History<Command>((command) =>
       execute(this.model, command),
     );

src/model.ts src/model/model.tssrc/model.ts renamed to src/model/model.ts

@@ -1,8 +1,13 @@
-import { Observable } from './utils/observable';
+import { Observable } from '../utils/observable';
 
+// TODO(hackerwins): Build a tree-based model with schema validation.
 export class Model extends Observable<string> {
   private value: string;
 
+  static create(initialValue: string): Model {
+    return new Model(initialValue);
+  }
+
   constructor(value: string) {
     super();
     this.value = value;

src/model/node.ts

@@ -0,0 +1,12 @@
+export type Node = Element | Text;
+
+export type Element = {
+  type: string;
+  attrs: Record<string, string>;
+  children: Array<Node>;
+};
+
+export type Text = {
+  type: 'text';
+  text: string;
+};

src/model/schema.ts

@@ -0,0 +1,62 @@
+import { Node } from './node';
+
+type SchemaSpec = Record<string, NodeSpec>;
+type NodeSpec = ElementSpec | TextNodeSpec;
+type ElementSpec = { children: string };
+type TextNodeSpec = {};
+
+/**
+ * `Schema` is a class that defines the structure of the model. It is used to
+ * validate the model and to build the model from JSON.
+ */
+export class Schema {
+  private spec: SchemaSpec;
+
+  constructor(spec: SchemaSpec) {
+    this.validate(spec);
+    this.spec = spec;
+  }
+
+  validate(schemaSpec: SchemaSpec): void {
+    if (!schemaSpec.root) {
+      throw new Error('root node not defined');
+    }
+
+    for (const [t, spec] of Object.entries(schemaSpec)) {
+      if (t === 'text') {
+        continue;
+      }
+      const elemSpec = spec as ElementSpec;
+      const types = this.parseChildren(elemSpec.children);
+      for (const t of types) {
+        if (!schemaSpec[t]) {
+          throw new Error(`invalid node type: ${t}`);
+        }
+      }
+    }
+  }
+
+  parseChildren(children: string): Array<string> {
+    // TODO(hackerwins): We need to support more complex children definition.
+    children = children.replace(/\*|\+/g, '');
+    return [children];
+  }
+
+  fromJSON(json: any): Node {
+    if (json.type === 'text') {
+      return {
+        type: 'text',
+        text: json.text,
+      };
+    }
+
+    if (!this.spec[json.type]) {
+      throw new Error(`invalid node type: ${json.type}`);
+    }
+    return {
+      type: json.type,
+      attrs: json.attributes,
+      children: json.children.map((child: any) => this.fromJSON(child)),
+    };
+  }
+}

src/view/view.ts

@@ -9,6 +9,7 @@ import { toRange } from './selection';
  */
 const CommonInputEventTypes = [
   'insertText',
+  'insertReplacementText',
   'insertCompositionText',
   'deleteContentBackward',
   'deleteContentForward',

test/model/schema.test.ts

@@ -0,0 +1,50 @@
+import { describe, it, expect } from 'vitest';
+import { Schema } from '../../src/model/schema';
+
+describe('Schema', () => {
+  it('should be created with a valid spec', () => {
+    expect(
+      new Schema({
+        root: { children: 'para*' },
+        para: { children: 'text*' },
+        text: {},
+      }),
+    ).toBeDefined();
+
+    expect(() => {
+      new Schema({ para: { children: 'text*' } });
+    }).toThrowError('root node not defined');
+
+    expect(() => {
+      new Schema({
+        root: { children: 'paragraph*' },
+        para: { children: 'text*' },
+      });
+    }).toThrowError('invalid node type: paragraph');
+  });
+
+  it('should build a node from JSON', () => {
+    const schema = new Schema({
+      root: { children: 'para*' },
+      para: { children: 'text*' },
+      text: {},
+    });
+
+    expect(
+      schema.fromJSON({
+        type: 'para',
+        children: [{ type: 'text', text: 'Hello, world!' }],
+      }),
+    ).toEqual({
+      type: 'para',
+      children: [{ type: 'text', text: 'Hello, world!' }],
+    });
+
+    expect(() => {
+      schema.fromJSON({
+        type: 'paragraph',
+        children: [{ type: 'invalid', text: 'Hello, world!' }],
+      });
+    }).toThrowError('invalid node type: paragraph');
+  });
+});