ol-zoom-control is always in the overlay

[neeco1991]

Describe the bug
Despite being disabled as mentioned in the documentation, the ol-zoom-control continues to be displayed on the map.

Affected version(s)

Please run npm list --depth=0 vue vue3-openlayers ol ol-ext ol-contextmenu and paste the output below:

├── [email protected] -> .\node_modules\.pnpm\[email protected][email protected]\node_modules\ol-contextmenu
├── [email protected] -> .\node_modules\.pnpm\[email protected][email protected]\node_modules\ol-ext
├── [email protected] -> .\node_modules\.pnpm\[email protected]\node_modules\ol
└── [email protected] -> .\node_modules\.pnpm\[email protected][email protected][email protected][email protected][email protected]\node_modules\vue3-openlayers

To Reproduce
Steps to reproduce the behavior:

1. Go to the documentation
2. Disable ol-zoom-control
3. The control is still on the map

Expected behavior
When the ol-zoom-control is disabled, it should not be visible on the map.

Screenshots
Here's a screenshot from the documentation showing the issue:

Desktop (please complete the following information):

• OS: Windows 11
• Browser Chrome

Additional context

I have tested this behavior locally using the following code:

<script setup>
const center = ref([40, 40]);
const projection = ref('EPSG:4326');
const zoom = ref(8);
const rotation = ref(0);
</script>

<template>
  <ol-map
    :loadTilesWhileAnimating="true"
    :loadTilesWhileInteracting="true"
    style="height: 100%; position: relative"
    ref="olmap"
  >
    <ol-view
      :center="center"
      :rotation="rotation"
      :zoom="zoom"
      :projection="projection"
    />

    <ol-tile-layer :zIndex="1">
      <ol-source-osm
        url="url"
      />
    </ol-tile-layer>
  </ol-map>
</template>