Auto-expand layers tree to reveal selected node

CHANGELOG.md

@@ -29,8 +29,12 @@
 
 ### UI
 
-- Resizable pages/layers split in left panel using reka-ui Splitter
+- Resizable pages/layers split in left panel with reka-ui Splitter
+- Layers tree auto-expands and scrolls to reveal selected node
 - Loading overlay on canvas while opening .fig files
+- Hide internal-only pages (e.g. "Internal Only Canvas" in design systems)
+- Render page dividers — pages named with only dashes/asterisks/spaces show as horizontal lines
+- Only show component labels for COMPONENT and COMPONENT_SET, not instances
 - Replace all native `<select>` dropdowns with reka-ui `AppSelect` component
 - Smoother trackpad pinch-to-zoom with `Math.exp` curve and deltaMode normalization
 - Fix font picker dropdown truncating long font names

src/components/LayersPanel.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, watch } from 'vue'
+import { ref, watch, nextTick } from 'vue'
 import { useEventListener } from '@vueuse/core'
 import { TreeRoot, TreeItem, ContextMenuRoot, ContextMenuTrigger, ContextMenuPortal } from 'reka-ui'
 
@@ -74,6 +74,29 @@ watch([() => store.state.sceneVersion, () => store.state.currentPageId], () => {
 
 const expanded = ref<string[]>([])
 
+watch(
+  () => store.state.selectedIds,
+  (ids) => {
+    const toExpand = new Set(expanded.value)
+    for (const id of ids) {
+      let node = store.graph.getNode(id)
+      while (node?.parentId && node.parentId !== store.state.currentPageId) {
+        toExpand.add(node.parentId)
+        node = store.graph.getNode(node.parentId)
+      }
+    }
+    if (toExpand.size > expanded.value.length) {
+      expanded.value = [...toExpand]
+    }
+    nextTick(() => {
+      const first = [...ids][0]
+      if (!first) return
+      const el = listRef.value?.querySelector<HTMLElement>(`[data-node-id="${first}"]`)
+      el?.scrollIntoView({ block: 'nearest' })
+    })
+  }
+)
+
 function onSelect(ev: CustomEvent) {
   ev.preventDefault()
   const node = ev.detail.value as LayerNode