Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Children prop no longer available in custom block content #120

Open
gmferise opened this issue Oct 25, 2023 · 1 comment
Open

Children prop no longer available in custom block content #120

gmferise opened this issue Oct 25, 2023 · 1 comment

Comments

@gmferise
Copy link

gmferise commented Oct 25, 2023

Previously with @sanity/block-content-to-react you could use children in your custom blocks component:

import BaseBlockContent from '@sanity/block-content-to-react';

const components = {
  types: {
    block(props) {
      const { children } = props;
      return <div>{children}</div>;
    }
  },
};

function MyPage(props) {
  return (
    <BaseBlockContent components={components} />
  );
}

Now with this package the attribute is no longer available in props. This is the code I'm using to compute it myself as a workaround, which hopefully helps someone else.

import { PortableText } from '@portabletext/react';
import { buildMarksTree } from '@portabletext/toolkit';

const components = {
  types: {
    block(props) {
      const { value, renderNode } = props;
      const children = buildMarksTree(value).map((child, i) => (
        renderNode({
          node: child,
          isInline: true,
          index: i,
          renderNode,
        })
      ));
      return <div>{children}</div>;
    }
  }
};

function MyPage(props) {
  return (
    <PortableText components={components} />
  );
}
@gmferise gmferise changed the title Undocumented breaking change for Sanity migration Children prop no longer available in custom block content Jan 19, 2024
@gmferise
Copy link
Author

Edited for clarity.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant