Merge remote-tracking branch 'origin/main' into clarasb-xxx-typography_component

# Conflicts:
#	chartlets.js/CHANGES.md

Author: clarasb

chartlets.js/CHANGES.md

@@ -1,5 +1,13 @@
 ## Version 0.1.7 (in development)
 
+* Updated dependencies
+	- `react-vega: ^7.7.1`
+	- `canvas: ^3.2.0`
+	
+* Omitted multiple VegaTheme options. While using `react-vega` v7 the 
+  vegaTheme needs to be restricted to: "dark" | "excel" | "ggplot2" | 
+  "quartz" | "vox" | "default" | "system" | undefined .
+
 * Typology component now allows color and text arguments. 
   If a user uses text and children, the text argument replaces the 
   children.

chartlets.js/package-lock.json

@@ -34,7 +34,7 @@
     "chartlets": "file:../lib",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-vega": ">=7",
+    "react-vega": "^7.7.1",
     "vega": "^5.33.0",
     "vega-embed": "^6.5.1",
     "vega-lite": "^5.23.0",

chartlets.js/packages/demo/package.json

@@ -65,7 +65,7 @@
     "@mui/x-data-grid": ">=7",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-vega": ">=7",
+    "react-vega": "^7.7.1",
     "vega": "^5.33.0",
     "vega-embed": "^6.5.1",
     "vega-lite": "^5.23.0",
@@ -93,7 +93,7 @@
     "@typescript-eslint/parser": "^7.18.0",
     "@vitejs/plugin-react-swc": "^3.7.0",
     "@vitest/coverage-istanbul": "^2.1.8",
-    "canvas": "^2.11.2",
+    "canvas": "^3.2.0",
     "eslint": "^8.57.1",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-react-refresh": "^0.4.12",

chartlets.js/packages/lib/package.json

@@ -79,13 +79,13 @@ describe("useVegaTheme", () => {
 
   it("vega theme in dark mode", () => {
     setMatchMediaState(true);
-    const { result } = renderHook(() => useVegaTheme("carbong90"));
-    expect(result.current).toEqual("carbong90");
+    const { result } = renderHook(() => useVegaTheme("quartz"));
+    expect(result.current).toEqual("quartz");
   });
 
   it("vega theme in light mode", () => {
     setMatchMediaState(false);
-    const { result } = renderHook(() => useVegaTheme("carbong90"));
-    expect(result.current).toEqual("carbong90");
+    const { result } = renderHook(() => useVegaTheme("quartz"));
+    expect(result.current).toEqual("quartz");
   });
 });

chartlets.js/packages/lib/src/plugins/vega/hooks/useVegaTheme.test.ts

@@ -2,7 +2,10 @@ import * as vegaThemes from "vega-themes";
 import { useThemeMode } from "@/hooks";
 import { useMemo } from "react";
 
-export type VegaTheme = keyof Omit<typeof vegaThemes, "version">;
+// while using `react-vega` v7 the vegaTheme needs to be restricted to:
+// "dark" | "excel" | "ggplot2" | "quartz" | "vox" | "default" | "system" | undefined
+export type VegaTheme = keyof Omit<typeof vegaThemes, "version" | "latimes"| "fivethirtyeight" | "urbaninstitute" |
+    "googlecharts" | "powerbi" | "carbonwhite" | "carbong10" | "carbong90" | "carbong100">;
 
 const isVegaTheme = (key?: string): key is VegaTheme =>
   !!key && key in vegaThemes;

chartlets.js/packages/lib/src/plugins/vega/hooks/useVegaTheme.ts

@@ -3,7 +3,7 @@ channels:
   - conda-forge
 dependencies:
   # Library Dependencies
-  - python >=3.10
+  - python >=3.10,<3.14
   # Optional Dependencies
   - altair
   # Demo Dependencies

chartlets.py/environment.yml

@@ -13,7 +13,7 @@ keywords = [
   "dashboard", "charts", "vega", "altair", "plots"
 ]
 license = {text = "MIT"}
-requires-python = ">=3.10"
+requires-python = ">=3.10,<3.14"
 dependencies = []
 classifiers = [
   "Development Status :: 5 - Production/Stable",

chartlets.py/pyproject.toml

@@ -23,8 +23,24 @@ and providers:
 
 ::: chartlets.components.IconButton
 
+::: chartlets.components.DataGrid
+
+::: chartlets.components.Dialog
+
+::: chartlets.components.Divider
+
+::: chartlets.components.RadioGroup
+
 ::: chartlets.components.Select
 
+::: chartlets.components.Slider
+
+::: chartlets.components.Switch
+
+::: chartlets.components.Table
+
+::: chartlets.components.Tabs
+
 ::: chartlets.components.Typography
 
 ## Base classes