Component Block

---

A Custom Component is a Page Block that renders a custom React component.

Example

If we define a simple component:

// SayHello.tsx
export const SayHello = ({ name }: { name: string }) => {
  return <div>Hello {name}</div>;
};

// Import your component
import { SayHello } from "./SayHello";

// Render it
const config = {
  public: {
    pages: {
      HomePage: {
        items: [
          { type: "component", component: SayHello, props: { name: "Marco" } },
        ],
      },
    },
  },
};

Params

component

It's a React functional component primitive (not an Element!)

props

It's the list of properties to pass to the component at instanciation time.

This let you use the same component multiple times.