Icon field in defineType type error

[gercordero]

Hello, I'm following Sanity's docs for adding an icon to a Document and I'm getting a type error when trying to do so. The icon is rendering fine on Sanity's studio so I guess this is purely a wrong type definition error:

My code:

import { DocumentTextIcon } from '@sanity/icons';
import { defineField, defineType } from '@sanity-typed/types';

export const blog = defineType({
    name: 'blog',
    type: 'document',
    title: 'Blog',
    icon: DocumentTextIcon, // <-- Error here
    fields: [
        defineField({
            name: 'title',
            type: 'string',
            title: 'Title of blog article',
        }),
          ...
    ],
});

Typescript error:

Type 'ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & RefAttributes<SVGSVGElement>>' is not assignable to type 'ComponentType | ReactNode'.
  Type 'ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & RefAttributes<SVGSVGElement>>' is not assignable to type 'FunctionComponent<{}>'.
Type 'ReactElement<any, string | JSXElementConstructor<any>> | null' is not assignable to type 'ReactNode'.
      Type 'ReactElement<any, string | JSXElementConstructor<any>>' is not assignable to type 'ReactNode'.
        Property 'children' is missing in type 'ReactElement<any, string | JSXElementConstructor<any>>' but required in type 'ReactPortal'.ts(2322)

I've tried doing icon: DocumentTextIcon as unknown as ReactNode which is not ideal but it doesn't work either as I'm getting this other error:

Type 'ReactNode' is not assignable to type 'ComponentType | ReactNode'.
  Type 'ReactElement<any, string | JSXElementConstructor<any>>' is not assignable to type 'ComponentType | ReactNode'.
    Property 'children' is missing in type 'ReactElement<any, string | JSXElementConstructor<any>>' but required in type 'ReactPortal'.ts(2322)

And yes, I've also tried doing icon: DocumentTextIcon as unknown as ComponentType | ReactNode and it doesn't work as well.

https://www.sanity.io/docs/icons-for-data-types

[saiichihashimoto]

I've tried this locally with no issues (although I should throw in a test to ensure this going forward). What version of typescript, sanity, and @sanity-typed/* are you using? @gercordero

[gercordero]

Hi @saiichihashimoto, I was using:

• typescript 5.1.6
• @sanity-typed/types 6.3.3
• sanity 3.39

I say was as I've stoped using this package atm as I notice that my VSCode was running very slow with the Type instantiation is excessively deep and possibly infinite issue. Currently I'm using sanity schema extract && sanity typegen generate to generate types but I'm really looking forward to use this package in the future as it looks very promising.