Skip to content

[bug]: Blocks missing typed props that are provided by Strapi. #72

@theenoahmason

Description

@theenoahmason

What version of @strapi/blocks-react-renderer are you using?

  • Strapi Blocks renderer version: 1.0.2
  • Node version: 22
  • Strapi version: 5.30

What's Wrong?

Missing types

Some of valid types are missing in the library's typings for block nodes. They are provided by Strapi in the response, just not typed in this library.

/**
 * Should include `language`.
 */
interface CodeBlockNode {
    type: 'code';
    children: DefaultInlineNode[];
}

/**
 * Should include `target` and `rel`.
 */
interface LinkInlineNode {
    type: 'link';
    url: string;
    children: TextInlineNode[];
}

Temp fix

/**
 * Override type to accept `target` and `rel` props. Currently these are supported,
 * but not typed properly in Strapi's `BlocksReactRenderer` component.
 */
export type MyLinkInlineNode = {
	url?: string;
	children?: ReactNode;
	target?: string;
	rel?: string;
}

/**
 * Override type to accept `language` prop. Currently this is supported,
 * but not typed properly in Strapi's `BlocksReactRenderer` component.
 */
export type MyCodeBlockNode = {
	children?: ReactNode;
	language?: string;
}

// ...

<BlocksRenderer
	content={content}
	blocks={{
		// ...
		code({ children }: MyLinkInlineNode) {
			// ...
		},
		link({ url, children }: MyLinkInlineNode) {
			// ...
		},
		// ...
	}}
/>

Note: In my fixes, I typed the children as ReactNode, because the libary does not export DefaultInlineNode and TextInlineNode. It would be a good idea to export these should developers need them.

To Reproduce

Look at the types in BlocksRenderer.d.ts, then look at the response from Strapi.

Expected Behaviour

All types coming from Strapi's response should be typed in this Library.

Metadata

Metadata

Assignees

No one assigned

    Labels

    issue: bugIssue reporting a bug

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions