Merge pull request #345 from TheEdoRan/beta

Version 8

Author: TheEdoRan

.prettierignore

@@ -0,0 +1,6 @@
+node_modules
+dist
+.turbo
+.next
+*.md
+*.mdx

packages/next-safe-action/.prettierrc.json renamed to .prettierrc.json

@@ -6,5 +6,6 @@
 	"tabWidth": 2,
 	"semi": true,
 	"singleQuote": false,
-	"quoteProps": "consistent"
+	"quoteProps": "consistent",
+	"plugins": ["prettier-plugin-tailwindcss"]
 }

.vscode/settings.json

@@ -7,5 +7,6 @@
 	"editor.rulers": [120],
 	"[markdown]": {
 		"editor.formatOnSave": false
-	}
+	},
+	"typescript.tsdk": "node_modules/typescript/lib"
 }

README.md

@@ -19,13 +19,13 @@
 
 **Explore the documentation for the current stable version of the library on the [next-safe-action v7 website](https://next-safe-action.dev).** ✨
 
-### Looking for v6 docs?
+### Looking for v7 docs?
 
-You can keep using version 6 and eventually upgrade to version 7. Check out the v6 documentation [here](https://v6.next-safe-action.dev).
+You can keep using version 6 and eventually upgrade to version 7. Check out the v7 documentation [here](https://v7.next-safe-action.dev).
 
-## Migrate from v6 to v7
+## Migrate from v7 to v8
 
-Check out the [v6 to v7 migration guide](https://next-safe-action.dev/docs/migrations/v6-to-v7) to learn how to update your code for v7.
+Check out the [v7 to v8 migration guide](https://next-safe-action.dev/docs/migrations/v7-to-v8) to learn how to update your code for v8.
 
 ## Installation
 

apps/playground/package.json

@@ -10,25 +10,25 @@
 	},
 	"author": "Edoardo Ranghieri",
 	"dependencies": {
-		"@hookform/resolvers": "^3.10.0",
-		"lucide-react": "^0.474.0",
-		"next": "15.1.6",
+		"@hookform/resolvers": "^4.1.3",
+		"lucide-react": "^0.483.0",
+		"next": "catalog:",
 		"next-safe-action": "workspace:*",
-		"react": "^19",
-		"react-dom": "^19",
+		"react": "catalog:",
+		"react-dom": "catalog:",
 		"react-hook-form": "^7.54.2",
-		"zod": "^3.24.1",
-		"zod-form-data": "^2.0.5"
+		"zod": "^3.24.2",
+		"zod-form-data": "^2.0.7"
 	},
 	"devDependencies": {
 		"@types/node": "^22",
 		"@types/react": "^19",
 		"@types/react-dom": "^19",
-		"autoprefixer": "10.4.20",
-		"eslint": "^8.57.0",
-		"eslint-config-next": "15.1.6",
-		"postcss": "8.5.1",
+		"autoprefixer": "10.4.21",
+		"eslint": "catalog:",
+		"eslint-config-next": "catalog:",
+		"postcss": "8.5.3",
 		"tailwindcss": "^3",
-		"typescript": "^5.7.3"
+		"typescript": "catalog:"
 	}
 }

apps/playground/src/app/(examples)/async-schema/login-action.ts

@@ -1,10 +1,7 @@
 "use server";
 
 import { action } from "@/lib/safe-action";
-import {
-	flattenValidationErrors,
-	returnValidationErrors,
-} from "next-safe-action";
+import { flattenValidationErrors, returnValidationErrors } from "next-safe-action";
 import { z } from "zod";
 
 async function getSchema() {
@@ -16,11 +13,10 @@ async function getSchema() {
 
 export const loginUser = action
 	.metadata({ actionName: "loginUser" })
-	.schema(getSchema, {
+	.inputSchema(getSchema, {
 		// Here we use the `flattenValidationErrors` function to customize the returned validation errors
 		// object to the client.
-		handleValidationErrorsShape: async (ve) =>
-			flattenValidationErrors(ve).fieldErrors,
+		handleValidationErrorsShape: async (ve) => flattenValidationErrors(ve).fieldErrors,
 	})
 	.action(async ({ parsedInput: { username, password } }) => {
 		if (username === "johndoe") {

apps/playground/src/app/(examples)/async-schema/page.tsx

@@ -28,19 +28,10 @@ export default function AsyncSchemaPage() {
 					};
 					const res = await loginUser(input); // this is the type safe action directly called
 					setResult(res);
-				}}>
-				<StyledInput
-					type="text"
-					name="username"
-					id="username"
-					placeholder="Username"
-				/>
-				<StyledInput
-					type="password"
-					name="password"
-					id="password"
-					placeholder="Password"
-				/>
+				}}
+			>
+				<StyledInput type="text" name="username" id="username" placeholder="Username" />
+				<StyledInput type="password" name="password" id="password" placeholder="Password" />
 				<StyledButton type="submit">Log in</StyledButton>
 			</form>
 			<ResultBox result={result} />

apps/playground/src/app/(examples)/bind-arguments/onboard-action.ts

@@ -7,24 +7,16 @@ const schema = z.object({
 	username: z.string().min(3).max(30),
 });
 
-const bindArgsSchemas: [userId: z.ZodString, age: z.ZodNumber] = [
-	z.string().uuid(),
-	z.number().min(18).max(150),
-];
+const bindArgsSchemas: [userId: z.ZodString, age: z.ZodNumber] = [z.string().uuid(), z.number().min(18).max(150)];
 
 export const onboardUser = action
 	.metadata({ actionName: "onboardUser" })
-	.schema(schema)
+	.inputSchema(schema)
 	.bindArgsSchemas(bindArgsSchemas)
-	.action(
-		async ({
-			parsedInput: { username },
-			bindArgsParsedInputs: [userId, age],
-		}) => {
-			await new Promise((res) => setTimeout(res, 1000));
+	.action(async ({ parsedInput: { username }, bindArgsParsedInputs: [userId, age] }) => {
+		await new Promise((res) => setTimeout(res, 1000));
 
-			return {
-				message: `Welcome on board, ${username}! (age = ${age}, user id = ${userId})`,
-			};
-		}
-	);
+		return {
+			message: `Welcome on board, ${username}! (age = ${age}, user id = ${userId})`,
+		};
+	});

apps/playground/src/app/(examples)/bind-arguments/page.tsx

@@ -8,11 +8,7 @@ import { ResultBox } from "../../_components/result-box";
 import { onboardUser } from "./onboard-action";
 
 export default function BindArguments() {
-	const boundOnboardUser = onboardUser.bind(
-		null,
-		crypto.randomUUID(),
-		Math.floor(Math.random() * 200)
-	);
+	const boundOnboardUser = onboardUser.bind(null, crypto.randomUUID(), Math.floor(Math.random() * 200));
 
 	const { execute, result, status, reset } = useAction(boundOnboardUser);
 
@@ -32,13 +28,9 @@ export default function BindArguments() {
 
 					// Action call.
 					execute(input);
-				}}>
-				<StyledInput
-					type="text"
-					name="username"
-					id="username"
-					placeholder="Username"
-				/>
+				}}
+			>
+				<StyledInput type="text" name="username" id="username" placeholder="Username" />
 				<StyledButton type="submit">Onboard user</StyledButton>
 				<StyledButton type="button" onClick={reset}>
 					Reset

apps/playground/src/app/(examples)/direct/login-action.ts

@@ -1,10 +1,7 @@
 "use server";
 
 import { action } from "@/lib/safe-action";
-import {
-	flattenValidationErrors,
-	returnValidationErrors,
-} from "next-safe-action";
+import { flattenValidationErrors, returnValidationErrors } from "next-safe-action";
 import { z } from "zod";
 
 const schema = z.object({
@@ -14,11 +11,10 @@ const schema = z.object({
 
 export const loginUser = action
 	.metadata({ actionName: "loginUser" })
-	.schema(schema, {
+	.inputSchema(schema, {
 		// Here we use the `flattenValidationErrors` function to customize the returned validation errors
 		// object to the client.
-		handleValidationErrorsShape: async (ve) =>
-			flattenValidationErrors(ve).fieldErrors,
+		handleValidationErrorsShape: async (ve) => flattenValidationErrors(ve).fieldErrors,
 	})
 	.action(
 		async ({ parsedInput: { username, password } }) => {