doxa-life/doxa-maps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Plugin Studio keeps the reason and drops the speaker: its 15 references to the Driver reworded, comments only

Browse source
This commit is contained in:
Doxa Maps 2026-09-29 04:32:34 +00:00
parent 46a53f0b4e
commit ee87f8e9db
1 changed files with 26 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
plugin-designs/plugin-studio/plugin-studio.vue
View file

@ -12,7 +12,7 @@
row, its full composition tree is drawn indented, so a defect can be pinned on the exact nested
element responsible. This is the DX viewing surface:
the spot to SEE every plugin element work, in one place, ordered by capability, with the embed
snippet for each — so a developer (or the Driver) can review each element and give feedback.
snippet for each — so a developer (or a reviewer) can review each element and give feedback.
★ WHY AN ELEMENT, NOT A PAGE. Every plugin in this system is a compiled Vue custom element, so
it supports all five deployment methods (iframe · script-tag/custom-element · direct-JS
@ -100,7 +100,7 @@
</li>
</ul>
</span>
<!-- THE HEADER SETS THE PROPS EVERY PLUGIN GETS (Driver, 2026-09-25): language (above), the map
<!-- THE HEADER SETS THE PROPS EVERY PLUGIN GETS (2026-09-25): language (above), the map
ENGINE, and — under Settings — the Mapbox token or the URL it comes from. Each is kept in THIS
browser (localStorage), handed to every pane as its profile-config prop, and published on the
window for maps nested inside composites; changing one re-mounts the maps. -->
@ -154,7 +154,7 @@
<!-- Toolbar strip: the active element's identity and copy-embed. Kept to ONE line on purpose —
the plugin is what the studio is for, so it gets the rest of the main area. (A "Composed of"
panel used to sit here; the Driver removed it 2026-09-24 because it took the plugin's space.
panel used to sit here; it was removed 2026-09-24 because it took the plugin's space.
Composition lives in the rail, indented under each composite.) -->
<template #toolbar>
<div class="ps-toolbar" v-if="active">
@ -238,8 +238,8 @@ const PS_SHADOW_CSS = `
.ps-logo { display:inline-flex; align-items:center; }
.ps-logo svg { display:block; }
.ps-count { color:#6d766e; }
/* THE HEADER'S MENUS SIT ABOVE EVERY PLUGIN (Driver, 2026-09-25: "the Mapbox token menu is not on top …
it is underlapping the plugins"). The header row and the pane area are siblings with no stacking context
/* THE HEADER'S MENUS SIT ABOVE EVERY PLUGIN (2026-09-25: the Mapbox token menu was not on top;
it slid under the plugins). The header row and the pane area are siblings with no stacking context
of their own, so a menu at z-index 30 competed with each plugin's own chrome (a filter bar at 55, a drawer
at 1000) and lost. The header now stacks above the content, and the pane area is ISOLATED: whatever
z-index a plugin uses stays inside its pane. */
@ -395,9 +395,8 @@ const HEAVY_ELEMENTS = new Set([
// SUPERSEDED BUNDLES — built, still embeddable, but NOT shown in the studio. big-picture is a dark
// header of search + four filters over the people-groups grid with the grid's own (identical)
// controls switched off: to a developer it is the grid a second time under a misleading name. The
// Driver, 2026-09-24: "there should not be people groups grid twice … this is just a clone of people
// groups grid". The real Big Picture is dashboard-plus-grid (the app shell's first tab), and
// controls switched off: to a developer it is the grid a second time under a misleading name
// (2026-09-24: the people-groups grid must not appear twice as a clone of itself). The real Big Picture is dashboard-plus-grid (the app shell's first tab), and
// doxa-maps-spa's NOT_EXPERIMENTAL already hides big-picture for the same reason.
const STUDIO_HIDDEN = new Set(['big-picture'])
@ -413,8 +412,8 @@ for (const [path, mod] of Object.entries(import.meta.glob('../../library/i18n/lo
}
// DISPLAY NAMES — what a row is CALLED. Display only: the row key, the URL hash, the stored last-tab and
// the <tag> under the name are unchanged, so links and memory keep working. AUTO-DETECTED (the Driver:
// never hardcode): the plugin's own <profile>.meta.json label, carried by the manifest; failing that, a
// the <tag> under the name are unchanged, so links and memory keep working. AUTO-DETECTED (never
// hardcoded): the plugin's own <profile>.meta.json label, carried by the manifest; failing that, a
// readable name made from its ids ("Gospel Internet · Board"), never a bare profile id (a row once read
// just "board"). DISPLAY_NAME is an OVERRIDE only, and empty unless a label must differ from the meta.
const DISPLAY_NAME = {}
@ -569,9 +568,9 @@ export default defineComponent({
.map(c => ({ cap: c, label: CAP_LABEL[c] || ('capability ' + c), rows: byCap[c] }))
},
// The RAIL MODEL the Explorer tree (src/StudioTree.vue) paints: ONE list, highest capability to
// lowest (Driver, 2026-09-24: "everything in studio organized by highest capability to lowest",
// "the composability in the capability sidebar … to understand the interoperability and the
// various elements that go into each plugin", "it needs to be collapsible").
// lowest (2026-09-24: everything in the studio ordered from highest capability to lowest, the
// composition shown in the capability sidebar so the interoperability and the elements that go
// into each plugin can be understood, and all of it collapsible).
//
// CAP 5 → CAP 1 sections. Every plugin has exactly ONE canonical node (depth 0) in its own tier,
// and a composite's parts hang under it (depth 1+), ordered by capability at each level, folded
@ -583,15 +582,15 @@ export default defineComponent({
// plugin left no single name to report it by; a node that only TARGETS the canonical row has no
// identity of its own, so nesting and the one-name rule coexist.
treeSections() {
// ★ LAID OUT LIKE plugin-designs/ (Driver, 2026-09-26): one FOLDER per BUNDLE, its ELEMENTS inside,
// ★ LAID OUT LIKE plugin-designs/ (2026-09-26): one FOLDER per BUNDLE, its ELEMENTS inside,
// bundles grouped by their HIGHEST capability (5 → 1) and sorted by name within a group. A bundle
// with one element is shown as that element (a folder of one is noise). A composite's parts still
// hang under its element, folded, each TARGETING its canonical row (one identity per plugin).
const treeOf = new Map(this.compositionTrees.map(t => [t.nodes[0].selects, t]))
const byBundle = new Map()
for (const r of this.rows) { if (!byBundle.has(r.bundle)) byBundle.set(r.bundle, []); byBundle.get(r.bundle).push(r) }
// ★ EVERY PLUGIN IS CAPABILITY 1-5 (the Driver, 2026-09-27, replacing the Experimental section he
// asked for earlier the same day): each bundle sits in the section of its highest capability. A bundle
// ★ EVERY PLUGIN IS CAPABILITY 1-5 (2026-09-27, replacing the Experimental section added
// earlier the same day): each bundle sits in the section of its highest capability. A bundle
// whose .meta.json "stage" is not production says so on its own rows instead; the gallery reads the
// same field.
const bundles = [...byBundle.entries()].map(([bundle, rows]) => ({ bundle, rows, cap: Math.max(...rows.map(r => r.cap)) }))
@ -636,7 +635,7 @@ export default defineComponent({
// ★ ONE TREE PER COMPOSITE, built ENTIRELY from the manifest's `composes` edges — no bundle names
// or child lists live in this file, so a new composite appears here with zero edits.
//
// Depth is FULL. The Driver's acceptance test is
// Depth is FULL. The acceptance test is
// "can I point at a defect and NAME the single element responsible" — and a defect in the grid
// inside big-picture inside this studio is two levels down, so a depth-1 list could not name it.
// A child is expanded only when it is itself a composite (CAP 4+) whose bundle declares edges; a
@ -644,9 +643,9 @@ export default defineComponent({
// cycle, so a manifest that ever declares A→B→A costs one row, not a hung rail.
//
// A ref that resolves to no published plugin (big-picture's bp-research-header) is KEPT as a
// `part` row pointing at its parent. The Driver's worked example is exactly this split: Big
// Picture = research header on top + people-groups grid below, and he must be able to say which
// half is broken. Dropping the part would hide half of that answer; it cannot be a link to its
// `part` row pointing at its parent. The worked example is exactly this split: Big
// Picture = research header on top + people-groups grid below, and a reviewer must be able to say
// which half is broken. Dropping the part would hide half of that answer; it cannot be a link to its
// own page because it has none, so it opens the composite it lives in.
compositionTrees() {
const out = []
@ -979,7 +978,7 @@ export default defineComponent({
cap,
icon: CAP_ICON[cap] || 'embed',
description: p.description || '',
// CORNER WIDGET (the Driver, BUILD-CORNER-WIDGET-CLASS): a profile whose .meta.json declares
// CORNER WIDGET (BUILD-CORNER-WIDGET-CLASS): a profile whose .meta.json declares
// "widget": { "corner": ... } is mounted once in a fixed corner of the Studio, not in a pane.
widget: (p.widget && ['bottom-right', 'bottom-left', 'top-right', 'top-left'].includes(p.widget.corner)) ? p.widget.corner : '',
heavy,
@ -994,10 +993,9 @@ export default defineComponent({
out.sort((a, b) => b.cap - a.cap || a.bundle.localeCompare(b.bundle) || a.label.localeCompare(b.label))
return out
},
// ★ WHICH TAB OPENS, in priority order. Driver: "when the plugin studio opens, it doesn't by
// default select the first tab. It tells you to select an element from the list. It just needs
// to auto select the 1st tab and remember using local storage what tab I was on. If I reload
// the screen so it will go back to the previously selected tab."
// ★ WHICH TAB OPENS, in priority order. The studio used to open on "select an element from the
// list" instead of a tab. It opens the first tab, remembers in localStorage the tab you were on,
// and a reload goes back to that tab.
//
// 1. the URL hash — an explicit, shareable request always wins over a remembered one
// 2. localStorage — what you were last looking at, so a reload is not a fresh start
@ -1168,7 +1166,7 @@ export default defineComponent({
const a = (Array.isArray(e.detail) ? e.detail[0] : e.detail) || {}
if (pill.getAttribute('data-listening') !== 'true') return
pill.setAttribute('data-speaking', a.speaking ? 'true' : 'false')
// A FIXED-width pill while recording (the Driver: it resized with every word): show the newest
// A FIXED-width pill while recording (it resized with every word): show the newest
// words, cut from the front, never let the pill grow.
const w = a.words || ''
text.textContent = w.length > 34 ? '…' + w.slice(-33) : w
@ -1263,8 +1261,8 @@ export default defineComponent({
.ps-logo { display: inline-flex; align-items: center; }
.ps-logo svg { display: block; }
.ps-count { color: #6d766e; }
/* THE HEADER'S MENUS SIT ABOVE EVERY PLUGIN (Driver, 2026-09-25: "the Mapbox token menu is not on top …
it is underlapping the plugins"). The header row and the pane area are siblings with no stacking context
/* THE HEADER'S MENUS SIT ABOVE EVERY PLUGIN (2026-09-25: the Mapbox token menu was not on top;
it slid under the plugins). The header row and the pane area are siblings with no stacking context
of their own, so a menu at z-index 30 competed with each plugin's own chrome (a filter bar at 55, a drawer
at 1000) and lost. The header now stacks above the content, and the pane area is ISOLATED: whatever
z-index a plugin uses stays inside its pane. */