@sqlrooms/mosaic 0.6.0 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md ADDED
@@ -0,0 +1,67 @@
1
+ This package is part of the SQLRooms framework. It provides React components and hooks for integrating [Mosaic](https://idl.uw.edu/mosaic/) - a visualization library for data exploration and analysis - into SQLRooms applications.
2
+
3
+ ## Overview
4
+
5
+ Mosaic is a JavaScript library for data visualization and analysis developed by the [Interactive Data Lab (IDL)](https://idl.uw.edu/) at the University of Washington. It combines the expressiveness of declarative visualization grammars with the power of reactive programming and SQL queries.
6
+
7
+ One of Mosaic's powerful features is its cross-filtering capability powered by DuckDB, allowing users to interactively filter and explore large datasets with millions of records directly in the browser. This enables creating interactive dashboards where selections in one chart automatically filter data in other charts. For an example of this functionality, see the [Cross-Filter Flights demo](https://idl.uw.edu/mosaic/examples/flights-200k.html) which demonstrates interactive filtering across multiple visualizations of a 200,000-record flight dataset.
8
+
9
+ This package provides:
10
+
11
+ - React components for rendering Vega-Lite charts using Mosaic
12
+ - Hooks for integrating Mosaic with DuckDB in SQLRooms applications
13
+ - Utilities for working with Mosaic specifications
14
+
15
+ ## Installation
16
+
17
+ ```bash
18
+ npm install @sqlrooms/mosaic
19
+ ```
20
+
21
+ ## Usage
22
+
23
+ ### VgPlotChart Component
24
+
25
+ The `VgPlotChart` component renders a Vega-Lite chart using the Mosaic library:
26
+
27
+ ```tsx
28
+ import {VgPlotChart, Spec} from '@sqlrooms/mosaic';
29
+
30
+ const spec: Spec = {
31
+ // Your Vega-Lite specification
32
+ };
33
+
34
+ function MyChart() {
35
+ return <VgPlotChart spec={spec} />;
36
+ }
37
+ ```
38
+
39
+ ### useMosaic Hook
40
+
41
+ The `useMosaic` hook provides access to the Mosaic connector for DuckDB:
42
+
43
+ ```tsx
44
+ import {useMosaic} from '@sqlrooms/mosaic';
45
+
46
+ function MyComponent() {
47
+ const {isMosaicLoading, mosaicConnector} = useMosaic();
48
+
49
+ if (isMosaicLoading) {
50
+ return <div>Loading...</div>;
51
+ }
52
+
53
+ // Use mosaicConnector to interact with DuckDB through Mosaic
54
+ return <div>Mosaic is ready!</div>;
55
+ }
56
+ ```
57
+
58
+ ## Resources
59
+
60
+ - [Mosaic Documentation](https://idl.uw.edu/mosaic/)
61
+ - [Cross-Filter Flights Demo](https://idl.uw.edu/mosaic/examples/flights-200k.html)
62
+ - [Vega-Lite Documentation](https://vega.github.io/vega-lite/)
63
+ - [DuckDB Documentation](https://duckdb.org/docs/)
64
+
65
+ ## License
66
+
67
+ MIT
package/dist/index.d.ts CHANGED
@@ -1,3 +1,7 @@
1
+ /**
2
+ * {@include ../README.md}
3
+ * @packageDocumentation
4
+ */
1
5
  export { getMosaicConnector, useMosaic } from './use-mosaic';
2
6
  export { VgPlotChart } from './VgPlotChart';
3
7
  export type { Spec } from '@uwdata/mosaic-spec';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,kBAAkB,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,YAAY,EAAC,IAAI,EAAC,MAAM,qBAAqB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,EAAC,kBAAkB,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,YAAY,EAAC,IAAI,EAAC,MAAM,qBAAqB,CAAC"}
package/dist/index.js CHANGED
@@ -1,3 +1,7 @@
1
+ /**
2
+ * {@include ../README.md}
3
+ * @packageDocumentation
4
+ */
1
5
  export { getMosaicConnector, useMosaic } from './use-mosaic';
2
6
  export { VgPlotChart } from './VgPlotChart';
3
7
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,kBAAkB,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC","sourcesContent":["export {getMosaicConnector, useMosaic} from './use-mosaic';\nexport {VgPlotChart} from './VgPlotChart';\nexport type {Spec} from '@uwdata/mosaic-spec';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,EAAC,kBAAkB,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC","sourcesContent":["/**\n * {@include ../README.md}\n * @packageDocumentation\n */\nexport {getMosaicConnector, useMosaic} from './use-mosaic';\nexport {VgPlotChart} from './VgPlotChart';\nexport type {Spec} from '@uwdata/mosaic-spec';\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sqlrooms/mosaic",
3
- "version": "0.6.0",
3
+ "version": "0.8.0",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "module": "dist/index.js",
@@ -20,7 +20,7 @@
20
20
  },
21
21
  "dependencies": {
22
22
  "@ai-sdk/provider": "^1.0.7",
23
- "@sqlrooms/duckdb": "0.6.0",
23
+ "@sqlrooms/duckdb": "0.8.0",
24
24
  "@uwdata/mosaic-core": "^0.12.2",
25
25
  "@uwdata/mosaic-spec": "^0.12.2",
26
26
  "@uwdata/vgplot": "^0.12.2"
@@ -35,5 +35,5 @@
35
35
  "lint": "eslint .",
36
36
  "typedoc": "typedoc"
37
37
  },
38
- "gitHead": "f46dfe6b5d135e1a039b49b3ba71cda7150eab0f"
38
+ "gitHead": "99b46a96ab900e6b005bcd30cfbfe7b3c9d51f8d"
39
39
  }