import {
  buildOptionTestId,
  getOptionLabel,
  getOptionValue
} from "./chunk-2JLZNSLY.js";

// src/components/Combobox/Option.tsx
import { useEffect, useRef } from "react";
import classNames from "classnames/dedupe";
import { jsx } from "react/jsx-runtime";
var Option = ({
  option,
  isHighlighted,
  onOptionSelect,
  optionComponent: OptionComponent,
  optionTestIdPrefix,
  id
}) => {
  const optionRef = useRef(null);
  const optionValue = getOptionValue(option) || "";
  const testId = buildOptionTestId(
    optionTestIdPrefix || "combobox-option",
    optionValue
  );
  useEffect(() => {
    if (isHighlighted && optionRef.current && optionRef.current.scrollIntoView) {
      optionRef.current.scrollIntoView({ block: "nearest" });
    }
  }, [isHighlighted]);
  return /* @__PURE__ */ jsx(
    "li",
    {
      ref: optionRef,
      role: "option",
      "data-testid": testId,
      id,
      "aria-selected": isHighlighted,
      onMouseDown: () => onOptionSelect(option),
      className: classNames("mobius-combobox__option", "has-pii", {
        "mobius-combobox__option--is-highlighted": isHighlighted
      }),
      children: OptionComponent ? /* @__PURE__ */ jsx(OptionComponent, { option, isHighlighted }) : getOptionLabel(option)
    },
    getOptionValue(option)
  );
};

export {
  Option
};
//# sourceMappingURL=chunk-WNWHIFKH.js.map
