import { jsx as _jsx } from "react/jsx-runtime";
import React from "react";
import { useTabsContext } from "./TabsGroup";
export const TabPanel = ({ children, tabId }) => {
    const { activeTab } = useTabsContext();
    const isActive = activeTab.toString() === tabId.toString();
    if (!isActive) {
        return null;
    }
    return (_jsx("div", { role: "tabpanel", className: "w-full font-[var(--font-default)]", children: children }));
};
