@wangs-ui/create-react-app 1.0.38 → 1.0.40

package/dist/bin.js

@@ -7,6 +7,7 @@ import { styleText } from "node:util";
 import * as l from "node:readline";
 import l__default from "node:readline";
 import { ReadStream } from "node:tty";
+import { execSync } from "node:child_process";
 //#region \0rolldown/runtime.js
 var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports);
 //#endregion
@@ -645,6 +646,23 @@ var V = class {
 		}
 	}
 };
+var r = class extends V {
+	get cursor() {
+		return this.value ? 0 : 1;
+	}
+	get _value() {
+		return this.cursor === 0;
+	}
+	constructor(t) {
+		super(t, false), this.value = !!t.initialValue, this.on("userInput", () => {
+			this.value = this._value;
+		}), this.on("confirm", (i) => {
+			this.output.write(import_src.cursor.move(0, -1)), this.value = i, this.state = "submit", this.close();
+		}), this.on("cursor", () => {
+			this.value = !this.value;
+		});
+	}
+};
 var a = class extends V {
 	options;
 	cursor = 0;
@@ -812,6 +830,35 @@ var limitOptions = ({ cursor: l, options: e, style: w, output: p = process.stdou
 	for (const t of s) for (const n of t) x.push(n);
 	return c && x.push(M), x;
 };
+var confirm = (i) => {
+	const a = i.active ?? "Yes", s = i.inactive ?? "No";
+	return new r({
+		active: a,
+		inactive: s,
+		signal: i.signal,
+		input: i.input,
+		output: i.output,
+		initialValue: i.initialValue ?? true,
+		render() {
+			const e = i.withGuide ?? settings.withGuide, u = `${symbol(this.state)}  `, l = e ? `${styleText("gray", S_BAR)}  ` : "", f = wrapTextWithPrefix(i.output, i.message, l, u), o = `${e ? `${styleText("gray", S_BAR)}
+` : ""}${f}
+`, c = this.value ? a : s;
+			switch (this.state) {
+				case "submit": return `${o}${e ? `${styleText("gray", S_BAR)}  ` : ""}${styleText("dim", c)}`;
+				case "cancel": return `${o}${e ? `${styleText("gray", S_BAR)}  ` : ""}${styleText(["strikethrough", "dim"], c)}${e ? `
+${styleText("gray", S_BAR)}` : ""}`;
+				default: {
+					const r = e ? `${styleText("cyan", S_BAR)}  ` : "", g = e ? styleText("cyan", S_BAR_END) : "";
+					return `${o}${r}${this.value ? `${styleText("green", S_RADIO_ACTIVE)} ${a}` : `${styleText("dim", S_RADIO_INACTIVE)} ${styleText("dim", a)}`}${i.vertical ? e ? `
+${styleText("cyan", S_BAR)}  ` : `
+` : ` ${styleText("dim", "/")} `}${this.value ? `${styleText("dim", S_RADIO_INACTIVE)} ${styleText("dim", s)}` : `${styleText("green", S_RADIO_ACTIVE)} ${s}`}
+${g}
+`;
+				}
+			}
+		}
+	}).prompt();
+};
 var MULTISELECT_INSTRUCTIONS = [
 	`${styleText("dim", "↑/↓")} to navigate`,
 	`${styleText("dim", "Space:")} select`,
@@ -1122,7 +1169,53 @@ function copyProjectTemplate(options) {
 	}
 }
 //#endregion
-//#region ../skills/dist/src-jXDDgaDm.js
+//#region src/utils/git.ts
+function initGitRepository(targetDir) {
+	try {
+		if (fs.existsSync(path.join(targetDir, ".git"))) return false;
+		try {
+			execSync("git init -b main", {
+				cwd: targetDir,
+				stdio: "ignore"
+			});
+		} catch {
+			execSync("git init", {
+				cwd: targetDir,
+				stdio: "ignore"
+			});
+		}
+	} catch {
+		return false;
+	}
+	try {
+		execSync("git add -A", {
+			cwd: targetDir,
+			stdio: "ignore"
+		});
+		let hasAuthor = true;
+		try {
+			execSync("git config user.name", {
+				cwd: targetDir,
+				stdio: "ignore"
+			});
+		} catch {
+			hasAuthor = false;
+		}
+		if (hasAuthor) execSync("git commit -m \"chore: initial commit from @wangs-ui/create-react-app\"", {
+			cwd: targetDir,
+			stdio: "ignore"
+		});
+		else execSync("git -c user.name=\"Wangs UI Scaffolder\" -c user.email=\"dev@wangs-ui.internal\" commit -m \"chore: initial commit from @wangs-ui/create-react-app\"", {
+			cwd: targetDir,
+			stdio: "ignore"
+		});
+		return true;
+	} catch {
+		return false;
+	}
+}
+//#endregion
+//#region ../skills/dist/src-ER4GIzua.js
 var SKILL_default$5 = "---\nname: create-form\ndescription: Real-world patterns for building strongly-typed forms, multipart file uploads, server validation mapping, and dirty tracking with @wangs-ui/form.\n---\n\n# Skill: Real-World Form Workflows with `@wangs-ui/form`\n\nUse this skill when building CRUD forms, data entry dialogs, multi-field settings pages, or multipart forms in Wangs UI applications.\n\n---\n\n## 1. MCP Inspection Step (Before Building Fields)\n\nBefore implementing specific input controls, query the MCP server to inspect their exact prop signatures:\n\n- `get-documentation({ id: \"select\" })` — Check option formats (`{ label, value }` vs object).\n- `get-documentation({ id: \"datepicker\" })` — Check `selectionMode` (`single`, `range`, `multiple`) and date format props.\n- `get-documentation({ id: \"multiselect\" })` — Check chips display and filter behavior.\n- `get-documentation({ id: \"fileupload\" })` — Check accepted mime types and upload handlers.\n\n---\n\n## 2. Recipe 1: Standard CRUD Form with Server Validation Mapping\n\nReal-world forms must handle async submission, loading state, and map backend validation errors back into `<Field>` errors:\n\n```tsx\nimport React, { useState } from 'react';\nimport Card from '@wangs-ui/react-core/primitive/card';\nimport Button from '@wangs-ui/react-core/primitive/button';\nimport InputText from '@wangs-ui/react-core/primitive/inputtext';\nimport Select from '@wangs-ui/react-core/primitive/select';\nimport { Form, Field } from '@wangs-ui/react-core';\nimport { useFormControl } from '@wangs-ui/form';\nimport { useI18n } from '@wangs-ui/react-i18n';\n\ninterface UserFormValues {\n  fullName: string;\n  email: string;\n  role: string;\n}\n\nexport default function UserForm({ onSuccess }: { onSuccess?: () => void }) {\n  const { t } = useI18n();\n  const formControl = useFormControl<UserFormValues>({ type: 'json' });\n  const [isSubmitting, setIsSubmitting] = useState(false);\n\n  const roleOptions = [\n    { label: t('Administrator'), value: 'admin' },\n    { label: t('Operator'), value: 'operator' },\n    { label: t('Viewer'), value: 'viewer' },\n  ];\n\n  const handleSubmit = async (values: UserFormValues) => {\n    setIsSubmitting(true);\n    try {\n      // Execute API call: await api.createUser(values);\n      onSuccess?.();\n    } catch (err: any) {\n      // Map server validation error directly to field\n      if (err?.fieldErrors?.email) {\n        formControl.setError('email', {\n          type: 'server',\n          message: err.fieldErrors.email,\n        });\n      }\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  return (\n    <Card className=\"p-6\">\n      <Form control={formControl} onSubmit={handleSubmit} className=\"flex flex-col gap-m\">\n        <h2 className=\"heading-2\">{t('User Information')}</h2>\n\n        {/* Text Field */}\n        <Field<string>\n          name=\"fullName\"\n          label={t('Full Name')}\n          required\n          rules={{ required: t('Full name is required') }}\n        >\n          {(field) => (\n            <InputText {...field} placeholder={t('e.g. Jane Doe')} value={field.value || ''} />\n          )}\n        </Field>\n\n        {/* Email Field with Regex Validation */}\n        <Field<string>\n          name=\"email\"\n          label={t('Email Address')}\n          required\n          rules={{\n            required: t('Email is required'),\n            pattern: {\n              value: /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/,\n              message: t('Enter a valid email address'),\n            },\n          }}\n        >\n          {(field) => (\n            <InputText {...field} placeholder={t('name@company.com')} value={field.value || ''} />\n          )}\n        </Field>\n\n        {/* Select Dropdown Field */}\n        <Field<string>\n          name=\"role\"\n          label={t('Access Role')}\n          required\n          rules={{ required: t('Role selection is required') }}\n        >\n          {(field) => (\n            <Select\n              {...field}\n              options={roleOptions}\n              placeholder={t('Select role')}\n              value={field.value}\n              onChange={(e) => field.onChange(e.value)}\n            />\n          )}\n        </Field>\n\n        {/* Form Actions */}\n        <div className=\"flex justify-end gap-s pt-s\">\n          <Button\n            type=\"button\"\n            variant=\"text\"\n            label={t('Reset')}\n            onClick={() => formControl.reset()}\n            disabled={isSubmitting}\n          />\n          <Button type=\"submit\" label={t('Save User')} severity=\"primary\" loading={isSubmitting} />\n        </div>\n      </Form>\n    </Card>\n  );\n}\n```\n\n---\n\n## 3. Recipe 2: Multipart Form (File Upload + Metadata)\n\nFor file uploads (avatar, attachment, documents), set `type: 'formdata'`:\n\n```tsx\nimport { useFormControl } from '@wangs-ui/form';\n\ninterface ProfileUploadValues {\n  displayName: string;\n  avatar: File | null;\n}\n\n// Generates FormData under the hood\nconst formControl = useFormControl<ProfileUploadValues>({ type: 'formdata' });\n```\n\n---\n\n## 4. Key Implementation Rules\n\n1. **Always Use `<Form>` & `<Field>`**: Never bind raw uncontrolled inputs.\n2. **Translate All Labels & Error Messages**: Wrap text in `t('...')`.\n3. **Handle Loading State**: Disable reset buttons and set `loading={isSubmitting}` on submit buttons.\n";
 var SKILL_default$4 = "---\nname: data-table\ndescription: Real-world patterns for building full CRUD DataTables with server pagination, search filters, batch actions, and confirmation modals.\n---\n\n# Skill: Real-World DataTable & Filter Workflows\n\nUse this skill when building administrative grids, filtered listing pages, or management dashboards with `@wangs-ui/react-core`.\n\n---\n\n## 1. MCP Inspection Step (Before Building Table)\n\nQuery the MCP server to inspect supported features and slots:\n\n- `get-documentation({ id: \"datatable\" })` — Check `paginator`, `lazy`, `onPage`, `onSort`, `selectionMode`, and `dataKey`.\n- `get-documentation({ id: \"column\" })` — Check `body` template, `sortable`, `frozen`, and `headerStyle`.\n- `get-documentation({ id: \"tag\" })` — Check severity colors for status pill badges (`success`, `warning`, `danger`, `info`).\n\n---\n\n## 2. Recipe: Full CRUD Data Grid with Filter Toolbar & Batch Actions\n\n```tsx\nimport React, { useState } from 'react';\nimport DataTable, { Column } from '@wangs-ui/react-core/primitive/datatable';\nimport Button from '@wangs-ui/react-core/primitive/button';\nimport InputText from '@wangs-ui/react-core/primitive/inputtext';\nimport Select from '@wangs-ui/react-core/primitive/select';\nimport Tag from '@wangs-ui/react-core/primitive/tag';\nimport Dialog from '@wangs-ui/react-core/primitive/dialog';\nimport Card from '@wangs-ui/react-core/primitive/card';\nimport { useI18n } from '@wangs-ui/react-i18n';\nimport { SearchLine, DeleteBin6Line, EditLine, AddLine } from '@wangs-ui/react-icons';\n\ninterface CustomerRecord {\n  id: string;\n  name: string;\n  email: string;\n  status: 'active' | 'pending' | 'suspended';\n  createdAt: string;\n}\n\nexport default function CustomerManagementView() {\n  const { t } = useI18n();\n  const [records, setRecords] = useState<CustomerRecord[]>([]);\n  const [loading, setLoading] = useState(false);\n  const [searchQuery, setSearchQuery] = useState('');\n  const [selectedStatus, setSelectedStatus] = useState<string | null>(null);\n  const [selectedRows, setSelectedRows] = useState<CustomerRecord[]>([]);\n  const [deleteTarget, setDeleteTarget] = useState<CustomerRecord | null>(null);\n\n  // Status Badge Template\n  const statusTemplate = (row: CustomerRecord) => {\n    const severityMap: Record<string, 'success' | 'warning' | 'danger'> = {\n      active: 'success',\n      pending: 'warning',\n      suspended: 'danger',\n    };\n    return <Tag value={t(row.status)} severity={severityMap[row.status] || 'info'} />;\n  };\n\n  // Row Actions Template\n  const actionsTemplate = (row: CustomerRecord) => (\n    <div className=\"flex items-center gap-xs\">\n      <Button\n        variant=\"text\"\n        icon={<EditLine />}\n        aria-label={t('Edit')}\n        onClick={() => console.log('Edit', row.id)}\n      />\n      <Button\n        variant=\"text\"\n        severity=\"danger\"\n        icon={<DeleteBin6Line />}\n        aria-label={t('Delete')}\n        onClick={() => setDeleteTarget(row)}\n      />\n    </div>\n  );\n\n  return (\n    <Card className=\"flex flex-col gap-m p-6\">\n      {/* 1. Filter & Search Toolbar */}\n      <div className=\"flex flex-wrap items-center justify-between gap-s\">\n        <div className=\"flex flex-wrap items-center gap-s\">\n          <InputText\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            placeholder={t('Search customer...')}\n            className=\"w-64\"\n          />\n          <Select\n            value={selectedStatus}\n            options={[\n              { label: t('All Statuses'), value: null },\n              { label: t('Active'), value: 'active' },\n              { label: t('Pending'), value: 'pending' },\n              { label: t('Suspended'), value: 'suspended' },\n            ]}\n            onChange={(e) => setSelectedStatus(e.value)}\n            placeholder={t('Filter status')}\n          />\n        </div>\n\n        <Button label={t('Add Customer')} icon={<AddLine />} severity=\"primary\" />\n      </div>\n\n      {/* 2. Batch Selection Action Bar */}\n      {selectedRows.length > 0 && (\n        <div className=\"flex items-center justify-between rounded bg-primary-50 px-4 py-2 text-primary-900\">\n          <span className=\"p font-medium\">\n            {t('{{count}} items selected', { count: selectedRows.length })}\n          </span>\n          <Button\n            size=\"small\"\n            severity=\"danger\"\n            label={t('Delete Selected')}\n            icon={<DeleteBin6Line />}\n            onClick={() => console.log('Batch delete', selectedRows)}\n          />\n        </div>\n      )}\n\n      {/* 3. Paginated DataTable */}\n      <DataTable\n        value={records}\n        loading={loading}\n        selection={selectedRows}\n        onSelectionChange={(e) => setSelectedRows(e.value)}\n        dataKey=\"id\"\n        paginator\n        rows={10}\n        rowsPerPageOptions={[10, 25, 50]}\n        emptyMessage={t('No customers found')}\n      >\n        <Column selectionMode=\"multiple\" headerStyle={{ width: '3rem' }} />\n        <Column field=\"name\" header={t('Customer Name')} sortable />\n        <Column field=\"email\" header={t('Email')} sortable />\n        <Column field=\"status\" header={t('Status')} body={statusTemplate} sortable />\n        <Column header={t('Actions')} body={actionsTemplate} headerStyle={{ width: '6rem' }} />\n      </DataTable>\n\n      {/* 4. Delete Confirmation Dialog */}\n      <Dialog\n        visible={!!deleteTarget}\n        onHide={() => setDeleteTarget(null)}\n        header={t('Delete Customer')}\n        footer={\n          <div className=\"flex justify-end gap-xs\">\n            <Button variant=\"text\" label={t('Cancel')} onClick={() => setDeleteTarget(null)} />\n            <Button\n              severity=\"danger\"\n              label={t('Delete')}\n              onClick={() => {\n                // Execute delete API\n                setDeleteTarget(null);\n              }}\n            />\n          </div>\n        }\n      >\n        <p className=\"p\">\n          {t('Are you sure you want to delete {{name}}?', { name: deleteTarget?.name })}\n        </p>\n      </Dialog>\n    </Card>\n  );\n}\n```\n\n---\n\n## 3. Mandatory Best Practices\n\n1. **Always Supply `dataKey`**: Never enable row selection without `dataKey=\"id\"`.\n2. **Translate All Headers & Messages**: Pass table headers and empty state messages into `t()`.\n3. **Control Batch Action Appearance**: Show batch action banner only when `selectedRows.length > 0`.\n";
 var SKILL_default$3 = "---\nname: dialog-modal\ndescription: Real-world patterns for modal forms, async confirmation workflows, and multi-step dialogs with Wangs UI Dialog and Modal components.\n---\n\n# Skill: Real-World Dialog & Modal Workflows\n\nUse this skill when building interactive modals, create/edit modal forms, destructive action confirmations, or slide-in overlay panels.\n\n---\n\n## 1. MCP Inspection Step (Before Implementing Overlays)\n\nQuery the MCP server to check overlay configuration and animation options:\n\n- `get-documentation({ id: \"dialog\" })` — Check `header`, `footer`, `visible`, `onHide`, `modal`, and `dismissableMask`.\n- `get-documentation({ id: \"modal\" })` — Check fullscreen modes, size variants, and slide-in drawer options.\n- `get-documentation({ id: \"toast\" })` — Check severity toasts (`success`, `error`, `info`, `warn`) to trigger after modal actions.\n\n---\n\n## 2. Recipe: Create/Edit Form inside a Modal Dialog\n\nThis real-world recipe coordinates a modal wrapper with an embedded `@wangs-ui/form`, handles saving state, prevents accidental dismiss while saving, and resets state upon close:\n\n```tsx\nimport React, { useState, useEffect } from 'react';\nimport Dialog from '@wangs-ui/react-core/primitive/dialog';\nimport Button from '@wangs-ui/react-core/primitive/button';\nimport InputText from '@wangs-ui/react-core/primitive/inputtext';\nimport { Form, Field } from '@wangs-ui/react-core';\nimport { useFormControl } from '@wangs-ui/form';\nimport { useI18n } from '@wangs-ui/react-i18n';\n\ninterface EditItemModel {\n  title: string;\n  code: string;\n}\n\ninterface ItemModalProps {\n  visible: boolean;\n  item?: EditItemModel | null;\n  onHide: () => void;\n  onSaved: (item: EditItemModel) => void;\n}\n\nexport default function ItemFormModal({ visible, item, onHide, onSaved }: ItemModalProps) {\n  const { t } = useI18n();\n  const formControl = useFormControl<EditItemModel>({ type: 'json' });\n  const [saving, setSaving] = useState(false);\n\n  // Sync form values when modal opens or item changes\n  useEffect(() => {\n    if (visible) {\n      formControl.reset(item || { title: '', code: '' });\n    }\n  }, [visible, item]);\n\n  const handleFormSubmit = async (values: EditItemModel) => {\n    setSaving(true);\n    try {\n      // Execute API call: await api.save(values);\n      onSaved(values);\n      onHide();\n    } finally {\n      setSaving(false);\n    }\n  };\n\n  const footerActions = (\n    <div className=\"flex justify-end gap-xs\">\n      <Button type=\"button\" variant=\"text\" label={t('Cancel')} onClick={onHide} disabled={saving} />\n      <Button\n        type=\"submit\"\n        form=\"modal-item-form\"\n        label={item ? t('Save Changes') : t('Create Item')}\n        severity=\"primary\"\n        loading={saving}\n      />\n    </div>\n  );\n\n  return (\n    <Dialog\n      visible={visible}\n      onHide={() => !saving && onHide()}\n      header={item ? t('Edit Item') : t('New Item')}\n      footer={footerActions}\n      style={{ width: '450px' }}\n      modal\n    >\n      <Form\n        id=\"modal-item-form\"\n        control={formControl}\n        onSubmit={handleFormSubmit}\n        className=\"flex flex-col gap-m pt-xs\"\n      >\n        <Field<string>\n          name=\"title\"\n          label={t('Item Title')}\n          required\n          rules={{ required: t('Title is required') }}\n        >\n          {(field) => (\n            <InputText {...field} placeholder={t('Enter title')} value={field.value || ''} />\n          )}\n        </Field>\n\n        <Field<string>\n          name=\"code\"\n          label={t('Item Code')}\n          required\n          rules={{ required: t('Code is required') }}\n        >\n          {(field) => (\n            <InputText {...field} placeholder={t('e.g. SKU-100')} value={field.value || ''} />\n          )}\n        </Field>\n      </Form>\n    </Dialog>\n  );\n}\n```\n\n---\n\n## 3. Mandatory Best Practices\n\n1. **Decouple Submit Button from Form Body**: Use `form=\"modal-item-form\"` on the submit button inside `footer` so actions stay neatly aligned in the footer bar.\n2. **Prevent Close During Mutation**: Guard `onHide={() => !saving && onHide()}` to prevent accidental dismissal during in-flight network requests.\n3. **Always Reset on Open**: Sync initial values in an effect keyed on `visible`.\n";
@@ -1285,7 +1378,7 @@ function getRunCommand(pm, script) {
 //#region src/index.ts
 var __dirname = path.dirname(fileURLToPath(import.meta.url));
 function generateProject(options) {
-	const { projectName, targetDir, preset, agents, skills } = options;
+	const { projectName, targetDir, preset, agents, skills, git } = options;
 	let templateDir = path.resolve(__dirname, "../template");
 	if (!fs.existsSync(templateDir)) templateDir = path.resolve(__dirname, "template");
 	const s = spinner();
@@ -1308,13 +1401,16 @@ function generateProject(options) {
 		agents,
 		skills
 	});
+	let gitInitialized = false;
+	if (git !== false) gitInitialized = initGitRepository(targetDir);
 	s.stop("Project structure initialized.");
 	const pm = detectPackageManager();
 	const installCmd = getInstallCommand(pm);
 	const devCmd = getRunCommand(pm, "dev");
 	const lintCmd = getRunCommand(pm, "lint");
-	if (configuredAgents.length > 0) {
-		console.log("\n\x1B[1m🤖 AI Agent MCP & Skills Configured:\x1B[0m");
+	if (configuredAgents.length > 0 || gitInitialized) {
+		console.log("\n\x1B[1m⚙ Setup Highlights:\x1B[0m");
+		if (gitInitialized) console.log("  \x1B[32m✔\x1B[0m Git repository initialized (initial commit created)");
 		for (const agent of configuredAgents) console.log(`  \x1b[32m✔\x1b[0m ${agent}`);
 	}
 	outro(`\x1b[32m✨ Project created successfully!\x1b[0m\n\n\x1b[1mNext steps:\x1b[0m\n  ${targetDir === process.cwd() ? "" : `cd ${path.relative(process.cwd(), targetDir)}\n  `}${installCmd}\n  ${devCmd}\n  ${lintCmd} \x1b[2m(runs Oxlint)\x1b[0m`);
@@ -1322,7 +1418,7 @@ function generateProject(options) {
 //#endregion
 //#region src/prompts.ts
 async function promptUser(initialOptions) {
-	let { projectName, preset, agents, skills } = initialOptions;
+	let { projectName, preset, agents, skills, git } = initialOptions;
 	const allSkills = loadAllSkills();
 	if (initialOptions.yes) return {
 		projectName: projectName || "my-wangs-app",
@@ -1333,9 +1429,10 @@ async function promptUser(initialOptions) {
 			"claude",
 			"kilo"
 		],
-		skills: skills || allSkills.map((s) => s.id)
+		skills: skills || allSkills.map((s) => s.id),
+		git: git !== void 0 ? git : true
 	};
-	intro(`\x1b[36m🚀 Wangs UI React App Scaffolder\x1b[0m (v1.0.38)`);
+	intro(`\x1b[36m🚀 Wangs UI React App Scaffolder\x1b[0m (v1.0.40)`);
 	if (!projectName) {
 		const nameResponse = await text({
 			message: "What is your project name?",
@@ -1425,11 +1522,23 @@ async function promptUser(initialOptions) {
 		}
 		skills = skillsResponse;
 	}
+	if (git === void 0) {
+		const gitResponse = await confirm({
+			message: "Initialize a new git repository and create initial commit?",
+			initialValue: true
+		});
+		if (isCancel(gitResponse)) {
+			cancel("Project scaffolding cancelled.");
+			process$1.exit(0);
+		}
+		git = Boolean(gitResponse);
+	}
 	return {
 		projectName,
 		preset: "fixedasset",
 		agents,
-		skills: skills || allSkills.map((s) => s.id)
+		skills: skills || allSkills.map((s) => s.id),
+		git: Boolean(git)
 	};
 }
 //#endregion
@@ -1486,16 +1595,19 @@ async function main() {
 			if (val === "all") options.skills = void 0;
 			else if (val === "none") options.skills = [];
 			else options.skills = val.split(",").map((s) => s.trim()).filter(Boolean);
-		} else if (!arg.startsWith("-") && !options.projectName) options.projectName = arg;
+		} else if (arg === "--git" || arg === "--git=true") options.git = true;
+		else if (arg === "--no-git" || arg === "--git=false") options.git = false;
+		else if (!arg.startsWith("-") && !options.projectName) options.projectName = arg;
 	}
-	const { projectName, preset, agents, skills } = await promptUser(options);
+	const { projectName, preset, agents, skills, git } = await promptUser(options);
 	const targetDir = path.resolve(process$1.cwd(), projectName);
 	generateProject({
 		projectName: path.basename(targetDir),
 		targetDir,
 		preset,
 		agents,
-		skills
+		skills,
+		git
 	});
 }
 try {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wangs-ui/create-react-app",
-  "version": "1.0.38",
+  "version": "1.0.40",
   "description": "Scaffold a modern React app with Wangs UI, Vite 8, Oxlint, Oxfmt, and AI Agent MCP integration",
   "keywords": [
     "antigravity",
@@ -51,7 +51,7 @@
   },
   "dependencies": {
     "@clack/prompts": "^1.7.0",
-    "@wangs-ui/skills": "1.0.38"
+    "@wangs-ui/skills": "1.0.40"
   },
   "devDependencies": {},
   "scripts": {

package/template/package.json

@@ -13,10 +13,10 @@
     "format:check": "oxfmt --check"
   },
   "dependencies": {
-    "@wangs-ui/react-core": "^1.0.38",
-    "@wangs-ui/react-i18n": "^1.0.38",
-    "@wangs-ui/react-icons": "^1.0.38",
-    "@wangs-ui/react-presets": "^1.0.38",
+    "@wangs-ui/react-core": "^1.0.40",
+    "@wangs-ui/react-i18n": "^1.0.40",
+    "@wangs-ui/react-icons": "^1.0.40",
+    "@wangs-ui/react-presets": "^1.0.40",
     "clsx": "^2.1.1",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",