refactor(plugins): plugin system overhaul — phases 1-4 + 6 integrated

app/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/types/routes.d.ts";
+import "./.next/dev/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

app/src/app/(dashboard)/widget-lab/page.tsx

@@ -18,7 +18,7 @@ import {
   useCreateWidgetTemplate,
 } from "@/hooks/use-widget-templates";
 import { useConnections } from "@/hooks/use-connections";
-import { getChartConfig } from "@/lib/chart-registry";
+import { getChartConfig } from "@/lib/chart-helpers";
 import { DashboardPickerDialog } from "@/components/dashboard-picker-dialog";
 import {
   PageHeader,

app/src/components/__tests__/card-container-states.test.tsx

@@ -46,6 +46,7 @@ vi.mock("@neoboard/components", () => ({
   ),
   ColumnMappingOverlay: () => <div data-testid="column-mapping-overlay" />,
   substituteParams: (s: string) => s,
+  getChartOptions: () => [],
 }));
 
 vi.mock("next/dynamic", () => ({

app/src/components/__tests__/card-container.test.tsx

@@ -40,20 +40,26 @@ vi.mock("@/stores/parameter-store", () => ({
   useParameterValues: () => ({}),
 }));
 
-vi.mock("@/lib/chart-registry", () => ({
+vi.mock("@/lib/chart-helpers", () => ({
   getChartConfig: (type: string) => {
     if (type === "bar" || type === "markdown") {
       return {
         type,
         label: type,
         transform: (d: unknown) => d,
         transformWithMapping: (d: unknown) => d,
-        supportsColumnMapping: false,
         validate: () => null,
+        capabilities: {
+          supportsClickAction: true,
+          supportsStyling: false,
+          isECharts: false,
+          requiresQuery: true,
+        },
       };
     }
     return null;
   },
+  supportsColumnMapping: () => false,
 }));
 
 vi.mock("@/lib/resolve-cache-options", () => ({
@@ -249,7 +255,7 @@ describe("CardContainer", () => {
 
   describe("form widget path", () => {
     it("renders chart for form widgets without querying", () => {
-      // Need to add "form" to the mock chart-registry
+      // Need to add "form" to the mock chart-helpers
       const widget = createWidget({
         chartType: "bar",
         settings: { chartOptions: {} },

app/src/components/__tests__/chart-error-boundary.test.tsx

@@ -22,6 +22,7 @@ vi.mock("@neoboard/components", () => ({
   JsonViewer: () => <div data-testid="json-viewer" />,
   MarkdownWidget: () => <div data-testid="markdown-widget" />,
   IframeWidget: () => <div data-testid="iframe-widget" />,
+  getChartOptions: () => [],
 }));
 
 // Mock next/dynamic to just render children synchronously

app/src/components/card-container.tsx

@@ -3,8 +3,11 @@
 import { useWidgetQuery } from "@/hooks/use-widget-query";
 import { useClickAction } from "@/hooks/use-click-action";
 import { resolveCacheOptions } from "@/lib/resolve-cache-options";
-import { getChartConfig } from "@/lib/chart-registry";
-import type { ColumnMapping } from "@/lib/chart-registry";
+import {
+  getChartConfig,
+  supportsColumnMapping as chartSupportsColumnMapping,
+} from "@/lib/chart-helpers";
+import type { ColumnMapping } from "@/lib/chart-helpers";
 import type { DashboardWidget, StylingConfig } from "@/lib/db/schema";
 import type { ParameterSourceMap } from "@/lib/collect-parameter-names";
 import type { ColorScaleConfig } from "@neoboard/components";
@@ -32,10 +35,9 @@ import {
 } from "@neoboard/components";
 import { ChartRenderer } from "./chart-renderer";
 
-/** Chart types that support column mapping. */
-/** Derived from registry — chart types that support column mapping overlays. */
+/** Chart types that support column mapping overlays. */
 function supportsColumnMapping(type: string): boolean {
-  return getChartConfig(type)?.supportsColumnMapping === true;
+  return chartSupportsColumnMapping(type);
 }
 
 interface CardContainerProps {
@@ -296,10 +298,9 @@ export function CardContainer({
         />
       );
     }
-    const mappedData = chartConfig.transformWithMapping(
-      previewData,
-      columnMapping,
-    );
+    const mappedData = (
+      chartConfig.transformWithMapping ?? chartConfig.transform
+    )(previewData, columnMapping);
     // Skip transforms for graph charts — their data shape is incompatible with tabular transforms
     const transformedData =
       dataTransforms.length && widget.chartType !== "graph"
@@ -548,7 +549,9 @@ export function CardContainer({
     );
   }
 
-  const mappedData = chartConfig.transformWithMapping(rawData, columnMapping);
+  const mappedData = (
+    chartConfig.transformWithMapping ?? chartConfig.transform
+  )(rawData, columnMapping);
   const transformedData = dataTransforms.length
     ? applyTransforms(
         mappedData as Record<string, unknown>[],

app/src/components/chart-renderer.tsx

@@ -2,7 +2,6 @@
 
 import React from "react";
 import { AlertCircle } from "lucide-react";
-import type { ChartType } from "@/lib/chart-registry";
 import { pluginRegistry } from "@/plugins";
 import { ChartErrorBoundary } from "./chart-error-boundary";
 import { EmptyState } from "@neoboard/components";
@@ -31,7 +30,7 @@ export interface ChartMetaProps {
 }
 
 export interface ChartRendererProps {
-  type: ChartType;
+  type: string;
   data: unknown;
   settings?: Record<string, unknown>;
   styling?: ChartStylingProps;

app/src/components/graph-exploration-wrapper.tsx

@@ -15,7 +15,7 @@ import type {
   FetchNeighborsResult,
   PropertySection,
 } from "@neoboard/components";
-import { getChartConfig } from "@/lib/chart-registry";
+import { getChartConfig } from "@/lib/chart-helpers";
 import { normalizeValue } from "@/lib/normalize-value";
 import { useGraphWidgetStore } from "@/stores/graph-widget-store";
 

app/src/components/save-template-dialog.tsx

@@ -15,7 +15,7 @@ import {
   Label,
   Textarea,
 } from "@neoboard/components";
-import { getChartConfig } from "@/lib/chart-registry";
+import { getChartConfig } from "@/lib/chart-helpers";
 import type { ConnectorType } from "@/lib/connector-types";
 
 interface SaveTemplateDialogProps {

app/src/components/widget-editor-modal.tsx

@@ -66,11 +66,11 @@ import type { ColorScaleConfig } from "@neoboard/components";
 import {
   getCompatibleChartTypes,
   getChartConfig,
-  chartRegistry,
   chartSupportsClickAction,
   chartSupportsStyling,
-} from "@/lib/chart-registry";
-import type { ChartType } from "@/lib/chart-registry";
+  getAllChartTypes,
+} from "@/lib/chart-helpers";
+import type { ChartType } from "@/lib/chart-helpers";
 import { type ConnectorType, CONNECTOR_LANGUAGES } from "@/lib/connector-types";
 import { useParameterValues } from "@/stores/parameter-store";
 import { extractReferencedParams } from "@/hooks/use-widget-query";
@@ -402,8 +402,8 @@ export function WidgetEditorModal({
   const compatibleChartTypes = useMemo(
     () =>
       selectedConnection
-        ? getCompatibleChartTypes(selectedConnection.type)
-        : (Object.keys(chartRegistry) as ChartType[]),
+        ? (getCompatibleChartTypes(selectedConnection.type) as ChartType[])
+        : (getAllChartTypes() as ChartType[]),
     [selectedConnection],
   );
 
@@ -1452,8 +1452,8 @@ export function WidgetEditorModal({
                                     variant="outline"
                                     className="text-xs font-normal"
                                   >
-                                    {chartRegistry[w.chartType as ChartType]
-                                      ?.label ?? w.chartType}
+                                    {getChartConfig(w.chartType)?.label ??
+                                      w.chartType}
                                   </Badge>
                                 </Label>
                               </div>

app/src/components/widget-editor/__tests__/query-editor-panel.test.tsx

@@ -209,7 +209,7 @@ describe("QueryEditorPanel", () => {
   it("does not show query hint for chart types without hints", () => {
     useWidgetEditorStore
       .getState()
-      .setChartType("markdown" as import("@/lib/chart-registry").ChartType);
+      .setChartType("markdown" as import("@/lib/chart-helpers").ChartType);
     render(<QueryEditorPanel editorLanguage="cypher" />);
     // No hint text for markdown
     expect(screen.queryByText(/Return 2\+ columns/)).not.toBeInTheDocument();

app/src/components/widget-editor/chart-type-selector.tsx

@@ -21,8 +21,8 @@ import {
 } from "lucide-react";
 import type { LucideIcon } from "lucide-react";
 import { Label, Combobox } from "@neoboard/components";
-import type { ChartType } from "@/lib/chart-registry";
-import { getChartConfig } from "@/lib/chart-registry";
+import type { ChartType } from "@/lib/chart-helpers";
+import { getChartConfig } from "@/lib/chart-helpers";
 
 /** Icon map for chart type dropdown (labels come from chartRegistry, icons stay in UI layer) */
 export const chartTypeIcons: Record<ChartType, LucideIcon> = {

app/src/components/widget-editor/query-editor-panel.tsx

@@ -17,7 +17,7 @@ import {
   DropdownMenuItem,
 } from "@neoboard/components";
 import { FileCode } from "lucide-react";
-import type { ChartType } from "@/lib/chart-registry";
+import type { ChartType } from "@/lib/chart-helpers";
 import { useConnectionSchema } from "@/hooks/use-schema";
 import { useSchemaStore } from "@/stores/schema-store";
 

app/src/components/widget-editor/styling-rules-editor.tsx

@@ -4,7 +4,7 @@ import React from "react";
 import type { StylingRule, StylingOperator } from "@/lib/db/schema";
 import { getOperatorGroups } from "@neoboard/components/charts";
 import { useWidgetEditorStore } from "@/stores/widget-editor-store";
-import { getStylingTargets } from "@/lib/chart-registry";
+import { getStylingTargets } from "@/lib/chart-helpers";
 import { ArrowLeft, GripVertical, Plus, Trash2, Bold } from "lucide-react";
 import {
   Accordion,