/**
 * 在 TransformWrapper 内用 useControls 拿到 zoom 控制并渲染 ViewControls，确保点击加减能缩放
 */
import React, { useMemo } from 'react';
import { useControls } from 'react-zoom-pan-pinch';
import ViewControls from "./ViewControls";
export function ViewControlsWithZoom(props) {
  var _useControls = useControls(),
    zoomIn = _useControls.zoomIn,
    zoomOut = _useControls.zoomOut,
    resetTransform = _useControls.resetTransform;
  var api = useMemo(function () {
    return {
      zoomIn: zoomIn,
      zoomOut: zoomOut,
      resetTransform: resetTransform,
      fitBounds: props.fitBounds,
      toggleFullscreen: props.toggleFullscreen
    };
  }, [zoomIn, zoomOut, resetTransform, props.fitBounds, props.toggleFullscreen]);
  return /*#__PURE__*/React.createElement(ViewControls, {
    api: api,
    config: props.config,
    scale: props.scale,
    isFullscreen: props.isFullscreen,
    fitBoundsActive: props.fitBoundsActive,
    mapGridVisible: props.mapGridVisible,
    onToggleMapGrid: props.onToggleMapGrid,
    viewportLocked: props.viewportLocked,
    onToggleViewportLock: props.onToggleViewportLock,
    dockChrome: props.dockChrome,
    dockExpandedToolButtons: props.dockExpandedToolButtons,
    dockExpandedTrailing: props.dockExpandedTrailing,
    autoCollapseDockMs: props.autoCollapseDockMs
  });
}