import { composeEventHandlers } from "../../../utils/helpers/index.js";
import { useTabsContext } from "../../Tabs.context.js";
function useTab({ id, value, disabled = false, onFocus: _onFocus, onClick, ariaControls, }) {
    const { id: contextId, setSelectedValue, selectionFollowsFocus, focusedValue, setFocusedValue, selectedValue, makeTabId, makeTabPanelId, } = useTabsContext();
    const isSelected = value === selectedValue;
    const onFocus = () => {
        setFocusedValue(value);
        selectionFollowsFocus && setSelectedValue(value);
    };
    return {
        onClick: composeEventHandlers(onClick, () => setSelectedValue(value)),
        onFocus: disabled ? undefined : composeEventHandlers(_onFocus, onFocus),
        id: id !== null && id !== void 0 ? id : makeTabId(contextId, value),
        "aria-controls": ariaControls !== null && ariaControls !== void 0 ? ariaControls : makeTabPanelId(contextId, value),
        tabIndex: focusedValue === value ? 0 : -1,
        "aria-selected": isSelected,
        "data-state": isSelected ? "active" : "inactive",
        role: "tab",
        "data-aksel-tab": "",
        disabled,
        "data-disabled": disabled ? "" : undefined,
    };
}
export { useTab };
//# sourceMappingURL=useTab.js.map