import React from 'react';

declare enum ActionType {
    Web = "web",
    Custom = "custom",
    UIKit = "uikit",
    Internal = "internal"
}
interface Action {
    type: ActionType;
    data: string;
    alterData?: string;
    internalData?: {
        method: string;
        payload?: {
            message?: string;
        };
    };
}

declare enum Layout {
    Row = "row",
    Column = "column"
}
declare enum AlignValue {
    Center = "center",
    Left = "left",
    Right = "right",
    Top = "top",
    Bottom = "bottom"
}
/**
 * @description
 * Caution: Numbers are passed as string types in the message template builder.
 * Use `==` comparison instead of `===` comparison when using a regular enum instead of a string enum.
 */
declare enum FlexSizeSpecValue {
    FillParent = 0,
    WrapContent = 1
}
declare enum FontWeight {
    Normal = "normal",
    Bold = "bold"
}
declare enum MediaContentMode {
    AspectFit = "aspectFit",
    AspectFill = "aspectFill",
    ScalesToFill = "scalesToFill"
}
type SizeSpec = {
    type: 'fixed';
    value: number;
} | {
    type: 'flex';
    value: FlexSizeSpecValue;
};
interface Margin {
    top: number;
    bottom: number;
    left: number;
    right: number;
}
interface Padding {
    top: number;
    bottom: number;
    left: number;
    right: number;
}
interface Align {
    horizontal: AlignValue.Left | AlignValue.Center | AlignValue.Right;
    vertical: AlignValue.Top | AlignValue.Center | AlignValue.Bottom;
}
interface ViewStyle {
    backgroundColor?: string;
    backgroundImageUrl?: string;
    borderWidth?: number;
    borderColor?: string;
    radius?: number;
    margin?: Margin;
    padding?: Padding;
}
interface TextStyle {
    size?: number;
    color?: string;
    weight?: FontWeight | number;
}
interface ImageStyle {
    contentMode?: MediaContentMode;
    tintColor?: string;
}
interface ImageMetaData {
    pixelWidth: number;
    pixelHeight: number;
}
interface CarouselStyle {
    spacing?: number;
    maxChildWidth?: number;
}
interface CascadeStyle {
    spacing?: number;
}

interface Template {
    version: number;
    body: {
        items: ComponentsUnion['properties'][];
    };
}

type BasicProps<T, ParsedProperties> = React.PropsWithChildren<T & {
    key: number;
    parsedProperties?: ParsedProperties;
    parentLayout?: Layout;
    siblings: Array<ComponentsUnion['properties']>;
    rawProperties: ComponentsUnion['properties'];
}>;
type GetProperties<Type extends ComponentType, U extends ComponentsUnion> = U extends {
    type: Type;
    properties: infer P;
} ? P : never;
type ComponentsUnion = {
    type: ComponentType.Box;
    properties: Box;
} | {
    type: ComponentType.Text;
    properties: Text;
} | {
    type: ComponentType.Image;
    properties: Image;
} | {
    type: ComponentType.TextButton;
    properties: TextButton;
} | {
    type: ComponentType.ImageButton;
    properties: ImageButton;
} | {
    type: ComponentType.Carousel;
    properties: Carousel;
} | {
    type: ComponentType.Cascade;
    properties: Cascade;
};
declare enum ComponentType {
    Box = "box",
    Text = "text",
    Image = "image",
    TextButton = "textButton",
    ImageButton = "imageButton",
    Carousel = "carouselView",
    Cascade = "cascadeView"
}
interface View {
    /**
     * this id will be generated by setTemplateItemId
     * to save each elements' size updated by SizeProvider,
     * and used only for internal purpose
     * @link https://github.com/sendbird/sendbird-uikit-core-ts/pull/29#discussion_r1175482926
     */
    id?: string;
    type: ComponentType;
    action?: Action;
    width?: SizeSpec;
    height?: SizeSpec;
    viewStyle?: ViewStyle;
    elementId?: string;
}
interface Box extends View {
    type: ComponentType.Box;
    layout?: Layout;
    align?: Align;
    items?: ComponentsUnion['properties'][];
}
interface Text extends View {
    type: ComponentType.Text;
    text: string;
    maxTextLines?: number;
    align?: Align;
    textStyle?: TextStyle;
}
interface Image extends View {
    type: ComponentType.Image;
    imageUrl: string;
    imageStyle?: ImageStyle;
    metaData?: ImageMetaData;
}
interface TextButton extends View {
    type: ComponentType.TextButton;
    text: string;
    maxTextLines?: number;
    textStyle?: TextStyle;
}
interface ImageButton extends View {
    type: ComponentType.ImageButton;
    imageUrl: string;
    imageStyle?: ImageStyle;
    metaData?: ImageMetaData;
}
interface Carousel extends View {
    type: ComponentType.Carousel;
    items: Template[];
    carouselStyle?: CarouselStyle;
}
interface Cascade extends View {
    type: ComponentType.Cascade;
    items: Template[];
    cascadeStyle?: CascadeStyle;
}

type ParserMapOptions = {
    parentLayout: Layout;
    depth?: number;
    elemIdx?: number;
    siblings?: Array<ComponentsUnion['properties']>;
};
/**
 * ParserTransform is a function that is called before parsing the component properties.
 * It performs preprocessing on specific component properties and then returns them.
 *
 * Caution: The returned property must always be a new immutable object.
 * Failing to adhere to this rule can affect the original property object, potentially leading to bugs.
 * For example, a transform that reverses a specific string must guarantee consistent results even if executed N times.
 * */
type ParserTransform = {
    run: <T extends ComponentsUnion['properties'] = ComponentsUnion['properties']>(properties: T) => T;
};
interface CreateParserParams<ParsedProperties> {
    defaultMapper?(...args: any[]): any;
    mapBoxProps?(properties: Box, options: ParserMapOptions): ParsedProperties;
    mapTextProps?(properties: Text, options: ParserMapOptions): ParsedProperties;
    mapImageProps?(properties: Image, options: ParserMapOptions): ParsedProperties;
    mapTextButtonProps?(properties: TextButton, options: ParserMapOptions): ParsedProperties;
    mapImageButtonProps?(properties: ImageButton, options: ParserMapOptions): ParsedProperties;
    mapCarouselProps?(properties: Carousel, options: ParserMapOptions): ParsedProperties;
    mapCascadeProps?(properties: Cascade, options: ParserMapOptions): ParsedProperties;
    transforms?: ParserTransform[];
}
interface Parser<ParsedProperties> {
    parse<T extends ComponentsUnion['properties'] = ComponentsUnion['properties']>(properties: T, options: ParserMapOptions): {
        transformed: T;
        properties: ParsedProperties | undefined;
    };
    setTransforms(transforms: ParserTransform[]): void;
    addTransforms(transforms: ParserTransform[]): void;
}
declare const createParser: <ParsedProperties = string | object>(params?: CreateParserParams<ParsedProperties> | undefined) => Parser<ParsedProperties>;
interface ByAppearance<T> {
    light: T;
    dark: T;
}
interface DefaultStyle {
    _: undefined;
}
declare const DEFAULT_PARSER_VALUES: ByAppearance<DefaultStyle>;

type FuncComponent<Props, ParsedStyle> = (props: BasicProps<Props, ParsedStyle>) => React.ReactElement | null;
type ComponentProperties<Type extends ComponentType> = GetProperties<Type, ComponentsUnion>;
interface CreateRendererParams<ParsedStyle> {
    views?: {
        [component in ComponentType]?: FuncComponent<ComponentProperties<component>, ParsedStyle>;
    };
}
type Renderer<ParsedStyle> = {
    [component in ComponentType]: FuncComponent<ComponentProperties<component>, ParsedStyle>;
};
declare function createRenderer<ParsedStyle = object | string>(params?: CreateRendererParams<ParsedStyle>): Renderer<ParsedStyle>;

interface ContainerProps extends React.PropsWithChildren<unknown> {
    className?: string;
}
interface MessageTemplateOptions<ParsedProperties> {
    parser?: Parser<ParsedProperties>;
    renderer?: Renderer<ParsedProperties>;
    Container?: (props: ContainerProps) => React.ReactElement;
    UnknownMessage?: (props: {
        item: ComponentsUnion['properties'];
    }) => React.ReactElement | null;
}
interface MessageTemplateProps {
    /**
     * @description template items. ** IT IS NOT TRANSFORMED YET IN HERE **.
     * */
    templateItems: Template['body']['items'];
    templateVersion?: Template['version'];
    parentLayout?: Layout;
    depth?: number;
    isRoot?: boolean;
}
declare const createMessageTemplate: <T>(opts: MessageTemplateOptions<T>) => {
    MessageTemplate: ({ templateVersion, templateItems, parentLayout, }: MessageTemplateProps) => React.JSX.Element;
    MessageTemplateBase: ({ templateItems, templateVersion, parentLayout, depth, }: MessageTemplateProps) => React.JSX.Element;
};

declare const defaultProperties: {
    rootLayout: Layout;
    view: {
        size: {
            width: SizeSpec;
            height: SizeSpec;
        };
    };
    box: {
        layout: Layout;
        align: Align;
    };
    textButton: {
        maxTextLines: number;
    };
    carousel: {
        style: {
            spacing: number;
            maxChildWidth: number;
        };
    };
    cascade: {
        layout: Layout;
        style: {
            spacing: number;
        };
    };
};

declare const colorTransform: ParserTransform;

declare const numberTransform: ParserTransform;

declare const SUPPORTED_TEMPLATE_VERSIONS: number[];
declare const alignInFlex: (align: AlignValue) => "flex-end" | "center" | "flex-start";
declare const isTemplateVersionSupported: (templateVersion?: number | string) => boolean;

/**
 * Generate each item's id by each item's array depth
 */
declare const setTemplateItemId: {
    (this: any, val: (Box | Text | Image | TextButton | ImageButton | Carousel | Cascade)[]): any;
    cache: Map<any, any>;
};

declare const samples_for_size_spec: {
    version: number;
    body: {
        items: {
            elementId: string;
            type: string;
            layout: string;
            width: {
                type: string;
                value: number;
            };
            height: {
                type: string;
                value: number;
            };
            items: {
                type: string;
                layout: string;
                align: {
                    horizontal: string;
                    vertical: string;
                };
                width: {
                    type: string;
                    value: number;
                };
                height: {
                    type: string;
                    value: number;
                };
                items: {
                    type: string;
                    viewStyle: {
                        backgroundColor: string;
                        padding: {
                            top: number;
                            bottom: number;
                            left: number;
                            right: number;
                        };
                    };
                    text: string;
                    textStyle: {
                        size: number;
                        color: string;
                        weight: string;
                    };
                    maxTextLines: number;
                    width: {
                        type: string;
                        value: number;
                    };
                    height: {
                        type: string;
                        value: number;
                    };
                    align: {
                        horizontal: string;
                        vertical: string;
                    };
                    elementId: string;
                }[];
                elementId: string;
            }[];
        }[];
    };
}[];
declare const samples_for_margin_issue: {
    version: number;
    body: {
        items: {
            elementId: string;
            type: string;
            layout: string;
            width: {
                type: string;
                value: FlexSizeSpecValue;
            };
            height: {
                type: string;
                value: FlexSizeSpecValue;
            };
            items: ({
                type: string;
                viewStyle: {
                    backgroundColor: string;
                    margin: {
                        top: number;
                        bottom: number;
                        left: number;
                        right: number;
                    };
                    padding: {
                        top: number;
                        bottom: number;
                        left: number;
                        right: number;
                    };
                };
                text: string;
                textStyle: {
                    size: number;
                    color: string;
                    weight: string;
                };
                maxTextLines: number;
                width: {
                    type: string;
                    value: FlexSizeSpecValue;
                };
                height: {
                    type: string;
                    value: number;
                };
                align: {
                    horizontal: string;
                    vertical: string;
                };
                elementId: string;
                imageUrl?: undefined;
                imageStyle?: undefined;
                metaData?: undefined;
                action?: undefined;
            } | {
                type: string;
                viewStyle: {
                    margin: {
                        left: number;
                        right: number;
                        top?: undefined;
                        bottom?: undefined;
                    };
                    backgroundColor?: undefined;
                    padding?: undefined;
                };
                width: {
                    type: string;
                    value: FlexSizeSpecValue;
                };
                height: {
                    type: string;
                    value: number;
                };
                imageUrl: string;
                imageStyle: {
                    contentMode: string;
                };
                metaData: {
                    pixelWidth: string;
                    pixelHeight: string;
                };
                action: {
                    data: string;
                };
                text?: undefined;
                textStyle?: undefined;
                maxTextLines?: undefined;
                align?: undefined;
                elementId?: undefined;
            })[];
        }[];
    };
}[];
declare const samples: any[];

type Size = {
    width: number;
    height: number;
    contentWidth: number;
    contentHeight: number;
    paddingWidth: number;
    paddingHeight: number;
};
type Sizes = Record<string, Size>;
type UpdateParams = {
    id?: string;
} & Size;
interface SizeContextInterface {
    sizes: Sizes;
    updateSize: ({ id, width, height }: UpdateParams) => void;
}
declare const SizeContextProvider: ({ children }: React.PropsWithChildren<unknown>) => React.JSX.Element;
declare const useSizeContext: () => SizeContextInterface;

export { type Action, ActionType, type Align, AlignValue, type BasicProps, type Box, type Carousel, type CarouselStyle, type Cascade, type CascadeStyle, ComponentType, type ComponentsUnion, DEFAULT_PARSER_VALUES, FlexSizeSpecValue, FontWeight, type GetProperties, type Image, type ImageButton, type ImageMetaData, type ImageStyle, Layout, type Margin, MediaContentMode, type MessageTemplateProps, type Padding, type Parser, type ParserMapOptions, type ParserTransform, type Renderer, SUPPORTED_TEMPLATE_VERSIONS, SizeContextProvider, type SizeSpec, type Template, type Text, type TextButton, type TextStyle, type View, type ViewStyle, alignInFlex, colorTransform, createMessageTemplate, createParser, createRenderer, defaultProperties, isTemplateVersionSupported, numberTransform, samples, samples_for_margin_issue, samples_for_size_spec, setTemplateItemId, useSizeContext };