Added LinearProgress which already existed in Python

Author: forman

chartlets.js/CHANGES.md

@@ -37,6 +37,8 @@
   - using `schema` instead of `type` property for callback arguments
   - using `return` object with `schema` property for callback return values
 
+* New components
+  - `LinearProgress`
 
 ## Version 0.0.29 (from 2024/11/26)
 

chartlets.js/packages/lib/src/plugins/mui/LinearProgress.test.tsx

@@ -0,0 +1,19 @@
+import { describe, it, expect } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { LinearProgress } from "./LinearProgress";
+
+describe("LinearProgress", () => {
+  it("should render the LinearProgress component", () => {
+    render(
+      <LinearProgress
+        type="LinearProgress"
+        id="cp"
+        value={75}
+        onChange={() => {}}
+      />,
+    );
+    // to inspect rendered component, do:
+    // expect(document.querySelector("#cp")).toEqual({});
+    expect(screen.getByRole("progressbar")).not.toBeUndefined();
+  });
+});

chartlets.js/packages/lib/src/plugins/mui/LinearProgress.tsx

@@ -0,0 +1,22 @@
+import MuiLinearProgress from "@mui/material/LinearProgress";
+
+import type { ComponentState, ComponentProps } from "@/index";
+
+interface LinearProgressState extends ComponentState {
+  value?: number;
+  valueBuffer?: number;
+  variant?: "determinate" | "indeterminate" | "buffer" | "query";
+}
+
+interface LinearProgressProps extends ComponentProps, LinearProgressState {}
+
+export function LinearProgress({
+  id,
+  style,
+  value,
+  variant,
+}: LinearProgressProps) {
+  return (
+    <MuiLinearProgress id={id} style={style} value={value} variant={variant} />
+  );
+}