Block styles inside list items

[taylortouchless]

I have a setup like this:

import { PortableText } from '@portabletext/solid';

export default function Home() {
  return (
    <main>
      <PortableText
        value={[
          {
            listItem: 'number',
            markDefs: [],
            children: [
              {
                _key: '45ec4de97f48',
                _type: 'span',
                marks: [],
                text: 'Finally, enter your contact information and review your service appointment. You’re all set!',
              },
            ],
            level: 1,
            _type: 'block',
            style: 'medium',
            // style: 'normal',
            _key: '2d7d1c82304f',
          },
        ]}
        components={{
          block: {
            medium: ({ children }) => (
              <p class="font-medium text-lg">{children}</p>
            ),
          },
        }}
      />
    </main>
  );
}

When the // style: 'normal' is uncommented and we use 'medium' instead, the whole app crashes. I tested using portabletext/react and it works fine there.

[eigilnikolajsen]

I also experience this, would be nice with a fix! @stipsan

[stipsan]

Opened #71 — custom block styles on list items no longer recurse. The node was being re-rendered with listItem still set, so it dispatched back into itself. React already stripped that field first; this does the same.

[eigilnikolajsen]

Thank you so much!