@signal9/era-ui 3.16.0 → 3.17.0

package/dist/apps/notes/editor/bubble-toolbar.svelte

@@ -23,10 +23,16 @@
 
 <!-- md with xxs buttons, matching the app's other bars. It was sm + size="icon"
      — a 22px bar of 14px buttons around 10px glyphs, the smallest combination in
-     the ladder, which is why the formatting controls read as unhittable. -->
+     the ladder, which is why the formatting controls read as unhittable.
+
+     The border is a deliberate exception to "shadow, not border" (design rule 7):
+     this panel floats over the DOCUMENT, not over chrome, so on a light theme its
+     elevated fill sits on a page of nearly the same value and the shadow alone
+     leaves no discernible edge. border-divider-faded is the token'd hairline, so
+     it still tracks the surface rather than being a drawn-on line. -->
 <Bar
 	size="md"
-	class="w-max gap-(--era-xxs-inset-md) bg-elevated px-(--era-xxs-inset-md) shadow-lg glass-blur"
+	class="w-max gap-(--era-xxs-inset-md) border border-divider-faded bg-elevated px-(--era-xxs-inset-md) shadow-lg glass-blur"
 >
 	{#each items as item (item.mark)}
 		{@const Icon = item.icon}

package/dist/os/index.d.ts

@@ -1,4 +1,6 @@
-export { WindowManager, getWindowManager, setWindowManagerContext, type Point, type Size, type Rect, type Insets, type Frame, type AppDefinition, type AppWindow, type AppComponent, type AppProps, type WindowState, type JsonValue, type WindowSnapshot, type WorkspaceSnapshot, SNAPSHOT_VERSION, readSnapshot, type SnapZone, type Workspace } from './wm.svelte.js';
+export { WindowManager, getWindowManager, setWindowManagerContext, type Point, type Size, type Rect, type Insets, type Frame, type AppDefinition, type AppWindow, type AppComponent, type AppProps, type WindowState, type JsonValue, type WindowSnapshot, type WorkspaceSnapshot, SNAPSHOT_VERSION, readSnapshot } from './wm.svelte.js';
+export { persistWorkspace, loadWorkspace, saveWorkspace, clearWorkspace, WORKSPACE_STORAGE_KEY } from './workspace-storage.svelte.js';
+export { type SnapZone, type Workspace } from './wm.svelte.js';
 export { NotificationService, getNotifications, setNotificationContext, type AppNotification, type NotifyOptions, type NotificationAction, type NotificationTone } from './notifications.svelte.js';
 export { LAYER } from './layers.js';
 export { default as Desktop } from './desktop.svelte';

package/dist/os/index.js

@@ -3,6 +3,8 @@
 // components that render them: Desktop host, Window, Taskbar (with its
 // built-in command bar), Toaster, NotificationCenter.
 export { WindowManager, getWindowManager, setWindowManagerContext, SNAPSHOT_VERSION, readSnapshot } from './wm.svelte.js';
+export { persistWorkspace, loadWorkspace, saveWorkspace, clearWorkspace, WORKSPACE_STORAGE_KEY } from './workspace-storage.svelte.js';
+export {} from './wm.svelte.js';
 export { NotificationService, getNotifications, setNotificationContext } from './notifications.svelte.js';
 export { LAYER } from './layers.js';
 export { default as Desktop } from './desktop.svelte';

package/dist/os/workspace-storage.svelte.d.ts

@@ -0,0 +1,25 @@
+import { type WindowManager } from './wm.svelte.js';
+export declare const WORKSPACE_STORAGE_KEY = "era-ui:workspace";
+/** Read a saved snapshot and apply it. Returns whether anything was restored. */
+export declare function loadWorkspace(wm: WindowManager, key?: string): boolean;
+/** Write the current desktop. Returns false when storage rejected it. */
+export declare function saveWorkspace(wm: WindowManager, key?: string): boolean;
+export declare function clearWorkspace(key?: string): void;
+/**
+ * Restore on setup, then save whenever the desktop changes.
+ *
+ * Call from a component's script (it registers an `$effect`, so it needs a
+ * component context). The load is synchronous and happens immediately, before
+ * the first paint.
+ *
+ * Writes are debounced: dragging a window mutates `pos` on every pointer move,
+ * and serialising the whole desktop per frame would be pointless work. The
+ * trailing write always lands because the effect's teardown flushes a pending
+ * timer.
+ */
+export declare function persistWorkspace(wm: WindowManager, options?: {
+    key?: string;
+    debounce?: number;
+}): {
+    restored: boolean;
+};

package/dist/os/workspace-storage.svelte.js

@@ -0,0 +1,118 @@
+/**
+ * Persisting the desktop across reloads.
+ *
+ * WHY localStorage, and not something newer
+ * -----------------------------------------
+ * The payload is a few kB of JSON that must be read BEFORE the first paint. That
+ * one requirement rules out every modern alternative, because they are all async:
+ *
+ *   IndexedDB       async. Large, structured, transactional — none of which this
+ *                   needs, and the desktop would paint empty and then pop windows
+ *                   in a frame later.
+ *   OPFS            async, and built for large or binary files with real
+ *                   read/write handles. A 2kB JSON blob is not that.
+ *   Storage Buckets async, and still Chromium-only. Its actual feature is
+ *                   per-bucket eviction and quota policy, which matters when you
+ *                   have several independent stores to prioritise between. One
+ *                   layout snapshot is not that either.
+ *
+ * localStorage is synchronous, which here is the feature rather than the
+ * compromise: the snapshot is read and applied during setup, so the desktop's
+ * first paint is already the restored layout — no flash of an empty workspace.
+ *
+ * The genuinely modern piece worth adopting IS used: navigator.storage.persist()
+ * asks the browser to exempt this origin from eviction under storage pressure.
+ * Without it localStorage is "best effort" and can be cleared when the device is
+ * low on space. It is requested once, non-blocking, and its refusal is harmless.
+ */
+import { untrack } from 'svelte';
+import { readSnapshot } from './wm.svelte.js';
+export const WORKSPACE_STORAGE_KEY = 'era-ui:workspace';
+/** Read a saved snapshot and apply it. Returns whether anything was restored. */
+export function loadWorkspace(wm, key = WORKSPACE_STORAGE_KEY) {
+    if (typeof localStorage === 'undefined')
+        return false;
+    let raw = null;
+    try {
+        raw = localStorage.getItem(key);
+    }
+    catch {
+        return false; // private mode, or storage disabled
+    }
+    if (!raw)
+        return false;
+    // readSnapshot is the gate: this string is untrusted (hand-edited, stale, or
+    // written by a newer version), so it is validated rather than cast.
+    const snapshot = readSnapshot(raw);
+    if (!snapshot)
+        return false;
+    wm.applySnapshot(snapshot);
+    return true;
+}
+/** Write the current desktop. Returns false when storage rejected it. */
+export function saveWorkspace(wm, key = WORKSPACE_STORAGE_KEY) {
+    if (typeof localStorage === 'undefined')
+        return false;
+    try {
+        localStorage.setItem(key, JSON.stringify(wm.snapshot()));
+        return true;
+    }
+    catch {
+        // Quota exceeded or private mode. A layout is convenience state, so this
+        // stays silent — unlike the Notes store, where a failed save loses writing
+        // and the user has to be told.
+        return false;
+    }
+}
+export function clearWorkspace(key = WORKSPACE_STORAGE_KEY) {
+    try {
+        localStorage?.removeItem(key);
+    }
+    catch {
+        /* nothing to do — the goal was for it to be gone */
+    }
+}
+/**
+ * Restore on setup, then save whenever the desktop changes.
+ *
+ * Call from a component's script (it registers an `$effect`, so it needs a
+ * component context). The load is synchronous and happens immediately, before
+ * the first paint.
+ *
+ * Writes are debounced: dragging a window mutates `pos` on every pointer move,
+ * and serialising the whole desktop per frame would be pointless work. The
+ * trailing write always lands because the effect's teardown flushes a pending
+ * timer.
+ */
+export function persistWorkspace(wm, options = {}) {
+    const key = options.key ?? WORKSPACE_STORAGE_KEY;
+    const wait = options.debounce ?? 400;
+    const restored = loadWorkspace(wm, key);
+    // Ask for durable storage. Fire-and-forget: a refusal (or an engine without
+    // the API) just leaves the default best-effort behaviour.
+    void navigator?.storage?.persist?.().catch(() => { });
+    $effect(() => {
+        // Touch what a snapshot is made of, so the effect re-runs when any of it
+        // changes. Reading these is the subscription.
+        wm.windows.forEach((w) => {
+            void w.pos.x;
+            void w.pos.y;
+            void w.size?.width;
+            void w.size?.height;
+            void w.state;
+            void w.z;
+            void w.title;
+            void w.workspaceId;
+            void w.props;
+        });
+        void wm.workspaces.length;
+        void wm.activeWorkspaceId;
+        const timer = setTimeout(() => {
+            // untrack: snapshot() reads the same state this effect depends on, and
+            // re-reading it inside would re-subscribe on every write.
+            untrack(() => saveWorkspace(wm, key));
+        }, wait);
+        return () => clearTimeout(timer);
+    });
+    return { restored };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@signal9/era-ui",
-	"version": "3.16.0",
+	"version": "3.17.0",
 	"scripts": {
 		"dev": "vite dev --host",
 		"build": "vite build && npm run prepack",