import { svg } from "lit";
import { Priority, InstrumentState } from "../navigation-instruments/types.js";
var SetpointVisualState = /* @__PURE__ */ ((SetpointVisualState2) => {
  SetpointVisualState2["notEqual"] = "notEqual";
  SetpointVisualState2["equal"] = "equal";
  SetpointVisualState2["equalZero"] = "equalZero";
  SetpointVisualState2["focus"] = "focus";
  return SetpointVisualState2;
})(SetpointVisualState || {});
var SetpointColorMode = /* @__PURE__ */ ((SetpointColorMode2) => {
  SetpointColorMode2["enhanced"] = "enhanced";
  SetpointColorMode2["regular"] = "regular";
  return SetpointColorMode2;
})(SetpointColorMode || {});
const SETPOINT_PATH_FILLED = "M22.5918 0.5C25.014 0.50013 26.3186 3.34437 24.917 5.29199L15.0244 19.0371C14.0268 20.423 11.9635 20.423 10.9658 19.0371L1.07326 5.29199C-0.328328 3.34437 0.97623 0.500124 3.39845 0.5L22.5918 0.5Z";
const SETPOINT_WIDTH = 26;
const SETPOINT_HEIGHT = 21;
const SETPOINT_TIP_X = 13;
const SETPOINT_TIP_Y = 21;
const SETPOINT_AT_SCALE = 0.8;
const SETPOINT_NOT_EQUAL_OFFSET = 4;
const SETPOINT_ZERO_OFFSET = 8;
const SETPOINT_ANIMATION_DURATION_MS = 300;
const SETPOINT_ANIMATION_CSS_VAR = "--setpoint-animation-duration";
const SETPOINT_ANIMATION_DURATION_DEFAULT = "300ms";
function getSetpointAnimationDurationMs(el) {
  const raw = getComputedStyle(el).getPropertyValue(SETPOINT_ANIMATION_CSS_VAR).trim();
  if (!raw) return SETPOINT_ANIMATION_DURATION_MS;
  const parsed = parseFloat(raw);
  if (Number.isNaN(parsed)) return SETPOINT_ANIMATION_DURATION_MS;
  if (raw.endsWith("s") && !raw.endsWith("ms")) return parsed * 1e3;
  return parsed;
}
function shortestAngularDistance(from, to) {
  const rawDiff = Math.abs((to - from) % 360 + 360) % 360;
  return rawDiff > 180 ? 360 - rawDiff : rawDiff;
}
function cssSafeAngle(prevCssAngle, targetAngle) {
  const normTarget = (targetAngle % 360 + 360) % 360;
  const normPrev = (prevCssAngle % 360 + 360) % 360;
  let delta = normTarget - normPrev;
  if (delta > 180) delta -= 360;
  if (delta < -180) delta += 360;
  return prevCssAngle + delta;
}
function getSetpointFillColor(visualState, colorMode, disabled = false) {
  if (disabled) {
    return "var(--instrument-frame-tertiary-color)";
  }
  if (visualState === "focus") {
    if (colorMode === "enhanced") {
      return "var(--base-blue-100)";
    } else {
      return "var(--instrument-regular-tertiary-color)";
    }
  }
  if (colorMode === "enhanced") {
    return "var(--instrument-enhanced-primary-color)";
  } else {
    return "var(--instrument-regular-primary-color)";
  }
}
function getSetpointStrokeColor(visualState, colorMode) {
  if (visualState === "focus") {
    if (colorMode === "enhanced") {
      return "var(--element-neutral-enhanced-color)";
    } else {
      return "var(--instrument-regular-secondary-color)";
    }
  }
  return "var(--border-silhouette-color)";
}
function getSetpointPath(_visualState) {
  return SETPOINT_PATH_FILLED;
}
function getSetpointScale(visualState) {
  switch (visualState) {
    case "equal":
    case "equalZero":
      return SETPOINT_AT_SCALE;
    default:
      return 1;
  }
}
function getSetpointOutwardOffset(visualState) {
  switch (visualState) {
    case "equalZero":
      return SETPOINT_ZERO_OFFSET;
    case "notEqual":
    case "focus":
      return SETPOINT_NOT_EQUAL_OFFSET;
    default:
      return 0;
  }
}
function generateSetpointId(prefix = "setpoint") {
  return `${prefix}-${Math.random().toString(36).slice(2, 9)}`;
}
function drawSetpointMarker(config) {
  const { visualState, colorMode, disabled = false, id } = config;
  const fillColor = getSetpointFillColor(visualState, colorMode, disabled);
  const strokeColor = getSetpointStrokeColor(visualState, colorMode);
  const path = getSetpointPath();
  const scale = getSetpointScale(visualState);
  const markerId = `${id}-marker`;
  const maskId = `${id}-mask`;
  const tipOffsetX = -SETPOINT_TIP_X;
  const tipOffsetY = -SETPOINT_TIP_Y;
  const scaleTransform = `scale(${scale})`;
  const isFocus = visualState === "focus";
  return svg`
    <defs>
      <g id="${markerId}">
        <path
          fill-rule="evenodd"
          clip-rule="evenodd"
          transform="translate(${tipOffsetX}, ${tipOffsetY})"
          d="${path}"
          vector-effect="non-scaling-stroke"
        />
      </g>
      <mask id="${maskId}">
        <rect x="-20" y="-30" width="50" height="50" fill="white" />
        <use href="#${markerId}" fill="black" />
      </mask>
    </defs>
    <g transform="${scaleTransform}" style="transition: transform 200ms ease-in-out;">
      <use href="#${markerId}" fill="${fillColor}" stroke="none" />
      ${isFocus ? svg`
          <!-- Focus state: 1px silhouette (outer) + 2px colored border (inner) -->
          <!-- First: masked silhouette stroke for outer 1px edge -->
          <use
            href="#${markerId}"
            mask="url(#${maskId})"
            fill="none"
            stroke="var(--border-silhouette-color)"
            stroke-width="4"
            stroke-linejoin="round"
            vector-effect="non-scaling-stroke"
          />
          <!-- Second: 2px colored border on top -->
          <use
            href="#${markerId}"
            fill="none"
            stroke="${strokeColor}"
            stroke-width="2"
            stroke-linejoin="round"
            vector-effect="non-scaling-stroke"
          />
        ` : svg`
          <use
            href="#${markerId}"
            mask="url(#${maskId})"
            fill="none"
            stroke="${strokeColor}"
            stroke-width="2"
            stroke-linejoin="round"
            vector-effect="non-scaling-stroke"
          />
        `}
    </g>
  `;
}
function deriveRadialSetpointConfig(config) {
  const {
    state,
    priority,
    atSetpoint,
    angleSetpoint,
    setpointAtZeroDeadband = 0.5,
    newAngleSetpoint,
    touching = false,
    setpointOverride = false
  } = config;
  const hasNewSetpoint = newAngleSetpoint !== void 0;
  const colorMode = priority === Priority.enhanced ? "enhanced" : "regular";
  if (state === InstrumentState.loading || state === InstrumentState.off) {
    return {
      visualState: "notEqual",
      // Full size, filled
      colorMode,
      disabled: !setpointOverride,
      // Tertiary color unless override is active
      hasNewSetpoint
    };
  }
  if (touching && !hasNewSetpoint) {
    return {
      visualState: "focus",
      colorMode,
      disabled: false,
      hasNewSetpoint
    };
  }
  const atZero = angleSetpoint !== void 0 && Math.abs(angleSetpoint) < setpointAtZeroDeadband;
  if (atSetpoint && atZero) {
    return {
      visualState: "equalZero",
      colorMode,
      disabled: false,
      hasNewSetpoint
    };
  }
  if (atSetpoint) {
    return {
      visualState: "equal",
      colorMode,
      disabled: false,
      hasNewSetpoint
    };
  }
  return {
    visualState: "notEqual",
    colorMode,
    disabled: false,
    hasNewSetpoint
  };
}
const RADIAL_SETPOINT_RADIUS = 168;
function computeAtSetpoint(config) {
  const {
    value,
    setpoint,
    touching,
    auto,
    deadband,
    atSetpointManual,
    angularWraparound = false
  } = config;
  if (value === void 0 || setpoint === void 0) return false;
  if (touching) return false;
  if (auto) {
    let distance = Math.abs(value - setpoint);
    if (angularWraparound && distance > 180) {
      distance = 360 - distance;
    }
    const safeDeadband = Number.isFinite(deadband) ? deadband : 0;
    return distance <= safeDeadband;
  }
  return atSetpointManual;
}
export {
  InstrumentState,
  Priority,
  RADIAL_SETPOINT_RADIUS,
  SETPOINT_ANIMATION_CSS_VAR,
  SETPOINT_ANIMATION_DURATION_DEFAULT,
  SETPOINT_ANIMATION_DURATION_MS,
  SETPOINT_AT_SCALE,
  SETPOINT_HEIGHT,
  SETPOINT_NOT_EQUAL_OFFSET,
  SETPOINT_PATH_FILLED,
  SETPOINT_TIP_X,
  SETPOINT_TIP_Y,
  SETPOINT_WIDTH,
  SETPOINT_ZERO_OFFSET,
  SetpointColorMode,
  SetpointVisualState,
  computeAtSetpoint,
  cssSafeAngle,
  deriveRadialSetpointConfig,
  drawSetpointMarker,
  generateSetpointId,
  getSetpointAnimationDurationMs,
  getSetpointFillColor,
  getSetpointOutwardOffset,
  getSetpointPath,
  getSetpointScale,
  getSetpointStrokeColor,
  shortestAngularDistance
};
//# sourceMappingURL=setpoint.js.map
