Skip to content
Mercury
English
Design Book
Menu

Generate Mercury examples

Keep the explorer’s examples in step with the UI stories that define them.

The design explorer displays examples adapted from the UI component stories in fiberfx/ui/src. mg gen examples produces the modules and catalog the explorer consumes. Edit the authored stories when changing an example; generated files are outputs of that work.

Check the command and checkout

Complete First steps, then ask this build for its own command contract:

mg help gen examples

The command’s usage line is:

usage: mg gen examples [--check] [--root <dir>]

The command must list --check and --root. If gen is unknown, your build lacks the generator: use a checkout containing it before continuing. A downloaded application starter alone is not enough; the generator needs the repository’s UI sources and design-explorer directory.

From the jonnify repository root, first inspect existing changes and run the read-only check:

git diff -- sites/mercury/playgrounds/design-explorer/generated
mg gen examples --check

Exit 0 means the expected files match. MG-GEN-DRIFT with exit 1 names missing or differing files and leaves them untouched. Inspect existing edits before deciding to regenerate them.

Generate and inspect

mg gen examples
git diff --stat -- sites/mercury/playgrounds/design-explorer/generated
git diff -- sites/mercury/playgrounds/design-explorer/generated

mg writes adapted story modules, catalog.ts and manifest.json under sites/mercury/playgrounds/design-explorer/generated/. It reports counts of families, story files, modules and examples. A clean checkout may have no diff after generation; the command has reproduced the same outputs.

The adapter omits story play tests and removes Storybook types. Generating examples does not run those tests or establish that the browser interactions work. Review the generated diff alongside your source edit, then use the explorer’s own build and browser checks for behavior.

Check without writing

mg gen examples --check

After a successful generation, this should exit 0. The check compares expected outputs with the files on disk; it does not rewrite drift away. Use it in automation to detect a source change whose generated outputs were not updated.

From another directory, supply the checkout explicitly:

mg gen examples --check --root "$HOME/dev/jonnify"

Replace that example path with your actual checkout. Without --root, mg searches upward from the current directory.

Understand a refusal

A wrong checkout or extra positional argument is a usage error, exit 2: correct the path or command. MG-GEN-DRIFT is exit 1: review changes, regenerate when appropriate and check again. Other source refusals mean an input cannot be adapted under the generator’s rules; use the named source and diagnostic to fix it. An I/O failure is exit 3; resolve the file access problem before retrying.

Next, keep these distinctions in automation.