@nsis/dent-ui 0.3.5 → 0.4.1

package/.turbo/turbo-build.log

@@ -0,0 +1,19 @@
+$ vite build
+6:24:22 AM [vite-plugin-svelte] no Svelte config found at /home/runner/work/nsis-org/nsis-org/packages/dent-ui - using default configuration.
+vite v8.3.4 building client environment for production...
+transforming...
+✓ 149 modules transformed.
+rendering chunks...
+computing gzip size...
+dist/index.html                             0.34 kB │ gzip:   0.24 kB
+dist/assets/ardent_wasm_bg-Bz5RQ-Nz.wasm  209.73 kB │ gzip:  87.81 kB
+dist/assets/web-CQZZv1Rg.js                 6.65 kB │ gzip:   2.73 kB
+dist/assets/dent-CuDUSuip.js               58.47 kB │ gzip:  17.01 kB
+dist/assets/index-COh98auV.js             517.77 kB │ gzip: 170.87 kB
+
+✓ built in 364ms
+[plugin builtin:vite-reporter] 
+(!) Some chunks are larger than 500 kB after minification. Consider:
+- Using dynamic import() to code-split the application
+- Use build.rolldownOptions.output.codeSplitting to improve chunking: https://rolldown.rs/reference/OutputOptions.codeSplitting
+- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @nsis/dent-ui
 
+## 0.4.1
+
+### Patch Changes
+
+- 4875a1f: add engine prop
+
+## 0.4.0
+
+### Minor Changes
+
+- 4624557: switch formatter to ardent
+
+### Patch Changes
+
+- Updated dependencies [4624557]
+  - @nsis/ardent-wasm@0.1.0
+
 ## 0.3.5
 
 ### Patch Changes

package/README.md

@@ -6,7 +6,7 @@
 [![Version](https://img.shields.io/npm/v/@nsis/dent-ui?style=for-the-badge)](https://www.npmjs.org/package/@nsis/dent-ui)
 [![Build](https://img.shields.io/github/actions/workflow/status/idleberg/nsis-org/ci.yml?style=for-the-badge)](https://github.com/idleberg/nsis-org/actions)
 
-[Demo Time](https://idleberg.github.io/nsis-org/dent/) 🙌
+[Demo Time](https://idleberg.github.io/nsis-org/dent-ui/) 🙌
 
 ## Usage
 
@@ -21,6 +21,8 @@
 > [!NOTE]
 > By default, NSIS keywords are matched case-insensitively (e.g. `messagebox` and `MessageBox` are both highlighted). Set `strict` to `true` to require canonical casing.
 
+Formatting uses [`@nsis/ardent-wasm`](../ardent-wasm#readme). Set `engine` to `"dent"` to use the classic [`@nsis/dent`](../dent#readme) instead. Only the selected engine is downloaded.
+
 ## License
 
 This work is licensed under [The MIT License](LICENSE).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nsis/dent-ui",
-  "version": "0.3.5",
+  "version": "0.4.1",
   "description": "Web UI for the Dent NSIS code formatter",
   "license": "MIT",
   "type": "module",
@@ -26,22 +26,23 @@
   },
   "dependencies": {
     "@codemirror/commands": "^6.11.1",
-    "@codemirror/language": "^6.12.4",
-    "@codemirror/state": "^6.7.5",
-    "@codemirror/view": "^6.43.12",
-    "@lezer/highlight": "^1.2.3",
+    "@codemirror/language": "^6.13.1",
+    "@codemirror/state": "^6.7.6",
+    "@codemirror/view": "^6.43.15",
+    "@lezer/highlight": "^1.2.5",
     "@nsis/codemirror": "0.14.6",
+    "@nsis/ardent-wasm": "0.1.0",
     "@nsis/dent": "0.17.0",
-    "svelte": "^5.57.0"
+    "svelte": "^5.57.2"
   },
   "devDependencies": {
-    "@sveltejs/vite-plugin-svelte": "^7.3.0",
-    "@vitest/browser": "^5.0.1",
-    "@vitest/browser-playwright": "^5.0.1",
-    "playwright": "^1.63.0",
-    "svelte-check": "^4.7.6",
-    "vite": "^8.3.0",
-    "vitest": "^5.0.1",
+    "@sveltejs/vite-plugin-svelte": "^7.3.1",
+    "@vitest/browser": "^5.0.5",
+    "@vitest/browser-playwright": "^5.0.5",
+    "playwright": "^1.64.1",
+    "svelte-check": "^4.7.7",
+    "vite": "^8.3.4",
+    "vitest": "^5.0.5",
     "vitest-browser-svelte": "^3.1.0"
   },
   "scripts": {

package/src/App.svelte

@@ -3,11 +3,35 @@ import { defaultKeymap, history, historyKeymap } from '@codemirror/commands';
 import { indentOnInput } from '@codemirror/language';
 import { EditorState } from '@codemirror/state';
 import { EditorView, keymap } from '@codemirror/view';
-import { createFormatter } from '@nsis/dent';
 import { onDestroy, onMount } from 'svelte';
 import Editor from './Editor.svelte';
 
-let { strict = false, sample = '' }: { strict?: boolean; sample?: string } = $props();
+let {
+	strict = false,
+	sample = '',
+	engine = 'ardent',
+}: { strict?: boolean; sample?: string; engine?: 'ardent' | 'dent' } = $props();
+
+// Each engine is its own chunk, so neither weighs on the initial bundle.
+const engines = {
+	ardent: () => import('@nsis/ardent-wasm'),
+	dent: () => import('@nsis/dent'),
+};
+
+// Re-imports only when `engine` changes; the module cache makes repeat switches free.
+const formatter = $derived(engines[engine]());
+let loading = $state(true);
+
+// Reading `formatter` here starts the download on mount rather than on the first format.
+$effect(() => {
+	const pending = formatter;
+	const done = () => {
+		if (pending === formatter) loading = false;
+	};
+
+	loading = true;
+	pending.then(done, done);
+});
 
 let dark = $state(document.documentElement.dataset.theme !== 'light');
 let themePreference = $state(localStorage.getItem('theme') || 'system');
@@ -69,16 +93,23 @@ function scheduleAutoFormat() {
 	debounceTimer = setTimeout(formatInput, 400);
 }
 
-function formatInput() {
-	error = '';
-	const source = inputView?.state.doc.toString() ?? '';
-
-	if (!source.trim()) {
-		setOutput('');
-		return;
-	}
+async function formatInput() {
+	const requested = engine;
 
 	try {
+		const { createFormatter } = await formatter;
+
+		// A newer engine took over while this one loaded.
+		if (requested !== engine) return;
+
+		error = '';
+		const source = inputView?.state.doc.toString() ?? '';
+
+		if (!source.trim()) {
+			setOutput('');
+			return;
+		}
+
 		const { format } = createFormatter({
 			useTabs,
 			singleQuote,
@@ -247,7 +278,9 @@ const outputExtensions = [EditorState.readOnly.of(true), EditorView.lineWrapping
 	<label class="auto-label">
 		<input type="checkbox" bind:checked={autoFormat} /> Auto-format
 	</label>
-	{#if status}
+	{#if loading}
+		<span class="status" role="status" aria-live="polite">Loading formatter engine…</span>
+	{:else if status}
 		<span class="status" role="status" aria-live="polite">{status}</span>
 	{/if}
 	{#if error}

package/.gitignore

@@ -1,12 +0,0 @@
-# Package Manager
-bower_components/
-node_modules/
-npm-debug.log*
-vendor/
-package-lock.json
-yarn-error.log
-yarn.lock
-bin/
-
-# Build
-dist/