@steveesamson/microform 0.0.10 → 1.0.0

package/dist/form-validators.js

@@ -1,5 +1,5 @@
 import { get } from "svelte/store";
-import { makeName } from "./utils.js";
+import { makeName, isValidFileSize } from "./utils.js";
 const regexes = {
     number: /^[-+]?[0-9]+(\.[0-9]+)?$/g,
     alpha: /^[A-Z\s]+$/gi,
@@ -9,175 +9,148 @@ const regexes = {
     url: /^(?:(?:https?|ftp):\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,}))\.?)(?::\d{2,5})?(?:[/?#]\S*)?$/i,
     ip: /^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/g,
 };
-const getErrorText = (inputName, errorType, extra = '') => {
-    inputName = makeName(inputName);
-    switch (errorType.toLowerCase()) {
-        case 'required':
-            return inputName + ' is mandatory.';
-        case 'match':
-            return inputName + ' does not match ' + makeName(extra);
-        case 'func':
-            return inputName + extra;
-        case 'captcha':
-            return inputName + ' does not match the image.';
-        case 'email':
-            return inputName + ' should be a valid email.';
-        case 'url':
-            return inputName + ' should be a valid URL.';
-        case 'cron':
-            return inputName + ' should be a valid cron expression.';
-        case 'ip':
-            return inputName + ' should be a valid IP.';
-        case 'integer':
-            return inputName + ' must be an integer.';
-        case 'number':
-            return inputName + ' should be a number.';
-        case 'alpha':
-            return inputName + ' should be a string of alphabets.';
-        case 'alphanum':
-            return inputName + ' should be a string of alphanumerics starting with alphabets.';
-        case 'min-length':
-            return inputName + ' must be at least ' + extra + ' characters long.';
-        case 'max-length':
-            return inputName + ' must not be more than ' + extra + ' characters long.';
-        case 'length':
-            return inputName + ' must be exactly ' + extra + ' characters long.';
-        // case 'length':
-        //     return inputName + ' must not be greater than ' + extra + '.';
-        default:
-            return errorType;
-    }
-};
-const checkFileSize = (node, maxFileSizeInMB) => {
-    if (!node)
-        return "";
-    const { files } = node;
-    if (!files)
-        return `${node.name} is required`;
-    const max = maxFileSizeInMB * 1024 * 1024;
-    for (const file of files) {
-        if (file.size > max) {
-            return `File '${file.name}' is larger the ${maxFileSizeInMB}MB.`;
+export const IS_REQUIRED = "required";
+export const IS_EMAIL = "email";
+export const IS_URL = "url";
+export const IS_IP = "ip";
+export const IS_INTEGER = "integer";
+export const IS_NUMBER = "number";
+export const IS_ALPHA = "alpha";
+export const IS_ALPHANUM = "alphanum";
+export const IS_MIN_LEN = "minlen";
+export const IS_MAX_LEN = "maxlen";
+export const IS_LEN = "len";
+export const IS_MIN = "min";
+export const IS_MAX = "max";
+export const IT_MATCHES = "match";
+export const IS_FILE_SIZE_MB = 'file-size-mb';
+const getDefaultValidators = () => {
+    const validators = {
+        [IS_REQUIRED]: ({ label, value }) => {
+            if (!value || (Array.isArray(value) && !value.length)) {
+                return `${label} is mandatory.`;
+            }
+            return "";
+        },
+        [IS_EMAIL]: ({ value, label }) => {
+            return (!!value && !value.match(regexes['email'])) ? `${label} should be a valid email.` : '';
+        },
+        [IS_URL]: ({ value, label }) => {
+            return !!value && !value.match(regexes['url']) ? `${label} should be a valid URL.` : "";
+        },
+        [IS_IP]: ({ value, label }) => {
+            return !!value && !value.match(regexes['ip']) ? `${label} should be a valid IP.` : "";
+        },
+        [IS_INTEGER]: ({ value, label }) => {
+            return !!value && !value.match(regexes['integer']) ? `${label} must be an integer number.` : "";
+        },
+        [IS_NUMBER]: ({ value, label }) => {
+            return !!value && !value.match(regexes['number']) ? `${label} must be a number.` : "";
+        },
+        [IS_ALPHA]: ({ value, label }) => {
+            return !!value && !value.match(regexes['alpha']) ? `${label} should be a string of alphabets.` : "";
+        },
+        [IS_ALPHANUM]: ({ value, label }) => {
+            return !!value && !value.match(regexes['alphanum']) ? `${label} should be a string of alphanumerics starting with alphabets.` : "";
+        },
+        [IS_MIN_LEN]: ({ value, label, parts }) => {
+            if (!!value) {
+                if (!parts || parts.length < 2) {
+                    return `${label}: min-length validation requires minimum length.`;
+                }
+                const extra = parts[1].trim();
+                return value.length >= parseInt(parts[1], 10) ? "" : `${label} must be at least ${extra} characters long.`;
+            }
+            return "";
+        },
+        [IS_MAX_LEN]: ({ value, label, parts }) => {
+            if (!!value) {
+                if (!parts || parts.length < 2) {
+                    return `${label}: max-length validation requires maximum length.`;
+                }
+                const extra = parts[1].trim();
+                return value.length <= parseInt(parts[1], 10) ? "" : `${label} must be at most ${extra} characters long.`;
+            }
+            return "";
+        },
+        [IS_LEN]: ({ value, label, parts }) => {
+            if (!!value) {
+                if (!parts || parts.length < 2) {
+                    return `${label}: length validation requires length.`;
+                }
+                const extra = parts[1].trim();
+                return value.length === parseInt(parts[1], 10) ? "" : `${label} must exactly be ${extra} characters long.`;
+            }
+            return "";
+        },
+        [IS_MAX]: ({ value, label, parts }) => {
+            if (!!value) {
+                if (!parts || parts.length < 2) {
+                    return `${label}: max validation requires the maximum value.`;
+                }
+                const extra = parts[1].trim();
+                return parseInt(value, 10) <= parseInt(parts[1], 10) ? "" : `${label} must not be greater than ${extra}.`;
+            }
+            return "";
+        },
+        [IS_MIN]: ({ value, label, parts }) => {
+            if (!!value) {
+                if (!parts || parts.length < 2) {
+                    return `${label}: min validation requires the minimum value.`;
+                }
+                const extra = parts[1].trim();
+                return parseInt(value, 10) >= parseInt(parts[1], 10) ? "" : `${label} must not be less than ${extra}.`;
+            }
+            return "";
+        },
+        [IT_MATCHES]: ({ values, value, label, parts }) => {
+            if (value) {
+                if (!parts || parts.length < 2) {
+                    return `${label}: match validation requires id of field to match`;
+                }
+                const partyName = parts[1].trim();
+                const partyValue = values[partyName];
+                return value === partyValue ? "" : `${label} does not match ${makeName(partyName)}.`;
+            }
+            return "";
+        },
+        [IS_FILE_SIZE_MB]: ({ value, node, label, parts }) => {
+            if (!!value) {
+                if (!parts || parts.length < 2) {
+                    return `${label}: max file size in MB validation requires maximum file size of mb value.`;
+                    ;
+                }
+                const extra = parts[1].trim();
+                return isValidFileSize(node, parseInt(extra, 10));
+            }
+            return "";
         }
-    }
-    return "";
+    };
+    return validators;
 };
-export const useValidator = (errors, values) => {
+export const useValidator = (errors, values, validators = getDefaultValidators()) => {
     const setError = (name, error) => {
         errors.update((prev) => {
             return { ...prev, [name]: error };
         });
     };
-    return async ({ name, value, validations = '', node = undefined }) => {
-        let error = '';
-        if (validations) {
-            const inputName = name, _validations = validations.split('|');
-            for (let i = 0; i < _validations.length; ++i) {
-                const validation = _validations[i], typeDetails = validation.split(':'), type = typeDetails[0].trim();
-                let partyName, partyValue;
-                switch (type.toLowerCase()) {
-                    case 'required':
-                        error = !value || !value.length ? getErrorText(inputName, 'required') : '';
-                        setError(name, error);
-                        break;
-                    case 'match':
-                        error = typeDetails.length < 2 ? inputName + ': match validation requires party target' : '';
-                        setError(name, error);
-                        if (error)
-                            break;
-                        partyName = typeDetails[1].trim();
-                        partyValue = get(values)[partyName] || '';
-                        error = !value || value !== partyValue ? getErrorText(inputName, 'match', typeDetails[1]) : '';
-                        setError(name, error);
-                        break;
-                    case 'email':
-                        error = !value || !value.match(regexes['email']) ? getErrorText(inputName, 'email') : '';
-                        setError(name, error);
-                        break;
-                    case 'url':
-                        error = !value || !value.match(regexes['url']) ? getErrorText(inputName, 'url') : '';
-                        setError(name, error);
+    return {
+        validate: async ({ name, value, validations = [], node = undefined }) => {
+            if (validations.length) {
+                const _validations = validations.includes('required') ? ['required', ...validations.filter((val) => val !== 'required')] : [...validations];
+                for (let i = 0; i < _validations.length; ++i) {
+                    const validation = _validations[i], parts = validation.split(':'), type = parts[0].trim();
+                    const validator = validators[type];
+                    if (!validator)
+                        return;
+                    const error = validator({ name, label: makeName(name), value, values: get(values), node, parts });
+                    setError(name, error ? error : '');
+                    if (error) {
                         break;
-                    case 'ip':
-                        error = !value || !value.match(regexes['ip']) ? getErrorText(inputName, 'ip') : '';
-                        setError(name, error);
-                        break;
-                    case 'integer':
-                        error = !value || !value.match(regexes['integer']) ? getErrorText(inputName, 'integer') : '';
-                        setError(name, error);
-                        break;
-                    case 'number':
-                        error = !value || !value.match(regexes['number']) ? getErrorText(inputName, 'number') : '';
-                        setError(name, error);
-                        break;
-                    case 'alpha':
-                        error = !value || !value.match(regexes['alpha']) ? getErrorText(inputName, 'alpha') : '';
-                        setError(name, error);
-                        break;
-                    case 'alphanum':
-                        error =
-                            !value || !value.match(regexes['alphanum']) ? getErrorText(inputName, 'alphanum') : '';
-                        setError(name, error);
-                        break;
-                    case 'min-length':
-                        error = typeDetails.length < 2 ? inputName + ': min-length validation requires width' : '';
-                        setError(name, error);
-                        if (error)
-                            break;
-                        error =
-                            !value || value.length < parseInt(typeDetails[1], 10)
-                                ? getErrorText(inputName, 'min-length', typeDetails[1])
-                                : '';
-                        setError(name, error);
-                        break;
-                    case 'max-length':
-                        error = typeDetails.length < 2 ? inputName + ': max-length validation requires width' : '';
-                        setError(name, error);
-                        if (error)
-                            break;
-                        error =
-                            !value || value.length > parseInt(typeDetails[1], 10)
-                                ? getErrorText(inputName, 'max-length', typeDetails[1])
-                                : '';
-                        setError(name, error);
-                        break;
-                    case 'length':
-                        error = typeDetails.length < 2 ? inputName + ': length validation requires width' : '';
-                        setError(name, error);
-                        if (error)
-                            break;
-                        error =
-                            !value || value.length !== parseInt(typeDetails[1], 10)
-                                ? getErrorText(inputName, 'length', typeDetails[1])
-                                : '';
-                        setError(name, error);
-                        break;
-                    case 'max':
-                        error = typeDetails.length < 2 ? inputName + ': max validation requires max value' : '';
-                        setError(name, error);
-                        if (error)
-                            break;
-                        error =
-                            !value || parseInt(value, 10) !== parseInt(typeDetails[1], 10)
-                                ? getErrorText(inputName, 'max', typeDetails[1])
-                                : '';
-                        setError(name, error);
-                        break;
-                    case 'max-file-size-mb':
-                        error = typeDetails.length < 2 ? inputName + ': max file size in MB validation requires max-file-size-mb value' : '';
-                        setError(name, error);
-                        if (error)
-                            break;
-                        error = checkFileSize(node, parseInt(typeDetails[1], 10));
-                        setError(name, error);
-                        break;
-                    default:
-                }
-                if (error) {
-                    setError(name, error);
-                    break;
+                    }
                 }
-            } //end
-        }
+            }
+        },
+        validators
     };
 };

package/dist/index.d.ts

@@ -1,4 +1,3 @@
-export * from "./types.js";
-import type { MicroFormProps, MicroFormReturn } from './types.js';
-declare const microForm: (props?: MicroFormProps) => MicroFormReturn;
+import { microForm } from "./index.svelte.js";
+export { IS_EMAIL, IS_ALPHA, IS_ALPHANUM, IS_INTEGER, IS_IP, IS_LEN, IT_MATCHES as IS_MATCH_FOR, IS_MAX, IS_FILE_SIZE_MB as IS_MAX_FILE_SIZE, IS_MAX_LEN, IS_MIN, IS_MIN_LEN, IS_NUMBER, IS_REQUIRED, IS_URL } from "./form-validators.js";
 export default microForm;

package/dist/index.js

@@ -1,65 +1,3 @@
-export * from "./types.js";
-import { writable, derived, get } from 'svelte/store';
-import { formAction } from './form-action.js';
-const microForm = (props) => {
-    // form default values
-    const data = props?.data || {};
-    // form values
-    const values = writable(data);
-    // internal checks
-    const unfits = writable({});
-    // external form errors
-    const errors = writable({});
-    const isdirty = writable(false);
-    const isclean = derived(([errors, unfits]), ([$errors, $unfits]) => {
-        const errVals = Object.values($errors);
-        const unfitVals = Object.values($unfits);
-        return (errVals.length === 0 || errVals.reduce((comm, next) => comm && !next, true))
-            && (unfitVals.length === 0 || unfitVals.reduce((comm, next) => comm && !next, true));
-    });
-    const valid = derived(([isclean, isdirty]), ([$isclean, $isdirty]) => {
-        return $isclean && $isdirty;
-    });
-    const validationMap = {};
-    const { options = {
-        validateEvent: 'blur'
-    } } = props || {};
-    const form = formAction(values, errors, unfits, isdirty, options, validationMap);
-    const handleSubmit = (e, handler) => {
-        e.preventDefault();
-        if (!get(valid))
-            return;
-        handler({ ...get(values) });
-    };
-    const onsubmit = (handler) => {
-        const onSubmit = async (e) => {
-            handleSubmit(e, handler);
-        };
-        return onSubmit;
-    };
-    const submit = (formNode, handler) => {
-        formNode.addEventListener('submit', (e) => {
-            handleSubmit(e, handler);
-        });
-    };
-    const reset = () => {
-        errors.set({});
-        unfits.set({});
-        values.set({ ...data });
-        for (const [name, { nodeRef, html }] of Object.entries(validationMap).filter(([, { nodeRef }]) => !!nodeRef)) {
-            if (nodeRef) {
-                nodeRef[html ? "innerHTML" : 'textContent'] = data[name] || '';
-            }
-        }
-    };
-    return {
-        values,
-        errors,
-        valid,
-        form,
-        submit,
-        onsubmit,
-        reset,
-    };
-};
+import { microForm } from "./index.svelte.js";
+export { IS_EMAIL, IS_ALPHA, IS_ALPHANUM, IS_INTEGER, IS_IP, IS_LEN, IT_MATCHES as IS_MATCH_FOR, IS_MAX, IS_FILE_SIZE_MB as IS_MAX_FILE_SIZE, IS_MAX_LEN, IS_MIN, IS_MIN_LEN, IS_NUMBER, IS_REQUIRED, IS_URL } from "./form-validators.js";
 export default microForm;

package/dist/index.svelte.js

@@ -0,0 +1,79 @@
+import { writable, derived, get } from 'svelte/store';
+import { formAction } from './form-action.js';
+import { bindStateToStore } from "./utils.js";
+export const microForm = (props) => {
+    // form default values
+    const data = props?.data || {};
+    // form values
+    const _values = writable({ ...data });
+    // internal checks
+    const unfits = writable({});
+    // external form errors
+    const _errors = writable({});
+    const isdirty = writable(false);
+    const isclean = derived(([_errors, unfits]), ([$errors, $unfits]) => {
+        const errVals = Object.values($errors);
+        const unfitVals = Object.values($unfits);
+        return (errVals.length === 0 || errVals.reduce((comm, next) => comm && !next, true))
+            && (unfitVals.length === 0 || unfitVals.reduce((comm, next) => comm && !next, true));
+    });
+    const _valid = derived(([isclean, isdirty]), ([$isclean, $isdirty]) => {
+        return $isclean && $isdirty;
+    });
+    const validationMap = {};
+    const { options = {
+        validateEvent: 'blur',
+        validators: {}
+    } } = props || {};
+    const form = formAction(_values, _errors, unfits, isdirty, options, validationMap);
+    const handleSubmit = (e, handler) => {
+        e.preventDefault();
+        if (!get(_valid))
+            return;
+        handler({ ...get(_values) });
+    };
+    const onsubmit = (handler) => {
+        const onSubmit = async (e) => {
+            handleSubmit(e, handler);
+        };
+        return onSubmit;
+    };
+    const submit = (formNode, handler) => {
+        formNode.addEventListener('submit', (e) => {
+            handleSubmit(e, handler);
+        });
+    };
+    const reset = () => {
+        _errors.set({});
+        unfits.set({});
+        _values.set({ ...data });
+        isdirty.set(false);
+        for (const [name, { nodeRef, html }] of Object.entries(validationMap).filter(([, { nodeRef }]) => !!nodeRef)) {
+            if (nodeRef) {
+                if (nodeRef.isContentEditable) {
+                    nodeRef[html ? "innerHTML" : 'textContent'] = data[name] || '';
+                }
+                else {
+                    nodeRef["value"] = data[name] || '';
+                }
+            }
+        }
+    };
+    const values = $state({ ...data });
+    const errors = $state({});
+    const sanity = $state({ ok: get(_valid) });
+    bindStateToStore(values, _values);
+    bindStateToStore(errors, _errors);
+    _valid.subscribe((changes) => {
+        sanity.ok = changes;
+    });
+    return {
+        values,
+        errors,
+        sanity,
+        form,
+        submit,
+        onsubmit,
+        reset,
+    };
+};

package/dist/internal.d.ts

@@ -1,3 +1,4 @@
-export type Params = {
-    [key: string]: string | number | Array<any> | any;
+export type Params<T = any> = {
+    [key: string | number | symbol]: T;
 };
+export type Primitive = string | number | boolean | string[] | number[] | boolean[];

package/dist/types.d.ts

@@ -1,28 +1,40 @@
 /// <reference types="svelte" />
-import { type Writable, type Readable } from "svelte/store";
+import { type Writable } from "svelte/store";
 import type { Params } from "./internal.js";
-export type { Params };
-export type FieldTypes = "Standard" | "Popover" | "Checkable";
+export type Validator = `max:${number}` | `min:${number}` | `len:${number}` | `minlen:${number}` | `maxlen:${number}` | `file-size-mb:${number}` | `match:${string}` | 'required' | 'email' | 'integer' | 'number' | 'alpha' | 'alphanum' | 'url' | 'ip';
+export type ValidatorKey = 'required' | 'email' | 'integer' | 'number' | 'alpha' | 'alphanum' | 'url' | 'ip' | `max` | `min` | `len` | `minlen` | `maxlen` | `file-size-mb` | `match`;
+export type FieldProps = {
+    name: string;
+    value: string;
+    label: string;
+    node?: HTMLElement;
+    values: Params;
+    parts?: string[];
+};
+export type ValidatorType = (props: FieldProps) => string;
+export type ValidatorMap<T> = {
+    [VAL in ValidatorKey]: T;
+};
 export type InputTypes = 'text' | 'number' | 'color' | 'time' | 'date' | 'range' | 'email' | 'hidden' | 'password' | 'tel' | 'url';
 export type FieldType = HTMLSelectElement | HTMLInputElement | HTMLTextAreaElement;
 export type InputType = HTMLSelectElement | HTMLInputElement | HTMLTextAreaElement;
 export interface ValidateArgs {
     name: string;
     value: string;
-    validations: string;
+    validations?: Validator[];
     node?: HTMLElement;
 }
 export type FormReturn = {
     destroy: () => void;
 };
 export type ValidateEvent = 'input' | 'change' | 'keyup' | 'blur';
-export type FormValues = Writable<Params>;
-export type FormErrors = Writable<Params>;
+export type FormValues = Params;
+export type FormErrors = Params;
 export type Dirty = Writable<boolean>;
 export type ActionOptions = {
     validateEvent?: ValidateEvent;
     name?: string;
-    validations?: string;
+    validations?: Validator[];
     node?: HTMLElement;
     html?: boolean;
 };
@@ -32,18 +44,21 @@ export type FormSubmitEvent = SubmitEvent & {
 };
 export type FormSubmit = (_data: Params) => void;
 export type FormOptions = {
-    validateEvent: ValidateEvent;
+    validateEvent?: ValidateEvent;
+    validators?: Partial<ValidatorMap<ValidatorType>>;
 };
 export type MicroFormProps = {
     data?: Params;
     options?: FormOptions;
 };
-export type FormSanity = Readable<boolean>;
+export type FormSanity = {
+    ok: boolean;
+};
 export type MicroFormReturn = {
     values: FormValues;
     errors: FormErrors;
+    sanity: FormSanity;
     form: (node: HTMLElement, eventProps?: ActionOptions) => FormReturn;
-    valid: FormSanity;
     submit: (formNode: HTMLFormElement, handler: FormSubmit) => void;
     onsubmit: (handler: FormSubmit) => (e: Event) => Promise<void>;
     reset: () => void;

package/dist/utils.d.ts

@@ -1,3 +1,6 @@
+/// <reference types="svelte" />
+import type { Writable } from "svelte/store";
+import type { Params } from "./internal.js";
 type TEvent = {
     target: HTMLElement;
 };
@@ -6,4 +9,6 @@ export declare const getEditableContent: (e: TEvent, isHtml: boolean) => {
     value: string;
 };
 export declare const makeName: (str: string) => string;
+export declare const isValidFileSize: (node: HTMLInputElement | undefined, maxFileSizeInMB: number) => string;
+export declare const bindStateToStore: (state: Params, store: Writable<Params>) => void;
 export {};

package/dist/utils.js

@@ -30,3 +30,24 @@ export const makeName = function (str) {
     });
     return new_name;
 };
+export const isValidFileSize = (node, maxFileSizeInMB) => {
+    if (!node)
+        return '';
+    const { files } = node;
+    if (!files)
+        return `${node.name} is required`;
+    const max = maxFileSizeInMB * 1024 * 1024;
+    for (const file of files) {
+        if (file.size > max) {
+            return `File '${file.name}' is larger the ${maxFileSizeInMB}MB.`;
+        }
+    }
+    return '';
+};
+export const bindStateToStore = (state, store) => {
+    store.subscribe((changes) => {
+        for (const [k, v] of Object.entries(changes)) {
+            state[k] = v;
+        }
+    });
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@steveesamson/microform",
-	"version": "0.0.10",
+	"version": "1.0.0",
 	"scripts": {
 		"dev": "vite dev",
 		"postbuild": "touch ./docs/.nojekyll",
@@ -20,9 +20,8 @@
 	},
 	"exports": {
 		".": {
-			"types": "./dist/index.d.ts",
-			"svelte": "./dist/index.js",
-			"default": "./dist/index.js"
+			"types": "./dist/types.d.ts",
+			"svelte": "./dist/index.js"
 		}
 	},
 	"author": "Steve S. Samson <stevee.samson@gmail.com> (http://github.com/steveesamson)",
@@ -33,7 +32,7 @@
 		"!dist/**/*.spec.*"
 	],
 	"peerDependencies": {
-		"svelte": "^4.0.0"
+		"svelte": "^5.0.0-next.135"
 	},
 	"devDependencies": {
 		"@sveltejs/adapter-auto": "^3.0.0",
@@ -52,14 +51,14 @@
 		"prettier-plugin-svelte": "^3.1.2",
 		"publint": "^0.1.9",
 		"shiki": "^0.14.7",
-		"svelte": "^4.2.7",
+		"svelte": "^5.0.0-next.135",
 		"svelte-check": "^3.6.0",
 		"tslib": "^2.4.1",
 		"typescript": "^5.0.0",
 		"vite": "^5.0.3"
 	},
 	"default": "./dist/index.js",
-	"types": "./dist/index.d.ts",
+	"types": "./dist/types.d.ts",
 	"type": "module",
 	"keywords": [
 		"microform",