@alifd/chat 0.3.61 → 0.3.62

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/dist/docs/ai-loading/main.js +1 -1
  2. package/dist/docs/balloon/main.js +1 -1
  3. package/dist/docs/button/main.js +1 -1
  4. package/dist/docs/card/main.js +1 -1
  5. package/dist/docs/card-loading/main.js +1 -1
  6. package/dist/docs/checkbox/main.js +1 -1
  7. package/dist/docs/checkbox-group/main.js +1 -1
  8. package/dist/docs/code-view/main.js +1 -1
  9. package/dist/docs/collapse/main.js +1 -1
  10. package/dist/docs/date-picker/main.js +1 -1
  11. package/dist/docs/document/main.js +1 -1
  12. package/dist/docs/drawer/main.js +1 -1
  13. package/dist/docs/error-notice/main.js +1 -1
  14. package/dist/docs/feedback/main.js +1 -1
  15. package/dist/docs/flip/main.js +1 -1
  16. package/dist/docs/float-button/main.js +1 -1
  17. package/dist/docs/form/main.js +1 -1
  18. package/dist/docs/html-render/main.js +1 -1
  19. package/dist/docs/icon/main.js +1 -1
  20. package/dist/docs/image-preview/main.js +1 -1
  21. package/dist/docs/img/main.js +1 -1
  22. package/dist/docs/input/main.js +1 -1
  23. package/dist/docs/list/main.js +1 -1
  24. package/dist/docs/loading/main.js +1 -1
  25. package/dist/docs/markdown/main.js +1 -1
  26. package/dist/docs/mermaid-view/main.js +1 -1
  27. package/dist/docs/message/main.js +1 -1
  28. package/dist/docs/origin/main.js +1 -1
  29. package/dist/docs/person-picker/main.js +1 -1
  30. package/dist/docs/radio/main.js +1 -1
  31. package/dist/docs/radio-group/main.js +1 -1
  32. package/dist/docs/recommend/main.js +1 -1
  33. package/dist/docs/reference/main.js +1 -1
  34. package/dist/docs/rich-text-input/main.js +1 -1
  35. package/dist/docs/select/main.js +1 -1
  36. package/dist/docs/step/main.js +1 -1
  37. package/dist/docs/stop-generate/main.js +1 -1
  38. package/dist/docs/table/main.js +1 -1
  39. package/dist/docs/tag/main.js +1 -1
  40. package/dist/docs/text/main.js +1 -1
  41. package/dist/docs/time-picker/main.js +1 -1
  42. package/dist/docs/tool-status/main.js +1 -1
  43. package/es/index.js +1 -1
  44. package/es/markdown/index.js +3 -2
  45. package/lib/index.js +1 -1
  46. package/lib/markdown/index.js +3 -2
  47. package/package.json +1 -1
package/dist/docs/button/main.js CHANGED
@@ -133,4 +133,4 @@ ${t.map(e=>{let{variableName:t,uniqueLocalName:n}=e;return` reactHotLoader.regi
133
133
  \`\`\`
134
134
  ${l}
135
135
  \`\`\`
136
- 如何解决这个问题？如果你能提供修复方案，请保持简洁。`;i&&i(e)}},children:"使用对话修复"})})]})})}):(0,e3.jsx)("div",{className:"ct-mermaid-view-content",children:(0,e3.jsx)("div",{ref:a,className:"ct-mermaid-view-chart"})}),d&&(0,e3.jsx)("div",{className:"ct-mermaid-view-loading",children:(0,e3.jsx)(E4,{size:"medium"})})]})});Bc.displayName="MermaidView";let Bu=p8.config(Bc),Bd=[{emotionVersion:"75",emotionId:"emotion_180001",dynamicEmotionId:"",showType:1,skinList:[],name:"[魔法棒]",names:{en_US:"[Magic Wand]",ja_JP:"[魔棒]",vi_VN:"[đũa ph\xe9p]",zh_CN:"[魔法棒]",zh_HK:"[魔法棒]",zh_TW:"[魔法棒]"},url:"https://img.alicdn.com/imgextra/i4/O1CN01a4VODa1vAyAFlqg4H_!!6000000006133-2-tps-96-96.png",staticURL:"https://img.alicdn.com/imgextra/i4/O1CN01a4VODa1vAyAFlqg4H_!!6000000006133-2-tps-96-96.png",fallbacks:[]}],Bp="",Bm=["img","code","pre","link-reference","link-reference-group"],Bh=["link-reference-group"],Bf=RG((0,e5.forwardRef)(e=>{let{className:t,onReady:n,content:o,needCodeHeader:i=!0,theme:a="light",enableSourcePos:s=!1,sendTextMessage:l,...u}=e,[d,p]=(0,e5.useState)([]);function m(e,t){let n;if(!e)return[];let o=[...Bm,...t||[]],i=/\[[^\]]*\]\([^)]*\)/g,a=o.length>0?RegExp(`<(${o.join("|")}).*?>.*?<\\/\\1>`,"gs"):null,s=[],l=0,u=[];for(;null!==(n=i.exec(e));)u.push({start:n.index,end:n.index+n[0].length,content:n[0]});if(a)for(a.lastIndex=0;null!==(n=a.exec(e));)u.push({start:n.index,end:n.index+n[0].length,content:n[0]});for(let t of(u.sort((e,t)=>e.start-t.start),u))t.start>l&&s.push(...e.substring(l,t.start).split("")),s.push(t.content),l=t.end;return l<e.length&&s.push(...e.substring(l).split("")),s}(0,e5.useEffect)(()=>{Y7(),Be().then(e=>{p(()=>[...Bd,...e])}),null==n||n()},[n]);let h=(0,e5.useRef)(null),[f,_]=(0,e5.useState)(()=>(null==u?void 0:u.typewriterEffect)?Bp:o),[g,y]=(0,e5.useState)(()=>(null==u?void 0:u.typewriterEffect)?m(o,u.whitelistTags):[]),[b,E]=(0,e5.useState)(0),S=(0,e5.useRef)(null),T=()=>{S.current&&(clearTimeout(S.current),S.current=null)};(0,e5.useEffect)(()=>{if(T(),!(null==u?void 0:u.typewriterEffect)){_(o),y([]);return}let e=m(o,u.whitelistTags);if(b>=e.length)_(o),E(e.length),y([]);else{let t=e.slice(0,b),n=e.slice(b);_(t.join("")),y(n)}},[o,null==u?void 0:u.typewriterEffect,null==u?void 0:u.whitelistTags]),(0,e5.useEffect)(()=>{if(!(null==u?void 0:u.typewriterEffect)||0===g.length)return void T();let e=Math.max(Math.floor(g.length/10),2),t=()=>{y(t=>{if(0===t.length)return t;let n=t.slice(0,e),o=t.slice(e);return _(e=>e+n.join("")),E(t=>t+e),o})};return T(),t(),S.current=setTimeout(()=>{let e=()=>{t(),S.current=setTimeout(e,50)};e()},50),T},[g.length,null==u?void 0:u.typewriterEffect]);let C=(0,e5.useMemo)(()=>{Bp=f;let e={common_hypertitle_text_style__font_size:"h1",common_largetitle_text_style__font_size:"h1",common_h1_text_style__font_size:"h1",common_h2_text_style__font_size:"h2",common_h3_text_style__font_size:"h3",common_h4_text_style__font_size:"h4",common_h5_text_style__font_size:"h5",common_body_text_style__font_size:"span",common_footnote_text_style__font_size:"span"};return f.replace(/<font\s+([^>]+)>([^<]+)<\/font>/g,(t,n,o)=>{let i="",a="",s="",l=n.match(/sizeToken=([\w_]+)/),u=n.match(/colorTokenV2=([\w_]+)/),d=n.match(/color=([\w_]+)/),p=n.match(/color=(?:"|')?(#[0-9a-fA-F]{3,8})(?:"|')?/);l&&(i=l[1].replace(/-/g,"_")),u&&(a=u[1].replace(/-/g,"_")),!a&&d&&(a=d[1].replace(/-/g,"_")),!a&&p&&(s=p[1]);let m=[];i&&m.push(`font-size: var(--${i})`),a?m.push(`color: var(--${a})`):s&&m.push(`color: ${s}`);let h=m.join("; "),f=e[i]||"span";return`<${f} style="${h}" class="markdownFont">${o}</${f}>`})},[f]),k=(0,e5.useMemo)(()=>Bt(C,{genFrame:(e,t)=>({htmlTag:"img",selfClose:!0,attr:{draggable:"false",style:"vertical-align: text-center; display: inline-block; pointer-events: none;",class:"emoji",title:`[${e}]`,src:t.url||t.staticURL||"",alt:e}}),emotionList:d}),[C,d]),x=(0,e5.useMemo)(()=>{let e=new Fp({html:!0,xhtmlOut:!0,breaks:!0,langPrefix:"language-",linkify:!0,typographer:!0,highlight:(e,t)=>{if(t&&(null==Br?void 0:Br.getLanguage(t)))try{return null==Br?void 0:Br.highlight(t,e,!0).value}catch(e){}return""}});if(s&&e.use(e=>{e.core.ruler.push("add_source_pos",e=>{e.tokens.forEach(e=>{if(e.map){let[t,n]=e.map;e.attrSet("data-source-start-line",String(t)),e.attrSet("data-source-end-line",String(n))}})})}),e.linkify.add("dingtalk:",{validate:/^[^\s]+/,normalize:e=>{e.url=e.raw}}),e.linkify.add("dtmd:",{validate:/^[^\s]+/,normalize:e=>{e.url=e.raw}}),k=(k=(k=k.replace(/&#x2F;/g,"/")).replace(/&#39;/g,"'")).replace(/(!\[[^\]]*\]\((\/\/[^\s)]+)\))/g,(e,t,n)=>e.replace(n,`https:${n}`)),!i)return{html:e.render(k),codeBlocks:[]};let t=[],n=0;return e.renderer.rules.fence=(e,o)=>{let i=e[o],a=i.info.trim()||"plaintext",s=i.content,l=`code-block-${n++}`,u=!0,d=i.map;d&&(k.split("\n")[d[1]-1].trim().endsWith("```")||(u=!1));let p="mermaid"===a?"mermaid":"code";return t.push({language:a,code:s,id:l,isComplete:u}),`<div data-code-block-id="${l}" data-block-type="${p}"></div>`},{html:(e=>{let t=e;try{Bh.forEach(e=>{t=t.replace(RegExp(`<${e}[^>]*\\/>`,"g"),`<${e} ...></${e}>`)})}catch(e){}return t})(e.render(k)),codeBlocks:t}},[k,i,s]),w=(null==u?void 0:u.generating)?"ct-markdown generating":"ct-markdown";return(0,e3.jsxs)("div",{ref:h,className:uB()(w,`ct-hljs-${a}`,t),children:[(()=>{if(!i||0===x.codeBlocks.length)return(0,e3.jsx)(Lr,{...u,children:x.html});let e=x.html.split(/(<div[^>]*data-code-block-id="[^"]*"[^>]*><\/div>)/),t=[],n=0;for(let o of e)if(o.includes("data-code-block-id")){let e=x.codeBlocks[n];e&&("mermaid"===e.language?t.push((0,e3.jsxs)("div",{children:[e.isComplete&&(0,e3.jsx)(Bu,{code:e.code,showCopyButton:!1,theme:a,sendTextMessage:l}),(0,e3.jsx)(Bi,{code:e.code,language:e.language,showCopyButton:!0,theme:a},e.id)]},e.id)):t.push((0,e3.jsx)(Bi,{code:e.code,language:e.language,showCopyButton:!0,theme:a},e.id)),n++)}else o.trim()&&t.push((0,e3.jsx)(Lr,{...u,children:o},`html-${t.length}`));return(0,e3.jsx)(e3.Fragment,{children:t})})(),(()=>{let{generating:e}=u||{};return!e||x.html?null:(0,e3.jsx)("img",{width:20,height:10,src:"https://img.alicdn.com/imgextra/i1/O1CN01wdlADU1WCvOLNSB3w_!!6000000002753-1-tps-530-255.gif",alt:""})})()]})}),{displayName:"Markdown"}),B_=p8.config(Bf),Bg=RG((0,e5.forwardRef)((e,t)=>{let{className:n}=e;return(0,e3.jsx)("div",{className:uB()("ct-card-loading",n),children:"卡片加载中"})}),{displayName:"CardLoading"}),By=p8.config(Bg),Bb=RG((0,e5.forwardRef)((e,t)=>{let{className:n,text:o}=e;return(0,e3.jsx)("div",{className:uB()("ct-origin",n),children:(0,e3.jsx)("div",{className:"origin-tip-inner",children:o})})}),{displayName:"Origin"}),Bv=p8.config(Bb),BE=RG((0,e5.forwardRef)((e,t)=>{let{className:n,indicator:o,shape:i="default",size:a="large",...s}=e,l={...s,size:a};if(!o&&i&&"default"!==i){let e=`load-container ${i}`;l.indicator=(0,e3.jsx)("div",{className:e,children:(0,e3.jsx)("div",{className:"loader"})})}return(0,e3.jsx)(E4,{...l,ref:t,className:uB()(`ct-loading ${a} ${i}`,n)})}),{displayName:"Loading"}),BS=p8.config(BE),BT=RG((0,e5.forwardRef)((e,t)=>{let{className:n,headerStyle:o,children:i,footer:a,footerClassName:s,placement:l,...u}=e;return(0,e3.jsxs)(vj,{...u,v2:!0,ref:t,placement:l,headerStyle:{"border-bottom:":"1px solid var(--40gmM)",...o},className:uB()(`ct-drawer ${l}`,n),children:[i,a&&a.length&&(0,e3.jsx)("div",{className:uB()("draw-footer",s),children:a})]})}),{displayName:"Drawer"}),BC=p8.config(BT),Bk=RG((0,e5.forwardRef)((e,t)=>{let{className:n,shape:o="dot",showStatus:i=!0,current:a=0,stepsList:s=[],defaultCollapsed:l=!1,collapsedSteps:u=1,collapsedMore:d=(0,e3.jsxs)("div",{children:["查看更多",(0,e3.jsx)(h2,{type:"arrow-down",size:"xxs",style:{marginLeft:2}})]}),size:p="large",...m}=e,[h,f]=(0,e5.useState)([]),[_,g]=(0,e5.useState)(l);return((0,e5.useEffect)(()=>{f(s.map((e,t)=>_&&u<t+1?null:(0,e3.jsx)(TK.Item,{title:e.title,content:e.content,status:i?void 0:"wait"},t)))},[_,u,s]),0===s.length)?null:(0,e3.jsx)("div",{className:uB()("ct-step",`ct-step-${p}`,n,_&&"ct-step-collapsed"),...m,ref:t,children:(0,e3.jsxs)(e3.Fragment,{children:[(0,e3.jsx)(TK,{current:a,shape:o,labelPlacement:"hoz",direction:"ver",readOnly:!0,children:h}),_&&s.length>u&&(0,e3.jsx)("div",{className:"ct-step-collapsed-more",onClick:()=>g(!_),children:(0,e3.jsx)("div",{className:"ct-step-collapsed-more-content",children:d})})]})})}),{displayName:"Step"}),Bx=p8.config(Bk);var Bw=((eC={}).Generating="generating",eC.Stopped="stopped",eC);let BN="停止生成",BD=RG((0,e5.forwardRef)((e,t)=>{let{className:n,show:o=!0,status:i=Bw.Generating,stopText:a=BN,stopIcon:s,stoppedText:l,onStop:u}=e;return o?(0,e3.jsxs)("div",{className:uB()("ct-stop-generate",n),children:[i===Bw.Generating&&(0,e3.jsxs)("div",{className:"stop-generate-area",onClick:()=>{u&&u()},children:[(0,e3.jsx)("img",{src:s||"https://img.alicdn.com/imgextra/i2/O1CN01hpxNXz26hRw9Jz4O1_!!6000000007693-55-tps-200-200.svg"}),a||BN]}),i===Bw.Stopped&&(0,e3.jsx)("div",{className:"stopped-generate-text",children:l||"已停止生成"})]}):null}),{displayName:"StopGenerate"}),BO=p8.config(BD),BM=(0,e5.forwardRef)((e,t)=>{let{className:n,defaultExpanded:o=!1,header:i,listItems:a=[],onExpandedClick:s,onItemClick:l,mode:u="simple",onHeaderClose:d,onHeaderClick:p,onContentClick:m,expanded:h}=e,[f,_]=(0,e5.useState)(h||o);(0,e5.useEffect)(()=>{void 0!==h&&h!==f&&_(h)},[h]);let g=(e,t,n)=>{if(n.stopPropagation(),l){null==l||l(e,t);return}(null==e?void 0:e.url)&&window.open(null==e?void 0:e.url,"_blank")},y=f?"expand":"";return(0,e3.jsxs)("div",{className:uB()(`ct-reference ${u} ${y}`,n),ref:t,children:[(()=>{if(!1===i)return null;if("detail"===u){if(!1===i)return null;let e=(null==i?void 0:i.icon)||"close",t=(null==i?void 0:i.title)||"引用信息";return(0,e3.jsxs)("div",{className:`reference-header ${u}`,children:[(0,e3.jsx)("div",{className:"reference-text",children:t}),(0,e3.jsx)("div",{className:"reference-close",onClick:()=>{null==d||d()},children:RX(e,"xs")})]})}let e=(null==i?void 0:i.icon)||"https://img.alicdn.com/imgextra/i3/O1CN01hpxNXz26hRw9Jz4O1_!!6000000007693-55-tps-200-200.svg";return(0,e3.jsxs)("div",{className:`reference-header ${u}`,onClick:e=>{(e.stopPropagation(),p)?p(!f):_(!f)},children:[(0,e3.jsxs)("div",{className:"reference-name",children:[RX(e),(0,e3.jsx)("div",{className:"reference-title",children:null==i?void 0:i.title})]}),(0,e3.jsx)("div",{className:"reference-operate",onClick:e=>{(e.stopPropagation(),s)?s(!f):_(!f)},children:(0,e3.jsx)(RJ,{type:f?"arrow-up":"arrow-down",size:"xs"})})]})})(),a&&0!==a.length&&(f||"simple"!==u)?(0,e3.jsxs)("div",{className:`reference-list ${u}`,onClick:e=>{e.stopPropagation(),null==m||m(f)},children:[f&&"simple"===u&&a.map((e,t)=>(0,e3.jsxs)("div",{className:"reference-item",children:[(0,e3.jsx)("span",{className:"reference-item-index",children:t+1}),(null==e?void 0:e.sourceIcon)&&RX(null==e?void 0:e.sourceIcon),(0,e3.jsx)("div",{className:"reference-text",onClick:n=>g(e,t,n),children:null==e?void 0:e.name}),(null==e?void 0:e.modifyTime)&&!1]},t)),"detail"===u&&a.map((e,t)=>(0,e3.jsxs)("div",{className:"reference-item",onClick:n=>g(e,t,n),children:[(0,e3.jsxs)("div",{className:"reference-title",children:[(0,e3.jsxs)("div",{className:"reference-name",children:[(0,e3.jsx)("span",{className:"reference-item-index",children:t+1}),(null==e?void 0:e.sourceIcon)&&RX(null==e?void 0:e.sourceIcon),(0,e3.jsx)("span",{children:null==e?void 0:e.name})]}),(null==e?void 0:e.modifyTime)&&!1]}),(null==e?void 0:e.content)&&(0,e3.jsx)("div",{className:"reference-content",children:null==e?void 0:e.content})]},t))]}):null]})}),BR=p8.config(BM),BA=(0,e5.forwardRef)((e,t)=>{let{className:n,defaultExpanded:o=!1,header:i=(0,e3.jsxs)("div",{children:["相关问题",(0,e3.jsx)(h2,{type:"arrow-right",size:"xxs",style:{marginLeft:2}})]}),expanded:a,recommendList:s=[],onToggle:l,onItemClick:u}=e,[d,p]=(0,e5.useState)(o),m=void 0!==a?a:d;return(0,e3.jsxs)("div",{className:uB()("ct-recommend",n),ref:t,children:[(0,e3.jsx)("div",{className:"recommend-header",onClick:()=>{void 0===a&&p(!m),null==l||l(!m)},children:i}),(0,e3.jsx)(hk.CSSTransition,{in:m,timeout:{enter:0,exit:400},classNames:"recommend-list",unmountOnExit:!0,children:(0,e3.jsx)("div",{className:"recommend-list",children:s.map((e,t)=>(0,e3.jsx)("div",{className:"recommend-container",children:(0,e3.jsx)(hk.CSSTransition,{in:m,timeout:{enter:100*t,exit:0},classNames:"recommend-item",unmountOnExit:!0,appear:!0,children:(0,e3.jsx)("div",{className:"recommend-item",onClick:()=>{null==u||u(e,t)},children:e.title||e.name||e.text})},t)}))})})]})}),BI=p8.config(BA),BL=(0,e5.forwardRef)((e,t)=>{let{className:n,header:o,footer:i,position:a="bottom",value:s,onChange:l,onFocus:u,onBlur:d,onKeyDown:p,enableQuerySug:m,querySugList:h,onQuerySugClick:f}=e,[_,g]=(0,e5.useState)(!1),y=m&&_&&h&&h.length>0;return(0,e3.jsxs)("div",{ref:t,className:uB()("ct-rich-text-input",n),children:[(0,e3.jsx)("div",{className:"header",children:o}),(0,e3.jsxs)("div",{className:uB()("input-container",{focus:_}),children:[(0,e3.jsx)("div",{className:"rich-text-input",contentEditable:!0,onFocus:e=>{g(!0),null==u||u(e)},onBlur:e=>{g(!1),null==d||d(e)},onChange:e=>{null==l||l(e.target.innerText)}}),(0,e3.jsx)("div",{className:"input-footer",children:i}),(0,e3.jsx)(hk.CSSTransition,{in:y,timeout:300,classNames:"query-sug",unmountOnExit:!0,children:(0,e3.jsx)("div",{className:uB()("query-sug",a),children:(0,e3.jsx)("div",{className:"query-sug-list",children:null==h?void 0:h.map((e,t)=>(0,e3.jsx)("div",{className:"query-sug-item",onClick:()=>{null==f||f(e,t)},children:e.label},e.value))})})})]})]})}),BP=(0,e5.forwardRef)((e,t)=>{let{className:n}=e;return(0,e3.jsx)("div",{className:uB()(n,"ct-ai-loading"),ref:t,children:(0,e3.jsxs)("div",{className:uB()("loading-container","short-container"),children:[(0,e3.jsx)("div",{className:uB()("short-bar","short-to-long"),style:{animationDelay:"0s"}}),(0,e3.jsx)("div",{className:uB()("short-bar","short-to-long"),style:{animationDelay:"1s"}}),(0,e3.jsx)("div",{className:uB()("short-bar","short-to-long"),style:{animationDelay:"2s"}})]})})}),BF=p8.config(BP),BY=()=>(0,e3.jsx)("div",{className:"radio-item-icon",children:(0,e3.jsx)("div",{className:"radio-item-circle"})}),BB=RG((0,e5.forwardRef)(e=>{let{options:t,value:n,disabled:o,onChange:i,className:a,style:s,...l}=e;return t&&0!==t.length?(0,e3.jsx)("div",{className:uB()("ct-radio",{"ct-radio-disabled":o},a),style:s,...l,children:t.map(e=>(0,e3.jsx)("div",{className:uB()("radio-item",{active:e.value===n,disabled:o||e.disabled}),onClick:()=>{var t;return t=e.value,void(!o&&!e.disabled&&i&&i(t))},onKeyDown:t=>{var n;return n=e.value,void(!o&&!e.disabled&&("Enter"===t.key||" "===t.key)&&(t.preventDefault(),i&&i(n)))},role:"radio",tabIndex:o||e.disabled?-1:0,"aria-checked":e.value===n,"aria-disabled":o||e.disabled,children:(0,e3.jsxs)("div",{className:"radio-item-content",children:[(0,e3.jsx)("div",{className:"radio-item-icon-column",children:(0,e3.jsx)(BY,{})}),(0,e3.jsx)("div",{className:"radio-item-image-column",children:e.image&&(0,e3.jsx)("div",{className:"radio-item-image",children:(0,e3.jsx)("img",{src:e.image,alt:"",className:"radio-item-image-inner"})})}),(0,e3.jsxs)("div",{className:"radio-item-text-column",children:[(0,e3.jsx)("div",{className:"radio-item-title",children:e.label}),e.description&&(0,e3.jsx)("div",{className:"radio-item-desc",children:e.description})]})]})},e.value))}):null}),{displayName:"Radio"}),Bj=p8.config(BB),BU=RG((0,e5.forwardRef)(e=>{if(!e.options||0===e.options.length)return null;let[t,n]=(0,e5.useState)(e.value||"");e4().useEffect(()=>{void 0!==e.value&&n(e.value)},[e.value]);let o=!!t,i=e.disabled;return(0,e3.jsxs)("div",{className:`ct-radio-group ct-radio-group-list ${i?"ct-radio-group-disabled":""}`,children:[(0,e3.jsx)(Bj,{options:e.options,value:t,onChange:t=>{!e.disabled&&(n(t),e.onChange&&e.onChange(t))},disabled:i}),(0,e3.jsx)(R3,{type:"primary",className:"confirm-button",size:"medium",disabled:!o||e.disabled,onClick:()=>{!e.disabled&&t&&e.onConfirm&&e.onConfirm(t)},children:e.confirmButtonText||"确 认"})]})}),{displayName:"RadioGroup"}),Bz=p8.config(BU),BV=RG((0,e5.forwardRef)(e=>{let{options:t,value:n,disabled:o,onChange:i,className:a,style:s,...l}=e;return t&&0!==t.length?(0,e3.jsx)("div",{className:uB()("ct-checkbox",{"ct-checkbox-disabled":o},a),style:s,...l,children:t.map(e=>{let t=(n||[]).indexOf(e.value)>-1;return(0,e3.jsx)("div",{className:uB()("checkbox-item",{active:t,disabled:o||e.disabled}),onClick:()=>((e,t)=>{if(o||t.disabled)return;let a=n||[],s=a.indexOf(e)>-1?a.filter(t=>t!==e):[...a,e];i&&i(s)})(e.value,e),children:(0,e3.jsxs)("div",{className:"checkbox-item-content",children:[(0,e3.jsx)("div",{className:"checkbox-item-checkbox-column",children:(0,e3.jsx)(f7,{className:"checkbox-item-checkbox",checked:t,disabled:o||e.disabled})}),(0,e3.jsx)("div",{className:"checkbox-item-image-column",children:e.image&&(0,e3.jsx)("div",{className:"checkbox-item-image",children:(0,e3.jsx)("img",{src:e.image,alt:"",className:"checkbox-item-image-inner"})})}),(0,e3.jsxs)("div",{className:"checkbox-item-text-column",children:[(0,e3.jsx)("div",{className:"checkbox-item-title",children:e.label}),e.description&&(0,e3.jsx)("div",{className:"checkbox-item-desc",children:e.description})]})]})},e.value)})}):null}),{displayName:"Checkbox"}),BH=p8.config(BV),BG=RG((0,e5.forwardRef)(e=>{if(!e.options||0===e.options.length)return null;let[t,n]=(0,e5.useState)(e.value||[]);e4().useEffect(()=>{void 0!==e.value&&n(e.value)},[e.value]);let o=t.length>0,i=e.disabled;return(0,e3.jsxs)("div",{className:`ct-checkbox-group ct-checkbox-group-list ${i?"ct-checkbox-group-disabled":""}`,children:[(0,e3.jsx)(BH,{options:e.options,value:t,onChange:t=>{!e.disabled&&(n(t),e.onChange&&e.onChange(t))},disabled:i}),(0,e3.jsx)(R3,{type:"primary",className:"confirm-button",size:"medium",disabled:!o||e.disabled,onClick:()=>{!e.disabled&&t.length>0&&e.onConfirm&&e.onConfirm(t)},children:e.confirmButtonText||"确 认"})]})}),{displayName:"CheckboxGroup"}),BW=p8.config(BG),BK=AF(e=>{let{className:t,dataSource:n,mode:o="single",buttonCols:i=2,value:a,size:s="medium",onChange:l}=e,[u,d]=(0,e5.useState)(a),p=Array.from({length:Math.ceil(((null==n?void 0:n.length)||0)/i)},(e,t)=>{let a=t*i,p=Math.min(a+i,(null==n?void 0:n.length)||0),m=null==n?void 0:n.slice(a,p);return(null==m?void 0:m.length)?(0,e3.jsx)("div",{className:"select-row-container",children:m&&m.length?m.map((e,t)=>{if(!e)return null;let{value:n,label:a,disabled:p}=e,m="normal";"string"==typeof u&&u===n||Array.isArray(u)&&u.includes(n)?m="selected":"object"==typeof u&&"value"in u&&u.value===n&&(m="selected");let h=p;return u&&"single"===o&&"normal"===m&&(h=!0),(0,e3.jsx)(_R,{onClick:()=>((e,t)=>{if("multiple"===o)if(Array.isArray(u)){let n="normal"===t?[...u,null==e?void 0:e.value]:u.filter(t=>t!==(null==e?void 0:e.value));d(n),null==l||l(n,"itemClick")}else{let t=[null==e?void 0:e.value];d(t),null==l||l(t,"itemClick")}if("single"===o){let n="normal"===t?e:void 0;d(n),null==l||l(n,"itemClick")}})(e,m),type:"normal",disabled:h,className:`select-item ${m} row${i}`,size:s,children:a},`select_${t}`)}):null},`row_${t}`):null});return(0,e3.jsx)("div",{className:uB()("ct-select",t),children:p})},{coverStyle:!1,labelLayout:"vertical",enableHoverState:!1}),Bq=AF((0,e5.forwardRef)((e,t)=>{let{className:n,size:o="medium",mode:i="single",onChange:a,...s}=e;return(0,e3.jsx)(gU,{...s,className:uB()("ct-select",n),size:o,ref:t,mode:i,onChange:a})})),B$=RG((0,e5.forwardRef)((e,t)=>{let{className:n,display:o="select",buttonCols:i=2,dataSource:a,mode:s="single",onChange:l,...u}=e;return"button"===((null==a?void 0:a.length)&&(null==a?void 0:a.length)>6?"select":o)?(0,e3.jsx)(BK,{className:n,dataSource:a,mode:s,buttonCols:i,value:u.value,onChange:l,label:u.label,required:u.required,size:"medium"}):(0,e3.jsx)(Bq,{...u,className:uB()("ct-select",n),dataSource:a,ref:t,mode:s,onChange:l,label:u.label,required:u.required,size:"medium",popupClassName:uB()("ct-select-popup",u.popupClassName)})}),{displayName:"Select"}),BQ=p8.config(B$),BJ=(0,e5.forwardRef)((e,t)=>{let{className:n,defaultExpanded:o=!1,header:i=(0,e3.jsx)("div",{children:"折叠面板头部"}),customHeader:a,expanded:s,onToggle:l,animated:u=!0,children:d=(0,e3.jsxs)("div",{children:[(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"})]})}=e,p=(0,e5.useRef)(null),m=(0,e5.useRef)(null),[h,f]=(0,e5.useState)(o),[_,g]=(0,e5.useState)(o),y=void 0!==s?s:h,b=(e,t)=>{var n;if(!u)return void(t?(e.style.height="auto",e.style.width="auto",g(!0)):(e.style.height="0",g(!1)));let o=e.getBoundingClientRect().height,i=e.getBoundingClientRect().width,a=(null==(n=m.current)?void 0:n.getBoundingClientRect().width)||i;if(t){e.style.height="0",e.style.width=`${a}px`,e.style.transition="height 0.3s ease, width 0.3s ease",e.getBoundingClientRect(),e.style.height="auto";let t=e.getBoundingClientRect().height,n=e.getBoundingClientRect().width;e.style.height="0",e.getBoundingClientRect(),requestAnimationFrame(()=>{e.style.height=`${t}px`,e.style.width=`${n}px`});let o=()=>{e.style.height="auto",e.style.width="auto",g(!0),e.removeEventListener("transitionend",o)};e.addEventListener("transitionend",o)}else{e.style.height=`${o}px`,e.style.width=`${i}px`,e.style.transition="height 0.3s ease, width 0.3s ease",e.getBoundingClientRect(),requestAnimationFrame(()=>{e.style.height="0",e.style.width=`${a}px`});let t=()=>{g(!1),e.removeEventListener("transitionend",t)};e.addEventListener("transitionend",t)}};return(0,e5.useEffect)(()=>{let e=p.current;e&&(y?(g(!0),u?Promise.resolve().then(()=>{b(e,!0)}):(e.style.height="auto",e.style.width="auto")):u?b(e,!1):(e.style.height="0",g(!1)))},[y,u]),(0,e3.jsxs)("div",{className:uB()("ct-flip",n),ref:t,children:[(0,e3.jsx)("div",{className:"flip-header-container",ref:m,children:a||(0,e3.jsxs)("div",{className:"flip-header",onClick:()=>{let e=!y;null==l||l(e),void 0===s&&f(e)},children:[i,(0,e3.jsx)("span",{className:"flip-header-icon",children:(0,e3.jsx)(RJ,{type:y?"arrow-up":"arrow-down",size:"xs"})})]})}),(0,e3.jsx)("div",{className:"flip-content",ref:p,style:{height:o?"auto":0,width:o?"auto":"100%",overflow:"hidden",transition:u?void 0:"none"},children:_&&d})]})}),BX=p8.config(BJ),BZ=(0,e5.forwardRef)((e,t)=>{let{useText:n="使用",name:o,className:i,selected:a=!1,status:s,onToolClick:l,authInfo:u,fullWidth:d,param:p,groupName:m,disabled:h=!1}=e,f=a?"selected":"";return f=d?`${f} full-width`:`${f}`,f=l?`${f} enable-click`:`${f}`,(0,e3.jsxs)("div",{className:uB()(`ct-tool-status ${f} ${s} ${h?"disabled":""}`,i),ref:t,onClick:t=>{h||(t.stopPropagation(),null==l||l(e))},children:[(0,e3.jsx)(RJ,{size:"xs",type:"failed"===s?"icon-cross1":"completed"===s?"icon-check":"loading"}),u&&"auth"===s&&(0,e3.jsx)("div",{className:"next-btn-text next-btn-primary",onClick:t=>{var n;t.stopPropagation(),null==u||null==(n=u.onAuthClick)||n.call(u,e)},children:null==u?void 0:u.content}),(0,e3.jsxs)("div",{className:"content-container",children:[(0,e3.jsx)("div",{className:"content-use-tips",children:n}),m&&(0,e3.jsx)("div",{className:"content-group",children:m}),o&&(0,e3.jsx)("div",{className:"content-name",children:o}),p&&(0,e3.jsx)("div",{className:"content-detail",children:p})]})]})}),B1=p8.config(BZ),B0=RG((0,e5.forwardRef)(e=>{let{className:t,children:n,...o}=e;return(0,e3.jsx)(yJ,{...o,className:uB()("ct-collapse",t),children:n})}),{displayName:"Collapse",Panel:yJ.Panel}),B2=p8.config(B0),B3=(0,e5.forwardRef)((e,t)=>{let{className:n,size:o="small",hasBorder:i=!0,title:a,showCopyButton:s,...l}=e,[u,d]=(0,e5.useState)(!1);return(0,e3.jsxs)("div",{className:"ct-table-container",children:[a?(0,e3.jsxs)("div",{className:"ct-table-header",children:[a&&(0,e3.jsx)("div",{className:"ct-table-title",children:a}),s?(0,e3.jsx)("div",{className:"ct-table-copy-button",onClick:()=>{d(!0),setTimeout(()=>{d(!1)},3e3)},children:(0,e3.jsx)(RJ,{size:16,type:u?"icon-check":"fuzhi3"})}):null]}):null,(0,e3.jsx)(ko,{...l,ref:t,className:uB()("ct-table",{[`ct-table-${o}`]:o,"ct-table-no-border":!i},n),size:o})]})});B3.displayName="Table";let B5=p8.config(B3),B4=(0,e5.forwardRef)((e,t)=>{let{className:n,text:o,...i}=e;return(0,e3.jsxs)("div",{...i,className:uB()("ct-error-notice",n),ref:t,children:[(0,e3.jsx)("div",{className:"ct-error-notice-icon",children:(0,e3.jsx)(h2,{size:16,type:"prompt"})}),(0,e3.jsx)("span",{className:"ct-error-notice-text",children:o})]})});B4.displayName="ErrorNotice";let B6=p8.config(B4),B9=(0,e5.forwardRef)((e,t)=>{let{className:n,...o}=e;return(0,e3.jsx)("div",{...o,className:uB()("ct-document-empty",n),ref:t,children:Array.from({length:4},(e,t)=>(0,e3.jsx)("div",{className:"ct-empty-line"},t))})});B9.displayName="Empty";let B8=p8.config(B9),B7=(0,e5.forwardRef)((e,t)=>{let{className:n,title:o="",content:i,generating:a=!0,onPreview:s,onCopy:l,onDownload:u,renderDownloadAction:d,showPreviewButton:p=!0,showCopyButton:m=!0,showDownloadButton:h=!0,contentHeight:f=128,..._}=e,g=f-25,y=(0,e5.useRef)(null),[b,E]=(0,e5.useState)(0),[S,T]=(0,e5.useState)(!1),[C,k]=(0,e5.useState)(()=>f>128?128:f),x=e=>{let t=Array.from(e.children);return 0===t.length?e:x(t[t.length-1])},w=(0,e5.useCallback)(()=>{let e=y.current;if(!e)return;let t=e.getBoundingClientRect(),n=x(e);if(!n)return;let o=n.getBoundingClientRect(),i=o.top-t.top,s=a?i+o.height:i+o.height+20;if(f>128&&C<f){let e=C-25;if(s>e)return void k(Math.min(f,C+(s-e)))}if(!(s+b<g&&i+b>0))return void E(-i)},[b,f,C,a]),N=Av(w,200);(0,e5.useEffect)(()=>{w()},[a]),(0,e5.useEffect)(()=>{if("string"==typeof i)return void N();if(!y.current)return;let e=new MutationObserver(()=>{N()});return e.observe(y.current,{childList:!0,subtree:!0,characterData:!0}),()=>{e.disconnect()}},[i,N]);let D=e=>{o&&p&&s&&(e.stopPropagation(),null==s||s())},O=e=>{e.stopPropagation()};return(0,e3.jsxs)("div",{..._,className:uB()("ct-document",{"ct-document-generating":a},n),ref:t,onClick:D,children:[o?(0,e3.jsxs)("div",{className:"ct-document-header",children:[(0,e3.jsxs)("div",{className:"ct-document-header-left",children:[(0,e3.jsx)(RJ,{type:"document",className:"ct-document-header-icon"}),(0,e3.jsx)("span",{className:uB()("ct-document-header-title"),children:o})]}),(0,e3.jsxs)("div",{className:uB()("ct-document-header-actions"),children:[(0,e3.jsxs)("div",{className:uB()("ct-document-header-preview",{"ct-document-header-preview-display-none":!p||!s,"ct-document-header-preview-generating":a}),onClick:D,children:[(0,e3.jsx)(RJ,{type:"preview",className:"ct-document-header-preview-icon"}),(0,e3.jsx)("span",{className:"ct-document-header-preview-text",children:"预览"})]}),(0,e3.jsx)("div",{className:uB()("ct-document-header-action","ct-document-header-action-copy",{"ct-document-header-action-copy-generating":a,"ct-document-header-action-copy-display-none":!m||!l}),onClick:e=>{e.stopPropagation(),null==l||l(),T(!0),setTimeout(()=>{T(!1)},3e3)},title:"复制",children:(0,e3.jsx)(RJ,{type:S?"icon-check":"fuzhi3",className:"ct-document-header-action-icon"})}),(0,e3.jsx)("div",{className:uB()("ct-document-header-action","ct-document-header-action-download",{"ct-document-header-action-download-generating":a,"ct-document-header-action-download-display-none":!h||!d&&!u}),onClick:d?O:e=>{e.stopPropagation(),null==u||u()},title:d?void 0:"下载",children:d?d():(0,e3.jsx)(RJ,{type:"download",className:"ct-document-header-action-icon"})})]})]}):(0,e3.jsx)("div",{className:"ct-document-header",children:(0,e3.jsxs)("div",{className:"ct-document-header-left",children:[(0,e3.jsx)("div",{className:"ct-document-header-left-icon-empty"}),(0,e3.jsx)("div",{className:"ct-document-header-left-title-empty"})]})}),i?(0,e3.jsxs)("div",{className:uB()("ct-document-content",{"ct-document-content-generating":a}),style:{height:C},children:[(0,e3.jsx)("div",{className:"ct-document-mask"}),(0,e3.jsx)("div",{className:"ct-document-content-inner",children:(0,e3.jsx)("div",{ref:y,className:"ct-document-content-text",style:{transform:`translateY(${a?b:0}px)`},onClick:O,children:i})})]}):(0,e3.jsx)("div",{className:uB()("ct-document-content",{"ct-document-content-generating":a}),children:(0,e3.jsx)("div",{className:"ct-document-content-inner",children:(0,e3.jsx)(B8,{})})})]})});B7.displayName="Document";let je=p8.config(B7),jt="0.3.61",jn=e=>{let{globalExpandCode:t}=e,[n,o]=(0,e5.useState)(!1),[i,a]=(0,e5.useState)(t);(0,e5.useEffect)(()=>{o(!0)},[]),(0,e5.useEffect)(()=>{a(t)},[t]);let s=e.docInfo.tags.reduce((e,t)=>(e[t.tag]=t.content,e),{}),l=(0,iZ.kebabCase)(e.demoKey),d=`${l}-container`;return(0,e3.jsxs)("div",{id:d,className:"next-demo-item scroll-count-item",children:[(0,e3.jsxs)("div",{id:`${l}-desc`,className:"demo-item-desc markdown",children:[(0,e3.jsx)(i1,{id:d,title:s["@demo"],component:"h3"}),(0,e3.jsx)("div",{className:"demo-item-desc-body markdown",children:(0,e3.jsx)(ob,{remarkPlugins:[iR],children:s["@remarks"]})})]}),(0,e3.jsxs)(uA,{disabled:e.disabled,code:e.sourceCode,scope:{mountNode:document.querySelector(`#${l}-mount`),require:e=>{let t={"@alifd/chat":e2,"@alifd/next":e$,"react-dom":e6,"styled-components":eQ,react:e4(),classnames:uB()},n=e.match(/^@alifd\/chat\/(es|lib)\/(.*)\/style$/);return n&&u(64615)(`./${n[2]}/style`),t[e]}},noInline:!0,children:[(0,e3.jsx)("div",{id:`${l}-mount`,className:"next-demo-mount",children:n?(0,e3.jsx)(uL,{}):null}),n?(0,e3.jsx)(uF,{}):null,(0,e3.jsx)("div",{id:`${l}-operations`,className:"demo-item-operations",style:{borderBottom:"1px dashed rgb(238, 238, 238)"},children:(0,e3.jsx)("div",{id:`${l}-fold-code`,className:"code-box-code-action code-expand-icon-hide",children:(0,e3.jsxs)(fl.Tooltip,{align:"b",style:{maxWidth:400},trigger:(0,e3.jsx)("span",{id:`${l}-icon-hide`,onClick:()=>{a(!i)},children:(0,e3.jsx)("svg",{width:20,height:20,viewBox:"0 0 20 20",style:{fill:"#3B9AFF"},children:(0,e3.jsx)("path",{transform:"translate(10.457453, 10.101961) rotate(90.000000) translate(-10.457453, -10.101961)",d:"M14.4307124,13.5667899 L15.1349452,14.276759 L10.7473676,18.6288871 L6.42783259,14.2738791 L7.13782502,13.5696698 L10.7530744,17.2147744 L14.4307124,13.5667899 Z M4.79130753,8.067524 L16.3824174,11.1733525 L16.1235984,12.1392784 L4.53248848,9.03344983 L4.79130753,8.067524 Z M10.8154102,1.57503552 L15.1349452,5.93004351 L14.4249528,6.63425282 L10.809949,2.98914817 L7.13206544,6.6371327 L6.42783259,5.92716363 L10.8154102,1.57503552 Z"})})}),children:["收起代码",(0,e3.jsx)("br",{}),(0,e3.jsx)("br",{}),"小提示:",(0,e3.jsx)("br",{}),(0,e3.jsx)("br",{}),(0,e3.jsx)("strong",{children:"1. 点击一下代码，试一试在线编辑预览吧！"}),(0,e3.jsx)("br",{}),(0,e3.jsx)("br",{}),(0,e3.jsx)("strong",{children:"2. 页面右上方 有 全局代码展开 及 开启在线编辑 模式哟～"})]})})}),(0,e3.jsx)("div",{id:`${l}-body`,className:"next-demo-body",style:{display:i?"block":"none"},children:(0,e3.jsx)("div",{id:`${l}-live-editor`,children:(0,e3.jsx)("div",{id:`${l}-live-body`,className:"react-live-body",children:(0,e3.jsx)(uI,{theme:{plain:{},styles:[{types:[],style:{}}]}})})})})]})]})},jr=e=>{let{defaultLiveDemo:t=!0,defaultExpandCode:n=!0,onToggleExpandCode:o,onToggleLiveDemo:i,data:a=[]}=e,[s,l]=(0,e5.useState)(n),[u,d]=(0,e5.useState)(t),p={viewBox:"0 0 16 16",focusable:"false",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true","aria-haspopup":"true","aria-expanded":"false",style:{width:20,height:20,padding:2}};return(0,e3.jsxs)("div",{className:"demo-index",children:[(0,e3.jsxs)("span",{id:"global-control",className:"all-demo-box-controls",children:[(0,e3.jsx)(fl.Tooltip,{trigger:(0,e3.jsxs)("span",{id:"live-demo",role:"img","aria-label":"edit",className:"code-box-expand-trigger",onClick:()=>{d(!u),"function"==typeof i&&i(!u)},children:[(0,e3.jsx)("svg",{...p,"data-icon":"edit",id:"live-on",style:{...p.style,display:u?"none":"block"},children:(0,e3.jsx)("path",{d:"M9.69559557,3.62666667 L2.20866223,11.1146667 L1.8673289,12.3562667 L3.1153289,12.0181333 L10.6011956,4.53226667 L9.69559557,3.62666667 Z M10.4497289,2.87253333 L11.3553289,3.77813333 L12.2673289,2.86613333 C12.4290988,2.70436348 12.4922771,2.46857876 12.4330652,2.24759702 C12.3738533,2.02661528 12.201247,1.85400889 11.9802652,1.79479701 C11.7592835,1.73558513 11.5234988,1.79876346 11.3617289,1.96053333 L10.4497289,2.87253333 L10.4497289,2.87253333 Z M13.0203956,1.20639113 C13.3405419,1.52647328 13.5204044,1.96062968 13.5204044,2.41333333 C13.5204044,2.86603699 13.3405419,3.30019339 13.0203956,3.62026667 L3.6689289,12.9728 L0.346262232,13.8741333 L1.25506223,10.5589333 L10.6075956,1.20639113 C10.9276688,0.886253633 11.3618252,0.706391131 11.8145289,0.706391131 C12.2672326,0.706391131 12.701389,0.886253633 13.0214622,1.20639113 L13.0203956,1.20639113 Z M1,15 L11,15 L11,16 L1,16 L1,15 Z"})}),(0,e3.jsx)("svg",{...p,id:"live-off","data-icon":"edit",style:{...p.style,display:u?"block":"none"},children:(0,e3.jsx)("path",{d:"M9.69559557,3.62666667 L2.20866223,11.1146667 L1.8673289,12.3562667 L3.1153289,12.0181333 L10.6011956,4.53226667 L9.69559557,3.62666667 Z M10.4497289,2.87253333 L11.3553289,3.77813333 L12.2673289,2.86613333 C12.4290988,2.70436348 12.4922771,2.46857876 12.4330652,2.24759702 C12.3738533,2.02661528 12.201247,1.85400889 11.9802652,1.79479701 C11.7592835,1.73558513 11.5234988,1.79876346 11.3617289,1.96053333 L10.4497289,2.87253333 L10.4497289,2.87253333 Z M13.0203956,1.20639113 C13.3405419,1.52647328 13.5204044,1.96062968 13.5204044,2.41333333 C13.5204044,2.86603699 13.3405419,3.30019339 13.0203956,3.62026667 L3.6689289,12.9728 L0.346262232,13.8741333 L1.25506223,10.5589333 L10.6075956,1.20639113 C10.9276688,0.886253633 11.3618252,0.706391131 11.8145289,0.706391131 C12.2672326,0.706391131 12.701389,0.886253633 13.0214622,1.20639113 L13.0203956,1.20639113 Z M1,15 L11,15 L11,16 L1,16 L1,15 Z"})})]}),children:"使用预览模式"}),(0,e3.jsx)(fl.Tooltip,{trigger:(0,e3.jsxs)("span",{id:"expand-all",role:"img","aria-label":"code",className:"code-box-expand-trigger","aria-haspopup":"true","aria-expanded":"false",onClick:()=>{l(!s),"function"==typeof o&&o(!s)},children:[(0,e3.jsx)("svg",{...p,id:"all-not-expand","data-icon":"code",style:{...p.style,display:s?"none":"block"},children:(0,e3.jsx)("path",{d:"M16,0 L16,16 L0,16 L0,0 L16,0 Z M15,1 L1,1 L1,15 L15,15 L15,1 Z M13,11 L13,12 L8,12 L8,11 L13,11 Z M3.33419059,3.86073652 L7.22040532,7.74695124 L3.33419127,11.6331801 L2.62708313,10.9260747 L5.806,7.747 L2.62708313,4.5678433 L3.33419059,3.86073652 Z"})}),(0,e3.jsx)("svg",{...p,id:"all-expanded","data-icon":"code",style:{...p.style,display:s?"block":"none"},children:(0,e3.jsx)("path",{d:"M16,0 L16,16 L0,16 L0,0 L16,0 Z M15,1 L1,1 L1,15 L15,15 L15,1 Z M13,11 L13,12 L8,12 L8,11 L13,11 Z M3.33419059,3.86073652 L7.22040532,7.74695124 L3.33419127,11.6331801 L2.62708313,10.9260747 L5.806,7.747 L2.62708313,4.5678433 L3.33419059,3.86073652 Z"})})]}),children:"展开所有代码"})]}),(0,e3.jsx)("ul",{className:"demo-index-list",children:a.map(e=>(0,e3.jsx)("li",{className:"demo-index-item","data-id":e.id,children:(0,e3.jsx)("a",{href:`#${e.id}`,children:e.title})},e.id))})]})};e6.render((0,e3.jsx)(()=>{var e;let[t,n]=(0,e5.useState)(!0),[o,i]=(0,e5.useState)(!1),a={size:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>大尺寸 Large</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size="large">\n 发送消息\n </Button>\n <Button type="secondary" size="large">\n 保存草稿\n </Button>\n <Button type="normal" size="large">\n 取消\n </Button>\n <Button type="primary" size="large" loading>\n 加载中\n </Button>\n <Button type="primary" size="large" disabled>\n 禁用状态\n </Button>\n <Button warning size="large">\n 删除\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>中尺寸 Medium</h4>\n <div className="demo-mobile-wrap">\n <Button size="medium" type="primary">\n 发送消息\n </Button>\n <Button size="medium" type="secondary">\n 保存草稿\n </Button>\n <Button size="medium" type="normal">\n 取消\n </Button>\n <Button size="medium" type="primary" loading>\n 加载中\n </Button>\n <Button size="medium" type="primary" disabled>\n 禁用状态\n </Button>\n <Button size="medium" warning>\n 删除\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>小尺寸 Small</h4>\n <div className="demo-mobile-wrap">\n <Button size="small" type="primary">\n 收藏\n </Button>\n <Button size="small" type="secondary">\n 编辑\n </Button>\n <Button size="small" type="normal">\n 删除\n </Button>\n <Button size="small" type="primary" loading>\n 加载中\n </Button>\n <Button size="small" type="primary" disabled>\n 禁用状态\n </Button>\n <Button size="small" warning>\n 删除\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮有三种尺寸：大、中、小。\n- 大尺寸 Large：-\n- 中尺寸 Medium：用于大多数标准布局，对会话卡片进行全局操作的按钮。不建议在列表中使用。\n- 小尺寸 Small：用于内置在列表中的按钮。不建议用于会话卡片中的主要交互按钮的关键操作。"},{tag:"@demo",content:"按钮尺寸"},{tag:"@en",content:"Button Size"},{tag:"@order",content:"2"}]}},states:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst defaultButtonSize = "medium";\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>主按钮 Primary</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button type="primary" size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button type="primary" size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button type="primary" size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button type="primary" size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>次按钮 Secondary</h4>\n <div className="demo-mobile-wrap">\n <Button type="secondary" size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button type="secondary" size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button type="secondary" size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button type="secondary" size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button type="secondary" size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>普通按钮 Normal</h4>\n <div className="demo-mobile-wrap">\n <Button type="normal" size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button type="normal" size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button type="normal" size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button type="normal" size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button type="normal" size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>文本按钮 Text</h4>\n <div className="demo-mobile-wrap">\n <Button text size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button text size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button text size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button text size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button text size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>警示按钮 Warning</h4>\n <div className="demo-mobile-wrap">\n <Button warning size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button warning size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button warning size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button warning size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button warning size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮在不同的交互阶段呈现不同的视觉状态：\n- 正常态(Normal)：按钮的默认状态。\n- 悬停态(Hover)：鼠标悬停在按钮上时的状态。\n- 激活态(Active)：点击按钮时的瞬时状态。"},{tag:"@demo",content:"按钮状态"},{tag:"@en",content:"Button States"},{tag:"@order",content:"1"}]}},type:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button, Text } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nimport "@alifd/chat/es/text/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst defaultButtonSize = "medium";\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>主要按钮 Primary</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize}>\n Primary\n </Button>\n <Button type="primary" size={defaultButtonSize} disabled>\n 禁用状态\n </Button>\n <Button type="primary" size={defaultButtonSize} loading>\n 加载中\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>次要按钮 Secondary</h4>\n <div className="demo-mobile-wrap">\n <Button type="secondary" size={defaultButtonSize}>\n Secondary\n </Button>\n <Button type="secondary" size={defaultButtonSize} disabled>\n 禁用状态\n </Button>\n <Button type="secondary" size={defaultButtonSize} loading>\n 加载中\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>普通按钮 Normal</h4>\n <div className="demo-mobile-wrap">\n <Button type="normal" size={defaultButtonSize}>\n Normal\n </Button>\n <Button type="normal" size={defaultButtonSize} disabled>\n 禁用状态\n </Button>\n <Button type="normal" size={defaultButtonSize} loading>\n 加载中\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>文本按钮 Text</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" text size="large">\n primary\n </Button>\n </div>\n <div\n style={{\n marginTop: 12,\n display: "flex",\n alignItems: "baseline",\n gap: 0,\n }}\n >\n <Text>这是一段文本，其中包含一个</Text>\n <Button size={defaultButtonSize} type="primary" text>\n 退订操作\n </Button>\n <Text>按钮。</Text>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>警示按钮 Warning</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" warning size={defaultButtonSize}>\n Delete\n </Button>\n <Button type="primary" warning disabled size={defaultButtonSize}>\n Disabled Warning\n </Button>\n <Button type="primary" warning loading size={defaultButtonSize}>\n Loading\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮有五种类型：主要按钮、次要按钮、普通按钮、文本按钮和警示按钮。\n- 主要按钮(Primary)：用于关键正向操作，用于提交表单、保存数据、查询、信息确认等。\n- 次要按钮(Secondary)：用于区分辅助操作、次要功能，如保存(`secondary`)与提交(`primary`)；不建议在需要强调主次分明的界面中过多使用。\n- 普通按钮(Normal)：用于一般交互如取消操作、关闭功能等非核心功能，或多个同层级内容的选项；不建议用于需要用户重点关注的主要功能。\n- 文本按钮(Text)：用于在文本中触发具体功能的非重要功能按钮，如退订、关闭。不建议用于独立于文本使用的操作按钮。\n- 警示按钮(Warning)：用于删除或不可逆操作的确认按钮，如重要表单数据删除的二次确认。不建议用于普通操作。"},{tag:"@demo",content:"按钮类型"},{tag:"@en",content:"Button Type"},{tag:"@order",content:"0"}]}},disabled:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst defaultButtonSize = "medium";\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>普通禁用</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize} disabled>\n 主按钮\n </Button>\n <Button type="secondary" size={defaultButtonSize} disabled>\n 次按钮\n </Button>\n <Button type="normal" size={defaultButtonSize} disabled>\n 普通按钮\n </Button>\n <Button text size={defaultButtonSize} disabled>\n 文本按钮\n </Button>\n <Button warning size={defaultButtonSize} disabled>\n 删除按钮\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>带图标的禁用按钮</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" icon="plus" size={defaultButtonSize} disabled>\n 新建\n </Button>\n <Button type="secondary" icon="edit" size={defaultButtonSize} disabled>\n 编辑\n </Button>\n <Button text icon="delete" size={defaultButtonSize} disabled>\n 删除\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>不同尺寸的禁用按钮</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size="large" disabled>\n 大尺寸保存\n </Button>\n <Button type="primary" size="medium" disabled>\n 中尺寸保存\n </Button>\n <Button type="primary" size="small" disabled>\n 小尺寸保存\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>禁用和加载状态</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize} disabled>\n 发送消息\n </Button>\n <Button type="primary" size={defaultButtonSize} loading disabled>\n 发送中...\n </Button>\n <Button\n type="primary"\n icon="refresh"\n size={defaultButtonSize}\n loading\n disabled\n >\n 加载中\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮的禁用状态，用于条件不满足时，如未填写完整信息的表单提交按钮。不建议用于用户需频繁操作的常规按钮。"},{tag:"@demo",content:"禁用状态"},{tag:"@en",content:"Disabled State"},{tag:"@order",content:"6"}]}},group:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst defaultButtonSize = "medium";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst contentAreaStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "24px",\n};\nconst HorizontalButtonGroupDemo = () => (\n <>\n <div>\n <div>单个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[{ type: "primary", label: "确认" }]}\n />\n </div>\n </div>\n\n <div>\n <div>两个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "取" },\n { type: "primary", label: "确认" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>三个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "更" },\n { type: "normal", label: "取消" },\n { type: "primary", label: "确认吗" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>设置了最小宽度的三个按钮 - 窄屏</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "更多", style: { minWidth: "200px" } },\n { type: "normal", label: "取消", style: { minWidth: "200px" } },\n { type: "primary", label: "确认", style: { minWidth: "200px" } },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>设置了最小宽度的三个按钮 - 宽屏</div>\n <div className="demo-mobile-wrap large">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "更多", style: { minWidth: "200px" } },\n { type: "normal", label: "取消", style: { minWidth: "200px" } },\n { type: "primary", label: "确认", style: { minWidth: "200px" } },\n ]}\n />\n </div>\n </div>\n </>\n);\nconst VerticalButtonGroupDemo = () => (\n <>\n <div>\n <div>四个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>四个按钮 大尺寸</div>\n <div className="demo-mobile-wrap large">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>五个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>五个按钮 大尺寸</div>\n <div className="demo-mobile-wrap large">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>带图标的按钮组</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "打印文档", icon: "print" },\n { type: "normal", label: "导出 Excel", icon: "download" },\n { type: "normal", label: "分享链接", icon: "share" },\n { type: "normal", label: "更多操作", icon: "more" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>四个普通按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>不同尺寸(medium)</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size="small"\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "筛选数据" },\n ]}\n />\n\n <Button.Group\n type="column"\n size="medium"\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "筛选数据" },\n ]}\n />\n\n <Button.Group\n type="column"\n size="large"\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "筛选数据" },\n ]}\n />\n </div>\n </div>\n </>\n);\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>水平排列（按钮数 ≤ 3）</h4>\n <div style={contentAreaStyle}>\n <HorizontalButtonGroupDemo />\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>垂直排列（按钮数 &gt; 3）</h4>\n <div style={contentAreaStyle}>\n <VerticalButtonGroupDemo />\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮组是一个操作类UI组件，用于将多个相关按钮组合在一起，提供统一的外观和交互体验，使用户能够快速选择多个相关操作项。它在卡片中扮演操作集合入口的角色，通常用于多步骤流程、功能选择等场景。\n\n水平排列（Horizontal Button Group）：\n- 使用场景：用于按钮优先级有明显主次区分的情况，按钮数不超过3个。如在提交申请、确定预约等关键操作的情况下使用。不建议按钮文本字数较长使用。\n- 组合规则：按钮按照优先级从高到低从右向左排列，优先级最高的放置在按钮组最右侧，通常有且只有一个最高优的按钮。\n- 布局规则：始终水平充满排列，间距为8px。\n\n垂直排列（Vertical Button Group）：\n- 使用场景：用于按钮优先级没有明显主次区分的情况，按钮数量超过3个。如在选择证明、查询渠道等选择的情况下使用。不建议在有关键操作时使用。\n- 组合规则：按钮按照优先级从上至下纵向排列，优先级最高的放置在按钮组最顶部。\n- 布局规则：始终垂直充满排列，间距为8px。\n\n功能特性：\n- 使用方式：支持子元素方式和 dataSource 数据配置方式\n- 排列方式：通过 type 属性设置 'row'（默认）或 'column' 排列\n- 统一大小：通过 size 属性统一设置组内按钮的大小"},{tag:"@demo",content:"按钮组"},{tag:"@en",content:"Button Group"},{tag:"@order",content:"7"}]}},icon:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst defaultButtonSize = "medium";\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>无Icon</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize}>\n 发送消息\n </Button>\n <Button type="secondary" size={defaultButtonSize}>\n 保存草稿\n </Button>\n <Button type="normal" size={defaultButtonSize}>\n 取消操作\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>前置Icon</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize} icon="refresh">\n 发送消息\n </Button>\n <Button type="secondary" size={defaultButtonSize} icon="refresh">\n 保存草稿\n </Button>\n <Button type="normal" size={defaultButtonSize} icon="refresh">\n 取消操作\n </Button>\n <Button text size={defaultButtonSize} icon="copy">\n 复制文本\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>不同尺寸的图标按钮 Icon Buttons in Different Sizes</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size="large" icon="refresh">\n 刷新\n </Button>\n <Button type="primary" size="medium" icon="refresh">\n 刷新\n </Button>\n <Button type="primary" size="small" icon="refresh">\n 刷新\n </Button>\n <Button text size="large" icon="copy">\n 复制\n </Button>\n <Button text size="medium" icon="copy">\n 复制\n </Button>\n <Button text size="small" icon="copy">\n 复制\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮可以搭配不同位置的图标使用：\n- 无Icon：用于操作意图明确、界面简洁的场景，不建议在用户无法理解按钮含义的情况下使用。\n- 前置Icon：用于提快速识别语义的视觉提示，适合功能性强的操作。不建议在文案已足够清晰的情况下使用。\n- 后置Icon：暂未实现。用于引导用户进一步操作或查看扩展内容，不建议在核心操作路径中或用户需快速决策的场景下使用。"},{tag:"@demo",content:"按钮图标"},{tag:"@en",content:"Button Icons"},{tag:"@order",content:"3"}]}},layout:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst defaultButtonSize = "medium";\nconst LayoutDemo = () => {\n return (\n <>\n <div>\n <div>拉升充满容器（默认）</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "取消" },\n { type: "primary", label: "确定" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>右侧布局</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n layout="end"\n dataSource={[\n { type: "normal", label: "取消" },\n { type: "primary", label: "确定" },\n ]}\n />\n </div>\n </div>\n </>\n );\n};\nReactDOM.render(<LayoutDemo />, mountNode);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"展示 Button.Group 组件的不同布局方式，包括左侧、右侧和拉升充满容器。"},{tag:"@demo",content:"布局方式"},{tag:"@en",content:"Layout Modes"},{tag:"@order",content:"3"}]}}},s=[{tag:"@remarks",content:"[按钮组件]\xa0是一个\xa0[操作类]\xa0UI 组件，用于\xa0[触发用户交互动作]，包括点击、悬停等行为，使用户能够\xa0[执行命令、提交表单、切换状态等]。它在卡片中扮演\xa0[核心操作入口]\xa0的角色，通常用于\xa0[表单提交、功能切换、数据操作等场景]。"},{tag:"@component",content:"按钮"},{tag:"@en",content:"Button"},{tag:"@type",content:"通用 - General"},{tag:"@others",content:"## 无障碍键盘操作指南\n| 按键 | 说明 |\n| :---- | :---------- |\n| Enter | 触发 onClick 事件 |\n| SPACE | 触发 onClick 事件 |"},{tag:"@othersEn",content:"## ARIA and KeyBoard\n| KeyBoard | Description |\n| :---------- | :------------------------------ |\n| Enter | Trigger the onClick event |\n| SPACE | Trigger the onClick event |"}].reduce((e,t)=>(e[t.tag]=t.content,e),{}),l={id:"demo-list",title:"代码演示"},u=Object.keys(a).sort((e,t)=>{var n,o,i,s;return parseInt((null==(o=a[e].docInfo.tags)||null==(n=o.find(e=>"@order"===e.tag))?void 0:n.content)||"0")-parseInt((null==(s=a[t].docInfo.tags)||null==(i=s.find(e=>"@order"===e.tag))?void 0:i.content)||"0")}),d=[...s["@when"]?[{id:"何时使用",title:"何时使用"}]:[],l,...u.map(e=>{let t=(0,iZ.kebabCase)(e);return{id:`${t}-container`,title:a[e].docInfo.tags.reduce((e,t)=>(e[t.tag]=t.content,e),{})["@demo"]}})];return(0,e3.jsxs)("div",{className:"demo-wrapper",children:[(0,e3.jsx)("div",{className:"demo-title markdown",children:(0,e3.jsx)("h1",{children:s["@en"]})}),(0,e3.jsx)(jr,{defaultExpandCode:o,defaultLiveDemo:t,onToggleLiveDemo:n,onToggleExpandCode:i,data:d}),(0,e3.jsx)("div",{className:"demo-head",children:(0,e3.jsxs)("div",{id:"demo-area",className:"next-demo-section",children:[(0,e3.jsxs)("div",{id:"md-area-former",className:"markdown-body markdown",children:[(0,e3.jsx)("div",{id:"demo-guide",className:"scroll-count-item active"}),(0,e3.jsx)("p",{children:i2(s["@remarks"])}),(e=s["@when"])?(0,e3.jsxs)(e3.Fragment,{children:[(0,e3.jsx)(i1,{id:"何时使用",title:"何时使用"}),(0,e3.jsx)("ul",{children:(0,e3.jsx)("li",{children:i2(e)})})]}):null,(0,e3.jsx)(i1,{...l})]}),u.map((e,n)=>(0,e5.createElement)(jn,{disabled:!t,globalExpandCode:o,...a[e],demoKey:e,key:n})),(0,e3.jsx)("div",{id:"md-area-latter",className:"markdown-body markdown",children:(0,e3.jsxs)("div",{id:"demo-api","data-scroll-id":"demo-api",className:"scroll-count-item active",children:[(0,e3.jsx)(i1,{id:"API",title:"API"}),[{title:"ButtonSize",summary:"按钮大小",apiMode:!0,properties:[]},{title:"ButtonGroupType",summary:"按钮组类型，横/竖排",apiMode:!0,properties:[]},{title:"ButtonGroupLayout",summary:"按钮组布局方式",apiMode:!0,properties:[]}].map(e=>(0,e5.createElement)(i0,{...e,key:e.title})),s["@others"]?(0,e3.jsx)(ob,{remarkPlugins:[iR],rehypePlugins:[iq,[iB,{behavior:"append",content:()=>[iX("span",{},["#"])],properties:{className:"header-anchor scroll-count-item"}}]],children:s["@others"]}):null]})})]})})]})},{}),document.getElementById("root"))})()})();
136
+ 如何解决这个问题？如果你能提供修复方案，请保持简洁。`;i&&i(e)}},children:"使用对话修复"})})]})})}):(0,e3.jsx)("div",{className:"ct-mermaid-view-content",children:(0,e3.jsx)("div",{ref:a,className:"ct-mermaid-view-chart"})}),d&&(0,e3.jsx)("div",{className:"ct-mermaid-view-loading",children:(0,e3.jsx)(E4,{size:"medium"})})]})});Bc.displayName="MermaidView";let Bu=p8.config(Bc),Bd=[{emotionVersion:"75",emotionId:"emotion_180001",dynamicEmotionId:"",showType:1,skinList:[],name:"[魔法棒]",names:{en_US:"[Magic Wand]",ja_JP:"[魔棒]",vi_VN:"[đũa ph\xe9p]",zh_CN:"[魔法棒]",zh_HK:"[魔法棒]",zh_TW:"[魔法棒]"},url:"https://img.alicdn.com/imgextra/i4/O1CN01a4VODa1vAyAFlqg4H_!!6000000006133-2-tps-96-96.png",staticURL:"https://img.alicdn.com/imgextra/i4/O1CN01a4VODa1vAyAFlqg4H_!!6000000006133-2-tps-96-96.png",fallbacks:[]}],Bp="",Bm=["img","code","pre","link-reference","link-reference-group"],Bh=["link-reference-group"],Bf=RG((0,e5.forwardRef)(e=>{let{className:t,onReady:n,content:o,needCodeHeader:i=!0,theme:a="light",enableSourcePos:s=!1,sendTextMessage:l,...u}=e,[d,p]=(0,e5.useState)([]);function m(e,t){let n;if(!e)return[];let o=[...Bm,...t||[]],i=/\[[^\]]*\]\([^)]*\)/g,a=o.length>0?RegExp(`<(${o.join("|")}).*?>.*?<\\/\\1>`,"gs"):null,s=[],l=0,u=[];for(;null!==(n=i.exec(e));)u.push({start:n.index,end:n.index+n[0].length,content:n[0]});if(a)for(a.lastIndex=0;null!==(n=a.exec(e));)u.push({start:n.index,end:n.index+n[0].length,content:n[0]});for(let t of(u.sort((e,t)=>e.start-t.start),u))t.start>l&&s.push(...e.substring(l,t.start).split("")),s.push(t.content),l=t.end;return l<e.length&&s.push(...e.substring(l).split("")),s}(0,e5.useEffect)(()=>{Y7(),Be().then(e=>{p(()=>[...Bd,...e])}),null==n||n()},[n]);let h=(0,e5.useRef)(null),[f,_]=(0,e5.useState)(()=>(null==u?void 0:u.typewriterEffect)?Bp:o),[g,y]=(0,e5.useState)(()=>(null==u?void 0:u.typewriterEffect)?m(o,u.whitelistTags):[]),[b,E]=(0,e5.useState)(0),S=(0,e5.useRef)(null),T=()=>{S.current&&(clearTimeout(S.current),S.current=null)};(0,e5.useEffect)(()=>{if(T(),!(null==u?void 0:u.typewriterEffect)){_(o),y([]);return}let e=m(o,u.whitelistTags);if(b>=e.length)_(o),E(e.length),y([]);else{let t=e.slice(0,b),n=e.slice(b);_(t.join("")),y(n)}},[o,null==u?void 0:u.typewriterEffect,null==u?void 0:u.whitelistTags]),(0,e5.useEffect)(()=>{if(!(null==u?void 0:u.typewriterEffect)||0===g.length)return void T();let e=Math.max(Math.floor(g.length/10),2),t=()=>{y(t=>{if(0===t.length)return t;let n=t.slice(0,e),o=t.slice(e);return _(e=>e+n.join("")),E(t=>t+e),o})};return T(),t(),S.current=setTimeout(()=>{let e=()=>{t(),S.current=setTimeout(e,50)};e()},50),T},[g.length,null==u?void 0:u.typewriterEffect]);let C=(0,e5.useMemo)(()=>{Bp=f;let e={common_hypertitle_text_style__font_size:"h1",common_largetitle_text_style__font_size:"h1",common_h1_text_style__font_size:"h1",common_h2_text_style__font_size:"h2",common_h3_text_style__font_size:"h3",common_h4_text_style__font_size:"h4",common_h5_text_style__font_size:"h5",common_body_text_style__font_size:"span",common_footnote_text_style__font_size:"span"};return f.replace(/<font\s+([^>]+)>([^<]+)<\/font>/g,(t,n,o)=>{let i="",a="",s="",l=n.match(/sizeToken=([\w_]+)/),u=n.match(/colorTokenV2=([\w_]+)/),d=n.match(/color=([\w_]+)/),p=n.match(/color=(?:"|')?(#[0-9a-fA-F]{3,8})(?:"|')?/);l&&(i=l[1].replace(/-/g,"_")),u&&(a=u[1].replace(/-/g,"_")),!a&&d&&(a=d[1].replace(/-/g,"_")),!a&&p&&(s=p[1]);let m=[];i&&m.push(`font-size: var(--${i})`),a?m.push(`color: var(--${a})`):s&&m.push(`color: ${s}`);let h=m.join("; "),f=e[i]||"span";return`<${f} style="${h}" class="markdownFont">${o}</${f}>`})},[f]),k=(0,e5.useMemo)(()=>Bt(C,{genFrame:(e,t)=>({htmlTag:"img",selfClose:!0,attr:{draggable:"false",style:"vertical-align: text-center; display: inline-block; pointer-events: none;",class:"emoji",title:`[${e}]`,src:t.url||t.staticURL||"",alt:e}}),emotionList:d}),[C,d]),x=(0,e5.useMemo)(()=>{let e=new Fp({html:!0,xhtmlOut:!0,breaks:!0,langPrefix:"language-",linkify:!0,typographer:!0,highlight:(e,t)=>{if(t&&(null==Br?void 0:Br.getLanguage(t)))try{return null==Br?void 0:Br.highlight(t,e,!0).value}catch(e){}return""}});if(s&&e.use(e=>{e.core.ruler.push("add_source_pos",e=>{e.tokens.forEach(e=>{if(e.map){let[t,n]=e.map;e.attrSet("data-source-start-line",String(t)),e.attrSet("data-source-end-line",String(n))}})})}),e.linkify.add("dingtalk:",{validate:/^[^\s]+/,normalize:e=>{e.url=e.raw}}),e.linkify.add("dtmd:",{validate:/^[^\s]+/,normalize:e=>{e.url=e.raw}}),k=(k=(k=k.replace(/&#x2F;/g,"/")).replace(/&#39;/g,"'")).replace(/(!\[[^\]]*\]\((\/\/[^\s)]+)\))/g,(e,t,n)=>e.replace(n,`https:${n}`)),!i)return{html:e.render(k),codeBlocks:[]};let t=[],n=0;return e.renderer.rules.fence=(e,o)=>{let i=e[o],a=i.info.trim()||"plaintext",s=i.content,l=`code-block-${n++}`,u=!0,d=i.map;d&&(k.split("\n")[d[1]-1].trim().endsWith("```")||(u=!1));let p="mermaid"===a?"mermaid":"code";return t.push({language:a,code:s,id:l,isComplete:u}),`<div data-code-block-id="${l}" data-block-type="${p}"></div>`},{html:(e=>{let t=e;try{Bh.forEach(e=>{t=t.replace(RegExp(`<${e}([^>]*)\\/?>`,"g"),`<${e}$1></${e}>`)})}catch(e){}return t})(e.render(k)),codeBlocks:t}},[k,i,s]),w=(null==u?void 0:u.generating)?"ct-markdown generating":"ct-markdown";return(0,e3.jsxs)("div",{ref:h,className:uB()(w,`ct-hljs-${a}`,t),children:[(()=>{if(!i||0===x.codeBlocks.length)return(0,e3.jsx)(Lr,{...u,children:x.html});let e=x.html.split(/(<div[^>]*data-code-block-id="[^"]*"[^>]*><\/div>)/),t=[],n=0;for(let o of e)if(o.includes("data-code-block-id")){let e=x.codeBlocks[n];e&&("mermaid"===e.language?t.push((0,e3.jsxs)("div",{children:[e.isComplete&&(0,e3.jsx)(Bu,{code:e.code,showCopyButton:!1,theme:a,sendTextMessage:l}),(0,e3.jsx)(Bi,{code:e.code,language:e.language,showCopyButton:!0,theme:a},e.id)]},e.id)):t.push((0,e3.jsx)(Bi,{code:e.code,language:e.language,showCopyButton:!0,theme:a},e.id)),n++)}else o.trim()&&t.push((0,e3.jsx)(Lr,{...u,children:o},`html-${t.length}`));return(0,e3.jsx)(e3.Fragment,{children:t})})(),(()=>{let{generating:e}=u||{};return!e||x.html?null:(0,e3.jsx)("img",{width:20,height:10,src:"https://img.alicdn.com/imgextra/i1/O1CN01wdlADU1WCvOLNSB3w_!!6000000002753-1-tps-530-255.gif",alt:""})})()]})}),{displayName:"Markdown"}),B_=p8.config(Bf),Bg=RG((0,e5.forwardRef)((e,t)=>{let{className:n}=e;return(0,e3.jsx)("div",{className:uB()("ct-card-loading",n),children:"卡片加载中"})}),{displayName:"CardLoading"}),By=p8.config(Bg),Bb=RG((0,e5.forwardRef)((e,t)=>{let{className:n,text:o}=e;return(0,e3.jsx)("div",{className:uB()("ct-origin",n),children:(0,e3.jsx)("div",{className:"origin-tip-inner",children:o})})}),{displayName:"Origin"}),Bv=p8.config(Bb),BE=RG((0,e5.forwardRef)((e,t)=>{let{className:n,indicator:o,shape:i="default",size:a="large",...s}=e,l={...s,size:a};if(!o&&i&&"default"!==i){let e=`load-container ${i}`;l.indicator=(0,e3.jsx)("div",{className:e,children:(0,e3.jsx)("div",{className:"loader"})})}return(0,e3.jsx)(E4,{...l,ref:t,className:uB()(`ct-loading ${a} ${i}`,n)})}),{displayName:"Loading"}),BS=p8.config(BE),BT=RG((0,e5.forwardRef)((e,t)=>{let{className:n,headerStyle:o,children:i,footer:a,footerClassName:s,placement:l,...u}=e;return(0,e3.jsxs)(vj,{...u,v2:!0,ref:t,placement:l,headerStyle:{"border-bottom:":"1px solid var(--40gmM)",...o},className:uB()(`ct-drawer ${l}`,n),children:[i,a&&a.length&&(0,e3.jsx)("div",{className:uB()("draw-footer",s),children:a})]})}),{displayName:"Drawer"}),BC=p8.config(BT),Bk=RG((0,e5.forwardRef)((e,t)=>{let{className:n,shape:o="dot",showStatus:i=!0,current:a=0,stepsList:s=[],defaultCollapsed:l=!1,collapsedSteps:u=1,collapsedMore:d=(0,e3.jsxs)("div",{children:["查看更多",(0,e3.jsx)(h2,{type:"arrow-down",size:"xxs",style:{marginLeft:2}})]}),size:p="large",...m}=e,[h,f]=(0,e5.useState)([]),[_,g]=(0,e5.useState)(l);return((0,e5.useEffect)(()=>{f(s.map((e,t)=>_&&u<t+1?null:(0,e3.jsx)(TK.Item,{title:e.title,content:e.content,status:i?void 0:"wait"},t)))},[_,u,s]),0===s.length)?null:(0,e3.jsx)("div",{className:uB()("ct-step",`ct-step-${p}`,n,_&&"ct-step-collapsed"),...m,ref:t,children:(0,e3.jsxs)(e3.Fragment,{children:[(0,e3.jsx)(TK,{current:a,shape:o,labelPlacement:"hoz",direction:"ver",readOnly:!0,children:h}),_&&s.length>u&&(0,e3.jsx)("div",{className:"ct-step-collapsed-more",onClick:()=>g(!_),children:(0,e3.jsx)("div",{className:"ct-step-collapsed-more-content",children:d})})]})})}),{displayName:"Step"}),Bx=p8.config(Bk);var Bw=((eC={}).Generating="generating",eC.Stopped="stopped",eC);let BN="停止生成",BD=RG((0,e5.forwardRef)((e,t)=>{let{className:n,show:o=!0,status:i=Bw.Generating,stopText:a=BN,stopIcon:s,stoppedText:l,onStop:u}=e;return o?(0,e3.jsxs)("div",{className:uB()("ct-stop-generate",n),children:[i===Bw.Generating&&(0,e3.jsxs)("div",{className:"stop-generate-area",onClick:()=>{u&&u()},children:[(0,e3.jsx)("img",{src:s||"https://img.alicdn.com/imgextra/i2/O1CN01hpxNXz26hRw9Jz4O1_!!6000000007693-55-tps-200-200.svg"}),a||BN]}),i===Bw.Stopped&&(0,e3.jsx)("div",{className:"stopped-generate-text",children:l||"已停止生成"})]}):null}),{displayName:"StopGenerate"}),BO=p8.config(BD),BM=(0,e5.forwardRef)((e,t)=>{let{className:n,defaultExpanded:o=!1,header:i,listItems:a=[],onExpandedClick:s,onItemClick:l,mode:u="simple",onHeaderClose:d,onHeaderClick:p,onContentClick:m,expanded:h}=e,[f,_]=(0,e5.useState)(h||o);(0,e5.useEffect)(()=>{void 0!==h&&h!==f&&_(h)},[h]);let g=(e,t,n)=>{if(n.stopPropagation(),l){null==l||l(e,t);return}(null==e?void 0:e.url)&&window.open(null==e?void 0:e.url,"_blank")},y=f?"expand":"";return(0,e3.jsxs)("div",{className:uB()(`ct-reference ${u} ${y}`,n),ref:t,children:[(()=>{if(!1===i)return null;if("detail"===u){if(!1===i)return null;let e=(null==i?void 0:i.icon)||"close",t=(null==i?void 0:i.title)||"引用信息";return(0,e3.jsxs)("div",{className:`reference-header ${u}`,children:[(0,e3.jsx)("div",{className:"reference-text",children:t}),(0,e3.jsx)("div",{className:"reference-close",onClick:()=>{null==d||d()},children:RX(e,"xs")})]})}let e=(null==i?void 0:i.icon)||"https://img.alicdn.com/imgextra/i3/O1CN01hpxNXz26hRw9Jz4O1_!!6000000007693-55-tps-200-200.svg";return(0,e3.jsxs)("div",{className:`reference-header ${u}`,onClick:e=>{(e.stopPropagation(),p)?p(!f):_(!f)},children:[(0,e3.jsxs)("div",{className:"reference-name",children:[RX(e),(0,e3.jsx)("div",{className:"reference-title",children:null==i?void 0:i.title})]}),(0,e3.jsx)("div",{className:"reference-operate",onClick:e=>{(e.stopPropagation(),s)?s(!f):_(!f)},children:(0,e3.jsx)(RJ,{type:f?"arrow-up":"arrow-down",size:"xs"})})]})})(),a&&0!==a.length&&(f||"simple"!==u)?(0,e3.jsxs)("div",{className:`reference-list ${u}`,onClick:e=>{e.stopPropagation(),null==m||m(f)},children:[f&&"simple"===u&&a.map((e,t)=>(0,e3.jsxs)("div",{className:"reference-item",children:[(0,e3.jsx)("span",{className:"reference-item-index",children:t+1}),(null==e?void 0:e.sourceIcon)&&RX(null==e?void 0:e.sourceIcon),(0,e3.jsx)("div",{className:"reference-text",onClick:n=>g(e,t,n),children:null==e?void 0:e.name}),(null==e?void 0:e.modifyTime)&&!1]},t)),"detail"===u&&a.map((e,t)=>(0,e3.jsxs)("div",{className:"reference-item",onClick:n=>g(e,t,n),children:[(0,e3.jsxs)("div",{className:"reference-title",children:[(0,e3.jsxs)("div",{className:"reference-name",children:[(0,e3.jsx)("span",{className:"reference-item-index",children:t+1}),(null==e?void 0:e.sourceIcon)&&RX(null==e?void 0:e.sourceIcon),(0,e3.jsx)("span",{children:null==e?void 0:e.name})]}),(null==e?void 0:e.modifyTime)&&!1]}),(null==e?void 0:e.content)&&(0,e3.jsx)("div",{className:"reference-content",children:null==e?void 0:e.content})]},t))]}):null]})}),BR=p8.config(BM),BA=(0,e5.forwardRef)((e,t)=>{let{className:n,defaultExpanded:o=!1,header:i=(0,e3.jsxs)("div",{children:["相关问题",(0,e3.jsx)(h2,{type:"arrow-right",size:"xxs",style:{marginLeft:2}})]}),expanded:a,recommendList:s=[],onToggle:l,onItemClick:u}=e,[d,p]=(0,e5.useState)(o),m=void 0!==a?a:d;return(0,e3.jsxs)("div",{className:uB()("ct-recommend",n),ref:t,children:[(0,e3.jsx)("div",{className:"recommend-header",onClick:()=>{void 0===a&&p(!m),null==l||l(!m)},children:i}),(0,e3.jsx)(hk.CSSTransition,{in:m,timeout:{enter:0,exit:400},classNames:"recommend-list",unmountOnExit:!0,children:(0,e3.jsx)("div",{className:"recommend-list",children:s.map((e,t)=>(0,e3.jsx)("div",{className:"recommend-container",children:(0,e3.jsx)(hk.CSSTransition,{in:m,timeout:{enter:100*t,exit:0},classNames:"recommend-item",unmountOnExit:!0,appear:!0,children:(0,e3.jsx)("div",{className:"recommend-item",onClick:()=>{null==u||u(e,t)},children:e.title||e.name||e.text})},t)}))})})]})}),BI=p8.config(BA),BL=(0,e5.forwardRef)((e,t)=>{let{className:n,header:o,footer:i,position:a="bottom",value:s,onChange:l,onFocus:u,onBlur:d,onKeyDown:p,enableQuerySug:m,querySugList:h,onQuerySugClick:f}=e,[_,g]=(0,e5.useState)(!1),y=m&&_&&h&&h.length>0;return(0,e3.jsxs)("div",{ref:t,className:uB()("ct-rich-text-input",n),children:[(0,e3.jsx)("div",{className:"header",children:o}),(0,e3.jsxs)("div",{className:uB()("input-container",{focus:_}),children:[(0,e3.jsx)("div",{className:"rich-text-input",contentEditable:!0,onFocus:e=>{g(!0),null==u||u(e)},onBlur:e=>{g(!1),null==d||d(e)},onChange:e=>{null==l||l(e.target.innerText)}}),(0,e3.jsx)("div",{className:"input-footer",children:i}),(0,e3.jsx)(hk.CSSTransition,{in:y,timeout:300,classNames:"query-sug",unmountOnExit:!0,children:(0,e3.jsx)("div",{className:uB()("query-sug",a),children:(0,e3.jsx)("div",{className:"query-sug-list",children:null==h?void 0:h.map((e,t)=>(0,e3.jsx)("div",{className:"query-sug-item",onClick:()=>{null==f||f(e,t)},children:e.label},e.value))})})})]})]})}),BP=(0,e5.forwardRef)((e,t)=>{let{className:n}=e;return(0,e3.jsx)("div",{className:uB()(n,"ct-ai-loading"),ref:t,children:(0,e3.jsxs)("div",{className:uB()("loading-container","short-container"),children:[(0,e3.jsx)("div",{className:uB()("short-bar","short-to-long"),style:{animationDelay:"0s"}}),(0,e3.jsx)("div",{className:uB()("short-bar","short-to-long"),style:{animationDelay:"1s"}}),(0,e3.jsx)("div",{className:uB()("short-bar","short-to-long"),style:{animationDelay:"2s"}})]})})}),BF=p8.config(BP),BY=()=>(0,e3.jsx)("div",{className:"radio-item-icon",children:(0,e3.jsx)("div",{className:"radio-item-circle"})}),BB=RG((0,e5.forwardRef)(e=>{let{options:t,value:n,disabled:o,onChange:i,className:a,style:s,...l}=e;return t&&0!==t.length?(0,e3.jsx)("div",{className:uB()("ct-radio",{"ct-radio-disabled":o},a),style:s,...l,children:t.map(e=>(0,e3.jsx)("div",{className:uB()("radio-item",{active:e.value===n,disabled:o||e.disabled}),onClick:()=>{var t;return t=e.value,void(!o&&!e.disabled&&i&&i(t))},onKeyDown:t=>{var n;return n=e.value,void(!o&&!e.disabled&&("Enter"===t.key||" "===t.key)&&(t.preventDefault(),i&&i(n)))},role:"radio",tabIndex:o||e.disabled?-1:0,"aria-checked":e.value===n,"aria-disabled":o||e.disabled,children:(0,e3.jsxs)("div",{className:"radio-item-content",children:[(0,e3.jsx)("div",{className:"radio-item-icon-column",children:(0,e3.jsx)(BY,{})}),(0,e3.jsx)("div",{className:"radio-item-image-column",children:e.image&&(0,e3.jsx)("div",{className:"radio-item-image",children:(0,e3.jsx)("img",{src:e.image,alt:"",className:"radio-item-image-inner"})})}),(0,e3.jsxs)("div",{className:"radio-item-text-column",children:[(0,e3.jsx)("div",{className:"radio-item-title",children:e.label}),e.description&&(0,e3.jsx)("div",{className:"radio-item-desc",children:e.description})]})]})},e.value))}):null}),{displayName:"Radio"}),Bj=p8.config(BB),BU=RG((0,e5.forwardRef)(e=>{if(!e.options||0===e.options.length)return null;let[t,n]=(0,e5.useState)(e.value||"");e4().useEffect(()=>{void 0!==e.value&&n(e.value)},[e.value]);let o=!!t,i=e.disabled;return(0,e3.jsxs)("div",{className:`ct-radio-group ct-radio-group-list ${i?"ct-radio-group-disabled":""}`,children:[(0,e3.jsx)(Bj,{options:e.options,value:t,onChange:t=>{!e.disabled&&(n(t),e.onChange&&e.onChange(t))},disabled:i}),(0,e3.jsx)(R3,{type:"primary",className:"confirm-button",size:"medium",disabled:!o||e.disabled,onClick:()=>{!e.disabled&&t&&e.onConfirm&&e.onConfirm(t)},children:e.confirmButtonText||"确 认"})]})}),{displayName:"RadioGroup"}),Bz=p8.config(BU),BV=RG((0,e5.forwardRef)(e=>{let{options:t,value:n,disabled:o,onChange:i,className:a,style:s,...l}=e;return t&&0!==t.length?(0,e3.jsx)("div",{className:uB()("ct-checkbox",{"ct-checkbox-disabled":o},a),style:s,...l,children:t.map(e=>{let t=(n||[]).indexOf(e.value)>-1;return(0,e3.jsx)("div",{className:uB()("checkbox-item",{active:t,disabled:o||e.disabled}),onClick:()=>((e,t)=>{if(o||t.disabled)return;let a=n||[],s=a.indexOf(e)>-1?a.filter(t=>t!==e):[...a,e];i&&i(s)})(e.value,e),children:(0,e3.jsxs)("div",{className:"checkbox-item-content",children:[(0,e3.jsx)("div",{className:"checkbox-item-checkbox-column",children:(0,e3.jsx)(f7,{className:"checkbox-item-checkbox",checked:t,disabled:o||e.disabled})}),(0,e3.jsx)("div",{className:"checkbox-item-image-column",children:e.image&&(0,e3.jsx)("div",{className:"checkbox-item-image",children:(0,e3.jsx)("img",{src:e.image,alt:"",className:"checkbox-item-image-inner"})})}),(0,e3.jsxs)("div",{className:"checkbox-item-text-column",children:[(0,e3.jsx)("div",{className:"checkbox-item-title",children:e.label}),e.description&&(0,e3.jsx)("div",{className:"checkbox-item-desc",children:e.description})]})]})},e.value)})}):null}),{displayName:"Checkbox"}),BH=p8.config(BV),BG=RG((0,e5.forwardRef)(e=>{if(!e.options||0===e.options.length)return null;let[t,n]=(0,e5.useState)(e.value||[]);e4().useEffect(()=>{void 0!==e.value&&n(e.value)},[e.value]);let o=t.length>0,i=e.disabled;return(0,e3.jsxs)("div",{className:`ct-checkbox-group ct-checkbox-group-list ${i?"ct-checkbox-group-disabled":""}`,children:[(0,e3.jsx)(BH,{options:e.options,value:t,onChange:t=>{!e.disabled&&(n(t),e.onChange&&e.onChange(t))},disabled:i}),(0,e3.jsx)(R3,{type:"primary",className:"confirm-button",size:"medium",disabled:!o||e.disabled,onClick:()=>{!e.disabled&&t.length>0&&e.onConfirm&&e.onConfirm(t)},children:e.confirmButtonText||"确 认"})]})}),{displayName:"CheckboxGroup"}),BW=p8.config(BG),BK=AF(e=>{let{className:t,dataSource:n,mode:o="single",buttonCols:i=2,value:a,size:s="medium",onChange:l}=e,[u,d]=(0,e5.useState)(a),p=Array.from({length:Math.ceil(((null==n?void 0:n.length)||0)/i)},(e,t)=>{let a=t*i,p=Math.min(a+i,(null==n?void 0:n.length)||0),m=null==n?void 0:n.slice(a,p);return(null==m?void 0:m.length)?(0,e3.jsx)("div",{className:"select-row-container",children:m&&m.length?m.map((e,t)=>{if(!e)return null;let{value:n,label:a,disabled:p}=e,m="normal";"string"==typeof u&&u===n||Array.isArray(u)&&u.includes(n)?m="selected":"object"==typeof u&&"value"in u&&u.value===n&&(m="selected");let h=p;return u&&"single"===o&&"normal"===m&&(h=!0),(0,e3.jsx)(_R,{onClick:()=>((e,t)=>{if("multiple"===o)if(Array.isArray(u)){let n="normal"===t?[...u,null==e?void 0:e.value]:u.filter(t=>t!==(null==e?void 0:e.value));d(n),null==l||l(n,"itemClick")}else{let t=[null==e?void 0:e.value];d(t),null==l||l(t,"itemClick")}if("single"===o){let n="normal"===t?e:void 0;d(n),null==l||l(n,"itemClick")}})(e,m),type:"normal",disabled:h,className:`select-item ${m} row${i}`,size:s,children:a},`select_${t}`)}):null},`row_${t}`):null});return(0,e3.jsx)("div",{className:uB()("ct-select",t),children:p})},{coverStyle:!1,labelLayout:"vertical",enableHoverState:!1}),Bq=AF((0,e5.forwardRef)((e,t)=>{let{className:n,size:o="medium",mode:i="single",onChange:a,...s}=e;return(0,e3.jsx)(gU,{...s,className:uB()("ct-select",n),size:o,ref:t,mode:i,onChange:a})})),B$=RG((0,e5.forwardRef)((e,t)=>{let{className:n,display:o="select",buttonCols:i=2,dataSource:a,mode:s="single",onChange:l,...u}=e;return"button"===((null==a?void 0:a.length)&&(null==a?void 0:a.length)>6?"select":o)?(0,e3.jsx)(BK,{className:n,dataSource:a,mode:s,buttonCols:i,value:u.value,onChange:l,label:u.label,required:u.required,size:"medium"}):(0,e3.jsx)(Bq,{...u,className:uB()("ct-select",n),dataSource:a,ref:t,mode:s,onChange:l,label:u.label,required:u.required,size:"medium",popupClassName:uB()("ct-select-popup",u.popupClassName)})}),{displayName:"Select"}),BQ=p8.config(B$),BJ=(0,e5.forwardRef)((e,t)=>{let{className:n,defaultExpanded:o=!1,header:i=(0,e3.jsx)("div",{children:"折叠面板头部"}),customHeader:a,expanded:s,onToggle:l,animated:u=!0,children:d=(0,e3.jsxs)("div",{children:[(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"}),(0,e3.jsx)("div",{children:"折叠面板内容"})]})}=e,p=(0,e5.useRef)(null),m=(0,e5.useRef)(null),[h,f]=(0,e5.useState)(o),[_,g]=(0,e5.useState)(o),y=void 0!==s?s:h,b=(e,t)=>{var n;if(!u)return void(t?(e.style.height="auto",e.style.width="auto",g(!0)):(e.style.height="0",g(!1)));let o=e.getBoundingClientRect().height,i=e.getBoundingClientRect().width,a=(null==(n=m.current)?void 0:n.getBoundingClientRect().width)||i;if(t){e.style.height="0",e.style.width=`${a}px`,e.style.transition="height 0.3s ease, width 0.3s ease",e.getBoundingClientRect(),e.style.height="auto";let t=e.getBoundingClientRect().height,n=e.getBoundingClientRect().width;e.style.height="0",e.getBoundingClientRect(),requestAnimationFrame(()=>{e.style.height=`${t}px`,e.style.width=`${n}px`});let o=()=>{e.style.height="auto",e.style.width="auto",g(!0),e.removeEventListener("transitionend",o)};e.addEventListener("transitionend",o)}else{e.style.height=`${o}px`,e.style.width=`${i}px`,e.style.transition="height 0.3s ease, width 0.3s ease",e.getBoundingClientRect(),requestAnimationFrame(()=>{e.style.height="0",e.style.width=`${a}px`});let t=()=>{g(!1),e.removeEventListener("transitionend",t)};e.addEventListener("transitionend",t)}};return(0,e5.useEffect)(()=>{let e=p.current;e&&(y?(g(!0),u?Promise.resolve().then(()=>{b(e,!0)}):(e.style.height="auto",e.style.width="auto")):u?b(e,!1):(e.style.height="0",g(!1)))},[y,u]),(0,e3.jsxs)("div",{className:uB()("ct-flip",n),ref:t,children:[(0,e3.jsx)("div",{className:"flip-header-container",ref:m,children:a||(0,e3.jsxs)("div",{className:"flip-header",onClick:()=>{let e=!y;null==l||l(e),void 0===s&&f(e)},children:[i,(0,e3.jsx)("span",{className:"flip-header-icon",children:(0,e3.jsx)(RJ,{type:y?"arrow-up":"arrow-down",size:"xs"})})]})}),(0,e3.jsx)("div",{className:"flip-content",ref:p,style:{height:o?"auto":0,width:o?"auto":"100%",overflow:"hidden",transition:u?void 0:"none"},children:_&&d})]})}),BX=p8.config(BJ),BZ=(0,e5.forwardRef)((e,t)=>{let{useText:n="使用",name:o,className:i,selected:a=!1,status:s,onToolClick:l,authInfo:u,fullWidth:d,param:p,groupName:m,disabled:h=!1}=e,f=a?"selected":"";return f=d?`${f} full-width`:`${f}`,f=l?`${f} enable-click`:`${f}`,(0,e3.jsxs)("div",{className:uB()(`ct-tool-status ${f} ${s} ${h?"disabled":""}`,i),ref:t,onClick:t=>{h||(t.stopPropagation(),null==l||l(e))},children:[(0,e3.jsx)(RJ,{size:"xs",type:"failed"===s?"icon-cross1":"completed"===s?"icon-check":"loading"}),u&&"auth"===s&&(0,e3.jsx)("div",{className:"next-btn-text next-btn-primary",onClick:t=>{var n;t.stopPropagation(),null==u||null==(n=u.onAuthClick)||n.call(u,e)},children:null==u?void 0:u.content}),(0,e3.jsxs)("div",{className:"content-container",children:[(0,e3.jsx)("div",{className:"content-use-tips",children:n}),m&&(0,e3.jsx)("div",{className:"content-group",children:m}),o&&(0,e3.jsx)("div",{className:"content-name",children:o}),p&&(0,e3.jsx)("div",{className:"content-detail",children:p})]})]})}),B1=p8.config(BZ),B0=RG((0,e5.forwardRef)(e=>{let{className:t,children:n,...o}=e;return(0,e3.jsx)(yJ,{...o,className:uB()("ct-collapse",t),children:n})}),{displayName:"Collapse",Panel:yJ.Panel}),B2=p8.config(B0),B3=(0,e5.forwardRef)((e,t)=>{let{className:n,size:o="small",hasBorder:i=!0,title:a,showCopyButton:s,...l}=e,[u,d]=(0,e5.useState)(!1);return(0,e3.jsxs)("div",{className:"ct-table-container",children:[a?(0,e3.jsxs)("div",{className:"ct-table-header",children:[a&&(0,e3.jsx)("div",{className:"ct-table-title",children:a}),s?(0,e3.jsx)("div",{className:"ct-table-copy-button",onClick:()=>{d(!0),setTimeout(()=>{d(!1)},3e3)},children:(0,e3.jsx)(RJ,{size:16,type:u?"icon-check":"fuzhi3"})}):null]}):null,(0,e3.jsx)(ko,{...l,ref:t,className:uB()("ct-table",{[`ct-table-${o}`]:o,"ct-table-no-border":!i},n),size:o})]})});B3.displayName="Table";let B5=p8.config(B3),B4=(0,e5.forwardRef)((e,t)=>{let{className:n,text:o,...i}=e;return(0,e3.jsxs)("div",{...i,className:uB()("ct-error-notice",n),ref:t,children:[(0,e3.jsx)("div",{className:"ct-error-notice-icon",children:(0,e3.jsx)(h2,{size:16,type:"prompt"})}),(0,e3.jsx)("span",{className:"ct-error-notice-text",children:o})]})});B4.displayName="ErrorNotice";let B6=p8.config(B4),B9=(0,e5.forwardRef)((e,t)=>{let{className:n,...o}=e;return(0,e3.jsx)("div",{...o,className:uB()("ct-document-empty",n),ref:t,children:Array.from({length:4},(e,t)=>(0,e3.jsx)("div",{className:"ct-empty-line"},t))})});B9.displayName="Empty";let B8=p8.config(B9),B7=(0,e5.forwardRef)((e,t)=>{let{className:n,title:o="",content:i,generating:a=!0,onPreview:s,onCopy:l,onDownload:u,renderDownloadAction:d,showPreviewButton:p=!0,showCopyButton:m=!0,showDownloadButton:h=!0,contentHeight:f=128,..._}=e,g=f-25,y=(0,e5.useRef)(null),[b,E]=(0,e5.useState)(0),[S,T]=(0,e5.useState)(!1),[C,k]=(0,e5.useState)(()=>f>128?128:f),x=e=>{let t=Array.from(e.children);return 0===t.length?e:x(t[t.length-1])},w=(0,e5.useCallback)(()=>{let e=y.current;if(!e)return;let t=e.getBoundingClientRect(),n=x(e);if(!n)return;let o=n.getBoundingClientRect(),i=o.top-t.top,s=a?i+o.height:i+o.height+20;if(f>128&&C<f){let e=C-25;if(s>e)return void k(Math.min(f,C+(s-e)))}if(!(s+b<g&&i+b>0))return void E(-i)},[b,f,C,a]),N=Av(w,200);(0,e5.useEffect)(()=>{w()},[a]),(0,e5.useEffect)(()=>{if("string"==typeof i)return void N();if(!y.current)return;let e=new MutationObserver(()=>{N()});return e.observe(y.current,{childList:!0,subtree:!0,characterData:!0}),()=>{e.disconnect()}},[i,N]);let D=e=>{o&&p&&s&&(e.stopPropagation(),null==s||s())},O=e=>{e.stopPropagation()};return(0,e3.jsxs)("div",{..._,className:uB()("ct-document",{"ct-document-generating":a},n),ref:t,onClick:D,children:[o?(0,e3.jsxs)("div",{className:"ct-document-header",children:[(0,e3.jsxs)("div",{className:"ct-document-header-left",children:[(0,e3.jsx)(RJ,{type:"document",className:"ct-document-header-icon"}),(0,e3.jsx)("span",{className:uB()("ct-document-header-title"),children:o})]}),(0,e3.jsxs)("div",{className:uB()("ct-document-header-actions"),children:[(0,e3.jsxs)("div",{className:uB()("ct-document-header-preview",{"ct-document-header-preview-display-none":!p||!s,"ct-document-header-preview-generating":a}),onClick:D,children:[(0,e3.jsx)(RJ,{type:"preview",className:"ct-document-header-preview-icon"}),(0,e3.jsx)("span",{className:"ct-document-header-preview-text",children:"预览"})]}),(0,e3.jsx)("div",{className:uB()("ct-document-header-action","ct-document-header-action-copy",{"ct-document-header-action-copy-generating":a,"ct-document-header-action-copy-display-none":!m||!l}),onClick:e=>{e.stopPropagation(),null==l||l(),T(!0),setTimeout(()=>{T(!1)},3e3)},title:"复制",children:(0,e3.jsx)(RJ,{type:S?"icon-check":"fuzhi3",className:"ct-document-header-action-icon"})}),(0,e3.jsx)("div",{className:uB()("ct-document-header-action","ct-document-header-action-download",{"ct-document-header-action-download-generating":a,"ct-document-header-action-download-display-none":!h||!d&&!u}),onClick:d?O:e=>{e.stopPropagation(),null==u||u()},title:d?void 0:"下载",children:d?d():(0,e3.jsx)(RJ,{type:"download",className:"ct-document-header-action-icon"})})]})]}):(0,e3.jsx)("div",{className:"ct-document-header",children:(0,e3.jsxs)("div",{className:"ct-document-header-left",children:[(0,e3.jsx)("div",{className:"ct-document-header-left-icon-empty"}),(0,e3.jsx)("div",{className:"ct-document-header-left-title-empty"})]})}),i?(0,e3.jsxs)("div",{className:uB()("ct-document-content",{"ct-document-content-generating":a}),style:{height:C},children:[(0,e3.jsx)("div",{className:"ct-document-mask"}),(0,e3.jsx)("div",{className:"ct-document-content-inner",children:(0,e3.jsx)("div",{ref:y,className:"ct-document-content-text",style:{transform:`translateY(${a?b:0}px)`},onClick:O,children:i})})]}):(0,e3.jsx)("div",{className:uB()("ct-document-content",{"ct-document-content-generating":a}),children:(0,e3.jsx)("div",{className:"ct-document-content-inner",children:(0,e3.jsx)(B8,{})})})]})});B7.displayName="Document";let je=p8.config(B7),jt="0.3.62",jn=e=>{let{globalExpandCode:t}=e,[n,o]=(0,e5.useState)(!1),[i,a]=(0,e5.useState)(t);(0,e5.useEffect)(()=>{o(!0)},[]),(0,e5.useEffect)(()=>{a(t)},[t]);let s=e.docInfo.tags.reduce((e,t)=>(e[t.tag]=t.content,e),{}),l=(0,iZ.kebabCase)(e.demoKey),d=`${l}-container`;return(0,e3.jsxs)("div",{id:d,className:"next-demo-item scroll-count-item",children:[(0,e3.jsxs)("div",{id:`${l}-desc`,className:"demo-item-desc markdown",children:[(0,e3.jsx)(i1,{id:d,title:s["@demo"],component:"h3"}),(0,e3.jsx)("div",{className:"demo-item-desc-body markdown",children:(0,e3.jsx)(ob,{remarkPlugins:[iR],children:s["@remarks"]})})]}),(0,e3.jsxs)(uA,{disabled:e.disabled,code:e.sourceCode,scope:{mountNode:document.querySelector(`#${l}-mount`),require:e=>{let t={"@alifd/chat":e2,"@alifd/next":e$,"react-dom":e6,"styled-components":eQ,react:e4(),classnames:uB()},n=e.match(/^@alifd\/chat\/(es|lib)\/(.*)\/style$/);return n&&u(64615)(`./${n[2]}/style`),t[e]}},noInline:!0,children:[(0,e3.jsx)("div",{id:`${l}-mount`,className:"next-demo-mount",children:n?(0,e3.jsx)(uL,{}):null}),n?(0,e3.jsx)(uF,{}):null,(0,e3.jsx)("div",{id:`${l}-operations`,className:"demo-item-operations",style:{borderBottom:"1px dashed rgb(238, 238, 238)"},children:(0,e3.jsx)("div",{id:`${l}-fold-code`,className:"code-box-code-action code-expand-icon-hide",children:(0,e3.jsxs)(fl.Tooltip,{align:"b",style:{maxWidth:400},trigger:(0,e3.jsx)("span",{id:`${l}-icon-hide`,onClick:()=>{a(!i)},children:(0,e3.jsx)("svg",{width:20,height:20,viewBox:"0 0 20 20",style:{fill:"#3B9AFF"},children:(0,e3.jsx)("path",{transform:"translate(10.457453, 10.101961) rotate(90.000000) translate(-10.457453, -10.101961)",d:"M14.4307124,13.5667899 L15.1349452,14.276759 L10.7473676,18.6288871 L6.42783259,14.2738791 L7.13782502,13.5696698 L10.7530744,17.2147744 L14.4307124,13.5667899 Z M4.79130753,8.067524 L16.3824174,11.1733525 L16.1235984,12.1392784 L4.53248848,9.03344983 L4.79130753,8.067524 Z M10.8154102,1.57503552 L15.1349452,5.93004351 L14.4249528,6.63425282 L10.809949,2.98914817 L7.13206544,6.6371327 L6.42783259,5.92716363 L10.8154102,1.57503552 Z"})})}),children:["收起代码",(0,e3.jsx)("br",{}),(0,e3.jsx)("br",{}),"小提示:",(0,e3.jsx)("br",{}),(0,e3.jsx)("br",{}),(0,e3.jsx)("strong",{children:"1. 点击一下代码，试一试在线编辑预览吧！"}),(0,e3.jsx)("br",{}),(0,e3.jsx)("br",{}),(0,e3.jsx)("strong",{children:"2. 页面右上方 有 全局代码展开 及 开启在线编辑 模式哟～"})]})})}),(0,e3.jsx)("div",{id:`${l}-body`,className:"next-demo-body",style:{display:i?"block":"none"},children:(0,e3.jsx)("div",{id:`${l}-live-editor`,children:(0,e3.jsx)("div",{id:`${l}-live-body`,className:"react-live-body",children:(0,e3.jsx)(uI,{theme:{plain:{},styles:[{types:[],style:{}}]}})})})})]})]})},jr=e=>{let{defaultLiveDemo:t=!0,defaultExpandCode:n=!0,onToggleExpandCode:o,onToggleLiveDemo:i,data:a=[]}=e,[s,l]=(0,e5.useState)(n),[u,d]=(0,e5.useState)(t),p={viewBox:"0 0 16 16",focusable:"false",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true","aria-haspopup":"true","aria-expanded":"false",style:{width:20,height:20,padding:2}};return(0,e3.jsxs)("div",{className:"demo-index",children:[(0,e3.jsxs)("span",{id:"global-control",className:"all-demo-box-controls",children:[(0,e3.jsx)(fl.Tooltip,{trigger:(0,e3.jsxs)("span",{id:"live-demo",role:"img","aria-label":"edit",className:"code-box-expand-trigger",onClick:()=>{d(!u),"function"==typeof i&&i(!u)},children:[(0,e3.jsx)("svg",{...p,"data-icon":"edit",id:"live-on",style:{...p.style,display:u?"none":"block"},children:(0,e3.jsx)("path",{d:"M9.69559557,3.62666667 L2.20866223,11.1146667 L1.8673289,12.3562667 L3.1153289,12.0181333 L10.6011956,4.53226667 L9.69559557,3.62666667 Z M10.4497289,2.87253333 L11.3553289,3.77813333 L12.2673289,2.86613333 C12.4290988,2.70436348 12.4922771,2.46857876 12.4330652,2.24759702 C12.3738533,2.02661528 12.201247,1.85400889 11.9802652,1.79479701 C11.7592835,1.73558513 11.5234988,1.79876346 11.3617289,1.96053333 L10.4497289,2.87253333 L10.4497289,2.87253333 Z M13.0203956,1.20639113 C13.3405419,1.52647328 13.5204044,1.96062968 13.5204044,2.41333333 C13.5204044,2.86603699 13.3405419,3.30019339 13.0203956,3.62026667 L3.6689289,12.9728 L0.346262232,13.8741333 L1.25506223,10.5589333 L10.6075956,1.20639113 C10.9276688,0.886253633 11.3618252,0.706391131 11.8145289,0.706391131 C12.2672326,0.706391131 12.701389,0.886253633 13.0214622,1.20639113 L13.0203956,1.20639113 Z M1,15 L11,15 L11,16 L1,16 L1,15 Z"})}),(0,e3.jsx)("svg",{...p,id:"live-off","data-icon":"edit",style:{...p.style,display:u?"block":"none"},children:(0,e3.jsx)("path",{d:"M9.69559557,3.62666667 L2.20866223,11.1146667 L1.8673289,12.3562667 L3.1153289,12.0181333 L10.6011956,4.53226667 L9.69559557,3.62666667 Z M10.4497289,2.87253333 L11.3553289,3.77813333 L12.2673289,2.86613333 C12.4290988,2.70436348 12.4922771,2.46857876 12.4330652,2.24759702 C12.3738533,2.02661528 12.201247,1.85400889 11.9802652,1.79479701 C11.7592835,1.73558513 11.5234988,1.79876346 11.3617289,1.96053333 L10.4497289,2.87253333 L10.4497289,2.87253333 Z M13.0203956,1.20639113 C13.3405419,1.52647328 13.5204044,1.96062968 13.5204044,2.41333333 C13.5204044,2.86603699 13.3405419,3.30019339 13.0203956,3.62026667 L3.6689289,12.9728 L0.346262232,13.8741333 L1.25506223,10.5589333 L10.6075956,1.20639113 C10.9276688,0.886253633 11.3618252,0.706391131 11.8145289,0.706391131 C12.2672326,0.706391131 12.701389,0.886253633 13.0214622,1.20639113 L13.0203956,1.20639113 Z M1,15 L11,15 L11,16 L1,16 L1,15 Z"})})]}),children:"使用预览模式"}),(0,e3.jsx)(fl.Tooltip,{trigger:(0,e3.jsxs)("span",{id:"expand-all",role:"img","aria-label":"code",className:"code-box-expand-trigger","aria-haspopup":"true","aria-expanded":"false",onClick:()=>{l(!s),"function"==typeof o&&o(!s)},children:[(0,e3.jsx)("svg",{...p,id:"all-not-expand","data-icon":"code",style:{...p.style,display:s?"none":"block"},children:(0,e3.jsx)("path",{d:"M16,0 L16,16 L0,16 L0,0 L16,0 Z M15,1 L1,1 L1,15 L15,15 L15,1 Z M13,11 L13,12 L8,12 L8,11 L13,11 Z M3.33419059,3.86073652 L7.22040532,7.74695124 L3.33419127,11.6331801 L2.62708313,10.9260747 L5.806,7.747 L2.62708313,4.5678433 L3.33419059,3.86073652 Z"})}),(0,e3.jsx)("svg",{...p,id:"all-expanded","data-icon":"code",style:{...p.style,display:s?"block":"none"},children:(0,e3.jsx)("path",{d:"M16,0 L16,16 L0,16 L0,0 L16,0 Z M15,1 L1,1 L1,15 L15,15 L15,1 Z M13,11 L13,12 L8,12 L8,11 L13,11 Z M3.33419059,3.86073652 L7.22040532,7.74695124 L3.33419127,11.6331801 L2.62708313,10.9260747 L5.806,7.747 L2.62708313,4.5678433 L3.33419059,3.86073652 Z"})})]}),children:"展开所有代码"})]}),(0,e3.jsx)("ul",{className:"demo-index-list",children:a.map(e=>(0,e3.jsx)("li",{className:"demo-index-item","data-id":e.id,children:(0,e3.jsx)("a",{href:`#${e.id}`,children:e.title})},e.id))})]})};e6.render((0,e3.jsx)(()=>{var e;let[t,n]=(0,e5.useState)(!0),[o,i]=(0,e5.useState)(!1),a={layout:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst defaultButtonSize = "medium";\nconst LayoutDemo = () => {\n return (\n <>\n <div>\n <div>拉升充满容器（默认）</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "取消" },\n { type: "primary", label: "确定" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>右侧布局</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n layout="end"\n dataSource={[\n { type: "normal", label: "取消" },\n { type: "primary", label: "确定" },\n ]}\n />\n </div>\n </div>\n </>\n );\n};\nReactDOM.render(<LayoutDemo />, mountNode);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"展示 Button.Group 组件的不同布局方式，包括左侧、右侧和拉升充满容器。"},{tag:"@demo",content:"布局方式"},{tag:"@en",content:"Layout Modes"},{tag:"@order",content:"3"}]}},size:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>大尺寸 Large</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size="large">\n 发送消息\n </Button>\n <Button type="secondary" size="large">\n 保存草稿\n </Button>\n <Button type="normal" size="large">\n 取消\n </Button>\n <Button type="primary" size="large" loading>\n 加载中\n </Button>\n <Button type="primary" size="large" disabled>\n 禁用状态\n </Button>\n <Button warning size="large">\n 删除\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>中尺寸 Medium</h4>\n <div className="demo-mobile-wrap">\n <Button size="medium" type="primary">\n 发送消息\n </Button>\n <Button size="medium" type="secondary">\n 保存草稿\n </Button>\n <Button size="medium" type="normal">\n 取消\n </Button>\n <Button size="medium" type="primary" loading>\n 加载中\n </Button>\n <Button size="medium" type="primary" disabled>\n 禁用状态\n </Button>\n <Button size="medium" warning>\n 删除\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>小尺寸 Small</h4>\n <div className="demo-mobile-wrap">\n <Button size="small" type="primary">\n 收藏\n </Button>\n <Button size="small" type="secondary">\n 编辑\n </Button>\n <Button size="small" type="normal">\n 删除\n </Button>\n <Button size="small" type="primary" loading>\n 加载中\n </Button>\n <Button size="small" type="primary" disabled>\n 禁用状态\n </Button>\n <Button size="small" warning>\n 删除\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮有三种尺寸：大、中、小。\n- 大尺寸 Large：-\n- 中尺寸 Medium：用于大多数标准布局，对会话卡片进行全局操作的按钮。不建议在列表中使用。\n- 小尺寸 Small：用于内置在列表中的按钮。不建议用于会话卡片中的主要交互按钮的关键操作。"},{tag:"@demo",content:"按钮尺寸"},{tag:"@en",content:"Button Size"},{tag:"@order",content:"2"}]}},states:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst defaultButtonSize = "medium";\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>主按钮 Primary</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button type="primary" size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button type="primary" size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button type="primary" size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button type="primary" size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>次按钮 Secondary</h4>\n <div className="demo-mobile-wrap">\n <Button type="secondary" size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button type="secondary" size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button type="secondary" size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button type="secondary" size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button type="secondary" size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>普通按钮 Normal</h4>\n <div className="demo-mobile-wrap">\n <Button type="normal" size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button type="normal" size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button type="normal" size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button type="normal" size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button type="normal" size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>文本按钮 Text</h4>\n <div className="demo-mobile-wrap">\n <Button text size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button text size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button text size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button text size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button text size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>警示按钮 Warning</h4>\n <div className="demo-mobile-wrap">\n <Button warning size={defaultButtonSize}>\n 正常态 Normal\n </Button>\n <Button warning size={defaultButtonSize} className="hover">\n 悬停态 Hover\n </Button>\n <Button warning size={defaultButtonSize} className="active">\n 激活态 Active\n </Button>\n <Button warning size={defaultButtonSize} disabled>\n 禁用态 Disabled\n </Button>\n <Button warning size={defaultButtonSize} loading>\n 加载态 Loading\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮在不同的交互阶段呈现不同的视觉状态：\n- 正常态(Normal)：按钮的默认状态。\n- 悬停态(Hover)：鼠标悬停在按钮上时的状态。\n- 激活态(Active)：点击按钮时的瞬时状态。"},{tag:"@demo",content:"按钮状态"},{tag:"@en",content:"Button States"},{tag:"@order",content:"1"}]}},type:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button, Text } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nimport "@alifd/chat/es/text/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst defaultButtonSize = "medium";\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>主要按钮 Primary</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize}>\n Primary\n </Button>\n <Button type="primary" size={defaultButtonSize} disabled>\n 禁用状态\n </Button>\n <Button type="primary" size={defaultButtonSize} loading>\n 加载中\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>次要按钮 Secondary</h4>\n <div className="demo-mobile-wrap">\n <Button type="secondary" size={defaultButtonSize}>\n Secondary\n </Button>\n <Button type="secondary" size={defaultButtonSize} disabled>\n 禁用状态\n </Button>\n <Button type="secondary" size={defaultButtonSize} loading>\n 加载中\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>普通按钮 Normal</h4>\n <div className="demo-mobile-wrap">\n <Button type="normal" size={defaultButtonSize}>\n Normal\n </Button>\n <Button type="normal" size={defaultButtonSize} disabled>\n 禁用状态\n </Button>\n <Button type="normal" size={defaultButtonSize} loading>\n 加载中\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>文本按钮 Text</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" text size="large">\n primary\n </Button>\n </div>\n <div\n style={{\n marginTop: 12,\n display: "flex",\n alignItems: "baseline",\n gap: 0,\n }}\n >\n <Text>这是一段文本，其中包含一个</Text>\n <Button size={defaultButtonSize} type="primary" text>\n 退订操作\n </Button>\n <Text>按钮。</Text>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>警示按钮 Warning</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" warning size={defaultButtonSize}>\n Delete\n </Button>\n <Button type="primary" warning disabled size={defaultButtonSize}>\n Disabled Warning\n </Button>\n <Button type="primary" warning loading size={defaultButtonSize}>\n Loading\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮有五种类型：主要按钮、次要按钮、普通按钮、文本按钮和警示按钮。\n- 主要按钮(Primary)：用于关键正向操作，用于提交表单、保存数据、查询、信息确认等。\n- 次要按钮(Secondary)：用于区分辅助操作、次要功能，如保存(`secondary`)与提交(`primary`)；不建议在需要强调主次分明的界面中过多使用。\n- 普通按钮(Normal)：用于一般交互如取消操作、关闭功能等非核心功能，或多个同层级内容的选项；不建议用于需要用户重点关注的主要功能。\n- 文本按钮(Text)：用于在文本中触发具体功能的非重要功能按钮，如退订、关闭。不建议用于独立于文本使用的操作按钮。\n- 警示按钮(Warning)：用于删除或不可逆操作的确认按钮，如重要表单数据删除的二次确认。不建议用于普通操作。"},{tag:"@demo",content:"按钮类型"},{tag:"@en",content:"Button Type"},{tag:"@order",content:"0"}]}},icon:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst defaultButtonSize = "medium";\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>无Icon</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize}>\n 发送消息\n </Button>\n <Button type="secondary" size={defaultButtonSize}>\n 保存草稿\n </Button>\n <Button type="normal" size={defaultButtonSize}>\n 取消操作\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>前置Icon</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize} icon="refresh">\n 发送消息\n </Button>\n <Button type="secondary" size={defaultButtonSize} icon="refresh">\n 保存草稿\n </Button>\n <Button type="normal" size={defaultButtonSize} icon="refresh">\n 取消操作\n </Button>\n <Button text size={defaultButtonSize} icon="copy">\n 复制文本\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>不同尺寸的图标按钮 Icon Buttons in Different Sizes</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size="large" icon="refresh">\n 刷新\n </Button>\n <Button type="primary" size="medium" icon="refresh">\n 刷新\n </Button>\n <Button type="primary" size="small" icon="refresh">\n 刷新\n </Button>\n <Button text size="large" icon="copy">\n 复制\n </Button>\n <Button text size="medium" icon="copy">\n 复制\n </Button>\n <Button text size="small" icon="copy">\n 复制\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮可以搭配不同位置的图标使用：\n- 无Icon：用于操作意图明确、界面简洁的场景，不建议在用户无法理解按钮含义的情况下使用。\n- 前置Icon：用于提快速识别语义的视觉提示，适合功能性强的操作。不建议在文案已足够清晰的情况下使用。\n- 后置Icon：暂未实现。用于引导用户进一步操作或查看扩展内容，不建议在核心操作路径中或用户需快速决策的场景下使用。"},{tag:"@demo",content:"按钮图标"},{tag:"@en",content:"Button Icons"},{tag:"@order",content:"3"}]}},disabled:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst defaultButtonSize = "medium";\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>普通禁用</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize} disabled>\n 主按钮\n </Button>\n <Button type="secondary" size={defaultButtonSize} disabled>\n 次按钮\n </Button>\n <Button type="normal" size={defaultButtonSize} disabled>\n 普通按钮\n </Button>\n <Button text size={defaultButtonSize} disabled>\n 文本按钮\n </Button>\n <Button warning size={defaultButtonSize} disabled>\n 删除按钮\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>带图标的禁用按钮</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" icon="plus" size={defaultButtonSize} disabled>\n 新建\n </Button>\n <Button type="secondary" icon="edit" size={defaultButtonSize} disabled>\n 编辑\n </Button>\n <Button text icon="delete" size={defaultButtonSize} disabled>\n 删除\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>不同尺寸的禁用按钮</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size="large" disabled>\n 大尺寸保存\n </Button>\n <Button type="primary" size="medium" disabled>\n 中尺寸保存\n </Button>\n <Button type="primary" size="small" disabled>\n 小尺寸保存\n </Button>\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>禁用和加载状态</h4>\n <div className="demo-mobile-wrap">\n <Button type="primary" size={defaultButtonSize} disabled>\n 发送消息\n </Button>\n <Button type="primary" size={defaultButtonSize} loading disabled>\n 发送中...\n </Button>\n <Button\n type="primary"\n icon="refresh"\n size={defaultButtonSize}\n loading\n disabled\n >\n 加载中\n </Button>\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮的禁用状态，用于条件不满足时，如未填写完整信息的表单提交按钮。不建议用于用户需频繁操作的常规按钮。"},{tag:"@demo",content:"禁用状态"},{tag:"@en",content:"Disabled State"},{tag:"@order",content:"6"}]}},group:{sourceCode:'import React from "react";\nimport ReactDOM from "react-dom";\nimport { Button } from "@alifd/chat";\nimport "@alifd/chat/es/button/style";\nconst defaultButtonSize = "medium";\nconst buttonGroupStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "32px",\n};\nconst sectionStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "8px",\n};\nconst contentAreaStyle = {\n display: "flex",\n flexDirection: "column",\n gap: "24px",\n};\nconst HorizontalButtonGroupDemo = () => (\n <>\n <div>\n <div>单个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[{ type: "primary", label: "确认" }]}\n />\n </div>\n </div>\n\n <div>\n <div>两个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "取" },\n { type: "primary", label: "确认" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>三个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "更" },\n { type: "normal", label: "取消" },\n { type: "primary", label: "确认吗" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>设置了最小宽度的三个按钮 - 窄屏</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="row"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "更多", style: { minWidth: "200px" } },\n { type: "normal", label: "取消", style: { minWidth: "200px" } },\n { type: "primary", label: "确认", style: { minWidth: "200px" } },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>设置了最小宽度的三个按钮 - 宽屏</div>\n <div className="demo-mobile-wrap large">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "更多", style: { minWidth: "200px" } },\n { type: "normal", label: "取消", style: { minWidth: "200px" } },\n { type: "primary", label: "确认", style: { minWidth: "200px" } },\n ]}\n />\n </div>\n </div>\n </>\n);\nconst VerticalButtonGroupDemo = () => (\n <>\n <div>\n <div>四个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>四个按钮 大尺寸</div>\n <div className="demo-mobile-wrap large">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>五个按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>五个按钮 大尺寸</div>\n <div className="demo-mobile-wrap large">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>带图标的按钮组</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "primary", label: "打印文档", icon: "print" },\n { type: "normal", label: "导出 Excel", icon: "download" },\n { type: "normal", label: "分享链接", icon: "share" },\n { type: "normal", label: "更多操作", icon: "more" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>四个普通按钮</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size={defaultButtonSize}\n dataSource={[\n { type: "normal", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "筛选数据" },\n { type: "normal", label: "更多操作" },\n ]}\n />\n </div>\n </div>\n\n <div>\n <div>不同尺寸(medium)</div>\n <div className="demo-mobile-wrap">\n <Button.Group\n type="column"\n size="small"\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "筛选数据" },\n ]}\n />\n\n <Button.Group\n type="column"\n size="medium"\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "筛选数据" },\n ]}\n />\n\n <Button.Group\n type="column"\n size="large"\n dataSource={[\n { type: "primary", label: "导出报告" },\n { type: "normal", label: "查看历史" },\n { type: "normal", label: "更多操作" },\n { type: "normal", label: "筛选数据" },\n ]}\n />\n </div>\n </div>\n </>\n);\nReactDOM.render(\n <div style={buttonGroupStyle}>\n <section style={sectionStyle}>\n <h4>水平排列（按钮数 ≤ 3）</h4>\n <div style={contentAreaStyle}>\n <HorizontalButtonGroupDemo />\n </div>\n </section>\n\n <section style={sectionStyle}>\n <h4>垂直排列（按钮数 &gt; 3）</h4>\n <div style={contentAreaStyle}>\n <VerticalButtonGroupDemo />\n </div>\n </section>\n </div>,\n mountNode,\n);\n',docInfo:{summary:"",tags:[{tag:"@remarks",content:"按钮组是一个操作类UI组件，用于将多个相关按钮组合在一起，提供统一的外观和交互体验，使用户能够快速选择多个相关操作项。它在卡片中扮演操作集合入口的角色，通常用于多步骤流程、功能选择等场景。\n\n水平排列（Horizontal Button Group）：\n- 使用场景：用于按钮优先级有明显主次区分的情况，按钮数不超过3个。如在提交申请、确定预约等关键操作的情况下使用。不建议按钮文本字数较长使用。\n- 组合规则：按钮按照优先级从高到低从右向左排列，优先级最高的放置在按钮组最右侧，通常有且只有一个最高优的按钮。\n- 布局规则：始终水平充满排列，间距为8px。\n\n垂直排列（Vertical Button Group）：\n- 使用场景：用于按钮优先级没有明显主次区分的情况，按钮数量超过3个。如在选择证明、查询渠道等选择的情况下使用。不建议在有关键操作时使用。\n- 组合规则：按钮按照优先级从上至下纵向排列，优先级最高的放置在按钮组最顶部。\n- 布局规则：始终垂直充满排列，间距为8px。\n\n功能特性：\n- 使用方式：支持子元素方式和 dataSource 数据配置方式\n- 排列方式：通过 type 属性设置 'row'（默认）或 'column' 排列\n- 统一大小：通过 size 属性统一设置组内按钮的大小"},{tag:"@demo",content:"按钮组"},{tag:"@en",content:"Button Group"},{tag:"@order",content:"7"}]}}},s=[{tag:"@remarks",content:"[按钮组件]\xa0是一个\xa0[操作类]\xa0UI 组件，用于\xa0[触发用户交互动作]，包括点击、悬停等行为，使用户能够\xa0[执行命令、提交表单、切换状态等]。它在卡片中扮演\xa0[核心操作入口]\xa0的角色，通常用于\xa0[表单提交、功能切换、数据操作等场景]。"},{tag:"@component",content:"按钮"},{tag:"@en",content:"Button"},{tag:"@type",content:"通用 - General"},{tag:"@others",content:"## 无障碍键盘操作指南\n| 按键 | 说明 |\n| :---- | :---------- |\n| Enter | 触发 onClick 事件 |\n| SPACE | 触发 onClick 事件 |"},{tag:"@othersEn",content:"## ARIA and KeyBoard\n| KeyBoard | Description |\n| :---------- | :------------------------------ |\n| Enter | Trigger the onClick event |\n| SPACE | Trigger the onClick event |"}].reduce((e,t)=>(e[t.tag]=t.content,e),{}),l={id:"demo-list",title:"代码演示"},u=Object.keys(a).sort((e,t)=>{var n,o,i,s;return parseInt((null==(o=a[e].docInfo.tags)||null==(n=o.find(e=>"@order"===e.tag))?void 0:n.content)||"0")-parseInt((null==(s=a[t].docInfo.tags)||null==(i=s.find(e=>"@order"===e.tag))?void 0:i.content)||"0")}),d=[...s["@when"]?[{id:"何时使用",title:"何时使用"}]:[],l,...u.map(e=>{let t=(0,iZ.kebabCase)(e);return{id:`${t}-container`,title:a[e].docInfo.tags.reduce((e,t)=>(e[t.tag]=t.content,e),{})["@demo"]}})];return(0,e3.jsxs)("div",{className:"demo-wrapper",children:[(0,e3.jsx)("div",{className:"demo-title markdown",children:(0,e3.jsx)("h1",{children:s["@en"]})}),(0,e3.jsx)(jr,{defaultExpandCode:o,defaultLiveDemo:t,onToggleLiveDemo:n,onToggleExpandCode:i,data:d}),(0,e3.jsx)("div",{className:"demo-head",children:(0,e3.jsxs)("div",{id:"demo-area",className:"next-demo-section",children:[(0,e3.jsxs)("div",{id:"md-area-former",className:"markdown-body markdown",children:[(0,e3.jsx)("div",{id:"demo-guide",className:"scroll-count-item active"}),(0,e3.jsx)("p",{children:i2(s["@remarks"])}),(e=s["@when"])?(0,e3.jsxs)(e3.Fragment,{children:[(0,e3.jsx)(i1,{id:"何时使用",title:"何时使用"}),(0,e3.jsx)("ul",{children:(0,e3.jsx)("li",{children:i2(e)})})]}):null,(0,e3.jsx)(i1,{...l})]}),u.map((e,n)=>(0,e5.createElement)(jn,{disabled:!t,globalExpandCode:o,...a[e],demoKey:e,key:n})),(0,e3.jsx)("div",{id:"md-area-latter",className:"markdown-body markdown",children:(0,e3.jsxs)("div",{id:"demo-api","data-scroll-id":"demo-api",className:"scroll-count-item active",children:[(0,e3.jsx)(i1,{id:"API",title:"API"}),[{title:"ButtonSize",summary:"按钮大小",apiMode:!0,properties:[]},{title:"ButtonGroupType",summary:"按钮组类型，横/竖排",apiMode:!0,properties:[]},{title:"ButtonGroupLayout",summary:"按钮组布局方式",apiMode:!0,properties:[]}].map(e=>(0,e5.createElement)(i0,{...e,key:e.title})),s["@others"]?(0,e3.jsx)(ob,{remarkPlugins:[iR],rehypePlugins:[iq,[iB,{behavior:"append",content:()=>[iX("span",{},["#"])],properties:{className:"header-anchor scroll-count-item"}}]],children:s["@others"]}):null]})})]})})]})},{}),document.getElementById("root"))})()})();