@sanity/sdk-react 0.0.0-alpha.3 → 0.0.0-alpha.30
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -100
- package/dist/index.d.ts +2390 -2
- package/dist/index.js +1119 -2
- package/dist/index.js.map +1 -1
- package/package.json +35 -49
- package/src/_exports/index.ts +2 -10
- package/src/_exports/sdk-react.ts +73 -0
- package/src/components/SDKProvider.test.tsx +103 -0
- package/src/components/SDKProvider.tsx +52 -0
- package/src/components/SanityApp.test.tsx +244 -0
- package/src/components/SanityApp.tsx +106 -0
- package/src/components/auth/AuthBoundary.test.tsx +204 -29
- package/src/components/auth/AuthBoundary.tsx +96 -19
- package/src/components/auth/ConfigurationError.ts +22 -0
- package/src/components/auth/LoginCallback.test.tsx +22 -24
- package/src/components/auth/LoginCallback.tsx +6 -16
- package/src/components/auth/LoginError.test.tsx +11 -18
- package/src/components/auth/LoginError.tsx +43 -25
- package/src/components/utils.ts +22 -0
- package/src/context/ResourceProvider.test.tsx +157 -0
- package/src/context/ResourceProvider.tsx +111 -0
- package/src/context/SanityInstanceContext.ts +4 -0
- package/src/hooks/_synchronous-groq-js.mjs +4 -0
- package/src/hooks/auth/useAuthState.tsx +4 -5
- package/src/hooks/auth/useAuthToken.tsx +1 -1
- package/src/hooks/auth/useCurrentUser.tsx +28 -4
- package/src/hooks/auth/useDashboardOrganizationId.test.tsx +42 -0
- package/src/hooks/auth/useDashboardOrganizationId.tsx +30 -0
- package/src/hooks/auth/useHandleAuthCallback.test.tsx +16 -0
- package/src/hooks/auth/{useHandleCallback.tsx → useHandleAuthCallback.tsx} +7 -6
- package/src/hooks/auth/useLogOut.test.tsx +2 -2
- package/src/hooks/auth/useLogOut.tsx +1 -1
- package/src/hooks/auth/useLoginUrl.tsx +14 -0
- package/src/hooks/auth/useVerifyOrgProjects.test.tsx +136 -0
- package/src/hooks/auth/useVerifyOrgProjects.tsx +48 -0
- package/src/hooks/client/useClient.ts +13 -33
- package/src/hooks/comlink/useFrameConnection.test.tsx +167 -0
- package/src/hooks/comlink/useFrameConnection.ts +107 -0
- package/src/hooks/comlink/useManageFavorite.test.ts +368 -0
- package/src/hooks/comlink/useManageFavorite.ts +210 -0
- package/src/hooks/comlink/useRecordDocumentHistoryEvent.test.ts +85 -0
- package/src/hooks/comlink/useRecordDocumentHistoryEvent.ts +115 -0
- package/src/hooks/comlink/useWindowConnection.test.ts +135 -0
- package/src/hooks/comlink/useWindowConnection.ts +123 -0
- package/src/hooks/context/useSanityInstance.test.tsx +157 -15
- package/src/hooks/context/useSanityInstance.ts +68 -11
- package/src/hooks/dashboard/useNavigateToStudioDocument.test.ts +276 -0
- package/src/hooks/dashboard/useNavigateToStudioDocument.ts +139 -0
- package/src/hooks/dashboard/useStudioWorkspacesByProjectIdDataset.test.tsx +291 -0
- package/src/hooks/dashboard/useStudioWorkspacesByProjectIdDataset.ts +101 -0
- package/src/hooks/datasets/useDatasets.test.ts +80 -0
- package/src/hooks/datasets/useDatasets.ts +52 -0
- package/src/hooks/document/useApplyDocumentActions.test.ts +20 -0
- package/src/hooks/document/useApplyDocumentActions.ts +124 -0
- package/src/hooks/document/useDocument.test.ts +118 -0
- package/src/hooks/document/useDocument.ts +212 -0
- package/src/hooks/document/useDocumentEvent.test.ts +62 -0
- package/src/hooks/document/useDocumentEvent.ts +94 -0
- package/src/hooks/document/useDocumentPermissions.test.ts +204 -0
- package/src/hooks/document/useDocumentPermissions.ts +131 -0
- package/src/hooks/document/useDocumentSyncStatus.test.ts +23 -0
- package/src/hooks/document/useDocumentSyncStatus.ts +61 -0
- package/src/hooks/document/useEditDocument.test.ts +196 -0
- package/src/hooks/document/useEditDocument.ts +314 -0
- package/src/hooks/documents/useDocuments.test.tsx +179 -0
- package/src/hooks/documents/useDocuments.ts +300 -0
- package/src/hooks/helpers/createCallbackHook.test.tsx +2 -2
- package/src/hooks/helpers/createCallbackHook.tsx +1 -1
- package/src/hooks/helpers/createStateSourceHook.test.tsx +67 -1
- package/src/hooks/helpers/createStateSourceHook.tsx +27 -11
- package/src/hooks/paginatedDocuments/usePaginatedDocuments.test.tsx +284 -0
- package/src/hooks/paginatedDocuments/usePaginatedDocuments.ts +353 -0
- package/src/hooks/preview/usePreview.test.tsx +85 -17
- package/src/hooks/preview/usePreview.tsx +81 -22
- package/src/hooks/projection/useProjection.test.tsx +283 -0
- package/src/hooks/projection/useProjection.ts +232 -0
- package/src/hooks/projects/useProject.test.ts +80 -0
- package/src/hooks/projects/useProject.ts +51 -0
- package/src/hooks/projects/useProjects.test.ts +77 -0
- package/src/hooks/projects/useProjects.ts +45 -0
- package/src/hooks/query/useQuery.test.tsx +188 -0
- package/src/hooks/query/useQuery.ts +193 -0
- package/src/hooks/releases/useActiveReleases.test.tsx +84 -0
- package/src/hooks/releases/useActiveReleases.ts +39 -0
- package/src/hooks/releases/usePerspective.test.tsx +120 -0
- package/src/hooks/releases/usePerspective.ts +49 -0
- package/src/hooks/users/useUsers.test.tsx +330 -0
- package/src/hooks/users/useUsers.ts +120 -0
- package/src/utils/getEnv.ts +21 -0
- package/src/version.ts +8 -0
- package/src/vite-env.d.ts +10 -0
- package/dist/_chunks-es/useLogOut.js +0 -44
- package/dist/_chunks-es/useLogOut.js.map +0 -1
- package/dist/assets/bundle-CcAyERuZ.css +0 -11
- package/dist/components.d.ts +0 -259
- package/dist/components.js +0 -301
- package/dist/components.js.map +0 -1
- package/dist/hooks.d.ts +0 -186
- package/dist/hooks.js +0 -81
- package/dist/hooks.js.map +0 -1
- package/src/_exports/components.ts +0 -13
- package/src/_exports/hooks.ts +0 -9
- package/src/components/DocumentGridLayout/DocumentGridLayout.stories.tsx +0 -113
- package/src/components/DocumentGridLayout/DocumentGridLayout.test.tsx +0 -42
- package/src/components/DocumentGridLayout/DocumentGridLayout.tsx +0 -21
- package/src/components/DocumentListLayout/DocumentListLayout.stories.tsx +0 -105
- package/src/components/DocumentListLayout/DocumentListLayout.test.tsx +0 -42
- package/src/components/DocumentListLayout/DocumentListLayout.tsx +0 -12
- package/src/components/DocumentPreviewLayout/DocumentPreviewLayout.md +0 -49
- package/src/components/DocumentPreviewLayout/DocumentPreviewLayout.stories.tsx +0 -39
- package/src/components/DocumentPreviewLayout/DocumentPreviewLayout.test.tsx +0 -30
- package/src/components/DocumentPreviewLayout/DocumentPreviewLayout.tsx +0 -171
- package/src/components/Login/LoginLinks.test.tsx +0 -100
- package/src/components/Login/LoginLinks.tsx +0 -73
- package/src/components/auth/Login.test.tsx +0 -41
- package/src/components/auth/Login.tsx +0 -45
- package/src/components/auth/LoginFooter.test.tsx +0 -29
- package/src/components/auth/LoginFooter.tsx +0 -65
- package/src/components/auth/LoginLayout.test.tsx +0 -33
- package/src/components/auth/LoginLayout.tsx +0 -81
- package/src/components/context/SanityProvider.test.tsx +0 -25
- package/src/components/context/SanityProvider.tsx +0 -42
- package/src/css/css.config.js +0 -220
- package/src/css/paramour.css +0 -2347
- package/src/css/styles.css +0 -11
- package/src/hooks/auth/useHandleCallback.test.tsx +0 -16
- package/src/hooks/auth/useLoginUrls.test.tsx +0 -68
- package/src/hooks/auth/useLoginUrls.tsx +0 -51
- package/src/hooks/client/useClient.test.tsx +0 -130
- package/src/hooks/documentCollection/useDocuments.test.ts +0 -130
- package/src/hooks/documentCollection/useDocuments.ts +0 -87
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,2395 @@
|
|
|
1
|
+
import {ActionsResult} from '@sanity/sdk'
|
|
2
|
+
import {ApplyDocumentActionsOptions} from '@sanity/sdk'
|
|
3
|
+
import {AuthState} from '@sanity/sdk'
|
|
4
|
+
import {CanvasResource} from '@sanity/message-protocol'
|
|
5
|
+
import {ClientOptions} from '@sanity/sdk'
|
|
6
|
+
import {CurrentUser} from '@sanity/sdk'
|
|
7
|
+
import {DatasetHandle} from '@sanity/sdk'
|
|
8
|
+
import {DatasetsResponse} from '@sanity/client'
|
|
9
|
+
import {DocumentAction} from '@sanity/sdk'
|
|
10
|
+
import {DocumentEvent} from '@sanity/sdk'
|
|
11
|
+
import {DocumentHandle} from '@sanity/sdk'
|
|
12
|
+
import {DocumentOptions} from '@sanity/sdk'
|
|
13
|
+
import {DocumentPermissionsResult} from '@sanity/sdk'
|
|
14
|
+
import {FallbackProps} from 'react-error-boundary'
|
|
15
|
+
import {FavoriteStatusResponse} from '@sanity/sdk'
|
|
16
|
+
import {FrameMessage} from '@sanity/sdk'
|
|
17
|
+
import {GetUsersOptions} from '@sanity/sdk'
|
|
18
|
+
import {JsonMatch} from '@sanity/sdk'
|
|
19
|
+
import {MediaResource} from '@sanity/message-protocol'
|
|
20
|
+
import {PerspectiveHandle} from '@sanity/sdk'
|
|
21
|
+
import {PreviewValue} from '@sanity/sdk'
|
|
22
|
+
import {ProjectHandle} from '@sanity/sdk'
|
|
23
|
+
import {QueryOptions} from '@sanity/sdk'
|
|
24
|
+
import {ReactElement} from 'react'
|
|
25
|
+
import {ReactNode} from 'react'
|
|
26
|
+
import {ReleaseDocument} from '@sanity/sdk'
|
|
27
|
+
import {SanityClient} from '@sanity/client'
|
|
28
|
+
import {SanityConfig} from '@sanity/sdk'
|
|
29
|
+
import {SanityDocument} from '@sanity/types'
|
|
30
|
+
import {SanityDocumentResult} from 'groq'
|
|
31
|
+
import {SanityInstance} from '@sanity/sdk'
|
|
32
|
+
import {SanityProject} from '@sanity/sdk'
|
|
33
|
+
import {SanityProject as SanityProject_2} from '@sanity/client'
|
|
34
|
+
import {SanityProjectionResult} from 'groq'
|
|
35
|
+
import {SanityProjectMember} from '@sanity/client'
|
|
36
|
+
import {SanityQueryResult} from 'groq'
|
|
37
|
+
import {SanityUser} from '@sanity/sdk'
|
|
38
|
+
import {SortOrderingItem} from '@sanity/types'
|
|
39
|
+
import {StudioResource} from '@sanity/message-protocol'
|
|
40
|
+
import {ValidProjection} from '@sanity/sdk'
|
|
41
|
+
import {WindowMessage} from '@sanity/sdk'
|
|
42
|
+
|
|
43
|
+
/**
|
|
44
|
+
* A component that handles authentication flow and error boundaries for a
|
|
45
|
+
* protected section of the application.
|
|
46
|
+
*
|
|
47
|
+
* @remarks
|
|
48
|
+
* This component manages different authentication states and renders the
|
|
49
|
+
* appropriate components based on that state.
|
|
50
|
+
*
|
|
51
|
+
* @example
|
|
52
|
+
* ```tsx
|
|
53
|
+
* function App() {
|
|
54
|
+
* return (
|
|
55
|
+
* <AuthBoundary header={<MyLogo />}>
|
|
56
|
+
* <ProtectedContent />
|
|
57
|
+
* </AuthBoundary>
|
|
58
|
+
* )
|
|
59
|
+
* }
|
|
60
|
+
* ```
|
|
61
|
+
*
|
|
62
|
+
* @internal
|
|
63
|
+
*/
|
|
64
|
+
export declare function AuthBoundary({
|
|
65
|
+
LoginErrorComponent,
|
|
66
|
+
...props
|
|
67
|
+
}: AuthBoundaryProps): React.ReactNode
|
|
68
|
+
|
|
69
|
+
/**
|
|
70
|
+
* @public
|
|
71
|
+
*/
|
|
72
|
+
export declare interface AuthBoundaryProps {
|
|
73
|
+
/**
|
|
74
|
+
* Custom component to render the login screen.
|
|
75
|
+
* Receives all props. Defaults to {@link Login}.
|
|
76
|
+
*/
|
|
77
|
+
LoginComponent?: React.ComponentType<{
|
|
78
|
+
header?: React.ReactNode
|
|
79
|
+
footer?: React.ReactNode
|
|
80
|
+
}>
|
|
81
|
+
/**
|
|
82
|
+
* Custom component to render during OAuth callback processing.
|
|
83
|
+
* Receives all props. Defaults to {@link LoginCallback}.
|
|
84
|
+
*/
|
|
85
|
+
CallbackComponent?: React.ComponentType<{
|
|
86
|
+
header?: React.ReactNode
|
|
87
|
+
footer?: React.ReactNode
|
|
88
|
+
}>
|
|
89
|
+
/**
|
|
90
|
+
* Custom component to render when authentication errors occur.
|
|
91
|
+
* Receives error boundary props and layout props. Defaults to
|
|
92
|
+
* {@link LoginError}
|
|
93
|
+
*/
|
|
94
|
+
LoginErrorComponent?: React.ComponentType<LoginErrorProps>
|
|
95
|
+
/** Header content to display */
|
|
96
|
+
header?: React.ReactNode
|
|
97
|
+
/**
|
|
98
|
+
* The project IDs to use for organization verification.
|
|
99
|
+
*/
|
|
100
|
+
projectIds?: string[]
|
|
101
|
+
/** Footer content to display */
|
|
102
|
+
footer?: React.ReactNode
|
|
103
|
+
/** Protected content to render when authenticated */
|
|
104
|
+
children?: React.ReactNode
|
|
105
|
+
/**
|
|
106
|
+
* Whether to verify that the project belongs to the organization specified in the dashboard context.
|
|
107
|
+
* By default, organization verification is enabled when running in a dashboard context.
|
|
108
|
+
*
|
|
109
|
+
* WARNING: Disabling organization verification is NOT RECOMMENDED and may cause your application
|
|
110
|
+
* to break in the future. This should never be disabled in production environments.
|
|
111
|
+
*/
|
|
112
|
+
verifyOrganization?: boolean
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
/**
|
|
116
|
+
* @public
|
|
117
|
+
*/
|
|
118
|
+
export declare type ComlinkStatus = 'idle' | 'handshaking' | 'connected' | 'disconnected'
|
|
119
|
+
|
|
120
|
+
declare interface DashboardResource {
|
|
121
|
+
id: string
|
|
122
|
+
name: string
|
|
123
|
+
title: string
|
|
124
|
+
basePath: string
|
|
125
|
+
projectId: string
|
|
126
|
+
dataset: string
|
|
127
|
+
type: string
|
|
128
|
+
userApplicationId: string
|
|
129
|
+
url: string
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
export {DatasetsResponse}
|
|
133
|
+
|
|
134
|
+
declare interface DocumentInteractionHistory {
|
|
135
|
+
recordEvent: (eventType: 'viewed' | 'edited' | 'created' | 'deleted') => void
|
|
136
|
+
isConnected: boolean
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/**
|
|
140
|
+
* Configuration options for the useDocuments hook
|
|
141
|
+
*
|
|
142
|
+
* @beta
|
|
143
|
+
* @category Types
|
|
144
|
+
*/
|
|
145
|
+
export declare interface DocumentsOptions<
|
|
146
|
+
TDocumentType extends string = string,
|
|
147
|
+
TDataset extends string = string,
|
|
148
|
+
TProjectId extends string = string,
|
|
149
|
+
> extends DatasetHandle<TDataset, TProjectId>,
|
|
150
|
+
Pick<QueryOptions, 'perspective' | 'params'> {
|
|
151
|
+
/**
|
|
152
|
+
* Filter documents by their `_type`. Can be a single type or an array of types.
|
|
153
|
+
*/
|
|
154
|
+
documentType?: TDocumentType | TDocumentType[]
|
|
155
|
+
/**
|
|
156
|
+
* GROQ filter expression to apply to the query
|
|
157
|
+
*/
|
|
158
|
+
filter?: string
|
|
159
|
+
/**
|
|
160
|
+
* Number of items to load per batch (defaults to 25)
|
|
161
|
+
*/
|
|
162
|
+
batchSize?: number
|
|
163
|
+
/**
|
|
164
|
+
* Sorting configuration for the results
|
|
165
|
+
*/
|
|
166
|
+
orderings?: SortOrderingItem[]
|
|
167
|
+
/**
|
|
168
|
+
* Text search query to filter results
|
|
169
|
+
*/
|
|
170
|
+
search?: string
|
|
171
|
+
}
|
|
172
|
+
|
|
173
|
+
/**
|
|
174
|
+
* Return value from the useDocuments hook
|
|
175
|
+
*
|
|
176
|
+
* @beta
|
|
177
|
+
* @category Types
|
|
178
|
+
*/
|
|
179
|
+
export declare interface DocumentsResponse<
|
|
180
|
+
TDocumentType extends string = string,
|
|
181
|
+
TDataset extends string = string,
|
|
182
|
+
TProjectId extends string = string,
|
|
183
|
+
> {
|
|
184
|
+
/**
|
|
185
|
+
* Array of document handles for the current batch
|
|
186
|
+
*/
|
|
187
|
+
data: DocumentHandle<TDocumentType, TDataset, TProjectId>[]
|
|
188
|
+
/**
|
|
189
|
+
* Whether there are more items available to load
|
|
190
|
+
*/
|
|
191
|
+
hasMore: boolean
|
|
192
|
+
/**
|
|
193
|
+
* Total count of items matching the query
|
|
194
|
+
*/
|
|
195
|
+
count: number
|
|
196
|
+
/**
|
|
197
|
+
* Whether a query is currently in progress
|
|
198
|
+
*/
|
|
199
|
+
isPending: boolean
|
|
200
|
+
/**
|
|
201
|
+
* Function to load the next batch of results
|
|
202
|
+
*/
|
|
203
|
+
loadMore: () => void
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
/**
|
|
207
|
+
* @internal
|
|
208
|
+
*/
|
|
209
|
+
export declare interface FrameConnection<TFrameMessage extends FrameMessage> {
|
|
210
|
+
connect: (frameWindow: Window) => () => void
|
|
211
|
+
sendMessage: <T extends TFrameMessage['type']>(
|
|
212
|
+
...params: Extract<
|
|
213
|
+
TFrameMessage,
|
|
214
|
+
{
|
|
215
|
+
type: T
|
|
216
|
+
}
|
|
217
|
+
>['data'] extends undefined
|
|
218
|
+
? [type: T]
|
|
219
|
+
: [
|
|
220
|
+
type: T,
|
|
221
|
+
data: Extract<
|
|
222
|
+
TFrameMessage,
|
|
223
|
+
{
|
|
224
|
+
type: T
|
|
225
|
+
}
|
|
226
|
+
>['data'],
|
|
227
|
+
]
|
|
228
|
+
) => void
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
/**
|
|
232
|
+
* @alpha
|
|
233
|
+
*/
|
|
234
|
+
declare type LoginErrorProps = FallbackProps
|
|
235
|
+
|
|
236
|
+
declare interface ManageFavorite extends FavoriteStatusResponse {
|
|
237
|
+
favorite: () => Promise<void>
|
|
238
|
+
unfavorite: () => Promise<void>
|
|
239
|
+
isFavorited: boolean
|
|
240
|
+
isConnected: boolean
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
/**
|
|
244
|
+
* @public
|
|
245
|
+
*/
|
|
246
|
+
declare type MessageData = Record<string, unknown> | undefined
|
|
247
|
+
|
|
248
|
+
/**
|
|
249
|
+
* @internal
|
|
250
|
+
*/
|
|
251
|
+
export declare type MessageHandler<TWindowMessage extends WindowMessage> = (
|
|
252
|
+
event: TWindowMessage['data'],
|
|
253
|
+
) => TWindowMessage['response'] | Promise<TWindowMessage['response']>
|
|
254
|
+
|
|
255
|
+
/**
|
|
256
|
+
* @public
|
|
257
|
+
* @category Types
|
|
258
|
+
*/
|
|
259
|
+
export declare interface NavigateToStudioResult {
|
|
260
|
+
navigateToStudioDocument: () => void
|
|
261
|
+
isConnected: boolean
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
/**
|
|
265
|
+
* Configuration options for the usePaginatedDocuments hook
|
|
266
|
+
*
|
|
267
|
+
* @beta
|
|
268
|
+
* @category Types
|
|
269
|
+
*/
|
|
270
|
+
export declare interface PaginatedDocumentsOptions<
|
|
271
|
+
TDocumentType extends string = string,
|
|
272
|
+
TDataset extends string = string,
|
|
273
|
+
TProjectId extends string = string,
|
|
274
|
+
> extends Omit<QueryOptions<TDocumentType, TDataset, TProjectId>, 'query'> {
|
|
275
|
+
documentType?: TDocumentType | TDocumentType[]
|
|
276
|
+
/**
|
|
277
|
+
* GROQ filter expression to apply to the query
|
|
278
|
+
*/
|
|
279
|
+
filter?: string
|
|
280
|
+
/**
|
|
281
|
+
* Number of items to display per page (defaults to 25)
|
|
282
|
+
*/
|
|
283
|
+
pageSize?: number
|
|
284
|
+
/**
|
|
285
|
+
* Sorting configuration for the results
|
|
286
|
+
*/
|
|
287
|
+
orderings?: SortOrderingItem[]
|
|
288
|
+
/**
|
|
289
|
+
* Text search query to filter results
|
|
290
|
+
*/
|
|
291
|
+
search?: string
|
|
292
|
+
}
|
|
293
|
+
|
|
294
|
+
/**
|
|
295
|
+
* Return value from the usePaginatedDocuments hook
|
|
296
|
+
*
|
|
297
|
+
* @beta
|
|
298
|
+
* @category Types
|
|
299
|
+
*/
|
|
300
|
+
export declare interface PaginatedDocumentsResponse<
|
|
301
|
+
TDocumentType extends string = string,
|
|
302
|
+
TDataset extends string = string,
|
|
303
|
+
TProjectId extends string = string,
|
|
304
|
+
> {
|
|
305
|
+
/**
|
|
306
|
+
* Array of document handles for the current page
|
|
307
|
+
*/
|
|
308
|
+
data: DocumentHandle<TDocumentType, TDataset, TProjectId>[]
|
|
309
|
+
/**
|
|
310
|
+
* Whether a query is currently in progress
|
|
311
|
+
*/
|
|
312
|
+
isPending: boolean
|
|
313
|
+
/**
|
|
314
|
+
* Number of items displayed per page
|
|
315
|
+
*/
|
|
316
|
+
pageSize: number
|
|
317
|
+
/**
|
|
318
|
+
* Current page number (1-indexed)
|
|
319
|
+
*/
|
|
320
|
+
currentPage: number
|
|
321
|
+
/**
|
|
322
|
+
* Total number of pages available
|
|
323
|
+
*/
|
|
324
|
+
totalPages: number
|
|
325
|
+
/**
|
|
326
|
+
* Starting index of the current page (0-indexed)
|
|
327
|
+
*/
|
|
328
|
+
startIndex: number
|
|
329
|
+
/**
|
|
330
|
+
* Ending index of the current page (exclusive, 0-indexed)
|
|
331
|
+
*/
|
|
332
|
+
endIndex: number
|
|
333
|
+
/**
|
|
334
|
+
* Total count of items matching the query
|
|
335
|
+
*/
|
|
336
|
+
count: number
|
|
337
|
+
/**
|
|
338
|
+
* Navigate to the first page
|
|
339
|
+
*/
|
|
340
|
+
firstPage: () => void
|
|
341
|
+
/**
|
|
342
|
+
* Whether there is a first page available to navigate to
|
|
343
|
+
*/
|
|
344
|
+
hasFirstPage: boolean
|
|
345
|
+
/**
|
|
346
|
+
* Navigate to the previous page
|
|
347
|
+
*/
|
|
348
|
+
previousPage: () => void
|
|
349
|
+
/**
|
|
350
|
+
* Whether there is a previous page available to navigate to
|
|
351
|
+
*/
|
|
352
|
+
hasPreviousPage: boolean
|
|
353
|
+
/**
|
|
354
|
+
* Navigate to the next page
|
|
355
|
+
*/
|
|
356
|
+
nextPage: () => void
|
|
357
|
+
/**
|
|
358
|
+
* Whether there is a next page available to navigate to
|
|
359
|
+
*/
|
|
360
|
+
hasNextPage: boolean
|
|
361
|
+
/**
|
|
362
|
+
* Navigate to the last page
|
|
363
|
+
*/
|
|
364
|
+
lastPage: () => void
|
|
365
|
+
/**
|
|
366
|
+
* Whether there is a last page available to navigate to
|
|
367
|
+
*/
|
|
368
|
+
hasLastPage: boolean
|
|
369
|
+
/**
|
|
370
|
+
* Navigate to a specific page number
|
|
371
|
+
* @param pageNumber - The page number to navigate to (1-indexed)
|
|
372
|
+
*/
|
|
373
|
+
goToPage: (pageNumber: number) => void
|
|
374
|
+
}
|
|
375
|
+
|
|
376
|
+
/**
|
|
377
|
+
* @public
|
|
378
|
+
* @category Types
|
|
379
|
+
* @interface
|
|
380
|
+
*/
|
|
381
|
+
export declare type ProjectWithoutMembers = Omit<SanityProject_2, 'members'>
|
|
382
|
+
|
|
383
|
+
/**
|
|
384
|
+
* This version is provided by pkg-utils at build time
|
|
385
|
+
* @internal
|
|
386
|
+
*/
|
|
387
|
+
export declare const REACT_SDK_VERSION: {}
|
|
388
|
+
|
|
389
|
+
/**
|
|
390
|
+
* Provides a Sanity instance to child components through React Context
|
|
391
|
+
*
|
|
392
|
+
* @internal
|
|
393
|
+
*
|
|
394
|
+
* @remarks
|
|
395
|
+
* The ResourceProvider creates a hierarchical structure of Sanity instances:
|
|
396
|
+
* - When used as a root provider, it creates a new Sanity instance with the given config
|
|
397
|
+
* - When nested inside another ResourceProvider, it creates a child instance that
|
|
398
|
+
* inherits and extends the parent's configuration
|
|
399
|
+
*
|
|
400
|
+
* Features:
|
|
401
|
+
* - Automatically manages the lifecycle of Sanity instances
|
|
402
|
+
* - Disposes instances when the component unmounts
|
|
403
|
+
* - Includes a Suspense boundary for data loading
|
|
404
|
+
* - Enables hierarchical configuration inheritance
|
|
405
|
+
*
|
|
406
|
+
* Use this component to:
|
|
407
|
+
* - Set up project/dataset configuration for an application
|
|
408
|
+
* - Override specific configuration values in a section of your app
|
|
409
|
+
* - Create isolated instance hierarchies for different features
|
|
410
|
+
*
|
|
411
|
+
* @example Creating a root provider
|
|
412
|
+
* ```tsx
|
|
413
|
+
* <ResourceProvider
|
|
414
|
+
* projectId="your-project-id"
|
|
415
|
+
* dataset="production"
|
|
416
|
+
* fallback={<LoadingSpinner />}
|
|
417
|
+
* >
|
|
418
|
+
* <YourApp />
|
|
419
|
+
* </ResourceProvider>
|
|
420
|
+
* ```
|
|
421
|
+
*
|
|
422
|
+
* @example Creating nested providers with configuration inheritance
|
|
423
|
+
* ```tsx
|
|
424
|
+
* // Root provider with production config with nested provider for preview features with custom dataset
|
|
425
|
+
* <ResourceProvider projectId="abc123" dataset="production" fallback={<Loading />}>
|
|
426
|
+
* <div>...Main app content</div>
|
|
427
|
+
* <Dashboard />
|
|
428
|
+
* <ResourceProvider dataset="preview" fallback={<Loading />}>
|
|
429
|
+
* <PreviewFeatures />
|
|
430
|
+
* </ResourceProvider>
|
|
431
|
+
* </ResourceProvider>
|
|
432
|
+
* ```
|
|
433
|
+
*/
|
|
434
|
+
export declare function ResourceProvider({
|
|
435
|
+
children,
|
|
436
|
+
fallback,
|
|
437
|
+
...config
|
|
438
|
+
}: ResourceProviderProps): React.ReactNode
|
|
439
|
+
|
|
440
|
+
/**
|
|
441
|
+
* Props for the ResourceProvider component
|
|
442
|
+
* @internal
|
|
443
|
+
*/
|
|
444
|
+
export declare interface ResourceProviderProps extends SanityConfig {
|
|
445
|
+
/**
|
|
446
|
+
* React node to show while content is loading
|
|
447
|
+
* Used as the fallback for the internal Suspense boundary
|
|
448
|
+
*/
|
|
449
|
+
fallback: React.ReactNode
|
|
450
|
+
children: React.ReactNode
|
|
451
|
+
}
|
|
452
|
+
|
|
453
|
+
/**
|
|
454
|
+
* @public
|
|
455
|
+
*
|
|
456
|
+
* The SanityApp component provides your Sanity application with access to your Sanity configuration,
|
|
457
|
+
* as well as application context and state which is used by the Sanity React hooks. Your application
|
|
458
|
+
* must be wrapped with the SanityApp component to function properly.
|
|
459
|
+
*
|
|
460
|
+
* The `config` prop on the SanityApp component accepts either a single {@link SanityConfig} object, or an array of them.
|
|
461
|
+
* This allows your app to work with one or more of your organization’s datasets.
|
|
462
|
+
*
|
|
463
|
+
* @remarks
|
|
464
|
+
* When passing multiple SanityConfig objects to the `config` prop, the first configuration in the array becomes the default
|
|
465
|
+
* configuration used by the App SDK Hooks.
|
|
466
|
+
*
|
|
467
|
+
* @category Components
|
|
468
|
+
* @param props - Your Sanity configuration and the React children to render
|
|
469
|
+
* @returns Your Sanity application, integrated with your Sanity configuration and application context
|
|
470
|
+
*
|
|
471
|
+
* @example
|
|
472
|
+
* ```tsx
|
|
473
|
+
* import { SanityApp, type SanityConfig } from '@sanity/sdk-react'
|
|
474
|
+
*
|
|
475
|
+
* import MyAppRoot from './Root'
|
|
476
|
+
*
|
|
477
|
+
* // Single project configuration
|
|
478
|
+
* const mySanityConfig: SanityConfig = {
|
|
479
|
+
* projectId: 'my-project-id',
|
|
480
|
+
* dataset: 'production',
|
|
481
|
+
* }
|
|
482
|
+
*
|
|
483
|
+
* // Or multiple project configurations
|
|
484
|
+
* const multipleConfigs: SanityConfig[] = [
|
|
485
|
+
* // Configuration for your main project. This will be used as the default project for hooks.
|
|
486
|
+
* {
|
|
487
|
+
* projectId: 'marketing-website-project',
|
|
488
|
+
* dataset: 'production',
|
|
489
|
+
* },
|
|
490
|
+
* // Configuration for a separate blog project
|
|
491
|
+
* {
|
|
492
|
+
* projectId: 'blog-project',
|
|
493
|
+
* dataset: 'production',
|
|
494
|
+
* },
|
|
495
|
+
* // Configuration for a separate ecommerce project
|
|
496
|
+
* {
|
|
497
|
+
* projectId: 'ecommerce-project',
|
|
498
|
+
* dataset: 'production',
|
|
499
|
+
* }
|
|
500
|
+
* ]
|
|
501
|
+
*
|
|
502
|
+
* export default function MyApp() {
|
|
503
|
+
* return (
|
|
504
|
+
* <SanityApp config={mySanityConfig} fallback={<div>Loading…</div>}>
|
|
505
|
+
* <MyAppRoot />
|
|
506
|
+
* </SanityApp>
|
|
507
|
+
* )
|
|
508
|
+
* }
|
|
509
|
+
* ```
|
|
510
|
+
*/
|
|
511
|
+
export declare function SanityApp({
|
|
512
|
+
children,
|
|
513
|
+
fallback,
|
|
514
|
+
config,
|
|
515
|
+
...props
|
|
516
|
+
}: SanityAppProps): ReactElement
|
|
517
|
+
|
|
518
|
+
/**
|
|
519
|
+
* @public
|
|
520
|
+
* @category Types
|
|
521
|
+
*/
|
|
522
|
+
export declare interface SanityAppProps {
|
|
523
|
+
config: SanityConfig | SanityConfig[]
|
|
524
|
+
/** @deprecated use the `config` prop instead. */
|
|
525
|
+
sanityConfigs?: SanityConfig[]
|
|
526
|
+
children: React.ReactNode
|
|
527
|
+
fallback: React.ReactNode
|
|
528
|
+
}
|
|
529
|
+
|
|
530
|
+
export {SanityDocument}
|
|
531
|
+
|
|
532
|
+
export {SanityProjectMember}
|
|
533
|
+
|
|
534
|
+
/**
|
|
535
|
+
* @internal
|
|
536
|
+
*
|
|
537
|
+
* Top-level context provider that provides access to the Sanity SDK.
|
|
538
|
+
* Creates a hierarchy of ResourceProviders, each providing a SanityInstance that can be
|
|
539
|
+
* accessed by hooks. The first configuration in the array becomes the default instance.
|
|
540
|
+
*/
|
|
541
|
+
export declare function SDKProvider({
|
|
542
|
+
children,
|
|
543
|
+
config,
|
|
544
|
+
fallback,
|
|
545
|
+
...props
|
|
546
|
+
}: SDKProviderProps): ReactElement
|
|
547
|
+
|
|
548
|
+
/**
|
|
549
|
+
* @internal
|
|
550
|
+
*/
|
|
551
|
+
export declare interface SDKProviderProps extends AuthBoundaryProps {
|
|
552
|
+
children: ReactNode
|
|
553
|
+
config: SanityConfig | SanityConfig[]
|
|
554
|
+
fallback: ReactNode
|
|
555
|
+
}
|
|
556
|
+
|
|
557
|
+
export {SortOrderingItem}
|
|
558
|
+
|
|
559
|
+
declare interface StudioWorkspacesResult {
|
|
560
|
+
workspacesByProjectIdAndDataset: WorkspacesByProjectIdDataset
|
|
561
|
+
error: string | null
|
|
562
|
+
isConnected: boolean
|
|
563
|
+
}
|
|
564
|
+
|
|
565
|
+
declare type Updater<TValue> = TValue | ((currentValue: TValue) => TValue)
|
|
566
|
+
|
|
567
|
+
/**
|
|
568
|
+
* @public
|
|
569
|
+
*/
|
|
570
|
+
declare type UseActiveReleases = {
|
|
571
|
+
(): ReleaseDocument[]
|
|
572
|
+
}
|
|
573
|
+
|
|
574
|
+
/**
|
|
575
|
+
* @public
|
|
576
|
+
|
|
577
|
+
* Returns the active releases for the current project,
|
|
578
|
+
* represented as a list of release documents.
|
|
579
|
+
*
|
|
580
|
+
* @returns The active releases for the current project.
|
|
581
|
+
*
|
|
582
|
+
* @example
|
|
583
|
+
* ```tsx
|
|
584
|
+
* import {useActiveReleases} from '@sanity/sdk-react'
|
|
585
|
+
*
|
|
586
|
+
* const activeReleases = useActiveReleases()
|
|
587
|
+
* ```
|
|
588
|
+
*/
|
|
589
|
+
export declare const useActiveReleases: UseActiveReleases
|
|
590
|
+
|
|
591
|
+
/**
|
|
592
|
+
* @beta
|
|
593
|
+
*/
|
|
594
|
+
declare interface UseApplyDocumentActions {
|
|
595
|
+
(): <
|
|
596
|
+
TDocumentType extends string = string,
|
|
597
|
+
TDataset extends string = string,
|
|
598
|
+
TProjectId extends string = string,
|
|
599
|
+
>(
|
|
600
|
+
action:
|
|
601
|
+
| DocumentAction<TDocumentType, TDataset, TProjectId>
|
|
602
|
+
| DocumentAction<TDocumentType, TDataset, TProjectId>[],
|
|
603
|
+
options?: ApplyDocumentActionsOptions,
|
|
604
|
+
) => Promise<ActionsResult<SanityDocumentResult<TDocumentType, TDataset, TProjectId>>>
|
|
605
|
+
}
|
|
606
|
+
|
|
607
|
+
/**
|
|
608
|
+
* @beta
|
|
609
|
+
*
|
|
610
|
+
* Provides a stable callback function for applying one or more document actions.
|
|
611
|
+
*
|
|
612
|
+
* This hook wraps the core `applyDocumentActions` functionality from `@sanity/sdk`,
|
|
613
|
+
* integrating it with the React component lifecycle and {@link SanityInstance}.
|
|
614
|
+
* It allows you to apply actions generated by functions like `createDocument`,
|
|
615
|
+
* `editDocument`, `deleteDocument`, `publishDocument`, `unpublishDocument`,
|
|
616
|
+
* and `discardDocument` to documents.
|
|
617
|
+
*
|
|
618
|
+
* Features:
|
|
619
|
+
* - Applies one or multiple `DocumentAction` objects.
|
|
620
|
+
* - Supports optimistic updates: Local state reflects changes immediately.
|
|
621
|
+
* - Handles batching: Multiple actions passed together are sent as a single atomic transaction.
|
|
622
|
+
* - Integrates with the collaborative editing engine for conflict resolution and state synchronization.
|
|
623
|
+
*
|
|
624
|
+
* @category Documents
|
|
625
|
+
* @returns A stable callback function. When called with a single `DocumentAction` or an array of `DocumentAction`s,
|
|
626
|
+
* it returns a promise that resolves to an {@link ActionsResult}. The `ActionsResult` contains information about the
|
|
627
|
+
* outcome, including optimistic results if applicable.
|
|
628
|
+
*
|
|
629
|
+
* @remarks
|
|
630
|
+
* This hook is a fundamental part of interacting with document state programmatically.
|
|
631
|
+
* It operates within the same unified pipeline as other document hooks like `useDocument` (for reading state)
|
|
632
|
+
* and {@link useEditDocument} (a higher-level hook specifically for edits).
|
|
633
|
+
*
|
|
634
|
+
* When multiple actions are provided in a single call, they are guaranteed to be submitted
|
|
635
|
+
* as a single transaction to Content Lake. This ensures atomicity for related operations (e.g., creating and publishing a document).
|
|
636
|
+
*
|
|
637
|
+
* @function
|
|
638
|
+
*
|
|
639
|
+
* @example Publish or unpublish a document
|
|
640
|
+
* ```tsx
|
|
641
|
+
* import {
|
|
642
|
+
* publishDocument,
|
|
643
|
+
* unpublishDocument,
|
|
644
|
+
* useApplyDocumentActions,
|
|
645
|
+
* type DocumentHandle
|
|
646
|
+
* } from '@sanity/sdk-react'
|
|
647
|
+
*
|
|
648
|
+
* // Define props using the DocumentHandle type
|
|
649
|
+
* interface PublishControlsProps {
|
|
650
|
+
* doc: DocumentHandle
|
|
651
|
+
* }
|
|
652
|
+
*
|
|
653
|
+
* function PublishControls({doc}: PublishControlsProps) {
|
|
654
|
+
* const apply = useApplyDocumentActions()
|
|
655
|
+
*
|
|
656
|
+
* const handlePublish = () => apply(publishDocument(doc))
|
|
657
|
+
* const handleUnpublish = () => apply(unpublishDocument(doc))
|
|
658
|
+
*
|
|
659
|
+
* return (
|
|
660
|
+
* <>
|
|
661
|
+
* <button onClick={handlePublish}>Publish</button>
|
|
662
|
+
* <button onClick={handleUnpublish}>Unpublish</button>
|
|
663
|
+
* </>
|
|
664
|
+
* )
|
|
665
|
+
* }
|
|
666
|
+
* ```
|
|
667
|
+
*
|
|
668
|
+
* @example Create and publish a new document
|
|
669
|
+
* ```tsx
|
|
670
|
+
* import {
|
|
671
|
+
* createDocument,
|
|
672
|
+
* publishDocument,
|
|
673
|
+
* createDocumentHandle,
|
|
674
|
+
* useApplyDocumentActions
|
|
675
|
+
* } from '@sanity/sdk-react'
|
|
676
|
+
*
|
|
677
|
+
* function CreateAndPublishButton({documentType}: {documentType: string}) {
|
|
678
|
+
* const apply = useApplyDocumentActions()
|
|
679
|
+
*
|
|
680
|
+
* const handleCreateAndPublish = () => {
|
|
681
|
+
* // Create a new handle inside the handler
|
|
682
|
+
* const newDocHandle = createDocumentHandle({ documentId: crypto.randomUUID(), documentType })
|
|
683
|
+
*
|
|
684
|
+
* // Apply multiple actions for the new handle as a single transaction
|
|
685
|
+
* apply([
|
|
686
|
+
* createDocument(newDocHandle),
|
|
687
|
+
* publishDocument(newDocHandle),
|
|
688
|
+
* ])
|
|
689
|
+
* }
|
|
690
|
+
*
|
|
691
|
+
* return (
|
|
692
|
+
* <button onClick={handleCreateAndPublish}>
|
|
693
|
+
* I'm feeling lucky
|
|
694
|
+
* </button>
|
|
695
|
+
* )
|
|
696
|
+
* }
|
|
697
|
+
* ```
|
|
698
|
+
*/
|
|
699
|
+
export declare const useApplyDocumentActions: UseApplyDocumentActions
|
|
700
|
+
|
|
701
|
+
/**
|
|
702
|
+
* @internal
|
|
703
|
+
* A React hook that subscribes to authentication state changes.
|
|
704
|
+
*
|
|
705
|
+
* This hook provides access to the current authentication state type from the Sanity auth store.
|
|
706
|
+
* It automatically re-renders when the authentication state changes.
|
|
707
|
+
*
|
|
708
|
+
* @remarks
|
|
709
|
+
* The hook uses `useSyncExternalStore` to safely subscribe to auth state changes
|
|
710
|
+
* and ensure consistency between server and client rendering.
|
|
711
|
+
*
|
|
712
|
+
* @returns The current authentication state type
|
|
713
|
+
*
|
|
714
|
+
* @example
|
|
715
|
+
* ```tsx
|
|
716
|
+
* function AuthStatus() {
|
|
717
|
+
* const authState = useAuthState()
|
|
718
|
+
* return <div>Current auth state: {authState}</div>
|
|
719
|
+
* }
|
|
720
|
+
* ```
|
|
721
|
+
*/
|
|
722
|
+
export declare const useAuthState: () => AuthState
|
|
723
|
+
|
|
724
|
+
/**
|
|
725
|
+
* Hook to get the currently logged in user
|
|
726
|
+
* @internal
|
|
727
|
+
* @returns The current user or null if not authenticated
|
|
728
|
+
*/
|
|
729
|
+
export declare const useAuthToken: () => string | null
|
|
730
|
+
|
|
731
|
+
/**
|
|
732
|
+
* A React hook that provides a client that subscribes to changes in your application,
|
|
733
|
+
*
|
|
734
|
+
* @remarks
|
|
735
|
+
* This hook is intended for advanced use cases and special API calls that the React SDK
|
|
736
|
+
* does not yet provide hooks for. We welcome you to get in touch with us to let us know
|
|
737
|
+
* your use cases for this!
|
|
738
|
+
*
|
|
739
|
+
* @category Platform
|
|
740
|
+
* @returns A Sanity client
|
|
741
|
+
*
|
|
742
|
+
* @example
|
|
743
|
+
* ```tsx
|
|
744
|
+
* function MyComponent() {
|
|
745
|
+
* const client = useClient({apiVersion: '2024-11-12'})
|
|
746
|
+
* const [document, setDocument] = useState(null)
|
|
747
|
+
* useEffect(async () => {
|
|
748
|
+
* const doc = client.fetch('*[_id == "myDocumentId"]')
|
|
749
|
+
* setDocument(doc)
|
|
750
|
+
* }, [])
|
|
751
|
+
* return <div>{JSON.stringify(document) ?? 'Loading...'}</div>
|
|
752
|
+
* }
|
|
753
|
+
* ```
|
|
754
|
+
*
|
|
755
|
+
* @public
|
|
756
|
+
* @function
|
|
757
|
+
*/
|
|
758
|
+
export declare const useClient: (x: ClientOptions) => SanityClient
|
|
759
|
+
|
|
760
|
+
declare type UseCurrentUser = {
|
|
761
|
+
/**
|
|
762
|
+
* @public
|
|
763
|
+
*
|
|
764
|
+
* Provides the currently authenticated user’s profile information.
|
|
765
|
+
*
|
|
766
|
+
* @category Users
|
|
767
|
+
* @returns The current user data
|
|
768
|
+
*
|
|
769
|
+
* @example Rendering a basic user profile
|
|
770
|
+
* ```
|
|
771
|
+
* const user = useCurrentUser()
|
|
772
|
+
*
|
|
773
|
+
* return (
|
|
774
|
+
* <figure>
|
|
775
|
+
* <img src={user?.profileImage} alt=`Profile image for ${user?.name}` />
|
|
776
|
+
* <h2>{user?.name}</h2>
|
|
777
|
+
* </figure>
|
|
778
|
+
* )
|
|
779
|
+
* ```
|
|
780
|
+
*/
|
|
781
|
+
(): CurrentUser | null
|
|
782
|
+
}
|
|
783
|
+
|
|
784
|
+
/**
|
|
785
|
+
* @public
|
|
786
|
+
* @function
|
|
787
|
+
* @TODO This should not return null — users of a custom app will always be authenticated via Core
|
|
788
|
+
*/
|
|
789
|
+
export declare const useCurrentUser: UseCurrentUser
|
|
790
|
+
|
|
791
|
+
/**
|
|
792
|
+
* @public
|
|
793
|
+
*
|
|
794
|
+
* A React hook that retrieves the dashboard organization ID that is currently selected in the Sanity Dashboard.
|
|
795
|
+
*
|
|
796
|
+
* @example
|
|
797
|
+
* ```tsx
|
|
798
|
+
* function DashboardComponent() {
|
|
799
|
+
* const orgId = useDashboardOrganizationId()
|
|
800
|
+
*
|
|
801
|
+
* if (!orgId) return null
|
|
802
|
+
*
|
|
803
|
+
* return <div>Organization ID: {String(orgId)}</div>
|
|
804
|
+
* }
|
|
805
|
+
* ```
|
|
806
|
+
*
|
|
807
|
+
* @category Dashboard
|
|
808
|
+
* @returns The dashboard organization ID (string | undefined)
|
|
809
|
+
*/
|
|
810
|
+
export declare function useDashboardOrganizationId(): string | undefined
|
|
811
|
+
|
|
812
|
+
declare type UseDatasets = {
|
|
813
|
+
/**
|
|
814
|
+
*
|
|
815
|
+
* Returns metadata for each dataset the current user has access to.
|
|
816
|
+
*
|
|
817
|
+
* @category Datasets
|
|
818
|
+
* @returns The metadata for your the datasets
|
|
819
|
+
*
|
|
820
|
+
* @example
|
|
821
|
+
* ```tsx
|
|
822
|
+
* const datasets = useDatasets()
|
|
823
|
+
*
|
|
824
|
+
* return (
|
|
825
|
+
* <select>
|
|
826
|
+
* {datasets.map((dataset) => (
|
|
827
|
+
* <option key={dataset.name}>{dataset.name}</option>
|
|
828
|
+
* ))}
|
|
829
|
+
* </select>
|
|
830
|
+
* )
|
|
831
|
+
* ```
|
|
832
|
+
*
|
|
833
|
+
*/
|
|
834
|
+
(): DatasetsResponse
|
|
835
|
+
}
|
|
836
|
+
|
|
837
|
+
/**
|
|
838
|
+
* @public
|
|
839
|
+
* @function
|
|
840
|
+
*/
|
|
841
|
+
export declare const useDatasets: UseDatasets
|
|
842
|
+
|
|
843
|
+
declare interface UseDocument {
|
|
844
|
+
/** @internal */
|
|
845
|
+
<TDocumentType extends string, TDataset extends string, TProjectId extends string = string>(
|
|
846
|
+
options: DocumentOptions<undefined, TDocumentType, TDataset, TProjectId>,
|
|
847
|
+
): SanityDocumentResult<TDocumentType, TDataset, TProjectId> | null
|
|
848
|
+
/** @internal */
|
|
849
|
+
<
|
|
850
|
+
TPath extends string,
|
|
851
|
+
TDocumentType extends string,
|
|
852
|
+
TDataset extends string = string,
|
|
853
|
+
TProjectId extends string = string,
|
|
854
|
+
>(
|
|
855
|
+
options: DocumentOptions<TPath, TDocumentType, TDataset, TProjectId>,
|
|
856
|
+
): JsonMatch<SanityDocumentResult<TDocumentType, TDataset, TProjectId>, TPath> | undefined
|
|
857
|
+
/** @internal */
|
|
858
|
+
<TData>(options: DocumentOptions<undefined>): TData | null
|
|
859
|
+
/** @internal */
|
|
860
|
+
<TData>(options: DocumentOptions<string>): TData | undefined
|
|
861
|
+
/**
|
|
862
|
+
* ## useDocument via Type Inference (Recommended)
|
|
863
|
+
*
|
|
864
|
+
* @beta
|
|
865
|
+
*
|
|
866
|
+
* The preferred way to use this hook when working with Sanity Typegen.
|
|
867
|
+
*
|
|
868
|
+
* Features:
|
|
869
|
+
* - Automatically infers document types from your schema
|
|
870
|
+
* - Provides type-safe access to documents and nested fields
|
|
871
|
+
* - Supports project/dataset-specific type inference
|
|
872
|
+
* - Works seamlessly with Typegen-generated types
|
|
873
|
+
*
|
|
874
|
+
* This hook will suspend while the document data is being fetched and loaded.
|
|
875
|
+
*
|
|
876
|
+
* When fetching a full document:
|
|
877
|
+
* - Returns the complete document object if it exists
|
|
878
|
+
* - Returns `null` if the document doesn't exist
|
|
879
|
+
*
|
|
880
|
+
* When fetching with a path:
|
|
881
|
+
* - Returns the value at the specified path if both the document and path exist
|
|
882
|
+
* - Returns `undefined` if either the document doesn't exist or the path doesn't exist in the document
|
|
883
|
+
*
|
|
884
|
+
* @category Documents
|
|
885
|
+
* @param options - Configuration including `documentId`, `documentType`, and optionally:
|
|
886
|
+
* - `path`: To select a nested value (returns typed value at path)
|
|
887
|
+
* - `projectId`/`dataset`: For multi-project/dataset setups
|
|
888
|
+
* @returns The document state (or nested value if path provided).
|
|
889
|
+
*
|
|
890
|
+
* @example Basic document fetch
|
|
891
|
+
* ```tsx
|
|
892
|
+
* import {useDocument, type DocumentHandle} from '@sanity/sdk-react'
|
|
893
|
+
*
|
|
894
|
+
* interface ProductViewProps {
|
|
895
|
+
* doc: DocumentHandle<'product'> // Typegen infers product type
|
|
896
|
+
* }
|
|
897
|
+
*
|
|
898
|
+
* function ProductView({doc}: ProductViewProps) {
|
|
899
|
+
* const product = useDocument({...doc}) // Fully typed product
|
|
900
|
+
* return <h1>{product.title ?? 'Untitled'}</h1>
|
|
901
|
+
* }
|
|
902
|
+
* ```
|
|
903
|
+
*
|
|
904
|
+
* @example Fetching a specific field
|
|
905
|
+
* ```tsx
|
|
906
|
+
* import {useDocument, type DocumentHandle} from '@sanity/sdk-react'
|
|
907
|
+
*
|
|
908
|
+
* interface ProductTitleProps {
|
|
909
|
+
* doc: DocumentHandle<'product'>
|
|
910
|
+
* }
|
|
911
|
+
*
|
|
912
|
+
* function ProductTitle({doc}: ProductTitleProps) {
|
|
913
|
+
* const title = useDocument({
|
|
914
|
+
* ...doc,
|
|
915
|
+
* path: 'title' // Returns just the title field
|
|
916
|
+
* })
|
|
917
|
+
* return <h1>{title ?? 'Untitled'}</h1>
|
|
918
|
+
* }
|
|
919
|
+
* ```
|
|
920
|
+
*
|
|
921
|
+
* @inlineType DocumentOptions
|
|
922
|
+
*/
|
|
923
|
+
<
|
|
924
|
+
TPath extends string | undefined = undefined,
|
|
925
|
+
TDocumentType extends string = string,
|
|
926
|
+
TDataset extends string = string,
|
|
927
|
+
TProjectId extends string = string,
|
|
928
|
+
>(
|
|
929
|
+
options: DocumentOptions<TPath, TDocumentType, TDataset, TProjectId>,
|
|
930
|
+
): TPath extends string
|
|
931
|
+
? JsonMatch<SanityDocumentResult<TDocumentType, TDataset, TProjectId>, TPath> | undefined
|
|
932
|
+
: SanityDocumentResult<TDocumentType, TDataset, TProjectId> | null
|
|
933
|
+
/**
|
|
934
|
+
* @beta
|
|
935
|
+
*
|
|
936
|
+
* ## useDocument via Explicit Types
|
|
937
|
+
*
|
|
938
|
+
* Use this version when:
|
|
939
|
+
* - You're not using Sanity Typegen
|
|
940
|
+
* - You need to manually specify document types
|
|
941
|
+
* - You're working with dynamic document types
|
|
942
|
+
*
|
|
943
|
+
* Key differences from Typegen version:
|
|
944
|
+
* - Requires manual type specification via `TData`
|
|
945
|
+
* - Returns `TData | null` for full documents
|
|
946
|
+
* - Returns `TData | undefined` for nested values
|
|
947
|
+
*
|
|
948
|
+
* This hook will suspend while the document data is being fetched.
|
|
949
|
+
*
|
|
950
|
+
* @typeParam TData - The explicit type for the document or field
|
|
951
|
+
* @typeParam TPath - Optional path to a nested value
|
|
952
|
+
* @param options - Configuration including `documentId` and optionally:
|
|
953
|
+
* - `path`: To select a nested value
|
|
954
|
+
* - `projectId`/`dataset`: For multi-project/dataset setups
|
|
955
|
+
* @returns The document state (or nested value if path provided)
|
|
956
|
+
*
|
|
957
|
+
* @example Basic document fetch with explicit type
|
|
958
|
+
* ```tsx
|
|
959
|
+
* import {useDocument, type DocumentHandle, type SanityDocument} from '@sanity/sdk-react'
|
|
960
|
+
*
|
|
961
|
+
* interface Book extends SanityDocument {
|
|
962
|
+
* _type: 'book'
|
|
963
|
+
* title: string
|
|
964
|
+
* author: string
|
|
965
|
+
* }
|
|
966
|
+
*
|
|
967
|
+
* interface BookViewProps {
|
|
968
|
+
* doc: DocumentHandle
|
|
969
|
+
* }
|
|
970
|
+
*
|
|
971
|
+
* function BookView({doc}: BookViewProps) {
|
|
972
|
+
* const book = useDocument<Book>({...doc})
|
|
973
|
+
* return <h1>{book?.title ?? 'Untitled'} by {book?.author ?? 'Unknown'}</h1>
|
|
974
|
+
* }
|
|
975
|
+
* ```
|
|
976
|
+
*
|
|
977
|
+
* @example Fetching a specific field with explicit type
|
|
978
|
+
* ```tsx
|
|
979
|
+
* import {useDocument, type DocumentHandle} from '@sanity/sdk-react'
|
|
980
|
+
*
|
|
981
|
+
* interface BookTitleProps {
|
|
982
|
+
* doc: DocumentHandle
|
|
983
|
+
* }
|
|
984
|
+
*
|
|
985
|
+
* function BookTitle({doc}: BookTitleProps) {
|
|
986
|
+
* const title = useDocument<string>({...doc, path: 'title'})
|
|
987
|
+
* return <h1>{title ?? 'Untitled'}</h1>
|
|
988
|
+
* }
|
|
989
|
+
* ```
|
|
990
|
+
*
|
|
991
|
+
* @inlineType DocumentOptions
|
|
992
|
+
*/
|
|
993
|
+
<TData, TPath extends string>(
|
|
994
|
+
options: DocumentOptions<TPath>,
|
|
995
|
+
): TPath extends string ? TData | undefined : TData | null
|
|
996
|
+
/**
|
|
997
|
+
* @internal
|
|
998
|
+
*/
|
|
999
|
+
(options: DocumentOptions): unknown
|
|
1000
|
+
}
|
|
1001
|
+
|
|
1002
|
+
/**
|
|
1003
|
+
* @beta
|
|
1004
|
+
* Reads and subscribes to a document's realtime state, incorporating both local and remote changes.
|
|
1005
|
+
*
|
|
1006
|
+
* This hook comes in two main flavors to suit your needs:
|
|
1007
|
+
*
|
|
1008
|
+
* 1. **[Type Inference](#usedocument-via-type-inference-recommended)** (Recommended) - Automatically gets types from your Sanity schema
|
|
1009
|
+
* 2. **[Explicit Types](#usedocument-via-explicit-types)** - Manually specify types when needed
|
|
1010
|
+
*
|
|
1011
|
+
* @remarks
|
|
1012
|
+
* `useDocument` is ideal for realtime editing interfaces where you need immediate feedback on changes.
|
|
1013
|
+
* However, it can be resource-intensive since it maintains a realtime connection.
|
|
1014
|
+
*
|
|
1015
|
+
* For simpler cases where:
|
|
1016
|
+
* - You only need to display content
|
|
1017
|
+
* - Realtime updates aren't critical
|
|
1018
|
+
* - You want better performance
|
|
1019
|
+
*
|
|
1020
|
+
* …consider using {@link useProjection} or {@link useQuery} instead. These hooks are more efficient
|
|
1021
|
+
* for read-heavy applications.
|
|
1022
|
+
*
|
|
1023
|
+
* @function
|
|
1024
|
+
*/
|
|
1025
|
+
export declare const useDocument: UseDocument
|
|
1026
|
+
|
|
1027
|
+
/**
|
|
1028
|
+
*
|
|
1029
|
+
* @beta
|
|
1030
|
+
*
|
|
1031
|
+
* Subscribes an event handler to events in your application's document store.
|
|
1032
|
+
*
|
|
1033
|
+
* @category Documents
|
|
1034
|
+
* @param options - An object containing the event handler (`onEvent`) and optionally a `DatasetHandle` (projectId and dataset). If the handle is not provided, the nearest Sanity instance from context will be used.
|
|
1035
|
+
* @example Creating a custom hook for document event toasts
|
|
1036
|
+
* ```tsx
|
|
1037
|
+
* import {createDatasetHandle, type DatasetHandle, type DocumentEvent, useDocumentEvent} from '@sanity/sdk-react'
|
|
1038
|
+
* import {useToast} from './my-ui-library'
|
|
1039
|
+
*
|
|
1040
|
+
* // Define options for the custom hook, extending DatasetHandle
|
|
1041
|
+
* interface DocumentToastsOptions extends DatasetHandle {
|
|
1042
|
+
* // Could add more options, e.g., { includeEvents: DocumentEvent['type'][] }
|
|
1043
|
+
* }
|
|
1044
|
+
*
|
|
1045
|
+
* // Define the custom hook
|
|
1046
|
+
* function useDocumentToasts({...datasetHandle}: DocumentToastsOptions = {}) {
|
|
1047
|
+
* const showToast = useToast() // Get the toast function
|
|
1048
|
+
*
|
|
1049
|
+
* // Define the event handler logic to show toasts on specific events
|
|
1050
|
+
* const handleEvent = (event: DocumentEvent) => {
|
|
1051
|
+
* if (event.type === 'published') {
|
|
1052
|
+
* showToast(`Document ${event.documentId} published.`)
|
|
1053
|
+
* } else if (event.type === 'unpublished') {
|
|
1054
|
+
* showToast(`Document ${event.documentId} unpublished.`)
|
|
1055
|
+
* } else if (event.type === 'deleted') {
|
|
1056
|
+
* showToast(`Document ${event.documentId} deleted.`)
|
|
1057
|
+
* } else {
|
|
1058
|
+
* // Optionally log other events for debugging
|
|
1059
|
+
* console.log('Document Event:', event.type, event.documentId)
|
|
1060
|
+
* }
|
|
1061
|
+
* }
|
|
1062
|
+
*
|
|
1063
|
+
* // Call the original hook, spreading the handle properties
|
|
1064
|
+
* useDocumentEvent({
|
|
1065
|
+
* ...datasetHandle, // Spread the dataset handle (projectId, dataset)
|
|
1066
|
+
* onEvent: handleEvent,
|
|
1067
|
+
* })
|
|
1068
|
+
* }
|
|
1069
|
+
*
|
|
1070
|
+
* function MyComponentWithToasts() {
|
|
1071
|
+
* // Use the custom hook, passing specific handle info
|
|
1072
|
+
* const specificHandle = createDatasetHandle({ projectId: 'p1', dataset: 'ds1' })
|
|
1073
|
+
* useDocumentToasts(specificHandle)
|
|
1074
|
+
*
|
|
1075
|
+
* // // Or use it relying on context for the handle
|
|
1076
|
+
* // useDocumentToasts()
|
|
1077
|
+
*
|
|
1078
|
+
* return <div>...</div>
|
|
1079
|
+
* }
|
|
1080
|
+
* ```
|
|
1081
|
+
*/
|
|
1082
|
+
export declare function useDocumentEvent<
|
|
1083
|
+
TDataset extends string = string,
|
|
1084
|
+
TProjectId extends string = string,
|
|
1085
|
+
>(options: UseDocumentEventOptions<TDataset, TProjectId>): void
|
|
1086
|
+
|
|
1087
|
+
/**
|
|
1088
|
+
* @beta
|
|
1089
|
+
*/
|
|
1090
|
+
declare interface UseDocumentEventOptions<
|
|
1091
|
+
TDataset extends string = string,
|
|
1092
|
+
TProjectId extends string = string,
|
|
1093
|
+
> extends DatasetHandle<TDataset, TProjectId> {
|
|
1094
|
+
onEvent: (documentEvent: DocumentEvent) => void
|
|
1095
|
+
}
|
|
1096
|
+
|
|
1097
|
+
/**
|
|
1098
|
+
*
|
|
1099
|
+
* @public
|
|
1100
|
+
*
|
|
1101
|
+
* Check if the current user has the specified permissions for the given document actions.
|
|
1102
|
+
*
|
|
1103
|
+
* @category Permissions
|
|
1104
|
+
* @param actionOrActions - One or more document action functions (e.g., `publishDocument(handle)`).
|
|
1105
|
+
* @returns An object that specifies whether the action is allowed; if the action is not allowed, an explanatory message and list of reasons is also provided.
|
|
1106
|
+
*
|
|
1107
|
+
* @remarks
|
|
1108
|
+
* When passing multiple actions, all actions must belong to the same project and dataset.
|
|
1109
|
+
* Note, however, that you can check permissions on multiple documents from the same project and dataset (as in the second example below).
|
|
1110
|
+
*
|
|
1111
|
+
* @example Checking for permission to publish a document
|
|
1112
|
+
* ```tsx
|
|
1113
|
+
* import {
|
|
1114
|
+
* useDocumentPermissions,
|
|
1115
|
+
* useApplyDocumentActions,
|
|
1116
|
+
* publishDocument,
|
|
1117
|
+
* createDocumentHandle,
|
|
1118
|
+
* type DocumentHandle
|
|
1119
|
+
* } from '@sanity/sdk-react'
|
|
1120
|
+
*
|
|
1121
|
+
* // Define props using the DocumentHandle type
|
|
1122
|
+
* interface PublishButtonProps {
|
|
1123
|
+
* doc: DocumentHandle
|
|
1124
|
+
* }
|
|
1125
|
+
*
|
|
1126
|
+
* function PublishButton({doc}: PublishButtonProps) {
|
|
1127
|
+
* const publishAction = publishDocument(doc)
|
|
1128
|
+
*
|
|
1129
|
+
* // Pass the same action call to check permissions
|
|
1130
|
+
* const publishPermissions = useDocumentPermissions(publishAction)
|
|
1131
|
+
* const apply = useApplyDocumentActions()
|
|
1132
|
+
*
|
|
1133
|
+
* return (
|
|
1134
|
+
* <>
|
|
1135
|
+
* <button
|
|
1136
|
+
* disabled={!publishPermissions.allowed}
|
|
1137
|
+
* // Pass the same action call to apply the action
|
|
1138
|
+
* onClick={() => apply(publishAction)}
|
|
1139
|
+
* popoverTarget={`${publishPermissions.allowed ? undefined : 'publishButtonPopover'}`}
|
|
1140
|
+
* >
|
|
1141
|
+
* Publish
|
|
1142
|
+
* </button>
|
|
1143
|
+
* {!publishPermissions.allowed && (
|
|
1144
|
+
* <div popover id="publishButtonPopover">
|
|
1145
|
+
* {publishPermissions.message}
|
|
1146
|
+
* </div>
|
|
1147
|
+
* )}
|
|
1148
|
+
* </>
|
|
1149
|
+
* )
|
|
1150
|
+
* }
|
|
1151
|
+
*
|
|
1152
|
+
* // Usage:
|
|
1153
|
+
* // const doc = createDocumentHandle({ documentId: 'doc1', documentType: 'myType' })
|
|
1154
|
+
* // <PublishButton doc={doc} />
|
|
1155
|
+
* ```
|
|
1156
|
+
*
|
|
1157
|
+
* @example Checking for permissions to edit multiple documents
|
|
1158
|
+
* ```tsx
|
|
1159
|
+
* import {
|
|
1160
|
+
* useDocumentPermissions,
|
|
1161
|
+
* editDocument,
|
|
1162
|
+
* type DocumentHandle
|
|
1163
|
+
* } from '@sanity/sdk-react'
|
|
1164
|
+
*
|
|
1165
|
+
* export default function canEditMultiple(docHandles: DocumentHandle[]) {
|
|
1166
|
+
* // Create an array containing an editDocument action for each of the document handles
|
|
1167
|
+
* const editActions = docHandles.map(doc => editDocument(doc))
|
|
1168
|
+
*
|
|
1169
|
+
* // Return the result of checking for edit permissions on all of the document handles
|
|
1170
|
+
* return useDocumentPermissions(editActions)
|
|
1171
|
+
* }
|
|
1172
|
+
* ```
|
|
1173
|
+
*/
|
|
1174
|
+
export declare function useDocumentPermissions(
|
|
1175
|
+
actionOrActions: DocumentAction | DocumentAction[],
|
|
1176
|
+
): DocumentPermissionsResult
|
|
1177
|
+
|
|
1178
|
+
/**
|
|
1179
|
+
* Retrieves batches of {@link DocumentHandle}s, narrowed by optional filters, text searches, and custom ordering,
|
|
1180
|
+
* with infinite scrolling support. The number of document handles returned per batch is customizable,
|
|
1181
|
+
* and additional batches can be loaded using the supplied `loadMore` function.
|
|
1182
|
+
*
|
|
1183
|
+
* @beta
|
|
1184
|
+
* @category Documents
|
|
1185
|
+
* @param options - Configuration options for the infinite list
|
|
1186
|
+
* @returns An object containing the list of document handles, the loading state, the total count of retrieved document handles, and a function to load more
|
|
1187
|
+
*
|
|
1188
|
+
* @remarks
|
|
1189
|
+
* - The returned document handles include projectId and dataset information from the current Sanity instance
|
|
1190
|
+
* - This makes them ready to use with document operations and other document hooks
|
|
1191
|
+
* - The hook automatically uses the correct Sanity instance based on the projectId and dataset in the options
|
|
1192
|
+
*
|
|
1193
|
+
* @example Basic infinite list with loading more
|
|
1194
|
+
* ```tsx
|
|
1195
|
+
* import {
|
|
1196
|
+
* useDocuments,
|
|
1197
|
+
* createDatasetHandle,
|
|
1198
|
+
* type DatasetHandle,
|
|
1199
|
+
* type DocumentHandle,
|
|
1200
|
+
* type SortOrderingItem
|
|
1201
|
+
* } from '@sanity/sdk-react'
|
|
1202
|
+
* import {Suspense} from 'react'
|
|
1203
|
+
*
|
|
1204
|
+
* // Define a component to display a single document (using useProjection for efficiency)
|
|
1205
|
+
* function MyDocumentComponent({doc}: {doc: DocumentHandle}) {
|
|
1206
|
+
* const {data} = useProjection<{title?: string}>({
|
|
1207
|
+
* ...doc, // Pass the full handle
|
|
1208
|
+
* projection: '{title}'
|
|
1209
|
+
* })
|
|
1210
|
+
*
|
|
1211
|
+
* return <>{data?.title || 'Untitled'}</>
|
|
1212
|
+
* }
|
|
1213
|
+
*
|
|
1214
|
+
* // Define props for the list component
|
|
1215
|
+
* interface DocumentListProps {
|
|
1216
|
+
* dataset: DatasetHandle
|
|
1217
|
+
* documentType: string
|
|
1218
|
+
* search?: string
|
|
1219
|
+
* }
|
|
1220
|
+
*
|
|
1221
|
+
* function DocumentList({dataset, documentType, search}: DocumentListProps) {
|
|
1222
|
+
* const { data, hasMore, isPending, loadMore, count } = useDocuments({
|
|
1223
|
+
* ...dataset,
|
|
1224
|
+
* documentType,
|
|
1225
|
+
* search,
|
|
1226
|
+
* batchSize: 10,
|
|
1227
|
+
* orderings: [{field: '_createdAt', direction: 'desc'}],
|
|
1228
|
+
* })
|
|
1229
|
+
*
|
|
1230
|
+
* return (
|
|
1231
|
+
* <div>
|
|
1232
|
+
* <p>Total documents: {count}</p>
|
|
1233
|
+
* <ol>
|
|
1234
|
+
* {data.map((docHandle) => (
|
|
1235
|
+
* <li key={docHandle.documentId}>
|
|
1236
|
+
* <Suspense fallback="Loading…">
|
|
1237
|
+
* <MyDocumentComponent docHandle={docHandle} />
|
|
1238
|
+
* </Suspense>
|
|
1239
|
+
* </li>
|
|
1240
|
+
* ))}
|
|
1241
|
+
* </ol>
|
|
1242
|
+
* {hasMore && (
|
|
1243
|
+
* <button onClick={loadMore}>
|
|
1244
|
+
* {isPending ? 'Loading...' : 'Load More'}
|
|
1245
|
+
* </button>
|
|
1246
|
+
* )}
|
|
1247
|
+
* </div>
|
|
1248
|
+
* )
|
|
1249
|
+
* }
|
|
1250
|
+
*
|
|
1251
|
+
* // Usage:
|
|
1252
|
+
* // const myDatasetHandle = createDatasetHandle({ projectId: 'p1', dataset: 'production' })
|
|
1253
|
+
* // <DocumentList dataset={myDatasetHandle} documentType="post" search="Sanity" />
|
|
1254
|
+
* ```
|
|
1255
|
+
*
|
|
1256
|
+
* @example Using `filter` and `params` options for narrowing a collection
|
|
1257
|
+
* ```tsx
|
|
1258
|
+
* import {useState} from 'react'
|
|
1259
|
+
* import {useDocuments} from '@sanity/sdk-react'
|
|
1260
|
+
*
|
|
1261
|
+
* export default function FilteredAuthors() {
|
|
1262
|
+
* const [max, setMax] = useState(2)
|
|
1263
|
+
* const {data} = useDocuments({
|
|
1264
|
+
* documentType: 'author',
|
|
1265
|
+
* filter: 'length(books) <= $max',
|
|
1266
|
+
* params: {max},
|
|
1267
|
+
* })
|
|
1268
|
+
*
|
|
1269
|
+
* return (
|
|
1270
|
+
* <>
|
|
1271
|
+
* <input
|
|
1272
|
+
* id="maxBooks"
|
|
1273
|
+
* type="number"
|
|
1274
|
+
* value={max}
|
|
1275
|
+
* onChange={e => setMax(e.currentTarget.value)}
|
|
1276
|
+
* />
|
|
1277
|
+
* {data.map(author => (
|
|
1278
|
+
* <Suspense key={author.documentId}>
|
|
1279
|
+
* <MyAuthorComponent documentHandle={author} />
|
|
1280
|
+
* </Suspense>
|
|
1281
|
+
* ))}
|
|
1282
|
+
* </>
|
|
1283
|
+
* )
|
|
1284
|
+
* }
|
|
1285
|
+
* ```
|
|
1286
|
+
*/
|
|
1287
|
+
export declare function useDocuments<
|
|
1288
|
+
TDocumentType extends string = string,
|
|
1289
|
+
TDataset extends string = string,
|
|
1290
|
+
TProjectId extends string = string,
|
|
1291
|
+
>({
|
|
1292
|
+
batchSize,
|
|
1293
|
+
params,
|
|
1294
|
+
search,
|
|
1295
|
+
filter,
|
|
1296
|
+
orderings,
|
|
1297
|
+
documentType,
|
|
1298
|
+
...options
|
|
1299
|
+
}: DocumentsOptions<TDocumentType, TDataset, TProjectId>): DocumentsResponse<
|
|
1300
|
+
TDocumentType,
|
|
1301
|
+
TDataset,
|
|
1302
|
+
TProjectId
|
|
1303
|
+
>
|
|
1304
|
+
|
|
1305
|
+
declare type UseDocumentSyncStatus = {
|
|
1306
|
+
/**
|
|
1307
|
+
* Exposes the document's sync status between local and remote document states.
|
|
1308
|
+
*
|
|
1309
|
+
* @category Documents
|
|
1310
|
+
* @param doc - The document handle to get sync status for. If you pass a `DocumentHandle` with specified `projectId` and `dataset`,
|
|
1311
|
+
* the document will be read from the specified Sanity project and dataset that is included in the handle. If no `projectId` or `dataset` is provided,
|
|
1312
|
+
* the document will use the nearest instance from context.
|
|
1313
|
+
* @returns `true` if local changes are synced with remote, `false` if changes are pending. Note: Suspense handles loading states.
|
|
1314
|
+
* @example Show sync status indicator
|
|
1315
|
+
* ```tsx
|
|
1316
|
+
* import {useDocumentSyncStatus, createDocumentHandle, type DocumentHandle} from '@sanity/sdk-react'
|
|
1317
|
+
*
|
|
1318
|
+
* // Define props including the DocumentHandle type
|
|
1319
|
+
* interface SyncIndicatorProps {
|
|
1320
|
+
* doc: DocumentHandle
|
|
1321
|
+
* }
|
|
1322
|
+
*
|
|
1323
|
+
* function SyncIndicator({doc}: SyncIndicatorProps) {
|
|
1324
|
+
* const isSynced = useDocumentSyncStatus(doc)
|
|
1325
|
+
*
|
|
1326
|
+
* return (
|
|
1327
|
+
* <div className={`sync-status ${isSynced ? 'synced' : 'pending'}`}>
|
|
1328
|
+
* {isSynced ? '✓ Synced' : 'Saving changes...'}
|
|
1329
|
+
* </div>
|
|
1330
|
+
* )
|
|
1331
|
+
* }
|
|
1332
|
+
*
|
|
1333
|
+
* // Usage:
|
|
1334
|
+
* // const doc = createDocumentHandle({ documentId: 'doc1', documentType: 'myType' })
|
|
1335
|
+
* // <SyncIndicator doc={doc} />
|
|
1336
|
+
* ```
|
|
1337
|
+
*/
|
|
1338
|
+
(doc: DocumentHandle): boolean
|
|
1339
|
+
}
|
|
1340
|
+
|
|
1341
|
+
/**
|
|
1342
|
+
* @beta
|
|
1343
|
+
* @function
|
|
1344
|
+
*/
|
|
1345
|
+
export declare const useDocumentSyncStatus: UseDocumentSyncStatus
|
|
1346
|
+
|
|
1347
|
+
/**
|
|
1348
|
+
* @beta
|
|
1349
|
+
* Edit an entire document, relying on Typegen for the type.
|
|
1350
|
+
*
|
|
1351
|
+
* @param options - Document options including `documentId`, `documentType`, and optionally `projectId`/`dataset`.
|
|
1352
|
+
* @returns A stable function to update the document state. Accepts either the new document state or an updater function `(currentValue) => nextValue`.
|
|
1353
|
+
* Returns a promise resolving to the {@link ActionsResult}.
|
|
1354
|
+
*/
|
|
1355
|
+
export declare function useEditDocument<
|
|
1356
|
+
TDocumentType extends string = string,
|
|
1357
|
+
TDataset extends string = string,
|
|
1358
|
+
TProjectId extends string = string,
|
|
1359
|
+
>(
|
|
1360
|
+
options: DocumentOptions<undefined, TDocumentType, TDataset, TProjectId>,
|
|
1361
|
+
): (
|
|
1362
|
+
nextValue: Updater<SanityDocumentResult<TDocumentType, TDataset, TProjectId>>,
|
|
1363
|
+
) => Promise<ActionsResult<SanityDocumentResult<TDocumentType, TDataset, TProjectId>>>
|
|
1364
|
+
|
|
1365
|
+
/**
|
|
1366
|
+
* @beta
|
|
1367
|
+
* Edit a specific path within a document, relying on Typegen for the type.
|
|
1368
|
+
*
|
|
1369
|
+
* @param options - Document options including `documentId`, `documentType`, `path`, and optionally `projectId`/`dataset`.
|
|
1370
|
+
* @returns A stable function to update the value at the specified path. Accepts either the new value or an updater function `(currentValue) => nextValue`.
|
|
1371
|
+
* Returns a promise resolving to the {@link ActionsResult}.
|
|
1372
|
+
*/
|
|
1373
|
+
export declare function useEditDocument<
|
|
1374
|
+
TPath extends string = string,
|
|
1375
|
+
TDocumentType extends string = string,
|
|
1376
|
+
TDataset extends string = string,
|
|
1377
|
+
TProjectId extends string = string,
|
|
1378
|
+
>(
|
|
1379
|
+
options: DocumentOptions<TPath, TDocumentType, TDataset, TProjectId>,
|
|
1380
|
+
): (
|
|
1381
|
+
nextValue: Updater<JsonMatch<SanityDocumentResult<TDocumentType, TDataset, TProjectId>, TPath>>,
|
|
1382
|
+
) => Promise<ActionsResult<SanityDocumentResult<TDocumentType, TDataset, TProjectId>>>
|
|
1383
|
+
|
|
1384
|
+
/**
|
|
1385
|
+
* @beta
|
|
1386
|
+
* Edit an entire document with an explicit type `TData`.
|
|
1387
|
+
*
|
|
1388
|
+
* @param options - Document options including `documentId` and optionally `projectId`/`dataset`.
|
|
1389
|
+
* @returns A stable function to update the document state. Accepts either the new document state (`TData`) or an updater function `(currentValue: TData) => nextValue: TData`.
|
|
1390
|
+
* Returns a promise resolving to the {@link ActionsResult}.
|
|
1391
|
+
*/
|
|
1392
|
+
export declare function useEditDocument<TData>(
|
|
1393
|
+
options: DocumentOptions<undefined>,
|
|
1394
|
+
): (nextValue: Updater<TData>) => Promise<ActionsResult>
|
|
1395
|
+
|
|
1396
|
+
/**
|
|
1397
|
+
* @beta
|
|
1398
|
+
* Edit a specific path within a document with an explicit type `TData`.
|
|
1399
|
+
*
|
|
1400
|
+
* @param options - Document options including `documentId`, `path`, and optionally `projectId`/`dataset`.
|
|
1401
|
+
* @returns A stable function to update the value at the specified path. Accepts either the new value (`TData`) or an updater function `(currentValue: TData) => nextValue: TData`.
|
|
1402
|
+
* Returns a promise resolving to the {@link ActionsResult}.
|
|
1403
|
+
*/
|
|
1404
|
+
export declare function useEditDocument<TData>(
|
|
1405
|
+
options: DocumentOptions<string>,
|
|
1406
|
+
): (nextValue: Updater<TData>) => Promise<ActionsResult>
|
|
1407
|
+
|
|
1408
|
+
/**
|
|
1409
|
+
* @internal
|
|
1410
|
+
*/
|
|
1411
|
+
export declare function useFrameConnection<
|
|
1412
|
+
TFrameMessage extends FrameMessage,
|
|
1413
|
+
TWindowMessage extends WindowMessage,
|
|
1414
|
+
>(options: UseFrameConnectionOptions<TWindowMessage>): FrameConnection<TFrameMessage>
|
|
1415
|
+
|
|
1416
|
+
/**
|
|
1417
|
+
* @internal
|
|
1418
|
+
*/
|
|
1419
|
+
export declare interface UseFrameConnectionOptions<TWindowMessage extends WindowMessage> {
|
|
1420
|
+
name: string
|
|
1421
|
+
connectTo: string
|
|
1422
|
+
targetOrigin: string
|
|
1423
|
+
onMessage?: {
|
|
1424
|
+
[K in TWindowMessage['type']]: (
|
|
1425
|
+
data: Extract<
|
|
1426
|
+
TWindowMessage,
|
|
1427
|
+
{
|
|
1428
|
+
type: K
|
|
1429
|
+
}
|
|
1430
|
+
>['data'],
|
|
1431
|
+
) => void
|
|
1432
|
+
}
|
|
1433
|
+
heartbeat?: boolean
|
|
1434
|
+
onStatus?: (status: ComlinkStatus) => void
|
|
1435
|
+
}
|
|
1436
|
+
|
|
1437
|
+
/**
|
|
1438
|
+
* @internal
|
|
1439
|
+
* A React hook that returns a function for handling authentication callbacks.
|
|
1440
|
+
*
|
|
1441
|
+
* @remarks
|
|
1442
|
+
* This hook provides access to the authentication store's callback handler,
|
|
1443
|
+
* which processes auth redirects by extracting the session ID and fetching the
|
|
1444
|
+
* authentication token. If fetching the long-lived token is successful,
|
|
1445
|
+
* `handleAuthCallback` will return a Promise that resolves a new location that
|
|
1446
|
+
* removes the short-lived token from the URL. Use this in combination with
|
|
1447
|
+
* `history.replaceState` or your own router's `replace` function to update the
|
|
1448
|
+
* current location without triggering a reload.
|
|
1449
|
+
*
|
|
1450
|
+
* @example
|
|
1451
|
+
* ```tsx
|
|
1452
|
+
* function AuthCallback() {
|
|
1453
|
+
* const handleAuthCallback = useHandleAuthCallback()
|
|
1454
|
+
* const router = useRouter() // Example router
|
|
1455
|
+
*
|
|
1456
|
+
* useEffect(() => {
|
|
1457
|
+
* async function processCallback() {
|
|
1458
|
+
* // Handle the callback and get the cleaned URL
|
|
1459
|
+
* const newUrl = await handleAuthCallback(window.location.href)
|
|
1460
|
+
*
|
|
1461
|
+
* if (newUrl) {
|
|
1462
|
+
* // Replace URL without triggering navigation
|
|
1463
|
+
* router.replace(newUrl, {shallow: true})
|
|
1464
|
+
* }
|
|
1465
|
+
* }
|
|
1466
|
+
*
|
|
1467
|
+
* processCallback().catch(console.error)
|
|
1468
|
+
* }, [handleAuthCallback, router])
|
|
1469
|
+
*
|
|
1470
|
+
* return <div>Completing login...</div>
|
|
1471
|
+
* }
|
|
1472
|
+
* ```
|
|
1473
|
+
*
|
|
1474
|
+
* @returns A callback handler function that processes OAuth redirects
|
|
1475
|
+
* @public
|
|
1476
|
+
*/
|
|
1477
|
+
export declare const useHandleAuthCallback: () => (
|
|
1478
|
+
locationHref?: string | undefined,
|
|
1479
|
+
) => Promise<string | false>
|
|
1480
|
+
|
|
1481
|
+
/**
|
|
1482
|
+
* @internal
|
|
1483
|
+
*/
|
|
1484
|
+
export declare function useLoginUrl(): string
|
|
1485
|
+
|
|
1486
|
+
/**
|
|
1487
|
+
* Hook to log out of the current session
|
|
1488
|
+
* @internal
|
|
1489
|
+
* @returns A function to log out of the current session
|
|
1490
|
+
*/
|
|
1491
|
+
export declare const useLogOut: () => () => Promise<void>
|
|
1492
|
+
|
|
1493
|
+
/**
|
|
1494
|
+
* @internal
|
|
1495
|
+
*
|
|
1496
|
+
* This hook provides functionality to add and remove documents from favorites,
|
|
1497
|
+
* and tracks the current favorite status of the document.
|
|
1498
|
+
* @param documentHandle - The document handle containing document ID and type, like `{_id: '123', _type: 'book'}`
|
|
1499
|
+
* @returns An object containing:
|
|
1500
|
+
* - `favorite` - Function to add document to favorites
|
|
1501
|
+
* - `unfavorite` - Function to remove document from favorites
|
|
1502
|
+
* - `isFavorited` - Boolean indicating if document is currently favorited
|
|
1503
|
+
* - `isConnected` - Boolean indicating if connection to Dashboard UI is established
|
|
1504
|
+
*
|
|
1505
|
+
* @example
|
|
1506
|
+
* ```tsx
|
|
1507
|
+
* function FavoriteButton(props: DocumentActionProps) {
|
|
1508
|
+
* const {documentId, documentType} = props
|
|
1509
|
+
* const {favorite, unfavorite, isFavorited, isConnected} = useManageFavorite({
|
|
1510
|
+
* documentId,
|
|
1511
|
+
* documentType
|
|
1512
|
+
* })
|
|
1513
|
+
*
|
|
1514
|
+
* return (
|
|
1515
|
+
* <Button
|
|
1516
|
+
* disabled={!isConnected}
|
|
1517
|
+
* onClick={() => isFavorited ? unfavorite() : favorite()}
|
|
1518
|
+
* text={isFavorited ? 'Remove from favorites' : 'Add to favorites'}
|
|
1519
|
+
* />
|
|
1520
|
+
* )
|
|
1521
|
+
* }
|
|
1522
|
+
*
|
|
1523
|
+
* // Wrap the component with Suspense since the hook may suspend
|
|
1524
|
+
* function MyDocumentAction(props: DocumentActionProps) {
|
|
1525
|
+
* return (
|
|
1526
|
+
* <Suspense
|
|
1527
|
+
* fallback={
|
|
1528
|
+
* <Button
|
|
1529
|
+
* text="Loading..."
|
|
1530
|
+
* disabled
|
|
1531
|
+
* />
|
|
1532
|
+
* }
|
|
1533
|
+
* >
|
|
1534
|
+
* <FavoriteButton {...props} />
|
|
1535
|
+
* </Suspense>
|
|
1536
|
+
* )
|
|
1537
|
+
* }
|
|
1538
|
+
* ```
|
|
1539
|
+
*/
|
|
1540
|
+
export declare function useManageFavorite({
|
|
1541
|
+
documentId,
|
|
1542
|
+
documentType,
|
|
1543
|
+
projectId: paramProjectId,
|
|
1544
|
+
dataset: paramDataset,
|
|
1545
|
+
resourceId: paramResourceId,
|
|
1546
|
+
resourceType,
|
|
1547
|
+
schemaName,
|
|
1548
|
+
}: UseManageFavoriteProps): ManageFavorite
|
|
1549
|
+
|
|
1550
|
+
declare interface UseManageFavoriteProps extends DocumentHandle {
|
|
1551
|
+
resourceId?: string
|
|
1552
|
+
resourceType: StudioResource['type'] | MediaResource['type'] | CanvasResource['type']
|
|
1553
|
+
/**
|
|
1554
|
+
* The name of the schema collection this document belongs to.
|
|
1555
|
+
* Typically is the name of the workspace when used in the context of a studio.
|
|
1556
|
+
*/
|
|
1557
|
+
schemaName?: string
|
|
1558
|
+
}
|
|
1559
|
+
|
|
1
1560
|
/**
|
|
2
|
-
* An example function that will be removed.
|
|
3
1561
|
* @public
|
|
1562
|
+
*
|
|
1563
|
+
* Hook that provides a function to navigate to a given document in its parent Studio.
|
|
1564
|
+
*
|
|
1565
|
+
* Uses the `projectId` and `dataset` properties of the {@link DocumentHandle} you provide to resolve the correct Studio.
|
|
1566
|
+
* This will only work if you have deployed a studio with a workspace with this `projectId` / `dataset` combination.
|
|
1567
|
+
*
|
|
1568
|
+
* @remarks If you write your own Document Handle to pass to this hook (as opposed to a Document Handle generated by another hook),
|
|
1569
|
+
* it must include values for `documentId`, `documentType`, `projectId`, and `dataset`.
|
|
1570
|
+
*
|
|
1571
|
+
* @category Documents
|
|
1572
|
+
* @param documentHandle - The document handle for the document to navigate to
|
|
1573
|
+
* @param preferredStudioUrl - The preferred studio url to navigate to if you have multiple
|
|
1574
|
+
* studios with the same projectId and dataset
|
|
1575
|
+
* @returns An object containing:
|
|
1576
|
+
* - `navigateToStudioDocument` - Function that when called will navigate to the studio document
|
|
1577
|
+
* - `isConnected` - Boolean indicating if connection to Dashboard is established
|
|
1578
|
+
*
|
|
1579
|
+
* @example
|
|
1580
|
+
* ```ts
|
|
1581
|
+
* import {useNavigateToStudioDocument, type DocumentHandle} from '@sanity/sdk-react'
|
|
1582
|
+
*
|
|
1583
|
+
* function MyComponent({documentHandle}: {documentHandle: DocumentHandle}) {
|
|
1584
|
+
* const {navigateToStudioDocument, isConnected} = useNavigateToStudioDocument(documentHandle)
|
|
1585
|
+
*
|
|
1586
|
+
* return (
|
|
1587
|
+
* <button onClick={navigateToStudioDocument} disabled={!isConnected}>
|
|
1588
|
+
* Navigate to Studio Document
|
|
1589
|
+
* </button>
|
|
1590
|
+
* )
|
|
1591
|
+
* }
|
|
1592
|
+
* ```
|
|
1593
|
+
*/
|
|
1594
|
+
export declare function useNavigateToStudioDocument(
|
|
1595
|
+
documentHandle: DocumentHandle,
|
|
1596
|
+
preferredStudioUrl?: string,
|
|
1597
|
+
): NavigateToStudioResult
|
|
1598
|
+
|
|
1599
|
+
/**
|
|
1600
|
+
* Retrieves pages of {@link DocumentHandle}s, narrowed by optional filters, text searches, and custom ordering,
|
|
1601
|
+
* with support for traditional paginated interfaces. The number of document handles returned per page is customizable,
|
|
1602
|
+
* while page navigation is handled via the included navigation functions.
|
|
1603
|
+
*
|
|
1604
|
+
* @beta
|
|
1605
|
+
* @category Documents
|
|
1606
|
+
* @param options - Configuration options for the paginated list
|
|
1607
|
+
* @returns An object containing the list of document handles, pagination details, and functions to navigate between pages
|
|
1608
|
+
*
|
|
1609
|
+
* @remarks
|
|
1610
|
+
* - The returned document handles include projectId and dataset information from the current Sanity instance
|
|
1611
|
+
* - This makes them ready to use with document operations and other document hooks
|
|
1612
|
+
* - The hook automatically uses the correct Sanity instance based on the projectId and dataset in the options
|
|
1613
|
+
*
|
|
1614
|
+
* @example Paginated list of documents with navigation
|
|
1615
|
+
* ```tsx
|
|
1616
|
+
* import {
|
|
1617
|
+
* usePaginatedDocuments,
|
|
1618
|
+
* createDatasetHandle,
|
|
1619
|
+
* type DatasetHandle,
|
|
1620
|
+
* type DocumentHandle,
|
|
1621
|
+
* type SortOrderingItem,
|
|
1622
|
+
* useProjection
|
|
1623
|
+
* } from '@sanity/sdk-react'
|
|
1624
|
+
* import {Suspense} from 'react'
|
|
1625
|
+
* import {ErrorBoundary} from 'react-error-boundary'
|
|
1626
|
+
*
|
|
1627
|
+
* // Define a component to display a single document row
|
|
1628
|
+
* function MyTableRowComponent({doc}: {doc: DocumentHandle}) {
|
|
1629
|
+
* const {data} = useProjection<{title?: string}>({
|
|
1630
|
+
* ...doc,
|
|
1631
|
+
* projection: '{title}',
|
|
1632
|
+
* })
|
|
1633
|
+
*
|
|
1634
|
+
* return (
|
|
1635
|
+
* <tr>
|
|
1636
|
+
* <td>{data?.title ?? 'Untitled'}</td>
|
|
1637
|
+
* </tr>
|
|
1638
|
+
* )
|
|
1639
|
+
* }
|
|
1640
|
+
*
|
|
1641
|
+
* // Define props for the list component
|
|
1642
|
+
* interface PaginatedDocumentListProps {
|
|
1643
|
+
* documentType: string
|
|
1644
|
+
* dataset?: DatasetHandle
|
|
1645
|
+
* }
|
|
1646
|
+
*
|
|
1647
|
+
* function PaginatedDocumentList({documentType, dataset}: PaginatedDocumentListProps) {
|
|
1648
|
+
* const {
|
|
1649
|
+
* data,
|
|
1650
|
+
* isPending,
|
|
1651
|
+
* currentPage,
|
|
1652
|
+
* totalPages,
|
|
1653
|
+
* nextPage,
|
|
1654
|
+
* previousPage,
|
|
1655
|
+
* hasNextPage,
|
|
1656
|
+
* hasPreviousPage
|
|
1657
|
+
* } = usePaginatedDocuments({
|
|
1658
|
+
* ...dataset,
|
|
1659
|
+
* documentType,
|
|
1660
|
+
* pageSize: 10,
|
|
1661
|
+
* orderings: [{field: '_createdAt', direction: 'desc'}],
|
|
1662
|
+
* })
|
|
1663
|
+
*
|
|
1664
|
+
* return (
|
|
1665
|
+
* <div>
|
|
1666
|
+
* <table>
|
|
1667
|
+
* <thead>
|
|
1668
|
+
* <tr><th>Title</th></tr>
|
|
1669
|
+
* </thead>
|
|
1670
|
+
* <tbody>
|
|
1671
|
+
* {data.map(doc => (
|
|
1672
|
+
* <ErrorBoundary key={doc.documentId} fallback={<tr><td>Error loading document</td></tr>}>
|
|
1673
|
+
* <Suspense fallback={<tr><td>Loading...</td></tr>}>
|
|
1674
|
+
* <MyTableRowComponent doc={doc} />
|
|
1675
|
+
* </Suspense>
|
|
1676
|
+
* </ErrorBoundary>
|
|
1677
|
+
* ))}
|
|
1678
|
+
* </tbody>
|
|
1679
|
+
* </table>
|
|
1680
|
+
* <div style={{opacity: isPending ? 0.5 : 1}}>
|
|
1681
|
+
* <button onClick={previousPage} disabled={!hasPreviousPage || isPending}>Previous</button>
|
|
1682
|
+
* <span>Page {currentPage} / {totalPages}</span>
|
|
1683
|
+
* <button onClick={nextPage} disabled={!hasNextPage || isPending}>Next</button>
|
|
1684
|
+
* </div>
|
|
1685
|
+
* </div>
|
|
1686
|
+
* )
|
|
1687
|
+
* }
|
|
1688
|
+
*
|
|
1689
|
+
* // Usage:
|
|
1690
|
+
* // const myDatasetHandle = createDatasetHandle({ projectId: 'p1', dataset: 'production' })
|
|
1691
|
+
* // <PaginatedDocumentList dataset={myDatasetHandle} documentType="post" />
|
|
1692
|
+
* ```
|
|
1693
|
+
*/
|
|
1694
|
+
export declare function usePaginatedDocuments<
|
|
1695
|
+
TDocumentType extends string = string,
|
|
1696
|
+
TDataset extends string = string,
|
|
1697
|
+
TProjectId extends string = string,
|
|
1698
|
+
>({
|
|
1699
|
+
documentType,
|
|
1700
|
+
filter,
|
|
1701
|
+
pageSize,
|
|
1702
|
+
params,
|
|
1703
|
+
orderings,
|
|
1704
|
+
search,
|
|
1705
|
+
...options
|
|
1706
|
+
}: PaginatedDocumentsOptions<TDocumentType, TDataset, TProjectId>): PaginatedDocumentsResponse<
|
|
1707
|
+
TDocumentType,
|
|
1708
|
+
TDataset,
|
|
1709
|
+
TProjectId
|
|
1710
|
+
>
|
|
1711
|
+
|
|
1712
|
+
/**
|
|
1713
|
+
* @public
|
|
1714
|
+
*/
|
|
1715
|
+
declare type UsePerspective = {
|
|
1716
|
+
(perspectiveHandle: PerspectiveHandle): string | string[]
|
|
1717
|
+
}
|
|
1718
|
+
|
|
1719
|
+
/**
|
|
1720
|
+
* @public
|
|
1721
|
+
*
|
|
1722
|
+
* Returns a single or stack of perspectives for the given perspective handle,
|
|
1723
|
+
* which can then be used to correctly query the documents
|
|
1724
|
+
* via the `perspective` parameter in the client.
|
|
1725
|
+
*
|
|
1726
|
+
* @param perspectiveHandle - The perspective handle to get the perspective for.
|
|
1727
|
+
*
|
|
1728
|
+
* @example
|
|
1729
|
+
* ```tsx
|
|
1730
|
+
* import {usePerspective, useQuery} from '@sanity/sdk-react'
|
|
1731
|
+
|
|
1732
|
+
* const perspective = usePerspective({perspective: 'rxg1346', projectId: 'abc123', dataset: 'production'})
|
|
1733
|
+
* const {data} = useQuery<Movie[]>('*[_type == "movie"]', {
|
|
1734
|
+
* perspective: perspective,
|
|
1735
|
+
* })
|
|
1736
|
+
* ```
|
|
1737
|
+
*
|
|
1738
|
+
* @returns The perspective for the given perspective handle.
|
|
4
1739
|
*/
|
|
5
|
-
export declare
|
|
1740
|
+
export declare const usePerspective: UsePerspective
|
|
1741
|
+
|
|
1742
|
+
/**
|
|
1743
|
+
* @beta
|
|
1744
|
+
*
|
|
1745
|
+
* Returns the preview values of a document (specified via a `DocumentHandle`),
|
|
1746
|
+
* including the document’s `title`, `subtitle`, `media`, and `status`. These values are live and will update in realtime.
|
|
1747
|
+
* To reduce unnecessary network requests for resolving the preview values, an optional `ref` can be passed to the hook so that preview
|
|
1748
|
+
* resolution will only occur if the `ref` is intersecting the current viewport.
|
|
1749
|
+
*
|
|
1750
|
+
* @category Documents
|
|
1751
|
+
* @param options - The document handle for the document you want to resolve preview values for, and an optional ref
|
|
1752
|
+
* @returns The preview values for the given document and a boolean to indicate whether the resolution is pending
|
|
1753
|
+
*
|
|
1754
|
+
* @example Combining with useDocuments to render a collection of document previews
|
|
1755
|
+
* ```
|
|
1756
|
+
* // PreviewComponent.jsx
|
|
1757
|
+
* export default function PreviewComponent({ document }) {
|
|
1758
|
+
* const { data: { title, subtitle, media }, isPending } = usePreview({ document })
|
|
1759
|
+
* return (
|
|
1760
|
+
* <article style={{ opacity: isPending ? 0.5 : 1}}>
|
|
1761
|
+
* {media?.type === 'image-asset' ? <img src={media.url} alt='' /> : ''}
|
|
1762
|
+
* <h2>{title}</h2>
|
|
1763
|
+
* <p>{subtitle}</p>
|
|
1764
|
+
* </article>
|
|
1765
|
+
* )
|
|
1766
|
+
* }
|
|
1767
|
+
*
|
|
1768
|
+
* // DocumentList.jsx
|
|
1769
|
+
* const { data } = useDocuments({ filter: '_type == "movie"' })
|
|
1770
|
+
* return (
|
|
1771
|
+
* <div>
|
|
1772
|
+
* <h1>Movies</h1>
|
|
1773
|
+
* <ul>
|
|
1774
|
+
* {data.map(movie => (
|
|
1775
|
+
* <li key={movie._id}>
|
|
1776
|
+
* <Suspense fallback='Loading…'>
|
|
1777
|
+
* <PreviewComponent document={movie} />
|
|
1778
|
+
* </Suspense>
|
|
1779
|
+
* </li>
|
|
1780
|
+
* ))}
|
|
1781
|
+
* </ul>
|
|
1782
|
+
* </div>
|
|
1783
|
+
* )
|
|
1784
|
+
* ```
|
|
1785
|
+
*/
|
|
1786
|
+
export declare function usePreview({ref, ...docHandle}: UsePreviewOptions): UsePreviewResults
|
|
1787
|
+
|
|
1788
|
+
/**
|
|
1789
|
+
* @beta
|
|
1790
|
+
* @category Types
|
|
1791
|
+
*/
|
|
1792
|
+
export declare interface UsePreviewOptions extends DocumentHandle {
|
|
1793
|
+
/**
|
|
1794
|
+
* Optional ref object to track visibility. When provided, preview resolution
|
|
1795
|
+
* only occurs when the referenced element is visible in the viewport.
|
|
1796
|
+
*/
|
|
1797
|
+
ref?: React.RefObject<unknown>
|
|
1798
|
+
}
|
|
1799
|
+
|
|
1800
|
+
/**
|
|
1801
|
+
* @beta
|
|
1802
|
+
* @category Types
|
|
1803
|
+
*/
|
|
1804
|
+
export declare interface UsePreviewResults {
|
|
1805
|
+
/** The results of resolving the document’s preview values */
|
|
1806
|
+
data: PreviewValue
|
|
1807
|
+
/** True when preview values are being refreshed */
|
|
1808
|
+
isPending: boolean
|
|
1809
|
+
}
|
|
1810
|
+
|
|
1811
|
+
declare type UseProject = {
|
|
1812
|
+
/**
|
|
1813
|
+
*
|
|
1814
|
+
* Returns metadata for a given project
|
|
1815
|
+
*
|
|
1816
|
+
* @category Projects
|
|
1817
|
+
* @param projectId - The ID of the project to retrieve metadata for
|
|
1818
|
+
* @returns The metadata for the project
|
|
1819
|
+
* @example
|
|
1820
|
+
* ```tsx
|
|
1821
|
+
* function ProjectMetadata({ projectId }: { projectId: string }) {
|
|
1822
|
+
* const project = useProject(projectId)
|
|
1823
|
+
*
|
|
1824
|
+
* return (
|
|
1825
|
+
* <figure style={{ backgroundColor: project.metadata.color || 'lavender'}}>
|
|
1826
|
+
* <h1>{project.displayName}</h1>
|
|
1827
|
+
* </figure>
|
|
1828
|
+
* )
|
|
1829
|
+
* }
|
|
1830
|
+
* ```
|
|
1831
|
+
*/
|
|
1832
|
+
(projectHandle?: ProjectHandle): SanityProject
|
|
1833
|
+
}
|
|
1834
|
+
|
|
1835
|
+
/**
|
|
1836
|
+
* @public
|
|
1837
|
+
* @function
|
|
1838
|
+
*/
|
|
1839
|
+
export declare const useProject: UseProject
|
|
1840
|
+
|
|
1841
|
+
/**
|
|
1842
|
+
* @public
|
|
1843
|
+
*
|
|
1844
|
+
* Returns the projected values of a document based on the provided projection string.
|
|
1845
|
+
* These values are live and will update in realtime.
|
|
1846
|
+
* To optimize network requests, an optional `ref` can be passed to only resolve the projection
|
|
1847
|
+
* when the referenced element is intersecting the viewport.
|
|
1848
|
+
*
|
|
1849
|
+
* @category Documents
|
|
1850
|
+
* @remarks
|
|
1851
|
+
* This hook has multiple signatures allowing for fine-grained control over type inference:
|
|
1852
|
+
* - Using Typegen: Infers the return type based on the `documentType`, `dataset`, `projectId`, and `projection`.
|
|
1853
|
+
* - Using explicit type parameter: Allows specifying a custom return type `TData`.
|
|
1854
|
+
*
|
|
1855
|
+
* @param options - An object containing the `DocumentHandle` properties (`documentId`, `documentType`, etc.), the `projection` string, optional `params`, and an optional `ref`.
|
|
1856
|
+
* @returns An object containing the projection results (`data`) and a boolean indicating whether the resolution is pending (`isPending`). Note: Suspense handles initial loading states; `data` being `undefined` after initial loading means the document doesn't exist or the projection yielded no result.
|
|
1857
|
+
*/
|
|
1858
|
+
/**
|
|
1859
|
+
* @beta
|
|
1860
|
+
* Fetch a projection, relying on Typegen for the return type based on the handle and projection.
|
|
1861
|
+
*
|
|
1862
|
+
* @category Documents
|
|
1863
|
+
* @param options - Options including the document handle properties (`documentId`, `documentType`, etc.) and the `projection`.
|
|
1864
|
+
* @returns The projected data, typed based on Typegen.
|
|
1865
|
+
*
|
|
1866
|
+
* @example Using Typegen for a book preview
|
|
1867
|
+
* ```tsx
|
|
1868
|
+
* // ProjectionComponent.tsx
|
|
1869
|
+
* import {useProjection, type DocumentHandle} from '@sanity/sdk-react'
|
|
1870
|
+
* import {useRef} from 'react'
|
|
1871
|
+
* import {defineProjection} from 'groq'
|
|
1872
|
+
*
|
|
1873
|
+
* // Define props using DocumentHandle with the specific document type
|
|
1874
|
+
* type ProjectionComponentProps = {
|
|
1875
|
+
* doc: DocumentHandle<'book'> // Typegen knows 'book'
|
|
1876
|
+
* }
|
|
1877
|
+
*
|
|
1878
|
+
* // This is required for typegen to generate the correct return type
|
|
1879
|
+
* const myProjection = defineProjection(`{
|
|
1880
|
+
* title,
|
|
1881
|
+
* 'coverImage': cover.asset->url,
|
|
1882
|
+
* 'authors': array::join(authors[]->{'name': firstName + ' ' + lastName}.name, ', ')
|
|
1883
|
+
* }`)
|
|
1884
|
+
*
|
|
1885
|
+
* export default function ProjectionComponent({ doc }: ProjectionComponentProps) {
|
|
1886
|
+
* const ref = useRef(null) // Optional ref to track viewport intersection for lazy loading
|
|
1887
|
+
*
|
|
1888
|
+
* // Spread the doc handle into the options
|
|
1889
|
+
* // Typegen infers the return type based on 'book' and the projection
|
|
1890
|
+
* const { data } = useProjection({
|
|
1891
|
+
* ...doc, // Pass the handle properties
|
|
1892
|
+
* ref,
|
|
1893
|
+
* projection: myProjection,
|
|
1894
|
+
* })
|
|
1895
|
+
*
|
|
1896
|
+
* // Suspense handles initial load, check for data existence after
|
|
1897
|
+
* return (
|
|
1898
|
+
* <article ref={ref}>
|
|
1899
|
+
* <h2>{data.title ?? 'Untitled'}</h2>
|
|
1900
|
+
* {data.coverImage && <img src={data.coverImage} alt={data.title} />}
|
|
1901
|
+
* <p>{data.authors ?? 'Unknown authors'}</p>
|
|
1902
|
+
* </article>
|
|
1903
|
+
* )
|
|
1904
|
+
* }
|
|
1905
|
+
*
|
|
1906
|
+
* // Usage:
|
|
1907
|
+
* // import {createDocumentHandle} from '@sanity/sdk-react'
|
|
1908
|
+
* // const myDocHandle = createDocumentHandle({ documentId: 'book123', documentType: 'book' })
|
|
1909
|
+
* // <Suspense fallback='Loading preview...'>
|
|
1910
|
+
* // <ProjectionComponent doc={myDocHandle} />
|
|
1911
|
+
* // </Suspense>
|
|
1912
|
+
* ```
|
|
1913
|
+
*/
|
|
1914
|
+
export declare function useProjection<
|
|
1915
|
+
TProjection extends ValidProjection = ValidProjection,
|
|
1916
|
+
TDocumentType extends string = string,
|
|
1917
|
+
TDataset extends string = string,
|
|
1918
|
+
TProjectId extends string = string,
|
|
1919
|
+
>(
|
|
1920
|
+
options: UseProjectionOptions<TProjection, TDocumentType, TDataset, TProjectId>,
|
|
1921
|
+
): UseProjectionResults<SanityProjectionResult<TProjection, TDocumentType, TDataset, TProjectId>>
|
|
1922
|
+
|
|
1923
|
+
/**
|
|
1924
|
+
* @beta
|
|
1925
|
+
* Fetch a projection with an explicitly defined return type `TData`.
|
|
1926
|
+
*
|
|
1927
|
+
* @param options - Options including the document handle properties (`documentId`, etc.) and the `projection`.
|
|
1928
|
+
* @returns The projected data, cast to the explicit type `TData`.
|
|
1929
|
+
*
|
|
1930
|
+
* @example Explicitly typing the projection result
|
|
1931
|
+
* ```tsx
|
|
1932
|
+
* import {useProjection, type DocumentHandle} from '@sanity/sdk-react'
|
|
1933
|
+
* import {useRef} from 'react'
|
|
1934
|
+
*
|
|
1935
|
+
* interface SimpleBookPreview {
|
|
1936
|
+
* title?: string;
|
|
1937
|
+
* authorName?: string;
|
|
1938
|
+
* }
|
|
1939
|
+
*
|
|
1940
|
+
* type BookPreviewProps = {
|
|
1941
|
+
* doc: DocumentHandle
|
|
1942
|
+
* }
|
|
1943
|
+
*
|
|
1944
|
+
* function BookPreview({ doc }: BookPreviewProps) {
|
|
1945
|
+
* const ref = useRef(null)
|
|
1946
|
+
* const { data } = useProjection<SimpleBookPreview>({
|
|
1947
|
+
* ...doc,
|
|
1948
|
+
* ref,
|
|
1949
|
+
* projection: `{ title, 'authorName': author->name }`
|
|
1950
|
+
* })
|
|
1951
|
+
*
|
|
1952
|
+
* return (
|
|
1953
|
+
* <div ref={ref}>
|
|
1954
|
+
* <h3>{data.title ?? 'No Title'}</h3>
|
|
1955
|
+
* <p>By: {data.authorName ?? 'Unknown'}</p>
|
|
1956
|
+
* </div>
|
|
1957
|
+
* )
|
|
1958
|
+
* }
|
|
1959
|
+
*
|
|
1960
|
+
* // Usage:
|
|
1961
|
+
* // import {createDocumentHandle} from '@sanity/sdk-react'
|
|
1962
|
+
* // const doc = createDocumentHandle({ documentId: 'abc', documentType: 'book' })
|
|
1963
|
+
* // <Suspense fallback='Loading...'>
|
|
1964
|
+
* // <BookPreview doc={doc} />
|
|
1965
|
+
* // </Suspense>
|
|
1966
|
+
* ```
|
|
1967
|
+
*/
|
|
1968
|
+
export declare function useProjection<TData extends object>(
|
|
1969
|
+
options: UseProjectionOptions,
|
|
1970
|
+
): UseProjectionResults<TData>
|
|
1971
|
+
|
|
1972
|
+
/**
|
|
1973
|
+
* @public
|
|
1974
|
+
* @category Types
|
|
1975
|
+
*/
|
|
1976
|
+
export declare interface UseProjectionOptions<
|
|
1977
|
+
TProjection extends ValidProjection = ValidProjection,
|
|
1978
|
+
TDocumentType extends string = string,
|
|
1979
|
+
TDataset extends string = string,
|
|
1980
|
+
TProjectId extends string = string,
|
|
1981
|
+
> extends DocumentHandle<TDocumentType, TDataset, TProjectId> {
|
|
1982
|
+
/** The GROQ projection string */
|
|
1983
|
+
projection: TProjection
|
|
1984
|
+
/** Optional parameters for the projection query */
|
|
1985
|
+
params?: Record<string, unknown>
|
|
1986
|
+
/** Optional ref to track viewport intersection for lazy loading */
|
|
1987
|
+
ref?: React.RefObject<unknown>
|
|
1988
|
+
}
|
|
1989
|
+
|
|
1990
|
+
/**
|
|
1991
|
+
* @public
|
|
1992
|
+
* @category Types
|
|
1993
|
+
*/
|
|
1994
|
+
export declare interface UseProjectionResults<TData> {
|
|
1995
|
+
/** The projected data */
|
|
1996
|
+
data: TData
|
|
1997
|
+
/** True if the projection is currently being resolved */
|
|
1998
|
+
isPending: boolean
|
|
1999
|
+
}
|
|
2000
|
+
|
|
2001
|
+
declare type UseProjects = {
|
|
2002
|
+
/**
|
|
2003
|
+
*
|
|
2004
|
+
* Returns metadata for each project you have access to.
|
|
2005
|
+
*
|
|
2006
|
+
* @category Projects
|
|
2007
|
+
* @returns An array of metadata (minus the projects’ members) for each project
|
|
2008
|
+
* @example
|
|
2009
|
+
* ```tsx
|
|
2010
|
+
* const projects = useProjects()
|
|
2011
|
+
*
|
|
2012
|
+
* return (
|
|
2013
|
+
* <select>
|
|
2014
|
+
* {projects.map((project) => (
|
|
2015
|
+
* <option key={project.id}>{project.displayName}</option>
|
|
2016
|
+
* ))}
|
|
2017
|
+
* </select>
|
|
2018
|
+
* )
|
|
2019
|
+
* ```
|
|
2020
|
+
*/
|
|
2021
|
+
(): ProjectWithoutMembers[]
|
|
2022
|
+
}
|
|
2023
|
+
|
|
2024
|
+
/**
|
|
2025
|
+
* @public
|
|
2026
|
+
* @function
|
|
2027
|
+
*/
|
|
2028
|
+
export declare const useProjects: UseProjects
|
|
2029
|
+
|
|
2030
|
+
/**
|
|
2031
|
+
* @beta
|
|
2032
|
+
* Executes a GROQ query, inferring the result type from the query string and options.
|
|
2033
|
+
* Leverages Sanity Typegen if configured for enhanced type safety.
|
|
2034
|
+
*
|
|
2035
|
+
* @param options - Configuration for the query, including `query`, optional `params`, `projectId`, `dataset`, etc.
|
|
2036
|
+
* @returns An object containing `data` (typed based on the query) and `isPending` (for transitions).
|
|
2037
|
+
*
|
|
2038
|
+
* @example Basic usage (Inferred Type)
|
|
2039
|
+
* ```tsx
|
|
2040
|
+
* import {useQuery} from '@sanity/sdk-react'
|
|
2041
|
+
* import {defineQuery} from 'groq'
|
|
2042
|
+
*
|
|
2043
|
+
* const myQuery = defineQuery(`*[_type == "movie"]{_id, title}`)
|
|
2044
|
+
*
|
|
2045
|
+
* function MovieList() {
|
|
2046
|
+
* // Typegen infers the return type for data
|
|
2047
|
+
* const {data} = useQuery({ query: myQuery })
|
|
2048
|
+
*
|
|
2049
|
+
* return (
|
|
2050
|
+
* <div>
|
|
2051
|
+
* <h2>Movies</h2>
|
|
2052
|
+
* <ul>
|
|
2053
|
+
* {data.map(movie => <li key={movie._id}>{movie.title}</li>)}
|
|
2054
|
+
* </ul>
|
|
2055
|
+
* </div>
|
|
2056
|
+
* )
|
|
2057
|
+
* }
|
|
2058
|
+
* // Suspense boundary should wrap <MovieList /> for initial load
|
|
2059
|
+
* ```
|
|
2060
|
+
*
|
|
2061
|
+
* @example Using parameters (Inferred Type)
|
|
2062
|
+
* ```tsx
|
|
2063
|
+
* import {useQuery} from '@sanity/sdk-react'
|
|
2064
|
+
* import {defineQuery} from 'groq'
|
|
2065
|
+
*
|
|
2066
|
+
* const myQuery = defineQuery(`*[_type == "movie" && _id == $id][0]`)
|
|
2067
|
+
*
|
|
2068
|
+
* function MovieDetails({movieId}: {movieId: string}) {
|
|
2069
|
+
* // Typegen infers the return type based on query and params
|
|
2070
|
+
* const {data, isPending} = useQuery({
|
|
2071
|
+
* query: myQuery,
|
|
2072
|
+
* params: { id: movieId }
|
|
2073
|
+
* })
|
|
2074
|
+
*
|
|
2075
|
+
* return (
|
|
2076
|
+
* // utilize `isPending` to signal to users that new data is coming in
|
|
2077
|
+
* // (e.g. the `movieId` changed and we're loading in the new one)
|
|
2078
|
+
* <div style={{ opacity: isPending ? 0.5 : 1 }}>
|
|
2079
|
+
* {data ? <h1>{data.title}</h1> : <p>Movie not found</p>}
|
|
2080
|
+
* </div>
|
|
2081
|
+
* )
|
|
2082
|
+
* }
|
|
2083
|
+
* ```
|
|
2084
|
+
*/
|
|
2085
|
+
export declare function useQuery<
|
|
2086
|
+
TQuery extends string = string,
|
|
2087
|
+
TDataset extends string = string,
|
|
2088
|
+
TProjectId extends string = string,
|
|
2089
|
+
>(
|
|
2090
|
+
options: QueryOptions<TQuery, TDataset, TProjectId>,
|
|
2091
|
+
): {
|
|
2092
|
+
/** The query result, typed based on the GROQ query string */
|
|
2093
|
+
data: SanityQueryResult<TQuery, TDataset, TProjectId>
|
|
2094
|
+
/** True if a query transition is in progress */
|
|
2095
|
+
isPending: boolean
|
|
2096
|
+
}
|
|
2097
|
+
|
|
2098
|
+
/**
|
|
2099
|
+
* @beta
|
|
2100
|
+
* Executes a GROQ query with an explicitly provided result type `TData`.
|
|
2101
|
+
*
|
|
2102
|
+
* @param options - Configuration for the query, including `query`, optional `params`, `projectId`, `dataset`, etc.
|
|
2103
|
+
* @returns An object containing `data` (cast to `TData`) and `isPending` (indicates whether a query resolution is pending; note that Suspense handles initial loading states). *
|
|
2104
|
+
* @example Manually typed query result
|
|
2105
|
+
* ```tsx
|
|
2106
|
+
* import {useQuery} from '@sanity/sdk-react'
|
|
2107
|
+
*
|
|
2108
|
+
* interface CustomMovieTitle {
|
|
2109
|
+
* movieTitle?: string
|
|
2110
|
+
* }
|
|
2111
|
+
*
|
|
2112
|
+
* function FirstMovieTitle() {
|
|
2113
|
+
* // Provide the explicit type TData
|
|
2114
|
+
* const {data, isPending} = useQuery<CustomMovieTitle>({
|
|
2115
|
+
* query: '*[_type == "movie"][0]{ "movieTitle": title }'
|
|
2116
|
+
* })
|
|
2117
|
+
*
|
|
2118
|
+
* return (
|
|
2119
|
+
* <h1 style={{ opacity: isPending ? 0.5 : 1 }}>
|
|
2120
|
+
* {data?.movieTitle ?? 'No title found'}
|
|
2121
|
+
* </h1>
|
|
2122
|
+
* )
|
|
2123
|
+
* }
|
|
2124
|
+
* ```
|
|
2125
|
+
*/
|
|
2126
|
+
export declare function useQuery<TData>(options: QueryOptions): {
|
|
2127
|
+
/** The query result, cast to the provided type TData */
|
|
2128
|
+
data: TData
|
|
2129
|
+
/** True if another query is resolving in the background (suspense handles the initial loading state) */
|
|
2130
|
+
isPending: boolean
|
|
2131
|
+
}
|
|
2132
|
+
|
|
2133
|
+
/**
|
|
2134
|
+
* @internal
|
|
2135
|
+
* Hook for managing document interaction history in Sanity Studio.
|
|
2136
|
+
* This hook provides functionality to record document interactions.
|
|
2137
|
+
* @category History
|
|
2138
|
+
* @param documentHandle - The document handle containing document ID and type, like `{_id: '123', _type: 'book'}`
|
|
2139
|
+
* @returns An object containing:
|
|
2140
|
+
* - `recordEvent` - Function to record document interactions
|
|
2141
|
+
* - `isConnected` - Boolean indicating if connection to Studio is established
|
|
2142
|
+
*
|
|
2143
|
+
* @example
|
|
2144
|
+
* ```tsx
|
|
2145
|
+
* function MyDocumentAction(props: DocumentActionProps) {
|
|
2146
|
+
* const {documentId, documentType, resourceType, resourceId} = props
|
|
2147
|
+
* const {recordEvent, isConnected} = useRecordDocumentHistoryEvent({
|
|
2148
|
+
* documentId,
|
|
2149
|
+
* documentType,
|
|
2150
|
+
* resourceType,
|
|
2151
|
+
* resourceId,
|
|
2152
|
+
* })
|
|
2153
|
+
*
|
|
2154
|
+
* return (
|
|
2155
|
+
* <Button
|
|
2156
|
+
* disabled={!isConnected}
|
|
2157
|
+
* onClick={() => recordEvent('viewed')}
|
|
2158
|
+
* text={'Viewed'}
|
|
2159
|
+
* />
|
|
2160
|
+
* )
|
|
2161
|
+
* }
|
|
2162
|
+
* ```
|
|
2163
|
+
*/
|
|
2164
|
+
export declare function useRecordDocumentHistoryEvent({
|
|
2165
|
+
documentId,
|
|
2166
|
+
documentType,
|
|
2167
|
+
resourceType,
|
|
2168
|
+
resourceId,
|
|
2169
|
+
schemaName,
|
|
2170
|
+
}: UseRecordDocumentHistoryEventProps): DocumentInteractionHistory
|
|
2171
|
+
|
|
2172
|
+
/**
|
|
2173
|
+
* @internal
|
|
2174
|
+
*/
|
|
2175
|
+
declare interface UseRecordDocumentHistoryEventProps extends DocumentHandle {
|
|
2176
|
+
resourceType: StudioResource['type'] | MediaResource['type'] | CanvasResource['type']
|
|
2177
|
+
resourceId?: string
|
|
2178
|
+
/**
|
|
2179
|
+
* The name of the schema collection this document belongs to.
|
|
2180
|
+
* Typically is the name of the workspace when used in the context of a studio.
|
|
2181
|
+
*/
|
|
2182
|
+
schemaName?: string
|
|
2183
|
+
}
|
|
2184
|
+
|
|
2185
|
+
/**
|
|
2186
|
+
* @public
|
|
2187
|
+
* @category Types
|
|
2188
|
+
*/
|
|
2189
|
+
export declare interface UsersResult {
|
|
2190
|
+
/**
|
|
2191
|
+
* The users fetched.
|
|
2192
|
+
*/
|
|
2193
|
+
data: SanityUser[]
|
|
2194
|
+
/**
|
|
2195
|
+
* Whether there are more users to fetch.
|
|
2196
|
+
*/
|
|
2197
|
+
hasMore: boolean
|
|
2198
|
+
/**
|
|
2199
|
+
* Whether a users request is currently in progress
|
|
2200
|
+
*/
|
|
2201
|
+
isPending: boolean
|
|
2202
|
+
/**
|
|
2203
|
+
* Load more users.
|
|
2204
|
+
*/
|
|
2205
|
+
loadMore: () => void
|
|
2206
|
+
}
|
|
2207
|
+
|
|
2208
|
+
/**
|
|
2209
|
+
* Retrieves the current Sanity instance or finds a matching instance from the hierarchy
|
|
2210
|
+
*
|
|
2211
|
+
* @public
|
|
2212
|
+
*
|
|
2213
|
+
* @category Platform
|
|
2214
|
+
* @param config - Optional configuration to match against when finding an instance
|
|
2215
|
+
* @returns The current or matching Sanity instance
|
|
2216
|
+
*
|
|
2217
|
+
* @remarks
|
|
2218
|
+
* This hook accesses the nearest Sanity instance from the React context. When provided with
|
|
2219
|
+
* a configuration object, it traverses up the instance hierarchy to find the closest instance
|
|
2220
|
+
* that matches the specified configuration using shallow comparison of properties.
|
|
2221
|
+
*
|
|
2222
|
+
* The hook must be used within a component wrapped by a `ResourceProvider` or `SanityApp`.
|
|
2223
|
+
*
|
|
2224
|
+
* Use this hook when you need to:
|
|
2225
|
+
* - Access the current SanityInstance from context
|
|
2226
|
+
* - Find a specific instance with matching project/dataset configuration
|
|
2227
|
+
* - Access a parent instance with specific configuration values
|
|
2228
|
+
*
|
|
2229
|
+
* @example Get the current instance
|
|
2230
|
+
* ```tsx
|
|
2231
|
+
* // Get the current instance from context
|
|
2232
|
+
* const instance = useSanityInstance()
|
|
2233
|
+
* console.log(instance.config.projectId)
|
|
2234
|
+
* ```
|
|
2235
|
+
*
|
|
2236
|
+
* @example Find an instance with specific configuration
|
|
2237
|
+
* ```tsx
|
|
2238
|
+
* // Find an instance matching the given project and dataset
|
|
2239
|
+
* const instance = useSanityInstance({
|
|
2240
|
+
* projectId: 'abc123',
|
|
2241
|
+
* dataset: 'production'
|
|
2242
|
+
* })
|
|
2243
|
+
*
|
|
2244
|
+
* // Use instance for API calls
|
|
2245
|
+
* const fetchDocument = (docId) => {
|
|
2246
|
+
* // Instance is guaranteed to have the matching config
|
|
2247
|
+
* return client.fetch(`*[_id == $id][0]`, { id: docId })
|
|
2248
|
+
* }
|
|
2249
|
+
* ```
|
|
2250
|
+
*
|
|
2251
|
+
* @example Match partial configuration
|
|
2252
|
+
* ```tsx
|
|
2253
|
+
* // Find an instance with specific auth configuration
|
|
2254
|
+
* const instance = useSanityInstance({
|
|
2255
|
+
* auth: { requireLogin: true }
|
|
2256
|
+
* })
|
|
2257
|
+
* ```
|
|
2258
|
+
*
|
|
2259
|
+
* @throws Error if no SanityInstance is found in context
|
|
2260
|
+
* @throws Error if no matching instance is found for the provided config
|
|
2261
|
+
*/
|
|
2262
|
+
export declare const useSanityInstance: (config?: SanityConfig) => SanityInstance
|
|
2263
|
+
|
|
2264
|
+
/**
|
|
2265
|
+
* Hook that fetches studio workspaces and organizes them by projectId:dataset
|
|
2266
|
+
* @internal
|
|
2267
|
+
*/
|
|
2268
|
+
export declare function useStudioWorkspacesByProjectIdDataset(): StudioWorkspacesResult
|
|
2269
|
+
|
|
2270
|
+
/**
|
|
2271
|
+
*
|
|
2272
|
+
* @public
|
|
2273
|
+
*
|
|
2274
|
+
* Retrieves the users for a given resource (either a project or an organization).
|
|
2275
|
+
*
|
|
2276
|
+
* @category Users
|
|
2277
|
+
* @param params - The resource type, project ID, and the limit of users to fetch
|
|
2278
|
+
* @returns A list of users, a boolean indicating whether there are more users to fetch, and a function to load more users
|
|
2279
|
+
*
|
|
2280
|
+
* @example
|
|
2281
|
+
* ```
|
|
2282
|
+
* const { data, hasMore, loadMore, isPending } = useUsers({
|
|
2283
|
+
* resourceType: 'organization',
|
|
2284
|
+
* organizationId: 'my-org-id',
|
|
2285
|
+
* batchSize: 10,
|
|
2286
|
+
* })
|
|
2287
|
+
*
|
|
2288
|
+
* return (
|
|
2289
|
+
* <div>
|
|
2290
|
+
* {data.map(user => (
|
|
2291
|
+
* <figure key={user.sanityUserId}>
|
|
2292
|
+
* <img src={user.profile.imageUrl} alt='' />
|
|
2293
|
+
* <figcaption>{user.profile.displayName}</figcaption>
|
|
2294
|
+
* <address>{user.profile.email}</address>
|
|
2295
|
+
* </figure>
|
|
2296
|
+
* ))}
|
|
2297
|
+
* {hasMore && <button onClick={loadMore}>{isPending ? 'Loading...' : 'Load More'</button>}
|
|
2298
|
+
* </div>
|
|
2299
|
+
* )
|
|
2300
|
+
* ```
|
|
2301
|
+
*/
|
|
2302
|
+
export declare function useUsers(options?: GetUsersOptions): UsersResult
|
|
2303
|
+
|
|
2304
|
+
/**
|
|
2305
|
+
* Hook that verifies the current projects belongs to the organization ID specified in the dashboard context.
|
|
2306
|
+
*
|
|
2307
|
+
* @public
|
|
2308
|
+
* @param disabled - When true, disables verification and skips project verification API calls
|
|
2309
|
+
* @returns Error message if the project doesn't match the organization ID, or null if all match or verification isn't needed
|
|
2310
|
+
*
|
|
2311
|
+
* @example
|
|
2312
|
+
* ```tsx
|
|
2313
|
+
* function OrgVerifier() {
|
|
2314
|
+
* const error = useVerifyOrgProjects()
|
|
2315
|
+
*
|
|
2316
|
+
* if (error) {
|
|
2317
|
+
* return <div className="error">{error}</div>
|
|
2318
|
+
* }
|
|
2319
|
+
*
|
|
2320
|
+
* return <div>Organization projects verified!</div>
|
|
2321
|
+
* }
|
|
2322
|
+
* ```
|
|
2323
|
+
*/
|
|
2324
|
+
export declare function useVerifyOrgProjects(
|
|
2325
|
+
disabled?: boolean,
|
|
2326
|
+
projectIds?: string[],
|
|
2327
|
+
): string | null
|
|
2328
|
+
|
|
2329
|
+
/**
|
|
2330
|
+
* @internal
|
|
2331
|
+
* Hook to wrap a Comlink node in a React hook.
|
|
2332
|
+
* Our store functionality takes care of the lifecycle of the node,
|
|
2333
|
+
* as well as sharing a single node between invocations if they share the same name.
|
|
2334
|
+
*
|
|
2335
|
+
* Generally not to be used directly, but to be used as a dependency of
|
|
2336
|
+
* Comlink-powered hooks like `useManageFavorite`.
|
|
2337
|
+
*/
|
|
2338
|
+
export declare function useWindowConnection<
|
|
2339
|
+
TWindowMessage extends WindowMessage,
|
|
2340
|
+
TFrameMessage extends FrameMessage,
|
|
2341
|
+
>({
|
|
2342
|
+
name,
|
|
2343
|
+
connectTo,
|
|
2344
|
+
onMessage,
|
|
2345
|
+
onStatus,
|
|
2346
|
+
}: UseWindowConnectionOptions<TFrameMessage>): WindowConnection<TWindowMessage>
|
|
2347
|
+
|
|
2348
|
+
/**
|
|
2349
|
+
* @internal
|
|
2350
|
+
*/
|
|
2351
|
+
export declare interface UseWindowConnectionOptions<TMessage extends FrameMessage> {
|
|
2352
|
+
name: string
|
|
2353
|
+
connectTo: string
|
|
2354
|
+
onMessage?: Record<TMessage['type'], WindowMessageHandler<TMessage>>
|
|
2355
|
+
onStatus?: (status: ComlinkStatus) => void
|
|
2356
|
+
}
|
|
2357
|
+
|
|
2358
|
+
/**
|
|
2359
|
+
* @internal
|
|
2360
|
+
*/
|
|
2361
|
+
export declare interface WindowConnection<TMessage extends WindowMessage> {
|
|
2362
|
+
sendMessage: <TType extends TMessage['type']>(
|
|
2363
|
+
type: TType,
|
|
2364
|
+
data?: Extract<
|
|
2365
|
+
TMessage,
|
|
2366
|
+
{
|
|
2367
|
+
type: TType
|
|
2368
|
+
}
|
|
2369
|
+
>['data'],
|
|
2370
|
+
) => void
|
|
2371
|
+
fetch: <TResponse>(
|
|
2372
|
+
type: string,
|
|
2373
|
+
data?: MessageData,
|
|
2374
|
+
options?: {
|
|
2375
|
+
signal?: AbortSignal
|
|
2376
|
+
suppressWarnings?: boolean
|
|
2377
|
+
responseTimeout?: number
|
|
2378
|
+
},
|
|
2379
|
+
) => Promise<TResponse>
|
|
2380
|
+
}
|
|
2381
|
+
|
|
2382
|
+
/**
|
|
2383
|
+
* @internal
|
|
2384
|
+
*/
|
|
2385
|
+
export declare type WindowMessageHandler<TFrameMessage extends FrameMessage> = (
|
|
2386
|
+
event: TFrameMessage['data'],
|
|
2387
|
+
) => TFrameMessage['response']
|
|
2388
|
+
|
|
2389
|
+
declare interface WorkspacesByProjectIdDataset {
|
|
2390
|
+
[key: `${string}:${string}`]: DashboardResource[]
|
|
2391
|
+
}
|
|
2392
|
+
|
|
2393
|
+
export * from '@sanity/sdk'
|
|
6
2394
|
|
|
7
2395
|
export {}
|