{"version":3,"file":"ChatItem.mjs","names":["chatMessages","Flexbox"],"sources":["../../../src/chat/ChatItem/ChatItem.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useResponsive } from 'antd-style';\nimport { memo, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport chatMessages from '@/i18n/resources/en/chat';\nimport { useTranslation } from '@/i18n/useTranslation';\n\nimport Actions from './components/Actions';\nimport Avatar from './components/Avatar';\nimport BorderSpacing from './components/BorderSpacing';\nimport ErrorContent from './components/ErrorContent';\nimport MessageContent from './components/MessageContent';\nimport Title from './components/Title';\nimport { styles } from './style';\nimport type { ChatItemProps } from './type';\n\nconst MOBILE_AVATAR_SIZE = 32;\n\nconst ChatItem = memo<ChatItemProps>(\n  ({\n    avatarAddon,\n    onAvatarClick,\n    avatarProps,\n    actions,\n    className,\n    primary,\n    loading,\n    message,\n    placeholderMessage,\n    placement = 'left',\n    variant = 'bubble',\n    avatar,\n    error,\n    showTitle,\n    time,\n    editing,\n    onChange,\n    onEditingChange,\n    messageExtra,\n    renderMessage,\n    text,\n    errorMessage,\n    onDoubleClick,\n    fontSize,\n    aboveMessage,\n    belowMessage,\n    markdownProps,\n    actionsWrapWidth = 54,\n    showAvatar = true,\n    titleAddon,\n    ...rest\n  }) => {\n    const { mobile } = useResponsive();\n    const { t } = useTranslation(chatMessages);\n\n    const avatarSize = mobile ? MOBILE_AVATAR_SIZE : avatarProps?.size || 40;\n    const cssVariables = useMemo<Record<string, string>>(\n      () => ({\n        '--chat-item-avatar-size': `${avatarSize}px`,\n      }),\n      [avatarSize],\n    );\n\n    const hasTime = Boolean(time);\n    const placeholderText = placeholderMessage ?? t('chat.placeholder');\n    const avatarAlt = avatarProps?.alt || avatar.title || t('chat.avatar');\n\n    // 在 ChatItem 组件中添加\n    const contentRef = useRef<HTMLDivElement>(null);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const [layoutMode, setLayoutMode] = useState<'horizontal' | 'vertical'>(\n      variant === 'bubble' ? 'horizontal' : 'vertical',\n    );\n\n    // 使用 ResizeObserver 监控内容和容器尺寸\n    useEffect(() => {\n      if (variant === 'docs') {\n        setLayoutMode('vertical');\n        return;\n      }\n\n      if (!contentRef.current || !containerRef.current) return;\n\n      const observer = new ResizeObserver(() => {\n        if (!contentRef.current || !containerRef.current) return;\n\n        const containerWidth = containerRef.current.clientWidth;\n        const contentWidth = contentRef.current.scrollWidth; // 使用scrollWidth获取实际内容宽度\n\n        // 预留给Actions的最小空间 (根据实际Actions大小调整)\n\n        // 只有当内容宽度 + Actions最小宽度 > 容器宽度时才切换布局\n        setLayoutMode(contentWidth + actionsWrapWidth > containerWidth ? 'vertical' : 'horizontal');\n      });\n\n      observer.observe(contentRef.current);\n      observer.observe(containerRef.current);\n\n      return () => observer.disconnect();\n    }, [variant, actionsWrapWidth]);\n\n    const containerClassName = cx(\n      variant === 'docs' ? styles.containerDocs : styles.container,\n      className,\n    );\n\n    const messageContainerClassName = useMemo(() => {\n      if (editing) {\n        return hasTime ? styles.messageContainerEditingWithTime : styles.messageContainerEditing;\n      }\n      return hasTime ? styles.messageContainerWithTime : styles.messageContainer;\n    }, [editing, hasTime]);\n\n    const messageContentClassName = useMemo(() => {\n      return editing ? styles.messageContentEditing : styles.messageContent;\n    }, [editing]);\n\n    return (\n      <Flexbox\n        className={containerClassName}\n        direction={placement === 'left' ? 'horizontal' : 'horizontal-reverse'}\n        gap={mobile ? 6 : 12}\n        style={cssVariables}\n        {...rest}\n      >\n        {showAvatar && (\n          <Avatar\n            {...avatarProps}\n            addon={avatarAddon}\n            alt={avatarAlt}\n            avatar={avatar}\n            loading={loading}\n            placement={placement}\n            size={avatarSize}\n            style={{\n              marginTop: showTitle ? -12 : 6,\n              ...avatarProps?.style,\n            }}\n            onClick={onAvatarClick}\n          />\n        )}\n        <Flexbox\n          align={placement === 'left' ? 'flex-start' : 'flex-end'}\n          className={messageContainerClassName}\n          ref={containerRef}\n        >\n          <Title\n            avatar={avatar}\n            placement={placement}\n            showTitle={showTitle}\n            time={time}\n            titleAddon={titleAddon}\n          />\n          {aboveMessage}\n          <Flexbox\n            align={placement === 'left' ? 'flex-start' : 'flex-end'}\n            className={messageContentClassName}\n            data-layout={layoutMode} // 添加数据属性以方便样式选择\n            gap={8}\n            direction={\n              layoutMode === 'horizontal'\n                ? placement === 'left'\n                  ? 'horizontal'\n                  : 'horizontal-reverse'\n                : 'vertical'\n            }\n          >\n            <Flexbox ref={contentRef} width={'100%'}>\n              {error && (message === placeholderText || !message) ? (\n                <ErrorContent error={error} message={errorMessage} placement={placement} />\n              ) : (\n                <MessageContent\n                  editing={editing}\n                  fontSize={fontSize}\n                  markdownProps={markdownProps}\n                  message={message}\n                  placement={placement}\n                  primary={primary}\n                  renderMessage={renderMessage}\n                  text={text}\n                  variant={variant}\n                  messageExtra={\n                    <>\n                      {error && (\n                        <ErrorContent error={error} message={errorMessage} placement={placement} />\n                      )}\n                      {messageExtra}\n                    </>\n                  }\n                  onChange={onChange}\n                  onDoubleClick={onDoubleClick}\n                  onEditingChange={onEditingChange}\n                />\n              )}\n            </Flexbox>\n            {actions && (\n              <Actions\n                actions={actions}\n                editing={editing}\n                placement={placement}\n                variant={variant}\n              />\n            )}\n          </Flexbox>\n          {belowMessage}\n        </Flexbox>\n        {mobile && variant === 'bubble' && showAvatar && (\n          <BorderSpacing borderSpacing={MOBILE_AVATAR_SIZE} />\n        )}\n      </Flexbox>\n    );\n  },\n);\n\nexport default ChatItem;\n\nexport type { ChatItemProps } from './type';\n"],"mappings":"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"}