import { jsx } from "react/jsx-runtime";
import { store as blocksStore } from "@wordpress/blocks";
import { privateApis as blockEditorPrivateApis } from "@wordpress/block-editor";
import { useSelect } from "@wordpress/data";
import { __experimentalItemGroup as ItemGroup } from "@wordpress/components";
import { NavigationButtonAsItem } from "../navigation-button";
import { unlock } from "../../../lock-unlock";
const { useGlobalStyle } = unlock(blockEditorPrivateApis);
function getFilteredBlockStyles(blockStyles, variations) {
  return blockStyles?.filter(
    (style) => style.source === "block" || variations.includes(style.name)
  );
}
function useBlockVariations(name) {
  const blockStyles = useSelect(
    (select) => {
      const { getBlockStyles } = select(blocksStore);
      return getBlockStyles(name);
    },
    [name]
  );
  const [variations] = useGlobalStyle("variations", name);
  const variationNames = Object.keys(variations ?? {});
  return getFilteredBlockStyles(blockStyles, variationNames);
}
function VariationsPanel({ name }) {
  const coreBlockStyles = useBlockVariations(name);
  return /* @__PURE__ */ jsx(ItemGroup, { isBordered: true, isSeparated: true, children: coreBlockStyles.map((style, index) => {
    if (style?.isDefault) {
      return null;
    }
    return /* @__PURE__ */ jsx(
      NavigationButtonAsItem,
      {
        path: "/blocks/" + encodeURIComponent(name) + "/variations/" + encodeURIComponent(style.name),
        children: style.label
      },
      index
    );
  }) });
}
export {
  VariationsPanel,
  useBlockVariations
};
//# sourceMappingURL=variations-panel.js.map
