@revealui/core 0.0.1-pre.0

package/dist/core/cli/commands/fix.ts

@@ -0,0 +1,161 @@
+import prompts from "prompts";
+import pc from "@brillout/picocolors";
+import { runDiagnostics } from "./doctor/index.js";
+import { applyFixes } from "./doctor/fixes/index.js";
+import * as fixes from "./doctor/fixes/index.js";
+import type { DiagnosticResult } from "./doctor/types.js";
+
+/**
+ * Auto-fix command that applies fixes for detected issues
+ */
+export async function runFix(): Promise<void> {
+  console.log(pc.cyan("\n🔧 RevealUI Auto-Fix\n"));
+  console.log(pc.gray("Running diagnostics...\n"));
+
+  // Run diagnostics first
+  const results = await runDiagnostics();
+
+  // Find fixable issues
+  const fixableResults = results.filter(
+    (r) => r.status === "fail" || r.status === "warn"
+  );
+
+  if (fixableResults.length === 0) {
+    console.log(pc.green("✓ No issues found that need fixing!\n"));
+    return;
+  }
+
+  // Enhance results with fix functions
+  const enhancedResults = await enhanceResultsWithFixes(results);
+
+  // Show issues that can be fixed
+  console.log(pc.cyan("Issues found:\n"));
+  for (const result of fixableResults) {
+    const icon = result.status === "fail" ? pc.red("✗") : pc.yellow("⚠");
+    console.log(`${icon} ${result.check}`);
+    console.log(`  ${result.message}`);
+    if (result.suggestion) {
+      console.log(pc.gray(`  → ${result.suggestion}`));
+    }
+  }
+
+  console.log();
+
+  // Ask for confirmation
+  const response = await prompts({
+    type: "confirm",
+    name: "apply",
+    message: "Apply automatic fixes?",
+    initial: true,
+  });
+
+  if (!response.apply) {
+    console.log(pc.yellow("\nFix cancelled."));
+    return;
+  }
+
+  // Apply fixes
+  console.log(pc.cyan("\nApplying fixes...\n"));
+  await applyFixes(enhancedResults);
+
+  console.log(pc.green("\n✅ Fix complete!\n"));
+  console.log(pc.cyan("Run 'reveal doctor' again to verify all issues are resolved.\n"));
+}
+
+/**
+ * Enhance diagnostic results with fix functions
+ */
+async function enhanceResultsWithFixes(
+  results: DiagnosticResult[]
+): Promise<DiagnosticResult[]> {
+  const cwd = process.cwd();
+
+  return results.map((result) => {
+    // Add fix functions based on check type
+    if (result.check === "reveal.config.ts exists" && result.status === "fail") {
+      return {
+        ...result,
+        fix: () => fixes.fixMissingRevealConfig(cwd),
+      };
+    }
+
+    if (result.check === "required dependencies" && result.status === "fail") {
+      const missingDeps = extractMissingDependencies(result.message);
+      if (missingDeps.length > 0) {
+        return {
+          ...result,
+          fix: () => fixes.fixMissingDependencies(cwd, missingDeps),
+        };
+      }
+    }
+
+    if (result.check === "pages directory" && result.status === "fail") {
+      return {
+        ...result,
+        fix: () => fixes.fixMissingDirectories(cwd, ["src/pages"]),
+      };
+    }
+
+    if (result.check === "components directory" && result.status === "warn") {
+      return {
+        ...result,
+        fix: () => fixes.fixMissingDirectories(cwd, ["src/components"]),
+      };
+    }
+
+    if (result.check === "public directory" && result.status === "warn") {
+      return {
+        ...result,
+        fix: () => fixes.fixMissingDirectories(cwd, ["public"]),
+      };
+    }
+
+    if (
+      result.check === ".gitignore configuration" &&
+      result.status === "warn"
+    ) {
+      const missingPatterns = extractMissingPatterns(result.message);
+      if (missingPatterns.length > 0) {
+        return {
+          ...result,
+          fix: () => fixes.fixGitignore(cwd, missingPatterns),
+        };
+      }
+    }
+
+    if (
+      result.check === "Environment template" &&
+      result.status === "warn"
+    ) {
+      return {
+        ...result,
+        fix: () => fixes.fixMissingEnvTemplate(cwd),
+      };
+    }
+
+    return result;
+  });
+}
+
+/**
+ * Extract missing dependencies from diagnostic message
+ */
+function extractMissingDependencies(message: string): string[] {
+  const match = message.match(/Missing dependencies: (.+)/);
+  if (match && match[1]) {
+    return match[1].split(", ").map((d) => d.trim());
+  }
+  return [];
+}
+
+/**
+ * Extract missing patterns from diagnostic message
+ */
+function extractMissingPatterns(message: string): string[] {
+  const match = message.match(/missing patterns: (.+)/i);
+  if (match && match[1]) {
+    return match[1].split(", ").map((p) => p.trim());
+  }
+  return [];
+}
+

package/dist/core/cli/commands/init.ts

@@ -0,0 +1,145 @@
+/**
+ * reveal init command
+ * Interactive project setup for RevealUI Framework
+ */
+
+import pc from "@brillout/picocolors";
+import fs from "node:fs/promises";
+import path from "node:path";
+
+/**
+ * Options for project initialization
+ */
+export interface InitOptions {
+	/** Project name (defaults to current directory name) */
+	projectName?: string;
+	/** Project template to use */
+	template?: "basic" | "blog" | "e-commerce" | "portfolio";
+	/** Whether to use TypeScript */
+	useTypeScript?: boolean;
+	/** Whether to use Tailwind CSS */
+	useTailwind?: boolean;
+	/** Whether to include PayloadCMS */
+	usePayload?: boolean;
+}
+
+/**
+ * Interactive project initialization
+ * Creates a new RevealUI project with the specified configuration
+ *
+ * @param options - Initialization options
+ * @example
+ * ```ts
+ * await initProject({
+ *   template: 'blog',
+ *   useTypeScript: true,
+ *   useTailwind: true,
+ * })
+ * ```
+ */
+export async function initProject(options: InitOptions = {}): Promise<void> {
+	console.log(pc.cyan("Welcome to RevealUI!"));
+	console.log("Let's set up your project.\n");
+
+	// Determine project name
+	const projectName =
+		options.projectName || path.basename(process.cwd()) || "my-revealui-app";
+
+	// Create basic project structure
+	const projectDir = process.cwd();
+
+	// Create directories
+	const dirs = [
+		"src/pages",
+		"src/components",
+		"src/lib",
+		"src/styles",
+		"public",
+	];
+
+	for (const dir of dirs) {
+		await fs.mkdir(path.join(projectDir, dir), { recursive: true });
+	}
+
+	// Create reveal.config.ts
+	const configContent = `import { defineConfig } from "@revealui/core/config";
+import react from "@revealui/core/plugins/react";
+${options.usePayload ? 'import payload from "@revealui/core/plugins/payload";' : ""}
+import vercel from "@revealui/core/plugins/vercel";
+
+export default defineConfig({
+  plugins: [
+    react(),
+    ${options.usePayload ? "payload()," : ""}
+    vercel(),
+  ],
+  vike: {
+    prerender: true,
+  },
+});
+`;
+
+	await fs.writeFile(
+		path.join(projectDir, "reveal.config.ts"),
+		configContent,
+		"utf-8",
+	);
+
+	// Create package.json if it doesn't exist
+	try {
+		await fs.access(path.join(projectDir, "package.json"));
+	} catch {
+		const packageJson = {
+			name: projectName,
+			version: "0.1.0",
+			type: "module",
+			scripts: {
+				dev: "vike dev",
+				build: "vike build",
+				preview: "vike preview",
+			},
+			dependencies: {
+				reveal: "latest",
+				react: "^19.0.0",
+				"react-dom": "^19.0.0",
+				vike: "latest",
+				"vike-react": "latest",
+			},
+			devDependencies: {
+				"@types/react": "^19.0.0",
+				"@types/react-dom": "^19.0.0",
+				typescript: "^5.7.0",
+				vite: "^6.0.0",
+			},
+		};
+
+		await fs.writeFile(
+			path.join(projectDir, "package.json"),
+			JSON.stringify(packageJson, null, 2),
+			"utf-8",
+		);
+	}
+
+	// Create basic page
+	const pageContent = `export default function Page() {
+  return (
+    <div>
+      <h1>Welcome to RevealUI</h1>
+      <p>Your project is ready to go!</p>
+    </div>
+  );
+}
+`;
+
+	await fs.writeFile(
+		path.join(projectDir, "src/pages/index.page.tsx"),
+		pageContent,
+		"utf-8",
+	);
+
+	console.log(pc.green("✓ Project initialized successfully!"));
+	console.log("\nNext steps:");
+	console.log(`  1. Run ${pc.cyan("pnpm install")} to install dependencies`);
+	console.log(`  2. Run ${pc.cyan("pnpm dev")} to start the dev server`);
+	console.log(`  3. Visit ${pc.cyan("http://localhost:3000")} to see your app`);
+}

package/dist/core/cli/commands/upgrade.ts

@@ -0,0 +1,115 @@
+import { execSync } from "child_process";
+import fs from "node:fs/promises";
+import path from "node:path";
+import prompts from "prompts";
+import pc from "@brillout/picocolors";
+
+/**
+ * Check for available updates for the reveal package
+ */
+export async function runUpgrade(): Promise<void> {
+  console.log(pc.cyan("\n🔄 RevealUI Framework Upgrade\n"));
+  console.log(pc.gray("Checking for updates...\n"));
+
+  const cwd = process.cwd();
+  const packageJsonPath = path.join(cwd, "package.json");
+
+  try {
+    const packageJsonContent = await fs.readFile(packageJsonPath, "utf-8");
+    const packageJson = JSON.parse(packageJsonContent);
+
+    const currentVersion =
+      packageJson.dependencies?.reveal ||
+      packageJson.devDependencies?.reveal ||
+      "not found";
+
+    console.log(pc.cyan(`Current version: ${currentVersion}\n`));
+
+    // Check for latest version
+    try {
+      const latestVersion = execSync("npm view reveal version", {
+        encoding: "utf-8",
+      }).trim();
+
+      console.log(pc.cyan(`Latest version: ${latestVersion}\n`));
+
+      if (currentVersion === latestVersion || currentVersion.includes(latestVersion)) {
+        console.log(pc.green("✓ You're already on the latest version!\n"));
+        return;
+      }
+
+      // Show changelog info
+      console.log(pc.yellow("New version available!\n"));
+      console.log(
+        pc.gray(
+          "To see what's new, visit: https://github.com/RevealUIStudio/reveal/releases\n"
+        )
+      );
+
+      // Ask for confirmation
+      const response = await prompts({
+        type: "confirm",
+        name: "upgrade",
+        message: `Upgrade from ${currentVersion} to ${latestVersion}?`,
+        initial: true,
+      });
+
+      if (!response.upgrade) {
+        console.log(pc.yellow("\nUpgrade cancelled."));
+        return;
+      }
+
+      // Perform upgrade
+      console.log(pc.cyan("\nUpgrading...\n"));
+
+      const isDevDependency = packageJson.devDependencies?.reveal;
+      const command = isDevDependency
+        ? `pnpm add -D reveal@${latestVersion}`
+        : `pnpm add reveal@${latestVersion}`;
+
+      execSync(command, {
+        cwd,
+        stdio: "inherit",
+      });
+
+      console.log(pc.green("\n✅ Upgrade complete!\n"));
+      console.log(
+        pc.cyan("Next steps:")
+      );
+      console.log(pc.gray("  1. Review the changelog for breaking changes"));
+      console.log(pc.gray("  2. Run 'reveal doctor' to check for any issues"));
+      console.log(pc.gray("  3. Update your code if necessary\n"));
+    } catch (error) {
+      console.log(
+        pc.yellow(
+          "\n⚠ Could not check for latest version. Make sure you're connected to the internet."
+        )
+      );
+      console.log(pc.gray("You can manually upgrade by running:\n"));
+      console.log(pc.cyan("  pnpm add reveal@latest\n"));
+    }
+  } catch (error) {
+    console.error(pc.red("Error reading package.json"), error);
+    process.exit(1);
+  }
+}
+
+/**
+ * Check for dependency updates across the project
+ */
+export async function checkDependencyUpdates(): Promise<void> {
+  console.log(pc.cyan("\n📦 Checking for dependency updates...\n"));
+
+  try {
+    execSync("pnpm outdated", {
+      stdio: "inherit",
+    });
+  } catch {
+    console.log(
+      pc.yellow(
+        "Run 'pnpm outdated' manually to see all dependency updates."
+      )
+    );
+  }
+}
+

package/dist/core/cli/onLoad.ts

@@ -0,0 +1,7 @@
+import { assertIsNotBrowser } from "../gaurds/assertions/assertIsNotBrowser";
+
+export { onLoad };
+
+function onLoad() {
+  assertIsNotBrowser();
+}

package/dist/core/cli/utils.ts

@@ -0,0 +1,6 @@
+// We assume all runtime entries will load this utils.ts file
+import { onLoad } from "./onLoad.js";
+onLoad();
+
+export * from "../gaurds/assertions/assert/index.js";
+export * from "../globals/versions/projectInfo.js";

package/dist/core/components/Config/Config-client.ts

@@ -0,0 +1,14 @@
+import { ConfigFromHook } from "../../../types/namespaces/Config";
+import { useConfig } from "../../hooks/useConfig/useConfig-client";
+
+export { Config };
+
+/**
+ * Client-side configuration component
+ * @see {@link ./Config-server} - server counterpart
+ */
+function Config(props: ConfigFromHook): null {
+  const config = useConfig();
+  config(props);
+  return null;
+}

package/dist/core/components/Config/Config-server.ts

@@ -0,0 +1,16 @@
+import { ConfigFromHook } from "../../../types/namespaces/Config"
+import { useConfig } from "../../hooks/useConfig/useConfig-server"
+
+export { Config }
+
+/**
+ * Set configurations inside React components.
+ *
+ * https://reveal.dev/useConfig
+ * @see {@link ./Config-client} - client counterpart
+ */
+function Config(props: ConfigFromHook): null {
+  const config = useConfig()
+  config(props)
+  return null
+}

package/dist/core/components/Head/Head-client.ts

@@ -0,0 +1,4 @@
+// https://reveal.dev/Head#only-html
+export function Head(): null {
+  return null
+}

package/dist/core/components/Head/Head-server.ts

@@ -0,0 +1,16 @@
+import { useConfig } from "../../hooks/useConfig/useConfig-server"
+
+export { Head }
+
+/**
+ * Add arbitrary `<head>` tags.
+ *
+ * (The children are teleported to `<head>`.)
+ *
+ * https://reveal.dev/Head
+ */
+function Head({ children }: { children: React.ReactNode }): null {
+  const config = useConfig()
+  config({ Head: children })
+  return null
+}

package/dist/core/components/Loading.tsx

@@ -0,0 +1,23 @@
+export default {
+  component: LoadingComponent,
+};
+
+import React from "react";
+
+function LoadingComponent() {
+  return (
+    <div
+      style={{
+        width: "100%",
+        height: "100%",
+        maxHeight: "100%",
+        background:
+          "linear-gradient(110deg, #ececec 8%, #f5f5f5 18%, #ececec 33%)",
+        borderRadius: "5px",
+        backgroundSize: "200% 100%",
+        animation: "1.3s reveal-shine linear infinite",
+        aspectRatio: "2.5/1",
+      }}
+    />
+  );
+}

package/dist/core/config/findPageConfig.ts

@@ -0,0 +1,14 @@
+export { findPageConfig };
+
+import type { PageConfigRuntime } from "../../types/interfaces/page.js";
+import { assert } from "../gaurds/assertions/assert/index.js";
+
+function findPageConfig(
+  pageConfigs: PageConfigRuntime[],
+  pageId: string,
+): null | PageConfigRuntime {
+  const result = pageConfigs.filter((p) => p.pageId === pageId);
+  assert(result.length <= 1);
+  const pageConfig = result[0] ?? null;
+  return pageConfig;
+}

package/dist/core/config/loadConfigValues.ts

@@ -0,0 +1,28 @@
+export { loadConfigValues };
+
+import type {
+  PageConfigRuntime,
+  PageConfigRuntimeLoaded,
+} from "../../types/interfaces/page.js";
+import { parseConfigValuesSerialized } from "../processing/serializers/serializePage/parsePageConfigs.js";
+import { objectAssign } from "../utils/object/objectAssign.js";
+
+async function loadConfigValues(
+  pageConfig: PageConfigRuntime,
+  isDev: boolean,
+): Promise<PageConfigRuntimeLoaded> {
+  if (
+    "isAllLoaded" in pageConfig &&
+    // We don't need to cache in dev, since Vite already caches the virtual module
+    !isDev
+  ) {
+    return pageConfig as PageConfigRuntimeLoaded;
+  }
+  const configValuesLoaded = await pageConfig.loadConfigValuesAll();
+  const configValues = parseConfigValuesSerialized(
+    configValuesLoaded.configValuesSerialized,
+  );
+  Object.assign(pageConfig.configValues, configValues);
+  objectAssign(pageConfig, { isAllLoaded: true as const });
+  return pageConfig;
+}