function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { PisellEmail } from "./PisellEmail";
import React from 'react';

/**
 * PisellEmail 是一个邮箱地址输入/展示组件。
 * 
 * ## 功能特性
 * - 支持三种状态：只读、编辑、禁用
 * - 邮箱格式校验（标准/严格）
 * - 域名智能补全
 * - mailto 邮件发送
 * - 域名隐藏/脱敏
 * - 白名单/黑名单域名限制
 */
var meta = {
  title: '表单/表单组件/PisellEmail',
  component: PisellEmail,
  parameters: {
    layout: 'centered',
    docs: {
      description: {
        component: '邮箱地址输入/展示组件，支持格式校验、域名补全和 mailto 发送。'
      }
    }
  },
  tags: ['autodocs'],
  argTypes: {
    mode: {
      control: 'radio',
      options: ['read', 'edit'],
      description: '状态模式'
    },
    disabled: {
      control: 'boolean',
      description: '是否禁用'
    },
    strictValidation: {
      control: 'boolean',
      description: '是否使用严格校验（RFC 5322）'
    },
    enableAutoComplete: {
      control: 'boolean',
      description: '启用域名补全'
    },
    enableMailto: {
      control: 'boolean',
      description: '启用 mailto（只读态）'
    },
    hideDomain: {
      control: 'boolean',
      description: '隐藏域名（只读态）'
    },
    displayAsLink: {
      control: 'boolean',
      description: '显示为链接（只读态）'
    },
    showEmailIcon: {
      control: 'boolean',
      description: '显示邮件图标'
    }
  }
};
export default meta;
/**
 * 基础编辑态
 */
export var Basic = {
  args: {
    mode: 'edit',
    placeholder: '请输入邮箱地址'
  }
};

/**
 * 域名智能补全
 */
export var WithAutoComplete = {
  args: {
    mode: 'edit',
    enableAutoComplete: true,
    placeholder: '输入@后自动提示域名'
  }
};

/**
 * 自定义补全域名
 */
export var CustomDomains = {
  args: {
    mode: 'edit',
    enableAutoComplete: true,
    autoCompleteDomains: ['gmail.com', 'company.com', 'custom.com'],
    placeholder: '输入@查看自定义域名'
  }
};

/**
 * 只读态 - 可发邮件
 */
export var ReadMode = {
  args: {
    mode: 'read',
    value: 'support@example.com',
    enableMailto: true,
    displayAsLink: true
  }
};

/**
 * 只读态 - 带邮件图标
 */
export var ReadModeWithIcon = {
  args: {
    mode: 'read',
    value: 'support@example.com',
    enableMailto: true,
    showEmailIcon: true,
    displayAsLink: true
  }
};

/**
 * 只读态 - 域名部分隐藏
 */
export var ReadModePartialMask = {
  args: {
    mode: 'read',
    value: 'user@gmail.com',
    hideDomain: true,
    maskPattern: 'partial'
  }
};

/**
 * 只读态 - 域名完全隐藏
 */
export var ReadModeFullMask = {
  args: {
    mode: 'read',
    value: 'user@gmail.com',
    hideDomain: true,
    maskPattern: 'full'
  }
};

/**
 * 禁用态（编辑）
 */
export var DisabledEdit = {
  args: {
    mode: 'edit',
    value: 'user@example.com',
    disabled: true
  }
};

/**
 * 禁用态（只读）
 */
export var DisabledRead = {
  args: {
    mode: 'read',
    value: 'user@example.com',
    disabled: true
  }
};

/**
 * 必填校验
 */
export var Required = {
  args: {
    mode: 'edit',
    placeholder: '请输入邮箱地址（必填）',
    required: true,
    validateTrigger: 'onBlur'
  }
};

/**
 * 格式校验（实时）
 */
export var FormatValidation = {
  args: {
    mode: 'edit',
    placeholder: '请输入邮箱地址',
    validateTrigger: 'onChange'
  }
};

/**
 * 严格格式校验
 */
export var StrictValidation = {
  args: {
    mode: 'edit',
    placeholder: '请输入邮箱地址',
    strictValidation: true,
    validateTrigger: 'onBlur'
  }
};

/**
 * 白名单域名限制
 */
export var AllowedDomains = {
  args: {
    mode: 'edit',
    placeholder: '请使用公司邮箱',
    allowedDomains: ['company.com', 'partner.com'],
    errorMessage: '只允许使用公司邮箱或合作伙伴邮箱',
    validateTrigger: 'onBlur'
  }
};

/**
 * 黑名单域名限制
 */
export var BlockedDomains = {
  args: {
    mode: 'edit',
    placeholder: '请输入邮箱地址',
    blockedDomains: ['tempmail.com', '10minutemail.com'],
    errorMessage: '不支持临时邮箱',
    validateTrigger: 'onBlur'
  }
};

/**
 * 显示清空按钮
 */
export var WithClearButton = {
  args: {
    mode: 'edit',
    defaultValue: 'user@example.com',
    allowClear: true,
    placeholder: '请输入邮箱地址'
  }
};

/**
 * 自动聚焦
 */
export var WithAutoFocus = {
  args: {
    mode: 'edit',
    autoFocus: true,
    placeholder: '自动获得焦点'
  }
};

/**
 * 自定义样式（只读态）
 */
export var CustomStyle = {
  args: {
    mode: 'read',
    value: 'user@example.com',
    fontSize: 18,
    fontWeight: 600,
    linkColor: '#FF5722'
  }
};

/**
 * 脱敏模式对比
 */
export var MaskingComparison = {
  render: function render() {
    return /*#__PURE__*/React.createElement("div", {
      style: {
        display: 'flex',
        flexDirection: 'column',
        gap: '16px',
        width: '400px'
      }
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("strong", null, "\u4E0D\u8131\u654F:"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: "user@gmail.com",
      hideDomain: false
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("strong", null, "\u90E8\u5206\u9690\u85CF (u***@gmail.com):"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: "user@gmail.com",
      hideDomain: true,
      maskPattern: "partial"
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("strong", null, "\u5B8C\u5168\u9690\u85CF (user@***):"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: "user@gmail.com",
      hideDomain: true,
      maskPattern: "full"
    })));
  }
};

/**
 * 校验时机对比
 */
export var ValidateTriggerComparison = {
  render: function render() {
    return /*#__PURE__*/React.createElement("div", {
      style: {
        display: 'flex',
        flexDirection: 'column',
        gap: '20px',
        width: '400px'
      }
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h4", null, "\u8F93\u5165\u65F6\u6821\u9A8C\uFF08onChange\uFF09"), /*#__PURE__*/React.createElement(PisellEmail, {
      placeholder: "\u8F93\u5165\u65F6\u5373\u65F6\u6821\u9A8C",
      required: true,
      validateTrigger: "onChange"
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h4", null, "\u5931\u7126\u65F6\u6821\u9A8C\uFF08onBlur\uFF09"), /*#__PURE__*/React.createElement(PisellEmail, {
      placeholder: "\u5931\u7126\u540E\u6821\u9A8C",
      required: true,
      validateTrigger: "onBlur"
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h4", null, "\u4E24\u8005\u90FD\u6821\u9A8C\uFF08both\uFF09"), /*#__PURE__*/React.createElement(PisellEmail, {
      placeholder: "\u8F93\u5165\u548C\u5931\u7126\u90FD\u6821\u9A8C",
      required: true,
      validateTrigger: "both"
    })));
  }
};

/**
 * 完整功能示例
 */
export var CompleteExample = {
  render: function render() {
    var _React$useState = React.useState(''),
      _React$useState2 = _slicedToArray(_React$useState, 2),
      value = _React$useState2[0],
      setValue = _React$useState2[1];
    return /*#__PURE__*/React.createElement("div", {
      style: {
        width: '600px',
        display: 'flex',
        flexDirection: 'column',
        gap: '24px'
      }
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u7F16\u8F91\u6001 - \u5B8C\u6574\u529F\u80FD"), /*#__PURE__*/React.createElement(PisellEmail, {
      value: value,
      onChange: function onChange(val) {
        setValue(val);
        console.log('邮箱变化:', val);
      },
      placeholder: "\u8BF7\u8F93\u5165\u90AE\u7BB1\u5730\u5740",
      enableAutoComplete: true,
      autoCompleteDomains: ['gmail.com', 'qq.com', 'company.com'],
      required: true,
      validateTrigger: "both",
      allowClear: true,
      onSelect: function onSelect(email) {
        console.log('选择补全:', email);
      },
      onValidate: function onValidate(isValid, errors) {
        console.log('校验结果:', isValid, errors);
      }
    }), /*#__PURE__*/React.createElement("p", {
      style: {
        marginTop: '8px',
        color: '#667085',
        fontSize: '12px'
      }
    }, "\u5F53\u524D\u503C\uFF1A", value || '（未输入）')), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u53EA\u8BFB\u6001 - \u53EF\u53D1\u90AE\u4EF6"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: value || 'support@example.com',
      enableMailto: true,
      displayAsLink: true,
      showEmailIcon: true,
      mailtoOptions: {
        subject: '产品咨询',
        body: '您好，我想咨询关于...'
      },
      onMailto: function onMailto(email) {
        console.log('发送邮件至:', email);
      }
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u53EA\u8BFB\u6001 - \u57DF\u540D\u9690\u85CF"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: value || 'user@gmail.com',
      hideDomain: true,
      maskPattern: "partial",
      enableMailto: true
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u7981\u7528\u6001"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "edit",
      value: value || 'user@example.com',
      disabled: true
    })));
  }
};

/**
 * 域名补全演示
 */
export var AutoCompleteDemo = {
  render: function render() {
    var _React$useState3 = React.useState(''),
      _React$useState4 = _slicedToArray(_React$useState3, 2),
      value = _React$useState4[0],
      setValue = _React$useState4[1];
    return /*#__PURE__*/React.createElement("div", {
      style: {
        width: '500px'
      }
    }, /*#__PURE__*/React.createElement("h3", null, "\u57DF\u540D\u8865\u5168\u6F14\u793A"), /*#__PURE__*/React.createElement("p", {
      style: {
        color: '#667085',
        fontSize: '14px',
        marginBottom: '16px'
      }
    }, "\u8F93\u5165 @ \u540E\u4F1A\u81EA\u52A8\u663E\u793A\u5E38\u7528\u90AE\u7BB1\u57DF\u540D\u5EFA\u8BAE\uFF0C\u652F\u6301\u952E\u76D8\u4E0A\u4E0B\u952E\u9009\u62E9"), /*#__PURE__*/React.createElement(PisellEmail, {
      value: value,
      onChange: setValue,
      enableAutoComplete: true,
      placeholder: "\u8BD5\u8BD5\u8F93\u5165 user@ \u770B\u770B\u6548\u679C",
      onSelect: function onSelect(email) {
        console.log('选择了:', email);
        alert("\u9009\u62E9\u4E86: ".concat(email));
      }
    }), /*#__PURE__*/React.createElement("p", {
      style: {
        marginTop: '8px',
        color: '#667085',
        fontSize: '12px'
      }
    }, "\u5F53\u524D\u8F93\u5165\uFF1A", value || '（未输入）'));
  }
};

/**
 * mailto 功能演示
 */
export var MailtoDemo = {
  render: function render() {
    return /*#__PURE__*/React.createElement("div", {
      style: {
        display: 'flex',
        flexDirection: 'column',
        gap: '24px',
        width: '500px'
      }
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u57FA\u7840 mailto"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: "support@example.com",
      enableMailto: true,
      displayAsLink: true
    }), /*#__PURE__*/React.createElement("p", {
      style: {
        color: '#667085',
        fontSize: '12px',
        marginTop: '8px'
      }
    }, "\u70B9\u51FB\u90AE\u7BB1\u5730\u5740\u5524\u8D77\u90AE\u4EF6\u5BA2\u6237\u7AEF")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u5E26\u9884\u8BBE\u53C2\u6570\u7684 mailto"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: "sales@company.com",
      enableMailto: true,
      displayAsLink: true,
      showEmailIcon: true,
      mailtoOptions: {
        subject: '产品咨询',
        body: '您好，我想咨询关于贵公司的产品...'
      },
      onMailto: function onMailto(email) {
        console.log('发送邮件至:', email);
      }
    }), /*#__PURE__*/React.createElement("p", {
      style: {
        color: '#667085',
        fontSize: '12px',
        marginTop: '8px'
      }
    }, "\u70B9\u51FB\u540E\u90AE\u4EF6\u5BA2\u6237\u7AEF\u4F1A\u9884\u586B\u4E3B\u9898\u548C\u6B63\u6587")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u4E0D\u542F\u7528 mailto"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: "readonly@example.com",
      enableMailto: false
    }), /*#__PURE__*/React.createElement("p", {
      style: {
        color: '#667085',
        fontSize: '12px',
        marginTop: '8px'
      }
    }, "\u4EC5\u5C55\u793A\uFF0C\u4E0D\u53EF\u70B9\u51FB")));
  }
};

/**
 * 白名单/黑名单演示
 */
export var DomainRestrictionDemo = {
  render: function render() {
    return /*#__PURE__*/React.createElement("div", {
      style: {
        display: 'flex',
        flexDirection: 'column',
        gap: '24px',
        width: '500px'
      }
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u767D\u540D\u5355\u9650\u5236\uFF08\u4EC5\u5141\u8BB8\u516C\u53F8\u90AE\u7BB1\uFF09"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "edit",
      placeholder: "\u8BF7\u4F7F\u7528\u516C\u53F8\u90AE\u7BB1",
      allowedDomains: ['company.com', 'partner.com'],
      validateTrigger: "onBlur",
      defaultValue: ""
    }), /*#__PURE__*/React.createElement("p", {
      style: {
        color: '#667085',
        fontSize: '12px',
        marginTop: '8px'
      }
    }, "\u53EA\u5141\u8BB8 @company.com \u6216 @partner.com")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u9ED1\u540D\u5355\u9650\u5236\uFF08\u7981\u6B62\u4E34\u65F6\u90AE\u7BB1\uFF09"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "edit",
      placeholder: "\u8BF7\u8F93\u5165\u90AE\u7BB1\u5730\u5740",
      blockedDomains: ['tempmail.com', '10minutemail.com', 'guerrillamail.com'],
      errorMessage: "\u4E0D\u652F\u6301\u4E34\u65F6\u90AE\u7BB1",
      validateTrigger: "onBlur",
      defaultValue: ""
    }), /*#__PURE__*/React.createElement("p", {
      style: {
        color: '#667085',
        fontSize: '12px',
        marginTop: '8px'
      }
    }, "\u7981\u6B62\u4F7F\u7528\u4E34\u65F6\u90AE\u7BB1\u57DF\u540D")));
  }
};

/**
 * 所有状态展示
 */
export var AllStates = {
  render: function render() {
    return /*#__PURE__*/React.createElement("div", {
      style: {
        display: 'flex',
        flexDirection: 'column',
        gap: '24px',
        width: '500px'
      }
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u7F16\u8F91\u6001"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "edit",
      defaultValue: "user@example.com",
      placeholder: "\u8BF7\u8F93\u5165\u90AE\u7BB1\u5730\u5740",
      allowClear: true
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u53EA\u8BFB\u6001"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: "user@example.com",
      enableMailto: true,
      displayAsLink: true
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u7981\u7528\u6001\uFF08\u7F16\u8F91\uFF09"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "edit",
      value: "user@example.com",
      disabled: true
    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", null, "\u7981\u7528\u6001\uFF08\u53EA\u8BFB\uFF09"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: "user@example.com",
      disabled: true
    })));
  }
};

/**
 * 完整交互示例
 */
export var InteractiveExample = {
  render: function render() {
    var _React$useState5 = React.useState(''),
      _React$useState6 = _slicedToArray(_React$useState5, 2),
      email = _React$useState6[0],
      setEmail = _React$useState6[1];
    var _React$useState7 = React.useState(true),
      _React$useState8 = _slicedToArray(_React$useState7, 2),
      isValid = _React$useState8[0],
      setIsValid = _React$useState8[1];
    var _React$useState9 = React.useState([]),
      _React$useState10 = _slicedToArray(_React$useState9, 2),
      errors = _React$useState10[0],
      setErrors = _React$useState10[1];
    return /*#__PURE__*/React.createElement("div", {
      style: {
        width: '600px'
      }
    }, /*#__PURE__*/React.createElement("h2", null, "PisellEmail \u5B8C\u6574\u529F\u80FD\u6F14\u793A"), /*#__PURE__*/React.createElement("div", {
      style: {
        marginTop: '24px'
      }
    }, /*#__PURE__*/React.createElement("h3", null, "\u7F16\u8F91\u6001 - \u57DF\u540D\u8865\u5168 + \u683C\u5F0F\u6821\u9A8C"), /*#__PURE__*/React.createElement(PisellEmail, {
      value: email,
      onChange: setEmail,
      placeholder: "\u8BD5\u8BD5\u8F93\u5165 user@ \u770B\u770B\u57DF\u540D\u8865\u5168\u6548\u679C",
      enableAutoComplete: true,
      autoCompleteDomains: ['gmail.com', 'qq.com', '163.com', 'company.com'],
      required: true,
      validateTrigger: "both",
      allowClear: true,
      onSelect: function onSelect(val) {
        console.log('选择了补全建议:', val);
      },
      onValidate: function onValidate(valid, errs) {
        setIsValid(valid);
        setErrors(errs);
        console.log('校验结果:', {
          valid: valid,
          errs: errs
        });
      },
      onBlur: function onBlur(val) {
        console.log('失焦，当前值:', val);
      }
    }), /*#__PURE__*/React.createElement("div", {
      style: {
        marginTop: '16px',
        padding: '12px',
        background: '#f5f5f5',
        borderRadius: '4px'
      }
    }, /*#__PURE__*/React.createElement("p", {
      style: {
        margin: '4px 0',
        fontSize: '14px'
      }
    }, /*#__PURE__*/React.createElement("strong", null, "\u5F53\u524D\u503C:"), " ", email || '（未输入）'), /*#__PURE__*/React.createElement("p", {
      style: {
        margin: '4px 0',
        fontSize: '14px'
      }
    }, /*#__PURE__*/React.createElement("strong", null, "\u6821\u9A8C\u72B6\u6001:"), " ", isValid ? '✅ 通过' : '❌ 未通过'), !isValid && errors.length > 0 && /*#__PURE__*/React.createElement("p", {
      style: {
        margin: '4px 0',
        fontSize: '14px',
        color: '#ff4d4f'
      }
    }, /*#__PURE__*/React.createElement("strong", null, "\u9519\u8BEF\u4FE1\u606F:"), " ", errors.join(', ')))), /*#__PURE__*/React.createElement("div", {
      style: {
        marginTop: '32px'
      }
    }, /*#__PURE__*/React.createElement("h3", null, "\u53EA\u8BFB\u6001 - mailto \u53D1\u9001"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: email || 'support@example.com',
      enableMailto: true,
      displayAsLink: true,
      showEmailIcon: true,
      mailtoOptions: {
        subject: '来自 Pisell 的咨询',
        body: "\u60A8\u597D\uFF0C\n\n\u6211\u60F3\u54A8\u8BE2\u5173\u4E8E...\n\n\u53D1\u4EF6\u4EBA: ".concat(email || 'support@example.com')
      },
      onMailto: function onMailto(val) {
        console.log('准备发送邮件至:', val);
        alert("\u51C6\u5907\u53D1\u9001\u90AE\u4EF6\u81F3: ".concat(val));
      }
    }), /*#__PURE__*/React.createElement("p", {
      style: {
        color: '#667085',
        fontSize: '12px',
        marginTop: '8px'
      }
    }, "\u70B9\u51FB\u90AE\u7BB1\u5730\u5740\u6216\u56FE\u6807\u5524\u8D77\u90AE\u4EF6\u5BA2\u6237\u7AEF")), /*#__PURE__*/React.createElement("div", {
      style: {
        marginTop: '32px'
      }
    }, /*#__PURE__*/React.createElement("h3", null, "\u53EA\u8BFB\u6001 - \u57DF\u540D\u9690\u85CF"), /*#__PURE__*/React.createElement("div", {
      style: {
        display: 'flex',
        gap: '24px'
      }
    }, /*#__PURE__*/React.createElement("div", {
      style: {
        flex: 1
      }
    }, /*#__PURE__*/React.createElement("p", {
      style: {
        fontSize: '14px',
        marginBottom: '8px'
      }
    }, "\u90E8\u5206\u9690\u85CF:"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: email || 'user@gmail.com',
      hideDomain: true,
      maskPattern: "partial"
    })), /*#__PURE__*/React.createElement("div", {
      style: {
        flex: 1
      }
    }, /*#__PURE__*/React.createElement("p", {
      style: {
        fontSize: '14px',
        marginBottom: '8px'
      }
    }, "\u5B8C\u5168\u9690\u85CF:"), /*#__PURE__*/React.createElement(PisellEmail, {
      mode: "read",
      value: email || 'user@gmail.com',
      hideDomain: true,
      maskPattern: "full"
    })))));
  }
};