import type { ScoreOptions, SurfaceOptions } from "./types.ts";
/** The drawing as the object React's `dangerouslySetInnerHTML` takes. */
export declare function kyogijoHtml(options: SurfaceOptions | ScoreOptions): {
    __html: string;
};
/**
 * Props for a `div` (or any element) that holds a drawing, to spread onto it: no component, no dependency on React.
 * With `orientation: "auto"` and no `aspect`, the drawing is wide; use `createKyogijo` for a container that is measured.
 * @example
 * ```ts
 * import { kyogijoProps } from "@johnmorrisdotca/kyogijo-stadiums/react";
 * const props = kyogijoProps({ sport: "nba", away: { name: "Australia", score: 108 }, home: { name: "Japan", score: 112 }, status: "final" });
 * console.log(props["data-kyogijo"], props.dangerouslySetInnerHTML.__html.startsWith("<svg"));
 * // nba true
 * ```
 */
export declare function kyogijoProps(options: SurfaceOptions | ScoreOptions): {
    dangerouslySetInnerHTML: {
        __html: string;
    };
    "data-kyogijo": string;
    "data-orientation": "landscape" | "portrait";
};
/** The part of React the component uses; pass the `React` you have, and nothing here imports it. */
export interface ReactLike {
    createElement(type: string, props: Record<string, unknown> | null, ...children: unknown[]): unknown;
    useRef<T>(initial: T): {
        current: T;
    };
    useState<S>(initial: S): [S, (next: S) => void];
    useEffect(effect: () => void | (() => void), deps?: unknown[]): void;
}
/** The props of the component `createKyogijo` makes: the options, and the usual `className` and `style` of its `div`. */
export type KyogijoProps = (SurfaceOptions | ScoreOptions) & {
    containerClassName?: string;
    containerStyle?: Record<string, unknown>;
    breakpoint?: number;
};
/**
 * A React component made from the `React` you give it. It draws the options, and with `orientation: "auto"` measures its
 * own box and lays the drawing out tall or wide as the box changes.
 * @example
 * ```ts
 * import { createKyogijo } from "@johnmorrisdotca/kyogijo-stadiums/react";
 * // With React: `const Kyogijo = createKyogijo(React);` and then `<Kyogijo sport="nhl" orientation="auto" />`.
 * // Here a stand-in for React, to show what comes out:
 * const Kyogijo = createKyogijo({ createElement: (type, props) => ({ type, props }), useRef: (initial) => ({ current: initial }), useState: (initial) => [initial, () => {}], useEffect: () => {} });
 * const element = Kyogijo({ sport: "nhl" }) as { type: string };
 * console.log(element.type);
 * // div
 * ```
 */
export declare function createKyogijo(React: ReactLike): (props: KyogijoProps) => unknown;