NextButton = ({ layout }) => {
  const { query, actions } = useEditor(() => {});
  const options = useContext(optionsCtx);

  useEffect(() => {
    layoutToNodes(layout, query, actions, "ROOT", options);
  }, []);

  /**
   * @returns {void}
   */
  const onClick = () => {
    const { columns, layout } = craftToSaltcorn(
      JSON.parse(query.serialize()),
      "ROOT",
      options
    );
    document
      .querySelector("form#scbuildform input[name=columns]")
      .setAttribute("value", encodeURIComponent(JSON.stringify(columns)));
    document
      .querySelector("form#scbuildform input[name=layout]")
      .setAttribute("value", encodeURIComponent(JSON.stringify(layout)));
    document.getElementById("scbuildform").submit();
  };
  return (
    <button className="btn btn-sm btn-primary builder-save" onClick={onClick}>
      {options.next_button_label || "Next"} &raquo;
    </button>
  );
}
@param {object} opts
@param {object} opts.layout
@returns {button}
@category saltcorn-builder
@subcategory components
@namespace