@sanity/client 6.7.1 → 6.8.0-pink-lizard.1

package/README.md

@@ -610,8 +610,6 @@ Content Source Maps annotate fragments in your query results with metadata about
 >
 > [Content Source Maps][content-source-maps-intro] are available [as an API][content-source-maps] for select [Sanity enterprise customers][enterprise-cta]. [Contact our sales team for more information.][sales-cta]
 
-A high level API using Content Source Maps for [Visual editing][visual-editing] is also available in [`@sanity/preview-kit/client`][preview-kit-client]. It offers both a turn-key solution and a flexible API for custom experiences.
-
 Read the [Content Source Maps introduction][content-source-maps-intro] before diving in, and keep the [Content Source Maps reference][content-source-maps] handy.
 
 Enabling Content Source Maps is a two-step process:
@@ -656,6 +654,85 @@ function useContentSourceMap(resultSourceMap: ContentSourceMapping): unknown {
 useContentSourceMap(resultSourceMap)
 ```
 
+#### Creating Studio edit intent links
+
+```ts
+import {createEditLink} from '@sanity/client/csm'
+
+const editLink = createEditLink({
+  studioUrl: (sourceDocument: ContentSourceMapDocuments[number], sourcePath: PathSegment[]) =>
+    StudioUrl,
+  resultSourceMap: ContentSourceMapping,
+  resultPath: StudioPath,
+})
+```
+
+In general, fetch a single post
+
+With arrays, and keyed array items.
+
+#### Using [Visual editing][visual-editing] with steganography
+
+A turnkey integration with [Visual editing][visual-editing] is available in [`@sanity/client/stega`]. It creates edit intent links for all the string values in your query result, using [steganography](https://npmjs.com/package/@vercel/stega) under the hood.
+
+```ts
+import {createClient} from '@sanity/client/stega'
+
+const client = createClient({
+  // ...base config options
+  stega: {
+    // Required: for encoded metadata from Content Source Maps
+    enabled: process.env.VERCEL_ENV !== 'production',
+    // Required: when "enabled" is true
+    // Set it to relative or absolute URL of your Sanity Studio
+    studioUrl: '/studio', // or 'https://your-project-name.sanity.studio'
+    studioUrl: (sourceDocument: {_id, _type, _projectId, _dataset}) => select workspace if cross dataset reference
+
+    // Optional, control what fields have stega payloads
+    filter: (props) => {
+      // {"name": title}
+      const {resultPath, sourcePath, resultPath} = props
+      if (props.sourcePath[0] === 'externalurl') {
+        return false
+      }
+      // The default behavior is packaged into `filterDefault`, allowing you enable encoding fields that are skipped by default
+      return props.filterDefault(props)
+    },
+
+    // Optional, logs what's encoded and what isn't
+    logger: console,
+  },
+})
+
+// Disable on demand
+client.config({stega: {enabled: false}})
+
+// New client with different stega settings
+const debugClient = client.withConfig({
+  stega: {studioUrl: 'https://your-project-name.sanity.studio'},
+})
+
+import {createQueryStore} from '@sanity/react-loader'
+import {createClient} from '@sanity/client/stega'
+
+const studioUrl = '/studio'
+
+const client = createClient({
+  projectId,
+  dataset,
+  useCdn: true,
+  apiVersion: '2023-11-01',
+  stega: {
+    studioUrl,
+  }
+})
+
+
+const {useQuery, useLiveMode} = createQueryStore({client, studioUrl})
+
+useLiveMode({client: client.withConfig({stega: {enabled: true}})})
+```
+
 ### Listening to queries
 
 ```js