DOM Utilities

/**
 * Gets the owner document of an element, falling back to global document
 * @param node - Element to get document for
 * @returns Owner document or global document
 */
function getOwnerDocument(node?: Element | null): Document;

/**
 * Gets the owner window of an element, falling back to global window
 * @param node - Element to get window for
 * @returns Owner window or global window
 */
function getOwnerWindow(node?: Element | null): typeof globalThis;

/**
 * Gets the window object from an event, falling back to global window
 * @param event - Event to get window from
 * @returns Event window or global window
 */
function getEventWindow(event: Event): typeof window;

/**
 * Gets the currently active element in the document
 * @param node - Optional element to get document context from
 * @returns Active element as HTMLElement
 */
function getActiveElement(node?: HTMLElement): HTMLElement;

import { getOwnerDocument, getOwnerWindow, getEventWindow, getActiveElement } from "@chakra-ui/utils";

// Safe document access in iframe contexts
function handleElement(element: HTMLElement) {
  const doc = getOwnerDocument(element);
  const win = getOwnerWindow(element);
  
  // Use the element's document/window context
  const rect = element.getBoundingClientRect();
  const scrollTop = win.pageYOffset;
}

// Event handling with proper window context
function handleClick(event: MouseEvent) {
  const eventWindow = getEventWindow(event);
  const rect = eventWindow.innerWidth;
}

// Focus management
function manageFocus() {
  const currentFocus = getActiveElement();
  if (currentFocus) {
    console.log("Currently focused:", currentFocus.tagName);
  }
}

/**
 * Checks if a parent element contains a child element
 * @param parent - Parent element (can be null)
 * @param child - Child element to check
 * @returns True if parent contains child
 */
function contains(parent: HTMLElement | null, child: HTMLElement): boolean;

import { contains } from "@chakra-ui/utils";

// Check if click is inside a specific container
function handleDocumentClick(event: MouseEvent) {
  const dropdown = document.getElementById("dropdown");
  const target = event.target as HTMLElement;
  
  if (!contains(dropdown, target)) {
    // Click is outside dropdown, close it
    closeDropdown();
  }
}

// Modal backdrop handling
function ModalBackdrop({ children, onBackdropClick }: Props) {
  const modalRef = useRef<HTMLDivElement>(null);
  
  const handleClick = (event: MouseEvent) => {
    if (!contains(modalRef.current, event.target as HTMLElement)) {
      onBackdropClick();
    }
  };
  
  return (
    <div onClick={handleClick}>
      <div ref={modalRef}>{children}</div>
    </div>
  );
}

/**
 * Finds the nearest scrollable parent element
 * @param el - Element to start search from
 * @returns Nearest scrollable parent or document body
 */
function getScrollParent(el: HTMLElement): HTMLElement;

import { getScrollParent } from "@chakra-ui/utils";

// Tooltip positioning relative to scroll container
function positionTooltip(targetElement: HTMLElement, tooltip: HTMLElement) {
  const scrollParent = getScrollParent(targetElement);
  
  // Listen for scroll events on the scroll parent
  scrollParent.addEventListener("scroll", updateTooltipPosition);
  
  function updateTooltipPosition() {
    const targetRect = targetElement.getBoundingClientRect();
    const scrollRect = scrollParent.getBoundingClientRect();
    
    // Position tooltip relative to scroll container
    tooltip.style.top = `${targetRect.bottom - scrollRect.top}px`;
    tooltip.style.left = `${targetRect.left - scrollRect.left}px`;
  }
}

// Virtual scrolling implementation
function VirtualList({ items }: { items: any[] }) {
  const containerRef = useRef<HTMLDivElement>(null);
  
  useEffect(() => {
    const container = containerRef.current;
    if (!container) return;
    
    const scrollParent = getScrollParent(container);
    
    const handleScroll = () => {
      // Update visible items based on scroll position
      updateVisibleRange();
    };
    
    scrollParent.addEventListener("scroll", handleScroll);
    return () => scrollParent.removeEventListener("scroll", handleScroll);
  }, []);
  
  return <div ref={containerRef}>{/* Virtual list content */}</div>;
}

/**
 * Conditionally logs warnings in development mode
 * @param options - Warning configuration
 */
function warn(options: WarnOptions): void;

interface WarnOptions {
  condition: boolean;
  message: string;
}

import { warn } from "@chakra-ui/utils";

// Development warnings for component misuse
function Button({ size, variant, children }: ButtonProps) {
  warn({
    condition: !children,
    message: "Button component should have children content"
  });
  
  warn({
    condition: size === "xs" && variant === "solid",
    message: "Extra small solid buttons may have accessibility issues"
  });
  
  return <button className={cx(size, variant)}>{children}</button>;
}

// API deprecation warnings
function useOldHook() {
  warn({
    condition: true,
    message: "useOldHook is deprecated, use useNewHook instead"
  });
}