tamagui-best-practices
Tamagui Best Practices
Tamagui v1.x patterns beyond fundamentals: Config v4, compiler optimization, compound components, and gotchas.
Reference Files — Read Before Writing Code
| Context | File | What it covers |
|---|---|---|
| Dialog, Sheet, modal overlays | @DIALOG_PATTERNS.md | Adapt component, accessibility |
| Form, Input, Label, validation | @FORM_PATTERNS.md | zod integration |
| Animations, transitions | @ANIMATION_PATTERNS.md | drivers, enterStyle/exitStyle |
| Popover, Tooltip, Select | @OVERLAY_PATTERNS.md | overlay primitives |
| Compiler optimization | @COMPILER_PATTERNS.md | what the compiler can/cannot flatten |
| Design tokens, theming | @DESIGN_SYSTEM.md | palette, token structure |
Config v4
Minimal setup with @tamagui/config/v4. Add styleCompat: 'react-native' for new projects to align flexBasis with React Native behavior:
More from 0xbigboss/claude-code
react-best-practices
Use when reading or writing React components (.tsx, .jsx files with React imports).
2.6Ktypescript-best-practices
Use when reading or writing TypeScript or JavaScript files (.ts, .tsx, .js, tsconfig.json).
2.1Kpython-best-practices
Use when reading or writing Python files (.py, pyproject.toml, requirements.txt).
1.3Kweb-fetch
Fetches web content as clean markdown by preferring markdown-native responses and falling back to selector-based HTML extraction. Use for documentation, articles, and reference pages at http/https URLs.
780zig-best-practices
Use when reading or writing Zig files (.zig, build.zig, build.zig.zon).
349nix-best-practices
Use when working with Nix flakes, overlays, shell.nix, or flake.nix files.
318