Function MainComponent

src/script.ts:342–375

({ children }: any)

};

export const MainComponent = ({ children }: any) => {
  const [x, setX] = React.useState(2);
  const memoXPlusOne = React.useMemo(() => x + 1, [x]);

  return React.createElement(
    // @ts-ignore
    TestContext.Provider,
    { value: { hello: x } },
    React.createElement(LeafComponent, null),
    // React.createElement(
    //   ContainerComponent,
    //   null,
    //   React.createElement(LeafComponent, null)
    // ),
    React.createElement(DualIncrementer, null),
    // React.createElement(DualIncrementer, null),
    React.createElement(ActionButton, null),
    React.createElement(OuterWrapper, null),
    React.createElement("div", { innerText: "memo'd x + 1: " + memoXPlusOne }),
    React.createElement(
      "div",
      {
        style: "color:blue",
      },
      React.createElement("button", {
        onclick: () => setX(x + 1),
        innerText: "RERENDER EVERYTHING " + x,
        style: "color: orange",
      })
    ),

    ...children
  );
};

export const MegaChild = () => {
  console.log("megachild re-render");