How to use the gl-react.createSurface function in gl-react

position: "absolute",
      top: visibleContent ? 0 : height, // as a workaround for RN, we offset the content so it is not visible but still can be rasterized
      left: 0,
      width: width,
      height: height,
      overflow: "hidden",
    };
    return {children};
  };
  const renderVGL = props => {
    C.dimensionInvariant(props.width, "width");
    C.dimensionInvariant(props.height, "height");
    return ;
  };

  return createSurface(
    renderVcontainer,
    renderVcontent,
    renderVGL,
    getPixelRatio,
    C.getGLCanvas,
  );
};

}
          return React.cloneElement(element, {
            ref: !originalRef
              ? cloneRef
              : component => {
                  cloneRef(component);
                  originalRef(component);
                }
          });
        })}
      
    );
  }
}

export const Surface = createSurface({
  GLView,
  RenderLessElement,
  // $FlowFixMe trust me flow xD
  mapRenderableContent: (el: RenderLessElement) => el.getFirstChild(),
  requestFrame: raf,
  cancelFrame: raf.cancel
});

//@flow
import { createSurface } from "gl-react";
import raf from "raf";
import GLView from "./GLViewDOM";
import "webgltexture-loader-dom";

const RenderLessElement = "span";

const mapRenderableContent = (el: mixed) =>
  el instanceof Element ? el.firstElementChild : null;

export const Surface = createSurface({
  GLView,
  RenderLessElement,
  mapRenderableContent,
  requestFrame: raf,
  cancelFrame: raf.cancel
});

//@flow
import { View } from "react-native";
import { createSurface } from "gl-react";
import GLView from "./GLViewNative";
import "webgltexture-loader-react-native";

const RenderLessElement = View;

export const Surface = createSurface({
  GLView,
  RenderLessElement,
  requestFrame: global.requestAnimationFrame,
  cancelFrame: global.cancelAnimationFrame
});

function renderVcontainer ({ style, visibleContent, eventsThrough, width, height }, contents, renderer) {
  const parentStyle = {
    position: "relative",
    ...style,
    width: width+"px",
    height: height+"px",
    overflow: "hidden",
    [pointerEventsProperty]: !visibleContent && eventsThrough ? "none" : "auto"
  };
  return <div style="{parentStyle}">
    {contents}
    {renderer}
  </div>;
}

module.exports = createSurface(renderVcontainer, renderVcontent, renderVGL, getPixelRatio);