@lobehub/ui 3.4.2 → 3.4.3

package/es/chat/ChatInputArea/index.mjs

@@ -0,0 +1,15 @@
+import ChatInputAreaInner_default from "./components/ChatInputAreaInner.mjs";
+import ChatInputArea_default$1 from "./ChatInputArea.mjs";
+import ChatInputActionBar_default from "./components/ChatInputActionBar.mjs";
+import ChatSendButton_default from "./components/ChatSendButton.mjs";
+
+//#region src/chat/ChatInputArea/index.ts
+const ChatInputArea = ChatInputArea_default$1;
+ChatInputArea.Inner = ChatInputAreaInner_default;
+ChatInputArea.ActionBar = ChatInputActionBar_default;
+ChatInputArea.SendButton = ChatSendButton_default;
+var ChatInputArea_default = ChatInputArea;
+
+//#endregion
+export { ChatInputArea_default as default };
+//# sourceMappingURL=index.mjs.map

package/es/chat/ChatInputArea/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["ChatInputAreaParent","ChatInputAreaInner","ChatInputActionBar","ChatSendButton"],"sources":["../../../src/chat/ChatInputArea/index.ts"],"sourcesContent":["import { type ReactNode } from 'react';\n\nimport ChatInputAreaParent from './ChatInputArea';\nimport ChatInputActionBar from './components/ChatInputActionBar';\nimport ChatInputAreaInner from './components/ChatInputAreaInner';\nimport ChatSendButton from './components/ChatSendButton';\nimport type { ChatInputAreaProps } from './type';\n\ninterface IChatHeader {\n  (props: ChatInputAreaProps): ReactNode;\n  ActionBar: typeof ChatInputActionBar;\n  Inner: typeof ChatInputAreaInner;\n  SendButton: typeof ChatSendButton;\n}\n\nconst ChatInputArea = ChatInputAreaParent as unknown as IChatHeader;\n\nChatInputArea.Inner = ChatInputAreaInner;\nChatInputArea.ActionBar = ChatInputActionBar;\nChatInputArea.SendButton = ChatSendButton;\n\nexport default ChatInputArea;\nexport { default as ChatInputActionBar } from './components/ChatInputActionBar';\nexport { default as ChatInputAreaInner } from './components/ChatInputAreaInner';\nexport { default as ChatSendButton } from './components/ChatSendButton';\nexport type * from './type';\n"],"mappings":";;;;;;AAeA,MAAM,gBAAgBA;AAEtB,cAAc,QAAQC;AACtB,cAAc,YAAYC;AAC1B,cAAc,aAAaC;AAE3B,4BAAe"}

package/es/chat/ChatInputArea/style.mjs

@@ -0,0 +1,43 @@
+import { createStyles } from "antd-style";
+
+//#region src/chat/ChatInputArea/style.ts
+const useStyles = createStyles(({ css: css$1 }) => {
+	return {
+		container: css$1`
+      position: relative;
+
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+
+      height: 100%;
+      padding-block: 8px 12px;
+      padding-inline: 0;
+    `,
+		textarea: css$1`
+      height: 100% !important;
+      padding-block: 0;
+      padding-inline: 8px;
+      line-height: 1.5;
+    `,
+		textareaContainer: css$1`
+      position: relative;
+      flex: 1;
+    `
+	};
+});
+const useActionBarStyles = createStyles(({ css: css$1, cx: cx$1, stylish }) => ({
+	left: cx$1(stylish.noScrollbar, css$1`
+      overflow: auto hidden;
+    `),
+	right: css$1``,
+	root: css$1`
+    position: relative;
+    overflow: hidden;
+    width: 100%;
+  `
+}));
+
+//#endregion
+export { useActionBarStyles, useStyles };
+//# sourceMappingURL=style.mjs.map

package/es/chat/ChatInputArea/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":["cx"],"sources":["../../../src/chat/ChatInputArea/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nexport const useStyles = createStyles(({ css }) => {\n  return {\n    container: css`\n      position: relative;\n\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n\n      height: 100%;\n      padding-block: 8px 12px;\n      padding-inline: 0;\n    `,\n    textarea: css`\n      height: 100% !important;\n      padding-block: 0;\n      padding-inline: 8px;\n      line-height: 1.5;\n    `,\n    textareaContainer: css`\n      position: relative;\n      flex: 1;\n    `,\n  };\n});\n\nexport const useActionBarStyles = createStyles(({ css, cx, stylish }) => ({\n  left: cx(\n    stylish.noScrollbar,\n    css`\n      overflow: auto hidden;\n    `,\n  ),\n  right: css``,\n  root: css`\n    position: relative;\n    overflow: hidden;\n    width: 100%;\n  `,\n}));\n"],"mappings":";;;AAEA,MAAa,YAAY,cAAc,EAAE,iBAAU;AACjD,QAAO;EACL,WAAW,KAAG;;;;;;;;;;;EAWd,UAAU,KAAG;;;;;;EAMb,mBAAmB,KAAG;;;;EAIvB;EACD;AAEF,MAAa,qBAAqB,cAAc,EAAE,YAAK,UAAI,eAAe;CACxE,MAAMA,KACJ,QAAQ,aACR,KAAG;;MAGJ;CACD,OAAO,KAAG;CACV,MAAM,KAAG;;;;;CAKV,EAAE"}

package/es/chat/ChatInputArea/type.d.mts

@@ -0,0 +1,58 @@
+import { FlexboxProps } from "../../Flex/type.mjs";
+import "../../Flex/index.mjs";
+import { DraggablePanelProps } from "../../DraggablePanel/type.mjs";
+import "../../DraggablePanel/index.mjs";
+import { TextAreaProps as TextAreaProps$1 } from "../../Input/type.mjs";
+import "../../Input/index.mjs";
+import { CSSProperties, ReactNode, Ref } from "react";
+import { TextAreaRef } from "antd/es/input/TextArea";
+
+//#region src/chat/ChatInputArea/type.d.ts
+interface ChatInputAreaProps extends Omit<ChatInputAreaInnerProps, 'classNames'> {
+  bottomAddons?: ReactNode;
+  classNames?: DraggablePanelProps['classNames'];
+  expand?: boolean;
+  heights?: {
+    headerHeight?: number;
+    inputHeight?: number;
+    maxHeight?: number;
+    minHeight?: number;
+  };
+  onSizeChange?: DraggablePanelProps['onSizeChange'];
+  ref?: Ref<TextAreaRef>;
+  setExpand?: (expand: boolean) => void;
+  topAddons?: ReactNode;
+}
+interface ChatInputActionBarProps {
+  leftAddons?: ReactNode;
+  mobile?: boolean;
+  padding?: number | string;
+  ref?: Ref<HTMLDivElement>;
+  rightAddons?: ReactNode;
+}
+interface ChatInputAreaInnerProps extends Omit<TextAreaProps$1, 'onInput'> {
+  className?: string;
+  loading?: boolean;
+  onInput?: (value: string) => void;
+  onSend?: () => void;
+  ref?: Ref<TextAreaRef>;
+  style?: CSSProperties;
+}
+interface ChatSendButtonProps extends FlexboxProps {
+  className?: string;
+  leftAddons?: ReactNode;
+  loading?: boolean;
+  onSend?: () => void;
+  onStop?: () => void;
+  ref?: Ref<HTMLDivElement>;
+  rightAddons?: ReactNode;
+  style?: CSSProperties;
+  texts?: {
+    send?: string;
+    stop?: string;
+    warp?: string;
+  };
+}
+//#endregion
+export { ChatInputActionBarProps, ChatInputAreaInnerProps, ChatInputAreaProps, ChatSendButtonProps };
+//# sourceMappingURL=type.d.mts.map

package/es/chat/ChatItem/ChatItem.d.mts

@@ -0,0 +1,8 @@
+import { ChatItemProps } from "./type.mjs";
+import * as react120 from "react";
+
+//#region src/chat/ChatItem/ChatItem.d.ts
+declare const ChatItem: react120.NamedExoticComponent<ChatItemProps>;
+//#endregion
+export { ChatItem };
+//# sourceMappingURL=ChatItem.d.mts.map

package/es/chat/ChatItem/ChatItem.mjs

@@ -0,0 +1,130 @@
+'use client';
+
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import { useStyles } from "./style.mjs";
+import Actions_default from "./components/Actions.mjs";
+import Avatar_default from "./components/Avatar.mjs";
+import BorderSpacing_default from "./components/BorderSpacing.mjs";
+import ErrorContent_default from "./components/ErrorContent.mjs";
+import MessageContent_default from "./components/MessageContent.mjs";
+import Title_default from "./components/Title.mjs";
+import { memo, useEffect, useRef, useState } from "react";
+import { useResponsive } from "antd-style";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/chat/ChatItem/ChatItem.tsx
+const MOBILE_AVATAR_SIZE = 32;
+const ChatItem = memo(({ avatarAddon, onAvatarClick, avatarProps, actions, className, primary, loading, message, placeholderMessage = "...", placement = "left", variant = "bubble", avatar, error, showTitle, time, editing, onChange, onEditingChange, messageExtra, renderMessage, text, errorMessage, onDoubleClick, fontSize, aboveMessage, belowMessage, markdownProps, actionsWrapWidth = 54, showAvatar = true, titleAddon, ...rest }) => {
+	const { mobile } = useResponsive();
+	const { cx: cx$1, styles } = useStyles({
+		editing,
+		placement,
+		primary,
+		showTitle,
+		time,
+		title: avatar.title,
+		variant
+	});
+	const contentRef = useRef(null);
+	const containerRef = useRef(null);
+	const [layoutMode, setLayoutMode] = useState(variant === "bubble" ? "horizontal" : "vertical");
+	useEffect(() => {
+		if (variant === "docs") {
+			setLayoutMode("vertical");
+			return;
+		}
+		if (!contentRef.current || !containerRef.current) return;
+		const observer = new ResizeObserver(() => {
+			if (!contentRef.current || !containerRef.current) return;
+			const containerWidth = containerRef.current.clientWidth;
+			const contentWidth = contentRef.current.scrollWidth;
+			setLayoutMode(contentWidth + actionsWrapWidth > containerWidth ? "vertical" : "horizontal");
+		});
+		observer.observe(contentRef.current);
+		observer.observe(containerRef.current);
+		return () => observer.disconnect();
+	}, [variant, actionsWrapWidth]);
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		className: cx$1(styles.container, className),
+		direction: placement === "left" ? "horizontal" : "horizontal-reverse",
+		gap: mobile ? 6 : 12,
+		...rest,
+		children: [
+			showAvatar && /* @__PURE__ */ jsx(Avatar_default, {
+				...avatarProps,
+				addon: avatarAddon,
+				alt: avatarProps?.alt || avatar.title || "avatar",
+				avatar,
+				loading,
+				onClick: onAvatarClick,
+				placement,
+				size: mobile ? MOBILE_AVATAR_SIZE : void 0,
+				style: {
+					marginTop: showTitle ? -12 : 6,
+					...avatarProps?.style
+				}
+			}),
+			/* @__PURE__ */ jsxs(FlexBasic_default, {
+				align: placement === "left" ? "flex-start" : "flex-end",
+				className: styles.messageContainer,
+				ref: containerRef,
+				children: [
+					/* @__PURE__ */ jsx(Title_default, {
+						avatar,
+						placement,
+						showTitle,
+						time,
+						titleAddon
+					}),
+					aboveMessage,
+					/* @__PURE__ */ jsxs(FlexBasic_default, {
+						align: placement === "left" ? "flex-start" : "flex-end",
+						className: styles.messageContent,
+						"data-layout": layoutMode,
+						direction: layoutMode === "horizontal" ? placement === "left" ? "horizontal" : "horizontal-reverse" : "vertical",
+						gap: 8,
+						children: [/* @__PURE__ */ jsx(FlexBasic_default, {
+							ref: contentRef,
+							width: "100%",
+							children: error && (message === placeholderMessage || !message) ? /* @__PURE__ */ jsx(ErrorContent_default, {
+								error,
+								message: errorMessage,
+								placement
+							}) : /* @__PURE__ */ jsx(MessageContent_default, {
+								editing,
+								fontSize,
+								markdownProps,
+								message,
+								messageExtra: /* @__PURE__ */ jsxs(Fragment$1, { children: [error && /* @__PURE__ */ jsx(ErrorContent_default, {
+									error,
+									message: errorMessage,
+									placement
+								}), messageExtra] }),
+								onChange,
+								onDoubleClick,
+								onEditingChange,
+								placement,
+								primary,
+								renderMessage,
+								text,
+								variant
+							})
+						}), actions && /* @__PURE__ */ jsx(Actions_default, {
+							actions,
+							editing,
+							placement,
+							variant
+						})]
+					}),
+					belowMessage
+				]
+			}),
+			mobile && variant === "bubble" && showAvatar && /* @__PURE__ */ jsx(BorderSpacing_default, { borderSpacing: MOBILE_AVATAR_SIZE })
+		]
+	});
+});
+var ChatItem_default = ChatItem;
+
+//#endregion
+export { ChatItem_default as default };
+//# sourceMappingURL=ChatItem.mjs.map

package/es/chat/ChatItem/ChatItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatItem.mjs","names":["Flexbox","cx","Avatar","Title","ErrorContent","MessageContent","Actions","BorderSpacing"],"sources":["../../../src/chat/ChatItem/ChatItem.tsx"],"sourcesContent":["'use client';\n\nimport { useResponsive } from 'antd-style';\nimport { memo, useEffect, useRef, useState } from 'react';\n\nimport { Flexbox } from '@/Flex';\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 { useStyles } 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 { cx, styles } = useStyles({\n      editing,\n      placement,\n      primary,\n      showTitle,\n      time,\n      title: avatar.title,\n      variant,\n    });\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    return (\n      <Flexbox\n        className={cx(styles.container, className)}\n        direction={placement === 'left' ? 'horizontal' : 'horizontal-reverse'}\n        gap={mobile ? 6 : 12}\n        {...rest}\n      >\n        {showAvatar && (\n          <Avatar\n            {...avatarProps}\n            addon={avatarAddon}\n            alt={avatarProps?.alt || avatar.title || 'avatar'}\n            avatar={avatar}\n            loading={loading}\n            onClick={onAvatarClick}\n            placement={placement}\n            size={mobile ? MOBILE_AVATAR_SIZE : undefined}\n            style={{\n              marginTop: showTitle ? -12 : 6,\n              ...avatarProps?.style,\n            }}\n          />\n        )}\n        <Flexbox\n          align={placement === 'left' ? 'flex-start' : 'flex-end'}\n          className={styles.messageContainer}\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={styles.messageContent}\n            data-layout={layoutMode} // 添加数据属性以方便样式选择\n            direction={\n              layoutMode === 'horizontal'\n                ? placement === 'left'\n                  ? 'horizontal'\n                  : 'horizontal-reverse'\n                : 'vertical'\n            }\n            gap={8}\n          >\n            <Flexbox ref={contentRef} width={'100%'}>\n              {error && (message === placeholderMessage || !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                  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                  placement={placement}\n                  primary={primary}\n                  renderMessage={renderMessage}\n                  text={text}\n                  variant={variant}\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":";;;;;;;;;;;;;;;AAgBA,MAAM,qBAAqB;AAE3B,MAAM,WAAW,MACd,EACC,aACA,eACA,aACA,SACA,WACA,SACA,SACA,SACA,qBAAqB,OACrB,YAAY,QACZ,UAAU,UACV,QACA,OACA,WACA,MACA,SACA,UACA,iBACA,cACA,eACA,MACA,cACA,eACA,UACA,cACA,cACA,eACA,mBAAmB,IACnB,aAAa,MACb,YACA,GAAG,WACC;CACJ,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,UAAI,WAAW,UAAU;EAC/B;EACA;EACA;EACA;EACA;EACA,OAAO,OAAO;EACd;EACD,CAAC;CAGF,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,CAAC,YAAY,iBAAiB,SAClC,YAAY,WAAW,eAAe,WACvC;AAGD,iBAAgB;AACd,MAAI,YAAY,QAAQ;AACtB,iBAAc,WAAW;AACzB;;AAGF,MAAI,CAAC,WAAW,WAAW,CAAC,aAAa,QAAS;EAElD,MAAM,WAAW,IAAI,qBAAqB;AACxC,OAAI,CAAC,WAAW,WAAW,CAAC,aAAa,QAAS;GAElD,MAAM,iBAAiB,aAAa,QAAQ;GAC5C,MAAM,eAAe,WAAW,QAAQ;AAKxC,iBAAc,eAAe,mBAAmB,iBAAiB,aAAa,aAAa;IAC3F;AAEF,WAAS,QAAQ,WAAW,QAAQ;AACpC,WAAS,QAAQ,aAAa,QAAQ;AAEtC,eAAa,SAAS,YAAY;IACjC,CAAC,SAAS,iBAAiB,CAAC;AAE/B,QACE,qBAACA;EACC,WAAWC,KAAG,OAAO,WAAW,UAAU;EAC1C,WAAW,cAAc,SAAS,eAAe;EACjD,KAAK,SAAS,IAAI;EAClB,GAAI;;GAEH,cACC,oBAACC;IACC,GAAI;IACJ,OAAO;IACP,KAAK,aAAa,OAAO,OAAO,SAAS;IACjC;IACC;IACT,SAAS;IACE;IACX,MAAM,SAAS,qBAAqB;IACpC,OAAO;KACL,WAAW,YAAY,MAAM;KAC7B,GAAG,aAAa;KACjB;KACD;GAEJ,qBAACF;IACC,OAAO,cAAc,SAAS,eAAe;IAC7C,WAAW,OAAO;IAClB,KAAK;;KAEL,oBAACG;MACS;MACG;MACA;MACL;MACM;OACZ;KACD;KACD,qBAACH;MACC,OAAO,cAAc,SAAS,eAAe;MAC7C,WAAW,OAAO;MAClB,eAAa;MACb,WACE,eAAe,eACX,cAAc,SACZ,eACA,uBACF;MAEN,KAAK;iBAEL,oBAACA;OAAQ,KAAK;OAAY,OAAO;iBAC9B,UAAU,YAAY,sBAAsB,CAAC,WAC5C,oBAACI;QAAoB;QAAO,SAAS;QAAyB;SAAa,GAE3E,oBAACC;QACU;QACC;QACK;QACN;QACT,cACE,8CACG,SACC,oBAACD;SAAoB;SAAO,SAAS;SAAyB;UAAa,EAE5E,gBACA;QAEK;QACK;QACE;QACN;QACF;QACM;QACT;QACG;SACT;QAEI,EACT,WACC,oBAACE;OACU;OACA;OACE;OACF;QACT;OAEI;KACT;;KACO;GACT,UAAU,YAAY,YAAY,cACjC,oBAACC,yBAAc,eAAe,qBAAsB;;GAE9C;EAGf;AAED,uBAAe"}

package/es/chat/ChatItem/components/Actions.mjs

@@ -0,0 +1,24 @@
+import FlexBasic_default from "../../../Flex/FlexBasic.mjs";
+import { useStyles } from "../style.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/chat/ChatItem/components/Actions.tsx
+const Actions = ({ actions, placement, variant, editing, ref }) => {
+	const { styles } = useStyles({
+		editing,
+		placement,
+		variant
+	});
+	return /* @__PURE__ */ jsx(FlexBasic_default, {
+		align: "flex-start",
+		className: styles.actions,
+		ref,
+		role: "menubar",
+		children: actions
+	});
+};
+var Actions_default = Actions;
+
+//#endregion
+export { Actions_default as default };
+//# sourceMappingURL=Actions.mjs.map

package/es/chat/ChatItem/components/Actions.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Actions.mjs","names":["Actions: FC<ActionsProps>","Flexbox"],"sources":["../../../../src/chat/ChatItem/components/Actions.tsx"],"sourcesContent":["import { type FC, type Ref } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport { ChatItemProps } from '@/chat/ChatItem';\n\nimport { useStyles } from '../style';\n\nexport interface ActionsProps {\n  actions: ChatItemProps['actions'];\n  editing?: boolean;\n  placement?: ChatItemProps['placement'];\n  ref?: Ref<HTMLDivElement>;\n  variant?: ChatItemProps['variant'];\n}\n\nconst Actions: FC<ActionsProps> = ({ actions, placement, variant, editing, ref }) => {\n  const { styles } = useStyles({ editing, placement, variant });\n\n  return (\n    <Flexbox align={'flex-start'} className={styles.actions} ref={ref} role=\"menubar\">\n      {actions}\n    </Flexbox>\n  );\n};\n\nexport default Actions;\n"],"mappings":";;;;;AAeA,MAAMA,WAA6B,EAAE,SAAS,WAAW,SAAS,SAAS,UAAU;CACnF,MAAM,EAAE,WAAW,UAAU;EAAE;EAAS;EAAW;EAAS,CAAC;AAE7D,QACE,oBAACC;EAAQ,OAAO;EAAc,WAAW,OAAO;EAAc;EAAK,MAAK;YACrE;GACO;;AAId,sBAAe"}

package/es/chat/ChatItem/components/Avatar.mjs

@@ -0,0 +1,39 @@
+import FlexBasic_default from "../../../Flex/FlexBasic.mjs";
+import Avatar_default$1 from "../../../Avatar/index.mjs";
+import { useStyles } from "../style.mjs";
+import Loading_default from "./Loading.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/chat/ChatItem/components/Avatar.tsx
+const Avatar = ({ loading, avatar, placement, unoptimized, addon, onClick, size = 40, style, alt }) => {
+	const { styles } = useStyles({ avatarSize: size });
+	const avatarContent = /* @__PURE__ */ jsxs("div", {
+		className: styles.avatarContainer,
+		style,
+		children: [/* @__PURE__ */ jsx(Avatar_default$1, {
+			alt: alt || avatar.title,
+			animation: loading,
+			avatar: avatar.avatar,
+			background: avatar.backgroundColor,
+			onClick,
+			size,
+			title: avatar.title,
+			unoptimized
+		}), /* @__PURE__ */ jsx(Loading_default, {
+			loading,
+			placement
+		})]
+	});
+	if (!addon) return avatarContent;
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		align: "center",
+		className: styles.avatarGroupContainer,
+		gap: 8,
+		children: [avatarContent, addon]
+	});
+};
+var Avatar_default = Avatar;
+
+//#endregion
+export { Avatar_default as default };
+//# sourceMappingURL=Avatar.mjs.map

package/es/chat/ChatItem/components/Avatar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.mjs","names":["Avatar: FC<AvatarProps>","A","Loading","Flexbox"],"sources":["../../../../src/chat/ChatItem/components/Avatar.tsx"],"sourcesContent":["import { type CSSProperties, type FC } from 'react';\n\nimport A from '@/Avatar';\nimport { Flexbox } from '@/Flex';\n\nimport { useStyles } from '../style';\nimport type { ChatItemProps } from '../type';\nimport Loading from './Loading';\n\nexport interface AvatarProps {\n  addon?: ChatItemProps['avatarAddon'];\n  alt?: string;\n  avatar: ChatItemProps['avatar'];\n  loading?: ChatItemProps['loading'];\n  onClick?: ChatItemProps['onAvatarClick'];\n  placement?: ChatItemProps['placement'];\n  size?: number;\n  style?: CSSProperties;\n  unoptimized?: boolean;\n}\n\nconst Avatar: FC<AvatarProps> = ({\n  loading,\n  avatar,\n  placement,\n  unoptimized,\n  addon,\n  onClick,\n  size = 40,\n  style,\n  alt,\n}) => {\n  const { styles } = useStyles({ avatarSize: size });\n  const avatarContent = (\n    <div className={styles.avatarContainer} style={style}>\n      <A\n        alt={alt || avatar.title}\n        animation={loading}\n        avatar={avatar.avatar}\n        background={avatar.backgroundColor}\n        onClick={onClick}\n        size={size}\n        title={avatar.title}\n        unoptimized={unoptimized}\n      />\n      <Loading loading={loading} placement={placement} />\n    </div>\n  );\n\n  if (!addon) return avatarContent;\n  return (\n    <Flexbox align={'center'} className={styles.avatarGroupContainer} gap={8}>\n      {avatarContent}\n      {addon}\n    </Flexbox>\n  );\n};\n\nexport default Avatar;\n"],"mappings":";;;;;;;AAqBA,MAAMA,UAA2B,EAC/B,SACA,QACA,WACA,aACA,OACA,SACA,OAAO,IACP,OACA,UACI;CACJ,MAAM,EAAE,WAAW,UAAU,EAAE,YAAY,MAAM,CAAC;CAClD,MAAM,gBACJ,qBAAC;EAAI,WAAW,OAAO;EAAwB;aAC7C,oBAACC;GACC,KAAK,OAAO,OAAO;GACnB,WAAW;GACX,QAAQ,OAAO;GACf,YAAY,OAAO;GACV;GACH;GACN,OAAO,OAAO;GACD;IACb,EACF,oBAACC;GAAiB;GAAoB;IAAa;GAC/C;AAGR,KAAI,CAAC,MAAO,QAAO;AACnB,QACE,qBAACC;EAAQ,OAAO;EAAU,WAAW,OAAO;EAAsB,KAAK;aACpE,eACA;GACO;;AAId,qBAAe"}

package/es/chat/ChatItem/components/BorderSpacing.mjs

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+
+//#region src/chat/ChatItem/components/BorderSpacing.tsx
+const BorderSpacing = ({ borderSpacing }) => {
+	if (!borderSpacing) return null;
+	return /* @__PURE__ */ jsx("div", { style: {
+		flex: "none",
+		width: borderSpacing
+	} });
+};
+var BorderSpacing_default = BorderSpacing;
+
+//#endregion
+export { BorderSpacing_default as default };
+//# sourceMappingURL=BorderSpacing.mjs.map

package/es/chat/ChatItem/components/BorderSpacing.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BorderSpacing.mjs","names":["BorderSpacing: FC<BorderSpacingProps>"],"sources":["../../../../src/chat/ChatItem/components/BorderSpacing.tsx"],"sourcesContent":["import { type FC } from 'react';\n\nexport interface BorderSpacingProps {\n  borderSpacing?: number;\n}\n\nconst BorderSpacing: FC<BorderSpacingProps> = ({ borderSpacing }) => {\n  if (!borderSpacing) return null;\n\n  return <div style={{ flex: 'none', width: borderSpacing }} />;\n};\n\nexport default BorderSpacing;\n"],"mappings":";;;AAMA,MAAMA,iBAAyC,EAAE,oBAAoB;AACnE,KAAI,CAAC,cAAe,QAAO;AAE3B,QAAO,oBAAC,SAAI,OAAO;EAAE,MAAM;EAAQ,OAAO;EAAe,GAAI;;AAG/D,4BAAe"}

package/es/chat/ChatItem/components/ErrorContent.mjs

@@ -0,0 +1,24 @@
+import FlexBasic_default from "../../../Flex/FlexBasic.mjs";
+import Alert_default from "../../../Alert/Alert.mjs";
+import { useStyles } from "../style.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/chat/ChatItem/components/ErrorContent.tsx
+const ErrorContent = ({ message, error, placement }) => {
+	const { styles } = useStyles({ placement });
+	return /* @__PURE__ */ jsx(FlexBasic_default, {
+		className: styles.errorContainer,
+		children: /* @__PURE__ */ jsx(Alert_default, {
+			closable: false,
+			extra: message,
+			showIcon: true,
+			type: "error",
+			...error
+		})
+	});
+};
+var ErrorContent_default = ErrorContent;
+
+//#endregion
+export { ErrorContent_default as default };
+//# sourceMappingURL=ErrorContent.mjs.map

package/es/chat/ChatItem/components/ErrorContent.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorContent.mjs","names":["ErrorContent: FC<ErrorContentProps>","Flexbox","Alert"],"sources":["../../../../src/chat/ChatItem/components/ErrorContent.tsx"],"sourcesContent":["import { type FC } from 'react';\n\nimport Alert from '@/Alert';\nimport { Flexbox } from '@/Flex';\nimport { ChatItemProps } from '@/chat/ChatItem';\n\nimport { useStyles } from '../style';\n\nexport interface ErrorContentProps {\n  error?: ChatItemProps['error'];\n  message?: ChatItemProps['errorMessage'];\n  placement?: ChatItemProps['placement'];\n}\n\nconst ErrorContent: FC<ErrorContentProps> = ({ message, error, placement }) => {\n  const { styles } = useStyles({ placement });\n\n  return (\n    <Flexbox className={styles.errorContainer}>\n      <Alert closable={false} extra={message} showIcon type={'error'} {...error} />\n    </Flexbox>\n  );\n};\n\nexport default ErrorContent;\n"],"mappings":";;;;;;AAcA,MAAMA,gBAAuC,EAAE,SAAS,OAAO,gBAAgB;CAC7E,MAAM,EAAE,WAAW,UAAU,EAAE,WAAW,CAAC;AAE3C,QACE,oBAACC;EAAQ,WAAW,OAAO;YACzB,oBAACC;GAAM,UAAU;GAAO,OAAO;GAAS;GAAS,MAAM;GAAS,GAAI;IAAS;GACrE;;AAId,2BAAe"}

package/es/chat/ChatItem/components/Loading.mjs

@@ -0,0 +1,29 @@
+import FlexBasic_default from "../../../Flex/FlexBasic.mjs";
+import Icon_default from "../../../Icon/Icon.mjs";
+import { useStyles } from "../style.mjs";
+import { jsx } from "react/jsx-runtime";
+import { Loader2 } from "lucide-react";
+
+//#region src/chat/ChatItem/components/Loading.tsx
+const Loading = ({ loading, placement }) => {
+	const { styles } = useStyles({ placement });
+	if (!loading) return null;
+	return /* @__PURE__ */ jsx(FlexBasic_default, {
+		align: "center",
+		className: styles.loading,
+		justify: "center",
+		children: /* @__PURE__ */ jsx(Icon_default, {
+			icon: Loader2,
+			size: {
+				size: 12,
+				strokeWidth: 3
+			},
+			spin: true
+		})
+	});
+};
+var Loading_default = Loading;
+
+//#endregion
+export { Loading_default as default };
+//# sourceMappingURL=Loading.mjs.map

package/es/chat/ChatItem/components/Loading.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loading.mjs","names":["Loading: FC<LoadingProps>","Flexbox","Icon"],"sources":["../../../../src/chat/ChatItem/components/Loading.tsx"],"sourcesContent":["import { Loader2 } from 'lucide-react';\nimport { type FC } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport { ChatItemProps } from '@/chat/ChatItem';\n\nimport { useStyles } from '../style';\n\nexport interface LoadingProps {\n  loading?: ChatItemProps['loading'];\n  placement?: ChatItemProps['placement'];\n}\n\nconst Loading: FC<LoadingProps> = ({ loading, placement }) => {\n  const { styles } = useStyles({ placement });\n\n  if (!loading) return null;\n\n  return (\n    <Flexbox align={'center'} className={styles.loading} justify={'center'}>\n      <Icon icon={Loader2} size={{ size: 12, strokeWidth: 3 }} spin />\n    </Flexbox>\n  );\n};\n\nexport default Loading;\n"],"mappings":";;;;;;;AAcA,MAAMA,WAA6B,EAAE,SAAS,gBAAgB;CAC5D,MAAM,EAAE,WAAW,UAAU,EAAE,WAAW,CAAC;AAE3C,KAAI,CAAC,QAAS,QAAO;AAErB,QACE,oBAACC;EAAQ,OAAO;EAAU,WAAW,OAAO;EAAS,SAAS;YAC5D,oBAACC;GAAK,MAAM;GAAS,MAAM;IAAE,MAAM;IAAI,aAAa;IAAG;GAAE;IAAO;GACxD;;AAId,sBAAe"}

package/es/chat/ChatItem/components/MessageContent.mjs

@@ -0,0 +1,44 @@
+import FlexBasic_default from "../../../Flex/FlexBasic.mjs";
+import { useStyles } from "../style.mjs";
+import EditableMessage_default from "../../EditableMessage/EditableMessage.mjs";
+import { memo } from "react";
+import { useResponsive } from "antd-style";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/chat/ChatItem/components/MessageContent.tsx
+const MessageContent = memo(({ editing, onChange, onEditingChange, text, message, placement, messageExtra, renderMessage, variant, primary, onDoubleClick, fontSize, markdownProps }) => {
+	const { cx: cx$1, styles } = useStyles({
+		editing,
+		placement,
+		primary,
+		variant
+	});
+	const { mobile } = useResponsive();
+	const content = /* @__PURE__ */ jsx(EditableMessage_default, {
+		classNames: { input: styles.editingInput },
+		editButtonSize: "small",
+		editing,
+		fontSize,
+		fullFeaturedCodeBlock: true,
+		markdownProps,
+		onChange,
+		onEditingChange,
+		openModal: mobile ? editing : void 0,
+		text,
+		value: message ? String(message) : ""
+	});
+	const messageContent = renderMessage ? renderMessage(content) : content;
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		className: cx$1(styles.message, editing && styles.editingContainer),
+		onDoubleClick,
+		children: [messageContent, messageExtra && !editing ? /* @__PURE__ */ jsx("div", {
+			className: styles.messageExtra,
+			children: messageExtra
+		}) : null]
+	});
+});
+var MessageContent_default = MessageContent;
+
+//#endregion
+export { MessageContent_default as default };
+//# sourceMappingURL=MessageContent.mjs.map

package/es/chat/ChatItem/components/MessageContent.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageContent.mjs","names":["EditableMessage","Flexbox","cx"],"sources":["../../../../src/chat/ChatItem/components/MessageContent.tsx"],"sourcesContent":["import { useResponsive } from 'antd-style';\nimport { type ReactNode, memo } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport type { MarkdownProps } from '@/Markdown';\nimport { ChatItemProps } from '@/chat/ChatItem';\nimport EditableMessage from '@/chat/EditableMessage';\n\nimport { useStyles } from '../style';\n\nexport interface MessageContentProps {\n  editing?: ChatItemProps['editing'];\n  fontSize?: number;\n  markdownProps?: Omit<MarkdownProps, 'className' | 'style' | 'children'>;\n  message?: ReactNode;\n  messageExtra?: ChatItemProps['messageExtra'];\n  onChange?: ChatItemProps['onChange'];\n  onDoubleClick?: ChatItemProps['onDoubleClick'];\n  onEditingChange?: ChatItemProps['onEditingChange'];\n  placement?: ChatItemProps['placement'];\n  primary?: ChatItemProps['primary'];\n  renderMessage?: ChatItemProps['renderMessage'];\n  text?: ChatItemProps['text'];\n  variant?: ChatItemProps['variant'];\n}\n\nconst MessageContent = memo<MessageContentProps>(\n  ({\n    editing,\n    onChange,\n    onEditingChange,\n    text,\n    message,\n    placement,\n    messageExtra,\n    renderMessage,\n    variant,\n    primary,\n    onDoubleClick,\n    fontSize,\n    markdownProps,\n  }) => {\n    const { cx, styles } = useStyles({ editing, placement, primary, variant });\n    const { mobile } = useResponsive();\n\n    const content = (\n      <EditableMessage\n        classNames={{ input: styles.editingInput }}\n        editButtonSize={'small'}\n        editing={editing}\n        fontSize={fontSize}\n        fullFeaturedCodeBlock\n        markdownProps={markdownProps}\n        onChange={onChange}\n        onEditingChange={onEditingChange}\n        openModal={mobile ? editing : undefined}\n        text={text}\n        value={message ? String(message) : ''}\n      />\n    );\n    const messageContent = renderMessage ? renderMessage(content) : content;\n\n    return (\n      <Flexbox\n        className={cx(styles.message, editing && styles.editingContainer)}\n        onDoubleClick={onDoubleClick}\n      >\n        {messageContent}\n        {messageExtra && !editing ? (\n          <div className={styles.messageExtra}>{messageExtra}</div>\n        ) : null}\n      </Flexbox>\n    );\n  },\n);\n\nexport default MessageContent;\n"],"mappings":";;;;;;;;AA0BA,MAAM,iBAAiB,MACpB,EACC,SACA,UACA,iBACA,MACA,SACA,WACA,cACA,eACA,SACA,SACA,eACA,UACA,oBACI;CACJ,MAAM,EAAE,UAAI,WAAW,UAAU;EAAE;EAAS;EAAW;EAAS;EAAS,CAAC;CAC1E,MAAM,EAAE,WAAW,eAAe;CAElC,MAAM,UACJ,oBAACA;EACC,YAAY,EAAE,OAAO,OAAO,cAAc;EAC1C,gBAAgB;EACP;EACC;EACV;EACe;EACL;EACO;EACjB,WAAW,SAAS,UAAU;EACxB;EACN,OAAO,UAAU,OAAO,QAAQ,GAAG;GACnC;CAEJ,MAAM,iBAAiB,gBAAgB,cAAc,QAAQ,GAAG;AAEhE,QACE,qBAACC;EACC,WAAWC,KAAG,OAAO,SAAS,WAAW,OAAO,iBAAiB;EAClD;aAEd,gBACA,gBAAgB,CAAC,UAChB,oBAAC;GAAI,WAAW,OAAO;aAAe;IAAmB,GACvD;GACI;EAGf;AAED,6BAAe"}

package/es/chat/ChatItem/components/Title.mjs

@@ -0,0 +1,29 @@
+import FlexBasic_default from "../../../Flex/FlexBasic.mjs";
+import { useStyles } from "../style.mjs";
+import { formatTime } from "../../../utils/formatTime.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/chat/ChatItem/components/Title.tsx
+const Title = ({ showTitle, placement, time, avatar, titleAddon }) => {
+	const { styles } = useStyles({
+		placement,
+		showTitle,
+		time
+	});
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		align: "center",
+		className: styles.name,
+		direction: placement === "left" ? "horizontal" : "horizontal-reverse",
+		gap: 4,
+		children: [
+			showTitle ? avatar.title || "untitled" : void 0,
+			showTitle ? titleAddon : void 0,
+			time && /* @__PURE__ */ jsx("time", { children: formatTime(time) })
+		]
+	});
+};
+var Title_default = Title;
+
+//#endregion
+export { Title_default as default };
+//# sourceMappingURL=Title.mjs.map

package/es/chat/ChatItem/components/Title.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Title.mjs","names":["Title: FC<TitleProps>","Flexbox"],"sources":["../../../../src/chat/ChatItem/components/Title.tsx"],"sourcesContent":["import { type FC } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport { ChatItemProps } from '@/chat/ChatItem';\nimport { formatTime } from '@/utils/formatTime';\n\nimport { useStyles } from '../style';\n\nexport interface TitleProps {\n  avatar: ChatItemProps['avatar'];\n  placement?: ChatItemProps['placement'];\n  showTitle?: ChatItemProps['showTitle'];\n  time?: ChatItemProps['time'];\n  titleAddon?: ChatItemProps['titleAddon'];\n}\n\nconst Title: FC<TitleProps> = ({ showTitle, placement, time, avatar, titleAddon }) => {\n  const { styles } = useStyles({ placement, showTitle, time });\n\n  return (\n    <Flexbox\n      align={'center'}\n      className={styles.name}\n      direction={placement === 'left' ? 'horizontal' : 'horizontal-reverse'}\n      gap={4}\n    >\n      {showTitle ? avatar.title || 'untitled' : undefined}\n      {showTitle ? titleAddon : undefined}\n      {time && <time>{formatTime(time)}</time>}\n    </Flexbox>\n  );\n};\n\nexport default Title;\n"],"mappings":";;;;;;AAgBA,MAAMA,SAAyB,EAAE,WAAW,WAAW,MAAM,QAAQ,iBAAiB;CACpF,MAAM,EAAE,WAAW,UAAU;EAAE;EAAW;EAAW;EAAM,CAAC;AAE5D,QACE,qBAACC;EACC,OAAO;EACP,WAAW,OAAO;EAClB,WAAW,cAAc,SAAS,eAAe;EACjD,KAAK;;GAEJ,YAAY,OAAO,SAAS,aAAa;GACzC,YAAY,aAAa;GACzB,QAAQ,oBAAC,oBAAM,WAAW,KAAK,GAAQ;;GAChC;;AAId,oBAAe"}

package/es/chat/ChatItem/index.d.mts

@@ -0,0 +1,2 @@
+import { ChatItemProps } from "./type.mjs";
+import { ChatItem } from "./ChatItem.mjs";