import React from "react";
import { Layer, Source } from "react-map-gl/maplibre";
import { _getCanvasColor as getCanvasColor } from "@dynatrace/strato-components-preview/charts";
import { ChoroplethLayerTooltip } from "./ChoroplethLayerTooltip.js";
import { parseRegionDataToGeoJSON } from "./functions/parse-region-data-to-geo-json.js";
import {
  ACTIVE_COLOR,
  ACTIVE_STATE_BORDERS_WIDTH,
  DEFAULT_CHOROPLETH_COLOR,
  DEFAULT_COUNTRIES_BORDER_COLOR,
  LEGEND_DIM_OPACITY,
  SHAPE_OPACITY,
  TRANSPARENT_BORDER_COLOR
} from "../../constants.js";
import { isChoroplethTooltipTemplate } from "../../functions/tooltip-type-guards.js";
import { useLayerColoringStrategy } from "../../hooks/use-layer-coloring-strategy.js";
import { useLegendInteractionHighlighting } from "../../hooks/use-legend-interaction-highlighting.js";
import { useLegendInteractionVisibility } from "../../hooks/use-legend-interaction-visibility.js";
import { useMapSource } from "../../hooks/use-map-source.js";
import { useResolveColor } from "../../hooks/use-resolve-color.js";
import { useTooltipTemplate } from "../../hooks/use-tooltip-template.js";
import { ChoroplethLayerTooltip as ChoroplethLayerTooltipSlot } from "../../slots/ChoroplethLayerTooltip.js";
const ChoroplethLayer = (props) => {
  const { layerId, data, regionAccessor, children } = props;
  const mapSource = useMapSource();
  const colorParser = useLayerColoringStrategy();
  const choroplethColor = useResolveColor(
    DEFAULT_CHOROPLETH_COLOR,
    props,
    colorParser
  );
  const sourceId = layerId.replace("layer", "source");
  useLegendInteractionHighlighting(props, sourceId);
  useLegendInteractionVisibility(props, layerId);
  const dataGeoJSON = parseRegionDataToGeoJSON(
    mapSource,
    data,
    regionAccessor,
    choroplethColor
  );
  const tooltipTemplate = useTooltipTemplate(
    children,
    ChoroplethLayerTooltipSlot
  );
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Source, { id: sourceId, type: "geojson", data: dataGeoJSON, generateId: true }, /* @__PURE__ */ React.createElement(
    Layer,
    {
      id: layerId,
      type: "fill",
      source: sourceId,
      paint: {
        "fill-color": [
          "case",
          ["boolean", ["feature-state", "active"], false],
          ["get", "__color"],
          ["boolean", ["feature-state", "hover"], false],
          ["get", "__hoveredColor"],
          ["get", "__color"]
        ],
        "fill-opacity": [
          "case",
          ["boolean", ["feature-state", "legendHover"], true],
          SHAPE_OPACITY,
          LEGEND_DIM_OPACITY
        ]
      }
    }
  ), /* @__PURE__ */ React.createElement(
    Layer,
    {
      type: "line",
      source: sourceId,
      paint: {
        "line-color": getCanvasColor(DEFAULT_COUNTRIES_BORDER_COLOR)
      }
    }
  ), /* @__PURE__ */ React.createElement(
    Layer,
    {
      type: "line",
      source: sourceId,
      paint: {
        "line-color": [
          "case",
          ["boolean", ["feature-state", "active"], false],
          getCanvasColor(ACTIVE_COLOR),
          getCanvasColor(TRANSPARENT_BORDER_COLOR)
        ],
        "line-width": ACTIVE_STATE_BORDERS_WIDTH
      }
    }
  )), /* @__PURE__ */ React.createElement(
    ChoroplethLayerTooltip,
    {
      layerId,
      tooltipTemplate: isChoroplethTooltipTemplate(tooltipTemplate) ? tooltipTemplate : void 0
    }
  ));
};
ChoroplethLayer["displayName"] = "ChoroplethLayer";
export {
  ChoroplethLayer
};
//# sourceMappingURL=ChoroplethLayer.js.map
