8.3.11 Ship Motir's BRAND chrome for cross-repo reuse — the design-system half already shipped as `@motir/design-system`
Type: code · Executor: coding_agent · RE-SCOPED 2026-08-27 by motir run MOTIR-1456, which claimed the card, verified its criteria against origin/main and the public npm registry, found two of three already delivered, and halted at guard #4 rather than build. The original body is preserved below under As authored.
Implement the decision MOTIR-1456 is now blocked by: ship Motir's brand chrome so a second Motir-owned repository (motir-marketing) can render it, by the mechanism that ADR chooses. Do not choose the mechanism here.
What is ALREADY SHIPPED — do not rebuild any of it
Story MOTIR-1524 (Epic 7, authored two days after this card, with no edge to it) delivered the extraction. Verified 2026-08-27:
| original criterion | verdict | evidence |
|---|---|---|
a versioned package builds and publishes; exports the --el-* + shape tokens + the landing primitives | SATISFIED for tokens + primitives | @motir/design-system@0.1.0 is live on public npm (published 2026-07-02T22:14:57Z, dist.shasum ed10ed8db66eb09d34d062b0b4bad878c8509fed). npm pack @motir/design-system@0.1.0, pulled anonymously, carries theme.css with 405 --el-* references and the [data-palette] (46) / [data-style] (134) / [data-type] (17) override blocks, plus Button, Card, Pill, SectionLabel, typography.js and buildThemeInitScript. — MOTIR-1526, MOTIR-1535, MOTIR-1536, MOTIR-1537 |
| motir-core consumes the package for the extracted tokens, no visual regression | SATISFIED | origin/main:app/globals.css opens @import 'tailwindcss'; @import '@motir/design-system/theme.css';. packages/design-system/ is on origin/main; the compiled CSS was proved byte-identical to the pre-swap build. — MOTIR-1527 |
| a separate repo can install + render from the package alone | MECHANISM SATISFIED | nextjs-prisma-vercel-starter carries "@motir/design-system": "^0.1.0" on origin/main, imports theme.css, renders from the package in layout.tsx / page.tsx / components/ui/index.ts, and guards it with tests/design-system-wiring.test.ts. — MOTIR-1528, MOTIR-1530 |
Nothing above is this card's work any more. These clauses are recorded as met, with evidence, rather than dropped.
What is LEFT — this card's actual scope
The brand chrome is not in the package, and that is the only reason motir-marketing still cannot render Motir's mark from a dependency. grep -c '\.brand-' returns 10 in app/globals.css and 0 in packages/design-system/theme.css. The three artifacts, all in motir-core:
components/brand/BrandMark.tsx— the lockup (lockup/mark/stacked;default/quiet/inverted)components/brand/waveBand.ts—WAVE_BAND_PATH+WAVE_BAND_VIEW_BOX- the
.brand-*block inapp/globals.css(lines 174–221)
Acceptance criteria
- The brand chrome ships by the mechanism the blocking decision chose — a new package, a subpath export, or a recorded copy — and no other; if the implementation disagrees with the ADR, amend the ADR first.
- motir-core renders its brand chrome through that mechanism with no visual change: prove it the way MOTIR-1527 did — build the compiled CSS before and after and show the chunks match, not by screenshot.
- The type-axis pin survives.
.brand-wordmust still resolvevar(--font-sans-source), the raw FACE variable, never thevar(--font-sans)ROLE token that three[data-type]blocks re-point. A test asserts it (ExploreTopBarshipped this defect once). tests/components/brand-mark.test.tsxandtests/brand/*still pass unchanged against the relocated component, or their moves are shown to be mechanical.- Every existing
BrandMarkconsumer still resolves:app/(auth)/layout.tsx,app/(authed)/_components/TopNav.tsx,app/(public)/_components/PublicTopBar.tsx,app/(public)/explore/_components/ExploreTopBar.tsx,components/onboarding/DiscoveryChatRail.tsx,components/planning/PlanChangeRail.tsx,components/planning/PlanWithAIFab.tsx. - If the mechanism publishes an artifact, the artifact-obtainable check runs before the card closes: bump the version, merge, push the release tag, and pull the published tarball anonymously from npm, quoting the digest in the PR body and on this card. The release procedure is documented in
packages/design-system/README.md→ Releasing and automated by.github/workflows/release-design-system.yml(tagdesign-system-v<x.y.z>, OIDC Trusted Publishing, noNPM_TOKEN) — the tag push is a post-merge step, not a fake one. motir-marketingis NOT touched by this card — that repo does not exist yet (MOTIR-1455). This card ships the distributable; MOTIR-1152 consumes it.
Context refs
- the blocking decision card (
blocked_by) — the ADR that chooses the mechanism motir-core/docs/decisions/design-system-package.md— the existing boundary (§1 rule, §Context consumers, §3 distribution)motir-core/packages/design-system/—package.jsonexports/files,tsup.config.ts,scripts/preserve-use-client.mjs,scripts/build-index-barrel.mjs(the RSC-safe barrel, MOTIR-1538 — reuse both post-build steps for any new mixed client/server bundle)motir-core/design/brand/design-notes.md— §3 the reference CSS, §7 the variants, §8 the accessible-name rule- blocks MOTIR-1152 (the marketing landing consumes this)
As authored (2026-06-30, superseded above)
motir-marketing is a SEPARATE repo, so it can't import motir-core's design system directly. To keep the two repos on-brand (no drift), extract the design system into a shared package both repos consume. Extract the
--el-*colour-token layer + the[data-display-style]shape tokens + the 3-axis[data-axis]override scaffolding, plus the small set of primitives a landing needs (Button, Card, the brand lockup wrapper, type scale). Publish as a versioned package; motir-core switches to consuming it so there is ONE source of truth, not a fork. Keep the package framework-light so the marketing site can server-render.Acceptance criteria: a versioned
@motir/design-systempackage builds and publishes, exporting the--el-*+ shape tokens + the landing primitives · motir-core consumes the package for at least the extracted tokens with NO visual regression · motir-marketing can install + render the brand chrome from the package alone.