feat(06-05): the 8-glyph committed maneuver set + glyphs.ts + the 18 guidance strings keys
- 8 hand-authored 32x32 SVGs per the UI-SPEC geometry table (3px stroke, square caps, orthogonal/45° only; uturn = machined staple, no arc) - glyphs.ts: GLYPH_KINDS/GLYPHS via Vite ?raw (committed files are the single source) + svgHost — the ONE sanctioned innerHTML site, a static import value - strings.ts: 18 ShellStrings keys appended in en + ms, values verbatim from the 06-UI-SPEC copywriting contract - copy-gate: COPY1 floor 40→58 + COPY8 pins all 18 guidance keys verbatim in both locales
This commit is contained in:
araharah-executor
@@ -0,0 +1,71 @@
|
||||
/*
|
||||
* glyphs.ts — the 8-glyph committed maneuver set (06-UI-SPEC "The 8-glyph set").
|
||||
* ------------------------------------------------------------------------------
|
||||
* The committed SVG files under ./glyphs/ are the SINGLE SOURCE: this module
|
||||
* imports them verbatim with Vite's `?raw` and never re-states their geometry.
|
||||
* The same files rasterize once to 256×256 PNGs for the chat turn-cards
|
||||
* (maintainer `build-glyphs.mjs`, plan 07) — one geometry, two renderings.
|
||||
* In-app the raw SVG renders inline: 32×32 on the banner's arrow plate,
|
||||
* 24×24 in the maneuver list. Strokes ride `currentColor` (signal-orange on
|
||||
* the banner plate, matte-black/outline per list row state) — the PNG build
|
||||
* injects the token literals; nothing here hardcodes a color (DSGN-01).
|
||||
*
|
||||
* svgHost is the shell's ONE sanctioned innerHTML site: the template parses
|
||||
* a STATIC import value (GLYPHS[kind], committed at build time), never a
|
||||
* name-derived or runtime string — the surface gate whitelists exactly this
|
||||
* line (guidance-surface structural case).
|
||||
*/
|
||||
import depart from "./glyphs/depart.svg?raw";
|
||||
import straight from "./glyphs/straight.svg?raw";
|
||||
import left from "./glyphs/left.svg?raw";
|
||||
import right from "./glyphs/right.svg?raw";
|
||||
import slightLeft from "./glyphs/slight-left.svg?raw";
|
||||
import slightRight from "./glyphs/slight-right.svg?raw";
|
||||
import uturn from "./glyphs/uturn.svg?raw";
|
||||
import arrive from "./glyphs/arrive.svg?raw";
|
||||
|
||||
/** The maneuver vocabulary the UI-SPEC commits (8 kinds, trip-order names —
|
||||
* RouteStep.kind maps onto these in the controller). */
|
||||
export type GlyphKind =
|
||||
| "depart"
|
||||
| "straight"
|
||||
| "left"
|
||||
| "right"
|
||||
| "slight-left"
|
||||
| "slight-right"
|
||||
| "uturn"
|
||||
| "arrive";
|
||||
|
||||
/** The 8 kinds in committed order (depart → arrive). */
|
||||
export const GLYPH_KINDS: readonly GlyphKind[] = [
|
||||
"depart",
|
||||
"straight",
|
||||
"left",
|
||||
"right",
|
||||
"slight-left",
|
||||
"slight-right",
|
||||
"uturn",
|
||||
"arrive",
|
||||
];
|
||||
|
||||
/** kind → raw SVG string of the committed file (the single source). */
|
||||
export const GLYPHS: Record<GlyphKind, string> = {
|
||||
depart,
|
||||
straight,
|
||||
left,
|
||||
right,
|
||||
"slight-left": slightLeft,
|
||||
"slight-right": slightRight,
|
||||
uturn,
|
||||
arrive,
|
||||
};
|
||||
|
||||
/** Parse a committed glyph into a live inline-SVG element. The caller sizes
|
||||
* the host (banner 32×32, list 24×24); color rides currentColor. */
|
||||
export function svgHost(kind: GlyphKind): SVGSVGElement {
|
||||
const template = document.createElement("template");
|
||||
// THE one sanctioned innerHTML site: a static import value — never a
|
||||
// name-derived or runtime string (the surface gate's exact whitelist).
|
||||
template.innerHTML = GLYPHS[kind];
|
||||
return template.content.firstElementChild as SVGSVGElement;
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="square" stroke-linejoin="miter" aria-hidden="true"><path d="M16 2 V8"/><rect x="10" y="8" width="12" height="12" fill="currentColor" stroke="none"/><polygon points="14.5,20 17.5,20 16,28" fill="currentColor" stroke="none"/></svg>
|
||||
|
After Width: | Height: | Size: 357 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="square" stroke-linejoin="miter" aria-hidden="true"><rect x="14" y="24" width="4" height="4" fill="currentColor" stroke="none"/><path d="M16 24 V4"/></svg>
|
||||
|
After Width: | Height: | Size: 282 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="square" stroke-linejoin="miter" aria-hidden="true"><path d="M16 28 V14 H8"/><path d="M13 9 L8 14 L13 19"/></svg>
|
||||
|
After Width: | Height: | Size: 240 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="square" stroke-linejoin="miter" aria-hidden="true"><path d="M16 28 V14 H24"/><path d="M19 9 L24 14 L19 19"/></svg>
|
||||
|
After Width: | Height: | Size: 242 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="square" stroke-linejoin="miter" aria-hidden="true"><path d="M20 28 L10 18"/><path d="M10 23 L10 18 L15 18"/></svg>
|
||||
|
After Width: | Height: | Size: 242 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="square" stroke-linejoin="miter" aria-hidden="true"><path d="M12 28 L22 18"/><path d="M22 23 L22 18 L17 18"/></svg>
|
||||
|
After Width: | Height: | Size: 242 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="square" stroke-linejoin="miter" aria-hidden="true"><path d="M16 28 V4"/><path d="M8 12 L16 4 L24 12"/></svg>
|
||||
|
After Width: | Height: | Size: 236 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="square" stroke-linejoin="miter" aria-hidden="true"><path d="M22 28 V8 H10 V28"/></svg>
|
||||
|
After Width: | Height: | Size: 214 B |
+84
-1
@@ -6,7 +6,8 @@
|
||||
* module, and the copy gate (web/test/copy-gate.test.mjs COPY1..COPY7) keeps
|
||||
* it verbatim against the approved UI-SPEC table in en + ms. Register labels
|
||||
* (`BOOT-01 //`, `BOOT-02 //`, `GEO // LOCATION`, `SYS // POSITION`, `ROUTE`,
|
||||
* `ROUTE // ROUTER`) are instrument vocabulary: identical in both locales by
|
||||
* `ROUTE // ROUTER`, `GUIDE`) are instrument vocabulary: identical in both
|
||||
* locales by
|
||||
* design. Tone is clinical + honest (D-01): plain statements of what is
|
||||
* stored and what is not.
|
||||
*
|
||||
@@ -58,6 +59,48 @@ export interface ShellStrings {
|
||||
ariaRouteAlternatives: string;
|
||||
/** Template — {n}/{min}/{km} placeholders are replaced in code. */
|
||||
ariaRouteChip: string;
|
||||
|
||||
/* — Phase 6 guidance chrome (06-UI-SPEC §Copywriting Contract; D-06/D-09/D-14).
|
||||
Every guidance word lives here in en + ms — never inline (the copy gates).
|
||||
Register labels (GUIDE, GUIDE // NEXT/REROUTING/…, GUIDE // T-nn) are
|
||||
instrument vocabulary composed in code from guideRegister. Tone: clinical,
|
||||
honest — the privacy promise stated once, at the exact moment it executes. */
|
||||
/** The banner/card register base word — composed with the state word in code. */
|
||||
guideRegister: string;
|
||||
/** Fallback street line for an unnamed OSM segment (D-06 street slot). */
|
||||
guideStreetUnnamed: string;
|
||||
/** REROUTING calm-state line — no blame, no apology (D-04). */
|
||||
guideReroutingLine: string;
|
||||
/** RESUMING projected-state line until the first live fix (D-06/D-11). */
|
||||
guideResumingLine: string;
|
||||
/** NO REROUTE banner line — router-pending degradation (D-03). */
|
||||
guideNoRerouteLine: string;
|
||||
/** NO REROUTE card state line — the longer honest copy (D-03). */
|
||||
guideNoRerouteBody: string;
|
||||
/** Banner toggle word, collapsed state (real-word affordance, no chevron). */
|
||||
ctaBannerList: string;
|
||||
/** Banner toggle word, expanded state. */
|
||||
ctaBannerClose: string;
|
||||
/** The guidance card's ONLY action — opens the abandon confirm card (D-09). */
|
||||
ctaEndTrip: string;
|
||||
/** The abandon-route confirm card (D-09/PX-03) — the one destructive guard. */
|
||||
guideConfirmHeadline: string;
|
||||
/** The privacy clause stated at the exact moment it executes (D-14/PRIV-01). */
|
||||
guideConfirmBody: string;
|
||||
/** Confirm primary CTA — deliberately NOT red (deliberate, not an error). */
|
||||
ctaConfirmAbandon: string;
|
||||
/** Confirm dismiss — guidance continues. */
|
||||
ctaConfirmContinue: string;
|
||||
/** Trip-ended card (D-14) — ONE card for arrival and abandon. */
|
||||
guideEndHeadline: string;
|
||||
/** Trip-end deletion copy — the TTL law's promise, visible. */
|
||||
guideEndBody: string;
|
||||
/** The maneuver list region label (list = labelled region of real text rows). */
|
||||
ariaManeuverList: string;
|
||||
/** The banner button label (one toggle: aria-expanded + aria-controls). */
|
||||
ariaBannerToggle: string;
|
||||
/** The guidance card's progress bar label. */
|
||||
ariaTripProgress: string;
|
||||
}
|
||||
|
||||
export type Locale = "en" | "ms";
|
||||
@@ -106,6 +149,26 @@ export const strings: Record<Locale, ShellStrings> = {
|
||||
ctaSearchAgain: "SEARCH AGAIN",
|
||||
ariaRouteAlternatives: "Alternative routes",
|
||||
ariaRouteChip: "Route {n}: {min} minutes, {km} kilometres",
|
||||
|
||||
guideRegister: "GUIDE",
|
||||
guideStreetUnnamed: "Unnamed road",
|
||||
guideReroutingLine: "Finding a new route from where you are.",
|
||||
guideResumingLine: "Resuming from your last known progress.",
|
||||
guideNoRerouteLine: "Rerouting unavailable on this server.",
|
||||
guideNoRerouteBody: "No road graph here — follow the drawn route; recalculation is unavailable.",
|
||||
ctaBannerList: "LIST",
|
||||
ctaBannerClose: "CLOSE",
|
||||
ctaEndTrip: "END TRIP",
|
||||
guideConfirmHeadline: "Abandon route?",
|
||||
guideConfirmBody: "Guidance stops and this trip's record is deleted. Nothing is stored.",
|
||||
ctaConfirmAbandon: "YES, ABANDON",
|
||||
ctaConfirmContinue: "CONTINUE",
|
||||
guideEndHeadline: "Trip ended",
|
||||
guideEndBody:
|
||||
"Route guidance stopped and the trip record is deleted — nothing about this drive remains.",
|
||||
ariaManeuverList: "Full maneuver list",
|
||||
ariaBannerToggle: "Next maneuver",
|
||||
ariaTripProgress: "Trip progress",
|
||||
},
|
||||
ms: {
|
||||
bootValidatingRegister: "BOOT-01 // SESSION",
|
||||
@@ -150,6 +213,26 @@ export const strings: Record<Locale, ShellStrings> = {
|
||||
ctaSearchAgain: "CARI SEMULA",
|
||||
ariaRouteAlternatives: "Laluan alternatif",
|
||||
ariaRouteChip: "Laluan {n}: {min} minit, {km} kilometer",
|
||||
|
||||
guideRegister: "GUIDE",
|
||||
guideStreetUnnamed: "Jalan tanpa nama",
|
||||
guideReroutingLine: "Mencari laluan baharu dari kedudukan anda.",
|
||||
guideResumingLine: "Sambung semula dari kemajuan terakhir anda.",
|
||||
guideNoRerouteLine: "Pengiraan semula tiada pada pelayan ini.",
|
||||
guideNoRerouteBody: "Tiada graf jalan di sini — ikut laluan yang dilukis; pengiraan semula tidak tersedia.",
|
||||
ctaBannerList: "SENARAI",
|
||||
ctaBannerClose: "TUTUP",
|
||||
ctaEndTrip: "TAMAT PERJALANAN",
|
||||
guideConfirmHeadline: "Tinggalkan laluan?",
|
||||
guideConfirmBody: "Panduan berhenti dan rekod perjalanan ini dipadam. Tiada apa-apa disimpan.",
|
||||
ctaConfirmAbandon: "YA, TINGGALKAN",
|
||||
ctaConfirmContinue: "TERUSKAN",
|
||||
guideEndHeadline: "Perjalanan tamat",
|
||||
guideEndBody:
|
||||
"Panduan laluan dihentikan dan rekod perjalanan dipadam — tiada apa-apa tentang pemanduan ini kekal.",
|
||||
ariaManeuverList: "Senarai penuh manuver",
|
||||
ariaBannerToggle: "Manuver seterusnya",
|
||||
ariaTripProgress: "Kemajuan perjalanan",
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user