import { GlyphProperties, GlyphWrapper, Font } from "@coconut-xr/glyph";
import { default as React, PropsWithChildren } from "react";
import { ColorRepresentation, Material, Mesh, Plane, PlaneGeometry, Texture, Vector2, Vector3 } from "three";
import { BaseNode } from "../node.js";
import { Vector1 } from "../vector.js";
import { ContainerProperties, ContainerState } from "./container.js";
import { YogaProperties } from "@coconut-xr/flex";
import { Constructor } from "@coconut-xr/xmaterials";
export type TextState = {
    opacity: Vector1;
    color: Vector3;
    contentOffset: Vector2;
} & ContainerState;
export declare class TextNode extends BaseNode<TextState> {
    target: Readonly<TextState>;
    private mesh;
    private material;
    private structureBuilder;
    glyphProperties: GlyphProperties | undefined;
    text: string | undefined;
    protected hasFocus: boolean;
    private globalContentScale;
    private globalOuterScale;
    private hasStructuralChanges;
    private hasTransformationChanges;
    private backgroundMaterial?;
    protected backgroundMesh: Mesh<PlaneGeometry, Material | Material[]>;
    private caretMaterial;
    private caretMesh;
    private selectionMaterial;
    private selectionMeshCache;
    private _selection?;
    get selection(): [number, number] | null;
    get caretPosition(): number | null;
    setBackgroundMaterialClass(constructor: Constructor<Material>): void;
    applyClippingPlanes(planes: Plane[] | null): void;
    linkCurrent(current: TextState): void;
    onInit(): void;
    updateGlyphProperties(text: string, properties: GlyphProperties, hasStructuralChanges: boolean): void;
    private updateGlyphs;
    onLayout(): void;
    onUpdate(current: TextState): void;
    onCleanup(): void;
    private updateCaretTransformation;
    setSelection(selection: [number, number] | null): void;
    private updateSelectionTransformation;
    private getXStartOfNextGlyph;
    private getGlyphWidth;
    private getSelectionMeshes;
    private clearSelectionMesh;
}
export type InvertOptional<S> = {
    [Key in keyof S as undefined extends S[Key] ? Key : never]-?: S[Key] extends infer K | undefined ? K : never;
};
export declare const textDefaults: Omit<InvertOptional<TextProperties & {
    children: string | undefined;
}>, "fontFamily" | keyof ContainerProperties>;
export type GlyphWrapperProperty = GlyphWrapper | "breakall" | "nowrap" | "breakword";
export type TextProperties = {
    color?: ColorRepresentation;
    opacity?: number;
    fontFamily?: string;
    wrapper?: GlyphWrapperProperty;
} & Partial<Omit<GlyphProperties, "wrapper" | "font" | "availableWidth" | "availableHeight">> & ContainerProperties;
export declare function resolveGlyphWrapper(property: GlyphWrapperProperty): GlyphWrapper<readonly any[]> | GlyphWrapper<readonly ["availableWidth"]>;
/**
 * maps font family name to [baseUrl, fileName]
 */
export type FontFamilies = {
    [Name in string]: [string, string];
};
export type FontFamilyContext = {
    fontFamilies: FontFamilies;
    defaultFontFamily: string;
};
export declare function FontFamilyProvider<F extends FontFamilies>({ fontFamilies, defaultFontFamily, children, }: PropsWithChildren<{
    fontFamilies: F;
    defaultFontFamily: keyof F & string;
}>): React.JSX.Element;
/**
 * @param fontFamily if undefined maps to defaultFontFamily
 */
export declare function useFont(fontFamily?: string): Font<Texture>;
export declare function useText(node: TextNode, { color, opacity, fontFamily, letterSpacing, lineHeightMultiplier, fontSize, wrapper, horizontalAlign, verticalAlign, material, ...props }: TextProperties & YogaProperties, children: string | Array<string> | undefined): undefined;
export declare const Text: React.ForwardRefExoticComponent<Omit<{
    color?: ColorRepresentation | undefined;
    opacity?: number | undefined;
    fontFamily?: string | undefined;
    wrapper?: GlyphWrapperProperty | undefined;
} & Partial<Omit<GlyphProperties, "availableWidth" | "wrapper" | "font" | "availableHeight">> & YogaProperties & {
    animation?: import("../node.js").AnimationConfig | undefined;
    backgroundColor?: ColorRepresentation | undefined;
    backgroundOpacity?: number | undefined;
    borderBend?: number | undefined;
    borderColor?: ColorRepresentation | undefined;
    borderOpacity?: number | undefined;
    borderRadiusTopLeft?: number | undefined;
    borderRadiusTopRight?: number | undefined;
    borderRadiusBottomRight?: number | undefined;
    borderRadiusBottomLeft?: number | undefined;
    translateX?: number | undefined;
    translateY?: number | undefined;
    translateZ?: number | undefined;
    scaleX?: number | undefined;
    scaleY?: number | undefined;
    scaleZ?: number | undefined;
    material?: Constructor<Material> | undefined;
} & Omit<import("../scroll-handler.js").ExtendedEventHandlers, "onPointerMissed"> & {
    inset?: number | `${number}%` | undefined;
    borderRadius?: number | undefined;
    borderRadiusLeft?: number | undefined;
    borderRadiusRight?: number | undefined;
    borderRadiusTop?: number | undefined;
    borderRadiusBottom?: number | undefined;
    border?: number | undefined;
    borderX?: number | undefined;
    borderY?: number | undefined;
    padding?: number | `${number}%` | undefined;
    paddingX?: number | `${number}%` | undefined;
    paddingY?: number | `${number}%` | undefined;
    margin?: number | `${number}%` | "auto" | undefined;
    marginX?: number | `${number}%` | "auto" | undefined;
    marginY?: number | `${number}%` | "auto" | undefined;
} & {} & {
    index?: number | undefined;
    id?: string | undefined;
    children?: string | string[] | undefined;
    classes?: Partial<{
        color?: ColorRepresentation | undefined;
        opacity?: number | undefined;
        fontFamily?: string | undefined;
        wrapper?: GlyphWrapperProperty | undefined;
    } & Partial<Omit<GlyphProperties, "availableWidth" | "wrapper" | "font" | "availableHeight">> & YogaProperties & {
        animation?: import("../node.js").AnimationConfig | undefined;
        backgroundColor?: ColorRepresentation | undefined;
        backgroundOpacity?: number | undefined;
        borderBend?: number | undefined;
        borderColor?: ColorRepresentation | undefined;
        borderOpacity?: number | undefined;
        borderRadiusTopLeft?: number | undefined;
        borderRadiusTopRight?: number | undefined;
        borderRadiusBottomRight?: number | undefined;
        borderRadiusBottomLeft?: number | undefined;
        translateX?: number | undefined;
        translateY?: number | undefined;
        translateZ?: number | undefined;
        scaleX?: number | undefined;
        scaleY?: number | undefined;
        scaleZ?: number | undefined;
        material?: Constructor<Material> | undefined;
    } & Omit<import("../scroll-handler.js").ExtendedEventHandlers, "onPointerMissed"> & {
        inset?: number | `${number}%` | undefined;
        borderRadius?: number | undefined;
        borderRadiusLeft?: number | undefined;
        borderRadiusRight?: number | undefined;
        borderRadiusTop?: number | undefined;
        borderRadiusBottom?: number | undefined;
        border?: number | undefined;
        borderX?: number | undefined;
        borderY?: number | undefined;
        padding?: number | `${number}%` | undefined;
        paddingX?: number | `${number}%` | undefined;
        paddingY?: number | `${number}%` | undefined;
        margin?: number | `${number}%` | "auto" | undefined;
        marginX?: number | `${number}%` | "auto" | undefined;
        marginY?: number | `${number}%` | "auto" | undefined;
    } & {}>[] | undefined;
    ref?: React.MutableRefObject<TextNode | undefined> | undefined;
}, "ref"> & React.RefAttributes<TextNode | undefined>>;
export declare const RootText: React.ForwardRefExoticComponent<Omit<{
    color?: ColorRepresentation | undefined;
    opacity?: number | undefined;
    fontFamily?: string | undefined;
    wrapper?: GlyphWrapperProperty | undefined;
} & Partial<Omit<GlyphProperties, "availableWidth" | "wrapper" | "font" | "availableHeight">> & YogaProperties & {
    animation?: import("../node.js").AnimationConfig | undefined;
    backgroundColor?: ColorRepresentation | undefined;
    backgroundOpacity?: number | undefined;
    borderBend?: number | undefined;
    borderColor?: ColorRepresentation | undefined;
    borderOpacity?: number | undefined;
    borderRadiusTopLeft?: number | undefined;
    borderRadiusTopRight?: number | undefined;
    borderRadiusBottomRight?: number | undefined;
    borderRadiusBottomLeft?: number | undefined;
    translateX?: number | undefined;
    translateY?: number | undefined;
    translateZ?: number | undefined;
    scaleX?: number | undefined;
    scaleY?: number | undefined;
    scaleZ?: number | undefined;
    material?: Constructor<Material> | undefined;
} & Omit<import("../scroll-handler.js").ExtendedEventHandlers, "onPointerMissed"> & {
    inset?: number | `${number}%` | undefined;
    borderRadius?: number | undefined;
    borderRadiusLeft?: number | undefined;
    borderRadiusRight?: number | undefined;
    borderRadiusTop?: number | undefined;
    borderRadiusBottom?: number | undefined;
    border?: number | undefined;
    borderX?: number | undefined;
    borderY?: number | undefined;
    padding?: number | `${number}%` | undefined;
    paddingX?: number | `${number}%` | undefined;
    paddingY?: number | `${number}%` | undefined;
    margin?: number | `${number}%` | "auto" | undefined;
    marginX?: number | `${number}%` | "auto" | undefined;
    marginY?: number | `${number}%` | "auto" | undefined;
} & {}, "height" | "width"> & {
    precision?: number | undefined;
    id?: string | undefined;
    children?: string | string[] | undefined;
    classes?: Partial<{
        color?: ColorRepresentation | undefined;
        opacity?: number | undefined;
        fontFamily?: string | undefined;
        wrapper?: GlyphWrapperProperty | undefined;
    } & Partial<Omit<GlyphProperties, "availableWidth" | "wrapper" | "font" | "availableHeight">> & YogaProperties & {
        animation?: import("../node.js").AnimationConfig | undefined;
        backgroundColor?: ColorRepresentation | undefined;
        backgroundOpacity?: number | undefined;
        borderBend?: number | undefined;
        borderColor?: ColorRepresentation | undefined;
        borderOpacity?: number | undefined;
        borderRadiusTopLeft?: number | undefined;
        borderRadiusTopRight?: number | undefined;
        borderRadiusBottomRight?: number | undefined;
        borderRadiusBottomLeft?: number | undefined;
        translateX?: number | undefined;
        translateY?: number | undefined;
        translateZ?: number | undefined;
        scaleX?: number | undefined;
        scaleY?: number | undefined;
        scaleZ?: number | undefined;
        material?: Constructor<Material> | undefined;
    } & Omit<import("../scroll-handler.js").ExtendedEventHandlers, "onPointerMissed"> & {
        inset?: number | `${number}%` | undefined;
        borderRadius?: number | undefined;
        borderRadiusLeft?: number | undefined;
        borderRadiusRight?: number | undefined;
        borderRadiusTop?: number | undefined;
        borderRadiusBottom?: number | undefined;
        border?: number | undefined;
        borderX?: number | undefined;
        borderY?: number | undefined;
        padding?: number | `${number}%` | undefined;
        paddingX?: number | `${number}%` | undefined;
        paddingY?: number | `${number}%` | undefined;
        margin?: number | `${number}%` | "auto" | undefined;
        marginX?: number | `${number}%` | "auto" | undefined;
        marginY?: number | `${number}%` | "auto" | undefined;
    } & {}>[] | undefined;
    loadYoga?: (() => Promise<import("yoga-wasm-web").Yoga>) | undefined;
    anchorX?: "center" | "left" | "right" | undefined;
    anchorY?: "center" | "top" | "bottom" | undefined;
    sizeX?: number | undefined;
    sizeY?: number | undefined;
    pixelSize?: number | undefined;
    position?: import("@react-three/fiber").Vector3 | undefined;
    rotation?: import("@react-three/fiber").Euler | undefined;
    dragThreshold?: number | undefined;
} & React.RefAttributes<TextNode | undefined>>;