Skip to content

Commit a6ef9f5

Browse files
harry-whorlowharry-whorlow
committed
fix(devtools): fixed theme miss-match and bumps packages
1 parent a4e8dec commit a6ef9f5

File tree

12 files changed

+62
-47
lines changed

12 files changed

+62
-47
lines changed

‎.changeset/cool-parents-type.md‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
---
2+
'@tanstack/react-form-devtools': patch
3+
'@tanstack/solid-form-devtools': patch
4+
'@tanstack/form-devtools': patch
5+
'@tanstack/form-core': patch
6+
---
7+
8+
Upgrade packages and fixed theme pacakge missmatch

‎packages/form-core/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@
5151
"src"
5252
],
5353
"dependencies": {
54-
"@tanstack/devtools-event-client": "^0.4.0",
54+
"@tanstack/devtools-event-client": "^0.4.1",
5555
"@tanstack/pacer-lite": "^0.1.1",
5656
"@tanstack/store": "^0.9.1"
5757
},

‎packages/form-core/src/FormApi.ts‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1369,10 +1369,10 @@ export class FormApi<
13691369

13701370
// devtool requests
13711371
const cleanupFormStateListener = formEventClient.on(
1372-
'request-form-state',
1372+
'form-devtools:request-form-state',
13731373
(e) => {
13741374
if (e.payload.id === this._formId) {
1375-
formEventClient.emit('form-api', {
1375+
formEventClient.emit('form-devtools:form-api', {
13761376
id: this._formId,
13771377
state: this.store.state,
13781378
options: this.options,
@@ -1382,7 +1382,7 @@ export class FormApi<
13821382
)
13831383

13841384
const cleanupFormResetListener = formEventClient.on(
1385-
'request-form-reset',
1385+
'form-devtools:request-form-reset',
13861386
(e) => {
13871387
if (e.payload.id === this._formId) {
13881388
this.reset()
@@ -1391,7 +1391,7 @@ export class FormApi<
13911391
)
13921392

13931393
const cleanupFormForceSubmitListener = formEventClient.on(
1394-
'request-form-force-submit',
1394+
'form-devtools:request-form-force-submit',
13951395
(e) => {
13961396
if (e.payload.id === this._formId) {
13971397
this._devtoolsSubmissionOverride = true
@@ -1408,7 +1408,7 @@ export class FormApi<
14081408
cleanupDevtoolBroadcast.unsubscribe()
14091409

14101410
// broadcast form unmount for devtools
1411-
formEventClient.emit('form-unmounted', {
1411+
formEventClient.emit('form-devtools:form-unmounted', {
14121412
id: this._formId,
14131413
})
14141414
}
@@ -1418,7 +1418,7 @@ export class FormApi<
14181418
const { onMount } = this.options.validators || {}
14191419

14201420
// broadcast form state for devtools on mounting
1421-
formEventClient.emit('form-api', {
1421+
formEventClient.emit('form-devtools:form-api', {
14221422
id: this._formId,
14231423
state: this.store.state,
14241424
options: this.options,
@@ -1488,7 +1488,7 @@ export class FormApi<
14881488
)
14891489
})
14901490

1491-
formEventClient.emit('form-api', {
1491+
formEventClient.emit('form-devtools:form-api', {
14921492
id: this._formId,
14931493
state: this.store.state,
14941494
options: this.options,
@@ -2109,7 +2109,7 @@ export class FormApi<
21092109
meta: submitMetaArg,
21102110
})
21112111

2112-
formEventClient.emit('form-submission', {
2112+
formEventClient.emit('form-devtools:form-submission', {
21132113
id: this._formId,
21142114
submissionAttempt: this.state.submissionAttempts,
21152115
successful: false,
@@ -2133,7 +2133,7 @@ export class FormApi<
21332133
meta: submitMetaArg,
21342134
})
21352135

2136-
formEventClient.emit('form-submission', {
2136+
formEventClient.emit('form-devtools:form-submission', {
21372137
id: this._formId,
21382138
submissionAttempt: this.state.submissionAttempts,
21392139
successful: false,
@@ -2172,7 +2172,7 @@ export class FormApi<
21722172
isSubmitSuccessful: true, // Set isSubmitSuccessful to true on successful submission
21732173
}))
21742174

2175-
formEventClient.emit('form-submission', {
2175+
formEventClient.emit('form-devtools:form-submission', {
21762176
id: this._formId,
21772177
submissionAttempt: this.state.submissionAttempts,
21782178
successful: true,
@@ -2186,7 +2186,7 @@ export class FormApi<
21862186
isSubmitSuccessful: false, // Ensure isSubmitSuccessful is false if an error occurs
21872187
}))
21882188

2189-
formEventClient.emit('form-submission', {
2189+
formEventClient.emit('form-devtools:form-submission', {
21902190
id: this._formId,
21912191
submissionAttempt: this.state.submissionAttempts,
21922192
successful: false,

‎packages/form-core/src/utils.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -607,7 +607,7 @@ export function uuid(): string {
607607

608608
export const throttleFormState = liteThrottle(
609609
(form: AnyFormApi) =>
610-
formEventClient.emit('form-state', {
610+
formEventClient.emit('form-devtools:form-state', {
611611
id: form.formId,
612612
state: form.store.state,
613613
}),

‎packages/form-devtools/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,8 +52,8 @@
5252
"src"
5353
],
5454
"dependencies": {
55-
"@tanstack/devtools-ui": "^0.4.4",
56-
"@tanstack/devtools-utils": "^0.3.0",
55+
"@tanstack/devtools-ui": "^0.5.0",
56+
"@tanstack/devtools-utils": "^0.3.2",
5757
"@tanstack/form-core": "workspace:*",
5858
"clsx": "^2.1.1",
5959
"dayjs": "^1.11.18",

‎packages/form-devtools/src/components/ActionButtons.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export function ActionButtons(props: ActionButtonsProps) {
1717
<button
1818
class={styles().actionButton}
1919
onMouseDown={() => {
20-
formEventClient.emit('request-form-state', {
20+
formEventClient.emit('form-devtools:request-form-state', {
2121
id: props.selectedInstance()?.id as string,
2222
})
2323
}}
@@ -29,7 +29,7 @@ export function ActionButtons(props: ActionButtonsProps) {
2929
<button
3030
class={styles().actionButton}
3131
onMouseDown={() => {
32-
formEventClient.emit('request-form-reset', {
32+
formEventClient.emit('form-devtools:request-form-reset', {
3333
id: props.selectedInstance()?.id as string,
3434
})
3535
}}
@@ -41,7 +41,7 @@ export function ActionButtons(props: ActionButtonsProps) {
4141
<button
4242
class={styles().actionButton}
4343
onMouseDown={() => {
44-
formEventClient.emit('request-form-force-submit', {
44+
formEventClient.emit('form-devtools:request-form-force-submit', {
4545
id: props.selectedInstance()?.id as string,
4646
})
4747
}}

‎packages/form-devtools/src/components/DetailsPanel.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,7 @@ export function DetailsPanel({ selectedKey }: DetailsPanelProps) {
6969
<div
7070
style={{
7171
display: 'flex',
72+
'flex-wrap': 'wrap',
7273
gap: '8px',
7374
}}
7475
>

‎packages/form-devtools/src/contexts/eventClientContext.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ function useProviderValue() {
3636
const [store, setStore] = createStore<Array<DevtoolsFormState>>([])
3737

3838
createEffect(() => {
39-
const cleanup = formEventClient.on('form-api', (e) => {
39+
const cleanup = formEventClient.on('form-devtools:form-api', (e) => {
4040
const id = e.payload.id
4141
const existingIndex = store.findIndex((item) => item.id === id)
4242

@@ -64,7 +64,7 @@ function useProviderValue() {
6464
})
6565

6666
createEffect(() => {
67-
const cleanup = formEventClient.on('form-state', (e) => {
67+
const cleanup = formEventClient.on('form-devtools:form-state', (e) => {
6868
const id = e.payload.id
6969
const existingIndex = store.findIndex((item) => item.id === id)
7070

@@ -91,7 +91,7 @@ function useProviderValue() {
9191
})
9292

9393
createEffect(() => {
94-
const cleanup = formEventClient.on('form-submission', (e) => {
94+
const cleanup = formEventClient.on('form-devtools:form-submission', (e) => {
9595
const id = e.payload.id
9696
const existingIndex = store.findIndex((item) => item.id === id)
9797

@@ -106,7 +106,7 @@ function useProviderValue() {
106106
})
107107

108108
createEffect(() => {
109-
const cleanup = formEventClient.on('form-unmounted', (e) => {
109+
const cleanup = formEventClient.on('form-devtools:form-unmounted', (e) => {
110110
setStore((prev) => prev.filter((item) => item.id !== e.payload.id))
111111
})
112112

‎packages/form-devtools/src/core.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import { lazy } from 'solid-js'
22
import { constructCoreClass } from '@tanstack/devtools-utils/solid'
33

4-
const Component = lazy(() => import('./components'))
5-
64
export interface FormDevtoolsInit {}
75

8-
const [FormDevtoolsCore, FormDevtoolsCoreNoOp] = constructCoreClass(Component)
6+
const [FormDevtoolsCore, FormDevtoolsCoreNoOp] = constructCoreClass(
7+
() => import('./components'),
8+
)
99

1010
export { FormDevtoolsCore, FormDevtoolsCoreNoOp }

‎packages/react-form-devtools/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
"src"
5353
],
5454
"dependencies": {
55-
"@tanstack/devtools-utils": "^0.3.0",
55+
"@tanstack/devtools-utils": "^0.3.2",
5656
"@tanstack/form-devtools": "workspace:*"
5757
},
5858
"devDependencies": {

0 commit comments

Comments
 (0)