@sqlrooms/mosaic 0.29.0-rc.0 → 0.29.0-rc.2

package/README.md

@@ -68,10 +68,9 @@ The `useMosaicClient` hook creates a Mosaic client that automatically queries da
 
 ```tsx
 import {Query, useMosaicClient} from '@sqlrooms/mosaic';
-import {Table} from 'apache-arrow';
 
 function MapView() {
-  const {data, isLoading, client} = useMosaicClient<Table>({
+  const {data, isLoading, client} = useMosaicClient({
     selectionName: 'brush', // Named selection for cross-filtering
     query: (filter: any) => {
       return Query.from('earthquakes')
@@ -89,6 +88,11 @@ function MapView() {
 }
 ```
 
+`useMosaicClient` returns an Apache Arrow table. Mosaic still uses its native
+table runtime internally, but that detail is hidden at the hook boundary so
+custom SQLRooms views can work with the same Arrow shape used by the DuckDB and
+deck packages.
+
 The hook accepts the following options:
 
 - `id` - Optional unique identifier for this client (auto-generated if not provided)
@@ -98,6 +102,41 @@ The hook accepts the following options:
 - `queryResult` - Optional callback when query results are received
 - `enabled` - Whether to automatically connect when mosaic is ready (default: `true`)
 
+### Mosaic Profiler Primitives
+
+The profiler primitives let you build a Quake-style cross-filtered table with
+per-column summaries on top of `MosaicSlice`.
+
+```tsx
+import {MosaicProfiler} from '@sqlrooms/mosaic';
+import {ScrollArea} from '@sqlrooms/ui';
+import {useMemo} from 'react';
+import {useRoomStore} from './store';
+
+function EarthquakeProfiler() {
+  const mosaic = useRoomStore((state) => state.mosaic);
+  const brush = useMemo(() => mosaic.getSelection('brush'), [mosaic]);
+
+  return (
+    <MosaicProfiler tableName="earthquakes" selection={brush} pageSize={25}>
+      <div className="flex min-h-0 flex-col border">
+        <ScrollArea className="min-h-0 flex-1">
+          <MosaicProfiler.Table>
+            <MosaicProfiler.Header />
+            <MosaicProfiler.Rows />
+          </MosaicProfiler.Table>
+        </ScrollArea>
+        <MosaicProfiler.StatusBar />
+      </div>
+    </MosaicProfiler>
+  );
+}
+```
+
+For the common case, prefer the compound `MosaicProfiler` API. `useMosaicProfiler`
+is still available when you need direct access to the profiler state for custom
+layout, sizing, or advanced composition.
+
 ### Working with Selections
 
 Selections enable cross-filtering between multiple visualizations. You can get or create a named selection from the store:

package/dist/MosaicChart.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Compound component for composable Mosaic chart editing.
+ *
+ * @example
+ * ```tsx
+ * <MosaicChart.Container spec={mySpec} onSpecChange={save}>
+ *   <MosaicChart.Display />
+ *   <MosaicChart.SpecEditor />
+ *   <MosaicChart.Actions />
+ * </MosaicChart.Container>
+ * ```
+ */
+export declare const MosaicChart: {
+    readonly Container: import("react").FC<import(".").MosaicChartContainerProps>;
+    readonly Display: import("react").FC<import(".").MosaicChartDisplayProps>;
+    readonly SpecEditor: import("react").FC<import(".").MosaicSpecEditorPanelProps>;
+    readonly Actions: import("react").FC<import(".").MosaicChartEditorActionsProps>;
+    readonly CodeMirrorEditor: import("react").FC<import(".").MosaicCodeMirrorEditorProps>;
+};
+//# sourceMappingURL=MosaicChart.d.ts.map

package/dist/MosaicChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MosaicChart.d.ts","sourceRoot":"","sources":["../src/MosaicChart.ts"],"names":[],"mappings":"AAMA;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,WAAW;;;;;;CAMd,CAAC"}

package/dist/MosaicChart.js

@@ -0,0 +1,25 @@
+import { MosaicChartContainer } from './editor/MosaicChartContainer';
+import { MosaicChartDisplay } from './editor/MosaicChartDisplay';
+import { MosaicSpecEditorPanel } from './editor/MosaicSpecEditorPanel';
+import { MosaicChartEditorActions } from './editor/MosaicChartEditorActions';
+import { MosaicCodeMirrorEditor } from './editor/MosaicCodeMirrorEditor';
+/**
+ * Compound component for composable Mosaic chart editing.
+ *
+ * @example
+ * ```tsx
+ * <MosaicChart.Container spec={mySpec} onSpecChange={save}>
+ *   <MosaicChart.Display />
+ *   <MosaicChart.SpecEditor />
+ *   <MosaicChart.Actions />
+ * </MosaicChart.Container>
+ * ```
+ */
+export const MosaicChart = {
+    Container: MosaicChartContainer,
+    Display: MosaicChartDisplay,
+    SpecEditor: MosaicSpecEditorPanel,
+    Actions: MosaicChartEditorActions,
+    CodeMirrorEditor: MosaicCodeMirrorEditor,
+};
+//# sourceMappingURL=MosaicChart.js.map

package/dist/MosaicChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MosaicChart.js","sourceRoot":"","sources":["../src/MosaicChart.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,oBAAoB,EAAC,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAC,kBAAkB,EAAC,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAC,qBAAqB,EAAC,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAC,wBAAwB,EAAC,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAC,sBAAsB,EAAC,MAAM,iCAAiC,CAAC;AAEvE;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,SAAS,EAAE,oBAAoB;IAC/B,OAAO,EAAE,kBAAkB;IAC3B,UAAU,EAAE,qBAAqB;IACjC,OAAO,EAAE,wBAAwB;IACjC,gBAAgB,EAAE,sBAAsB;CAChC,CAAC","sourcesContent":["import {MosaicChartContainer} from './editor/MosaicChartContainer';\nimport {MosaicChartDisplay} from './editor/MosaicChartDisplay';\nimport {MosaicSpecEditorPanel} from './editor/MosaicSpecEditorPanel';\nimport {MosaicChartEditorActions} from './editor/MosaicChartEditorActions';\nimport {MosaicCodeMirrorEditor} from './editor/MosaicCodeMirrorEditor';\n\n/**\n * Compound component for composable Mosaic chart editing.\n *\n * @example\n * ```tsx\n * <MosaicChart.Container spec={mySpec} onSpecChange={save}>\n *   <MosaicChart.Display />\n *   <MosaicChart.SpecEditor />\n *   <MosaicChart.Actions />\n * </MosaicChart.Container>\n * ```\n */\nexport const MosaicChart = {\n  Container: MosaicChartContainer,\n  Display: MosaicChartDisplay,\n  SpecEditor: MosaicSpecEditorPanel,\n  Actions: MosaicChartEditorActions,\n  CodeMirrorEditor: MosaicCodeMirrorEditor,\n} as const;\n"]}

package/dist/MosaicChartBuilder.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Compound component for building Mosaic charts from templates.
+ *
+ * Use `MosaicChartBuilder.Content` for an inline builder, or
+ * `MosaicChartBuilder.Dialog` for a dialog-wrapped version.
+ *
+ * @example Inline usage
+ * ```tsx
+ * <MosaicChartBuilder.Content
+ *   tableName="my_table"
+ *   columns={columns}
+ *   onCreateChart={handleCreate}
+ * />
+ * ```
+ *
+ * @example Dialog usage
+ * ```tsx
+ * <MosaicChartBuilder.Dialog
+ *   open={isOpen}
+ *   onOpenChange={setOpen}
+ *   tableName="my_table"
+ *   columns={columns}
+ *   onCreateChart={handleCreate}
+ * />
+ * ```
+ */
+export declare const MosaicChartBuilder: {
+    readonly Content: import("react").FC<import(".").ChartBuilderContentProps>;
+    readonly Dialog: import("react").FC<import(".").ChartBuilderDialogProps>;
+    readonly FieldSelector: import("react").FC<import(".").FieldSelectorInputProps>;
+};
+//# sourceMappingURL=MosaicChartBuilder.d.ts.map

package/dist/MosaicChartBuilder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MosaicChartBuilder.d.ts","sourceRoot":"","sources":["../src/MosaicChartBuilder.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,kBAAkB;;;;CAIrB,CAAC"}

package/dist/MosaicChartBuilder.js

@@ -0,0 +1,35 @@
+import { ChartBuilderContent } from './chart-builders/ChartBuilderContent';
+import { ChartBuilderDialog } from './chart-builders/ChartBuilderDialog';
+import { FieldSelectorInput } from './chart-builders/FieldSelectorInput';
+/**
+ * Compound component for building Mosaic charts from templates.
+ *
+ * Use `MosaicChartBuilder.Content` for an inline builder, or
+ * `MosaicChartBuilder.Dialog` for a dialog-wrapped version.
+ *
+ * @example Inline usage
+ * ```tsx
+ * <MosaicChartBuilder.Content
+ *   tableName="my_table"
+ *   columns={columns}
+ *   onCreateChart={handleCreate}
+ * />
+ * ```
+ *
+ * @example Dialog usage
+ * ```tsx
+ * <MosaicChartBuilder.Dialog
+ *   open={isOpen}
+ *   onOpenChange={setOpen}
+ *   tableName="my_table"
+ *   columns={columns}
+ *   onCreateChart={handleCreate}
+ * />
+ * ```
+ */
+export const MosaicChartBuilder = {
+    Content: ChartBuilderContent,
+    Dialog: ChartBuilderDialog,
+    FieldSelector: FieldSelectorInput,
+};
+//# sourceMappingURL=MosaicChartBuilder.js.map

package/dist/MosaicChartBuilder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MosaicChartBuilder.js","sourceRoot":"","sources":["../src/MosaicChartBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,mBAAmB,EAAC,MAAM,sCAAsC,CAAC;AACzE,OAAO,EAAC,kBAAkB,EAAC,MAAM,qCAAqC,CAAC;AACvE,OAAO,EAAC,kBAAkB,EAAC,MAAM,qCAAqC,CAAC;AAEvE;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG;IAChC,OAAO,EAAE,mBAAmB;IAC5B,MAAM,EAAE,kBAAkB;IAC1B,aAAa,EAAE,kBAAkB;CACzB,CAAC","sourcesContent":["import {ChartBuilderContent} from './chart-builders/ChartBuilderContent';\nimport {ChartBuilderDialog} from './chart-builders/ChartBuilderDialog';\nimport {FieldSelectorInput} from './chart-builders/FieldSelectorInput';\n\n/**\n * Compound component for building Mosaic charts from templates.\n *\n * Use `MosaicChartBuilder.Content` for an inline builder, or\n * `MosaicChartBuilder.Dialog` for a dialog-wrapped version.\n *\n * @example Inline usage\n * ```tsx\n * <MosaicChartBuilder.Content\n *   tableName=\"my_table\"\n *   columns={columns}\n *   onCreateChart={handleCreate}\n * />\n * ```\n *\n * @example Dialog usage\n * ```tsx\n * <MosaicChartBuilder.Dialog\n *   open={isOpen}\n *   onOpenChange={setOpen}\n *   tableName=\"my_table\"\n *   columns={columns}\n *   onCreateChart={handleCreate}\n * />\n * ```\n */\nexport const MosaicChartBuilder = {\n  Content: ChartBuilderContent,\n  Dialog: ChartBuilderDialog,\n  FieldSelector: FieldSelectorInput,\n} as const;\n"]}

package/dist/MosaicColorLegend.d.ts

@@ -0,0 +1,18 @@
+import type { ColorScaleConfig } from '@sqlrooms/color-scales';
+import { Selection } from '@uwdata/mosaic-core';
+type LegendDomainValue = string | number | Date;
+type CreateMosaicColorLegendPlotOptions = {
+    colorScale: ColorScaleConfig;
+    selection?: Selection;
+    domain?: ReadonlyArray<LegendDomainValue>;
+    title?: string;
+    width?: number;
+    tickFormat?: string;
+};
+export type MosaicColorLegendProps = CreateMosaicColorLegendPlotOptions & {
+    className?: string;
+};
+export declare function createMosaicColorLegendPlot({ colorScale, selection, domain, title, width, tickFormat, }: CreateMosaicColorLegendPlotOptions): any;
+export declare function MosaicColorLegend({ colorScale, selection, domain, title, width, tickFormat, className, }: MosaicColorLegendProps): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=MosaicColorLegend.d.ts.map

package/dist/MosaicColorLegend.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MosaicColorLegend.d.ts","sourceRoot":"","sources":["../src/MosaicColorLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,wBAAwB,CAAC;AAG7D,OAAO,EAAC,SAAS,EAAC,MAAM,qBAAqB,CAAC;AAK9C,KAAK,iBAAiB,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;AAEhD,KAAK,kCAAkC,GAAG;IACxC,UAAU,EAAE,gBAAgB,CAAC;IAC7B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,MAAM,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,kCAAkC,GAAG;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAuDF,wBAAgB,2BAA2B,CAAC,EAC1C,UAAU,EACV,SAAS,EACT,MAAM,EACN,KAAK,EACL,KAAW,EACX,UAAkB,GACnB,EAAE,kCAAkC,OAiDpC;AAED,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,SAAS,EACT,MAAM,EACN,KAAK,EACL,KAAK,EACL,UAAU,EACV,SAAS,GACV,EAAE,sBAAsB,kDAgDxB"}

package/dist/MosaicColorLegend.js

@@ -0,0 +1,117 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { resolveColorLegendTitle } from '@sqlrooms/color-scales';
+import { cn, getResolvedTheme, useTheme } from '@sqlrooms/ui';
+import * as vg from '@uwdata/vgplot';
+import { useMemo } from 'react';
+import { VgPlotChart } from './VgPlotChart';
+function isExplicitNumericDomain(domain) {
+    return domain !== 'auto';
+}
+function resolveLegendDomain(colorScale, domain) {
+    if ((colorScale.type === 'sequential' ||
+        colorScale.type === 'diverging' ||
+        colorScale.type === 'quantize') &&
+        isExplicitNumericDomain(colorScale.domain)) {
+        return colorScale.domain;
+    }
+    return domain;
+}
+function getVgColorScaleType(colorScale) {
+    switch (colorScale.type) {
+        case 'sequential':
+            return 'linear';
+        case 'diverging':
+            return 'diverging';
+        case 'quantize':
+            return 'quantize';
+        case 'quantile':
+            return 'quantile';
+        case 'threshold':
+            return 'threshold';
+        case 'categorical':
+            return 'categorical';
+        default: {
+            const _exhaustive = colorScale;
+            throw new Error(`Unknown color scale type: ${_exhaustive.type}`);
+        }
+    }
+}
+function supportsInteractiveLegend(colorScale) {
+    return (colorScale.type === 'sequential' ||
+        colorScale.type === 'diverging' ||
+        colorScale.type === 'categorical');
+}
+export function createMosaicColorLegendPlot({ colorScale, selection, domain, title, width = 220, tickFormat = '.1f', }) {
+    const resolvedDomain = resolveLegendDomain(colorScale, domain);
+    const legendTitle = resolveColorLegendTitle(colorScale, title);
+    const plotAttributes = [
+        vg.colorScale(getVgColorScaleType(colorScale)),
+        vg.colorScheme(colorScale.scheme),
+        vg.colorLabel(legendTitle),
+        vg.marginTop(0),
+        vg.marginRight(0),
+        vg.marginBottom(0),
+        vg.marginLeft(0),
+    ];
+    if ('clamp' in colorScale && colorScale.clamp !== undefined) {
+        plotAttributes.push(vg.colorClamp(colorScale.clamp));
+    }
+    if ('reverse' in colorScale && colorScale.reverse !== undefined) {
+        plotAttributes.push(vg.colorReverse(colorScale.reverse));
+    }
+    if (colorScale.type === 'diverging') {
+        if (Array.isArray(resolvedDomain) && resolvedDomain.length === 3) {
+            plotAttributes.push(vg.colorDomain([resolvedDomain[0], resolvedDomain[2]]), vg.colorPivot(resolvedDomain[1]));
+        }
+        else if (Array.isArray(resolvedDomain) && resolvedDomain.length === 2) {
+            plotAttributes.push(vg.colorDomain(resolvedDomain));
+        }
+    }
+    else if (colorScale.type === 'threshold') {
+        plotAttributes.push(vg.colorDomain(colorScale.thresholds));
+    }
+    else if (resolvedDomain) {
+        plotAttributes.push(vg.colorDomain(resolvedDomain));
+    }
+    if (colorScale.type === 'quantize' || colorScale.type === 'quantile') {
+        plotAttributes.push(vg.colorN(colorScale.bins ?? 5));
+    }
+    const backingPlot = vg.plot(...plotAttributes);
+    return vg.colorLegend({
+        for: backingPlot,
+        as: supportsInteractiveLegend(colorScale) ? selection : undefined,
+        field: colorScale.field,
+        width,
+        tickFormat,
+        label: legendTitle,
+    });
+}
+export function MosaicColorLegend({ colorScale, selection, domain, title, width, tickFormat, className, }) {
+    const { theme } = useTheme();
+    const resolvedTheme = getResolvedTheme(theme);
+    const legendSpecKey = JSON.stringify({
+        colorScale,
+        domain,
+        title,
+        width,
+        tickFormat,
+    });
+    // eslint-disable-next-line react-hooks/preserve-manual-memoization
+    const plot = useMemo(() => createMosaicColorLegendPlot({
+        colorScale,
+        selection,
+        domain,
+        title,
+        width,
+        tickFormat,
+    }), 
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- deep-equal via serialized key instead of object refs
+    [legendSpecKey, selection]);
+    if (!plot) {
+        return null;
+    }
+    return (_jsx("div", { className: cn('pointer-events-auto rounded-md border px-3 py-2 shadow-lg backdrop-blur-sm', 'border-slate-200 bg-white/95 text-slate-900', 'dark:border-slate-700 dark:bg-[#1f1d1b]/90 dark:text-slate-100', '[&_svg]:block [&_svg]:overflow-visible', '[&_svg_line]:stroke-current [&_svg_path]:stroke-current [&_svg_text]:fill-current', resolvedTheme === 'dark' &&
+            '[&_svg_.domain]:stroke-slate-500 [&_svg_line]:stroke-slate-500', resolvedTheme === 'light' &&
+            '[&_svg_.domain]:stroke-slate-400 [&_svg_line]:stroke-slate-400', className), children: _jsx(VgPlotChart, { plot: plot }) }));
+}
+//# sourceMappingURL=MosaicColorLegend.js.map

package/dist/MosaicColorLegend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MosaicColorLegend.js","sourceRoot":"","sources":["../src/MosaicColorLegend.tsx"],"names":[],"mappings":"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","sourcesContent":["import type {ColorScaleConfig} from '@sqlrooms/color-scales';\nimport {resolveColorLegendTitle} from '@sqlrooms/color-scales';\nimport {cn, getResolvedTheme, useTheme} from '@sqlrooms/ui';\nimport {Selection} from '@uwdata/mosaic-core';\nimport * as vg from '@uwdata/vgplot';\nimport {useMemo} from 'react';\nimport {VgPlotChart} from './VgPlotChart';\n\ntype LegendDomainValue = string | number | Date;\n\ntype CreateMosaicColorLegendPlotOptions = {\n  colorScale: ColorScaleConfig;\n  selection?: Selection;\n  domain?: ReadonlyArray<LegendDomainValue>;\n  title?: string;\n  width?: number;\n  tickFormat?: string;\n};\n\nexport type MosaicColorLegendProps = CreateMosaicColorLegendPlotOptions & {\n  className?: string;\n};\n\nfunction isExplicitNumericDomain(\n  domain: 'auto' | [number, number] | [number, number, number],\n): domain is [number, number] | [number, number, number] {\n  return domain !== 'auto';\n}\n\nfunction resolveLegendDomain(\n  colorScale: ColorScaleConfig,\n  domain?: ReadonlyArray<LegendDomainValue>,\n) {\n  if (\n    (colorScale.type === 'sequential' ||\n      colorScale.type === 'diverging' ||\n      colorScale.type === 'quantize') &&\n    isExplicitNumericDomain(colorScale.domain)\n  ) {\n    return colorScale.domain;\n  }\n\n  return domain;\n}\n\nfunction getVgColorScaleType(colorScale: ColorScaleConfig) {\n  switch (colorScale.type) {\n    case 'sequential':\n      return 'linear';\n    case 'diverging':\n      return 'diverging';\n    case 'quantize':\n      return 'quantize';\n    case 'quantile':\n      return 'quantile';\n    case 'threshold':\n      return 'threshold';\n    case 'categorical':\n      return 'categorical';\n    default: {\n      const _exhaustive: never = colorScale;\n      throw new Error(\n        `Unknown color scale type: ${(_exhaustive as ColorScaleConfig).type}`,\n      );\n    }\n  }\n}\n\nfunction supportsInteractiveLegend(colorScale: ColorScaleConfig) {\n  return (\n    colorScale.type === 'sequential' ||\n    colorScale.type === 'diverging' ||\n    colorScale.type === 'categorical'\n  );\n}\n\nexport function createMosaicColorLegendPlot({\n  colorScale,\n  selection,\n  domain,\n  title,\n  width = 220,\n  tickFormat = '.1f',\n}: CreateMosaicColorLegendPlotOptions) {\n  const resolvedDomain = resolveLegendDomain(colorScale, domain);\n  const legendTitle = resolveColorLegendTitle(colorScale, title);\n  const plotAttributes: Array<(plot: any) => void> = [\n    vg.colorScale(getVgColorScaleType(colorScale)),\n    vg.colorScheme(colorScale.scheme),\n    vg.colorLabel(legendTitle),\n    vg.marginTop(0),\n    vg.marginRight(0),\n    vg.marginBottom(0),\n    vg.marginLeft(0),\n  ];\n\n  if ('clamp' in colorScale && colorScale.clamp !== undefined) {\n    plotAttributes.push(vg.colorClamp(colorScale.clamp));\n  }\n\n  if ('reverse' in colorScale && colorScale.reverse !== undefined) {\n    plotAttributes.push(vg.colorReverse(colorScale.reverse));\n  }\n\n  if (colorScale.type === 'diverging') {\n    if (Array.isArray(resolvedDomain) && resolvedDomain.length === 3) {\n      plotAttributes.push(\n        vg.colorDomain([resolvedDomain[0], resolvedDomain[2]]),\n        vg.colorPivot(resolvedDomain[1]),\n      );\n    } else if (Array.isArray(resolvedDomain) && resolvedDomain.length === 2) {\n      plotAttributes.push(vg.colorDomain(resolvedDomain));\n    }\n  } else if (colorScale.type === 'threshold') {\n    plotAttributes.push(vg.colorDomain(colorScale.thresholds));\n  } else if (resolvedDomain) {\n    plotAttributes.push(vg.colorDomain(resolvedDomain));\n  }\n\n  if (colorScale.type === 'quantize' || colorScale.type === 'quantile') {\n    plotAttributes.push(vg.colorN(colorScale.bins ?? 5));\n  }\n\n  const backingPlot = vg.plot(...plotAttributes);\n  return vg.colorLegend({\n    for: backingPlot,\n    as: supportsInteractiveLegend(colorScale) ? selection : undefined,\n    field: colorScale.field,\n    width,\n    tickFormat,\n    label: legendTitle,\n  });\n}\n\nexport function MosaicColorLegend({\n  colorScale,\n  selection,\n  domain,\n  title,\n  width,\n  tickFormat,\n  className,\n}: MosaicColorLegendProps) {\n  const {theme} = useTheme();\n  const resolvedTheme = getResolvedTheme(theme);\n  const legendSpecKey = JSON.stringify({\n    colorScale,\n    domain,\n    title,\n    width,\n    tickFormat,\n  });\n\n  // eslint-disable-next-line react-hooks/preserve-manual-memoization\n  const plot = useMemo(\n    () =>\n      createMosaicColorLegendPlot({\n        colorScale,\n        selection,\n        domain,\n        title,\n        width,\n        tickFormat,\n      }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- deep-equal via serialized key instead of object refs\n    [legendSpecKey, selection],\n  );\n\n  if (!plot) {\n    return null;\n  }\n\n  return (\n    <div\n      className={cn(\n        'pointer-events-auto rounded-md border px-3 py-2 shadow-lg backdrop-blur-sm',\n        'border-slate-200 bg-white/95 text-slate-900',\n        'dark:border-slate-700 dark:bg-[#1f1d1b]/90 dark:text-slate-100',\n        '[&_svg]:block [&_svg]:overflow-visible',\n        '[&_svg_line]:stroke-current [&_svg_path]:stroke-current [&_svg_text]:fill-current',\n        resolvedTheme === 'dark' &&\n          '[&_svg_.domain]:stroke-slate-500 [&_svg_line]:stroke-slate-500',\n        resolvedTheme === 'light' &&\n          '[&_svg_.domain]:stroke-slate-400 [&_svg_line]:stroke-slate-400',\n        className,\n      )}\n    >\n      <VgPlotChart plot={plot} />\n    </div>\n  );\n}\n"]}

package/dist/MosaicSlice.d.ts

@@ -1,11 +1,12 @@
-import { DuckDbSliceState } from '@sqlrooms/duckdb';
+import { type DuckDbSliceState } from '@sqlrooms/duckdb';
 import { type SliceFunctions } from '@sqlrooms/room-store';
 import { Connector, Coordinator, makeClient, Selection } from '@uwdata/mosaic-core';
 import { Query } from '@uwdata/mosaic-sql';
+import type { Table as ArrowTable } from 'apache-arrow';
 import { z } from 'zod';
 export declare const MosaicSliceConfig: z.ZodObject<{}, z.core.$strip>;
 export type MosaicSliceConfig = z.infer<typeof MosaicSliceConfig>;
-export type MosaicClientOptions<T = unknown> = {
+export type MosaicClientOptions = {
     /** Unique identifier for this client */
     id?: string;
     /** Selection name for cross-filtering (will create if doesn't exist) */
@@ -15,16 +16,16 @@ export type MosaicClientOptions<T = unknown> = {
     /** Query builder function that receives the current filter */
     query: (filter: unknown) => ReturnType<typeof Query.from>;
     /** Callback when query results are received */
-    queryResult?: (result: T) => void;
+    queryResult?: (result: ArrowTable) => void;
 };
-export type TrackedClient<T = unknown> = {
+export type TrackedClient = {
     id: string;
     client: ReturnType<typeof makeClient>;
     createdAt: number;
     isLoading: boolean;
-    data: T | null;
+    data: unknown | null;
     selection?: Selection;
-    queryResultCallback?: (result: T) => void;
+    queryResultCallback?: (result: ArrowTable) => void;
 };
 export type MosaicSliceState = {
     mosaic: SliceFunctions & {
@@ -32,7 +33,7 @@ export type MosaicSliceState = {
             status: 'idle' | 'loading';
         } | {
             status: 'ready';
-            connector: Connector;
+            connector?: Connector;
             coordinator: Coordinator;
         } | {
             status: 'error';
@@ -40,18 +41,18 @@ export type MosaicSliceState = {
         };
         config: MosaicSliceConfig;
         /** Record of registered clients by id */
-        clients: Record<string, TrackedClient<unknown>>;
+        clients: Record<string, TrackedClient>;
         /** Named selections for cross-filtering (e.g., 'brush', 'hover') */
         selections: Record<string, Selection>;
         initialize: () => Promise<void>;
         /** Get or create a named selection for cross-filtering */
         getSelection: (name: string, type?: 'crossfilter' | 'single' | 'union') => Selection;
         /** Create a mosaic client and register it */
-        createClient: <T>(options: MosaicClientOptions<T>) => string;
+        createClient: (options: MosaicClientOptions) => string;
         /** Ensure a client exists with given options (idempotent - creates or updates as needed) */
-        ensureClient: <T>(options: MosaicClientOptions<T> & {
+        ensureClient: (options: MosaicClientOptions & {
             id: string;
-            onQueryResult?: (result: T) => void;
+            onQueryResult?: (result: ArrowTable) => void;
         }) => void;
         /** Disconnect and remove a client by id */
         destroyClient: (id: string) => void;
@@ -60,9 +61,11 @@ export type MosaicSliceState = {
     };
 };
 export declare function createDefaultMosaicConfig(props?: Partial<MosaicSliceConfig>): MosaicSliceConfig;
-export declare function createMosaicSlice(props?: {
+export type CreateMosaicSliceProps = {
     config?: Partial<MosaicSliceConfig>;
-}): import("zustand").StateCreator<MosaicSliceState>;
+    coordinator?: Coordinator;
+};
+export declare function createMosaicSlice(props?: CreateMosaicSliceProps): import("zustand").StateCreator<MosaicSliceState>;
 export type DuckDbSliceStateWithMosaic = DuckDbSliceState & MosaicSliceState;
 export declare function useStoreWithMosaic<T>(selector: (state: DuckDbSliceStateWithMosaic) => T): T;
 //# sourceMappingURL=MosaicSlice.d.ts.map

package/dist/MosaicSlice.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MosaicSlice.d.ts","sourceRoot":"","sources":["../src/MosaicSlice.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"MosaicSlice.d.ts","sourceRoot":"","sources":["../src/MosaicSlice.ts"],"names":[],"mappings":"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"}

package/dist/MosaicSlice.js

@@ -1,40 +1,45 @@
 import { createId } from '@paralleldrive/cuid2';
-import { isWasmDuckDbConnector } from '@sqlrooms/duckdb';
+import { isWasmDuckDbConnector, } from '@sqlrooms/duckdb';
 import { createSlice, useBaseRoomStore, } from '@sqlrooms/room-store';
 import { coordinator, makeClient, Selection, wasmConnector, } from '@uwdata/mosaic-core';
 import { produce } from 'immer';
 import { z } from 'zod';
+import { createMosaicTableFromArrowTable, toArrowClientResult, } from './tableInterop';
 export const MosaicSliceConfig = z.object({});
 export function createDefaultMosaicConfig(props) {
     return {
         ...props,
     };
 }
-export function createMosaicSlice(props) {
+export function createMosaicSlice(props = {}) {
     return createSlice((set, get, store) => ({
         mosaic: {
             config: createDefaultMosaicConfig(props?.config),
-            connection: {
-                status: 'idle',
-                connector: undefined,
-            },
+            connection: { status: 'idle' },
             clients: {},
             selections: {},
             async initialize() {
                 let mosaicConnector;
+                let resolvedCoordinator;
                 set((state) => produce(state, (draft) => {
                     draft.mosaic.connection = { status: 'loading' };
                 }));
                 try {
-                    const dbConnector = await get().db.getConnector();
-                    if (!isWasmDuckDbConnector(dbConnector)) {
-                        throw new Error('Only WasmDuckDbConnector is currently supported');
+                    if (props.coordinator) {
+                        resolvedCoordinator = props.coordinator;
+                    }
+                    else {
+                        const dbConnector = await get().db.getConnector();
+                        resolvedCoordinator = coordinator();
+                        mosaicConnector = isWasmDuckDbConnector(dbConnector)
+                            ? await wasmConnector({
+                                // @ts-expect-error - We install a different version of duckdb-wasm
+                                duckDb: dbConnector.getDb(),
+                                connection: dbConnector.getConnection(),
+                            })
+                            : createDuckDbMosaicConnector(dbConnector);
+                        resolvedCoordinator.databaseConnector(mosaicConnector);
                     }
-                    mosaicConnector = await coordinator().databaseConnector(wasmConnector({
-                        // @ts-expect-error - We install a different version of duckdb-wasm
-                        duckDb: dbConnector.getDb(),
-                        connection: dbConnector.getConnection(),
-                    }));
                 }
                 catch (error) {
                     set((state) => produce(state, (draft) => {
@@ -42,15 +47,13 @@ export function createMosaicSlice(props) {
                     }));
                     throw error;
                 }
-                finally {
-                    set((state) => produce(state, (draft) => {
-                        draft.mosaic.connection = {
-                            status: 'ready',
-                            connector: mosaicConnector,
-                            coordinator: coordinator(),
-                        };
-                    }));
-                }
+                set((state) => produce(state, (draft) => {
+                    draft.mosaic.connection = {
+                        status: 'ready',
+                        connector: mosaicConnector,
+                        coordinator: resolvedCoordinator,
+                    };
+                }));
             },
             async destroy() {
                 get().mosaic.destroyAllClients();
@@ -82,16 +85,15 @@ export function createMosaicSlice(props) {
                         : undefined);
                 // Wrap queryResult to update store state AND call external callback
                 const wrappedQueryResult = (data) => {
-                    const typedData = data;
                     set((state) => produce(state, (draft) => {
                         const tracked = draft.mosaic.clients[id];
                         if (tracked) {
-                            tracked.data = typedData;
+                            tracked.data = data;
                             tracked.isLoading = false;
                         }
                     }));
                     // Call external callback if provided
-                    options.queryResult?.(typedData);
+                    options.queryResult?.(toArrowClientResult(data));
                 };
                 const client = makeClient({
                     coordinator: connection.coordinator,
@@ -108,7 +110,7 @@ export function createMosaicSlice(props) {
                         data: null,
                         selection,
                         queryResultCallback: options.queryResult
-                            ? (result) => options.queryResult(result)
+                            ? (result) => options.queryResult(toArrowClientResult(result))
                             : undefined,
                     };
                 }));
@@ -138,18 +140,18 @@ export function createMosaicSlice(props) {
                 }
                 // Create new client with wrapped queryResult that calls both store update and external callback
                 const wrappedQueryResult = (data) => {
-                    const typedData = data;
                     set((state) => produce(state, (draft) => {
                         const tracked = draft.mosaic.clients[options.id];
                         if (tracked) {
-                            tracked.data = typedData;
+                            tracked.data = data;
                             tracked.isLoading = false;
                         }
                     }));
+                    const arrowData = toArrowClientResult(data);
                     // Call external callback if provided
-                    options.onQueryResult?.(typedData);
+                    options.onQueryResult?.(arrowData);
                     // Also call original queryResult if provided
-                    options.queryResult?.(typedData);
+                    options.queryResult?.(arrowData);
                 };
                 const client = makeClient({
                     coordinator: connection.coordinator,
@@ -165,7 +167,9 @@ export function createMosaicSlice(props) {
                         isLoading: true,
                         data: null,
                         selection,
-                        queryResultCallback: options.onQueryResult,
+                        queryResultCallback: options.onQueryResult
+                            ? (result) => options.onQueryResult(toArrowClientResult(result))
+                            : undefined,
                     };
                 }));
             },
@@ -198,4 +202,35 @@ export function createMosaicSlice(props) {
 export function useStoreWithMosaic(selector) {
     return useBaseRoomStore((state) => selector(state));
 }
+/**
+ * Adapts a {@link DuckDbConnector} to the Mosaic {@link Connector} interface.
+ *
+ * For `'arrow'` queries the Apache Arrow table returned by the connector is
+ * converted via {@link createMosaicTableFromArrowTable} into a flechette
+ * `Table`, which is the shape Mosaic consumers expect (with `.toColumns()`).
+ * For `'json'` queries, rows are materialized with {@link Array.from} which
+ * may have performance/memory implications for very large result sets.
+ * The `as any` casts on the return type are an intentional adapter trade-off
+ * to satisfy the polymorphic {@link Connector['query']} signature.
+ */
+function createDuckDbMosaicConnector(connector) {
+    return {
+        query: (async (query) => {
+            const queryType = query.type ?? 'arrow';
+            if (queryType === 'exec') {
+                await connector.execute(query.sql);
+                return undefined;
+            }
+            if (queryType === 'json') {
+                const rows = await connector.queryJson(query.sql);
+                return Array.from(rows);
+            }
+            if (queryType === 'arrow') {
+                const arrowTable = await connector.query(query.sql);
+                return createMosaicTableFromArrowTable(arrowTable);
+            }
+            throw new Error(`Unsupported Mosaic query type "${queryType}".`);
+        }),
+    };
+}
 //# sourceMappingURL=MosaicSlice.js.map