skir-codemirror-plugin 0.9.0

package/dist/json/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/json/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/json/types.ts"],"names":[],"mappings":"","sourcesContent":["// To use instead of `any`\nexport type Json =\n  | null\n  | boolean\n  | number\n  | string\n  | readonly Json[]\n  | Readonly<{ [name: string]: Json }>;\n\n// -----------------------------------------------------------------------------\n// ERRORS\n// -----------------------------------------------------------------------------\n\nexport interface JsonError {\n  readonly kind: \"error\";\n  readonly segment: Segment;\n  readonly message: string;\n}\n\n// -----------------------------------------------------------------------------\n// PARSING\n// -----------------------------------------------------------------------------\n\nexport interface JsonParseResult {\n  /// If `undefined`, then `errors` is guaranteed not to be empty.\n  readonly value: JsonValue | undefined;\n  readonly errors: readonly JsonError[];\n  /// Set of edits to apply to the original JSON code to fix formatting and\n  // comma errors (no comma between consecutive values, trailing comma).\n  readonly edits: readonly JsonEdit[];\n}\n\nexport type JsonValue = JsonArray | JsonObject | JsonLiteral;\n\nexport interface JsonArray {\n  readonly kind: \"array\";\n  /// Position of the '[' token.\n  readonly firstToken: Segment;\n  /// From '[' to ']' included.\n  readonly segment: Segment;\n  readonly values: JsonValue[];\n  expectedType?: TypeSignature;\n}\n\nexport interface JsonKey {\n  readonly keySegment: Segment;\n  readonly key: string;\n}\n\nexport interface JsonKeyValue {\n  readonly keySegment: Segment;\n  readonly key: string;\n  readonly value: JsonValue;\n  expectedType?: TypeSignature;\n}\n\nexport interface JsonObject {\n  readonly kind: \"object\";\n  /// Position of the '{' token.\n  readonly firstToken: Segment;\n  /// From '{' to '}' included.\n  readonly segment: Segment;\n  readonly keyValues: { [key: string]: JsonKeyValue };\n  /// Includes \"broken\" keys which produced a parsing error.\n  readonly allKeys: readonly JsonKey[];\n  expectedType?: TypeSignature;\n}\n\nexport interface JsonLiteral {\n  readonly kind: \"literal\";\n  /// Position of the first and only token. Same as `segment`.\n  readonly firstToken: Segment;\n  readonly segment: Segment;\n  readonly jsonCode: string;\n  readonly type: \"boolean\" | \"null\" | \"number\" | \"string\";\n  expectedType?: TypeSignature;\n}\n\nexport interface Segment {\n  readonly start: number;\n  readonly end: number;\n}\n\n/// Path to a sub-value within a valid Skir value.\nexport type Path =\n  | {\n      readonly kind: \"root\";\n    }\n  | {\n      readonly kind: \"field-value\";\n      /// Name of the field of the struct\n      readonly fieldName: string;\n      /// Path to the struct value\n      readonly structPath: Path;\n    }\n  | {\n      readonly kind: \"variant-value\";\n      /// Name of the wrapper variant of the enum\n      readonly variantName: string;\n      /// Path to the enum value\n      readonly enumPath: Path;\n    }\n  | {\n      readonly kind: \"array-item\";\n      readonly index: number;\n      readonly key: string | null;\n      readonly arrayPath: Path;\n    };\n\nexport interface JsonValueContext {\n  readonly value: JsonValue;\n  readonly path: Path;\n}\n\nexport interface JsonEdit {\n  readonly segment: Segment;\n  readonly replacement: string;\n}\n\n// -----------------------------------------------------------------------------\n// SCHEMA\n// -----------------------------------------------------------------------------\n\n/** JSON representation of a `TypeDescriptor`. */\nexport type TypeDefinition = {\n  readonly type: TypeSignature;\n  readonly records: readonly RecordDefinition[];\n};\n\n/** A type in the JSON representation of a `TypeDescriptor`. */\nexport type TypeSignature =\n  | {\n      kind: \"optional\";\n      value: TypeSignature;\n    }\n  | ArrayTypeSignature\n  | RecordTypeSignature\n  | {\n      kind: \"primitive\";\n      value: PrimitiveType;\n    };\n\nexport interface ArrayTypeSignature {\n  readonly kind: \"array\";\n  readonly value: {\n    readonly item: TypeSignature;\n    readonly key_extractor?: string;\n  };\n}\n\nexport interface RecordTypeSignature {\n  readonly kind: \"record\";\n  readonly value: string;\n}\n\nexport type PrimitiveType =\n  | \"bool\"\n  | \"int32\"\n  | \"int64\"\n  | \"hash64\"\n  | \"float32\"\n  | \"float64\"\n  | \"timestamp\"\n  | \"string\"\n  | \"bytes\";\n\nexport type RecordDefinition = StructDefinition | EnumDefinition;\n\n/** Definition of a struct in the JSON representation of a `TypeDescriptor`. */\nexport type StructDefinition = {\n  readonly kind: \"struct\";\n  readonly id: string;\n  readonly doc?: string;\n  readonly fields: readonly FieldDefinition[];\n  readonly removed_numbers?: readonly number[];\n};\n\n/**\n * Definition of a struct field in the JSON representation of a\n * `TypeDescriptor`.\n */\nexport type FieldDefinition = {\n  readonly name: string;\n  readonly type: TypeSignature;\n  readonly number: number;\n  readonly doc?: string;\n};\n\n/** Definition of an enum in the JSON representation of a `TypeDescriptor`. */\nexport type EnumDefinition = {\n  readonly kind: \"enum\";\n  readonly id: string;\n  readonly doc?: string;\n  readonly variants: readonly VariantDefinition[];\n  readonly removed_numbers?: readonly number[];\n};\n\n/**\n * Definition of an enum variant in the JSON representation of a\n * `TypeDescriptor`.\n */\nexport type VariantDefinition = {\n  readonly name: string;\n  readonly type?: TypeSignature;\n  readonly number: number;\n  readonly doc?: string;\n};\n\n// -----------------------------------------------------------------------------\n// SCHEMA VALIDATION\n// -----------------------------------------------------------------------------\n\nexport interface ValidationResult {\n  readonly errors: JsonError[];\n  readonly hints: Hint[];\n  readonly rootTypeHint: TypeHint | undefined;\n  readonly pathToTypeHint: ReadonlyMap<Path, TypeHint>;\n}\n\nexport interface TypeHint {\n  readonly segment: Segment;\n  readonly message: string | readonly string[];\n  readonly valueContext: JsonValueContext;\n  /// In order. All are included in 'valueContext.value.segment'.\n  readonly childHints: readonly TypeHint[];\n}\n\nexport type Hint =\n  | {\n      readonly segment: Segment;\n      readonly message: string;\n      readonly valueContext?: undefined;\n    }\n  | TypeHint;\n\nexport interface MutableTypeHint extends TypeHint {\n  readonly childHints: TypeHint[];\n}\n\n// -----------------------------------------------------------------------------\n// METHOD LIST\n// -----------------------------------------------------------------------------\n\nexport interface MethodList {\n  readonly methods: readonly Method[];\n}\n\nexport interface Method {\n  readonly method: string;\n  readonly number: number | string;\n  readonly request: TypeDefinition;\n  readonly response: TypeDefinition;\n  readonly doc?: string;\n}\n"]}

package/package.json

@@ -0,0 +1,85 @@
+{
+  "name": "skir-codemirror-plugin",
+  "version": "0.9.0",
+  "description": "",
+  "homepage": "https://github.com/gepheum/skir-codemirror-plugin#readme",
+  "bugs": {
+    "url": "https://github.com/gepheum/skir-codemirror-plugin/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/gepheum/skir-codemirror-plugin.git"
+  },
+  "files": [
+    "dist/",
+    "src/",
+    "README.md"
+  ],
+  "license": "ISC",
+  "author": "Tyler Fibonacci <gepheum@gmail.com>",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "type": "module",
+  "scripts": {
+    "build": "tsc",
+    "build:dev": "tsc -p tsconfig.dev.json",
+    "build:watch": "tsc --watch",
+    "build:dev:watch": "tsc -p tsconfig.dev.json --watch",
+    "clean": "rimraf dev-dist my-element.{d.ts,d.ts.map,js,js.map} test/my-element.{d.ts,d.ts.map,js,js.map} test/my-element_test.{d.ts,d.ts.map,js,js.map}",
+    "lint": "eslint src/**/*.ts && lit-analyzer",
+    "format": "prettier \"src/**/*.{cjs,html,js,json,md,ts}\" --ignore-path ./.prettierignore --write",
+    "format:check": "prettier \"src/**/*.{cjs,html,js,json,md,ts}\" --ignore-path ./.prettierignore --check",
+    "analyze": "cem analyze --litelement --globs \"src/**/*.ts\"",
+    "analyze:watch": "cem analyze --litelement --globs \"src/**/*.ts\" --watch",
+    "dev": "npm run build && npm run build:dev && concurrently -k \"npm:build:watch\" \"npm:build:dev:watch\" \"npm:dev:serve\"",
+    "dev:serve": "wds --watch --open /dev/index.html",
+    "serve": "npm run build && wds --watch",
+    "test": "mocha",
+    "prepublishOnly": "npm run build"
+  },
+  "dependencies": {
+    "@codemirror/buildhelper": "^1.0.2",
+    "@codemirror/lang-json": "^6.0.2",
+    "@codemirror/language": "^6.11.2",
+    "@uiw/codemirror-theme-tokyo-night": "^4.25.4",
+    "@uiw/codemirror-theme-tokyo-night-day": "^4.25.9",
+    "codemirror": "^6.0.2",
+    "lit": "^3.2.0",
+    "nanoevents": "^9.1.0",
+    "skir-client": "^1.0.11"
+  },
+  "devDependencies": {
+    "@custom-elements-manifest/analyzer": "^0.6.3",
+    "@eslint/js": "^9.39.2",
+    "@types/mocha": "^10.0.1",
+    "@web/dev-server": "^0.4.6",
+    "@web/dev-server-import-maps": "^0.2.1",
+    "@web/dev-server-legacy": "^1.0.0",
+    "@webcomponents/webcomponentsjs": "^2.8.0",
+    "buckwheat": "^1.1.2",
+    "concurrently": "^9.2.1",
+    "eslint": "^10.0.1",
+    "lit-analyzer": "^2.0.3",
+    "mocha": "^11.7.5",
+    "prettier": "^2.8.8",
+    "prettier-plugin-organize-imports": "^4.2.0",
+    "rimraf": "^6.1.3",
+    "ts-node": "^10.9.2",
+    "tsx": "^4.21.0",
+    "typescript": "~5.5.0",
+    "typescript-eslint": "^8.56.0"
+  },
+  "overrides": {
+    "diff": "^8.0.3",
+    "minimatch": "^10.2.1",
+    "serialize-javascript": "^7.0.4"
+  },
+  "customElements": "custom-elements.json"
+}

package/src/codemirror/create_editor_state.ts

@@ -0,0 +1,278 @@
+import { autocompletion, closeBrackets } from "@codemirror/autocomplete";
+import { json as jsonExtension } from "@codemirror/lang-json";
+import { linter, lintGutter } from "@codemirror/lint";
+import { EditorState, Extension } from "@codemirror/state";
+import { EditorView } from "@codemirror/view";
+import { tokyoNight } from "@uiw/codemirror-theme-tokyo-night";
+import { tokyoNightDay } from "@uiw/codemirror-theme-tokyo-night-day";
+import { basicSetup } from "codemirror";
+import { makeJsonTemplate } from "../json/to_json";
+import type { Json, RecordDefinition, TypeDefinition } from "../json/types";
+import { enterKeyHandler } from "./enter_key_handler";
+import { jsonCompletion } from "./json_completion";
+import { jsonLinter } from "./json_linter";
+import { debouncedJsonParser } from "./json_state";
+import { statusBar } from "./status_bar";
+
+export type CreateEditorStateParams = {
+  schema: TypeDefinition;
+  readOnly?: true;
+  json?: Json;
+  theme?: "tokyo-night" | "tokyo-night-day" | CustomTheme;
+};
+
+export function createEditorState({
+  schema,
+  readOnly,
+  json,
+  theme,
+}: CreateEditorStateParams): EditorState {
+  const idToRecordDef: { [id: string]: RecordDefinition } = {};
+  for (const record of schema.records) {
+    idToRecordDef[record.id] = record;
+  }
+  const content = json ?? makeJsonTemplate(schema.type, idToRecordDef);
+
+  switch (theme) {
+    case undefined:
+    case "tokyo-night": {
+      theme = {
+        backgroundColor: "#1a1b26",
+        lighterBgColor: "#1f2335",
+        borderColor: "#414868",
+        foregroundColor: "#c0caf5",
+        accentColor: "#7aa2f7",
+        errorColor: "#f7768e",
+        selectionColor: "#515c7e40",
+        themeExtension: tokyoNight,
+      };
+      break;
+    }
+    case "tokyo-night-day": {
+      theme = {
+        backgroundColor: "#d5d6db",
+        lighterBgColor: "#e1e2e7",
+        borderColor: "#adb0bb",
+        foregroundColor: "#3760bf",
+        accentColor: "#2e7de9",
+        errorColor: "#f52a65",
+        selectionColor: "#3760bf33",
+        themeExtension: tokyoNightDay,
+      };
+      break;
+    }
+  }
+
+  return EditorState.create({
+    doc: JSON.stringify(content, null, 2),
+    extensions: [
+      EditorState.readOnly.of(!!readOnly),
+      enterKeyHandler(schema),
+      basicSetup,
+      EditorState.languageData.of(() => [
+        {
+          closeBrackets: { before: ",]}" },
+        },
+      ]),
+      closeBrackets(),
+      theme.themeExtension ?? [],
+      jsonExtension(),
+      debouncedJsonParser(schema),
+      linter(jsonLinter(readOnly ? "read-only" : "editable")),
+      autocompletion({
+        override: [jsonCompletion(schema)],
+      }),
+      lintGutter(),
+      statusBar(),
+      EditorView.theme({
+        "&": {
+          fontSize: "14px",
+          height: "100%",
+        },
+        ".cm-scroller": {
+          fontFamily: "'JetBrains Mono', monospace",
+          overflow: "auto",
+        },
+        ".cm-lintRange-info": {
+          backgroundImage: "none",
+        },
+        ".cm-lintRange-info:hover": {
+          backgroundColor: theme.selectionColor,
+        },
+        ".cm-lintRange-error": {
+          backgroundImage: "none",
+          borderBottom: `3px solid ${theme.errorColor}`,
+        },
+        ".cm-tooltip-hover": {
+          backgroundColor: theme.lighterBgColor,
+          border: `1px solid ${theme.borderColor}`,
+          borderRadius: "4px",
+          padding: "8px 12px",
+          boxShadow: "0 4px 12px rgba(0, 0, 0, 0.5)",
+          fontSize: "14px",
+          lineHeight: "1.4",
+          color: theme.foregroundColor,
+        },
+        ".cm-tooltip.cm-tooltip-lint": {
+          backgroundColor: theme.lighterBgColor,
+          border: `1px solid ${theme.borderColor}`,
+          borderRadius: "4px",
+          padding: "8px 12px",
+          boxShadow: "0 4px 12px rgba(0, 0, 0, 0.5)",
+          fontSize: "14px", // Ensure consistency
+          color: theme.foregroundColor,
+        },
+        ".cm-tooltip-lint .cm-diagnostic-error": {
+          fontWeight: "bold",
+          color: theme.errorColor,
+        },
+        ".cm-status-bar": {
+          backgroundColor: theme.lighterBgColor,
+          borderTopColor: theme.borderColor,
+          color: theme.accentColor,
+        },
+        ".cm-diagnostic-textarea": {
+          backgroundColor: theme.lighterBgColor,
+          borderColor: theme.borderColor,
+          color: theme.foregroundColor,
+        },
+        ".cm-diagnostic-textarea[readonly]": {
+          backgroundColor: theme.backgroundColor,
+        },
+        ".cm-diagnostic-input": {
+          backgroundColor: theme.lighterBgColor,
+          borderColor: theme.borderColor,
+          color: theme.foregroundColor,
+        },
+        ".cm-diagnostic-button": {
+          backgroundColor: theme.lighterBgColor,
+          borderColor: theme.borderColor,
+          color: theme.foregroundColor,
+        },
+        ".cm-diagnostic-button:hover": {
+          backgroundColor: theme.borderColor,
+        },
+        ".cm-diagnostic-error-message": {
+          color: theme.errorColor,
+        },
+        ".diagnostic-row + .diagnostic-row": {
+          borderTopColor: theme.borderColor,
+        },
+      }),
+      EditorView.baseTheme({
+        ".cm-lint-marker-info": {
+          display: "none",
+        },
+        ".cm-status-bar": {
+          display: "flex",
+          flexDirection: "row-reverse",
+          justifyContent: "flex-end",
+          padding: "4px 12px",
+          borderTop: "1px solid",
+          fontSize: "12px",
+          height: "16px",
+        },
+        ".cm-status-bar-link": {
+          textDecoration: "none",
+          cursor: "pointer",
+        },
+        ".cm-status-bar-link:hover": {
+          textDecoration: "underline",
+        },
+        ".cm-status-bar-link:hover ~ .cm-status-bar-link": {
+          textDecoration: "underline",
+        },
+        ".cm-diagnostic-wrapper": {
+          fontSize: "12px",
+          lineHeight: "1.3",
+          padding: "2px",
+        },
+        ".cm-diagnostic-controls": {
+          marginTop: "4px",
+          display: "flex",
+          gap: "6px",
+          alignItems: "center",
+        },
+        ".cm-diagnostic-label": {
+          whiteSpace: "nowrap",
+          fontWeight: "500",
+          minWidth: "64px",
+        },
+        ".cm-diagnostic-textarea": {
+          flex: "1",
+          padding: "3px 6px",
+          border: "1px solid",
+          borderRadius: "3px",
+          fontSize: "12px",
+          fontFamily: "'JetBrains Mono', monospace",
+          resize: "none",
+          overflow: "auto",
+          boxSizing: "border-box",
+        },
+        ".cm-diagnostic-textarea[readonly]": {
+          cursor: "default",
+        },
+        ".cm-diagnostic-input": {
+          padding: "3px 6px",
+          border: "1px solid",
+          borderRadius: "3px",
+          fontSize: "12px",
+          fontFamily: "'JetBrains Mono', monospace",
+          boxSizing: "border-box",
+          width: "100%",
+        },
+        ".cm-diagnostic-button": {
+          padding: "3px 12px",
+          border: "1px solid",
+          borderRadius: "3px",
+          fontSize: "12px",
+          fontFamily: "'JetBrains Mono', monospace",
+          cursor: "pointer",
+          boxSizing: "border-box",
+        },
+        ".cm-diagnostic-button:active": {
+          transform: "translateY(1px)",
+        },
+        ".cm-diagnostic-error-message": {
+          fontSize: "11px",
+          marginTop: "2px",
+          fontWeight: "500",
+        },
+        ".cm-timestamp-field": {
+          display: "flex",
+          flexDirection: "column",
+          gap: "2px",
+          flex: "1",
+        },
+        ".cm-tooltip-lint .cm-diagnostic": {
+          padding: "0",
+          borderTop: "none",
+          borderLeft: "none",
+        },
+        ".cm-tooltip-lint .cm-diagnostic-error": {
+          borderLeft: "none",
+          fontWeight: "bold",
+        },
+        ".cm-tooltip-lint .cm-diagnostic-info": {
+          borderLeft: "none",
+        },
+        ".diagnostic-row + .diagnostic-row": {
+          marginTop: "8px",
+          paddingTop: "8px",
+          borderTop: "1px solid",
+        },
+      }),
+    ],
+  });
+}
+
+export interface CustomTheme {
+  backgroundColor: string;
+  lighterBgColor: string;
+  borderColor: string;
+  foregroundColor: string;
+  accentColor: string;
+  errorColor: string;
+  selectionColor: string;
+  themeExtension?: Extension;
+}

package/src/codemirror/enter_key_handler.ts

@@ -0,0 +1,232 @@
+import { Extension } from "@codemirror/state";
+import { EditorView, keymap } from "@codemirror/view";
+import { makeJsonTemplate } from "../json/to_json";
+import {
+  ArrayTypeSignature,
+  JsonValue,
+  RecordDefinition,
+  RecordTypeSignature,
+  TypeDefinition,
+} from "../json/types";
+import { ensureJsonState } from "./json_state";
+
+/**
+ * Triggered when the Enter key is pressed between 2 consecutive curly braces or
+ * square brackets.
+ */
+export function enterKeyHandler(schema: TypeDefinition): Extension {
+  return keymap.of([
+    {
+      key: "Enter",
+      run: (view: EditorView): boolean => {
+        const { state } = view;
+        const { selection } = state;
+        const { main } = selection;
+
+        // Get the current cursor position
+        const cursorPos = main.head;
+
+        const textAround = state.doc.sliceString(cursorPos - 1, cursorPos + 1);
+        if (textAround !== "{}" && textAround !== "[]") {
+          return false; // Allow default Enter behavior
+        }
+
+        // Ensure JSON state is up-to-date
+        const jsonState = ensureJsonState(view, schema);
+        const parseResult = jsonState.parseResult;
+        if (!parseResult.value) {
+          return false;
+        }
+        const jsonValue: JsonValue = parseResult.value;
+
+        const idToRecordDef: { [id: string]: RecordDefinition } = {};
+        for (const record of schema.records) {
+          idToRecordDef[record.id] = record;
+        }
+        const type = findTypeByLeftBracketPos(
+          jsonValue,
+          cursorPos - 1,
+          idToRecordDef,
+        );
+        if (type === null) {
+          return false;
+        }
+
+        let codeToInsert: string;
+        if (type.kind === "array") {
+          codeToInsert = JSON.stringify(
+            makeJsonTemplate(type.value.item, idToRecordDef),
+            null,
+            2,
+          );
+        } else if (type.kind === "record") {
+          const recordDef = idToRecordDef[type.value];
+          if (recordDef.kind === "struct") {
+            codeToInsert = JSON.stringify(
+              makeJsonTemplate(type, idToRecordDef),
+              null,
+              2,
+            );
+            if (codeToInsert === "{}") {
+              return false;
+            }
+            // Remove the curly brackets at the start and end of the string and
+            // unindent each line.
+            codeToInsert = codeToInsert
+              .split("\n")
+              .slice(1, -1)
+              .map((line) => line.substring(2))
+              .join("\n");
+          } else {
+            // Enum
+            codeToInsert = ['"kind": "",', '"value": {}'].join("\n");
+          }
+        } else if (type.kind === "timestamp") {
+          codeToInsert =
+            '"unix_millis": 0,\n"formatted": "1970-01-01T00:00:00.000Z"';
+        } else {
+          const _: never = type;
+          throw new Error(_);
+        }
+
+        // Indent the code to insert based on the current line's indentation
+        const lineIndentation = getLineIndentation(
+          state.doc.toString(),
+          cursorPos - 1,
+        );
+        codeToInsert = indent(codeToInsert, "  " + lineIndentation);
+
+        codeToInsert = `\n${codeToInsert}\n${lineIndentation}`;
+
+        // Apply the transaction
+        view.dispatch({
+          changes: {
+            from: cursorPos,
+            to: cursorPos,
+            insert: codeToInsert,
+          },
+          // Move cursor to the end of the inserted text
+          selection: { anchor: cursorPos + codeToInsert.length },
+        });
+
+        return true; // Prevent default Enter behavior
+      },
+    },
+  ]);
+}
+
+function findTypeByLeftBracketPos(
+  jsonValue: JsonValue,
+  leftBracketPos: number,
+  idToRecordDef: { [id: string]: RecordDefinition },
+): ArrayTypeSignature | RecordTypeSignature | { kind: "timestamp" } | null {
+  let { expectedType } = jsonValue;
+  if (!expectedType) {
+    return null;
+  }
+  if (expectedType.kind === "optional") {
+    expectedType = expectedType.value;
+  }
+  switch (jsonValue.kind) {
+    case "array": {
+      if (expectedType.kind !== "array") {
+        return null;
+      }
+      if (leftBracketPos === jsonValue.firstToken.start) {
+        // We have a match
+        return expectedType;
+      }
+      // If no match, we can continue searching in the elements.
+      for (const element of jsonValue.values) {
+        if (leftBracketPos < element.firstToken.start) {
+          return null; // No need to continue (optimization)
+        }
+        const maybeResult = findTypeByLeftBracketPos(
+          element,
+          leftBracketPos,
+          idToRecordDef,
+        );
+        if (maybeResult) {
+          return maybeResult;
+        }
+      }
+      return null;
+    }
+    case "object": {
+      if (
+        expectedType.kind === "primitive" &&
+        expectedType.value === "timestamp" &&
+        leftBracketPos === jsonValue.firstToken.start
+      ) {
+        return { kind: "timestamp" };
+      }
+      if (expectedType.kind !== "record") {
+        return null;
+      }
+      if (leftBracketPos === jsonValue.firstToken.start) {
+        // We have a match
+        return expectedType;
+      }
+      // If no match, we can continue searching in the values.
+      const recordDef = idToRecordDef[expectedType.value];
+      if (recordDef.kind === "struct") {
+        for (const keyValue of Object.values(jsonValue.keyValues)) {
+          const maybeResult = findTypeByLeftBracketPos(
+            keyValue.value,
+            leftBracketPos,
+            idToRecordDef,
+          );
+          if (maybeResult) {
+            return maybeResult;
+          }
+        }
+      } else {
+        const valueKv = jsonValue.keyValues["value"];
+        if (valueKv) {
+          const maybeResult = findTypeByLeftBracketPos(
+            valueKv.value,
+            leftBracketPos,
+            idToRecordDef,
+          );
+          if (maybeResult) {
+            return maybeResult;
+          }
+        }
+      }
+      return null;
+    }
+    case "literal": {
+      return null;
+    }
+  }
+}
+
+/** Returns the indentation at the line containing `position`. */
+function getLineIndentation(text: string, position: number): string {
+  if (position < 0 || position >= text.length) {
+    return "";
+  }
+
+  // Find the start of the line containing the position
+  let lineStart = position;
+  while (lineStart > 0 && text[lineStart - 1] !== "\n") {
+    lineStart--;
+  }
+
+  // Extract indentation (spaces at the beginning of the line)
+  let indentation = "";
+  let i = lineStart;
+  while (i < text.length && text[i] === " ") {
+    indentation += " ";
+    i++;
+  }
+
+  return indentation;
+}
+
+function indent(text: string, indentation: string): string {
+  return text
+    .split("\n")
+    .map((line) => indentation + line)
+    .join("\n");
+}