@kadoui/react/dist/components/SelectBox/SelectBoxRoot.js

Kadoui primitive components for React

"use client";
import { jsx as _jsx } from "react/jsx-runtime";
import { useEffect } from "react";
import { useRef, useState } from "react";
import { SelectBoxContext } from "./SelectBoxContext";
import { AccessNavigation, } from "../AccessNavigation/AccessNavigation";
export function SelectBoxRoot({ ref, ...p }) {
    const [inputFocused, setInputFocused] = useState(false);
    const [inputSearch, setInputSearch] = useState("");
    const selectBoxRootRef = ref || useRef(null);
    useEffect(() => {
        const handleClickOutside = (event) => {
            if (selectBoxRootRef.current &&
                !selectBoxRootRef.current.contains(event.target)) {
                setInputFocused(false);
            }
        };
        document.addEventListener("click", handleClickOutside);
        return () => {
            document.removeEventListener("click", handleClickOutside);
        };
    }, []);
    return (_jsx(SelectBoxContext, { value: { inputFocused, setInputFocused, inputSearch, setInputSearch }, children: _jsx(AccessNavigation, { ref: selectBoxRootRef, ...p }) }));
}