import { jsx } from "react/jsx-runtime";
import { useContext } from "react";
import { Box } from "../Box/Box.mjs";
import { TextContext } from "../Accordion/AccordionItem.mjs";
import { HeadingContext } from "../Heading/Heading.mjs";
import { buildDataAttributes } from "../Accordion/Accordion.mjs";
import { root } from "./HiddenVisually.css.mjs";
const HiddenVisually = ({
  id,
  data,
  children,
  ...restProps
}) => {
  const inText = Boolean(useContext(TextContext));
  const inHeading = Boolean(useContext(HeadingContext));
  const component = inText || inHeading ? "span" : "div";
  return /* @__PURE__ */ jsx(
    Box,
    {
      component,
      id,
      position: "absolute",
      overflow: "hidden",
      className: root,
      ...buildDataAttributes({ data, validateRestProps: restProps }),
      children
    }
  );
};
export {
  HiddenVisually
};
