Conditionally hide array item type based on document field value
I see what you're trying to do! Unfortunately, you've hit a known limitation in Sanity Studio - the hidden property doesn't work on individual array member types within the of array. According to the conditional fields documentation, the hidden callback works great for fields themselves, but not for specific types within an array's of configuration.
The Reality:
There isn't currently a built-in way to conditionally hide specific array member types in the insert menu based on document field values. This is a limitation that's been discussed in the community, and the official answer confirms that this functionality isn't available out of the box.
Workarounds to Consider:
1. Custom Input Component - Build a custom input component that programmatically filters which types appear in the insert menu based on document values. This gives you full control but requires more development work. You'd create a custom component that wraps the array input and conditionally renders only the types you want available.
2. Separate Array Fields with Conditional Visibility - Instead of one array with all block types, split them into separate arrays:
{
name: 'standardBlocks',
type: 'array',
of: [
{ type: 'introBlock' },
{ type: 'subscriptionBlock' },
{ type: 'pressMentionsBlock' },
// ... other standard blocks
],
},
{
name: 'blogListingBlocks',
type: 'array',
of: [
{ type: 'blogListingBlock' },
],
hidden: ({ document }) => document.pageType !== 'blogListing',
}This approach uses conditional fields on the array itself, which does work. The downside is you lose the unified ordering of blocks across both arrays.
3. Different Document Schemas - If the pageType field fundamentally changes what content structure you need, consider using different document types entirely (e.g., a standardPage type and a blogListingPage type with different schemas). This is the cleanest approach if your page types are truly different.
4. Validation Instead of Hiding - Keep all types visible but add validation that prevents saving if blogListingBlock is used when pageType isn't 'blogListing':
{
name: 'blocks',
type: 'array',
of: [/* all your types */],
validation: Rule => Rule.custom((blocks, context) => {
const hasBlogListingBlock = blocks?.some(block => block._type === 'blogListingBlock');
if (hasBlogListingBlock && context.document.pageType !== 'blogListing') {
return 'Blog Listing Block can only be used on Blog Listing pages';
}
return true;
})
}This doesn't hide the option, but it prevents incorrect usage with clear error messages.
The Bottom Line:
Unfortunately, there's no simple one-liner solution for conditionally hiding array member types in Sanity Studio. The custom input component approach gives you the most flexibility, but requires the most work. The separate arrays approach is the quickest workaround that uses native conditional field functionality. If your page types are fundamentally different, separate document schemas might be the cleanest long-term solution.
Show original thread3 replies
Sanity – Build the way you think, not the way your CMS thinks
Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.