@teamnovu/nuxt-statamic-formbuilder 1.0.0 → 1.2.0

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.16.0"
   },
-  "version": "1.0.0",
+  "version": "1.2.0",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/app/components/StatamicFormBuilder.d.vue.ts

@@ -5,6 +5,7 @@ type __VLS_Props = {
     serverUrl?: string;
     styleConfig?: FormBuilderStyleConfig;
     submitter?: FormBuilderSubmitter;
+    resetDelay?: number | false;
     /**
      * Override the FormBuilder component (defaults to globally registered `FormBuilder`
      * from a UI layer such as `@teamnovu/nuxt-statamic-formbuilder-nuxt-ui`).

package/dist/runtime/app/components/StatamicFormBuilder.vue

@@ -7,6 +7,7 @@
     :texts="texts"
     :style-config="styleConfig"
     :submitter="submitter"
+    :reset-delay="resetDelay"
   >
     <template
       v-for="(_, name) in $slots"
@@ -30,6 +31,7 @@ const props = defineProps({
   serverUrl: { type: String, required: false },
   styleConfig: { type: Object, required: false },
   submitter: { type: Function, required: false },
+  resetDelay: { type: [Number, Boolean], required: false },
   formComponent: { type: null, required: false }
 });
 const runtimeConfig = useRuntimeConfig();

package/dist/runtime/app/components/StatamicFormBuilder.vue.d.ts

@@ -5,6 +5,7 @@ type __VLS_Props = {
     serverUrl?: string;
     styleConfig?: FormBuilderStyleConfig;
     submitter?: FormBuilderSubmitter;
+    resetDelay?: number | false;
     /**
      * Override the FormBuilder component (defaults to globally registered `FormBuilder`
      * from a UI layer such as `@teamnovu/nuxt-statamic-formbuilder-nuxt-ui`).

package/dist/runtime/app/composables/useFormBuilder.js

@@ -18,6 +18,8 @@ function setInitialState(fields) {
       acc[field.handle] = isMultiValueField(field) ? [] : null;
     } else if (isMultiValueField(field)) {
       acc[field.handle] = [];
+    } else if (field.type === "input_switch") {
+      acc[field.handle] = field.config.default === true;
     } else {
       acc[field.handle] = void 0;
     }

package/dist/runtime/app/composables/useFormValidation.js

@@ -19,6 +19,9 @@ export function useFormValidation(fieldsInput, formRules, _state) {
       if (name === "required") {
         return { ...parsedRules, required: true };
       }
+      if (name === "accepted") {
+        return { ...parsedRules, accepted: true };
+      }
       if (name === "min" && value) {
         return { ...parsedRules, min: Number(value) };
       }
@@ -60,7 +63,7 @@ export function useFormValidation(fieldsInput, formRules, _state) {
   const buildFieldSchema = (field) => {
     const rules = getRulesForField(field);
     const normalizedType = normalizeFieldType(field, rules);
-    const isRequired = rules.required === true;
+    const isRequired = rules.required === true || rules.accepted === true;
     const buildStringSchema = () => {
       let stringSchema2 = v.union([
         v.pipe(v.string()),
@@ -126,7 +129,7 @@ export function useFormValidation(fieldsInput, formRules, _state) {
       return arraySchema();
     }
     if (normalizedType === "boolean") {
-      const base = v.boolean();
+      const base = rules.accepted === true ? v.pipe(v.boolean(), v.check((value) => value === true, t("form.user_feedback.field_validation.required"))) : v.boolean();
       return isRequired ? base : v.optional(base);
     }
     if (normalizedType === "file" && field.type === "input_file_upload") {

package/dist/runtime/fieldProps.d.ts

@@ -30,8 +30,9 @@ export type FormFieldRadioButtonsProps<TStyle extends FormBuilderStyleConfig = F
 export type FormFieldSwitchProps<TStyle extends FormBuilderStyleConfig = FormBuilderStyleConfig> = FormFieldComponentProps<InputSwitchFieldConfig, TStyle>;
 export type FormFieldFileUploadProps<TStyle extends FormBuilderStyleConfig = FormBuilderStyleConfig> = FormFieldComponentProps<InputFileUploadFieldConfig, TStyle>;
 /** Display-only field — no input binding required by the renderer. */
-export type FormFieldDisplayTextProps = {
+export type FormFieldDisplayTextProps<TStyle extends FormBuilderStyleConfig = FormBuilderStyleConfig> = {
     config?: DisplayTextFieldConfig;
+    styleConfig?: TStyle;
 };
 /** Shared wrapper props used by UI layout shells (label / hint / help). */
 export type FormFieldShellProps<TStyle extends FormBuilderStyleConfig = FormBuilderStyleConfig> = {

package/dist/runtime/locales/de.json

@@ -24,6 +24,15 @@
       "success": {
         "title": "Erfolgreich"
       }
+    },
+    "ui": {
+      "date": {
+        "select_date": "Datum auswählen",
+        "select_date_range": "Datumsbereich auswählen"
+      },
+      "search": {
+        "placeholder": "Filtern…"
+      }
     }
   }
 }

package/dist/runtime/locales/en.json

@@ -24,6 +24,15 @@
       "success": {
         "title": "Successful"
       }
+    },
+    "ui": {
+      "date": {
+        "select_date": "Select a date",
+        "select_date_range": "Select a date range"
+      },
+      "search": {
+        "placeholder": "Filter..."
+      }
     }
   }
 }

package/dist/runtime/locales/fr.json

@@ -24,6 +24,15 @@
       "success": {
         "title": "Succès"
       }
+    },
+    "ui": {
+      "date": {
+        "select_date": "Sélectionner une date",
+        "select_date_range": "Sélectionner une plage de dates"
+      },
+      "search": {
+        "placeholder": "Filtrer…"
+      }
     }
   }
 }

package/dist/runtime/locales/it.json

@@ -24,6 +24,15 @@
       "success": {
         "title": "Successo"
       }
+    },
+    "ui": {
+      "date": {
+        "select_date": "Seleziona una data",
+        "select_date_range": "Seleziona un intervallo di date"
+      },
+      "search": {
+        "placeholder": "Filtra…"
+      }
     }
   }
 }

package/dist/runtime/types.d.ts

@@ -71,6 +71,7 @@ export declare function isFileUploadField(field: FormBuilderField): field is Ext
 export declare function isMultiValueField(field: FormBuilderField): boolean;
 export type InputRules = {
     required?: boolean;
+    accepted?: boolean;
     min?: number;
     max?: number;
     maxlength?: number;

package/dist/runtime/utils/submitStatamicForm.js

@@ -24,23 +24,25 @@ export async function submitStatamicForm(args) {
   }
   const formData = new FormData();
   formData.append("_site", locale);
+  const fields = flattenFields(form);
   Object.entries(state).forEach(([key, value]) => {
-    if (value?.[0]?.size || value?.[1]?.size) {
-      for (let x = 0; x < value.length; x++) {
-        formData.append(`${key}[${x}]`, value[x]);
+    if (Array.isArray(value)) {
+      const field = fields.find((candidate) => candidate.handle === key);
+      if (field?.type === "input_radio_buttons") {
+        if (value[0] != null) {
+          formData.append(key, value[0]);
+        }
+      } else {
+        for (let x = 0; x < value.length; x++) {
+          formData.append(`${key}[${x}]`, value[x]);
+        }
       }
+    } else if (typeof value === "boolean") {
+      formData.append(key, value ? "1" : "0");
     } else if (value != null) {
       formData.append(key, value);
     }
   });
-  flattenFields(form).filter((field) => ["checkboxes", "input_checkboxes"].includes(field.type)).forEach((field) => {
-    const copy = [...formData.entries().filter(([key]) => key?.startsWith("["))];
-    copy.forEach(([key, value]) => {
-      formData.delete(key);
-      const newKey = key.replace(`[${field.handle}]`, field.handle);
-      formData.append(newKey, value);
-    });
-  });
   const response = await fetch(
     `${serverUrl}/!/forms/${form.handle}`,
     {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamnovu/nuxt-statamic-formbuilder",
-  "version": "1.0.0",
+  "version": "1.2.0",
   "description": "Headless Nuxt form builder with Statamic submit adapter",
   "license": "MIT",
   "homepage": "https://github.com/teamnovu/nuxt-statamic-formbuilder#readme",