feat: Add CSS support via malva

CHANGELOG.md

@@ -4,6 +4,11 @@ All notable changes to the "wasm-fmt" extension will be documented in this file.
 
 Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how to structure this file.
 
+## [0.3.0]
+Introduce new formatter: malva
+
+CSS/SCSS/SASS/LESS are supported.
+
 ## [0.2.3]
 tune c/cpp default style
 

package.json

@@ -21,18 +21,22 @@
 		"onLanguage:c",
 		"onLanguage:cpp",
 		"onLanguage:csharp",
+		"onLanguage:css",
 		"onLanguage:go",
 		"onLanguage:java",
 		"onLanguage:javascript",
 		"onLanguage:javascriptreact",
 		"onLanguage:json",
 		"onLanguage:jsonc",
+		"onLanguage:less",
 		"onLanguage:objective-c",
 		"onLanguage:objective-cpp",
+		"onLanguage:proto",
 		"onLanguage:python",
+		"onLanguage:sass",
+		"onLanguage:scss",
 		"onLanguage:typescript",
 		"onLanguage:typescriptreact",
-		"onLanguage:proto",
 		"onLanguage:zig"
 	],
 	"browser": "./out/extension.js",
@@ -67,7 +71,8 @@
 		"@wasm-fmt/clang-format": "^0.2.7",
 		"@wasm-fmt/gofmt": "^0.4.5",
 		"@wasm-fmt/ruff_fmt": "^0.4.3",
-		"@wasm-fmt/zig_fmt": "^0.0.3"
+		"@wasm-fmt/zig_fmt": "^0.0.3",
+		"malva": "^0.1.1"
 	},
 	"keywords": [
 		"prettier",

src/env.d.ts

@@ -12,3 +12,9 @@ declare module "@wasm-fmt/*.wasm" {
 	const wasm: string;
 	export default wasm;
 }
+
+declare module "malva";
+declare module "malva/standalone_wasm_bg.wasm" {
+	const wasm: string;
+	export default wasm;
+}

src/extension.ts

@@ -2,7 +2,6 @@
 // Import the module and reference it with the alias vscode in your code below
 import * as vscode from "vscode";
 import init, { formattingSubscription } from "./format";
-import "./format/ruff_fmt";
 
 // This method is called when your extension is activated
 // Your extension is activated the very first time the command is executed

src/format/index.ts

@@ -4,25 +4,28 @@ import clang_init, {
 	formattingSubscription as clang_sub,
 } from "./clang-format";
 import go_init, { formattingSubscription as go_sub } from "./gofmt";
+import malva_init, { formattingSubscription as malva_sub } from "./malva_fmt";
 import ruff_init, { formattingSubscription as ruff_sub } from "./ruff_fmt";
 import zig_init, { formattingSubscription as zig_sub } from "./zig_fmt";
 
 export default function init(context: vscode.ExtensionContext) {
 	return Promise.all([
 		biome_init(context),
+		clang_init(context),
 		go_init(context),
+		malva_init(context),
 		ruff_init(context),
-		clang_init(context),
 		zig_init(context),
 	]);
 }
 
 export function formattingSubscription() {
 	return vscode.Disposable.from(
 		biome_sub(),
+		clang_sub(),
 		go_sub(),
+		malva_sub(),
 		ruff_sub(),
-		clang_sub(),
 		zig_sub(),
 	);
 }

src/format/malva_fmt.ts

@@ -0,0 +1,45 @@
+import { format as malva_fmt, initSync as malva_init } from "malva";
+import malva_wasm from "malva/standalone_wasm_bg.wasm";
+import * as vscode from "vscode";
+import { Logger } from "../logger";
+
+const logger = new Logger("malva-format");
+
+export default async function init(context: vscode.ExtensionContext) {
+	const wasm_uri = vscode.Uri.joinPath(context.extensionUri, malva_wasm);
+
+	const bits = await vscode.workspace.fs.readFile(wasm_uri);
+	malva_init(bits);
+}
+
+export function formattingSubscription() {
+	return vscode.languages.registerDocumentFormattingEditProvider(
+		["css", "scss", "sass", "less"],
+		{
+			provideDocumentFormattingEdits(document, options, token) {
+				const text = document.getText();
+
+				const useTabs = !options.insertSpaces;
+				const indentWidth = options.tabSize;
+
+				try {
+					const formatted = malva_fmt(text, document.languageId, {
+						useTabs,
+						indentWidth,
+					});
+
+					const range = document.validateRange(
+						new vscode.Range(
+							document.positionAt(0),
+							document.positionAt(text.length)
+						)
+					);
+					return [vscode.TextEdit.replace(range, formatted)];
+				} catch (error) {
+					logger.error(error);
+					return [];
+				}
+			},
+		}
+	);
+}