Skip to content

feat: Update types & add support computed#1

Merged
jpkleemans merged 1 commit intonexxtmove:mainfrom
N1cE-me:main
Aug 28, 2025
Merged

feat: Update types & add support computed#1
jpkleemans merged 1 commit intonexxtmove:mainfrom
N1cE-me:main

Conversation

@N1cE-me
Copy link
Copy Markdown
Contributor

@N1cE-me N1cE-me commented Aug 23, 2025

First point is correct types for issues.

I just added Combine type which concat all options from schema.

For example if I use union schema

const baseSchema = z.object({ email: z.email(), mode: z.enum(["email", "login", "signup"]).default("email").optional() });
const emailSchema = baseSchema.extend({ mode: z.literal("email").optional() });
const signinSchema = baseSchema.extend({ mode: z.literal("login"), password: z.string().min(1, "Password is required") });
const signupSchema = baseSchema.extend({ mode: z.literal("signup"), code: z.string().length(6, "Code is required") });

const authSchema = z.discriminatedUnion("mode", [emailSchema, signinSchema, signupSchema]);

const form = reactive<AuthPayload>({ email: "", mode: "email" });
const { validate, issues } = useValidation(form, authSchema);
<div v-if="form.mode === 'login'" class="grid gap-2">
					<div class="flex items-center">
						<Label for="password">Password</Label>
						<a href="#" class="ml-auto text-sm text-muted-foreground underline-offset-4 hover:underline"> Forgot your password? </a>
					</div>
					<Input
						id="password"
						v-model="form.password"
						:aria-invalid="issues.password"
						name="password"
						type="password"
						placeholder="******"
					/>
...

I got TS error in issues.password:

The "password" property does not exist in the "Reactive<Issues<{ email: string; mode?: "email" | undefined; } | { email: string; mode: "login"; password: string; } | { email: string; mode: "signup"; code: string; }>>".
The "password" property does not exist in the type "{email?: string[] | undefined; mode?: string[] | undefined; }".ts-plugin(2339)

Because issues has same type as form:

const issues: Reactive<Issues<{
    email: string;
    mode?: "email" | undefined;
} | {
    email: string;
    mode: "login";
    password: string;
} | {
    email: string;
    mode: "signup";
    code: string;
}>>

And with Combine type integration we're got issues type like this:

const issues: {
    email?: string[] | undefined;
    mode?: string[] | undefined;
    code?: string[] | undefined;
    password?: string[] | undefined;
}

Another one point - using MaybeRefOrGetter instead MaybeRef. This is full backward compatible update but may be useful for specific cases with computed and getters data as form

@jpkleemans
Copy link
Copy Markdown
Contributor

Hi, thanks for the PR! I've just updated the source code, can you fix the merge conflicts?

I've released your MaybeRefOrGetter change already in v0.3.2

- Add Combine type
- Update Issues type
@N1cE-me N1cE-me reopened this Aug 26, 2025
@N1cE-me
Copy link
Copy Markdown
Contributor Author

N1cE-me commented Aug 26, 2025

Done, I've revert computed commit and force sync with 0.3.2 changes.
Now only TS Combine commit for correct issues types

@jpkleemans jpkleemans merged commit 65e9c70 into nexxtmove:main Aug 28, 2025
2 checks passed
@jpkleemans
Copy link
Copy Markdown
Contributor

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants