@motion-proto/live-tokens 0.42.0 → 0.43.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changelog
 
+## 0.43.0 — The editor opens on Tokens
+
+### Changed
+
+- **The editor's view no longer carries across sessions.** Opening the editor in
+  a fresh tab always lands on Tokens; previously it restored whichever of
+  Tokens / Colors / Components you last used, so a session that ended on Colors
+  reopened there indefinitely. `editorViewStore` moved the active view from
+  `localStorage` to `sessionStorage`, which keeps the two things that did depend
+  on the round-trip: the parent window and the overlay iframe stay in sync (same
+  tab, same origin, so they share one storage area and its `storage` events),
+  and an in-page deep link that calls `setEditorView()` before opening the
+  overlay still lands on the view it asked for. The sidebar's condensed/expanded
+  state is a durable preference and stays in `localStorage`. A stale
+  `lt.editorView` left in `localStorage` by an earlier version is ignored, not
+  migrated.
+
 ## 0.42.0 — Canvas, and every ramp places its base color
 
 ### Changed (breaking)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@motion-proto/live-tokens",
-  "version": "0.42.0",
+  "version": "0.43.0",
   "type": "module",
   "description": "Design token editor with live CSS variable editing. Svelte 5 + Vite 8.",
   "keywords": [

package/src/editor/core/store/editorViewStore.ts

@@ -10,9 +10,14 @@ function isEditorView(v: unknown): v is EditorView {
   return v === 'tokens' || v === 'components' || v === 'colors';
 }
 
+// Session-scoped, not persistent: opening the editor fresh always starts on
+// Tokens. Within a session it still round-trips, which is what the parent
+// window / overlay iframe pair and in-page deep links (setEditorView before
+// opening the overlay) rely on — same-origin frames in a tab share one
+// sessionStorage area and its `storage` events.
 function readView(): EditorView {
   try {
-    const v = localStorage.getItem(VIEW_KEY);
+    const v = sessionStorage.getItem(VIEW_KEY);
     if (isEditorView(v)) return v;
   } catch {}
   return 'tokens';
@@ -32,14 +37,14 @@ export const sidebarCondensed = writable<SidebarCondensed>(readCondensed());
 export const selectedComponent = writable<string>('button');
 
 editorView.subscribe((v) => {
-  try { localStorage.setItem(VIEW_KEY, v); } catch {}
+  try { sessionStorage.setItem(VIEW_KEY, v); } catch {}
 });
 
 sidebarCondensed.subscribe((v) => {
   try { localStorage.setItem(CONDENSED_KEY, v === 'auto' ? 'auto' : String(v)); } catch {}
 });
 
-// Cross-window sync: parent and overlay iframe share localStorage but each have
+// Cross-window sync: parent and overlay iframe share web storage but each have
 // their own module state. `storage` events fire in the *other* window when one
 // writes, so we mirror the new value into this window's store.
 if (typeof window !== 'undefined') {