import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { useDispatch, useSelect } from "@wordpress/data";
import { Guide } from "@wordpress/components";
import { __ } from "@wordpress/i18n";
import { store as preferencesStore } from "@wordpress/preferences";
function WelcomeGuidePage() {
  const { toggle } = useDispatch(preferencesStore);
  const isVisible = useSelect((select) => {
    const isPageActive = !!select(preferencesStore).get(
      "core/edit-site",
      "welcomeGuidePage"
    );
    const isEditorActive = !!select(preferencesStore).get(
      "core/edit-site",
      "welcomeGuide"
    );
    return isPageActive && !isEditorActive;
  }, []);
  if (!isVisible) {
    return null;
  }
  const heading = __("Editing a page");
  return /* @__PURE__ */ jsx(
    Guide,
    {
      className: "edit-site-welcome-guide guide-page",
      contentLabel: heading,
      finishButtonText: __("Continue"),
      onFinish: () => toggle("core/edit-site", "welcomeGuidePage"),
      pages: [
        {
          image: /* @__PURE__ */ jsx(
            "video",
            {
              className: "edit-site-welcome-guide__video",
              autoPlay: true,
              loop: true,
              muted: true,
              width: "312",
              height: "240",
              children: /* @__PURE__ */ jsx(
                "source",
                {
                  src: "https://s.w.org/images/block-editor/editing-your-page.mp4",
                  type: "video/mp4"
                }
              )
            }
          ),
          content: /* @__PURE__ */ jsxs(Fragment, { children: [
            /* @__PURE__ */ jsx("h1", { className: "edit-site-welcome-guide__heading", children: heading }),
            /* @__PURE__ */ jsx("p", { className: "edit-site-welcome-guide__text", children: __(
              // eslint-disable-next-line no-restricted-syntax -- 'sidebar' is a common web design term for layouts
              "It\u2019s now possible to edit page content in the site editor. To customise other parts of the page like the header and footer switch to editing the template using the settings sidebar."
            ) })
          ] })
        }
      ]
    }
  );
}
export {
  WelcomeGuidePage as default
};
//# sourceMappingURL=page.js.map
