From 69a0f03324c55ad20d3180c17d2aaef946aa828a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Pedro=20Lopes?= Date: Mon, 3 Feb 2025 14:13:32 -0300 Subject: [PATCH 1/3] feat(form): adding support for nested paths --- packages/core/src/types.ts | 4 +++ packages/react/package.json | 2 +- packages/react/src/useForm.ts | 56 +++++++++++++++++----------------- packages/svelte/src/useForm.ts | 51 +++++++++++++++---------------- packages/vue3/package.json | 3 +- packages/vue3/src/useForm.ts | 45 +++++++++++++-------------- 6 files changed, 80 insertions(+), 81 deletions(-) diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts index 8537b269b..04cfb6c68 100644 --- a/packages/core/src/types.ts +++ b/packages/core/src/types.ts @@ -21,6 +21,10 @@ export type FormDataConvertible = | null | undefined +export type FormDataKeys = { + [K in keyof T & string]: T[K] extends object ? (T[K] extends Array ? K : `${K}.${FormDataKeys}` | K) : K +}[keyof T & string] + export type Method = 'get' | 'post' | 'put' | 'patch' | 'delete' export type RequestPayload = Record | FormData diff --git a/packages/react/package.json b/packages/react/package.json index 6ea2657d6..5bb059e81 100755 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -60,6 +60,6 @@ }, "dependencies": { "@inertiajs/core": "2.0.3", - "lodash.isequal": "^4.5.0" + "lodash": "^4.5.0" } } diff --git a/packages/react/src/useForm.ts b/packages/react/src/useForm.ts index 0e0188e60..689a00129 100644 --- a/packages/react/src/useForm.ts +++ b/packages/react/src/useForm.ts @@ -1,18 +1,18 @@ -import { FormDataConvertible, Method, Progress, router, VisitOptions } from '@inertiajs/core' -import isEqual from 'lodash.isequal' +import { FormDataConvertible, FormDataKeys, Method, Progress, router, VisitOptions } from '@inertiajs/core' +import { cloneDeep, get, has, isEqual, set } from 'lodash' import { useCallback, useEffect, useRef, useState } from 'react' import useRemember from './useRemember' type setDataByObject = (data: TForm) => void type setDataByMethod = (data: (previousData: TForm) => TForm) => void -type setDataByKeyValuePair = (key: K, value: TForm[K]) => void +type setDataByKeyValuePair = (key: FormDataKeys, value: any) => void type FormDataType = Record type FormOptions = Omit export interface InertiaFormProps { data: TForm isDirty: boolean - errors: Partial> + errors: Partial, string>> hasErrors: boolean processing: boolean progress: Progress | null @@ -21,12 +21,12 @@ export interface InertiaFormProps { setData: setDataByObject & setDataByMethod & setDataByKeyValuePair transform: (callback: (data: TForm) => object) => void setDefaults(): void - setDefaults(field: keyof TForm, value: FormDataConvertible): void + setDefaults(field: FormDataKeys, value: FormDataConvertible): void setDefaults(fields: Partial): void - reset: (...fields: (keyof TForm)[]) => void - clearErrors: (...fields: (keyof TForm)[]) => void - setError(field: keyof TForm, value: string): void - setError(errors: Record): void + reset: (...fields: FormDataKeys[]) => void + clearErrors: (...fields: FormDataKeys[]) => void + setError(field: FormDataKeys, value: string): void + setError(errors: Record, string>): void submit: (method: Method, url: string, options?: FormOptions) => void get: (url: string, options?: FormOptions) => void patch: (url: string, options?: FormOptions) => void @@ -53,8 +53,8 @@ export default function useForm( const recentlySuccessfulTimeoutId = useRef(null) const [data, setData] = rememberKey ? useRemember(defaults, `${rememberKey}:data`) : useState(defaults) const [errors, setErrors] = rememberKey - ? useRemember({} as Partial>, `${rememberKey}:errors`) - : useState({} as Partial>) + ? useRemember({} as Partial, string>>, `${rememberKey}:errors`) + : useState({} as Partial, string>>) const [hasErrors, setHasErrors] = useState(false) const [processing, setProcessing] = useState(false) const [progress, setProgress] = useState(null) @@ -168,9 +168,9 @@ export default function useForm( ) const setDataFunction = useCallback( - (keyOrData: keyof TForm | Function | TForm, maybeValue?: TForm[keyof TForm]) => { + (keyOrData: FormDataKeys | Function | TForm, maybeValue?: any) => { if (typeof keyOrData === 'string') { - setData((data) => ({ ...data, [keyOrData]: maybeValue })) + setData((data) => set(cloneDeep(data), keyOrData, maybeValue)) } else if (typeof keyOrData === 'function') { setData((data) => keyOrData(data)) } else { @@ -181,14 +181,15 @@ export default function useForm( ) const setDefaultsFunction = useCallback( - (fieldOrFields?: keyof TForm | Partial, maybeValue?: FormDataConvertible) => { + (fieldOrFields?: FormDataKeys | Partial, maybeValue?: FormDataConvertible) => { if (typeof fieldOrFields === 'undefined') { setDefaults(() => data) } else { - setDefaults((defaults) => ({ - ...defaults, - ...(typeof fieldOrFields === 'string' ? { [fieldOrFields]: maybeValue } : (fieldOrFields as TForm)), - })) + setDefaults((defaults) => { + return typeof fieldOrFields === 'string' + ? set(cloneDeep(defaults), fieldOrFields, maybeValue) + : Object.assign(cloneDeep(defaults), fieldOrFields) + }) } }, [data, setDefaults], @@ -200,14 +201,13 @@ export default function useForm( setData(defaults) } else { setData((data) => - (Object.keys(defaults) as Array) - .filter((key) => fields.includes(key)) + (fields as Array>) + .filter((key) => has(defaults, key)) .reduce( (carry, key) => { - carry[key] = defaults[key] - return carry + return set(carry, key, get(defaults, key)) }, - { ...data }, + { ...data } as TForm, ), ) } @@ -216,13 +216,13 @@ export default function useForm( ) const setError = useCallback( - (fieldOrFields: keyof TForm | Record, maybeValue?: string) => { + (fieldOrFields: FormDataKeys | Record, string>, maybeValue?: string) => { setErrors((errors) => { const newErrors = { ...errors, ...(typeof fieldOrFields === 'string' ? { [fieldOrFields]: maybeValue } - : (fieldOrFields as Record)), + : (fieldOrFields as Record, string>)), } setHasErrors(Object.keys(newErrors).length > 0) return newErrors @@ -234,7 +234,7 @@ export default function useForm( const clearErrors = useCallback( (...fields) => { setErrors((errors) => { - const newErrors = (Object.keys(errors) as Array).reduce( + const newErrors = (Object.keys(errors) as Array>).reduce( (carry, field) => ({ ...carry, ...(fields.length > 0 && !fields.includes(field) ? { [field]: errors[field] } : {}), @@ -251,7 +251,7 @@ export default function useForm( const createSubmitMethod = (method) => (url, options) => { submit(method, url, options) } - const get = useCallback(createSubmitMethod('get'), [submit]) + const getMethod = useCallback(createSubmitMethod('get'), [submit]) const post = useCallback(createSubmitMethod('post'), [submit]) const put = useCallback(createSubmitMethod('put'), [submit]) const patch = useCallback(createSubmitMethod('patch'), [submit]) @@ -283,7 +283,7 @@ export default function useForm( setError, clearErrors, submit, - get, + get: getMethod, post, put, patch, diff --git a/packages/svelte/src/useForm.ts b/packages/svelte/src/useForm.ts index 8cbd4c715..2d9995487 100644 --- a/packages/svelte/src/useForm.ts +++ b/packages/svelte/src/useForm.ts @@ -2,6 +2,7 @@ import type { ActiveVisit, Errors, FormDataConvertible, + FormDataKeys, Method, Page, PendingVisit, @@ -11,8 +12,7 @@ import type { } from '@inertiajs/core' import { router } from '@inertiajs/core' import type { AxiosProgressEvent } from 'axios' -import cloneDeep from 'lodash/cloneDeep' -import isEqual from 'lodash/isEqual' +import { cloneDeep, get, has, isEqual, set } from 'lodash' import { writable, type Writable } from 'svelte/store' type FormDataType = Record @@ -20,22 +20,22 @@ type FormOptions = Omit export interface InertiaFormProps { isDirty: boolean - errors: Partial> + errors: Partial, string>> hasErrors: boolean progress: Progress | null wasSuccessful: boolean recentlySuccessful: boolean processing: boolean setStore(data: TForm): void - setStore(key: keyof TForm, value?: FormDataConvertible): void + setStore(key: FormDataKeys, value?: FormDataConvertible): void data(): TForm transform(callback: (data: TForm) => object): this defaults(): this defaults(fields: Partial): this - defaults(field?: keyof TForm, value?: FormDataConvertible): this - reset(...fields: (keyof TForm)[]): this - clearErrors(...fields: (keyof TForm)[]): this - setError(field: keyof TForm, value: string): this + defaults(field?: FormDataKeys, value?: FormDataConvertible): this + reset(...fields: FormDataKeys[]): this + clearErrors(...fields: FormDataKeys[]): this + setError(field: FormDataKeys, value: string): this setError(errors: Errors): this submit(method: Method, url: string, options?: FormOptions): void get(url: string, options?: FormOptions): void @@ -61,7 +61,7 @@ export default function useForm( const inputData = (typeof rememberKeyOrData === 'string' ? maybeData : rememberKeyOrData) ?? {} const data: TForm = typeof inputData === 'function' ? inputData() : (inputData as TForm) const restored = rememberKey - ? (router.restore(rememberKey) as { data: TForm; errors: Record } | null) + ? (router.restore(rememberKey) as { data: TForm; errors: Record, string> } | null) : null let defaults = cloneDeep(data) let cancelToken: { cancel: () => void } | null = null @@ -79,27 +79,27 @@ export default function useForm( processing: false, setStore(keyOrData, maybeValue = undefined) { store.update((store) => { - return Object.assign(store, typeof keyOrData === 'string' ? { [keyOrData]: maybeValue } : keyOrData) + return typeof keyOrData === 'string' ? set(store, keyOrData, maybeValue) : Object.assign(store, keyOrData) }) }, data() { return Object.keys(data).reduce((carry, key) => { - carry[key] = this[key] - return carry + return set(carry, key, get(this, key)) }, {} as FormDataType) as TForm }, transform(callback) { transform = callback return this }, - defaults(fieldOrFields?: keyof TForm | Partial, maybeValue?: FormDataConvertible) { - defaults = - typeof fieldOrFields === 'undefined' - ? cloneDeep(this.data()) - : Object.assign( - cloneDeep(defaults), - typeof fieldOrFields === 'string' ? { [fieldOrFields]: maybeValue } : fieldOrFields, - ) + defaults(fieldOrFields?: FormDataKeys | Partial, maybeValue?: FormDataConvertible) { + if (typeof fieldOrFields === 'undefined') { + defaults = cloneDeep(this.data()) + } else { + defaults = + typeof fieldOrFields === 'string' + ? set(cloneDeep(defaults), fieldOrFields, maybeValue) + : Object.assign(cloneDeep(defaults), fieldOrFields) + } return this }, @@ -109,18 +109,17 @@ export default function useForm( this.setStore(clonedData) } else { this.setStore( - Object.keys(clonedData) - .filter((key) => fields.includes(key)) + (fields as Array>) + .filter((key) => has(clonedData, key)) .reduce((carry, key) => { - carry[key] = clonedData[key] - return carry + return set(carry, key, get(clonedData, key)) }, {} as FormDataType) as TForm, ) } return this }, - setError(fieldOrFields: keyof TForm | Errors, maybeValue?: string) { + setError(fieldOrFields: FormDataKeys | Errors, maybeValue?: string) { this.setStore('errors', { ...this.errors, ...((typeof fieldOrFields === 'string' ? { [fieldOrFields]: maybeValue } : fieldOrFields) as Errors), @@ -131,7 +130,7 @@ export default function useForm( clearErrors(...fields) { this.setStore( 'errors', - Object.keys(this.errors).reduce( + (Object.keys(this.errors) as FormDataKeys[]).reduce( (carry, field) => ({ ...carry, ...(fields.length > 0 && !fields.includes(field) ? { [field]: this.errors[field] } : {}), diff --git a/packages/vue3/package.json b/packages/vue3/package.json index c5c835b7d..253aec5d5 100755 --- a/packages/vue3/package.json +++ b/packages/vue3/package.json @@ -59,7 +59,6 @@ }, "dependencies": { "@inertiajs/core": "2.0.3", - "lodash.clonedeep": "^4.5.0", - "lodash.isequal": "^4.5.0" + "lodash": "^4.5.0" } } diff --git a/packages/vue3/src/useForm.ts b/packages/vue3/src/useForm.ts index 786cbeadb..01ef6cf70 100644 --- a/packages/vue3/src/useForm.ts +++ b/packages/vue3/src/useForm.ts @@ -1,6 +1,5 @@ -import { FormDataConvertible, Method, Progress, router, VisitOptions } from '@inertiajs/core' -import cloneDeep from 'lodash.clonedeep' -import isEqual from 'lodash.isequal' +import { FormDataConvertible, FormDataKeys, Method, Progress, router, VisitOptions } from '@inertiajs/core' +import { cloneDeep, get, has, isEqual, set } from 'lodash' import { reactive, watch } from 'vue' type FormDataType = Record @@ -8,7 +7,7 @@ type FormOptions = Omit export interface InertiaFormProps { isDirty: boolean - errors: Partial> + errors: Partial, string>> hasErrors: boolean processing: boolean progress: Progress | null @@ -17,12 +16,12 @@ export interface InertiaFormProps { data(): TForm transform(callback: (data: TForm) => object): this defaults(): this - defaults(field: keyof TForm, value: FormDataConvertible): this + defaults(field: FormDataKeys, value: FormDataConvertible): this defaults(fields: Partial): this - reset(...fields: (keyof TForm)[]): this - clearErrors(...fields: (keyof TForm)[]): this - setError(field: keyof TForm, value: string): this - setError(errors: Record): this + reset(...fields: FormDataKeys[]): this + clearErrors(...fields: FormDataKeys[]): this + setError(field: FormDataKeys, value: string): this + setError(errors: Record, string>): this submit(method: Method, url: string, options?: FormOptions): void get(url: string, options?: FormOptions): void post(url: string, options?: FormOptions): void @@ -46,7 +45,7 @@ export default function useForm( const rememberKey = typeof rememberKeyOrData === 'string' ? rememberKeyOrData : null const data = (typeof rememberKeyOrData === 'string' ? maybeData : rememberKeyOrData) ?? {} const restored = rememberKey - ? (router.restore(rememberKey) as { data: TForm; errors: Record }) + ? (router.restore(rememberKey) as { data: TForm; errors: Record, string> }) : null let defaults = typeof data === 'function' ? cloneDeep(data()) : cloneDeep(data) let cancelToken = null @@ -63,9 +62,8 @@ export default function useForm( wasSuccessful: false, recentlySuccessful: false, data() { - return (Object.keys(defaults) as Array).reduce((carry, key) => { - carry[key] = this[key] - return carry + return (Object.keys(defaults) as Array>).reduce((carry, key) => { + return set(carry, key, get(this, key)) }, {} as Partial) as TForm }, transform(callback) { @@ -73,7 +71,7 @@ export default function useForm( return this }, - defaults(fieldOrFields?: keyof TForm | Partial, maybeValue?: FormDataConvertible) { + defaults(fieldOrFields?: FormDataKeys | Partial, maybeValue?: FormDataConvertible) { if (typeof data === 'function') { throw new Error('You cannot call `defaults()` when using a function to define your form data.') } @@ -82,11 +80,10 @@ export default function useForm( defaults = this.data() this.isDirty = false } else { - defaults = Object.assign( - {}, - cloneDeep(defaults), - typeof fieldOrFields === 'string' ? { [fieldOrFields]: maybeValue } : fieldOrFields, - ) + defaults = + typeof fieldOrFields === 'string' + ? set(cloneDeep(defaults), fieldOrFields, maybeValue) + : Object.assign({}, cloneDeep(defaults), fieldOrFields) } return this @@ -98,17 +95,17 @@ export default function useForm( defaults = clonedData Object.assign(this, resolvedData) } else { - Object.keys(resolvedData) - .filter((key) => fields.includes(key)) + (fields as Array>) + .filter((key) => has(clonedData, key)) .forEach((key) => { - defaults[key] = clonedData[key] - this[key] = resolvedData[key] + set(defaults, key, get(clonedData, key)) + set(this, key, get(resolvedData, key)) }) } return this }, - setError(fieldOrFields: keyof TForm | Record, maybeValue?: string) { + setError(fieldOrFields: FormDataKeys | Record, string>, maybeValue?: string) { Object.assign(this.errors, typeof fieldOrFields === 'string' ? { [fieldOrFields]: maybeValue } : fieldOrFields) this.hasErrors = Object.keys(this.errors).length > 0 From 2ef415aaffbff97bc50d8b796139c4fa9365b4f6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Pedro=20Lopes?= Date: Mon, 3 Feb 2025 14:17:15 -0300 Subject: [PATCH 2/3] style(prettier): run the prettier command --- package-lock.json | 17 ++-------------- packages/svelte/src/createInertiaApp.ts | 2 +- packages/svelte/test-app/Layouts/SWR.svelte | 10 ++-------- .../Pages/ClientSideVisit/Page1.svelte | 12 +++++------ .../Pages/ClientSideVisit/Page2.svelte | 2 +- .../svelte/test-app/Pages/History/Page.svelte | 4 ++-- .../test-app/Pages/Links/PropUpdate.svelte | 8 +++----- .../Pages/Svelte/PropsAndPageStore.svelte | 20 ++++--------------- .../Pages/Visits/ReloadOnMount.svelte | 14 ++++++------- .../svelte/test-app/Pages/WhenVisible.svelte | 15 ++++++++------ packages/vue3/src/useForm.ts | 2 +- .../test-app/Pages/DeferredProps/Page1.vue | 4 ++-- .../resources/js/Components/Spinner.svelte | 2 +- .../svelte4/resources/js/Pages/Defer.svelte | 2 +- .../svelte4/resources/js/Pages/Home.svelte | 16 +++++++-------- playgrounds/svelte4/resources/js/ssr.ts | 2 +- playgrounds/svelte4/svelte.config.js | 12 +++++------ playgrounds/svelte5/resources/js/ssr.ts | 2 +- playgrounds/vue3/resources/js/Pages/Defer.vue | 2 +- .../resources/js/Pages/InfiniteScroll.vue | 10 +++++----- playgrounds/vue3/resources/js/Pages/Users.vue | 2 +- tests/events.spec.ts | 2 +- tests/svelte.spec.ts | 2 +- 23 files changed, 66 insertions(+), 98 deletions(-) diff --git a/package-lock.json b/package-lock.json index 482a3c20f..184711605 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2945,18 +2945,6 @@ "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", "license": "MIT" }, - "node_modules/lodash.clonedeep": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz", - "integrity": "sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==", - "license": "MIT" - }, - "node_modules/lodash.isequal": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz", - "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==", - "license": "MIT" - }, "node_modules/lower-case": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", @@ -5403,7 +5391,7 @@ "license": "MIT", "dependencies": { "@inertiajs/core": "2.0.3", - "lodash.isequal": "^4.5.0" + "lodash": "^4.5.0" }, "devDependencies": { "@types/react": "^16.9.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", @@ -5510,8 +5498,7 @@ "license": "MIT", "dependencies": { "@inertiajs/core": "2.0.3", - "lodash.clonedeep": "^4.5.0", - "lodash.isequal": "^4.5.0" + "lodash": "^4.5.0" }, "devDependencies": { "@playwright/test": "^1.46.1", diff --git a/packages/svelte/src/createInertiaApp.ts b/packages/svelte/src/createInertiaApp.ts index 87b646b55..88a04e038 100644 --- a/packages/svelte/src/createInertiaApp.ts +++ b/packages/svelte/src/createInertiaApp.ts @@ -48,7 +48,7 @@ export default async function createInertiaApp({ const svelteApp = setup({ el, App: App as unknown as AppComponent, - props + props, }) if (isServer) { diff --git a/packages/svelte/test-app/Layouts/SWR.svelte b/packages/svelte/test-app/Layouts/SWR.svelte index aef81e4f1..ecfdc7fa4 100644 --- a/packages/svelte/test-app/Layouts/SWR.svelte +++ b/packages/svelte/test-app/Layouts/SWR.svelte @@ -5,16 +5,10 @@
1s Expired 1s Expired (Number) - + 1s Stale, 2s Expired - - 1s Stale, 2s Expired (Number) - + 1s Stale, 2s Expired (Number)
diff --git a/packages/svelte/test-app/Pages/ClientSideVisit/Page1.svelte b/packages/svelte/test-app/Pages/ClientSideVisit/Page1.svelte index ad1c01653..17fee1cca 100644 --- a/packages/svelte/test-app/Pages/ClientSideVisit/Page1.svelte +++ b/packages/svelte/test-app/Pages/ClientSideVisit/Page1.svelte @@ -1,22 +1,22 @@
diff --git a/packages/svelte/test-app/Pages/ClientSideVisit/Page2.svelte b/packages/svelte/test-app/Pages/ClientSideVisit/Page2.svelte index eb6953a23..b8e5a5f86 100644 --- a/packages/svelte/test-app/Pages/ClientSideVisit/Page2.svelte +++ b/packages/svelte/test-app/Pages/ClientSideVisit/Page2.svelte @@ -1,5 +1,5 @@
{baz}
diff --git a/packages/svelte/test-app/Pages/History/Page.svelte b/packages/svelte/test-app/Pages/History/Page.svelte index bdbdf4e00..e5325d7ef 100644 --- a/packages/svelte/test-app/Pages/History/Page.svelte +++ b/packages/svelte/test-app/Pages/History/Page.svelte @@ -2,7 +2,7 @@ import { inertia, router } from '@inertiajs/svelte' export let pageNumber - export let multiByte + export let multiByte Page 1 @@ -14,4 +14,4 @@
This is page {pageNumber}.
-
Multi byte character: { multiByte }
+
Multi byte character: {multiByte}
diff --git a/packages/svelte/test-app/Pages/Links/PropUpdate.svelte b/packages/svelte/test-app/Pages/Links/PropUpdate.svelte index e22ed5c60..d3046e7be 100644 --- a/packages/svelte/test-app/Pages/Links/PropUpdate.svelte +++ b/packages/svelte/test-app/Pages/Links/PropUpdate.svelte @@ -1,16 +1,14 @@
- - The Link - + The Link
diff --git a/packages/svelte/test-app/Pages/Svelte/PropsAndPageStore.svelte b/packages/svelte/test-app/Pages/Svelte/PropsAndPageStore.svelte index b3c57900e..664ad2108 100644 --- a/packages/svelte/test-app/Pages/Svelte/PropsAndPageStore.svelte +++ b/packages/svelte/test-app/Pages/Svelte/PropsAndPageStore.svelte @@ -19,23 +19,11 @@
- +

foo prop is {foo}

$page.props.foo is {$page.props.foo}

- - Bar - - - Baz - - - Home - + Bar + Baz + Home
diff --git a/packages/svelte/test-app/Pages/Visits/ReloadOnMount.svelte b/packages/svelte/test-app/Pages/Visits/ReloadOnMount.svelte index 82d626ed1..785cb1031 100644 --- a/packages/svelte/test-app/Pages/Visits/ReloadOnMount.svelte +++ b/packages/svelte/test-app/Pages/Visits/ReloadOnMount.svelte @@ -1,14 +1,12 @@ -
Name is {name}
diff --git a/packages/svelte/test-app/Pages/WhenVisible.svelte b/packages/svelte/test-app/Pages/WhenVisible.svelte index 116158c4b..61126d3f2 100644 --- a/packages/svelte/test-app/Pages/WhenVisible.svelte +++ b/packages/svelte/test-app/Pages/WhenVisible.svelte @@ -43,14 +43,17 @@
- + }, + }} + >
Loading fifth one...
 diff --git a/packages/vue3/src/useForm.ts b/packages/vue3/src/useForm.ts index 01ef6cf70..12a37c26f 100644 --- a/packages/vue3/src/useForm.ts +++ b/packages/vue3/src/useForm.ts @@ -95,7 +95,7 @@ export default function useForm( defaults = clonedData Object.assign(this, resolvedData) } else { - (fields as Array>) + ;(fields as Array>) .filter((key) => has(clonedData, key)) .forEach((key) => { set(defaults, key, get(clonedData, key)) diff --git a/packages/vue3/test-app/Pages/DeferredProps/Page1.vue b/packages/vue3/test-app/Pages/DeferredProps/Page1.vue index 247127e2e..369a19331 100644 --- a/packages/vue3/test-app/Pages/DeferredProps/Page1.vue +++ b/packages/vue3/test-app/Pages/DeferredProps/Page1.vue @@ -2,8 +2,8 @@ import { Deferred, Link } from '@inertiajs/vue3' defineProps<{ - foo?: {text: string } - bar?: {text: string } + foo?: { text: string } + bar?: { text: string } }>() diff --git a/playgrounds/svelte4/resources/js/Components/Spinner.svelte b/playgrounds/svelte4/resources/js/Components/Spinner.svelte index 53c3b95ee..da703146f 100644 --- a/playgrounds/svelte4/resources/js/Components/Spinner.svelte +++ b/playgrounds/svelte4/resources/js/Components/Spinner.svelte @@ -5,4 +5,4 @@ fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" > - + diff --git a/playgrounds/svelte4/resources/js/Pages/Defer.svelte b/playgrounds/svelte4/resources/js/Pages/Defer.svelte index a14548579..491579304 100644 --- a/playgrounds/svelte4/resources/js/Pages/Defer.svelte +++ b/playgrounds/svelte4/resources/js/Pages/Defer.svelte @@ -55,7 +55,7 @@

Deferred Props

-
+

Page is loaded!

diff --git a/playgrounds/svelte4/resources/js/Pages/Home.svelte b/playgrounds/svelte4/resources/js/Pages/Home.svelte index 0ac3c2a84..6a287537f 100644 --- a/playgrounds/svelte4/resources/js/Pages/Home.svelte +++ b/playgrounds/svelte4/resources/js/Pages/Home.svelte @@ -14,13 +14,13 @@

Home

- + -
- -
+
+ +
diff --git a/playgrounds/svelte4/resources/js/ssr.ts b/playgrounds/svelte4/resources/js/ssr.ts index d4f3d4a51..eba0ce94a 100644 --- a/playgrounds/svelte4/resources/js/ssr.ts +++ b/playgrounds/svelte4/resources/js/ssr.ts @@ -10,6 +10,6 @@ createServer((page) => }, setup({ App, props }) { return App.render(props) - } + }, }), ) diff --git a/playgrounds/svelte4/svelte.config.js b/playgrounds/svelte4/svelte.config.js index 7f3939b8d..7bb74fd41 100644 --- a/playgrounds/svelte4/svelte.config.js +++ b/playgrounds/svelte4/svelte.config.js @@ -1,9 +1,9 @@ -import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'; +import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' const config = { - // Consult https://kit.svelte.dev/docs/integrations#preprocessors - // for more information about preprocessors - preprocess: vitePreprocess(), -}; + // Consult https://kit.svelte.dev/docs/integrations#preprocessors + // for more information about preprocessors + preprocess: vitePreprocess(), +} -export default config; +export default config diff --git a/playgrounds/svelte5/resources/js/ssr.ts b/playgrounds/svelte5/resources/js/ssr.ts index 037d9eecd..8cbc7a5b8 100644 --- a/playgrounds/svelte5/resources/js/ssr.ts +++ b/playgrounds/svelte5/resources/js/ssr.ts @@ -11,6 +11,6 @@ createServer((page) => }, setup({ App, props }) { return render(App, { props }) - } + }, }), ) diff --git a/playgrounds/vue3/resources/js/Pages/Defer.vue b/playgrounds/vue3/resources/js/Pages/Defer.vue index b59830767..71dbcd796 100644 --- a/playgrounds/vue3/resources/js/Pages/Defer.vue +++ b/playgrounds/vue3/resources/js/Pages/Defer.vue @@ -42,7 +42,7 @@ defineProps<{ diff --git a/playgrounds/vue3/resources/js/Pages/Users.vue b/playgrounds/vue3/resources/js/Pages/Users.vue index dda40b0a2..6590effee 100644 --- a/playgrounds/vue3/resources/js/Pages/Users.vue +++ b/playgrounds/vue3/resources/js/Pages/Users.vue @@ -22,7 +22,7 @@ defineProps({ users: Array, date: String }) refreshing...
-
+
diff --git a/tests/events.spec.ts b/tests/events.spec.ts index 8215f4cac..dc64dbee6 100644 --- a/tests/events.spec.ts +++ b/tests/events.spec.ts @@ -409,7 +409,7 @@ test.describe('Events', () => { test('can delay onFinish from firing by returning a promise (link)', async ({ page }) => { test.skip(process.env.PACKAGE === 'svelte', 'Feature not supported by the Svelte adapter') - + await page.getByRole('button', { exact: true, name: 'Error Event Link (delaying onFinish w/ Promise)' }).click() await page.waitForTimeout(25) diff --git a/tests/svelte.spec.ts b/tests/svelte.spec.ts index 7f06df053..de62e8911 100644 --- a/tests/svelte.spec.ts +++ b/tests/svelte.spec.ts @@ -65,4 +65,4 @@ test('props and page store are in sync', async ({ page }) => { await expect(consoleMessages.messages[3]).toBe('[reactive expression] $page.props.foo is baz') await expect(consoleMessages.messages[4]).toBe('[onMount] foo prop is baz') await expect(consoleMessages.messages[5]).toBe('[onMount] $page.props.foo is baz') -}) \ No newline at end of file +}) From de42cd63b09a3de38939737ac09827bb8c8095ab Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Pedro=20Lopes?= Date: Mon, 3 Feb 2025 14:18:50 -0300 Subject: [PATCH 3/3] wip --- packages/vue3/src/remember.ts | 2 +- packages/vue3/src/useRemember.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/vue3/src/remember.ts b/packages/vue3/src/remember.ts index f7d517c2d..63a8bc193 100755 --- a/packages/vue3/src/remember.ts +++ b/packages/vue3/src/remember.ts @@ -1,5 +1,5 @@ import { router } from '@inertiajs/core' -import cloneDeep from 'lodash.clonedeep' +import { cloneDeep } from 'lodash' import { ComponentOptions } from 'vue' const remember: ComponentOptions = { diff --git a/packages/vue3/src/useRemember.ts b/packages/vue3/src/useRemember.ts index dce9d559f..182296cc7 100644 --- a/packages/vue3/src/useRemember.ts +++ b/packages/vue3/src/useRemember.ts @@ -1,5 +1,5 @@ import { router } from '@inertiajs/core' -import cloneDeep from 'lodash.clonedeep' +import { cloneDeep } from 'lodash' import { isReactive, reactive, ref, Ref, watch } from 'vue' export default function useRemember(