@proofkit/cli 1.1.8 → 1.2.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proofkit/cli",
-  "version": "1.1.8",
+  "version": "1.2.0-beta.0",
   "description": "Create web application with the ProofKit stack",
   "license": "MIT",
   "repository": {
@@ -39,6 +39,7 @@
     "node": "^20.0.0 || ^22.0.0"
   },
   "dependencies": {
+    "@better-fetch/fetch": "1.1.17",
     "@clack/core": "^0.3.4",
     "@clack/prompts": "^0.11.0",
     "@ianvs/prettier-plugin-sort-imports": "^4.4.1",
@@ -49,9 +50,11 @@
     "dotenv": "^16.5.0",
     "es-toolkit": "^1.15.1",
     "execa": "^9.5.1",
+    "fast-glob": "^3.3.3",
     "fs-extra": "^11.3.0",
     "glob": "^11.0.1",
     "gradient-string": "^2.0.2",
+    "handlebars": "^4.7.8",
     "jiti": "^1.21.7",
     "jsonc-parser": "^3.3.1",
     "open": "^10.1.0",
@@ -60,10 +63,11 @@
     "prettier-plugin-tailwindcss": "^0.6.5",
     "randomstring": "^1.3.0",
     "semver": "^7.7.2",
+    "shadcn": "^2.10.0",
     "sort-package-json": "^2.10.0",
     "ts-morph": "^26.0.0",
-    "@proofkit/fmdapi": "5.0.2",
-    "@proofkit/typegen": "1.0.10"
+    "@proofkit/fmdapi": "5.0.3-beta.0",
+    "@proofkit/typegen": "1.0.11-beta.0"
   },
   "devDependencies": {
     "@auth/drizzle-adapter": "^1.1.0",
@@ -98,16 +102,17 @@
     "react-dom": "^19.1.1",
     "superjson": "^2.2.1",
     "tailwindcss": "^4.1.11",
-    "tsup": "^6.7.0",
+    "tsdown": "^0.14.1",
     "type-fest": "^3.13.1",
     "typescript": "^5.9.2",
     "vitest": "^3.2.4",
-    "zod": "3.25.64"
+    "zod": "3.25.64",
+    "@proofkit/registry": "1.0.0"
   },
   "scripts": {
     "typecheck": "tsc",
-    "build": "tsup && publint --strict",
-    "dev": "tsup --watch",
+    "build": "NODE_ENV=production tsdown && publint --strict",
+    "dev": "tsdown --watch",
     "clean": "rm -rf dist .turbo node_modules",
     "start": "node dist/index.js",
     "lint": "eslint . --ext .ts,.tsx",
@@ -115,9 +120,9 @@
     "format": "prettier '**/*.{cjs,mjs,ts,tsx,md,json}' --ignore-path ../.gitignore --ignore-unknown --no-error-on-unmatched-pattern --write",
     "format:check": "prettier '**/*.{cjs,mjs,ts,tsx,md,json}' --ignore-path ../.gitignore --ignore-unknown --no-error-on-unmatched-pattern --check",
     "release": "changeset version",
-    "pub:beta": "pnpm build && npm publish --tag beta --access public",
-    "pub:next": "pnpm build && npm publish --tag next --access public",
-    "pub:release": "pnpm build && npm publish --access public",
+    "pub:beta": "NODE_ENV=production pnpm build && npm publish --tag beta --access public",
+    "pub:next": "NODE_ENV=production pnpm build && npm publish --tag next --access public",
+    "pub:release": "NODE_ENV=production pnpm build && npm publish --access public",
     "test": "vitest run"
   }
 }

package/template/extras/config/query-provider-vite.tsx

@@ -1,4 +1,3 @@
-
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
 
@@ -9,7 +8,6 @@ export default function QueryProvider({
 }: {
   children: React.ReactNode;
 }) {
-
   return (
     <QueryClientProvider client={queryClient}>
       {children}

package/template/extras/emailProviders/none/email.tsx

@@ -1,5 +1,5 @@
-import { render } from "@react-email/render";
 import { AuthCodeEmail } from "@/emails/auth-code";
+import { render } from "@react-email/render";
 
 export async function sendEmail({
   to,
@@ -14,11 +14,11 @@ export async function sendEmail({
   const body = await render(
     <AuthCodeEmail validationCode={code} type={type} />
   );
-  const subject = type === "verification" ? "Verify Your Email" : "Reset Your Password"
-  
+  const subject =
+    type === "verification" ? "Verify Your Email" : "Reset Your Password";
+
   // TODO: Customize this function to actually send the email to your users
   // Learn more: https://proofkit.dev/auth/fm-addon
   console.warn("TODO: Customize this function to actually send to your users");
   console.log(`To ${to}: Your ${type} code is ${code}`);
 }
-

package/template/extras/emailProviders/plunk/email.tsx

@@ -1,5 +1,6 @@
-import { render } from "@react-email/render";
 import { AuthCodeEmail } from "@/emails/auth-code";
+import { render } from "@react-email/render";
+
 import { plunk } from "../services/plunk";
 
 export async function sendEmail({
@@ -15,12 +16,12 @@ export async function sendEmail({
   const body = await render(
     <AuthCodeEmail validationCode={code} type={type} />
   );
-  const subject = type === "verification" ? "Verify Your Email" : "Reset Your Password"
-  
+  const subject =
+    type === "verification" ? "Verify Your Email" : "Reset Your Password";
+
   await plunk.emails.send({
     to,
     subject,
     body,
   });
 }
-

package/template/extras/emailProviders/plunk/service.ts

@@ -1,4 +1,4 @@
-import Plunk from "@plunk/node";
 import { env } from "@/config/env";
+import Plunk from "@plunk/node";
 
 export const plunk = new Plunk(env.PLUNK_API_KEY);

package/template/extras/emailProviders/resend/email.tsx

@@ -1,4 +1,5 @@
 import { AuthCodeEmail } from "@/emails/auth-code";
+
 import { resend } from "../services/resend";
 
 export async function sendEmail({

package/template/extras/emailProviders/resend/service.ts

@@ -1,4 +1,4 @@
-import { Resend } from "resend";
 import { env } from "@/config/env";
+import { Resend } from "resend";
 
 export const resend = new Resend(env.RESEND_API_KEY);

package/template/extras/emailTemplates/auth-code.tsx

@@ -0,0 +1,156 @@
+import {
+  Body,
+  Container,
+  Head,
+  Heading,
+  Html,
+  Img,
+  Section,
+  Text,
+} from "@react-email/components";
+import * as React from "react";
+
+interface AuthCodeEmailProps {
+  validationCode: string;
+  type: "verification" | "password-reset";
+}
+
+export const AuthCodeEmail = ({ validationCode, type }: AuthCodeEmailProps) => (
+  <Html>
+    <Head />
+    <Body style={main}>
+      <Container style={container}>
+        <Img
+          // TODO: Replace with your logo
+          src="https://proofkit.dev/_astro/proofkit.DNcFg0_B_1JN3Dz.webp"
+          width="238"
+          height="175"
+          alt="ProofKit"
+          style={logo}
+        />
+        <Text style={tertiary}>
+          {type === "verification"
+            ? "Verify Your Email"
+            : "Reset Your Password"}
+        </Text>
+        <Heading style={secondary}>
+          Enter the following code to{" "}
+          {type === "verification"
+            ? "verify your email"
+            : "reset your password"}
+        </Heading>
+        <Section style={codeContainer}>
+          <Text style={code}>{validationCode}</Text>
+        </Section>
+        <Text style={paragraph}>
+          If you did not request this code, you can ignore this email.
+        </Text>
+      </Container>
+    </Body>
+  </Html>
+);
+
+AuthCodeEmail.PreviewProps = {
+  validationCode: "D7CU4GOV",
+  type: "verification",
+} as AuthCodeEmailProps;
+
+export default AuthCodeEmail;
+
+const main = {
+  backgroundColor: "#ffffff",
+  fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
+};
+
+const container = {
+  backgroundColor: "#ffffff",
+  border: "1px solid #eee",
+  borderRadius: "5px",
+  boxShadow: "0 5px 10px rgba(20,50,70,.2)",
+  marginTop: "20px",
+  maxWidth: "360px",
+  margin: "0 auto",
+  padding: "68px 0 130px",
+};
+
+const logo: React.CSSProperties = {
+  margin: "0 auto",
+};
+
+const tertiary = {
+  color: "#0a85ea",
+  fontSize: "11px",
+  fontWeight: 700,
+  fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
+  height: "16px",
+  letterSpacing: "0",
+  lineHeight: "16px",
+  margin: "16px 8px 8px 8px",
+  textTransform: "uppercase" as const,
+  textAlign: "center" as const,
+};
+
+const secondary = {
+  color: "#000",
+  display: "inline-block",
+  fontFamily: "HelveticaNeue-Medium,Helvetica,Arial,sans-serif",
+  fontSize: "20px",
+  fontWeight: 500,
+  lineHeight: "24px",
+  marginBottom: "0",
+  marginTop: "0",
+  textAlign: "center" as const,
+  padding: "0 40px",
+};
+
+const codeContainer = {
+  background: "rgba(0,0,0,.05)",
+  borderRadius: "4px",
+  margin: "16px auto 14px",
+  verticalAlign: "middle",
+  width: "280px",
+};
+
+const code = {
+  color: "#000",
+  display: "inline-block",
+  fontFamily: "HelveticaNeue-Bold",
+  fontSize: "32px",
+  fontWeight: 700,
+  letterSpacing: "6px",
+  lineHeight: "40px",
+  paddingBottom: "8px",
+  paddingTop: "8px",
+  margin: "0 auto",
+  width: "100%",
+  textAlign: "center" as const,
+};
+
+const paragraph = {
+  color: "#444",
+  fontSize: "15px",
+  fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
+  letterSpacing: "0",
+  lineHeight: "23px",
+  padding: "0 40px",
+  margin: "0",
+  textAlign: "center" as const,
+};
+
+const link = {
+  color: "#444",
+  textDecoration: "underline",
+};
+
+const footer = {
+  color: "#000",
+  fontSize: "12px",
+  fontWeight: 800,
+  letterSpacing: "0",
+  lineHeight: "23px",
+  margin: "0",
+  marginTop: "20px",
+  fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
+  textAlign: "center" as const,
+  textTransform: "uppercase" as const,
+};

package/template/extras/emailTemplates/generic.tsx

@@ -0,0 +1,136 @@
+import {
+  Body,
+  Button,
+  Container,
+  Head,
+  Heading,
+  Hr,
+  Html,
+  Img,
+  Section,
+  Text,
+} from "@react-email/components";
+import * as React from "react";
+
+export interface GenericEmailProps {
+  title?: string;
+  description?: string;
+  ctaText?: string;
+  ctaHref?: string;
+  footer?: string;
+}
+
+export const GenericEmail = ({
+  title,
+  description,
+  ctaText,
+  ctaHref,
+  footer,
+}: GenericEmailProps) => (
+  <Html>
+    <Head />
+    <Body style={styles.main}>
+      <Container style={styles.container}>
+        <Img
+          src="https://proofkit.dev/_astro/proofkit.DNcFg0_B_1JN3Dz.webp"
+          width="238"
+          height="175"
+          alt="ProofKit"
+          style={styles.logo}
+        />
+
+        {title ? <Heading style={styles.title}>{title}</Heading> : null}
+
+        {description ? (
+          <Text style={styles.description}>{description}</Text>
+        ) : null}
+
+        {ctaText && ctaHref ? (
+          <Section style={styles.ctaSection}>
+            <Button href={ctaHref} style={styles.ctaButton}>
+              {ctaText}
+            </Button>
+          </Section>
+        ) : null}
+
+        {(title || description || (ctaText && ctaHref)) && (
+          <Hr style={styles.hr} />
+        )}
+
+        {footer ? <Text style={styles.footer}>{footer}</Text> : null}
+      </Container>
+    </Body>
+  </Html>
+);
+
+GenericEmail.PreviewProps = {
+  title: "Welcome to ProofKit",
+  description:
+    "Thanks for trying ProofKit. This is a sample email template you can customize.",
+  ctaText: "Get Started",
+  ctaHref: "https://proofkit.dev",
+  footer: "You received this email because you signed up for updates.",
+} as GenericEmailProps;
+
+export default GenericEmail;
+
+const styles = {
+  main: {
+    backgroundColor: "#ffffff",
+    fontFamily: "HelveticaNeue,Helvetica,Arial,sans-serif",
+  },
+  container: {
+    backgroundColor: "#ffffff",
+    border: "1px solid #eee",
+    borderRadius: "5px",
+    boxShadow: "0 5px 10px rgba(20,50,70,.2)",
+    marginTop: "20px",
+    maxWidth: "520px",
+    margin: "0 auto",
+    padding: "48px 32px 36px",
+  } as React.CSSProperties,
+  logo: {
+    margin: "0 auto 12px",
+    display: "block",
+  } as React.CSSProperties,
+  title: {
+    color: "#111827",
+    fontSize: "22px",
+    fontWeight: 600,
+    lineHeight: "28px",
+    margin: "8px 0 4px",
+    textAlign: "center" as const,
+  },
+  description: {
+    color: "#374151",
+    fontSize: "15px",
+    lineHeight: "22px",
+    margin: "8px 0 0",
+    textAlign: "center" as const,
+  },
+  ctaSection: {
+    textAlign: "center" as const,
+    marginTop: "20px",
+  },
+  ctaButton: {
+    backgroundColor: "#0a85ea",
+    color: "#fff",
+    fontSize: "14px",
+    fontWeight: 600,
+    lineHeight: "20px",
+    textDecoration: "none",
+    display: "inline-block",
+    padding: "10px 16px",
+    borderRadius: "6px",
+  } as React.CSSProperties,
+  hr: {
+    borderColor: "#e5e7eb",
+    margin: "24px 0 12px",
+  },
+  footer: {
+    color: "#6b7280",
+    fontSize: "12px",
+    lineHeight: "18px",
+    textAlign: "center" as const,
+  },
+};

package/template/extras/fmaddon-auth/app/(main)/auth/profile/actions.ts

@@ -1,6 +1,14 @@
 "use server";
-import { actionClient } from "@/server/safe-action";
-import { updateEmailSchema, updatePasswordSchema } from "./schema";
+
+import {
+  createEmailVerificationRequest,
+  sendVerificationEmail,
+  setEmailVerificationRequestCookie,
+} from "@/server/auth/utils/email-verification";
+import {
+  verifyPasswordHash,
+  verifyPasswordStrength,
+} from "@/server/auth/utils/password";
 import {
   createSession,
   generateSessionToken,
@@ -13,14 +21,10 @@ import {
   updateUserPassword,
   validateLogin,
 } from "@/server/auth/utils/user";
-import {
-  createEmailVerificationRequest,
-  sendVerificationEmail,
-  setEmailVerificationRequestCookie,
-} from "@/server/auth/utils/email-verification";
+import { actionClient } from "@/server/safe-action";
 import { redirect } from "next/navigation";
-import { verifyPasswordHash } from "@/server/auth/utils/password";
-import { verifyPasswordStrength } from "@/server/auth/utils/password";
+
+import { updateEmailSchema, updatePasswordSchema } from "./schema";
 
 export const updateEmailAction = actionClient
   .schema(updateEmailSchema)

package/template/extras/fmaddon-auth/app/(main)/auth/profile/page.tsx

@@ -1,8 +1,10 @@
 import { getCurrentSession } from "@/server/auth/utils/session";
 import { Anchor, Container, Paper, Stack, Text, Title } from "@mantine/core";
 import { redirect } from "next/navigation";
+
 import UpdateEmailForm from "./profile-form";
 import UpdatePasswordForm from "./reset-password-form";
+
 // import EmailVerificationForm from "./email-verification-form";
 
 export default async function Page() {

package/template/extras/fmaddon-auth/app/(main)/auth/profile/profile-form.tsx

@@ -1,7 +1,5 @@
 "use client";
-import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hooks";
-import { updateEmailSchema } from "./schema";
-import { updateEmailAction } from "./actions";
+
 import { zodResolver } from "@hookform/resolvers/zod";
 import {
   Anchor,
@@ -9,10 +7,14 @@ import {
   Group,
   Paper,
   PasswordInput,
+  Stack,
   Text,
+  TextInput,
 } from "@mantine/core";
-import { TextInput } from "@mantine/core";
-import { Stack } from "@mantine/core";
+import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hooks";
+
+import { updateEmailAction } from "./actions";
+import { updateEmailSchema } from "./schema";
 
 export default function UpdateEmailForm({
   currentEmail,

package/template/extras/fmaddon-auth/app/(main)/auth/profile/reset-password-form.tsx

@@ -1,7 +1,6 @@
 "use client";
-import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hooks";
-import { updatePasswordSchema } from "./schema";
-import { updatePasswordAction } from "./actions";
+
+import { showSuccessNotification } from "@/utils/notification-helpers";
 import { zodResolver } from "@hookform/resolvers/zod";
 import {
   Anchor,
@@ -9,12 +8,15 @@ import {
   Group,
   Paper,
   PasswordInput,
+  Stack,
   Text,
+  TextInput,
 } from "@mantine/core";
-import { TextInput } from "@mantine/core";
-import { Stack } from "@mantine/core";
+import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hooks";
 import { useState } from "react";
-import { showSuccessNotification } from "@/utils/notification-helpers";
+
+import { updatePasswordAction } from "./actions";
+import { updatePasswordSchema } from "./schema";
 
 export default function UpdatePasswordForm() {
   const [showForm, setShowForm] = useState(false);

package/template/extras/fmaddon-auth/app/auth/forgot-password/actions.ts

@@ -1,15 +1,17 @@
 "use server";
-import { actionClient } from "@/server/safe-action";
-import { forgotPasswordSchema } from "./schema";
-import { getUserFromEmail } from "@/server/auth/utils/user";
-import { generateSessionToken } from "@/server/auth/utils/session";
-import { redirect } from "next/navigation";
+
 import {
   createPasswordResetSession,
   invalidateUserPasswordResetSessions,
   sendPasswordResetEmail,
   setPasswordResetSessionTokenCookie,
 } from "@/server/auth/utils/password-reset";
+import { generateSessionToken } from "@/server/auth/utils/session";
+import { getUserFromEmail } from "@/server/auth/utils/user";
+import { actionClient } from "@/server/safe-action";
+import { redirect } from "next/navigation";
+
+import { forgotPasswordSchema } from "./schema";
 
 export const forgotPasswordAction = actionClient
   .schema(forgotPasswordSchema)

package/template/extras/fmaddon-auth/app/auth/forgot-password/forgot-form.tsx

@@ -1,8 +1,9 @@
 "use client";
 
-import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hooks";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { TextInput, Button, Stack, Paper, Text } from "@mantine/core";
+import { Button, Paper, Stack, Text, TextInput } from "@mantine/core";
+import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hooks";
+
 import { forgotPasswordAction } from "./actions";
 import { forgotPasswordSchema } from "./schema";
 

package/template/extras/fmaddon-auth/app/auth/forgot-password/page.tsx

@@ -1,4 +1,5 @@
 import { Anchor, Container, Text, Title } from "@mantine/core";
+
 import ForgotForm from "./forgot-form";
 
 export default async function Page() {

package/template/extras/fmaddon-auth/app/auth/login/actions.ts

@@ -1,15 +1,16 @@
 "use server";
 
-import { actionClient } from "@/server/safe-action";
-import { loginSchema } from "./schema";
-import { validateLogin } from "@/server/auth/utils/user";
+import { getRedirectCookie } from "@/server/auth/utils/redirect";
 import {
   createSession,
   generateSessionToken,
   setSessionTokenCookie,
 } from "@/server/auth/utils/session";
+import { validateLogin } from "@/server/auth/utils/user";
+import { actionClient } from "@/server/safe-action";
 import { redirect } from "next/navigation";
-import { getRedirectCookie } from "@/server/auth/utils/redirect";
+
+import { loginSchema } from "./schema";
 
 export const loginAction = actionClient
   .schema(loginSchema)

package/template/extras/fmaddon-auth/app/auth/login/login-form.tsx

@@ -1,7 +1,5 @@
 "use client";
-import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hooks";
-import { loginSchema } from "./schema";
-import { loginAction } from "./actions";
+
 import { zodResolver } from "@hookform/resolvers/zod";
 import {
   Anchor,
@@ -9,10 +7,14 @@ import {
   Group,
   Paper,
   PasswordInput,
+  Stack,
   Text,
+  TextInput,
 } from "@mantine/core";
-import { TextInput } from "@mantine/core";
-import { Stack } from "@mantine/core";
+import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hooks";
+
+import { loginAction } from "./actions";
+import { loginSchema } from "./schema";
 
 export default function LoginForm() {
   const { form, handleSubmitWithAction, action } = useHookFormAction(

package/template/extras/fmaddon-auth/app/auth/login/page.tsx

@@ -1,6 +1,7 @@
 import { getCurrentSession } from "@/server/auth/utils/session";
 import { Anchor, Container, Text, Title } from "@mantine/core";
 import { redirect } from "next/navigation";
+
 import LoginForm from "./login-form";
 
 export default async function Page() {