@seed-ship/mcp-ui-solid 1.0.3 → 1.0.4

package/dist/components/UIResourceRenderer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UIResourceRenderer.cjs","sources":["../../src/components/UIResourceRenderer.tsx"],"sourcesContent":["/**\n * UI Resource Renderer Component\n * Phase 0: Foundation with iframe sandbox and composite grid support\n *\n * Security features:\n * - Sandboxed iframes for untrusted content\n * - CSP enforcement via middleware\n * - XSS prevention with DOMPurify\n * - Domain whitelist validation\n *\n * Performance:\n * - Lazy loading with Intersection Observer\n * - Render timeout enforcement\n * - Error boundaries for isolation\n */\n\nimport { Component, createSignal, onMount, Show, For } from 'solid-js'\nimport type { UIComponent, UILayout, RendererError, ComponentType } from '../types'\nimport { validateComponent, DEFAULT_RESOURCE_LIMITS } from '../services/validation'\nimport { GenerativeUIErrorBoundary } from './GenerativeUIErrorBoundary'\n\n/**\n * Props for UIResourceRenderer\n */\nexport interface UIResourceRendererProps {\n  /**\n   * Single component or full layout to render\n   */\n  content: UIComponent | UILayout\n\n  /**\n   * Lazy loading (default: true)\n   */\n  lazyLoad?: boolean\n\n  /**\n   * Error callback\n   */\n  onError?: (error: RendererError) => void\n\n  /**\n   * Custom CSS class\n   */\n  class?: string\n}\n\n/**\n * Render a single chart component in a sandboxed iframe\n */\nfunction ChartRenderer(props: {\n  component: UIComponent\n  onError?: (error: RendererError) => void\n}) {\n  const [iframeUrl, setIframeUrl] = createSignal<string>()\n  const [isLoading, setIsLoading] = createSignal(true)\n  const [error, setError] = createSignal<string>()\n\n  onMount(() => {\n    const chartParams = props.component.params as any\n\n    // Build Quickchart URL\n    const chartConfig = {\n      type: chartParams.type,\n      data: chartParams.data,\n      options: {\n        ...chartParams.options,\n        responsive: true,\n        maintainAspectRatio: false,\n      },\n    }\n\n    // Encode chart configuration for Quickchart API\n    const configStr = encodeURIComponent(JSON.stringify(chartConfig))\n    const url = `https://quickchart.io/chart?c=${configStr}&width=500&height=300&devicePixelRatio=2`\n\n    // Validate domain (should always pass for quickchart.io)\n    setIframeUrl(url)\n    setIsLoading(false)\n  })\n\n  return (\n    <div class=\"relative w-full h-full min-h-[300px] bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden\">\n      <Show when={isLoading()}>\n        <div class=\"absolute inset-0 flex items-center justify-center\">\n          <div class=\"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600\" />\n        </div>\n      </Show>\n\n      <Show when={error()}>\n        <div class=\"absolute inset-0 flex items-center justify-center p-4\">\n          <div class=\"text-center\">\n            <p class=\"text-red-600 dark:text-red-400 text-sm font-medium\">Chart Error</p>\n            <p class=\"text-gray-600 dark:text-gray-400 text-xs mt-1\">{error()}</p>\n          </div>\n        </div>\n      </Show>\n\n      <Show when={iframeUrl() && !error()}>\n        <div class=\"w-full h-full p-4\">\n          <Show when={(props.component.params as any).title}>\n            <h3 class=\"text-sm font-semibold text-gray-900 dark:text-white mb-3\">\n              {(props.component.params as any).title}\n            </h3>\n          </Show>\n          <div class=\"w-full h-full\">\n            <img\n              src={iframeUrl()}\n              alt=\"Chart visualization\"\n              class=\"w-full h-auto max-h-[300px] object-contain\"\n              onError={() => {\n                setError('Failed to load chart')\n                props.onError?.({\n                  type: 'render',\n                  message: 'Chart rendering failed',\n                  componentId: props.component.id,\n                })\n              }}\n            />\n          </div>\n        </div>\n      </Show>\n    </div>\n  )\n}\n\n/**\n * Render a table component\n */\nfunction TableRenderer(props: {\n  component: UIComponent\n  onError?: (error: RendererError) => void\n}) {\n  const tableParams = props.component.params as any\n\n  return (\n    <div class=\"w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden\">\n      <div class=\"p-4\">\n        <Show when={tableParams.title}>\n          <h3 class=\"text-sm font-semibold text-gray-900 dark:text-white mb-3\">\n            {tableParams.title}\n          </h3>\n        </Show>\n\n        <div class=\"overflow-x-auto\">\n          <table class=\"min-w-full divide-y divide-gray-200 dark:divide-gray-700\">\n            <thead class=\"bg-gray-50 dark:bg-gray-900\">\n              <tr>\n                <For each={tableParams.columns}>\n                  {(column: any) => (\n                    <th\n                      scope=\"col\"\n                      class=\"px-4 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider\"\n                      style={column.width ? { width: column.width } : {}}\n                    >\n                      {column.label}\n                    </th>\n                  )}\n                </For>\n              </tr>\n            </thead>\n            <tbody class=\"bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700\">\n              <For each={tableParams.rows.slice(0, DEFAULT_RESOURCE_LIMITS.maxTableRows)}>\n                {(row: any) => (\n                  <tr class=\"hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors\">\n                    <For each={tableParams.columns}>\n                      {(column: any) => (\n                        <td class=\"px-4 py-3 text-sm text-gray-900 dark:text-gray-100 whitespace-nowrap\">\n                          {row[column.key] || '-'}\n                        </td>\n                      )}\n                    </For>\n                  </tr>\n                )}\n              </For>\n            </tbody>\n          </table>\n        </div>\n\n        <Show when={tableParams.pagination}>\n          <div class=\"mt-3 flex items-center justify-between text-xs text-gray-500 dark:text-gray-400\">\n            <span>\n              Showing {tableParams.pagination.currentPage * tableParams.pagination.pageSize + 1} -{' '}\n              {Math.min(\n                (tableParams.pagination.currentPage + 1) * tableParams.pagination.pageSize,\n                tableParams.pagination.totalRows\n              )}{' '}\n              of {tableParams.pagination.totalRows}\n            </span>\n          </div>\n        </Show>\n      </div>\n    </div>\n  )\n}\n\n/**\n * Render a metric card component\n */\nfunction MetricRenderer(props: { component: UIComponent }) {\n  const metricParams = props.component.params as any\n\n  return (\n    <div class=\"w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-4\">\n      <div class=\"flex flex-col h-full justify-between\">\n        <div>\n          <p class=\"text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wide\">\n            {metricParams.title}\n          </p>\n          <div class=\"mt-2 flex items-baseline\">\n            <p class=\"text-2xl font-semibold text-gray-900 dark:text-white\">{metricParams.value}</p>\n            <Show when={metricParams.unit}>\n              <span class=\"ml-2 text-sm font-medium text-gray-500 dark:text-gray-400\">\n                {metricParams.unit}\n              </span>\n            </Show>\n          </div>\n        </div>\n\n        <Show when={metricParams.trend}>\n          <div class=\"mt-3 flex items-center\">\n            <span\n              class={`text-sm font-medium ${\n                metricParams.trend.direction === 'up'\n                  ? 'text-green-600 dark:text-green-400'\n                  : metricParams.trend.direction === 'down'\n                    ? 'text-red-600 dark:text-red-400'\n                    : 'text-gray-600 dark:text-gray-400'\n              }`}\n            >\n              {metricParams.trend.direction === 'up'\n                ? '�'\n                : metricParams.trend.direction === 'down'\n                  ? '�'\n                  : '�'}{' '}\n              {Math.abs(metricParams.trend.value)}%\n            </span>\n          </div>\n        </Show>\n\n        <Show when={metricParams.subtitle}>\n          <p class=\"mt-2 text-xs text-gray-500 dark:text-gray-400\">{metricParams.subtitle}</p>\n        </Show>\n      </div>\n    </div>\n  )\n}\n\n/**\n * Render a text component (with optional markdown)\n */\nfunction TextRenderer(props: { component: UIComponent }) {\n  const textParams = props.component.params as any\n\n  return (\n    <div class=\"w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-4\">\n      <div\n        class={`prose prose-sm dark:prose-invert max-w-none ${textParams.className || ''}`}\n        innerHTML={textParams.content} // Note: Should be sanitized at generation time\n      />\n    </div>\n  )\n}\n\n/**\n * Render a single component with error boundary\n */\nfunction ComponentRenderer(props: {\n  component: UIComponent\n  onError?: (error: RendererError) => void\n}) {\n  // Validate component before rendering\n  const validation = validateComponent(props.component)\n  if (!validation.valid) {\n    props.onError?.({\n      type: 'validation',\n      message: 'Component validation failed',\n      componentId: props.component.id,\n      details: validation.errors,\n    })\n\n    return (\n      <div class=\"w-full h-full bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg p-4\">\n        <p class=\"text-sm font-medium text-red-900 dark:text-red-100\">Validation Error</p>\n        <p class=\"text-xs text-red-700 dark:text-red-300 mt-1\">\n          {validation.errors?.[0]?.message || 'Unknown validation error'}\n        </p>\n      </div>\n    )\n  }\n\n  // Render based on component type with enhanced error boundary\n  return (\n    <GenerativeUIErrorBoundary\n      componentId={props.component.id}\n      componentType={props.component.type}\n      onError={props.onError}\n      allowRetry={true}\n    >\n      <Show when={props.component.type === 'chart'}>\n        <ChartRenderer component={props.component} onError={props.onError} />\n      </Show>\n      <Show when={props.component.type === 'table'}>\n        <TableRenderer component={props.component} onError={props.onError} />\n      </Show>\n      <Show when={props.component.type === 'metric'}>\n        <MetricRenderer component={props.component} />\n      </Show>\n      <Show when={props.component.type === 'text'}>\n        <TextRenderer component={props.component} />\n      </Show>\n    </GenerativeUIErrorBoundary>\n  )\n}\n\n/**\n * Main UIResourceRenderer component\n */\nexport const UIResourceRenderer: Component<UIResourceRendererProps> = (props) => {\n  const layout = () => {\n    // Convert single component to layout\n    if ('type' in props.content) {\n      return {\n        id: 'single-component',\n        components: [props.content as UIComponent],\n        grid: {\n          columns: 12,\n          gap: '1rem',\n        },\n      } as UILayout\n    }\n    return props.content as UILayout\n  }\n\n  // Grid position to CSS Grid styles\n  const getGridStyles = (component: UIComponent) => {\n    const { colStart, colSpan, rowStart, rowSpan = 1 } = component.position\n\n    return {\n      'grid-column': `${colStart} / span ${colSpan}`,\n      'grid-row': rowStart ? `${rowStart} / span ${rowSpan}` : 'auto',\n    }\n  }\n\n  return (\n    <div class={`w-full ${props.class || ''}`}>\n      <div\n        class=\"grid gap-4\"\n        style={{\n          'grid-template-columns': `repeat(${layout().grid.columns}, 1fr)`,\n          gap: layout().grid.gap,\n        }}\n      >\n        <For each={layout().components}>\n          {(component) => (\n            <div style={getGridStyles(component)}>\n              <ComponentRenderer component={component} onError={props.onError} />\n            </div>\n          )}\n        </For>\n      </div>\n    </div>\n  )\n}\n"],"names":["ChartRenderer","props","iframeUrl","setIframeUrl","createSignal","isLoading","setIsLoading","error","setError","onMount","chartParams","component","params","chartConfig","type","data","options","responsive","maintainAspectRatio","configStr","encodeURIComponent","JSON","stringify","url","_el$","_tmpl$5","_$insert","_$createComponent","Show","when","children","_tmpl$","_el$3","_tmpl$2","_el$4","firstChild","_el$5","_el$6","nextSibling","_$memo","_el$7","_tmpl$4","_el$9","_el$0","title","_el$8","_tmpl$3","addEventListener","onError","message","componentId","id","_$effect","_$setAttribute","TableRenderer","tableParams","_el$1","_tmpl$7","_el$10","_el$12","_el$13","_el$14","_el$15","_el$16","_el$11","For","each","columns","column","_el$26","_tmpl$8","label","_$p","_$style","width","rows","slice","DEFAULT_RESOURCE_LIMITS","maxTableRows","row","_el$27","_tmpl$9","_el$28","_tmpl$0","key","pagination","_el$17","_tmpl$6","_el$18","_el$19","_el$24","_el$20","_el$25","currentPage","pageSize","Math","min","totalRows","MetricRenderer","metricParams","_el$29","_tmpl$12","_el$30","_el$31","_el$32","_el$33","_el$34","value","unit","_el$35","_tmpl$1","trend","_el$36","_tmpl$10","_el$37","_el$38","_el$40","_c$","direction","abs","_$className","subtitle","_el$41","_tmpl$11","TextRenderer","textParams","_el$42","_tmpl$13","_el$43","_p$","_v$","className","_v$2","content","e","t","innerHTML","undefined","ComponentRenderer","validation","validateComponent","valid","details","errors","_el$44","_tmpl$14","_el$45","_el$46","GenerativeUIErrorBoundary","componentType","allowRetry","UIResourceRenderer","layout","components","grid","gap","getGridStyles","colStart","colSpan","rowStart","rowSpan","position","_el$47","_tmpl$15","_el$48","_el$49","_tmpl$16","_v$3","class","_v$4","_v$5","_$setStyleProperty","a"],"mappings":"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"}

package/dist/components/UIResourceRenderer.js

@@ -0,0 +1,347 @@
+import { template, insert, createComponent, effect, style, className, setStyleProperty, setAttribute, memo } from "solid-js/web";
+import { For, Show, createSignal, onMount } from "solid-js";
+import { validateComponent, DEFAULT_RESOURCE_LIMITS } from "../services/validation.js";
+import { GenerativeUIErrorBoundary } from "./GenerativeUIErrorBoundary.js";
+var _tmpl$ = /* @__PURE__ */ template(`<div class="absolute inset-0 flex items-center justify-center"><div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600">`), _tmpl$2 = /* @__PURE__ */ template(`<div class="absolute inset-0 flex items-center justify-center p-4"><div class=text-center><p class="text-red-600 dark:text-red-400 text-sm font-medium">Chart Error</p><p class="text-gray-600 dark:text-gray-400 text-xs mt-1">`), _tmpl$3 = /* @__PURE__ */ template(`<h3 class="text-sm font-semibold text-gray-900 dark:text-white mb-3">`), _tmpl$4 = /* @__PURE__ */ template(`<div class="w-full h-full p-4"><div class="w-full h-full"><img alt="Chart visualization"class="w-full h-auto max-h-[300px] object-contain">`), _tmpl$5 = /* @__PURE__ */ template(`<div class="relative w-full h-full min-h-[300px] bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden">`), _tmpl$6 = /* @__PURE__ */ template(`<div class="mt-3 flex items-center justify-between text-xs text-gray-500 dark:text-gray-400"><span>Showing <!> - <!> of `), _tmpl$7 = /* @__PURE__ */ template(`<div class="w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden"><div class=p-4><div class=overflow-x-auto><table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700"><thead class="bg-gray-50 dark:bg-gray-900"><tr></tr></thead><tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">`), _tmpl$8 = /* @__PURE__ */ template(`<th scope=col class="px-4 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">`), _tmpl$9 = /* @__PURE__ */ template(`<tr class="hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">`), _tmpl$0 = /* @__PURE__ */ template(`<td class="px-4 py-3 text-sm text-gray-900 dark:text-gray-100 whitespace-nowrap">`), _tmpl$1 = /* @__PURE__ */ template(`<span class="ml-2 text-sm font-medium text-gray-500 dark:text-gray-400">`), _tmpl$10 = /* @__PURE__ */ template(`<div class="mt-3 flex items-center"><span> <!>%`), _tmpl$11 = /* @__PURE__ */ template(`<p class="mt-2 text-xs text-gray-500 dark:text-gray-400">`), _tmpl$12 = /* @__PURE__ */ template(`<div class="w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-4"><div class="flex flex-col h-full justify-between"><div><p class="text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wide"></p><div class="mt-2 flex items-baseline"><p class="text-2xl font-semibold text-gray-900 dark:text-white">`), _tmpl$13 = /* @__PURE__ */ template(`<div class="w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-4"><div>`), _tmpl$14 = /* @__PURE__ */ template(`<div class="w-full h-full bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg p-4"><p class="text-sm font-medium text-red-900 dark:text-red-100">Validation Error</p><p class="text-xs text-red-700 dark:text-red-300 mt-1">`), _tmpl$15 = /* @__PURE__ */ template(`<div><div class="grid gap-4">`), _tmpl$16 = /* @__PURE__ */ template(`<div>`);
+function ChartRenderer(props) {
+  const [iframeUrl, setIframeUrl] = createSignal();
+  const [isLoading, setIsLoading] = createSignal(true);
+  const [error, setError] = createSignal();
+  onMount(() => {
+    const chartParams = props.component.params;
+    const chartConfig = {
+      type: chartParams.type,
+      data: chartParams.data,
+      options: {
+        ...chartParams.options,
+        responsive: true,
+        maintainAspectRatio: false
+      }
+    };
+    const configStr = encodeURIComponent(JSON.stringify(chartConfig));
+    const url = `https://quickchart.io/chart?c=${configStr}&width=500&height=300&devicePixelRatio=2`;
+    setIframeUrl(url);
+    setIsLoading(false);
+  });
+  return (() => {
+    var _el$ = _tmpl$5();
+    insert(_el$, createComponent(Show, {
+      get when() {
+        return isLoading();
+      },
+      get children() {
+        return _tmpl$();
+      }
+    }), null);
+    insert(_el$, createComponent(Show, {
+      get when() {
+        return error();
+      },
+      get children() {
+        var _el$3 = _tmpl$2(), _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$5.nextSibling;
+        insert(_el$6, error);
+        return _el$3;
+      }
+    }), null);
+    insert(_el$, createComponent(Show, {
+      get when() {
+        return memo(() => !!iframeUrl())() && !error();
+      },
+      get children() {
+        var _el$7 = _tmpl$4(), _el$9 = _el$7.firstChild, _el$0 = _el$9.firstChild;
+        insert(_el$7, createComponent(Show, {
+          get when() {
+            return props.component.params.title;
+          },
+          get children() {
+            var _el$8 = _tmpl$3();
+            insert(_el$8, () => props.component.params.title);
+            return _el$8;
+          }
+        }), _el$9);
+        _el$0.addEventListener("error", () => {
+          var _a;
+          setError("Failed to load chart");
+          (_a = props.onError) == null ? void 0 : _a.call(props, {
+            type: "render",
+            message: "Chart rendering failed",
+            componentId: props.component.id
+          });
+        });
+        effect(() => setAttribute(_el$0, "src", iframeUrl()));
+        return _el$7;
+      }
+    }), null);
+    return _el$;
+  })();
+}
+function TableRenderer(props) {
+  const tableParams = props.component.params;
+  return (() => {
+    var _el$1 = _tmpl$7(), _el$10 = _el$1.firstChild, _el$12 = _el$10.firstChild, _el$13 = _el$12.firstChild, _el$14 = _el$13.firstChild, _el$15 = _el$14.firstChild, _el$16 = _el$14.nextSibling;
+    insert(_el$10, createComponent(Show, {
+      get when() {
+        return tableParams.title;
+      },
+      get children() {
+        var _el$11 = _tmpl$3();
+        insert(_el$11, () => tableParams.title);
+        return _el$11;
+      }
+    }), _el$12);
+    insert(_el$15, createComponent(For, {
+      get each() {
+        return tableParams.columns;
+      },
+      children: (column) => (() => {
+        var _el$26 = _tmpl$8();
+        insert(_el$26, () => column.label);
+        effect((_$p) => style(_el$26, column.width ? {
+          width: column.width
+        } : {}, _$p));
+        return _el$26;
+      })()
+    }));
+    insert(_el$16, createComponent(For, {
+      get each() {
+        return tableParams.rows.slice(0, DEFAULT_RESOURCE_LIMITS.maxTableRows);
+      },
+      children: (row) => (() => {
+        var _el$27 = _tmpl$9();
+        insert(_el$27, createComponent(For, {
+          get each() {
+            return tableParams.columns;
+          },
+          children: (column) => (() => {
+            var _el$28 = _tmpl$0();
+            insert(_el$28, () => row[column.key] || "-");
+            return _el$28;
+          })()
+        }));
+        return _el$27;
+      })()
+    }));
+    insert(_el$10, createComponent(Show, {
+      get when() {
+        return tableParams.pagination;
+      },
+      get children() {
+        var _el$17 = _tmpl$6(), _el$18 = _el$17.firstChild, _el$19 = _el$18.firstChild, _el$24 = _el$19.nextSibling, _el$20 = _el$24.nextSibling, _el$25 = _el$20.nextSibling;
+        _el$25.nextSibling;
+        insert(_el$18, () => tableParams.pagination.currentPage * tableParams.pagination.pageSize + 1, _el$24);
+        insert(_el$18, () => Math.min((tableParams.pagination.currentPage + 1) * tableParams.pagination.pageSize, tableParams.pagination.totalRows), _el$25);
+        insert(_el$18, () => tableParams.pagination.totalRows, null);
+        return _el$17;
+      }
+    }), null);
+    return _el$1;
+  })();
+}
+function MetricRenderer(props) {
+  const metricParams = props.component.params;
+  return (() => {
+    var _el$29 = _tmpl$12(), _el$30 = _el$29.firstChild, _el$31 = _el$30.firstChild, _el$32 = _el$31.firstChild, _el$33 = _el$32.nextSibling, _el$34 = _el$33.firstChild;
+    insert(_el$32, () => metricParams.title);
+    insert(_el$34, () => metricParams.value);
+    insert(_el$33, createComponent(Show, {
+      get when() {
+        return metricParams.unit;
+      },
+      get children() {
+        var _el$35 = _tmpl$1();
+        insert(_el$35, () => metricParams.unit);
+        return _el$35;
+      }
+    }), null);
+    insert(_el$30, createComponent(Show, {
+      get when() {
+        return metricParams.trend;
+      },
+      get children() {
+        var _el$36 = _tmpl$10(), _el$37 = _el$36.firstChild, _el$38 = _el$37.firstChild, _el$40 = _el$38.nextSibling;
+        _el$40.nextSibling;
+        insert(_el$37, (() => {
+          var _c$ = memo(() => metricParams.trend.direction === "up");
+          return () => _c$() ? "�" : metricParams.trend.direction === "down" ? "�" : "�";
+        })(), _el$38);
+        insert(_el$37, () => Math.abs(metricParams.trend.value), _el$40);
+        effect(() => className(_el$37, `text-sm font-medium ${metricParams.trend.direction === "up" ? "text-green-600 dark:text-green-400" : metricParams.trend.direction === "down" ? "text-red-600 dark:text-red-400" : "text-gray-600 dark:text-gray-400"}`));
+        return _el$36;
+      }
+    }), null);
+    insert(_el$30, createComponent(Show, {
+      get when() {
+        return metricParams.subtitle;
+      },
+      get children() {
+        var _el$41 = _tmpl$11();
+        insert(_el$41, () => metricParams.subtitle);
+        return _el$41;
+      }
+    }), null);
+    return _el$29;
+  })();
+}
+function TextRenderer(props) {
+  const textParams = props.component.params;
+  return (() => {
+    var _el$42 = _tmpl$13(), _el$43 = _el$42.firstChild;
+    effect((_p$) => {
+      var _v$ = `prose prose-sm dark:prose-invert max-w-none ${textParams.className || ""}`, _v$2 = textParams.content;
+      _v$ !== _p$.e && className(_el$43, _p$.e = _v$);
+      _v$2 !== _p$.t && (_el$43.innerHTML = _p$.t = _v$2);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0
+    });
+    return _el$42;
+  })();
+}
+function ComponentRenderer(props) {
+  var _a;
+  const validation = validateComponent(props.component);
+  if (!validation.valid) {
+    (_a = props.onError) == null ? void 0 : _a.call(props, {
+      type: "validation",
+      message: "Component validation failed",
+      componentId: props.component.id,
+      details: validation.errors
+    });
+    return (() => {
+      var _el$44 = _tmpl$14(), _el$45 = _el$44.firstChild, _el$46 = _el$45.nextSibling;
+      insert(_el$46, () => {
+        var _a2, _b;
+        return ((_b = (_a2 = validation.errors) == null ? void 0 : _a2[0]) == null ? void 0 : _b.message) || "Unknown validation error";
+      });
+      return _el$44;
+    })();
+  }
+  return createComponent(GenerativeUIErrorBoundary, {
+    get componentId() {
+      return props.component.id;
+    },
+    get componentType() {
+      return props.component.type;
+    },
+    get onError() {
+      return props.onError;
+    },
+    allowRetry: true,
+    get children() {
+      return [createComponent(Show, {
+        get when() {
+          return props.component.type === "chart";
+        },
+        get children() {
+          return createComponent(ChartRenderer, {
+            get component() {
+              return props.component;
+            },
+            get onError() {
+              return props.onError;
+            }
+          });
+        }
+      }), createComponent(Show, {
+        get when() {
+          return props.component.type === "table";
+        },
+        get children() {
+          return createComponent(TableRenderer, {
+            get component() {
+              return props.component;
+            },
+            get onError() {
+              return props.onError;
+            }
+          });
+        }
+      }), createComponent(Show, {
+        get when() {
+          return props.component.type === "metric";
+        },
+        get children() {
+          return createComponent(MetricRenderer, {
+            get component() {
+              return props.component;
+            }
+          });
+        }
+      }), createComponent(Show, {
+        get when() {
+          return props.component.type === "text";
+        },
+        get children() {
+          return createComponent(TextRenderer, {
+            get component() {
+              return props.component;
+            }
+          });
+        }
+      })];
+    }
+  });
+}
+const UIResourceRenderer = (props) => {
+  const layout = () => {
+    if ("type" in props.content) {
+      return {
+        id: "single-component",
+        components: [props.content],
+        grid: {
+          columns: 12,
+          gap: "1rem"
+        }
+      };
+    }
+    return props.content;
+  };
+  const getGridStyles = (component) => {
+    const {
+      colStart,
+      colSpan,
+      rowStart,
+      rowSpan = 1
+    } = component.position;
+    return {
+      "grid-column": `${colStart} / span ${colSpan}`,
+      "grid-row": rowStart ? `${rowStart} / span ${rowSpan}` : "auto"
+    };
+  };
+  return (() => {
+    var _el$47 = _tmpl$15(), _el$48 = _el$47.firstChild;
+    insert(_el$48, createComponent(For, {
+      get each() {
+        return layout().components;
+      },
+      children: (component) => (() => {
+        var _el$49 = _tmpl$16();
+        insert(_el$49, createComponent(ComponentRenderer, {
+          component,
+          get onError() {
+            return props.onError;
+          }
+        }));
+        effect((_$p) => style(_el$49, getGridStyles(component), _$p));
+        return _el$49;
+      })()
+    }));
+    effect((_p$) => {
+      var _v$3 = `w-full ${props.class || ""}`, _v$4 = `repeat(${layout().grid.columns}, 1fr)`, _v$5 = layout().grid.gap;
+      _v$3 !== _p$.e && className(_el$47, _p$.e = _v$3);
+      _v$4 !== _p$.t && setStyleProperty(_el$48, "grid-template-columns", _p$.t = _v$4);
+      _v$5 !== _p$.a && setStyleProperty(_el$48, "gap", _p$.a = _v$5);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    });
+    return _el$47;
+  })();
+};
+export {
+  UIResourceRenderer
+};
+//# sourceMappingURL=UIResourceRenderer.js.map

package/dist/components/UIResourceRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UIResourceRenderer.js","sources":["../../src/components/UIResourceRenderer.tsx"],"sourcesContent":["/**\n * UI Resource Renderer Component\n * Phase 0: Foundation with iframe sandbox and composite grid support\n *\n * Security features:\n * - Sandboxed iframes for untrusted content\n * - CSP enforcement via middleware\n * - XSS prevention with DOMPurify\n * - Domain whitelist validation\n *\n * Performance:\n * - Lazy loading with Intersection Observer\n * - Render timeout enforcement\n * - Error boundaries for isolation\n */\n\nimport { Component, createSignal, onMount, Show, For } from 'solid-js'\nimport type { UIComponent, UILayout, RendererError, ComponentType } from '../types'\nimport { validateComponent, DEFAULT_RESOURCE_LIMITS } from '../services/validation'\nimport { GenerativeUIErrorBoundary } from './GenerativeUIErrorBoundary'\n\n/**\n * Props for UIResourceRenderer\n */\nexport interface UIResourceRendererProps {\n  /**\n   * Single component or full layout to render\n   */\n  content: UIComponent | UILayout\n\n  /**\n   * Lazy loading (default: true)\n   */\n  lazyLoad?: boolean\n\n  /**\n   * Error callback\n   */\n  onError?: (error: RendererError) => void\n\n  /**\n   * Custom CSS class\n   */\n  class?: string\n}\n\n/**\n * Render a single chart component in a sandboxed iframe\n */\nfunction ChartRenderer(props: {\n  component: UIComponent\n  onError?: (error: RendererError) => void\n}) {\n  const [iframeUrl, setIframeUrl] = createSignal<string>()\n  const [isLoading, setIsLoading] = createSignal(true)\n  const [error, setError] = createSignal<string>()\n\n  onMount(() => {\n    const chartParams = props.component.params as any\n\n    // Build Quickchart URL\n    const chartConfig = {\n      type: chartParams.type,\n      data: chartParams.data,\n      options: {\n        ...chartParams.options,\n        responsive: true,\n        maintainAspectRatio: false,\n      },\n    }\n\n    // Encode chart configuration for Quickchart API\n    const configStr = encodeURIComponent(JSON.stringify(chartConfig))\n    const url = `https://quickchart.io/chart?c=${configStr}&width=500&height=300&devicePixelRatio=2`\n\n    // Validate domain (should always pass for quickchart.io)\n    setIframeUrl(url)\n    setIsLoading(false)\n  })\n\n  return (\n    <div class=\"relative w-full h-full min-h-[300px] bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden\">\n      <Show when={isLoading()}>\n        <div class=\"absolute inset-0 flex items-center justify-center\">\n          <div class=\"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600\" />\n        </div>\n      </Show>\n\n      <Show when={error()}>\n        <div class=\"absolute inset-0 flex items-center justify-center p-4\">\n          <div class=\"text-center\">\n            <p class=\"text-red-600 dark:text-red-400 text-sm font-medium\">Chart Error</p>\n            <p class=\"text-gray-600 dark:text-gray-400 text-xs mt-1\">{error()}</p>\n          </div>\n        </div>\n      </Show>\n\n      <Show when={iframeUrl() && !error()}>\n        <div class=\"w-full h-full p-4\">\n          <Show when={(props.component.params as any).title}>\n            <h3 class=\"text-sm font-semibold text-gray-900 dark:text-white mb-3\">\n              {(props.component.params as any).title}\n            </h3>\n          </Show>\n          <div class=\"w-full h-full\">\n            <img\n              src={iframeUrl()}\n              alt=\"Chart visualization\"\n              class=\"w-full h-auto max-h-[300px] object-contain\"\n              onError={() => {\n                setError('Failed to load chart')\n                props.onError?.({\n                  type: 'render',\n                  message: 'Chart rendering failed',\n                  componentId: props.component.id,\n                })\n              }}\n            />\n          </div>\n        </div>\n      </Show>\n    </div>\n  )\n}\n\n/**\n * Render a table component\n */\nfunction TableRenderer(props: {\n  component: UIComponent\n  onError?: (error: RendererError) => void\n}) {\n  const tableParams = props.component.params as any\n\n  return (\n    <div class=\"w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden\">\n      <div class=\"p-4\">\n        <Show when={tableParams.title}>\n          <h3 class=\"text-sm font-semibold text-gray-900 dark:text-white mb-3\">\n            {tableParams.title}\n          </h3>\n        </Show>\n\n        <div class=\"overflow-x-auto\">\n          <table class=\"min-w-full divide-y divide-gray-200 dark:divide-gray-700\">\n            <thead class=\"bg-gray-50 dark:bg-gray-900\">\n              <tr>\n                <For each={tableParams.columns}>\n                  {(column: any) => (\n                    <th\n                      scope=\"col\"\n                      class=\"px-4 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider\"\n                      style={column.width ? { width: column.width } : {}}\n                    >\n                      {column.label}\n                    </th>\n                  )}\n                </For>\n              </tr>\n            </thead>\n            <tbody class=\"bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700\">\n              <For each={tableParams.rows.slice(0, DEFAULT_RESOURCE_LIMITS.maxTableRows)}>\n                {(row: any) => (\n                  <tr class=\"hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors\">\n                    <For each={tableParams.columns}>\n                      {(column: any) => (\n                        <td class=\"px-4 py-3 text-sm text-gray-900 dark:text-gray-100 whitespace-nowrap\">\n                          {row[column.key] || '-'}\n                        </td>\n                      )}\n                    </For>\n                  </tr>\n                )}\n              </For>\n            </tbody>\n          </table>\n        </div>\n\n        <Show when={tableParams.pagination}>\n          <div class=\"mt-3 flex items-center justify-between text-xs text-gray-500 dark:text-gray-400\">\n            <span>\n              Showing {tableParams.pagination.currentPage * tableParams.pagination.pageSize + 1} -{' '}\n              {Math.min(\n                (tableParams.pagination.currentPage + 1) * tableParams.pagination.pageSize,\n                tableParams.pagination.totalRows\n              )}{' '}\n              of {tableParams.pagination.totalRows}\n            </span>\n          </div>\n        </Show>\n      </div>\n    </div>\n  )\n}\n\n/**\n * Render a metric card component\n */\nfunction MetricRenderer(props: { component: UIComponent }) {\n  const metricParams = props.component.params as any\n\n  return (\n    <div class=\"w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-4\">\n      <div class=\"flex flex-col h-full justify-between\">\n        <div>\n          <p class=\"text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wide\">\n            {metricParams.title}\n          </p>\n          <div class=\"mt-2 flex items-baseline\">\n            <p class=\"text-2xl font-semibold text-gray-900 dark:text-white\">{metricParams.value}</p>\n            <Show when={metricParams.unit}>\n              <span class=\"ml-2 text-sm font-medium text-gray-500 dark:text-gray-400\">\n                {metricParams.unit}\n              </span>\n            </Show>\n          </div>\n        </div>\n\n        <Show when={metricParams.trend}>\n          <div class=\"mt-3 flex items-center\">\n            <span\n              class={`text-sm font-medium ${\n                metricParams.trend.direction === 'up'\n                  ? 'text-green-600 dark:text-green-400'\n                  : metricParams.trend.direction === 'down'\n                    ? 'text-red-600 dark:text-red-400'\n                    : 'text-gray-600 dark:text-gray-400'\n              }`}\n            >\n              {metricParams.trend.direction === 'up'\n                ? '�'\n                : metricParams.trend.direction === 'down'\n                  ? '�'\n                  : '�'}{' '}\n              {Math.abs(metricParams.trend.value)}%\n            </span>\n          </div>\n        </Show>\n\n        <Show when={metricParams.subtitle}>\n          <p class=\"mt-2 text-xs text-gray-500 dark:text-gray-400\">{metricParams.subtitle}</p>\n        </Show>\n      </div>\n    </div>\n  )\n}\n\n/**\n * Render a text component (with optional markdown)\n */\nfunction TextRenderer(props: { component: UIComponent }) {\n  const textParams = props.component.params as any\n\n  return (\n    <div class=\"w-full h-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-4\">\n      <div\n        class={`prose prose-sm dark:prose-invert max-w-none ${textParams.className || ''}`}\n        innerHTML={textParams.content} // Note: Should be sanitized at generation time\n      />\n    </div>\n  )\n}\n\n/**\n * Render a single component with error boundary\n */\nfunction ComponentRenderer(props: {\n  component: UIComponent\n  onError?: (error: RendererError) => void\n}) {\n  // Validate component before rendering\n  const validation = validateComponent(props.component)\n  if (!validation.valid) {\n    props.onError?.({\n      type: 'validation',\n      message: 'Component validation failed',\n      componentId: props.component.id,\n      details: validation.errors,\n    })\n\n    return (\n      <div class=\"w-full h-full bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg p-4\">\n        <p class=\"text-sm font-medium text-red-900 dark:text-red-100\">Validation Error</p>\n        <p class=\"text-xs text-red-700 dark:text-red-300 mt-1\">\n          {validation.errors?.[0]?.message || 'Unknown validation error'}\n        </p>\n      </div>\n    )\n  }\n\n  // Render based on component type with enhanced error boundary\n  return (\n    <GenerativeUIErrorBoundary\n      componentId={props.component.id}\n      componentType={props.component.type}\n      onError={props.onError}\n      allowRetry={true}\n    >\n      <Show when={props.component.type === 'chart'}>\n        <ChartRenderer component={props.component} onError={props.onError} />\n      </Show>\n      <Show when={props.component.type === 'table'}>\n        <TableRenderer component={props.component} onError={props.onError} />\n      </Show>\n      <Show when={props.component.type === 'metric'}>\n        <MetricRenderer component={props.component} />\n      </Show>\n      <Show when={props.component.type === 'text'}>\n        <TextRenderer component={props.component} />\n      </Show>\n    </GenerativeUIErrorBoundary>\n  )\n}\n\n/**\n * Main UIResourceRenderer component\n */\nexport const UIResourceRenderer: Component<UIResourceRendererProps> = (props) => {\n  const layout = () => {\n    // Convert single component to layout\n    if ('type' in props.content) {\n      return {\n        id: 'single-component',\n        components: [props.content as UIComponent],\n        grid: {\n          columns: 12,\n          gap: '1rem',\n        },\n      } as UILayout\n    }\n    return props.content as UILayout\n  }\n\n  // Grid position to CSS Grid styles\n  const getGridStyles = (component: UIComponent) => {\n    const { colStart, colSpan, rowStart, rowSpan = 1 } = component.position\n\n    return {\n      'grid-column': `${colStart} / span ${colSpan}`,\n      'grid-row': rowStart ? `${rowStart} / span ${rowSpan}` : 'auto',\n    }\n  }\n\n  return (\n    <div class={`w-full ${props.class || ''}`}>\n      <div\n        class=\"grid gap-4\"\n        style={{\n          'grid-template-columns': `repeat(${layout().grid.columns}, 1fr)`,\n          gap: layout().grid.gap,\n        }}\n      >\n        <For each={layout().components}>\n          {(component) => (\n            <div style={getGridStyles(component)}>\n              <ComponentRenderer component={component} onError={props.onError} />\n            </div>\n          )}\n        </For>\n      </div>\n    </div>\n  )\n}\n"],"names":["ChartRenderer","props","iframeUrl","setIframeUrl","createSignal","isLoading","setIsLoading","error","setError","onMount","chartParams","component","params","chartConfig","type","data","options","responsive","maintainAspectRatio","configStr","encodeURIComponent","JSON","stringify","url","_el$","_tmpl$5","_$insert","_$createComponent","Show","when","children","_tmpl$","_el$3","_tmpl$2","_el$4","firstChild","_el$5","_el$6","nextSibling","_$memo","_el$7","_tmpl$4","_el$9","_el$0","title","_el$8","_tmpl$3","addEventListener","onError","message","componentId","id","_$effect","_$setAttribute","TableRenderer","tableParams","_el$1","_tmpl$7","_el$10","_el$12","_el$13","_el$14","_el$15","_el$16","_el$11","For","each","columns","column","_el$26","_tmpl$8","label","_$p","_$style","width","rows","slice","DEFAULT_RESOURCE_LIMITS","maxTableRows","row","_el$27","_tmpl$9","_el$28","_tmpl$0","key","pagination","_el$17","_tmpl$6","_el$18","_el$19","_el$24","_el$20","_el$25","currentPage","pageSize","Math","min","totalRows","MetricRenderer","metricParams","_el$29","_tmpl$12","_el$30","_el$31","_el$32","_el$33","_el$34","value","unit","_el$35","_tmpl$1","trend","_el$36","_tmpl$10","_el$37","_el$38","_el$40","_c$","direction","abs","_$className","subtitle","_el$41","_tmpl$11","TextRenderer","textParams","_el$42","_tmpl$13","_el$43","_p$","_v$","className","_v$2","content","e","t","innerHTML","undefined","ComponentRenderer","validation","validateComponent","valid","details","errors","_el$44","_tmpl$14","_el$45","_el$46","GenerativeUIErrorBoundary","componentType","allowRetry","UIResourceRenderer","layout","components","grid","gap","getGridStyles","colStart","colSpan","rowStart","rowSpan","position","_el$47","_tmpl$15","_el$48","_el$49","_tmpl$16","_v$3","class","_v$4","_v$5","_$setStyleProperty","a"],"mappings":"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"}

package/dist/components.cjs

@@ -1,2 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./StreamingUIRenderer-DQ1WoVV6.cjs");exports.GenerativeUIErrorBoundary=e.GenerativeUIErrorBoundary;exports.StreamingUIRenderer=e.StreamingUIRenderer;exports.UIResourceRenderer=e.UIResourceRenderer;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const UIResourceRenderer = require("./components/UIResourceRenderer.cjs");
+const StreamingUIRenderer = require("./components/StreamingUIRenderer.cjs");
+const GenerativeUIErrorBoundary = require("./components/GenerativeUIErrorBoundary.cjs");
+exports.UIResourceRenderer = UIResourceRenderer.UIResourceRenderer;
+exports.StreamingUIRenderer = StreamingUIRenderer.StreamingUIRenderer;
+exports.GenerativeUIErrorBoundary = GenerativeUIErrorBoundary.GenerativeUIErrorBoundary;
 //# sourceMappingURL=components.cjs.map

package/dist/components.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"components.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"components.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components.js

@@ -1,7 +1,9 @@
-import { G as a, S as n, U as o } from "./StreamingUIRenderer-oyg_cKKl.js";
+import { UIResourceRenderer } from "./components/UIResourceRenderer.js";
+import { StreamingUIRenderer } from "./components/StreamingUIRenderer.js";
+import { GenerativeUIErrorBoundary } from "./components/GenerativeUIErrorBoundary.js";
 export {
-  a as GenerativeUIErrorBoundary,
-  n as StreamingUIRenderer,
-  o as UIResourceRenderer
+  GenerativeUIErrorBoundary,
+  StreamingUIRenderer,
+  UIResourceRenderer
 };
 //# sourceMappingURL=components.js.map

package/dist/components.js.map

@@ -1 +1 @@
-{"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}