@overgaming/valiform 0.2.2 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +68 -17
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.js +230 -190
- package/dist/nuxt.cjs +2 -2
- package/dist/nuxt.js +2 -1
- package/dist/src/context/__tests__/components/FieldInput.vue.d.ts +9 -0
- package/dist/src/context/__tests__/components/InputInsideField.vue.d.ts +9 -0
- package/dist/src/context/__tests__/components/StandaloneCheckbox.vue.d.ts +14 -0
- package/dist/src/context/__tests__/components/StandaloneInput.vue.d.ts +16 -0
- package/dist/src/context/__tests__/components/TwoStandaloneInputs.vue.d.ts +2 -0
- package/dist/src/context/__tests__/useInputContext.test.d.ts +1 -0
- package/dist/src/context/useFieldContext.d.ts +37 -1
- package/dist/src/context/useInputContext.d.ts +26 -0
- package/dist/src/types.d.ts +3 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -14,8 +14,7 @@ npm install @overgaming/valiform
|
|
|
14
14
|
|
|
15
15
|
```ts
|
|
16
16
|
import { createApp } from 'vue';
|
|
17
|
-
import { FormsPlugin } from '@overgaming/valiform';
|
|
18
|
-
import { es } from '@overgaming/valiform/locales';
|
|
17
|
+
import { FormsPlugin, es } from '@overgaming/valiform';
|
|
19
18
|
|
|
20
19
|
const app = createApp(App);
|
|
21
20
|
|
|
@@ -38,7 +37,7 @@ export default defineNuxtConfig({
|
|
|
38
37
|
});
|
|
39
38
|
```
|
|
40
39
|
|
|
41
|
-
The Nuxt module auto-imports `<Form>`, `<Field>`, `useLocale`, `useFormContext` and `
|
|
40
|
+
The Nuxt module auto-imports `<Form>`, `<Field>`, `useLocale`, `useFormContext`, `useFieldContext` and `useInputContext`.
|
|
42
41
|
|
|
43
42
|
---
|
|
44
43
|
|
|
@@ -46,7 +45,7 @@ The Nuxt module auto-imports `<Form>`, `<Field>`, `useLocale`, `useFormContext`
|
|
|
46
45
|
|
|
47
46
|
### With custom components (recommended)
|
|
48
47
|
|
|
49
|
-
Build a custom input component using `
|
|
48
|
+
Build a custom input component using `useInputContext` and `defineModel`. This makes the component work both **inside a `<Field>`** (picks up its context automatically) and **standalone with `v-model`** (creates sensible defaults):
|
|
50
49
|
|
|
51
50
|
```vue
|
|
52
51
|
<!-- MyInput.vue -->
|
|
@@ -61,14 +60,12 @@ Build a custom input component using `useFieldContext` and `defineModel`:
|
|
|
61
60
|
</template>
|
|
62
61
|
|
|
63
62
|
<script setup lang="ts">
|
|
64
|
-
import {
|
|
63
|
+
import { useInputContext } from '@overgaming/valiform';
|
|
65
64
|
|
|
66
|
-
defineProps({
|
|
67
|
-
type: { type: String, default: 'text' }
|
|
68
|
-
});
|
|
65
|
+
withDefaults(defineProps<{ type?: string }>(), { type: 'text' });
|
|
69
66
|
|
|
70
|
-
const model = defineModel({
|
|
71
|
-
const { inputValue, inputProps, error } =
|
|
67
|
+
const model = defineModel<string>({ default: '' });
|
|
68
|
+
const { inputValue, inputProps, error } = useInputContext(model);
|
|
72
69
|
</script>
|
|
73
70
|
```
|
|
74
71
|
|
|
@@ -245,17 +242,71 @@ Access the parent `<Form>` state from any descendant component.
|
|
|
245
242
|
const { values, isValid, errors, reset, validate, setErrors } = useFormContext();
|
|
246
243
|
```
|
|
247
244
|
|
|
248
|
-
### `useFieldContext(
|
|
245
|
+
### `useFieldContext()`
|
|
249
246
|
|
|
250
|
-
Access the parent `<Field>` state from any descendant component.
|
|
247
|
+
Access the parent `<Field>` state from any descendant component. Use this for components that **must always live inside a `<Field>`** (label, error, help text).
|
|
248
|
+
|
|
249
|
+
Has two call signatures:
|
|
250
|
+
|
|
251
|
+
```ts
|
|
252
|
+
// No args — component must always be inside a Field.
|
|
253
|
+
// Returns FieldContext directly (no ! needed).
|
|
254
|
+
// Throws at runtime if called outside a Field.
|
|
255
|
+
const { labelProps } = useFieldContext();
|
|
256
|
+
|
|
257
|
+
// Explicit null — handle absence of context manually.
|
|
258
|
+
// Returns FieldContext | null.
|
|
259
|
+
const ctx = useFieldContext(null);
|
|
260
|
+
if (ctx) { ... }
|
|
261
|
+
```
|
|
262
|
+
|
|
263
|
+
TypeScript types for `FieldContext` and other interfaces are exported from the package:
|
|
264
|
+
|
|
265
|
+
```ts
|
|
266
|
+
import type { FieldContext, FieldState, FormContext } from '@overgaming/valiform';
|
|
267
|
+
```
|
|
268
|
+
|
|
269
|
+
### `useInputContext(model)`
|
|
270
|
+
|
|
271
|
+
The recommended composable for building input components that work **both inside a `<Field>` and standalone with `v-model`** — without any TypeScript hacks or duplicate logic.
|
|
272
|
+
|
|
273
|
+
- **Inside a `<Field>`**: returns the injected `FieldContext` (validation, error state, accessibility props all come from the Field). The `model` parameter is ignored.
|
|
274
|
+
- **Standalone (no Field ancestor)**: builds a minimal `FieldContext` using the provided `model` ref. Tracks `isDirty` and `isTouched`, generates accessible IDs, and provides a working `reset()`.
|
|
251
275
|
|
|
252
276
|
```ts
|
|
253
|
-
|
|
254
|
-
const {
|
|
277
|
+
const model = defineModel<string>({ default: '' });
|
|
278
|
+
const {
|
|
279
|
+
inputValue,
|
|
280
|
+
inputProps,
|
|
281
|
+
labelProps,
|
|
282
|
+
helpProps,
|
|
283
|
+
errorProps,
|
|
284
|
+
error,
|
|
285
|
+
isValid,
|
|
286
|
+
isTouched,
|
|
287
|
+
isDirty,
|
|
288
|
+
validate,
|
|
289
|
+
reset
|
|
290
|
+
} = useInputContext(model);
|
|
291
|
+
```
|
|
292
|
+
|
|
293
|
+
Example — a checkbox that works inside or outside a Field:
|
|
294
|
+
|
|
295
|
+
```vue
|
|
296
|
+
<!-- MyCheckbox.vue -->
|
|
297
|
+
<template>
|
|
298
|
+
<label v-bind="labelProps">
|
|
299
|
+
<input v-model="inputValue" v-bind="inputProps" type="checkbox" />
|
|
300
|
+
<slot />
|
|
301
|
+
</label>
|
|
302
|
+
</template>
|
|
255
303
|
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
304
|
+
<script setup lang="ts">
|
|
305
|
+
import { useInputContext } from '@overgaming/valiform';
|
|
306
|
+
|
|
307
|
+
const model = defineModel<boolean>({ default: false });
|
|
308
|
+
const { inputValue, inputProps, labelProps } = useInputContext(model);
|
|
309
|
+
</script>
|
|
259
310
|
```
|
|
260
311
|
|
|
261
312
|
### `useLocale()`
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),C=Symbol("locale-context"),T=(e=null)=>{const t=o.inject(C,e);if(!t&&t!==null)throw new Error("Context with localeContextKey not found");return t},q={required:"This field is required",email:"Please enter a valid email address",min:({value:e})=>`Must be at least ${e}`,max:({value:e})=>`Must be at most ${e}`,matches:"Format is not valid",number:"Must be a valid number",accepted:"Must be accepted",alpha:"Must contain only alphabetical characters",alphanumeric:"Must contain only letters and numbers",alphaSpaces:"Must contain only letters and spaces",between:({min:e,max:t})=>`Must be between ${e} and ${t}`,confirm:({fieldName:e})=>`Must match ${e}`,containsAlpha:"Must contain at least one letter",containsAlphanumeric:"Must contain at least one letter or number",containsAlphaSpaces:"Must contain at least one letter or space",containsLowercase:"Must contain at least one lowercase letter",containsNumeric:"Must contain at least one number",containsSymbol:"Must contain at least one symbol",containsUppercase:"Must contain at least one uppercase letter",dateAfter:({date:e})=>e?`Must be after ${e}`:"Must be after today",dateAfterOrEqual:({date:e})=>e?`Must be after or equal to ${e}`:"Must be after or equal to today",dateBefore:({date:e})=>e?`Must be before ${e}`:"Must be before today",dateBeforeOrEqual:({date:e})=>e?`Must be before or equal to ${e}`:"Must be before or equal to today",dateBetween:({startDate:e,endDate:t})=>`Must be between ${e} and ${t}`,dateFormat:({format:e})=>`Must match the format ${e}`,endsWith:({suffix:e})=>Array.isArray(e)?`Must end with one of: ${e.map(t=>`"${t}"`).join(", ")}`:`Must end with "${e}"`,is:({allowedValues:e})=>`Must be one of: ${Array.isArray(e)?e.join(", "):e}`,length:({value:e,min:t,max:n})=>t!==void 0&&n!==void 0?`Must be between ${t} and ${n} characters`:e!==void 0?`Must be exactly ${e} characters`:"Invalid length",lowercase:"Must contain only lowercase characters",not:({disallowedValues:e})=>`Must not be one of: ${Array.isArray(e)?e.join(", "):e}`,startsWith:({prefix:e})=>Array.isArray(e)?`Must start with one of: ${e.join(", ")}`:`Must start with "${e}"`,symbol:"Must contain only symbols",uppercase:"Must contain only uppercase characters",url:"Must be a valid URL"},E=o.shallowRef(new Map),_=(e,t)=>{E.value.set(e,t)},V=e=>{Object.entries(e).forEach(([t,n])=>{_(t,n)})},z=e=>E.value.get(e);function I(e){const t=e.accepted;return typeof t=="function"?t({}):t??"Must be accepted"}function K(e){return e?["yes","on","1","true"].includes(String(e).toLowerCase()):!1}function U(e,t={}){const{messages:n={}}=t;return K(e)?!0:I(n)}function k(e){const t=e.alpha;return typeof t=="function"?t({}):t??"Must contain only alphabetical characters"}function Z(e){return e?/^[a-zA-Z]+$/.test(String(e)):!0}function Y(e,t={}){const{messages:n={}}=t;return Z(e)?!0:k(n)}function G(e){const t=e.alphanumeric;return typeof t=="function"?t({}):t??"Must contain only letters and numbers"}function H(e){return e?/^[a-zA-Z0-9]+$/.test(String(e)):!0}function J(e,t={}){const{messages:n={}}=t;return H(e)?!0:G(n)}function Q(e){const t=e.alphaSpaces;return typeof t=="function"?t({}):t??"Must contain only letters and spaces"}function X(e){return e?/^[a-zA-Z\s]+$/.test(String(e)):!0}function ee(e,t={}){const{messages:n={}}=t;return X(e)?!0:Q(n)}function te(e,t,n){const r=e.between;return typeof r=="function"?r({min:t,max:n}):r??`Must be between ${t} and ${n}`}function ne(e,t,n){if(!e&&e!==0)return!0;const r=Number(e);if(isNaN(r))return!1;const s=Number(t),a=Number(n);return isNaN(s)||isNaN(a)?!1:r>=s&&r<=a}function re(e,t={}){const{args:n=[],messages:r={}}=t,[s,a]=n;return ne(e,s,a)?!0:te(r,s,a)}function se(e,t){const n=e.confirm;return typeof n=="function"?n({fieldName:t}):n??`Must match ${t}`}function oe(e,t,n){var r;return e?n?e===((r=n[t])==null?void 0:r.value):!1:!0}function ae(e,t={}){const{args:n=[],messages:r={},fields:s={}}=t,[a]=n;return oe(e,a,s)?!0:se(r,a)}function ue(e){const t=e.containsAlpha;return typeof t=="function"?t({}):t??"Must contain at least one letter"}function ie(e){return e?/[a-zA-Z]/.test(String(e)):!0}function ce(e,t={}){const{messages:n={}}=t;return ie(e)?!0:ue(n)}function le(e){const t=e.containsAlphanumeric;return typeof t=="function"?t({}):t??"Must contain at least one letter or number"}function fe(e){return e?/[a-zA-Z0-9]/.test(String(e)):!0}function me(e,t={}){const{messages:n={}}=t;return fe(e)?!0:le(n)}function de(e){const t=e.containsAlphaSpaces;return typeof t=="function"?t({}):t??"Must contain at least one letter or space"}function ge(e){return e?/[a-zA-Z\s]/.test(String(e)):!0}function pe(e,t={}){const{messages:n={}}=t;return ge(e)?!0:de(n)}function be(e){const t=e.containsLowercase;return typeof t=="function"?t({}):t??"Must contain at least one lowercase letter"}function ye(e){return e?/[a-z]/.test(String(e)):!0}function $e(e,t={}){const{messages:n={}}=t;return ye(e)?!0:be(n)}function he(e){const t=e.containsNumeric;return typeof t=="function"?t({}):t??"Must contain at least one number"}function ve(e){return e?/\d/.test(String(e)):!0}function Me(e,t={}){const{messages:n={}}=t;return ve(e)?!0:he(n)}function we(e){const t=e.containsSymbol;return typeof t=="function"?t({}):t??"Must contain at least one symbol"}function Ne(e){return e?/[^\w\s]/.test(String(e)):!0}function Ae(e,t={}){const{messages:n={}}=t;return Ne(e)?!0:we(n)}function De(e){const t=e.containsUppercase;return typeof t=="function"?t({}):t??"Must contain at least one uppercase letter"}function Se(e){return e?/[A-Z]/.test(String(e)):!0}function Fe(e,t={}){const{messages:n={}}=t;return Se(e)?!0:De(n)}function xe(e,t){const n=e.dateAfter;return typeof n=="function"?n({date:t}):n??(t?`Must be after ${t}`:"Must be after today")}function Ve(e,t){if(!e)return!0;const n=new Date(String(e)),r=t?new Date(t):new Date;return!isNaN(n.getTime())&&!isNaN(r.getTime())&&n>r}function je(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return Ve(e,s)?!0:xe(r,s)}function Pe(e,t){const n=e.dateAfterOrEqual;return typeof n=="function"?n({date:t}):n??(t?`Must be after or equal to ${t}`:"Must be after or equal to today")}function Ce(e,t){if(!e)return!0;const n=new Date(String(e)),r=t?new Date(t):new Date;return!isNaN(n.getTime())&&!isNaN(r.getTime())&&n>=r}function Te(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return Ce(e,s)?!0:Pe(r,s)}function qe(e,t){const n=e.dateBefore;return typeof n=="function"?n({date:t}):n??(t?`Must be before ${t}`:"Must be before today")}function Ee(e,t){if(!e)return!0;const n=new Date(String(e)),r=t?new Date(t):new Date;return!isNaN(n.getTime())&&!isNaN(r.getTime())&&n<r}function Be(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return Ee(e,s)?!0:qe(r,s)}function Oe(e,t){const n=e.dateBeforeOrEqual;return typeof n=="function"?n({date:t}):n??(t?`Must be before or equal to ${t}`:"Must be before or equal to today")}function Re(e,t){if(!e)return!0;const n=new Date(String(e)),r=t?new Date(t):new Date;return!isNaN(n.getTime())&&!isNaN(r.getTime())&&n<=r}function Le(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return Re(e,s)?!0:Oe(r,s)}function We(e,t,n){const r=e.dateBetween;return typeof r=="function"?r({startDate:t,endDate:n}):r??`Must be between ${t} and ${n}`}function _e(e,t,n){if(!e)return!0;const r=new Date(String(e)),s=new Date(t),a=new Date(n);return!isNaN(r.getTime())&&!isNaN(s.getTime())&&!isNaN(a.getTime())&&r>=s&&r<=a}function ze(e,t={}){const{args:n=[],messages:r={}}=t,[s,a]=n;return _e(e,s,a)?!0:We(r,s,a)}const Ie=e=>{const t=e.replace(/[-\/\\^$*+?.()|[\]{}]/g,"\\$&"),n={YYYY:"\\d{4}",YY:"\\d{2}",MM:"(0[1-9]|1[012])",M:"([1-9]|1[012])",DD:"([012][0-9]|3[01])",D:"([012]?[0-9]|3[01])"};let r=t;return Object.keys(n).forEach(s=>{r=r.replace(new RegExp(s,"g"),n[s])}),new RegExp(`^${r}$`)};function Ke(e,t){const n=e.dateFormat;return typeof n=="function"?n({format:t}):n??`Must match the format ${t}`}function Ue(e,t){return e?t&&typeof t=="string"?Ie(t).test(String(e)):!isNaN(Date.parse(String(e))):!0}function ke(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return Ue(e,s)?!0:Ke(r,s)}function Ze(e){const t=e.email;return typeof t=="function"?t({}):t??"Please enter a valid email address"}function Ye(e){return e?/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(String(e)):!0}function Ge(e,t={}){const{messages:n={}}=t;return Ye(e)?!0:Ze(n)}function He(e,t){const n=e.endsWith;return typeof n=="function"?n({suffix:t.length===1?t[0]:t}):n??`Must end with: ${t.join(", ")}`}function Je(e,...t){if(!e)return!0;const n=String(e);return t.some(r=>n.endsWith(r))}function Qe(e,t={}){const{args:n=[],messages:r={}}=t;return Je(e,...n)?!0:He(r,n)}function Xe(e,t){const n=e.is;return typeof n=="function"?n({allowedValues:t}):n??`Must be one of: ${t.join(", ")}`}function et(e,...t){return!e&&e!==0&&e!==!1?!0:t.includes(String(e))}function tt(e,t={}){const{args:n=[],messages:r={}}=t;return et(e,...n)?!0:Xe(r,n)}function nt(e,t,n){const r=e.length;return n!==void 0?typeof r=="function"?r({min:t,max:n}):r??`Must be between ${t} and ${n} characters`:typeof r=="function"?r({value:t}):r??`Must be exactly ${t} characters`}function rt(e,t,n){if(!e&&e!==0)return!0;let r=0;if(typeof e=="string")r=e.length;else if(Array.isArray(e))r=e.length;else if(typeof e=="object"&&e!==null)r=Object.keys(e).length;else return!1;if(n!==void 0){const a=Number(t),u=Number(n);return!isNaN(a)&&!isNaN(u)&&r>=a&&r<=u}const s=Number(t);return!isNaN(s)&&r===s}function st(e,t={}){const{args:n=[],messages:r={}}=t,[s,a]=n;return rt(e,s,a)?!0:nt(r,s,a)}function ot(e){const t=e.lowercase;return typeof t=="function"?t({}):t??"Must contain only lowercase characters"}function at(e){return e?/^[a-z]+$/.test(String(e)):!0}function ut(e,t={}){const{messages:n={}}=t;return at(e)?!0:ot(n)}function it(e,t,n){const r=t.matches;return typeof r=="function"?r({value:e,pattern:n}):r??"Format is not valid"}function ct(e,t){if(!e)return!0;if(!t)return!1;try{if(t.startsWith("/")&&t.includes("/",1)){const n=t.lastIndexOf("/"),r=t.slice(1,n),s=t.slice(n+1);return new RegExp(r,s).test(String(e))}return String(e)===t}catch{return!1}}function lt(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return ct(e,s)?!0:it(e,r,s)}function ft(e,t){const n=e.max;return typeof n=="function"?n({value:t}):n??`Must be at most ${t}`}function mt(e,t){if(!e&&e!==0)return!0;const n=Number(t);if(isNaN(n))return!1;if(typeof e=="number")return e<=n;if(typeof e=="string"){const r=Number(e);return isNaN(r)?e.length<=n:r<=n}return Array.isArray(e)?e.length<=n:!1}function dt(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return mt(e,s)?!0:ft(r,s)}function gt(e,t){const n=e.min;return typeof n=="function"?n({value:t}):n??`Must be at least ${t}`}function pt(e,t){if(!e&&e!==0)return!0;const n=Number(t);if(isNaN(n))return!1;if(typeof e=="number")return e>=n;if(typeof e=="string"){const r=Number(e);return isNaN(r)?e.length>=n:r>=n}return Array.isArray(e)?e.length>=n:!1}function bt(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return pt(e,s)?!0:gt(r,s)}function yt(e,t){const n=e.not;return typeof n=="function"?n({disallowedValues:t}):n??`Must not be one of: ${t.join(", ")}`}function $t(e,...t){return!e&&e!==0&&e!==!1?!0:!t.includes(String(e))}function ht(e,t={}){const{args:n=[],messages:r={}}=t;return $t(e,...n)?!0:yt(r,n)}function vt(e){const t=e.number;return typeof t=="function"?t({}):t??"Must be a valid number"}function Mt(e){if(e==null||e==="")return!0;if(Number.isNaN(e))return!1;const t=Number(e);return!isNaN(t)&&isFinite(t)}function wt(e,t={}){const{messages:n={}}=t;return Mt(e)?!0:vt(n)}function Nt(e){const t=e.required;return typeof t=="function"?t({}):t??"This field is required"}function At(e){return e==null||e===""?!1:typeof e=="string"?e.trim().length>0:Array.isArray(e)?e.length>0:typeof e=="object"?Object.keys(e).length>0:e===0?!0:!!e}function Dt(e,t={}){const{messages:n={}}=t;return At(e)?!0:Nt(n)}function St(e,t){const n=e.startsWith;return typeof n=="function"?n({prefix:t.length===1?t[0]:t}):n??`Must start with: ${t.join(", ")}`}function Ft(e,...t){if(!e)return!0;const n=String(e);return t.some(r=>n.startsWith(r))}function xt(e,t={}){const{args:n=[],messages:r={}}=t;return Ft(e,...n)?!0:St(r,n)}function Vt(e){const t=e.symbol;return typeof t=="function"?t({}):t??"Must contain only symbols"}function jt(e){return e?/^[^\w\s]+$/.test(String(e)):!0}function Pt(e,t={}){const{messages:n={}}=t;return jt(e)?!0:Vt(n)}function Ct(e){const t=e.uppercase;return typeof t=="function"?t({}):t??"Must contain only uppercase characters"}function Tt(e){return e?/^[A-Z]+$/.test(String(e)):!0}function qt(e,t={}){const{messages:n={}}=t;return Tt(e)?!0:Ct(n)}function Et(e){const t=e.url;return typeof t=="function"?t({}):t??"Must be a valid URL"}function Bt(e){if(!e)return!0;try{const t=new URL(String(e));return["http:","https:","ftp:","ftps:"].includes(t.protocol)}catch{return!1}}function Ot(e,t={}){const{messages:n={}}=t;return Bt(e)?!0:Et(n)}const Rt=Object.freeze(Object.defineProperty({__proto__:null,accepted:U,alpha:Y,alphaSpaces:ee,alphanumeric:J,between:re,confirm:ae,containsAlpha:ce,containsAlphaSpaces:pe,containsAlphanumeric:me,containsLowercase:$e,containsNumeric:Me,containsSymbol:Ae,containsUppercase:Fe,dateAfter:je,dateAfterOrEqual:Te,dateBefore:Be,dateBeforeOrEqual:Le,dateBetween:ze,dateFormat:ke,email:Ge,endsWith:Qe,is:tt,length:st,lowercase:ut,matches:lt,max:dt,min:bt,not:ht,number:wt,required:Dt,startsWith:xt,symbol:Pt,uppercase:qt,url:Ot},Symbol.toStringTag,{value:"Module"})),Lt={install(e,t={}){V(Rt),t.rules&&V(t.rules);const n=o.isRef(t.locale)?t.locale:o.ref(t.locale??"en"),r={en:q};t.locales&&Object.keys(t.locales).forEach(a=>{r[a]={...r[a]??{},...t.locales[a]}});const s=o.shallowRef(r);e.provide(C,{locale:o.readonly(n),locales:o.readonly(s),setLocale:a=>{s.value[a]?n.value=a:console.warn(`Locale "${a}" not available.`)}})}},B=Symbol("form-state-context"),Wt=e=>{o.provide(B,e)},_t=(e=null)=>{const t=o.inject(B,e);if(!t&&t!==null)throw new Error("Context with formStateContextKey not found");return t},O=Symbol("form-context"),zt=e=>{o.provide(O,e)},It=(e=null)=>{const t=o.inject(O,e);if(!t&&t!==null)throw new Error("Context with formContextKey not found");return t};function Kt(e,t){if(!(!e||!t))return t.split(".").reduce((n,r)=>n==null?void 0:n[r],e)}function Ut(e,t,n){if(!e||!t)return e;const r=t.split("."),s=r.pop(),a=r.reduce((u,d,c)=>{if(u[d]===null||u[d]===void 0){const y=r[c+1]||s;u[d]=/^\d+$/.test(y)?[]:{}}return u[d]},e);return a[s]=n,e}const kt=o.defineComponent({__name:"Form",props:{modelValue:{default:()=>({})},modelModifiers:{}},emits:o.mergeModels(["submit"],["update:modelValue"]),setup(e,{emit:t}){const n=t,r=o.useModel(e,"modelValue");o.isReactive(r.value)||(r.value=o.reactive(r.value??{}));const s=o.ref({}),a=o.ref([]),u=o.computed(()=>r.value),d=o.computed(()=>a.value[0]??null),c=o.computed(()=>Object.keys(s.value).every(i=>s.value[i].isValid)),y=()=>{Object.keys(s.value).forEach(i=>{var p,g;(g=(p=s.value[i]).validate)==null||g.call(p)})},l=()=>{y(),c.value&&(a.value=[],n("submit",r.value,{setErrors:f,reset:m}))},f=(...i)=>{var p;if(i.length===1){const g=i[0];if(typeof g=="object"&&!Array.isArray(g)&&g!==null){Object.keys(g).forEach($=>{f($,g[$])});return}a.value=Array.isArray(g)?g:[g]}else if(i.length===2){const[g,$]=i;(p=s.value[g])==null||p.setErrors($)}},m=()=>{a.value=[],Object.keys(s.value).forEach(i=>{s.value[i].reset()})};return Wt({getFields(){return s.value},getField(i){return s.value[i]},addField(i,p){s.value[i]=p},removeField(i){delete s.value[i]},setFieldValue(i,p){Ut(r.value,i,p)},getFieldValue(i){return Kt(r.value,i)}}),zt({values:u,isValid:c,error:d,errors:a,fields:s,reset:m,setErrors:f,validate:y}),(i,p)=>(o.openBlock(),o.createElementBlock("form",{onSubmit:o.withModifiers(l,["prevent"])},[o.renderSlot(i.$slots,"default",o.normalizeProps(o.guardReactiveProps({isValid:c.value,error:d.value,errors:a.value,values:u.value,fields:s.value,reset:m,setErrors:f,validate:y})))],32))}});function R(e){if(!e||typeof e!="string")return{};const t=e.split("|").filter(Boolean),n={};for(const r of t){const[s,...a]=r.split(":"),u=s.trim();if(a.length===0)n[u]=!0;else{const c=a.join(":").split(",").map(y=>y.trim());n[u]=c.length===1?c[0]:c}}return n}const Zt=(e,t,n={},r={})=>{if(!t)return!0;const s=R(t),a=[];for(const[u,d]of Object.entries(s)){const c=z(u);if(c){const l={args:d===!0?[]:Array.isArray(d)?d:[d],messages:n,fields:r},f=c(e,l);f!==!0&&a.push(f??"Invalid value")}else console.warn(`[Forms] Validation rule "${u}" not found.`)}return a.length===0?!0:a},Yt=(e,t)=>{const n=t(e);return n===!0?!0:typeof n=="string"?[n]:Array.isArray(n)?n:!!n?!0:["Invalid value"]};typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const j=()=>{};function Gt(e,t){function n(...r){return new Promise((s,a)=>{Promise.resolve(e(()=>t.apply(this,r),{fn:t,thisArg:this,args:r})).then(s).catch(a)})}return n}const Ht=e=>e();function Jt(e,t={}){let n,r,s=j;const a=c=>{clearTimeout(c),s(),s=j};let u;return c=>{const y=o.toValue(e),l=o.toValue(t.maxWait);return n&&a(n),y<=0||l!==void 0&&l<=0?(r&&(a(r),r=void 0),Promise.resolve(c())):new Promise((f,m)=>{s=t.rejectOnCancel?m:f,u=c,l&&!r&&(r=setTimeout(()=>{n&&a(n),r=void 0,f(u())},l)),n=setTimeout(()=>{r&&a(r),r=void 0,f(c())},y)})}}function Qt(e,t,n={}){const{eventFilter:r=Ht,...s}=n;return o.watch(e,Gt(r,t),s)}function P(e,t,n={}){const{debounce:r=0,maxWait:s=void 0,...a}=n;return Qt(e,t,{...a,eventFilter:Jt(r,{maxWait:s})})}function Xt(e,t={}){const n=o.ref(!0),r=o.ref(!1),s=o.ref([]),a=o.ref(null),u=o.computed(()=>o.toValue(t.rules)??null),d=o.computed(()=>o.toValue(t.messages)??{}),c=o.computed(()=>o.toValue(t.fields)??{}),y=o.computed(()=>{if(!u.value||typeof u.value!="string")return null;const i=R(u.value).confirm;if(!i||i===!0)return null;const p=c.value[i];return(p==null?void 0:p.value)??null}),l=()=>{let m;return typeof u.value=="function"?m=Yt(o.toValue(e),u.value):m=Zt(o.toValue(e),u.value,d.value,c.value),m===!0?(n.value=!0,s.value=[],!0):Array.isArray(m)?(n.value=!1,s.value=m,!1):m},f=()=>{a.value&&clearTimeout(a.value),r.value=!0,n.value=!0,s.value=[],a.value=setTimeout(()=>{r.value=!1,a.value=null},1e3)};return P(()=>o.toValue(e),()=>{r.value||l()},{debounce:300}),P(()=>o.toValue(y),()=>{r.value||o.toValue(e)&&l()},{debounce:300}),{validate:l,reset:f,isValid:o.readonly(n),errors:o.readonly(s)}}const L=Symbol("field-context"),en=e=>{o.provide(L,e)},tn=(e=null)=>{const t=o.inject(L,e);if(!t&&t!==null)throw new Error("Context with fieldContextKey not found");return t},nn=o.defineComponent({__name:"Field",props:o.mergeModels({id:{},name:{},validation:{type:[String,Function,null]},validationMessages:{},error:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const t=e,n=o.useModel(e,"modelValue"),r=o.useId(),s=_t(),a=T(),u=o.computed({get:()=>s?s.getFieldValue(t.name):n.value,set:b=>{s?s.setFieldValue(t.name,b):n.value=b}}),d=o.computed(()=>t.validation??null),c=o.computed(()=>({...a?a.locales.value[a.locale.value]:{},...t.validationMessages??{}})),y=o.computed({get:()=>s?s.getFields():{},set:()=>{}}),l=Xt(u,{rules:d,messages:c,fields:y}),f=o.ref(!1),m=o.ref(!1),i=o.ref([]),p=o.computed(()=>u.value??null),g=o.computed(()=>l.isValid.value&&i.value.length===0),$=o.computed(()=>[...l.errors.value,...i.value]),h=o.computed(()=>$.value[0]??null),A=o.toValue(u),v=t.id??r,M=`${v}-error`,w=`${v}-help`,W=b=>{i.value=Array.isArray(b)?b:[b]},N=()=>{u.value=A,f.value=!1,m.value=!1,i.value=[],l.reset()};o.watch(()=>t.error,b=>{b?i.value=Array.isArray(b)?b:[b]:i.value=[]},{immediate:!0});const D=o.computed(()=>({id:v,name:t.name,modelValue:u.value,"aria-invalid":!!h.value,"aria-describedby":h.value?`${M} ${w}`:w,"aria-errormessage":h.value?M:void 0,"onUpdate:modelValue":b=>{u.value=b,!m.value&&b!==A&&(m.value=!0)},onBlur:()=>{f.value||(f.value=!0,l.validate())}})),S={for:v},F={id:M,role:"alert","aria-live":"polite"},x={id:w};return o.onMounted(()=>{s&&s.addField(t.name,{value:p,isValid:g,isTouched:f,isDirty:m,error:h,errors:$,setErrors:W,reset:N,validate:l.validate})}),o.onUnmounted(()=>{s&&s.removeField(t.name)}),en({inputValue:u,inputProps:D,labelProps:S,helpProps:x,errorProps:F,isValid:g,isTouched:f,isDirty:m,error:h,errors:$,validate:l.validate,reset:N}),(b,on)=>(o.openBlock(),o.createElementBlock("div",null,[o.renderSlot(b.$slots,"default",o.normalizeProps(o.guardReactiveProps({inputValue:u.value,inputProps:D.value,labelProps:S,helpProps:x,errorProps:F,isValid:g.value,isTouched:f.value,isDirty:m.value,error:h.value,errors:$.value,validate:o.unref(l).validate,reset:N})))]))}});function rn(){const e=T();if(!e)throw new Error("[Valiform] useLocale() must be used inside a component with FormsPlugin installed.");return{locale:e.locale,locales:e.locales,setLocale:e.setLocale}}const sn={required:"Este campo es obligatorio",email:"Por favor ingresa un email válido",min:({value:e})=>`Debe ser al menos ${e}`,max:({value:e})=>`Debe ser como máximo ${e}`,matches:"El formato no es válido",number:"Debe ser un número válido",accepted:"Debe ser aceptado",alpha:"Debe contener solo caracteres alfabéticos",alphanumeric:"Debe contener solo letras y números",alphaSpaces:"Debe contener solo letras y espacios",between:({min:e,max:t})=>`Debe estar entre ${e} y ${t}`,confirm:({fieldName:e})=>`Debe coincidir con ${e}`,containsAlpha:"Debe contener al menos una letra",containsAlphanumeric:"Debe contener al menos una letra o número",containsAlphaSpaces:"Debe contener al menos una letra o espacio",containsLowercase:"Debe contener al menos una letra minúscula",containsNumeric:"Debe contener al menos un número",containsSymbol:"Debe contener al menos un símbolo",containsUppercase:"Debe contener al menos una letra mayúscula",dateAfter:({date:e})=>e?`Debe ser posterior a ${e}`:"Debe ser posterior a hoy",dateAfterOrEqual:({date:e})=>e?`Debe ser posterior o igual a ${e}`:"Debe ser posterior o igual a hoy",dateBefore:({date:e})=>e?`Debe ser anterior a ${e}`:"Debe ser anterior a hoy",dateBeforeOrEqual:({date:e})=>e?`Debe ser anterior o igual a ${e}`:"Debe ser anterior o igual a hoy",dateBetween:({startDate:e,endDate:t})=>`Debe estar entre ${e} y ${t}`,dateFormat:({format:e})=>`Debe coincidir con el formato ${e}`,endsWith:({suffix:e})=>Array.isArray(e)?`Debe terminar con uno de: ${e.map(t=>`"${t}"`).join(", ")}`:`Debe terminar con "${e}"`,is:({allowedValues:e})=>`Debe ser uno de: ${Array.isArray(e)?e.join(", "):e}`,length:({value:e,min:t,max:n})=>t!==void 0&&n!==void 0?`Debe tener entre ${t} y ${n} caracteres`:e!==void 0?`Debe tener exactamente ${e} caracteres`:"Longitud inválida",lowercase:"Debe contener solo caracteres en minúscula",not:({disallowedValues:e})=>`No debe ser uno de: ${Array.isArray(e)?e.join(", "):e}`,startsWith:({prefix:e})=>Array.isArray(e)?`Debe comenzar con uno de: ${e.join(", ")}`:`Debe comenzar con "${e}"`,symbol:"Debe contener solo símbolos",uppercase:"Debe contener solo caracteres en mayúscula",url:"Debe ser una URL válida"};exports.Field=nn;exports.Form=kt;exports.FormsPlugin=Lt;exports.en=q;exports.es=sn;exports.useFieldContext=tn;exports.useFormContext=It;exports.useLocale=rn;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),T=Symbol("locale-context"),q=(e=null)=>{const t=o.inject(T,e);if(!t&&t!==null)throw new Error("Context with localeContextKey not found");return t},E={required:"This field is required",email:"Please enter a valid email address",min:({value:e})=>`Must be at least ${e}`,max:({value:e})=>`Must be at most ${e}`,matches:"Format is not valid",number:"Must be a valid number",accepted:"Must be accepted",alpha:"Must contain only alphabetical characters",alphanumeric:"Must contain only letters and numbers",alphaSpaces:"Must contain only letters and spaces",between:({min:e,max:t})=>`Must be between ${e} and ${t}`,confirm:({fieldName:e})=>`Must match ${e}`,containsAlpha:"Must contain at least one letter",containsAlphanumeric:"Must contain at least one letter or number",containsAlphaSpaces:"Must contain at least one letter or space",containsLowercase:"Must contain at least one lowercase letter",containsNumeric:"Must contain at least one number",containsSymbol:"Must contain at least one symbol",containsUppercase:"Must contain at least one uppercase letter",dateAfter:({date:e})=>e?`Must be after ${e}`:"Must be after today",dateAfterOrEqual:({date:e})=>e?`Must be after or equal to ${e}`:"Must be after or equal to today",dateBefore:({date:e})=>e?`Must be before ${e}`:"Must be before today",dateBeforeOrEqual:({date:e})=>e?`Must be before or equal to ${e}`:"Must be before or equal to today",dateBetween:({startDate:e,endDate:t})=>`Must be between ${e} and ${t}`,dateFormat:({format:e})=>`Must match the format ${e}`,endsWith:({suffix:e})=>Array.isArray(e)?`Must end with one of: ${e.map(t=>`"${t}"`).join(", ")}`:`Must end with "${e}"`,is:({allowedValues:e})=>`Must be one of: ${Array.isArray(e)?e.join(", "):e}`,length:({value:e,min:t,max:n})=>t!==void 0&&n!==void 0?`Must be between ${t} and ${n} characters`:e!==void 0?`Must be exactly ${e} characters`:"Invalid length",lowercase:"Must contain only lowercase characters",not:({disallowedValues:e})=>`Must not be one of: ${Array.isArray(e)?e.join(", "):e}`,startsWith:({prefix:e})=>Array.isArray(e)?`Must start with one of: ${e.join(", ")}`:`Must start with "${e}"`,symbol:"Must contain only symbols",uppercase:"Must contain only uppercase characters",url:"Must be a valid URL"},B=o.shallowRef(new Map),W=(e,t)=>{B.value.set(e,t)},j=e=>{Object.entries(e).forEach(([t,n])=>{W(t,n)})},_=e=>B.value.get(e);function z(e){const t=e.accepted;return typeof t=="function"?t({}):t??"Must be accepted"}function U(e){return e?["yes","on","1","true"].includes(String(e).toLowerCase()):!1}function k(e,t={}){const{messages:n={}}=t;return U(e)?!0:z(n)}function K(e){const t=e.alpha;return typeof t=="function"?t({}):t??"Must contain only alphabetical characters"}function Z(e){return e?/^[a-zA-Z]+$/.test(String(e)):!0}function Y(e,t={}){const{messages:n={}}=t;return Z(e)?!0:K(n)}function G(e){const t=e.alphanumeric;return typeof t=="function"?t({}):t??"Must contain only letters and numbers"}function H(e){return e?/^[a-zA-Z0-9]+$/.test(String(e)):!0}function J(e,t={}){const{messages:n={}}=t;return H(e)?!0:G(n)}function Q(e){const t=e.alphaSpaces;return typeof t=="function"?t({}):t??"Must contain only letters and spaces"}function X(e){return e?/^[a-zA-Z\s]+$/.test(String(e)):!0}function ee(e,t={}){const{messages:n={}}=t;return X(e)?!0:Q(n)}function te(e,t,n){const r=e.between;return typeof r=="function"?r({min:t,max:n}):r??`Must be between ${t} and ${n}`}function ne(e,t,n){if(!e&&e!==0)return!0;const r=Number(e);if(isNaN(r))return!1;const s=Number(t),a=Number(n);return isNaN(s)||isNaN(a)?!1:r>=s&&r<=a}function re(e,t={}){const{args:n=[],messages:r={}}=t,[s,a]=n;return ne(e,s,a)?!0:te(r,s,a)}function se(e,t){const n=e.confirm;return typeof n=="function"?n({fieldName:t}):n??`Must match ${t}`}function oe(e,t,n){var r;return e?n?e===((r=n[t])==null?void 0:r.value):!1:!0}function ae(e,t={}){const{args:n=[],messages:r={},fields:s={}}=t,[a]=n;return oe(e,a,s)?!0:se(r,a)}function ue(e){const t=e.containsAlpha;return typeof t=="function"?t({}):t??"Must contain at least one letter"}function ie(e){return e?/[a-zA-Z]/.test(String(e)):!0}function ce(e,t={}){const{messages:n={}}=t;return ie(e)?!0:ue(n)}function le(e){const t=e.containsAlphanumeric;return typeof t=="function"?t({}):t??"Must contain at least one letter or number"}function fe(e){return e?/[a-zA-Z0-9]/.test(String(e)):!0}function me(e,t={}){const{messages:n={}}=t;return fe(e)?!0:le(n)}function de(e){const t=e.containsAlphaSpaces;return typeof t=="function"?t({}):t??"Must contain at least one letter or space"}function ge(e){return e?/[a-zA-Z\s]/.test(String(e)):!0}function pe(e,t={}){const{messages:n={}}=t;return ge(e)?!0:de(n)}function be(e){const t=e.containsLowercase;return typeof t=="function"?t({}):t??"Must contain at least one lowercase letter"}function ye(e){return e?/[a-z]/.test(String(e)):!0}function $e(e,t={}){const{messages:n={}}=t;return ye(e)?!0:be(n)}function he(e){const t=e.containsNumeric;return typeof t=="function"?t({}):t??"Must contain at least one number"}function ve(e){return e?/\d/.test(String(e)):!0}function Me(e,t={}){const{messages:n={}}=t;return ve(e)?!0:he(n)}function Ne(e){const t=e.containsSymbol;return typeof t=="function"?t({}):t??"Must contain at least one symbol"}function we(e){return e?/[^\w\s]/.test(String(e)):!0}function Ae(e,t={}){const{messages:n={}}=t;return we(e)?!0:Ne(n)}function De(e){const t=e.containsUppercase;return typeof t=="function"?t({}):t??"Must contain at least one uppercase letter"}function Se(e){return e?/[A-Z]/.test(String(e)):!0}function Fe(e,t={}){const{messages:n={}}=t;return Se(e)?!0:De(n)}function Ve(e,t){const n=e.dateAfter;return typeof n=="function"?n({date:t}):n??(t?`Must be after ${t}`:"Must be after today")}function xe(e,t){if(!e)return!0;const n=new Date(String(e)),r=t?new Date(t):new Date;return!isNaN(n.getTime())&&!isNaN(r.getTime())&&n>r}function je(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return xe(e,s)?!0:Ve(r,s)}function Pe(e,t){const n=e.dateAfterOrEqual;return typeof n=="function"?n({date:t}):n??(t?`Must be after or equal to ${t}`:"Must be after or equal to today")}function Ce(e,t){if(!e)return!0;const n=new Date(String(e)),r=t?new Date(t):new Date;return!isNaN(n.getTime())&&!isNaN(r.getTime())&&n>=r}function Te(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return Ce(e,s)?!0:Pe(r,s)}function qe(e,t){const n=e.dateBefore;return typeof n=="function"?n({date:t}):n??(t?`Must be before ${t}`:"Must be before today")}function Ee(e,t){if(!e)return!0;const n=new Date(String(e)),r=t?new Date(t):new Date;return!isNaN(n.getTime())&&!isNaN(r.getTime())&&n<r}function Be(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return Ee(e,s)?!0:qe(r,s)}function Oe(e,t){const n=e.dateBeforeOrEqual;return typeof n=="function"?n({date:t}):n??(t?`Must be before or equal to ${t}`:"Must be before or equal to today")}function Re(e,t){if(!e)return!0;const n=new Date(String(e)),r=t?new Date(t):new Date;return!isNaN(n.getTime())&&!isNaN(r.getTime())&&n<=r}function Ie(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return Re(e,s)?!0:Oe(r,s)}function Le(e,t,n){const r=e.dateBetween;return typeof r=="function"?r({startDate:t,endDate:n}):r??`Must be between ${t} and ${n}`}function We(e,t,n){if(!e)return!0;const r=new Date(String(e)),s=new Date(t),a=new Date(n);return!isNaN(r.getTime())&&!isNaN(s.getTime())&&!isNaN(a.getTime())&&r>=s&&r<=a}function _e(e,t={}){const{args:n=[],messages:r={}}=t,[s,a]=n;return We(e,s,a)?!0:Le(r,s,a)}const ze=e=>{const t=e.replace(/[-\/\\^$*+?.()|[\]{}]/g,"\\$&"),n={YYYY:"\\d{4}",YY:"\\d{2}",MM:"(0[1-9]|1[012])",M:"([1-9]|1[012])",DD:"([012][0-9]|3[01])",D:"([012]?[0-9]|3[01])"};let r=t;return Object.keys(n).forEach(s=>{r=r.replace(new RegExp(s,"g"),n[s])}),new RegExp(`^${r}$`)};function Ue(e,t){const n=e.dateFormat;return typeof n=="function"?n({format:t}):n??`Must match the format ${t}`}function ke(e,t){return e?t&&typeof t=="string"?ze(t).test(String(e)):!isNaN(Date.parse(String(e))):!0}function Ke(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return ke(e,s)?!0:Ue(r,s)}function Ze(e){const t=e.email;return typeof t=="function"?t({}):t??"Please enter a valid email address"}function Ye(e){return e?/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(String(e)):!0}function Ge(e,t={}){const{messages:n={}}=t;return Ye(e)?!0:Ze(n)}function He(e,t){const n=e.endsWith;return typeof n=="function"?n({suffix:t.length===1?t[0]:t}):n??`Must end with: ${t.join(", ")}`}function Je(e,...t){if(!e)return!0;const n=String(e);return t.some(r=>n.endsWith(r))}function Qe(e,t={}){const{args:n=[],messages:r={}}=t;return Je(e,...n)?!0:He(r,n)}function Xe(e,t){const n=e.is;return typeof n=="function"?n({allowedValues:t}):n??`Must be one of: ${t.join(", ")}`}function et(e,...t){return!e&&e!==0&&e!==!1?!0:t.includes(String(e))}function tt(e,t={}){const{args:n=[],messages:r={}}=t;return et(e,...n)?!0:Xe(r,n)}function nt(e,t,n){const r=e.length;return n!==void 0?typeof r=="function"?r({min:t,max:n}):r??`Must be between ${t} and ${n} characters`:typeof r=="function"?r({value:t}):r??`Must be exactly ${t} characters`}function rt(e,t,n){if(!e&&e!==0)return!0;let r=0;if(typeof e=="string")r=e.length;else if(Array.isArray(e))r=e.length;else if(typeof e=="object"&&e!==null)r=Object.keys(e).length;else return!1;if(n!==void 0){const a=Number(t),u=Number(n);return!isNaN(a)&&!isNaN(u)&&r>=a&&r<=u}const s=Number(t);return!isNaN(s)&&r===s}function st(e,t={}){const{args:n=[],messages:r={}}=t,[s,a]=n;return rt(e,s,a)?!0:nt(r,s,a)}function ot(e){const t=e.lowercase;return typeof t=="function"?t({}):t??"Must contain only lowercase characters"}function at(e){return e?/^[a-z]+$/.test(String(e)):!0}function ut(e,t={}){const{messages:n={}}=t;return at(e)?!0:ot(n)}function it(e,t,n){const r=t.matches;return typeof r=="function"?r({value:e,pattern:n}):r??"Format is not valid"}function ct(e,t){if(!e)return!0;if(!t)return!1;try{if(t.startsWith("/")&&t.includes("/",1)){const n=t.lastIndexOf("/"),r=t.slice(1,n),s=t.slice(n+1);return new RegExp(r,s).test(String(e))}return String(e)===t}catch{return!1}}function lt(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return ct(e,s)?!0:it(e,r,s)}function ft(e,t){const n=e.max;return typeof n=="function"?n({value:t}):n??`Must be at most ${t}`}function mt(e,t){if(!e&&e!==0)return!0;const n=Number(t);if(isNaN(n))return!1;if(typeof e=="number")return e<=n;if(typeof e=="string"){const r=Number(e);return isNaN(r)?e.length<=n:r<=n}return Array.isArray(e)?e.length<=n:!1}function dt(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return mt(e,s)?!0:ft(r,s)}function gt(e,t){const n=e.min;return typeof n=="function"?n({value:t}):n??`Must be at least ${t}`}function pt(e,t){if(!e&&e!==0)return!0;const n=Number(t);if(isNaN(n))return!1;if(typeof e=="number")return e>=n;if(typeof e=="string"){const r=Number(e);return isNaN(r)?e.length>=n:r>=n}return Array.isArray(e)?e.length>=n:!1}function bt(e,t={}){const{args:n=[],messages:r={}}=t,[s]=n;return pt(e,s)?!0:gt(r,s)}function yt(e,t){const n=e.not;return typeof n=="function"?n({disallowedValues:t}):n??`Must not be one of: ${t.join(", ")}`}function $t(e,...t){return!e&&e!==0&&e!==!1?!0:!t.includes(String(e))}function ht(e,t={}){const{args:n=[],messages:r={}}=t;return $t(e,...n)?!0:yt(r,n)}function vt(e){const t=e.number;return typeof t=="function"?t({}):t??"Must be a valid number"}function Mt(e){if(e==null||e==="")return!0;if(Number.isNaN(e))return!1;const t=Number(e);return!isNaN(t)&&isFinite(t)}function Nt(e,t={}){const{messages:n={}}=t;return Mt(e)?!0:vt(n)}function wt(e){const t=e.required;return typeof t=="function"?t({}):t??"This field is required"}function At(e){return e==null||e===""?!1:typeof e=="string"?e.trim().length>0:Array.isArray(e)?e.length>0:typeof e=="object"?Object.keys(e).length>0:e===0?!0:!!e}function Dt(e,t={}){const{messages:n={}}=t;return At(e)?!0:wt(n)}function St(e,t){const n=e.startsWith;return typeof n=="function"?n({prefix:t.length===1?t[0]:t}):n??`Must start with: ${t.join(", ")}`}function Ft(e,...t){if(!e)return!0;const n=String(e);return t.some(r=>n.startsWith(r))}function Vt(e,t={}){const{args:n=[],messages:r={}}=t;return Ft(e,...n)?!0:St(r,n)}function xt(e){const t=e.symbol;return typeof t=="function"?t({}):t??"Must contain only symbols"}function jt(e){return e?/^[^\w\s]+$/.test(String(e)):!0}function Pt(e,t={}){const{messages:n={}}=t;return jt(e)?!0:xt(n)}function Ct(e){const t=e.uppercase;return typeof t=="function"?t({}):t??"Must contain only uppercase characters"}function Tt(e){return e?/^[A-Z]+$/.test(String(e)):!0}function qt(e,t={}){const{messages:n={}}=t;return Tt(e)?!0:Ct(n)}function Et(e){const t=e.url;return typeof t=="function"?t({}):t??"Must be a valid URL"}function Bt(e){if(!e)return!0;try{const t=new URL(String(e));return["http:","https:","ftp:","ftps:"].includes(t.protocol)}catch{return!1}}function Ot(e,t={}){const{messages:n={}}=t;return Bt(e)?!0:Et(n)}const Rt=Object.freeze(Object.defineProperty({__proto__:null,accepted:k,alpha:Y,alphaSpaces:ee,alphanumeric:J,between:re,confirm:ae,containsAlpha:ce,containsAlphaSpaces:pe,containsAlphanumeric:me,containsLowercase:$e,containsNumeric:Me,containsSymbol:Ae,containsUppercase:Fe,dateAfter:je,dateAfterOrEqual:Te,dateBefore:Be,dateBeforeOrEqual:Ie,dateBetween:_e,dateFormat:Ke,email:Ge,endsWith:Qe,is:tt,length:st,lowercase:ut,matches:lt,max:dt,min:bt,not:ht,number:Nt,required:Dt,startsWith:Vt,symbol:Pt,uppercase:qt,url:Ot},Symbol.toStringTag,{value:"Module"})),It={install(e,t={}){j(Rt),t.rules&&j(t.rules);const n=o.isRef(t.locale)?t.locale:o.ref(t.locale??"en"),r={en:E};t.locales&&Object.keys(t.locales).forEach(a=>{r[a]={...r[a]??{},...t.locales[a]}});const s=o.shallowRef(r);e.provide(T,{locale:o.readonly(n),locales:o.readonly(s),setLocale:a=>{s.value[a]?n.value=a:console.warn(`Locale "${a}" not available.`)}})}},O=Symbol("form-state-context"),Lt=e=>{o.provide(O,e)},Wt=(e=null)=>{const t=o.inject(O,e);if(!t&&t!==null)throw new Error("Context with formStateContextKey not found");return t},R=Symbol("form-context"),_t=e=>{o.provide(R,e)},zt=(e=null)=>{const t=o.inject(R,e);if(!t&&t!==null)throw new Error("Context with formContextKey not found");return t};function Ut(e,t){if(!(!e||!t))return t.split(".").reduce((n,r)=>n==null?void 0:n[r],e)}function kt(e,t,n){if(!e||!t)return e;const r=t.split("."),s=r.pop(),a=r.reduce((u,l,c)=>{if(u[l]===null||u[l]===void 0){const g=r[c+1]||s;u[l]=/^\d+$/.test(g)?[]:{}}return u[l]},e);return a[s]=n,e}const Kt=o.defineComponent({__name:"Form",props:{modelValue:{default:()=>({})},modelModifiers:{}},emits:o.mergeModels(["submit"],["update:modelValue"]),setup(e,{emit:t}){const n=t,r=o.useModel(e,"modelValue");o.isReactive(r.value)||(r.value=o.reactive(r.value??{}));const s=o.ref({}),a=o.ref([]),u=o.computed(()=>r.value),l=o.computed(()=>a.value[0]??null),c=o.computed(()=>Object.keys(s.value).every(i=>s.value[i].isValid)),g=()=>{Object.keys(s.value).forEach(i=>{var b,p;(p=(b=s.value[i]).validate)==null||p.call(b)})},f=()=>{g(),c.value&&(a.value=[],n("submit",r.value,{setErrors:m,reset:d}))},m=(...i)=>{var b;if(i.length===1){const p=i[0];if(typeof p=="object"&&!Array.isArray(p)&&p!==null){Object.keys(p).forEach($=>{m($,p[$])});return}a.value=Array.isArray(p)?p:[p]}else if(i.length===2){const[p,$]=i;(b=s.value[p])==null||b.setErrors($)}},d=()=>{a.value=[],Object.keys(s.value).forEach(i=>{s.value[i].reset()})};return Lt({getFields(){return s.value},getField(i){return s.value[i]},addField(i,b){s.value[i]=b},removeField(i){delete s.value[i]},setFieldValue(i,b){kt(r.value,i,b)},getFieldValue(i){return Ut(r.value,i)}}),_t({values:u,isValid:c,error:l,errors:a,fields:s,reset:d,setErrors:m,validate:g}),(i,b)=>(o.openBlock(),o.createElementBlock("form",{onSubmit:o.withModifiers(f,["prevent"])},[o.renderSlot(i.$slots,"default",o.normalizeProps(o.guardReactiveProps({isValid:c.value,error:l.value,errors:a.value,values:u.value,fields:s.value,reset:d,setErrors:m,validate:g})))],32))}});function I(e){if(!e||typeof e!="string")return{};const t=e.split("|").filter(Boolean),n={};for(const r of t){const[s,...a]=r.split(":"),u=s.trim();if(a.length===0)n[u]=!0;else{const c=a.join(":").split(",").map(g=>g.trim());n[u]=c.length===1?c[0]:c}}return n}const Zt=(e,t,n={},r={})=>{if(!t)return!0;const s=I(t),a=[];for(const[u,l]of Object.entries(s)){const c=_(u);if(c){const f={args:l===!0?[]:Array.isArray(l)?l:[l],messages:n,fields:r},m=c(e,f);m!==!0&&a.push(m??"Invalid value")}else console.warn(`[Forms] Validation rule "${u}" not found.`)}return a.length===0?!0:a},Yt=(e,t)=>{const n=t(e);return n===!0?!0:typeof n=="string"?[n]:Array.isArray(n)?n:!!n?!0:["Invalid value"]};typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const P=()=>{};function Gt(e,t){function n(...r){return new Promise((s,a)=>{Promise.resolve(e(()=>t.apply(this,r),{fn:t,thisArg:this,args:r})).then(s).catch(a)})}return n}const Ht=e=>e();function Jt(e,t={}){let n,r,s=P;const a=c=>{clearTimeout(c),s(),s=P};let u;return c=>{const g=o.toValue(e),f=o.toValue(t.maxWait);return n&&a(n),g<=0||f!==void 0&&f<=0?(r&&(a(r),r=void 0),Promise.resolve(c())):new Promise((m,d)=>{s=t.rejectOnCancel?d:m,u=c,f&&!r&&(r=setTimeout(()=>{n&&a(n),r=void 0,m(u())},f)),n=setTimeout(()=>{r&&a(r),r=void 0,m(c())},g)})}}function Qt(e,t,n={}){const{eventFilter:r=Ht,...s}=n;return o.watch(e,Gt(r,t),s)}function C(e,t,n={}){const{debounce:r=0,maxWait:s=void 0,...a}=n;return Qt(e,t,{...a,eventFilter:Jt(r,{maxWait:s})})}function Xt(e,t={}){const n=o.ref(!0),r=o.ref(!1),s=o.ref([]),a=o.ref(null),u=o.computed(()=>o.toValue(t.rules)??null),l=o.computed(()=>o.toValue(t.messages)??{}),c=o.computed(()=>o.toValue(t.fields)??{}),g=o.computed(()=>{if(!u.value||typeof u.value!="string")return null;const i=I(u.value).confirm;if(!i||i===!0)return null;const b=c.value[i];return(b==null?void 0:b.value)??null}),f=()=>{let d;return typeof u.value=="function"?d=Yt(o.toValue(e),u.value):d=Zt(o.toValue(e),u.value,l.value,c.value),d===!0?(n.value=!0,s.value=[],!0):Array.isArray(d)?(n.value=!1,s.value=d,!1):d},m=()=>{a.value&&clearTimeout(a.value),r.value=!0,n.value=!0,s.value=[],a.value=setTimeout(()=>{r.value=!1,a.value=null},1e3)};return C(()=>o.toValue(e),()=>{r.value||f()},{debounce:300}),C(()=>o.toValue(g),()=>{r.value||o.toValue(e)&&f()},{debounce:300}),{validate:f,reset:m,isValid:o.readonly(n),errors:o.readonly(s)}}const M=Symbol("field-context"),en=e=>{o.provide(M,e)};function tn(e){if(e===void 0){const t=o.inject(M);if(!t)throw new Error("useFieldContext() must be called inside a Field component");return t}return o.inject(M,e)}const nn=o.defineComponent({__name:"Field",props:o.mergeModels({id:{},name:{},validation:{type:[String,Function,null]},validationMessages:{},error:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(e){const t=e,n=o.useModel(e,"modelValue"),r=o.useId(),s=Wt(),a=q(),u=o.computed({get:()=>s?s.getFieldValue(t.name):n.value,set:y=>{s?s.setFieldValue(t.name,y):n.value=y}}),l=o.computed(()=>t.validation??null),c=o.computed(()=>({...a?a.locales.value[a.locale.value]:{},...t.validationMessages??{}})),g=o.computed({get:()=>s?s.getFields():{},set:()=>{}}),f=Xt(u,{rules:l,messages:c,fields:g}),m=o.ref(!1),d=o.ref(!1),i=o.ref([]),b=o.computed(()=>u.value??null),p=o.computed(()=>f.isValid.value&&i.value.length===0),$=o.computed(()=>[...f.errors.value,...i.value]),h=o.computed(()=>$.value[0]??null),D=o.toValue(u),v=t.id??r,N=`${v}-error`,w=`${v}-help`,L=y=>{i.value=Array.isArray(y)?y:[y]},A=()=>{u.value=D,m.value=!1,d.value=!1,i.value=[],f.reset()};o.watch(()=>t.error,y=>{y?i.value=Array.isArray(y)?y:[y]:i.value=[]},{immediate:!0});const S=o.computed(()=>({id:v,name:t.name,modelValue:u.value,"aria-invalid":!!h.value,"aria-describedby":h.value?`${N} ${w}`:w,"aria-errormessage":h.value?N:void 0,"onUpdate:modelValue":y=>{u.value=y,!d.value&&y!==D&&(d.value=!0)},onBlur:()=>{m.value||(m.value=!0,f.validate())}})),F={for:v},V={id:N,role:"alert","aria-live":"polite"},x={id:w};return o.onMounted(()=>{s&&s.addField(t.name,{value:b,isValid:p,isTouched:m,isDirty:d,error:h,errors:$,setErrors:L,reset:A,validate:f.validate})}),o.onUnmounted(()=>{s&&s.removeField(t.name)}),en({inputValue:u,inputProps:S,labelProps:F,helpProps:x,errorProps:V,isValid:p,isTouched:m,isDirty:d,error:h,errors:$,validate:f.validate,reset:A}),(y,an)=>(o.openBlock(),o.createElementBlock("div",null,[o.renderSlot(y.$slots,"default",o.normalizeProps(o.guardReactiveProps({inputValue:u.value,inputProps:S.value,labelProps:F,helpProps:x,errorProps:V,isValid:p.value,isTouched:m.value,isDirty:d.value,error:h.value,errors:$.value,validate:o.unref(f).validate,reset:A})))]))}});function rn(){const e=q();if(!e)throw new Error("[Valiform] useLocale() must be used inside a component with FormsPlugin installed.");return{locale:e.locale,locales:e.locales,setLocale:e.setLocale}}function sn(e){const t=o.inject(M,null);if(t)return t;const n=o.toValue(e),r=o.useId(),s=`${r}-error`,a=`${r}-help`,u=o.ref(!1),l=o.ref(!1),c=o.computed(()=>({id:r,name:r,modelValue:e.value,"aria-invalid":!1,"aria-describedby":a,"aria-errormessage":void 0,"onUpdate:modelValue":g=>{e.value=g,!l.value&&g!==n&&(l.value=!0)},onBlur:()=>{u.value||(u.value=!0)}}));return{inputValue:e,inputProps:c,labelProps:{for:r},helpProps:{id:a},errorProps:{id:s,role:"alert","aria-live":"polite"},isValid:o.computed(()=>!0),isTouched:u,isDirty:l,error:o.computed(()=>null),errors:o.computed(()=>[]),validate:()=>!0,reset:()=>{e.value=n,u.value=!1,l.value=!1}}}const on={required:"Este campo es obligatorio",email:"Por favor ingresa un email válido",min:({value:e})=>`Debe ser al menos ${e}`,max:({value:e})=>`Debe ser como máximo ${e}`,matches:"El formato no es válido",number:"Debe ser un número válido",accepted:"Debe ser aceptado",alpha:"Debe contener solo caracteres alfabéticos",alphanumeric:"Debe contener solo letras y números",alphaSpaces:"Debe contener solo letras y espacios",between:({min:e,max:t})=>`Debe estar entre ${e} y ${t}`,confirm:({fieldName:e})=>`Debe coincidir con ${e}`,containsAlpha:"Debe contener al menos una letra",containsAlphanumeric:"Debe contener al menos una letra o número",containsAlphaSpaces:"Debe contener al menos una letra o espacio",containsLowercase:"Debe contener al menos una letra minúscula",containsNumeric:"Debe contener al menos un número",containsSymbol:"Debe contener al menos un símbolo",containsUppercase:"Debe contener al menos una letra mayúscula",dateAfter:({date:e})=>e?`Debe ser posterior a ${e}`:"Debe ser posterior a hoy",dateAfterOrEqual:({date:e})=>e?`Debe ser posterior o igual a ${e}`:"Debe ser posterior o igual a hoy",dateBefore:({date:e})=>e?`Debe ser anterior a ${e}`:"Debe ser anterior a hoy",dateBeforeOrEqual:({date:e})=>e?`Debe ser anterior o igual a ${e}`:"Debe ser anterior o igual a hoy",dateBetween:({startDate:e,endDate:t})=>`Debe estar entre ${e} y ${t}`,dateFormat:({format:e})=>`Debe coincidir con el formato ${e}`,endsWith:({suffix:e})=>Array.isArray(e)?`Debe terminar con uno de: ${e.map(t=>`"${t}"`).join(", ")}`:`Debe terminar con "${e}"`,is:({allowedValues:e})=>`Debe ser uno de: ${Array.isArray(e)?e.join(", "):e}`,length:({value:e,min:t,max:n})=>t!==void 0&&n!==void 0?`Debe tener entre ${t} y ${n} caracteres`:e!==void 0?`Debe tener exactamente ${e} caracteres`:"Longitud inválida",lowercase:"Debe contener solo caracteres en minúscula",not:({disallowedValues:e})=>`No debe ser uno de: ${Array.isArray(e)?e.join(", "):e}`,startsWith:({prefix:e})=>Array.isArray(e)?`Debe comenzar con uno de: ${e.join(", ")}`:`Debe comenzar con "${e}"`,symbol:"Debe contener solo símbolos",uppercase:"Debe contener solo caracteres en mayúscula",url:"Debe ser una URL válida"};exports.Field=nn;exports.Form=Kt;exports.FormsPlugin=It;exports.en=E;exports.es=on;exports.useFieldContext=tn;exports.useFormContext=zt;exports.useInputContext=sn;exports.useLocale=rn;
|
package/dist/index.d.ts
CHANGED
|
@@ -4,5 +4,7 @@ export { default as Field } from './src/components/Field.vue';
|
|
|
4
4
|
export { useLocale } from './src/composables/useLocale';
|
|
5
5
|
export { useFormContext } from './src/context/useFormContext';
|
|
6
6
|
export { useFieldContext } from './src/context/useFieldContext';
|
|
7
|
+
export { useInputContext } from './src/context/useInputContext';
|
|
8
|
+
export type { FieldContext, FieldState, FormContext, InputProps, RuleFunction, FormsPluginOptions } from './src/types';
|
|
7
9
|
export { en } from './src/locales/en';
|
|
8
10
|
export { es } from './src/locales/es';
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { inject as
|
|
2
|
-
const
|
|
3
|
-
const t =
|
|
1
|
+
import { inject as N, shallowRef as R, isRef as ne, ref as h, readonly as A, provide as j, defineComponent as W, useModel as L, isReactive as re, reactive as se, computed as d, openBlock as I, createElementBlock as _, withModifiers as oe, renderSlot as z, normalizeProps as U, guardReactiveProps as K, mergeModels as Z, watch as k, toValue as $, useId as Y, onMounted as ae, onUnmounted as ue, unref as ie } from "vue";
|
|
2
|
+
const G = Symbol("locale-context"), H = (e = null) => {
|
|
3
|
+
const t = N(G, e);
|
|
4
4
|
if (!t && t !== null)
|
|
5
5
|
throw new Error("Context with localeContextKey not found");
|
|
6
6
|
return t;
|
|
@@ -39,13 +39,13 @@ const k = Symbol("locale-context"), Y = (e = null) => {
|
|
|
39
39
|
symbol: "Must contain only symbols",
|
|
40
40
|
uppercase: "Must contain only uppercase characters",
|
|
41
41
|
url: "Must be a valid URL"
|
|
42
|
-
},
|
|
43
|
-
|
|
44
|
-
},
|
|
42
|
+
}, J = R(/* @__PURE__ */ new Map()), le = (e, t) => {
|
|
43
|
+
J.value.set(e, t);
|
|
44
|
+
}, E = (e) => {
|
|
45
45
|
Object.entries(e).forEach(([t, n]) => {
|
|
46
46
|
le(t, n);
|
|
47
47
|
});
|
|
48
|
-
}, fe = (e) =>
|
|
48
|
+
}, fe = (e) => J.value.get(e);
|
|
49
49
|
function me(e) {
|
|
50
50
|
const t = e.accepted;
|
|
51
51
|
return typeof t == "function" ? t({}) : t ?? "Must be accepted";
|
|
@@ -117,38 +117,38 @@ function je(e, t = {}) {
|
|
|
117
117
|
const { args: n = [], messages: r = {}, fields: s = {} } = t, [o] = n;
|
|
118
118
|
return xe(e, o, s) ? !0 : Fe(r, o);
|
|
119
119
|
}
|
|
120
|
-
function
|
|
120
|
+
function Ve(e) {
|
|
121
121
|
const t = e.containsAlpha;
|
|
122
122
|
return typeof t == "function" ? t({}) : t ?? "Must contain at least one letter";
|
|
123
123
|
}
|
|
124
|
-
function
|
|
124
|
+
function Pe(e) {
|
|
125
125
|
return e ? /[a-zA-Z]/.test(String(e)) : !0;
|
|
126
126
|
}
|
|
127
|
-
function
|
|
127
|
+
function Te(e, t = {}) {
|
|
128
128
|
const { messages: n = {} } = t;
|
|
129
|
-
return
|
|
129
|
+
return Pe(e) ? !0 : Ve(n);
|
|
130
130
|
}
|
|
131
|
-
function
|
|
131
|
+
function qe(e) {
|
|
132
132
|
const t = e.containsAlphanumeric;
|
|
133
133
|
return typeof t == "function" ? t({}) : t ?? "Must contain at least one letter or number";
|
|
134
134
|
}
|
|
135
|
-
function
|
|
135
|
+
function Ce(e) {
|
|
136
136
|
return e ? /[a-zA-Z0-9]/.test(String(e)) : !0;
|
|
137
137
|
}
|
|
138
138
|
function Ee(e, t = {}) {
|
|
139
139
|
const { messages: n = {} } = t;
|
|
140
|
-
return
|
|
140
|
+
return Ce(e) ? !0 : qe(n);
|
|
141
141
|
}
|
|
142
|
-
function
|
|
142
|
+
function Be(e) {
|
|
143
143
|
const t = e.containsAlphaSpaces;
|
|
144
144
|
return typeof t == "function" ? t({}) : t ?? "Must contain at least one letter or space";
|
|
145
145
|
}
|
|
146
|
-
function
|
|
146
|
+
function Oe(e) {
|
|
147
147
|
return e ? /[a-zA-Z\s]/.test(String(e)) : !0;
|
|
148
148
|
}
|
|
149
149
|
function Re(e, t = {}) {
|
|
150
150
|
const { messages: n = {} } = t;
|
|
151
|
-
return
|
|
151
|
+
return Oe(e) ? !0 : Be(n);
|
|
152
152
|
}
|
|
153
153
|
function We(e) {
|
|
154
154
|
const t = e.containsLowercase;
|
|
@@ -157,22 +157,22 @@ function We(e) {
|
|
|
157
157
|
function Le(e) {
|
|
158
158
|
return e ? /[a-z]/.test(String(e)) : !0;
|
|
159
159
|
}
|
|
160
|
-
function
|
|
160
|
+
function Ie(e, t = {}) {
|
|
161
161
|
const { messages: n = {} } = t;
|
|
162
162
|
return Le(e) ? !0 : We(n);
|
|
163
163
|
}
|
|
164
|
-
function
|
|
164
|
+
function _e(e) {
|
|
165
165
|
const t = e.containsNumeric;
|
|
166
166
|
return typeof t == "function" ? t({}) : t ?? "Must contain at least one number";
|
|
167
167
|
}
|
|
168
|
-
function
|
|
168
|
+
function ze(e) {
|
|
169
169
|
return e ? /\d/.test(String(e)) : !0;
|
|
170
170
|
}
|
|
171
|
-
function
|
|
171
|
+
function Ue(e, t = {}) {
|
|
172
172
|
const { messages: n = {} } = t;
|
|
173
|
-
return
|
|
173
|
+
return ze(e) ? !0 : _e(n);
|
|
174
174
|
}
|
|
175
|
-
function
|
|
175
|
+
function Ke(e) {
|
|
176
176
|
const t = e.containsSymbol;
|
|
177
177
|
return typeof t == "function" ? t({}) : t ?? "Must contain at least one symbol";
|
|
178
178
|
}
|
|
@@ -181,7 +181,7 @@ function Ze(e) {
|
|
|
181
181
|
}
|
|
182
182
|
function ke(e, t = {}) {
|
|
183
183
|
const { messages: n = {} } = t;
|
|
184
|
-
return Ze(e) ? !0 :
|
|
184
|
+
return Ze(e) ? !0 : Ke(n);
|
|
185
185
|
}
|
|
186
186
|
function Ye(e) {
|
|
187
187
|
const t = e.containsUppercase;
|
|
@@ -352,15 +352,15 @@ function xt(e) {
|
|
|
352
352
|
function jt(e) {
|
|
353
353
|
return e ? /^[a-z]+$/.test(String(e)) : !0;
|
|
354
354
|
}
|
|
355
|
-
function
|
|
355
|
+
function Vt(e, t = {}) {
|
|
356
356
|
const { messages: n = {} } = t;
|
|
357
357
|
return jt(e) ? !0 : xt(n);
|
|
358
358
|
}
|
|
359
|
-
function
|
|
359
|
+
function Pt(e, t, n) {
|
|
360
360
|
const r = t.matches;
|
|
361
361
|
return typeof r == "function" ? r({ value: e, pattern: n }) : r ?? "Format is not valid";
|
|
362
362
|
}
|
|
363
|
-
function
|
|
363
|
+
function Tt(e, t) {
|
|
364
364
|
if (!e) return !0;
|
|
365
365
|
if (!t) return !1;
|
|
366
366
|
try {
|
|
@@ -373,11 +373,11 @@ function qt(e, t) {
|
|
|
373
373
|
return !1;
|
|
374
374
|
}
|
|
375
375
|
}
|
|
376
|
-
function
|
|
376
|
+
function qt(e, t = {}) {
|
|
377
377
|
const { args: n = [], messages: r = {} } = t, [s] = n;
|
|
378
|
-
return
|
|
378
|
+
return Tt(e, s) ? !0 : Pt(e, r, s);
|
|
379
379
|
}
|
|
380
|
-
function
|
|
380
|
+
function Ct(e, t) {
|
|
381
381
|
const n = e.max;
|
|
382
382
|
return typeof n == "function" ? n({ value: t }) : n ?? `Must be at most ${t}`;
|
|
383
383
|
}
|
|
@@ -392,11 +392,11 @@ function Et(e, t) {
|
|
|
392
392
|
}
|
|
393
393
|
return Array.isArray(e) ? e.length <= n : !1;
|
|
394
394
|
}
|
|
395
|
-
function
|
|
395
|
+
function Bt(e, t = {}) {
|
|
396
396
|
const { args: n = [], messages: r = {} } = t, [s] = n;
|
|
397
|
-
return Et(e, s) ? !0 :
|
|
397
|
+
return Et(e, s) ? !0 : Ct(r, s);
|
|
398
398
|
}
|
|
399
|
-
function
|
|
399
|
+
function Ot(e, t) {
|
|
400
400
|
const n = e.min;
|
|
401
401
|
return typeof n == "function" ? n({ value: t }) : n ?? `Must be at least ${t}`;
|
|
402
402
|
}
|
|
@@ -413,32 +413,32 @@ function Rt(e, t) {
|
|
|
413
413
|
}
|
|
414
414
|
function Wt(e, t = {}) {
|
|
415
415
|
const { args: n = [], messages: r = {} } = t, [s] = n;
|
|
416
|
-
return Rt(e, s) ? !0 :
|
|
416
|
+
return Rt(e, s) ? !0 : Ot(r, s);
|
|
417
417
|
}
|
|
418
418
|
function Lt(e, t) {
|
|
419
419
|
const n = e.not;
|
|
420
420
|
return typeof n == "function" ? n({ disallowedValues: t }) : n ?? `Must not be one of: ${t.join(", ")}`;
|
|
421
421
|
}
|
|
422
|
-
function
|
|
422
|
+
function It(e, ...t) {
|
|
423
423
|
return !e && e !== 0 && e !== !1 ? !0 : !t.includes(String(e));
|
|
424
424
|
}
|
|
425
|
-
function
|
|
425
|
+
function _t(e, t = {}) {
|
|
426
426
|
const { args: n = [], messages: r = {} } = t;
|
|
427
|
-
return
|
|
427
|
+
return It(e, ...n) ? !0 : Lt(r, n);
|
|
428
428
|
}
|
|
429
|
-
function
|
|
429
|
+
function zt(e) {
|
|
430
430
|
const t = e.number;
|
|
431
431
|
return typeof t == "function" ? t({}) : t ?? "Must be a valid number";
|
|
432
432
|
}
|
|
433
|
-
function
|
|
433
|
+
function Ut(e) {
|
|
434
434
|
if (e == null || e === "") return !0;
|
|
435
435
|
if (Number.isNaN(e)) return !1;
|
|
436
436
|
const t = Number(e);
|
|
437
437
|
return !isNaN(t) && isFinite(t);
|
|
438
438
|
}
|
|
439
|
-
function
|
|
439
|
+
function Kt(e, t = {}) {
|
|
440
440
|
const { messages: n = {} } = t;
|
|
441
|
-
return
|
|
441
|
+
return Ut(e) ? !0 : zt(n);
|
|
442
442
|
}
|
|
443
443
|
function Zt(e) {
|
|
444
444
|
const t = e.required;
|
|
@@ -511,11 +511,11 @@ const un = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
511
511
|
alphanumeric: ve,
|
|
512
512
|
between: Se,
|
|
513
513
|
confirm: je,
|
|
514
|
-
containsAlpha:
|
|
514
|
+
containsAlpha: Te,
|
|
515
515
|
containsAlphaSpaces: Re,
|
|
516
516
|
containsAlphanumeric: Ee,
|
|
517
|
-
containsLowercase:
|
|
518
|
-
containsNumeric:
|
|
517
|
+
containsLowercase: Ie,
|
|
518
|
+
containsNumeric: Ue,
|
|
519
519
|
containsSymbol: ke,
|
|
520
520
|
containsUppercase: He,
|
|
521
521
|
dateAfter: Xe,
|
|
@@ -528,12 +528,12 @@ const un = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
528
528
|
endsWith: Mt,
|
|
529
529
|
is: At,
|
|
530
530
|
length: Ft,
|
|
531
|
-
lowercase:
|
|
532
|
-
matches:
|
|
533
|
-
max:
|
|
531
|
+
lowercase: Vt,
|
|
532
|
+
matches: qt,
|
|
533
|
+
max: Bt,
|
|
534
534
|
min: Wt,
|
|
535
|
-
not:
|
|
536
|
-
number:
|
|
535
|
+
not: _t,
|
|
536
|
+
number: Kt,
|
|
537
537
|
required: Yt,
|
|
538
538
|
startsWith: Jt,
|
|
539
539
|
symbol: en,
|
|
@@ -541,31 +541,31 @@ const un = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
541
541
|
url: an
|
|
542
542
|
}, Symbol.toStringTag, { value: "Module" })), An = {
|
|
543
543
|
install(e, t = {}) {
|
|
544
|
-
|
|
545
|
-
const n =
|
|
544
|
+
E(un), t.rules && E(t.rules);
|
|
545
|
+
const n = ne(t.locale) ? t.locale : h(t.locale ?? "en"), r = { en: ce };
|
|
546
546
|
t.locales && Object.keys(t.locales).forEach((o) => {
|
|
547
547
|
r[o] = { ...r[o] ?? {}, ...t.locales[o] };
|
|
548
548
|
});
|
|
549
|
-
const s =
|
|
550
|
-
e.provide(
|
|
551
|
-
locale:
|
|
552
|
-
locales:
|
|
549
|
+
const s = R(r);
|
|
550
|
+
e.provide(G, {
|
|
551
|
+
locale: A(n),
|
|
552
|
+
locales: A(s),
|
|
553
553
|
setLocale: (o) => {
|
|
554
554
|
s.value[o] ? n.value = o : console.warn(`Locale "${o}" not available.`);
|
|
555
555
|
}
|
|
556
556
|
});
|
|
557
557
|
}
|
|
558
|
-
},
|
|
559
|
-
|
|
558
|
+
}, Q = Symbol("form-state-context"), cn = (e) => {
|
|
559
|
+
j(Q, e);
|
|
560
560
|
}, ln = (e = null) => {
|
|
561
|
-
const t =
|
|
561
|
+
const t = N(Q, e);
|
|
562
562
|
if (!t && t !== null)
|
|
563
563
|
throw new Error("Context with formStateContextKey not found");
|
|
564
564
|
return t;
|
|
565
|
-
},
|
|
566
|
-
|
|
565
|
+
}, X = Symbol("form-context"), fn = (e) => {
|
|
566
|
+
j(X, e);
|
|
567
567
|
}, Dn = (e = null) => {
|
|
568
|
-
const t =
|
|
568
|
+
const t = N(X, e);
|
|
569
569
|
if (!t && t !== null)
|
|
570
570
|
throw new Error("Context with formContextKey not found");
|
|
571
571
|
return t;
|
|
@@ -576,16 +576,16 @@ function mn(e, t) {
|
|
|
576
576
|
}
|
|
577
577
|
function dn(e, t, n) {
|
|
578
578
|
if (!e || !t) return e;
|
|
579
|
-
const r = t.split("."), s = r.pop(), o = r.reduce((a,
|
|
580
|
-
if (a[
|
|
581
|
-
const
|
|
582
|
-
a[
|
|
579
|
+
const r = t.split("."), s = r.pop(), o = r.reduce((a, c, i) => {
|
|
580
|
+
if (a[c] === null || a[c] === void 0) {
|
|
581
|
+
const g = r[i + 1] || s;
|
|
582
|
+
a[c] = /^\d+$/.test(g) ? [] : {};
|
|
583
583
|
}
|
|
584
|
-
return a[
|
|
584
|
+
return a[c];
|
|
585
585
|
}, e);
|
|
586
586
|
return o[s] = n, e;
|
|
587
587
|
}
|
|
588
|
-
const Sn = /* @__PURE__ */
|
|
588
|
+
const Sn = /* @__PURE__ */ W({
|
|
589
589
|
__name: "Form",
|
|
590
590
|
props: {
|
|
591
591
|
modelValue: {
|
|
@@ -593,35 +593,35 @@ const Sn = /* @__PURE__ */ R({
|
|
|
593
593
|
},
|
|
594
594
|
modelModifiers: {}
|
|
595
595
|
},
|
|
596
|
-
emits: /* @__PURE__ */
|
|
596
|
+
emits: /* @__PURE__ */ Z(["submit"], ["update:modelValue"]),
|
|
597
597
|
setup(e, { emit: t }) {
|
|
598
|
-
const n = t, r =
|
|
599
|
-
|
|
600
|
-
const s = h({}), o = h([]), a =
|
|
598
|
+
const n = t, r = L(e, "modelValue");
|
|
599
|
+
re(r.value) || (r.value = se(r.value ?? {}));
|
|
600
|
+
const s = h({}), o = h([]), a = d(() => r.value), c = d(() => o.value[0] ?? null), i = d(
|
|
601
601
|
() => Object.keys(s.value).every((u) => s.value[u].isValid)
|
|
602
|
-
),
|
|
602
|
+
), g = () => {
|
|
603
603
|
Object.keys(s.value).forEach((u) => {
|
|
604
|
-
var
|
|
605
|
-
(
|
|
604
|
+
var b, p;
|
|
605
|
+
(p = (b = s.value[u]).validate) == null || p.call(b);
|
|
606
606
|
});
|
|
607
|
-
},
|
|
608
|
-
|
|
609
|
-
},
|
|
610
|
-
var
|
|
607
|
+
}, l = () => {
|
|
608
|
+
g(), i.value && (o.value = [], n("submit", r.value, { setErrors: f, reset: m }));
|
|
609
|
+
}, f = (...u) => {
|
|
610
|
+
var b;
|
|
611
611
|
if (u.length === 1) {
|
|
612
|
-
const
|
|
613
|
-
if (typeof
|
|
614
|
-
Object.keys(
|
|
615
|
-
|
|
612
|
+
const p = u[0];
|
|
613
|
+
if (typeof p == "object" && !Array.isArray(p) && p !== null) {
|
|
614
|
+
Object.keys(p).forEach((v) => {
|
|
615
|
+
f(v, p[v]);
|
|
616
616
|
});
|
|
617
617
|
return;
|
|
618
618
|
}
|
|
619
|
-
o.value = Array.isArray(
|
|
619
|
+
o.value = Array.isArray(p) ? p : [p];
|
|
620
620
|
} else if (u.length === 2) {
|
|
621
|
-
const [
|
|
622
|
-
(
|
|
621
|
+
const [p, v] = u;
|
|
622
|
+
(b = s.value[p]) == null || b.setErrors(v);
|
|
623
623
|
}
|
|
624
|
-
},
|
|
624
|
+
}, m = () => {
|
|
625
625
|
o.value = [], Object.keys(s.value).forEach((u) => {
|
|
626
626
|
s.value[u].reset();
|
|
627
627
|
});
|
|
@@ -633,14 +633,14 @@ const Sn = /* @__PURE__ */ R({
|
|
|
633
633
|
getField(u) {
|
|
634
634
|
return s.value[u];
|
|
635
635
|
},
|
|
636
|
-
addField(u,
|
|
637
|
-
s.value[u] =
|
|
636
|
+
addField(u, b) {
|
|
637
|
+
s.value[u] = b;
|
|
638
638
|
},
|
|
639
639
|
removeField(u) {
|
|
640
640
|
delete s.value[u];
|
|
641
641
|
},
|
|
642
|
-
setFieldValue(u,
|
|
643
|
-
dn(r.value, u,
|
|
642
|
+
setFieldValue(u, b) {
|
|
643
|
+
dn(r.value, u, b);
|
|
644
644
|
},
|
|
645
645
|
getFieldValue(u) {
|
|
646
646
|
return mn(r.value, u);
|
|
@@ -648,29 +648,29 @@ const Sn = /* @__PURE__ */ R({
|
|
|
648
648
|
}), fn({
|
|
649
649
|
values: a,
|
|
650
650
|
isValid: i,
|
|
651
|
-
error:
|
|
651
|
+
error: c,
|
|
652
652
|
errors: o,
|
|
653
653
|
fields: s,
|
|
654
|
-
reset:
|
|
655
|
-
setErrors:
|
|
656
|
-
validate:
|
|
657
|
-
}), (u,
|
|
658
|
-
onSubmit:
|
|
654
|
+
reset: m,
|
|
655
|
+
setErrors: f,
|
|
656
|
+
validate: g
|
|
657
|
+
}), (u, b) => (I(), _("form", {
|
|
658
|
+
onSubmit: oe(l, ["prevent"])
|
|
659
659
|
}, [
|
|
660
|
-
z(u.$slots, "default",
|
|
660
|
+
z(u.$slots, "default", U(K({
|
|
661
661
|
isValid: i.value,
|
|
662
|
-
error:
|
|
662
|
+
error: c.value,
|
|
663
663
|
errors: o.value,
|
|
664
664
|
values: a.value,
|
|
665
665
|
fields: s.value,
|
|
666
|
-
reset:
|
|
667
|
-
setErrors:
|
|
668
|
-
validate:
|
|
666
|
+
reset: m,
|
|
667
|
+
setErrors: f,
|
|
668
|
+
validate: g
|
|
669
669
|
})))
|
|
670
670
|
], 32));
|
|
671
671
|
}
|
|
672
672
|
});
|
|
673
|
-
function
|
|
673
|
+
function ee(e) {
|
|
674
674
|
if (!e || typeof e != "string")
|
|
675
675
|
return {};
|
|
676
676
|
const t = e.split("|").filter(Boolean), n = {};
|
|
@@ -679,7 +679,7 @@ function Q(e) {
|
|
|
679
679
|
if (o.length === 0)
|
|
680
680
|
n[a] = !0;
|
|
681
681
|
else {
|
|
682
|
-
const i = o.join(":").split(",").map((
|
|
682
|
+
const i = o.join(":").split(",").map((g) => g.trim());
|
|
683
683
|
n[a] = i.length === 1 ? i[0] : i;
|
|
684
684
|
}
|
|
685
685
|
}
|
|
@@ -687,12 +687,12 @@ function Q(e) {
|
|
|
687
687
|
}
|
|
688
688
|
const gn = (e, t, n = {}, r = {}) => {
|
|
689
689
|
if (!t) return !0;
|
|
690
|
-
const s =
|
|
691
|
-
for (const [a,
|
|
690
|
+
const s = ee(t), o = [];
|
|
691
|
+
for (const [a, c] of Object.entries(s)) {
|
|
692
692
|
const i = fe(a);
|
|
693
693
|
if (i) {
|
|
694
|
-
const
|
|
695
|
-
|
|
694
|
+
const l = { args: c === !0 ? [] : Array.isArray(c) ? c : [c], messages: n, fields: r }, f = i(e, l);
|
|
695
|
+
f !== !0 && o.push(f ?? "Invalid value");
|
|
696
696
|
} else
|
|
697
697
|
console.warn(`[Forms] Validation rule "${a}" not found.`);
|
|
698
698
|
}
|
|
@@ -702,7 +702,7 @@ const gn = (e, t, n = {}, r = {}) => {
|
|
|
702
702
|
return n === !0 ? !0 : typeof n == "string" ? [n] : Array.isArray(n) ? n : !!n ? !0 : ["Invalid value"];
|
|
703
703
|
};
|
|
704
704
|
typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
|
|
705
|
-
const
|
|
705
|
+
const B = () => {
|
|
706
706
|
};
|
|
707
707
|
function bn(e, t) {
|
|
708
708
|
function n(...r) {
|
|
@@ -718,25 +718,25 @@ function bn(e, t) {
|
|
|
718
718
|
}
|
|
719
719
|
const yn = (e) => e();
|
|
720
720
|
function $n(e, t = {}) {
|
|
721
|
-
let n, r, s =
|
|
721
|
+
let n, r, s = B;
|
|
722
722
|
const o = (i) => {
|
|
723
|
-
clearTimeout(i), s(), s =
|
|
723
|
+
clearTimeout(i), s(), s = B;
|
|
724
724
|
};
|
|
725
725
|
let a;
|
|
726
726
|
return (i) => {
|
|
727
|
-
const
|
|
728
|
-
return n && o(n),
|
|
729
|
-
s = t.rejectOnCancel ?
|
|
730
|
-
n && o(n), r = void 0,
|
|
731
|
-
},
|
|
732
|
-
r && o(r), r = void 0,
|
|
733
|
-
},
|
|
727
|
+
const g = $(e), l = $(t.maxWait);
|
|
728
|
+
return n && o(n), g <= 0 || l !== void 0 && l <= 0 ? (r && (o(r), r = void 0), Promise.resolve(i())) : new Promise((f, m) => {
|
|
729
|
+
s = t.rejectOnCancel ? m : f, a = i, l && !r && (r = setTimeout(() => {
|
|
730
|
+
n && o(n), r = void 0, f(a());
|
|
731
|
+
}, l)), n = setTimeout(() => {
|
|
732
|
+
r && o(r), r = void 0, f(i());
|
|
733
|
+
}, g);
|
|
734
734
|
});
|
|
735
735
|
};
|
|
736
736
|
}
|
|
737
737
|
function hn(e, t, n = {}) {
|
|
738
738
|
const { eventFilter: r = yn, ...s } = n;
|
|
739
|
-
return
|
|
739
|
+
return k(e, bn(r, t), s);
|
|
740
740
|
}
|
|
741
741
|
function O(e, t, n = {}) {
|
|
742
742
|
const { debounce: r = 0, maxWait: s = void 0, ...o } = n;
|
|
@@ -746,21 +746,21 @@ function O(e, t, n = {}) {
|
|
|
746
746
|
});
|
|
747
747
|
}
|
|
748
748
|
function vn(e, t = {}) {
|
|
749
|
-
const n = h(!0), r = h(!1), s = h([]), o = h(null), a =
|
|
749
|
+
const n = h(!0), r = h(!1), s = h([]), o = h(null), a = d(() => $(t.rules) ?? null), c = d(() => $(t.messages) ?? {}), i = d(() => $(t.fields) ?? {}), g = d(() => {
|
|
750
750
|
if (!a.value || typeof a.value != "string") return null;
|
|
751
|
-
const u =
|
|
751
|
+
const u = ee(a.value).confirm;
|
|
752
752
|
if (!u || u === !0) return null;
|
|
753
|
-
const
|
|
754
|
-
return (
|
|
755
|
-
}),
|
|
756
|
-
let
|
|
757
|
-
return typeof a.value == "function" ?
|
|
753
|
+
const b = i.value[u];
|
|
754
|
+
return (b == null ? void 0 : b.value) ?? null;
|
|
755
|
+
}), l = () => {
|
|
756
|
+
let m;
|
|
757
|
+
return typeof a.value == "function" ? m = pn($(e), a.value) : m = gn(
|
|
758
758
|
$(e),
|
|
759
759
|
a.value,
|
|
760
|
-
|
|
760
|
+
c.value,
|
|
761
761
|
i.value
|
|
762
|
-
),
|
|
763
|
-
},
|
|
762
|
+
), m === !0 ? (n.value = !0, s.value = [], !0) : Array.isArray(m) ? (n.value = !1, s.value = m, !1) : m;
|
|
763
|
+
}, f = () => {
|
|
764
764
|
o.value && clearTimeout(o.value), r.value = !0, n.value = !0, s.value = [], o.value = setTimeout(() => {
|
|
765
765
|
r.value = !1, o.value = null;
|
|
766
766
|
}, 1e3);
|
|
@@ -768,32 +768,36 @@ function vn(e, t = {}) {
|
|
|
768
768
|
return O(
|
|
769
769
|
() => $(e),
|
|
770
770
|
() => {
|
|
771
|
-
r.value ||
|
|
771
|
+
r.value || l();
|
|
772
772
|
},
|
|
773
773
|
{ debounce: 300 }
|
|
774
774
|
), O(
|
|
775
|
-
() => $(
|
|
775
|
+
() => $(g),
|
|
776
776
|
() => {
|
|
777
|
-
r.value || $(e) &&
|
|
777
|
+
r.value || $(e) && l();
|
|
778
778
|
},
|
|
779
779
|
{ debounce: 300 }
|
|
780
780
|
), {
|
|
781
|
-
validate:
|
|
782
|
-
reset:
|
|
783
|
-
isValid:
|
|
784
|
-
errors:
|
|
781
|
+
validate: l,
|
|
782
|
+
reset: f,
|
|
783
|
+
isValid: A(n),
|
|
784
|
+
errors: A(s)
|
|
785
785
|
};
|
|
786
786
|
}
|
|
787
|
-
const
|
|
788
|
-
|
|
789
|
-
}
|
|
790
|
-
|
|
791
|
-
if (
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
787
|
+
const D = Symbol("field-context"), Mn = (e) => {
|
|
788
|
+
j(D, e);
|
|
789
|
+
};
|
|
790
|
+
function Fn(e) {
|
|
791
|
+
if (e === void 0) {
|
|
792
|
+
const t = N(D);
|
|
793
|
+
if (!t) throw new Error("useFieldContext() must be called inside a Field component");
|
|
794
|
+
return t;
|
|
795
|
+
}
|
|
796
|
+
return N(D, e);
|
|
797
|
+
}
|
|
798
|
+
const xn = /* @__PURE__ */ W({
|
|
795
799
|
__name: "Field",
|
|
796
|
-
props: /* @__PURE__ */
|
|
800
|
+
props: /* @__PURE__ */ Z({
|
|
797
801
|
id: {},
|
|
798
802
|
name: {},
|
|
799
803
|
validation: { type: [String, Function, null] },
|
|
@@ -805,91 +809,91 @@ const X = Symbol("field-context"), Mn = (e) => {
|
|
|
805
809
|
}),
|
|
806
810
|
emits: ["update:modelValue"],
|
|
807
811
|
setup(e) {
|
|
808
|
-
const t = e, n =
|
|
812
|
+
const t = e, n = L(e, "modelValue"), r = Y(), s = ln(), o = H(), a = d({
|
|
809
813
|
get: () => s ? s.getFieldValue(t.name) : n.value,
|
|
810
|
-
set: (
|
|
811
|
-
s ? s.setFieldValue(t.name,
|
|
814
|
+
set: (y) => {
|
|
815
|
+
s ? s.setFieldValue(t.name, y) : n.value = y;
|
|
812
816
|
}
|
|
813
|
-
}),
|
|
817
|
+
}), c = d(() => t.validation ?? null), i = d(() => ({
|
|
814
818
|
...o ? o.locales.value[o.locale.value] : {},
|
|
815
819
|
...t.validationMessages ?? {}
|
|
816
|
-
})),
|
|
820
|
+
})), g = d({
|
|
817
821
|
get: () => s ? s.getFields() : {},
|
|
818
822
|
set: () => {
|
|
819
823
|
}
|
|
820
|
-
}),
|
|
821
|
-
u.value = Array.isArray(
|
|
822
|
-
},
|
|
823
|
-
a.value =
|
|
824
|
+
}), l = vn(a, { rules: c, messages: i, fields: g }), f = h(!1), m = h(!1), u = h([]), b = d(() => a.value ?? null), p = d(() => l.isValid.value && u.value.length === 0), v = d(() => [...l.errors.value, ...u.value]), M = d(() => v.value[0] ?? null), V = $(a), w = t.id ?? r, S = `${w}-error`, F = `${w}-help`, te = (y) => {
|
|
825
|
+
u.value = Array.isArray(y) ? y : [y];
|
|
826
|
+
}, x = () => {
|
|
827
|
+
a.value = V, f.value = !1, m.value = !1, u.value = [], l.reset();
|
|
824
828
|
};
|
|
825
|
-
|
|
829
|
+
k(
|
|
826
830
|
() => t.error,
|
|
827
|
-
(
|
|
828
|
-
|
|
831
|
+
(y) => {
|
|
832
|
+
y ? u.value = Array.isArray(y) ? y : [y] : u.value = [];
|
|
829
833
|
},
|
|
830
834
|
{ immediate: !0 }
|
|
831
835
|
);
|
|
832
|
-
const
|
|
833
|
-
id:
|
|
836
|
+
const P = d(() => ({
|
|
837
|
+
id: w,
|
|
834
838
|
name: t.name,
|
|
835
839
|
modelValue: a.value,
|
|
836
840
|
"aria-invalid": !!M.value,
|
|
837
|
-
"aria-describedby": M.value ? `${
|
|
838
|
-
"aria-errormessage": M.value ?
|
|
839
|
-
"onUpdate:modelValue": (
|
|
840
|
-
a.value =
|
|
841
|
+
"aria-describedby": M.value ? `${S} ${F}` : F,
|
|
842
|
+
"aria-errormessage": M.value ? S : void 0,
|
|
843
|
+
"onUpdate:modelValue": (y) => {
|
|
844
|
+
a.value = y, !m.value && y !== V && (m.value = !0);
|
|
841
845
|
},
|
|
842
846
|
onBlur: () => {
|
|
843
|
-
|
|
847
|
+
f.value || (f.value = !0, l.validate());
|
|
844
848
|
}
|
|
845
|
-
})),
|
|
849
|
+
})), T = { for: w }, q = { id: S, role: "alert", "aria-live": "polite" }, C = { id: F };
|
|
846
850
|
return ae(() => {
|
|
847
851
|
s && s.addField(t.name, {
|
|
848
|
-
value:
|
|
849
|
-
isValid:
|
|
850
|
-
isTouched:
|
|
851
|
-
isDirty:
|
|
852
|
+
value: b,
|
|
853
|
+
isValid: p,
|
|
854
|
+
isTouched: f,
|
|
855
|
+
isDirty: m,
|
|
852
856
|
error: M,
|
|
853
857
|
errors: v,
|
|
854
|
-
setErrors:
|
|
855
|
-
reset:
|
|
856
|
-
validate:
|
|
858
|
+
setErrors: te,
|
|
859
|
+
reset: x,
|
|
860
|
+
validate: l.validate
|
|
857
861
|
});
|
|
858
862
|
}), ue(() => {
|
|
859
863
|
s && s.removeField(t.name);
|
|
860
864
|
}), Mn({
|
|
861
865
|
inputValue: a,
|
|
862
|
-
inputProps:
|
|
863
|
-
labelProps:
|
|
866
|
+
inputProps: P,
|
|
867
|
+
labelProps: T,
|
|
864
868
|
helpProps: C,
|
|
865
869
|
errorProps: q,
|
|
866
|
-
isValid:
|
|
867
|
-
isTouched:
|
|
868
|
-
isDirty:
|
|
870
|
+
isValid: p,
|
|
871
|
+
isTouched: f,
|
|
872
|
+
isDirty: m,
|
|
869
873
|
error: M,
|
|
870
874
|
errors: v,
|
|
871
|
-
validate:
|
|
872
|
-
reset:
|
|
873
|
-
}), (
|
|
874
|
-
z(
|
|
875
|
+
validate: l.validate,
|
|
876
|
+
reset: x
|
|
877
|
+
}), (y, Nn) => (I(), _("div", null, [
|
|
878
|
+
z(y.$slots, "default", U(K({
|
|
875
879
|
inputValue: a.value,
|
|
876
|
-
inputProps:
|
|
877
|
-
labelProps:
|
|
880
|
+
inputProps: P.value,
|
|
881
|
+
labelProps: T,
|
|
878
882
|
helpProps: C,
|
|
879
883
|
errorProps: q,
|
|
880
|
-
isValid:
|
|
881
|
-
isTouched:
|
|
882
|
-
isDirty:
|
|
884
|
+
isValid: p.value,
|
|
885
|
+
isTouched: f.value,
|
|
886
|
+
isDirty: m.value,
|
|
883
887
|
error: M.value,
|
|
884
888
|
errors: v.value,
|
|
885
|
-
validate: ie(
|
|
886
|
-
reset:
|
|
889
|
+
validate: ie(l).validate,
|
|
890
|
+
reset: x
|
|
887
891
|
})))
|
|
888
892
|
]));
|
|
889
893
|
}
|
|
890
894
|
});
|
|
891
895
|
function jn() {
|
|
892
|
-
const e =
|
|
896
|
+
const e = H();
|
|
893
897
|
if (!e)
|
|
894
898
|
throw new Error(
|
|
895
899
|
"[Valiform] useLocale() must be used inside a component with FormsPlugin installed."
|
|
@@ -900,7 +904,42 @@ function jn() {
|
|
|
900
904
|
setLocale: e.setLocale
|
|
901
905
|
};
|
|
902
906
|
}
|
|
903
|
-
|
|
907
|
+
function Vn(e) {
|
|
908
|
+
const t = N(D, null);
|
|
909
|
+
if (t)
|
|
910
|
+
return t;
|
|
911
|
+
const n = $(e), r = Y(), s = `${r}-error`, o = `${r}-help`, a = h(!1), c = h(!1), i = d(() => ({
|
|
912
|
+
id: r,
|
|
913
|
+
name: r,
|
|
914
|
+
modelValue: e.value,
|
|
915
|
+
"aria-invalid": !1,
|
|
916
|
+
"aria-describedby": o,
|
|
917
|
+
"aria-errormessage": void 0,
|
|
918
|
+
"onUpdate:modelValue": (g) => {
|
|
919
|
+
e.value = g, !c.value && g !== n && (c.value = !0);
|
|
920
|
+
},
|
|
921
|
+
onBlur: () => {
|
|
922
|
+
a.value || (a.value = !0);
|
|
923
|
+
}
|
|
924
|
+
}));
|
|
925
|
+
return {
|
|
926
|
+
inputValue: e,
|
|
927
|
+
inputProps: i,
|
|
928
|
+
labelProps: { for: r },
|
|
929
|
+
helpProps: { id: o },
|
|
930
|
+
errorProps: { id: s, role: "alert", "aria-live": "polite" },
|
|
931
|
+
isValid: d(() => !0),
|
|
932
|
+
isTouched: a,
|
|
933
|
+
isDirty: c,
|
|
934
|
+
error: d(() => null),
|
|
935
|
+
errors: d(() => []),
|
|
936
|
+
validate: () => !0,
|
|
937
|
+
reset: () => {
|
|
938
|
+
e.value = n, a.value = !1, c.value = !1;
|
|
939
|
+
}
|
|
940
|
+
};
|
|
941
|
+
}
|
|
942
|
+
const Pn = {
|
|
904
943
|
required: "Este campo es obligatorio",
|
|
905
944
|
email: "Por favor ingresa un email válido",
|
|
906
945
|
min: ({ value: e }) => `Debe ser al menos ${e}`,
|
|
@@ -941,8 +980,9 @@ export {
|
|
|
941
980
|
Sn as Form,
|
|
942
981
|
An as FormsPlugin,
|
|
943
982
|
ce as en,
|
|
944
|
-
|
|
983
|
+
Pn as es,
|
|
945
984
|
Fn as useFieldContext,
|
|
946
985
|
Dn as useFormContext,
|
|
986
|
+
Vn as useInputContext,
|
|
947
987
|
jn as useLocale
|
|
948
988
|
};
|
package/dist/nuxt.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const e=require("@nuxt/kit"),
|
|
2
|
-
`)}),e.addComponent({name:"Form",export:"Form",filePath:"@overgaming/valiform"}),e.addComponent({name:"Field",export:"Field",filePath:"@overgaming/valiform"}),e.addImports([{name:"useLocale",from:"@overgaming/valiform"},{name:"useFormContext",from:"@overgaming/valiform"},{name:"useFieldContext",from:"@overgaming/valiform"}])}});module.exports=
|
|
1
|
+
"use strict";const e=require("@nuxt/kit"),m=e.defineNuxtModule({meta:{name:"@overgaming/valiform",configKey:"valiform",compatibility:{nuxt:">=3.0.0"}},defaults:{},setup(o){e.addPluginTemplate({filename:"valiform.plugin.mjs",getContents:()=>["import { defineNuxtPlugin } from '#app'","import { FormsPlugin } from '@overgaming/valiform'","export default defineNuxtPlugin((nuxtApp) => {",` nuxtApp.vueApp.use(FormsPlugin, ${JSON.stringify(o)})`,"})"].join(`
|
|
2
|
+
`)}),e.addComponent({name:"Form",export:"Form",filePath:"@overgaming/valiform"}),e.addComponent({name:"Field",export:"Field",filePath:"@overgaming/valiform"}),e.addImports([{name:"useLocale",from:"@overgaming/valiform"},{name:"useFormContext",from:"@overgaming/valiform"},{name:"useFieldContext",from:"@overgaming/valiform"},{name:"useInputContext",from:"@overgaming/valiform"}])}});module.exports=m;
|
package/dist/nuxt.js
CHANGED
|
@@ -20,7 +20,8 @@ const r = m({
|
|
|
20
20
|
}), e({ name: "Form", export: "Form", filePath: "@overgaming/valiform" }), e({ name: "Field", export: "Field", filePath: "@overgaming/valiform" }), n([
|
|
21
21
|
{ name: "useLocale", from: "@overgaming/valiform" },
|
|
22
22
|
{ name: "useFormContext", from: "@overgaming/valiform" },
|
|
23
|
-
{ name: "useFieldContext", from: "@overgaming/valiform" }
|
|
23
|
+
{ name: "useFieldContext", from: "@overgaming/valiform" },
|
|
24
|
+
{ name: "useInputContext", from: "@overgaming/valiform" }
|
|
24
25
|
]);
|
|
25
26
|
}
|
|
26
27
|
});
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
type __VLS_PublicProps = {
|
|
2
|
+
modelValue?: unknown;
|
|
3
|
+
};
|
|
4
|
+
declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
5
|
+
"update:modelValue": (value: unknown) => any;
|
|
6
|
+
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
7
|
+
"onUpdate:modelValue"?: (value: unknown) => any;
|
|
8
|
+
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
export default _default;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
validation?: string | null;
|
|
3
|
+
validationMessages?: Record<string, unknown> | null;
|
|
4
|
+
};
|
|
5
|
+
declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
6
|
+
validation: string | null;
|
|
7
|
+
validationMessages: Record<string, unknown> | null;
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
export default _default;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
};
|
|
4
|
+
type __VLS_PublicProps = __VLS_Props & {
|
|
5
|
+
modelValue?: boolean;
|
|
6
|
+
};
|
|
7
|
+
declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
8
|
+
"update:modelValue": (value: boolean) => any;
|
|
9
|
+
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
10
|
+
"onUpdate:modelValue"?: (value: boolean) => any;
|
|
11
|
+
}>, {
|
|
12
|
+
label: string;
|
|
13
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
14
|
+
export default _default;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
helpText?: string;
|
|
4
|
+
};
|
|
5
|
+
type __VLS_PublicProps = __VLS_Props & {
|
|
6
|
+
modelValue?: string;
|
|
7
|
+
};
|
|
8
|
+
declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
9
|
+
"update:modelValue": (value: string) => any;
|
|
10
|
+
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
11
|
+
"onUpdate:modelValue"?: (value: string) => any;
|
|
12
|
+
}>, {
|
|
13
|
+
label: string;
|
|
14
|
+
helpText: string;
|
|
15
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
16
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
export default _default;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -2,4 +2,40 @@ import type { InjectionKey } from 'vue';
|
|
|
2
2
|
import type { FieldContext } from '../types';
|
|
3
3
|
export declare const fieldContextKey: InjectionKey<FieldContext>;
|
|
4
4
|
export declare const useFieldContextProvider: (data: FieldContext) => void;
|
|
5
|
-
|
|
5
|
+
/**
|
|
6
|
+
* Retrieves the `FieldContext` provided by the nearest `Field` component ancestor.
|
|
7
|
+
*
|
|
8
|
+
* **Three call signatures:**
|
|
9
|
+
*
|
|
10
|
+
* - `useFieldContext()` — no args. Returns `FieldContext` directly (no `!` needed).
|
|
11
|
+
* Throws at runtime if called outside a `Field`. Use this for components that
|
|
12
|
+
* must always be nested inside a `Field` (e.g. `FieldLabel`, `FieldError`).
|
|
13
|
+
*
|
|
14
|
+
* - `useFieldContext(fallback: FieldContext)` — with a fallback object. Returns
|
|
15
|
+
* `FieldContext` directly (no `!` needed). Use this for components that can work
|
|
16
|
+
* both inside and outside a `Field` (e.g. standalone inputs with `v-model`).
|
|
17
|
+
*
|
|
18
|
+
* - `useFieldContext(null)` — explicit null. Returns `FieldContext | null`.
|
|
19
|
+
* Use when you want to handle the absence of context manually.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* // Always inside a Field — throws at runtime if misused:
|
|
23
|
+
* const { labelProps } = useFieldContext();
|
|
24
|
+
*
|
|
25
|
+
* @example
|
|
26
|
+
* // Standalone-capable input — works inside or outside a Field:
|
|
27
|
+
* const model = defineModel<string>({ default: '' });
|
|
28
|
+
* const { inputValue, inputProps } = useFieldContext({ inputValue: model });
|
|
29
|
+
*
|
|
30
|
+
* @example
|
|
31
|
+
* // Manual null-handling:
|
|
32
|
+
* const ctx = useFieldContext(null);
|
|
33
|
+
* if (ctx) { ... }
|
|
34
|
+
*
|
|
35
|
+
* @example
|
|
36
|
+
* // ❌ Wrong — `{}` does not satisfy FieldContext and will cause a type error:
|
|
37
|
+
* const { labelProps } = useFieldContext({});
|
|
38
|
+
*/
|
|
39
|
+
export declare function useFieldContext(): FieldContext;
|
|
40
|
+
export declare function useFieldContext(defaultData: null): FieldContext | null;
|
|
41
|
+
export declare function useFieldContext(defaultData: FieldContext): FieldContext;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import type { Ref } from 'vue';
|
|
2
|
+
import type { FieldContext } from '../types';
|
|
3
|
+
/**
|
|
4
|
+
* Creates a dual-mode input context. If the component is inside a `Field`,
|
|
5
|
+
* returns the Field's injected context. If standalone (no Field ancestor),
|
|
6
|
+
* creates a minimal `FieldContext` with sensible defaults using the provided
|
|
7
|
+
* model ref.
|
|
8
|
+
*
|
|
9
|
+
* This is the recommended way to build input components that work both
|
|
10
|
+
* inside `<Field>` and as standalone elements with `v-model`.
|
|
11
|
+
*
|
|
12
|
+
* @param model - A ref from `defineModel()` that holds the input value.
|
|
13
|
+
* When inside a `Field`, this parameter is ignored (Field owns the value).
|
|
14
|
+
* When standalone, it is used as the input's reactive value.
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* // Works inside <Field> AND standalone — same code, no casts, no `!`:
|
|
18
|
+
* const model = defineModel<string>({ default: '' });
|
|
19
|
+
* const { inputValue, inputProps, error } = useInputContext(model);
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* // Boolean (checkbox):
|
|
23
|
+
* const model = defineModel<boolean>({ default: false });
|
|
24
|
+
* const { inputValue, inputProps, labelProps } = useInputContext(model);
|
|
25
|
+
*/
|
|
26
|
+
export declare function useInputContext<T>(model: Ref<T>): FieldContext;
|
package/dist/src/types.d.ts
CHANGED
|
@@ -33,7 +33,7 @@ export type InputProps = {
|
|
|
33
33
|
onBlur: () => void;
|
|
34
34
|
};
|
|
35
35
|
export interface FieldContext {
|
|
36
|
-
inputValue: WritableComputedRef<unknown>;
|
|
36
|
+
inputValue: WritableComputedRef<unknown> | Ref<unknown>;
|
|
37
37
|
inputProps: ComputedRef<InputProps>;
|
|
38
38
|
labelProps: {
|
|
39
39
|
for: string;
|
|
@@ -43,8 +43,8 @@ export interface FieldContext {
|
|
|
43
43
|
};
|
|
44
44
|
errorProps: {
|
|
45
45
|
id: string;
|
|
46
|
-
role:
|
|
47
|
-
'aria-live':
|
|
46
|
+
role: 'alert';
|
|
47
|
+
'aria-live': 'polite';
|
|
48
48
|
};
|
|
49
49
|
isValid: ComputedRef<boolean>;
|
|
50
50
|
isTouched: Ref<boolean>;
|