import { MessageLabel } from '.';
import { FcrAvatar } from '../avatar';
import { MessageBubble } from '../message-bubble';
import { useI18n } from '../../i18n';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
var meta = {
  title: 'Components/MessageLabel',
  tags: ['autodocs'],
  component: MessageLabel,
  args: {
    styles: {
      display: 'flex'
    }
  },
  argTypes: {}
};
export var Doc = function Doc(props) {
  var styles = props.styles;
  var transI18n = useI18n();
  return /*#__PURE__*/_jsxs("div", {
    style: {
      display: 'flex',
      flexDirection: 'column',
      padding: 50,
      border: 'solid 0.5px #e5e7eb'
    },
    children: [/*#__PURE__*/_jsxs("div", {
      style: {
        width: 300,
        marginBottom: 50,
        display: 'flex',
        flexDirection: 'column'
      },
      children: ["Basic: \u81EA\u5DF1\u662F\u4E3B\u6301\u4EBA", /*#__PURE__*/_jsx("div", {
        style: {
          display: 'flex',
          paddingRight: 30,
          flexDirection: 'column'
        },
        children: /*#__PURE__*/_jsx(MessageLabel, {
          color: '#6A79FF',
          publisher: '',
          target: '',
          time: '2023-12-29 12:20 AM',
          tag: /*#__PURE__*/_jsx("div", {
            className: "fcr-msg-tag",
            children: /*#__PURE__*/_jsx("span", {
              children: transI18n('fmt_role_host')
            })
          })
        })
      })]
    }), /*#__PURE__*/_jsxs("div", {
      style: {
        width: 300,
        marginBottom: 50,
        display: 'flex',
        flexDirection: 'column'
      },
      children: ["Basic:", /*#__PURE__*/_jsx("div", {
        style: {
          display: 'flex',
          paddingRight: 30,
          flexDirection: 'column'
        },
        children: /*#__PURE__*/_jsx(MessageLabel, {
          color: '#6A79FF',
          publisher: '',
          target: '',
          time: '2023-12-29 12:20 AM'
        })
      })]
    }), /*#__PURE__*/_jsxs("div", {
      style: {
        width: 300,
        marginBottom: 50,
        display: 'flex',
        flexDirection: 'column'
      },
      children: ["\u5E26\u5934\u50CF:", /*#__PURE__*/_jsx(MessageLabel, {
        color: '#6A79FF',
        publisher: '',
        target: '',
        time: '2023-12-29 12:20 AM',
        avatar: /*#__PURE__*/_jsx(FcrAvatar, {
          size: 24,
          textSize: 24,
          nickName: "\u5468"
        })
      })]
    }), /*#__PURE__*/_jsxs("div", {
      style: {
        width: 400,
        marginBottom: 50,
        display: 'flex',
        flexDirection: 'column'
      },
      children: ["\u5E26\u5934\u50CF & Tag:", /*#__PURE__*/_jsx(MessageLabel, {
        color: '#6A79FF',
        publisher: '',
        target: '',
        time: '2023-12-29 12:20 AM'
        /**TODO：Tag */,
        tag: /*#__PURE__*/_jsx("div", {
          className: "fcr-msg-tag",
          children: /*#__PURE__*/_jsx("span", {
            children: transI18n('fmt_role_host')
          })
        }),
        avatar: /*#__PURE__*/_jsx(FcrAvatar, {
          size: 24,
          textSize: 24,
          nickName: "T"
        })
      })]
    }), "\u5E26\u6D88\u606F\u6C14\u6CE1\u5C55\u793A\uFF1A", /*#__PURE__*/_jsxs("div", {
      style: {
        width: 300,
        marginBottom: 50,
        display: 'flex',
        flexDirection: 'column'
      },
      children: ["Basic:", /*#__PURE__*/_jsxs("div", {
        style: {
          display: 'flex',
          paddingRight: 30,
          flexDirection: 'column'
        },
        children: [/*#__PURE__*/_jsx(MessageLabel, {
          color: '#6A79FF',
          publisher: '',
          target: '',
          time: '2023-12-29 12:20 AM',
          tag: /*#__PURE__*/_jsx("div", {
            className: "fcr-msg-tag",
            children: /*#__PURE__*/_jsx("span", {
              children: transI18n('fmt_role_host')
            })
          })
        }), /*#__PURE__*/_jsx(MessageBubble, {
          role: 'participant',
          isSelf: true
        })]
      })]
    }), /*#__PURE__*/_jsxs("div", {
      style: {
        width: 300,
        marginBottom: 50,
        display: 'flex',
        flexDirection: 'column'
      },
      children: ["Basic:", /*#__PURE__*/_jsxs("div", {
        style: {
          display: 'flex',
          paddingRight: 30,
          flexDirection: 'column'
        },
        children: [/*#__PURE__*/_jsx(MessageLabel, {
          color: '#6A79FF',
          publisher: '',
          target: '',
          time: '2023-12-29 12:20 AM'
        }), /*#__PURE__*/_jsx(MessageBubble, {
          role: 'participant',
          isSelf: true
        })]
      })]
    }), /*#__PURE__*/_jsxs("div", {
      style: {
        width: 300,
        marginBottom: 50,
        display: 'flex',
        flexDirection: 'column'
      },
      children: ["\u5E26\u5934\u50CF:", /*#__PURE__*/_jsx(MessageLabel, {
        color: '#6A79FF',
        publisher: '',
        target: '',
        time: '2023-12-29 12:20 AM',
        avatar: /*#__PURE__*/_jsx(FcrAvatar, {
          size: 24,
          textSize: 24,
          nickName: "\u5468"
        })
      }), /*#__PURE__*/_jsx(MessageBubble, {
        role: "participant",
        styles: {
          marginLeft: 34
        }
      })]
    }), /*#__PURE__*/_jsxs("div", {
      style: {
        width: 400,
        marginBottom: 50,
        display: 'flex',
        flexDirection: 'column'
      },
      children: ["\u5E26\u5934\u50CF & Tag:", /*#__PURE__*/_jsx(MessageLabel, {
        color: '#6A79FF',
        time: '2023-12-29 12:20 AM'
        /**TODO：Tag */,
        tag: /*#__PURE__*/_jsx("div", {
          className: "fcr-msg-tag",
          children: /*#__PURE__*/_jsx("span", {
            children: transI18n('fmt_role_host')
          })
        }),
        avatar: /*#__PURE__*/_jsx(FcrAvatar, {
          size: 24,
          textSize: 24,
          nickName: "T"
        }),
        publisher: '',
        target: ''
      }), /*#__PURE__*/_jsx(MessageBubble, {
        role: "host",
        styles: {
          marginLeft: 34
        }
      })]
    })]
  });
};
export default meta;