@seed-ship/mcp-ui-solid 6.0.0 → 6.1.0

package/CHANGELOG.md

@@ -5,6 +5,117 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [6.1.0] - 2026-05-03
+
+UX consistency / fluidity release. Three small but visible
+behaviors that were inconsistent across renderers : fullscreen sizing,
+chart export discoverability, table search discoverability.
+
+### Fixed — fullscreen sizing for chart, table, graph
+
+Pre-v6.1.0 bug : when the user clicked the expand button on a chart /
+table / graph and went fullscreen, the visualization stayed at its
+inline default size (`250px` for chart canvas, `400px` for graph,
+`max-height: 400px` for non-virtualized tables, `500px` for
+virtualized) instead of filling the modal. Tables in particular added
+an inner scroll bar at less than half of the available modal height.
+
+Cause : renderers had hard-coded heights and did not subscribe to
+`useExpanded()` from `<ExpandableWrapper>`.
+
+Fix :
+- `<ExpandableWrapper>` modal slot adds `flex flex-col` so aware
+  children can opt into `flex-1 min-h-0` to fill vertically. Unaware
+  children keep working via the existing `overflow-auto` fallback.
+- `<ChartJSRenderer>` (native canvas) : when expanded, outer card
+  becomes `flex-1 min-h-0 flex flex-col`, canvas wrapper drops the
+  fixed pixel height for `height: 100%`. Chart.js
+  `responsive: true` + `maintainAspectRatio: false` (already set)
+  triggers redraw on container resize.
+- `<TableRenderer>` : when expanded, the wrapping card and inner
+  padding container both become flex columns, the scroll container
+  drops its `max-height` and uses `flex-1 min-h-0` to fill — so the
+  internal table body scroll happens inside the visualization, not
+  on the modal.
+- `<GraphRenderer>` : same pattern as chart — outer card flex-fills,
+  G6 canvas container becomes `height: 100%` when expanded. G6
+  resize listener picks up the new size automatically.
+
+Inline mode (not expanded) is **unchanged** — same heights, same
+scroll heuristics as before.
+
+### Changed — table search input default-on
+
+`<TableRenderer>` : the search input was opt-in via `searchable: true`
+or auto-shown only when rows > 10. Now visible by default :
+
+```ts
+// before — search hidden on small tables
+const isSearchable = () =>
+  tableParams.searchable === true ||
+  (tableParams.searchable !== false && allRows().length > 10)
+
+// v6.1.0 — opt-out only
+const isSearchable = () => tableParams.searchable !== false
+```
+
+Backward compat : explicit `searchable: false` still hides the input.
+Tables with `searchable: true` (was already on) unchanged. The change
+only affects tables with no `searchable` prop and ≤ 10 rows — they
+now show search.
+
+### Changed — chart export button default-on + JSON copy added
+
+`<ChartJSRenderer>` : the PNG export button was opt-in via
+`exportable: true`. Now visible by default unless explicitly disabled :
+
+```ts
+// before
+<Show when={params().exportable}>
+
+// v6.1.0
+<Show when={params().exportable !== false}>
+```
+
+Plus a new **copy data (JSON)** button is now wired into the
+`<ExpandableWrapper>` header (visible in the fullscreen modal). Clicks
+copy `{ type, data }` of the chart to the clipboard — useful for
+debugging / re-emitting / sharing in markdown.
+
+Backward compat : explicit `exportable: false` still hides the button.
+Charts with `exportable: true` unchanged. Charts with no prop now show
+the button (was hidden).
+
+### Tests
+
+- `src/components/UIResourceRenderer.fluidity.test.tsx` — **+5 tests**
+  covering : search visible by default on small + large tables, search
+  hidden when explicitly opted out, chart renders without throwing
+  when exportable is undefined or false. Responsive expanded-mode
+  tests left to manual verification (the modal Portal subtree is
+  awkward to assert in jsdom).
+- All previous 578 tests untouched. Total : **583 passed / 1 skipped /
+  584 total**.
+
+### Non-breaking
+
+- All v6.0.0 APIs unchanged.
+- Apps that were relying on the auto-hide of search / export get them
+  shown now — opt out with `searchable: false` / `exportable: false`
+  if undesired.
+
+### What's NOT in this release (future "after" audit)
+
+The user request was scoped to chart + table responsive + the export
+discoverability gaps. A broader cross-renderer audit (map, image-
+gallery, video, code, carousel — for consistent copy/export +
+fullscreen + search behavior) is deferred to a follow-up release.
+Notable known gaps :
+- `<MapRenderer>` is NOT yet wrapped in `<ExpandableWrapper>` (no
+  fullscreen, no copy/export).
+- `<ImageGalleryRenderer>`, `<VideoRenderer>`, `<CarouselRenderer>`
+  have no integrated copy/export menus.
+
 ## [6.0.0] - 2026-05-02
 
 Major version marker — no API breakage. Bumps to `v6` to signal a

package/dist/components/ChartJSRenderer.cjs

@@ -25,7 +25,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const web = require("solid-js/web");
 const solidJs = require("solid-js");
 const ExpandableWrapper = require("./ExpandableWrapper.cjs");
-var _tmpl$ = /* @__PURE__ */ web.template(`<h3 class="text-sm font-semibold text-gray-900 dark:text-white">`), _tmpl$2 = /* @__PURE__ */ web.template(`<button class="opacity-0 group-hover:opacity-60 hover:!opacity-100 px-2 py-1 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm"title="Download PNG"aria-label="Download chart as PNG"><svg class="w-3 h-3 text-gray-500 dark:text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z">`), _tmpl$3 = /* @__PURE__ */ web.template(`<div class="flex items-center justify-between mb-3"><!$><!/><!$><!/>`), _tmpl$4 = /* @__PURE__ */ web.template(`<div class="absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-800/80"><div class="flex flex-col items-center gap-2"><div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div><span class="text-sm text-gray-500 dark:text-gray-400">Loading chart...`), _tmpl$5 = /* @__PURE__ */ web.template(`<div class="absolute inset-0 flex items-center justify-center p-4 bg-white dark:bg-gray-800"><div class=text-center><div class="inline-flex items-center justify-center w-12 h-12 rounded-full bg-red-100 dark:bg-red-900/20 mb-3"><svg class="w-6 h-6 text-red-600 dark:text-red-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path></svg></div><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 max-w-xs">`), _tmpl$6 = /* @__PURE__ */ web.template(`<div class="relative w-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden p-4 group"><!$><!/><!$><!/><!$><!/><div class=w-full><canvas>`);
+var _tmpl$ = /* @__PURE__ */ web.template(`<h3 class="text-sm font-semibold text-gray-900 dark:text-white">`), _tmpl$2 = /* @__PURE__ */ web.template(`<button class="opacity-0 group-hover:opacity-60 hover:!opacity-100 px-2 py-1 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm"title="Download PNG"aria-label="Download chart as PNG"><svg class="w-3 h-3 text-gray-500 dark:text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z">`), _tmpl$3 = /* @__PURE__ */ web.template(`<div class="flex items-center justify-between mb-3 flex-shrink-0"><!$><!/><!$><!/>`), _tmpl$4 = /* @__PURE__ */ web.template(`<div class="absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-800/80"><div class="flex flex-col items-center gap-2"><div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div><span class="text-sm text-gray-500 dark:text-gray-400">Loading chart...`), _tmpl$5 = /* @__PURE__ */ web.template(`<div class="absolute inset-0 flex items-center justify-center p-4 bg-white dark:bg-gray-800"><div class=text-center><div class="inline-flex items-center justify-center w-12 h-12 rounded-full bg-red-100 dark:bg-red-900/20 mb-3"><svg class="w-6 h-6 text-red-600 dark:text-red-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path></svg></div><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 max-w-xs">`), _tmpl$6 = /* @__PURE__ */ web.template(`<div><!$><!/><!$><!/><!$><!/><div><canvas>`);
 let ChartJS = null;
 let chartJSLoadPromise = null;
 const loadChartJS = async () => {
@@ -55,6 +55,12 @@ const ChartJSRenderer = (props) => {
   let canvasRef;
   let chartInstance;
   const params = () => props.component.params;
+  const isExpanded = ExpandableWrapper.useExpanded();
+  const exportEnabled = () => params().exportable !== false;
+  const copyDataJSON = () => JSON.stringify({
+    type: params().type,
+    data: params().data
+  }, null, 2);
   const handleExportPNG = () => {
     if (!canvasRef) return;
     const url = canvasRef.toDataURL("image/png");
@@ -132,11 +138,15 @@ const ChartJSRenderer = (props) => {
     get title() {
       return params().title || "Chart";
     },
+    get copyData() {
+      return copyDataJSON();
+    },
+    copyLabel: "Copy chart data (JSON)",
     get children() {
       var _el$ = web.getNextElement(_tmpl$6), _el$15 = _el$.firstChild, [_el$16, _co$3] = web.getNextMarker(_el$15.nextSibling), _el$17 = _el$16.nextSibling, [_el$18, _co$4] = web.getNextMarker(_el$17.nextSibling), _el$19 = _el$18.nextSibling, [_el$20, _co$5] = web.getNextMarker(_el$19.nextSibling), _el$13 = _el$20.nextSibling, _el$14 = _el$13.firstChild;
       web.insert(_el$, web.createComponent(solidJs.Show, {
         get when() {
-          return params().title || params().exportable;
+          return params().title || exportEnabled();
         },
         get children() {
           var _el$2 = web.getNextElement(_tmpl$3), _el$5 = _el$2.firstChild, [_el$6, _co$] = web.getNextMarker(_el$5.nextSibling), _el$7 = _el$6.nextSibling, [_el$8, _co$2] = web.getNextMarker(_el$7.nextSibling);
@@ -152,7 +162,7 @@ const ChartJSRenderer = (props) => {
           }), _el$6, _co$);
           web.insert(_el$2, web.createComponent(solidJs.Show, {
             get when() {
-              return params().exportable;
+              return exportEnabled();
             },
             get children() {
               var _el$4 = web.getNextElement(_tmpl$2);
@@ -185,13 +195,23 @@ const ChartJSRenderer = (props) => {
       var _ref$ = canvasRef;
       typeof _ref$ === "function" ? web.use(_ref$, _el$14) : canvasRef = _el$14;
       web.effect((_p$) => {
-        var _v$ = params().height || "250px", _v$2 = error() ? "none" : "block";
-        _v$ !== _p$.e && web.setStyleProperty(_el$13, "height", _p$.e = _v$);
-        _v$2 !== _p$.t && web.setStyleProperty(_el$13, "display", _p$.t = _v$2);
+        var _v$ = `relative w-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden p-4 group ${isExpanded() ? "flex-1 min-h-0 flex flex-col" : ""}`, _v$2 = `w-full ${isExpanded() ? "flex-1 min-h-0" : ""}`, _v$3 = error() ? {
+          display: "none"
+        } : isExpanded() ? {
+          height: "100%",
+          display: "block"
+        } : {
+          height: params().height || "250px",
+          display: "block"
+        };
+        _v$ !== _p$.e && web.className(_el$, _p$.e = _v$);
+        _v$2 !== _p$.t && web.className(_el$13, _p$.t = _v$2);
+        _p$.a = web.style(_el$13, _v$3, _p$.a);
         return _p$;
       }, {
         e: void 0,
-        t: void 0
+        t: void 0,
+        a: void 0
       });
       return _el$;
     }

package/dist/components/ChartJSRenderer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChartJSRenderer.cjs","sources":["../../src/components/ChartJSRenderer.tsx"],"sourcesContent":["/**\n * ChartJSRenderer - Native Chart.js rendering\n * Sprint 4: State & Charts\n *\n * Requires chart.js peer dependency:\n * ```\n * pnpm add chart.js\n * ```\n */\n\nimport { Component, createEffect, onCleanup, createSignal, Show } from 'solid-js'\nimport type { UIComponent, ChartComponentParams } from '../types'\nimport { ExpandableWrapper } from './ExpandableWrapper'\n\n// Lazy load Chart.js to avoid bundling if not used\nlet ChartJS: any = null\nlet chartJSLoadPromise: Promise<any> | null = null\n\nconst loadChartJS = async () => {\n  if (ChartJS) return ChartJS\n\n  if (!chartJSLoadPromise) {\n    chartJSLoadPromise = import('chart.js/auto')\n      .then((module) => {\n        ChartJS = module.default || module.Chart\n        return ChartJS\n      })\n      .catch((err) => {\n        chartJSLoadPromise = null\n        throw err\n      })\n  }\n\n  return chartJSLoadPromise\n}\n\n/**\n * Check if Chart.js is available\n */\nexport async function isChartJSAvailable(): Promise<boolean> {\n  try {\n    await loadChartJS()\n    return true\n  } catch {\n    return false\n  }\n}\n\nexport interface ChartJSRendererProps {\n  /**\n   * UIComponent with chart params\n   */\n  component: UIComponent\n\n  /**\n   * Error callback\n   */\n  onError?: (error: Error) => void\n}\n\n/**\n * Native Chart.js renderer component\n *\n * @example\n * ```tsx\n * const chartComponent: UIComponent = {\n *   id: 'revenue-chart',\n *   type: 'chart',\n *   position: { colStart: 1, colSpan: 6 },\n *   params: {\n *     type: 'bar',\n *     title: 'Monthly Revenue',\n *     data: {\n *       labels: ['Jan', 'Feb', 'Mar'],\n *       datasets: [{ label: 'Revenue', data: [100, 200, 150] }]\n *     },\n *     renderer: 'native',\n *   },\n * }\n * <ChartJSRenderer component={chartComponent} />\n * ```\n */\nexport const ChartJSRenderer: Component<ChartJSRendererProps> = (props) => {\n  const [isLoading, setIsLoading] = createSignal(true)\n  const [error, setError] = createSignal<string>()\n  let canvasRef: HTMLCanvasElement | undefined\n  let chartInstance: any\n\n  const params = () => props.component.params as ChartComponentParams\n\n  // Chart PNG export\n  const handleExportPNG = () => {\n    if (!canvasRef) return\n    const url = canvasRef.toDataURL('image/png')\n    const a = document.createElement('a')\n    a.href = url\n    a.download = `${(params().title || 'chart').replace(/\\s+/g, '-').toLowerCase()}.png`\n    a.click()\n  }\n\n  // Create/update chart when params change\n  createEffect(async () => {\n    if (!canvasRef) return\n\n    // Access params to track dependencies\n    const chartParams = params()\n\n    setIsLoading(true)\n    setError(undefined)\n\n    try {\n      const Chart = await loadChartJS()\n\n      // Destroy previous instance\n      if (chartInstance) {\n        chartInstance.destroy()\n        chartInstance = null\n      }\n\n      // Build options, merging time-axis config if present (v3.1.0)\n      const baseOptions: any = {\n        responsive: true,\n        maintainAspectRatio: false,\n        ...chartParams.options,\n        plugins: {\n          ...chartParams.options?.plugins,\n          legend: {\n            display: true,\n            position: 'bottom',\n            ...chartParams.options?.plugins?.legend,\n          },\n        },\n      }\n\n      // Time-series axis (v3.1.0)\n      if (chartParams.timeAxis) {\n        const ta = chartParams.timeAxis\n        baseOptions.scales = {\n          ...baseOptions.scales,\n          x: {\n            ...baseOptions.scales?.x,\n            type: 'time',\n            time: {\n              parser: ta.parser,\n              unit: ta.unit,\n              tooltipFormat: ta.tooltipFormat,\n            },\n            ...(ta.min ? { min: ta.min } : {}),\n            ...(ta.max ? { max: ta.max } : {}),\n          },\n        }\n      }\n\n      // Create new chart\n      chartInstance = new Chart(canvasRef, {\n        type: chartParams.type,\n        data: chartParams.data,\n        options: baseOptions,\n      })\n\n      setIsLoading(false)\n    } catch (err) {\n      const error = err instanceof Error ? err : new Error('Chart rendering failed')\n      setError(error.message)\n      setIsLoading(false)\n      props.onError?.(error)\n    }\n  })\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    if (chartInstance) {\n      chartInstance.destroy()\n      chartInstance = null\n    }\n  })\n\n  return (\n    <ExpandableWrapper title={params().title || 'Chart'}>\n      <div class=\"relative w-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden p-4 group\">\n        <Show when={params().title || params().exportable}>\n          <div class=\"flex items-center justify-between mb-3\">\n            <Show when={params().title}>\n              <h3 class=\"text-sm font-semibold text-gray-900 dark:text-white\">\n                {params().title}\n              </h3>\n            </Show>\n            <Show when={params().exportable}>\n              <button\n                onClick={handleExportPNG}\n                class=\"opacity-0 group-hover:opacity-60 hover:!opacity-100 px-2 py-1 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm\"\n                title=\"Download PNG\"\n                aria-label=\"Download chart as PNG\"\n              >\n                <svg class=\"w-3 h-3 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                  <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n                </svg>\n              </button>\n            </Show>\n          </div>\n        </Show>\n\n        <Show when={isLoading()}>\n          <div class=\"absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-800/80\">\n            <div class=\"flex flex-col items-center gap-2\">\n              <div class=\"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600\" />\n              <span class=\"text-sm text-gray-500 dark:text-gray-400\">Loading chart...</span>\n            </div>\n          </div>\n        </Show>\n\n        <Show when={error()}>\n          <div class=\"absolute inset-0 flex items-center justify-center p-4 bg-white dark:bg-gray-800\">\n            <div class=\"text-center\">\n              <div class=\"inline-flex items-center justify-center w-12 h-12 rounded-full bg-red-100 dark:bg-red-900/20 mb-3\">\n                <svg\n                  class=\"w-6 h-6 text-red-600 dark:text-red-400\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                >\n                  <path\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                    stroke-width=\"2\"\n                    d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n                  />\n                </svg>\n              </div>\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 max-w-xs\">{error()}</p>\n            </div>\n          </div>\n        </Show>\n\n        <div\n          class=\"w-full\"\n          style={{ height: params().height || '250px', display: error() ? 'none' : 'block' }}\n        >\n          <canvas ref={canvasRef} />\n        </div>\n      </div>\n    </ExpandableWrapper>\n  )\n}\n"],"names":["ChartJS","chartJSLoadPromise","loadChartJS","then","module","default","Chart","catch","err","isChartJSAvailable","ChartJSRenderer","props","isLoading","setIsLoading","createSignal","error","setError","canvasRef","chartInstance","params","component","handleExportPNG","url","toDataURL","a","document","createElement","href","download","title","replace","toLowerCase","click","createEffect","chartParams","undefined","destroy","baseOptions","responsive","maintainAspectRatio","options","plugins","legend","display","position","timeAxis","ta","scales","x","type","time","parser","unit","tooltipFormat","min","max","data","Error","message","onError","onCleanup","_$createComponent","ExpandableWrapper","children","_el$","_$getNextElement","_tmpl$6","_el$15","firstChild","_el$16","_co$3","_$getNextMarker","nextSibling","_el$17","_el$18","_co$4","_el$19","_el$20","_co$5","_el$13","_el$14","_$insert","Show","when","exportable","_el$2","_tmpl$3","_el$5","_el$6","_co$","_el$7","_el$8","_co$2","_el$3","_tmpl$","_el$4","_tmpl$2","$$click","_$runHydrationEvents","_tmpl$4","_el$0","_tmpl$5","_el$1","_el$10","_el$11","_el$12","_ref$","_$use","_$effect","_p$","_v$","height","_v$2","e","_$setStyleProperty","t","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"ChartJSRenderer.cjs","sources":["../../src/components/ChartJSRenderer.tsx"],"sourcesContent":["/**\n * ChartJSRenderer - Native Chart.js rendering\n * Sprint 4: State & Charts\n *\n * Requires chart.js peer dependency:\n * ```\n * pnpm add chart.js\n * ```\n */\n\nimport { Component, createEffect, onCleanup, createSignal, Show } from 'solid-js'\nimport type { UIComponent, ChartComponentParams } from '../types'\nimport { ExpandableWrapper, useExpanded } from './ExpandableWrapper'\n\n// Lazy load Chart.js to avoid bundling if not used\nlet ChartJS: any = null\nlet chartJSLoadPromise: Promise<any> | null = null\n\nconst loadChartJS = async () => {\n  if (ChartJS) return ChartJS\n\n  if (!chartJSLoadPromise) {\n    chartJSLoadPromise = import('chart.js/auto')\n      .then((module) => {\n        ChartJS = module.default || module.Chart\n        return ChartJS\n      })\n      .catch((err) => {\n        chartJSLoadPromise = null\n        throw err\n      })\n  }\n\n  return chartJSLoadPromise\n}\n\n/**\n * Check if Chart.js is available\n */\nexport async function isChartJSAvailable(): Promise<boolean> {\n  try {\n    await loadChartJS()\n    return true\n  } catch {\n    return false\n  }\n}\n\nexport interface ChartJSRendererProps {\n  /**\n   * UIComponent with chart params\n   */\n  component: UIComponent\n\n  /**\n   * Error callback\n   */\n  onError?: (error: Error) => void\n}\n\n/**\n * Native Chart.js renderer component\n *\n * @example\n * ```tsx\n * const chartComponent: UIComponent = {\n *   id: 'revenue-chart',\n *   type: 'chart',\n *   position: { colStart: 1, colSpan: 6 },\n *   params: {\n *     type: 'bar',\n *     title: 'Monthly Revenue',\n *     data: {\n *       labels: ['Jan', 'Feb', 'Mar'],\n *       datasets: [{ label: 'Revenue', data: [100, 200, 150] }]\n *     },\n *     renderer: 'native',\n *   },\n * }\n * <ChartJSRenderer component={chartComponent} />\n * ```\n */\nexport const ChartJSRenderer: Component<ChartJSRendererProps> = (props) => {\n  const [isLoading, setIsLoading] = createSignal(true)\n  const [error, setError] = createSignal<string>()\n  let canvasRef: HTMLCanvasElement | undefined\n  let chartInstance: any\n\n  const params = () => props.component.params as ChartComponentParams\n  const isExpanded = useExpanded()\n\n  // v6.1.0 — export visibility :\n  //   - undefined / true  → button shown (new default, was opt-in)\n  //   - false             → button hidden (explicit opt-out, unchanged)\n  const exportEnabled = () => params().exportable !== false\n\n  // v6.1.0 — copy data for the ExpandableWrapper modal-header copy button.\n  // Lazy-stringified each time the button is clicked.\n  const copyDataJSON = () => JSON.stringify({ type: params().type, data: params().data }, null, 2)\n\n  // Chart PNG export\n  const handleExportPNG = () => {\n    if (!canvasRef) return\n    const url = canvasRef.toDataURL('image/png')\n    const a = document.createElement('a')\n    a.href = url\n    a.download = `${(params().title || 'chart').replace(/\\s+/g, '-').toLowerCase()}.png`\n    a.click()\n  }\n\n  // Create/update chart when params change\n  createEffect(async () => {\n    if (!canvasRef) return\n\n    // Access params to track dependencies\n    const chartParams = params()\n\n    setIsLoading(true)\n    setError(undefined)\n\n    try {\n      const Chart = await loadChartJS()\n\n      // Destroy previous instance\n      if (chartInstance) {\n        chartInstance.destroy()\n        chartInstance = null\n      }\n\n      // Build options, merging time-axis config if present (v3.1.0)\n      const baseOptions: any = {\n        responsive: true,\n        maintainAspectRatio: false,\n        ...chartParams.options,\n        plugins: {\n          ...chartParams.options?.plugins,\n          legend: {\n            display: true,\n            position: 'bottom',\n            ...chartParams.options?.plugins?.legend,\n          },\n        },\n      }\n\n      // Time-series axis (v3.1.0)\n      if (chartParams.timeAxis) {\n        const ta = chartParams.timeAxis\n        baseOptions.scales = {\n          ...baseOptions.scales,\n          x: {\n            ...baseOptions.scales?.x,\n            type: 'time',\n            time: {\n              parser: ta.parser,\n              unit: ta.unit,\n              tooltipFormat: ta.tooltipFormat,\n            },\n            ...(ta.min ? { min: ta.min } : {}),\n            ...(ta.max ? { max: ta.max } : {}),\n          },\n        }\n      }\n\n      // Create new chart\n      chartInstance = new Chart(canvasRef, {\n        type: chartParams.type,\n        data: chartParams.data,\n        options: baseOptions,\n      })\n\n      setIsLoading(false)\n    } catch (err) {\n      const error = err instanceof Error ? err : new Error('Chart rendering failed')\n      setError(error.message)\n      setIsLoading(false)\n      props.onError?.(error)\n    }\n  })\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    if (chartInstance) {\n      chartInstance.destroy()\n      chartInstance = null\n    }\n  })\n\n  return (\n    <ExpandableWrapper\n      title={params().title || 'Chart'}\n      copyData={copyDataJSON()}\n      copyLabel=\"Copy chart data (JSON)\"\n    >\n      <div class={`relative w-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden p-4 group ${\n        isExpanded() ? 'flex-1 min-h-0 flex flex-col' : ''\n      }`}>\n        <Show when={params().title || exportEnabled()}>\n          <div class=\"flex items-center justify-between mb-3 flex-shrink-0\">\n            <Show when={params().title}>\n              <h3 class=\"text-sm font-semibold text-gray-900 dark:text-white\">\n                {params().title}\n              </h3>\n            </Show>\n            <Show when={exportEnabled()}>\n              <button\n                onClick={handleExportPNG}\n                class=\"opacity-0 group-hover:opacity-60 hover:!opacity-100 px-2 py-1 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm\"\n                title=\"Download PNG\"\n                aria-label=\"Download chart as PNG\"\n              >\n                <svg class=\"w-3 h-3 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                  <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n                </svg>\n              </button>\n            </Show>\n          </div>\n        </Show>\n\n        <Show when={isLoading()}>\n          <div class=\"absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-800/80\">\n            <div class=\"flex flex-col items-center gap-2\">\n              <div class=\"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600\" />\n              <span class=\"text-sm text-gray-500 dark:text-gray-400\">Loading chart...</span>\n            </div>\n          </div>\n        </Show>\n\n        <Show when={error()}>\n          <div class=\"absolute inset-0 flex items-center justify-center p-4 bg-white dark:bg-gray-800\">\n            <div class=\"text-center\">\n              <div class=\"inline-flex items-center justify-center w-12 h-12 rounded-full bg-red-100 dark:bg-red-900/20 mb-3\">\n                <svg\n                  class=\"w-6 h-6 text-red-600 dark:text-red-400\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                >\n                  <path\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                    stroke-width=\"2\"\n                    d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n                  />\n                </svg>\n              </div>\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 max-w-xs\">{error()}</p>\n            </div>\n          </div>\n        </Show>\n\n        <div\n          class={`w-full ${isExpanded() ? 'flex-1 min-h-0' : ''}`}\n          style={\n            error()\n              ? { display: 'none' }\n              : isExpanded()\n                ? { height: '100%', display: 'block' }\n                : { height: params().height || '250px', display: 'block' }\n          }\n        >\n          <canvas ref={canvasRef} />\n        </div>\n      </div>\n    </ExpandableWrapper>\n  )\n}\n"],"names":["ChartJS","chartJSLoadPromise","loadChartJS","then","module","default","Chart","catch","err","isChartJSAvailable","ChartJSRenderer","props","isLoading","setIsLoading","createSignal","error","setError","canvasRef","chartInstance","params","component","isExpanded","useExpanded","exportEnabled","exportable","copyDataJSON","JSON","stringify","type","data","handleExportPNG","url","toDataURL","a","document","createElement","href","download","title","replace","toLowerCase","click","createEffect","chartParams","undefined","destroy","baseOptions","responsive","maintainAspectRatio","options","plugins","legend","display","position","timeAxis","ta","scales","x","time","parser","unit","tooltipFormat","min","max","Error","message","onError","onCleanup","_$createComponent","ExpandableWrapper","copyData","copyLabel","children","_el$","_$getNextElement","_tmpl$6","_el$15","firstChild","_el$16","_co$3","_$getNextMarker","nextSibling","_el$17","_el$18","_co$4","_el$19","_el$20","_co$5","_el$13","_el$14","_$insert","Show","when","_el$2","_tmpl$3","_el$5","_el$6","_co$","_el$7","_el$8","_co$2","_el$3","_tmpl$","_el$4","_tmpl$2","$$click","_$runHydrationEvents","_tmpl$4","_el$0","_tmpl$5","_el$1","_el$10","_el$11","_el$12","_ref$","_$use","_$effect","_p$","_v$","_v$2","_v$3","height","e","_$className","t","_$style","_$delegateEvents"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"ChartJSRenderer.d.ts","sourceRoot":"","sources":["../../src/components/ChartJSRenderer.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,SAAS,EAA+C,MAAM,UAAU,CAAA;AACjF,OAAO,KAAK,EAAE,WAAW,EAAwB,MAAM,UAAU,CAAA;AAyBjE;;GAEG;AACH,wBAAsB,kBAAkB,IAAI,OAAO,CAAC,OAAO,CAAC,CAO3D;AAED,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,SAAS,EAAE,WAAW,CAAA;IAEtB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,eAAe,EAAE,SAAS,CAAC,oBAAoB,CAkK3D,CAAA"}
+{"version":3,"file":"ChartJSRenderer.d.ts","sourceRoot":"","sources":["../../src/components/ChartJSRenderer.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,SAAS,EAA+C,MAAM,UAAU,CAAA;AACjF,OAAO,KAAK,EAAE,WAAW,EAAwB,MAAM,UAAU,CAAA;AAyBjE;;GAEG;AACH,wBAAsB,kBAAkB,IAAI,OAAO,CAAC,OAAO,CAAC,CAO3D;AAED,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,SAAS,EAAE,WAAW,CAAA;IAEtB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,eAAe,EAAE,SAAS,CAAC,oBAAoB,CAwL3D,CAAA"}

package/dist/components/ChartJSRenderer.js

@@ -1,7 +1,7 @@
-import { delegateEvents, createComponent, getNextElement, template, getNextMarker, insert, runHydrationEvents, effect, setStyleProperty, use } from "solid-js/web";
+import { delegateEvents, createComponent, getNextElement, template, getNextMarker, insert, runHydrationEvents, effect, className, style, use } from "solid-js/web";
 import { createSignal, createEffect, onCleanup, Show } from "solid-js";
-import { ExpandableWrapper } from "./ExpandableWrapper.js";
-var _tmpl$ = /* @__PURE__ */ template(`<h3 class="text-sm font-semibold text-gray-900 dark:text-white">`), _tmpl$2 = /* @__PURE__ */ template(`<button class="opacity-0 group-hover:opacity-60 hover:!opacity-100 px-2 py-1 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm"title="Download PNG"aria-label="Download chart as PNG"><svg class="w-3 h-3 text-gray-500 dark:text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z">`), _tmpl$3 = /* @__PURE__ */ template(`<div class="flex items-center justify-between mb-3"><!$><!/><!$><!/>`), _tmpl$4 = /* @__PURE__ */ template(`<div class="absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-800/80"><div class="flex flex-col items-center gap-2"><div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div><span class="text-sm text-gray-500 dark:text-gray-400">Loading chart...`), _tmpl$5 = /* @__PURE__ */ template(`<div class="absolute inset-0 flex items-center justify-center p-4 bg-white dark:bg-gray-800"><div class=text-center><div class="inline-flex items-center justify-center w-12 h-12 rounded-full bg-red-100 dark:bg-red-900/20 mb-3"><svg class="w-6 h-6 text-red-600 dark:text-red-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path></svg></div><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 max-w-xs">`), _tmpl$6 = /* @__PURE__ */ template(`<div class="relative w-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden p-4 group"><!$><!/><!$><!/><!$><!/><div class=w-full><canvas>`);
+import { useExpanded, ExpandableWrapper } from "./ExpandableWrapper.js";
+var _tmpl$ = /* @__PURE__ */ template(`<h3 class="text-sm font-semibold text-gray-900 dark:text-white">`), _tmpl$2 = /* @__PURE__ */ template(`<button class="opacity-0 group-hover:opacity-60 hover:!opacity-100 px-2 py-1 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm"title="Download PNG"aria-label="Download chart as PNG"><svg class="w-3 h-3 text-gray-500 dark:text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z">`), _tmpl$3 = /* @__PURE__ */ template(`<div class="flex items-center justify-between mb-3 flex-shrink-0"><!$><!/><!$><!/>`), _tmpl$4 = /* @__PURE__ */ template(`<div class="absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-800/80"><div class="flex flex-col items-center gap-2"><div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div><span class="text-sm text-gray-500 dark:text-gray-400">Loading chart...`), _tmpl$5 = /* @__PURE__ */ template(`<div class="absolute inset-0 flex items-center justify-center p-4 bg-white dark:bg-gray-800"><div class=text-center><div class="inline-flex items-center justify-center w-12 h-12 rounded-full bg-red-100 dark:bg-red-900/20 mb-3"><svg class="w-6 h-6 text-red-600 dark:text-red-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path></svg></div><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 max-w-xs">`), _tmpl$6 = /* @__PURE__ */ template(`<div><!$><!/><!$><!/><!$><!/><div><canvas>`);
 let ChartJS = null;
 let chartJSLoadPromise = null;
 const loadChartJS = async () => {
@@ -31,6 +31,12 @@ const ChartJSRenderer = (props) => {
   let canvasRef;
   let chartInstance;
   const params = () => props.component.params;
+  const isExpanded = useExpanded();
+  const exportEnabled = () => params().exportable !== false;
+  const copyDataJSON = () => JSON.stringify({
+    type: params().type,
+    data: params().data
+  }, null, 2);
   const handleExportPNG = () => {
     if (!canvasRef) return;
     const url = canvasRef.toDataURL("image/png");
@@ -108,11 +114,15 @@ const ChartJSRenderer = (props) => {
     get title() {
       return params().title || "Chart";
     },
+    get copyData() {
+      return copyDataJSON();
+    },
+    copyLabel: "Copy chart data (JSON)",
     get children() {
       var _el$ = getNextElement(_tmpl$6), _el$15 = _el$.firstChild, [_el$16, _co$3] = getNextMarker(_el$15.nextSibling), _el$17 = _el$16.nextSibling, [_el$18, _co$4] = getNextMarker(_el$17.nextSibling), _el$19 = _el$18.nextSibling, [_el$20, _co$5] = getNextMarker(_el$19.nextSibling), _el$13 = _el$20.nextSibling, _el$14 = _el$13.firstChild;
       insert(_el$, createComponent(Show, {
         get when() {
-          return params().title || params().exportable;
+          return params().title || exportEnabled();
         },
         get children() {
           var _el$2 = getNextElement(_tmpl$3), _el$5 = _el$2.firstChild, [_el$6, _co$] = getNextMarker(_el$5.nextSibling), _el$7 = _el$6.nextSibling, [_el$8, _co$2] = getNextMarker(_el$7.nextSibling);
@@ -128,7 +138,7 @@ const ChartJSRenderer = (props) => {
           }), _el$6, _co$);
           insert(_el$2, createComponent(Show, {
             get when() {
-              return params().exportable;
+              return exportEnabled();
             },
             get children() {
               var _el$4 = getNextElement(_tmpl$2);
@@ -161,13 +171,23 @@ const ChartJSRenderer = (props) => {
       var _ref$ = canvasRef;
       typeof _ref$ === "function" ? use(_ref$, _el$14) : canvasRef = _el$14;
       effect((_p$) => {
-        var _v$ = params().height || "250px", _v$2 = error() ? "none" : "block";
-        _v$ !== _p$.e && setStyleProperty(_el$13, "height", _p$.e = _v$);
-        _v$2 !== _p$.t && setStyleProperty(_el$13, "display", _p$.t = _v$2);
+        var _v$ = `relative w-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden p-4 group ${isExpanded() ? "flex-1 min-h-0 flex flex-col" : ""}`, _v$2 = `w-full ${isExpanded() ? "flex-1 min-h-0" : ""}`, _v$3 = error() ? {
+          display: "none"
+        } : isExpanded() ? {
+          height: "100%",
+          display: "block"
+        } : {
+          height: params().height || "250px",
+          display: "block"
+        };
+        _v$ !== _p$.e && className(_el$, _p$.e = _v$);
+        _v$2 !== _p$.t && className(_el$13, _p$.t = _v$2);
+        _p$.a = style(_el$13, _v$3, _p$.a);
         return _p$;
       }, {
         e: void 0,
-        t: void 0
+        t: void 0,
+        a: void 0
       });
       return _el$;
     }

package/dist/components/ChartJSRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartJSRenderer.js","sources":["../../src/components/ChartJSRenderer.tsx"],"sourcesContent":["/**\n * ChartJSRenderer - Native Chart.js rendering\n * Sprint 4: State & Charts\n *\n * Requires chart.js peer dependency:\n * ```\n * pnpm add chart.js\n * ```\n */\n\nimport { Component, createEffect, onCleanup, createSignal, Show } from 'solid-js'\nimport type { UIComponent, ChartComponentParams } from '../types'\nimport { ExpandableWrapper } from './ExpandableWrapper'\n\n// Lazy load Chart.js to avoid bundling if not used\nlet ChartJS: any = null\nlet chartJSLoadPromise: Promise<any> | null = null\n\nconst loadChartJS = async () => {\n  if (ChartJS) return ChartJS\n\n  if (!chartJSLoadPromise) {\n    chartJSLoadPromise = import('chart.js/auto')\n      .then((module) => {\n        ChartJS = module.default || module.Chart\n        return ChartJS\n      })\n      .catch((err) => {\n        chartJSLoadPromise = null\n        throw err\n      })\n  }\n\n  return chartJSLoadPromise\n}\n\n/**\n * Check if Chart.js is available\n */\nexport async function isChartJSAvailable(): Promise<boolean> {\n  try {\n    await loadChartJS()\n    return true\n  } catch {\n    return false\n  }\n}\n\nexport interface ChartJSRendererProps {\n  /**\n   * UIComponent with chart params\n   */\n  component: UIComponent\n\n  /**\n   * Error callback\n   */\n  onError?: (error: Error) => void\n}\n\n/**\n * Native Chart.js renderer component\n *\n * @example\n * ```tsx\n * const chartComponent: UIComponent = {\n *   id: 'revenue-chart',\n *   type: 'chart',\n *   position: { colStart: 1, colSpan: 6 },\n *   params: {\n *     type: 'bar',\n *     title: 'Monthly Revenue',\n *     data: {\n *       labels: ['Jan', 'Feb', 'Mar'],\n *       datasets: [{ label: 'Revenue', data: [100, 200, 150] }]\n *     },\n *     renderer: 'native',\n *   },\n * }\n * <ChartJSRenderer component={chartComponent} />\n * ```\n */\nexport const ChartJSRenderer: Component<ChartJSRendererProps> = (props) => {\n  const [isLoading, setIsLoading] = createSignal(true)\n  const [error, setError] = createSignal<string>()\n  let canvasRef: HTMLCanvasElement | undefined\n  let chartInstance: any\n\n  const params = () => props.component.params as ChartComponentParams\n\n  // Chart PNG export\n  const handleExportPNG = () => {\n    if (!canvasRef) return\n    const url = canvasRef.toDataURL('image/png')\n    const a = document.createElement('a')\n    a.href = url\n    a.download = `${(params().title || 'chart').replace(/\\s+/g, '-').toLowerCase()}.png`\n    a.click()\n  }\n\n  // Create/update chart when params change\n  createEffect(async () => {\n    if (!canvasRef) return\n\n    // Access params to track dependencies\n    const chartParams = params()\n\n    setIsLoading(true)\n    setError(undefined)\n\n    try {\n      const Chart = await loadChartJS()\n\n      // Destroy previous instance\n      if (chartInstance) {\n        chartInstance.destroy()\n        chartInstance = null\n      }\n\n      // Build options, merging time-axis config if present (v3.1.0)\n      const baseOptions: any = {\n        responsive: true,\n        maintainAspectRatio: false,\n        ...chartParams.options,\n        plugins: {\n          ...chartParams.options?.plugins,\n          legend: {\n            display: true,\n            position: 'bottom',\n            ...chartParams.options?.plugins?.legend,\n          },\n        },\n      }\n\n      // Time-series axis (v3.1.0)\n      if (chartParams.timeAxis) {\n        const ta = chartParams.timeAxis\n        baseOptions.scales = {\n          ...baseOptions.scales,\n          x: {\n            ...baseOptions.scales?.x,\n            type: 'time',\n            time: {\n              parser: ta.parser,\n              unit: ta.unit,\n              tooltipFormat: ta.tooltipFormat,\n            },\n            ...(ta.min ? { min: ta.min } : {}),\n            ...(ta.max ? { max: ta.max } : {}),\n          },\n        }\n      }\n\n      // Create new chart\n      chartInstance = new Chart(canvasRef, {\n        type: chartParams.type,\n        data: chartParams.data,\n        options: baseOptions,\n      })\n\n      setIsLoading(false)\n    } catch (err) {\n      const error = err instanceof Error ? err : new Error('Chart rendering failed')\n      setError(error.message)\n      setIsLoading(false)\n      props.onError?.(error)\n    }\n  })\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    if (chartInstance) {\n      chartInstance.destroy()\n      chartInstance = null\n    }\n  })\n\n  return (\n    <ExpandableWrapper title={params().title || 'Chart'}>\n      <div class=\"relative w-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden p-4 group\">\n        <Show when={params().title || params().exportable}>\n          <div class=\"flex items-center justify-between mb-3\">\n            <Show when={params().title}>\n              <h3 class=\"text-sm font-semibold text-gray-900 dark:text-white\">\n                {params().title}\n              </h3>\n            </Show>\n            <Show when={params().exportable}>\n              <button\n                onClick={handleExportPNG}\n                class=\"opacity-0 group-hover:opacity-60 hover:!opacity-100 px-2 py-1 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm\"\n                title=\"Download PNG\"\n                aria-label=\"Download chart as PNG\"\n              >\n                <svg class=\"w-3 h-3 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                  <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n                </svg>\n              </button>\n            </Show>\n          </div>\n        </Show>\n\n        <Show when={isLoading()}>\n          <div class=\"absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-800/80\">\n            <div class=\"flex flex-col items-center gap-2\">\n              <div class=\"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600\" />\n              <span class=\"text-sm text-gray-500 dark:text-gray-400\">Loading chart...</span>\n            </div>\n          </div>\n        </Show>\n\n        <Show when={error()}>\n          <div class=\"absolute inset-0 flex items-center justify-center p-4 bg-white dark:bg-gray-800\">\n            <div class=\"text-center\">\n              <div class=\"inline-flex items-center justify-center w-12 h-12 rounded-full bg-red-100 dark:bg-red-900/20 mb-3\">\n                <svg\n                  class=\"w-6 h-6 text-red-600 dark:text-red-400\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                >\n                  <path\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                    stroke-width=\"2\"\n                    d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n                  />\n                </svg>\n              </div>\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 max-w-xs\">{error()}</p>\n            </div>\n          </div>\n        </Show>\n\n        <div\n          class=\"w-full\"\n          style={{ height: params().height || '250px', display: error() ? 'none' : 'block' }}\n        >\n          <canvas ref={canvasRef} />\n        </div>\n      </div>\n    </ExpandableWrapper>\n  )\n}\n"],"names":["ChartJS","chartJSLoadPromise","loadChartJS","then","module","default","Chart","catch","err","isChartJSAvailable","ChartJSRenderer","props","isLoading","setIsLoading","createSignal","error","setError","canvasRef","chartInstance","params","component","handleExportPNG","url","toDataURL","a","document","createElement","href","download","title","replace","toLowerCase","click","createEffect","chartParams","undefined","destroy","baseOptions","responsive","maintainAspectRatio","options","plugins","legend","display","position","timeAxis","ta","scales","x","type","time","parser","unit","tooltipFormat","min","max","data","Error","message","onError","onCleanup","_$createComponent","ExpandableWrapper","children","_el$","_$getNextElement","_tmpl$6","_el$15","firstChild","_el$16","_co$3","_$getNextMarker","nextSibling","_el$17","_el$18","_co$4","_el$19","_el$20","_co$5","_el$13","_el$14","_$insert","Show","when","exportable","_el$2","_tmpl$3","_el$5","_el$6","_co$","_el$7","_el$8","_co$2","_el$3","_tmpl$","_el$4","_tmpl$2","$$click","_$runHydrationEvents","_tmpl$4","_el$0","_tmpl$5","_el$1","_el$10","_el$11","_el$12","_ref$","_$use","_$effect","_p$","_v$","height","_v$2","e","_$setStyleProperty","t","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"ChartJSRenderer.js","sources":["../../src/components/ChartJSRenderer.tsx"],"sourcesContent":["/**\n * ChartJSRenderer - Native Chart.js rendering\n * Sprint 4: State & Charts\n *\n * Requires chart.js peer dependency:\n * ```\n * pnpm add chart.js\n * ```\n */\n\nimport { Component, createEffect, onCleanup, createSignal, Show } from 'solid-js'\nimport type { UIComponent, ChartComponentParams } from '../types'\nimport { ExpandableWrapper, useExpanded } from './ExpandableWrapper'\n\n// Lazy load Chart.js to avoid bundling if not used\nlet ChartJS: any = null\nlet chartJSLoadPromise: Promise<any> | null = null\n\nconst loadChartJS = async () => {\n  if (ChartJS) return ChartJS\n\n  if (!chartJSLoadPromise) {\n    chartJSLoadPromise = import('chart.js/auto')\n      .then((module) => {\n        ChartJS = module.default || module.Chart\n        return ChartJS\n      })\n      .catch((err) => {\n        chartJSLoadPromise = null\n        throw err\n      })\n  }\n\n  return chartJSLoadPromise\n}\n\n/**\n * Check if Chart.js is available\n */\nexport async function isChartJSAvailable(): Promise<boolean> {\n  try {\n    await loadChartJS()\n    return true\n  } catch {\n    return false\n  }\n}\n\nexport interface ChartJSRendererProps {\n  /**\n   * UIComponent with chart params\n   */\n  component: UIComponent\n\n  /**\n   * Error callback\n   */\n  onError?: (error: Error) => void\n}\n\n/**\n * Native Chart.js renderer component\n *\n * @example\n * ```tsx\n * const chartComponent: UIComponent = {\n *   id: 'revenue-chart',\n *   type: 'chart',\n *   position: { colStart: 1, colSpan: 6 },\n *   params: {\n *     type: 'bar',\n *     title: 'Monthly Revenue',\n *     data: {\n *       labels: ['Jan', 'Feb', 'Mar'],\n *       datasets: [{ label: 'Revenue', data: [100, 200, 150] }]\n *     },\n *     renderer: 'native',\n *   },\n * }\n * <ChartJSRenderer component={chartComponent} />\n * ```\n */\nexport const ChartJSRenderer: Component<ChartJSRendererProps> = (props) => {\n  const [isLoading, setIsLoading] = createSignal(true)\n  const [error, setError] = createSignal<string>()\n  let canvasRef: HTMLCanvasElement | undefined\n  let chartInstance: any\n\n  const params = () => props.component.params as ChartComponentParams\n  const isExpanded = useExpanded()\n\n  // v6.1.0 — export visibility :\n  //   - undefined / true  → button shown (new default, was opt-in)\n  //   - false             → button hidden (explicit opt-out, unchanged)\n  const exportEnabled = () => params().exportable !== false\n\n  // v6.1.0 — copy data for the ExpandableWrapper modal-header copy button.\n  // Lazy-stringified each time the button is clicked.\n  const copyDataJSON = () => JSON.stringify({ type: params().type, data: params().data }, null, 2)\n\n  // Chart PNG export\n  const handleExportPNG = () => {\n    if (!canvasRef) return\n    const url = canvasRef.toDataURL('image/png')\n    const a = document.createElement('a')\n    a.href = url\n    a.download = `${(params().title || 'chart').replace(/\\s+/g, '-').toLowerCase()}.png`\n    a.click()\n  }\n\n  // Create/update chart when params change\n  createEffect(async () => {\n    if (!canvasRef) return\n\n    // Access params to track dependencies\n    const chartParams = params()\n\n    setIsLoading(true)\n    setError(undefined)\n\n    try {\n      const Chart = await loadChartJS()\n\n      // Destroy previous instance\n      if (chartInstance) {\n        chartInstance.destroy()\n        chartInstance = null\n      }\n\n      // Build options, merging time-axis config if present (v3.1.0)\n      const baseOptions: any = {\n        responsive: true,\n        maintainAspectRatio: false,\n        ...chartParams.options,\n        plugins: {\n          ...chartParams.options?.plugins,\n          legend: {\n            display: true,\n            position: 'bottom',\n            ...chartParams.options?.plugins?.legend,\n          },\n        },\n      }\n\n      // Time-series axis (v3.1.0)\n      if (chartParams.timeAxis) {\n        const ta = chartParams.timeAxis\n        baseOptions.scales = {\n          ...baseOptions.scales,\n          x: {\n            ...baseOptions.scales?.x,\n            type: 'time',\n            time: {\n              parser: ta.parser,\n              unit: ta.unit,\n              tooltipFormat: ta.tooltipFormat,\n            },\n            ...(ta.min ? { min: ta.min } : {}),\n            ...(ta.max ? { max: ta.max } : {}),\n          },\n        }\n      }\n\n      // Create new chart\n      chartInstance = new Chart(canvasRef, {\n        type: chartParams.type,\n        data: chartParams.data,\n        options: baseOptions,\n      })\n\n      setIsLoading(false)\n    } catch (err) {\n      const error = err instanceof Error ? err : new Error('Chart rendering failed')\n      setError(error.message)\n      setIsLoading(false)\n      props.onError?.(error)\n    }\n  })\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    if (chartInstance) {\n      chartInstance.destroy()\n      chartInstance = null\n    }\n  })\n\n  return (\n    <ExpandableWrapper\n      title={params().title || 'Chart'}\n      copyData={copyDataJSON()}\n      copyLabel=\"Copy chart data (JSON)\"\n    >\n      <div class={`relative w-full bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden p-4 group ${\n        isExpanded() ? 'flex-1 min-h-0 flex flex-col' : ''\n      }`}>\n        <Show when={params().title || exportEnabled()}>\n          <div class=\"flex items-center justify-between mb-3 flex-shrink-0\">\n            <Show when={params().title}>\n              <h3 class=\"text-sm font-semibold text-gray-900 dark:text-white\">\n                {params().title}\n              </h3>\n            </Show>\n            <Show when={exportEnabled()}>\n              <button\n                onClick={handleExportPNG}\n                class=\"opacity-0 group-hover:opacity-60 hover:!opacity-100 px-2 py-1 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm\"\n                title=\"Download PNG\"\n                aria-label=\"Download chart as PNG\"\n              >\n                <svg class=\"w-3 h-3 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                  <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n                </svg>\n              </button>\n            </Show>\n          </div>\n        </Show>\n\n        <Show when={isLoading()}>\n          <div class=\"absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-800/80\">\n            <div class=\"flex flex-col items-center gap-2\">\n              <div class=\"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600\" />\n              <span class=\"text-sm text-gray-500 dark:text-gray-400\">Loading chart...</span>\n            </div>\n          </div>\n        </Show>\n\n        <Show when={error()}>\n          <div class=\"absolute inset-0 flex items-center justify-center p-4 bg-white dark:bg-gray-800\">\n            <div class=\"text-center\">\n              <div class=\"inline-flex items-center justify-center w-12 h-12 rounded-full bg-red-100 dark:bg-red-900/20 mb-3\">\n                <svg\n                  class=\"w-6 h-6 text-red-600 dark:text-red-400\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                >\n                  <path\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                    stroke-width=\"2\"\n                    d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n                  />\n                </svg>\n              </div>\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 max-w-xs\">{error()}</p>\n            </div>\n          </div>\n        </Show>\n\n        <div\n          class={`w-full ${isExpanded() ? 'flex-1 min-h-0' : ''}`}\n          style={\n            error()\n              ? { display: 'none' }\n              : isExpanded()\n                ? { height: '100%', display: 'block' }\n                : { height: params().height || '250px', display: 'block' }\n          }\n        >\n          <canvas ref={canvasRef} />\n        </div>\n      </div>\n    </ExpandableWrapper>\n  )\n}\n"],"names":["ChartJS","chartJSLoadPromise","loadChartJS","then","module","default","Chart","catch","err","isChartJSAvailable","ChartJSRenderer","props","isLoading","setIsLoading","createSignal","error","setError","canvasRef","chartInstance","params","component","isExpanded","useExpanded","exportEnabled","exportable","copyDataJSON","JSON","stringify","type","data","handleExportPNG","url","toDataURL","a","document","createElement","href","download","title","replace","toLowerCase","click","createEffect","chartParams","undefined","destroy","baseOptions","responsive","maintainAspectRatio","options","plugins","legend","display","position","timeAxis","ta","scales","x","time","parser","unit","tooltipFormat","min","max","Error","message","onError","onCleanup","_$createComponent","ExpandableWrapper","copyData","copyLabel","children","_el$","_$getNextElement","_tmpl$6","_el$15","firstChild","_el$16","_co$3","_$getNextMarker","nextSibling","_el$17","_el$18","_co$4","_el$19","_el$20","_co$5","_el$13","_el$14","_$insert","Show","when","_el$2","_tmpl$3","_el$5","_el$6","_co$","_el$7","_el$8","_co$2","_el$3","_tmpl$","_el$4","_tmpl$2","$$click","_$runHydrationEvents","_tmpl$4","_el$0","_tmpl$5","_el$1","_el$10","_el$11","_el$12","_ref$","_$use","_$effect","_p$","_v$","_v$2","_v$3","height","e","_$className","t","_$style","_$delegateEvents"],"mappings":"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"}

package/dist/components/ExpandableWrapper.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const web = require("solid-js/web");
 const solidJs = require("solid-js");
-var _tmpl$ = /* @__PURE__ */ web.template(`<svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">`), _tmpl$2 = /* @__PURE__ */ web.template(`<button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">`), _tmpl$3 = /* @__PURE__ */ web.template(`<div class="fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm"role=dialog aria-modal=true tabindex=-1 style="animation:expandable-fade-in 0.15s ease-out"><div class="relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden"style="animation:expandable-scale-in 0.15s ease-out"><div class="flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0"><h2 class="text-lg font-semibold text-gray-900 dark:text-white truncate"></h2><div class="flex items-center gap-2"><!$><!/><button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"aria-label="Close expanded view"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div><div class="flex-1 overflow-auto p-4">`), _tmpl$4 = /* @__PURE__ */ web.template(`<style>
+var _tmpl$ = /* @__PURE__ */ web.template(`<svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">`), _tmpl$2 = /* @__PURE__ */ web.template(`<button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">`), _tmpl$3 = /* @__PURE__ */ web.template(`<div class="fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm"role=dialog aria-modal=true tabindex=-1 style="animation:expandable-fade-in 0.15s ease-out"><div class="relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden"style="animation:expandable-scale-in 0.15s ease-out"><div class="flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0"><h2 class="text-lg font-semibold text-gray-900 dark:text-white truncate"></h2><div class="flex items-center gap-2"><!$><!/><button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"aria-label="Close expanded view"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div><div class="flex-1 min-h-0 overflow-auto p-4 flex flex-col">`), _tmpl$4 = /* @__PURE__ */ web.template(`<style>
             @keyframes expandable-fade-in {
               from { opacity: 0; }
               to { opacity: 1; }

package/dist/components/ExpandableWrapper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableWrapper.cjs","sources":["../../src/components/ExpandableWrapper.tsx"],"sourcesContent":["/**\n * ExpandableWrapper - Generic expand/fullscreen wrapper for components\n * v2.2.0: Reusable wrapper that adds expand button + fullscreen modal\n *\n * Uses DOM reparenting to avoid rendering children twice — critical for\n * imperative components like ChartJS that bind instances to DOM nodes.\n */\n\nimport { Component, Show, createSignal, createEffect, onCleanup, JSX, createContext, useContext, Accessor } from 'solid-js'\nimport { Portal } from 'solid-js/web'\n\n/** Context for child components to know if they're in expanded/fullscreen view */\nconst ExpandedContext = createContext<Accessor<boolean>>(() => false)\n\n/** Hook for child components to read expanded state */\nexport const useExpanded = () => useContext(ExpandedContext)\n\nexport interface ExpandableWrapperProps {\n  /** Content to render inline (and in expanded view) */\n  children: JSX.Element\n  /** Title shown in the expanded modal header */\n  title?: string\n  /** Data string for copy-to-clipboard in expanded view */\n  copyData?: string\n  /** Label for copy button tooltip */\n  copyLabel?: string\n}\n\n/**\n * Wraps any component with an expand button (top-right corner).\n * Opens a fullscreen Portal modal. The children's DOM is physically\n * reparented into the modal (not duplicated), so imperative bindings\n * like Chart.js canvas refs stay intact.\n *\n * @example\n * <ExpandableWrapper title=\"Sales Data\" copyData={tsvData}>\n *   <TableRenderer ... />\n * </ExpandableWrapper>\n */\nexport const ExpandableWrapper: Component<ExpandableWrapperProps> = (props) => {\n  const [isExpanded, setIsExpanded] = createSignal(false)\n  const [copied, setCopied] = createSignal(false)\n  let dialogRef: HTMLDivElement | undefined\n  let contentRef: HTMLDivElement | undefined\n  let inlineSlotRef: HTMLDivElement | undefined\n  let modalSlotRef: HTMLDivElement | undefined\n\n  const handleOpen = () => setIsExpanded(true)\n  const handleClose = () => setIsExpanded(false)\n\n  // Reparent content DOM between inline and modal slots\n  createEffect(() => {\n    if (!contentRef) return\n\n    if (isExpanded()) {\n      // Move content into modal\n      modalSlotRef?.appendChild(contentRef)\n    } else {\n      // Move content back to inline\n      inlineSlotRef?.appendChild(contentRef)\n    }\n  })\n\n  // Keyboard: Escape to close\n  createEffect(() => {\n    if (!isExpanded()) return\n\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        handleClose()\n      }\n    }\n\n    document.addEventListener('keydown', onKeyDown)\n    onCleanup(() => document.removeEventListener('keydown', onKeyDown))\n  })\n\n  // Prevent body scroll when expanded\n  createEffect(() => {\n    if (isExpanded()) {\n      const prev = document.body.style.overflow\n      document.body.style.overflow = 'hidden'\n      // Focus the dialog\n      setTimeout(() => dialogRef?.focus(), 10)\n      onCleanup(() => {\n        document.body.style.overflow = prev\n      })\n    }\n  })\n\n  const handleBackdropClick = (e: MouseEvent) => {\n    if (e.target === e.currentTarget) handleClose()\n  }\n\n  const handleCopy = async () => {\n    if (!props.copyData) return\n    try {\n      await navigator.clipboard.writeText(props.copyData)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    } catch (err) {\n      console.error('Failed to copy:', err)\n    }\n  }\n\n  return (\n    <div class=\"relative group\">\n      {/* Inline slot — content lives here when not expanded */}\n      <div ref={inlineSlotRef}>\n        <div ref={contentRef}>\n          <ExpandedContext.Provider value={isExpanded}>\n            {props.children}\n          </ExpandedContext.Provider>\n        </div>\n      </div>\n\n      {/* Expand button — visible on hover */}\n      <button\n        onClick={handleOpen}\n        class=\"absolute top-2 right-2 z-10 opacity-0 group-hover:opacity-70 hover:!opacity-100 p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm\"\n        title=\"Expand\"\n        aria-label=\"Expand to fullscreen\"\n      >\n        <svg class=\"w-3.5 h-3.5 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5\" />\n        </svg>\n      </button>\n\n      {/* Fullscreen modal via Portal */}\n      <Show when={isExpanded()}>\n        <Portal>\n          <div\n            class=\"fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm\"\n            style={{ animation: 'expandable-fade-in 0.15s ease-out' }}\n            onClick={handleBackdropClick}\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={props.title || 'Expanded view'}\n            tabIndex={-1}\n            ref={dialogRef}\n          >\n            {/* Modal panel */}\n            <div\n              class=\"relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden\"\n              style={{ animation: 'expandable-scale-in 0.15s ease-out' }}\n              onClick={(e) => e.stopPropagation()}\n            >\n              {/* Header */}\n              <div class=\"flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0\">\n                <h2 class=\"text-lg font-semibold text-gray-900 dark:text-white truncate\">\n                  {props.title || 'Expanded View'}\n                </h2>\n                <div class=\"flex items-center gap-2\">\n                  {/* Copy button */}\n                  <Show when={props.copyData}>\n                    <button\n                      onClick={handleCopy}\n                      class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                      title={props.copyLabel || 'Copy to clipboard'}\n                      aria-label={props.copyLabel || 'Copy to clipboard'}\n                    >\n                      <Show\n                        when={!copied()}\n                        fallback={\n                          <svg class=\"w-5 h-5 text-green-500\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\" />\n                          </svg>\n                        }\n                      >\n                        <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\" />\n                        </svg>\n                      </Show>\n                    </button>\n                  </Show>\n                  {/* Close button */}\n                  <button\n                    onClick={handleClose}\n                    class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                    aria-label=\"Close expanded view\"\n                  >\n                    <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                      <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n\n              {/* Modal slot — content is reparented here when expanded */}\n              <div class=\"flex-1 overflow-auto p-4\" ref={modalSlotRef} />\n            </div>\n          </div>\n\n          <style>{`\n            @keyframes expandable-fade-in {\n              from { opacity: 0; }\n              to { opacity: 1; }\n            }\n            @keyframes expandable-scale-in {\n              from { opacity: 0; transform: scale(0.97); }\n              to { opacity: 1; transform: scale(1); }\n            }\n          `}</style>\n        </Portal>\n      </Show>\n    </div>\n  )\n}\n"],"names":["ExpandedContext","createContext","useExpanded","useContext","ExpandableWrapper","props","isExpanded","setIsExpanded","createSignal","copied","setCopied","dialogRef","contentRef","inlineSlotRef","modalSlotRef","handleOpen","handleClose","createEffect","appendChild","onKeyDown","e","key","preventDefault","document","addEventListener","onCleanup","removeEventListener","prev","body","style","overflow","setTimeout","focus","handleBackdropClick","target","currentTarget","handleCopy","copyData","navigator","clipboard","writeText","err","console","error","_el$","_$getNextElement","_tmpl$5","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$15","_el$16","_co$2","_$getNextMarker","_ref$","_$use","_ref$2","_$insert","_$createComponent","Provider","value","children","$$click","Show","when","Portal","_el$5","_tmpl$3","_el$6","_el$7","_el$8","_el$9","_el$11","_el$12","_co$","_el$10","_el$13","_ref$3","stopPropagation","title","_el$0","_tmpl$2","fallback","_tmpl$6","_tmpl$","_$effect","_p$","_v$","copyLabel","_v$2","_$setAttribute","t","undefined","_$runHydrationEvents","_ref$4","_tmpl$4","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"ExpandableWrapper.cjs","sources":["../../src/components/ExpandableWrapper.tsx"],"sourcesContent":["/**\n * ExpandableWrapper - Generic expand/fullscreen wrapper for components\n * v2.2.0: Reusable wrapper that adds expand button + fullscreen modal\n *\n * Uses DOM reparenting to avoid rendering children twice — critical for\n * imperative components like ChartJS that bind instances to DOM nodes.\n */\n\nimport { Component, Show, createSignal, createEffect, onCleanup, JSX, createContext, useContext, Accessor } from 'solid-js'\nimport { Portal } from 'solid-js/web'\n\n/** Context for child components to know if they're in expanded/fullscreen view */\nconst ExpandedContext = createContext<Accessor<boolean>>(() => false)\n\n/** Hook for child components to read expanded state */\nexport const useExpanded = () => useContext(ExpandedContext)\n\nexport interface ExpandableWrapperProps {\n  /** Content to render inline (and in expanded view) */\n  children: JSX.Element\n  /** Title shown in the expanded modal header */\n  title?: string\n  /** Data string for copy-to-clipboard in expanded view */\n  copyData?: string\n  /** Label for copy button tooltip */\n  copyLabel?: string\n}\n\n/**\n * Wraps any component with an expand button (top-right corner).\n * Opens a fullscreen Portal modal. The children's DOM is physically\n * reparented into the modal (not duplicated), so imperative bindings\n * like Chart.js canvas refs stay intact.\n *\n * @example\n * <ExpandableWrapper title=\"Sales Data\" copyData={tsvData}>\n *   <TableRenderer ... />\n * </ExpandableWrapper>\n */\nexport const ExpandableWrapper: Component<ExpandableWrapperProps> = (props) => {\n  const [isExpanded, setIsExpanded] = createSignal(false)\n  const [copied, setCopied] = createSignal(false)\n  let dialogRef: HTMLDivElement | undefined\n  let contentRef: HTMLDivElement | undefined\n  let inlineSlotRef: HTMLDivElement | undefined\n  let modalSlotRef: HTMLDivElement | undefined\n\n  const handleOpen = () => setIsExpanded(true)\n  const handleClose = () => setIsExpanded(false)\n\n  // Reparent content DOM between inline and modal slots\n  createEffect(() => {\n    if (!contentRef) return\n\n    if (isExpanded()) {\n      // Move content into modal\n      modalSlotRef?.appendChild(contentRef)\n    } else {\n      // Move content back to inline\n      inlineSlotRef?.appendChild(contentRef)\n    }\n  })\n\n  // Keyboard: Escape to close\n  createEffect(() => {\n    if (!isExpanded()) return\n\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        handleClose()\n      }\n    }\n\n    document.addEventListener('keydown', onKeyDown)\n    onCleanup(() => document.removeEventListener('keydown', onKeyDown))\n  })\n\n  // Prevent body scroll when expanded\n  createEffect(() => {\n    if (isExpanded()) {\n      const prev = document.body.style.overflow\n      document.body.style.overflow = 'hidden'\n      // Focus the dialog\n      setTimeout(() => dialogRef?.focus(), 10)\n      onCleanup(() => {\n        document.body.style.overflow = prev\n      })\n    }\n  })\n\n  const handleBackdropClick = (e: MouseEvent) => {\n    if (e.target === e.currentTarget) handleClose()\n  }\n\n  const handleCopy = async () => {\n    if (!props.copyData) return\n    try {\n      await navigator.clipboard.writeText(props.copyData)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    } catch (err) {\n      console.error('Failed to copy:', err)\n    }\n  }\n\n  return (\n    <div class=\"relative group\">\n      {/* Inline slot — content lives here when not expanded */}\n      <div ref={inlineSlotRef}>\n        <div ref={contentRef}>\n          <ExpandedContext.Provider value={isExpanded}>\n            {props.children}\n          </ExpandedContext.Provider>\n        </div>\n      </div>\n\n      {/* Expand button — visible on hover */}\n      <button\n        onClick={handleOpen}\n        class=\"absolute top-2 right-2 z-10 opacity-0 group-hover:opacity-70 hover:!opacity-100 p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm\"\n        title=\"Expand\"\n        aria-label=\"Expand to fullscreen\"\n      >\n        <svg class=\"w-3.5 h-3.5 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5\" />\n        </svg>\n      </button>\n\n      {/* Fullscreen modal via Portal */}\n      <Show when={isExpanded()}>\n        <Portal>\n          <div\n            class=\"fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm\"\n            style={{ animation: 'expandable-fade-in 0.15s ease-out' }}\n            onClick={handleBackdropClick}\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={props.title || 'Expanded view'}\n            tabIndex={-1}\n            ref={dialogRef}\n          >\n            {/* Modal panel */}\n            <div\n              class=\"relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden\"\n              style={{ animation: 'expandable-scale-in 0.15s ease-out' }}\n              onClick={(e) => e.stopPropagation()}\n            >\n              {/* Header */}\n              <div class=\"flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0\">\n                <h2 class=\"text-lg font-semibold text-gray-900 dark:text-white truncate\">\n                  {props.title || 'Expanded View'}\n                </h2>\n                <div class=\"flex items-center gap-2\">\n                  {/* Copy button */}\n                  <Show when={props.copyData}>\n                    <button\n                      onClick={handleCopy}\n                      class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                      title={props.copyLabel || 'Copy to clipboard'}\n                      aria-label={props.copyLabel || 'Copy to clipboard'}\n                    >\n                      <Show\n                        when={!copied()}\n                        fallback={\n                          <svg class=\"w-5 h-5 text-green-500\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\" />\n                          </svg>\n                        }\n                      >\n                        <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\" />\n                        </svg>\n                      </Show>\n                    </button>\n                  </Show>\n                  {/* Close button */}\n                  <button\n                    onClick={handleClose}\n                    class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                    aria-label=\"Close expanded view\"\n                  >\n                    <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                      <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n\n              {/* Modal slot — content is reparented here when expanded.\n                  v6.1.0 : `flex flex-col` lets aware children opt into\n                  `flex-1 min-h-0` to fill the modal vertically (chart,\n                  table, map, graph). Unaware children keep working\n                  thanks to `overflow-auto` (their natural height\n                  scrolls if it overflows the slot). */}\n              <div class=\"flex-1 min-h-0 overflow-auto p-4 flex flex-col\" ref={modalSlotRef} />\n            </div>\n          </div>\n\n          <style>{`\n            @keyframes expandable-fade-in {\n              from { opacity: 0; }\n              to { opacity: 1; }\n            }\n            @keyframes expandable-scale-in {\n              from { opacity: 0; transform: scale(0.97); }\n              to { opacity: 1; transform: scale(1); }\n            }\n          `}</style>\n        </Portal>\n      </Show>\n    </div>\n  )\n}\n"],"names":["ExpandedContext","createContext","useExpanded","useContext","ExpandableWrapper","props","isExpanded","setIsExpanded","createSignal","copied","setCopied","dialogRef","contentRef","inlineSlotRef","modalSlotRef","handleOpen","handleClose","createEffect","appendChild","onKeyDown","e","key","preventDefault","document","addEventListener","onCleanup","removeEventListener","prev","body","style","overflow","setTimeout","focus","handleBackdropClick","target","currentTarget","handleCopy","copyData","navigator","clipboard","writeText","err","console","error","_el$","_$getNextElement","_tmpl$5","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$15","_el$16","_co$2","_$getNextMarker","_ref$","_$use","_ref$2","_$insert","_$createComponent","Provider","value","children","$$click","Show","when","Portal","_el$5","_tmpl$3","_el$6","_el$7","_el$8","_el$9","_el$11","_el$12","_co$","_el$10","_el$13","_ref$3","stopPropagation","title","_el$0","_tmpl$2","fallback","_tmpl$6","_tmpl$","_$effect","_p$","_v$","copyLabel","_v$2","_$setAttribute","t","undefined","_$runHydrationEvents","_ref$4","_tmpl$4","_$delegateEvents"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"ExpandableWrapper.d.ts","sourceRoot":"","sources":["../../src/components/ExpandableWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,SAAS,EAA+C,GAAG,EAA6B,QAAQ,EAAE,MAAM,UAAU,CAAA;AAM3H,uDAAuD;AACvD,eAAO,MAAM,WAAW,yBAAoC,CAAA;AAE5D,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAA;IACrB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,iBAAiB,EAAE,SAAS,CAAC,sBAAsB,CAyK/D,CAAA"}
+{"version":3,"file":"ExpandableWrapper.d.ts","sourceRoot":"","sources":["../../src/components/ExpandableWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,SAAS,EAA+C,GAAG,EAA6B,QAAQ,EAAE,MAAM,UAAU,CAAA;AAM3H,uDAAuD;AACvD,eAAO,MAAM,WAAW,yBAAoC,CAAA;AAE5D,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAA;IACrB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,iBAAiB,EAAE,SAAS,CAAC,sBAAsB,CA8K/D,CAAA"}

package/dist/components/ExpandableWrapper.js

@@ -1,6 +1,6 @@
 import { delegateEvents, getNextElement, template, getNextMarker, insert, createComponent, Portal, use, effect, setAttribute, runHydrationEvents } from "solid-js/web";
 import { createContext, useContext, createSignal, createEffect, onCleanup, Show } from "solid-js";
-var _tmpl$ = /* @__PURE__ */ template(`<svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">`), _tmpl$2 = /* @__PURE__ */ template(`<button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">`), _tmpl$3 = /* @__PURE__ */ template(`<div class="fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm"role=dialog aria-modal=true tabindex=-1 style="animation:expandable-fade-in 0.15s ease-out"><div class="relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden"style="animation:expandable-scale-in 0.15s ease-out"><div class="flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0"><h2 class="text-lg font-semibold text-gray-900 dark:text-white truncate"></h2><div class="flex items-center gap-2"><!$><!/><button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"aria-label="Close expanded view"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div><div class="flex-1 overflow-auto p-4">`), _tmpl$4 = /* @__PURE__ */ template(`<style>
+var _tmpl$ = /* @__PURE__ */ template(`<svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">`), _tmpl$2 = /* @__PURE__ */ template(`<button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">`), _tmpl$3 = /* @__PURE__ */ template(`<div class="fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm"role=dialog aria-modal=true tabindex=-1 style="animation:expandable-fade-in 0.15s ease-out"><div class="relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden"style="animation:expandable-scale-in 0.15s ease-out"><div class="flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0"><h2 class="text-lg font-semibold text-gray-900 dark:text-white truncate"></h2><div class="flex items-center gap-2"><!$><!/><button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"aria-label="Close expanded view"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div><div class="flex-1 min-h-0 overflow-auto p-4 flex flex-col">`), _tmpl$4 = /* @__PURE__ */ template(`<style>
             @keyframes expandable-fade-in {
               from { opacity: 0; }
               to { opacity: 1; }