ts-gem-plugin 0.0.5

package/dist/index.js

@@ -0,0 +1,970 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+
+// src/index.ts
+var import_typescript_template_language_service_decorator = require("@mantou/typescript-template-language-service-decorator");
+
+// src/decorate-html.ts
+var import_vscode_html_languageservice = require("vscode-html-languageservice");
+var import_emmet_helper = require("@vscode/emmet-helper");
+var import_vscode_css_languageservice = require("vscode-css-languageservice");
+
+// ../duoyun-ui/lib/types.js
+function isNullish(v) {
+  return v === null || v === void 0;
+}
+function isNotNullish(v) {
+  return !isNullish(v);
+}
+
+// ../gem/lib/utils.js
+var { assign, fromEntries, entries, keys } = Object;
+var LinkedList = class extends EventTarget {
+  #map = /* @__PURE__ */ new Map();
+  #firstItem;
+  #lastItem;
+  #delete(value) {
+    const existItem = this.#map.get(value);
+    if (existItem) {
+      if (existItem.prev) {
+        existItem.prev.next = existItem.next;
+      } else {
+        this.#firstItem = existItem.next;
+      }
+      if (existItem.next) {
+        existItem.next.prev = existItem.prev;
+      } else {
+        this.#lastItem = existItem.prev;
+      }
+      this.#map.delete(value);
+    }
+    return existItem;
+  }
+  get size() {
+    return this.#map.size;
+  }
+  get first() {
+    return this.#firstItem;
+  }
+  get last() {
+    return this.#lastItem;
+  }
+  isSuperLinkOf(subLink) {
+    let subItem = subLink.first;
+    if (!subItem)
+      return true;
+    let item = this.find(subItem.value);
+    while (item && item.value === subItem.value) {
+      subItem = subItem.next;
+      if (!subItem)
+        return true;
+      item = item.next;
+    }
+    return false;
+  }
+  find(value) {
+    return this.#map.get(value);
+  }
+  // 添加到尾部，已存在时会删除老的项目
+  // 如果是添加第一个，start 事件会在添加前触发，避免处理事件重复的逻辑
+  add(value) {
+    if (!this.#lastItem) {
+      this.dispatchEvent(new CustomEvent("start"));
+    }
+    const item = this.#delete(value) || { value };
+    item.prev = this.#lastItem;
+    if (item.prev) {
+      item.prev.next = item;
+    }
+    item.next = void 0;
+    this.#lastItem = item;
+    if (!this.#firstItem) {
+      this.#firstItem = item;
+    }
+    this.#map.set(value, item);
+  }
+  // 删除这个元素后没有其他元素时立即出发 end 事件
+  delete(value) {
+    const deleteItem = this.#delete(value);
+    if (!this.#firstItem) {
+      this.dispatchEvent(new CustomEvent("end"));
+    }
+    return deleteItem;
+  }
+  // 获取头部元素
+  // 会从链表删除
+  get() {
+    const firstItem = this.#firstItem;
+    if (!firstItem)
+      return;
+    this.delete(firstItem.value);
+    return firstItem.value;
+  }
+};
+function kebabToCamelCase(str) {
+  return str.replace(/-(.)/g, (_substr, $1) => $1.toUpperCase());
+}
+
+// src/utils.ts
+var vscode = __toESM(require("vscode-languageserver-types"));
+var import_vscode_languageserver_textdocument = require("vscode-languageserver-textdocument");
+function isCustomElement(tag) {
+  return tag.includes("-");
+}
+function isDepElement(node) {
+  return node.getSourceFile().fileName.includes("/node_modules/");
+}
+var openTagReg = /(?<prefix><)(?<tag>\w+-\w+)\s+/g;
+function forEachTag(typescript, containerNode, fn) {
+  const list = [containerNode];
+  while (true) {
+    const currentNode = list.pop();
+    if (!currentNode) return;
+    typescript.forEachChild(currentNode, (node) => {
+      list.push(node);
+      if (typescript.isTemplateHead(node) || typescript.isTemplateMiddle(node) || typescript.isTemplateTail(node) || typescript.isNoSubstitutionTemplateLiteral(node)) {
+        [...node.text.matchAll(openTagReg)].forEach((e) => {
+          const { prefix = "", tag } = e.groups;
+          const start = node.getStart() + 1 + prefix.length + e.index;
+          fn({ tag, length: tag.length, start });
+        });
+      }
+    });
+  }
+}
+function getHTMLTextAtPosition(text, offset) {
+  const before = text.slice(0, offset).match(/[^ \n<>]+$/)?.at(0) || "";
+  const after = text.slice(offset).match(/^[^ \n<>]+/)?.at(0) || "";
+  const str = before + after;
+  return {
+    text: str,
+    start: offset - before.length,
+    length: str.length
+  };
+}
+var attrMap = {
+  ".": "property",
+  "?": "boolean",
+  "@": "event"
+};
+function getAttrName(text) {
+  const attr = text.split("=").at(0);
+  const char = attr.at(0);
+  if (char in attrMap) {
+    return { attr: attr.slice(1), type: attrMap[char] };
+  }
+  return { attr };
+}
+function getCustomElementTag(typescript, node, isDep = isDepElement(node)) {
+  if (!typescript.isClassDeclaration(node)) return;
+  for (const modifier of node.modifiers || []) {
+    if (typescript.isDecorator(modifier) && typescript.isCallExpression(modifier.expression) && modifier.expression.expression.getText() === "customElement") {
+      const arg = modifier.expression.arguments.at(0);
+      if (arg && typescript.isStringLiteral(arg)) {
+        return arg.text;
+      }
+    }
+  }
+  if (isDep && node.name && typescript.isIdentifier(node.name)) {
+    const name = node.name.text;
+    if (name.endsWith("Element")) {
+      return name;
+    }
+  }
+}
+function getDocComment(typescript, declaration) {
+  const fullText = declaration.getSourceFile().getFullText();
+  const commentRanges = typescript.getLeadingCommentRanges(fullText, declaration.getFullStart());
+  const commentStrings = commentRanges?.filter(({ kind }) => kind === typescript.SyntaxKind.MultiLineCommentTrivia).map(({ pos, end }) => fullText.slice(pos, end));
+  return commentStrings?.join("\n");
+}
+function getAstNodeAtPosition(typescript, node, pos) {
+  if (node.pos > pos || node.end <= pos) return;
+  while (node.kind >= typescript.SyntaxKind.FirstNode) {
+    const nested = typescript.forEachChild(node, (child) => child.pos <= pos && child.end > pos ? child : void 0);
+    if (nested === void 0) break;
+    node = nested;
+  }
+  return node;
+}
+var marker = Symbol();
+function decorate(origin, cb) {
+  if (origin[marker]) return origin;
+  const result = cb(origin);
+  result[marker] = true;
+  return result;
+}
+function createVirtualDocument(languageId, content) {
+  return import_vscode_languageserver_textdocument.TextDocument.create(`embedded://document.${languageId}`, languageId, 1, content);
+}
+function getSubstitution(templateString, start, end) {
+  return templateString.slice(start, end).replaceAll(/[^\n]/g, "_");
+}
+function isValidCSSTemplate(typescript, node, callName) {
+  switch (node.kind) {
+    case typescript.SyntaxKind.NoSubstitutionTemplateLiteral:
+    case typescript.SyntaxKind.TemplateExpression:
+      const parent = node.parent;
+      if (typescript.isCallExpression(parent) && parent.expression.getText() === callName) {
+        return true;
+      }
+      if (typescript.isPropertyAssignment(parent)) {
+        const call = parent.parent.parent;
+        if (typescript.isCallExpression(call) && call.expression.getText() === callName) {
+          return true;
+        }
+      }
+      return false;
+    default:
+      return false;
+  }
+}
+function translateCompletionItemsToCompletionInfo(context, items) {
+  return {
+    defaultCommitCharacters: [],
+    isGlobalCompletion: false,
+    isMemberCompletion: false,
+    isNewIdentifierLocation: false,
+    entries: items.items.map((x) => translateCompletionEntry(context, x))
+  };
+}
+function translateCompletionEntry(context, vsItem) {
+  const entry = {
+    name: vsItem.label,
+    kind: translationCompletionItemKind(context, vsItem.kind),
+    sortText: "0",
+    filterText: vsItem.label,
+    labelDetails: { description: vsItem.detail }
+  };
+  if (vsItem.textEdit) {
+    entry.isSnippet = vsItem.insertTextFormat === vscode.InsertTextFormat.Snippet || void 0;
+    entry.insertText = vsItem.textEdit.newText;
+    entry.replacementSpan = "range" in vsItem.textEdit ? toTsSpan(context, vsItem.textEdit.range) : void 0;
+  }
+  return entry;
+}
+function translationCompletionItemKind(context, kind) {
+  const typescript = context.typescript;
+  switch (kind) {
+    case vscode.CompletionItemKind.Method:
+      return typescript.ScriptElementKind.memberFunctionElement;
+    case vscode.CompletionItemKind.Function:
+      return typescript.ScriptElementKind.functionElement;
+    case vscode.CompletionItemKind.Constructor:
+      return typescript.ScriptElementKind.constructorImplementationElement;
+    case vscode.CompletionItemKind.Field:
+    case vscode.CompletionItemKind.Variable:
+      return typescript.ScriptElementKind.variableElement;
+    case vscode.CompletionItemKind.Class:
+      return typescript.ScriptElementKind.classElement;
+    case vscode.CompletionItemKind.Interface:
+      return typescript.ScriptElementKind.interfaceElement;
+    case vscode.CompletionItemKind.Module:
+      return typescript.ScriptElementKind.moduleElement;
+    case vscode.CompletionItemKind.Property:
+      return typescript.ScriptElementKind.memberVariableElement;
+    case vscode.CompletionItemKind.Unit:
+    case vscode.CompletionItemKind.Value:
+      return typescript.ScriptElementKind.constElement;
+    case vscode.CompletionItemKind.Enum:
+      return typescript.ScriptElementKind.enumElement;
+    case vscode.CompletionItemKind.Keyword:
+      return typescript.ScriptElementKind.keyword;
+    case vscode.CompletionItemKind.Color:
+      return typescript.ScriptElementKind.constElement;
+    case vscode.CompletionItemKind.Reference:
+      return typescript.ScriptElementKind.alias;
+    case vscode.CompletionItemKind.File:
+      return typescript.ScriptElementKind.moduleElement;
+    case vscode.CompletionItemKind.Snippet:
+    case vscode.CompletionItemKind.Text:
+    default:
+      return typescript.ScriptElementKind.unknown;
+  }
+}
+function toTsSpan(context, range) {
+  const editStart = context.toOffset(range.start);
+  const editEnd = context.toOffset(range.end);
+  return {
+    start: editStart,
+    length: editEnd - editStart
+  };
+}
+function translateHover(context, hover, position, offset = 0) {
+  const typescript = context.typescript;
+  const header = [];
+  const docs = [];
+  const convertPart = (hoverContents) => {
+    if (typeof hoverContents === "string") {
+      docs.push({ kind: "unknown", text: hoverContents });
+    } else if (Array.isArray(hoverContents)) {
+      hoverContents.forEach(convertPart);
+    } else if ("language" in hoverContents && hoverContents.language === "html") {
+      header.push({ kind: "unknown", text: hoverContents.value });
+    } else {
+      docs.push({ kind: "unknown", text: hoverContents.value });
+    }
+  };
+  convertPart(hover.contents);
+  const start = context.toOffset(hover.range ? hover.range.start : position);
+  return {
+    kind: typescript.ScriptElementKind.string,
+    kindModifiers: "",
+    textSpan: {
+      start: start - offset,
+      length: hover.range ? context.toOffset(hover.range.end) - start : 1
+    },
+    displayParts: header,
+    documentation: docs,
+    tags: []
+  };
+}
+function translateCompletionItemsToCompletionEntryDetails(context, item) {
+  return {
+    name: item.label,
+    kindModifiers: "declare",
+    kind: item.kind ? translationCompletionItemKind(context, item.kind) : context.typescript.ScriptElementKind.unknown,
+    displayParts: toDisplayParts(item.detail),
+    documentation: toDisplayParts(item.documentation, true),
+    tags: []
+  };
+}
+function genDefaultCompletionEntryDetails(context, name) {
+  return {
+    name,
+    kindModifiers: "",
+    kind: context.typescript.ScriptElementKind.unknown,
+    displayParts: toDisplayParts(name),
+    documentation: [],
+    tags: []
+  };
+}
+function toDisplayParts(text, isDoc = false) {
+  if (!text) return [];
+  const escape = (unsafe) => unsafe.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll('"', "&quot;").replaceAll("'", "&#39;").replaceAll(" ", "&nbsp;").replaceAll("\n", "  \n").replaceAll("	", "&emsp;");
+  return [
+    {
+      kind: "unknown",
+      text: typeof text !== "string" ? text.value : isDoc ? escape(text) : text
+    }
+  ];
+}
+
+// ../duoyun-ui/lib/cache.js
+var Cache = class {
+  #max;
+  #maxAge;
+  #renewal;
+  #map = /* @__PURE__ */ new Map();
+  #reverseMap = /* @__PURE__ */ new Map();
+  #linkedList = new LinkedList();
+  constructor({ max = Infinity, maxAge = Infinity, renewal = false } = {}) {
+    this.#max = max;
+    this.#maxAge = maxAge;
+    this.#renewal = renewal;
+  }
+  #trim() {
+    for (let i = this.#linkedList.size - this.#max; i > 0; i--) {
+      const value = this.#linkedList.get();
+      const key = this.#reverseMap.get(value);
+      this.#reverseMap.delete(value);
+      this.#map.delete(key);
+    }
+  }
+  set(key, value) {
+    this.#linkedList.add(value);
+    this.#reverseMap.set(value, key);
+    this.#map.set(key, { value, timestamp: Date.now() });
+    this.#trim();
+    return value;
+  }
+  get(key, init) {
+    const cache = this.#map.get(key);
+    if (!cache) {
+      return init && this.set(key, init(key));
+    }
+    const { timestamp, value } = cache;
+    if (Date.now() - timestamp > this.#maxAge) {
+      this.#linkedList.delete(value);
+      this.#reverseMap.delete(value);
+      this.#map.delete(key);
+      return init && this.set(key, init(key));
+    }
+    if (this.#renewal) {
+      cache.timestamp = Date.now();
+    }
+    this.#linkedList.get();
+    this.#linkedList.add(value);
+    return value;
+  }
+};
+
+// src/cache.ts
+var LRUCache = class {
+  #bucket = new Cache({ max: 100, renewal: true });
+  #genKey(context, position) {
+    return [context.fileName, position?.line, position?.character, context.text].join(";");
+  }
+  getCached(context, position) {
+    return this.#bucket.get(this.#genKey(context, position));
+  }
+  updateCached(context, posOrContent, contentOrUndefined) {
+    let position;
+    let content;
+    if ("line" in posOrContent && "character" in posOrContent) {
+      position = posOrContent;
+      content = contentOrUndefined;
+    } else {
+      position = void 0;
+      content = posOrContent;
+    }
+    return this.#bucket.set(this.#genKey(context, position), content);
+  }
+};
+
+// src/decorate-html.ts
+var HTMLLanguageService = class {
+  #completionsCache = new LRUCache();
+  #diagnosticsCache = new LRUCache();
+  #cssLanguageService;
+  #htmlLanguageService;
+  #ctx;
+  constructor(ctx) {
+    this.#ctx = ctx;
+    const ts = ctx.ts;
+    const htmlDataProvider = (0, import_vscode_html_languageservice.getDefaultHTMLDataProvider)();
+    const provideTags = htmlDataProvider.provideTags.bind(htmlDataProvider);
+    htmlDataProvider.provideTags = () => {
+      const result = [...ctx.elements].map(([tag, node]) => ({
+        name: tag,
+        attributes: [],
+        description: getDocComment(ts, node)
+      })).filter(isNotNullish);
+      return [...result, ...provideTags()];
+    };
+    const provideAttributes = htmlDataProvider.provideAttributes.bind(htmlDataProvider);
+    htmlDataProvider.provideAttributes = (tag) => {
+      const typeChecker = ctx.getProgram().getTypeChecker();
+      const node = ctx.elements.get(tag);
+      const isDep = node && isDepElement(node);
+      const props = node && typeChecker.getTypeAtLocation(node).getApparentProperties();
+      const result = (props || []).map((e) => {
+        const declaration = e.getDeclarations()?.at(0);
+        const prop = declaration && ts.isPropertyDeclaration(declaration);
+        if (!prop) return;
+        const hasPropDecorator = declaration.modifiers?.some(
+          (m) => ts.isDecorator(m) && ts.isIdentifier(m.expression)
+        );
+        if (!hasPropDecorator && !isDep) return;
+        const type = declaration.type && typeChecker.getTypeFromTypeNode(declaration.type);
+        return {
+          name: type === typeChecker.getBooleanType() ? e.name : `.${e.name}`,
+          description: getDocComment(ts, declaration),
+          valueSet: "v"
+        };
+      }).filter(isNotNullish);
+      return [...result, ...provideAttributes(isCustomElement(tag) ? "div" : tag)];
+    };
+    this.#htmlLanguageService = (0, import_vscode_html_languageservice.getLanguageService)({ customDataProviders: [htmlDataProvider] });
+    this.#cssLanguageService = (0, import_vscode_css_languageservice.getCSSLanguageService)({ useDefaultDataProvider: true });
+  }
+  #getAllCssDoc(doc) {
+    const styles = [];
+    const nodes = [...doc.roots];
+    while (true) {
+      const node = nodes.pop();
+      if (!node) break;
+      if (node.tag === "style") styles.push(node);
+      nodes.push(...node.children);
+    }
+    return styles;
+  }
+  #getCssDoc(context, position, doc) {
+    const node = doc.findNodeAt(context.toOffset(position));
+    if (node.tag !== "style") return;
+    const virtualDocument = createVirtualDocument("css", context.text.slice(node.startTagEnd, node.endTagStart));
+    const style = this.#cssLanguageService.parseStylesheet(virtualDocument);
+    const offset = context.toOffset(position) - node.startTagEnd;
+    const toPosition = (pos) => context.toPosition(virtualDocument.offsetAt(pos) + node.startTagEnd);
+    return {
+      style,
+      virtualDocument,
+      position: virtualDocument.positionAt(offset),
+      updateRange: (range) => ({
+        start: toPosition(range.start),
+        end: toPosition(range.end)
+      })
+    };
+  }
+  #getCSSCompletionsAtPosition(context, position, doc) {
+    const css = this.#getCssDoc(context, position, doc);
+    if (!css) return [];
+    let emmetResults;
+    this.#cssLanguageService.setCompletionParticipants([
+      {
+        onCssProperty: () => {
+          emmetResults = (0, import_emmet_helper.doComplete)(css.virtualDocument, css.position, "css", this.#ctx.config.emmet);
+        }
+      }
+    ]);
+    const completions = this.#cssLanguageService.doComplete(css.virtualDocument, css.position, css.style);
+    completions.items.push(...emmetResults?.items || []);
+    return completions.items.map((e) => ({
+      ...e,
+      textEdit: e.textEdit && "range" in e.textEdit ? {
+        newText: e.textEdit.newText,
+        range: css.updateRange(e.textEdit.range)
+      } : e.textEdit
+    }));
+  }
+  #getCompletionsAtPosition(context, position) {
+    const cached = this.#completionsCache.getCached(context, position);
+    if (cached) return cached;
+    const virtualDocument = createVirtualDocument("html", context.text);
+    const vHtml = this.#htmlLanguageService.parseHTMLDocument(virtualDocument);
+    let emmetResults;
+    this.#htmlLanguageService.setCompletionParticipants([
+      {
+        onHtmlContent: () => {
+          emmetResults = (0, import_emmet_helper.doComplete)(virtualDocument, position, "html", this.#ctx.config.emmet);
+        }
+      }
+    ]);
+    const completions = this.#htmlLanguageService.doComplete(virtualDocument, position, vHtml);
+    completions.items.push(...emmetResults?.items || []);
+    completions.items.push(...this.#getCSSCompletionsAtPosition(context, position, vHtml));
+    return this.#completionsCache.updateCached(context, position, completions);
+  }
+  getCompletionsAtPosition(context, position) {
+    return translateCompletionItemsToCompletionInfo(context, this.#getCompletionsAtPosition(context, position));
+  }
+  getCompletionEntryDetails(context, position, name) {
+    const completions = this.#getCompletionsAtPosition(context, position);
+    const item = completions.items.find((e) => e.label === name);
+    if (!item) return genDefaultCompletionEntryDetails(context, name);
+    return translateCompletionItemsToCompletionEntryDetails(context, item);
+  }
+  #getCSSQuickInfoAtPosition(context, position, doc) {
+    const css = this.#getCssDoc(context, position, doc);
+    const hover = css && this.#cssLanguageService.doHover(css.virtualDocument, css.position, css.style, {
+      documentation: true,
+      references: true
+    });
+    return hover && {
+      ...hover,
+      range: hover.range && css.updateRange(hover.range)
+    };
+  }
+  getQuickInfoAtPosition(context, position) {
+    const virtualDocument = createVirtualDocument("html", context.text);
+    const vHtml = this.#htmlLanguageService.parseHTMLDocument(virtualDocument);
+    const hover = this.#htmlLanguageService.doHover(virtualDocument, position, vHtml, {
+      documentation: true,
+      references: true
+    }) || this.#getCSSQuickInfoAtPosition(context, position, vHtml);
+    if (!hover) return;
+    return translateHover(context, hover, position);
+  }
+  getSyntacticDiagnostics(context) {
+    const cached = this.#diagnosticsCache.getCached(context);
+    if (cached) return cached;
+    const virtualDocument = createVirtualDocument("html", context.text);
+    const vHtml = this.#htmlLanguageService.parseHTMLDocument(virtualDocument);
+    const styles = this.#getAllCssDoc(vHtml);
+    const file = this.#ctx.getProgram().getSourceFile(context.fileName);
+    return this.#diagnosticsCache.updateCached(
+      context,
+      styles.map((node) => {
+        const textDocument = createVirtualDocument("css", context.text.slice(node.startTagEnd, node.endTagStart));
+        const vCss = this.#cssLanguageService.parseStylesheet(textDocument);
+        const oDiagnostics = this.#cssLanguageService.doValidation(textDocument, vCss);
+        return oDiagnostics.map(({ message, range }) => {
+          const start = node.startTagEnd + textDocument.offsetAt(range.start);
+          const end = node.startTagEnd + textDocument.offsetAt(range.end);
+          return {
+            category: context.typescript.DiagnosticCategory.Warning,
+            code: 0,
+            file,
+            start,
+            length: end - start,
+            messageText: message
+          };
+        });
+      }).flat()
+    );
+  }
+  getDefinitionAndBoundSpan(context, position) {
+    const htmlOffset = context.node.pos + 1;
+    const virtualDocument = createVirtualDocument("html", context.text);
+    const vHtml = this.#htmlLanguageService.parseHTMLDocument(virtualDocument);
+    const offset = context.toOffset(position);
+    const node = vHtml.findNodeAt(offset);
+    const { text, start, length } = getHTMLTextAtPosition(context.text, offset);
+    const definitionNode = this.#ctx.elements.get(node.tag);
+    if (!definitionNode || node.tag === "style" || offset > node.startTagEnd || !text) {
+      return { textSpan: { start, length } };
+    }
+    if (text === node.tag) {
+      return {
+        textSpan: { start, length },
+        definitions: [
+          {
+            containerName: "Custom Element",
+            containerKind: context.typescript.ScriptElementKind.unknown,
+            name: definitionNode.name.text,
+            kind: context.typescript.ScriptElementKind.classElement,
+            fileName: definitionNode.getSourceFile().fileName,
+            textSpan: {
+              start: definitionNode.name.getStart() - htmlOffset,
+              length: definitionNode.name.text.length
+            }
+          }
+        ]
+      };
+    }
+    const { attr, type } = getAttrName(text);
+    const typeChecker = this.#ctx.getProgram().getTypeChecker();
+    const propSymbol = typeChecker.getTypeAtLocation(definitionNode).getProperty(kebabToCamelCase(attr));
+    const propDeclaration = propSymbol?.getDeclarations()?.at(0);
+    return {
+      textSpan: { start: type ? start + 1 : start, length: attr.length },
+      definitions: !propDeclaration ? void 0 : [
+        {
+          containerName: "Attribute",
+          containerKind: context.typescript.ScriptElementKind.unknown,
+          name: propDeclaration.getText(),
+          kind: context.typescript.ScriptElementKind.memberVariableElement,
+          fileName: propDeclaration.getSourceFile().fileName,
+          textSpan: {
+            start: propDeclaration.getStart() - htmlOffset,
+            length: propDeclaration.getText().length
+          }
+        }
+      ]
+    };
+  }
+};
+
+// src/decorate-ts.ts
+function decorateTypeChecker(ctx, typeChecker) {
+  const fn = typeChecker.isValidPropertyAccessForCompletions.bind(typeChecker);
+  typeChecker.isValidPropertyAccessForCompletions = (...args) => {
+    const result = fn(...args);
+    if (!result) return false;
+    try {
+      const { declarations } = args.at(2);
+      if (!declarations) return true;
+      const isNever = declarations.every(
+        (node) => ctx.ts.isPropertySignature(node) && node.type?.getText() === "never"
+      );
+      return !isNever;
+    } catch {
+      return true;
+    }
+  };
+  return typeChecker;
+}
+function updateElement(ctx, file) {
+  const isDep = isDepElement(file);
+  ctx.ts.forEachChild(file, (node) => {
+    const tag = getCustomElementTag(ctx.ts, node, isDep);
+    if (tag && ctx.ts.isClassDeclaration(node)) {
+      ctx.elements.set(tag, node);
+    }
+  });
+}
+function decorateLanguageService(ctx, languageService) {
+  const { ts, getProgram } = ctx;
+  const ls = Object.fromEntries(
+    Object.entries(languageService).map(([key, value]) => [key, value.bind(languageService)])
+  );
+  languageService.getCompletionsAtPosition = (...args) => {
+    const program = getProgram();
+    const typeChecker = program.getTypeChecker();
+    decorate(typeChecker, () => decorateTypeChecker(ctx, typeChecker));
+    return ls.getCompletionsAtPosition(...args);
+  };
+  languageService.findReferences = (...args) => {
+    const program = getProgram();
+    const result = [];
+    const currentNode = getAstNodeAtPosition(ts, program.getSourceFile(args[0]), args[1]);
+    const currentTag = currentNode && getCustomElementTag(ts, currentNode.parent);
+    for (const file of program.getSourceFiles()) {
+      const references = [];
+      forEachTag(ts, file, ({ tag, length, start }) => {
+        if (tag !== currentTag) return;
+        references.push({
+          fileName: file.fileName,
+          isWriteAccess: true,
+          textSpan: { start, length }
+        });
+      });
+      if (!references.length) continue;
+      result.push({
+        references,
+        definition: {
+          containerKind: ctx.ts.ScriptElementKind.unknown,
+          containerName: "",
+          displayParts: [],
+          fileName: file.fileName,
+          textSpan: { start: 0, length: 0 },
+          name: "test",
+          kind: ctx.ts.ScriptElementKind.unknown
+        }
+      });
+    }
+    return [...result, ...ls.findReferences(...args) || []];
+  };
+  languageService.getSuggestionDiagnostics = (...args) => {
+    const program = getProgram();
+    decorate(program, () => {
+      program.getSourceFiles().forEach((file2) => updateElement(ctx, file2));
+      return program;
+    });
+    const file = program.getSourceFile(args[0]);
+    const result = ls.getSuggestionDiagnostics(...args);
+    updateElement(ctx, file);
+    return result.filter(({ start, reportsUnnecessary, category }) => {
+      if (!reportsUnnecessary || category !== ts.DiagnosticCategory.Suggestion) return true;
+      const node = getAstNodeAtPosition(ts, file, start);
+      if (!node || !ts.isPrivateIdentifier(node)) return true;
+      const declaration = node.parent;
+      if (!ts.isMethodDeclaration(declaration) && !ts.isPropertyDeclaration(declaration)) return true;
+      return !declaration.modifiers?.some((e) => e?.kind === ts.SyntaxKind.Decorator);
+    });
+  };
+  return languageService;
+}
+
+// src/configuration.ts
+var defaultConfiguration = {
+  emmet: {},
+  tags: ["html", "raw"],
+  format: {
+    enabled: true
+  }
+};
+var Configuration = class {
+  #emmet = defaultConfiguration.emmet;
+  #format = defaultConfiguration.format;
+  #tags = defaultConfiguration.tags;
+  update(config) {
+    this.#format = Object.assign({}, defaultConfiguration.format, config.format || {});
+    this.#tags = config.tags || defaultConfiguration.tags;
+  }
+  get emmet() {
+    return this.#emmet;
+  }
+  get format() {
+    return this.#format;
+  }
+  get tags() {
+    return this.#tags;
+  }
+};
+var Store = class {
+  #map = /* @__PURE__ */ new Map();
+  #weakMap = /* @__PURE__ */ new WeakMap();
+  #registry = new FinalizationRegistry((key) => this.#map.delete(key));
+  set(key, val) {
+    this.#map.set(key, new WeakRef(val));
+    this.#weakMap.set(val, key);
+    this.#registry.register(val, key);
+  }
+  get(key) {
+    return this.#map.get(key)?.deref();
+  }
+  findKey(val) {
+    return this.#weakMap.get(val);
+  }
+  *[Symbol.iterator]() {
+    const entries2 = this.#map.entries();
+    for (const [tag, ref] of entries2) {
+      yield [tag, ref.deref()];
+    }
+  }
+};
+
+// src/decorate-css.ts
+var import_vscode_css_languageservice2 = require("vscode-css-languageservice");
+var import_emmet_helper2 = require("@vscode/emmet-helper");
+var CSSLanguageService = class {
+  #completionsCache = new LRUCache();
+  #diagnosticsCache = new LRUCache();
+  #cssLanguageService = (0, import_vscode_css_languageservice2.getCSSLanguageService)();
+  #ctx;
+  constructor(ctx) {
+    this.#ctx = ctx;
+  }
+  #normalize = (context, position) => {
+    const parent = context.node.parent;
+    const tag = context.typescript.isTaggedTemplateExpression(parent) && parent.tag.getText();
+    if (context.typescript.isPropertyAssignment(parent) || tag === "styled") {
+      const appendBefore = ".parent { ";
+      const appendAfter = " }";
+      return {
+        offset: appendBefore.length,
+        text: `${appendBefore}${context.text}${appendAfter}`,
+        pos: {
+          line: position.line,
+          character: position.line === 0 ? position.character + appendBefore.length : position.character
+        }
+      };
+    }
+    return {
+      offset: 0,
+      text: context.text,
+      pos: { ...position }
+    };
+  };
+  #getCompletionsAtPosition(context, position) {
+    const cached = this.#completionsCache.getCached(context, position);
+    if (cached) return cached;
+    const { text, pos } = this.#normalize(context, position);
+    const virtualDocument = createVirtualDocument("css", text);
+    const vCss = this.#cssLanguageService.parseStylesheet(virtualDocument);
+    let emmetResults;
+    this.#cssLanguageService.setCompletionParticipants([
+      {
+        onCssProperty: () => {
+          emmetResults = (0, import_emmet_helper2.doComplete)(virtualDocument, pos, "css", this.#ctx.config.emmet);
+        }
+      }
+    ]);
+    const completions = this.#cssLanguageService.doComplete(virtualDocument, pos, vCss);
+    completions.items.push(...emmetResults?.items || []);
+    return this.#completionsCache.updateCached(context, position, completions);
+  }
+  getCompletionsAtPosition(context, position) {
+    return translateCompletionItemsToCompletionInfo(context, this.#getCompletionsAtPosition(context, position));
+  }
+  getCompletionEntryDetails(context, position, name) {
+    const completions = this.#getCompletionsAtPosition(context, position);
+    const item = completions.items.find((e) => e.label === name);
+    if (!item) return genDefaultCompletionEntryDetails(context, name);
+    return translateCompletionItemsToCompletionEntryDetails(context, item);
+  }
+  getQuickInfoAtPosition(context, position) {
+    const { text, pos } = this.#normalize(context, position);
+    const virtualDocument = createVirtualDocument("css", text);
+    const vCss = this.#cssLanguageService.parseStylesheet(virtualDocument);
+    const hover = this.#cssLanguageService.doHover(virtualDocument, pos, vCss, {
+      documentation: true,
+      references: true
+    });
+    if (!hover) return;
+    return translateHover(context, hover, position, pos.character - position.character);
+  }
+  getSyntacticDiagnostics(context) {
+    const cached = this.#diagnosticsCache.getCached(context);
+    if (cached) return cached;
+    const { text, offset } = this.#normalize(context, { line: 0, character: 0 });
+    const virtualDocument = createVirtualDocument("css", text);
+    const vCss = this.#cssLanguageService.parseStylesheet(virtualDocument);
+    const oDiagnostics = this.#cssLanguageService.doValidation(virtualDocument, vCss);
+    const file = this.#ctx.getProgram().getSourceFile(context.fileName);
+    return this.#diagnosticsCache.updateCached(
+      context,
+      oDiagnostics.map(({ message, range }) => {
+        const start = context.toOffset(range.start);
+        return {
+          category: context.typescript.DiagnosticCategory.Warning,
+          code: 0,
+          file,
+          start: range.start.line === 0 ? start - offset : start,
+          length: context.toOffset(range.end) - start,
+          messageText: message
+        };
+      })
+    );
+  }
+};
+
+// src/index.ts
+var LanguageServiceLogger = class {
+  #info;
+  constructor(info) {
+    this.#info = info;
+  }
+  log(msg) {
+    this.#info.project.projectService.logger.info(`[gem] ${msg}`);
+  }
+};
+var HtmlPlugin = class {
+  #ts;
+  #config = new Configuration();
+  constructor(typescript) {
+    this.#ts = typescript;
+  }
+  create(info) {
+    return decorate(info.languageService, () => {
+      const logger = new LanguageServiceLogger(info);
+      logger.log("Starting ts-gem-plugin...");
+      this.#config.update(info.config);
+      const context = {
+        config: this.#config,
+        ts: this.#ts,
+        logger,
+        elements: new Store(),
+        getProgram: () => {
+          return info.languageService.getProgram();
+        },
+        getProject: () => {
+          return info.project;
+        }
+      };
+      const decoratedService = decorateLanguageService(context, info.languageService);
+      const decoratedService1 = (0, import_typescript_template_language_service_decorator.decorateWithTemplateLanguageService)(
+        this.#ts,
+        decoratedService,
+        info.project,
+        new CSSLanguageService(context),
+        {
+          tags: ["styled", "css"],
+          enableForStringWithSubstitutions: true,
+          getSubstitution,
+          isValidTemplate: (node) => isValidCSSTemplate(this.#ts, node, "css")
+        },
+        { logger }
+      );
+      return (0, import_typescript_template_language_service_decorator.decorateWithTemplateLanguageService)(
+        this.#ts,
+        decoratedService1,
+        info.project,
+        new HTMLLanguageService(context),
+        {
+          tags: ["html", "raw", "h"],
+          enableForStringWithSubstitutions: true,
+          getSubstitution
+        },
+        { logger }
+      );
+    });
+  }
+  onConfigurationChanged(config) {
+    this.#config.update(config);
+  }
+};
+module.exports = (mod) => new HtmlPlugin(mod.typescript);
+//# sourceMappingURL=index.js.map

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "ts-gem-plugin",
+  "version": "0.0.5",
+  "description": "Typescript language service plugin for Gem",
+  "keywords": [
+    "gem",
+    "typescript-language-service"
+  ],
+  "main": "dist/index.js",
+  "files": [],
+  "scripts": {
+    "build": "esbuild ./src/index.ts --outdir=./dist --platform=node --sourcemap --bundle --external:@vscode/* --external:@mantou/typescript-* --external:vscode-*",
+    "start": "pnpm run build --watch",
+    "prepublishOnly": "pnpm run build"
+  },
+  "dependencies": {
+    "@mantou/gem": "^2.2.0",
+    "@mantou/typescript-template-language-service-decorator": "^2.3.2",
+    "@vscode/emmet-helper": "^2.9.3",
+    "duoyun-ui": "^2.2.0",
+    "vscode-css-languageservice": "^6.3.1",
+    "vscode-html-languageservice": "^5.3.1",
+    "vscode-languageserver-textdocument": "^1.0.12",
+    "vscode-languageserver-types": "^3.17.5"
+  },
+  "devDependencies": {
+    "@gemjs/config": "^2.1.0",
+    "typescript": "^5.6.2"
+  },
+  "author": "mantou132",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/mantou132/gem.git",
+    "directory": "packages/ts-gem-plugin"
+  },
+  "bugs": {
+    "url": "https://github.com/mantou132/gem/issues"
+  },
+  "homepage": "https://github.com/mantou132/gem#readme"
+}