import React from 'react';
import { b as StyleItem } from './index-CNZofLfG.js';
export { I as IControl, c as StyleSwitcherClassNames, a as StyleSwitcherControl, S as StyleSwitcherControlOptions } from './index-CNZofLfG.js';
interface MapGLStyleSwitcherProps {
/** Array of map styles to choose from */
styles: StyleItem[];
/** Currently active style ID */
activeStyleId?: string;
/** Theme of the control */
theme?: 'light' | 'dark' | 'auto';
/** Design variant of the control */
design?: 'default' | 'outlined';
/** Whether to show style labels */
showLabels?: boolean;
/** Whether to show style images */
showImages?: boolean;
/** Position of the control on the map */
position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
/** Animation duration in milliseconds */
animationDuration?: number;
/** Maximum height of the control */
maxHeight?: number;
/** Right-to-left layout */
rtl?: boolean;
/** Custom CSS class names */
classNames?: Partial<{
container: string;
list: string;
item: string;
itemSelected: string;
itemHideLabel: string;
dark: string;
light: string;
outlined: string;
}>;
/** Callback when style is about to change */
onBeforeStyleChange?: (from: StyleItem, to: StyleItem) => void;
/** Callback when style has changed */
onAfterStyleChange?: (from: StyleItem, to: StyleItem) => void;
/** Simplified callback that just returns the new style URL */
onStyleChange?: (styleUrl: string) => void;
}
/**
* React component for adding a style switcher control to react-map-gl Map
*
* @example
* ```tsx
* import { MapGLStyleSwitcher } from 'map-gl-style-switcher';
* import { Map } from 'react-map-gl/maplibre';
* import 'map-gl-style-switcher/dist/map-gl-style-switcher.css';
*
* function MyMap() {
* const [mapStyle, setMapStyle] = useState('style-url');
*
* return (
*
* );
* }
* ```
*/
declare const MapGLStyleSwitcher: React.FC;
export { MapGLStyleSwitcher, StyleItem };
export type { MapGLStyleSwitcherProps };