import React from "react";
import { Layer } from "react-map-gl";
import { calculateCircleTranslate } from "./functions/calculate-circle-translate.js";
import { resolveIconBackground } from "./functions/resolve-icon-background.js";
import {
  BUBBLE_OUTLINE_STROKE,
  ICON_BACKGROUND_OPACITY
} from "../../constants.js";
import { calculateHoveredColor } from "../../functions/calculate-hovered-color.js";
const BackgroundLayer = (props) => {
  const { background, beforeId, source, radius, iconAnchor } = props;
  const iconBackground = resolveIconBackground(background);
  const hoveredColor = calculateHoveredColor(iconBackground.color);
  const circleTranslate = calculateCircleTranslate(iconAnchor, radius);
  return /* @__PURE__ */ React.createElement(
    Layer,
    {
      type: "circle",
      beforeId,
      source,
      paint: {
        "circle-color": [
          "case",
          ["boolean", ["feature-state", "hover"], false],
          hoveredColor,
          iconBackground.color
        ],
        "circle-radius": radius,
        "circle-opacity": [
          "case",
          ["boolean", iconBackground.enabled, false],
          ICON_BACKGROUND_OPACITY,
          ["boolean", ["feature-state", "hover"], false],
          ICON_BACKGROUND_OPACITY,
          0
        ],
        "circle-stroke-width": [
          "case",
          ["boolean", ["feature-state", "active"], false],
          BUBBLE_OUTLINE_STROKE,
          0
        ],
        "circle-translate": circleTranslate
      }
    }
  );
};
export {
  BackgroundLayer
};
//# sourceMappingURL=BackgroundLayer.js.map
