A section of a poster wall (its head: the name, the count, the collapse toggle; and its cards: the preview, "show on map", the print options) is now its own component, library/components/poster/PosterSection.vue. The markup moved VERBATIM; PosterWall renders every group through it and PROVIDES what a section uses (its props, its collapse state, the print actions and their progress overlay) under POSTER_WALL_CTX. The section's CSS stays in PosterWall's one shadow-style string, which applies to this markup in the same root. Every wall renders the same DOM: measured in the shared browser, before (the pilot's built tree) vs after, at 1440 and 390, en and ar: Country Posters, UPG 100's poster wall, Poster Design's styles and the Regions list (with every region's posters open) are identical once the server port and the root's scope hash are normalised; the same cards, sections, intro text and scroll widths. The first step towards a reusable poster section. |
||
|---|---|---|
| .. | ||
| api | ||
| charts | ||
| colors | ||
| components | ||
| composables | ||
| constants | ||
| dashboards | ||
| data | ||
| elements | ||
| i18n | ||
| layouts | ||
| lists | ||
| maps | ||
| packet | ||
| packets | ||
| scripts | ||
| stores | ||
| styles | ||
| utils | ||
| vendor/cldr | ||
| index.js | ||
| ProfileLoader.vue | ||
| README.md | ||
library/ (@map) — the shared map template
The other half of the architecture (see ../plugin-designs/README.md):
every map in plugin-designs/<your-map>/ composes the reusable, parameterized pieces that live here.
Fix something here and every map benefits on the next build; break something here and every map
breaks — read components/WARNING.md before touching shared pieces.
| Folder | What lives there |
|---|---|
ProfileLoader.vue |
The root of every bundle: parses profile-config, loads the profile, provides the stores + config |
components/ |
Shared UI — map, legends, controls, popup (PeopleGroupDetail), tables, charts, hints (README) |
composables/ |
Shared logic — map engine (useMapInstance), provider switch, shadow-DOM styles, theming |
stores/ |
Per-instance Pinia stores (ui / map / data) — provided by ProfileLoader, injected by children |
api/ |
Data-source registry (sources.json) + fetch layer — the JAMstack runtime wiring |
colors/ |
Color sets maps opt into via profile-config.colorSet |
i18n/ |
The shared string catalogs (all maps speak the same languages) |
data/ |
Small shared datasets baked at build time (big served data lives in ../data/) |
constants/ |
Shared constants |
scripts/ |
Maintainer pipelines (posters, research) — not part of any bundle |
The rule of thumb (same as WARNING.md): custom code in your app-profile, reusable code here — and things only move from the first to the second once they've earned it.