import React, { useEffect } from "react";
import { useParentFrame } from "./useFrame";
import { jsx as ___EmotionJSX } from "@emotion/react";
/**
 * Component connecting to the host of the frame.
 * Once the connection has been established, `onConnected` will be called and will provide, as first parameter, a function to send actions to the host.
 * This component must be provided a `dispatch `function that will listen for actions coming from the host.
 */
export const HostConnector = _ref => {
  let {
    dispatch,
    children,
    onConnected
  } = _ref;
  const [connected, toHost] = useParentFrame({
    dispatch
  });
  useEffect(() => {
    if (connected) {
      onConnected(action => {
        if (toHost.dispatch) {
          toHost.dispatch(action);
        }
      });
    }
  }, [connected, toHost, onConnected]);
  return ___EmotionJSX(React.Fragment, null, children);
};
//# sourceMappingURL=HostConnector.js.map