@uniquedj95/vform 3.1.4 → 3.2.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 +78 -2
- package/dist/components/inputs/SelectInput.vue.d.ts +25 -12
- package/dist/components/inputs/SelectInput.vue.d.ts.map +1 -1
- package/dist/components/vForm.vue.d.ts.map +1 -1
- package/dist/composables/useDataTransformation.d.ts.map +1 -1
- package/dist/composables/useDependentOptions.d.ts +11 -0
- package/dist/composables/useDependentOptions.d.ts.map +1 -0
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +5 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.es.js +606 -522
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/dist/types/index.d.ts +13 -2
- package/dist/types/index.d.ts.map +1 -1
- package/dist/vform.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
@@ -6,7 +6,7 @@
|
|
6
6
|
|
7
7
|
A dynamic form builder for Vue.js with Ionic components
|
8
8
|
|
9
|
-
[](https://github.com/uniquedj95/vform/releases)
|
10
10
|
[](https://opensource.org/licenses/MIT)
|
11
11
|
[](https://vuejs.org/)
|
12
12
|
[](https://www.typescriptlang.org/)
|
@@ -28,7 +28,8 @@ A dynamic form builder for Vue.js with Ionic components
|
|
28
28
|
- [Field Configuration Options](#field-configuration-options)
|
29
29
|
- [Form Events](#form-events)
|
30
30
|
- [Form Methods](#form-methods)
|
31
|
-
- [
|
31
|
+
- [Input Dependencies](#input-dependencies)
|
32
|
+
- [Dynamic Options](#dynamic-options)
|
32
33
|
- [Advanced Components](#advanced-components)
|
33
34
|
- [SelectInput](#selectinput)
|
34
35
|
- [Custom Buttons](#custom-buttons)
|
@@ -46,6 +47,7 @@ vForm is a Vue.js component that dynamically generates forms based on a provided
|
|
46
47
|
|
47
48
|
- **Dynamic Form Generation**: Create forms dynamically based on a schema definition.
|
48
49
|
- **Conditional Field Rendering**: Fields can be shown or hidden based on other form values.
|
50
|
+
- **Dependent Options**: Load options for select inputs based on the values of other fields.
|
49
51
|
- **Responsive Grid Layout**: Utilizes Ionic Grid for a responsive design that works across different screen sizes.
|
50
52
|
- **Enhanced Date Input Field**: Custom date formatting and handling with integrated date picker.
|
51
53
|
- **Multiple Selection Interfaces**: Three different interfaces for select inputs (popover, action sheet, alert).
|
@@ -315,6 +317,80 @@ When accessing the VForm via a template ref, you can utilize these methods:
|
|
315
317
|
| `isFormValid()` | Validates all form fields and returns validation state | `Promise<boolean>` |
|
316
318
|
| `resolveData()` | Returns the current form data and computed data | `{ formData: FormData, computedData: ComputedData }` |
|
317
319
|
|
320
|
+
### Input Dependencies
|
321
|
+
|
322
|
+
vForm provides a powerful system for creating dependent form inputs, where the options displayed in one input depend on the values selected in another. This is especially useful for hierarchical selections like country → state → city or category → subcategory.
|
323
|
+
|
324
|
+
#### Dynamic Options
|
325
|
+
|
326
|
+
To create dependent select inputs, use the `dependsOn` property and the extended `options` function:
|
327
|
+
|
328
|
+
```javascript
|
329
|
+
const formSchema = {
|
330
|
+
country: {
|
331
|
+
type: 'SelectInput',
|
332
|
+
label: 'Country',
|
333
|
+
value: '',
|
334
|
+
options: [
|
335
|
+
{ label: 'Malawi', value: 'malawi' },
|
336
|
+
{ label: 'Zambia', value: 'zambia' },
|
337
|
+
],
|
338
|
+
required: true,
|
339
|
+
},
|
340
|
+
district: {
|
341
|
+
type: 'SelectInput',
|
342
|
+
label: 'District',
|
343
|
+
value: '',
|
344
|
+
dependsOn: 'country', // This field depends on the country field
|
345
|
+
options: async (filter, dependencyValues) => {
|
346
|
+
// Get the country value
|
347
|
+
if (!dependencyValues?.country) return [];
|
348
|
+
|
349
|
+
const countryId =
|
350
|
+
typeof dependencyValues.country === 'object'
|
351
|
+
? dependencyValues.country.value
|
352
|
+
: dependencyValues.country;
|
353
|
+
|
354
|
+
// In a real app, you would make an API call here
|
355
|
+
if (countryId === 'malawi') {
|
356
|
+
return [
|
357
|
+
{ label: 'Lilongwe', value: 'lilongwe' },
|
358
|
+
{ label: 'Blantyre', value: 'blantyre' },
|
359
|
+
];
|
360
|
+
}
|
361
|
+
return []; // Return empty options for unknown countries
|
362
|
+
},
|
363
|
+
required: true,
|
364
|
+
},
|
365
|
+
};
|
366
|
+
```
|
367
|
+
|
368
|
+
#### Multiple Dependencies
|
369
|
+
|
370
|
+
An input can also depend on multiple other inputs:
|
371
|
+
|
372
|
+
```javascript
|
373
|
+
{
|
374
|
+
locality: {
|
375
|
+
type: 'SelectInput',
|
376
|
+
label: 'Locality',
|
377
|
+
dependsOn: ['country', 'region'], // Array of field IDs this depends on
|
378
|
+
options: async (filter, dependencyValues) => {
|
379
|
+
// Access to all dependency values
|
380
|
+
if (!dependencyValues) return [];
|
381
|
+
|
382
|
+
const country = dependencyValues.country;
|
383
|
+
const region = dependencyValues.region;
|
384
|
+
|
385
|
+
// Return options based on both dependencies
|
386
|
+
// ...
|
387
|
+
}
|
388
|
+
}
|
389
|
+
}
|
390
|
+
```
|
391
|
+
|
392
|
+
For more details and examples, see the [Dependencies Documentation](./docs/DEPENDENCIES.md).
|
393
|
+
|
318
394
|
### Advanced Components
|
319
395
|
|
320
396
|
#### SelectInput
|
@@ -1,23 +1,36 @@
|
|
1
|
-
import {
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
1
|
+
import { PropType } from 'vue';
|
2
|
+
import { FormSchema, BaseFieldTypes, FormField, Option, FormValue } from '../../types';
|
3
|
+
interface DependencyManager {
|
4
|
+
registerDependency: (fieldId: string, dependsOn: string[], loader: (filter?: string, dependencyValues?: Record<string, FormValue>) => Promise<Option[]>) => void;
|
5
|
+
updateOptions: (fieldId: string, filterValue?: string) => void;
|
6
|
+
}
|
7
7
|
declare function onReset(): void;
|
8
8
|
declare function onValueUpdate(evt?: any): Promise<void>;
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
9
|
+
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
|
10
|
+
schema: PropType<FormSchema>;
|
11
|
+
type: PropType<BaseFieldTypes>;
|
12
|
+
dependencyManager: PropType<DependencyManager>;
|
13
|
+
formId: StringConstructor;
|
14
|
+
modelValue: {
|
15
|
+
type: PropType<FormField>;
|
16
|
+
};
|
17
|
+
}>, {
|
13
18
|
onValueUpdate: typeof onValueUpdate;
|
14
19
|
onReset: typeof onReset;
|
15
20
|
getErrors: () => string[];
|
16
21
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
17
22
|
"update:modelValue": (value: FormField) => any;
|
18
|
-
}, string, import('vue').PublicProps, Readonly<
|
23
|
+
}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
24
|
+
schema: PropType<FormSchema>;
|
25
|
+
type: PropType<BaseFieldTypes>;
|
26
|
+
dependencyManager: PropType<DependencyManager>;
|
27
|
+
formId: StringConstructor;
|
28
|
+
modelValue: {
|
29
|
+
type: PropType<FormField>;
|
30
|
+
};
|
31
|
+
}>> & Readonly<{
|
19
32
|
"onUpdate:modelValue"?: ((value: FormField) => any) | undefined;
|
20
|
-
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions,
|
33
|
+
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
|
21
34
|
containerRef: HTMLDivElement;
|
22
35
|
inputRef: import('vue').CreateComponentPublicInstanceWithMixins<import("@ionic/core").JSX.IonInput & import('@stencil/vue-output-target/runtime').InputProps<string | number | null | undefined> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, false, {}, {}, {}, {}, string, {}, any, import('vue').ComponentProvideOptions, {
|
23
36
|
P: {};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SelectInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/SelectInput.vue"],"names":[],"mappings":"AAiDA;
|
1
|
+
{"version":3,"file":"SelectInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/SelectInput.vue"],"names":[],"mappings":"AAiDA;AAgbA,OAAO,EAAiB,QAAQ,EAA6C,MAAM,KAAK,CAAC;AAEzF,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAiBvF,UAAU,iBAAiB;IACzB,kBAAkB,EAAE,CAClB,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,EAAE,EACnB,MAAM,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,KAAK,OAAO,CAAC,MAAM,EAAE,CAAC,KACzF,IAAI,CAAC;IACV,aAAa,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAChE;AAsCD,iBAAS,OAAO,SAMf;AA6ID,iBAAe,aAAa,CAAC,GAAG,CAAC,EAAE,GAAG,iBAgBrC;;YA0ZmB,QAAQ,CAAC,UAAU,CAAC;UACtB,QAAQ,CAAC,cAAc,CAAC;uBACX,QAAQ,CAAC,iBAAiB,CAAC;;;;;;;;;;;;YAFtC,QAAQ,CAAC,UAAU,CAAC;UACtB,QAAQ,CAAC,cAAc,CAAC;uBACX,QAAQ,CAAC,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;AAZ1D,wBAkBG"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"vForm.vue.d.ts","sourceRoot":"","sources":["../../src/components/vForm.vue"],"names":[],"mappings":"
|
1
|
+
{"version":3,"file":"vForm.vue.d.ts","sourceRoot":"","sources":["../../src/components/vForm.vue"],"names":[],"mappings":"AA8CA;AAqKA,OAAO,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAMjF,UAAU,SAAS;IACjB,MAAM,EAAE,UAAU,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC7C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;CACrC;;;;;;;;;;;;;;;;;gBATc,OAAO;qBACF,OAAO;sBACN,OAAO;qBACR,OAAO,GAAG,QAAQ,GAAG,KAAK;sBACzB,MAAM;qBACP,MAAM;sBACL,MAAM;iBACX,OAAO;;;;AA2UvB,wBAWG"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useDataTransformation.d.ts","sourceRoot":"","sources":["../../src/composables/useDataTransformation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,GAAG,EAAS,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAU,MAAM,OAAO,CAAC;AAGnE;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,YAAY,EAAE,GAAG,CAAC,UAAU,CAAC;;;
|
1
|
+
{"version":3,"file":"useDataTransformation.d.ts","sourceRoot":"","sources":["../../src/composables/useDataTransformation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,GAAG,EAAS,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAU,MAAM,OAAO,CAAC;AAGnE;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,YAAY,EAAE,GAAG,CAAC,UAAU,CAAC;;;EAwJlE"}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { Ref } from 'vue';
|
2
|
+
import { FormSchema, Option, FormData, ComputedData } from '../types';
|
3
|
+
/**
|
4
|
+
* This composable manages dependent options for select inputs.
|
5
|
+
* It allows options for a select input to depend on the value of other inputs.
|
6
|
+
*/
|
7
|
+
export declare function useDependentOptions(schema: Ref<FormSchema>, data: Ref<FormData>, computedData: Ref<ComputedData>): {
|
8
|
+
registerDependency: (fieldId: string, dependsOn: string[], loader: (filter?: string, dependencyValues?: Record<string, any>) => Promise<Option[]>) => void;
|
9
|
+
updateOptions: (fieldId: string, filterValue?: string) => Promise<void>;
|
10
|
+
};
|
11
|
+
//# sourceMappingURL=useDependentOptions.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"useDependentOptions.d.ts","sourceRoot":"","sources":["../../src/composables/useDependentOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,GAAG,EAAE,MAAM,KAAK,CAAC;AACtC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE3E;;;GAGG;AACH,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,GAAG,CAAC,UAAU,CAAC,EACvB,IAAI,EAAE,GAAG,CAAC,QAAQ,CAAC,EACnB,YAAY,EAAE,GAAG,CAAC,YAAY,CAAC;kCAiBpB,MAAM,aACJ,MAAM,EAAE,UACX,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,OAAO,CAAC,MAAM,EAAE,CAAC;6BAoElD,MAAM,gBAAgB,MAAM;EAgEnE"}
|
package/dist/index.cjs.js
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),h=require("@ionic/vue"),T=require("ionicons/icons"),H=require("@maskito/vue");function J(l){return new Promise(r=>{requestAnimationFrame(async()=>{const a=await l.getInputElement();r(a)})})}const Q={d:/\d/,a:/[A-Za-z]/,"*":/[A-Za-z0-9]/},X={d:["1","2","3","4","5","6","7","8","9","0"],a:["A","B","C","x","y","z","D","f"],"*":["A","3","b","8","z","4","D","0"]};function Y(l,r){const a=X[l];return a[r%a.length]}function ee(l){const r=[];let a="",t=0,o=0;for(;t<l.length;){const n=l[t];if(["d","a","*"].includes(n)){let s=1;if(l[t+1]==="{"){const u=l.indexOf("}",t+2);if(u!==-1){const p=l.slice(t+2,u);if(p.includes(",")){const[,i]=p.split(",").map(f=>parseInt(f.trim()));s=i||parseInt(p.split(",")[0])}else s=parseInt(p);t=u}}else{let u=t+1;for(;l[u]===n;)s++,u++;t=u-1}for(let u=0;u<s;u++)r.push(Q[n]),a+=Y(n,o++)}else r.push(n),a+=n;t++}return{mask:r,placeholder:a,elementPredicate:J}}function U(l){return l==null||Array.isArray(l)&&!l.length||typeof l=="object"&&!Object.keys(l).length||!l}function L(l,r,a){return typeof l.condition=="function"?l.condition(r,a):!0}function z(l){if(typeof l!="object"||l===null)return l;if(Array.isArray(l))return l.map(a=>z(a));const r={};return Object.entries(l).forEach(([a,t])=>{typeof t=="function"?r[a]=t.bind(r):r[a]=z(t)}),r}function $(l,r){return r.findIndex(a=>a.value===l.value||a.label===l.label||a.value===l.label||a.label===l.value)}function _(l,r){const a=$(l,r);a>=0?r[a].isChecked=!0:r.push({...l,isChecked:!0})}function q(l,r){const a=$(l,r);a>=0&&(r[a].isChecked=!1)}function te(l,r){return r?l.filter(a=>JSON.stringify(a).toLowerCase().includes(r.toLowerCase())):l}function P(l){const r=l.label||"",a=l.required?" *":"";return r+a}function A(l,r){if(l===r)return!0;if(l==null||r==null||typeof l!=typeof r)return!1;if(typeof l!="object")return l===r;if(Array.isArray(l)&&Array.isArray(r))return l.length!==r.length?!1:l.every((o,n)=>A(o,r[n]));if(Array.isArray(l)!==Array.isArray(r))return!1;const a=Object.keys(l),t=Object.keys(r);return a.length!==t.length?!1:a.every(o=>Object.prototype.hasOwnProperty.call(r,o)&&A(l[o],r[o]))}function j(){const l=e.ref([]);async function r(){console.debug("Validating form inputs");const n=[];for(const s of l.value)if(typeof(s==null?void 0:s.onValueUpdate)=="function"&&await s.onValueUpdate(),typeof(s==null?void 0:s.getErrors)=="function")try{const u=s.getErrors();Array.isArray(u)?n.push(...u):console.warn("getErrors() returned non-array value:",u)}catch(u){console.error("Error calling getErrors on component:",u,s)}else console.warn("Component does not have getErrors function:",s);return n.every(U)}function a(){l.value.forEach(n=>{typeof(n==null?void 0:n.onReset)=="function"&&n.onReset()})}function t(){const n=[];for(const s of l.value)if(typeof(s==null?void 0:s.getErrors)=="function")try{const u=s.getErrors();Array.isArray(u)?n.push(...u):n.push(String(u))}catch(u){console.error("Error calling getErrors on component:",u,s)}return n}async function o(){for(const n of l.value)typeof(n==null?void 0:n.onValueUpdate)=="function"&&await n.onValueUpdate()}return{dynamicRefs:l,isFormValid:r,resetForm:a,getFormErrors:t,updateFormValues:o}}function le(l){const r=e.computed(()=>Object.entries(l.value).reduce((i,[f,m])=>(m.value!==void 0&&(typeof m.onChange=="function"?i[f]=m.onChange(m.value):i[f]=m.value),i),{})),a=e.ref({}),t=(i,f,m)=>{var c;return typeof((c=l.value[i].children[f])==null?void 0:c.computedValue)=="function"?l.value[i].children[f].computedValue(m,l.value):m},o=(i,f,m,c)=>{a.value[i][c]||(a.value[i][c]={}),Object.entries(f.other??{}).forEach(([k,v])=>{var d;!A(v,(d=m.other)==null?void 0:d[k])&&(a.value[i][c][k]=t(i,k,v))})},n=(i,f,m)=>{f.forEach((c,k)=>{const v=m[k]??{other:{}};o(i,c,v,k)})},s=(i,{other:f})=>Object.entries(f??{}).reduce((m,[c,k])=>(m[c]=t(i,c,k),m),{}),u=(i,f,m)=>{a.value[i]||(a.value[i]=[]);const c=f;Array.isArray(m[i])?n(i,c,m[i]):a.value[i]=c.map(k=>s(i,k))},p=(i,f,m)=>{if(!f){delete a.value[i];return}const c=l.value[i];c.children!==void 0?u(i,f,m):typeof c.computedValue=="function"&&(a.value[i]=c.computedValue(f,l.value))};return e.watch(r,(i,f={})=>{Object.keys(i).forEach(m=>{A(i[m],f[m])||p(m,i[m],f)})},{immediate:!0,deep:!0}),{formData:r,computedData:a}}const oe=e.defineComponent({__name:"vForm",props:{schema:{},showLabels:{type:Boolean,default:!0},showClearButton:{type:Boolean,default:!0},showCancelButton:{type:Boolean,default:!0},buttonPlacement:{default:"start"},submitButtonText:{default:"Submit"},clearButtonText:{default:"Reset"},cancelButtonText:{default:"Cancel"},hideButtons:{type:Boolean,default:!1},customButtons:{}},emits:["submit","clear","cancel"],setup(l,{expose:r,emit:a}){const t=l,o=a,n=e.ref(t.schema),{dynamicRefs:s,isFormValid:u,resetForm:p}=j(),{formData:i,computedData:f}=le(n);async function m(){await u()&&o("submit",i.value,f.value)}function c(){p(),o("clear")}function k(){p(),o("cancel")}return e.watch(i,async()=>{for(const[v,C]of Object.entries(n.value))L(C,i.value,f.value)||(C.value=t.schema[v].value)},{deep:!0,immediate:!0}),e.watch(()=>t.schema,v=>{for(const[C,d]of Object.entries(v))d.value!==void 0&&(n.value[C].value=d.value)},{deep:!0,immediate:!0}),r({resetForm:p,isFormValid:u,resolveData:()=>({formData:i.value,computedData:f.value})}),(v,C)=>(e.openBlock(),e.createBlock(e.unref(h.IonGrid),null,{default:e.withCtx(()=>[e.createVNode(e.unref(h.IonRow),null,{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Object.keys(n.value),d=>{var x,B,w,I,E;return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.unref(L)(n.value[d],e.unref(i),e.unref(f))?(e.openBlock(),e.createBlock(e.unref(h.IonCol),{key:d,size:((x=n.value[d].grid)==null?void 0:x.xs)??"12","size-sm":(B=n.value[d].grid)==null?void 0:B.sm,"size-md":(w=n.value[d].grid)==null?void 0:w.md,"size-lg":(I=n.value[d].grid)==null?void 0:I.lg,"size-xl":(E=n.value[d].grid)==null?void 0:E.xl,class:"ion-margin-vertical"},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.value[d].type),{modelValue:n.value[d],"onUpdate:modelValue":F=>n.value[d]=F,schema:n.value,ref_for:!0,ref_key:"dynamicRefs",ref:s,"ref-key":d},null,8,["modelValue","onUpdate:modelValue","schema","ref-key"]))]),_:2},1032,["size","size-sm","size-md","size-lg","size-xl"])):e.createCommentVNode("",!0)],64)}),256))]),_:1}),v.hideButtons?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(e.unref(h.IonRow),{key:0},{default:e.withCtx(()=>[e.createVNode(e.unref(h.IonCol),{size:"12",style:e.normalizeStyle([{display:"flex"},{justifyContent:v.buttonPlacement}])},{default:e.withCtx(()=>[v.showCancelButton?(e.openBlock(),e.createBlock(e.unref(h.IonButton),{key:0,onClick:k},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.cancelButtonText??"Cancel"),1)]),_:1})):e.createCommentVNode("",!0),v.showClearButton?(e.openBlock(),e.createBlock(e.unref(h.IonButton),{key:1,onClick:c},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.clearButtonText??"Reset"),1)]),_:1})):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.customButtons,d=>(e.openBlock(),e.createBlock(e.unref(h.IonButton),{key:d.label,onClick:d.action,color:d.color??"primary"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(d.label),1)]),_:2},1032,["onClick","color"]))),128)),e.createVNode(e.unref(h.IonButton),{onClick:m},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.submitButtonText??"Submit"),1)]),_:1})]),_:1},8,["style"])]),_:1}))]),_:1}))}});function ne(l){return{applyValidationState:async t=>{var o,n,s,u,p;(o=l.value)==null||o.$el.classList.remove("ion-invalid"),(n=l.value)==null||n.$el.classList.remove("ion-valid"),t?(s=l.value)==null||s.$el.classList.add("ion-valid"):(u=l.value)==null||u.$el.classList.add("ion-invalid"),(p=l.value)==null||p.$el.classList.add("ion-touched")},resetValidationState:()=>{var t,o;(t=l.value)==null||t.$el.classList.remove("ion-touched"),(o=l.value)==null||o.$el.classList.remove("ion-invalid")}}}function S(l,r,a,t,o){const{applyValidationState:n,resetValidationState:s}=ne(l);async function u(){if(r.value.required&&!a.value)return r.value.error="This field is required",!1;if(o){const c=await o(a.value);if(typeof c=="string")return r.value.error=c,!1;if(c===!1)return!1}if(r.value.validation){const c=await r.value.validation(a.value,t==null?void 0:t.value);if(c&&c.length)return r.value.error=c.join(),!1}return!0}async function p(){const c=await u();c&&(r.value.error="",r.value.value=a.value),await n(c)}function i(){s(),r.value.error=""}function f(c=""){a.value=c,r.value.error="",r.value.value=c}function m(){return r.value.error?[r.value.error]:[]}return{isValid:u,onValueUpdate:p,onFocus:i,onReset:f,getErrors:m,applyValidationState:n,resetValidationState:s}}function ae(l){const r=e.computed(()=>!!l.value.label),a=e.computed(()=>!!l.value.required),t=e.computed(()=>l.value.label||"");return{showLabel:r,showRequired:a,labelText:t}}const D=e.defineComponent({__name:"InputLabel",props:{model:{}},setup(l){const r=l,{showLabel:a,showRequired:t,labelText:o}=ae(e.toRef(r,"model"));return(n,s)=>e.unref(a)?(e.openBlock(),e.createBlock(e.unref(h.IonLabel),{key:0,slot:"label",class:"input-label"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(o))+" ",1),e.unref(t)?(e.openBlock(),e.createBlock(e.unref(h.IonText),{key:0,color:"danger"},{default:e.withCtx(()=>s[0]||(s[0]=[e.createTextVNode("*")])),_:1,__:[0]})):e.createCommentVNode("",!0)]),_:1})):e.createCommentVNode("",!0)}}),O=e.defineComponent({__name:"BaseInput",props:e.mergeModels({schema:{},type:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=l,t=e.useModel(l,"modelValue"),o=e.ref(null),n=e.ref(t.value.value),s=e.computed(()=>a.schema),{isValid:u,onValueUpdate:p,onFocus:i,onReset:f,getErrors:m}=S(o,t,n,s),c=e.computed(()=>{if(t.value.pattern)return ee(t.value.pattern)});return e.watch(()=>t.value.value,k=>n.value=k),r({onValueUpdate:p,onReset:f,getErrors:m,isValid:u}),(k,v)=>{var d;const C=e.resolveDirective("maskito");return e.withDirectives((e.openBlock(),e.createBlock(e.unref(h.IonInput),{ref_key:"inputRef",ref:o,modelValue:n.value,"onUpdate:modelValue":v[0]||(v[0]=x=>n.value=x),"clear-input":!0,fill:t.value.fill??"solid","label-placement":t.value.labelPlacement??"stacked",type:k.type??"text",required:t.value.required,"error-text":t.value.error,autofocus:t.value.autoFocus,placeholder:((d=c.value)==null?void 0:d.placeholder)??t.value.placeholder,disabled:t.value.disabled,counter:t.value.counter,min:t.value.min,max:t.value.max,"max-length":t.value.maxLength,"min-length":t.value.minLength,pattern:t.value.pattern,onIonFocus:e.unref(i),onIonChange:e.unref(p),onIonBlur:e.unref(p)},{default:e.withCtx(()=>[e.createVNode(D,{model:t.value},null,8,["model"]),t.value.prefix?(e.openBlock(),e.createBlock(e.unref(h.IonLabel),{key:0,slot:"start"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.value.prefix),1)]),_:1})):e.createCommentVNode("",!0),t.value.suffix?(e.openBlock(),e.createBlock(e.unref(h.IonLabel),{key:1,slot:"end"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.value.suffix),1)]),_:1})):e.createCommentVNode("",!0),k.type==="password"?(e.openBlock(),e.createBlock(e.unref(h.IonInputPasswordToggle),{key:2,slot:"end"})):e.createCommentVNode("",!0)]),_:1},8,["modelValue","fill","label-placement","type","required","error-text","autofocus","placeholder","disabled","counter","min","max","max-length","min-length","pattern","onIonFocus","onIonChange","onIonBlur"])),[[C,c.value]])}}}),re=e.defineComponent({__name:"TextInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=e.useModel(l,"modelValue"),t=e.ref(null);return r({onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},getErrors:()=>{var o,n;return((n=(o=t.value)==null?void 0:o.getErrors)==null?void 0:n.call(o))??[]}}),(o,n)=>(e.openBlock(),e.createBlock(O,{modelValue:a.value,"onUpdate:modelValue":n[0]||(n[0]=s=>a.value=s),type:"text",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","schema"]))}}),ue=e.defineComponent({__name:"DateInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=e.useModel(l,"modelValue"),t=e.ref(null);return r({onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},getErrors:()=>{var o,n;return((n=(o=t.value)==null?void 0:o.getErrors)==null?void 0:n.call(o))??[]}}),(o,n)=>(e.openBlock(),e.createBlock(O,{modelValue:a.value,"onUpdate:modelValue":n[0]||(n[0]=s=>a.value=s),type:a.value.enableTime?"datetime-local":"date",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","type","schema"]))}}),se=e.defineComponent({__name:"NumberInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=e.useModel(l,"modelValue"),t=e.ref(null);return r({onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},getErrors:()=>{var o,n;return((n=(o=t.value)==null?void 0:o.getErrors)==null?void 0:n.call(o))??[]}}),(o,n)=>(e.openBlock(),e.createBlock(O,{modelValue:a.value,"onUpdate:modelValue":n[0]||(n[0]=s=>a.value=s),type:"number",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","schema"]))}}),ce=e.defineComponent({__name:"EmailInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=e.useModel(l,"modelValue"),t=e.ref(null);return r({onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},getErrors:()=>{var o,n;return((n=(o=t.value)==null?void 0:o.getErrors)==null?void 0:n.call(o))??[]}}),(o,n)=>(e.openBlock(),e.createBlock(O,{modelValue:a.value,"onUpdate:modelValue":n[0]||(n[0]=s=>a.value=s),type:"email",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","schema"]))}}),ie=e.defineComponent({__name:"PasswordInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=e.useModel(l,"modelValue"),t=e.ref(null);return r({onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},getErrors:()=>{var o,n;return((n=(o=t.value)==null?void 0:o.getErrors)==null?void 0:n.call(o))??[]}}),(o,n)=>(e.openBlock(),e.createBlock(O,{modelValue:a.value,"onUpdate:modelValue":n[0]||(n[0]=s=>a.value=s),type:"password",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","schema"]))}}),de=e.defineComponent({__name:"SelectInput",props:e.mergeModels({schema:{},type:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=l,t=e.useModel(l,"modelValue"),o=e.ref(null),n=e.ref(null),s=e.ref(!1),u=e.ref([]),p=e.ref(""),i=e.ref(1),f=e.computed(()=>t.value.interface??"popover"),m=e.computed(()=>t.value.optionsPlacement==="top"?"top":"bottom"),c=e.computed(()=>u.value.filter(y=>!!y.isChecked)),k=e.computed(()=>!p.value&&U(c.value)&&!s.value?t.value.placeholder??"Select an option":"");e.watch([p,()=>t.value.options],N,{immediate:!0,deep:!0}),e.watch(()=>t.value.value,W,{immediate:!0,deep:!0});function v(){u.value.forEach(y=>q(y,u.value)),t.value.error="",p.value="",i.value=1,t.value.value=t.value.multiple?[]:""}function C(y){if(y.isChecked)return q(y,u.value);t.value.multiple?_(y,u.value):(v(),_(y,u.value),R()),p.value=""}function d(){switch(f.value){case"action-sheet":x();break;case"alert":B();break;case"popover":default:s.value=!0;break}}async function x(){if(await N(),t.value.multiple){s.value=!0;return}await(await h.actionSheetController.create({header:t.value.label||"Select an option",buttons:[...u.value.map(g=>({text:g.label,cssClass:g.isChecked?"selected-option":"",handler:()=>(C(g),!1)})),{text:"Cancel",role:"cancel"}]})).present()}async function B(){await N();const y=u.value.map(V=>({label:V.label,type:t.value.multiple?"checkbox":"radio",value:V,checked:V.isChecked}));await(await h.alertController.create({header:t.value.label||"Select an option",inputs:y,buttons:[{text:"Cancel",role:"cancel"},{text:"OK",handler:V=>{if(t.value.multiple)u.value.forEach(b=>q(b,u.value)),V.forEach(b=>{const M=u.value.find(Z=>Z.value===b.value);M&&_(M,u.value)});else{v();const b=u.value.find(M=>M.value===V.value);b&&_(b,u.value)}R()}}]})).present()}async function w(){if(t.value.required&&U(c.value))return"This field is required";if(t.value.validation){const y=await t.value.validation(c.value,a==null?void 0:a.schema);if(y&&y.length)return y.join()}return!0}const{onFocus:I,applyValidationState:E}=S(o,t,e.computed(()=>t.value.multiple?c.value:c.value[0]),e.computed(()=>a==null?void 0:a.schema),w);function F(y){var g;y.target===((g=o.value)==null?void 0:g.$el)&&(I(),f.value==="popover"&&(s.value=!0))}async function R(y){var V;if((V=y==null?void 0:y.relatedTarget)!=null&&V.closest(".suggestions-list"))return;s.value=!1;const g=await w();g===!0?(t.value.error="",t.value.value=t.value.multiple?c.value:c.value[0]):t.value.error=typeof g=="string"?g:"Validation failed",await E(g===!0)}async function N(){const y=[];if(typeof t.value.options=="function"){const g=await t.value.options(p.value);y.push(...g.filter(V=>!!V.label))}else y.push(...te(t.value.options??[],p.value));c.value.forEach(g=>_(g,y)),u.value=y}function W(){const y=t.value.value;y&&(Array.isArray(y)?y.forEach(g=>_(g,u.value)):_(typeof y=="object"?y:{value:y,label:y},u.value))}return r({onValueUpdate:R,onReset:v,getErrors:()=>t.value.error?[t.value.error]:[]}),(y,g)=>(e.openBlock(),e.createElementBlock("div",{class:"autocomplete-container",onFocusout:R,ref_key:"containerRef",ref:n},[e.createVNode(e.unref(h.IonInput),{ref_key:"inputRef",ref:o,modelValue:p.value,"onUpdate:modelValue":g[0]||(g[0]=V=>p.value=V),fill:t.value.fill??"solid","label-placement":t.value.labelPlacement??"stacked",type:y.type??"text",required:t.value.required,"error-text":t.value.error,autofocus:t.value.autoFocus,placeholder:k.value,disabled:t.value.disabled,counter:t.value.counter,onIonFocus:F,debounce:300,onClick:d},{default:e.withCtx(()=>[e.createVNode(D,{model:t.value},null,8,["model"]),t.value.multiple?(e.openBlock(),e.createBlock(e.unref(h.IonLabel),{key:0,style:{width:"fit-content"},slot:"start"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(c.value,(V,b)=>(e.openBlock(),e.createBlock(e.unref(h.IonChip),{key:b},{default:e.withCtx(()=>[e.createVNode(e.unref(h.IonLabel),null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(V.label),1)]),_:2},1024)]),_:2},1024))),128))]),_:1})):(e.openBlock(),e.createBlock(e.unref(h.IonLabel),{key:1,slot:"start",class:"ion-no-wrap"},{default:e.withCtx(()=>{var V;return[e.createTextVNode(e.toDisplayString(((V=c.value[0])==null?void 0:V.label)??""),1)]}),_:1})),e.createVNode(e.unref(h.IonIcon),{slot:"end",icon:e.unref(T.chevronDown)},null,8,["icon"]),c.value.length>0||p.value?(e.openBlock(),e.createBlock(e.unref(h.IonIcon),{key:2,slot:"end",icon:e.unref(T.close),onClick:v,style:{"z-index":"999999"}},null,8,["icon"])):e.createCommentVNode("",!0)]),_:1},8,["modelValue","fill","label-placement","type","required","error-text","autofocus","placeholder","disabled","counter"]),s.value&&u.value.length>0&&f.value==="popover"?(e.openBlock(),e.createBlock(e.unref(h.IonList),{key:0,class:e.normalizeClass(["suggestions-list",m.value])},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.value,V=>(e.openBlock(),e.createBlock(e.unref(h.IonItem),{button:"",key:V.label,onClick:b=>C(V)},{default:e.withCtx(()=>[t.value.multiple?(e.openBlock(),e.createBlock(e.unref(h.IonCheckbox),{key:0,slot:"start",checked:V.isChecked},null,8,["checked"])):e.createCommentVNode("",!0),e.createVNode(e.unref(h.IonLabel),null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(V.label),1)]),_:2},1024)]),_:2},1032,["onClick"]))),128))]),_:1},8,["class"])):e.createCommentVNode("",!0)],544))}}),G=(l,r)=>{const a=l.__vccOpts||l;for(const[t,o]of r)a[t]=o;return a},fe=G(de,[["__scopeId","data-v-e2c4eed6"]]),me=e.defineComponent({__name:"TextAreaInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=l,t=e.useModel(l,"modelValue"),o=e.ref(null),n=e.ref(t.value.value),s=e.computed(()=>a.schema),{onValueUpdate:u,onFocus:p,onReset:i,getErrors:f}=S(o,t,n,s);return e.watch(()=>t.value.value,m=>n.value=m),r({onReset:i,onValueUpdate:u,getErrors:f}),(m,c)=>(e.openBlock(),e.createBlock(e.unref(h.IonTextarea),{ref_key:"inputRef",ref:o,modelValue:n.value,"onUpdate:modelValue":c[0]||(c[0]=k=>n.value=k),"clear-input":!0,fill:t.value.fill??"solid","label-placement":t.value.labelPlacement??"stacked",required:t.value.required,"error-text":t.value.error,autofocus:t.value.autoFocus,placeholder:t.value.placeholder,disabled:t.value.disabled,counter:t.value.counter,min:t.value.min,max:t.value.max,rows:t.value.rows,cols:t.value.cols,"auto-grow":t.value.autoGrow,"max-length":t.value.maxLength,"min-length":t.value.minLength,pattern:t.value.pattern,onIonFocus:e.unref(p),onIonChange:e.unref(u),onIonBlur:e.unref(u)},{default:e.withCtx(()=>[e.createVNode(D,{model:t.value},null,8,["model"])]),_:1},8,["modelValue","fill","label-placement","required","error-text","autofocus","placeholder","disabled","counter","min","max","rows","cols","auto-grow","max-length","min-length","pattern","onIonFocus","onIonChange","onIonBlur"]))}}),pe={class:"ion-margin-end",style:{"flex-grow":"1"}},ve={style:{display:"flex","justify-content":"flex-end"}},he=e.defineComponent({__name:"RepeatInput",props:e.mergeModels({schema:{},data:{},computedData:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=e.useModel(l,"modelValue"),t=e.ref([]),{dynamicRefs:o,resetForm:n,getFormErrors:s,updateFormValues:u}=j(),p=e.computed(()=>t.value.map((v,C)=>({label:`Set ${C+1}`,value:C,other:Object.entries(v).reduce((d,[x,B])=>(d[x]=B.value,d),{})})));e.watch(p,v=>{a.value.value=v},{deep:!0,immediate:!0}),e.onMounted(i);function i(){a.value.children&&t.value.push(z(a.value.children))}function f(v){t.value.splice(v,1)}function m(){n()}function c(){return s()}async function k(){await u()}return r({onValueUpdate:k,onReset:m,getErrors:c}),(v,C)=>(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.value,(d,x)=>(e.openBlock(),e.createElementBlock("div",{class:"repeat-input-wrapper",key:x},[e.createElementVNode("div",pe,[e.createVNode(e.unref(h.IonRow),null,{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Object.keys(d),B=>{var w,I,E,F,R;return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.unref(L)(d[B],v.data,v.computedData)?(e.openBlock(),e.createBlock(e.unref(h.IonCol),{key:`${x}-${B}`,size:((w=d[B].grid)==null?void 0:w.xs)??"12","size-sm":(I=d[B].grid)==null?void 0:I.sm,"size-md":(E=d[B].grid)==null?void 0:E.md,"size-lg":(F=d[B].grid)==null?void 0:F.lg,"size-xl":(R=d[B].grid)==null?void 0:R.xl,class:"ion-margin-bottom"},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(d[B].type),{modelValue:d[B],"onUpdate:modelValue":N=>d[B]=N,schema:d,"ref-key":`${x}-${B}`,ref_for:!0,ref_key:"dynamicRefs",ref:o},null,8,["modelValue","onUpdate:modelValue","schema","ref-key"]))]),_:2},1032,["size","size-sm","size-md","size-lg","size-xl"])):e.createCommentVNode("",!0)],64)}),256))]),_:2},1024)]),e.createElementVNode("div",ve,[x===t.value.length-1?(e.openBlock(),e.createBlock(e.unref(h.IonButton),{key:0,onClick:i,color:"primary"},{default:e.withCtx(()=>[e.createVNode(e.unref(h.IonIcon),{slot:"icon-only",icon:e.unref(T.add)},null,8,["icon"])]),_:1})):e.createCommentVNode("",!0),t.value.length>1?(e.openBlock(),e.createBlock(e.unref(h.IonButton),{key:1,onClick:B=>f(x),color:"warning"},{default:e.withCtx(()=>[e.createVNode(e.unref(h.IonIcon),{slot:"icon-only",icon:e.unref(T.remove)},null,8,["icon"])]),_:2},1032,["onClick"])):e.createCommentVNode("",!0)])]))),128))}}),ye=G(he,[["__scopeId","data-v-402695fe"]]),ke=e.defineComponent({__name:"CheckboxInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=l,t=e.useModel(l,"modelValue"),o=e.ref(null),n=e.ref(t.value.value),s=e.computed(()=>a.schema),u=e.computed(()=>P(t.value)),{onValueUpdate:p,onFocus:i,getErrors:f}=S(o,t,n,s);function m(){n.value=!1,t.value.error="",t.value.value=!1}return e.watch(()=>t.value.value,c=>n.value=c),r({onValueUpdate:p,onReset:m,getErrors:f}),(c,k)=>(e.openBlock(),e.createBlock(e.unref(h.IonCheckbox),{modelValue:n.value,"onUpdate:modelValue":k[0]||(k[0]=v=>n.value=v),ref_key:"inputRef",ref:o,required:t.value.required,"error-text":t.value.error,disabled:t.value.disabled,onIonFocus:e.unref(i),onIonChange:e.unref(p),onIonBlur:e.unref(p)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(u.value),1)]),_:1},8,["modelValue","required","error-text","disabled","onIonFocus","onIonChange","onIonBlur"]))}}),Ve=e.defineComponent({__name:"RadioInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(l,{expose:r}){const a=l,t=e.useModel(l,"modelValue"),o=e.ref(null),n=e.ref(t.value.value),s=e.computed(()=>a.schema),u=e.ref([]),p=e.computed(()=>P(t.value)),{onValueUpdate:i,onFocus:f,getErrors:m}=S(o,t,n,s);function c(){t.value.error="",n.value=void 0,t.value.value=void 0}function k(C,d){return C.value===d.value}async function v(){typeof t.value.options=="function"?u.value=await t.value.options():u.value=t.value.options}return e.watch(()=>t.value.value,C=>n.value=C),r({onValueUpdate:i,onReset:c,getErrors:m}),e.onMounted(v),(C,d)=>(e.openBlock(),e.createBlock(e.unref(h.IonRadioGroup),{modelValue:n.value,"onUpdate:modelValue":d[0]||(d[0]=x=>n.value=x),ref_key:"inputRef",ref:o,required:t.value.required,"helper-text":p.value,"error-text":t.value.error,disabled:t.value.disabled,compareWith:k,"allow-empty-selection":!t.value.required,onIonFocus:e.unref(f),onIonChange:e.unref(i),onIonBlur:e.unref(i)},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.value,x=>(e.openBlock(),e.createBlock(e.unref(h.IonRadio),{key:x.value,value:x,disabled:t.value.disabled,"label-placement":"end",justify:"start"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(x.label),1)]),_:2},1032,["value","disabled"]))),128))]),_:1},8,["modelValue","required","helper-text","error-text","disabled","allow-empty-selection","onIonFocus","onIonChange","onIonBlur"]))}}),K={install(l){l.component("VForm",oe),l.component("TextInput",re),l.component("DateInput",ue),l.component("NumberInput",se),l.component("EmailInput",ce),l.component("PasswordInput",ie),l.component("SelectInput",fe),l.component("TextAreaInput",me),l.component("RepeatInput",ye),l.component("CheckboxInput",ke),l.component("RadioInput",Ve),l.directive("maskito",H.maskito)}};exports.VForm=K;exports.default=K;
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),y=require("@ionic/vue"),S=require("ionicons/icons"),Q=require("@maskito/vue");function X(n){return new Promise(r=>{requestAnimationFrame(async()=>{const l=await n.getInputElement();r(l)})})}const Y={d:/\d/,a:/[A-Za-z]/,"*":/[A-Za-z0-9]/},ee={d:["1","2","3","4","5","6","7","8","9","0"],a:["A","B","C","x","y","z","D","f"],"*":["A","3","b","8","z","4","D","0"]};function te(n,r){const l=ee[n];return l[r%l.length]}function ne(n){const r=[];let l="",t=0,o=0;for(;t<n.length;){const a=n[t];if(["d","a","*"].includes(a)){let i=1;if(n[t+1]==="{"){const c=n.indexOf("}",t+2);if(c!==-1){const p=n.slice(t+2,c);if(p.includes(",")){const[,d]=p.split(",").map(s=>parseInt(s.trim()));i=d||parseInt(p.split(",")[0])}else i=parseInt(p);t=c}}else{let c=t+1;for(;n[c]===a;)i++,c++;t=c-1}for(let c=0;c<i;c++)r.push(Y[a]),l+=te(a,o++)}else r.push(a),l+=a;t++}return{mask:r,placeholder:l,elementPredicate:X}}function L(n){return n==null||Array.isArray(n)&&!n.length||typeof n=="object"&&!Object.keys(n).length||!n}function U(n,r,l){return typeof n.condition=="function"?n.condition(r,l):!0}function D(n){if(typeof n!="object"||n===null)return n;if(Array.isArray(n))return n.map(l=>D(l));const r={};return Object.entries(n).forEach(([l,t])=>{typeof t=="function"?r[l]=t.bind(r):r[l]=D(t)}),r}function j(n,r){return r.findIndex(l=>l.value===n.value||l.label===n.label||l.value===n.label||l.label===n.value)}function I(n,r){const l=j(n,r);l>=0?r[l].isChecked=!0:r.push({...n,isChecked:!0})}function q(n,r){const l=j(n,r);l>=0&&(r[l].isChecked=!1)}function oe(n,r){return r?n.filter(l=>JSON.stringify(l).toLowerCase().includes(r.toLowerCase())):n}function P(n){const r=n.label||"",l=n.required?" *":"";return r+l}function T(n,r){if(n===r)return!0;if(n==null||r==null||typeof n!=typeof r)return!1;if(typeof n!="object")return n===r;if(Array.isArray(n)&&Array.isArray(r))return n.length!==r.length?!1:n.every((o,a)=>T(o,r[a]));if(Array.isArray(n)!==Array.isArray(r))return!1;const l=Object.keys(n),t=Object.keys(r);return l.length!==t.length?!1:l.every(o=>Object.prototype.hasOwnProperty.call(r,o)&&T(n[o],r[o]))}function $(){const n=e.ref([]);async function r(){console.debug("Validating form inputs");const a=[];for(const i of n.value)if(typeof(i==null?void 0:i.onValueUpdate)=="function"&&await i.onValueUpdate(),typeof(i==null?void 0:i.getErrors)=="function")try{const c=i.getErrors();Array.isArray(c)?a.push(...c):console.warn("getErrors() returned non-array value:",c)}catch(c){console.error("Error calling getErrors on component:",c,i)}else console.warn("Component does not have getErrors function:",i);return a.every(L)}function l(){n.value.forEach(a=>{typeof(a==null?void 0:a.onReset)=="function"&&a.onReset()})}function t(){const a=[];for(const i of n.value)if(typeof(i==null?void 0:i.getErrors)=="function")try{const c=i.getErrors();Array.isArray(c)?a.push(...c):a.push(String(c))}catch(c){console.error("Error calling getErrors on component:",c,i)}return a}async function o(){for(const a of n.value)typeof(a==null?void 0:a.onValueUpdate)=="function"&&await a.onValueUpdate()}return{dynamicRefs:n,isFormValid:r,resetForm:l,getFormErrors:t,updateFormValues:o}}function G(n){const r=e.computed(()=>Object.entries(n.value).reduce((d,[s,f])=>(f.value!==void 0&&(typeof f.onChange=="function"?d[s]=f.onChange(f.value):d[s]=f.value),d),{})),l=e.ref({}),t=(d,s,f)=>{var u;return typeof((u=n.value[d].children[s])==null?void 0:u.computedValue)=="function"?n.value[d].children[s].computedValue(f,n.value):f},o=(d,s,f,u)=>{l.value[d][u]||(l.value[d][u]={}),Object.entries(s.other??{}).forEach(([m,V])=>{var g;!T(V,(g=f.other)==null?void 0:g[m])&&(l.value[d][u][m]=t(d,m,V))})},a=(d,s,f)=>{s.forEach((u,m)=>{const V=f[m]??{other:{}};o(d,u,V,m)})},i=(d,{other:s})=>Object.entries(s??{}).reduce((f,[u,m])=>(f[u]=t(d,u,m),f),{}),c=(d,s,f)=>{l.value[d]||(l.value[d]=[]);const u=s;Array.isArray(f[d])?a(d,u,f[d]):l.value[d]=u.map(m=>i(d,m))},p=(d,s,f)=>{if(!s){delete l.value[d];return}const u=n.value[d];u.children!==void 0?c(d,s,f):typeof u.computedValue=="function"&&(l.value[d]=u.computedValue(s,n.value))};return e.watch(r,(d,s={})=>{Object.keys(d).forEach(f=>{T(d[f],s[f])||p(f,d[f],s)}),Object.keys(s).forEach(f=>{!(f in d)&&f in l.value&&delete l.value[f]})},{immediate:!0,deep:!0}),{formData:r,computedData:l}}function H(n,r,l){const t=e.ref({}),o=e.ref({});function a(s,f,u){o.value[s]=u,f.forEach(m=>{var V;(V=t.value)[m]??(V[m]=[]),t.value[m].includes(s)||t.value[m].push(s)}),d(s)}function i(s){return Object.entries(t.value).filter(([,u])=>u.includes(s)).map(([u])=>u).reduce((u,m)=>(u[m]=r.value[m]??l.value[m],u),{})}function c(s,f){return s?Array.isArray(s)?s.some(u=>f.some(m=>p(u,m.value))):f.some(u=>p(s,u.value)):!1}function p(s,f){return typeof s=="object"&&s!==null?s.value===f:String(s)===String(f)}async function d(s,f){if(!o.value[s])return;const u=i(s),m=Object.keys(u);if(!(m.length===0||!m.every(k=>u[k]!==void 0&&u[k]!==null)))try{const k=o.value[s],g=await k(f,u);if(!n.value[s])return;n.value[s].options=g;const v=n.value[s].value;if(!v)return;c(v,g)||(n.value[s].value=n.value[s].multiple?[]:"")}catch(k){console.error(`Error loading options for ${s}:`,k)}}return e.watch([r,l],()=>{Object.entries(t.value).forEach(([s,f])=>{(r.value[s]!==void 0||l.value[s]!==void 0)&&f.forEach(u=>{d(u)})})},{deep:!0,immediate:!0}),{registerDependency:a,updateOptions:d}}const le=e.defineComponent({__name:"vForm",props:{schema:{},showLabels:{type:Boolean,default:!0},showClearButton:{type:Boolean,default:!0},showCancelButton:{type:Boolean,default:!0},buttonPlacement:{default:"start"},submitButtonText:{default:"Submit"},clearButtonText:{default:"Reset"},cancelButtonText:{default:"Cancel"},hideButtons:{type:Boolean,default:!1},customButtons:{}},emits:["submit","clear","cancel"],setup(n,{expose:r,emit:l}){const t=n,o=l,a=e.ref(t.schema),{dynamicRefs:i,isFormValid:c,resetForm:p}=$(),{formData:d,computedData:s}=G(a),f=H(a,d,s);async function u(){await c()&&o("submit",d.value,s.value)}function m(){p(),o("clear")}function V(){p(),o("cancel")}return e.watch(d,async()=>{for(const[k,g]of Object.entries(a.value))U(g,d.value,s.value)||(g.value=t.schema[k].value)},{deep:!0,immediate:!0}),e.watch(()=>t.schema,k=>{for(const[g,v]of Object.entries(k))v.value!==void 0&&(a.value[g].value=v.value)},{deep:!0,immediate:!0}),r({resetForm:p,isFormValid:c,resolveData:()=>({formData:d.value,computedData:s.value})}),(k,g)=>(e.openBlock(),e.createBlock(e.unref(y.IonGrid),null,{default:e.withCtx(()=>[e.createVNode(e.unref(y.IonRow),null,{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Object.keys(a.value),v=>{var B,_,E,O,F;return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.unref(U)(a.value[v],e.unref(d),e.unref(s))?(e.openBlock(),e.createBlock(e.unref(y.IonCol),{key:v,size:((B=a.value[v].grid)==null?void 0:B.xs)??"12","size-sm":(_=a.value[v].grid)==null?void 0:_.sm,"size-md":(E=a.value[v].grid)==null?void 0:E.md,"size-lg":(O=a.value[v].grid)==null?void 0:O.lg,"size-xl":(F=a.value[v].grid)==null?void 0:F.xl,class:"ion-margin-vertical"},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(a.value[v].type),{modelValue:a.value[v],"onUpdate:modelValue":w=>a.value[v]=w,schema:a.value,"dependency-manager":e.unref(f),"form-id":v,ref_for:!0,ref_key:"dynamicRefs",ref:i,"ref-key":v},null,8,["modelValue","onUpdate:modelValue","schema","dependency-manager","form-id","ref-key"]))]),_:2},1032,["size","size-sm","size-md","size-lg","size-xl"])):e.createCommentVNode("",!0)],64)}),256))]),_:1}),k.hideButtons?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(e.unref(y.IonRow),{key:0},{default:e.withCtx(()=>[e.createVNode(e.unref(y.IonCol),{size:"12",style:e.normalizeStyle([{display:"flex"},{justifyContent:k.buttonPlacement}])},{default:e.withCtx(()=>[k.showCancelButton?(e.openBlock(),e.createBlock(e.unref(y.IonButton),{key:0,onClick:V},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(k.cancelButtonText??"Cancel"),1)]),_:1})):e.createCommentVNode("",!0),k.showClearButton?(e.openBlock(),e.createBlock(e.unref(y.IonButton),{key:1,onClick:m},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(k.clearButtonText??"Reset"),1)]),_:1})):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(k.customButtons,v=>(e.openBlock(),e.createBlock(e.unref(y.IonButton),{key:v.label,onClick:v.action,color:v.color??"primary"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.label),1)]),_:2},1032,["onClick","color"]))),128)),e.createVNode(e.unref(y.IonButton),{onClick:u},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(k.submitButtonText??"Submit"),1)]),_:1})]),_:1},8,["style"])]),_:1}))]),_:1}))}});function ae(n){return{applyValidationState:async t=>{var o,a,i,c,p;(o=n.value)==null||o.$el.classList.remove("ion-invalid"),(a=n.value)==null||a.$el.classList.remove("ion-valid"),t?(i=n.value)==null||i.$el.classList.add("ion-valid"):(c=n.value)==null||c.$el.classList.add("ion-invalid"),(p=n.value)==null||p.$el.classList.add("ion-touched")},resetValidationState:()=>{var t,o;(t=n.value)==null||t.$el.classList.remove("ion-touched"),(o=n.value)==null||o.$el.classList.remove("ion-invalid")}}}function M(n,r,l,t,o){const{applyValidationState:a,resetValidationState:i}=ae(n);async function c(){if(r.value.required&&!l.value)return r.value.error="This field is required",!1;if(o){const u=await o(l.value);if(typeof u=="string")return r.value.error=u,!1;if(u===!1)return!1}if(r.value.validation){const u=await r.value.validation(l.value,t==null?void 0:t.value);if(u&&u.length)return r.value.error=u.join(),!1}return!0}async function p(){const u=await c();u&&(r.value.error="",r.value.value=l.value),await a(u)}function d(){i(),r.value.error=""}function s(u=""){l.value=u,r.value.error="",r.value.value=u}function f(){return r.value.error?[r.value.error]:[]}return{isValid:c,onValueUpdate:p,onFocus:d,onReset:s,getErrors:f,applyValidationState:a,resetValidationState:i}}function re(n){const r=e.computed(()=>!!n.value.label),l=e.computed(()=>!!n.value.required),t=e.computed(()=>n.value.label||"");return{showLabel:r,showRequired:l,labelText:t}}const z=e.defineComponent({__name:"InputLabel",props:{model:{}},setup(n){const r=n,{showLabel:l,showRequired:t,labelText:o}=re(e.toRef(r,"model"));return(a,i)=>e.unref(l)?(e.openBlock(),e.createBlock(e.unref(y.IonLabel),{key:0,slot:"label",class:"input-label"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(o))+" ",1),e.unref(t)?(e.openBlock(),e.createBlock(e.unref(y.IonText),{key:0,color:"danger"},{default:e.withCtx(()=>i[0]||(i[0]=[e.createTextVNode("*")])),_:1,__:[0]})):e.createCommentVNode("",!0)]),_:1})):e.createCommentVNode("",!0)}}),A=e.defineComponent({__name:"BaseInput",props:e.mergeModels({schema:{},type:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=n,t=e.useModel(n,"modelValue"),o=e.ref(null),a=e.ref(t.value.value),i=e.computed(()=>l.schema),{isValid:c,onValueUpdate:p,onFocus:d,onReset:s,getErrors:f}=M(o,t,a,i),u=e.computed(()=>{if(t.value.pattern)return ne(t.value.pattern)});return e.watch(()=>t.value.value,m=>a.value=m),r({onValueUpdate:p,onReset:s,getErrors:f,isValid:c}),(m,V)=>{var g;const k=e.resolveDirective("maskito");return e.withDirectives((e.openBlock(),e.createBlock(e.unref(y.IonInput),{ref_key:"inputRef",ref:o,modelValue:a.value,"onUpdate:modelValue":V[0]||(V[0]=v=>a.value=v),"clear-input":!0,fill:t.value.fill??"solid","label-placement":t.value.labelPlacement??"stacked",type:m.type??"text",required:t.value.required,"error-text":t.value.error,autofocus:t.value.autoFocus,placeholder:((g=u.value)==null?void 0:g.placeholder)??t.value.placeholder,disabled:t.value.disabled,counter:t.value.counter,min:t.value.min,max:t.value.max,"max-length":t.value.maxLength,"min-length":t.value.minLength,pattern:t.value.pattern,onIonFocus:e.unref(d),onIonChange:e.unref(p),onIonBlur:e.unref(p)},{default:e.withCtx(()=>[e.createVNode(z,{model:t.value},null,8,["model"]),t.value.prefix?(e.openBlock(),e.createBlock(e.unref(y.IonLabel),{key:0,slot:"start"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.value.prefix),1)]),_:1})):e.createCommentVNode("",!0),t.value.suffix?(e.openBlock(),e.createBlock(e.unref(y.IonLabel),{key:1,slot:"end"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.value.suffix),1)]),_:1})):e.createCommentVNode("",!0),m.type==="password"?(e.openBlock(),e.createBlock(e.unref(y.IonInputPasswordToggle),{key:2,slot:"end"})):e.createCommentVNode("",!0)]),_:1},8,["modelValue","fill","label-placement","type","required","error-text","autofocus","placeholder","disabled","counter","min","max","max-length","min-length","pattern","onIonFocus","onIonChange","onIonBlur"])),[[k,u.value]])}}}),ue=e.defineComponent({__name:"TextInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=e.useModel(n,"modelValue"),t=e.ref(null);return r({onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},getErrors:()=>{var o,a;return((a=(o=t.value)==null?void 0:o.getErrors)==null?void 0:a.call(o))??[]}}),(o,a)=>(e.openBlock(),e.createBlock(A,{modelValue:l.value,"onUpdate:modelValue":a[0]||(a[0]=i=>l.value=i),type:"text",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","schema"]))}}),se=e.defineComponent({__name:"DateInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=e.useModel(n,"modelValue"),t=e.ref(null);return r({onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},getErrors:()=>{var o,a;return((a=(o=t.value)==null?void 0:o.getErrors)==null?void 0:a.call(o))??[]}}),(o,a)=>(e.openBlock(),e.createBlock(A,{modelValue:l.value,"onUpdate:modelValue":a[0]||(a[0]=i=>l.value=i),type:l.value.enableTime?"datetime-local":"date",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","type","schema"]))}}),ce=e.defineComponent({__name:"NumberInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=e.useModel(n,"modelValue"),t=e.ref(null);return r({onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},getErrors:()=>{var o,a;return((a=(o=t.value)==null?void 0:o.getErrors)==null?void 0:a.call(o))??[]}}),(o,a)=>(e.openBlock(),e.createBlock(A,{modelValue:l.value,"onUpdate:modelValue":a[0]||(a[0]=i=>l.value=i),type:"number",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","schema"]))}}),ie=e.defineComponent({__name:"EmailInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=e.useModel(n,"modelValue"),t=e.ref(null);return r({onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},getErrors:()=>{var o,a;return((a=(o=t.value)==null?void 0:o.getErrors)==null?void 0:a.call(o))??[]}}),(o,a)=>(e.openBlock(),e.createBlock(A,{modelValue:l.value,"onUpdate:modelValue":a[0]||(a[0]=i=>l.value=i),type:"email",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","schema"]))}}),de=e.defineComponent({__name:"PasswordInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=e.useModel(n,"modelValue"),t=e.ref(null);return r({onReset:()=>{var o;return(o=t.value)==null?void 0:o.onReset()},onValueUpdate:()=>{var o;return(o=t.value)==null?void 0:o.onValueUpdate()},getErrors:()=>{var o,a;return((a=(o=t.value)==null?void 0:o.getErrors)==null?void 0:a.call(o))??[]}}),(o,a)=>(e.openBlock(),e.createBlock(A,{modelValue:l.value,"onUpdate:modelValue":a[0]||(a[0]=i=>l.value=i),type:"password",schema:o.schema,ref_key:"inputRef",ref:t},null,8,["modelValue","schema"]))}}),fe=e.defineComponent({__name:"SelectInput",props:e.mergeModels({schema:Object,type:String,dependencyManager:Object,formId:String},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=n,t=e.useModel(n,"modelValue"),o=e.ref(null),a=e.ref(null),i=e.ref(!1),c=e.ref([]),p=e.ref(""),d=e.ref(1),s=e.computed(()=>t.value.interface??"popover"),f=e.computed(()=>t.value.optionsPlacement==="top"?"top":"bottom"),u=e.computed(()=>c.value.filter(h=>!!h.isChecked)),m=e.computed(()=>!p.value&&L(u.value)&&!i.value?t.value.placeholder??"Select an option":"");e.watch([p,()=>t.value.options],N,{immediate:!0,deep:!0}),e.watch(()=>t.value.value,Z,{immediate:!0,deep:!0});function V(){c.value.forEach(h=>q(h,c.value)),t.value.error="",p.value="",d.value=1,t.value.value=t.value.multiple?[]:""}function k(h){if(h.isChecked)return q(h,c.value);t.value.multiple?I(h,c.value):(V(),I(h,c.value),w()),p.value=""}function g(){switch(s.value){case"action-sheet":v();break;case"alert":B();break;case"popover":default:i.value=!0;break}}async function v(){if(await N(),t.value.multiple){i.value=!0;return}await(await y.actionSheetController.create({header:t.value.label||"Select an option",buttons:[...c.value.map(C=>({text:C.label,cssClass:C.isChecked?"selected-option":"",handler:()=>(k(C),!1)})),{text:"Cancel",role:"cancel"}]})).present()}async function B(){await N();const h=c.value.map(x=>({label:x.label,type:t.value.multiple?"checkbox":"radio",value:x,checked:x.isChecked}));await(await y.alertController.create({header:t.value.label||"Select an option",inputs:h,buttons:[{text:"Cancel",role:"cancel"},{text:"OK",handler:x=>{if(t.value.multiple)c.value.forEach(b=>q(b,c.value)),x.forEach(b=>{const R=c.value.find(J=>J.value===b.value);R&&I(R,c.value)});else{V();const b=c.value.find(R=>R.value===x.value);b&&I(b,c.value)}w()}}]})).present()}async function _(){if(t.value.required&&L(u.value))return"This field is required";if(t.value.validation){const h=await t.value.validation(u.value,l==null?void 0:l.schema);if(h&&h.length)return h.join()}return!0}const{onFocus:E,applyValidationState:O}=M(o,t,e.computed(()=>t.value.multiple?u.value:u.value[0]),e.computed(()=>l==null?void 0:l.schema),_);function F(h){var C;h.target===((C=o.value)==null?void 0:C.$el)&&(E(),s.value==="popover"&&(i.value=!0))}async function w(h){var x;if((x=h==null?void 0:h.relatedTarget)!=null&&x.closest(".suggestions-list"))return;i.value=!1;const C=await _();C===!0?(t.value.error="",t.value.value=t.value.multiple?u.value:u.value[0]):t.value.error=typeof C=="string"?C:"Validation failed",await O(C===!0)}async function N(){const h=[];if(l.dependencyManager&&l.formId&&t.value.dependsOn)l.dependencyManager.updateOptions(l.formId,p.value),Array.isArray(t.value.options)&&h.push(...t.value.options.filter(C=>!!C.label));else if(typeof t.value.options=="function"){const C=await t.value.options(p.value);h.push(...C.filter(x=>!!x.label))}else h.push(...oe(t.value.options??[],p.value));u.value.forEach(C=>I(C,h)),c.value=h}function Z(){const h=t.value.value;h&&(Array.isArray(h)?h.forEach(C=>I(C,c.value)):I(typeof h=="object"?h:{value:h,label:h},c.value))}return e.onMounted(()=>{if(l.dependencyManager&&l.formId&&t.value.dependsOn&&typeof l.dependencyManager.registerDependency=="function"){const h=Array.isArray(t.value.dependsOn)?t.value.dependsOn:[t.value.dependsOn];l.dependencyManager.registerDependency(l.formId,h,async(C,x)=>{if(Array.isArray(t.value.options))return t.value.options;if(typeof t.value.options=="function")try{const b=C!==void 0?C:p.value,R=await t.value.options(b,x);return Array.isArray(R)?R:[]}catch(b){return console.error(`Error loading options for ${l.formId}:`,b),[]}return[]})}}),r({onValueUpdate:w,onReset:V,getErrors:()=>t.value.error?[t.value.error]:[]}),(h,C)=>(e.openBlock(),e.createElementBlock("div",{class:"autocomplete-container",onFocusout:w,ref_key:"containerRef",ref:a},[e.createVNode(e.unref(y.IonInput),{ref_key:"inputRef",ref:o,modelValue:p.value,"onUpdate:modelValue":C[0]||(C[0]=x=>p.value=x),fill:t.value.fill??"solid","label-placement":t.value.labelPlacement??"stacked",type:n.type??"text",required:t.value.required,"error-text":t.value.error,autofocus:t.value.autoFocus,placeholder:m.value,disabled:t.value.disabled,counter:t.value.counter,onIonFocus:F,debounce:300,onClick:g},{default:e.withCtx(()=>[e.createVNode(z,{model:t.value},null,8,["model"]),t.value.multiple?(e.openBlock(),e.createBlock(e.unref(y.IonLabel),{key:0,style:{width:"fit-content"},slot:"start"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.value,(x,b)=>(e.openBlock(),e.createBlock(e.unref(y.IonChip),{key:b},{default:e.withCtx(()=>[e.createVNode(e.unref(y.IonLabel),null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(x.label),1)]),_:2},1024)]),_:2},1024))),128))]),_:1})):(e.openBlock(),e.createBlock(e.unref(y.IonLabel),{key:1,slot:"start",class:"ion-no-wrap"},{default:e.withCtx(()=>{var x;return[e.createTextVNode(e.toDisplayString(((x=u.value[0])==null?void 0:x.label)??""),1)]}),_:1})),e.createVNode(e.unref(y.IonIcon),{slot:"end",icon:e.unref(S.chevronDown)},null,8,["icon"]),u.value.length>0||p.value?(e.openBlock(),e.createBlock(e.unref(y.IonIcon),{key:2,slot:"end",icon:e.unref(S.close),onClick:V,style:{"z-index":"999999"}},null,8,["icon"])):e.createCommentVNode("",!0)]),_:1},8,["modelValue","fill","label-placement","type","required","error-text","autofocus","placeholder","disabled","counter"]),i.value&&c.value.length>0&&s.value==="popover"?(e.openBlock(),e.createBlock(e.unref(y.IonList),{key:0,class:e.normalizeClass(["suggestions-list",f.value])},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(c.value,x=>(e.openBlock(),e.createBlock(e.unref(y.IonItem),{button:"",key:x.label,onClick:b=>k(x)},{default:e.withCtx(()=>[t.value.multiple?(e.openBlock(),e.createBlock(e.unref(y.IonCheckbox),{key:0,slot:"start",checked:x.isChecked},null,8,["checked"])):e.createCommentVNode("",!0),e.createVNode(e.unref(y.IonLabel),null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(x.label),1)]),_:2},1024)]),_:2},1032,["onClick"]))),128))]),_:1},8,["class"])):e.createCommentVNode("",!0)],544))}}),K=(n,r)=>{const l=n.__vccOpts||n;for(const[t,o]of r)l[t]=o;return l},pe=K(fe,[["__scopeId","data-v-439c5bca"]]),me=e.defineComponent({__name:"TextAreaInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=n,t=e.useModel(n,"modelValue"),o=e.ref(null),a=e.ref(t.value.value),i=e.computed(()=>l.schema),{onValueUpdate:c,onFocus:p,onReset:d,getErrors:s}=M(o,t,a,i);return e.watch(()=>t.value.value,f=>a.value=f),r({onReset:d,onValueUpdate:c,getErrors:s}),(f,u)=>(e.openBlock(),e.createBlock(e.unref(y.IonTextarea),{ref_key:"inputRef",ref:o,modelValue:a.value,"onUpdate:modelValue":u[0]||(u[0]=m=>a.value=m),"clear-input":!0,fill:t.value.fill??"solid","label-placement":t.value.labelPlacement??"stacked",required:t.value.required,"error-text":t.value.error,autofocus:t.value.autoFocus,placeholder:t.value.placeholder,disabled:t.value.disabled,counter:t.value.counter,min:t.value.min,max:t.value.max,rows:t.value.rows,cols:t.value.cols,"auto-grow":t.value.autoGrow,"max-length":t.value.maxLength,"min-length":t.value.minLength,pattern:t.value.pattern,onIonFocus:e.unref(p),onIonChange:e.unref(c),onIonBlur:e.unref(c)},{default:e.withCtx(()=>[e.createVNode(z,{model:t.value},null,8,["model"])]),_:1},8,["modelValue","fill","label-placement","required","error-text","autofocus","placeholder","disabled","counter","min","max","rows","cols","auto-grow","max-length","min-length","pattern","onIonFocus","onIonChange","onIonBlur"]))}}),ve={class:"ion-margin-end",style:{"flex-grow":"1"}},he={style:{display:"flex","justify-content":"flex-end"}},ye=e.defineComponent({__name:"RepeatInput",props:e.mergeModels({schema:{},data:{},computedData:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=e.useModel(n,"modelValue"),t=e.ref([]),{dynamicRefs:o,resetForm:a,getFormErrors:i,updateFormValues:c}=$(),p=e.computed(()=>t.value.map((V,k)=>({label:`Set ${k+1}`,value:k,other:Object.entries(V).reduce((g,[v,B])=>(g[v]=B.value,g),{})})));e.watch(p,V=>{l.value.value=V},{deep:!0,immediate:!0}),e.onMounted(d);function d(){l.value.children&&t.value.push(D(l.value.children))}function s(V){t.value.splice(V,1)}function f(){a()}function u(){return i()}async function m(){await c()}return r({onValueUpdate:m,onReset:f,getErrors:u}),(V,k)=>(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.value,(g,v)=>(e.openBlock(),e.createElementBlock("div",{class:"repeat-input-wrapper",key:v},[e.createElementVNode("div",ve,[e.createVNode(e.unref(y.IonRow),null,{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Object.keys(g),B=>{var _,E,O,F,w;return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.unref(U)(g[B],V.data,V.computedData)?(e.openBlock(),e.createBlock(e.unref(y.IonCol),{key:`${v}-${B}`,size:((_=g[B].grid)==null?void 0:_.xs)??"12","size-sm":(E=g[B].grid)==null?void 0:E.sm,"size-md":(O=g[B].grid)==null?void 0:O.md,"size-lg":(F=g[B].grid)==null?void 0:F.lg,"size-xl":(w=g[B].grid)==null?void 0:w.xl,class:"ion-margin-bottom"},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(g[B].type),{modelValue:g[B],"onUpdate:modelValue":N=>g[B]=N,schema:g,"ref-key":`${v}-${B}`,ref_for:!0,ref_key:"dynamicRefs",ref:o},null,8,["modelValue","onUpdate:modelValue","schema","ref-key"]))]),_:2},1032,["size","size-sm","size-md","size-lg","size-xl"])):e.createCommentVNode("",!0)],64)}),256))]),_:2},1024)]),e.createElementVNode("div",he,[v===t.value.length-1?(e.openBlock(),e.createBlock(e.unref(y.IonButton),{key:0,onClick:d,color:"primary"},{default:e.withCtx(()=>[e.createVNode(e.unref(y.IonIcon),{slot:"icon-only",icon:e.unref(S.add)},null,8,["icon"])]),_:1})):e.createCommentVNode("",!0),t.value.length>1?(e.openBlock(),e.createBlock(e.unref(y.IonButton),{key:1,onClick:B=>s(v),color:"warning"},{default:e.withCtx(()=>[e.createVNode(e.unref(y.IonIcon),{slot:"icon-only",icon:e.unref(S.remove)},null,8,["icon"])]),_:2},1032,["onClick"])):e.createCommentVNode("",!0)])]))),128))}}),ge=K(ye,[["__scopeId","data-v-402695fe"]]),ke=e.defineComponent({__name:"CheckboxInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=n,t=e.useModel(n,"modelValue"),o=e.ref(null),a=e.ref(t.value.value),i=e.computed(()=>l.schema),c=e.computed(()=>P(t.value)),{onValueUpdate:p,onFocus:d,getErrors:s}=M(o,t,a,i);function f(){a.value=!1,t.value.error="",t.value.value=!1}return e.watch(()=>t.value.value,u=>a.value=u),r({onValueUpdate:p,onReset:f,getErrors:s}),(u,m)=>(e.openBlock(),e.createBlock(e.unref(y.IonCheckbox),{modelValue:a.value,"onUpdate:modelValue":m[0]||(m[0]=V=>a.value=V),ref_key:"inputRef",ref:o,required:t.value.required,"error-text":t.value.error,disabled:t.value.disabled,onIonFocus:e.unref(d),onIonChange:e.unref(p),onIonBlur:e.unref(p)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(c.value),1)]),_:1},8,["modelValue","required","error-text","disabled","onIonFocus","onIonChange","onIonBlur"]))}}),Ve=e.defineComponent({__name:"RadioInput",props:e.mergeModels({schema:{}},{modelValue:{type:Object,default:{}},modelModifiers:{}}),emits:["update:modelValue"],setup(n,{expose:r}){const l=n,t=e.useModel(n,"modelValue"),o=e.ref(null),a=e.ref(t.value.value),i=e.computed(()=>l.schema),c=e.ref([]),p=e.computed(()=>P(t.value)),{onValueUpdate:d,onFocus:s,getErrors:f}=M(o,t,a,i);function u(){t.value.error="",a.value=void 0,t.value.value=void 0}function m(k,g){return k.value===g.value}async function V(){typeof t.value.options=="function"?c.value=await t.value.options():c.value=t.value.options}return e.watch(()=>t.value.value,k=>a.value=k),r({onValueUpdate:d,onReset:u,getErrors:f}),e.onMounted(V),(k,g)=>(e.openBlock(),e.createBlock(e.unref(y.IonRadioGroup),{modelValue:a.value,"onUpdate:modelValue":g[0]||(g[0]=v=>a.value=v),ref_key:"inputRef",ref:o,required:t.value.required,"helper-text":p.value,"error-text":t.value.error,disabled:t.value.disabled,compareWith:m,"allow-empty-selection":!t.value.required,onIonFocus:e.unref(s),onIonChange:e.unref(d),onIonBlur:e.unref(d)},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(c.value,v=>(e.openBlock(),e.createBlock(e.unref(y.IonRadio),{key:v.value,value:v,disabled:t.value.disabled,"label-placement":"end",justify:"start"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.label),1)]),_:2},1032,["value","disabled"]))),128))]),_:1},8,["modelValue","required","helper-text","error-text","disabled","allow-empty-selection","onIonFocus","onIonChange","onIonBlur"]))}}),W={install(n){n.component("VForm",le),n.component("TextInput",ue),n.component("DateInput",se),n.component("NumberInput",ce),n.component("EmailInput",ie),n.component("PasswordInput",de),n.component("SelectInput",pe),n.component("TextAreaInput",me),n.component("RepeatInput",ge),n.component("CheckboxInput",ke),n.component("RadioInput",Ve),n.directive("maskito",Q.maskito)}};exports.VForm=W;exports.default=W;exports.useDataTransformation=G;exports.useDependentOptions=H;exports.useFormValidation=$;exports.useInputValidation=M;
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|