@agent-native/core 0.92.7 → 0.92.9

package/corpus/templates/analytics/app/pages/adhoc/explorer-dashboard/ChartCard.tsx

@@ -6,10 +6,12 @@ import {
   IconTrash,
   IconArrowsMaximize,
   IconArrowsMinimize,
+  IconDotsVertical,
   IconExternalLink,
+  IconMessageCircle,
 } from "@tabler/icons-react";
 import { useQuery } from "@tanstack/react-query";
-import { useMemo, useState } from "react";
+import { useCallback, useMemo, useState } from "react";
 
 import {
   AlertDialog,
@@ -22,13 +24,24 @@ import {
   AlertDialogTitle,
 } from "@/components/ui/alert-dialog";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
 import { Skeleton } from "@/components/ui/skeleton";
 import {
   Tooltip,
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
+import type {
+  DashboardPanelChatContextArgs,
+  SelectDashboardPanelOptions,
+} from "@/hooks/use-dashboard-chat-context";
 import { useMetricsQuery } from "@/lib/query-metrics";
+import { cn } from "@/lib/utils";
 
 import { ExplorerChart } from "../explorer/components/ExplorerChart";
 import { buildSql } from "../explorer/sql-builder";
@@ -42,6 +55,11 @@ interface ChartCardProps {
   onToggleWidth: () => void;
   onEdit: () => void;
   editable?: boolean;
+  selectedForChat?: boolean;
+  selectPanelForChat: (
+    panel: DashboardPanelChatContextArgs,
+    options?: SelectDashboardPanelOptions,
+  ) => void;
 }
 
 async function fetchConfig(id: string): Promise<ExplorerConfig | null> {
@@ -66,6 +84,8 @@ export function DashboardChartCard({
   onToggleWidth,
   onEdit,
   editable = true,
+  selectedForChat = false,
+  selectPanelForChat,
 }: ChartCardProps) {
   const t = useT();
   const [confirmOpen, setConfirmOpen] = useState(false);
@@ -100,15 +120,59 @@ export function DashboardChartCard({
   );
 
   const isLoading = !config || queryLoading;
+  const displayTitle = config?.name ?? configName;
+  const handleSelectForChat = useCallback(
+    (options?: SelectDashboardPanelOptions) => {
+      selectPanelForChat(
+        {
+          panelId: chart.id,
+          panelTitle: displayTitle,
+          panelKind: config?.chartType === "table" ? "table" : "chart",
+          chartType: config?.chartType,
+          configId: chart.configId,
+        },
+        options,
+      );
+    },
+    [
+      chart.configId,
+      chart.id,
+      config?.chartType,
+      displayTitle,
+      selectPanelForChat,
+    ],
+  );
+  const handleCardClick = useCallback(
+    (event: React.MouseEvent<HTMLDivElement>) => {
+      const target = event.target;
+      if (
+        target instanceof Element &&
+        target.closest(
+          "button, a, input, textarea, select, [role='menuitem'], [data-no-panel-chat-select]",
+        )
+      ) {
+        return;
+      }
+      handleSelectForChat({ focus: false });
+    },
+    [handleSelectForChat],
+  );
 
   return (
     <div
       ref={setNodeRef}
+      onClick={handleCardClick}
       style={style}
       data-dragging={isDragging ? "true" : undefined}
+      data-chat-selected={selectedForChat ? "true" : undefined}
       className={`explorer-dashboard-card group relative ${chart.width === 2 ? "explorer-dashboard-card-wide" : ""}`}
     >
-      <Card className="h-full">
+      <Card
+        className={cn(
+          "h-full transition-colors",
+          selectedForChat && "border-foreground/35 ring-1 ring-foreground/10",
+        )}
+      >
         <CardHeader className="pb-2 flex flex-row items-center gap-2">
           {editable ? (
             <button
@@ -120,8 +184,37 @@ export function DashboardChartCard({
             </button>
           ) : null}
           <CardTitle className="text-sm font-medium flex-1 truncate">
-            {config?.name ?? configName}
+            {displayTitle}
           </CardTitle>
+          <div className="opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100">
+            <DropdownMenu>
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <DropdownMenuTrigger asChild>
+                    <button
+                      className="p-1 rounded text-muted-foreground hover:text-foreground transition-colors"
+                      aria-label={t("sqlDashboard.panelOptions")}
+                    >
+                      <IconDotsVertical className="h-3.5 w-3.5" />
+                    </button>
+                  </DropdownMenuTrigger>
+                </TooltipTrigger>
+                <TooltipContent>
+                  {t("sqlDashboard.panelOptions")}
+                </TooltipContent>
+              </Tooltip>
+              <DropdownMenuContent align="end" className="w-44">
+                <DropdownMenuItem
+                  onSelect={() =>
+                    handleSelectForChat({ openSidebar: true, focus: true })
+                  }
+                >
+                  <IconMessageCircle className="h-4 w-4 mr-2" />
+                  {t("explorerDashboard.chatWithChart")}
+                </DropdownMenuItem>
+              </DropdownMenuContent>
+            </DropdownMenu>
+          </div>
           {editable ? (
             <div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
               <Tooltip>

package/corpus/templates/analytics/app/pages/adhoc/explorer-dashboard/index.tsx

@@ -205,7 +205,7 @@ export default function ExplorerDashboardPage() {
   );
   const canEdit = resourceCanEdit(resourceAccess);
   const canManage = resourceCanManage(resourceAccess);
-  useDashboardChatContext({
+  const { selectedPanelId, selectPanelForChat } = useDashboardChatContext({
     id: dashboardId,
     kind: "explorer",
     title: dashboard?.name,
@@ -797,6 +797,8 @@ export default function ExplorerDashboardPage() {
                     navigate(`/dashboards/explorer?config=${chart.configId}`)
                   }
                   editable={canEdit}
+                  selectedForChat={selectedPanelId === chart.id}
+                  selectPanelForChat={selectPanelForChat}
                 />
               ))}
             </div>

package/corpus/templates/analytics/app/pages/adhoc/sql-dashboard/SqlChartCard.tsx

@@ -10,6 +10,7 @@ import {
   IconTrash,
   IconCode,
   IconDownload,
+  IconMessageCircle,
 } from "@tabler/icons-react";
 import { useIsFetching, useQueryClient } from "@tanstack/react-query";
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
@@ -46,6 +47,8 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
+import type { SelectDashboardPanelOptions } from "@/hooks/use-dashboard-chat-context";
+import { cn } from "@/lib/utils";
 
 import { serializePanelSql } from "./panel-sql";
 import type { SqlPanel } from "./types";
@@ -62,6 +65,8 @@ interface SqlChartCardProps {
   editable?: boolean;
   eagerLoad?: boolean;
   isDragSource?: boolean;
+  selectedForChat?: boolean;
+  onSelectForChat?: (options?: SelectDashboardPanelOptions) => void;
 }
 
 const PanelDragHandle = memo(function PanelDragHandle({
@@ -115,6 +120,8 @@ export function SqlChartCard({
   editable = true,
   eagerLoad = false,
   isDragSource = false,
+  selectedForChat = false,
+  onSelectForChat,
 }: SqlChartCardProps) {
   const t = useT();
   const queryClient = useQueryClient();
@@ -144,6 +151,12 @@ export function SqlChartCard({
   const chartHasCachedData =
     queryClient.getQueryData(chartQueryKey) !== undefined;
   const isChartRefreshing = chartHasCachedData && chartFetchCount > 0;
+  const extensionId =
+    panel.chartType === "extension"
+      ? ((panel.config as Record<string, unknown> | undefined)?.extensionId as
+          | string
+          | undefined)
+      : undefined;
 
   const setCardNodeRef = useCallback((node: HTMLDivElement | null) => {
     cardRef.current = node;
@@ -160,6 +173,22 @@ export function SqlChartCard({
     });
   }, [chartQueryKey, queryClient]);
 
+  const handleCardClick = useCallback(
+    (event: React.MouseEvent<HTMLDivElement>) => {
+      const target = event.target;
+      if (
+        target instanceof Element &&
+        target.closest(
+          "button, a, input, textarea, select, [role='menuitem'], [data-no-panel-chat-select]",
+        )
+      ) {
+        return;
+      }
+      onSelectForChat?.({ focus: false });
+    },
+    [onSelectForChat],
+  );
+
   useEffect(() => {
     if (eagerLoad) {
       setShouldLoadData(true);
@@ -299,14 +328,17 @@ export function SqlChartCard({
   // actions (full screen, refresh, open embedded extension); editable
   // dashboards also get delete and drag.
   if (panel.chartType === "extension") {
-    const extensionId = (panel.config as Record<string, unknown> | undefined)
-      ?.extensionId as string | undefined;
     return (
       <div
         ref={setCardNodeRef}
+        onClick={handleCardClick}
         style={isDragSource ? { zIndex: 50 } : undefined}
         data-dragging={isDragSource ? "true" : undefined}
-        className="dashboard-extension-card group relative h-full"
+        data-chat-selected={selectedForChat ? "true" : undefined}
+        className={cn(
+          "dashboard-extension-card group relative h-full rounded-lg border border-transparent transition-colors",
+          selectedForChat && "border-foreground/35 ring-1 ring-foreground/10",
+        )}
       >
         {!expanded && (
           <SqlChart
@@ -332,6 +364,15 @@ export function SqlChartCard({
               <TooltipContent>{t("sqlDashboard.panelOptions")}</TooltipContent>
             </Tooltip>
             <DropdownMenuContent align="end" className="w-44">
+              <DropdownMenuItem
+                onSelect={() =>
+                  onSelectForChat?.({ openSidebar: true, focus: true })
+                }
+              >
+                <IconMessageCircle className="h-4 w-4 mr-2" />
+                {t("sqlDashboard.chatWithPanel")}
+              </DropdownMenuItem>
+              <DropdownMenuSeparator />
               <DropdownMenuItem onSelect={() => setExpanded(true)}>
                 <IconMaximize className="h-4 w-4 mr-2" />
                 {t("sqlDashboard.fullScreen")}
@@ -437,11 +478,18 @@ export function SqlChartCard({
   return (
     <div
       ref={setCardNodeRef}
+      onClick={handleCardClick}
       style={isDragSource ? { zIndex: 50 } : undefined}
       data-dragging={isDragSource ? "true" : undefined}
+      data-chat-selected={selectedForChat ? "true" : undefined}
       className="dashboard-chart-card group relative h-full hover:z-20 focus-within:z-20"
     >
-      <Card className="flex h-full flex-col overflow-visible">
+      <Card
+        className={cn(
+          "flex h-full flex-col overflow-visible transition-colors",
+          selectedForChat && "border-foreground/35 ring-1 ring-foreground/10",
+        )}
+      >
         <CardHeader className="pb-2 flex flex-row items-center gap-2 shrink-0">
           <CardTitle className="text-sm font-medium flex-1 truncate">
             {panel.title}
@@ -499,6 +547,15 @@ export function SqlChartCard({
                   </TooltipContent>
                 </Tooltip>
                 <DropdownMenuContent align="end" className="w-44">
+                  <DropdownMenuItem
+                    onSelect={() =>
+                      onSelectForChat?.({ openSidebar: true, focus: true })
+                    }
+                  >
+                    <IconMessageCircle className="h-4 w-4 mr-2" />
+                    {t("sqlDashboard.chatWithPanel")}
+                  </DropdownMenuItem>
+                  <DropdownMenuSeparator />
                   <DropdownMenuItem onSelect={() => setExpanded(true)}>
                     <IconMaximize className="h-4 w-4 mr-2" />
                     {t("sqlDashboard.fullScreen")}

package/corpus/templates/analytics/app/pages/adhoc/sql-dashboard/index.tsx

@@ -92,7 +92,11 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
-import { useDashboardChatContext } from "@/hooks/use-dashboard-chat-context";
+import {
+  useDashboardChatContext,
+  type DashboardPanelChatContextArgs,
+  type SelectDashboardPanelOptions,
+} from "@/hooks/use-dashboard-chat-context";
 import { useDashboardViews } from "@/hooks/use-dashboard-views";
 import { useUserPref } from "@/hooks/use-user-pref";
 import { incrementItemView } from "@/lib/item-popularity";
@@ -258,6 +262,8 @@ const PanelCell = memo(function PanelCell({
   editable,
   eagerLoad,
   isDragSource,
+  selectedForChat,
+  selectPanelForChat,
   onRemovePanel,
   onEditPanel,
   onSavePanel,
@@ -268,6 +274,11 @@ const PanelCell = memo(function PanelCell({
   editable: boolean;
   eagerLoad: boolean;
   isDragSource: boolean;
+  selectedForChat: boolean;
+  selectPanelForChat: (
+    panel: DashboardPanelChatContextArgs,
+    options?: SelectDashboardPanelOptions,
+  ) => void;
   onRemovePanel: (panelId: string) => void;
   onEditPanel: (panel: SqlPanel) => void;
   onSavePanel: (panel: SqlPanel) => Promise<void>;
@@ -289,6 +300,29 @@ const PanelCell = memo(function PanelCell({
     () => interpolate(serializePanelSql(panel.sql), vars),
     [panel.sql, vars],
   );
+  const handleSelectForChat = useCallback(
+    (options?: SelectDashboardPanelOptions) => {
+      const extensionId =
+        panel.chartType === "extension" ? panel.config?.extensionId : undefined;
+      selectPanelForChat(
+        {
+          panelId: panel.id,
+          panelTitle: panel.title,
+          panelKind:
+            panel.chartType === "table"
+              ? "table"
+              : panel.chartType === "extension"
+                ? "extension"
+                : "chart",
+          chartType: panel.chartType,
+          source: panel.source,
+          extensionId,
+        },
+        options,
+      );
+    },
+    [panel, selectPanelForChat],
+  );
 
   return (
     <div
@@ -323,6 +357,8 @@ const PanelCell = memo(function PanelCell({
         editable={editable}
         eagerLoad={eagerLoad}
         isDragSource={isDragSource}
+        selectedForChat={selectedForChat}
+        onSelectForChat={handleSelectForChat}
       />
     </div>
   );
@@ -477,7 +513,7 @@ export default function SqlDashboardPage() {
   const dashboardColumns = clampDashboardColumns(
     dashboard?.columns ?? DEFAULT_DASHBOARD_COLUMNS,
   );
-  useDashboardChatContext({
+  const { selectedPanelId, selectPanelForChat } = useDashboardChatContext({
     id: reportScreenshot ? null : dashboardId,
     kind: "sql",
     title: dashboard?.name,
@@ -1859,6 +1895,8 @@ export default function SqlDashboardPage() {
                                 editable={canEdit}
                                 eagerLoad={reportScreenshot}
                                 isDragSource={activeDragPanelId === panel.id}
+                                selectedForChat={selectedPanelId === panel.id}
+                                selectPanelForChat={selectPanelForChat}
                                 onRemovePanel={removePanel}
                                 onEditPanel={openEditPanel}
                                 onSavePanel={handleSavePanel}

package/corpus/templates/analytics/changelog/2026-07-09-analytics-no-longer-forgets-successful-data-queries-when-a-l.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-07-09
+---
+
+Analytics no longer forgets successful data queries when a long request continues in the background.

package/corpus/templates/analytics/changelog/2026-07-09-dashboard-charts-keep-consistent-spacing-when-they-stack-ver.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-07-09
+---
+
+Dashboard charts keep consistent spacing when they stack vertically

package/corpus/templates/analytics/changelog/2026-07-09-dashboard-charts-tables-and-extensions-can-be-selected-and-d.md

@@ -0,0 +1,6 @@
+---
+type: added
+date: 2026-07-09
+---
+
+Dashboard charts, tables, and extensions can be selected and discussed directly with the agent.

package/corpus/templates/analytics/changelog/2026-07-09-long-running-analytics-requests-now-recover-automatically-wh.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-07-09
+---
+
+Long-running Analytics requests now recover automatically when a background handoff is interrupted.

package/corpus/templates/analytics/server/db/index.ts

@@ -1,3 +1,4 @@
+import { registerDataProgramsShareable } from "@agent-native/core/data-programs";
 import { createGetDb } from "@agent-native/core/db";
 import { registerShareableResource } from "@agent-native/core/sharing";
 
@@ -12,6 +13,11 @@ import * as schema from "./schema.js";
 export const getDb = createGetDb(schema);
 export { schema };
 
+// Core data-program tables live outside analytics/schema.ts; register the
+// sharing type here so get-data-program / resolveAccess work in dev, CLI, and
+// extension iframes (same side-effect pattern as dashboard/analysis below).
+registerDataProgramsShareable();
+
 registerShareableResource({
   type: "dashboard",
   resourceTable: schema.dashboards,

package/corpus/templates/clips/desktop/src/hooks/useMeetingTranscription.ts

@@ -377,9 +377,7 @@ export function useMeetingTranscription({
         };
 
         // Resume the engine that initial start settled on (no fallback here —
-        // the engine choice was already made below). Keep voice processing
-        // off: AEC/ducking on the shared mic can make Zoom/Meet callers hear
-        // the local user at a whisper while Clips is transcribed.
+        // the engine choice was already made below).
         const startAudio = async () => {
           await restartTranscriptionEngine(
             session.engine,
@@ -388,7 +386,6 @@ export function useMeetingTranscription({
               label: selectedMicLabel,
             },
             true,
-            false,
           );
         };
 
@@ -559,9 +556,6 @@ export function useMeetingTranscription({
 
         session.engine = await startTranscriptionEngine({
           mic: { deviceId: selectedMicId, label: selectedMicLabel },
-          // Match clip recordings: VoiceProcessingIO AEC/ducking on the shared
-          // mic can tank live meeting volume for remote participants.
-          voiceProcessing: false,
         });
 
         await invoke("silence_detector_start", {

package/corpus/templates/content/app/components/editor/DocumentProperties.tsx

@@ -69,6 +69,8 @@ import {
   useMemo,
   useRef,
   useState,
+  type KeyboardEvent as ReactKeyboardEvent,
+  type MouseEvent as ReactMouseEvent,
   type PointerEvent as ReactPointerEvent,
   type ReactNode,
 } from "react";
@@ -1110,7 +1112,11 @@ export function PropertyManagementPopover({
             {triggerTrailing}
           </button>
         </DropdownMenuTrigger>
-        <DropdownMenuContent align="start" className="w-72">
+        <DropdownMenuContent
+          align="start"
+          collisionPadding={12}
+          className="relative z-[300] w-72"
+        >
           <div
             className="flex items-center gap-2 p-1"
             onKeyDown={(event) => event.stopPropagation()}
@@ -1379,15 +1385,17 @@ export function PropertyManagementPopover({
       </DropdownMenu>
 
       <AlertDialog open={confirmDeleteOpen} onOpenChange={setConfirmDeleteOpen}>
-        <AlertDialogContent>
-          <AlertDialogHeader>
-            <AlertDialogTitle>
+        <AlertDialogContent className="max-w-sm gap-0 rounded-lg p-5">
+          <AlertDialogHeader className="space-y-0 gap-1.5 text-start">
+            <AlertDialogTitle className="text-base leading-tight tracking-tight">
               {t("editor.properties.deletePropertyQuestion")}
             </AlertDialogTitle>
-            <AlertDialogDescription>
-              {t("editor.properties.deletePropertyDescription", {
-                name: property.definition.name,
-              })}
+            <AlertDialogDescription className="leading-normal [text-wrap:pretty]">
+              {t("editor.properties.deletePropertyDescriptionPrefix")}
+              <span className="font-medium text-foreground">
+                {property.definition.name}
+              </span>
+              {t("editor.properties.deletePropertyDescriptionSuffix")}
             </AlertDialogDescription>
           </AlertDialogHeader>
           {isOnlyBlocksField ? (
@@ -1395,12 +1403,12 @@ export function PropertyManagementPopover({
               {t("editor.properties.onlyBlocksPropertyWarning")}
             </div>
           ) : null}
-          <AlertDialogFooter>
-            <AlertDialogCancel>
+          <AlertDialogFooter className="mt-4 flex-row items-center justify-end gap-2 sm:space-x-0">
+            <AlertDialogCancel className="mt-0 h-8 px-3 focus-visible:ring-1 focus-visible:ring-muted-foreground/40 focus-visible:ring-offset-1">
               {t("editor.properties.cancel")}
             </AlertDialogCancel>
             <AlertDialogAction
-              className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
+              className="h-8 bg-destructive px-3 text-destructive-foreground hover:bg-destructive/90 focus-visible:ring-1 focus-visible:ring-muted-foreground/40 focus-visible:ring-offset-1"
               onClick={() => void deleteProperty()}
             >
               {t("editor.properties.deleteProperty")}
@@ -2651,6 +2659,7 @@ export function AddProperty({
     }))
     .filter((group) => group.fields.length > 0);
   const addPropertySearchInputRef = useRef<HTMLInputElement>(null);
+  const addActivationRef = useRef<{ key: string; at: number } | null>(null);
   const [pendingPropertyType, setPendingPropertyType] =
     useState<DocumentPropertyType | null>(null);
   const [pendingSourceFieldId, setPendingSourceFieldId] = useState<
@@ -2718,6 +2727,39 @@ export function AddProperty({
     }
   }
 
+  function runAddPropertyActivation(key: string, action: () => void) {
+    const now = Date.now();
+    const previous = addActivationRef.current;
+    if (previous?.key === key && now - previous.at < 750) return;
+    addActivationRef.current = { key, at: now };
+    action();
+  }
+
+  function activateAddPropertyItem(
+    event: Pick<
+      ReactMouseEvent<HTMLButtonElement>,
+      "button" | "preventDefault" | "stopPropagation"
+    >,
+    key: string,
+    action: () => void,
+  ) {
+    if (event.button !== 0) return;
+    event.preventDefault();
+    event.stopPropagation();
+    runAddPropertyActivation(key, action);
+  }
+
+  function activateAddPropertyItemFromKeyboard(
+    event: ReactKeyboardEvent<HTMLButtonElement>,
+    key: string,
+    action: () => void,
+  ) {
+    if (event.key !== "Enter" && event.key !== " ") return;
+    event.preventDefault();
+    event.stopPropagation();
+    runAddPropertyActivation(key, action);
+  }
+
   return (
     <Popover
       open={open}
@@ -2747,9 +2789,10 @@ export function AddProperty({
         </button>
       </PopoverTrigger>
       <PopoverContent
-        align="start"
+        align={variant === "default" ? "start" : "end"}
+        collisionPadding={12}
         portalled={popoversPortalled}
-        className="w-80 p-2"
+        className="relative z-[300] w-80 p-2"
       >
         <div className="grid gap-2">
           <div className="flex h-8 items-center gap-1 rounded border border-border bg-background px-2">
@@ -2800,7 +2843,33 @@ export function AddProperty({
                       disabled={isAddingProperty}
                       aria-busy={pendingSourceFieldId === field.id}
                       className="flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-sm hover:bg-accent disabled:opacity-50"
-                      onClick={() => void addFromSourceField(field.id)}
+                      onPointerDownCapture={(event) =>
+                        activateAddPropertyItem(
+                          event,
+                          `source:${field.id}`,
+                          () => {
+                            void addFromSourceField(field.id);
+                          },
+                        )
+                      }
+                      onClick={(event) =>
+                        activateAddPropertyItem(
+                          event,
+                          `source:${field.id}`,
+                          () => {
+                            void addFromSourceField(field.id);
+                          },
+                        )
+                      }
+                      onKeyDown={(event) =>
+                        activateAddPropertyItemFromKeyboard(
+                          event,
+                          `source:${field.id}`,
+                          () => {
+                            void addFromSourceField(field.id);
+                          },
+                        )
+                      }
                     >
                       {pendingSourceFieldId === field.id ? (
                         <Spinner className="size-4 shrink-0 text-muted-foreground" />
@@ -2837,7 +2906,25 @@ export function AddProperty({
                   className="flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-sm hover:bg-accent"
                   disabled={isAddingProperty}
                   aria-busy={pendingPropertyType === type}
-                  onClick={() => void add(type)}
+                  onPointerDownCapture={(event) =>
+                    activateAddPropertyItem(event, `type:${type}`, () => {
+                      void add(type);
+                    })
+                  }
+                  onClick={(event) =>
+                    activateAddPropertyItem(event, `type:${type}`, () => {
+                      void add(type);
+                    })
+                  }
+                  onKeyDown={(event) =>
+                    activateAddPropertyItemFromKeyboard(
+                      event,
+                      `type:${type}`,
+                      () => {
+                        void add(type);
+                      },
+                    )
+                  }
                 >
                   {pendingPropertyType === type ? (
                     <Spinner className="size-4 text-muted-foreground" />