import React, {
  forwardRef,
  useImperativeHandle,
  useRef
} from "react";
import {
  _ChartLayout as ChartLayout,
  _coerceSizeValue as coerceSizeValue
} from "@dynatrace/strato-components-preview/charts";
import { useMergeRefs } from "@dynatrace/strato-components-preview/core";
import { MapLegendRenderer } from "./components/legend/MapLegendRenderer.js";
import { MapContent } from "./components/MapContent.js";
import { DEFAULT_LEGEND_SIZES, DEFAULT_MAP_HEIGHT } from "./constants.js";
import { LayerIdsContext } from "./contexts/layer-ids.context.js";
import { MapConfigurationContext } from "./contexts/map-configuration.context.js";
import { MapCountryCodeContext } from "./contexts/map-country-code.context.js";
import { MapDataBoundingBoxContext } from "./contexts/map-data-bounding-box.context.js";
import { MapRawDataContext } from "./contexts/map-raw-data.context.js";
import { buildAndDownloadCsv } from "./functions/build-and-download-csv.js";
import { extractLayersData } from "./functions/extract-layers-data.js";
import { getDataLayersBoundingBox } from "./functions/get-data-layers-bounding-box.js";
import { getMapStatesTemplates } from "./functions/get-map-states-template.js";
import { iterateConfigSlots } from "./functions/iterate-config-slots.js";
import { setLayersId } from "./functions/set-layers-id.js";
import { useMapSettings } from "./hooks/use-map-settings.js";
import { useAutoLegendRefresh } from "./hooks/useAutoLegendRefresh.js";
import { ColorScaleProvider } from "./providers/color-scale.provider.js";
import { LayerColorStrategyProvider } from "./providers/layer-color-strategy.provider.js";
import { DisabledState } from "./slots/states/DisabledState.js";
import { ErrorStateSlot } from "./slots/states/ErrorStateSlot.js";
import { MapStoreProvider } from "./store/map-store.provider.js";
import "./styles/react-mapgl-styles.css";
const _MapView = forwardRef(
  (props, forwardedRef) => {
    const {
      children,
      loading = false,
      style: costumerStyle,
      className: customerClassNames,
      ...remaining
    } = props;
    const { layerIds, parsedChildren } = setLayersId(children);
    const layersData = extractLayersData(parsedChildren);
    const dataLayersBBox = getDataLayersBoundingBox(children);
    const containerRef = useRef(null);
    const rootRef = useMergeRefs([
      forwardedRef,
      containerRef
    ]);
    useImperativeHandle(forwardedRef, () => ({
      element: containerRef.current,
      downloadData: () => {
        buildAndDownloadCsv(layersData);
      }
    }));
    const config = iterateConfigSlots(children);
    const isLegendHidden = !config.legend || !!config.legend.hidden;
    const legendPosition = config.legend?.position;
    const legendRatio = config.legend?.ratio;
    const legendOnRatioChange = config.legend?.onRatioChange;
    const { errorState } = getMapStatesTemplates(children);
    const {
      isLoading: isLoadingSettings,
      isMapEnabled,
      countryCode
    } = useMapSettings();
    const chartHeight = coerceSizeValue(props.height) || DEFAULT_MAP_HEIGHT;
    const containerStyles = { width: "100%", ...costumerStyle };
    const chartLayoutRef = useAutoLegendRefresh(layersData);
    return /* @__PURE__ */ React.createElement(
      "div",
      {
        style: containerStyles,
        className: customerClassNames,
        "data-testid": "mapview-container"
      },
      !isLoadingSettings && !isMapEnabled ? /* @__PURE__ */ React.createElement(DisabledState, { height: chartHeight }) : /* @__PURE__ */ React.createElement(MapCountryCodeContext.Provider, { value: countryCode }, /* @__PURE__ */ React.createElement(MapConfigurationContext.Provider, { value: config }, /* @__PURE__ */ React.createElement(LayerIdsContext.Provider, { value: layerIds }, /* @__PURE__ */ React.createElement(MapRawDataContext.Provider, { value: layersData }, /* @__PURE__ */ React.createElement(MapDataBoundingBoxContext.Provider, { value: dataLayersBBox }, /* @__PURE__ */ React.createElement(MapStoreProvider, null, /* @__PURE__ */ React.createElement(ColorScaleProvider, null, /* @__PURE__ */ React.createElement(LayerColorStrategyProvider, null, /* @__PURE__ */ React.createElement(
        ChartLayout,
        {
          ref: chartLayoutRef,
          chartHeight,
          errorState,
          showLoader: loading || isLoadingSettings
        },
        /* @__PURE__ */ React.createElement(ChartLayout.Graph, null, !isLoadingSettings && /* @__PURE__ */ React.createElement(MapContent, { ref: rootRef, ...remaining }, parsedChildren)),
        !isLegendHidden && /* @__PURE__ */ React.createElement(
          ChartLayout.Legend,
          {
            position: legendPosition,
            ratio: legendRatio,
            ratioBoundaries: DEFAULT_LEGEND_SIZES,
            onResize: legendOnRatioChange
          },
          /* @__PURE__ */ React.createElement(MapLegendRenderer, null)
        )
      )))))))))
    );
  }
);
_MapView["displayName"] = "MapView";
const MapView = Object.assign(_MapView, {
  ErrorState: ErrorStateSlot
});
export {
  MapView
};
//# sourceMappingURL=MapView.js.map
