import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { __ } from "@wordpress/i18n";
import {
  __experimentalItemGroup as ItemGroup,
  __experimentalVStack as VStack,
  __experimentalHStack as HStack
} from "@wordpress/components";
import { privateApis as blockEditorPrivateApis } from "@wordpress/block-editor";
import { privateApis as editorPrivateApis } from "@wordpress/editor";
import { useContext } from "@wordpress/element";
import FontLibraryProvider, {
  FontLibraryContext
} from "./font-library-modal/context";
import FontLibraryModal from "./font-library-modal";
import FontFamilyItem from "./font-family-item";
import Subtitle from "./subtitle";
import { getFontFamilies } from "./utils";
import { unlock } from "../../lock-unlock";
const { GlobalStylesContext } = unlock(blockEditorPrivateApis);
const { mergeBaseAndUserConfigs } = unlock(editorPrivateApis);
function Typesets() {
  const { modalTabOpen, setModalTabOpen } = useContext(FontLibraryContext);
  const { base } = useContext(GlobalStylesContext);
  const { user: userConfig } = useContext(GlobalStylesContext);
  const config = mergeBaseAndUserConfigs(base, userConfig);
  const allFontFamilies = getFontFamilies(config);
  const hasFonts = allFontFamilies.filter((font) => font !== null).length > 0;
  return hasFonts && /* @__PURE__ */ jsxs(Fragment, { children: [
    !!modalTabOpen && /* @__PURE__ */ jsx(
      FontLibraryModal,
      {
        onRequestClose: () => setModalTabOpen(null),
        defaultTabId: modalTabOpen
      }
    ),
    /* @__PURE__ */ jsxs(VStack, { spacing: 2, children: [
      /* @__PURE__ */ jsx(HStack, { justify: "space-between", children: /* @__PURE__ */ jsx(Subtitle, { level: 3, children: __("Fonts") }) }),
      /* @__PURE__ */ jsx(ItemGroup, { isBordered: true, isSeparated: true, children: allFontFamilies.map(
        (font) => font && /* @__PURE__ */ jsx(
          FontFamilyItem,
          {
            font
          },
          font.slug
        )
      ) })
    ] })
  ] });
}
var typeset_default = ({ ...props }) => /* @__PURE__ */ jsx(FontLibraryProvider, { children: /* @__PURE__ */ jsx(Typesets, { ...props }) });
export {
  typeset_default as default
};
//# sourceMappingURL=typeset.js.map
