Release

.distignore

@@ -45,6 +45,8 @@ header-footer-grid/package.json
 header-footer-grid/package-lock.json
 header-footer-grid/rollup.config.js
 vendor/codeinwp/ti-onboarding/assets/vue
+vendor/codeinwp/themeisle-sdk/CHANGELOG.md
+vendor/composer/installed.json
 vendor/codeinwp/ti-about-page/assets/scss
 vendor/codeinwp/ti-about-page/assets/scss
 vendor/codeinwp/ti-onboarding/assets/scss

.github/workflows/playwright.yml

@@ -128,6 +128,8 @@ jobs:
             envs: "sample-data"
     #          - specs: "woo-visual-regression"
     #            envs: "woo-sample"
+          - specs: "editor"
+            envs: "sample-data"
     runs-on: ubuntu-22.04
     env:
       ZIP_URL: "https://verti-artifacts.s3.amazonaws.com/${{ github.event.pull_request.base.repo.name }}-${{ needs.dev-zip.outputs.branch-name }}-${{ needs.dev-zip.outputs.git-sha-8 }}/neve.zip"
@@ -150,5 +152,7 @@ jobs:
         if: failure()
         uses: actions/upload-artifact@v4
         with:
+          name: traces-${{ matrix.specs }}-${{ matrix.envs }}
           path: ./test-results/**
+          if-no-files-found: ignore
           retention-days: 1

CHANGELOG.md

@@ -77,7 +77,7 @@ New Features
 - Integrated installation of Login Customizer, Cookie Notice, Duplicate Page, and Custom Fonts/Scripts modules
 - New Maintenance and Coming Soon custom layouts [PRO]
 - Admin Dashboard Customizer module to personalize the WordPress admin experience (Menu, Admin Bar, Custom Pages) [Agency]
-- Included premium WP Landing Kit wordpress plugin [Agency]
+- Included premium WP Landing Kit WordPress plugin [Agency]
 
 Enhancements
 

assets/apps/dashboard/src/Components/Content/Settings/PerformancePlugins.js

@@ -0,0 +1,162 @@
+/* global neveDash */
+import { useEffect, useState } from '@wordpress/element';
+import { __ } from '@wordpress/i18n';
+import cn from 'classnames';
+import { LoaderCircle, LucidePuzzle, LucideRocket } from 'lucide-react';
+
+import Pill from '../../Common/Pill';
+import Toast from '../../Common/Toast';
+import TransitionInOut from '../../Common/TransitionInOut';
+import ControlWrap from '../../Controls/ControlWrap';
+import usePluginActions from '../../../Hooks/usePluginActions';
+import {
+	NEVE_HIDE_PLUGINS,
+	NEVE_PLUGIN_ICON_MAP,
+} from '../../../utils/constants';
+
+const PROMOTED_SLUGS = ['optimole-wp', 'wp-cloudflare-page-cache'];
+
+// How long the "Active" pill stays up before the card removes itself.
+const ACTIVE_PILL_TIMEOUT = 1500;
+
+const PluginCard = ({ slug, data, onDismiss }) => {
+	const ICON = NEVE_PLUGIN_ICON_MAP[slug] || LucidePuzzle;
+	// Titles and descriptions are already localized in inc/admin/dashboard/main.php.
+	const { title, description } = data;
+
+	const [error, setError] = useState(null);
+	const [success, setSuccess] = useState(false);
+
+	const { doPluginAction, loading, buttonText } = usePluginActions(
+		slug,
+		true
+	);
+
+	useEffect(() => {
+		if (!success) {
+			return;
+		}
+
+		// Only `success` belongs in the deps: onDismiss is recreated on every
+		// parent render and would restart a countdown already in progress.
+		const timeoutId = window.setTimeout(() => {
+			onDismiss(slug);
+		}, ACTIVE_PILL_TIMEOUT);
+
+		return () => window.clearTimeout(timeoutId);
+	}, [success]);
+
+	const handleClick = async () => {
+		setError(null);
+
+		window.tiTrk?.with('neve').set(slug, {
+			feature: 'performance-plugin-promo',
+			featureComponent: slug,
+		});
+
+		const result = await doPluginAction();
+
+		if (result.success) {
+			setSuccess(true);
+
+			return;
+		}
+
+		setError(result.error);
+	};
+
+	return (
+		<div
+			className="flex flex-col h-full p-4 bg-white rounded-lg border border-gray-100"
+			data-plugin={slug}
+		>
+			<div className="flex gap-3 items-center">
+				<ICON className="size-6 text-blue-500 shrink-0" />
+				<h4 className="text-sm font-medium text-gray-900">{title}</h4>
+
+				{success && (
+					<div className="ml-auto">
+						<TransitionInOut show>
+							<Pill type="success">{__('Active', 'neve')}</Pill>
+						</TransitionInOut>
+					</div>
+				)}
+			</div>
+
+			{/* grow keeps the CTAs aligned when descriptions wrap to different heights */}
+			<p className="grow text-sm leading-relaxed text-gray-600 mt-2">
+				{description}
+			</p>
+
+			{!success && (
+				<button
+					type="button"
+					onClick={handleClick}
+					disabled={loading}
+					className={cn(
+						'mt-3 self-start text-blue-600 hover:text-blue-700 text-sm font-medium flex items-center',
+						{ 'opacity-75 cursor-not-allowed': loading }
+					)}
+				>
+					{loading && (
+						<LoaderCircle size={14} className="animate-spin mr-2" />
+					)}
+					<span>{buttonText}</span>
+				</button>
+			)}
+
+			{error && (
+				<div className="mt-2">
+					<Toast type="error" dismiss={setError} message={error} />
+				</div>
+			)}
+		</div>
+	);
+};
+
+const PerformancePlugins = () => {
+	// Snapshot: a card leaves this list when it asks to, not when the store
+	// changes, so the "Active" pill outlives the activation request.
+	const [visibleSlugs, setVisibleSlugs] = useState(() =>
+		PROMOTED_SLUGS.filter((slug) => {
+			// Super Page Cache is dropped server side when SPC Pro is
+			// installed, so a promoted slug can be missing entirely.
+			const plugin = neveDash.plugins?.[slug];
+
+			return plugin && plugin.cta !== 'deactivate';
+		})
+	);
+
+	if (NEVE_HIDE_PLUGINS || visibleSlugs.length < 1) {
+		return null;
+	}
+
+	const handleDismiss = (dismissed) =>
+		setVisibleSlugs((current) =>
+			current.filter((slug) => slug !== dismissed)
+		);
+
+	return (
+		<ControlWrap
+			label={__('Recommended Plugins', 'neve')}
+			icon={LucideRocket}
+		>
+			<div
+				className={cn('grid gap-4', {
+					'md:grid-cols-2': visibleSlugs.length > 1,
+				})}
+			>
+				{visibleSlugs.map((slug) => (
+					<PluginCard
+						key={slug}
+						slug={slug}
+						data={neveDash.plugins[slug]}
+						onDismiss={handleDismiss}
+					/>
+				))}
+			</div>
+		</ControlWrap>
+	);
+};
+
+export default PerformancePlugins;

assets/apps/dashboard/src/Components/Content/Settings/PerformanceTabContent.js

@@ -11,6 +11,7 @@ import ToggleControl from '../../Controls/ToggleControl';
 import Button from '../../Common/Button';
 import useLicenseData from '../../../Hooks/useLicenseData';
 import OptionGroup from './OptionGroup';
+import PerformancePlugins from './PerformancePlugins';
 
 const LOCAL_HOSTING_OPTION = 'enable_local_fonts';
 
@@ -114,6 +115,8 @@ export default () => {
 				/>
 
 				{(isLicenseValid && <ProModuleSettings />) || <DummySettings />}
+
+				<PerformancePlugins />
 			</div>
 		</>
 	);

assets/apps/metabox/src/components/MetaFieldsManager.js

@@ -126,17 +126,39 @@ class MetaFieldsManager extends Component {
 		});
 	}
 
-	addCSSToHead(css, styleID = 'neve-meta-editor-style') {
-		const head = document.head;
-		const hasStyle = document.getElementById(styleID);
-		if (hasStyle) {
-			hasStyle.innerHTML = css;
-			return false;
+	/**
+	 * Documents the editor styles need to be added to.
+	 *
+	 * Since the block editor renders inside an iframe, styles added to the
+	 * top document alone don't reach the content. Older setups without the
+	 * iframe keep working through the top document.
+	 *
+	 * @return {Document[]} Target documents.
+	 */
+	getStyleTargets() {
+		const targets = [document];
+		const canvas = document.querySelector('iframe[name="editor-canvas"]');
+		const canvasDocument = canvas && canvas.contentDocument;
+
+		if (canvasDocument && canvasDocument.head) {
+			targets.push(canvasDocument);
 		}
-		const style = document.createElement('style');
-		style.setAttribute('id', styleID);
-		style.innerHTML = css;
-		head.appendChild(style);
+
+		return targets;
+	}
+
+	addCSSToHead(css, styleID = 'neve-meta-editor-style') {
+		this.getStyleTargets().forEach((doc) => {
+			const hasStyle = doc.getElementById(styleID);
+			if (hasStyle) {
+				hasStyle.innerHTML = css;
+				return;
+			}
+			const style = doc.createElement('style');
+			style.setAttribute('id', styleID);
+			style.innerHTML = css;
+			doc.head.appendChild(style);
+		});
 	}
 
 	updateTitleVisibility() {

assets/js/src/frontend/navigation.js

@@ -1,4 +1,4 @@
-/* global NeveProperties menuCalcEvent CustomEvent */
+/* global menuCalcEvent CustomEvent */
 /* jshint esversion: 6 */
 import {
 	toggleClass,
@@ -29,39 +29,49 @@ export const initNavigation = () => {
  * Reposition drop downs in case they go off screen.
  */
 export const repositionDropdowns = () => {
-	const { isRTL } = NeveProperties;
 	const dropDowns = document.querySelectorAll(
 		'.sub-menu, .minimal .nv-nav-search'
 	);
 
-	if (dropDowns.length === 0) return;
+	if (!dropDowns.length) return;
 
 	const windowWidth = window.innerWidth;
 
+	// How far a dropdown runs past the viewport: negative past the left edge,
+	// positive past the right edge, zero when it fits.
+	const getOverflow = (bounding) => {
+		if (bounding.left < 0) {
+			return bounding.left;
+		}
+
+		return bounding.right > windowWidth ? bounding.right - windowWidth : 0;
+	};
+
 	dropDowns.forEach((dropDown) => {
-		let bounding = dropDown.getBoundingClientRect(),
-			rightDist = bounding.left;
+		const style = dropDown.style;
 
-		if (rightDist < 0) {
-			dropDown.style.right = isRTL ? '-100%' : 'auto';
-			dropDown.style.left = isRTL ? 'auto' : 0;
-		}
+		// Drop what an earlier pass applied, so the dropdown is measured where
+		// the stylesheet puts it and stale offsets do not pile up.
+		style.right = style.left = style.transform = '';
 
-		if (rightDist + bounding.width >= windowWidth) {
-			dropDown.style.right = isRTL ? 0 : '100%';
-			dropDown.style.left = 'auto';
+		let overflow = getOverflow(dropDown.getBoundingClientRect());
+
+		if (!overflow) {
+			return;
 		}
 
-		// Recalculate bounding after we've made adjustments.
-		bounding = dropDown.getBoundingClientRect();
-		rightDist = bounding.left;
+		const edge = dropDown.matches('.sub-menu .sub-menu') ? '100%' : '0px';
+
+		style.right = overflow < 0 ? 'auto' : edge;
+		style.left = overflow < 0 ? edge : 'auto';
+
+		// Wider than the space on the side it opens towards, offset it to fit.
+		overflow = getOverflow(dropDown.getBoundingClientRect());
 
-		if (rightDist < 0 || rightDist + bounding.width >= windowWidth) {
-			// Calculate how much should we offset the dropdown to make it fit.
-			dropDown.style.transform =
+		if (overflow) {
+			style.transform =
 				'translateX(' +
-				(isRTL ? '-' : '') +
-				(Math.abs(rightDist) + 20) +
+				(overflow < 0 ? 20 - overflow : -overflow - 20) +
 				'px)';
 		}
 	});

assets/scss/components/hfg/frontend/layout/_general.scss

@@ -140,6 +140,6 @@ $desktop: map-get($gl-devices-list, desktop);
 	grid-template-columns: 1fr auto 1fr;
 }
 
-.hfg_header.site-header {
+.hfg_header.site-header:not(.neve-transparent-header) {
 	box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.1);
 }

assets/scss/components/main/_extends.scss

@@ -124,9 +124,9 @@
 
 %nv-form-labels {
 	font-weight: var(--formlabelfontweight, var(--bodyfontweight));
-	text-transform: var(--formlabeltexttransform);
-	letter-spacing: var(--formlabelletterspacing);
-	line-height: var(--formlabellineheight);
+	text-transform: var(--formlabeltexttransform, none);
+	letter-spacing: var(--formlabelletterspacing, normal);
+	line-height: var(--formlabellineheight, var(--bodylineheight));
 	font-size: var(--formlabelfontsize, var(--bodyfontsize));
 }
 

bin/envs/cli-setup.sh

@@ -21,6 +21,13 @@ init_environment(){
 	echo "Installing Neve theme from $NEVE_LOCATION"
 	wp --allow-root theme install --activate $NEVE_LOCATION
 	wp --allow-root option update fresh_site 0
+
+	# Activating Neve remaps widgets by sidebar id, and 'blog-sidebar' does not
+	# match the previous theme's, so the default widgets can be left unassigned.
+	if [ "$(wp --allow-root widget list blog-sidebar --format=count)" = "0" ]; then
+		echo "Populating blog-sidebar"
+		wp --allow-root widget add block blog-sidebar --content='<!-- wp:search /-->'
+	fi
   echo "Installing Theme API Plugin"
   wp --allow-root plugin install https://github.com/codeinwp/wp-thememods-api/archive/refs/heads/main.zip --force --activate
 }

bin/ss-pages.test.stub

@@ -4,7 +4,7 @@ describe( 'Starter Sites VR - {{site}}', () => {
     	let frontpage = "{{site}}"
 	    cy.visit(frontpage );
 		cy.captureDocument();
-        cy.get( '#nv-primary-navigation-main' ).then( $headerMenu => {
+        cy.get( '[id^="nv-primary-navigation"]' ).then( $headerMenu => {
             [ ...$headerMenu.find( '.menu-item a' ) ].forEach( $url => {
             	let url = $url.href;
             	if(url.includes("#")){
@@ -13,8 +13,11 @@ describe( 'Starter Sites VR - {{site}}', () => {
             	if(frontpage.replace(/\/*$/, "") === url.replace(/\/*$/, "")){
             		return;
 	            }
+            	if(pages.includes(url)){
+            		return;
+	            }
 
-                pages.push( $url.href );
+                pages.push( url );
             } );
         } );
     } );