@frontify/fondue/dist/components/Tabs/TabItem.es.js

Design system of Frontify

import { jsx as f } from "react/jsx-runtime";
import { useState as r, useEffect as i } from "react";
import { checkIfContainInteractiveElements as c } from "../../utilities/elements.es.js";
import { merge as u } from "../../utilities/merge.es.js";
const b = ({ active: e, disabled: a, children: s, id: t }) => {
  const [n, o] = r(null), [l, m] = r(!1);
  return i(() => {
    m(c(n));
  }, [n]), e ? /* @__PURE__ */ f(
    "div",
    {
      role: "tabpanel",
      ref: o,
      id: `${t}-content`,
      "aria-labelledby": t,
      className: u([!e || a ? "tw-hidden" : "", "focus:tw-ring-4 focus:tw-ring-blue"]),
      tabIndex: l ? -1 : 0,
      children: s
    }
  ) : null;
};
b.displayName = "FondueTabItem";
export {
  b as TabItem
};
//# sourceMappingURL=TabItem.es.js.map