@stacksjs/stx-vscode 0.2.354 → 0.2.356

package/dist/contributes.json

@@ -41,8 +41,9 @@
       "category": "stx"
     },
     {
-      "command": "css.reload",
-      "title": "Css: Reload Configuration"
+      "command": "stx.reloadUtilityClasses",
+      "title": "Reload Utility Class Configuration",
+      "category": "stx"
     }
   ],
   "configuration": {
@@ -51,7 +52,7 @@
       "stxTypescriptPlugin.enabled": {
         "type": "boolean",
         "default": true,
-        "description": "Enable TypeScript language features in stx files"
+        "description": "Type-check the TypeScript in stx files (script blocks and template expressions) with the TypeScript server, and offer its hovers, completions and go to definition there"
       },
       "stx.diagnostics.enable": {
         "type": "boolean",
@@ -158,10 +159,11 @@
         "default": true,
         "description": "Enable autocomplete for utility classes"
       },
-      "css.remToPxRatio": {
+      "stx.utilityClasses.remToPxRatio": {
         "type": "number",
         "default": 16,
-        "description": "Rem to px conversion ratio for hover previews"
+        "minimum": 0,
+        "markdownDescription": "Pixels per `rem` for the px values utility-class hovers show next to `rem` values. `0` hides them. Replaces `css.remToPxRatio`, which is still read when this is not set."
       }
     }
   }

package/dist/index.d.ts

@@ -35,7 +35,7 @@ export interface StxLanguageOptions {
  * Register all of stx's runtime language support: hovers, completions,
  * diagnostics, go to definition, document links, folding, semantic tokens,
  * code actions, utility-class previews, and the `stx.sortClasses` and
- * `css.reload` commands. Everything is added to `context.subscriptions`.
+ * `stx.reloadUtilityClasses` commands. Everything is added to `context.subscriptions`.
  *
  * Call it at most once per window. The stx extension stands down only for
  * `Stacks.vscode-stacks`, and only once that extension's `activate` resolves

package/dist/index.js

@@ -21,8 +21,7 @@ function extractClassesFromDocument(document, position) {
   const text = document.getText();
   const matches = [];
   const classRegex = /class(?:Name)?=["']([^"']*)["']/g;
-  let match = classRegex.exec(text);
-  while (match !== null) {
+  for (let match = classRegex.exec(text);match !== null; match = classRegex.exec(text)) {
     const classContent = match[1];
     const classStartOffset = match.index + match[0].indexOf(classContent);
     if (position) {
@@ -44,7 +43,6 @@ function extractClassesFromDocument(document, position) {
         currentOffset = classIndex + className.length;
       }
     }
-    match = classRegex.exec(text);
   }
   return matches;
 }
@@ -574,12 +572,13 @@ var CSSGenerator, parseClass, builtInRules, cssLoaded = false;
 // ../vscode/src/ts-css/utils/css-parser.ts
 import parserCSS from "prettier/parser-postcss";
 import prettier from "prettier/standalone";
-function prettifyCSS(css) {
+async function prettifyCSS(css) {
   try {
-    return prettier.format(css, {
+    const formatted = await prettier.format(css, {
       parser: "css",
       plugins: [parserCSS]
-    }).trim();
+    });
+    return formatted.trim();
   } catch {
     return css;
   }
@@ -608,6 +607,17 @@ function addRemToPxComment(css, remToPxRatio = 16) {
 var init_css_parser = () => {};
 
 // ../vscode/src/ts-css/hover-provider.ts
+function remToPxRatio(vscodeModule) {
+  const settings = vscodeModule.workspace.getConfiguration("stx.utilityClasses");
+  const set = settings.inspect("remToPxRatio");
+  const configured = set?.workspaceFolderValue ?? set?.workspaceValue ?? set?.globalValue;
+  if (typeof configured === "number")
+    return configured;
+  const legacy = vscodeModule.workspace.getConfiguration("css").get("remToPxRatio");
+  if (typeof legacy === "number")
+    return legacy;
+  return settings.get("remToPxRatio", DEFAULT_REM_TO_PX_RATIO);
+}
 function createCssHoverProvider(vscodeModule, context) {
   return {
     async provideHover(document, position, _token) {
@@ -629,9 +639,8 @@ function createCssHoverProvider(vscodeModule, context) {
         if (!css) {
           return null;
         }
-        const remToPxRatio = vscodeModule.workspace.getConfiguration("css").get("remToPxRatio", 16);
-        const processedCSS = addRemToPxComment(css, remToPxRatio);
-        const prettyCSS = prettifyCSS(processedCSS);
+        const processedCSS = addRemToPxComment(css, remToPxRatio(vscodeModule));
+        const prettyCSS = await prettifyCSS(processedCSS);
         const markdown = new vscodeModule.MarkdownString;
         markdown.supportHtml = true;
         markdown.isTrusted = true;
@@ -647,6 +656,7 @@ function createCssHoverProvider(vscodeModule, context) {
     }
   };
 }
+var DEFAULT_REM_TO_PX_RATIO = 16;
 var init_hover_provider = __esm(() => {
   init_css_parser();
 });
@@ -749,11 +759,11 @@ async function activateCss(extensionContext) {
     await registerColorDecorations(vscode13, cssContext, extensionContext);
     const sortCommand = createSortClassesCommand(vscode13);
     extensionContext.subscriptions.push(sortCommand);
-    const reloadCommand = vscode13.commands.registerCommand("css.reload", async () => {
+    const reloadCommand = vscode13.commands.registerCommand("stx.reloadUtilityClasses", async () => {
       console.log("[ts-css] Reloading configuration...");
       const newConfig = await loadCssEngineConfig(vscode13);
       await cssContext?.reload(newConfig);
-      vscode13.window.showInformationMessage("Css configuration reloaded");
+      vscode13.window.showInformationMessage("Utility class configuration reloaded");
     });
     extensionContext.subscriptions.push(reloadCommand);
     console.log("[ts-css] Successfully activated utility class features");
@@ -6915,8 +6925,35 @@ async function stacksProvidesStx(api) {
   }
 }
 
+// ../vscode/src/ts-plugin-config.ts
+var TS_PLUGIN_NAME = "@stacksjs/stx-typescript-plugin";
+var TYPESCRIPT_EXTENSION_ID = "vscode.typescript-language-features";
+var TS_PLUGIN_SETTINGS = "stxTypescriptPlugin";
+function tsPluginConfiguration(api) {
+  return { enabled: api.workspace.getConfiguration(TS_PLUGIN_SETTINGS).get("enabled", true) };
+}
+async function configureTypeScriptPlugin(api, subscriptions) {
+  const extension = api.extensions.getExtension(TYPESCRIPT_EXTENSION_ID);
+  if (!extension)
+    return false;
+  const exports = extension.isActive ? extension.exports : await extension.activate();
+  const typescript = exports?.getAPI?.(0);
+  if (!typescript)
+    return false;
+  const send = () => typescript.configurePlugin(TS_PLUGIN_NAME, tsPluginConfiguration(api));
+  send();
+  subscriptions.push(api.workspace.onDidChangeConfiguration((event) => {
+    if (event.affectsConfiguration(TS_PLUGIN_SETTINGS))
+      send();
+  }));
+  return true;
+}
+
 // ../vscode/src/extension.ts
 async function activate(context) {
+  configureTypeScriptPlugin(vscode16, context.subscriptions).catch((error) => {
+    console.error("stx Extension - could not configure the TypeScript plugin:", error);
+  });
   if (await stacksProvidesStx(vscode16)) {
     console.log(`stx Extension - ${STACKS_EXTENSION_ID} provides stx support in this window; not registering it twice`);
     return;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@stacksjs/stx-vscode",
   "type": "module",
-  "version": "0.2.354",
+  "version": "0.2.356",
   "description": "stx language support for VS Code extensions to embed: the hovers, completions, diagnostics, grammar, snippets and language configuration behind the stx extension.",
   "author": "Chris Breuer <chris@stacksjs.org>",
   "license": "MIT",