Transform Compare Section

"use client";

import { useEffect, useRef, useState, useSyncExternalStore } from "react";
import type { CSSProperties, KeyboardEvent as ReactKeyboardEvent, PointerEvent as ReactPointerEvent, ReactNode, RefObject } from "react";

/**
 * TransformCompareSection — one source through every transform, split by a wipe you drag.
 *
 * A still life is raymarched once in WebGL2. Left of the wipe it is the
 * source; right of it, the transform you pick: true Atkinson or
 * Floyd–Steinberg error diffusion (on the CPU, over the cell grid), blue
 * noise, Bayer 8x8, a halftone screen or shape-matched ASCII. Changes
 * dissolve through blue noise; cell size keys set the grain; the request
 * line counts the cells. The wipe is a keyboard slider. Pass `image` to
 * compare your own picture.
 *
 * Part of the Dither & ASCII kit: one ink, paper #f3f0e6, on a warm black
 * ground #0b0b0d, with vermillion #ff4f2b as a second ink inside the

  // ---------------------------------------------------------------
  // Full source available with a viberdy Pro subscription.
  // https://viberdy.dev/pricing
  // ---------------------------------------------------------------
}