@eccenca/gui-elements/dist/types/components/Chat/ChatArea.d.ts

GUI elements based on other libraries, usable in React application, written in Typescript.

import React from "react";
import { TestableComponent } from "../../components/interfaces";
import { FlexibleLayoutContainerProps } from "./../FlexibleLayout";
import { SpacingProps } from "./../Separation/Spacing";
import { ChatFieldProps } from "./ChatField";
export interface ChatAreaProps extends Omit<FlexibleLayoutContainerProps, "vertical" | "noEqualItemSpace">, TestableComponent {
    /**
     * The inut field for the chat.
     */
    chatField?: React.ReactElement<ChatFieldProps>;
    /**
     * Set the position of the chat field.
     */
    chatFieldPosition?: "top" | "bottom";
    /**
     * Sets the maximum width for chat contents and input.
     */
    contentWidth?: "small" | "medium" | "large" | "full";
    /**
     * Put chat content in a list and add spacings automatically.
     * Works best if each `ChatArea` child represents one chat content item.
     */
    autoSpacingSize?: SpacingProps["size"];
    /**
     * Scrolls content to the first or last child automatically.
     * The correct value depends on the place where you insert the most recent chat item.
     */
    autoScrollTo?: "first" | "last";
}
/**
 * Component to display a full chat, containing chat content bubbles and text input.
 */
export declare const ChatArea: ({ children, className, chatField, chatFieldPosition, contentWidth, autoSpacingSize, gapSize, autoScrollTo, ...otherFlexibleLayoutContainerProps }: ChatAreaProps) => React.JSX.Element;
export default ChatArea;