children

• Type: ListItem[] | ((params: CallbackParams) => ListItem[])
• Optional: Yes

The children property allows you to create nested list structures. You can nest children multiple levels deep to create complex hierarchies.

Standard Nesting

JSON

{
  title: 'Profile',
  children: [
    {
      schemaType: 'author',
    },
    {
      schemaType: 'user',
    },
  ],
}

Helpers

helpers.children('Profile', [helpers.listing('author'), helpers.listing('user')]);

Deep Nesting (Nested Children)

JSON

{
  title: 'Content Management',
  children: [
    {
      title: 'Marketing',
      children: [
        {
          title: 'Campaigns',
          children: [
            {
              schemaType: 'summerSale',
            },
            {
              schemaType: 'winterSale',
            },
          ],
        },
        {
          schemaType: 'adChannel',
        },
      ],
    },
    {
      schemaType: 'blogPost',
    },
  ],
}

Helpers

helpers.children('Content Management', [
  helpers.children('Marketing', [
    helpers.children('Campaigns', [helpers.listing('summerSale'), helpers.listing('winterSale')]),
    helpers.listing('adChannel'),
  ]),
  helpers.listing('blogPost'),
]);

Dynamic Children (Callback)

You can define children dynamically using a callback function:

JSON

{
  title: 'Content',
  children: ({ workspace }) => workspace === 'blog'
    ? [{ schemaType: 'post' }]
    : [{ schemaType: 'product' }],
}

Helpers

helpers.children('Content', ({ workspace }) =>
  workspace === 'blog' ? [helpers.listing('post')] : [helpers.listing('product')],
);

With Child Resolver Options

You can access the childOptions passed by Sanity Studio's structure resolver to inspect current route parameters, parent pane references, or custom payload:

JSON

{
  title: 'Dynamic Comments',
  children: ({ childOptions }) => {
    const parentId = childOptions.parent?.id;
    return [
      {
        schemaType: 'comment',
        filter: `post._ref == $parentId`,
        filterParams: { parentId },
      }
    ];
  }
}

Helpers

helpers.children('Dynamic Comments', ({ childOptions }) => {
  const parentId = childOptions.parent?.id;
  return [
    helpers.listing('comment', {
      filter: `post._ref == $parentId`,
      filterParams: { parentId },
    }),
  ];
});