🥮 mooncakes.io

    moonvis

    Versioned visual tokens and provenance-bound assets for MoonSuite products.

    moonbit
    design-system
    accessibility
    provenance
    moonsuite
    Download zip
    Author
    Version
    0.1.0
    License
    Apache-2.0
    Repository
    Last updated
    3 months ago
    Downloads
    32

    #MoonVis

    Design system · working guidance repository. Read the product contract for adoption, ownership, verification and release gates.

    MoonVis is the visual identity and guidance surface for MoonSuite. The current repo began as an imported visual-guidance design bundle, but it now carries a versioned MoonBit token/asset system, provenance-bound MoonSuite mark assets, a first-class Rabbita bundle inspector, and the original Vite/React reference app.

    #Scope And Boundary

    MoonVis owns:

    • MoonSuite mark source assets and exported visual variants
    • design-system guidance that can be reused by other MoonSuite products
    • visual inspection UI for reviewing marks, palettes, and guidance screens
    • deterministic product/channel resolution into a content-addressed bundle manifest
    • product-home layout helpers for MoonVis state, cache, temp, and accepted outputs

    MoonVis does not own Moondesk UI implementation, Rabbita components, Lepusa native runtime behavior, or product-specific workflows. Other products may copy accepted assets or consume exported guidelines, but product UI behavior belongs in the product that ships it.

    #Implementation Map

    • visual_system/: canonical MoonBit tokens, asset provenance, product/channel adaptations, contrast expectations, and deterministic resolver.
    • suite_adapter/, adapter_runtime/, cmd/moonvis_adapter/: exact MoonFlow v2 capability declaration, durable execution/reconciliation, and short-lived health evidence.
    • ui/rabbita-moonvis/: supported Rabbita bundle-inspection application.
    • pack.json, schemas/, adapters/: versioned pack contract.
    • src/app/: legacy React/Vite visual-reference app.
    • src/imports/: source and generated MoonSuite mark assets.
    • src/styles/: theme and global style layers.
    • src/moonsuiteLayout.js: MoonSuite product-home path adapter.
    • scripts/moonsuite-layout.mjs: CLI probe for the layout adapter.
    • scripts/fresh-suite-product-home-smoke.sh: fresh-root product-home smoke.
    • HANDBOOK.md: human-facing visual-system handover and adoption guide.
    • guidelines/Guidelines.md: concise implementation and AI-generation rules.
    • ATTRIBUTIONS.md: asset and design provenance.

    #Learning And Adoption

    Start with HANDBOOK.md. It explains the visual direction, tokens, spatial model, component semantics, product adaptation dial, Design I/O workflow, evaluation gate, migration process, and working templates.

    Agents and implementation tools should also load guidelines/Guidelines.md as the compact execution contract. The rendered app remains the visual reference.

    #Running The App

    Install dependencies and start the dev server:

    npm install
npm run dev

    Build the static app:

    npm run build

    Run the supported Rabbita inspector:

    cd ui/rabbita-moonvis
npm install
npm run dev

    Inspect the exact capability and canonical catalog:

    moon run cmd/moonvis_adapter -- declaration
moon run cmd/moonvis_adapter -- catalog

    Probe MoonSuite layout paths:

    node scripts/moonsuite-layout.mjs ~/moonsuite demo-book

    #Testing Guidance

    For token, capability, or Rabbita changes, run:

    moon check
moon test visual_system suite_adapter adapter_runtime
cd ui/rabbita-moonvis && npm run build

    For the legacy reference app or layout-helper changes, run:

    npm run build
scripts/fresh-suite-product-home-smoke.sh

    When changing visible UI, inspect the app in a browser at desktop and mobile widths. Confirm that primary assets load from src/imports, text does not overflow controls, and the palette still works against the intended MoonSuite brand surfaces.

    #Worth Noticing

    • Do not treat generated design-bundle code as product architecture. Keep the MoonSuite guidance and asset ownership explicit in docs and source names.
    • Product-home paths should match MoonLib's suite layout even though this repo uses JavaScript helpers today.
    • Do not commit dist/, node_modules/, or generated screenshots unless a release process explicitly requires them.
    • Asset variants should remain inspectable by source/provenance, not only by final filename.

    #Future Plan

    • Record two real product adoptions and compare their expected bundle version against the resolved manifest in CI.
    • Add per-screen runtime contrast evidence for translucent and video surfaces.
    • Confirm external redistribution rights for every mark variant before public asset-pack distribution.
    • Keep the React reference clearly separated from the supported Rabbita inspection surface and the canonical MoonBit source.

    Powered by MoonBit

    Site sourceReport issueModulesSkillsCLIBuild queueStatistics

    © 2026 mooncakes.io