@stesura/react-wordgard 0.0.0-stage → 0.2.0

package/dist/viewRoots.d.ts

@@ -0,0 +1,2 @@
+export declare const viewRoots: WeakSet<Element>;
+export declare const viewRoot: (dom: Element | null) => void;

package/dist/viewRoots.js

@@ -0,0 +1,7 @@
+// The elements React drew for node views and mark wrappers, to tell a React shape's chrome from its
+// content.
+export const viewRoots = new WeakSet();
+export const viewRoot = (dom) => {
+    if (dom)
+        viewRoots.add(dom);
+};

package/dist/wordgardInternals.d.ts

@@ -0,0 +1,211 @@
+import { type Attributes, type Node as DocNode, Elt, type Mark } from "wordgard/doc";
+import { Decoration, Widget, Wordgard } from "wordgard/editor";
+import { GardState } from "wordgard/state";
+export type Tile = NonNullable<Node["wgTile"]>;
+export type CompositeTile = NonNullable<Tile["parent"]>;
+export type DecoSet = {
+    readonly points: Map<(state: GardState) => Decoration.Point.Set, Decoration.Point.Set>;
+    readonly ranges: Map<(state: GardState) => Decoration.Range.Set, Decoration.Range.Set>;
+};
+export interface DocTile extends CompositeTile {
+    readonly state: GardState;
+    readonly cursorWrapper: Mark.Set | null;
+    readonly decoSet: DecoSet;
+    update(state: GardState, changes: readonly number[], wg: Wordgard, composition?: CompositionInfo | null): DocTile;
+    updateRanges(state: GardState, decoSet: DecoSet, changes: readonly number[], wg: Wordgard, composition?: CompositionInfo | null): DocTile;
+    resolve(pos: number, side?: -1 | 1): {
+        tile: Tile;
+        offset: number;
+        pos: number;
+    };
+    nodeTile(pos: number): Tile | null;
+    nearest(dom: Node): Tile | null;
+    posFromDOM(dom: Node, offset: number, bias?: -1 | 1): number;
+}
+export interface CompositionInfo {
+    readonly fromB: number;
+    readonly toB: number;
+    readonly text: string;
+    readonly target: Text | null;
+    readonly wrapCursor?: Mark.Set | null;
+}
+export interface DOMObserver {
+    ignore<T>(f: () => T): T;
+    observer: MutationObserver;
+    queue: MutationRecord[];
+}
+interface DocTileClass {
+    new (state: GardState, dom: Element, cursorWrapper: Mark.Set | null, decoSet: DecoSet): DocTile;
+    create(state: GardState, dom: Element, wg: Wordgard): DocTile;
+}
+export interface EltTile extends CompositeTile {
+    readonly elt: DecoElt;
+}
+export interface EltTileClass {
+    new (elt: DecoElt, tag: DocNode.Tag | null, flags: number, length: number, dom: Element): EltTile;
+    of(elt: DecoElt, tag: DocNode.Tag | null, flags: number, length: number, dom?: Element | null): EltTile;
+}
+export interface TextTile extends Tile {
+    text: string;
+    dom: Text;
+}
+interface TextTileClass {
+    new (text: string, dom: Text, flags?: number): TextTile;
+}
+export interface WidgetTile extends Tile {
+    readonly widget: Widget;
+}
+interface WidgetTileClass {
+    new (widget: Widget, tag: DocNode.Tag | null, flags: number, dom: Element | Text, length?: number): WidgetTile;
+}
+export declare const TileFlag: {
+    readonly NodeInner: 1;
+    readonly PlotContent: 2;
+    readonly Spanning: 4;
+    readonly Wrapper: 8;
+    readonly Point: 16;
+    readonly PointBefore: 32;
+    readonly PointAfter: 64;
+    readonly Composition: 128;
+    readonly Synced: 256;
+    readonly Atom: 512;
+    readonly HasContent: 1024;
+    readonly AfterContent: 2048;
+    readonly ContentNotLast: 4096;
+    readonly Dirty: 8192;
+};
+export declare const Reused: {
+    readonly Full: 1;
+    readonly DOM: 2;
+};
+interface NodeShape<Param> {
+    readonly atom: boolean;
+    create(param: Param): Elt;
+}
+export interface EltSelector {
+    match(elt: Elt): boolean;
+}
+declare module "wordgard/doc" {
+    namespace Plot {
+        interface Type<Param = unknown> {
+            readonly shape: NodeShape<Param>;
+        }
+    }
+    namespace Leaf {
+        interface Type<Param = unknown> {
+            readonly shape: NodeShape<Param>;
+        }
+    }
+    namespace Mark {
+        interface Type<Param = unknown> {
+            readonly rank: number;
+            readonly element: {
+                readonly name: string;
+                attrs(value: Param): Attributes;
+            } | null;
+            readonly attribute: {
+                get(value: Param): Attributes;
+                readonly target: EltSelector | null;
+            } | null;
+        }
+    }
+    interface Elt<T = string> {
+        addAttrs(attrs: Attributes, target?: EltSelector): Elt<T>;
+        wrap(wrapper: Elt<T>, target?: EltSelector): Elt<T>;
+        fill(content: readonly (0 | T | Elt<T>)[]): Elt<T>;
+    }
+    namespace Attributes {
+        function push(attrs: string[], name: string, value: string): void;
+    }
+}
+declare module "wordgard/editor" {
+    interface Widget<Param = unknown> {
+        readonly hasContent: boolean;
+        render(wg: Wordgard): Element | Text;
+    }
+    namespace Wordgard {
+        const DocTile: DocTileClass;
+    }
+    namespace Widget {
+        interface Type<Param> {
+            readonly inFlow: boolean;
+            readonly editable: boolean;
+        }
+        const br: Widget<null>;
+        const img: Widget<null>;
+        const text: Widget.Type<string>;
+        const editableText: Widget.Type<string>;
+    }
+    namespace Decoration {
+        interface Range {
+            readonly query: DocNode.Query | null;
+            readonly scope: number;
+            readonly inc: number;
+        }
+    }
+}
+export declare const DocTile: DocTileClass;
+export declare const getTileClasses: () => {
+    EltTile: EltTileClass;
+    TextTile: TextTileClass;
+    WidgetTile: WidgetTileClass;
+};
+export type DecoElt = Elt<Widget | string>;
+export interface WidgetDecoration extends Decoration.Point {
+    readonly widget: Widget;
+}
+export interface ShapeDecoration extends Decoration.Point {
+    readonly shape: Decoration.Shape;
+}
+export interface AttributeDecoration extends Decoration.Point {
+    readonly attrs: Attributes;
+    readonly selector: EltSelector | null;
+}
+export interface WrapperDecoration extends Decoration.Point {
+    readonly elt: DecoElt;
+    readonly selector: EltSelector | null;
+}
+export interface WrapperRangeDecoration extends Decoration.Range {
+    readonly elt: DecoElt;
+    readonly rank: number;
+    readonly spanning: boolean;
+}
+export interface AttributeRangeDecoration extends Decoration.Range {
+    readonly attribute: string;
+    readonly value: string;
+}
+export type TagShape = {
+    readonly type: DocNode.Type;
+    readonly shape: (tag: DocNode.Tag) => Decoration.Shape;
+};
+export type TagWidget = {
+    readonly type: DocNode.Type;
+    readonly place: number;
+    readonly widget: Widget | ((tag: DocNode.Tag) => Widget | null);
+};
+export type TagWrapper = {
+    readonly type: DocNode.Type;
+    readonly elt: DecoElt;
+    readonly target: EltSelector | null;
+};
+export type TagAttribute = {
+    readonly type: DocNode.Type;
+    readonly attr: string;
+    readonly value: (tag: DocNode.Tag) => string;
+    readonly target: EltSelector | null;
+};
+type Class<T> = new (...args: never[]) => T;
+export declare const getDecorationInternals: () => {
+    WidgetDecoration: Class<WidgetDecoration>;
+    ShapeDecoration: Class<ShapeDecoration>;
+    AttributeDecoration: Class<AttributeDecoration>;
+    WrapperDecoration: Class<WrapperDecoration>;
+    WrapperRangeDecoration: Class<WrapperRangeDecoration>;
+    AttributeRangeDecoration: Class<AttributeRangeDecoration>;
+    tagShape: GardState.Facet<TagShape, Map<DocNode.Type, (tag: DocNode.Tag) => Decoration.Shape>>;
+    tagWidget: GardState.Facet<TagWidget, readonly TagWidget[]>;
+    tagWrapper: GardState.Facet<TagWrapper, readonly TagWrapper[]>;
+    tagAttribute: GardState.Facet<TagAttribute, readonly TagAttribute[]>;
+    markShape: GardState.Facet<unknown, Map<Mark.Type, Mark.Type>>;
+};
+export {};

package/dist/wordgardInternals.js

@@ -0,0 +1,82 @@
+// The one place depending on Wordgard internals missing from its typings. The declarations are
+// trusted, not checked: re-read them against Wordgard's source after `npm run update-wordgard`.
+import { Elt } from "wordgard/doc";
+import { Decoration, Widget, Wordgard } from "wordgard/editor";
+import { basicSchema } from "wordgard/schema";
+import { GardState } from "wordgard/state";
+import { Emphasis, Image, Paragraph } from "wordgard/types";
+// Wordgard's `TileFlag`, a const enum its typings declare without exporting.
+export const TileFlag = {
+    NodeInner: 0x1,
+    PlotContent: 0x2,
+    Spanning: 0x4,
+    Wrapper: 0x8,
+    Point: 0x10,
+    PointBefore: 0x20,
+    PointAfter: 0x40,
+    Composition: 0x80,
+    Synced: 0x100,
+    Atom: 0x200,
+    HasContent: 0x400,
+    AfterContent: 0x800,
+    ContentNotLast: 0x1000,
+    Dirty: 0x2000,
+};
+// Wordgard's `Reused`, how a tile of the previous tree was used in the new one:
+// whole (`Full`, not disconnected), or for its DOM only.
+export const Reused = { Full: 1, DOM: 2 };
+export const DocTile = Wordgard.DocTile;
+let tileClasses;
+// Wordgard doesn't expose its other tile classes, and its code checks
+// `instanceof TextTile`, so we take them from a tree it builds, once. Their
+// types come from `Object.getPrototypeOf`'s `any`: unchecked, like the
+// declarations above.
+export const getTileClasses = () => {
+    if (tileClasses)
+        return tileClasses;
+    const wg = Wordgard.create({ doc: "<p>x</p><p></p>", config: [basicSchema()] });
+    const [text, empty] = wg.contentDOM.children;
+    const classOf = (dom) => {
+        if (!dom?.wgTile)
+            throw new Error("Wordgard's tile tree has an unexpected shape");
+        return Object.getPrototypeOf(dom.wgTile).constructor;
+    };
+    tileClasses = {
+        EltTile: classOf(text),
+        TextTile: classOf(text?.firstChild),
+        WidgetTile: classOf(empty?.firstChild),
+    };
+    return tileClasses;
+};
+let decorationInternals;
+// The facet a provider (what `Facet.of` returns) is for.
+const facetOf = (extension) => {
+    if (typeof extension == "object" &&
+        extension &&
+        "facet" in extension &&
+        extension.facet instanceof GardState.Facet)
+        return extension.facet;
+    throw new Error("Wordgard's decoration facets have an unexpected shape");
+};
+// Wordgard's decoration classes and facets, taken from what its public
+// factories return, once. Typed through `any` (`getPrototypeOf`, `instanceof`
+// on a generic class): unchecked, like the declarations above.
+export const getDecorationInternals = () => {
+    if (decorationInternals)
+        return decorationInternals;
+    const classOf = (value) => Object.getPrototypeOf(value).constructor;
+    decorationInternals = {
+        WidgetDecoration: classOf(Decoration.Point.widget(Widget.br)),
+        ShapeDecoration: classOf(Decoration.Point.shape(Elt.mk("span"))),
+        AttributeDecoration: classOf(Decoration.Point.attributes({})),
+        WrapperDecoration: classOf(Decoration.Point.wrapper(Elt.mk("span", [0]))),
+        WrapperRangeDecoration: classOf(Decoration.Range.wrapper("span", {})),
+        AttributeRangeDecoration: classOf(Decoration.Range.attribute("data-x", "")),
+        tagShape: facetOf(Decoration.Tag.shape(Image, Elt.mk("img"))),
+        tagWidget: facetOf(Decoration.Tag.widget(Paragraph, "before", Widget.br)),
+        tagWrapper: facetOf(Decoration.Tag.wrapper(Paragraph, Elt.mk("div", [0]))),
+        tagAttribute: facetOf(Decoration.Tag.attribute(Paragraph, "data-x", "")),
+        markShape: facetOf(Decoration.Mark.shape(Emphasis, { element: "i" })),
+    };
+    return decorationInternals;
+};

package/package.json

@@ -1,6 +1,121 @@
 {
   "name": "@stesura/react-wordgard",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.2.0",
+  "description": "A React view for the Wordgard rich text editor",
+  "keywords": [
+    "react",
+    "wordgard",
+    "rich-text",
+    "editor",
+    "contenteditable"
+  ],
+  "homepage": "https://github.com/stesura/react-wordgard#readme",
+  "bugs": {
+    "url": "https://github.com/stesura/react-wordgard/issues"
+  },
+  "author": "Edoardo Caratti",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/stesura/react-wordgard.git"
+  },
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    }
+  },
+  "files": [
+    "README.md",
+    "CHANGELOG.md",
+    "LICENSE.txt",
+    "THIRD_PARTY_LICENSES.txt",
+    "dist",
+    "skills"
+  ],
+  "scripts": {
+    "prebuild": "node -e \"require('node:fs').rmSync('dist', { recursive: true, force: true })\"",
+    "build": "tsc -p tsconfig.build.json",
+    "dev": "tsc -p tsconfig.build.json --watch",
+    "check": "npm run check:types && npm run check:lint && npm run check:format",
+    "check:types": "tsc",
+    "check:lint": "eslint .",
+    "check:format": "prettier --check .",
+    "check:bench": "tsc -p bench",
+    "fix": "eslint --fix . && prettier --write .",
+    "demo": "vite",
+    "demo:preview": "vite build --outDir demo-dist && vite preview --outDir demo-dist",
+    "test": "vitest run",
+    "test:unit": "vitest run --project unit",
+    "test:browser": "vitest run --project browser",
+    "bench": "vitest run --config bench/vitest.config.ts",
+    "bench:dev": "vitest run --config bench/vitest.config.ts --mode development",
+    "bench:smoke": "vitest run --config bench/vitest.config.ts --mode smoke",
+    "bench:heap": "vitest run --config bench/vitest.config.ts --mode heap",
+    "bench:heap-dev": "vitest run --config bench/vitest.config.ts --mode heap-development",
+    "bench:profile": "vitest run --config bench/vitest.config.ts --mode profile",
+    "bench:profile-dev": "vitest run --config bench/vitest.config.ts --mode profile-development",
+    "sync-wordgard-tests": "node scripts/sync-wordgard-tests.js",
+    "update-wordgard": "node scripts/update-wordgard.js",
+    "release:prepare": "node scripts/release.js prepare",
+    "release:publish": "node scripts/release.js publish",
+    "prepack": "npm run build"
+  },
+  "devDependencies": {
+    "@eslint/js": "^10.0.1",
+    "@handlewithcare/react-prosemirror": "^3.2.11",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/react": "^16.3.0",
+    "@types/node": "^22.0.0",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "@types/use-sync-external-store": "^1.7.0",
+    "@vitejs/plugin-react": "^6.1.2",
+    "@vitest/browser-playwright": "^5.0.5",
+    "axe-core": "^4.14.0",
+    "eslint": "^10.14.0",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-react-hooks": "^7.1.1",
+    "globals": "^17.13.0",
+    "ist": "^1.1.7",
+    "jsdom": "^30.1.3",
+    "playwright": "^1.64.1",
+    "prettier": "^3.9.10",
+    "prosemirror-commands": "^1.7.2",
+    "prosemirror-history": "^1.5.1",
+    "prosemirror-model": "^1.25.12",
+    "prosemirror-schema-basic": "^1.2.5",
+    "prosemirror-state": "^1.4.4",
+    "prosemirror-transform": "^1.12.4",
+    "prosemirror-view": "^1.42.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-reconciler": "^0.29.2",
+    "typescript": "^6.0.3",
+    "typescript-eslint": "^8.72.1",
+    "vite": "^8.3.5",
+    "vitest": "^5.0.5",
+    "wordgard": "0.6.2"
+  },
+  "peerDependencies": {
+    "react": ">=18 <20",
+    "react-dom": ">=18 <20",
+    "wordgard": "~0.6.2"
+  },
+  "dependencies": {
+    "use-sync-external-store": "^1.7.0"
+  },
+  "devEngines": {
+    "runtime": {
+      "name": "node",
+      "version": ">=22.12"
+    }
+  }
+}