feat: Allow custom SVG path generation with tests

[vinothpandian]

This commit introduces the getSvgPathFromPoints prop to ReactSketchCanvas, allowing you to provide your own function for generating SVG path data from an array of points. This change includes comprehensive unit and Playwright tests.

Key changes:

• Core Component Modifications:

  • Added getSvgPathFromPoints?: (points: Point[]) => string to prop types (SvgPathProps, PathProps, CanvasProps, ReactSketchCanvasProps).
  • Modified SvgPath component to use getSvgPathFromPoints if provided, falling back to the default bezier curve generation otherwise.
  • Propagated getSvgPathFromPoints through Paths, Canvas, and ReactSketchCanvas components.

• Documentation Updates:

  • Updated packages/react-sketch-canvas/README.md with documentation for the new prop, including a usage example.
  • Added getSvgPathFromPoints to the props list in apps/docs/src/content/docs/props/ReactSketchCanvas.mdx.
  • Created a new example page apps/docs/src/content/docs/examples/custom-path-generation.mdx with a live demo (apps/docs/src/examples/CustomPathGeneration.tsx).

• Testing:

  • Added unit tests (packages/tests/src/props/getSvgPathFromPoints.spec.tsx) covering default behavior, custom generator output for lines and single points, and handling of empty point arrays.
  • Added Playwright E2E tests (packages/tests/playwright/customPathGeneration.spec.ts):
    • Modified packages/tests/playwright/index.tsx to include test canvases with different custom path generators (straight line, zigzag line).
    • Tests navigate to these canvases, simulate drawing, and verify the correctness of the rendered SVG path's d attribute.

[Copilot]

Pull Request Overview

Introduces a new getSvgPathFromPoints prop throughout the drawing components to let consumers supply custom SVG path logic, updates docs with examples, and adds both unit and Playwright E2E tests to verify default and custom behaviors.

• Add getSvgPathFromPoints prop to core components and types
• Update documentation and example pages for custom path generation
• Implement unit tests and Playwright tests covering default, straight-line, zigzag, single-point, and empty-array scenarios

Comments suppressed due to low confidence (2)

packages/tests/src/props/getSvgPathFromPoints.spec.tsx:4

• Import Point from the public package API (import { Point } from 'react-sketch-canvas';) instead of internal paths to avoid coupling to implementation details.

import { Point } from "react-sketch-canvas/src/types";

apps/docs/src/content/docs/props/ReactSketchCanvas.mdx:8

• [nitpick] The indentation of this list item is inconsistent with the other props entries; adjust spacing to align markdown list formatting.

-   **`getSvgPathFromPoints`**:

[Copilot]

This comment references the prompt context and is not meaningful in the codebase. Remove it to keep the file clean.

Suggested change

	// This export was removed in the prompt, but it is used in other files.
	// Keeping it to avoid breaking changes.