Double-clicking the Frontmatter, a script or a style row opens it in the code editor

[LilianBarbe]

Summary

In the Navigator, double-clicking a row that holds code now opens it in the floating code editor. This is the same editor that Enter and the "Edit code" button already open. Element rows still do nothing on double-click, and component rows still open their file.

 onDoubleClick(row)
+  if row is Frontmatter, <style> or <script>
+    onOpenCode(row.id)          // the row's own id, not the selection
+  else
     open the component, as before

The row passes its own id because the click that selects it has only just requested the selection. When the double-click fires, selectedNode still points to the previous row.

Enter, "Edit code" and the double-click now all go through one pure rule, so they always agree on the title and language:

 src/
+├── codeWindowTarget.ts      # codeWindowFor(subject): frontmatter | <style> | <script> → editor, else undefined
 ├── App.tsx                  # openCodeWindow / openCodeWindowById call codeWindowFor
 └── panels/
     ├── StructurePanel.tsx   # Frontmatter row: onDoubleClick → onOpenCode('frontmatter')
     └── StructureTree.tsx    # raw rows: onDoubleClick → onOpenCode(id)

A side effect: codeWindowFor matches the tag name case-insensitively, as the parser does. A <STYLE> block used to open labelled as JavaScript and now opens as CSS.

Evidence

New test: test/navigator-open-code.js (npm run test:navigatoropencode).

• Before: the Navigator half fails, because a double-click on the Frontmatter row reports nothing.

  doubleClick(Frontmatter) → { code: [], component: [] }
  expected                 → { code: ['frontmatter'], component: [] }
  

  After: all checks pass.

  doubleClick(Frontmatter) → onOpenCode('frontmatter')
  doubleClick(<style>)     → onOpenCode('s1')
  doubleClick(<script>)    → onOpenCode('j1')
  doubleClick(<div>)       → nothing
  doubleClick(<Card>)      → onOpenComponent('Card', 'c1')   // unchanged
  codeWindowFor(<STYLE>)   → css
  codeWindowFor(<template>) → throws "raw node <template> has no code language"
  

• The full gate passes on Node 22: npm test → 153/153 test commands.
• I also tested it by hand with npm run dev: Frontmatter, <style> and <script> open in the editor, components still open their file, and Enter and "Edit code" work as before.

Merge Danger

Door: two-way

The change only adds a handler and extracts an existing rule, with no data or file-format changes. Reverting the commit fully restores the old behaviour.

Blast Radius: small

• The only user-visible change is the double-click on Frontmatter, <style> and <script> rows in the Navigator.
• Enter and "Edit code" now go through codeWindowFor. Their output is unchanged, except that a capitalised <STYLE> now opens as CSS.
• codeWindowFor asserts that a raw node is a style or a script, which is the parser's RAW_ELEMENTS invariant. A new raw element added to the parser later would have to be added to RAW_CODE_LANGUAGES as well.

🤖 Generated with Claude Code