import React from "react";
import { Layer } from "react-map-gl/maplibre";
import { _getCanvasColor as getCanvasColor } from "@dynatrace/strato-components-preview/charts";
import { addOutlineSize } from "./functions/add-outline-size.js";
import { buildOutlineStickToDistanceExpression } from "./functions/build-stick-to-distance-expressions.js";
import { useSizeInterpolation } from "./hooks/use-size-interpolation.js";
import {
  ACTIVE_COLOR,
  BUBBLE_OUTLINE_STROKE,
  DEFAULT_RADIUS_EXPRESSION
} from "../../constants.js";
const DEFAULT_OUTLINE_RADIUS_EXPRESSION = addOutlineSize(
  DEFAULT_RADIUS_EXPRESSION
);
const BubbleOutlineLayer = ({
  beforeId,
  source
}) => {
  const sizeInterpolation = useSizeInterpolation();
  const outlineRadiusExpression = sizeInterpolation === "fixed" ? DEFAULT_OUTLINE_RADIUS_EXPRESSION : buildOutlineStickToDistanceExpression();
  return /* @__PURE__ */ React.createElement(
    Layer,
    {
      type: "circle",
      beforeId,
      source,
      paint: {
        "circle-radius": outlineRadiusExpression,
        "circle-opacity": 0,
        "circle-stroke-width": BUBBLE_OUTLINE_STROKE,
        "circle-stroke-color": getCanvasColor(ACTIVE_COLOR),
        "circle-stroke-opacity": [
          "case",
          ["boolean", ["feature-state", "active"], false],
          1,
          0
        ]
      }
    }
  );
};
export {
  BubbleOutlineLayer
};
//# sourceMappingURL=BubbleOutlineLayer.js.map
