import React, { ComponentType } from "react";
import { Transform } from "sucrase";

export type CodeBlock = {
  code: string;
  cpnName: string;
  props: Record<string, unknown>;
};

export type UpdateThemeColor = {
  /**
   * @description 主题类名
   */
  themeClass: string;
  /**
   * @description 颜色变量
   */
  colorVariable: string;
  /**
   * @description 新颜色
   */
  newColor: string;
};

export type NumStringWithBlank = ` ${number}` | `${number}` | `${number} `;

export type RGBString =
  `rgb(${NumStringWithBlank},${NumStringWithBlank},${NumStringWithBlank})`;

export type RGBValue = {
  r: number;
  g: number;
  b: number;
};

export type ThemeVariables = {
  [key: string]: string;
};

export type ColorSchema = {
  onLight: Record<string, string>;
  onDark?: Record<string, string>;
};

export type ThemeSection = "dark" | "light" | "system";

export type ReverseHandlerType = "reverse" | "none" | "lighten" | "darken";

export type ReverseHandlerConfig = Record<string, ReverseHandlerType>;

export type ThemeMode = "dark" | "light";

export type ThemeBlockCache = {
  id: string;
  obj: Record<string, string>;
};

export type ChangeType = "update" | "remove" | "add";

export type Change = {
  key: string;
  type: ChangeType;
};

export type ImportInfo = {
  identifier: string;
  path: string;
};

export type ReactComponentInfo = {
  element: ComponentType;
  importMap: ImportInfo[];
};

export type TransformerProps = {
  code: string;
  functonProps: {
    React: typeof React;
    props: Record<string, any>;
    [key: string]: any;
  };
  transforms?: Transform[];
};

export type ReslovedDependency = {
  identifier: string;
  code?: string;
};

export type DependencyGetter = (info: ImportInfo) => ReslovedDependency | Promise<ReslovedDependency>;

export type TransformCodeProdProps = {
  code: string;
  /**
   * 组件名（标识符） to 组件code
   */
  dependencies: DependencyGetter;
  transforms?: Transform[];
  excludeImports?: string[];
};