diff --git a/config/webpack/paths.js b/config/webpack/paths.js
index ed42efbbc78..d168fde0945 100644
--- a/config/webpack/paths.js
+++ b/config/webpack/paths.js
@@ -53,7 +53,6 @@ const getEntries = ( sourceDirectory = "./packages/js/src" ) => ( {
workouts: `${ sourceDirectory }/workouts.js`,
"frontend-inspector-resources": `${ sourceDirectory }/frontend-inspector-resources.js`,
"ai-generator": `${ sourceDirectory }/ai-generator/initialize.js`,
- "ai-content-planner": `${ sourceDirectory }/ai-content-planner/initialize.js`,
"ai-consent": `${ sourceDirectory }/ai-consent/initialize.js`,
plans: `${ sourceDirectory }/plans/initialize.js`,
} );
diff --git a/packages/js/src/components/fills/MetaboxFill.js b/packages/js/src/components/fills/MetaboxFill.js
index 8b832b29fdb..4b77f13ba63 100644
--- a/packages/js/src/components/fills/MetaboxFill.js
+++ b/packages/js/src/components/fills/MetaboxFill.js
@@ -1,6 +1,6 @@
/* External dependencies */
import { useSelect } from "@wordpress/data";
-import { Fragment } from "@wordpress/element";
+import { Fragment, lazy, Suspense } from "@wordpress/element";
import { Fill } from "@wordpress/components";
import { __ } from "@wordpress/i18n";
import PropTypes from "prop-types";
@@ -24,9 +24,14 @@ import { BlackFridayPromotion } from "../BlackFridayPromotion";
import { withMetaboxWarningsCheck } from "../higherorder/withMetaboxWarningsCheck";
import isBlockEditor from "../../helpers/isBlockEditor";
import useToggleMarkerStatus from "./hooks/useToggleMarkerStatus";
-import ContentPlannerEditorItem from "../../ai-content-planner/containers/content-planner-editor-item";
import { EditorIntro } from "../EditorIntro";
+// Lazy-loaded so the planner module is not bundled into block-editor.js.
+const ContentPlannerEditorItem = lazy( () => import(
+ /* webpackChunkName: "ai-content-planner-editor" */
+ "../../ai-content-planner/containers/content-planner-editor-item"
+) );
+
const BlackFridayPromotionWithMetaboxWarningsCheck = withMetaboxWarningsCheck( BlackFridayPromotion );
/* eslint-disable complexity */
@@ -77,7 +82,9 @@ export default function MetaboxFill( { settings } ) {
) }
{ isPost && isBlockEditorActive && isAiFeatureActive &&
-
+
+
+
}
{ settings.isKeywordAnalysisActive &&
import(
+ /* webpackChunkName: "ai-content-planner-editor" */
+ "../../ai-content-planner/containers/content-planner-editor-item"
+) );
+
/* eslint-disable complexity */
/**
* Creates the SidebarFill component.
@@ -66,7 +71,9 @@ export default function SidebarFill( { settings } ) {
{ isPost && isBlockEditorActive && isAiFeatureActive &&
-
+
+
+
}
{ settings.isKeywordAnalysisActive &&
initContentPlanner() );
}
const yoastTab = getQueryArg( window.location.href, "yoast-tab" );
diff --git a/src/ai/content-planner/user-interface/content-planner-integration.php b/src/ai/content-planner/user-interface/content-planner-integration.php
index dd399c599f6..75d40e032ce 100644
--- a/src/ai/content-planner/user-interface/content-planner-integration.php
+++ b/src/ai/content-planner/user-interface/content-planner-integration.php
@@ -61,8 +61,6 @@ public function __construct(
*/
public function register_hooks() {
\add_action( 'admin_enqueue_scripts', [ $this, 'enqueue_assets' ] );
- // Enqueue after Elementor_Premium integration, which re-registers the assets.
- \add_action( 'elementor/editor/before_enqueue_scripts', [ $this, 'enqueue_assets' ], 11 );
}
/**
@@ -77,12 +75,12 @@ public function get_script_data(): array {
}
/**
- * Localizes the content planner script data.
+ * Localizes the content planner script data onto the block-editor bundle,
+ * which lazy-loads the planner module on demand.
*
* @return void
*/
public function enqueue_assets() {
- $this->asset_manager->enqueue_script( 'ai-content-planner' );
- $this->asset_manager->localize_script( 'ai-content-planner', 'wpseoContentPlanner', $this->get_script_data() );
+ $this->asset_manager->localize_script( 'block-editor', 'wpseoContentPlanner', $this->get_script_data() );
}
}