@aganzefelicite/responsekit-react 0.2.0 → 0.3.0

package/dist/index.js

@@ -1,304 +1,8 @@
 import { __export, formatValue, isDev, rowsToCsv } from './chunk-3FSZRQQU.js';
+import { lazy, Suspense, Component, useMemo, useReducer, useState, useRef, useCallback, useEffect } from 'react';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { lazy, Suspense, Component, useReducer, useState, useRef, useCallback, useEffect } from 'react';
-
-// src/actions.ts
-var noopAction = () => {
-};
-function Markdown({ children, className }) {
-  return /* @__PURE__ */ jsx("div", { className: className ?? "rk-markdown", children: /* @__PURE__ */ jsx(
-    ReactMarkdown,
-    {
-      remarkPlugins: [remarkGfm],
-      components: {
-        a: ({ node: _node, ...props }) => /* @__PURE__ */ jsx("a", { ...props, target: "_blank", rel: "noopener noreferrer" })
-      },
-      children
-    }
-  ) });
-}
-function TextBlock({ block }) {
-  return /* @__PURE__ */ jsx("div", { className: "rk-block rk-block-text", children: /* @__PURE__ */ jsx(Markdown, { children: block.content }) });
-}
-var TREND_GLYPH = { UP: "\u25B2", DOWN: "\u25BC", STABLE: "\u2192" };
-function KpiBlock({ block }) {
-  const items = Array.isArray(block.items) ? block.items : [];
-  return /* @__PURE__ */ jsxs("section", { className: "rk-block rk-block-kpi", "aria-label": block.title ?? "KPIs", children: [
-    block.title ? /* @__PURE__ */ jsx("h3", { className: "rk-block-title", children: block.title }) : null,
-    /* @__PURE__ */ jsx("div", { className: "rk-kpi-grid", children: items.map((item, i) => {
-      const display = item.formattedValue ?? formatValue(item.value);
-      const trend = item.trend;
-      return /* @__PURE__ */ jsxs("div", { className: "rk-kpi-item", children: [
-        /* @__PURE__ */ jsx("div", { className: "rk-kpi-label", children: item.label }),
-        /* @__PURE__ */ jsx("div", { className: "rk-kpi-value", children: display }),
-        trend || typeof item.percentageChange === "number" ? /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: `rk-kpi-trend rk-kpi-trend-${(trend ?? "STABLE").toLowerCase()}`,
-            children: [
-              trend ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: TREND_GLYPH[trend] }) : null,
-              typeof item.percentageChange === "number" ? /* @__PURE__ */ jsxs("span", { children: [
-                item.percentageChange > 0 ? "+" : "",
-                item.percentageChange,
-                "%"
-              ] }) : null
-            ]
-          }
-        ) : null
-      ] }, `${item.label}-${i}`);
-    }) })
-  ] });
-}
-var ChartRenderer = lazy(() => import('./ChartRenderer-URPZESVN.js'));
-function ChartBlock({ block }) {
-  return /* @__PURE__ */ jsxs("section", { className: "rk-block rk-block-chart", children: [
-    block.title ? /* @__PURE__ */ jsx("h3", { className: "rk-block-title", children: block.title }) : null,
-    /* @__PURE__ */ jsx(
-      Suspense,
-      {
-        fallback: /* @__PURE__ */ jsx("div", { className: "rk-chart-placeholder", "aria-busy": "true", children: "Loading chart\u2026" }),
-        children: /* @__PURE__ */ jsx(ChartRenderer, { block })
-      }
-    )
-  ] });
-}
-function TableBlock({ block, onAction }) {
-  const columns = Array.isArray(block.columns) ? block.columns : [];
-  const rows = Array.isArray(block.rows) ? block.rows : [];
-  const download = () => onAction({
-    type: "DOWNLOAD",
-    format: "CSV",
-    filename: `${block.title ?? "table"}.csv`,
-    data: rowsToCsv(columns, rows),
-    blockId: block.id
-  });
-  return /* @__PURE__ */ jsxs("section", { className: "rk-block rk-block-table", children: [
-    /* @__PURE__ */ jsxs("div", { className: "rk-block-header", children: [
-      block.title ? /* @__PURE__ */ jsx("h3", { className: "rk-block-title", children: block.title }) : null,
-      rows.length > 0 ? /* @__PURE__ */ jsx("button", { type: "button", className: "rk-action", onClick: download, children: "Download CSV" }) : null
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "rk-table-scroll", children: [
-      /* @__PURE__ */ jsxs("table", { className: "rk-table", children: [
-        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsx("th", { scope: "col", children: col.label }, col.key)) }) }),
-        /* @__PURE__ */ jsx("tbody", { children: rows.map((row, r) => /* @__PURE__ */ jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsx("td", { children: formatValue(row[col.key]) }, col.key)) }, r)) })
-      ] }),
-      rows.length === 0 ? /* @__PURE__ */ jsx("p", { className: "rk-empty", children: "No data." }) : null
-    ] })
-  ] });
-}
-var SEVERITY_GLYPH = {
-  INFO: "\u2139",
-  SUCCESS: "\u2713",
-  WARNING: "\u26A0",
-  CRITICAL: "\u2715"
-};
-function InsightBlock({ block }) {
-  const severity = ["INFO", "SUCCESS", "WARNING", "CRITICAL"].includes(
-    block.severity
-  ) ? block.severity : "INFO";
-  return /* @__PURE__ */ jsxs(
-    "aside",
-    {
-      className: `rk-block rk-block-insight rk-severity-${severity.toLowerCase()}`,
-      role: "note",
-      children: [
-        /* @__PURE__ */ jsx("span", { className: "rk-insight-icon", "aria-hidden": true, children: SEVERITY_GLYPH[severity] }),
-        /* @__PURE__ */ jsxs("div", { className: "rk-insight-body", children: [
-          /* @__PURE__ */ jsx("div", { className: "rk-insight-title", children: block.title }),
-          /* @__PURE__ */ jsx("div", { className: "rk-insight-desc", children: block.description })
-        ] })
-      ]
-    }
-  );
-}
-function RecommendationBlock({
-  block
-}) {
-  const items = Array.isArray(block.items) ? block.items : [];
-  return /* @__PURE__ */ jsx("section", { className: "rk-block rk-block-recommendation", children: /* @__PURE__ */ jsx("ul", { className: "rk-recommendation-list", children: items.map((item, i) => /* @__PURE__ */ jsxs("li", { className: "rk-recommendation-item", children: [
-    /* @__PURE__ */ jsx("div", { className: "rk-recommendation-title", children: item.title }),
-    /* @__PURE__ */ jsx("div", { className: "rk-recommendation-desc", children: item.description })
-  ] }, `${item.title}-${i}`)) }) });
-}
-function FilterControl({ filter }) {
-  const options = Array.isArray(filter.options) ? filter.options : [];
-  switch (filter.filterType) {
-    case "SELECT":
-    case "MULTI_SELECT":
-      return /* @__PURE__ */ jsx("select", { disabled: true, multiple: filter.filterType === "MULTI_SELECT", "aria-label": filter.label, children: options.map((o) => /* @__PURE__ */ jsx("option", { value: o, children: o }, o)) });
-    case "DATE_RANGE":
-      return /* @__PURE__ */ jsxs("span", { className: "rk-filter-range", children: [
-        /* @__PURE__ */ jsx("input", { type: "date", disabled: true, "aria-label": `${filter.label} from` }),
-        /* @__PURE__ */ jsx("input", { type: "date", disabled: true, "aria-label": `${filter.label} to` })
-      ] });
-    case "NUMBER_RANGE":
-      return /* @__PURE__ */ jsxs("span", { className: "rk-filter-range", children: [
-        /* @__PURE__ */ jsx("input", { type: "number", disabled: true, "aria-label": `${filter.label} min`, placeholder: "min" }),
-        /* @__PURE__ */ jsx("input", { type: "number", disabled: true, "aria-label": `${filter.label} max`, placeholder: "max" })
-      ] });
-    case "SEARCH":
-    default:
-      return /* @__PURE__ */ jsx("input", { type: "search", disabled: true, "aria-label": filter.label, placeholder: "Search\u2026" });
-  }
-}
-function FilterBlock({ block }) {
-  const filters = Array.isArray(block.filters) ? block.filters : [];
-  return /* @__PURE__ */ jsx("section", { className: "rk-block rk-block-filter", "aria-label": "Filters (read-only)", children: /* @__PURE__ */ jsx("div", { className: "rk-filter-row", children: filters.map((filter, i) => /* @__PURE__ */ jsxs("label", { className: "rk-filter", children: [
-    /* @__PURE__ */ jsx("span", { className: "rk-filter-label", children: filter.label }),
-    /* @__PURE__ */ jsx(FilterControl, { filter })
-  ] }, `${filter.field}-${i}`)) }) });
-}
-function FallbackBlock({ block }) {
-  const type = typeof block?.type === "string" ? block.type : "unknown";
-  return /* @__PURE__ */ jsxs("div", { className: "rk-block rk-block-fallback", role: "note", children: [
-    /* @__PURE__ */ jsxs("div", { className: "rk-fallback-label", children: [
-      "Unsupported block: ",
-      type
-    ] }),
-    isDev() ? /* @__PURE__ */ jsxs("details", { className: "rk-fallback-raw", children: [
-      /* @__PURE__ */ jsx("summary", { children: "Raw payload (dev only)" }),
-      /* @__PURE__ */ jsx("pre", { children: safeStringify(block) })
-    ] }) : null
-  ] });
-}
-function safeStringify(value) {
-  try {
-    return JSON.stringify(value, null, 2);
-  } catch {
-    return String(value);
-  }
-}
-
-// src/blocks/index.ts
-var defaultBlockComponents = {
-  TEXT: TextBlock,
-  KPI: KpiBlock,
-  CHART: ChartBlock,
-  TABLE: TableBlock,
-  INSIGHT: InsightBlock,
-  RECOMMENDATION: RecommendationBlock,
-  FILTER: FilterBlock
-};
-
-// src/registry.ts
-var globalRegistry = /* @__PURE__ */ new Map();
-function registerBlock(options) {
-  if (!options.override && globalRegistry.has(options.type)) return;
-  globalRegistry.set(options.type, options.component);
-}
-function unregisterBlock(type) {
-  globalRegistry.delete(type);
-}
-function registeredBlockTypes() {
-  return [...globalRegistry.keys()];
-}
-function resolveBlockComponent(type, overrides) {
-  return overrides?.[type] ?? globalRegistry.get(type) ?? defaultBlockComponents[type] ?? FallbackBlock;
-}
-var ErrorBoundary = class extends Component {
-  constructor() {
-    super(...arguments);
-    this.state = { error: null };
-  }
-  static getDerivedStateFromError(error) {
-    return { error };
-  }
-  componentDidCatch(error, info) {
-    this.props.onError?.(error, info);
-  }
-  render() {
-    if (this.state.error) return this.props.fallback(this.state.error);
-    return this.props.children;
-  }
-};
-function AiRenderer({
-  response,
-  components,
-  onAction = noopAction,
-  className
-}) {
-  if (!response || typeof response !== "object" || !("type" in response)) {
-    return /* @__PURE__ */ jsx(ErrorView, { message: "No response to display." });
-  }
-  return /* @__PURE__ */ jsxs("div", { className: className ?? "rk-response", "data-response-type": response.type, children: [
-    renderBody(response, components, onAction),
-    /* @__PURE__ */ jsx(MetadataFooter, { metadata: response.metadata, onAction, responseId: response.id })
-  ] });
-}
-function renderBody(response, components, onAction) {
-  switch (response.type) {
-    case "TEXT": {
-      const { format, value } = response.content;
-      return format === "MARKDOWN" ? /* @__PURE__ */ jsx(Markdown, { children: value }) : /* @__PURE__ */ jsx("p", { className: "rk-text-plain", children: value });
-    }
-    case "ANALYTICS": {
-      const { title, blocks } = response.content;
-      const list = Array.isArray(blocks) ? blocks : [];
-      return /* @__PURE__ */ jsxs(Fragment, { children: [
-        title ? /* @__PURE__ */ jsx("h2", { className: "rk-response-title", children: title }) : null,
-        /* @__PURE__ */ jsx("div", { className: "rk-blocks", children: list.map((block, i) => /* @__PURE__ */ jsx(
-          BlockSlot,
-          {
-            block,
-            components,
-            onAction
-          },
-          blockKey(block, i)
-        )) })
-      ] });
-    }
-    case "ERROR":
-      return /* @__PURE__ */ jsx(ErrorView, { message: response.content.message });
-    default:
-      return /* @__PURE__ */ jsx(ErrorView, { message: "Unsupported response type." });
-  }
-}
-function BlockSlot({
-  block,
-  components,
-  onAction
-}) {
-  const type = typeof block?.type === "string" ? block.type : "UNKNOWN";
-  const Component2 = resolveBlockComponent(type, components);
-  return /* @__PURE__ */ jsx(ErrorBoundary, { fallback: () => /* @__PURE__ */ jsx(FallbackBlock, { block, onAction }), children: /* @__PURE__ */ jsx(Component2, { block, onAction }) });
-}
-function ErrorView({ message }) {
-  return /* @__PURE__ */ jsxs("div", { className: "rk-block rk-error", role: "alert", children: [
-    /* @__PURE__ */ jsx("span", { className: "rk-error-icon", "aria-hidden": true, children: "\u2715" }),
-    /* @__PURE__ */ jsx("span", { className: "rk-error-message", children: message })
-  ] });
-}
-function MetadataFooter({
-  metadata,
-  onAction,
-  responseId
-}) {
-  if (!metadata) return null;
-  const { generatedAt, dataSource, refreshable } = metadata;
-  if (!generatedAt && !dataSource && !refreshable) return null;
-  return /* @__PURE__ */ jsxs("footer", { className: "rk-meta", children: [
-    generatedAt ? /* @__PURE__ */ jsx("span", { className: "rk-meta-time", children: formatTime(generatedAt) }) : null,
-    dataSource ? /* @__PURE__ */ jsx("span", { className: "rk-meta-source", children: dataSource }) : null,
-    refreshable ? /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: "rk-action rk-meta-refresh",
-        onClick: () => onAction({ type: "REFRESH", responseId }),
-        children: "Refresh"
-      }
-    ) : null
-  ] });
-}
-function formatTime(iso) {
-  const d = new Date(iso);
-  return Number.isNaN(d.getTime()) ? iso : d.toLocaleString();
-}
-function blockKey(block, index) {
-  return typeof block?.id === "string" && block.id ? block.id : `block-${index}`;
-}
 
 // ../../node_modules/.pnpm/zod@3.25.76/node_modules/zod/v3/external.js
 var external_exports = {};
@@ -4453,198 +4157,495 @@ var toUnknownBlock = (raw) => {
     type: typeof obj.type === "string" ? obj.type : "UNKNOWN"
   };
 };
-var blockSchema = external_exports.union([
-  knownBlockSchema,
-  external_exports.any().transform(toUnknownBlock)
-]);
-var textResponseSchema = external_exports.object({
-  id: external_exports.string(),
-  type: external_exports.literal("TEXT"),
-  content: external_exports.object({ format: textFormatSchema, value: external_exports.string() }),
-  metadata: responseMetadataSchema.optional()
-});
-var analyticsResponseSchema = external_exports.object({
-  id: external_exports.string(),
-  type: external_exports.literal("ANALYTICS"),
-  content: external_exports.object({
-    title: external_exports.string().optional(),
-    // Use the lenient block schema so one malformed block can't sink the whole response.
-    blocks: external_exports.array(blockSchema)
-  }),
-  metadata: responseMetadataSchema.optional()
-});
-var errorResponseSchema = external_exports.object({
-  id: external_exports.string(),
-  type: external_exports.literal("ERROR"),
-  content: external_exports.object({ message: external_exports.string() }),
-  metadata: responseMetadataSchema.optional()
-});
-var aiResponseSchema = external_exports.discriminatedUnion("type", [
-  textResponseSchema,
-  analyticsResponseSchema,
-  errorResponseSchema
-]);
-var makeErrorResponse = (message, id) => ({
-  id: id ?? genId("error"),
-  type: "ERROR",
-  content: { message }
-});
-function parseAiResponse(input) {
-  const result = aiResponseSchema.safeParse(input);
-  if (result.success) return result.data;
-  return makeErrorResponse(
-    "The response could not be displayed (it did not match the expected format)."
+var blockSchema = external_exports.union([
+  knownBlockSchema,
+  external_exports.any().transform(toUnknownBlock)
+]);
+var textResponseSchema = external_exports.object({
+  id: external_exports.string(),
+  type: external_exports.literal("TEXT"),
+  content: external_exports.object({ format: textFormatSchema, value: external_exports.string() }),
+  metadata: responseMetadataSchema.optional()
+});
+var analyticsResponseSchema = external_exports.object({
+  id: external_exports.string(),
+  type: external_exports.literal("ANALYTICS"),
+  content: external_exports.object({
+    title: external_exports.string().optional(),
+    // Use the lenient block schema so one malformed block can't sink the whole response.
+    blocks: external_exports.array(blockSchema)
+  }),
+  metadata: responseMetadataSchema.optional()
+});
+var errorResponseSchema = external_exports.object({
+  id: external_exports.string(),
+  type: external_exports.literal("ERROR"),
+  content: external_exports.object({ message: external_exports.string() }),
+  metadata: responseMetadataSchema.optional()
+});
+var aiResponseSchema = external_exports.discriminatedUnion("type", [
+  textResponseSchema,
+  analyticsResponseSchema,
+  errorResponseSchema
+]);
+var makeErrorResponse = (message, id) => ({
+  id: id ?? genId("error"),
+  type: "ERROR",
+  content: { message }
+});
+function parseAiResponse(input) {
+  const result = aiResponseSchema.safeParse(input);
+  if (result.success) return result.data;
+  return makeErrorResponse(
+    "The response could not be displayed (it did not match the expected format)."
+  );
+}
+function safeParseAiResponse(input) {
+  return aiResponseSchema.safeParse(input);
+}
+function parseBlock(input) {
+  return blockSchema.parse(input);
+}
+var progressEventSchema = external_exports.object({
+  phase: progressPhaseSchema,
+  message: external_exports.string().optional(),
+  tool: external_exports.string().optional()
+});
+var responseStartSchema = external_exports.object({
+  id: external_exports.string(),
+  type: responseTypeSchema,
+  metadata: responseMetadataSchema.optional(),
+  title: external_exports.string().optional()
+});
+var contentEventSchema = external_exports.object({
+  format: textFormatSchema.optional(),
+  value: external_exports.string().optional(),
+  message: external_exports.string().optional()
+});
+var responseEndSchema = external_exports.object({
+  status: external_exports.enum(["COMPLETED", "ERROR"])
+});
+var errorEventSchema = external_exports.object({
+  message: external_exports.string().optional()
+});
+function parseSseEvent(eventName, raw) {
+  let json;
+  try {
+    json = raw.length ? JSON.parse(raw) : {};
+  } catch {
+    return { event: "error", data: { message: "Malformed event payload from server." } };
+  }
+  switch (eventName) {
+    case "progress": {
+      const r = progressEventSchema.safeParse(json);
+      return r.success ? { event: "progress", data: r.data } : { event: "progress", data: { phase: "THINKING" } };
+    }
+    case "response_start": {
+      const r = responseStartSchema.safeParse(json);
+      return r.success ? { event: "response_start", data: r.data } : { event: "error", data: { message: "Invalid response_start event." } };
+    }
+    case "content": {
+      const r = contentEventSchema.safeParse(json);
+      return r.success ? { event: "content", data: r.data } : { event: "content", data: {} };
+    }
+    case "block":
+      return { event: "block", data: blockSchema.parse(json) };
+    case "response_end": {
+      const r = responseEndSchema.safeParse(json);
+      return r.success ? { event: "response_end", data: r.data } : { event: "response_end", data: { status: "COMPLETED" } };
+    }
+    case "error":
+    default: {
+      const r = errorEventSchema.safeParse(json);
+      return { event: "error", data: r.success ? r.data : {} };
+    }
+  }
+}
+var initialStreamState = { phase: "idle" };
+function startResponse(data) {
+  const type = data.type;
+  const base = { id: data.id, metadata: data.metadata };
+  switch (type) {
+    case "ANALYTICS":
+      return { ...base, type: "ANALYTICS", content: { title: data.title, blocks: [] } };
+    case "ERROR":
+      return { ...base, type: "ERROR", content: { message: "" } };
+    case "TEXT":
+    default:
+      return { ...base, type: "TEXT", content: { format: "PLAIN_TEXT", value: "" } };
+  }
+}
+function streamReducer(state, event) {
+  switch (event.event) {
+    case "progress":
+      return {
+        ...state,
+        phase: event.data.phase,
+        progressMessage: event.data.message ?? state.progressMessage,
+        tool: event.data.tool
+      };
+    case "response_start":
+      return {
+        ...state,
+        phase: "COMPOSING",
+        tool: void 0,
+        response: startResponse(event.data),
+        error: void 0
+      };
+    case "content": {
+      const response = state.response;
+      if (!response) return state;
+      if (response.type === "TEXT") {
+        return {
+          ...state,
+          response: {
+            ...response,
+            content: {
+              format: event.data.format ?? response.content.format,
+              value: event.data.value ?? response.content.value
+            }
+          }
+        };
+      }
+      if (response.type === "ERROR") {
+        return {
+          ...state,
+          response: {
+            ...response,
+            content: { message: event.data.message ?? response.content.message }
+          }
+        };
+      }
+      return state;
+    }
+    case "block": {
+      const response = state.response;
+      if (!response || response.type !== "ANALYTICS") return state;
+      return {
+        ...state,
+        response: {
+          ...response,
+          content: {
+            ...response.content,
+            blocks: [...response.content.blocks, event.data]
+          }
+        }
+      };
+    }
+    case "response_end": {
+      if (event.data.status === "ERROR") {
+        const message = state.response?.type === "ERROR" && state.response.content.message || state.error || "The request failed.";
+        return { ...state, phase: "error", error: message };
+      }
+      return { ...state, phase: "done", progressMessage: void 0, tool: void 0 };
+    }
+    case "error":
+      return {
+        ...state,
+        phase: "error",
+        error: event.data.message ?? "The stream encountered a fatal error."
+      };
+    default:
+      return state;
+  }
+}
+
+// src/actions.ts
+var noopAction = () => {
+};
+function Markdown({ children, className }) {
+  return /* @__PURE__ */ jsx("div", { className: className ?? "rk-markdown", children: /* @__PURE__ */ jsx(
+    ReactMarkdown,
+    {
+      remarkPlugins: [remarkGfm],
+      components: {
+        a: ({ node: _node, ...props }) => /* @__PURE__ */ jsx("a", { ...props, target: "_blank", rel: "noopener noreferrer" })
+      },
+      children
+    }
+  ) });
+}
+function TextBlock({ block }) {
+  return /* @__PURE__ */ jsx("div", { className: "rk-block rk-block-text", children: /* @__PURE__ */ jsx(Markdown, { children: block.content }) });
+}
+var TREND_GLYPH = { UP: "\u25B2", DOWN: "\u25BC", STABLE: "\u2192" };
+function KpiBlock({ block }) {
+  const items = Array.isArray(block.items) ? block.items : [];
+  return /* @__PURE__ */ jsxs("section", { className: "rk-block rk-block-kpi", "aria-label": block.title ?? "KPIs", children: [
+    block.title ? /* @__PURE__ */ jsx("h3", { className: "rk-block-title", children: block.title }) : null,
+    /* @__PURE__ */ jsx("div", { className: "rk-kpi-grid", children: items.map((item, i) => {
+      const display = item.formattedValue ?? formatValue(item.value);
+      const trend = item.trend;
+      return /* @__PURE__ */ jsxs("div", { className: "rk-kpi-item", children: [
+        /* @__PURE__ */ jsx("div", { className: "rk-kpi-label", children: item.label }),
+        /* @__PURE__ */ jsx("div", { className: "rk-kpi-value", children: display }),
+        trend || typeof item.percentageChange === "number" ? /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `rk-kpi-trend rk-kpi-trend-${(trend ?? "STABLE").toLowerCase()}`,
+            children: [
+              trend ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: TREND_GLYPH[trend] }) : null,
+              typeof item.percentageChange === "number" ? /* @__PURE__ */ jsxs("span", { children: [
+                item.percentageChange > 0 ? "+" : "",
+                item.percentageChange,
+                "%"
+              ] }) : null
+            ]
+          }
+        ) : null
+      ] }, `${item.label}-${i}`);
+    }) })
+  ] });
+}
+var ChartRenderer = lazy(() => import('./ChartRenderer-URPZESVN.js'));
+function ChartBlock({ block }) {
+  return /* @__PURE__ */ jsxs("section", { className: "rk-block rk-block-chart", children: [
+    block.title ? /* @__PURE__ */ jsx("h3", { className: "rk-block-title", children: block.title }) : null,
+    /* @__PURE__ */ jsx(
+      Suspense,
+      {
+        fallback: /* @__PURE__ */ jsx("div", { className: "rk-chart-placeholder", "aria-busy": "true", children: "Loading chart\u2026" }),
+        children: /* @__PURE__ */ jsx(ChartRenderer, { block })
+      }
+    )
+  ] });
+}
+function TableBlock({ block, onAction }) {
+  const columns = Array.isArray(block.columns) ? block.columns : [];
+  const rows = Array.isArray(block.rows) ? block.rows : [];
+  const download = () => onAction({
+    type: "DOWNLOAD",
+    format: "CSV",
+    filename: `${block.title ?? "table"}.csv`,
+    data: rowsToCsv(columns, rows),
+    blockId: block.id
+  });
+  return /* @__PURE__ */ jsxs("section", { className: "rk-block rk-block-table", children: [
+    /* @__PURE__ */ jsxs("div", { className: "rk-block-header", children: [
+      block.title ? /* @__PURE__ */ jsx("h3", { className: "rk-block-title", children: block.title }) : null,
+      rows.length > 0 ? /* @__PURE__ */ jsx("button", { type: "button", className: "rk-action", onClick: download, children: "Download CSV" }) : null
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "rk-table-scroll", children: [
+      /* @__PURE__ */ jsxs("table", { className: "rk-table", children: [
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsx("th", { scope: "col", children: col.label }, col.key)) }) }),
+        /* @__PURE__ */ jsx("tbody", { children: rows.map((row, r) => /* @__PURE__ */ jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsx("td", { children: formatValue(row[col.key]) }, col.key)) }, r)) })
+      ] }),
+      rows.length === 0 ? /* @__PURE__ */ jsx("p", { className: "rk-empty", children: "No data." }) : null
+    ] })
+  ] });
+}
+var SEVERITY_GLYPH = {
+  INFO: "\u2139",
+  SUCCESS: "\u2713",
+  WARNING: "\u26A0",
+  CRITICAL: "\u2715"
+};
+function InsightBlock({ block }) {
+  const severity = ["INFO", "SUCCESS", "WARNING", "CRITICAL"].includes(
+    block.severity
+  ) ? block.severity : "INFO";
+  return /* @__PURE__ */ jsxs(
+    "aside",
+    {
+      className: `rk-block rk-block-insight rk-severity-${severity.toLowerCase()}`,
+      role: "note",
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "rk-insight-icon", "aria-hidden": true, children: SEVERITY_GLYPH[severity] }),
+        /* @__PURE__ */ jsxs("div", { className: "rk-insight-body", children: [
+          /* @__PURE__ */ jsx("div", { className: "rk-insight-title", children: block.title }),
+          /* @__PURE__ */ jsx("div", { className: "rk-insight-desc", children: block.description })
+        ] })
+      ]
+    }
   );
 }
-function safeParseAiResponse(input) {
-  return aiResponseSchema.safeParse(input);
+function RecommendationBlock({
+  block
+}) {
+  const items = Array.isArray(block.items) ? block.items : [];
+  return /* @__PURE__ */ jsx("section", { className: "rk-block rk-block-recommendation", children: /* @__PURE__ */ jsx("ul", { className: "rk-recommendation-list", children: items.map((item, i) => /* @__PURE__ */ jsxs("li", { className: "rk-recommendation-item", children: [
+    /* @__PURE__ */ jsx("div", { className: "rk-recommendation-title", children: item.title }),
+    /* @__PURE__ */ jsx("div", { className: "rk-recommendation-desc", children: item.description })
+  ] }, `${item.title}-${i}`)) }) });
 }
-function parseBlock(input) {
-  return blockSchema.parse(input);
+function FilterControl({ filter }) {
+  const options = Array.isArray(filter.options) ? filter.options : [];
+  switch (filter.filterType) {
+    case "SELECT":
+    case "MULTI_SELECT":
+      return /* @__PURE__ */ jsx("select", { disabled: true, multiple: filter.filterType === "MULTI_SELECT", "aria-label": filter.label, children: options.map((o) => /* @__PURE__ */ jsx("option", { value: o, children: o }, o)) });
+    case "DATE_RANGE":
+      return /* @__PURE__ */ jsxs("span", { className: "rk-filter-range", children: [
+        /* @__PURE__ */ jsx("input", { type: "date", disabled: true, "aria-label": `${filter.label} from` }),
+        /* @__PURE__ */ jsx("input", { type: "date", disabled: true, "aria-label": `${filter.label} to` })
+      ] });
+    case "NUMBER_RANGE":
+      return /* @__PURE__ */ jsxs("span", { className: "rk-filter-range", children: [
+        /* @__PURE__ */ jsx("input", { type: "number", disabled: true, "aria-label": `${filter.label} min`, placeholder: "min" }),
+        /* @__PURE__ */ jsx("input", { type: "number", disabled: true, "aria-label": `${filter.label} max`, placeholder: "max" })
+      ] });
+    case "SEARCH":
+    default:
+      return /* @__PURE__ */ jsx("input", { type: "search", disabled: true, "aria-label": filter.label, placeholder: "Search\u2026" });
+  }
+}
+function FilterBlock({ block }) {
+  const filters = Array.isArray(block.filters) ? block.filters : [];
+  return /* @__PURE__ */ jsx("section", { className: "rk-block rk-block-filter", "aria-label": "Filters (read-only)", children: /* @__PURE__ */ jsx("div", { className: "rk-filter-row", children: filters.map((filter, i) => /* @__PURE__ */ jsxs("label", { className: "rk-filter", children: [
+    /* @__PURE__ */ jsx("span", { className: "rk-filter-label", children: filter.label }),
+    /* @__PURE__ */ jsx(FilterControl, { filter })
+  ] }, `${filter.field}-${i}`)) }) });
+}
+function FallbackBlock({ block }) {
+  const type = typeof block?.type === "string" ? block.type : "unknown";
+  return /* @__PURE__ */ jsxs("div", { className: "rk-block rk-block-fallback", role: "note", children: [
+    /* @__PURE__ */ jsxs("div", { className: "rk-fallback-label", children: [
+      "Unsupported block: ",
+      type
+    ] }),
+    isDev() ? /* @__PURE__ */ jsxs("details", { className: "rk-fallback-raw", children: [
+      /* @__PURE__ */ jsx("summary", { children: "Raw payload (dev only)" }),
+      /* @__PURE__ */ jsx("pre", { children: safeStringify(block) })
+    ] }) : null
+  ] });
 }
-var progressEventSchema = external_exports.object({
-  phase: progressPhaseSchema,
-  message: external_exports.string().optional(),
-  tool: external_exports.string().optional()
-});
-var responseStartSchema = external_exports.object({
-  id: external_exports.string(),
-  type: responseTypeSchema,
-  metadata: responseMetadataSchema.optional(),
-  title: external_exports.string().optional()
-});
-var contentEventSchema = external_exports.object({
-  format: textFormatSchema.optional(),
-  value: external_exports.string().optional(),
-  message: external_exports.string().optional()
-});
-var responseEndSchema = external_exports.object({
-  status: external_exports.enum(["COMPLETED", "ERROR"])
-});
-var errorEventSchema = external_exports.object({
-  message: external_exports.string().optional()
-});
-function parseSseEvent(eventName, raw) {
-  let json;
+function safeStringify(value) {
   try {
-    json = raw.length ? JSON.parse(raw) : {};
+    return JSON.stringify(value, null, 2);
   } catch {
-    return { event: "error", data: { message: "Malformed event payload from server." } };
-  }
-  switch (eventName) {
-    case "progress": {
-      const r = progressEventSchema.safeParse(json);
-      return r.success ? { event: "progress", data: r.data } : { event: "progress", data: { phase: "THINKING" } };
-    }
-    case "response_start": {
-      const r = responseStartSchema.safeParse(json);
-      return r.success ? { event: "response_start", data: r.data } : { event: "error", data: { message: "Invalid response_start event." } };
-    }
-    case "content": {
-      const r = contentEventSchema.safeParse(json);
-      return r.success ? { event: "content", data: r.data } : { event: "content", data: {} };
-    }
-    case "block":
-      return { event: "block", data: blockSchema.parse(json) };
-    case "response_end": {
-      const r = responseEndSchema.safeParse(json);
-      return r.success ? { event: "response_end", data: r.data } : { event: "response_end", data: { status: "COMPLETED" } };
-    }
-    case "error":
-    default: {
-      const r = errorEventSchema.safeParse(json);
-      return { event: "error", data: r.success ? r.data : {} };
-    }
+    return String(value);
   }
 }
-var initialStreamState = { phase: "idle" };
-function startResponse(data) {
-  const type = data.type;
-  const base = { id: data.id, metadata: data.metadata };
-  switch (type) {
-    case "ANALYTICS":
-      return { ...base, type: "ANALYTICS", content: { title: data.title, blocks: [] } };
-    case "ERROR":
-      return { ...base, type: "ERROR", content: { message: "" } };
-    case "TEXT":
-    default:
-      return { ...base, type: "TEXT", content: { format: "PLAIN_TEXT", value: "" } };
+
+// src/blocks/index.ts
+var defaultBlockComponents = {
+  TEXT: TextBlock,
+  KPI: KpiBlock,
+  CHART: ChartBlock,
+  TABLE: TableBlock,
+  INSIGHT: InsightBlock,
+  RECOMMENDATION: RecommendationBlock,
+  FILTER: FilterBlock
+};
+
+// src/registry.ts
+var globalRegistry = /* @__PURE__ */ new Map();
+function registerBlock(options) {
+  if (!options.override && globalRegistry.has(options.type)) return;
+  globalRegistry.set(options.type, options.component);
+}
+function unregisterBlock(type) {
+  globalRegistry.delete(type);
+}
+function registeredBlockTypes() {
+  return [...globalRegistry.keys()];
+}
+function resolveBlockComponent(type, overrides) {
+  return overrides?.[type] ?? globalRegistry.get(type) ?? defaultBlockComponents[type] ?? FallbackBlock;
+}
+var ErrorBoundary = class extends Component {
+  constructor() {
+    super(...arguments);
+    this.state = { error: null };
+  }
+  static getDerivedStateFromError(error) {
+    return { error };
+  }
+  componentDidCatch(error, info) {
+    this.props.onError?.(error, info);
+  }
+  render() {
+    if (this.state.error) return this.props.fallback(this.state.error);
+    return this.props.children;
+  }
+};
+function AiRenderer({
+  response,
+  components,
+  onAction = noopAction,
+  className
+}) {
+  const parsed = useMemo(() => parseAiResponse(response), [response]);
+  if (response == null) {
+    return /* @__PURE__ */ jsx(ErrorView, { message: "No response to display." });
   }
+  return /* @__PURE__ */ jsxs("div", { className: className ?? "rk-response", "data-response-type": parsed.type, children: [
+    renderBody(parsed, components, onAction),
+    /* @__PURE__ */ jsx(MetadataFooter, { metadata: parsed.metadata, onAction, responseId: parsed.id })
+  ] });
 }
-function streamReducer(state, event) {
-  switch (event.event) {
-    case "progress":
-      return {
-        ...state,
-        phase: event.data.phase,
-        progressMessage: event.data.message ?? state.progressMessage,
-        tool: event.data.tool
-      };
-    case "response_start":
-      return {
-        ...state,
-        phase: "COMPOSING",
-        tool: void 0,
-        response: startResponse(event.data),
-        error: void 0
-      };
-    case "content": {
-      const response = state.response;
-      if (!response) return state;
-      if (response.type === "TEXT") {
-        return {
-          ...state,
-          response: {
-            ...response,
-            content: {
-              format: event.data.format ?? response.content.format,
-              value: event.data.value ?? response.content.value
-            }
-          }
-        };
-      }
-      if (response.type === "ERROR") {
-        return {
-          ...state,
-          response: {
-            ...response,
-            content: { message: event.data.message ?? response.content.message }
-          }
-        };
-      }
-      return state;
-    }
-    case "block": {
-      const response = state.response;
-      if (!response || response.type !== "ANALYTICS") return state;
-      return {
-        ...state,
-        response: {
-          ...response,
-          content: {
-            ...response.content,
-            blocks: [...response.content.blocks, event.data]
-          }
-        }
-      };
+function renderBody(response, components, onAction) {
+  switch (response.type) {
+    case "TEXT": {
+      const { format, value } = response.content;
+      return format === "MARKDOWN" ? /* @__PURE__ */ jsx(Markdown, { children: value }) : /* @__PURE__ */ jsx("p", { className: "rk-text-plain", children: value });
     }
-    case "response_end": {
-      if (event.data.status === "ERROR") {
-        const message = state.response?.type === "ERROR" && state.response.content.message || state.error || "The request failed.";
-        return { ...state, phase: "error", error: message };
-      }
-      return { ...state, phase: "done", progressMessage: void 0, tool: void 0 };
+    case "ANALYTICS": {
+      const { title, blocks } = response.content;
+      const list = Array.isArray(blocks) ? blocks : [];
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        title ? /* @__PURE__ */ jsx("h2", { className: "rk-response-title", children: title }) : null,
+        /* @__PURE__ */ jsx("div", { className: "rk-blocks", children: list.map((block, i) => /* @__PURE__ */ jsx(
+          BlockSlot,
+          {
+            block,
+            components,
+            onAction
+          },
+          blockKey(block, i)
+        )) })
+      ] });
     }
-    case "error":
-      return {
-        ...state,
-        phase: "error",
-        error: event.data.message ?? "The stream encountered a fatal error."
-      };
+    case "ERROR":
+      return /* @__PURE__ */ jsx(ErrorView, { message: response.content.message });
     default:
-      return state;
+      return /* @__PURE__ */ jsx(ErrorView, { message: "Unsupported response type." });
   }
 }
+function BlockSlot({
+  block,
+  components,
+  onAction
+}) {
+  const type = typeof block?.type === "string" ? block.type : "UNKNOWN";
+  const Component2 = resolveBlockComponent(type, components);
+  return /* @__PURE__ */ jsx(ErrorBoundary, { fallback: () => /* @__PURE__ */ jsx(FallbackBlock, { block, onAction }), children: /* @__PURE__ */ jsx(Component2, { block, onAction }) });
+}
+function ErrorView({ message }) {
+  return /* @__PURE__ */ jsxs("div", { className: "rk-block rk-error", role: "alert", children: [
+    /* @__PURE__ */ jsx("span", { className: "rk-error-icon", "aria-hidden": true, children: "\u2715" }),
+    /* @__PURE__ */ jsx("span", { className: "rk-error-message", children: message })
+  ] });
+}
+function MetadataFooter({
+  metadata,
+  onAction,
+  responseId
+}) {
+  if (!metadata) return null;
+  const { generatedAt, dataSource, refreshable } = metadata;
+  if (!generatedAt && !dataSource && !refreshable) return null;
+  return /* @__PURE__ */ jsxs("footer", { className: "rk-meta", children: [
+    generatedAt ? /* @__PURE__ */ jsx("span", { className: "rk-meta-time", children: formatTime(generatedAt) }) : null,
+    dataSource ? /* @__PURE__ */ jsx("span", { className: "rk-meta-source", children: dataSource }) : null,
+    refreshable ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "rk-action rk-meta-refresh",
+        onClick: () => onAction({ type: "REFRESH", responseId }),
+        children: "Refresh"
+      }
+    ) : null
+  ] });
+}
+function formatTime(iso) {
+  const d = new Date(iso);
+  return Number.isNaN(d.getTime()) ? iso : d.toLocaleString();
+}
+function blockKey(block, index) {
+  return typeof block?.id === "string" && block.id ? block.id : `block-${index}`;
+}
 
 // src/sse.ts
 var trimTrailingSlash = (s) => s.replace(/\/+$/, "");