import { jsx as _jsx } from "react/jsx-runtime";
import { useIntl } from "react-intl";
import { DropdownControl } from "./DropdownControl.js";
import { messages } from "../../../locales.js";
import { pushpinViewportDropdownItems } from "../../constants/dropdowns.js";
import { getTranslatedDropdownItems } from "../../utils/translations.js";
function getViewportProperty(props) {
    return props.properties?.controls?.["viewport"] ?? { area: "auto" };
}
/**
 * Generic viewport control for geo charts (pushpin and area).
 * Allows users to select a default viewport preset (auto, world, or continent).
 *
 * @internal
 */
export function GeoViewportControl(props) {
    const intl = useIntl();
    const { area } = getViewportProperty(props);
    const { disabled, properties, pushData, className = "s-geo-viewport-control" } = props;
    return (_jsx("div", { className: className, children: _jsx(DropdownControl, { value: area, valuePath: "viewport.area", labelText: messages["viewportAreaTitle"].id, disabled: disabled, showDisabledMessage: disabled, properties: properties, pushData: pushData, items: getTranslatedDropdownItems(pushpinViewportDropdownItems, intl) }) }));
}
//# sourceMappingURL=GeoViewportControl.js.map