@teardown/cli 1.2.38 → 2.0.41

package/templates/src/core/clients/api/api.client.ts

@@ -0,0 +1,113 @@
+/**
+ * API Client
+ *
+ * HTTP client for making API requests.
+ * Handles authentication, error handling, and request/response transformation.
+ */
+
+import type { ApiResponse, RequestConfig } from "@/types";
+
+export class ApiClient {
+	private baseUrl: string;
+	private headers: Record<string, string>;
+
+	constructor(baseUrl = "") {
+		this.baseUrl = baseUrl;
+		this.headers = {
+			"Content-Type": "application/json",
+		};
+	}
+
+	/**
+	 * Set the base URL for all requests
+	 */
+	setBaseUrl(url: string): void {
+		this.baseUrl = url;
+	}
+
+	/**
+	 * Set an authorization token
+	 */
+	setAuthToken(token: string): void {
+		this.headers["Authorization"] = `Bearer ${token}`;
+	}
+
+	/**
+	 * Clear the authorization token
+	 */
+	clearAuthToken(): void {
+		delete this.headers["Authorization"];
+	}
+
+	/**
+	 * Make a GET request
+	 */
+	async get<T>(endpoint: string, config?: RequestConfig): Promise<ApiResponse<T>> {
+		return this.request<T>("GET", endpoint, undefined, config);
+	}
+
+	/**
+	 * Make a POST request
+	 */
+	async post<T>(endpoint: string, body?: unknown, config?: RequestConfig): Promise<ApiResponse<T>> {
+		return this.request<T>("POST", endpoint, body, config);
+	}
+
+	/**
+	 * Make a PUT request
+	 */
+	async put<T>(endpoint: string, body?: unknown, config?: RequestConfig): Promise<ApiResponse<T>> {
+		return this.request<T>("PUT", endpoint, body, config);
+	}
+
+	/**
+	 * Make a DELETE request
+	 */
+	async delete<T>(endpoint: string, config?: RequestConfig): Promise<ApiResponse<T>> {
+		return this.request<T>("DELETE", endpoint, undefined, config);
+	}
+
+	/**
+	 * Internal request handler
+	 */
+	private async request<T>(
+		method: string,
+		endpoint: string,
+		body?: unknown,
+		config?: RequestConfig,
+	): Promise<ApiResponse<T>> {
+		const url = `${this.baseUrl}${endpoint}`;
+		const headers = { ...this.headers, ...config?.headers };
+
+		try {
+			const response = await fetch(url, {
+				method,
+				headers,
+				body: body ? JSON.stringify(body) : undefined,
+				signal: config?.signal,
+			});
+
+			const data = await response.json();
+
+			if (!response.ok) {
+				return {
+					success: false,
+					error: data.message || "Request failed",
+					status: response.status,
+				};
+			}
+
+			return {
+				success: true,
+				data,
+				status: response.status,
+			};
+		} catch (error) {
+			return {
+				success: false,
+				error: error instanceof Error ? error.message : "Network error",
+				status: 0,
+			};
+		}
+	}
+}

package/templates/src/core/clients/api/index.ts

@@ -0,0 +1 @@
+export { ApiClient } from "./api.client";

package/templates/src/core/clients/storage/index.ts

@@ -0,0 +1 @@
+export { StorageClient, createStorage } from "./storage.client";

package/templates/src/core/clients/storage/storage.client.ts

@@ -0,0 +1,121 @@
+/**
+ * Storage Client
+ *
+ * Abstraction over MMKV for fast local data persistence.
+ * MMKV is ~30x faster than AsyncStorage and fully synchronous.
+ */
+
+import { MMKV } from "react-native-mmkv";
+
+export class StorageClient {
+	private storage: MMKV;
+
+	constructor(id = "app-storage") {
+		this.storage = new MMKV({ id });
+	}
+
+	/**
+	 * Get a string value
+	 */
+	getString(key: string): string | undefined {
+		return this.storage.getString(key);
+	}
+
+	/**
+	 * Get a number value
+	 */
+	getNumber(key: string): number | undefined {
+		return this.storage.getNumber(key);
+	}
+
+	/**
+	 * Get a boolean value
+	 */
+	getBoolean(key: string): boolean | undefined {
+		return this.storage.getBoolean(key);
+	}
+
+	/**
+	 * Get a JSON value (parsed)
+	 */
+	getObject<T>(key: string): T | null {
+		const value = this.storage.getString(key);
+		if (!value) return null;
+		try {
+			return JSON.parse(value) as T;
+		} catch {
+			return null;
+		}
+	}
+
+	/**
+	 * Set a string value
+	 */
+	setString(key: string, value: string): void {
+		this.storage.set(key, value);
+	}
+
+	/**
+	 * Set a number value
+	 */
+	setNumber(key: string, value: number): void {
+		this.storage.set(key, value);
+	}
+
+	/**
+	 * Set a boolean value
+	 */
+	setBoolean(key: string, value: boolean): void {
+		this.storage.set(key, value);
+	}
+
+	/**
+	 * Set a JSON value (stringified)
+	 */
+	setObject<T>(key: string, value: T): void {
+		this.storage.set(key, JSON.stringify(value));
+	}
+
+	/**
+	 * Check if a key exists
+	 */
+	contains(key: string): boolean {
+		return this.storage.contains(key);
+	}
+
+	/**
+	 * Remove a value
+	 */
+	remove(key: string): void {
+		this.storage.delete(key);
+	}
+
+	/**
+	 * Get all keys
+	 */
+	getAllKeys(): string[] {
+		return this.storage.getAllKeys();
+	}
+
+	/**
+	 * Clear all stored data
+	 */
+	clear(): void {
+		this.storage.clearAll();
+	}
+
+	/**
+	 * Get the underlying MMKV instance for advanced usage
+	 */
+	getInstance(): MMKV {
+		return this.storage;
+	}
+}
+
+/**
+ * Create a new storage instance with a specific ID
+ * Useful for isolating different data domains
+ */
+export function createStorage(id: string): StorageClient {
+	return new StorageClient(id);
+}

package/templates/src/core/constants/index.ts

@@ -0,0 +1,19 @@
+/**
+ * App Constants
+ *
+ * Define global constants here.
+ */
+
+export const APP_NAME = "<%= appName %>";
+export const APP_VERSION = "<%= version %>";
+
+// API Configuration
+export const API_BASE_URL = "";
+export const API_TIMEOUT = 30000;
+
+// Storage Keys
+export const STORAGE_KEYS = {
+	AUTH_TOKEN: "auth_token",
+	USER_PREFERENCES: "user_preferences",
+	ONBOARDING_COMPLETE: "onboarding_complete",
+} as const;

package/templates/src/core/core.ts

@@ -0,0 +1,40 @@
+/**
+ * Core Application Services
+ *
+ * Singleton class that instantiates and provides access to all core services.
+ * Add your API clients, storage, auth, and other service clients here.
+ */
+
+import { StorageClient } from "./clients/storage";
+import { ApiClient } from "./clients/api";
+
+class AppCore {
+	public readonly storage: StorageClient;
+	public readonly api: ApiClient;
+
+	constructor() {
+		// Initialize clients in dependency order
+		this.storage = new StorageClient();
+		this.api = new ApiClient();
+	}
+
+	/**
+	 * Initialize async services
+	 * Call this during app startup
+	 */
+	async initialize(): Promise<void> {
+		// Add initialization logic here
+		// e.g., load cached data, restore auth state
+	}
+
+	/**
+	 * Cleanup resources
+	 * Call this on app termination
+	 */
+	async cleanup(): Promise<void> {
+		// Add cleanup logic here
+	}
+}
+
+// Export singleton instance
+export const core = new AppCore();

package/templates/src/core/index.ts

@@ -0,0 +1,10 @@
+/**
+ * Core Module Exports
+ *
+ * Re-exports all core services and utilities.
+ */
+
+export { core } from "./core";
+export { StorageClient, createStorage } from "./clients/storage";
+export { ApiClient } from "./clients/api";
+export * from "./constants";

package/templates/src/global.css

@@ -0,0 +1,87 @@
+/**
+ * Global CSS for Uniwind
+ *
+ * This file imports Tailwind CSS 4 and Uniwind for React Native styling.
+ * The location of this file determines the app root for Tailwind scanning.
+ */
+
+@import "tailwindcss";
+@import "uniwind";
+
+/**
+ * Custom CSS Variables (Design Tokens)
+ * Customize these to match your brand.
+ */
+:root {
+	/* Primary Colors */
+	--color-primary: #3b82f6;
+	--color-primary-foreground: #ffffff;
+
+	/* Secondary Colors */
+	--color-secondary: #64748b;
+	--color-secondary-foreground: #ffffff;
+
+	/* Accent Colors */
+	--color-accent: #8b5cf6;
+	--color-accent-foreground: #ffffff;
+
+	/* Destructive Colors */
+	--color-destructive: #ef4444;
+	--color-destructive-foreground: #ffffff;
+
+	/* Background Colors */
+	--color-background: #ffffff;
+	--color-foreground: #0f172a;
+
+	/* Muted Colors */
+	--color-muted: #f1f5f9;
+	--color-muted-foreground: #64748b;
+
+	/* Card Colors */
+	--color-card: #ffffff;
+	--color-card-foreground: #0f172a;
+
+	/* Border Colors */
+	--color-border: #e2e8f0;
+
+	/* Input Colors */
+	--color-input: #e2e8f0;
+	--color-ring: #3b82f6;
+
+	/* Spacing */
+	--radius-sm: 0.375rem;
+	--radius-md: 0.5rem;
+	--radius-lg: 0.75rem;
+	--radius-xl: 1rem;
+}
+
+/**
+ * Dark mode support
+ */
+.dark {
+	--color-primary: #60a5fa;
+	--color-primary-foreground: #0f172a;
+
+	--color-secondary: #94a3b8;
+	--color-secondary-foreground: #0f172a;
+
+	--color-accent: #a78bfa;
+	--color-accent-foreground: #0f172a;
+
+	--color-destructive: #f87171;
+	--color-destructive-foreground: #0f172a;
+
+	--color-background: #0f172a;
+	--color-foreground: #f8fafc;
+
+	--color-muted: #1e293b;
+	--color-muted-foreground: #94a3b8;
+
+	--color-card: #1e293b;
+	--color-card-foreground: #f8fafc;
+
+	--color-border: #334155;
+
+	--color-input: #334155;
+	--color-ring: #60a5fa;
+}

package/templates/src/hooks/index.ts

@@ -0,0 +1,6 @@
+/**
+ * Hooks Barrel Export
+ */
+
+export { useMounted } from "./use-mounted";
+export { useDebounce } from "./use-debounce";

package/templates/src/hooks/use-debounce.ts

@@ -0,0 +1,23 @@
+/**
+ * useDebounce Hook
+ *
+ * Debounces a value by the specified delay.
+ */
+
+import { useState, useEffect } from "react";
+
+export function useDebounce<T>(value: T, delay: number): T {
+	const [debouncedValue, setDebouncedValue] = useState<T>(value);
+
+	useEffect(() => {
+		const timer = setTimeout(() => {
+			setDebouncedValue(value);
+		}, delay);
+
+		return () => {
+			clearTimeout(timer);
+		};
+	}, [value, delay]);
+
+	return debouncedValue;
+}

package/templates/src/hooks/use-mounted.ts

@@ -0,0 +1,21 @@
+/**
+ * useMounted Hook
+ *
+ * Returns true if the component is mounted.
+ * Useful for avoiding state updates on unmounted components.
+ */
+
+import { useEffect, useRef } from "react";
+
+export function useMounted(): boolean {
+	const mounted = useRef(false);
+
+	useEffect(() => {
+		mounted.current = true;
+		return () => {
+			mounted.current = false;
+		};
+	}, []);
+
+	return mounted.current;
+}

package/templates/src/index.ts

@@ -0,0 +1,28 @@
+/**
+ * App Entry Point
+ *
+ * This file registers the root component with React Native's AppRegistry.
+ * The app is wrapped with DevClientProvider for development tools.
+ */
+
+import { AppRegistry } from "react-native";
+import { DevClientProvider } from "@teardown/dev-client";
+import { devClientConfig } from "../../dev-client.config";
+import { App } from "./app";
+
+/**
+ * Root component with development client wrapper
+ */
+function Root() {
+	return (
+		<DevClientProvider config={devClientConfig}>
+			<App />
+		</DevClientProvider>
+	);
+}
+
+AppRegistry.registerComponent("<%= appName %>", () => Root);
+
+// Export core modules for external use
+export * from "./core";
+export * from "./types";

package/templates/src/lib/index.ts

@@ -0,0 +1,5 @@
+/**
+ * Lib Barrel Export
+ */
+
+export * from "./utils";

package/templates/src/lib/utils.ts

@@ -0,0 +1,115 @@
+/**
+ * Utility Functions
+ *
+ * Common utility functions used across the application.
+ */
+
+/**
+ * Sleep for a specified duration
+ */
+export function sleep(ms: number): Promise<void> {
+	return new Promise((resolve) => setTimeout(resolve, ms));
+}
+
+/**
+ * Clamp a number between min and max
+ */
+export function clamp(value: number, min: number, max: number): number {
+	return Math.min(Math.max(value, min), max);
+}
+
+/**
+ * Format a number as currency
+ */
+export function formatCurrency(
+	amount: number,
+	currency = "USD",
+	locale = "en-US",
+): string {
+	return new Intl.NumberFormat(locale, {
+		style: "currency",
+		currency,
+	}).format(amount);
+}
+
+/**
+ * Format a date
+ */
+export function formatDate(
+	date: Date | string | number,
+	options?: Intl.DateTimeFormatOptions,
+	locale = "en-US",
+): string {
+	const d = new Date(date);
+	return new Intl.DateTimeFormat(locale, options).format(d);
+}
+
+/**
+ * Truncate a string
+ */
+export function truncate(str: string, length: number, suffix = "..."): string {
+	if (str.length <= length) return str;
+	return str.slice(0, length - suffix.length) + suffix;
+}
+
+/**
+ * Generate a random ID
+ */
+export function generateId(length = 8): string {
+	return Math.random()
+		.toString(36)
+		.substring(2, 2 + length);
+}
+
+/**
+ * Check if a value is empty (null, undefined, empty string, empty array, empty object)
+ */
+export function isEmpty(value: unknown): boolean {
+	if (value === null || value === undefined) return true;
+	if (typeof value === "string") return value.trim().length === 0;
+	if (Array.isArray(value)) return value.length === 0;
+	if (typeof value === "object") return Object.keys(value).length === 0;
+	return false;
+}
+
+/**
+ * Deep clone an object
+ */
+export function deepClone<T>(obj: T): T {
+	return JSON.parse(JSON.stringify(obj));
+}
+
+/**
+ * Debounce a function
+ */
+export function debounce<T extends (...args: unknown[]) => unknown>(
+	func: T,
+	wait: number,
+): (...args: Parameters<T>) => void {
+	let timeoutId: ReturnType<typeof setTimeout> | null = null;
+
+	return (...args: Parameters<T>) => {
+		if (timeoutId) clearTimeout(timeoutId);
+		timeoutId = setTimeout(() => func(...args), wait);
+	};
+}
+
+/**
+ * Throttle a function
+ */
+export function throttle<T extends (...args: unknown[]) => unknown>(
+	func: T,
+	limit: number,
+): (...args: Parameters<T>) => void {
+	let inThrottle = false;
+
+	return (...args: Parameters<T>) => {
+		if (!inThrottle) {
+			func(...args);
+			inThrottle = true;
+			setTimeout(() => {
+				inThrottle = false;
+			}, limit);
+		}
+	};
+}

package/templates/src/modules/.gitkeep

@@ -0,0 +1,6 @@
+# Add your feature modules here
+# Each module should be self-contained with:
+# - components/
+# - hooks/
+# - types.ts
+# - index.ts

package/templates/src/navigation/index.ts

@@ -0,0 +1,8 @@
+/**
+ * Navigation Module
+ *
+ * Exports navigation components and utilities.
+ */
+
+export { NavigationProvider } from "./navigation-provider";
+export { Router } from "./router";

package/templates/src/navigation/navigation-provider.tsx

@@ -0,0 +1,36 @@
+/**
+ * Navigation Provider
+ *
+ * Wraps the app with NavigationContainer and linking configuration.
+ */
+
+import React from "react";
+import { NavigationContainer } from "@react-navigation/native";
+
+interface NavigationProviderProps {
+	children: React.ReactNode;
+}
+
+/**
+ * Linking configuration for deep links.
+ * Routes are automatically generated by @teardown/navigation-metro.
+ */
+const linking = {
+	prefixes: ["<%= slug %>://"],
+	config: {
+		screens: {
+			"(tabs)": {
+				screens: {
+					home: "home",
+					explore: "explore",
+					profile: "profile",
+				},
+			},
+			settings: "settings",
+		},
+	},
+};
+
+export function NavigationProvider({ children }: NavigationProviderProps): React.JSX.Element {
+	return <NavigationContainer linking={linking}>{children}</NavigationContainer>;
+}