Allowed origins
allowOrigins restricts allowed iframe origins for security; requires sanity v3.85.0.
Content Source Maps
Allow tools to annotate content with metadata and use it to connect tools to content.
Core components
Custom filtering
Default filter skips unsafe values (39 field names plus pattern-based rules).
Data attributes for overlays
Optional extras to add data attributes enabling overlays.
defineDocuments() helper
Optional TypeScript helper for type safety when defining main document resolvers.
defineLocations() helper
Optional TypeScript helper for type safety when defining document location resolvers.
Documents, paths, and mappings
The map lists source documents, attribute paths, and per-element mappings.
Draft mode endpoints
Calls the enable endpoint when the preview opens; disable must be visited manually.
Draft Mode routes
Routes that toggle between published and draft content.
Dynamic Studio URLs
Supports Studio base paths, workspaces, and the Studio intent URL.
enableVisualEditing()
Handles both overlays and real-time content updates through the Presentation Tool's Comlink connection.
encodeDataAttribute helper
Generates data-sanity attributes for direct overlay control.
Filtering content
Follow the guided steps
GraphQL support
Supported in the Sanity GraphQL API v2023-08-01 and later.
GROQ compatibility
Supported types, traversals, conditionals, operators, and functions are documented.
How it fits together
Install the Sanity Context skill
keepStegaOnCopy prop
By default copy events strip stega encoding; set true to disable this behavior.
context.documentStore.listenQuery
Runs a GROQ query returning queried documents as an Observable in advanced resolvers.
Loaders
Configure loaders and call setServerClient with the client instance used to fetch server data.
loadQuery function
Custom function switching between published and draft content based on cookies.
MCP endpoint
MCP endpoint segments
onPerspectiveChange callback
Fires when the perspective changes in the driving Studio, receiving a ClientPerspective.
onSuspiciousStega callback
Reports stega found in unsafe DOM placements; intended for debugging.
Overlays
Architectural layer providing visual editing overlays.
Perspectives
Control whether queries return published, draft, or release content.
Prerequisites
Presentation Resolver API
Programmatically generate shortcuts from document forms to relevant routes.
Presentation Tool
Configure previewUrl, document location resolvers, allowed origins, components, and navigation.
Preview mode session
Cookie-based session helper stores preview and perspective context.
Preview URL configuration
previewUrl accepts a string, object, or resolver function.
Prompt your coding agent to run the setup skill
resultSourceMap parameter
Pass resultSourceMap=true on a GROQ query to receive a Content Source Map.
@sanity/astro integration
Provides a pre-configured Sanity client with Content Source Map encoding.
Sanity Context
Sanity Context document
SanityLive component
Picks up mutations and re-renders the frontend with new content.
SanityVisualEditing component
React component that renders click-to-edit overlays only during draft mode.
Stega cleanup
stegaClean() cleans query parameters and encoded values; automatic clipboard and paste cleanup.
Stega encoding
Architectural layer for encoding content for visual editing.
Stega option
Configuring stega enables automatic overlays for basic data types.
Supported groqFilter operators
VisualEditing component
Renders click-to-edit overlays during Draft Mode by reading stega-encoded strings from the DOM.
Visual Editing overlays
Optional overlays let editors jump from content to its source in Studio.
<VisualEditing /> component
Wrapper component that renders overlays, enables click to edit, and refreshes pages on content changes.
Wildcard and catch-all routes
Name wildcard parameters with /*name; catch-all matches every path and must be listed last.