@staticbolt/lsp 1.0.0-beta.12

package/src/index.ts

@@ -0,0 +1,37 @@
+import * as vs from "vscode-languageserver/node";
+
+import { startServer } from "./html-server.ts";
+import { getNodeFileFS } from "./utils/node-fs.ts";
+import { formatError } from "./utils/runner.ts";
+
+import type { RuntimeEnvironment } from "./html-server.ts";
+import type { Connection, Disposable } from "vscode-languageserver/node";
+
+// Create a connection for the server.
+const connection: Connection = vs.createConnection();
+
+console.log = connection.console.log.bind(connection.console);
+console.error = connection.console.error.bind(connection.console);
+
+process.on("unhandledRejection", (error: unknown) => {
+  connection.console.error(formatError(`Unhandled exception`, error));
+});
+
+const runtime: RuntimeEnvironment = {
+  timer: {
+    setImmediate(callback: (...arguments_: unknown[]) => void, ...arguments_: unknown[]): Disposable {
+      const handle = setImmediate(callback, ...arguments_);
+      return { dispose: () => clearImmediate(handle) };
+    },
+
+    setTimeout(callback: (...arguments_: unknown[]) => void, ms: number, ...arguments_: unknown[]): Disposable {
+      const handle = setTimeout(callback, ms, ...arguments_);
+      return { dispose: () => clearTimeout(handle) };
+    },
+  },
+
+  fileFs: getNodeFileFS(),
+};
+
+connection.console.log("[staticbolt] starting server");
+startServer(connection, runtime);

package/src/language-model-cache.ts

@@ -0,0 +1,89 @@
+import type { TextDocument } from "vscode-html-languageservice";
+
+export interface LanguageModelCache<T> {
+  get(document: TextDocument): T;
+  onDocumentRemoved(document: TextDocument): void;
+  dispose(): void;
+}
+
+export function getLanguageModelCache<T>(
+  maxEntries: number,
+  cleanupIntervalTimeInSec: number,
+  parse: (document: TextDocument) => T
+): LanguageModelCache<T> {
+  let languageModels: { [uri: string]: { version: number; languageId: string; cTime: number; languageModel: T } } = {};
+  let nModels = 0;
+
+  let cleanupInterval: NodeJS.Timeout | undefined = undefined;
+
+  if (cleanupIntervalTimeInSec > 0) {
+    cleanupInterval = setInterval(() => {
+      const cutoffTime = Date.now() - cleanupIntervalTimeInSec * 1000;
+      const uris = Object.keys(languageModels);
+
+      for (const uri of uris) {
+        const languageModelInfo = languageModels[uri];
+        if (languageModelInfo.cTime < cutoffTime) {
+          delete languageModels[uri];
+          nModels--;
+        }
+      }
+    }, cleanupIntervalTimeInSec * 1000);
+  }
+
+  return {
+    get(document: TextDocument): T {
+      const version = document.version;
+      const languageId = document.languageId;
+      const languageModelInfo = languageModels[document.uri];
+
+      if (languageModelInfo && languageModelInfo.version === version && languageModelInfo.languageId === languageId) {
+        languageModelInfo.cTime = Date.now();
+        return languageModelInfo.languageModel;
+      }
+
+      const languageModel = parse(document);
+      languageModels[document.uri] = { languageModel, version, languageId, cTime: Date.now() };
+      if (!languageModelInfo) {
+        nModels++;
+      }
+
+      if (nModels === maxEntries) {
+        let oldestTime = Number.MAX_VALUE;
+        let oldestUri = null;
+
+        for (const uri in languageModels) {
+          const languageModelInfo = languageModels[uri];
+          if (languageModelInfo.cTime < oldestTime) {
+            oldestUri = uri;
+            oldestTime = languageModelInfo.cTime;
+          }
+        }
+
+        if (oldestUri) {
+          delete languageModels[oldestUri];
+          nModels--;
+        }
+      }
+
+      return languageModel;
+    },
+
+    onDocumentRemoved(document: TextDocument) {
+      const uri = document.uri;
+      if (languageModels[uri]) {
+        delete languageModels[uri];
+        nModels--;
+      }
+    },
+
+    dispose() {
+      if (cleanupInterval !== undefined) {
+        clearInterval(cleanupInterval);
+        cleanupInterval = undefined;
+        languageModels = {};
+        nModels = 0;
+      }
+    },
+  };
+}

package/src/modes/embedded-support.ts

@@ -0,0 +1,268 @@
+import vscodeHtml from "vscode-html-languageservice";
+import { TextDocument } from "vscode-languageserver-textdocument";
+
+import type { LanguageService, Range } from "vscode-html-languageservice";
+
+export interface LanguageRange extends Range {
+  languageId: string | undefined;
+  attributeValue?: boolean;
+}
+
+export interface HTMLDocumentRegions {
+  getEmbeddedDocument(languageId: string, ignoreAttributeValues?: boolean): TextDocument;
+  getLanguageRanges(range: Range): LanguageRange[];
+  getLanguageAtPosition(position: Position): string | undefined;
+  getLanguagesInDocument(): string[];
+  getImportedScripts(): string[];
+}
+
+const CSS_STYLE_RULE = "__";
+const TokenType = vscodeHtml.TokenType;
+const Position = vscodeHtml.Position;
+type Position = vscodeHtml.Position;
+
+interface EmbeddedRegion {
+  languageId: string | undefined;
+  start: number;
+  end: number;
+  attributeValue?: boolean;
+}
+
+export function getDocumentRegions(languageService: LanguageService, document: TextDocument): HTMLDocumentRegions {
+  const regions: EmbeddedRegion[] = [];
+  const scanner = languageService.createScanner(document.getText());
+  let lastTagName: string = "";
+  let lastAttributeName: string | null = null;
+  let languageIdFromType: string | undefined = undefined;
+  const importedScripts: string[] = [];
+
+  let token = scanner.scan();
+
+  while (token !== TokenType.EOS) {
+    switch (token) {
+      case TokenType.StartTag:
+        lastTagName = scanner.getTokenText();
+        lastAttributeName = null;
+        languageIdFromType = "javascript";
+        break;
+      case TokenType.Styles:
+        regions.push({ languageId: "css", start: scanner.getTokenOffset(), end: scanner.getTokenEnd() });
+        break;
+      case TokenType.Script:
+        regions.push({ languageId: languageIdFromType, start: scanner.getTokenOffset(), end: scanner.getTokenEnd() });
+        break;
+      case TokenType.AttributeName:
+        lastAttributeName = scanner.getTokenText();
+        break;
+      case TokenType.AttributeValue:
+        if (lastAttributeName === "src" && lastTagName.toLowerCase() === "script") {
+          let value = scanner.getTokenText();
+          if (value[0] === "'" || value[0] === '"') {
+            value = value.slice(1, -1);
+          }
+          importedScripts.push(value);
+        } else if (lastAttributeName === "type" && lastTagName.toLowerCase() === "script") {
+          const token = scanner.getTokenText();
+          if (/["'](module|(text|application)\/(java|ecma)script|text\/babel)["']/.test(token) || token === "module") {
+            languageIdFromType = "javascript";
+          } else if (/["']text\/typescript["']/.test(token)) {
+            languageIdFromType = "typescript";
+          } else {
+            languageIdFromType = undefined;
+          }
+        } else {
+          const attributeLanguageId = getAttributeLanguage(lastAttributeName!);
+          if (attributeLanguageId) {
+            let start = scanner.getTokenOffset();
+            let end = scanner.getTokenEnd();
+            const firstChar = document.getText()[start];
+            if (firstChar === "'" || firstChar === '"') {
+              start++;
+              end--;
+            }
+            regions.push({ languageId: attributeLanguageId, start, end, attributeValue: true });
+          }
+        }
+        lastAttributeName = null;
+        break;
+    }
+    token = scanner.scan();
+  }
+  return {
+    getLanguageRanges: (range: Range) => getLanguageRanges(document, regions, range),
+    getEmbeddedDocument: (languageId: string, ignoreAttributeValues: boolean) =>
+      getEmbeddedDocument(document, regions, languageId, ignoreAttributeValues),
+    getLanguageAtPosition: (position: Position) => getLanguageAtPosition(document, regions, position),
+    getLanguagesInDocument: () => getLanguagesInDocument(document, regions),
+    getImportedScripts: () => importedScripts,
+  };
+}
+
+function getLanguageRanges(document: TextDocument, regions: EmbeddedRegion[], range: Range): LanguageRange[] {
+  const result: LanguageRange[] = [];
+  let currentPos = range ? range.start : Position.create(0, 0);
+  let currentOffset = range ? document.offsetAt(range.start) : 0;
+  const endOffset = range ? document.offsetAt(range.end) : document.getText().length;
+  for (const region of regions) {
+    if (region.end > currentOffset && region.start < endOffset) {
+      const start = Math.max(region.start, currentOffset);
+      const startPos = document.positionAt(start);
+      if (currentOffset < region.start) {
+        result.push({
+          start: currentPos,
+          end: startPos,
+          languageId: "html",
+        });
+      }
+      const end = Math.min(region.end, endOffset);
+      const endPos = document.positionAt(end);
+      if (end > region.start) {
+        result.push({
+          start: startPos,
+          end: endPos,
+          languageId: region.languageId,
+          attributeValue: region.attributeValue,
+        });
+      }
+      currentOffset = end;
+      currentPos = endPos;
+    }
+  }
+  if (currentOffset < endOffset) {
+    const endPos = range ? range.end : document.positionAt(endOffset);
+    result.push({
+      start: currentPos,
+      end: endPos,
+      languageId: "html",
+    });
+  }
+  return result;
+}
+
+function getLanguagesInDocument(_document: TextDocument, regions: EmbeddedRegion[]): string[] {
+  const result: string[] = [];
+
+  for (const region of regions) {
+    if (region.languageId && !result.includes(region.languageId)) {
+      result.push(region.languageId);
+      if (result.length === 3) {
+        return result;
+      }
+    }
+  }
+
+  result.push("html");
+
+  return result;
+}
+
+function getLanguageAtPosition(document: TextDocument, regions: EmbeddedRegion[], position: Position): string | undefined {
+  const offset = document.offsetAt(position);
+  for (const region of regions) {
+    if (region.start <= offset) {
+      if (offset <= region.end) {
+        return region.languageId;
+      }
+    } else {
+      break;
+    }
+  }
+  return "html";
+}
+
+function getEmbeddedDocument(
+  document: TextDocument,
+  contents: EmbeddedRegion[],
+  languageId: string,
+  ignoreAttributeValues: boolean
+): TextDocument {
+  let currentPos = 0;
+  const oldContent = document.getText();
+  let result = "";
+  let lastSuffix = "";
+  for (const c of contents) {
+    if (c.languageId === languageId && (!ignoreAttributeValues || !c.attributeValue)) {
+      result = substituteWithWhitespace(result, currentPos, c.start, oldContent, lastSuffix, getPrefix(c));
+      result += updateContent(c, oldContent.slice(c.start, c.end));
+      currentPos = c.end;
+      lastSuffix = getSuffix(c);
+    }
+  }
+  result = substituteWithWhitespace(result, currentPos, oldContent.length, oldContent, lastSuffix, "");
+  return TextDocument.create(document.uri, languageId, document.version, result);
+}
+
+function getPrefix(c: EmbeddedRegion) {
+  if (c.attributeValue) {
+    switch (c.languageId) {
+      case "css":
+        return CSS_STYLE_RULE + "{";
+    }
+  }
+  return "";
+}
+function getSuffix(c: EmbeddedRegion) {
+  if (c.attributeValue) {
+    switch (c.languageId) {
+      case "css":
+        return "}";
+      case "javascript":
+        return ";";
+    }
+  }
+  return "";
+}
+function updateContent(c: EmbeddedRegion, content: string): string {
+  if (!c.attributeValue && c.languageId === "javascript") {
+    return content.replace(`<!--`, `/* `).replace(`-->`, ` */`);
+  }
+  if (c.languageId === "css") {
+    const quoteEscape = /(&quot;|&#34;)/g;
+    return content.replace(quoteEscape, (match, _, offset: number) => {
+      const spaces = " ".repeat(match.length - 1);
+      const afterChar = content[offset + match.length];
+      if (!afterChar || afterChar.includes(" ")) {
+        return `${spaces}"`;
+      }
+      return `"${spaces}`;
+    });
+  }
+  return content;
+}
+
+function substituteWithWhitespace(result: string, start: number, end: number, oldContent: string, before: string, after: string) {
+  result += before;
+  let accumulatedWS = -before.length; // start with a negative value to account for the before string
+  for (let index = start; index < end; index++) {
+    const ch = oldContent[index];
+    if (ch === "\n" || ch === "\r") {
+      // only write new lines, skip the whitespace
+      accumulatedWS = 0;
+      result += ch;
+    } else {
+      accumulatedWS++;
+    }
+  }
+  result = append(result, " ", accumulatedWS - after.length);
+  result += after;
+  return result;
+}
+
+function append(result: string, string_: string, n: number): string {
+  while (n > 0) {
+    if (n & 1) {
+      result += string_;
+    }
+    n >>= 1;
+    string_ += string_;
+  }
+  return result;
+}
+
+function getAttributeLanguage(attributeName: string): string | null {
+  const match = attributeName.match(/^(style)$|^(on\w+)$/i);
+  if (!match) {
+    return null;
+  }
+  return match[1] ? "css" : "javascript";
+}

package/src/modes/html-mode.ts

@@ -0,0 +1,99 @@
+/* eslint-disable @typescript-eslint/require-await */
+import path from "node:path";
+import { Resolver } from "@staticbolt/core";
+import * as vscodeUri from "vscode-uri";
+
+import { getLanguageModelCache } from "../language-model-cache.ts";
+import { FILE_PROTOCOL } from "./language-modes.ts";
+
+import type { LanguageMode } from "./language-modes.ts";
+import type { HTMLDataV1, HTMLDocument, LanguageService, TextDocument } from "vscode-html-languageservice";
+
+export function getHTMLMode(htmlLanguageService: LanguageService): LanguageMode {
+  const htmlDocuments = getLanguageModelCache<HTMLDocument>(10, 60, document => htmlLanguageService.parseHTMLDocument(document));
+
+  return {
+    getId() {
+      return "html";
+    },
+
+    async doComplete(document, position, documentContext, htmlData) {
+      setHtmlDataProviders(htmlLanguageService, htmlData);
+
+      const htmlDocument = htmlDocuments.get(document);
+      const completionList = await htmlLanguageService.doComplete2(document, position, htmlDocument, documentContext);
+
+      for (const item of completionList.items) {
+        item.sortText = "0_" + item.label;
+      }
+
+      return completionList;
+    },
+
+    async doHover(document, position, htmlData) {
+      setHtmlDataProviders(htmlLanguageService, htmlData);
+
+      return htmlLanguageService.doHover(document, position, htmlDocuments.get(document));
+    },
+
+    async onDocumentRemoved(document: TextDocument) {
+      htmlDocuments.onDocumentRemoved(document);
+    },
+
+    async findDocumentLinks(document, documentContext, projectRoot) {
+      const resolver = new Resolver(projectRoot);
+      const documentFs = vscodeUri.URI.parse(document.uri).fsPath;
+      const projectRootRelative = path.relative(projectRoot, documentFs);
+
+      const links = htmlLanguageService.findDocumentLinks(document, documentContext);
+
+      for (const link of links) {
+        if (!link.target) continue;
+
+        const linkFs = vscodeUri.URI.parse(link.target ?? "").fsPath;
+        const source = path.relative(path.dirname(documentFs), linkFs);
+
+        const resolved = resolver.resolve(source, projectRootRelative);
+        if (resolved) {
+          link.target = vscodeUri.URI.file(resolved.path).toString();
+        }
+      }
+
+      return links;
+    },
+
+    dispose() {
+      htmlDocuments.dispose();
+    },
+  };
+}
+
+function setHtmlDataProviders(htmlLanguageService: LanguageService, htmlData: HTMLDataV1[]) {
+  htmlLanguageService.setDataProviders(false, [
+    {
+      getId() {
+        return FILE_PROTOCOL;
+      },
+      isApplicable(languageId) {
+        return languageId === "html";
+      },
+      provideValues(tag, attribute) {
+        const tags = htmlData.flatMap(data => data.tags?.filter(t => t.name === tag) ?? []);
+        const attributes = tags.flatMap(t => t.attributes?.filter(a => a.name === attribute) ?? []);
+        const globalAttributes = htmlData.flatMap(data => data.globalAttributes?.filter(a => a.name === attribute) ?? []);
+        const values = [...globalAttributes, ...attributes].flatMap(a => a.values ?? []);
+        return values;
+      },
+      provideTags() {
+        const tags = htmlData.flatMap(data => data.tags ?? []);
+        return tags;
+      },
+      provideAttributes(tag: string) {
+        const tags = htmlData.flatMap(data => data.tags?.filter(t => t.name === tag) ?? []);
+        const globalAttributes = htmlData.flatMap(data => data.globalAttributes ?? []);
+        const attributes = tags.flatMap(t => t.attributes ?? []);
+        return [...globalAttributes, ...attributes];
+      },
+    },
+  ]);
+}

package/src/modes/language-modes.ts

@@ -0,0 +1,217 @@
+import vscodeHtml from "vscode-html-languageservice";
+
+import { getLanguageModelCache } from "../language-model-cache.ts";
+import { getDocumentRegions } from "./embedded-support.ts";
+import { getHTMLMode } from "./html-mode.ts";
+
+import type { LanguageModelCache } from "../language-model-cache.ts";
+import type { FileSystemProvider } from "../requests.ts";
+import type { HTMLDocumentRegions } from "./embedded-support.ts";
+import type {
+  ClientCapabilities,
+  CompletionConfiguration,
+  DocumentContext,
+  HoverSettings,
+  HTMLDataV1,
+  IHTMLDataProvider,
+} from "vscode-html-languageservice";
+import type {
+  CompletionItem,
+  CompletionList,
+  DocumentLink,
+  Hover,
+  Position,
+  Range,
+  WorkspaceFolder,
+} from "vscode-languageserver";
+import type { TextDocument } from "vscode-languageserver-textdocument";
+
+export interface Settings {
+  hover?: HoverSettings;
+  autoClosingTags?: boolean;
+  completion?: CompletionConfiguration;
+  suggest?: CompletionConfiguration;
+}
+
+export interface Workspace {
+  readonly settings: Settings;
+  readonly folders: WorkspaceFolder[];
+}
+
+export interface SemanticTokenData {
+  start: Position;
+  length: number;
+  typeIdx: number;
+  modifierSet: number;
+}
+
+export type CompletionItemData = {
+  languageId: string;
+  uri: string;
+  offset: number;
+};
+
+export function isCompletionItemData(value: Record<string, unknown>): value is CompletionItemData {
+  return value && typeof value.languageId === "string" && typeof value.uri === "string" && typeof value.offset === "number";
+}
+
+export interface LanguageMode {
+  getId(): string;
+  doComplete?: (
+    document: TextDocument,
+    position: Position,
+    documentContext: DocumentContext,
+    htmlData: HTMLDataV1[]
+  ) => Promise<CompletionList>;
+  doResolve?: (document: TextDocument, item: CompletionItem) => Promise<CompletionItem>;
+  doHover?: (document: TextDocument, position: Position, htmlData: HTMLDataV1[]) => Promise<Hover | null>;
+  findDocumentLinks?: (document: TextDocument, documentContext: DocumentContext, projectRoot: string) => Promise<DocumentLink[]>;
+  onDocumentRemoved(document: TextDocument): void;
+  dispose(): void;
+}
+
+export interface LanguageModes {
+  updateDataProviders(dataProviders: IHTMLDataProvider[]): void;
+  getModeAtPosition(document: TextDocument, position: Position): LanguageMode | undefined;
+  getModesInRange(document: TextDocument, range: Range): LanguageModeRange[];
+  getAllModes(): LanguageMode[];
+  getAllModesInDocument(document: TextDocument): LanguageMode[];
+  getMode(languageId: string): LanguageMode | undefined;
+  onDocumentRemoved(document: TextDocument): void;
+  dispose(): void;
+}
+
+export interface LanguageModeRange extends Range {
+  mode: LanguageMode | undefined;
+  attributeValue?: boolean;
+}
+
+export const FILE_PROTOCOL = "staticbolt-server";
+
+export function getLanguageModes(clientCapabilities: ClientCapabilities, requestService: FileSystemProvider): LanguageModes {
+  const htmlLanguageService = vscodeHtml.getLanguageService({
+    clientCapabilities,
+    fileSystemProvider: requestService,
+    customDataProviders: [
+      {
+        getId() {
+          return FILE_PROTOCOL;
+        },
+        isApplicable(languageId) {
+          return languageId === "html";
+        },
+        provideValues(tag, attribute) {
+          return [{ name: `tag:${tag} attribute:${attribute}` }];
+        },
+        provideTags() {
+          return [{ name: "staticbolt", description: "# staticbolt-description", attributes: [] }];
+        },
+
+        provideAttributes(tag: string) {
+          if (tag === "staticbolt") {
+            return [
+              {
+                name: "staticbolt-attribute",
+                description: "# staticbolt-attribute-description",
+                values: [{ name: "staticbolt-attribute-value" }],
+              },
+            ];
+          }
+
+          return [{ name: "global-attribute" }];
+        },
+      },
+    ],
+    useDefaultDataProvider: false,
+  });
+
+  const documentRegions = getLanguageModelCache<HTMLDocumentRegions>(10, 60, document =>
+    getDocumentRegions(htmlLanguageService, document)
+  );
+
+  let modelCaches: LanguageModelCache<unknown>[] = [documentRegions];
+
+  let modes = Object.create(null) as { [languageId: string]: LanguageMode };
+  modes["html"] = getHTMLMode(htmlLanguageService);
+
+  return {
+    // eslint-disable-next-line @typescript-eslint/require-await
+    async updateDataProviders(dataProviders: IHTMLDataProvider[]): Promise<void> {
+      htmlLanguageService.setDataProviders(true, dataProviders);
+    },
+
+    getModeAtPosition(document: TextDocument, position: Position): LanguageMode | undefined {
+      const languageId = documentRegions.get(document).getLanguageAtPosition(position);
+      if (languageId) {
+        return modes[languageId];
+      }
+
+      return undefined;
+    },
+
+    getModesInRange(document: TextDocument, range: Range): LanguageModeRange[] {
+      return documentRegions
+        .get(document)
+        .getLanguageRanges(range)
+        .map((r): LanguageModeRange => {
+          return {
+            start: r.start,
+            end: r.end,
+            mode: r.languageId ? modes[r.languageId] : undefined,
+            attributeValue: r.attributeValue,
+          };
+        });
+    },
+
+    getAllModesInDocument(document: TextDocument): LanguageMode[] {
+      const result: LanguageMode[] = [];
+      for (const languageId of documentRegions.get(document).getLanguagesInDocument()) {
+        const mode = modes[languageId];
+        if (mode) {
+          result.push(mode);
+        }
+      }
+
+      return result;
+    },
+
+    getAllModes(): LanguageMode[] {
+      const result = [];
+      for (const languageId in modes) {
+        const mode = modes[languageId];
+        if (mode) {
+          result.push(mode);
+        }
+      }
+
+      return result;
+    },
+
+    getMode(languageId: string): LanguageMode {
+      return modes[languageId];
+    },
+
+    onDocumentRemoved(document: TextDocument) {
+      for (const mc of modelCaches) {
+        mc.onDocumentRemoved(document);
+      }
+
+      for (const mode in modes) {
+        modes[mode].onDocumentRemoved(document);
+      }
+    },
+
+    dispose(): void {
+      for (const mc of modelCaches) {
+        mc.dispose();
+      }
+
+      modelCaches = [];
+      for (const mode in modes) {
+        modes[mode].dispose();
+      }
+
+      modes = {};
+    },
+  };
+}