@blokkli/editor 2.0.0-alpha.43 → 2.0.0-alpha.44

package/dist/runtime/editor/features/analyze/Main.d.vue.ts

@@ -6,12 +6,18 @@ type __VLS_Props = {
 };
 type __VLS_ModelProps = {
     modelValue?: boolean;
+    'issueCount'?: number;
+    'hasViolation'?: boolean;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => any;
+    "update:issueCount": (value: number) => any;
+    "update:hasViolation": (value: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+    "onUpdate:issueCount"?: ((value: number) => any) | undefined;
+    "onUpdate:hasViolation"?: ((value: boolean) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/editor/features/analyze/Main.vue

@@ -24,6 +24,12 @@
       <FormToggle
         v-model="keepVisible"
         :label="$t('analyzeKeepVisible', 'Keep results visible')"
+        :description="
+  $t(
+    'analyzeKeepVisibleDescription',
+    'When enabled, analysis results remain highlighted on the page even when the analyze panel is closed.'
+  )
+"
       />
 
       <div v-if="analyzerStatuses.length > 1" class="bk-analyze-statuses">
@@ -67,6 +73,7 @@
     :is-stale
     :manual-analyzer-ids
     :is-running
+    :is-shown
   />
 </template>
 
@@ -101,6 +108,8 @@ const refreshKey = computed(() => {
   return `dom:${dom.settleKey.value}_directive:${directive.settleKey.value}_state:${state.refreshKey.value}`;
 });
 const isRunning = defineModel({ type: Boolean, ...{ default: false } });
+const issueCount = defineModel("issueCount", { type: Number, ...{ default: 0 } });
+const hasViolation = defineModel("hasViolation", { type: Boolean, ...{ default: false } });
 let currentAbortController = null;
 const hasRunOnce = useState(() => false);
 const continuousResults = useState(
@@ -172,6 +181,22 @@ const results = computed(() => {
   }
   return allResults.value.filter((v) => v.category === selectedCategory.value);
 });
+watch(
+  allResults,
+  (v) => {
+    let count = 0;
+    for (const r of v) {
+      if (r.status === "violation" || r.status === "incomplete") {
+        for (const node of r.nodes) {
+          count += node.targets.length;
+        }
+      }
+    }
+    issueCount.value = count;
+    hasViolation.value = v.some((r) => r.status === "violation");
+  },
+  { immediate: true }
+);
 const isStale = computed(() => lastRunKey.value !== state.refreshKey.value);
 const buttonDisabled = computed(() => {
   if (isRunning.value) {
@@ -203,7 +228,7 @@ const analyzerStatuses = computed(() => {
   }
   return props.analyze.analyzers.value.map((analyzer) => {
     const status = analyzer.continuous ? $t("analyzeStatusUpToDate", "Up-to-date") : isStale.value ? $t("analyzeStatusStale", "Stale") : $t("analyzeStatusUpToDate", "Up-to-date");
-    const title = typeof analyzer.label === "function" ? analyzer.label(ui.interfaceLanguage.value) : analyzer.label;
+    const title = typeof analyzer.label === "function" ? analyzer.label(ui.interfaceLanguage.value, $t) : analyzer.label;
     return {
       id: analyzer.id,
       title: title ?? analyzer.id,

package/dist/runtime/editor/features/analyze/Main.vue.d.ts

@@ -6,12 +6,18 @@ type __VLS_Props = {
 };
 type __VLS_ModelProps = {
     modelValue?: boolean;
+    'issueCount'?: number;
+    'hasViolation'?: boolean;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => any;
+    "update:issueCount": (value: number) => any;
+    "update:hasViolation": (value: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+    "onUpdate:issueCount"?: ((value: number) => any) | undefined;
+    "onUpdate:hasViolation"?: ((value: boolean) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/editor/features/analyze/Renderer/index.d.vue.ts

@@ -6,6 +6,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     isStale: boolean;
     isRunning: boolean;
     manualAnalyzerIds: Set<string>;
+    isShown: boolean;
 } & {
     modelValue?: string;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -15,6 +16,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     isStale: boolean;
     isRunning: boolean;
     manualAnalyzerIds: Set<string>;
+    isShown: boolean;
 } & {
     modelValue?: string;
 }> & Readonly<{

package/dist/runtime/editor/features/analyze/Renderer/index.vue

@@ -1,9 +1,26 @@
 <template>
-  <div />
+  <Teleport to="#bk-canvas-overlay">
+    <button
+      v-if="tooltipData"
+      v-show="showTooltip"
+      class="bk bk-analyze-tooltip bk-control"
+      :class="'bk-is-' + tooltipData.status"
+      :style="{
+  transform: `translate(${tooltipData.x}px, ${tooltipData.y}px)`
+}"
+      @click.prevent="onTooltipClick"
+    >
+      <Icon name="bk_mdi_speed" />
+      <span>{{ tooltipData.title }}</span>
+      <span v-if="tooltipData.scoreText" class="bk-analyze-tooltip-score">{{
+        tooltipData.scoreText
+      }}</span>
+    </button>
+  </Teleport>
 </template>
 
 <script setup>
-import { useBlokkli, computed, watch } from "#imports";
+import { useBlokkli, computed, watch, ref } from "#imports";
 import {
   setBuffersAndAttributes,
   drawBufferInfo,
@@ -14,13 +31,28 @@ import fs from "./fragment.glsl?raw";
 import { RectangleBufferCollector } from "#blokkli/editor/helpers/webgl";
 import { toShaderColor } from "#blokkli/editor/helpers/color";
 import { defineRenderer, onBlokkliEvent } from "#blokkli/editor/composables";
+import { Icon } from "#blokkli/editor/components";
 const props = defineProps({
   results: { type: Array, required: true },
   isStale: { type: Boolean, required: true },
   isRunning: { type: Boolean, required: true },
-  manualAnalyzerIds: { type: Set, required: true }
+  manualAnalyzerIds: { type: Set, required: true },
+  isShown: { type: Boolean, required: true }
+});
+const {
+  animation,
+  ui,
+  theme,
+  selection,
+  element,
+  dom,
+  blocks,
+  eventBus,
+  readability
+} = useBlokkli();
+const showTooltip = computed(() => {
+  return !ui.isChangingOptions.value && !selection.isMultiSelecting.value && !selection.activeEditableLabel.value;
 });
-const { animation, ui, theme, selection, element, dom, blocks } = useBlokkli();
 const activeId = defineModel({ type: String, ...{
   default: ""
 } });
@@ -72,7 +104,8 @@ const nodes = computed(() => {
             index: target.globalIndex,
             title: result.title,
             status: result.status,
-            plugin: result.plugin
+            plugin: result.plugin,
+            score: node.score
           });
         }
       }
@@ -101,6 +134,47 @@ const activeRectId = computed(() => {
   }
   return -1;
 });
+const hoveredNode = ref(null);
+const tooltipData = computed(() => {
+  const node = hoveredNode.value;
+  if (!node) {
+    return null;
+  }
+  const rect = collector.rectCache.get(node.element);
+  if (!rect) {
+    return null;
+  }
+  const scale = ui.artboardScale.value;
+  const offset = ui.artboardOffset.value;
+  const x = rect.x * scale + offset.x;
+  const y = rect.y * scale + offset.y;
+  let scoreText = "";
+  if (node.score != null) {
+    const label = readability.analyzer.value.scoreLabel;
+    scoreText = `${label} ${readability.formatScore(node.score)}`;
+  }
+  return {
+    x,
+    y,
+    title: node.title,
+    status: node.status,
+    scoreText
+  };
+});
+function onTooltipClick() {
+  const node = hoveredNode.value;
+  if (!node) {
+    return;
+  }
+  const id = node.id + "_____" + node.index;
+  if (activeId.value === id) {
+    activeId.value = "";
+  } else {
+    activeId.value = id;
+    eventBus.emit("sidebar:open", "analyze");
+  }
+  hoveredNode.value = null;
+}
 class AnalyzeRectangleBufferCollector extends RectangleBufferCollector {
   prevKey = "";
   rectCache = /* @__PURE__ */ new Map();
@@ -165,7 +239,7 @@ const { collector } = defineRenderer("analyze-overlay", {
   zIndex: 500,
   collector: () => new AnalyzeRectangleBufferCollector(),
   program: () => ({ shaders: [vs, fs] }),
-  enabled: () => !selection.isMultiSelecting.value && !selection.isDragging.value && !ui.isChangingOptions.value,
+  enabled: () => !selection.isMultiSelecting.value && !selection.isDragging.value && !ui.isChangingOptions.value && !selection.activeEditableLabel.value,
   render: (_ctx, gl, program) => {
     gl.useProgram(program.program);
     const { info } = collector.getBufferInfo(gl);
@@ -227,9 +301,9 @@ watch(
     collector.reset();
   }
 );
-onBlokkliEvent("mouse:up", (e) => {
-  const artboardX = (e.x - ui.artboardOffset.value.x) / ui.artboardScale.value;
-  const artboardY = (e.y - ui.artboardOffset.value.y) / ui.artboardScale.value;
+onBlokkliEvent("canvas:draw", (e) => {
+  const artboardX = (e.mouseX - e.artboardOffset.x) / e.artboardScale;
+  const artboardY = (e.mouseY - e.artboardOffset.y) / e.artboardScale;
   for (let i = 0; i < nodes.value.length; i++) {
     const node = nodes.value[i];
     const rect = collector.rectCache.get(node.element);
@@ -237,17 +311,14 @@ onBlokkliEvent("mouse:up", (e) => {
       continue;
     }
     if (artboardX >= rect.x && artboardX <= rect.x + rect.width && artboardY >= rect.y && artboardY <= rect.y + rect.height) {
-      const id = node.id + "_____" + node.index;
-      if (activeId.value === id) {
-        activeId.value = "";
-      } else {
-        activeId.value = id;
-      }
+      hoveredNode.value = node;
       return;
     }
   }
+  hoveredNode.value = null;
 });
 onBlokkliEvent("window:clickAway", () => {
+  hoveredNode.value = null;
   activeId.value = "";
 });
 </script>

package/dist/runtime/editor/features/analyze/Renderer/index.vue.d.ts

@@ -6,6 +6,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     isStale: boolean;
     isRunning: boolean;
     manualAnalyzerIds: Set<string>;
+    isShown: boolean;
 } & {
     modelValue?: string;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -15,6 +16,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     isStale: boolean;
     isRunning: boolean;
     manualAnalyzerIds: Set<string>;
+    isShown: boolean;
 } & {
     modelValue?: string;
 }> & Readonly<{

package/dist/runtime/editor/features/analyze/analyzers/altText.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/runtime/editor/features/analyze/analyzers/altText.js

@@ -0,0 +1,60 @@
+import { defineAnalyzer } from "#blokkli/analyzer";
+export default defineAnalyzer(() => {
+  return {
+    id: "blokkli:image-alt-text",
+    label: (_langcode, $t) => $t("analyzeAltTextLabel", "Image Alt Texts"),
+    continuous: true,
+    run: async (context) => {
+      const $t = context.$t;
+      const images = [
+        ...context.providerRootElement.querySelectorAll("img")
+      ].map((img) => {
+        const alt = img.getAttribute("alt");
+        return {
+          element: img,
+          hasAlt: alt !== null && alt.trim() !== "",
+          alt: alt || "",
+          src: img.src.substring(0, 50)
+        };
+      });
+      const withAlt = images.filter((v) => v.hasAlt);
+      const withoutAlt = images.filter((v) => !v.hasAlt);
+      const results = [];
+      results.push({
+        id: "blokkli:image-alt-text:valid",
+        title: $t("analyzeAltTextValid", "Images with alt text"),
+        category: "accessibility",
+        description: $t(
+          "analyzeAltTextValidDescription",
+          "Images have an alt text."
+        ),
+        status: "pass",
+        nodes: withAlt.map((img) => ({
+          targets: img.element
+        }))
+      });
+      if (withoutAlt.length > 0) {
+        results.push({
+          id: "blokkli:image-alt-text:missing",
+          title: $t("analyzeAltTextMissing", "Images without alt text"),
+          category: "accessibility",
+          description: $t(
+            "analyzeAltTextMissingDescription",
+            "Images are missing alt text. Alt texts are important for accessibility and SEO."
+          ),
+          status: "violation",
+          impact: "serious",
+          nodes: withoutAlt.map((img) => ({
+            description: $t(
+              "analyzeAltTextMissingNode",
+              "Image without alt text"
+            ),
+            impact: "serious",
+            targets: img.element
+          }))
+        });
+      }
+      return results;
+    }
+  };
+});

package/dist/runtime/editor/features/analyze/analyzers/headingStructure.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (options?: object | undefined) => import("./types.js").Analyzer;
+export default _default;

package/dist/runtime/editor/features/analyze/analyzers/headingStructure.js

@@ -0,0 +1,141 @@
+import { falsy } from "#blokkli/helpers";
+import { defineAnalyzer } from "./defineAnalyzer.js";
+export default defineAnalyzer(() => {
+  return {
+    id: "blokkli:heading-structure",
+    label: (_langcode, $t) => $t("analyzeHeadingStructureLabel", "Heading Structure"),
+    continuous: true,
+    run: async (context) => {
+      const $t = context.$t;
+      const results = [];
+      const allHeadings = [
+        ...context.providerRootElement.querySelectorAll(
+          "h1, h2, h3, h4, h5, h6"
+        )
+      ].map((heading) => {
+        if (heading instanceof HTMLElement) {
+          const level = parseInt(heading.tagName.substring(1));
+          return {
+            element: heading,
+            level,
+            text: heading.textContent?.trim() || ""
+          };
+        }
+      }).filter(falsy);
+      const h1Elements = allHeadings.filter((h) => h.level === 1);
+      if (h1Elements.length > 1) {
+        results.push({
+          id: "blokkli:heading-structure:multiple-h1",
+          title: $t("analyzeHeadingMultipleH1", "Multiple H1 headings"),
+          category: "seo",
+          description: $t(
+            "analyzeHeadingMultipleH1Description",
+            "The page contains multiple H1 headings. There should only be one H1 heading per page."
+          ),
+          status: "violation",
+          impact: "serious",
+          nodes: h1Elements.map((h) => ({
+            description: h.text,
+            targets: h.element
+          }))
+        });
+      } else if (h1Elements.length === 1) {
+        results.push({
+          id: "blokkli:heading-structure:single-h1",
+          title: $t("analyzeHeadingSingleH1", "Single H1 heading"),
+          category: "seo",
+          description: $t(
+            "analyzeHeadingSingleH1Description",
+            "The page has exactly one H1 heading."
+          ),
+          status: "pass",
+          nodes: h1Elements.map((h) => ({
+            description: h.text,
+            targets: h.element
+          }))
+        });
+      }
+      const orderIssues = [];
+      for (let i = 1; i < allHeadings.length; i++) {
+        const previous = allHeadings[i - 1];
+        const current = allHeadings[i];
+        if (!previous || !current) {
+          continue;
+        }
+        if (current.level > previous.level + 1) {
+          orderIssues.push({ current, previous });
+        }
+      }
+      if (orderIssues.length > 0) {
+        results.push({
+          id: "blokkli:heading-structure:skipped-levels",
+          title: $t("analyzeHeadingSkippedLevels", "Skipped heading levels"),
+          category: "seo",
+          description: $t(
+            "analyzeHeadingSkippedLevelsDescription",
+            "Headings skip a level. The heading hierarchy should not skip levels (e.g. do not jump from H2 to H4)."
+          ),
+          status: "violation",
+          impact: "moderate",
+          nodes: orderIssues.map(({ current, previous }) => ({
+            description: `${previous.element.tagName} \u2192 ${current.element.tagName}: "${current.text}"`,
+            impact: "moderate",
+            targets: current.element
+          }))
+        });
+      } else if (allHeadings.length > 1) {
+        results.push({
+          id: "blokkli:heading-structure:no-skipped-levels",
+          title: $t(
+            "analyzeHeadingNoSkippedLevels",
+            "No skipped heading levels"
+          ),
+          category: "seo",
+          description: $t(
+            "analyzeHeadingNoSkippedLevelsDescription",
+            "The heading hierarchy does not skip any levels."
+          ),
+          status: "pass",
+          nodes: allHeadings.map((h) => ({
+            description: `${h.element.tagName}: ${h.text}`,
+            targets: h.element
+          }))
+        });
+      }
+      const h2Elements = allHeadings.filter((h) => h.level === 2);
+      if (h2Elements.length === 0) {
+        results.push({
+          id: "blokkli:heading-structure:no-h2",
+          title: $t("analyzeHeadingNoH2", "Missing H2 headings"),
+          category: "seo",
+          description: $t(
+            "analyzeHeadingNoH2Description",
+            "The page contains no H2 headings. A clear heading structure is important for SEO and accessibility."
+          ),
+          status: "violation",
+          impact: "moderate",
+          nodes: {
+            description: $t("analyzeHeadingNoH2Found", "No H2 headings found"),
+            targets: context.providerRootElement
+          }
+        });
+      } else {
+        results.push({
+          id: "blokkli:heading-structure:has-h2",
+          title: $t("analyzeHeadingHasH2", "H2 headings present"),
+          category: "seo",
+          description: $t(
+            "analyzeHeadingHasH2Description",
+            "The page contains H2 headings for a clear content structure."
+          ),
+          status: "pass",
+          nodes: h2Elements.map((h) => ({
+            description: h.text,
+            targets: h.element
+          }))
+        });
+      }
+      return results;
+    }
+  };
+});

package/dist/runtime/editor/features/analyze/analyzers/index.d.ts

@@ -1,2 +1,6 @@
 import { defineAnalyzer } from './defineAnalyzer.js';
-export { defineAnalyzer };
+import readabilityAnalyzer from './readability.js';
+import headingStructureAnalyzer from './headingStructure.js';
+import altTextAnalyzer from './altText.js';
+import axeAnalyzer from './axe.js';
+export { defineAnalyzer, readabilityAnalyzer, headingStructureAnalyzer, altTextAnalyzer, axeAnalyzer, };

package/dist/runtime/editor/features/analyze/analyzers/index.js

@@ -1,2 +1,12 @@
 import { defineAnalyzer } from "./defineAnalyzer.js";
-export { defineAnalyzer };
+import readabilityAnalyzer from "./readability.js";
+import headingStructureAnalyzer from "./headingStructure.js";
+import altTextAnalyzer from "./altText.js";
+import axeAnalyzer from "./axe.js";
+export {
+  defineAnalyzer,
+  readabilityAnalyzer,
+  headingStructureAnalyzer,
+  altTextAnalyzer,
+  axeAnalyzer
+};

package/dist/runtime/editor/features/analyze/analyzers/readability.js

@@ -13,14 +13,23 @@ function summarizeImpact(nodes) {
 function format(n, d = 1) {
   return typeof n === "number" && Number.isFinite(n) ? n.toFixed(d) : "\u2014";
 }
-function buildDescription(score, scoreLabel, lang, $t) {
+function buildDescription(score, scoreLabel, lang, band, $t) {
   const parts = [];
-  parts.push(
-    $t("analyzerReadabiliyHardToRead", `Hard to read (@lang).`).replace(
-      "@lang",
-      lang.toUpperCase()
-    )
-  );
+  if (band === "hard") {
+    parts.push(
+      $t("analyzerReadabiliyHardToRead", `Hard to read (@lang).`).replace(
+        "@lang",
+        lang.toUpperCase()
+      )
+    );
+  } else {
+    parts.push(
+      $t(
+        "analyzerReadabiliyCouldBeSimpler",
+        `Could be simpler (@lang).`
+      ).replace("@lang", lang.toUpperCase())
+    );
+  }
   parts.push(`${scoreLabel} ${format(score)}`);
   parts.push(
     $t(
@@ -33,7 +42,8 @@ function buildDescription(score, scoreLabel, lang, $t) {
 async function analyzeViaProvider(readabilityProvider, langcode, $t) {
   const result = await readabilityProvider.analyzeAllFields();
   const analyzer = readabilityProvider.analyzer.value;
-  const nodes = [];
+  const hardNodes = [];
+  const okNodes = [];
   for (const [key, fieldResult] of Object.entries(result)) {
     const separatorIndex = key.indexOf("/");
     const uuid = key.slice(0, separatorIndex);
@@ -42,26 +52,34 @@ async function analyzeViaProvider(readabilityProvider, langcode, $t) {
     const fieldTextElements = fieldElement ? collectTextElements(fieldElement) : [];
     for (let i = 0; i < fieldResult.chunks.length; i++) {
       const chunk = fieldResult.chunks[i];
-      if (chunk.band !== "hard") continue;
+      if (chunk.band === "easy" || chunk.band === null || chunk.score === null)
+        continue;
       const targets = [];
       const textElement = fieldTextElements[i];
       if (textElement) {
         targets.push(textElement.element);
       }
-      nodes.push({
+      const node = {
         description: buildDescription(
           chunk.score,
           analyzer.scoreLabel,
           langcode,
+          chunk.band,
           $t
         ),
         impact: analyzer.impactForScore(chunk.score),
         score: chunk.score,
         targets
-      });
+      };
+      if (chunk.band === "hard") {
+        hardNodes.push(node);
+      } else {
+        okNodes.push(node);
+      }
     }
   }
-  return {
+  const results = [];
+  results.push({
     id: "low-readability",
     title: $t("analyzerReadabiliyTitle", "Text readability issues"),
     category: "text",
@@ -70,10 +88,26 @@ async function analyzeViaProvider(readabilityProvider, langcode, $t) {
       "Avoid texts that are hard to read."
     ),
     link: "https://en.wikipedia.org/wiki/Readability",
-    status: nodes.length ? "violation" : "pass",
-    nodes,
-    impact: summarizeImpact(nodes)
-  };
+    status: hardNodes.length ? "violation" : "pass",
+    nodes: hardNodes,
+    impact: summarizeImpact(hardNodes)
+  });
+  if (okNodes.length) {
+    results.push({
+      id: "ok-readability",
+      title: $t("analyzerReadabiliyOkTitle", "Text could be simpler"),
+      category: "text",
+      description: $t(
+        "analyzerReadabiliyOkDescription",
+        "Text that could be easier to read."
+      ),
+      link: "https://en.wikipedia.org/wiki/Readability",
+      status: "incomplete",
+      nodes: okNodes,
+      impact: summarizeImpact(okNodes)
+    });
+  }
+  return results;
 }
 export default defineAnalyzer(() => {
   return {

package/dist/runtime/editor/features/analyze/analyzers/types.d.ts

@@ -1,4 +1,5 @@
 import type { AnalyzerContext } from './helpers/Context.js';
+import type { TextProvider } from '#blokkli/editor/providers/texts';
 export type AnalyzeStatus = 'pass' | 'incomplete' | 'inapplicable' | 'violation';
 export type AnalyzeImpact = 'minor' | 'moderate' | 'serious' | 'critical';
 export type AnalyzeCategory = 'accessibility' | 'seo' | 'text' | 'content';
@@ -55,8 +56,8 @@ export type Analyzer = {
      * - 'generic': Any other type of analysis (accessibility, SEO, custom checks)
      */
     type?: AnalyzerType;
-    label?: string | ((langcode: string) => string);
-    description?: string | ((langcode: string) => string);
+    label?: string | ((langcode: string, $t: TextProvider) => string);
+    description?: string | ((langcode: string, $t: TextProvider) => string);
     /**
      * If true, the raw page (without editor UI) is required for this analyzer.
      */