@fayz-ai/plugin-forms 0.9.4 → 0.10.0

package/dist/components/AddDocumentDropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AddDocumentDropdown.d.ts","sourceRoot":"","sources":["../../src/components/AddDocumentDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwC,MAAM,OAAO,CAAA;AAY5D,OAAO,EAAuB,KAAK,kBAAkB,EAAE,MAAM,uBAAuB,CAAA;AAEpF,UAAU,wBAAwB;IAChC,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAA;CAC/C;AAED,wBAAgB,mBAAmB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,wBAAwB,qBAwEnF"}
+{"version":3,"file":"AddDocumentDropdown.d.ts","sourceRoot":"","sources":["../../src/components/AddDocumentDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAWhF,OAAO,EAAuB,KAAK,kBAAkB,EAAE,MAAM,uBAAuB,CAAA;AAEpF,UAAU,wBAAwB;IAChC,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAA;CAC/C;AAQD,wBAAgB,mBAAmB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,wBAAwB,qBA6KnF"}

package/dist/index.js

@@ -1,10 +1,10 @@
 import { createOrUpdateFormTool, prefillFromPerson, FormRenderer, printDocument } from './chunk-RBLXIKWB.js';
-import React2, { useState, useCallback, useRef, useEffect } from 'react';
-import { registerTranslations, createSafeDataProvider, getSupabaseClientOptional, useTranslation, getActiveTenantId } from '@fayz-ai/core';
-import { PluginSettingsPanel, registerTimelineSource, useLimitGuard, invalidateLimit, PermissionGate } from '@fayz-ai/admin';
+import React2, { useState, useCallback, useRef, useMemo, useEffect } from 'react';
+import { registerTranslations, createSafeDataProvider, getSupabaseClientOptional, useTranslation, getActiveTenantId, emitDomainEvent, useDataVersion } from '@fayz-ai/core';
+import { PluginSettingsPanel, registerTimelineSource, useLimitGuard, invalidateLimit, askAI, PermissionGate, QuickActionsButton } from '@fayz-ai/admin';
 import { create } from 'zustand';
-import { FileText, Image, Paperclip, Search, Plus, Pencil, Archive, ArrowLeft, Printer, ChevronDown, Upload, Eye } from 'lucide-react';
-import { Input, Button, Card, CardContent, Badge, useSaveBar, Dropdown, DropdownTrigger, DropdownContent, DropdownSeparator, DropdownLabel, DropdownItem } from '@fayz-ai/ui';
+import { FileText, Image, Paperclip, Pencil, Archive, Plus, Search, ArrowLeft, Printer, ChevronDown, Upload, Eye } from 'lucide-react';
+import { Badge, Button, PageHeaderActions, Card, DataTable, useSaveBar, Dropdown, DropdownTrigger, DropdownContent, DropdownSeparator, DropdownLabel } from '@fayz-ai/ui';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // src/data/tables.ts
@@ -503,6 +503,14 @@ function createSupabaseFormsProvider() {
     }
   };
 }
+var FORM_TEMPLATE_EVENT = "forms.template.";
+function emitTemplateEvent(action, id, name) {
+  emitDomainEvent(
+    `${FORM_TEMPLATE_EVENT}${action}`,
+    { record_id: id, record_name: name ?? null },
+    { tenantId: getActiveTenantId() ?? null, subject: { type: "form_template", id } }
+  );
+}
 function createCustomFormsStore(provider) {
   return create((set) => ({
     templates: [],
@@ -557,6 +565,7 @@ function createCustomFormsStore(provider) {
     async createTemplate(input) {
       const template = await provider.createTemplate(input);
       set((s) => ({ templates: [template, ...s.templates], templatesTotal: s.templatesTotal + 1 }));
+      emitTemplateEvent("created", template.id, template.name);
       return template;
     },
     async updateTemplate(id, input) {
@@ -565,10 +574,12 @@ function createCustomFormsStore(provider) {
         templates: s.templates.map((t) => t.id === id ? template : t),
         activeTemplate: s.activeTemplate?.id === id ? template : s.activeTemplate
       }));
+      emitTemplateEvent("updated", template.id, template.name);
       return template;
     },
     async deleteTemplate(id) {
       await provider.deleteTemplate(id);
+      emitTemplateEvent("deleted", id);
       set((s) => ({
         templates: s.templates.filter((t) => t.id !== id),
         templatesTotal: s.templatesTotal - 1
@@ -628,6 +639,16 @@ var en = {
   "customForms.settingsSubtitle": "Create and manage custom forms for your business",
   // Templates
   "customForms.templates": "Templates",
+  "customForms.newWithAIHint": "Describe the form and I build the fields.",
+  "customForms.newByHand": "Create by hand",
+  "customForms.newByHandHint": "Build it field by field in the builder.",
+  "customForms.askPlaceholder": "Describe the form\u2026",
+  "customForms.askPersona": "Form builder",
+  "customForms.askPitch": "Tell me the form you need.",
+  "customForms.askDescription": "Describe what it is for and I propose the fields, their types and options in one go. You check and adjust before saving.",
+  "customForms.askSuggestion.0": "A full intake form",
+  "customForms.askSuggestion.1": "Consent form for an aesthetic procedure",
+  "customForms.askSuggestion.2": "Session progress note",
   "customForms.newTemplate": "New Template",
   "customForms.editTemplate": "Edit Template",
   "customForms.templateName": "Form name",
@@ -691,6 +712,8 @@ var en = {
   "customForms.documents": "Documents",
   "customForms.addDocument": "Add Document",
   "customForms.selectTemplate": "Select a form",
+  "customForms.searchDocumentTypes": "Search forms or files...",
+  "customForms.noResults": "No results",
   "customForms.noDocuments": "No documents yet",
   "customForms.noDocumentsDescription": "Add a document to start recording information.",
   "customForms.documentTitle": "Document title",
@@ -702,6 +725,10 @@ var en = {
   "customForms.printPdf": "Print / PDF",
   "customForms.usageCount": "{{count}} filled in",
   "customForms.usageLast": "last on {{date}}",
+  // Template list columns
+  "customForms.template": "Template",
+  "customForms.categoryColumn": "Category",
+  "customForms.usageColumn": "Usage",
   // Registry
   "registry.form-categories": "Categories",
   "registry.form-categories.description": "Categories for organizing form templates",
@@ -719,6 +746,16 @@ var ptBR = {
   "customForms.settingsSubtitle": "Crie e gerencie formul\xE1rios personalizados para o seu neg\xF3cio",
   // Templates
   "customForms.templates": "Modelos",
+  "customForms.newWithAIHint": "Descreva o formul\xE1rio e eu monto os campos.",
+  "customForms.newByHand": "Criar manualmente",
+  "customForms.newByHandHint": "Montar campo a campo no construtor.",
+  "customForms.askPlaceholder": "Descreva o formul\xE1rio\u2026",
+  "customForms.askPersona": "Montador de formul\xE1rios",
+  "customForms.askPitch": "Diga o formul\xE1rio que voc\xEA precisa.",
+  "customForms.askDescription": "Descreva para que serve e eu proponho os campos, os tipos e as op\xE7\xF5es de uma vez. Voc\xEA confere e ajusta antes de salvar.",
+  "customForms.askSuggestion.0": "Uma ficha de anamnese completa",
+  "customForms.askSuggestion.1": "Termo de consentimento para procedimento est\xE9tico",
+  "customForms.askSuggestion.2": "Ficha de evolu\xE7\xE3o de atendimento",
   "customForms.newTemplate": "Novo Modelo",
   "customForms.editTemplate": "Editar Modelo",
   "customForms.templateName": "Nome do formul\xE1rio",
@@ -782,6 +819,8 @@ var ptBR = {
   "customForms.documents": "Documentos",
   "customForms.addDocument": "Novo Documento",
   "customForms.selectTemplate": "Selecione um formul\xE1rio",
+  "customForms.searchDocumentTypes": "Buscar formul\xE1rio ou arquivo...",
+  "customForms.noResults": "Nenhum resultado",
   "customForms.noDocuments": "Nenhum documento",
   "customForms.noDocumentsDescription": "Adicione um documento para come\xE7ar a registrar informa\xE7\xF5es.",
   "customForms.documentTitle": "T\xEDtulo do documento",
@@ -793,6 +832,10 @@ var ptBR = {
   "customForms.printPdf": "Imprimir / PDF",
   "customForms.usageCount": "{{count}} preenchidos",
   "customForms.usageLast": "\xFAltimo em {{date}}",
+  // Colunas da lista de modelos
+  "customForms.template": "Modelo",
+  "customForms.categoryColumn": "Categoria",
+  "customForms.usageColumn": "Uso",
   // Registry
   "registry.form-categories": "Categorias",
   "registry.form-categories.description": "Categorias para organizar modelos de formul\xE1rios",
@@ -838,13 +881,40 @@ function TemplateListView({ store, config, onEdit, onNew }) {
   const loading = store((s) => s.templatesLoading);
   const usage = store((s) => s.templateUsage);
   const orgId = getFormsTenantId();
+  const createActions = useMemo(() => [
+    {
+      id: "with-ai",
+      label: t("assistant.askAI"),
+      description: t("customForms.newWithAIHint"),
+      icon: "WandSparkles",
+      highlight: true,
+      action: () => askAI({
+        hint: t("customForms.askPlaceholder"),
+        intro: {
+          role: "setup",
+          persona: t("customForms.askPersona"),
+          pitch: t("customForms.askPitch"),
+          description: t("customForms.askDescription"),
+          suggestions: [0, 1, 2].map((i) => ({ label: t(`customForms.askSuggestion.${i}`) }))
+        }
+      })
+    },
+    {
+      id: "by-hand",
+      label: t("customForms.newByHand"),
+      description: t("customForms.newByHandHint"),
+      icon: "SlidersHorizontal",
+      action: onNew
+    }
+  ], [t, onNew]);
+  const version = useDataVersion(`${FORM_TEMPLATE_EVENT}*`);
   useEffect(() => {
     if (!orgId) return;
     const timer = setTimeout(() => {
       store.getState().fetchTemplates({ search: search || void 0 });
     }, 50);
     return () => clearTimeout(timer);
-  }, [orgId, search]);
+  }, [orgId, search, version]);
   useEffect(() => {
     if (!orgId) return;
     void store.getState().fetchTemplateUsage();
@@ -855,106 +925,123 @@ function TemplateListView({ store, config, onEdit, onNew }) {
   }, [store, t]);
   const visibleTemplates = templates.filter((tpl) => tpl.isActive !== false);
   const categoryLabel = (cat) => t(`customForms.category.${cat}`);
+  const columns = useMemo(() => [
+    {
+      id: "name",
+      header: t("customForms.template"),
+      cell: ({ row }) => /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx("span", { className: "font-medium", children: row.original.name }),
+        row.original.description && /* @__PURE__ */ jsx("p", { className: "truncate text-xs text-muted-foreground", children: row.original.description })
+      ] })
+    },
+    {
+      id: "category",
+      header: t("customForms.categoryColumn"),
+      cell: ({ row }) => /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: `text-[10px] ${CATEGORY_COLORS[row.original.category]}`, children: categoryLabel(row.original.category) })
+    },
+    {
+      id: "fields",
+      header: t("customForms.builder.fields"),
+      cell: ({ row }) => /* @__PURE__ */ jsxs("span", { className: "tabular-nums text-muted-foreground", children: [
+        row.original.schema.fields.length,
+        row.original.version > 1 && /* @__PURE__ */ jsxs("span", { className: "ml-2", children: [
+          "v",
+          row.original.version
+        ] })
+      ] })
+    },
+    {
+      id: "usage",
+      header: t("customForms.usageColumn"),
+      // "0 preenchimentos" é informação, não ausência dela: é o que separa um
+      // formulário que o salão usa todo dia de um que sobrou de uma importação.
+      cell: ({ row }) => {
+        const u = usage[row.original.id];
+        return /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+          t("customForms.usageCount", { count: String(u?.documentCount ?? 0) }),
+          u?.lastDocumentAt && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("span", { className: "px-1", children: "\xB7" }),
+            t("customForms.usageLast", { date: new Date(u.lastDocumentAt).toLocaleDateString() })
+          ] })
+        ] });
+      }
+    },
+    {
+      id: "actions",
+      header: "",
+      cell: ({ row }) => /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-1", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: (e) => {
+              e.stopPropagation();
+              onEdit(row.original);
+            },
+            className: "rounded-md p-1.5 hover:bg-muted",
+            title: t("common.edit"),
+            children: /* @__PURE__ */ jsx(Pencil, { className: "h-3.5 w-3.5 text-muted-foreground" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: (e) => {
+              e.stopPropagation();
+              void handleArchive(row.original);
+            },
+            className: "rounded-md p-1.5 hover:bg-muted",
+            title: t("customForms.archive"),
+            children: /* @__PURE__ */ jsx(Archive, { className: "h-3.5 w-3.5 text-muted-foreground" })
+          }
+        )
+      ] })
+    }
+  ], [t, usage, onEdit, handleArchive]);
+  const emptyState = /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-6 text-center", children: [
+    /* @__PURE__ */ jsx("div", { className: "mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted", children: /* @__PURE__ */ jsx(FileText, { className: "h-5 w-5 text-muted-foreground" }) }),
+    /* @__PURE__ */ jsx("p", { className: "font-medium text-foreground", children: t("customForms.noTemplates") }),
+    /* @__PURE__ */ jsx("p", { className: "mt-1 max-w-sm text-sm text-muted-foreground", children: t("customForms.noTemplatesDescription") }),
+    /* @__PURE__ */ jsx(PermissionGate, { feature: "custom_forms", action: "create", children: /* @__PURE__ */ jsxs(Button, { onClick: onNew, size: "sm", className: "mt-4", children: [
+      /* @__PURE__ */ jsx(Plus, { className: "mr-1.5 h-3.5 w-3.5" }),
+      t("customForms.newTemplate")
+    ] }) })
+  ] });
   return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-      /* @__PURE__ */ jsxs("div", { className: "relative flex-1 max-w-xs", children: [
-        /* @__PURE__ */ jsx(Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-muted-foreground" }),
+    /* @__PURE__ */ jsx(PermissionGate, { feature: "custom_forms", action: "create", children: /* @__PURE__ */ jsx(PageHeaderActions, { children: /* @__PURE__ */ jsx(
+      QuickActionsButton,
+      {
+        label: t("customForms.newTemplate"),
+        variant: "default",
+        actions: createActions
+      }
+    ) }) }),
+    /* @__PURE__ */ jsxs(Card, { className: "overflow-hidden", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-2 border-b border-border px-3 py-2", children: /* @__PURE__ */ jsxs("div", { className: "relative min-w-[10rem] flex-1", children: [
+        /* @__PURE__ */ jsx(Search, { className: "pointer-events-none absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }),
         /* @__PURE__ */ jsx(
-          Input,
+          "input",
           {
+            type: "text",
             value: search,
             onChange: (e) => setSearch(e.target.value),
             placeholder: t("common.search"),
-            className: "h-9 pl-8 text-sm"
+            className: "w-full bg-transparent py-1.5 pl-8 pr-3 text-sm placeholder:text-muted-foreground focus:outline-none"
           }
         )
-      ] }),
-      /* @__PURE__ */ jsx(PermissionGate, { feature: "custom_forms", action: "create", children: /* @__PURE__ */ jsxs(Button, { onClick: onNew, size: "sm", className: "h-9", children: [
-        /* @__PURE__ */ jsx(Plus, { className: "h-3.5 w-3.5 mr-1.5" }),
-        t("customForms.newTemplate")
-      ] }) })
-    ] }),
-    !loading && visibleTemplates.length === 0 && /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(CardContent, { className: "flex flex-col items-center justify-center py-16 text-center", children: [
-      /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-muted mb-4", children: /* @__PURE__ */ jsx(FileText, { className: "h-5 w-5 text-muted-foreground" }) }),
-      /* @__PURE__ */ jsx("p", { className: "font-medium", children: t("customForms.noTemplates") }),
-      /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mt-1 max-w-sm", children: t("customForms.noTemplatesDescription") }),
-      /* @__PURE__ */ jsx(PermissionGate, { feature: "custom_forms", action: "create", children: /* @__PURE__ */ jsxs(Button, { onClick: onNew, size: "sm", className: "mt-4", children: [
-        /* @__PURE__ */ jsx(Plus, { className: "h-3.5 w-3.5 mr-1.5" }),
-        t("customForms.newTemplate")
-      ] }) })
-    ] }) }),
-    visibleTemplates.length > 0 && /* @__PURE__ */ jsx("div", { className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-3", children: visibleTemplates.map((template) => /* @__PURE__ */ jsx(
-      Card,
-      {
-        className: "group cursor-pointer hover:shadow-md transition-shadow",
-        onClick: () => onEdit(template),
-        children: /* @__PURE__ */ jsxs(CardContent, { className: "p-4", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
-            /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
-              /* @__PURE__ */ jsx("h3", { className: "font-medium text-sm truncate", children: template.name }),
-              template.description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-0.5 line-clamp-2", children: template.description })
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex gap-1 opacity-0 group-hover:opacity-100 transition-opacity", children: [
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  onClick: (e) => {
-                    e.stopPropagation();
-                    onEdit(template);
-                  },
-                  className: "p-1.5 rounded-md hover:bg-muted",
-                  children: /* @__PURE__ */ jsx(Pencil, { className: "h-3.5 w-3.5 text-muted-foreground" })
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  onClick: (e) => {
-                    e.stopPropagation();
-                    handleArchive(template);
-                  },
-                  className: "p-1.5 rounded-md hover:bg-muted",
-                  title: t("customForms.archive"),
-                  children: /* @__PURE__ */ jsx(Archive, { className: "h-3.5 w-3.5 text-muted-foreground" })
-                }
-              )
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-3", children: [
-            /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: `text-[10px] ${CATEGORY_COLORS[template.category]}`, children: categoryLabel(template.category) }),
-            /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
-              template.schema.fields.length,
-              " ",
-              t("customForms.builder.fields").toLowerCase()
-            ] }),
-            template.version > 1 && /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
-              "v",
-              template.version
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs("p", { className: "mt-2 text-[10px] text-muted-foreground", children: [
-            t("customForms.usageCount", {
-              count: String(usage[template.id]?.documentCount ?? 0)
-            }),
-            usage[template.id]?.lastDocumentAt && /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx("span", { className: "px-1", children: "\xB7" }),
-              t("customForms.usageLast", {
-                date: new Date(usage[template.id].lastDocumentAt).toLocaleDateString()
-              })
-            ] })
-          ] })
-        ] })
-      },
-      template.id
-    )) }),
-    loading && /* @__PURE__ */ jsx("div", { className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-3", children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(CardContent, { className: "p-4 space-y-3", children: [
-      /* @__PURE__ */ jsx("div", { className: "h-4 w-2/3 bg-muted animate-pulse rounded" }),
-      /* @__PURE__ */ jsx("div", { className: "h-3 w-full bg-muted animate-pulse rounded" }),
-      /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-        /* @__PURE__ */ jsx("div", { className: "h-5 w-16 bg-muted animate-pulse rounded-full" }),
-        /* @__PURE__ */ jsx("div", { className: "h-5 w-12 bg-muted animate-pulse rounded-full" })
-      ] })
-    ] }) }, i)) })
+      ] }) }),
+      /* @__PURE__ */ jsx(
+        DataTable,
+        {
+          variant: "bare",
+          columns,
+          data: loading ? [] : visibleTemplates,
+          loading,
+          skeletonRows: 3,
+          emptyMessage: emptyState,
+          onRowClick: (row) => onEdit(row)
+        }
+      )
+    ] })
   ] });
 }
 var ROUTE_BASE = "/settings/custom_forms";
@@ -1431,13 +1518,24 @@ async function getAllDocumentTypes(personId) {
   all.sort((a, b) => (a.groupOrder ?? 50) - (b.groupOrder ?? 50) || (a.order ?? 0) - (b.order ?? 0));
   return all;
 }
+var SEARCH_THRESHOLD = 8;
+var normalize = (s) => s.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase();
 function AddDocumentDropdown({ personId, onSelect }) {
   const t = useTranslation();
+  const [open, setOpen] = useState(false);
   const [options, setOptions] = useState([]);
   const [loaded, setLoaded] = useState(false);
+  const [query, setQuery] = useState("");
+  const [activeIndex, setActiveIndex] = useState(0);
   const loadingRef = useRef(false);
-  const handleOpen = useCallback((open) => {
-    if (!open || loaded || loadingRef.current) return;
+  const inputRef = useRef(null);
+  const listRef = useRef(null);
+  const handleOpenChange = useCallback((next) => {
+    setOpen(next);
+    if (!next) return;
+    setQuery("");
+    setActiveIndex(0);
+    if (loaded || loadingRef.current) return;
     loadingRef.current = true;
     getAllDocumentTypes(personId).then((opts) => {
       setOptions(opts);
@@ -1445,38 +1543,110 @@ function AddDocumentDropdown({ personId, onSelect }) {
       loadingRef.current = false;
     });
   }, [personId, loaded]);
-  const groups = [];
-  for (const opt of options) {
-    let group = groups.find((g) => g.label === opt.group);
-    if (!group) {
-      group = { label: opt.group, items: [] };
-      groups.push(group);
+  const filtered = useMemo(() => {
+    const q = normalize(query.trim());
+    if (!q) return options;
+    return options.filter(
+      (o) => normalize(o.label).includes(q) || (o.description ? normalize(o.description).includes(q) : false)
+    );
+  }, [options, query]);
+  const groups = useMemo(() => {
+    const acc = [];
+    for (const opt of filtered) {
+      let group = acc.find((g) => g.label === opt.group);
+      if (!group) {
+        group = { label: opt.group, items: [] };
+        acc.push(group);
+      }
+      group.items.push(opt);
     }
-    group.items.push(opt);
-  }
-  return /* @__PURE__ */ jsxs(Dropdown, { onOpenChange: handleOpen, children: [
+    return acc;
+  }, [filtered]);
+  const showSearch = loaded && options.length > SEARCH_THRESHOLD;
+  useEffect(() => {
+    if (!open || !showSearch) return;
+    const id = requestAnimationFrame(() => inputRef.current?.focus());
+    return () => cancelAnimationFrame(id);
+  }, [open, showSearch]);
+  useEffect(() => {
+    listRef.current?.querySelector(`[data-index="${activeIndex}"]`)?.scrollIntoView({ block: "nearest" });
+  }, [activeIndex]);
+  const choose = useCallback((opt) => {
+    setOpen(false);
+    onSelect(opt);
+  }, [onSelect]);
+  const handleInputKeyDown = (e) => {
+    if (e.key === "Escape") return;
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      setActiveIndex((i) => Math.min(filtered.length - 1, i + 1));
+    } else if (e.key === "ArrowUp") {
+      e.preventDefault();
+      setActiveIndex((i) => Math.max(0, i - 1));
+    } else if (e.key === "Enter") {
+      e.preventDefault();
+      const opt = filtered[activeIndex];
+      if (opt) choose(opt);
+    }
+    e.stopPropagation();
+  };
+  let flatIndex = -1;
+  return /* @__PURE__ */ jsxs(Dropdown, { open, onOpenChange: handleOpenChange, children: [
     /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { size: "sm", className: "h-8", children: [
       /* @__PURE__ */ jsx(Plus, { className: "h-3.5 w-3.5 mr-1" }),
       t("customForms.addDocument"),
       /* @__PURE__ */ jsx(ChevronDown, { className: "h-3 w-3 ml-1 opacity-50" })
     ] }) }),
-    /* @__PURE__ */ jsxs(DropdownContent, { align: "end", className: "w-56", children: [
-      groups.map((group, gi) => /* @__PURE__ */ jsxs(React2.Fragment, { children: [
-        gi > 0 && /* @__PURE__ */ jsx(DropdownSeparator, {}),
-        /* @__PURE__ */ jsx(DropdownLabel, { className: "text-[10px] uppercase tracking-wider", children: group.label }),
-        group.items.map((opt) => {
-          const Icon = opt.icon;
-          return /* @__PURE__ */ jsxs(DropdownItem, { onClick: () => onSelect(opt), className: "gap-2", children: [
-            /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4 text-muted-foreground shrink-0" }),
-            /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
-              /* @__PURE__ */ jsx("p", { className: "text-sm truncate", children: opt.label }),
-              opt.description && /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground truncate", children: opt.description })
-            ] })
-          ] }, opt.id);
-        })
-      ] }, group.label)),
-      !loaded && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-3", children: /* @__PURE__ */ jsx("div", { className: "h-4 w-4 border-2 border-primary border-t-transparent animate-spin rounded-full" }) }),
-      loaded && options.length === 0 && /* @__PURE__ */ jsx("div", { className: "px-2 py-3 text-center text-xs text-muted-foreground", children: t("customForms.noTemplates") })
+    /* @__PURE__ */ jsxs(DropdownContent, { align: "end", className: "w-72 p-0", children: [
+      showSearch && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-b px-2.5 py-2", children: [
+        /* @__PURE__ */ jsx(Search, { className: "h-3.5 w-3.5 text-muted-foreground shrink-0" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: inputRef,
+            value: query,
+            onChange: (e) => {
+              setQuery(e.target.value);
+              setActiveIndex(0);
+            },
+            onKeyDown: handleInputKeyDown,
+            placeholder: t("customForms.searchDocumentTypes"),
+            className: "flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { ref: listRef, className: "max-h-[min(60vh,20rem)] overflow-y-auto overscroll-contain p-1", children: [
+        groups.map((group, gi) => /* @__PURE__ */ jsxs(React2.Fragment, { children: [
+          gi > 0 && /* @__PURE__ */ jsx(DropdownSeparator, {}),
+          /* @__PURE__ */ jsx(DropdownLabel, { className: "text-[10px] uppercase tracking-wider", children: group.label }),
+          group.items.map((opt) => {
+            const Icon = opt.icon;
+            flatIndex += 1;
+            const index = flatIndex;
+            return /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                "data-index": index,
+                onClick: () => choose(opt),
+                onMouseEnter: () => setActiveIndex(index),
+                className: `relative flex w-full cursor-default select-none items-center gap-2 rounded-button px-2 py-1.5 text-left text-sm outline-none transition-colors ${index === activeIndex ? "bg-muted" : ""}`,
+                children: [
+                  /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4 text-muted-foreground shrink-0" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+                    /* @__PURE__ */ jsx("p", { className: "text-sm truncate", children: opt.label }),
+                    opt.description && /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground truncate", children: opt.description })
+                  ] })
+                ]
+              },
+              opt.id
+            );
+          })
+        ] }, group.label)),
+        !loaded && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-3", children: /* @__PURE__ */ jsx("div", { className: "h-4 w-4 border-2 border-primary border-t-transparent animate-spin rounded-full" }) }),
+        loaded && options.length === 0 && /* @__PURE__ */ jsx("div", { className: "px-2 py-3 text-center text-xs text-muted-foreground", children: t("customForms.noTemplates") }),
+        loaded && options.length > 0 && filtered.length === 0 && /* @__PURE__ */ jsx("div", { className: "px-2 py-3 text-center text-xs text-muted-foreground", children: t("customForms.noResults") })
+      ] })
     ] })
   ] });
 }
@@ -1747,7 +1917,6 @@ function createCustomFormsPlugin(options) {
   const registries = [...formRegistries, ...options?.settingsRegistries ?? []];
   const SettingsComponent = () => React2.createElement(PluginSettingsPanel, {
     title: config.labels.settingsLabel,
-    subtitle: config.labels.settingsSubtitle,
     customTabs: [
       {
         id: "forms",
@@ -1765,6 +1934,7 @@ function createCustomFormsPlugin(options) {
   PersonDocumentsWidget2.displayName = "PersonDocumentsWidget";
   return {
     id: "custom_forms",
+    defaultAgentRole: "setup",
     name: config.labels.pageTitle,
     icon: "FileText",
     version: "1.0.0",