Controls

import OlTileLayer from "ol/layer/Tile";
import { OSM } from "ol/source";

import { OverviewMapControl, RotateControl } from "@react-gis/openlayers/control";
import { TileLayer } from "@react-gis/openlayers/layer";
import { Map } from "@react-gis/openlayers/map";

const App = () => (
  <Map
    mapOptions={{
      // set to an empty array to remove default controls
      controls: [], 
      view: { center: [134, -28], zoom: 4 },
    }}
    style={{ height: "100%", width: "100%" }}
  >
    <RotateControl autoHide={false} />

    <OverviewMapControl layers={[new OlTileLayer({ source: new OSM() })]} />

    <TileLayer name="osm" source={new OSM()} />
  </Map>
);

import { defaults as defaultControls } from "ol/control/defaults";
import FullScreen from "ol/control/FullScreen";
import { OSM } from "ol/source";

import { TileLayer } from "@react-gis/openlayers/layer";
import { Map } from "@react-gis/openlayers/map";

const App = () => (
  <Map
    mapOptions={{
      controls: defaultControls().extend([new FullScreen()]), 
      view: { center: [134, -28], zoom: 4 },
    }}
    style={{ height: "100%", width: "100%" }}
  >
    <TileLayer name="osm" source={new OSM()} />
  </Map>
);