"use client";
import { useIsoLayoutEffect } from "../../../utils/esm/useIsoLayoutEffect.js";
import { isElement } from "../../../../@floating-ui/utils/dist/floating-ui.utils.dom.js";
import { useBaseUiId } from "../utils/useBaseUiId.js";
import { useLabelableContext } from "./LabelableContext.js";
import { NOOP } from "../../../utils/esm/empty.js";
function useLabelableId(params = {}) {
  const {
    id,
    implicit = false,
    controlRef
  } = params;
  const {
    controlId,
    setControlId
  } = useLabelableContext();
  const defaultId = useBaseUiId(id);
  useIsoLayoutEffect(() => {
    if (!implicit && !id || setControlId === NOOP) {
      return void 0;
    }
    if (implicit) {
      const elem = controlRef?.current;
      if (isElement(elem) && elem.closest("label") != null) {
        setControlId(id ?? null);
      } else {
        setControlId(controlId ?? defaultId);
      }
    } else if (id) {
      setControlId(id);
    }
    return () => {
      if (id) {
        setControlId(void 0);
      }
    };
  }, [id, controlRef, controlId, setControlId, implicit, defaultId]);
  return controlId ?? defaultId;
}
export {
  useLabelableId
};
//# sourceMappingURL=useLabelableId.js.map
