Details

Work Remaining

• click on a selected SO in parts -> unselects

---

Done

• add a toggle button to D_Selection titled "hide" / "show" -- hide means do not draw the SO or its decorations
• add a margin 8px at right and left of both D_Selection tables
• "reset preferences" button
• default accent color -> glow too faint
• in D List, remove ALL the inches signifiers (just show raw number)
  • positions are all NaN
• lists
  • indent children
  • add toggle button: position/size
  • only show position OR size
• move add button to glow banner as a +
  • move add child (same)
• move to bottom row of parts
  • delete all children
  • duplicate
  • show
• rename d smart object -> d attributes
• d parts -> d assembly
• new banner -> editor
• assembly table -> v arrow keys change selection
• rename editor -> selection
• parts: convert position/size (clickable label into a button) with "<->" decoration -- same as in the swap x <-> y button
• add a "<->" to the 2D/3D and to the solid/see through buttons
• add a "<->" to the "no/has" fireblocks and remove the "has"
• move + button from attributes banner -> assembly
• while editing a cell in a table
  • all tables and lists (eg, parts)
  • type return -> edit first editable cell below
  • type tab -> edit cell to right or first editable cell below
  • MUST use e.handle_key_down as trigger
• Portable_SO -- add "visible" prop
• Load scenes without reloading — parse, teardown old scene, build new one in-place
• move all of d selected part into d parts, below the list, add a sep div between them
• remove input for name of SO from d selected part
  • allow editing of name in hierarchy (parts) list
    • single click selects that part
    • second click edits the name of that part

---

File structure

svelte/details/
  Details.svelte      — layout shell, banner-zone, three Hideables
  Hideable.svelte     — generic collapsible: banner button + slot
  D_Preferences.svelte — units, precision, line thickness, colors
  D_Selection.svelte   — name field, add-child button
  D_Library.svelte     — import/export buttons

Details.svelte

Thin shell. Sets CSS vars (--accent, --bg) and wraps three <Hideable> in a .banner-zone div. No business logic — all content lives in D_* components.

Hideable.svelte

• Banner: pill-shaped button (22px tall, border-radius: 11px, no border)
• ::before pseudo-element for radial gradient glow
• Hover ([data-hitting]): gradient replaced with var(--bg) (panel background)
• Slot: panel background, 11px border-radius, appears below banner when open
• Wired to hit_target system, hits.recalibrate() on toggle

Banner-zone styling

• background: var(--accent) fills gaps between pill banners
• ::after pseudo-element: 11px tall, var(--bg) background, border-radius: 11px 11px 0 0 — rounded footer below last hideable
• Last hideable's slot gets border-bottom: 3px solid var(--accent)

Visibility

Each hideable backed by a persistent Writable<boolean> store (w_show_preferences, w_show_selection, w_show_library) saved to localStorage via T_Preference enum keys.