@wix/headless-forms 0.0.2 → 0.0.4

package/dist/services/form-service.js

@@ -1,137 +1,92 @@
 import { forms } from '@wix/forms';
 import { defineService, implementService } from '@wix/services-definitions';
 import { SignalsServiceDefinition, } from '@wix/services-definitions/core-services/signals';
-export const FormServiceDefinition = defineService('formService');
 /**
- * Form service implementation that supports both pre-loaded form data and lazy loading.
- *
- * This service provides reactive state management for form data, loading states, errors, and submission responses.
- * It automatically handles form loading when only a formId is provided, making it suitable for both SSR and client-side scenarios.
- *
- * ## Service Behavior
- *
- * **Configuration Resolution:**
- * - If `form` is provided: Uses pre-loaded form data immediately (SSR/SSG pattern)
- * - If only `formId` is provided: Loads form data asynchronously from Wix Forms API
- * - If both are provided: Uses pre-loaded `form` data and ignores `formId`
- * - If neither is provided: Throws an error during service initialization
+ * Service definition for the Form service.
+ * This defines the contract that the FormService must implement.
  *
- * **Loading States:**
- * - `isLoading`: `true` when loading form data via `formId`, `false` otherwise
- * - `form`: `null` initially when using `formId`, populated after successful load
- * - `error`: `null` initially, populated if form loading fails
- * - `submitResponse`: `{ type: 'idle' }` initially, updated during form submission
- *
- * **Error Handling:**
- * - Network errors during form loading are caught and stored in the `error` signal
- * - "Form not found" errors are handled when the formId doesn't exist
- * - All errors are logged to console for debugging
+ * @constant
+ */
+export const FormServiceDefinition = defineService('formService');
+/**
+ * Implementation of the Form service that manages reactive form data.
+ * This service provides signals for form data, loading state, and error handling.
+ * It supports both pre-loaded form data and lazy loading with form IDs.
  *
  * @example
  * ```tsx
- * // Service automatically handles loading states
- * const service = useService(FormServiceDefinition);
+ * // Pre-loaded form data (SSR/SSG)
+ * const formService = FormService.withConfig({ form: formData });
  *
- * // Check loading state
- * const isLoading = service.isLoading.get();
- *
- * // Access form data (null during loading)
- * const form = service.form.get();
- *
- * // Check for errors
- * const error = service.error.get();
+ * // Lazy loading with form ID (client-side)
+ * const formService = FormService.withConfig({ formId: 'form-123' });
  * ```
- *
  */
 export const FormService = implementService.withConfig()(FormServiceDefinition, ({ getService, config }) => {
     const signalsService = getService(SignalsServiceDefinition);
-    const { form: initialForm, formId } = config;
-    // Validation: ensure either form or formId is provided
-    if (!initialForm && !formId) {
-        throw new Error('FormServiceConfig must provide either "form" or "formId"');
+    const isLoadingSignal = signalsService.signal(false);
+    const errorSignal = signalsService.signal(null);
+    const hasSchema = 'form' in config;
+    const formSignal = signalsService.signal(hasSchema ? config.form : null);
+    if (!hasSchema) {
+        loadForm(config.formId);
     }
-    const form = signalsService.signal(initialForm || null);
-    const isLoading = signalsService.signal(!!formId && !initialForm);
-    const error = signalsService.signal(null);
-    const submitResponse = signalsService.signal({ type: 'idle' });
-    // Client-side form loading for formId case
-    if (formId && !initialForm) {
-        // Load form asynchronously
-        forms
-            .getForm(formId)
-            .then((loadedForm) => {
-            if (loadedForm) {
-                form.set(loadedForm);
-                isLoading.set(false);
+    async function loadForm(id) {
+        isLoadingSignal.set(true);
+        errorSignal.set(null);
+        try {
+            const result = await fetchForm(id);
+            if (result) {
+                formSignal.set(result);
             }
             else {
-                error.set('Form not found');
-                isLoading.set(false);
+                errorSignal.set('Form not found');
             }
-        })
-            .catch((err) => {
-            console.error('Failed to load form:', err);
-            error.set('Failed to load form');
-            isLoading.set(false);
-        });
+        }
+        catch (err) {
+            errorSignal.set('Failed to load form');
+            throw err;
+        }
+        finally {
+            isLoadingSignal.set(false);
+        }
     }
-    return { form, isLoading, error, submitResponse };
+    return {
+        formSignal: formSignal,
+        isLoadingSignal: isLoadingSignal,
+        errorSignal: errorSignal,
+    };
 });
+async function fetchForm(id) {
+    try {
+        const result = await forms.getForm(id);
+        if (!result) {
+            throw new Error(`Form ${id} not found`);
+        }
+        return result;
+    }
+    catch (err) {
+        console.error('Failed to load form:', id, err);
+        throw err;
+    }
+}
 /**
- * Loads form service configuration by form ID.
- *
- * This function fetches form data from the Wix Forms API and returns a configuration
- * object that can be used to initialize the Form service. This is the recommended approach
- * for server-side rendering (SSR) and static site generation (SSG) scenarios.
- *
- * @param {string} id - The unique identifier of the form to load
- * @returns {Promise<FormServiceConfigResult>} A promise that resolves to either:
- *   - `{ type: 'success', config: FormServiceConfig }` if the form is found and loaded successfully
- *   - `{ type: 'notFound' }` if the form doesn't exist or an error occurs during loading
- *
- * @example
- * ```tsx
- * import { loadFormServiceConfig } from '@wix/headless-forms/services';
+ * Loads form service configuration from the Wix Forms API for SSR initialization.
+ * This function is designed to be used during Server-Side Rendering (SSR) to preload
+ * a specific form by ID that will be used to configure the FormService.
  *
- * // Server-side loading (Astro/SSR) - pre-loads form data
- * const formServiceConfigResult = await loadFormServiceConfig('form-id');
- *
- * if (formServiceConfigResult.type === 'notFound') {
- *   return Astro.redirect('/404');
- * }
- *
- * // Use pre-loaded form data
- * const formServiceConfig = formServiceConfigResult.config;
- * <Form.Root formServiceConfig={formServiceConfig} />
- * ```
+ * @param {string} formId - The unique identifier of the form to load
+ * @returns {Promise<FormServiceConfig>} Configuration object with pre-loaded form data
+ * @throws {Error} When the form cannot be loaded
  *
  * @example
  * ```tsx
- * // Alternative: Client-side loading with formId
- * // No need to pre-load, service handles loading automatically
- * <Form.Root formServiceConfig={{ formId: 'form-id' }}>
- *   <Form.Loading>
- *     {({ isLoading }) => isLoading ? <div>Loading...</div> : null}
- *   </Form.Loading>
- *   <Form.Fields fieldMap={FIELD_MAP} />
- * </Form.Root>
+ * // In your SSR/SSG setup
+ * const formConfig = await loadFormServiceConfig('form-123');
+ * const formService = FormService.withConfig(formConfig);
  * ```
- *
- * @throws {Error} Logs errors to console but returns 'notFound' result instead of throwing
  */
-export async function loadFormServiceConfig(id) {
-    try {
-        const form = await forms.getForm(id);
-        if (!form) {
-            return { type: 'notFound' };
-        }
-        return {
-            type: 'success',
-            config: { form },
-        };
-    }
-    catch (error) {
-        console.error('Failed to load form:', error);
-    }
-    return { type: 'notFound' };
+export async function loadFormServiceConfig(formId) {
+    const form = await fetchForm(formId);
+    return { form };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-forms",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "type": "module",
   "scripts": {
     "build": "npm run build:esm && npm run build:cjs",