next-sanity 2.0.0-preview-kit.1 → 2.0.0

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 CHANGED
@@ -4,15 +4,24 @@
4
4
 
5
5
  **Features:**
6
6
 
7
- - Client-side live real-time preview for Next 13 and `appDir`. For `pages`, or older versions of Next, you can use [`@sanity/preview-kit`](https://github.com/sanity-io/preview-kit).
8
- - GROQ syntax highlighting
7
+ - [Client-side live real-time preview for authenticated users](#live-real-time-preview)
8
+ - [GROQ syntax highlighting](https://marketplace.visualstudio.com/items?itemName=sanity-io.vscode-sanity)
9
9
  - [Embed](#next-sanitystudio-dev-preview) [Studio v3](https://www.sanity.io/studio-v3) in [Next.js](https://nextjs.org/) apps
10
10
 
11
11
  ## Table of contents
12
12
 
13
13
  - [Table of contents](#table-of-contents)
14
14
  - [Installation](#installation)
15
- - [Live real-time preview](#live-real-time-preview)
15
+ - [`next-sanity` Running groq queries](#next-sanity-running-groq-queries)
16
+ - [`next-sanity/preview` Live real-time preview](#next-sanitypreview-live-real-time-preview)
17
+ - [Examples](#examples)
18
+ - [Built-in Sanity auth](#built-in-sanity-auth)
19
+ - [Next 12](#next-12)
20
+ - [Next 13 `appDir`](#next-13-appdir)
21
+ - [Custom token auth](#custom-token-auth)
22
+ - [Next 12](#next-12-1)
23
+ - [Next 13 `appDir`](#next-13-appdir-1)
24
+ - [Starters](#starters)
16
25
  - [Limits](#limits)
17
26
  - [`next-sanity/studio` (dev-preview)](#next-sanitystudio-dev-preview)
18
27
  - [Usage](#usage)
@@ -20,6 +29,11 @@
20
29
  - [Customize `<ServerStyleSheetDocument />`](#customize-serverstylesheetdocument-)
21
30
  - [Full-control mode](#full-control-mode)
22
31
  - [Migrate](#migrate)
32
+ - [From `v1`](#from-v1)
33
+ - [`createPreviewSubscriptionHook` is replaced with `definePreview`](#createpreviewsubscriptionhook-is-replaced-with-definepreview)
34
+ - [Before](#before)
35
+ - [After](#after)
36
+ - [`createCurrentUserHook` is removed](#createcurrentuserhook-is-removed)
23
37
  - [From `v0.4`](#from-v04)
24
38
  - [`createPortableTextComponent` is removed](#createportabletextcomponent-is-removed)
25
39
  - [`createImageUrlBuilder` is removed](#createimageurlbuilder-is-removed)
@@ -34,13 +48,388 @@ $ npm install next-sanity @portabletext/react @sanity/image-url
34
48
  $ yarn add next-sanity @portabletext/react @sanity/image-url
35
49
  ```
36
50
 
37
- ## Live real-time preview
51
+ ## `next-sanity` Running groq queries
52
+
53
+ ```ts
54
+ import {createClient, groq} from 'next-sanity'
55
+
56
+ const projectId = process.env.NEXT_PUBLIC_SANITY_PROJECT_ID // "pv8y60vp"
57
+ const dataset = process.env.NEXT_PUBLIC_SANITY_DATASET // "production"
58
+ const apiVersion = process.env.NEXT_PUBLIC_SANITY_API_VERSION // "2022-11-16"
59
+
60
+ const client = createClient({
61
+ projectId,
62
+ dataset,
63
+ apiVersion,
64
+ useCdn: typeof document !== 'undefined',
65
+ })
66
+
67
+ const data = await client.fetch(groq`*[]`)
68
+ ```
69
+
70
+ ## `next-sanity/preview` Live real-time preview
38
71
 
39
72
  You can implement real-time client side preview using `definePreview`. It works by streaming the whole dataset to the browser, which it keeps updated using [listeners](https://www.sanity.io/docs/realtime-updates) and Mendoza patches. When it receives updates, then the query is run against the client-side datastore using [groq-js](https://github.com/sanity-io/groq-js).
73
+ It uses [`@sanity/preview-kit`](https://github.com/sanity-io/preview-kit) under the hood, which can be used in frameworks other than Nextjs if it supports React 18 Suspense APIs.
74
+
75
+ ### Examples
76
+
77
+ When running `next dev` locally these examples start and exit preview mode by opening [localhost:3000/api/preview](http://localhost:3000/api/preview) and [localhost:3000/api/exit-preview](http://localhost:3000/api/exit-preview).
78
+
79
+ #### Built-in Sanity auth
80
+
81
+ Pros:
82
+
83
+ - Checks if the user is authenticated for you.
84
+ - Pairs well with Sanity Studio preview panes.
85
+
86
+ Cons:
87
+
88
+ - Doesn't implement a login flow:
89
+ - Requires the user to login to a Sanity Studio prior to starting Preview mode.
90
+ - Requires your Sanity Studio to be hosted on the same origin.
91
+ - Currently only supports cookie based auth, and not yet the `dual` [loginMethod in Sanity Studio](https://github.com/sanity-io/sanity/blob/9bf408d4cc8b3e14bac0bf94d3305d6960181d3c/packages/%40sanity/default-login/README.md?plain=1#L37):
92
+ - Safari based browsers (Desktop Safari on Macs, and all browsers on iOS) doesn't work.
93
+ - Doesn't support incognito browser modes.
94
+
95
+ `pages/api/preview.js`:
96
+
97
+ ```js
98
+ export default function preview(req, res) {
99
+ res.setPreviewData({})
100
+ res.writeHead(307, {Location: '/'})
101
+ res.end()
102
+ }
103
+ ```
104
+
105
+ `pages/api/exit-preview.js`:
106
+
107
+ ```js
108
+ export default function exit(req, res) {
109
+ res.clearPreviewData()
110
+ res.writeHead(307, {Location: '/'})
111
+ res.end()
112
+ }
113
+ ```
114
+
115
+ `components/DocumentsCount.js`:
116
+
117
+ ```jsx
118
+ import groq from 'groq'
119
+
120
+ export const query = groq`count(*[])`
121
+
122
+ export function DocumentsCount({data}) {
123
+ return (
124
+ <>
125
+ Documents: <strong>{data}</strong>
126
+ </>
127
+ )
128
+ }
129
+ ```
130
+
131
+ `lib/sanity.client.js`
132
+
133
+ ```js
134
+ import {createClient} from 'next-sanity'
135
+
136
+ const projectId = process.env.NEXT_PUBLIC_SANITY_PROJECT_ID // "pv8y60vp"
137
+ const dataset = process.env.NEXT_PUBLIC_SANITY_DATASET // "production"
138
+ const apiVersion = process.env.NEXT_PUBLIC_SANITY_API_VERSION // "2022-11-16"
139
+
140
+ export const client = createClient({projectId, dataset, apiVersion, useCdn: false})
141
+ ```
142
+
143
+ `lib/sanity.preview.js`
144
+
145
+ ```js
146
+ 'use client'
147
+
148
+ import {definePreview} from 'next-sanity/preview'
149
+ import {projectId, dataset} from 'lib/sanity.client'
150
+
151
+ function onPublicAccessOnly() {
152
+ throw new Error(`Unable to load preview as you're not logged in`)
153
+ }
154
+ export const usePreview = definePreview({projectId, dataset, onPublicAccessOnly})
155
+ ```
156
+
157
+ `components/PreviewDocumentsCount.js`:
158
+
159
+ ```jsx
160
+ 'use client'
161
+
162
+ import {usePreview} from 'lib/sanity.preview'
163
+ import {query, DocumentsCount} from 'components/DocumentsCount'
164
+
165
+ export default function PreviewDocumentsCount() {
166
+ const data = usePreview(null, query)
167
+ return <DocumentsCount data={data} />
168
+ }
169
+ ```
170
+
171
+ ##### Next 12
172
+
173
+ `pages/index.js`:
174
+
175
+ ```jsx
176
+ import {PreviewSuspense} from 'next-sanity/preview'
177
+ import {lazy} from 'react'
178
+ import {DocumentsCount, query} from 'components/DocumentsCount'
179
+ import {client} from 'lib/sanity.client'
180
+
181
+ const PreviewDocumentsCount = lazy(() => import('components/PreviewDocumentsCount'))
182
+
183
+ export const getStaticProps = async ({preview = false}) => {
184
+ if (preview) {
185
+ return {props: {preview}}
186
+ }
187
+
188
+ const data = await client.fetch(query)
189
+
190
+ return {props: {preview, data}}
191
+ }
192
+
193
+ export default function IndexPage({preview, data}) {
194
+ if (preview) {
195
+ return (
196
+ <PreviewSuspense fallback="Loading...">
197
+ <PreviewDocumentsCount />
198
+ </PreviewSuspense>
199
+ )
200
+ }
201
+
202
+ return <DocumentsCount data={data} />
203
+ }
204
+ ```
205
+
206
+ ##### Next 13 `appDir`
207
+
208
+ `components/PreviewSuspense.js`:
209
+
210
+ ```jsx
211
+ 'use client'
212
+
213
+ // Once rollup supports 'use client' module directives then 'next-sanity' will include them and this re-export will no longer be necessary
214
+ export {PreviewSuspense as default} from 'next-sanity/preview'
215
+ ```
216
+
217
+ `app/page.js`:
218
+
219
+ ```jsx
220
+ import {lazy} from 'react'
221
+ import {previewData} from 'next/headers'
222
+ import PreviewSuspense from 'components/PreviewSuspense'
223
+ import {DocumentsCount, query} from 'components/DocumentsCount'
224
+ import {client} from 'lib/sanity.client'
225
+
226
+ const PreviewDocumentsCount = lazy(() => import('components/PreviewDocumentsCount'))
227
+
228
+ export default async function IndexPage() {
229
+ if (previewData()) {
230
+ return (
231
+ <PreviewSuspense fallback="Loading...">
232
+ <PreviewDocumentsCount />
233
+ </PreviewSuspense>
234
+ )
235
+ }
236
+
237
+ const data = await client.fetch(query)
238
+ return <DocumentsCount data={data} />
239
+ }
240
+ ```
241
+
242
+ #### Custom token auth
243
+
244
+ By providing a read token (Sanity API token with `viewer` rights) you override the built-in auth and get more control and flexibility.
245
+
246
+ Pros:
247
+
248
+ - Allows launching previews for users without necessarily an Sanity account.
249
+ - Hosting a Sanity Studio on the same origin is optional.
250
+ - Can build preview experiences that start outside a Studio, like "Copy share link" functionality.
251
+ - Works in all Safari based browsers (Desktop Safari on Macs, and all browsers on iOS).
252
+ - Works with incognito browser modes.
253
+
254
+ Cons:
255
+
256
+ - Like all things with great power comes great responsibility. You're responsible for implementing adequate protection against leaking the `token` in your js bundle, or preventing the `/api/preview?secret=${secret}` from being easily guessable.
257
+ - It results in a larger JS bundle as `@sanity/groq-store` currently requires `event-source-polyfill` since native `window.EventSource` does not support setting `Authorization` headers needed for the token auth.
258
+
259
+ `pages/api/preview.js`:
260
+
261
+ ```js
262
+ import getSecret from 'lib/getSecret'
263
+
264
+ export default async function preview(req, res) {
265
+ // The secret can't be stored in an env variable with a NEXT_PUBLIC_ prefix, as it would make you vulnerable to leaking the token to anyone.
266
+ // If you don't have an custom API with authentication that can handle checking secrets, you may use https://github.com/sanity-io/sanity-studio-secrets to store the secret in your dataset.
267
+ const secret = await getSecret()
268
+
269
+ // This is the most common way to check for auth, but we encourage you to use your existing auth infra to protect your token and securely transmit it to the client
270
+ if (!req.query.secret || req.query.secret !== secret) {
271
+ return res.status(401).json({message: 'Invalid secret'})
272
+ }
273
+
274
+ res.setPreviewData({token: process.env.SANITY_API_READ_TOKEN})
275
+ res.writeHead(307, {Location: '/'})
276
+ res.end()
277
+ }
278
+ ```
279
+
280
+ `pages/api/exit-preview.js`:
281
+
282
+ ```js
283
+ export default function exit(req, res) {
284
+ res.clearPreviewData()
285
+ res.writeHead(307, {Location: '/'})
286
+ res.end()
287
+ }
288
+ ```
289
+
290
+ `components/DocumentsCount.js`:
291
+
292
+ ```jsx
293
+ import groq from 'groq'
294
+
295
+ export const query = groq`count(*[])`
296
+
297
+ export function DocumentsCount({data}) {
298
+ return (
299
+ <>
300
+ Documents: <strong>{data}</strong>
301
+ </>
302
+ )
303
+ }
304
+ ```
305
+
306
+ `lib/sanity.client.js`
307
+
308
+ ```js
309
+ import {createClient} from 'next-sanity'
310
+
311
+ const projectId = process.env.NEXT_PUBLIC_SANITY_PROJECT_ID // "pv8y60vp"
312
+ const dataset = process.env.NEXT_PUBLIC_SANITY_DATASET // "production"
313
+ const apiVersion = process.env.NEXT_PUBLIC_SANITY_API_VERSION // "2022-11-16"
314
+
315
+ export const client = createClient({projectId, dataset, apiVersion, useCdn: false})
316
+ ```
317
+
318
+ `lib/sanity.preview.js`
319
+
320
+ ```js
321
+ 'use client'
322
+
323
+ import {definePreview} from 'next-sanity/preview'
324
+ import {projectId, dataset} from 'lib/sanity.client'
325
+
326
+ export const usePreview = definePreview({projectId, dataset})
327
+ ```
328
+
329
+ `components/PreviewDocumentsCount.js`:
330
+
331
+ ```jsx
332
+ 'use client'
333
+
334
+ import {usePreview} from 'lib/sanity.preview'
335
+ import {query, DocumentsCount} from 'components/DocumentsCount'
336
+
337
+ export default function PreviewDocumentsCount({token}) {
338
+ const data = usePreview(token, query)
339
+ return <DocumentsCount data={data} />
340
+ }
341
+ ```
342
+
343
+ ##### Next 12
344
+
345
+ `pages/index.js`:
346
+
347
+ ```jsx
348
+ import {PreviewSuspense} from 'next-sanity/preview'
349
+ import {lazy} from 'react'
350
+ import {DocumentsCount, query} from 'components/DocumentsCount'
351
+ import {client} from 'lib/sanity.client'
352
+
353
+ const PreviewDocumentsCount = lazy(() => import('components/PreviewDocumentsCount'))
354
+
355
+ export const getStaticProps = async ({preview = false, previewData = {}}) => {
356
+ if (preview && previewData?.token) {
357
+ return {props: {preview, token: previewData.token}}
358
+ }
359
+
360
+ const data = await client.fetch(query)
361
+
362
+ return {props: {preview, data}}
363
+ }
364
+
365
+ export default function IndexPage({preview, token, data}) {
366
+ if (preview) {
367
+ return (
368
+ <PreviewSuspense fallback="Loading...">
369
+ <PreviewDocumentsCount token={token} />
370
+ </PreviewSuspense>
371
+ )
372
+ }
373
+
374
+ return <DocumentsCount data={data} />
375
+ }
376
+ ```
377
+
378
+ ##### Next 13 `appDir`
379
+
380
+ `components/PreviewSuspense.js`:
381
+
382
+ ```jsx
383
+ 'use client'
384
+
385
+ // Once rollup supports 'use client' module directives then 'next-sanity' will include them and this re-export will no longer be necessary
386
+ export {PreviewSuspense as default} from 'next-sanity/preview'
387
+ ```
388
+
389
+ `app/page.js`:
390
+
391
+ ```jsx
392
+ import {lazy} from 'react'
393
+ import {previewData} from 'next/headers'
394
+ import PreviewSuspense from 'components/PreviewSuspense'
395
+ import {DocumentsCount, query} from 'components/DocumentsCount'
396
+ import {client} from 'lib/sanity.client'
397
+
398
+ const PreviewDocumentsCount = lazy(() => import('components/PreviewDocumentsCount'))
399
+
400
+ export default async function IndexPage() {
401
+ if (previewData()?.token) {
402
+ return (
403
+ <PreviewSuspense fallback="Loading...">
404
+ <PreviewDocumentsCount token={previewData().token} />
405
+ </PreviewSuspense>
406
+ )
407
+ }
408
+
409
+ const data = await client.fetch(query)
410
+ return <DocumentsCount data={data} />
411
+ }
412
+ ```
413
+
414
+ ### Starters
415
+
416
+ - [A Next.js Blog with a Native Authoring Experience](https://github.com/sanity-io/nextjs-blog-cms-sanity-v3)
40
417
 
41
418
  ### Limits
42
419
 
43
420
  The real-time preview isn't optimized and comes with a configured limit of 3000 documents. You can experiment with larger datasets by configuring the hook with `documentLimit: <Integer>`. Be aware that this might significantly affect the preview performance.
421
+ You may use the `includeTypes` option to reduce the amount of documents and reduce the risk of hitting the `documentLimit`:
422
+
423
+ ```js
424
+ import {definePreview} from 'next-sanity/preview'
425
+
426
+ export const usePreview = definePreview({
427
+ projectId,
428
+ dataset,
429
+ documentLimit: 10000,
430
+ includeTypes: ['page', 'product', 'sanity.imageAsset'],
431
+ })
432
+ ```
44
433
 
45
434
  We have plans for optimizations in the roadmap.
46
435
 
@@ -206,6 +595,113 @@ function Studiopage() {
206
595
 
207
596
  ## Migrate
208
597
 
598
+ ### From `v1`
599
+
600
+ #### `createPreviewSubscriptionHook` is replaced with `definePreview`
601
+
602
+ There are several differences between the hooks. First of all, `definePreview` requires React 18 and Suspense. And as it's designed to work with React Server Components you provide `token` in the hook itself instead of in the `definePreview` step. Secondly, `definePreview` encourages code-splitting using `React.lazy` and that means you only call the `usePreview` hook in a component that is lazy loaded. Quite different from `usePreviewSubscription` which was designed to be used in both preview mode, and in production by providing `initialData`.
603
+
604
+ ##### Before
605
+
606
+ The files that are imported here are the same as the [Next 12 example](#next-12).
607
+
608
+ `pages/index.js`
609
+
610
+ ```jsx
611
+ import {createPreviewSubscriptionHook} from 'next-sanity'
612
+ import {DocumentsCount, query} from 'components/DocumentsCount'
613
+ import {client, projectId, dataset} from 'lib/sanity.client'
614
+
615
+ export const getStaticProps = async ({preview = false}) => {
616
+ const data = await client.fetch(query)
617
+
618
+ return {props: {preview, data}}
619
+ }
620
+
621
+ const usePreviewSubscription = createPreviewSubscriptionHook({projectId, dataset})
622
+ export default function IndexPage({preview, data: initialData}) {
623
+ const {data} = usePreviewSubscription(indexQuery, {initialData, enabled: preview})
624
+ return <DocumentsCount data={data} />
625
+ }
626
+ ```
627
+
628
+ ##### After
629
+
630
+ `components/PreviewDocumentsCount.js`
631
+
632
+ ```jsx
633
+ import {definePreview} from 'next-sanity/preview'
634
+ import {projectId, dataset} from 'lib/sanity.client'
635
+
636
+ const usePreview = definePreview({projectId, dataset})
637
+ export default function PreviewDocumentsCount() {
638
+ const data = usePreview(null, query)
639
+ return <DocumentsCount data={data} />
640
+ }
641
+ ```
642
+
643
+ `pages/index.js`
644
+
645
+ ```jsx
646
+ import {lazy} from 'react'
647
+ import {PreviewSuspense} from 'next-sanity/preview'
648
+ import {DocumentsCount, query} from 'components/DocumentsCount'
649
+ import {client} from 'lib/sanity.client'
650
+
651
+ const PreviewDocumentsCount = lazy(() => import('components/PreviewDocumentsCount'))
652
+
653
+ export const getStaticProps = async ({preview = false}) => {
654
+ const data = await client.fetch(query)
655
+
656
+ return {props: {preview, data}}
657
+ }
658
+
659
+ export default function IndexPage({preview, data}) {
660
+ if (preview) {
661
+ return (
662
+ <PreviewSuspense fallback={<DocumentsCount data={data} />}>
663
+ <PreviewDocumentsCount />
664
+ </PreviewSuspense>
665
+ )
666
+ }
667
+ return <DocumentsCount data={data} />
668
+ }
669
+ ```
670
+
671
+ #### `createCurrentUserHook` is removed
672
+
673
+ If you used this hook to check if the user is cookie authenticated:
674
+
675
+ ```jsx
676
+ import {createCurrentUserHook} from 'next-sanity'
677
+
678
+ const projectId = process.env.NEXT_PUBLIC_SANITY_PROJECT_ID
679
+ const useCurrentUser = createCurrentUserHook({projectId})
680
+ const useCheckAuth = () => {
681
+ const {data, loading} = useCurrentUser()
682
+ return loading ? false : !!data
683
+ }
684
+
685
+ export default function Page() {
686
+ const isAuthenticated = useCheckAuth()
687
+ }
688
+ ```
689
+
690
+ Then you can achieve the same functionality using `@sanity/preview-kit` and `suspend-react`:
691
+
692
+ ```jsx
693
+ import {suspend} from 'suspend-react'
694
+ import {_checkAuth} from '@sanity/preview-kit'
695
+
696
+ const projectId = process.env.NEXT_PUBLIC_SANITY_PROJECT_ID
697
+ const useCheckAuth = () =>
698
+ suspend(() => _checkAuth(projectId, null), ['@sanity/preview-kit', 'checkAuth', projectId])
699
+
700
+ export default function Page() {
701
+ const isAuthenticated = useCheckAuth()
702
+ }
703
+ ```
704
+
209
705
  ### From `v0.4`
210
706
 
211
707
  #### `createPortableTextComponent` is removed
package/dist/preview.cjs CHANGED
@@ -1,28 +1,19 @@
1
1
  'use strict';
2
2
 
3
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
4
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
5
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
6
3
  Object.defineProperty(exports, '__esModule', {
7
4
  value: true
8
5
  });
9
6
  var previewKit = require('@sanity/preview-kit');
10
- var react = require('react');
11
- const lazyEventSourcePolyfill = react.cache(previewKit._lazyEventSourcePolyfill);
12
- const lazyGroqStore = react.cache(previewKit._lazyGroqStore);
13
- const checkAuth = react.cache(previewKit._checkAuth);
14
- const preload = react.cache((store, query, params) => store.query(query, params));
15
- const definePreview = config => previewKit._definePreview(_objectSpread(_objectSpread({}, config), {}, {
16
- importEventSourcePolyfill: () => react.use(lazyEventSourcePolyfill()),
17
- importGroqStore: () => react.use(lazyGroqStore()),
18
- checkAuth: (projectId, token) => react.use(checkAuth(projectId, token)),
19
- preload: (store, query, params) => react.use(preload(store, query, params))
20
- }));
21
7
  Object.defineProperty(exports, 'PreviewSuspense', {
22
8
  enumerable: true,
23
9
  get: function () {
24
10
  return previewKit.PreviewSuspense;
25
11
  }
26
12
  });
27
- exports.definePreview = definePreview;
13
+ Object.defineProperty(exports, 'definePreview', {
14
+ enumerable: true,
15
+ get: function () {
16
+ return previewKit.definePreview;
17
+ }
18
+ });
28
19
  //# sourceMappingURL=preview.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"preview.cjs","sources":["../src/preview/definePreview.tsx"],"sourcesContent":["import type {GroqStore} from '@sanity/groq-store'\nimport {\n type Params,\n type PreviewConfig,\n type UsePreview,\n _checkAuth,\n _definePreview,\n _lazyEventSourcePolyfill,\n _lazyGroqStore,\n} from '@sanity/preview-kit'\nimport {cache, use} from 'react'\n\nconst lazyEventSourcePolyfill = cache(_lazyEventSourcePolyfill)\nconst lazyGroqStore = cache(_lazyGroqStore)\nconst checkAuth = cache(_checkAuth)\nconst preload = cache((store: GroqStore, query: string, params?: Params) =>\n store.query<any>(query, params)\n)\n\n/**\n * @public\n */\nexport const definePreview = (config: PreviewConfig): UsePreview =>\n _definePreview({\n ...config,\n importEventSourcePolyfill: () => use(lazyEventSourcePolyfill()),\n importGroqStore: () => use(lazyGroqStore()),\n checkAuth: (projectId, token) => use(checkAuth(projectId, token)),\n preload: (store, query, params) => use(preload(store, query, params)),\n })\n\nexport type {Params, PreviewConfig, PreviewSuspenseProps, UsePreview} from '@sanity/preview-kit'\n"],"names":["lazyEventSourcePolyfill","cache","_lazyEventSourcePolyfill","lazyGroqStore","_lazyGroqStore","checkAuth","_checkAuth","preload","store","query","params","definePreview","config","_definePreview","importEventSourcePolyfill","use","importGroqStore","projectId","token"],"mappings":";;;;;;;;;;AAYA,MAAMA,uBAAA,GAA0BC,KAAAA,CAAAA,MAAMC,UAAAA,CAAAA,wBAAwB,CAAA;AAC9D,MAAMC,aAAA,GAAgBF,KAAAA,CAAAA,MAAMG,UAAAA,CAAAA,cAAc,CAAA;AAC1C,MAAMC,SAAA,GAAYJ,KAAAA,CAAAA,MAAMK,UAAAA,CAAAA,UAAU,CAAA;AAClC,MAAMC,OAAU,GAAAN,KAAA,CAAAA,KAAA,CAAM,CAACO,KAAkB,EAAAC,KAAA,EAAeC,WACtDF,KAAM,CAAAC,KAAA,CAAWA,OAAOC,MAAM,CAAA,CAChC;AAKa,MAAAC,aAAA,GAAiBC,MAAA,IAC5BC,yBAAe,iCACVD,MAAA;EACHE,yBAA2B,EAAA,MAAMC,SAAI,CAAAf,uBAAA,EAAyB,CAAA;EAC9DgB,eAAiB,EAAA,MAAMD,SAAI,CAAAZ,aAAA,EAAe,CAAA;EAC1CE,SAAA,EAAW,CAACY,SAAW,EAAAC,KAAA,KAAUH,UAAIV,SAAU,CAAAY,SAAA,EAAWC,KAAK,CAAC,CAAA;EAChEX,OAAA,EAAS,CAACC,KAAA,EAAOC,KAAO,EAAAC,MAAA,KAAWK,UAAIR,OAAQ,CAAAC,KAAA,EAAOC,KAAO,EAAAC,MAAM,CAAC;AAAA,GACrE;;;;;;;"}
1
+ {"version":3,"file":"preview.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
package/dist/preview.d.ts CHANGED
@@ -1,13 +1,11 @@
1
+ import {definePreview} from '@sanity/preview-kit'
1
2
  import {Params} from '@sanity/preview-kit'
2
3
  import {PreviewConfig} from '@sanity/preview-kit'
3
4
  import {PreviewSuspense} from '@sanity/preview-kit'
4
5
  import {PreviewSuspenseProps} from '@sanity/preview-kit'
5
6
  import {UsePreview} from '@sanity/preview-kit'
6
7
 
7
- /**
8
- * @public
9
- */
10
- export declare const definePreview: (config: PreviewConfig) => UsePreview
8
+ export {definePreview}
11
9
 
12
10
  export {Params}
13
11
 
package/dist/preview.js CHANGED
@@ -1,18 +1,2 @@
1
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
2
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
3
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
4
- import { _lazyEventSourcePolyfill, _lazyGroqStore, _checkAuth, _definePreview } from '@sanity/preview-kit';
5
- export { PreviewSuspense } from '@sanity/preview-kit';
6
- import { cache, use } from 'react';
7
- const lazyEventSourcePolyfill = cache(_lazyEventSourcePolyfill);
8
- const lazyGroqStore = cache(_lazyGroqStore);
9
- const checkAuth = cache(_checkAuth);
10
- const preload = cache((store, query, params) => store.query(query, params));
11
- const definePreview = config => _definePreview(_objectSpread(_objectSpread({}, config), {}, {
12
- importEventSourcePolyfill: () => use(lazyEventSourcePolyfill()),
13
- importGroqStore: () => use(lazyGroqStore()),
14
- checkAuth: (projectId, token) => use(checkAuth(projectId, token)),
15
- preload: (store, query, params) => use(preload(store, query, params))
16
- }));
17
- export { definePreview };
1
+ export { PreviewSuspense, definePreview } from '@sanity/preview-kit';
18
2
  //# sourceMappingURL=preview.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"preview.js","sources":["../src/preview/definePreview.tsx"],"sourcesContent":["import type {GroqStore} from '@sanity/groq-store'\nimport {\n type Params,\n type PreviewConfig,\n type UsePreview,\n _checkAuth,\n _definePreview,\n _lazyEventSourcePolyfill,\n _lazyGroqStore,\n} from '@sanity/preview-kit'\nimport {cache, use} from 'react'\n\nconst lazyEventSourcePolyfill = cache(_lazyEventSourcePolyfill)\nconst lazyGroqStore = cache(_lazyGroqStore)\nconst checkAuth = cache(_checkAuth)\nconst preload = cache((store: GroqStore, query: string, params?: Params) =>\n store.query<any>(query, params)\n)\n\n/**\n * @public\n */\nexport const definePreview = (config: PreviewConfig): UsePreview =>\n _definePreview({\n ...config,\n importEventSourcePolyfill: () => use(lazyEventSourcePolyfill()),\n importGroqStore: () => use(lazyGroqStore()),\n checkAuth: (projectId, token) => use(checkAuth(projectId, token)),\n preload: (store, query, params) => use(preload(store, query, params)),\n })\n\nexport type {Params, PreviewConfig, PreviewSuspenseProps, UsePreview} from '@sanity/preview-kit'\n"],"names":["lazyEventSourcePolyfill","cache","_lazyEventSourcePolyfill","lazyGroqStore","_lazyGroqStore","checkAuth","_checkAuth","preload","store","query","params","definePreview","config","_definePreview","importEventSourcePolyfill","use","importGroqStore","projectId","token"],"mappings":";;;;;;AAYA,MAAMA,uBAAA,GAA0BC,MAAMC,wBAAwB,CAAA;AAC9D,MAAMC,aAAA,GAAgBF,MAAMG,cAAc,CAAA;AAC1C,MAAMC,SAAA,GAAYJ,MAAMK,UAAU,CAAA;AAClC,MAAMC,OAAU,GAAAN,KAAA,CAAM,CAACO,KAAkB,EAAAC,KAAA,EAAeC,WACtDF,KAAM,CAAAC,KAAA,CAAWA,OAAOC,MAAM,CAAA,CAChC;AAKa,MAAAC,aAAA,GAAiBC,MAAA,IAC5BC,cAAe,iCACVD,MAAA;EACHE,yBAA2B,EAAA,MAAMC,GAAI,CAAAf,uBAAA,EAAyB,CAAA;EAC9DgB,eAAiB,EAAA,MAAMD,GAAI,CAAAZ,aAAA,EAAe,CAAA;EAC1CE,SAAA,EAAW,CAACY,SAAW,EAAAC,KAAA,KAAUH,IAAIV,SAAU,CAAAY,SAAA,EAAWC,KAAK,CAAC,CAAA;EAChEX,OAAA,EAAS,CAACC,KAAA,EAAOC,KAAO,EAAAC,MAAA,KAAWK,IAAIR,OAAQ,CAAAC,KAAA,EAAOC,KAAO,EAAAC,MAAM,CAAC;AAAA,GACrE;"}
1
+ {"version":3,"file":"preview.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}