@primer/react/dist/experimental/Tabs/useTabPanel.js

An implementation of GitHub's Primer Design System using React

import { useTabs } from "./useTabs.js";
import { c } from "react-compiler-runtime";
//#region src/experimental/Tabs/useTabPanel.ts
/** Utility hook for tab panels */
function useTabPanel(props) {
	const $ = c(5);
	const { value } = props;
	const tabs = useTabs();
	const id = `${tabs.groupId}-panel-${value}`;
	const tabId = `${tabs.groupId}-tab-${value}`;
	const t0 = tabs.selectedValue === value ? "" : void 0;
	const t1 = tabs.selectedValue !== value;
	let t2;
	if ($[0] !== id || $[1] !== t0 || $[2] !== t1 || $[3] !== tabId) {
		t2 = { tabPanelProps: {
			"aria-labelledby": tabId,
			"data-selected": t0,
			id,
			hidden: t1,
			role: "tabpanel"
		} };
		$[0] = id;
		$[1] = t0;
		$[2] = t1;
		$[3] = tabId;
		$[4] = t2;
	} else t2 = $[4];
	return t2;
}
//#endregion
export { useTabPanel };