@elementor/editor-audits 4.4.0-1122 → 4.4.0-1124

package/dist/index.d.mts

@@ -69,6 +69,7 @@ type PageContextResponse = {
     ally_accessibility_statement_created: boolean;
     ally_accessibility_statement_url: string;
     ally_widget_settings_url: string;
+    ally_scan_url: string;
     cookiez_plugin_active: boolean;
     cookiez_plugin_url: string;
     cookiez_plugin_installed: boolean;
@@ -77,6 +78,7 @@ type PageContextResponse = {
     cookiez_consent_mode_settings_url: string;
     image_optimization_plugin_active: boolean;
     image_optimization_plugin_url: string;
+    image_optimization_settings_url: string;
     frontend_url: string | null;
     site_identity: {
         site_name_set: boolean;

package/dist/index.d.ts

@@ -69,6 +69,7 @@ type PageContextResponse = {
     ally_accessibility_statement_created: boolean;
     ally_accessibility_statement_url: string;
     ally_widget_settings_url: string;
+    ally_scan_url: string;
     cookiez_plugin_active: boolean;
     cookiez_plugin_url: string;
     cookiez_plugin_installed: boolean;
@@ -77,6 +78,7 @@ type PageContextResponse = {
     cookiez_consent_mode_settings_url: string;
     image_optimization_plugin_active: boolean;
     image_optimization_plugin_url: string;
+    image_optimization_settings_url: string;
     frontend_url: string | null;
     site_identity: {
         site_name_set: boolean;

package/dist/index.js

@@ -1021,7 +1021,7 @@ var import_editor_mcp = require("@elementor/editor-mcp");
 var import_icons6 = require("@elementor/icons");
 var import_ui8 = require("@elementor/ui");
 var import_i18n9 = require("@wordpress/i18n");
-function FixViolationWithAngie({ prompt, panelZIndex }) {
+function FixViolationWithAngie({ prompt, panelZIndex, variant = "icon" }) {
   const label = (0, import_i18n9.__)("Fix with Angie", "elementor");
   const href = `#angie-prompt=${encodeURIComponent(prompt)}`;
   const handleClick = (event) => {
@@ -1040,6 +1040,21 @@ function FixViolationWithAngie({ prompt, panelZIndex }) {
       })
     );
   };
+  if (variant === "button") {
+    return /* @__PURE__ */ React8.createElement(
+      import_ui8.Button,
+      {
+        component: "a",
+        href,
+        size: "small",
+        color: "secondary",
+        variant: "outlined",
+        startIcon: /* @__PURE__ */ React8.createElement(import_icons6.AngieIcon, { fontSize: "tiny", "aria-hidden": true }),
+        onClick: handleClick
+      },
+      label
+    );
+  }
   return /* @__PURE__ */ React8.createElement(import_ui8.Tooltip, { title: label, placement: "top", PopperProps: { sx: { zIndex: panelZIndex } } }, /* @__PURE__ */ React8.createElement(import_ui8.IconButton, { component: "a", href, size: "small", "aria-label": label, onClick: handleClick }, /* @__PURE__ */ React8.createElement(import_icons6.AngieIcon, { fontSize: "tiny" })));
 }
 
@@ -1051,9 +1066,11 @@ var SEVERITY_CONFIG = {
   warning: { Icon: import_icons7.AlertCircleIcon, color: "warning" },
   info: { Icon: import_icons7.BulbIcon, color: "info" }
 };
+var INFO_ICON_VERTICAL_NUDGE = "translateY(-2px)";
 function SeverityIcon({ severity }) {
   const { Icon, color } = SEVERITY_CONFIG[severity];
-  return /* @__PURE__ */ React9.createElement(Icon, { fontSize: "small", color });
+  const sx = "info" === severity ? { transform: INFO_ICON_VERTICAL_NUDGE } : void 0;
+  return /* @__PURE__ */ React9.createElement(Icon, { fontSize: "small", color, sx });
 }
 
 // src/components/violation-cta-button.tsx
@@ -1114,31 +1131,49 @@ function StatusIndicator({ audit: audit26, violations }) {
   }
   return /* @__PURE__ */ React12.createElement(import_icons10.CheckIcon, { fontSize: "small", color: "success" });
 }
-function GuidanceAction({ violation }) {
+function GuidanceAction({
+  violation,
+  sharedAngiePrompt,
+  panelZIndex
+}) {
   const hasPrimaryCta = !!(violation.ctaLabel && violation.externalUrl);
-  if (!hasPrimaryCta) {
+  if (!hasPrimaryCta && !sharedAngiePrompt) {
     return null;
   }
-  return /* @__PURE__ */ React12.createElement(import_ui11.Box, { display: "flex", alignItems: "center", gap: 1, mt: 1 }, /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React12.createElement(import_ui11.Box, { display: "flex", alignItems: "center", gap: 1, mt: 1 }, hasPrimaryCta && /* @__PURE__ */ React12.createElement(
     ViolationCtaButton,
     {
       ctaLabel: violation.ctaLabel,
       externalUrl: violation.externalUrl,
       withIcon: true
     }
-  ), violation.secondaryCtaLabel && violation.secondaryCtaUrl && /* @__PURE__ */ React12.createElement(
+  ), hasPrimaryCta && violation.secondaryCtaLabel && violation.secondaryCtaUrl && /* @__PURE__ */ React12.createElement(
     ViolationCtaButton,
     {
       ctaLabel: violation.secondaryCtaLabel,
       externalUrl: violation.secondaryCtaUrl,
       variant: "text"
     }
-  ));
+  ), sharedAngiePrompt && /* @__PURE__ */ React12.createElement(FixViolationWithAngie, { prompt: sharedAngiePrompt, panelZIndex, variant: "button" }));
+}
+function getSharedAngiePrompt(violations) {
+  if (!violations || violations.length < 2) {
+    return void 0;
+  }
+  const [first, ...rest] = violations;
+  if (!first.angieFix || !first.angiePrompt) {
+    return void 0;
+  }
+  const allShareTheSameFix = rest.every(
+    (violation) => violation.angieFix && violation.angiePrompt === first.angiePrompt
+  );
+  return allShareTheSameFix ? first.angiePrompt : void 0;
 }
 function ViolationRow({ audit: audit26, expanded, onToggleExpand, skipReason, violations }) {
   const primaryViolation = violations?.[0];
   const isGuidanceFocusable = !!primaryViolation;
   const panelZIndex = (0, import_editor_floating_panels2.useFloatingPanelZIndex)(AUDIT_PANEL_ID);
+  const sharedAngiePrompt = getSharedAngiePrompt(violations);
   const handleGuidanceClick = () => {
     if (isGuidanceFocusable && primaryViolation) {
       focusViolation(primaryViolation);
@@ -1188,11 +1223,20 @@ function ViolationRow({ audit: audit26, expanded, onToggleExpand, skipReason, vi
       onKeyDown: isGuidanceFocusable ? onKeyboardClick(handleGuidanceClick) : void 0
     },
     /* @__PURE__ */ React12.createElement(import_ui11.Typography, { variant: "caption", component: "p", color: "text.secondary" }, audit26.description),
-    primaryViolation && /* @__PURE__ */ React12.createElement(GuidanceAction, { violation: primaryViolation })
+    primaryViolation && /* @__PURE__ */ React12.createElement(
+      GuidanceAction,
+      {
+        violation: primaryViolation,
+        sharedAngiePrompt,
+        panelZIndex
+      }
+    )
   ))), violations && violations.length > 0 && /* @__PURE__ */ React12.createElement(import_ui11.Box, { role: "list", sx: { paddingBlockEnd: 1 } }, violations.map((violation, idx) => {
     const widgetIcon = violation.elementId ? (0, import_editor_elements5.getElementIcon)(violation.elementId) : null;
     const elementTitle = violation.elementId ? (0, import_editor_elements5.getElementTitle)(violation.elementId) : null;
-    const rowLabel = elementTitle ? `${elementTitle} - ${violation.label}` : violation.label;
+    const displayLabel = elementTitle ?? violation.label;
+    const angiePromptContext = elementTitle ? `${elementTitle} - ${violation.label}` : violation.label;
+    const showsOwnFixAction = !!violation.angieFix && !sharedAngiePrompt;
     return /* @__PURE__ */ React12.createElement(
       import_ui11.Box,
       {
@@ -1209,18 +1253,28 @@ function ViolationRow({ audit: audit26, expanded, onToggleExpand, skipReason, vi
           paddingInline: 1,
           borderRadius: 1,
           cursor: "pointer",
-          "&:hover": { bgcolor: "action.hover" }
+          "&:hover": { bgcolor: "action.hover" },
+          "&:hover .violation-row-fix-action, &:focus-visible .violation-row-fix-action": {
+            opacity: 1
+          }
         }
       },
       /* @__PURE__ */ React12.createElement(ViolationIcon, { violation, widgetIcon }),
-      /* @__PURE__ */ React12.createElement(import_ui11.Box, { sx: { flex: 1 } }, /* @__PURE__ */ React12.createElement(import_ui11.Typography, { variant: "caption" }, rowLabel), violation.detail && /* @__PURE__ */ React12.createElement(import_ui11.Typography, { variant: "caption", color: "text.secondary" }, violation.detail)),
-      violation.angieFix ? /* @__PURE__ */ React12.createElement(
-        FixViolationWithAngie,
+      /* @__PURE__ */ React12.createElement(import_ui11.Box, { sx: { flex: 1 } }, /* @__PURE__ */ React12.createElement(import_ui11.Typography, { variant: "caption" }, displayLabel), violation.detail && /* @__PURE__ */ React12.createElement(import_ui11.Typography, { variant: "caption", color: "text.secondary" }, violation.detail)),
+      showsOwnFixAction && /* @__PURE__ */ React12.createElement(
+        import_ui11.Box,
         {
-          prompt: violation.angiePrompt ?? buildAngiePrompt(rowLabel),
-          panelZIndex
-        }
-      ) : /* @__PURE__ */ React12.createElement(import_icons10.WandIcon, { fontSize: "tiny", "aria-hidden": true })
+          className: "violation-row-fix-action",
+          sx: { opacity: 0, transition: "opacity .15s" }
+        },
+        /* @__PURE__ */ React12.createElement(
+          FixViolationWithAngie,
+          {
+            prompt: violation.angiePrompt ?? buildAngiePrompt(angiePromptContext),
+            panelZIndex
+          }
+        )
+      )
     );
   }))));
 }
@@ -2268,6 +2322,7 @@ var audit11 = {
     if (!hasPageImages(ctx.elements.tree)) {
       return { status: "skipped", reason: (0, import_i18n29.__)("No images", "elementor") };
     }
+    const isReady = ctx.pageContext.ally_plugin_active;
     const violations = [];
     const failedWidgetIds = /* @__PURE__ */ new Set();
     let missingAltImageCount = 0;
@@ -2283,7 +2338,7 @@ var audit11 = {
           elementId: node.id,
           targetHint: "element-settings",
           label: (0, import_i18n29.__)("Image is missing alt text.", "elementor"),
-          externalUrl: ctx.pageContext.ally_plugin_url,
+          externalUrl: isReady ? ctx.pageContext.ally_scan_url : ctx.pageContext.ally_plugin_url,
           ctaLabel: (0, import_i18n29.__)("Fix with Ally", "elementor")
         });
       }
@@ -2304,6 +2359,7 @@ var audit12 = {
   severity: "info",
   weight: 1,
   evaluate: (ctx) => {
+    const isReady = ctx.pageContext.image_optimization_plugin_active;
     const offendingElementIds = /* @__PURE__ */ new Set();
     let hasAnyImage = false;
     let inefficientImageFormatCount = 0;
@@ -2334,7 +2390,7 @@ var audit12 = {
       elementId,
       targetHint: "element-settings",
       label: (0, import_i18n30.__)("Image isn't served in a modern format like WebP or AVIF.", "elementor"),
-      externalUrl: ctx.pageContext.image_optimization_plugin_url,
+      externalUrl: isReady ? ctx.pageContext.image_optimization_settings_url : ctx.pageContext.image_optimization_plugin_url,
       ctaLabel: (0, import_i18n30.__)("Optimize all", "elementor")
     }));
     return violations.length === 0 ? { status: "pass" } : { status: "fail", violations, metadata: { inefficientImageFormatCount } };
@@ -2354,6 +2410,7 @@ var audit13 = {
   severity: "warning",
   weight: 7,
   evaluate: (ctx) => {
+    const isReady = ctx.pageContext.image_optimization_plugin_active;
     const widgetMaxKb = /* @__PURE__ */ new Map();
     let oversizedImageCount = 0;
     let hasAnyImage = false;
@@ -2390,7 +2447,7 @@ var audit13 = {
         (0, import_i18n31.__)("Image is %d KB (over 500 KB).", "elementor"),
         kb
       ),
-      externalUrl: ctx.pageContext.image_optimization_plugin_url,
+      externalUrl: isReady ? ctx.pageContext.image_optimization_settings_url : ctx.pageContext.image_optimization_plugin_url,
       ctaLabel: (0, import_i18n31.__)("Optimize all", "elementor")
     }));
     return violations.length === 0 ? { status: "pass" } : { status: "fail", violations, metadata: { oversizedImageCount } };
@@ -2425,7 +2482,12 @@ var audit14 = {
           auditId: audit14.id,
           elementId: node.id,
           targetHint: "element-settings",
-          label: (0, import_i18n32.__)("Nested boxed container.", "elementor")
+          label: (0, import_i18n32.__)("Nested boxed container.", "elementor"),
+          angieFix: true,
+          angiePrompt: (0, import_i18n32.__)(
+            "Find containers that have nested containers. Containers can be deep-nested. Update the nested container styling so that when a parent container already uses a boxed setting, any inner container inside it is set to Full Width. Keep the first parent container boxed, remove all boxed styling from the nested inner containers, and preserve the inner container\u2019s content, spacing, alignment, and hierarchy.",
+            "elementor"
+          )
         });
       }
     });