✨ Highlights

Less custom input boilerplate

This release introduces a new spreadable elementProps property to all input components.

This currently includes things like onFocus/onBlur event handlers, ref, value (for primitive inputs) and an onChange that handles "native" React change events and emits the correct patches.

The intention is that you can safely pass (or "spread") these on to any "native" input element. This reduces the amount of boilerplate needed for custom inputs - especially those dealing with primitive values, and handles things like unsetting the field if the value is empty, extracting the value from a change event and similar.

For inputs dealing with complex values (objects and arrays), value is not included in elementProps, since it doesn't make sense to pass it to any native input.

This change also includes moving the change indicator rendering from individual primitive input components to their corresponding field component instead. This means even less boilerplate is needed in order to render a simple input component. In the future, we will provide a way to opt-out of this behavior, should you wish to handle the rendering of the change indicator yourself.

These changes means that in essence, all you need for the most basic custom string input would be:

import React from 'react'
import {StringInputProps} from 'sanity'

function StringInput(props: StringInputProps) {
  return <input type="text" {...props.elementProps} />
}

Note that this change means that input components will receive two "values" - props.value will now be of the "parsed" type defined in the schema (e.g. number), while elementProps.value will always be a string, since its intended to being forwarded as an attribute to the native HTML input element.

Context improvements

Custom validation functions and initial value resolvers now gets an extended context parameter passed to them, which includes the schema, the current user and a getClient() function.

Other features

• Now prints a warning when attempting to use an array with layout: 'tags' and a preconfigured list of options
• Now supports URL imports in sanity.config.ts
• Custom diff components are now supported and can be specified on schema types using the components.diff property
• A logo can now be passed to the configuration and will be rendered in the navigation bar. Note that this property name might change in an upcoming release, but we are including it for people who want to start working on the rendering of their studio logos.
• Studio loading should be between 50-300ms faster

BREAKING CHANGES

This release includes a few breaking changes:

Versioned client

The useClient() hook now requires you to pass an API version, for instance: useClient({apiVersion: '2022-09-14'}). This allows us to upgrade the API version used throughout the studio without breaking any custom queries or other requests performed from user code.

Similarily, the client property in various contexts (validation, config, initial value resolvers) is deprecated - instead there is a getClient() method attached to the context which takes the same API version configuration.

Router imports

Router imports have been moved from sanity/_unstable to sanity.

🐛 Notable bugfixes

• Fixes an issue where the reference input would sometimes be stuck in an initial loading phase
• Fixes an issue causing the tags layout not to work for string array inputs
• Fixes an issue where the content inside of a portable text annotation popover would sometimes not be displayed
• Fixes placement of custom markers in the portable text editor
• Fixes an issue where closing an empty array item would not automatically remove the item
• Fixes an issue where aliased schema types would get an extra layer of indentation in forms
• Fixes a peer dependency issue in @sanity/vision potentially causing installs to fail
• Fixes icons not being shown in certain structure panes
• Fixes an issue where previews using values from a schema type with a preconfigured list of options would use the name instead of the title
• Fixes an issue where fieldsets would not respect the readOnly property
• Fixes an issue where after hot-module reloading had been applied, some schema properties would not be reflected on Webpack-based environments such as Next.js
• Fixes an issue where the error screens would not be reset after a hot-module reload
• Fixes a bug where an invalid/expired session might cause the authentication screen to continously fail

📓 Full changelog