// declare namespace React {
//   interface Attributes {
//     css?: string
//   }
// }

interface RecursiveStringObject {
  [modifier: string]: string | RecursiveStringObject;
}

type CSSAttributeValue = string | (string | RecursiveStringObject)[];

export type SupportedTag =
  | "a"
  | "abbr"
  | "article"
  | "blockquote"
  | "button"
  | "cite"
  | "code"
  | "details"
  | "div"
  | "figure"
  | "footer"
  | "h1"
  | "h2"
  | "h3"
  | "h4"
  | "hr"
  | "iframe"
  | "img"
  | "input"
  | "ins"
  | "label"
  | "li"
  | "main"
  | "nav"
  | "ol"
  | "output"
  | "p"
  | "pre"
  | "rt"
  | "ruby"
  | "section"
  | "select"
  | "span"
  | "strong"
  | "sub"
  | "summary"
  | "sup"
  | "table"
  | "tbody"
  | "td"
  | "thead"
  | "tr"
  | "ul"
  | "var"
  | "video";

type Modifier =
  | "2xl"
  | "active"
  | "after"
  | "backdrop"
  | "before"
  | "contrastMore"
  | "dark"
  | "default"
  | "disabled"
  | "even"
  | "file"
  | "first"
  | "firstLetter"
  | "firstLine"
  | "firstOfType"
  | "focus"
  | "focusVisible"
  | "focusWithin"
  | "forcedColors"
  | "hover"
  | "indeterminate"
  | "invalid"
  | "last"
  | "lastOfType"
  | "ltr"
  | "marker"
  | "max2xl"
  | "maxLg"
  | "maxMd"
  | "maxSm"
  | "maxXl"
  | "md"
  | "motionReduce"
  | "motionSafe"
  | "odd"
  | "only"
  | "open"
  | "placeholder"
  | "prefersContrast"
  | "print"
  | "readOnly"
  | "required"
  | "rtl"
  | "selection"
  | "sm"
  | "target"
  | "visited"
  | "xl";

/**
 * Tagged template macro function combining Tailwind classes
 * @example "tw" => tw`p-2 text-center`
 */
export type TailwindFunction = {
  (strings: TemplateStringsArray): string;
  (...args: (string | RecursiveStringObject)[]): string;
} & {
  [key in Modifier]: TailwindFunction;
} & {
  [tag in SupportedTag]: (
    strings: TemplateStringsArray
  ) => React.FunctionComponent<React.JSX.IntrinsicElements[tag]>;
};

/**
 * Tagged template macro function compiling Tailwind styles
 * @example "tws" => tws`p-2 text-center` // { padding: 2, textAlign: "center" }
 */
export type TailwindStyleFunction = {
  (strings: TemplateStringsArray): TailwindStyleFunctionReturn;
  (...args: (string | RecursiveStringObject)[]): TailwindStyleFunctionReturn;
} & {
  [key in Modifier]: TailwindStyleFunction;
};

export const tw: TailwindFunction;
export const tws: TailwindStyleFunction;

type TailwindStyleFunctionReturn = Config extends { tws: infer T } ? T : never;

/**
 * Type configuration for the Tailwind style macro
 * @example
 *
 * ```ts
 * declare module "_tailwind_lib/macro" {
 *   interface Config {
 *     tws: React.CSSProperties;
 *   }
 * }
 * ```
 */
// eslint-disable-next-line @typescript-eslint/no-empty-interface, @typescript-eslint/no-empty-object-type
export interface Config {}