import { ExcalidrawTextElement } from "../element/types";
import { AppClassProperties, AppState } from "../types";

export type RenderConfig = {
  // AppState values
  // ---------------------------------------------------------------------------
  scrollX: AppState["scrollX"];
  scrollY: AppState["scrollY"];
  /** null indicates transparent bg */
  viewBackgroundColor: AppState["viewBackgroundColor"] | null;
  zoom: AppState["zoom"];
  shouldCacheIgnoreZoom: AppState["shouldCacheIgnoreZoom"];
  theme: AppState["theme"];
  // collab-related state
  // ---------------------------------------------------------------------------
  remotePointerViewportCoords: { [id: string]: { x: number; y: number } };
  remotePointerButton?: { [id: string]: string | undefined };
  remoteSelectedElementIds: { [elementId: string]: string[] };
  remotePointerUsernames: { [id: string]: string };
  remotePointerUserStates: { [id: string]: string };
  // extra options passed to the renderer
  // ---------------------------------------------------------------------------
  imageCache: AppClassProperties["imageCache"];
  renderScrollbars?: boolean;
  renderSelection?: boolean;
  renderGrid?: boolean;
  /** when exporting the behavior is slightly different (e.g. we can't use
    CSS filters), and we disable render optimizations for best output */
  isExporting: boolean;
  selectionColor?: string;
};

export type SceneScroll = {
  scrollX: number;
  scrollY: number;
};

export interface Scene {
  elements: ExcalidrawTextElement[];
}

export type ExportType =
  | "png"
  | "clipboard"
  | "clipboard-svg"
  | "backend"
  | "svg";

export type ScrollBars = {
  horizontal: {
    x: number;
    y: number;
    width: number;
    height: number;
  } | null;
  vertical: {
    x: number;
    y: number;
    width: number;
    height: number;
  } | null;
};