React component for Maker Enhance.
yarn add maker-enhance
or
npm install --save maker-enhance
import MakerEnhance from "maker-enhance";
<MakerEnhance user={yourMakerUserIdOrSlug} />;import React from "react";
import MakerEnhance from "maker-enhance";
export default function Page() {
return (
<div>
<MakerEnhance user="user" instanceId="header" />
<MakerEnhance user="user" instanceId="page" loadingHeight={400} />
</div>
);
}- user (required) - string - Your Maker user id or slug
- instanceId - string - If you want to render multiple MakerEnhance components on one page, add a unique instanceId prop to each and every one of them so Maker can keep track of multiple instances
- loadingHeight - number - While Maker is loading, it doesn't know the final height of the content. To prevent Cumulative Layout Shift (CLS), Maker iframe blocks a height of 1000px during the loading and then adjusts to actual content height. If you know that your content height is static and will never be heigher than a certain value (let's say 400px), you can use loadingHeight to override this default 1000px height.