solid-recharts 0.2.0 → 1.0.0

package/test/animation/mockTimeoutController.ts

@@ -1,114 +0,0 @@
-// Ported from recharts 3.8.1 test/animation/mockTimeoutController.ts (commit 7a23854).
-// Adapted to remove the @testing-library/react `act` dependency — in this
-// repo there is no React; the callbacks contain no Solid reactive primitives
-// so a direct synchronous call is equivalent.
-
-import {
-  CallbackType,
-  CancelableTimeout,
-  TimeoutController,
-} from "../../src/animation/timeoutController";
-
-/**
- * Mock implementation of TimeoutController for testing purposes.
- * This does not use requestAnimationFrame and allows for manual control of timeouts.
- */
-type MockTimeoutControllerConfig = {
-  /**
-   * The mock controller will never allow more than this number of timeouts at once.
-   */
-  timeoutLimit?: number;
-};
-
-export class MockTimeoutController implements TimeoutController {
-  private timeouts: Array<{ callback: CallbackType; delay: number | undefined }> = [];
-
-  private cancelledFramesCount = 0;
-
-  private readonly config: MockTimeoutControllerConfig;
-
-  constructor(config: MockTimeoutControllerConfig = {}) {
-    this.config = config;
-  }
-
-  setTimeout(callback: CallbackType, delay?: number): CancelableTimeout {
-    /*
-     * We store a COPY of the callback instead of the callback itself, so that consumers
-     * which track cancellations by identity (like the real
-     * RequestAnimationFrameTimeoutController, which tracks requestIds) are exercised
-     * correctly rather than passing by accident.
-     */
-    const copy: CallbackType = (now: number) => callback(now);
-    if (this.config.timeoutLimit != null && this.timeouts.length >= this.config.timeoutLimit) {
-      throw new Error(
-        `Timeout queue has size ${this.timeouts.length} which is more than the allowed ${this.config.timeoutLimit}`,
-      );
-    }
-
-    this.timeouts.push({ callback: copy, delay });
-
-    // Return a cancelable timeout function
-    return () => {
-      this.removeTimeout(copy);
-      this.cancelledFramesCount++;
-    };
-  }
-
-  /**
-   * Manually triggers the next timeout callback, as defined by the registration order,
-   * not the order of the delay.
-   * This (poorly) simulates the passage of time without using requestAnimationFrame.
-   * If there are no timeouts registered, it throws an error.
-   * If there are multiple timeouts, it triggers the first one in the queue.
-   * @param now - The current time in milliseconds.
-   * @returns undefined
-   */
-  async triggerNextTimeout(now: number): Promise<void> {
-    const next = this.timeouts.shift();
-
-    if (next == null) {
-      return;
-    }
-
-    const { callback } = next;
-    await Promise.resolve(); // Simulate async behavior
-    // Remove the timeout before executing the callback, because the callback may queue itself again
-    this.removeTimeout(callback);
-    callback(now);
-  }
-
-  /**
-   * Flushes all registered timeouts by triggering them in the order they were registered.
-   * This simulates the passage of time until all timeouts are executed.
-   * @param tickSize - The size of each tick in milliseconds. Defaults to 1000ms.
-   * @returns A promise that resolves when all timeouts have been triggered.
-   */
-  async flushAllTimeouts(tickSize: number = 1000): Promise<void> {
-    let time = 0;
-    while (this.timeouts.length > 0) {
-      // eslint-disable-next-line no-await-in-loop
-      await this.triggerNextTimeout(tickSize * time++);
-    }
-  }
-
-  clear() {
-    this.timeouts = [];
-    this.cancelledFramesCount = 0;
-  }
-
-  private removeTimeout(callback: CallbackType) {
-    this.timeouts = this.timeouts.filter((t) => t.callback !== callback);
-  }
-
-  getCallbacksCount() {
-    return this.timeouts.length;
-  }
-
-  getTimeouts() {
-    return this.timeouts.map((t) => t.delay);
-  }
-
-  getCancelledFramesCount() {
-    return this.cancelledFramesCount;
-  }
-}

package/test/animation/timeoutController.spec.ts

@@ -1,138 +0,0 @@
-import { describe, it, expect, vi, beforeAll, afterAll, MockInstance } from "vitest";
-import { RequestAnimationFrameTimeoutController } from "../../src/animation/timeoutController";
-
-describe("RequestAnimationFrameTimeoutController", () => {
-  beforeAll(() => {
-    vi.useFakeTimers();
-  });
-
-  afterAll(() => {
-    vi.useRealTimers();
-  });
-
-  it("should call requestAnimationFrame with a callback", () => {
-    const rafSpy: MockInstance<Window["requestAnimationFrame"]> = vi.spyOn(
-      window,
-      "requestAnimationFrame",
-    );
-    const controller = new RequestAnimationFrameTimeoutController();
-    const cb = vi.fn();
-
-    controller.setTimeout(cb);
-    expect(cb).not.toHaveBeenCalled();
-    expect(rafSpy).toHaveBeenCalledWith(expect.any(Function));
-
-    // Simulate the passage of time
-    vi.runAllTimers();
-    expect(cb).toHaveBeenCalledTimes(1);
-    expect(rafSpy).toHaveBeenCalledTimes(1);
-  });
-
-  it("should cancel timeout", () => {
-    const rafSpy: MockInstance<Window["requestAnimationFrame"]> = vi.spyOn(
-      window,
-      "requestAnimationFrame",
-    );
-    const cancelSpy: MockInstance<Window["cancelAnimationFrame"]> = vi.spyOn(
-      window,
-      "cancelAnimationFrame",
-    );
-    const controller = new RequestAnimationFrameTimeoutController();
-    const cb = vi.fn();
-
-    const cancellableTimeout = controller.setTimeout(cb);
-    expect(cb).not.toHaveBeenCalled();
-    expect(rafSpy).toHaveBeenCalledWith(expect.any(Function));
-
-    cancellableTimeout();
-
-    // Simulate the passage of time
-    vi.runAllTimers();
-    expect(cb).toHaveBeenCalledTimes(0);
-    expect(rafSpy).toHaveBeenCalledTimes(1);
-    expect(cancelSpy).toHaveBeenCalledTimes(1);
-  });
-
-  it("should allow multiple timeouts to be set", () => {
-    const controller = new RequestAnimationFrameTimeoutController();
-
-    const cb1 = vi.fn();
-    const cb2 = vi.fn();
-
-    controller.setTimeout(cb1);
-    controller.setTimeout(cb2);
-
-    // Simulate the passage of time
-    vi.runAllTimers();
-
-    expect(cb1).toHaveBeenCalledTimes(1);
-    expect(cb2).toHaveBeenCalledTimes(1);
-  });
-
-  it("should allow setting a timeout with a delay", () => {
-    const controller = new RequestAnimationFrameTimeoutController();
-    const cb = vi.fn();
-
-    controller.setTimeout(cb, 1000);
-
-    // Simulate the passage of time
-    vi.advanceTimersByTime(999);
-    expect(cb).not.toHaveBeenCalled();
-
-    vi.advanceTimersByTime(100);
-    expect(cb).toHaveBeenCalledTimes(1);
-  });
-
-  it("should allow settings two callbacks with different delays", () => {
-    const controller = new RequestAnimationFrameTimeoutController();
-    const cb1 = vi.fn();
-    const cb2 = vi.fn();
-
-    controller.setTimeout(cb1, 1000);
-    controller.setTimeout(cb2, 500);
-
-    // Simulate the passage of time
-    vi.advanceTimersByTime(499);
-    expect(cb1).not.toHaveBeenCalled();
-    expect(cb2).not.toHaveBeenCalled();
-
-    vi.advanceTimersByTime(100);
-    expect(cb1).not.toHaveBeenCalled();
-    expect(cb2).toHaveBeenCalledTimes(1);
-
-    vi.advanceTimersByTime(500);
-    expect(cb1).toHaveBeenCalledTimes(1);
-  });
-
-  it("should allow cancelling a timeout before it executes", () => {
-    const controller = new RequestAnimationFrameTimeoutController();
-    const cb = vi.fn();
-
-    const cancellableTimeout = controller.setTimeout(cb, 1000);
-
-    // Cancel the timeout before it executes
-    cancellableTimeout();
-
-    // Simulate the passage of time
-    vi.advanceTimersByTime(2000);
-
-    expect(cb).not.toHaveBeenCalled();
-  });
-
-  it("should allow cancelling a timeout before it executes, but after a bit of delay", () => {
-    const controller = new RequestAnimationFrameTimeoutController();
-    const cb = vi.fn();
-
-    const cancellableTimeout = controller.setTimeout(cb, 1000);
-
-    vi.advanceTimersByTime(100);
-
-    // Cancel the timeout before it executes
-    cancellableTimeout();
-
-    // Simulate the passage of time
-    vi.advanceTimersByTime(2000);
-
-    expect(cb).not.toHaveBeenCalled();
-  });
-});

package/test/animation/useAnimationStartSnapshot.spec.ts

@@ -1,147 +0,0 @@
-// Ported from recharts 3.9.0 test/animation/useAnimationStartSnapshot.spec.ts.
-//
-// Solid adaptation: the hook is reactive — `useAnimationStartSnapshot(inputAccessor, ref)`
-// returns `startValue` as an `Accessor<T>`. React's `rerender({ animationInput })` becomes
-// a signal write + `flush()`; a rerender with the SAME input has no Solid equivalent
-// (signals don't re-fire on identical values), which matches the "frozen for the same
-// cycle" contract — we just read the accessor again. The hook is created inside
-// `createRoot` (the memo needs an owner); signal writes happen outside the owned scope.
-import { describe, expect, it } from "vitest";
-import { createRoot, createSignal, flush } from "solid-js";
-import { useAnimationStartSnapshot } from "../../src/animation/useAnimationStartSnapshot";
-import type { MutableRef } from "../../src/animation/useAnimationStartSnapshot";
-
-function createMutableRef<T>(current: T): MutableRef<T> {
-  return { current };
-}
-
-function setup(initialInput: string, previousValueRef: MutableRef<string>) {
-  const [animationInput, setAnimationInput] = createSignal(initialInput);
-  const { snapshot, dispose } = createRoot((d) => ({
-    snapshot: useAnimationStartSnapshot(animationInput, previousValueRef),
-    dispose: d,
-  }));
-  return { snapshot, setAnimationInput, dispose };
-}
-
-describe("useAnimationStartSnapshot", () => {
-  it("should expose the current ref value as the initial startValue", () => {
-    const previousValueRef = createMutableRef("frame-10");
-
-    const { snapshot, dispose } = setup("animation-a", previousValueRef);
-
-    expect(snapshot.startValue()).toBe("frame-10");
-    dispose();
-  });
-
-  it("should keep startValue frozen for the duration of the same animation cycle", () => {
-    const previousValueRef = createMutableRef("frame-10");
-
-    const { snapshot, dispose } = setup("animation-a", previousValueRef);
-    expect(snapshot.startValue()).toBe("frame-10");
-
-    snapshot.syncStepValue("frame-40", 0.4);
-
-    expect(previousValueRef.current).toBe("frame-40");
-    expect(snapshot.startValue()).toBe("frame-10");
-    dispose();
-  });
-
-  it("should capture the previous ref value as the new startValue when animationInput changes", () => {
-    const previousValueRef = createMutableRef("frame-40");
-
-    const { snapshot, setAnimationInput, dispose } = setup("animation-a", previousValueRef);
-    expect(snapshot.startValue()).toBe("frame-40");
-
-    setAnimationInput("animation-b");
-    flush();
-
-    expect(snapshot.startValue()).toBe("frame-40");
-
-    snapshot.syncStepValue("frame-52", 0.4);
-
-    expect(previousValueRef.current).toBe("frame-40");
-    expect(snapshot.startValue()).toBe("frame-40");
-    dispose();
-  });
-
-  it("should unlock commits at t=0 without mutating the live ref", () => {
-    const previousValueRef = createMutableRef("frame-40");
-
-    const { snapshot, setAnimationInput, dispose } = setup("animation-a", previousValueRef);
-    expect(snapshot.startValue()).toBe("frame-40");
-
-    setAnimationInput("animation-b");
-    flush();
-    expect(snapshot.startValue()).toBe("frame-40");
-
-    snapshot.syncStepValue("frame-40", 0);
-
-    expect(previousValueRef.current).toBe("frame-40");
-
-    snapshot.syncStepValue("frame-41", 0.1);
-
-    expect(previousValueRef.current).toBe("frame-41");
-    dispose();
-  });
-
-  it("should honor canCommit=false even after the new animation has been armed", () => {
-    const previousValueRef = createMutableRef("frame-40");
-
-    const { snapshot, setAnimationInput, dispose } = setup("animation-a", previousValueRef);
-    expect(snapshot.startValue()).toBe("frame-40");
-
-    setAnimationInput("animation-b");
-    flush();
-    expect(snapshot.startValue()).toBe("frame-40");
-
-    snapshot.syncStepValue("frame-40", 0);
-    snapshot.syncStepValue("frame-41", 0.1, false);
-
-    expect(previousValueRef.current).toBe("frame-40");
-
-    snapshot.syncStepValue("frame-42", 0.2, true);
-
-    expect(previousValueRef.current).toBe("frame-42");
-    dispose();
-  });
-
-  it("should use the completed frame as the startValue for the next animation cycle", () => {
-    const previousValueRef = createMutableRef("frame-10");
-
-    const { snapshot, setAnimationInput, dispose } = setup("animation-a", previousValueRef);
-    expect(snapshot.startValue()).toBe("frame-10");
-
-    snapshot.syncStepValue("frame-100", 1);
-
-    expect(previousValueRef.current).toBe("frame-100");
-
-    setAnimationInput("animation-b");
-    flush();
-
-    expect(snapshot.startValue()).toBe("frame-100");
-    dispose();
-  });
-
-  /*
-   * DEVIATION from upstream "should update the frozen snapshot to the completed frame
-   * after t=1 in the same cycle": React refreshes its ref-based snapshot on the render
-   * AFTER t=1 within the SAME cycle; the Solid memo (keyed on animationInput) does not
-   * recompute for an unchanged input. Parity for the observable behavior (settled frame
-   * reports isEntrance=false) is handled centrally in AnimatedItems. Here we pin the
-   * Solid contract: the in-cycle snapshot stays frozen, while the live ref carries the
-   * completed frame forward for the next cycle (previous test).
-   */
-  it("keeps the in-cycle snapshot frozen after t=1 while the ref holds the completed frame", () => {
-    const previousValueRef = createMutableRef("frame-10");
-
-    const { snapshot, dispose } = setup("animation-a", previousValueRef);
-    expect(snapshot.startValue()).toBe("frame-10");
-
-    snapshot.syncStepValue("frame-100", 1);
-
-    expect(previousValueRef.current).toBe("frame-100");
-    expect(snapshot.startValue()).toBe("frame-10");
-    dispose();
-  });
-});

package/test/animation/util.spec.ts

@@ -1,28 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { getDashCase, getTransitionVal } from "../../src/animation/util";
-
-describe("getDashCase", () => {
-  it("should convert camelCase to dash-case", () => {
-    expect(getDashCase("camelCase")).toBe("camel-case");
-    expect(getDashCase("CamelCase")).toBe("-camel-case");
-    expect(getDashCase("already-dash")).toBe("already-dash");
-    expect(getDashCase("")).toBe("");
-    expect(getDashCase("a")).toBe("a");
-    expect(getDashCase("A")).toBe("-a");
-  });
-});
-
-describe("getTransitionVal", () => {
-  it("should return correct transition string for multiple props", () => {
-    expect(getTransitionVal(["opacity", "strokeWidth"], 300, "ease-in")).toBe(
-      "opacity 300ms ease-in,stroke-width 300ms ease-in",
-    );
-  });
-  it("should handle empty props array", () => {
-    expect(getTransitionVal([], 200, "linear")).toBe("");
-  });
-  it("should handle numeric and string duration", () => {
-    expect(getTransitionVal(["foo"], "500", "ease")).toBe("foo 500ms ease");
-    expect(getTransitionVal(["foo"], 500, "ease")).toBe("foo 500ms ease");
-  });
-});