@tamagui/cli 2.7.7 → 3.0.0-beta.1093.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,157 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
+ var __getOwnPropNames = Object.getOwnPropertyNames;
4
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
5
+ var __export = (target, all) => {
6
+ for (var name in all) __defProp(target, name, {
7
+ get: all[name],
8
+ enumerable: true
9
+ });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
14
+ get: () => from[key],
15
+ enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
16
+ });
17
+ }
18
+ return to;
19
+ };
20
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
21
+ var setup_prompt_exports = {};
22
+ __export(setup_prompt_exports, {
23
+ getSetupPrompt: () => getSetupPrompt,
24
+ printSetupPrompt: () => printSetupPrompt
25
+ });
26
+ module.exports = __toCommonJS(setup_prompt_exports);
27
+ function printSetupPrompt() {
28
+ process.stdout.write(getSetupPrompt());
29
+ }
30
+ function getSetupPrompt() {
31
+ return `You are adding Tamagui v3 to a project that does not use it yet.
32
+
33
+ Work like a careful coding agent:
34
+
35
+ - Read the project first: package manager, bundler, framework, TypeScript config,
36
+ and whether it targets web, native, or both. Every choice below depends on it.
37
+ - Make the smallest install that actually runs, then verify it before adding more.
38
+ - Do not restyle existing components as part of setup.
39
+ - Do not publish packages, rotate secrets, or change production infrastructure.
40
+ - Stop and report if a step cannot be completed rather than guessing around it.
41
+
42
+ ## 1. Check the baseline
43
+
44
+ Tamagui v3 requires React 19+, TypeScript 5+, and, for native apps, React Native
45
+ 0.81+ with the New Architecture enabled. Web-only apps have no React Native
46
+ version requirement. If the project is below any of these, say so and stop.
47
+
48
+ ## 2. Install
49
+
50
+ Tamagui v3 is currently a beta on the \`beta\` dist-tag. Resolve it once and pin
51
+ every package to the same version, because a mixed install silently produces two
52
+ copies of the runtime and styles that do nothing.
53
+
54
+ \`\`\`bash
55
+ V=$(npm view tamagui@beta version)
56
+ npm i tamagui@$V @tamagui/config@$V
57
+ \`\`\`
58
+
59
+ \`tamagui\` is a superset of \`@tamagui/core\`. Install \`@tamagui/core\` alone
60
+ only for a styling-only install with no UI kit.
61
+
62
+ ## 3. Create the config
63
+
64
+ \`\`\`tsx
65
+ // tamagui.config.ts
66
+ import { defaultConfig } from '@tamagui/config/v6'
67
+ import { createTamagui } from 'tamagui'
68
+
69
+ export const config = createTamagui(defaultConfig)
70
+
71
+ declare module 'tamagui' {
72
+ interface TamaguiCustomConfig extends typeof config {}
73
+ }
74
+ \`\`\`
75
+
76
+ Pick an animation driver explicitly and import it from \`@tamagui/config\`:
77
+ \`animations-css\` (web), \`animations-rn\`, \`animations-reanimated\`, or
78
+ \`animations-motion\`. Do not install \`@tamagui/theme-builder\` or any v5 builder
79
+ package; they are not part of v3.
80
+
81
+ ## 4. Wrap the app
82
+
83
+ \`\`\`tsx
84
+ import { TamaguiProvider, View } from 'tamagui'
85
+ import { config } from './tamagui.config'
86
+
87
+ export default function App() {
88
+ return (
89
+ <TamaguiProvider config={config} defaultTheme="light">
90
+ <View width={200} height={200} bg="background" />
91
+ </TamaguiProvider>
92
+ )
93
+ }
94
+ \`\`\`
95
+
96
+ ## 5. Wire the bundler
97
+
98
+ Add the adapter for the bundler this project actually uses, and no others:
99
+
100
+ - Vite: \`@tamagui/vite-plugin\`, or \`@tamagui/cli/vite\`
101
+ - Metro: \`@tamagui/metro-plugin\`, or \`@tamagui/cli/metro\`
102
+ - Next.js: \`@tamagui/next-plugin\`
103
+ - Turbopack: the \`tamagui build\` precompile step
104
+
105
+ There is no Webpack plugin in v3.
106
+
107
+ The compiler is an optimization, not a requirement. If wiring it is not
108
+ straightforward, skip it, note that you skipped it, and confirm the app runs
109
+ first.
110
+
111
+ ## 6. Write styles the v3 way
112
+
113
+ This is the part most likely to be written as if it were v2. In v3, token and
114
+ theme names are bare, and conditions are flat clauses inside the value:
115
+
116
+ \`\`\`tsx
117
+ <View bg="background hover:background-hover" p="4 sm:6" />
118
+ \`\`\`
119
+
120
+ - No \`$\` sigils: \`bg="background"\`, not \`bg="$background"\`.
121
+ - No condition objects: there is no \`hoverStyle={{ ... }}\` and no \`$sm={{ ... }}\`.
122
+ - Modifiers chain left to right and read as prefixes: \`hover:sm:small\`.
123
+ - Clauses work on variant props too, not just style props, so
124
+ \`size="large sm:small"\` selects a different variant value per condition.
125
+ - When two clauses both apply, the winner is decided by specificity, not by
126
+ source order: first by platform (\`ios:\` beats \`native:\` beats unprefixed),
127
+ then by how many conditions the clause carries, then by category
128
+ (media < container < theme < group < state). Writing a clause later in the
129
+ string does not make it win.
130
+ - A chain is capped at five distinct non-platform conditions.
131
+
132
+ ## 7. Verify before reporting success
133
+
134
+ \`\`\`bash
135
+ npx tamagui check
136
+ \`\`\`
137
+
138
+ \`tamagui check\` reports version mismatches, duplicate installs, lockfile
139
+ problems, a missing config, and any v2 style syntax left in source. Then run the
140
+ project's own typecheck and build, and start the app and confirm a Tamagui
141
+ component renders with its styles applied. A passing typecheck is not sufficient:
142
+ flat values are strings, so a misspelled token compiles cleanly and only shows up
143
+ at runtime.
144
+
145
+ ## 8. Give the agent the project's own vocabulary
146
+
147
+ Once the app runs, generate a description of this project's actual tokens,
148
+ themes, and components so later prompts do not guess at them:
149
+
150
+ \`\`\`bash
151
+ npx tamagui generate-prompt
152
+ \`\`\`
153
+
154
+ That writes \`tamagui-prompt.md\`. Keep it in the repo and regenerate it when the
155
+ config changes.
156
+ `;
157
+ }