sveltekit-superforms - npm Package Compare versions

Comparing version 0.4.0 to 0.5.0

dist/client/index.d.ts

@@ -47,3 +47,3 @@ import { type MaybePromise, type SubmitFunction } from '$app/forms';
     validators?: Validators<T>;
-    defaultValidator?: 'keep' | 'clear';
+    defaultValidator?: 'clear' | 'keep';
     clearOnSubmit?: 'errors' | 'message' | 'errors-and-message' | 'none';
@@ -53,2 +53,7 @@ delayMs?: number;
     multipleSubmits?: 'prevent' | 'allow' | 'abort';
+    flashMessage?: (errorResult: {
+        type: 'error';
+        status: number;
+        error: App.Error;
+    }) => App.PageData['flash'];
 };
@@ -55,0 +60,0 @@ export type EnhancedForm<T extends AnyZodObject> = {

dist/client/index.js

@@ -34,3 +34,3 @@ import { enhance, applyAction } from '$app/forms';
     validators: undefined,
-    defaultValidator: 'keep',
+    defaultValidator: 'clear',
     clearOnSubmit: 'errors-and-message',
@@ -125,2 +125,3 @@ delayMs: 500,
 }
+let flashLibrary;
 /**
@@ -138,2 +139,9 @@ * Initializes a SvelteKit form, for convenient handling of values, errors and sumbitting data.
     options = { ...defaultFormOptions, ...options };
+    if (options.flashMessage && !flashLibrary) {
+        import('sveltekit-flash-message/client')
+            .then((flash) => (flashLibrary = flash))
+            .catch(function () {
+            /**/
+        });
+    }
     function emptyForm() {
@@ -148,5 +156,7 @@ return {
     }
+    // Detect if a form is posted (without JavaScript).
     const actionForm = get(page).form;
-    if (options.applyAction && actionForm && 'form' in actionForm) {
-        if (!('success' in actionForm.form) ||
+    if (options.applyAction && actionForm) {
+        if (!actionForm.form ||
+            !('success' in actionForm.form) ||
             typeof actionForm.form.success !== 'boolean') {
@@ -449,12 +459,15 @@ throw new Error("ActionData didn't return a Validation object. Make sure you return { form } from form actions.");
             }
+            if (flashLibrary &&
+                options.flashMessage &&
+                (options.clearOnSubmit == 'errors-and-message' ||
+                    options.clearOnSubmit == 'message')) {
+                try {
+                    flashLibrary.getFlash(page).set(undefined);
+                }
+                catch {
+                    //
+                }
+            }
             //d('Submitting');
             form.submitting();
-            // TODO: flash message
-            /*
-                  try {
-                      getFlash(page).set(undefined);
-                  } catch (_) {
-                      //
-                  }
-                  */
             switch (options.dataType) {
@@ -484,2 +497,4 @@ case 'json':
             if (!cancelled) {
+                const status = Math.floor(result.status || 500);
+                let errorMessage = undefined;
                 if (result.type !== 'error') {
@@ -507,14 +522,15 @@ if (result.type === 'success' && options.invalidateAll) {
                                 type: 'failure',
-                                status: Math.floor(result.status || 500)
+                                status
                             });
                         }
                     }
+                    // Check if the error message should be replaced
                     if (options.onError == 'set-message') {
-                        const errorMessage = result.error.message;
-                        message.set(errorMessage
-                            ? String(errorMessage)
-                            : `${result.status || 500} Internal Server Error`);
+                        message.set((errorMessage =
+                            result.error.message !== undefined
+                                ? result.error.message
+                                : `Error: ${status}`));
                     }
                     else if (typeof options.onError === 'string') {
-                        message.set(options.onError);
+                        message.set((errorMessage = options.onError));
                     }
@@ -525,23 +541,24 @@ else if (options.onError) {
                 }
-                /*
-                        // TODO: Flash message handling
-                        function errorMessage(result: ActionResult): string | undefined {
-                            if (result.type != 'error') return undefined;
-                            return result.error;
+                if (flashLibrary && options.flashMessage) {
+                    if (result.type == 'error') {
+                        if (errorMessage &&
+                            result.error &&
+                            typeof result.error === 'object' &&
+                            'message' in result.error) {
+                            result.error.message = errorMessage;
                         }
-        
-                        const error = errorMessage(result);
-                        if (error) {
-                            getFlash(page).set({
-                                status: 'error',
-                                text: error
-                            });
-                        } else {
-                            try {
-                                await updateFlash(page);
-                            } catch (_) {
-                                //
-                            }
+                        flashLibrary.getFlash(page).set(options.flashMessage({
+                            ...result,
+                            status: result.status ?? status
+                        }));
+                    }
+                    else {
+                        try {
+                            await flashLibrary.updateFlash(page);
                         }
-                        */
+                        catch {
+                            //
+                        }
+                    }
+                }
             }
@@ -548,0 +565,0 @@ form.completed(cancelled);

package.json

 {
   "name": "sveltekit-superforms",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "author": "Andreas Söderlund <[e-mail]> (https://blog.encodeart.dev)",
@@ -64,6 +64,6 @@ "description": "Supercharge your SvelteKit forms with this powerhouse of a library!",
     "@sveltejs/adapter-auto": "^2.0.0",
-    "@sveltejs/kit": "^1.7.2",
-    "@sveltejs/package": "^2.0.1",
-    "@typescript-eslint/eslint-plugin": "^5.52.0",
-    "@typescript-eslint/parser": "^5.52.0",
+    "@sveltejs/kit": "^1.8.3",
+    "@sveltejs/package": "^2.0.2",
+    "@typescript-eslint/eslint-plugin": "^5.53.0",
+    "@typescript-eslint/parser": "^5.53.0",
     "devalue": "^4.3.0",
@@ -80,5 +80,6 @@ "eslint": "^8.34.0",
     "svelte-check": "^3.0.3",
+    "sveltekit-flash-message": "^0.11.3",
     "tslib": "^2.5.0",
     "typescript": "^4.9.5",
-    "vite": "^4.1.3",
+    "vite": "^4.1.4",
     "vitest": "^0.25.8",
@@ -85,0 +86,0 @@ "zod": "^3.20.6"

README.md

@@ -341,6 +341,6 @@ # sveltekit-superforms 💥
 ```ts
-defaultValidator: 'keep' | 'clear' = 'keep'
+defaultValidator: 'keep' | 'clear' = 'clear'
 ```
 
-If set to `keep`, validation errors will be kept displayed until the form submits (see next option). If `clear`, the field error will be removed when the value is modified.
+The default value `clear`, will remove the error when that field value is modified. If set to `keep`, validation errors will be kept displayed until the form submits (unless you change it, see next option).
 
@@ -394,2 +394,12 @@ ## Submit behavior
 
+## sveltekit-flash-message support
+
+The sister library to `sveltekit-superforms` is called [sveltekit-flash-message](https://github.com/ciscoheat/sveltekit-flash-message), a useful addon since the `message` property of `Validation<T>` doesn't persist when redirecting to a different page. If you have the library installed, you only need to specify this option to make things work:
+
+```ts
+flashMessage: (errorResult: ActionResult<'error'>) => App.PageData['flash'];
+```
+
+The flash message works automatically for every case except errors, so this is needed to transform the `ActionResult` `error` into your flash message type.
+
 ## The last one: Breaking free from FormData
@@ -747,3 +757,3 @@
   dataType?: 'form' | 'formdata' | 'json';
-  defaultValidator?: 'keep' | 'clear';
+  defaultValidator?: 'clear' | 'keep';
   delayMs?: number;
@@ -765,3 +775,3 @@ errorSelector?: string;
     update: async (
-      result: ActionResult<'success', 'failure'>,
+      result: ActionResult<'success' | 'failure'>,
       untaint?: boolean
@@ -813,3 +823,3 @@ );
   async update: (
-    result: ActionResult<'success', 'failure'>,
+    result: ActionResult<'success' | 'failure'>,
     untaint?: boolean
@@ -816,0 +826,0 @@ )

New alerts

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

Fixed alerts

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

79361

increased by1.95%

Lines of code

1115

increased by2.11%

Number of lines in readme file

860

increased by1.18%

Worsened metrics

Dev dependency count

22

increased by4.76%

No dependency changes