@ternkit/tern 1.4.0 → 1.6.0

package/dist/ui/Toggle.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { announce } from './announce.js';
 	import type { Snippet } from 'svelte';
 	import type { HTMLButtonAttributes } from 'svelte/elements';
 
@@ -18,6 +19,7 @@
 </script>
 
 <button
+	use:announce={pressed}
 	type="button"
 	class="tern-toggle {variant} {size} {klass}"
 	aria-pressed={pressed}

package/dist/ui/ToggleGroup.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { announce } from './announce.js';
 	import type { Snippet } from 'svelte';
 	import { getField } from './field.js';
 
@@ -58,6 +59,7 @@
 </script>
 
 <div
+	use:announce={value}
 	class="tern-toggle-group {size} {klass}"
 	role={type === 'single' ? 'radiogroup' : 'group'}
 	aria-label={field ? undefined : label}

package/dist/ui/accountDates.d.ts

@@ -0,0 +1 @@
+export declare function when(iso: string | null | undefined): string;

package/dist/ui/accountDates.js

@@ -0,0 +1,15 @@
+// Dates on the account screens, in the user's locale.
+import { i18n } from '../runtime/i18n.svelte.js';
+export function when(iso) {
+    if (!iso)
+        return '';
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return '';
+    try {
+        return new Intl.DateTimeFormat(i18n.locale || undefined, { dateStyle: 'medium', timeStyle: 'short' }).format(d);
+    }
+    catch {
+        return d.toISOString().slice(0, 16).replace('T', ' ');
+    }
+}

package/dist/ui/announce.d.ts

@@ -0,0 +1,4 @@
+/** A Svelte action: use:announce={value} fires input when value changes. */
+export declare function announce(node: HTMLElement, _value: unknown): {
+    update(): void;
+};

package/dist/ui/announce.js

@@ -0,0 +1,14 @@
+// Controls that post through hidden inputs (Combobox, SelectMenu,
+// DatePicker, Slider, …) don't fire input events as the user changes
+// them. announce does: on the element it's on, after each change of its
+// parameter, so a Form checks the field as the user changes it.
+/** A Svelte action: use:announce={value} fires input when value changes. */
+export function announce(node, _value) {
+    return {
+        update() {
+            // After Svelte has written the new value to the DOM, which it does
+            // after calling update, so the form reads what the user chose.
+            queueMicrotask(() => node.dispatchEvent(new Event('input', { bubbles: true })));
+        }
+    };
+}

package/dist/ui/index.d.ts

@@ -51,6 +51,10 @@ export { default as Sheet } from './Sheet.svelte';
 export { default as Sidebar } from './Sidebar.svelte';
 export { default as SignIn } from './SignIn.svelte';
 export { default as SignUp } from './SignUp.svelte';
+export { default as ForgotPassword } from './ForgotPassword.svelte';
+export { default as ResetPassword } from './ResetPassword.svelte';
+export { default as Devices } from './Devices.svelte';
+export { default as Passkeys } from './Passkeys.svelte';
 export { default as Skeleton } from './Skeleton.svelte';
 export { default as Slider } from './Slider.svelte';
 export { default as Sparkline } from './Sparkline.svelte';

package/dist/ui/index.js

@@ -54,6 +54,10 @@ export { default as Sheet } from './Sheet.svelte';
 export { default as Sidebar } from './Sidebar.svelte';
 export { default as SignIn } from './SignIn.svelte';
 export { default as SignUp } from './SignUp.svelte';
+export { default as ForgotPassword } from './ForgotPassword.svelte';
+export { default as ResetPassword } from './ResetPassword.svelte';
+export { default as Devices } from './Devices.svelte';
+export { default as Passkeys } from './Passkeys.svelte';
 export { default as Skeleton } from './Skeleton.svelte';
 export { default as Slider } from './Slider.svelte';
 export { default as Sparkline } from './Sparkline.svelte';

package/dist/vite/index.js

@@ -2,6 +2,7 @@ import { svelte } from '@sveltejs/vite-plugin-svelte';
 import fs from 'node:fs';
 import { createRequire } from 'node:module';
 import path from 'node:path';
+import { nativePlugin } from './native.js';
 import { goScriptPlugin, goScriptPreprocessor } from './goscript.js';
 import { imagePlugin } from './image.js';
 /** Packages whose browser build works in the server renderer and whose default build needs Node. */
@@ -218,7 +219,7 @@ export function tern(options = {}) {
             return user;
         }
     };
-    return [browserBuildsPlugin, imagePlugin(), goScriptPlugin(() => root), ...svelte(svelteOptions), plugin];
+    return [browserBuildsPlugin, imagePlugin(), goScriptPlugin(() => root), ...svelte(svelteOptions), plugin, nativePlugin(() => root, SERVER_ENTRY)];
 }
 /** The $service-worker module: what this build produced, for caching. */
 function serviceWorkerModule(root, base) {

package/dist/vite/native.d.ts

@@ -0,0 +1,3 @@
+import type { Plugin } from 'vite';
+export declare const NATIVE_IR = ".tern/native/ir.json";
+export declare function nativePlugin(getRoot: () => string, entry: string): Plugin;

package/dist/vite/native.js

@@ -0,0 +1,139 @@
+import { parse } from 'acorn';
+import fs from 'node:fs';
+import path from 'node:path';
+export const NATIVE_IR = '.tern/native/ir.json';
+function svelteVersion(root) {
+    try {
+        const pkg = path.join(path.dirname(require_resolve('svelte/package.json', root)));
+        return JSON.parse(fs.readFileSync(path.join(pkg, 'package.json'), 'utf8')).version;
+    }
+    catch {
+        return '';
+    }
+}
+function require_resolve(spec, root) {
+    // Find svelte's package.json from the app's node_modules, as Vite does.
+    let dir = root;
+    for (;;) {
+        const candidate = path.join(dir, 'node_modules', spec);
+        if (fs.existsSync(candidate))
+            return candidate;
+        const up = path.dirname(dir);
+        if (up === dir)
+            throw new Error(`cannot find ${spec}`);
+        dir = up;
+    }
+}
+export function nativePlugin(getRoot, entry) {
+    const modules = new Map();
+    let active = false;
+    let env = {};
+    let base = '/';
+    // Asset URLs are placeholders in a module (import.meta.ROLLDOWN_FILE_URL_…)
+    // until the bundle is written: their final URLs go in the IR.
+    const fileRefs = new Set();
+    const fileUrls = {};
+    const bundled = {};
+    const rel = (file) => path.relative(getRoot(), file).split(path.sep).join('/');
+    // Every module is recorded, Svelte's own runtime included: compiling its
+    // code, rather than rewriting it, keeps the output exactly Svelte's.
+    const native = (_file) => false;
+    return {
+        name: 'tern:native-ir',
+        enforce: 'post',
+        configResolved(config) {
+            active = !!config.build.ssr && process.env.TERN_NATIVE === '1';
+            env = JSON.parse(JSON.stringify({ ...config.env, SSR: true }));
+            base = config.base || '/';
+        },
+        async transform(code, id) {
+            if (!active || id.startsWith('\0'))
+                return null;
+            // Modules with a query, such as an asset's ?url, are recorded under
+            // their whole id; what isn't JavaScript fails to parse and is left out.
+            const file = id;
+            const query = id.includes('?');
+            if ((!query && !/\.(svelte|[cm]?[jt]s|[jt]sx|json)$/.test(file)) || native(file))
+                return null;
+            try {
+                const ast = parse(code, { ecmaVersion: 'latest', sourceType: 'module' });
+                const imports = {};
+                const sources = [];
+                for (const node of ast.body) {
+                    if (node.type === 'ImportDeclaration' || node.type === 'ExportAllDeclaration' || (node.type === 'ExportNamedDeclaration' && node.source)) {
+                        sources.push(node.source.value);
+                    }
+                }
+                // import('./x') with a literal resolves like a static import.
+                const walk = (n) => {
+                    if (!n || typeof n !== 'object')
+                        return;
+                    if (Array.isArray(n))
+                        return n.forEach(walk);
+                    const node = n;
+                    if (node.type === 'ImportExpression' && node.source?.type === 'Literal' && typeof node.source.value === 'string')
+                        sources.push(node.source.value);
+                    for (const v of Object.values(node))
+                        if (v && typeof v === 'object')
+                            walk(v);
+                };
+                walk(ast.body);
+                for (const source of sources) {
+                    if (source in imports)
+                        continue;
+                    const resolved = await this.resolve(source, id, { ssr: true });
+                    const target = resolved && !resolved.external && !resolved.id.startsWith('\0') ? resolved.id : null;
+                    imports[source] = target && !native(target) ? rel(target) : null;
+                }
+                modules.set(file, { id: rel(file), imports, ast, code });
+                for (const m of code.matchAll(/import\.meta\.((?:ROLLDOWN|ROLLUP|VITE)_FILE_URL_([\w$]+))/g))
+                    fileRefs.add(m[1]);
+            }
+            catch {
+                // Not JavaScript we can read: the module stays unrecorded, so
+                // whatever imports it renders with the JavaScript engine.
+            }
+            return null;
+        },
+        generateBundle(_opts, bundle) {
+            if (!active)
+                return;
+            // What the bundler kept code of: modules it tree-shook away aren't
+            // compiled.
+            for (const out of Object.values(bundle)) {
+                if (out.type !== 'chunk')
+                    continue;
+                for (const [id, m] of Object.entries(out.modules))
+                    if (m.renderedLength > 0)
+                        bundled[rel(id)] = true;
+            }
+            for (const ref of fileRefs) {
+                try {
+                    fileUrls[ref] = path.posix.join(base, this.getFileName(ref.replace(/^(?:ROLLDOWN|ROLLUP|VITE)_FILE_URL_/, '')));
+                }
+                catch {
+                    // Not a file of this build: the module falls back.
+                }
+            }
+        },
+        closeBundle() {
+            if (!active)
+                return;
+            const root = getRoot();
+            const out = path.join(root, NATIVE_IR);
+            fs.mkdirSync(path.dirname(out), { recursive: true });
+            const ir = { version: 1, svelte: svelteVersion(root), entry, env, fileUrls, bundled, modules: [...modules.values()] };
+            try {
+                // BigInt literals keep their digits in the node's bigint field;
+                // their value, which JSON can't hold, is left out.
+                fs.writeFileSync(out, JSON.stringify(ir, (_k, v) => (typeof v === 'bigint' ? null : v)));
+            }
+            catch (err) {
+                // Native rendering is an optimisation: without the IR, tern build
+                // skips it and pages render with the JavaScript engine.
+                fs.rmSync(out, { force: true });
+                this.warn(`native rendering skipped: ${err.message}`);
+            }
+        }
+    };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ternkit/tern",
-  "version": "1.4.0",
+  "version": "1.6.0",
   "description": "Client runtime and Vite plugin for Tern: Svelte on the client, Go on the server",
   "license": "MIT",
   "type": "module",
@@ -71,7 +71,8 @@
     "vite": "^8.0.0"
   },
   "dependencies": {
-    "@sveltejs/vite-plugin-svelte": "^7.3.1"
+    "@sveltejs/vite-plugin-svelte": "^7.3.1",
+    "acorn": "^8.19.0"
   },
   "devDependencies": {
     "@sveltejs/package": "^3.0.2",