import { jsxs as N, jsx as r } from "react/jsx-runtime";
import { classNames as m } from "./index-classNames.js";
import "react";
import { valueToPercent as y, markerPosition as d } from "./index-utils3.js";
import t from "./index-BenchmarkGaugeMarker.module.scss.js";
import { BenchmarkGaugePin as A } from "./index-BenchmarkGaugePin.js";
import { Render as M } from "./index-Render.js";
const E = (h) => {
  var a;
  const {
    marker: e,
    min: g,
    max: p,
    orientation: u,
    rankIndex: v,
    rankCount: f,
    isDimmed: n,
    isHighlighted: i,
    growHighlightedMarker: k,
    resolvedColor: x
  } = h, s = u === "vertical", o = y(e.value, g, p), C = (H) => {
    const l = H ?? "auto";
    return l !== "auto" ? l : o >= 85 ? "start" : "end";
  }, c = {
    marker: e,
    rankIndex: v,
    rankCount: f,
    isDimmed: n,
    isHighlighted: i
  }, S = s ? {
    bottom: d(o)
  } : {
    left: d(o)
  };
  return N("div", {
    className: m(t.marker, s && t.vertical, n && t.dimmed),
    style: S,
    children: [r(A, {
      marker: e,
      ctx: c,
      resolvedColor: x,
      isHighlighted: i,
      growHighlightedMarker: k
    }), r(M, {
      if: !!e.renderContent,
      children: r("div", {
        className: m(t.contentAnchor, C(e.contentSide) === "start" ? t.contentAnchorStart : t.contentAnchorEnd),
        children: r("div", {
          className: t.contentShell,
          children: (a = e.renderContent) == null ? void 0 : a.call(e, c)
        })
      })
    })]
  });
};
export {
  E as BenchmarkGaugeMarker
};
