@blokkli/editor 2.0.0-alpha.54 → 2.0.0-alpha.55

package/dist/modules/agent/runtime/app/features/agent/index.vue

@@ -16,67 +16,19 @@
     <template #icon>
       <Icon name="stars" class="bk-is-animated" />
     </template>
-    <template #default="{ isShown }">
-      <AgentPanel
+    <template #default="{ isShown, shouldRender }">
+      <AgentContainer
+        v-if="shouldRender"
         :is-shown
         :agent-name
-        :conversation
-        :active-item
-        :is-thinking
-        :is-processing
-        :is-connected
-        :has-been-ready
-        :pending-tool-call
-        :pending-mutation
-        :auto-approve
-        :conversation-list
-        :show-conversation-list
-        :plan
-        :tool-details
-        :usage-turns="usageTurns"
-        :page-context="pageContext"
-        :supports-feedback="!!adapter.submitConversationFeedback"
-        :feedback-item-ids="feedbackItemIds"
-        @connect="connect"
-        @send-prompt="sendPrompt"
-        @retry="retry"
-        @cancel="cancel"
-        @approve="approve"
-        @reject="reject"
-        @set-auto-approve="setAutoApprove"
-        @new-conversation="newConversation"
-        @get-transcript="getTranscript"
-        @tool-component-done="onToolComponentDone"
-        @switch-conversation="switchConversation"
-        @delete-conversation="deleteConversation"
-        @submit-feedback="onSubmitFeedback"
-        @feedback-done="onFeedbackDone"
-        @show-conversations="onShowConversations"
-        @hide-conversations="onHideConversations"
-        @approve-plan="approvePlan"
-        @reject-plan="rejectPlan"
+        :adapter
+        :pending-prompt-request="pendingPromptRequest"
+        @consumed="pendingPromptRequest = null"
       />
     </template>
   </PluginSidebar>
 
   <Teleport :to="ui.mainLayoutElement.value">
-    <BlokkliTransition name="slide-up">
-      <DialogModal
-        v-if="showTranscript"
-        id="agent-transcript"
-        title="Agent Transcript"
-        :width="900"
-        hide-buttons
-        full-screen
-        @cancel="showTranscript = false"
-      >
-        <AgentTranscript
-          v-if="transcriptContent"
-          :transcript="transcriptContent"
-        />
-      </DialogModal>
-    </BlokkliTransition>
-
     <Popup
       id="agent"
       ref="popup"
@@ -96,22 +48,16 @@
 import {
   useBlokkli,
   defineBlokkliFeature,
-  onBeforeUnmount,
   computed,
-  useTemplateRef
+  shallowRef,
+  useTemplateRef,
+  defineAsyncComponent
 } from "#imports";
 import { PluginSidebar } from "#blokkli/editor/plugins";
-import {
-  DialogModal,
-  BlokkliTransition,
-  Icon,
-  Popup
-} from "#blokkli/editor/components";
-import agentProvider from "#blokkli/agent/app/composables/agentProvider";
-import { agentPrompts, agentName } from "#blokkli-build/agent-client";
-import AgentPanel from "./Panel/index.vue";
-import AgentTranscript from "./Transcript/index.vue";
+import { Icon, Popup } from "#blokkli/editor/components";
+import { agentPrompts, agentName } from "#blokkli-build/agent-prompts";
 import { defineItemDropdownAction } from "#blokkli/editor/composables";
+const AgentContainer = defineAsyncComponent(() => import("./Container.vue"));
 const { adapter } = defineBlokkliFeature({
   id: "agent",
   icon: "stars",
@@ -128,6 +74,7 @@ const { adapter } = defineBlokkliFeature({
 const app = useBlokkli();
 const { $t, ui } = app;
 const popup = useTemplateRef("popup");
+const pendingPromptRequest = shallowRef(null);
 function closeAgentPopup() {
   if (popup.value) {
     popup.value.closePopup();
@@ -148,84 +95,11 @@ const tooltipTitle = computed(() => {
     agentName
   );
 });
-const {
-  isConnected,
-  hasBeenReady,
-  connect,
-  disconnect,
-  conversation,
-  activeItem,
-  isProcessing,
-  isThinking,
-  autoApprove,
-  pendingMutation,
-  pendingToolCall,
-  plan,
-  approvePlan,
-  rejectPlan,
-  usageTurns,
-  sendPrompt,
-  runToolForPrompt,
-  retry,
-  approve,
-  reject,
-  setAutoApprove,
-  cancel,
-  newConversation,
-  getTranscript,
-  onToolComponentDone,
-  transcriptContent,
-  showTranscript,
-  toolDetails,
-  conversationList,
-  showConversationList,
-  switchConversation,
-  deleteConversation,
-  refreshConversationList,
-  activeConversationId,
-  feedbackItemIds,
-  pageContext
-} = agentProvider(app, adapter, agentName);
-async function onSubmitFeedback(rating, comment) {
-  if (!adapter.submitConversationFeedback) return;
-  const conversationId = activeConversationId.value;
-  if (!conversationId) return;
-  const lastItem = conversation.value[conversation.value.length - 1];
-  if (!lastItem) return;
-  try {
-    await adapter.submitConversationFeedback({
-      conversationId,
-      rating,
-      lastItemId: lastItem.id,
-      comment
-    });
-  } catch (e) {
-    console.warn("[blokkli agent] Failed to submit feedback:", e);
-  }
-}
-function onFeedbackDone() {
-  const lastItem = conversation.value[conversation.value.length - 1];
-  if (lastItem) {
-    feedbackItemIds.value.add(lastItem.id);
-  }
-}
-async function onShowConversations() {
-  await refreshConversationList();
-  showConversationList.value = true;
-}
-function onHideConversations() {
-  showConversationList.value = false;
-}
-onBeforeUnmount(() => {
-  disconnect();
-});
 defineItemDropdownAction(() => {
   return agentPrompts.flatMap((promptFactory) => {
     const promptsResult = "__factory" in promptFactory ? promptFactory.resolve(app) : promptFactory;
     const prompts = Array.isArray(promptsResult) ? promptsResult : [promptsResult];
     return prompts.map((prompt) => {
-      const promptText = prompt.getPrompt(app);
-      const userPromptText = prompt.getUserPrompt?.(app);
       return {
         id: "agent:prompt:" + prompt.id,
         label: prompt.getLabel(app),
@@ -233,32 +107,12 @@ defineItemDropdownAction(() => {
         group: "agent",
         variant: "agent",
         weight: -900,
-        callback: async () => {
+        callback: () => {
           app.eventBus.emit("sidebar:open", "agent");
-          const selectedUuids = [...app.selection.uuids.value];
-          let preSeededResults = void 0;
-          let autoExecuteTools = void 0;
-          if (prompt.preExecute) {
-            const preResult = await prompt.preExecute({
-              app,
-              selectedUuids,
-              runTool: runToolForPrompt
-            });
-            if (preResult) {
-              preSeededResults = preResult.preSeededResults;
-              autoExecuteTools = preResult.autoExecuteTools;
-            }
-          }
-          sendPrompt(
-            promptText,
-            userPromptText,
-            selectedUuids,
-            void 0,
-            prompt.tools,
-            prompt.skills,
-            preSeededResults,
-            autoExecuteTools
-          );
+          pendingPromptRequest.value = {
+            prompt,
+            selectedUuids: [...app.selection.uuids.value]
+          };
         }
       };
     });

package/dist/modules/agent/runtime/app/features/agent/types.d.ts

@@ -1,3 +1,12 @@
+import type { AgentPromptDefinition } from '#blokkli/agent/app/types';
+/**
+ * A pending request from the outer feature's item-dropdown action that the
+ * inner container consumes on mount (or on change if already mounted).
+ */
+export type PendingPromptRequest = {
+    prompt: AgentPromptDefinition;
+    selectedUuids: string[];
+};
 export type AgentConversationData = {
     uuid: string;
     title: string;

package/dist/modules/agent/runtime/app/helpers/index.d.ts

@@ -1,5 +1,6 @@
 import type { McpToolDefinition, McpToolContext, McpToolCategory, MutationAction, QueryResult, ToolError } from '#blokkli/agent/app/types';
 import type { BlokkliAdapter } from '#blokkli/editor/adapter';
+import type { BlokkliApp } from '#blokkli/editor/types/app';
 import type { EditMode } from '#blokkli/editor/types/state';
 /**
  * Create a map of tool name to tool definition for quick lookup.
@@ -7,10 +8,13 @@ import type { EditMode } from '#blokkli/editor/types/state';
 export declare function createToolMap(tools: McpToolDefinition[]): Record<string, McpToolDefinition>;
 /**
  * Get tool names for the server.
- * Filters by edit mode and adapter methods if provided.
- * All tools are static and resolved from bundled metadata on the server.
+ *
+ * Applies three filters in order:
+ * 1. `tool.modes` must include the current edit mode.
+ * 2. `tool.requiredAdapterMethods` (if any) must all exist on the adapter.
+ * 3. `tool.isAvailable(app)` (if defined) must return (or resolve to) true.
  */
-export declare function getToolInfoForServer(tools: McpToolDefinition[], editMode: EditMode, adapter?: BlokkliAdapter<unknown>): string[];
+export declare function getToolInfoForServer(tools: McpToolDefinition[], editMode: EditMode, app: BlokkliApp, adapter?: BlokkliAdapter<unknown>): Promise<string[]>;
 /**
  * Coerce stringified JSON values back to their actual types.
  *

package/dist/modules/agent/runtime/app/helpers/index.js

@@ -1,15 +1,21 @@
 export function createToolMap(tools) {
   return Object.fromEntries(tools.map((t) => [t.name, t]));
 }
-export function getToolInfoForServer(tools, editMode, adapter) {
-  return tools.filter((tool) => {
+export async function getToolInfoForServer(tools, editMode, app, adapter) {
+  const staticFiltered = tools.filter((tool) => {
     if (!tool.modes.includes(editMode)) return false;
     if (!tool.requiredAdapterMethods) return true;
     if (!adapter) return true;
     return tool.requiredAdapterMethods.every(
       (method) => typeof adapter[method] === "function"
     );
-  }).map((t) => t.name);
+  });
+  const availability = await Promise.all(
+    staticFiltered.map(
+      (tool) => tool.isAvailable ? Promise.resolve(tool.isAvailable(app)) : true
+    )
+  );
+  return staticFiltered.filter((_, index) => availability[index]).map((t) => t.name);
 }
 export function coerceStringifiedParams(params) {
   const result = {};

package/dist/modules/agent/runtime/app/prompts/fixReadability.js

@@ -1,49 +1,56 @@
 import { defineBlokkliAgentPrompt } from "#blokkli/agent/app/composables";
 export default defineBlokkliAgentPrompt({
-  id: "fix_readability",
-  skills: ["rewrite-and-translate", "asses-and-fix-readability"],
-  tools: [
-    "get_readability_issues",
-    "check_readability_for_texts",
-    "delegate_text_rewrite"
-  ],
-  getLabel: ({ $t }) => {
-    return $t("agentPromptReadabilityLabel", "Fix readability...");
-  },
-  getPrompt: ({ $t }) => {
-    return $t(
-      "agentPromptReadabilityPrompt",
-      "The readability issues have already been analyzed and the fix has been applied. Do not call any more tools. Just very briefly confirm that you are done."
-    );
-  },
-  getUserPrompt: ({ $t }) => {
-    return $t(
-      "agentPromptReadabilityUserPrompt",
-      "Fix the readability of the selected paragraphs."
-    );
-  },
-  async preExecute({ selectedUuids, runTool }) {
-    const readability = await runTool(
-      "get_readability_issues",
-      selectedUuids.length ? {
-        uuids: selectedUuids
-      } : {}
-    );
-    const fields = Object.entries(readability.result).flatMap(
-      ([uuid, fieldMap]) => Object.keys(fieldMap).map((fieldName) => ({ uuid, fieldName }))
-    );
-    return {
-      preSeededResults: [readability],
-      autoExecuteTools: fields.length > 0 ? [
-        {
-          toolName: "delegate_text_rewrite",
-          params: {
-            template: "fix_readability",
-            templateParams: {},
-            fields
-          }
+  resolve: (app) => {
+    if (!app.readability.isAvailable.value) return [];
+    return [
+      {
+        id: "fix_readability",
+        skills: ["rewrite-and-translate", "asses-and-fix-readability"],
+        tools: [
+          "get_readability_issues",
+          "check_readability_for_texts",
+          "delegate_text_rewrite"
+        ],
+        getLabel: ({ $t }) => {
+          return $t("agentPromptReadabilityLabel", "Fix readability...");
+        },
+        getPrompt: ({ $t }) => {
+          return $t(
+            "agentPromptReadabilityPrompt",
+            "The readability issues have already been analyzed and the fix has been applied. Do not call any more tools. Just very briefly confirm that you are done."
+          );
+        },
+        getUserPrompt: ({ $t }) => {
+          return $t(
+            "agentPromptReadabilityUserPrompt",
+            "Fix the readability of the selected paragraphs."
+          );
+        },
+        async preExecute({ selectedUuids, runTool }) {
+          const readability = await runTool(
+            "get_readability_issues",
+            selectedUuids.length ? {
+              uuids: selectedUuids
+            } : {}
+          );
+          const fields = Object.entries(readability.result).flatMap(
+            ([uuid, fieldMap]) => Object.keys(fieldMap).map((fieldName) => ({ uuid, fieldName }))
+          );
+          return {
+            preSeededResults: [readability],
+            autoExecuteTools: fields.length > 0 ? [
+              {
+                toolName: "delegate_text_rewrite",
+                params: {
+                  template: "fix_readability",
+                  templateParams: {},
+                  fields
+                }
+              }
+            ] : void 0
+          };
         }
-      ] : void 0
-    };
+      }
+    ];
   }
 });

package/dist/modules/agent/runtime/app/tools/add_media_paragraph/index.js

@@ -43,7 +43,8 @@ export default defineBlokkliAgentTool({
       mediaId: params.mediaId,
       mediaBundle: params.mediaBundle,
       itemBundles: [params.targetBundle],
-      element: () => document.createElement("div")
+      element: () => document.createElement("div"),
+      label: params.mediaId
     };
     const resolved = resolvePosition(
       ctx.app,

package/dist/modules/agent/runtime/app/tools/check_readability/index.js

@@ -25,6 +25,7 @@ export default defineBlokkliAgentTool({
   lazy: true,
   modes: ["readonly", "editing", "translating", "review"],
   requiredAdapterMethods: ["getAnalyzers"],
+  isAvailable: (app) => app.readability.isAvailable.value,
   label($t) {
     return $t("aiAgentCheckReadabilityRunning", "Checking readability...");
   },

package/dist/modules/agent/runtime/app/tools/delegate_text_rewrite/Component.vue

@@ -510,7 +510,7 @@ async function readabilityRetryLoop(authToken) {
     }
     const retrySuccess = await fetchStream(retryToken, retryFields, {
       issues: retryIssues,
-      scoreLabel: props.context.app.readability.analyzer.value.scoreLabel,
+      scoreLabel: props.context.app.readability.scoreLabel.value,
       scoreReference: props.context.app.readability.getAgentContext(),
       retryFields: retryFieldsData,
       passingFields: passingFieldsData

package/dist/modules/agent/runtime/app/tools/delegate_text_rewrite/index.js

@@ -107,6 +107,11 @@ export default defineBlokkliAgentTool({
     }
     let templateParams = params.templateParams;
     if (params.template === "fix_readability") {
+      if (!ctx.app.readability.isAvailable.value) {
+        return {
+          error: "Readability analyzer is not configured for this project. The fix_readability template requires it."
+        };
+      }
       const analysisResult = await runReadabilityAnalysis(ctx.app);
       const issues = [];
       for (let i = 0; i < resolvedFields.length; i++) {
@@ -124,7 +129,7 @@ export default defineBlokkliAgentTool({
       }
       templateParams = {
         issues,
-        scoreLabel: ctx.app.readability.analyzer.value.scoreLabel,
+        scoreLabel: ctx.app.readability.scoreLabel.value,
         scoreReference: ctx.app.readability.getAgentContext()
       };
     }

package/dist/modules/agent/runtime/app/tools/get_readability_issues/index.js

@@ -27,6 +27,7 @@ export default defineBlokkliAgentTool({
   lazy: true,
   modes: ["readonly", "editing", "translating", "review"],
   requiredAdapterMethods: ["getAnalyzers"],
+  isAvailable: (app) => app.readability.isAvailable.value,
   label($t) {
     return $t("aiAgentAnalyzeContentRunning", "Analyzing content...");
   },

package/dist/modules/agent/runtime/app/types/index.d.ts

@@ -175,6 +175,18 @@ export type McpToolDefinition<TParamsSchema extends z.ZodType = z.ZodType, TResu
      * LLM knows they exist and can load them on demand.
      */
     lazy?: boolean;
+    /**
+     * Runtime predicate that gates tool availability.
+     *
+     * Called once at connection time; the tool is excluded from the list sent
+     * to the LLM when this returns (or resolves to) `false`. Receives the full
+     * `BlokkliApp` so it can inspect provider state — e.g. a tool that relies
+     * on readability can return `app.readability.isAvailable.value`.
+     *
+     * Use this for capabilities that may be switched off at the project level.
+     * For static dependencies on adapter methods, prefer `requiredAdapterMethods`.
+     */
+    isAvailable?: (app: BlokkliApp) => boolean | Promise<boolean>;
     /**
      * Whether results become stale after any mutation.
      * When true, old results from this tool are marked as stale during pruning.

package/dist/modules/charts/runtime/components/ChartRenderer/index.vue

@@ -1,21 +1,23 @@
 <template>
   <div ref="rootEl">
-    <component
-      :is="ApexChart"
-      v-if="ApexChart"
-      :type="type"
-      :options="chartOptions"
-      :series="chartSeries"
-      height="350"
-    />
-    <ol v-if="footnotes?.length" class="bk-chart-footnotes">
-      <li v-for="(note, i) in footnotes" :key="i">
-        <span class="bk-chart-footnote-marker">{{
-          superscriptFor(i + 1)
-        }}</span>
-        {{ note }}
-      </li>
-    </ol>
+    <ClientOnly>
+      <component
+        :is="ApexChart"
+        v-if="ApexChart"
+        :type="type"
+        :options="chartOptions"
+        :series="chartSeries"
+        height="350"
+      />
+      <ol v-if="footnotes?.length" class="bk-chart-footnotes">
+        <li v-for="(note, i) in footnotes" :key="i">
+          <span class="bk-chart-footnote-marker">{{
+            superscriptFor(i + 1)
+          }}</span>
+          {{ note }}
+        </li>
+      </ol>
+    </ClientOnly>
   </div>
 </template>
 
@@ -24,7 +26,7 @@ import { computed, defineAsyncComponent, useTemplateRef } from "#imports";
 import { resolveChartColor, applyFootnotes, SUPERSCRIPTS } from "../../helpers";
 import { getChartTypeRuntime, getDefaultTypeOptions } from "../../chartTypes";
 import { COLORS } from "#blokkli-build/charts-config";
-const ApexChart = defineAsyncComponent(() => import("vue3-apexcharts"));
+const ApexChart = import.meta.client ? defineAsyncComponent(() => import("vue3-apexcharts")) : void 0;
 const props = defineProps({
   title: { type: String, required: true },
   categories: { type: Array, required: true },
@@ -35,8 +37,13 @@ const props = defineProps({
   typeOptions: { type: Object, required: false }
 });
 const rootEl = useTemplateRef("rootEl");
-const chartDef = computed(() => getChartTypeRuntime(props.type));
+const chartDef = computed(
+  () => import.meta.client ? getChartTypeRuntime(props.type) : void 0
+);
 function superscriptFor(n) {
+  if (import.meta.server) {
+    return "";
+  }
   return String(n).split("").map((d) => SUPERSCRIPTS[d] || d).join("");
 }
 function deepMerge(target, source) {
@@ -51,6 +58,9 @@ function deepMerge(target, source) {
   return result;
 }
 const resolvedColors = computed(() => {
+  if (import.meta.server) {
+    return [];
+  }
   const def = chartDef.value;
   if (!def) return [];
   if (def.hasCategoryColors) {
@@ -66,6 +76,9 @@ const resolvedColors = computed(() => {
   return [];
 });
 const chartOptions = computed(() => {
+  if (import.meta.server) {
+    return {};
+  }
   const def = chartDef.value;
   if (!def) return {};
   const base = {
@@ -98,6 +111,9 @@ const chartOptions = computed(() => {
   return deepMerge(base, typeOpts);
 });
 const chartSeries = computed(() => {
+  if (import.meta.server) {
+    return [];
+  }
   const def = chartDef.value;
   if (!def) return [];
   const ctx = {

package/dist/modules/drupal/graphql/base/fragment.paragraphsBlokkliEditState.graphql

@@ -17,6 +17,13 @@ fragment paragraphsBlokkliEditState on ParagraphsBlokkliEditState {
     entityType
     entityBundle
   }
+  droppableFieldValues {
+    uuid
+    fieldName
+    ids
+    entityType
+    entityBundle
+  }
 
   mutatedState {
     fields(langcode: $langcode) {

package/dist/modules/drupal/graphql/features/droppable-field-items.graphql

@@ -0,0 +1,22 @@
+query pbDroppableFieldItems(
+  $entityType: EntityType!
+  $entityUuid: String!
+  $langcode: String!
+  $paragraphUuid: String
+  $fieldName: String!
+) {
+  state: getParagraphsEditState(
+    entityType: $entityType
+    entityUuid: $entityUuid
+    langcode: $langcode
+  ) {
+    droppableFieldItems(paragraphUuid: $paragraphUuid, fieldName: $fieldName) {
+      id
+      entityType
+      bundle
+      label
+      thumbnailSrc
+      targetBundles
+    }
+  }
+}

package/dist/modules/drupal/graphql/features/import-existing.graphql

@@ -1,28 +1,3 @@
-query pbGetImportSourceEntities(
-  $entityType: String!
-  $entityUuid: String!
-  $filters: [ParagraphsBlokkliUserConfigInput]
-  $page: Int
-) {
-  pbGetImportSourceEntities(
-    entityType: $entityType
-    entityUuid: $entityUuid
-    filters: $filters
-    page: $page
-  ) {
-    total
-    perPage
-    filters {
-      ...paragraphsBlokkliConfigInput
-    }
-    items {
-      uuid
-      label
-      description
-    }
-  }
-}
-
 mutation pbCopyFromExisting(
   $entityType: EntityType!
   $entityUuid: String!

package/dist/modules/drupal/graphql/features/workspace.graphql

@@ -7,8 +7,6 @@ query pbEntitiesSearch {
       bundle
       label
       url
-      lastChanged
-      uid
       context
     }
     bundleLabels {
@@ -21,3 +19,12 @@ query pbEntitiesSearch {
     }
   }
 }
+
+query pbEditStatesSummary {
+  paragraphsBlokkliEditStatesSummary {
+    hostEntityType
+    hostEntityUuid
+    lastChanged
+    uid
+  }
+}