@sqlrooms/vega 0.29.0-rc.1 → 0.29.0-rc.3

package/dist/VegaLiteArrowChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VegaLiteArrowChart.d.ts","sourceRoot":"","sources":["../src/VegaLiteArrowChart.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AAGtC,OAAO,EAAC,YAAY,EAAE,iBAAiB,EAAC,MAAM,YAAY,CAAC;AAS3D,MAAM,MAAM,uBAAuB,GAAG;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,MAAM,GAAG,iBAAiB,CAAC;IACjC,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,UAAU,EAAE,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC;IACpC;;;;;;;;;;;;OAYG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,wBAAgB,0BAA0B,CACxC,OAAO,CAAC,EAAE,YAAY,GACrB,YAAY,CAcd;AAsHD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,kBAAkB;IAC7B;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;CAEH,CAAC"}
+{"version":3,"file":"VegaLiteArrowChart.d.ts","sourceRoot":"","sources":["../src/VegaLiteArrowChart.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AAGtC,OAAO,EAAC,YAAY,EAAE,iBAAiB,EAAC,MAAM,YAAY,CAAC;AAS3D,MAAM,MAAM,uBAAuB,GAAG;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,MAAM,GAAG,iBAAiB,CAAC;IACjC,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,UAAU,EAAE,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC;IACpC;;;;;;;;;;;;OAYG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,wBAAgB,0BAA0B,CACxC,OAAO,CAAC,EAAE,YAAY,GACrB,YAAY,CAed;AAsHD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,kBAAkB;IAC7B;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;CAEH,CAAC"}

package/dist/VegaLiteArrowChart.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ToolErrorMessage } from '@sqlrooms/ai';
+import { ToolErrorMessage } from '@sqlrooms/ai-core';
 import { arrowTableToJson } from '@sqlrooms/duckdb';
 import { AspectRatio, cn, useAspectRatioDimensions, useTheme, } from '@sqlrooms/ui';
 import { safeJsonParse } from '@sqlrooms/utils';
@@ -14,6 +14,7 @@ import { VegaExportAction } from './VegaExportAction';
 export function makeDefaultVegaLiteOptions(options) {
     return {
         mode: 'vega-lite',
+        renderer: 'svg',
         theme: undefined,
         tooltip: true,
         actions: false,

package/dist/VegaLiteArrowChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"VegaLiteArrowChart.js","sourceRoot":"","sources":["../src/VegaLiteArrowChart.tsx"],"names":[],"mappings":"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","sourcesContent":["import {ToolErrorMessage} from '@sqlrooms/ai';\nimport {arrowTableToJson} from '@sqlrooms/duckdb';\nimport {\n  AspectRatio,\n  cn,\n  useAspectRatioDimensions,\n  useTheme,\n} from '@sqlrooms/ui';\nimport {safeJsonParse} from '@sqlrooms/utils';\nimport * as arrow from 'apache-arrow';\nimport {useCallback, useEffect, useMemo, useRef, useState} from 'react';\nimport {useVegaEmbed} from 'react-vega';\nimport {EmbedOptions, VisualizationSpec} from 'vega-embed';\nimport {Config} from 'vega-lite';\nimport {darkTheme} from './themes/darkTheme';\nimport {lightTheme} from './themes/lightTheme';\nimport {VegaChartActions} from './VegaChartActions';\nimport {VegaChartContextProvider} from './VegaChartContext';\nimport {VegaEditAction} from './VegaEditAction';\nimport {VegaExportAction} from './VegaExportAction';\n\nexport type VegaLiteArrowChartProps = {\n  className?: string;\n  width?: number | 'auto';\n  height?: number | 'auto';\n  aspectRatio?: number;\n  spec: string | VisualizationSpec;\n  options?: EmbedOptions;\n  arrowTable: arrow.Table | undefined;\n  /**\n   * Children for composing actions and other elements.\n   * Use VegaLiteArrowChart.Actions to add action buttons.\n   *\n   * @example\n   * ```tsx\n   * <VegaLiteArrowChart spec={spec} arrowTable={data}>\n   *   <VegaLiteArrowChart.Actions>\n   *     <VegaExportAction />\n   *   </VegaLiteArrowChart.Actions>\n   * </VegaLiteArrowChart>\n   * ```\n   */\n  children?: React.ReactNode;\n};\n\nexport function makeDefaultVegaLiteOptions(\n  options?: EmbedOptions,\n): EmbedOptions {\n  return {\n    mode: 'vega-lite',\n    theme: undefined,\n    tooltip: true,\n    actions: false,\n    padding: {\n      top: 20,\n      right: 10,\n      bottom: 10,\n      left: 10,\n    },\n    ...options,\n  };\n}\n\nconst VegaLiteArrowChartBase: React.FC<VegaLiteArrowChartProps> = ({\n  className,\n  aspectRatio = 16 / 9,\n  spec,\n  arrowTable,\n  options: propsOptions,\n  width = 'auto',\n  height = 'auto',\n  children,\n}) => {\n  const {theme} = useTheme();\n\n  const options = useMemo(\n    () =>\n      makeDefaultVegaLiteOptions({\n        config: {\n          ...(theme === 'dark' ? darkTheme : lightTheme),\n          ...(typeof propsOptions?.config === 'object'\n            ? (propsOptions.config as Config)\n            : {}),\n        },\n\n        ...propsOptions,\n      }),\n    [theme, propsOptions],\n  );\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [chartError, setChartError] = useState<Error | null>(null);\n\n  const data = useMemo(() => {\n    if (!arrowTable) return null;\n    return {values: arrowTableToJson(arrowTable)};\n  }, [arrowTable]);\n\n  const specWithData = useMemo(() => {\n    const parsed = typeof spec === 'string' ? safeJsonParse(spec) : spec;\n    if (!parsed) {\n      setChartError(new Error('Invalid Vega-Lite specification'));\n      return null;\n    }\n    return {\n      padding: 10,\n      background: 'transparent',\n      ...parsed,\n      data: data,\n      // Override the following props to ensure the chart is responsive\n      width: 'container',\n      height: 'container',\n      autosize: {contains: 'padding'},\n    } as VisualizationSpec;\n  }, [spec, data]);\n\n  // Reset chart error whenever spec or data changes\n  useEffect(() => {\n    setChartError(null);\n  }, [spec, data]);\n\n  const ref = useRef<HTMLDivElement>(null);\n  const embed = useVegaEmbed({\n    ref,\n    spec: specWithData ?? '',\n    onError: () => setChartError,\n    options,\n  });\n\n  const dimensions = useAspectRatioDimensions({\n    containerRef,\n    width,\n    height,\n    aspectRatio,\n  });\n  const changeDimensions = useCallback(\n    (width: number, height: number) => {\n      embed?.view.width(width).height(height).runAsync();\n    },\n    [embed],\n  );\n  useEffect(() => {\n    changeDimensions(dimensions.width, dimensions.height);\n  }, [changeDimensions, dimensions.width, dimensions.height]);\n\n  return (\n    <VegaChartContextProvider value={{embed}}>\n      <div\n        ref={containerRef}\n        className={cn('relative flex h-full w-full flex-col gap-2', className)}\n      >\n        <div className=\"peer relative\">\n          {chartError ? (\n            <ToolErrorMessage\n              error={chartError}\n              triggerLabel=\"Chart rendering failed\"\n              title=\"Chart error\"\n              align=\"start\"\n              details={spec}\n            />\n          ) : (\n            specWithData &&\n            data && (\n              <AspectRatio\n                ratio={aspectRatio}\n                className=\"overflow-visible\"\n                asChild\n              >\n                <div ref={ref} className=\"[&_svg]:overflow-visible\" />\n              </AspectRatio>\n            )\n          )}\n        </div>\n        {children}\n      </div>\n    </VegaChartContextProvider>\n  );\n};\n\n/**\n * Composable Vega-Lite chart component with support for custom actions.\n *\n * @example\n * ```tsx\n * // Basic usage without actions (backwards compatible)\n * <VegaLiteArrowChart spec={spec} arrowTable={data} />\n *\n * // With export action\n * <VegaLiteArrowChart spec={spec} arrowTable={data}>\n *   <VegaLiteArrowChart.Actions>\n *     <VegaExportAction />\n *   </VegaLiteArrowChart.Actions>\n * </VegaLiteArrowChart>\n *\n * // Custom actions with separator\n * <VegaLiteArrowChart spec={spec} arrowTable={data}>\n *   <VegaLiteArrowChart.Actions>\n *     <VegaExportAction pngScale={3} />\n *     <Separator orientation=\"vertical\" className=\"h-4\" />\n *     <Button size=\"xs\" variant=\"ghost\" onClick={handleRefresh}>\n *       <RefreshCw className=\"h-4 w-4\" />\n *     </Button>\n *   </VegaLiteArrowChart.Actions>\n * </VegaLiteArrowChart>\n * ```\n */\nexport const VegaLiteArrowChart = Object.assign(VegaLiteArrowChartBase, {\n  /**\n   * Container for action buttons, positioned as an overlay\n   */\n  Actions: VegaChartActions,\n  /**\n   * Built-in export action with PNG/SVG download\n   */\n  ExportAction: VegaExportAction,\n  /**\n   * Built-in edit action with spec/SQL editor popover\n   */\n  EditAction: VegaEditAction,\n});\n"]}
+{"version":3,"file":"VegaLiteArrowChart.js","sourceRoot":"","sources":["../src/VegaLiteArrowChart.tsx"],"names":[],"mappings":"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","sourcesContent":["import {ToolErrorMessage} from '@sqlrooms/ai-core';\nimport {arrowTableToJson} from '@sqlrooms/duckdb';\nimport {\n  AspectRatio,\n  cn,\n  useAspectRatioDimensions,\n  useTheme,\n} from '@sqlrooms/ui';\nimport {safeJsonParse} from '@sqlrooms/utils';\nimport * as arrow from 'apache-arrow';\nimport {useCallback, useEffect, useMemo, useRef, useState} from 'react';\nimport {useVegaEmbed} from 'react-vega';\nimport {EmbedOptions, VisualizationSpec} from 'vega-embed';\nimport {Config} from 'vega-lite';\nimport {darkTheme} from './themes/darkTheme';\nimport {lightTheme} from './themes/lightTheme';\nimport {VegaChartActions} from './VegaChartActions';\nimport {VegaChartContextProvider} from './VegaChartContext';\nimport {VegaEditAction} from './VegaEditAction';\nimport {VegaExportAction} from './VegaExportAction';\n\nexport type VegaLiteArrowChartProps = {\n  className?: string;\n  width?: number | 'auto';\n  height?: number | 'auto';\n  aspectRatio?: number;\n  spec: string | VisualizationSpec;\n  options?: EmbedOptions;\n  arrowTable: arrow.Table | undefined;\n  /**\n   * Children for composing actions and other elements.\n   * Use VegaLiteArrowChart.Actions to add action buttons.\n   *\n   * @example\n   * ```tsx\n   * <VegaLiteArrowChart spec={spec} arrowTable={data}>\n   *   <VegaLiteArrowChart.Actions>\n   *     <VegaExportAction />\n   *   </VegaLiteArrowChart.Actions>\n   * </VegaLiteArrowChart>\n   * ```\n   */\n  children?: React.ReactNode;\n};\n\nexport function makeDefaultVegaLiteOptions(\n  options?: EmbedOptions,\n): EmbedOptions {\n  return {\n    mode: 'vega-lite',\n    renderer: 'svg',\n    theme: undefined,\n    tooltip: true,\n    actions: false,\n    padding: {\n      top: 20,\n      right: 10,\n      bottom: 10,\n      left: 10,\n    },\n    ...options,\n  };\n}\n\nconst VegaLiteArrowChartBase: React.FC<VegaLiteArrowChartProps> = ({\n  className,\n  aspectRatio = 16 / 9,\n  spec,\n  arrowTable,\n  options: propsOptions,\n  width = 'auto',\n  height = 'auto',\n  children,\n}) => {\n  const {theme} = useTheme();\n\n  const options = useMemo(\n    () =>\n      makeDefaultVegaLiteOptions({\n        config: {\n          ...(theme === 'dark' ? darkTheme : lightTheme),\n          ...(typeof propsOptions?.config === 'object'\n            ? (propsOptions.config as Config)\n            : {}),\n        },\n\n        ...propsOptions,\n      }),\n    [theme, propsOptions],\n  );\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [chartError, setChartError] = useState<Error | null>(null);\n\n  const data = useMemo(() => {\n    if (!arrowTable) return null;\n    return {values: arrowTableToJson(arrowTable)};\n  }, [arrowTable]);\n\n  const specWithData = useMemo(() => {\n    const parsed = typeof spec === 'string' ? safeJsonParse(spec) : spec;\n    if (!parsed) {\n      setChartError(new Error('Invalid Vega-Lite specification'));\n      return null;\n    }\n    return {\n      padding: 10,\n      background: 'transparent',\n      ...parsed,\n      data: data,\n      // Override the following props to ensure the chart is responsive\n      width: 'container',\n      height: 'container',\n      autosize: {contains: 'padding'},\n    } as VisualizationSpec;\n  }, [spec, data]);\n\n  // Reset chart error whenever spec or data changes\n  useEffect(() => {\n    setChartError(null);\n  }, [spec, data]);\n\n  const ref = useRef<HTMLDivElement>(null);\n  const embed = useVegaEmbed({\n    ref,\n    spec: specWithData ?? '',\n    onError: () => setChartError,\n    options,\n  });\n\n  const dimensions = useAspectRatioDimensions({\n    containerRef,\n    width,\n    height,\n    aspectRatio,\n  });\n  const changeDimensions = useCallback(\n    (width: number, height: number) => {\n      embed?.view.width(width).height(height).runAsync();\n    },\n    [embed],\n  );\n  useEffect(() => {\n    changeDimensions(dimensions.width, dimensions.height);\n  }, [changeDimensions, dimensions.width, dimensions.height]);\n\n  return (\n    <VegaChartContextProvider value={{embed}}>\n      <div\n        ref={containerRef}\n        className={cn('relative flex h-full w-full flex-col gap-2', className)}\n      >\n        <div className=\"peer relative\">\n          {chartError ? (\n            <ToolErrorMessage\n              error={chartError}\n              triggerLabel=\"Chart rendering failed\"\n              title=\"Chart error\"\n              align=\"start\"\n              details={spec}\n            />\n          ) : (\n            specWithData &&\n            data && (\n              <AspectRatio\n                ratio={aspectRatio}\n                className=\"overflow-visible\"\n                asChild\n              >\n                <div ref={ref} className=\"[&_svg]:overflow-visible\" />\n              </AspectRatio>\n            )\n          )}\n        </div>\n        {children}\n      </div>\n    </VegaChartContextProvider>\n  );\n};\n\n/**\n * Composable Vega-Lite chart component with support for custom actions.\n *\n * @example\n * ```tsx\n * // Basic usage without actions (backwards compatible)\n * <VegaLiteArrowChart spec={spec} arrowTable={data} />\n *\n * // With export action\n * <VegaLiteArrowChart spec={spec} arrowTable={data}>\n *   <VegaLiteArrowChart.Actions>\n *     <VegaExportAction />\n *   </VegaLiteArrowChart.Actions>\n * </VegaLiteArrowChart>\n *\n * // Custom actions with separator\n * <VegaLiteArrowChart spec={spec} arrowTable={data}>\n *   <VegaLiteArrowChart.Actions>\n *     <VegaExportAction pngScale={3} />\n *     <Separator orientation=\"vertical\" className=\"h-4\" />\n *     <Button size=\"xs\" variant=\"ghost\" onClick={handleRefresh}>\n *       <RefreshCw className=\"h-4 w-4\" />\n *     </Button>\n *   </VegaLiteArrowChart.Actions>\n * </VegaLiteArrowChart>\n * ```\n */\nexport const VegaLiteArrowChart = Object.assign(VegaLiteArrowChartBase, {\n  /**\n   * Container for action buttons, positioned as an overlay\n   */\n  Actions: VegaChartActions,\n  /**\n   * Built-in export action with PNG/SVG download\n   */\n  ExportAction: VegaExportAction,\n  /**\n   * Built-in edit action with spec/SQL editor popover\n   */\n  EditAction: VegaEditAction,\n});\n"]}

package/dist/VegaLiteSqlChart.js

@@ -55,6 +55,6 @@ import { VegaLiteArrowChart, } from './VegaLiteArrowChart';
 export const VegaLiteSqlChart = ({ className, sqlQuery, ...props }) => {
     const result = useSql({ query: sqlQuery });
     const arrowTable = result.data?.arrowTable;
-    return (_jsxs("div", { className: cn('flex h-full w-full flex-col gap-2 overflow-hidden', className), children: [result.error && (_jsx("div", { className: "whitespace-pre-wrap font-mono text-sm text-red-500", children: result.error.message })), result.isLoading ? (_jsxs("div", { className: "text-muted-foreground align-center flex gap-2 px-2", children: [_jsx("div", { className: "h-4 w-4 animate-spin rounded-full border-2 border-gray-300 border-t-blue-600" }), "Running query for chart data\u2026"] })) : (arrowTable && _jsx(VegaLiteArrowChart, { ...props, arrowTable: arrowTable }))] }));
+    return (_jsxs("div", { className: cn('flex h-full w-full flex-col gap-2 overflow-hidden', className), children: [result.error && (_jsx("div", { className: "font-mono text-sm whitespace-pre-wrap text-red-500", children: result.error.message })), result.isLoading ? (_jsxs("div", { className: "text-muted-foreground align-center flex gap-2 px-2", children: [_jsx("div", { className: "h-4 w-4 animate-spin rounded-full border-2 border-gray-300 border-t-blue-600" }), "Running query for chart data\u2026"] })) : (arrowTable && _jsx(VegaLiteArrowChart, { ...props, arrowTable: arrowTable }))] }));
 };
 //# sourceMappingURL=VegaLiteSqlChart.js.map

package/dist/VegaLiteSqlChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"VegaLiteSqlChart.js","sourceRoot":"","sources":["../src/VegaLiteSqlChart.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAChC,OAAO,EACL,kBAAkB,GAEnB,MAAM,sBAAsB,CAAC;AAE9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAEzB,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,EAAE;IACtC,MAAM,MAAM,GAAG,MAAM,CAAC,EAAC,KAAK,EAAE,QAAQ,EAAC,CAAC,CAAC;IACzC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,EAAE,UAAU,CAAC;IAE3C,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,mDAAmD,EACnD,SAAS,CACV,aAEA,MAAM,CAAC,KAAK,IAAI,CACf,cAAK,SAAS,EAAC,oDAAoD,YAChE,MAAM,CAAC,KAAK,CAAC,OAAO,GACjB,CACP,EACA,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAClB,eAAK,SAAS,EAAC,oDAAoD,aACjE,cAAK,SAAS,EAAC,8EAA8E,GAAO,0CAEhG,CACP,CAAC,CAAC,CAAC,CACF,UAAU,IAAI,KAAC,kBAAkB,OAAK,KAAK,EAAE,UAAU,EAAE,UAAU,GAAI,CACxE,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {useSql} from '@sqlrooms/duckdb';\nimport {cn} from '@sqlrooms/ui';\nimport {\n  VegaLiteArrowChart,\n  VegaLiteArrowChartProps,\n} from './VegaLiteArrowChart';\n\n/**\n * A component that renders a Vega-Lite chart with SQL data and responsive sizing.\n *\n * The chart can be sized in multiple ways:\n * - Fixed dimensions: Provide both width and height as numbers\n * - Fixed width, proportional height: Provide width as number, height as 'auto'\n * - Fixed height, proportional width: Provide height as number, width as 'auto'\n * - Fully responsive: Leave both as 'auto' (default), chart will fill container while maintaining aspect ratio\n *\n * @param props - The component props\n * @param {number | 'auto'} [props.width='auto'] - The chart width in pixels, or 'auto' to use container width\n * @param {number | 'auto'} [props.height='auto'] - The chart height in pixels, or 'auto' to calculate from aspect ratio\n * @param {number} [props.aspectRatio=3/2] - The desired width-to-height ratio when dimensions are auto-calculated\n * @param {string} props.sqlQuery - The SQL query to fetch data for the chart\n * @param {string | VisualizationSpec} props.spec - The Vega-Lite specification for the chart.\n *   Can be either a JSON string or a VisualizationSpec object.\n *   The data and size properties will be overridden by the component.\n *\n * @returns The rendered chart component\n *\n * @example\n * // Fixed size chart\n * <VegaLiteChart\n *   width={600}\n *   height={400}\n *   sqlQuery=\"SELECT category, count(*) as count FROM sales GROUP BY category\"\n *   spec={{\n *     mark: 'bar',\n *     encoding: {\n *       x: {field: 'category', type: 'nominal'},\n *       y: {field: 'count', type: 'quantitative'}\n *     }\n *   }}\n * />\n *\n * @example\n * // Responsive chart with 16:9 aspect ratio\n * <VegaLiteChart\n *   className=\"max-w-[600px]\"\n *   aspectRatio={16/9}\n *   sqlQuery=\"SELECT date, value FROM metrics\"\n *   spec={{\n *     mark: 'line',\n *     encoding: {\n *       x: {field: 'date', type: 'temporal'},\n *       y: {field: 'value', type: 'quantitative'}\n *     }\n *   }}\n * />\n */\nexport const VegaLiteSqlChart: React.FC<\n  Omit<VegaLiteArrowChartProps, 'arrowTable'> & {sqlQuery: string}\n> = ({className, sqlQuery, ...props}) => {\n  const result = useSql({query: sqlQuery});\n  const arrowTable = result.data?.arrowTable;\n\n  return (\n    <div\n      className={cn(\n        'flex h-full w-full flex-col gap-2 overflow-hidden',\n        className,\n      )}\n    >\n      {result.error && (\n        <div className=\"whitespace-pre-wrap font-mono text-sm text-red-500\">\n          {result.error.message}\n        </div>\n      )}\n      {result.isLoading ? (\n        <div className=\"text-muted-foreground align-center flex gap-2 px-2\">\n          <div className=\"h-4 w-4 animate-spin rounded-full border-2 border-gray-300 border-t-blue-600\"></div>\n          Running query for chart data…\n        </div>\n      ) : (\n        arrowTable && <VegaLiteArrowChart {...props} arrowTable={arrowTable} />\n      )}\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"VegaLiteSqlChart.js","sourceRoot":"","sources":["../src/VegaLiteSqlChart.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAChC,OAAO,EACL,kBAAkB,GAEnB,MAAM,sBAAsB,CAAC;AAE9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAEzB,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,EAAE;IACtC,MAAM,MAAM,GAAG,MAAM,CAAC,EAAC,KAAK,EAAE,QAAQ,EAAC,CAAC,CAAC;IACzC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,EAAE,UAAU,CAAC;IAE3C,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,mDAAmD,EACnD,SAAS,CACV,aAEA,MAAM,CAAC,KAAK,IAAI,CACf,cAAK,SAAS,EAAC,oDAAoD,YAChE,MAAM,CAAC,KAAK,CAAC,OAAO,GACjB,CACP,EACA,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAClB,eAAK,SAAS,EAAC,oDAAoD,aACjE,cAAK,SAAS,EAAC,8EAA8E,GAAO,0CAEhG,CACP,CAAC,CAAC,CAAC,CACF,UAAU,IAAI,KAAC,kBAAkB,OAAK,KAAK,EAAE,UAAU,EAAE,UAAU,GAAI,CACxE,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {useSql} from '@sqlrooms/duckdb';\nimport {cn} from '@sqlrooms/ui';\nimport {\n  VegaLiteArrowChart,\n  VegaLiteArrowChartProps,\n} from './VegaLiteArrowChart';\n\n/**\n * A component that renders a Vega-Lite chart with SQL data and responsive sizing.\n *\n * The chart can be sized in multiple ways:\n * - Fixed dimensions: Provide both width and height as numbers\n * - Fixed width, proportional height: Provide width as number, height as 'auto'\n * - Fixed height, proportional width: Provide height as number, width as 'auto'\n * - Fully responsive: Leave both as 'auto' (default), chart will fill container while maintaining aspect ratio\n *\n * @param props - The component props\n * @param {number | 'auto'} [props.width='auto'] - The chart width in pixels, or 'auto' to use container width\n * @param {number | 'auto'} [props.height='auto'] - The chart height in pixels, or 'auto' to calculate from aspect ratio\n * @param {number} [props.aspectRatio=3/2] - The desired width-to-height ratio when dimensions are auto-calculated\n * @param {string} props.sqlQuery - The SQL query to fetch data for the chart\n * @param {string | VisualizationSpec} props.spec - The Vega-Lite specification for the chart.\n *   Can be either a JSON string or a VisualizationSpec object.\n *   The data and size properties will be overridden by the component.\n *\n * @returns The rendered chart component\n *\n * @example\n * // Fixed size chart\n * <VegaLiteChart\n *   width={600}\n *   height={400}\n *   sqlQuery=\"SELECT category, count(*) as count FROM sales GROUP BY category\"\n *   spec={{\n *     mark: 'bar',\n *     encoding: {\n *       x: {field: 'category', type: 'nominal'},\n *       y: {field: 'count', type: 'quantitative'}\n *     }\n *   }}\n * />\n *\n * @example\n * // Responsive chart with 16:9 aspect ratio\n * <VegaLiteChart\n *   className=\"max-w-[600px]\"\n *   aspectRatio={16/9}\n *   sqlQuery=\"SELECT date, value FROM metrics\"\n *   spec={{\n *     mark: 'line',\n *     encoding: {\n *       x: {field: 'date', type: 'temporal'},\n *       y: {field: 'value', type: 'quantitative'}\n *     }\n *   }}\n * />\n */\nexport const VegaLiteSqlChart: React.FC<\n  Omit<VegaLiteArrowChartProps, 'arrowTable'> & {sqlQuery: string}\n> = ({className, sqlQuery, ...props}) => {\n  const result = useSql({query: sqlQuery});\n  const arrowTable = result.data?.arrowTable;\n\n  return (\n    <div\n      className={cn(\n        'flex h-full w-full flex-col gap-2 overflow-hidden',\n        className,\n      )}\n    >\n      {result.error && (\n        <div className=\"font-mono text-sm whitespace-pre-wrap text-red-500\">\n          {result.error.message}\n        </div>\n      )}\n      {result.isLoading ? (\n        <div className=\"text-muted-foreground align-center flex gap-2 px-2\">\n          <div className=\"h-4 w-4 animate-spin rounded-full border-2 border-gray-300 border-t-blue-600\"></div>\n          Running query for chart data…\n        </div>\n      ) : (\n        arrowTable && <VegaLiteArrowChart {...props} arrowTable={arrowTable} />\n      )}\n    </div>\n  );\n};\n"]}

package/dist/editor/VegaChartDisplay.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ToolErrorMessage } from '@sqlrooms/ai';
+import { ToolErrorMessage } from '@sqlrooms/ai-core';
 import { useSql } from '@sqlrooms/duckdb';
 import { cn } from '@sqlrooms/ui';
 import { VegaLiteArrowChart } from '../VegaLiteArrowChart';

package/dist/editor/VegaChartDisplay.js.map

@@ -1 +1 @@
-{"version":3,"file":"VegaChartDisplay.js","sourceRoot":"","sources":["../../src/editor/VegaChartDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAC,MAAM,EAAC,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAEhC,OAAO,EAAC,kBAAkB,EAAC,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAC,oBAAoB,EAAC,MAAM,qBAAqB,CAAC;AAkBzD;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAChE,SAAS,EACT,WAAW,GAAG,EAAE,GAAG,CAAC,EACpB,QAAQ,GACT,EAAE,EAAE;IACH,MAAM,EAAC,KAAK,EAAE,UAAU,EAAE,OAAO,EAAC,GAAG,oBAAoB,EAAE,CAAC;IAE5D,0EAA0E;IAC1E,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC;IAElC,gDAAgD;IAChD,MAAM,SAAS,GAAG,MAAM,CAAC;QACvB,KAAK,EAAE,QAAQ,IAAI,EAAE;QACrB,OAAO,EAAE,CAAC,CAAC,QAAQ,IAAI,CAAC,UAAU;KACnC,CAAC,CAAC;IAEH,wDAAwD;IACxD,MAAM,SAAS,GAAG,UAAU,IAAI,SAAS,CAAC,IAAI,EAAE,UAAU,CAAC;IAE3D,iFAAiF;IACjF,8EAA8E;IAC9E,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,aAAa,CAAC;IAErD,qBAAqB;IACrB,IAAI,QAAQ,IAAI,CAAC,UAAU,IAAI,SAAS,CAAC,SAAS,EAAE,CAAC;QACnD,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,wDAAwD,EACxD,SAAS,CACV,aAED,cAAK,SAAS,EAAC,8EAA8E,GAAG,EAChG,eAAM,SAAS,EAAC,cAAc,gCAAuB,IACjD,CACP,CAAC;IACJ,CAAC;IAED,mBAAmB;IACnB,IAAI,QAAQ,IAAI,CAAC,UAAU,IAAI,SAAS,CAAC,KAAK,EAAE,CAAC;QAC/C,OAAO,CACL,cAAK,SAAS,EAAE,SAAS,YACvB,KAAC,gBAAgB,IACf,KAAK,EAAE,SAAS,CAAC,KAAK,EACtB,YAAY,EAAC,kBAAkB,EAC/B,KAAK,EAAC,aAAa,EACnB,KAAK,EAAC,OAAO,EACb,OAAO,EAAE,QAAQ,GACjB,GACE,CACP,CAAC;IACJ,CAAC;IAED,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,YACvC,KAAC,kBAAkB,IACjB,SAAS,EAAC,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,SAAS,EACrB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,YAEf,QAAQ,GACU,GACjB,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {ToolErrorMessage} from '@sqlrooms/ai';\nimport {useSql} from '@sqlrooms/duckdb';\nimport {cn} from '@sqlrooms/ui';\nimport React from 'react';\nimport {VegaLiteArrowChart} from '../VegaLiteArrowChart';\nimport {useVegaEditorContext} from './VegaEditorContext';\n\nexport interface VegaChartDisplayProps {\n  /**\n   * Custom class name for the chart container\n   */\n  className?: string;\n  /**\n   * Aspect ratio for the chart\n   * @default 16/9\n   */\n  aspectRatio?: number;\n  /**\n   * Children passed through to VegaLiteArrowChart (e.g., action components)\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * Chart display subcomponent for VegaLiteChart.Container.\n * Renders the Vega-Lite chart with data from SQL query or arrow table.\n *\n * Uses the parsed spec from the editor state for live preview during editing.\n *\n * Must be used within a VegaLiteChart.Container component.\n *\n * @example\n * ```tsx\n * <VegaLiteChart.Container spec={spec} sqlQuery={query}>\n *   <VegaLiteChart.Chart />\n * </VegaLiteChart.Container>\n * ```\n */\nexport const VegaChartDisplay: React.FC<VegaChartDisplayProps> = ({\n  className,\n  aspectRatio = 16 / 9,\n  children,\n}) => {\n  const {state, arrowTable, options} = useVegaEditorContext();\n\n  // Use the applied SQL for chart rendering (updates when Apply is clicked)\n  const sqlQuery = state.appliedSql;\n\n  // Fetch data from SQL if no arrowTable provided\n  const sqlResult = useSql({\n    query: sqlQuery || '',\n    enabled: !!sqlQuery && !arrowTable,\n  });\n\n  // Use arrow table if provided, otherwise use SQL result\n  const chartData = arrowTable ?? sqlResult.data?.arrowTable;\n\n  // Use parsed spec for live preview, fall back to last valid spec if parse failed\n  // This ensures the chart keeps rendering during typing even with invalid JSON\n  const spec = state.parsedSpec ?? state.lastValidSpec;\n\n  // Show loading state\n  if (sqlQuery && !arrowTable && sqlResult.isLoading) {\n    return (\n      <div\n        className={cn(\n          'text-muted-foreground flex items-center justify-center',\n          className,\n        )}\n      >\n        <div className=\"h-4 w-4 animate-spin rounded-full border-2 border-gray-300 border-t-blue-600\" />\n        <span className=\"ml-2 text-sm\">Loading data...</span>\n      </div>\n    );\n  }\n\n  // Show error state\n  if (sqlQuery && !arrowTable && sqlResult.error) {\n    return (\n      <div className={className}>\n        <ToolErrorMessage\n          error={sqlResult.error}\n          triggerLabel=\"SQL query failed\"\n          title=\"Query error\"\n          align=\"start\"\n          details={sqlQuery}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn('relative', className)}>\n      <VegaLiteArrowChart\n        className=\"w-full\"\n        spec={spec}\n        arrowTable={chartData}\n        aspectRatio={aspectRatio}\n        options={options}\n      >\n        {children}\n      </VegaLiteArrowChart>\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"VegaChartDisplay.js","sourceRoot":"","sources":["../../src/editor/VegaChartDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,gBAAgB,EAAC,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAC,MAAM,EAAC,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAEhC,OAAO,EAAC,kBAAkB,EAAC,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAC,oBAAoB,EAAC,MAAM,qBAAqB,CAAC;AAkBzD;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAChE,SAAS,EACT,WAAW,GAAG,EAAE,GAAG,CAAC,EACpB,QAAQ,GACT,EAAE,EAAE;IACH,MAAM,EAAC,KAAK,EAAE,UAAU,EAAE,OAAO,EAAC,GAAG,oBAAoB,EAAE,CAAC;IAE5D,0EAA0E;IAC1E,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC;IAElC,gDAAgD;IAChD,MAAM,SAAS,GAAG,MAAM,CAAC;QACvB,KAAK,EAAE,QAAQ,IAAI,EAAE;QACrB,OAAO,EAAE,CAAC,CAAC,QAAQ,IAAI,CAAC,UAAU;KACnC,CAAC,CAAC;IAEH,wDAAwD;IACxD,MAAM,SAAS,GAAG,UAAU,IAAI,SAAS,CAAC,IAAI,EAAE,UAAU,CAAC;IAE3D,iFAAiF;IACjF,8EAA8E;IAC9E,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,aAAa,CAAC;IAErD,qBAAqB;IACrB,IAAI,QAAQ,IAAI,CAAC,UAAU,IAAI,SAAS,CAAC,SAAS,EAAE,CAAC;QACnD,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,wDAAwD,EACxD,SAAS,CACV,aAED,cAAK,SAAS,EAAC,8EAA8E,GAAG,EAChG,eAAM,SAAS,EAAC,cAAc,gCAAuB,IACjD,CACP,CAAC;IACJ,CAAC;IAED,mBAAmB;IACnB,IAAI,QAAQ,IAAI,CAAC,UAAU,IAAI,SAAS,CAAC,KAAK,EAAE,CAAC;QAC/C,OAAO,CACL,cAAK,SAAS,EAAE,SAAS,YACvB,KAAC,gBAAgB,IACf,KAAK,EAAE,SAAS,CAAC,KAAK,EACtB,YAAY,EAAC,kBAAkB,EAC/B,KAAK,EAAC,aAAa,EACnB,KAAK,EAAC,OAAO,EACb,OAAO,EAAE,QAAQ,GACjB,GACE,CACP,CAAC;IACJ,CAAC;IAED,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,YACvC,KAAC,kBAAkB,IACjB,SAAS,EAAC,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,SAAS,EACrB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,YAEf,QAAQ,GACU,GACjB,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {ToolErrorMessage} from '@sqlrooms/ai-core';\nimport {useSql} from '@sqlrooms/duckdb';\nimport {cn} from '@sqlrooms/ui';\nimport React from 'react';\nimport {VegaLiteArrowChart} from '../VegaLiteArrowChart';\nimport {useVegaEditorContext} from './VegaEditorContext';\n\nexport interface VegaChartDisplayProps {\n  /**\n   * Custom class name for the chart container\n   */\n  className?: string;\n  /**\n   * Aspect ratio for the chart\n   * @default 16/9\n   */\n  aspectRatio?: number;\n  /**\n   * Children passed through to VegaLiteArrowChart (e.g., action components)\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * Chart display subcomponent for VegaLiteChart.Container.\n * Renders the Vega-Lite chart with data from SQL query or arrow table.\n *\n * Uses the parsed spec from the editor state for live preview during editing.\n *\n * Must be used within a VegaLiteChart.Container component.\n *\n * @example\n * ```tsx\n * <VegaLiteChart.Container spec={spec} sqlQuery={query}>\n *   <VegaLiteChart.Chart />\n * </VegaLiteChart.Container>\n * ```\n */\nexport const VegaChartDisplay: React.FC<VegaChartDisplayProps> = ({\n  className,\n  aspectRatio = 16 / 9,\n  children,\n}) => {\n  const {state, arrowTable, options} = useVegaEditorContext();\n\n  // Use the applied SQL for chart rendering (updates when Apply is clicked)\n  const sqlQuery = state.appliedSql;\n\n  // Fetch data from SQL if no arrowTable provided\n  const sqlResult = useSql({\n    query: sqlQuery || '',\n    enabled: !!sqlQuery && !arrowTable,\n  });\n\n  // Use arrow table if provided, otherwise use SQL result\n  const chartData = arrowTable ?? sqlResult.data?.arrowTable;\n\n  // Use parsed spec for live preview, fall back to last valid spec if parse failed\n  // This ensures the chart keeps rendering during typing even with invalid JSON\n  const spec = state.parsedSpec ?? state.lastValidSpec;\n\n  // Show loading state\n  if (sqlQuery && !arrowTable && sqlResult.isLoading) {\n    return (\n      <div\n        className={cn(\n          'text-muted-foreground flex items-center justify-center',\n          className,\n        )}\n      >\n        <div className=\"h-4 w-4 animate-spin rounded-full border-2 border-gray-300 border-t-blue-600\" />\n        <span className=\"ml-2 text-sm\">Loading data...</span>\n      </div>\n    );\n  }\n\n  // Show error state\n  if (sqlQuery && !arrowTable && sqlResult.error) {\n    return (\n      <div className={className}>\n        <ToolErrorMessage\n          error={sqlResult.error}\n          triggerLabel=\"SQL query failed\"\n          title=\"Query error\"\n          align=\"start\"\n          details={sqlQuery}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn('relative', className)}>\n      <VegaLiteArrowChart\n        className=\"w-full\"\n        spec={spec}\n        arrowTable={chartData}\n        aspectRatio={aspectRatio}\n        options={options}\n      >\n        {children}\n      </VegaLiteArrowChart>\n    </div>\n  );\n};\n"]}

package/dist/editor/VegaCodeMirrorEditor.d.ts

@@ -0,0 +1,15 @@
+import { JsonCodeMirrorEditorProps } from '@sqlrooms/codemirror';
+import React from 'react';
+export interface VegaCodeMirrorEditorProps extends Omit<JsonCodeMirrorEditorProps, 'schema'> {
+    /**
+     * Whether to enable Vega-Lite JSON schema validation
+     * @default true
+     */
+    enableSchemaValidation?: boolean;
+}
+/**
+ * A CodeMirror editor specialized for editing Vega-Lite specifications.
+ * Automatically loads and configures the Vega-Lite JSON schema for validation.
+ */
+export declare const VegaCodeMirrorEditor: React.FC<VegaCodeMirrorEditorProps>;
+//# sourceMappingURL=VegaCodeMirrorEditor.d.ts.map

package/dist/editor/VegaCodeMirrorEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VegaCodeMirrorEditor.d.ts","sourceRoot":"","sources":["../../src/editor/VegaCodeMirrorEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,yBAAyB,EAC1B,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,MAAM,WAAW,yBAA0B,SAAQ,IAAI,CACrD,yBAAyB,EACzB,QAAQ,CACT;IACC;;;OAGG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC;AAED;;;GAGG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CA+BpE,CAAC"}

package/dist/editor/VegaCodeMirrorEditor.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { JsonCodeMirrorEditor, } from '@sqlrooms/codemirror';
+import { useEffect, useState } from 'react';
+import { loadVegaLiteSchema } from '../schema/vegaLiteSchema';
+/**
+ * A CodeMirror editor specialized for editing Vega-Lite specifications.
+ * Automatically loads and configures the Vega-Lite JSON schema for validation.
+ */
+export const VegaCodeMirrorEditor = ({ value, onChange, readOnly = false, className, enableSchemaValidation = true, ...props }) => {
+    const [schema, setSchema] = useState(null);
+    // Load Vega-Lite schema on mount
+    useEffect(() => {
+        if (enableSchemaValidation) {
+            loadVegaLiteSchema().then((loadedSchema) => {
+                if (loadedSchema) {
+                    setSchema(loadedSchema);
+                }
+            });
+        }
+    }, [enableSchemaValidation]);
+    return (_jsx(JsonCodeMirrorEditor, { value: value, onChange: onChange, schema: enableSchemaValidation ? (schema ?? undefined) : undefined, readOnly: readOnly, className: className, ...props }));
+};
+//# sourceMappingURL=VegaCodeMirrorEditor.js.map

package/dist/editor/VegaCodeMirrorEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VegaCodeMirrorEditor.js","sourceRoot":"","sources":["../../src/editor/VegaCodeMirrorEditor.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,oBAAoB,GAErB,MAAM,sBAAsB,CAAC;AAC9B,OAAc,EAAC,SAAS,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;AACjD,OAAO,EAAC,kBAAkB,EAAC,MAAM,0BAA0B,CAAC;AAa5D;;;GAGG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAwC,CAAC,EACxE,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,sBAAsB,GAAG,IAAI,EAC7B,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAE1D,iCAAiC;IACjC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,sBAAsB,EAAE,CAAC;YAC3B,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE;gBACzC,IAAI,YAAY,EAAE,CAAC;oBACjB,SAAS,CAAC,YAAY,CAAC,CAAC;gBAC1B,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC,CAAC;IAE7B,OAAO,CACL,KAAC,oBAAoB,IACnB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,sBAAsB,CAAC,CAAC,CAAC,CAAC,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAClE,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,KAChB,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {\n  JsonCodeMirrorEditor,\n  JsonCodeMirrorEditorProps,\n} from '@sqlrooms/codemirror';\nimport React, {useEffect, useState} from 'react';\nimport {loadVegaLiteSchema} from '../schema/vegaLiteSchema';\n\nexport interface VegaCodeMirrorEditorProps extends Omit<\n  JsonCodeMirrorEditorProps,\n  'schema'\n> {\n  /**\n   * Whether to enable Vega-Lite JSON schema validation\n   * @default true\n   */\n  enableSchemaValidation?: boolean;\n}\n\n/**\n * A CodeMirror editor specialized for editing Vega-Lite specifications.\n * Automatically loads and configures the Vega-Lite JSON schema for validation.\n */\nexport const VegaCodeMirrorEditor: React.FC<VegaCodeMirrorEditorProps> = ({\n  value,\n  onChange,\n  readOnly = false,\n  className,\n  enableSchemaValidation = true,\n  ...props\n}) => {\n  const [schema, setSchema] = useState<object | null>(null);\n\n  // Load Vega-Lite schema on mount\n  useEffect(() => {\n    if (enableSchemaValidation) {\n      loadVegaLiteSchema().then((loadedSchema) => {\n        if (loadedSchema) {\n          setSchema(loadedSchema);\n        }\n      });\n    }\n  }, [enableSchemaValidation]);\n\n  return (\n    <JsonCodeMirrorEditor\n      value={value}\n      onChange={onChange}\n      schema={enableSchemaValidation ? (schema ?? undefined) : undefined}\n      readOnly={readOnly}\n      className={className}\n      {...props}\n    />\n  );\n};\n"]}

package/dist/editor/VegaMonacoEditor.d.ts

@@ -1,5 +1,8 @@
 import { MonacoEditorProps } from '@sqlrooms/monaco-editor';
 import React from 'react';
+/**
+ * @deprecated Use VegaCodeMirrorEditorProps instead. This interface is kept for backward compatibility.
+ */
 export interface VegaMonacoEditorProps extends Omit<MonacoEditorProps, 'language'> {
     /**
      * Whether to enable Vega-Lite JSON schema validation
@@ -10,6 +13,8 @@ export interface VegaMonacoEditorProps extends Omit<MonacoEditorProps, 'language
 /**
  * A Monaco editor specialized for editing Vega-Lite specifications.
  * Automatically loads and configures the Vega-Lite JSON schema for validation.
+ *
+ * @deprecated Use VegaCodeMirrorEditor instead. This component is kept for backward compatibility.
  */
 export declare const VegaMonacoEditor: React.FC<VegaMonacoEditorProps>;
 //# sourceMappingURL=VegaMonacoEditor.d.ts.map

package/dist/editor/VegaMonacoEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VegaMonacoEditor.d.ts","sourceRoot":"","sources":["../../src/editor/VegaMonacoEditor.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,iBAAiB,EAAC,MAAM,yBAAyB,CAAC;AACxE,OAAO,KAA0B,MAAM,OAAO,CAAC;AAG/C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,iBAAiB,EACjB,UAAU,CACX;IACC;;;OAGG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC;AAED;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAuE5D,CAAC"}
+{"version":3,"file":"VegaMonacoEditor.d.ts","sourceRoot":"","sources":["../../src/editor/VegaMonacoEditor.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,iBAAiB,EAAC,MAAM,yBAAyB,CAAC;AACxE,OAAO,KAA0B,MAAM,OAAO,CAAC;AAG/C;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,iBAAiB,EACjB,UAAU,CACX;IACC;;;OAGG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC;AAED;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAuE5D,CAAC"}

package/dist/editor/VegaMonacoEditor.js

@@ -5,6 +5,8 @@ import { loadVegaLiteSchema } from '../schema/vegaLiteSchema';
 /**
  * A Monaco editor specialized for editing Vega-Lite specifications.
  * Automatically loads and configures the Vega-Lite JSON schema for validation.
+ *
+ * @deprecated Use VegaCodeMirrorEditor instead. This component is kept for backward compatibility.
  */
 export const VegaMonacoEditor = ({ value, onChange, readOnly = false, className, enableSchemaValidation = true, onMount, options, ...props }) => {
     const monacoRef = useRef(null);

package/dist/editor/VegaMonacoEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"VegaMonacoEditor.js","sourceRoot":"","sources":["../../src/editor/VegaMonacoEditor.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,YAAY,EAAoB,MAAM,yBAAyB,CAAC;AACxE,OAAc,EAAC,SAAS,EAAE,MAAM,EAAC,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAC,kBAAkB,EAAC,MAAM,0BAA0B,CAAC;AAa5D;;;GAGG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAChE,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,sBAAsB,GAAG,IAAI,EAC7B,OAAO,EACP,OAAO,EACP,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,MAAM,CAAM,IAAI,CAAC,CAAC;IACpC,MAAM,mBAAmB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAE1C,4BAA4B;IAC5B,SAAS,CAAC,GAAG,EAAE;QACb,IACE,sBAAsB;YACtB,SAAS,CAAC,OAAO;YACjB,CAAC,mBAAmB,CAAC,OAAO,EAC5B,CAAC;YACD,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE;gBACnC,IAAI,SAAS,CAAC,OAAO,IAAI,MAAM,EAAE,CAAC;oBAChC,mBAAmB,CAAC,SAAS,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;oBAC/C,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC;gBACrC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC,CAAC;IAE7B,MAAM,oBAAoB,GAAY,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE;QACvD,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC;QAE3B,8CAA8C;QAC9C,IAAI,sBAAsB,EAAE,CAAC;YAC3B,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE;gBACnC,IAAI,MAAM,EAAE,CAAC;oBACX,mBAAmB,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;oBACpC,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC;gBACrC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;QAED,yBAAyB;QACzB,UAAU,CAAC,GAAG,EAAE;YACd,MAAM,CAAC,SAAS,CAAC,8BAA8B,CAAC,EAAE,GAAG,EAAE,CAAC;QAC1D,CAAC,EAAE,GAAG,CAAC,CAAC;QAER,wCAAwC;QACxC,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,IACX,QAAQ,EAAC,MAAM,EACf,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,oBAAoB,EAC7B,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE;YACP,aAAa,EAAE,IAAI;YACnB,YAAY,EAAE,IAAI;YAClB,OAAO,EAAE,IAAI;YACb,eAAe,EAAE,aAAa;YAC9B,WAAW,EAAE,KAAK;YAClB,oBAAoB,EAAE,KAAK;YAC3B,GAAG,OAAO;SACX,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,SAAS,mBAAmB,CAAC,MAAW,EAAE,MAAc;IACtD,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,qBAAqB,CAAC;QACvD,QAAQ,EAAE,IAAI;QACd,OAAO,EAAE;YACP;gBACE,GAAG,EAAE,iDAAiD;gBACtD,SAAS,EAAE,CAAC,GAAG,CAAC;gBAChB,MAAM,EAAE,MAAiC;aAC1C;SACF;QACD,mBAAmB,EAAE,KAAK;KAC3B,CAAC,CAAC;AACL,CAAC","sourcesContent":["import type {OnMount} from '@monaco-editor/react';\nimport {MonacoEditor, MonacoEditorProps} from '@sqlrooms/monaco-editor';\nimport React, {useEffect, useRef} from 'react';\nimport {loadVegaLiteSchema} from '../schema/vegaLiteSchema';\n\nexport interface VegaMonacoEditorProps extends Omit<\n  MonacoEditorProps,\n  'language'\n> {\n  /**\n   * Whether to enable Vega-Lite JSON schema validation\n   * @default true\n   */\n  enableSchemaValidation?: boolean;\n}\n\n/**\n * A Monaco editor specialized for editing Vega-Lite specifications.\n * Automatically loads and configures the Vega-Lite JSON schema for validation.\n */\nexport const VegaMonacoEditor: React.FC<VegaMonacoEditorProps> = ({\n  value,\n  onChange,\n  readOnly = false,\n  className,\n  enableSchemaValidation = true,\n  onMount,\n  options,\n  ...props\n}) => {\n  const monacoRef = useRef<any>(null);\n  const schemaConfiguredRef = useRef(false);\n\n  // Load and configure schema\n  useEffect(() => {\n    if (\n      enableSchemaValidation &&\n      monacoRef.current &&\n      !schemaConfiguredRef.current\n    ) {\n      loadVegaLiteSchema().then((schema) => {\n        if (monacoRef.current && schema) {\n          configureJsonSchema(monacoRef.current, schema);\n          schemaConfiguredRef.current = true;\n        }\n      });\n    }\n  }, [enableSchemaValidation]);\n\n  const handleEditorDidMount: OnMount = (editor, monaco) => {\n    monacoRef.current = monaco;\n\n    // Configure JSON schema validation if enabled\n    if (enableSchemaValidation) {\n      loadVegaLiteSchema().then((schema) => {\n        if (schema) {\n          configureJsonSchema(monaco, schema);\n          schemaConfiguredRef.current = true;\n        }\n      });\n    }\n\n    // Format on initial load\n    setTimeout(() => {\n      editor.getAction('editor.action.formatDocument')?.run();\n    }, 100);\n\n    // Call the original onMount if provided\n    onMount?.(editor, monaco);\n  };\n\n  return (\n    <MonacoEditor\n      language=\"json\"\n      value={value}\n      onChange={onChange}\n      onMount={handleEditorDidMount}\n      className={className}\n      readOnly={readOnly}\n      options={{\n        formatOnPaste: true,\n        formatOnType: true,\n        folding: true,\n        foldingStrategy: 'indentation',\n        lineNumbers: 'off',\n        fixedOverflowWidgets: false,\n        ...options,\n      }}\n      {...props}\n    />\n  );\n};\n\n/**\n * Configure Monaco JSON schema validation for Vega-Lite\n */\nfunction configureJsonSchema(monaco: any, schema: object) {\n  monaco.languages.json.jsonDefaults.setDiagnosticsOptions({\n    validate: true,\n    schemas: [\n      {\n        uri: 'https://vega.github.io/schema/vega-lite/v5.json',\n        fileMatch: ['*'],\n        schema: schema as Record<string, unknown>,\n      },\n    ],\n    enableSchemaRequest: false,\n  });\n}\n"]}
+{"version":3,"file":"VegaMonacoEditor.js","sourceRoot":"","sources":["../../src/editor/VegaMonacoEditor.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,YAAY,EAAoB,MAAM,yBAAyB,CAAC;AACxE,OAAc,EAAC,SAAS,EAAE,MAAM,EAAC,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAC,kBAAkB,EAAC,MAAM,0BAA0B,CAAC;AAgB5D;;;;;GAKG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAChE,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,sBAAsB,GAAG,IAAI,EAC7B,OAAO,EACP,OAAO,EACP,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,MAAM,CAAM,IAAI,CAAC,CAAC;IACpC,MAAM,mBAAmB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAE1C,4BAA4B;IAC5B,SAAS,CAAC,GAAG,EAAE;QACb,IACE,sBAAsB;YACtB,SAAS,CAAC,OAAO;YACjB,CAAC,mBAAmB,CAAC,OAAO,EAC5B,CAAC;YACD,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE;gBACnC,IAAI,SAAS,CAAC,OAAO,IAAI,MAAM,EAAE,CAAC;oBAChC,mBAAmB,CAAC,SAAS,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;oBAC/C,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC;gBACrC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC,CAAC;IAE7B,MAAM,oBAAoB,GAAY,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE;QACvD,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC;QAE3B,8CAA8C;QAC9C,IAAI,sBAAsB,EAAE,CAAC;YAC3B,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE;gBACnC,IAAI,MAAM,EAAE,CAAC;oBACX,mBAAmB,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;oBACpC,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC;gBACrC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;QAED,yBAAyB;QACzB,UAAU,CAAC,GAAG,EAAE;YACd,MAAM,CAAC,SAAS,CAAC,8BAA8B,CAAC,EAAE,GAAG,EAAE,CAAC;QAC1D,CAAC,EAAE,GAAG,CAAC,CAAC;QAER,wCAAwC;QACxC,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,IACX,QAAQ,EAAC,MAAM,EACf,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,oBAAoB,EAC7B,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE;YACP,aAAa,EAAE,IAAI;YACnB,YAAY,EAAE,IAAI;YAClB,OAAO,EAAE,IAAI;YACb,eAAe,EAAE,aAAa;YAC9B,WAAW,EAAE,KAAK;YAClB,oBAAoB,EAAE,KAAK;YAC3B,GAAG,OAAO;SACX,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,SAAS,mBAAmB,CAAC,MAAW,EAAE,MAAc;IACtD,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,qBAAqB,CAAC;QACvD,QAAQ,EAAE,IAAI;QACd,OAAO,EAAE;YACP;gBACE,GAAG,EAAE,iDAAiD;gBACtD,SAAS,EAAE,CAAC,GAAG,CAAC;gBAChB,MAAM,EAAE,MAAiC;aAC1C;SACF;QACD,mBAAmB,EAAE,KAAK;KAC3B,CAAC,CAAC;AACL,CAAC","sourcesContent":["import type {OnMount} from '@monaco-editor/react';\nimport {MonacoEditor, MonacoEditorProps} from '@sqlrooms/monaco-editor';\nimport React, {useEffect, useRef} from 'react';\nimport {loadVegaLiteSchema} from '../schema/vegaLiteSchema';\n\n/**\n * @deprecated Use VegaCodeMirrorEditorProps instead. This interface is kept for backward compatibility.\n */\nexport interface VegaMonacoEditorProps extends Omit<\n  MonacoEditorProps,\n  'language'\n> {\n  /**\n   * Whether to enable Vega-Lite JSON schema validation\n   * @default true\n   */\n  enableSchemaValidation?: boolean;\n}\n\n/**\n * A Monaco editor specialized for editing Vega-Lite specifications.\n * Automatically loads and configures the Vega-Lite JSON schema for validation.\n *\n * @deprecated Use VegaCodeMirrorEditor instead. This component is kept for backward compatibility.\n */\nexport const VegaMonacoEditor: React.FC<VegaMonacoEditorProps> = ({\n  value,\n  onChange,\n  readOnly = false,\n  className,\n  enableSchemaValidation = true,\n  onMount,\n  options,\n  ...props\n}) => {\n  const monacoRef = useRef<any>(null);\n  const schemaConfiguredRef = useRef(false);\n\n  // Load and configure schema\n  useEffect(() => {\n    if (\n      enableSchemaValidation &&\n      monacoRef.current &&\n      !schemaConfiguredRef.current\n    ) {\n      loadVegaLiteSchema().then((schema) => {\n        if (monacoRef.current && schema) {\n          configureJsonSchema(monacoRef.current, schema);\n          schemaConfiguredRef.current = true;\n        }\n      });\n    }\n  }, [enableSchemaValidation]);\n\n  const handleEditorDidMount: OnMount = (editor, monaco) => {\n    monacoRef.current = monaco;\n\n    // Configure JSON schema validation if enabled\n    if (enableSchemaValidation) {\n      loadVegaLiteSchema().then((schema) => {\n        if (schema) {\n          configureJsonSchema(monaco, schema);\n          schemaConfiguredRef.current = true;\n        }\n      });\n    }\n\n    // Format on initial load\n    setTimeout(() => {\n      editor.getAction('editor.action.formatDocument')?.run();\n    }, 100);\n\n    // Call the original onMount if provided\n    onMount?.(editor, monaco);\n  };\n\n  return (\n    <MonacoEditor\n      language=\"json\"\n      value={value}\n      onChange={onChange}\n      onMount={handleEditorDidMount}\n      className={className}\n      readOnly={readOnly}\n      options={{\n        formatOnPaste: true,\n        formatOnType: true,\n        folding: true,\n        foldingStrategy: 'indentation',\n        lineNumbers: 'off',\n        fixedOverflowWidgets: false,\n        ...options,\n      }}\n      {...props}\n    />\n  );\n};\n\n/**\n * Configure Monaco JSON schema validation for Vega-Lite\n */\nfunction configureJsonSchema(monaco: any, schema: object) {\n  monaco.languages.json.jsonDefaults.setDiagnosticsOptions({\n    validate: true,\n    schemas: [\n      {\n        uri: 'https://vega.github.io/schema/vega-lite/v5.json',\n        fileMatch: ['*'],\n        schema: schema as Record<string, unknown>,\n      },\n    ],\n    enableSchemaRequest: false,\n  });\n}\n"]}

package/dist/editor/VegaSpecEditorPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VegaSpecEditorPanel.d.ts","sourceRoot":"","sources":["../../src/editor/VegaSpecEditorPanel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,wBAAwB;IACvC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA0ClE,CAAC"}
+{"version":3,"file":"VegaSpecEditorPanel.d.ts","sourceRoot":"","sources":["../../src/editor/VegaSpecEditorPanel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,wBAAwB;IACvC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAuDlE,CAAC"}

package/dist/editor/VegaSpecEditorPanel.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '@sqlrooms/ui';
+import { cn, CopyButton } from '@sqlrooms/ui';
 import { AlertCircle } from 'lucide-react';
+import { VegaCodeMirrorEditor } from './VegaCodeMirrorEditor';
 import { useVegaEditorContext } from './VegaEditorContext';
-import { VegaMonacoEditor } from './VegaMonacoEditor';
 /**
  * Spec editor panel subcomponent for VegaLiteChart.Container.
  * Renders a Monaco editor with Vega-Lite JSON schema validation.
@@ -20,10 +20,14 @@ import { VegaMonacoEditor } from './VegaMonacoEditor';
 export const VegaSpecEditorPanel = ({ className, title = 'Vega-Lite Spec', }) => {
     const { state, actions, editable } = useVegaEditorContext();
     const showHeader = title !== '';
-    return (_jsxs("div", { className: cn('flex h-full flex-col', className), children: [showHeader && (_jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2", children: [_jsx("span", { className: "text-sm font-medium", children: title }), state.isSpecDirty && (_jsx("span", { className: "text-muted-foreground text-xs", children: "Modified" }))] })), _jsx("div", { className: "relative flex-1", children: _jsx(VegaMonacoEditor, { className: "absolute inset-0 h-full w-full", value: state.editedSpecString, onChange: (value) => {
-                        if (value !== undefined) {
-                            actions.setEditedSpec(value);
-                        }
-                    }, readOnly: !editable }) }), state.specParseError && (_jsxs("div", { className: "bg-destructive/90 text-destructive-foreground flex items-center gap-2 px-3 py-2 backdrop-blur-sm", children: [_jsx(AlertCircle, { className: "h-4 w-4 shrink-0" }), _jsx("span", { className: "truncate text-xs", children: state.specParseError })] }))] }));
+    return (_jsxs("div", { className: cn('flex h-full flex-col', className), children: [showHeader && (_jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2", children: [_jsx("span", { className: "text-sm font-medium", children: title }), state.isSpecDirty && (_jsx("span", { className: "text-muted-foreground text-xs", children: "Modified" }))] })), _jsxs("div", { className: "relative flex-1", children: [_jsx(VegaCodeMirrorEditor, { className: "absolute inset-0 h-full w-full", value: state.editedSpecString, onChange: (value) => {
+                            if (value !== undefined) {
+                                actions.setEditedSpec(value);
+                            }
+                        }, readOnly: !editable, options: {
+                            lineNumbers: true,
+                            lineWrapping: false,
+                            foldGutter: true,
+                        } }), _jsx("div", { className: "bg-background absolute top-2 right-2 rounded-md border", children: _jsx(CopyButton, { text: state.editedSpecString, size: "xs", tooltipLabel: "Copy spec", disabled: !state.editedSpecString.trim() }) })] }), state.specParseError && (_jsxs("div", { className: "bg-destructive/90 text-destructive-foreground flex items-center gap-2 px-3 py-2 backdrop-blur-sm", children: [_jsx(AlertCircle, { className: "h-4 w-4 shrink-0" }), _jsx("span", { className: "truncate text-xs", children: state.specParseError })] }))] }));
 };
 //# sourceMappingURL=VegaSpecEditorPanel.js.map

package/dist/editor/VegaSpecEditorPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"VegaSpecEditorPanel.js","sourceRoot":"","sources":["../../src/editor/VegaSpecEditorPanel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAChC,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAEzC,OAAO,EAAC,oBAAoB,EAAC,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AAcpD;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAuC,CAAC,EACtE,SAAS,EACT,KAAK,GAAG,gBAAgB,GACzB,EAAE,EAAE;IACH,MAAM,EAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAC,GAAG,oBAAoB,EAAE,CAAC;IAC1D,MAAM,UAAU,GAAG,KAAK,KAAK,EAAE,CAAC;IAEhC,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,aAElD,UAAU,IAAI,CACb,eAAK,SAAS,EAAC,sDAAsD,aACnE,eAAM,SAAS,EAAC,qBAAqB,YAAE,KAAK,GAAQ,EACnD,KAAK,CAAC,WAAW,IAAI,CACpB,eAAM,SAAS,EAAC,+BAA+B,yBAAgB,CAChE,IACG,CACP,EAGD,cAAK,SAAS,EAAC,iBAAiB,YAC9B,KAAC,gBAAgB,IACf,SAAS,EAAC,gCAAgC,EAC1C,KAAK,EAAE,KAAK,CAAC,gBAAgB,EAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;wBAClB,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;4BACxB,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;wBAC/B,CAAC;oBACH,CAAC,EACD,QAAQ,EAAE,CAAC,QAAQ,GACnB,GACE,EAGL,KAAK,CAAC,cAAc,IAAI,CACvB,eAAK,SAAS,EAAC,kGAAkG,aAC/G,KAAC,WAAW,IAAC,SAAS,EAAC,kBAAkB,GAAG,EAC5C,eAAM,SAAS,EAAC,kBAAkB,YAAE,KAAK,CAAC,cAAc,GAAQ,IAC5D,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {cn} from '@sqlrooms/ui';\nimport {AlertCircle} from 'lucide-react';\nimport React from 'react';\nimport {useVegaEditorContext} from './VegaEditorContext';\nimport {VegaMonacoEditor} from './VegaMonacoEditor';\n\nexport interface VegaSpecEditorPanelProps {\n  /**\n   * Custom class name for the panel\n   */\n  className?: string;\n  /**\n   * Title shown in the panel header\n   * @default \"Vega-Lite Spec\"\n   */\n  title?: string;\n}\n\n/**\n * Spec editor panel subcomponent for VegaLiteChart.Container.\n * Renders a Monaco editor with Vega-Lite JSON schema validation.\n *\n * Must be used within a VegaLiteChart.Container component.\n *\n * @example\n * ```tsx\n * <VegaLiteChart.Container spec={spec}>\n *   <VegaLiteChart.Chart />\n *   <VegaLiteChart.SpecEditor />\n * </VegaLiteChart.Container>\n * ```\n */\nexport const VegaSpecEditorPanel: React.FC<VegaSpecEditorPanelProps> = ({\n  className,\n  title = 'Vega-Lite Spec',\n}) => {\n  const {state, actions, editable} = useVegaEditorContext();\n  const showHeader = title !== '';\n\n  return (\n    <div className={cn('flex h-full flex-col', className)}>\n      {/* Header - only show if title is provided */}\n      {showHeader && (\n        <div className=\"flex items-center justify-between border-b px-3 py-2\">\n          <span className=\"text-sm font-medium\">{title}</span>\n          {state.isSpecDirty && (\n            <span className=\"text-muted-foreground text-xs\">Modified</span>\n          )}\n        </div>\n      )}\n\n      {/* Editor */}\n      <div className=\"relative flex-1\">\n        <VegaMonacoEditor\n          className=\"absolute inset-0 h-full w-full\"\n          value={state.editedSpecString}\n          onChange={(value) => {\n            if (value !== undefined) {\n              actions.setEditedSpec(value);\n            }\n          }}\n          readOnly={!editable}\n        />\n      </div>\n\n      {/* Spec parse error */}\n      {state.specParseError && (\n        <div className=\"bg-destructive/90 text-destructive-foreground flex items-center gap-2 px-3 py-2 backdrop-blur-sm\">\n          <AlertCircle className=\"h-4 w-4 shrink-0\" />\n          <span className=\"truncate text-xs\">{state.specParseError}</span>\n        </div>\n      )}\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"VegaSpecEditorPanel.js","sourceRoot":"","sources":["../../src/editor/VegaSpecEditorPanel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,EAAE,EAAE,UAAU,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAEzC,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAC,oBAAoB,EAAC,MAAM,qBAAqB,CAAC;AAczD;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAuC,CAAC,EACtE,SAAS,EACT,KAAK,GAAG,gBAAgB,GACzB,EAAE,EAAE;IACH,MAAM,EAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAC,GAAG,oBAAoB,EAAE,CAAC;IAC1D,MAAM,UAAU,GAAG,KAAK,KAAK,EAAE,CAAC;IAEhC,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,aAElD,UAAU,IAAI,CACb,eAAK,SAAS,EAAC,sDAAsD,aACnE,eAAM,SAAS,EAAC,qBAAqB,YAAE,KAAK,GAAQ,EACnD,KAAK,CAAC,WAAW,IAAI,CACpB,eAAM,SAAS,EAAC,+BAA+B,yBAAgB,CAChE,IACG,CACP,EAGD,eAAK,SAAS,EAAC,iBAAiB,aAC9B,KAAC,oBAAoB,IACnB,SAAS,EAAC,gCAAgC,EAC1C,KAAK,EAAE,KAAK,CAAC,gBAAgB,EAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;4BAClB,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;gCACxB,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;4BAC/B,CAAC;wBACH,CAAC,EACD,QAAQ,EAAE,CAAC,QAAQ,EACnB,OAAO,EAAE;4BACP,WAAW,EAAE,IAAI;4BACjB,YAAY,EAAE,KAAK;4BACnB,UAAU,EAAE,IAAI;yBACjB,GACD,EACF,cAAK,SAAS,EAAC,wDAAwD,YACrE,KAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,gBAAgB,EAC5B,IAAI,EAAC,IAAI,EACT,YAAY,EAAC,WAAW,EACxB,QAAQ,EAAE,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,EAAE,GACxC,GACE,IACF,EAGL,KAAK,CAAC,cAAc,IAAI,CACvB,eAAK,SAAS,EAAC,kGAAkG,aAC/G,KAAC,WAAW,IAAC,SAAS,EAAC,kBAAkB,GAAG,EAC5C,eAAM,SAAS,EAAC,kBAAkB,YAAE,KAAK,CAAC,cAAc,GAAQ,IAC5D,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {cn, CopyButton} from '@sqlrooms/ui';\nimport {AlertCircle} from 'lucide-react';\nimport React from 'react';\nimport {VegaCodeMirrorEditor} from './VegaCodeMirrorEditor';\nimport {useVegaEditorContext} from './VegaEditorContext';\n\nexport interface VegaSpecEditorPanelProps {\n  /**\n   * Custom class name for the panel\n   */\n  className?: string;\n  /**\n   * Title shown in the panel header\n   * @default \"Vega-Lite Spec\"\n   */\n  title?: string;\n}\n\n/**\n * Spec editor panel subcomponent for VegaLiteChart.Container.\n * Renders a Monaco editor with Vega-Lite JSON schema validation.\n *\n * Must be used within a VegaLiteChart.Container component.\n *\n * @example\n * ```tsx\n * <VegaLiteChart.Container spec={spec}>\n *   <VegaLiteChart.Chart />\n *   <VegaLiteChart.SpecEditor />\n * </VegaLiteChart.Container>\n * ```\n */\nexport const VegaSpecEditorPanel: React.FC<VegaSpecEditorPanelProps> = ({\n  className,\n  title = 'Vega-Lite Spec',\n}) => {\n  const {state, actions, editable} = useVegaEditorContext();\n  const showHeader = title !== '';\n\n  return (\n    <div className={cn('flex h-full flex-col', className)}>\n      {/* Header - only show if title is provided */}\n      {showHeader && (\n        <div className=\"flex items-center justify-between border-b px-3 py-2\">\n          <span className=\"text-sm font-medium\">{title}</span>\n          {state.isSpecDirty && (\n            <span className=\"text-muted-foreground text-xs\">Modified</span>\n          )}\n        </div>\n      )}\n\n      {/* Editor */}\n      <div className=\"relative flex-1\">\n        <VegaCodeMirrorEditor\n          className=\"absolute inset-0 h-full w-full\"\n          value={state.editedSpecString}\n          onChange={(value) => {\n            if (value !== undefined) {\n              actions.setEditedSpec(value);\n            }\n          }}\n          readOnly={!editable}\n          options={{\n            lineNumbers: true,\n            lineWrapping: false,\n            foldGutter: true,\n          }}\n        />\n        <div className=\"bg-background absolute top-2 right-2 rounded-md border\">\n          <CopyButton\n            text={state.editedSpecString}\n            size=\"xs\"\n            tooltipLabel=\"Copy spec\"\n            disabled={!state.editedSpecString.trim()}\n          />\n        </div>\n      </div>\n\n      {/* Spec parse error */}\n      {state.specParseError && (\n        <div className=\"bg-destructive/90 text-destructive-foreground flex items-center gap-2 px-3 py-2 backdrop-blur-sm\">\n          <AlertCircle className=\"h-4 w-4 shrink-0\" />\n          <span className=\"truncate text-xs\">{state.specParseError}</span>\n        </div>\n      )}\n    </div>\n  );\n};\n"]}

package/dist/editor/VegaSqlEditorPanel.d.ts

@@ -17,7 +17,7 @@ export interface VegaSqlEditorPanelProps {
 }
 /**
  * SQL editor panel subcomponent for VegaLiteChart.Container.
- * Renders a Monaco editor with SQL syntax highlighting and a query preview.
+ * Renders a CodeMirror editor with SQL syntax highlighting and a query preview.
  *
  * Must be used within a VegaLiteChart.Container component.
  *

package/dist/editor/VegaSqlEditorPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VegaSqlEditorPanel.d.ts","sourceRoot":"","sources":["../../src/editor/VegaSqlEditorPanel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAsFhE,CAAC"}
+{"version":3,"file":"VegaSqlEditorPanel.d.ts","sourceRoot":"","sources":["../../src/editor/VegaSqlEditorPanel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA6FhE,CAAC"}

package/dist/editor/VegaSqlEditorPanel.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { SqlMonacoEditor, SqlQueryPreview } from '@sqlrooms/sql-editor';
-import { Button, cn } from '@sqlrooms/ui';
+import { SqlCodeMirrorEditor, SqlQueryPreview } from '@sqlrooms/sql-editor';
+import { Button, cn, CopyButton } from '@sqlrooms/ui';
 import { PlayIcon } from 'lucide-react';
 import { useCallback, useState } from 'react';
 import { useVegaEditorContext } from './VegaEditorContext';
 /**
  * SQL editor panel subcomponent for VegaLiteChart.Container.
- * Renders a Monaco editor with SQL syntax highlighting and a query preview.
+ * Renders a CodeMirror editor with SQL syntax highlighting and a query preview.
  *
  * Must be used within a VegaLiteChart.Container component.
  *
@@ -29,13 +29,12 @@ export const VegaSqlEditorPanel = ({ className, title = 'SQL Query', maxPreviewR
     const showHeader = title !== '';
     return (_jsxs("div", { className: cn('flex h-full flex-col', className), children: [showHeader ? (_jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2", children: [_jsx("span", { className: "text-sm font-medium", children: title }), _jsxs("div", { className: "flex items-center gap-2", children: [state.isSqlDirty && (_jsx("span", { className: "text-muted-foreground text-xs", children: "Modified" })), editable && (_jsxs(Button, { variant: "ghost", size: "xs", onClick: handleRunPreview, disabled: !state.editedSql.trim(), children: [_jsx(PlayIcon, { className: "mr-1 h-3 w-3" }), "Preview"] }))] })] })) : (
             /* Toolbar when no header - just show preview button */
-            editable && (_jsx("div", { className: "flex items-center justify-end border-b px-2 py-1", children: _jsxs(Button, { variant: "ghost", size: "xs", onClick: handleRunPreview, disabled: !state.editedSql.trim(), children: [_jsx(PlayIcon, { className: "mr-1 h-3 w-3" }), "Preview"] }) }))), _jsx("div", { className: "relative min-h-[100px] flex-1", children: _jsx(SqlMonacoEditor, { className: "absolute inset-0 h-full w-full", value: state.editedSql, onChange: (value) => {
-                        if (value !== undefined) {
+            editable && (_jsx("div", { className: "flex items-center justify-end border-b px-2 py-1", children: _jsxs(Button, { variant: "ghost", size: "xs", onClick: handleRunPreview, disabled: !state.editedSql.trim(), children: [_jsx(PlayIcon, { className: "mr-1 h-3 w-3" }), "Preview"] }) }))), _jsxs("div", { className: "relative min-h-[100px] flex-1", children: [_jsx(SqlCodeMirrorEditor, { className: "absolute inset-0 h-full w-full", value: state.editedSql, onChange: (value) => {
                             actions.setEditedSql(value);
-                        }
-                    }, options: {
-                        lineNumbers: 'off',
-                        fixedOverflowWidgets: false,
-                    }, readOnly: !editable }) }), previewQuery && showPreview && (_jsx("div", { className: "max-h-[200px] overflow-auto border-t", children: _jsx(SqlQueryPreview, { query: previewQuery, defaultLimit: maxPreviewRows, limitOptions: [100, 500, 1000] }) }))] }));
+                        }, options: {
+                            lineNumbers: true,
+                            lineWrapping: true,
+                            foldGutter: true,
+                        }, readOnly: !editable }), _jsx("div", { className: "bg-background absolute top-2 right-2 rounded-md border", children: _jsx(CopyButton, { text: state.editedSql, size: "xs", tooltipLabel: "Copy SQL", disabled: !state.editedSql.trim() }) })] }), previewQuery && showPreview && (_jsx("div", { className: "max-h-[200px] overflow-auto border-t", children: _jsx(SqlQueryPreview, { query: previewQuery, defaultLimit: maxPreviewRows, limitOptions: [100, 500, 1000] }) }))] }));
 };
 //# sourceMappingURL=VegaSqlEditorPanel.js.map

package/dist/editor/VegaSqlEditorPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"VegaSqlEditorPanel.js","sourceRoot":"","sources":["../../src/editor/VegaSqlEditorPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import {SqlMonacoEditor, SqlQueryPreview} from '@sqlrooms/sql-editor';\nimport {Button, cn} from '@sqlrooms/ui';\nimport {PlayIcon} from 'lucide-react';\nimport React, {useCallback, useState} from 'react';\nimport {useVegaEditorContext} from './VegaEditorContext';\n\nexport interface VegaSqlEditorPanelProps {\n  /**\n   * Custom class name for the panel\n   */\n  className?: string;\n  /**\n   * Title shown in the panel header\n   * @default \"SQL Query\"\n   */\n  title?: string;\n  /**\n   * Max rows to fetch for preview\n   * @default 100\n   */\n  maxPreviewRows?: number;\n}\n\n/**\n * SQL editor panel subcomponent for VegaLiteChart.Container.\n * Renders a Monaco editor with SQL syntax highlighting and a query preview.\n *\n * Must be used within a VegaLiteChart.Container component.\n *\n * @example\n * ```tsx\n * <VegaLiteChart.Container spec={spec} sqlQuery={query}>\n *   <VegaLiteChart.Chart />\n *   <VegaLiteChart.SqlEditor />\n * </VegaLiteChart.Container>\n * ```\n */\nexport const VegaSqlEditorPanel: React.FC<VegaSqlEditorPanelProps> = ({\n  className,\n  title = 'SQL Query',\n  maxPreviewRows = 100,\n}) => {\n  const {state, actions, editable} = useVegaEditorContext();\n  const [previewQuery, setPreviewQuery] = useState<string>('');\n  const [showPreview, setShowPreview] = useState(false);\n\n  const handleRunPreview = useCallback(() => {\n    setPreviewQuery(state.editedSql);\n    setShowPreview(true);\n  }, [state.editedSql]);\n\n  const showHeader = title !== '';\n\n  return (\n    <div className={cn('flex h-full flex-col', className)}>\n      {/* Header - only show if title is provided */}\n      {showHeader ? (\n        <div className=\"flex items-center justify-between border-b px-3 py-2\">\n          <span className=\"text-sm font-medium\">{title}</span>\n          <div className=\"flex items-center gap-2\">\n            {state.isSqlDirty && (\n              <span className=\"text-muted-foreground text-xs\">Modified</span>\n            )}\n            {editable && (\n              <Button\n                variant=\"ghost\"\n                size=\"xs\"\n                onClick={handleRunPreview}\n                disabled={!state.editedSql.trim()}\n              >\n                <PlayIcon className=\"mr-1 h-3 w-3\" />\n                Preview\n              </Button>\n            )}\n          </div>\n        </div>\n      ) : (\n        /* Toolbar when no header - just show preview button */\n        editable && (\n          <div className=\"flex items-center justify-end border-b px-2 py-1\">\n            <Button\n              variant=\"ghost\"\n              size=\"xs\"\n              onClick={handleRunPreview}\n              disabled={!state.editedSql.trim()}\n            >\n              <PlayIcon className=\"mr-1 h-3 w-3\" />\n              Preview\n            </Button>\n          </div>\n        )\n      )}\n\n      {/* Editor */}\n      <div className=\"relative min-h-[100px] flex-1\">\n        <SqlMonacoEditor\n          className=\"absolute inset-0 h-full w-full\"\n          value={state.editedSql}\n          onChange={(value) => {\n            if (value !== undefined) {\n              actions.setEditedSql(value);\n            }\n          }}\n          options={{\n            lineNumbers: 'off',\n            fixedOverflowWidgets: false,\n          }}\n          readOnly={!editable}\n        />\n      </div>\n\n      {/* Preview Results */}\n      {previewQuery && showPreview && (\n        <div className=\"max-h-[200px] overflow-auto border-t\">\n          <SqlQueryPreview\n            query={previewQuery}\n            defaultLimit={maxPreviewRows}\n            limitOptions={[100, 500, 1000]}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"VegaSqlEditorPanel.js","sourceRoot":"","sources":["../../src/editor/VegaSqlEditorPanel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,mBAAmB,EAAE,eAAe,EAAC,MAAM,sBAAsB,CAAC;AAC1E,OAAO,EAAC,MAAM,EAAE,EAAE,EAAE,UAAU,EAAC,MAAM,cAAc,CAAC;AACpD,OAAO,EAAC,QAAQ,EAAC,MAAM,cAAc,CAAC;AACtC,OAAc,EAAC,WAAW,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;AACnD,OAAO,EAAC,oBAAoB,EAAC,MAAM,qBAAqB,CAAC;AAmBzD;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EACpE,SAAS,EACT,KAAK,GAAG,WAAW,EACnB,cAAc,GAAG,GAAG,GACrB,EAAE,EAAE;IACH,MAAM,EAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAC,GAAG,oBAAoB,EAAE,CAAC;IAC1D,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IAC7D,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtD,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,eAAe,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QACjC,cAAc,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC;IAEtB,MAAM,UAAU,GAAG,KAAK,KAAK,EAAE,CAAC;IAEhC,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,aAElD,UAAU,CAAC,CAAC,CAAC,CACZ,eAAK,SAAS,EAAC,sDAAsD,aACnE,eAAM,SAAS,EAAC,qBAAqB,YAAE,KAAK,GAAQ,EACpD,eAAK,SAAS,EAAC,yBAAyB,aACrC,KAAK,CAAC,UAAU,IAAI,CACnB,eAAM,SAAS,EAAC,+BAA+B,yBAAgB,CAChE,EACA,QAAQ,IAAI,CACX,MAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,gBAAgB,EACzB,QAAQ,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,EAAE,aAEjC,KAAC,QAAQ,IAAC,SAAS,EAAC,cAAc,GAAG,eAE9B,CACV,IACG,IACF,CACP,CAAC,CAAC,CAAC;YACF,uDAAuD;YACvD,QAAQ,IAAI,CACV,cAAK,SAAS,EAAC,kDAAkD,YAC/D,MAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,gBAAgB,EACzB,QAAQ,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,EAAE,aAEjC,KAAC,QAAQ,IAAC,SAAS,EAAC,cAAc,GAAG,eAE9B,GACL,CACP,CACF,EAGD,eAAK,SAAS,EAAC,+BAA+B,aAC5C,KAAC,mBAAmB,IAClB,SAAS,EAAC,gCAAgC,EAC1C,KAAK,EAAE,KAAK,CAAC,SAAS,EACtB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;4BAClB,OAAO,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;wBAC9B,CAAC,EACD,OAAO,EAAE;4BACP,WAAW,EAAE,IAAI;4BACjB,YAAY,EAAE,IAAI;4BAClB,UAAU,EAAE,IAAI;yBACjB,EACD,QAAQ,EAAE,CAAC,QAAQ,GACnB,EACF,cAAK,SAAS,EAAC,wDAAwD,YACrE,KAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,SAAS,EACrB,IAAI,EAAC,IAAI,EACT,YAAY,EAAC,UAAU,EACvB,QAAQ,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,EAAE,GACjC,GACE,IACF,EAGL,YAAY,IAAI,WAAW,IAAI,CAC9B,cAAK,SAAS,EAAC,sCAAsC,YACnD,KAAC,eAAe,IACd,KAAK,EAAE,YAAY,EACnB,YAAY,EAAE,cAAc,EAC5B,YAAY,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAC9B,GACE,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {SqlCodeMirrorEditor, SqlQueryPreview} from '@sqlrooms/sql-editor';\nimport {Button, cn, CopyButton} from '@sqlrooms/ui';\nimport {PlayIcon} from 'lucide-react';\nimport React, {useCallback, useState} from 'react';\nimport {useVegaEditorContext} from './VegaEditorContext';\n\nexport interface VegaSqlEditorPanelProps {\n  /**\n   * Custom class name for the panel\n   */\n  className?: string;\n  /**\n   * Title shown in the panel header\n   * @default \"SQL Query\"\n   */\n  title?: string;\n  /**\n   * Max rows to fetch for preview\n   * @default 100\n   */\n  maxPreviewRows?: number;\n}\n\n/**\n * SQL editor panel subcomponent for VegaLiteChart.Container.\n * Renders a CodeMirror editor with SQL syntax highlighting and a query preview.\n *\n * Must be used within a VegaLiteChart.Container component.\n *\n * @example\n * ```tsx\n * <VegaLiteChart.Container spec={spec} sqlQuery={query}>\n *   <VegaLiteChart.Chart />\n *   <VegaLiteChart.SqlEditor />\n * </VegaLiteChart.Container>\n * ```\n */\nexport const VegaSqlEditorPanel: React.FC<VegaSqlEditorPanelProps> = ({\n  className,\n  title = 'SQL Query',\n  maxPreviewRows = 100,\n}) => {\n  const {state, actions, editable} = useVegaEditorContext();\n  const [previewQuery, setPreviewQuery] = useState<string>('');\n  const [showPreview, setShowPreview] = useState(false);\n\n  const handleRunPreview = useCallback(() => {\n    setPreviewQuery(state.editedSql);\n    setShowPreview(true);\n  }, [state.editedSql]);\n\n  const showHeader = title !== '';\n\n  return (\n    <div className={cn('flex h-full flex-col', className)}>\n      {/* Header - only show if title is provided */}\n      {showHeader ? (\n        <div className=\"flex items-center justify-between border-b px-3 py-2\">\n          <span className=\"text-sm font-medium\">{title}</span>\n          <div className=\"flex items-center gap-2\">\n            {state.isSqlDirty && (\n              <span className=\"text-muted-foreground text-xs\">Modified</span>\n            )}\n            {editable && (\n              <Button\n                variant=\"ghost\"\n                size=\"xs\"\n                onClick={handleRunPreview}\n                disabled={!state.editedSql.trim()}\n              >\n                <PlayIcon className=\"mr-1 h-3 w-3\" />\n                Preview\n              </Button>\n            )}\n          </div>\n        </div>\n      ) : (\n        /* Toolbar when no header - just show preview button */\n        editable && (\n          <div className=\"flex items-center justify-end border-b px-2 py-1\">\n            <Button\n              variant=\"ghost\"\n              size=\"xs\"\n              onClick={handleRunPreview}\n              disabled={!state.editedSql.trim()}\n            >\n              <PlayIcon className=\"mr-1 h-3 w-3\" />\n              Preview\n            </Button>\n          </div>\n        )\n      )}\n\n      {/* Editor */}\n      <div className=\"relative min-h-[100px] flex-1\">\n        <SqlCodeMirrorEditor\n          className=\"absolute inset-0 h-full w-full\"\n          value={state.editedSql}\n          onChange={(value) => {\n            actions.setEditedSql(value);\n          }}\n          options={{\n            lineNumbers: true,\n            lineWrapping: true,\n            foldGutter: true,\n          }}\n          readOnly={!editable}\n        />\n        <div className=\"bg-background absolute top-2 right-2 rounded-md border\">\n          <CopyButton\n            text={state.editedSql}\n            size=\"xs\"\n            tooltipLabel=\"Copy SQL\"\n            disabled={!state.editedSql.trim()}\n          />\n        </div>\n      </div>\n\n      {/* Preview Results */}\n      {previewQuery && showPreview && (\n        <div className=\"max-h-[200px] overflow-auto border-t\">\n          <SqlQueryPreview\n            query={previewQuery}\n            defaultLimit={maxPreviewRows}\n            limitOptions={[100, 500, 1000]}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n"]}

package/dist/index.d.ts

@@ -4,8 +4,9 @@
  */
 export { VegaChartToolResult as VegaChartToolResult } from './VegaChartToolResult';
 export type { VisualizationSpec } from 'vega-embed';
-export { createVegaChartTool, VegaChartToolParameters, DEFAULT_VEGA_CHART_DESCRIPTION, } from './VegaChartTool';
-export type { VegaChartToolParameters as VegaChartToolParametersType, VegaChartToolOptions, } from './VegaChartTool';
+export type { SignalListenerHandler, SignalValue } from 'vega';
+export { createVegaChartTool, createSqlValidator, VegaChartToolParameters, DEFAULT_VEGA_CHART_DESCRIPTION, } from './VegaChartTool';
+export type { VegaChartToolOptions, VegaChartToolOutput } from './VegaChartTool';
 /**
  * Composable Vega-Lite chart component with editing capabilities.
  *
@@ -45,7 +46,9 @@ export declare const VegaLiteChart: import("react").FC<Omit<import("./VegaLiteAr
     SqlEditor: import("react").FC<import("./editor/VegaSqlEditorPanel").VegaSqlEditorPanelProps>;
     Actions: import("react").FC<import("./editor/VegaChartEditorActions").VegaChartEditorActionsProps>;
 };
+/** @deprecated Use VegaCodeMirrorEditor instead */
 export { VegaMonacoEditor } from './editor/VegaMonacoEditor';
+export { VegaCodeMirrorEditor } from './editor/VegaCodeMirrorEditor';
 export { useVegaChartEditor } from './editor/useVegaChartEditor';
 export { useVegaEditorContext } from './editor/VegaEditorContext';
 export type { EditorMode, OnSpecChange, OnSqlChange, UseVegaChartEditorOptions, UseVegaChartEditorReturn, VegaEditorActions, VegaEditorContextValue, VegaEditorState, } from './editor/types';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAUH,OAAO,EAAC,mBAAmB,IAAI,mBAAmB,EAAC,MAAM,uBAAuB,CAAC;AACjF,YAAY,EAAC,iBAAiB,EAAC,MAAM,YAAY,CAAC;AAClD,OAAO,EACL,mBAAmB,EACnB,uBAAuB,EACvB,8BAA8B,GAC/B,MAAM,iBAAiB,CAAC;AAEzB,YAAY,EACV,uBAAuB,IAAI,2BAA2B,EACtD,oBAAoB,GACrB,MAAM,iBAAiB,CAAC;AAEzB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;CAUxB,CAAC;AAGH,OAAO,EAAC,gBAAgB,EAAC,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AAGhE,YAAY,EACV,UAAU,EACV,YAAY,EACZ,WAAW,EACX,yBAAyB,EACzB,wBAAwB,EACxB,iBAAiB,EACjB,sBAAsB,EACtB,eAAe,GAChB,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,qBAAqB,GACtB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAC,mBAAmB,EAAC,MAAM,oBAAoB,CAAC;AACvD,YAAY,EAAC,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AAG9D,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,YAAY,EAAC,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,YAAY,EAAC,mBAAmB,EAAC,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,YAAY,EAAC,qBAAqB,EAAC,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AASH,OAAO,EAAC,mBAAmB,IAAI,mBAAmB,EAAC,MAAM,uBAAuB,CAAC;AACjF,YAAY,EAAC,iBAAiB,EAAC,MAAM,YAAY,CAAC;AAClD,YAAY,EAAC,qBAAqB,EAAE,WAAW,EAAC,MAAM,MAAM,CAAC;AAE7D,OAAO,EACL,mBAAmB,EACnB,kBAAkB,EAClB,uBAAuB,EACvB,8BAA8B,GAC/B,MAAM,iBAAiB,CAAC;AAEzB,YAAY,EAAC,oBAAoB,EAAE,mBAAmB,EAAC,MAAM,iBAAiB,CAAC;AAE/E;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;CAUxB,CAAC;AAGH,mDAAmD;AACnD,OAAO,EAAC,gBAAgB,EAAC,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAC,oBAAoB,EAAC,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AAGhE,YAAY,EACV,UAAU,EACV,YAAY,EACZ,WAAW,EACX,yBAAyB,EACzB,wBAAwB,EACxB,iBAAiB,EACjB,sBAAsB,EACtB,eAAe,GAChB,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,qBAAqB,GACtB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAC,mBAAmB,EAAC,MAAM,oBAAoB,CAAC;AACvD,YAAY,EAAC,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AAG9D,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,YAAY,EAAC,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,YAAY,EAAC,mBAAmB,EAAC,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,YAAY,EAAC,qBAAqB,EAAC,MAAM,oBAAoB,CAAC"}

package/dist/index.js

@@ -10,7 +10,7 @@ import { VegaSpecEditorPanel } from './editor/VegaSpecEditorPanel';
 import { VegaSqlEditorPanel } from './editor/VegaSqlEditorPanel';
 import { VegaChartEditorActions } from './editor/VegaChartEditorActions';
 export { VegaChartToolResult as VegaChartToolResult } from './VegaChartToolResult';
-export { createVegaChartTool, VegaChartToolParameters, DEFAULT_VEGA_CHART_DESCRIPTION, } from './VegaChartTool';
+export { createVegaChartTool, createSqlValidator, VegaChartToolParameters, DEFAULT_VEGA_CHART_DESCRIPTION, } from './VegaChartTool';
 /**
  * Composable Vega-Lite chart component with editing capabilities.
  *
@@ -45,7 +45,9 @@ export const VegaLiteChart = Object.assign(VegaLiteSqlChart, {
     Actions: VegaChartEditorActions,
 });
 // Export editor components and hooks for advanced use
+/** @deprecated Use VegaCodeMirrorEditor instead */
 export { VegaMonacoEditor } from './editor/VegaMonacoEditor';
+export { VegaCodeMirrorEditor } from './editor/VegaCodeMirrorEditor';
 export { useVegaChartEditor } from './editor/useVegaChartEditor';
 export { useVegaEditorContext } from './editor/VegaEditorContext';
 // Export schema utilities

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,gBAAgB,EAAC,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAC,mBAAmB,EAAC,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,sBAAsB,EAAC,MAAM,iCAAiC,CAAC;AAEvE,OAAO,EAAC,mBAAmB,IAAI,mBAAmB,EAAC,MAAM,uBAAuB,CAAC;AAEjF,OAAO,EACL,mBAAmB,EACnB,uBAAuB,EACvB,8BAA8B,GAC/B,MAAM,iBAAiB,CAAC;AAOzB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC,gBAAgB,EAAE;IAC3D,0BAA0B;IAC1B,QAAQ,EAAE,gBAAgB;IAC1B,UAAU,EAAE,kBAAkB;IAC9B,6BAA6B;IAC7B,SAAS,EAAE,kBAAkB;IAC7B,KAAK,EAAE,gBAAgB;IACvB,UAAU,EAAE,mBAAmB;IAC/B,SAAS,EAAE,kBAAkB;IAC7B,OAAO,EAAE,sBAAsB;CAChC,CAAC,CAAC;AAEH,sDAAsD;AACtD,OAAO,EAAC,gBAAgB,EAAC,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AAchE,0BAA0B;AAC1B,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,qBAAqB,GACtB,MAAM,yBAAyB,CAAC;AAEjC,mDAAmD;AACnD,OAAO,EAAC,mBAAmB,EAAC,MAAM,oBAAoB,CAAC;AAGvD,2BAA2B;AAC3B,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AAEpD,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAEhD,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC","sourcesContent":["/**\n * {@include ../README.md}\n * @packageDocumentation\n */\n\nimport {VegaLiteSqlChart} from './VegaLiteSqlChart';\nimport {VegaLiteArrowChart} from './VegaLiteArrowChart';\nimport {VegaChartContainer} from './editor/VegaChartContainer';\nimport {VegaChartDisplay} from './editor/VegaChartDisplay';\nimport {VegaSpecEditorPanel} from './editor/VegaSpecEditorPanel';\nimport {VegaSqlEditorPanel} from './editor/VegaSqlEditorPanel';\nimport {VegaChartEditorActions} from './editor/VegaChartEditorActions';\n\nexport {VegaChartToolResult as VegaChartToolResult} from './VegaChartToolResult';\nexport type {VisualizationSpec} from 'vega-embed';\nexport {\n  createVegaChartTool,\n  VegaChartToolParameters,\n  DEFAULT_VEGA_CHART_DESCRIPTION,\n} from './VegaChartTool';\n\nexport type {\n  VegaChartToolParameters as VegaChartToolParametersType,\n  VegaChartToolOptions,\n} from './VegaChartTool';\n\n/**\n * Composable Vega-Lite chart component with editing capabilities.\n *\n * @example\n * ```tsx\n * // Compound component pattern\n * <VegaLiteChart.Container\n *   spec={mySpec}\n *   sqlQuery={myQuery}\n *   editable={true}\n *   onSpecChange={(spec) => saveSpec(spec)}\n * >\n *   <VegaLiteChart.Chart />\n *   <VegaLiteChart.SpecEditor />\n *   <VegaLiteChart.SqlEditor />\n *   <VegaLiteChart.Actions />\n * </VegaLiteChart.Container>\n *\n * // Simple usage (legacy)\n * <VegaLiteChart spec={mySpec} sqlQuery={myQuery} />\n * ```\n */\nexport const VegaLiteChart = Object.assign(VegaLiteSqlChart, {\n  // Legacy chart components\n  SqlChart: VegaLiteSqlChart,\n  ArrowChart: VegaLiteArrowChart,\n  // Compound editor components\n  Container: VegaChartContainer,\n  Chart: VegaChartDisplay,\n  SpecEditor: VegaSpecEditorPanel,\n  SqlEditor: VegaSqlEditorPanel,\n  Actions: VegaChartEditorActions,\n});\n\n// Export editor components and hooks for advanced use\nexport {VegaMonacoEditor} from './editor/VegaMonacoEditor';\nexport {useVegaChartEditor} from './editor/useVegaChartEditor';\nexport {useVegaEditorContext} from './editor/VegaEditorContext';\n\n// Export editor types\nexport type {\n  EditorMode,\n  OnSpecChange,\n  OnSqlChange,\n  UseVegaChartEditorOptions,\n  UseVegaChartEditorReturn,\n  VegaEditorActions,\n  VegaEditorContextValue,\n  VegaEditorState,\n} from './editor/types';\n\n// Export schema utilities\nexport {\n  loadVegaLiteSchema,\n  getCachedVegaLiteSchema,\n  preloadVegaLiteSchema,\n} from './schema/vegaLiteSchema';\n\n// Export chart context and hook for custom actions\nexport {useVegaChartContext} from './VegaChartContext';\nexport type {VegaChartContextValue} from './VegaChartContext';\n\n// Export action components\nexport {VegaExportAction} from './VegaExportAction';\nexport type {VegaExportActionProps} from './VegaExportAction';\nexport {VegaEditAction} from './VegaEditAction';\nexport type {VegaEditActionProps} from './VegaEditAction';\nexport {VegaChartActions} from './VegaChartActions';\nexport type {VegaChartActionsProps} from './VegaChartActions';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,gBAAgB,EAAC,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAC,mBAAmB,EAAC,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,sBAAsB,EAAC,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAC,mBAAmB,IAAI,mBAAmB,EAAC,MAAM,uBAAuB,CAAC;AAIjF,OAAO,EACL,mBAAmB,EACnB,kBAAkB,EAClB,uBAAuB,EACvB,8BAA8B,GAC/B,MAAM,iBAAiB,CAAC;AAIzB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC,gBAAgB,EAAE;IAC3D,0BAA0B;IAC1B,QAAQ,EAAE,gBAAgB;IAC1B,UAAU,EAAE,kBAAkB;IAC9B,6BAA6B;IAC7B,SAAS,EAAE,kBAAkB;IAC7B,KAAK,EAAE,gBAAgB;IACvB,UAAU,EAAE,mBAAmB;IAC/B,SAAS,EAAE,kBAAkB;IAC7B,OAAO,EAAE,sBAAsB;CAChC,CAAC,CAAC;AAEH,sDAAsD;AACtD,mDAAmD;AACnD,OAAO,EAAC,gBAAgB,EAAC,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAC,oBAAoB,EAAC,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AAchE,0BAA0B;AAC1B,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,qBAAqB,GACtB,MAAM,yBAAyB,CAAC;AAEjC,mDAAmD;AACnD,OAAO,EAAC,mBAAmB,EAAC,MAAM,oBAAoB,CAAC;AAGvD,2BAA2B;AAC3B,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AAEpD,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAEhD,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC","sourcesContent":["/**\n * {@include ../README.md}\n * @packageDocumentation\n */\n\nimport {VegaLiteSqlChart} from './VegaLiteSqlChart';\nimport {VegaLiteArrowChart} from './VegaLiteArrowChart';\nimport {VegaChartContainer} from './editor/VegaChartContainer';\nimport {VegaChartDisplay} from './editor/VegaChartDisplay';\nimport {VegaSpecEditorPanel} from './editor/VegaSpecEditorPanel';\nimport {VegaSqlEditorPanel} from './editor/VegaSqlEditorPanel';\nimport {VegaChartEditorActions} from './editor/VegaChartEditorActions';\nexport {VegaChartToolResult as VegaChartToolResult} from './VegaChartToolResult';\nexport type {VisualizationSpec} from 'vega-embed';\nexport type {SignalListenerHandler, SignalValue} from 'vega';\n\nexport {\n  createVegaChartTool,\n  createSqlValidator,\n  VegaChartToolParameters,\n  DEFAULT_VEGA_CHART_DESCRIPTION,\n} from './VegaChartTool';\n\nexport type {VegaChartToolOptions, VegaChartToolOutput} from './VegaChartTool';\n\n/**\n * Composable Vega-Lite chart component with editing capabilities.\n *\n * @example\n * ```tsx\n * // Compound component pattern\n * <VegaLiteChart.Container\n *   spec={mySpec}\n *   sqlQuery={myQuery}\n *   editable={true}\n *   onSpecChange={(spec) => saveSpec(spec)}\n * >\n *   <VegaLiteChart.Chart />\n *   <VegaLiteChart.SpecEditor />\n *   <VegaLiteChart.SqlEditor />\n *   <VegaLiteChart.Actions />\n * </VegaLiteChart.Container>\n *\n * // Simple usage (legacy)\n * <VegaLiteChart spec={mySpec} sqlQuery={myQuery} />\n * ```\n */\nexport const VegaLiteChart = Object.assign(VegaLiteSqlChart, {\n  // Legacy chart components\n  SqlChart: VegaLiteSqlChart,\n  ArrowChart: VegaLiteArrowChart,\n  // Compound editor components\n  Container: VegaChartContainer,\n  Chart: VegaChartDisplay,\n  SpecEditor: VegaSpecEditorPanel,\n  SqlEditor: VegaSqlEditorPanel,\n  Actions: VegaChartEditorActions,\n});\n\n// Export editor components and hooks for advanced use\n/** @deprecated Use VegaCodeMirrorEditor instead */\nexport {VegaMonacoEditor} from './editor/VegaMonacoEditor';\nexport {VegaCodeMirrorEditor} from './editor/VegaCodeMirrorEditor';\nexport {useVegaChartEditor} from './editor/useVegaChartEditor';\nexport {useVegaEditorContext} from './editor/VegaEditorContext';\n\n// Export editor types\nexport type {\n  EditorMode,\n  OnSpecChange,\n  OnSqlChange,\n  UseVegaChartEditorOptions,\n  UseVegaChartEditorReturn,\n  VegaEditorActions,\n  VegaEditorContextValue,\n  VegaEditorState,\n} from './editor/types';\n\n// Export schema utilities\nexport {\n  loadVegaLiteSchema,\n  getCachedVegaLiteSchema,\n  preloadVegaLiteSchema,\n} from './schema/vegaLiteSchema';\n\n// Export chart context and hook for custom actions\nexport {useVegaChartContext} from './VegaChartContext';\nexport type {VegaChartContextValue} from './VegaChartContext';\n\n// Export action components\nexport {VegaExportAction} from './VegaExportAction';\nexport type {VegaExportActionProps} from './VegaExportAction';\nexport {VegaEditAction} from './VegaEditAction';\nexport type {VegaEditActionProps} from './VegaEditAction';\nexport {VegaChartActions} from './VegaChartActions';\nexport type {VegaChartActionsProps} from './VegaChartActions';\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sqlrooms/vega",
-  "version": "0.29.0-rc.1",
+  "version": "0.29.0-rc.3",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "module": "dist/index.js",
@@ -10,7 +10,7 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/sqlrooms/sqlrooms.git"
+    "url": "git+https://github.com/sqlrooms/sqlrooms.git"
   },
   "files": [
     "dist"
@@ -19,13 +19,14 @@
     "access": "public"
   },
   "dependencies": {
-    "@openassistant/utils": "1.0.0-alpha.0",
-    "@sqlrooms/ai": "0.29.0-rc.1",
-    "@sqlrooms/duckdb": "0.29.0-rc.1",
-    "@sqlrooms/monaco-editor": "0.29.0-rc.1",
-    "@sqlrooms/sql-editor": "0.29.0-rc.1",
-    "@sqlrooms/ui": "0.29.0-rc.1",
-    "@sqlrooms/utils": "0.29.0-rc.1",
+    "@sqlrooms/ai-core": "0.29.0-rc.3",
+    "@sqlrooms/codemirror": "0.29.0-rc.3",
+    "@sqlrooms/duckdb": "0.29.0-rc.3",
+    "@sqlrooms/monaco-editor": "0.29.0-rc.3",
+    "@sqlrooms/sql-editor": "0.29.0-rc.3",
+    "@sqlrooms/ui": "0.29.0-rc.3",
+    "@sqlrooms/utils": "0.29.0-rc.3",
+    "ai": "^6.0.154",
     "lucide-react": "^0.556.0",
     "react-vega": "^8.0.0",
     "vega": "^6.2.0",
@@ -48,5 +49,5 @@
     "typecheck": "tsc --noEmit",
     "typedoc": "typedoc"
   },
-  "gitHead": "69f127fd34bd7f2ce3d75d6098dbf8c1f5ab50f3"
+  "gitHead": "4ffaf6c31d41c27f96bd3e4f5e83d431968721c3"
 }