function _define_property(obj, key, value) {
    if (key in obj) {
        Object.defineProperty(obj, key, {
            value: value,
            enumerable: true,
            configurable: true,
            writable: true
        });
    } else {
        obj[key] = value;
    }
    return obj;
}
function _object_spread(target) {
    for(var i = 1; i < arguments.length; i++){
        var source = arguments[i] != null ? arguments[i] : {};
        var ownKeys = Object.keys(source);
        if (typeof Object.getOwnPropertySymbols === "function") {
            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
            }));
        }
        ownKeys.forEach(function(key) {
            _define_property(target, key, source[key]);
        });
    }
    return target;
}
import { ConfigProvider } from "antd";
import clsx from "clsx";
import React, { forwardRef, memo, useContext, useEffect, useImperativeHandle, useRef } from "react";
import { LayoutHeader } from "../Components/LayoutHeader";
import useAutoScroll from "../Hooks/useAutoScroll";
import { useElementSize } from "../Hooks/useElementSize";
import FooterBackground from "./components/FooterBackground";
import { useStyle } from "./style";
/**
 * ChatLayout 组件 - 聊天布局组件
 *
 * 该组件提供了一个完整的聊天界面布局，包含头部区域、内容区域和底部区域。
 * 头部区域包含标题、左侧折叠按钮、分享按钮和右侧折叠按钮。
 * 内容区域用于放置对话内容（如 BubbleList）。
 * 底部区域固定在底部，用于放置输入框或AI对话按钮等组件。
 *
 * @component
 * @description 聊天布局组件，提供完整的对话界面布局
 * @param {ChatLayoutProps} props - 组件属性
 *
 * @example
 * ```tsx
 * import { ChatLayout } from './ChatLayout';
 *
 * // 基本用法
 * <ChatLayout
 *   header={{
 *     title: "AI 助手",
 *     onLeftCollapse: () => console.log('左侧折叠'),
 *     onRightCollapse: () => console.log('右侧折叠'),
 *     onShare: () => console.log('分享')
 *   }}
 * >
 *   <div>对话内容</div>
 * </ChatLayout>
 *
 * // 受控模式 - 折叠状态
 * <ChatLayout
 *   header={{
 *     title: "AI 助手",
 *     leftCollapsed: leftCollapsed,
 *     rightCollapsed: rightCollapsed,
 *     onLeftCollapse: setLeftCollapsed,
 *     onRightCollapse: setRightCollapsed
 *   }}
 * >
 *   <div>对话内容</div>
 * </ChatLayout>
 *
 * // 非受控模式 - 默认折叠状态
 * <ChatLayout
 *   header={{
 *     title: "AI 助手",
 *     leftDefaultCollapsed: true,
 *     rightDefaultCollapsed: false,
 *     onLeftCollapse: (collapsed) => console.log('左侧折叠状态:', collapsed),
 *     onRightCollapse: (collapsed) => console.log('右侧折叠状态:', collapsed)
 *   }}
 * >
 *   <div>对话内容</div>
 * </ChatLayout>
 *
 * // 自定义底部
 * <ChatLayout
 *   header={{ title: "AI 助手" }}
 *   footer={<div>自定义底部内容</div>}
 * >
 *   <div>对话内容</div>
 * </ChatLayout>
 * ```
 *
 * @returns {React.ReactElement} 渲染的聊天布局组件
 */ var ChatLayoutComponent = /*#__PURE__*/ forwardRef(function(param, ref) {
    var header = param.header, children = param.children, footer = param.footer, _param_footerHeight = param.footerHeight, footerHeight = _param_footerHeight === void 0 ? 48 : _param_footerHeight, _param_scrollBehavior = param.scrollBehavior, scrollBehavior = _param_scrollBehavior === void 0 ? 'smooth' : _param_scrollBehavior, className = param.className, style = param.style, classNames = param.classNames, styles = param.styles, _param_showFooterBackground = param.showFooterBackground, showFooterBackground = _param_showFooterBackground === void 0 ? true : _param_showFooterBackground;
    var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
    var prefixCls = getPrefixCls('chat-layout');
    var _useStyle = useStyle(prefixCls), wrapSSR = _useStyle.wrapSSR, hashId = _useStyle.hashId;
    var _useAutoScroll = useAutoScroll({
        SCROLL_TOLERANCE: 30,
        onResize: function onResize() {},
        timeout: 200,
        scrollBehavior: scrollBehavior
    }), containerRef = _useAutoScroll.containerRef, scrollToBottom = _useAutoScroll.scrollToBottom;
    var footerRef = useRef(null);
    var _useElementSize = useElementSize(footerRef), actualFooterHeight = _useElementSize.height;
    useImperativeHandle(ref, function() {
        return {
            scrollContainer: containerRef.current,
            scrollToBottom: scrollToBottom
        };
    });
    // footer 实际高度变化时（spacer 随之调整），保持列表贴底
    useEffect(function() {
        if (actualFooterHeight > 0) {
            scrollToBottom();
        }
    }, [
        actualFooterHeight
    ]);
    var rootClassName = clsx(prefixCls, className, classNames === null || classNames === void 0 ? void 0 : classNames.root, hashId);
    var contentClassName = clsx("".concat(prefixCls, "-content"), classNames === null || classNames === void 0 ? void 0 : classNames.content, hashId);
    var scrollableClassName = clsx("".concat(prefixCls, "-content-scrollable"), classNames === null || classNames === void 0 ? void 0 : classNames.scrollable, hashId);
    var footerClassName = clsx("".concat(prefixCls, "-footer"), classNames === null || classNames === void 0 ? void 0 : classNames.footer, hashId);
    var footerBackgroundClassName = clsx("".concat(prefixCls, "-footer-background"), classNames === null || classNames === void 0 ? void 0 : classNames.footerBackground, hashId);
    return wrapSSR(/*#__PURE__*/ React.createElement("div", {
        className: rootClassName,
        "data-testid": prefixCls,
        style: _object_spread({}, styles === null || styles === void 0 ? void 0 : styles.root, style)
    }, header && /*#__PURE__*/ React.createElement(LayoutHeader, header), /*#__PURE__*/ React.createElement("div", {
        className: contentClassName,
        style: styles === null || styles === void 0 ? void 0 : styles.content
    }, /*#__PURE__*/ React.createElement("div", {
        className: scrollableClassName,
        ref: containerRef,
        style: styles === null || styles === void 0 ? void 0 : styles.scrollable
    }, children, footer && /*#__PURE__*/ React.createElement("div", {
        style: {
            height: actualFooterHeight,
            width: '100%'
        },
        "aria-hidden": "true"
    }))), showFooterBackground && /*#__PURE__*/ React.createElement(FooterBackground, {
        className: footerBackgroundClassName
    }), footer && /*#__PURE__*/ React.createElement("div", {
        ref: footerRef,
        className: footerClassName,
        style: _object_spread({
            minHeight: footerHeight
        }, styles === null || styles === void 0 ? void 0 : styles.footer)
    }, footer)));
});
ChatLayoutComponent.displayName = 'ChatLayout';
// 使用 React.memo 优化性能，避免不必要的重新渲染
export var ChatLayout = /*#__PURE__*/ memo(ChatLayoutComponent);
// 保持向后兼容，导出 ChatFlowHeader 作为 LayoutHeader 的别名
export { LayoutHeader as ChatFlowHeader } from "../Components/LayoutHeader";
