What is in a prompt
A prompt is a code carrier, not a description. Here is exactly what lands on your clipboard.
It is a code carrier
The word "prompt" is misleading if you picture a description. Roughly ninety-five percent of what lands on your clipboard is literal source code. The rest is a short instruction shell telling the agent where files go and what to install. The agent is pasting and wiring, never designing, which is why the result is an exact match rather than an interpretation.
What is in the block
- A one-line statement of the task and the SDK the design targets.
- The rules: replicate 1:1, create every file in full, do not substitute libraries.
- Every file, verbatim, with the path it should be written to.
- The exact dependency list, installed with npx expo install so versions match your SDK.
- A font-loading snippet for your app root, if the design uses custom fonts.
- Setup notes that actually bite: the Reanimated Babel plugin, the gesture-handler root view.
- How to wire it into Expo Router or React Navigation, whichever you have.
The shape of the shell
You are given the task of integrating an existing React Native screen
into an Expo codebase.
RULES, non-negotiable:
- Replicate the design 1:1. Do NOT change any color, font, size, spacing,
radius, wording, or animation value. Do not adapt the design to this
project's existing theme, colors, tokens, or components.
- Create every file below IN FULL. Never abbreviate, never use placeholders.
- Do not substitute libraries.
Create this file at components/clean-settings/screen.tsx:
...The code is yours
Once pasted it is ordinary source in your repo. Edit it, refactor it, delete half of it. There is no runtime dependency on us and nothing phones home.
Copy code instead
The Code tab on any design gives you the raw files with no instruction shell, for when you would rather integrate by hand. Same content, different packaging.